@six-group/ui-library 0.0.0-insider.564a90a → 0.0.0-insider.593da1a

package/dist/types/components.d.ts

@@ -7,13 +7,13 @@
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { AlertType } from "./components/six-alert/six-alert";
 import { EmptyPayload } from "./utils/types";
+import { Language } from "./utils/error-messages";
 import { SixDateFormats } from "./components/six-datepicker/six-date-formats";
 import { SixDatepickerSelectPayload } from "./components/six-datepicker/six-datepicker";
 import { SixMenuItemData } from "./components/six-menu/six-menu";
 import { SixDropdownAsyncFilterPayload, SixDropdownAutoFilterPayload, SixDropdownScrollPayload } from "./components/six-dropdown/six-dropdown";
 import { SixFileListDownloadPayload, SixFileListRemovePayload } from "./components/six-file-list-item/six-file-list-item";
 import { SixFileUploadFailurePayload, SixFileUploadSuccessPayload } from "./components/six-file-upload/six-file-upload";
-import { SixHeaderAppSwitcherSelectPayload, SixHeaderProfileSelectPayload, SixHeaderSearchFieldToggle } from "./components/six-header/six-header";
 import { SelectionRange, SelectionRangeDirection } from "./components/six-input/six-input";
 import { ItemPickerPaddingDirection, ItemPickerType } from "./components/six-item-picker/types";
 import { SixItemPickerChangePayload } from "./components/six-item-picker/six-item-picker";
@@ -28,13 +28,13 @@ import { TimeFormat } from "./utils/time.util";
 import { SixTimepickerChange } from "./components/six-timepicker/six-timepicker";
 export { AlertType } from "./components/six-alert/six-alert";
 export { EmptyPayload } from "./utils/types";
+export { Language } from "./utils/error-messages";
 export { SixDateFormats } from "./components/six-datepicker/six-date-formats";
 export { SixDatepickerSelectPayload } from "./components/six-datepicker/six-datepicker";
 export { SixMenuItemData } from "./components/six-menu/six-menu";
 export { SixDropdownAsyncFilterPayload, SixDropdownAutoFilterPayload, SixDropdownScrollPayload } from "./components/six-dropdown/six-dropdown";
 export { SixFileListDownloadPayload, SixFileListRemovePayload } from "./components/six-file-list-item/six-file-list-item";
 export { SixFileUploadFailurePayload, SixFileUploadSuccessPayload } from "./components/six-file-upload/six-file-upload";
-export { SixHeaderAppSwitcherSelectPayload, SixHeaderProfileSelectPayload, SixHeaderSearchFieldToggle } from "./components/six-header/six-header";
 export { SelectionRange, SelectionRangeDirection } from "./components/six-input/six-input";
 export { ItemPickerPaddingDirection, ItemPickerType } from "./components/six-item-picker/types";
 export { SixItemPickerChangePayload } from "./components/six-item-picker/six-item-picker";
