@wordpress/components 25.5.0 → 25.6.0

package/build-module/unit-control/index.js

@@ -1,16 +1,17 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * External dependencies
  */
+
 import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-
 import deprecated from '@wordpress/deprecated';
 import { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
+
 /**
  * Internal dependencies
  */
@@ -20,7 +21,6 @@ import UnitSelectControl from './unit-select-control';
 import { CSS_UNITS, getParsedQuantityAndUnit, getUnitsWithCurrentUnit, getValidParsedQuantityAndUnit } from './utils';
 import { useControlledState } from '../utils/hooks';
 import { escapeRegExp } from '../utils/strings';
-
 function UnforwardedUnitControl(unitControlProps, forwardedRef) {
   const {
     __unstableStateReducer,
@@ -43,18 +43,17 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
     onFocus: onFocusProp,
     ...props
   } = unitControlProps;
-
   if ('unit' in unitControlProps) {
     deprecated('UnitControl unit prop', {
       since: '5.6',
       hint: 'The unit should be provided within the `value` prop.',
       version: '6.2'
     });
-  } // The `value` prop, in theory, should not be `null`, but the following line
+  }
+
+  // The `value` prop, in theory, should not be `null`, but the following line
   // ensures it fallback to `undefined` in case a consumer of `UnitControl`
   // still passes `null` as a `value`.
-
-
   const nonNullValueProp = valueProp !== null && valueProp !== void 0 ? valueProp : undefined;
   const [units, reFirstCharacterOfUnits] = useMemo(() => {
     const list = getUnitsWithCurrentUnit(nonNullValueProp, unitProp, unitsProp);
@@ -79,52 +78,45 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
       setUnit(parsedUnit);
     }
   }, [parsedUnit, setUnit]);
