From 915221146fcb1f48115fd34726324535542321df Mon Sep 17 00:00:00 2001
From: JC Franco <jfranco@esri.com>
Date: Tue, 26 Mar 2024 11:28:31 -0700
Subject: [PATCH] fix(input, input-number, input-text): ensure values are
 initialized properly for dist and components output targets (#8997)

**Related Issue:** #7014

## Summary

Moves value initialization logic to `componentWillLoad` for consistent
behavior for both `dist` and `components` output targets.

**Note**: no additional tests were added since our testing setup uses
the `dist` output target.
---
 .../components/input-number/input-number.tsx  | 30 ++++++++---------
 .../src/components/input-text/input-text.tsx  |  5 +--
 .../src/components/input/input.tsx            | 32 +++++++++----------
 3 files changed, 34 insertions(+), 33 deletions(-)

diff --git a/packages/calcite-components/src/components/input-number/input-number.tsx b/packages/calcite-components/src/components/input-number/input-number.tsx
index 194751c41ab..f628277b92d 100644
--- a/packages/calcite-components/src/components/input-number/input-number.tsx
+++ b/packages/calcite-components/src/components/input-number/input-number.tsx
@@ -433,21 +433,6 @@ export class InputNumber
     connectLabel(this);
     connectForm(this);
 
-    this.setPreviousEmittedNumberValue(this.value);
-    this.setPreviousNumberValue(this.value);
-
-    this.warnAboutInvalidNumberValue(this.value);
-
-    if (this.value === "Infinity" || this.value === "-Infinity") {
-      this.displayedValue = this.value;
-      this.previousEmittedNumberValue = this.value;
-    } else {
-      this.setNumberValue({
-        origin: "connected",
-        value: isValidNumber(this.value) ? this.value : "",
-      });
-    }
-
     this.mutationObserver?.observe(this.el, { childList: true });
     this.setDisabledAction();
     this.el.addEventListener(internalHiddenInputInputEvent, this.onHiddenFormInputInput);
@@ -474,6 +459,21 @@ export class InputNumber
     this.minString = this.min?.toString();
     this.requestedIcon = setRequestedIcon({}, this.icon, "number");
     await setUpMessages(this);
+
+    this.setPreviousEmittedNumberValue(this.value);
+    this.setPreviousNumberValue(this.value);
+
+    this.warnAboutInvalidNumberValue(this.value);
+
+    if (this.value === "Infinity" || this.value === "-Infinity") {
+      this.displayedValue = this.value;
+      this.previousEmittedNumberValue = this.value;
+    } else {
+      this.setNumberValue({
+        origin: "connected",
+        value: isValidNumber(this.value) ? this.value : "",
+      });
+    }
   }
 
   componentShouldUpdate(newValue: string, oldValue: string, property: string): boolean {
diff --git a/packages/calcite-components/src/components/input-text/input-text.tsx b/packages/calcite-components/src/components/input-text/input-text.tsx
index c33fecd2b1a..13e9571a180 100644
--- a/packages/calcite-components/src/components/input-text/input-text.tsx
+++ b/packages/calcite-components/src/components/input-text/input-text.tsx
@@ -324,8 +324,6 @@ export class InputText
     if (this.inlineEditableEl) {
       this.editingEnabled = this.inlineEditableEl.editingEnabled || false;
     }
-    this.setPreviousEmittedValue(this.value);
-    this.setPreviousValue(this.value);
 
     connectLabel(this);
     connectForm(this);
@@ -349,6 +347,9 @@ export class InputText
     setUpLoadableComponent(this);
     this.requestedIcon = setRequestedIcon({}, this.icon, "text");
     await setUpMessages(this);
+
+    this.setPreviousEmittedValue(this.value);
+    this.setPreviousValue(this.value);
   }
 
   componentDidLoad(): void {
diff --git a/packages/calcite-components/src/components/input/input.tsx b/packages/calcite-components/src/components/input/input.tsx
index 919f62e0353..f4ff7ea5abb 100644
--- a/packages/calcite-components/src/components/input/input.tsx
+++ b/packages/calcite-components/src/components/input/input.tsx
@@ -487,22 +487,6 @@ export class Input
     connectLabel(this);
     connectForm(this);
 
-    this.setPreviousEmittedValue(this.value);
-    this.setPreviousValue(this.value);
-
-    if (this.type === "number") {
-      if (this.value === "Infinity" || this.value === "-Infinity") {
-        this.displayedValue = this.value;
-        this.previousEmittedValue = this.value;
-      } else {
-        this.warnAboutInvalidNumberValue(this.value);
-        this.setValue({
-          origin: "connected",
-          value: isValidNumber(this.value) ? this.value : "",
-        });
-      }
-    }
-
     this.mutationObserver?.observe(this.el, { childList: true });
 
     this.setDisabledAction();
@@ -527,6 +511,22 @@ export class Input
     this.minString = this.min?.toString();
     this.requestedIcon = setRequestedIcon(INPUT_TYPE_ICONS, this.icon, this.type);
     await setUpMessages(this);
+
+    this.setPreviousEmittedValue(this.value);
+    this.setPreviousValue(this.value);
+
+    if (this.type === "number") {
+      if (this.value === "Infinity" || this.value === "-Infinity") {
+        this.displayedValue = this.value;
+        this.previousEmittedValue = this.value;
+      } else {
+        this.warnAboutInvalidNumberValue(this.value);
+        this.setValue({
+          origin: "connected",
+          value: isValidNumber(this.value) ? this.value : "",
+        });
+      }
+    }
   }
 
   componentDidLoad(): void {