| 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 | } |