@postnord/web-components
Version:
PostNord Web Components
6 lines • 3.06 kB
JavaScript
/*!
* Built with Stencil
* By PostNord.
*/
import{r as e,g as a,f as t,h as s,a as i}from"./p-c2c6299e.js";import{e as d,j as n}from"./p-c511b4fb.js";import{a as c}from"./p-2e6481e5.js";const r="pn-header{display:block}pn-header h1{color:#2d2013;margin:0}pn-header p{color:#5e554a;margin:0}pn-header .pn-header-breadcrumbs{width:100%}pn-header .pn-header-container{position:relative;width:100%;max-width:var(--max-width);margin:0 auto;padding:clamp(1em, 3vw, 2em) clamp(0.5em, 3vw, 2em);display:flex;flex-wrap:wrap;align-items:center;gap:1.5em}pn-header .pn-header-container>pn-text-link{display:block}pn-header .pn-header-content{flex:1 1 auto;display:flex;flex-direction:column;gap:1em}pn-header .pn-header [slot=buttons]{display:flex;flex-direction:column;gap:1em}";const h=r;const o={sv:"Tillbaka",en:"Back",da:"Tilbage",fi:"Takaisin",no:"Tilbake"};const l=class{constructor(a){e(this,a)}mo;hasBreadcrumb=false;hasMenu=false;hasButtons=false;get hostElement(){return a(this)}heading;maxWidth;setMaxWidth(){if(!this.maxWidth)return;this.hostElement.style.setProperty("--max-width",this.maxWidth)}goBackHref;goBackText;language=null;setLanguage(){this.goBackTextTranslated=this.goBackText||o[this.language||d]}goBackTextTranslated;async componentWillLoad(){if(this.mo)this.mo.disconnect();this.mo=new MutationObserver((()=>{t(this.hostElement);this.checkSlots()}));this.mo.observe(this.hostElement,{childList:true,subtree:true});this.checkSlots();this.setMaxWidth();this.setLanguage();if(this.language)return;await n(this.hostElement)}checkSlots(){this.hasBreadcrumb=!!this.hostElement.querySelector('[slot="breadcrumb"]');this.hasMenu=!!this.hostElement.querySelector('[slot="menu"]');this.hasButtons=!!this.hostElement.querySelector('[slot="buttons"]')}showBreadcrumb(){return this.hasBreadcrumb||!!this.goBackHref?.length}render(){return s(i,{key:"07db4e2989bad2c31854e3027e758d34c3aaf192"},s("header",{key:"465b0e73e01985282ee142ae539c432630173529",class:"pn-header"},s("div",{key:"a65dcf2d28781308e3d91433987e3a773b30da12",class:"pn-header-container"},s("div",{key:"18d6d93d83ce7f681f52782ace7daa9c75b71ffc",class:"pn-header-breadcrumbs",hidden:!this.showBreadcrumb()},this.goBackHref&&s("pn-text-link",{key:"35cbde24fb1bcc9d9d327e20acf5be4afb08e17e",label:this.goBackTextTranslated,href:this.goBackHref,icon:c,leftIcon:true}),s("slot",{key:"f4716b9ca6e7ae4c8be1cc08ced559ee6b73092c",name:"breadcrumb"})),s("div",{key:"501fc1cef17951ad68745d42b59d97f814ad7681",class:"pn-header-content"},this.heading&&s("h1",{key:"e07f0524c2f6e9d623c7f5143c2b0c069836f0f7"},this.heading),s("slot",{key:"e0c67ecc93e7e93a7ecf05d92d9051cd0da18e72"})),s("div",{key:"4e483ade9e3704872f1cba25d80229f19078c503",class:"pn-header-buttons",hidden:!this.hasButtons},s("slot",{key:"24fa16a74d9f5879f14b9b032d567bd28630f070",name:"buttons"})),s("slot",{key:"2ee40b1721ccc2f076525d32bf74720b9311a5f3",name:"menu"}))))}static get watchers(){return{maxWidth:["setMaxWidth"],language:["setLanguage"]}}};l.style=h;export{l as pn_header};
//# sourceMappingURL=p-a77aea6b.entry.js.map