@postnord/pn-marketweb-components 3.5.2 → 3.5.3

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

@@ -65,7 +65,7 @@ const PnTile$1 = /*@__PURE__*/ proxyCustomElement(class PnTile extends HTMLEleme
         this.pnTile.emit({ click: event });
     }
     render() {
-        return (h(Host, { key: '3aad61d5d06a72a5f2a5cd1808b18c3f7d8e437b' }, h("div", { key: '15c10f8f668544caa32385121caf382626aa1b8f', class: "pn-tile", "data-horizontal": this.horizontal, "data-href": !!this.url, "data-focus": this.visibleOutline, ref: el => (this.tile = el) }, h("div", { key: '9e61d1919dff7343e394ed86b1800284eb750121', class: "pn-tile-illustration", "data-circle": !!this.url, "data-icon": this.showIcon(), role: "presentation", hidden: !this.showImage() }, this.showPropIllustration() ? (h("pn-illustration", { illustration: this.illustration })) : (this.showIcon() && h("pn-icon", { color: "blue700", icon: this.icon })), h("div", { key: '59e5cdf5d9fb09045e215758692d5dc402a2a49a', class: "pn-tile-illustration-slot", hidden: !this.showSlotIllustration(), ref: el => (this.illustrationSlot = el) }, h("slot", { key: '00bc0dafa3ae0f89959d0a61d8221ce1e4bc8c2f', name: "illustration" }))), h("div", { key: 'c88f8daa6ee6f309d71a3205299ab98a1157a9a9', class: "pn-tile-text" }, h("h3", { key: '2cb429bf55430c1fcea8965c4cc73b511738d89d', class: "pn-tile-title" }, this.url ? (h("a", { class: "pn-tile-link", href: this.url, target: this.target, rel: !this.rel && this.isExternal() ? 'noopener noreferrer' : this.rel, onClick: e => this.clickHandler(e), onFocus: event => this.handleFocus(event), onBlur: event => this.handleFocus(event) }, this.label)) : (this.label), this.isExternal() && h("pn-icon", { key: '5ea4aae5bf9328d68da0ee75990d95c590dc6749', icon: open_in_new, small: true, color: "blue700" })), h("div", { key: 'b9d56f8d2ee862215ef7ae7143d3da8073274fe5', class: "pn-tile-slot" }, !!this.text && h("p", { key: '76b95108a202c183f270868959cb4a7bb5fe0c57', class: "pn-tile-paragraph" }, this.text), h("slot", { key: 'fb3b513fd684adbcbd2af81360437ceec1ff9928' }))))));
+        return (h(Host, { key: 'c24ec58a47482a67e27c1266accd657cf3e8c54a' }, h("div", { key: '23727e1b4212192010c81fcb7af59f60fede0152', class: "pn-tile", "data-horizontal": this.horizontal, "data-href": !!this.url, "data-focus": this.visibleOutline, ref: el => (this.tile = el) }, h("div", { key: 'b4bd44255ab53ef2dfb130e02aac7809aebcc16b', class: "pn-tile-illustration", "data-circle": !!this.url, "data-icon": this.showIcon(), role: "presentation", hidden: !this.showImage() }, this.showPropIllustration() ? (h("pn-illustration", { illustration: this.illustration })) : (this.showIcon() && h("pn-icon", { color: "blue700", icon: this.icon })), h("div", { key: '3133bd22a2be6d3625dcbe879f98d6aa0c0de723', class: "pn-tile-illustration-slot", hidden: !this.showSlotIllustration(), ref: el => (this.illustrationSlot = el) }, h("slot", { key: '6a87734eb323047682be191c51d58c1f857df589', name: "illustration" }))), h("div", { key: '2a96a865bc30e22c0d4133273b7bbeea81564bce', class: "pn-tile-text" }, h("h3", { key: 'bb9762e899ddb2b879151031b0ad65e61521956e', class: "pn-tile-title" }, this.url ? (h("a", { class: "pn-tile-link", href: this.url, target: this.target, rel: !this.rel && this.isExternal() ? 'noopener noreferrer' : this.rel, onClick: e => this.clickHandler(e), onFocus: event => this.handleFocus(event), onBlur: event => this.handleFocus(event) }, this.label)) : (this.label), this.isExternal() && h("pn-icon", { key: '97a513fdb9c6daedbf5a8b2614a06bbc5baafb01', icon: open_in_new, small: true, color: "blue700" })), h("div", { key: '9d136471d950acd8c7934da681a9a5f332f0fa95', class: "pn-tile-slot" }, !!this.text && h("p", { key: 'abc6a5b7bef04f7708ff22550a8354db625ad94c', class: "pn-tile-paragraph" }, this.text), h("slot", { key: '7df167c895e2b9cde15326b5f22f222e89690971' }))))));
     }
     static get style() { return PnTileStyle0; }
 }, [4, "pn-tile", {

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

@@ -24,7 +24,7 @@ const translations = {
     },
 };
 
-const pnToastCss = "pn-toast{position:relative;display:block;overflow:hidden}pn-toast .pn-toast{position:relative;color:#2d2013;padding:1em;border-radius:0.5em;outline:none;font-size:1em;font-weight:400;background-color:#e0f8ff;border-color:#005d92;display:flex;align-items:center;gap:0.75em;visibility:visible;transition-property:visibility;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-toast .pn-toast{transition-duration:0s;transition-delay:0s}}pn-toast .pn-toast .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}}pn-toast .pn-toast[data-hide]{visibility:hidden;transition-delay:0.2s}pn-toast .pn-toast-heading{font-size:1em;font-style:normal;font-weight:500;margin:0}pn-toast .pn-toast-text{font-size:1em;font-style:normal;font-weight:400;margin:0 0 0.25em 0}pn-toast .pn-toast-text:last-child{margin-bottom:0}pn-toast .pn-toast-icon .pn-icon-svg path{fill:#2d2013}pn-toast .pn-toast-content{display:flex;flex-direction:column;align-self:center;align-items:flex-start;gap:0.25em;margin:0 auto 0 0}pn-toast .pn-toast-button{cursor:pointer;border-radius:50%;border:none;background:none;padding:0.25em;font-size:1em;display:flex;align-items:center;justify-content:center;transition-property:background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1);outline:0.2rem solid transparent;outline-offset:0.2rem}@media (prefers-reduced-motion: reduce){pn-toast .pn-toast-button{transition-duration:0s;transition-delay:0s}}pn-toast .pn-toast-button:focus-visible{outline-color:#005d92;background-color:#8eddf9}pn-toast .pn-toast-button:hover{background-color:#8eddf9}pn-toast .pn-toast[data-appearance=success]{background-color:#dcf6e7}pn-toast .pn-toast[data-appearance=success] .pn-toast-button{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-toast .pn-toast[data-appearance=success] .pn-toast-button:focus-visible{outline-color:#005e41;background-color:#abe3bb}pn-toast .pn-toast[data-appearance=success] .pn-toast-button:hover{background-color:#abe3bb}pn-toast .pn-toast[data-appearance=success] .pn-ripple{background-color:#005e41}pn-toast .pn-toast[data-appearance=success] .pn-toast-icon .pn-icon-svg path{fill:#005e41}pn-toast .pn-toast[data-appearance=success][data-temporary]{border-color:#005e41}pn-toast .pn-toast[data-appearance=warning]{background-color:#fff1e3}pn-toast .pn-toast[data-appearance=warning] .pn-toast-button{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-toast .pn-toast[data-appearance=warning] .pn-toast-button:focus-visible{outline-color:#99290a;background-color:#ffc8a3}pn-toast .pn-toast[data-appearance=warning] .pn-toast-button:hover{background-color:#ffc8a3}pn-toast .pn-toast[data-appearance=warning] .pn-ripple{background-color:#99290a}pn-toast .pn-toast[data-appearance=warning] .pn-toast-icon .pn-icon-svg path{fill:#99290a}pn-toast .pn-toast[data-appearance=warning][data-temporary]{border-color:#ed7123}pn-toast .pn-toast[data-appearance=error]{background-color:#fdefee}pn-toast .pn-toast[data-appearance=error] .pn-toast-button{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-toast .pn-toast[data-appearance=error] .pn-toast-button:focus-visible{outline-color:#a70707;background-color:#fbc2c1}pn-toast .pn-toast[data-appearance=error] .pn-toast-button:hover{background-color:#fbc2c1}pn-toast .pn-toast[data-appearance=error] .pn-ripple{background-color:#a70707}pn-toast .pn-toast[data-appearance=error] .pn-toast-icon .pn-icon-svg path{fill:#a70707}pn-toast .pn-toast[data-appearance=error][data-temporary]{border-color:#a70707}pn-toast .pn-toast[data-temporary]{border-style:solid;border-width:0.0625em;box-shadow:0 0.125em 0.25em rgba(0, 0, 0, 0.2)}";
+const pnToastCss = "pn-toast{position:relative;display:block}pn-toast .pn-toast{position:relative;color:#2d2013;padding:1em;border-radius:0.5em;outline:none;font-size:1em;font-weight:400;background-color:#e0f8ff;border-color:#005d92;display:flex;align-items:center;gap:0.75em;visibility:visible;transition-property:visibility;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-toast .pn-toast{transition-duration:0s;transition-delay:0s}}pn-toast .pn-toast .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}}pn-toast .pn-toast[data-hide]{visibility:hidden;transition-delay:0.2s}pn-toast .pn-toast-heading{font-size:1em;font-style:normal;font-weight:500;margin:0}pn-toast .pn-toast-text{font-size:1em;font-style:normal;font-weight:400;margin:0 0 0.25em 0}pn-toast .pn-toast-text:last-child{margin-bottom:0}pn-toast .pn-toast-icon .pn-icon-svg path{fill:#2d2013}pn-toast .pn-toast-content{display:flex;flex-direction:column;align-self:center;align-items:flex-start;gap:0.25em;margin:0 auto 0 0}pn-toast .pn-toast-button{cursor:pointer;border-radius:50%;border:none;background:none;padding:0.25em;font-size:1em;display:flex;align-items:center;justify-content:center;transition-property:background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1);outline:0.2rem solid transparent;outline-offset:0.2rem}@media (prefers-reduced-motion: reduce){pn-toast .pn-toast-button{transition-duration:0s;transition-delay:0s}}pn-toast .pn-toast-button:focus-visible{outline-color:#005d92;background-color:#8eddf9}pn-toast .pn-toast-button:hover{background-color:#8eddf9}pn-toast .pn-toast[data-appearance=success]{background-color:#dcf6e7}pn-toast .pn-toast[data-appearance=success] .pn-toast-button{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-toast .pn-toast[data-appearance=success] .pn-toast-button:focus-visible{outline-color:#005e41;background-color:#abe3bb}pn-toast .pn-toast[data-appearance=success] .pn-toast-button:hover{background-color:#abe3bb}pn-toast .pn-toast[data-appearance=success] .pn-ripple{background-color:#005e41}pn-toast .pn-toast[data-appearance=success] .pn-toast-icon .pn-icon-svg path{fill:#005e41}pn-toast .pn-toast[data-appearance=success][data-temporary]{border-color:#005e41}pn-toast .pn-toast[data-appearance=warning]{background-color:#fff1e3}pn-toast .pn-toast[data-appearance=warning] .pn-toast-button{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-toast .pn-toast[data-appearance=warning] .pn-toast-button:focus-visible{outline-color:#99290a;background-color:#ffc8a3}pn-toast .pn-toast[data-appearance=warning] .pn-toast-button:hover{background-color:#ffc8a3}pn-toast .pn-toast[data-appearance=warning] .pn-ripple{background-color:#99290a}pn-toast .pn-toast[data-appearance=warning] .pn-toast-icon .pn-icon-svg path{fill:#99290a}pn-toast .pn-toast[data-appearance=warning][data-temporary]{border-color:#ed7123}pn-toast .pn-toast[data-appearance=error]{background-color:#fdefee}pn-toast .pn-toast[data-appearance=error] .pn-toast-button{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-toast .pn-toast[data-appearance=error] .pn-toast-button:focus-visible{outline-color:#a70707;background-color:#fbc2c1}pn-toast .pn-toast[data-appearance=error] .pn-toast-button:hover{background-color:#fbc2c1}pn-toast .pn-toast[data-appearance=error] .pn-ripple{background-color:#a70707}pn-toast .pn-toast[data-appearance=error] .pn-toast-icon .pn-icon-svg path{fill:#a70707}pn-toast .pn-toast[data-appearance=error][data-temporary]{border-color:#a70707}pn-toast .pn-toast[data-temporary]{border-style:solid;border-width:0.0625em;box-shadow:0 0.125em 0.25em rgba(0, 0, 0, 0.2)}";
 const PnToastStyle0 = pnToastCss;
 
 const PnToast$1 = /*@__PURE__*/ proxyCustomElement(class PnToast extends HTMLElement {
@@ -58,10 +58,13 @@ const PnToast$1 = /*@__PURE__*/ proxyCustomElement(class PnToast extends HTMLEle
             this.animationDuration = 0;
         else
             this.animationDuration = this.duration;
-        if (this.hide)
-            this.closeToast();
-        else
-            this.openToast();
+        this.hostElement.style.overflow = 'hidden';
+        requestAnimationFrame(() => {
+            if (this.hide)
+                this.closeToast();
+            else
+                this.openToast();
+        });
     }
     /** Event fired when the close button is pressed. */
     close;
@@ -71,8 +74,10 @@ const PnToast$1 = /*@__PURE__*/ proxyCustomElement(class PnToast extends HTMLEle
      **/
     hidden;
     async componentWillLoad() {
-        if (this.hide)
+        if (this.hide) {
             this.hostElement.style.height = '0';
+            this.hostElement.style.overflow = 'hidden';
+        }
         if (this.language === null)
             await awaitTopbar(this.hostElement);
         // Any text content at this stage means there is slotted content present.
@@ -87,19 +92,18 @@ const PnToast$1 = /*@__PURE__*/ proxyCustomElement(class PnToast extends HTMLEle
     }
     openToast() {
         requestAnimationFrame(() => {
-            const { scrollHeight } = this.hostElement;
+            const { clientHeight } = this.toast;
             const { height } = this.getRect(this.hostElement);
             this.hostElement.style.height = `${height}px`;
             this.isExpanding = true;
-            this.animateToast(true, `${height}px`, `${scrollHeight}px`);
+            this.animateToast(true, `${height}px`, `${clientHeight}px`);
         });
     }
     closeToast() {
-        const { scrollHeight, clientHeight } = this.hostElement;
-        const height = this.isExpanding ? clientHeight : scrollHeight;
+        const { clientHeight } = this.hostElement;
         this.hostElement.style.height = `0px`;
         this.isClosing = true;
-        this.animateToast(false, `${height}px`, `0px`);
+        this.animateToast(false, `${clientHeight}px`, `0px`);
     }
     animateToast(open, startHeight, endHeight) {
         this.cancelAnimations();
@@ -114,10 +118,12 @@ const PnToast$1 = /*@__PURE__*/ proxyCustomElement(class PnToast extends HTMLEle
     }
     animationFinish() {
         this.cancelAnimations();
-        if (!this.hide)
-            this.hostElement.style.height = '';
-        else
+        if (this.hide)
             this.hidden.emit(this.hide);
+        else {
+            this.hostElement.style.height = '';
+            this.hostElement.style.overflow = '';
+        }
         this.isClosing = false;
         this.isExpanding = false;
     }
@@ -158,11 +164,14 @@ const PnToast$1 = /*@__PURE__*/ proxyCustomElement(class PnToast extends HTMLEle
     translate(prop) {
         return translations?.[prop]?.[this.language || en] || prop;
     }
+    isMoving() {
+        return this.isClosing || this.isExpanding;
+    }
     hideToast() {
-        return this.hide && !(this.isClosing || this.isExpanding);
+        return this.hide && !this.isMoving();
     }
     render() {
-        return (h(Host, { key: 'c735e200d6cf3061569c3e55caf583abed738725' }, h("output", { key: '7911e4ca88367ea8130a20abda58449a1f7e3098', id: this.toastId, class: "pn-toast", role: this.getRole(), "data-appearance": this.appearance, "data-temporary": this.temporary, "data-hide": this.hideToast(), ref: el => (this.toast = el) }, this.showIcon() && h("pn-icon", { key: 'b064b710d21583eaba8d5ce1c3b162fb1c71f4e4', class: "pn-toast-icon", icon: this.getIcon() }), h("div", { key: '6e24b6771be924b56e2406ac92c5639f7da4b0b6', class: "pn-toast-content" }, this.showTitle() && h("h4", { key: 'eb24bcbbd70b1b77e86c2598569f443bd7d1bdfb', class: "pn-toast-heading" }, this.heading), this.text && h("p", { key: '713b372860897ef9bc55f401282765bc5684b6f6', class: "pn-toast-text" }, this.text), h("slot", { key: 'e567f676f28d20370407fc481c52c92bc34a06e1' })), this.showIllustration() && h("pn-illustration", { key: '6b0b4f9c1f588f71eb1154b6170994f59aaaae4a', illustration: this.illustration, width: "5.5em", height: "5.5em" }), this.closable && (h("button", { key: '4111381fb279dc2d5abe520188869133aa948246', class: "pn-toast-button", type: "button", "aria-label": this.translate('HIDE'), onClick: (event) => this.handleClick(event), ref: el => (this.button = el) }, h("pn-icon", { key: '020fe8b66ce1d955dcb5420c44b0b4b5b1845ab9', icon: close }))))));
+        return (h(Host, { key: 'b0f490bf139ccd8682e8d43f75ae99f6d5e4a054' }, h("div", { key: '8bdd1b6525b579d06b82d762e56c0ec34c4bb822', id: this.toastId, class: "pn-toast", role: this.getRole(), "data-appearance": this.appearance, "data-temporary": this.temporary, "data-hide": this.hideToast(), ref: el => (this.toast = el) }, this.showIcon() && h("pn-icon", { key: 'fc5626dbbe0f5a5939179f02be8e1e70eec22ebd', class: "pn-toast-icon", icon: this.getIcon() }), h("div", { key: 'f1aabfdd5d9e62d895cd4cfdaf31a7abb92e0749', class: "pn-toast-content" }, this.showTitle() && h("h4", { key: '6267fa5e2eb67c8a0d16506db0586f9b2fa6b18a', class: "pn-toast-heading" }, this.heading), this.text && h("p", { key: 'b1a2ee4468223afc9c43bb57f3aa72c38d86cb1c', class: "pn-toast-text" }, this.text), h("slot", { key: '2508212f2afc63d3faa5a189dd9ddba33cff3eaa' })), this.showIllustration() && h("pn-illustration", { key: 'bee93e5623aa57d1a1f765dd6ad13a8cdd1ea1d8', illustration: this.illustration, width: "5.5em", height: "5.5em" }), this.closable && (h("button", { key: '0db9441d732d60bd37446c92b0df34e44f1f61e9', class: "pn-toast-button", type: "button", "aria-label": this.translate('HIDE'), onClick: (event) => this.handleClick(event), ref: el => (this.button = el) }, h("pn-icon", { key: 'a1325ada64366284633932d4ba775e67b3ae6f59', icon: close }))))));
     }
     static get watchers() { return {
         "hide": ["handleHide"]

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

@@ -1 +1 @@
-{"file":"pn-toast.js","mappings":"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","names":["PnToast"],"sources":["node_modules/pn-design-assets/pn-assets/icons/alert_exclamation_triangle.js","src/components/feedback/pn-toast/translation.ts","src/components/feedback/pn-toast/pn-toast.scss?tag=pn-toast","src/components/feedback/pn-toast/pn-toast.tsx"],"sourcesContent":["const icon = '<svg class=\"pn-icon-svg\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"#000\" fill-rule=\"evenodd\" d=\"M12.874 2.514a1 1 0 0 0-1.748 0l-10 18A1 1 0 0 0 2 22h20a1 1 0 0 0 .874-1.486zM12 5.06 20.3 20H3.7zm-1.375 4.936a1.38 1.38 0 1 1 2.75 0l-.292 3.509a1.087 1.087 0 0 1-2.166 0zM12 15.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3\" clip-rule=\"evenodd\"/></svg>';\nexport const alert_exclamation_triangle = icon;\nexport const alertExclamationTriangle = icon;\n","export const translations = {\n  HIDE: {\n    sv: 'Stäng meddelande',\n    en: 'Dismiss message',\n    da: 'Afvis besked',\n    fi: 'Hylkää viesti',\n    no: 'Avvis meldingen',\n  },\n};\n","@use 'src/globals/main';\n\npn-toast {\n  position: relative;\n  display: block;\n  overflow: hidden;\n}\n\npn-toast .pn-toast {\n  position: relative;\n\n  color: main.$gray900;\n  padding: 1em;\n  border-radius: 0.5em;\n\n  outline: none;\n  font-size: 1em;\n  font-weight: 400;\n  background-color: main.$blue50;\n  border-color: main.$blue700;\n\n  display: flex;\n  align-items: center;\n  gap: 0.75em;\n\n  visibility: visible;\n\n  @include main.pn-transition('visibility');\n\n  @include main.pn-ripple(main.$blue700);\n\n  &[data-hide] {\n    visibility: hidden;\n    transition-delay: main.$timing;\n  }\n\n  &-heading {\n    font-size: 1em;\n    font-style: normal;\n    font-weight: 500;\n    margin: 0;\n  }\n\n  &-text {\n    font-size: 1em;\n    font-style: normal;\n    font-weight: 400;\n    margin: 0 0 0.25em 0;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n\n  &-icon .pn-icon-svg path {\n    fill: main.$gray900;\n  }\n\n  &-content {\n    display: flex;\n    flex-direction: column;\n    align-self: center;\n    align-items: flex-start;\n    gap: 0.25em;\n    margin: 0 auto 0 0;\n  }\n\n  &-button {\n    cursor: pointer;\n    border-radius: 50%;\n    border: none;\n    background: none;\n    padding: 0.25em;\n    font-size: 1em;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    @include main.pn-transition('background-color, outline-color');\n\n    @include main.pn-focus(main.$blue700, main.$blue200);\n\n    &:hover {\n      background-color: main.$blue200;\n    }\n  }\n\n  &[data-appearance='success'] {\n    background-color: main.$green50;\n\n    .pn-toast-button {\n      @include main.pn-focus(main.$green700, main.$green200);\n\n      &:hover {\n        background-color: main.$green200;\n      }\n    }\n\n    .pn-ripple {\n      background-color: main.$green700;\n    }\n\n    .pn-toast-icon .pn-icon-svg path {\n      fill: main.$green700;\n    }\n\n    &[data-temporary] {\n      border-color: main.$green700;\n    }\n  }\n\n  &[data-appearance='warning'] {\n    background-color: main.$orange50;\n\n    .pn-toast-button {\n      @include main.pn-focus(main.$orange700, main.$orange200);\n\n      &:hover {\n        background-color: main.$orange200;\n      }\n    }\n\n    .pn-ripple {\n      background-color: main.$orange700;\n    }\n\n    .pn-toast-icon .pn-icon-svg path {\n      fill: main.$orange700;\n    }\n\n    &[data-temporary] {\n      border-color: main.$orange500;\n    }\n  }\n\n  &[data-appearance='error'] {\n    background-color: main.$coral50;\n\n    .pn-toast-button {\n      @include main.pn-focus(main.$warning, main.$coral200);\n\n      &:hover {\n        background-color: main.$coral200;\n      }\n    }\n\n    .pn-ripple {\n      background-color: main.$warning;\n    }\n\n    .pn-toast-icon .pn-icon-svg path {\n      fill: main.$warning;\n    }\n\n    &[data-temporary] {\n      border-color: main.$warning;\n    }\n  }\n\n  &[data-temporary] {\n    border-style: solid;\n    border-width: 0.0625em;\n    box-shadow: 0 0.125em 0.25em rgba(0, 0, 0, 0.2);\n  }\n}\n","import type { PnLanguages } from '@/index';\nimport { awaitTopbar, en, ripple, reduceMotion } from '@/index';\nimport { Component, Host, Prop, h, Element, EventEmitter, Event, State, Watch } from '@stencil/core';\nimport {\n  alert_info_circle,\n  check_circle,\n  alert_exclamation_triangle,\n  alert_exclamation_circle,\n  close,\n} from 'pn-design-assets/pn-assets/icons.js';\nimport { translations } from './translation';\n\n/**\n * This component is able to fill many roles of a classic toast.\n * It has 4 different colors, a temporary state, hide button, icon and illustration support.\n *\n * The `pn-toast` will expand to its parent containers full width.\n * Either limit the parent width or set a CSS rule to your specific width if needed.\n */\n@Component({\n  tag: 'pn-toast',\n  styleUrl: 'pn-toast.scss',\n})\nexport class PnToast {\n  toast: HTMLOutputElement;\n  button: HTMLButtonElement;\n\n  private readonly duration: number = 400;\n  private animationDuration: number = this.duration;\n  private animation: Animation;\n\n  @Element() hostElement: HTMLElement;\n\n  @State() isClosing = false;\n  @State() isExpanding = false;\n\n  @State() hasSlottedContent: boolean = false;\n\n  /**\n   * Set a title for the toast. Requires the `text` prop in order to work.\n   * @description Can be used together with slotted content.\n   */\n  @Prop() heading?: string = '';\n  /**\n   * Set a paragraph of text for the toast.\n   * @description Can be used together with slotted content.\n   */\n  @Prop() text?: string = '';\n  /** Give the toast a HTML ID. */\n  @Prop() toastId?: string;\n  /**\n   * Default color is blue, you also have the option of success (green), warning (orange) and error (red).\n   * @category Visual\n   */\n  @Prop() appearance?: '' | 'success' | 'warning' | 'error';\n  /**\n   * This will apply a shadow and border to the toast.\n   * @category Visual\n   */\n  @Prop() temporary: boolean = false;\n  /**\n   * Set an SVG icon.\n   * @category Visual\n   */\n  @Prop() icon?: string;\n  /**\n   * Set an SVG illustration.\n   * @category Visual\n   */\n  @Prop() illustration?: string;\n  /**\n   * Control the visibility of the toast. If the `closable` prop is active, the toast will set the `hide` prop on its own.\n   * @see {@link closable}\n   * @category Features\n   */\n  @Prop({ mutable: true, reflect: true }) hide: boolean = false;\n  /**\n   * Show close button.\n   * @category Features\n   */\n  @Prop() closable: boolean = false;\n  /**\n   * Manually set the language, only needed if the `closable` prop is enabled.\n   * @see {@link closable}\n   * @category Features\n   */\n  @Prop({ mutable: true }) language?: PnLanguages = null;\n\n  @Watch('hide')\n  handleHide() {\n    if (reduceMotion()) this.animationDuration = 0;\n    else this.animationDuration = this.duration;\n\n    if (this.hide) this.closeToast();\n    else this.openToast();\n  }\n\n  /** Event fired when the close button is pressed. */\n  @Event() close: EventEmitter<boolean>;\n  /**\n   * This event is fired when the toast is fully hidden after the animation is finished.\n   * Triggers from the close button or if the prop `hide` is set to true.\n   **/\n  @Event() hidden: EventEmitter<boolean>;\n\n  async componentWillLoad() {\n    if (this.hide) this.hostElement.style.height = '0';\n\n    if (this.language === null) await awaitTopbar(this.hostElement);\n    // Any text content at this stage means there is slotted content present.\n    this.hasSlottedContent = !!this.hostElement.textContent;\n  }\n\n  componentDidLoad() {\n    if (!!this.heading && !this.text && !this.hasSlottedContent)\n      console.warn('The %s prop is only available if you use the %s prop or slotted content.', 'heading', 'text');\n  }\n\n  private getRect(element: HTMLElement): DOMRect {\n    return element.getBoundingClientRect();\n  }\n\n  private openToast() {\n    requestAnimationFrame(() => {\n      const { scrollHeight } = this.hostElement;\n      const { height } = this.getRect(this.hostElement);\n\n      this.hostElement.style.height = `${height}px`;\n\n      this.isExpanding = true;\n      this.animateToast(true, `${height}px`, `${scrollHeight}px`);\n    });\n  }\n\n  private closeToast() {\n    const { scrollHeight, clientHeight } = this.hostElement;\n    const height = this.isExpanding ? clientHeight : scrollHeight;\n    this.hostElement.style.height = `0px`;\n\n    this.isClosing = true;\n    this.animateToast(false, `${height}px`, `0px`);\n  }\n\n  private animateToast(open: boolean, startHeight: string, endHeight: string) {\n    this.cancelAnimations();\n    this.animation = this.hostElement.animate(\n      {\n        height: [startHeight, endHeight],\n      },\n      {\n        duration: this.animationDuration,\n        easing: 'cubic-bezier(0.6, 0, 0.2, 1)',\n      },\n    );\n    this.animation.onfinish = () => this.animationFinish();\n    this.animation.oncancel = () => (open ? (this.isExpanding = false) : (this.isClosing = false));\n  }\n\n  private animationFinish() {\n    this.cancelAnimations();\n    if (!this.hide) this.hostElement.style.height = '';\n    else this.hidden.emit(this.hide);\n    this.isClosing = false;\n    this.isExpanding = false;\n  }\n\n  private cancelAnimations() {\n    if (this.animation) this.animation.cancel();\n  }\n\n  private handleClick(event: PointerEvent) {\n    this.hide = true;\n    this.close.emit(this.hide);\n    ripple(event, this.toast);\n  }\n\n  private getIcon(): string {\n    if (this.illustration) return '';\n    if (this.icon) return this.icon;\n    if (this.appearance === 'success') return check_circle;\n    if (this.appearance === 'warning') return alert_exclamation_triangle;\n    if (this.appearance === 'error') return alert_exclamation_circle;\n    return alert_info_circle;\n  }\n\n  private getRole(): string {\n    return this.appearance === 'error' ? 'alert' : 'status';\n  }\n\n  private showIcon(): boolean {\n    return !this.illustration;\n  }\n\n  private showIllustration(): boolean {\n    return !this.showIcon();\n  }\n\n  private showTitle(): boolean {\n    return (this.hasSlottedContent || !!this.text) && !!this.heading;\n  }\n\n  private translate(prop: string): string {\n    return translations?.[prop]?.[this.language || en] || prop;\n  }\n\n  private hideToast() {\n    return this.hide && !(this.isClosing || this.isExpanding);\n  }\n\n  render() {\n    return (\n      <Host>\n        <output\n          id={this.toastId}\n          class=\"pn-toast\"\n          role={this.getRole()}\n          data-appearance={this.appearance}\n          data-temporary={this.temporary}\n          data-hide={this.hideToast()}\n          ref={el => (this.toast = el)}\n        >\n          {this.showIcon() && <pn-icon class=\"pn-toast-icon\" icon={this.getIcon()} />}\n\n          <div class=\"pn-toast-content\">\n            {this.showTitle() && <h4 class=\"pn-toast-heading\">{this.heading}</h4>}\n            {this.text && <p class=\"pn-toast-text\">{this.text}</p>}\n            <slot />\n          </div>\n\n          {this.showIllustration() && <pn-illustration illustration={this.illustration} width=\"5.5em\" height=\"5.5em\" />}\n\n          {this.closable && (\n            <button\n              class=\"pn-toast-button\"\n              type=\"button\"\n              aria-label={this.translate('HIDE')}\n              onClick={(event: PointerEvent) => this.handleClick(event)}\n              ref={el => (this.button = el)}\n            >\n              <pn-icon icon={close} />\n            </button>\n          )}\n        </output>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"pn-toast.js","mappings":"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","names":["PnToast"],"sources":["node_modules/pn-design-assets/pn-assets/icons/alert_exclamation_triangle.js","src/components/feedback/pn-toast/translation.ts","src/components/feedback/pn-toast/pn-toast.scss?tag=pn-toast","src/components/feedback/pn-toast/pn-toast.tsx"],"sourcesContent":["const icon = '<svg class=\"pn-icon-svg\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"#000\" fill-rule=\"evenodd\" d=\"M12.874 2.514a1 1 0 0 0-1.748 0l-10 18A1 1 0 0 0 2 22h20a1 1 0 0 0 .874-1.486zM12 5.06 20.3 20H3.7zm-1.375 4.936a1.38 1.38 0 1 1 2.75 0l-.292 3.509a1.087 1.087 0 0 1-2.166 0zM12 15.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3\" clip-rule=\"evenodd\"/></svg>';\nexport const alert_exclamation_triangle = icon;\nexport const alertExclamationTriangle = icon;\n","export const translations = {\n  HIDE: {\n    sv: 'Stäng meddelande',\n    en: 'Dismiss message',\n    da: 'Afvis besked',\n    fi: 'Hylkää viesti',\n    no: 'Avvis meldingen',\n  },\n};\n","@use 'src/globals/main';\n\npn-toast {\n  position: relative;\n  display: block;\n}\n\npn-toast .pn-toast {\n  position: relative;\n\n  color: main.$gray900;\n  padding: 1em;\n  border-radius: 0.5em;\n\n  outline: none;\n  font-size: 1em;\n  font-weight: 400;\n  background-color: main.$blue50;\n  border-color: main.$blue700;\n\n  display: flex;\n  align-items: center;\n  gap: 0.75em;\n\n  visibility: visible;\n\n  @include main.pn-transition('visibility');\n\n  @include main.pn-ripple(main.$blue700);\n\n  &[data-hide] {\n    visibility: hidden;\n    transition-delay: main.$timing;\n  }\n\n  &-heading {\n    font-size: 1em;\n    font-style: normal;\n    font-weight: 500;\n    margin: 0;\n  }\n\n  &-text {\n    font-size: 1em;\n    font-style: normal;\n    font-weight: 400;\n    margin: 0 0 0.25em 0;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n\n  &-icon .pn-icon-svg path {\n    fill: main.$gray900;\n  }\n\n  &-content {\n    display: flex;\n    flex-direction: column;\n    align-self: center;\n    align-items: flex-start;\n    gap: 0.25em;\n    margin: 0 auto 0 0;\n  }\n\n  &-button {\n    cursor: pointer;\n    border-radius: 50%;\n    border: none;\n    background: none;\n    padding: 0.25em;\n    font-size: 1em;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    @include main.pn-transition('background-color, outline-color');\n\n    @include main.pn-focus(main.$blue700, main.$blue200);\n\n    &:hover {\n      background-color: main.$blue200;\n    }\n  }\n\n  &[data-appearance='success'] {\n    background-color: main.$green50;\n\n    .pn-toast-button {\n      @include main.pn-focus(main.$green700, main.$green200);\n\n      &:hover {\n        background-color: main.$green200;\n      }\n    }\n\n    .pn-ripple {\n      background-color: main.$green700;\n    }\n\n    .pn-toast-icon .pn-icon-svg path {\n      fill: main.$green700;\n    }\n\n    &[data-temporary] {\n      border-color: main.$green700;\n    }\n  }\n\n  &[data-appearance='warning'] {\n    background-color: main.$orange50;\n\n    .pn-toast-button {\n      @include main.pn-focus(main.$orange700, main.$orange200);\n\n      &:hover {\n        background-color: main.$orange200;\n      }\n    }\n\n    .pn-ripple {\n      background-color: main.$orange700;\n    }\n\n    .pn-toast-icon .pn-icon-svg path {\n      fill: main.$orange700;\n    }\n\n    &[data-temporary] {\n      border-color: main.$orange500;\n    }\n  }\n\n  &[data-appearance='error'] {\n    background-color: main.$coral50;\n\n    .pn-toast-button {\n      @include main.pn-focus(main.$warning, main.$coral200);\n\n      &:hover {\n        background-color: main.$coral200;\n      }\n    }\n\n    .pn-ripple {\n      background-color: main.$warning;\n    }\n\n    .pn-toast-icon .pn-icon-svg path {\n      fill: main.$warning;\n    }\n\n    &[data-temporary] {\n      border-color: main.$warning;\n    }\n  }\n\n  &[data-temporary] {\n    border-style: solid;\n    border-width: 0.0625em;\n    box-shadow: 0 0.125em 0.25em rgba(0, 0, 0, 0.2);\n  }\n}\n","import type { PnLanguages } from '@/index';\nimport { awaitTopbar, en, ripple, reduceMotion } from '@/index';\nimport { Component, Host, Prop, h, Element, EventEmitter, Event, State, Watch } from '@stencil/core';\nimport {\n  alert_info_circle,\n  check_circle,\n  alert_exclamation_triangle,\n  alert_exclamation_circle,\n  close,\n} from 'pn-design-assets/pn-assets/icons.js';\nimport { translations } from './translation';\n\n/**\n * This component is able to fill many roles of a classic toast.\n * It has 4 different colors, a temporary state, hide button, icon and illustration support.\n *\n * The `pn-toast` will expand to its parent containers full width.\n * Either limit the parent width or set a CSS rule to your specific width if needed.\n */\n@Component({\n  tag: 'pn-toast',\n  styleUrl: 'pn-toast.scss',\n})\nexport class PnToast {\n  toast: HTMLDivElement;\n  button: HTMLButtonElement;\n\n  private readonly duration: number = 400;\n  private animationDuration: number = this.duration;\n  private animation: Animation;\n\n  @Element() hostElement: HTMLElement;\n\n  @State() isClosing = false;\n  @State() isExpanding = false;\n\n  @State() hasSlottedContent: boolean = false;\n\n  /**\n   * Set a title for the toast. Requires the `text` prop in order to work.\n   * @description Can be used together with slotted content.\n   */\n  @Prop() heading?: string = '';\n  /**\n   * Set a paragraph of text for the toast.\n   * @description Can be used together with slotted content.\n   */\n  @Prop() text?: string = '';\n  /** Give the toast a HTML ID. */\n  @Prop() toastId?: string;\n  /**\n   * Default color is blue, you also have the option of success (green), warning (orange) and error (red).\n   * @category Visual\n   */\n  @Prop() appearance?: '' | 'success' | 'warning' | 'error';\n  /**\n   * This will apply a shadow and border to the toast.\n   * @category Visual\n   */\n  @Prop() temporary: boolean = false;\n  /**\n   * Set an SVG icon.\n   * @category Visual\n   */\n  @Prop() icon?: string;\n  /**\n   * Set an SVG illustration.\n   * @category Visual\n   */\n  @Prop() illustration?: string;\n  /**\n   * Control the visibility of the toast. If the `closable` prop is active, the toast will set the `hide` prop on its own.\n   * @see {@link closable}\n   * @category Features\n   */\n  @Prop({ mutable: true, reflect: true }) hide: boolean = false;\n  /**\n   * Show close button.\n   * @category Features\n   */\n  @Prop() closable: boolean = false;\n  /**\n   * Manually set the language, only needed if the `closable` prop is enabled.\n   * @see {@link closable}\n   * @category Features\n   */\n  @Prop({ mutable: true }) language?: PnLanguages = null;\n\n  @Watch('hide')\n  handleHide() {\n    if (reduceMotion()) this.animationDuration = 0;\n    else this.animationDuration = this.duration;\n\n    this.hostElement.style.overflow = 'hidden';\n\n    requestAnimationFrame(() => {\n      if (this.hide) this.closeToast();\n      else this.openToast();\n    });\n  }\n\n  /** Event fired when the close button is pressed. */\n  @Event() close: EventEmitter<boolean>;\n  /**\n   * This event is fired when the toast is fully hidden after the animation is finished.\n   * Triggers from the close button or if the prop `hide` is set to true.\n   **/\n  @Event() hidden: EventEmitter<boolean>;\n\n  async componentWillLoad() {\n    if (this.hide) {\n      this.hostElement.style.height = '0';\n      this.hostElement.style.overflow = 'hidden';\n    }\n\n    if (this.language === null) await awaitTopbar(this.hostElement);\n    // Any text content at this stage means there is slotted content present.\n    this.hasSlottedContent = !!this.hostElement.textContent;\n  }\n\n  componentDidLoad() {\n    if (!!this.heading && !this.text && !this.hasSlottedContent)\n      console.warn('The %s prop is only available if you use the %s prop or slotted content.', 'heading', 'text');\n  }\n\n  private getRect(element: HTMLElement): DOMRect {\n    return element.getBoundingClientRect();\n  }\n\n  private openToast() {\n    requestAnimationFrame(() => {\n      const { clientHeight } = this.toast;\n      const { height } = this.getRect(this.hostElement);\n\n      this.hostElement.style.height = `${height}px`;\n\n      this.isExpanding = true;\n      this.animateToast(true, `${height}px`, `${clientHeight}px`);\n    });\n  }\n\n  private closeToast() {\n    const { clientHeight } = this.hostElement;\n    this.hostElement.style.height = `0px`;\n\n    this.isClosing = true;\n    this.animateToast(false, `${clientHeight}px`, `0px`);\n  }\n\n  private animateToast(open: boolean, startHeight: string, endHeight: string) {\n    this.cancelAnimations();\n    this.animation = this.hostElement.animate(\n      {\n        height: [startHeight, endHeight],\n      },\n      {\n        duration: this.animationDuration,\n        easing: 'cubic-bezier(0.6, 0, 0.2, 1)',\n      },\n    );\n    this.animation.onfinish = () => this.animationFinish();\n    this.animation.oncancel = () => (open ? (this.isExpanding = false) : (this.isClosing = false));\n  }\n\n  private animationFinish() {\n    this.cancelAnimations();\n    if (this.hide) this.hidden.emit(this.hide);\n    else {\n      this.hostElement.style.height = '';\n      this.hostElement.style.overflow = '';\n    }\n    this.isClosing = false;\n    this.isExpanding = false;\n  }\n\n  private cancelAnimations() {\n    if (this.animation) this.animation.cancel();\n  }\n\n  private handleClick(event: PointerEvent) {\n    this.hide = true;\n    this.close.emit(this.hide);\n    ripple(event, this.toast);\n  }\n\n  private getIcon(): string {\n    if (this.illustration) return '';\n    if (this.icon) return this.icon;\n    if (this.appearance === 'success') return check_circle;\n    if (this.appearance === 'warning') return alert_exclamation_triangle;\n    if (this.appearance === 'error') return alert_exclamation_circle;\n    return alert_info_circle;\n  }\n\n  private getRole(): string {\n    return this.appearance === 'error' ? 'alert' : 'status';\n  }\n\n  private showIcon(): boolean {\n    return !this.illustration;\n  }\n\n  private showIllustration(): boolean {\n    return !this.showIcon();\n  }\n\n  private showTitle(): boolean {\n    return (this.hasSlottedContent || !!this.text) && !!this.heading;\n  }\n\n  private translate(prop: string): string {\n    return translations?.[prop]?.[this.language || en] || prop;\n  }\n\n  private isMoving(): boolean {\n    return this.isClosing || this.isExpanding;\n  }\n\n  private hideToast(): boolean {\n    return this.hide && !this.isMoving();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          id={this.toastId}\n          class=\"pn-toast\"\n          role={this.getRole()}\n          data-appearance={this.appearance}\n          data-temporary={this.temporary}\n          data-hide={this.hideToast()}\n          ref={el => (this.toast = el)}\n        >\n          {this.showIcon() && <pn-icon class=\"pn-toast-icon\" icon={this.getIcon()} />}\n\n          <div class=\"pn-toast-content\">\n            {this.showTitle() && <h4 class=\"pn-toast-heading\">{this.heading}</h4>}\n            {this.text && <p class=\"pn-toast-text\">{this.text}</p>}\n            <slot />\n          </div>\n\n          {this.showIllustration() && <pn-illustration illustration={this.illustration} width=\"5.5em\" height=\"5.5em\" />}\n\n          {this.closable && (\n            <button\n              class=\"pn-toast-button\"\n              type=\"button\"\n              aria-label={this.translate('HIDE')}\n              onClick={(event: PointerEvent) => this.handleClick(event)}\n              ref={el => (this.button = el)}\n            >\n              <pn-icon icon={close} />\n            </button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

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

@@ -47,7 +47,7 @@ const PnToggleSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PnToggleSwitch e
         return this.showHelpertext() ? this.idHelper : null;
     }
     render() {
-        return (h(Host, { key: '9806bc50780935f442660701539941efd05d92d5' }, h("div", { key: 'a2babfadbf6443da619b35f9d8cb09a7b0bd4a59', class: "pn-toggle" }, this.label && (h("div", { key: '525510807f8f7e505b589c8055f277b196f813cd', class: "pn-toggle-content" }, h("label", { key: 'cc58536e57de5a852762de90c5edf0ad2f92a05f', htmlFor: this.toggleid, class: "pn-toggle-label" }, h("span", { key: 'a43dba51d8becebf1f508300ccb72530400535c7' }, this.label)), h("p", { key: 'd86c250e53ceb45830444a13a8f2c609173542de', id: this.idHelper, class: "pn-toggle-helper", hidden: !this.showHelpertext() }, this.hasHelpertextProp() && h("span", { key: '02a55f8a4c9da87b33b31ecd3d30ad6a73d70714' }, this.helpertext), h("slot", { key: '065675c0046d2cbdd581ef0c5ec745a5b03393eb', name: "helpertext" })))), h("div", { key: '6cbc83780caacb03d778aa2b9f882858231206ca', class: "pn-toggle-button", "data-small": this.small, "data-large": this.large, "data-loading": this.loading }, h("input", { key: '1a7062923c2668cb41b4c4b14f948c4074cf416e', 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() }), h("div", { key: '3a85ff013cb29f5c7bef3d088ec782a53b3924ac', class: "pn-toggle-bg" }), h("div", { key: '955a78cfd16980bd437e03e51f3cde49185fe954', class: "pn-toggle-circle" }, h("svg", { key: 'fc0802cf056f5413c1228584c53abae8b21a8813', class: "pn-toggle-check", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { key: 'e881ac5ae0b5838293ac2e5af74a0c56ddd85687', points: "4,12 9,17 20,6", "stroke-width": "3" })), h("pn-spinner", { key: '78e5dd0484be70fc75315475daffed5b2e63c8bb', size: 1.125 }))))));
+        return (h(Host, { key: 'ab6fe1d4472bf8a817d28c503dd4268af259c34d' }, h("div", { key: 'f16a8d97ba68161a192f1b1b3b254c21f0ff804b', class: "pn-toggle" }, this.label && (h("div", { key: 'c3666dc49b09637cc10b0bdc12e573d57e005268', class: "pn-toggle-content" }, h("label", { key: '977c13dfd61a8b10a8dd2606a750d0716fe30adb', htmlFor: this.toggleid, class: "pn-toggle-label" }, h("span", { key: '3c4399a7456fc446f8279dd7d46b06e5fe663e06' }, this.label)), h("p", { key: 'e300cfac23f9f290641f8fc345611a1cebf5b173', id: this.idHelper, class: "pn-toggle-helper", hidden: !this.showHelpertext() }, this.hasHelpertextProp() && h("span", { key: '15f3b3bceafb9f868d16d4623cc977b58add2a6c' }, this.helpertext), h("slot", { key: '6a19bcbc616bf74371d145545605bfbe6873a707', name: "helpertext" })))), h("div", { key: '6b4590a7e6b32a684d11661baa9ced6b482b17d3', class: "pn-toggle-button", "data-small": this.small, "data-large": this.large, "data-loading": this.loading }, h("input", { key: 'afa8576dfd3ae59631ae54049b95a268dc139e95', 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() }), h("div", { key: 'ad9ae48c3b5f2a72b5067f71b34f8410766f09c8', class: "pn-toggle-bg" }), h("div", { key: '644f991914000783c81dc3f3c0a84406e117c177', class: "pn-toggle-circle" }, h("svg", { key: '9d6c808e21fb87486ceec83deb990fcbc738a8f7', class: "pn-toggle-check", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { key: '796e5a93439baf1bbb88cf7ac50f2960a7ca819c', points: "4,12 9,17 20,6", "stroke-width": "3" })), h("pn-spinner", { key: '55995adf95f2de9658a54f06dd6156fd006aed4b', size: 1.125 }))))));
     }
     static get watchers() { return {
         "toggleid": ["handleHelperId"]

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

@@ -79,7 +79,7 @@ const PnTooltip$1 = /*@__PURE__*/ proxyCustomElement(class PnTooltip extends HTM
         }, time);
     }
     render() {
-        return (h("button", { key: '7b0253721fbc44e83afc6daa41d984e9dbf16c0b', class: "pn-tooltip", "data-light": this.light, "data-warning": this.warning, "data-downwards": this.downwards, "data-open": this.open, ref: el => (this.button = el) }, h("pn-icon", { key: 'd6086755274289dad52757b42aa508927d0746d2', icon: this.getSymbol(), "data-simple": !!this.tooltip }), h("div", { key: 'e155c88aa2ee2b33c5622741efa59bb07ba548c7', class: "pn-tooltip-content", "data-simple": !!this.tooltip, ref: el => (this.content = el) }, this.tooltip, h("div", { key: '62a3db64ee0d4e3da5d3e2f414850f3792235f1c', hidden: !!this.tooltip }, h("slot", { key: 'e769400a4d5e1ceddc7fb6a953fe37eeea1b4218' })))));
+        return (h("button", { key: 'a421dbdcba2a38e9adc8f7364c5ff185372f1deb', class: "pn-tooltip", "data-light": this.light, "data-warning": this.warning, "data-downwards": this.downwards, "data-open": this.open, ref: el => (this.button = el) }, h("pn-icon", { key: '61409db0c58289bf1b606e0dc323266c0322b64b', icon: this.getSymbol(), "data-simple": !!this.tooltip }), h("div", { key: '2164d90ba6dabac1309d751772c9ae20c9c118c1', class: "pn-tooltip-content", "data-simple": !!this.tooltip, ref: el => (this.content = el) }, this.tooltip, h("div", { key: 'e30e4bdee6fe1666b5ad6154773a06fd5649dd92', hidden: !!this.tooltip }, h("slot", { key: '4456ff966d227bbca13599565c9ceb0adb6c91d6' })))));
     }
     static get watchers() { return {
         "open": ["openHandler"]

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

@@ -124,7 +124,7 @@ const PnZipcodeSearch$1 = /*@__PURE__*/ proxyCustomElement(class PnZipcodeSearch
         }
     }
     render() {
-        return (h(Host, { key: 'ab60b367efe4208942f13a524f10325323d1f499' }, h("pn-search-field", { key: '6449ae03e55e4bb228b70245863aa0448ce87957', 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()));
+        return (h(Host, { key: 'cc6f1ccb014330d11b8b75fa09e2f39da079a7f4' }, h("pn-search-field", { key: '60bbf5751e937c820afbf997a3f51ba9ac85d762', 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 PnZipcodeSearchStyle0; }
 }, [0, "pn-zipcode-search", {

package/umd/modules/@postnord/web-components/esm/{angle_down-d788f691.js → chevron_down-6e3fb42f.js}

@@ -3,8 +3,8 @@
  * By PostNord.
  */
 const icon = '<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M12.707 16.707a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 1.414-1.414L12 14.586l7.293-7.293a1 1 0 1 1 1.414 1.414z" clip-rule="evenodd"/></svg>';
-const angle_down = icon;
+const chevron_down = icon;
 
-export { angle_down as a };
+export { chevron_down as c };
 
-//# sourceMappingURL=angle_down-d788f691.js.map
+//# sourceMappingURL=chevron_down-6e3fb42f.js.map

package/umd/modules/@postnord/web-components/esm/chevron_down-6e3fb42f.js.map

@@ -0,0 +1 @@
+{"file":"chevron_down-6e3fb42f.js","mappings":";;;;AAAA,MAAM,IAAI,GAAG,4QAA4Q,CAAC;AAC9Q,MAAC,YAAY,GAAG;;;;","names":[],"sources":["node_modules/pn-design-assets/pn-assets/icons/chevron_down.js"],"sourcesContent":["const icon = '<svg class=\"pn-icon-svg\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"#000\" fill-rule=\"evenodd\" d=\"M12.707 16.707a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 1.414-1.414L12 14.586l7.293-7.293a1 1 0 1 1 1.414 1.414z\" clip-rule=\"evenodd\"/></svg>';\nexport const chevron_down = icon;\nexport const chevronDown = icon;\n"],"version":3}

package/umd/modules/@postnord/web-components/{components/angle_right.js → esm/chevron_right-9d9305e8.js}

@@ -3,11 +3,11 @@
  * By PostNord.
  */
 const icon$1 = '<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M6.293 12.707a1 1 0 0 1 0-1.414l8-8a1 1 0 1 1 1.414 1.414L8.414 12l7.293 7.293a1 1 0 0 1-1.414 1.414z" clip-rule="evenodd"/></svg>';
-const angle_left = icon$1;
+const chevron_left = icon$1;
 
 const icon = '<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M17.707 11.293a1 1 0 0 1 0 1.414l-8 8a1 1 0 0 1-1.414-1.414L15.586 12 8.293 4.707a1 1 0 0 1 1.414-1.414z" clip-rule="evenodd"/></svg>';
-const angle_right = icon;
+const chevron_right = icon;
 
-export { angle_left as a, angle_right as b };
+export { chevron_right as a, chevron_left as c };
 
-//# sourceMappingURL=angle_right.js.map
+//# sourceMappingURL=chevron_right-9d9305e8.js.map

package/umd/modules/@postnord/web-components/esm/chevron_right-9d9305e8.js.map

@@ -0,0 +1 @@
+{"file":"chevron_right-9d9305e8.js","mappings":";;;;AAAA,MAAMA,MAAI,GAAG,yQAAyQ,CAAC;AAC3Q,MAAC,YAAY,GAAGA;;ACD5B,MAAM,IAAI,GAAG,4QAA4Q,CAAC;AAC9Q,MAAC,aAAa,GAAG;;;;","names":["icon"],"sources":["node_modules/pn-design-assets/pn-assets/icons/chevron_left.js","node_modules/pn-design-assets/pn-assets/icons/chevron_right.js"],"sourcesContent":["const icon = '<svg class=\"pn-icon-svg\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"#000\" fill-rule=\"evenodd\" d=\"M6.293 12.707a1 1 0 0 1 0-1.414l8-8a1 1 0 1 1 1.414 1.414L8.414 12l7.293 7.293a1 1 0 0 1-1.414 1.414z\" clip-rule=\"evenodd\"/></svg>';\nexport const chevron_left = icon;\nexport const chevronLeft = icon;\n","const icon = '<svg class=\"pn-icon-svg\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"#000\" fill-rule=\"evenodd\" d=\"M17.707 11.293a1 1 0 0 1 0 1.414l-8 8a1 1 0 0 1-1.414-1.414L15.586 12 8.293 4.707a1 1 0 0 1 1.414-1.414z\" clip-rule=\"evenodd\"/></svg>';\nexport const chevron_right = icon;\nexport const chevronRight = icon;\n"],"version":3}

package/umd/modules/@postnord/web-components/esm/loader.js

@@ -9,7 +9,7 @@ import { g as globalScripts } from './app-globals-c9b57479.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy(JSON.parse("[[\"pn-file-upload\",[[4,\"pn-file-upload\",{\"label\":[1],\"helpertext\":[1],\"language\":[1],\"hideProgress\":[4,\"hide-progress\"],\"name\":[1],\"accept\":[1],\"maxSize\":[1,\"max-size\"],\"capture\":[1],\"limit\":[2],\"multiple\":[1028],\"required\":[4],\"disabled\":[4],\"files\":[32],\"isHovering\":[32],\"startUpload\":[64],\"clearUpload\":[64],\"removeFile\":[64],\"updateFile\":[64]},null,{\"limit\":[\"handleLimit\"],\"maxSize\":[\"handleMaxBytes\"]}]]],[\"pn-ocr-search\",[[0,\"pn-ocr-search\",{\"language\":[1],\"loading\":[32],\"error\":[32],\"ocrNumber\":[32],\"searchSuccess\":[32],\"invalidOcrNumber\":[32]}]]],[\"pn-pagination\",[[0,\"pn-pagination\",{\"label\":[1],\"urlTemplate\":[1,\"url-template\"],\"paginationId\":[1,\"pagination-id\"],\"language\":[1],\"page\":[1538],\"pages\":[1026],\"pagesVisible\":[1026,\"pages-visible\"],\"rows\":[1026],\"rowsList\":[1,\"rows-list\"],\"rowsLabel\":[1,\"rows-label\"],\"list\":[32]},null,{\"page\":[\"handlePage\"],\"pages\":[\"handlePages\"],\"pagesVisible\":[\"handlePagesVisible\"]}]]],[\"pn-zipcode-search\",[[0,\"pn-zipcode-search\",{\"language\":[1],\"value\":[1025],\"validZipCode\":[32],\"loading\":[32],\"showResult\":[32],\"zipCodeSearchResult\":[32],\"error\":[32],\"errorMessage\":[32]}]]],[\"pn-action-menu\",[[0,\"pn-action-menu\",{\"options\":[16],\"button\":[16],\"menuId\":[1,\"menu-id\"],\"language\":[1025],\"open\":[1540],\"menuUp\":[4,\"menu-up\"],\"menuLeft\":[4,\"menu-left\"],\"smallMenu\":[32],\"upwards\":[32],\"activeSubmenu\":[32],\"isClosing\":[32],\"isExpanding\":[32]},[[9,\"resize\",\"handleResize\"]],{\"options\":[\"handleOptions\"],\"open\":[\"openHandler\"],\"menuId\":[\"handleMenuId\"]}]]],[\"pn-button-dropdown\",[[4,\"pn-button-dropdown\",{\"label\":[1],\"icon\":[1],\"appearance\":[1],\"variant\":[1],\"small\":[4],\"tooltip\":[1],\"open\":[1540],\"right\":[32],\"top\":[32]},null,{\"open\":[\"openHandler\"]}]]],[\"pn-counter\",[[0,\"pn-counter\",{\"label\":[1],\"helpertext\":[1],\"value\":[1538],\"counterid\":[1],\"language\":[1],\"labelDecrease\":[1,\"label-decrease\"],\"labelIncrease\":[1,\"label-increase\"],\"minMessage\":[1,\"min-message\"],\"maxMessage\":[1,\"max-message\"],\"name\":[1],\"min\":[2],\"max\":[2],\"step\":[2],\"list\":[1],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"clearAriaTimer\":[32],\"displaySrValue\":[32],\"showMinMaxMessage\":[32],\"lastDispatchedValue\":[32],\"interactType\":[32]},null,{\"value\":[\"watchValue\"],\"counterid\":[\"handleId\"]}]]],[\"pn-date-picker\",[[4,\"pn-date-picker\",{\"labelFrom\":[1,\"label-from\"],\"labelTo\":[1,\"label-to\"],\"helpertext\":[1],\"start\":[1025],\"end\":[1025],\"format\":[1],\"language\":[1],\"dateId\":[1,\"date-id\"],\"name\":[1],\"placeholder\":[1],\"endPlaceholder\":[1,\"end-placeholder\"],\"autocomplete\":[1],\"list\":[1],\"listEnd\":[1,\"list-end\"],\"pattern\":[1],\"range\":[4],\"rangeLimit\":[2,\"range-limit\"],\"view\":[1025],\"calendarUp\":[4,\"calendar-up\"],\"weekNumbers\":[4,\"week-numbers\"],\"disableTypeAhead\":[4,\"disable-type-ahead\"],\"disableWeekends\":[4,\"disable-weekends\"],\"disabledDates\":[1,\"disabled-dates\"],\"disableMaxLength\":[4,\"disable-max-length\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"error\":[1],\"invalid\":[4],\"minDate\":[1025,\"min-date\"],\"maxDate\":[1025,\"max-date\"],\"open\":[32],\"openUp\":[32],\"selectingTo\":[32],\"grid\":[32],\"viewYearStart\":[32],\"dateViewYear\":[32],\"dateViewMonth\":[32],\"dateViewDate\":[32],\"showHelperSlot\":[32],\"showErrorSlot\":[32],\"isClosing\":[32],\"isExpanding\":[32]},[[9,\"resize\",\"handleResize\"]],{\"minDate\":[\"watchMin\"],\"maxDate\":[\"watchMax\"],\"start\":[\"watchValue\"],\"end\":[\"watchValueTo\"],\"format\":[\"handleFormat\"],\"id\":[\"watchId\"],\"dateViewYear\":[\"watchView\"],\"dateViewMonth\":[\"watchView\"],\"dateViewDate\":[\"watchView\"],\"open\":[\"watchOpen\"],\"helpertext\":[\"handleMessage\"],\"error\":[\"handleMessage\"],\"view\":[\"handleView\"]}]]],[\"pn-input\",[[4,\"pn-input\",{\"label\":[1],\"helpertext\":[1],\"inputid\":[1],\"value\":[1025],\"language\":[1],\"icon\":[1],\"textPrefix\":[1,\"text-prefix\"],\"textSuffix\":[1,\"text-suffix\"],\"type\":[1025],\"name\":[1],\"placeholder\":[1],\"autocomplete\":[1],\"maxlength\":[2],\"inputmode\":[1],\"list\":[1],\"pattern\":[1],\"min\":[8],\"max\":[8],\"step\":[8],\"arialabel\":[1],\"ariacontrols\":[1],\"required\":[4],\"disabled\":[4],\"readonly\":[4],\"valid\":[4],\"invalid\":[4],\"error\":[1],\"offsetLeft\":[32],\"offsetRight\":[32],\"showHelperSlot\":[32],\"showErrorSlot\":[32],\"showPassword\":[32]},null,{\"textPrefix\":[\"handleOffset\"],\"textSuffix\":[\"handleOffset\"],\"helpertext\":[\"handleMessage\"],\"error\":[\"handleMessage\"]}]]],[\"pn-modal\",[[4,\"pn-modal\",{\"label\":[1],\"helpertext\":[1],\"language\":[1],\"open\":[1540],\"persistent\":[4],\"hideClose\":[4,\"hide-close\"],\"allowOverflow\":[4,\"allow-overflow\"],\"sheet\":[4],\"maxWidth\":[1,\"max-width\"],\"isClosing\":[32],\"isOpening\":[32]},null,{\"open\":[\"handleOpen\"],\"maxWidth\":[\"handleMaxWidth\"]}]]],[\"pn-tablist\",[[4,\"pn-tablist\",{\"label\":[1],\"value\":[1537],\"small\":[4],\"stackedicons\":[4],\"language\":[1],\"showScrollArrows\":[32],\"arrowLeft\":[32],\"arrowRight\":[32]},[[0,\"setActiveTab\",\"setActiveTabHandler\"],[9,\"resize\",\"rerender\"],[0,\"tabEnter\",\"handleEnter\"],[0,\"tabLeave\",\"handleLeave\"]],{\"value\":[\"setValue\"],\"showScrollArrows\":[\"scrollHandler\"]}]]],[\"pn-footer\",[[0,\"pn-footer\",{\"market\":[1],\"language\":[1]}]]],[\"pn-header\",[[4,\"pn-header\",{\"heading\":[1],\"maxWidth\":[1,\"max-width\"],\"goBackHref\":[1,\"go-back-href\"],\"goBackText\":[1,\"go-back-text\"],\"language\":[1],\"goBackTextTranslated\":[32]},null,{\"maxWidth\":[\"setMaxWidth\"],\"language\":[\"setLanguage\"]}]]],[\"pn-tile\",[[4,\"pn-tile\",{\"label\":[1],\"text\":[1],\"url\":[1],\"target\":[1],\"rel\":[1],\"illustration\":[1],\"icon\":[1],\"horizontal\":[4],\"visibleOutline\":[32]}]]],[\"pn-toast\",[[4,\"pn-toast\",{\"heading\":[1],\"text\":[1],\"toastId\":[1,\"toast-id\"],\"appearance\":[1],\"temporary\":[4],\"icon\":[1],\"illustration\":[1],\"hide\":[1540],\"closable\":[4],\"language\":[1025],\"isClosing\":[32],\"isExpanding\":[32],\"hasSlottedContent\":[32]},null,{\"hide\":[\"handleHide\"]}]]],[\"pn-accordion-row\",[[4,\"pn-accordion-row\",{\"label\":[1025],\"state\":[1028],\"buttonid\":[1],\"contentid\":[1],\"transparent\":[4],\"isClosing\":[32],\"isExpanding\":[32]},[[0,\"rowstate\",\"handleRowState\"]]]]],[\"pn-checkbox\",[[0,\"pn-checkbox\",{\"label\":[1],\"value\":[513],\"name\":[1],\"checked\":[4],\"helpertext\":[1],\"checkboxid\":[1],\"disabled\":[4],\"required\":[4],\"invalid\":[4],\"indeterminate\":[1028],\"tile\":[4],\"icon\":[1]},[[0,\"change\",\"handlechange\"]],{\"checkboxid\":[\"handleId\"]}]]],[\"pn-read-only-button\",[[4,\"pn-read-only-button\",{\"icon\":[1],\"leftIcon\":[4,\"left-icon\"],\"iconOnly\":[4,\"icon-only\"],\"small\":[4],\"language\":[1],\"readOnlyModeText\":[32],\"tooltipOpen\":[32],\"tooltipEl\":[32],\"tooltipDx\":[32]},null,{\"language\":[\"setReadOnlyModeText\"],\"tooltipOpen\":[\"openHandler\"]}]]],[\"pn-segmented-control\",[[4,\"pn-segmented-control\",{\"name\":[1],\"value\":[1025],\"showScrollArrows\":[32],\"showLeftArrow\":[32],\"showRightArrow\":[32]},[[0,\"change\",\"changeHandler\"],[9,\"resize\",\"handleResize\"],[0,\"segmentHover\",\"handleHover\"]],{\"value\":[\"valueHandler\"]}]]],[\"pn-tooltip\",[[4,\"pn-tooltip\",{\"warning\":[4],\"light\":[4],\"tooltip\":[1],\"downwards\":[32],\"open\":[32],\"deltaX\":[32]},null,{\"open\":[\"openHandler\"]}]]],[\"pn-accordion\",[[4,\"pn-accordion\",{\"single\":[4],\"transparent\":[4]},[[0,\"togglerow\",\"handleSingleRow\"]]]]],[\"pn-icon_2\",[[0,\"pn-tag\",{\"label\":[1],\"icon\":[1],\"appearance\":[1],\"dark\":[4],\"large\":[4],\"small\":[4],\"xsmall\":[4]}],[0,\"pn-icon\",{\"icon\":[1],\"small\":[516],\"color\":[1]},null,{\"color\":[\"handleColor\"]}]]],[\"pn-card\",[[4,\"pn-card\",{\"label\":[1],\"labelTag\":[1,\"label-tag\"],\"overline\":[1],\"text\":[1],\"cardId\":[1,\"card-id\"],\"horizontal\":[4],\"reverse\":[4],\"aspectRatio\":[1,\"aspect-ratio\"],\"href\":[1],\"hrefLabel\":[1,\"href-label\"],\"target\":[1],\"rel\":[1],\"icon\":[1],\"visibleOutline\":[32]},null,{\"cardId\":[\"watchCardId\"]}]]],[\"pn-choice-chip\",[[4,\"pn-choice-chip\",{\"label\":[1],\"value\":[513],\"name\":[1],\"checked\":[1028],\"radio\":[4],\"choiceid\":[1],\"icon\":[1],\"required\":[4],\"disabled\":[4],\"small\":[4],\"large\":[4],\"moving\":[32]}]]],[\"pn-fieldset\",[[4,\"pn-fieldset\",{\"legend\":[1],\"helpertext\":[1],\"fieldsetId\":[1,\"fieldset-id\"],\"form\":[1],\"name\":[1],\"disabled\":[4],\"invalid\":[4],\"error\":[1]},null,{\"fieldsetId\":[\"handleId\"]}]]],[\"pn-multiselect\",[[4,\"pn-multiselect\",{\"label\":[1],\"helpertext\":[1],\"placeholder\":[1],\"name\":[1],\"selectId\":[1,\"select-id\"],\"selectName\":[1,\"select-name\"],\"icon\":[1],\"language\":[1],\"options\":[1040],\"selectAll\":[4,\"select-all\"],\"allValue\":[1,\"all-value\"],\"search\":[4],\"searchQuery\":[1025,\"search-query\"],\"itemCount\":[2,\"item-count\"],\"maxHeight\":[1,\"max-height\"],\"top\":[4],\"bottom\":[4],\"required\":[4],\"disabled\":[4],\"invalid\":[4],\"error\":[1],\"isSearching\":[32],\"open\":[32],\"upwards\":[32],\"srMessage\":[32],\"isClosing\":[32],\"isExpanding\":[32]},[[9,\"resize\",\"handleResize\"]],{\"open\":[\"handleOpen\"],\"search\":[\"handleSearch\"],\"searchQuery\":[\"handleSearchQuery\"],\"selectId\":[\"handleSelectId\"]}]]],[\"pn-page-nav\",[[4,\"pn-page-nav\",{\"value\":[1025],\"dropdown\":[8],\"navid\":[1],\"currentSelection\":[32],\"showScrollArrows\":[32],\"showLeftArrow\":[32],\"showRightArrow\":[32],\"dropdownOpen\":[32],\"dropdownLinks\":[32],\"dropdownActive\":[32]},[[0,\"itemselection\",\"changeHandler\"],[9,\"resize\",\"handleResize\"]],{\"value\":[\"valueHandler\"],\"dropdownOpen\":[\"dropdownHandler\"]}]]],[\"pn-page-nav-dropdown-item\",[[4,\"pn-page-nav-dropdown-item\",{\"value\":[1],\"href\":[1],\"active\":[4]}]]],[\"pn-page-nav-item\",[[4,\"pn-page-nav-item\",{\"value\":[1],\"href\":[1],\"icon\":[1]}]]],[\"pn-radio-button\",[[0,\"pn-radio-button\",{\"label\":[1],\"value\":[513],\"name\":[1],\"checked\":[4],\"helpertext\":[1],\"radioid\":[1],\"disabled\":[4],\"required\":[4],\"invalid\":[4],\"tile\":[4],\"icon\":[1]},null,{\"radioid\":[\"handleId\"]}]]],[\"pn-segment\",[[4,\"pn-segment\",{\"label\":[1],\"name\":[1],\"value\":[1],\"selected\":[4],\"segmentid\":[1],\"icon\":[1],\"disabled\":[4]}]]],[\"pn-tab\",[[4,\"pn-tab\",{\"label\":[1],\"value\":[1],\"href\":[1],\"icon\":[1],\"ariacontrols\":[1],\"tabid\":[1],\"activeTab\":[1,\"active-tab\"]}]]],[\"pn-button_2\",[[4,\"pn-button\",{\"label\":[1],\"appearance\":[1],\"variant\":[1],\"small\":[4],\"loading\":[516],\"icon\":[1],\"iconOnly\":[4,\"icon-only\"],\"leftIcon\":[4,\"left-icon\"],\"tooltip\":[1],\"tooltipUp\":[4,\"tooltip-up\"],\"type\":[1],\"form\":[1],\"href\":[1],\"rel\":[1],\"target\":[1],\"download\":[1],\"buttonId\":[1,\"button-id\"],\"arialabel\":[1],\"arialabelledby\":[1],\"ariacurrent\":[1],\"ariacontrols\":[1],\"ariapressed\":[1],\"ariahaspopup\":[1],\"ariaexpanded\":[1],\"noTab\":[4,\"no-tab\"],\"tooltipOpen\":[32],\"tooltipUpwards\":[32]},null,{\"tooltipOpen\":[\"openHandler\"],\"tooltip\":[\"iconOnlyHandler\"]}],[0,\"pn-spinner\",{\"light\":[4],\"size\":[2]}]]],[\"pn-toggle-switch\",[[4,\"pn-toggle-switch\",{\"label\":[1],\"helpertext\":[1],\"checked\":[1028],\"toggleid\":[1],\"name\":[1],\"value\":[1],\"small\":[4],\"large\":[4],\"disabled\":[4],\"loading\":[4]},null,{\"toggleid\":[\"handleHelperId\"]}]]],[\"pn-progress-indicator\",[[4,\"pn-progress-indicator\",{\"activeStep\":[1026,\"active-step\"]},[[0,\"setactivestep\",\"setActiveStepHandler\"]]]]],[\"pn-progress-indicator-step\",[[4,\"pn-progress-indicator-step\",{\"activeStep\":[2,\"active-step\"],\"index\":[2],\"name\":[1],\"checked\":[4],\"active\":[1],\"activated\":[32],\"done\":[32]}]]],[\"pn-progress-stepper\",[[0,\"pn-progress-stepper\",{\"label\":[1025],\"totalSteps\":[1026,\"total-steps\"],\"currentStep\":[1026,\"current-step\"],\"stepName\":[1,\"step-name\"],\"progressStepperId\":[1,\"progress-stepper-id\"],\"language\":[1],\"progressValue\":[32]},null,{\"currentStep\":[\"validateCurrentStep\"],\"totalSteps\":[\"validateTotalSteps\"],\"language\":[\"watchLanguage\"],\"progressStepperId\":[\"watchId\"]}]]],[\"pn-table\",[[4,\"pn-table\",{\"gray\":[4],\"bordered\":[4],\"striped\":[4]}]]],[\"pn-textarea\",[[0,\"pn-textarea\",{\"label\":[1],\"value\":[1],\"helpertext\":[1],\"textareaid\":[1],\"name\":[1],\"form\":[1],\"rows\":[2],\"cols\":[2],\"wrap\":[1],\"maxlength\":[2],\"autocomplete\":[1],\"spellcheck\":[4],\"placeholder\":[1],\"resize\":[4],\"required\":[4],\"valid\":[4],\"invalid\":[4],\"error\":[1],\"disabled\":[4],\"readonly\":[4],\"content\":[32]}]]],[\"pn-progress-bar\",[[0,\"pn-progress-bar\",{\"label\":[1],\"progress\":[2],\"progressText\":[1,\"progress-text\"],\"successText\":[1,\"success-text\"],\"error\":[1],\"progressId\":[1,\"progress-id\"],\"progressPercentage\":[32]},null,{\"progress\":[\"setProgress\"]}]]],[\"pn-select\",[[4,\"pn-select\",{\"label\":[1],\"helpertext\":[1],\"selectId\":[1,\"select-id\"],\"icon\":[1],\"name\":[1],\"form\":[1],\"autocomplete\":[1],\"required\":[4],\"disabled\":[4],\"invalid\":[4],\"error\":[1]}]]],[\"pn-search-field\",[[0,\"pn-search-field\",{\"label\":[1],\"value\":[1025],\"placeholder\":[1],\"searchid\":[1],\"name\":[1],\"autocomplete\":[1],\"list\":[1],\"language\":[1],\"disabled\":[4],\"required\":[4],\"loading\":[4],\"button\":[1],\"buttonLabel\":[1,\"button-label\"],\"buttonLight\":[4,\"button-light\"]},[[0,\"input\",\"inputHandler\"]]]]],[\"pn-text-link\",[[4,\"pn-text-link\",{\"label\":[1],\"href\":[1],\"light\":[4],\"icon\":[1],\"leftIcon\":[4,\"left-icon\"],\"download\":[1],\"hreflang\":[1],\"media\":[1],\"referrerpolicy\":[1],\"rel\":[1],\"target\":[1],\"linkid\":[1]}]]],[\"pn-illustration\",[[0,\"pn-illustration\",{\"illustration\":[1],\"width\":[1025],\"height\":[1025],\"fill\":[4]},null,{\"fill\":[\"handleFill\"]}]]]]"), options);
+  return bootstrapLazy(JSON.parse("[[\"pn-file-upload\",[[4,\"pn-file-upload\",{\"label\":[1],\"helpertext\":[1],\"language\":[1],\"hideProgress\":[4,\"hide-progress\"],\"name\":[1],\"accept\":[1],\"maxSize\":[1,\"max-size\"],\"capture\":[1],\"limit\":[2],\"multiple\":[1028],\"required\":[4],\"disabled\":[4],\"files\":[32],\"isHovering\":[32],\"startUpload\":[64],\"clearUpload\":[64],\"removeFile\":[64],\"updateFile\":[64]},null,{\"limit\":[\"handleLimit\"],\"maxSize\":[\"handleMaxBytes\"]}]]],[\"pn-ocr-search\",[[0,\"pn-ocr-search\",{\"language\":[1],\"loading\":[32],\"error\":[32],\"ocrNumber\":[32],\"searchSuccess\":[32],\"invalidOcrNumber\":[32]}]]],[\"pn-pagination\",[[0,\"pn-pagination\",{\"label\":[1],\"urlTemplate\":[1,\"url-template\"],\"paginationId\":[1,\"pagination-id\"],\"language\":[1],\"page\":[1538],\"pages\":[1026],\"pagesVisible\":[1026,\"pages-visible\"],\"rows\":[1026],\"rowsList\":[1,\"rows-list\"],\"rowsLabel\":[1,\"rows-label\"],\"list\":[32]},null,{\"page\":[\"handlePage\"],\"pages\":[\"handlePages\"],\"pagesVisible\":[\"handlePagesVisible\"]}]]],[\"pn-zipcode-search\",[[0,\"pn-zipcode-search\",{\"language\":[1],\"value\":[1025],\"validZipCode\":[32],\"loading\":[32],\"showResult\":[32],\"zipCodeSearchResult\":[32],\"error\":[32],\"errorMessage\":[32]}]]],[\"pn-action-menu\",[[0,\"pn-action-menu\",{\"options\":[16],\"button\":[16],\"menuId\":[1,\"menu-id\"],\"language\":[1025],\"open\":[1540],\"menuUp\":[4,\"menu-up\"],\"menuLeft\":[4,\"menu-left\"],\"smallMenu\":[32],\"upwards\":[32],\"activeSubmenu\":[32],\"isClosing\":[32],\"isExpanding\":[32]},[[9,\"resize\",\"handleResize\"]],{\"options\":[\"handleOptions\"],\"open\":[\"openHandler\"],\"menuId\":[\"handleMenuId\"]}]]],[\"pn-button-dropdown\",[[4,\"pn-button-dropdown\",{\"label\":[1],\"icon\":[1],\"appearance\":[1],\"variant\":[1],\"small\":[4],\"tooltip\":[1],\"open\":[1540],\"right\":[32],\"top\":[32]},null,{\"open\":[\"openHandler\"]}]]],[\"pn-counter\",[[0,\"pn-counter\",{\"label\":[1],\"helpertext\":[1],\"value\":[1538],\"counterid\":[1],\"language\":[1],\"labelDecrease\":[1,\"label-decrease\"],\"labelIncrease\":[1,\"label-increase\"],\"minMessage\":[1,\"min-message\"],\"maxMessage\":[1,\"max-message\"],\"name\":[1],\"min\":[2],\"max\":[2],\"step\":[2],\"list\":[1],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"clearAriaTimer\":[32],\"displaySrValue\":[32],\"showMinMaxMessage\":[32],\"lastDispatchedValue\":[32],\"interactType\":[32]},null,{\"value\":[\"watchValue\"],\"counterid\":[\"handleId\"]}]]],[\"pn-date-picker\",[[4,\"pn-date-picker\",{\"labelFrom\":[1,\"label-from\"],\"labelTo\":[1,\"label-to\"],\"helpertext\":[1],\"start\":[1025],\"end\":[1025],\"format\":[1],\"language\":[1],\"dateId\":[1,\"date-id\"],\"name\":[1],\"placeholder\":[1],\"endPlaceholder\":[1,\"end-placeholder\"],\"autocomplete\":[1],\"list\":[1],\"listEnd\":[1,\"list-end\"],\"pattern\":[1],\"range\":[4],\"rangeLimit\":[2,\"range-limit\"],\"view\":[1025],\"calendarUp\":[4,\"calendar-up\"],\"weekNumbers\":[4,\"week-numbers\"],\"disableTypeAhead\":[4,\"disable-type-ahead\"],\"disableWeekends\":[4,\"disable-weekends\"],\"disabledDates\":[1,\"disabled-dates\"],\"disableMaxLength\":[4,\"disable-max-length\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"error\":[1],\"invalid\":[4],\"minDate\":[1025,\"min-date\"],\"maxDate\":[1025,\"max-date\"],\"open\":[32],\"openUp\":[32],\"selectingTo\":[32],\"grid\":[32],\"viewYearStart\":[32],\"dateViewYear\":[32],\"dateViewMonth\":[32],\"dateViewDate\":[32],\"showHelperSlot\":[32],\"showErrorSlot\":[32],\"isClosing\":[32],\"isExpanding\":[32]},[[9,\"resize\",\"handleResize\"]],{\"minDate\":[\"watchMin\"],\"maxDate\":[\"watchMax\"],\"start\":[\"watchValue\"],\"end\":[\"watchValueTo\"],\"format\":[\"handleFormat\"],\"id\":[\"watchId\"],\"dateViewYear\":[\"watchView\"],\"dateViewMonth\":[\"watchView\"],\"dateViewDate\":[\"watchView\"],\"open\":[\"watchOpen\"],\"helpertext\":[\"handleMessage\"],\"error\":[\"handleMessage\"],\"view\":[\"handleView\"]}]]],[\"pn-input\",[[4,\"pn-input\",{\"label\":[1],\"helpertext\":[1],\"inputid\":[1],\"value\":[1025],\"language\":[1],\"icon\":[1],\"textPrefix\":[1,\"text-prefix\"],\"textSuffix\":[1,\"text-suffix\"],\"type\":[1025],\"name\":[1],\"placeholder\":[1],\"autocomplete\":[1],\"maxlength\":[2],\"inputmode\":[1],\"list\":[1],\"pattern\":[1],\"min\":[8],\"max\":[8],\"step\":[8],\"arialabel\":[1],\"ariacontrols\":[1],\"required\":[4],\"disabled\":[4],\"readonly\":[4],\"valid\":[4],\"invalid\":[4],\"error\":[1],\"offsetLeft\":[32],\"offsetRight\":[32],\"showHelperSlot\":[32],\"showErrorSlot\":[32],\"showPassword\":[32]},null,{\"textPrefix\":[\"handleOffset\"],\"textSuffix\":[\"handleOffset\"],\"helpertext\":[\"handleMessage\"],\"error\":[\"handleMessage\"]}]]],[\"pn-modal\",[[4,\"pn-modal\",{\"label\":[1],\"helpertext\":[1],\"language\":[1],\"open\":[1540],\"persistent\":[4],\"hideClose\":[4,\"hide-close\"],\"allowOverflow\":[4,\"allow-overflow\"],\"sheet\":[4],\"maxWidth\":[1,\"max-width\"],\"isClosing\":[32],\"isOpening\":[32],\"removeOverflow\":[32]},[[9,\"resize\",\"handleOverflow\"]],{\"open\":[\"handleOpen\"],\"maxWidth\":[\"handleMaxWidth\"]}]]],[\"pn-tablist\",[[4,\"pn-tablist\",{\"label\":[1],\"value\":[1537],\"small\":[4],\"stackedicons\":[4],\"language\":[1],\"showScrollArrows\":[32],\"arrowLeft\":[32],\"arrowRight\":[32]},[[0,\"setActiveTab\",\"setActiveTabHandler\"],[9,\"resize\",\"rerender\"],[0,\"tabEnter\",\"handleEnter\"],[0,\"tabLeave\",\"handleLeave\"]],{\"value\":[\"setValue\"],\"showScrollArrows\":[\"scrollHandler\"]}]]],[\"pn-footer\",[[0,\"pn-footer\",{\"market\":[1],\"language\":[1]}]]],[\"pn-header\",[[4,\"pn-header\",{\"heading\":[1],\"maxWidth\":[1,\"max-width\"],\"goBackHref\":[1,\"go-back-href\"],\"goBackText\":[1,\"go-back-text\"],\"language\":[1],\"goBackTextTranslated\":[32]},null,{\"maxWidth\":[\"setMaxWidth\"],\"language\":[\"setLanguage\"]}]]],[\"pn-tile\",[[4,\"pn-tile\",{\"label\":[1],\"text\":[1],\"url\":[1],\"target\":[1],\"rel\":[1],\"illustration\":[1],\"icon\":[1],\"horizontal\":[4],\"visibleOutline\":[32]}]]],[\"pn-toast\",[[4,\"pn-toast\",{\"heading\":[1],\"text\":[1],\"toastId\":[1,\"toast-id\"],\"appearance\":[1],\"temporary\":[4],\"icon\":[1],\"illustration\":[1],\"hide\":[1540],\"closable\":[4],\"language\":[1025],\"isClosing\":[32],\"isExpanding\":[32],\"hasSlottedContent\":[32]},null,{\"hide\":[\"handleHide\"]}]]],[\"pn-accordion-row\",[[4,\"pn-accordion-row\",{\"label\":[1025],\"state\":[1028],\"buttonid\":[1],\"contentid\":[1],\"transparent\":[4],\"isClosing\":[32],\"isExpanding\":[32]},[[0,\"rowstate\",\"handleRowState\"]]]]],[\"pn-checkbox\",[[0,\"pn-checkbox\",{\"label\":[1],\"value\":[513],\"name\":[1],\"checked\":[4],\"helpertext\":[1],\"checkboxid\":[1],\"disabled\":[4],\"required\":[4],\"invalid\":[4],\"indeterminate\":[1028],\"tile\":[4],\"icon\":[1]},[[0,\"change\",\"handlechange\"]],{\"checkboxid\":[\"handleId\"]}]]],[\"pn-read-only-button\",[[4,\"pn-read-only-button\",{\"icon\":[1],\"leftIcon\":[4,\"left-icon\"],\"iconOnly\":[4,\"icon-only\"],\"small\":[4],\"language\":[1],\"readOnlyModeText\":[32],\"tooltipOpen\":[32],\"tooltipEl\":[32],\"tooltipDx\":[32]},null,{\"language\":[\"setReadOnlyModeText\"],\"tooltipOpen\":[\"openHandler\"]}]]],[\"pn-segmented-control\",[[4,\"pn-segmented-control\",{\"name\":[1],\"value\":[1025],\"showScrollArrows\":[32],\"showLeftArrow\":[32],\"showRightArrow\":[32]},[[0,\"change\",\"changeHandler\"],[9,\"resize\",\"handleResize\"],[0,\"segmentHover\",\"handleHover\"]],{\"value\":[\"valueHandler\"]}]]],[\"pn-tooltip\",[[4,\"pn-tooltip\",{\"warning\":[4],\"light\":[4],\"tooltip\":[1],\"downwards\":[32],\"open\":[32],\"deltaX\":[32]},null,{\"open\":[\"openHandler\"]}]]],[\"pn-accordion\",[[4,\"pn-accordion\",{\"single\":[4],\"transparent\":[4]},[[0,\"togglerow\",\"handleSingleRow\"]]]]],[\"pn-icon_2\",[[0,\"pn-tag\",{\"label\":[1],\"icon\":[1],\"appearance\":[1],\"dark\":[4],\"large\":[4],\"small\":[4],\"xsmall\":[4]}],[0,\"pn-icon\",{\"icon\":[1],\"small\":[516],\"color\":[1]},null,{\"color\":[\"handleColor\"]}]]],[\"pn-card\",[[4,\"pn-card\",{\"label\":[1],\"labelTag\":[1,\"label-tag\"],\"overline\":[1],\"text\":[1],\"cardId\":[1,\"card-id\"],\"horizontal\":[4],\"reverse\":[4],\"aspectRatio\":[1,\"aspect-ratio\"],\"href\":[1],\"hrefLabel\":[1,\"href-label\"],\"target\":[1],\"rel\":[1],\"icon\":[1],\"visibleOutline\":[32]},null,{\"cardId\":[\"watchCardId\"]}]]],[\"pn-choice-chip\",[[4,\"pn-choice-chip\",{\"label\":[1],\"value\":[513],\"name\":[1],\"checked\":[1028],\"radio\":[4],\"choiceid\":[1],\"icon\":[1],\"required\":[4],\"disabled\":[4],\"small\":[4],\"large\":[4],\"moving\":[32]}]]],[\"pn-fieldset\",[[4,\"pn-fieldset\",{\"legend\":[1],\"helpertext\":[1],\"fieldsetId\":[1,\"fieldset-id\"],\"form\":[1],\"name\":[1],\"disabled\":[4],\"invalid\":[4],\"error\":[1]},null,{\"fieldsetId\":[\"handleId\"]}]]],[\"pn-multiselect\",[[4,\"pn-multiselect\",{\"label\":[1],\"helpertext\":[1],\"placeholder\":[1],\"name\":[1],\"selectId\":[1,\"select-id\"],\"selectName\":[1,\"select-name\"],\"icon\":[1],\"language\":[1],\"options\":[1040],\"selectAll\":[4,\"select-all\"],\"allValue\":[1,\"all-value\"],\"search\":[4],\"searchQuery\":[1025,\"search-query\"],\"itemCount\":[2,\"item-count\"],\"maxHeight\":[1,\"max-height\"],\"top\":[4],\"bottom\":[4],\"required\":[4],\"disabled\":[4],\"invalid\":[4],\"error\":[1],\"isSearching\":[32],\"open\":[32],\"upwards\":[32],\"srMessage\":[32],\"isClosing\":[32],\"isExpanding\":[32]},[[9,\"resize\",\"handleResize\"]],{\"open\":[\"handleOpen\"],\"search\":[\"handleSearch\"],\"searchQuery\":[\"handleSearchQuery\"],\"selectId\":[\"handleSelectId\"]}]]],[\"pn-page-nav\",[[4,\"pn-page-nav\",{\"value\":[1025],\"dropdown\":[8],\"navid\":[1],\"currentSelection\":[32],\"showScrollArrows\":[32],\"showLeftArrow\":[32],\"showRightArrow\":[32],\"dropdownOpen\":[32],\"dropdownLinks\":[32],\"dropdownActive\":[32]},[[0,\"itemselection\",\"changeHandler\"],[9,\"resize\",\"handleResize\"]],{\"value\":[\"valueHandler\"],\"dropdownOpen\":[\"dropdownHandler\"]}]]],[\"pn-page-nav-dropdown-item\",[[4,\"pn-page-nav-dropdown-item\",{\"value\":[1],\"href\":[1],\"active\":[4]}]]],[\"pn-page-nav-item\",[[4,\"pn-page-nav-item\",{\"value\":[1],\"href\":[1],\"icon\":[1]}]]],[\"pn-radio-button\",[[0,\"pn-radio-button\",{\"label\":[1],\"value\":[513],\"name\":[1],\"checked\":[4],\"helpertext\":[1],\"radioid\":[1],\"disabled\":[4],\"required\":[4],\"invalid\":[4],\"tile\":[4],\"icon\":[1]},null,{\"radioid\":[\"handleId\"]}]]],[\"pn-segment\",[[4,\"pn-segment\",{\"label\":[1],\"name\":[1],\"value\":[1],\"selected\":[4],\"segmentid\":[1],\"icon\":[1],\"disabled\":[4]}]]],[\"pn-tab\",[[4,\"pn-tab\",{\"label\":[1],\"value\":[1],\"href\":[1],\"icon\":[1],\"ariacontrols\":[1],\"tabid\":[1],\"activeTab\":[1,\"active-tab\"]}]]],[\"pn-button_2\",[[4,\"pn-button\",{\"label\":[1],\"appearance\":[1],\"variant\":[1],\"small\":[4],\"loading\":[516],\"icon\":[1],\"iconOnly\":[4,\"icon-only\"],\"leftIcon\":[4,\"left-icon\"],\"tooltip\":[1],\"tooltipUp\":[4,\"tooltip-up\"],\"type\":[1],\"form\":[1],\"href\":[1],\"rel\":[1],\"target\":[1],\"download\":[1],\"buttonId\":[1,\"button-id\"],\"arialabel\":[1],\"arialabelledby\":[1],\"ariacurrent\":[1],\"ariacontrols\":[1],\"ariapressed\":[1],\"ariahaspopup\":[1],\"ariaexpanded\":[1],\"noTab\":[4,\"no-tab\"],\"tooltipOpen\":[32],\"tooltipUpwards\":[32]},null,{\"tooltipOpen\":[\"openHandler\"],\"tooltip\":[\"iconOnlyHandler\"]}],[0,\"pn-spinner\",{\"light\":[4],\"size\":[2]}]]],[\"pn-toggle-switch\",[[4,\"pn-toggle-switch\",{\"label\":[1],\"helpertext\":[1],\"checked\":[1028],\"toggleid\":[1],\"name\":[1],\"value\":[1],\"small\":[4],\"large\":[4],\"disabled\":[4],\"loading\":[4]},null,{\"toggleid\":[\"handleHelperId\"]}]]],[\"pn-progress-indicator\",[[4,\"pn-progress-indicator\",{\"activeStep\":[1026,\"active-step\"]},[[0,\"setactivestep\",\"setActiveStepHandler\"]]]]],[\"pn-progress-indicator-step\",[[4,\"pn-progress-indicator-step\",{\"activeStep\":[2,\"active-step\"],\"index\":[2],\"name\":[1],\"checked\":[4],\"active\":[1],\"activated\":[32],\"done\":[32]}]]],[\"pn-progress-stepper\",[[0,\"pn-progress-stepper\",{\"label\":[1],\"progressStepperId\":[1,\"progress-stepper-id\"],\"language\":[1],\"totalSteps\":[1026,\"total-steps\"],\"currentStep\":[1026,\"current-step\"],\"stepName\":[1,\"step-name\"],\"dots\":[4],\"builtInLabel\":[32],\"progressValue\":[32]},null,{\"currentStep\":[\"stepWatchers\"],\"totalSteps\":[\"stepWatchers\"],\"language\":[\"watchLanguage\"]}]]],[\"pn-table\",[[4,\"pn-table\",{\"gray\":[4],\"bordered\":[4],\"striped\":[4]}]]],[\"pn-textarea\",[[0,\"pn-textarea\",{\"label\":[1],\"value\":[1],\"helpertext\":[1],\"textareaid\":[1],\"name\":[1],\"form\":[1],\"rows\":[2],\"cols\":[2],\"wrap\":[1],\"maxlength\":[2],\"autocomplete\":[1],\"spellcheck\":[4],\"placeholder\":[1],\"resize\":[4],\"required\":[4],\"valid\":[4],\"invalid\":[4],\"error\":[1],\"disabled\":[4],\"readonly\":[4],\"content\":[32]}]]],[\"pn-progress-bar\",[[0,\"pn-progress-bar\",{\"label\":[1],\"progress\":[2],\"progressText\":[1,\"progress-text\"],\"successText\":[1,\"success-text\"],\"error\":[1],\"progressId\":[1,\"progress-id\"],\"progressPercentage\":[32]},null,{\"progress\":[\"setProgress\"]}]]],[\"pn-select\",[[4,\"pn-select\",{\"label\":[1],\"helpertext\":[1],\"selectId\":[1,\"select-id\"],\"icon\":[1],\"name\":[1],\"form\":[1],\"autocomplete\":[1],\"required\":[4],\"disabled\":[4],\"invalid\":[4],\"error\":[1]}]]],[\"pn-search-field\",[[0,\"pn-search-field\",{\"label\":[1],\"value\":[1025],\"placeholder\":[1],\"searchid\":[1],\"name\":[1],\"autocomplete\":[1],\"list\":[1],\"language\":[1],\"disabled\":[4],\"required\":[4],\"loading\":[4],\"button\":[1],\"buttonLabel\":[1,\"button-label\"],\"buttonLight\":[4,\"button-light\"]},[[0,\"input\",\"inputHandler\"]]]]],[\"pn-text-link\",[[4,\"pn-text-link\",{\"label\":[1],\"href\":[1],\"light\":[4],\"icon\":[1],\"leftIcon\":[4,\"left-icon\"],\"download\":[1],\"hreflang\":[1],\"media\":[1],\"referrerpolicy\":[1],\"rel\":[1],\"target\":[1],\"linkid\":[1]}]]],[\"pn-illustration\",[[0,\"pn-illustration\",{\"illustration\":[1],\"width\":[1025],\"height\":[1025],\"fill\":[4]},null,{\"fill\":[\"handleFill\"]}]]]]"), options);
 };
 
 export { defineCustomElements };

package/umd/modules/@postnord/web-components/esm/pn-accordion-row.entry.js

@@ -3,7 +3,7 @@
  * By PostNord.
  */
 import { r as registerInstance, c as createEvent, g as getElement, h, a as Host } from './index-5606614b.js';
-import { a as angle_down } from './angle_down-d788f691.js';
+import { c as chevron_down } from './chevron_down-6e3fb42f.js';
 import { o as ripple, r as reduceMotion } from './helpers-9dac5241.js';
 
 const pnAccordionRowCss = "pn-accordion-row{position:relative;margin:0 -0.25em 0}pn-accordion-row .pn-accordion-row{width:100%;display:flex;flex-direction:column}pn-accordion-row .pn-accordion-row-summary{color:#2d2013;position:relative;border:none;outline:0;cursor:pointer;-webkit-tap-highlight-color:transparent;width:100%;padding:0.25em;font-size:1em;font-weight:400;border-radius:0.5em;list-style:none}pn-accordion-row .pn-accordion-row-summary:hover>.pn-accordion-row-text{background-color:#e0f8ff}pn-accordion-row .pn-accordion-row-summary:focus-visible>.pn-accordion-row-text{outline-color:#005d92}pn-accordion-row .pn-accordion-row-summary::-webkit-details-marker{display:none}pn-accordion-row .pn-accordion-row-text{position:relative;overflow:hidden;display:flex;align-items:center;padding:0.75em;background-color:#ffffff;border-radius:0.5em;-webkit-tap-highlight-color:transparent;outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}pn-accordion-row .pn-accordion-row-text[data-transparent]{background-color:transparent}@media (prefers-reduced-motion: reduce){pn-accordion-row .pn-accordion-row-text{transition-duration:0s;transition-delay:0s}}pn-accordion-row .pn-accordion-row-text .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}}pn-accordion-row .pn-accordion-row-icon{margin-left:auto;flex-shrink:0;transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-accordion-row .pn-accordion-row-icon{transition-duration:0s;transition-delay:0s}}pn-accordion-row .pn-accordion-row-icon path{fill:#005d92}pn-accordion-row .pn-accordion-row[open] .pn-accordion-row-icon{transform:rotate(-180deg)}pn-accordion-row .pn-accordion-row-content{color:#2d2013;display:block;padding:1em}";
@@ -108,7 +108,7 @@ const PnAccordionRow = class {
             this.animation.cancel();
     }
     render() {
-        return (h(Host, { key: '9f3142a471217bc0656c4d5641c420262a913c13' }, h("details", { key: 'c742d23b97fe2d489166f18f53b3e5f0d12107d8', class: "pn-accordion-row", open: this.state, ref: (el) => (this.details = el) }, h("summary", { key: 'd061093bf3bb58150d4bbb102caf9da3e9559fb8', id: this.buttonid, class: "pn-accordion-row-summary", onClick: e => this.clickHandler(e), ref: el => (this.summary = el) }, h("div", { key: '921e67cc639e701df60a7bc359d3415ccdec39e3', class: "pn-accordion-row-text", "data-transparent": this.transparent }, this.label ? this.label : '', h("slot", { key: 'e355acdeeb2e62e4056837b26f808d3e5663343e', name: "label" }), h("pn-icon", { key: 'c10681330981f5d019db4d6f7f6cd03d3c67234b', class: "pn-accordion-row-icon", icon: angle_down }))), h("div", { key: 'ddb95ef323966c0c55292dde2b5776e0700bf27a', id: this.contentid, class: "pn-accordion-row-content", ref: (el) => (this.content = el) }, h("slot", { key: 'e0ded60210d472842a8aa5cd87a6374ad7120e58' })))));
+        return (h(Host, { key: '0dcedaab706f95589734c04230abbdbeca16cdf1' }, h("details", { key: '58bead8dce64594af81aae11a42beea75ba0db88', class: "pn-accordion-row", open: this.state, ref: (el) => (this.details = el) }, h("summary", { key: '7447539647210cb5b132ce16d7019e310c8ca1f4', id: this.buttonid, class: "pn-accordion-row-summary", onClick: e => this.clickHandler(e), ref: el => (this.summary = el) }, h("div", { key: '83c87346e27703cab3203920848691fc8d3d007f', class: "pn-accordion-row-text", "data-transparent": this.transparent }, this.label ? this.label : '', h("slot", { key: '8904be6cbec811925b0fa935ed10c4b7bc12fb5d', name: "label" }), h("pn-icon", { key: 'cf71062d11b3a20c106dec2bec2aab1dc4bf0c7f', class: "pn-accordion-row-icon", icon: chevron_down }))), h("div", { key: 'ae73f9fa6e7121352979ec2dad9a4620cff58a91', id: this.contentid, class: "pn-accordion-row-content", ref: (el) => (this.content = el) }, h("slot", { key: '4d7d894af656c1b7e95028832611530d04f3d439' })))));
     }
 };
 PnAccordionRow.style = PnAccordionRowStyle0;

package/umd/modules/@postnord/web-components/esm/pn-accordion-row.entry.js.map

@@ -1 +1 @@
-{"file":"pn-accordion-row.entry.js","mappings":"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","names":[],"sources":["src/components/content/pn-accordion/row/pn-accordion-row.scss?tag=pn-accordion-row","src/components/content/pn-accordion/row/pn-accordion-row.tsx"],"sourcesContent":["@use 'src/globals/main';\n\npn-accordion-row {\n  position: relative;\n  margin: 0 -0.25em 0;\n}\n\npn-accordion-row .pn-accordion-row {\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n\n  &-summary {\n    color: main.$gray900;\n    position: relative;\n    border: none;\n    outline: 0;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n\n    width: 100%;\n    padding: 0.25em;\n    font-size: 1em;\n    font-weight: 400;\n    border-radius: 0.5em;\n\n    list-style: none;\n\n    &:hover > .pn-accordion-row-text {\n      background-color: main.$blue50;\n    }\n\n    &:focus-visible > .pn-accordion-row-text {\n      @include main.pn-focus-visible();\n    }\n\n    &::-webkit-details-marker {\n      display: none;\n    }\n  }\n\n  &-text {\n    position: relative;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    padding: 0.75em;\n    background-color: main.$white;\n    border-radius: 0.5em;\n    -webkit-tap-highlight-color: transparent;\n\n    &[data-transparent] {\n      background-color: transparent;\n    }\n\n    @include main.pn-focus-base();\n    @include main.pn-transition('background-color, outline-color');\n    @include main.pn-ripple(main.$blue700);\n  }\n\n  &-icon {\n    margin-left: auto;\n    flex-shrink: 0;\n    @include main.pn-transition('transform');\n    path {\n      fill: main.$blue700;\n    }\n  }\n\n  &[open] .pn-accordion-row-icon {\n    transform: rotate(-180deg);\n  }\n\n  &-content {\n    color: main.$gray900;\n    display: block;\n    padding: 1em;\n  }\n}\n","import { Component, h, Host, Element, Event, EventEmitter, Prop, State, Listen } from '@stencil/core';\nimport { angle_down } from 'pn-design-assets/pn-assets/icons.js';\nimport { reduceMotion, ripple } from '@/index';\n\n/**\n * Use this row component inside a `pn-accordion` to create an accordion group.\n *\n * **Note**: you can use the `pn-accordion-row` without the parent accordion.\n * But you will have to style the gap between each row.\n *\n * @slot label - Include your own HTML as the label.\n * ```\n * <h3 slot=\"label\">Custom title</h3>\n * ```\n */\n@Component({\n  tag: 'pn-accordion-row',\n  styleUrl: 'pn-accordion-row.scss',\n})\nexport class PnAccordionRow {\n  private details: HTMLDetailsElement;\n  private summary: HTMLElement;\n  private content: HTMLDivElement;\n  private animation: Animation;\n\n  private readonly defaultAnimationDuration: number = 400;\n  private animationDuration: number = this.defaultAnimationDuration;\n\n  @Element() hostElement: HTMLElement;\n\n  @State() isClosing = false;\n  @State() isExpanding = false;\n\n  /** The label/title of the accordion row, you can also pass a slot with the name \"label\" if you want to put custom HTML content in there. */\n  @Prop({ mutable: true }) label: string;\n  /** The open/close status of the accordion row. */\n  @Prop({ mutable: true }) state?: boolean = false;\n\n  /** Optional unique id for the `summary` element. @category ID */\n  @Prop() buttonid?: string;\n  /** Optional unique id for the `div` element containing the content. @category ID */\n  @Prop() contentid?: string;\n  /** Optional prop that removes the default white background on the accordion row */\n  @Prop() transparent: boolean = false;\n\n  /** Dispatched every time the row is toggled. Includes the row element and the boolean `state` prop. */\n  @Event() togglerow: EventEmitter<{ element: HTMLElement; state: Boolean }>;\n\n  /** Internal function for closing rows when using the `single` prop on the `pn-accordion`. */\n  @Listen('rowstate')\n  handleRowState(event: CustomEvent) {\n    if (event.detail !== this.state) {\n      this.details.style.overflow = 'hidden';\n      this.closeAccordion();\n    }\n  }\n\n  componentWillLoad() {\n    const slottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n    this.label = slottedLabel ? null : this.label;\n  }\n\n  private toggleOpen(open?: boolean) {\n    const state = open ?? !this.state;\n    if (this.state !== open) this.togglerow.emit({ element: this.details, state });\n    this.state = state;\n  }\n\n  private clickHandler(e: MouseEvent) {\n    e.preventDefault();\n\n    this.details.style.overflow = 'hidden';\n\n    if (this.isClosing || !this.state) this.openAccordion();\n    else if (this.isClosing || this.state) this.closeAccordion();\n\n    const { x, width, y, top } = this.hostElement.getBoundingClientRect();\n    const clientCor = e.clientX === 0 && e.clientY === 0 ? { clientX: x + width - 24, clientY: y - top } : e;\n\n    ripple(clientCor, this.hostElement, '.pn-accordion-row-text');\n  }\n\n  private openAccordion() {\n    this.details.style.height = `${this.details.offsetHeight}px`;\n    this.toggleOpen(true);\n\n    requestAnimationFrame(() => {\n      this.isExpanding = true;\n\n      const startHeight = `${this.details.offsetHeight}px`;\n      const endHeight = `${this.summary.offsetHeight + this.content.offsetHeight}px`;\n\n      this.cancelAnimations();\n\n      this.animate(true, startHeight, endHeight);\n    });\n  }\n\n  private closeAccordion() {\n    this.isClosing = true;\n\n    const startHeight = `${this.details.offsetHeight}px`;\n    const endHeight = `${this.summary.offsetHeight}px`;\n\n    this.cancelAnimations();\n\n    this.animate(false, startHeight, endHeight);\n  }\n\n  private animate(open: boolean, startHeight: string, endHeight: string) {\n    if (reduceMotion()) this.animationDuration = 0;\n    else this.animationDuration = this.defaultAnimationDuration;\n\n    this.animation = this.details.animate(\n      {\n        height: [startHeight, endHeight],\n      },\n      {\n        duration: this.animationDuration,\n        easing: 'cubic-bezier(0.6, 0, 0.2, 1)',\n      },\n    );\n\n    this.animation.onfinish = () => this.animationFinish(open);\n\n    this.animation.oncancel = () => {\n      if (open) this.isExpanding = false;\n      else this.isClosing = false;\n    };\n  }\n\n  private animationFinish(open: boolean) {\n    this.toggleOpen(open);\n    this.cancelAnimations();\n\n    this.isClosing = false;\n    this.isExpanding = false;\n\n    this.details.style.height = '';\n    this.details.style.overflow = '';\n  }\n\n  private cancelAnimations() {\n    if (this.animation) this.animation.cancel();\n  }\n\n  render() {\n    return (\n      <Host>\n        <details class=\"pn-accordion-row\" open={this.state} ref={(el: HTMLDetailsElement) => (this.details = el)}>\n          <summary\n            id={this.buttonid}\n            class=\"pn-accordion-row-summary\"\n            onClick={e => this.clickHandler(e)}\n            ref={el => (this.summary = el)}\n          >\n            <div class=\"pn-accordion-row-text\" data-transparent={this.transparent}>\n              {this.label ? this.label : ''}\n              <slot name=\"label\" />\n\n              <pn-icon class=\"pn-accordion-row-icon\" icon={angle_down} />\n            </div>\n          </summary>\n\n          <div id={this.contentid} class=\"pn-accordion-row-content\" ref={(el: HTMLDivElement) => (this.content = el)}>\n            <slot />\n          </div>\n        </details>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"pn-accordion-row.entry.js","mappings":"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","names":[],"sources":["src/components/content/pn-accordion/row/pn-accordion-row.scss?tag=pn-accordion-row","src/components/content/pn-accordion/row/pn-accordion-row.tsx"],"sourcesContent":["@use 'src/globals/main';\n\npn-accordion-row {\n  position: relative;\n  margin: 0 -0.25em 0;\n}\n\npn-accordion-row .pn-accordion-row {\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n\n  &-summary {\n    color: main.$gray900;\n    position: relative;\n    border: none;\n    outline: 0;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n\n    width: 100%;\n    padding: 0.25em;\n    font-size: 1em;\n    font-weight: 400;\n    border-radius: 0.5em;\n\n    list-style: none;\n\n    &:hover > .pn-accordion-row-text {\n      background-color: main.$blue50;\n    }\n\n    &:focus-visible > .pn-accordion-row-text {\n      @include main.pn-focus-visible();\n    }\n\n    &::-webkit-details-marker {\n      display: none;\n    }\n  }\n\n  &-text {\n    position: relative;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    padding: 0.75em;\n    background-color: main.$white;\n    border-radius: 0.5em;\n    -webkit-tap-highlight-color: transparent;\n\n    &[data-transparent] {\n      background-color: transparent;\n    }\n\n    @include main.pn-focus-base();\n    @include main.pn-transition('background-color, outline-color');\n    @include main.pn-ripple(main.$blue700);\n  }\n\n  &-icon {\n    margin-left: auto;\n    flex-shrink: 0;\n    @include main.pn-transition('transform');\n    path {\n      fill: main.$blue700;\n    }\n  }\n\n  &[open] .pn-accordion-row-icon {\n    transform: rotate(-180deg);\n  }\n\n  &-content {\n    color: main.$gray900;\n    display: block;\n    padding: 1em;\n  }\n}\n","import { Component, h, Host, Element, Event, EventEmitter, Prop, State, Listen } from '@stencil/core';\nimport { chevron_down } from 'pn-design-assets/pn-assets/icons.js';\nimport { reduceMotion, ripple } from '@/index';\n\n/**\n * Use this row component inside a `pn-accordion` to create an accordion group.\n *\n * **Note**: you can use the `pn-accordion-row` without the parent accordion.\n * But you will have to style the gap between each row.\n *\n * @slot label - Include your own HTML as the label.\n * ```\n * <h3 slot=\"label\">Custom title</h3>\n * ```\n */\n@Component({\n  tag: 'pn-accordion-row',\n  styleUrl: 'pn-accordion-row.scss',\n})\nexport class PnAccordionRow {\n  private details: HTMLDetailsElement;\n  private summary: HTMLElement;\n  private content: HTMLDivElement;\n  private animation: Animation;\n\n  private readonly defaultAnimationDuration: number = 400;\n  private animationDuration: number = this.defaultAnimationDuration;\n\n  @Element() hostElement: HTMLElement;\n\n  @State() isClosing = false;\n  @State() isExpanding = false;\n\n  /** The label/title of the accordion row, you can also pass a slot with the name \"label\" if you want to put custom HTML content in there. */\n  @Prop({ mutable: true }) label: string;\n  /** The open/close status of the accordion row. */\n  @Prop({ mutable: true }) state?: boolean = false;\n\n  /** Optional unique id for the `summary` element. @category ID */\n  @Prop() buttonid?: string;\n  /** Optional unique id for the `div` element containing the content. @category ID */\n  @Prop() contentid?: string;\n  /** Optional prop that removes the default white background on the accordion row */\n  @Prop() transparent: boolean = false;\n\n  /** Dispatched every time the row is toggled. Includes the row element and the boolean `state` prop. */\n  @Event() togglerow: EventEmitter<{ element: HTMLElement; state: Boolean }>;\n\n  /** Internal function for closing rows when using the `single` prop on the `pn-accordion`. */\n  @Listen('rowstate')\n  handleRowState(event: CustomEvent) {\n    if (event.detail !== this.state) {\n      this.details.style.overflow = 'hidden';\n      this.closeAccordion();\n    }\n  }\n\n  componentWillLoad() {\n    const slottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n    this.label = slottedLabel ? null : this.label;\n  }\n\n  private toggleOpen(open?: boolean) {\n    const state = open ?? !this.state;\n    if (this.state !== open) this.togglerow.emit({ element: this.details, state });\n    this.state = state;\n  }\n\n  private clickHandler(e: MouseEvent) {\n    e.preventDefault();\n\n    this.details.style.overflow = 'hidden';\n\n    if (this.isClosing || !this.state) this.openAccordion();\n    else if (this.isClosing || this.state) this.closeAccordion();\n\n    const { x, width, y, top } = this.hostElement.getBoundingClientRect();\n    const clientCor = e.clientX === 0 && e.clientY === 0 ? { clientX: x + width - 24, clientY: y - top } : e;\n\n    ripple(clientCor, this.hostElement, '.pn-accordion-row-text');\n  }\n\n  private openAccordion() {\n    this.details.style.height = `${this.details.offsetHeight}px`;\n    this.toggleOpen(true);\n\n    requestAnimationFrame(() => {\n      this.isExpanding = true;\n\n      const startHeight = `${this.details.offsetHeight}px`;\n      const endHeight = `${this.summary.offsetHeight + this.content.offsetHeight}px`;\n\n      this.cancelAnimations();\n\n      this.animate(true, startHeight, endHeight);\n    });\n  }\n\n  private closeAccordion() {\n    this.isClosing = true;\n\n    const startHeight = `${this.details.offsetHeight}px`;\n    const endHeight = `${this.summary.offsetHeight}px`;\n\n    this.cancelAnimations();\n\n    this.animate(false, startHeight, endHeight);\n  }\n\n  private animate(open: boolean, startHeight: string, endHeight: string) {\n    if (reduceMotion()) this.animationDuration = 0;\n    else this.animationDuration = this.defaultAnimationDuration;\n\n    this.animation = this.details.animate(\n      {\n        height: [startHeight, endHeight],\n      },\n      {\n        duration: this.animationDuration,\n        easing: 'cubic-bezier(0.6, 0, 0.2, 1)',\n      },\n    );\n\n    this.animation.onfinish = () => this.animationFinish(open);\n\n    this.animation.oncancel = () => {\n      if (open) this.isExpanding = false;\n      else this.isClosing = false;\n    };\n  }\n\n  private animationFinish(open: boolean) {\n    this.toggleOpen(open);\n    this.cancelAnimations();\n\n    this.isClosing = false;\n    this.isExpanding = false;\n\n    this.details.style.height = '';\n    this.details.style.overflow = '';\n  }\n\n  private cancelAnimations() {\n    if (this.animation) this.animation.cancel();\n  }\n\n  render() {\n    return (\n      <Host>\n        <details class=\"pn-accordion-row\" open={this.state} ref={(el: HTMLDetailsElement) => (this.details = el)}>\n          <summary\n            id={this.buttonid}\n            class=\"pn-accordion-row-summary\"\n            onClick={e => this.clickHandler(e)}\n            ref={el => (this.summary = el)}\n          >\n            <div class=\"pn-accordion-row-text\" data-transparent={this.transparent}>\n              {this.label ? this.label : ''}\n              <slot name=\"label\" />\n\n              <pn-icon class=\"pn-accordion-row-icon\" icon={chevron_down} />\n            </div>\n          </summary>\n\n          <div id={this.contentid} class=\"pn-accordion-row-content\" ref={(el: HTMLDivElement) => (this.content = el)}>\n            <slot />\n          </div>\n        </details>\n      </Host>\n    );\n  }\n}\n"],"version":3}