@swisspost/design-system-components 10.0.0-next.50 → 10.0.0-next.52

package/dist/components/get-focusable-children.js

@@ -25,11 +25,40 @@ const focusDisablingSelector = `:where(${[
 ].join(',')})`;
 function getFocusableChildren(element) {
     const focusableChildren = element.querySelectorAll(`${focusableSelector}:not(${focusDisablingSelector})`);
-    const visibleFocusableChildren = Array.from(focusableChildren).filter(child => {
-        const style = window.getComputedStyle(child.parentElement);
-        return style.display !== 'none' && style.visibility !== 'hidden';
-    });
-    return visibleFocusableChildren;
+    return Array.from(focusableChildren).filter(isVisible);
+}
+// Searches deeper accross shadowDom
+function getDeepFocusableChildren(element) {
+    const results = [];
+    function traverse(node) {
+        if (isElementFocusable(node)) {
+            results.push(node);
+        }
+        if (node instanceof HTMLElement && node.shadowRoot) {
+            traverse(node.shadowRoot);
+        }
+        for (const child of Array.from(node.children)) {
+            traverse(child);
+        }
+        if (node instanceof HTMLElement) {
+            for (const slot of Array.from(node.querySelectorAll('slot'))) {
+                for (const el of slot.assignedElements({ flatten: true })) {
+                    traverse(el);
+                }
+            }
+        }
+    }
+    traverse(element);
+    return results;
+}
+function isVisible(el) {
+    const style = window.getComputedStyle(el.parentElement);
+    return style.display !== 'none' && style.visibility !== 'hidden';
+}
+function isElementFocusable(node) {
+    return (node instanceof HTMLElement &&
+        node.matches(`${focusableSelector}:not(${focusDisablingSelector})`) &&
+        isVisible(node));
 }
 
-export { getFocusableChildren as g };
+export { getDeepFocusableChildren as a, getFocusableChildren as g };

package/dist/components/index.d.ts

@@ -53,6 +53,8 @@ export { PostMenuTrigger as PostMenuTrigger } from '../types/components/post-men
 export { defineCustomElement as defineCustomElementPostMenuTrigger } from './post-menu-trigger';
 export { PostPopover as PostPopover } from '../types/components/post-popover/post-popover';
 export { defineCustomElement as defineCustomElementPostPopover } from './post-popover';
+export { PostPopoverTrigger as PostPopoverTrigger } from '../types/components/post-popover-trigger/post-popover-trigger';
+export { defineCustomElement as defineCustomElementPostPopoverTrigger } from './post-popover-trigger';
 export { PostPopovercontainer as PostPopovercontainer } from '../types/components/post-popovercontainer/post-popovercontainer';
 export { defineCustomElement as defineCustomElementPostPopovercontainer } from './post-popovercontainer';
 export { PostRating as PostRating } from '../types/components/post-rating/post-rating';

package/dist/components/index.js

@@ -26,6 +26,7 @@ export { PostMenu, defineCustomElement as defineCustomElementPostMenu } from './
 export { PostMenuItem, defineCustomElement as defineCustomElementPostMenuItem } from './post-menu-item.js';
 export { PostMenuTrigger, defineCustomElement as defineCustomElementPostMenuTrigger } from './post-menu-trigger.js';
 export { PostPopover, defineCustomElement as defineCustomElementPostPopover } from './post-popover.js';
+export { PostPopoverTrigger, defineCustomElement as defineCustomElementPostPopoverTrigger } from './post-popover-trigger.js';
 export { PostPopovercontainer, defineCustomElement as defineCustomElementPostPopovercontainer } from './post-popovercontainer.js';
 export { PostRating, defineCustomElement as defineCustomElementPostRating } from './post-rating.js';
 export { PostTabHeader, defineCustomElement as defineCustomElementPostTabHeader } from './post-tab-header.js';

package/dist/components/package.js

@@ -1,3 +1,3 @@
-const version = "10.0.0-next.50";
+const version = "10.0.0-next.52";
 
 export { version as v };

package/dist/components/post-accordion-item2.js

@@ -62,7 +62,7 @@ const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionIt
         return (h(Host, { key: 'b98847d19894430b6f65130aebf8673a45afd1e6', id: this.id, "data-version": version }, h("div", { key: 'f26f9d3a4a1f59db23b4698b321e28e112c3eed0', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '14bdacce04d67a03655f600feeaeec065e0fc198', for: `${this.id}--collapse` }, h(HeadingTag, { key: '7a07a70d172306ce37f8bd0143b21ed7ec0cab8a', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: '5ad0698a62df5c4b2c0a77ff622090b20f348e9c', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: '6e5fcb0c9efa8a57e05fd162c72b9c170a8210c6', class: {
                 'logo-container': true,
                 'has-image': !!this.slottedLogo,
-            } }, h("slot", { key: '41a1409f723bf52de893324ce45d4e7f31eb8908', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '7186adfe4a4fe67f4dbaeb7569820d0d06c18428', name: "header" }), h("post-icon", { key: 'fbfcbdc9947a8c7cf80d861aba3a77be0dff91d1', name: "2051" })))), h("post-collapsible", { key: '5de19aab5eb0134b7c3e7f43e5c2da0cb8413908', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: '5112ba8604ea177af4d88033f682c2a4cc6c4ffd', class: "accordion-body", part: "body" }, h("slot", { key: 'd70ab76842fced3f7dec812471685071e377bc61' }))))));
+            } }, h("slot", { key: '41a1409f723bf52de893324ce45d4e7f31eb8908', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '7186adfe4a4fe67f4dbaeb7569820d0d06c18428', name: "header" }), h("post-icon", { key: 'add240b0275b083c537efb28c4a2825ac22e1b47', name: "chevrondown" })))), h("post-collapsible", { key: '4231577c41c7633327c147d2b9adcd847ffc7261', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: '3f3cea3f5468e35f658f7d143db32391fa5fe2f1', class: "accordion-body", part: "body" }, h("slot", { key: '013f6cc755a04b880d91513059e36bcc2be5f412' }))))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/post-back-to-top.js

