@wordpress/block-editor 15.17.0 → 15.18.0

package/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 ## Unreleased
 
+## 15.18.0 (2026-04-29)
+
+### Enhancements
+
+-   Use `--wpds-cursor-control` for interactive cursor styling and replace all instances ([#77354](https://github.com/WordPress/gutenberg/pull/77354)).
+
 ## 15.17.0 (2026-04-15)
 
 ## 15.16.0 (2026-04-01)

package/build/components/autocomplete/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/autocomplete/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { applyFilters, hasFilter } from '@wordpress/hooks';\nimport {\n\tAutocomplete,\n\t__unstableUseAutocompleteProps as useAutocompleteProps,\n} from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\nimport { getDefaultBlockName, getBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { useBlockEditContext } from '../block-edit/context';\nimport blockAutocompleter from '../../autocompleters/block';\n\n/**\n * Shared reference to an empty array for cases where it is important to avoid\n * returning a new array reference on every invocation.\n *\n * @type {Array}\n */\nconst EMPTY_ARRAY = [];\n\nfunction useCompleters( { completers = EMPTY_ARRAY } ) {\n\tconst { name } = useBlockEditContext();\n\treturn useMemo( () => {\n\t\tlet filteredCompleters = [ ...completers ];\n\n\t\tif (\n\t\t\tname === getDefaultBlockName() ||\n\t\t\tgetBlockSupport( name, '__experimentalSlashInserter', false )\n\t\t) {\n\t\t\tfilteredCompleters = [ ...filteredCompleters, blockAutocompleter ];\n\t\t}\n\n\t\tif ( hasFilter( 'editor.Autocomplete.completers' ) ) {\n\t\t\t// Provide copies so filters may directly modify them.\n\t\t\tif ( filteredCompleters === completers ) {\n\t\t\t\tfilteredCompleters = filteredCompleters.map(\n\t\t\t\t\t( completer ) => ( { ...completer } )\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tfilteredCompleters = applyFilters(\n\t\t\t\t'editor.Autocomplete.completers',\n\t\t\t\tfilteredCompleters,\n\t\t\t\tname\n\t\t\t);\n\t\t}\n\n\t\treturn filteredCompleters;\n\t}, [ completers, name ] );\n}\n\nexport function useBlockEditorAutocompleteProps( props ) {\n\treturn useAutocompleteProps( {\n\t\t...props,\n\t\tcompleters: useCompleters( props ),\n\t} );\n}\n\n/**\n * Wrap the default Autocomplete component with one that supports a filter hook\n * for customizing its list of autocompleters.\n *\n * @type {React.FC}\n */\nfunction BlockEditorAutocomplete( props ) {\n\treturn <Autocomplete { ...props } completers={ useCompleters( props ) } />;\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/autocomplete/README.md\n */\nexport default BlockEditorAutocomplete;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAAwC;AACxC,wBAGO;AACP,qBAAwB;AACxB,oBAAqD;AAKrD,qBAAoC;AACpC,mBAA+B;AAuDvB;AA/CR,IAAM,cAAc,CAAC;AAErB,SAAS,cAAe,EAAE,aAAa,YAAY,GAAI;AACtD,QAAM,EAAE,KAAK,QAAI,oCAAoB;AACrC,aAAO,wBAAS,MAAM;AACrB,QAAI,qBAAqB,CAAE,GAAG,UAAW;AAEzC,QACC,aAAS,mCAAoB,SAC7B,+BAAiB,MAAM,+BAA+B,KAAM,GAC3D;AACD,2BAAqB,CAAE,GAAG,oBAAoB,aAAAA,OAAmB;AAAA,IAClE;AAEA,YAAK,wBAAW,gCAAiC,GAAI;AAEpD,UAAK,uBAAuB,YAAa;AACxC,6BAAqB,mBAAmB;AAAA,UACvC,CAAE,eAAiB,EAAE,GAAG,UAAU;AAAA,QACnC;AAAA,MACD;AAEA,+BAAqB;AAAA,QACpB;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,IACD;AAEA,WAAO;AAAA,EACR,GAAG,CAAE,YAAY,IAAK,CAAE;AACzB;AAEO,SAAS,gCAAiC,OAAQ;AACxD,aAAO,kBAAAC,gCAAsB;AAAA,IAC5B,GAAG;AAAA,IACH,YAAY,cAAe,KAAM;AAAA,EAClC,CAAE;AACH;AAQA,SAAS,wBAAyB,OAAQ;AACzC,SAAO,4CAAC,kCAAe,GAAG,OAAQ,YAAa,cAAe,KAAM,GAAI;AACzE;AAKA,IAAO,uBAAQ;",
-  "names": ["blockAutocompleter", "useAutocompleteProps"]
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { applyFilters, hasFilter } from '@wordpress/hooks';\nimport {\n\tAutocomplete as WCAutocomplete,\n\t__unstableUseAutocompleteProps as useAutocompleteProps,\n} from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\nimport { getDefaultBlockName, getBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { useBlockEditContext } from '../block-edit/context';\nimport blockAutocompleter from '../../autocompleters/block';\n\n/**\n * Shared reference to an empty array for cases where it is important to avoid\n * returning a new array reference on every invocation.\n *\n * @type {Array}\n */\nconst EMPTY_ARRAY = [];\n\nfunction useCompleters( { completers = EMPTY_ARRAY } ) {\n\tconst { name } = useBlockEditContext();\n\treturn useMemo( () => {\n\t\tlet filteredCompleters = [ ...completers ];\n\n\t\tif (\n\t\t\tname === getDefaultBlockName() ||\n\t\t\tgetBlockSupport( name, '__experimentalSlashInserter', false )\n\t\t) {\n\t\t\tfilteredCompleters = [ ...filteredCompleters, blockAutocompleter ];\n\t\t}\n\n\t\tif ( hasFilter( 'editor.Autocomplete.completers' ) ) {\n\t\t\t// Provide copies so filters may directly modify them.\n\t\t\tif ( filteredCompleters === completers ) {\n\t\t\t\tfilteredCompleters = filteredCompleters.map(\n\t\t\t\t\t( completer ) => ( { ...completer } )\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tfilteredCompleters = applyFilters(\n\t\t\t\t'editor.Autocomplete.completers',\n\t\t\t\tfilteredCompleters,\n\t\t\t\tname\n\t\t\t);\n\t\t}\n\n\t\treturn filteredCompleters;\n\t}, [ completers, name ] );\n}\n\nexport function useBlockEditorAutocompleteProps( props ) {\n\treturn useAutocompleteProps( {\n\t\t...props,\n\t\tcompleters: useCompleters( props ),\n\t} );\n}\n\n/**\n * Wrap the default Autocomplete component with one that supports a filter hook\n * for customizing its list of autocompleters.\n *\n * @type {React.FC}\n */\nfunction BlockEditorAutocomplete( props ) {\n\treturn (\n\t\t<WCAutocomplete { ...props } completers={ useCompleters( props ) } />\n\t);\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/autocomplete/README.md\n */\nexport default BlockEditorAutocomplete;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAAwC;AACxC,wBAGO;AACP,qBAAwB;AACxB,oBAAqD;AAKrD,qBAAoC;AACpC,mBAA+B;AAwD7B;AAhDF,IAAM,cAAc,CAAC;AAErB,SAAS,cAAe,EAAE,aAAa,YAAY,GAAI;AACtD,QAAM,EAAE,KAAK,QAAI,oCAAoB;AACrC,aAAO,wBAAS,MAAM;AACrB,QAAI,qBAAqB,CAAE,GAAG,UAAW;AAEzC,QACC,aAAS,mCAAoB,SAC7B,+BAAiB,MAAM,+BAA+B,KAAM,GAC3D;AACD,2BAAqB,CAAE,GAAG,oBAAoB,aAAAA,OAAmB;AAAA,IAClE;AAEA,YAAK,wBAAW,gCAAiC,GAAI;AAEpD,UAAK,uBAAuB,YAAa;AACxC,6BAAqB,mBAAmB;AAAA,UACvC,CAAE,eAAiB,EAAE,GAAG,UAAU;AAAA,QACnC;AAAA,MACD;AAEA,+BAAqB;AAAA,QACpB;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,IACD;AAEA,WAAO;AAAA,EACR,GAAG,CAAE,YAAY,IAAK,CAAE;AACzB;AAEO,SAAS,gCAAiC,OAAQ;AACxD,aAAO,kBAAAC,gCAAsB;AAAA,IAC5B,GAAG;AAAA,IACH,YAAY,cAAe,KAAM;AAAA,EAClC,CAAE;AACH;AAQA,SAAS,wBAAyB,OAAQ;AACzC,SACC,4CAAC,kBAAAC,cAAA,EAAiB,GAAG,OAAQ,YAAa,cAAe,KAAM,GAAI;AAErE;AAKA,IAAO,uBAAQ;",
+  "names": ["blockAutocompleter", "useAutocompleteProps", "WCAutocomplete"]
 }

package/build/components/background-image-control/index.cjs

@@ -37,6 +37,7 @@ __export(background_image_control_exports, {
 module.exports = __toCommonJS(background_image_control_exports);
 var import_clsx = __toESM(require("clsx"));
 var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_icons = require("@wordpress/icons");
 var import_i18n = require("@wordpress/i18n");
 var import_notices = require("@wordpress/notices");
@@ -130,7 +131,7 @@ function InspectorImagePreviewItem({
             children: label
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { as: "span", children: imgUrl ? (0, import_i18n.sprintf)(
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.VisuallyHidden, { render: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {}), children: imgUrl ? (0, import_i18n.sprintf)(
           /* translators: %s: file name */
           (0, import_i18n.__)("Background image: %s"),
           filename || label

package/build/components/background-image-control/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/background-image-control/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tToggleControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalVStack as VStack,\n\tDropZone,\n\tFlexBlock,\n\tFocalPointPicker,\n\tMenuItem,\n\tVisuallyHidden,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tDropdown,\n\tPlaceholder,\n\tSpinner,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { reset as resetIcon } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { getFilename } from '@wordpress/url';\nimport { useRef, useState, useEffect, useMemo } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { focus } from '@wordpress/dom';\nimport { isBlobURL } from '@wordpress/blob';\nimport { getResolvedValue } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { hasBackgroundImageValue } from '../global-styles/background-panel';\nimport { setImmutably } from '../../utils/object';\nimport MediaReplaceFlow from '../media-replace-flow';\nimport { store as blockEditorStore } from '../../store';\n\nimport {\n\tglobalStylesDataKey,\n\tglobalStylesLinksDataKey,\n} from '../../store/private-keys';\n\nconst IMAGE_BACKGROUND_TYPE = 'image';\n\nconst BACKGROUND_POPOVER_PROPS = {\n\tplacement: 'left-start',\n\toffset: 36,\n\tshift: true,\n\tclassName: 'block-editor-global-styles-background-panel__popover',\n};\nconst noop = () => {};\n\n/**\n * Focuses the toggle button.\n * @param {Object} containerRef - ref object containing current element\n */\nconst focusToggleButton = ( containerRef ) => {\n\t// Use requestAnimationFrame to ensure DOM updates are complete\n\twindow.requestAnimationFrame( () => {\n\t\tconst [ toggleButton ] = focus.tabbable.find( containerRef?.current );\n\t\tif ( ! toggleButton ) {\n\t\t\treturn;\n\t\t}\n\t\t// Focus the toggle button and close the dropdown menu.\n\t\t// This ensures similar behaviour as to selecting an image, where the dropdown is\n\t\t// closed and focus is redirected to the dropdown toggle button.\n\t\ttoggleButton.focus();\n\t} );\n};\n\n/**\n * Get the help text for the background size control.\n *\n * @param {string} value backgroundSize value.\n * @return {string}      Translated help text.\n */\nfunction backgroundSizeHelpText( value ) {\n\tif ( value === 'cover' || value === undefined ) {\n\t\treturn __( 'Image covers the space evenly.' );\n\t}\n\tif ( value === 'contain' ) {\n\t\treturn __( 'Image is contained without distortion.' );\n\t}\n\treturn __( 'Image has a fixed width.' );\n}\n\n/**\n * Converts decimal x and y coords from FocalPointPicker to percentage-based values\n * to use as backgroundPosition value.\n *\n * @param {{x?:number, y?:number}} value FocalPointPicker coords.\n * @return {string}      \t\t\t\t backgroundPosition value.\n */\nexport const coordsToBackgroundPosition = ( value ) => {\n\tif ( ! value || ( isNaN( value.x ) && isNaN( value.y ) ) ) {\n\t\treturn undefined;\n\t}\n\n\tconst x = isNaN( value.x ) ? 0.5 : value.x;\n\tconst y = isNaN( value.y ) ? 0.5 : value.y;\n\n\treturn `${ x * 100 }% ${ y * 100 }%`;\n};\n\n/**\n * Converts backgroundPosition value to x and y coords for FocalPointPicker.\n *\n * @param {string} value backgroundPosition value.\n * @return {{x?:number, y?:number}}       FocalPointPicker coords.\n */\nexport const backgroundPositionToCoords = ( value ) => {\n\tif ( ! value ) {\n\t\treturn { x: undefined, y: undefined };\n\t}\n\n\tlet [ x, y ] = value.split( ' ' ).map( ( v ) => parseFloat( v ) / 100 );\n\tx = isNaN( x ) ? undefined : x;\n\ty = isNaN( y ) ? x : y;\n\n\treturn { x, y };\n};\n\nfunction InspectorImagePreviewItem( {\n\tas = 'span',\n\timgUrl,\n\ttoggleProps = {},\n\tfilename,\n\tlabel,\n\tonToggleCallback = noop,\n} ) {\n\tconst { isOpen, ...restToggleProps } = toggleProps;\n\n\tuseEffect( () => {\n\t\tif ( typeof isOpen !== 'undefined' ) {\n\t\t\tonToggleCallback( isOpen );\n\t\t}\n\t}, [ isOpen, onToggleCallback ] );\n\n\tconst renderPreviewContent = () => {\n\t\treturn (\n\t\t\t<HStack className=\"block-editor-global-styles-background-panel__inspector-preview-inner\">\n\t\t\t\t<span\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-image-indicator\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tbackgroundImage: imgUrl\n\t\t\t\t\t\t\t? `url(${ imgUrl })`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<FlexBlock>\n\t\t\t\t\t<Truncate\n\t\t\t\t\t\tnumberOfLines={ 1 }\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-media-replace-title\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</Truncate>\n\t\t\t\t\t<VisuallyHidden as=\"span\">\n\t\t\t\t\t\t{ imgUrl\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: file name */\n\t\t\t\t\t\t\t\t\t__( 'Background image: %s' ),\n\t\t\t\t\t\t\t\t\tfilename || label\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: __( 'No background image selected' ) }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t</FlexBlock>\n\t\t\t</HStack>\n\t\t);\n\t};\n\n\treturn as === 'button' ? (\n\t\t<Button __next40pxDefaultSize { ...restToggleProps }>\n\t\t\t{ renderPreviewContent() }\n\t\t</Button>\n\t) : (\n\t\trenderPreviewContent()\n\t);\n}\n\nfunction BackgroundControlsPanel( {\n\tlabel,\n\tfilename,\n\turl: imgUrl,\n\tchildren,\n\tonToggle: onToggleCallback = noop,\n\thasImageValue,\n\tonReset,\n\tcontainerRef,\n} ) {\n\tif ( ! hasImageValue ) {\n\t\treturn;\n\t}\n\n\tconst imgLabel = label || getFilename( imgUrl ) || __( 'Image' );\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ BACKGROUND_POPOVER_PROPS }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\tconst toggleProps = {\n\t\t\t\t\tonClick: onToggle,\n\t\t\t\t\tclassName:\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__dropdown-toggle',\n\t\t\t\t\t'aria-expanded': isOpen,\n\t\t\t\t\t'aria-label': __(\n\t\t\t\t\t\t'Background size, position and repeat options.'\n\t\t\t\t\t),\n\t\t\t\t\tisOpen,\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\t\timgUrl={ imgUrl }\n\t\t\t\t\t\t\tfilename={ filename }\n\t\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t\t\ttoggleProps={ toggleProps }\n\t\t\t\t\t\t\tas=\"button\"\n\t\t\t\t\t\t\tonToggleCallback={ onToggleCallback }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ onReset && (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__reset\"\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\ticon={ resetIcon }\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\t\t\t// Close the dropdown if open.\n\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Focus the toggle button.\n\t\t\t\t\t\t\t\t\tfocusToggleButton( containerRef );\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\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__dropdown-content-wrapper\"\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction LoadingSpinner() {\n\treturn (\n\t\t<Placeholder className=\"block-editor-global-styles-background-panel__loading\">\n\t\t\t<Spinner />\n\t\t</Placeholder>\n\t);\n}\n\nfunction BackgroundImageControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tonRemoveImage = noop,\n\tonResetImage = noop,\n\tdisplayInPanel,\n\tdefaultValues,\n\tcontainerRef,\n} ) {\n\tconst [ isUploading, setIsUploading ] = useState( false );\n\tconst { getSettings } = useSelect( blockEditorStore );\n\n\tconst { id, title, url } = style?.background?.backgroundImage || {\n\t\t...inheritedValue?.background?.backgroundImage,\n\t};\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst onUploadError = ( message ) => {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\tsetIsUploading( false );\n\t};\n\n\tconst resetBackgroundImage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\tundefined\n\t\t\t)\n\t\t);\n\n\tconst onSelectMedia = ( media ) => {\n\t\tif ( ! media || ! media.url ) {\n\t\t\tresetBackgroundImage();\n\t\t\tsetIsUploading( false );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tsetIsUploading( true );\n\t\t\treturn;\n\t\t}\n\n\t\t// For media selections originated from a file upload.\n\t\tif (\n\t\t\t( media.media_type &&\n\t\t\t\tmedia.media_type !== IMAGE_BACKGROUND_TYPE ) ||\n\t\t\t( ! media.media_type &&\n\t\t\t\tmedia.type &&\n\t\t\t\tmedia.type !== IMAGE_BACKGROUND_TYPE )\n\t\t) {\n\t\t\tonUploadError(\n\t\t\t\t__( 'Only images can be used as a background image.' )\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tconst sizeValue =\n\t\t\tstyle?.background?.backgroundSize || defaultValues?.backgroundSize;\n\t\tconst positionValue = style?.background?.backgroundPosition;\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundImage: {\n\t\t\t\t\turl: media.url,\n\t\t\t\t\tid: media.id,\n\t\t\t\t\tsource: 'file',\n\t\t\t\t\ttitle: media.title || undefined,\n\t\t\t\t},\n\t\t\t\tbackgroundPosition:\n\t\t\t\t\t/*\n\t\t\t\t\t * A background image uploaded and set in the editor receives a default background position of '50% 0',\n\t\t\t\t\t * when the background image size is the equivalent of \"Tile\".\n\t\t\t\t\t * This is to increase the chance that the image's focus point is visible.\n\t\t\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t\t\t */\n\t\t\t\t\t! positionValue && ( 'auto' === sizeValue || ! sizeValue )\n\t\t\t\t\t\t? '50% 0'\n\t\t\t\t\t\t: positionValue,\n\t\t\t\tbackgroundSize: sizeValue,\n\t\t\t} )\n\t\t);\n\t\tsetIsUploading( false );\n\t\t// Close the dropdown and focus the toggle button.\n\t\tfocusToggleButton( containerRef );\n\t};\n\n\t// Drag and drop callback, restricting image to one.\n\tconst onFilesDrop = ( filesList ) => {\n\t\tgetSettings().mediaUpload( {\n\t\t\tallowedTypes: [ IMAGE_BACKGROUND_TYPE ],\n\t\t\tfilesList,\n\t\t\tonFileChange( [ image ] ) {\n\t\t\t\tonSelectMedia( image );\n\t\t\t},\n\t\t\tonError: onUploadError,\n\t\t\tmultiple: false,\n\t\t} );\n\t};\n\n\tconst hasValue = hasBackgroundImageValue( style );\n\n\tconst onRemove = () =>\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\tbackgroundImage: 'none',\n\t\t\t} )\n\t\t);\n\tconst canRemove = ! hasValue && hasBackgroundImageValue( inheritedValue );\n\tconst imgLabel = title || getFilename( url ) || __( 'Image' );\n\n\treturn (\n\t\t<div className=\"block-editor-global-styles-background-panel__image-tools-panel-item\">\n\t\t\t{ isUploading && <LoadingSpinner /> }\n\t\t\t<MediaReplaceFlow\n\t\t\t\tmediaId={ id }\n\t\t\t\tmediaURL={ url }\n\t\t\t\tallowedTypes={ [ IMAGE_BACKGROUND_TYPE ] }\n\t\t\t\taccept=\"image/*\"\n\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\tpopoverProps={ {\n\t\t\t\t\tclassName: clsx( {\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__media-replace-popover':\n\t\t\t\t\t\t\tdisplayInPanel,\n\t\t\t\t\t} ),\n\t\t\t\t} }\n\t\t\t\tname={\n\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\timgUrl={ url }\n\t\t\t\t\t\tfilename={ title }\n\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\trenderToggle={ ( props ) => (\n\t\t\t\t\t<Button { ...props } __next40pxDefaultSize />\n\t\t\t\t) }\n\t\t\t\tonError={ onUploadError }\n\t\t\t\tonReset={ () => {\n\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\tonResetImage();\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ canRemove && (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\tonRemove();\n\t\t\t\t\t\t\tonRemoveImage();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) }\n\t\t\t</MediaReplaceFlow>\n\t\t\t<DropZone\n\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\tlabel={ __( 'Drop to upload' ) }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction BackgroundSizeControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tdefaultValues,\n} ) {\n\tconst sizeValue =\n\t\tstyle?.background?.backgroundSize ||\n\t\tinheritedValue?.background?.backgroundSize;\n\tconst repeatValue =\n\t\tstyle?.background?.backgroundRepeat ||\n\t\tinheritedValue?.background?.backgroundRepeat;\n\tconst imageValue =\n\t\tstyle?.background?.backgroundImage?.url ||\n\t\tinheritedValue?.background?.backgroundImage?.url;\n\tconst isUploadedImage = style?.background?.backgroundImage?.id;\n\tconst positionValue =\n\t\tstyle?.background?.backgroundPosition ||\n\t\tinheritedValue?.background?.backgroundPosition;\n\tconst attachmentValue =\n\t\tstyle?.background?.backgroundAttachment ||\n\t\tinheritedValue?.background?.backgroundAttachment;\n\n\t/*\n\t * Set default values for uploaded images.\n\t * The default values are passed by the consumer.\n\t * Block-level controls may have different defaults to root-level controls.\n\t * A falsy value is treated by default as `auto` (Tile).\n\t */\n\tlet currentValueForToggle =\n\t\t! sizeValue && isUploadedImage\n\t\t\t? defaultValues?.backgroundSize\n\t\t\t: sizeValue || 'auto';\n\t/*\n\t * The incoming value could be a value + unit, e.g. '20px'.\n\t * In this case set the value to 'tile'.\n\t */\n\tcurrentValueForToggle = ! [ 'cover', 'contain', 'auto' ].includes(\n\t\tcurrentValueForToggle\n\t)\n\t\t? 'auto'\n\t\t: currentValueForToggle;\n\t/*\n\t * If the current value is `cover` and the repeat value is `undefined`, then\n\t * the toggle should be unchecked as the default state. Otherwise, the toggle\n\t * should reflect the current repeat value.\n\t */\n\tconst repeatCheckedValue = ! (\n\t\trepeatValue === 'no-repeat' ||\n\t\t( currentValueForToggle === 'cover' && repeatValue === undefined )\n\t);\n\n\tconst updateBackgroundSize = ( next ) => {\n\t\t// When switching to 'contain' toggle the repeat off.\n\t\tlet nextRepeat = repeatValue;\n\t\tlet nextPosition = positionValue;\n\n\t\tif ( next === 'contain' ) {\n\t\t\tnextRepeat = 'no-repeat';\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif ( next === 'cover' ) {\n\t\t\tnextRepeat = undefined;\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif (\n\t\t\t( currentValueForToggle === 'cover' ||\n\t\t\t\tcurrentValueForToggle === 'contain' ) &&\n\t\t\tnext === 'auto'\n\t\t) {\n\t\t\tnextRepeat = undefined;\n\t\t\t/*\n\t\t\t * A background image uploaded and set in the editor (an image with a record id),\n\t\t\t * receives a default background position of '50% 0',\n\t\t\t * when the toggle switches to \"Tile\". This is to increase the chance that\n\t\t\t * the image's focus point is visible.\n\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t */\n\t\t\tif ( !! style?.background?.backgroundImage?.id ) {\n\t\t\t\tnextPosition = '50% 0';\n\t\t\t}\n\t\t}\n\n\t\t/*\n\t\t * Next will be null when the input is cleared,\n\t\t * in which case the value should be 'auto'.\n\t\t */\n\t\tif ( ! next && currentValueForToggle === 'auto' ) {\n\t\t\tnext = 'auto';\n\t\t}\n\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundPosition: nextPosition,\n\t\t\t\tbackgroundRepeat: nextRepeat,\n\t\t\t\tbackgroundSize: next,\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst updateBackgroundPosition = ( next ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t\tcoordsToBackgroundPosition( next )\n\t\t\t)\n\t\t);\n\t};\n\n\tconst toggleIsRepeated = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t\trepeatCheckedValue === true ? 'no-repeat' : 'repeat'\n\t\t\t)\n\t\t);\n\n\tconst toggleScrollWithPage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t\tattachmentValue === 'fixed' ? 'scroll' : 'fixed'\n\t\t\t)\n\t\t);\n\n\t// Set a default background position for non-site-wide, uploaded images with a size of 'contain'.\n\tconst backgroundPositionValue =\n\t\t! positionValue && isUploadedImage && 'contain' === sizeValue\n\t\t\t? defaultValues?.backgroundPosition\n\t\t\t: positionValue;\n\n\treturn (\n\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t<FocalPointPicker\n\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\turl={ imageValue }\n\t\t\t\tvalue={ backgroundPositionToCoords( backgroundPositionValue ) }\n\t\t\t\tonChange={ updateBackgroundPosition }\n\t\t\t/>\n\t\t\t<ToggleControl\n\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\tchecked={ attachmentValue === 'fixed' }\n\t\t\t\tonChange={ toggleScrollWithPage }\n\t\t\t/>\n\t\t\t<ToggleGroupControl\n\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\tlabel={ __( 'Size' ) }\n\t\t\t\tvalue={ currentValueForToggle }\n\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\tisBlock\n\t\t\t\thelp={ backgroundSizeHelpText(\n\t\t\t\t\tsizeValue || defaultValues?.backgroundSize\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"cover\"\n\t\t\t\t\tvalue=\"cover\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Cover',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"contain\"\n\t\t\t\t\tvalue=\"contain\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Contain',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"tile\"\n\t\t\t\t\tvalue=\"auto\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Tile',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</ToggleGroupControl>\n\t\t\t<HStack justify=\"flex-start\" spacing={ 2 } as=\"span\">\n\t\t\t\t<UnitControl\n\t\t\t\t\taria-label={ __( 'Background image width' ) }\n\t\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\t\tvalue={ sizeValue }\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t__unstableInputWidth=\"100px\"\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tdisabled={\n\t\t\t\t\t\tcurrentValueForToggle !== 'auto' ||\n\t\t\t\t\t\tcurrentValueForToggle === undefined\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Repeat' ) }\n\t\t\t\t\tchecked={ repeatCheckedValue }\n\t\t\t\t\tonChange={ toggleIsRepeated }\n\t\t\t\t\tdisabled={ currentValueForToggle === 'cover' }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function BackgroundImagePanel( {\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tdefaultValues = {},\n} ) {\n\t/*\n\t * Resolve any inherited \"ref\" pointers.\n\t * Should the block editor need resolved, inherited values\n\t * across all controls, this could be abstracted into a hook,\n\t * e.g., useResolveGlobalStyle\n\t */\n\tconst { globalStyles, _links } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst _settings = getSettings();\n\t\treturn {\n\t\t\tglobalStyles: _settings[ globalStylesDataKey ],\n\t\t\t_links: _settings[ globalStylesLinksDataKey ],\n\t\t};\n\t}, [] );\n\tconst resolvedInheritedValue = useMemo( () => {\n\t\tconst resolvedValues = {\n\t\t\tbackground: {},\n\t\t};\n\n\t\tif ( ! inheritedValue?.background ) {\n\t\t\treturn inheritedValue;\n\t\t}\n\n\t\tObject.entries( inheritedValue?.background ).forEach(\n\t\t\t( [ key, backgroundValue ] ) => {\n\t\t\t\tresolvedValues.background[ key ] = getResolvedValue(\n\t\t\t\t\tbackgroundValue,\n\t\t\t\t\t{\n\t\t\t\t\t\tstyles: globalStyles,\n\t\t\t\t\t\t_links,\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\t\treturn resolvedValues;\n\t}, [ globalStyles, _links, inheritedValue ] );\n\n\tconst resetBackground = () =>\n\t\tonChange( setImmutably( value, [ 'background' ], {} ) );\n\n\tconst { title, url } = value?.background?.backgroundImage || {\n\t\t...resolvedInheritedValue?.background?.backgroundImage,\n\t};\n\tconst hasImageValue =\n\t\thasBackgroundImageValue( value ) ||\n\t\thasBackgroundImageValue( resolvedInheritedValue );\n\n\tconst imageValue =\n\t\tvalue?.background?.backgroundImage ||\n\t\tinheritedValue?.background?.backgroundImage;\n\n\tconst shouldShowBackgroundImageControls =\n\t\thasImageValue &&\n\t\t'none' !== imageValue &&\n\t\t( settings?.background?.backgroundSize ||\n\t\t\tsettings?.background?.backgroundPosition ||\n\t\t\tsettings?.background?.backgroundRepeat );\n\n\tconst [ isDropDownOpen, setIsDropDownOpen ] = useState( false );\n\tconst containerRef = useRef();\n\n\treturn (\n\t\t<div\n\t\t\tref={ containerRef }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-global-styles-background-panel__inspector-media-replace-container',\n\t\t\t\t{\n\t\t\t\t\t'is-open': isDropDownOpen,\n\t\t\t\t}\n\t\t\t) }\n\t\t>\n\t\t\t{ shouldShowBackgroundImageControls ? (\n\t\t\t\t<BackgroundControlsPanel\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tfilename={ title }\n\t\t\t\t\turl={ url }\n\t\t\t\t\tonToggle={ setIsDropDownOpen }\n\t\t\t\t\thasImageValue={ hasImageValue }\n\t\t\t\t\tonReset={ resetBackground }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t\t\t\t<BackgroundImageControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t\tdisplayInPanel\n\t\t\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BackgroundSizeControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t</BackgroundControlsPanel>\n\t\t\t) : (\n\t\t\t\t<BackgroundImageControls\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tstyle={ value }\n\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t} }\n\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tToggleControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalVStack as VStack,\n\tDropZone,\n\tFlexBlock,\n\tFocalPointPicker,\n\tMenuItem,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tDropdown,\n\tPlaceholder,\n\tSpinner,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport { reset as resetIcon } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { getFilename } from '@wordpress/url';\nimport { useRef, useState, useEffect, useMemo } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { focus } from '@wordpress/dom';\nimport { isBlobURL } from '@wordpress/blob';\nimport { getResolvedValue } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { hasBackgroundImageValue } from '../global-styles/background-panel';\nimport { setImmutably } from '../../utils/object';\nimport MediaReplaceFlow from '../media-replace-flow';\nimport { store as blockEditorStore } from '../../store';\n\nimport {\n\tglobalStylesDataKey,\n\tglobalStylesLinksDataKey,\n} from '../../store/private-keys';\n\nconst IMAGE_BACKGROUND_TYPE = 'image';\n\nconst BACKGROUND_POPOVER_PROPS = {\n\tplacement: 'left-start',\n\toffset: 36,\n\tshift: true,\n\tclassName: 'block-editor-global-styles-background-panel__popover',\n};\nconst noop = () => {};\n\n/**\n * Focuses the toggle button.\n * @param {Object} containerRef - ref object containing current element\n */\nconst focusToggleButton = ( containerRef ) => {\n\t// Use requestAnimationFrame to ensure DOM updates are complete\n\twindow.requestAnimationFrame( () => {\n\t\tconst [ toggleButton ] = focus.tabbable.find( containerRef?.current );\n\t\tif ( ! toggleButton ) {\n\t\t\treturn;\n\t\t}\n\t\t// Focus the toggle button and close the dropdown menu.\n\t\t// This ensures similar behaviour as to selecting an image, where the dropdown is\n\t\t// closed and focus is redirected to the dropdown toggle button.\n\t\ttoggleButton.focus();\n\t} );\n};\n\n/**\n * Get the help text for the background size control.\n *\n * @param {string} value backgroundSize value.\n * @return {string}      Translated help text.\n */\nfunction backgroundSizeHelpText( value ) {\n\tif ( value === 'cover' || value === undefined ) {\n\t\treturn __( 'Image covers the space evenly.' );\n\t}\n\tif ( value === 'contain' ) {\n\t\treturn __( 'Image is contained without distortion.' );\n\t}\n\treturn __( 'Image has a fixed width.' );\n}\n\n/**\n * Converts decimal x and y coords from FocalPointPicker to percentage-based values\n * to use as backgroundPosition value.\n *\n * @param {{x?:number, y?:number}} value FocalPointPicker coords.\n * @return {string}      \t\t\t\t backgroundPosition value.\n */\nexport const coordsToBackgroundPosition = ( value ) => {\n\tif ( ! value || ( isNaN( value.x ) && isNaN( value.y ) ) ) {\n\t\treturn undefined;\n\t}\n\n\tconst x = isNaN( value.x ) ? 0.5 : value.x;\n\tconst y = isNaN( value.y ) ? 0.5 : value.y;\n\n\treturn `${ x * 100 }% ${ y * 100 }%`;\n};\n\n/**\n * Converts backgroundPosition value to x and y coords for FocalPointPicker.\n *\n * @param {string} value backgroundPosition value.\n * @return {{x?:number, y?:number}}       FocalPointPicker coords.\n */\nexport const backgroundPositionToCoords = ( value ) => {\n\tif ( ! value ) {\n\t\treturn { x: undefined, y: undefined };\n\t}\n\n\tlet [ x, y ] = value.split( ' ' ).map( ( v ) => parseFloat( v ) / 100 );\n\tx = isNaN( x ) ? undefined : x;\n\ty = isNaN( y ) ? x : y;\n\n\treturn { x, y };\n};\n\nfunction InspectorImagePreviewItem( {\n\tas = 'span',\n\timgUrl,\n\ttoggleProps = {},\n\tfilename,\n\tlabel,\n\tonToggleCallback = noop,\n} ) {\n\tconst { isOpen, ...restToggleProps } = toggleProps;\n\n\tuseEffect( () => {\n\t\tif ( typeof isOpen !== 'undefined' ) {\n\t\t\tonToggleCallback( isOpen );\n\t\t}\n\t}, [ isOpen, onToggleCallback ] );\n\n\tconst renderPreviewContent = () => {\n\t\treturn (\n\t\t\t<HStack className=\"block-editor-global-styles-background-panel__inspector-preview-inner\">\n\t\t\t\t<span\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-image-indicator\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tbackgroundImage: imgUrl\n\t\t\t\t\t\t\t? `url(${ imgUrl })`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<FlexBlock>\n\t\t\t\t\t<Truncate\n\t\t\t\t\t\tnumberOfLines={ 1 }\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-media-replace-title\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</Truncate>\n\t\t\t\t\t<VisuallyHidden render={ <span /> }>\n\t\t\t\t\t\t{ imgUrl\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: file name */\n\t\t\t\t\t\t\t\t\t__( 'Background image: %s' ),\n\t\t\t\t\t\t\t\t\tfilename || label\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: __( 'No background image selected' ) }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t</FlexBlock>\n\t\t\t</HStack>\n\t\t);\n\t};\n\n\treturn as === 'button' ? (\n\t\t<Button __next40pxDefaultSize { ...restToggleProps }>\n\t\t\t{ renderPreviewContent() }\n\t\t</Button>\n\t) : (\n\t\trenderPreviewContent()\n\t);\n}\n\nfunction BackgroundControlsPanel( {\n\tlabel,\n\tfilename,\n\turl: imgUrl,\n\tchildren,\n\tonToggle: onToggleCallback = noop,\n\thasImageValue,\n\tonReset,\n\tcontainerRef,\n} ) {\n\tif ( ! hasImageValue ) {\n\t\treturn;\n\t}\n\n\tconst imgLabel = label || getFilename( imgUrl ) || __( 'Image' );\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ BACKGROUND_POPOVER_PROPS }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\tconst toggleProps = {\n\t\t\t\t\tonClick: onToggle,\n\t\t\t\t\tclassName:\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__dropdown-toggle',\n\t\t\t\t\t'aria-expanded': isOpen,\n\t\t\t\t\t'aria-label': __(\n\t\t\t\t\t\t'Background size, position and repeat options.'\n\t\t\t\t\t),\n\t\t\t\t\tisOpen,\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\t\timgUrl={ imgUrl }\n\t\t\t\t\t\t\tfilename={ filename }\n\t\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t\t\ttoggleProps={ toggleProps }\n\t\t\t\t\t\t\tas=\"button\"\n\t\t\t\t\t\t\tonToggleCallback={ onToggleCallback }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ onReset && (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__reset\"\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\ticon={ resetIcon }\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\t\t\t// Close the dropdown if open.\n\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Focus the toggle button.\n\t\t\t\t\t\t\t\t\tfocusToggleButton( containerRef );\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\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__dropdown-content-wrapper\"\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction LoadingSpinner() {\n\treturn (\n\t\t<Placeholder className=\"block-editor-global-styles-background-panel__loading\">\n\t\t\t<Spinner />\n\t\t</Placeholder>\n\t);\n}\n\nfunction BackgroundImageControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tonRemoveImage = noop,\n\tonResetImage = noop,\n\tdisplayInPanel,\n\tdefaultValues,\n\tcontainerRef,\n} ) {\n\tconst [ isUploading, setIsUploading ] = useState( false );\n\tconst { getSettings } = useSelect( blockEditorStore );\n\n\tconst { id, title, url } = style?.background?.backgroundImage || {\n\t\t...inheritedValue?.background?.backgroundImage,\n\t};\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst onUploadError = ( message ) => {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\tsetIsUploading( false );\n\t};\n\n\tconst resetBackgroundImage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\tundefined\n\t\t\t)\n\t\t);\n\n\tconst onSelectMedia = ( media ) => {\n\t\tif ( ! media || ! media.url ) {\n\t\t\tresetBackgroundImage();\n\t\t\tsetIsUploading( false );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tsetIsUploading( true );\n\t\t\treturn;\n\t\t}\n\n\t\t// For media selections originated from a file upload.\n\t\tif (\n\t\t\t( media.media_type &&\n\t\t\t\tmedia.media_type !== IMAGE_BACKGROUND_TYPE ) ||\n\t\t\t( ! media.media_type &&\n\t\t\t\tmedia.type &&\n\t\t\t\tmedia.type !== IMAGE_BACKGROUND_TYPE )\n\t\t) {\n\t\t\tonUploadError(\n\t\t\t\t__( 'Only images can be used as a background image.' )\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tconst sizeValue =\n\t\t\tstyle?.background?.backgroundSize || defaultValues?.backgroundSize;\n\t\tconst positionValue = style?.background?.backgroundPosition;\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundImage: {\n\t\t\t\t\turl: media.url,\n\t\t\t\t\tid: media.id,\n\t\t\t\t\tsource: 'file',\n\t\t\t\t\ttitle: media.title || undefined,\n\t\t\t\t},\n\t\t\t\tbackgroundPosition:\n\t\t\t\t\t/*\n\t\t\t\t\t * A background image uploaded and set in the editor receives a default background position of '50% 0',\n\t\t\t\t\t * when the background image size is the equivalent of \"Tile\".\n\t\t\t\t\t * This is to increase the chance that the image's focus point is visible.\n\t\t\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t\t\t */\n\t\t\t\t\t! positionValue && ( 'auto' === sizeValue || ! sizeValue )\n\t\t\t\t\t\t? '50% 0'\n\t\t\t\t\t\t: positionValue,\n\t\t\t\tbackgroundSize: sizeValue,\n\t\t\t} )\n\t\t);\n\t\tsetIsUploading( false );\n\t\t// Close the dropdown and focus the toggle button.\n\t\tfocusToggleButton( containerRef );\n\t};\n\n\t// Drag and drop callback, restricting image to one.\n\tconst onFilesDrop = ( filesList ) => {\n\t\tgetSettings().mediaUpload( {\n\t\t\tallowedTypes: [ IMAGE_BACKGROUND_TYPE ],\n\t\t\tfilesList,\n\t\t\tonFileChange( [ image ] ) {\n\t\t\t\tonSelectMedia( image );\n\t\t\t},\n\t\t\tonError: onUploadError,\n\t\t\tmultiple: false,\n\t\t} );\n\t};\n\n\tconst hasValue = hasBackgroundImageValue( style );\n\n\tconst onRemove = () =>\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\tbackgroundImage: 'none',\n\t\t\t} )\n\t\t);\n\tconst canRemove = ! hasValue && hasBackgroundImageValue( inheritedValue );\n\tconst imgLabel = title || getFilename( url ) || __( 'Image' );\n\n\treturn (\n\t\t<div className=\"block-editor-global-styles-background-panel__image-tools-panel-item\">\n\t\t\t{ isUploading && <LoadingSpinner /> }\n\t\t\t<MediaReplaceFlow\n\t\t\t\tmediaId={ id }\n\t\t\t\tmediaURL={ url }\n\t\t\t\tallowedTypes={ [ IMAGE_BACKGROUND_TYPE ] }\n\t\t\t\taccept=\"image/*\"\n\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\tpopoverProps={ {\n\t\t\t\t\tclassName: clsx( {\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__media-replace-popover':\n\t\t\t\t\t\t\tdisplayInPanel,\n\t\t\t\t\t} ),\n\t\t\t\t} }\n\t\t\t\tname={\n\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\timgUrl={ url }\n\t\t\t\t\t\tfilename={ title }\n\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\trenderToggle={ ( props ) => (\n\t\t\t\t\t<Button { ...props } __next40pxDefaultSize />\n\t\t\t\t) }\n\t\t\t\tonError={ onUploadError }\n\t\t\t\tonReset={ () => {\n\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\tonResetImage();\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ canRemove && (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\tonRemove();\n\t\t\t\t\t\t\tonRemoveImage();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) }\n\t\t\t</MediaReplaceFlow>\n\t\t\t<DropZone\n\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\tlabel={ __( 'Drop to upload' ) }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction BackgroundSizeControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tdefaultValues,\n} ) {\n\tconst sizeValue =\n\t\tstyle?.background?.backgroundSize ||\n\t\tinheritedValue?.background?.backgroundSize;\n\tconst repeatValue =\n\t\tstyle?.background?.backgroundRepeat ||\n\t\tinheritedValue?.background?.backgroundRepeat;\n\tconst imageValue =\n\t\tstyle?.background?.backgroundImage?.url ||\n\t\tinheritedValue?.background?.backgroundImage?.url;\n\tconst isUploadedImage = style?.background?.backgroundImage?.id;\n\tconst positionValue =\n\t\tstyle?.background?.backgroundPosition ||\n\t\tinheritedValue?.background?.backgroundPosition;\n\tconst attachmentValue =\n\t\tstyle?.background?.backgroundAttachment ||\n\t\tinheritedValue?.background?.backgroundAttachment;\n\n\t/*\n\t * Set default values for uploaded images.\n\t * The default values are passed by the consumer.\n\t * Block-level controls may have different defaults to root-level controls.\n\t * A falsy value is treated by default as `auto` (Tile).\n\t */\n\tlet currentValueForToggle =\n\t\t! sizeValue && isUploadedImage\n\t\t\t? defaultValues?.backgroundSize\n\t\t\t: sizeValue || 'auto';\n\t/*\n\t * The incoming value could be a value + unit, e.g. '20px'.\n\t * In this case set the value to 'tile'.\n\t */\n\tcurrentValueForToggle = ! [ 'cover', 'contain', 'auto' ].includes(\n\t\tcurrentValueForToggle\n\t)\n\t\t? 'auto'\n\t\t: currentValueForToggle;\n\t/*\n\t * If the current value is `cover` and the repeat value is `undefined`, then\n\t * the toggle should be unchecked as the default state. Otherwise, the toggle\n\t * should reflect the current repeat value.\n\t */\n\tconst repeatCheckedValue = ! (\n\t\trepeatValue === 'no-repeat' ||\n\t\t( currentValueForToggle === 'cover' && repeatValue === undefined )\n\t);\n\n\tconst updateBackgroundSize = ( next ) => {\n\t\t// When switching to 'contain' toggle the repeat off.\n\t\tlet nextRepeat = repeatValue;\n\t\tlet nextPosition = positionValue;\n\n\t\tif ( next === 'contain' ) {\n\t\t\tnextRepeat = 'no-repeat';\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif ( next === 'cover' ) {\n\t\t\tnextRepeat = undefined;\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif (\n\t\t\t( currentValueForToggle === 'cover' ||\n\t\t\t\tcurrentValueForToggle === 'contain' ) &&\n\t\t\tnext === 'auto'\n\t\t) {\n\t\t\tnextRepeat = undefined;\n\t\t\t/*\n\t\t\t * A background image uploaded and set in the editor (an image with a record id),\n\t\t\t * receives a default background position of '50% 0',\n\t\t\t * when the toggle switches to \"Tile\". This is to increase the chance that\n\t\t\t * the image's focus point is visible.\n\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t */\n\t\t\tif ( !! style?.background?.backgroundImage?.id ) {\n\t\t\t\tnextPosition = '50% 0';\n\t\t\t}\n\t\t}\n\n\t\t/*\n\t\t * Next will be null when the input is cleared,\n\t\t * in which case the value should be 'auto'.\n\t\t */\n\t\tif ( ! next && currentValueForToggle === 'auto' ) {\n\t\t\tnext = 'auto';\n\t\t}\n\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundPosition: nextPosition,\n\t\t\t\tbackgroundRepeat: nextRepeat,\n\t\t\t\tbackgroundSize: next,\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst updateBackgroundPosition = ( next ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t\tcoordsToBackgroundPosition( next )\n\t\t\t)\n\t\t);\n\t};\n\n\tconst toggleIsRepeated = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t\trepeatCheckedValue === true ? 'no-repeat' : 'repeat'\n\t\t\t)\n\t\t);\n\n\tconst toggleScrollWithPage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t\tattachmentValue === 'fixed' ? 'scroll' : 'fixed'\n\t\t\t)\n\t\t);\n\n\t// Set a default background position for non-site-wide, uploaded images with a size of 'contain'.\n\tconst backgroundPositionValue =\n\t\t! positionValue && isUploadedImage && 'contain' === sizeValue\n\t\t\t? defaultValues?.backgroundPosition\n\t\t\t: positionValue;\n\n\treturn (\n\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t<FocalPointPicker\n\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\turl={ imageValue }\n\t\t\t\tvalue={ backgroundPositionToCoords( backgroundPositionValue ) }\n\t\t\t\tonChange={ updateBackgroundPosition }\n\t\t\t/>\n\t\t\t<ToggleControl\n\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\tchecked={ attachmentValue === 'fixed' }\n\t\t\t\tonChange={ toggleScrollWithPage }\n\t\t\t/>\n\t\t\t<ToggleGroupControl\n\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\tlabel={ __( 'Size' ) }\n\t\t\t\tvalue={ currentValueForToggle }\n\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\tisBlock\n\t\t\t\thelp={ backgroundSizeHelpText(\n\t\t\t\t\tsizeValue || defaultValues?.backgroundSize\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"cover\"\n\t\t\t\t\tvalue=\"cover\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Cover',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"contain\"\n\t\t\t\t\tvalue=\"contain\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Contain',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"tile\"\n\t\t\t\t\tvalue=\"auto\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Tile',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</ToggleGroupControl>\n\t\t\t<HStack justify=\"flex-start\" spacing={ 2 } as=\"span\">\n\t\t\t\t<UnitControl\n\t\t\t\t\taria-label={ __( 'Background image width' ) }\n\t\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\t\tvalue={ sizeValue }\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t__unstableInputWidth=\"100px\"\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tdisabled={\n\t\t\t\t\t\tcurrentValueForToggle !== 'auto' ||\n\t\t\t\t\t\tcurrentValueForToggle === undefined\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Repeat' ) }\n\t\t\t\t\tchecked={ repeatCheckedValue }\n\t\t\t\t\tonChange={ toggleIsRepeated }\n\t\t\t\t\tdisabled={ currentValueForToggle === 'cover' }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function BackgroundImagePanel( {\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tdefaultValues = {},\n} ) {\n\t/*\n\t * Resolve any inherited \"ref\" pointers.\n\t * Should the block editor need resolved, inherited values\n\t * across all controls, this could be abstracted into a hook,\n\t * e.g., useResolveGlobalStyle\n\t */\n\tconst { globalStyles, _links } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst _settings = getSettings();\n\t\treturn {\n\t\t\tglobalStyles: _settings[ globalStylesDataKey ],\n\t\t\t_links: _settings[ globalStylesLinksDataKey ],\n\t\t};\n\t}, [] );\n\tconst resolvedInheritedValue = useMemo( () => {\n\t\tconst resolvedValues = {\n\t\t\tbackground: {},\n\t\t};\n\n\t\tif ( ! inheritedValue?.background ) {\n\t\t\treturn inheritedValue;\n\t\t}\n\n\t\tObject.entries( inheritedValue?.background ).forEach(\n\t\t\t( [ key, backgroundValue ] ) => {\n\t\t\t\tresolvedValues.background[ key ] = getResolvedValue(\n\t\t\t\t\tbackgroundValue,\n\t\t\t\t\t{\n\t\t\t\t\t\tstyles: globalStyles,\n\t\t\t\t\t\t_links,\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\t\treturn resolvedValues;\n\t}, [ globalStyles, _links, inheritedValue ] );\n\n\tconst resetBackground = () =>\n\t\tonChange( setImmutably( value, [ 'background' ], {} ) );\n\n\tconst { title, url } = value?.background?.backgroundImage || {\n\t\t...resolvedInheritedValue?.background?.backgroundImage,\n\t};\n\tconst hasImageValue =\n\t\thasBackgroundImageValue( value ) ||\n\t\thasBackgroundImageValue( resolvedInheritedValue );\n\n\tconst imageValue =\n\t\tvalue?.background?.backgroundImage ||\n\t\tinheritedValue?.background?.backgroundImage;\n\n\tconst shouldShowBackgroundImageControls =\n\t\thasImageValue &&\n\t\t'none' !== imageValue &&\n\t\t( settings?.background?.backgroundSize ||\n\t\t\tsettings?.background?.backgroundPosition ||\n\t\t\tsettings?.background?.backgroundRepeat );\n\n\tconst [ isDropDownOpen, setIsDropDownOpen ] = useState( false );\n\tconst containerRef = useRef();\n\n\treturn (\n\t\t<div\n\t\t\tref={ containerRef }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-global-styles-background-panel__inspector-media-replace-container',\n\t\t\t\t{\n\t\t\t\t\t'is-open': isDropDownOpen,\n\t\t\t\t}\n\t\t\t) }\n\t\t>\n\t\t\t{ shouldShowBackgroundImageControls ? (\n\t\t\t\t<BackgroundControlsPanel\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tfilename={ title }\n\t\t\t\t\turl={ url }\n\t\t\t\t\tonToggle={ setIsDropDownOpen }\n\t\t\t\t\thasImageValue={ hasImageValue }\n\t\t\t\t\tonReset={ resetBackground }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t\t\t\t<BackgroundImageControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t\tdisplayInPanel\n\t\t\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BackgroundSizeControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t</BackgroundControlsPanel>\n\t\t\t) : (\n\t\t\t\t<BackgroundImageControls\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tstyle={ value }\n\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t} }\n\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
+  "mappings": "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",
   "names": ["HStack", "Truncate", "resetIcon", "DropdownContentWrapper", "blockEditorStore", "noticesStore", "MediaReplaceFlow", "clsx", "VStack", "ToggleGroupControl", "ToggleGroupControlOption", "UnitControl"]
 }

package/build/components/block-allowed-blocks/modal.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-allowed-blocks/modal.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tFlex,\n\tFlexItem,\n\tModal,\n\t__experimentalText as Text,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useState } from '@wordpress/element';\nimport { _x, __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport BlockManager from '../block-manager';\n\nexport default function BlockAllowedBlocksModal( {\n\tclientId,\n\tblockTypes,\n\tselectedBlockTypes,\n\tonClose,\n} ) {\n\tconst [ currentSelectedBlockTypes, setCurrentSelectedBlockTypes ] =\n\t\tuseState( selectedBlockTypes );\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst handleSubmit = () => {\n\t\tconst isFullySelected =\n\t\t\tcurrentSelectedBlockTypes.length === blockTypes.length;\n\t\tconst newBlockNames = currentSelectedBlockTypes.map(\n\t\t\t( { name } ) => name\n\t\t);\n\t\tupdateBlockAttributes( clientId, {\n\t\t\tallowedBlocks: isFullySelected ? undefined : newBlockNames,\n\t\t} );\n\t\tonClose();\n\t};\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ _x( 'Manage allowed blocks', 'modal title' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t\toverlayClassName=\"block-editor-block-allowed-blocks-modal\"\n\t\t\tfocusOnMount=\"firstContentElement\"\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t<VStack\n\t\t\t\tas=\"form\"\n\t\t\t\tonSubmit={ ( e ) => {\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\thandleSubmit();\n\t\t\t\t} }\n\t\t\t\tspacing=\"4\"\n\t\t\t>\n\t\t\t\t<Text>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Select which blocks can be added inside this container.'\n\t\t\t\t\t) }\n\t\t\t\t</Text>\n\t\t\t\t<BlockManager\n\t\t\t\t\tblockTypes={ blockTypes }\n\t\t\t\t\tselectedBlockTypes={ currentSelectedBlockTypes }\n\t\t\t\t\tonChange={ ( newSelectedBlockTypes ) => {\n\t\t\t\t\t\tsetCurrentSelectedBlockTypes( newSelectedBlockTypes );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"block-editor-block-allowed-blocks-modal__actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Apply' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</VStack>\n\t\t</Modal>\n\t);\n}\n"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tFlex,\n\tFlexItem,\n\tModal,\n\t__experimentalText as WCText,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useState } from '@wordpress/element';\nimport { _x, __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport BlockManager from '../block-manager';\n\nexport default function BlockAllowedBlocksModal( {\n\tclientId,\n\tblockTypes,\n\tselectedBlockTypes,\n\tonClose,\n} ) {\n\tconst [ currentSelectedBlockTypes, setCurrentSelectedBlockTypes ] =\n\t\tuseState( selectedBlockTypes );\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst handleSubmit = () => {\n\t\tconst isFullySelected =\n\t\t\tcurrentSelectedBlockTypes.length === blockTypes.length;\n\t\tconst newBlockNames = currentSelectedBlockTypes.map(\n\t\t\t( { name } ) => name\n\t\t);\n\t\tupdateBlockAttributes( clientId, {\n\t\t\tallowedBlocks: isFullySelected ? undefined : newBlockNames,\n\t\t} );\n\t\tonClose();\n\t};\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ _x( 'Manage allowed blocks', 'modal title' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t\toverlayClassName=\"block-editor-block-allowed-blocks-modal\"\n\t\t\tfocusOnMount=\"firstContentElement\"\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t<VStack\n\t\t\t\tas=\"form\"\n\t\t\t\tonSubmit={ ( e ) => {\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\thandleSubmit();\n\t\t\t\t} }\n\t\t\t\tspacing=\"4\"\n\t\t\t>\n\t\t\t\t<WCText>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Select which blocks can be added inside this container.'\n\t\t\t\t\t) }\n\t\t\t\t</WCText>\n\t\t\t\t<BlockManager\n\t\t\t\t\tblockTypes={ blockTypes }\n\t\t\t\t\tselectedBlockTypes={ currentSelectedBlockTypes }\n\t\t\t\t\tonChange={ ( newSelectedBlockTypes ) => {\n\t\t\t\t\t\tsetCurrentSelectedBlockTypes( newSelectedBlockTypes );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"block-editor-block-allowed-blocks-modal__actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Apply' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</VStack>\n\t\t</Modal>\n\t);\n}\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAOO;AACP,qBAAyB;AACzB,kBAAuB;AACvB,kBAA4B;AAK5B,mBAA0C;AAC1C,2BAAyB;AAyCrB;AAvCW,SAAR,wBAA0C;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,CAAE,2BAA2B,4BAA6B,QAC/D,yBAAU,kBAAmB;AAE9B,QAAM,EAAE,sBAAsB,QAAI,yBAAa,aAAAA,KAAiB;AAEhE,QAAM,eAAe,MAAM;AAC1B,UAAM,kBACL,0BAA0B,WAAW,WAAW;AACjD,UAAM,gBAAgB,0BAA0B;AAAA,MAC/C,CAAE,EAAE,KAAK,MAAO;AAAA,IACjB;AACA,0BAAuB,UAAU;AAAA,MAChC,eAAe,kBAAkB,SAAY;AAAA,IAC9C,CAAE;AACF,YAAQ;AAAA,EACT;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAQ,gBAAI,yBAAyB,aAAc;AAAA,MACnD,gBAAiB;AAAA,MACjB,kBAAiB;AAAA,MACjB,cAAa;AAAA,MACb,MAAK;AAAA,MAEL;AAAA,QAAC,kBAAAC;AAAA,QAAA;AAAA,UACA,IAAG;AAAA,UACH,UAAW,CAAE,MAAO;AACnB,cAAE,eAAe;AACjB,yBAAa;AAAA,UACd;AAAA,UACA,SAAQ;AAAA,UAER;AAAA,wDAAC,kBAAAC,oBAAA,EACE;AAAA,cACD;AAAA,YACD,GACD;AAAA,YACA;AAAA,cAAC,qBAAAC;AAAA,cAAA;AAAA,gBACA;AAAA,gBACA,oBAAqB;AAAA,gBACrB,UAAW,CAAE,0BAA2B;AACvC,+CAA8B,qBAAsB;AAAA,gBACrD;AAAA;AAAA,YACD;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,WAAU;AAAA,gBACV,SAAQ;AAAA,gBACR,UAAW;AAAA,gBAEX;AAAA,8DAAC,8BACA;AAAA,oBAAC;AAAA;AAAA,sBACA,SAAQ;AAAA,sBACR,SAAU;AAAA,sBACV,uBAAqB;AAAA,sBAEnB,8BAAI,QAAS;AAAA;AAAA,kBAChB,GACD;AAAA,kBACA,4CAAC,8BACA;AAAA,oBAAC;AAAA;AAAA,sBACA,SAAQ;AAAA,sBACR,MAAK;AAAA,sBACL,uBAAqB;AAAA,sBAEnB,8BAAI,OAAQ;AAAA;AAAA,kBACf,GACD;AAAA;AAAA;AAAA,YACD;AAAA;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;",
-  "names": ["blockEditorStore", "VStack", "Text", "BlockManager"]
+  "names": ["blockEditorStore", "VStack", "WCText", "BlockManager"]
 }

package/build/components/block-bindings/attribute-control.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-bindings/attribute-control.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6/index.js';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tgetBlockBindingsSource,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport {\n\t__experimentalItem as Item,\n\t__experimentalText as Text,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalVStack as VStack,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useContext } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BlockContext from '../block-context';\nimport BlockBindingsSourceFieldsList from './source-fields-list';\nimport useBlockBindingsUtils from './use-block-bindings-utils';\nimport { unlock } from '../../lock-unlock';\nimport { store as blockEditorStore } from '../../store';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nexport default function BlockBindingsAttributeControl( {\n\tattribute,\n\tbinding,\n\tblockName,\n} ) {\n\tconst { updateBlockBindings } = useBlockBindingsUtils();\n\tconst isMobile = useViewportMatch( 'medium', '<' );\n\n\tconst blockContext = useContext( BlockContext );\n\tconst compatibleFields = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetAllBlockBindingsSources,\n\t\t\t\tgetBlockBindingsSourceFieldsList,\n\t\t\t\tgetBlockType,\n\t\t\t} = unlock( select( blocksStore ) );\n\n\t\t\tconst _attribute =\n\t\t\t\tgetBlockType( blockName ).attributes?.[ attribute ];\n\n\t\t\tif ( _attribute?.enum ) {\n\t\t\t\treturn {};\n\t\t\t}\n\n\t\t\tconst attributeType =\n\t\t\t\t_attribute?.type === 'rich-text' ? 'string' : _attribute?.type;\n\n\t\t\tconst sourceFields = {};\n\t\t\tObject.entries( getAllBlockBindingsSources() ).forEach(\n\t\t\t\t( [ sourceName, source ] ) => {\n\t\t\t\t\tconst fieldsList = getBlockBindingsSourceFieldsList(\n\t\t\t\t\t\tsource,\n\t\t\t\t\t\tblockContext\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! fieldsList?.length ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tconst compatibleFieldsList = fieldsList.filter(\n\t\t\t\t\t\t( field ) => field.type === attributeType\n\t\t\t\t\t);\n\t\t\t\t\tif ( compatibleFieldsList.length ) {\n\t\t\t\t\t\tsourceFields[ sourceName ] = compatibleFieldsList;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t);\n\t\t\treturn sourceFields;\n\t\t},\n\t\t[ attribute, blockName, blockContext ]\n\t);\n\n\tconst { canUpdateBlockBindings } = useSelect( ( select ) => ( {\n\t\tcanUpdateBlockBindings:\n\t\t\tselect( blockEditorStore ).getSettings().canUpdateBlockBindings,\n\t} ) );\n\n\tconst hasCompatibleFields = Object.keys( compatibleFields ).length > 0;\n\n\t// Lock the UI when the user can't update bindings or there are no fields to connect to.\n\tconst isAttributeReadOnly =\n\t\t! canUpdateBlockBindings || ! hasCompatibleFields;\n\n\tconst { source: boundSourceName, args } = binding || {};\n\tconst source = getBlockBindingsSource( boundSourceName );\n\n\tlet displayText;\n\tlet isValid = true;\n\n\tif ( binding === undefined ) {\n\t\tif ( ! hasCompatibleFields ) {\n\t\t\tdisplayText = __( 'No sources available' );\n\t\t} else {\n\t\t\tdisplayText = __( 'Not connected' );\n\t\t}\n\t\tisValid = true;\n\t} else if ( ! source ) {\n\t\t// If there's a binding but the source is not found, it's invalid.\n\t\tisValid = false;\n\t\tdisplayText = __( 'Source not registered' );\n\t} else {\n\t\tdisplayText =\n\t\t\tcompatibleFields?.[ boundSourceName ]?.find( ( field ) =>\n\t\t\t\tfastDeepEqual( field.args, args )\n\t\t\t)?.label ||\n\t\t\tsource?.label ||\n\t\t\tboundSourceName;\n\t}\n\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => !! binding }\n\t\t\tlabel={ attribute }\n\t\t\tonDeselect={\n\t\t\t\t!! hasCompatibleFields &&\n\t\t\t\t( () => {\n\t\t\t\t\tupdateBlockBindings( {\n\t\t\t\t\t\t[ attribute ]: undefined,\n\t\t\t\t\t} );\n\t\t\t\t} )\n\t\t\t}\n\t\t>\n\t\t\t<Menu placement={ isMobile ? 'bottom-start' : 'left-start' }>\n\t\t\t\t<Menu.TriggerButton\n\t\t\t\t\trender={ <Item /> }\n\t\t\t\t\tdisabled={ ! hasCompatibleFields }\n\t\t\t\t>\n\t\t\t\t\t<VStack\n\t\t\t\t\t\tclassName=\"block-editor-bindings__item\"\n\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Text truncate>{ attribute }</Text>\n\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\ttruncate\n\t\t\t\t\t\t\tvariant={ isValid ? 'muted' : undefined }\n\t\t\t\t\t\t\tisDestructive={ ! isValid }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ displayText }\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t</VStack>\n\t\t\t\t</Menu.TriggerButton>\n\t\t\t\t{ ! isAttributeReadOnly && (\n\t\t\t\t\t<Menu.Popover gutter={ isMobile ? 8 : 36 }>\n\t\t\t\t\t\t<Menu\n\t\t\t\t\t\t\tplacement={\n\t\t\t\t\t\t\t\tisMobile ? 'bottom-start' : 'left-start'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ Object.entries( compatibleFields ).map(\n\t\t\t\t\t\t\t\t( [ sourceKey, fields ] ) => (\n\t\t\t\t\t\t\t\t\t<BlockBindingsSourceFieldsList\n\t\t\t\t\t\t\t\t\t\tkey={ sourceKey }\n\t\t\t\t\t\t\t\t\t\targs={ binding?.args }\n\t\t\t\t\t\t\t\t\t\tattribute={ attribute }\n\t\t\t\t\t\t\t\t\t\tsourceKey={ sourceKey }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Menu>\n\t\t\t\t\t</Menu.Popover>\n\t\t\t\t) }\n\t\t\t</Menu>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],
-  "mappings": "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",
-  "names": ["componentsPrivateApis", "useBlockBindingsUtils", "BlockContext", "blocksStore", "source", "blockEditorStore", "fastDeepEqual", "ToolsPanelItem", "Item", "VStack", "Text", "BlockBindingsSourceFieldsList"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6/index.js';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tgetBlockBindingsSource,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport {\n\t__experimentalItem as Item,\n\t__experimentalText as WCText,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalVStack as VStack,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useContext } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BlockContext from '../block-context';\nimport BlockBindingsSourceFieldsList from './source-fields-list';\nimport useBlockBindingsUtils from './use-block-bindings-utils';\nimport { unlock } from '../../lock-unlock';\nimport { store as blockEditorStore } from '../../store';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nexport default function BlockBindingsAttributeControl( {\n\tattribute,\n\tbinding,\n\tblockName,\n} ) {\n\tconst { updateBlockBindings } = useBlockBindingsUtils();\n\tconst isMobile = useViewportMatch( 'medium', '<' );\n\n\tconst blockContext = useContext( BlockContext );\n\tconst compatibleFields = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetAllBlockBindingsSources,\n\t\t\t\tgetBlockBindingsSourceFieldsList,\n\t\t\t\tgetBlockType,\n\t\t\t} = unlock( select( blocksStore ) );\n\n\t\t\tconst _attribute =\n\t\t\t\tgetBlockType( blockName ).attributes?.[ attribute ];\n\n\t\t\tif ( _attribute?.enum ) {\n\t\t\t\treturn {};\n\t\t\t}\n\n\t\t\tconst attributeType =\n\t\t\t\t_attribute?.type === 'rich-text' ? 'string' : _attribute?.type;\n\n\t\t\tconst sourceFields = {};\n\t\t\tObject.entries( getAllBlockBindingsSources() ).forEach(\n\t\t\t\t( [ sourceName, source ] ) => {\n\t\t\t\t\tconst fieldsList = getBlockBindingsSourceFieldsList(\n\t\t\t\t\t\tsource,\n\t\t\t\t\t\tblockContext\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! fieldsList?.length ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tconst compatibleFieldsList = fieldsList.filter(\n\t\t\t\t\t\t( field ) => field.type === attributeType\n\t\t\t\t\t);\n\t\t\t\t\tif ( compatibleFieldsList.length ) {\n\t\t\t\t\t\tsourceFields[ sourceName ] = compatibleFieldsList;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t);\n\t\t\treturn sourceFields;\n\t\t},\n\t\t[ attribute, blockName, blockContext ]\n\t);\n\n\tconst { canUpdateBlockBindings } = useSelect( ( select ) => ( {\n\t\tcanUpdateBlockBindings:\n\t\t\tselect( blockEditorStore ).getSettings().canUpdateBlockBindings,\n\t} ) );\n\n\tconst hasCompatibleFields = Object.keys( compatibleFields ).length > 0;\n\n\t// Lock the UI when the user can't update bindings or there are no fields to connect to.\n\tconst isAttributeReadOnly =\n\t\t! canUpdateBlockBindings || ! hasCompatibleFields;\n\n\tconst { source: boundSourceName, args } = binding || {};\n\tconst source = getBlockBindingsSource( boundSourceName );\n\n\tlet displayText;\n\tlet isValid = true;\n\n\tif ( binding === undefined ) {\n\t\tif ( ! hasCompatibleFields ) {\n\t\t\tdisplayText = __( 'No sources available' );\n\t\t} else {\n\t\t\tdisplayText = __( 'Not connected' );\n\t\t}\n\t\tisValid = true;\n\t} else if ( ! source ) {\n\t\t// If there's a binding but the source is not found, it's invalid.\n\t\tisValid = false;\n\t\tdisplayText = __( 'Source not registered' );\n\t} else {\n\t\tdisplayText =\n\t\t\tcompatibleFields?.[ boundSourceName ]?.find( ( field ) =>\n\t\t\t\tfastDeepEqual( field.args, args )\n\t\t\t)?.label ||\n\t\t\tsource?.label ||\n\t\t\tboundSourceName;\n\t}\n\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => !! binding }\n\t\t\tlabel={ attribute }\n\t\t\tonDeselect={\n\t\t\t\t!! hasCompatibleFields &&\n\t\t\t\t( () => {\n\t\t\t\t\tupdateBlockBindings( {\n\t\t\t\t\t\t[ attribute ]: undefined,\n\t\t\t\t\t} );\n\t\t\t\t} )\n\t\t\t}\n\t\t>\n\t\t\t<Menu placement={ isMobile ? 'bottom-start' : 'left-start' }>\n\t\t\t\t<Menu.TriggerButton\n\t\t\t\t\trender={ <Item /> }\n\t\t\t\t\tdisabled={ ! hasCompatibleFields }\n\t\t\t\t>\n\t\t\t\t\t<VStack\n\t\t\t\t\t\tclassName=\"block-editor-bindings__item\"\n\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t>\n\t\t\t\t\t\t<WCText truncate>{ attribute }</WCText>\n\t\t\t\t\t\t<WCText\n\t\t\t\t\t\t\ttruncate\n\t\t\t\t\t\t\tvariant={ isValid ? 'muted' : undefined }\n\t\t\t\t\t\t\tisDestructive={ ! isValid }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ displayText }\n\t\t\t\t\t\t</WCText>\n\t\t\t\t\t</VStack>\n\t\t\t\t</Menu.TriggerButton>\n\t\t\t\t{ ! isAttributeReadOnly && (\n\t\t\t\t\t<Menu.Popover gutter={ isMobile ? 8 : 36 }>\n\t\t\t\t\t\t<Menu\n\t\t\t\t\t\t\tplacement={\n\t\t\t\t\t\t\t\tisMobile ? 'bottom-start' : 'left-start'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ Object.entries( compatibleFields ).map(\n\t\t\t\t\t\t\t\t( [ sourceKey, fields ] ) => (\n\t\t\t\t\t\t\t\t\t<BlockBindingsSourceFieldsList\n\t\t\t\t\t\t\t\t\t\tkey={ sourceKey }\n\t\t\t\t\t\t\t\t\t\targs={ binding?.args }\n\t\t\t\t\t\t\t\t\t\tattribute={ attribute }\n\t\t\t\t\t\t\t\t\t\tsourceKey={ sourceKey }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Menu>\n\t\t\t\t\t</Menu.Popover>\n\t\t\t\t) }\n\t\t\t</Menu>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],
+  "mappings": "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",
+  "names": ["componentsPrivateApis", "useBlockBindingsUtils", "BlockContext", "blocksStore", "source", "blockEditorStore", "fastDeepEqual", "ToolsPanelItem", "Item", "VStack", "WCText", "BlockBindingsSourceFieldsList"]
 }

package/build/components/block-card/index.cjs

@@ -44,7 +44,7 @@ var import_lock_unlock = require("../../lock-unlock.cjs");
 var import_store = require("../../store/index.cjs");
 var import_block_icon = __toESM(require("../block-icon/index.cjs"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var { Badge } = (0, import_lock_unlock.unlock)(import_components.privateApis);
+var { Badge: WCBadge } = (0, import_lock_unlock.unlock)(import_components.privateApis);
 function OptionalParentSelectButton({ children, onClick }) {
   if (!onClick) {
     return children;
@@ -142,7 +142,7 @@ function BlockCard({
                 /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalVStack, { spacing: 1, children: [
                   /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TitleElement, { className: "block-editor-block-card__title", children: [
                     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block-editor-block-card__name", children: !!name?.length ? name : title }),
-                    !parentClientId && !isChild && !!name?.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Badge, { children: title })
+                    !parentClientId && !isChild && !!name?.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WCBadge, { children: title })
                   ] }),
                   children
                 ] })

package/build/components/block-card/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-card/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\t__experimentalText as Text,\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport deprecated from '@wordpress/deprecated';\nimport { __, sprintf, isRTL } from '@wordpress/i18n';\nimport {\n\tchevronLeft,\n\tchevronRight,\n\tarrowRight,\n\tarrowLeft,\n} from '@wordpress/icons';\nimport { getBlockType, hasBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { store as blockEditorStore } from '../../store';\nimport BlockIcon from '../block-icon';\n\nconst { Badge } = unlock( componentsPrivateApis );\n\nfunction OptionalParentSelectButton( { children, onClick } ) {\n\tif ( ! onClick ) {\n\t\treturn children;\n\t}\n\n\treturn (\n\t\t<Button\n\t\t\t__next40pxDefaultSize\n\t\t\tclassName=\"block-editor-block-card__parent-select-button\"\n\t\t\tonClick={ onClick }\n\t\t>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n}\n\n/**\n * A card component that displays block information including title, icon, and description.\n * Can be used to show block metadata and navigation controls for parent blocks.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-card/README.md\n *\n * @example\n * ```jsx\n * function Example() {\n *   return (\n *     <BlockCard\n *       title=\"My Block\"\n *       icon=\"smiley\"\n *       description=\"A simple block example\"\n *       name=\"Custom Block\"\n *     />\n *   );\n * }\n * ```\n *\n * @param {Object}        props                         Component props.\n * @param {string}        props.title                   The title of the block.\n * @param {string|Object} props.icon                    The icon of the block. This can be any of [WordPress' Dashicons](https://developer.wordpress.org/resource/dashicons/), or a custom `svg` element.\n * @param {string}        props.description             The description of the block.\n * @param {Object}        [props.blockType]             Deprecated: Object containing block type data.\n * @param {string}        [props.className]             Additional classes to apply to the card.\n * @param {string}        [props.name]                  Custom block name to display before the title.\n * @param {string}        [props.allowParentNavigation] Show a back arrow to the parent block in some situations.\n * @param {string}        [props.parentClientId]        The parent clientId, if this card is for a parent block.\n * @param {string}        [props.isChild]               Whether the block card is for a child block, in which case, indent the block using an arrow.\n * @param {string}        [props.clientId]              Whether the block card is for a child block, in which case, indent the block using an arrow.\n * @param {Element}       [props.children]              Children.\n * @return {Element}                        Block card component.\n */\nfunction BlockCard( {\n\ttitle,\n\ticon,\n\tdescription,\n\tblockType,\n\tclassName,\n\tname,\n\tallowParentNavigation,\n\tparentClientId,\n\tisChild,\n\tchildren,\n\tclientId,\n} ) {\n\tif ( blockType ) {\n\t\tdeprecated( '`blockType` property in `BlockCard component`', {\n\t\t\tsince: '5.7',\n\t\t\talternative: '`title, icon and description` properties',\n\t\t} );\n\t\t( { title, icon, description } = blockType );\n\t}\n\n\tconst { parentBlockClientId, parentBlockName } = useSelect(\n\t\t( select ) => {\n\t\t\tif ( parentClientId || isChild || ! allowParentNavigation ) {\n\t\t\t\treturn {};\n\t\t\t}\n\t\t\tconst { getBlockParents, getBlockName } =\n\t\t\t\tselect( blockEditorStore );\n\n\t\t\t// Find the top-most parent block that is either:\n\t\t\t// 1. A navigation block (special case for ad-hoc list view support)\n\t\t\t// 2. Any block with listView support\n\t\t\tconst parents = getBlockParents( clientId, false );\n\t\t\tconst foundParentId = parents.find( ( parentId ) => {\n\t\t\t\tconst parentName = getBlockName( parentId );\n\t\t\t\treturn (\n\t\t\t\t\tparentName === 'core/navigation' ||\n\t\t\t\t\thasBlockSupport( parentName, 'listView' )\n\t\t\t\t);\n\t\t\t} );\n\n\t\t\treturn {\n\t\t\t\tparentBlockClientId: foundParentId,\n\t\t\t\tparentBlockName: foundParentId\n\t\t\t\t\t? getBlockName( foundParentId )\n\t\t\t\t\t: null,\n\t\t\t};\n\t\t},\n\t\t[ clientId, allowParentNavigation, isChild, parentClientId ]\n\t);\n\n\tconst { selectBlock } = useDispatch( blockEditorStore );\n\n\tconst TitleElement = parentClientId ? 'div' : 'h2';\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-block-card',\n\t\t\t\t{\n\t\t\t\t\t'is-parent': parentClientId,\n\t\t\t\t\t'is-child': isChild,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<VStack>\n\t\t\t\t<HStack justify=\"flex-start\" spacing={ 0 }>\n\t\t\t\t\t{ parentBlockClientId && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ () => selectBlock( parentBlockClientId ) }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tparentBlockName\n\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/* translators: %s: The name of the parent block. */\n\t\t\t\t\t\t\t\t\t\t\t__( 'Go to \"%s\" block' ),\n\t\t\t\t\t\t\t\t\t\t\tgetBlockType( parentBlockName )\n\t\t\t\t\t\t\t\t\t\t\t\t?.title\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t: __( 'Go to parent block' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t// TODO: This style override is also used in ToolsPanelHeader.\n\t\t\t\t\t\t\t\t// It should be supported out-of-the-box by Button.\n\t\t\t\t\t\t\t\t{ minWidth: 24, padding: 0 }\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ isChild && (\n\t\t\t\t\t\t<span className=\"block-editor-block-card__child-indicator-icon\">\n\t\t\t\t\t\t\t<Icon icon={ isRTL() ? arrowLeft : arrowRight } />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) }\n\t\t\t\t\t<OptionalParentSelectButton\n\t\t\t\t\t\tonClick={\n\t\t\t\t\t\t\tparentClientId\n\t\t\t\t\t\t\t\t? () => {\n\t\t\t\t\t\t\t\t\t\tselectBlock( parentClientId );\n\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<BlockIcon icon={ icon } showColors />\n\t\t\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t\t\t<TitleElement className=\"block-editor-block-card__title\">\n\t\t\t\t\t\t\t\t<span className=\"block-editor-block-card__name\">\n\t\t\t\t\t\t\t\t\t{ !! name?.length ? name : title }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t{ ! parentClientId &&\n\t\t\t\t\t\t\t\t\t! isChild &&\n\t\t\t\t\t\t\t\t\t!! name?.length && (\n\t\t\t\t\t\t\t\t\t\t<Badge>{ title }</Badge>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</TitleElement>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t</OptionalParentSelectButton>\n\t\t\t\t</HStack>\n\t\t\t\t{ ! parentClientId && ! isChild && description && (\n\t\t\t\t\t<Text className=\"block-editor-block-card__description\">\n\t\t\t\t\t\t{ description }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n\nexport default BlockCard;\n"],
-  "mappings": "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",
-  "names": ["componentsPrivateApis", "deprecated", "blockEditorStore", "clsx", "VStack", "HStack", "BlockIcon", "Text"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\t__experimentalText as WCText,\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport deprecated from '@wordpress/deprecated';\nimport { __, sprintf, isRTL } from '@wordpress/i18n';\nimport {\n\tchevronLeft,\n\tchevronRight,\n\tarrowRight,\n\tarrowLeft,\n} from '@wordpress/icons';\nimport { getBlockType, hasBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { store as blockEditorStore } from '../../store';\nimport BlockIcon from '../block-icon';\n\nconst { Badge: WCBadge } = unlock( componentsPrivateApis );\n\nfunction OptionalParentSelectButton( { children, onClick } ) {\n\tif ( ! onClick ) {\n\t\treturn children;\n\t}\n\n\treturn (\n\t\t<Button\n\t\t\t__next40pxDefaultSize\n\t\t\tclassName=\"block-editor-block-card__parent-select-button\"\n\t\t\tonClick={ onClick }\n\t\t>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n}\n\n/**\n * A card component that displays block information including title, icon, and description.\n * Can be used to show block metadata and navigation controls for parent blocks.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-card/README.md\n *\n * @example\n * ```jsx\n * function Example() {\n *   return (\n *     <BlockCard\n *       title=\"My Block\"\n *       icon=\"smiley\"\n *       description=\"A simple block example\"\n *       name=\"Custom Block\"\n *     />\n *   );\n * }\n * ```\n *\n * @param {Object}        props                         Component props.\n * @param {string}        props.title                   The title of the block.\n * @param {string|Object} props.icon                    The icon of the block. This can be any of [WordPress' Dashicons](https://developer.wordpress.org/resource/dashicons/), or a custom `svg` element.\n * @param {string}        props.description             The description of the block.\n * @param {Object}        [props.blockType]             Deprecated: Object containing block type data.\n * @param {string}        [props.className]             Additional classes to apply to the card.\n * @param {string}        [props.name]                  Custom block name to display before the title.\n * @param {string}        [props.allowParentNavigation] Show a back arrow to the parent block in some situations.\n * @param {string}        [props.parentClientId]        The parent clientId, if this card is for a parent block.\n * @param {string}        [props.isChild]               Whether the block card is for a child block, in which case, indent the block using an arrow.\n * @param {string}        [props.clientId]              Whether the block card is for a child block, in which case, indent the block using an arrow.\n * @param {Element}       [props.children]              Children.\n * @return {Element}                        Block card component.\n */\nfunction BlockCard( {\n\ttitle,\n\ticon,\n\tdescription,\n\tblockType,\n\tclassName,\n\tname,\n\tallowParentNavigation,\n\tparentClientId,\n\tisChild,\n\tchildren,\n\tclientId,\n} ) {\n\tif ( blockType ) {\n\t\tdeprecated( '`blockType` property in `BlockCard component`', {\n\t\t\tsince: '5.7',\n\t\t\talternative: '`title, icon and description` properties',\n\t\t} );\n\t\t( { title, icon, description } = blockType );\n\t}\n\n\tconst { parentBlockClientId, parentBlockName } = useSelect(\n\t\t( select ) => {\n\t\t\tif ( parentClientId || isChild || ! allowParentNavigation ) {\n\t\t\t\treturn {};\n\t\t\t}\n\t\t\tconst { getBlockParents, getBlockName } =\n\t\t\t\tselect( blockEditorStore );\n\n\t\t\t// Find the top-most parent block that is either:\n\t\t\t// 1. A navigation block (special case for ad-hoc list view support)\n\t\t\t// 2. Any block with listView support\n\t\t\tconst parents = getBlockParents( clientId, false );\n\t\t\tconst foundParentId = parents.find( ( parentId ) => {\n\t\t\t\tconst parentName = getBlockName( parentId );\n\t\t\t\treturn (\n\t\t\t\t\tparentName === 'core/navigation' ||\n\t\t\t\t\thasBlockSupport( parentName, 'listView' )\n\t\t\t\t);\n\t\t\t} );\n\n\t\t\treturn {\n\t\t\t\tparentBlockClientId: foundParentId,\n\t\t\t\tparentBlockName: foundParentId\n\t\t\t\t\t? getBlockName( foundParentId )\n\t\t\t\t\t: null,\n\t\t\t};\n\t\t},\n\t\t[ clientId, allowParentNavigation, isChild, parentClientId ]\n\t);\n\n\tconst { selectBlock } = useDispatch( blockEditorStore );\n\n\tconst TitleElement = parentClientId ? 'div' : 'h2';\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-block-card',\n\t\t\t\t{\n\t\t\t\t\t'is-parent': parentClientId,\n\t\t\t\t\t'is-child': isChild,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<VStack>\n\t\t\t\t<HStack justify=\"flex-start\" spacing={ 0 }>\n\t\t\t\t\t{ parentBlockClientId && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ () => selectBlock( parentBlockClientId ) }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tparentBlockName\n\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/* translators: %s: The name of the parent block. */\n\t\t\t\t\t\t\t\t\t\t\t__( 'Go to \"%s\" block' ),\n\t\t\t\t\t\t\t\t\t\t\tgetBlockType( parentBlockName )\n\t\t\t\t\t\t\t\t\t\t\t\t?.title\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t: __( 'Go to parent block' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t// TODO: This style override is also used in ToolsPanelHeader.\n\t\t\t\t\t\t\t\t// It should be supported out-of-the-box by Button.\n\t\t\t\t\t\t\t\t{ minWidth: 24, padding: 0 }\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ isChild && (\n\t\t\t\t\t\t<span className=\"block-editor-block-card__child-indicator-icon\">\n\t\t\t\t\t\t\t<Icon icon={ isRTL() ? arrowLeft : arrowRight } />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) }\n\t\t\t\t\t<OptionalParentSelectButton\n\t\t\t\t\t\tonClick={\n\t\t\t\t\t\t\tparentClientId\n\t\t\t\t\t\t\t\t? () => {\n\t\t\t\t\t\t\t\t\t\tselectBlock( parentClientId );\n\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<BlockIcon icon={ icon } showColors />\n\t\t\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t\t\t<TitleElement className=\"block-editor-block-card__title\">\n\t\t\t\t\t\t\t\t<span className=\"block-editor-block-card__name\">\n\t\t\t\t\t\t\t\t\t{ !! name?.length ? name : title }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t{ ! parentClientId &&\n\t\t\t\t\t\t\t\t\t! isChild &&\n\t\t\t\t\t\t\t\t\t!! name?.length && (\n\t\t\t\t\t\t\t\t\t\t<WCBadge>{ title }</WCBadge>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</TitleElement>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t</OptionalParentSelectButton>\n\t\t\t\t</HStack>\n\t\t\t\t{ ! parentClientId && ! isChild && description && (\n\t\t\t\t\t<WCText className=\"block-editor-block-card__description\">\n\t\t\t\t\t\t{ description }\n\t\t\t\t\t</WCText>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n\nexport default BlockCard;\n"],
+  "mappings": "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",
+  "names": ["componentsPrivateApis", "deprecated", "blockEditorStore", "clsx", "VStack", "HStack", "BlockIcon", "WCText"]
 }

package/build/components/block-mover/button.cjs

@@ -37,6 +37,7 @@ module.exports = __toCommonJS(button_exports);
 var import_clsx = __toESM(require("clsx"));
 var import_blocks = require("@wordpress/blocks");
 var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_compose = require("@wordpress/compose");
 var import_data = require("@wordpress/data");
 var import_element = require("@wordpress/element");
@@ -77,8 +78,12 @@ var getMovementDirectionLabel = (moveDirection, orientation) => {
 var BlockMoverButton = (0, import_element.forwardRef)(
   ({ clientIds, direction, orientation: moverOrientation, ...props }, ref) => {
     const instanceId = (0, import_compose.useInstanceId)(BlockMoverButton);
-    const normalizedClientIds = Array.isArray(clientIds) ? clientIds : [clientIds];
+    const normalizedClientIds = (0, import_element.useMemo)(
+      () => Array.isArray(clientIds) ? clientIds : [clientIds],
+      [clientIds]
+    );
     const blocksCount = normalizedClientIds.length;
+    const isMobileViewport = (0, import_compose.useViewportMatch)("small", "<");
     const {
       blockType,
       isDisabled,
@@ -117,7 +122,7 @@ var BlockMoverButton = (0, import_element.forwardRef)(
           orientation: moverOrientation || blockListOrientation
         };
       },
-      [clientIds, direction]
+      [direction, moverOrientation, normalizedClientIds]
     );
     const { moveBlocksDown, moveBlocksUp } = (0, import_data.useDispatch)(import_store.store);
     const moverFunction = direction === "up" ? moveBlocksUp : moveBlocksDown;
@@ -143,6 +148,7 @@ var BlockMoverButton = (0, import_element.forwardRef)(
             direction,
             orientation
           ),
+          tooltipPosition: !isMobileViewport && direction === "down" && orientation === "vertical" ? "bottom" : "top",
           "aria-describedby": descriptionId,
           ...props,
           onClick: isDisabled ? null : onClick,
@@ -151,7 +157,7 @@ var BlockMoverButton = (0, import_element.forwardRef)(
           shortcut: direction === "up" ? import_keycodes.displayShortcut.secondary("t") : import_keycodes.displayShortcut.secondary("y")
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { id: descriptionId, children: (0, import_mover_description.getBlockMoverDescription)(
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.VisuallyHidden, { id: descriptionId, children: (0, import_mover_description.getBlockMoverDescription)(
         blocksCount,
         blockType && blockType.title,
         firstIndex,

package/build/components/block-mover/button.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-mover/button.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { Button, VisuallyHidden } from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { forwardRef } from '@wordpress/element';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport {\n\tchevronLeft,\n\tchevronRight,\n\tchevronUp,\n\tchevronDown,\n} from '@wordpress/icons';\nimport { getBlockMoverDescription } from './mover-description';\nimport { store as blockEditorStore } from '../../store';\n\nconst getArrowIcon = ( direction, orientation ) => {\n\tif ( direction === 'up' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? chevronRight : chevronLeft;\n\t\t}\n\t\treturn chevronUp;\n\t} else if ( direction === 'down' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? chevronLeft : chevronRight;\n\t\t}\n\t\treturn chevronDown;\n\t}\n\treturn null;\n};\n\nconst getMovementDirectionLabel = ( moveDirection, orientation ) => {\n\tif ( moveDirection === 'up' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? __( 'Move right' ) : __( 'Move left' );\n\t\t}\n\t\treturn __( 'Move up' );\n\t} else if ( moveDirection === 'down' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? __( 'Move left' ) : __( 'Move right' );\n\t\t}\n\t\treturn __( 'Move down' );\n\t}\n\treturn null;\n};\n\nconst BlockMoverButton = forwardRef(\n\t(\n\t\t{ clientIds, direction, orientation: moverOrientation, ...props },\n\t\tref\n\t) => {\n\t\tconst instanceId = useInstanceId( BlockMoverButton );\n\t\tconst normalizedClientIds = Array.isArray( clientIds )\n\t\t\t? clientIds\n\t\t\t: [ clientIds ];\n\t\tconst blocksCount = normalizedClientIds.length;\n\n\t\tconst {\n\t\t\tblockType,\n\t\t\tisDisabled,\n\t\t\trootClientId,\n\t\t\tisFirst,\n\t\t\tisLast,\n\t\t\tfirstIndex,\n\t\t\torientation = 'vertical',\n\t\t} = useSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetBlockIndex,\n\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\tgetBlockOrder,\n\t\t\t\t\tgetBlock,\n\t\t\t\t\tgetBlockListSettings,\n\t\t\t\t} = select( blockEditorStore );\n\t\t\t\tconst firstClientId = normalizedClientIds[ 0 ];\n\t\t\t\tconst blockRootClientId = getBlockRootClientId( firstClientId );\n\t\t\t\tconst firstBlockIndex = getBlockIndex( firstClientId );\n\t\t\t\tconst lastBlockIndex = getBlockIndex(\n\t\t\t\t\tnormalizedClientIds[ normalizedClientIds.length - 1 ]\n\t\t\t\t);\n\t\t\t\tconst blockOrder = getBlockOrder( blockRootClientId );\n\t\t\t\tconst block = getBlock( firstClientId );\n\t\t\t\tconst isFirstBlock = firstBlockIndex === 0;\n\t\t\t\tconst isLastBlock = lastBlockIndex === blockOrder.length - 1;\n\t\t\t\tconst { orientation: blockListOrientation } =\n\t\t\t\t\tgetBlockListSettings( blockRootClientId ) || {};\n\n\t\t\t\treturn {\n\t\t\t\t\tblockType: block ? getBlockType( block.name ) : null,\n\t\t\t\t\tisDisabled: direction === 'up' ? isFirstBlock : isLastBlock,\n\t\t\t\t\trootClientId: blockRootClientId,\n\t\t\t\t\tfirstIndex: firstBlockIndex,\n\t\t\t\t\tisFirst: isFirstBlock,\n\t\t\t\t\tisLast: isLastBlock,\n\t\t\t\t\torientation: moverOrientation || blockListOrientation,\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientIds, direction ]\n\t\t);\n\n\t\tconst { moveBlocksDown, moveBlocksUp } =\n\t\t\tuseDispatch( blockEditorStore );\n\t\tconst moverFunction =\n\t\t\tdirection === 'up' ? moveBlocksUp : moveBlocksDown;\n\n\t\tconst onClick = ( event ) => {\n\t\t\tmoverFunction( clientIds, rootClientId );\n\t\t\tif ( props.onClick ) {\n\t\t\t\tprops.onClick( event );\n\t\t\t}\n\t\t};\n\n\t\tconst descriptionId = `block-editor-block-mover-button__description-${ instanceId }`;\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Button\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t`is-${ direction }-button`\n\t\t\t\t\t) }\n\t\t\t\t\ticon={ getArrowIcon( direction, orientation ) }\n\t\t\t\t\tlabel={ getMovementDirectionLabel(\n\t\t\t\t\t\tdirection,\n\t\t\t\t\t\torientation\n\t\t\t\t\t) }\n\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tonClick={ isDisabled ? null : onClick }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tshortcut={\n\t\t\t\t\t\tdirection === 'up'\n\t\t\t\t\t\t\t? displayShortcut.secondary( 't' )\n\t\t\t\t\t\t\t: displayShortcut.secondary( 'y' )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t{ getBlockMoverDescription(\n\t\t\t\t\t\tblocksCount,\n\t\t\t\t\t\tblockType && blockType.title,\n\t\t\t\t\t\tfirstIndex,\n\t\t\t\t\t\tisFirst,\n\t\t\t\t\t\tisLast,\n\t\t\t\t\t\tdirection === 'up' ? -1 : 1,\n\t\t\t\t\t\torientation\n\t\t\t\t\t) }\n\t\t\t\t</VisuallyHidden>\n\t\t\t</>\n\t\t);\n\t}\n);\n\nexport const BlockMoverUpButton = forwardRef( ( props, ref ) => {\n\treturn <BlockMoverButton direction=\"up\" ref={ ref } { ...props } />;\n} );\n\nexport const BlockMoverDownButton = forwardRef( ( props, ref ) => {\n\treturn <BlockMoverButton direction=\"down\" ref={ ref } { ...props } />;\n} );\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { Button } from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport { useInstanceId, useViewportMatch } from '@wordpress/compose';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { forwardRef, useMemo } from '@wordpress/element';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport {\n\tchevronLeft,\n\tchevronRight,\n\tchevronUp,\n\tchevronDown,\n} from '@wordpress/icons';\nimport { getBlockMoverDescription } from './mover-description';\nimport { store as blockEditorStore } from '../../store';\n\nconst getArrowIcon = ( direction, orientation ) => {\n\tif ( direction === 'up' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? chevronRight : chevronLeft;\n\t\t}\n\t\treturn chevronUp;\n\t} else if ( direction === 'down' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? chevronLeft : chevronRight;\n\t\t}\n\t\treturn chevronDown;\n\t}\n\treturn null;\n};\n\nconst getMovementDirectionLabel = ( moveDirection, orientation ) => {\n\tif ( moveDirection === 'up' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? __( 'Move right' ) : __( 'Move left' );\n\t\t}\n\t\treturn __( 'Move up' );\n\t} else if ( moveDirection === 'down' ) {\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\treturn isRTL() ? __( 'Move left' ) : __( 'Move right' );\n\t\t}\n\t\treturn __( 'Move down' );\n\t}\n\treturn null;\n};\n\nconst BlockMoverButton = forwardRef(\n\t(\n\t\t{ clientIds, direction, orientation: moverOrientation, ...props },\n\t\tref\n\t) => {\n\t\tconst instanceId = useInstanceId( BlockMoverButton );\n\t\tconst normalizedClientIds = useMemo(\n\t\t\t() => ( Array.isArray( clientIds ) ? clientIds : [ clientIds ] ),\n\t\t\t[ clientIds ]\n\t\t);\n\t\tconst blocksCount = normalizedClientIds.length;\n\t\tconst isMobileViewport = useViewportMatch( 'small', '<' );\n\n\t\tconst {\n\t\t\tblockType,\n\t\t\tisDisabled,\n\t\t\trootClientId,\n\t\t\tisFirst,\n\t\t\tisLast,\n\t\t\tfirstIndex,\n\t\t\torientation = 'vertical',\n\t\t} = useSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetBlockIndex,\n\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\tgetBlockOrder,\n\t\t\t\t\tgetBlock,\n\t\t\t\t\tgetBlockListSettings,\n\t\t\t\t} = select( blockEditorStore );\n\t\t\t\tconst firstClientId = normalizedClientIds[ 0 ];\n\t\t\t\tconst blockRootClientId = getBlockRootClientId( firstClientId );\n\t\t\t\tconst firstBlockIndex = getBlockIndex( firstClientId );\n\t\t\t\tconst lastBlockIndex = getBlockIndex(\n\t\t\t\t\tnormalizedClientIds[ normalizedClientIds.length - 1 ]\n\t\t\t\t);\n\t\t\t\tconst blockOrder = getBlockOrder( blockRootClientId );\n\t\t\t\tconst block = getBlock( firstClientId );\n\t\t\t\tconst isFirstBlock = firstBlockIndex === 0;\n\t\t\t\tconst isLastBlock = lastBlockIndex === blockOrder.length - 1;\n\t\t\t\tconst { orientation: blockListOrientation } =\n\t\t\t\t\tgetBlockListSettings( blockRootClientId ) || {};\n\n\t\t\t\treturn {\n\t\t\t\t\tblockType: block ? getBlockType( block.name ) : null,\n\t\t\t\t\tisDisabled: direction === 'up' ? isFirstBlock : isLastBlock,\n\t\t\t\t\trootClientId: blockRootClientId,\n\t\t\t\t\tfirstIndex: firstBlockIndex,\n\t\t\t\t\tisFirst: isFirstBlock,\n\t\t\t\t\tisLast: isLastBlock,\n\t\t\t\t\torientation: moverOrientation || blockListOrientation,\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ direction, moverOrientation, normalizedClientIds ]\n\t\t);\n\n\t\tconst { moveBlocksDown, moveBlocksUp } =\n\t\t\tuseDispatch( blockEditorStore );\n\t\tconst moverFunction =\n\t\t\tdirection === 'up' ? moveBlocksUp : moveBlocksDown;\n\n\t\tconst onClick = ( event ) => {\n\t\t\tmoverFunction( clientIds, rootClientId );\n\t\t\tif ( props.onClick ) {\n\t\t\t\tprops.onClick( event );\n\t\t\t}\n\t\t};\n\n\t\tconst descriptionId = `block-editor-block-mover-button__description-${ instanceId }`;\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Button\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t`is-${ direction }-button`\n\t\t\t\t\t) }\n\t\t\t\t\ticon={ getArrowIcon( direction, orientation ) }\n\t\t\t\t\tlabel={ getMovementDirectionLabel(\n\t\t\t\t\t\tdirection,\n\t\t\t\t\t\torientation\n\t\t\t\t\t) }\n\t\t\t\t\ttooltipPosition={\n\t\t\t\t\t\t! isMobileViewport &&\n\t\t\t\t\t\tdirection === 'down' &&\n\t\t\t\t\t\torientation === 'vertical'\n\t\t\t\t\t\t\t? 'bottom'\n\t\t\t\t\t\t\t: 'top'\n\t\t\t\t\t}\n\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tonClick={ isDisabled ? null : onClick }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tshortcut={\n\t\t\t\t\t\tdirection === 'up'\n\t\t\t\t\t\t\t? displayShortcut.secondary( 't' )\n\t\t\t\t\t\t\t: displayShortcut.secondary( 'y' )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t{ getBlockMoverDescription(\n\t\t\t\t\t\tblocksCount,\n\t\t\t\t\t\tblockType && blockType.title,\n\t\t\t\t\t\tfirstIndex,\n\t\t\t\t\t\tisFirst,\n\t\t\t\t\t\tisLast,\n\t\t\t\t\t\tdirection === 'up' ? -1 : 1,\n\t\t\t\t\t\torientation\n\t\t\t\t\t) }\n\t\t\t\t</VisuallyHidden>\n\t\t\t</>\n\t\t);\n\t}\n);\n\nexport const BlockMoverUpButton = forwardRef( ( props, ref ) => {\n\treturn <BlockMoverButton direction=\"up\" ref={ ref } { ...props } />;\n} );\n\nexport const BlockMoverDownButton = forwardRef( ( props, ref ) => {\n\treturn <BlockMoverButton direction=\"down\" ref={ ref } { ...props } />;\n} );\n"],
+  "mappings": "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",
   "names": ["blockEditorStore", "clsx"]
 }

package/build/components/block-pattern-setup/index.cjs

@@ -36,6 +36,7 @@ module.exports = __toCommonJS(block_pattern_setup_exports);
 var import_data = require("@wordpress/data");
 var import_blocks = require("@wordpress/blocks");
 var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_element = require("@wordpress/element");
 var import_compose = require("@wordpress/compose");
 var import_i18n = require("@wordpress/i18n");
@@ -117,7 +118,7 @@ function BlockPattern({ pattern, onSelect, showTitles }) {
           }
         ),
         showTitles && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `${baseClassName}__item-title`, children: pattern.title }),
-        !!description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { id: descriptionId, children: description })
+        !!description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.VisuallyHidden, { id: descriptionId, children: description })
       ]
     }
   ) });
@@ -138,7 +139,7 @@ function BlockPatternSlide({ active, className, pattern, minHeight }) {
       "aria-describedby": description ? descriptionId : void 0,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_preview.default, { blocks, minHeight }),
-        !!description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { id: descriptionId, children: description })
+        !!description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.VisuallyHidden, { id: descriptionId, children: description })
       ]
     }
   );

package/build/components/block-pattern-setup/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-pattern-setup/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useDispatch } from '@wordpress/data';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { Composite, VisuallyHidden } from '@wordpress/components';\n\nimport { useState } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport BlockPreview from '../block-preview';\nimport SetupToolbar from './setup-toolbar';\nimport usePatternsSetup from './use-patterns-setup';\nimport { VIEWMODES } from './constants';\n\nconst SetupContent = ( {\n\tviewMode,\n\tactiveSlide,\n\tpatterns,\n\tonBlockPatternSelect,\n\tshowTitles,\n} ) => {\n\tconst containerClass = 'block-editor-block-pattern-setup__container';\n\n\tif ( viewMode === VIEWMODES.carousel ) {\n\t\tconst slideClass = new Map( [\n\t\t\t[ activeSlide, 'active-slide' ],\n\t\t\t[ activeSlide - 1, 'previous-slide' ],\n\t\t\t[ activeSlide + 1, 'next-slide' ],\n\t\t] );\n\t\treturn (\n\t\t\t<div className=\"block-editor-block-pattern-setup__carousel\">\n\t\t\t\t<div className={ containerClass }>\n\t\t\t\t\t<div className=\"carousel-container\">\n\t\t\t\t\t\t{ patterns.map( ( pattern, index ) => (\n\t\t\t\t\t\t\t<BlockPatternSlide\n\t\t\t\t\t\t\t\tactive={ index === activeSlide }\n\t\t\t\t\t\t\t\tclassName={ slideClass.get( index ) || '' }\n\t\t\t\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className=\"block-editor-block-pattern-setup__grid\">\n\t\t\t<Composite\n\t\t\t\trole=\"listbox\"\n\t\t\t\tclassName={ containerClass }\n\t\t\t\taria-label={ __( 'Patterns list' ) }\n\t\t\t>\n\t\t\t\t{ patterns.map( ( pattern ) => (\n\t\t\t\t\t<BlockPattern\n\t\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\t\tonSelect={ onBlockPatternSelect }\n\t\t\t\t\t\tshowTitles={ showTitles }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</Composite>\n\t\t</div>\n\t);\n};\n\nfunction BlockPattern( { pattern, onSelect, showTitles } ) {\n\tconst baseClassName = 'block-editor-block-pattern-setup-list';\n\tconst { blocks, description, viewportWidth = 700 } = pattern;\n\tconst descriptionId = useInstanceId(\n\t\tBlockPattern,\n\t\t`${ baseClassName }__item-description`\n\t);\n\treturn (\n\t\t<div className={ `${ baseClassName }__list-item` }>\n\t\t\t<Composite.Item\n\t\t\t\trender={\n\t\t\t\t\t<div\n\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\tdescription ? descriptionId : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\taria-label={ pattern.title }\n\t\t\t\t\t\tclassName={ `${ baseClassName }__item` }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\tid={ `${ baseClassName }__pattern__${ pattern.name }` }\n\t\t\t\trole=\"option\"\n\t\t\t\tonClick={ () => onSelect( blocks ) }\n\t\t\t>\n\t\t\t\t<BlockPreview\n\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t/>\n\t\t\t\t{ showTitles && (\n\t\t\t\t\t<div className={ `${ baseClassName }__item-title` }>\n\t\t\t\t\t\t{ pattern.title }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t{ !! description && (\n\t\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t\t{ description }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t) }\n\t\t\t</Composite.Item>\n\t\t</div>\n\t);\n}\n\nfunction BlockPatternSlide( { active, className, pattern, minHeight } ) {\n\tconst { blocks, title, description } = pattern;\n\tconst descriptionId = useInstanceId(\n\t\tBlockPatternSlide,\n\t\t'block-editor-block-pattern-setup-list__item-description'\n\t);\n\treturn (\n\t\t<div\n\t\t\taria-hidden={ ! active }\n\t\t\trole=\"img\"\n\t\t\tclassName={ `pattern-slide ${ className }` }\n\t\t\taria-label={ title }\n\t\t\taria-describedby={ description ? descriptionId : undefined }\n\t\t>\n\t\t\t<BlockPreview blocks={ blocks } minHeight={ minHeight } />\n\t\t\t{ !! description && (\n\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t{ description }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nconst BlockPatternSetup = ( {\n\tclientId,\n\tblockName,\n\tfilterPatternsFn,\n\tonBlockPatternSelect,\n\tinitialViewMode = VIEWMODES.carousel,\n\tshowTitles = false,\n} ) => {\n\tconst [ viewMode, setViewMode ] = useState( initialViewMode );\n\tconst [ activeSlide, setActiveSlide ] = useState( 0 );\n\tconst { replaceBlock } = useDispatch( blockEditorStore );\n\tconst patterns = usePatternsSetup( clientId, blockName, filterPatternsFn );\n\n\tif ( ! patterns?.length ) {\n\t\treturn null;\n\t}\n\n\tconst onBlockPatternSelectDefault = ( blocks ) => {\n\t\tconst clonedBlocks = blocks.map( ( block ) => cloneBlock( block ) );\n\t\treplaceBlock( clientId, clonedBlocks );\n\t};\n\tconst onPatternSelectCallback =\n\t\tonBlockPatternSelect || onBlockPatternSelectDefault;\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tclassName={ `block-editor-block-pattern-setup view-mode-${ viewMode }` }\n\t\t\t>\n\t\t\t\t<SetupContent\n\t\t\t\t\tviewMode={ viewMode }\n\t\t\t\t\tactiveSlide={ activeSlide }\n\t\t\t\t\tpatterns={ patterns }\n\t\t\t\t\tonBlockPatternSelect={ onPatternSelectCallback }\n\t\t\t\t\tshowTitles={ showTitles }\n\t\t\t\t/>\n\t\t\t\t<SetupToolbar\n\t\t\t\t\tviewMode={ viewMode }\n\t\t\t\t\tsetViewMode={ setViewMode }\n\t\t\t\t\tactiveSlide={ activeSlide }\n\t\t\t\t\ttotalSlides={ patterns.length }\n\t\t\t\t\thandleNext={ () => {\n\t\t\t\t\t\tsetActiveSlide( ( active ) =>\n\t\t\t\t\t\t\tMath.min( active + 1, patterns.length - 1 )\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t\thandlePrevious={ () => {\n\t\t\t\t\t\tsetActiveSlide( ( active ) =>\n\t\t\t\t\t\t\tMath.max( active - 1, 0 )\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t\tonBlockPatternSelect={ () => {\n\t\t\t\t\t\tonPatternSelectCallback(\n\t\t\t\t\t\t\tpatterns[ activeSlide ].blocks\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n\nexport default BlockPatternSetup;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useDispatch } from '@wordpress/data';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { Composite } from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\n\nimport { useState } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport BlockPreview from '../block-preview';\nimport SetupToolbar from './setup-toolbar';\nimport usePatternsSetup from './use-patterns-setup';\nimport { VIEWMODES } from './constants';\n\nconst SetupContent = ( {\n\tviewMode,\n\tactiveSlide,\n\tpatterns,\n\tonBlockPatternSelect,\n\tshowTitles,\n} ) => {\n\tconst containerClass = 'block-editor-block-pattern-setup__container';\n\n\tif ( viewMode === VIEWMODES.carousel ) {\n\t\tconst slideClass = new Map( [\n\t\t\t[ activeSlide, 'active-slide' ],\n\t\t\t[ activeSlide - 1, 'previous-slide' ],\n\t\t\t[ activeSlide + 1, 'next-slide' ],\n\t\t] );\n\t\treturn (\n\t\t\t<div className=\"block-editor-block-pattern-setup__carousel\">\n\t\t\t\t<div className={ containerClass }>\n\t\t\t\t\t<div className=\"carousel-container\">\n\t\t\t\t\t\t{ patterns.map( ( pattern, index ) => (\n\t\t\t\t\t\t\t<BlockPatternSlide\n\t\t\t\t\t\t\t\tactive={ index === activeSlide }\n\t\t\t\t\t\t\t\tclassName={ slideClass.get( index ) || '' }\n\t\t\t\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className=\"block-editor-block-pattern-setup__grid\">\n\t\t\t<Composite\n\t\t\t\trole=\"listbox\"\n\t\t\t\tclassName={ containerClass }\n\t\t\t\taria-label={ __( 'Patterns list' ) }\n\t\t\t>\n\t\t\t\t{ patterns.map( ( pattern ) => (\n\t\t\t\t\t<BlockPattern\n\t\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\t\tonSelect={ onBlockPatternSelect }\n\t\t\t\t\t\tshowTitles={ showTitles }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</Composite>\n\t\t</div>\n\t);\n};\n\nfunction BlockPattern( { pattern, onSelect, showTitles } ) {\n\tconst baseClassName = 'block-editor-block-pattern-setup-list';\n\tconst { blocks, description, viewportWidth = 700 } = pattern;\n\tconst descriptionId = useInstanceId(\n\t\tBlockPattern,\n\t\t`${ baseClassName }__item-description`\n\t);\n\treturn (\n\t\t<div className={ `${ baseClassName }__list-item` }>\n\t\t\t<Composite.Item\n\t\t\t\trender={\n\t\t\t\t\t<div\n\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\tdescription ? descriptionId : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\taria-label={ pattern.title }\n\t\t\t\t\t\tclassName={ `${ baseClassName }__item` }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\tid={ `${ baseClassName }__pattern__${ pattern.name }` }\n\t\t\t\trole=\"option\"\n\t\t\t\tonClick={ () => onSelect( blocks ) }\n\t\t\t>\n\t\t\t\t<BlockPreview\n\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t/>\n\t\t\t\t{ showTitles && (\n\t\t\t\t\t<div className={ `${ baseClassName }__item-title` }>\n\t\t\t\t\t\t{ pattern.title }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t{ !! description && (\n\t\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t\t{ description }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t) }\n\t\t\t</Composite.Item>\n\t\t</div>\n\t);\n}\n\nfunction BlockPatternSlide( { active, className, pattern, minHeight } ) {\n\tconst { blocks, title, description } = pattern;\n\tconst descriptionId = useInstanceId(\n\t\tBlockPatternSlide,\n\t\t'block-editor-block-pattern-setup-list__item-description'\n\t);\n\treturn (\n\t\t<div\n\t\t\taria-hidden={ ! active }\n\t\t\trole=\"img\"\n\t\t\tclassName={ `pattern-slide ${ className }` }\n\t\t\taria-label={ title }\n\t\t\taria-describedby={ description ? descriptionId : undefined }\n\t\t>\n\t\t\t<BlockPreview blocks={ blocks } minHeight={ minHeight } />\n\t\t\t{ !! description && (\n\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t{ description }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nconst BlockPatternSetup = ( {\n\tclientId,\n\tblockName,\n\tfilterPatternsFn,\n\tonBlockPatternSelect,\n\tinitialViewMode = VIEWMODES.carousel,\n\tshowTitles = false,\n} ) => {\n\tconst [ viewMode, setViewMode ] = useState( initialViewMode );\n\tconst [ activeSlide, setActiveSlide ] = useState( 0 );\n\tconst { replaceBlock } = useDispatch( blockEditorStore );\n\tconst patterns = usePatternsSetup( clientId, blockName, filterPatternsFn );\n\n\tif ( ! patterns?.length ) {\n\t\treturn null;\n\t}\n\n\tconst onBlockPatternSelectDefault = ( blocks ) => {\n\t\tconst clonedBlocks = blocks.map( ( block ) => cloneBlock( block ) );\n\t\treplaceBlock( clientId, clonedBlocks );\n\t};\n\tconst onPatternSelectCallback =\n\t\tonBlockPatternSelect || onBlockPatternSelectDefault;\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tclassName={ `block-editor-block-pattern-setup view-mode-${ viewMode }` }\n\t\t\t>\n\t\t\t\t<SetupContent\n\t\t\t\t\tviewMode={ viewMode }\n\t\t\t\t\tactiveSlide={ activeSlide }\n\t\t\t\t\tpatterns={ patterns }\n\t\t\t\t\tonBlockPatternSelect={ onPatternSelectCallback }\n\t\t\t\t\tshowTitles={ showTitles }\n\t\t\t\t/>\n\t\t\t\t<SetupToolbar\n\t\t\t\t\tviewMode={ viewMode }\n\t\t\t\t\tsetViewMode={ setViewMode }\n\t\t\t\t\tactiveSlide={ activeSlide }\n\t\t\t\t\ttotalSlides={ patterns.length }\n\t\t\t\t\thandleNext={ () => {\n\t\t\t\t\t\tsetActiveSlide( ( active ) =>\n\t\t\t\t\t\t\tMath.min( active + 1, patterns.length - 1 )\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t\thandlePrevious={ () => {\n\t\t\t\t\t\tsetActiveSlide( ( active ) =>\n\t\t\t\t\t\t\tMath.max( active - 1, 0 )\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t\tonBlockPatternSelect={ () => {\n\t\t\t\t\t\tonPatternSelectCallback(\n\t\t\t\t\t\t\tpatterns[ activeSlide ].blocks\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n\nexport default BlockPatternSetup;\n"],
+  "mappings": "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",
   "names": ["BlockPreview", "blockEditorStore", "usePatternsSetup", "SetupToolbar"]
 }

package/build/components/block-patterns-list/index.cjs

@@ -37,6 +37,7 @@ var import_clsx = __toESM(require("clsx"));
 var import_blocks = require("@wordpress/blocks");
 var import_element = require("@wordpress/element");
 var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_compose = require("@wordpress/compose");
 var import_i18n = require("@wordpress/i18n");
 var import_icons = require("@wordpress/icons");
@@ -170,7 +171,7 @@ function BlockPattern({
                         ]
                       }
                     ),
-                    !!pattern.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { id: descriptionId, children: pattern.description })
+                    !!pattern.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.VisuallyHidden, { id: descriptionId, children: pattern.description })
                   ]
                 }
               )