From b641a05e3d50f1ffe186543280510871bfdfe459 Mon Sep 17 00:00:00 2001
From: Lena Morita <lena@jaguchi.com>
Date: Fri, 9 Sep 2022 01:53:03 +0900
Subject: [PATCH] Components: Fix TS types for
 `isValueDefined()`/`isValueEmpty()` (#43983)

* Components: Fix TS types for isValueEmpty()

* Add changelog
---
 packages/components/CHANGELOG.md                 |  1 +
 packages/components/src/number-control/index.tsx | 14 +++++++-------
 packages/components/src/utils/math.js            |  8 ++++----
 packages/components/src/utils/values.js          | 10 ++++------
 4 files changed, 16 insertions(+), 17 deletions(-)

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
index b1055350e998a9..4aa5eb6c3c7108 100644
--- a/packages/components/CHANGELOG.md
+++ b/packages/components/CHANGELOG.md
@@ -29,6 +29,7 @@
 
 ### Internal
 
+-   Fix TypeScript types for `isValueDefined()` and `isValueEmpty()` utility functions ([#43983](https://github.com/WordPress/gutenberg/pull/43983)).
 -   `RadioControl`: Clean up styles to use less custom CSS ([#43868](https://github.com/WordPress/gutenberg/pull/43868)).
 -   Remove unused `normalizeArrowKey` utility function ([#43640](https://github.com/WordPress/gutenberg/pull/43640/)).
 -   `SearchControl`: Convert to TypeScript ([#43871](https://github.com/WordPress/gutenberg/pull/43871)).
diff --git a/packages/components/src/number-control/index.tsx b/packages/components/src/number-control/index.tsx
index 082418bb571d12..322f4116202c62 100644
--- a/packages/components/src/number-control/index.tsx
+++ b/packages/components/src/number-control/index.tsx
@@ -43,10 +43,13 @@ function UnforwardedNumberControl(
 	const isStepAny = step === 'any';
 	const baseStep = isStepAny ? 1 : ensureNumber( step );
 	const baseValue = roundClamp( 0, min, max, baseStep );
-	const constrainValue = ( value: number, stepOverride?: number ) => {
+	const constrainValue = (
+		value: number | string,
+		stepOverride?: number
+	) => {
 		// When step is "any" clamp the value, otherwise round and clamp it.
 		return isStepAny
-			? Math.min( max, Math.max( min, value ) )
+			? Math.min( max, Math.max( min, ensureNumber( value ) ) )
 			: roundClamp( value, min, max, stepOverride ?? baseStep );
 	};
 
@@ -91,18 +94,15 @@ function UnforwardedNumberControl(
 				}
 
 				if ( type === inputControlActionTypes.PRESS_UP ) {
-					// @ts-expect-error TODO: isValueEmpty() needs to be typed properly
 					nextValue = add( nextValue, incrementalValue );
 				}
 
 				if ( type === inputControlActionTypes.PRESS_DOWN ) {
-					// @ts-expect-error TODO: isValueEmpty() needs to be typed properly
 					nextValue = subtract( nextValue, incrementalValue );
 				}
 
 				// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
 				nextState.value = constrainValue(
-					// @ts-expect-error TODO: isValueEmpty() needs to be typed properly
 					nextValue,
 					enableShift ? incrementalValue : undefined
 				);
@@ -151,7 +151,7 @@ function UnforwardedNumberControl(
 
 					// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
 					nextState.value = constrainValue(
-						// @ts-expect-error TODO: isValueEmpty() needs to be typed properly
+						// @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined
 						add( currentValue, distance ),
 						enableShift ? modifier : undefined
 					);
@@ -171,7 +171,7 @@ function UnforwardedNumberControl(
 				// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
 				nextState.value = applyEmptyValue
 					? currentValue
-					: // @ts-expect-error TODO: isValueEmpty() needs to be typed properly
+					: // @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined
 					  constrainValue( currentValue );
 			}
 
diff --git a/packages/components/src/utils/math.js b/packages/components/src/utils/math.js
index 7ae59df819acc5..5bfb17e700ed39 100644
--- a/packages/components/src/utils/math.js
+++ b/packages/components/src/utils/math.js
@@ -73,10 +73,10 @@ export function clamp( value, min, max ) {
 /**
  * Clamps a value based on a min/max range with rounding
  *
- * @param {number} value The value.
- * @param {number} min   The minimum range.
- * @param {number} max   The maximum range.
- * @param {number} step  A multiplier for the value.
+ * @param {number | string} value The value.
+ * @param {number}          min   The minimum range.
+ * @param {number}          max   The maximum range.
+ * @param {number}          step  A multiplier for the value.
  *
  * @return {number} The rounded and clamped value.
  */
diff --git a/packages/components/src/utils/values.js b/packages/components/src/utils/values.js
index 8a124b70325de7..dacad621cc0e68 100644
--- a/packages/components/src/utils/values.js
+++ b/packages/components/src/utils/values.js
@@ -4,8 +4,8 @@
  *
  * @template T
  *
- * @param {T | null | undefined} value The value to check.
- * @return {value is T} Whether value is not null or undefined.
+ * @param {T} value The value to check.
+ * @return {value is Exclude<T, null | undefined>} Whether value is not null or undefined.
  */
 export function isValueDefined( value ) {
 	return value !== undefined && value !== null;
@@ -16,10 +16,8 @@ export function isValueDefined( value ) {
 /**
  * Determines if a value is empty, null, or undefined.
  *
- * @template T
- *
- * @param {T | "" | null | undefined} value The value to check.
- * @return {value is T} Whether value is empty.
+ * @param {string | number | null | undefined} value The value to check.
+ * @return {value is ("" | null | undefined)} Whether value is empty.
  */
 export function isValueEmpty( value ) {
 	const isEmptyString = value === '';