npm - @esri/calcite-components - Versions diffs - 1.0.0-beta.95 → 1.0.0-beta.97 - Mend

@esri/calcite-components 1.0.0-beta.95 → 1.0.0-beta.97

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1190) hide show

package/dist/collection/components/input-number/input-number.js CHANGED Viewed

@@ -1,21 +1,20 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.95
+ * v1.0.0-beta.97
  */
-import { Component, Element, Event, h, Host, Method, Prop, State, Watch } from "@stencil/core";
-import { getElementDir, getElementProp, getSlotted, setRequestedIcon } from "../../utils/dom";
+import { h, Host } from "@stencil/core";
+import { getElementDir, getElementProp, getSlotted, isPrimaryPointerButton, setRequestedIcon } from "../../utils/dom";
 import { CSS, SLOTS, TEXT } from "./resources";
 import { connectLabel, disconnectLabel, getLabelText } from "../../utils/label";
 import { connectForm, disconnectForm, HiddenFormInputSlot, submitForm } from "../../utils/form";
-import { delocalizeNumberString, getLocale, getDecimalSeparator, localizeNumberString } from "../../utils/locale";
+import { numberStringFormatter, defaultNumberingSystem, disconnectLocalized, connectLocalized, updateEffectiveLocale } from "../../utils/locale";
 import { numberKeys } from "../../utils/key";
 import { isValidNumber, parseNumberString, sanitizeNumberString } from "../../utils/number";
 import { CSS_UTILITY, TEXT as COMMON_TEXT } from "../../utils/resources";
 import { decimalPlaces } from "../../utils/math";
 import { createObserver } from "../../utils/observers";
 import { updateHostInteraction } from "../../utils/interactive";
-import { unwatchGlobalAttributes, watchGlobalAttributes } from "../../utils/globalAttributes";
 /**
  * @slot action - A slot for positioning a button next to the component.
  */
