@swisspost/design-system-components 9.0.0-next.9 → 9.0.0

package/dist/components/post-language-switch2.js

@@ -1,146 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { c as checkEmptyOrOneOf } from './index2.js';
-import { v as version } from './package.js';
-import { d as defineCustomElement$4 } from './post-icon2.js';
-import { d as defineCustomElement$3 } from './post-menu2.js';
-import { d as defineCustomElement$2 } from './post-menu-trigger2.js';
-import { d as defineCustomElement$1 } from './post-popovercontainer2.js';
-import { c as checkType } from './check-type.js';
-
-const SWITCH_VARIANTS = ['list', 'dropdown'];
-
-const urlAlphabet =
-  'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict';
-
-let nanoid = (size = 21) => {
-  let id = '';
-  let bytes = crypto.getRandomValues(new Uint8Array((size |= 0)));
-  while (size--) {
-    id += urlAlphabet[bytes[size] & 63];
-  }
-  return id
-};
-
-const postLanguageSwitchCss = ":host{display:block}.post-language-switch-dropdown-container{display:flex;flex-direction:column}.post-language-switch-trigger{cursor:pointer;padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-decoration:none;display:inline-flex;align-items:center;gap:var(--post-core-dimension-6);border-radius:var(--post-core-dimension-24);font-size:var(--post-core-font-size-16);padding:var(--post-core-dimension-3) var(--post-core-dimension-10)}.post-language-switch-trigger{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.post-language-switch-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.post-language-switch-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.post-language-switch-trigger:not(:disabled):hover,.post-language-switch-trigger.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}.post-language-switch-trigger post-icon{height:var(--post-core-dimension-16);width:var(--post-core-dimension-16)}";
-const PostLanguageSwitchStyle0 = postLanguageSwitchCss;
-
-const PostLanguageSwitch = /*@__PURE__*/ proxyCustomElement(class PostLanguageSwitch extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.menuId = `p${nanoid(11)}`;
-        this.caption = undefined;
-        this.description = undefined;
-        this.variant = 'list';
-        this.activeLang = undefined;
-    }
-    validateCaption(value = this.caption) {
-        checkType(value, 'string', 'The "caption" property of the post-language-switch component must be a string.');
-    }
-    validateDescription(value = this.description) {
-        checkType(value, 'string', 'The "description" property of the post-language-switch component must be a string.');
-    }
-    validateVariant(value = this.variant) {
-        checkEmptyOrOneOf(value, SWITCH_VARIANTS, `The "variant" property of the post-language-switch component must be:  ${SWITCH_VARIANTS.join(', ')}`);
-    }
-    connectedCallback() {
-        this.updateChildrenVariant();
-        // Get the active language based on children's active state
-        this.activeLang = Array.from(this.host.querySelectorAll('post-language-option'))
-            .find(el => el.getAttribute('active') == 'true')
-            .getAttribute('code');
-    }
-    // Update post-language-option variant to have the correct style
-    updateChildrenVariant() {
-        this.host.querySelectorAll('post-language-option').forEach(el => {
-            el.setAttribute('variant', this.variant);
-        });
-    }
-    componentShouldUpdate() {
-        this.updateChildrenVariant();
-    }
-    componentDidLoad() {
-        this.validateCaption();
-        this.validateDescription();
-        this.validateVariant();
-        // Detects a change in the active language
-        this.host.addEventListener('postChange', (el) => {
-            this.activeLang = el.detail;
-            // Update the active state in the children post-language-option components
-            this.host.querySelectorAll('post-language-option').forEach(lang => {
-                if (lang.code && lang.code === this.activeLang) {
-                    lang.setAttribute('active', 'true');
-                }
-                else {
-                    lang.setAttribute('active', 'false');
-                }
-            });
-            // Hides the dropdown when an option has been clicked
-            if (this.variant === 'dropdown') {
-                const menu = this.host.shadowRoot.querySelector('post-menu');
-                menu.toggle(menu);
-            }
-        });
-    }
-    renderList() {
-        return (h(Host, { "data-version": version, "aria-label": `${this.caption}, ${this.description}`, "aria-role": "list" }, h("slot", null)));
-    }
-    renderDropdown() {
-        return (h(Host, { "data-version": version }, h("post-menu-trigger", { for: this.menuId }, h("button", { class: "post-language-switch-trigger", "aria-label": `${this.caption}, ${this.description}` }, this.activeLang.toUpperCase(), h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), h("post-menu", { id: this.menuId }, h("div", { class: "post-language-switch-dropdown-container" }, h("slot", null)))));
-    }
-    render() {
-        return this.variant === 'list' ? this.renderList() : this.renderDropdown();
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "caption": ["validateCaption"],
-        "description": ["validateDescription"],
-        "variant": ["validateVariant"]
-    }; }
-    static get style() { return PostLanguageSwitchStyle0; }
-}, [1, "post-language-switch", {
-        "caption": [1],
-        "description": [1],
-        "variant": [1],
-        "activeLang": [32]
-    }, undefined, {
-        "caption": ["validateCaption"],
-        "description": ["validateDescription"],
-        "variant": ["validateVariant"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-language-switch", "post-icon", "post-menu", "post-menu-trigger", "post-popovercontainer"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-language-switch":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostLanguageSwitch);
-            }
-            break;
-        case "post-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "post-menu":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "post-menu-trigger":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "post-popovercontainer":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { PostLanguageSwitch as P, defineCustomElement as d };

package/dist/components/post-list-item.d.ts

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

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

@@ -1,6 +0,0 @@
-import { P as PostListItem$1, d as defineCustomElement$1 } from './post-list-item2.js';
-
-const PostListItem = PostListItem$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PostListItem, defineCustomElement };

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

