@lottiefiles/dotlottie-svelte 0.7.6 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -17,6 +17,8 @@ export let marker = void 0;
17
17
  export let layout = void 0;
18
18
  export let animationId = "";
19
19
  export let themeId = "";
20
+ export let stateMachineId = void 0;
21
+ export let stateMachineConfig = void 0;
20
22
  export let playOnHover = false;
21
23
  export let themeData = "";
22
24
  export let dotLottieRefCallback = () => {
@@ -48,7 +50,9 @@ onMount(() => {
48
50
  backgroundColor,
49
51
  mode,
50
52
  animationId,
51
- themeId
53
+ themeId,
54
+ stateMachineId,
55
+ stateMachineConfig
52
56
  });
53
57
  if (dotLottieRefCallback) {
54
58
  dotLottieRefCallback(dotLottie);
@@ -117,7 +121,9 @@ $: if (dotLottie && src !== prevSrc) {
117
121
  marker,
118
122
  layout,
119
123
  animationId,
120
- themeId
124
+ themeId,
125
+ stateMachineId,
126
+ stateMachineConfig
121
127
  });
122
128
  prevSrc = src;
123
129
  }
@@ -136,7 +142,9 @@ $: if (dotLottie && data !== prevData) {
136
142
  marker,
137
143
  layout,
138
144
  animationId,
139
- themeId
145
+ themeId,
146
+ stateMachineId,
147
+ stateMachineConfig
140
148
  });
141
149
  prevData = data;
142
150
  }
@@ -149,6 +157,23 @@ $: if (dotLottie && dotLottie.isLoaded && dotLottie.activeThemeId !== themeId) {
149
157
  $: if (dotLottie && dotLottie.isLoaded) {
150
158
  dotLottie.setThemeData(themeData);
151
159
  }
160
+ $: {
161
+ if (dotLottie && dotLottie.isLoaded) {
162
+ if (typeof stateMachineId === "string" && stateMachineId) {
163
+ const smLoaded = dotLottie.stateMachineLoad(stateMachineId);
164
+ if (smLoaded) {
165
+ dotLottie.stateMachineStart();
166
+ }
167
+ } else {
168
+ dotLottie.stateMachineStop();
169
+ }
170
+ }
171
+ }
172
+ $: {
173
+ if (dotLottie) {
174
+ dotLottie.stateMachineSetConfig(stateMachineConfig ?? null);
175
+ }
176
+ }
152
177
  </script>
153
178
 
154
179
  <div>
@@ -28,6 +28,8 @@ declare const Dotlottie: $$__sveltets_2_IsomorphicComponent<{
28
28
  layout?: Config["layout"];
29
29
  animationId?: Config["animationId"];
30
30
  themeId?: Config["themeId"];
31
+ stateMachineId?: Config["stateMachineId"];
32
+ stateMachineConfig?: Config["stateMachineConfig"];
31
33
  playOnHover?: boolean;
32
34
  themeData?: string;
33
35
  dotLottieRefCallback?: (dotLottie: DotLottie) => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lottiefiles/dotlottie-svelte",
3
- "version": "0.7.6",
3
+ "version": "0.8.0",
4
4
  "type": "module",
5
5
  "description": "Svelte component wrapper around the dotlottie-web library to render Lottie and dotLottie animations",
6
6
  "repository": {
@@ -33,7 +33,7 @@
33
33
  "svelte": "^4.0.0"
34
34
  },
35
35
  "dependencies": {
36
- "@lottiefiles/dotlottie-web": "0.52.0"
36
+ "@lottiefiles/dotlottie-web": "0.52.1"
37
37
  },
38
38
  "devDependencies": {
39
39
  "@sveltejs/adapter-auto": "^3.0.0",