@duetds/components 4.28.0 → 4.31.0

package/lib/types/components/duet-choice/duet-choice.d.ts

@@ -1,8 +1,8 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetMargin, DuetPadding, DuetDirection } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
-import { DuetLangObject } from "../../utils/language-utils";
+import { DuetDirection, DuetMargin, DuetPadding, DuetTheme } from "../../common-types";
 import { InputComponent } from "../../utils/form-components";
+import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetChoiceEvent = {
   originalEvent?: Event;
   checked: boolean;
@@ -50,10 +50,11 @@ export declare class DuetChoice implements ThemeableComponent, InputComponent {
    * 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;
+  accessibleLabelInfoButtonDefaults: DuetLangObject | 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"}
    */
   accessibleLabelInfoButton: string;
   /**

package/lib/types/components/duet-collapsible/duet-collapsible.d.ts

@@ -1,7 +1,8 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetMargin } from "../../common-types";
+import { DuetHeadingLevel, DuetMargin, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetCollapsibleWeight = "semibold" | "normal";
+export declare type DuetCollapsibleHeadingFontSize = "x-small" | "small" | "medium" | "large" | "x-large" | "xx-large" | "xxx-large" | "xxxx-large" | undefined;
 export declare type DuetCollapsibleToggleEvent = {
   component: "duet-collapsible";
   originalEvent: KeyboardEvent | MouseEvent;
@@ -28,6 +29,26 @@ export declare class DuetCollapsible implements ThemeableComponent {
    * The font weight of the heading
    */
   headingWeight: DuetCollapsibleWeight;
+  /**
+   * Custom headingSize to be used for font size of heading, as a design token entered
+   * in kebab-case x-small -> font-size-x-small.
+   * Example:
+   * # 12px (0.75rem)  ------  +2px   (x-small)
+   * # 14px (0.875rem) ------  +2px   (small)
+   * # 16px (1rem)     ------  +2px   (medium)
+   * # 20px (1.25rem)  ------  +4px   (large)
+   * # 24px (1.5rem)   ------  +4px   (x-large)
+   * # 36px (2.25rem)  ------  +12px  (xx-large)
+   * # 48px (3rem)     ------  +12px  (xxx-large)
+   * # 72px (4.5rem)   ------  +24px  (xxxx-large)
+   */
+  headingSize: DuetCollapsibleHeadingFontSize;
+  /**
+   * The actual heading level used for the heading in html markup. This setting
+   * exists for accessibility reasons. It doesn’t change the style visually.
+   * only variations of h1-h6 area accepted
+   */
+  headingLevel: DuetHeadingLevel | undefined;
   /**
    * Controls the margin of the component.
    */
@@ -45,6 +66,8 @@ export declare class DuetCollapsible implements ThemeableComponent {
    */
   componentWillLoad(): void;
   private handleKeyDown;
+  private getFontSizeFromTokens;
+  private getEquivalentIconSize;
   private handleClick;
   /**
    * Sets focus on the specified `duet-collapsible`. Use this method instead of the global

package/lib/types/components/duet-date-picker/date-picker-month.d.ts

@@ -1,6 +1,6 @@
 import { FunctionalComponent } from "../../stencil-public-runtime";
-import { DatePickerDayProps } from "./date-picker-day";
 import { DuetLanguage, DuetTheme } from "../../common-types";
+import { DatePickerDayProps } from "./date-picker-day";
 declare type DatePickerMonthProps = {
   selectedDate: Date;
   focusedDate: Date;

package/lib/types/components/duet-date-picker/duet-date-picker.d.ts

@@ -1,7 +1,8 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetMargin, DuetLanguage, DuetTooltipDirection } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetLanguage, DuetMargin, DuetTheme, DuetTooltipDirection } from "../../common-types";
 import { InputComponent } from "../../utils/form-components";
+import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetDatePickerChangeEvent = {
   component: "duet-date-picker";
   valueAsDate: Date;
@@ -59,8 +60,21 @@ export declare class DuetDatePicker implements ThemeableComponent, InputComponen
    * Controls the margin of the component.
    */
   margin: DuetMargin;
+  /**
+   * The currently active language. This setting changes the month/year/day
+   * names and button labels as well as all screen reader labels.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
+   */
+  language: DuetLanguage;
+  /**
+   * Placeholder defaults
+   * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
+   */
+  placeholderDefaults: DuetLangObject | string;
   /**
    * 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.åååå" }
    */
   placeholder: string;
   /**
@@ -73,11 +87,6 @@ export declare class DuetDatePicker implements ThemeableComponent, InputComponen
    * interact with the input, and conveys its inactive state to assistive technologies.
    */
   disabled: boolean;
-  /**
-   * The currently active language. This setting changes the month/year/day
-   * names and button labels as well as all screen reader labels.
-   */
-  language: DuetLanguage;
   /**
    * Display the date picker input in error state along with an error message.
    */

package/lib/types/components/duet-divider/duet-divider.d.ts

@@ -1,5 +1,5 @@
-import { ThemeableComponent } from "../../utils/themeable-component";
 import { DuetMargin, DuetTheme } from "../../common-types";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetDividerMargin = DuetMargin | "small";
 export declare class DuetDivider implements ThemeableComponent {
   /**

package/lib/types/components/duet-empty-state/duet-empty-state.d.ts

@@ -1,5 +1,5 @@
-import { ThemeableComponent } from "../../utils/themeable-component";
 import { DuetIconName, DuetTheme } from "../../common-types";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetEmptyStateSize = "medium" | "small";
 export declare class DuetEmptyState implements ThemeableComponent {
   /**

package/lib/types/components/duet-fieldset/duet-fieldset.d.ts

@@ -1,5 +1,5 @@
-import { ThemeableComponent } from "../../utils/themeable-component";
 import { DuetMargin, DuetTheme } from "../../common-types";
+import { ThemeableComponent } from "../../utils/themeable-component";
 /**
  * @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
  * @slot tooltip - Use to place a tooltip alongside the fieldset label.

package/lib/types/components/duet-footer/duet-footer.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetMargin, DuetLanguage, DuetAnalyticsEvent } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetAnalyticsEvent, DuetLanguage, DuetMargin, DuetTheme } from "../../common-types";
 import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetFooterVariation = "default" | "simple";
 export declare type DuetFooterItem = {
   label: string;
@@ -49,6 +49,8 @@ export declare class DuetFooter implements ThemeableComponent {
   /**
    * The currently active language. This setting changes the logo to match the
    * chosen language.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**
@@ -60,10 +62,12 @@ export declare class DuetFooter implements ThemeableComponent {
   /**
    * Property to change accessibleLabelExternal defaults on the component.
    * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
-  accessibleLabelExternalDefaults: DuetLangObject;
+  accessibleLabelExternalDefaults: DuetLangObject | string;
   /**
    * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
   accessibleLabelExternal: string;
   /**

package/lib/types/components/duet-grid-item/duet-grid-item.d.ts

@@ -1,4 +1,4 @@
-import { DuetTheme, DuetMargin, DuetGridBreakpoint } from "../../common-types";
+import { DuetGridBreakpoint, DuetMargin, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare class DuetGridItem implements ThemeableComponent {
   /**

package/lib/types/components/duet-header/duet-header.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetLanguage, DuetTheme, DuetAnalyticsEvent } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetAnalyticsEvent, DuetLanguage, DuetTheme } from "../../common-types";
 import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetHeaderItem = {
   id?: string;
   href: string;
@@ -70,34 +70,76 @@ export declare class DuetHeader implements ThemeableComponent {
   /**
    * The currently active language. This setting also changes the logo to match
    * the chosen language.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**
-   * Property to change accessibleI18nLabels defaults on the component.
-   * normally you would handle these strings on an application level and override @accessibleI18nLabels when needed
-   */
-  accessibleI18nLabelsDefault: Record<DuetLanguage, I18nText>;
+   * Default strings for accessibleI18nLabels
+   * @default {
+    fi: {
+      skipLabel: "Siirry pääsisältöön",
+      changeLanguage: "Vaihda kieltä",
+      activeLanguage: "Suomi valittuna",
+    },
+    sv: {
+      skipLabel: "Hoppa till huvudinnehåll",
+      changeLanguage: "Ändra Språk",
+      activeLanguage: "Svenska valt",
+    },
+    en: {
+      skipLabel: "Skip to main content",
+      changeLanguage: "Change language",
+      activeLanguage: "English selected",
+    },
+  }
+   */
+  accessibleI18nLabelsDefaults: string | Record<DuetLanguage, I18nText>;
   /**
    * Adds i18n translations of all internally used textStrings
+   * @default {
+    fi: {
+      skipLabel: "Siirry pääsisältöön",
+      changeLanguage: "Vaihda kieltä",
+      activeLanguage: "Suomi valittuna",
+    },
+    sv: {
+      skipLabel: "Hoppa till huvudinnehåll",
+      changeLanguage: "Ändra Språk",
+      activeLanguage: "Svenska valt",
+    },
+    en: {
+      skipLabel: "Skip to main content",
+      changeLanguage: "Change language",
+      activeLanguage: "English selected",
+    },
+  }
    */
   accessibleI18nLabels: I18nText;
   /**
    * Property to change accessibleLabelExternal defaults on the component.
    * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
-  accessibleLabelExternalDefaults: DuetLangObject;
+  accessibleLabelExternalDefaults: DuetLangObject | string;
   /**
    * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
   accessibleLabelExternal: string;
   /**
    * Property to change accessibleLabel defaults on the component.
    * normally you would handle these strings on an application level and override @accessibleLabel when needed
    */
-  accessibleLabelDefault: DuetLangObject;
+  accessibleLabelDefaults: DuetLangObject | string;
   /**
    * Accessible label that is shown for screen reader users in the mobile
    * navigation toggle. Not visible for normal users.
+   * @default {
+    fi: "Valikko",
+    sv: "Meny",
+    en: "Menu",
+  }
    */
   accessibleLabel: string;
   /**

package/lib/types/components/duet-heading/duet-heading.d.ts

@@ -1,4 +1,4 @@
-import { DuetHeadingLevel, DuetMargin, DuetColor, DuetTheme, DuetVisualHeadingLevel } from "../../common-types";
+import { DuetColor, DuetHeadingLevel, DuetMargin, DuetTheme, DuetVisualHeadingLevel } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetHeadingWeight = "auto" | "semibold";
 export declare class DuetHeading implements ThemeableComponent {

package/lib/types/components/duet-hero/duet-hero.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetLanguage, DuetHeadingLevel, DuetIconName, DuetColor, DuetAnalyticsEvent } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetAnalyticsEvent, DuetColor, DuetHeadingLevel, DuetIconName, DuetLanguage, DuetTheme } from "../../common-types";
 import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetHeroIconSize = "medium" | "large";
 export declare type DuetHeroVariation = "default" | "light" | "gray" | "image" | "minimal";
 export declare type DuetHeroBackData = {
@@ -98,15 +98,18 @@ export declare class DuetHero implements ThemeableComponent {
   /**
    * The currently active language. This setting changes the accessible labels to match the
    * chosen language.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**
-   * Property to change accessibleLabelExternal defaults on the component.
-   * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+   * Defaults for accessibleLabelExternal
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
-  accessibleLabelExternalDefaults: DuetLangObject;
+  accessibleLabelExternalDefaults: DuetLangObject | string;
   /**
    * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
   accessibleLabelExternal: string;
   /**

package/lib/types/components/duet-icon/duet-icon.d.ts

@@ -1,4 +1,4 @@
-import { DuetTheme, DuetIconName, DuetMargin, DuetColor } from "../../common-types";
+import { DuetColor, DuetIconName, DuetMargin, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetIconSize = "xxx-small" | "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large" | "xx-large" | "xxx-large" | "auto";
 export declare class DuetIcon implements ThemeableComponent {

package/lib/types/components/duet-input/duet-input.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetMargin, DuetIconName, DuetTooltipDirection } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetIconName, DuetMargin, DuetTheme, DuetTooltipDirection } from "../../common-types";
 import { InputComponent } from "../../utils/form-components";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetInputEvent = {
   originalEvent?: Event;
   value: string;

package/lib/types/components/duet-link/duet-link.d.ts

@@ -1,6 +1,6 @@
-import { DuetTheme, DuetLanguage } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetLanguage, DuetTheme } from "../../common-types";
 import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare class DuetLink implements ThemeableComponent {
   private nativeLink;
   /**
@@ -12,15 +12,18 @@ export declare class DuetLink implements ThemeableComponent {
   /**
    * The currently active language. This setting changes the external link
    * accessible label to match the chosen language.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**
-   * Property to change accessibleLabelExternal defaults on the component.
-   * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+   * Defaults for accessibleLabelExternal
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
-  accessibleLabelExternalDefaults: DuetLangObject;
+  accessibleLabelExternalDefaults: DuetLangObject | string;
   /**
    * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
+   * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
    */
   accessibleLabelExternal: string;
   /**

package/lib/types/components/duet-list/duet-list.d.ts

@@ -1,4 +1,4 @@
-import { DuetTheme, DuetMargin, DuetPadding } from "../../common-types";
+import { DuetMargin, DuetPadding, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetListVariation = "default" | "striped";
 export declare type DuetListMobileAlignment = "left" | "center";

package/lib/types/components/duet-logo/duet-logo.d.ts

@@ -1,4 +1,4 @@
-import { DuetTheme, DuetMargin, DuetLanguage } from "../../common-types";
+import { DuetLanguage, DuetMargin, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetLogoSize = "medium" | "large";
 export declare class DuetLogo implements ThemeableComponent {
@@ -33,6 +33,8 @@ export declare class DuetLogo implements ThemeableComponent {
   href: string;
   /**
    * The language of the logo.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**

package/lib/types/components/duet-modal/duet-modal.d.ts

@@ -1,12 +1,15 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetIconName, DuetColor, DuetHeadingLevel, DuetLanguage } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetColor, DuetHeadingLevel, DuetIconName, DuetLanguage, DuetTheme } from "../../common-types";
 import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetModalSize = "small" | "medium" | "large";
 export declare type DuetModalCloseEvent = {
   originalEvent: Event;
   component: "duet-modal";
 };
+/**
+ * @slot top - This is a slot that takes any content and will be displayed as the first thing in the hero area (typically an image)
+ */
 export declare class DuetModal implements ThemeableComponent {
   /**
    * Own Properties.
@@ -32,17 +35,20 @@ export declare class DuetModal implements ThemeableComponent {
   /**
    * The currently active language. This setting also changes the logo to match
    * the chosen language.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**
-   * Property to change accessibleCloseLabel defaults on the component.
-   * normally you would handle these strings on an application level and override @accessibleCloseLabel when needed
+   * Defaults for accessibleCloseLabel
+   * @default {fi: "Sulje ikkuna", sv: "Stäng fönstret", en: "Close the dialog", }
    */
-  accessibleCloseLabelDefault: DuetLangObject;
+  accessibleCloseLabelDefaults: DuetLangObject | string;
   /**
    * 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”.
+   * @default {fi: "Sulje ikkuna", sv: "Stäng fönstret", en: "Close the dialog", }
    */
   accessibleCloseLabel: string;
   /**

package/lib/types/components/duet-notification/duet-notification.d.ts

@@ -1,6 +1,6 @@
 import { DuetLanguage, DuetTheme } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
 import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare class DuetNotification implements ThemeableComponent {
   private linkElement;
   /**
@@ -10,6 +10,8 @@ export declare class DuetNotification implements ThemeableComponent {
   /**
    * The currently active language.
    * Used for announcing unread notifications to screen readers.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**
@@ -19,6 +21,7 @@ export declare class DuetNotification implements ThemeableComponent {
   accessibleLabelUnreadDefaults: DuetLangObject;
   /**
    * Adds accessible label for tooltip that is shown over unread counter
+   * @default { en: "Unread", fi: "Lukematon", sv: "Oläst" }
    */
   accessibleLabelUnread: string;
   /**

package/lib/types/components/duet-notification-drawer/duet-notification-drawer.d.ts

@@ -1,6 +1,6 @@
-import { ThemeableComponent } from "../../utils/themeable-component";
-import { DuetTheme, DuetIconName, DuetLanguage } from "../../common-types";
+import { DuetIconName, DuetLanguage, DuetTheme } from "../../common-types";
 import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetNotificationDrawerDirection = "left" | "right";
 export declare class DuetNotificationDrawer implements ThemeableComponent {
   /**
@@ -33,12 +33,13 @@ export declare class DuetNotificationDrawer implements ThemeableComponent {
    */
   language: DuetLanguage;
   /**
-   * Property to change accessibleLabelNotifications defaults on the component.
-   * normally you would handle these strings on an application level and override @accessibleLabelNotifications when needed
+   * Defaults for accessibleLabelNotifications
+   * @default {en: "No notifications", fi: "Ei ilmoituksia", sv: "Inga notifikationer"}
    */
-  accessibleLabelNotificationsDefaults: DuetLangObject;
+  accessibleLabelNotificationsDefaults: DuetLangObject | string;
   /**
    * Adds accessible label for tooltip that is shown for notifications
+   * @default {en: "No notifications", fi: "Ei ilmoituksia", sv: "Inga notifikationer"}
    */
   accessibleLabelNotifications: string;
   /**

package/lib/types/components/duet-number-input/duet-number-input.d.ts

@@ -1,7 +1,8 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetMargin, DuetLocale, DuetLanguage } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetLanguage, DuetLocale, DuetMargin, DuetTheme } from "../../common-types";
 import { DuetNumericInput } from "../../utils/form-components";
+import { DuetLangObject } from "../../utils/language-utils";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetNumberInputEvent = {
   originalEvent?: Event;
   component: "duet-number-input";
@@ -21,6 +22,8 @@ export declare class DuetNumberInput implements ThemeableComponent, DuetNumericI
   /**
    * The currently active language. This setting changes the accessible labels to match the
    * chosen language.
+   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+   * @default "fi"
    */
   language: DuetLanguage;
   /**
@@ -53,21 +56,39 @@ export declare class DuetNumberInput implements ThemeableComponent, DuetNumericI
    * Indicates the id of a component that describes the input.
    */
   accessibleDescribedBy: string;
+  /**
+   * Defaults for accessibleLive
+   * @default {fi: "{current} euroa valittuna", en: "{current} euros selected", sv: "{current} valda euro"}
+   */
+  accessibleLiveDefaults: DuetLangObject | 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"}
    */
   accessibleLive: string;
   /**
    * Disables the aria-live messaging used internally in this component. This could be useful when you want to use custom aria-live messages instead.
    */
   accessibleLiveEnabled: boolean;
+  /**
+   * Defaults for accessibleAdd
+   * @default {fi: "Lisää summaan", en: "Add to the amount", sv: "Lägg till beloppet"}
+   */
+  accessibleAddDefaults: DuetLangObject | string;
   /**
    * Accessible label for the add button that is read for screen reader users.
+   * @default {fi: "Lisää summaan", en: "Add to the amount", sv: "Lägg till beloppet"}
    */
   accessibleAdd: string;
+  /**
+   * Defaults for accessibleSubtract
+   * @default {fi: "Vähennä summasta", en: "Subtract from the amount", sv: "Dra från beloppet"}
+   */
+  accessibleSubtractDefaults: DuetLangObject | string;
   /**
    * Accessible label for the subtract button that is read for screen reader users.
+   * @default {fi: "Vähennä summasta", en: "Subtract from the amount", sv: "Dra från beloppet"}
    */
   accessibleSubtract: string;
   /**
@@ -90,8 +111,14 @@ export declare class DuetNumberInput implements ThemeableComponent, DuetNumericI
    * Minimum value.
    */
   min: number;
+  /**
+   * Defaults for Label
+   * @default  {fi: "Etiketti", en: "Label", sv: "Märka"}
+   */
+  labelDefaults: DuetLangObject | string;
   /**
    * Label for the number input.
+   * @default  {fi: "Etiketti", en: "Label", sv: "Märka"}
    */
   label: string;
   /**

package/lib/types/components/duet-paragraph/duet-paragraph.d.ts

@@ -1,4 +1,4 @@
-import { DuetTheme, DuetMargin, DuetColor } from "../../common-types";
+import { DuetColor, DuetMargin, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetParagraphSize = "small" | "medium";
 export declare type DuetParagraphVariation = "default" | "intro";

package/lib/types/components/duet-radio/duet-radio.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetMargin, DuetTheme, DuetDirection } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetDirection, DuetMargin, DuetTheme } from "../../common-types";
 import { InputComponent } from "../../utils/form-components";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetRadioEvent = {
   originalEvent?: Event;
   checked: boolean;

package/lib/types/components/duet-range-slider/duet-range-slider.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetMargin, DuetLocale } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetLocale, DuetMargin, DuetTheme } from "../../common-types";
 import { DuetNumericInput } from "../../utils/form-components";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetRangeChangeEvent = {
   originalEvent?: Event;
   component: "duet-range-slider";

package/lib/types/components/duet-select/duet-select.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { DuetMargin, DuetTheme, DuetTooltipDirection } from "../../common-types";
-import { ThemeableComponent } from "../../utils/themeable-component";
 import { InputComponent } from "../../utils/form-components";
+import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetSelectOption = {
   label: string;
   value: string;

package/lib/types/components/duet-step/duet-step.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetTheme, DuetHeadingLevel } from "../../common-types";
+import { DuetHeadingLevel, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
 export declare type DuetStepState = "current" | "complete" | "incomplete" | "disabled";
 export declare type DuetStepClickEvent = {

package/lib/types/components/duet-stepper/duet-stepper.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { DuetStepClickEvent } from "../duet-step/duet-step";
 import { DuetMargin, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../utils/themeable-component";
+import { DuetStepClickEvent } from "../duet-step/duet-step";
 export declare type DuetStepChangeEvent = {
   component: "duet-stepper";
   fromStep: number;