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

package/dist/components/post-megadropdown2.js

@@ -1,67 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$1 } from './post-popovercontainer2.js';
-
-const postMegadropdownCss = "*,::before,::after{box-sizing:border-box}post-popovercontainer{background-color:#fafafa;width:100%;border-bottom:1px solid #000}@media screen and (max-width: 1023.99px){post-popovercontainer{position:absolute;top:var(--header-height) !important;bottom:0;left:0;width:100%;height:auto}}.megadropdown{display:flex;gap:1rem;padding:1.5rem;border-radius:0 0 3px 3px}@media screen and (max-width: 1023.99px){.megadropdown{flex-direction:column}}.megadropdown post-list{display:flex;flex-direction:column;gap:.5rem}.megadropdown post-list-item{border-bottom:1px solid gray}.megadropdown post-list-item>a{padding-block:.25rem;display:block;text-decoration:none}.back-button{display:none}@media screen and (max-width: 1023.99px){.back-button{display:block}}post-closebutton{margin-left:auto}@media screen and (max-width: 1023.99px){post-closebutton{display:none}}h3{font-size:20px}";
-const PostMegadropdownStyle0 = postMegadropdownCss;
-
-const PostMegadropdown = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-    }
-    /**
-     * Show megadropdown
-     * @param element HTMLElement
-     * @returns boolean
-     */
-    async show(element) {
-        return this.popoverRef.show(element);
-    }
-    /**
-     * Hide megadropdown
-     * @returns boolean
-     */
-    async hide() {
-        return this.popoverRef.hide();
-    }
-    /**
-     * Toggle megadropdown
-     * @param element HTMLElement
-     * @param force boolean
-     * @returns boolean
-     */
-    async toggle(element, force) {
-        return this.popoverRef.toggle(element, force !== null && force !== void 0 ? force : undefined);
-    }
-    handleBackButtonClick() {
-        this.hide();
-    }
-    render() {
-        return (h(Host, { key: '9b8e17f4120259f55ed3dbce4780559cb8876540', slot: "post-mainnavigation" }, h("post-popovercontainer", { key: 'ac48d1fffbcdff5aa20d9f2f6fed9beb4dd3be23', placement: "bottom", "edge-gap": "0", ref: el => (this.popoverRef = el) }, h("div", { key: 'af02d9fd35973b6d889b639f1d856dd3d9921ae1', class: "megadropdown" }, h("div", { key: '445aa9b1a04e63c0d2b17466c610a30662f3db0e', onClick: () => this.handleBackButtonClick(), class: "back-button" }, h("slot", { key: '8d8f4cad3d5860fdfc1c615e7122ab5dd2ca5ed3', name: "back-button" })), h("slot", { key: 'c9ba8c0941f86fd29a44153e186cd679bcd678f5' })))));
-    }
-    static get style() { return PostMegadropdownStyle0; }
-}, [4, "post-megadropdown", {
-        "show": [64],
-        "hide": [64],
-        "toggle": [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: '8e20fdee0faff826319440bed6ec7be0c56e6d06', role: "menuitem", "data-version": version }, h("slot", { key: '69e2be9dec334ade8e84ccb268c7d4955dd2fefb' })));
-    }
-    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 };

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

