cargdev/angular
1
0
Fork 0
Code Issues 15 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(animations): introduce a wave of new animation features

Browse Source
This commit is contained in:
Matias Niemelä
2017-04-26 10:44:28 -07:00
committed by Jason Aden
parent d761059e4d
commit 16c8167886
55 changed files with 7732 additions and 2217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
tools/public_api_guard/animations/animations.d.ts vendored
View File

@ -1,6 +1,9 @@
/** @experimental */
export declare function animate(timings: string | number, styles?: AnimationStyleMetadata | AnimationKeyframesSequenceMetadata | null): AnimationAnimateMetadata;
/** @experimental */
export declare function animateChild(options?: AnimationOptions | null): AnimationAnimateChildMetadata;
/** @experimental */
export declare type AnimateTimings = {
duration: number;
@ -8,12 +11,36 @@ export declare type AnimateTimings = {
easing: string | null;
};
/** @experimental */
export declare function animation(steps: AnimationMetadata | AnimationMetadata[], options?: AnimationOptions | null): AnimationReferenceMetadata;
/** @experimental */
export declare abstract class Animation {
abstract create(element: any, options?: AnimationOptions): AnimationPlayer;
}
/** @experimental */
export interface AnimationAnimateChildMetadata extends AnimationMetadata {
options: AnimationOptions | null;
}
/** @experimental */
export interface AnimationAnimateMetadata extends AnimationMetadata {
styles: AnimationStyleMetadata | AnimationKeyframesSequenceMetadata | null;
timings: string | number | AnimateTimings;
}
/** @experimental */
export interface AnimationAnimateRefMetadata extends AnimationMetadata {
animation: AnimationReferenceMetadata;
options: AnimationOptions | null;
}
/** @experimental */
export declare abstract class AnimationBuilder {
abstract build(animation: AnimationMetadata | AnimationMetadata[]): Animation;
}
/** @experimental */
export interface AnimationEvent {
element: any;
@ -26,6 +53,7 @@ export interface AnimationEvent {
/** @experimental */
export interface AnimationGroupMetadata extends AnimationMetadata {
options: AnimationOptions | null;
steps: AnimationMetadata[];
}
@ -46,13 +74,30 @@ export declare const enum AnimationMetadataType {
Sequence = 2,
Group = 3,
Animate = 4,
KeyframeSequence = 5,
Keyframes = 5,
Style = 6,
Trigger = 7,
Reference = 8,
AnimateChild = 9,
AnimateRef = 10,
Query = 11,
Stagger = 12,
}
/** @experimental */
export interface AnimationOptions {
delay?: number | string;
duration?: number | string;
params?: {
[name: string]: any;
};
}
/** @experimental */
export declare abstract class AnimationPlayer {
beforeDestroy?: () => any;
parentPlayer: AnimationPlayer | null;
readonly totalTime: number;
abstract destroy(): void;
abstract finish(): void;
abstract getPosition(): number;
@ -68,11 +113,37 @@ export declare abstract class AnimationPlayer {
abstract setPosition(p: any): void;
}
/** @experimental */
export interface AnimationQueryMetadata extends AnimationMetadata {
animation: AnimationMetadata | AnimationMetadata[];
options: AnimationQueryOptions | null;
selector: string;
}
/** @experimental */
export interface AnimationQueryOptions extends AnimationOptions {
limit?: number;
optional?: boolean;
}
/** @experimental */
export interface AnimationReferenceMetadata extends AnimationMetadata {
animation: AnimationMetadata | AnimationMetadata[];
options: AnimationOptions | null;
}
/** @experimental */
export interface AnimationSequenceMetadata extends AnimationMetadata {
options: AnimationOptions | null;
steps: AnimationMetadata[];
}
/** @experimental */
export interface AnimationStaggerMetadata extends AnimationMetadata {
animation: AnimationMetadata | AnimationMetadata[];
timings: string | number;
}
/** @experimental */
export interface AnimationStateMetadata extends AnimationMetadata {
name: string;
@ -81,31 +152,37 @@ export interface AnimationStateMetadata extends AnimationMetadata {
/** @experimental */
export interface AnimationStyleMetadata extends AnimationMetadata {
offset?: number;
styles: {
offset: number | null;
styles: '*' | {
[key: string]: string | number;
} | {
} | Array<{
[key: string]: string | number;
}[];
} | '*'>;
}
/** @experimental */
export interface AnimationTransitionMetadata extends AnimationMetadata {
animation: AnimationMetadata | AnimationMetadata[];
expr: string | ((fromState: string, toState: string) => boolean);
expr: string;
options: AnimationOptions | null;
}
/** @experimental */
export interface AnimationTriggerMetadata {
export interface AnimationTriggerMetadata extends AnimationMetadata {
definitions: AnimationMetadata[];
name: string;
options: {
params?: {
[name: string]: any;
};
} | null;
}
/** @experimental */
export declare const AUTO_STYLE = "*";
/** @experimental */
export declare function group(steps: AnimationMetadata[]): AnimationGroupMetadata;
export declare function group(steps: AnimationMetadata[], options?: AnimationOptions | null): AnimationGroupMetadata;
/** @experimental */
export declare function keyframes(steps: AnimationStyleMetadata[]): AnimationKeyframesSequenceMetadata;
@ -113,6 +190,7 @@ export declare function keyframes(steps: AnimationStyleMetadata[]): AnimationKey
/** @experimental */
export declare class NoopAnimationPlayer implements AnimationPlayer {
parentPlayer: AnimationPlayer | null;
totalTime: number;
constructor();
destroy(): void;
finish(): void;
@ -130,20 +208,29 @@ export declare class NoopAnimationPlayer implements AnimationPlayer {
}
/** @experimental */
export declare function sequence(steps: AnimationMetadata[]): AnimationSequenceMetadata;
export declare function query(selector: string, animation: AnimationMetadata | AnimationMetadata[], options?: AnimationQueryOptions | null): AnimationQueryMetadata;
/** @experimental */
export declare function sequence(steps: AnimationMetadata[], options?: AnimationOptions | null): AnimationSequenceMetadata;
/** @experimental */
export declare function stagger(timings: string | number, animation: AnimationMetadata | AnimationMetadata[]): AnimationStaggerMetadata;
/** @experimental */
export declare function state(name: string, styles: AnimationStyleMetadata): AnimationStateMetadata;
/** @experimental */
export declare function style(tokens: {
export declare function style(tokens: '*' | {
[key: string]: string | number;
} | Array<{
} | Array<'*' | {
[key: string]: string | number;
}>): AnimationStyleMetadata;
/** @experimental */
export declare function transition(stateChangeExpr: string | ((fromState: string, toState: string) => boolean), steps: AnimationMetadata | AnimationMetadata[]): AnimationTransitionMetadata;
export declare function transition(stateChangeExpr: string, steps: AnimationMetadata | AnimationMetadata[], options?: AnimationOptions | null): AnimationTransitionMetadata;
/** @experimental */
export declare function trigger(name: string, definitions: AnimationMetadata[]): AnimationTriggerMetadata;
/** @experimental */
export declare function useAnimation(animation: AnimationReferenceMetadata, options?: AnimationOptions | null): AnimationAnimateRefMetadata;

1
tools/public_api_guard/animations/browser.d.ts vendored
View File

@ -3,5 +3,6 @@ export declare abstract class AnimationDriver {
abstract animate(element: any, keyframes: {
[key: string]: string | number;
}[], duration: number, delay: number, easing?: string | null, previousPlayers?: any[]): any;
abstract computeStyle(element: any, prop: string, defaultValue?: string): string;
static NOOP: AnimationDriver;
}

5
tools/public_api_guard/animations/browser/testing.d.ts vendored
View File

@ -3,11 +3,13 @@ export declare class MockAnimationDriver implements AnimationDriver {
animate(element: any, keyframes: {
[key: string]: string | number;
}[], duration: number, delay: number, easing: string, previousPlayers?: any[]): MockAnimationPlayer;
computeStyle(element: any, prop: string, defaultValue?: string): string;
static log: AnimationPlayer[];
}
/** @experimental */
export declare class MockAnimationPlayer extends NoopAnimationPlayer {
currentSnapshot: ɵStyleData;
delay: number;
duration: number;
easing: string;
@ -22,6 +24,9 @@ export declare class MockAnimationPlayer extends NoopAnimationPlayer {
constructor(element: any, keyframes: {
[key: string]: string | number;
}[], duration: number, delay: number, easing: string, previousPlayers: any[]);
beforeDestroy(): void;
destroy(): void;
finish(): void;
hasStarted(): boolean;
play(): void;
}

10
tools/public_api_guard/core/core.d.ts vendored
View File

@ -70,12 +70,12 @@ export declare type AnimationStateTransitionMetadata = any;
/** @deprecated */
export interface AnimationStyleMetadata extends AnimationMetadata {
offset?: number;
styles: {
offset: number | null;
styles: '*' | {
[key: string]: string | number;
} | {
} | Array<{
[key: string]: string | number;
}[];
} | '*'>;
}
/** @deprecated */
@ -1007,7 +1007,7 @@ export interface TrackByFunction<T> {
}
/** @deprecated */
export declare function transition(stateChangeExpr: string | ((fromState: string, toState: string) => boolean), steps: AnimationMetadata | AnimationMetadata[]): AnimationTransitionMetadata;
export declare function transition(stateChangeExpr: string, steps: AnimationMetadata | AnimationMetadata[]): AnimationTransitionMetadata;
/** @experimental */
export declare const TRANSLATIONS: InjectionToken<string>;

24
tools/public_api_guard/platform-browser/animations/testing.d.ts vendored
View File

@ -1,27 +1,7 @@
/** @experimental */
export declare class MockAnimationDriver implements AnimationDriver {
animate(element: any, keyframes: {
[key: string]: string | number;
}[], duration: number, delay: number, easing: string, previousPlayers?: any[]): MockAnimationPlayer;
static log: AnimationPlayer[];
export declare class BrowserAnimationsTestingModule {
}
/** @experimental */
export declare class MockAnimationPlayer extends NoopAnimationPlayer {
delay: number;
duration: number;
easing: string;
element: any;
keyframes: {
[key: string]: string | number;
}[];
previousPlayers: any[];
previousStyles: {
[key: string]: string | number;
};
constructor(element: any, keyframes: {
[key: string]: string | number;
}[], duration: number, delay: number, easing: string, previousPlayers: any[]);
destroy(): void;
finish(): void;
export declare class NoopAnimationsTestingModule {
}