@postnord/pn-marketweb-components 4.1.1 → 4.2.0

package/umd/modules/@postnord/web-components/components/pn-tile.js

@@ -2,4 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as n,forceUpdate as l,h as a,Host as o}from"@stencil/core/internal/client";import{o as r}from"./open_in_new.js";import{o as s}from"./helpers.js";import{d as p}from"./pn-icon2.js";import{d as c}from"./pn-illustration2.js";const d=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.pnTile=n(this,"pnTile",7)}mo;tile;illustrationSlot;visibleOutline=!1;get hostElement(){return this}label;text;url;target;rel="noopener noreferrer";illustration;icon;horizontal=!1;pnTile;connectedCallback(){this.mo=new MutationObserver((()=>l(this.hostElement))),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}isExternal(){return"_blank"===this.target}showIcon(){return!!this.icon&&!this.showSlotIllustration()}showPropIllustration(){return!!this.illustration&&!this.showSlotIllustration()}showSlotIllustration(){return!!this.illustrationSlot?.querySelector('[slot="illustration"]')}showImage(){return this.showIcon()||this.showPropIllustration()||this.showSlotIllustration()}handleFocus({type:t,target:e}){this.visibleOutline="focus"===t&&e.matches(":focus-visible")}clickHandler(t){s(t,this.tile),this.pnTile.emit({click:t})}render(){return a(o,{key:"08be79249da65274656e90f5712babf4811c8c54"},a("div",{key:"29758442a6da5849d7fc920e811c15ec0aaf01ab",class:"pn-tile","data-horizontal":this.horizontal,"data-href":!!this.url,"data-focus":this.visibleOutline,ref:t=>this.tile=t},a("div",{key:"9db26483510dd6fb18a155555649edcb99aab3ab",class:"pn-tile-illustration","data-circle":!!this.url,"data-icon":this.showIcon(),role:"presentation",hidden:!this.showImage()},this.showPropIllustration()?a("pn-illustration",{illustration:this.illustration}):this.showIcon()&&a("pn-icon",{color:"blue700",icon:this.icon}),a("div",{key:"c9c30bfd0e4650caaac888bffc8877203bb22bee",class:"pn-tile-illustration-slot",hidden:!this.showSlotIllustration(),ref:t=>this.illustrationSlot=t},a("slot",{key:"6f8b24bfdbc809d1525a9b26518a94bc1d54e8b3",name:"illustration"}))),a("div",{key:"9780c0bcfbcf9d13581a0e0a680fd5222852a202",class:"pn-tile-text"},a("h3",{key:"26cde96074fa4425b4e47af2c558b10c28b25a64",class:"pn-tile-title"},this.url?a("a",{class:"pn-tile-link",href:this.url,target:this.target,rel:!this.rel&&this.isExternal()?"noopener noreferrer":this.rel,onClick:t=>this.clickHandler(t),onFocus:t=>this.handleFocus(t),onBlur:t=>this.handleFocus(t)},this.label):this.label,this.isExternal()&&a("pn-icon",{key:"e6d1fdcd52357d5c83a499be6bebad6ffaf183b0",icon:r,small:!0,color:"blue700"})),a("div",{key:"86583c570242905f506c0196909d4a805be8eab5",class:"pn-tile-slot"},!!this.text&&a("p",{key:"2da94d451c30ef1aaee0e4527ab31d6e301cb19f",class:"pn-tile-paragraph"},this.text),a("slot",{key:"bfb995e2608d30ca77b4c88e51d64a3ae20243f7"})))))}static get style(){return`${t("pn-tile")}{position:relative;display:block}${t("pn-tile")} .pn-tile{position:relative;overflow:hidden;word-break:break-word;text-align:center;border-radius:0.5em;padding:clamp(0.75em, 3vw, 1.5em);height:100%;color:#2d2013;background-color:#ffffff;box-shadow:0em 0.0625em 0.125em 0em rgba(20, 20, 20, 0.11), 0em 0.1875em 0.4375em 0em rgba(0, 0, 0, 0.13);display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;justify-content:flex-start;gap:clamp(1em, 5vw, 1.5em);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:box-shadow, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}${t("pn-tile")} .pn-tile[data-horizontal]{text-align:left;flex-direction:row;flex-wrap:nowrap;gap:clamp(1em, 5vw, 1.5em)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(0% 100% at 0% 50%)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-text{flex-grow:2}${t("pn-tile")} .pn-tile[data-href][data-focus]{outline-color:#005d92;box-shadow:0em 0em 0em 0em rgba(20, 20, 20, 0.11), 0em 0em 0em 0em rgba(0, 0, 0, 0.13)}${t("pn-tile")} .pn-tile[data-href]:hover{background-color:rgba(183, 235, 252, 0.3)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-illustration[data-circle]:before{clip-path:ellipse(100% 50% at 50% -25%)}${t("pn-tile")} .pn-tile[data-href]:hover[data-horizontal] .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(50% 100% at -25% 50%)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-link,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-link{color:#0d234b;text-decoration-color:#0d234b}${t("pn-tile")} .pn-tile[data-href]:hover ${t("pn-icon")} .pn-icon-svg path,${t("pn-tile")} .pn-tile[data-href]:focus-within ${t("pn-icon")} .pn-icon-svg path{fill:#0d234b}${t("pn-tile")} .pn-tile-illustration{z-index:2;flex:1 1;max-width:7.5em;max-height:7.5em}${t("pn-tile")} .pn-tile-illustration[data-icon]{flex:0 0}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}{padding:1em;border-radius:50%;background-color:#e0f8ff}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}>svg{font-size:2em}${t("pn-tile")} .pn-tile-illustration-slot{display:block;height:100%;width:100%}${t("pn-tile")} .pn-tile-illustration[data-circle]:before{content:"";position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;background-color:rgba(183, 235, 252, 0.7);background-color:rgba(183, 235, 252, 0.7);clip-path:ellipse(100% 0% at 50% 0%);transition-property:clip-path;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-illustration[data-circle]:before{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-text{z-index:3;flex:1 1;display:flex;flex-direction:column;gap:0.5em}${t("pn-tile")} .pn-tile-link{cursor:pointer;color:#005d92;text-decoration:underline;text-decoration-color:transparent;-webkit-tap-highlight-color:transparent;transition-property:color, text-decoration-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-link{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-link:focus{outline:0;text-decoration-color:#0d234b;color:#0d234b}${t("pn-tile")} .pn-tile-link:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;opacity:0}${t("pn-tile")} .pn-tile-title{font-family:inherit;font-weight:700;font-size:clamp(1.25em, 3vw, 1.5em);margin:0em}${t("pn-tile")} .pn-tile-title ${t("pn-icon")}{margin-left:0.25em;vertical-align:middle}${t("pn-tile")} .pn-tile-slot{font-weight:400;color:#5e554a;display:flex;flex-direction:column;gap:0.25em}${t("pn-tile")} .pn-tile-paragraph,${t("pn-tile")} .pn-tile p{font-size:0.875em}${t("pn-tile")} .pn-tile-paragraph:last-child,${t("pn-tile")} .pn-tile p:last-child{margin:0em}`}},[772,"pn-tile",{label:[1],text:[1],url:[1],target:[1],rel:[1],illustration:[1],icon:[1],horizontal:[4],visibleOutline:[32]}]),h=d,f=function(){"undefined"!=typeof customElements&&["pn-tile","pn-icon","pn-illustration"].forEach((e=>{switch(e){case"pn-tile":customElements.get(t(t(e)))||customElements.define(t(t(e)),d);break;case"pn-icon":customElements.get(t(t(e)))||p();break;case"pn-illustration":customElements.get(t(t(e)))||c()}}))};export{h as PnTile,f as defineCustomElement}
+import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as n,forceUpdate as l,h as o,Host as a}from"@stencil/core/internal/client";import{o as r}from"./open_in_new.js";import{o as s}from"./helpers.js";import{d as c}from"./pn-icon2.js";import{d as p}from"./pn-illustration2.js";const d=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.pnTile=n(this,"pnTile",7)}mo;tile;illustrationSlot;visibleOutline=!1;get hostElement(){return this}label;text;url;target;rel="noopener noreferrer";illustration;icon;horizontal=!1;pnTile;connectedCallback(){this.mo=new MutationObserver((()=>l(this.hostElement))),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}isExternal(){return"_blank"===this.target}showIcon(){return!!this.icon&&!this.showSlotIllustration()}showPropIllustration(){return!!this.illustration&&!this.showSlotIllustration()}showSlotIllustration(){return!!this.illustrationSlot?.querySelector('[slot="illustration"]')}showImage(){return this.showIcon()||this.showPropIllustration()||this.showSlotIllustration()}handleFocus({type:t,target:e}){this.visibleOutline="focus"===t&&e.matches(":focus-visible")}clickHandler(t){s(t,this.tile),this.pnTile.emit({click:t})}render(){return o(a,{key:"eb3815f93d4355e80969c381cadd22789b1a5b05"},o("div",{key:"a8dad16643d664975ee27f3fc3e0249730662efb",class:"pn-tile","data-horizontal":this.horizontal,"data-href":!!this.url,"data-focus":this.visibleOutline,ref:t=>this.tile=t},o("div",{key:"474e4c248a0ddfab550be16dcff172fc01f84e0a",class:"pn-tile-illustration","data-circle":!!this.url,"data-icon":this.showIcon(),role:"presentation",hidden:!this.showImage()},this.showPropIllustration()?o("pn-illustration",{illustration:this.illustration}):this.showIcon()&&o("pn-icon",{color:"blue700",icon:this.icon}),o("div",{key:"2d5962def32bc5d7a3432cd5062d0a164f167454",class:"pn-tile-illustration-slot",hidden:!this.showSlotIllustration(),ref:t=>this.illustrationSlot=t},o("slot",{key:"ceb86fe161d9256249fdc65c83199a0231899e9b",name:"illustration"}))),o("div",{key:"74ad199309a7ae8f6c576bc2c97c958f364dc868",class:"pn-tile-text"},o("h3",{key:"eb6e12a3496d11c3ecb79bf122cbfd604b8081ef",class:"pn-tile-title"},this.url?o("a",{class:"pn-tile-link",href:this.url,target:this.target,rel:!this.rel&&this.isExternal()?"noopener noreferrer":this.rel,onClick:t=>this.clickHandler(t),onFocus:t=>this.handleFocus(t),onBlur:t=>this.handleFocus(t)},this.label):this.label,this.isExternal()&&o("pn-icon",{key:"13c2495d9a94dc9d3f530543e47549683b985c59",icon:r,small:!0,color:"blue700"})),o("div",{key:"4ce12374c5bbdf54809d8b1d2f99cb6efbc01266",class:"pn-tile-slot"},!!this.text&&o("p",{key:"2cdbc99beff7480c18f561b2f16f72953367b43f",class:"pn-tile-paragraph"},this.text),o("slot",{key:"f786d7b65a270acb9be13ce0cfb1d2e3bfe34b8a"})))))}static get style(){return`${t("pn-tile")}{position:relative;display:block}${t("pn-tile")} .pn-tile{position:relative;overflow:hidden;word-break:break-word;text-align:center;border-radius:0.5em;padding:clamp(0.75em, 3vw, 1.5em);height:100%;color:#2d2013;background-color:#ffffff;box-shadow:0em 0.0625em 0.125em 0em rgba(20, 20, 20, 0.11), 0em 0.1875em 0.4375em 0em rgba(0, 0, 0, 0.13);display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;justify-content:flex-start;gap:clamp(1em, 5vw, 1.5em);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:box-shadow, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}${t("pn-tile")} .pn-tile[data-horizontal]{text-align:left;flex-direction:row;flex-wrap:nowrap;gap:clamp(1em, 5vw, 1.5em)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(0% 100% at 0% 50%)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-text{flex-grow:2}${t("pn-tile")} .pn-tile[data-href][data-focus]{outline-color:#005d92;box-shadow:0em 0em 0em 0em rgba(20, 20, 20, 0.11), 0em 0em 0em 0em rgba(0, 0, 0, 0.13)}${t("pn-tile")} .pn-tile[data-href]:hover{background-color:rgba(183, 235, 252, 0.3)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-illustration[data-circle]:before{clip-path:ellipse(100% 50% at 50% -25%)}${t("pn-tile")} .pn-tile[data-href]:hover[data-horizontal] .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(50% 100% at -25% 50%)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-link,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-link{color:#0d234b;text-decoration-color:#0d234b}${t("pn-tile")} .pn-tile[data-href]:hover ${t("pn-icon")} .pn-icon-svg path,${t("pn-tile")} .pn-tile[data-href]:focus-within ${t("pn-icon")} .pn-icon-svg path{fill:#0d234b}${t("pn-tile")} .pn-tile-illustration{z-index:2;flex:1 1;max-width:7.5em;max-height:7.5em}${t("pn-tile")} .pn-tile-illustration[data-icon]{flex:0 0}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}{padding:1em;border-radius:50%;background-color:#e0f8ff}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}>svg{font-size:2em}${t("pn-tile")} .pn-tile-illustration-slot{display:block;height:100%;width:100%}${t("pn-tile")} .pn-tile-illustration[data-circle]:before{content:"";position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;background-color:rgba(183, 235, 252, 0.7);background-color:rgba(183, 235, 252, 0.7);clip-path:ellipse(100% 0% at 50% 0%);transition-property:clip-path;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-illustration[data-circle]:before{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-text{z-index:3;flex:1 1;display:flex;flex-direction:column;gap:0.5em}${t("pn-tile")} .pn-tile-link{cursor:pointer;color:#005d92;text-decoration:underline;text-decoration-color:transparent;-webkit-tap-highlight-color:transparent;transition-property:color, text-decoration-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-link{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-link:focus{outline:0;text-decoration-color:#0d234b;color:#0d234b}${t("pn-tile")} .pn-tile-link:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;opacity:0}${t("pn-tile")} .pn-tile-title{font-family:inherit;font-weight:700;font-size:clamp(1.25em, 3vw, 1.5em);margin:0em}${t("pn-tile")} .pn-tile-title ${t("pn-icon")}{margin-left:0.25em;vertical-align:middle}${t("pn-tile")} .pn-tile-slot{font-weight:400;color:#5e554a;display:flex;flex-direction:column;gap:0.25em}${t("pn-tile")} .pn-tile-paragraph,${t("pn-tile")} .pn-tile p{font-size:0.875em}${t("pn-tile")} .pn-tile-paragraph:last-child,${t("pn-tile")} .pn-tile p:last-child{margin:0em}`}},[772,"pn-tile",{label:[1],text:[1],url:[1],target:[1],rel:[1],illustration:[1],icon:[1],horizontal:[4],visibleOutline:[32]}]),h=d,f=function(){"undefined"!=typeof customElements&&["pn-tile","pn-icon","pn-illustration"].forEach((e=>{switch(e){case"pn-tile":customElements.get(t(t(e)))||customElements.define(t(t(e)),d);break;case"pn-icon":customElements.get(t(t(e)))||c();break;case"pn-illustration":customElements.get(t(t(e)))||p()}}))};export{h as PnTile,f as defineCustomElement}

