@six-group/ui-library 0.0.0-insider.d833923 → 0.0.0-insider.d89f9dc

package/dist/types/components.d.ts

@@ -7,13 +7,14 @@
 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";
 import { SixLanguageSwitcherChangePayload, SixLanguageSwitcherInput } from "./components/six-language-switcher/six-language-switcher";
@@ -27,13 +28,14 @@ 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";
 export { SixLanguageSwitcherChangePayload, SixLanguageSwitcherInput } from "./components/six-language-switcher/six-language-switcher";
@@ -189,7 +191,14 @@ export namespace Components {
         /**
           * The button's type.
          */
-        "type": 'secondary' | 'primary' | 'link' | 'success' | 'warning' | 'danger' | 'action';
+        "type": | 'secondary'
+    | 'primary'
+    | 'link'
+    | 'success'
+    | 'warning'
+    | 'danger'
+    | 'action'
+    | 'action-outline';
         /**
           * An optional value for the button. Ignored when `href` is set.
          */
@@ -256,6 +265,93 @@ 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 experimental
+     */
+    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.  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;
+        /**
+          * Set the amount of time, in milliseconds, to wait to trigger the `six-change` event after each keystroke.
+         */
+        "debounce": number;
+        /**
+          * 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
@@ -571,11 +667,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
          */
@@ -670,6 +761,14 @@ export namespace Components {
           * Set when button is disabled.
          */
         "disabled": false;
+        /**
+          * The error message shown, if `invalid` is set to true.
+         */
+        "errorText": string | string[];
+        /**
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
+         */
+        "invalid": boolean;
         /**
           * Label of the drop area.
          */
@@ -682,6 +781,10 @@ export namespace Components {
           * More than one file allowed.
          */
         "multiple": false;
+        /**
+          * Set to true to draw the control in a loading state.
+         */
+        "uploading": boolean;
     }
     /**
      * @since 1.0
@@ -721,33 +824,63 @@ export namespace Components {
      */
     interface SixHeader {
         /**
-          * Set whether the logo should be clickable
+          * 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;
+        /**
+          * Indicates if content should be shifted down when search field is visible.
+         */
+        "shiftContent": boolean;
+    }
+    /**
+     * @since 4.2.7
+     * @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.
          */
-        "clickableLogo": boolean;
+        "filterPlaceholder": string;
+    }
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface SixHeaderItem {
         /**
-          * Get open state for search
+          * Indicates whether the item is styled as active. When set to `true`, a border is displayed below the trigger element.  Use <code>six-header-dropdown-item</code> to automatically set the active state for dropdowns.
          */
-        "getIsSearchOpen": () => Promise<boolean>;
+        "active": boolean;
+    }
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface SixHeaderMenuButton {
         /**
-          * Set whether the hamburger menu should be visible or not
+          * Set to true to draw the button with a caret for use with dropdowns, popovers, etc.
          */
-        "hideHamburgerMenu": boolean;
+        "caret": boolean;
         /**
-          * Set the hamburger menu icon to open or closed state
+          * Set to true to disable the button.
          */
-        "openHamburgerMenu": boolean;
+        "disabled": boolean;
         /**
-          * Set the header search to be in an open or closed state
+          * Set to true to draw the button in a loading state.
          */
-        "openSearch": boolean;
+        "loading": boolean;
         /**
-          * Sets open state for search
+          * Indicates if activating the button should reset the form.
          */
-        "setSearchOpenState": (openState: boolean) => Promise<void>;
+        "reset": boolean;
         /**
-          * Indicates if content should be shifted down when search field is visible.
+          * Indicates if activating the button should submit the form. Ignored when `href` is set.
          */
-        "shiftContent": boolean;
+        "submit": boolean;
     }
     /**
      * @since 1.0
@@ -780,6 +913,14 @@ export namespace Components {
           * Set to true to disable the button.
          */
         "disabled": boolean;
+        /**
+          * Tells the browser to download the linked file as this filename. Only used when `href` is set.
+         */
+        "download"?: string;
+        /**
+          * When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.
+         */
+        "href"?: string;
         /**
           * HTML symbol code or entity.
          */
@@ -796,6 +937,10 @@ export namespace Components {
           * The icon's size.
          */
         "size": 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge';
+        /**
+          * Tells the browser where to open the link. Only used when `href` is set.
+         */
+        "target"?: '_blank' | '_parent' | '_self' | '_top';
     }
     /**
      * @since 1.0
@@ -839,6 +984,10 @@ export namespace Components {
           * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
         "errorTextCount"?: number;
+        /**
+          * Returns the start and end positions of the text selection
+         */
+        "getSelectionRange": () => Promise<SelectionRange>;
         /**
           * The input's help text. Alternatively, you can use the help-text slot.
          */
@@ -914,11 +1063,11 @@ export namespace Components {
         /**
           * Replaces a range of text with a new string.
          */
-        "setRangeText": (replacement: string, start: number, end: number, selectMode?: 'select' | 'start' | 'end' | 'preserve') => Promise<void>;
+        "setRangeText": (replacement: string, start: number, end: number, selectMode?: "select" | "start" | "end" | "preserve") => Promise<void>;
         /**
           * Sets the start and end positions of the text selection (0-based).
          */
-        "setSelectionRange": (selectionStart: number, selectionEnd: number, selectionDirection?: 'forward' | 'backward' | 'none') => Promise<void | undefined>;
+        "setSelectionRange": (selectionStart: number, selectionEnd: number, selectionDirection?: SelectionRangeDirection) => Promise<void | undefined>;
         /**
           * The input's size.
          */
@@ -1026,6 +1175,16 @@ export namespace Components {
          */
         "columns"?: number;
     }
+    /**
+     * @since 4.2.7
+     * @status beta
+     */
+    interface SixLogo {
+        /**
+          * The brand of the logo. Either six or bme. Defaults to six.
+         */
+        "brand": 'six' | 'bme';
+    }
     /**
      * @since 1.01
      * @status stable
@@ -1384,11 +1543,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.
          */
@@ -1493,6 +1647,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.
          */
@@ -1539,9 +1697,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.
+         */
+        "logo"?: 'six' | 'bme';
+        /**
+          * **@deprecated** Use `logo="six"` instead.  If set to true, the spinner displays the SIX logo.
          */
-        "six": boolean;
+        "six"?: boolean;
     }
     interface SixStageIndicator {
         /**
@@ -1785,11 +1947,11 @@ export namespace Components {
         /**
           * Replaces a range of text with a new string.
          */
-        "setRangeText": (replacement: string, start: number, end: number, selectMode?: 'select' | 'start' | 'end' | 'preserve') => Promise<void>;
+        "setRangeText": (replacement: string, start: number, end: number, selectMode?: "select" | "start" | "end" | "preserve") => Promise<void>;
         /**
           * Sets the start and end positions of the text selection (0-based).
          */
-        "setSelectionRange": (selectionStart: number, selectionEnd: number, selectionDirection?: 'forward' | 'backward' | 'none') => Promise<void | undefined>;
+        "setSelectionRange": (selectionStart: number, selectionEnd: number, selectionDirection?: "forward" | "backward" | "none") => Promise<void | undefined>;
         /**
           * The textarea's size.
          */
@@ -2014,6 +2176,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;
@@ -2042,10 +2208,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;
@@ -2219,6 +2381,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 experimental
+     */
+    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;
@@ -2439,32 +2624,46 @@ 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;
         new (): HTMLSixHeaderElement;
     };
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface HTMLSixHeaderDropdownItemElement extends Components.SixHeaderDropdownItem, HTMLStencilElement {
+    }
+    var HTMLSixHeaderDropdownItemElement: {
+        prototype: HTMLSixHeaderDropdownItemElement;
+        new (): HTMLSixHeaderDropdownItemElement;
+    };
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface HTMLSixHeaderItemElement extends Components.SixHeaderItem, HTMLStencilElement {
+    }
+    var HTMLSixHeaderItemElement: {
+        prototype: HTMLSixHeaderItemElement;
+        new (): HTMLSixHeaderItemElement;
+    };
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface HTMLSixHeaderMenuButtonElement extends Components.SixHeaderMenuButton, HTMLStencilElement {
+    }
+    var HTMLSixHeaderMenuButtonElement: {
+        prototype: HTMLSixHeaderMenuButtonElement;
+        new (): HTMLSixHeaderMenuButtonElement;
+    };
     /**
      * @since 1.0
      * @status stable
@@ -2561,6 +2760,16 @@ declare global {
         prototype: HTMLSixLayoutGridElement;
         new (): HTMLSixLayoutGridElement;
     };
+    /**
+     * @since 4.2.7
+     * @status beta
+     */
+    interface HTMLSixLogoElement extends Components.SixLogo, HTMLStencilElement {
+    }
+    var HTMLSixLogoElement: {
+        prototype: HTMLSixLogoElement;
+        new (): HTMLSixLogoElement;
+    };
     /**
      * @since 1.01
      * @status stable
@@ -3027,6 +3236,7 @@ declare global {
         "six-button": HTMLSixButtonElement;
         "six-card": HTMLSixCardElement;
         "six-checkbox": HTMLSixCheckboxElement;
+        "six-date": HTMLSixDateElement;
         "six-datepicker": HTMLSixDatepickerElement;
         "six-details": HTMLSixDetailsElement;
         "six-dialog": HTMLSixDialogElement;
@@ -3040,12 +3250,16 @@ declare global {
         "six-footer": HTMLSixFooterElement;
         "six-group-label": HTMLSixGroupLabelElement;
         "six-header": HTMLSixHeaderElement;
+        "six-header-dropdown-item": HTMLSixHeaderDropdownItemElement;
+        "six-header-item": HTMLSixHeaderItemElement;
+        "six-header-menu-button": HTMLSixHeaderMenuButtonElement;
         "six-icon": HTMLSixIconElement;
         "six-icon-button": HTMLSixIconButtonElement;
         "six-input": HTMLSixInputElement;
         "six-item-picker": HTMLSixItemPickerElement;
         "six-language-switcher": HTMLSixLanguageSwitcherElement;
         "six-layout-grid": HTMLSixLayoutGridElement;
+        "six-logo": HTMLSixLogoElement;
         "six-main-container": HTMLSixMainContainerElement;
         "six-menu": HTMLSixMenuElement;
         "six-menu-divider": HTMLSixMenuDividerElement;
@@ -3222,7 +3436,14 @@ declare namespace LocalJSX {
         /**
           * The button's type.
          */
-        "type"?: 'secondary' | 'primary' | 'link' | 'success' | 'warning' | 'danger' | 'action';
+        "type"?: | 'secondary'
+    | 'primary'
+    | 'link'
+    | 'success'
+    | 'warning'
+    | 'danger'
+    | 'action'
+    | 'action-outline';
         /**
           * An optional value for the button. Ignored when `href` is set.
          */
@@ -3293,6 +3514,97 @@ 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 experimental
+     */
+    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.  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;
+        /**
+          * Set the amount of time, in milliseconds, to wait to trigger the `six-change` event after each keystroke.
+         */
+        "debounce"?: number;
+        /**
+          * 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
@@ -3774,6 +4086,14 @@ declare namespace LocalJSX {
           * Set when button is disabled.
          */
         "disabled"?: false;
+        /**
+          * The error message shown, if `invalid` is set to true.
+         */
+        "errorText"?: string | string[];
+        /**
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
+         */
+        "invalid"?: boolean;
         /**
           * Label of the drop area.
          */
@@ -3794,6 +4114,10 @@ declare namespace LocalJSX {
           * Triggers when a file is added.
          */
         "onSix-file-upload-success"?: (event: SixFileUploadCustomEvent<SixFileUploadSuccessPayload>) => void;
+        /**
+          * Set to true to draw the control in a loading state.
+         */
+        "uploading"?: boolean;
     }
     /**
      * @since 1.0
@@ -3833,49 +4157,63 @@ declare namespace LocalJSX {
      */
     interface SixHeader {
         /**
-          * Set whether the logo should be clickable
+          * Set the header search input to be in an open or closed state.  Focuses the first `six-input` found in the search slot.
          */
-        "clickableLogo"?: boolean;
-        /**
-          * Set whether the hamburger menu should be visible or not
-         */
-        "hideHamburgerMenu"?: boolean;
+        "openSearch"?: boolean;
         /**
-          * Emitted when the name of the selected app is clicked.
+          * Indicates if content should be shifted down when search field is visible.
          */
-        "onSix-header-app-name-clicked"?: (event: SixHeaderCustomEvent<EmptyPayload>) => void;
+        "shiftContent"?: boolean;
+    }
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface SixHeaderDropdownItem {
         /**
-          * Emitted when a menu item is in the app switcher menu is selected.
+          * 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
          */
-        "onSix-header-app-switcher-select"?: (event: SixHeaderCustomEvent<SixHeaderAppSwitcherSelectPayload>) => void;
+        "filter"?: boolean;
         /**
-          * Emitted when the hamburger menu is clicked.
+          * The filter's placeholder text.
          */
-        "onSix-header-hamburger-menu-clicked"?: (event: SixHeaderCustomEvent<EmptyPayload>) => void;
+        "filterPlaceholder"?: string;
+    }
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface SixHeaderItem {
         /**
-          * Emitted when the header logo is clicked.
+          * Indicates whether the item is styled as active. When set to `true`, a border is displayed below the trigger element.  Use <code>six-header-dropdown-item</code> to automatically set the active state for dropdowns.
          */
-        "onSix-header-logo-clicked"?: (event: SixHeaderCustomEvent<EmptyPayload>) => void;
+        "active"?: boolean;
+    }
+    /**
+     * @since 4.2.7
+     * @status stable
+     */
+    interface SixHeaderMenuButton {
         /**
-          * Emitted when a menu item is in the profile menu is selected.
+          * Set to true to draw the button with a caret for use with dropdowns, popovers, etc.
          */
-        "onSix-header-profile-select"?: (event: SixHeaderCustomEvent<SixHeaderProfileSelectPayload>) => void;
+        "caret"?: boolean;
         /**
-          * Emitted when search field is toggled.
+          * Set to true to disable the button.
          */
-        "onSix-header-search-field-toggle"?: (event: SixHeaderCustomEvent<SixHeaderSearchFieldToggle>) => void;
+        "disabled"?: boolean;
         /**
-          * Set the hamburger menu icon to open or closed state
+          * Set to true to draw the button in a loading state.
          */
-        "openHamburgerMenu"?: boolean;
+        "loading"?: boolean;
         /**
-          * Set the header search to be in an open or closed state
+          * Indicates if activating the button should reset the form.
          */
-        "openSearch"?: boolean;
+        "reset"?: boolean;
         /**
-          * Indicates if content should be shifted down when search field is visible.
+          * Indicates if activating the button should submit the form. Ignored when `href` is set.
          */
-        "shiftContent"?: boolean;
+        "submit"?: boolean;
     }
     /**
      * @since 1.0
@@ -3908,6 +4246,14 @@ declare namespace LocalJSX {
           * Set to true to disable the button.
          */
         "disabled"?: boolean;
+        /**
+          * Tells the browser to download the linked file as this filename. Only used when `href` is set.
+         */
+        "download"?: string;
+        /**
+          * When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.
+         */
+        "href"?: string;
         /**
           * HTML symbol code or entity.
          */
@@ -3924,6 +4270,10 @@ declare namespace LocalJSX {
           * The icon's size.
          */
         "size"?: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge';
+        /**
+          * Tells the browser where to open the link. Only used when `href` is set.
+         */
+        "target"?: '_blank' | '_parent' | '_self' | '_top';
     }
     /**
      * @since 1.0
@@ -4166,6 +4516,16 @@ declare namespace LocalJSX {
          */
         "columns"?: number;
     }