@@ -1,35 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const postListItemCss = ":host{display:flex}";
-const PostListItemStyle0 = postListItemCss;
-
-const PostListItem = /*@__PURE__*/ proxyCustomElement(class PostListItem extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-    }
-    connectedCallback() {
-        this.host.setAttribute('slot', 'post-list-item');
-    }
-    render() {
-        return (h(Host, { key: 'aa9a31c64e3e8ba5dcac1d03b54ab3c886149c1f', role: "listitem", slot: "post-list-item" }, h("slot", { key: '06353140f8917fc5373de6d56708467af2ef52b2' })));
-    }
-    get host() { return this; }
-    static get style() { return PostListItemStyle0; }
-}, [1, "post-list-item"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-list-item"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-list-item":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostListItem);
-            }
-            break;
-    } });
-}
-
-export { PostListItem as P, defineCustomElement as d };

package/dist/components/post-list.js

@@ -1,6 +0,0 @@
-import { P as PostList$1, d as defineCustomElement$1 } from './post-list2.js';
-
-const PostList = PostList$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PostList, defineCustomElement };

package/dist/components/post-list2.js

@@ -1,53 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-
-const postListCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */post-list{display:flex;flex-direction:column;gap:var(--post-list-title-gap, 0)}post-list>[role=list]{display:flex;flex-direction:column;gap:var(--post-list-item-gap, 0)}post-list:where([horizontal]:not([horizontal=false])){flex-direction:row;align-items:center}post-list:where([horizontal]:not([horizontal=false]))>[role=list]{flex-direction:row;align-items:center}post-list>.list-title.visually-hidden{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}post-list>.list-title.visually-hidden:not(caption){position:absolute !important}";
-const PostListStyle0 = postListCss;
-
-const PostList = /*@__PURE__*/ proxyCustomElement(class PostList extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.titleId = undefined;
-        this.titleHidden = false;
-        this.horizontal = false;
-    }
-    componentWillLoad() {
-        /**
-         * Get the id set on the host element or use a random id by default
-         */
-        this.titleId = `title-${this.host.id || crypto.randomUUID()}`;
-    }
-    componentDidLoad() {
-        this.checkTitle();
-    }
-    checkTitle() {
-        if (!this.titleEl.textContent.trim()) {
-            throw new Error('Please provide a title to the list component. Title is mandatory for accessibility purposes.');
-        }
-    }
-    render() {
-        return (h(Host, { key: '4f982e717530514589c5528553b70463d678b676', "data-version": version }, h("div", { key: 'cc65ed208f48e7a22482af96fd069d05363f2617', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, h("slot", { key: '0f8bbeade50b59e53767ce2169dd57bb79644705' })), h("div", { key: '7fa5de37a169e6f76928c2088c46ee747427887e', role: "list", "aria-labelledby": this.titleId }, h("slot", { key: '86b4d71b83671babb61dd12e842710d67350a09e', name: "post-list-item" }))));
-    }
-    get host() { return this; }
-    static get style() { return PostListStyle0; }
-}, [4, "post-list", {
-        "titleHidden": [4, "title-hidden"],
-        "horizontal": [516],
-        "titleId": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-list"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-list":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostList);
-            }
-            break;
-    } });
-}
-
-export { PostList as P, defineCustomElement as d };

