vue-inline-svg - npm Package Compare versions

Comparing version 3.1.2 to 3.1.3

dist/vue-inline-svg.js

@@ -9,3 +9,3 @@ (function (global, factory) {
 
-    /** @type Record<string, PromiseWithState<Element>> */
+    /** @type {Record<string, PromiseWithState<Element>>} */
     var cache = {};
@@ -64,4 +64,6 @@
         return {
-          /** @type SVGElement */
-          svgElSource: null
+          /** @type {SVGElement} */
+          svgElSource: null,
+          /** @type {XMLHttpRequest} */
+          request: undefined
         };
@@ -144,5 +146,7 @@ },
         download: function download(url) {
+          var _this2 = this;
           return makePromiseState(new Promise(function (resolve, reject) {
             var request = new XMLHttpRequest();
             request.open('GET', url, true);
+            _this2.request = request;
             request.onload = function () {
@@ -149,0 +153,0 @@ if (request.status >= 200 && request.status < 400) {

dist/vue-inline-svg.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue")):"function"==typeof define&&define.amd?define(["vue"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VueInlineSvg=t(e.Vue)}(this,(function(e){"use strict";var t={};return{name:"InlineSvg",inheritAttrs:!1,render:function(){return this.svgElSource?e.h("svg",Object.assign({},this.getSvgAttrs(this.svgElSource),(t=this.$attrs,Object.keys(t).reduce((function(e,n){return!1!==t[n]&&null!==t[n]&&void 0!==t[n]&&(e[n]=t[n]),e}),{})),{innerHTML:this.getSvgContent(this.svgElSource)})):null;var t},props:{src:{type:String,required:!0},title:{type:String},transformSource:{type:Function,default:function(e){return e}},keepDuringLoading:{type:Boolean,default:!0}},emits:["loaded","unloaded","error"],data:function(){return{svgElSource:null}},watch:{src:function(e){this.getSource(e)}},mounted:function(){this.getSource(this.src)},methods:{getSvgAttrs:function(e){var t={},n=e.attributes;if(!n)return t;for(var r=n.length-1;r>=0;r--)t[n[r].name]=n[r].value;return t},getSvgContent:function(e){return e=e.cloneNode(!0),e=this.transformSource(e),this.title&&function(e,t){var n=e.getElementsByTagName("title");if(n.length)n[0].textContent=t;else{var r=document.createElementNS("http://www.w3.org/2000/svg","title");r.textContent=t,e.insertBefore(r,e.firstChild)}}(e,this.title),e.innerHTML},getSource:function(e){var n=this;t[e]||(t[e]=this.download(e)),this.svgElSource&&t[e].getIsPending()&&!this.keepDuringLoading&&(this.svgElSource=null,this.$emit("unloaded")),t[e].then((function(e){n.svgElSource=e,n.$nextTick((function(){n.$emit("loaded",n.$el)}))})).catch((function(r){n.svgElSource&&(n.svgElSource=null,n.$emit("unloaded")),delete t[e],n.$emit("error",r)}))},download:function(e){return function(e){if(e.getIsPending)return e;var t=!0,n=e.then((function(e){return t=!1,e}),(function(e){throw t=!1,e}));return n.getIsPending=function(){return t},n}(new Promise((function(t,n){var r=new XMLHttpRequest;r.open("GET",e,!0),r.onload=function(){if(r.status>=200&&r.status<400)try{var e=(new DOMParser).parseFromString(r.responseText,"text/xml").getElementsByTagName("svg")[0];e?t(e):n(new Error('Loaded file is not valid SVG"'))}catch(e){n(e)}else n(new Error("Error loading SVG"))},r.onerror=n,r.send()})))}}}}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue")):"function"==typeof define&&define.amd?define(["vue"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VueInlineSvg=t(e.Vue)}(this,(function(e){"use strict";var t={};return{name:"InlineSvg",inheritAttrs:!1,render:function(){return this.svgElSource?e.h("svg",Object.assign({},this.getSvgAttrs(this.svgElSource),(t=this.$attrs,Object.keys(t).reduce((function(e,n){return!1!==t[n]&&null!==t[n]&&void 0!==t[n]&&(e[n]=t[n]),e}),{})),{innerHTML:this.getSvgContent(this.svgElSource)})):null;var t},props:{src:{type:String,required:!0},title:{type:String},transformSource:{type:Function,default:function(e){return e}},keepDuringLoading:{type:Boolean,default:!0}},emits:["loaded","unloaded","error"],data:function(){return{svgElSource:null,request:void 0}},watch:{src:function(e){this.getSource(e)}},mounted:function(){this.getSource(this.src)},methods:{getSvgAttrs:function(e){var t={},n=e.attributes;if(!n)return t;for(var r=n.length-1;r>=0;r--)t[n[r].name]=n[r].value;return t},getSvgContent:function(e){return e=e.cloneNode(!0),e=this.transformSource(e),this.title&&function(e,t){var n=e.getElementsByTagName("title");if(n.length)n[0].textContent=t;else{var r=document.createElementNS("http://www.w3.org/2000/svg","title");r.textContent=t,e.insertBefore(r,e.firstChild)}}(e,this.title),e.innerHTML},getSource:function(e){var n=this;t[e]||(t[e]=this.download(e)),this.svgElSource&&t[e].getIsPending()&&!this.keepDuringLoading&&(this.svgElSource=null,this.$emit("unloaded")),t[e].then((function(e){n.svgElSource=e,n.$nextTick((function(){n.$emit("loaded",n.$el)}))})).catch((function(r){n.svgElSource&&(n.svgElSource=null,n.$emit("unloaded")),delete t[e],n.$emit("error",r)}))},download:function(e){var t=this;return function(e){if(e.getIsPending)return e;var t=!0,n=e.then((function(e){return t=!1,e}),(function(e){throw t=!1,e}));return n.getIsPending=function(){return t},n}(new Promise((function(n,r){var i=new XMLHttpRequest;i.open("GET",e,!0),t.request=i,i.onload=function(){if(i.status>=200&&i.status<400)try{var e=(new DOMParser).parseFromString(i.responseText,"text/xml").getElementsByTagName("svg")[0];e?n(e):r(new Error('Loaded file is not valid SVG"'))}catch(e){r(e)}else r(new Error("Error loading SVG"))},i.onerror=r,i.send()})))}}}}));

package.json

 {
   "name": "vue-inline-svg",
-  "version": "3.1.2",
+  "version": "3.1.3",
   "description": "Replace SVG images with inline SVG element",
@@ -28,4 +28,5 @@ "type": "module",
     "test": "npm run lint && npm run test:ts",
-    "test:ts": "tsc -p .",
-    "test:dts": "npx npm-install-peers && check-dts test/*.ts",
+    "test:ts": "npm run test:prepare && tsc -p .",
+    "test:dts": "npm run test:prepare && check-dts test/*.ts",
+    "test:prepare": "npm i vue@3 --no-save",
     "lint": "eslint src/*.js",
@@ -63,3 +64,3 @@ "lint:fix": "eslint src/*.js --fix",
     "@rollup/plugin-terser": "^0.4.0",
-    "check-dts": "^0.6.7",
+    "check-dts": "^0.7.0",
     "eslint": "^8.33.0",
@@ -69,5 +70,5 @@ "eslint-config-airbnb-base": "^15.0.0",
     "pre-commit": "^1.2.2",
-    "rollup": "^3.13.0",
+    "rollup": "^3.14.0",
     "typescript": "^4.9.5"
   }
 }

src/index.js

@@ -5,3 +5,3 @@ // peer dep is not installed during test
 
-/** @type Record<string, PromiseWithState<Element>> */
+/** @type {Record<string, PromiseWithState<Element>>} */
 const cache = {};
@@ -62,4 +62,6 @@
         return {
-            /** @type SVGElement */
+            /** @type {SVGElement} */
             svgElSource: null,
+            /** @type {XMLHttpRequest} */
+            request: undefined,
         };
@@ -147,2 +149,3 @@ },
                 request.open('GET', url, true);
+                this.request = request;
 
@@ -149,0 +152,0 @@ request.onload = () => {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

38872

increased by0.95%

Lines of code

889

increased by0.91%

No dependency changes