@swisspost/design-system-components 9.0.0-next.32 → 9.0.0-next.34

package/dist/cjs/{post-accordion-item-7ed1f630.js → post-accordion-item-aace6bc2.js}

@@ -1,9 +1,11 @@
 'use strict';
 
-const index = require('./index-d6bf2c66.js');
-const _package = require('./package-6f8f430c.js');
+const index = require('./index-b60129c4.js');
+const _package = require('./package-3426e8f7.js');
 const headingLevels = require('./heading-levels-608d432e.js');
 const index$1 = require('./index-23e36ff7.js');
+require('./breakpoints-cdf1b747.js');
+const eventGuard = require('./event-guard-efabc84f.js');
 const index_browser = require('./index.browser-2f65f583.js');
 
 const postAccordionItemCss = ".accordion-item::after{display:block;content:\"\";margin-block-start:calc(var(--post-device-border-width-default)*-1);border-block-end:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}.accordion-item:has(.accordion-button:hover)::after{border-color:var(--post-scheme-color-interactive-primary-hover-stroke)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-item:has(.accordion-button:hover)::after{border-color:Highlight}}.accordion-header{color:var(--post-scheme-color-interactive-primary-enabled-fg1);font-size:var(--post-device-font-size-5);margin:0;line-height:var(--post-device-line-height-heading);font-weight:var(--post-device-font-weight-black)}.accordion-button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;display:flex;position:relative;width:100%;align-items:center;text-align:start;gap:var(--post-device-spacing-gap-7);padding:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default)) calc(var(--post-device-spacing-padding-5) + var(--post-device-border-width-default));cursor:pointer}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button{background-color:ButtonFace !important}.accordion-button:hover{background-color:Highlight !important}}.accordion-button::before{display:block;position:absolute;content:\"\";inset:0;inset-block-end:auto;border-block-start:var(--post-accordion-button-border-top)}.accordion-button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.accordion-button slot::slotted(span[slot=header]){flex-grow:1}.accordion-button post-icon{flex:none;width:var(--post-core-dimension-24);aspect-ratio:1;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed{padding-block-start:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default));padding-block-end:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default))}.accordion-button.collapsed post-icon{transform:rotate(-180deg)}.accordion-button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}.accordion-button>::slotted(.text-truncate){display:block}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover,.accordion-button:focus-visible{color:Highlight}}.accordion-body{padding-block-start:var(--post-device-spacing-padding-15);padding-block-end:calc(var(--post-device-spacing-padding-block-25) + var(--post-device-border-width-default));padding-inline:var(--post-device-spacing-padding-5)}.logo-container{display:none;width:var(--post-device-sizing-logo-1);aspect-ratio:1}.logo-container.has-image{display:block}.logo-container slot::slotted(img){display:block;width:100%;height:100%;object-fit:cover}.accordion-button>::slotted(:first-child),.accordion-body>::slotted(:first-child){margin-block-start:0 !important}.accordion-button>::slotted(:last-child),.accordion-body>::slotted(:last-child){margin-block-end:0 !important}";
@@ -17,8 +19,6 @@ const PostAccordionItem = class {
         this.collapsed = false;
         this.headingLevel = undefined;
     }
-    collapsible;
-    get host() { return index.getElement(this); }
     validateHeadingLevel() {
         index$1.checkEmptyOrOneOf(this, 'headingLevel', headingLevels.HEADING_LEVELS, 'The `heading-level` property of the `post-accordion-item` must be a number between 1 and 6.');
     }
