fix(input, input-number): increment/decrement to the min/max when value is below/above (#6207)

**Related Issue:** #6201

## Summary
Follows the native input's behavior by incrementing/decrementing to the
`min`/`max` property when `value` is below/above

Author: benelan

src/components/input-number/input-number.e2e.ts

@@ -333,6 +333,38 @@ describe("calcite-input-number", () => {
       expect(await input.getProperty("value")).toBe(`${finalNudgedValue * 0.01}`);
     });
 
+    it("decrements to max when value is higher", async () => {
+      await page.setContent(html`<calcite-input-number max="10" value="20"></calcite-input-number>`);
+
+      const element = await page.find("calcite-input-number");
+      const numberHorizontalItemDown = await page.find(
+        "calcite-input-number >>> .number-button-item[data-adjustment='down']"
+      );
+
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("10");
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("9");
+    });
+
+    it("increments to min when value is lower", async () => {
+      await page.setContent(html`<calcite-input-number min="20" value="11"></calcite-input-number>`);
+
+      const element = await page.find("calcite-input-number");
+      const numberHorizontalItemDown = await page.find(
+        "calcite-input-number >>> .number-button-item[data-adjustment='down']"
+      );
+
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("20");
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("20");
+    });
+
     it("correctly increments and decrements value by one when any is set for step", async () => {
       await page.setContent(html`<calcite-input-number step="any" value="5.5"></calcite-input-number>`);
 

src/components/input-number/input-number.tsx

@@ -526,9 +526,10 @@ export class InputNumber
     const adjustment = direction === "up" ? 1 : -1;
     const nudgedValue = inputVal + inputStep * adjustment;
     const finalValue =
-      (typeof inputMin === "number" && !isNaN(inputMin) && nudgedValue < inputMin) ||
-      (typeof inputMax === "number" && !isNaN(inputMax) && nudgedValue > inputMax)
-        ? inputVal
+      typeof inputMin === "number" && !isNaN(inputMin) && nudgedValue < inputMin
+        ? inputMin
+        : typeof inputMax === "number" && !isNaN(inputMax) && nudgedValue > inputMax
+        ? inputMax
         : nudgedValue;
 
     const inputValPlaces = decimalPlaces(inputVal);

src/components/input/input.e2e.ts

@@ -383,6 +383,34 @@ describe("calcite-input", () => {
       expect(await element.getProperty("value")).toBe("6");
     });
 
+    it("decrements to max when value is higher", async () => {
+      await page.setContent(html`<calcite-input type="number" max="10" value="20"></calcite-input>`);
+
+      const element = await page.find("calcite-input");
+      const numberHorizontalItemDown = await page.find("calcite-input >>> .number-button-item[data-adjustment='down']");
+
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("10");
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("9");
+    });
+
+    it("increments to min when value is lower", async () => {
+      await page.setContent(html`<calcite-input type="number" min="20" value="11"></calcite-input>`);
+
+      const element = await page.find("calcite-input");
+      const numberHorizontalItemDown = await page.find("calcite-input >>> .number-button-item[data-adjustment='down']");
+
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("20");
+      await numberHorizontalItemDown.click();
+      await page.waitForChanges();
+      expect(await element.getProperty("value")).toBe("20");
+    });
+
     it("correctly stops decrementing value when min is set", async () => {
       await page.setContent(html`<calcite-input type="number" min="10" value="11"></calcite-input>`);
 

src/components/input/input.tsx

@@ -610,9 +610,10 @@ export class Input
     const adjustment = direction === "up" ? 1 : -1;
     const nudgedValue = inputVal + inputStep * adjustment;
     const finalValue =
-      (typeof inputMin === "number" && !isNaN(inputMin) && nudgedValue < inputMin) ||
-      (typeof inputMax === "number" && !isNaN(inputMax) && nudgedValue > inputMax)
-        ? inputVal
+      typeof inputMin === "number" && !isNaN(inputMin) && nudgedValue < inputMin
+        ? inputMin
+        : typeof inputMax === "number" && !isNaN(inputMax) && nudgedValue > inputMax
+        ? inputMax
         : nudgedValue;
 
     const inputValPlaces = decimalPlaces(inputVal);