@postnord/web-components/postnord-web-components/p-86b4e6b8.entry.js

PostNord Web Components

/*!
 * Built with Stencil
 * By PostNord.
 */
import{r as e,g as t,h as s,a as r}from"./p-c2c6299e.js";import{u as i,e as a,j as p}from"./p-c511b4fb.js";const o={STEP:{da:"Trin",en:"Step",fi:"Vaihe",no:"Trinn",sv:"Steg"}};const h="pn-progress-stepper .pn-progress-stepper{width:100%;background:#f3f2f2;height:0.5em;border-radius:0.5em;box-shadow:0 0 0 0.0625em #969087;position:relative}pn-progress-stepper .pn-progress-stepper[data-full] .pn-progress-stepper-value{border-top-right-radius:0.5em;border-bottom-right-radius:0.5em}pn-progress-stepper .pn-progress-stepper-label{margin-bottom:0.5em}pn-progress-stepper .pn-progress-stepper-value{height:0.625em;background-color:#005d92;width:calc(var(--progress-value) + 0.125em);transition:width 0.4s cubic-bezier(0.7, 0, 0.3, 1), border-radius 0.4s cubic-bezier(0.7, 0, 0.3, 1);border-radius:0.5em 0 0 0.5em;position:absolute;top:-0.0625em;left:-0.0625em}";const l=h;const n=class{constructor(t){e(this,t)}id=`pn-progress-stepper-${i()}`;idLabel=`${this.id}-label`;idBar=`${this.id}-bar`;minStep=1;maxStep=7;get hostElement(){return t(this)}progressValue=0;label;totalSteps=this.maxStep;currentStep=this.minStep;stepName;progressStepperId="";language=null;validateCurrentStep(e){this.validate(e,"currentStep")}validateTotalSteps(e){this.validate(e,"totalSteps")}watchLanguage(){if(this.hasCustomLabel())return;this.label=o.STEP[this.language||a]}watchId(){if(this.progressStepperId){this.idLabel=`${this.progressStepperId}-label`;this.idBar=`${this.progressStepperId}-bar`}else{this.idLabel=`${this.id}-label`;this.idBar=`${this.id}-bar`}}async componentWillLoad(){this.watchLanguage();this.watchId();this.validate(this.currentStep,"currentStep");this.validate(this.totalSteps,"totalSteps");if(this.language)return;await p(this.hostElement)}componentWillRender(){this.calculateProgress()}hasCustomLabel(){if(this.label===undefined)return false;return!Object.keys(o.STEP).find((e=>o.STEP[e]===this.label))}validate(e,t){const s=this.hostElement.localName;if(e<this.minStep){console.warn(`${s}: The ${t} ${e} is below the minimum allowed steps of ${this.minStep}. ${t} will default to ${this.minStep}.`);this[t]=this.minStep}if(t==="currentStep"&&e>this.totalSteps){console.warn(`${s}: The ${t} ${e} is above totalSteps ${this.totalSteps}, ${t} will default to ${this.totalSteps}.`);this[t]=this.totalSteps}if(e>this.maxStep){console.warn(`${s}: The ${t} ${e} is above the maximum allowed steps of ${this.maxStep}. ${t} will default to ${this.maxStep}.`);this[t]=this.maxStep}}calculateProgress(){try{this.progressValue=Math.floor(this.currentStep/this.totalSteps*100);this.hostElement.style.setProperty("--progress-value",`${this.progressValue}%`)}catch(e){console.error(`${this.hostElement.localName}:`,e.message)}}render(){return s(r,{key:"272d1f3abc78f82d1d047b54e0367067f9487dae"},s("p",{key:"129f4fb4d853db711d059c0d23d10524b0633394",id:this.idLabel,class:"pn-progress-stepper-label"},s("span",{key:"8fb640f99c63b4fdaa2eb6eb1a580b0dd590b75c"},this.label," ",this.currentStep,"/",this.totalSteps),this.stepName&&s("span",{key:"e6aab7895bbb0b040fec057fdc52a377dcadfae2"}," - ",this.stepName)),s("div",{key:"e21d798014f01c850d4a90fc525d4ce03fc76705",class:"pn-progress-stepper",role:"progressbar","aria-labelledby":this.idLabel,"aria-valuenow":this.progressValue,id:this.idBar,"data-full":this.currentStep===this.totalSteps},s("div",{key:"db86f96f1e1ab1f7e62fb0b2b2b1dfee24647983",class:"pn-progress-stepper-value"})))}static get watchers(){return{currentStep:["validateCurrentStep"],totalSteps:["validateTotalSteps"],language:["watchLanguage"],progressStepperId:["watchId"]}}};n.style=l;export{n as pn_progress_stepper};
//# sourceMappingURL=p-86b4e6b8.entry.js.map