@swisspost/design-system-components 10.0.0-next.47 → 10.0.0-next.49

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

@@ -13,6 +13,9 @@ import { PLACEMENT_TYPES } from "../../types/index";
 import { version } from "../../../../package";
 import { getFocusableChildren } from "../../utils/get-focusable-children";
 import { getRoot, checkEmptyOrOneOf, EventFrom } from "../../utils/index";
+/**
+ * @part menu - The container element that holds the list of menu items.
+ */
 export class PostMenu {
     constructor() {
         this.lastFocusedElement = null;
@@ -49,18 +52,32 @@ export class PostMenu {
             }
         };
         this.handlePostToggle = (event) => {
-            this.isVisible = event.detail;
+            this.isVisible = event.detail.isOpen;
             this.toggleMenu.emit(this.isVisible);
             requestAnimationFrame(() => {
                 if (this.isVisible) {
                     this.lastFocusedElement = this.root?.activeElement;
                     const menuItems = this.getSlottedItems();
-                    if (menuItems.length > 0) {
-                        menuItems[0].focus();
+                    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);
+                        }
                     }
+                    menuItems[0].focus();
                 }
                 else if (this.lastFocusedElement) {
-                    this.lastFocusedElement.focus();
+                    setTimeout(() => {
+                        // This timeout is added for NVDA to announce the menu as collapsed
+                        this.lastFocusedElement.focus();
+                    }, 0);
                 }
             });
         };
@@ -173,7 +190,7 @@ export class PostMenu {
             .flatMap(el => Array.from(getFocusableChildren(el))));
     }
     render() {
-        return (h(Host, { key: 'bca8873f7f98b03d3e6952bce4990d1c435bd5ec', "data-version": version, role: "menu" }, h("post-popovercontainer", { key: '805c1e528c4af6e35b7881395b2f9de9e430f8c8', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: 'f534119e208f2bb387f39824736aee766f550fa8', part: "menu" }, h("slot", { key: 'ec9ae42dab9aebd93aafdbebd15d8c39736c84df' })))));
+        return (h(Host, { key: '7b7fe6fccd27d3ff12eae3094b1a55b9b9778eb1', "data-version": version }, h("post-popovercontainer", { key: '6dae2883febd1e96ae1b34518dd2e9c634fafecb', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: 'e19c107831b020aa0039ea7a18465e4bb72380c4', part: "menu" }, h("slot", { key: '9d9862e73dd222435d196e67c540bf8266952d94' })))));
     }
     static get is() { return "post-menu"; }
     static get encapsulation() { return "shadow"; }
@@ -214,6 +231,25 @@ export class PostMenu {
                 "setter": false,
                 "reflect": false,
                 "defaultValue": "'bottom'"
+            },
+            "label": {
+                "type": "string",
+                "attribute": "label",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "An accessible name for the menu."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
             }
         };
     }

package/dist/collection/components/post-menu-item/post-menu-item.js

