@duetds/components 6.0.7 → 6.2.0

package/lib/types/components.d.ts

@@ -12,6 +12,7 @@ import { DuetAlertEvent } from "./components/duet-alert/duet-alert";
 import { DuetButtonIconSize, DuetButtonSize, DuetButtonTextCentering, DuetButtonVariation, DuetButtonWrapping } from "./components/duet-button/duet-button";
 import { DuetCaptionSize } from "./components/duet-caption/duet-caption";
 import { DuetCardPadding, DuetCardToggleEvent, DuetCardVariation } from "./components/duet-card/duet-card";
+import { DuetBreakpoints } from "./utils/token-utils";
 import { DuetCheckboxEvent } from "./components/duet-checkbox/duet-checkbox";
 import { DuetChoiceEvent, DuetChoiceType } from "./components/duet-choice/duet-choice";
 import { DuetCollapsibleHeadingFontSize, DuetCollapsibleToggleEvent, DuetCollapsibleWeight } from "./components/duet-collapsible/duet-collapsible";
@@ -33,7 +34,11 @@ import { DuetLabelMargin, DuetLabelSize } from "./components/duet-label/duet-lab
 import { DuetLayoutStickyDistance } from "./components/duet-layout/duet-layout";
 import { DuetListBreakpoint, DuetListLabelWidth, DuetListMobileAlignment, DuetListVariation } from "./components/duet-list/duet-list";
 import { DuetLogoSize } from "./components/duet-logo/duet-logo";
+import { DuetMenuBarDropdownEventDetails } from "./components/duet-menu-bar-dropdown/duet-menu-bar-dropdown";
+import { DuetMenuBarMenuEventDetails } from "./components/duet-menu-bar-menu/duet-menu-bar-menu";
+import { DuetMenuBarMenuDropdownEventDetails } from "./components/duet-menu-bar-menu-dropdown/duet-menu-bar-menu-dropdown";
 import { DuetModalCloseEvent, DuetModalSize } from "./components/duet-modal/duet-modal";
+import { DuetMultiselectEvent, DuetMultiselectItem } from "./components/duet-multiselect/duet-multiselect";
 import { DuetNotificationDrawerDirection } from "./components/duet-notification-drawer/duet-notification-drawer";
 import { DuetNumberInputEvent } from "./components/duet-number-input/duet-number-input";
 import { DuetPaginationPageEvent, DuetPaginationVariation } from "./components/duet-pagination/duet-pagination";
@@ -50,6 +55,7 @@ import { DuetTabGroupEvent, DuetTabVariation } from "./components/duet-tab-group
 import { DuetTableBreakpoint as DuetTableBreakpoint1, DuetTableStickyDistance as DuetTableStickyDistance1, DuetTableVariant as DuetTableVariant1 } from "./components/duet-table/duet-table";
 import { DuetTextareaEvent } from "./components/duet-textarea/duet-textarea";
 import { DuetToggleChangeEvent } from "./components/duet-toggle/duet-toggle";
+import { DuetToolbarDropdownEventDetails } from "./components/duet-toolbar-dropdown/duet-toolbar-dropdown";
 import { DuetTooltipBreakpoint } from "./components/duet-tooltip/duet-tooltip";
 import { DuetUploadEvent, DuetUploadTableGroupName, StringMap, XHRInternalMiddleWare } from "./components/duet-upload/duet-upload";
 import { DuetEditableTableActions as DuetEditableTableActions1 } from "./components/duet-editable-table/duet-editable-table";
