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

PostNord Web Components

/*!
 * Built with Stencil
 * By PostNord.
 */
import{transformTag as e,proxyCustomElement as t,HTMLElement as n,createEvent as s,h as i,Host as a}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";import{d as o}from"./pn-icon2.js";const c=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.segmentHover=s(this,"segmentHover",7)}id="pn-segment-"+l();get hostElement(){return this}label;value;name;disabled=!1;selected=!1;icon;pnId;segmentid;segmentHover;handleHover(e){this.segmentHover.emit(e)}getId(){return this.pnId||this.segmentid||this.id}render(){return i(a,{key:"c1ca80ac494bc4b75dea79723d12650d18c47e98",onMouseEnter:e=>this.handleHover(e)},i("input",{key:"c3bdb057f6ecb46a0a343da3c54331375a6c0e35",class:"pn-segment",id:this.getId(),name:this.name,checked:this.selected,type:"radio",value:this.value,disabled:this.disabled}),i("label",{key:"06f7c91d9440c867a98642246a7ef9c958f2eb1b",htmlFor:this.getId(),class:"pn-segment-label"},this.icon&&i("pn-icon",{key:"caf831966dd81f60ac72f2c3a18ca1afd085d07c",icon:this.icon,color:"blue700"}),i("span",{key:"0d14699fcadef37bcb33d43464db9e5217d0d202",class:"pn-segment-text"},this.label,i("slot",{key:"7e7398bba9a088764e844dc7856aec2ec325161b"}))))}static get style(){return`${e("pn-segment")}{position:relative;color:#005d92;margin-right:0.5em;z-index:2;white-space:nowrap;scroll-snap-align:center;outline:none;-webkit-tap-highlight-color:transparent;transform:translateZ(0)}${e("pn-segment")}:last-of-type{margin-right:0}${e("pn-segment")} .pn-segment{cursor:pointer;margin:0;padding:0;opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;-webkit-tap-highlight-color:transparent}${e("pn-segment")} .pn-segment:disabled{cursor:not-allowed}${e("pn-segment")} .pn-segment:disabled~.pn-segment-label{color:#5e554a}${e("pn-segment")} .pn-segment:disabled~.pn-segment-label ${e("pn-icon")} .pn-icon-svg path{fill:#5e554a}${e("pn-segment")} .pn-segment-label{height:100%;width:100%;padding:0.5em;border-radius:3em;font-weight:500;border:0.0625em solid transparent;display:inline-flex;gap:0.5em;align-items:center;-webkit-tap-highlight-color:transparent}`}},[772,"pn-segment",{label:[1],value:[1],name:[1],disabled:[4],selected:[4],icon:[1],pnId:[1,"pn-id"],segmentid:[1]}]),r=c,d=function(){"undefined"!=typeof customElements&&["pn-segment","pn-icon"].forEach((t=>{switch(t){case"pn-segment":customElements.get(e(e(t)))||customElements.define(e(e(t)),c);break;case"pn-icon":customElements.get(e(e(t)))||o()}}))};export{r as PnSegment,d as defineCustomElement}