@@ -265,6 +265,89 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * A date picker component that allows users to select dates via a calendar popup or direct input.
+     * @since 5.0
+     * @status beta
+     */
+    interface SixDate {
+        /**
+          * Callback to determine which dates in the picker should be selectable.
+         */
+        "allowedDates": (date: string) => boolean;
+        /**
+          * Set to true to add a clear button when the input is populated.
+         */
+        "clearable": boolean;
+        /**
+          * Defines the format pattern for displaying dates and how dates can be entered via keyboard.  The parser accepts flexible input that doesn't strictly match the format pattern. Input with missing leading zeros or incomplete years will be automatically normalized. For example, with the pattern "dd.MM.yyyy": "1.1.2025" becomes "01.01.2025" and "1.1.225" becomes "01.01.0225".  Defaults to "dd.MM.yyyy".  Available patterns: - Year: "yyyy" (e.g., "2021") - Month: "MM" (e.g., "01" for January) or "M" (e.g., "1" for January) - Day: "dd" (e.g., "08" for the 8th) or "d" (e.g., "8" for the 8th)  Examples: - "dd.MM.yyyy" -> "31.01.2024" - "yyyy-MM-dd" -> "2024-01-31" - "d.M.yyyy" -> "31.1.2024"
+         */
+        "dateFormat": string;
+        /**
+          * If `true` the component is disabled.
+         */
+        "disabled": boolean;
+        /**
+          * The error message shown, if `invalid` is set to true.
+         */
+        "errorText": string | string[];
+        /**
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
+         */
+        "errorTextCount"?: number;
+        /**
+          * The input's help text. Alternatively, you can use the help-text slot.
+         */
+        "helpText": string;
+        /**
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
+         */
+        "invalid": boolean;
+        /**
+          * The label text.
+         */
+        "label": string;
+        /**
+          * The language used to render the weekdays and months.
+         */
+        "language": Language;
+        /**
+          * The maximum allowed selectable date in ISO format (yyyy-MM-dd). Dates after this value will be disabled in the date picker. Example: '2025-01-01'
+         */
+        "max"?: string;
+        /**
+          * The minimum allowed selectable date in ISO format (yyyy-MM-dd). Dates before this value will be disabled in the date picker. Example: '2024-01-01'
+         */
+        "min"?: string;
+        /**
+          * The input's name attribute.
+         */
+        "name": string;
+        /**
+          * The placeholder defines what text to be shown on the input element
+         */
+        "placeholder"?: string;
+        /**
+          * If `true` the user can only select a date via the component in the popup but not directly edit the input field.
+         */
+        "readonly": boolean;
+        /**
+          * Set to true to show an asterisk beneath the label.
+         */
+        "required": boolean;
+        /**
+          * Sets focus on the input.
+         */
+        "setFocus": (options?: FocusOptions) => Promise<void>;
+        /**
+          * The size of the date input field.
+         */
+        "size": 'small' | 'medium' | 'large';
+        /**
+          * The value of the form field in ISO 8601 date format (yyyy-MM-dd). Example: '2024-01-01'.  When an invalid date is provided, it will be replaced with an empty string (''), matching the behavior of native HTML <input type="date">.  The displayed format can be customized using the dateFormat property, but the underlying value will always be stored in ISO format.
+         */
+        "value": string | '';
+    }
     /**
      * @since 1.0
      * @status stable
@@ -580,11 +663,6 @@ export namespace Components {
     | 'left'
     | 'left-start'
     | 'left-end';
-        /**
-          * Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu is activated.
-          * @deprecated : use the property `matchTriggerWidth` instead.
-         */
-        "reposition": () => Promise<void>;
         /**
           * Shows the dropdown panel
          */