package/umd/modules/@postnord/web-components/components/pn-toggle-switch.js

@@ -2,4 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import{transformTag as e,proxyCustomElement as t,HTMLElement as n,h as o,Host as i}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";import{d as g}from"./pn-spinner2.js";const s=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}id="pn-toggle-"+l();idHelper=this.id+"-helper";get hostElement(){return this}label;helpertext;checked=!1;toggleid=this.id;name=null;value=null;small=!1;large=!1;disabled=!1;loading=!1;handleHelperId(){this.id!==this.toggleid&&(this.idHelper=this.toggleid+"-helper")}componentWillLoad(){this.handleHelperId()}hasHelpertextProp(){return!!this.helpertext}hasHelpertextSlot(){return!!this.hostElement.querySelector('[slot="helpertext"]')}showHelpertext(){return this.hasHelpertextProp()||this.hasHelpertextSlot()}describedBy(){return this.showHelpertext()?this.idHelper:null}render(){return o(i,{key:"a3d4252dea3e506eb98d685b39ffdba2d6676d91"},o("div",{key:"1c6ef822b6bc2781fe2d8e276b0b8576764a64bf",class:"pn-toggle"},this.label&&o("div",{key:"91f304e138532ddb6cb233c04eca8fb08fcc09ec",class:"pn-toggle-content"},o("label",{key:"a53f25b57622de9b23097abb7307798bdfa8e85f",htmlFor:this.toggleid,class:"pn-toggle-label"},o("span",{key:"15f39c3b8baaae269f8c25f0ca13519070a924fd"},this.label)),o("p",{key:"2b6698735c1e0930538836787a778c6d7633ede0",id:this.idHelper,class:"pn-toggle-helper",hidden:!this.showHelpertext()},this.hasHelpertextProp()&&o("span",{key:"e6c655fc891757ddffbe5fbd17f20b699da47365"},this.helpertext),o("slot",{key:"e8975a979351fb64079b242ac4f8c41f63c4075a",name:"helpertext"}))),o("div",{key:"e5d7c8a8afdfd96b50bcac1cca95acd65bd7d077",class:"pn-toggle-button","data-small":this.small,"data-large":this.large,"data-loading":this.loading},o("input",{key:"1f5373143d9572a61a0d3b863b16590c31adc53e",id:this.toggleid,class:"pn-toggle-element",type:"checkbox",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,"aria-describedby":this.describedBy()}),o("div",{key:"dd6d3e606d74ed0a62130c6a0f79fc7e8c6ea2b9",class:"pn-toggle-bg"}),o("div",{key:"e4d1598960dc57ffa2235c18eb0ea8923914d694",class:"pn-toggle-circle"},o("svg",{key:"cb11a8413934ed3b31dd69cd9715c07844fb3b35",class:"pn-toggle-check",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none"},o("polyline",{key:"57ef9347f6db33745babe13a9ceb7c0a7fb2b0fd",points:"4,12 9,17 20,6","stroke-width":"3"})),o("pn-spinner",{key:"9c9ee4253c0bbfaa561fe5b1fd729cc2a8f2b9b9",size:1.125})))))}static get watchers(){return{toggleid:[{handleHelperId:0}]}}static get style(){return`${e("pn-toggle-switch")}{display:inline-block;position:relative}${e("pn-toggle-switch")} .pn-toggle{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1em}${e("pn-toggle-switch")} .pn-toggle-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:500;color:#2d2013;margin:0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-label{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-label>span{font-size:1em}${e("pn-toggle-switch")} .pn-toggle-helper{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}${e("pn-toggle-switch")} .pn-toggle-content{flex:1 0}${e("pn-toggle-switch")} .pn-toggle-button{position:relative;font-size:1em;width:3.625em;height:2em;padding:0.1875em;transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-button{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-button{-webkit-tap-highlight-color:transparent}${e("pn-toggle-switch")} .pn-toggle-button[data-small]{width:2.625em;height:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-small] .pn-toggle-circle{width:1.125em;height:1.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-small][data-loading]>.pn-toggle-bg{width:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large]{width:4.625em;height:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large] .pn-toggle-circle{width:2.125em;height:2.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-large][data-loading]>.pn-toggle-bg{width:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-bg{width:2em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-circle,${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(50%)}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:0}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke-dashoffset:23;transition-delay:0s}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] ${e("pn-spinner")}{opacity:1}${e("pn-toggle-switch")} .pn-toggle-bg{position:absolute;top:0;left:50%;width:100%;height:100%;z-index:0;border-radius:2em;background-color:#969087;transform:translateX(-50%);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:width, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-bg{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-circle{position:relative;z-index:1;width:1.625em;height:1.625em;background-color:#ffffff;box-shadow:0 0.25em 0.5em rgba(0, 0, 0, 0.1);border-radius:50%;padding:0.25em;transition-property:transform, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-circle{transform:translateX(0%)}${e("pn-toggle-switch")} .pn-toggle-element{position:absolute;z-index:3;top:0;left:0;cursor:pointer;width:100%;height:100%;opacity:0;margin:0;}${e("pn-toggle-switch")} .pn-toggle-element:focus-visible+.pn-toggle-bg{outline-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:hover+.pn-toggle-bg{background-color:#5e554a}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked+.pn-toggle-bg{background-color:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-bg{background-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(100%)}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:1}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{transition-delay:0.2s, 0s;stroke-dashoffset:0}${e("pn-toggle-switch")} .pn-toggle-element:disabled{cursor:not-allowed}${e("pn-toggle-switch")} .pn-toggle-element:disabled+.pn-toggle-bg{background-color:#d3cecb;box-shadow:none}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle{background-color:#f3f2f2}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-circle{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-dot{fill:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover+.pn-toggle-bg,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked+.pn-toggle-bg{background-color:#d3cecb}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover~.pn-toggle-circle .pn-toggle-check polyline,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-check{position:absolute;left:50%;top:50%;height:1.5em;width:1.5em;padding:0.25em;transform:translate(-50%, -50%);opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-check polyline{stroke:#005d92;stroke-linecap:round;stroke-dasharray:23;stroke-dashoffset:23;transition-property:stroke-dashoffset, stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check polyline{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-property:stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-property:fill;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-duration:0s;transition-delay:0s}}`}},[772,"pn-toggle-switch",{label:[1],helpertext:[1],checked:[1028],toggleid:[1],name:[1],value:[1],small:[4],large:[4],disabled:[4],loading:[4]},void 0,{toggleid:[{handleHelperId:0}]}]),r=s,c=function(){"undefined"!=typeof customElements&&["pn-toggle-switch","pn-spinner"].forEach((t=>{switch(t){case"pn-toggle-switch":customElements.get(e(e(t)))||customElements.define(e(e(t)),s);break;case"pn-spinner":customElements.get(e(e(t)))||g()}}))};export{r as PnToggleSwitch,c as defineCustomElement}
+import{transformTag as e,proxyCustomElement as t,HTMLElement as n,h as o,Host as i}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";import{d as g}from"./pn-spinner2.js";const s=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}id="pn-toggle-"+l();idHelper=this.id+"-helper";get hostElement(){return this}label;helpertext;checked=!1;toggleid=this.id;name=null;value=null;small=!1;large=!1;disabled=!1;loading=!1;handleHelperId(){this.id!==this.toggleid&&(this.idHelper=this.toggleid+"-helper")}componentWillLoad(){this.handleHelperId()}hasHelpertextProp(){return!!this.helpertext}hasHelpertextSlot(){return!!this.hostElement.querySelector('[slot="helpertext"]')}showHelpertext(){return this.hasHelpertextProp()||this.hasHelpertextSlot()}describedBy(){return this.showHelpertext()?this.idHelper:null}render(){return o(i,{key:"b88bbc2385be79dd584ecee5e53dc89832de49c3"},o("div",{key:"4a413f2b2acf8551dc2852ba0d3a45f4cbf17a4d",class:"pn-toggle"},this.label&&o("div",{key:"944a36f2018335a283092c909af2f37846850eb8",class:"pn-toggle-content"},o("label",{key:"2536eaf65117b1c70d1ec31f17faa41f2a6fced4",htmlFor:this.toggleid,class:"pn-toggle-label"},o("span",{key:"eae8a38d31f6bc05faa9d56c08517f9302be9a3e"},this.label)),o("p",{key:"6173ba384459c406eb98fe4318e080b6cd36031a",id:this.idHelper,class:"pn-toggle-helper",hidden:!this.showHelpertext()},this.hasHelpertextProp()&&o("span",{key:"d4a52d7786e7a63ca3f201c3ad7cb8793e377c12"},this.helpertext),o("slot",{key:"06406382d523b70b8acb094a82794652a4481528",name:"helpertext"}))),o("div",{key:"4676dd88652c903f94d3f887e97841e00bbe09e2",class:"pn-toggle-button","data-small":this.small,"data-large":this.large,"data-loading":this.loading},o("input",{key:"d2656b2f8ff8e74bd4d4c2f1c4791e984ec3e50b",id:this.toggleid,class:"pn-toggle-element",type:"checkbox",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,"aria-describedby":this.describedBy()}),o("div",{key:"93caefd228460120aae22ba48e6c93d6df676fcf",class:"pn-toggle-bg"}),o("div",{key:"03299104835602d126960ad67ab51f94d27cf3c5",class:"pn-toggle-circle"},o("svg",{key:"5f61f589797b3ca97a66cd42deab3065543679d2",class:"pn-toggle-check",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none"},o("polyline",{key:"d974e5cc198d19cf17e42e0b35097f87d11404a0",points:"4,12 9,17 20,6","stroke-width":"3"})),o("pn-spinner",{key:"6f5c5fb05e0c9fd95b16d45833f50167af22e358",size:1.125})))))}static get watchers(){return{toggleid:[{handleHelperId:0}]}}static get style(){return`${e("pn-toggle-switch")}{display:inline-block;position:relative}${e("pn-toggle-switch")} .pn-toggle{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1em}${e("pn-toggle-switch")} .pn-toggle-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:500;color:#2d2013;margin:0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-label{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-label>span{font-size:1em}${e("pn-toggle-switch")} .pn-toggle-helper{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}${e("pn-toggle-switch")} .pn-toggle-content{flex:1 0}${e("pn-toggle-switch")} .pn-toggle-button{position:relative;font-size:1em;width:3.625em;height:2em;padding:0.1875em;transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-button{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-button{-webkit-tap-highlight-color:transparent}${e("pn-toggle-switch")} .pn-toggle-button[data-small]{width:2.625em;height:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-small] .pn-toggle-circle{width:1.125em;height:1.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-small][data-loading]>.pn-toggle-bg{width:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large]{width:4.625em;height:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large] .pn-toggle-circle{width:2.125em;height:2.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-large][data-loading]>.pn-toggle-bg{width:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-bg{width:2em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-circle,${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(50%)}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:0}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke-dashoffset:23;transition-delay:0s}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] ${e("pn-spinner")}{opacity:1}${e("pn-toggle-switch")} .pn-toggle-bg{position:absolute;top:0;left:50%;width:100%;height:100%;z-index:0;border-radius:2em;background-color:#969087;transform:translateX(-50%);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:width, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-bg{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-circle{position:relative;z-index:1;width:1.625em;height:1.625em;background-color:#ffffff;box-shadow:0 0.25em 0.5em rgba(0, 0, 0, 0.1);border-radius:50%;padding:0.25em;transition-property:transform, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-circle{transform:translateX(0%)}${e("pn-toggle-switch")} .pn-toggle-element{position:absolute;z-index:3;top:0;left:0;cursor:pointer;width:100%;height:100%;opacity:0;margin:0;}${e("pn-toggle-switch")} .pn-toggle-element:focus-visible+.pn-toggle-bg{outline-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:hover+.pn-toggle-bg{background-color:#5e554a}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked+.pn-toggle-bg{background-color:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-bg{background-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(100%)}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:1}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{transition-delay:0.2s, 0s;stroke-dashoffset:0}${e("pn-toggle-switch")} .pn-toggle-element:disabled{cursor:not-allowed}${e("pn-toggle-switch")} .pn-toggle-element:disabled+.pn-toggle-bg{background-color:#d3cecb;box-shadow:none}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle{background-color:#f3f2f2}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-circle{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-dot{fill:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover+.pn-toggle-bg,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked+.pn-toggle-bg{background-color:#d3cecb}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover~.pn-toggle-circle .pn-toggle-check polyline,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-check{position:absolute;left:50%;top:50%;height:1.5em;width:1.5em;padding:0.25em;transform:translate(-50%, -50%);opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-check polyline{stroke:#005d92;stroke-linecap:round;stroke-dasharray:23;stroke-dashoffset:23;transition-property:stroke-dashoffset, stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check polyline{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-property:stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-property:fill;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-duration:0s;transition-delay:0s}}`}},[772,"pn-toggle-switch",{label:[1],helpertext:[1],checked:[1028],toggleid:[1],name:[1],value:[1],small:[4],large:[4],disabled:[4],loading:[4]},void 0,{toggleid:[{handleHelperId:0}]}]),r=s,c=function(){"undefined"!=typeof customElements&&["pn-toggle-switch","pn-spinner"].forEach((t=>{switch(t){case"pn-toggle-switch":customElements.get(e(e(t)))||customElements.define(e(e(t)),s);break;case"pn-spinner":customElements.get(e(e(t)))||g()}}))};export{r as PnToggleSwitch,c as defineCustomElement}

