@duetds/components 5.1.8 → 5.2.1

package/lib/types/components.d.ts

@@ -58,37 +58,45 @@ import { StatusMessage as StatusMessage1 } from "./components/duet-upload-aria-s
 export namespace Components {
     interface DuetActionButton {
         /**
-          * Name of id of action that was called being called
+          * Used to indicate which dom element with ID this element controls
          */
-        "actionId": string;
+        "accessibleControls": string;
         /**
-          * Name of id of action that was called being called
+          * Described By id
          */
-        "actionMeta": Record<any, any> | string;
+        "accessibleDescribedBy": string;
         /**
-          * Name of action being called
+          * Aria description the button
          */
-        "actionName": string;
+        "accessibleDescription": string;
         /**
-          * Used to indicate which dom element with ID this element controls
+          * Details of the component
          */
-        "ariaControls": string;
+        "accessibleDetails": string;
         /**
-          * Described By id
+          * String of id's that indicate alternative labels elements
          */
-        "ariaDescribedBy": string;
+        "accessibleLabelledBy": string;
         /**
-          * Aria description the button
+          * Default pagination labels
          */
-        "ariaDescription": string;
+        "accessibleLabels": Record<string, string>;
         /**
           * Default pagination labels
          */
-        "ariaLabels": Record<string, string>;
+        "accessibleLabelsDefaults": DuetLangObject;
         /**
-          * Default pagination labels
+          * Name of id of action that was called being called
          */
-        "ariaLabelsDefaults": DuetLangObject;
+        "actionId": string;
+        /**
+          * Name of id of action that was called being called
+         */
+        "actionMeta": Record<any, any> | string;
+        /**
+          * Name of action being called
+         */
+        "actionName": string;
         /**
           * Custom color to be used for a background, as a design token entered in camelCase or kebab-case. Using this option the icon will always be resized to $size-icon-medium on mobile viewports. Example: "color-primary".
          */
@@ -213,6 +221,14 @@ export namespace Components {
           * Indicates the id of a component that describes the button.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails": string;
         /**
           * If a button expands or collapses adjacent content, then use the ariaExpanded prop to add the aria-expanded attribute to the button. Set the value to convey the current expanded (true) or collapsed (false) state of the content.
          */
@@ -231,6 +247,10 @@ export namespace Components {
           * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
          */
         "accessibleLabelExternalDefaults": DuetLangObject | string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Indicates the id of a component owned by the button.
          */
@@ -440,10 +460,22 @@ export namespace Components {
           * Indicates the id of a component that describes the checkbox.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails": string;
         /**
           * Control the tabindex of checkbox. In most cases this should never be used! It exists only for Duet’s internal needs.
          */
         "accessibleIndex": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Indicates the id of a component owned by the checkbox.
          */
@@ -510,6 +542,14 @@ export namespace Components {
           * Indicates the id of a component that describes the choice. if this is set to an empty string it will prevent screenreaders from flowing to a collapsible content and can be used as an escape hatch if that behaviour is undesired.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails": string;
         /**
           * Accessible label that is read for screen reader users in the info toggle trigger button. Not visible for normal users.
           * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
@@ -519,6 +559,10 @@ export namespace Components {
           * Property to change accessibleLabelInfoButton defaults on the component. normally you would handle these strings on an application level and override @accessibleLabelInfoButton when needed
          */
         "accessibleLabelInfoButtonDefaults": DuetLangObject | string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Indicates the id of a component owned by the choice.
          */
@@ -1369,9 +1413,17 @@ export namespace Components {
          */
         "accessibleControls": string;
         /**
-          * Indicates the id of a component that describes the input.
+          * Indicates the id or a string of space seperated ids of a component(s) that describes the input.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails": string;
         /**
           * Expanded state of the element, if needed
          */
@@ -1380,6 +1432,10 @@ export namespace Components {
           * Indicates value of any popup element associated with the input.
          */
         "accessibleHasPopup": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Indicates the id of a component owned by the input.
          */
@@ -1674,6 +1730,22 @@ export namespace Components {
           * @default {fi: "Sulje ikkuna", sv: "Stäng fönstret", en: "Close the dialog", }
          */
         "accessibleCloseLabelDefaults": DuetLangObject | string;
+        /**
+          * Indicates the id or a string of space seperated ids of a component(s) that describes the input.
+         */
+        "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails": string;
+        /**
+          * Indicates the id or a string of space seperated ids of a component(s) that labels the input.
+         */
+        "accessibleLabelledBy": string;
         /**
           * Use this property when you need to have the modal dialog initially active.
          */
@@ -1841,6 +1913,18 @@ export namespace Components {
           * Indicates the id of a component that describes the input.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Format of message used to announce current amount when switching between amounts. The string {current} is replaced with the current amount.
           * @default {fi: "{current} euroa valittuna", en: "{current} euros selected", sv: "{current} valda euro"}
@@ -1963,6 +2047,22 @@ export namespace Components {
         "value": string;
     }
     interface DuetPagination {
+        /**
+          * Described By id
+         */
+        "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Default pagination labels
          */
@@ -2035,6 +2135,14 @@ export namespace Components {
           * Indicates the id of a component that describes the upload component.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails": string;
         /**
           * Indicates the aria-label of the component - this will get combined with an label+uploading when uploading, and label+upload complete when upload is complete
          */
@@ -2048,6 +2156,10 @@ export namespace Components {
           * Defaults for accessibleLabel
          */
         "accessibleLabelUploadDefaults": DuetLangObject | string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Caption (underneath label) that can be set as a way of adding extra information
          */
@@ -2078,10 +2190,22 @@ export namespace Components {
           * Indicates the id of a component that describes the radio.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails": string;
         /**
           * Control the tabindex of checkbox. In most cases this should never be used! It exists only for Duet’s internal needs.
          */
         "accessibleIndex": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Indicates the id of a component owned by the radio.
          */
@@ -2625,6 +2749,18 @@ export namespace Components {
           * Indicates the id of a component that describes the input.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Indicates the id of a component owned by the textarea.
          */
@@ -2735,6 +2871,18 @@ export namespace Components {
           * Indicates the id of a component that describes the toggle.
          */
         "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
         /**
           * Indicates the id of a component owned by the toggle.
          */
@@ -2909,7 +3057,7 @@ export namespace Components {
         /**
           * Default actions added to the internally used duet-editable-table
          */
-        "actions": DuetEditableTableActions;
+        "actions": DuetEditableTableActions1;
         /**
           * Key used to set vertical alignment of action buttons
          */
@@ -3121,6 +3269,118 @@ export namespace Components {
     interface DuetVisuallyHidden {
     }
 }
+export interface DuetActionButtonCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetActionButtonElement;
+}
+export interface DuetAlertCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetAlertElement;
+}
+export interface DuetButtonCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetButtonElement;
+}
+export interface DuetCardCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetCardElement;
+}
+export interface DuetCheckboxCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetCheckboxElement;
+}
+export interface DuetChoiceCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetChoiceElement;
+}
+export interface DuetCollapsibleCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetCollapsibleElement;
+}
+export interface DuetComboboxCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetComboboxElement;
+}
+export interface DuetCookieConsentCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetCookieConsentElement;
+}
+export interface DuetDatePickerCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetDatePickerElement;
+}
+export interface DuetEditableTableCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetEditableTableElement;
+}
+export interface DuetFooterCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetFooterElement;
+}
+export interface DuetHeaderCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetHeaderElement;
+}
+export interface DuetHeroCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetHeroElement;
+}
+export interface DuetInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetInputElement;
+}
+export interface DuetModalCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetModalElement;
+}
+export interface DuetNumberInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetNumberInputElement;
+}
+export interface DuetPaginationCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetPaginationElement;
+}
+export interface DuetRadioCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetRadioElement;
+}
+export interface DuetRangeSliderCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetRangeSliderElement;
+}
+export interface DuetRangeStepperCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetRangeStepperElement;
+}
+export interface DuetSelectCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetSelectElement;
+}
+export interface DuetStepCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetStepElement;
+}
+export interface DuetStepperCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetStepperElement;
+}
+export interface DuetTabGroupCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetTabGroupElement;
+}
+export interface DuetTextareaCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetTextareaElement;
+}
+export interface DuetToggleCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetToggleElement;
+}
+export interface DuetUploadCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetUploadElement;
+}
 declare global {
     interface HTMLDuetActionButtonElement extends Components.DuetActionButton, HTMLStencilElement {
     }
@@ -3548,37 +3808,45 @@ declare global {
 declare namespace LocalJSX {
     interface DuetActionButton {
         /**
-          * Name of id of action that was called being called
+          * Used to indicate which dom element with ID this element controls
          */
-        "actionId"?: string;
+        "accessibleControls"?: string;
         /**
-          * Name of id of action that was called being called
+          * Described By id
          */
-        "actionMeta"?: Record<any, any> | string;
+        "accessibleDescribedBy"?: string;
         /**
-          * Name of action being called
+          * Aria description the button
          */
-        "actionName"?: string;
+        "accessibleDescription"?: string;
         /**
-          * Used to indicate which dom element with ID this element controls
+          * Details of the component
          */
-        "ariaControls"?: string;
+        "accessibleDetails"?: string;
         /**
-          * Described By id
+          * String of id's that indicate alternative labels elements
          */
-        "ariaDescribedBy"?: string;
+        "accessibleLabelledBy"?: string;
         /**
-          * Aria description the button
+          * Default pagination labels
          */
-        "ariaDescription"?: string;
+        "accessibleLabels"?: Record<string, string>;
         /**
           * Default pagination labels
          */
-        "ariaLabels"?: Record<string, string>;
+        "accessibleLabelsDefaults"?: DuetLangObject;
         /**
-          * Default pagination labels
+          * Name of id of action that was called being called
          */
-        "ariaLabelsDefaults"?: DuetLangObject;
+        "actionId"?: string;
+        /**
+          * Name of id of action that was called being called
+         */
+        "actionMeta"?: Record<any, any> | string;
+        /**
+          * Name of action being called
+         */
+        "actionName"?: string;
         /**
           * Custom color to be used for a background, as a design token entered in camelCase or kebab-case. Using this option the icon will always be resized to $size-icon-medium on mobile viewports. Example: "color-primary".
          */
@@ -3606,7 +3874,7 @@ declare namespace LocalJSX {
         /**
           * Emitted a page selection has been made
          */
-        "onDuetActionEvent"?: (event: CustomEvent<DuetActionButtonEvent>) => void;
+        "onDuetActionEvent"?: (event: DuetActionButtonCustomEvent<DuetActionButtonEvent>) => void;
         /**
           * Theme of the pagination.
          */
@@ -3646,7 +3914,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the dismiss button is clicked
          */
-        "onDuetDismiss"?: (event: CustomEvent<DuetAlertEvent>) => void;
+        "onDuetDismiss"?: (event: DuetAlertCustomEvent<DuetAlertEvent>) => void;
         /**
           * Controls the padding of the component.
          */
@@ -3711,6 +3979,14 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the button.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails"?: string;
         /**
           * If a button expands or collapses adjacent content, then use the ariaExpanded prop to add the aria-expanded attribute to the button. Set the value to convey the current expanded (true) or collapsed (false) state of the content.
          */
@@ -3729,6 +4005,10 @@ declare namespace LocalJSX {
           * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
          */
         "accessibleLabelExternalDefaults"?: DuetLangObject | string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Indicates the id of a component owned by the button.
          */
@@ -3809,11 +4089,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when the button loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<any>) => void;
+        "onDuetBlur"?: (event: DuetButtonCustomEvent<any>) => void;
         /**
           * Emitted when the button has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<any>) => void;
+        "onDuetFocus"?: (event: DuetButtonCustomEvent<any>) => void;
         /**
           * Controls the padding of the component.
          */
@@ -3903,7 +4183,7 @@ declare namespace LocalJSX {
         /**
           * Event emitted when opened/closed
          */
-        "onDuetToggle"?: (event: CustomEvent<DuetCardToggleEvent>) => void;
+        "onDuetToggle"?: (event: DuetCardCustomEvent<DuetCardToggleEvent>) => void;
         /**
           * If the card is collapsible, this property controls whether the card is open or closed.
          */
@@ -3942,10 +4222,22 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the checkbox.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails"?: string;
         /**
           * Control the tabindex of checkbox. In most cases this should never be used! It exists only for Duet’s internal needs.
          */
         "accessibleIndex"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Indicates the id of a component owned by the checkbox.
          */
@@ -3981,15 +4273,15 @@ declare namespace LocalJSX {
         /**
           * Emitted when the checkbox loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetCheckboxEvent>) => void;
+        "onDuetBlur"?: (event: DuetCheckboxCustomEvent<DuetCheckboxEvent>) => void;
         /**
           * Emitted when the checked property has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetCheckboxEvent>) => void;
+        "onDuetChange"?: (event: DuetCheckboxCustomEvent<DuetCheckboxEvent>) => void;
         /**
           * Emitted when the checkbox has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetCheckboxEvent>) => void;
+        "onDuetFocus"?: (event: DuetCheckboxCustomEvent<DuetCheckboxEvent>) => void;
         /**
           * Set whether the input is required or not. Please note that this is required for accessible inputs when the user is required to fill them. When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.
          */
@@ -4020,6 +4312,14 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the choice. if this is set to an empty string it will prevent screenreaders from flowing to a collapsible content and can be used as an escape hatch if that behaviour is undesired.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails"?: string;
         /**
           * Accessible label that is read for screen reader users in the info toggle trigger button. Not visible for normal users.
           * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
@@ -4029,6 +4329,10 @@ declare namespace LocalJSX {
           * Property to change accessibleLabelInfoButton defaults on the component. normally you would handle these strings on an application level and override @accessibleLabelInfoButton when needed
          */
         "accessibleLabelInfoButtonDefaults"?: DuetLangObject | string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Indicates the id of a component owned by the choice.
          */
@@ -4086,15 +4390,15 @@ declare namespace LocalJSX {
         /**
           * Emitted when the checkbox loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetChoiceEvent>) => void;
+        "onDuetBlur"?: (event: DuetChoiceCustomEvent<DuetChoiceEvent>) => void;
         /**
           * Emitted when the checked property has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetChoiceEvent>) => void;
+        "onDuetChange"?: (event: DuetChoiceCustomEvent<DuetChoiceEvent>) => void;
         /**
           * Emitted when the checkbox has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetChoiceEvent>) => void;
+        "onDuetFocus"?: (event: DuetChoiceCustomEvent<DuetChoiceEvent>) => void;
         /**
           * Controls the padding of the component.
          */
@@ -4194,7 +4498,7 @@ declare namespace LocalJSX {
         /**
           * Event emitted when opened/closed
          */
-        "onDuetToggle"?: (event: CustomEvent<DuetCollapsibleToggleEvent>) => void;
+        "onDuetToggle"?: (event: DuetCollapsibleCustomEvent<DuetCollapsibleToggleEvent>) => void;
         /**
           * Is the component expanded or collapsed.
          */
@@ -4232,7 +4536,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when a keyboard input occurred.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetComboboxEvent>) => void;
+        "onDuetChange"?: (event: DuetComboboxCustomEvent<DuetComboboxEvent>) => void;
         /**
           * Theme of the combobox.
          */
@@ -4250,7 +4554,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the consent button has been clicked.
          */
-        "onDuetCookieConsent"?: (event: CustomEvent<DuetCookieConsentEvent>) => void;
+        "onDuetCookieConsent"?: (event: DuetCookieConsentCustomEvent<DuetCookieConsentEvent>) => void;
         /**
           * Theme of the cookie consent banner.
          */
@@ -4338,15 +4642,15 @@ declare namespace LocalJSX {
         /**
           * Event emitted the date picker input is blurred.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetDatePickerFocusEvent>) => void;
+        "onDuetBlur"?: (event: DuetDatePickerCustomEvent<DuetDatePickerFocusEvent>) => void;
         /**
           * Event emitted when a date is selected.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetDatePickerChangeEvent>) => void;
+        "onDuetChange"?: (event: DuetDatePickerCustomEvent<DuetDatePickerChangeEvent>) => void;
         /**
           * Event emitted the date picker input is focused.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetDatePickerFocusEvent>) => void;
+        "onDuetFocus"?: (event: DuetDatePickerCustomEvent<DuetDatePickerFocusEvent>) => void;
         /**
           * Hint text to display before the user types into the date picker input.
           * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
@@ -4426,11 +4730,11 @@ declare namespace LocalJSX {
         /**
           * Event emitted when table is sortable and a header item is clicked/enter is pressed
          */
-        "onDuetMenuClick"?: (event: CustomEvent<DuetTableMenuEvent>) => void;
+        "onDuetMenuClick"?: (event: DuetEditableTableCustomEvent<DuetTableMenuEvent>) => void;
         /**
           * Event emitted when table is sortable and a header item is clicked/enter is pressed
          */
-        "onDuetTableToggle"?: (event: CustomEvent<DuetTableToggleEvent>) => void;
+        "onDuetTableToggle"?: (event: DuetEditableTableCustomEvent<DuetTableToggleEvent>) => void;
         /**
           * Define rows for a table An alternative to inline HTML table. required for Sortable tables
           * @default undefined
@@ -4537,23 +4841,23 @@ declare namespace LocalJSX {
         /**
           * Event raised when an items with an associated analytics ID is clicked. Analytics ID can be accessed via **event.detail.analyticsId**
          */
-        "onDuetAnalytics"?: (event: CustomEvent<DuetFooterAnalyticsEvent>) => void;
+        "onDuetAnalytics"?: (event: DuetFooterCustomEvent<DuetFooterAnalyticsEvent>) => void;
         /**
           * @deprecated in favour of the more specific events like duetLogoClick. Callback for when a user is about to navigate to another page. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetFooterChangeEvent>) => void;
+        "onDuetChange"?: (event: DuetFooterCustomEvent<DuetFooterChangeEvent>) => void;
         /**
           * Event raised when the items are clicked. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetItemClick"?: (event: CustomEvent<DuetFooterChangeEvent>) => void;
+        "onDuetItemClick"?: (event: DuetFooterCustomEvent<DuetFooterChangeEvent>) => void;
         /**
           * Event raised when the logo is clicked. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetLogoClick"?: (event: CustomEvent<DuetFooterChangeEvent>) => void;
+        "onDuetLogoClick"?: (event: DuetFooterCustomEvent<DuetFooterChangeEvent>) => void;
         /**
           * Event raised when the menu links are clicked. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetMenuClick"?: (event: CustomEvent<DuetFooterChangeEvent>) => void;
+        "onDuetMenuClick"?: (event: DuetFooterCustomEvent<DuetFooterChangeEvent>) => void;
         /**
           * An array of items for the secondary footer links. Items have to include mandatory "label" and "href". Additionally, you can pass an "id" that is added as an HTML identifier for the anchor tag.
          */
@@ -4691,51 +4995,51 @@ declare namespace LocalJSX {
         /**
           * Event raised when an items with an associated analytics ID is clicked. Analytics ID can be accessed via **event.detail.analyticsId**
          */
-        "onDuetAnalytics"?: (event: CustomEvent<DuetHeaderAnalyticsEvent>) => void;
+        "onDuetAnalytics"?: (event: DuetHeaderCustomEvent<DuetHeaderAnalyticsEvent>) => void;
         /**
           * Event raised when a user has clicked the back button. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetBackClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetBackClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * @deprecated in favour of more specific events like duetLogoClick. Callback for when a user is about to navigate to another page. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetChange"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event raised when a user has clicked an option from the contact dropdown. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetContactClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetContactClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event raised when a user has clicked a menu item. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetItemClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetItemClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event raised when a user has selected a language from the language dropdown. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetLanguageSelect"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetLanguageSelect"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event raised when a user has clicked the logo. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetLogoClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetLogoClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event raised mobile navigation is toggled. **event.detail.open** shows the current status of the navigation.
          */
-        "onDuetMobileNavToggle"?: (event: CustomEvent<DuetHeaderMobileNavToggleEvent>) => void;
+        "onDuetMobileNavToggle"?: (event: DuetHeaderCustomEvent<DuetHeaderMobileNavToggleEvent>) => void;
         /**
           * Event for when a user has clicked the search link. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetSearchClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetSearchClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event for when a user has clicked the session link. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetSessionClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetSessionClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event raised when a user has clicked the "skip to content" button. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetSkipClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetSkipClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Event raised when a user has clicked the user link. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetUserClick"?: (event: CustomEvent<DuetHeaderChangeEvent>) => void;
+        "onDuetUserClick"?: (event: DuetHeaderCustomEvent<DuetHeaderChangeEvent>) => void;
         /**
           * Region that is shown next to the logo. If empty, region will be hidden. Note: not available in desktop multilevel header.
          */
@@ -4883,11 +5187,11 @@ declare namespace LocalJSX {
         /**
           * Event raised when an items with an associated analytics ID is clicked. Analytics ID can be accessed via **event.detail.analyticsId**
          */
-        "onDuetAnalytics"?: (event: CustomEvent<DuetHeroAnalyticsEvent>) => void;
+        "onDuetAnalytics"?: (event: DuetHeroCustomEvent<DuetHeroAnalyticsEvent>) => void;
         /**
           * Callback for when an user clicks the hero area's action button. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
-        "onDuetClick"?: (event: CustomEvent<DuetHeroClickEvent>) => void;
+        "onDuetClick"?: (event: DuetHeroCustomEvent<DuetHeroClickEvent>) => void;
         /**
           * The headline shown before heading.
          */
@@ -4961,9 +5265,17 @@ declare namespace LocalJSX {
          */
         "accessibleControls"?: string;
         /**
-          * Indicates the id of a component that describes the input.
+          * Indicates the id or a string of space seperated ids of a component(s) that describes the input.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails"?: string;
         /**
           * Expanded state of the element, if needed
          */
@@ -4972,6 +5284,10 @@ declare namespace LocalJSX {
           * Indicates value of any popup element associated with the input.
          */
         "accessibleHasPopup"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Indicates the id of a component owned by the input.
          */
@@ -5055,23 +5371,23 @@ declare namespace LocalJSX {
         /**
           * Emitted when the input loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetInputEvent>) => void;
+        "onDuetBlur"?: (event: DuetInputCustomEvent<DuetInputEvent>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetInputEvent>) => void;
+        "onDuetChange"?: (event: DuetInputCustomEvent<DuetInputEvent>) => void;
         /**
           * Emitted when the input is cleared.
          */
-        "onDuetClear"?: (event: CustomEvent<DuetInputEvent>) => void;
+        "onDuetClear"?: (event: DuetInputCustomEvent<DuetInputEvent>) => void;
         /**
           * Emitted when the input has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetInputEvent>) => void;
+        "onDuetFocus"?: (event: DuetInputCustomEvent<DuetInputEvent>) => void;
         /**
           * Emitted when a keyboard input ocurred.
          */
-        "onDuetInput"?: (event: CustomEvent<DuetInputEvent>) => void;
+        "onDuetInput"?: (event: DuetInputCustomEvent<DuetInputEvent>) => void;
         /**
           * A regular expression to check the value against. Please note that this uses native HTML5 pattern validation.
          */
@@ -5266,6 +5582,22 @@ declare namespace LocalJSX {
           * @default {fi: "Sulje ikkuna", sv: "Stäng fönstret", en: "Close the dialog", }
          */
         "accessibleCloseLabelDefaults"?: DuetLangObject | string;
+        /**
+          * Indicates the id or a string of space seperated ids of a component(s) that describes the input.
+         */
+        "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails"?: string;
+        /**
+          * Indicates the id or a string of space seperated ids of a component(s) that labels the input.
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Use this property when you need to have the modal dialog initially active.
          */
@@ -5303,15 +5635,15 @@ declare namespace LocalJSX {
         /**
           * Emitted before the modal is closed. To prevent the modal from actually closing, use ev.detail.originalEvent.preventDefault().
          */
-        "onDuetBeforeClose"?: (event: CustomEvent<DuetModalCloseEvent>) => void;
+        "onDuetBeforeClose"?: (event: DuetModalCustomEvent<DuetModalCloseEvent>) => void;
         /**
           * Emitted when the modal is closed.
          */
-        "onDuetClose"?: (event: CustomEvent<any>) => void;
+        "onDuetClose"?: (event: DuetModalCustomEvent<any>) => void;
         /**
           * Emitted when the modal is opened.
          */
-        "onDuetOpen"?: (event: CustomEvent<any>) => void;
+        "onDuetOpen"?: (event: DuetModalCustomEvent<any>) => void;
         /**
           * Size of the modal window.
          */
@@ -5418,6 +5750,18 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the input.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Format of message used to announce current amount when switching between amounts. The string {current} is replaced with the current amount.
           * @default {fi: "{current} euroa valittuna", en: "{current} euros selected", sv: "{current} valda euro"}
@@ -5505,19 +5849,19 @@ declare namespace LocalJSX {
         /**
           * Emitted when the input loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetNumberInputEvent>) => void;
+        "onDuetBlur"?: (event: DuetNumberInputCustomEvent<DuetNumberInputEvent>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetNumberInputEvent>) => void;
+        "onDuetChange"?: (event: DuetNumberInputCustomEvent<DuetNumberInputEvent>) => void;
         /**
           * Emitted when the input has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetNumberInputEvent>) => void;
+        "onDuetFocus"?: (event: DuetNumberInputCustomEvent<DuetNumberInputEvent>) => void;
         /**
           * Emitted when a keyboard input has ocurred.
          */
-        "onDuetInput"?: (event: CustomEvent<DuetNumberInputEvent>) => void;
+        "onDuetInput"?: (event: DuetNumberInputCustomEvent<DuetNumberInputEvent>) => void;
         /**
           * Set whether the input is required or not. Please note that this is required for accessible inputs when the user is required to fill them. When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.
          */
@@ -5552,6 +5896,22 @@ declare namespace LocalJSX {
         "value"?: string;
     }
     interface DuetPagination {
+        /**
+          * Described By id
+         */
+        "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Default pagination labels
          */
@@ -5575,7 +5935,7 @@ declare namespace LocalJSX {
         /**
           * Emitted a page selection has been made
          */
-        "onDuetPageChange"?: (event: CustomEvent<DuetPaginationPageEvent>) => void;
+        "onDuetPageChange"?: (event: DuetPaginationCustomEvent<DuetPaginationPageEvent>) => void;
         /**
           * The size of the take, when paginating.
          */
@@ -5628,6 +5988,14 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the upload component.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails"?: string;
         /**
           * Indicates the aria-label of the component - this will get combined with an label+uploading when uploading, and label+upload complete when upload is complete
          */
@@ -5641,6 +6009,10 @@ declare namespace LocalJSX {
           * Defaults for accessibleLabel
          */
         "accessibleLabelUploadDefaults"?: DuetLangObject | string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Caption (underneath label) that can be set as a way of adding extra information
          */
@@ -5671,10 +6043,22 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the radio.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails"?: string;
         /**
           * Control the tabindex of checkbox. In most cases this should never be used! It exists only for Duet’s internal needs.
          */
         "accessibleIndex"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Indicates the id of a component owned by the radio.
          */
@@ -5710,15 +6094,15 @@ declare namespace LocalJSX {
         /**
           * Emitted when the checkbox loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetRadioEvent>) => void;
+        "onDuetBlur"?: (event: DuetRadioCustomEvent<DuetRadioEvent>) => void;
         /**
           * Emitted when the checked property has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetRadioEvent>) => void;
+        "onDuetChange"?: (event: DuetRadioCustomEvent<DuetRadioEvent>) => void;
         /**
           * Emitted when the checkbox has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetRadioEvent>) => void;
+        "onDuetFocus"?: (event: DuetRadioCustomEvent<DuetRadioEvent>) => void;
         /**
           * Set whether the input is required or not. Please note that this is required for accessible inputs when the user is required to fill them. When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.
          */
@@ -5854,11 +6238,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when the value has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetRangeChangeEvent>) => void;
+        "onDuetChange"?: (event: DuetRangeSliderCustomEvent<DuetRangeChangeEvent>) => void;
         /**
           * Emitted when a keyboard input ocurred.
          */
-        "onDuetInput"?: (event: CustomEvent<DuetRangeChangeEvent>) => void;
+        "onDuetInput"?: (event: DuetRangeSliderCustomEvent<DuetRangeChangeEvent>) => void;
         /**
           * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them. When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.
          */
@@ -5896,7 +6280,7 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the step heading is clicked.
          */
-        "onDuetRangeStepUpdate"?: (event: CustomEvent<DuetRangeStepperUpdateEvent>) => void;
+        "onDuetRangeStepUpdate"?: (event: DuetRangeStepperCustomEvent<DuetRangeStepperUpdateEvent>) => void;
         /**
           * Start value
           * @default 1
@@ -5995,15 +6379,15 @@ declare namespace LocalJSX {
         /**
           * Emitted when the select loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetSelectEvent>) => void;
+        "onDuetBlur"?: (event: DuetSelectCustomEvent<DuetSelectEvent>) => void;
         /**
           * Callback for when the value changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetSelectEvent>) => void;
+        "onDuetChange"?: (event: DuetSelectCustomEvent<DuetSelectEvent>) => void;
         /**
           * Emitted when the select has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetSelectEvent>) => void;
+        "onDuetFocus"?: (event: DuetSelectCustomEvent<DuetSelectEvent>) => void;
         /**
           * Hint text to display.
          */
@@ -6081,7 +6465,7 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the step heading is clicked.
          */
-        "onDuetStepClick"?: (event: CustomEvent<DuetStepClickEvent>) => void;
+        "onDuetStepClick"?: (event: DuetStepCustomEvent<DuetStepClickEvent>) => void;
         /**
           * Theme of the component.
          */
@@ -6103,7 +6487,7 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the current step is changed. Can be cancelled to prevent the change.
          */
-        "onDuetStepChange"?: (event: CustomEvent<DuetStepChangeEvent>) => void;
+        "onDuetStepChange"?: (event: DuetStepperCustomEvent<DuetStepChangeEvent>) => void;
         /**
           * The index of the current step.
          */
@@ -6173,11 +6557,11 @@ declare namespace LocalJSX {
         /**
           * @deprecated in favour of more specific duetTabChange event. Callback for when the value changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetTabGroupEvent>) => void;
+        "onDuetChange"?: (event: DuetTabGroupCustomEvent<DuetTabGroupEvent>) => void;
         /**
           * Event raised when the selected tab is changed
          */
-        "onDuetTabChange"?: (event: CustomEvent<DuetTabGroupEvent>) => void;
+        "onDuetTabChange"?: (event: DuetTabGroupCustomEvent<DuetTabGroupEvent>) => void;
         /**
           * Controls the padding of the component.
          */
@@ -6238,6 +6622,18 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the input.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Indicates the id of a component owned by the textarea.
          */
@@ -6305,19 +6701,19 @@ declare namespace LocalJSX {
         /**
           * Emitted when the input loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetTextareaEvent>) => void;
+        "onDuetBlur"?: (event: DuetTextareaCustomEvent<DuetTextareaEvent>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetTextareaEvent>) => void;
+        "onDuetChange"?: (event: DuetTextareaCustomEvent<DuetTextareaEvent>) => void;
         /**
           * Emitted when the input has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetTextareaEvent>) => void;
+        "onDuetFocus"?: (event: DuetTextareaCustomEvent<DuetTextareaEvent>) => void;
         /**
           * Emitted when a keyboard input ocurred.
          */
-        "onDuetInput"?: (event: CustomEvent<DuetTextareaEvent>) => void;
+        "onDuetInput"?: (event: DuetTextareaCustomEvent<DuetTextareaEvent>) => void;
         /**
           * Hint text to display.
          */
@@ -6360,6 +6756,18 @@ declare namespace LocalJSX {
           * Indicates the id of a component that describes the toggle.
          */
         "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Aria Details of the component
+         */
+        "accessibleDetails"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
         /**
           * Indicates the id of a component owned by the toggle.
          */
@@ -6391,7 +6799,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the checked property has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetToggleChangeEvent>) => void;
+        "onDuetChange"?: (event: DuetToggleCustomEvent<DuetToggleChangeEvent>) => void;
         /**
           * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them. When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.
          */
@@ -6533,7 +6941,7 @@ declare namespace LocalJSX {
         /**
           * Default actions added to the internally used duet-editable-table
          */
-        "actions"?: DuetEditableTableActions;
+        "actions"?: DuetEditableTableActions1;
         /**
           * Key used to set vertical alignment of action buttons
          */
@@ -6661,39 +7069,39 @@ declare namespace LocalJSX {
         /**
           * Emitted when the input loses focus.
          */
-        "onDuetBlur"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetBlur"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when a user clicks cancel on an upload in progress
          */
-        "onDuetCancel"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetCancel"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onDuetChange"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetChange"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when a user clicks delete to delete an uploaded file, or a file entry with error
          */
-        "onDuetDelete"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetDelete"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when the current upload batch finishes
          */
-        "onDuetDone"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetDone"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when the input has focus.
          */
-        "onDuetFocus"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetFocus"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when the file progress is updated.
          */
-        "onDuetProgress"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetProgress"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when the current validation state changes internally
          */
-        "onDuetState"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetState"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Emitted when the user clicks the upload button
          */
-        "onDuetUpload"?: (event: CustomEvent<DuetUploadEvent>) => void;
+        "onDuetUpload"?: (event: DuetUploadCustomEvent<DuetUploadEvent>) => void;
         /**
           * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them. When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.
          */