@@ -104,7 +104,7 @@ const PostBackToTop$1 = /*@__PURE__*/ proxyCustomElement(class PostBackToTop ext
         window.removeEventListener('scroll', this.handleScroll);
     }
     render() {
-        return (h(Host, { key: '51abef7d1f650da1476689c46d853f49669da856', "data-version": version }, h("button", { key: '9de175f7962448fa3d658e4a24b01a857925a5b7', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: '281a177c37cbf98d72a0d6359483750762026b23', "aria-hidden": "true", name: "3026" }), h("span", { key: '9c019806112c905bb6ba2e8ac4da85bcbd334566', class: "visually-hidden" }, this.label))));
+        return (h(Host, { key: '51abef7d1f650da1476689c46d853f49669da856', "data-version": version }, h("button", { key: '9de175f7962448fa3d658e4a24b01a857925a5b7', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: '2913ad9930bccf5f1e72ea611ed3c57a0e4e1ca8', "aria-hidden": "true", name: "arrowup" }), h("span", { key: '44b3f9bf5a16c883282a73bf5cfae77619079c0d', class: "visually-hidden" }, this.label))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/post-breadcrumb-item2.js

@@ -44,7 +44,7 @@ const PostBreadcrumbItem = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumb
     }
     render() {
         const BreadcrumbTag = this.validUrl ? 'a' : 'span';
-        return (h(Host, { key: '9ccdcf67335a106fd70e1d756a941736827454c0', "data-version": version }, h("post-icon", { key: 'e0c9479626737582764a4ecd55612d3d9ee4ae21', name: "2111", class: "breadcrumb-item-icon" }), h(BreadcrumbTag, { key: '75f7b88edee2dda2907429c3c1ab55efe9e5137b', class: "breadcrumb-item", ...(this.validUrl ? { href: this.validUrl } : {}), onKeyDown: event => this.handleKeyDown(event) }, h("slot", { key: '1e59f84b6a9fd8b73372371e79fff43e44bd88c6' }))));
+        return (h(Host, { key: '9ccdcf67335a106fd70e1d756a941736827454c0', "data-version": version }, h("post-icon", { key: 'c2061015e34cc3c37d343abd872bd8bd3cc82615', name: "chevronright", class: "breadcrumb-item-icon" }), h(BreadcrumbTag, { key: '3e9659ac705d801699167864a06cde461bc84185', class: "breadcrumb-item", ...(this.validUrl ? { href: this.validUrl } : {}), onKeyDown: event => this.handleKeyDown(event) }, h("slot", { key: 'e86e3333db8b0636a9a9635a5f11960c7d839e3d' }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/post-breadcrumbs.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { v as version } from './package.js';
-import { g as checkRequiredAndUrl, e as checkEmptyOrType, c as checkRequiredAndType } from './index2.js';
+import { g as checkRequiredAndUrl, c as checkRequiredAndType } from './index2.js';
 import './breakpoints.js';
 import { d as defineCustomElement$7 } from './post-breadcrumb-item2.js';
 import { d as defineCustomElement$6 } from './post-icon2.js';
@@ -26,10 +26,6 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumbs
         super();
         this.__registerHost();
         this.__attachShadow();
-        /**
-         * The text label for the home breadcrumb item.
-         */
-        this.homeText = 'Home';
         this.breadcrumbItems = [];
         // Waits for breadcrumbs navigation reference to be available
         this.waitForBreadcrumbsRef = debounce(() => {
@@ -52,9 +48,12 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumbs
         checkRequiredAndUrl(this, 'homeUrl');
     }
     validateHomeText() {
-        checkEmptyOrType(this, 'homeUrl', 'string');
+        checkRequiredAndType(this, 'homeText', 'string');
     }
     validateLabel() {
+        checkRequiredAndType(this, 'label', 'string');
+    }
+    validateMenuLabel() {
         checkRequiredAndType(this, 'menuLabel', 'string');
     }
     componentWillLoad() {
@@ -64,6 +63,7 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumbs
         this.validateHomeUrl();
         this.validateHomeText();
         this.validateLabel();
+        this.validateMenuLabel();
         window.addEventListener('resize', this.handleResize);
         this.waitForBreadcrumbsRef();
     }
@@ -111,29 +111,31 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumbs
     }
     render() {
         const visibleItems = this.breadcrumbItems.slice(0, -1);
-        return (h(Host, { key: '6e0095670a7f07079a0aa135673f49d74b5308e7', "data-version": version }, h("nav", { key: '9558a78399f82f7168a5958470aed393a5ca035e', "aria-label": "Breadcrumbs", class: "breadcrumbs-nav", ref: el => (this.breadcrumbsNavRef = el) }, h("ol", { key: 'a1cd27d3f95a23a4a94937b582588f0b87cf33f6', class: "no-list breadcrumbs-list" }, h("li", { key: '7a3917328194a2676e22776f8946639d4a4e4c17' }, h("a", { key: '56e224d2b484efd5a88a9df63f09450757e3f0ae', href: this.homeUrl, class: "breadcrumb-link" }, h("span", { key: '94fbe7c49748926d2fdb419ce4c212b7f0b9e419', class: "visually-hidden" }, this.homeText), h("post-icon", { key: '25c64b9e548eaa92ca0f3da55a0b09d2ec17f876', name: "home", class: "home-icon" }))), this.isConcatenated ? (h("li", { role: "none", class: "menu-trigger-wrapper", onKeyDown: e => {
+        return (h(Host, { key: '0c98c8ea09e4f17781fd8c404d445bd42aaacad5', "data-version": version }, h("nav", { key: 'aefa39943fd6ccbfcb2f01b19266785644bb4e32', "aria-label": this.label, class: "breadcrumbs-nav", ref: el => (this.breadcrumbsNavRef = el) }, h("ol", { key: 'd9542316f160f5fc98ca1ddadc27db5f24df78a1', class: "no-list breadcrumbs-list" }, h("li", { key: '3b4c9798492ffa8a6cbc65081efa08c3793a1325' }, h("a", { key: 'f7fd7c962d548a372198b5b1640a9f63fa36a809', href: this.homeUrl, class: "breadcrumb-link" }, h("span", { key: '3aa94c9eca27de39a9e564ec719eea4d821a6692', class: "visually-hidden" }, this.homeText), h("post-icon", { key: '04e54f7e16c21dcf0dcee0d9a8753e09d1382605', name: "home", class: "home-icon" }))), this.isConcatenated ? (h("li", { class: "menu-trigger-wrapper" }, h("post-icon", { name: "chevronright", class: "breadcrumb-item-icon" }), h("div", { class: "actual-menu" }, h("post-menu-trigger", { for: "breadcrumb-menu", tabIndex: 0, onKeyDown: e => {
                 if (e.key === 'Enter' || e.key === ' ') {
                     e.preventDefault();
                     this.handleBreadcrumbItemClick();
                 }
-            } }, h("post-icon", { name: "2111", class: "breadcrumb-item-icon" }), h("div", { class: "actual-menu" }, h("post-menu-trigger", { for: "breadcrumb-menu", tabIndex: 0 }, h("button", { class: "btn test", tabIndex: -1 }, "...")), h("post-menu", { id: "breadcrumb-menu", label: this.menuLabel }, visibleItems.map(item => (h("post-menu-item", { key: item.url || item.text, class: "breadcrumb-item", onKeyDown: e => {
+            } }, h("button", { class: "btn", tabIndex: -1 }, "...")), h("post-menu", { id: "breadcrumb-menu", label: this.menuLabel }, visibleItems.map(item => (h("post-menu-item", { key: item.url || item.text, class: "breadcrumb-item", onKeyDown: e => {
                 if (e.key === 'Enter' || e.key === ' ') {
                     const linkElement = e.currentTarget.querySelector('a');
                     linkElement?.click();
                     e.preventDefault();
                 }
-            } }, item.url ? h("a", { href: item.url }, item.text) : h("span", null, item.text)))))))) : (visibleItems.map(item => (h("li", null, h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text))))), this.lastItem && (h("li", { key: '81337a6c458f5d9eb761f7764f12db3b442d310f', "aria-current": "page" }, h("post-breadcrumb-item", { key: 'af840f26afe472d479bc8515252f4dca1f565f55', url: this.lastItem.url, tabindex: -1 }, this.lastItem.text)))), h("div", { key: 'ea12eee48b386a1dc35978269e20f0e360d72e59', class: "hidden-items" }, h("a", { key: '9a0427d1dbdd98b7174fbe8d117d3ab36e66ffe3', href: this.homeUrl, class: "hidden-breadcrumb-item" }, h("span", { key: '661f29d2c9c2acb6d46c98f06b56e561f488c750', class: "visually-hidden" }, this.homeText), h("post-icon", { key: 'e7585ea456944250e55915cdc38496c050a81a12', name: "home", class: "home-icon" })), this.breadcrumbItems.map(item => (h("post-breadcrumb-item", { url: item.url, key: `hidden-${item.url || item.text}`, class: "hidden-breadcrumb-item" }, item.text)))))));
+            } }, item.url ? h("a", { href: item.url }, item.text) : h("span", null, item.text)))))))) : (visibleItems.map(item => (h("li", null, h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text))))), this.lastItem && (h("li", { key: '5209d2ddf74d62f792bb472825f699acaf30bc07', "aria-current": "page" }, h("post-breadcrumb-item", { key: '0b8aa3f765e776c2fa971f7c8762280194cc1b0f', url: this.lastItem.url, tabindex: -1 }, this.lastItem.text)))), h("div", { key: '704affacb1515b48e4b129f1ef2c2d314ddd00d6', class: "hidden-items" }, h("a", { key: '2562e65299bff39a0d1c8d4b20d2ecc4d6747f4c', href: this.homeUrl, class: "hidden-breadcrumb-item" }, h("span", { key: '75d352977ecd05fc5fa2bb5f26ed40e809961c3d', class: "visually-hidden" }, this.homeText), h("post-icon", { key: 'b24fbc251d0a519fa03f85dd36413f3c79ece47c', name: "home", class: "home-icon" })), this.breadcrumbItems.map(item => (h("post-breadcrumb-item", { url: item.url, key: `hidden-${item.url || item.text}`, class: "hidden-breadcrumb-item" }, item.text)))))));
     }
     get host() { return this; }
     static get watchers() { return {
         "homeUrl": ["validateHomeUrl"],
         "homeText": ["validateHomeText"],
-        "menuLabel": ["validateLabel"]
+        "label": ["validateLabel"],
+        "menuLabel": ["validateMenuLabel"]
     }; }
     static get style() { return postBreadcrumbsCss; }
 }, [1, "post-breadcrumbs", {
         "homeUrl": [1, "home-url"],
         "homeText": [1, "home-text"],
+        "label": [1],
         "menuLabel": [1, "menu-label"],
         "breadcrumbItems": [32],
         "isConcatenated": [32],
@@ -141,7 +143,8 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumbs
     }, undefined, {
         "homeUrl": ["validateHomeUrl"],
         "homeText": ["validateHomeText"],
-        "menuLabel": ["validateLabel"]
+        "label": ["validateLabel"],
+        "menuLabel": ["validateMenuLabel"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

package/dist/components/post-closebutton2.js

@@ -6,7 +6,7 @@ import { d as defineCustomElement$1 } from './post-icon2.js';
 
 const BUTTON_TYPES = ['button', 'submit', 'reset'];
 
-const postClosebuttonCss = ".visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-closebutton .btn{padding:0;border:unset;min-height:unset;min-width:unset;width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1);border-radius:var(--post-device-border-radius-round);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}post-closebutton .btn>post-icon{min-width:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4);height:var(--post-device-sizing-interactive-icon-size4)}post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{cursor:pointer;background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{color:HighlightText !important}}";
+const postClosebuttonCss = ".visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-closebutton .btn{padding:0;border:unset;min-height:unset;min-width:unset;width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1);border-radius:var(--post-device-border-radius-round);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);display:flex;align-items:center;justify-content:center}post-closebutton .btn>post-icon{min-width:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4);height:var(--post-device-sizing-interactive-icon-size4)}post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{cursor:pointer;background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{color:HighlightText !important}}";
 
 const PostClosebutton = /*@__PURE__*/ proxyCustomElement(class PostClosebutton extends HTMLElement {
     constructor() {

package/dist/components/post-mainnavigation.js

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 import { v as version } from './package.js';
 import { d as defineCustomElement$2 } from './post-icon2.js';
 
-const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger 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;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px;outline-offset:-2px !important}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation>button,post-mainnavigation post-megadropdown-trigger button{border:1px solid ButtonBorder !important}post-mainnavigation>button:hover::after,post-mainnavigation>button[aria-expanded=true]::after,post-mainnavigation post-megadropdown-trigger button:hover::after,post-mainnavigation post-megadropdown-trigger button[aria-expanded=true]::after{color:HighlightText}}@media screen and (min-width: 1024px){post-mainnavigation{display:flex;overflow:hidden;height:var(--post-main-navigation-height, 0);background:#fff;user-select:none}post-mainnavigation nav{flex:1 1 auto;overflow:hidden;scroll-behavior:smooth}post-mainnavigation .scroll-control{cursor:pointer;z-index:5;padding:1rem;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{margin-inline-end:-3rem}post-mainnavigation .scroll-control.scroll-right{margin-inline-start:-3rem}post-mainnavigation .scroll-control.d-none{display:none}post-mainnavigation .scroll-control post-icon{font-size:1rem}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--post-main-navigation-height, 0);gap:4px;font-size:16px;z-index:4}}@media screen and (min-width: 1024px)and (max-width: 1023.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{z-index:5}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;inset-inline-start:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a.active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.active .nav-el-active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.active .nav-el-active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.active .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.active .nav-el-inactive,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.active .nav-el-inactive,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.active .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)).active,post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-current=page],post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-expanded=true],post-mainnavigation post-megadropdown a.active,post-mainnavigation post-megadropdown a[aria-current=page],post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .scroll-control{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.active,post-mainnavigation post-list-item>a[aria-current=page],post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,post-mainnavigation post-list-item>button[aria-current=page],post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page],post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}";
+const postMainnavigationCss = ":root{--post-icon-chevrondown:url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxzeW1ib2wgaWQ9ImktY2hldnJvbmRvd24iPjxzeW1ib2wgaWQ9InMxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48cGF0aCBkPSJNMi4wMSA1LjIyYzAtLjE5LjA3LS4zOC4yMi0uNTMuMjktLjI5Ljc3LS4yOSAxLjA2IDBsNC43MiA0LjcyIDQuNzItNC43MmMuMjktLjI5Ljc3LS4yOSAxLjA2IDBzLjI5Ljc3IDAgMS4wNmwtNS43OCA1Ljc4LTUuNzgtNS43OGEuNzQuNzQgMCAwIDEtLjIyLS41MyIvPjwvc3ltYm9sPjxzeW1ib2wgaWQ9InMyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMy4yNiA3Ljg1YzAtLjIyLjA4LS40NS4yNi0uNjIuMzQtLjM0LjktLjM0IDEuMjQgMGw3LjI2IDcuMjYgNy4yNi03LjI2Yy4zNC0uMzQuOS0uMzQgMS4yNCAwcy4zNC45IDAgMS4yNGwtOC41IDguNS04LjUxLTguNWEuOS45IDAgMCAxLS4yNi0uNjJaIi8+PC9zeW1ib2w+PHN5bWJvbCBpZD0iczMyIiB2aWV3Qm94PSIwIDAgMzIgMzIiPjxwYXRoIGQ9Ik00LjUgMTAuNTRjMC0uMjYuMS0uNTEuMjktLjcxYS45OTYuOTk2IDAgMCAxIDEuNDEgMGw5Ljc5IDkuNzkgOS44LTkuOGEuOTk2Ljk5NiAwIDEgMSAxLjQxIDEuNDFMMTUuOTkgMjIuNDQgNC44IDExLjI1Yy0uMi0uMi0uMjktLjQ1LS4yOS0uNzFaIi8+PC9zeW1ib2w+PHN5bWJvbCBpZD0iczQwIiB2aWV3Qm94PSIwIDAgNDAgNDAiPjxwYXRoIGQ9Ik01LjggMTMuMTdhMS4xMjMgMS4xMjMgMCAwIDEgMS45Mi0uOEwyMC4wNSAyNC43bDEyLjM0LTEyLjM0Yy40NC0uNDQgMS4xNS0uNDQgMS41OSAwcy40NCAxLjE1IDAgMS41OUwyMC4wNSAyNy44OCA2LjEzIDEzLjk3Yy0uMjItLjIyLS4zMy0uNTEtLjMzLS44Ii8+PC9zeW1ib2w+PHN5bWJvbCBpZD0iczQ4IiB2aWV3Qm94PSIwIDAgNDggNDgiPjxwYXRoIGQ9Ik03IDE1Ljg3YzAtLjMyLjEyLS42NC4zNy0uODhhMS4yNSAxLjI1IDAgMCAxIDEuNzcgMGwxNC44NyAxNC44NyAxNC44OC0xNC44OGMuNDktLjQ5IDEuMjgtLjQ5IDEuNzcgMHMuNDkgMS4yOCAwIDEuNzdMMjQuMDIgMzMuMzkgNy4zNyAxNi43NWMtLjI0LS4yNC0uMzctLjU2LS4zNy0uODgiLz48L3N5bWJvbD48c3ltYm9sIGlkPSJzNjQiIHZpZXdCb3g9IjAgMCA2NCA2NCI+PHBhdGggZD0iTTkuNjMgMjEuMjRhMS4zOCAxLjM4IDAgMCAxIDIuMzUtLjk3TDMyLjAxIDQwLjNsMjAuMDQtMjAuMDRjLjU0LS41NCAxLjQxLS41NCAxLjk1IDBzLjU0IDEuNDEgMCAxLjk1TDMyLjAxIDQ0LjE5IDEwLjAzIDIyLjIyYy0uMjctLjI3LS40LS42Mi0uNC0uOTdaTTAgLjAzaDY0djY0SDB6Ii8+PC9zeW1ib2w+PHVzZSBzdHlsZT0iZGlzcGxheTogdmFyKC0tczE2LCBub25lKSIgaHJlZj0iI3MxNiIvPjx1c2Ugc3R5bGU9ImRpc3BsYXk6IHZhcigtLXMyNCwgbm9uZSkiIGhyZWY9IiNzMjQiLz48dXNlIHN0eWxlPSJkaXNwbGF5OiB2YXIoLS1zMzIsIG5vbmUpIiBocmVmPSIjczMyIi8+PHVzZSBzdHlsZT0iZGlzcGxheTogdmFyKC0tczQwLCBub25lKSIgaHJlZj0iI3M0MCIvPjx1c2Ugc3R5bGU9ImRpc3BsYXk6IHZhcigtLXM0OCwgbm9uZSkiIGhyZWY9IiNzNDgiLz48dXNlIHN0eWxlPSJkaXNwbGF5OiB2YXIoLS1zNjQsIG5vbmUpIiBocmVmPSIjczY0Ii8+PC9zeW1ib2w+PC9kZWZzPjxzdHlsZT5AbWVkaWEgKG1heC13aWR0aDogMjMuOThweCkge2d7LS1zMTY6YmxvY2s7fX1AbWVkaWEgKG1pbi13aWR0aDogMjRweCkgYW5kIChtYXgtd2lkdGg6IDMxLjk4cHgpIHtney0tczI0OmJsb2NrO319QG1lZGlhIChtaW4td2lkdGg6IDMycHgpIGFuZCAobWF4LXdpZHRoOiAzOS45OHB4KSB7Z3stLXMzMjpibG9jazt9fUBtZWRpYSAobWluLXdpZHRoOiA0MHB4KSBhbmQgKG1heC13aWR0aDogNDcuOThweCkge2d7LS1zNDA6YmxvY2s7fX1AbWVkaWEgKG1pbi13aWR0aDogNDhweCkgYW5kIChtYXgtd2lkdGg6IDYzLjk4cHgpIHtney0tczQ4OmJsb2NrO319QG1lZGlhIChtaW4td2lkdGg6IDY0cHgpIHtney0tczY0OmJsb2NrO319PC9zdHlsZT48Zz48dXNlIGhyZWY9IiNpLWNoZXZyb25kb3duIi8+PC9nPjwvc3ZnPg==\")}post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger 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;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px;outline-offset:-2px !important}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:var(--post-icon-chevrondown);background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation>button,post-mainnavigation post-megadropdown-trigger button{border:1px solid ButtonBorder !important}post-mainnavigation>button:hover::after,post-mainnavigation>button[aria-expanded=true]::after,post-mainnavigation post-megadropdown-trigger button:hover::after,post-mainnavigation post-megadropdown-trigger button[aria-expanded=true]::after{color:HighlightText}}@media screen and (min-width: 1024px){post-mainnavigation{display:flex;overflow:hidden;height:var(--post-main-navigation-height, 0);background:#fff;user-select:none}post-mainnavigation nav{flex:1 1 auto;overflow:hidden;scroll-behavior:smooth}post-mainnavigation .scroll-control{cursor:pointer;z-index:5;padding:1rem;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{margin-inline-end:-3rem}post-mainnavigation .scroll-control.scroll-right{margin-inline-start:-3rem}post-mainnavigation .scroll-control.d-none{display:none}post-mainnavigation .scroll-control post-icon{font-size:1rem}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--post-main-navigation-height, 0);gap:4px;font-size:16px;z-index:4}}@media screen and (min-width: 1024px)and (max-width: 1023.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{z-index:5}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;inset-inline-start:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a.active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.active .nav-el-active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.active .nav-el-active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.active .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.active .nav-el-inactive,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.active .nav-el-inactive,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.active .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)).active,post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-current=page],post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-expanded=true],post-mainnavigation post-megadropdown a.active,post-mainnavigation post-megadropdown a[aria-current=page],post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .scroll-control{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.active,post-mainnavigation post-list-item>a[aria-current=page],post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,post-mainnavigation post-list-item>button[aria-current=page],post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page],post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}";
 
 const SCROLL_REPEAT_INTERVAL = 100; // Interval for repeated scrolling when holding down scroll button
 const NAVBAR_DISABLE_DURATION = 400; // Duration to temporarily disable navbar interactions during scrolling

package/dist/components/post-megadropdown-trigger.js

@@ -100,7 +100,7 @@ const PostMegadropdownTrigger$1 = /*@__PURE__*/ proxyCustomElement(class PostMeg
         document.removeEventListener('postToggleMegadropdown', this.handleToggleMegadropdown);
     }
     render() {
-        return (h(Host, { key: 'a817027c84bb4a3418807ccbb200d36190e03d6f', "data-version": version, "tab-index": "-1" }, h("button", { key: '1e560734f4a5f742a9efa2bff6833c1ae3e11117' }, h("slot", { key: '42bf1a30f432b1fcf8e0fec1cd1d499126623234' }))));
+        return (h(Host, { key: '838bff4fe3feac679b522c2f7a166ac7aa5c2bf9', "data-version": version, "tab-index": "-1" }, h("button", { key: 'b5a90298610863e46447198642b5a27b8702aefc' }, h("slot", { key: '14c83456eb056f48143edcd2c532bca017c60171' }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/post-megadropdown.js

@@ -3,7 +3,7 @@ import { g as getFocusableChildren } from './get-focusable-children.js';
 import { v as version } from './package.js';
 import { b as breakpoint } from './breakpoints.js';
 
-const postMegadropdownCss = "@keyframes slide-in{0%{transform:translateX(100%)}100%{transform:translateX(0%)}}@keyframes slide-out{from{transform:translateX(0%)}to{transform:translateX(100%)}}@keyframes slide-down{from{transform:translateY(-100%)}to{transform:translateY(0%)}}@keyframes slide-up{0%{transform:translateY(0%)}100%{transform:translateY(-100%)}}*,::before,::after{box-sizing:border-box}.megadropdown-container{box-shadow:0 8px 6px rgba(0,0,0,.16);position:absolute;background-color:#fafafa;border:none;z-index:1;width:100%;inset-block-start:100%;inset-inline-start:0;border-radius:0}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown-container{border-block-end:1px solid CanvasText}}.megadropdown-container.slide-in{animation:slide-down 350ms forwards}.megadropdown-container.slide-out{animation:slide-up 350ms forwards}@media screen and (max-width: 1023.98px){.megadropdown-container{z-index:5;position:fixed;inset-block-start:var(--post-header-navigation-current-inset);inset-inline:0;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));border-block-start:unset;overflow-y:auto;overscroll-behavior:contain}.megadropdown-container.slide-in{animation:slide-in 350ms forwards}.megadropdown-container.slide-out{animation:slide-out 350ms forwards}}@media screen and (min-width: 1024px){.megadropdown-container{max-height:calc(100vh - var(--post-header-height) - 48px);overflow-y:auto}}.megadropdown{padding:31px 40px 40px;background-color:#fafafa}@media screen and (max-width: 1023.98px){.megadropdown{display:flex;flex-direction:column;width:inherit;padding:16px 32px 24px}}@media screen and (max-width: 599.98px){.megadropdown{padding-inline:16px}}.megadropdown .megadropdown-content{gap:1.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(min(15vw, 100%), 1fr));grid-auto-rows:1fr auto;grid-auto-flow:dense}@media screen and (max-width: 1023.98px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.98px){.megadropdown .megadropdown-content{grid-template-columns:1fr}}.megadropdown h2{display:none;margin-block:0 8px;font-weight:900}.megadropdown h2 a{text-decoration:none;display:none;font-weight:inherit;border-block:0}@media screen and (max-width: 1023.98px){.megadropdown h2{display:block;font-size:1.25rem}}@media screen and (max-width: 599.98px){.megadropdown h2{font-size:1.125rem}}.megadropdown post-list{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0px}.megadropdown post-list>[role=list]{flex-direction:unset;display:unset}.megadropdown post-list>*{width:100%}.megadropdown post-list .list-title{display:flex;flex-direction:column-reverse;height:100%}.megadropdown post-list .list-title h3{font-size:20px;display:block;font-weight:900}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:16px 12px 14px 8px}.megadropdown post-list .list-title h3:not(:has(a)){position:relative}.megadropdown post-list .list-title h3:not(:has(a))::before{content:\"\";background-color:#050400;inset-block-end:0;inset-inline-start:0;width:100%;height:2px;position:absolute}.megadropdown post-list .list-title h3 a{border-radius:0;text-decoration:none;font-size:inherit;display:flex;align-items:center;justify-content:space-between;min-height:53px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset;font-weight:900}.megadropdown post-list .list-title h3 a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown post-list .list-title h3 a.active,.megadropdown post-list .list-title h3 a[aria-current=page],.megadropdown post-list .list-title h3 a[aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown post-list .list-title h3 a:hover{background-color:#504f4b;color:#fff}.megadropdown post-list .list-title h3 a:hover::before{background-color:#504f4b}.megadropdown post-list .list-title h3 a::before{height:2px}@media screen and (max-width: 1023.98px){.megadropdown post-list .list-title h3{font-size:1rem}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:14px 12px 12px 8px}}@media screen and (max-width: 599.98px){.megadropdown post-list .list-title h3{font-size:.875rem}}.megadropdown post-list-item>a{padding-block:13px 12px;padding-inline-start:8px;display:flex;text-decoration:none;width:100%;min-width:100%;height:auto;min-height:48px;white-space:normal;word-break:break-word}.megadropdown post-list-item>a:hover{border-block-width:0}@media screen and (min-width: 1024px){.megadropdown post-list-item>a{font-size:1.25rem}}@media screen and (max-width: 1023.98px){.megadropdown post-list-item>a{padding-block:12px 11px}}@media screen and (max-width: 599.98px){.megadropdown post-list-item>a{font-size:.875rem}}.megadropdown .back-button{display:none;margin-block-end:2rem}.megadropdown .back-button .btn{width:auto}@media screen and (max-width: 1023.98px){.megadropdown .back-button{order:-1;display:block}}.megadropdown .close-button{position:absolute;inset-block-start:1rem;inset-inline-end:1rem}@media screen and (max-width: 1023.98px){.megadropdown .close-button{display:none}}";
+const postMegadropdownCss = "@keyframes slide-in{0%{transform:translateX(100%)}100%{transform:translateX(0%)}}@keyframes slide-out{from{transform:translateX(0%)}to{transform:translateX(100%)}}@keyframes slide-down{from{transform:translateY(-100%)}to{transform:translateY(0%)}}@keyframes slide-up{0%{transform:translateY(0%)}100%{transform:translateY(-100%)}}*,::before,::after{box-sizing:border-box}.megadropdown-container{box-shadow:0 8px 6px rgba(0,0,0,.16);position:absolute;background-color:#fafafa;border:none;z-index:1;width:100%;inset-block-start:100%;inset-inline-start:0;border-radius:0}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown-container{border-block-end:1px solid CanvasText}}.megadropdown-container.slide-in{animation:slide-down 350ms forwards}.megadropdown-container.slide-out{animation:slide-up 350ms forwards}@media screen and (max-width: 1023.98px){.megadropdown-container{z-index:5;position:fixed;inset-block-start:var(--post-header-navigation-current-inset);inset-inline:0;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));border-block-start:unset;overflow-y:auto;overscroll-behavior:contain}.megadropdown-container.slide-in{animation:slide-in 350ms forwards}.megadropdown-container.slide-out{animation:slide-out 350ms forwards}}@media screen and (min-width: 1024px){.megadropdown-container{max-height:calc(100vh - var(--post-header-height) - 48px);overflow-y:auto}}.megadropdown{padding:31px 40px 40px;background-color:#fafafa}@media screen and (max-width: 1023.98px){.megadropdown{display:flex;flex-direction:column;width:inherit;padding:16px 32px 24px}}@media screen and (max-width: 599.98px){.megadropdown{padding-inline:16px}}.megadropdown [slot=megadropdown-overview-link]{text-decoration:none;border-radius:0;padding-block:13px 12px;margin-block-end:16px;display:flex;align-items:center;min-height:56px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset}.megadropdown [slot=megadropdown-overview-link]::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown [slot=megadropdown-overview-link].active,.megadropdown [slot=megadropdown-overview-link][aria-current=page],.megadropdown [slot=megadropdown-overview-link][aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown [slot=megadropdown-overview-link]:hover{background-color:#504f4b;color:#fff}.megadropdown [slot=megadropdown-overview-link]:hover::before{background-color:#504f4b}@media screen and (max-width: 1023.98px){.megadropdown [slot=megadropdown-overview-link]{padding-block:12px 11px;min-height:unset}}@media screen and (max-width: 599.98px){.megadropdown [slot=megadropdown-overview-link]{padding-block:10px 9px}}.megadropdown .megadropdown-content{gap:1.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(min(15vw, 100%), 1fr));grid-auto-rows:1fr auto;grid-auto-flow:dense}@media screen and (max-width: 1023.98px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.98px){.megadropdown .megadropdown-content{grid-template-columns:1fr}}.megadropdown h2{display:none;margin-block:0 8px;font-weight:900}.megadropdown h2 a{text-decoration:none;display:none;font-weight:inherit;border-block:0}@media screen and (max-width: 1023.98px){.megadropdown h2{display:block;font-size:1.25rem}}@media screen and (max-width: 599.98px){.megadropdown h2{font-size:1.125rem}}.megadropdown post-list{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0px}.megadropdown post-list>[role=list]{flex-direction:unset;display:unset}.megadropdown post-list>*{width:100%}.megadropdown post-list .list-title{display:flex;flex-direction:column-reverse;height:100%}.megadropdown post-list .list-title h3{font-size:20px;display:block;font-weight:900}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:16px 12px 14px 8px}.megadropdown post-list .list-title h3:not(:has(a)){position:relative}.megadropdown post-list .list-title h3:not(:has(a))::before{content:\"\";background-color:#050400;inset-block-end:0;inset-inline-start:0;width:100%;height:2px;position:absolute}.megadropdown post-list .list-title h3 a{border-radius:0;text-decoration:none;font-size:inherit;display:flex;align-items:center;justify-content:space-between;min-height:53px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset;font-weight:900}.megadropdown post-list .list-title h3 a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown post-list .list-title h3 a.active,.megadropdown post-list .list-title h3 a[aria-current=page],.megadropdown post-list .list-title h3 a[aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown post-list .list-title h3 a:hover{background-color:#504f4b;color:#fff}.megadropdown post-list .list-title h3 a:hover::before{background-color:#504f4b}.megadropdown post-list .list-title h3 a::before{height:2px}@media screen and (max-width: 1023.98px){.megadropdown post-list .list-title h3{font-size:1rem}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:14px 12px 12px 8px}}@media screen and (max-width: 599.98px){.megadropdown post-list .list-title h3{font-size:.875rem}}.megadropdown post-list-item>a{padding-block:13px 12px;padding-inline-start:8px;display:flex;text-decoration:none;width:100%;min-width:100%;height:auto;min-height:48px;white-space:normal;word-break:break-word}.megadropdown post-list-item>a:hover{border-block-width:0}@media screen and (min-width: 1024px){.megadropdown post-list-item>a{font-size:1.25rem}}@media screen and (max-width: 1023.98px){.megadropdown post-list-item>a{padding-block:12px 11px}}@media screen and (max-width: 599.98px){.megadropdown post-list-item>a{font-size:.875rem}}.megadropdown .back-button{display:none;margin-block-end:2rem}.megadropdown .back-button .btn{width:auto}@media screen and (max-width: 1023.98px){.megadropdown .back-button{order:-1;display:block}}.megadropdown .close-button{position:absolute;inset-block-start:1rem;inset-inline-end:1rem}@media screen and (max-width: 1023.98px){.megadropdown .close-button{display:none}}";
 
 const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown extends HTMLElement {
     constructor() {
@@ -41,7 +41,9 @@ const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdo
     }
     get megadropdownTrigger() {
         const hostId = this.host.getAttribute('id');
-        return hostId ? document.querySelector(`post-megadropdown-trigger[for="${hostId}"] > button`) : null;
+        return hostId
+            ? document.querySelector(`post-megadropdown-trigger[for="${hostId}"] > button`)
+            : null;
     }
     connectedCallback() {
         window.addEventListener('postBreakpoint:device', this.breakpointChange.bind(this));
@@ -145,6 +147,11 @@ const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdo
     getFocusableElements() {
         const focusableEls = Array.from(this.host.querySelectorAll('post-list-item, h3, .back-button'));
         const focusableChildren = focusableEls.flatMap(el => Array.from(getFocusableChildren(el)));
+        // Check for an overview link
+        const overviewLink = this.host.querySelector('a[slot="megadropdown-overview-link"]');
+        if (overviewLink) {
+            focusableChildren.unshift(overviewLink);
+        }
         this.firstFocusableEl = focusableChildren[0];
         this.lastFocusableEl = focusableChildren[focusableChildren.length - 1];
     }
@@ -222,7 +229,7 @@ const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdo
     }
     render() {
         const containerStyle = this.isVisible ? {} : { display: 'none' };
-        return (h(Host, { key: '40023f8684db4cfff78f69d2d5786e4c3a0332b4', version: version }, h("div", { key: '986f114148d355b7a6e92c19d1c02c925eb27fce', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: 'c14d01be681f596148d39f272375615eafdf25c0', class: "megadropdown" }, h("slot", { key: '5f60ff26e694c107c569e06d30e18a5940d3e7b1', name: "megadropdown-title" }), h("div", { key: '49202a8a0dcebc086220db637cf25d96510b6eac', class: "megadropdown-content" }, h("slot", { key: '98593b2824d21f065b4c183c8980d94136b175bf' })), h("div", { key: 'ed1dfbbebd101a98153657007f8037c0282b47ef', onClick: () => this.hide(true), class: "back-button" }, h("slot", { key: '4e737d72e77271cb025976ae5e5fe4d5f653480a', name: "back-button" })), h("div", { key: '0bf1316c091efbf294be89efeebae7937c013b29', onClick: () => this.hide(true), class: "close-button" }, h("slot", { key: '594a412944fff3fee09639b85cc13a9291b96a10', name: "close-button" }))))));
+        return (h(Host, { key: '341ea7fd69a095bc0f18b0f73c3ac5247784dd33', version: version }, h("div", { key: '078435c707ec6b2e0d51f8adad5502729513af63', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: 'ad92234d06bccbc60a2e1a6cc63634535646c4f7', class: "megadropdown" }, h("slot", { key: 'f9779e130c7709912c12d30b554ff8f478840628', name: "megadropdown-title" }), h("slot", { key: 'e079e0381a0ce7e3ab7efd974cdf36e6938a378d', name: "megadropdown-overview-link" }), h("div", { key: '508d4e9bddb727e960aa6f2dc15515f1718aa2b9', class: "megadropdown-content" }, h("slot", { key: '442bb0b169824ed66ae5e7da9acd6bb7d759b6f5' })), h("div", { key: 'cc278c0b5680019270206fbde4ce7a83341a029a', onClick: () => this.hide(true), class: "back-button" }, h("slot", { key: '9c42fa29e89f60af62ab5d04d01e1764b36ebec4', name: "back-button" })), h("div", { key: '62bcc5bcc348cb45289ded98273804ab547471ef', onClick: () => this.hide(true), class: "close-button" }, h("slot", { key: '2cdf1d72f62a162bfb1596507063315430953096', name: "close-button" }))))));
     }
     get host() { return this; }
     static get style() { return postMegadropdownCss; }

package/dist/components/post-menu-item2.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { v as version } from './package.js';
 
-const postMenuItemCss = "post-menu-item 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}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button{background-color:ButtonFace !important}post-menu-item button:hover{background-color:Highlight !important}}post-menu-item a{text-decoration:none}post-menu-item button,post-menu-item a{position:relative;display:flex;width:100%;align-items:center;padding:.5rem .75rem .5rem 1rem;gap:.5rem;font-size:.875rem;color:#050400;border-radius:0}post-menu-item button post-icon,post-menu-item a post-icon{width:1.25rem;height:1.25rem;margin:.125rem}@media screen and (min-width: 780px){post-menu-item button,post-menu-item a{font-size:1rem;padding-block:.75rem;gap:1rem}post-menu-item button post-icon,post-menu-item a post-icon{width:1.375rem;height:1.375rem;margin:0}}@media screen and (min-width: 1024px){post-menu-item button,post-menu-item a{font-size:1.25rem;padding-block:.8125rem}post-menu-item button post-icon,post-menu-item a post-icon{width:1.5rem;height:1.5rem}}post-menu-item button:focus-visible,post-menu-item a:focus-visible{outline-offset:2px !important;border-radius:4px}post-menu-item button:hover,post-menu-item a:hover{background-color:#504f4b;color:#fff}";
+const postMenuItemCss = "post-menu-item 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}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button{background-color:ButtonFace !important}post-menu-item button:hover{background-color:Highlight !important}}post-menu-item a{text-decoration:none}post-menu-item button,post-menu-item a{position:relative;display:flex;width:100%;align-items:center;padding:.5rem .75rem .5rem 1rem;gap:.75rem;font-size:.875rem;color:#050400;border-radius:0}post-menu-item button post-icon,post-menu-item a post-icon{width:1rem;height:1rem;margin-block:.25rem}@media screen and (min-width: 780px){post-menu-item button,post-menu-item a{font-size:1rem;padding-block:.75rem;gap:1rem}post-menu-item button post-icon,post-menu-item a post-icon{width:1.5rem;height:1.5rem;margin:0}}@media screen and (min-width: 1024px){post-menu-item button,post-menu-item a{font-size:1.25rem;padding-block:.8125rem}}post-menu-item button:focus-visible,post-menu-item a:focus-visible{outline-offset:2px !important;border-radius:4px}post-menu-item button:hover,post-menu-item a:hover{background-color:#504f4b;color:#fff}";
 
 const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends HTMLElement {
     constructor() {
@@ -9,7 +9,7 @@ const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends
         this.__registerHost();
     }
     render() {
-        return (h(Host, { key: '6b2c8542aed22132c627fadb6be036124e37853e', "data-version": version }, h("slot", { key: '8059cb5112270641ef7ba860cdacb2cdaa75fd59' })));
+        return (h(Host, { key: 'd37c4eed483b46dedcccbc835017ff2415dbd22e', "data-version": version }, h("slot", { key: 'e13d1f35e7883a0aee4d08ceb39caeb97fb960ec' })));
     }
     static get style() { return postMenuItemCss; }
 }, [4, "post-menu-item"]);

package/dist/components/post-menu-trigger2.js

@@ -80,7 +80,7 @@ const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger e
         }
     }
     render() {
-        return (h(Host, { key: 'e4ab1c0cd7227b83994cbd74f2bb3fe88c48126e', "data-version": version, "tab-index": "-1" }, h("slot", { key: '9c5aa5d42457f6716c7607b50b5453cdce8d50d0' })));
+        return (h(Host, { key: 'fc962802089652073c19cc35a511e48b0cab43b7', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'd3a8b40c0a88c44092b56ca4aa1c74f880bebb20' })));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/post-menu2.js

@@ -58,35 +58,32 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
                 this.controlKeyDownHandler(e);
             }
         };
-        this.handlePostToggle = (event) => {
+        this.handlePostShown = (event) => {
+            // Only for the first open
+            if (event.detail.first) {
+                // Add "menu" and "menuitem" aria roles and aria-label
+                this.host.setAttribute('role', 'menu');
+                const menuItems = this.getSlottedItems();
+                for (const item of menuItems) {
+                    item.setAttribute('role', 'menuitem');
+                }
+                if (this.label)
+                    this.host.setAttribute('aria-label', this.label);
+            }
+        };
+        this.handlePostToggled = (event) => {
             this.isVisible = event.detail.isOpen;
             this.toggleMenu.emit(this.isVisible);
-            requestAnimationFrame(() => {
-                if (this.isVisible) {
-                    this.lastFocusedElement = this.root?.activeElement;
-                    const menuItems = this.getSlottedItems();
-                    if (event.detail.first) {
-                        if (menuItems.length > 0) {
-                            // Add role="menu" to the popovercontainer
-                            this.host.setAttribute('role', 'menu');
-                            // Add role="menuitem" to the focusable elements
-                            menuItems.forEach(item => {
-                                item.setAttribute('role', 'menuitem');
-                            });
-                            // Add aria-label to the menu
-                            if (this.label)
-                                this.host.setAttribute('aria-label', this.label);
-                        }
-                    }
+            if (this.isVisible) {
+                this.lastFocusedElement = this.root?.activeElement;
+                const menuItems = this.getSlottedItems();
+                if (menuItems.length > 0) {
                     menuItems[0].focus();
                 }
-                else if (this.lastFocusedElement) {
-                    setTimeout(() => {
-                        // This timeout is added for NVDA to announce the menu as collapsed
-                        this.lastFocusedElement.focus();
-                    }, 0);
-                }
-            });
+            }
+            else if (this.lastFocusedElement) {
+                this.lastFocusedElement.focus();
+            }
         };
         this.handleClick = (e) => {
             const target = e.target;
@@ -109,14 +106,10 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
     disconnectedCallback() {
         this.host.removeEventListener('keydown', this.handleKeyDown);
         this.host.removeEventListener('click', this.handleClick);
-        this.popoverRef?.removeEventListener('postToggle', this.handlePostToggle);
     }
     componentDidLoad() {
         this.validatePlacement();
         this.validateLabel();
-        if (this.popoverRef) {
-            this.popoverRef.addEventListener('postToggle', this.handlePostToggle);
-        }
     }
     /**
      * Toggles the menu visibility based on its current state.
@@ -200,7 +193,7 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
             .flatMap(el => Array.from(getFocusableChildren(el))));
     }
     render() {
-        return (h(Host, { key: 'd98d7b0a1c607732ab12c94f8d872408a053c19b', "data-version": version }, h("post-popovercontainer", { key: '669e6062e5ff0dfac0d311cc8fdd0bb51735aac1', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '6bc1abb7b764e9e6985a839904ed5575ea20a519', part: "menu" }, h("slot", { key: '6b8670f2e80ed93761797b9161ddf54bb88f73ec', name: "header" }), h("slot", { key: '971f39ae63f22a503e36aeecb67575304ce14248' })))));
+        return (h(Host, { key: '092a180331d50cfe701ad440569e0e6bd4bcd0c8', "data-version": version }, h("post-popovercontainer", { key: '96f33df1a47d2fb1f6f862a7d7f97def5fd8b642', onPostShow: this.handlePostShown, onPostToggle: this.handlePostToggled, placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '5d23d1059dd1cf68ac817acc8227129267a3c5a4', part: "menu" }, h("slot", { key: '020fbf8912393d85cd5a6fd9f65fdf264f2ba6f6', name: "header" }), h("slot", { key: '07cd9cb978ec85dd7fbbaed527520b97484e2030' })))));
     }
     get host() { return this; }
     static get watchers() { return {
@@ -221,7 +214,10 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
     }]);
 __decorate([
     EventFrom('post-popovercontainer')
-], PostMenu.prototype, "handlePostToggle", void 0);
+], PostMenu.prototype, "handlePostShown", void 0);
+__decorate([
+    EventFrom('post-popovercontainer')
+], PostMenu.prototype, "handlePostToggled", void 0);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;

package/dist/components/post-popover-trigger.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface PostPopoverTrigger extends Components.PostPopoverTrigger, HTMLElement {}
+export const PostPopoverTrigger: {
+    prototype: PostPopoverTrigger;
+    new (): PostPopoverTrigger;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;