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

package/dist/types/components.d.ts

@@ -5,6 +5,7 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
+import { AlertType } from "./components/six-alert/six-alert";
 import { EmptyPayload } from "./utils/types";
 import { SixDateFormats } from "./components/six-datepicker/six-date-formats";
 import { SixDatepickerSelectPayload } from "./components/six-datepicker/six-datepicker";
@@ -12,20 +13,19 @@ 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 { SixFormChangePayload, SixFormSubmitPayload } from "./components/six-form/six-form";
 import { SixHeaderAppSwitcherSelectPayload, SixHeaderProfileSelectPayload, SixHeaderSearchFieldToggle } from "./components/six-header/six-header";
 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";
 import { SixMenuItemData as SixMenuItemData1, SixMenuItemSelectedPayload } from "./components/six-menu/six-menu";
 import { StageType } from "./components/six-stage-indicator/six-stage-indicator";
-import { SixRootCollapsedPayload } from "./components/six-root/six-root";
 import { SixSearchFieldChangePayload } from "./components/six-search-field/six-search-field";
 import { SixSelectChangePayload } from "./components/six-select/six-select";
 import { StageType as StageType1 } from "./components/six-stage-indicator/six-stage-indicator";
 import { SixTabHidePayload, SixTabShowPayload } from "./components/six-tab-group/six-tab-group";
 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 { SixDateFormats } from "./components/six-datepicker/six-date-formats";
 export { SixDatepickerSelectPayload } from "./components/six-datepicker/six-datepicker";
@@ -33,14 +33,12 @@ 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 { SixFormChangePayload, SixFormSubmitPayload } from "./components/six-form/six-form";
 export { SixHeaderAppSwitcherSelectPayload, SixHeaderProfileSelectPayload, SixHeaderSearchFieldToggle } from "./components/six-header/six-header";
 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";
 export { SixMenuItemData as SixMenuItemData1, SixMenuItemSelectedPayload } from "./components/six-menu/six-menu";
 export { StageType } from "./components/six-stage-indicator/six-stage-indicator";
-export { SixRootCollapsedPayload } from "./components/six-root/six-root";
 export { SixSearchFieldChangePayload } from "./components/six-search-field/six-search-field";
 export { SixSelectChangePayload } from "./components/six-select/six-select";
 export { StageType as StageType1 } from "./components/six-stage-indicator/six-stage-indicator";
@@ -48,12 +46,6 @@ export { SixTabHidePayload, SixTabShowPayload } from "./components/six-tab-group
 export { TimeFormat } from "./utils/time.util";
 export { SixTimepickerChange } from "./components/six-timepicker/six-timepicker";
 export namespace Components {
-    interface SetAttributes {
-        /**
-          * Attributes map
-         */
-        "value": {};
-    }
     /**
      * @since 1.0
      * @status stable
@@ -65,7 +57,7 @@ export namespace Components {
          */
         "closable": boolean;
         /**
-          * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the alert before it closes (e.g. moves the mouse over it), the timer will restart.
+          * The length of time, in milliseconds, the alert will show before closing itself. If the user hovers over the toast alert, the timer will pause. On leaving the element with the mouse, the timer resets.
          */
         "duration": number;
         /**
@@ -82,12 +74,13 @@ export namespace Components {
         "show": () => Promise<void>;
         /**
           * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by calling this method again. The returned promise will resolve after the alert is hidden.
+          * @param adjustPosition If true, the top and right position of the toast stack is shifted according to the six-root header's height and the presence of a vertical scrollbar.
          */
-        "toast": () => Promise<void>;
+        "toast": (adjustPosition?: boolean) => Promise<void>;
         /**
           * The type of alert.
          */
-        "type": 'primary' | 'success' | 'info' | 'warning' | 'danger';
+        "type": AlertType;
     }
     /**
      * @since 1.0
@@ -214,10 +207,6 @@ export namespace Components {
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface SixCheckbox {
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean>;
         /**
           * Set to true to draw the checkbox in a checked state.
          */
@@ -227,23 +216,23 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur": boolean;
+        "errorText": string | string[];
         /**
-          * The checkbox's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText": string;
+        "errorTextCount"?: number;
         /**
           * Set to true to draw the checkbox in an indeterminate state.
          */
         "indeterminate": boolean;
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid": boolean;
         /**
-          * The checkbox label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label": string;
         /**
@@ -255,21 +244,9 @@ export namespace Components {
          */
         "removeFocus": () => Promise<void>;
         /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
-         */
-        "reportValidity": () => Promise<boolean | undefined>;
-        /**
-          * Set to true to make the checkbox a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required": boolean;
-        /**
-          * Resets the formcontrol
-         */
-        "reset": () => Promise<void>;
-        /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
-         */
-        "setCustomValidity": (message: string) => Promise<void>;
         /**
           * Sets focus on the checkbox.
          */
