UNPKG

@zywave/zui-bundle

Version:

ZUI, out of the box, provides ES modules with bare path modifiers (e.g. `import '@zywave/zui-foo-bar'`). This is great as that's the way browsers are _going_, but they aren't there quite yet. Tooling exists to help solve this problem like webpack or rollu

2 lines (1 loc) 4.95 kB
import{k as e,i as t,c as i,e as s,Z as o,y as n,w as r,o as l}from"./_929d7f55.js";function h(t,i){return e({descriptor:e=>{const s={get(){var e,i;return null!==(i=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelector(t))&&void 0!==i?i:null},enumerable:!0,configurable:!0};if(i){const i="symbol"==typeof e?Symbol():"__"+e;s.get=function(){var e,s;return void 0===this[i]&&(this[i]=null!==(s=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelector(t))&&void 0!==s?s:null),this[i]}}return s}})}const a=t`:host{display:inline-block;width:var(--zui-icon-size,1.5rem);height:var(--zui-icon-size,1.5rem);line-height:1;fill:currentColor}:host .zui-icon-color{--zui-icon-color:currentColor}zui-svg{display:inherit;width:inherit;height:inherit;line-height:inherit;fill:inherit;pointer-events:none}:host(.small){width:var(--zui-icon-size,1rem);height:var(--zui-icon-size,1rem)}:host(.medium){width:var(--zui-icon-size,1.5rem);height:var(--zui-icon-size,1.5rem)}:host(.large){width:var(--zui-icon-size,2.25rem);height:var(--zui-icon-size,2.25rem)}:host(.xlarge){width:var(--zui-icon-size,3rem);height:var(--zui-icon-size,3rem)}`,c=t`:host{display:inline-block;width:var(--zui-svg-width,1rem);height:var(--zui-svg-height,1rem);margin:0;padding:0;line-height:1;fill:currentColor;pointer-events:none}:host .svg{display:inherit;width:inherit;height:inherit;line-height:inherit;fill:inherit;pointer-events:inherit}:host(.small){--zui-svg-width:1rem;--zui-svg-height:1rem}:host(.medium){--zui-svg-width:1.5rem;--zui-svg-height:1.5rem}:host(.large){--zui-svg-width:2.25rem;--zui-svg-height:2.25rem}:host(.xlarge){--zui-svg-width:3rem;--zui-svg-height:3rem}.svg-defs{display:none}`,d=e=>null!=e?e:i;var u=function(e,t,i,s){var o,n=arguments.length,r=n<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,s);else for(var l=e.length-1;l>=0;l--)(o=e[l])&&(r=(n<3?o(r):n>3?o(t,i,r):o(t,i))||r);return n>3&&r&&Object.defineProperty(t,i,r),r};class v extends o{constructor(){super(...arguments),this.svgId="",this.file="",this.svgNodeClone=null}static get styles(){return[super.styles,c]}render(){if(!this.svgId)return n`<style>:host{display:none}</style>`;this.svgNodeClone=void 0;const e=this.file?void 0:document.getElementById(this.svgId);e&&(this.svgNodeClone=e.cloneNode(!0));let t=this.viewBox;!t&&this.svgNodeClone&&(t=this.svgNodeClone.getAttribute("viewBox"));const i=`${this.file}#${this.svgId}`;return n`${this.svgNodeClone?n`<svg focusable="false" class="svg-defs"><defs>${this.svgNodeClone}</defs></svg>`:n``} ${r`<svg viewBox="${d(t)}" focusable="false" class="svg" id="svg"><use href="${i}" xlink:href="${i}"></use></svg>`}`}}u([s({type:String,attribute:"svg-id"})],v.prototype,"svgId",void 0),u([s({type:String,attribute:"file"})],v.prototype,"file",void 0),u([s({type:String,attribute:"viewBox"})],v.prototype,"viewBox",void 0),u([h("svg")],v.prototype,"_svg",void 0),window.customElements.define("zui-svg",v);const g={nav:()=>import("./_2c9e91a1.js"),fs:()=>import("./_afc328d6.js"),shell:()=>import("./_a1945e67.js"),system:()=>import("./_ba7ead9f.js"),search:()=>import("./_6fd98d87.js")},p=new Map;async function f(e){const t=function(e){const t=e.split("-");let i="";return t.length>2&&(i=t[1]),Object.prototype.hasOwnProperty.call(g,i)||(i="system"),i}(e),i=await function(e){let t=p.get(e);return t||(t=new Promise((async t=>{t((await g[e]()).svgSprite.strings[0])})),p.set(e,t)),t}(t);!function(e,t){if(!document.querySelector(`[data-icons-container='${t}']`)){const i=document.createElement("div");i.setAttribute("data-icons-container",t),i.style.display="none",i.innerHTML=e,document.head.appendChild(i)}}(i,t)}var m=function(e,t,i,s){var o,n=arguments.length,r=n<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,s);else for(var l=e.length-1;l>=0;l--)(o=e[l])&&(r=(n<3?o(r):n>3?o(t,i,r):o(t,i))||r);return n>3&&r&&Object.defineProperty(t,i,r),r};class y extends o{static get styles(){return[super.styles,a]}#e;#t;constructor(){super(),this.icon="",this.removeIconColor=!1,this.#e=null,this.#t=!1,this.attachInternals&&(this.#e=this.attachInternals())}async updated(e){e.has("icon")&&(this.#t=!1,this.requestUpdate(),await f(this.icon),this.#t=!0,this.requestUpdate(),await this.updateComplete,this.dispatchEvent(new CustomEvent("load",{bubbles:!0,detail:{svgLoaded:!0}})),this.#e?.states&&this.#e.states.add("--loaded"))}render(){if(!this.icon)return n`<style>:host{display:none}</style>`;const e={"zui-icon-color":this.removeIconColor};return n`${this.#t?n`<zui-svg class="${l(e)}" svg-id="${this.icon}"></zui-svg>`:n``}`}}m([s({type:String,attribute:"icon"})],y.prototype,"icon",void 0),m([s({type:Boolean,attribute:"no-color"})],y.prototype,"removeIconColor",void 0),window.customElements.define("zui-icon",y);export{y as Z,h as i,d as l};