@wordpress/block-editor 16.1.0 → 17.0.0

package/build-module/components/dimensions-tool/aspect-ratio-tool.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dimensions-tool/aspect-ratio-tool.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { SelectControl } from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\nimport { InheritanceToolsPanelItem } from '../global-styles/inheritance';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @callback AspectRatioToolPropsOnChange\n * @param {string} [value] New aspect ratio value.\n * @return {void} No return.\n */\n\n/**\n * @typedef {Object} AspectRatioToolProps\n * @property {string}                       [panelId]          ID of the panel this tool is associated with.\n * @property {string}                       [value]            Current aspect ratio value.\n * @property {AspectRatioToolPropsOnChange} [onChange]         Callback to update the aspect ratio value.\n * @property {SelectControlProps[]}         [options]          Aspect ratio options.\n * @property {string}                       [defaultValue]     Default aspect ratio value.\n * @property {boolean}                      [isShownByDefault] Whether the tool is shown by default.\n * @property {string}                       [className]        Additional CSS class on the wrapping panel item.\n * @property {boolean}                      [isInherited]      Whether the control is displaying an inherited Global Styles value.\n * @property {boolean}                      [hasLocalOverride] Whether a local value is overriding an inherited Global Styles value.\n */\n\nexport default function AspectRatioTool( {\n\tpanelId,\n\tvalue,\n\tonChange = () => {},\n\toptions,\n\tdefaultValue = 'auto',\n\thasValue,\n\tisShownByDefault = true,\n\tclassName,\n\tisInherited,\n\thasLocalOverride,\n} ) {\n\t// Match the CSS default so if the value is used directly in CSS it will look correct in the control.\n\tconst displayValue = value ?? 'auto';\n\n\tconst [ defaultRatios, themeRatios, showDefaultRatios ] = useSettings(\n\t\t'dimensions.aspectRatios.default',\n\t\t'dimensions.aspectRatios.theme',\n\t\t'dimensions.defaultAspectRatios'\n\t);\n\n\tconst themeOptions = themeRatios?.map( ( { name, ratio } ) => ( {\n\t\tlabel: name,\n\t\tvalue: ratio,\n\t} ) );\n\n\tconst defaultOptions = defaultRatios?.map( ( { name, ratio } ) => ( {\n\t\tlabel: name,\n\t\tvalue: ratio,\n\t} ) );\n\n\tconst aspectRatioOptions = [\n\t\t{\n\t\t\tlabel: _x(\n\t\t\t\t'Original',\n\t\t\t\t'Aspect ratio option for dimensions control'\n\t\t\t),\n\t\t\tvalue: 'auto',\n\t\t},\n\t\t...( showDefaultRatios ? defaultOptions : [] ),\n\t\t...( themeOptions ? themeOptions : [] ),\n\t\t{\n\t\t\tlabel: _x( 'Custom', 'Aspect ratio option for dimensions control' ),\n\t\t\tvalue: 'custom',\n\t\t\tdisabled: true,\n\t\t\thidden: true,\n\t\t},\n\t];\n\n\treturn (\n\t\t<InheritanceToolsPanelItem\n\t\t\tclassName={ className }\n\t\t\tisInherited={ isInherited }\n\t\t\thasLocalOverride={ hasLocalOverride }\n\t\t\thasValue={\n\t\t\t\thasValue ? hasValue : () => displayValue !== defaultValue\n\t\t\t}\n\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\tonDeselect={ () => onChange( undefined ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<SelectControl\n\t\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\toptions={ options ?? aspectRatioOptions }\n\t\t\t\tonChange={ onChange }\n\t\t\t/>\n\t\t</InheritanceToolsPanelItem>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,qBAAqB;AAC9B,SAAS,IAAI,UAAU;AAIvB,SAAS,mBAAmB;AAC5B,SAAS,iCAAiC;AAuFvC;AA9DY,SAAR,gBAAkC;AAAA,EACxC;AAAA,EACA;AAAA,EACA,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AACD,GAAI;AAEH,QAAM,eAAe,SAAS;AAE9B,QAAM,CAAE,eAAe,aAAa,iBAAkB,IAAI;AAAA,IACzD;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,QAAM,eAAe,aAAa,IAAK,CAAE,EAAE,MAAM,MAAM,OAAS;AAAA,IAC/D,OAAO;AAAA,IACP,OAAO;AAAA,EACR,EAAI;AAEJ,QAAM,iBAAiB,eAAe,IAAK,CAAE,EAAE,MAAM,MAAM,OAAS;AAAA,IACnE,OAAO;AAAA,IACP,OAAO;AAAA,EACR,EAAI;AAEJ,QAAM,qBAAqB;AAAA,IAC1B;AAAA,MACC,OAAO;AAAA,QACN;AAAA,QACA;AAAA,MACD;AAAA,MACA,OAAO;AAAA,IACR;AAAA,IACA,GAAK,oBAAoB,iBAAiB,CAAC;AAAA,IAC3C,GAAK,eAAe,eAAe,CAAC;AAAA,IACpC;AAAA,MACC,OAAO,GAAI,UAAU,4CAA6C;AAAA,MAClE,OAAO;AAAA,MACP,UAAU;AAAA,MACV,QAAQ;AAAA,IACT;AAAA,EACD;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UACC,WAAW,WAAW,MAAM,iBAAiB;AAAA,MAE9C,OAAQ,GAAI,cAAe;AAAA,MAC3B,YAAa,MAAM,SAAU,MAAU;AAAA,MACvC;AAAA,MACA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,cAAe;AAAA,UAC3B,OAAQ;AAAA,UACR,SAAU,WAAW;AAAA,UACrB;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["import { SelectControl } from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { useSettings } from '../use-settings';\nimport { InheritanceToolsPanelItem } from '../global-styles/inheritance';\nimport { findAspectRatioOption } from './utils';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @callback AspectRatioToolPropsOnChange\n * @param {string} [value] New aspect ratio value.\n * @return {void} No return.\n */\n\n/**\n * @typedef {Object} AspectRatioToolProps\n * @property {string}                       [panelId]          ID of the panel this tool is associated with.\n * @property {string}                       [value]            Current aspect ratio value.\n * @property {AspectRatioToolPropsOnChange} [onChange]         Callback to update the aspect ratio value.\n * @property {SelectControlProps[]}         [options]          Aspect ratio options.\n * @property {string}                       [defaultValue]     Default aspect ratio value.\n * @property {boolean}                      [isShownByDefault] Whether the tool is shown by default.\n * @property {string}                       [className]        Additional CSS class on the wrapping panel item.\n * @property {boolean}                      [isInherited]      Whether the control is displaying an inherited Global Styles value.\n * @property {boolean}                      [hasLocalOverride] Whether a local value is overriding an inherited Global Styles value.\n */\n\nexport default function AspectRatioTool( {\n\tpanelId,\n\tvalue,\n\tonChange = () => {},\n\toptions,\n\tdefaultValue = 'auto',\n\thasValue,\n\tisShownByDefault = true,\n\tclassName,\n\tisInherited,\n\thasLocalOverride,\n} ) {\n\tconst [ defaultRatios, themeRatios, showDefaultRatios ] = useSettings(\n\t\t'dimensions.aspectRatios.default',\n\t\t'dimensions.aspectRatios.theme',\n\t\t'dimensions.defaultAspectRatios'\n\t);\n\n\tconst themeOptions = themeRatios?.map( ( { name, ratio } ) => ( {\n\t\tlabel: name,\n\t\tvalue: ratio,\n\t} ) );\n\n\tconst defaultOptions = defaultRatios?.map( ( { name, ratio } ) => ( {\n\t\tlabel: name,\n\t\tvalue: ratio,\n\t} ) );\n\n\tconst aspectRatioOptions = [\n\t\t{\n\t\t\tlabel: _x(\n\t\t\t\t'Original',\n\t\t\t\t'Aspect ratio option for dimensions control'\n\t\t\t),\n\t\t\tvalue: 'auto',\n\t\t},\n\t\t...( showDefaultRatios ? defaultOptions : [] ),\n\t\t...( themeOptions ? themeOptions : [] ),\n\t\t{\n\t\t\tlabel: _x( 'Custom', 'Aspect ratio option for dimensions control' ),\n\t\t\tvalue: 'custom',\n\t\t\tdisabled: true,\n\t\t\thidden: true,\n\t\t},\n\t];\n\n\tconst resolvedOptions = options ?? aspectRatioOptions;\n\n\t// The value is free-form CSS, so it doesn't necessarily match an option as\n\t// written, e.g. '1/1' and '1' describe the same ratio. Resolve it to the\n\t// option that represents it, falling back to 'custom' so that a ratio\n\t// without a matching preset isn't displayed as one of the presets. Values\n\t// that are empty match the CSS default, so if the value is used directly in\n\t// CSS it will look correct in the control.\n\tconst displayValue =\n\t\tvalue === undefined || value === null || value === 'auto'\n\t\t\t? 'auto'\n\t\t\t: findAspectRatioOption( value, resolvedOptions )?.value ??\n\t\t\t  'custom';\n\n\treturn (\n\t\t<InheritanceToolsPanelItem\n\t\t\tclassName={ className }\n\t\t\tisInherited={ isInherited }\n\t\t\thasLocalOverride={ hasLocalOverride }\n\t\t\thasValue={\n\t\t\t\thasValue ? hasValue : () => displayValue !== defaultValue\n\t\t\t}\n\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\tonDeselect={ () => onChange( undefined ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<SelectControl\n\t\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\toptions={ resolvedOptions }\n\t\t\t\tonChange={ onChange }\n\t\t\t/>\n\t\t</InheritanceToolsPanelItem>\n\t);\n}\n"],
+  "mappings": ";AAAA,SAAS,qBAAqB;AAC9B,SAAS,IAAI,UAAU;AACvB,SAAS,mBAAmB;AAC5B,SAAS,iCAAiC;AAC1C,SAAS,6BAA6B;AAkGnC;AAzEY,SAAR,gBAAkC;AAAA,EACxC;AAAA,EACA;AAAA,EACA,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,CAAE,eAAe,aAAa,iBAAkB,IAAI;AAAA,IACzD;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,QAAM,eAAe,aAAa,IAAK,CAAE,EAAE,MAAM,MAAM,OAAS;AAAA,IAC/D,OAAO;AAAA,IACP,OAAO;AAAA,EACR,EAAI;AAEJ,QAAM,iBAAiB,eAAe,IAAK,CAAE,EAAE,MAAM,MAAM,OAAS;AAAA,IACnE,OAAO;AAAA,IACP,OAAO;AAAA,EACR,EAAI;AAEJ,QAAM,qBAAqB;AAAA,IAC1B;AAAA,MACC,OAAO;AAAA,QACN;AAAA,QACA;AAAA,MACD;AAAA,MACA,OAAO;AAAA,IACR;AAAA,IACA,GAAK,oBAAoB,iBAAiB,CAAC;AAAA,IAC3C,GAAK,eAAe,eAAe,CAAC;AAAA,IACpC;AAAA,MACC,OAAO,GAAI,UAAU,4CAA6C;AAAA,MAClE,OAAO;AAAA,MACP,UAAU;AAAA,MACV,QAAQ;AAAA,IACT;AAAA,EACD;AAEA,QAAM,kBAAkB,WAAW;AAQnC,QAAM,eACL,UAAU,UAAa,UAAU,QAAQ,UAAU,SAChD,SACA,sBAAuB,OAAO,eAAgB,GAAG,SACjD;AAEJ,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UACC,WAAW,WAAW,MAAM,iBAAiB;AAAA,MAE9C,OAAQ,GAAI,cAAe;AAAA,MAC3B,YAAa,MAAM,SAAU,MAAU;AAAA,MACvC;AAAA,MACA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,cAAe;AAAA,UAC3B,OAAQ;AAAA,UACR,SAAU;AAAA,UACV;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dimensions-tool/index.mjs

@@ -1,5 +1,5 @@
 // packages/block-editor/src/components/dimensions-tool/index.js
-import { useState } from "@wordpress/element";
+import { useEffect, useRef } from "@wordpress/element";
 import AspectRatioTool from "./aspect-ratio-tool.mjs";
 import ScaleTool from "./scale-tool.mjs";
 import WidthHeightTool from "./width-height-tool.mjs";
@@ -24,9 +24,19 @@ function DimensionsTool({
   const height = value.height === void 0 || value.height === "auto" ? null : value.height;
   const aspectRatio = value.aspectRatio === void 0 || value.aspectRatio === "auto" ? null : value.aspectRatio;
   const scale = value.scale === void 0 ? null : value.scale;
-  const [lastScale, setLastScale] = useState(scale);
-  const [lastAspectRatio, setLastAspectRatio] = useState(aspectRatio);
   const hasCustomAspectRatio = !!(width && height);
+  const lastScaleRef = useRef(scale);
+  const lastAspectRatioRef = useRef(aspectRatio);
+  useEffect(() => {
+    if (scale) {
+      lastScaleRef.current = scale;
+    }
+  }, [scale]);
+  useEffect(() => {
+    if (!hasCustomAspectRatio) {
+      lastAspectRatioRef.current = aspectRatio;
+    }
+  }, [aspectRatio, hasCustomAspectRatio]);
   const aspectRatioValue = hasCustomAspectRatio ? "custom" : aspectRatio;
   const showScaleControl = aspectRatio || width && height;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -40,7 +50,6 @@ function DimensionsTool({
         onChange: (nextAspectRatio) => {
           const nextValue = { ...value };
           nextAspectRatio = nextAspectRatio === "auto" ? null : nextAspectRatio;
-          setLastAspectRatio(nextAspectRatio);
           if (!nextAspectRatio) {
             delete nextValue.aspectRatio;
           } else {
@@ -48,11 +57,8 @@ function DimensionsTool({
           }
           if (!nextAspectRatio) {
             delete nextValue.scale;
-          } else if (lastScale) {
-            nextValue.scale = lastScale;
           } else {
-            nextValue.scale = defaultScale;
-            setLastScale(defaultScale);
+            nextValue.scale = lastScaleRef.current ?? defaultScale;
           }
           if ("custom" !== nextAspectRatio && width && height) {
             delete nextValue.height;
@@ -83,17 +89,14 @@ function DimensionsTool({
           }
           if (nextWidth && nextHeight) {
             delete nextValue.aspectRatio;
-          } else if (lastAspectRatio) {
-            nextValue.aspectRatio = lastAspectRatio;
+          } else if (lastAspectRatioRef.current) {
+            nextValue.aspectRatio = lastAspectRatioRef.current;
           } else {
           }
-          if (!lastAspectRatio && !!nextWidth !== !!nextHeight) {
+          if (!lastAspectRatioRef.current && !!nextWidth !== !!nextHeight) {
             delete nextValue.scale;
-          } else if (lastScale) {
-            nextValue.scale = lastScale;
           } else {
-            nextValue.scale = defaultScale;
-            setLastScale(defaultScale);
+            nextValue.scale = lastScaleRef.current ?? defaultScale;
           }
           onChange(nextValue);
         }
@@ -105,10 +108,9 @@ function DimensionsTool({
         panelId,
         options: scaleOptions,
         defaultValue: defaultScale,
-        value: lastScale,
+        value: scale,
         onChange: (nextScale) => {
           const nextValue = { ...value };
-          setLastScale(nextScale);
           if (!nextScale) {
             delete nextValue.scale;
           } else {

package/build-module/components/dimensions-tool/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dimensions-tool/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport AspectRatioTool from './aspect-ratio-tool';\nimport ScaleTool from './scale-tool';\nimport WidthHeightTool from './width-height-tool';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit\n */\n\n/**\n * @typedef {Object} Dimensions\n * @property {string} [width]       CSS width property.\n * @property {string} [height]      CSS height property.\n * @property {string} [scale]       CSS object-fit property.\n * @property {string} [aspectRatio] CSS aspect-ratio property.\n */\n\n/**\n * @callback DimensionsControlsOnChange\n * @param {Dimensions} nextValue\n * @return {void}\n */\n\n/**\n * @typedef {Object} DimensionsControlsProps\n * @property {string}                     [panelId]            ID of the panel that contains the controls.\n * @property {Dimensions}                 [value]              Current dimensions values.\n * @property {DimensionsControlsOnChange} [onChange]           Callback to update the dimensions values.\n * @property {SelectControlProps[]}       [aspectRatioOptions] Aspect ratio options.\n * @property {SelectControlProps[]}       [scaleOptions]       Scale options.\n * @property {WPUnitControlUnit[]}        [unitsOptions]       Units options.\n */\n\n/**\n * Component that renders controls to edit the dimensions of an image or container.\n *\n * @param {DimensionsControlsProps} props The component props.\n *\n * @return {Element} The dimensions controls.\n */\nfunction DimensionsTool( {\n\tpanelId,\n\tvalue = {},\n\tonChange = () => {},\n\taspectRatioOptions, // Default options handled by AspectRatioTool.\n\tdefaultAspectRatio = 'auto', // Match CSS default value for aspect-ratio.\n\tscaleOptions, // Default options handled by ScaleTool.\n\tdefaultScale = 'cover',\n\tunitsOptions, // Default options handled by UnitControl.\n\ttools = [ 'aspectRatio', 'widthHeight', 'scale' ],\n} ) {\n\t// Coerce undefined and CSS default values to be null.\n\tconst width =\n\t\tvalue.width === undefined || value.width === 'auto'\n\t\t\t? null\n\t\t\t: value.width;\n\tconst height =\n\t\tvalue.height === undefined || value.height === 'auto'\n\t\t\t? null\n\t\t\t: value.height;\n\tconst aspectRatio =\n\t\tvalue.aspectRatio === undefined || value.aspectRatio === 'auto'\n\t\t\t? null\n\t\t\t: value.aspectRatio;\n\tconst scale = value.scale === undefined ? null : value.scale;\n\n\t// Keep track of state internally, so when the value is cleared by means\n\t// other than directly editing that field, it's easier to restore the\n\t// previous value.\n\tconst [ lastScale, setLastScale ] = useState( scale );\n\tconst [ lastAspectRatio, setLastAspectRatio ] = useState( aspectRatio );\n\tconst hasCustomAspectRatio = !! ( width && height );\n\n\t// 'custom' is not a valid value for CSS aspect-ratio, but it is used in the\n\t// dropdown to indicate that setting both the width and height is the same\n\t// as a custom aspect ratio.\n\tconst aspectRatioValue = hasCustomAspectRatio ? 'custom' : aspectRatio;\n\n\tconst showScaleControl = aspectRatio || ( width && height );\n\n\treturn (\n\t\t<>\n\t\t\t{ tools.includes( 'aspectRatio' ) && (\n\t\t\t\t<AspectRatioTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\toptions={ aspectRatioOptions }\n\t\t\t\t\tdefaultValue={ defaultAspectRatio }\n\t\t\t\t\tvalue={ aspectRatioValue }\n\t\t\t\t\tonChange={ ( nextAspectRatio ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\t\tnextAspectRatio =\n\t\t\t\t\t\t\tnextAspectRatio === 'auto' ? null : nextAspectRatio;\n\n\t\t\t\t\t\tsetLastAspectRatio( nextAspectRatio );\n\n\t\t\t\t\t\t// Update aspectRatio.\n\t\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.aspectRatio = nextAspectRatio;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else if ( lastScale ) {\n\t\t\t\t\t\t\tnextValue.scale = lastScale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale = defaultScale;\n\t\t\t\t\t\t\tsetLastScale( defaultScale );\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update width and height.\n\t\t\t\t\t\tif ( 'custom' !== nextAspectRatio && width && height ) {\n\t\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ tools.includes( 'widthHeight' ) && (\n\t\t\t\t<WidthHeightTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\tunits={ unitsOptions }\n\t\t\t\t\tvalue={ { width, height } }\n\t\t\t\t\tonChange={ ( { width: nextWidth, height: nextHeight } ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\t\tnextWidth = nextWidth === 'auto' ? null : nextWidth;\n\t\t\t\t\t\tnextHeight = nextHeight === 'auto' ? null : nextHeight;\n\n\t\t\t\t\t\t// Update width.\n\t\t\t\t\t\tif ( ! nextWidth ) {\n\t\t\t\t\t\t\tdelete nextValue.width;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.width = nextWidth;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Update height.\n\t\t\t\t\t\tif ( ! nextHeight ) {\n\t\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.height = nextHeight;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update aspectRatio.\n\t\t\t\t\t\tif ( nextWidth && nextHeight ) {\n\t\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t\t} else if ( lastAspectRatio ) {\n\t\t\t\t\t\t\tnextValue.aspectRatio = lastAspectRatio;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t// No setting defaultAspectRatio here, because\n\t\t\t\t\t\t\t// aspectRatio is optional in this scenario,\n\t\t\t\t\t\t\t// unlike scale.\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! lastAspectRatio &&\n\t\t\t\t\t\t\t!! nextWidth !== !! nextHeight\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else if ( lastScale ) {\n\t\t\t\t\t\t\tnextValue.scale = lastScale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale = defaultScale;\n\t\t\t\t\t\t\tsetLastScale( defaultScale );\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ tools.includes( 'scale' ) && showScaleControl && (\n\t\t\t\t<ScaleTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\toptions={ scaleOptions }\n\t\t\t\t\tdefaultValue={ defaultScale }\n\t\t\t\t\tvalue={ lastScale }\n\t\t\t\t\tonChange={ ( nextScale ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\tsetLastScale( nextScale );\n\n\t\t\t\t\t\t// Update scale.\n\t\t\t\t\t\tif ( ! nextScale ) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale = nextScale;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default DimensionsTool;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { useEffect, useRef } from '@wordpress/element';\nimport AspectRatioTool from './aspect-ratio-tool';\nimport ScaleTool from './scale-tool';\nimport WidthHeightTool from './width-height-tool';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit\n */\n\n/**\n * @typedef {Object} Dimensions\n * @property {string} [width]       CSS width property.\n * @property {string} [height]      CSS height property.\n * @property {string} [scale]       CSS object-fit property.\n * @property {string} [aspectRatio] CSS aspect-ratio property.\n */\n\n/**\n * @callback DimensionsControlsOnChange\n * @param {Dimensions} nextValue\n * @return {void}\n */\n\n/**\n * @typedef {Object} DimensionsControlsProps\n * @property {string}                     [panelId]            ID of the panel that contains the controls.\n * @property {Dimensions}                 [value]              Current dimensions values.\n * @property {DimensionsControlsOnChange} [onChange]           Callback to update the dimensions values.\n * @property {SelectControlProps[]}       [aspectRatioOptions] Aspect ratio options.\n * @property {SelectControlProps[]}       [scaleOptions]       Scale options.\n * @property {WPUnitControlUnit[]}        [unitsOptions]       Units options.\n */\n\n/**\n * Component that renders controls to edit the dimensions of an image or container.\n *\n * @param {DimensionsControlsProps} props The component props.\n *\n * @return {Element} The dimensions controls.\n */\nfunction DimensionsTool( {\n\tpanelId,\n\tvalue = {},\n\tonChange = () => {},\n\taspectRatioOptions, // Default options handled by AspectRatioTool.\n\tdefaultAspectRatio = 'auto', // Match CSS default value for aspect-ratio.\n\tscaleOptions, // Default options handled by ScaleTool.\n\tdefaultScale = 'cover',\n\tunitsOptions, // Default options handled by UnitControl.\n\ttools = [ 'aspectRatio', 'widthHeight', 'scale' ],\n} ) {\n\t// Coerce undefined and CSS default values to be null.\n\tconst width =\n\t\tvalue.width === undefined || value.width === 'auto'\n\t\t\t? null\n\t\t\t: value.width;\n\tconst height =\n\t\tvalue.height === undefined || value.height === 'auto'\n\t\t\t? null\n\t\t\t: value.height;\n\tconst aspectRatio =\n\t\tvalue.aspectRatio === undefined || value.aspectRatio === 'auto'\n\t\t\t? null\n\t\t\t: value.aspectRatio;\n\tconst scale = value.scale === undefined ? null : value.scale;\n\n\tconst hasCustomAspectRatio = !! ( width && height );\n\n\t// Keep track of the previous values, so when a value is cleared by means\n\t// other than directly editing that field, it's easier to restore it. These\n\t// are only ever read while handling a change, so they're kept in refs and\n\t// synced from the value to stay correct when it is updated externally, e.g.\n\t// by undo or by another client.\n\tconst lastScaleRef = useRef( scale );\n\tconst lastAspectRatioRef = useRef( aspectRatio );\n\n\tuseEffect( () => {\n\t\t// Scale is cleared alongside the aspect ratio, so only remember the\n\t\t// values it is actually set to.\n\t\tif ( scale ) {\n\t\t\tlastScaleRef.current = scale;\n\t\t}\n\t}, [ scale ] );\n\n\tuseEffect( () => {\n\t\t// A custom aspect ratio, i.e. both a width and a height, clears the\n\t\t// aspect ratio value. Keep the remembered one so it can be restored\n\t\t// once the custom aspect ratio is removed.\n\t\tif ( ! hasCustomAspectRatio ) {\n\t\t\tlastAspectRatioRef.current = aspectRatio;\n\t\t}\n\t}, [ aspectRatio, hasCustomAspectRatio ] );\n\n\t// 'custom' is not a valid value for CSS aspect-ratio, but it is used in the\n\t// dropdown to indicate that setting both the width and height is the same\n\t// as a custom aspect ratio.\n\tconst aspectRatioValue = hasCustomAspectRatio ? 'custom' : aspectRatio;\n\n\tconst showScaleControl = aspectRatio || ( width && height );\n\n\treturn (\n\t\t<>\n\t\t\t{ tools.includes( 'aspectRatio' ) && (\n\t\t\t\t<AspectRatioTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\toptions={ aspectRatioOptions }\n\t\t\t\t\tdefaultValue={ defaultAspectRatio }\n\t\t\t\t\tvalue={ aspectRatioValue }\n\t\t\t\t\tonChange={ ( nextAspectRatio ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\t\tnextAspectRatio =\n\t\t\t\t\t\t\tnextAspectRatio === 'auto' ? null : nextAspectRatio;\n\n\t\t\t\t\t\t// Update aspectRatio.\n\t\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.aspectRatio = nextAspectRatio;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale =\n\t\t\t\t\t\t\t\tlastScaleRef.current ?? defaultScale;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update width and height.\n\t\t\t\t\t\tif ( 'custom' !== nextAspectRatio && width && height ) {\n\t\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ tools.includes( 'widthHeight' ) && (\n\t\t\t\t<WidthHeightTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\tunits={ unitsOptions }\n\t\t\t\t\tvalue={ { width, height } }\n\t\t\t\t\tonChange={ ( { width: nextWidth, height: nextHeight } ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\t\tnextWidth = nextWidth === 'auto' ? null : nextWidth;\n\t\t\t\t\t\tnextHeight = nextHeight === 'auto' ? null : nextHeight;\n\n\t\t\t\t\t\t// Update width.\n\t\t\t\t\t\tif ( ! nextWidth ) {\n\t\t\t\t\t\t\tdelete nextValue.width;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.width = nextWidth;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Update height.\n\t\t\t\t\t\tif ( ! nextHeight ) {\n\t\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.height = nextHeight;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update aspectRatio.\n\t\t\t\t\t\tif ( nextWidth && nextHeight ) {\n\t\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t\t} else if ( lastAspectRatioRef.current ) {\n\t\t\t\t\t\t\tnextValue.aspectRatio = lastAspectRatioRef.current;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t// No setting defaultAspectRatio here, because\n\t\t\t\t\t\t\t// aspectRatio is optional in this scenario,\n\t\t\t\t\t\t\t// unlike scale.\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! lastAspectRatioRef.current &&\n\t\t\t\t\t\t\t!! nextWidth !== !! nextHeight\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale =\n\t\t\t\t\t\t\t\tlastScaleRef.current ?? defaultScale;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ tools.includes( 'scale' ) && showScaleControl && (\n\t\t\t\t<ScaleTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\toptions={ scaleOptions }\n\t\t\t\t\tdefaultValue={ defaultScale }\n\t\t\t\t\tvalue={ scale }\n\t\t\t\t\tonChange={ ( nextScale ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\t// Update scale.\n\t\t\t\t\t\tif ( ! nextScale ) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale = nextScale;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default DimensionsTool;\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/dimensions-tool/scale-tool.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dimensions-tool/scale-tool.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n} from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\nimport { __, _x } from '@wordpress/i18n';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * The descriptions are purposely made generic as object-fit could be used for\n * any replaced element. Provide your own set of options if you need different\n * help text or labels.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element\n *\n * @type {SelectControlProps[]}\n */\nconst DEFAULT_SCALE_OPTIONS = [\n\t{\n\t\tvalue: 'fill',\n\t\tlabel: _x( 'Fill', 'Scale option for dimensions control' ),\n\t\thelp: __( 'Fill the space by stretching the content.' ),\n\t},\n\t{\n\t\tvalue: 'contain',\n\t\tlabel: _x( 'Contain', 'Scale option for dimensions control' ),\n\t\thelp: __( 'Fit the content to the space without clipping.' ),\n\t},\n\t{\n\t\tvalue: 'cover',\n\t\tlabel: _x( 'Cover', 'Scale option for dimensions control' ),\n\t\thelp: __( \"Fill the space by clipping what doesn't fit.\" ),\n\t},\n\t{\n\t\tvalue: 'none',\n\t\tlabel: _x( 'None', 'Scale option for dimensions control' ),\n\t\thelp: __(\n\t\t\t'Do not adjust the sizing of the content. Content that is too large will be clipped, and content that is too small will have additional padding.'\n\t\t),\n\t},\n\t{\n\t\tvalue: 'scale-down',\n\t\tlabel: _x( 'Scale down', 'Scale option for dimensions control' ),\n\t\thelp: __(\n\t\t\t'Scale down the content to fit the space if it is too big. Content that is too small will have additional padding.'\n\t\t),\n\t},\n];\n\n/**\n * @callback ScaleToolPropsOnChange\n * @param {string} nextValue New scale value.\n * @return {void}\n */\n\n/**\n * @typedef {Object} ScaleToolProps\n * @property {string}                 [panelId]               ID of the panel that contains the controls.\n * @property {string}                 [value]                 Current scale value.\n * @property {ScaleToolPropsOnChange} [onChange]              Callback to update the scale value.\n * @property {SelectControlProps[]}   [options]               Scale options.\n * @property {string}                 [defaultValue]          Default scale value.\n * @property {boolean}                [showControl=true]      Whether to show the control.\n * @property {boolean}                [isShownByDefault=true] Whether the tool panel is shown by default.\n */\n\n/**\n * A tool to select the CSS object-fit property for the image.\n *\n * @param {ScaleToolProps} props\n *\n * @return {React.ReactElement} The scale tool.\n */\nexport default function ScaleTool( {\n\tpanelId,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_SCALE_OPTIONS,\n\tdefaultValue = DEFAULT_SCALE_OPTIONS[ 0 ].value,\n\tisShownByDefault = true,\n} ) {\n\tconst displayValue = value ?? defaultValue;\n\n\tconst scaleHelp = useMemo( () => {\n\t\treturn options.reduce( ( acc, option ) => {\n\t\t\tacc[ option.value ] = option.help;\n\t\t\treturn acc;\n\t\t}, {} );\n\t}, [ options ] );\n\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\tlabel={ _x( 'Scale', 'Image scaling options' ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\thasValue={ () => displayValue !== defaultValue }\n\t\t\tonDeselect={ () => onChange( defaultValue ) }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<ToggleGroupControl\n\t\t\t\tlabel={ _x( 'Scale', 'Image scaling options' ) }\n\t\t\t\tisBlock\n\t\t\t\thelp={ scaleHelp[ displayValue ] }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\tonChange={ onChange }\n\t\t\t>\n\t\t\t\t{ options.map( ( option ) => (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ option.value }\n\t\t\t\t\t\t{ ...option }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</ToggleGroupControl>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],
-  "mappings": ";AAGA;AAAA,EACC,gCAAgC;AAAA,EAChC,oCAAoC;AAAA,EACpC,0CAA0C;AAAA,OACpC;AACP,SAAS,eAAe;AACxB,SAAS,IAAI,UAAU;AAwGlB;AAzFL,IAAM,wBAAwB;AAAA,EAC7B;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,QAAQ,qCAAsC;AAAA,IACzD,MAAM,GAAI,2CAA4C;AAAA,EACvD;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,WAAW,qCAAsC;AAAA,IAC5D,MAAM,GAAI,gDAAiD;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,SAAS,qCAAsC;AAAA,IAC1D,MAAM,GAAI,8CAA+C;AAAA,EAC1D;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,QAAQ,qCAAsC;AAAA,IACzD,MAAM;AAAA,MACL;AAAA,IACD;AAAA,EACD;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,cAAc,qCAAsC;AAAA,IAC/D,MAAM;AAAA,MACL;AAAA,IACD;AAAA,EACD;AACD;AA0Be,SAAR,UAA4B;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,eAAe,sBAAuB,CAAE,EAAE;AAAA,EAC1C,mBAAmB;AACpB,GAAI;AACH,QAAM,eAAe,SAAS;AAE9B,QAAM,YAAY,QAAS,MAAM;AAChC,WAAO,QAAQ,OAAQ,CAAE,KAAK,WAAY;AACzC,UAAK,OAAO,KAAM,IAAI,OAAO;AAC7B,aAAO;AAAA,IACR,GAAG,CAAC,CAAE;AAAA,EACP,GAAG,CAAE,OAAQ,CAAE;AAEf,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ,GAAI,SAAS,uBAAwB;AAAA,MAC7C;AAAA,MACA,UAAW,MAAM,iBAAiB;AAAA,MAClC,YAAa,MAAM,SAAU,YAAa;AAAA,MAC1C;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,SAAS,uBAAwB;AAAA,UAC7C,SAAO;AAAA,UACP,MAAO,UAAW,YAAa;AAAA,UAC/B,OAAQ;AAAA,UACR;AAAA,UAEE,kBAAQ,IAAK,CAAE,WAChB;AAAA,YAAC;AAAA;AAAA,cAEE,GAAG;AAAA;AAAA,YADC,OAAO;AAAA,UAEd,CACC;AAAA;AAAA,MACH;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["import {\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n} from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\nimport { __, _x } from '@wordpress/i18n';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * The descriptions are purposely made generic as object-fit could be used for\n * any replaced element. Provide your own set of options if you need different\n * help text or labels.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element\n *\n * @type {SelectControlProps[]}\n */\nconst DEFAULT_SCALE_OPTIONS = [\n\t{\n\t\tvalue: 'fill',\n\t\tlabel: _x( 'Fill', 'Scale option for dimensions control' ),\n\t\thelp: __( 'Fill the space by stretching the content.' ),\n\t},\n\t{\n\t\tvalue: 'contain',\n\t\tlabel: _x( 'Contain', 'Scale option for dimensions control' ),\n\t\thelp: __( 'Fit the content to the space without clipping.' ),\n\t},\n\t{\n\t\tvalue: 'cover',\n\t\tlabel: _x( 'Cover', 'Scale option for dimensions control' ),\n\t\thelp: __( \"Fill the space by clipping what doesn't fit.\" ),\n\t},\n\t{\n\t\tvalue: 'none',\n\t\tlabel: _x( 'None', 'Scale option for dimensions control' ),\n\t\thelp: __(\n\t\t\t'Do not adjust the sizing of the content. Content that is too large will be clipped, and content that is too small will have additional padding.'\n\t\t),\n\t},\n\t{\n\t\tvalue: 'scale-down',\n\t\tlabel: _x( 'Scale down', 'Scale option for dimensions control' ),\n\t\thelp: __(\n\t\t\t'Scale down the content to fit the space if it is too big. Content that is too small will have additional padding.'\n\t\t),\n\t},\n];\n\n/**\n * @callback ScaleToolPropsOnChange\n * @param {string} nextValue New scale value.\n * @return {void}\n */\n\n/**\n * @typedef {Object} ScaleToolProps\n * @property {string}                 [panelId]               ID of the panel that contains the controls.\n * @property {string}                 [value]                 Current scale value.\n * @property {ScaleToolPropsOnChange} [onChange]              Callback to update the scale value.\n * @property {SelectControlProps[]}   [options]               Scale options.\n * @property {string}                 [defaultValue]          Default scale value.\n * @property {boolean}                [showControl=true]      Whether to show the control.\n * @property {boolean}                [isShownByDefault=true] Whether the tool panel is shown by default.\n */\n\n/**\n * A tool to select the CSS object-fit property for the image.\n *\n * @param {ScaleToolProps} props\n *\n * @return {React.ReactElement} The scale tool.\n */\nexport default function ScaleTool( {\n\tpanelId,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_SCALE_OPTIONS,\n\tdefaultValue = DEFAULT_SCALE_OPTIONS[ 0 ].value,\n\tisShownByDefault = true,\n} ) {\n\tconst displayValue = value ?? defaultValue;\n\n\tconst scaleHelp = useMemo( () => {\n\t\treturn options.reduce( ( acc, option ) => {\n\t\t\tacc[ option.value ] = option.help;\n\t\t\treturn acc;\n\t\t}, {} );\n\t}, [ options ] );\n\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\tlabel={ _x( 'Scale', 'Image scaling options' ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\thasValue={ () => displayValue !== defaultValue }\n\t\t\tonDeselect={ () => onChange( defaultValue ) }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<ToggleGroupControl\n\t\t\t\tlabel={ _x( 'Scale', 'Image scaling options' ) }\n\t\t\t\tisBlock\n\t\t\t\thelp={ scaleHelp[ displayValue ] }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\tonChange={ onChange }\n\t\t\t>\n\t\t\t\t{ options.map( ( option ) => (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ option.value }\n\t\t\t\t\t\t{ ...option }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</ToggleGroupControl>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],
+  "mappings": ";AAAA;AAAA,EACC,gCAAgC;AAAA,EAChC,oCAAoC;AAAA,EACpC,0CAA0C;AAAA,OACpC;AACP,SAAS,eAAe;AACxB,SAAS,IAAI,UAAU;AAwGlB;AAzFL,IAAM,wBAAwB;AAAA,EAC7B;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,QAAQ,qCAAsC;AAAA,IACzD,MAAM,GAAI,2CAA4C;AAAA,EACvD;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,WAAW,qCAAsC;AAAA,IAC5D,MAAM,GAAI,gDAAiD;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,SAAS,qCAAsC;AAAA,IAC1D,MAAM,GAAI,8CAA+C;AAAA,EAC1D;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,QAAQ,qCAAsC;AAAA,IACzD,MAAM;AAAA,MACL;AAAA,IACD;AAAA,EACD;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,GAAI,cAAc,qCAAsC;AAAA,IAC/D,MAAM;AAAA,MACL;AAAA,IACD;AAAA,EACD;AACD;AA0Be,SAAR,UAA4B;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,eAAe,sBAAuB,CAAE,EAAE;AAAA,EAC1C,mBAAmB;AACpB,GAAI;AACH,QAAM,eAAe,SAAS;AAE9B,QAAM,YAAY,QAAS,MAAM;AAChC,WAAO,QAAQ,OAAQ,CAAE,KAAK,WAAY;AACzC,UAAK,OAAO,KAAM,IAAI,OAAO;AAC7B,aAAO;AAAA,IACR,GAAG,CAAC,CAAE;AAAA,EACP,GAAG,CAAE,OAAQ,CAAE;AAEf,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ,GAAI,SAAS,uBAAwB;AAAA,MAC7C;AAAA,MACA,UAAW,MAAM,iBAAiB;AAAA,MAClC,YAAa,MAAM,SAAU,YAAa;AAAA,MAC1C;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,SAAS,uBAAwB;AAAA,UAC7C,SAAO;AAAA,UACP,MAAO,UAAW,YAAa;AAAA,UAC/B,OAAQ;AAAA,UACR;AAAA,UAEE,kBAAQ,IAAK,CAAE,WAChB;AAAA,YAAC;AAAA;AAAA,cAEE,GAAG;AAAA;AAAA,YADC,OAAO;AAAA,UAEd,CACC;AAAA;AAAA,MACH;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dimensions-tool/utils.mjs

@@ -0,0 +1,35 @@
+// packages/block-editor/src/components/dimensions-tool/utils.js
+function parseAspectRatio(value) {
+  if (typeof value !== "string") {
+    return null;
+  }
+  const parts = value.split("/");
+  if (parts.length > 2) {
+    return null;
+  }
+  const [width, height = "1"] = parts;
+  const numericWidth = Number(width.trim());
+  const numericHeight = Number(height.trim());
+  if (!Number.isFinite(numericWidth) || !Number.isFinite(numericHeight) || numericWidth <= 0 || numericHeight <= 0) {
+    return null;
+  }
+  return numericWidth / numericHeight;
+}
+function findAspectRatioOption(value, options) {
+  const exactMatch = options.find((option) => option.value === value);
+  if (exactMatch) {
+    return exactMatch;
+  }
+  const ratio = parseAspectRatio(value);
+  if (ratio === null) {
+    return null;
+  }
+  return options.find(
+    (option) => parseAspectRatio(option.value) === ratio
+  ) ?? null;
+}
+export {
+  findAspectRatioOption,
+  parseAspectRatio
+};
+//# sourceMappingURL=utils.mjs.map

package/build-module/components/dimensions-tool/utils.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/dimensions-tool/utils.js"],
+  "sourcesContent": ["/**\n * Parses a CSS `aspect-ratio` value into a number so that values that are\n * written differently but describe the same ratio, e.g. `1` and `1/1`, can be\n * compared.\n *\n * @param {string} [value] CSS aspect-ratio value, e.g. '16/9' or '1.5'.\n *\n * @return {?number} The ratio as a number, or null when it cannot be parsed.\n */\nexport function parseAspectRatio( value ) {\n\tif ( typeof value !== 'string' ) {\n\t\treturn null;\n\t}\n\n\tconst parts = value.split( '/' );\n\n\tif ( parts.length > 2 ) {\n\t\treturn null;\n\t}\n\n\tconst [ width, height = '1' ] = parts;\n\tconst numericWidth = Number( width.trim() );\n\tconst numericHeight = Number( height.trim() );\n\n\tif (\n\t\t! Number.isFinite( numericWidth ) ||\n\t\t! Number.isFinite( numericHeight ) ||\n\t\tnumericWidth <= 0 ||\n\t\tnumericHeight <= 0\n\t) {\n\t\treturn null;\n\t}\n\n\treturn numericWidth / numericHeight;\n}\n\n/**\n * Finds the option that represents the given CSS `aspect-ratio` value.\n *\n * Aspect ratio values are free-form CSS, while the options are a fixed list of\n * presets, so an exact string match isn't enough: `1/1` and `1` describe the\n * same ratio but only one of them is a preset value.\n *\n * @param {string}   value   CSS aspect-ratio value.\n * @param {Object[]} options Aspect ratio options.\n *\n * @return {?Object} The matching option, or null when there is none.\n */\nexport function findAspectRatioOption( value, options ) {\n\tconst exactMatch = options.find( ( option ) => option.value === value );\n\n\tif ( exactMatch ) {\n\t\treturn exactMatch;\n\t}\n\n\tconst ratio = parseAspectRatio( value );\n\n\tif ( ratio === null ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\toptions.find(\n\t\t\t( option ) => parseAspectRatio( option.value ) === ratio\n\t\t) ?? null\n\t);\n}\n"],
+  "mappings": ";AASO,SAAS,iBAAkB,OAAQ;AACzC,MAAK,OAAO,UAAU,UAAW;AAChC,WAAO;AAAA,EACR;AAEA,QAAM,QAAQ,MAAM,MAAO,GAAI;AAE/B,MAAK,MAAM,SAAS,GAAI;AACvB,WAAO;AAAA,EACR;AAEA,QAAM,CAAE,OAAO,SAAS,GAAI,IAAI;AAChC,QAAM,eAAe,OAAQ,MAAM,KAAK,CAAE;AAC1C,QAAM,gBAAgB,OAAQ,OAAO,KAAK,CAAE;AAE5C,MACC,CAAE,OAAO,SAAU,YAAa,KAChC,CAAE,OAAO,SAAU,aAAc,KACjC,gBAAgB,KAChB,iBAAiB,GAChB;AACD,WAAO;AAAA,EACR;AAEA,SAAO,eAAe;AACvB;AAcO,SAAS,sBAAuB,OAAO,SAAU;AACvD,QAAM,aAAa,QAAQ,KAAM,CAAE,WAAY,OAAO,UAAU,KAAM;AAEtE,MAAK,YAAa;AACjB,WAAO;AAAA,EACR;AAEA,QAAM,QAAQ,iBAAkB,KAAM;AAEtC,MAAK,UAAU,MAAO;AACrB,WAAO;AAAA,EACR;AAEA,SACC,QAAQ;AAAA,IACP,CAAE,WAAY,iBAAkB,OAAO,KAAM,MAAM;AAAA,EACpD,KAAK;AAEP;",
+  "names": []
+}

package/build-module/components/dimensions-tool/width-height-tool.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dimensions-tool/width-height-tool.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalUnitControl as UnitControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit\n */\n\n/**\n * @typedef {Object} WidthHeightToolValue\n * @property {string} [width]  Width CSS value.\n * @property {string} [height] Height CSS value.\n */\n\n/**\n * @callback WidthHeightToolOnChange\n * @param {WidthHeightToolValue} nextValue Next dimensions value.\n * @return {void}\n */\n\n/**\n * @typedef {Object} WidthHeightToolProps\n * @property {string}                  [panelId]          ID of the panel that contains the controls.\n * @property {WidthHeightToolValue}    [value]            Current dimensions values.\n * @property {WidthHeightToolOnChange} [onChange]         Callback to update the dimensions values.\n * @property {WPUnitControlUnit[]}     [units]            Units options.\n * @property {boolean}                 [isShownByDefault] Whether the panel is shown by default.\n */\n\n/**\n * Component that renders controls to edit the dimensions of an image or container.\n *\n * @param {WidthHeightToolProps} props The component props.\n *\n * @return {React.ReactElement} The width and height tool.\n */\nexport default function WidthHeightTool( {\n\tpanelId,\n\tvalue = {},\n\tonChange = () => {},\n\tunits,\n\tisShownByDefault = true,\n} ) {\n\t// null, undefined, and 'auto' all represent the default value.\n\tconst width = value.width === 'auto' ? '' : value.width ?? '';\n\tconst height = value.height === 'auto' ? '' : value.height ?? '';\n\n\tconst onDimensionChange = ( dimension ) => ( nextDimension ) => {\n\t\tconst nextValue = { ...value };\n\t\t// Empty strings or undefined may be passed and both represent removing the value.\n\t\tif ( ! nextDimension ) {\n\t\t\tdelete nextValue[ dimension ];\n\t\t} else {\n\t\t\tnextValue[ dimension ] = nextDimension;\n\t\t}\n\t\tonChange( nextValue );\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<ToolsPanelItem\n\t\t\t\tstyle={ { gridColumn: 'span 1' } }\n\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\thasValue={ () => width !== '' }\n\t\t\t\tonDeselect={ onDimensionChange( 'width' ) }\n\t\t\t\tpanelId={ panelId }\n\t\t\t>\n\t\t\t\t<UnitControl\n\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\tunits={ units }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tvalue={ width }\n\t\t\t\t\tonChange={ onDimensionChange( 'width' ) }\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t\t<ToolsPanelItem\n\t\t\t\tstyle={ { gridColumn: 'span 1' } }\n\t\t\t\tlabel={ __( 'Height' ) }\n\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\thasValue={ () => height !== '' }\n\t\t\t\tonDeselect={ onDimensionChange( 'height' ) }\n\t\t\t\tpanelId={ panelId }\n\t\t\t>\n\t\t\t\t<UnitControl\n\t\t\t\t\tlabel={ __( 'Height' ) }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\tunits={ units }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tvalue={ height }\n\t\t\t\t\tonChange={ onDimensionChange( 'height' ) }\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t</>\n\t);\n}\n"],
-  "mappings": ";AAGA;AAAA,EACC,gCAAgC;AAAA,EAChC,6BAA6B;AAAA,OACvB;AACP,SAAS,UAAU;AAyDjB,mBASE,KATF;AAvBa,SAAR,gBAAkC;AAAA,EACxC;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB;AAAA,EACA,mBAAmB;AACpB,GAAI;AAEH,QAAM,QAAQ,MAAM,UAAU,SAAS,KAAK,MAAM,SAAS;AAC3D,QAAM,SAAS,MAAM,WAAW,SAAS,KAAK,MAAM,UAAU;AAE9D,QAAM,oBAAoB,CAAE,cAAe,CAAE,kBAAmB;AAC/D,UAAM,YAAY,EAAE,GAAG,MAAM;AAE7B,QAAK,CAAE,eAAgB;AACtB,aAAO,UAAW,SAAU;AAAA,IAC7B,OAAO;AACN,gBAAW,SAAU,IAAI;AAAA,IAC1B;AACA,aAAU,SAAU;AAAA,EACrB;AAEA,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,YAAY,SAAS;AAAA,QAC/B,OAAQ,GAAI,OAAQ;AAAA,QACpB;AAAA,QACA,UAAW,MAAM,UAAU;AAAA,QAC3B,YAAa,kBAAmB,OAAQ;AAAA,QACxC;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ,GAAI,OAAQ;AAAA,YACpB,aAAc,GAAI,MAAO;AAAA,YACzB,eAAc;AAAA,YACd;AAAA,YACA,KAAM;AAAA,YACN,OAAQ;AAAA,YACR,UAAW,kBAAmB,OAAQ;AAAA;AAAA,QACvC;AAAA;AAAA,IACD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,YAAY,SAAS;AAAA,QAC/B,OAAQ,GAAI,QAAS;AAAA,QACrB;AAAA,QACA,UAAW,MAAM,WAAW;AAAA,QAC5B,YAAa,kBAAmB,QAAS;AAAA,QACzC;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ,GAAI,QAAS;AAAA,YACrB,aAAc,GAAI,MAAO;AAAA,YACzB,eAAc;AAAA,YACd;AAAA,YACA,KAAM;AAAA,YACN,OAAQ;AAAA,YACR,UAAW,kBAAmB,QAAS;AAAA;AAAA,QACxC;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
+  "sourcesContent": ["import {\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalUnitControl as UnitControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit\n */\n\n/**\n * @typedef {Object} WidthHeightToolValue\n * @property {string} [width]  Width CSS value.\n * @property {string} [height] Height CSS value.\n */\n\n/**\n * @callback WidthHeightToolOnChange\n * @param {WidthHeightToolValue} nextValue Next dimensions value.\n * @return {void}\n */\n\n/**\n * @typedef {Object} WidthHeightToolProps\n * @property {string}                  [panelId]          ID of the panel that contains the controls.\n * @property {WidthHeightToolValue}    [value]            Current dimensions values.\n * @property {WidthHeightToolOnChange} [onChange]         Callback to update the dimensions values.\n * @property {WPUnitControlUnit[]}     [units]            Units options.\n * @property {boolean}                 [isShownByDefault] Whether the panel is shown by default.\n */\n\n/**\n * Component that renders controls to edit the dimensions of an image or container.\n *\n * @param {WidthHeightToolProps} props The component props.\n *\n * @return {React.ReactElement} The width and height tool.\n */\nexport default function WidthHeightTool( {\n\tpanelId,\n\tvalue = {},\n\tonChange = () => {},\n\tunits,\n\tisShownByDefault = true,\n} ) {\n\t// null, undefined, and 'auto' all represent the default value.\n\tconst width = value.width === 'auto' ? '' : value.width ?? '';\n\tconst height = value.height === 'auto' ? '' : value.height ?? '';\n\n\tconst onDimensionChange = ( dimension ) => ( nextDimension ) => {\n\t\tconst nextValue = { ...value };\n\t\t// Empty strings or undefined may be passed and both represent removing the value.\n\t\tif ( ! nextDimension ) {\n\t\t\tdelete nextValue[ dimension ];\n\t\t} else {\n\t\t\tnextValue[ dimension ] = nextDimension;\n\t\t}\n\t\tonChange( nextValue );\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<ToolsPanelItem\n\t\t\t\tstyle={ { gridColumn: 'span 1' } }\n\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\thasValue={ () => width !== '' }\n\t\t\t\tonDeselect={ onDimensionChange( 'width' ) }\n\t\t\t\tpanelId={ panelId }\n\t\t\t>\n\t\t\t\t<UnitControl\n\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\tunits={ units }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tvalue={ width }\n\t\t\t\t\tonChange={ onDimensionChange( 'width' ) }\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t\t<ToolsPanelItem\n\t\t\t\tstyle={ { gridColumn: 'span 1' } }\n\t\t\t\tlabel={ __( 'Height' ) }\n\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\thasValue={ () => height !== '' }\n\t\t\t\tonDeselect={ onDimensionChange( 'height' ) }\n\t\t\t\tpanelId={ panelId }\n\t\t\t>\n\t\t\t\t<UnitControl\n\t\t\t\t\tlabel={ __( 'Height' ) }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\tunits={ units }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tvalue={ height }\n\t\t\t\t\tonChange={ onDimensionChange( 'height' ) }\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t</>\n\t);\n}\n"],
+  "mappings": ";AAAA;AAAA,EACC,gCAAgC;AAAA,EAChC,6BAA6B;AAAA,OACvB;AACP,SAAS,UAAU;AAyDjB,mBASE,KATF;AAvBa,SAAR,gBAAkC;AAAA,EACxC;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB;AAAA,EACA,mBAAmB;AACpB,GAAI;AAEH,QAAM,QAAQ,MAAM,UAAU,SAAS,KAAK,MAAM,SAAS;AAC3D,QAAM,SAAS,MAAM,WAAW,SAAS,KAAK,MAAM,UAAU;AAE9D,QAAM,oBAAoB,CAAE,cAAe,CAAE,kBAAmB;AAC/D,UAAM,YAAY,EAAE,GAAG,MAAM;AAE7B,QAAK,CAAE,eAAgB;AACtB,aAAO,UAAW,SAAU;AAAA,IAC7B,OAAO;AACN,gBAAW,SAAU,IAAI;AAAA,IAC1B;AACA,aAAU,SAAU;AAAA,EACrB;AAEA,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,YAAY,SAAS;AAAA,QAC/B,OAAQ,GAAI,OAAQ;AAAA,QACpB;AAAA,QACA,UAAW,MAAM,UAAU;AAAA,QAC3B,YAAa,kBAAmB,OAAQ;AAAA,QACxC;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ,GAAI,OAAQ;AAAA,YACpB,aAAc,GAAI,MAAO;AAAA,YACzB,eAAc;AAAA,YACd;AAAA,YACA,KAAM;AAAA,YACN,OAAQ;AAAA,YACR,UAAW,kBAAmB,OAAQ;AAAA;AAAA,QACvC;AAAA;AAAA,IACD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,YAAY,SAAS;AAAA,QAC/B,OAAQ,GAAI,QAAS;AAAA,QACrB;AAAA,QACA,UAAW,MAAM,WAAW;AAAA,QAC5B,YAAa,kBAAmB,QAAS;AAAA,QACzC;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ,GAAI,QAAS;AAAA,YACrB,aAAc,GAAI,MAAO;AAAA,YACzB,eAAc;AAAA,YACd;AAAA,YACA,KAAM;AAAA,YACN,OAAQ;AAAA,YACR,UAAW,kBAAmB,QAAS;AAAA;AAAA,QACxC;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
   "names": []
 }

package/build-module/components/duotone-control/index.mjs

@@ -19,6 +19,7 @@ function DuotoneControl({
   disableCustomColors,
   disableCustomDuotone,
   value,
+  selectedSlug,
   onChange
 }) {
   let toolbarIcon;
@@ -73,6 +74,7 @@ function DuotoneControl({
             disableCustomColors,
             disableCustomDuotone,
             value,
+            selectedSlug,
             onChange
           }
         )

package/build-module/components/duotone-control/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/duotone-control/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tColorIndicator,\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\nimport { useInstanceId } from '@wordpress/compose';\n\nfunction DuotoneControl( {\n\tid: idProp,\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\tlet toolbarIcon;\n\tif ( value === 'unset' ) {\n\t\ttoolbarIcon = (\n\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t);\n\t} else if ( value ) {\n\t\ttoolbarIcon = <DuotoneSwatch values={ value } />;\n\t} else {\n\t\ttoolbarIcon = <Icon icon={ filter } />;\n\t}\n\n\tconst actionLabel = __( 'Apply duotone filter' );\n\tconst id = useInstanceId( DuotoneControl, 'duotone-control', idProp );\n\tconst descriptionId = `${ id }__description`;\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ actionLabel }\n\t\t\t\t\t\ticon={ toolbarIcon }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\taria-label={ actionLabel }\n\t\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"],
-  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,UAAU;AACnB,SAAS,YAAY;AACrB,SAAS,MAAM,cAAc;AAC7B,SAAS,qBAAqB;AAc3B,cAsCC,YAtCD;AAZH,SAAS,eAAgB;AAAA,EACxB,IAAI;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,MAAI;AACJ,MAAK,UAAU,SAAU;AACxB,kBACC,oBAAC,kBAAe,WAAU,iDAAgD;AAAA,EAE5E,WAAY,OAAQ;AACnB,kBAAc,oBAAC,iBAAc,QAAS,OAAQ;AAAA,EAC/C,OAAO;AACN,kBAAc,oBAAC,QAAK,MAAO,QAAS;AAAA,EACrC;AAEA,QAAM,cAAc,GAAI,sBAAuB;AAC/C,QAAM,KAAK,cAAe,gBAAgB,mBAAmB,MAAO;AACpE,QAAM,gBAAgB,GAAI,EAAG;AAE7B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,cAAe;AAAA,QACd,WAAW;AAAA,QACX,aAAa,GAAI,SAAU;AAAA,MAC5B;AAAA,MACA,cAAe,CAAE,EAAE,QAAQ,SAAS,MAAO;AAC1C,cAAM,kBAAkB,CAAE,UAAW;AACpC,cAAK,CAAE,UAAU,MAAM,YAAY,MAAO;AACzC,kBAAM,eAAe;AACrB,qBAAS;AAAA,UACV;AAAA,QACD;AACA,eACC;AAAA,UAAC;AAAA;AAAA,YACA,aAAW;AAAA,YACX,SAAU;AAAA,YACV,iBAAc;AAAA,YACd,iBAAgB;AAAA,YAChB,WAAY;AAAA,YACZ,OAAQ;AAAA,YACR,MAAO;AAAA;AAAA,QACR;AAAA,MAEF;AAAA,MACA,eAAgB,MACf,qBAAC,aAAU,OAAQ,GAAI,SAAU,GAChC;AAAA,4BAAC,OACE;AAAA,UACD;AAAA,QACD,GACD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,cAAa;AAAA,YACb,oBAAmB;AAAA,YACnB;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACD;AAAA,SACD;AAAA;AAAA,EAEF;AAEF;AAEA,IAAO,0BAAQ;",
+  "sourcesContent": ["import {\n\tColorIndicator,\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\nimport { useInstanceId } from '@wordpress/compose';\n\nfunction DuotoneControl( {\n\tid: idProp,\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tselectedSlug,\n\tonChange,\n} ) {\n\tlet toolbarIcon;\n\tif ( value === 'unset' ) {\n\t\ttoolbarIcon = (\n\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t);\n\t} else if ( value ) {\n\t\ttoolbarIcon = <DuotoneSwatch values={ value } />;\n\t} else {\n\t\ttoolbarIcon = <Icon icon={ filter } />;\n\t}\n\n\tconst actionLabel = __( 'Apply duotone filter' );\n\tconst id = useInstanceId( DuotoneControl, 'duotone-control', idProp );\n\tconst descriptionId = `${ id }__description`;\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ actionLabel }\n\t\t\t\t\t\ticon={ toolbarIcon }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\taria-label={ actionLabel }\n\t\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tselectedSlug={ selectedSlug }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"],
+  "mappings": ";AAAA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,UAAU;AACnB,SAAS,YAAY;AACrB,SAAS,MAAM,cAAc;AAC7B,SAAS,qBAAqB;AAe3B,cAsCC,YAtCD;AAbH,SAAS,eAAgB;AAAA,EACxB,IAAI;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,MAAI;AACJ,MAAK,UAAU,SAAU;AACxB,kBACC,oBAAC,kBAAe,WAAU,iDAAgD;AAAA,EAE5E,WAAY,OAAQ;AACnB,kBAAc,oBAAC,iBAAc,QAAS,OAAQ;AAAA,EAC/C,OAAO;AACN,kBAAc,oBAAC,QAAK,MAAO,QAAS;AAAA,EACrC;AAEA,QAAM,cAAc,GAAI,sBAAuB;AAC/C,QAAM,KAAK,cAAe,gBAAgB,mBAAmB,MAAO;AACpE,QAAM,gBAAgB,GAAI,EAAG;AAE7B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,cAAe;AAAA,QACd,WAAW;AAAA,QACX,aAAa,GAAI,SAAU;AAAA,MAC5B;AAAA,MACA,cAAe,CAAE,EAAE,QAAQ,SAAS,MAAO;AAC1C,cAAM,kBAAkB,CAAE,UAAW;AACpC,cAAK,CAAE,UAAU,MAAM,YAAY,MAAO;AACzC,kBAAM,eAAe;AACrB,qBAAS;AAAA,UACV;AAAA,QACD;AACA,eACC;AAAA,UAAC;AAAA;AAAA,YACA,aAAW;AAAA,YACX,SAAU;AAAA,YACV,iBAAc;AAAA,YACd,iBAAgB;AAAA,YAChB,WAAY;AAAA,YACZ,OAAQ;AAAA,YACR,MAAO;AAAA;AAAA,QACR;AAAA,MAEF;AAAA,MACA,eAAgB,MACf,qBAAC,aAAU,OAAQ,GAAI,SAAU,GAChC;AAAA,4BAAC,OACE;AAAA,UACD;AAAA,QACD,GACD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,cAAa;AAAA,YACb,oBAAmB;AAAA,YACnB;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACD;AAAA,SACD;AAAA;AAAA,EAEF;AAEF;AAEA,IAAO,0BAAQ;",
   "names": []
 }

package/build-module/components/editable-text/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/editable-text/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport RichText from '../rich-text';\n\nconst EditableText = forwardRef( ( props, ref ) => {\n\treturn <RichText ref={ ref } { ...props } __unstableDisableFormats />;\n} );\n\nEditableText.Content = function Content( {\n\tvalue = '',\n\ttagName: Tag = 'div',\n\t...props\n} ) {\n\treturn <Tag { ...props }>{ value }</Tag>;\n};\n\n/**\n * Renders an editable text input in which text formatting is not allowed.\n */\nexport default EditableText;\n"],
-  "mappings": ";AAGA,SAAS,kBAAkB;AAK3B,OAAO,cAAc;AAGb;AADR,IAAM,eAAe,WAAY,CAAE,OAAO,QAAS;AAClD,SAAO,oBAAC,YAAS,KAAc,GAAG,OAAQ,0BAAwB,MAAC;AACpE,CAAE;AAEF,aAAa,UAAU,SAAS,QAAS;AAAA,EACxC,QAAQ;AAAA,EACR,SAAS,MAAM;AAAA,EACf,GAAG;AACJ,GAAI;AACH,SAAO,oBAAC,OAAM,GAAG,OAAU,iBAAO;AACnC;AAKA,IAAO,wBAAQ;",
+  "sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport RichText from '../rich-text';\n\nconst EditableText = forwardRef( ( props, ref ) => {\n\treturn <RichText ref={ ref } { ...props } __unstableDisableFormats />;\n} );\n\nEditableText.Content = function Content( {\n\tvalue = '',\n\ttagName: Tag = 'div',\n\t...props\n} ) {\n\treturn <Tag { ...props }>{ value }</Tag>;\n};\n\n/**\n * Renders an editable text input in which text formatting is not allowed.\n */\nexport default EditableText;\n"],
+  "mappings": ";AAAA,SAAS,kBAAkB;AAC3B,OAAO,cAAc;AAGb;AADR,IAAM,eAAe,WAAY,CAAE,OAAO,QAAS;AAClD,SAAO,oBAAC,YAAS,KAAc,GAAG,OAAQ,0BAAwB,MAAC;AACpE,CAAE;AAEF,aAAa,UAAU,SAAS,QAAS;AAAA,EACxC,QAAQ;AAAA,EACR,SAAS,MAAM;AAAA,EACf,GAAG;AACJ,GAAI;AACH,SAAO,oBAAC,OAAM,GAAG,OAAU,iBAAO;AACnC;AAKA,IAAO,wBAAQ;",
   "names": []
 }

package/build-module/components/editor-styles/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/editor-styles/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/**\n * WordPress dependencies\n */\nimport { SVG } from '@wordpress/components';\nimport { useCallback, useMemo, memo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport transformStyles from '../../utils/transform-styles';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction useDarkThemeBodyClassName( styles, scope ) {\n\treturn useCallback(\n\t\t( node ) => {\n\t\t\tif ( ! node ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView, body } = ownerDocument;\n\t\t\tconst canvas = scope ? ownerDocument.querySelector( scope ) : body;\n\n\t\t\tlet backgroundColor;\n\n\t\t\tif ( ! canvas ) {\n\t\t\t\t// The real .editor-styles-wrapper element might not exist in the\n\t\t\t\t// DOM, so calculate the background color by creating a fake\n\t\t\t\t// wrapper.\n\t\t\t\tconst tempCanvas = ownerDocument.createElement( 'div' );\n\t\t\t\ttempCanvas.classList.add( 'editor-styles-wrapper' );\n\t\t\t\tbody.appendChild( tempCanvas );\n\n\t\t\t\tbackgroundColor = defaultView\n\t\t\t\t\t?.getComputedStyle( tempCanvas, null )\n\t\t\t\t\t.getPropertyValue( 'background-color' );\n\n\t\t\t\tbody.removeChild( tempCanvas );\n\t\t\t} else {\n\t\t\t\tbackgroundColor = defaultView\n\t\t\t\t\t?.getComputedStyle( canvas, null )\n\t\t\t\t\t.getPropertyValue( 'background-color' );\n\t\t\t}\n\t\t\tconst colordBackgroundColor = colord( backgroundColor );\n\t\t\t// If background is transparent, it should be treated as light color.\n\t\t\tif (\n\t\t\t\tcolordBackgroundColor.luminance() > 0.5 ||\n\t\t\t\tcolordBackgroundColor.alpha() === 0\n\t\t\t) {\n\t\t\t\tbody.classList.remove( 'is-dark-theme' );\n\t\t\t} else {\n\t\t\t\tbody.classList.add( 'is-dark-theme' );\n\t\t\t}\n\t\t},\n\t\t[ styles, scope ]\n\t);\n}\n\nfunction EditorStyles( { styles, scope, transformOptions } ) {\n\tconst overrides = useSelect(\n\t\t( select ) => unlock( select( blockEditorStore ) ).getStyleOverrides(),\n\t\t[]\n\t);\n\tconst [ transformedStyles, transformedSvgs ] = useMemo( () => {\n\t\tconst _styles = Object.values( styles ?? [] );\n\n\t\t/*\n\t\t * Custom CSS overrides are applied after all other overrides so they\n\t\t * win the cascade at equal specificity, mirroring the front end where\n\t\t * the custom CSS stylesheet is printed last. Both partitions keep the\n\t\t * block order established by getStyleOverrides.\n\t\t */\n\t\tconst orderedOverrides = [\n\t\t\t...overrides.filter(\n\t\t\t\t( [ , override ] ) => override?.__unstableType !== 'custom-css'\n\t\t\t),\n\t\t\t...overrides.filter(\n\t\t\t\t( [ , override ] ) => override?.__unstableType === 'custom-css'\n\t\t\t),\n\t\t];\n\n\t\tfor ( const [ id, override ] of orderedOverrides ) {\n\t\t\tconst index = _styles.findIndex( ( { id: _id } ) => id === _id );\n\t\t\tconst overrideWithId = { ...override, id };\n\t\t\tif ( index === -1 ) {\n\t\t\t\t_styles.push( overrideWithId );\n\t\t\t} else {\n\t\t\t\t_styles[ index ] = overrideWithId;\n\t\t\t}\n\t\t}\n\n\t\treturn [\n\t\t\ttransformStyles(\n\t\t\t\t_styles.filter( ( style ) => style?.css ),\n\t\t\t\tscope,\n\t\t\t\ttransformOptions\n\t\t\t),\n\t\t\t_styles\n\t\t\t\t.filter( ( style ) => style.__unstableType === 'svgs' )\n\t\t\t\t.map( ( style ) => style.assets )\n\t\t\t\t.join( '' ),\n\t\t];\n\t}, [ styles, overrides, scope, transformOptions ] );\n\n\treturn (\n\t\t<>\n\t\t\t{ /* Use an empty style element to have a document reference,\n\t\t\t     but this could be any element. */ }\n\t\t\t<style\n\t\t\t\tref={ useDarkThemeBodyClassName( transformedStyles, scope ) }\n\t\t\t/>\n\t\t\t{ transformedStyles.map( ( css, index ) => (\n\t\t\t\t<style key={ index }>{ css }</style>\n\t\t\t) ) }\n\t\t\t<SVG\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tviewBox=\"0 0 0 0\"\n\t\t\t\twidth=\"0\"\n\t\t\t\theight=\"0\"\n\t\t\t\trole=\"none\"\n\t\t\t\tstyle={ {\n\t\t\t\t\tvisibility: 'hidden',\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\tleft: '-9999px',\n\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t} }\n\t\t\t\tdangerouslySetInnerHTML={ { __html: transformedSvgs } }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default memo( EditorStyles );\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport { SVG } from '@wordpress/components';\nimport { useCallback, useMemo, memo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport transformStyles from '../../utils/transform-styles';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction useDarkThemeBodyClassName( styles, scope ) {\n\treturn useCallback(\n\t\t( node ) => {\n\t\t\tif ( ! node ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView, body } = ownerDocument;\n\t\t\tconst canvas = scope ? ownerDocument.querySelector( scope ) : body;\n\n\t\t\tlet backgroundColor;\n\n\t\t\tif ( ! canvas ) {\n\t\t\t\t// The real .editor-styles-wrapper element might not exist in the\n\t\t\t\t// DOM, so calculate the background color by creating a fake\n\t\t\t\t// wrapper.\n\t\t\t\tconst tempCanvas = ownerDocument.createElement( 'div' );\n\t\t\t\ttempCanvas.classList.add( 'editor-styles-wrapper' );\n\t\t\t\tbody.appendChild( tempCanvas );\n\n\t\t\t\tbackgroundColor = defaultView\n\t\t\t\t\t?.getComputedStyle( tempCanvas, null )\n\t\t\t\t\t.getPropertyValue( 'background-color' );\n\n\t\t\t\tbody.removeChild( tempCanvas );\n\t\t\t} else {\n\t\t\t\tbackgroundColor = defaultView\n\t\t\t\t\t?.getComputedStyle( canvas, null )\n\t\t\t\t\t.getPropertyValue( 'background-color' );\n\t\t\t}\n\t\t\tconst colordBackgroundColor = colord( backgroundColor );\n\t\t\t// If background is transparent, it should be treated as light color.\n\t\t\tif (\n\t\t\t\tcolordBackgroundColor.luminance() > 0.5 ||\n\t\t\t\tcolordBackgroundColor.alpha() === 0\n\t\t\t) {\n\t\t\t\tbody.classList.remove( 'is-dark-theme' );\n\t\t\t} else {\n\t\t\t\tbody.classList.add( 'is-dark-theme' );\n\t\t\t}\n\t\t},\n\t\t[ styles, scope ]\n\t);\n}\n\nfunction EditorStyles( { styles, scope, transformOptions } ) {\n\tconst overrides = useSelect(\n\t\t( select ) => unlock( select( blockEditorStore ) ).getStyleOverrides(),\n\t\t[]\n\t);\n\tconst [ transformedStyles, transformedSvgs ] = useMemo( () => {\n\t\tconst _styles = Object.values( styles ?? [] );\n\n\t\t/*\n\t\t * Custom CSS overrides are applied after all other overrides so they\n\t\t * win the cascade at equal specificity, mirroring the front end where\n\t\t * the custom CSS stylesheet is printed last. Both partitions keep the\n\t\t * block order established by getStyleOverrides.\n\t\t */\n\t\tconst orderedOverrides = [\n\t\t\t...overrides.filter(\n\t\t\t\t( [ , override ] ) => override?.__unstableType !== 'custom-css'\n\t\t\t),\n\t\t\t...overrides.filter(\n\t\t\t\t( [ , override ] ) => override?.__unstableType === 'custom-css'\n\t\t\t),\n\t\t];\n\n\t\tfor ( const [ id, override ] of orderedOverrides ) {\n\t\t\tconst index = _styles.findIndex( ( { id: _id } ) => id === _id );\n\t\t\tconst overrideWithId = { ...override, id };\n\t\t\tif ( index === -1 ) {\n\t\t\t\t_styles.push( overrideWithId );\n\t\t\t} else {\n\t\t\t\t_styles[ index ] = overrideWithId;\n\t\t\t}\n\t\t}\n\n\t\treturn [\n\t\t\ttransformStyles(\n\t\t\t\t_styles.filter( ( style ) => style?.css ),\n\t\t\t\tscope,\n\t\t\t\ttransformOptions\n\t\t\t),\n\t\t\t_styles\n\t\t\t\t.filter( ( style ) => style.__unstableType === 'svgs' )\n\t\t\t\t.map( ( style ) => style.assets )\n\t\t\t\t.join( '' ),\n\t\t];\n\t}, [ styles, overrides, scope, transformOptions ] );\n\n\treturn (\n\t\t<>\n\t\t\t{ /* Use an empty style element to have a document reference,\n\t\t\t     but this could be any element. */ }\n\t\t\t<style\n\t\t\t\tref={ useDarkThemeBodyClassName( transformedStyles, scope ) }\n\t\t\t/>\n\t\t\t{ transformedStyles.map( ( css, index ) => (\n\t\t\t\t<style key={ index }>{ css }</style>\n\t\t\t) ) }\n\t\t\t<SVG\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tviewBox=\"0 0 0 0\"\n\t\t\t\twidth=\"0\"\n\t\t\t\theight=\"0\"\n\t\t\t\trole=\"none\"\n\t\t\t\tstyle={ {\n\t\t\t\t\tvisibility: 'hidden',\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\tleft: '-9999px',\n\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t} }\n\t\t\t\tdangerouslySetInnerHTML={ { __html: transformedSvgs } }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default memo( EditorStyles );\n"],
+  "mappings": ";AAAA,SAAS,QAAQ,cAAc;AAC/B,OAAO,iBAAiB;AACxB,OAAO,gBAAgB;AACvB,SAAS,WAAW;AACpB,SAAS,aAAa,SAAS,YAAY;AAC3C,SAAS,iBAAiB;AAC1B,OAAO,qBAAqB;AAC5B,SAAS,SAAS,wBAAwB;AAC1C,SAAS,cAAc;AAiGrB,mBAGC,KAHD;AA/FF,OAAQ,CAAE,aAAa,UAAW,CAAE;AAEpC,SAAS,0BAA2B,QAAQ,OAAQ;AACnD,SAAO;AAAA,IACN,CAAE,SAAU;AACX,UAAK,CAAE,MAAO;AACb;AAAA,MACD;AAEA,YAAM,EAAE,cAAc,IAAI;AAC1B,YAAM,EAAE,aAAa,KAAK,IAAI;AAC9B,YAAM,SAAS,QAAQ,cAAc,cAAe,KAAM,IAAI;AAE9D,UAAI;AAEJ,UAAK,CAAE,QAAS;AAIf,cAAM,aAAa,cAAc,cAAe,KAAM;AACtD,mBAAW,UAAU,IAAK,uBAAwB;AAClD,aAAK,YAAa,UAAW;AAE7B,0BAAkB,aACf,iBAAkB,YAAY,IAAK,EACpC,iBAAkB,kBAAmB;AAEvC,aAAK,YAAa,UAAW;AAAA,MAC9B,OAAO;AACN,0BAAkB,aACf,iBAAkB,QAAQ,IAAK,EAChC,iBAAkB,kBAAmB;AAAA,MACxC;AACA,YAAM,wBAAwB,OAAQ,eAAgB;AAEtD,UACC,sBAAsB,UAAU,IAAI,OACpC,sBAAsB,MAAM,MAAM,GACjC;AACD,aAAK,UAAU,OAAQ,eAAgB;AAAA,MACxC,OAAO;AACN,aAAK,UAAU,IAAK,eAAgB;AAAA,MACrC;AAAA,IACD;AAAA,IACA,CAAE,QAAQ,KAAM;AAAA,EACjB;AACD;AAEA,SAAS,aAAc,EAAE,QAAQ,OAAO,iBAAiB,GAAI;AAC5D,QAAM,YAAY;AAAA,IACjB,CAAE,WAAY,OAAQ,OAAQ,gBAAiB,CAAE,EAAE,kBAAkB;AAAA,IACrE,CAAC;AAAA,EACF;AACA,QAAM,CAAE,mBAAmB,eAAgB,IAAI,QAAS,MAAM;AAC7D,UAAM,UAAU,OAAO,OAAQ,UAAU,CAAC,CAAE;AAQ5C,UAAM,mBAAmB;AAAA,MACxB,GAAG,UAAU;AAAA,QACZ,CAAE,CAAE,EAAE,QAAS,MAAO,UAAU,mBAAmB;AAAA,MACpD;AAAA,MACA,GAAG,UAAU;AAAA,QACZ,CAAE,CAAE,EAAE,QAAS,MAAO,UAAU,mBAAmB;AAAA,MACpD;AAAA,IACD;AAEA,eAAY,CAAE,IAAI,QAAS,KAAK,kBAAmB;AAClD,YAAM,QAAQ,QAAQ,UAAW,CAAE,EAAE,IAAI,IAAI,MAAO,OAAO,GAAI;AAC/D,YAAM,iBAAiB,EAAE,GAAG,UAAU,GAAG;AACzC,UAAK,UAAU,IAAK;AACnB,gBAAQ,KAAM,cAAe;AAAA,MAC9B,OAAO;AACN,gBAAS,KAAM,IAAI;AAAA,MACpB;AAAA,IACD;AAEA,WAAO;AAAA,MACN;AAAA,QACC,QAAQ,OAAQ,CAAE,UAAW,OAAO,GAAI;AAAA,QACxC;AAAA,QACA;AAAA,MACD;AAAA,MACA,QACE,OAAQ,CAAE,UAAW,MAAM,mBAAmB,MAAO,EACrD,IAAK,CAAE,UAAW,MAAM,MAAO,EAC/B,KAAM,EAAG;AAAA,IACZ;AAAA,EACD,GAAG,CAAE,QAAQ,WAAW,OAAO,gBAAiB,CAAE;AAElD,SACC,iCAGC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,KAAM,0BAA2B,mBAAmB,KAAM;AAAA;AAAA,IAC3D;AAAA,IACE,kBAAkB,IAAK,CAAE,KAAK,UAC/B,oBAAC,WAAsB,iBAAV,KAAe,CAC3B;AAAA,IACF;AAAA,MAAC;AAAA;AAAA,QACA,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,QAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAQ;AAAA,UACP,YAAY;AAAA,UACZ,UAAU;AAAA,UACV,MAAM;AAAA,UACN,UAAU;AAAA,QACX;AAAA,QACA,yBAA0B,EAAE,QAAQ,gBAAgB;AAAA;AAAA,IACrD;AAAA,KACD;AAEF;AAEA,IAAO,wBAAQ,KAAM,YAAa;",
   "names": []
 }

package/build-module/components/fit-text-size-warning/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/fit-text-size-warning/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { Notice } from '@wordpress/components';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Component that checks if the fit text computed font size is below a minimum\n * threshold and displays a warning notice.\n *\n * @return {Element|null} Warning notice element or null.\n */\nexport default function FitTextSizeWarning() {\n\tconst message = __(\n\t\t'The text may be too small to read. Consider using a larger container or less text.'\n\t);\n\n\t// Note: The `Notice` component can speak messages via its `spokenMessage`\n\t// prop, but similar to the contrast checker, we use granular control over\n\t// when the announcements are made.\n\tuseEffect( () => {\n\t\tspeak( message );\n\t}, [ message ] );\n\n\treturn (\n\t\t<div className=\"block-editor-fit-text-size-warning\">\n\t\t\t<Notice\n\t\t\t\tspokenMessage={ null }\n\t\t\t\tstatus=\"warning\"\n\t\t\t\tisDismissible={ false }\n\t\t\t>\n\t\t\t\t{ message }\n\t\t\t</Notice>\n\t\t</div>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,iBAAiB;AAC1B,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB,SAAS,aAAa;AAsBnB;AAdY,SAAR,qBAAsC;AAC5C,QAAM,UAAU;AAAA,IACf;AAAA,EACD;AAKA,YAAW,MAAM;AAChB,UAAO,OAAQ;AAAA,EAChB,GAAG,CAAE,OAAQ,CAAE;AAEf,SACC,oBAAC,SAAI,WAAU,sCACd;AAAA,IAAC;AAAA;AAAA,MACA,eAAgB;AAAA,MAChB,QAAO;AAAA,MACP,eAAgB;AAAA,MAEd;AAAA;AAAA,EACH,GACD;AAEF;",
+  "sourcesContent": ["import { useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { Notice } from '@wordpress/components';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Component that checks if the fit text computed font size is below a minimum\n * threshold and displays a warning notice.\n *\n * @return {Element|null} Warning notice element or null.\n */\nexport default function FitTextSizeWarning() {\n\tconst message = __(\n\t\t'The text may be too small to read. Consider using a larger container or less text.'\n\t);\n\n\t// Note: The `Notice` component can speak messages via its `spokenMessage`\n\t// prop, but similar to the contrast checker, we use granular control over\n\t// when the announcements are made.\n\tuseEffect( () => {\n\t\tspeak( message );\n\t}, [ message ] );\n\n\treturn (\n\t\t<div className=\"block-editor-fit-text-size-warning\">\n\t\t\t<Notice\n\t\t\t\tspokenMessage={ null }\n\t\t\t\tstatus=\"warning\"\n\t\t\t\tisDismissible={ false }\n\t\t\t>\n\t\t\t\t{ message }\n\t\t\t</Notice>\n\t\t</div>\n\t);\n}\n"],
+  "mappings": ";AAAA,SAAS,iBAAiB;AAC1B,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB,SAAS,aAAa;AAsBnB;AAdY,SAAR,qBAAsC;AAC5C,QAAM,UAAU;AAAA,IACf;AAAA,EACD;AAKA,YAAW,MAAM;AAChB,UAAO,OAAQ;AAAA,EAChB,GAAG,CAAE,OAAQ,CAAE;AAEf,SACC,oBAAC,SAAI,WAAU,sCACd;AAAA,IAAC;AAAA;AAAA,MACA,eAAgB;AAAA,MAChB,QAAO;AAAA,MACP,eAAgB;AAAA,MAEd;AAAA;AAAA,EACH,GACD;AAEF;",
   "names": []
 }

package/build-module/components/font-appearance-control/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/font-appearance-control/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { CustomSelectControl } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { getFontStylesAndWeights } from '../../utils/get-font-styles-and-weights';\n\n/**\n * Adjusts font appearance field label in case either font styles or weights\n * are disabled.\n *\n * @param {boolean} hasFontStyles  Whether font styles are enabled and present.\n * @param {boolean} hasFontWeights Whether font weights are enabled and present.\n * @return {string} A label representing what font appearance is being edited.\n */\nconst getFontAppearanceLabel = ( hasFontStyles, hasFontWeights ) => {\n\tif ( ! hasFontStyles ) {\n\t\treturn __( 'Font weight' );\n\t}\n\n\tif ( ! hasFontWeights ) {\n\t\treturn __( 'Font style' );\n\t}\n\n\treturn __( 'Appearance' );\n};\n\n/**\n * Control to display font style and weight options of the active font.\n *\n * @param {Object} props Component props.\n *\n * @return {Element} Font appearance control.\n */\nexport default function FontAppearanceControl( props ) {\n\tconst {\n\t\t/**\n\t\t * Start opting into the larger default height that will become the default size in a future version.\n\t\t *\n\t\t * @deprecated Default behavior since WordPress 7.1. Prop can be safely removed.\n\t\t */\n\t\t__next40pxDefaultSize: _next40pxDefaultSize,\n\t\tonChange,\n\t\thasFontStyles = true,\n\t\thasFontWeights = true,\n\t\tfontFamilyFaces,\n\t\tvalue: { fontStyle, fontWeight },\n\t\t...otherProps\n\t} = props;\n\tconst hasStylesOrWeights = hasFontStyles || hasFontWeights;\n\tconst label = getFontAppearanceLabel( hasFontStyles, hasFontWeights );\n\tconst defaultOption = {\n\t\tkey: 'default',\n\t\tname: __( 'Default' ),\n\t\tstyle: { fontStyle: undefined, fontWeight: undefined },\n\t};\n\tconst { fontStyles, fontWeights, combinedStyleAndWeightOptions } =\n\t\tgetFontStylesAndWeights( fontFamilyFaces );\n\n\t// Generates select options for combined font styles and weights.\n\tconst combineOptions = () => {\n\t\tconst combinedOptions = [ defaultOption ];\n\t\tif ( combinedStyleAndWeightOptions ) {\n\t\t\tcombinedOptions.push( ...combinedStyleAndWeightOptions );\n\t\t}\n\t\treturn combinedOptions;\n\t};\n\n\t// Generates select options for font styles only.\n\tconst styleOptions = () => {\n\t\tconst combinedOptions = [ defaultOption ];\n\t\tfontStyles.forEach( ( { name, value } ) => {\n\t\t\tcombinedOptions.push( {\n\t\t\t\tkey: value,\n\t\t\t\tname,\n\t\t\t\tstyle: { fontStyle: value, fontWeight: undefined },\n\t\t\t} );\n\t\t} );\n\t\treturn combinedOptions;\n\t};\n\n\t// Generates select options for font weights only.\n\tconst weightOptions = () => {\n\t\tconst combinedOptions = [ defaultOption ];\n\t\tfontWeights.forEach( ( { name, value } ) => {\n\t\t\tcombinedOptions.push( {\n\t\t\t\tkey: value,\n\t\t\t\tname,\n\t\t\t\tstyle: { fontStyle: undefined, fontWeight: value },\n\t\t\t} );\n\t\t} );\n\t\treturn combinedOptions;\n\t};\n\n\t// Map font styles and weights to select options.\n\tconst selectOptions = useMemo( () => {\n\t\t// Display combined available font style and weight options.\n\t\tif ( hasFontStyles && hasFontWeights ) {\n\t\t\treturn combineOptions();\n\t\t}\n\n\t\t// Display only font style options or font weight options.\n\t\treturn hasFontStyles ? styleOptions() : weightOptions();\n\t}, [\n\t\tprops.options,\n\t\tfontStyles,\n\t\tfontWeights,\n\t\tcombinedStyleAndWeightOptions,\n\t] );\n\n\t// Find current selection by comparing font style & weight against options,\n\t// and fall back to the Default option if there is no matching option.\n\tconst currentSelection =\n\t\tselectOptions.find(\n\t\t\t( option ) =>\n\t\t\t\toption.style.fontStyle === fontStyle &&\n\t\t\t\toption.style.fontWeight === fontWeight\n\t\t) || selectOptions[ 0 ];\n\n\t// Adjusts screen reader description based on styles or weights.\n\tconst getDescribedBy = () => {\n\t\tif ( ! currentSelection ) {\n\t\t\treturn __( 'No selected font appearance' );\n\t\t}\n\n\t\tif ( ! hasFontStyles ) {\n\t\t\treturn sprintf(\n\t\t\t\t// translators: %s: Currently selected font weight.\n\t\t\t\t__( 'Currently selected font weight: %s' ),\n\t\t\t\tcurrentSelection.name\n\t\t\t);\n\t\t}\n\n\t\tif ( ! hasFontWeights ) {\n\t\t\treturn sprintf(\n\t\t\t\t// translators: %s: Currently selected font style.\n\t\t\t\t__( 'Currently selected font style: %s' ),\n\t\t\t\tcurrentSelection.name\n\t\t\t);\n\t\t}\n\n\t\treturn sprintf(\n\t\t\t// translators: %s: Currently selected font appearance.\n\t\t\t__( 'Currently selected font appearance: %s' ),\n\t\t\tcurrentSelection.name\n\t\t);\n\t};\n\n\treturn (\n\t\thasStylesOrWeights && (\n\t\t\t<CustomSelectControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\tclassName=\"components-font-appearance-control\"\n\t\t\t\tlabel={ label }\n\t\t\t\tdescribedBy={ getDescribedBy() }\n\t\t\t\toptions={ selectOptions }\n\t\t\t\tvalue={ currentSelection }\n\t\t\t\tonChange={ ( { selectedItem } ) =>\n\t\t\t\t\tonChange( selectedItem.style )\n\t\t\t\t}\n\t\t\t/>\n\t\t)\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { CustomSelectControl } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { getFontStylesAndWeights } from '../../utils/get-font-styles-and-weights';\n\n/**\n * Adjusts font appearance field label in case either font styles or weights\n * are disabled.\n *\n * @param {boolean} hasFontStyles  Whether font styles are enabled and present.\n * @param {boolean} hasFontWeights Whether font weights are enabled and present.\n * @return {string} A label representing what font appearance is being edited.\n */\nconst getFontAppearanceLabel = ( hasFontStyles, hasFontWeights ) => {\n\tif ( ! hasFontStyles ) {\n\t\treturn __( 'Font weight' );\n\t}\n\n\tif ( ! hasFontWeights ) {\n\t\treturn __( 'Font style' );\n\t}\n\n\treturn __( 'Appearance' );\n};\n\n/**\n * Control to display font style and weight options of the active font.\n *\n * @param {Object} props Component props.\n *\n * @return {Element} Font appearance control.\n */\nexport default function FontAppearanceControl( props ) {\n\tconst {\n\t\t/**\n\t\t * Start opting into the larger default height that will become the default size in a future version.\n\t\t *\n\t\t * @deprecated Default behavior since WordPress 7.1. Prop can be safely removed.\n\t\t */\n\t\t__next40pxDefaultSize: _next40pxDefaultSize,\n\t\tonChange,\n\t\thasFontStyles = true,\n\t\thasFontWeights = true,\n\t\tfontFamilyFaces,\n\t\tvalue: { fontStyle, fontWeight },\n\t\t...otherProps\n\t} = props;\n\tconst hasStylesOrWeights = hasFontStyles || hasFontWeights;\n\tconst label = getFontAppearanceLabel( hasFontStyles, hasFontWeights );\n\tconst defaultOption = {\n\t\tkey: 'default',\n\t\tname: __( 'Default' ),\n\t\tstyle: { fontStyle: undefined, fontWeight: undefined },\n\t};\n\tconst { fontStyles, fontWeights, combinedStyleAndWeightOptions } =\n\t\tgetFontStylesAndWeights( fontFamilyFaces );\n\n\t// Generates select options for combined font styles and weights.\n\tconst combineOptions = () => {\n\t\tconst combinedOptions = [ defaultOption ];\n\t\tif ( combinedStyleAndWeightOptions ) {\n\t\t\tcombinedOptions.push( ...combinedStyleAndWeightOptions );\n\t\t}\n\t\treturn combinedOptions;\n\t};\n\n\t// Generates select options for font styles only.\n\tconst styleOptions = () => {\n\t\tconst combinedOptions = [ defaultOption ];\n\t\tfontStyles.forEach( ( { name, value } ) => {\n\t\t\tcombinedOptions.push( {\n\t\t\t\tkey: value,\n\t\t\t\tname,\n\t\t\t\tstyle: { fontStyle: value, fontWeight: undefined },\n\t\t\t} );\n\t\t} );\n\t\treturn combinedOptions;\n\t};\n\n\t// Generates select options for font weights only.\n\tconst weightOptions = () => {\n\t\tconst combinedOptions = [ defaultOption ];\n\t\tfontWeights.forEach( ( { name, value } ) => {\n\t\t\tcombinedOptions.push( {\n\t\t\t\tkey: value,\n\t\t\t\tname,\n\t\t\t\tstyle: { fontStyle: undefined, fontWeight: value },\n\t\t\t} );\n\t\t} );\n\t\treturn combinedOptions;\n\t};\n\n\t// Map font styles and weights to select options.\n\tconst selectOptions = useMemo( () => {\n\t\t// Display combined available font style and weight options.\n\t\tif ( hasFontStyles && hasFontWeights ) {\n\t\t\treturn combineOptions();\n\t\t}\n\n\t\t// Display only font style options or font weight options.\n\t\treturn hasFontStyles ? styleOptions() : weightOptions();\n\t}, [\n\t\tprops.options,\n\t\tfontStyles,\n\t\tfontWeights,\n\t\tcombinedStyleAndWeightOptions,\n\t] );\n\n\t// Find current selection by comparing font style & weight against options,\n\t// and fall back to the Default option if there is no matching option.\n\tconst currentSelection =\n\t\tselectOptions.find(\n\t\t\t( option ) =>\n\t\t\t\toption.style.fontStyle === fontStyle &&\n\t\t\t\toption.style.fontWeight === fontWeight\n\t\t) || selectOptions[ 0 ];\n\n\t// Adjusts screen reader description based on styles or weights.\n\tconst getDescribedBy = () => {\n\t\tif ( ! currentSelection ) {\n\t\t\treturn __( 'No selected font appearance' );\n\t\t}\n\n\t\tif ( ! hasFontStyles ) {\n\t\t\treturn sprintf(\n\t\t\t\t// translators: %s: Currently selected font weight.\n\t\t\t\t__( 'Currently selected font weight: %s' ),\n\t\t\t\tcurrentSelection.name\n\t\t\t);\n\t\t}\n\n\t\tif ( ! hasFontWeights ) {\n\t\t\treturn sprintf(\n\t\t\t\t// translators: %s: Currently selected font style.\n\t\t\t\t__( 'Currently selected font style: %s' ),\n\t\t\t\tcurrentSelection.name\n\t\t\t);\n\t\t}\n\n\t\treturn sprintf(\n\t\t\t// translators: %s: Currently selected font appearance.\n\t\t\t__( 'Currently selected font appearance: %s' ),\n\t\t\tcurrentSelection.name\n\t\t);\n\t};\n\n\treturn (\n\t\thasStylesOrWeights && (\n\t\t\t<CustomSelectControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\tclassName=\"components-font-appearance-control\"\n\t\t\t\tlabel={ label }\n\t\t\t\tdescribedBy={ getDescribedBy() }\n\t\t\t\toptions={ selectOptions }\n\t\t\t\tvalue={ currentSelection }\n\t\t\t\tonChange={ ( { selectedItem } ) =>\n\t\t\t\t\tonChange( selectedItem.style )\n\t\t\t\t}\n\t\t\t/>\n\t\t)\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/font-family/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/font-family/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { CustomSelectControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\n\nexport default function FontFamilyControl( {\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @deprecated Default behavior since WordPress 7.1. Prop can be safely removed.\n\t */\n\t__next40pxDefaultSize: _next40pxDefaultSize,\n\tvalue = '',\n\tonChange,\n\tfontFamilies,\n\tclassName,\n\t...props\n} ) {\n\tconst [ blockLevelFontFamilies ] = useSettings( 'typography.fontFamilies' );\n\tif ( ! fontFamilies ) {\n\t\tfontFamilies = blockLevelFontFamilies;\n\t}\n\n\tif ( ! fontFamilies || fontFamilies.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst options = [\n\t\t{\n\t\t\tkey: '',\n\t\t\tname: __( 'Default' ),\n\t\t},\n\t\t...fontFamilies.map( ( { fontFamily, name } ) => ( {\n\t\t\tkey: fontFamily,\n\t\t\tname: name || fontFamily,\n\t\t\tstyle: { fontFamily },\n\t\t} ) ),\n\t];\n\n\tconst selectedValue =\n\t\toptions.find( ( option ) => option.key === value ) ?? '';\n\treturn (\n\t\t<CustomSelectControl\n\t\t\tlabel={ __( 'Font' ) }\n\t\t\tvalue={ selectedValue }\n\t\t\tonChange={ ( { selectedItem } ) => onChange( selectedItem.key ) }\n\t\t\toptions={ options }\n\t\t\tclassName={ clsx( 'block-editor-font-family-control', className ) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,2BAA2B;AACpC,SAAS,UAAU;AAKnB,SAAS,mBAAmB;AAuC1B;AArCa,SAAR,kBAAoC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAM1C,uBAAuB;AAAA,EACvB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAAI;AACH,QAAM,CAAE,sBAAuB,IAAI,YAAa,yBAA0B;AAC1E,MAAK,CAAE,cAAe;AACrB,mBAAe;AAAA,EAChB;AAEA,MAAK,CAAE,gBAAgB,aAAa,WAAW,GAAI;AAClD,WAAO;AAAA,EACR;AAEA,QAAM,UAAU;AAAA,IACf;AAAA,MACC,KAAK;AAAA,MACL,MAAM,GAAI,SAAU;AAAA,IACrB;AAAA,IACA,GAAG,aAAa,IAAK,CAAE,EAAE,YAAY,KAAK,OAAS;AAAA,MAClD,KAAK;AAAA,MACL,MAAM,QAAQ;AAAA,MACd,OAAO,EAAE,WAAW;AAAA,IACrB,EAAI;AAAA,EACL;AAEA,QAAM,gBACL,QAAQ,KAAM,CAAE,WAAY,OAAO,QAAQ,KAAM,KAAK;AACvD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ,GAAI,MAAO;AAAA,MACnB,OAAQ;AAAA,MACR,UAAW,CAAE,EAAE,aAAa,MAAO,SAAU,aAAa,GAAI;AAAA,MAC9D;AAAA,MACA,WAAY,KAAM,oCAAoC,SAAU;AAAA,MAC9D,GAAG;AAAA;AAAA,EACN;AAEF;",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { CustomSelectControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useSettings } from '../use-settings';\n\nexport default function FontFamilyControl( {\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @deprecated Default behavior since WordPress 7.1. Prop can be safely removed.\n\t */\n\t__next40pxDefaultSize: _next40pxDefaultSize,\n\tvalue = '',\n\tonChange,\n\tfontFamilies,\n\tclassName,\n\t...props\n} ) {\n\tconst [ blockLevelFontFamilies ] = useSettings( 'typography.fontFamilies' );\n\tif ( ! fontFamilies ) {\n\t\tfontFamilies = blockLevelFontFamilies;\n\t}\n\n\tif ( ! fontFamilies || fontFamilies.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst options = [\n\t\t{\n\t\t\tkey: '',\n\t\t\tname: __( 'Default' ),\n\t\t},\n\t\t...fontFamilies.map( ( { fontFamily, name } ) => ( {\n\t\t\tkey: fontFamily,\n\t\t\tname: name || fontFamily,\n\t\t\tstyle: { fontFamily },\n\t\t} ) ),\n\t];\n\n\tconst selectedValue =\n\t\toptions.find( ( option ) => option.key === value ) ?? '';\n\treturn (\n\t\t<CustomSelectControl\n\t\t\tlabel={ __( 'Font' ) }\n\t\t\tvalue={ selectedValue }\n\t\t\tonChange={ ( { selectedItem } ) => onChange( selectedItem.key ) }\n\t\t\toptions={ options }\n\t\t\tclassName={ clsx( 'block-editor-font-family-control', className ) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,2BAA2B;AACpC,SAAS,UAAU;AACnB,SAAS,mBAAmB;AAuC1B;AArCa,SAAR,kBAAoC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAM1C,uBAAuB;AAAA,EACvB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAAI;AACH,QAAM,CAAE,sBAAuB,IAAI,YAAa,yBAA0B;AAC1E,MAAK,CAAE,cAAe;AACrB,mBAAe;AAAA,EAChB;AAEA,MAAK,CAAE,gBAAgB,aAAa,WAAW,GAAI;AAClD,WAAO;AAAA,EACR;AAEA,QAAM,UAAU;AAAA,IACf;AAAA,MACC,KAAK;AAAA,MACL,MAAM,GAAI,SAAU;AAAA,IACrB;AAAA,IACA,GAAG,aAAa,IAAK,CAAE,EAAE,YAAY,KAAK,OAAS;AAAA,MAClD,KAAK;AAAA,MACL,MAAM,QAAQ;AAAA,MACd,OAAO,EAAE,WAAW;AAAA,IACrB,EAAI;AAAA,EACL;AAEA,QAAM,gBACL,QAAQ,KAAM,CAAE,WAAY,OAAO,QAAQ,KAAM,KAAK;AACvD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ,GAAI,MAAO;AAAA,MACnB,OAAQ;AAAA,MACR,UAAW,CAAE,EAAE,aAAa,MAAO,SAAU,aAAa,GAAI;AAAA,MAC9D;AAAA,MACA,WAAY,KAAM,oCAAoC,SAAU;AAAA,MAC9D,GAAG;AAAA;AAAA,EACN;AAEF;",
   "names": []
 }

package/build-module/components/font-sizes/font-size-picker.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/font-sizes/font-size-picker.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { FontSizePicker as BaseFontSizePicker } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\n\nfunction FontSizePicker( props ) {\n\tconst [ fontSizes, customFontSize ] = useSettings(\n\t\t'typography.fontSizes',\n\t\t'typography.customFontSize'\n\t);\n\n\treturn (\n\t\t<BaseFontSizePicker\n\t\t\t{ ...props }\n\t\t\tfontSizes={ fontSizes }\n\t\t\tdisableCustomFontSizes={ ! customFontSize }\n\t\t/>\n\t);\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/font-sizes/README.md\n */\nexport default FontSizePicker;\n"],
-  "mappings": ";AAGA,SAAS,kBAAkB,0BAA0B;AAKrD,SAAS,mBAAmB;AAS1B;AAPF,SAAS,eAAgB,OAAQ;AAChC,QAAM,CAAE,WAAW,cAAe,IAAI;AAAA,IACrC;AAAA,IACA;AAAA,EACD;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACL;AAAA,MACA,wBAAyB,CAAE;AAAA;AAAA,EAC5B;AAEF;AAKA,IAAO,2BAAQ;",
+  "sourcesContent": ["import { FontSizePicker as BaseFontSizePicker } from '@wordpress/components';\nimport { useSettings } from '../use-settings';\n\nfunction FontSizePicker( props ) {\n\tconst [ fontSizes, customFontSize ] = useSettings(\n\t\t'typography.fontSizes',\n\t\t'typography.customFontSize'\n\t);\n\n\treturn (\n\t\t<BaseFontSizePicker\n\t\t\t{ ...props }\n\t\t\tfontSizes={ fontSizes }\n\t\t\tdisableCustomFontSizes={ ! customFontSize }\n\t\t/>\n\t);\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/font-sizes/README.md\n */\nexport default FontSizePicker;\n"],
+  "mappings": ";AAAA,SAAS,kBAAkB,0BAA0B;AACrD,SAAS,mBAAmB;AAS1B;AAPF,SAAS,eAAgB,OAAQ;AAChC,QAAM,CAAE,WAAW,cAAe,IAAI;AAAA,IACrC;AAAA,IACA;AAAA,EACD;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACL;AAAA,MACA,wBAAyB,CAAE;AAAA;AAAA,EAC5B;AAEF;AAKA,IAAO,2BAAQ;",
   "names": []
 }

package/build-module/components/font-sizes/utils.mjs

@@ -1,7 +1,5 @@
 // packages/block-editor/src/components/font-sizes/utils.js
-import { privateApis as componentsPrivateApis } from "@wordpress/components";
-import { unlock } from "../../lock-unlock.mjs";
-var { kebabCase } = unlock(componentsPrivateApis);
+import { kebabCase } from "@wordpress/kebab-case";
 var getFontSize = (fontSizes, fontSizeAttribute, customFontSizeAttribute) => {
   if (fontSizeAttribute) {
     const fontSizeObject = fontSizes?.find(

package/build-module/components/font-sizes/utils.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/font-sizes/utils.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis as componentsPrivateApis } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { kebabCase } = unlock( componentsPrivateApis );\n\n/**\n *  Returns the font size object based on an array of named font sizes and the namedFontSize and customFontSize values.\n * \tIf namedFontSize is undefined or not found in fontSizes an object with just the size value based on customFontSize is returned.\n *\n * @param {Array}   fontSizes               Array of font size objects containing at least the \"name\" and \"size\" values as properties.\n * @param {?string} fontSizeAttribute       Content of the font size attribute (slug).\n * @param {?number} customFontSizeAttribute Contents of the custom font size attribute (value).\n *\n * @return {?Object} If fontSizeAttribute is set and an equal slug is found in fontSizes it returns the font size object for that slug.\n * \t\t\t\t\t Otherwise, an object with just the size value based on customFontSize is returned.\n */\nexport const getFontSize = (\n\tfontSizes,\n\tfontSizeAttribute,\n\tcustomFontSizeAttribute\n) => {\n\tif ( fontSizeAttribute ) {\n\t\tconst fontSizeObject = fontSizes?.find(\n\t\t\t( { slug } ) => slug === fontSizeAttribute\n\t\t);\n\t\tif ( fontSizeObject ) {\n\t\t\treturn fontSizeObject;\n\t\t}\n\t}\n\treturn {\n\t\tsize: customFontSizeAttribute,\n\t};\n};\n\n/**\n * Returns the corresponding font size object for a given value.\n *\n * @param {Array}  fontSizes Array of font size objects.\n * @param {number} value     Font size value.\n *\n * @return {Object} Font size object.\n */\nexport function getFontSizeObjectByValue( fontSizes, value ) {\n\tconst fontSizeObject = fontSizes?.find( ( { size } ) => size === value );\n\tif ( fontSizeObject ) {\n\t\treturn fontSizeObject;\n\t}\n\n\treturn {\n\t\tsize: value,\n\t};\n}\n\n/**\n * Returns a class based on fontSizeName.\n *\n * @param {string} fontSizeSlug Slug of the fontSize.\n *\n * @return {string | undefined} String with the class corresponding to the fontSize passed.\n *                  The class is generated by appending 'has-' followed by fontSizeSlug in kebabCase and ending with '-font-size'.\n */\nexport function getFontSizeClass( fontSizeSlug ) {\n\tif ( ! fontSizeSlug ) {\n\t\treturn;\n\t}\n\n\treturn `has-${ kebabCase( fontSizeSlug ) }-font-size`;\n}\n"],
-  "mappings": ";AAGA,SAAS,eAAe,6BAA6B;AAKrD,SAAS,cAAc;AAEvB,IAAM,EAAE,UAAU,IAAI,OAAQ,qBAAsB;AAa7C,IAAM,cAAc,CAC1B,WACA,mBACA,4BACI;AACJ,MAAK,mBAAoB;AACxB,UAAM,iBAAiB,WAAW;AAAA,MACjC,CAAE,EAAE,KAAK,MAAO,SAAS;AAAA,IAC1B;AACA,QAAK,gBAAiB;AACrB,aAAO;AAAA,IACR;AAAA,EACD;AACA,SAAO;AAAA,IACN,MAAM;AAAA,EACP;AACD;AAUO,SAAS,yBAA0B,WAAW,OAAQ;AAC5D,QAAM,iBAAiB,WAAW,KAAM,CAAE,EAAE,KAAK,MAAO,SAAS,KAAM;AACvE,MAAK,gBAAiB;AACrB,WAAO;AAAA,EACR;AAEA,SAAO;AAAA,IACN,MAAM;AAAA,EACP;AACD;AAUO,SAAS,iBAAkB,cAAe;AAChD,MAAK,CAAE,cAAe;AACrB;AAAA,EACD;AAEA,SAAO,OAAQ,UAAW,YAAa,CAAE;AAC1C;",
+  "sourcesContent": ["import { kebabCase } from '@wordpress/kebab-case';\n\n/**\n *  Returns the font size object based on an array of named font sizes and the namedFontSize and customFontSize values.\n * \tIf namedFontSize is undefined or not found in fontSizes an object with just the size value based on customFontSize is returned.\n *\n * @param {Array}   fontSizes               Array of font size objects containing at least the \"name\" and \"size\" values as properties.\n * @param {?string} fontSizeAttribute       Content of the font size attribute (slug).\n * @param {?number} customFontSizeAttribute Contents of the custom font size attribute (value).\n *\n * @return {?Object} If fontSizeAttribute is set and an equal slug is found in fontSizes it returns the font size object for that slug.\n * \t\t\t\t\t Otherwise, an object with just the size value based on customFontSize is returned.\n */\nexport const getFontSize = (\n\tfontSizes,\n\tfontSizeAttribute,\n\tcustomFontSizeAttribute\n) => {\n\tif ( fontSizeAttribute ) {\n\t\tconst fontSizeObject = fontSizes?.find(\n\t\t\t( { slug } ) => slug === fontSizeAttribute\n\t\t);\n\t\tif ( fontSizeObject ) {\n\t\t\treturn fontSizeObject;\n\t\t}\n\t}\n\treturn {\n\t\tsize: customFontSizeAttribute,\n\t};\n};\n\n/**\n * Returns the corresponding font size object for a given value.\n *\n * @param {Array}  fontSizes Array of font size objects.\n * @param {number} value     Font size value.\n *\n * @return {Object} Font size object.\n */\nexport function getFontSizeObjectByValue( fontSizes, value ) {\n\tconst fontSizeObject = fontSizes?.find( ( { size } ) => size === value );\n\tif ( fontSizeObject ) {\n\t\treturn fontSizeObject;\n\t}\n\n\treturn {\n\t\tsize: value,\n\t};\n}\n\n/**\n * Returns a class based on fontSizeName.\n *\n * @param {string} fontSizeSlug Slug of the fontSize.\n *\n * @return {string | undefined} String with the class corresponding to the fontSize passed.\n *                  The class is generated by appending 'has-' followed by fontSizeSlug in kebabCase and ending with '-font-size'.\n */\nexport function getFontSizeClass( fontSizeSlug ) {\n\tif ( ! fontSizeSlug ) {\n\t\treturn;\n\t}\n\n\treturn `has-${ kebabCase( fontSizeSlug ) }-font-size`;\n}\n"],
+  "mappings": ";AAAA,SAAS,iBAAiB;AAanB,IAAM,cAAc,CAC1B,WACA,mBACA,4BACI;AACJ,MAAK,mBAAoB;AACxB,UAAM,iBAAiB,WAAW;AAAA,MACjC,CAAE,EAAE,KAAK,MAAO,SAAS;AAAA,IAC1B;AACA,QAAK,gBAAiB;AACrB,aAAO;AAAA,IACR;AAAA,EACD;AACA,SAAO;AAAA,IACN,MAAM;AAAA,EACP;AACD;AAUO,SAAS,yBAA0B,WAAW,OAAQ;AAC5D,QAAM,iBAAiB,WAAW,KAAM,CAAE,EAAE,KAAK,MAAO,SAAS,KAAM;AACvE,MAAK,gBAAiB;AACrB,WAAO;AAAA,EACR;AAEA,SAAO;AAAA,IACN,MAAM;AAAA,EACP;AACD;AAUO,SAAS,iBAAkB,cAAe;AAChD,MAAK,CAAE,cAAe;AACrB;AAAA,EACD;AAEA,SAAO,OAAQ,UAAW,YAAa,CAAE;AAC1C;",
   "names": []
 }

package/build-module/components/font-sizes/with-font-sizes.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/font-sizes/with-font-sizes.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent, compose } from '@wordpress/compose';\nimport { Component } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getFontSize, getFontSizeClass } from './utils';\nimport { useSettings } from '../use-settings';\n\nconst DEFAULT_FONT_SIZES = [];\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param {string} str The string whose first letter the function will capitalize.\n *\n * @return {string} Capitalized string.\n */\nconst upperFirst = ( [ firstLetter, ...rest ] ) =>\n\tfirstLetter.toUpperCase() + rest.join( '' );\n\n/**\n * Higher-order component, which handles font size logic for class generation,\n * font size value retrieval, and font size change handling.\n *\n * @param {...(Object|string)} fontSizeNames The arguments should all be strings.\n *                                           Each string contains the font size\n *                                           attribute name e.g: 'fontSize'.\n *\n * @return {Function} Higher-order component.\n */\nexport default ( ...fontSizeNames ) => {\n\t/*\n\t * Computes an object whose key is the font size attribute name as passed in the array,\n\t * and the value is the custom font size attribute name.\n\t * Custom font size is automatically compted by appending custom followed by the font size attribute name in with the first letter capitalized.\n\t */\n\tconst fontSizeAttributeNames = fontSizeNames.reduce(\n\t\t( fontSizeAttributeNamesAccumulator, fontSizeAttributeName ) => {\n\t\t\tfontSizeAttributeNamesAccumulator[\n\t\t\t\tfontSizeAttributeName\n\t\t\t] = `custom${ upperFirst( fontSizeAttributeName ) }`;\n\t\t\treturn fontSizeAttributeNamesAccumulator;\n\t\t},\n\t\t{}\n\t);\n\n\treturn createHigherOrderComponent(\n\t\tcompose( [\n\t\t\tcreateHigherOrderComponent(\n\t\t\t\t( WrappedComponent ) =>\n\t\t\t\t\tfunction WithFontSizesInner( props ) {\n\t\t\t\t\t\tconst [ fontSizes ] = useSettings(\n\t\t\t\t\t\t\t'typography.fontSizes'\n\t\t\t\t\t\t);\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\tfontSizes={ fontSizes || DEFAULT_FONT_SIZES }\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'withFontSizes'\n\t\t\t),\n\t\t\t( WrappedComponent ) => {\n\t\t\t\treturn class WithFontSizes extends Component {\n\t\t\t\t\tconstructor( props ) {\n\t\t\t\t\t\tsuper( props );\n\n\t\t\t\t\t\tthis.setters = this.createSetters();\n\n\t\t\t\t\t\tthis.state = {};\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetters() {\n\t\t\t\t\t\treturn Object.entries( fontSizeAttributeNames ).reduce(\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\t\t[\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst upperFirstFontSizeAttributeName =\n\t\t\t\t\t\t\t\t\tupperFirst( fontSizeAttributeName );\n\t\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t\t`set${ upperFirstFontSizeAttributeName }`\n\t\t\t\t\t\t\t\t] = this.createSetFontSize(\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\treturn settersAccumulator;\n\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\n\t\t\t\t\tcreateSetFontSize(\n\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn ( fontSizeValue ) => {\n\t\t\t\t\t\t\tconst fontSizeObject = this.props.fontSizes?.find(\n\t\t\t\t\t\t\t\t( { size } ) => size === Number( fontSizeValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t\t[ fontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t[ customFontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t: fontSizeValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\tstatic getDerivedStateFromProps(\n\t\t\t\t\t\t{ attributes, fontSizes },\n\t\t\t\t\t\tpreviousState\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst didAttributesChange = (\n\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tif ( previousState[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t// If new font size is name compare with the previous slug.\n\t\t\t\t\t\t\t\tif ( attributes[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ] !==\n\t\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t\t.slug\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// If font size is not named, update when the font size value changes.\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t.size !==\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t// In this case we need to build the font size object.\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! Object.values( fontSizeAttributeNames ).some(\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst newState = Object.entries(\n\t\t\t\t\t\t\tfontSizeAttributeNames\n\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.filter( ( [ key, value ] ) =>\n\t\t\t\t\t\t\t\tdidAttributesChange( value, key )\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.reduce(\n\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\tnewStateAccumulator,\n\t\t\t\t\t\t\t\t\t[\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\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\tconst fontSizeAttributeValue =\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ];\n\t\t\t\t\t\t\t\t\tconst fontSizeObject = getFontSize(\n\t\t\t\t\t\t\t\t\t\tfontSizes,\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue,\n\t\t\t\t\t\t\t\t\t\tattributes[\n\t\t\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\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\tnewStateAccumulator[\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t\t\t] = {\n\t\t\t\t\t\t\t\t\t\t...fontSizeObject,\n\t\t\t\t\t\t\t\t\t\tclass: getFontSizeClass(\n\t\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue\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\treturn newStateAccumulator;\n\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\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...previousState,\n\t\t\t\t\t\t\t...newState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\trender() {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\t\tfontSizes: undefined,\n\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t...this.setters,\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},\n\t\t] ),\n\t\t'withFontSizes'\n\t);\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { createHigherOrderComponent, compose } from '@wordpress/compose';\nimport { Component } from '@wordpress/element';\nimport { getFontSize, getFontSizeClass } from './utils';\nimport { useSettings } from '../use-settings';\n\nconst DEFAULT_FONT_SIZES = [];\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param {string} str The string whose first letter the function will capitalize.\n *\n * @return {string} Capitalized string.\n */\nconst upperFirst = ( [ firstLetter, ...rest ] ) =>\n\tfirstLetter.toUpperCase() + rest.join( '' );\n\n/**\n * Higher-order component, which handles font size logic for class generation,\n * font size value retrieval, and font size change handling.\n *\n * @param {...(Object|string)} fontSizeNames The arguments should all be strings.\n *                                           Each string contains the font size\n *                                           attribute name e.g: 'fontSize'.\n *\n * @return {Function} Higher-order component.\n */\nexport default ( ...fontSizeNames ) => {\n\t/*\n\t * Computes an object whose key is the font size attribute name as passed in the array,\n\t * and the value is the custom font size attribute name.\n\t * Custom font size is automatically compted by appending custom followed by the font size attribute name in with the first letter capitalized.\n\t */\n\tconst fontSizeAttributeNames = fontSizeNames.reduce(\n\t\t( fontSizeAttributeNamesAccumulator, fontSizeAttributeName ) => {\n\t\t\tfontSizeAttributeNamesAccumulator[\n\t\t\t\tfontSizeAttributeName\n\t\t\t] = `custom${ upperFirst( fontSizeAttributeName ) }`;\n\t\t\treturn fontSizeAttributeNamesAccumulator;\n\t\t},\n\t\t{}\n\t);\n\n\treturn createHigherOrderComponent(\n\t\tcompose( [\n\t\t\tcreateHigherOrderComponent(\n\t\t\t\t( WrappedComponent ) =>\n\t\t\t\t\tfunction WithFontSizesInner( props ) {\n\t\t\t\t\t\tconst [ fontSizes ] = useSettings(\n\t\t\t\t\t\t\t'typography.fontSizes'\n\t\t\t\t\t\t);\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\tfontSizes={ fontSizes || DEFAULT_FONT_SIZES }\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'withFontSizes'\n\t\t\t),\n\t\t\t( WrappedComponent ) => {\n\t\t\t\treturn class WithFontSizes extends Component {\n\t\t\t\t\tconstructor( props ) {\n\t\t\t\t\t\tsuper( props );\n\n\t\t\t\t\t\tthis.setters = this.createSetters();\n\n\t\t\t\t\t\tthis.state = {};\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetters() {\n\t\t\t\t\t\treturn Object.entries( fontSizeAttributeNames ).reduce(\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\t\t[\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst upperFirstFontSizeAttributeName =\n\t\t\t\t\t\t\t\t\tupperFirst( fontSizeAttributeName );\n\t\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t\t`set${ upperFirstFontSizeAttributeName }`\n\t\t\t\t\t\t\t\t] = this.createSetFontSize(\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\treturn settersAccumulator;\n\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\n\t\t\t\t\tcreateSetFontSize(\n\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn ( fontSizeValue ) => {\n\t\t\t\t\t\t\tconst fontSizeObject = this.props.fontSizes?.find(\n\t\t\t\t\t\t\t\t( { size } ) => size === Number( fontSizeValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t\t[ fontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t[ customFontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t: fontSizeValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\tstatic getDerivedStateFromProps(\n\t\t\t\t\t\t{ attributes, fontSizes },\n\t\t\t\t\t\tpreviousState\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst didAttributesChange = (\n\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tif ( previousState[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t// If new font size is name compare with the previous slug.\n\t\t\t\t\t\t\t\tif ( attributes[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ] !==\n\t\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t\t.slug\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// If font size is not named, update when the font size value changes.\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t.size !==\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t// In this case we need to build the font size object.\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! Object.values( fontSizeAttributeNames ).some(\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst newState = Object.entries(\n\t\t\t\t\t\t\tfontSizeAttributeNames\n\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.filter( ( [ key, value ] ) =>\n\t\t\t\t\t\t\t\tdidAttributesChange( value, key )\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.reduce(\n\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\tnewStateAccumulator,\n\t\t\t\t\t\t\t\t\t[\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\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\tconst fontSizeAttributeValue =\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ];\n\t\t\t\t\t\t\t\t\tconst fontSizeObject = getFontSize(\n\t\t\t\t\t\t\t\t\t\tfontSizes,\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue,\n\t\t\t\t\t\t\t\t\t\tattributes[\n\t\t\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\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\tnewStateAccumulator[\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t\t\t] = {\n\t\t\t\t\t\t\t\t\t\t...fontSizeObject,\n\t\t\t\t\t\t\t\t\t\tclass: getFontSizeClass(\n\t\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue\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\treturn newStateAccumulator;\n\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\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...previousState,\n\t\t\t\t\t\t\t...newState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\trender() {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\t\tfontSizes: undefined,\n\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t...this.setters,\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},\n\t\t] ),\n\t\t'withFontSizes'\n\t);\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/global-styles/advanced-panel.mjs

@@ -1,5 +1,8 @@
 // packages/block-editor/src/components/global-styles/advanced-panel.js
-import { TextareaControl, Notice } from "@wordpress/components";
+import {
+  TextareaControl as WCTextareaControl,
+  Notice
+} from "@wordpress/components";
 import { Stack } from "@wordpress/ui";
 import { useState } from "@wordpress/element";
 import { __ } from "@wordpress/i18n";
@@ -57,7 +60,7 @@ function AdvancedPanel({
       children: [
         cssError && /* @__PURE__ */ jsx(Notice, { status: "error", onRemove: () => setCSSError(null), children: cssError }),
         /* @__PURE__ */ jsx(
-          TextareaControl,
+          WCTextareaControl,
           {
             label: __("Additional CSS"),
             value: customCSS,