-  const classes = classnames('components-unit-control', // This class is added for legacy purposes to maintain it on the outer
+  const classes = classnames('components-unit-control',
+  // This class is added for legacy purposes to maintain it on the outer
   // wrapper. See: https://github.com/WordPress/gutenberg/pull/45139
   'components-unit-control-wrapper', className);
-
   const handleOnQuantityChange = (nextQuantityValue, changeProps) => {
     if (nextQuantityValue === '' || typeof nextQuantityValue === 'undefined' || nextQuantityValue === null) {
       onChangeProp?.('', changeProps);
       return;
     }
+
     /*
      * Customizing the onChange callback.
      * This allows as to broadcast a combined value+unit to onChange.
      */
-
-
     const onChangeValue = getValidParsedQuantityAndUnit(nextQuantityValue, units, parsedQuantity, unit).join('');
     onChangeProp?.(onChangeValue, changeProps);
   };
-
   const handleOnUnitChange = (nextUnitValue, changeProps) => {
     const {
       data
     } = changeProps;
     let nextValue = `${parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : ''}${nextUnitValue}`;
-
     if (isResetValueOnUnitChange && data?.default !== undefined) {
       nextValue = `${data.default}${nextUnitValue}`;
     }
-
     onChangeProp?.(nextValue, changeProps);
     onUnitChange?.(nextUnitValue, changeProps);
     setUnit(nextUnitValue);
   };
-
   let handleOnKeyDown;
-
   if (!disableUnits && isUnitSelectTabbable && units.length) {
     handleOnKeyDown = event => {
-      props.onKeyDown?.(event); // Unless the meta key was pressed (to avoid interfering with
+      props.onKeyDown?.(event);
+      // Unless the meta key was pressed (to avoid interfering with
       // shortcuts, e.g. pastes), moves focus to the unit select if a key
       // matches the first character of a unit.
-
       if (!event.metaKey && reFirstCharacterOfUnits.test(event.key)) refInputSuffix.current?.focus();
     };
   }
-
   const refInputSuffix = useRef(null);
   const inputSuffix = !disableUnits ? createElement(UnitSelectControl, {
     ref: refInputSuffix,
@@ -139,19 +131,18 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
     onBlur: unitControlProps.onBlur
   }) : null;
   let step = props.step;
+
   /*
    * If no step prop has been passed, lookup the active unit and
    * try to get step from `units`, or default to a value of `1`
    */
-
   if (!step && units) {
     var _activeUnit$step;
-
     const activeUnit = units.find(option => option.value === unit);
     step = (_activeUnit$step = activeUnit?.step) !== null && _activeUnit$step !== void 0 ? _activeUnit$step : 1;
   }
-
-  return createElement(ValueInput, { ...props,
+  return createElement(ValueInput, {
+    ...props,
     autoComplete: autoComplete,
     className: classes,
     disabled: disabled,
@@ -170,6 +161,7 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
     __unstableStateReducer: __unstableStateReducer
   });
 }
+
 /**
  * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).
  *
@@ -186,8 +178,6 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
  * };
  * ```
  */
-
-
 export const UnitControl = forwardRef(UnforwardedUnitControl);
 export { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';
 export default UnitControl;

package/build-module/unit-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["classnames","deprecated","forwardRef","useMemo","useRef","useEffect","__","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","escapeRegExp","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","autoComplete","children","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","unit","unitProp","units","unitsProp","value","valueProp","onFocus","onFocusProp","props","since","hint","version","nonNullValueProp","undefined","reFirstCharacterOfUnits","list","firstUnitValue","rest","firstCharacters","reduce","carry","first","substring","includes","RegExp","parsedQuantity","parsedUnit","setUnit","length","initial","fallback","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","handleOnKeyDown","event","onKeyDown","metaKey","test","key","refInputSuffix","current","focus","inputSuffix","onBlur","step","activeUnit","find","option","UnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { KeyboardEvent, ForwardedRef, SyntheticEvent } from 'react';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport { ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport { escapeRegExp } from '../utils/strings';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\n\nfunction UnforwardedUnitControl(\n\tunitControlProps: WordPressComponentProps<\n\t\tUnitControlProps,\n\t\t'input',\n\t\tfalse\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__unstableStateReducer,\n\t\tautoComplete = 'off',\n\t\t// @ts-expect-error Ensure that children is omitted from restProps\n\t\tchildren,\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange: onChangeProp,\n\t\tonUnitChange,\n\t\tsize = 'default',\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\tonFocus: onFocusProp,\n\t\t...props\n\t} = unitControlProps;\n\n\tif ( 'unit' in unitControlProps ) {\n\t\tdeprecated( 'UnitControl unit prop', {\n\t\t\tsince: '5.6',\n\t\t\thint: 'The unit should be provided within the `value` prop.',\n\t\t\tversion: '6.2',\n\t\t} );\n\t}\n\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst [ units, reFirstCharacterOfUnits ] = useMemo( () => {\n\t\tconst list = getUnitsWithCurrentUnit(\n\t\t\tnonNullValueProp,\n\t\t\tunitProp,\n\t\t\tunitsProp\n\t\t);\n\t\tconst [ { value: firstUnitValue = '' } = {}, ...rest ] = list;\n\t\tconst firstCharacters = rest.reduce( ( carry, { value } ) => {\n\t\t\tconst first = escapeRegExp( value?.substring( 0, 1 ) || '' );\n\t\t\treturn carry.includes( first ) ? carry : `${ carry }|${ first }`;\n\t\t}, escapeRegExp( firstUnitValue.substring( 0, 1 ) ) );\n\t\treturn [ list, new RegExp( `^(?:${ firstCharacters })$`, 'i' ) ];\n\t}, [ nonNullValueProp, unitProp, unitsProp ] );\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunits.length === 1 ? units[ 0 ].value : unitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tif ( parsedUnit !== undefined ) {\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t}, [ parsedUnit, setUnit ] );\n\n\tconst classes = classnames(\n\t\t'components-unit-control',\n\t\t// This class is added for legacy purposes to maintain it on the outer\n\t\t// wrapper. See: https://github.com/WordPress/gutenberg/pull/45139\n\t\t'components-unit-control-wrapper',\n\t\tclassName\n\t);\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: {\n\t\t\tevent: SyntheticEvent;\n\t\t}\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChangeProp?.( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChangeProp?.( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChangeProp?.( nextValue, changeProps );\n\t\tonUnitChange?.( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tlet handleOnKeyDown;\n\tif ( ! disableUnits && isUnitSelectTabbable && units.length ) {\n\t\thandleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\t\tprops.onKeyDown?.( event );\n\t\t\t// Unless the meta key was pressed (to avoid interfering with\n\t\t\t// shortcuts, e.g. pastes), moves focus to the unit select if a key\n\t\t\t// matches the first character of a unit.\n\t\t\tif ( ! event.metaKey && reFirstCharacterOfUnits.test( event.key ) )\n\t\t\t\trefInputSuffix.current?.focus();\n\t\t};\n\t}\n\n\tconst refInputSuffix = useRef< HTMLSelectElement >( null );\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\tref={ refInputSuffix }\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t\tonFocus={ onFocusProp }\n\t\t\tonBlur={ unitControlProps.onBlur }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<ValueInput\n\t\t\t{ ...props }\n\t\t\tautoComplete={ autoComplete }\n\t\t\tclassName={ classes }\n\t\t\tdisabled={ disabled }\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\tlabel={ label }\n\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\tonChange={ handleOnQuantityChange }\n\t\t\tref={ forwardedRef }\n\t\t\tsize={ size }\n\t\t\tsuffix={ inputSuffix }\n\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\tstep={ step }\n\t\t\tonFocus={ onFocusProp }\n\t\t\t__unstableStateReducer={ __unstableStateReducer }\n\t\t/>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '10px' );\n *\n *   return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nexport const UnitControl = forwardRef( UnforwardedUnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default UnitControl;\n"]}
+{"version":3,"names":["classnames","deprecated","forwardRef","useMemo","useRef","useEffect","__","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","escapeRegExp","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","autoComplete","children","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","unit","unitProp","units","unitsProp","value","valueProp","onFocus","onFocusProp","props","since","hint","version","nonNullValueProp","undefined","reFirstCharacterOfUnits","list","firstUnitValue","rest","firstCharacters","reduce","carry","first","substring","includes","RegExp","parsedQuantity","parsedUnit","setUnit","length","initial","fallback","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","handleOnKeyDown","event","onKeyDown","metaKey","test","key","refInputSuffix","current","focus","inputSuffix","createElement","ref","onBlur","step","_activeUnit$step","activeUnit","find","option","spinControls","suffix","type","UnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"sources":["@wordpress/components/src/unit-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { KeyboardEvent, ForwardedRef, SyntheticEvent } from 'react';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport { ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport { escapeRegExp } from '../utils/strings';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\n\nfunction UnforwardedUnitControl(\n\tunitControlProps: WordPressComponentProps<\n\t\tUnitControlProps,\n\t\t'input',\n\t\tfalse\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__unstableStateReducer,\n\t\tautoComplete = 'off',\n\t\t// @ts-expect-error Ensure that children is omitted from restProps\n\t\tchildren,\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange: onChangeProp,\n\t\tonUnitChange,\n\t\tsize = 'default',\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\tonFocus: onFocusProp,\n\t\t...props\n\t} = unitControlProps;\n\n\tif ( 'unit' in unitControlProps ) {\n\t\tdeprecated( 'UnitControl unit prop', {\n\t\t\tsince: '5.6',\n\t\t\thint: 'The unit should be provided within the `value` prop.',\n\t\t\tversion: '6.2',\n\t\t} );\n\t}\n\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst [ units, reFirstCharacterOfUnits ] = useMemo( () => {\n\t\tconst list = getUnitsWithCurrentUnit(\n\t\t\tnonNullValueProp,\n\t\t\tunitProp,\n\t\t\tunitsProp\n\t\t);\n\t\tconst [ { value: firstUnitValue = '' } = {}, ...rest ] = list;\n\t\tconst firstCharacters = rest.reduce( ( carry, { value } ) => {\n\t\t\tconst first = escapeRegExp( value?.substring( 0, 1 ) || '' );\n\t\t\treturn carry.includes( first ) ? carry : `${ carry }|${ first }`;\n\t\t}, escapeRegExp( firstUnitValue.substring( 0, 1 ) ) );\n\t\treturn [ list, new RegExp( `^(?:${ firstCharacters })$`, 'i' ) ];\n\t}, [ nonNullValueProp, unitProp, unitsProp ] );\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunits.length === 1 ? units[ 0 ].value : unitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tif ( parsedUnit !== undefined ) {\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t}, [ parsedUnit, setUnit ] );\n\n\tconst classes = classnames(\n\t\t'components-unit-control',\n\t\t// This class is added for legacy purposes to maintain it on the outer\n\t\t// wrapper. See: https://github.com/WordPress/gutenberg/pull/45139\n\t\t'components-unit-control-wrapper',\n\t\tclassName\n\t);\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: {\n\t\t\tevent: SyntheticEvent;\n\t\t}\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChangeProp?.( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChangeProp?.( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChangeProp?.( nextValue, changeProps );\n\t\tonUnitChange?.( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tlet handleOnKeyDown;\n\tif ( ! disableUnits && isUnitSelectTabbable && units.length ) {\n\t\thandleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\t\tprops.onKeyDown?.( event );\n\t\t\t// Unless the meta key was pressed (to avoid interfering with\n\t\t\t// shortcuts, e.g. pastes), moves focus to the unit select if a key\n\t\t\t// matches the first character of a unit.\n\t\t\tif ( ! event.metaKey && reFirstCharacterOfUnits.test( event.key ) )\n\t\t\t\trefInputSuffix.current?.focus();\n\t\t};\n\t}\n\n\tconst refInputSuffix = useRef< HTMLSelectElement >( null );\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\tref={ refInputSuffix }\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t\tonFocus={ onFocusProp }\n\t\t\tonBlur={ unitControlProps.onBlur }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<ValueInput\n\t\t\t{ ...props }\n\t\t\tautoComplete={ autoComplete }\n\t\t\tclassName={ classes }\n\t\t\tdisabled={ disabled }\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\tlabel={ label }\n\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\tonChange={ handleOnQuantityChange }\n\t\t\tref={ forwardedRef }\n\t\t\tsize={ size }\n\t\t\tsuffix={ inputSuffix }\n\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\tstep={ step }\n\t\t\tonFocus={ onFocusProp }\n\t\t\t__unstableStateReducer={ __unstableStateReducer }\n\t\t/>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '10px' );\n *\n *   return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nexport const UnitControl = forwardRef( UnforwardedUnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default UnitControl;\n"],"mappings":"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"}

package/build-module/unit-control/index.native.js

@@ -1,26 +1,24 @@
 import { createElement, Fragment } from "@wordpress/element";
-
 /**
  * External dependencies
  */
 import { Text, View, TouchableWithoutFeedback, Platform, findNodeHandle } from 'react-native';
+
 /**
  * Internal dependencies
  */
-
 import RangeCell from '../mobile/bottom-sheet/range-cell';
 import StepperCell from '../mobile/bottom-sheet/stepper-cell';
 import Picker from '../mobile/picker';
 import styles from './style.scss';
 import { CSS_UNITS, hasUnits, getAccessibleLabelForUnit } from './utils';
+
 /**
  * WordPress dependencies
  */
-
 import { useRef, useCallback, useMemo, memo } from '@wordpress/element';
 import { withPreferredColorScheme } from '@wordpress/compose';
 import { __, sprintf } from '@wordpress/i18n';
-
 function UnitControl({
   currentInput,
   label,
@@ -41,17 +39,17 @@ function UnitControl({
   const onPickerPresent = useCallback(() => {
     if (pickerRef?.current) {
       pickerRef.current.presentPicker();
-    } // Disable reason: this should be fixed by the native team.
+    }
+    // Disable reason: this should be fixed by the native team.
     // It would be great if this could be done in the context of
     // https://github.com/WordPress/gutenberg/pull/39218
     // eslint-disable-next-line react-hooks/exhaustive-deps
-
   }, [pickerRef?.current]);
   const currentInputValue = currentInput === null ? value : currentInput;
   const initialControlValue = isFinite(currentInputValue) ? currentInputValue : initialPosition;
   const unitButtonTextStyle = getStylesFromColorScheme(styles.unitButtonText, styles.unitButtonTextDark);
-  /* translators: accessibility text. Inform about current unit value. %s: Current unit value. */
 
+  /* translators: accessibility text. Inform about current unit value. %s: Current unit value. */
   const accessibilityLabel = sprintf(__('Current unit is %s'), unit);
   const accessibilityHint = Platform.OS === 'ios' ? __('Double tap to open Action Sheet with available options') : __('Double tap to open Bottom Sheet with available options');
   const renderUnitButton = useMemo(() => {
@@ -60,7 +58,6 @@ function UnitControl({
     }, createElement(Text, {
       style: unitButtonTextStyle
     }, unit));
-
     if (hasUnits(units) && units?.length > 1) {
       return createElement(TouchableWithoutFeedback, {
         onPress: onPickerPresent,
@@ -69,15 +66,14 @@ function UnitControl({
         accessibilityHint: accessibilityHint
       }, unitButton);
     }
-
     return unitButton;
   }, [onPickerPresent, accessibilityLabel, accessibilityHint, unitButtonTextStyle, unit, units]);
-  const getAnchor = useCallback(() => anchorNodeRef?.current ? findNodeHandle(anchorNodeRef?.current) : undefined, // Disable reason: this should be fixed by the native team.
+  const getAnchor = useCallback(() => anchorNodeRef?.current ? findNodeHandle(anchorNodeRef?.current) : undefined,
+  // Disable reason: this should be fixed by the native team.
   // It would be great if this could be done in the context of
   // https://github.com/WordPress/gutenberg/pull/39218
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [anchorNodeRef?.current]);
-
   const getDecimal = step => {
     // Return the decimal offset based on the step size.
     // if step size is 0.1 we expect the offset to be 1.
@@ -87,14 +83,12 @@ function UnitControl({
     const splitStep = stepToString.toString().split('.');
     return splitStep[1] ? splitStep[1].length : 0;
   };
-
   const renderUnitPicker = useCallback(() => {
     // Keeping for legacy reasons, although `false` should not be a valid
     // value for the `units` prop anymore.
     if (units === false) {
       return null;
     }
-
     return createElement(View, {
       style: styles.unitMenu,
       ref: anchorNodeRef
@@ -108,18 +102,16 @@ function UnitControl({
     }) : null);
   }, [pickerRef, units, onUnitChange, getAnchor, renderUnitButton]);
   let step = props.step;
+
   /*
    * If no step prop has been passed, lookup the active unit and
    * try to get step from `units`, or default to a value of `1`
    */
-
   if (!step && units) {
     var _activeUnit$step;
-
     const activeUnit = units.find(option => option.value === unit);
     step = (_activeUnit$step = activeUnit?.step) !== null && _activeUnit$step !== void 0 ? _activeUnit$step : 1;
   }
-
   const decimalNum = getDecimal(step);
   return createElement(Fragment, null, unit !== '%' ? createElement(StepperCell, {
     label: label,
@@ -151,7 +143,6 @@ function UnitControl({
     ...props
   }, renderUnitPicker()));
 }
-
 export { useCustomUnits } from './utils';
 export default memo(withPreferredColorScheme(UnitControl));
 //# sourceMappingURL=index.native.js.map

package/build-module/unit-control/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/unit-control/index.native.js"],"names":["Text","View","TouchableWithoutFeedback","Platform","findNodeHandle","RangeCell","StepperCell","Picker","styles","CSS_UNITS","hasUnits","getAccessibleLabelForUnit","useRef","useCallback","useMemo","memo","withPreferredColorScheme","__","sprintf","UnitControl","currentInput","label","value","onChange","onUnitChange","initialPosition","min","max","separatorType","units","unit","getStylesFromColorScheme","props","pickerRef","anchorNodeRef","onPickerPresent","current","presentPicker","currentInputValue","initialControlValue","isFinite","unitButtonTextStyle","unitButtonText","unitButtonTextDark","accessibilityLabel","accessibilityHint","OS","renderUnitButton","unitButton","length","getAnchor","undefined","getDecimal","step","stepToString","splitStep","toString","split","renderUnitPicker","unitMenu","activeUnit","find","option","decimalNum","useCustomUnits"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tText,\n\tView,\n\tTouchableWithoutFeedback,\n\tPlatform,\n\tfindNodeHandle,\n} from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport RangeCell from '../mobile/bottom-sheet/range-cell';\nimport StepperCell from '../mobile/bottom-sheet/stepper-cell';\nimport Picker from '../mobile/picker';\nimport styles from './style.scss';\nimport { CSS_UNITS, hasUnits, getAccessibleLabelForUnit } from './utils';\n\n/**\n * WordPress dependencies\n */\nimport { useRef, useCallback, useMemo, memo } from '@wordpress/element';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\n\nfunction UnitControl( {\n\tcurrentInput,\n\tlabel,\n\tvalue,\n\tonChange,\n\tonUnitChange,\n\tinitialPosition,\n\tmin,\n\tmax,\n\tseparatorType,\n\tunits = CSS_UNITS,\n\tunit,\n\tgetStylesFromColorScheme,\n\t...props\n} ) {\n\tconst pickerRef = useRef();\n\tconst anchorNodeRef = useRef();\n\n\tconst onPickerPresent = useCallback( () => {\n\t\tif ( pickerRef?.current ) {\n\t\t\tpickerRef.current.presentPicker();\n\t\t}\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ pickerRef?.current ] );\n\n\tconst currentInputValue = currentInput === null ? value : currentInput;\n\tconst initialControlValue = isFinite( currentInputValue )\n\t\t? currentInputValue\n\t\t: initialPosition;\n\n\tconst unitButtonTextStyle = getStylesFromColorScheme(\n\t\tstyles.unitButtonText,\n\t\tstyles.unitButtonTextDark\n\t);\n\n\t/* translators: accessibility text. Inform about current unit value. %s: Current unit value. */\n\tconst accessibilityLabel = sprintf( __( 'Current unit is %s' ), unit );\n\n\tconst accessibilityHint =\n\t\tPlatform.OS === 'ios'\n\t\t\t? __( 'Double tap to open Action Sheet with available options' )\n\t\t\t: __( 'Double tap to open Bottom Sheet with available options' );\n\n\tconst renderUnitButton = useMemo( () => {\n\t\tconst unitButton = (\n\t\t\t<View style={ styles.unitButton }>\n\t\t\t\t<Text style={ unitButtonTextStyle }>{ unit }</Text>\n\t\t\t</View>\n\t\t);\n\n\t\tif ( hasUnits( units ) && units?.length > 1 ) {\n\t\t\treturn (\n\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\tonPress={ onPickerPresent }\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t>\n\t\t\t\t\t{ unitButton }\n\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t);\n\t\t}\n\n\t\treturn unitButton;\n\t}, [\n\t\tonPickerPresent,\n\t\taccessibilityLabel,\n\t\taccessibilityHint,\n\t\tunitButtonTextStyle,\n\t\tunit,\n\t\tunits,\n\t] );\n\n\tconst getAnchor = useCallback(\n\t\t() =>\n\t\t\tanchorNodeRef?.current\n\t\t\t\t? findNodeHandle( anchorNodeRef?.current )\n\t\t\t\t: undefined,\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t[ anchorNodeRef?.current ]\n\t);\n\n\tconst getDecimal = ( step ) => {\n\t\t// Return the decimal offset based on the step size.\n\t\t// if step size is 0.1 we expect the offset to be 1.\n\t\t// for example 12 + 0.1 we would expect the see 12.1 (not 12.10 or 12 );\n\t\t// steps are defined in the CSS_UNITS and they vary from unit to unit.\n\t\tconst stepToString = step;\n\t\tconst splitStep = stepToString.toString().split( '.' );\n\t\treturn splitStep[ 1 ] ? splitStep[ 1 ].length : 0;\n\t};\n\n\tconst renderUnitPicker = useCallback( () => {\n\t\t// Keeping for legacy reasons, although `false` should not be a valid\n\t\t// value for the `units` prop anymore.\n\t\tif ( units === false ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn (\n\t\t\t<View style={ styles.unitMenu } ref={ anchorNodeRef }>\n\t\t\t\t{ renderUnitButton }\n\t\t\t\t{ hasUnits( units ) && units?.length > 1 ? (\n\t\t\t\t\t<Picker\n\t\t\t\t\t\tref={ pickerRef }\n\t\t\t\t\t\toptions={ units }\n\t\t\t\t\t\tonChange={ onUnitChange }\n\t\t\t\t\t\thideCancelButton\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\tgetAnchor={ getAnchor }\n\t\t\t\t\t/>\n\t\t\t\t) : null }\n\t\t\t</View>\n\t\t);\n\t}, [ pickerRef, units, onUnitChange, getAnchor, renderUnitButton ] );\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\tconst decimalNum = getDecimal( step );\n\n\treturn (\n\t\t<>\n\t\t\t{ unit !== '%' ? (\n\t\t\t\t<StepperCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tmax={ max }\n\t\t\t\t\tmin={ min }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tshouldDisplayTextInput\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</StepperCell>\n\t\t\t) : (\n\t\t\t\t<RangeCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tminimumValue={ min }\n\t\t\t\t\tmaximumValue={ max }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tunit={ unit }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</RangeCell>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport { useCustomUnits } from './utils';\nexport default memo( withPreferredColorScheme( UnitControl ) );\n"]}
+{"version":3,"names":["Text","View","TouchableWithoutFeedback","Platform","findNodeHandle","RangeCell","StepperCell","Picker","styles","CSS_UNITS","hasUnits","getAccessibleLabelForUnit","useRef","useCallback","useMemo","memo","withPreferredColorScheme","__","sprintf","UnitControl","currentInput","label","value","onChange","onUnitChange","initialPosition","min","max","separatorType","units","unit","getStylesFromColorScheme","props","pickerRef","anchorNodeRef","onPickerPresent","current","presentPicker","currentInputValue","initialControlValue","isFinite","unitButtonTextStyle","unitButtonText","unitButtonTextDark","accessibilityLabel","accessibilityHint","OS","renderUnitButton","unitButton","createElement","style","length","onPress","accessibilityRole","getAnchor","undefined","getDecimal","step","stepToString","splitStep","toString","split","renderUnitPicker","unitMenu","ref","options","hideCancelButton","leftAlign","_activeUnit$step","activeUnit","find","option","decimalNum","Fragment","defaultValue","shouldDisplayTextInput","openUnitPicker","unitLabel","minimumValue","maximumValue","useCustomUnits"],"sources":["@wordpress/components/src/unit-control/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tText,\n\tView,\n\tTouchableWithoutFeedback,\n\tPlatform,\n\tfindNodeHandle,\n} from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport RangeCell from '../mobile/bottom-sheet/range-cell';\nimport StepperCell from '../mobile/bottom-sheet/stepper-cell';\nimport Picker from '../mobile/picker';\nimport styles from './style.scss';\nimport { CSS_UNITS, hasUnits, getAccessibleLabelForUnit } from './utils';\n\n/**\n * WordPress dependencies\n */\nimport { useRef, useCallback, useMemo, memo } from '@wordpress/element';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\n\nfunction UnitControl( {\n\tcurrentInput,\n\tlabel,\n\tvalue,\n\tonChange,\n\tonUnitChange,\n\tinitialPosition,\n\tmin,\n\tmax,\n\tseparatorType,\n\tunits = CSS_UNITS,\n\tunit,\n\tgetStylesFromColorScheme,\n\t...props\n} ) {\n\tconst pickerRef = useRef();\n\tconst anchorNodeRef = useRef();\n\n\tconst onPickerPresent = useCallback( () => {\n\t\tif ( pickerRef?.current ) {\n\t\t\tpickerRef.current.presentPicker();\n\t\t}\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ pickerRef?.current ] );\n\n\tconst currentInputValue = currentInput === null ? value : currentInput;\n\tconst initialControlValue = isFinite( currentInputValue )\n\t\t? currentInputValue\n\t\t: initialPosition;\n\n\tconst unitButtonTextStyle = getStylesFromColorScheme(\n\t\tstyles.unitButtonText,\n\t\tstyles.unitButtonTextDark\n\t);\n\n\t/* translators: accessibility text. Inform about current unit value. %s: Current unit value. */\n\tconst accessibilityLabel = sprintf( __( 'Current unit is %s' ), unit );\n\n\tconst accessibilityHint =\n\t\tPlatform.OS === 'ios'\n\t\t\t? __( 'Double tap to open Action Sheet with available options' )\n\t\t\t: __( 'Double tap to open Bottom Sheet with available options' );\n\n\tconst renderUnitButton = useMemo( () => {\n\t\tconst unitButton = (\n\t\t\t<View style={ styles.unitButton }>\n\t\t\t\t<Text style={ unitButtonTextStyle }>{ unit }</Text>\n\t\t\t</View>\n\t\t);\n\n\t\tif ( hasUnits( units ) && units?.length > 1 ) {\n\t\t\treturn (\n\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\tonPress={ onPickerPresent }\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t>\n\t\t\t\t\t{ unitButton }\n\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t);\n\t\t}\n\n\t\treturn unitButton;\n\t}, [\n\t\tonPickerPresent,\n\t\taccessibilityLabel,\n\t\taccessibilityHint,\n\t\tunitButtonTextStyle,\n\t\tunit,\n\t\tunits,\n\t] );\n\n\tconst getAnchor = useCallback(\n\t\t() =>\n\t\t\tanchorNodeRef?.current\n\t\t\t\t? findNodeHandle( anchorNodeRef?.current )\n\t\t\t\t: undefined,\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t[ anchorNodeRef?.current ]\n\t);\n\n\tconst getDecimal = ( step ) => {\n\t\t// Return the decimal offset based on the step size.\n\t\t// if step size is 0.1 we expect the offset to be 1.\n\t\t// for example 12 + 0.1 we would expect the see 12.1 (not 12.10 or 12 );\n\t\t// steps are defined in the CSS_UNITS and they vary from unit to unit.\n\t\tconst stepToString = step;\n\t\tconst splitStep = stepToString.toString().split( '.' );\n\t\treturn splitStep[ 1 ] ? splitStep[ 1 ].length : 0;\n\t};\n\n\tconst renderUnitPicker = useCallback( () => {\n\t\t// Keeping for legacy reasons, although `false` should not be a valid\n\t\t// value for the `units` prop anymore.\n\t\tif ( units === false ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn (\n\t\t\t<View style={ styles.unitMenu } ref={ anchorNodeRef }>\n\t\t\t\t{ renderUnitButton }\n\t\t\t\t{ hasUnits( units ) && units?.length > 1 ? (\n\t\t\t\t\t<Picker\n\t\t\t\t\t\tref={ pickerRef }\n\t\t\t\t\t\toptions={ units }\n\t\t\t\t\t\tonChange={ onUnitChange }\n\t\t\t\t\t\thideCancelButton\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\tgetAnchor={ getAnchor }\n\t\t\t\t\t/>\n\t\t\t\t) : null }\n\t\t\t</View>\n\t\t);\n\t}, [ pickerRef, units, onUnitChange, getAnchor, renderUnitButton ] );\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\tconst decimalNum = getDecimal( step );\n\n\treturn (\n\t\t<>\n\t\t\t{ unit !== '%' ? (\n\t\t\t\t<StepperCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tmax={ max }\n\t\t\t\t\tmin={ min }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tshouldDisplayTextInput\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</StepperCell>\n\t\t\t) : (\n\t\t\t\t<RangeCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tminimumValue={ min }\n\t\t\t\t\tmaximumValue={ max }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tunit={ unit }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</RangeCell>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport { useCustomUnits } from './utils';\nexport default memo( withPreferredColorScheme( UnitControl ) );\n"],"mappings":"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"}