vue-inline-svg - npm Package Compare versions

Comparing version 3.0.0-beta.2 to 3.0.0-beta.3

dist/vue-inline-svg.js

		@@ -27,3 +27,3 @@ (function (global, factory) {
		var InlineSvg = {
		// name: 'inline-svg',
		name: 'InlineSvg',
		inheritAttrs: false,
		@@ -30,0 +30,0 @@ render: function render() {

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{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.appendChild(r)}}(e,this.title),e.innerHTML},getSource:function(e){var n=this;t[e]\|\|(t[e]=this.download(e)),this.svgElSource&&t[e].isPending()&&!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.isPending)return e;var t=!0,n=e.then((function(e){return t=!1,e}),(function(e){throw t=!1,e}));return n.isPending=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}},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.appendChild(r)}}(e,this.title),e.innerHTML},getSource:function(e){var n=this;t[e]\|\|(t[e]=this.download(e)),this.svgElSource&&t[e].isPending()&&!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.isPending)return e;var t=!0,n=e.then((function(e){return t=!1,e}),(function(e){throw t=!1,e}));return n.isPending=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()})))}}}}));

package.json

		{
		"name": "vue-inline-svg",
		"version": "3.0.0-beta.2",
		"version": "3.0.0-beta.3",
		"description": "Replace SVG images with inline SVG element",
		@@ -44,12 +44,12 @@ "main": "dist/vue-inline-svg.js",
		"devDependencies": {
		"@babel/core": "^7.10.5",
		"@babel/preset-env": "^7.10.4",
		"eslint": "^7.5.0",
		"eslint-config-airbnb-base": "^14.2.0",
		"eslint-plugin-import": "^2.22.0",
		"@babel/core": "^7.14.0",
		"@babel/preset-env": "^7.14.0",
		"@rollup/plugin-babel": "^5.3.0",
		"eslint": "^7.25.0",
		"eslint-config-airbnb-base": "^14.2.1",
		"eslint-plugin-import": "^2.22.1",
		"pre-commit": "^1.2.2",
		"rollup": "^2.23.0",
		"rollup-plugin-babel": "^4.4.0",
		"rollup-plugin-terser": "^6.1.0"
		"rollup": "^2.46.0",
		"rollup-plugin-terser": "^7.0.2"
		}
		}

src/index.js

		@@ -22,3 +22,3 @@ // eslint-disable-next-line import/no-extraneous-dependencies
		const InlineSvg = {
		// name: 'inline-svg',
		name: 'InlineSvg',
		inheritAttrs: false,
		@@ -25,0 +25,0 @@ render() {

vue-inline-svg - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics