@postnord/web-components
Version:
PostNord Web Components
5 lines • 2.92 kB
JavaScript
/*!
* Built with Stencil
* By PostNord.
*/
import{t as e,r as a,g as t,f as d,h as s,a as i}from"./p-XKg-ydzH.js";import{awaitTopbar as n,en as c}from"./index.esm.js";import{a as r}from"./p-CQaMdITw.js";const h={sv:"Tillbaka",en:"Back",da:"Tilbage",fi:"Takaisin",no:"Tilbake"},b=class{constructor(e){a(this,e)}mo;hasBreadcrumb=!1;hasButtons=!1;get hostElement(){return t(this)}heading;maxWidth;setMaxWidth(){this.maxWidth&&this.hostElement.style.setProperty("--max-width",this.maxWidth)}goBackHref;goBackText;language=null;connectedCallback(){this.mo=new MutationObserver((()=>{d(this.hostElement),this.checkSlots()})),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}async componentWillLoad(){this.checkSlots(),this.setMaxWidth(),null===this.language&&await n(this.hostElement)}checkSlots(){this.hasBreadcrumb=!!this.hostElement.querySelector('[slot="breadcrumb"]'),this.hasButtons=!!this.hostElement.querySelector('[slot="buttons"]')}showBreadcrumb(){return this.hasBreadcrumb||!!this.goBackHref?.length}getButtonText(){return this.goBackText||h[this.language||c]}render(){return s(i,{key:"cffcb3a6763d13783bad5d6b75f5402cfd92798b"},s("header",{key:"7b6d663687fe12546ed88aaea3b97efd82afac69",class:"pn-header"},s("div",{key:"aec8dbf448077f14036f0cd4885add8bb650d647",class:"pn-header-container"},s("div",{key:"bff188666b4aa2f5df35476eddf17ac4ba5ba182",class:"pn-header-breadcrumbs",hidden:!this.showBreadcrumb()},this.goBackHref&&s("pn-text-link",{key:"0f2ad8624741de50b2ed1c13cf7cfcae9ad6c223",label:this.getButtonText(),href:this.goBackHref,icon:r,leftIcon:!0}),s("slot",{key:"ece3524aafbff34f28e0d9cc6eafc587e1daeba5",name:"breadcrumb"})),s("div",{key:"1356eb7d669666b327575a00abdf86bbf9a9e38a",class:"pn-header-content"},this.heading&&s("h1",{key:"c3e1419dbf20e789c98ea32bb73a3e5e1021f75a"},this.heading),s("slot",{key:"94491e7af78f2ee44bc45b3a261f2bcc8af81377"})),s("div",{key:"e2db0dcd84f2fbeb58ab793cd4220861c2320433",class:"pn-header-buttons",hidden:!this.hasButtons},s("slot",{key:"1745323caaf67eb3f316f4ff56451ffefb6d9b7e",name:"buttons"})),s("slot",{key:"17d56ba2c125c766c05ae84eb82839391447dd74",name:"menu"}))))}static get watchers(){return{maxWidth:[{setMaxWidth:0}]}}};b.style=`${e("pn-header")}{display:block}${e("pn-header")} h1{color:#2d2013;margin:0}${e("pn-header")} p{color:#5e554a;margin:0}${e("pn-header")} .pn-header-breadcrumbs{width:100%}${e("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}${e("pn-header")} .pn-header-container>${e("pn-text-link")}{display:block}${e("pn-header")} .pn-header-content{flex:1 1 auto;display:flex;flex-direction:column;gap:1em}${e("pn-header")} .pn-header [slot=buttons]{display:flex;flex-direction:column;gap:1em}`;export{b as pn_header}