@swisspost/design-system-components 10.0.0-next.66 → 10.0.0-next.67

package/dist/types/components.d.ts

@@ -59,6 +59,22 @@ export namespace Components {
          */
         "toggle": (force?: boolean) => Promise<boolean>;
     }
+    interface PostAutocomplete {
+        /**
+          * Show or hide the clear button
+          * @default false
+         */
+        "clearable": boolean;
+        /**
+          * Number of characters to type before filtering methods are called
+          * @default 0
+         */
+        "filterThreshold": number;
+        /**
+          * Optional idref to connect the autocomplete with the options dropdown if not nested
+         */
+        "listbox"?: string;
+    }
     interface PostAvatar {
         /**
           * Provides a custom description for the avatar, used for accessibility purposes.
@@ -232,8 +248,6 @@ export namespace Components {
          */
         "textToggleCalendar"?: string;
     }
-    interface PostEnvTest {
-    }
     interface PostFooter {
         /**
           * The textFooter to add to the footer (visually hidden).
@@ -337,6 +351,48 @@ export namespace Components {
     }
     interface PostLinkarea {
     }
+    interface PostListbox {
+        /**
+          * Clears the currently selected option
+         */
+        "clearSelection": () => Promise<void>;
+        /**
+          * Uses the internal default filtering mode to filter the list of options. An empty string resets the filter to it's original state.
+         */
+        "filter": (query: string) => Promise<void>;
+        /**
+          * Closes the listbox
+         */
+        "hide": () => Promise<void>;
+        /**
+          * Navigates the listbox options in the specified direction and scrolls the active option into view.
+         */
+        "navigate": (direction: "up" | "down" | "first" | "last") => Promise<void>;
+        /**
+          * Selects the currently highlighted option in the listbox and scrolls it into view.
+         */
+        "selectActive": () => Promise<void>;
+        /**
+          * Opens the listbox
+         */
+        "show": () => Promise<void>;
+    }
+    interface PostListboxOption {
+        /**
+          * Represents option is highlighted .
+          * @default false
+         */
+        "highlighted": boolean;
+        /**
+          * Represents option is selected .
+          * @default false
+         */
+        "selected": boolean;
+        /**
+          * A value string, similar to <option value="Value 1">Value 1 description</option>
+         */
+        "value": string;
+    }
     interface PostLogo {
         /**
           * The URL to which the user is redirected upon clicking the logo.
@@ -663,6 +719,10 @@ export namespace Components {
         "for": string;
     }
 }
+export interface PostAutocompleteCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPostAutocompleteElement;
+}
 export interface PostBannerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostBannerElement;
@@ -679,6 +739,14 @@ export interface PostLanguageMenuItemCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostLanguageMenuItemElement;
 }
+export interface PostListboxCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPostListboxElement;
+}
+export interface PostListboxOptionCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPostListboxOptionElement;
+}
 export interface PostMegadropdownCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostMegadropdownElement;
@@ -716,6 +784,23 @@ declare global {
         prototype: HTMLPostAccordionItemElement;
         new (): HTMLPostAccordionItemElement;
     };
+    interface HTMLPostAutocompleteElementEventMap {
+        "postFilteringEvent": string;
+    }
+    interface HTMLPostAutocompleteElement extends Components.PostAutocomplete, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPostAutocompleteElementEventMap>(type: K, listener: (this: HTMLPostAutocompleteElement, ev: PostAutocompleteCustomEvent<HTMLPostAutocompleteElementEventMap[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 HTMLPostAutocompleteElementEventMap>(type: K, listener: (this: HTMLPostAutocompleteElement, ev: PostAutocompleteCustomEvent<HTMLPostAutocompleteElementEventMap[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 HTMLPostAutocompleteElement: {
+        prototype: HTMLPostAutocompleteElement;
+        new (): HTMLPostAutocompleteElement;
+    };
     interface HTMLPostAvatarElement extends Components.PostAvatar, HTMLStencilElement {
     }
     var HTMLPostAvatarElement: {
@@ -803,12 +888,6 @@ declare global {
         prototype: HTMLPostDatePickerElement;
         new (): HTMLPostDatePickerElement;
     };
-    interface HTMLPostEnvTestElement extends Components.PostEnvTest, HTMLStencilElement {
-    }
-    var HTMLPostEnvTestElement: {
-        prototype: HTMLPostEnvTestElement;
-        new (): HTMLPostEnvTestElement;
-    };
     interface HTMLPostFooterElement extends Components.PostFooter, HTMLStencilElement {
     }
     var HTMLPostFooterElement: {
@@ -860,6 +939,40 @@ declare global {
         prototype: HTMLPostLinkareaElement;
         new (): HTMLPostLinkareaElement;
     };
+    interface HTMLPostListboxElementEventMap {
+        "postOptionActive": string | null;
+    }
+    interface HTMLPostListboxElement extends Components.PostListbox, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPostListboxElementEventMap>(type: K, listener: (this: HTMLPostListboxElement, ev: PostListboxCustomEvent<HTMLPostListboxElementEventMap[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 HTMLPostListboxElementEventMap>(type: K, listener: (this: HTMLPostListboxElement, ev: PostListboxCustomEvent<HTMLPostListboxElementEventMap[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 HTMLPostListboxElement: {
+        prototype: HTMLPostListboxElement;
+        new (): HTMLPostListboxElement;
+    };
+    interface HTMLPostListboxOptionElementEventMap {
+        "postOptionSelected": string;
+    }
+    interface HTMLPostListboxOptionElement extends Components.PostListboxOption, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPostListboxOptionElementEventMap>(type: K, listener: (this: HTMLPostListboxOptionElement, ev: PostListboxOptionCustomEvent<HTMLPostListboxOptionElementEventMap[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 HTMLPostListboxOptionElementEventMap>(type: K, listener: (this: HTMLPostListboxOptionElement, ev: PostListboxOptionCustomEvent<HTMLPostListboxOptionElementEventMap[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 HTMLPostListboxOptionElement: {
+        prototype: HTMLPostListboxOptionElement;
+        new (): HTMLPostListboxOptionElement;
+    };
     interface HTMLPostLogoElement extends Components.PostLogo, HTMLStencilElement {
     }
     var HTMLPostLogoElement: {
@@ -1060,6 +1173,7 @@ declare global {
     interface HTMLElementTagNameMap {
         "post-accordion": HTMLPostAccordionElement;
         "post-accordion-item": HTMLPostAccordionItemElement;
+        "post-autocomplete": HTMLPostAutocompleteElement;
         "post-avatar": HTMLPostAvatarElement;
         "post-back-to-top": HTMLPostBackToTopElement;
         "post-banner": HTMLPostBannerElement;
@@ -1069,13 +1183,14 @@ declare global {
         "post-collapsible": HTMLPostCollapsibleElement;
         "post-collapsible-trigger": HTMLPostCollapsibleTriggerElement;
         "post-date-picker": HTMLPostDatePickerElement;
-        "post-env-test": HTMLPostEnvTestElement;
         "post-footer": HTMLPostFooterElement;
         "post-header": HTMLPostHeaderElement;
         "post-icon": HTMLPostIconElement;
         "post-language-menu": HTMLPostLanguageMenuElement;
         "post-language-menu-item": HTMLPostLanguageMenuItemElement;
         "post-linkarea": HTMLPostLinkareaElement;
+        "post-listbox": HTMLPostListboxElement;
+        "post-listbox-option": HTMLPostListboxOptionElement;
         "post-logo": HTMLPostLogoElement;
         "post-mainnavigation": HTMLPostMainnavigationElement;
         "post-megadropdown": HTMLPostMegadropdownElement;
@@ -1123,6 +1238,26 @@ declare namespace LocalJSX {
          */
         "headingLevel"?: HeadingLevel;
     }
