@lottiefiles/lottie-player 1.7.1 → 2.0.0

Sign up to get free protection for your applications and to get access to all the features.
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2019 LottieFiles.com
3
+ Copyright (c) 2023 LottieFiles.com
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
@@ -1,233 +1,252 @@
1
- import { LitElement } from "lit";
2
- import { TemplateResult } from "lit/html.js";
3
- export declare enum PlayerState {
4
- Destroyed = "destroyed",
5
- Error = "error",
6
- Frozen = "frozen",
7
- Loading = "loading",
8
- Paused = "paused",
9
- Playing = "playing",
10
- Stopped = "stopped"
11
- }
12
- export declare enum PlayMode {
13
- Bounce = "bounce",
14
- Normal = "normal"
15
- }
16
- export declare enum PlayerEvents {
17
- Complete = "complete",
18
- Destroyed = "destroyed",
19
- Error = "error",
20
- Frame = "frame",
21
- Freeze = "freeze",
22
- Load = "load",
23
- Loop = "loop",
24
- Pause = "pause",
25
- Play = "play",
26
- Ready = "ready",
27
- Rendered = "rendered",
28
- Stop = "stop"
29
- }
30
- export interface Versions {
31
- lottiePlayerVersion: string;
32
- lottieWebVersion: string;
33
- }
34
- /**
35
- * Parse a resource into a JSON object or a URL string
36
- */
37
- export declare function parseSrc(src: string | object): string | object;
38
- /**
39
- * LottiePlayer web component class
40
- *
41
- * @export
42
- * @class LottiePlayer
43
- * @extends {LitElement}
44
- */
45
- export declare class LottiePlayer extends LitElement {
46
- /**
47
- * Autoplay animation on load.
48
- */
49
- autoplay: boolean;
50
- /**
51
- * Background color.
52
- */
53
- background?: string;
54
- /**
55
- * Show controls.
56
- */
57
- controls: boolean;
58
- /**
59
- * Number of times to loop animation.
60
- */
61
- count?: number;
62
- /**
63
- * Player state.
64
- */
65
- currentState: PlayerState;
66
- /**
67
- * Animation description for screen readers.
68
- */
69
- description: string;
70
- /**
71
- * Direction of animation.
72
- */
73
- direction: number;
74
- /**
75
- * Disable checking if the Lottie is valid before loading
76
- */
77
- disableCheck?: boolean;
78
- /**
79
- * Disable using shadow dom as the root
80
- */
81
- disableShadowDOM: boolean;
82
- /**
83
- * Whether to play on mouse hover
84
- */
85
- hover: boolean;
86
- /**
87
- * Intermission
88
- */
89
- intermission: number;
90
- /**
91
- * Whether to loop animation.
92
- */
93
- loop: boolean;
94
- /**
95
- * Play mode.
96
- */
97
- mode: PlayMode;
98
- /**
99
- * Aspect ratio to pass to lottie-web.
100
- */
101
- preserveAspectRatio: string;
102
- /**
103
- * Renderer to use.
104
- */
105
- renderer: "svg";
106
- /**
107
- * Viewbox size for renderer settings
108
- */
109
- viewBoxSize?: string;
110
- /**
111
- * seeker
112
- */
113
- seeker: any;
114
- /**
115
- * Animation speed.
116
- */
117
- speed: number;
118
- /**
119
- * Bodymovin JSON data or URL to JSON.
120
- */
121
- src?: string;
122
- /**
123
- * Enable web workers
124
- */
125
- webworkers?: boolean;
126
- /**
127
- * Animation container.
128
- */
129
- protected container: HTMLElement;
130
- private _io;
131
- private _lottie?;
132
- private _prevState?;
133
- private _counter;
134
- /**
135
- * Configure and initialize lottie-web player instance.
136
- */
137
- load(src: string | object): Promise<void>;
138
- /**
139
- * Returns the lottie-web instance used in the component.
140
- */
141
- getLottie(): any;
142
- /**
143
- * Returns the lottie-web version and this player's version
144
- */
145
- getVersions(): Versions;
146
- /**
147
- * Start playing animation.
148
- */
149
- play(): void;
150
- /**
151
- * Pause animation play.
152
- */
153
- pause(): void;
154
- /**
155
- * Stops animation play.
156
- */
157
- stop(): void;
158
- /**
159
- * Destroy animation and lottie-player element.
160
- */
161
- destroy(): void;
162
- /**
163
- * Seek to a given frame.
164
- */
165
- seek(value: number | string): void;
166
- /**
167
- * Snapshot the current frame as SVG.
168
- *
169
- * If 'download' argument is boolean true, then a download is triggered in browser.
170
- */
171
- snapshot(download?: boolean): string | void;
172
- /**
173
- * Sets animation play speed.
174
- *
175
- * @param value Playback speed.
176
- */
177
- setSpeed(value?: number): void;
178
- /**
179
- * Animation play direction.
180
- *
181
- * @param value Direction values.
182
- */
183
- setDirection(value: number): void;
184
- /**
185
- * Sets the looping of the animation.
186
- *
187
- * @param value Whether to enable looping. Boolean true enables looping.
188
- */
189
- setLooping(value: boolean): void;
190
- /**
191
- * Toggle playing state.
192
- */
193
- togglePlay(): void;
194
- /**
195
- * Toggles animation looping.
196
- */
197
- toggleLooping(): void;
198
- /**
199
- * Resize animation.
200
- */
201
- resize(): void;
202
- /**
203
- * Returns the styles for the component.
204
- */
205
- static get styles(): import("lit").CSSResult;
206
- /**
207
- * Cleanup on component destroy.
208
- */
209
- disconnectedCallback(): void;
210
- render(): TemplateResult | void;
211
- protected createRenderRoot(): Element | ShadowRoot;
212
- /**
213
- * Initialize everything on component first render.
214
- */
215
- protected firstUpdated(): void;
216
- protected renderControls(): TemplateResult;
217
- /**
218
- * Handle visibility change events.
219
- */
220
- private _onVisibilityChange;
221
- /**
222
- * Handles click and drag actions on the progress track.
223
- */
224
- private _handleSeekChange;
225
- private _attachEventListeners;
226
- /**
227
- * Freeze animation play.
228
- * This internal state pauses animation and is used to differentiate between
229
- * user requested pauses and component instigated pauses.
230
- */
231
- private freeze;
232
- }
233
- //# sourceMappingURL=lottie-player.d.ts.map
1
+ import { LitElement, CSSResult } from 'lit';
2
+ import { TemplateResult } from 'lit/html.js';
3
+ import { AnimationItem } from 'lottie-web';
4
+
5
+ /**
6
+ * Copyright 2023 Design Barn Inc.
7
+ */
8
+
9
+ declare enum PlayerState {
10
+ Destroyed = "destroyed",
11
+ Error = "error",
12
+ Frozen = "frozen",
13
+ Loading = "loading",
14
+ Ready = "ready",
15
+ Paused = "paused",
16
+ Playing = "playing",
17
+ Stopped = "stopped"
18
+ }
19
+ declare enum PlayMode {
20
+ Bounce = "bounce",
21
+ Normal = "normal"
22
+ }
23
+ declare enum PlayerEvents {
24
+ Complete = "complete",
25
+ Destroyed = "destroyed",
26
+ Error = "error",
27
+ Frame = "frame",
28
+ Freeze = "freeze",
29
+ Load = "load",
30
+ Loop = "loop",
31
+ Pause = "pause",
32
+ Play = "play",
33
+ Ready = "ready",
34
+ Rendered = "rendered",
35
+ Stop = "stop"
36
+ }
37
+ interface Versions {
38
+ lottiePlayerVersion: string;
39
+ lottieWebVersion: string;
40
+ }
41
+ interface InternalPlayerState {
42
+ background: string;
43
+ currentState: PlayerState;
44
+ frame: number;
45
+ seeker: number;
46
+ autoplay: boolean;
47
+ direction: number;
48
+ hover: boolean;
49
+ intermission: number;
50
+ loop: boolean;
51
+ count?: number;
52
+ playMode: PlayMode;
53
+ speed: number;
54
+ }
55
+ /**
56
+ * Parse a resource into a JSON object or a URL string
57
+ */
58
+ declare function parseSrc(src: string | AnimationItem): string | AnimationItem;
59
+ /**
60
+ * LottiePlayer web component class
61
+ *
62
+ */
63
+ declare class LottiePlayer extends LitElement {
64
+ /**
65
+ * Autoplay animation on load.
66
+ */
67
+ autoplay: boolean;
68
+ /**
69
+ * Background color.
70
+ */
71
+ background?: string;
72
+ /**
73
+ * Show controls.
74
+ */
75
+ controls: boolean;
76
+ /**
77
+ * Number of times to loop animation.
78
+ */
79
+ count?: number;
80
+ /**
81
+ * Player state.
82
+ */
83
+ currentState: PlayerState;
84
+ /**
85
+ * Animation description for screen readers.
86
+ */
87
+ description: string;
88
+ /**
89
+ * Direction of animation.
90
+ */
91
+ direction: number;
92
+ /**
93
+ * Disable checking if the Lottie is valid before loading
94
+ */
95
+ disableCheck?: boolean;
96
+ /**
97
+ * Disable using shadow dom as the root
98
+ */
99
+ disableShadowDOM: boolean;
100
+ /**
101
+ * Whether to play on mouse hover
102
+ */
103
+ hover: boolean;
104
+ /**
105
+ * Intermission
106
+ */
107
+ intermission: number;
108
+ /**
109
+ * Whether to loop animation.
110
+ */
111
+ loop: boolean;
112
+ /**
113
+ * Play mode.
114
+ */
115
+ mode: PlayMode;
116
+ /**
117
+ * Aspect ratio to pass to lottie-web.
118
+ */
119
+ preserveAspectRatio: string;
120
+ /**
121
+ * Renderer to use.
122
+ */
123
+ renderer: 'svg' | 'canvas';
124
+ /**
125
+ * seeker
126
+ */
127
+ seeker: number;
128
+ /**
129
+ * Animation speed.
130
+ */
131
+ speed: number;
132
+ /**
133
+ * Bodymovin JSON data or URL to JSON.
134
+ */
135
+ src?: string;
136
+ /**
137
+ * Viewbox size for renderer settings
138
+ */
139
+ viewBoxSize?: string;
140
+ /**
141
+ * Enable web workers
142
+ */
143
+ webworkers?: boolean;
144
+ /**
145
+ * Animation container.
146
+ */
147
+ protected container: HTMLElement;
148
+ private _counter;
149
+ private _io;
150
+ private _lottie?;
151
+ /**
152
+ * Destroy animation and lottie-player element.
153
+ */
154
+ destroy(): void;
155
+ /**
156
+ * Cleanup on component destroy.
157
+ */
158
+ disconnectedCallback(): void;
159
+ /**
160
+ * Returns the lottie-web instance used in the component.
161
+ */
162
+ getLottie(): any;
163
+ /**
164
+ * Returns the lottie-web version and this player's version
165
+ */
166
+ getVersions(): Versions;
167
+ /**
168
+ * Configure and initialize lottie-web player instance.
169
+ */
170
+ load(src: string | AnimationItem): Promise<void>;
171
+ /**
172
+ * Pause animation play.
173
+ */
174
+ pause(): void;
175
+ /**
176
+ * Start playing animation.
177
+ */
178
+ play(): void;
179
+ getState(): InternalPlayerState;
180
+ render(): TemplateResult | void;
181
+ /**
182
+ * Resize animation.
183
+ */
184
+ resize(): void;
185
+ /**
186
+ * Seek to a given frame.
187
+ */
188
+ seek(value: number | string): void;
189
+ /**
190
+ * Animation play direction.
191
+ *
192
+ * @param value - Direction values.
193
+ */
194
+ setDirection(value: 1 | -1): void;
195
+ /**
196
+ * Sets the looping of the animation.
197
+ *
198
+ * @param value - Whether to enable looping. Boolean true enables looping.
199
+ */
200
+ setLooping(value: boolean): void;
201
+ /**
202
+ * Sets animation play speed.
203
+ *
204
+ * @param value - Playback speed.
205
+ */
206
+ setSpeed(value?: number): void;
207
+ /**
208
+ * Snapshot the current frame as SVG.
209
+ *
210
+ * If 'download' argument is boolean true, then a download is triggered in browser.
211
+ */
212
+ snapshot(download?: boolean): string;
213
+ /**
214
+ * Stops animation play.
215
+ */
216
+ stop(): void;
217
+ /**
218
+ * Toggles animation looping.
219
+ */
220
+ toggleLooping(): void;
221
+ /**
222
+ * Toggle playing state.
223
+ */
224
+ togglePlay(): void;
225
+ /**
226
+ * Returns the styles for the component.
227
+ */
228
+ static get styles(): CSSResult;
229
+ protected createRenderRoot(): Element | ShadowRoot;
230
+ /**
231
+ * Initialize everything on component first render.
232
+ */
233
+ protected firstUpdated(): Promise<void>;
234
+ protected renderControls(): TemplateResult;
235
+ private _attachEventListeners;
236
+ /**
237
+ * Freeze animation play.
238
+ * This internal state pauses animation and is used to differentiate between
239
+ * user requested pauses and component instigated pauses.
240
+ */
241
+ private _freeze;
242
+ /**
243
+ * Handles click and drag actions on the progress track.
244
+ */
245
+ private _handleSeekChange;
246
+ /**
247
+ * Handle visibility change events.
248
+ */
249
+ private _onVisibilityChange;
250
+ }
251
+
252
+ export { InternalPlayerState, LottiePlayer, PlayMode, PlayerEvents, PlayerState, Versions, parseSrc };