@swisspost/design-system-components 9.0.0-next.15 → 9.0.0-next.16

package/dist/components/{p-70e8b74f.js → post-logo2.js}

@@ -1,21 +1,18 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { d as checkEmptyOrUrl } from './p-eabb09ad.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { d as checkEmptyOrUrl } from './index2.js';
 
 const postLogoCss = ":host,.logo{display:inline-block}:host,:host .logo>svg,.logo,.logo .logo>svg{height:100%}.description{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.logo-link{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}.logo-link:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.logo-link:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.logo-link:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.logo-link:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.logo-link :focus,:focus-visible{border-radius:2px}";
 const PostLogoStyle0 = postLogoCss;
 
-const PostLogo = /*@__PURE__*/ proxyCustomElement(class PostLogo extends H {
+const PostLogo = /*@__PURE__*/ proxyCustomElement(class PostLogo extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.url = undefined;
     }
     get host() { return this; }
-    /**
-     * The URL to which the user is redirected upon clicking the logo.
-     */
-    url;
     validateUrl() {
         checkEmptyOrUrl(this.url, 'The "url" property of the post-logo is invalid');
     }

package/dist/components/post-mainnavigation.js

@@ -1,4 +1,4 @@
-import { P as PostMainnavigation$1, d as defineCustomElement$1 } from './p-2e509a60.js';
+import { P as PostMainnavigation$1, d as defineCustomElement$1 } from './post-mainnavigation2.js';
 
 const PostMainnavigation = PostMainnavigation$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-2e509a60.js → post-mainnavigation2.js}

@@ -1,6 +1,6 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { t as throttle } from './p-f7b9f90a.js';
-import { d as defineCustomElement$1 } from './p-fcec301c.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { t as throttle } from './index3.js';
+import { d as defineCustomElement$1 } from './post-icon2.js';
 
 const postMainnavigationCss = "post-mainnavigation{flex:0 0 auto}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:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}post-mainnavigation post-list-item post-megadropdown-trigger button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-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:var(--post-core-dimension-4)}post-mainnavigation .back-button post-icon{transform:rotate(180deg)}@media screen and (max-width: 1023.98px){post-mainnavigation .back-button{font-size:var(--post-core-font-size-16)}}@media screen and (max-width: 599.98px){post-mainnavigation .back-button{font-size:var(--post-core-font-size-14)}}@media screen and (min-width: 1024px){post-mainnavigation{display:block}post-mainnavigation nav{max-width:100vw;background:var(--post-core-color-brand-white);max-height:var(--main-navigation-height);user-select:none;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{position:absolute;inset-block:0;overflow:hidden}post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;background:var(--post-core-color-brand-white);padding:var(--post-core-dimension-16);box-shadow:var(--post-core-elevation-5);line-height:var(--post-core-line-height-100);height:100%}post-mainnavigation .left-scroll-button button post-icon,post-mainnavigation .right-scroll-button button post-icon{font-size:1rem}post-mainnavigation .left-scroll-button{inset-inline-start:0;padding-inline-end:2rem}post-mainnavigation .right-scroll-button{inset-inline-end:0;padding-inline-start:2rem}post-mainnavigation post-list{margin-inline:var(--post-core-dimension-4)}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}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:var(--post-core-dimension-12);height:var(--main-navigation-height);gap:var(--post-core-dimension-4);font-size:var(--post-core-font-size-16);border-block:0 solid rgba(0,0,0,0);border-block-end-color:currentColor}}@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:3}}@media screen and (min-width: 1024px)and (min-width: 1024px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{z-index:4}}@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{border-block-width:var(--post-core-dimension-2)}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{border-block-width:var(--post-core-dimension-4);font-weight:var(--post-core-font-weight-700)}}@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:var(--post-core-font-size-14)}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:var(--post-core-dimension-12);transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item 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:var(--post-core-dimension-24);width:var(--post-core-dimension-24);transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::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(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:var(--post-core-dimension-48);padding-inline-end:calc(var(--post-core-dimension-6) + var(--post-core-dimension-24) + var(--post-core-dimension-16));gap:var(--post-core-dimension-16);font-weight:var(--post-core-font-weight-400);position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:currentColor;bottom:0;width:100%;height:var(--post-core-dimension-1);position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{height:var(--post-core-dimension-3)}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::after,post-mainnavigation post-megadropdown a:hover::after{content:\"\";display:block;margin-right:calc((var(--post-core-dimension-24) + var(--post-core-dimension-16))*-1);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='m31.95 16-9.11 9.11c-.2.2-.45.29-.71.29s-.51-.1-.71-.29a.996.996 0 0 1 0-1.41l6.69-6.69H-.05v-2h28.17l-6.69-6.69a.996.996 0 1 1 1.41-1.41l9.11 9.11Z'%3E%3C/path%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;width:var(--post-core-dimension-20);min-width:var(--post-core-dimension-20);height:var(--post-core-dimension-20)}}@media screen and (min-width: 1024px){post-mainnavigation [slot=back-button]{display:none}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{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:var(--post-core-dimension-48);padding-inline-end:calc(var(--post-core-dimension-6) + var(--post-core-dimension-24) + var(--post-core-dimension-16));gap:var(--post-core-dimension-16);font-weight:var(--post-core-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:currentColor;bottom:0;width:100%;height:var(--post-core-dimension-1);position:absolute;left:0}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{height:var(--post-core-dimension-3)}post-mainnavigation post-list-item>a:hover::after,post-mainnavigation post-list-item>button:hover::after,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::after{content:\"\";display:block;margin-right:calc((var(--post-core-dimension-24) + var(--post-core-dimension-16))*-1);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='m31.95 16-9.11 9.11c-.2.2-.45.29-.71.29s-.51-.1-.71-.29a.996.996 0 0 1 0-1.41l6.69-6.69H-.05v-2h28.17l-6.69-6.69a.996.996 0 1 1 1.41-1.41l9.11 9.11Z'%3E%3C/path%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;width:var(--post-core-dimension-20);min-width:var(--post-core-dimension-20);height:var(--post-core-dimension-20)}}post-mainnavigation .back-button .btn{padding-inline:0}";
 const PostMainnavigationStyle0 = postMainnavigationCss;
@@ -9,10 +9,13 @@ const SCROLL_REPEAT_INTERVAL = 100; // Interval for repeated scrolling when hold
 const NAVBAR_DISABLE_DURATION = 400; // Duration to temporarily disable navbar interactions during scrolling
 const NAVIGATION_LIST_SELECTOR = 'post-list:not(post-megadropdown *) > [role="list"]';
 const NAVIGATION_ITEM_SELECTOR = ':is(post-list-item > a, post-list-item > post-megadropdown-trigger > button):not(post-megadropdown *)';
-const PostMainnavigation = /*@__PURE__*/ proxyCustomElement(class PostMainnavigation extends H {
+const PostMainnavigation = /*@__PURE__*/ proxyCustomElement(class PostMainnavigation extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+        this.canScrollLeft = false;
+        this.canScrollRight = false;
+        this.translateAmount = 0;
     }
     header;
     navbar;
@@ -29,9 +32,6 @@ const PostMainnavigation = /*@__PURE__*/ proxyCustomElement(class PostMainnaviga
         this.checkScrollability();
     });
     get host() { return this; }
-    canScrollLeft = false;
-    canScrollRight = false;
-    translateAmount = 0;
     /**
      * Update navbar translation when 'translateAmount' changes and recalculate scrollability
      */

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

@@ -1,4 +1,4 @@
-import { P as PostMegadropdownTrigger$1, d as defineCustomElement$1 } from './p-4b60e5f8.js';
+import { P as PostMegadropdownTrigger$1, d as defineCustomElement$1 } from './post-megadropdown-trigger2.js';
 
 const PostMegadropdownTrigger = PostMegadropdownTrigger$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-4b60e5f8.js → post-megadropdown-trigger2.js}

@@ -1,24 +1,18 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { c as checkType } from './p-8562c7dc.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { c as checkType } from './check-type.js';
 
 const postMegadropdownTriggerCss = "post-megadropdown-trigger{width:100%;position:relative;z-index:3}";
 const PostMegadropdownTriggerStyle0 = postMegadropdownTriggerCss;
 
-const PostMegadropdownTrigger = /*@__PURE__*/ proxyCustomElement(class PostMegadropdownTrigger extends H {
+const PostMegadropdownTrigger = /*@__PURE__*/ proxyCustomElement(class PostMegadropdownTrigger extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+        this.for = undefined;
+        this.ariaExpanded = false;
     }
-    /**
-     * ID of the mega dropdown element that this trigger is linked to. Used to open and close the specified mega dropdown.
-     */
-    for;
     get host() { return this; }
-    /**
-     * Manages the accessibility attribute `aria-expanded` to indicate whether the associated mega dropdown is expanded or collapsed.
-     */
-    ariaExpanded = false;
     /**
      * Reference to the slotted button within the trigger, if present.
      * Used to manage click and key events for mega dropdown control.

package/dist/components/post-megadropdown.js

@@ -1,4 +1,4 @@
-import { P as PostMegadropdown$1, d as defineCustomElement$1 } from './p-46a6c5ec.js';
+import { P as PostMegadropdown$1, d as defineCustomElement$1 } from './post-megadropdown2.js';
 
 const PostMegadropdown = PostMegadropdown$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-46a6c5ec.js → post-megadropdown2.js}

@@ -1,30 +1,24 @@
-import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-3e8554e7.js';
-import { g as getFocusableChildren } from './p-3aba7629.js';
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { g as getFocusableChildren } from './get-focusable-children.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{--post-main-header-height:56px;--post-global-header-height:72px;--post-header-height:calc(var(--post-global-header-height) + var(--post-main-header-height));box-shadow:0 8px 6px rgba(0,0,0,.16);position:absolute;background-color:#fafafa;border:none;z-index:1;border-top:1px solid #e1e0dc;width:100%;top:100%;left:0;border-radius:0}.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{--post-global-header-height:64px;z-index:4;top:0 !important;left:0;width:100%;position:fixed;height:calc(100vh - var(--post-header-height));max-height:calc(100vh - var(--header-height));border-top:unset;overflow:auto}.megadropdown-container.slide-in{animation:slide-in 350ms forwards}.megadropdown-container.slide-out{animation:slide-out 350ms forwards}}.megadropdown{padding:31px 40px 40px;background-color:#fafafa}@media screen and (max-width: 1023.98px){.megadropdown{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-top:0;margin-bottom:8px;font-weight:900}.megadropdown h2 a{text-decoration:none;font-weight:inherit;border-bottom:0;border-top: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)){padding:15px 12px 14px 8px;border-bottom:1px solid #050400}.megadropdown post-list .list-title h3 a{padding-block:15px 14px;padding-inline-start:8px;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:var(--post-core-dimension-48);padding-inline-end:calc(var(--post-core-dimension-6) + var(--post-core-dimension-24) + var(--post-core-dimension-16));gap:var(--post-core-dimension-16);font-weight:var(--post-core-font-weight-400);position:relative;height:unset;font-weight:900}.megadropdown post-list .list-title h3 a::before{content:\"\";background-color:currentColor;bottom:0;width:100%;height:var(--post-core-dimension-1);position:absolute;left:0}.megadropdown post-list .list-title h3 a:hover::before{height:var(--post-core-dimension-3)}.megadropdown post-list .list-title h3 a:hover::after{content:\"\";display:block;margin-right:calc((var(--post-core-dimension-24) + var(--post-core-dimension-16))*-1);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='m31.95 16-9.11 9.11c-.2.2-.45.29-.71.29s-.51-.1-.71-.29a.996.996 0 0 1 0-1.41l6.69-6.69H-.05v-2h28.17l-6.69-6.69a.996.996 0 1 1 1.41-1.41l9.11 9.11Z'%3E%3C/path%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;width:var(--post-core-dimension-20);min-width:var(--post-core-dimension-20);height:var(--post-core-dimension-20)}@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)){padding:15px 12px 14px 8px;border-bottom:1px solid #050400}}@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}.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-bottom:2rem}.megadropdown .back-button .btn{width:auto}@media screen and (max-width: 1023.98px){.megadropdown .back-button{display:block}}.megadropdown .close-button{position:absolute;top:1rem;right:1rem}@media screen and (max-width: 1023.98px){.megadropdown .close-button{display:none}}";
 const PostMegadropdownStyle0 = postMegadropdownCss;
 
-const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown extends H {
+const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.postToggleMegadropdown = createEvent(this, "postToggleMegadropdown", 7);
+        this.device = undefined;
+        this.isVisible = false;
+        this.animationClass = null;
     }
     header;
     firstFocusableEl;
     lastFocusableEl;
-    device;
     get host() { return this; }
     /** Tracks the currently active dropdown instance. */
     static activeDropdown = null;
-    /**
-     * Holds the current visibility state of the dropdown.
-     * This state is internally managed to track whether the dropdown is open (`true`) or closed (`false`),
-     * and updates automatically when the dropdown is toggled.
-     */
-    isVisible = false;
-    /** Holds the current animation class. */
-    animationClass = null;
     /**
      * Emits when the dropdown is shown or hidden.
      * The event payload is a boolean: `true` when the dropdown was opened, `false` when it was closed.
@@ -58,9 +52,11 @@ const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown
             // Close the previously active dropdown without animation
             PostMegadropdown.activeDropdown.forceClose();
         }
+        else {
+            this.animationClass = 'slide-in';
+        }
         this.isVisible = true;
         this.host.addEventListener('keydown', e => this.keyboardHandler(e));
-        this.animationClass = 'slide-in';
         PostMegadropdown.activeDropdown = this;
         this.postToggleMegadropdown.emit(this.isVisible);
         this.addOutsideClickListener();
@@ -70,6 +66,7 @@ const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown
      */
     async hide() {
         this.animationClass = 'slide-out';
+        PostMegadropdown.activeDropdown = null;
         this.host.removeEventListener('keydown', e => this.keyboardHandler(e));
     }
     connectedCallback() {
@@ -100,7 +97,7 @@ const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown
         if (this.host.contains(target)) {
             return;
         }
-        if (target instanceof H) {
+        if (target instanceof HTMLElement) {
             const trigger = target.closest('post-megadropdown-trigger');
             if (trigger) {
                 const targetDropdownId = trigger.getAttribute('for');
@@ -140,7 +137,7 @@ const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown
     }
     render() {
         const containerStyle = this.isVisible ? {} : { display: 'none' };
-        return (h(Host, { key: '5aa08b01be715325182c245e1b0ae2456bcc5df6' }, h("div", { key: '0737c9368ecbffac59bbdf47fabac3f3b94ae7bb', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: 'efe49f3f9cdcd99e2feca78b772c944405e19f21', class: "megadropdown" }, h("div", { key: '14dd7ff2f7e7b1eb91f2673a25d7ccafffe4f9d0', onClick: () => this.hide(), class: "back-button" }, h("slot", { key: '554e30e6408c0bef0549f5e2c31dcd8b90ceee40', name: "back-button" })), h("div", { key: '4e7335152d7b6649918adf075213ebbf8b8ddeaa', onClick: () => this.hide(), class: "close-button" }, h("slot", { key: 'db90f3a5334ce723c0ee672a96167197ca25b545', name: "close-button" })), h("slot", { key: 'b11b1d16147f88103f2eb24c8dd21394de53f69c', name: "megadropdown-title" }), h("div", { key: '6d837c1a70f66f00097fb531058750fbac6fd41a', class: "megadropdown-content" }, h("slot", { key: 'be685185f04e44d867167f918494d086856b5928' }))))));
+        return (h(Host, { key: '11be74da0c6d35e1a50c954735a6b1f079cd0eb6' }, h("div", { key: '202023b2495012f78ba761f20aef1ba0325a98f0', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: '87ac87a83de7ce798f5d9057b992893bfc00f2e1', class: "megadropdown" }, h("div", { key: '650738a55e5007b9ae0c3ee30fb2f1ae53152744', onClick: () => this.hide(), class: "back-button" }, h("slot", { key: 'a7b70ce1fbc7090807b8d60efce6cb83eb06674e', name: "back-button" })), h("div", { key: '812d3458649669e867d7d761079299b64d9e4e4d', onClick: () => this.hide(), class: "close-button" }, h("slot", { key: '2ee2df463dfd6667b729fd1b47987ea40e8d9d5f', name: "close-button" })), h("slot", { key: 'a5d0029319e34b652923d07fcddd5cb647912b03', name: "megadropdown-title" }), h("div", { key: 'c563cf50e3d9a1a466b9aec386982c80569ac094', class: "megadropdown-content" }, h("slot", { key: 'a05eeceb8fdbfc4373ee7d42d4f583475b44b4dc' }))))));
     }
     static get style() { return PostMegadropdownStyle0; }
 }, [4, "post-megadropdown", {

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

@@ -1,4 +1,4 @@
-import { P as PostMenuItem$1, d as defineCustomElement$1 } from './p-4bbdde2b.js';
+import { P as PostMenuItem$1, d as defineCustomElement$1 } from './post-menu-item2.js';
 
 const PostMenuItem = PostMenuItem$1;
 const defineCustomElement = defineCustomElement$1;

package/{loaders/p-4bbdde2b.js → dist/components/post-menu-item2.js}

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
 
-const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends H {
+const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();

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

@@ -1,4 +1,4 @@
-import { P as PostMenuTrigger$1, d as defineCustomElement$1 } from './p-15877641.js';
+import { P as PostMenuTrigger$1, d as defineCustomElement$1 } from './post-menu-trigger2.js';
 
 const PostMenuTrigger = PostMenuTrigger$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,25 +1,19 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { c as checkType } from './p-8562c7dc.js';
-import { g as getRoot } from './p-fc91cbc2.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { c as checkType } from './check-type.js';
+import { g as getRoot } from './get-root.js';
 
 const postMenuTriggerCss = ":host{display:inline-block}";
 const PostMenuTriggerStyle0 = postMenuTriggerCss;
 
-const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger extends H {
+const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+        this.for = undefined;
+        this.ariaExpanded = false;
     }
-    /**
-     * ID of the menu element that this trigger is linked to. Used to open and close the specified menu.
-     */
-    for;
     get host() { return this; }
-    /**
-     * Manages the accessibility attribute `aria-expanded` to indicate whether the associated menu is expanded or collapsed.
-     */
-    ariaExpanded = false;
     /**
      * Reference to the slotted button within the trigger, if present.
      * Used to manage click and key events for menu control.

package/dist/components/post-menu.js

@@ -1,4 +1,4 @@
-import { P as PostMenu$1, d as defineCustomElement$1 } from './p-7202d5d4.js';
+import { P as PostMenu$1, d as defineCustomElement$1 } from './post-menu2.js';
 
 const PostMenu = PostMenu$1;
 const defineCustomElement = defineCustomElement$1;

package/{loaders/p-7202d5d4.js → dist/components/post-menu2.js}

@@ -1,18 +1,20 @@
-import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { g as getFocusableChildren } from './p-3aba7629.js';
-import { g as getRoot } from './p-fc91cbc2.js';
-import { d as defineCustomElement$1 } from './p-f59c8544.js';
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { g as getFocusableChildren } from './get-focusable-children.js';
+import { g as getRoot } from './get-root.js';
+import { d as defineCustomElement$1 } from './post-popovercontainer2.js';
 
 const postMenuCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}post-popovercontainer{padding:var(--post-menu-padding);background-color:var(--post-menu-bg, #ffffff);border-color:var(--post-menu-bg, #ffffff)}.popover-container{display:flex;flex-direction:column}";
 const PostMenuStyle0 = postMenuCss;
 
-const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends H {
+const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
         this.toggleMenu = createEvent(this, "toggleMenu", 7);
+        this.placement = 'bottom';
+        this.isVisible = false;
     }
     popoverRef;
     lastFocusedElement = null;
@@ -27,18 +29,6 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends H {
         ESCAPE: 'Escape',
     };
     get host() { return this; }
-    /**
-     * Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
-     * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted
-     * towards the viewport if they would overlap edge boundaries.
-     */
-    placement = 'bottom';
-    /**
-     * Holds the current visibility state of the menu.
-     * This state is internally managed to track whether the menu is open (`true`) or closed (`false`),
-     * and updates automatically when the menu is toggled.
-     */
-    isVisible = false;
     /**
      * Emits when the menu is shown or hidden.
      * The event payload is a boolean: `true` when the menu was opened, `false` when it was closed.

package/dist/components/post-popover.js

@@ -1,4 +1,4 @@
-import { P as PostPopover$1, d as defineCustomElement$1 } from './p-621f6dce.js';
+import { P as PostPopover$1, d as defineCustomElement$1 } from './post-popover2.js';
 
 const PostPopover = PostPopover$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-621f6dce.js → post-popover2.js}

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { g as getAttributeObserver } from './p-9748a355.js';
-import { d as defineCustomElement$1 } from './p-f59c8544.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { g as getAttributeObserver } from './attribute-observer.js';
+import { d as defineCustomElement$1 } from './post-popovercontainer2.js';
 
 const postPopoverCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */.btn-close{padding:0;overflow:visible;border:0;background:none;color:inherit;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}.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{display:flex;align-items:self-start;padding:.5em;min-width:160px;max-width:280px;max-width:100%}.popover-content{padding:.5em;flex-grow:1}.btn-close{color:inherit}";
 const PostPopoverStyle0 = postPopoverCss;
@@ -26,29 +26,17 @@ const triggerObserver = getAttributeObserver(popoverTargetAttribute, trigger =>
     const force = trigger.hasAttribute(popoverTargetAttribute);
     trigger.setAttribute('aria-expanded', force ? 'false' : null);
 });
-const PostPopover = /*@__PURE__*/ proxyCustomElement(class PostPopover extends H {
+const PostPopover = /*@__PURE__*/ proxyCustomElement(class PostPopover extends HTMLElement {
     popoverRef;
     localBeforeToggleHandler;
     get host() { return this; }
-    /**
-     * Defines the placement of the popover according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
-     * Popoverss are automatically flipped to the opposite side if there is not enough available space and are shifted
-     * towards the viewport if they would overlap edge boundaries.
-     */
-    placement = 'top';
-    /**
-     * Define the caption of the close button for assistive technology
-     */
-    closeButtonCaption;
-    /**
-     * Show a little indicator arrow
-     */
-    // eslint-disable-next-line @stencil-community/ban-default-true
-    arrow = true;
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.placement = 'top';
+        this.closeButtonCaption = undefined;
+        this.arrow = true;
         this.localBeforeToggleHandler = this.beforeToggleHandler.bind(this);
     }
     connectedCallback() {

package/dist/components/post-popovercontainer.js

@@ -1,4 +1,4 @@
-import { P as PostPopovercontainer$1, d as defineCustomElement$1 } from './p-f59c8544.js';
+import { P as PostPopovercontainer$1, d as defineCustomElement$1 } from './post-popovercontainer2.js';
 
 const PostPopovercontainer = PostPopovercontainer$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-f59c8544.js → post-popovercontainer2.js}

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
+import { proxyCustomElement, HTMLElement as HTMLElement$1, createEvent, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
 
 /**
  * Custom positioning reference element.
@@ -2112,11 +2112,15 @@ const SIDE_MAP = {
     bottom: 'top',
     left: 'right',
 };
-const PostPopovercontainer = /*@__PURE__*/ proxyCustomElement(class PostPopovercontainer extends H {
+const PostPopovercontainer = /*@__PURE__*/ proxyCustomElement(class PostPopovercontainer extends HTMLElement$1 {
     constructor() {
         super();
         this.__registerHost();
         this.postToggle = createEvent(this, "postToggle", 7);
+        this.manualClose = false;
+        this.placement = 'top';
+        this.edgeGap = 8;
+        this.arrow = false;
     }
     get host() { return this; }
     arrowRef;
@@ -2127,24 +2131,6 @@ const PostPopovercontainer = /*@__PURE__*/ proxyCustomElement(class PostPopoverc
      * Fires whenever the popover gets shown or hidden, passing the new state in event.details as a boolean
      */
     postToggle;
-    /**
-     * Whether or not the popover should close when user clicks outside of it
-     */
-    manualClose = false;
-    /**
-     * Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
-     * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted
-     * towards the viewport if they would overlap edge boundaries.
-     */
-    placement = 'top';
-    /**
-     * Gap between the edge of the page and the popover
-     */
-    edgeGap = 8;
-    /**
-     * Wheter or not to display a little pointer arrow
-     */
-    arrow = false;
     componentDidLoad() {
         this.host.addEventListener('beforetoggle', this.handleToggle.bind(this));
     }

package/dist/components/post-rating.js

@@ -1,4 +1,4 @@
-import { P as PostRating$1, d as defineCustomElement$1 } from './p-d343757a.js';
+import { P as PostRating$1, d as defineCustomElement$1 } from './post-rating2.js';
 
 const PostRating = PostRating$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-d343757a.js → post-rating2.js}

@@ -1,31 +1,13 @@
-import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { d as defineCustomElement$1 } from './p-fcec301c.js';
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { d as defineCustomElement$1 } from './post-icon2.js';
 
 const postRatingCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */: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%)}";
 const PostRatingStyle0 = postRatingCss;
 
-const PostRating = /*@__PURE__*/ proxyCustomElement(class PostRating extends H {
+const PostRating = /*@__PURE__*/ proxyCustomElement(class PostRating extends HTMLElement {
     hasChanged = false;
     get host() { return this; }
-    hoveredIndex;
-    /**
-     * Defines a hidden label for the component.
-     */
-    label = 'Rating';
-    /**
-     * Defines the total amount of stars rendered in the component.
-     */
-    stars = 5;
-    /**
-     * Defines the rating that the component should show.
-     */
-    currentRating = 0;
-    /**
-     * Defines if the component is readonly or not.
-     * This usually should be used together with the `currentRating` property.
-     */
-    readonly = false;
     /**
      * An event emitted whenever the component's value has changed (on input).
      * The event payload can be used like so: `event.detail.value`.
@@ -42,6 +24,11 @@ const PostRating = /*@__PURE__*/ proxyCustomElement(class PostRating extends H {
         this.__attachShadow();
         this.postInput = createEvent(this, "postInput", 7);
         this.postChange = createEvent(this, "postChange", 7);
+        this.hoveredIndex = undefined;
+        this.label = 'Rating';
+        this.stars = 5;
+        this.currentRating = 0;
+        this.readonly = false;
         this.keydownHandler = this.keydownHandler.bind(this);
         this.blurHandler = this.blurHandler.bind(this);
         this.hoverHandler = this.hoverHandler.bind(this);

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

@@ -1,4 +1,4 @@
-import { P as PostTabHeader$1, d as defineCustomElement$1 } from './p-32b7a0a8.js';
+import { P as PostTabHeader$1, d as defineCustomElement$1 } from './post-tab-header2.js';
 
 const PostTabHeader = PostTabHeader$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-32b7a0a8.js → post-tab-header2.js}

@@ -1,23 +1,20 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { c as checkNonEmpty } from './p-b095519d.js';
-import { n as nanoid } from './p-5959f2bd.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { c as checkNonEmpty } from './check-non-empty.js';
+import { n as nanoid } from './index.browser.js';
 
 const postTabHeaderCss = ".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}}/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}.tab-title{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button}";
 const PostTabHeaderStyle0 = postTabHeaderCss;
 
-const PostTabHeader = /*@__PURE__*/ proxyCustomElement(class PostTabHeader extends H {
+const PostTabHeader = /*@__PURE__*/ proxyCustomElement(class PostTabHeader extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.tabId = undefined;
+        this.panel = undefined;
     }
     get host() { return this; }
-    tabId;
-    /**
-     * The name of the panel controlled by the tab header.
-     */
-    panel;
     validateFor(newValue) {
         checkNonEmpty(newValue, 'The "panel" prop is required for the post-tab-header.');
     }

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

@@ -1,4 +1,4 @@
-import { P as PostTabPanel$1, d as defineCustomElement$1 } from './p-db9fa77d.js';
+import { P as PostTabPanel$1, d as defineCustomElement$1 } from './post-tab-panel2.js';
 
 const PostTabPanel = PostTabPanel$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-db9fa77d.js → post-tab-panel2.js}

@@ -1,22 +1,19 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-3e8554e7.js';
-import { v as version } from './p-74e13cb1.js';
-import { n as nanoid } from './p-5959f2bd.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { n as nanoid } from './index.browser.js';
 
 const postTabPanelCss = ":host{display:none}";
 const PostTabPanelStyle0 = postTabPanelCss;
 
-const PostTabPanel = /*@__PURE__*/ proxyCustomElement(class PostTabPanel extends H {
+const PostTabPanel = /*@__PURE__*/ proxyCustomElement(class PostTabPanel extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.panelId = undefined;
+        this.name = undefined;
     }
     get host() { return this; }
-    panelId;
-    /**
-     * The name of the panel, used to associate it with a tab header.
-     */
-    name;
     componentWillLoad() {
         // get the id set on the host element or use a random id by default
         this.panelId = `panel-${this.host.id || nanoid(6)}`;

package/dist/components/post-tabs.js

@@ -1,4 +1,4 @@
-import { P as PostTabs$1, d as defineCustomElement$1 } from './p-efc1bc9c.js';
+import { P as PostTabs$1, d as defineCustomElement$1 } from './post-tabs2.js';
 
 const PostTabs = PostTabs$1;
 const defineCustomElement = defineCustomElement$1;