@lottiefiles/dotlottie-vue 0.1.9 → 0.2.1

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.
Files changed (5) hide show
  1. package/README.md +1 -1
  2. package/dist/dotlottie.d.ts +2 -2
  3. package/dist/dotlottie.js +4 -4
  4. package/dist/index.js +4 -4
  5. package/package.json +2 -2
package/README.md CHANGED
@@ -71,7 +71,7 @@ import { DotLottieVue } from '@lottiefiles/dotlottie-vue'
71
71
  | `data` | string \| ArrayBuffer | | undefined | Animation data provided either as a Lottie JSON string or as an ArrayBuffer for .lottie animations. |
72
72
  | `mode` | string | | "forward" | Animation play mode. Accepts "forward", "reverse", "bounce", "reverse-bounce". |
73
73
  | `backgroundColor` | string | | undefined | Background color of the canvas. Accepts 6-digit or 8-digit hex color string (e.g., "#000000", "#000000FF"), |
74
- | `segments` | \[number, number] | | \[0, totalFrames - 1] | Animation segments. Accepts an array of two numbers, where the first number is the start frame and the second number is the end frame. |
74
+ | `segment` | \[number, number] | | \[0, totalFrames - 1] | Animation segment. Accepts an array of two numbers, where the first number is the start frame and the second number is the end frame. |
75
75
  | `renderConfig` | RenderConfig | | `{}` | Configuration for rendering the animation. |
76
76
  | `useFrameInterpolation` | boolean | | false | Determines if the animation should update on subframes. If set to false, the original AE frame rate will be maintained. If set to true, it will refresh at each requestAnimationFrame, including intermediate values. The default setting is true. |
77
77
 
package/dist/dotlottie.d.ts CHANGED
@@ -30,7 +30,7 @@ declare const DotLottieVue: vue.DefineComponent<{
30
30
  type: ObjectConstructor;
31
31
  required: false;
32
32
  };
33
- segments: {
33
+ segment: {
34
34
  type: () => [number, number];
35
35
  required: false;
36
36
  };
@@ -71,7 +71,7 @@ declare const DotLottieVue: vue.DefineComponent<{
71
71
  type: ObjectConstructor;
72
72
  required: false;
73
73
  };
74
- segments: {
74
+ segment: {
75
75
  type: () => [number, number];
76
76
  required: false;
77
77
  };
package/dist/dotlottie.js CHANGED
@@ -10,14 +10,14 @@ var DotLottieVue = defineComponent({
10
10
  loop: { type: Boolean, required: false },
11
11
  mode: { type: String, required: false },
12
12
  renderConfig: { type: Object, required: false },
13
- segments: { type: Array, required: false },
13
+ segment: { type: Array, required: false },
14
14
  speed: { type: Number, required: false },
15
15
  src: { type: String, required: false },
16
16
  useFrameInterpolation: { type: Boolean, required: false }
17
17
  },
18
18
  setup(props, { attrs, expose }) {
19
19
  const canvas = ref(void 0);
20
- const { backgroundColor, loop, mode, segments, speed, useFrameInterpolation } = toRefs(props);
20
+ const { backgroundColor, loop, mode, segment, speed, useFrameInterpolation } = toRefs(props);
21
21
  let dotLottie = null;
22
22
  let intersectionObserver = null;
23
23
  let resizeObserver = null;
@@ -46,10 +46,10 @@ var DotLottieVue = defineComponent({
46
46
  }
47
47
  );
48
48
  watch(
49
- () => segments?.value,
49
+ () => segment?.value,
50
50
  (newVal) => {
51
51
  if (dotLottie && Array.isArray(newVal) && newVal.length === 2) {
52
- dotLottie.setSegments(newVal[0], newVal[1]);
52
+ dotLottie.setSegment(newVal[0], newVal[1]);
53
53
  }
54
54
  }
55
55
  );
package/dist/index.js CHANGED
@@ -10,14 +10,14 @@ var DotLottieVue = defineComponent({
10
10
  loop: { type: Boolean, required: false },
11
11
  mode: { type: String, required: false },
12
12
  renderConfig: { type: Object, required: false },
13
- segments: { type: Array, required: false },
13
+ segment: { type: Array, required: false },
14
14
  speed: { type: Number, required: false },
15
15
  src: { type: String, required: false },
16
16
  useFrameInterpolation: { type: Boolean, required: false }
17
17
  },
18
18
  setup(props, { attrs, expose }) {
19
19
  const canvas = ref(void 0);
20
- const { backgroundColor, loop, mode, segments, speed, useFrameInterpolation } = toRefs(props);
20
+ const { backgroundColor, loop, mode, segment, speed, useFrameInterpolation } = toRefs(props);
21
21
  let dotLottie = null;
22
22
  let intersectionObserver = null;
23
23
  let resizeObserver = null;
@@ -46,10 +46,10 @@ var DotLottieVue = defineComponent({
46
46
  }
47
47
  );
48
48
  watch(
49
- () => segments?.value,
49
+ () => segment?.value,
50
50
  (newVal) => {
51
51
  if (dotLottie && Array.isArray(newVal) && newVal.length === 2) {
52
- dotLottie.setSegments(newVal[0], newVal[1]);
52
+ dotLottie.setSegment(newVal[0], newVal[1]);
53
53
  }
54
54
  }
55
55
  );
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lottiefiles/dotlottie-vue",
3
- "version": "0.1.9",
3
+ "version": "0.2.1",
4
4
  "type": "module",
5
5
  "description": "Vue wrapper around the dotlottie-web library",
6
6
  "repository": {
@@ -38,7 +38,7 @@
38
38
  "vue": "^3.3.4"
39
39
  },
40
40
  "dependencies": {
41
- "@lottiefiles/dotlottie-web": "0.16.0"
41
+ "@lottiefiles/dotlottie-web": "0.18.0"
42
42
  },
43
43
  "devDependencies": {
44
44
  "@vue/runtime-dom": "^3.4.6",