@@ -2,7 +2,7 @@ import { h, Host } from "@stencil/core";
 import { version } from "../../../../package";
 export class PostMenuItem {
     render() {
-        return (h(Host, { key: '6be606f22288f655320c5ef58f3d0f4bf39d7f62', role: "menuitem", "data-version": version }, h("slot", { key: 'a6d4b48b8cb09e27b19cc14def007e3754ff06c0' })));
+        return (h(Host, { key: '9d6015291b82728739de4263a62a59ad4a99c94d', "data-version": version }, h("slot", { key: '51f5ff356cddffc806639cc343437500f898065e' })));
     }
     static get is() { return "post-menu-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/post-menu-trigger/post-menu-trigger.js

@@ -73,7 +73,7 @@ export class PostMenuTrigger {
         }
     }
     render() {
-        return (h(Host, { key: '76b3c59cdae5c78cefaaf1ea2a9668a77bddd37e', "data-version": version, "tab-index": "-1" }, h("slot", { key: '3835d87c3795e694f7493ceb735bd638bdd2dea1' })));
+        return (h(Host, { key: '14592f9564fdb09b2e809374d5794bf71f576dbb', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'a0f463000420df39035cc5a48369d230394b5e04' })));
     }
     static get is() { return "post-menu-trigger"; }
     static get originalStyleUrls() {

package/dist/collection/components/post-popover/post-popover.css

@@ -1 +1 @@
-@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}.btn-close{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;border-radius:var(--post-device-border-radius-round);color:#000;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;cursor:pointer}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{background-color:ButtonFace !important}.btn-close:hover{background-color:Highlight !important}}.btn-close{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}.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.btn-close::before{mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;content:"";display:block;height:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:#000}.btn-close:disabled{color:#999}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{color:CanvasText;forced-color-adjust:none}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:Highlight}}.btn-close-white{color:#e6e6e6}.btn-close-white:focus,.btn-close-white:not(:disabled):hover,.btn-close-white.pretend-hover{color:#fff}.btn-close-white:disabled{color:#999}*{box-sizing:border-box}:host{display:block}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.popover-container{color:var(--post-current-fg);background-color:var(--post-current-bg);display:flex;align-items:self-start;padding:.5em;min-width:160px;max-width:min(var(--post-popover-max-width, 280px),100vw)}.popover-content{padding:.5em;flex-grow:1}.btn-close{color:var(--post-current-fg)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:hover{color:HighlightText !important}}
+.btn-close{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;border-radius:var(--post-device-border-radius-round);color:#000;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;cursor:pointer}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{background-color:ButtonFace !important}.btn-close:hover{background-color:Highlight !important}}.btn-close{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}.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.btn-close::before{mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;content:"";display:block;height:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:#000}.btn-close:disabled{color:#999}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{color:CanvasText;forced-color-adjust:none}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:Highlight}}.btn-close-white{color:#e6e6e6}.btn-close-white:focus,.btn-close-white:not(:disabled):hover,.btn-close-white.pretend-hover{color:#fff}.btn-close-white:disabled{color:#999}*{box-sizing:border-box}:host{display:block}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.popover-container{color:var(--post-current-fg);background-color:var(--post-current-bg);display:flex;align-items:self-start;padding:.5em;min-width:160px;max-width:min(var(--post-popover-max-width, 280px),100vw)}.popover-content{padding:.5em;flex-grow:1}.btn-close{color:var(--post-current-fg)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:hover{color:HighlightText !important}}

package/dist/collection/components/post-popover/post-popover.js

@@ -113,7 +113,7 @@ export class PostPopover {
         trigger.setAttribute('aria-expanded', force ? 'false' : null);
     }
     render() {
-        return (h(Host, { key: 'fe756429b10af594a621b5769f129ee82b1aa6eb', "data-version": version }, h("post-popovercontainer", { key: '437b8c75fc878b3edb916887cfab3933ed08c7b2', arrow: this.arrow, placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '082e00cb11a042cad036252743261395874b0a86', class: "popover-container" }, h("div", { key: 'be2e39304472bf351a524dc4f6eeb3ec9da8fc58', class: "popover-content" }, h("slot", { key: 'e1cd722828d3b136ad96553d81334b31de3289f9' })), h("button", { key: 'b6fa750860d95bf223da9224d6fa8531e577b3a5', class: "btn-close", onClick: () => this.hide() }, h("span", { key: 'dd3fb8e0e0e15c58df5b1aacfe5d4a6b90ec3843', class: "visually-hidden" }, this.closeButtonCaption))))));
+        return (h(Host, { key: 'c0a36766203f4b2f6350c9c92b304eb9052d2ceb', "data-version": version }, h("post-popovercontainer", { key: 'ec9d9e8af53408fd3d2d5aaedab10ccee94322fd', arrow: this.arrow, placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '4edb0a99f660f5b4c1b35a934cc2d21bb84b1c44', class: "popover-container" }, h("div", { key: '96d3fc664e0a8c5d0b877cf46df9e80433909f5e', class: "popover-content" }, h("slot", { key: '978e3335f1214bed829042cfdf6bd7a23ae9229a' })), h("button", { key: 'b42d5a48ba83d6e1b592b0607e837e8036e0cf54', class: "btn-close", onClick: () => this.hide() }, h("span", { key: '95a7cfd1c4b6c30e04a86e58d4cf9a70eec885c8', class: "visually-hidden" }, this.closeButtonCaption))))));
     }
     static get is() { return "post-popover"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-popovercontainer/post-popovercontainer.css

@@ -1 +1 @@
-@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\:popover-open){display:none}}}:where(post-popovercontainer){background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:where(post-popovercontainer)>div{box-shadow:var(--post-device-elevation-300);width:max-content;max-width:100%;color:var(--post-current-fg);background-color:var(--post-current-bg);border-radius:4px}:where(post-popovercontainer)>div.animate-pop-in{animation:popIn .25s ease-out forwards}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:where(post-popovercontainer)>div{border:2px solid rgba(0,0,0,0)}}: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)[safe-space]::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:auto}:where(post-popovercontainer)[safe-space=triangle]::after{clip-path:polygon(var(--post-safe-space-cursor-x, 0) var(--post-safe-space-cursor-y, 0), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)))}:where(post-popovercontainer)[safe-space=trapezoid]::after{clip-path:polygon(var(--post-safe-space-trigger-x-start, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-start, 0)), var(--post-safe-space-trigger-x-end, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-end, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)))}:where(post-popovercontainer):not(:has(.arrow))>div{box-shadow:var(--post-device-elevation-300)}:where(post-popovercontainer):has(.arrow)>div{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)>div{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)>div{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)>div{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-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}
+@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\:popover-open){display:none}}}:where(post-popovercontainer){background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:where(post-popovercontainer)>div{box-shadow:var(--post-device-elevation-300);width:max-content;max-width:100%;color:var(--post-current-fg);background-color:var(--post-current-bg);border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:where(post-popovercontainer)>div{border:2px solid rgba(0,0,0,0)}}: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)[safe-space]::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:auto}:where(post-popovercontainer)[safe-space=triangle]::after{clip-path:polygon(var(--post-safe-space-cursor-x, 0) var(--post-safe-space-cursor-y, 0), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)))}:where(post-popovercontainer)[safe-space=trapezoid]::after{clip-path:polygon(var(--post-safe-space-trigger-x-start, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-start, 0)), var(--post-safe-space-trigger-x-end, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-end, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)))}:where(post-popovercontainer):not(:has(.arrow))>div{box-shadow:var(--post-device-elevation-300)}:where(post-popovercontainer):has(.arrow)>div{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)>div{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)>div{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)>div{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-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}

