javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 04:14:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(components): update to use shadow DOM and work with css variables

Browse Source 
- updates components to use shadow DOM or scoped if they require css variables
- moves global styles to an external stylesheet that needs to be imported
- adds support for additional colors and removes the Sass loops to generate colors for each component
- several property renames, bug fixes, and test updates

Co-authored-by: Manu Mtz.-Almeida <manu.mtza@gmail.com>
Co-authored-by: Adam Bradley <adambradley25@gmail.com>
Co-authored-by: Cam Wiegert <cam@camwiegert.com>
This commit is contained in:
Brandy Carney
2018-07-09 12:57:21 -04:00
parent a4659f03b4
commit a7f1f4daa7
710 changed files with 20999 additions and 20853 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
core/src/utils/overlays.ts
View File

@ -3,15 +3,7 @@ import { Animation, AnimationBuilder, Config, Mode } from '../interface';
let lastId = 1;
/**
* Convert an interface where all the properties are optional to mandatory.
*/
export type Requires<K extends string> = {
[P in K]: any;
};
export function createOverlay<T extends HTMLIonOverlayElement & Requires<any>, B>
(element: T, opts: B): Promise<T | null> {
export function createOverlay<T extends HTMLIonOverlayElement, B>(element: T, opts: B): Promise<T> {
// convert the passed in overlay options into props
// that get passed down into the new overlay
Object.assign(element, opts);
@ -118,7 +110,9 @@ async function overlayAnimation(
overlay.animation.destroy();
overlay.animation = undefined;
}
const animation = overlay.animation = await overlay.animationCtrl.create(animationBuilder, baseEl, opts);
const aniRoot = baseEl.shadowRoot || overlay.el;
const animation = overlay.animation = await overlay.animationCtrl.create(animationBuilder, aniRoot, opts);
overlay.animation = animation;
if (!overlay.willAnimate) {
animation.duration(0);
@ -162,8 +156,8 @@ export function isCancel(role: string|undefined): boolean {
return role === 'cancel' || role === BACKDROP;
}
export interface OverlayEventDetail {
data?: any;
export interface OverlayEventDetail<T = any> {
data?: T;
role?: string;
}
@ -191,7 +185,7 @@ export interface OverlayInterface {
}
export interface OverlayController {
create(opts?: any): Promise<HTMLElement | null>;
create(opts?: any): Promise<HTMLElement>;
dismiss(data?: any, role?: string, alertId?: number): Promise<void>;
getTop(): HTMLElement;
}