@swisspost/design-system-components 9.0.0-next.3 → 9.0.0-next.30

package/dist/types/components.d.ts

@@ -6,10 +6,14 @@
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { HeadingLevel } from "./types/index";
-import { AlertType } from "./components/post-alert/alert-types";
+import { BannerType } from "./components/post-banner/banner-types";
+import { DEVICE_SIZE } from "./components/post-header/post-header";
+import { SwitchVariant } from "./components/post-language-switch/switch-variants";
 import { Placement } from "@floating-ui/dom";
 export { HeadingLevel } from "./types/index";
-export { AlertType } from "./components/post-alert/alert-types";
+export { BannerType } from "./components/post-banner/banner-types";
+export { DEVICE_SIZE } from "./components/post-header/post-header";
+export { SwitchVariant } from "./components/post-language-switch/switch-variants";
 export { Placement } from "@floating-ui/dom";
 export namespace Components {
     interface PostAccordion {
@@ -49,49 +53,67 @@ export namespace Components {
          */
         "toggle": (force?: boolean) => Promise<boolean>;
     }
-    interface PostAlert {
+    interface PostAvatar {
+        /**
+          * Defines the users email address associated with a gravatar profile picture.
+         */
+        "email"?: string;
+        /**
+          * Defines the users firstname.
+         */
+        "firstname": string;
+        /**
+          * Defines the users lastname.
+         */
+        "lastname"?: string;
+        /**
+          * Defines the company internal userId.<div className="mb-1 banner banner-warning banner-sm">Can only be used on post.ch domains!</div>
+         */
+        "userid"?: string;
+    }
+    interface PostBackToTop {
         /**
-          * Triggers alert dismissal programmatically (same as clicking on the close button (×)).
+          * The label of the back-to-top button, intended solely for accessibility purposes. This label is always hidden from view.
+         */
+        "label": string;
+    }
+    interface PostBanner {
+        /**
+          * Triggers banner dismissal programmatically (same as clicking on the close button (×)).
          */
         "dismiss": () => Promise<void>;
         /**
-          * The label to use for the close button of a dismissible alert.
+          * The label to use for the close button of a dismissible banner.
          */
         "dismissLabel": string;
         /**
-          * If `true`, a close button (×) is displayed and the alert can be dismissed by the user.
+          * If `true`, a close button (×) is displayed and the banner can be dismissed by the user.
          */
         "dismissible": boolean;
         /**
-          * If `true`, the alert is positioned at the bottom of the window, from edge to edge.
-         */
-        "fixed": boolean;
-        /**
-          * The icon to display in the alert. By default, the icon depends on the alert type.  If `none`, no icon is displayed.
+          * The icon to display in the banner. By default, the icon depends on the banner type.  If `none`, no icon is displayed.
          */
         "icon": string;
         /**
-          * The type of the alert.
+          * The type of the banner.
          */
-        "type": AlertType;
+        "type": BannerType;
     }
-    interface PostAvatar {
-        /**
-          * Defines the users email address associated with a gravatar profile picture.
-         */
-        "email"?: string;
+    interface PostBreadcrumb {
         /**
-          * Defines the users firstname.
+          * The text label for the home breadcrumb item.
          */
-        "firstname": string;
+        "homeText": string;
         /**
-          * Defines the users lastname.
+          * The URL for the home breadcrumb item.
          */
-        "lastname"?: string;
+        "homeUrl": string;
+    }
+    interface PostBreadcrumbItem {
         /**
-          * Defines the company internal userId.<div className="mb-1 alert alert-warning alert-sm">Can only be used on post.ch domains!</div>
+          * The optional URL to which the breadcrumb item will link.
          */
-        "userid"?: string;
+        "url"?: string | URL;
     }
     /**
      * @class PostCardControl - representing a stencil component
@@ -114,7 +136,7 @@ export namespace Components {
          */
         "groupReset": () => Promise<void>;
         /**
-          * Defines the icon `name` inside the card. <span className="alert alert-sm alert-info">If not set the icon will not show up.</span>
+          * Defines the icon `name` inside the card. <span className="banner banner-sm banner-info">If not set the icon will not show up.</span>
          */
         "icon": string;
         /**
@@ -122,7 +144,7 @@ export namespace Components {
          */
         "label": string;
         /**
-          * Defines the `name` attribute of the control. <span className="alert alert-sm alert-info">This is a required property, when the control should participate in a native `form`. If not specified, a native `form` will never contain this controls value.</span> <span className="alert alert-sm alert-info">This is a required property, when the control is used with type `radio`.</span>
+          * Defines the `name` attribute of the control. <span className="banner banner-sm banner-info">This is a required property, when the control should participate in a native `form`. If not specified, a native `form` will never contain this controls value.</span> <span className="banner banner-sm banner-info">This is a required property, when the control is used with type `radio`.</span>
          */
         "name": string;
         /**
@@ -138,10 +160,12 @@ export namespace Components {
          */
         "validity": null | 'true' | 'false';
         /**
-          * Defines the `value` attribute of the control. <span className="alert alert-sm alert-info">This is a required property, when the control is used with type `radio`.</span>
+          * Defines the `value` attribute of the control. <span className="banner banner-sm banner-info">This is a required property, when the control is used with type `radio`.</span>
          */
         "value": string;
     }
+    interface PostClosebutton {
+    }
     interface PostCollapsible {
         /**
           * If `true`, the element is collapsed otherwise it is displayed.
@@ -162,6 +186,18 @@ export namespace Components {
          */
         "update": () => Promise<void>;
     }
+    interface PostFooter {
+        /**
+          * The label to add to the footer (visually hidden).
+         */
+        "label": string;
+    }
+    interface PostHeader {
+        /**
+          * Toggles the mobile navigation.
+         */
+        "toggleMobileMenu": (force?: boolean) => Promise<void>;
+    }
     /**
      * @class PostIcon - representing a stencil component
      */
@@ -216,6 +252,38 @@ export namespace Components {
           * The URL used for the href attribute of the internal anchor. This field is optional; if not provided, a button will be used internally instead of an anchor.
          */
         "url": string;
+        /**
+          * To communicate the variant prop from the parent (post-language-switch) component to the child (post-language-option) component. See parent docs for a description about the property itself.
+         */
+        "variant"?: SwitchVariant | null;
+    }
+    interface PostLanguageSwitch {
+        /**
+          * A title for the list of language options
+         */
+        "caption": string;
+        /**
+          * A descriptive text for the list of language options
+         */
+        "description": string;
+        /**
+          * Whether the component is rendered as a list or a menu
+         */
+        "variant": SwitchVariant;
+    }
+    interface PostLinkarea {
+    }
+    interface PostList {
+        /**
+          * The list can become horizontal by setting `horizontal="true"` or just `horizontal`
+         */
+        "horizontal": boolean;
+        /**
+          * If `true`, the list title will be hidden. Otherwise, it will be displayed.`
+         */
+        "titleHidden": boolean;
+    }
+    interface PostListItem {
     }
     interface PostLogo {
         /**
@@ -223,6 +291,59 @@ export namespace Components {
          */
         "url": string | URL;
     }
+    interface PostMainnavigation {
+    }
+    interface PostMegadropdown {
+        /**
+          * Sets focus to the first focusable element within the component.
+         */
+        "focusFirst": () => Promise<void>;
+        /**
+          * Hides the dropdown with an animation.
+         */
+        "hide": (focusParent?: boolean, forceClose?: boolean) => Promise<void>;
+        /**
+          * Displays the dropdown.
+         */
+        "show": () => Promise<void>;
+        /**
+          * Toggles the dropdown visibility based on its current state.
+         */
+        "toggle": () => Promise<void>;
+    }
+    interface PostMegadropdownTrigger {
+        /**
+          * ID of the mega dropdown element that this trigger is linked to. Used to open and close the specified mega dropdown.
+         */
+        "for": string;
+    }
+    interface PostMenu {
+        /**
+          * Hides the popover menu and restores focus to the previously focused element.
+         */
+        "hide": () => Promise<void>;
+        /**
+          * 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"?: Placement;
+        /**
+          * Displays the popover menu, focusing the first menu item.
+          * @param target - The HTML element relative to which the popover menu should be displayed.
+         */
+        "show": (target: HTMLElement) => Promise<void>;
+        /**
+          * Toggles the menu visibility based on its current state.
+         */
+        "toggle": (target: HTMLElement) => Promise<void>;
+    }
+    interface PostMenuItem {
+    }
+    interface PostMenuTrigger {
+        /**
+          * ID of the menu element that this trigger is linked to. Used to open and close the specified menu.
+         */
+        "for": string;
+    }
     interface PostPopover {
         /**
           * Show a little indicator arrow
@@ -254,17 +375,29 @@ export namespace Components {
     }
     interface PostPopovercontainer {
         /**
-          * Wheter or not to display a little pointer arrow
+          * Whether or not to display a little pointer arrow
          */
         "arrow"?: boolean;
+        /**
+          * Gap between the edge of the page and the popover
+         */
+        "edgeGap"?: number;
         /**
           * Programmatically hide this tooltip
          */
         "hide": () => Promise<void>;
+        /**
+          * Whether or not the popover should close when user clicks outside of it
+         */
+        "manualClose": boolean;
         /**
           * 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"?: Placement;
+        /**
+          * Enables a safespace through which the cursor can be moved without the popover being disabled
+         */
+        "safeSpace"?: 'triangle' | 'trapezoid';
         /**
           * Programmatically display the tooltip
           * @param target An element with [data-tooltip-target="id"] where the tooltip should be shown
@@ -319,7 +452,7 @@ export namespace Components {
     }
     interface PostTag {
         /**
-          * Defines the icon `name` inside of the component. <span className="alert alert-sm alert-info">If not set the icon will not show up.</span> To learn which icons are available, please visit our <a href="/?path=/docs/5704bdc4-c5b5-45e6-b123-c54d01fce2f1--docs">icon library</a>.
+          * Defines the icon `name` inside of the component. <span className="banner banner-sm banner-info">If not set the icon will not show up.</span> To learn which icons are available, please visit our <a href="/?path=/docs/5704bdc4-c5b5-45e6-b123-c54d01fce2f1--docs">icon library</a>.
          */
         "icon": null | string;
         /**
@@ -331,6 +464,12 @@ export namespace Components {
          */
         "variant": 'white' | 'info' | 'success' | 'error' | 'warning' | 'yellow';
     }
+    interface PostTogglebutton {
+        /**
+          * If `true`, the button is in the "on" state, otherwise it is in the "off" state.
+         */
+        "toggled": boolean;
+    }
     interface PostTooltip {
         /**
           * Wheter or not to display a little pointer arrow
@@ -362,9 +501,9 @@ export namespace Components {
         "toggle": (target: HTMLElement, force?: boolean) => Promise<void>;
     }
 }
-export interface PostAlertCustomEvent<T> extends CustomEvent<T> {
+export interface PostBannerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
-    target: HTMLPostAlertElement;
+    target: HTMLPostBannerElement;
 }
 export interface PostCardControlCustomEvent<T> extends CustomEvent<T> {
     detail: T;
@@ -374,10 +513,22 @@ export interface PostCollapsibleCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostCollapsibleElement;
 }
+export interface PostHeaderCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPostHeaderElement;
+}
 export interface PostLanguageOptionCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostLanguageOptionElement;
 }
+export interface PostMegadropdownCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPostMegadropdownElement;
+}
+export interface PostMenuCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPostMenuElement;
+}
 export interface PostPopovercontainerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostPopovercontainerElement;
@@ -403,28 +554,46 @@ declare global {
         prototype: HTMLPostAccordionItemElement;
         new (): HTMLPostAccordionItemElement;
     };
-    interface HTMLPostAlertElementEventMap {
+    interface HTMLPostAvatarElement extends Components.PostAvatar, HTMLStencilElement {
+    }
+    var HTMLPostAvatarElement: {
+        prototype: HTMLPostAvatarElement;
+        new (): HTMLPostAvatarElement;
+    };
+    interface HTMLPostBackToTopElement extends Components.PostBackToTop, HTMLStencilElement {
+    }
+    var HTMLPostBackToTopElement: {
+        prototype: HTMLPostBackToTopElement;
+        new (): HTMLPostBackToTopElement;
+    };
+    interface HTMLPostBannerElementEventMap {
         "postDismissed": void;
     }
-    interface HTMLPostAlertElement extends Components.PostAlert, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLPostAlertElementEventMap>(type: K, listener: (this: HTMLPostAlertElement, ev: PostAlertCustomEvent<HTMLPostAlertElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+    interface HTMLPostBannerElement extends Components.PostBanner, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPostBannerElementEventMap>(type: K, listener: (this: HTMLPostBannerElement, ev: PostBannerCustomEvent<HTMLPostBannerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLPostAlertElementEventMap>(type: K, listener: (this: HTMLPostAlertElement, ev: PostAlertCustomEvent<HTMLPostAlertElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLPostBannerElementEventMap>(type: K, listener: (this: HTMLPostBannerElement, ev: PostBannerCustomEvent<HTMLPostBannerElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     }
-    var HTMLPostAlertElement: {
-        prototype: HTMLPostAlertElement;
-        new (): HTMLPostAlertElement;
+    var HTMLPostBannerElement: {
+        prototype: HTMLPostBannerElement;
+        new (): HTMLPostBannerElement;
     };
-    interface HTMLPostAvatarElement extends Components.PostAvatar, HTMLStencilElement {
+    interface HTMLPostBreadcrumbElement extends Components.PostBreadcrumb, HTMLStencilElement {
     }
-    var HTMLPostAvatarElement: {
-        prototype: HTMLPostAvatarElement;
-        new (): HTMLPostAvatarElement;
+    var HTMLPostBreadcrumbElement: {
+        prototype: HTMLPostBreadcrumbElement;
+        new (): HTMLPostBreadcrumbElement;
+    };
+    interface HTMLPostBreadcrumbItemElement extends Components.PostBreadcrumbItem, HTMLStencilElement {
+    }
+    var HTMLPostBreadcrumbItemElement: {
+        prototype: HTMLPostBreadcrumbItemElement;
+        new (): HTMLPostBreadcrumbItemElement;
     };
     interface HTMLPostCardControlElementEventMap {
         "postInput": { state: boolean; value: string };
@@ -447,6 +616,12 @@ declare global {
         prototype: HTMLPostCardControlElement;
         new (): HTMLPostCardControlElement;
     };
+    interface HTMLPostClosebuttonElement extends Components.PostClosebutton, HTMLStencilElement {
+    }
+    var HTMLPostClosebuttonElement: {
+        prototype: HTMLPostClosebuttonElement;
+        new (): HTMLPostClosebuttonElement;
+    };
     interface HTMLPostCollapsibleElementEventMap {
         "postToggle": boolean;
     }
@@ -470,6 +645,29 @@ declare global {
         prototype: HTMLPostCollapsibleTriggerElement;
         new (): HTMLPostCollapsibleTriggerElement;
     };
+    interface HTMLPostFooterElement extends Components.PostFooter, HTMLStencilElement {
+    }
+    var HTMLPostFooterElement: {
+        prototype: HTMLPostFooterElement;
+        new (): HTMLPostFooterElement;
+    };
+    interface HTMLPostHeaderElementEventMap {
+        "postUpdateDevice": DEVICE_SIZE;
+    }
+    interface HTMLPostHeaderElement extends Components.PostHeader, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPostHeaderElementEventMap>(type: K, listener: (this: HTMLPostHeaderElement, ev: PostHeaderCustomEvent<HTMLPostHeaderElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLPostHeaderElementEventMap>(type: K, listener: (this: HTMLPostHeaderElement, ev: PostHeaderCustomEvent<HTMLPostHeaderElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLPostHeaderElement: {
+        prototype: HTMLPostHeaderElement;
+        new (): HTMLPostHeaderElement;
+    };
     /**
      * @class PostIcon - representing a stencil component
      */
@@ -481,6 +679,7 @@ declare global {
     };
     interface HTMLPostLanguageOptionElementEventMap {
         "postChange": string;
+        "postLanguageOptionInitiallyActive": string;
     }
     interface HTMLPostLanguageOptionElement extends Components.PostLanguageOption, HTMLStencilElement {
         addEventListener<K extends keyof HTMLPostLanguageOptionElementEventMap>(type: K, listener: (this: HTMLPostLanguageOptionElement, ev: PostLanguageOptionCustomEvent<HTMLPostLanguageOptionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -496,12 +695,94 @@ declare global {
         prototype: HTMLPostLanguageOptionElement;
         new (): HTMLPostLanguageOptionElement;
     };
+    interface HTMLPostLanguageSwitchElement extends Components.PostLanguageSwitch, HTMLStencilElement {
+    }
+    var HTMLPostLanguageSwitchElement: {
+        prototype: HTMLPostLanguageSwitchElement;
+        new (): HTMLPostLanguageSwitchElement;
+    };
+    interface HTMLPostLinkareaElement extends Components.PostLinkarea, HTMLStencilElement {
+    }
+    var HTMLPostLinkareaElement: {
+        prototype: HTMLPostLinkareaElement;
+        new (): HTMLPostLinkareaElement;
+    };
+    interface HTMLPostListElement extends Components.PostList, HTMLStencilElement {
+    }
+    var HTMLPostListElement: {
+        prototype: HTMLPostListElement;
+        new (): HTMLPostListElement;
+    };
+    interface HTMLPostListItemElement extends Components.PostListItem, HTMLStencilElement {
+    }
+    var HTMLPostListItemElement: {
+        prototype: HTMLPostListItemElement;
+        new (): HTMLPostListItemElement;
+    };
     interface HTMLPostLogoElement extends Components.PostLogo, HTMLStencilElement {
     }
     var HTMLPostLogoElement: {
         prototype: HTMLPostLogoElement;
         new (): HTMLPostLogoElement;
     };
+    interface HTMLPostMainnavigationElement extends Components.PostMainnavigation, HTMLStencilElement {
+    }
+    var HTMLPostMainnavigationElement: {
+        prototype: HTMLPostMainnavigationElement;
+        new (): HTMLPostMainnavigationElement;
+    };
+    interface HTMLPostMegadropdownElementEventMap {
+        "postToggleMegadropdown": { isVisible: boolean; focusParent?: boolean };
+    }
+    interface HTMLPostMegadropdownElement extends Components.PostMegadropdown, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPostMegadropdownElementEventMap>(type: K, listener: (this: HTMLPostMegadropdownElement, ev: PostMegadropdownCustomEvent<HTMLPostMegadropdownElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLPostMegadropdownElementEventMap>(type: K, listener: (this: HTMLPostMegadropdownElement, ev: PostMegadropdownCustomEvent<HTMLPostMegadropdownElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLPostMegadropdownElement: {
+        prototype: HTMLPostMegadropdownElement;
+        new (): HTMLPostMegadropdownElement;
+    };
+    interface HTMLPostMegadropdownTriggerElement extends Components.PostMegadropdownTrigger, HTMLStencilElement {
+    }
+    var HTMLPostMegadropdownTriggerElement: {
+        prototype: HTMLPostMegadropdownTriggerElement;
+        new (): HTMLPostMegadropdownTriggerElement;
+    };
+    interface HTMLPostMenuElementEventMap {
+        "toggleMenu": boolean;
+    }
+    interface HTMLPostMenuElement extends Components.PostMenu, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPostMenuElementEventMap>(type: K, listener: (this: HTMLPostMenuElement, ev: PostMenuCustomEvent<HTMLPostMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLPostMenuElementEventMap>(type: K, listener: (this: HTMLPostMenuElement, ev: PostMenuCustomEvent<HTMLPostMenuElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLPostMenuElement: {
+        prototype: HTMLPostMenuElement;
+        new (): HTMLPostMenuElement;
+    };
+    interface HTMLPostMenuItemElement extends Components.PostMenuItem, HTMLStencilElement {
+    }
+    var HTMLPostMenuItemElement: {
+        prototype: HTMLPostMenuItemElement;
+        new (): HTMLPostMenuItemElement;
+    };
+    interface HTMLPostMenuTriggerElement extends Components.PostMenuTrigger, HTMLStencilElement {
+    }
+    var HTMLPostMenuTriggerElement: {
+        prototype: HTMLPostMenuTriggerElement;
+        new (): HTMLPostMenuTriggerElement;
+    };
     interface HTMLPostPopoverElement extends Components.PostPopover, HTMLStencilElement {
     }
     var HTMLPostPopoverElement: {
@@ -556,7 +837,7 @@ declare global {
         new (): HTMLPostTabPanelElement;
     };
     interface HTMLPostTabsElementEventMap {
-        "postChange": HTMLPostTabPanelElement['name'];
+        "postChange": string;
     }
     interface HTMLPostTabsElement extends Components.PostTabs, HTMLStencilElement {
         addEventListener<K extends keyof HTMLPostTabsElementEventMap>(type: K, listener: (this: HTMLPostTabsElement, ev: PostTabsCustomEvent<HTMLPostTabsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -578,6 +859,12 @@ declare global {
         prototype: HTMLPostTagElement;
         new (): HTMLPostTagElement;
     };
+    interface HTMLPostTogglebuttonElement extends Components.PostTogglebutton, HTMLStencilElement {
+    }
+    var HTMLPostTogglebuttonElement: {
+        prototype: HTMLPostTogglebuttonElement;
+        new (): HTMLPostTogglebuttonElement;
+    };
     interface HTMLPostTooltipElement extends Components.PostTooltip, HTMLStencilElement {
     }
     var HTMLPostTooltipElement: {
@@ -587,14 +874,30 @@ declare global {
     interface HTMLElementTagNameMap {
         "post-accordion": HTMLPostAccordionElement;
         "post-accordion-item": HTMLPostAccordionItemElement;
-        "post-alert": HTMLPostAlertElement;
         "post-avatar": HTMLPostAvatarElement;
+        "post-back-to-top": HTMLPostBackToTopElement;
+        "post-banner": HTMLPostBannerElement;
+        "post-breadcrumb": HTMLPostBreadcrumbElement;
+        "post-breadcrumb-item": HTMLPostBreadcrumbItemElement;
         "post-card-control": HTMLPostCardControlElement;
+        "post-closebutton": HTMLPostClosebuttonElement;
         "post-collapsible": HTMLPostCollapsibleElement;
         "post-collapsible-trigger": HTMLPostCollapsibleTriggerElement;
+        "post-footer": HTMLPostFooterElement;
+        "post-header": HTMLPostHeaderElement;
         "post-icon": HTMLPostIconElement;
         "post-language-option": HTMLPostLanguageOptionElement;
+        "post-language-switch": HTMLPostLanguageSwitchElement;
+        "post-linkarea": HTMLPostLinkareaElement;
+        "post-list": HTMLPostListElement;
+        "post-list-item": HTMLPostListItemElement;
         "post-logo": HTMLPostLogoElement;
+        "post-mainnavigation": HTMLPostMainnavigationElement;
+        "post-megadropdown": HTMLPostMegadropdownElement;
+        "post-megadropdown-trigger": HTMLPostMegadropdownTriggerElement;
+        "post-menu": HTMLPostMenuElement;
+        "post-menu-item": HTMLPostMenuItemElement;
+        "post-menu-trigger": HTMLPostMenuTriggerElement;
         "post-popover": HTMLPostPopoverElement;
         "post-popovercontainer": HTMLPostPopovercontainerElement;
         "post-rating": HTMLPostRatingElement;
@@ -602,6 +905,7 @@ declare global {
         "post-tab-panel": HTMLPostTabPanelElement;
         "post-tabs": HTMLPostTabsElement;
         "post-tag": HTMLPostTagElement;
+        "post-togglebutton": HTMLPostTogglebuttonElement;
         "post-tooltip": HTMLPostTooltipElement;
     }
 }
@@ -627,49 +931,67 @@ declare namespace LocalJSX {
          */
         "headingLevel"?: HeadingLevel;
     }
-    interface PostAlert {
+    interface PostAvatar {
         /**
-          * The label to use for the close button of a dismissible alert.
+          * Defines the users email address associated with a gravatar profile picture.
          */
-        "dismissLabel"?: string;
+        "email"?: string;
         /**
-          * If `true`, a close button (×) is displayed and the alert can be dismissed by the user.
+          * Defines the users firstname.
          */
-        "dismissible"?: boolean;
+        "firstname": string;
         /**
-          * If `true`, the alert is positioned at the bottom of the window, from edge to edge.
+          * Defines the users lastname.
          */
-        "fixed"?: boolean;
+        "lastname"?: string;
         /**
-          * The icon to display in the alert. By default, the icon depends on the alert type.  If `none`, no icon is displayed.
+          * Defines the company internal userId.<div className="mb-1 banner banner-warning banner-sm">Can only be used on post.ch domains!</div>
          */
-        "icon"?: string;
+        "userid"?: string;
+    }
+    interface PostBackToTop {
         /**
-          * An event emitted when the alert element is dismissed, after the transition. It has no payload and only relevant for dismissible alerts.
+          * The label of the back-to-top button, intended solely for accessibility purposes. This label is always hidden from view.
          */
-        "onPostDismissed"?: (event: PostAlertCustomEvent<void>) => void;
+        "label": string;
+    }
+    interface PostBanner {
         /**
-          * The type of the alert.
+          * The label to use for the close button of a dismissible banner.
          */
-        "type"?: AlertType;
-    }
-    interface PostAvatar {
+        "dismissLabel"?: string;
         /**
-          * Defines the users email address associated with a gravatar profile picture.
+          * If `true`, a close button (×) is displayed and the banner can be dismissed by the user.
          */
-        "email"?: string;
+        "dismissible"?: boolean;
         /**
-          * Defines the users firstname.
+          * The icon to display in the banner. By default, the icon depends on the banner type.  If `none`, no icon is displayed.
          */
-        "firstname": string;
+        "icon"?: string;
         /**
-          * Defines the users lastname.
+          * An event emitted when the banner element is dismissed, after the transition. It has no payload and only relevant for dismissible banners.
          */
-        "lastname"?: string;
+        "onPostDismissed"?: (event: PostBannerCustomEvent<void>) => void;
         /**
-          * Defines the company internal userId.<div className="mb-1 alert alert-warning alert-sm">Can only be used on post.ch domains!</div>
+          * The type of the banner.
          */
-        "userid"?: string;
+        "type"?: BannerType;
+    }
+    interface PostBreadcrumb {
+        /**
+          * The text label for the home breadcrumb item.
+         */
+        "homeText"?: string;
+        /**
+          * The URL for the home breadcrumb item.
+         */
+        "homeUrl"?: string;
+    }
+    interface PostBreadcrumbItem {
+        /**
+          * The optional URL to which the breadcrumb item will link.
+         */
+        "url"?: string | URL;
     }
     /**
      * @class PostCardControl - representing a stencil component
@@ -688,7 +1010,7 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Defines the icon `name` inside the card. <span className="alert alert-sm alert-info">If not set the icon will not show up.</span>
+          * Defines the icon `name` inside the card. <span className="banner banner-sm banner-info">If not set the icon will not show up.</span>
          */
         "icon"?: string;
         /**
@@ -696,11 +1018,11 @@ declare namespace LocalJSX {
          */
         "label": string;
         /**
-          * Defines the `name` attribute of the control. <span className="alert alert-sm alert-info">This is a required property, when the control should participate in a native `form`. If not specified, a native `form` will never contain this controls value.</span> <span className="alert alert-sm alert-info">This is a required property, when the control is used with type `radio`.</span>
+          * Defines the `name` attribute of the control. <span className="banner banner-sm banner-info">This is a required property, when the control should participate in a native `form`. If not specified, a native `form` will never contain this controls value.</span> <span className="banner banner-sm banner-info">This is a required property, when the control is used with type `radio`.</span>
          */
         "name"?: string;
         /**
-          * An event emitted whenever the components checked state is toggled. The event payload (emitted under `event.detail.state`) is a boolean: `true` if the component is checked, `false` if it is unchecked. <span className="alert alert-sm alert-info">If the component is used with type `radio`, it will only emit this event, when the checked state is changing to `true`.</span>
+          * An event emitted whenever the components checked state is toggled. The event payload (emitted under `event.detail.state`) is a boolean: `true` if the component is checked, `false` if it is unchecked. <span className="banner banner-sm banner-info">If the component is used with type `radio`, it will only emit this event, when the checked state is changing to `true`.</span>
          */
         "onPostChange"?: (event: PostCardControlCustomEvent<{ state: boolean; value: string }>) => void;
         /**
@@ -716,10 +1038,12 @@ declare namespace LocalJSX {
          */
         "validity"?: null | 'true' | 'false';
         /**
-          * Defines the `value` attribute of the control. <span className="alert alert-sm alert-info">This is a required property, when the control is used with type `radio`.</span>
+          * Defines the `value` attribute of the control. <span className="banner banner-sm banner-info">This is a required property, when the control is used with type `radio`.</span>
          */
         "value"?: string;
     }
+    interface PostClosebutton {
+    }
     interface PostCollapsible {
         /**
           * If `true`, the element is collapsed otherwise it is displayed.
@@ -736,6 +1060,18 @@ declare namespace LocalJSX {
          */
         "for"?: string;
     }
+    interface PostFooter {
+        /**
+          * The label to add to the footer (visually hidden).
+         */
+        "label": string;
+    }
+    interface PostHeader {
+        /**
+          * An event emitted when the device has changed
+         */
+        "onPostUpdateDevice"?: (event: PostHeaderCustomEvent<DEVICE_SIZE>) => void;
+    }
     /**
      * @class PostIcon - representing a stencil component
      */
@@ -786,10 +1122,46 @@ declare namespace LocalJSX {
           * An event emitted when the language option is clicked. The payload is the ISO 639 code of the language.
          */
         "onPostChange"?: (event: PostLanguageOptionCustomEvent<string>) => void;
+        /**
+          * An event emitted when the language option is initially active. The payload is the ISO 639 code of the language.
+         */
+        "onPostLanguageOptionInitiallyActive"?: (event: PostLanguageOptionCustomEvent<string>) => void;
         /**
           * The URL used for the href attribute of the internal anchor. This field is optional; if not provided, a button will be used internally instead of an anchor.
          */
         "url"?: string;
+        /**
+          * To communicate the variant prop from the parent (post-language-switch) component to the child (post-language-option) component. See parent docs for a description about the property itself.
+         */
+        "variant"?: SwitchVariant | null;
+    }
+    interface PostLanguageSwitch {
+        /**
+          * A title for the list of language options
+         */
+        "caption"?: string;
+        /**
+          * A descriptive text for the list of language options
+         */
+        "description"?: string;
+        /**
+          * Whether the component is rendered as a list or a menu
+         */
+        "variant"?: SwitchVariant;
+    }
+    interface PostLinkarea {
+    }
+    interface PostList {
+        /**
+          * The list can become horizontal by setting `horizontal="true"` or just `horizontal`
+         */
+        "horizontal"?: boolean;
+        /**
+          * If `true`, the list title will be hidden. Otherwise, it will be displayed.`
+         */
+        "titleHidden"?: boolean;
+    }
+    interface PostListItem {
     }
     interface PostLogo {
         /**
@@ -797,6 +1169,38 @@ declare namespace LocalJSX {
          */
         "url"?: string | URL;
     }
+    interface PostMainnavigation {
+    }
+    interface PostMegadropdown {
+        /**
+          * Emits when the dropdown is shown or hidden. The event payload is an object. `isVisible` is true when the dropdown gets opened and false when it gets closed `focusParent` determines whether after the closing of the mega dropdown, the focus should go back to the trigger parent or naturally go to the next focusable element in the page
+         */
+        "onPostToggleMegadropdown"?: (event: PostMegadropdownCustomEvent<{ isVisible: boolean; focusParent?: boolean }>) => void;
+    }
+    interface PostMegadropdownTrigger {
+        /**
+          * ID of the mega dropdown element that this trigger is linked to. Used to open and close the specified mega dropdown.
+         */
+        "for": string;
+    }
+    interface PostMenu {
+        /**
+          * 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.
+         */
+        "onToggleMenu"?: (event: PostMenuCustomEvent<boolean>) => void;
+        /**
+          * 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"?: Placement;
+    }
+    interface PostMenuItem {
+    }
+    interface PostMenuTrigger {
+        /**
+          * ID of the menu element that this trigger is linked to. Used to open and close the specified menu.
+         */
+        "for": string;
+    }
     interface PostPopover {
         /**
           * Show a little indicator arrow
@@ -813,9 +1217,17 @@ declare namespace LocalJSX {
     }
     interface PostPopovercontainer {
         /**
-          * Wheter or not to display a little pointer arrow
+          * Whether or not to display a little pointer arrow
          */
         "arrow"?: boolean;
+        /**
+          * Gap between the edge of the page and the popover
+         */
+        "edgeGap"?: number;
+        /**
+          * Whether or not the popover should close when user clicks outside of it
+         */
+        "manualClose"?: boolean;
         /**
           * Fires whenever the popover gets shown or hidden, passing the new state in event.details as a boolean
          */
@@ -824,6 +1236,10 @@ declare namespace LocalJSX {
           * 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"?: Placement;
+        /**
+          * Enables a safespace through which the cursor can be moved without the popover being disabled
+         */
+        "safeSpace"?: 'triangle' | 'trapezoid';
     }
     interface PostRating {
         /**
@@ -871,11 +1287,11 @@ declare namespace LocalJSX {
         /**
           * An event emitted after the active tab changes, when the fade in transition of its associated panel is finished. The payload is the name of the newly shown panel.
          */
-        "onPostChange"?: (event: PostTabsCustomEvent<HTMLPostTabPanelElement['name']>) => void;
+        "onPostChange"?: (event: PostTabsCustomEvent<string>) => void;
     }
     interface PostTag {
         /**
-          * Defines the icon `name` inside of the component. <span className="alert alert-sm alert-info">If not set the icon will not show up.</span> To learn which icons are available, please visit our <a href="/?path=/docs/5704bdc4-c5b5-45e6-b123-c54d01fce2f1--docs">icon library</a>.
+          * Defines the icon `name` inside of the component. <span className="banner banner-sm banner-info">If not set the icon will not show up.</span> To learn which icons are available, please visit our <a href="/?path=/docs/5704bdc4-c5b5-45e6-b123-c54d01fce2f1--docs">icon library</a>.
          */
         "icon"?: null | string;
         /**
@@ -887,6 +1303,12 @@ declare namespace LocalJSX {
          */
         "variant"?: 'white' | 'info' | 'success' | 'error' | 'warning' | 'yellow';
     }
+    interface PostTogglebutton {
+        /**
+          * If `true`, the button is in the "on" state, otherwise it is in the "off" state.
+         */
+        "toggled"?: boolean;
+    }
     interface PostTooltip {
         /**
           * Wheter or not to display a little pointer arrow
@@ -904,14 +1326,30 @@ declare namespace LocalJSX {
     interface IntrinsicElements {
         "post-accordion": PostAccordion;
         "post-accordion-item": PostAccordionItem;
-        "post-alert": PostAlert;
         "post-avatar": PostAvatar;
+        "post-back-to-top": PostBackToTop;
+        "post-banner": PostBanner;
+        "post-breadcrumb": PostBreadcrumb;
+        "post-breadcrumb-item": PostBreadcrumbItem;
         "post-card-control": PostCardControl;
+        "post-closebutton": PostClosebutton;
         "post-collapsible": PostCollapsible;
         "post-collapsible-trigger": PostCollapsibleTrigger;
+        "post-footer": PostFooter;
+        "post-header": PostHeader;
         "post-icon": PostIcon;
         "post-language-option": PostLanguageOption;
+        "post-language-switch": PostLanguageSwitch;
+        "post-linkarea": PostLinkarea;
+        "post-list": PostList;
+        "post-list-item": PostListItem;
         "post-logo": PostLogo;
+        "post-mainnavigation": PostMainnavigation;
+        "post-megadropdown": PostMegadropdown;
+        "post-megadropdown-trigger": PostMegadropdownTrigger;
+        "post-menu": PostMenu;
+        "post-menu-item": PostMenuItem;
+        "post-menu-trigger": PostMenuTrigger;
         "post-popover": PostPopover;
         "post-popovercontainer": PostPopovercontainer;
         "post-rating": PostRating;
@@ -919,6 +1357,7 @@ declare namespace LocalJSX {
         "post-tab-panel": PostTabPanel;
         "post-tabs": PostTabs;
         "post-tag": PostTag;
+        "post-togglebutton": PostTogglebutton;
         "post-tooltip": PostTooltip;
     }
 }
@@ -928,20 +1367,36 @@ declare module "@stencil/core" {
         interface IntrinsicElements {
             "post-accordion": LocalJSX.PostAccordion & JSXBase.HTMLAttributes<HTMLPostAccordionElement>;
             "post-accordion-item": LocalJSX.PostAccordionItem & JSXBase.HTMLAttributes<HTMLPostAccordionItemElement>;
-            "post-alert": LocalJSX.PostAlert & JSXBase.HTMLAttributes<HTMLPostAlertElement>;
             "post-avatar": LocalJSX.PostAvatar & JSXBase.HTMLAttributes<HTMLPostAvatarElement>;
+            "post-back-to-top": LocalJSX.PostBackToTop & JSXBase.HTMLAttributes<HTMLPostBackToTopElement>;
+            "post-banner": LocalJSX.PostBanner & JSXBase.HTMLAttributes<HTMLPostBannerElement>;
+            "post-breadcrumb": LocalJSX.PostBreadcrumb & JSXBase.HTMLAttributes<HTMLPostBreadcrumbElement>;
+            "post-breadcrumb-item": LocalJSX.PostBreadcrumbItem & JSXBase.HTMLAttributes<HTMLPostBreadcrumbItemElement>;
             /**
              * @class PostCardControl - representing a stencil component
              */
             "post-card-control": LocalJSX.PostCardControl & JSXBase.HTMLAttributes<HTMLPostCardControlElement>;
+            "post-closebutton": LocalJSX.PostClosebutton & JSXBase.HTMLAttributes<HTMLPostClosebuttonElement>;
             "post-collapsible": LocalJSX.PostCollapsible & JSXBase.HTMLAttributes<HTMLPostCollapsibleElement>;
             "post-collapsible-trigger": LocalJSX.PostCollapsibleTrigger & JSXBase.HTMLAttributes<HTMLPostCollapsibleTriggerElement>;
+            "post-footer": LocalJSX.PostFooter & JSXBase.HTMLAttributes<HTMLPostFooterElement>;
+            "post-header": LocalJSX.PostHeader & JSXBase.HTMLAttributes<HTMLPostHeaderElement>;
             /**
              * @class PostIcon - representing a stencil component
              */
             "post-icon": LocalJSX.PostIcon & JSXBase.HTMLAttributes<HTMLPostIconElement>;
             "post-language-option": LocalJSX.PostLanguageOption & JSXBase.HTMLAttributes<HTMLPostLanguageOptionElement>;
+            "post-language-switch": LocalJSX.PostLanguageSwitch & JSXBase.HTMLAttributes<HTMLPostLanguageSwitchElement>;
+            "post-linkarea": LocalJSX.PostLinkarea & JSXBase.HTMLAttributes<HTMLPostLinkareaElement>;
+            "post-list": LocalJSX.PostList & JSXBase.HTMLAttributes<HTMLPostListElement>;
+            "post-list-item": LocalJSX.PostListItem & JSXBase.HTMLAttributes<HTMLPostListItemElement>;
             "post-logo": LocalJSX.PostLogo & JSXBase.HTMLAttributes<HTMLPostLogoElement>;
+            "post-mainnavigation": LocalJSX.PostMainnavigation & JSXBase.HTMLAttributes<HTMLPostMainnavigationElement>;
+            "post-megadropdown": LocalJSX.PostMegadropdown & JSXBase.HTMLAttributes<HTMLPostMegadropdownElement>;
+            "post-megadropdown-trigger": LocalJSX.PostMegadropdownTrigger & JSXBase.HTMLAttributes<HTMLPostMegadropdownTriggerElement>;
+            "post-menu": LocalJSX.PostMenu & JSXBase.HTMLAttributes<HTMLPostMenuElement>;
+            "post-menu-item": LocalJSX.PostMenuItem & JSXBase.HTMLAttributes<HTMLPostMenuItemElement>;
+            "post-menu-trigger": LocalJSX.PostMenuTrigger & JSXBase.HTMLAttributes<HTMLPostMenuTriggerElement>;
             "post-popover": LocalJSX.PostPopover & JSXBase.HTMLAttributes<HTMLPostPopoverElement>;
             "post-popovercontainer": LocalJSX.PostPopovercontainer & JSXBase.HTMLAttributes<HTMLPostPopovercontainerElement>;
             "post-rating": LocalJSX.PostRating & JSXBase.HTMLAttributes<HTMLPostRatingElement>;
@@ -949,6 +1404,7 @@ declare module "@stencil/core" {
             "post-tab-panel": LocalJSX.PostTabPanel & JSXBase.HTMLAttributes<HTMLPostTabPanelElement>;
             "post-tabs": LocalJSX.PostTabs & JSXBase.HTMLAttributes<HTMLPostTabsElement>;
             "post-tag": LocalJSX.PostTag & JSXBase.HTMLAttributes<HTMLPostTagElement>;
+            "post-togglebutton": LocalJSX.PostTogglebutton & JSXBase.HTMLAttributes<HTMLPostTogglebuttonElement>;
             "post-tooltip": LocalJSX.PostTooltip & JSXBase.HTMLAttributes<HTMLPostTooltipElement>;
         }
     }