package/umd/modules/@postnord/web-components/components/pn-zipcode-search.js

@@ -2,4 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import{transformTag as e,proxyCustomElement as s,HTMLElement as t,createEvent as i,h as n,Host as r}from"@stencil/core/internal/client";import{u as a,k as o,s as l}from"./helpers.js";import{d as c}from"./pn-button2.js";import{d as h}from"./pn-icon2.js";import{d as p}from"./pn-search-field2.js";import{d}from"./pn-spinner2.js";const u={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"}},E=s(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.searchsuccessful=i(this,"searchsuccessful",7)}searchId="pn-zipcode-"+a();get hostElement(){return this}validZipCode;loading=!1;showResult=!1;zipCodeSearchResult={delivery:"",upcoming:"",city:"",postalCode:""};error=!1;errorMessage;language=null;value;searchsuccessful;async componentWillLoad(){null===this.language&&await o(this.hostElement),this.value&&this.handleSearch(this.value)}translation(e){return u[e][this.language||l]}handleSearch(e){this.value=e,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((e=>e.json())).then((e=>{this.showResult=!0,this.zipCodeSearchResult=e,this.searchsuccessful.emit(!0)})).catch((()=>{this.error=!0,this.errorMessage="SERVER_ERROR_MESSAGE",this.searchsuccessful.emit(!1)})).finally((()=>{this.loading=!1}))}validateZipCode(){const e=this.value?this.value.replace(/[ -]/gi,""):"",s=/^\d{5}$/.test(e);this.error=!s,s&&(this.validZipCode=e)}renderSearchResult(){if(!this.loading&&!this.error&&this.showResult)return n("output",{class:"pn-search-results",htmlFor:this.searchId},n("p",{class:"text-row"},n("span",null,this.translation("CLOSEST_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.delivery)),n("p",{class:"text-row"},n("span",null,this.translation("NEXT_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.upcoming)),n("p",{class:"text-row"},n("span",null,this.translation("ZIP_CODE")),n("h3",null,this.zipCodeSearchResult.postalCode,", ",this.zipCodeSearchResult.city||"N/A")))}renderErrorMessage(){if(this.error&&!this.loading)return n("p",{class:"pn-error-text",role:"alert"},n("small",null,this.translation(this.errorMessage)))}render(){return n(r,{key:"1171a861e9df4835137142eee129e20dc3be9d42"},n("pn-search-field",{key:"bfda6dac17112d6455191c3b91b1677e839af0b4",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:e=>this.handleSearch(e.detail)}),this.renderSearchResult(),this.renderErrorMessage())}static get style(){return`${e("pn-zipcode-search")}{display:block;color:#5e554a}${e("pn-zipcode-search")} .pn-search-results{display:flex;flex-direction:column;gap:1em;padding:0 0.75em}${e("pn-zipcode-search")} .pn-search-results span{color:#5e554a}${e("pn-zipcode-search")} .pn-search-results h3{color:#2d2013}${e("pn-zipcode-search")} .pn-error-text{color:#a70707;padding:0 0.75em}${e("pn-zipcode-search")}>${e("pn-search-field")}{width:100%;margin-bottom:1em}`}},[512,"pn-zipcode-search",{language:[1],value:[1025],validZipCode:[32],loading:[32],showResult:[32],zipCodeSearchResult:[32],error:[32],errorMessage:[32]}]),m=E,R=function(){"undefined"!=typeof customElements&&["pn-zipcode-search","pn-button","pn-icon","pn-search-field","pn-spinner"].forEach((s=>{switch(s){case"pn-zipcode-search":customElements.get(e(e(s)))||customElements.define(e(e(s)),E);break;case"pn-button":customElements.get(e(e(s)))||c();break;case"pn-icon":customElements.get(e(e(s)))||h();break;case"pn-search-field":customElements.get(e(e(s)))||p();break;case"pn-spinner":customElements.get(e(e(s)))||d()}}))};export{m as PnZipcodeSearch,R as defineCustomElement}
+import{transformTag as e,proxyCustomElement as s,HTMLElement as t,createEvent as i,h as n,Host as r}from"@stencil/core/internal/client";import{u as a,k as o,s as c}from"./helpers.js";import{d as l}from"./pn-button2.js";import{d as h}from"./pn-icon2.js";import{d as p}from"./pn-search-field2.js";import{d}from"./pn-spinner2.js";const u={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"}},E=s(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.searchsuccessful=i(this,"searchsuccessful",7)}searchId="pn-zipcode-"+a();get hostElement(){return this}validZipCode;loading=!1;showResult=!1;zipCodeSearchResult={delivery:"",upcoming:"",city:"",postalCode:""};error=!1;errorMessage;language=null;value;searchsuccessful;async componentWillLoad(){null===this.language&&await o(this.hostElement),this.value&&this.handleSearch(this.value)}translation(e){return u[e][this.language||c]}handleSearch(e){this.value=e,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((e=>e.json())).then((e=>{this.showResult=!0,this.zipCodeSearchResult=e,this.searchsuccessful.emit(!0)})).catch((()=>{this.error=!0,this.errorMessage="SERVER_ERROR_MESSAGE",this.searchsuccessful.emit(!1)})).finally((()=>{this.loading=!1}))}validateZipCode(){const e=this.value?this.value.replace(/[ -]/gi,""):"",s=/^\d{5}$/.test(e);this.error=!s,s&&(this.validZipCode=e)}renderSearchResult(){if(!this.loading&&!this.error&&this.showResult)return n("output",{class:"pn-search-results",htmlFor:this.searchId},n("p",{class:"text-row"},n("span",null,this.translation("CLOSEST_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.delivery)),n("p",{class:"text-row"},n("span",null,this.translation("NEXT_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.upcoming)),n("p",{class:"text-row"},n("span",null,this.translation("ZIP_CODE")),n("h3",null,this.zipCodeSearchResult.postalCode,", ",this.zipCodeSearchResult.city||"N/A")))}renderErrorMessage(){if(this.error&&!this.loading)return n("p",{class:"pn-error-text",role:"alert"},n("small",null,this.translation(this.errorMessage)))}render(){return n(r,{key:"b9314bbca808c725bc074d1dc9e58223bb551468"},n("pn-search-field",{key:"4c7eaf8c96aa36e17c546371345c7aac6a0c5ee7",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:e=>this.handleSearch(e.detail)}),this.renderSearchResult(),this.renderErrorMessage())}static get style(){return`${e("pn-zipcode-search")}{display:block;color:#5e554a}${e("pn-zipcode-search")} .pn-search-results{display:flex;flex-direction:column;gap:1em;padding:0 0.75em}${e("pn-zipcode-search")} .pn-search-results span{color:#5e554a}${e("pn-zipcode-search")} .pn-search-results h3{color:#2d2013}${e("pn-zipcode-search")} .pn-error-text{color:#a70707;padding:0 0.75em}${e("pn-zipcode-search")}>${e("pn-search-field")}{width:100%;margin-bottom:1em}`}},[512,"pn-zipcode-search",{language:[1],value:[1025],validZipCode:[32],loading:[32],showResult:[32],zipCodeSearchResult:[32],error:[32],errorMessage:[32]}]),m=E,R=function(){"undefined"!=typeof customElements&&["pn-zipcode-search","pn-button","pn-icon","pn-search-field","pn-spinner"].forEach((s=>{switch(s){case"pn-zipcode-search":customElements.get(e(e(s)))||customElements.define(e(e(s)),E);break;case"pn-button":customElements.get(e(e(s)))||l();break;case"pn-icon":customElements.get(e(e(s)))||h();break;case"pn-search-field":customElements.get(e(e(s)))||p();break;case"pn-spinner":customElements.get(e(e(s)))||d()}}))};export{m as PnZipcodeSearch,R as defineCustomElement}