@esri/calcite-components 1.5.0-next.21 → 1.5.0-next.23

package/dist/collection/components/input-date-picker/input-date-picker.js

@@ -1,23 +1,23 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
-import { Build, h, Host } from "@stencil/core";
-import { dateFromISO, dateFromLocalizedString, dateFromRange, datePartsFromLocalizedString, dateToISO, inRange } from "../../utils/date";
+import { Build, h, Host, } from "@stencil/core";
+import { dateFromISO, dateFromLocalizedString, dateFromRange, datePartsFromLocalizedString, dateToISO, inRange, } from "../../utils/date";
 import { toAriaBoolean } from "../../utils/dom";
-import { connectFloatingUI, defaultMenuPlacement, disconnectFloatingUI, filterComputedPlacements, FloatingCSS, reposition } from "../../utils/floating-ui";
-import { connectForm, disconnectForm, HiddenFormInputSlot, submitForm } from "../../utils/form";
-import { connectInteractive, disconnectInteractive, updateHostInteraction } from "../../utils/interactive";
+import { connectFloatingUI, defaultMenuPlacement, disconnectFloatingUI, filterComputedPlacements, FloatingCSS, reposition, } from "../../utils/floating-ui";
+import { connectForm, disconnectForm, HiddenFormInputSlot, submitForm, } from "../../utils/form";
+import { connectInteractive, disconnectInteractive, updateHostInteraction, } from "../../utils/interactive";
 import { numberKeys } from "../../utils/key";
 import { connectLabel, disconnectLabel } from "../../utils/label";
-import { componentFocusable, setComponentLoaded, setUpLoadableComponent } from "../../utils/loadable";
-import { connectLocalized, disconnectLocalized, numberStringFormatter } from "../../utils/locale";
-import { connectOpenCloseComponent, disconnectOpenCloseComponent } from "../../utils/openCloseComponent";
+import { componentFocusable, setComponentLoaded, setUpLoadableComponent, } from "../../utils/loadable";
+import { connectLocalized, disconnectLocalized, numberStringFormatter, } from "../../utils/locale";
+import { connectOpenCloseComponent, disconnectOpenCloseComponent, } from "../../utils/openCloseComponent";
 import { getLocaleData, getValueAsDateRange } from "../date-picker/utils";
 import { CSS } from "./resources";
 import { connectMessages, disconnectMessages, setUpMessages } from "../../utils/t9n";