package/dist/components/post-mainnavigation.d.ts

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

package/dist/components/post-mainnavigation.js

@@ -1,6 +0,0 @@
-import { P as PostMainnavigation$1, d as defineCustomElement$1 } from './post-mainnavigation2.js';
-
-const PostMainnavigation = PostMainnavigation$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PostMainnavigation, defineCustomElement };

package/dist/components/post-mainnavigation2.js

@@ -1,48 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-
-const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color: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>button,post-mainnavigation post-list-item post-megadropdown-trigger button{display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button: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>button:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:var(--post-core-dimension-4);z-index:1}@media screen and (min-width: 1024px){post-mainnavigation nav{position:relative;max-width:100vw;max-height:var(--post-core-dimension-56);user-select:none}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{padding-inline:var(--post-core-dimension-12);height:var(--post-core-dimension-56);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}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)}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)}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:\"\";-webkit-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\");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)}post-mainnavigation [slot=back-button]{display:none}}@media screen and (max-width: 1023.99px){post-mainnavigation post-list>[role=list]{transform:none !important}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;height:var(--post-core-dimension-48);padding-inline-end:var(--post-core-dimension-6);gap:var(--post-core-dimension-16);border-block:var(--post-core-dimension-1) solid rgba(0,0,0,0);border-block-end-color:currentColor;font-weight:var(--post-core-font-weight-700)}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button.selected{border-block-width: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;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.667 5.333H18.8L29.467 16H0v1.333h29.467L18.8 28h1.867L32 16.667z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.667 5.333H18.8L29.467 16H0v1.333h29.467L18.8 28h1.867L32 16.667z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;width:var(--post-core-dimension-24);height:var(--post-core-dimension-24)}}";
-const PostMainnavigationStyle0 = postMainnavigationCss;
-
-const PostMainnavigation = /*@__PURE__*/ proxyCustomElement(class PostMainnavigation extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.postToggle = createEvent(this, "postToggle", 7);
-    }
-    /**
-     * Retrieves a reference to the closest 'post-header' element when the main navigation is added to the DOM.
-     */
-    connectedCallback() {
-        this.header = this.host.closest('post-header');
-    }
-    /**
-     * Cleans up references and disconnects the MutationObserver when the main navigation is removed from the DOM.
-     */
-    disconnectedCallback() {
-        this.header = null;
-    }
-    handleBackButtonClick() {
-        if (this.header)
-            this.header.toggleMobileMenu();
-    }
-    render() {
-        return (h(Host, { key: 'f21c438ac0bbcb08e08fd419589bf92b7d8b3a61', slot: "post-mainnavigation" }, h("div", { key: '1925f47932d7e842e8b9f059d7ade955c577fa50', onClick: () => this.handleBackButtonClick(), class: "back-button" }, h("slot", { key: 'fe18f6859a6d79c7ae701b65a31be1eab9c8b2ac', name: "back-button" })), h("nav", { key: 'ad2b0a52bc0bcf78a3c3340ba163ee6167be2c73' }, h("slot", { key: '8fc7b01cc0f3729cd2c12c4967ec87891fe0dcf5' }))));
-    }
-    get host() { return this; }
-    static get style() { return PostMainnavigationStyle0; }
-}, [4, "post-mainnavigation"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-mainnavigation"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-mainnavigation":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMainnavigation);
-            }
-            break;
-    } });
-}
-
-export { PostMainnavigation as P, defineCustomElement as d };

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

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

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

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

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

