vue3-lottie - npm Package Compare versions

Comparing version 2.3.0 to 2.3.1

dist/vue3-lottie.vue.d.ts

@@ -71,2 +71,6 @@ import { PropType } from 'vue';
     };
+    rendererSettings: {
+        type: PropType<any>;
+        default: () => {};
+    };
 }, {
@@ -148,2 +152,6 @@ elementid: import("vue").Ref<string>;
     };
+    rendererSettings: {
+        type: PropType<any>;
+        default: () => {};
+    };
 }>> & {
@@ -169,3 +177,4 @@ onOnComplete?: ((...args: any[]) => any) | ((...args: unknown[]) => any);
     pauseAnimation: boolean;
+    rendererSettings: any;
 }>;
 export default _default;

package.json

 {
   "name": "vue3-lottie",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "license": "MIT",
   "author": "Sanjay Soundarajan <[e-mail]> (https://sanjaysoundarajan.dev)",
-  "scripts": {
-    "dev": "vue-cli-service serve dev/serve.ts",
-    "build": "vite build && tsc -d --emitDeclarationOnly && vue-typegen gen -s ./src -o ./dist",
-    "prepublishOnly": "npm run build",
-    "lint": "eslint \"{packages,playground}/**/*.{ts,tsx,vue,js,jsx,html}\"",
-    "prettier": "npx prettier --write ."
-  },
   "dependencies": {
+    "lodash": "^4.17.21",
     "lottie-web": "^5.8.1"
@@ -42,9 +36,10 @@ },
   "devDependencies": {
-    "@babel/types": "7.18.10",
+    "@babel/types": "7.19.0",
+    "@types/lodash": "^4.14.186",
     "@types/node": "17.0.19",
     "@vitejs/plugin-vue": "2.3.4",
-    "typescript": "4.7.4",
+    "typescript": "4.8.3",
     "vite": "2.9.15",
-    "vue": "3.2.37",
-    "vue-tsc": "0.40.1",
+    "vue": "3.2.39",
+    "vue-tsc": "0.40.13",
     "vue-typegen": "0.2.0"
@@ -63,3 +58,9 @@ },
     "lottie"
-  ]
+  ],
+  "scripts": {
+    "dev": "vue-cli-service serve dev/serve.ts",
+    "build": "vite build && tsc -d --emitDeclarationOnly && vue-typegen gen -s ./src -o ./dist",
+    "lint": "eslint \"{packages,playground}/**/*.{ts,tsx,vue,js,jsx,html}\"",
+    "prettier": "npx prettier --write ."
+  }
 }

README.md

@@ -124,7 +124,7 @@ # Vue 3 Lottie
 - Create a folder called **`plugins`** at the root of your project.
-- Create a file named **`vue3-lottie.client.js`** inside the _plugins_ directory.
-- Add the following code to the **`vue3-lottie.client.js`** file.
+- Create a file named **`Vue3Lottie.client.ts`** inside the _plugins_ directory.
+- Add the following code to the **`Vue3Lottie.client.ts`** file.
 
-```js
-import { Vue3Lottie } from 'vue3-lottie'
+```ts
+import Vue3Lottie from 'vue3-lottie'
 
@@ -136,2 +136,16 @@ export default defineNuxtPlugin((nuxtApp) => {
 
+This should register as a global component that you can call anywhere in your app under the <Vue3Lottie> tag.
+
+I would recommend using a `<client-only>` parent tag to ensure that the animation only loads in on the client side.
+
+```vue
+<client-only>
+  <Vue3Lottie
+    animationLink="https://assets10.lottiefiles.com/packages/lf20_soCRuE.json"
+    :height="200"
+    :width="200"
+  />
+</client-only>
+```
+
 - Import the css file required by the component into your **`app.vue`** file.
@@ -138,0 +152,0 @@

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

318006

increased by931.15%

Number of package files

8

increased by14.29%

Lines of code

6285

increased by1048.99%

Number of lines in readme file

227

increased by6.57%

Worsened metrics

Dependency count

3

increased by50%

Dev dependency count

9

increased by12.5%

Number of medium supply chain risk alerts

5

increased by150%

Dependency changes

• + Addedlodash@^4.17.21

• + Addedlodash@4.17.21(transitive)