@postnord/web-components/postnord-web-components/p-292a7591.entry.js

PostNord Web Components

/*!
 * Built with Stencil
 * By PostNord.
 */
import{t as s,r as e,c as t,g as i,h as a,a as r}from"./p-XKg-ydzH.js";import{uuidv4 as h,awaitTopbar as n,sv as o}from"./index.esm.js";const l={CLOSEST_DELIVERY_DATE:{en:"Closest delivery date:",sv:"Nästa utdelningsdag:"},NEXT_DELIVERY_DATE:{en:"Next delivery date:",sv:"Kommande utdelningsdag:"},ZIP_CODE:{en:"Zip code:",sv:"Postnummer:"},VALIDATION_ERROR_MESSAGE:{en:"Zip code not valid",sv:"Postnumret är inte giltigt"},SERVER_ERROR_MESSAGE:{en:"Could not find zip code",sv:"Kan inte hitta postnumret"},PLACEHOLDER_TEXT:{en:"Search for a zip code",sv:"Sök på ett postnummer"},SEARCH:{en:"Search",sv:"Sök"}},c=class{constructor(s){e(this,s),this.searchsuccessful=t(this,"searchsuccessful",7)}searchId=`pn-zipcode-${h()}`;get hostElement(){return i(this)}validZipCode;loading=!1;showResult=!1;zipCodeSearchResult={delivery:"",upcoming:"",city:"",postalCode:""};error=!1;errorMessage;language=null;value;searchsuccessful;async componentWillLoad(){null===this.language&&await n(this.hostElement),this.value&&this.handleSearch(this.value)}translation(s){return l[s][this.language||o]}handleSearch(s){this.value=s,this.validateZipCode(),this.error?this.errorMessage="VALIDATION_ERROR_MESSAGE":this.zipCodeSearch()}async zipCodeSearch(){this.loading=!0,await fetch(`https://portal.postnord.com/api/sendoutarrival/closest?postalCode=${this.validZipCode}`).then((s=>s.json())).then((s=>{this.showResult=!0,this.zipCodeSearchResult=s,this.searchsuccessful.emit(!0)})).catch((()=>{this.error=!0,this.errorMessage="SERVER_ERROR_MESSAGE",this.searchsuccessful.emit(!1)})).finally((()=>{this.loading=!1}))}validateZipCode(){const s=this.value?this.value.replace(/[ -]/gi,""):"",e=/^\d{5}$/.test(s);this.error=!e,e&&(this.validZipCode=s)}renderSearchResult(){if(!this.loading&&!this.error&&this.showResult)return a("output",{class:"pn-search-results",htmlFor:this.searchId},a("p",{class:"text-row"},a("span",null,this.translation("CLOSEST_DELIVERY_DATE")),a("h3",{class:"delivery-date"},this.zipCodeSearchResult.delivery)),a("p",{class:"text-row"},a("span",null,this.translation("NEXT_DELIVERY_DATE")),a("h3",{class:"delivery-date"},this.zipCodeSearchResult.upcoming)),a("p",{class:"text-row"},a("span",null,this.translation("ZIP_CODE")),a("h3",null,this.zipCodeSearchResult.postalCode,", ",this.zipCodeSearchResult.city||"N/A")))}renderErrorMessage(){if(this.error&&!this.loading)return a("p",{class:"pn-error-text",role:"alert"},a("small",null,this.translation(this.errorMessage)))}render(){return a(r,{key:"2631586788c0b4fc5e5b4914dd44e9b20c87598e"},a("pn-search-field",{key:"0d9743b99db487cb1acb27825fca4e872e25c72d",label:this.translation("PLACEHOLDER_TEXT"),value:this.value,searchid:this.searchId,loading:this.loading,button:"icon",buttonLabel:this.translation("SEARCH"),placeholder:this.translation("PLACEHOLDER_TEXT"),onSearch:s=>this.handleSearch(s.detail)}),this.renderSearchResult(),this.renderErrorMessage())}};c.style=`${s("pn-zipcode-search")}{display:block;color:#5e554a}${s("pn-zipcode-search")} .pn-search-results{display:flex;flex-direction:column;gap:1em;padding:0 0.75em}${s("pn-zipcode-search")} .pn-search-results span{color:#5e554a}${s("pn-zipcode-search")} .pn-search-results h3{color:#2d2013}${s("pn-zipcode-search")} .pn-error-text{color:#a70707;padding:0 0.75em}${s("pn-zipcode-search")}>${s("pn-search-field")}{width:100%;margin-bottom:1em}`;export{c as pn_zipcode_search}