@@ -29,27 +28,27 @@ export class InputNumber {
     /** Specifies the text alignment of the component's value. */
     this.alignment = "start";
     /**
-     * When true, the component is focused on page load.
+     * When `true`, the component is focused on page load.
      *
      * @mdn [autofocus](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)
      */
     this.autofocus = false;
     /**
-     * When true, a clear button is displayed when the component has a value.
+     * When `true`, a clear button is displayed when the component has a value.
      */
     this.clearable = false;
     /**
-     * When true, interaction is prevented and the component is displayed with lower opacity.
+     * When `true`, interaction is prevented and the component is displayed with lower opacity.
      *
      * @mdn [disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled)
      */
     this.disabled = false;
     /**
-     * When true, number values are displayed with the locale's group separator.
+     * When `true`, number values are displayed with a group separator corresponding to the language and country format.
      */
     this.groupSeparator = false;
     /**
-     * When true, the component will not be visible.
+     * When `true`, the component will not be visible.
      *
      * @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
      */
@@ -60,9 +59,9 @@ export class InputNumber {
      * @default "Loading"
      */
     this.intlLoading = COMMON_TEXT.loading;
-    /** When true, the icon is flipped in RTL. */
+    /** When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`). */
     this.iconFlipRtl = false;
-    /** When true, the component is in the loading state and `calcite-progress` is displayed. */
+    /** When `true`, the component is in the loading state and `calcite-progress` is displayed. */
     this.loading = false;
     /**
      * Toggles locale formatting for numbers.
@@ -73,12 +72,12 @@ export class InputNumber {
     /** Specifies the placement of the buttons. */
     this.numberButtonType = "vertical";
     /**
-     * When true, the value cannot be modified.
+     * When `true`, the component's value can be read, but cannot be modified.
      *
      * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
      */
     this.readOnly = false;
-    /** When true, the component must have a value in order for the form to submit. */
+    /** When `true`, the component must have a value in order for the form to submit. */
     this.required = false;
     /** Specifies the size of the component. */
     this.scale = "m";
@@ -98,7 +97,7 @@ export class InputNumber {
     //  State
     //
     //--------------------------------------------------------------------------
-    this.globalAttributes = {};
+    this.effectiveLocale = "";
     //--------------------------------------------------------------------------
     //
     //  Private Methods
@@ -148,7 +147,12 @@ export class InputNumber {
         return;
       }
       const value = nativeEvent.target.value;
-      const delocalizedValue = delocalizeNumberString(value, getLocale(this));
+      numberStringFormatter.numberFormatOptions = {
+        locale: this.effectiveLocale,
+        numberingSystem: this.numberingSystem,
+        useGrouping: this.groupSeparator
+      };
+      const delocalizedValue = numberStringFormatter.delocalize(value);
       if (nativeEvent.inputType === "insertFromPaste") {
         if (!isValidNumber(delocalizedValue)) {
           nativeEvent.preventDefault();
@@ -202,12 +206,16 @@ export class InputNumber {
         }
         return;
       }
-      const decimalSeparator = getDecimalSeparator(getLocale(this));
-      if (event.key === decimalSeparator) {
+      numberStringFormatter.numberFormatOptions = {
+        locale: this.effectiveLocale,
+        numberingSystem: this.numberingSystem,
+        useGrouping: this.groupSeparator
+      };
+      if (event.key === numberStringFormatter.decimal) {
         if (!this.value && !this.childNumberEl.value) {
           return;
         }
-        if (this.value && this.childNumberEl.value.indexOf(decimalSeparator) === -1) {
+        if (this.value && this.childNumberEl.value.indexOf(numberStringFormatter.decimal) === -1) {
           return;
         }
       }
@@ -249,10 +257,16 @@ export class InputNumber {
         this.incrementOrDecrementNumberValue(direction, inputMax, inputMin, nativeEvent);
       }, valueNudgeDelayInMs);
     };
-    this.nudgeButtonPointerUpAndOutHandler = () => {
+    this.nudgeButtonPointerUpAndOutHandler = (event) => {
+      if (!isPrimaryPointerButton(event)) {
+        return;
+      }
       window.clearInterval(this.nudgeNumberValueIntervalId);
     };
     this.nudgeButtonPointerDownHandler = (event) => {
+      if (!isPrimaryPointerButton(event)) {
+        return;
+      }
       event.preventDefault();
       const direction = event.target.dataset.adjustment;
       if (!this.disabled) {
@@ -286,15 +300,20 @@ export class InputNumber {
       this.previousValue = isValidNumber(newPreviousValue) ? newPreviousValue : "";
     };
     this.setNumberValue = ({ committing = false, nativeEvent, origin, previousValue, value }) => {
-      const locale = getLocale(this);
-      const previousLocalizedValue = localizeNumberString(this.previousValue, locale, this.groupSeparator, this.numberingSystem);
-      const sanitizedValue = sanitizeNumberString(value);
+      numberStringFormatter.numberFormatOptions = {
+        locale: this.effectiveLocale,
+        numberingSystem: this.numberingSystem,
+        useGrouping: this.groupSeparator
+      };
+      const sanitizedValue = sanitizeNumberString((this.numberingSystem && this.numberingSystem !== "latn") || defaultNumberingSystem !== "latn"
+        ? numberStringFormatter.delocalize(value)
+        : value);
       const newValue = value && !sanitizedValue
         ? isValidNumber(this.previousValue)
           ? this.previousValue
           : ""
         : sanitizedValue;
-      const newLocalizedValue = localizeNumberString(newValue, locale, this.groupSeparator, this.numberingSystem);
+      const newLocalizedValue = numberStringFormatter.localize(newValue);
       this.setPreviousNumberValue(previousValue || this.value);
       this.previousValueOrigin = origin;
       this.userChangedValue = origin === "user" && this.value !== newValue;
@@ -310,6 +329,7 @@ export class InputNumber {
           value: this.value
         });
         if (calciteInputNumberInputEvent.defaultPrevented) {
+          const previousLocalizedValue = numberStringFormatter.localize(this.previousValue);
           this.value = this.previousValue;
           this.localizedValue = previousLocalizedValue;
         }
@@ -325,6 +345,9 @@ export class InputNumber {
   disabledWatcher() {
     this.setDisabledAction();
   }
+  localeChanged() {
+    updateEffectiveLocale(this);
+  }
   /** watcher to update number-to-string for max */
   maxWatcher() {
     var _a;
@@ -363,12 +386,15 @@ export class InputNumber {
   //--------------------------------------------------------------------------
   connectedCallback() {
     var _a;
+    connectLocalized(this);
     this.scale = getElementProp(this.el, "scale", this.scale);
     this.status = getElementProp(this.el, "status", this.status);
     this.inlineEditableEl = this.el.closest("calcite-inline-editable");
     if (this.inlineEditableEl) {
       this.editingEnabled = this.inlineEditableEl.editingEnabled || false;
     }
+    connectLabel(this);
+    connectForm(this);
     this.setPreviousEmittedNumberValue(this.value);
     this.setPreviousNumberValue(this.value);
     this.warnAboutInvalidNumberValue(this.value);
@@ -376,9 +402,6 @@ export class InputNumber {
       origin: "connected",
       value: isValidNumber(this.value) ? this.value : ""
     });
-    connectLabel(this);
-    connectForm(this);
-    watchGlobalAttributes(this, ["lang"]);
     (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true });
     this.setDisabledAction();
     this.el.addEventListener("calciteInternalHiddenInputChange", this.hiddenInputChangeHandler);
@@ -387,7 +410,7 @@ export class InputNumber {
     var _a;
     disconnectLabel(this);
     disconnectForm(this);
-    unwatchGlobalAttributes(this);
+    disconnectLocalized(this);
     (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     this.el.removeEventListener("calciteInternalHiddenInputChange", this.hiddenInputChangeHandler);
   }
@@ -480,798 +503,797 @@ export class InputNumber {
   // --------------------------------------------------------------------------
   render() {
     const dir = getElementDir(this.el);
-    const loader = (h("div", { class: CSS.loader },
-      h("calcite-progress", { label: this.intlLoading, type: "indeterminate" })));
-    const inputClearButton = (h("button", { "aria-label": this.intlClear || TEXT.clear, class: CSS.clearButton, disabled: this.disabled || this.readOnly, onClick: this.clearInputValue, tabIndex: -1, type: "button" },
-      h("calcite-icon", { icon: "x", scale: "s" })));
+    const loader = (h("div", { class: CSS.loader }, h("calcite-progress", { label: this.intlLoading, type: "indeterminate" })));
+    const inputClearButton = (h("button", { "aria-label": this.intlClear || TEXT.clear, class: CSS.clearButton, disabled: this.disabled || this.readOnly, onClick: this.clearInputValue, tabIndex: -1, type: "button" }, h("calcite-icon", { icon: "x", scale: "s" })));
     const iconEl = (h("calcite-icon", { class: CSS.inputIcon, flipRtl: this.iconFlipRtl, icon: this.requestedIcon, scale: "s" }));
     const isHorizontalNumberButton = this.numberButtonType === "horizontal";
     const numberButtonsHorizontalUp = (h("button", { "aria-hidden": "true", class: {
         [CSS.numberButtonItem]: true,
         [CSS.buttonItemHorizontal]: isHorizontalNumberButton
-      }, "data-adjustment": "up", disabled: this.disabled || this.readOnly, onPointerDown: this.nudgeButtonPointerDownHandler, onPointerOut: this.nudgeButtonPointerUpAndOutHandler, onPointerUp: this.nudgeButtonPointerUpAndOutHandler, tabIndex: -1, type: "button" },
-      h("calcite-icon", { icon: "chevron-up", scale: "s" })));
+      }, "data-adjustment": "up", disabled: this.disabled || this.readOnly, onPointerDown: this.nudgeButtonPointerDownHandler, onPointerOut: this.nudgeButtonPointerUpAndOutHandler, onPointerUp: this.nudgeButtonPointerUpAndOutHandler, tabIndex: -1, type: "button" }, h("calcite-icon", { icon: "chevron-up", scale: "s" })));
     const numberButtonsHorizontalDown = (h("button", { "aria-hidden": "true", class: {
         [CSS.numberButtonItem]: true,
         [CSS.buttonItemHorizontal]: isHorizontalNumberButton
-      }, "data-adjustment": "down", disabled: this.disabled || this.readOnly, onPointerDown: this.nudgeButtonPointerDownHandler, onPointerOut: this.nudgeButtonPointerUpAndOutHandler, onPointerUp: this.nudgeButtonPointerUpAndOutHandler, tabIndex: -1, type: "button" },
-      h("calcite-icon", { icon: "chevron-down", scale: "s" })));
-    const numberButtonsVertical = (h("div", { class: CSS.numberButtonWrapper },
-      numberButtonsHorizontalUp,
-      numberButtonsHorizontalDown));
+      }, "data-adjustment": "down", disabled: this.disabled || this.readOnly, onPointerDown: this.nudgeButtonPointerDownHandler, onPointerOut: this.nudgeButtonPointerUpAndOutHandler, onPointerUp: this.nudgeButtonPointerUpAndOutHandler, tabIndex: -1, type: "button" }, h("calcite-icon", { icon: "chevron-down", scale: "s" })));
+    const numberButtonsVertical = (h("div", { class: CSS.numberButtonWrapper }, numberButtonsHorizontalUp, numberButtonsHorizontalDown));
     const prefixText = h("div", { class: CSS.prefix }, this.prefixText);
     const suffixText = h("div", { class: CSS.suffix }, this.suffixText);
     const childEl = (h("input", { "aria-label": getLabelText(this), autofocus: this.autofocus ? true : null, defaultValue: this.defaultValue, disabled: this.disabled ? true : null, enterKeyHint: this.el.enterKeyHint, inputMode: this.el.inputMode, key: "localized-input", maxLength: this.maxLength, minLength: this.minLength, name: undefined, onBlur: this.inputNumberBlurHandler, onFocus: this.inputNumberFocusHandler, onInput: this.inputNumberInputHandler, onKeyDown: this.inputNumberKeyDownHandler, onKeyUp: this.inputNumberKeyUpHandler, placeholder: this.placeholder || "", readOnly: this.readOnly, ref: this.setChildNumberElRef, type: "text", value: this.localizedValue }));
-    return (h(Host, { onClick: this.inputNumberFocusHandler, onKeyDown: this.keyDownHandler },
-      h("div", { class: { [CSS.inputWrapper]: true, [CSS_UTILITY.rtl]: dir === "rtl" } },
-        this.numberButtonType === "horizontal" && !this.readOnly
-          ? numberButtonsHorizontalDown
-          : null,
-        this.prefixText ? prefixText : null,
-        h("div", { class: CSS.wrapper },
-          childEl,
-          this.isClearable ? inputClearButton : null,
-          this.requestedIcon ? iconEl : null,
-          this.loading ? loader : null),
-        h("div", { class: CSS.actionWrapper },
-          h("slot", { name: SLOTS.action })),
-        this.numberButtonType === "vertical" && !this.readOnly ? numberButtonsVertical : null,
-        this.suffixText ? suffixText : null,
-        this.numberButtonType === "horizontal" && !this.readOnly
-          ? numberButtonsHorizontalUp
-          : null,
-        h(HiddenFormInputSlot, { component: this }))));
+    return (h(Host, { onClick: this.inputNumberFocusHandler, onKeyDown: this.keyDownHandler }, h("div", { class: { [CSS.inputWrapper]: true, [CSS_UTILITY.rtl]: dir === "rtl" } }, this.numberButtonType === "horizontal" && !this.readOnly
+      ? numberButtonsHorizontalDown
+      : null, this.prefixText ? prefixText : null, h("div", { class: CSS.wrapper }, childEl, this.isClearable ? inputClearButton : null, this.requestedIcon ? iconEl : null, this.loading ? loader : null), h("div", { class: CSS.actionWrapper }, h("slot", { name: SLOTS.action })), this.numberButtonType === "vertical" && !this.readOnly ? numberButtonsVertical : null, this.suffixText ? suffixText : null, this.numberButtonType === "horizontal" && !this.readOnly
+      ? numberButtonsHorizontalUp
+      : null, h(HiddenFormInputSlot, { component: this }))));
   }
   static get is() { return "calcite-input-number"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["input-number.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["input-number.css"]
-  }; }
-  static get properties() { return {
-    "alignment": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "Position",
-        "resolved": "\"end\" | \"start\"",
-        "references": {
-          "Position": {
-            "location": "import",
-            "path": "../interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Specifies the text alignment of the component's value."
-      },
-      "attribute": "alignment",
-      "reflect": true,
-      "defaultValue": "\"start\""
-    },
-    "autofocus": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[autofocus](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)"
-          }],
-        "text": "When true, the component is focused on page load."
-      },
-      "attribute": "autofocus",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "clearable": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, a clear button is displayed when the component has a value."
-      },
-      "attribute": "clearable",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled)"
-          }],
-        "text": "When true, interaction is prevented and the component is displayed with lower opacity."
-      },
-      "attribute": "disabled",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "groupSeparator": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, number values are displayed with the locale's group separator."
-      },
-      "attribute": "group-separator",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "hidden": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)"
-          }],
-        "text": "When true, the component will not be visible."
-      },
-      "attribute": "hidden",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "icon": {
-      "type": "any",
-      "mutable": false,
-      "complexType": {
-        "original": "string | boolean",
-        "resolved": "boolean | string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon."
-      },
-      "attribute": "icon",
-      "reflect": true
-    },
-    "intlClear": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "A text label that will appear on the clear button for screen readers."
-      },
-      "attribute": "intl-clear",
-      "reflect": false
-    },
-    "intlLoading": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "\"Loading\""
-          }],
-        "text": "Accessible name that will appear while loading."
-      },
-      "attribute": "intl-loading",
-      "reflect": false,
-      "defaultValue": "COMMON_TEXT.loading"
-    },
-    "iconFlipRtl": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, the icon is flipped in RTL."
-      },
-      "attribute": "icon-flip-rtl",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Accessible name for the component's button or hyperlink."
-      },
-      "attribute": "label",
-      "reflect": false
-    },
-    "loading": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, the component is in the loading state and `calcite-progress` is displayed."
-      },
-      "attribute": "loading",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "locale": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "deprecated",
-            "text": "set the global `lang` attribute on the element instead."
-          }, {
-            "name": "mdn",
-            "text": "[lang](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang)"
-          }],
-        "text": "Specifies the BCP 47 language tag for the desired language and country format."
-      },
-      "attribute": "locale",
-      "reflect": false
-    },
-    "numberingSystem": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[numberingSystem](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/numberingSystem)"
-          }],
-        "text": "Specifies the Unicode numeral system used by the component for localization."
-      },
-      "attribute": "numbering-system",
-      "reflect": true
-    },
-    "localeFormat": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": "Toggles locale formatting for numbers."
-      },
-      "attribute": "locale-format",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "max": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[max](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#max)"
-          }],
-        "text": "Specifies the maximum value."
-      },
-      "attribute": "max",
-      "reflect": true
-    },
-    "min": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[min](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#min)"
-          }],
-        "text": "Specifies the minimum value."
-      },
-      "attribute": "min",
-      "reflect": true
-    },
-    "maxLength": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[maxlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength)"
-          }],
-        "text": "Specifies the maximum length of text for the component's value."
-      },
-      "attribute": "max-length",
-      "reflect": true
-    },
-    "minLength": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[minlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#minlength)"
-          }],
-        "text": "Specifies the minimum length of text for the component's value."
-      },
-      "attribute": "min-length",
-      "reflect": true
-    },
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[name](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name)"
-          }],
-        "text": "Specifies the name of the component."
-      },
-      "attribute": "name",
-      "reflect": true
-    },
-    "numberButtonType": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "InputPlacement",
-        "resolved": "\"horizontal\" | \"none\" | \"vertical\"",
-        "references": {
-          "InputPlacement": {
-            "location": "import",
-            "path": "./interfaces"
+  static get originalStyleUrls() {
+    return {
+      "$": ["input-number.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["input-number.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "alignment": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "Position",
+          "resolved": "\"end\" | \"start\"",
+          "references": {
+            "Position": {
+              "location": "import",
+              "path": "../interfaces"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Specifies the placement of the buttons."
-      },
-      "attribute": "number-button-type",
-      "reflect": true,
-      "defaultValue": "\"vertical\""
-    },
-    "placeholder": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[placeholder](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder)"
-          }],
-        "text": "Specifies placeholder text for the component."
-      },
-      "attribute": "placeholder",
-      "reflect": false
-    },
-    "prefixText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Adds text to the start of the component."
-      },
-      "attribute": "prefix-text",
-      "reflect": false
-    },
-    "readOnly": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)"
-          }],
-        "text": "When true, the value cannot be modified."
-      },
-      "attribute": "read-only",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "required": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, the component must have a value in order for the form to submit."
-      },
-      "attribute": "required",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "scale": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "Scale",
-        "resolved": "\"l\" | \"m\" | \"s\"",
-        "references": {
-          "Scale": {
-            "location": "import",
-            "path": "../interfaces"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the text alignment of the component's value."
+        },
+        "attribute": "alignment",
+        "reflect": true,
+        "defaultValue": "\"start\""
+      },
+      "autofocus": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[autofocus](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)"
+            }],
+          "text": "When `true`, the component is focused on page load."
+        },
+        "attribute": "autofocus",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "clearable": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When `true`, a clear button is displayed when the component has a value."
+        },
+        "attribute": "clearable",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled)"
+            }],
+          "text": "When `true`, interaction is prevented and the component is displayed with lower opacity."
+        },
+        "attribute": "disabled",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "groupSeparator": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When `true`, number values are displayed with a group separator corresponding to the language and country format."
+        },
+        "attribute": "group-separator",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "hidden": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)"
+            }],
+          "text": "When `true`, the component will not be visible."
+        },
+        "attribute": "hidden",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "icon": {
+        "type": "any",
+        "mutable": false,
+        "complexType": {
+          "original": "string | boolean",
+          "resolved": "boolean | string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon."
+        },
+        "attribute": "icon",
+        "reflect": true
+      },
+      "intlClear": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "A text label that will appear on the clear button for screen readers."
+        },
+        "attribute": "intl-clear",
+        "reflect": false
+      },
+      "intlLoading": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "\"Loading\""
+            }],
+          "text": "Accessible name that will appear while loading."
+        },
+        "attribute": "intl-loading",
+        "reflect": false,
+        "defaultValue": "COMMON_TEXT.loading"
+      },
+      "iconFlipRtl": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`)."
+        },
+        "attribute": "icon-flip-rtl",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Accessible name for the component's button or hyperlink."
+        },
+        "attribute": "label",
+        "reflect": false
+      },
+      "loading": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When `true`, the component is in the loading state and `calcite-progress` is displayed."
+        },
+        "attribute": "loading",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "locale": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "deprecated",
+              "text": "set the global `lang` attribute on the element instead."
+            }, {
+              "name": "mdn",
+              "text": "[lang](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang)"
+            }],
+          "text": "Specifies the BCP 47 language tag for the desired language and country format."
+        },
+        "attribute": "locale",
+        "reflect": false
+      },
+      "numberingSystem": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "NumberingSystem",
+          "resolved": "\"arab\" | \"arabext\" | \"bali\" | \"beng\" | \"deva\" | \"fullwide\" | \"gujr\" | \"guru\" | \"hanidec\" | \"khmr\" | \"knda\" | \"laoo\" | \"latn\" | \"limb\" | \"mlym\" | \"mong\" | \"mymr\" | \"orya\" | \"tamldec\" | \"telu\" | \"thai\" | \"tibt\"",
+          "references": {
+            "NumberingSystem": {
+              "location": "import",
+              "path": "../../utils/locale"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Specifies the size of the component."
-      },
-      "attribute": "scale",
-      "reflect": true,
-      "defaultValue": "\"m\""
-    },
-    "status": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "Status",
-        "resolved": "\"idle\" | \"invalid\" | \"valid\"",
-        "references": {
-          "Status": {
-            "location": "import",
-            "path": "../interfaces"
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the Unicode numeral system used by the component for localization."
+        },
+        "attribute": "numbering-system",
+        "reflect": true
+      },
+      "localeFormat": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": "Toggles locale formatting for numbers."
+        },
+        "attribute": "locale-format",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "max": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[max](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#max)"
+            }],
+          "text": "Specifies the maximum value."
+        },
+        "attribute": "max",
+        "reflect": true
+      },
+      "min": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[min](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#min)"
+            }],
+          "text": "Specifies the minimum value."
+        },
+        "attribute": "min",
+        "reflect": true
+      },
+      "maxLength": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[maxlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength)"
+            }],
+          "text": "Specifies the maximum length of text for the component's value."
+        },
+        "attribute": "max-length",
+        "reflect": true
+      },
+      "minLength": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[minlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#minlength)"
+            }],
+          "text": "Specifies the minimum length of text for the component's value."
+        },
+        "attribute": "min-length",
+        "reflect": true
+      },
+      "name": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[name](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name)"
+            }],
+          "text": "Specifies the name of the component."
+        },
+        "attribute": "name",
+        "reflect": true
+      },
+      "numberButtonType": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "InputPlacement",
+          "resolved": "\"horizontal\" | \"none\" | \"vertical\"",
+          "references": {
+            "InputPlacement": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Specifies the status of the input field, which determines message and icons."
-      },
-      "attribute": "status",
-      "reflect": true,
-      "defaultValue": "\"idle\""
-    },
-    "step": {
-      "type": "any",
-      "mutable": false,
-      "complexType": {
-        "original": "number | \"any\"",
-        "resolved": "\"any\" | number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "mdn",
-            "text": "[step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step)"
-          }],
-        "text": "Specifies the granularity that the component's value must adhere to."
-      },
-      "attribute": "step",
-      "reflect": true
-    },
-    "suffixText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Adds text to the end of the component."
-      },
-      "attribute": "suffix-text",
-      "reflect": false
-    },
-    "editingEnabled": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "attribute": "editing-enabled",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "value": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The component's value."
-      },
-      "attribute": "value",
-      "reflect": false,
-      "defaultValue": "\"\""
-    }
-  }; }
-  static get states() { return {
-    "globalAttributes": {},
-    "localizedValue": {}
-  }; }
-  static get events() { return [{
-      "method": "calciteInternalInputNumberFocus",
-      "name": "calciteInternalInputNumberFocus",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }, {
-      "method": "calciteInternalInputNumberBlur",
-      "name": "calciteInternalInputNumberBlur",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }, {
-      "method": "calciteInputNumberInput",
-      "name": "calciteInputNumberInput",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fires each time a new value is typed.\n\n**Note:**: The `el` and `value` event payload props are deprecated, please use the event's target/currentTarget instead"
-      },
-      "complexType": {
-        "original": "DeprecatedEventPayload",
-        "resolved": "any",
-        "references": {
-          "DeprecatedEventPayload": {
-            "location": "import",
-            "path": "../interfaces"
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the placement of the buttons."
+        },
+        "attribute": "number-button-type",
+        "reflect": true,
+        "defaultValue": "\"vertical\""
+      },
+      "placeholder": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[placeholder](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder)"
+            }],
+          "text": "Specifies placeholder text for the component."
+        },
+        "attribute": "placeholder",
+        "reflect": false
+      },
+      "prefixText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Adds text to the start of the component."
+        },
+        "attribute": "prefix-text",
+        "reflect": false
+      },
+      "readOnly": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)"
+            }],
+          "text": "When `true`, the component's value can be read, but cannot be modified."
+        },
+        "attribute": "read-only",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "required": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When `true`, the component must have a value in order for the form to submit."
+        },
+        "attribute": "required",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "scale": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "Scale",
+          "resolved": "\"l\" | \"m\" | \"s\"",
+          "references": {
+            "Scale": {
+              "location": "import",
+              "path": "../interfaces"
+            }
           }
-        }
-      }
-    }, {
-      "method": "calciteInputNumberChange",
-      "name": "calciteInputNumberChange",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fires each time a new value is typed and committed."
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "setFocus": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the size of the component."
+        },
+        "attribute": "scale",
+        "reflect": true,
+        "defaultValue": "\"m\""
+      },
+      "status": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "Status",
+          "resolved": "\"idle\" | \"invalid\" | \"valid\"",
+          "references": {
+            "Status": {
+              "location": "import",
+              "path": "../interfaces"
+            }
           }
         },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "Sets focus on the component.",
-        "tags": []
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the status of the input field, which determines message and icons."
+        },
+        "attribute": "status",
+        "reflect": true,
+        "defaultValue": "\"idle\""
+      },
+      "step": {
+        "type": "any",
+        "mutable": false,
+        "complexType": {
+          "original": "number | \"any\"",
+          "resolved": "\"any\" | number",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "mdn",
+              "text": "[step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step)"
+            }],
+          "text": "Specifies the granularity that the component's value must adhere to."
+        },
+        "attribute": "step",
+        "reflect": true
+      },
+      "suffixText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Adds text to the end of the component."
+        },
+        "attribute": "suffix-text",
+        "reflect": false
+      },
+      "editingEnabled": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "attribute": "editing-enabled",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "value": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The component's value."
+        },
+        "attribute": "value",
+        "reflect": false,
+        "defaultValue": "\"\""
       }
-    },
-    "selectText": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
+    };
+  }
+  static get states() {
+    return {
+      "effectiveLocale": {},
+      "localizedValue": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "calciteInternalInputNumberFocus",
+        "name": "calciteInternalInputNumberFocus",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "calciteInternalInputNumberBlur",
+        "name": "calciteInternalInputNumberBlur",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "calciteInputNumberInput",
+        "name": "calciteInputNumberInput",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fires each time a new value is typed.\n\n**Note:**: The `el` and `value` event payload props are deprecated, please use the event's `target`/`currentTarget` instead"
+        },
+        "complexType": {
+          "original": "DeprecatedEventPayload",
+          "resolved": "any",
+          "references": {
+            "DeprecatedEventPayload": {
+              "location": "import",
+              "path": "../interfaces"
+            }
           }
+        }
+      }, {
+        "method": "calciteInputNumberChange",
+        "name": "calciteInputNumberChange",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fires each time a new value is typed and committed."
         },
-        "return": "Promise<void>"
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "setFocus": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Sets focus on the component.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Selects all text of the component's `value`.",
-        "tags": []
+      "selectText": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Selects all text of the component's `value`.",
+          "tags": []
+        }
       }
-    }
-  }; }
+    };
+  }
   static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "disabled",
-      "methodName": "disabledWatcher"
-    }, {
-      "propName": "max",
-      "methodName": "maxWatcher"
-    }, {
-      "propName": "min",
-      "methodName": "minWatcher"
-    }, {
-      "propName": "value",
-      "methodName": "valueWatcher"
-    }, {
-      "propName": "icon",
-      "methodName": "updateRequestedIcon"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "disabled",
+        "methodName": "disabledWatcher"
+      }, {
+        "propName": "locale",
+        "methodName": "localeChanged"
+      }, {
+        "propName": "max",
+        "methodName": "maxWatcher"
+      }, {
+        "propName": "min",
+        "methodName": "minWatcher"
+      }, {
+        "propName": "value",
+        "methodName": "valueWatcher"
+      }, {
+        "propName": "icon",
+        "methodName": "updateRequestedIcon"
+      }];
+  }
 }