@postnord/web-components
Version:
PostNord Web Components
5 lines • 1.52 kB
JavaScript
/*!
* Built with Stencil
* By PostNord.
*/
import{t,r as i,g as s,h as n,a as l}from"./p-XKg-ydzH.js";const e=class{constructor(t){i(this,t)}get hostElement(){return s(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 n(l,{key:"30a6824eaa6972efee63b5f893defb80bac7821c"},n("span",{key:"d27b45f1789b6c93d34ab0b1c673bda9fff60c0b",role:"presentation",class:"pn-illustration","data-fill":this.fill,innerHTML:this.illustration}))}static get watchers(){return{fill:[{handleFill:0}]}}};e.style=`${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}`;export{e as pn_illustration}