@tradeshift/elements.icon - npm Package Compare versions

Comparing version 0.39.0 to 0.40.0

lib/icon.esm.js

@@ -1,1 +0,1 @@
-import{helpers as t,constants as r,customElementDefineHelper as e,html as o,TSElement as n,css as i,unsafeCSS as s}from"@tradeshift/elements";function c(t,r){for(var e=0;e<r.length;e++){var o=r[e];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function a(){return a=Object.assign?Object.assign.bind():function(t){for(var r=1;r<arguments.length;r++){var e=arguments[r];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])}return t},a.apply(this,arguments)}function l(t,r){return l=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,r){return t.__proto__=r,t},l(t,r)}function h(t,r){return r||(r=t.slice(0)),t.raw=r,t}var u,p={ICON_WRAPPER:"icon-wrapper",CIRCULAR_BG:"circular-background"};a({},t.classNamesToSelector(p));var f,g,v=r.colors,d=r.colorModifiers,y={DEFAULT:"default",INVERTED:"inverted",PRIMARY:"primary",DANGER:"danger",ERROR:"error",SUCCESS:"success",ACTIVE:"active",INFO:"info",FOCUS:"focus",WARNING:"warning",DISABLED:"disabled",DISABLED_CHECKED:"disabled-checked",SUGGESTED:"suggested",SLATE_LIGHTEST:"slate-lightest",GRAY_DARKER:"gray-darker",ACTION:"action"},b=((u={})[y.DEFAULT]=v.SLATE,u[y.INVERTED]=v.WHITE,u[y.DANGER]=v.RED,u[y.ERROR]=v.RED,u[y.SUCCESS]=v.GREEN,u[y.PRIMARY]=v.BLUE,u[y.ACTIVE]=v.BLUE,u[y.INFO]=v.BLUE,u[y.FOCUS]=v.BLUE,u[y.WARNING]=v.ORANGE,u[y.DISABLED]=v.GRAY+d.LIGHTER,u[y.SUGGESTED]=v.PURPLE,u[y.DISABLED_CHECKED]=v.GRAY+d.LIGHT,u[y.SLATE_LIGHTEST]=v.SLATE+d.LIGHTEST,u[y.GRAY_DARKER]=v.GRAY+d.DARKER,u[y.ACTION]=v.GRAY,u),E={SMALL:"small",MEDIUM:"medium",LARGE:"large",EXTRA_LARGE:"extra-large"},m=function(t){var r,e;function a(){var r;return(r=t.call(this)||this).size=E.MEDIUM,r.iconCache=new Map,r.svgContent="",r}e=t,(r=a).prototype=Object.create(e.prototype),r.prototype.constructor=r,l(r,e);var u,v,d,m=a.prototype;return m.attributeChangedCallback=function(r,e,o){var n=this;switch(t.prototype.attributeChangedCallback.call(this,r,e,o),r){case"icon":!this.src&&o&&window.customElements.whenDefined("ts-icon").then((function(){n.getIcon()}));break;case"src":o&&window.customElements.whenDefined("ts-icon").then((function(){n.getSrc()}))}},m.getIcon=function(){return new Promise(function(t,r){var e,o,n;if(this.icon.indexOf("<svg")>-1&&this.icon.indexOf("</svg>")>-1)return this.svgContent=this.parseSvg(this.icon),t();if(!this.iconCache.has(this.icon)){var i=function(){try{return c.call(this)}catch(t){return r(t)}}.bind(this),s=function(e){try{return console.error(e),this.svgContent="",t()}catch(t){return r(t)}}.bind(this);try{return Promise.resolve(import("@tradeshift/elements.icon/lib/assets/icons/"+this.icon+".svg")).then(function(r){try{return e=r.default,Promise.resolve(fetch(e)).then(function(r){try{return(o=r).ok?Promise.resolve(this.extractSvgContent(o)).then(function(t){try{return n=t,this.iconCache.set(this.icon,n),i()}catch(t){return s(t)}}.bind(this),s):(this.svgContent="",t())}catch(t){return s(t)}}.bind(this),s)}catch(t){return s(t)}}.bind(this),s)}catch(t){s(t)}}function c(){return this.svgContent=this.iconCache.get(this.icon),t()}return c.call(this)}.bind(this))},m.getSrc=function(){return new Promise(function(t,r){var e,o;if(!this.iconCache.has(this.src)){var n=function(){try{return s.call(this)}catch(t){return r(t)}}.bind(this),i=function(e){try{return console.error(e),this.svgContent="",t()}catch(t){return r(t)}}.bind(this);try{return Promise.resolve(fetch(this.src)).then(function(r){try{return(e=r).ok?Promise.resolve(this.extractSvgContent(e)).then(function(t){try{return o=t,this.iconCache.set(this.src,o),n()}catch(t){return i(t)}}.bind(this),i):(this.svgContent="",t())}catch(t){return i(t)}}.bind(this),i)}catch(t){i(t)}}function s(){return this.svgContent=this.iconCache.get(this.src),t()}return s.call(this)}.bind(this))},m.parseSvg=function(t){return(new DOMParser).parseFromString(t,"image/svg+xml").firstChild},m.extractSvgContent=function(t){return new Promise(function(r,e){var o;return Promise.resolve(t.text()).then(function(t){try{return o=t,r(this.parseSvg(o))}catch(t){return e(t)}}.bind(this),e)}.bind(this))},m.render=function(){return o(f||(f=h(['<span class="','">',"</span>"])),p.ICON_WRAPPER,this.svgContent)},u=a,d=[{key:"styles",get:function(){var t=Object.keys(y).map((function(t){var r=y[t],e=b[r];return i(g||(g=h(["\n\t\t\t\t:host([type='","']) {\n\t\t\t\t\t--ts-icon-color: var(--ts-color-",");\n\t\t\t\t}\n\t\t\t"])),s(r),s(e))}));return[n.styles,s(':host{display:inline-block}:host svg{color:var(--ts-icon-color)}.fill-none{fill:none}:host([size=small]) .icon-wrapper{height:12px;height:var(--ts-fontsize-mini);width:12px;width:var(--ts-fontsize-mini)}:host([size=medium]) .icon-wrapper{height:16px;height:var(--ts-fontsize-medium);width:16px;width:var(--ts-fontsize-medium)}:host([size=large]) .icon-wrapper{height:24px;height:var(--ts-fontsize-xbig);width:24px;width:var(--ts-fontsize-xbig)}:host([size=extra-large]) .icon-wrapper{height:60px;height:var(--ts-unit-triple);width:60px;width:var(--ts-unit-triple)}:host([rotate="90"]) .icon-wrapper{-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host([rotate="180"]) .icon-wrapper{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host([rotate="270"]) .icon-wrapper{-webkit-transform:rotate(270deg);transform:rotate(270deg)}:host([flip=h]) .icon-wrapper,:host([flip=horizontal]) .icon-wrapper{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host([flip=v]) .icon-wrapper,:host([flip=vertical]) .icon-wrapper{-webkit-transform:scaleY(-1);transform:scaleY(-1)}.icon-wrapper{display:block;height:0;padding-top:100%;position:relative;width:100%}svg{height:100%;left:0;position:absolute;top:0;width:100%}:host([type=default]) svg{color:#1f2a2e;color:var(--ts-color-slate)}:host([type=inverted]) svg{color:#fff;color:var(--ts-color-white)}:host([type=primary]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=danger]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=error]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=success]) svg{color:#50c610;color:var(--ts-color-green)}:host([type=active]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=info]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=focus]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=warning]) svg{color:#ff8c00;color:var(--ts-color-orange)}:host([type=disabled]) svg{color:#e6ecef;color:var(--ts-color-gray-lighter)}:host([type=disabled-checked]) svg{color:#cbd7dc;color:var(--ts-color-gray-light)}:host([type=suggested]) svg{color:#90129b;color:var(--ts-color-purple)}:host([type=slate-lightest]) svg{color:#506b77;color:var(--ts-color-slate-lightest)}:host([type=gray-darker]) svg{color:#648796;color:var(--ts-color-gray-darker)}:host([type=action]) svg{color:#9ab2bc;color:var(--ts-color-gray)}:host([circular]){background-color:var(--ts-icon-color);border-radius:50%}:host([circular]) svg{color:#fff;color:var(--ts-color-white)}')].concat(t)}},{key:"properties",get:function(){return{icon:{type:String,reflect:!0},src:{type:String,reflect:!0},size:{type:String,reflect:!0},type:{type:String,reflect:!0},circular:{type:Boolean,reflect:!0},rotate:{type:Number,reflect:!0},flip:{type:String,reflect:!0},svgContent:{type:String,attribute:!1}}}}],(v=null)&&c(u.prototype,v),d&&c(u,d),Object.defineProperty(u,"prototype",{writable:!1}),a}(n);e("ts-icon",m);export{m as TSIcon,p as classNames,E as sizes,b as typeColors,y as types};
+import{helpers as t,constants as r,customElementDefineHelper as e,html as o,TSElement as n,css as i,unsafeCSS as s}from"@tradeshift/elements";function c(t,r){for(var e=0;e<r.length;e++){var o=r[e];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function a(){return a=Object.assign?Object.assign.bind():function(t){for(var r=1;r<arguments.length;r++){var e=arguments[r];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])}return t},a.apply(this,arguments)}function l(t,r){return l=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,r){return t.__proto__=r,t},l(t,r)}function h(t,r){return r||(r=t.slice(0)),t.raw=r,t}var u,p={ICON_WRAPPER:"icon-wrapper",CIRCULAR_BG:"circular-background"};a({},t.classNamesToSelector(p));var g,f,v=r.colors,d=r.colorModifiers,y={DEFAULT:"default",INVERTED:"inverted",PRIMARY:"primary",DANGER:"danger",ERROR:"error",SUCCESS:"success",ACTIVE:"active",INFO:"info",FOCUS:"focus",WARNING:"warning",DISABLED:"disabled",DISABLED_CHECKED:"disabled-checked",SUGGESTED:"suggested",SLATE_LIGHTEST:"slate-lightest",GRAY_DARKER:"gray-darker",ACTION:"action"},b=((u={})[y.DEFAULT]=v.SLATE,u[y.INVERTED]=v.WHITE,u[y.DANGER]=v.RED,u[y.ERROR]=v.RED,u[y.SUCCESS]=v.GREEN,u[y.PRIMARY]=v.BLUE,u[y.ACTIVE]=v.BLUE,u[y.INFO]=v.BLUE,u[y.FOCUS]=v.BLUE,u[y.WARNING]=v.ORANGE,u[y.DISABLED]=v.GRAY+d.LIGHTER,u[y.SUGGESTED]=v.PURPLE,u[y.DISABLED_CHECKED]=v.GRAY+d.LIGHT,u[y.SLATE_LIGHTEST]=v.SLATE+d.LIGHTEST,u[y.GRAY_DARKER]=v.GRAY+d.DARKER,u[y.ACTION]=v.GRAY,u),E={SMALL:"small",MEDIUM:"medium",LARGE:"large",EXTRA_LARGE:"extra-large"},m=function(t){var r,e;function a(){var r;return(r=t.call(this)||this).size=E.MEDIUM,r.iconCache=new Map,r.svgContent="",r}e=t,(r=a).prototype=Object.create(e.prototype),r.prototype.constructor=r,l(r,e);var u,v,d,m=a.prototype;return m.attributeChangedCallback=function(r,e,o){var n=this;switch(t.prototype.attributeChangedCallback.call(this,r,e,o),r){case"icon":!this.src&&o&&window.customElements.whenDefined("ts-icon").then((function(){n.getIcon()}));break;case"src":o&&window.customElements.whenDefined("ts-icon").then((function(){n.getSrc()}))}},m.getIcon=function(){return new Promise(function(t,r){var e,o,n;if(this.validateSvg(this.icon))return this.svgContent=this.parseSvg(this.icon),t();if(this.iconCache.has(this.icon))return this.svgContent=this.iconCache.get(this.icon),t();var i=function(){try{return t()}catch(t){return r(t)}},s=function(t){try{return console.error(t),this.svgContent="",i()}catch(t){return r(t)}}.bind(this);try{return Promise.resolve(import("@tradeshift/elements.icon/lib/assets/icons/"+this.icon+".svg")).then(function(r){try{return e=r.default,o="",this.validateSvg(e)?(o=this.parseSvg(e),c.call(this)):Promise.resolve(fetch(e)).then(function(r){try{return(n=r).ok?Promise.resolve(this.extractSvgContent(n)).then(function(t){try{return o=t,c.call(this)}catch(t){return s(t)}}.bind(this),s):(this.svgContent="",t())}catch(t){return s(t)}}.bind(this),s);function c(){return this.iconCache.set(this.icon,o),this.svgContent=o,i()}}catch(a){return s(a)}}.bind(this),s)}catch(t){s(t)}}.bind(this))},m.getSrc=function(){return new Promise(function(t,r){var e,o;if(this.iconCache.has(this.src))return this.svgContent=this.iconCache.get(this.src),t();var n=function(){try{return t()}catch(t){return r(t)}},i=function(t){try{return console.error(t),this.svgContent="",n()}catch(t){return r(t)}}.bind(this);try{return Promise.resolve(fetch(this.src)).then(function(r){try{return(e=r).ok?Promise.resolve(this.extractSvgContent(e)).then(function(t){try{return o=t,this.iconCache.set(this.src,o),this.svgContent=o,n()}catch(t){return i(t)}}.bind(this),i):(this.svgContent="",t())}catch(t){return i(t)}}.bind(this),i)}catch(t){i(t)}}.bind(this))},m.validateSvg=function(t){return t.indexOf("<svg")>-1&&t.indexOf("</svg>")>-1},m.parseSvg=function(t){return(new DOMParser).parseFromString(t,"image/svg+xml").firstChild},m.extractSvgContent=function(t){return new Promise(function(r,e){var o;return Promise.resolve(t.text()).then(function(t){try{return o=t,r(this.parseSvg(o))}catch(t){return e(t)}}.bind(this),e)}.bind(this))},m.render=function(){return o(g||(g=h(['<span class="','">',"</span>"])),p.ICON_WRAPPER,this.svgContent)},u=a,d=[{key:"styles",get:function(){var t=Object.keys(y).map((function(t){var r=y[t],e=b[r];return i(f||(f=h(["\n\t\t\t\t:host([type='","']) {\n\t\t\t\t\t--ts-icon-color: var(--ts-color-",");\n\t\t\t\t}\n\t\t\t"])),s(r),s(e))}));return[n.styles,s(':host{display:inline-block}:host svg{color:var(--ts-icon-color)}.fill-none{fill:none}:host([size=small]) .icon-wrapper{height:12px;height:var(--ts-fontsize-mini);width:12px;width:var(--ts-fontsize-mini)}:host([size=medium]) .icon-wrapper{height:16px;height:var(--ts-fontsize-medium);width:16px;width:var(--ts-fontsize-medium)}:host([size=large]) .icon-wrapper{height:24px;height:var(--ts-fontsize-xbig);width:24px;width:var(--ts-fontsize-xbig)}:host([size=extra-large]) .icon-wrapper{height:60px;height:var(--ts-unit-triple);width:60px;width:var(--ts-unit-triple)}:host([rotate="90"]) .icon-wrapper{-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host([rotate="180"]) .icon-wrapper{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host([rotate="270"]) .icon-wrapper{-webkit-transform:rotate(270deg);transform:rotate(270deg)}:host([flip=h]) .icon-wrapper,:host([flip=horizontal]) .icon-wrapper{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host([flip=v]) .icon-wrapper,:host([flip=vertical]) .icon-wrapper{-webkit-transform:scaleY(-1);transform:scaleY(-1)}.icon-wrapper{display:block;height:0;padding-top:100%;position:relative;width:100%}svg{height:100%;left:0;position:absolute;top:0;width:100%}:host([type=default]) svg{color:#1f2a2e;color:var(--ts-color-slate)}:host([type=inverted]) svg{color:#fff;color:var(--ts-color-white)}:host([type=primary]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=danger]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=error]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=success]) svg{color:#50c610;color:var(--ts-color-green)}:host([type=active]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=info]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=focus]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=warning]) svg{color:#ff8c00;color:var(--ts-color-orange)}:host([type=disabled]) svg{color:#e6ecef;color:var(--ts-color-gray-lighter)}:host([type=disabled-checked]) svg{color:#cbd7dc;color:var(--ts-color-gray-light)}:host([type=suggested]) svg{color:#90129b;color:var(--ts-color-purple)}:host([type=slate-lightest]) svg{color:#506b77;color:var(--ts-color-slate-lightest)}:host([type=gray-darker]) svg{color:#648796;color:var(--ts-color-gray-darker)}:host([type=action]) svg{color:#9ab2bc;color:var(--ts-color-gray)}:host([circular]){background-color:var(--ts-icon-color);border-radius:50%}:host([circular]) svg{color:#fff;color:var(--ts-color-white)}')].concat(t)}},{key:"properties",get:function(){return{icon:{type:String,reflect:!0},src:{type:String,reflect:!0},size:{type:String,reflect:!0},type:{type:String,reflect:!0},circular:{type:Boolean,reflect:!0},rotate:{type:Number,reflect:!0},flip:{type:String,reflect:!0},svgContent:{type:String,attribute:!1}}}}],(v=null)&&c(u.prototype,v),d&&c(u,d),Object.defineProperty(u,"prototype",{writable:!1}),a}(n);e("ts-icon",m);export{m as TSIcon,p as classNames,E as sizes,b as typeColors,y as types};