+    interface PostAutocomplete {
+        /**
+          * Show or hide the clear button
+          * @default false
+         */
+        "clearable"?: boolean;
+        /**
+          * Number of characters to type before filtering methods are called
+          * @default 0
+         */
+        "filterThreshold"?: number;
+        /**
+          * Optional idref to connect the autocomplete with the options dropdown if not nested
+         */
+        "listbox"?: string;
+        /**
+          * Cancelable event emitted when the input value is to be filtered
+         */
+        "onPostFilteringEvent"?: (event: PostAutocompleteCustomEvent<string>) => void;
+    }
     interface PostAvatar {
         /**
           * Provides a custom description for the avatar, used for accessibility purposes.
@@ -1288,8 +1423,6 @@ declare namespace LocalJSX {
          */
         "textToggleCalendar"?: string;
     }
-    interface PostEnvTest {
-    }
     interface PostFooter {
         /**
           * The textFooter to add to the footer (visually hidden).
@@ -1393,6 +1526,32 @@ declare namespace LocalJSX {
     }
     interface PostLinkarea {
     }
+    interface PostListbox {
+        /**
+          * Emitted option id for the active option
+         */
+        "onPostOptionActive"?: (event: PostListboxCustomEvent<string | null>) => void;
+    }
+    interface PostListboxOption {
+        /**
+          * Represents option is highlighted .
+          * @default false
+         */
+        "highlighted"?: boolean;
+        /**
+          * Fires when this option was selected. Bubbles up.
+         */
+        "onPostOptionSelected"?: (event: PostListboxOptionCustomEvent<string>) => void;
+        /**
+          * Represents option is selected .
+          * @default false
+         */
+        "selected"?: boolean;
+        /**
+          * A value string, similar to <option value="Value 1">Value 1 description</option>
+         */
+        "value": string;
+    }
     interface PostLogo {
         /**
           * The URL to which the user is redirected upon clicking the logo.
@@ -1687,6 +1846,7 @@ declare namespace LocalJSX {
     interface IntrinsicElements {
         "post-accordion": PostAccordion;
         "post-accordion-item": PostAccordionItem;
+        "post-autocomplete": PostAutocomplete;
         "post-avatar": PostAvatar;
         "post-back-to-top": PostBackToTop;
         "post-banner": PostBanner;
@@ -1696,13 +1856,14 @@ declare namespace LocalJSX {
         "post-collapsible": PostCollapsible;
         "post-collapsible-trigger": PostCollapsibleTrigger;
         "post-date-picker": PostDatePicker;
-        "post-env-test": PostEnvTest;
         "post-footer": PostFooter;
         "post-header": PostHeader;
         "post-icon": PostIcon;
         "post-language-menu": PostLanguageMenu;
         "post-language-menu-item": PostLanguageMenuItem;
         "post-linkarea": PostLinkarea;
+        "post-listbox": PostListbox;
+        "post-listbox-option": PostListboxOption;
         "post-logo": PostLogo;
         "post-mainnavigation": PostMainnavigation;
         "post-megadropdown": PostMegadropdown;
@@ -1732,6 +1893,7 @@ declare module "@stencil/core" {
         interface IntrinsicElements {
             "post-accordion": LocalJSX.PostAccordion & JSXBase.HTMLAttributes<HTMLPostAccordionElement>;
             "post-accordion-item": LocalJSX.PostAccordionItem & JSXBase.HTMLAttributes<HTMLPostAccordionItemElement>;
+            "post-autocomplete": LocalJSX.PostAutocomplete & JSXBase.HTMLAttributes<HTMLPostAutocompleteElement>;
             "post-avatar": LocalJSX.PostAvatar & JSXBase.HTMLAttributes<HTMLPostAvatarElement>;
             "post-back-to-top": LocalJSX.PostBackToTop & JSXBase.HTMLAttributes<HTMLPostBackToTopElement>;
             "post-banner": LocalJSX.PostBanner & JSXBase.HTMLAttributes<HTMLPostBannerElement>;
@@ -1741,7 +1903,6 @@ declare module "@stencil/core" {
             "post-collapsible": LocalJSX.PostCollapsible & JSXBase.HTMLAttributes<HTMLPostCollapsibleElement>;
             "post-collapsible-trigger": LocalJSX.PostCollapsibleTrigger & JSXBase.HTMLAttributes<HTMLPostCollapsibleTriggerElement>;
             "post-date-picker": LocalJSX.PostDatePicker & JSXBase.HTMLAttributes<HTMLPostDatePickerElement>;
-            "post-env-test": LocalJSX.PostEnvTest & JSXBase.HTMLAttributes<HTMLPostEnvTestElement>;
             "post-footer": LocalJSX.PostFooter & JSXBase.HTMLAttributes<HTMLPostFooterElement>;
             "post-header": LocalJSX.PostHeader & JSXBase.HTMLAttributes<HTMLPostHeaderElement>;
             /**
@@ -1751,6 +1912,8 @@ declare module "@stencil/core" {
             "post-language-menu": LocalJSX.PostLanguageMenu & JSXBase.HTMLAttributes<HTMLPostLanguageMenuElement>;
             "post-language-menu-item": LocalJSX.PostLanguageMenuItem & JSXBase.HTMLAttributes<HTMLPostLanguageMenuItemElement>;
             "post-linkarea": LocalJSX.PostLinkarea & JSXBase.HTMLAttributes<HTMLPostLinkareaElement>;
+            "post-listbox": LocalJSX.PostListbox & JSXBase.HTMLAttributes<HTMLPostListboxElement>;
+            "post-listbox-option": LocalJSX.PostListboxOption & JSXBase.HTMLAttributes<HTMLPostListboxOptionElement>;
             "post-logo": LocalJSX.PostLogo & JSXBase.HTMLAttributes<HTMLPostLogoElement>;
             "post-mainnavigation": LocalJSX.PostMainnavigation & JSXBase.HTMLAttributes<HTMLPostMainnavigationElement>;
             "post-megadropdown": LocalJSX.PostMegadropdown & JSXBase.HTMLAttributes<HTMLPostMegadropdownElement>;

package/dist/types/utils/breakpoints.d.ts

@@ -10,6 +10,7 @@ type BreakpointProperty = keyof BreakpointDefinition;
 declare class Breakpoint {
     private readonly breakpoints;
     private currentBreakpoint;
+    private resizeObserver;
     constructor();
     private updateCurrentBreakpoint;
     private dispatchEvent;

package/dist/types/utils/index.d.ts

@@ -3,7 +3,6 @@ export * from './attribute-observer';
 export * from './breakpoints';
 export * from './component-on-ready';
 export * from './debounce';
-export * from './environment';
 export * from './event-from';
 export * from './get-focusable-children';
 export * from './get-root';

package/dist/types/utils/property-checkers/index.d.ts

@@ -1,4 +1,3 @@
-import { checkIsoDate } from "./check-iso-date";
 export declare const checkEmptyOrOneOf: <T extends {
     host: HTMLElement;
 }>(component: T, prop: keyof T, possibleValues: readonly unknown[]) => void;
@@ -32,4 +31,4 @@ export declare const checkRequiredAndUrl: <T extends {
 export declare const checkRequiredAndArrayOf: <T extends {
     host: HTMLElement;
 }>(component: T, prop: keyof T, type: import("../../types").PrimitiveType) => void;
-export { checkIsoDate };
+export { checkIsoDate } from './check-iso-date';

package/dist/types/utils/tests/helpers/mock-match-media.d.ts

@@ -0,0 +1,4 @@
+export type mockConfigMediaType = {
+    matches: boolean;
+};
+export declare const mockConfig: mockConfigMediaType;