package/dist/collection/components/post-popovercontainer/post-popovercontainer.js

@@ -5,11 +5,13 @@ import { arrow, autoUpdate, computePosition, flip, inline, limitShift, offset, s
 import { PLACEMENT_TYPES } from "../../types/index";
 // Polyfill for popovers, can be removed when https://caniuse.com/?search=popover is green
 import { apply, isSupported } from "@oddbird/popover-polyfill/fn";
+import { popIn } from "../../animations/pop-in";
 /**
  * @slot - Default slot for placing content inside the popovercontainer.
  */
 export class PostPopovercontainer {
     constructor() {
+        this.firstOpen = true;
         /**
          * Defines the placement of the popovercontainer according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
          * Popovercontainers are automatically flipped to the opposite side if there is not enough available space and are shifted
@@ -109,9 +111,19 @@ export class PostPopovercontainer {
         this.toggleTimeoutId = window.setTimeout(() => (this.toggleTimeoutId = null), 10);
         const isOpen = e.newState === 'open';
         if (isOpen) {
+            const content = this.host.querySelector('.popover-content');
             this.startAutoupdates();
+            if (content && this.animation === 'pop-in') {
+                popIn(content);
+            }
             if (this.safeSpace)
                 window.addEventListener('mousemove', this.mouseTrackingHandler.bind(this));
+            // Emit event with `first` flag only true on the first open
+            if (this.firstOpen) {
+                this.postToggle.emit({ isOpen, first: this.firstOpen });
+                this.firstOpen = false;
+                return;
+            }
         }
         else {
             if (typeof this.clearAutoUpdate === 'function')
@@ -119,7 +131,7 @@ export class PostPopovercontainer {
             if (this.safeSpace)
                 window.removeEventListener('mousemove', this.mouseTrackingHandler.bind(this));
         }
-        this.postToggle.emit(isOpen);
+        this.postToggle.emit({ isOpen: isOpen, first: false });
     }
     /**
      * Start listening for DOM updates, scroll events etc. that have
@@ -250,10 +262,9 @@ export class PostPopovercontainer {
         }
     }
     render() {
-        const animationClass = this.animation ? `animate-${this.animation}` : '';
-        return (h(Host, { key: '357f53696ca28ab2c137d47e2192038dc756c289', "data-version": version, popover: this.manualClose ? 'manual' : 'auto' }, h("div", { key: '9c40bdc5034ccf14157ee1ae8ce33fe58a9049e4', class: animationClass }, this.arrow && (h("span", { key: '6133ab54aaea6f198560ca5cb30f5604318203f6', class: "arrow", ref: el => {
+        return (h(Host, { key: '1594b782ac56ae23eba2df3f452ad40015ace67d', "data-version": version, popover: this.manualClose ? 'manual' : 'auto' }, h("div", { key: '565cbf870aca9abbc665525a627922d1cfdb9195', class: "popover-content" }, this.arrow && (h("span", { key: 'add7d6f7b176e7365b5a0c25fa81dd2a9520e7f3', class: "arrow", ref: el => {
                 this.arrowRef = el;
-            } })), h("slot", { key: '39f53833a3f570b2c8807a5903b531c6733b0ada' }))));
+            } })), h("slot", { key: '308138890a4148c5c94b675e2a6b911fef1c31b5' }))));
     }
     static get is() { return "post-popovercontainer"; }
     static get originalStyleUrls() {
@@ -404,11 +415,11 @@ export class PostPopovercontainer {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Fires whenever the popovercontainer gets shown or hidden, passing the new state in event.details as a boolean"
+                    "text": "Fires whenever the popovercontainer gets shown or hidden, passing in event.detail an object containing two booleans: `isOpen`, which is true if the popovercontainer was opened and false if it was closed, and `first`, which is true if it was opened for the first time."
                 },
                 "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
+                    "original": "{ isOpen: boolean; first?: boolean }",
+                    "resolved": "{ isOpen: boolean; first?: boolean; }",
                     "references": {}
                 }
             }];

package/dist/collection/components/post-rating/post-rating.css

@@ -1 +1 @@
-@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}:host{display:inline-block}.rating{display:flex;flex-wrap:wrap;overflow:hidden;margin:0 calc(var(--post-core-dimension-4)*-1);border-radius:4px}.rating .star{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: #fff;position:relative;width:2rem;height:2rem;cursor:pointer}.rating .star .stroke,.rating .star .fill{display:block;width:100%;height:100%;transition:all ease 100ms}.rating .star .stroke{position:absolute;inset:auto;z-index:1;color:var(--post-rating-star-stroke)}.rating .star .fill{margin:1px;width:calc(100% - 2px);height:calc(100% - 2px);color:var(--post-rating-star-fill)}.rating .star.before-hover{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: #fc0}.rating .star.active{--post-rating-star-stroke: hsl(0, 0%, 20%);--post-rating-star-fill: #fc0}.rating .star.hover{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: #fc0}.rating .star.after-active{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: hsl(0, 0%, 80%)}.rating :focus{outline:none}.rating:focus-visible{outline-offset:var(--post-core-dimension-2);outline:var(--post-core-dimension-2) solid #1976c8}.rating[aria-readonly=true] .star,.rating[aria-disabled=true] .star{cursor:default}.rating[aria-disabled=true] .star{--post-rating-star-stroke: hsl(0, 0%, 60%);--post-rating-star-fill: #fff}.rating[aria-disabled=true] .star.active{cursor:default;--post-rating-star-stroke: hsl(0, 0%, 60%);--post-rating-star-fill: hsl(0, 0%, 90%)}
+:host{display:inline-block}.rating{display:flex;flex-wrap:wrap;overflow:hidden;margin:0 calc(var(--post-core-dimension-4)*-1);border-radius:4px}.rating .star{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: #fff;position:relative;width:2rem;height:2rem;cursor:pointer}.rating .star .stroke,.rating .star .fill{display:block;width:100%;height:100%;transition:all ease 100ms}.rating .star .stroke{position:absolute;inset:auto;z-index:1;color:var(--post-rating-star-stroke)}.rating .star .fill{margin:1px;width:calc(100% - 2px);height:calc(100% - 2px);color:var(--post-rating-star-fill)}.rating .star.before-hover{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: #fc0}.rating .star.active{--post-rating-star-stroke: hsl(0, 0%, 20%);--post-rating-star-fill: #fc0}.rating .star.hover{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: #fc0}.rating .star.after-active{--post-rating-star-stroke: hsl(0, 0%, 40%);--post-rating-star-fill: hsl(0, 0%, 80%)}.rating :focus{outline:none}.rating:focus-visible{outline-offset:var(--post-core-dimension-2);outline:var(--post-core-dimension-2) solid #1976c8}.rating[aria-readonly=true] .star,.rating[aria-disabled=true] .star{cursor:default}.rating[aria-disabled=true] .star{--post-rating-star-stroke: hsl(0, 0%, 60%);--post-rating-star-fill: #fff}.rating[aria-disabled=true] .star.active{cursor:default;--post-rating-star-stroke: hsl(0, 0%, 60%);--post-rating-star-fill: hsl(0, 0%, 90%)}

package/dist/collection/components/post-rating/post-rating.js

@@ -91,7 +91,7 @@ export class PostRating {
         }
     }
     render() {
-        return (h(Host, { key: '588c5d3c4600faa939cab4b673e27d08182323da', "data-version": version }, h("div", { key: '8fced4724505cdc2f3fb3160cf276ed1280b5431', role: "slider", class: "rating", tabindex: "0", "aria-label": this.label, "aria-valuemin": "0", "aria-valuemax": this.stars, "aria-valuenow": this.currentRating, "aria-valuetext": `${this.currentRating} out of ${this.stars}`, "aria-readonly": this.readonly ? 'true' : 'false', onKeyDown: this.keydownHandler, onBlur: this.blurHandler }, Array.from({ length: this.stars }).map((v, i) => (h("div", { key: `star-${v}`, "aria-hidden": "true", class: {
+        return (h(Host, { key: 'b7dcf175b548433023ea3344be40b1b34f366f3c', "data-version": version }, h("div", { key: '1ec0c35a4ec969f489196116c4fdbaf89f203bed', role: "slider", class: "rating", tabindex: "0", "aria-label": this.label, "aria-valuemin": "0", "aria-valuemax": this.stars, "aria-valuenow": this.currentRating, "aria-valuetext": `${this.currentRating} out of ${this.stars}`, "aria-readonly": this.readonly ? 'true' : 'false', onKeyDown: this.keydownHandler, onBlur: this.blurHandler }, Array.from({ length: this.stars }).map((v, i) => (h("div", { key: `star-${v}`, "aria-hidden": "true", class: {
                 'star': true,
                 'before-hover': i < this.hoveredIndex,
                 'active': i < Math.round(this.currentRating),

package/dist/collection/components/post-tab-header/post-tab-header.css

@@ -1 +1 @@
-.tab-title[role=tab]{display:inline-block;cursor:pointer;position:relative;box-sizing:border-box;padding:1rem;transition:background-color 100ms;border-right:1px solid rgba(0,0,0,0);border-left:1px solid rgba(0,0,0,0);outline-color:currentColor;opacity:.7;color:#000;text-decoration:none;background-color:rgba(0,0,0,0)}.tab-title[role=tab]:focus{background-color:unset;color:#000}.tab-title[role=tab]:hover{opacity:1;background-color:rgba(0,0,0,.6);color:#fff}.tab-title[role=tab]:focus-visible{outline:rgba(0,0,0,0);opacity:1;background-color:rgba(0,0,0,.6);color:#fff;box-shadow:none}.tab-title[role=tab]:focus-visible::after{content:"";display:block;position:absolute;top:2px;right:1px;bottom:0;left:1px;box-shadow:0 0 0 1px #fff,0 0 0 2px #333}.tab-title[role=tab].active{z-index:1;border-right-color:#ccc;border-left-color:#ccc;opacity:1;background-color:#fff;color:#000;font-weight:700}.tab-title[role=tab].active::before{content:"";display:block;position:absolute;top:0;right:-1px;left:-1px;height:var(--post-core-dimension-4);background-color:#fc0}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:hover{background-color:rgba(255,255,255,.2)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:focus-visible{background-color:rgba(255,255,255,.2)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tab-title[role=tab]{opacity:1;border-left-color:Canvas;border-right-color:Canvas;color:LinkText}.tab-title[role=tab]:hover,.tab-title[role=tab]:focus,.tab-title[role=tab]:focus-within,.tab-title[role=tab]:focus-visible{outline:var(--post-core-dimension-2) solid Highlight;outline-offset:calc(var(--post-core-dimension-4)*-1)}.tab-title[role=tab].active{border-left-color:ButtonText;border-right-color:ButtonText;color:Highlight}.tab-title[role=tab].active::before{background-color:Highlight}}@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}:host{display:block}.tab-title{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){.tab-title{background-color:ButtonFace !important}.tab-title:hover{background-color:Highlight !important}}
+.tab-title[role=tab]{display:inline-block;cursor:pointer;position:relative;box-sizing:border-box;padding:1rem;transition:background-color 100ms;border-right:1px solid rgba(0,0,0,0);border-left:1px solid rgba(0,0,0,0);outline-color:currentColor;opacity:.7;color:#000;text-decoration:none;background-color:rgba(0,0,0,0)}.tab-title[role=tab]:focus{background-color:unset;color:#000}.tab-title[role=tab]:hover{opacity:1;background-color:rgba(0,0,0,.6);color:#fff}.tab-title[role=tab]:focus-visible{outline:rgba(0,0,0,0);opacity:1;background-color:rgba(0,0,0,.6);color:#fff;box-shadow:none}.tab-title[role=tab]:focus-visible::after{content:"";display:block;position:absolute;top:2px;right:1px;bottom:0;left:1px;box-shadow:0 0 0 1px #fff,0 0 0 2px #333}.tab-title[role=tab].active{z-index:1;border-right-color:#ccc;border-left-color:#ccc;opacity:1;background-color:#fff;color:#000;font-weight:700}.tab-title[role=tab].active::before{content:"";display:block;position:absolute;top:0;right:-1px;left:-1px;height:var(--post-core-dimension-4);background-color:#fc0}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:hover{background-color:rgba(255,255,255,.2)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:focus-visible{background-color:rgba(255,255,255,.2)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tab-title[role=tab]{opacity:1;border-left-color:Canvas;border-right-color:Canvas;color:LinkText}.tab-title[role=tab]:hover,.tab-title[role=tab]:focus,.tab-title[role=tab]:focus-within,.tab-title[role=tab]:focus-visible{outline:var(--post-core-dimension-2) solid Highlight;outline-offset:calc(var(--post-core-dimension-4)*-1)}.tab-title[role=tab].active{border-left-color:ButtonText;border-right-color:ButtonText;color:Highlight}.tab-title[role=tab].active::before{background-color:Highlight}}:host{display:block}.tab-title{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){.tab-title{background-color:ButtonFace !important}.tab-title:hover{background-color:Highlight !important}}

package/dist/collection/components/post-tab-header/post-tab-header.js

@@ -13,7 +13,7 @@ export class PostTabHeader {
         this.tabId = `tab-${this.host.id || nanoid(6)}`;
     }
     render() {
-        return (h(Host, { key: 'd5f6cd0ceb819b475ec49f8ea66e6b4b25f04f8e', id: this.tabId, role: "tab", "data-version": version, "aria-selected": "false", tabindex: "-1", class: "tab-title", slot: "tabs" }, h("slot", { key: '8a87fef31572674981dab80e56e6b20163b448ae' })));
+        return (h(Host, { key: '11b7499afb05a1d7e6f9af548667ec93f7c2af77', id: this.tabId, role: "tab", "data-version": version, "aria-selected": "false", tabindex: "-1", class: "tab-title", slot: "tabs" }, h("slot", { key: '589c626bd31aed39c1f90b74ee81b2d9fdf3b7c0' })));
     }
     static get is() { return "post-tab-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-tab-panel/post-tab-panel.js

@@ -15,7 +15,7 @@ export class PostTabPanel {
         this.panelId = `panel-${this.host.id || nanoid(6)}`;
     }
     render() {
-        return (h(Host, { key: '609dd2b8bf26e58e92a1dbc827e4479ac416d95b', "data-version": version, id: this.panelId, role: "tabpanel" }, h("slot", { key: '121538878e0298f1f16f6e20eeb15d5da8a5ba9c' })));
+        return (h(Host, { key: '3f4af71d9dcd4c8d3a25514c4decf322b0297e0f', "data-version": version, id: this.panelId, role: "tabpanel" }, h("slot", { key: 'fb2106769715676d200722103855cb3f82f30b83' })));
     }
     static get is() { return "post-tab-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-tabs/post-tabs.js

@@ -5,8 +5,8 @@ import { componentOnReady } from "../../utils/index";
 /**
  * @slot tabs - Slot for placing tab headers. Each tab header should be a <post-tab-header> element.
  * @slot default - Slot for placing tab panels. Each tab panel should be a <post-tab-panel> element.
- * @part tabs - Add custom styles for the tab header container.
- * @part content - Add custom styles for the tab panel container.
+ * @part tabs - The container element that holds the set of tabs.
+ * @part content - The container element that displays the content of the currently active tab.
  */
 export class PostTabs {
     constructor() {
@@ -145,7 +145,7 @@ export class PostTabs {
         nextTab.focus();
     }
     render() {
-        return (h(Host, { key: '467959e964a6d7f44ac3eee09f9c7d2b501af4fe', "data-version": version }, h("div", { key: '7ce4c0428360124f6937d123a4664d6f22e1110c', class: "tabs-wrapper", part: "tabs" }, h("div", { key: 'c41b073b855cb12a789c8656d12b0f6e9e20ea6f', class: "tabs", role: "tablist" }, h("slot", { key: '37935aa4c4d1ca4e71931e9e50d91e77075d2b64', name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { key: 'bb84a728572c00256e219b5dd28322cbab699932', class: "tab-content", part: "content" }, h("slot", { key: 'e2aa9cf6a9faa9f5ded6018def77b9b818b2b986', onSlotchange: () => this.moveMisplacedTabs() }))));
+        return (h(Host, { key: '8e205e26a016d6370919723522dc993befbc110a', "data-version": version }, h("div", { key: '1bd1b1064c87ab7dd04731a945a6169ace2ac203', class: "tabs-wrapper", part: "tabs" }, h("div", { key: 'e9d7989ae0488ed8c9d8d225c9b6f95e29de15aa', class: "tabs", role: "tablist" }, h("slot", { key: '381baa02f41fc07b6ae777fdcc47040ceaa553ea', name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { key: 'aef6b1b4608e2b006ac808f7fc674dbc85011faa', class: "tab-content", part: "content" }, h("slot", { key: '4b98797972204262b1ebf29fe368ea90e2ccbce7', onSlotchange: () => this.moveMisplacedTabs() }))));
     }
     static get is() { return "post-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-togglebutton/post-togglebutton.js

@@ -26,7 +26,7 @@ export class PostTogglebutton {
         this.host.addEventListener('keydown', (e) => this.handleKeydown(e));
     }
     render() {
-        return (h(Host, { key: '1cebe1d1314e2c89f141869e07521e7f30e58617', "data-version": version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, h("slot", { key: '8b8c33befde8e93eca73a6239170c3786e2cf2f2' })));
+        return (h(Host, { key: 'f6b56dc64dbff8ef94e4104eebe845a04f113c75', "data-version": version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, h("slot", { key: '2846bb617c7a68ba6390fe27b043265569a9fd55' })));
     }
     static get is() { return "post-togglebutton"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-tooltip/post-tooltip.js

@@ -60,11 +60,11 @@ export class PostTooltip {
      * @param e Popovercontainer toggle event
      */
     handleToggle(e) {
-        this.open = e.detail;
+        this.open = e.detail.isOpen;
     }
     render() {
         const popoverClass = `${this.arrow ? 'has-arrow' : ''}`;
-        return (h(Host, { key: 'c5f293812e33520ea5a2c9224e93fe5e5e41cbe0', "data-version": version }, h("post-popovercontainer", { key: '7ec57e1a2315d95e7cb696cf6d2d1a1d8ae77257', safeSpace: "trapezoid", class: popoverClass, role: "tooltip", arrow: this.arrow, animation: this.animation, placement: this.placement, onPostToggle: e => this.handleToggle(e), ref: (el) => (this.popoverRef = el) }, h("slot", { key: '79c91307707c56345acb136a45acdae859d54c2b' }))));
+        return (h(Host, { key: 'b2e72e54ae7c21cc8d47749269dea98cd5cd4fdf', "data-version": version }, h("post-popovercontainer", { key: '4280b99b2b919d07b40f6112ee514907eeff7211', safeSpace: "trapezoid", class: popoverClass, role: "tooltip", arrow: this.arrow, animation: this.animation, placement: this.placement, onPostToggle: e => this.handleToggle(e), ref: (el) => (this.popoverRef = el) }, h("slot", { key: 'da25daf633dc82191f0002c54f29b35731e35082' }))));
     }
     static get is() { return "post-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js

@@ -169,7 +169,7 @@ export class PostTooltipTrigger {
         this.tooltip?.hide();
     }
     render() {
-        return (h(Host, { key: '6106c5a0bbe8d19da424e3c9389829009543b6d5', "data-version": version }, h("slot", { key: 'c7358b9b796f287bd165951664a1dd61a0372dc4', onSlotchange: () => this.handleSlotChange() })));
+        return (h(Host, { key: '4890519cbc8f200cd5f2d6ef79822ec17776c7f0', "data-version": version }, h("slot", { key: '54e5d33bf2aae19f493aaff312f574b6e5fb55e6', onSlotchange: () => this.handleSlotChange() })));
     }
     static get is() { return "post-tooltip-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/utils/event-from.js

@@ -7,7 +7,7 @@
  * @returns true if the event should be processed, false otherwise
  */
 function shouldProcessEvent(event, tag, host, ignoreNestedComponents) {
-    if (!(event instanceof CustomEvent && event.target instanceof HTMLElement))
+    if (!(event instanceof Event && event.target instanceof HTMLElement))
         return false;
     const eventTarget = event.target;
     if (eventTarget.localName !== tag)
@@ -38,7 +38,7 @@ export function EventFrom(tag, option = { ignoreNestedComponents: true }) {
             };
         }
         else {
-            // Creates a hidden storage property for the original method using a 
+            // Creates a hidden storage property for the original method using a
             // modified key format (__[property]_original) to avoid naming conflicts
             const privateKey = `__${propertyKey}_original`;
             // Create hidden storage for original method

package/dist/component-names.json

@@ -0,0 +1,39 @@
+{
+  "componentNames": [
+    "post-accordion",
+    "post-accordion-item",
+    "post-avatar",
+    "post-back-to-top",
+    "post-banner",
+    "post-breadcrumb-item",
+    "post-breadcrumbs",
+    "post-card-control",
+    "post-closebutton",
+    "post-collapsible",
+    "post-collapsible-trigger",
+    "post-footer",
+    "post-header",
+    "post-icon",
+    "post-language-option",
+    "post-language-switch",
+    "post-linkarea",
+    "post-list",
+    "post-list-item",
+    "post-logo",
+    "post-mainnavigation",
+    "post-megadropdown",
+    "post-megadropdown-trigger",
+    "post-menu",
+    "post-menu-item",
+    "post-menu-trigger",
+    "post-popover",
+    "post-popovercontainer",
+    "post-rating",
+    "post-tab-header",
+    "post-tab-panel",
+    "post-tabs",
+    "post-togglebutton",
+    "post-tooltip",
+    "post-tooltip-trigger"
+  ]
+}

package/dist/{esm/event-from-8U5GFtQP.js → components/event-from.js}

@@ -7,7 +7,7 @@
  * @returns true if the event should be processed, false otherwise
  */
 function shouldProcessEvent(event, tag, host, ignoreNestedComponents) {
-    if (!(event instanceof CustomEvent && event.target instanceof HTMLElement))
+    if (!(event instanceof Event && event.target instanceof HTMLElement))
         return false;
     const eventTarget = event.target;
     if (eventTarget.localName !== tag)
@@ -38,7 +38,7 @@ function EventFrom(tag, option = { ignoreNestedComponents: true }) {
             };
         }
         else {
-            // Creates a hidden storage property for the original method using a 
+            // Creates a hidden storage property for the original method using a
             // modified key format (__[property]_original) to avoid naming conflicts
             const privateKey = `__${propertyKey}_original`;
             // Create hidden storage for original method

package/dist/components/get-root.js

@@ -0,0 +1,15 @@
+import { I as IS_BROWSER } from './breakpoints.js';
+
+/**
+ * getRootNode() can only be used after the element has been attached to the document!
+ * So use it for example in the componentDidLoad lifecycle hook.
+ */
+function getRoot(element) {
+    const root = IS_BROWSER ? element.getRootNode() : element;
+    if (root instanceof Document || root instanceof ShadowRoot) {
+        return root;
+    }
+    throw new Error('Attempting to access root node before the element is attached to the document or shadow tree.');
+}
+
+export { getRoot as g };

package/dist/components/index.d.ts

@@ -1,3 +1,75 @@
+/* PostComponents custom elements */
+export { PostAccordion as PostAccordion } from '../types/components/post-accordion/post-accordion';
+export { defineCustomElement as defineCustomElementPostAccordion } from './post-accordion';
+export { PostAccordionItem as PostAccordionItem } from '../types/components/post-accordion-item/post-accordion-item';
+export { defineCustomElement as defineCustomElementPostAccordionItem } from './post-accordion-item';
+export { PostAvatar as PostAvatar } from '../types/components/post-avatar/post-avatar';
+export { defineCustomElement as defineCustomElementPostAvatar } from './post-avatar';
+export { PostBackToTop as PostBackToTop } from '../types/components/post-back-to-top/post-back-to-top';
+export { defineCustomElement as defineCustomElementPostBackToTop } from './post-back-to-top';
+export { PostBanner as PostBanner } from '../types/components/post-banner/post-banner';
+export { defineCustomElement as defineCustomElementPostBanner } from './post-banner';
+export { PostBreadcrumbItem as PostBreadcrumbItem } from '../types/components/post-breadcrumb-item/post-breadcrumb-item';
+export { defineCustomElement as defineCustomElementPostBreadcrumbItem } from './post-breadcrumb-item';
+export { PostBreadcrumbs as PostBreadcrumbs } from '../types/components/post-breadcrumbs/post-breadcrumbs';
+export { defineCustomElement as defineCustomElementPostBreadcrumbs } from './post-breadcrumbs';
+export { PostCardControl as PostCardControl } from '../types/components/post-card-control/post-card-control';
+export { defineCustomElement as defineCustomElementPostCardControl } from './post-card-control';
+export { PostClosebutton as PostClosebutton } from '../types/components/post-closebutton/post-closebutton';
+export { defineCustomElement as defineCustomElementPostClosebutton } from './post-closebutton';
+export { PostCollapsible as PostCollapsible } from '../types/components/post-collapsible/post-collapsible';
+export { defineCustomElement as defineCustomElementPostCollapsible } from './post-collapsible';
+export { PostCollapsibleTrigger as PostCollapsibleTrigger } from '../types/components/post-collapsible-trigger/post-collapsible-trigger';
+export { defineCustomElement as defineCustomElementPostCollapsibleTrigger } from './post-collapsible-trigger';
+export { PostFooter as PostFooter } from '../types/components/post-footer/post-footer';
+export { defineCustomElement as defineCustomElementPostFooter } from './post-footer';
+export { PostHeader as PostHeader } from '../types/components/post-header/post-header';
+export { defineCustomElement as defineCustomElementPostHeader } from './post-header';
+export { PostIcon as PostIcon } from '../types/components/post-icon/post-icon';
+export { defineCustomElement as defineCustomElementPostIcon } from './post-icon';
+export { PostLanguageOption as PostLanguageOption } from '../types/components/post-language-option/post-language-option';
+export { defineCustomElement as defineCustomElementPostLanguageOption } from './post-language-option';
+export { PostLanguageSwitch as PostLanguageSwitch } from '../types/components/post-language-switch/post-language-switch';
+export { defineCustomElement as defineCustomElementPostLanguageSwitch } from './post-language-switch';
+export { PostLinkarea as PostLinkarea } from '../types/components/post-linkarea/post-linkarea';
+export { defineCustomElement as defineCustomElementPostLinkarea } from './post-linkarea';
+export { PostList as PostList } from '../types/components/post-list/post-list';
+export { defineCustomElement as defineCustomElementPostList } from './post-list';
+export { PostListItem as PostListItem } from '../types/components/post-list-item/post-list-item';
+export { defineCustomElement as defineCustomElementPostListItem } from './post-list-item';
+export { PostLogo as PostLogo } from '../types/components/post-logo/post-logo';
+export { defineCustomElement as defineCustomElementPostLogo } from './post-logo';
+export { PostMainnavigation as PostMainnavigation } from '../types/components/post-mainnavigation/post-mainnavigation';
+export { defineCustomElement as defineCustomElementPostMainnavigation } from './post-mainnavigation';
+export { PostMegadropdown as PostMegadropdown } from '../types/components/post-megadropdown/post-megadropdown';
+export { defineCustomElement as defineCustomElementPostMegadropdown } from './post-megadropdown';
+export { PostMegadropdownTrigger as PostMegadropdownTrigger } from '../types/components/post-megadropdown-trigger/post-megadropdown-trigger';
+export { defineCustomElement as defineCustomElementPostMegadropdownTrigger } from './post-megadropdown-trigger';
+export { PostMenu as PostMenu } from '../types/components/post-menu/post-menu';
+export { defineCustomElement as defineCustomElementPostMenu } from './post-menu';
+export { PostMenuItem as PostMenuItem } from '../types/components/post-menu-item/post-menu-item';
+export { defineCustomElement as defineCustomElementPostMenuItem } from './post-menu-item';
+export { PostMenuTrigger as PostMenuTrigger } from '../types/components/post-menu-trigger/post-menu-trigger';
+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 { 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';
+export { defineCustomElement as defineCustomElementPostRating } from './post-rating';
+export { PostTabHeader as PostTabHeader } from '../types/components/post-tab-header/post-tab-header';
+export { defineCustomElement as defineCustomElementPostTabHeader } from './post-tab-header';
+export { PostTabPanel as PostTabPanel } from '../types/components/post-tab-panel/post-tab-panel';
+export { defineCustomElement as defineCustomElementPostTabPanel } from './post-tab-panel';
+export { PostTabs as PostTabs } from '../types/components/post-tabs/post-tabs';
+export { defineCustomElement as defineCustomElementPostTabs } from './post-tabs';
+export { PostTogglebutton as PostTogglebutton } from '../types/components/post-togglebutton/post-togglebutton';
+export { defineCustomElement as defineCustomElementPostTogglebutton } from './post-togglebutton';
+export { PostTooltip as PostTooltip } from '../types/components/post-tooltip/post-tooltip';
+export { defineCustomElement as defineCustomElementPostTooltip } from './post-tooltip';
+export { PostTooltipTrigger as PostTooltipTrigger } from '../types/components/post-tooltip-trigger/post-tooltip-trigger';
+export { defineCustomElement as defineCustomElementPostTooltipTrigger } from './post-tooltip-trigger';
+
 /**
  * Get the base path to where the assets can be found. Use "setAssetPath(path)"
  * if the path needs to be customized.
@@ -31,3 +103,4 @@ export interface SetPlatformOptions {
   rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
 }
 export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
+export * from '../types';