@@ -1,91 +0,0 @@
-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%}";
-const PostMegadropdownTriggerStyle0 = postMegadropdownTriggerCss;
-
-const PostMegadropdownTrigger = /*@__PURE__*/ proxyCustomElement(class PostMegadropdownTrigger extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        /**
-         * Reference to the slotted button within the trigger, if present.
-         * Used to manage click and key events for mega dropdown control.
-         */
-        this.slottedButton = null;
-        this.for = undefined;
-        this.ariaExpanded = false;
-    }
-    /**
-     * Watch for changes to the `for` property to validate its type and ensure it is a string.
-     * @param forValue - The new value of the `for` property.
-     */
-    validateControlFor(forValue = this.for) {
-        checkType(forValue, 'string', 'The "for" property is required and should be a string.');
-    }
-    get megadropdown() {
-        const ref = document.getElementById(this.for);
-        return ref && ref.localName === 'post-megadropdown'
-            ? ref
-            : null;
-    }
-    handleToggle() {
-        if (this.megadropdown) {
-            this.megadropdown.toggle(this.host);
-        }
-        else {
-            console.warn(`No post-megadropdown found with ID: ${this.for}`);
-        }
-    }
-    componentDidLoad() {
-        this.validateControlFor();
-        // Check if the mega dropdown attached to the trigger is expanded or not
-        document.addEventListener('postToggleMegadropdown', (event) => {
-            if (event.target.id === this.for) {
-                this.ariaExpanded = event.detail;
-                if (this.slottedButton) {
-                    this.slottedButton.setAttribute('aria-expanded', this.ariaExpanded.toString());
-                }
-            }
-        });
-        this.slottedButton = this.host.querySelector('button');
-        if (this.slottedButton) {
-            this.slottedButton.setAttribute('aria-haspopup', 'menu');
-            this.slottedButton.addEventListener('click', () => {
-                this.handleToggle();
-            });
-        }
-        else {
-            console.warn('No button found within post-megadropdown-trigger');
-        }
-    }
-    render() {
-        return (h(Host, { key: '4ab919adeaa51fc12d45131fa540c76fb3ba73d9', "data-version": version, "tab-index": "-1" }, h("button", { key: 'e7dac321691cdb19a4874fd0b2097227d077af35' }, h("slot", { key: 'beffc38d2d35a67e74364c3b40b6d39896aa4de3' }))));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "for": ["validateControlFor"]
-    }; }
-    static get style() { return PostMegadropdownTriggerStyle0; }
-}, [4, "post-megadropdown-trigger", {
-        "for": [1],
-        "ariaExpanded": [32]
-    }, undefined, {
-        "for": ["validateControlFor"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-megadropdown-trigger"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-megadropdown-trigger":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMegadropdownTrigger);
-            }
-            break;
-    } });
-}
-
-export { PostMegadropdownTrigger as P, defineCustomElement as d };

package/dist/components/post-megadropdown.d.ts

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

package/dist/components/post-megadropdown.js

@@ -1,6 +0,0 @@
-import { P as PostMegadropdown$1, d as defineCustomElement$1 } from './post-megadropdown2.js';
-
-const PostMegadropdown = PostMegadropdown$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PostMegadropdown, defineCustomElement };

package/dist/components/post-megadropdown2.js

