UNPKG

@postnord/web-components

Version:

PostNord Web Components

6 lines 3.14 kB
/*! * Built with Stencil * By PostNord. */ import{r as e,g as a,f as t,h as s,a as d}from"./p-43660913.js";import{e as i,k as n}from"./p-f64d17a6.js";import{a as h}from"./p-2e6481e5.js";const c="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 r=c;const b={sv:"Tillbaka",en:"Back",da:"Tilbage",fi:"Takaisin",no:"Tilbake"};const l=class{constructor(a){e(this,a);this.heading=undefined;this.maxWidth=undefined;this.goBackHref=undefined;this.goBackText=undefined;this.language=null;this.goBackTextTranslated=undefined}mo;hasBreadcrumb=false;hasMenu=false;hasButtons=false;get hostElement(){return a(this)}setMaxWidth(){if(!this.maxWidth)return;this.hostElement.style.setProperty("--max-width",this.maxWidth)}setLanguage(){this.goBackTextTranslated=this.goBackText||b[this.language||i]}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(d,{key:"8493b17c1f553672941e7bddf7382e3e80377c71"},s("header",{key:"2026f9c75dde59abda45a0e376c24907657fe8e7",class:"pn-header"},s("div",{key:"dbf01bc588ed38cccb0f951fed4047c9e8192354",class:"pn-header-container"},s("div",{key:"115a52c44b0e5addf49e4807b21adeb84a531de9",class:"pn-header-breadcrumbs",hidden:!this.showBreadcrumb()},this.goBackHref&&s("pn-text-link",{key:"b2cce5ed46b6dcdb10a72bb806c5a406b6ff5e15",label:this.goBackTextTranslated,href:this.goBackHref,icon:h,leftIcon:true}),s("slot",{key:"27a3d3c38b30cba6d51c79a2c0bd18c6afa13a4c",name:"breadcrumb"})),s("div",{key:"8134ae8b844e9db548cb3db6bf995479c404fff1",class:"pn-header-content"},this.heading&&s("h1",{key:"3bf46740c66ca137adbc50fe6cdde178e82bfdbc"},this.heading),s("slot",{key:"94ee53b3dee5a388ef84ae91c54a5b96c14a2661"})),s("div",{key:"d44728888d295fd84285b28102b348da90ba5d80",class:"pn-header-buttons",hidden:!this.hasButtons},s("slot",{key:"7af9da3f81bedb69639f7f723c24d93caebaba24",name:"buttons"})),s("slot",{key:"6c55a22b94293e59c8fdb33906c2d4612d067cc4",name:"menu"}))))}static get watchers(){return{maxWidth:["setMaxWidth"],language:["setLanguage"]}}};l.style=r;export{l as pn_header}; //# sourceMappingURL=p-7bd6d804.entry.js.map