refactor: port deprecateValuesWithin to typescript (#20394)

* refactor: port deprecateValuesWithin to typescript

* refactor: update deprecateValuesWithin generics

Author: adamalston

packages/react/src/components/CodeSnippet/CodeSnippet.tsx

@@ -23,7 +23,7 @@ import { useId } from '../../internal/useId';
 import copy from 'copy-to-clipboard';
 import { deprecate } from '../../prop-types/deprecate';
 import { usePrefix } from '../../internal/usePrefix';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 import type {
   DeprecatedPopoverAlignment,
   NewPopoverAlignment,

packages/react/src/components/ComboButton/index.tsx

@@ -26,7 +26,7 @@ import { useFeatureFlag } from '../FeatureFlags';
 import mergeRefs from '../../tools/mergeRefs';
 import { MenuAlignment } from '../MenuButton';
 import { TranslateWithId } from '../../types/common';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 import { mapPopoverAlign } from '../../tools/mapPopoverAlign';
 
 const defaultTranslations = {

packages/react/src/components/Copy/Copy.tsx

@@ -20,7 +20,7 @@ import { composeEventHandlers } from '../../tools/events';
 import { usePrefix } from '../../internal/usePrefix';
 import { IconButton } from '../IconButton';
 import { noopFn } from '../../internal/noopFn';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 import { mapPopoverAlign } from '../../tools/mapPopoverAlign';
 import type {
   DeprecatedPopoverAlignment,

packages/react/src/components/CopyButton/CopyButton.tsx

@@ -14,7 +14,7 @@ import Copy from '../Copy';
 import { LayoutConstraint } from '../Layout';
 import { usePrefix } from '../../internal/usePrefix';
 import { noopFn } from '../../internal/noopFn';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 import { mapPopoverAlign } from '../../tools/mapPopoverAlign';
 import type {
   DeprecatedPopoverAlignment,

packages/react/src/components/IconButton/index.tsx

@@ -13,7 +13,7 @@ import { Tooltip } from '../Tooltip';
 import { useId } from '../../internal/useId';
 import { usePrefix } from '../../internal/usePrefix';
 import ButtonBase from '../Button/ButtonBase';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 import BadgeIndicator from '../BadgeIndicator';
 import type {
   DeprecatedPopoverAlignment,

packages/react/src/components/Notification/Notification.tsx

@@ -41,7 +41,7 @@ import { noopFn } from '../../internal/noopFn';
 import { wrapFocus, wrapFocusWithoutSentinels } from '../../internal/wrapFocus';
 import { useFeatureFlag } from '../FeatureFlags';
 import { warning } from '../../internal/warning';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 
 /**
  * Conditionally call a callback when the escape key is pressed
@@ -1249,11 +1249,12 @@ export type NewKindProps = 'warning' | 'info';
 
 export type KindProps = DeprecatedKindProps | NewKindProps;
 
-const propMappingFunction = (deprecatedValue) => {
-  const mapping = {
-    error: 'warning', // only redirect error -> warning
-    success: 'info', // only redirect success -> info
-  };
+const mapping = {
+  error: 'warning', // only redirect error -> warning
+  success: 'info', // only redirect success -> info
+};
+
+const propMappingFunction = (deprecatedValue: string) => {
   return mapping[deprecatedValue];
 };
 

packages/react/src/components/OverflowMenu/OverflowMenu.tsx

@@ -43,7 +43,7 @@ import { setupGetInstanceId } from '../../tools/setupGetInstanceId';
 import { IconButton, IconButtonProps } from '../IconButton';
 import { OverflowMenuItemProps } from '../OverflowMenuItem/OverflowMenuItem';
 import { useOutsideClick } from '../../internal/useOutsideClick';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 import { mapPopoverAlign } from '../../tools/mapPopoverAlign';
 
 const getInstanceId = setupGetInstanceId();

packages/react/src/components/OverflowMenu/next/index.tsx

@@ -20,7 +20,7 @@ import mergeRefs from '../../../tools/mergeRefs';
 import { useId } from '../../../internal/useId';
 import { usePrefix } from '../../../internal/usePrefix';
 import { useAttachedMenu } from '../../../internal/useAttachedMenu';
-import deprecateValuesWithin from '../../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../../prop-types/deprecateValuesWithin';
 import { mapPopoverAlign } from '../../../tools/mapPopoverAlign';
 
 const defaultSize = 'md';

packages/react/src/components/Popover/index.tsx

@@ -7,7 +7,7 @@
 
 import cx from 'classnames';
 import PropTypes, { WeakValidationMap } from 'prop-types';
-import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin';
+import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin';
 import React, { useEffect, useMemo, useRef, type ElementType } from 'react';
 import useIsomorphicEffect from '../../internal/useIsomorphicEffect';
 import { useMergedRefs } from '../../internal/useMergedRefs';

packages/react/src/prop-types/deprecateValuesWithin.js renamed to packages/react/src/prop-types/deprecateValuesWithin.ts

@@ -1,22 +1,25 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
+import type { Requireable, Validator } from 'prop-types';
 import { warning } from '../internal/warning';
 
-const didWarnAboutDeprecation = {};
+type DeprecationTracker = Record<string, Record<string, boolean>>;
 
-export default function deprecateValuesWithin(
-  propType,
-  allowedValues,
-  propMappingFunction
-) {
-  return function checker(props, propName, componentName, ...rest) {
-    if (props[propName] === undefined) {
-      return;
+const didWarnAboutDeprecation: DeprecationTracker = {};
+
+export const deprecateValuesWithin = <T>(
+  propType: Requireable<T>,
+  allowedValues?: readonly unknown[],
+  propMappingFunction?: (deprecatedValue: T) => T
+): Validator<T> | Requireable<T> => {
+  return (props, propName, componentName, ...rest) => {
+    if (typeof props[propName] === 'undefined') {
+      return null;
     }
 
     if (
@@ -45,4 +48,4 @@ export default function deprecateValuesWithin(
     }
     return propType(props, propName, componentName, ...rest);
   };
-}
+};