main
js 193 lines 4.68 KB
Raw
1 // flow-typed signature: 4631a74b6a0e6a1b4de2ba8c7bb141d6
2 // flow-typed version: 3e51657e95/web-animations/flow_>=v0.261.x
3
4 // https://www.w3.org/TR/web-animations-1/
5
6 type AnimationPlayState = 'idle' | 'running' | 'paused' | 'finished';
7
8 type AnimationReplaceState = 'active' | 'removed' | 'persisted';
9
10 type CompositeOperation = 'replace' | 'add' | 'accumulate';
11
12 type CompositeOperationOrAuto = 'replace' | 'add' | 'accumulate' | 'auto';
13
14 type FillMode = 'none' | 'forwards' | 'backwards' | 'both' | 'auto';
15
16 // This is actually web-animations-2
17 type IterationCompositeOperation = 'replace' | 'accumulate';
18
19 type PlaybackDirection =
20 | 'normal'
21 | 'reverse'
22 | 'alternate'
23 | 'alternate-reverse';
24
25 type AnimationPlaybackEvent$Init = Event$Init & {
26 currentTime?: number | null,
27 timelineTime?: number | null,
28 ...
29 };
30
31 type BaseComputedKeyframe = {|
32 composite: CompositeOperationOrAuto,
33 computedOffset: number,
34 easing: string,
35 offset: number | null,
36 |};
37
38 type BaseKeyframe = {|
39 composite: CompositeOperationOrAuto,
40 easing: string,
41 offset: number | null,
42 |};
43
44 type BasePropertyIndexedKeyframe = {|
45 composite: CompositeOperationOrAuto | Array<CompositeOperationOrAuto>,
46 easing: string | Array<string>,
47 offset: number | null | Array<number | null>,
48 |};
49
50 type ComputedEffectTiming = {|
51 ...EffectTiming,
52 currentIteration: number | null,
53 progress: number | null,
54 |};
55
56 type ComputedKeyframe = {
57 composite: CompositeOperationOrAuto,
58 computedOffset: number,
59 easing: string,
60 offset: number | null,
61 [property: string]: string | number | null | void,
62 ...
63 };
64
65 type DocumentTimelineOptions = {|
66 originTime: number,
67 |};
68
69 type EffectTiming = {|
70 direction: PlaybackDirection,
71 easing: string,
72 fill: FillMode,
73 iterations: number,
74 iterationStart: number,
75 |};
76
77 type GetAnimationsOptions = {|
78 pseudoElement: string | null,
79 subtree: boolean,
80 |};
81
82 type KeyframeAnimationOptions = {|
83 ...KeyframeEffectOptions,
84 id: string,
85 timeline: AnimationTimeline | null,
86 |};
87
88 type KeyframeEffectOptions = {|
89 ...EffectTiming,
90 composite: CompositeOperation,
91 pseudoElement: string | null,
92 |};
93
94 type Keyframe = {
95 composite?: CompositeOperationOrAuto,
96 easing?: string,
97 offset?: number | null,
98 [property: string]: string | number | null | void,
99 ...
100 };
101
102 type OptionalEffectTiming = Partial<EffectTiming>;
103
104 type PropertyIndexedKeyframes = {
105 composite?: CompositeOperationOrAuto | CompositeOperationOrAuto[],
106 easing?: string | string[],
107 offset?: number | (number | null)[],
108 [property: string]:
109 | string
110 | string[]
111 | number
112 | null
113 | (number | null)[]
114 | void,
115 ...
116 };
117
118 declare class Animation extends EventTarget {
119 constructor(
120 effect?: AnimationEffect | null,
121 timeline?: AnimationTimeline | null
122 ): void;
123
124 id: string;
125 effect: AnimationEffect | null;
126 timeline: AnimationTimeline | null;
127 startTime: number | null;
128 currentTime: number | null;
129 playbackRate: number;
130 +playState: AnimationPlayState;
131 +replaceState: AnimationReplaceState;
132 +pending: boolean;
133 +ready: Promise<Animation>;
134 +finished: Promise<Animation>;
135 onfinish: ?(ev: AnimationPlaybackEvent) => mixed;
136 oncancel: ?(ev: AnimationPlaybackEvent) => mixed;
137 onremove: ?(ev: AnimationPlaybackEvent) => mixed;
138 cancel(): void;
139 finish(): void;
140 play(): void;
141 pause(): void;
142 updatePlaybackRate(playbackRate: number): void;
143 reverse(): void;
144 persist(): void;
145 commitStyles(): void;
146 }
147
148 declare class AnimationEffect {
149 getTiming(): EffectTiming;
150 getComputedTiming(): ComputedEffectTiming;
151 updateTiming(timing?: OptionalEffectTiming): void;
152 }
153
154 declare class AnimationPlaybackEvent extends Event {
155 constructor(
156 type: string,
157 animationEventInitDict?: AnimationPlaybackEvent$Init
158 ): void;
159 +currentTime: number | null;
160 +timelineTime: number | null;
161 }
162
163 declare class AnimationTimeline {
164 +currentTime: number | null;
165 }
166
167 declare class DocumentTimeline extends AnimationTimeline {
168 constructor(options?: DocumentTimelineOptions): void;
169 }
170
171 declare class KeyframeEffect extends AnimationEffect {
172 constructor(
173 target: Element | null,
174 keyframes: Keyframe[] | PropertyIndexedKeyframes | null,
175 options?: number | KeyframeEffectOptions
176 ): void;
177 constructor(source: KeyframeEffect): void;
178
179 target: Element | null;
180 composite: CompositeOperation;
181 // This is actually web-animations-2
182 iterationComposite: IterationCompositeOperation;
183 getKeyframes(): ComputedKeyframe[];
184 setKeyframes(keyframes: Keyframe[] | PropertyIndexedKeyframes | null): void;
185 }
186
187 declare class mixin$Animatable {
188 animate(
189 keyframes: Keyframe[] | PropertyIndexedKeyframes | null,
190 options?: number | KeyframeAnimationOptions
191 ): Animation;
192 getAnimations(options?: GetAnimationsOptions): Array<Animation>;
193 }