@@ -1,93 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$1 } from './post-popovercontainer2.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%)}}*,::before,::after{box-sizing:border-box}post-popovercontainer{--post-global-header-height:72px;--post-main-header-height:56px;--post-header-height:calc(var(--post-global-header-height) + var(--post-main-header-height));background-color:#fafafa;border:none;border-top:1px solid #e1e0dc;width:100%;border-radius:0;box-shadow:0 8px 6px rgba(0,0,0,.16)}@media screen and (max-width: 1023.99px){post-popovercontainer{--post-global-header-height:64px;position:absolute;top:var(--post-header-height) !important;bottom:0;left:0;width:100%;height:auto}post-popovercontainer.slide-in{animation:slide-in;animation-duration:350ms;animation-fill-mode:forwards}post-popovercontainer.slide-out{animation:slide-out;animation-duration:350ms;animation-fill-mode:forwards}}.megadropdown{padding:31px 40px 40px}@media screen and (max-width: 1023.99px){.megadropdown{padding:16px 32px 24px}}.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.99px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.99px){.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.99px){.megadropdown h2{display:block;font-size:20px}}.megadropdown a:hover{border-block-width:0}.megadropdown a:hover::after{content:unset}.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;border-bottom:1px solid #050400;padding:15px 12px 14px 0;display:block;font-weight:900}.megadropdown post-list .list-title h3 a{text-decoration:none;width:100%;font-size:inherit;display:inline-block;font-weight:inherit;height:unset;padding:0;border:0}@media screen and (max-width: 1023.99px){.megadropdown post-list .list-title h3{font-size:16px;padding:12px 12px 11px 0}}.megadropdown post-list-item{border-bottom:1px solid #050400}.megadropdown post-list-item>a{padding:13px 12px 12px 0;display:block;text-decoration:none;width:100%;border-bottom:0;height:auto;border-top:0}@media screen and (max-width: 1023.99px){.megadropdown post-list-item>a{padding:12px 12px 11px 0}}.megadropdown .back-button{display:none;margin-bottom:2rem}.megadropdown .back-button .btn{width:auto}.megadropdown .back-button post-icon{transform:rotate(180deg)}@media screen and (max-width: 1023.99px){.megadropdown .back-button{display:block}}.megadropdown .close-button{position:absolute;top:1rem;right:1rem}@media screen and (max-width: 1023.99px){.megadropdown .close-button{display:none}}";
-const PostMegadropdownStyle0 = postMegadropdownCss;
-
-const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.postToggleMegadropdown = createEvent(this, "postToggleMegadropdown", 7);
-        this.isVisible = false;
-        this.animationClass = null;
-    }
-    componentDidLoad() {
-        this.popoverRef.addEventListener('postToggle', (event) => {
-            this.isVisible = event.detail;
-            this.postToggleMegadropdown.emit(this.isVisible);
-        });
-        this.popoverRef.addEventListener('animationend', () => {
-            if (this.animationClass === 'slide-out') {
-                this.hide();
-            }
-        });
-    }
-    /**
-     * Toggles the dropdown visibility based on its current state.
-     */
-    async toggle(target) {
-        this.isVisible ? this.hide() : await this.show(target);
-    }
-    /**
-     * Displays the popover dropdown
-     *
-     * @param target - The HTML element relative to which the popover dropdown should be displayed.
-     */
-    async show(target) {
-        if (this.popoverRef) {
-            await this.popoverRef.show(target);
-            this.animationClass = 'slide-in';
-        }
-        else {
-            console.error('show: popoverRef is null or undefined');
-        }
-    }
-    /**
-     * Hides the popover dropdown
-     */
-    hide() {
-        if (this.popoverRef) {
-            this.popoverRef.hide();
-        }
-        else {
-            console.error('hide: popoverRef is null or undefined');
-        }
-    }
-    handleBackButtonClick() {
-        this.animationClass = 'slide-out';
-    }
-    handleCloseButtonClick() {
-        this.popoverRef.hide();
-    }
-    render() {
-        return (h(Host, { key: 'cfd4e6c7bb87c50e471d304a4b4f086266e1c2fe' }, h("post-popovercontainer", { key: '31dc3a5e98a5c60a4db8d47375491a6f3957af0b', class: this.animationClass, placement: "bottom", "edge-gap": "0", ref: el => (this.popoverRef = el) }, h("div", { key: '7001d0e108544a0244af088be0bde49f90a3dea3', class: "megadropdown" }, h("div", { key: '513b0710163e8f58677b6b50d2ba2d241cf9ff35', onClick: () => this.handleBackButtonClick(), class: "back-button" }, h("slot", { key: '5457c0b9bfff045f39f470e600b5aa31036c0807', name: "back-button" })), h("div", { key: 'c3314a4ae4f386224a2db7fe32203f72f6a1b284', onClick: () => this.handleCloseButtonClick(), class: "close-button" }, h("slot", { key: '8feeec24fe5f2522ba1a54ab0b7c682d3a152086', name: "close-button" })), h("slot", { key: '6d9426756a809ed26045c9cd56cacf0f36aa9400', name: "megadropdown-title" }), h("div", { key: 'fd3b0ac7998eec76700ccc6668d8b2e3fcc4c63a', class: "megadropdown-content" }, h("slot", { key: '23638936fdffa224de9631bfd599c0872202a30d' }))))));
-    }
-    get host() { return this; }
-    static get style() { return PostMegadropdownStyle0; }
-}, [4, "post-megadropdown", {
-        "isVisible": [32],
-        "animationClass": [32],
-        "toggle": [64],
-        "show": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-megadropdown", "post-popovercontainer"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-megadropdown":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMegadropdown);
-            }
-            break;
-        case "post-popovercontainer":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { PostMegadropdown as P, defineCustomElement as d };

package/dist/components/post-menu-item.d.ts

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

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

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

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

@@ -1,33 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-
-const postMenuItemCss = ":host{display:block}";
-const PostMenuItemStyle0 = postMenuItemCss;
-
-const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-    }
-    render() {
-        return (h(Host, { key: '0f53b8f818c87c59b0ec56e522852af0966e37ad', role: "menuitem", "data-version": version }, h("slot", { key: '4b821e1282df9bcfd297d74af56dfd5605baa0ee' })));
-    }
-    get host() { return this; }
-    static get style() { return PostMenuItemStyle0; }
-}, [1, "post-menu-item"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-menu-item"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-menu-item":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMenuItem);
-            }
-            break;
-    } });
-}
-
-export { PostMenuItem as P, defineCustomElement as d };

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

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

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

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