@wordpress/components 29.5.1 → 29.6.0

package/CHANGELOG.md

@@ -2,10 +2,16 @@
 
 ## Unreleased
 
+## 29.6.0 (2025-03-13)
+
 ### Enhancement
 
 -   `QueryControls`: Add menu_order sorting option if supported by the post type. ([#68781](https://github.com/WordPress/gutenberg/pull/68781)).
 
+### Bug Fixes
+
+-   `Button`: Remove fixed width from small and compact buttons with icons ([#69378](https://github.com/WordPress/gutenberg/pull/69378)).
+
 ## 29.5.0 (2025-02-28)
 
 ### Documentation
@@ -28,6 +34,7 @@
 
 ### Bug Fixes
 
+-   `FontSizePicker`: Remove non translatable additional info from font size picker visual label and improve labeling. ([#69011](https://github.com/WordPress/gutenberg/pull/69011)).
 -   `Notice`: Fix text contrast for dark mode ([#69226](https://github.com/WordPress/gutenberg/pull/69226)).
 
 ## 29.4.0 (2025-02-12)

package/build/font-size-picker/font-size-picker-select.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _i18n = require("@wordpress/i18n");
 var _customSelectControl = _interopRequireDefault(require("../custom-select-control"));
-var _unitControl = require("../unit-control");
 var _utils = require("./utils");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
@@ -32,15 +31,9 @@ const FontSizePickerSelect = props => {
     size,
     onChange
   } = props;
-  const areAllSizesSameUnit = !!(0, _utils.getCommonSizeUnit)(fontSizes);
   const options = [DEFAULT_OPTION, ...fontSizes.map(fontSize => {
     let hint;
-    if (areAllSizesSameUnit) {
-      const [quantity] = (0, _unitControl.parseQuantityAndUnitFromRawValue)(fontSize.size);
-      if (quantity !== undefined) {
-        hint = String(quantity);
-      }
-    } else if ((0, _utils.isSimpleCssValue)(fontSize.size)) {
+    if ((0, _utils.isSimpleCssValue)(fontSize.size)) {
       hint = String(fontSize.size);
     }
     return {

package/build/font-size-picker/font-size-picker-select.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_customSelectControl","_interopRequireDefault","_unitControl","_utils","_jsxRuntime","DEFAULT_OPTION","key","name","__","value","undefined","FontSizePickerSelect","props","_options$find","__next40pxDefaultSize","fontSizes","size","onChange","areAllSizesSameUnit","getCommonSizeUnit","options","map","fontSize","hint","quantity","parseQuantityAndUnitFromRawValue","String","isSimpleCssValue","slug","selectedOption","find","option","jsx","default","__shouldNotWarnDeprecated36pxSize","className","label","hideLabelFromVision","describedBy","sprintf","showSelectedHint","selectedItem","_default","exports"],"sources":["@wordpress/components/src/font-size-picker/font-size-picker-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport CustomSelectControl from '../custom-select-control';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\nimport type {\n\tFontSizePickerSelectProps,\n\tFontSizePickerSelectOption,\n} from './types';\nimport { getCommonSizeUnit, isSimpleCssValue } from './utils';\n\nconst DEFAULT_OPTION: FontSizePickerSelectOption = {\n\tkey: 'default',\n\tname: __( 'Default' ),\n\tvalue: undefined,\n};\n\nconst FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {\n\tconst { __next40pxDefaultSize, fontSizes, value, size, onChange } = props;\n\n\tconst areAllSizesSameUnit = !! getCommonSizeUnit( fontSizes );\n\n\tconst options: FontSizePickerSelectOption[] = [\n\t\tDEFAULT_OPTION,\n\t\t...fontSizes.map( ( fontSize ) => {\n\t\t\tlet hint;\n\t\t\tif ( areAllSizesSameUnit ) {\n\t\t\t\tconst [ quantity ] = parseQuantityAndUnitFromRawValue(\n\t\t\t\t\tfontSize.size\n\t\t\t\t);\n\t\t\t\tif ( quantity !== undefined ) {\n\t\t\t\t\thint = String( quantity );\n\t\t\t\t}\n\t\t\t} else if ( isSimpleCssValue( fontSize.size ) ) {\n\t\t\t\thint = String( fontSize.size );\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tkey: fontSize.slug,\n\t\t\t\tname: fontSize.name || fontSize.slug,\n\t\t\t\tvalue: fontSize.size,\n\t\t\t\thint,\n\t\t\t};\n\t\t} ),\n\t];\n\n\tconst selectedOption =\n\t\toptions.find( ( option ) => option.value === value ) ?? DEFAULT_OPTION;\n\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\tclassName=\"components-font-size-picker__select\"\n\t\t\tlabel={ __( 'Font size' ) }\n\t\t\thideLabelFromVision\n\t\t\tdescribedBy={ sprintf(\n\t\t\t\t// translators: %s: Currently selected font size.\n\t\t\t\t__( 'Currently selected font size: %s' ),\n\t\t\t\tselectedOption.name\n\t\t\t) }\n\t\t\toptions={ options }\n\t\t\tvalue={ selectedOption }\n\t\t\tshowSelectedHint\n\t\t\tonChange={ ( {\n\t\t\t\tselectedItem,\n\t\t\t}: {\n\t\t\t\tselectedItem: FontSizePickerSelectOption;\n\t\t\t} ) => {\n\t\t\t\tonChange( selectedItem.value );\n\t\t\t} }\n\t\t\tsize={ size }\n\t\t/>\n\t);\n};\n\nexport default FontSizePickerSelect;\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AAKA,IAAAC,oBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,YAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAJ,OAAA;AAA8D,IAAAK,WAAA,GAAAL,OAAA;AAd9D;AACA;AACA;;AAGA;AACA;AACA;;AASA,MAAMM,cAA0C,GAAG;EAClDC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAE,IAAAC,QAAE,EAAE,SAAU,CAAC;EACrBC,KAAK,EAAEC;AACR,CAAC;AAED,MAAMC,oBAAoB,GAAKC,KAAgC,IAAM;EAAA,IAAAC,aAAA;EACpE,MAAM;IAAEC,qBAAqB;IAAEC,SAAS;IAAEN,KAAK;IAAEO,IAAI;IAAEC;EAAS,CAAC,GAAGL,KAAK;EAEzE,MAAMM,mBAAmB,GAAG,CAAC,CAAE,IAAAC,wBAAiB,EAAEJ,SAAU,CAAC;EAE7D,MAAMK,OAAqC,GAAG,CAC7Cf,cAAc,EACd,GAAGU,SAAS,CAACM,GAAG,CAAIC,QAAQ,IAAM;IACjC,IAAIC,IAAI;IACR,IAAKL,mBAAmB,EAAG;MAC1B,MAAM,CAAEM,QAAQ,CAAE,GAAG,IAAAC,6CAAgC,EACpDH,QAAQ,CAACN,IACV,CAAC;MACD,IAAKQ,QAAQ,KAAKd,SAAS,EAAG;QAC7Ba,IAAI,GAAGG,MAAM,CAAEF,QAAS,CAAC;MAC1B;IACD,CAAC,MAAM,IAAK,IAAAG,uBAAgB,EAAEL,QAAQ,CAACN,IAAK,CAAC,EAAG;MAC/CO,IAAI,GAAGG,MAAM,CAAEJ,QAAQ,CAACN,IAAK,CAAC;IAC/B;IACA,OAAO;MACNV,GAAG,EAAEgB,QAAQ,CAACM,IAAI;MAClBrB,IAAI,EAAEe,QAAQ,CAACf,IAAI,IAAIe,QAAQ,CAACM,IAAI;MACpCnB,KAAK,EAAEa,QAAQ,CAACN,IAAI;MACpBO;IACD,CAAC;EACF,CAAE,CAAC,CACH;EAED,MAAMM,cAAc,IAAAhB,aAAA,GACnBO,OAAO,CAACU,IAAI,CAAIC,MAAM,IAAMA,MAAM,CAACtB,KAAK,KAAKA,KAAM,CAAC,cAAAI,aAAA,cAAAA,aAAA,GAAIR,cAAc;EAEvE,oBACC,IAAAD,WAAA,CAAA4B,GAAA,EAAChC,oBAAA,CAAAiC,OAAmB;IACnBnB,qBAAqB,EAAGA,qBAAuB;IAC/CoB,iCAAiC;IACjCC,SAAS,EAAC,qCAAqC;IAC/CC,KAAK,EAAG,IAAA5B,QAAE,EAAE,WAAY,CAAG;IAC3B6B,mBAAmB;IACnBC,WAAW,EAAG,IAAAC,aAAO;IACpB;IACA,IAAA/B,QAAE,EAAE,kCAAmC,CAAC,EACxCqB,cAAc,CAACtB,IAChB,CAAG;IACHa,OAAO,EAAGA,OAAS;IACnBX,KAAK,EAAGoB,cAAgB;IACxBW,gBAAgB;IAChBvB,QAAQ,EAAGA,CAAE;MACZwB;IAGD,CAAC,KAAM;MACNxB,QAAQ,CAAEwB,YAAY,CAAChC,KAAM,CAAC;IAC/B,CAAG;IACHO,IAAI,EAAGA;EAAM,CACb,CAAC;AAEJ,CAAC;AAAC,IAAA0B,QAAA,GAAAC,OAAA,CAAAV,OAAA,GAEatB,oBAAoB","ignoreList":[]}
+{"version":3,"names":["_i18n","require","_customSelectControl","_interopRequireDefault","_utils","_jsxRuntime","DEFAULT_OPTION","key","name","__","value","undefined","FontSizePickerSelect","props","_options$find","__next40pxDefaultSize","fontSizes","size","onChange","options","map","fontSize","hint","isSimpleCssValue","String","slug","selectedOption","find","option","jsx","default","__shouldNotWarnDeprecated36pxSize","className","label","hideLabelFromVision","describedBy","sprintf","showSelectedHint","selectedItem","_default","exports"],"sources":["@wordpress/components/src/font-size-picker/font-size-picker-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport CustomSelectControl from '../custom-select-control';\nimport type {\n\tFontSizePickerSelectProps,\n\tFontSizePickerSelectOption,\n} from './types';\nimport { isSimpleCssValue } from './utils';\n\nconst DEFAULT_OPTION: FontSizePickerSelectOption = {\n\tkey: 'default',\n\tname: __( 'Default' ),\n\tvalue: undefined,\n};\n\nconst FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {\n\tconst { __next40pxDefaultSize, fontSizes, value, size, onChange } = props;\n\n\tconst options: FontSizePickerSelectOption[] = [\n\t\tDEFAULT_OPTION,\n\t\t...fontSizes.map( ( fontSize ) => {\n\t\t\tlet hint;\n\t\t\tif ( isSimpleCssValue( fontSize.size ) ) {\n\t\t\t\thint = String( fontSize.size );\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tkey: fontSize.slug,\n\t\t\t\tname: fontSize.name || fontSize.slug,\n\t\t\t\tvalue: fontSize.size,\n\t\t\t\thint,\n\t\t\t};\n\t\t} ),\n\t];\n\n\tconst selectedOption =\n\t\toptions.find( ( option ) => option.value === value ) ?? DEFAULT_OPTION;\n\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\tclassName=\"components-font-size-picker__select\"\n\t\t\tlabel={ __( 'Font size' ) }\n\t\t\thideLabelFromVision\n\t\t\tdescribedBy={ sprintf(\n\t\t\t\t// translators: %s: Currently selected font size.\n\t\t\t\t__( 'Currently selected font size: %s' ),\n\t\t\t\tselectedOption.name\n\t\t\t) }\n\t\t\toptions={ options }\n\t\t\tvalue={ selectedOption }\n\t\t\tshowSelectedHint\n\t\t\tonChange={ ( {\n\t\t\t\tselectedItem,\n\t\t\t}: {\n\t\t\t\tselectedItem: FontSizePickerSelectOption;\n\t\t\t} ) => {\n\t\t\t\tonChange( selectedItem.value );\n\t\t\t} }\n\t\t\tsize={ size }\n\t\t/>\n\t);\n};\n\nexport default FontSizePickerSelect;\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AAKA,IAAAC,oBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAKA,IAAAG,MAAA,GAAAH,OAAA;AAA2C,IAAAI,WAAA,GAAAJ,OAAA;AAb3C;AACA;AACA;;AAGA;AACA;AACA;;AAQA,MAAMK,cAA0C,GAAG;EAClDC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAE,IAAAC,QAAE,EAAE,SAAU,CAAC;EACrBC,KAAK,EAAEC;AACR,CAAC;AAED,MAAMC,oBAAoB,GAAKC,KAAgC,IAAM;EAAA,IAAAC,aAAA;EACpE,MAAM;IAAEC,qBAAqB;IAAEC,SAAS;IAAEN,KAAK;IAAEO,IAAI;IAAEC;EAAS,CAAC,GAAGL,KAAK;EAEzE,MAAMM,OAAqC,GAAG,CAC7Cb,cAAc,EACd,GAAGU,SAAS,CAACI,GAAG,CAAIC,QAAQ,IAAM;IACjC,IAAIC,IAAI;IACR,IAAK,IAAAC,uBAAgB,EAAEF,QAAQ,CAACJ,IAAK,CAAC,EAAG;MACxCK,IAAI,GAAGE,MAAM,CAAEH,QAAQ,CAACJ,IAAK,CAAC;IAC/B;IACA,OAAO;MACNV,GAAG,EAAEc,QAAQ,CAACI,IAAI;MAClBjB,IAAI,EAAEa,QAAQ,CAACb,IAAI,IAAIa,QAAQ,CAACI,IAAI;MACpCf,KAAK,EAAEW,QAAQ,CAACJ,IAAI;MACpBK;IACD,CAAC;EACF,CAAE,CAAC,CACH;EAED,MAAMI,cAAc,IAAAZ,aAAA,GACnBK,OAAO,CAACQ,IAAI,CAAIC,MAAM,IAAMA,MAAM,CAAClB,KAAK,KAAKA,KAAM,CAAC,cAAAI,aAAA,cAAAA,aAAA,GAAIR,cAAc;EAEvE,oBACC,IAAAD,WAAA,CAAAwB,GAAA,EAAC3B,oBAAA,CAAA4B,OAAmB;IACnBf,qBAAqB,EAAGA,qBAAuB;IAC/CgB,iCAAiC;IACjCC,SAAS,EAAC,qCAAqC;IAC/CC,KAAK,EAAG,IAAAxB,QAAE,EAAE,WAAY,CAAG;IAC3ByB,mBAAmB;IACnBC,WAAW,EAAG,IAAAC,aAAO;IACpB;IACA,IAAA3B,QAAE,EAAE,kCAAmC,CAAC,EACxCiB,cAAc,CAAClB,IAChB,CAAG;IACHW,OAAO,EAAGA,OAAS;IACnBT,KAAK,EAAGgB,cAAgB;IACxBW,gBAAgB;IAChBnB,QAAQ,EAAGA,CAAE;MACZoB;IAGD,CAAC,KAAM;MACNpB,QAAQ,CAAEoB,YAAY,CAAC5B,KAAM,CAAC;IAC/B,CAAG;IACHO,IAAI,EAAGA;EAAM,CACb,CAAC;AAEJ,CAAC;AAAC,IAAAsB,QAAA,GAAAC,OAAA,CAAAV,OAAA,GAEalB,oBAAoB","ignoreList":[]}

package/build/font-size-picker/index.js

@@ -8,17 +8,15 @@ exports.default = exports.FontSizePicker = void 0;
 var _i18n = require("@wordpress/i18n");
 var _icons = require("@wordpress/icons");
 var _element = require("@wordpress/element");
+var _compose = require("@wordpress/compose");
 var _button = require("../button");
 var _rangeControl = _interopRequireDefault(require("../range-control"));
 var _flex = require("../flex");
 var _unitControl = _interopRequireWildcard(require("../unit-control"));
-var _visuallyHidden = require("../visually-hidden");
-var _utils = require("./utils");
 var _styles = require("./styles");
 var _spacer = require("../spacer");
 var _fontSizePickerSelect = _interopRequireDefault(require("./font-size-picker-select"));
 var _fontSizePickerToggleGroup = _interopRequireDefault(require("./font-size-picker-toggle-group"));
-var _constants = require("./constants");
 var _deprecated36pxSize = require("../utils/deprecated-36px-size");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -50,6 +48,7 @@ const UnforwardedFontSizePicker = (props, ref) => {
     withSlider = false,
     withReset = true
   } = props;
+  const labelId = (0, _compose.useInstanceId)(UnforwardedFontSizePicker, 'font-size-picker-label');
   const units = (0, _unitControl.useCustomUnits)({
     availableUnits: unitsProp
   });
@@ -66,24 +65,6 @@ const UnforwardedFontSizePicker = (props, ref) => {
   } else {
     currentPickerType = fontSizes.length > MAX_TOGGLE_GROUP_SIZES ? 'select' : 'togglegroup';
   }
-  const headerHint = (0, _element.useMemo)(() => {
-    switch (currentPickerType) {
-      case 'custom':
-        return (0, _i18n.__)('Custom');
-      case 'togglegroup':
-        if (selectedFontSize) {
-          return selectedFontSize.name || _constants.T_SHIRT_NAMES[fontSizes.indexOf(selectedFontSize)];
-        }
-        break;
-      case 'select':
-        const commonUnit = (0, _utils.getCommonSizeUnit)(fontSizes);
-        if (commonUnit) {
-          return `(${commonUnit})`;
-        }
-        break;
-    }
-    return '';
-  }, [currentPickerType, selectedFontSize, fontSizes]);
   if (fontSizes.length === 0 && disableCustomFontSizes) {
     return null;
   }
@@ -102,19 +83,16 @@ const UnforwardedFontSizePicker = (props, ref) => {
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     ref: ref,
-    className: "components-font-size-picker",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_visuallyHidden.VisuallyHidden, {
-      as: "legend",
-      children: (0, _i18n.__)('Font size')
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_spacer.Spacer, {
+    className: "components-font-size-picker"
+    // This Container component renders a fieldset element that needs to be labeled.
+    ,
+    "aria-labelledby": labelId,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_spacer.Spacer, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Header, {
         className: "components-font-size-picker__header",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.HeaderLabel, {
-          "aria-label": `${(0, _i18n.__)('Size')} ${headerHint || ''}`,
-          children: [(0, _i18n.__)('Size'), headerHint && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.HeaderHint, {
-            className: "components-font-size-picker__header__hint",
-            children: headerHint
-          })]
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.HeaderLabel, {
+          id: labelId,
+          children: (0, _i18n.__)('Font size')
         }), !disableCustomFontSizes && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.HeaderToggle, {
           label: currentPickerType === 'custom' ? (0, _i18n.__)('Use size preset') : (0, _i18n.__)('Set custom size'),
           icon: _icons.settings,
@@ -157,7 +135,7 @@ const UnforwardedFontSizePicker = (props, ref) => {
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_unitControl.default, {
             __next40pxDefaultSize: __next40pxDefaultSize,
             __shouldNotWarnDeprecated36pxSize: true,
-            label: (0, _i18n.__)('Custom'),
+            label: (0, _i18n.__)('Font size'),
             labelPosition: "top",
             hideLabelFromVision: true,
             value: value,
@@ -183,7 +161,7 @@ const UnforwardedFontSizePicker = (props, ref) => {
               __next40pxDefaultSize: __next40pxDefaultSize,
               __shouldNotWarnDeprecated36pxSize: true,
               className: "components-font-size-picker__custom-input",
-              label: (0, _i18n.__)('Custom Size'),
+              label: (0, _i18n.__)('Font size'),
               hideLabelFromVision: true,
               value: valueQuantity,
               initialPosition: fallbackFontSize,

package/build/font-size-picker/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_icons","_element","_button","_rangeControl","_interopRequireDefault","_flex","_unitControl","_interopRequireWildcard","_visuallyHidden","_utils","_styles","_spacer","_fontSizePickerSelect","_fontSizePickerToggleGroup","_constants","_deprecated36pxSize","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DEFAULT_UNITS","MAX_TOGGLE_GROUP_SIZES","UnforwardedFontSizePicker","props","ref","__next40pxDefaultSize","fallbackFontSize","fontSizes","disableCustomFontSizes","onChange","size","units","unitsProp","value","withSlider","withReset","useCustomUnits","availableUnits","selectedFontSize","find","fontSize","isCustomValue","userRequestedCustom","setUserRequestedCustom","useState","currentPickerType","length","headerHint","useMemo","__","name","T_SHIRT_NAMES","indexOf","commonUnit","getCommonSizeUnit","hasUnits","valueQuantity","valueUnit","parseQuantityAndUnitFromRawValue","isValueUnitRelative","includes","isDisabled","undefined","maybeWarnDeprecated36pxSize","componentName","jsxs","Container","className","children","jsx","VisuallyHidden","as","Spacer","Header","HeaderLabel","HeaderHint","HeaderToggle","label","icon","settings","onClick","isPressed","newValue","Number","onSelectCustom","Flex","FlexItem","isBlock","__shouldNotWarnDeprecated36pxSize","labelPosition","hideLabelFromVision","parseInt","min","marginX","marginBottom","__nextHasNoMarginBottom","initialPosition","withInputField","max","step","Button","disabled","accessibleWhenDisabled","variant","FontSizePicker","exports","forwardRef","_default"],"sources":["@wordpress/components/src/font-size-picker/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\nimport { useState, useMemo, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Button } from '../button';\nimport RangeControl from '../range-control';\nimport { Flex, FlexItem } from '../flex';\nimport {\n\tdefault as UnitControl,\n\tparseQuantityAndUnitFromRawValue,\n\tuseCustomUnits,\n} from '../unit-control';\nimport { VisuallyHidden } from '../visually-hidden';\nimport { getCommonSizeUnit } from './utils';\nimport type { FontSizePickerProps } from './types';\nimport {\n\tContainer,\n\tHeader,\n\tHeaderHint,\n\tHeaderLabel,\n\tHeaderToggle,\n} from './styles';\nimport { Spacer } from '../spacer';\nimport FontSizePickerSelect from './font-size-picker-select';\nimport FontSizePickerToggleGroup from './font-size-picker-toggle-group';\nimport { T_SHIRT_NAMES } from './constants';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\n\nconst DEFAULT_UNITS = [ 'px', 'em', 'rem', 'vw', 'vh' ];\n\nconst MAX_TOGGLE_GROUP_SIZES = 5;\n\nconst UnforwardedFontSizePicker = (\n\tprops: FontSizePickerProps,\n\tref: ForwardedRef< any >\n) => {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tfallbackFontSize,\n\t\tfontSizes = [],\n\t\tdisableCustomFontSizes = false,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tunits: unitsProp = DEFAULT_UNITS,\n\t\tvalue,\n\t\twithSlider = false,\n\t\twithReset = true,\n\t} = props;\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: unitsProp,\n\t} );\n\n\tconst selectedFontSize = fontSizes.find(\n\t\t( fontSize ) => fontSize.size === value\n\t);\n\tconst isCustomValue = !! value && ! selectedFontSize;\n\n\t// Initially request a custom picker if the value is not from the predef list.\n\tconst [ userRequestedCustom, setUserRequestedCustom ] =\n\t\tuseState( isCustomValue );\n\n\tlet currentPickerType;\n\tif ( ! disableCustomFontSizes && userRequestedCustom ) {\n\t\t// While showing the custom value picker, switch back to predef only if\n\t\t// `disableCustomFontSizes` is set to `true`.\n\t\tcurrentPickerType = 'custom' as const;\n\t} else {\n\t\tcurrentPickerType =\n\t\t\tfontSizes.length > MAX_TOGGLE_GROUP_SIZES\n\t\t\t\t? ( 'select' as const )\n\t\t\t\t: ( 'togglegroup' as const );\n\t}\n\n\tconst headerHint = useMemo( () => {\n\t\tswitch ( currentPickerType ) {\n\t\t\tcase 'custom':\n\t\t\t\treturn __( 'Custom' );\n\t\t\tcase 'togglegroup':\n\t\t\t\tif ( selectedFontSize ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\tselectedFontSize.name ||\n\t\t\t\t\t\tT_SHIRT_NAMES[ fontSizes.indexOf( selectedFontSize ) ]\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'select':\n\t\t\t\tconst commonUnit = getCommonSizeUnit( fontSizes );\n\t\t\t\tif ( commonUnit ) {\n\t\t\t\t\treturn `(${ commonUnit })`;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t}\n\n\t\treturn '';\n\t}, [ currentPickerType, selectedFontSize, fontSizes ] );\n\n\tif ( fontSizes.length === 0 && disableCustomFontSizes ) {\n\t\treturn null;\n\t}\n\n\t// If neither the value or first font size is a string, then FontSizePicker\n\t// operates in a legacy \"unitless\" mode where UnitControl can only be used\n\t// to select px values and onChange() is always called with number values.\n\tconst hasUnits =\n\t\ttypeof value === 'string' || typeof fontSizes[ 0 ]?.size === 'string';\n\n\tconst [ valueQuantity, valueUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tvalue,\n\t\tunits\n\t);\n\tconst isValueUnitRelative =\n\t\t!! valueUnit && [ 'em', 'rem', 'vw', 'vh' ].includes( valueUnit );\n\tconst isDisabled = value === undefined;\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'FontSizePicker',\n\t\t__next40pxDefaultSize,\n\t\tsize,\n\t} );\n\n\treturn (\n\t\t<Container ref={ ref } className=\"components-font-size-picker\">\n\t\t\t<VisuallyHidden as=\"legend\">{ __( 'Font size' ) }</VisuallyHidden>\n\t\t\t<Spacer>\n\t\t\t\t<Header className=\"components-font-size-picker__header\">\n\t\t\t\t\t<HeaderLabel\n\t\t\t\t\t\taria-label={ `${ __( 'Size' ) } ${ headerHint || '' }` }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Size' ) }\n\t\t\t\t\t\t{ headerHint && (\n\t\t\t\t\t\t\t<HeaderHint className=\"components-font-size-picker__header__hint\">\n\t\t\t\t\t\t\t\t{ headerHint }\n\t\t\t\t\t\t\t</HeaderHint>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</HeaderLabel>\n\t\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t\t<HeaderToggle\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tcurrentPickerType === 'custom'\n\t\t\t\t\t\t\t\t\t? __( 'Use size preset' )\n\t\t\t\t\t\t\t\t\t: __( 'Set custom size' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ settings }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetUserRequestedCustom( ! userRequestedCustom )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tisPressed={ currentPickerType === 'custom' }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</Header>\n\t\t\t</Spacer>\n\t\t\t<div>\n\t\t\t\t{ currentPickerType === 'select' && (\n\t\t\t\t\t<FontSizePickerSelect\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tdisableCustomFontSizes={ disableCustomFontSizes }\n\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\thasUnits ? newValue : Number( newValue ),\n\t\t\t\t\t\t\t\t\tfontSizes.find(\n\t\t\t\t\t\t\t\t\t\t( fontSize ) =>\n\t\t\t\t\t\t\t\t\t\t\tfontSize.size === newValue\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonSelectCustom={ () => setUserRequestedCustom( true ) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ currentPickerType === 'togglegroup' && (\n\t\t\t\t\t<FontSizePickerToggleGroup\n\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\thasUnits ? newValue : Number( newValue ),\n\t\t\t\t\t\t\t\t\tfontSizes.find(\n\t\t\t\t\t\t\t\t\t\t( fontSize ) =>\n\t\t\t\t\t\t\t\t\t\t\tfontSize.size === newValue\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ currentPickerType === 'custom' && (\n\t\t\t\t\t<Flex className=\"components-font-size-picker__custom-size-control\">\n\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\t\t\t\t\t\tlabel={ __( 'Custom' ) }\n\t\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\t\t\tsetUserRequestedCustom( true );\n\n\t\t\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\t\t\thasUnits\n\t\t\t\t\t\t\t\t\t\t\t\t? newValue\n\t\t\t\t\t\t\t\t\t\t\t\t: parseInt( newValue, 10 )\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\t\t\tunits={ hasUnits ? units : [] }\n\t\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t{ withSlider && (\n\t\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t\t<Spacer marginX={ 2 } marginBottom={ 0 }>\n\t\t\t\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize={\n\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\t\t\t\t\t\t\t\tclassName=\"components-font-size-picker__custom-input\"\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Custom Size' ) }\n\t\t\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\t\t\tvalue={ valueQuantity }\n\t\t\t\t\t\t\t\t\t\tinitialPosition={ fallbackFontSize }\n\t\t\t\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\t\t\t\t\tsetUserRequestedCustom( true );\n\n\t\t\t\t\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t\t\t\t\t} else if ( hasUnits ) {\n\t\t\t\t\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\t\t\t\t\tnewValue +\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t( valueUnit ?? 'px' )\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\tonChange?.( newValue );\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\t\t\t\tmax={ isValueUnitRelative ? 10 : 100 }\n\t\t\t\t\t\t\t\t\t\tstep={ isValueUnitRelative ? 0.1 : 1 }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ withReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tsize={\n\t\t\t\t\t\t\t\t\t\tsize === '__unstable-large' ||\n\t\t\t\t\t\t\t\t\t\tprops.__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\t? 'default'\n\t\t\t\t\t\t\t\t\t\t\t: 'small'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Flex>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</Container>\n\t);\n};\n\nexport const FontSizePicker = forwardRef( UnforwardedFontSizePicker );\n\nexport default FontSizePicker;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_i18n","require","_icons","_element","_compose","_button","_rangeControl","_interopRequireDefault","_flex","_unitControl","_interopRequireWildcard","_styles","_spacer","_fontSizePickerSelect","_fontSizePickerToggleGroup","_deprecated36pxSize","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DEFAULT_UNITS","MAX_TOGGLE_GROUP_SIZES","UnforwardedFontSizePicker","props","ref","__next40pxDefaultSize","fallbackFontSize","fontSizes","disableCustomFontSizes","onChange","size","units","unitsProp","value","withSlider","withReset","labelId","useInstanceId","useCustomUnits","availableUnits","selectedFontSize","find","fontSize","isCustomValue","userRequestedCustom","setUserRequestedCustom","useState","currentPickerType","length","hasUnits","valueQuantity","valueUnit","parseQuantityAndUnitFromRawValue","isValueUnitRelative","includes","isDisabled","undefined","maybeWarnDeprecated36pxSize","componentName","jsxs","Container","className","children","jsx","Spacer","Header","HeaderLabel","id","__","HeaderToggle","label","icon","settings","onClick","isPressed","newValue","Number","onSelectCustom","Flex","FlexItem","isBlock","__shouldNotWarnDeprecated36pxSize","labelPosition","hideLabelFromVision","parseInt","min","marginX","marginBottom","__nextHasNoMarginBottom","initialPosition","withInputField","max","step","Button","disabled","accessibleWhenDisabled","variant","FontSizePicker","exports","forwardRef","_default"],"sources":["@wordpress/components/src/font-size-picker/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\nimport { useState, forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { Button } from '../button';\nimport RangeControl from '../range-control';\nimport { Flex, FlexItem } from '../flex';\nimport {\n\tdefault as UnitControl,\n\tparseQuantityAndUnitFromRawValue,\n\tuseCustomUnits,\n} from '../unit-control';\nimport type { FontSizePickerProps } from './types';\nimport { Container, Header, HeaderLabel, HeaderToggle } from './styles';\nimport { Spacer } from '../spacer';\nimport FontSizePickerSelect from './font-size-picker-select';\nimport FontSizePickerToggleGroup from './font-size-picker-toggle-group';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\n\nconst DEFAULT_UNITS = [ 'px', 'em', 'rem', 'vw', 'vh' ];\n\nconst MAX_TOGGLE_GROUP_SIZES = 5;\n\nconst UnforwardedFontSizePicker = (\n\tprops: FontSizePickerProps,\n\tref: ForwardedRef< any >\n) => {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tfallbackFontSize,\n\t\tfontSizes = [],\n\t\tdisableCustomFontSizes = false,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tunits: unitsProp = DEFAULT_UNITS,\n\t\tvalue,\n\t\twithSlider = false,\n\t\twithReset = true,\n\t} = props;\n\n\tconst labelId = useInstanceId(\n\t\tUnforwardedFontSizePicker,\n\t\t'font-size-picker-label'\n\t);\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: unitsProp,\n\t} );\n\n\tconst selectedFontSize = fontSizes.find(\n\t\t( fontSize ) => fontSize.size === value\n\t);\n\tconst isCustomValue = !! value && ! selectedFontSize;\n\n\t// Initially request a custom picker if the value is not from the predef list.\n\tconst [ userRequestedCustom, setUserRequestedCustom ] =\n\t\tuseState( isCustomValue );\n\n\tlet currentPickerType;\n\tif ( ! disableCustomFontSizes && userRequestedCustom ) {\n\t\t// While showing the custom value picker, switch back to predef only if\n\t\t// `disableCustomFontSizes` is set to `true`.\n\t\tcurrentPickerType = 'custom' as const;\n\t} else {\n\t\tcurrentPickerType =\n\t\t\tfontSizes.length > MAX_TOGGLE_GROUP_SIZES\n\t\t\t\t? ( 'select' as const )\n\t\t\t\t: ( 'togglegroup' as const );\n\t}\n\n\tif ( fontSizes.length === 0 && disableCustomFontSizes ) {\n\t\treturn null;\n\t}\n\n\t// If neither the value or first font size is a string, then FontSizePicker\n\t// operates in a legacy \"unitless\" mode where UnitControl can only be used\n\t// to select px values and onChange() is always called with number values.\n\tconst hasUnits =\n\t\ttypeof value === 'string' || typeof fontSizes[ 0 ]?.size === 'string';\n\n\tconst [ valueQuantity, valueUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tvalue,\n\t\tunits\n\t);\n\tconst isValueUnitRelative =\n\t\t!! valueUnit && [ 'em', 'rem', 'vw', 'vh' ].includes( valueUnit );\n\tconst isDisabled = value === undefined;\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'FontSizePicker',\n\t\t__next40pxDefaultSize,\n\t\tsize,\n\t} );\n\n\treturn (\n\t\t<Container\n\t\t\tref={ ref }\n\t\t\tclassName=\"components-font-size-picker\"\n\t\t\t// This Container component renders a fieldset element that needs to be labeled.\n\t\t\taria-labelledby={ labelId }\n\t\t>\n\t\t\t<Spacer>\n\t\t\t\t<Header className=\"components-font-size-picker__header\">\n\t\t\t\t\t<HeaderLabel id={ labelId }>\n\t\t\t\t\t\t{ __( 'Font size' ) }\n\t\t\t\t\t</HeaderLabel>\n\t\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t\t<HeaderToggle\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tcurrentPickerType === 'custom'\n\t\t\t\t\t\t\t\t\t? __( 'Use size preset' )\n\t\t\t\t\t\t\t\t\t: __( 'Set custom size' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ settings }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetUserRequestedCustom( ! userRequestedCustom )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tisPressed={ currentPickerType === 'custom' }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</Header>\n\t\t\t</Spacer>\n\t\t\t<div>\n\t\t\t\t{ currentPickerType === 'select' && (\n\t\t\t\t\t<FontSizePickerSelect\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tdisableCustomFontSizes={ disableCustomFontSizes }\n\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\thasUnits ? newValue : Number( newValue ),\n\t\t\t\t\t\t\t\t\tfontSizes.find(\n\t\t\t\t\t\t\t\t\t\t( fontSize ) =>\n\t\t\t\t\t\t\t\t\t\t\tfontSize.size === newValue\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonSelectCustom={ () => setUserRequestedCustom( true ) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ currentPickerType === 'togglegroup' && (\n\t\t\t\t\t<FontSizePickerToggleGroup\n\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\thasUnits ? newValue : Number( newValue ),\n\t\t\t\t\t\t\t\t\tfontSizes.find(\n\t\t\t\t\t\t\t\t\t\t( fontSize ) =>\n\t\t\t\t\t\t\t\t\t\t\tfontSize.size === newValue\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ currentPickerType === 'custom' && (\n\t\t\t\t\t<Flex className=\"components-font-size-picker__custom-size-control\">\n\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\t\t\t\t\t\tlabel={ __( 'Font size' ) }\n\t\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\t\t\tsetUserRequestedCustom( true );\n\n\t\t\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\t\t\thasUnits\n\t\t\t\t\t\t\t\t\t\t\t\t? newValue\n\t\t\t\t\t\t\t\t\t\t\t\t: parseInt( newValue, 10 )\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\t\t\tunits={ hasUnits ? units : [] }\n\t\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t{ withSlider && (\n\t\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t\t<Spacer marginX={ 2 } marginBottom={ 0 }>\n\t\t\t\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize={\n\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\t\t\t\t\t\t\t\tclassName=\"components-font-size-picker__custom-input\"\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Font size' ) }\n\t\t\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\t\t\tvalue={ valueQuantity }\n\t\t\t\t\t\t\t\t\t\tinitialPosition={ fallbackFontSize }\n\t\t\t\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\t\t\t\t\tsetUserRequestedCustom( true );\n\n\t\t\t\t\t\t\t\t\t\t\tif ( newValue === undefined ) {\n\t\t\t\t\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t\t\t\t\t} else if ( hasUnits ) {\n\t\t\t\t\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\t\t\t\t\tnewValue +\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t( valueUnit ?? 'px' )\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\tonChange?.( newValue );\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\t\t\t\tmax={ isValueUnitRelative ? 10 : 100 }\n\t\t\t\t\t\t\t\t\t\tstep={ isValueUnitRelative ? 0.1 : 1 }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ withReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tonChange?.( undefined );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tsize={\n\t\t\t\t\t\t\t\t\t\tsize === '__unstable-large' ||\n\t\t\t\t\t\t\t\t\t\tprops.__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\t? 'default'\n\t\t\t\t\t\t\t\t\t\t\t: 'small'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Flex>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</Container>\n\t);\n};\n\nexport const FontSizePicker = forwardRef( UnforwardedFontSizePicker );\n\nexport default FontSizePicker;\n"],"mappings":"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","ignoreList":[]}

package/build/font-size-picker/styles.js

@@ -4,22 +4,21 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.HeaderToggle = exports.HeaderLabel = exports.HeaderHint = exports.Header = exports.Container = void 0;
+exports.HeaderToggle = exports.HeaderLabel = exports.Header = exports.Container = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _baseControl = _interopRequireDefault(require("../base-control"));
 var _button = _interopRequireDefault(require("../button"));
 var _hStack = require("../h-stack");
 var _space = require("../utils/space");
-var _utils = require("../utils");
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /**
  * External dependencies
  */ /**
  * Internal dependencies
  */
 const Container = exports.Container = /*#__PURE__*/(0, _base.default)("fieldset", process.env.NODE_ENV === "production" ? {
-  target: "e8tqeku4"
+  target: "e8tqeku3"
 } : {
-  target: "e8tqeku4",
+  target: "e8tqeku3",
   label: "Container"
 })(process.env.NODE_ENV === "production" ? {
   name: "k2q51s",
@@ -27,31 +26,25 @@ const Container = exports.Container = /*#__PURE__*/(0, _base.default)("fieldset"
 } : {
   name: "k2q51s",
   styles: "border:0;margin:0;padding:0;display:contents",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY3dDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBCYXNlQ29udHJvbCBmcm9tICcuLi9iYXNlLWNvbnRyb2wnO1xuaW1wb3J0IEJ1dHRvbiBmcm9tICcuLi9idXR0b24nO1xuaW1wb3J0IHsgSFN0YWNrIH0gZnJvbSAnLi4vaC1zdGFjayc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3V0aWxzL3NwYWNlJztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5maWVsZHNldGBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cdHBhZGRpbmc6IDA7XG5cdGRpc3BsYXk6IGNvbnRlbnRzO1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlciA9IHN0eWxlZCggSFN0YWNrIClgXG5cdGhlaWdodDogJHsgc3BhY2UoIDQgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlclRvZ2dsZSA9IHN0eWxlZCggQnV0dG9uIClgXG5cdG1hcmdpbi10b3A6ICR7IHNwYWNlKCAtMSApIH07XG5gO1xuXG5leHBvcnQgY29uc3QgSGVhZGVyTGFiZWwgPSBzdHlsZWQoIEJhc2VDb250cm9sLlZpc3VhbExhYmVsIClgXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGdhcDogJHsgc3BhY2UoIDEgKSB9O1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG5cdG1hcmdpbi1ib3R0b206IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgSGVhZGVySGludCA9IHN0eWxlZC5zcGFuYFxuXHRjb2xvcjogJHsgQ09MT1JTLmdyYXlbIDcwMCBdIH07XG5gO1xuIl19 */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBYXdDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBCYXNlQ29udHJvbCBmcm9tICcuLi9iYXNlLWNvbnRyb2wnO1xuaW1wb3J0IEJ1dHRvbiBmcm9tICcuLi9idXR0b24nO1xuaW1wb3J0IHsgSFN0YWNrIH0gZnJvbSAnLi4vaC1zdGFjayc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3V0aWxzL3NwYWNlJztcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5maWVsZHNldGBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cdHBhZGRpbmc6IDA7XG5cdGRpc3BsYXk6IGNvbnRlbnRzO1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlciA9IHN0eWxlZCggSFN0YWNrIClgXG5cdGhlaWdodDogJHsgc3BhY2UoIDQgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlclRvZ2dsZSA9IHN0eWxlZCggQnV0dG9uIClgXG5cdG1hcmdpbi10b3A6ICR7IHNwYWNlKCAtMSApIH07XG5gO1xuXG5leHBvcnQgY29uc3QgSGVhZGVyTGFiZWwgPSBzdHlsZWQoIEJhc2VDb250cm9sLlZpc3VhbExhYmVsIClgXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGdhcDogJHsgc3BhY2UoIDEgKSB9O1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG5cdG1hcmdpbi1ib3R0b206IDA7XG5gO1xuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 const Header = exports.Header = /*#__PURE__*/(0, _base.default)(_hStack.HStack, process.env.NODE_ENV === "production" ? {
-  target: "e8tqeku3"
-} : {
-  target: "e8tqeku3",
-  label: "Header"
-})("height:", (0, _space.space)(4), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUJzQyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2ZvbnQtc2l6ZS1waWNrZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgQmFzZUNvbnRyb2wgZnJvbSAnLi4vYmFzZS1jb250cm9sJztcbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vYnV0dG9uJztcbmltcG9ydCB7IEhTdGFjayB9IGZyb20gJy4uL2gtc3RhY2snO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZmllbGRzZXRgXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXHRwYWRkaW5nOiAwO1xuXHRkaXNwbGF5OiBjb250ZW50cztcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQoIEhTdGFjayApYFxuXHRoZWlnaHQ6ICR7IHNwYWNlKCA0ICkgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJUb2dnbGUgPSBzdHlsZWQoIEJ1dHRvbiApYFxuXHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTEgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckxhYmVsID0gc3R5bGVkKCBCYXNlQ29udHJvbC5WaXN1YWxMYWJlbCApYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRnYXA6ICR7IHNwYWNlKCAxICkgfTtcblx0anVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuXHRtYXJnaW4tYm90dG9tOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckhpbnQgPSBzdHlsZWQuc3BhbmBcblx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA3MDAgXSB9O1xuYDtcbiJdfQ== */"));
-const HeaderToggle = exports.HeaderToggle = /*#__PURE__*/(0, _base.default)(_button.default, process.env.NODE_ENV === "production" ? {
   target: "e8tqeku2"
 } : {
   target: "e8tqeku2",
-  label: "HeaderToggle"
-})("margin-top:", (0, _space.space)(-1), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUI0QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2ZvbnQtc2l6ZS1waWNrZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgQmFzZUNvbnRyb2wgZnJvbSAnLi4vYmFzZS1jb250cm9sJztcbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vYnV0dG9uJztcbmltcG9ydCB7IEhTdGFjayB9IGZyb20gJy4uL2gtc3RhY2snO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZmllbGRzZXRgXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXHRwYWRkaW5nOiAwO1xuXHRkaXNwbGF5OiBjb250ZW50cztcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQoIEhTdGFjayApYFxuXHRoZWlnaHQ6ICR7IHNwYWNlKCA0ICkgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJUb2dnbGUgPSBzdHlsZWQoIEJ1dHRvbiApYFxuXHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTEgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckxhYmVsID0gc3R5bGVkKCBCYXNlQ29udHJvbC5WaXN1YWxMYWJlbCApYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRnYXA6ICR7IHNwYWNlKCAxICkgfTtcblx0anVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuXHRtYXJnaW4tYm90dG9tOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckhpbnQgPSBzdHlsZWQuc3BhbmBcblx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA3MDAgXSB9O1xuYDtcbiJdfQ== */"));
-const HeaderLabel = exports.HeaderLabel = /*#__PURE__*/(0, _base.default)(_baseControl.default.VisualLabel, process.env.NODE_ENV === "production" ? {
+  label: "Header"
+})("height:", (0, _space.space)(4), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0JzQyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2ZvbnQtc2l6ZS1waWNrZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgQmFzZUNvbnRyb2wgZnJvbSAnLi4vYmFzZS1jb250cm9sJztcbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vYnV0dG9uJztcbmltcG9ydCB7IEhTdGFjayB9IGZyb20gJy4uL2gtc3RhY2snO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZmllbGRzZXRgXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXHRwYWRkaW5nOiAwO1xuXHRkaXNwbGF5OiBjb250ZW50cztcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQoIEhTdGFjayApYFxuXHRoZWlnaHQ6ICR7IHNwYWNlKCA0ICkgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJUb2dnbGUgPSBzdHlsZWQoIEJ1dHRvbiApYFxuXHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTEgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckxhYmVsID0gc3R5bGVkKCBCYXNlQ29udHJvbC5WaXN1YWxMYWJlbCApYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRnYXA6ICR7IHNwYWNlKCAxICkgfTtcblx0anVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuXHRtYXJnaW4tYm90dG9tOiAwO1xuYDtcbiJdfQ== */"));
+const HeaderToggle = exports.HeaderToggle = /*#__PURE__*/(0, _base.default)(_button.default, process.env.NODE_ENV === "production" ? {
   target: "e8tqeku1"
 } : {
   target: "e8tqeku1",
-  label: "HeaderLabel"
-})("display:flex;gap:", (0, _space.space)(1), ";justify-content:flex-start;margin-bottom:0;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkI0RCIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2ZvbnQtc2l6ZS1waWNrZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgQmFzZUNvbnRyb2wgZnJvbSAnLi4vYmFzZS1jb250cm9sJztcbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vYnV0dG9uJztcbmltcG9ydCB7IEhTdGFjayB9IGZyb20gJy4uL2gtc3RhY2snO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZmllbGRzZXRgXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXHRwYWRkaW5nOiAwO1xuXHRkaXNwbGF5OiBjb250ZW50cztcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQoIEhTdGFjayApYFxuXHRoZWlnaHQ6ICR7IHNwYWNlKCA0ICkgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJUb2dnbGUgPSBzdHlsZWQoIEJ1dHRvbiApYFxuXHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTEgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckxhYmVsID0gc3R5bGVkKCBCYXNlQ29udHJvbC5WaXN1YWxMYWJlbCApYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRnYXA6ICR7IHNwYWNlKCAxICkgfTtcblx0anVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuXHRtYXJnaW4tYm90dG9tOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckhpbnQgPSBzdHlsZWQuc3BhbmBcblx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA3MDAgXSB9O1xuYDtcbiJdfQ== */"));
-const HeaderHint = exports.HeaderHint = /*#__PURE__*/(0, _base.default)("span", process.env.NODE_ENV === "production" ? {
+  label: "HeaderToggle"
+})("margin-top:", (0, _space.space)(-1), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0I0QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2ZvbnQtc2l6ZS1waWNrZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgQmFzZUNvbnRyb2wgZnJvbSAnLi4vYmFzZS1jb250cm9sJztcbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vYnV0dG9uJztcbmltcG9ydCB7IEhTdGFjayB9IGZyb20gJy4uL2gtc3RhY2snO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZmllbGRzZXRgXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXHRwYWRkaW5nOiAwO1xuXHRkaXNwbGF5OiBjb250ZW50cztcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQoIEhTdGFjayApYFxuXHRoZWlnaHQ6ICR7IHNwYWNlKCA0ICkgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJUb2dnbGUgPSBzdHlsZWQoIEJ1dHRvbiApYFxuXHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTEgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckxhYmVsID0gc3R5bGVkKCBCYXNlQ29udHJvbC5WaXN1YWxMYWJlbCApYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRnYXA6ICR7IHNwYWNlKCAxICkgfTtcblx0anVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuXHRtYXJnaW4tYm90dG9tOiAwO1xuYDtcbiJdfQ== */"));
+const HeaderLabel = exports.HeaderLabel = /*#__PURE__*/(0, _base.default)(_baseControl.default.VisualLabel, process.env.NODE_ENV === "production" ? {
   target: "e8tqeku0"
 } : {
   target: "e8tqeku0",
-  label: "HeaderHint"
-})("color:", _utils.COLORS.gray[700], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0NxQyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2ZvbnQtc2l6ZS1waWNrZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgQmFzZUNvbnRyb2wgZnJvbSAnLi4vYmFzZS1jb250cm9sJztcbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vYnV0dG9uJztcbmltcG9ydCB7IEhTdGFjayB9IGZyb20gJy4uL2gtc3RhY2snO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZmllbGRzZXRgXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXHRwYWRkaW5nOiAwO1xuXHRkaXNwbGF5OiBjb250ZW50cztcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQoIEhTdGFjayApYFxuXHRoZWlnaHQ6ICR7IHNwYWNlKCA0ICkgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJUb2dnbGUgPSBzdHlsZWQoIEJ1dHRvbiApYFxuXHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTEgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckxhYmVsID0gc3R5bGVkKCBCYXNlQ29udHJvbC5WaXN1YWxMYWJlbCApYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRnYXA6ICR7IHNwYWNlKCAxICkgfTtcblx0anVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuXHRtYXJnaW4tYm90dG9tOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckhpbnQgPSBzdHlsZWQuc3BhbmBcblx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA3MDAgXSB9O1xuYDtcbiJdfQ== */"));
+  label: "HeaderLabel"
+})("display:flex;gap:", (0, _space.space)(1), ";justify-content:flex-start;margin-bottom:0;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZm9udC1zaXplLXBpY2tlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEI0RCIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2ZvbnQtc2l6ZS1waWNrZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgQmFzZUNvbnRyb2wgZnJvbSAnLi4vYmFzZS1jb250cm9sJztcbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vYnV0dG9uJztcbmltcG9ydCB7IEhTdGFjayB9IGZyb20gJy4uL2gtc3RhY2snO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZmllbGRzZXRgXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXHRwYWRkaW5nOiAwO1xuXHRkaXNwbGF5OiBjb250ZW50cztcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQoIEhTdGFjayApYFxuXHRoZWlnaHQ6ICR7IHNwYWNlKCA0ICkgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJUb2dnbGUgPSBzdHlsZWQoIEJ1dHRvbiApYFxuXHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTEgKSB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEhlYWRlckxhYmVsID0gc3R5bGVkKCBCYXNlQ29udHJvbC5WaXN1YWxMYWJlbCApYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRnYXA6ICR7IHNwYWNlKCAxICkgfTtcblx0anVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuXHRtYXJnaW4tYm90dG9tOiAwO1xuYDtcbiJdfQ== */"));
 //# sourceMappingURL=styles.js.map

package/build/font-size-picker/styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_baseControl","_interopRequireDefault","require","_button","_hStack","_space","_utils","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","exports","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","Header","HStack","space","HeaderToggle","Button","HeaderLabel","BaseControl","VisualLabel","HeaderHint","COLORS","gray"],"sources":["@wordpress/components/src/font-size-picker/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { HStack } from '../h-stack';\nimport { space } from '../utils/space';\nimport { COLORS } from '../utils';\n\nexport const Container = styled.fieldset`\n\tborder: 0;\n\tmargin: 0;\n\tpadding: 0;\n\tdisplay: contents;\n`;\n\nexport const Header = styled( HStack )`\n\theight: ${ space( 4 ) };\n`;\n\nexport const HeaderToggle = styled( Button )`\n\tmargin-top: ${ space( -1 ) };\n`;\n\nexport const HeaderLabel = styled( BaseControl.VisualLabel )`\n\tdisplay: flex;\n\tgap: ${ space( 1 ) };\n\tjustify-content: flex-start;\n\tmargin-bottom: 0;\n`;\n\nexport const HeaderHint = styled.span`\n\tcolor: ${ COLORS.gray[ 700 ] };\n`;\n"],"mappings":";;;;;;;;AAQA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAAkC,SAAAK,iCAAA,gPAZlC;AACA;AACA,GAFA,CAKA;AACA;AACA;AAOO,MAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,oBAAAE,KAAA,CAAAC,OAAA,cAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAb;AAAA,EAKrB;AAEM,MAAMc,MAAM,GAAAZ,OAAA,CAAAY,MAAA,gBAAG,IAAAX,KAAA,CAAAC,OAAA,EAAQW,cAAM,EAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,YAC1B,IAAAO,YAAK,EAAE,CAAE,CAAC,SAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CACrB;AAEM,MAAMU,YAAY,GAAAf,OAAA,CAAAe,YAAA,gBAAG,IAAAd,KAAA,CAAAC,OAAA,EAAQc,eAAM,EAAAb,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,gBAC5B,IAAAO,YAAK,EAAE,CAAC,CAAE,CAAC,SAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CAC1B;AAEM,MAAMY,WAAW,GAAAjB,OAAA,CAAAiB,WAAA,gBAAG,IAAAhB,KAAA,CAAAC,OAAA,EAAQgB,oBAAW,CAACC,WAAW,EAAAhB,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,sBAEnD,IAAAO,YAAK,EAAE,CAAE,CAAC,oDAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CAGlB;AAEM,MAAMe,UAAU,GAAApB,OAAA,CAAAoB,UAAA,oBAAAnB,KAAA,CAAAC,OAAA,UAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,aACZc,aAAM,CAACC,IAAI,CAAE,GAAG,CAAE,SAAAnB,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CAC5B","ignoreList":[]}
+{"version":3,"names":["_baseControl","_interopRequireDefault","require","_button","_hStack","_space","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","exports","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","Header","HStack","space","HeaderToggle","Button","HeaderLabel","BaseControl","VisualLabel"],"sources":["@wordpress/components/src/font-size-picker/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { HStack } from '../h-stack';\nimport { space } from '../utils/space';\n\nexport const Container = styled.fieldset`\n\tborder: 0;\n\tmargin: 0;\n\tpadding: 0;\n\tdisplay: contents;\n`;\n\nexport const Header = styled( HStack )`\n\theight: ${ space( 4 ) };\n`;\n\nexport const HeaderToggle = styled( Button )`\n\tmargin-top: ${ space( -1 ) };\n`;\n\nexport const HeaderLabel = styled( BaseControl.VisualLabel )`\n\tdisplay: flex;\n\tgap: ${ space( 1 ) };\n\tjustify-content: flex-start;\n\tmargin-bottom: 0;\n`;\n"],"mappings":";;;;;;;;AAQA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAAuC,SAAAI,iCAAA,gPAXvC;AACA;AACA,GAFA,CAKA;AACA;AACA;AAMO,MAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,oBAAAE,KAAA,CAAAC,OAAA,cAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAb;AAAA,EAKrB;AAEM,MAAMc,MAAM,GAAAZ,OAAA,CAAAY,MAAA,gBAAG,IAAAX,KAAA,CAAAC,OAAA,EAAQW,cAAM,EAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,YAC1B,IAAAO,YAAK,EAAE,CAAE,CAAC,SAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,wxCACrB;AAEM,MAAMU,YAAY,GAAAf,OAAA,CAAAe,YAAA,gBAAG,IAAAd,KAAA,CAAAC,OAAA,EAAQc,eAAM,EAAAb,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,gBAC5B,IAAAO,YAAK,EAAE,CAAC,CAAE,CAAC,SAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,wxCAC1B;AAEM,MAAMY,WAAW,GAAAjB,OAAA,CAAAiB,WAAA,gBAAG,IAAAhB,KAAA,CAAAC,OAAA,EAAQgB,oBAAW,CAACC,WAAW,EAAAhB,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,sBAEnD,IAAAO,YAAK,EAAE,CAAE,CAAC,oDAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,wxCAGlB","ignoreList":[]}

package/build/font-size-picker/utils.js

@@ -3,9 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getCommonSizeUnit = getCommonSizeUnit;
 exports.isSimpleCssValue = isSimpleCssValue;
-var _unitControl = require("../unit-control");
 /**
  * Internal dependencies
  */
@@ -21,24 +19,4 @@ function isSimpleCssValue(value) {
   const sizeRegex = /^[\d\.]+(px|em|rem|vw|vh|%|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)?$/i;
   return sizeRegex.test(String(value));
 }
-
-/**
- * If all of the given font sizes have the same unit (e.g. 'px'), return that
- * unit. Otherwise return null.
- *
- * @param fontSizes List of font sizes.
- * @return The common unit, or null.
- */
-function getCommonSizeUnit(fontSizes) {
-  const [firstFontSize, ...otherFontSizes] = fontSizes;
-  if (!firstFontSize) {
-    return null;
-  }
-  const [, firstUnit] = (0, _unitControl.parseQuantityAndUnitFromRawValue)(firstFontSize.size);
-  const areAllSizesSameUnit = otherFontSizes.every(fontSize => {
-    const [, unit] = (0, _unitControl.parseQuantityAndUnitFromRawValue)(fontSize.size);
-    return unit === firstUnit;
-  });
-  return areAllSizesSameUnit ? firstUnit : null;
-}
 //# sourceMappingURL=utils.js.map

package/build/font-size-picker/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["_unitControl","require","isSimpleCssValue","value","sizeRegex","test","String","getCommonSizeUnit","fontSizes","firstFontSize","otherFontSizes","firstUnit","parseQuantityAndUnitFromRawValue","size","areAllSizesSameUnit","every","fontSize","unit"],"sources":["@wordpress/components/src/font-size-picker/utils.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { FontSizePickerProps, FontSize } from './types';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\n\n/**\n * Some themes use css vars for their font sizes, so until we\n * have the way of calculating them don't display them.\n *\n * @param value The value that is checked.\n * @return Whether the value is a simple css value.\n */\nexport function isSimpleCssValue(\n\tvalue: NonNullable< FontSizePickerProps[ 'value' ] >\n) {\n\tconst sizeRegex =\n\t\t/^[\\d\\.]+(px|em|rem|vw|vh|%|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)?$/i;\n\treturn sizeRegex.test( String( value ) );\n}\n\n/**\n * If all of the given font sizes have the same unit (e.g. 'px'), return that\n * unit. Otherwise return null.\n *\n * @param fontSizes List of font sizes.\n * @return The common unit, or null.\n */\nexport function getCommonSizeUnit( fontSizes: FontSize[] ) {\n\tconst [ firstFontSize, ...otherFontSizes ] = fontSizes;\n\tif ( ! firstFontSize ) {\n\t\treturn null;\n\t}\n\tconst [ , firstUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tfirstFontSize.size\n\t);\n\tconst areAllSizesSameUnit = otherFontSizes.every( ( fontSize ) => {\n\t\tconst [ , unit ] = parseQuantityAndUnitFromRawValue( fontSize.size );\n\t\treturn unit === firstUnit;\n\t} );\n\treturn areAllSizesSameUnit ? firstUnit : null;\n}\n"],"mappings":";;;;;;;AAIA,IAAAA,YAAA,GAAAC,OAAA;AAJA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,gBAAgBA,CAC/BC,KAAoD,EACnD;EACD,MAAMC,SAAS,GACd,oIAAoI;EACrI,OAAOA,SAAS,CAACC,IAAI,CAAEC,MAAM,CAAEH,KAAM,CAAE,CAAC;AACzC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASI,iBAAiBA,CAAEC,SAAqB,EAAG;EAC1D,MAAM,CAAEC,aAAa,EAAE,GAAGC,cAAc,CAAE,GAAGF,SAAS;EACtD,IAAK,CAAEC,aAAa,EAAG;IACtB,OAAO,IAAI;EACZ;EACA,MAAM,GAAIE,SAAS,CAAE,GAAG,IAAAC,6CAAgC,EACvDH,aAAa,CAACI,IACf,CAAC;EACD,MAAMC,mBAAmB,GAAGJ,cAAc,CAACK,KAAK,CAAIC,QAAQ,IAAM;IACjE,MAAM,GAAIC,IAAI,CAAE,GAAG,IAAAL,6CAAgC,EAAEI,QAAQ,CAACH,IAAK,CAAC;IACpE,OAAOI,IAAI,KAAKN,SAAS;EAC1B,CAAE,CAAC;EACH,OAAOG,mBAAmB,GAAGH,SAAS,GAAG,IAAI;AAC9C","ignoreList":[]}
+{"version":3,"names":["isSimpleCssValue","value","sizeRegex","test","String"],"sources":["@wordpress/components/src/font-size-picker/utils.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { FontSizePickerProps } from './types';\n\n/**\n * Some themes use css vars for their font sizes, so until we\n * have the way of calculating them don't display them.\n *\n * @param value The value that is checked.\n * @return Whether the value is a simple css value.\n */\nexport function isSimpleCssValue(\n\tvalue: NonNullable< FontSizePickerProps[ 'value' ] >\n) {\n\tconst sizeRegex =\n\t\t/^[\\d\\.]+(px|em|rem|vw|vh|%|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)?$/i;\n\treturn sizeRegex.test( String( value ) );\n}\n"],"mappings":";;;;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,gBAAgBA,CAC/BC,KAAoD,EACnD;EACD,MAAMC,SAAS,GACd,oIAAoI;EACrI,OAAOA,SAAS,CAACC,IAAI,CAAEC,MAAM,CAAEH,KAAM,CAAE,CAAC;AACzC","ignoreList":[]}

package/build-module/font-size-picker/font-size-picker-select.js

@@ -7,8 +7,7 @@ import { __, sprintf } from '@wordpress/i18n';
  * Internal dependencies
  */
 import CustomSelectControl from '../custom-select-control';
-import { parseQuantityAndUnitFromRawValue } from '../unit-control';
-import { getCommonSizeUnit, isSimpleCssValue } from './utils';
+import { isSimpleCssValue } from './utils';
 import { jsx as _jsx } from "react/jsx-runtime";
 const DEFAULT_OPTION = {
   key: 'default',
@@ -24,15 +23,9 @@ const FontSizePickerSelect = props => {
     size,
     onChange
   } = props;
-  const areAllSizesSameUnit = !!getCommonSizeUnit(fontSizes);
   const options = [DEFAULT_OPTION, ...fontSizes.map(fontSize => {
     let hint;
-    if (areAllSizesSameUnit) {
-      const [quantity] = parseQuantityAndUnitFromRawValue(fontSize.size);
-      if (quantity !== undefined) {
-        hint = String(quantity);
-      }
-    } else if (isSimpleCssValue(fontSize.size)) {
+    if (isSimpleCssValue(fontSize.size)) {
       hint = String(fontSize.size);
     }
     return {

package/build-module/font-size-picker/font-size-picker-select.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","sprintf","CustomSelectControl","parseQuantityAndUnitFromRawValue","getCommonSizeUnit","isSimpleCssValue","jsx","_jsx","DEFAULT_OPTION","key","name","value","undefined","FontSizePickerSelect","props","_options$find","__next40pxDefaultSize","fontSizes","size","onChange","areAllSizesSameUnit","options","map","fontSize","hint","quantity","String","slug","selectedOption","find","option","__shouldNotWarnDeprecated36pxSize","className","label","hideLabelFromVision","describedBy","showSelectedHint","selectedItem"],"sources":["@wordpress/components/src/font-size-picker/font-size-picker-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport CustomSelectControl from '../custom-select-control';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\nimport type {\n\tFontSizePickerSelectProps,\n\tFontSizePickerSelectOption,\n} from './types';\nimport { getCommonSizeUnit, isSimpleCssValue } from './utils';\n\nconst DEFAULT_OPTION: FontSizePickerSelectOption = {\n\tkey: 'default',\n\tname: __( 'Default' ),\n\tvalue: undefined,\n};\n\nconst FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {\n\tconst { __next40pxDefaultSize, fontSizes, value, size, onChange } = props;\n\n\tconst areAllSizesSameUnit = !! getCommonSizeUnit( fontSizes );\n\n\tconst options: FontSizePickerSelectOption[] = [\n\t\tDEFAULT_OPTION,\n\t\t...fontSizes.map( ( fontSize ) => {\n\t\t\tlet hint;\n\t\t\tif ( areAllSizesSameUnit ) {\n\t\t\t\tconst [ quantity ] = parseQuantityAndUnitFromRawValue(\n\t\t\t\t\tfontSize.size\n\t\t\t\t);\n\t\t\t\tif ( quantity !== undefined ) {\n\t\t\t\t\thint = String( quantity );\n\t\t\t\t}\n\t\t\t} else if ( isSimpleCssValue( fontSize.size ) ) {\n\t\t\t\thint = String( fontSize.size );\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tkey: fontSize.slug,\n\t\t\t\tname: fontSize.name || fontSize.slug,\n\t\t\t\tvalue: fontSize.size,\n\t\t\t\thint,\n\t\t\t};\n\t\t} ),\n\t];\n\n\tconst selectedOption =\n\t\toptions.find( ( option ) => option.value === value ) ?? DEFAULT_OPTION;\n\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\tclassName=\"components-font-size-picker__select\"\n\t\t\tlabel={ __( 'Font size' ) }\n\t\t\thideLabelFromVision\n\t\t\tdescribedBy={ sprintf(\n\t\t\t\t// translators: %s: Currently selected font size.\n\t\t\t\t__( 'Currently selected font size: %s' ),\n\t\t\t\tselectedOption.name\n\t\t\t) }\n\t\t\toptions={ options }\n\t\t\tvalue={ selectedOption }\n\t\t\tshowSelectedHint\n\t\t\tonChange={ ( {\n\t\t\t\tselectedItem,\n\t\t\t}: {\n\t\t\t\tselectedItem: FontSizePickerSelectOption;\n\t\t\t} ) => {\n\t\t\t\tonChange( selectedItem.value );\n\t\t\t} }\n\t\t\tsize={ size }\n\t\t/>\n\t);\n};\n\nexport default FontSizePickerSelect;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;;AAE7C;AACA;AACA;AACA,OAAOC,mBAAmB,MAAM,0BAA0B;AAC1D,SAASC,gCAAgC,QAAQ,iBAAiB;AAKlE,SAASC,iBAAiB,EAAEC,gBAAgB,QAAQ,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE9D,MAAMC,cAA0C,GAAG;EAClDC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAEV,EAAE,CAAE,SAAU,CAAC;EACrBW,KAAK,EAAEC;AACR,CAAC;AAED,MAAMC,oBAAoB,GAAKC,KAAgC,IAAM;EAAA,IAAAC,aAAA;EACpE,MAAM;IAAEC,qBAAqB;IAAEC,SAAS;IAAEN,KAAK;IAAEO,IAAI;IAAEC;EAAS,CAAC,GAAGL,KAAK;EAEzE,MAAMM,mBAAmB,GAAG,CAAC,CAAEhB,iBAAiB,CAAEa,SAAU,CAAC;EAE7D,MAAMI,OAAqC,GAAG,CAC7Cb,cAAc,EACd,GAAGS,SAAS,CAACK,GAAG,CAAIC,QAAQ,IAAM;IACjC,IAAIC,IAAI;IACR,IAAKJ,mBAAmB,EAAG;MAC1B,MAAM,CAAEK,QAAQ,CAAE,GAAGtB,gCAAgC,CACpDoB,QAAQ,CAACL,IACV,CAAC;MACD,IAAKO,QAAQ,KAAKb,SAAS,EAAG;QAC7BY,IAAI,GAAGE,MAAM,CAAED,QAAS,CAAC;MAC1B;IACD,CAAC,MAAM,IAAKpB,gBAAgB,CAAEkB,QAAQ,CAACL,IAAK,CAAC,EAAG;MAC/CM,IAAI,GAAGE,MAAM,CAAEH,QAAQ,CAACL,IAAK,CAAC;IAC/B;IACA,OAAO;MACNT,GAAG,EAAEc,QAAQ,CAACI,IAAI;MAClBjB,IAAI,EAAEa,QAAQ,CAACb,IAAI,IAAIa,QAAQ,CAACI,IAAI;MACpChB,KAAK,EAAEY,QAAQ,CAACL,IAAI;MACpBM;IACD,CAAC;EACF,CAAE,CAAC,CACH;EAED,MAAMI,cAAc,IAAAb,aAAA,GACnBM,OAAO,CAACQ,IAAI,CAAIC,MAAM,IAAMA,MAAM,CAACnB,KAAK,KAAKA,KAAM,CAAC,cAAAI,aAAA,cAAAA,aAAA,GAAIP,cAAc;EAEvE,oBACCD,IAAA,CAACL,mBAAmB;IACnBc,qBAAqB,EAAGA,qBAAuB;IAC/Ce,iCAAiC;IACjCC,SAAS,EAAC,qCAAqC;IAC/CC,KAAK,EAAGjC,EAAE,CAAE,WAAY,CAAG;IAC3BkC,mBAAmB;IACnBC,WAAW,EAAGlC,OAAO;IACpB;IACAD,EAAE,CAAE,kCAAmC,CAAC,EACxC4B,cAAc,CAAClB,IAChB,CAAG;IACHW,OAAO,EAAGA,OAAS;IACnBV,KAAK,EAAGiB,cAAgB;IACxBQ,gBAAgB;IAChBjB,QAAQ,EAAGA,CAAE;MACZkB;IAGD,CAAC,KAAM;MACNlB,QAAQ,CAAEkB,YAAY,CAAC1B,KAAM,CAAC;IAC/B,CAAG;IACHO,IAAI,EAAGA;EAAM,CACb,CAAC;AAEJ,CAAC;AAED,eAAeL,oBAAoB","ignoreList":[]}
+{"version":3,"names":["__","sprintf","CustomSelectControl","isSimpleCssValue","jsx","_jsx","DEFAULT_OPTION","key","name","value","undefined","FontSizePickerSelect","props","_options$find","__next40pxDefaultSize","fontSizes","size","onChange","options","map","fontSize","hint","String","slug","selectedOption","find","option","__shouldNotWarnDeprecated36pxSize","className","label","hideLabelFromVision","describedBy","showSelectedHint","selectedItem"],"sources":["@wordpress/components/src/font-size-picker/font-size-picker-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport CustomSelectControl from '../custom-select-control';\nimport type {\n\tFontSizePickerSelectProps,\n\tFontSizePickerSelectOption,\n} from './types';\nimport { isSimpleCssValue } from './utils';\n\nconst DEFAULT_OPTION: FontSizePickerSelectOption = {\n\tkey: 'default',\n\tname: __( 'Default' ),\n\tvalue: undefined,\n};\n\nconst FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {\n\tconst { __next40pxDefaultSize, fontSizes, value, size, onChange } = props;\n\n\tconst options: FontSizePickerSelectOption[] = [\n\t\tDEFAULT_OPTION,\n\t\t...fontSizes.map( ( fontSize ) => {\n\t\t\tlet hint;\n\t\t\tif ( isSimpleCssValue( fontSize.size ) ) {\n\t\t\t\thint = String( fontSize.size );\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tkey: fontSize.slug,\n\t\t\t\tname: fontSize.name || fontSize.slug,\n\t\t\t\tvalue: fontSize.size,\n\t\t\t\thint,\n\t\t\t};\n\t\t} ),\n\t];\n\n\tconst selectedOption =\n\t\toptions.find( ( option ) => option.value === value ) ?? DEFAULT_OPTION;\n\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\tclassName=\"components-font-size-picker__select\"\n\t\t\tlabel={ __( 'Font size' ) }\n\t\t\thideLabelFromVision\n\t\t\tdescribedBy={ sprintf(\n\t\t\t\t// translators: %s: Currently selected font size.\n\t\t\t\t__( 'Currently selected font size: %s' ),\n\t\t\t\tselectedOption.name\n\t\t\t) }\n\t\t\toptions={ options }\n\t\t\tvalue={ selectedOption }\n\t\t\tshowSelectedHint\n\t\t\tonChange={ ( {\n\t\t\t\tselectedItem,\n\t\t\t}: {\n\t\t\t\tselectedItem: FontSizePickerSelectOption;\n\t\t\t} ) => {\n\t\t\t\tonChange( selectedItem.value );\n\t\t\t} }\n\t\t\tsize={ size }\n\t\t/>\n\t);\n};\n\nexport default FontSizePickerSelect;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;;AAE7C;AACA;AACA;AACA,OAAOC,mBAAmB,MAAM,0BAA0B;AAK1D,SAASC,gBAAgB,QAAQ,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE3C,MAAMC,cAA0C,GAAG;EAClDC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAER,EAAE,CAAE,SAAU,CAAC;EACrBS,KAAK,EAAEC;AACR,CAAC;AAED,MAAMC,oBAAoB,GAAKC,KAAgC,IAAM;EAAA,IAAAC,aAAA;EACpE,MAAM;IAAEC,qBAAqB;IAAEC,SAAS;IAAEN,KAAK;IAAEO,IAAI;IAAEC;EAAS,CAAC,GAAGL,KAAK;EAEzE,MAAMM,OAAqC,GAAG,CAC7CZ,cAAc,EACd,GAAGS,SAAS,CAACI,GAAG,CAAIC,QAAQ,IAAM;IACjC,IAAIC,IAAI;IACR,IAAKlB,gBAAgB,CAAEiB,QAAQ,CAACJ,IAAK,CAAC,EAAG;MACxCK,IAAI,GAAGC,MAAM,CAAEF,QAAQ,CAACJ,IAAK,CAAC;IAC/B;IACA,OAAO;MACNT,GAAG,EAAEa,QAAQ,CAACG,IAAI;MAClBf,IAAI,EAAEY,QAAQ,CAACZ,IAAI,IAAIY,QAAQ,CAACG,IAAI;MACpCd,KAAK,EAAEW,QAAQ,CAACJ,IAAI;MACpBK;IACD,CAAC;EACF,CAAE,CAAC,CACH;EAED,MAAMG,cAAc,IAAAX,aAAA,GACnBK,OAAO,CAACO,IAAI,CAAIC,MAAM,IAAMA,MAAM,CAACjB,KAAK,KAAKA,KAAM,CAAC,cAAAI,aAAA,cAAAA,aAAA,GAAIP,cAAc;EAEvE,oBACCD,IAAA,CAACH,mBAAmB;IACnBY,qBAAqB,EAAGA,qBAAuB;IAC/Ca,iCAAiC;IACjCC,SAAS,EAAC,qCAAqC;IAC/CC,KAAK,EAAG7B,EAAE,CAAE,WAAY,CAAG;IAC3B8B,mBAAmB;IACnBC,WAAW,EAAG9B,OAAO;IACpB;IACAD,EAAE,CAAE,kCAAmC,CAAC,EACxCwB,cAAc,CAAChB,IAChB,CAAG;IACHU,OAAO,EAAGA,OAAS;IACnBT,KAAK,EAAGe,cAAgB;IACxBQ,gBAAgB;IAChBf,QAAQ,EAAGA,CAAE;MACZgB;IAGD,CAAC,KAAM;MACNhB,QAAQ,CAAEgB,YAAY,CAACxB,KAAM,CAAC;IAC/B,CAAG;IACHO,IAAI,EAAGA;EAAM,CACb,CAAC;AAEJ,CAAC;AAED,eAAeL,oBAAoB","ignoreList":[]}

package/build-module/font-size-picker/index.js

@@ -7,7 +7,8 @@
  */
 import { __ } from '@wordpress/i18n';
 import { settings } from '@wordpress/icons';
-import { useState, useMemo, forwardRef } from '@wordpress/element';
+import { useState, forwardRef } from '@wordpress/element';
+import { useInstanceId } from '@wordpress/compose';
 
 /**
  * Internal dependencies
@@ -16,13 +17,10 @@ import { Button } from '../button';
 import RangeControl from '../range-control';
 import { Flex, FlexItem } from '../flex';
 import { default as UnitControl, parseQuantityAndUnitFromRawValue, useCustomUnits } from '../unit-control';
-import { VisuallyHidden } from '../visually-hidden';
-import { getCommonSizeUnit } from './utils';
-import { Container, Header, HeaderHint, HeaderLabel, HeaderToggle } from './styles';
+import { Container, Header, HeaderLabel, HeaderToggle } from './styles';
 import { Spacer } from '../spacer';
 import FontSizePickerSelect from './font-size-picker-select';
 import FontSizePickerToggleGroup from './font-size-picker-toggle-group';
-import { T_SHIRT_NAMES } from './constants';
 import { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const DEFAULT_UNITS = ['px', 'em', 'rem', 'vw', 'vh'];
@@ -40,6 +38,7 @@ const UnforwardedFontSizePicker = (props, ref) => {
     withSlider = false,
     withReset = true
   } = props;
+  const labelId = useInstanceId(UnforwardedFontSizePicker, 'font-size-picker-label');
   const units = useCustomUnits({
     availableUnits: unitsProp
   });
@@ -56,24 +55,6 @@ const UnforwardedFontSizePicker = (props, ref) => {
   } else {
     currentPickerType = fontSizes.length > MAX_TOGGLE_GROUP_SIZES ? 'select' : 'togglegroup';
   }
-  const headerHint = useMemo(() => {
-    switch (currentPickerType) {
-      case 'custom':
-        return __('Custom');
-      case 'togglegroup':
-        if (selectedFontSize) {
-          return selectedFontSize.name || T_SHIRT_NAMES[fontSizes.indexOf(selectedFontSize)];
-        }
-        break;
-      case 'select':
-        const commonUnit = getCommonSizeUnit(fontSizes);
-        if (commonUnit) {
-          return `(${commonUnit})`;
-        }
-        break;
-    }
-    return '';
-  }, [currentPickerType, selectedFontSize, fontSizes]);
   if (fontSizes.length === 0 && disableCustomFontSizes) {
     return null;
   }
@@ -92,19 +73,16 @@ const UnforwardedFontSizePicker = (props, ref) => {
   });
   return /*#__PURE__*/_jsxs(Container, {
     ref: ref,
-    className: "components-font-size-picker",
-    children: [/*#__PURE__*/_jsx(VisuallyHidden, {
-      as: "legend",
-      children: __('Font size')
-    }), /*#__PURE__*/_jsx(Spacer, {
+    className: "components-font-size-picker"
+    // This Container component renders a fieldset element that needs to be labeled.
+    ,
+    "aria-labelledby": labelId,
+    children: [/*#__PURE__*/_jsx(Spacer, {
       children: /*#__PURE__*/_jsxs(Header, {
         className: "components-font-size-picker__header",
-        children: [/*#__PURE__*/_jsxs(HeaderLabel, {
-          "aria-label": `${__('Size')} ${headerHint || ''}`,
-          children: [__('Size'), headerHint && /*#__PURE__*/_jsx(HeaderHint, {
-            className: "components-font-size-picker__header__hint",
-            children: headerHint
-          })]
+        children: [/*#__PURE__*/_jsx(HeaderLabel, {
+          id: labelId,
+          children: __('Font size')
         }), !disableCustomFontSizes && /*#__PURE__*/_jsx(HeaderToggle, {
           label: currentPickerType === 'custom' ? __('Use size preset') : __('Set custom size'),
           icon: settings,
@@ -147,7 +125,7 @@ const UnforwardedFontSizePicker = (props, ref) => {
           children: /*#__PURE__*/_jsx(UnitControl, {
             __next40pxDefaultSize: __next40pxDefaultSize,
             __shouldNotWarnDeprecated36pxSize: true,
-            label: __('Custom'),
+            label: __('Font size'),
             labelPosition: "top",
             hideLabelFromVision: true,
             value: value,
@@ -173,7 +151,7 @@ const UnforwardedFontSizePicker = (props, ref) => {
               __next40pxDefaultSize: __next40pxDefaultSize,
               __shouldNotWarnDeprecated36pxSize: true,
               className: "components-font-size-picker__custom-input",
-              label: __('Custom Size'),
+              label: __('Font size'),
               hideLabelFromVision: true,
               value: valueQuantity,
               initialPosition: fallbackFontSize,