@@ -288,10 +265,6 @@ export namespace Components {
           * Callback to determine which date in the datepicker should be selectable. the callback function will get a datestring as an argument, e.g. '2021-07-04'  Usage e.g.: const datepicker = document.getElementById('allowed-date-picker'); datepicker.allowedDates = datestring => parseInt(datestring.split('-')[2], 10) % 2 === 0;
          */
         "allowedDates": (date: Date) => boolean;
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean | undefined>;
         /**
           * Set to true to add a clear button when the input is populated.
          */
@@ -321,13 +294,13 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur": boolean;
+        "errorText": string | string[];
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText": string;
+        "errorTextCount"?: number;
         /**
           * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
          */
@@ -341,13 +314,17 @@ export namespace Components {
          */
         "inline": boolean;
         /**
-          * The input's label. Alternatively, you can use the label slot.
+          * 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.
          */
-        "locale": 'en' | 'de' | 'fr' | 'it';
+        "locale": 'en' | 'de' | 'fr' | 'it' | 'es';
         /**
           * The maximum datetime allowed. Value must be a date object
          */
@@ -377,25 +354,17 @@ export namespace Components {
          */
         "readonly": boolean;
         /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
-         */
-        "reportValidity": () => Promise<boolean | undefined>;
-        /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required": boolean;
-        /**
-          * Resets the formcontrol
-         */
-        "reset": () => Promise<void>;
         /**
           * Selects an option
          */
         "select": (datestring?: string) => Promise<void>;
         /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
+          * Sets focus on the datepickers input.
          */
-        "setCustomValidity": (message: string) => Promise<void>;
+        "setFocus": (options?: FocusOptions) => Promise<void>;
         /**
           * Datepicker size.
          */
@@ -575,6 +544,10 @@ export namespace Components {
           * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
          */
         "hoist": boolean;
+        /**
+          * Determines if the dropdown panel's width should match the width of the trigger element.  If set to `true`, the panel will resize its width to align with the trigger's width. If `false` or omitted, the panel will maintain its default width.
+         */
+        "matchTriggerWidth": boolean;
         /**
           * Indicates whether the dropdown is open. You can use this in lieu of the show/hide methods.
          */
@@ -600,6 +573,7 @@ export namespace Components {
     | '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>;
         /**
@@ -615,6 +589,12 @@ export namespace Components {
          */
         "virtualScroll": boolean;
     }
+    /**
+     * @since 4.0
+     * @status beta
+     */
+    interface SixError {
+    }
     interface SixErrorPage {
         /**
           * Defines a custom description.
@@ -709,37 +689,6 @@ export namespace Components {
      */
     interface SixFooter {
     }
-    /**
-     * @since 1.0
-     * @status stable
-     * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
-     */
-    interface SixForm {
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean>;
-        /**
-          * Gets all form control elements (native and custom).
-         */
-        "getFormControls": () => Promise<HTMLFormElement[]>;
-        /**
-          * Serializes all form controls elements and returns a `FormData` object.
-         */
-        "getFormData": () => Promise<FormData>;
-        /**
-          * Prevent the form from validating inputs before submitting.
-         */
-        "novalidate": boolean;
-        /**
-          * Resets the form and resets the value of all descendants
-         */
-        "reset": () => Promise<void>;
-        /**
-          * Submits the form. If all controls are valid, the `six-form-submit` event will be emitted and the promise will resolve with `true`. If any form control is invalid, the promise will resolve with `false` and no event will be emitted.
-         */
-        "submit": () => Promise<boolean>;
-    }
     /**
      * @since 1.1
      * @status stable
@@ -758,7 +707,7 @@ export namespace Components {
          */
         "label": string;
         /**
-          * The label's required attribute.
+          * Set to true to show an asterisk beneath the label.
          */
         "required": boolean;
         /**
@@ -779,6 +728,10 @@ export namespace Components {
           * Get open state for search
          */
         "getIsSearchOpen": () => Promise<boolean>;
+        /**
+          * Set whether the hamburger menu should be visible or not
+         */
+        "hideHamburgerMenu": boolean;
         /**
           * Set the hamburger menu icon to open or closed state
          */
@@ -866,10 +819,6 @@ export namespace Components {
           * The input's autofocus attribute.
          */
         "autofocus": boolean;
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean>;
         /**
           * Set to true to add a clear button when the input is populated.
          */
@@ -879,21 +828,17 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * Internal: Styles the input for the dropdown filter search.
          */
-        "errorOnBlur": boolean;
+        "dropdownSearch": boolean;
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
-         */
-        "errorText": string;
-        /**
-          * Returns the native input's validationMessage
+          * The error message shown, if `invalid` is set to true.
          */
-        "getValidationMessage": () => Promise<string>;
+        "errorText": string | string[];
         /**
-          * Returns the native input's validity
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "getValidity": () => Promise<ValidityState | undefined>;
+        "errorTextCount"?: number;
         /**
           * The input's help text. Alternatively, you can use the help-text slot.
          */
@@ -903,15 +848,11 @@ export namespace Components {
          */
         "inputmode"?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by props such as `type`, `required`, `minlength`, `maxlength`, and `pattern` using the browser's constraint validation API.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid": boolean;
         /**
-          * Returns the native input's validity
-         */
-        "isValid": () => Promise<boolean>;
-        /**
-          * The input's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label": string;
         /**
@@ -959,25 +900,13 @@ export namespace Components {
          */
         "removeFocus": () => Promise<void>;
         /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
-         */
-        "reportValidity": () => Promise<boolean | undefined>;
-        /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required": boolean;
-        /**
-          * Resets the formcontrol
-         */
-        "reset": () => Promise<void>;
         /**
           * Selects all the text in the input.
          */
         "select": () => Promise<void | undefined>;
-        /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
-         */
-        "setCustomValidity": (message: string) => Promise<void>;
         /**
           * Sets focus on the input.
          */
@@ -1113,6 +1042,10 @@ export namespace Components {
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface SixMenu {
+        /**
+          * Internal: Disables handling of key presses.
+         */
+        "disableKeyboardHandling": boolean;
         /**
           * Used for virtual scrolling Define how many items should be rendered in the DOM when using virtual scrolling
          */
@@ -1156,7 +1089,11 @@ export namespace Components {
      */
     interface SixMenuItem {
         /**
-          * Set to true to draw the item in a checked state.
+          * Defines if the checked state is displayed as a checkbox or a check-icon
+         */
+        "checkType": 'checkbox' | 'check';
+        /**
+          * Internal: Draws the item in a checked state. CheckType needs to be set to 'checkbox' or 'check' to show the checked state
          */
         "checked": boolean;
         /**
@@ -1237,10 +1174,6 @@ export namespace Components {
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface SixRadio {
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean>;
         /**
           * Set to true to draw the radio in a checked state.
          */
@@ -1250,7 +1183,7 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid": boolean;
         /**
@@ -1261,18 +1194,6 @@ export namespace Components {
           * Removes focus from the radio.
          */
         "removeFocus": () => Promise<void>;
-        /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
-         */
-        "reportValidity": () => Promise<boolean | undefined>;
-        /**
-          * Resets the formcontrol
-         */
-        "reset": () => Promise<void>;
-        /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
-         */
-        "setCustomValidity": (message: string) => Promise<void>;
         /**
           * Sets focus on the radio.
          */
@@ -1293,23 +1214,23 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur": boolean;
+        "errorText": string | string[];
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText": string;
+        "errorTextCount"?: number;
         /**
           * The range's help text. Alternatively, you can use the help-text slot.
          */
         "helpText": string;
         /**
-          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid": boolean;
         /**
-          * The range's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label": string;
         /**
@@ -1329,17 +1250,9 @@ export namespace Components {
          */
         "removeFocus": () => Promise<void>;
         /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required": boolean;
-        /**
-          * Resets the formcontrol
-         */
-        "reset": () => Promise<void>;
-        /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
-         */
-        "setCustomValidity": (message: string) => Promise<void>;
         /**
           * Sets focus on the input.
          */
@@ -1366,10 +1279,6 @@ export namespace Components {
      * @status stable
      */
     interface SixRoot {
-        /**
-          * Breakpoint for smaller screens when the right sidebar is collapsed by default.
-         */
-        "breakpoint": number;
         /**
           * Defines whether the content section should be padded
          */
@@ -1423,30 +1332,22 @@ export namespace Components {
           * Set to true to turn the six-select into an autocomplete.
          */
         "autocomplete": boolean;
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean | undefined>;
         /**
           * Set to true to add a clear button when the select is populated.
          */
         "clearable": boolean;
-        /**
-          * The default value the select will be reverted to when reset is executed
-         */
-        "defaultValue": string | string[];
         /**
           * Set to true to disable the select control.
          */
         "disabled": boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur": boolean;
+        "errorText": string | string[];
         /**
-          * The select's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText": string;
+        "errorTextCount"?: number;
         /**
           * Set to true to allow filtering for entries in the dropdown
          */
@@ -1454,7 +1355,7 @@ export namespace Components {
         /**
           * The debounce for the filter callbacks.
          */
-        "filterDebounce": number;
+        "filterDebounce"?: number;
         /**
           * The filter's placeholder text.
          */
@@ -1472,11 +1373,11 @@ export namespace Components {
          */
         "inputDebounce": number;
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid": boolean;
         /**
-          * The select's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label": string;
         /**
@@ -1485,6 +1386,7 @@ export namespace Components {
         "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;
         /**
@@ -1508,21 +1410,21 @@ export namespace Components {
          */
         "placeholder": string;
         /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
+          * Set to true to show an asterisk beneath the label.
          */
-        "reportValidity": () => Promise<boolean | undefined>;
+        "required": boolean;
         /**
-          * The select's required attribute.
+          * Enables the select all button.
          */
-        "required": boolean;
+        "selectAllButton": boolean;
         /**
-          * Resets the formcontrol
+          * Custom text for the "select all" button. Defaults to "Select all" and equivalents in supported languages.
          */
-        "reset": () => Promise<void>;
+        "selectAllText"?: string;
         /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
+          * Sets focus on the select.
          */
-        "setCustomValidity": (message: string) => Promise<void>;
+        "setFocus": (options?: FocusOptions) => Promise<void>;
         /**
           * The select's size.
          */
@@ -1587,6 +1489,10 @@ export namespace Components {
           * Set to true to draw the sidebar item in a disabled state.
          */
         "disabled": boolean;
+        /**
+          * 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;
         /**
           * Set to true to draw the item in a selected state.
          */
@@ -1601,6 +1507,10 @@ export namespace Components {
      * @status stable
      */
     interface SixSidebarItemGroup {
+        /**
+          * 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 group
          */
@@ -1645,10 +1555,6 @@ export namespace Components {
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface SixSwitch {
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean | undefined>;
         /**
           * Set to true to draw the switch in a checked state.
          */
@@ -1658,33 +1564,33 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
+          * The error message shown, if `invalid` is set to true.
          */
-        "invalid": boolean;
+        "errorText": string | string[];
         /**
-          * The switch's name attribute.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "name": string;
+        "errorTextCount"?: number;
         /**
-          * Removes focus from the switch.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
-        "removeFocus": () => Promise<void>;
+        "invalid": boolean;
         /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
+          * The label text.
          */
-        "reportValidity": () => Promise<boolean | undefined>;
+        "label": string;
         /**
-          * Set to true to make the switch a required field.
+          * The switch's name attribute.
          */
-        "required": boolean;
+        "name": string;
         /**
-          * Resets the formcontrol
+          * Removes focus from the switch.
          */
-        "reset": () => Promise<void>;
+        "removeFocus": () => Promise<void>;
         /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
+          * Set to true to show an asterisk beneath the label.
          */
-        "setCustomValidity": (message: string) => Promise<void>;
+        "required": boolean;
         /**
           * Sets focus on the switch.
          */
@@ -1804,22 +1710,18 @@ export namespace Components {
           * The textarea's autofocus attribute.
          */
         "autofocus": boolean;
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean>;
         /**
           * Set to true to disable the textarea.
          */
         "disabled": boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur": boolean;
+        "errorText": string | string[];
         /**
-          * The textarea's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText": string;
+        "errorTextCount"?: number;
         /**
           * The textarea's help text. Alternatively, you can use the help-text slot.
          */
@@ -1829,11 +1731,11 @@ export namespace Components {
          */
         "inputmode"?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by props such as `required`, `minlength`, and `maxlength` using the browser's constraint validation API.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid": boolean;
         /**
-          * The textarea's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label": string;
         /**
@@ -1861,17 +1763,9 @@ export namespace Components {
          */
         "removeFocus": () => Promise<void>;
         /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
-         */
-        "reportValidity": () => Promise<boolean | undefined>;
-        /**
-          * The textarea's required attribute.
+          * Set to true to show an asterisk beneath the label.
          */
         "required": boolean;
-        /**
-          * Resets the formcontrol
-         */
-        "reset": () => Promise<void>;
         /**
           * Controls how the textarea can be resized.
          */
@@ -1884,10 +1778,6 @@ export namespace Components {
           * Selects all the text in the input.
          */
         "select": () => Promise<void | undefined>;
-        /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
-         */
-        "setCustomValidity": (message: string) => Promise<void>;
         /**
           * Sets focus on the textarea.
          */
@@ -1960,10 +1850,6 @@ export namespace Components {
      * @status experimental
      */
     interface SixTimepicker {
-        /**
-          * Checks for validity.
-         */
-        "checkValidity": () => Promise<boolean | undefined>;
         /**
           * Set to true to add a clear button when the input is populated.
          */
@@ -1981,13 +1867,13 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The input's error text. Alternatively, you can use the error-text slot.
          */
-        "errorOnBlur": boolean;
+        "errorText": string | string[];
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText": string;
+        "errorTextCount"?: number;
         /**
           * Define the time format. Valid formats are:  HH:mm:ss hh:mm:ss:aa HH:mm:ss:ms hh:mm:ss:ms:aa HH:mm hh:mm:aa HH hh:aa mm ss ms  where HH is the 24 hour format and hh is the 12 hour format  Please notice that when using the 12-hour-clock (hh) you always need a period indicator (aa). So the time can be parsed as either am or pm
          */
@@ -2008,6 +1894,10 @@ export namespace Components {
           * Set the amount of time, in milliseconds, to wait between switching to next timeunit (e.g. next hour) when mouse button is held pressed.
          */
         "interval": number;
+        /**
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
+         */
+        "invalid": boolean;
         /**
           * The input's label. Alternatively, you can use the label slot.
          */
@@ -2033,25 +1923,17 @@ export namespace Components {
          */
         "readonly": boolean;
         /**
-          * Checks for validity and shows the browser's validation message if the control is invalid.
-         */
-        "reportValidity": () => Promise<boolean | undefined>;
-        /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required": boolean;
-        /**
-          * Resets the formcontrol
-         */
-        "reset": () => Promise<void>;
         /**
           * Define the separator to be shown between the time unit pickers. Please be aware that this property will modify the displayed separator only. The separator for a timestring is always expected to be a colon (eg. '13:52:20')
          */
         "separator": string;
         /**
-          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
+          * Sets focus on the datepickers input.
          */
-        "setCustomValidity": (message: string) => Promise<void>;
+        "setFocus": (options?: FocusOptions) => Promise<void>;
         /**
           * Timepicker size.
          */
@@ -2160,10 +2042,6 @@ export interface SixFileUploadCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixFileUploadElement;
 }
-export interface SixFormCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLSixFormElement;
-}
 export interface SixHeaderCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixHeaderElement;
@@ -2192,10 +2070,6 @@ export interface SixRangeCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixRangeElement;
 }
-export interface SixRootCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLSixRootElement;
-}
 export interface SixSearchFieldCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSixSearchFieldElement;
@@ -2241,18 +2115,26 @@ export interface SixTooltipCustomEvent<T> extends CustomEvent<T> {
     target: HTMLSixTooltipElement;
 }
 declare global {
-    interface HTMLSetAttributesElement extends Components.SetAttributes, HTMLStencilElement {
+    interface HTMLSixAlertElementEventMap {
+        "six-alert-show": EmptyPayload;
+        "six-alert-after-show": EmptyPayload;
+        "six-alert-hide": EmptyPayload;
+        "six-alert-after-hide": EmptyPayload;
     }
-    var HTMLSetAttributesElement: {
-        prototype: HTMLSetAttributesElement;
-        new (): HTMLSetAttributesElement;
-    };
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixAlertElement extends Components.SixAlert, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixAlertElementEventMap>(type: K, listener: (this: HTMLSixAlertElement, ev: SixAlertCustomEvent<HTMLSixAlertElementEventMap[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 HTMLSixAlertElementEventMap>(type: K, listener: (this: HTMLSixAlertElement, ev: SixAlertCustomEvent<HTMLSixAlertElementEventMap[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 HTMLSixAlertElement: {
         prototype: HTMLSixAlertElement;
@@ -2280,12 +2162,24 @@ declare global {
         prototype: HTMLSixBadgeElement;
         new (): HTMLSixBadgeElement;
     };
+    interface HTMLSixButtonElementEventMap {
+        "six-button-blur": EmptyPayload;
+        "six-button-focus": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixButtonElement extends Components.SixButton, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixButtonElementEventMap>(type: K, listener: (this: HTMLSixButtonElement, ev: SixButtonCustomEvent<HTMLSixButtonElementEventMap[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 HTMLSixButtonElementEventMap>(type: K, listener: (this: HTMLSixButtonElement, ev: SixButtonCustomEvent<HTMLSixButtonElementEventMap[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 HTMLSixButtonElement: {
         prototype: HTMLSixButtonElement;
@@ -2301,71 +2195,170 @@ declare global {
         prototype: HTMLSixCardElement;
         new (): HTMLSixCardElement;
     };
+    interface HTMLSixCheckboxElementEventMap {
+        "six-checkbox-blur": EmptyPayload;
+        "six-checkbox-change": EmptyPayload;
+        "six-checkbox-focus": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixCheckboxElement extends Components.SixCheckbox, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixCheckboxElementEventMap>(type: K, listener: (this: HTMLSixCheckboxElement, ev: SixCheckboxCustomEvent<HTMLSixCheckboxElementEventMap[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 HTMLSixCheckboxElementEventMap>(type: K, listener: (this: HTMLSixCheckboxElement, ev: SixCheckboxCustomEvent<HTMLSixCheckboxElementEventMap[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 HTMLSixCheckboxElement: {
         prototype: HTMLSixCheckboxElement;
         new (): HTMLSixCheckboxElement;
     };
+    interface HTMLSixDatepickerElementEventMap {
+        "six-datepicker-select": SixDatepickerSelectPayload;
+        "six-datepicker-clear": EmptyPayload;
+        "six-datepicker-blur": SixDatepickerSelectPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      */
     interface HTMLSixDatepickerElement extends Components.SixDatepicker, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixDatepickerElementEventMap>(type: K, listener: (this: HTMLSixDatepickerElement, ev: SixDatepickerCustomEvent<HTMLSixDatepickerElementEventMap[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 HTMLSixDatepickerElementEventMap>(type: K, listener: (this: HTMLSixDatepickerElement, ev: SixDatepickerCustomEvent<HTMLSixDatepickerElementEventMap[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 HTMLSixDatepickerElement: {
         prototype: HTMLSixDatepickerElement;
         new (): HTMLSixDatepickerElement;
     };
+    interface HTMLSixDetailsElementEventMap {
+        "six-details-show": EmptyPayload;
+        "six-details-after-show": EmptyPayload;
+        "six-details-hide": EmptyPayload;
+        "six-details-after-hide": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixDetailsElement extends Components.SixDetails, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixDetailsElementEventMap>(type: K, listener: (this: HTMLSixDetailsElement, ev: SixDetailsCustomEvent<HTMLSixDetailsElementEventMap[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 HTMLSixDetailsElementEventMap>(type: K, listener: (this: HTMLSixDetailsElement, ev: SixDetailsCustomEvent<HTMLSixDetailsElementEventMap[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 HTMLSixDetailsElement: {
         prototype: HTMLSixDetailsElement;
         new (): HTMLSixDetailsElement;
     };
+    interface HTMLSixDialogElementEventMap {
+        "six-dialog-show": EmptyPayload;
+        "six-dialog-after-show": EmptyPayload;
+        "six-dialog-hide": EmptyPayload;
+        "six-dialog-after-hide": EmptyPayload;
+        "six-dialog-initial-focus": EmptyPayload;
+        "six-dialog-overlay-dismiss": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixDialogElement extends Components.SixDialog, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixDialogElementEventMap>(type: K, listener: (this: HTMLSixDialogElement, ev: SixDialogCustomEvent<HTMLSixDialogElementEventMap[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 HTMLSixDialogElementEventMap>(type: K, listener: (this: HTMLSixDialogElement, ev: SixDialogCustomEvent<HTMLSixDialogElementEventMap[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 HTMLSixDialogElement: {
         prototype: HTMLSixDialogElement;
         new (): HTMLSixDialogElement;
     };
+    interface HTMLSixDrawerElementEventMap {
+        "six-drawer-show": EmptyPayload;
+        "six-drawer-after-show": EmptyPayload;
+        "six-drawer-hide": EmptyPayload;
+        "six-drawer-after-hide": EmptyPayload;
+        "six-drawer-initial-focus": EmptyPayload;
+        "six-drawer-overlay-dismiss": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixDrawerElement extends Components.SixDrawer, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixDrawerElementEventMap>(type: K, listener: (this: HTMLSixDrawerElement, ev: SixDrawerCustomEvent<HTMLSixDrawerElementEventMap[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 HTMLSixDrawerElementEventMap>(type: K, listener: (this: HTMLSixDrawerElement, ev: SixDrawerCustomEvent<HTMLSixDrawerElementEventMap[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 HTMLSixDrawerElement: {
         prototype: HTMLSixDrawerElement;
         new (): HTMLSixDrawerElement;
     };
+    interface HTMLSixDropdownElementEventMap {
+        "six-dropdown-show": EmptyPayload;
+        "six-dropdown-after-show": EmptyPayload;
+        "six-dropdown-hide": EmptyPayload;
+        "six-dropdown-after-hide": EmptyPayload;
+        "six-dropdown-auto-filter-fired": SixDropdownAutoFilterPayload;
+        "six-async-filter-fired": SixDropdownAsyncFilterPayload;
+        "six-dropdown-scroll": SixDropdownScrollPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixDropdownElement extends Components.SixDropdown, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixDropdownElementEventMap>(type: K, listener: (this: HTMLSixDropdownElement, ev: SixDropdownCustomEvent<HTMLSixDropdownElementEventMap[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 HTMLSixDropdownElementEventMap>(type: K, listener: (this: HTMLSixDropdownElement, ev: SixDropdownCustomEvent<HTMLSixDropdownElementEventMap[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 HTMLSixDropdownElement: {
         prototype: HTMLSixDropdownElement;
         new (): HTMLSixDropdownElement;
     };
+    /**
+     * @since 4.0
+     * @status beta
+     */
+    interface HTMLSixErrorElement extends Components.SixError, HTMLStencilElement {
+    }
+    var HTMLSixErrorElement: {
+        prototype: HTMLSixErrorElement;
+        new (): HTMLSixErrorElement;
+    };
     interface HTMLSixErrorPageElement extends Components.SixErrorPage, HTMLStencilElement {
     }
     var HTMLSixErrorPageElement: {
@@ -2382,21 +2375,45 @@ declare global {
         prototype: HTMLSixFileListElement;
         new (): HTMLSixFileListElement;
     };
+    interface HTMLSixFileListItemElementEventMap {
+        "six-file-list-item-download": SixFileListDownloadPayload;
+        "six-file-list-item-remove": SixFileListRemovePayload;
+    }
     /**
      * @since 2.0.0
      * @status experimental
      */
     interface HTMLSixFileListItemElement extends Components.SixFileListItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixFileListItemElementEventMap>(type: K, listener: (this: HTMLSixFileListItemElement, ev: SixFileListItemCustomEvent<HTMLSixFileListItemElementEventMap[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 HTMLSixFileListItemElementEventMap>(type: K, listener: (this: HTMLSixFileListItemElement, ev: SixFileListItemCustomEvent<HTMLSixFileListItemElementEventMap[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 HTMLSixFileListItemElement: {
         prototype: HTMLSixFileListItemElement;
         new (): HTMLSixFileListItemElement;
     };
+    interface HTMLSixFileUploadElementEventMap {
+        "six-file-upload-success": SixFileUploadSuccessPayload;
+        "six-file-upload-failure": SixFileUploadFailurePayload;
+    }
     /**
      * @since 2.0.0
      * @status experimental
      */
     interface HTMLSixFileUploadElement extends Components.SixFileUpload, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixFileUploadElementEventMap>(type: K, listener: (this: HTMLSixFileUploadElement, ev: SixFileUploadCustomEvent<HTMLSixFileUploadElementEventMap[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 HTMLSixFileUploadElementEventMap>(type: K, listener: (this: HTMLSixFileUploadElement, ev: SixFileUploadCustomEvent<HTMLSixFileUploadElementEventMap[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 HTMLSixFileUploadElement: {
         prototype: HTMLSixFileUploadElement;
@@ -2412,17 +2429,6 @@ declare global {
         prototype: HTMLSixFooterElement;
         new (): HTMLSixFooterElement;
     };
-    /**
-     * @since 1.0
-     * @status stable
-     * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
-     */
-    interface HTMLSixFormElement extends Components.SixForm, HTMLStencilElement {
-    }
-    var HTMLSixFormElement: {
-        prototype: HTMLSixFormElement;
-        new (): HTMLSixFormElement;
-    };
     /**
      * @since 1.1
      * @status stable
@@ -2433,11 +2439,27 @@ 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;
@@ -2464,28 +2486,66 @@ declare global {
         prototype: HTMLSixIconButtonElement;
         new (): HTMLSixIconButtonElement;
     };
+    interface HTMLSixInputElementEventMap {
+        "six-input-change": EmptyPayload;
+        "six-input-clear": EmptyPayload;
+        "six-input-input": EmptyPayload;
+        "six-input-focus": EmptyPayload;
+        "six-input-blur": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixInputElement extends Components.SixInput, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixInputElementEventMap>(type: K, listener: (this: HTMLSixInputElement, ev: SixInputCustomEvent<HTMLSixInputElementEventMap[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 HTMLSixInputElementEventMap>(type: K, listener: (this: HTMLSixInputElement, ev: SixInputCustomEvent<HTMLSixInputElementEventMap[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 HTMLSixInputElement: {
         prototype: HTMLSixInputElement;
         new (): HTMLSixInputElement;
     };
+    interface HTMLSixItemPickerElementEventMap {
+        "six-item-picker-change": SixItemPickerChangePayload;
+        "six-item-picker-change-debounced": SixItemPickerChangePayload;
+    }
     /**
      * @since 2.0.0
      * @status experimental
      */
     interface HTMLSixItemPickerElement extends Components.SixItemPicker, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixItemPickerElementEventMap>(type: K, listener: (this: HTMLSixItemPickerElement, ev: SixItemPickerCustomEvent<HTMLSixItemPickerElementEventMap[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 HTMLSixItemPickerElementEventMap>(type: K, listener: (this: HTMLSixItemPickerElement, ev: SixItemPickerCustomEvent<HTMLSixItemPickerElementEventMap[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 HTMLSixItemPickerElement: {
         prototype: HTMLSixItemPickerElement;
         new (): HTMLSixItemPickerElement;
     };
+    interface HTMLSixLanguageSwitcherElementEventMap {
+        "six-language-switcher-change": SixLanguageSwitcherChangePayload;
+    }
     interface HTMLSixLanguageSwitcherElement extends Components.SixLanguageSwitcher, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixLanguageSwitcherElementEventMap>(type: K, listener: (this: HTMLSixLanguageSwitcherElement, ev: SixLanguageSwitcherCustomEvent<HTMLSixLanguageSwitcherElementEventMap[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 HTMLSixLanguageSwitcherElementEventMap>(type: K, listener: (this: HTMLSixLanguageSwitcherElement, ev: SixLanguageSwitcherCustomEvent<HTMLSixLanguageSwitcherElementEventMap[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 HTMLSixLanguageSwitcherElement: {
         prototype: HTMLSixLanguageSwitcherElement;
@@ -2511,12 +2571,23 @@ declare global {
         prototype: HTMLSixMainContainerElement;
         new (): HTMLSixMainContainerElement;
     };
+    interface HTMLSixMenuElementEventMap {
+        "six-menu-item-selected": SixMenuItemSelectedPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixMenuElement extends Components.SixMenu, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixMenuElementEventMap>(type: K, listener: (this: HTMLSixMenuElement, ev: SixMenuCustomEvent<HTMLSixMenuElementEventMap[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 HTMLSixMenuElementEventMap>(type: K, listener: (this: HTMLSixMenuElement, ev: SixMenuCustomEvent<HTMLSixMenuElementEventMap[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 HTMLSixMenuElement: {
         prototype: HTMLSixMenuElement;
@@ -2587,23 +2658,49 @@ declare global {
         prototype: HTMLSixProgressRingElement;
         new (): HTMLSixProgressRingElement;
     };
+    interface HTMLSixRadioElementEventMap {
+        "six-radio-blur": EmptyPayload;
+        "six-radio-change": EmptyPayload;
+        "six-radio-focus": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixRadioElement extends Components.SixRadio, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixRadioElementEventMap>(type: K, listener: (this: HTMLSixRadioElement, ev: SixRadioCustomEvent<HTMLSixRadioElementEventMap[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 HTMLSixRadioElementEventMap>(type: K, listener: (this: HTMLSixRadioElement, ev: SixRadioCustomEvent<HTMLSixRadioElementEventMap[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 HTMLSixRadioElement: {
         prototype: HTMLSixRadioElement;
         new (): HTMLSixRadioElement;
     };
+    interface HTMLSixRangeElementEventMap {
+        "six-range-change": EmptyPayload;
+        "six-range-blur": EmptyPayload;
+        "six-range-focus": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixRangeElement extends Components.SixRange, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixRangeElementEventMap>(type: K, listener: (this: HTMLSixRangeElement, ev: SixRangeCustomEvent<HTMLSixRangeElementEventMap[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 HTMLSixRangeElementEventMap>(type: K, listener: (this: HTMLSixRangeElement, ev: SixRangeCustomEvent<HTMLSixRangeElementEventMap[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 HTMLSixRangeElement: {
         prototype: HTMLSixRangeElement;
@@ -2619,32 +2716,71 @@ declare global {
         prototype: HTMLSixRootElement;
         new (): HTMLSixRootElement;
     };
+    interface HTMLSixSearchFieldElementEventMap {
+        "six-search-field-change": SixSearchFieldChangePayload;
+    }
     /**
      * @since 1.0
      * @status stable
      */
     interface HTMLSixSearchFieldElement extends Components.SixSearchField, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixSearchFieldElementEventMap>(type: K, listener: (this: HTMLSixSearchFieldElement, ev: SixSearchFieldCustomEvent<HTMLSixSearchFieldElementEventMap[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 HTMLSixSearchFieldElementEventMap>(type: K, listener: (this: HTMLSixSearchFieldElement, ev: SixSearchFieldCustomEvent<HTMLSixSearchFieldElementEventMap[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 HTMLSixSearchFieldElement: {
         prototype: HTMLSixSearchFieldElement;
         new (): HTMLSixSearchFieldElement;
     };
+    interface HTMLSixSelectElementEventMap {
+        "six-select-change": SixSelectChangePayload;
+        "six-select-focus": EmptyPayload;
+        "six-select-blur": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixSelectElement extends Components.SixSelect, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixSelectElementEventMap>(type: K, listener: (this: HTMLSixSelectElement, ev: SixSelectCustomEvent<HTMLSixSelectElementEventMap[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 HTMLSixSelectElementEventMap>(type: K, listener: (this: HTMLSixSelectElement, ev: SixSelectCustomEvent<HTMLSixSelectElementEventMap[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 HTMLSixSelectElement: {
         prototype: HTMLSixSelectElement;
         new (): HTMLSixSelectElement;
     };
+    interface HTMLSixSidebarElementEventMap {
+        "six-sidebar-show": EmptyPayload;
+        "six-sidebar-after-show": EmptyPayload;
+        "six-sidebar-hide": EmptyPayload;
+        "six-sidebar-after-hide": EmptyPayload;
+        "six-sidebar-initial-focus": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      */
     interface HTMLSixSidebarElement extends Components.SixSidebar, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixSidebarElementEventMap>(type: K, listener: (this: HTMLSixSidebarElement, ev: SixSidebarCustomEvent<HTMLSixSidebarElementEventMap[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 HTMLSixSidebarElementEventMap>(type: K, listener: (this: HTMLSixSidebarElement, ev: SixSidebarCustomEvent<HTMLSixSidebarElementEventMap[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 HTMLSixSidebarElement: {
         prototype: HTMLSixSidebarElement;
@@ -2687,34 +2823,70 @@ declare global {
         prototype: HTMLSixStageIndicatorElement;
         new (): HTMLSixStageIndicatorElement;
     };
+    interface HTMLSixSwitchElementEventMap {
+        "six-switch-blur": boolean;
+        "six-switch-change": boolean;
+        "six-switch-focus": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixSwitchElement extends Components.SixSwitch, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixSwitchElementEventMap>(type: K, listener: (this: HTMLSixSwitchElement, ev: SixSwitchCustomEvent<HTMLSixSwitchElementEventMap[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 HTMLSixSwitchElementEventMap>(type: K, listener: (this: HTMLSixSwitchElement, ev: SixSwitchCustomEvent<HTMLSixSwitchElementEventMap[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 HTMLSixSwitchElement: {
         prototype: HTMLSixSwitchElement;
         new (): HTMLSixSwitchElement;
     };
+    interface HTMLSixTabElementEventMap {
+        "six-tab-close": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixTabElement extends Components.SixTab, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixTabElementEventMap>(type: K, listener: (this: HTMLSixTabElement, ev: SixTabCustomEvent<HTMLSixTabElementEventMap[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 HTMLSixTabElementEventMap>(type: K, listener: (this: HTMLSixTabElement, ev: SixTabCustomEvent<HTMLSixTabElementEventMap[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 HTMLSixTabElement: {
         prototype: HTMLSixTabElement;
         new (): HTMLSixTabElement;
     };
+    interface HTMLSixTabGroupElementEventMap {
+        "six-tab-show": SixTabShowPayload;
+        "six-tab-hide": SixTabHidePayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixTabGroupElement extends Components.SixTabGroup, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixTabGroupElementEventMap>(type: K, listener: (this: HTMLSixTabGroupElement, ev: SixTabGroupCustomEvent<HTMLSixTabGroupElementEventMap[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 HTMLSixTabGroupElementEventMap>(type: K, listener: (this: HTMLSixTabGroupElement, ev: SixTabGroupCustomEvent<HTMLSixTabGroupElementEventMap[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 HTMLSixTabGroupElement: {
         prototype: HTMLSixTabGroupElement;
@@ -2731,61 +2903,124 @@ declare global {
         prototype: HTMLSixTabPanelElement;
         new (): HTMLSixTabPanelElement;
     };
+    interface HTMLSixTagElementEventMap {
+        "six-tag-clear": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixTagElement extends Components.SixTag, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixTagElementEventMap>(type: K, listener: (this: HTMLSixTagElement, ev: SixTagCustomEvent<HTMLSixTagElementEventMap[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 HTMLSixTagElementEventMap>(type: K, listener: (this: HTMLSixTagElement, ev: SixTagCustomEvent<HTMLSixTagElementEventMap[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 HTMLSixTagElement: {
         prototype: HTMLSixTagElement;
         new (): HTMLSixTagElement;
     };
+    interface HTMLSixTextareaElementEventMap {
+        "six-textarea-change": EmptyPayload;
+        "six-textarea-input": EmptyPayload;
+        "six-textarea-focus": EmptyPayload;
+        "six-textarea-blur": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixTextareaElement extends Components.SixTextarea, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixTextareaElementEventMap>(type: K, listener: (this: HTMLSixTextareaElement, ev: SixTextareaCustomEvent<HTMLSixTextareaElementEventMap[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 HTMLSixTextareaElementEventMap>(type: K, listener: (this: HTMLSixTextareaElement, ev: SixTextareaCustomEvent<HTMLSixTextareaElementEventMap[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 HTMLSixTextareaElement: {
         prototype: HTMLSixTextareaElement;
         new (): HTMLSixTextareaElement;
     };
+    interface HTMLSixTileElementEventMap {
+        "six-tile-closed": EmptyPayload;
+        "six-tile-selected": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      */
     interface HTMLSixTileElement extends Components.SixTile, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixTileElementEventMap>(type: K, listener: (this: HTMLSixTileElement, ev: SixTileCustomEvent<HTMLSixTileElementEventMap[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 HTMLSixTileElementEventMap>(type: K, listener: (this: HTMLSixTileElement, ev: SixTileCustomEvent<HTMLSixTileElementEventMap[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 HTMLSixTileElement: {
         prototype: HTMLSixTileElement;
         new (): HTMLSixTileElement;
     };
+    interface HTMLSixTimepickerElementEventMap {
+        "six-timepicker-change": SixTimepickerChange;
+        "six-timepicker-change-debounced": SixTimepickerChange;
+        "six-timepicker-clear": EmptyPayload;
+    }
     /**
      * @since 2.0.0
      * @status experimental
      */
     interface HTMLSixTimepickerElement extends Components.SixTimepicker, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixTimepickerElementEventMap>(type: K, listener: (this: HTMLSixTimepickerElement, ev: SixTimepickerCustomEvent<HTMLSixTimepickerElementEventMap[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 HTMLSixTimepickerElementEventMap>(type: K, listener: (this: HTMLSixTimepickerElement, ev: SixTimepickerCustomEvent<HTMLSixTimepickerElementEventMap[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 HTMLSixTimepickerElement: {
         prototype: HTMLSixTimepickerElement;
         new (): HTMLSixTimepickerElement;
     };
+    interface HTMLSixTooltipElementEventMap {
+        "six-tooltip-show": EmptyPayload;
+        "six-tooltip-after-show": EmptyPayload;
+        "six-tooltip-hide": EmptyPayload;
+        "six-tooltip-after-hide": EmptyPayload;
+    }
     /**
      * @since 1.0
      * @status stable
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface HTMLSixTooltipElement extends Components.SixTooltip, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSixTooltipElementEventMap>(type: K, listener: (this: HTMLSixTooltipElement, ev: SixTooltipCustomEvent<HTMLSixTooltipElementEventMap[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 HTMLSixTooltipElementEventMap>(type: K, listener: (this: HTMLSixTooltipElement, ev: SixTooltipCustomEvent<HTMLSixTooltipElementEventMap[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 HTMLSixTooltipElement: {
         prototype: HTMLSixTooltipElement;
         new (): HTMLSixTooltipElement;
     };
     interface HTMLElementTagNameMap {
-        "set-attributes": HTMLSetAttributesElement;
         "six-alert": HTMLSixAlertElement;
         "six-avatar": HTMLSixAvatarElement;
         "six-badge": HTMLSixBadgeElement;
@@ -2797,12 +3032,12 @@ declare global {
         "six-dialog": HTMLSixDialogElement;
         "six-drawer": HTMLSixDrawerElement;
         "six-dropdown": HTMLSixDropdownElement;
+        "six-error": HTMLSixErrorElement;
         "six-error-page": HTMLSixErrorPageElement;
         "six-file-list": HTMLSixFileListElement;
         "six-file-list-item": HTMLSixFileListItemElement;
         "six-file-upload": HTMLSixFileUploadElement;
         "six-footer": HTMLSixFooterElement;
-        "six-form": HTMLSixFormElement;
         "six-group-label": HTMLSixGroupLabelElement;
         "six-header": HTMLSixHeaderElement;
         "six-icon": HTMLSixIconElement;
@@ -2841,12 +3076,6 @@ declare global {
     }
 }
 declare namespace LocalJSX {
-    interface SetAttributes {
-        /**
-          * Attributes map
-         */
-        "value"?: {};
-    }
     /**
      * @since 1.0
      * @status stable
@@ -2858,7 +3087,7 @@ declare namespace LocalJSX {
          */
         "closable"?: boolean;
         /**
-          * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the alert before it closes (e.g. moves the mouse over it), the timer will restart.
+          * The length of time, in milliseconds, the alert will show before closing itself. If the user hovers over the toast alert, the timer will pause. On leaving the element with the mouse, the timer resets.
          */
         "duration"?: number;
         /**
@@ -2884,7 +3113,7 @@ declare namespace LocalJSX {
         /**
           * The type of alert.
          */
-        "type"?: 'primary' | 'success' | 'info' | 'warning' | 'danger';
+        "type"?: AlertType;
     }
     /**
      * @since 1.0
@@ -3020,23 +3249,23 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur"?: boolean;
+        "errorText"?: string | string[];
         /**
-          * The checkbox's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText"?: string;
+        "errorTextCount"?: number;
         /**
           * Set to true to draw the checkbox in an indeterminate state.
          */
         "indeterminate"?: boolean;
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid"?: boolean;
         /**
-          * The checkbox label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label"?: string;
         /**
@@ -3056,7 +3285,7 @@ declare namespace LocalJSX {
          */
         "onSix-checkbox-focus"?: (event: SixCheckboxCustomEvent<EmptyPayload>) => void;
         /**
-          * Set to true to make the checkbox a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -3102,13 +3331,13 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur"?: boolean;
+        "errorText"?: string | string[];
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText"?: string;
+        "errorTextCount"?: number;
         /**
           * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
          */
@@ -3122,13 +3351,17 @@ declare namespace LocalJSX {
          */
         "inline"?: boolean;
         /**
-          * The input's label. Alternatively, you can use the label slot.
+          * 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.
          */
-        "locale"?: 'en' | 'de' | 'fr' | 'it';
+        "locale"?: 'en' | 'de' | 'fr' | 'it' | 'es';
         /**
           * The maximum datetime allowed. Value must be a date object
          */
@@ -3170,7 +3403,7 @@ declare namespace LocalJSX {
          */
         "readonly"?: boolean;
         /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -3388,6 +3621,10 @@ declare namespace LocalJSX {
           * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
          */
         "hoist"?: boolean;
+        /**
+          * Determines if the dropdown panel's width should match the width of the trigger element.  If set to `true`, the panel will resize its width to align with the trigger's width. If `false` or omitted, the panel will maintain its default width.
+         */
+        "matchTriggerWidth"?: boolean;
         /**
           * Emitted when the async filter is triggered
          */
@@ -3448,6 +3685,12 @@ declare namespace LocalJSX {
          */
         "virtualScroll"?: boolean;
     }
+    /**
+     * @since 4.0
+     * @status beta
+     */
+    interface SixError {
+    }
     interface SixErrorPage {
         /**
           * Defines a custom description.
@@ -3558,29 +3801,6 @@ declare namespace LocalJSX {
      */
     interface SixFooter {
     }
-    /**
-     * @since 1.0
-     * @status stable
-     * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
-     */
-    interface SixForm {
-        /**
-          * Prevent the form from validating inputs before submitting.
-         */
-        "novalidate"?: boolean;
-        /**
-          * Emitted when the control's value changes.
-         */
-        "onSix-form-change"?: (event: SixFormCustomEvent<SixFormChangePayload>) => void;
-        /**
-          * Emitted when the forms values are reset.
-         */
-        "onSix-form-reset"?: (event: SixFormCustomEvent<EmptyPayload>) => void;
-        /**
-          * Emitted when the form is submitted. This event will not be emitted if any form control inside of it is in an invalid state, unless the form has the `novalidate` attribute. Note that there is never a need to prevent this event, since it doen't send a GET or POST request like native forms. To "prevent" submission, use a conditional around the XHR request you use to submit the form's data with.
-         */
-        "onSix-form-submit"?: (event: SixFormCustomEvent<SixFormSubmitPayload>) => void;
-    }
     /**
      * @since 1.1
      * @status stable
@@ -3599,7 +3819,7 @@ declare namespace LocalJSX {
          */
         "label"?: string;
         /**
-          * The label's required attribute.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -3616,6 +3836,10 @@ declare namespace LocalJSX {
           * Set whether the logo should be clickable
          */
         "clickableLogo"?: boolean;
+        /**
+          * Set whether the hamburger menu should be visible or not
+         */
+        "hideHamburgerMenu"?: boolean;
         /**
           * Emitted when the name of the selected app is clicked.
          */
@@ -3732,13 +3956,17 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * Internal: Styles the input for the dropdown filter search.
          */
-        "errorOnBlur"?: boolean;
+        "dropdownSearch"?: boolean;
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorText"?: string;
+        "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.
          */
@@ -3748,11 +3976,11 @@ declare namespace LocalJSX {
          */
         "inputmode"?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by props such as `type`, `required`, `minlength`, `maxlength`, and `pattern` using the browser's constraint validation API.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid"?: boolean;
         /**
-          * The input's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label"?: string;
         /**
@@ -3816,7 +4044,7 @@ declare namespace LocalJSX {
          */
         "readonly"?: boolean;
         /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -3954,6 +4182,10 @@ declare namespace LocalJSX {
      * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
      */
     interface SixMenu {
+        /**
+          * Internal: Disables handling of key presses.
+         */
+        "disableKeyboardHandling"?: boolean;
         /**
           * Used for virtual scrolling Define how many items should be rendered in the DOM when using virtual scrolling
          */
@@ -3997,7 +4229,11 @@ declare namespace LocalJSX {
      */
     interface SixMenuItem {
         /**
-          * Set to true to draw the item in a checked state.
+          * Defines if the checked state is displayed as a checkbox or a check-icon
+         */
+        "checkType"?: 'checkbox' | 'check';
+        /**
+          * Internal: Draws the item in a checked state. CheckType needs to be set to 'checkbox' or 'check' to show the checked state
          */
         "checked"?: boolean;
         /**
@@ -4075,7 +4311,7 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid"?: boolean;
         /**
@@ -4110,23 +4346,23 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur"?: boolean;
+        "errorText"?: string | string[];
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText"?: string;
+        "errorTextCount"?: number;
         /**
           * The range's help text. Alternatively, you can use the help-text slot.
          */
         "helpText"?: string;
         /**
-          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid"?: boolean;
         /**
-          * The range's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label"?: string;
         /**
@@ -4154,7 +4390,7 @@ declare namespace LocalJSX {
          */
         "onSix-range-focus"?: (event: SixRangeCustomEvent<EmptyPayload>) => void;
         /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -4179,14 +4415,6 @@ declare namespace LocalJSX {
      * @status stable
      */
     interface SixRoot {
-        /**
-          * Breakpoint for smaller screens when the right sidebar is collapsed by default.
-         */
-        "breakpoint"?: number;
-        /**
-          * Emitted when display size is updated.
-         */
-        "onSix-root-collapsed"?: (event: SixRootCustomEvent<SixRootCollapsedPayload>) => void;
         /**
           * Defines whether the content section should be padded
          */
@@ -4248,22 +4476,18 @@ declare namespace LocalJSX {
           * Set to true to add a clear button when the select is populated.
          */
         "clearable"?: boolean;
-        /**
-          * The default value the select will be reverted to when reset is executed
-         */
-        "defaultValue"?: string | string[];
         /**
           * Set to true to disable the select control.
          */
         "disabled"?: boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur"?: boolean;
+        "errorText"?: string | string[];
         /**
-          * The select's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText"?: string;
+        "errorTextCount"?: number;
         /**
           * Set to true to allow filtering for entries in the dropdown
          */
@@ -4289,11 +4513,11 @@ declare namespace LocalJSX {
          */
         "inputDebounce"?: number;
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid"?: boolean;
         /**
-          * The select's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label"?: string;
         /**
@@ -4302,6 +4526,7 @@ declare namespace LocalJSX {
         "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;
         /**
@@ -4337,9 +4562,17 @@ declare namespace LocalJSX {
          */
         "placeholder"?: string;
         /**
-          * The select's required attribute.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
+        /**
+          * Enables the select all button.
+         */
+        "selectAllButton"?: boolean;
+        /**
+          * Custom text for the "select all" button. Defaults to "Select all" and equivalents in supported languages.
+         */
+        "selectAllText"?: string;
         /**
           * The select's size.
          */
@@ -4404,6 +4637,10 @@ declare namespace LocalJSX {
           * Set to true to draw the sidebar item in a disabled state.
          */
         "disabled"?: boolean;
+        /**
+          * 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;
         /**
           * Set to true to draw the item in a selected state.
          */
@@ -4418,6 +4655,10 @@ declare namespace LocalJSX {
      * @status stable
      */
     interface SixSidebarItemGroup {
+        /**
+          * 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 group
          */
@@ -4471,9 +4712,21 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
+          * 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;
+        /**
+          * 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 switch's name attribute.
          */
@@ -4491,7 +4744,7 @@ declare namespace LocalJSX {
          */
         "onSix-switch-focus"?: (event: SixSwitchCustomEvent<EmptyPayload>) => void;
         /**
-          * Set to true to make the switch a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -4618,13 +4871,13 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The error message shown, if `invalid` is set to true.
          */
-        "errorOnBlur"?: boolean;
+        "errorText"?: string | string[];
         /**
-          * The textarea's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText"?: string;
+        "errorTextCount"?: number;
         /**
           * The textarea's help text. Alternatively, you can use the help-text slot.
          */
@@ -4634,11 +4887,11 @@ declare namespace LocalJSX {
          */
         "inputmode"?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
         /**
-          * This will be true when the control is in an invalid state. Validity is determined by props such as `required`, `minlength`, and `maxlength` using the browser's constraint validation API.
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
          */
         "invalid"?: boolean;
         /**
-          * The textarea's label. Alternatively, you can use the label slot.
+          * The label text.
          */
         "label"?: string;
         /**
@@ -4678,7 +4931,7 @@ declare namespace LocalJSX {
          */
         "readonly"?: boolean;
         /**
-          * The textarea's required attribute.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -4766,13 +5019,13 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Set to display the error text on blur and not when typing
+          * The input's error text. Alternatively, you can use the error-text slot.
          */
-        "errorOnBlur"?: boolean;
+        "errorText"?: string | string[];
         /**
-          * The input's error text. Alternatively, you can use the error-text slot.
+          * The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1
          */
-        "errorText"?: string;
+        "errorTextCount"?: number;
         /**
           * Define the time format. Valid formats are:  HH:mm:ss hh:mm:ss:aa HH:mm:ss:ms hh:mm:ss:ms:aa HH:mm hh:mm:aa HH hh:aa mm ss ms  where HH is the 24 hour format and hh is the 12 hour format  Please notice that when using the 12-hour-clock (hh) you always need a period indicator (aa). So the time can be parsed as either am or pm
          */
@@ -4793,6 +5046,10 @@ declare namespace LocalJSX {
           * Set the amount of time, in milliseconds, to wait between switching to next timeunit (e.g. next hour) when mouse button is held pressed.
          */
         "interval"?: number;
+        /**
+          * If this property is set to true and an error message is provided by `errorText`, the error message is displayed.
+         */
+        "invalid"?: boolean;
         /**
           * The input's label. Alternatively, you can use the label slot.
          */
@@ -4830,7 +5087,7 @@ declare namespace LocalJSX {
          */
         "readonly"?: boolean;
         /**
-          * Set to true to make the input a required field.
+          * Set to true to show an asterisk beneath the label.
          */
         "required"?: boolean;
         /**
@@ -4913,7 +5170,6 @@ declare namespace LocalJSX {
         "trigger"?: string;
     }
     interface IntrinsicElements {
-        "set-attributes": SetAttributes;
         "six-alert": SixAlert;
         "six-avatar": SixAvatar;
         "six-badge": SixBadge;
@@ -4925,12 +5181,12 @@ declare namespace LocalJSX {
         "six-dialog": SixDialog;
         "six-drawer": SixDrawer;
         "six-dropdown": SixDropdown;
+        "six-error": SixError;
         "six-error-page": SixErrorPage;
         "six-file-list": SixFileList;
         "six-file-list-item": SixFileListItem;
         "six-file-upload": SixFileUpload;
         "six-footer": SixFooter;
-        "six-form": SixForm;
         "six-group-label": SixGroupLabel;
         "six-header": SixHeader;
         "six-icon": SixIcon;
@@ -4972,7 +5228,6 @@ export { LocalJSX as JSX };
 declare module "@stencil/core" {
     export namespace JSX {
         interface IntrinsicElements {
-            "set-attributes": LocalJSX.SetAttributes & JSXBase.HTMLAttributes<HTMLSetAttributesElement>;
             /**
              * @since 1.0
              * @status stable
@@ -5037,6 +5292,11 @@ declare module "@stencil/core" {
              * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
              */
             "six-dropdown": LocalJSX.SixDropdown & JSXBase.HTMLAttributes<HTMLSixDropdownElement>;
+            /**
+             * @since 4.0
+             * @status beta
+             */
+            "six-error": LocalJSX.SixError & JSXBase.HTMLAttributes<HTMLSixErrorElement>;
             "six-error-page": LocalJSX.SixErrorPage & JSXBase.HTMLAttributes<HTMLSixErrorPageElement>;
             /**
              * @since 2.0.0
@@ -5058,12 +5318,6 @@ declare module "@stencil/core" {
              * @status stable
              */
             "six-footer": LocalJSX.SixFooter & JSXBase.HTMLAttributes<HTMLSixFooterElement>;
-            /**
-             * @since 1.0
-             * @status stable
-             * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
-             */
-            "six-form": LocalJSX.SixForm & JSXBase.HTMLAttributes<HTMLSixFormElement>;
             /**
              * @since 1.1
              * @status stable