@@ -1,92 +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';
-import { g as getRoot } from './get-root.js';
-
-const postMenuTriggerCss = ":host{display:inline-block}";
-const PostMenuTriggerStyle0 = postMenuTriggerCss;
-
-const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        /**
-         * Reference to the slotted button within the trigger, if present.
-         * Used to manage click and key events for menu control.
-         */
-        this.slottedButton = null;
-        this.handleKeyDown = (e) => {
-            if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
-                e.preventDefault();
-                this.handleToggle();
-            }
-        };
-        this.for = undefined;
-        this.ariaExpanded = false;
-    }
-    /**
-     * 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 menu() {
-        const ref = this.root.getElementById(this.for);
-        return ref && ref.localName === 'post-menu' ? ref : null;
-    }
-    handleToggle() {
-        const menu = this.menu;
-        if (menu && this.slottedButton) {
-            this.ariaExpanded = !this.ariaExpanded;
-            this.slottedButton.setAttribute('aria-expanded', this.ariaExpanded.toString());
-            menu.toggle(this.host);
-        }
-        else {
-            console.warn(`No post-menu found with ID: ${this.for}`);
-        }
-    }
-    componentDidLoad() {
-        this.root = getRoot(this.host);
-        this.validateControlFor();
-        this.slottedButton = this.host.querySelector('button');
-        if (this.slottedButton) {
-            this.slottedButton.setAttribute('aria-haspopup', 'menu');
-            this.slottedButton.addEventListener('click', () => {
-                this.handleToggle();
-            });
-            this.slottedButton.addEventListener('keydown', this.handleKeyDown);
-        }
-        else {
-            console.warn('No button found within post-menu-trigger');
-        }
-    }
-    render() {
-        return (h(Host, { key: 'd6b5619d0b4035887eaffdcc3c153eb0a5fe4ceb', "data-version": version, "tab-index": "-1" }, h("slot", { key: '5d87c80dae6188470b10207993822d92adc714b1' })));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "for": ["validateControlFor"]
-    }; }
-    static get style() { return PostMenuTriggerStyle0; }
-}, [4, "post-menu-trigger", {
-        "for": [1],
-        "ariaExpanded": [32]
-    }, undefined, {
-        "for": ["validateControlFor"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-menu-trigger"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-menu-trigger":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMenuTrigger);
-            }
-            break;
-    } });
-}
-
-export { PostMenuTrigger as P, defineCustomElement as d };

package/dist/components/post-menu.js

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

package/dist/components/post-menu2.js

@@ -1,201 +0,0 @@
-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-popovercontainer2.js';
-
-const focusableSelector = `:where(${[
-    'button',
-    'input:not([type="hidden"])',
-    '[tabindex]',
-    'select',
-    'textarea',
-    '[contenteditable]',
-    'a[href]',
-    'iframe',
-    'audio[controls]',
-    'video[controls]',
-    'area[href]',
-    'details > summary:first-of-type',
-].join(',')})`;
-const focusDisablingSelector = `:where(${[
-    '[inert]',
-    '[inert] *',
-    ':disabled',
-    'dialog:not([open]) *',
-    '[popover]:not(:popover-open) *',
-    'details:not([open]) > *:not(details > summary:first-of-type)',
-    'details:not([open]) > *:not(details > summary:first-of-type) *',
-].join(',')})`;
-const isFocusable = (element) => {
-    return (element === null || element === void 0 ? void 0 : element.matches(focusableSelector)) && !(element === null || element === void 0 ? void 0 : element.matches(focusDisablingSelector));
-};
-
-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)}";
-const PostMenuStyle0 = postMenuCss;
-
-const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.toggleMenu = createEvent(this, "toggleMenu", 7);
-        this.lastFocusedElement = null;
-        this.KEYCODES = {
-            SPACE: ' ',
-            ENTER: 'Enter',
-            UP: 'ArrowUp',
-            DOWN: 'ArrowDown',
-            TAB: 'Tab',
-            HOME: 'Home',
-            END: 'End',
-            ESCAPE: 'Escape'
-        };
-        this.handleKeyDown = (e) => {
-            e.stopPropagation();
-            if (e.key === this.KEYCODES.ESCAPE) {
-                this.toggle(this.host);
-                return;
-            }
-            if (Object.values(this.KEYCODES).includes(e.key)) {
-                this.controlKeyDownHandler(e);
-            }
-        };
-        this.handleClick = (e) => {
-            const target = e.target;
-            if (['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {
-                this.toggle(this.host);
-            }
-        };
-        this.placement = 'bottom';
-        this.isVisible = false;
-    }
-    connectedCallback() {
-        this.host.addEventListener('keydown', this.handleKeyDown);
-        this.host.addEventListener('click', this.handleClick);
-    }
-    disconnectedCallback() {
-        this.host.removeEventListener('keydown', this.handleKeyDown);
-        this.host.removeEventListener('click', this.handleClick);
-    }
-    componentDidLoad() {
-        this.popoverRef.addEventListener('postToggle', (event) => {
-            this.isVisible = event.detail;
-            this.toggleMenu.emit(this.isVisible);
-        });
-    }
-    /**
-     * Toggles the menu visibility based on its current state.
-     */
-    async toggle(target) {
-        this.isVisible ? await this.hide() : await this.show(target);
-    }
-    /**
-     * Displays the popover menu, focusing the first menu item.
-     *
-     * @param target - The HTML element relative to which the popover menu should be displayed.
-     */
-    async show(target) {
-        if (this.popoverRef) {
-            await this.popoverRef.show(target);
-            this.lastFocusedElement = document.activeElement;
-            const menuItems = this.getSlottedItems();
-            if (menuItems.length > 0) {
-                menuItems[0].focus();
-            }
-        }
-        else {
-            console.error('show: popoverRef is null or undefined');
-        }
-    }
-    /**
-     * Hides the popover menu and restores focus to the previously focused element.
-     */
-    async hide() {
-        if (this.popoverRef) {
-            await this.popoverRef.hide();
-            if (this.lastFocusedElement) {
-                this.lastFocusedElement.focus();
-            }
-        }
-        else {
-            console.error('hide: popoverRef is null or undefined');
-        }
-    }
-    controlKeyDownHandler(e) {
-        const menuItems = this.getSlottedItems();
-        if (!menuItems.length) {
-            return;
-        }
-        const currentFocusedElement = document.activeElement;
-        let currentIndex = menuItems.findIndex(el => el === currentFocusedElement);
-        switch (e.key) {
-            case this.KEYCODES.UP:
-                e.preventDefault();
-                currentIndex = (currentIndex - 1 + menuItems.length) % menuItems.length;
-                break;
-            case this.KEYCODES.DOWN:
-                e.preventDefault();
-                currentIndex = (currentIndex + 1) % menuItems.length;
-                break;
-            case this.KEYCODES.HOME:
-                currentIndex = 0;
-                break;
-            case this.KEYCODES.END:
-                currentIndex = menuItems.length - 1;
-                break;
-            case this.KEYCODES.SPACE:
-            case this.KEYCODES.ENTER:
-                this.toggle(this.host);
-                return;
-            case this.KEYCODES.TAB:
-                this.toggle(this.host);
-                break;
-        }
-        if (menuItems[currentIndex]) {
-            menuItems[currentIndex].focus();
-        }
-    }
-    getSlottedItems() {
-        const slot = this.host.shadowRoot.querySelector('slot');
-        const slottedElements = slot ? slot.assignedElements() : [];
-        const menuItems = slottedElements
-            .filter(el => el.tagName === 'POST-MENU-ITEM')
-            .map(el => {
-            const slot = el.shadowRoot.querySelector('slot');
-            const assignedElements = slot ? slot.assignedElements() : [];
-            return assignedElements.filter(isFocusable);
-        })
-            .flat();
-        return menuItems;
-    }
-    render() {
-        return (h(Host, { key: 'c3fa319c92cc36b562590df18b6585b1bc18f133', "data-version": version }, h("post-popovercontainer", { key: '7d297b7598fecb01f46c3f1b999b6017ee878d06', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '3ae32950348ae8910094cddd34afef060ca517f1', class: "popover-container" }, h("slot", { key: '7faa98f2f4c50ef1ac424387a6c3890dcf09adce' })))));
-    }
-    get host() { return this; }
-    static get style() { return PostMenuStyle0; }
-}, [1, "post-menu", {
-        "placement": [1],
-        "isVisible": [32],
-        "toggle": [64],
-        "show": [64],
-        "hide": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-menu", "post-popovercontainer"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-menu":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMenu);
-            }
-            break;
-        case "post-popovercontainer":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { PostMenu as P, defineCustomElement as d };

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

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

