@postnord/web-components/components/pn-illustration2.js

PostNord Web Components

/*!
 * Built with Stencil
 * By PostNord.
 */
import{transformTag as t,proxyCustomElement as i,HTMLElement as s,h as l,Host as n}from"@stencil/core/internal/client";const e=i(class extends s{constructor(t){super(),!1!==t&&this.__registerHost()}get hostElement(){return this}illustration;width;height;fill=!1;handleFill(){this.fill&&(this.width="100%",this.height="100%")}componentWillRender(){if(this.handleFill(),this.width||this.height)return this.setSizes();this.getSizeFromSvg()}componentDidRender(){this.hostElement.querySelector("svg")?.setAttribute("width",this.width),this.hostElement.querySelector("svg")?.setAttribute("height",this.height)}getSizeFromSvg(){const t=this.illustration?.match(/<svg[^>]*?viewBox=(["\'])?((?:.(?!\1|>))*.?)\1?/)?.[2];if(!t)return;const[,,i="",s=""]=t?.split(" ")||[];i&&s&&(this.width=`${Number(i)}px`,this.height=`${Number(s)}px`,this.setSizes())}setSizes(){this.hostElement.style.setProperty("--pn-width",this.width),this.hostElement.style.setProperty("--pn-height",this.height)}render(){return l(n,{key:"30a6824eaa6972efee63b5f893defb80bac7821c"},l("span",{key:"d27b45f1789b6c93d34ab0b1c673bda9fff60c0b",role:"presentation",class:"pn-illustration","data-fill":this.fill,innerHTML:this.illustration}))}static get watchers(){return{fill:[{handleFill:0}]}}static get style(){return`${t("pn-illustration")}{display:inline-block}${t("pn-illustration")} .pn-illustration{display:inline-block}${t("pn-illustration")} .pn-illustration[data-fill]{display:block}${t("pn-illustration")} .pn-illustration>svg{width:var(--pn-width);height:var(--pn-height);display:block}`}},[512,"pn-illustration",{illustration:[1],width:[1025],height:[1025],fill:[4]},void 0,{fill:[{handleFill:0}]}]);function h(){"undefined"!=typeof customElements&&["pn-illustration"].forEach((i=>{"pn-illustration"===i&&(customElements.get(t(t(i)))||customElements.define(t(t(i)),e))}))}export{e as P,h as d}