+    /**
+     * @since 4.2.7
+     * @status beta
+     */
+    interface SixLogo {
+        /**
+          * The brand of the logo. Either six or bme. Defaults to six.
+         */
+        "brand"?: 'six' | 'bme';
+    }
     /**
      * @since 1.01
      * @status stable
@@ -4524,11 +4884,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.
          */
@@ -4641,6 +4996,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.
          */
@@ -4687,7 +5046,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;
     }
@@ -5176,6 +5539,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;
@@ -5189,12 +5553,16 @@ declare namespace LocalJSX {
         "six-footer": SixFooter;
         "six-group-label": SixGroupLabel;
         "six-header": SixHeader;
+        "six-header-dropdown-item": SixHeaderDropdownItem;
+        "six-header-item": SixHeaderItem;
+        "six-header-menu-button": SixHeaderMenuButton;
         "six-icon": SixIcon;
         "six-icon-button": SixIconButton;
         "six-input": SixInput;
         "six-item-picker": SixItemPicker;
         "six-language-switcher": SixLanguageSwitcher;
         "six-layout-grid": SixLayoutGrid;
+        "six-logo": SixLogo;
         "six-main-container": SixMainContainer;
         "six-menu": SixMenu;
         "six-menu-divider": SixMenuDivider;
@@ -5263,6 +5631,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 experimental
+             */
+            "six-date": LocalJSX.SixDate & JSXBase.HTMLAttributes<HTMLSixDateElement>;
             /**
              * @since 1.0
              * @status stable
@@ -5328,6 +5702,21 @@ declare module "@stencil/core" {
              * @status stable
              */
             "six-header": LocalJSX.SixHeader & JSXBase.HTMLAttributes<HTMLSixHeaderElement>;
+            /**
+             * @since 4.2.7
+             * @status stable
+             */
+            "six-header-dropdown-item": LocalJSX.SixHeaderDropdownItem & JSXBase.HTMLAttributes<HTMLSixHeaderDropdownItemElement>;
+            /**
+             * @since 4.2.7
+             * @status stable
+             */
+            "six-header-item": LocalJSX.SixHeaderItem & JSXBase.HTMLAttributes<HTMLSixHeaderItemElement>;
+            /**
+             * @since 4.2.7
+             * @status stable
+             */
+            "six-header-menu-button": LocalJSX.SixHeaderMenuButton & JSXBase.HTMLAttributes<HTMLSixHeaderMenuButtonElement>;
             /**
              * @since 1.0
              * @status stable
@@ -5356,6 +5745,11 @@ declare module "@stencil/core" {
              * @status stable
              */
             "six-layout-grid": LocalJSX.SixLayoutGrid & JSXBase.HTMLAttributes<HTMLSixLayoutGridElement>;
+            /**
+             * @since 4.2.7
+             * @status beta
+             */
+            "six-logo": LocalJSX.SixLogo & JSXBase.HTMLAttributes<HTMLSixLogoElement>;
             /**
              * @since 1.01
              * @status stable