package/dist/components/post-togglebutton.js

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

package/dist/components/post-togglebutton2.js

@@ -1,43 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-
-const postTogglebuttonCss = ":host{cursor:pointer}";
-const PostTogglebuttonStyle0 = postTogglebuttonCss;
-
-const PostTogglebutton = /*@__PURE__*/ proxyCustomElement(class PostTogglebutton extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.handleClick = () => {
-            this.toggled = !this.toggled;
-        };
-        this.handleKeydown = (event) => {
-            if (event.key === 'Enter') {
-                this.toggled = !this.toggled;
-            }
-        };
-        this.toggled = false;
-    }
-    render() {
-        return (h(Host, { key: '82fc4126d97650255d1d5fd041208b3d11cf0ded', slot: "post-togglebutton", tabindex: "0", "data-version": version, role: "button", "aria-pressed": this.toggled.toString(), onClick: this.handleClick, onKeyDown: this.handleKeydown }, h("span", { key: '0364e8b63cc2c7955282f62533683c3627aa6626', hidden: this.toggled }, h("slot", { key: '11ccb62855497ddf395276e7f7e88a8409fa36e4', name: "untoggled" })), h("span", { key: '463f4571ceecc51063a4d4495d22063b6b75d0df', hidden: !this.toggled }, h("slot", { key: '7d41e35a64deefd22087524bc57530603aae18fa', name: "toggled" }))));
-    }
-    static get style() { return PostTogglebuttonStyle0; }
-}, [1, "post-togglebutton", {
-        "toggled": [1540]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-togglebutton"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-togglebutton":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostTogglebutton);
-            }
-            break;
-    } });
-}
-
-export { PostTogglebutton as P, defineCustomElement as d };