-import { activateFocusTrap, connectFocusTrap, deactivateFocusTrap } from "../../utils/focusTrapComponent";
+import { activateFocusTrap, connectFocusTrap, deactivateFocusTrap, } from "../../utils/focusTrapComponent";
 import { guid } from "../../utils/guid";
 export class InputDatePicker {
   constructor() {
@@ -45,6 +45,7 @@ export class InputDatePicker {
     this.userChangedValue = false;
     this.openTransitionProp = "opacity";
     this.valueAsDateChangedExternally = false;
+    this.placeholderTextId = `calcite-input-date-picker-placeholder-${guid()}`;
     //--------------------------------------------------------------------------
     //
     //  Private Methods
@@ -137,8 +138,8 @@ export class InputDatePicker {
         focusTrapEl: el,
         focusTrapOptions: {
           initialFocus: false,
-          setReturnFocus: false
-        }
+          setReturnFocus: false,
+        },
       });
     };
     /**
@@ -372,7 +373,7 @@ export class InputDatePicker {
       overlayPositioning,
       placement,
       flipPlacements: filteredFlipPlacements,
-      type: "menu"
+      type: "menu",
     }, delayed);
   }
   // --------------------------------------------------------------------------
@@ -415,7 +416,7 @@ export class InputDatePicker {
     numberStringFormatter.numberFormatOptions = {
       numberingSystem: this.numberingSystem,
       locale: this.effectiveLocale,
-      useGrouping: false
+      useGrouping: false,
     };
   }
   async componentWillLoad() {
@@ -447,22 +448,22 @@ export class InputDatePicker {
     numberStringFormatter.numberFormatOptions = {
       numberingSystem,
       locale: effectiveLocale,
-      useGrouping: false
+      useGrouping: false,
     };
     return (h(Host, { onBlur: this.deactivate, onKeyDown: this.keyDownHandler }, this.localeData && (h("div", { class: "input-container" }, h("div", { class: "input-wrapper", onClick: this.onInputWrapperClick,
       // eslint-disable-next-line react/jsx-sort-props
-      ref: this.setStartWrapper }, h("calcite-input", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: `input ${this.layout === "vertical" && this.range ? `no-bottom-border` : ``}`, disabled: disabled, icon: "calendar", "number-button-type": "none", numberingSystem: numberingSystem, onCalciteInputInput: this.calciteInternalInputInputHandler, onCalciteInternalInputBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputFocus: this.startInputFocus, onFocus: this.startEndInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, role: "combobox", scale: this.scale, type: "text",
+      ref: this.setStartWrapper }, h("calcite-input", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-describedby": this.placeholderTextId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: `input ${this.layout === "vertical" && this.range ? `no-bottom-border` : ``}`, disabled: disabled, icon: "calendar", "number-button-type": "none", numberingSystem: numberingSystem, onCalciteInputInput: this.calciteInternalInputInputHandler, onCalciteInternalInputBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputFocus: this.startInputFocus, onFocus: this.startEndInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, role: "combobox", scale: this.scale, type: "text",
       // eslint-disable-next-line react/jsx-sort-props
-      ref: this.setStartInput }), this.renderToggleIcon(this.open && this.focusedInput === "start")), h("div", { "aria-hidden": toAriaBoolean(!this.open), "aria-label": messages.chooseDate, "aria-live": "polite", "aria-modal": "true", class: {
+      ref: this.setStartInput }), this.renderToggleIcon(this.open && this.focusedInput === "start"), h("span", { "aria-hidden": "true", class: CSS.assistiveText, id: this.placeholderTextId }, "Date Format: ", this.localeData?.placeholder)), h("div", { "aria-hidden": toAriaBoolean(!this.open), "aria-label": messages.chooseDate, "aria-live": "polite", "aria-modal": "true", class: {
         [CSS.menu]: true,
-        [CSS.menuActive]: this.open
+        [CSS.menuActive]: this.open,
       }, id: this.dialogId, role: "dialog",
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setFloatingEl }, h("div", { class: {
         ["calendar-picker-wrapper"]: true,
         ["calendar-picker-wrapper--end"]: this.focusedInput === "end",
         [FloatingCSS.animation]: true,
-        [FloatingCSS.animationActive]: this.open
+        [FloatingCSS.animationActive]: this.open,
       },
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setTransitionEl }, h("calcite-date-picker", { activeDate: this.datePickerActiveDate, activeRange: this.focusedInput, headingLevel: this.headingLevel, max: this.max, maxAsDate: this.maxAsDate, messageOverrides: this.messageOverrides, min: this.min, minAsDate: this.minAsDate, numberingSystem: numberingSystem, onCalciteDatePickerChange: this.handleDateChange, onCalciteDatePickerRangeChange: this.handleDateRangeChange, proximitySelectionDisabled: this.proximitySelectionDisabled, range: this.range, scale: this.scale, tabIndex: this.open ? undefined : -1, valueAsDate: this.valueAsDate,
@@ -471,7 +472,7 @@ export class InputDatePicker {
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setEndWrapper }, h("calcite-input", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: {
         input: true,
-        "border-top-color-one": this.layout === "vertical" && this.range
+        "border-top-color-one": this.layout === "vertical" && this.range,
       }, disabled: disabled, icon: "calendar", "number-button-type": "none", numberingSystem: numberingSystem, onCalciteInputInput: this.calciteInternalInputInputHandler, onCalciteInternalInputBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputFocus: this.endInputFocus, onFocus: this.startEndInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, role: "combobox", scale: this.scale, type: "text",
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setEndInput }), this.renderToggleIcon(this.open && this.focusedInput === "end"))))), h(HiddenFormInputSlot, { component: this })));
@@ -500,7 +501,7 @@ export class InputDatePicker {
           this.datePickerEl.setFocus();
           this.focusOnOpen = false;
         }
-      }
+      },
     });
     this.calciteInputDatePickerOpen.emit();
   }
@@ -530,14 +531,14 @@ export class InputDatePicker {
         if (date) {
           this.setRangeValue([
             focusedInput === "start" ? date : dateFromISO(value[0]),
-            focusedInput === "end" ? date : dateFromISO(value[1])
+            focusedInput === "end" ? date : dateFromISO(value[1]),
           ]);
           this.localizeInputValues();
         }
         else {
           this.setRangeValue([
             focusedInput === "end" && dateFromISO(value[0]),
-            focusedInput === "start" && dateFromISO(value[1])
+            focusedInput === "start" && dateFromISO(value[1]),
           ]);
         }
       }
@@ -545,7 +546,7 @@ export class InputDatePicker {
         if (date) {
           this.setRangeValue([
             focusedInput === "start" ? date : dateFromISO(value[0]),
-            focusedInput === "end" ? date : dateFromISO(value[1])
+            focusedInput === "end" ? date : dateFromISO(value[1]),
           ]);
           this.localizeInputValues();
         }
@@ -566,7 +567,7 @@ export class InputDatePicker {
     numberStringFormatter.numberFormatOptions = {
       numberingSystem: this.numberingSystem,
       locale: this.effectiveLocale,
-      useGrouping: false
+      useGrouping: false,
     };
     this.localeData = await getLocaleData(this.effectiveLocale);
     this.localizeInputValues();
@@ -778,7 +779,7 @@ export class InputDatePicker {
         "mutable": true,
         "complexType": {
           "original": "Partial<InputDatePickerMessages & DatePickerMessages>",
-          "resolved": "{ chooseDate?: string; nextMonth?: string; prevMonth?: string; year?: string; }",
+          "resolved": "{ chooseDate?: string; dateFormat?: string; nextMonth?: string; prevMonth?: string; year?: string; }",
           "references": {
             "Partial": {
               "location": "global"
@@ -805,7 +806,7 @@ export class InputDatePicker {
         "mutable": true,
         "complexType": {
           "original": "InputDatePickerMessages",
-          "resolved": "{ chooseDate: string; }",
+          "resolved": "{ chooseDate: string; dateFormat: string; }",
           "references": {
             "InputDatePickerMessages": {
               "location": "import",

package/dist/collection/components/input-date-picker/resources.js

@@ -1,10 +1,11 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
 export const CSS = {
+  assistiveText: "assistive-text",
   menu: "menu-container",
   menuActive: "menu-container--active",
-  toggleIcon: "toggle-icon"
+  toggleIcon: "toggle-icon",
 };

package/dist/collection/components/input-message/input-message.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
 import { h, Host } from "@stencil/core";
 import { setRequestedIcon } from "../../utils/dom";

package/dist/collection/components/input-message/interfaces.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
 export var StatusIconDefaults;
 (function (StatusIconDefaults) {

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

@@ -1,20 +1,20 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
-import { h, Host } from "@stencil/core";
-import { getElementDir, getSlotted, isPrimaryPointerButton, setRequestedIcon } from "../../utils/dom";
-import { connectForm, disconnectForm, HiddenFormInputSlot, submitForm } from "../../utils/form";
-import { connectInteractive, disconnectInteractive, updateHostInteraction } from "../../utils/interactive";
+import { h, Host, } from "@stencil/core";
+import { getElementDir, getSlotted, isPrimaryPointerButton, setRequestedIcon, } from "../../utils/dom";
+import { connectForm, disconnectForm, HiddenFormInputSlot, submitForm, } from "../../utils/form";
+import { connectInteractive, disconnectInteractive, updateHostInteraction, } from "../../utils/interactive";
 import { numberKeys } from "../../utils/key";
 import { connectLabel, disconnectLabel, getLabelText } from "../../utils/label";
-import { componentFocusable, setComponentLoaded, setUpLoadableComponent } from "../../utils/loadable";
-import { connectLocalized, disconnectLocalized, numberStringFormatter } from "../../utils/locale";
-import { addLocalizedTrailingDecimalZeros, BigDecimal, isValidNumber, parseNumberString, sanitizeNumberString } from "../../utils/number";
+import { componentFocusable, setComponentLoaded, setUpLoadableComponent, } from "../../utils/loadable";
+import { connectLocalized, disconnectLocalized, numberStringFormatter, } from "../../utils/locale";
+import { addLocalizedTrailingDecimalZeros, BigDecimal, isValidNumber, parseNumberString, sanitizeNumberString, } from "../../utils/number";
 import { createObserver } from "../../utils/observers";
 import { CSS_UTILITY } from "../../utils/resources";
-import { connectMessages, disconnectMessages, setUpMessages, updateMessages } from "../../utils/t9n";
+import { connectMessages, disconnectMessages, setUpMessages, updateMessages, } from "../../utils/t9n";
 import { CSS, SLOTS } from "./resources";
 /**
  * @slot action - A slot for positioning a button next to the component.
@@ -48,7 +48,7 @@ export class InputNumber {
         committing: true,
         nativeEvent,
         origin: "user",
-        value: ""
+        value: "",
       });
     };
     this.emitChangeIfUserModified = () => {
@@ -81,7 +81,7 @@ export class InputNumber {
       numberStringFormatter.numberFormatOptions = {
         locale: this.effectiveLocale,
         numberingSystem: this.numberingSystem,
-        useGrouping: this.groupSeparator
+        useGrouping: this.groupSeparator,
       };
       const delocalizedValue = numberStringFormatter.delocalize(value);
       if (nativeEvent.inputType === "insertFromPaste") {
@@ -91,7 +91,7 @@ export class InputNumber {
         this.setNumberValue({
           nativeEvent,
           origin: "user",
-          value: parseNumberString(delocalizedValue)
+          value: parseNumberString(delocalizedValue),
         });
         this.childNumberEl.value = this.localizedValue;
       }
@@ -99,7 +99,7 @@ export class InputNumber {
         this.setNumberValue({
           nativeEvent,
           origin: "user",
-          value: delocalizedValue
+          value: delocalizedValue,
         });
       }
     };
@@ -125,7 +125,7 @@ export class InputNumber {
         "Delete",
         "Enter",
         "Escape",
-        "Tab"
+        "Tab",
       ];
       if (event.altKey || event.ctrlKey || event.metaKey) {
         return;
@@ -140,7 +140,7 @@ export class InputNumber {
       numberStringFormatter.numberFormatOptions = {
         locale: this.effectiveLocale,
         numberingSystem: this.numberingSystem,
-        useGrouping: this.groupSeparator
+        useGrouping: this.groupSeparator,
       };
       if (event.key === numberStringFormatter.decimal) {
         if (!this.value && !this.childNumberEl.value) {
@@ -208,7 +208,7 @@ export class InputNumber {
       if (event.target.name === this.name) {
         this.setNumberValue({
           value: event.target.value,
-          origin: "direct"
+          origin: "direct",
         });
       }
       event.stopPropagation();
@@ -228,11 +228,11 @@ export class InputNumber {
     this.setPreviousNumberValue = (value) => {
       this.previousValue = this.normalizeValue(value);
     };
-    this.setNumberValue = ({ committing = false, nativeEvent, origin, previousValue, value }) => {
+    this.setNumberValue = ({ committing = false, nativeEvent, origin, previousValue, value, }) => {
       numberStringFormatter.numberFormatOptions = {
         locale: this.effectiveLocale,
         numberingSystem: this.numberingSystem,
-        useGrouping: this.groupSeparator
+        useGrouping: this.groupSeparator,
       };
       const isValueDeleted = this.previousValue?.length > value.length || this.value?.length > value.length;
       const hasTrailingDecimalSeparator = value.charAt(value.length - 1) === ".";
@@ -337,7 +337,7 @@ export class InputNumber {
           ? ""
           : isValidNumber(newValue)
             ? newValue
-            : this.previousValue || ""
+            : this.previousValue || "",
       });
       this.warnAboutInvalidNumberValue(newValue);
     }
@@ -354,7 +354,7 @@ export class InputNumber {
     numberStringFormatter.numberFormatOptions = {
       locale,
       numberingSystem: this.numberingSystem,
-      useGrouping: false
+      useGrouping: false,
     };
   }
   //--------------------------------------------------------------------------
@@ -377,7 +377,7 @@ export class InputNumber {
     this.warnAboutInvalidNumberValue(this.value);
     this.setNumberValue({
       origin: "connected",
-      value: isValidNumber(this.value) ? this.value : ""
+      value: isValidNumber(this.value) ? this.value : "",
     });
     this.mutationObserver?.observe(this.el, { childList: true });
     this.setDisabledAction();
@@ -406,7 +406,7 @@ export class InputNumber {
     if (property === "value" && newValue && !isValidNumber(newValue)) {
       this.setNumberValue({
         origin: "reset",
-        value: oldValue
+        value: oldValue,
       });
       return false;
     }
@@ -453,13 +453,13 @@ export class InputNumber {
       committing: true,
       nativeEvent,
       origin: "user",
-      value: finalValue
+      value: finalValue,
     });
   }
   onFormReset() {
     this.setNumberValue({
       origin: "reset",
-      value: this.defaultValue
+      value: this.defaultValue,
     });
   }
   syncHiddenFormInput(input) {
@@ -504,11 +504,11 @@ export class InputNumber {
     const isHorizontalNumberButton = this.numberButtonType === "horizontal";
     const numberButtonsHorizontalUp = (h("button", { "aria-hidden": "true", class: {
         [CSS.numberButtonItem]: true,
-        [CSS.buttonItemHorizontal]: isHorizontalNumberButton
+        [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: this.scale === "l" ? "m" : "s" })));
     const numberButtonsHorizontalDown = (h("button", { "aria-hidden": "true", class: {
         [CSS.numberButtonItem]: true,
-        [CSS.buttonItemHorizontal]: isHorizontalNumberButton
+        [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: this.scale === "l" ? "m" : "s" })));
     const numberButtonsVertical = (h("div", { class: CSS.numberButtonWrapper }, numberButtonsHorizontalUp, numberButtonsHorizontalDown));
     const prefixText = h("div", { class: CSS.prefix }, this.prefixText);

package/dist/collection/components/input-number/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
 export const CSS = {
   loader: "loader",
@@ -17,8 +17,8 @@ export const CSS = {
   inputWrapper: "wrapper",
   actionWrapper: "action-wrapper",
   resizeIconWrapper: "resize-icon-wrapper",
-  numberButtonItem: "number-button-item"
+  numberButtonItem: "number-button-item",
 };
 export const SLOTS = {
-  action: "action"
+  action: "action",
 };

package/dist/collection/components/input-text/input-text.js

@@ -1,18 +1,18 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
-import { h, Host } from "@stencil/core";
+import { h, Host, } from "@stencil/core";
 import { getElementDir, getSlotted, setRequestedIcon } from "../../utils/dom";
-import { connectForm, disconnectForm, HiddenFormInputSlot, submitForm } from "../../utils/form";
-import { connectInteractive, disconnectInteractive, updateHostInteraction } from "../../utils/interactive";
+import { connectForm, disconnectForm, HiddenFormInputSlot, submitForm, } from "../../utils/form";
+import { connectInteractive, disconnectInteractive, updateHostInteraction, } from "../../utils/interactive";
 import { connectLabel, disconnectLabel, getLabelText } from "../../utils/label";
-import { componentFocusable, setComponentLoaded, setUpLoadableComponent } from "../../utils/loadable";
+import { componentFocusable, setComponentLoaded, setUpLoadableComponent, } from "../../utils/loadable";
 import { connectLocalized, disconnectLocalized } from "../../utils/locale";
 import { createObserver } from "../../utils/observers";
 import { CSS_UTILITY } from "../../utils/resources";
-import { connectMessages, disconnectMessages, setUpMessages, updateMessages } from "../../utils/t9n";
+import { connectMessages, disconnectMessages, setUpMessages, updateMessages, } from "../../utils/t9n";
 import { CSS, SLOTS } from "./resources";
 /**
  * @slot action - A slot for positioning a button next to the component.
@@ -46,7 +46,7 @@ export class InputText {
         committing: true,
         nativeEvent,
         origin: "user",
-        value: ""
+        value: "",
       });
     };
     this.emitChangeIfUserModified = () => {
@@ -58,7 +58,7 @@ export class InputText {
     this.inputTextBlurHandler = () => {
       this.calciteInternalInputTextBlur.emit({
         element: this.childEl,
-        value: this.value
+        value: this.value,
       });
       this.emitChangeIfUserModified();
     };
@@ -74,7 +74,7 @@ export class InputText {
     this.inputTextFocusHandler = () => {
       this.calciteInternalInputTextFocus.emit({
         element: this.childEl,
-        value: this.value
+        value: this.value,
       });
     };
     this.inputTextInputHandler = (nativeEvent) => {
@@ -84,7 +84,7 @@ export class InputText {
       this.setValue({
         nativeEvent,
         origin: "user",
-        value: nativeEvent.target.value
+        value: nativeEvent.target.value,
       });
     };
     this.inputTextKeyDownHandler = (event) => {
@@ -99,7 +99,7 @@ export class InputText {
       if (event.target.name === this.name) {
         this.setValue({
           value: event.target.value,
-          origin: "direct"
+          origin: "direct",
         });
       }
       event.stopPropagation();
@@ -119,7 +119,7 @@ export class InputText {
     this.setPreviousValue = (value) => {
       this.previousValue = value;
     };
-    this.setValue = ({ committing = false, nativeEvent, origin, previousValue, value }) => {
+    this.setValue = ({ committing = false, nativeEvent, origin, previousValue, value, }) => {
       this.setPreviousValue(previousValue ?? this.value);
       this.previousValueOrigin = origin;
       this.userChangedValue = origin === "user" && value !== this.value;
@@ -181,7 +181,7 @@ export class InputText {
       this.setValue({
         origin: "direct",
         previousValue,
-        value: !newValue ? "" : newValue
+        value: !newValue ? "" : newValue,
       });
     }
     this.userChangedValue = false;
@@ -256,7 +256,7 @@ export class InputText {
   onFormReset() {
     this.setValue({
       origin: "reset",
-      value: this.defaultValue
+      value: this.defaultValue,
     });
   }
   syncHiddenFormInput(input) {
@@ -297,7 +297,7 @@ export class InputText {
     const suffixText = h("div", { class: CSS.suffix }, this.suffixText);
     const childEl = (h("input", { "aria-label": getLabelText(this), autocomplete: this.autocomplete, autofocus: this.autofocus ? true : null, class: {
         [CSS.editingEnabled]: this.editingEnabled,
-        [CSS.inlineChild]: !!this.inlineEditableEl
+        [CSS.inlineChild]: !!this.inlineEditableEl,
       }, defaultValue: this.defaultValue, disabled: this.disabled ? true : null, enterKeyHint: this.enterKeyHint, inputMode: this.inputMode, maxLength: this.maxLength, minLength: this.minLength, name: this.name, onBlur: this.inputTextBlurHandler, onFocus: this.inputTextFocusHandler, onInput: this.inputTextInputHandler, onKeyDown: this.inputTextKeyDownHandler, pattern: this.pattern, placeholder: this.placeholder || "", readOnly: this.readOnly, required: this.required ? true : null, tabIndex: this.disabled || (this.inlineEditableEl && !this.editingEnabled) ? -1 : null, type: "text", value: this.value,
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setChildElRef }));

package/dist/collection/components/input-text/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.5.0-next.21
+ * v1.5.0-next.23
  */
 export const CSS = {
   loader: "loader",
@@ -14,8 +14,8 @@ export const CSS = {
   wrapper: "element-wrapper",
   inputWrapper: "wrapper",
   actionWrapper: "action-wrapper",
-  resizeIconWrapper: "resize-icon-wrapper"
+  resizeIconWrapper: "resize-icon-wrapper",
 };
 export const SLOTS = {
-  action: "action"
+  action: "action",
 };