lib/icon.umd.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@tradeshift/elements")):"function"==typeof define&&define.amd?define(["exports","@tradeshift/elements"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).ts=t.ts||{},t.ts.elements=t.ts.elements||{},t.ts.elements.icon=t.ts.elements.icon||{}),t.ts.elements)}(this,(function(t,e){"use strict";function r(t,e){for(var r=0;r<e.length;r++){var o=e[r];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function o(){return o=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(t[o]=r[o])}return t},o.apply(this,arguments)}function n(t,e){return n=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},n(t,e)}function s(t,e){return e||(e=t.slice(0)),t.raw=e,t}var i,c={ICON_WRAPPER:"icon-wrapper",CIRCULAR_BG:"circular-background"};o({},e.helpers.classNamesToSelector(c));var a,l,h=e.constants.colors,u=e.constants.colorModifiers,f={DEFAULT:"default",INVERTED:"inverted",PRIMARY:"primary",DANGER:"danger",ERROR:"error",SUCCESS:"success",ACTIVE:"active",INFO:"info",FOCUS:"focus",WARNING:"warning",DISABLED:"disabled",DISABLED_CHECKED:"disabled-checked",SUGGESTED:"suggested",SLATE_LIGHTEST:"slate-lightest",GRAY_DARKER:"gray-darker",ACTION:"action"},p=((i={})[f.DEFAULT]=h.SLATE,i[f.INVERTED]=h.WHITE,i[f.DANGER]=h.RED,i[f.ERROR]=h.RED,i[f.SUCCESS]=h.GREEN,i[f.PRIMARY]=h.BLUE,i[f.ACTIVE]=h.BLUE,i[f.INFO]=h.BLUE,i[f.FOCUS]=h.BLUE,i[f.WARNING]=h.ORANGE,i[f.DISABLED]=h.GRAY+u.LIGHTER,i[f.SUGGESTED]=h.PURPLE,i[f.DISABLED_CHECKED]=h.GRAY+u.LIGHT,i[f.SLATE_LIGHTEST]=h.SLATE+u.LIGHTEST,i[f.GRAY_DARKER]=h.GRAY+u.DARKER,i[f.ACTION]=h.GRAY,i),g={SMALL:"small",MEDIUM:"medium",LARGE:"large",EXTRA_LARGE:"extra-large"},v=function(t){var o,i;function h(){var e;return(e=t.call(this)||this).size=g.MEDIUM,e.iconCache=new Map,e.svgContent="",e}i=t,(o=h).prototype=Object.create(i.prototype),o.prototype.constructor=o,n(o,i);var u,v,d,y=h.prototype;return y.attributeChangedCallback=function(e,r,o){var n=this;switch(t.prototype.attributeChangedCallback.call(this,e,r,o),e){case"icon":!this.src&&o&&window.customElements.whenDefined("ts-icon").then((function(){n.getIcon()}));break;case"src":o&&window.customElements.whenDefined("ts-icon").then((function(){n.getSrc()}))}},y.getIcon=function(){return new Promise(function(t,e){var r,o,n;if(this.icon.indexOf("<svg")>-1&&this.icon.indexOf("</svg>")>-1)return this.svgContent=this.parseSvg(this.icon),t();if(!this.iconCache.has(this.icon)){var s=function(){try{return c.call(this)}catch(t){return e(t)}}.bind(this),i=function(r){try{return console.error(r),this.svgContent="",t()}catch(t){return e(t)}}.bind(this);try{return Promise.resolve(import("@tradeshift/elements.icon/lib/assets/icons/"+this.icon+".svg")).then(function(e){try{return r=e.default,Promise.resolve(fetch(r)).then(function(e){try{return(o=e).ok?Promise.resolve(this.extractSvgContent(o)).then(function(t){try{return n=t,this.iconCache.set(this.icon,n),s()}catch(t){return i(t)}}.bind(this),i):(this.svgContent="",t())}catch(t){return i(t)}}.bind(this),i)}catch(t){return i(t)}}.bind(this),i)}catch(t){i(t)}}function c(){return this.svgContent=this.iconCache.get(this.icon),t()}return c.call(this)}.bind(this))},y.getSrc=function(){return new Promise(function(t,e){var r,o;if(!this.iconCache.has(this.src)){var n=function(){try{return i.call(this)}catch(t){return e(t)}}.bind(this),s=function(r){try{return console.error(r),this.svgContent="",t()}catch(t){return e(t)}}.bind(this);try{return Promise.resolve(fetch(this.src)).then(function(e){try{return(r=e).ok?Promise.resolve(this.extractSvgContent(r)).then(function(t){try{return o=t,this.iconCache.set(this.src,o),n()}catch(t){return s(t)}}.bind(this),s):(this.svgContent="",t())}catch(t){return s(t)}}.bind(this),s)}catch(t){s(t)}}function i(){return this.svgContent=this.iconCache.get(this.src),t()}return i.call(this)}.bind(this))},y.parseSvg=function(t){return(new DOMParser).parseFromString(t,"image/svg+xml").firstChild},y.extractSvgContent=function(t){return new Promise(function(e,r){var o;return Promise.resolve(t.text()).then(function(t){try{return o=t,e(this.parseSvg(o))}catch(t){return r(t)}}.bind(this),r)}.bind(this))},y.render=function(){return e.html(a||(a=s(['<span class="','">',"</span>"])),c.ICON_WRAPPER,this.svgContent)},u=h,d=[{key:"styles",get:function(){var t=Object.keys(f).map((function(t){var r=f[t],o=p[r];return e.css(l||(l=s(["\n\t\t\t\t:host([type='","']) {\n\t\t\t\t\t--ts-icon-color: var(--ts-color-",");\n\t\t\t\t}\n\t\t\t"])),e.unsafeCSS(r),e.unsafeCSS(o))}));return[e.TSElement.styles,e.unsafeCSS(':host{display:inline-block}:host svg{color:var(--ts-icon-color)}.fill-none{fill:none}:host([size=small]) .icon-wrapper{height:12px;height:var(--ts-fontsize-mini);width:12px;width:var(--ts-fontsize-mini)}:host([size=medium]) .icon-wrapper{height:16px;height:var(--ts-fontsize-medium);width:16px;width:var(--ts-fontsize-medium)}:host([size=large]) .icon-wrapper{height:24px;height:var(--ts-fontsize-xbig);width:24px;width:var(--ts-fontsize-xbig)}:host([size=extra-large]) .icon-wrapper{height:60px;height:var(--ts-unit-triple);width:60px;width:var(--ts-unit-triple)}:host([rotate="90"]) .icon-wrapper{-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host([rotate="180"]) .icon-wrapper{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host([rotate="270"]) .icon-wrapper{-webkit-transform:rotate(270deg);transform:rotate(270deg)}:host([flip=h]) .icon-wrapper,:host([flip=horizontal]) .icon-wrapper{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host([flip=v]) .icon-wrapper,:host([flip=vertical]) .icon-wrapper{-webkit-transform:scaleY(-1);transform:scaleY(-1)}.icon-wrapper{display:block;height:0;padding-top:100%;position:relative;width:100%}svg{height:100%;left:0;position:absolute;top:0;width:100%}:host([type=default]) svg{color:#1f2a2e;color:var(--ts-color-slate)}:host([type=inverted]) svg{color:#fff;color:var(--ts-color-white)}:host([type=primary]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=danger]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=error]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=success]) svg{color:#50c610;color:var(--ts-color-green)}:host([type=active]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=info]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=focus]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=warning]) svg{color:#ff8c00;color:var(--ts-color-orange)}:host([type=disabled]) svg{color:#e6ecef;color:var(--ts-color-gray-lighter)}:host([type=disabled-checked]) svg{color:#cbd7dc;color:var(--ts-color-gray-light)}:host([type=suggested]) svg{color:#90129b;color:var(--ts-color-purple)}:host([type=slate-lightest]) svg{color:#506b77;color:var(--ts-color-slate-lightest)}:host([type=gray-darker]) svg{color:#648796;color:var(--ts-color-gray-darker)}:host([type=action]) svg{color:#9ab2bc;color:var(--ts-color-gray)}:host([circular]){background-color:var(--ts-icon-color);border-radius:50%}:host([circular]) svg{color:#fff;color:var(--ts-color-white)}')].concat(t)}},{key:"properties",get:function(){return{icon:{type:String,reflect:!0},src:{type:String,reflect:!0},size:{type:String,reflect:!0},type:{type:String,reflect:!0},circular:{type:Boolean,reflect:!0},rotate:{type:Number,reflect:!0},flip:{type:String,reflect:!0},svgContent:{type:String,attribute:!1}}}}],(v=null)&&r(u.prototype,v),d&&r(u,d),Object.defineProperty(u,"prototype",{writable:!1}),h}(e.TSElement);e.customElementDefineHelper("ts-icon",v),t.TSIcon=v,t.classNames=c,t.sizes=g,t.typeColors=p,t.types=f,Object.defineProperty(t,"__esModule",{value:!0})}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@tradeshift/elements")):"function"==typeof define&&define.amd?define(["exports","@tradeshift/elements"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).ts=t.ts||{},t.ts.elements=t.ts.elements||{},t.ts.elements.icon=t.ts.elements.icon||{}),t.ts.elements)}(this,(function(t,e){"use strict";function r(t,e){for(var r=0;r<e.length;r++){var o=e[r];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function o(){return o=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(t[o]=r[o])}return t},o.apply(this,arguments)}function n(t,e){return n=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},n(t,e)}function s(t,e){return e||(e=t.slice(0)),t.raw=e,t}var i,c={ICON_WRAPPER:"icon-wrapper",CIRCULAR_BG:"circular-background"};o({},e.helpers.classNamesToSelector(c));var a,l,h=e.constants.colors,u=e.constants.colorModifiers,f={DEFAULT:"default",INVERTED:"inverted",PRIMARY:"primary",DANGER:"danger",ERROR:"error",SUCCESS:"success",ACTIVE:"active",INFO:"info",FOCUS:"focus",WARNING:"warning",DISABLED:"disabled",DISABLED_CHECKED:"disabled-checked",SUGGESTED:"suggested",SLATE_LIGHTEST:"slate-lightest",GRAY_DARKER:"gray-darker",ACTION:"action"},p=((i={})[f.DEFAULT]=h.SLATE,i[f.INVERTED]=h.WHITE,i[f.DANGER]=h.RED,i[f.ERROR]=h.RED,i[f.SUCCESS]=h.GREEN,i[f.PRIMARY]=h.BLUE,i[f.ACTIVE]=h.BLUE,i[f.INFO]=h.BLUE,i[f.FOCUS]=h.BLUE,i[f.WARNING]=h.ORANGE,i[f.DISABLED]=h.GRAY+u.LIGHTER,i[f.SUGGESTED]=h.PURPLE,i[f.DISABLED_CHECKED]=h.GRAY+u.LIGHT,i[f.SLATE_LIGHTEST]=h.SLATE+u.LIGHTEST,i[f.GRAY_DARKER]=h.GRAY+u.DARKER,i[f.ACTION]=h.GRAY,i),g={SMALL:"small",MEDIUM:"medium",LARGE:"large",EXTRA_LARGE:"extra-large"},v=function(t){var o,i;function h(){var e;return(e=t.call(this)||this).size=g.MEDIUM,e.iconCache=new Map,e.svgContent="",e}i=t,(o=h).prototype=Object.create(i.prototype),o.prototype.constructor=o,n(o,i);var u,v,d,y=h.prototype;return y.attributeChangedCallback=function(e,r,o){var n=this;switch(t.prototype.attributeChangedCallback.call(this,e,r,o),e){case"icon":!this.src&&o&&window.customElements.whenDefined("ts-icon").then((function(){n.getIcon()}));break;case"src":o&&window.customElements.whenDefined("ts-icon").then((function(){n.getSrc()}))}},y.getIcon=function(){return new Promise(function(t,e){var r,o,n;if(this.validateSvg(this.icon))return this.svgContent=this.parseSvg(this.icon),t();if(this.iconCache.has(this.icon))return this.svgContent=this.iconCache.get(this.icon),t();var s=function(){try{return t()}catch(t){return e(t)}},i=function(t){try{return console.error(t),this.svgContent="",s()}catch(t){return e(t)}}.bind(this);try{return Promise.resolve(import("@tradeshift/elements.icon/lib/assets/icons/"+this.icon+".svg")).then(function(e){try{return r=e.default,o="",this.validateSvg(r)?(o=this.parseSvg(r),c.call(this)):Promise.resolve(fetch(r)).then(function(e){try{return(n=e).ok?Promise.resolve(this.extractSvgContent(n)).then(function(t){try{return o=t,c.call(this)}catch(t){return i(t)}}.bind(this),i):(this.svgContent="",t())}catch(t){return i(t)}}.bind(this),i);function c(){return this.iconCache.set(this.icon,o),this.svgContent=o,s()}}catch(a){return i(a)}}.bind(this),i)}catch(t){i(t)}}.bind(this))},y.getSrc=function(){return new Promise(function(t,e){var r,o;if(this.iconCache.has(this.src))return this.svgContent=this.iconCache.get(this.src),t();var n=function(){try{return t()}catch(t){return e(t)}},s=function(t){try{return console.error(t),this.svgContent="",n()}catch(t){return e(t)}}.bind(this);try{return Promise.resolve(fetch(this.src)).then(function(e){try{return(r=e).ok?Promise.resolve(this.extractSvgContent(r)).then(function(t){try{return o=t,this.iconCache.set(this.src,o),this.svgContent=o,n()}catch(t){return s(t)}}.bind(this),s):(this.svgContent="",t())}catch(t){return s(t)}}.bind(this),s)}catch(t){s(t)}}.bind(this))},y.validateSvg=function(t){return t.indexOf("<svg")>-1&&t.indexOf("</svg>")>-1},y.parseSvg=function(t){return(new DOMParser).parseFromString(t,"image/svg+xml").firstChild},y.extractSvgContent=function(t){return new Promise(function(e,r){var o;return Promise.resolve(t.text()).then(function(t){try{return o=t,e(this.parseSvg(o))}catch(t){return r(t)}}.bind(this),r)}.bind(this))},y.render=function(){return e.html(a||(a=s(['<span class="','">',"</span>"])),c.ICON_WRAPPER,this.svgContent)},u=h,d=[{key:"styles",get:function(){var t=Object.keys(f).map((function(t){var r=f[t],o=p[r];return e.css(l||(l=s(["\n\t\t\t\t:host([type='","']) {\n\t\t\t\t\t--ts-icon-color: var(--ts-color-",");\n\t\t\t\t}\n\t\t\t"])),e.unsafeCSS(r),e.unsafeCSS(o))}));return[e.TSElement.styles,e.unsafeCSS(':host{display:inline-block}:host svg{color:var(--ts-icon-color)}.fill-none{fill:none}:host([size=small]) .icon-wrapper{height:12px;height:var(--ts-fontsize-mini);width:12px;width:var(--ts-fontsize-mini)}:host([size=medium]) .icon-wrapper{height:16px;height:var(--ts-fontsize-medium);width:16px;width:var(--ts-fontsize-medium)}:host([size=large]) .icon-wrapper{height:24px;height:var(--ts-fontsize-xbig);width:24px;width:var(--ts-fontsize-xbig)}:host([size=extra-large]) .icon-wrapper{height:60px;height:var(--ts-unit-triple);width:60px;width:var(--ts-unit-triple)}:host([rotate="90"]) .icon-wrapper{-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host([rotate="180"]) .icon-wrapper{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host([rotate="270"]) .icon-wrapper{-webkit-transform:rotate(270deg);transform:rotate(270deg)}:host([flip=h]) .icon-wrapper,:host([flip=horizontal]) .icon-wrapper{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host([flip=v]) .icon-wrapper,:host([flip=vertical]) .icon-wrapper{-webkit-transform:scaleY(-1);transform:scaleY(-1)}.icon-wrapper{display:block;height:0;padding-top:100%;position:relative;width:100%}svg{height:100%;left:0;position:absolute;top:0;width:100%}:host([type=default]) svg{color:#1f2a2e;color:var(--ts-color-slate)}:host([type=inverted]) svg{color:#fff;color:var(--ts-color-white)}:host([type=primary]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=danger]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=error]) svg{color:#bd0000;color:var(--ts-color-red)}:host([type=success]) svg{color:#50c610;color:var(--ts-color-green)}:host([type=active]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=info]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=focus]) svg{color:#00aeff;color:var(--ts-color-blue)}:host([type=warning]) svg{color:#ff8c00;color:var(--ts-color-orange)}:host([type=disabled]) svg{color:#e6ecef;color:var(--ts-color-gray-lighter)}:host([type=disabled-checked]) svg{color:#cbd7dc;color:var(--ts-color-gray-light)}:host([type=suggested]) svg{color:#90129b;color:var(--ts-color-purple)}:host([type=slate-lightest]) svg{color:#506b77;color:var(--ts-color-slate-lightest)}:host([type=gray-darker]) svg{color:#648796;color:var(--ts-color-gray-darker)}:host([type=action]) svg{color:#9ab2bc;color:var(--ts-color-gray)}:host([circular]){background-color:var(--ts-icon-color);border-radius:50%}:host([circular]) svg{color:#fff;color:var(--ts-color-white)}')].concat(t)}},{key:"properties",get:function(){return{icon:{type:String,reflect:!0},src:{type:String,reflect:!0},size:{type:String,reflect:!0},type:{type:String,reflect:!0},circular:{type:Boolean,reflect:!0},rotate:{type:Number,reflect:!0},flip:{type:String,reflect:!0},svgContent:{type:String,attribute:!1}}}}],(v=null)&&r(u.prototype,v),d&&r(u,d),Object.defineProperty(u,"prototype",{writable:!1}),h}(e.TSElement);e.customElementDefineHelper("ts-icon",v),t.TSIcon=v,t.classNames=c,t.sizes=g,t.typeColors=p,t.types=f,Object.defineProperty(t,"__esModule",{value:!0})}));

package.json

 {
   "name": "@tradeshift/elements.icon",
-  "version": "0.39.0",
+  "version": "0.40.0",
   "repository": {
@@ -22,6 +22,6 @@ "type": "git",
   "dependencies": {
-    "@tradeshift/elements": "^0.39.0"
+    "@tradeshift/elements": "^0.40.0"
   },
   "src": "src/icon.js",
-  "gitHead": "3553e0208b3f9a52c6ca850412507c39ca11e0b7"
+  "gitHead": "95eb701d1139386b893ad0ed34acb72284339732"
 }

No alert changes

Improved metrics

Total package byte prevSize

133068

increased by0.1%

Dependency changes

• + Added@tradeshift/elements@0.40.2(transitive)

• - Removed@tradeshift/elements@0.39.0(transitive)

• Updated@tradeshift/elements@^0.40.0