@ionic/core
Version:
Base components for Ionic
4 lines • 6.88 kB
JavaScript
/*!
* (C) Ionic http://ionicframework.com - MIT License
*/
import{g as o,d as t,H as n,h as i,f as r,t as e}from"./p-Ct2aBEue.js";let s;const c=(o,t,n,i,r)=>(n="ios"===(n&&h(n))?"ios":"md",i&&"ios"===n?o=h(i):r&&"md"===n?o=h(r):(o||!t||a(t)||(o=t),d(o)&&(o=h(o))),d(o)&&""!==o.trim()?""!==o.replace(/[a-z]|-|\d/gi,"")?null:o:null),l=o=>d(o)&&(o=o.trim(),a(o))?o:null,a=o=>o.length>0&&/(\/|\.)/.test(o),d=o=>"string"==typeof o,h=o=>o.toLowerCase(),f=o=>{if(1===o.nodeType){if("script"===o.nodeName.toLowerCase())return!1;for(let t=0;t<o.attributes.length;t++){const n=o.attributes[t].name;if(d(n)&&0===n.toLowerCase().indexOf("on"))return!1}for(let t=0;t<o.childNodes.length;t++)if(!f(o.childNodes[t]))return!1}return!0},u=new Map,m=new Map;let p;function g(o){return u.set(o,""),""}const w=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=b(),this.lazy=!1,this.sanitize=!0}componentWillLoad(){this.inheritedAttributes=((o,t=[])=>{const n={};return t.forEach((t=>{o.hasAttribute(t)&&(null!==o.getAttribute(t)&&(n[t]=o.getAttribute(t)),o.removeAttribute(t))})),n})(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,n){if(!Boolean(this.lazy&&"undefined"!=typeof window&&window.IntersectionObserver))return n();const i=this.io=new window.IntersectionObserver((o=>{o[0].isIntersecting&&(i.disconnect(),this.io=void 0,n())}),{rootMargin:t});i.observe(o)}loadIcon(){if(this.isVisible){const t=(t=>{let n=l(t.src);if(n)return n;if(n=c(t.name,t.icon,t.mode,t.ios,t.md),n)return((t,n)=>{const i=(()=>{if("undefined"==typeof window)return new Map;if(!s){const o=window;o.Ionicons=o.Ionicons||{},s=o.Ionicons.map=o.Ionicons.map||new Map}return s})().get(t);if(i)return i;try{return o(`svg/${t}.svg`)}catch(o){console.log("e",o),console.warn(`[Ionicons Warning]: Could not load icon with name "${t}". Ensure that the icon is registered using addIcons or that the icon SVG data is passed directly to the icon component.`,n)}})(n,t);if(t.icon){if(n=l(t.icon),n)return n;if(n=l(t.icon[t.mode]),n)return n}return null})(this);t&&(u.has(t)?this.svgContent=u.get(t):((o,t)=>m.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){p||(p=new DOMParser);const t=p.parseFromString(o,"text/html").querySelector("svg");if(t)return u.set(o,t.outerHTML),t.outerHTML;throw new Error(`Could not parse svg from ${o}`)}(o)):function(o,t){const n=fetch(o).then((n=>n.text().then((n=>{n&&!1!==t&&(n=(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 n=t.firstElementChild;if(n&&"svg"===n.nodeName.toLowerCase()){const o=n.getAttribute("class")||"";if(n.setAttribute("class",(o+" s-ion-icon").trim()),f(n))return t.innerHTML}return""})(n));const i=n||"";return u.set(o,i),i})).catch((()=>g(o))))).catch((()=>g(o)));return m.set(o,n),n}(o,t):Promise.resolve(g(o))))(t,this.sanitize).then((()=>this.svgContent=u.get(t))),this.didLoadIcon=!0)}this.iconName=c(this.name,this.icon,this.mode,this.ios,this.md)}render(){const{flipRtl:o,iconName:t,inheritedAttributes:n,el:e}=this,s=this.mode||"md",c=!!t&&(t.includes("arrow")||t.includes("chevron"))&&!1!==o,l=o||c;return i(r,Object.assign({key:"0578c899781ca145dd8205acd9670af39b57cf2e",role:"img",class:Object.assign(Object.assign({[s]:!0},v(this.color)),{[`icon-${this.size}`]:!!this.size,"flip-rtl":l,"icon-rtl":l&&(a=e,a&&""!==a.dir?"rtl"===a.dir.toLowerCase():"rtl"===(null===document||void 0===document?void 0:document.dir.toLowerCase()))})},n),this.svgContent?i("div",{class:"icon-inner",innerHTML:this.svgContent}):i("div",{class:"icon-inner"},i("slot",null)));var a}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;-webkit-box-sizing:content-box !important;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:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack: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{-webkit-transform:scaleX(-1);transform:scaleX(-1)}}@supports not selector(:dir(rtl)) and selector(:host-context([dir='rtl'])){:host(.icon-rtl) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}}:host(.flip-rtl):host-context([dir='rtl']) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}@supports selector(:dir(rtl)){:host(.flip-rtl:dir(rtl)) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.flip-rtl:dir(ltr)) .icon-inner{-webkit-transform:scaleX(1);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}]}]),b=()=>"undefined"!=typeof document&&document.documentElement.getAttribute("mode")||"md",v=o=>o?{"ion-color":!0,[`ion-color-${o}`]:!0}:null;function y(){"undefined"!=typeof customElements&&["ion-icon"].forEach((o=>{"ion-icon"===o&&(customElements.get(e(o))||customElements.define(e(o),w))}))}export{w as I,y as d}