ionicons/components/ion-icon.js

Premium icons for Ionic.

import{i as o,p as t,t as i,H as n,a as s,g as r,b as e,h as c,c as l,d as a}from"./index.js";const d=t=>{if(1===t.nodeType){if("script"===t.nodeName.toLowerCase())return!1;for(let i=0;i<t.attributes.length;i++){const n=t.attributes[i].name;if(o(n)&&0===n.toLowerCase().indexOf("on"))return!1}for(let o=0;o<t.childNodes.length;o++)if(!d(t.childNodes[o]))return!1}return!0},h=new Map,f=new Map;let m;function u(o){return h.set(o,""),""}const p=t(class extends n{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.iconName=null,this.inheritedAttributes={},this.didLoadIcon=!1,this.isVisible=!1,this.mode=g(),this.lazy=!1,this.sanitize=!0}componentWillLoad(){this.inheritedAttributes=s(this.el,["aria-label"])}connectedCallback(){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=!0,this.loadIcon()}))}componentDidLoad(){this.didLoadIcon||this.loadIcon()}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=void 0)}waitUntilVisible(o,t,i){if(!this.lazy||"undefined"==typeof window||!window.IntersectionObserver)return i();const n=this.io=new window.IntersectionObserver((o=>{o[0].isIntersecting&&(n.disconnect(),this.io=void 0,i())}),{rootMargin:t});n.observe(o)}loadIcon(){if(this.isVisible){const o=r(this);o&&(h.has(o)?this.svgContent=h.get(o):((o,t)=>f.get(o)||("undefined"!=typeof fetch&&"undefined"!=typeof document?(o=>o.startsWith("data:image/svg+xml"))(o)&&(o=>-1!==o.indexOf(";utf8,"))(o)?Promise.resolve(function(o){m||(m=new DOMParser);const t=m.parseFromString(o,"text/html").querySelector("svg");if(t)return h.set(o,t.outerHTML),t.outerHTML;throw Error("Could not parse svg from "+o)}(o)):function(o,t){const i=fetch(o).then((i=>i.text().then((i=>{i&&!1!==t&&(i=(o=>{const t=document.createElement("div");t.innerHTML=o;for(let o=t.childNodes.length-1;o>=0;o--)"svg"!==t.childNodes[o].nodeName.toLowerCase()&&t.removeChild(t.childNodes[o]);const i=t.firstElementChild;if(i&&"svg"===i.nodeName.toLowerCase()){const o=i.getAttribute("class")||"";if(i.setAttribute("class",(o+" s-ion-icon").trim()),d(i))return t.innerHTML}return""})(i));const n=i||"";return h.set(o,n),n})).catch((()=>u(o))))).catch((()=>u(o)));return f.set(o,i),i}(o,t):Promise.resolve(u(o))))(o,this.sanitize).then((()=>this.svgContent=h.get(o))),this.didLoadIcon=!0)}this.iconName=e(this.name,this.icon,this.mode,this.ios,this.md)}render(){const{flipRtl:o,iconName:t,inheritedAttributes:i,el:n}=this,s=this.mode||"md",r=!!t&&(t.includes("arrow")||t.includes("chevron"))&&!1!==o,e=o||r;return c(a,Object.assign({key:"0578c899781ca145dd8205acd9670af39b57cf2e",role:"img",class:Object.assign(Object.assign({[s]:!0},b(this.color)),{["icon-"+this.size]:!!this.size,"flip-rtl":e,"icon-rtl":e&&l(n)})},i),this.svgContent?c("div",{class:"icon-inner",innerHTML:this.svgContent}):c("div",{class:"icon-inner"},c("slot",null)))}static get assetsDirs(){return["svg"]}get el(){return this}static get watchers(){return{name:[{loadIcon:0}],src:[{loadIcon:0}],icon:[{loadIcon:0}],ios:[{loadIcon:0}],md:[{loadIcon:0}]}}static get style(){return":host{display:inline-block;width:1em;height:1em;font-size:1em;contain:layout style;fill:currentColor;box-sizing:content-box !important}:host .ionicon{stroke:currentColor}.ionicon-fill-none{fill:none}.ionicon-stroke-width{stroke-width:var(--ionicon-stroke-width, 32px)}.icon-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.ionicon,svg{display:block;height:100%;width:100%}::slotted(*){font-size:inherit !important}@supports (background: -webkit-named-image(i)){:host(.icon-rtl) .icon-inner{transform:scaleX(-1)}}@supports not selector(:dir(rtl)) and selector(:host-context([dir='rtl'])){:host(.icon-rtl) .icon-inner{transform:scaleX(-1)}}:host(.flip-rtl):host-context([dir='rtl']) .icon-inner{transform:scaleX(-1)}@supports selector(:dir(rtl)){:host(.flip-rtl:dir(rtl)) .icon-inner{transform:scaleX(-1)}:host(.flip-rtl:dir(ltr)) .icon-inner{transform:scaleX(1)}}:host(.icon-small){font-size:1.125rem !important}:host(.icon-large){font-size:2rem !important}:host(.ion-color){color:var(--ion-color-base) !important}:host(.ion-color-primary){--ion-color-base:var(--ion-color-primary, #3880ff)}:host(.ion-color-secondary){--ion-color-base:var(--ion-color-secondary, #0cd1e8)}:host(.ion-color-tertiary){--ion-color-base:var(--ion-color-tertiary, #f4a942)}:host(.ion-color-success){--ion-color-base:var(--ion-color-success, #10dc60)}:host(.ion-color-warning){--ion-color-base:var(--ion-color-warning, #ffce00)}:host(.ion-color-danger){--ion-color-base:var(--ion-color-danger, #f14141)}:host(.ion-color-light){--ion-color-base:var(--ion-color-light, #f4f5f8)}:host(.ion-color-medium){--ion-color-base:var(--ion-color-medium, #989aa2)}:host(.ion-color-dark){--ion-color-base:var(--ion-color-dark, #222428)}"}},[257,"ion-icon",{mode:[1025],color:[1],ios:[1],md:[1],flipRtl:[4,"flip-rtl"],name:[513],src:[1],icon:[8],size:[1],lazy:[4],sanitize:[4],svgContent:[32],isVisible:[32]},void 0,{name:[{loadIcon:0}],src:[{loadIcon:0}],icon:[{loadIcon:0}],ios:[{loadIcon:0}],md:[{loadIcon:0}]}]),g=()=>"undefined"!=typeof document&&document.documentElement.getAttribute("mode")||"md",b=o=>o?{"ion-color":!0,["ion-color-"+o]:!0}:null,v=p,w=function(){"undefined"!=typeof customElements&&["ion-icon"].forEach((o=>{"ion-icon"===o&&(customElements.get(i(o))||customElements.define(i(o),p))}))};export{v as IonIcon,w as defineCustomElement}