package/dist/esm/attribute-observer-37fa950a.js

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

package/dist/esm/get-root-7af2e0d1.js

@@ -1,9 +0,0 @@
-function getRoot(element) {
-    const root = element.getRootNode();
-    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/esm/package-9cafe148.js

@@ -1,3 +0,0 @@
-const version = "9.0.0-next.8";
-
-export { version as v };

package/dist/esm/post-accordion-item-33bbe4de.js

@@ -1,60 +0,0 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-e1b64755.js';
-import { v as version } from './package-9cafe148.js';
-import { H as HEADING_LEVELS } from './heading-levels-5b7b4349.js';
-import { c as checkEmptyOrOneOf } from './index-f8a00dc0.js';
-
-const postAccordionItemCss = ":host::after{display:block;content:\"\";margin-top:calc(var(--post-device-border-width-default)*-1);border-bottom:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}:host:has(.accordion-button:hover)::after{border-color:var(--post-scheme-color-interactive-primary-hover-stroke)}.accordion-header{color:var(--post-scheme-color-interactive-primary-enabled-fg1);font-size:var(--post-device-font-size-5);margin:0;line-height:var(--post-device-line-height-heading);font-weight:var(--post-device-font-weight-black)}.accordion-button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;display:flex;position:relative;width:100%;align-items:center;text-align:start;gap:var(--post-device-spacing-gap-7);padding:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default)) calc(var(--post-device-spacing-padding-5) + var(--post-device-border-width-default));transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;cursor:pointer}.accordion-button::before{display:block;position:absolute;content:\"\";inset:0;bottom:auto;border-top:var(--post-accordion-button-border-top)}.accordion-button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.accordion-button slot::slotted(span[slot=header]){flex-grow:1}.accordion-button post-icon{flex:none;width:var(--post-core-dimension-24);aspect-ratio:1;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed{padding-block-start:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default));padding-block-end:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default))}.accordion-button.collapsed post-icon{transform:rotate(-180deg)}.accordion-button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}.accordion-button>::slotted(.text-truncate){display:block}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover:not(:disabled),.accordion-button:focus-visible:not(:disabled){outline:var(--post-device-border-width-default) solid Highlight}.accordion-button:disabled{opacity:1 !important}}.accordion-body{padding-block-start:var(--post-device-spacing-padding-15);padding-block-end:calc(var(--post-device-spacing-padding-block-25) + var(--post-device-border-width-default));padding-inline:var(--post-device-spacing-padding-5)}.logo-container{display:none;width:var(--post-device-sizing-logo-1);aspect-ratio:1}.logo-container.has-image{display:block}.logo-container slot::slotted(img){display:block;width:100%;height:100%;object-fit:cover}.accordion-button>::slotted(:first-child),.accordion-body>::slotted(:first-child){margin-block-start:0 !important}.accordion-button>::slotted(:last-child),.accordion-body>::slotted(:last-child){margin-block-end:0 !important}";
-const PostAccordionItemStyle0 = postAccordionItemCss;
-
-const PostAccordionItem = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.id = undefined;
-        this.slottedLogo = undefined;
-        this.collapsed = false;
-        this.headingLevel = undefined;
-    }
-    validateHeadingLevel(newValue = this.headingLevel) {
-        checkEmptyOrOneOf(newValue, HEADING_LEVELS, 'The `heading-level` property of the `post-accordion-item` must be a number between 1 and 6.');
-    }
-    componentWillLoad() {
-        this.id = this.host.id || `a${crypto.randomUUID()}`;
-    }
-    componentDidLoad() {
-        this.validateHeadingLevel();
-    }
-    // capture to make sure the "collapsed" property is updated before the event is consumed
-    onCollapseToggle(event) {
-        if (event.target === this.host &&
-            event.target.localName === 'post-accordion-item') {
-            this.collapsed = !event.detail;
-        }
-    }
-    /**
-     * Triggers the collapse programmatically.
-     */
-    async toggle(force) {
-        return this.collapsible.toggle(force);
-    }
-    onSlotLogoChange() {
-        this.slottedLogo = this.host.querySelector('img[slot="logo"]');
-    }
-    componentWillRender() {
-        this.slottedLogo = this.host.querySelector('img[slot="logo"]');
-    }
-    render() {
-        var _a;
-        const HeadingTag = `h${(_a = this.headingLevel) !== null && _a !== void 0 ? _a : 2}`;
-        return (h(Host, { key: 'c125939ea36a2d8d98f645ff2e22863cfe799a73', id: this.id, "data-version": version }, h("div", { key: '2d8ac2807d839745562b72e2db650886a7f04d8d', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '4b2743a143c21bbff7cc3be3f8f9833b97327605', for: `${this.id}--collapse` }, h(HeadingTag, { key: 'c2073d092cb021ac7825184c0634f3f903f119ae', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: '663915c767685ac0f57dd04071e3d525312f4fa7', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}` }, h("span", { key: 'bbd07f382cdb69334fc8540fc48db81865caa4b2', class: {
-                'logo-container': true,
-                'has-image': !!this.slottedLogo,
-            } }, h("slot", { key: '9d1e97d3c93a7ef406a743a2a877660f3de9747e', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: 'ffdaac001188bc920bc43145604b0208427fbe59', name: "header" }), h("post-icon", { key: '6cba37b29b734819a698a0043d8d4924fd496309', name: "2051" })))), h("post-collapsible", { key: '915f7e9063066ca1adf684157832d70a961c20e0', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: 'e1d38f9f25a93dcf5aa3bbb94b8baed46b337616', class: "accordion-body" }, h("slot", { key: 'fbfb6764e6a8d3dfda7b87fe0a61d62d90d59b7e' }))))));
-    }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "headingLevel": ["validateHeadingLevel"]
-    }; }
-};
-PostAccordionItem.style = PostAccordionItemStyle0;
-
-export { PostAccordionItem as P };