@swisspost/design-system-components 9.0.0-next.12 → 9.0.0-next.14

package/{dist/esm/slide-3422b8a3.js → loaders/p-4af6dbed.js}

@@ -1,7 +1,7 @@
 const easing = 'ease';
 const duration = 500;
 const fill = 'forwards';
-const slideUp = (el, translateSize = '100%') => {
+function slideUp(el, translateSize = '100%') {
     return el.animate([
         { transform: `translateY(${translateSize})` }, // Starting position (no translation)
         { transform: 'translateY(0)' }, // End position
@@ -10,8 +10,8 @@ const slideUp = (el, translateSize = '100%') => {
         easing,
         fill,
     });
-};
-const slideDown = (el, translateSize = '100%') => {
+}
+function slideDown(el, translateSize = '100%') {
     return el.animate([
         { transform: 'translateY(0)' }, // Starting position (no translation)
         { transform: `translateY(${translateSize})` }, // End position
@@ -20,6 +20,6 @@ const slideDown = (el, translateSize = '100%') => {
         easing,
         fill,
     });
-};
+}
 
 export { slideDown as a, slideUp as s };

package/loaders/{index2.js → p-56ad4838.js}

@@ -1,23 +1,26 @@
-import { E as EMPTY_VALUES } from './constants.js';
-import { c as checkOneOf } from './check-one-of.js';
-import { c as checkType } from './check-type.js';
+import { E as EMPTY_VALUES } from './p-440193f4.js';
+import { c as checkOneOf } from './p-bacd3e2c.js';
+import { c as checkType } from './p-8562c7dc.js';
 
 function emptyOr(check) {
     return (...args) => {
         const value = args[0];
-        if (!EMPTY_VALUES.some(v => v === value))
+        if (!EMPTY_VALUES.some(v => v === value)) {
             check(...args);
+        }
     };
 }
 
 function checkPattern(value, pattern, errorMessage) {
-    if (typeof value !== 'string' || !pattern.test(value))
+    if (typeof value !== 'string' || !pattern.test(value)) {
         throw new Error(errorMessage);
+    }
 }
 
 function checkUrl(value, error) {
-    if (typeof value !== 'string' && !(value instanceof URL))
+    if (typeof value !== 'string' && !(value instanceof URL)) {
         throw new Error(error);
+    }
     try {
         new URL(value);
     }

package/{dist/components/post-popovercontainer2.js → loaders/p-60cf53cc.js}

@@ -1,5 +1,5 @@
-import { proxyCustomElement, HTMLElement as HTMLElement$1, createEvent, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-3e8554e7.js';
+import { v as version } from './p-2083ae2c.js';
 
 /**
  * Custom positioning reference element.
@@ -2103,7 +2103,7 @@ const computePosition = (reference, floating, options) => {
   }
 `,E=null;function I(e){if(E===null)try{E=new CSSStyleSheet,E.replaceSync(C);}catch{E=!1;}if(E===!1){let t=document.createElement("style");t.textContent=C,e instanceof Document?e.head.prepend(t):e.prepend(t);}else e.adoptedStyleSheets=[E,...e.adoptedStyleSheets];}function K(){window.ToggleEvent=window.ToggleEvent||c;function e(n){return n?.includes(":popover-open")&&(n=n.replace(J,"$1.\\:popover-open")),n}f(Document.prototype,"querySelector",e),f(Document.prototype,"querySelectorAll",e),f(Element.prototype,"querySelector",e),f(Element.prototype,"querySelectorAll",e),f(Element.prototype,"matches",e),f(Element.prototype,"closest",e),f(DocumentFragment.prototype,"querySelectorAll",e),f(DocumentFragment.prototype,"querySelectorAll",e),Object.defineProperties(HTMLElement.prototype,{popover:{enumerable:!0,configurable:!0,get(){if(!this.hasAttribute("popover"))return null;let n=(this.getAttribute("popover")||"").toLowerCase();return n===""||n=="auto"?"auto":"manual"},set(n){this.setAttribute("popover",n);}},showPopover:{enumerable:!0,configurable:!0,value(){S(this);}},hidePopover:{enumerable:!0,configurable:!0,value(){m(this,!0,!0);}},togglePopover:{enumerable:!0,configurable:!0,value(n){h.get(this)==="showing"&&n===void 0||n===!1?m(this,!0,!0):(n===void 0||n===!0)&&S(this);}}});let t=Element.prototype.attachShadow;t&&Object.defineProperties(Element.prototype,{attachShadow:{enumerable:!0,configurable:!0,writable:!0,value(n){let s=t.call(this,n);return I(s),s}}});let o=HTMLElement.prototype.attachInternals;o&&Object.defineProperties(HTMLElement.prototype,{attachInternals:{enumerable:!0,configurable:!0,writable:!0,value(){let n=o.call(this);return n.shadowRoot&&I(n.shadowRoot),n}}});let r=new WeakMap;function i(n){Object.defineProperties(n.prototype,{popoverTargetElement:{enumerable:!0,configurable:!0,set(s){if(s===null)this.removeAttribute("popovertarget"),r.delete(this);else if(s instanceof Element)this.setAttribute("popovertarget",""),r.set(this,s);else throw new TypeError("popoverTargetElement must be an element or null")},get(){if(this.localName!=="button"&&this.localName!=="input"||this.localName==="input"&&this.type!=="reset"&&this.type!=="image"&&this.type!=="button"||this.disabled||this.form&&this.type==="submit")return null;let s=r.get(this);if(s&&s.isConnected)return s;if(s&&!s.isConnected)return r.delete(this),null;let u=v(this),w=this.getAttribute("popovertarget");return (u instanceof Document||u instanceof B)&&w&&u.getElementById(w)||null}},popoverTargetAction:{enumerable:!0,configurable:!0,get(){let s=(this.getAttribute("popovertargetaction")||"").toLowerCase();return s==="show"||s==="hide"?s:"toggle"},set(s){this.setAttribute("popovertargetaction",s);}}});}i(HTMLButtonElement),i(HTMLInputElement);let l=n=>{if(!n.isTrusted)return;let s=n.composedPath()[0];if(!(s instanceof Element)||s?.shadowRoot)return;let u=v(s);if(!(u instanceof B||u instanceof Document))return;let w=s.closest("[popovertargetaction],[popovertarget]");if(w){O(w),n.preventDefault();return}},a=n=>{let s=n.key,u=n.target;!n.defaultPrevented&&u&&(s==="Escape"||s==="Esc")&&T(u.ownerDocument,!0,!0);};(n=>{n.addEventListener("click",l),n.addEventListener("keydown",a),n.addEventListener("pointerdown",x),n.addEventListener("pointerup",x);})(document),I(document);}j()||K();})();
 
-const postPopovercontainerCss = "@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\\:popover-open){display:none}}}:where(post-popovercontainer){box-shadow:.5px 3px 4px rgba(0,0,0,.1),2px 4px 10px 4px rgba(0,0,0,.12);background:var(--post-current-palette-bg);color:var(--post-current-palette-fg);position:fixed;z-index:1060;width:max-content;margin:0;padding:0;box-sizing:border-box;border:2px solid rgba(0,0,0,0);border-radius:4px;overflow:visible}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-left:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-right:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-left:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-right:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}";
+const postPopovercontainerCss = "@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\\:popover-open){display:none}}}:where(post-popovercontainer){box-shadow:var(--post-device-elevation-300);background:var(--post-current-palette-bg);color:var(--post-current-palette-fg);position:fixed;z-index:1060;width:max-content;margin:0;padding:0;box-sizing:border-box;border:2px solid rgba(0,0,0,0);border-radius:4px;overflow:visible}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer):not(:has(.arrow)){box-shadow:var(--post-device-elevation-300)}:where(post-popovercontainer):has(.arrow){filter:drop-shadow(1px 2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(2px 4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(4px 8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.top){filter:drop-shadow(0px -2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(0px -4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(0px -8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.left){filter:drop-shadow(-2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(-4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(-8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.right){filter:drop-shadow(2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-left:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-right:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-left:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-right:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}";
 const PostPopovercontainerStyle0 = postPopovercontainerCss;
 
 const SIDE_MAP = {
@@ -2112,17 +2112,40 @@ const SIDE_MAP = {
     bottom: 'top',
     left: 'right',
 };
-const PostPopovercontainer = /*@__PURE__*/ proxyCustomElement(class PostPopovercontainer extends HTMLElement$1 {
+const PostPopovercontainer = /*@__PURE__*/ proxyCustomElement(class PostPopovercontainer extends H {
     constructor() {
         super();
         this.__registerHost();
         this.postToggle = createEvent(this, "postToggle", 7);
-        this.placement = 'top';
-        this.edgeGap = 8;
-        this.arrow = false;
     }
+    get host() { return this; }
+    arrowRef;
+    eventTarget;
+    clearAutoUpdate;
+    toggleTimeoutId;
+    /**
+     * Fires whenever the popover gets shown or hidden, passing the new state in event.details as a boolean
+     */
+    postToggle;
+    /**
+     * Whether or not the popover should close when user clicks outside of it
+     */
+    manualClose = false;
+    /**
+     * Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
+     * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted
+     * towards the viewport if they would overlap edge boundaries.
+     */
+    placement = 'top';
+    /**
+     * Gap between the edge of the page and the popover
+     */
+    edgeGap = 8;
+    /**
+     * Wheter or not to display a little pointer arrow
+     */
+    arrow = false;
     componentDidLoad() {
-        this.host.setAttribute('popover', '');
         this.host.addEventListener('beforetoggle', this.handleToggle.bind(this));
     }
     disconnectedCallback() {
@@ -2240,13 +2263,13 @@ const PostPopovercontainer = /*@__PURE__*/ proxyCustomElement(class PostPopoverc
         }
     }
     render() {
-        return (h(Host, { key: '844302edb3852f99229d4f4ccacf82cd78588435', "data-version": version }, this.arrow && (h("span", { key: 'ae293d24ef24282bfcaeb7f545653a563e5246d5', class: "arrow", ref: el => {
+        return (h(Host, { key: '6bebf9ab3013796d0eebb3d543411a0e80d2e913', "data-version": version, popover: this.manualClose ? 'manual' : 'auto' }, this.arrow && (h("span", { key: 'd6eca10452a54073a293128e8faf76e45e35c4c5', class: "arrow", ref: el => {
                 this.arrowRef = el;
-            } })), h("slot", { key: '61dd3072a5217099028e3dd4b22fa845ea2f5970' })));
+            } })), h("slot", { key: '3b6674dfa1b3ffac10c6640717c7ae713577c965' })));
     }
-    get host() { return this; }
     static get style() { return PostPopovercontainerStyle0; }
 }, [4, "post-popovercontainer", {
+        "manualClose": [4, "manual-close"],
         "placement": [1],
         "edgeGap": [2, "edge-gap"],
         "arrow": [4],

package/loaders/p-64e3de38.js

@@ -0,0 +1,11 @@
+const fadeDuration = 200;
+const fadedOutKeyframe = { opacity: '0' };
+const fadedInKeyframe = { opacity: '1' };
+function fadeIn(el) {
+    return el.animate([fadedOutKeyframe, fadedInKeyframe], { duration: fadeDuration });
+}
+function fadeOut(el) {
+    return el.animate([fadedInKeyframe, fadedOutKeyframe], { duration: fadeDuration });
+}
+
+export { fadeIn as a, fadeOut as f };

package/loaders/{post-accordion-item2.js → p-83baa315.js}

@@ -1,25 +1,34 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { H as HEADING_LEVELS } from './heading-levels.js';
-import { b as checkEmptyOrOneOf } from './index2.js';
-import { n as nanoid } from './index.browser.js';
-import { d as defineCustomElement$3 } from './post-collapsible2.js';
-import { d as defineCustomElement$2 } from './post-collapsible-trigger2.js';
-import { d as defineCustomElement$1 } from './post-icon2.js';
+import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
+import { v as version } from './p-2083ae2c.js';
+import { H as HEADING_LEVELS } from './p-247a1668.js';
+import { b as checkEmptyOrOneOf } from './p-56ad4838.js';
+import { n as nanoid } from './p-5959f2bd.js';
+import { d as defineCustomElement$3 } from './p-9fac5d7d.js';
+import { d as defineCustomElement$2 } from './p-05590ac0.js';
+import { d as defineCustomElement$1 } from './p-f7177e26.js';
 
 const postAccordionItemCss = ":host::after{display:block;content:\"\";margin-top:calc(var(--post-device-border-width-default)*-1);border-bottom:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}:host: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){:host: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:inherit;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}.accordion-button::before{display:block;position:absolute;content:\"\";inset:0;bottom:auto;border-top: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}";
 const PostAccordionItemStyle0 = postAccordionItemCss;
 
-const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionItem extends HTMLElement {
+const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionItem extends H {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.id = undefined;
-        this.slottedLogo = undefined;
-        this.collapsed = false;
-        this.headingLevel = undefined;
     }
+    collapsible;
+    get host() { return this; }
+    id;
+    slottedLogo;
+    /**
+     * If `true`, the element is collapsed otherwise it is displayed.
+     */
+    collapsed = false;
+    /**
+     * Defines the hierarchical level of the accordion item header within the headings structure.
+     * @deprecated set the `heading-level` property on the parent `post-accordion` instead.
+     */
+    headingLevel;
     validateHeadingLevel(newValue = this.headingLevel) {
         checkEmptyOrOneOf(newValue, HEADING_LEVELS, 'The `heading-level` property of the `post-accordion-item` must be a number between 1 and 6.');
     }
@@ -49,15 +58,13 @@ const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionIt
         this.slottedLogo = this.host.querySelector('img[slot="logo"]');
     }
     render() {
-        var _a, _b;
-        const headingLevel = (_a = this.host.closest('post-accordion')) === null || _a === void 0 ? void 0 : _a.getAttribute('heading-level');
-        const HeadingTag = `h${(_b = headingLevel !== null && headingLevel !== void 0 ? headingLevel : this.headingLevel) !== null && _b !== void 0 ? _b : 2}`;
-        return (h(Host, { key: '77851385edd1910f539ce61f1bf90bcebdeaa9ee', id: this.id, "data-version": version }, h("div", { key: '0d7ab4f69e350658908ac54aa1bdbdf07003f0e1', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: 'b0cc3c14a98575e1db7093a668557ee021fd7f8e', for: `${this.id}--collapse` }, h(HeadingTag, { key: '33f3066f1a866b519084012517d548dd9abd8093', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: '1c29d71ea84789427c4bb4ca6f75f56ef0bc242e', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: '0324ff7aa3e48a4b7964f043ae99cb5e136fbb54', class: {
+        const headingLevel = this.host.closest('post-accordion')?.getAttribute('heading-level');
+        const HeadingTag = `h${headingLevel ?? this.headingLevel ?? 2}`;
+        return (h(Host, { key: 'f1275370d7aff41e1fc60285395af35a1ecc90e7', id: this.id, "data-version": version }, h("div", { key: 'd74f762805143939a891e40cfa7a4779ea29921d', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '5ddad810d8b1f8564bdaaf2b09e9e89eee96e007', for: `${this.id}--collapse` }, h(HeadingTag, { key: 'fc6dc947d426bb31de04e83d8c9795a0c826733c', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: 'bd8005bb87e8e00fee57794bd73c5f06cb642a3d', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: '89eb0b80e63867e2dcd6b27d95c6519d1e86b10d', class: {
                 'logo-container': true,
                 'has-image': !!this.slottedLogo,
-            } }, h("slot", { key: 'a2a07235808a847097d78610d22efc8eb73bd2f0', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '2f6cf7287b910b211e8ba646a8431eb634d89768', name: "header" }), h("post-icon", { key: '38f599c957e70027ebe84939f6146618a5a4b2f0', name: "2051" })))), h("post-collapsible", { key: 'a9fefff65fb48ac5a81c8fef3486dc84937de3a8', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: 'eddd1a7e8a583409908b7b0a91482cbdfd9e7c99', class: "accordion-body", part: "body" }, h("slot", { key: '1e82e00b05c16bd917e640738c5100689d2e7edf' }))))));
+            } }, h("slot", { key: '0940530a15ce04b50af007db7f1530ae3c6a456d', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: 'f06a6b067727be0667b4ea9384e75ee8aa435bfc', name: "header" }), h("post-icon", { key: '460b2c22083cc3049e0c83fc690cb44e3f984db7', name: "2051" })))), h("post-collapsible", { key: '2411f1f93d136ae0bfcbf0da9bb2902d7da0e2a0', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: 'e648a76e35c28bc1aa5cc57233bf6e8277532294', class: "accordion-body", part: "body" }, h("slot", { key: '7841fff45f2132990d8f1577dfe7d3707d1eb46c' }))))));
     }
-    get host() { return this; }
     static get watchers() { return {
         "headingLevel": ["validateHeadingLevel"]
     }; }

package/loaders/{check-type.js → p-8562c7dc.js}

@@ -2,12 +2,12 @@ function checkType(value, type, error) {
     const typeIsArray = type === 'array';
     const valueIsArray = Array.isArray(value);
     if (typeIsArray || valueIsArray) {
-        if (valueIsArray !== typeIsArray)
+        if (valueIsArray !== typeIsArray) {
             throw new Error(error);
+        }
     }
-    else {
-        if (typeof value !== type)
-            throw new Error(error);
+    else if (typeof value !== type) {
+        throw new Error(error);
     }
 }
 

package/{dist/components/post-menu-trigger2.js → loaders/p-8b053fd5.js}

@@ -1,29 +1,31 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { c as checkType } from './check-type.js';
-import { g as getRoot } from './get-root.js';
+import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
+import { v as version } from './p-2083ae2c.js';
+import { c as checkType } from './p-8562c7dc.js';
+import { g as getRoot } from './p-fc91cbc2.js';
 
 const postMenuTriggerCss = ":host{display:inline-block}";
 const PostMenuTriggerStyle0 = postMenuTriggerCss;
 
-const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger extends HTMLElement {
+const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger extends H {
     constructor() {
         super();
         this.__registerHost();
-        /**
-         * Reference to the slotted button within the trigger, if present.
-         * Used to manage click and key events for menu control.
-         */
-        this.slottedButton = null;
-        this.handleKeyDown = (e) => {
-            if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
-                e.preventDefault();
-                this.handleToggle();
-            }
-        };
-        this.for = undefined;
-        this.ariaExpanded = false;
     }
+    /**
+     * ID of the menu element that this trigger is linked to. Used to open and close the specified menu.
+     */
+    for;
+    get host() { return this; }
+    /**
+     * Manages the accessibility attribute `aria-expanded` to indicate whether the associated menu is expanded or collapsed.
+     */
+    ariaExpanded = false;
+    /**
+     * Reference to the slotted button within the trigger, if present.
+     * Used to manage click and key events for menu control.
+     */
+    slottedButton = null;
+    root;
     /**
      * Watch for changes to the `for` property to validate its type and ensure it is a string.
      * @param forValue - The new value of the `for` property.
@@ -46,6 +48,12 @@ const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger e
             console.warn(`No post-menu found with ID: ${this.for}`);
         }
     }
+    handleKeyDown = (e) => {
+        if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
+            e.preventDefault();
+            this.handleToggle();
+        }
+    };
     componentDidLoad() {
         this.root = getRoot(this.host);
         this.validateControlFor();
@@ -72,9 +80,8 @@ const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger e
         }
     }
     render() {
-        return (h(Host, { key: '5bdaebd0c1f46fda5804c0e8d39ab3e714b523c5', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'ffee26535991d712f44cb1859a5976ec89ad772a' })));
+        return (h(Host, { key: 'a0fff619978087ce0c67d7d327982424e3784ff0', "data-version": version, "tab-index": "-1" }, h("slot", { key: '93e26150b59e9a01275a6815096e09ff5fac146b' })));
     }
-    get host() { return this; }
     static get watchers() { return {
         "for": ["validateControlFor"]
     }; }

package/loaders/{post-menu2.js → p-91882483.js}

@@ -1,75 +1,50 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { g as getRoot } from './get-root.js';
-import { d as defineCustomElement$1 } from './post-popovercontainer2.js';
-
-const focusableSelector = `:where(${[
-    'button',
-    'input:not([type="hidden"])',
-    '[tabindex]',
-    'select',
-    'textarea',
-    '[contenteditable]',
-    'a[href]',
-    'iframe',
-    'audio[controls]',
-    'video[controls]',
-    'area[href]',
-    'details > summary:first-of-type',
-].join(',')})`;
-const focusDisablingSelector = `:where(${[
-    '[inert]',
-    '[inert] *',
-    ':disabled',
-    'dialog:not([open]) *',
-    '[popover]:not(:popover-open) *',
-    'details:not([open]) > *:not(details > summary:first-of-type)',
-    'details:not([open]) > *:not(details > summary:first-of-type) *',
-    '[tabindex^="-"]',
-].join(',')})`;
-const getFocusableChildren = (element) => {
-    return element.querySelectorAll(`& > ${focusableSelector}:not(${focusDisablingSelector})`);
-};
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-3e8554e7.js';
+import { v as version } from './p-2083ae2c.js';
+import { g as getFocusableChildren } from './p-3aba7629.js';
+import { g as getRoot } from './p-fc91cbc2.js';
+import { d as defineCustomElement$1 } from './p-60cf53cc.js';
 
 const postMenuCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}post-popovercontainer{padding:var(--post-menu-padding);background-color:var(--post-menu-bg, #ffffff);border-color:var(--post-menu-bg, #ffffff)}.popover-container{display:flex;flex-direction:column}";
 const PostMenuStyle0 = postMenuCss;
 
-const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLElement {
+const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends H {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
         this.toggleMenu = createEvent(this, "toggleMenu", 7);
-        this.lastFocusedElement = null;
-        this.KEYCODES = {
-            SPACE: ' ',
-            ENTER: 'Enter',
-            UP: 'ArrowUp',
-            DOWN: 'ArrowDown',
-            TAB: 'Tab',
-            HOME: 'Home',
-            END: 'End',
-            ESCAPE: 'Escape',
-        };
-        this.handleKeyDown = (e) => {
-            e.stopPropagation();
-            if (e.key === this.KEYCODES.ESCAPE) {
-                this.toggle(this.host);
-                return;
-            }
-            if (Object.values(this.KEYCODES).includes(e.key)) {
-                this.controlKeyDownHandler(e);
-            }
-        };
-        this.handleClick = (e) => {
-            const target = e.target;
-            if (['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {
-                this.toggle(this.host);
-            }
-        };
-        this.placement = 'bottom';
-        this.isVisible = false;
     }
+    popoverRef;
+    lastFocusedElement = null;
+    KEYCODES = {
+        SPACE: ' ',
+        ENTER: 'Enter',
+        UP: 'ArrowUp',
+        DOWN: 'ArrowDown',
+        TAB: 'Tab',
+        HOME: 'Home',
+        END: 'End',
+        ESCAPE: 'Escape',
+    };
+    get host() { return this; }
+    /**
+     * Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
+     * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted
+     * towards the viewport if they would overlap edge boundaries.
+     */
+    placement = 'bottom';
+    /**
+     * Holds the current visibility state of the menu.
+     * This state is internally managed to track whether the menu is open (`true`) or closed (`false`),
+     * and updates automatically when the menu is toggled.
+     */
+    isVisible = false;
+    /**
+     * Emits when the menu is shown or hidden.
+     * The event payload is a boolean: `true` when the menu was opened, `false` when it was closed.
+     **/
+    toggleMenu;
+    root;
     connectedCallback() {
         this.root = getRoot(this.host);
         this.host.addEventListener('keydown', this.handleKeyDown);
@@ -89,7 +64,12 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
      * Toggles the menu visibility based on its current state.
      */
     async toggle(target) {
-        this.isVisible ? await this.hide() : await this.show(target);
+        if (this.isVisible) {
+            await this.hide();
+        }
+        else {
+            await this.show(target);
+        }
     }
     /**
      * Displays the popover menu, focusing the first menu item.
@@ -123,6 +103,22 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
             console.error('hide: popoverRef is null or undefined');
         }
     }
+    handleKeyDown = (e) => {
+        e.stopPropagation();
+        if (e.key === this.KEYCODES.ESCAPE) {
+            this.toggle(this.host);
+            return;
+        }
+        if (Object.values(this.KEYCODES).includes(e.key)) {
+            this.controlKeyDownHandler(e);
+        }
+    };
+    handleClick = (e) => {
+        const target = e.target;
+        if (['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {
+            this.toggle(this.host);
+        }
+    };
     controlKeyDownHandler(e) {
         const menuItems = this.getSlottedItems();
         if (!menuItems.length) {
@@ -171,9 +167,8 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
             .flatMap(el => Array.from(getFocusableChildren(el))));
     }
     render() {
-        return (h(Host, { key: '68c4661d3ab9256dadbbe3243247456c090b728e', "data-version": version }, h("post-popovercontainer", { key: 'b6cb0624239e0ed5aeadac63ffb1b1f7fb0e873e', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '608f677ae715eb09ed46fde9912241dc35673e06', class: "popover-container", part: "popover-container" }, h("slot", { key: '83f84b7b29b4d7c9d4e0924026ca7469c1f0cfb0' })))));
+        return (h(Host, { key: '071532c327f80197dda662f77e5cb2444281087d', "data-version": version }, h("post-popovercontainer", { key: '9f70ca4009139e0547026b26be610a02f4f1a95a', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '3ff1048a8fb27402a82cedc3dc300366063c9601', class: "popover-container", part: "popover-container" }, h("slot", { key: 'bed6c96b7502e0032b746ac6fdf8c3dd6d782e48' })))));
     }
-    get host() { return this; }
     static get style() { return PostMenuStyle0; }
 }, [1, "post-menu", {
         "placement": [1],

package/{dist/components/attribute-observer.js → loaders/p-9748a355.js}

@@ -1,9 +1,9 @@
-const getAttributeObserver = (attribute, handler) => {
+function getAttributeObserver(attribute, handler) {
     /**
      * Handle attribute changes and childList changes from the observer
      * @param {MutationRecord[]} mutationList
      */
-    const observerHandler = (mutationList) => {
+    function observerHandler(mutationList) {
         mutationList.forEach(mutation => {
             if (mutation.type === 'attributes' && mutation.attributeName === attribute) {
                 handler(mutation.target);
@@ -17,9 +17,9 @@ const getAttributeObserver = (attribute, handler) => {
                 });
             }
         });
-    };
+    }
     // Initialize a mutation observer for patching accessibility features
     return new MutationObserver(observerHandler);
-};
+}
 
 export { getAttributeObserver as g };

package/loaders/{post-collapsible2.js → p-9fac5d7d.js}

@@ -1,6 +1,6 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { c as checkEmptyOrType } from './index2.js';
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-3e8554e7.js';
+import { v as version } from './p-2083ae2c.js';
+import { c as checkEmptyOrType } from './p-56ad4838.js';
 
 function isMotionReduced() {
     return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
@@ -14,33 +14,43 @@ const animationOptions = {
     easing: collapseEasing,
     fill: 'forwards',
 };
-const collapse = (el) => {
+function collapse(el) {
     const expandedKeyframe = { height: window.getComputedStyle(el).height };
     return el.animate([expandedKeyframe, collapsedKeyframe], animationOptions);
-};
-const expand = (el) => {
+}
+function expand(el) {
     const expandedKeyframe = { height: `${el.scrollHeight}px`, offset: 1 };
-    const finalKeyframe = { height: 'auto' };
+    const finalKeyframe = { height: 'auto', overflow: 'visible' };
     return el.animate([collapsedKeyframe, expandedKeyframe, finalKeyframe], animationOptions);
-};
+}
 
 const postCollapsibleCss = ":host{display:block;position:relative;overflow:hidden}";
 const PostCollapsibleStyle0 = postCollapsibleCss;
 
-const PostCollapsible = /*@__PURE__*/ proxyCustomElement(class PostCollapsible extends HTMLElement {
+const PostCollapsible = /*@__PURE__*/ proxyCustomElement(class PostCollapsible extends H {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
         this.postToggle = createEvent(this, "postToggle", 7);
-        this.isLoaded = false;
-        this.isOpen = true;
-        this.collapsed = false;
     }
+    isLoaded = false;
+    isOpen = true;
+    get host() { return this; }
+    /**
+     * If `true`, the element is collapsed otherwise it is displayed.
+     */
+    collapsed = false;
     collapsedChange() {
         checkEmptyOrType(this.collapsed, 'boolean', 'The `collapsed` property of the `post-collapsible` must be a boolean.');
         void this.toggle(!this.collapsed);
     }
+    /**
+     * An event emitted when the collapse element is shown or hidden, before the transition.
+     *
+     * The event payload is a boolean: `true` if the collapsible was opened, `false` if it was closed.
+     */
+    postToggle;
     componentDidLoad() {
         this.collapsedChange();
         this.isLoaded = true;
@@ -75,9 +85,8 @@ const PostCollapsible = /*@__PURE__*/ proxyCustomElement(class PostCollapsible e
         triggers.forEach(trigger => trigger.update());
     }
     render() {
-        return (h(Host, { key: 'fd2402bcf9dee7753da3d9dc78e48e7410a774c2', "data-version": version, tabindex: this.collapsed ? -1 : undefined }, h("slot", { key: '7119a56492d6ed3fea4c5be8a34d8af60f18fe0a' })));
+        return (h(Host, { key: '3ba9983562f5fabec602f23d8698bacb3ff0dbdc', "data-version": version, tabindex: this.collapsed ? -1 : undefined }, h("slot", { key: '010369b851198dab8eed76a2ab26627d480c97d4' })));
     }
-    get host() { return this; }
     static get watchers() { return {
         "collapsed": ["collapsedChange"]
     }; }

package/loaders/{check-non-empty.js → p-b095519d.js}

@@ -1,4 +1,4 @@
-import { E as EMPTY_VALUES } from './constants.js';
+import { E as EMPTY_VALUES } from './p-440193f4.js';
 
 function checkNonEmpty(value, error) {
     if (EMPTY_VALUES.some(v => v === value)) {

package/{dist/esm/check-one-of-6b3ef8eb.js → loaders/p-bacd3e2c.js}

@@ -1,6 +1,7 @@
 function checkOneOf(value, possibleValues, error) {
-    if (!possibleValues.includes(value))
+    if (!possibleValues.includes(value)) {
         throw new Error(error);
+    }
 }
 
 export { checkOneOf as c };

package/loaders/{post-menu-item2.js → p-ccccf0c3.js}

@@ -1,13 +1,13 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
+import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
+import { v as version } from './p-2083ae2c.js';
 
-const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends HTMLElement {
+const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends H {
     constructor() {
         super();
         this.__registerHost();
     }
     render() {
-        return (h(Host, { key: '1cd717c2bbc991b33acba0bbfa5d5a2412f6dcc7', role: "menuitem", "data-version": version }, h("slot", { key: 'fe09373b79d299f21ebfdf596bab4d4bc30a9060' })));
+        return (h(Host, { key: '376ce17a520b6cb74c55c009843df878f99ef411', role: "menuitem", "data-version": version }, h("slot", { key: 'e489c5c09f1527e527e052e9f4349c5b26db6ea9' })));
     }
 }, [4, "post-menu-item"]);
 function defineCustomElement() {

package/loaders/{debounce.js → p-e1baac59.js}

@@ -1,8 +1,9 @@
 function debounce(callback, timeout = 200) {
     let id;
     return (...args) => {
-        if (id)
+        if (id) {
             clearTimeout(id);
+        }
         id = setTimeout(callback, timeout, ...args);
     };
 }