npm - @wordpress/block-editor - Versions diffs - 17.0.0 → 17.1.1-next.v.202609031004.0 - Mend

@wordpress/block-editor 17.0.0 → 17.1.1-next.v.202609031004.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1802) hide show

package/build/components/dimensions-tool/index.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/dimensions-tool/index.js"],
+  "sources": ["../../../src/components/dimensions-tool/index.jsx"],
   "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": ["AspectRatioTool", "WidthHeightTool", "ScaleTool"]

package/build/components/dimensions-tool/scale-tool.cjs CHANGED Viewed

@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/dimensions-tool/scale-tool.js
+// packages/block-editor/src/components/dimensions-tool/scale-tool.jsx
 var scale_tool_exports = {};
 __export(scale_tool_exports, {
   default: () => ScaleTool

package/build/components/dimensions-tool/scale-tool.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/dimensions-tool/scale-tool.js"],
+  "sources": ["../../../src/components/dimensions-tool/scale-tool.jsx"],
   "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;AAAA;AAAA;AAAA;AAAA,wBAIO;AACP,qBAAwB;AACxB,kBAAuB;AAwGlB;AAzFL,IAAM,wBAAwB;AAAA,EAC7B;AAAA,IACC,OAAO;AAAA,IACP,WAAO,gBAAI,QAAQ,qCAAsC;AAAA,IACzD,UAAM,gBAAI,2CAA4C;AAAA,EACvD;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,WAAO,gBAAI,WAAW,qCAAsC;AAAA,IAC5D,UAAM,gBAAI,gDAAiD;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,WAAO,gBAAI,SAAS,qCAAsC;AAAA,IAC1D,UAAM,gBAAI,8CAA+C;AAAA,EAC1D;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,WAAO,gBAAI,QAAQ,qCAAsC;AAAA,IACzD,UAAM;AAAA,MACL;AAAA,IACD;AAAA,EACD;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,WAAO,gBAAI,cAAc,qCAAsC;AAAA,IAC/D,UAAM;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,gBAAY,wBAAS,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,kBAAAA;AAAA,IAAA;AAAA,MACA,WAAQ,gBAAI,SAAS,uBAAwB;AAAA,MAC7C;AAAA,MACA,UAAW,MAAM,iBAAiB;AAAA,MAClC,YAAa,MAAM,SAAU,YAAa;AAAA,MAC1C;AAAA,MAEA;AAAA,QAAC,kBAAAC;AAAA,QAAA;AAAA,UACA,WAAQ,gBAAI,SAAS,uBAAwB;AAAA,UAC7C,SAAO;AAAA,UACP,MAAO,UAAW,YAAa;AAAA,UAC/B,OAAQ;AAAA,UACR;AAAA,UAEE,kBAAQ,IAAK,CAAE,WAChB;AAAA,YAAC,kBAAAC;AAAA,YAAA;AAAA,cAEE,GAAG;AAAA;AAAA,YADC,OAAO;AAAA,UAEd,CACC;AAAA;AAAA,MACH;AAAA;AAAA,EACD;AAEF;",
   "names": ["ToolsPanelItem", "ToggleGroupControl", "ToggleGroupControlOption"]

package/build/components/dimensions-tool/width-height-tool.cjs CHANGED Viewed

@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/dimensions-tool/width-height-tool.js
+// packages/block-editor/src/components/dimensions-tool/width-height-tool.jsx
 var width_height_tool_exports = {};
 __export(width_height_tool_exports, {
   default: () => WidthHeightTool

package/build/components/dimensions-tool/width-height-tool.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/dimensions-tool/width-height-tool.js"],
+  "sources": ["../../../src/components/dimensions-tool/width-height-tool.jsx"],
   "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;AAAA;AAAA;AAAA;AAAA,wBAGO;AACP,kBAAmB;AAyDjB;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,4EACC;AAAA;AAAA,MAAC,kBAAAA;AAAA,MAAA;AAAA,QACA,OAAQ,EAAE,YAAY,SAAS;AAAA,QAC/B,WAAQ,gBAAI,OAAQ;AAAA,QACpB;AAAA,QACA,UAAW,MAAM,UAAU;AAAA,QAC3B,YAAa,kBAAmB,OAAQ;AAAA,QACxC;AAAA,QAEA;AAAA,UAAC,kBAAAC;AAAA,UAAA;AAAA,YACA,WAAQ,gBAAI,OAAQ;AAAA,YACpB,iBAAc,gBAAI,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,kBAAAD;AAAA,MAAA;AAAA,QACA,OAAQ,EAAE,YAAY,SAAS;AAAA,QAC/B,WAAQ,gBAAI,QAAS;AAAA,QACrB;AAAA,QACA,UAAW,MAAM,WAAW;AAAA,QAC5B,YAAa,kBAAmB,QAAS;AAAA,QACzC;AAAA,QAEA;AAAA,UAAC,kBAAAC;AAAA,UAAA;AAAA,YACA,WAAQ,gBAAI,QAAS;AAAA,YACrB,iBAAc,gBAAI,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": ["ToolsPanelItem", "UnitControl"]

package/build/components/duotone-control/index.cjs CHANGED Viewed

@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/duotone-control/index.js
+// packages/block-editor/src/components/duotone-control/index.jsx
 var duotone_control_exports = {};
 __export(duotone_control_exports, {
   default: () => duotone_control_default

package/build/components/duotone-control/index.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/duotone-control/index.js"],
+  "sources": ["../../../src/components/duotone-control/index.jsx"],
   "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;AAAA;AAAA;AAAA;AAAA,wBAOO;AACP,kBAAmB;AACnB,sBAAqB;AACrB,mBAA6B;AAC7B,qBAA8B;AAe3B;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,4CAAC,oCAAe,WAAU,iDAAgD;AAAA,EAE5E,WAAY,OAAQ;AACnB,kBAAc,4CAAC,mCAAc,QAAS,OAAQ;AAAA,EAC/C,OAAO;AACN,kBAAc,4CAAC,qBAAK,MAAO,qBAAS;AAAA,EACrC;AAEA,QAAM,kBAAc,gBAAI,sBAAuB;AAC/C,QAAM,SAAK,8BAAe,gBAAgB,mBAAmB,MAAO;AACpE,QAAM,gBAAgB,GAAI,EAAG;AAE7B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,cAAe;AAAA,QACd,WAAW;AAAA,QACX,iBAAa,gBAAI,SAAU;AAAA,MAC5B;AAAA,MACA,cAAe,CAAE,EAAE,QAAQ,SAAS,MAAO;AAC1C,cAAM,kBAAkB,CAAE,UAAW;AACpC,cAAK,CAAE,UAAU,MAAM,YAAY,sBAAO;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,6CAAC,+BAAU,WAAQ,gBAAI,SAAU,GAChC;AAAA,oDAAC,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/components/editable-text/index.cjs CHANGED Viewed

@@ -27,7 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/editable-text/index.js
+// packages/block-editor/src/components/editable-text/index.jsx
 var editable_text_exports = {};
 __export(editable_text_exports, {
   default: () => editable_text_default

package/build/components/editable-text/index.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/editable-text/index.js"],
+  "sources": ["../../../src/components/editable-text/index.jsx"],
   "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;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA2B;AAC3B,uBAAqB;AAGb;AADR,IAAM,mBAAe,2BAAY,CAAE,OAAO,QAAS;AAClD,SAAO,4CAAC,iBAAAA,SAAA,EAAS,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,4CAAC,OAAM,GAAG,OAAU,iBAAO;AACnC;AAKA,IAAO,wBAAQ;",
   "names": ["RichText"]

package/build/components/editor-styles/index.cjs CHANGED Viewed

@@ -27,7 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/editor-styles/index.js
+// packages/block-editor/src/components/editor-styles/index.jsx
 var editor_styles_exports = {};
 __export(editor_styles_exports, {
   default: () => editor_styles_default

package/build/components/editor-styles/index.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/editor-styles/index.js"],
+  "sources": ["../../../src/components/editor-styles/index.jsx"],
   "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": "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",
   "names": ["namesPlugin", "a11yPlugin", "blockEditorStore", "transformStyles"]

package/build/components/fit-text-size-warning/index.cjs CHANGED Viewed

@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/fit-text-size-warning/index.js
+// packages/block-editor/src/components/fit-text-size-warning/index.jsx
 var fit_text_size_warning_exports = {};
 __export(fit_text_size_warning_exports, {
   default: () => FitTextSizeWarning

package/build/components/fit-text-size-warning/index.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/fit-text-size-warning/index.js"],
+  "sources": ["../../../src/components/fit-text-size-warning/index.jsx"],
   "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;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA0B;AAC1B,kBAAmB;AACnB,wBAAuB;AACvB,kBAAsB;AAsBnB;AAdY,SAAR,qBAAsC;AAC5C,QAAM,cAAU;AAAA,IACf;AAAA,EACD;AAKA,gCAAW,MAAM;AAChB,2BAAO,OAAQ;AAAA,EAChB,GAAG,CAAE,OAAQ,CAAE;AAEf,SACC,4CAAC,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/components/font-appearance-control/index.cjs CHANGED Viewed

@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/font-appearance-control/index.js
+// packages/block-editor/src/components/font-appearance-control/index.jsx
 var font_appearance_control_exports = {};
 __export(font_appearance_control_exports, {
   default: () => FontAppearanceControl

package/build/components/font-appearance-control/index.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/font-appearance-control/index.js"],
+  "sources": ["../../../src/components/font-appearance-control/index.jsx"],
   "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/components/font-family/index.cjs CHANGED Viewed

@@ -27,7 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/font-family/index.js
+// packages/block-editor/src/components/font-family/index.jsx
 var font_family_exports = {};
 __export(font_family_exports, {
   default: () => FontFamilyControl

package/build/components/font-family/index.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/font-family/index.js"],
+  "sources": ["../../../src/components/font-family/index.jsx"],
   "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;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAiB;AACjB,wBAAoC;AACpC,kBAAmB;AACnB,0BAA4B;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,QAAI,iCAAa,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,UAAM,gBAAI,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,WAAQ,gBAAI,MAAO;AAAA,MACnB,OAAQ;AAAA,MACR,UAAW,CAAE,EAAE,aAAa,MAAO,SAAU,aAAa,GAAI;AAAA,MAC9D;AAAA,MACA,eAAY,YAAAA,SAAM,oCAAoC,SAAU;AAAA,MAC9D,GAAG;AAAA;AAAA,EACN;AAEF;",
   "names": ["clsx"]

package/build/components/font-sizes/font-size-picker.cjs CHANGED Viewed

@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/font-sizes/font-size-picker.js
+// packages/block-editor/src/components/font-sizes/font-size-picker.jsx
 var font_size_picker_exports = {};
 __export(font_size_picker_exports, {
   default: () => font_size_picker_default

package/build/components/font-sizes/font-size-picker.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/font-sizes/font-size-picker.js"],
+  "sources": ["../../../src/components/font-sizes/font-size-picker.jsx"],
   "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;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAqD;AACrD,0BAA4B;AAS1B;AAPF,SAAS,eAAgB,OAAQ;AAChC,QAAM,CAAE,WAAW,cAAe,QAAI;AAAA,IACrC;AAAA,IACA;AAAA,EACD;AAEA,SACC;AAAA,IAAC,kBAAAA;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACL;AAAA,MACA,wBAAyB,CAAE;AAAA;AAAA,EAC5B;AAEF;AAKA,IAAO,2BAAQ;",
   "names": ["BaseFontSizePicker"]

package/build/components/font-sizes/with-font-sizes.cjs CHANGED Viewed

@@ -17,7 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/font-sizes/with-font-sizes.js
+// packages/block-editor/src/components/font-sizes/with-font-sizes.jsx
 var with_font_sizes_exports = {};
 __export(with_font_sizes_exports, {
   default: () => with_font_sizes_default

package/build/components/font-sizes/with-font-sizes.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/font-sizes/with-font-sizes.js"],
+  "sources": ["../../../src/components/font-sizes/with-font-sizes.jsx"],
   "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/components/global-styles/advanced-panel.cjs CHANGED Viewed

@@ -27,7 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/global-styles/advanced-panel.js
+// packages/block-editor/src/components/global-styles/advanced-panel.jsx
 var advanced_panel_exports = {};
 __export(advanced_panel_exports, {
   default: () => AdvancedPanel,

package/build/components/global-styles/advanced-panel.cjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/global-styles/advanced-panel.js"],
+  "sources": ["../../../src/components/global-styles/advanced-panel.jsx"],
   "sourcesContent": ["import {\n\tTextareaControl as WCTextareaControl,\n\tNotice,\n} from '@wordpress/components';\nimport { Stack } from '@wordpress/ui';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { default as transformStyles } from '../../utils/transform-styles';\n\n/**\n * Validates that a CSS string doesn't contain HTML markup.\n * Uses the same validation as the PHP/global styles REST API.\n *\n * @param {string} css The CSS string to validate.\n * @return {boolean} True if the CSS is valid, false otherwise.\n */\nexport function validateCSS( css ) {\n\t// Check for HTML markup.\n\tif ( typeof css === 'string' && /<\\/?\\w/.test( css ) ) {\n\t\treturn false;\n\t}\n\treturn true;\n}\n\n/**\n * Returns the error message string if the CSS contains HTML markup, or null if it is clean.\n *\n * @param {string} css The CSS string to check.\n * @return {string|null} An error message, or null if the CSS is valid.\n */\nfunction getMarkupValidationError( css ) {\n\treturn validateCSS( css )\n\t\t? null\n\t\t: __( 'The custom CSS is invalid. Do not use <> markup.' );\n}\n\n/**\n * Full CSS validation: markup check first (fast), then a CSS parser (slower).\n *\n * @param {string} css The CSS string to validate.\n * @return {string|null} An error message, or null if the CSS is valid.\n */\nfunction getCSSValidationError( css ) {\n\tif ( ! css ) {\n\t\treturn null;\n\t}\n\tconst markupError = getMarkupValidationError( css );\n\tif ( markupError ) {\n\t\treturn markupError;\n\t}\n\tconst [ transformed ] = transformStyles(\n\t\t[ { css } ],\n\t\t'.for-validation-only'\n\t);\n\treturn transformed === null\n\t\t? __( 'There is an error with your CSS structure.' )\n\t\t: null;\n}\n\nexport default function AdvancedPanel( {\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\thelp,\n} ) {\n\t// Custom CSS\n\tconst customCSS = inheritedValue?.css;\n\tconst [ cssError, setCSSError ] = useState( () =>\n\t\tgetCSSValidationError( customCSS )\n\t);\n\tfunction handleOnChange( newValue ) {\n\t\tonChange( {\n\t\t\t...value,\n\t\t\tcss: newValue,\n\t\t} );\n\n\t\tsetCSSError( getMarkupValidationError( newValue ) );\n\t}\n\tfunction handleOnBlur( event ) {\n\t\tsetCSSError( getCSSValidationError( event?.target?.value ) );\n\t}\n\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"column\"\n\t\t\tgap=\"md\"\n\t\t\tclassName=\"block-editor-global-styles-advanced-panel\"\n\t\t>\n\t\t\t{ cssError && (\n\t\t\t\t<Notice status=\"error\" onRemove={ () => setCSSError( null ) }>\n\t\t\t\t\t{ cssError }\n\t\t\t\t</Notice>\n\t\t\t) }\n\t\t\t<WCTextareaControl\n\t\t\t\tlabel={ __( 'Additional CSS' ) }\n\t\t\t\tvalue={ customCSS }\n\t\t\t\tonChange={ ( newValue ) => handleOnChange( newValue ) }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tclassName=\"block-editor-global-styles-advanced-panel__custom-css-input\"\n\t\t\t\tspellCheck={ false }\n\t\t\t\thelp={ help }\n\t\t\t/>\n\t\t</Stack>\n\t);\n}\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAGO;AACP,gBAAsB;AACtB,qBAAyB;AACzB,kBAAmB;AACnB,8BAA2C;AA4EzC;AAnEK,SAAS,YAAa,KAAM;AAElC,MAAK,OAAO,QAAQ,YAAY,SAAS,KAAM,GAAI,GAAI;AACtD,WAAO;AAAA,EACR;AACA,SAAO;AACR;AAQA,SAAS,yBAA0B,KAAM;AACxC,SAAO,YAAa,GAAI,IACrB,WACA,gBAAI,kDAAmD;AAC3D;AAQA,SAAS,sBAAuB,KAAM;AACrC,MAAK,CAAE,KAAM;AACZ,WAAO;AAAA,EACR;AACA,QAAM,cAAc,yBAA0B,GAAI;AAClD,MAAK,aAAc;AAClB,WAAO;AAAA,EACR;AACA,QAAM,CAAE,WAAY,QAAI,wBAAAA;AAAA,IACvB,CAAE,EAAE,IAAI,CAAE;AAAA,IACV;AAAA,EACD;AACA,SAAO,gBAAgB,WACpB,gBAAI,4CAA6C,IACjD;AACJ;AAEe,SAAR,cAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AACD,GAAI;AAEH,QAAM,YAAY,gBAAgB;AAClC,QAAM,CAAE,UAAU,WAAY,QAAI;AAAA,IAAU,MAC3C,sBAAuB,SAAU;AAAA,EAClC;AACA,WAAS,eAAgB,UAAW;AACnC,aAAU;AAAA,MACT,GAAG;AAAA,MACH,KAAK;AAAA,IACN,CAAE;AAEF,gBAAa,yBAA0B,QAAS,CAAE;AAAA,EACnD;AACA,WAAS,aAAc,OAAQ;AAC9B,gBAAa,sBAAuB,OAAO,QAAQ,KAAM,CAAE;AAAA,EAC5D;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,WAAU;AAAA,MAER;AAAA,oBACD,4CAAC,4BAAO,QAAO,SAAQ,UAAW,MAAM,YAAa,IAAK,GACvD,oBACH;AAAA,QAED;AAAA,UAAC,kBAAAC;AAAA,UAAA;AAAA,YACA,WAAQ,gBAAI,gBAAiB;AAAA,YAC7B,OAAQ;AAAA,YACR,UAAW,CAAE,aAAc,eAAgB,QAAS;AAAA,YACpD,QAAS;AAAA,YACT,WAAU;AAAA,YACV,YAAa;AAAA,YACb;AAAA;AAAA,QACD;AAAA;AAAA;AAAA,EACD;AAEF;",
   "names": ["transformStyles", "WCTextareaControl"]

package/build/components/global-styles/background-panel.cjs CHANGED Viewed

@@ -27,7 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/global-styles/background-panel.js
+// packages/block-editor/src/components/global-styles/background-panel.jsx
 var background_panel_exports = {};
 __export(background_panel_exports, {
   BackgroundToolsPanel: () => BackgroundToolsPanel,

package/build/components/global-styles/background-panel.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/global-styles/background-panel.js"],
-  "sourcesContent": ["import { __experimentalToolsPanel as ToolsPanel } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport BackgroundImageControl from '../background-image-control';\nimport ColorGradientDropdownItem from './color-gradient-dropdown-item';\nimport { useHasBackgroundColorPanel } from './color-panel';\nimport { useColorGradientSettings } from './hooks';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport {\n\textractPresetSlug,\n\tencodeColorValueWithPalette,\n} from '../../utils/color-values';\nimport {\n\tgetInheritanceProps,\n\tInheritanceToolsPanelItem,\n\tisGlobalStylesInheritanceEnabled,\n} from './inheritance';\n\nconst DEFAULT_CONTROLS = {\n\tbackgroundImage: true,\n\tbackgroundColor: true,\n\tgradient: true,\n};\n\n/**\n * Checks site settings to see if the requested feature's control may be used.\n *\n * @param {Object} settings Site settings.\n * @param {string} feature  Background feature to check.\n * @return {boolean}        Whether site settings has activated background panel.\n */\nexport function useHasBackgroundControl( settings, feature ) {\n\treturn settings?.background?.[ feature ];\n}\n\n/**\n * Checks site settings to see if the background panel may be used.\n * `settings.background.backgroundSize` exists also,\n * but can only be used if settings?.background?.backgroundImage is `true`.\n *\n * The panel is also shown when the block has color panel background\n * support (`settings.color.background`), because background color and\n * the legacy `color.gradient` control are rendered here.\n *\n * @param {Object} settings Site settings\n * @return {boolean}        Whether site settings has activated background panel.\n */\nexport function useHasBackgroundPanel( settings ) {\n\tconst hasBackgroundColor = useHasBackgroundColorPanel( settings );\n\tconst { backgroundImage, gradient } = settings?.background || {};\n\treturn backgroundImage || gradient || hasBackgroundColor;\n}\n\n/**\n * Checks if there is a current value in the background size block support\n * attributes. Background size values include background size as well\n * as background position.\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background size value set.\n */\nexport function hasBackgroundSizeValue( style ) {\n\treturn (\n\t\tstyle?.background?.backgroundPosition !== undefined ||\n\t\tstyle?.background?.backgroundSize !== undefined\n\t);\n}\n\n/**\n * Checks if there is a current value in the background image block support\n * attributes.\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background image value set.\n */\nexport function hasBackgroundImageValue( style ) {\n\treturn (\n\t\t!! style?.background?.backgroundImage?.id ||\n\t\t// Supports url() string values in theme.json.\n\t\t'string' === typeof style?.background?.backgroundImage ||\n\t\t!! style?.background?.backgroundImage?.url\n\t);\n}\n\n/**\n * Checks if there is a current value in the background gradient block support\n * attributes.\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background gradient value set.\n */\nexport function hasBackgroundGradientValue( style ) {\n\treturn (\n\t\t'string' === typeof style?.background?.gradient &&\n\t\tstyle?.background?.gradient !== ''\n\t);\n}\n\n/**\n * Checks if there is a current value for the background color (written to\n * `color.background`).\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background color value set.\n */\nexport function hasBackgroundColorValue( style ) {\n\treturn !! style?.color?.background;\n}\n\n/**\n * Checks if there is a current value in the legacy `color.gradient` location\n * (used by blocks with color panel gradient support that haven't adopted the\n * `background.gradient` block support).\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a legacy color gradient value set.\n */\nexport function hasLegacyColorGradientValue( style ) {\n\treturn !! style?.color?.gradient;\n}\n\nexport function BackgroundToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n\theaderLabel,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ headerLabel }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\thasInnerWrapper\n\t\t\tclassName=\"background-block-support-panel\"\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t<div className=\"background-block-support-panel__inner-wrapper\">\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</ToolsPanel>\n\t);\n}\n\nexport default function BackgroundImagePanel( {\n\tas: Wrapper = BackgroundToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n\tdefaultValues = {},\n\theaderLabel = __( 'Background' ),\n\tcontrastWarning,\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n} ) {\n\tconst {\n\t\tcolors,\n\t\tgradients,\n\t\tallColors,\n\t\tareCustomSolidsEnabled,\n\t\tareCustomGradientsEnabled,\n\t\thasSolidColors,\n\t\thasGradientColors,\n\t\tdecodeValue,\n\t\tencodeGradientValue,\n\t} = useColorGradientSettings( settings );\n\n\tconst hasBackgroundGradientControl = useHasBackgroundControl(\n\t\tsettings,\n\t\t'gradient'\n\t);\n\tconst hasColorPanelBackgroundSupport =\n\t\tuseHasBackgroundColorPanel( settings );\n\tconst showBackgroundColorControl =\n\t\thasColorPanelBackgroundSupport && hasSolidColors;\n\t// New `background.gradient` block support — gradient lives under the\n\t// `background` style path.\n\tconst showBackgroundGradientControl =\n\t\thasGradientColors && hasBackgroundGradientControl;\n\t// Legacy `color.gradient` path — only rendered when the block has\n\t// color panel background support and hasn't adopted the newer\n\t// `background.gradient` support. Keeps the UI consistent for blocks\n\t// that still write gradients to `color.gradient`.\n\tconst showLegacyColorGradientControl =\n\t\thasColorPanelBackgroundSupport &&\n\t\thasGradientColors &&\n\t\t! hasBackgroundGradientControl;\n\tconst showBackgroundImageControl = useHasBackgroundControl(\n\t\tsettings,\n\t\t'backgroundImage'\n\t);\n\n\tconst resetAllFilter = useCallback(\n\t\t( previousValue ) => {\n\t\t\tconst clearsColorBackground = showBackgroundColorControl;\n\t\t\tconst clearsColorGradient =\n\t\t\t\thasBackgroundGradientControl || showLegacyColorGradientControl;\n\t\t\tif ( ! clearsColorBackground && ! clearsColorGradient ) {\n\t\t\t\treturn { ...previousValue, background: {} };\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...previousValue,\n\t\t\t\tbackground: {},\n\t\t\t\tcolor: {\n\t\t\t\t\t...previousValue?.color,\n\t\t\t\t\t...( clearsColorBackground && { background: undefined } ),\n\t\t\t\t\t...( clearsColorGradient && { gradient: undefined } ),\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\thasBackgroundGradientControl,\n\t\t\tshowBackgroundColorControl,\n\t\t\tshowLegacyColorGradientControl,\n\t\t]\n\t);\n\n\tif (\n\t\t! showBackgroundImageControl &&\n\t\t! showBackgroundColorControl &&\n\t\t! showBackgroundGradientControl &&\n\t\t! showLegacyColorGradientControl\n\t) {\n\t\treturn null;\n\t}\n\n\tconst resetBackground = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\tundefined\n\t\t\t)\n\t\t);\n\n\tconst resetGradient = () => {\n\t\tlet newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'background', 'gradient' ],\n\t\t\tundefined\n\t\t);\n\t\tnewValue = setImmutably( newValue, [ 'color', 'gradient' ], undefined );\n\t\tonChange( newValue );\n\t};\n\n\t// Non-cascading root values are already dropped from `inheritedValue` by\n\t// the builder, so inherited reads below are direct.\n\n\t// Background color (written to `color.background`).\n\tconst backgroundColor = decodeValue( inheritedValue?.color?.background );\n\tconst userBackgroundColor = decodeValue( value?.color?.background );\n\tconst setBackgroundColor = ( newColor, newSlug ) => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'background' ],\n\t\t\tencodeColorValueWithPalette( allColors, newColor, newSlug )\n\t\t);\n\t\t// Legacy `color.gradient` is mutually exclusive with\n\t\t// `color.background`. `background.gradient` is independent and\n\t\t// should not be touched.\n\t\tif ( showLegacyColorGradientControl ) {\n\t\t\tnewValue.color.gradient = undefined;\n\t\t}\n\t\tonChange( newValue );\n\t};\n\tconst resetBackgroundColor = () => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'background' ],\n\t\t\tundefined\n\t\t);\n\t\tif ( showLegacyColorGradientControl ) {\n\t\t\tnewValue.color.gradient = undefined;\n\t\t}\n\t\tonChange( newValue );\n\t};\n\n\t// Legacy `color.gradient` setters.\n\tconst legacyColorGradient = decodeValue( inheritedValue?.color?.gradient );\n\tconst userLegacyColorGradient = decodeValue( value?.color?.gradient );\n\tconst setLegacyColorGradient = ( newGradient, newSlug ) => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'gradient' ],\n\t\t\tencodeGradientValue( newGradient, newSlug )\n\t\t);\n\t\tnewValue.color.background = undefined;\n\t\tonChange( newValue );\n\t};\n\tconst resetLegacyColorGradient = () =>\n\t\tonChange( setImmutably( value, [ 'color', 'gradient' ], undefined ) );\n\n\t// Get current gradient value, decoding preset slug references.\n\t// Fall back to color.gradient for legacy blocks that haven't migrated\n\t// to background.gradient yet (mirrors block inspector fallback in\n\t// packages/block-editor/src/hooks/background.js).\n\tconst currentGradient = decodeValue(\n\t\tvalue?.background?.gradient ?? value?.color?.gradient\n\t);\n\tconst inheritedGradient = decodeValue(\n\t\tinheritedValue?.background?.gradient ?? inheritedValue?.color?.gradient\n\t);\n\n\t// Set gradient value, encoding preset matches as slug references.\n\t// Also clear color.gradient to migrate from the legacy location,\n\t// matching the block inspector behavior in hooks/background.js.\n\tconst setGradient = ( newGradient, newSlug ) => {\n\t\tlet newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'background', 'gradient' ],\n\t\t\tencodeGradientValue( newGradient, newSlug )\n\t\t);\n\t\tnewValue = setImmutably( newValue, [ 'color', 'gradient' ], undefined );\n\t\tonChange( newValue );\n\t};\n\n\tconst inheritanceProps = ( isInherited, hasLocalOverride, classNames ) =>\n\t\tshowInheritanceLabelIndicators\n\t\t\t? getInheritanceProps( isInherited, hasLocalOverride, classNames )\n\t\t\t: { className: classNames };\n\n\t// The inherited value arrives already resolved (refs + theme-file pointers)\n\t// with non-cascading root values dropped, so a presence check drives the\n\t// label affordance and matches what `BackgroundImageControl` renders.\n\tconst inheritedBackgroundImage = hasBackgroundImageValue( {\n\t\tbackground: {\n\t\t\tbackgroundImage: inheritedValue?.background?.backgroundImage,\n\t\t},\n\t} );\n\tconst hasLocalBackgroundImage = hasBackgroundImageValue( value );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t\theaderLabel={ headerLabel }\n\t\t>\n\t\t\t{ showBackgroundImageControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tinheritedBackgroundImage && ! hasLocalBackgroundImage,\n\t\t\t\t\t\thasLocalBackgroundImage && inheritedBackgroundImage,\n\t\t\t\t\t\t'block-editor-color-gradient-item'\n\t\t\t\t\t) }\n\t\t\t\t\tshowLocalOverrideActionsInLabel={ false }\n\t\t\t\t\thasValue={ () => hasBackgroundImageValue( value ) }\n\t\t\t\t\tlabel={ __( 'Image' ) }\n\t\t\t\t\tonDeselect={ resetBackground }\n\t\t\t\t\tisShownByDefault={ defaultControls.backgroundImage }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<BackgroundImageControl\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\tinheritedValue={ inheritedValue }\n\t\t\t\t\t\tdefaultControls={ defaultControls }\n\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ showBackgroundColorControl && (\n\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\tlabel={ __( 'Color' ) }\n\t\t\t\t\thasValue={ () => hasBackgroundColorValue( value ) }\n\t\t\t\t\tresetValue={ resetBackgroundColor }\n\t\t\t\t\tisShownByDefault={ defaultControls.backgroundColor }\n\t\t\t\t\tindicators={ [ userBackgroundColor ?? backgroundColor ] }\n\t\t\t\t\tcontrastWarning={ contrastWarning }\n\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t}\n\t\t\t\t\tisPlaceholder={\n\t\t\t\t\t\tuserBackgroundColor === undefined &&\n\t\t\t\t\t\tbackgroundColor !== undefined\n\t\t\t\t\t}\n\t\t\t\t\thasInheritedValue={ backgroundColor !== undefined }\n\t\t\t\t\ttabs={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tkey: 'background',\n\t\t\t\t\t\t\tlabel: __( 'Color' ),\n\t\t\t\t\t\t\tinheritedValue: backgroundColor,\n\t\t\t\t\t\t\t// The picker selects by slug: `userSlug` when the\n\t\t\t\t\t\t\t// block has its own value, otherwise\n\t\t\t\t\t\t\t// `inheritedSlug`. Hex matching would mark two\n\t\t\t\t\t\t\t// same-hex presets as both selected.\n\t\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tinheritedValue?.color?.background,\n\t\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tvalue?.color?.background,\n\t\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tsetValue: setBackgroundColor,\n\t\t\t\t\t\t\tuserValue: userBackgroundColor,\n\t\t\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\t\t\tuserBackgroundColor === undefined &&\n\t\t\t\t\t\t\t\tbackgroundColor !== undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\tcolors,\n\t\t\t\t\t\tdisableCustomColors: ! areCustomSolidsEnabled,\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showBackgroundGradientControl && (\n\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\tlabel={ __( 'Gradient' ) }\n\t\t\t\t\thasValue={ () => hasBackgroundGradientValue( value ) }\n\t\t\t\t\tresetValue={ resetGradient }\n\t\t\t\t\tisShownByDefault={ defaultControls.gradient }\n\t\t\t\t\tindicators={ [ currentGradient ?? inheritedGradient ] }\n\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t}\n\t\t\t\t\tisPlaceholder={\n\t\t\t\t\t\tcurrentGradient === undefined &&\n\t\t\t\t\t\tinheritedGradient !== undefined\n\t\t\t\t\t}\n\t\t\t\t\thasInheritedValue={ inheritedGradient !== undefined }\n\t\t\t\t\ttabs={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tkey: 'gradient',\n\t\t\t\t\t\t\tlabel: __( 'Gradient' ),\n\t\t\t\t\t\t\tinheritedValue: inheritedGradient,\n\t\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tinheritedValue?.background?.gradient ??\n\t\t\t\t\t\t\t\t\tinheritedValue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tvalue?.background?.gradient ??\n\t\t\t\t\t\t\t\t\tvalue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tsetValue: setGradient,\n\t\t\t\t\t\t\tuserValue: currentGradient,\n\t\t\t\t\t\t\tisGradient: true,\n\t\t\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\t\t\tcurrentGradient === undefined &&\n\t\t\t\t\t\t\t\tinheritedGradient !== undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\tgradients,\n\t\t\t\t\t\tdisableCustomGradients: ! areCustomGradientsEnabled,\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showLegacyColorGradientControl && (\n\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\tlabel={ __( 'Gradient' ) }\n\t\t\t\t\thasValue={ () => hasLegacyColorGradientValue( value ) }\n\t\t\t\t\tresetValue={ resetLegacyColorGradient }\n\t\t\t\t\tisShownByDefault={ defaultControls.gradient }\n\t\t\t\t\tindicators={ [\n\t\t\t\t\t\tuserLegacyColorGradient ?? legacyColorGradient,\n\t\t\t\t\t] }\n\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t}\n\t\t\t\t\tisPlaceholder={\n\t\t\t\t\t\tuserLegacyColorGradient === undefined &&\n\t\t\t\t\t\tlegacyColorGradient !== undefined\n\t\t\t\t\t}\n\t\t\t\t\thasInheritedValue={ legacyColorGradient !== undefined }\n\t\t\t\t\ttabs={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tkey: 'gradient',\n\t\t\t\t\t\t\tlabel: __( 'Gradient' ),\n\t\t\t\t\t\t\tinheritedValue: legacyColorGradient,\n\t\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tinheritedValue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tvalue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tsetValue: setLegacyColorGradient,\n\t\t\t\t\t\t\tuserValue: userLegacyColorGradient,\n\t\t\t\t\t\t\tisGradient: true,\n\t\t\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\t\t\tuserLegacyColorGradient === undefined &&\n\t\t\t\t\t\t\t\tlegacyColorGradient !== undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\tgradients,\n\t\t\t\t\t\tdisableCustomGradients: ! areCustomGradientsEnabled,\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],
+  "sources": ["../../../src/components/global-styles/background-panel.jsx"],
+  "sourcesContent": ["import { __experimentalToolsPanel as ToolsPanel } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport BackgroundImageControl from '../background-image-control';\nimport ColorGradientDropdownItem from './color-gradient-dropdown-item';\nimport { useHasBackgroundColorPanel } from './color-panel';\nimport { useColorGradientSettings } from './hooks';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport {\n\textractPresetSlug,\n\tencodeColorValueWithPalette,\n} from '../../utils/color-values';\nimport {\n\tgetInheritanceProps,\n\tInheritanceToolsPanelItem,\n\tisGlobalStylesInheritanceEnabled,\n} from './inheritance';\n\nconst DEFAULT_CONTROLS = {\n\tbackgroundImage: true,\n\tbackgroundColor: true,\n\tgradient: true,\n};\n\n/**\n * Checks site settings to see if the requested feature's control may be used.\n *\n * @param {Object} settings Site settings.\n * @param {string} feature  Background feature to check.\n * @return {boolean}        Whether site settings has activated background panel.\n */\nexport function useHasBackgroundControl( settings, feature ) {\n\treturn settings?.background?.[ feature ];\n}\n\n/**\n * Checks site settings to see if the background panel may be used.\n * `settings.background.backgroundSize` exists also,\n * but can only be used if settings?.background?.backgroundImage is `true`.\n *\n * The panel is also shown when the block has color panel background\n * support (`settings.color.background`), because background color and\n * the legacy `color.gradient` control are rendered here.\n *\n * @param {Object} settings Site settings\n * @return {boolean}        Whether site settings has activated background panel.\n */\nexport function useHasBackgroundPanel( settings ) {\n\tconst hasBackgroundColor = useHasBackgroundColorPanel( settings );\n\tconst { backgroundImage, gradient } = settings?.background || {};\n\treturn backgroundImage || gradient || hasBackgroundColor;\n}\n\n/**\n * Checks if there is a current value in the background size block support\n * attributes. Background size values include background size as well\n * as background position.\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background size value set.\n */\nexport function hasBackgroundSizeValue( style ) {\n\treturn (\n\t\tstyle?.background?.backgroundPosition !== undefined ||\n\t\tstyle?.background?.backgroundSize !== undefined\n\t);\n}\n\n/**\n * Checks if there is a current value in the background image block support\n * attributes.\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background image value set.\n */\nexport function hasBackgroundImageValue( style ) {\n\treturn (\n\t\t!! style?.background?.backgroundImage?.id ||\n\t\t// Supports url() string values in theme.json.\n\t\t'string' === typeof style?.background?.backgroundImage ||\n\t\t!! style?.background?.backgroundImage?.url\n\t);\n}\n\n/**\n * Checks if there is a current value in the background gradient block support\n * attributes.\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background gradient value set.\n */\nexport function hasBackgroundGradientValue( style ) {\n\treturn (\n\t\t'string' === typeof style?.background?.gradient &&\n\t\tstyle?.background?.gradient !== ''\n\t);\n}\n\n/**\n * Checks if there is a current value for the background color (written to\n * `color.background`).\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a background color value set.\n */\nexport function hasBackgroundColorValue( style ) {\n\treturn !! style?.color?.background;\n}\n\n/**\n * Checks if there is a current value in the legacy `color.gradient` location\n * (used by blocks with color panel gradient support that haven't adopted the\n * `background.gradient` block support).\n *\n * @param {Object} style Style attribute.\n * @return {boolean}     Whether the block has a legacy color gradient value set.\n */\nexport function hasLegacyColorGradientValue( style ) {\n\treturn !! style?.color?.gradient;\n}\n\nexport function BackgroundToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n\theaderLabel,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ headerLabel }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\thasInnerWrapper\n\t\t\tclassName=\"background-block-support-panel\"\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t<div className=\"background-block-support-panel__inner-wrapper\">\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</ToolsPanel>\n\t);\n}\n\nexport default function BackgroundImagePanel( {\n\tas: Wrapper = BackgroundToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n\tdefaultValues = {},\n\theaderLabel = __( 'Background' ),\n\tcontrastWarning,\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n} ) {\n\tconst {\n\t\tcolors,\n\t\tgradients,\n\t\tallColors,\n\t\tareCustomSolidsEnabled,\n\t\tareCustomGradientsEnabled,\n\t\thasSolidColors,\n\t\thasGradientColors,\n\t\tdecodeValue,\n\t\tencodeGradientValue,\n\t} = useColorGradientSettings( settings );\n\n\tconst hasBackgroundGradientControl = useHasBackgroundControl(\n\t\tsettings,\n\t\t'gradient'\n\t);\n\tconst hasColorPanelBackgroundSupport =\n\t\tuseHasBackgroundColorPanel( settings );\n\tconst showBackgroundColorControl =\n\t\thasColorPanelBackgroundSupport && hasSolidColors;\n\t// New `background.gradient` block support — gradient lives under the\n\t// `background` style path.\n\tconst showBackgroundGradientControl =\n\t\thasGradientColors && hasBackgroundGradientControl;\n\t// Legacy `color.gradient` path — only rendered when the block has\n\t// color panel background support and hasn't adopted the newer\n\t// `background.gradient` support. Keeps the UI consistent for blocks\n\t// that still write gradients to `color.gradient`.\n\tconst showLegacyColorGradientControl =\n\t\thasColorPanelBackgroundSupport &&\n\t\thasGradientColors &&\n\t\t! hasBackgroundGradientControl;\n\tconst showBackgroundImageControl = useHasBackgroundControl(\n\t\tsettings,\n\t\t'backgroundImage'\n\t);\n\n\tconst resetAllFilter = useCallback(\n\t\t( previousValue ) => {\n\t\t\tconst clearsColorBackground = showBackgroundColorControl;\n\t\t\tconst clearsColorGradient =\n\t\t\t\thasBackgroundGradientControl || showLegacyColorGradientControl;\n\t\t\tif ( ! clearsColorBackground && ! clearsColorGradient ) {\n\t\t\t\treturn { ...previousValue, background: {} };\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...previousValue,\n\t\t\t\tbackground: {},\n\t\t\t\tcolor: {\n\t\t\t\t\t...previousValue?.color,\n\t\t\t\t\t...( clearsColorBackground && { background: undefined } ),\n\t\t\t\t\t...( clearsColorGradient && { gradient: undefined } ),\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\thasBackgroundGradientControl,\n\t\t\tshowBackgroundColorControl,\n\t\t\tshowLegacyColorGradientControl,\n\t\t]\n\t);\n\n\tif (\n\t\t! showBackgroundImageControl &&\n\t\t! showBackgroundColorControl &&\n\t\t! showBackgroundGradientControl &&\n\t\t! showLegacyColorGradientControl\n\t) {\n\t\treturn null;\n\t}\n\n\tconst resetBackground = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\tundefined\n\t\t\t)\n\t\t);\n\n\tconst resetGradient = () => {\n\t\tlet newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'background', 'gradient' ],\n\t\t\tundefined\n\t\t);\n\t\tnewValue = setImmutably( newValue, [ 'color', 'gradient' ], undefined );\n\t\tonChange( newValue );\n\t};\n\n\t// Non-cascading root values are already dropped from `inheritedValue` by\n\t// the builder, so inherited reads below are direct.\n\n\t// Background color (written to `color.background`).\n\tconst backgroundColor = decodeValue( inheritedValue?.color?.background );\n\tconst userBackgroundColor = decodeValue( value?.color?.background );\n\tconst setBackgroundColor = ( newColor, newSlug ) => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'background' ],\n\t\t\tencodeColorValueWithPalette( allColors, newColor, newSlug )\n\t\t);\n\t\t// Legacy `color.gradient` is mutually exclusive with\n\t\t// `color.background`. `background.gradient` is independent and\n\t\t// should not be touched.\n\t\tif ( showLegacyColorGradientControl ) {\n\t\t\tnewValue.color.gradient = undefined;\n\t\t}\n\t\tonChange( newValue );\n\t};\n\tconst resetBackgroundColor = () => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'background' ],\n\t\t\tundefined\n\t\t);\n\t\tif ( showLegacyColorGradientControl ) {\n\t\t\tnewValue.color.gradient = undefined;\n\t\t}\n\t\tonChange( newValue );\n\t};\n\n\t// Legacy `color.gradient` setters.\n\tconst legacyColorGradient = decodeValue( inheritedValue?.color?.gradient );\n\tconst userLegacyColorGradient = decodeValue( value?.color?.gradient );\n\tconst setLegacyColorGradient = ( newGradient, newSlug ) => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'gradient' ],\n\t\t\tencodeGradientValue( newGradient, newSlug )\n\t\t);\n\t\tnewValue.color.background = undefined;\n\t\tonChange( newValue );\n\t};\n\tconst resetLegacyColorGradient = () =>\n\t\tonChange( setImmutably( value, [ 'color', 'gradient' ], undefined ) );\n\n\t// Get current gradient value, decoding preset slug references.\n\t// Fall back to color.gradient for legacy blocks that haven't migrated\n\t// to background.gradient yet (mirrors block inspector fallback in\n\t// packages/block-editor/src/hooks/background.jsx).\n\tconst currentGradient = decodeValue(\n\t\tvalue?.background?.gradient ?? value?.color?.gradient\n\t);\n\tconst inheritedGradient = decodeValue(\n\t\tinheritedValue?.background?.gradient ?? inheritedValue?.color?.gradient\n\t);\n\n\t// Set gradient value, encoding preset matches as slug references.\n\t// Also clear color.gradient to migrate from the legacy location,\n\t// matching the block inspector behavior in hooks/background.jsx.\n\tconst setGradient = ( newGradient, newSlug ) => {\n\t\tlet newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'background', 'gradient' ],\n\t\t\tencodeGradientValue( newGradient, newSlug )\n\t\t);\n\t\tnewValue = setImmutably( newValue, [ 'color', 'gradient' ], undefined );\n\t\tonChange( newValue );\n\t};\n\n\tconst inheritanceProps = ( isInherited, hasLocalOverride, classNames ) =>\n\t\tshowInheritanceLabelIndicators\n\t\t\t? getInheritanceProps( isInherited, hasLocalOverride, classNames )\n\t\t\t: { className: classNames };\n\n\t// The inherited value arrives already resolved (refs + theme-file pointers)\n\t// with non-cascading root values dropped, so a presence check drives the\n\t// label affordance and matches what `BackgroundImageControl` renders.\n\tconst inheritedBackgroundImage = hasBackgroundImageValue( {\n\t\tbackground: {\n\t\t\tbackgroundImage: inheritedValue?.background?.backgroundImage,\n\t\t},\n\t} );\n\tconst hasLocalBackgroundImage = hasBackgroundImageValue( value );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t\theaderLabel={ headerLabel }\n\t\t>\n\t\t\t{ showBackgroundImageControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tinheritedBackgroundImage && ! hasLocalBackgroundImage,\n\t\t\t\t\t\thasLocalBackgroundImage && inheritedBackgroundImage,\n\t\t\t\t\t\t'block-editor-color-gradient-item'\n\t\t\t\t\t) }\n\t\t\t\t\tshowLocalOverrideActionsInLabel={ false }\n\t\t\t\t\thasValue={ () => hasBackgroundImageValue( value ) }\n\t\t\t\t\tlabel={ __( 'Image' ) }\n\t\t\t\t\tonDeselect={ resetBackground }\n\t\t\t\t\tisShownByDefault={ defaultControls.backgroundImage }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<BackgroundImageControl\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\tinheritedValue={ inheritedValue }\n\t\t\t\t\t\tdefaultControls={ defaultControls }\n\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ showBackgroundColorControl && (\n\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\tlabel={ __( 'Color' ) }\n\t\t\t\t\thasValue={ () => hasBackgroundColorValue( value ) }\n\t\t\t\t\tresetValue={ resetBackgroundColor }\n\t\t\t\t\tisShownByDefault={ defaultControls.backgroundColor }\n\t\t\t\t\tindicators={ [ userBackgroundColor ?? backgroundColor ] }\n\t\t\t\t\tcontrastWarning={ contrastWarning }\n\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t}\n\t\t\t\t\tisPlaceholder={\n\t\t\t\t\t\tuserBackgroundColor === undefined &&\n\t\t\t\t\t\tbackgroundColor !== undefined\n\t\t\t\t\t}\n\t\t\t\t\thasInheritedValue={ backgroundColor !== undefined }\n\t\t\t\t\ttabs={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tkey: 'background',\n\t\t\t\t\t\t\tlabel: __( 'Color' ),\n\t\t\t\t\t\t\tinheritedValue: backgroundColor,\n\t\t\t\t\t\t\t// The picker selects by slug: `userSlug` when the\n\t\t\t\t\t\t\t// block has its own value, otherwise\n\t\t\t\t\t\t\t// `inheritedSlug`. Hex matching would mark two\n\t\t\t\t\t\t\t// same-hex presets as both selected.\n\t\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tinheritedValue?.color?.background,\n\t\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tvalue?.color?.background,\n\t\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tsetValue: setBackgroundColor,\n\t\t\t\t\t\t\tuserValue: userBackgroundColor,\n\t\t\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\t\t\tuserBackgroundColor === undefined &&\n\t\t\t\t\t\t\t\tbackgroundColor !== undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\tcolors,\n\t\t\t\t\t\tdisableCustomColors: ! areCustomSolidsEnabled,\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showBackgroundGradientControl && (\n\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\tlabel={ __( 'Gradient' ) }\n\t\t\t\t\thasValue={ () => hasBackgroundGradientValue( value ) }\n\t\t\t\t\tresetValue={ resetGradient }\n\t\t\t\t\tisShownByDefault={ defaultControls.gradient }\n\t\t\t\t\tindicators={ [ currentGradient ?? inheritedGradient ] }\n\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t}\n\t\t\t\t\tisPlaceholder={\n\t\t\t\t\t\tcurrentGradient === undefined &&\n\t\t\t\t\t\tinheritedGradient !== undefined\n\t\t\t\t\t}\n\t\t\t\t\thasInheritedValue={ inheritedGradient !== undefined }\n\t\t\t\t\ttabs={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tkey: 'gradient',\n\t\t\t\t\t\t\tlabel: __( 'Gradient' ),\n\t\t\t\t\t\t\tinheritedValue: inheritedGradient,\n\t\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tinheritedValue?.background?.gradient ??\n\t\t\t\t\t\t\t\t\tinheritedValue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tvalue?.background?.gradient ??\n\t\t\t\t\t\t\t\t\tvalue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tsetValue: setGradient,\n\t\t\t\t\t\t\tuserValue: currentGradient,\n\t\t\t\t\t\t\tisGradient: true,\n\t\t\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\t\t\tcurrentGradient === undefined &&\n\t\t\t\t\t\t\t\tinheritedGradient !== undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\tgradients,\n\t\t\t\t\t\tdisableCustomGradients: ! areCustomGradientsEnabled,\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showLegacyColorGradientControl && (\n\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\tlabel={ __( 'Gradient' ) }\n\t\t\t\t\thasValue={ () => hasLegacyColorGradientValue( value ) }\n\t\t\t\t\tresetValue={ resetLegacyColorGradient }\n\t\t\t\t\tisShownByDefault={ defaultControls.gradient }\n\t\t\t\t\tindicators={ [\n\t\t\t\t\t\tuserLegacyColorGradient ?? legacyColorGradient,\n\t\t\t\t\t] }\n\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t}\n\t\t\t\t\tisPlaceholder={\n\t\t\t\t\t\tuserLegacyColorGradient === undefined &&\n\t\t\t\t\t\tlegacyColorGradient !== undefined\n\t\t\t\t\t}\n\t\t\t\t\thasInheritedValue={ legacyColorGradient !== undefined }\n\t\t\t\t\ttabs={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tkey: 'gradient',\n\t\t\t\t\t\t\tlabel: __( 'Gradient' ),\n\t\t\t\t\t\t\tinheritedValue: legacyColorGradient,\n\t\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tinheritedValue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tvalue?.color?.gradient,\n\t\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tsetValue: setLegacyColorGradient,\n\t\t\t\t\t\t\tuserValue: userLegacyColorGradient,\n\t\t\t\t\t\t\tisGradient: true,\n\t\t\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\t\t\tuserLegacyColorGradient === undefined &&\n\t\t\t\t\t\t\t\tlegacyColorGradient !== undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\tgradients,\n\t\t\t\t\t\tdisableCustomGradients: ! areCustomGradientsEnabled,\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuD;AACvD,qBAA4B;AAC5B,kBAAmB;AACnB,sCAAmC;AACnC,0CAAsC;AACtC,yBAA2C;AAC3C,mBAAyC;AACzC,mBAA+C;AAC/C,oBAA6B;AAC7B,0BAGO;AACP,yBAIO;AAkIJ;AAhIH,IAAM,mBAAmB;AAAA,EACxB,iBAAiB;AAAA,EACjB,iBAAiB;AAAA,EACjB,UAAU;AACX;AASO,SAAS,wBAAyB,UAAU,SAAU;AAC5D,SAAO,UAAU,aAAc,OAAQ;AACxC;AAcO,SAAS,sBAAuB,UAAW;AACjD,QAAM,yBAAqB,+CAA4B,QAAS;AAChE,QAAM,EAAE,iBAAiB,SAAS,IAAI,UAAU,cAAc,CAAC;AAC/D,SAAO,mBAAmB,YAAY;AACvC;AAUO,SAAS,uBAAwB,OAAQ;AAC/C,SACC,OAAO,YAAY,uBAAuB,UAC1C,OAAO,YAAY,mBAAmB;AAExC;AASO,SAAS,wBAAyB,OAAQ;AAChD,SACC,CAAC,CAAE,OAAO,YAAY,iBAAiB;AAAA,EAEvC,aAAa,OAAO,OAAO,YAAY,mBACvC,CAAC,CAAE,OAAO,YAAY,iBAAiB;AAEzC;AASO,SAAS,2BAA4B,OAAQ;AACnD,SACC,aAAa,OAAO,OAAO,YAAY,YACvC,OAAO,YAAY,aAAa;AAElC;AASO,SAAS,wBAAyB,OAAQ;AAChD,SAAO,CAAC,CAAE,OAAO,OAAO;AACzB;AAUO,SAAS,4BAA6B,OAAQ;AACpD,SAAO,CAAC,CAAE,OAAO,OAAO;AACzB;AAEO,SAAS,qBAAsB;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,wBAAoB,6CAA+B;AACzD,QAAM,WAAW,MAAM;AACtB,UAAM,eAAe,eAAgB,KAAM;AAC3C,aAAU,YAAa;AAAA,EACxB;AAEA,SACC;AAAA,IAAC,kBAAAA;AAAA,IAAA;AAAA,MACA,OAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA,iBAAe;AAAA,MACf,WAAU;AAAA,MACV,qCAAoC;AAAA,MACpC,oCAAmC;AAAA,MACnC;AAAA,MAEA,sDAAC,SAAI,WAAU,iDACZ,UACH;AAAA;AAAA,EACD;AAEF;AAEe,SAAR,qBAAuC;AAAA,EAC7C,IAAI,UAAU;AAAA,EACd;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,gBAAgB,CAAC;AAAA,EACjB,kBAAc,gBAAI,YAAa;AAAA,EAC/B;AAAA,EACA,qCAAiC,qDAAiC;AACnE,GAAI;AACH,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI,uCAA0B,QAAS;AAEvC,QAAM,+BAA+B;AAAA,IACpC;AAAA,IACA;AAAA,EACD;AACA,QAAM,qCACL,+CAA4B,QAAS;AACtC,QAAM,6BACL,kCAAkC;AAGnC,QAAM,gCACL,qBAAqB;AAKtB,QAAM,iCACL,kCACA,qBACA,CAAE;AACH,QAAM,6BAA6B;AAAA,IAClC;AAAA,IACA;AAAA,EACD;AAEA,QAAM,qBAAiB;AAAA,IACtB,CAAE,kBAAmB;AACpB,YAAM,wBAAwB;AAC9B,YAAM,sBACL,gCAAgC;AACjC,UAAK,CAAE,yBAAyB,CAAE,qBAAsB;AACvD,eAAO,EAAE,GAAG,eAAe,YAAY,CAAC,EAAE;AAAA,MAC3C;AACA,aAAO;AAAA,QACN,GAAG;AAAA,QACH,YAAY,CAAC;AAAA,QACb,OAAO;AAAA,UACN,GAAG,eAAe;AAAA,UAClB,GAAK,yBAAyB,EAAE,YAAY,OAAU;AAAA,UACtD,GAAK,uBAAuB,EAAE,UAAU,OAAU;AAAA,QACnD;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AAEA,MACC,CAAE,8BACF,CAAE,8BACF,CAAE,iCACF,CAAE,gCACD;AACD,WAAO;AAAA,EACR;AAEA,QAAM,kBAAkB,MACvB;AAAA,QACC;AAAA,MACC;AAAA,MACA,CAAE,cAAc,iBAAkB;AAAA,MAClC;AAAA,IACD;AAAA,EACD;AAED,QAAM,gBAAgB,MAAM;AAC3B,QAAI,eAAW;AAAA,MACd;AAAA,MACA,CAAE,cAAc,UAAW;AAAA,MAC3B;AAAA,IACD;AACA,mBAAW,4BAAc,UAAU,CAAE,SAAS,UAAW,GAAG,MAAU;AACtE,aAAU,QAAS;AAAA,EACpB;AAMA,QAAM,kBAAkB,YAAa,gBAAgB,OAAO,UAAW;AACvE,QAAM,sBAAsB,YAAa,OAAO,OAAO,UAAW;AAClE,QAAM,qBAAqB,CAAE,UAAU,YAAa;AACnD,UAAM,eAAW;AAAA,MAChB;AAAA,MACA,CAAE,SAAS,YAAa;AAAA,UACxB,iDAA6B,WAAW,UAAU,OAAQ;AAAA,IAC3D;AAIA,QAAK,gCAAiC;AACrC,eAAS,MAAM,WAAW;AAAA,IAC3B;AACA,aAAU,QAAS;AAAA,EACpB;AACA,QAAM,uBAAuB,MAAM;AAClC,UAAM,eAAW;AAAA,MAChB;AAAA,MACA,CAAE,SAAS,YAAa;AAAA,MACxB;AAAA,IACD;AACA,QAAK,gCAAiC;AACrC,eAAS,MAAM,WAAW;AAAA,IAC3B;AACA,aAAU,QAAS;AAAA,EACpB;AAGA,QAAM,sBAAsB,YAAa,gBAAgB,OAAO,QAAS;AACzE,QAAM,0BAA0B,YAAa,OAAO,OAAO,QAAS;AACpE,QAAM,yBAAyB,CAAE,aAAa,YAAa;AAC1D,UAAM,eAAW;AAAA,MAChB;AAAA,MACA,CAAE,SAAS,UAAW;AAAA,MACtB,oBAAqB,aAAa,OAAQ;AAAA,IAC3C;AACA,aAAS,MAAM,aAAa;AAC5B,aAAU,QAAS;AAAA,EACpB;AACA,QAAM,2BAA2B,MAChC,aAAU,4BAAc,OAAO,CAAE,SAAS,UAAW,GAAG,MAAU,CAAE;AAMrE,QAAM,kBAAkB;AAAA,IACvB,OAAO,YAAY,YAAY,OAAO,OAAO;AAAA,EAC9C;AACA,QAAM,oBAAoB;AAAA,IACzB,gBAAgB,YAAY,YAAY,gBAAgB,OAAO;AAAA,EAChE;AAKA,QAAM,cAAc,CAAE,aAAa,YAAa;AAC/C,QAAI,eAAW;AAAA,MACd;AAAA,MACA,CAAE,cAAc,UAAW;AAAA,MAC3B,oBAAqB,aAAa,OAAQ;AAAA,IAC3C;AACA,mBAAW,4BAAc,UAAU,CAAE,SAAS,UAAW,GAAG,MAAU;AACtE,aAAU,QAAS;AAAA,EACpB;AAEA,QAAM,mBAAmB,CAAE,aAAa,kBAAkB,eACzD,qCACG,wCAAqB,aAAa,kBAAkB,UAAW,IAC/D,EAAE,WAAW,WAAW;AAK5B,QAAM,2BAA2B,wBAAyB;AAAA,IACzD,YAAY;AAAA,MACX,iBAAiB,gBAAgB,YAAY;AAAA,IAC9C;AAAA,EACD,CAAE;AACF,QAAM,0BAA0B,wBAAyB,KAAM;AAE/D,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEE;AAAA,sCACD;AAAA,UAAC;AAAA;AAAA,YACE,GAAG;AAAA,cACJ,4BAA4B,CAAE;AAAA,cAC9B,2BAA2B;AAAA,cAC3B;AAAA,YACD;AAAA,YACA,iCAAkC;AAAA,YAClC,UAAW,MAAM,wBAAyB,KAAM;AAAA,YAChD,WAAQ,gBAAI,OAAQ;AAAA,YACpB,YAAa;AAAA,YACb,kBAAmB,gBAAgB;AAAA,YACnC;AAAA,YAEA;AAAA,cAAC,gCAAAC;AAAA,cAAA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YAGD;AAAA;AAAA,QACD;AAAA,QAEC,8BACD;AAAA,UAAC,oCAAAC;AAAA,UAAA;AAAA,YACA,WAAQ,gBAAI,OAAQ;AAAA,YACpB,UAAW,MAAM,wBAAyB,KAAM;AAAA,YAChD,YAAa;AAAA,YACb,kBAAmB,gBAAgB;AAAA,YACnC,YAAa,CAAE,uBAAuB,eAAgB;AAAA,YACtD;AAAA,YACA;AAAA,YAGA,eACC,wBAAwB,UACxB,oBAAoB;AAAA,YAErB,mBAAoB,oBAAoB;AAAA,YACxC,MAAO;AAAA,cACN;AAAA,gBACC,KAAK;AAAA,gBACL,WAAO,gBAAI,OAAQ;AAAA,gBACnB,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKhB,mBAAe;AAAA,kBACd,gBAAgB,OAAO;AAAA,kBACvB;AAAA,gBACD;AAAA,gBACA,cAAU;AAAA,kBACT,OAAO,OAAO;AAAA,kBACd;AAAA,gBACD;AAAA,gBACA,UAAU;AAAA,gBACV,WAAW;AAAA,gBACX,eACC,wBAAwB,UACxB,oBAAoB;AAAA,cACtB;AAAA,YACD;AAAA,YACA,8BAA+B;AAAA,cAC9B;AAAA,cACA,qBAAqB,CAAE;AAAA,YACxB;AAAA,YACA;AAAA;AAAA,QACD;AAAA,QAEC,iCACD;AAAA,UAAC,oCAAAA;AAAA,UAAA;AAAA,YACA,WAAQ,gBAAI,UAAW;AAAA,YACvB,UAAW,MAAM,2BAA4B,KAAM;AAAA,YACnD,YAAa;AAAA,YACb,kBAAmB,gBAAgB;AAAA,YACnC,YAAa,CAAE,mBAAmB,iBAAkB;AAAA,YACpD;AAAA,YAGA,eACC,oBAAoB,UACpB,sBAAsB;AAAA,YAEvB,mBAAoB,sBAAsB;AAAA,YAC1C,MAAO;AAAA,cACN;AAAA,gBACC,KAAK;AAAA,gBACL,WAAO,gBAAI,UAAW;AAAA,gBACtB,gBAAgB;AAAA,gBAChB,mBAAe;AAAA,kBACd,gBAAgB,YAAY,YAC3B,gBAAgB,OAAO;AAAA,kBACxB;AAAA,gBACD;AAAA,gBACA,cAAU;AAAA,kBACT,OAAO,YAAY,YAClB,OAAO,OAAO;AAAA,kBACf;AAAA,gBACD;AAAA,gBACA,UAAU;AAAA,gBACV,WAAW;AAAA,gBACX,YAAY;AAAA,gBACZ,eACC,oBAAoB,UACpB,sBAAsB;AAAA,cACxB;AAAA,YACD;AAAA,YACA,8BAA+B;AAAA,cAC9B;AAAA,cACA,wBAAwB,CAAE;AAAA,YAC3B;AAAA,YACA;AAAA;AAAA,QACD;AAAA,QAEC,kCACD;AAAA,UAAC,oCAAAA;AAAA,UAAA;AAAA,YACA,WAAQ,gBAAI,UAAW;AAAA,YACvB,UAAW,MAAM,4BAA6B,KAAM;AAAA,YACpD,YAAa;AAAA,YACb,kBAAmB,gBAAgB;AAAA,YACnC,YAAa;AAAA,cACZ,2BAA2B;AAAA,YAC5B;AAAA,YACA;AAAA,YAGA,eACC,4BAA4B,UAC5B,wBAAwB;AAAA,YAEzB,mBAAoB,wBAAwB;AAAA,YAC5C,MAAO;AAAA,cACN;AAAA,gBACC,KAAK;AAAA,gBACL,WAAO,gBAAI,UAAW;AAAA,gBACtB,gBAAgB;AAAA,gBAChB,mBAAe;AAAA,kBACd,gBAAgB,OAAO;AAAA,kBACvB;AAAA,gBACD;AAAA,gBACA,cAAU;AAAA,kBACT,OAAO,OAAO;AAAA,kBACd;AAAA,gBACD;AAAA,gBACA,UAAU;AAAA,gBACV,WAAW;AAAA,gBACX,YAAY;AAAA,gBACZ,eACC,4BAA4B,UAC5B,wBAAwB;AAAA,cAC1B;AAAA,YACD;AAAA,YACA,8BAA+B;AAAA,cAC9B;AAAA,cACA,wBAAwB,CAAE;AAAA,YAC3B;AAAA,YACA;AAAA;AAAA,QACD;AAAA;AAAA;AAAA,EAEF;AAEF;",
   "names": ["ToolsPanel", "BackgroundImageControl", "ColorGradientDropdownItem"]
 }

package/build/components/global-styles/border-panel.cjs CHANGED Viewed

@@ -27,7 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-// packages/block-editor/src/components/global-styles/border-panel.js
+// packages/block-editor/src/components/global-styles/border-panel.jsx
 var border_panel_exports = {};
 __export(border_panel_exports, {
   default: () => BorderPanel,
@@ -43,7 +43,6 @@ var import_border_radius_control = __toESM(require("../border-radius-control/ind
 var import_hooks = require("./hooks.cjs");
 var import_utils = require("./utils.cjs");
 var import_object = require("../../utils/object.cjs");
-var import_border = require("../../hooks/border.cjs");
 var import_shadow_panel_components = require("./shadow-panel-components.cjs");
 var import_inheritance = require("./inheritance/index.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -285,11 +284,6 @@ function BorderPanel({
     };
   }, []);
   const showBorderByDefault = defaultControls?.color || defaultControls?.width;
-  const hasBorderControl = showBorderColor || showBorderStyle || showBorderWidth || showBorderRadius;
-  const label = (0, import_border.useBorderPanelLabel)({
-    hasShadowControl,
-    hasBorderControl
-  });
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     Wrapper,
     {
@@ -297,9 +291,9 @@ function BorderPanel({
       value,
       onChange,
       panelId,
-      label,
+      label: (0, import_i18n.__)("Borders"),
       children: [
-        (showBorderWidth || showBorderColor) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        (showBorderWidth || showBorderColor) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           import_inheritance.InheritanceToolsPanelItem,
           {
             ...inheritanceProps(
@@ -308,42 +302,25 @@ function BorderPanel({
             ),
             hasValue: () => (0, import_components.__experimentalIsDefinedBorder)(value?.border),
             label: (0, import_i18n.__)("Border"),
+            hasInlineEndToggle: true,
             onDeselect: () => resetBorder(),
             isShownByDefault: showBorderByDefault,
             panelId,
-            children: [
-              (showInheritanceLabelIndicators || hasShadowControl) && // Render the visible label as `BaseControl.VisualLabel`
-              // (which produces `.components-base-control__label`)
-              // rather than passing `label` to `BorderBoxControl`,
-              // whose internal `<StyledLabel>` carries no stable
-              // className. The inheritance treatment and the
-              // local-override reset affordance both target
-              // `.components-base-control__label`, so the visible
-              // "Border" label has to be a `BaseControl` label to
-              // receive them.
-              //
-              // Render it whenever a Shadow control is also present so
-              // the two controls stay disambiguated (mirrors the
-              // Shadow label's `hasBorderControl` guard below, and
-              // trunk's `hideLabelFromVision={ ! hasShadowControl }`),
-              // even when inheritance indicators are off (e.g. in
-              // Global Styles).
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.BaseControl.VisualLabel, { as: "legend", children: (0, import_i18n.__)("Border") }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                import_components.BorderBoxControl,
-                {
-                  colors,
-                  disableCustomColors: !areCustomSolidsEnabled,
-                  enableAlpha: true,
-                  enableStyle: showBorderStyle,
-                  onChange: onBorderChange,
-                  popoverOffset: 40,
-                  popoverPlacement: "left-start",
-                  value: border,
-                  __experimentalIsRenderedInSidebar: true
-                }
-              )
-            ]
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_components.BorderBoxControl,
+              {
+                colors,
+                disableCustomColors: !areCustomSolidsEnabled,
+                enableAlpha: true,
+                enableStyle: showBorderStyle,
+                label: (0, import_i18n.__)("Border"),
+                onChange: onBorderChange,
+                popoverOffset: 40,
+                popoverPlacement: "left-start",
+                value: border,
+                __experimentalIsRenderedInSidebar: true
+              }
+            )
           }
         ),
         showBorderRadius && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -385,7 +362,7 @@ function BorderPanel({
             showLocalOverrideActionsInLabel: false,
             panelId,
             children: [
-              hasBorderControl ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.BaseControl.VisualLabel, { as: "legend", children: (0, import_i18n.__)("Shadow") }) : null,
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.BaseControl.VisualLabel, { children: (0, import_i18n.__)("Shadow") }),
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                 import_shadow_panel_components.ShadowPopover,
                 {