@@ -439,6 +445,10 @@ export namespace Components {
           * Sets focus on the specified `duet-card`. Use this method instead of the global `card.focus()`.
          */
         "setFocus": (options?: FocusOptions) => Promise<void>;
+        /**
+          * Breakpoint used to remove shadow around card. These match to similar media query tokens: $media-query-small and $media-query-medium.
+         */
+        "shadowBreakpoint"?: DuetBreakpoints;
         /**
           * Theme of the card.
          */
@@ -485,6 +495,10 @@ export namespace Components {
           * Indicates the id of a component owned by the checkbox.
          */
         "accessibleOwns": string;
+        /**
+          * Aria selected
+         */
+        "accessibleSelected": string;
         /**
           * Check state of the checkbox.
          */
@@ -1589,6 +1603,10 @@ export namespace Components {
           * Align container vertically in the middle when the space allows it.
          */
         "middle": boolean;
+        /**
+          * Breakpoint used to remove padding. These match to similar media query tokens: $media-query-small and $media-query-medium.
+         */
+        "paddingBreakpoint"?: DuetBreakpoints;
         /**
           * Makes the sidebar stick to the top of the window when scrolling down.
          */
@@ -1708,6 +1726,122 @@ export namespace Components {
          */
         "theme": DuetTheme;
     }
+    interface DuetMenuBar {
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetMenuBarDropdown {
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Open
+         */
+        "open": boolean;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetMenuBarDropdownLink {
+        /**
+          * Href
+         */
+        "href": string;
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetMenuBarLink {
+        /**
+          * Href
+         */
+        "href": string;
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetMenuBarMenu {
+        /**
+          * Active
+         */
+        "active": boolean;
+        /**
+          * Open
+         */
+        "open": boolean;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetMenuBarMenuDropdown {
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Open
+         */
+        "open": boolean;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetMenuBarMenuDropdownLink {
+        /**
+          * Caret
+         */
+        "caret": boolean;
+        /**
+          * Highlight
+         */
+        "highlight": boolean;
+        /**
+          * Href
+         */
+        "href": string;
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetMenuBarMenuLink {
+        /**
+          * Active
+         */
+        "active": boolean;
+        /**
+          * Href
+         */
+        "href": string;
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
     interface DuetModal {
         /**
           * Adds accessible label for the close icon that is only shown for screen readers. This property is always required to create an accessibly interface! Swedish translation for this property is “Stäng fönstret”.
@@ -1786,6 +1920,74 @@ export namespace Components {
          */
         "theme": DuetTheme;
     }
+    interface DuetMultiselect {
+        /**
+          * Caption (underneath label) that can be set as a way of adding extra information
+         */
+        "caption": string;
+        /**
+          * Makes the select component disabled. This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.
+         */
+        "disabled": boolean;
+        /**
+          * Display the select in error state along with an error message.
+         */
+        "error": string;
+        /**
+          * Expands the input to fill 100% of the container width.
+         */
+        "expand": boolean;
+        /**
+          * Adds a unique identifier for the select.
+         */
+        "identifier": string;
+        /**
+          * An array of items to choose from
+         */
+        "items": string | DuetMultiselectItem[];
+        /**
+          * Label for the select.
+         */
+        "label": string;
+        /**
+          * Visually hide the label, but still show it to screen readers.
+         */
+        "labelHidden": boolean;
+        /**
+          * Controls the margin of the component.
+         */
+        "margin": DuetMargin;
+        /**
+          * Hint text to display.
+         */
+        "placeholder": string;
+        /**
+          * Sets focus on the specified `duet-multiselect`. Use this method instead of the global `multiselect.focus()`.
+         */
+        "setFocus": (options?: FocusOptions) => Promise<void>;
+        /**
+          * Theme of the select.
+         */
+        "theme": DuetTheme;
+        /**
+          * Tooltip to display next to the label of the input.
+         */
+        "tooltip": string;
+        /**
+          * With direction setting you can force the tooltip to always open towards left or right instead of automatically determining the direction.
+         */
+        "tooltipDirection": DuetTooltipDirection;
+        /**
+          * Value of multiselect
+         */
+        "value": DuetMultiselectItem[];
+    }
+    interface DuetNav {
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
     interface DuetNotification {
         /**
           * Adds accessible label for tooltip that is shown over unread counter
@@ -2438,6 +2640,16 @@ export namespace Components {
          */
         "theme": DuetTheme;
     }
+    interface DuetSectionLayout {
+        /**
+          * Controls the margin of the component.
+         */
+        "margin": DuetMargin;
+        /**
+          * Align container vertically in the middle when the space allows it.
+         */
+        "middle": boolean;
+    }
     interface DuetSelect {
         /**
           * Indicates the id of a related component’s visually focused element.
@@ -2921,6 +3133,66 @@ export namespace Components {
          */
         "value": string;
     }
+    interface DuetToolbar {
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetToolbarDropdown {
+        /**
+          * Active
+         */
+        "active": boolean;
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Open
+         */
+        "open": boolean;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetToolbarDropdownLink {
+        /**
+          * Active
+         */
+        "active": boolean;
+        /**
+          * Href
+         */
+        "href": string;
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
+    interface DuetToolbarLink {
+        /**
+          * Active
+         */
+        "active": boolean;
+        /**
+          * Href
+         */
+        "href": string;
+        /**
+          * Icon
+         */
+        "icon": string;
+        /**
+          * Theme.
+         */
+        "theme": DuetTheme;
+    }
     interface DuetTooltip {
         /**
           * Adds accessible label for the close icon that is only shown for screen readers. This property is always required to create an accessibly interface!
@@ -3326,10 +3598,26 @@ export interface DuetInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDuetInputElement;
 }
+export interface DuetMenuBarDropdownCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetMenuBarDropdownElement;
+}
+export interface DuetMenuBarMenuCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetMenuBarMenuElement;
+}
+export interface DuetMenuBarMenuDropdownCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetMenuBarMenuDropdownElement;
+}
 export interface DuetModalCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDuetModalElement;
 }
+export interface DuetMultiselectCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetMultiselectElement;
+}
 export interface DuetNumberInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDuetNumberInputElement;
@@ -3374,6 +3662,10 @@ export interface DuetToggleCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDuetToggleElement;
 }
+export interface DuetToolbarDropdownCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDuetToolbarDropdownElement;
+}
 export interface DuetUploadCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDuetUploadElement;
@@ -3577,12 +3869,72 @@ declare global {
         prototype: HTMLDuetLogoElement;
         new (): HTMLDuetLogoElement;
     };
+    interface HTMLDuetMenuBarElement extends Components.DuetMenuBar, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarElement: {
+        prototype: HTMLDuetMenuBarElement;
+        new (): HTMLDuetMenuBarElement;
+    };
+    interface HTMLDuetMenuBarDropdownElement extends Components.DuetMenuBarDropdown, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarDropdownElement: {
+        prototype: HTMLDuetMenuBarDropdownElement;
+        new (): HTMLDuetMenuBarDropdownElement;
+    };
+    interface HTMLDuetMenuBarDropdownLinkElement extends Components.DuetMenuBarDropdownLink, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarDropdownLinkElement: {
+        prototype: HTMLDuetMenuBarDropdownLinkElement;
+        new (): HTMLDuetMenuBarDropdownLinkElement;
+    };
+    interface HTMLDuetMenuBarLinkElement extends Components.DuetMenuBarLink, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarLinkElement: {
+        prototype: HTMLDuetMenuBarLinkElement;
+        new (): HTMLDuetMenuBarLinkElement;
+    };
+    interface HTMLDuetMenuBarMenuElement extends Components.DuetMenuBarMenu, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarMenuElement: {
+        prototype: HTMLDuetMenuBarMenuElement;
+        new (): HTMLDuetMenuBarMenuElement;
+    };
+    interface HTMLDuetMenuBarMenuDropdownElement extends Components.DuetMenuBarMenuDropdown, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarMenuDropdownElement: {
+        prototype: HTMLDuetMenuBarMenuDropdownElement;
+        new (): HTMLDuetMenuBarMenuDropdownElement;
+    };
+    interface HTMLDuetMenuBarMenuDropdownLinkElement extends Components.DuetMenuBarMenuDropdownLink, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarMenuDropdownLinkElement: {
+        prototype: HTMLDuetMenuBarMenuDropdownLinkElement;
+        new (): HTMLDuetMenuBarMenuDropdownLinkElement;
+    };
+    interface HTMLDuetMenuBarMenuLinkElement extends Components.DuetMenuBarMenuLink, HTMLStencilElement {
+    }
+    var HTMLDuetMenuBarMenuLinkElement: {
+        prototype: HTMLDuetMenuBarMenuLinkElement;
+        new (): HTMLDuetMenuBarMenuLinkElement;
+    };
     interface HTMLDuetModalElement extends Components.DuetModal, HTMLStencilElement {
     }
     var HTMLDuetModalElement: {
         prototype: HTMLDuetModalElement;
         new (): HTMLDuetModalElement;
     };
+    interface HTMLDuetMultiselectElement extends Components.DuetMultiselect, HTMLStencilElement {
+    }
+    var HTMLDuetMultiselectElement: {
+        prototype: HTMLDuetMultiselectElement;
+        new (): HTMLDuetMultiselectElement;
+    };
+    interface HTMLDuetNavElement extends Components.DuetNav, HTMLStencilElement {
+    }
+    var HTMLDuetNavElement: {
+        prototype: HTMLDuetNavElement;
+        new (): HTMLDuetNavElement;
+    };
     interface HTMLDuetNotificationElement extends Components.DuetNotification, HTMLStencilElement {
     }
     var HTMLDuetNotificationElement: {
@@ -3649,6 +4001,12 @@ declare global {
         prototype: HTMLDuetScrollableElement;
         new (): HTMLDuetScrollableElement;
     };
+    interface HTMLDuetSectionLayoutElement extends Components.DuetSectionLayout, HTMLStencilElement {
+    }
+    var HTMLDuetSectionLayoutElement: {
+        prototype: HTMLDuetSectionLayoutElement;
+        new (): HTMLDuetSectionLayoutElement;
+    };
     interface HTMLDuetSelectElement extends Components.DuetSelect, HTMLStencilElement {
     }
     var HTMLDuetSelectElement: {
@@ -3709,6 +4067,30 @@ declare global {
         prototype: HTMLDuetToggleElement;
         new (): HTMLDuetToggleElement;
     };
+    interface HTMLDuetToolbarElement extends Components.DuetToolbar, HTMLStencilElement {
+    }
+    var HTMLDuetToolbarElement: {
+        prototype: HTMLDuetToolbarElement;
+        new (): HTMLDuetToolbarElement;
+    };
+    interface HTMLDuetToolbarDropdownElement extends Components.DuetToolbarDropdown, HTMLStencilElement {
+    }
+    var HTMLDuetToolbarDropdownElement: {
+        prototype: HTMLDuetToolbarDropdownElement;
+        new (): HTMLDuetToolbarDropdownElement;
+    };
+    interface HTMLDuetToolbarDropdownLinkElement extends Components.DuetToolbarDropdownLink, HTMLStencilElement {
+    }
+    var HTMLDuetToolbarDropdownLinkElement: {
+        prototype: HTMLDuetToolbarDropdownLinkElement;
+        new (): HTMLDuetToolbarDropdownLinkElement;
+    };
+    interface HTMLDuetToolbarLinkElement extends Components.DuetToolbarLink, HTMLStencilElement {
+    }
+    var HTMLDuetToolbarLinkElement: {
+        prototype: HTMLDuetToolbarLinkElement;
+        new (): HTMLDuetToolbarLinkElement;
+    };
     interface HTMLDuetTooltipElement extends Components.DuetTooltip, HTMLStencilElement {
     }
     var HTMLDuetTooltipElement: {
@@ -3773,7 +4155,17 @@ declare global {
         "duet-list": HTMLDuetListElement;
         "duet-list-item": HTMLDuetListItemElement;
         "duet-logo": HTMLDuetLogoElement;
+        "duet-menu-bar": HTMLDuetMenuBarElement;
+        "duet-menu-bar-dropdown": HTMLDuetMenuBarDropdownElement;
+        "duet-menu-bar-dropdown-link": HTMLDuetMenuBarDropdownLinkElement;
+        "duet-menu-bar-link": HTMLDuetMenuBarLinkElement;
+        "duet-menu-bar-menu": HTMLDuetMenuBarMenuElement;
+        "duet-menu-bar-menu-dropdown": HTMLDuetMenuBarMenuDropdownElement;
+        "duet-menu-bar-menu-dropdown-link": HTMLDuetMenuBarMenuDropdownLinkElement;
+        "duet-menu-bar-menu-link": HTMLDuetMenuBarMenuLinkElement;
         "duet-modal": HTMLDuetModalElement;
+        "duet-multiselect": HTMLDuetMultiselectElement;
+        "duet-nav": HTMLDuetNavElement;
         "duet-notification": HTMLDuetNotificationElement;
         "duet-notification-drawer": HTMLDuetNotificationDrawerElement;
         "duet-number-input": HTMLDuetNumberInputElement;
@@ -3785,6 +4177,7 @@ declare global {
         "duet-range-slider": HTMLDuetRangeSliderElement;
         "duet-range-stepper": HTMLDuetRangeStepperElement;
         "duet-scrollable": HTMLDuetScrollableElement;
+        "duet-section-layout": HTMLDuetSectionLayoutElement;
         "duet-select": HTMLDuetSelectElement;
         "duet-spacer": HTMLDuetSpacerElement;
         "duet-spinner": HTMLDuetSpinnerElement;
@@ -3795,6 +4188,10 @@ declare global {
         "duet-table": HTMLDuetTableElement;
         "duet-textarea": HTMLDuetTextareaElement;
         "duet-toggle": HTMLDuetToggleElement;
+        "duet-toolbar": HTMLDuetToolbarElement;
+        "duet-toolbar-dropdown": HTMLDuetToolbarDropdownElement;
+        "duet-toolbar-dropdown-link": HTMLDuetToolbarDropdownLinkElement;
+        "duet-toolbar-link": HTMLDuetToolbarLinkElement;
         "duet-tooltip": HTMLDuetTooltipElement;
         "duet-tray": HTMLDuetTrayElement;
         "duet-upload": HTMLDuetUploadElement;
@@ -4197,6 +4594,10 @@ declare namespace LocalJSX {
           * Additional content for the card heading. If empty, both heading and collapse functionality will be hidden.
          */
         "secondaryHeading"?: string;
+        /**
+          * Breakpoint used to remove shadow around card. These match to similar media query tokens: $media-query-small and $media-query-medium.
+         */
+        "shadowBreakpoint"?: DuetBreakpoints;
         /**
           * Theme of the card.
          */
@@ -4243,6 +4644,10 @@ declare namespace LocalJSX {
           * Indicates the id of a component owned by the checkbox.
          */
         "accessibleOwns"?: string;
+        /**
+          * Aria selected
+         */
+        "accessibleSelected"?: string;
         /**
           * Check state of the checkbox.
          */
@@ -5453,6 +5858,10 @@ declare namespace LocalJSX {
           * Align container vertically in the middle when the space allows it.
          */
         "middle"?: boolean;
+        /**
+          * Breakpoint used to remove padding. These match to similar media query tokens: $media-query-small and $media-query-medium.
+         */
+        "paddingBreakpoint"?: DuetBreakpoints;
         /**
           * Makes the sidebar stick to the top of the window when scrolling down.
          */
@@ -5564,6 +5973,134 @@ declare namespace LocalJSX {
          */
         "theme"?: DuetTheme;
     }
+    interface DuetMenuBar {
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetMenuBarDropdown {
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Event raised when the dropdown has been opened. 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**.
+         */
+        "onDuetMenuBarDropdownEvent"?: (event: DuetMenuBarDropdownCustomEvent<DuetMenuBarDropdownEventDetails>) => void;
+        /**
+          * Open
+         */
+        "open"?: boolean;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetMenuBarDropdownLink {
+        /**
+          * Href
+         */
+        "href"?: string;
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetMenuBarLink {
+        /**
+          * Href
+         */
+        "href"?: string;
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetMenuBarMenu {
+        /**
+          * Active
+         */
+        "active"?: boolean;
+        /**
+          * Event raised when the menu has been opened. 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**.
+         */
+        "onDuetMenuBarMenuEvent"?: (event: DuetMenuBarMenuCustomEvent<DuetMenuBarMenuEventDetails>) => void;
+        /**
+          * Open
+         */
+        "open"?: boolean;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetMenuBarMenuDropdown {
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Event raised when the menu dropdown has been opened. 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**.
+         */
+        "onDuetMenuBarMenuDropdownEvent"?: (event: DuetMenuBarMenuDropdownCustomEvent<DuetMenuBarMenuDropdownEventDetails>) => void;
+        /**
+          * Open
+         */
+        "open"?: boolean;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetMenuBarMenuDropdownLink {
+        /**
+          * Caret
+         */
+        "caret"?: boolean;
+        /**
+          * Highlight
+         */
+        "highlight"?: boolean;
+        /**
+          * Href
+         */
+        "href"?: string;
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetMenuBarMenuLink {
+        /**
+          * Active
+         */
+        "active"?: boolean;
+        /**
+          * Href
+         */
+        "href"?: string;
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
     interface DuetModal {
         /**
           * Adds accessible label for the close icon that is only shown for screen readers. This property is always required to create an accessibly interface! Swedish translation for this property is “Stäng fönstret”.
@@ -5646,6 +6183,82 @@ declare namespace LocalJSX {
          */
         "theme"?: DuetTheme;
     }
+    interface DuetMultiselect {
+        /**
+          * Caption (underneath label) that can be set as a way of adding extra information
+         */
+        "caption"?: string;
+        /**
+          * Makes the select component disabled. This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.
+         */
+        "disabled"?: boolean;
+        /**
+          * Display the select in error state along with an error message.
+         */
+        "error"?: string;
+        /**
+          * Expands the input to fill 100% of the container width.
+         */
+        "expand"?: boolean;
+        /**
+          * Adds a unique identifier for the select.
+         */
+        "identifier"?: string;
+        /**
+          * An array of items to choose from
+         */
+        "items"?: string | DuetMultiselectItem[];
+        /**
+          * Label for the select.
+         */
+        "label"?: string;
+        /**
+          * Visually hide the label, but still show it to screen readers.
+         */
+        "labelHidden"?: boolean;
+        /**
+          * Controls the margin of the component.
+         */
+        "margin"?: DuetMargin;
+        /**
+          * Emitted when the select loses focus.
+         */
+        "onDuetBlur"?: (event: DuetMultiselectCustomEvent<DuetMultiselectEvent>) => void;
+        /**
+          * Callback for when the value changed.
+         */
+        "onDuetChange"?: (event: DuetMultiselectCustomEvent<DuetMultiselectEvent>) => void;
+        /**
+          * Emitted when the select has focus.
+         */
+        "onDuetFocus"?: (event: DuetMultiselectCustomEvent<DuetMultiselectEvent>) => void;
+        /**
+          * Hint text to display.
+         */
+        "placeholder"?: string;
+        /**
+          * Theme of the select.
+         */
+        "theme"?: DuetTheme;
+        /**
+          * Tooltip to display next to the label of the input.
+         */
+        "tooltip"?: string;
+        /**
+          * With direction setting you can force the tooltip to always open towards left or right instead of automatically determining the direction.
+         */
+        "tooltipDirection"?: DuetTooltipDirection;
+        /**
+          * Value of multiselect
+         */
+        "value"?: DuetMultiselectItem[];
+    }
+    interface DuetNav {
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
     interface DuetNotification {
         /**
           * Adds accessible label for tooltip that is shown over unread counter
@@ -6308,6 +6921,16 @@ declare namespace LocalJSX {
          */
         "theme"?: DuetTheme;
     }
+    interface DuetSectionLayout {
+        /**
+          * Controls the margin of the component.
+         */
+        "margin"?: DuetMargin;
+        /**
+          * Align container vertically in the middle when the space allows it.
+         */
+        "middle"?: boolean;
+    }
     interface DuetSelect {
         /**
           * Indicates the id of a related component’s visually focused element.
@@ -6810,6 +7433,70 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    interface DuetToolbar {
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetToolbarDropdown {
+        /**
+          * Active
+         */
+        "active"?: boolean;
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Event raised when the dropdown has been opened. 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**.
+         */
+        "onDuetToolbarDropdownEvent"?: (event: DuetToolbarDropdownCustomEvent<DuetToolbarDropdownEventDetails>) => void;
+        /**
+          * Open
+         */
+        "open"?: boolean;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetToolbarDropdownLink {
+        /**
+          * Active
+         */
+        "active"?: boolean;
+        /**
+          * Href
+         */
+        "href"?: string;
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
+    interface DuetToolbarLink {
+        /**
+          * Active
+         */
+        "active"?: boolean;
+        /**
+          * Href
+         */
+        "href"?: string;
+        /**
+          * Icon
+         */
+        "icon"?: string;
+        /**
+          * Theme.
+         */
+        "theme"?: DuetTheme;
+    }
     interface DuetTooltip {
         /**
           * Adds accessible label for the close icon that is only shown for screen readers. This property is always required to create an accessibly interface!
@@ -7203,7 +7890,17 @@ declare namespace LocalJSX {
         "duet-list": DuetList;
         "duet-list-item": DuetListItem;
         "duet-logo": DuetLogo;
+        "duet-menu-bar": DuetMenuBar;
+        "duet-menu-bar-dropdown": DuetMenuBarDropdown;
+        "duet-menu-bar-dropdown-link": DuetMenuBarDropdownLink;
+        "duet-menu-bar-link": DuetMenuBarLink;
+        "duet-menu-bar-menu": DuetMenuBarMenu;
+        "duet-menu-bar-menu-dropdown": DuetMenuBarMenuDropdown;
+        "duet-menu-bar-menu-dropdown-link": DuetMenuBarMenuDropdownLink;
+        "duet-menu-bar-menu-link": DuetMenuBarMenuLink;
         "duet-modal": DuetModal;
+        "duet-multiselect": DuetMultiselect;
+        "duet-nav": DuetNav;
         "duet-notification": DuetNotification;
         "duet-notification-drawer": DuetNotificationDrawer;
         "duet-number-input": DuetNumberInput;
@@ -7215,6 +7912,7 @@ declare namespace LocalJSX {
         "duet-range-slider": DuetRangeSlider;
         "duet-range-stepper": DuetRangeStepper;
         "duet-scrollable": DuetScrollable;
+        "duet-section-layout": DuetSectionLayout;
         "duet-select": DuetSelect;
         "duet-spacer": DuetSpacer;
         "duet-spinner": DuetSpinner;
@@ -7225,6 +7923,10 @@ declare namespace LocalJSX {
         "duet-table": DuetTable;
         "duet-textarea": DuetTextarea;
         "duet-toggle": DuetToggle;
+        "duet-toolbar": DuetToolbar;
+        "duet-toolbar-dropdown": DuetToolbarDropdown;
+        "duet-toolbar-dropdown-link": DuetToolbarDropdownLink;
+        "duet-toolbar-link": DuetToolbarLink;
         "duet-tooltip": DuetTooltip;
         "duet-tray": DuetTray;
         "duet-upload": DuetUpload;
@@ -7269,7 +7971,17 @@ declare module "@stencil/core" {
             "duet-list": LocalJSX.DuetList & JSXBase.HTMLAttributes<HTMLDuetListElement>;
             "duet-list-item": LocalJSX.DuetListItem & JSXBase.HTMLAttributes<HTMLDuetListItemElement>;
             "duet-logo": LocalJSX.DuetLogo & JSXBase.HTMLAttributes<HTMLDuetLogoElement>;
+            "duet-menu-bar": LocalJSX.DuetMenuBar & JSXBase.HTMLAttributes<HTMLDuetMenuBarElement>;
+            "duet-menu-bar-dropdown": LocalJSX.DuetMenuBarDropdown & JSXBase.HTMLAttributes<HTMLDuetMenuBarDropdownElement>;
+            "duet-menu-bar-dropdown-link": LocalJSX.DuetMenuBarDropdownLink & JSXBase.HTMLAttributes<HTMLDuetMenuBarDropdownLinkElement>;
+            "duet-menu-bar-link": LocalJSX.DuetMenuBarLink & JSXBase.HTMLAttributes<HTMLDuetMenuBarLinkElement>;
+            "duet-menu-bar-menu": LocalJSX.DuetMenuBarMenu & JSXBase.HTMLAttributes<HTMLDuetMenuBarMenuElement>;
+            "duet-menu-bar-menu-dropdown": LocalJSX.DuetMenuBarMenuDropdown & JSXBase.HTMLAttributes<HTMLDuetMenuBarMenuDropdownElement>;
+            "duet-menu-bar-menu-dropdown-link": LocalJSX.DuetMenuBarMenuDropdownLink & JSXBase.HTMLAttributes<HTMLDuetMenuBarMenuDropdownLinkElement>;
+            "duet-menu-bar-menu-link": LocalJSX.DuetMenuBarMenuLink & JSXBase.HTMLAttributes<HTMLDuetMenuBarMenuLinkElement>;
             "duet-modal": LocalJSX.DuetModal & JSXBase.HTMLAttributes<HTMLDuetModalElement>;
+            "duet-multiselect": LocalJSX.DuetMultiselect & JSXBase.HTMLAttributes<HTMLDuetMultiselectElement>;
+            "duet-nav": LocalJSX.DuetNav & JSXBase.HTMLAttributes<HTMLDuetNavElement>;
             "duet-notification": LocalJSX.DuetNotification & JSXBase.HTMLAttributes<HTMLDuetNotificationElement>;
             "duet-notification-drawer": LocalJSX.DuetNotificationDrawer & JSXBase.HTMLAttributes<HTMLDuetNotificationDrawerElement>;
             "duet-number-input": LocalJSX.DuetNumberInput & JSXBase.HTMLAttributes<HTMLDuetNumberInputElement>;
@@ -7281,6 +7993,7 @@ declare module "@stencil/core" {
             "duet-range-slider": LocalJSX.DuetRangeSlider & JSXBase.HTMLAttributes<HTMLDuetRangeSliderElement>;
             "duet-range-stepper": LocalJSX.DuetRangeStepper & JSXBase.HTMLAttributes<HTMLDuetRangeStepperElement>;
             "duet-scrollable": LocalJSX.DuetScrollable & JSXBase.HTMLAttributes<HTMLDuetScrollableElement>;
+            "duet-section-layout": LocalJSX.DuetSectionLayout & JSXBase.HTMLAttributes<HTMLDuetSectionLayoutElement>;
             "duet-select": LocalJSX.DuetSelect & JSXBase.HTMLAttributes<HTMLDuetSelectElement>;
             "duet-spacer": LocalJSX.DuetSpacer & JSXBase.HTMLAttributes<HTMLDuetSpacerElement>;
             "duet-spinner": LocalJSX.DuetSpinner & JSXBase.HTMLAttributes<HTMLDuetSpinnerElement>;
@@ -7291,6 +8004,10 @@ declare module "@stencil/core" {
             "duet-table": LocalJSX.DuetTable & JSXBase.HTMLAttributes<HTMLDuetTableElement>;
             "duet-textarea": LocalJSX.DuetTextarea & JSXBase.HTMLAttributes<HTMLDuetTextareaElement>;
             "duet-toggle": LocalJSX.DuetToggle & JSXBase.HTMLAttributes<HTMLDuetToggleElement>;
+            "duet-toolbar": LocalJSX.DuetToolbar & JSXBase.HTMLAttributes<HTMLDuetToolbarElement>;
+            "duet-toolbar-dropdown": LocalJSX.DuetToolbarDropdown & JSXBase.HTMLAttributes<HTMLDuetToolbarDropdownElement>;
+            "duet-toolbar-dropdown-link": LocalJSX.DuetToolbarDropdownLink & JSXBase.HTMLAttributes<HTMLDuetToolbarDropdownLinkElement>;
+            "duet-toolbar-link": LocalJSX.DuetToolbarLink & JSXBase.HTMLAttributes<HTMLDuetToolbarLinkElement>;
             "duet-tooltip": LocalJSX.DuetTooltip & JSXBase.HTMLAttributes<HTMLDuetTooltipElement>;
             "duet-tray": LocalJSX.DuetTray & JSXBase.HTMLAttributes<HTMLDuetTrayElement>;
             "duet-upload": LocalJSX.DuetUpload & JSXBase.HTMLAttributes<HTMLDuetUploadElement>;