@@ -742,45 +820,9 @@ export namespace Components {
      */
     interface SixHeader {
         /**
-          * Set whether the logo should be clickable
-          * @deprecated Use six-header `custom` property with `six-logo` instead
-         */
-        "clickableLogo": boolean;
-        /**
-          * Set `custom` to `true` for complete control over the header content. When enabled, all other properties and slots are ignored.  Use `six-header-item`, `six-header-dropdown-item` and `six-header-menu-button` to structure the content.
-          * @since 4.2.7
-          * @status beta
-         */
-        "custom": boolean;
-        /**
-          * Get open state for search
-          * @deprecated Use six-header `custom` property instead
-         */
-        "getIsSearchOpen": () => Promise<boolean>;
-        /**
-          * Set whether the hamburger menu should be visible or not
-          * @deprecated Use six-header `custom` property instead
-         */
-        "hideHamburgerMenu": boolean;
-        /**
-          * The displayed logo. Either six or bme. Defaults to six.
-          * @deprecated Use six-header `custom` property with `six-logo` instead
-         */
-        "logo": 'six' | 'bme';
-        /**
-          * Set the hamburger menu icon to open or closed state
-          * @deprecated Use six-header `custom` property instead
-         */
-        "openHamburgerMenu": boolean;
-        /**
-          * Set the header search to be in an open or closed state.  If `custom` is `true`, focuses the first `six-input` found in the search slot.
+          * Set the header search input to be in an open or closed state.  Focuses the first `six-input` found in the search slot.
          */
         "openSearch": boolean;
-        /**
-          * Sets open state for search
-          * @deprecated Use six-header `custom` property instead
-         */
-        "setSearchOpenState": (openState: boolean) => Promise<void>;
         /**
           * Indicates if content should be shifted down when search field is visible.
          */
@@ -788,13 +830,21 @@ export namespace Components {
     }
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface SixHeaderDropdownItem {
+        /**
+          * Set to true to allow auto filtering for entries in the dropdown. With this flag the dropdown will automatically filter itsel. If you need to coordinate the shown elements yourself, e.g. because you need to call an endpoint use asyncFilter instead
+         */
+        "filter": boolean;
+        /**
+          * The filter's placeholder text.
+         */
+        "filterPlaceholder": string;
     }
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface SixHeaderItem {
         /**
@@ -804,13 +854,29 @@ export namespace Components {
     }
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface SixHeaderMenuButton {
         /**
-          * The icon of the menu button.
+          * Set to true to draw the button with a caret for use with dropdowns, popovers, etc.
          */
-        "icon": string;
+        "caret": boolean;
+        /**
+          * Set to true to disable the button.
+         */
+        "disabled": boolean;
+        /**
+          * Set to true to draw the button in a loading state.
+         */
+        "loading": boolean;
+        /**
+          * Indicates if activating the button should reset the form.
+         */
+        "reset": boolean;
+        /**
+          * Indicates if activating the button should submit the form. Ignored when `href` is set.
+         */
+        "submit": boolean;
     }
     /**
      * @since 1.0
@@ -1473,11 +1539,6 @@ export namespace Components {
           * Set to render as line
          */
         "line": boolean;
-        /**
-          * The maximum number of tags to show when `multiple` is true. After the maximum, "+n" will be shown to indicate the number of additional items that are selected. Set to -1 to remove the limit.
-          * @deprecated : This property is ignored. The component now displays as many items as possible and computes the "+n" dynamically.
-         */
-        "maxTagsVisible": number;
         /**
           * Set to true to enable multiselect.
          */
@@ -1582,6 +1643,10 @@ export namespace Components {
           * Provide if the item should be rendered as anchor tag. Note, that the href is added automatically when using routerLink in Angular.
          */
         "href": string | undefined;
+        /**
+          * Icon of the item
+         */
+        "icon": string;
         /**
           * Set to true to draw the item in a selected state.
          */
@@ -1628,9 +1693,13 @@ export namespace Components {
      */
     interface SixSpinner {
         /**
-          * Indicates if the spinner is shown as animated SIX logo or simple spinner.
+          * Indicates if the spinner is shown as animated SIX or BME logo or a simple spinner.
          */
-        "six": boolean;
+        "logo"?: 'six' | 'bme';
+        /**
+          * **@deprecated** Use `logo="six"` instead.  If set to true, the spinner displays the SIX logo.
+         */
+        "six"?: boolean;
     }
     interface SixStageIndicator {
         /**
@@ -2103,6 +2172,10 @@ export interface SixCheckboxCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixCheckboxElement;
 }
+export interface SixDateCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLSixDateElement;
+}
 export interface SixDatepickerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixDatepickerElement;
@@ -2131,10 +2204,6 @@ export interface SixFileUploadCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixFileUploadElement;
 }
-export interface SixHeaderCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLSixHeaderElement;
-}
 export interface SixInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixInputElement;
@@ -2308,6 +2377,29 @@ declare global {
         prototype: HTMLSixCheckboxElement;
         new (): HTMLSixCheckboxElement;
     };
+    interface HTMLSixDateElementEventMap {
+        "six-change": string | '';
+        "six-blur": any;
+    }
+    /**
+     * A date picker component that allows users to select dates via a calendar popup or direct input.
+     * @since 5.0
+     * @status beta
+     */
+    interface HTMLSixDateElement extends Components.SixDate, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixDateElementEventMap>(type: K, listener: (this: HTMLSixDateElement, ev: SixDateCustomEvent<HTMLSixDateElementEventMap[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 HTMLSixDateElementEventMap>(type: K, listener: (this: HTMLSixDateElement, ev: SixDateCustomEvent<HTMLSixDateElementEventMap[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 HTMLSixDateElement: {
+        prototype: HTMLSixDateElement;
+        new (): HTMLSixDateElement;
+    };
     interface HTMLSixDatepickerElementEventMap {
         "six-datepicker-select": SixDatepickerSelectPayload;
         "six-datepicker-clear": EmptyPayload;
@@ -2528,27 +2620,11 @@ declare global {
         prototype: HTMLSixGroupLabelElement;
         new (): HTMLSixGroupLabelElement;
     };
-    interface HTMLSixHeaderElementEventMap {
-        "six-header-app-name-clicked": EmptyPayload;
-        "six-header-app-switcher-select": SixHeaderAppSwitcherSelectPayload;
-        "six-header-profile-select": SixHeaderProfileSelectPayload;
-        "six-header-hamburger-menu-clicked": EmptyPayload;
-        "six-header-logo-clicked": EmptyPayload;
-        "six-header-search-field-toggle": SixHeaderSearchFieldToggle;
-    }
     /**
      * @since 1.0
      * @status stable
      */
     interface HTMLSixHeaderElement extends Components.SixHeader, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLSixHeaderElementEventMap>(type: K, listener: (this: HTMLSixHeaderElement, ev: SixHeaderCustomEvent<HTMLSixHeaderElementEventMap[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 HTMLSixHeaderElementEventMap>(type: K, listener: (this: HTMLSixHeaderElement, ev: SixHeaderCustomEvent<HTMLSixHeaderElementEventMap[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 HTMLSixHeaderElement: {
         prototype: HTMLSixHeaderElement;
@@ -2556,7 +2632,7 @@ declare global {
     };
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface HTMLSixHeaderDropdownItemElement extends Components.SixHeaderDropdownItem, HTMLStencilElement {
     }
@@ -2566,7 +2642,7 @@ declare global {
     };
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface HTMLSixHeaderItemElement extends Components.SixHeaderItem, HTMLStencilElement {
     }
@@ -2576,7 +2652,7 @@ declare global {
     };
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface HTMLSixHeaderMenuButtonElement extends Components.SixHeaderMenuButton, HTMLStencilElement {
     }
@@ -3156,6 +3232,7 @@ declare global {
         "six-button": HTMLSixButtonElement;
         "six-card": HTMLSixCardElement;
         "six-checkbox": HTMLSixCheckboxElement;
+        "six-date": HTMLSixDateElement;
         "six-datepicker": HTMLSixDatepickerElement;
         "six-details": HTMLSixDetailsElement;
         "six-dialog": HTMLSixDialogElement;
@@ -3433,6 +3510,93 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * A date picker component that allows users to select dates via a calendar popup or direct input.
+     * @since 5.0
+     * @status beta
+     */
+    interface SixDate {
+        /**
+          * Callback to determine which dates in the picker should be selectable.
+         */
+        "allowedDates"?: (date: string) => boolean;
+        /**
+          * Set to true to add a clear button when the input is populated.
+         */
+        "clearable"?: boolean;
+        /**
+          * Defines the format pattern for displaying dates and how dates can be entered via keyboard.  The parser accepts flexible input that doesn't strictly match the format pattern. Input with missing leading zeros or incomplete years will be automatically normalized. For example, with the pattern "dd.MM.yyyy": "1.1.2025" becomes "01.01.2025" and "1.1.225" becomes "01.01.0225".  Defaults to "dd.MM.yyyy".  Available patterns: - Year: "yyyy" (e.g., "2021") - Month: "MM" (e.g., "01" for January) or "M" (e.g., "1" for January) - Day: "dd" (e.g., "08" for the 8th) or "d" (e.g., "8" for the 8th)  Examples: - "dd.MM.yyyy" -> "31.01.2024" - "yyyy-MM-dd" -> "2024-01-31" - "d.M.yyyy" -> "31.1.2024"
+         */
+        "dateFormat"?: string;
+        /**
+          * If `true` the component is disabled.
+         */
+        "disabled"?: boolean;
+        /**
+          * The error message shown, if `invalid` is set to true.
+         */
+        "errorText"?: string | string[];
+        /**
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
+         */
+        "errorTextCount"?: number;
+        /**
+          * The input's help text. Alternatively, you can use the help-text slot.
+         */
+        "helpText"?: string;
+        /**
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
+         */
+        "invalid"?: boolean;
+        /**
+          * The label text.
+         */
+        "label"?: string;
+        /**
+          * The language used to render the weekdays and months.
+         */
+        "language"?: Language;
+        /**
+          * The maximum allowed selectable date in ISO format (yyyy-MM-dd). Dates after this value will be disabled in the date picker. Example: '2025-01-01'
+         */
+        "max"?: string;
+        /**
+          * The minimum allowed selectable date in ISO format (yyyy-MM-dd). Dates before this value will be disabled in the date picker. Example: '2024-01-01'
+         */
+        "min"?: string;
+        /**
+          * The input's name attribute.
+         */
+        "name"?: string;
+        /**
+          * Emitted when the control loses focus or the date picker popup is closed. Does not contain event details.
+         */
+        "onSix-blur"?: (event: SixDateCustomEvent<any>) => void;
+        /**
+          * Emitted when the control's value changes. Event detail contains the new date value in ISO format (yyyy-MM-dd) or an empty string if cleared.
+         */
+        "onSix-change"?: (event: SixDateCustomEvent<string | ''>) => void;
+        /**
+          * The placeholder defines what text to be shown on the input element
+         */
+        "placeholder"?: string;
+        /**
+          * If `true` the user can only select a date via the component in the popup but not directly edit the input field.
+         */
+        "readonly"?: boolean;
+        /**
+          * Set to true to show an asterisk beneath the label.
+         */
+        "required"?: boolean;
+        /**
+          * The size of the date input field.
+         */
+        "size"?: 'small' | 'medium' | 'large';
+        /**
+          * The value of the form field in ISO 8601 date format (yyyy-MM-dd). Example: '2024-01-01'.  When an invalid date is provided, it will be replaced with an empty string (''), matching the behavior of native HTML <input type="date">.  The displayed format can be customized using the dateFormat property, but the underlying value will always be stored in ISO format.
+         */
+        "value"?: string | '';
+    }
     /**
      * @since 1.0
      * @status stable
@@ -3985,63 +4149,7 @@ declare namespace LocalJSX {
      */
     interface SixHeader {
         /**
-          * Set whether the logo should be clickable
-          * @deprecated Use six-header `custom` property with `six-logo` instead
-         */
-        "clickableLogo"?: boolean;
-        /**
-          * Set `custom` to `true` for complete control over the header content. When enabled, all other properties and slots are ignored.  Use `six-header-item`, `six-header-dropdown-item` and `six-header-menu-button` to structure the content.
-          * @since 4.2.7
-          * @status beta
-         */
-        "custom"?: boolean;
-        /**
-          * Set whether the hamburger menu should be visible or not
-          * @deprecated Use six-header `custom` property instead
-         */
-        "hideHamburgerMenu"?: boolean;
-        /**
-          * The displayed logo. Either six or bme. Defaults to six.
-          * @deprecated Use six-header `custom` property with `six-logo` instead
-         */
-        "logo"?: 'six' | 'bme';
-        /**
-          * Emitted when the name of the selected app is clicked.
-          * @deprecated Use six-header `custom` property with `six-header-dropdown-item` and `six-header-menu-button` instead
-         */
-        "onSix-header-app-name-clicked"?: (event: SixHeaderCustomEvent<EmptyPayload>) => void;
-        /**
-          * Emitted when a menu item is in the app switcher menu is selected.
-          * @deprecated Use six-header `custom` property with `six-header-dropdown-item` and `six-header-menu-button` instead
-         */
-        "onSix-header-app-switcher-select"?: (event: SixHeaderCustomEvent<SixHeaderAppSwitcherSelectPayload>) => void;
-        /**
-          * Emitted when the hamburger menu is clicked.
-          * @deprecated Use six-header `custom` property instead
-         */
-        "onSix-header-hamburger-menu-clicked"?: (event: SixHeaderCustomEvent<EmptyPayload>) => void;
-        /**
-          * Emitted when the header logo is clicked.
-          * @deprecated Use six-header `custom` property instead
-         */
-        "onSix-header-logo-clicked"?: (event: SixHeaderCustomEvent<EmptyPayload>) => void;
-        /**
-          * Emitted when a menu item is in the profile menu is selected.
-          * @deprecated Use six-header `custom` property with `six-header-dropdown-item` and `six-avatar` instead
-         */
-        "onSix-header-profile-select"?: (event: SixHeaderCustomEvent<SixHeaderProfileSelectPayload>) => void;
-        /**
-          * Emitted when search field is toggled.
-          * @deprecated Use six-header `custom` property instead
-         */
-        "onSix-header-search-field-toggle"?: (event: SixHeaderCustomEvent<SixHeaderSearchFieldToggle>) => void;
-        /**
-          * Set the hamburger menu icon to open or closed state
-          * @deprecated Use six-header `custom` property instead
-         */
-        "openHamburgerMenu"?: boolean;
-        /**
-          * Set the header search to be in an open or closed state.  If `custom` is `true`, focuses the first `six-input` found in the search slot.
+          * Set the header search input to be in an open or closed state.  Focuses the first `six-input` found in the search slot.
          */
         "openSearch"?: boolean;
         /**
@@ -4051,13 +4159,21 @@ declare namespace LocalJSX {
     }
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface SixHeaderDropdownItem {
+        /**
+          * Set to true to allow auto filtering for entries in the dropdown. With this flag the dropdown will automatically filter itsel. If you need to coordinate the shown elements yourself, e.g. because you need to call an endpoint use asyncFilter instead
+         */
+        "filter"?: boolean;
+        /**
+          * The filter's placeholder text.
+         */
+        "filterPlaceholder"?: string;
     }
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface SixHeaderItem {
         /**
@@ -4067,13 +4183,29 @@ declare namespace LocalJSX {
     }
     /**
      * @since 4.2.7
-     * @status beta
+     * @status stable
      */
     interface SixHeaderMenuButton {
         /**
-          * The icon of the menu button.
+          * Set to true to draw the button with a caret for use with dropdowns, popovers, etc.
          */
-        "icon"?: string;
+        "caret"?: boolean;
+        /**
+          * Set to true to disable the button.
+         */
+        "disabled"?: boolean;
+        /**
+          * Set to true to draw the button in a loading state.
+         */
+        "loading"?: boolean;
+        /**
+          * Indicates if activating the button should reset the form.
+         */
+        "reset"?: boolean;
+        /**
+          * Indicates if activating the button should submit the form. Ignored when `href` is set.
+         */
+        "submit"?: boolean;
     }
     /**
      * @since 1.0
@@ -4744,11 +4876,6 @@ declare namespace LocalJSX {
           * Set to render as line
          */
         "line"?: boolean;
-        /**
-          * The maximum number of tags to show when `multiple` is true. After the maximum, "+n" will be shown to indicate the number of additional items that are selected. Set to -1 to remove the limit.
-          * @deprecated : This property is ignored. The component now displays as many items as possible and computes the "+n" dynamically.
-         */
-        "maxTagsVisible"?: number;
         /**
           * Set to true to enable multiselect.
          */
@@ -4861,6 +4988,10 @@ declare namespace LocalJSX {
           * Provide if the item should be rendered as anchor tag. Note, that the href is added automatically when using routerLink in Angular.
          */
         "href"?: string | undefined;
+        /**
+          * Icon of the item
+         */
+        "icon"?: string;
         /**
           * Set to true to draw the item in a selected state.
          */
@@ -4907,7 +5038,11 @@ declare namespace LocalJSX {
      */
     interface SixSpinner {
         /**
-          * Indicates if the spinner is shown as animated SIX logo or simple spinner.
+          * Indicates if the spinner is shown as animated SIX or BME logo or a simple spinner.
+         */
+        "logo"?: 'six' | 'bme';
+        /**
+          * **@deprecated** Use `logo="six"` instead.  If set to true, the spinner displays the SIX logo.
          */
         "six"?: boolean;
     }
@@ -5396,6 +5531,7 @@ declare namespace LocalJSX {
         "six-button": SixButton;
         "six-card": SixCard;
         "six-checkbox": SixCheckbox;
+        "six-date": SixDate;
         "six-datepicker": SixDatepicker;
         "six-details": SixDetails;
         "six-dialog": SixDialog;
@@ -5487,6 +5623,12 @@ declare module "@stencil/core" {
              * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
              */
             "six-checkbox": LocalJSX.SixCheckbox & JSXBase.HTMLAttributes<HTMLSixCheckboxElement>;
+            /**
+             * A date picker component that allows users to select dates via a calendar popup or direct input.
+             * @since 5.0
+             * @status beta
+             */
+            "six-date": LocalJSX.SixDate & JSXBase.HTMLAttributes<HTMLSixDateElement>;
             /**
              * @since 1.0
              * @status stable
@@ -5554,17 +5696,17 @@ declare module "@stencil/core" {
             "six-header": LocalJSX.SixHeader & JSXBase.HTMLAttributes<HTMLSixHeaderElement>;
             /**
              * @since 4.2.7
-             * @status beta
+             * @status stable
              */
             "six-header-dropdown-item": LocalJSX.SixHeaderDropdownItem & JSXBase.HTMLAttributes<HTMLSixHeaderDropdownItemElement>;
             /**
              * @since 4.2.7
-             * @status beta
+             * @status stable
              */
             "six-header-item": LocalJSX.SixHeaderItem & JSXBase.HTMLAttributes<HTMLSixHeaderItemElement>;
             /**
              * @since 4.2.7
-             * @status beta
+             * @status stable
              */
             "six-header-menu-button": LocalJSX.SixHeaderMenuButton & JSXBase.HTMLAttributes<HTMLSixHeaderMenuButtonElement>;
             /**