@duetds/components 6.2.3 → 6.2.5

package/lib/collection/components/duet-number-input/duet-number-input.js

@@ -3,7 +3,7 @@
  */
 import addIcon from "@duetds/icons/lib/assets/action-add";
 import subtractIcon from "@duetds/icons/lib/assets/action-subtract";
-import { Component, Element, Event, h, Host, Method, Prop, State } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common";
 import { createID } from "../../utils/create-id";
 import { isArrowDownKey, isArrowLeftKey, isArrowRightKey, isArrowUpKey, isBackspaceKey, } from "../../utils/keyboard-utils";
@@ -12,147 +12,6 @@ import { clamp, roundTo, SafeParseFloat } from "../../utils/math.utils";
 export class DuetNumberInput {
   constructor() {
     this.inputId = createID("DuetInput");
-    /**
-     * 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"
-     */
-    this.language = getLanguage();
-    /**
-     * Locale used to format the entered value.
-     */
-    this.locale = getLocale(this.language).locale;
-    /**
-     * Unit for the number input.
-     */
-    this.unit = getLocale(this.language).money;
-    /**
-     * Details of the component
-     */
-    this.accessibleDetails = undefined;
-    /**
-     * String of id's that indicate alternative labels elements
-     */
-    this.accessibleLabelledBy = undefined;
-    /**
-     * Aria description the button
-     */
-    this.accessibleDescription = undefined;
-    /**
-     * Defaults for accessibleLive
-     * @default {fi: "{current} euroa valittuna", en: "{current} euros selected", sv: "{current} valda euro"}
-     */
-    this.accessibleLiveDefaults = {
-      fi: "{current} euroa valittuna",
-      en: "{current} euros selected",
-      sv: "{current} euro valt",
-    };
-    /**
-     * 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"}
-     */
-    this.accessibleLive = getLocaleString(this.accessibleLiveDefaults, this.language);
-    /**
-     * Disables the aria-live messaging used internally in this component. This could be useful when you want to use custom aria-live messages instead.
-     */
-    this.accessibleLiveEnabled = true;
-    /**
-     * Defaults for accessibleAdd
-     * @default {fi: "Lisää summaan", en: "Add to the amount", sv: "Lägg till beloppet"}
-     */
-    this.accessibleAddDefaults = {
-      fi: "Lisää summaan",
-      en: "Add to the amount",
-      sv: "Lägg till beloppet",
-    };
-    /**
-     * 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"}
-     */
-    this.accessibleAdd = getLocaleString(this.accessibleAddDefaults, this.language);
-    /**
-     * Defaults for accessibleSubtract
-     * @default {fi: "Vähennä summasta", en: "Subtract from the amount", sv: "Dra från beloppet"}
-     */
-    this.accessibleSubtractDefaults = {
-      fi: "Vähennä summasta",
-      en: "Subtract from the amount",
-      sv: "Dra från beloppet",
-    };
-    /**
-     * 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"}
-     */
-    this.accessibleSubtract = getLocaleString(this.accessibleSubtractDefaults, this.language);
-    /**
-     * Theme of the input.
-     */
-    this.theme = "";
-    /**
-     * Controls the margin of the component.
-     */
-    this.margin = "auto";
-    /**
-     * Expands the input to fill 100% of the container width.
-     */
-    this.expand = false;
-    /**
-     * Minimum value.
-     */
-    this.min = 0;
-    /**
-     * Defaults for Label
-     * @default  {fi: "Etiketti", en: "Label", sv: "Märka"}
-     */
-    this.labelDefaults = {
-      fi: "Nimilappu",
-      en: "Label",
-      sv: "Etikett",
-    };
-    /**
-     * Label for the number input.
-     * @default  {fi: "Etiketti", en: "Label", sv: "Märka"}
-     */
-    this.label = getLocaleString(this.labelDefaults, this.language);
-    /**
-     * Visually hide the label, but still show it to screen readers.
-     */
-    this.labelHidden = false;
-    /**
-     * Maximum value.
-     */
-    this.max = 1000000;
-    /**
-     * Display the input in error state along with an error message.
-     */
-    this.error = "";
-    /**
-     * Tooltip to display next to the label of the input.
-     */
-    this.tooltip = "";
-    /**
-     * Step amount.
-     */
-    this.step = 5000;
-    /**
-     * Controls whether or not value gets rounded to the nearest
-     * multiple of a step on blur. Set to "false" to disable this behaviour.
-     */
-    this.rounding = true;
-    /**
-     * Makes the number input component disabled. This prevents users from being able to
-     * interact with the input, and conveys its inactive state to assistive technologies.
-     */
-    this.disabled = false;
-    /**
-     * 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.
-     */
-    this.required = false;
     /**
      * Component event handling.
      */
@@ -292,6 +151,58 @@ export class DuetNumberInput {
       this.value = this.localizeValue(newValue);
       this.emitChange(ev);
     };
+    this.language = getLanguage();
+    this.locale = getLocale(this.language).locale;
+    this.unit = getLocale(this.language).money;
+    this.focusedValue = undefined;
+    this.accessibleActiveDescendant = undefined;
+    this.accessibleControls = undefined;
+    this.accessibleDetails = undefined;
+    this.accessibleLabelledBy = undefined;
+    this.accessibleDescription = undefined;
+    this.accessibleOwns = undefined;
+    this.accessibleDescribedBy = undefined;
+    this.accessibleLiveDefaults = {
+      fi: "{current} euroa valittuna",
+      en: "{current} euros selected",
+      sv: "{current} euro valt",
+    };
+    this.accessibleLive = getLocaleString(this.accessibleLiveDefaults, this.language);
+    this.accessibleLiveEnabled = true;
+    this.accessibleAddDefaults = {
+      fi: "Lisää summaan",
+      en: "Add to the amount",
+      sv: "Lägg till beloppet",
+    };
+    this.accessibleAdd = getLocaleString(this.accessibleAddDefaults, this.language);
+    this.accessibleSubtractDefaults = {
+      fi: "Vähennä summasta",
+      en: "Subtract from the amount",
+      sv: "Dra från beloppet",
+    };
+    this.accessibleSubtract = getLocaleString(this.accessibleSubtractDefaults, this.language);
+    this.theme = "";
+    this.margin = "auto";
+    this.expand = false;
+    this.identifier = undefined;
+    this.min = 0;
+    this.labelDefaults = {
+      fi: "Nimilappu",
+      en: "Label",
+      sv: "Etikett",
+    };
+    this.label = getLocaleString(this.labelDefaults, this.language);
+    this.labelHidden = false;
+    this.max = 1000000;
+    this.name = undefined;
+    this.error = "";
+    this.tooltip = "";
+    this.step = 5000;
+    this.rounding = true;
+    this.role = undefined;
+    this.disabled = false;
+    this.required = false;
+    this.value = undefined;
   }
   /**
    * Component lifecycle events.
@@ -333,829 +244,825 @@ export class DuetNumberInput {
         "duet-theme-turva": this.theme === "turva",
         "duet-expand": this.expand,
         "duet-m-0": this.margin === "none",
-      } },
-      h("div", { class: "duet-number-container" },
-        h("duet-input", { ref: input => (this.duetInputElement = input), onDuetChange: event => this.handleChange(event), onDuetFocus: this.handleFocus, onDuetBlur: event => this.handleBlur(event), onKeyDown: event => this.handleKeyDown(event), label: this.label, value: this.value ? `${this.value} ${this.unit}` : "", error: this.error, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": cleanedValue != null ? cleanedValue : "", maxlength: maxlength, name: this.name, component: "number", required: this.required, disabled: this.disabled, role: this.role, labelHidden: this.labelHidden, tooltip: this.tooltip, identifier: identifier, theme: this.theme, margin: "none", expand: true, numericKeyboard: true, autoComplete: "off", type: "text", accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleLabelledBy: this.accessibleLabelledBy, accessibleDescription: this.accessibleDescription, accessibleDetails: this.accessibleDetails, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy },
-          h("div", { class: { "duet-number-buttons": true, "duet-no-label": this.labelHidden } },
-            h("button", { "aria-controls": identifier, disabled: this.disabled, "aria-disabled": cleanedValue == null || cleanedValue === this.min ? "true" : "false", class: "duet-number-button duet-number-button-subtract", onClick: this.subtract, type: "button" },
-              h("duet-visually-hidden", null,
-                this.accessibleSubtract,
-                " ",
-                this.step),
-              h("duet-icon", { icon: subtractIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })),
-            h("button", { "aria-controls": identifier, disabled: this.disabled, "aria-disabled": cleanedValue === this.max ? "true" : "false", class: "duet-number-button duet-number-button-add", onClick: this.add, type: "button" },
-              h("duet-visually-hidden", null,
-                this.accessibleAdd,
-                " ",
-                this.step),
-              h("duet-icon", { icon: addIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })))),
-        this.accessibleLiveEnabled && (h("duet-visually-hidden", { "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement())))));
+      } }, h("div", { class: "duet-number-container" }, h("duet-input", { ref: input => (this.duetInputElement = input), onDuetChange: event => this.handleChange(event), onDuetFocus: this.handleFocus, onDuetBlur: event => this.handleBlur(event), onKeyDown: event => this.handleKeyDown(event), label: this.label, value: this.value ? `${this.value} ${this.unit}` : "", error: this.error, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": cleanedValue != null ? cleanedValue : "", maxlength: maxlength, name: this.name, component: "number", required: this.required, disabled: this.disabled, role: this.role, labelHidden: this.labelHidden, tooltip: this.tooltip, identifier: identifier, theme: this.theme, margin: "none", expand: true, numericKeyboard: true, autoComplete: "off", type: "text", accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleLabelledBy: this.accessibleLabelledBy, accessibleDescription: this.accessibleDescription, accessibleDetails: this.accessibleDetails, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy }, h("div", { class: { "duet-number-buttons": true, "duet-no-label": this.labelHidden } }, h("button", { "aria-controls": identifier, disabled: this.disabled, "aria-disabled": cleanedValue == null || cleanedValue === this.min ? "true" : "false", class: "duet-number-button duet-number-button-subtract", onClick: this.subtract, type: "button" }, h("duet-visually-hidden", null, this.accessibleSubtract, " ", this.step), h("duet-icon", { icon: subtractIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })), h("button", { "aria-controls": identifier, disabled: this.disabled, "aria-disabled": cleanedValue === this.max ? "true" : "false", class: "duet-number-button duet-number-button-add", onClick: this.add, type: "button" }, h("duet-visually-hidden", null, this.accessibleAdd, " ", this.step), h("duet-icon", { icon: addIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })))), this.accessibleLiveEnabled && (h("duet-visually-hidden", { "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement())))));
   }
   static get is() { return "duet-number-input"; }
   static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["duet-number-input.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["duet-number-input.css"]
-  }; }
-  static get properties() { return {
-    "language": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "DuetLanguage",
-        "resolved": "\"en\" | \"fi\" | \"sv\"",
-        "references": {
-          "DuetLanguage": {
-            "location": "import",
-            "path": "../../common-types"
+  static get originalStyleUrls() {
+    return {
+      "$": ["duet-number-input.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["duet-number-input.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "language": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "DuetLanguage",
+          "resolved": "\"en\" | \"fi\" | \"sv\"",
+          "references": {
+            "DuetLanguage": {
+              "location": "import",
+              "path": "../../common-types"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "deprecated",
-            "text": "this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing"
-          }, {
-            "name": "default",
-            "text": "\"fi\""
-          }],
-        "text": "The currently active language. This setting changes the accessible labels to match the\nchosen language."
-      },
-      "attribute": "language",
-      "reflect": false,
-      "defaultValue": "getLanguage()"
-    },
-    "locale": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "DuetLocale",
-        "resolved": "\"en-GB\" | \"en-US\" | \"fi-FI\" | \"sv-SE\"",
-        "references": {
-          "DuetLocale": {
-            "location": "import",
-            "path": "../../common-types"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "deprecated",
+              "text": "this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing"
+            }, {
+              "name": "default",
+              "text": "\"fi\""
+            }],
+          "text": "The currently active language. This setting changes the accessible labels to match the\nchosen language."
+        },
+        "attribute": "language",
+        "reflect": false,
+        "defaultValue": "getLanguage()"
+      },
+      "locale": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "DuetLocale",
+          "resolved": "\"en-GB\" | \"en-US\" | \"fi-FI\" | \"sv-SE\"",
+          "references": {
+            "DuetLocale": {
+              "location": "import",
+              "path": "../../common-types"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Locale used to format the entered value."
-      },
-      "attribute": "locale",
-      "reflect": false,
-      "defaultValue": "getLocale(this.language).locale"
-    },
-    "unit": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Unit for the number input."
-      },
-      "attribute": "unit",
-      "reflect": false,
-      "defaultValue": "getLocale(this.language).money"
-    },
-    "accessibleActiveDescendant": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Indicates the id of a related component\u2019s visually focused element."
-      },
-      "attribute": "accessible-active-descendant",
-      "reflect": false
-    },
-    "accessibleControls": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Use this prop to add an aria-controls attribute. Use the attribute to\nindicate the id of a component controlled by this component."
-      },
-      "attribute": "accessible-controls",
-      "reflect": false
-    },
-    "accessibleDetails": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Details of the component"
-      },
-      "attribute": "accessible-details",
-      "reflect": false,
-      "defaultValue": "undefined"
-    },
-    "accessibleLabelledBy": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "String of id's that indicate alternative labels elements"
-      },
-      "attribute": "accessible-labelled-by",
-      "reflect": false,
-      "defaultValue": "undefined"
-    },
-    "accessibleDescription": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Aria description the button"
-      },
-      "attribute": "accessible-description",
-      "reflect": false,
-      "defaultValue": "undefined"
-    },
-    "accessibleOwns": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Indicates the id of a component owned by the input."
-      },
-      "attribute": "accessible-owns",
-      "reflect": false
-    },
-    "accessibleDescribedBy": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Indicates the id of a component that describes the input."
-      },
-      "attribute": "accessible-described-by",
-      "reflect": false
-    },
-    "accessibleLiveDefaults": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "DuetLangObject | string",
-        "resolved": "DuetLangObject | string",
-        "references": {
-          "DuetLangObject": {
-            "location": "import",
-            "path": "../../utils/language-utils"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Locale used to format the entered value."
+        },
+        "attribute": "locale",
+        "reflect": false,
+        "defaultValue": "getLocale(this.language).locale"
+      },
+      "unit": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Unit for the number input."
+        },
+        "attribute": "unit",
+        "reflect": false,
+        "defaultValue": "getLocale(this.language).money"
+      },
+      "accessibleActiveDescendant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Indicates the id of a related component\u2019s visually focused element."
+        },
+        "attribute": "accessible-active-descendant",
+        "reflect": false
+      },
+      "accessibleControls": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Use this prop to add an aria-controls attribute. Use the attribute to\nindicate the id of a component controlled by this component."
+        },
+        "attribute": "accessible-controls",
+        "reflect": false
+      },
+      "accessibleDetails": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Details of the component"
+        },
+        "attribute": "accessible-details",
+        "reflect": false,
+        "defaultValue": "undefined"
+      },
+      "accessibleLabelledBy": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "String of id's that indicate alternative labels elements"
+        },
+        "attribute": "accessible-labelled-by",
+        "reflect": false,
+        "defaultValue": "undefined"
+      },
+      "accessibleDescription": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Aria description the button"
+        },
+        "attribute": "accessible-description",
+        "reflect": false,
+        "defaultValue": "undefined"
+      },
+      "accessibleOwns": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Indicates the id of a component owned by the input."
+        },
+        "attribute": "accessible-owns",
+        "reflect": false
+      },
+      "accessibleDescribedBy": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Indicates the id of a component that describes the input."
+        },
+        "attribute": "accessible-described-by",
+        "reflect": false
+      },
+      "accessibleLiveDefaults": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "DuetLangObject | string",
+          "resolved": "DuetLangObject | string",
+          "references": {
+            "DuetLangObject": {
+              "location": "import",
+              "path": "../../utils/language-utils"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"{current} euroa valittuna\", en: \"{current} euros selected\", sv: \"{current} valda euro\"}"
-          }],
-        "text": "Defaults for accessibleLive"
-      },
-      "attribute": "accessible-live-default",
-      "reflect": false,
-      "defaultValue": "{\n    fi: \"{current} euroa valittuna\",\n    en: \"{current} euros selected\",\n    sv: \"{current} euro valt\",\n  }"
-    },
-    "accessibleLive": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"{current} euroa valittuna\", en: \"{current} euros selected\", sv: \"{current} valda euro\"}"
-          }],
-        "text": "Format of message used to announce current amount when switching between amounts.\nThe string {current} is replaced with the current amount."
-      },
-      "attribute": "accessible-live",
-      "reflect": false,
-      "defaultValue": "getLocaleString(this.accessibleLiveDefaults, this.language)"
-    },
-    "accessibleLiveEnabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Disables the aria-live messaging used internally in this component. This could be useful when you want to use custom aria-live messages instead."
-      },
-      "attribute": "accessible-live-enabled",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "accessibleAddDefaults": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "DuetLangObject | string",
-        "resolved": "DuetLangObject | string",
-        "references": {
-          "DuetLangObject": {
-            "location": "import",
-            "path": "../../utils/language-utils"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"{current} euroa valittuna\", en: \"{current} euros selected\", sv: \"{current} valda euro\"}"
+            }],
+          "text": "Defaults for accessibleLive"
+        },
+        "attribute": "accessible-live-default",
+        "reflect": false,
+        "defaultValue": "{\n    fi: \"{current} euroa valittuna\",\n    en: \"{current} euros selected\",\n    sv: \"{current} euro valt\",\n  }"
+      },
+      "accessibleLive": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"{current} euroa valittuna\", en: \"{current} euros selected\", sv: \"{current} valda euro\"}"
+            }],
+          "text": "Format of message used to announce current amount when switching between amounts.\nThe string {current} is replaced with the current amount."
+        },
+        "attribute": "accessible-live",
+        "reflect": false,
+        "defaultValue": "getLocaleString(this.accessibleLiveDefaults, this.language)"
+      },
+      "accessibleLiveEnabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Disables the aria-live messaging used internally in this component. This could be useful when you want to use custom aria-live messages instead."
+        },
+        "attribute": "accessible-live-enabled",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "accessibleAddDefaults": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "DuetLangObject | string",
+          "resolved": "DuetLangObject | string",
+          "references": {
+            "DuetLangObject": {
+              "location": "import",
+              "path": "../../utils/language-utils"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"Lis\u00E4\u00E4 summaan\", en: \"Add to the amount\", sv: \"L\u00E4gg till beloppet\"}"
-          }],
-        "text": "Defaults for accessibleAdd"
-      },
-      "attribute": "accessible-add-default",
-      "reflect": false,
-      "defaultValue": "{\n    fi: \"Lis\u00E4\u00E4 summaan\",\n    en: \"Add to the amount\",\n    sv: \"L\u00E4gg till beloppet\",\n  }"
-    },
-    "accessibleAdd": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"Lis\u00E4\u00E4 summaan\", en: \"Add to the amount\", sv: \"L\u00E4gg till beloppet\"}"
-          }],
-        "text": "Accessible label for the add button that is read for screen reader users."
-      },
-      "attribute": "accessible-add",
-      "reflect": false,
-      "defaultValue": "getLocaleString(this.accessibleAddDefaults, this.language)"
-    },
-    "accessibleSubtractDefaults": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "DuetLangObject | string",
-        "resolved": "DuetLangObject | string",
-        "references": {
-          "DuetLangObject": {
-            "location": "import",
-            "path": "../../utils/language-utils"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"Lis\u00E4\u00E4 summaan\", en: \"Add to the amount\", sv: \"L\u00E4gg till beloppet\"}"
+            }],
+          "text": "Defaults for accessibleAdd"
+        },
+        "attribute": "accessible-add-default",
+        "reflect": false,
+        "defaultValue": "{\n    fi: \"Lis\u00E4\u00E4 summaan\",\n    en: \"Add to the amount\",\n    sv: \"L\u00E4gg till beloppet\",\n  }"
+      },
+      "accessibleAdd": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"Lis\u00E4\u00E4 summaan\", en: \"Add to the amount\", sv: \"L\u00E4gg till beloppet\"}"
+            }],
+          "text": "Accessible label for the add button that is read for screen reader users."
+        },
+        "attribute": "accessible-add",
+        "reflect": false,
+        "defaultValue": "getLocaleString(this.accessibleAddDefaults, this.language)"
+      },
+      "accessibleSubtractDefaults": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "DuetLangObject | string",
+          "resolved": "DuetLangObject | string",
+          "references": {
+            "DuetLangObject": {
+              "location": "import",
+              "path": "../../utils/language-utils"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"V\u00E4henn\u00E4 summasta\", en: \"Subtract from the amount\", sv: \"Dra fr\u00E5n beloppet\"}"
-          }],
-        "text": "Defaults for accessibleSubtract"
-      },
-      "attribute": "accessible-subtract-defaults",
-      "reflect": false,
-      "defaultValue": "{\n    fi: \"V\u00E4henn\u00E4 summasta\",\n    en: \"Subtract from the amount\",\n    sv: \"Dra fr\u00E5n beloppet\",\n  }"
-    },
-    "accessibleSubtract": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"V\u00E4henn\u00E4 summasta\", en: \"Subtract from the amount\", sv: \"Dra fr\u00E5n beloppet\"}"
-          }],
-        "text": "Accessible label for the subtract button that is read for screen reader users."
-      },
-      "attribute": "accessible-subtract",
-      "reflect": false,
-      "defaultValue": "getLocaleString(this.accessibleSubtractDefaults, this.language)"
-    },
-    "theme": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "DuetTheme",
-        "resolved": "\"\" | \"default\" | \"turva\"",
-        "references": {
-          "DuetTheme": {
-            "location": "import",
-            "path": "../../common-types"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"V\u00E4henn\u00E4 summasta\", en: \"Subtract from the amount\", sv: \"Dra fr\u00E5n beloppet\"}"
+            }],
+          "text": "Defaults for accessibleSubtract"
+        },
+        "attribute": "accessible-subtract-defaults",
+        "reflect": false,
+        "defaultValue": "{\n    fi: \"V\u00E4henn\u00E4 summasta\",\n    en: \"Subtract from the amount\",\n    sv: \"Dra fr\u00E5n beloppet\",\n  }"
+      },
+      "accessibleSubtract": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"V\u00E4henn\u00E4 summasta\", en: \"Subtract from the amount\", sv: \"Dra fr\u00E5n beloppet\"}"
+            }],
+          "text": "Accessible label for the subtract button that is read for screen reader users."
+        },
+        "attribute": "accessible-subtract",
+        "reflect": false,
+        "defaultValue": "getLocaleString(this.accessibleSubtractDefaults, this.language)"
+      },
+      "theme": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "DuetTheme",
+          "resolved": "\"\" | \"default\" | \"turva\"",
+          "references": {
+            "DuetTheme": {
+              "location": "import",
+              "path": "../../common-types"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Theme of the input."
-      },
-      "attribute": "theme",
-      "reflect": false,
-      "defaultValue": "\"\""
-    },
-    "margin": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "DuetMargin",
-        "resolved": "\"auto\" | \"none\"",
-        "references": {
-          "DuetMargin": {
-            "location": "import",
-            "path": "../../common-types"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Theme of the input."
+        },
+        "attribute": "theme",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "margin": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "DuetMargin",
+          "resolved": "\"auto\" | \"none\"",
+          "references": {
+            "DuetMargin": {
+              "location": "import",
+              "path": "../../common-types"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Controls the margin of the component."
-      },
-      "attribute": "margin",
-      "reflect": false,
-      "defaultValue": "\"auto\""
-    },
-    "expand": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Expands the input to fill 100% of the container width."
-      },
-      "attribute": "expand",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "identifier": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Adds a unique identifier for the input."
-      },
-      "attribute": "identifier",
-      "reflect": false
-    },
-    "min": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Minimum value."
-      },
-      "attribute": "min",
-      "reflect": false,
-      "defaultValue": "0"
-    },
-    "labelDefaults": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "DuetLangObject | string",
-        "resolved": "DuetLangObject | string",
-        "references": {
-          "DuetLangObject": {
-            "location": "import",
-            "path": "../../utils/language-utils"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Controls the margin of the component."
+        },
+        "attribute": "margin",
+        "reflect": false,
+        "defaultValue": "\"auto\""
+      },
+      "expand": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Expands the input to fill 100% of the container width."
+        },
+        "attribute": "expand",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "identifier": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Adds a unique identifier for the input."
+        },
+        "attribute": "identifier",
+        "reflect": false
+      },
+      "min": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Minimum value."
+        },
+        "attribute": "min",
+        "reflect": false,
+        "defaultValue": "0"
+      },
+      "labelDefaults": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "DuetLangObject | string",
+          "resolved": "DuetLangObject | string",
+          "references": {
+            "DuetLangObject": {
+              "location": "import",
+              "path": "../../utils/language-utils"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"Etiketti\", en: \"Label\", sv: \"M\u00E4rka\"}"
-          }],
-        "text": "Defaults for Label"
-      },
-      "attribute": "label-default",
-      "reflect": false,
-      "defaultValue": "{\n    fi: \"Nimilappu\",\n    en: \"Label\",\n    sv: \"Etikett\",\n  }"
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: \"Etiketti\", en: \"Label\", sv: \"M\u00E4rka\"}"
-          }],
-        "text": "Label for the number input."
-      },
-      "attribute": "label",
-      "reflect": false,
-      "defaultValue": "getLocaleString(this.labelDefaults, this.language)"
-    },
-    "labelHidden": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Visually hide the label, but still show it to screen readers."
-      },
-      "attribute": "label-hidden",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "max": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Maximum value."
-      },
-      "attribute": "max",
-      "reflect": false,
-      "defaultValue": "1000000"
-    },
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Name of the input."
-      },
-      "attribute": "name",
-      "reflect": false
-    },
-    "error": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Display the input in error state along with an error message."
-      },
-      "attribute": "error",
-      "reflect": false,
-      "defaultValue": "\"\""
-    },
-    "tooltip": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Tooltip to display next to the label of the input."
-      },
-      "attribute": "tooltip",
-      "reflect": false,
-      "defaultValue": "\"\""
-    },
-    "step": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Step amount."
-      },
-      "attribute": "step",
-      "reflect": false,
-      "defaultValue": "5000"
-    },
-    "rounding": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Controls whether or not value gets rounded to the nearest\nmultiple of a step on blur. Set to \"false\" to disable this behaviour."
-      },
-      "attribute": "rounding",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "role": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Defines a specific role attribute for the input."
-      },
-      "attribute": "role",
-      "reflect": false
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Makes the number input component disabled. This prevents users from being able to\ninteract with the input, and conveys its inactive state to assistive technologies."
-      },
-      "attribute": "disabled",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "required": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Set whether the input is required or not. Please note that this is required for\naccessible inputs when the user is required to fill them. When using this property\nyou need to also set \u201Cnovalidate\u201D attribute to your form element to prevent\nbrowser from displaying its own validation errors."
-      },
-      "attribute": "required",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "value": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Value of the input. This is passed as a string since Number Input uses Duet\u2019s Input component internally and we need the value to support spaces and the unit as well."
-      },
-      "attribute": "value",
-      "reflect": false
-    }
-  }; }
-  static get states() { return {
-    "focusedValue": {}
-  }; }
-  static get events() { return [{
-      "method": "duetChange",
-      "name": "duetChange",
-      "bubbles": false,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emitted when the value has changed."
-      },
-      "complexType": {
-        "original": "DuetNumberInputEvent",
-        "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
-        "references": {
-          "DuetNumberInputEvent": {
-            "location": "local"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"Etiketti\", en: \"Label\", sv: \"M\u00E4rka\"}"
+            }],
+          "text": "Defaults for Label"
+        },
+        "attribute": "label-default",
+        "reflect": false,
+        "defaultValue": "{\n    fi: \"Nimilappu\",\n    en: \"Label\",\n    sv: \"Etikett\",\n  }"
+      },
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: \"Etiketti\", en: \"Label\", sv: \"M\u00E4rka\"}"
+            }],
+          "text": "Label for the number input."
+        },
+        "attribute": "label",
+        "reflect": false,
+        "defaultValue": "getLocaleString(this.labelDefaults, this.language)"
+      },
+      "labelHidden": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Visually hide the label, but still show it to screen readers."
+        },
+        "attribute": "label-hidden",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "max": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Maximum value."
+        },
+        "attribute": "max",
+        "reflect": false,
+        "defaultValue": "1000000"
+      },
+      "name": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Name of the input."
+        },
+        "attribute": "name",
+        "reflect": false
+      },
+      "error": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Display the input in error state along with an error message."
+        },
+        "attribute": "error",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "tooltip": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Tooltip to display next to the label of the input."
+        },
+        "attribute": "tooltip",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "step": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Step amount."
+        },
+        "attribute": "step",
+        "reflect": false,
+        "defaultValue": "5000"
+      },
+      "rounding": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Controls whether or not value gets rounded to the nearest\nmultiple of a step on blur. Set to \"false\" to disable this behaviour."
+        },
+        "attribute": "rounding",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "role": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Defines a specific role attribute for the input."
+        },
+        "attribute": "role",
+        "reflect": false
+      },
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Makes the number input component disabled. This prevents users from being able to\ninteract with the input, and conveys its inactive state to assistive technologies."
+        },
+        "attribute": "disabled",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "required": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Set whether the input is required or not. Please note that this is required for\naccessible inputs when the user is required to fill them. When using this property\nyou need to also set \u201Cnovalidate\u201D attribute to your form element to prevent\nbrowser from displaying its own validation errors."
+        },
+        "attribute": "required",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "value": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Value of the input. This is passed as a string since Number Input uses Duet\u2019s Input component internally and we need the value to support spaces and the unit as well."
+        },
+        "attribute": "value",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "focusedValue": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "duetChange",
+        "name": "duetChange",
+        "bubbles": false,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when the value has changed."
+        },
+        "complexType": {
+          "original": "DuetNumberInputEvent",
+          "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
+          "references": {
+            "DuetNumberInputEvent": {
+              "location": "local"
+            }
           }
         }
-      }
-    }, {
-      "method": "duetInput",
-      "name": "duetInput",
-      "bubbles": false,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emitted when a keyboard input has ocurred."
-      },
-      "complexType": {
-        "original": "DuetNumberInputEvent",
-        "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
-        "references": {
-          "DuetNumberInputEvent": {
-            "location": "local"
+      }, {
+        "method": "duetInput",
+        "name": "duetInput",
+        "bubbles": false,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when a keyboard input has ocurred."
+        },
+        "complexType": {
+          "original": "DuetNumberInputEvent",
+          "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
+          "references": {
+            "DuetNumberInputEvent": {
+              "location": "local"
+            }
           }
         }
-      }
-    }, {
-      "method": "duetBlur",
-      "name": "duetBlur",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emitted when the input loses focus."
-      },
-      "complexType": {
-        "original": "DuetNumberInputEvent",
-        "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
-        "references": {
-          "DuetNumberInputEvent": {
-            "location": "local"
+      }, {
+        "method": "duetBlur",
+        "name": "duetBlur",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when the input loses focus."
+        },
+        "complexType": {
+          "original": "DuetNumberInputEvent",
+          "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
+          "references": {
+            "DuetNumberInputEvent": {
+              "location": "local"
+            }
           }
         }
-      }
-    }, {
-      "method": "duetFocus",
-      "name": "duetFocus",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emitted when the input has focus."
-      },
-      "complexType": {
-        "original": "DuetNumberInputEvent",
-        "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
-        "references": {
-          "DuetNumberInputEvent": {
-            "location": "local"
+      }, {
+        "method": "duetFocus",
+        "name": "duetFocus",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when the input has focus."
+        },
+        "complexType": {
+          "original": "DuetNumberInputEvent",
+          "resolved": "{ originalEvent?: Event; component: \"duet-number-input\"; value: string; valueAsNumber: number; }",
+          "references": {
+            "DuetNumberInputEvent": {
+              "location": "local"
+            }
           }
         }
-      }
-    }]; }
-  static get methods() { return {
-    "setFocus": {
-      "complexType": {
-        "signature": "(options?: FocusOptions) => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
+      }];
+  }
+  static get methods() {
+    return {
+      "setFocus": {
+        "complexType": {
+          "signature": "(options?: FocusOptions) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "FocusOptions": {
+              "location": "global"
+            }
           },
-          "FocusOptions": {
-            "location": "global"
-          }
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "Sets focus on the specified `duet-number-input`. Use this method instead of the global\n`input.focus()`.",
-        "tags": []
+        "docs": {
+          "text": "Sets focus on the specified `duet-number-input`. Use this method instead of the global\n`input.focus()`.",
+          "tags": []
+        }
       }
-    }
-  }; }
+    };
+  }
   static get elementRef() { return "element"; }
 }