@@ -28,12 +28,11 @@ const PostAccordionItem = class {
     componentDidLoad() {
         this.validateHeadingLevel();
     }
-    // capture to make sure the "collapsed" property is updated before the event is consumed
+    // Capture to make sure the "collapsed" property is updated before the event is consumed
     onCollapseToggle(event) {
-        if (event.target === this.host &&
-            event.target.localName === 'post-accordion-item') {
+        eventGuard.eventGuard(this.host, event, { targetLocalName: 'post-collapsible', delegatorSelector: 'post-accordion-item' }, () => {
             this.collapsed = !event.detail;
-        }
+        });
     }
     /**
      * Triggers the collapse programmatically.
@@ -50,11 +49,12 @@ const PostAccordionItem = class {
     render() {
         const headingLevel = this.host.closest('post-accordion')?.getAttribute('heading-level');
         const HeadingTag = `h${headingLevel ?? this.headingLevel ?? 2}`;
-        return (index.h(index.Host, { key: '4c4baf7ac22c632de6b0bc332ffc275e50bb4d71', id: this.id, "data-version": _package.version }, index.h("div", { key: '576529323c3adca347ec685688c071e21a2f3a76', part: "accordion-item", class: "accordion-item" }, index.h("post-collapsible-trigger", { key: 'cc29c396173e55168a3bec963d5e101cb3fb17b2', for: `${this.id}--collapse` }, index.h(HeadingTag, { key: '76f8eed33f0c84bf6e1a534b04a8ccc0c69c6380', class: "accordion-header", id: `${this.id}--header` }, index.h("button", { key: 'f56e67ffc94fea0452d1879d3410318b3b12c4bc', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, index.h("span", { key: 'd5f23318d5c498e0cd9dd1f15c13a636e49b7817', class: {
+        return (index.h(index.Host, { key: '725d3710f7937f82c2382938d15770001e923b61', id: this.id, "data-version": _package.version }, index.h("div", { key: '679d25d8278fbf9ae68546ee50c27a86ded95999', part: "accordion-item", class: "accordion-item" }, index.h("post-collapsible-trigger", { key: '7c2af8dc6a1f5265b4ae2cad066be7d2e0bf6a78', for: `${this.id}--collapse` }, index.h(HeadingTag, { key: 'a10e59a17fdb272fe6308d2ba98f37f90490fab8', class: "accordion-header", id: `${this.id}--header` }, index.h("button", { key: 'e2b527850c8342a8adf99453d0ac330b6a94760f', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, index.h("span", { key: 'b722a4bc51757546eefa58c7c3ea3a688838298a', class: {
                 'logo-container': true,
                 'has-image': !!this.slottedLogo,
-            } }, index.h("slot", { key: '051d48cc4201e2d954f4d4bc25c836ddc8e24d0f', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), index.h("slot", { key: 'e9f687c79fab8bd3bd94e4da022b2aea7e0bba5c', name: "header" }), index.h("post-icon", { key: 'c1f3486254269ab50a89bd6acf8c714cbbced3b8', name: "2051" })))), index.h("post-collapsible", { key: '7f3788a90e59cdb4f985fd14c64286cb938a3c23', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, index.h("div", { key: 'e17ae656614ac27d4f09ebba0a7bb547f88f5728', class: "accordion-body", part: "body" }, index.h("slot", { key: '0387ebe5ce518bbb8b78c66d919715a78b5ae558' }))))));
+            } }, index.h("slot", { key: '1a42494db72a7b437b1d98fa2e8159d73ece22fa', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), index.h("slot", { key: '049865bb25f833780ef8e27fe8477e06476a2427', name: "header" }), index.h("post-icon", { key: 'da0cf7078e4f51710dbfd39c0afa90465fcb53c6', name: "2051" })))), index.h("post-collapsible", { key: '7c3b268e34d3e4f52820b11a6c090aefbc16e3b9', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, index.h("div", { key: '993a7fffbccb557aed2842305f3927e5c3b5047a', class: "accordion-body", part: "body" }, index.h("slot", { key: '580eb87b1cb4f88acd7dddddecaa1c1982b7f6e3' }))))));
     }
+    get host() { return index.getElement(this); }
     static get watchers() { return {
         "headingLevel": ["validateHeadingLevel"]
     }; }

package/dist/cjs/post-accordion-item.cjs.entry.js

@@ -2,15 +2,17 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postAccordionItem = require('./post-accordion-item-7ed1f630.js');
-require('./index-d6bf2c66.js');
-require('./package-6f8f430c.js');
+const postAccordionItem = require('./post-accordion-item-aace6bc2.js');
+require('./index-b60129c4.js');
+require('./package-3426e8f7.js');
 require('./heading-levels-608d432e.js');
 require('./index-23e36ff7.js');
 require('./constants-238701d3.js');
 require('./check-one-of-75d270b5.js');
 require('./check-type-cdbf6d29.js');
 require('./check-url-220a286c.js');
+require('./breakpoints-cdf1b747.js');
+require('./event-guard-efabc84f.js');
 require('./index.browser-2f65f583.js');
 
 

package/dist/cjs/post-accordion.cjs.entry.js

@@ -2,11 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postAccordion = require('./post-accordion-e3a6d78e.js');
-require('./index-d6bf2c66.js');
-require('./package-6f8f430c.js');
+const postAccordion = require('./post-accordion-3ac8dca8.js');
+require('./index-b60129c4.js');
+require('./package-3426e8f7.js');
 require('./heading-levels-608d432e.js');
 require('./check-one-of-75d270b5.js');
+require('./breakpoints-cdf1b747.js');
+require('./event-guard-efabc84f.js');
 
 
 

package/dist/cjs/{post-avatar-de8ec197.js → post-avatar-53abd22f.js}

@@ -1,8 +1,9 @@
 'use strict';
 
-const index = require('./index-d6bf2c66.js');
-const _package = require('./package-6f8f430c.js');
+const index = require('./index-b60129c4.js');
+const _package = require('./package-3426e8f7.js');
 const checkNonEmpty = require('./check-non-empty-bd99d236.js');
+require('./breakpoints-cdf1b747.js');
 
 const postAvatarCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{--post-avatar-bg:var(--post-scheme-color-interactive-primary-enabled-bg2);--post-avatar-fg:var(--post-scheme-color-interactive-primary-enabled-fg3);display:inline-flex;position:relative;width:var(--post-device-sizing-interactive-icon-size3);height:var(--post-device-sizing-interactive-icon-size3);background-color:var(--post-scheme-color-interactive-primary-enabled-stroke3);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-primary-enabled-stroke3);border-radius:var(--post-device-border-radius-round);font-size:var(--post-device-font-size-8);vertical-align:top;line-height:1}:host::after{display:block;content:\"\";position:absolute;inset:0;z-index:1;border-radius:inherit}*,*::before,*::after{box-sizing:border-box}slot,img,::slotted(img){display:block;width:100%;height:100%}img,::slotted(img){border-radius:var(--post-device-border-radius-round)}::slotted(:not(img)){display:none !important}.initials{display:flex;justify-content:center;align-items:center;position:relative;z-index:2;width:100%;height:100%;background-color:var(--post-avatar-bg);border-radius:var(--post-device-border-radius-round);color:var(--post-avatar-fg);text-transform:uppercase}.initials span{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.initials span:not(caption){position:absolute !important}";
 const PostAvatarStyle0 = postAvatarCss;
@@ -32,8 +33,6 @@ const PostAvatar = class {
         this.imageAlt = '';
         this.initials = '';
     }
-    static INTERNAL_USERID_IMAGE_SRC = 'https://web.post.ch/UserProfileImage/{userid}.png';
-    get host() { return index.getElement(this); }
     validateFirstname() {
         checkNonEmpty.checkNonEmpty(this, 'firstname');
     }
@@ -135,10 +134,12 @@ const PostAvatar = class {
         }, []);
         return (index.h(index.Host, { "data-version": _package.version }, index.h("slot", { onSlotchange: this.onSlotDefaultChange.bind(this) }, this.avatarType === 'image' && index.h("img", { src: this.imageUrl, alt: this.imageAlt }), this.avatarType === 'initials' && index.h("div", { class: "initials" }, initials))));
     }
+    get host() { return index.getElement(this); }
     static get watchers() { return {
         "firstname": ["validateFirstname"]
     }; }
 };
+PostAvatar.INTERNAL_USERID_IMAGE_SRC = 'https://web.post.ch/UserProfileImage/{userid}.png';
 PostAvatar.style = PostAvatarStyle0;
 
 exports.PostAvatar = PostAvatar;

package/dist/cjs/post-avatar.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postAvatar = require('./post-avatar-de8ec197.js');
-require('./index-d6bf2c66.js');
-require('./package-6f8f430c.js');
+const postAvatar = require('./post-avatar-53abd22f.js');
+require('./index-b60129c4.js');
+require('./package-3426e8f7.js');
 require('./check-non-empty-bd99d236.js');
 require('./constants-238701d3.js');
+require('./breakpoints-cdf1b747.js');
 
 
 

package/dist/cjs/post-back-to-top-b231fc1c.js

@@ -0,0 +1,96 @@
+'use strict';
+
+const index = require('./index-b60129c4.js');
+const slide = require('./slide-cd1f09b3.js');
+const _package = require('./package-3426e8f7.js');
+const checkType = require('./check-type-cdbf6d29.js');
+const checkNonEmpty = require('./check-non-empty-bd99d236.js');
+require('./breakpoints-cdf1b747.js');
+
+const postBackToTopCss = ":host{--post-floating-button-position-top:var(--post-device-position-4);--post-back-to-top-position-top:calc( var(--post-header-height) + var(--post-floating-button-position-top) );--post-back-to-top-elevation:var(--post-device-elevation-300);position:fixed;inset-block-start:var(--post-back-to-top-position-top);inset-inline-end:var(--post-device-position-1)}:host .back-to-top{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;box-shadow:var(--post-back-to-top-elevation);cursor:pointer;border-radius:var(--post-device-border-radius-round);width:var(--post-device-sizing-interactive-button-height-2);height:var(--post-device-sizing-interactive-button-height-2);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-button-secondary-enabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-enabled-bg);display:flex;align-items:center;justify-content:center}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .back-to-top{background-color:ButtonFace !important}:host .back-to-top:hover{background-color:Highlight !important}}:host .back-to-top{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}:host .back-to-top:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .back-to-top:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:host .back-to-top:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .back-to-top:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}:host .back-to-top:hover{border-color:var(--post-scheme-color-interactive-button-secondary-hover-stroke);color:var(--post-scheme-color-interactive-button-secondary-hover-fg);background-color:var(--post-scheme-color-interactive-button-secondary-hover-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .back-to-top:hover{color:HighlightText !important}}:host .back-to-top post-icon{height:var(--post-device-sizing-interactive-button-icon-3);width:var(--post-device-sizing-interactive-button-icon-3)}:host .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const PostBackToTopStyle0 = postBackToTopCss;
+
+const PostBackToTop = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.handleScroll = () => {
+            this.belowFold = this.isBelowFold();
+        };
+        this.label = undefined;
+        this.belowFold = false;
+    }
+    isBelowFold() {
+        return window.scrollY > window.innerHeight;
+    }
+    /*Watch for changes in belowFold to show/hide the back to top button*/
+    watchBelowFold(newValue) {
+        if (newValue) {
+            slide.slideDown(this.host, this.translateY);
+        }
+        else {
+            slide.slideUp(this.host, this.translateY);
+        }
+    }
+    scrollToTop() {
+        window.scrollTo({
+            top: 0,
+            behavior: 'smooth',
+        });
+    }
+    getSecondPixelValue(parts) {
+        for (const part of parts) {
+            const pixelValues = part.match(/\b\d+px\b/g);
+            if (pixelValues && pixelValues.length > 1) {
+                return pixelValues[1];
+            }
+        }
+    }
+    animateButton() {
+        // Get the back-to-top button top postiion
+        const positionTop = window.getComputedStyle(this.host).getPropertyValue('top');
+        const buttonElement = this.host.shadowRoot.querySelector('button');
+        // Extract the elevation height from the back-to-top button elevation token
+        const elevation = getComputedStyle(buttonElement).getPropertyValue('--post-back-to-top-elevation');
+        const elevationParts = elevation.split(',');
+        const elevationHeight = this.getSecondPixelValue(elevationParts);
+        // The translateY is calculated as => -100% (btt button height) - topPosition - elevationHeight
+        this.translateY =
+            String((-1 * 100) / 100 -
+                parseFloat(positionTop.replace('px', '')) -
+                parseFloat(elevationHeight.replace('px', ''))) + 'px';
+        if (this.belowFold) {
+            slide.slideDown(this.host, this.translateY);
+        }
+        if (!this.belowFold) {
+            this.host.style.transform = `translateY(${this.translateY})`;
+        }
+    }
+    // Validate the label
+    validateLabel() {
+        checkNonEmpty.checkNonEmpty(this, 'label');
+        checkType.checkType(this, 'label', 'string');
+    }
+    // Set the initial state
+    componentWillLoad() {
+        this.belowFold = this.isBelowFold();
+    }
+    componentDidLoad() {
+        window.addEventListener('scroll', this.handleScroll, false);
+        this.animateButton();
+        this.validateLabel();
+    }
+    disconnectedCallback() {
+        window.removeEventListener('scroll', this.handleScroll);
+    }
+    render() {
+        return (index.h(index.Host, { key: 'c1ab6c5e7619ad829d64aea16c59a923310cf091', "data-version": _package.version }, index.h("button", { key: '99e10e4d16c8d82521b001c3b3d902d8ba47ee92', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, index.h("post-icon", { key: '5a6a1b472b45fcc466127ece7091617e4700ee16', "aria-hidden": "true", name: "3026" }), index.h("span", { key: 'c8502e4822347d48034f6a936203e3314c7ae91e', class: "visually-hidden" }, this.label))));
+    }
+    get host() { return index.getElement(this); }
+    static get watchers() { return {
+        "belowFold": ["watchBelowFold"],
+        "label": ["validateLabel"]
+    }; }
+};
+PostBackToTop.style = PostBackToTopStyle0;
+
+exports.PostBackToTop = PostBackToTop;

package/dist/cjs/post-back-to-top.cjs.entry.js

@@ -2,13 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postBackToTop = require('./post-back-to-top-6a1c1ba4.js');
-require('./index-d6bf2c66.js');
+const postBackToTop = require('./post-back-to-top-b231fc1c.js');
+require('./index-b60129c4.js');
 require('./slide-cd1f09b3.js');
-require('./package-6f8f430c.js');
+require('./package-3426e8f7.js');
 require('./check-type-cdbf6d29.js');
 require('./check-non-empty-bd99d236.js');
 require('./constants-238701d3.js');
+require('./breakpoints-cdf1b747.js');
 
 
 

package/dist/cjs/{post-banner-bf523706.js → post-banner-e6d14bf1.js}

@@ -1,9 +1,10 @@
 'use strict';
 
-const index = require('./index-d6bf2c66.js');
-const _package = require('./package-6f8f430c.js');
+const index = require('./index-b60129c4.js');
+const _package = require('./package-3426e8f7.js');
 const fade = require('./fade-72d5ef55.js');
 const index$1 = require('./index-23e36ff7.js');
+require('./breakpoints-cdf1b747.js');
 const index_browser = require('./index.browser-2f65f583.js');
 const checkType = require('./check-type-cdbf6d29.js');
 const checkNonEmpty = require('./check-non-empty-bd99d236.js');
@@ -27,7 +28,6 @@ const PostBanner = class {
         this.icon = undefined;
         this.type = 'neutral';
     }
-    get host() { return index.getElement(this); }
     validateDismissible() {
         checkType.checkType(this, 'dismissible', 'boolean');
         setTimeout(() => this.validateDismissLabel());
@@ -43,11 +43,6 @@ const PostBanner = class {
     validateType() {
         index$1.checkEmptyOrOneOf(this, 'type', BANNER_TYPES);
     }
-    /**
-     * An event emitted when the banner element is dismissed, after the transition.
-     * It has no payload and only relevant for dismissible banners.
-     */
-    postDismissed;
     componentDidLoad() {
         this.validateDismissible();
         this.validateIcon();
@@ -84,6 +79,7 @@ const PostBanner = class {
         ];
         return (index.h(index.Host, { key: 'ec72012fa82e03b0dca2368025449e1942731c21', "data-version": _package.version }, index.h("div", { key: 'acae7ac34af951ca9176769ab4bcdc388d769931', role: "alert", class: this.classes, part: this.classes }, this.dismissible && (index.h("button", { key: '23cc4d77c2825bc76cedcdc321b80b9b0f333e71', class: "btn-close", onClick: this.onDismissButtonClick }, index.h("span", { key: '2f0753d49fc86f19df743f33a086c14b2a0686f7', class: "visually-hidden" }, this.dismissLabel))), this.icon && this.icon !== 'none' && (index.h("post-icon", { key: `${this.bannerId}-icon`, name: this.icon })), this.hasActions ? actionBannerContent : defaultBannerContent)));
     }
+    get host() { return index.getElement(this); }
     static get watchers() { return {
         "dismissible": ["validateDismissible"],
         "dismissLabel": ["validateDismissLabel"],

package/dist/cjs/post-banner.cjs.entry.js

@@ -2,15 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postBanner = require('./post-banner-bf523706.js');
-require('./index-d6bf2c66.js');
-require('./package-6f8f430c.js');
+const postBanner = require('./post-banner-e6d14bf1.js');
+require('./index-b60129c4.js');
+require('./package-3426e8f7.js');
 require('./fade-72d5ef55.js');
 require('./index-23e36ff7.js');
 require('./constants-238701d3.js');
 require('./check-one-of-75d270b5.js');
 require('./check-type-cdbf6d29.js');
 require('./check-url-220a286c.js');
+require('./breakpoints-cdf1b747.js');
 require('./index.browser-2f65f583.js');
 require('./check-non-empty-bd99d236.js');
 

package/dist/cjs/{post-breadcrumb-da55143a.js → post-breadcrumb-a929f2a6.js}

@@ -1,9 +1,19 @@
 'use strict';
 
-const index = require('./index-d6bf2c66.js');
-const _package = require('./package-6f8f430c.js');
+const index = require('./index-b60129c4.js');
+const _package = require('./package-3426e8f7.js');
 const checkUrl = require('./check-url-220a286c.js');
-const debounce = require('./debounce-158fd76f.js');
+require('./breakpoints-cdf1b747.js');
+
+function debounce(callback, timeout = 200) {
+    let id;
+    return (...args) => {
+        if (id) {
+            clearTimeout(id);
+        }
+        id = setTimeout(callback, timeout, ...args);
+    };
+}
 
 const postBreadcrumbCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:flex;align-items:center}.breadcrumbs-nav{display:flex;align-items:center}.hidden-items{gap:var(--post-device-spacing-gap-inline-4);position:absolute;height:0;overflow:hidden;white-space:nowrap}.breadcrumbs-list{display:flex;flex-wrap:nowrap;position:relative;margin:0;padding:0;list-style:none;align-items:center;height:100%;gap:var(--post-device-spacing-gap-inline-4)}post-icon{display:inline-block;box-sizing:border-box;color:var(--post-scheme-color-interactive-primary-enabled-fg1);height:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.breadcrumb-item-icon{padding-block:var(--post-core-dimension-4);padding-inline:var(--post-core-dimension-4)}li a{display:flex;align-items:center}li a{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}li a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){li a:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}li a:focus{border-radius:var(--post-device-border-radius-focus)}li a .home-icon{padding-block:var(--post-device-spacing-padding-4);padding-inline:var(--post-device-spacing-padding-4)}li a .home-icon:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a .home-icon a,li a .home-icon:focus,li a .home-icon:hover{color:CanvasText !important}}.menu-trigger-wrapper{display:flex;align-items:center;gap:var(--post-device-spacing-gap-inline-5)}.actual-menu{display:flex;align-items:center}post-menu-trigger{display:flex;align-items:center;padding-block:var(--post-device-spacing-padding-block-7)}post-menu-trigger{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-menu-trigger:focus{border-radius:var(--post-device-border-radius-focus)}post-menu-trigger button{background:none;border:none;line-height:150%;font-size:var(--post-device-font-size-6);cursor:pointer;padding:0;color:var(--post-scheme-color-interactive-primary-enabled-fg1)}post-menu-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger button a,post-menu-trigger button:focus,post-menu-trigger button:hover{color:LinkText !important}}post-menu::part(popover-container){display:flex;flex-direction:column;align-items:start;padding:.6rem;gap:var(--post-device-spacing-gap-inline-4)}post-menu::part(popover-container) ::slotted(post-menu-item:not(:last-child)){margin-block-end:var(--post-device-spacing-gap-inline-4)}.breadcrumb-item{display:flex;align-items:center;justify-content:center;gap:var(--post-device-spacing-gap-inline-5)}.breadcrumb-item a{text-decoration:none;color:var(--post-scheme-color-surface-default-fg);line-height:150%;padding-block:var(--post-device-spacing-padding-block-7);font-size:var(--post-device-font-size-6)}.breadcrumb-item a{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.breadcrumb-item a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.breadcrumb-item a:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.breadcrumb-item a:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}.breadcrumb-item a:focus-visible{border-radius:var(--post-device-border-radius-focus)}.breadcrumb-item span:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}.breadcrumb-item span:focus-visible{border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a,.breadcrumb-item:focus,.breadcrumb-item:hover{color:LinkText !important}.breadcrumb-item:visited{color:VisitedText !important}}post-breadcrumb-item:last-of-type{pointer-events:none;color:var(--post-scheme-color-interactive-primary-selected-fg1);font-weight:var(--post-device-font-weight-bold);text-decoration:var(--post-core-text-decoration-none)}post-breadcrumb-item:last-of-type:hover{color:var(--post-scheme-color-interactive-primary-selected-fg1);text-decoration:none}.visually-hidden{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.visually-hidden:not(caption){position:absolute !important}";
 const PostBreadcrumbStyle0 = postBreadcrumbCss;
@@ -11,15 +21,28 @@ const PostBreadcrumbStyle0 = postBreadcrumbCss;
 const PostBreadcrumb = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        // Waits for breadcrumb navigation reference to be available
+        this.waitForBreadcrumbRef = debounce(() => {
+            if (this.breadcrumbNavRef?.clientWidth > 0) {
+                this.checkConcatenation();
+            }
+            else {
+                this.waitForBreadcrumbRef();
+            }
+        }, 50);
+        // Handles resizing to check concatenation
+        this.handleResize = () => {
+            if (window.innerWidth === this.lastWindowWidth)
+                return;
+            this.lastWindowWidth = window.innerWidth;
+            this.checkConcatenation();
+        };
         this.homeUrl = undefined;
         this.homeText = 'Home';
         this.breadcrumbItems = [];
         this.isConcatenated = undefined;
         this.lastWindowWidth = undefined;
     }
-    get host() { return index.getElement(this); }
-    breadcrumbNavRef;
-    lastItem;
     validateUrl() {
         checkUrl.checkUrl(this, 'homeUrl');
     }
@@ -33,15 +56,6 @@ const PostBreadcrumb = class {
     disconnectedCallback() {
         window.removeEventListener('resize', this.handleResize);
     }
-    // Waits for breadcrumb navigation reference to be available
-    waitForBreadcrumbRef = debounce.debounce(() => {
-        if (this.breadcrumbNavRef?.clientWidth > 0) {
-            this.checkConcatenation();
-        }
-        else {
-            this.waitForBreadcrumbRef();
-        }
-    }, 50);
     // Updates breadcrumb items and sets the last item
     updateBreadcrumbItems() {
         this.breadcrumbItems = Array.from(this.host.querySelectorAll('post-breadcrumb-item')).map(item => ({
@@ -50,13 +64,6 @@ const PostBreadcrumb = class {
         }));
         this.lastItem = this.breadcrumbItems[this.breadcrumbItems.length - 1];
     }
-    // Handles resizing to check concatenation
-    handleResize = () => {
-        if (window.innerWidth === this.lastWindowWidth)
-            return;
-        this.lastWindowWidth = window.innerWidth;
-        this.checkConcatenation();
-    };
     // Determines parent width for concatenation logic
     getParentWidth() {
         let parent = this.host.parentNode;
@@ -103,6 +110,7 @@ const PostBreadcrumb = class {
                 }
             } }, item.url ? index.h("a", { href: item.url }, item.text) : index.h("span", null, item.text)))))))) : (visibleItems.map(item => (index.h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text)))), this.lastItem && (index.h("post-breadcrumb-item", { key: '31d86d933720b5f6f6928ccfd251443261e9479e', url: this.lastItem.url, "aria-current": "page", tabindex: -1 }, this.lastItem.text))), index.h("div", { key: '3248d32aa6a73c97c3071be85174fb8634d4e722', class: "hidden-items" }, index.h("a", { key: '05b0231d3a5793588aa9ede628a7b1e6d2e2faf0', href: this.homeUrl, class: "hidden-breadcrumb-item" }, index.h("span", { key: '15a63a894124717cfb2be61779c3971772c38397', class: "visually-hidden" }, this.homeText), index.h("post-icon", { key: '6c893c56b6a34f311fa66d71c4cb523b00535458', name: "home", class: "home-icon" })), this.breadcrumbItems.map(item => (index.h("post-breadcrumb-item", { url: item.url, key: `hidden-${item.url || item.text}`, class: "hidden-breadcrumb-item" }, item.text)))))));
     }
+    get host() { return index.getElement(this); }
     static get watchers() { return {
         "homeUrl": ["validateUrl"]
     }; }

package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js

@@ -2,14 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postMenuItem = require('./post-menu-item-509877cd.js');
-require('./index-d6bf2c66.js');
-require('./package-6f8f430c.js');
+const postMenuItem = require('./post-menu-item-afabaa61.js');
+require('./index-b60129c4.js');
+require('./package-3426e8f7.js');
 require('./index-23e36ff7.js');
 require('./constants-238701d3.js');
 require('./check-one-of-75d270b5.js');
 require('./check-type-cdbf6d29.js');
 require('./check-url-220a286c.js');
+require('./breakpoints-cdf1b747.js');
 
 
 

package/dist/cjs/post-breadcrumb.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postBreadcrumb = require('./post-breadcrumb-da55143a.js');
-require('./index-d6bf2c66.js');
-require('./package-6f8f430c.js');
+const postBreadcrumb = require('./post-breadcrumb-a929f2a6.js');
+require('./index-b60129c4.js');
+require('./package-3426e8f7.js');
 require('./check-url-220a286c.js');
-require('./debounce-158fd76f.js');
+require('./breakpoints-cdf1b747.js');