@wordpress/block-library 9.43.0 → 9.43.1-next.v.202604091042.0

package/build-module/search/edit.mjs

@@ -57,7 +57,6 @@ function SearchEdit({
     buttonText,
     buttonPosition,
     buttonUseIcon,
-    isSearchFieldHidden,
     style
   } = attributes;
   const wasJustInsertedIntoNavigationBlock = useSelect(
@@ -112,27 +111,13 @@ function SearchEdit({
   const isButtonPositionOutside = "button-outside" === buttonPosition;
   const hasNoButton = "no-button" === buttonPosition;
   const hasOnlyButton = "button-only" === buttonPosition;
+  const isSearchFieldHidden = hasOnlyButton && !isSelected;
   const searchFieldRef = useRef();
   const buttonRef = useRef();
   const units = useCustomUnits({
     availableUnits: ["%", "px"],
     defaultValues: { "%": PC_WIDTH_DEFAULT, px: PX_WIDTH_DEFAULT }
   });
-  useEffect(() => {
-    if (hasOnlyButton && !isSelected) {
-      setAttributes({
-        isSearchFieldHidden: true
-      });
-    }
-  }, [hasOnlyButton, isSelected, setAttributes]);
-  useEffect(() => {
-    if (!hasOnlyButton || !isSelected) {
-      return;
-    }
-    setAttributes({
-      isSearchFieldHidden: false
-    });
-  }, [hasOnlyButton, isSelected, setAttributes, width]);
   const getBlockClassNames = () => {
     return clsx(
       className,
@@ -142,7 +127,7 @@ function SearchEdit({
       hasOnlyButton ? "wp-block-search__button-only" : void 0,
       !buttonUseIcon && !hasNoButton ? "wp-block-search__text-button" : void 0,
       buttonUseIcon && !hasNoButton ? "wp-block-search__icon-button" : void 0,
-      hasOnlyButton && isSearchFieldHidden ? "wp-block-search__searchfield-hidden" : void 0
+      isSearchFieldHidden ? "wp-block-search__searchfield-hidden" : void 0
     );
   };
   const buttonPositionControls = [
@@ -223,13 +208,6 @@ function SearchEdit({
         borderBottomRightRadius: borderProps.style?.borderBottomRightRadius
       } : borderProps.style
     };
-    const handleButtonClick = () => {
-      if (hasOnlyButton) {
-        setAttributes({
-          isSearchFieldHidden: !isSearchFieldHidden
-        });
-      }
-    };
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       buttonUseIcon && /* @__PURE__ */ jsx(
         "button",
@@ -238,7 +216,6 @@ function SearchEdit({
           className: buttonClasses,
           style: buttonStyles,
           "aria-label": buttonText ? stripHTML(buttonText) : __("Search"),
-          onClick: handleButtonClick,
           ref: buttonRef,
           children: /* @__PURE__ */ jsx(Icon, { icon: search })
         }
@@ -253,8 +230,7 @@ function SearchEdit({
           placeholder: __("Add button text\u2026"),
           withoutInteractiveFormatting: true,
           value: buttonText,
-          onChange: (html) => setAttributes({ buttonText: html }),
-          onClick: handleButtonClick
+          onChange: (html) => setAttributes({ buttonText: html })
         }
       )
     ] });
@@ -270,8 +246,7 @@ function SearchEdit({
           widthUnit: void 0,
           showLabel: true,
           buttonUseIcon: false,
-          buttonPosition: "button-outside",
-          isSearchFieldHidden: false
+          buttonPosition: "button-outside"
         });
       },
       dropdownMenuProps,
@@ -306,8 +281,7 @@ function SearchEdit({
             label: __("Button position"),
             onDeselect: () => {
               setAttributes({
-                buttonPosition: "button-outside",
-                isSearchFieldHidden: false
+                buttonPosition: "button-outside"
               });
             },
             isShownByDefault: true,
@@ -319,8 +293,7 @@ function SearchEdit({
                 label: __("Button position"),
                 onChange: (value) => {
                   setAttributes({
-                    buttonPosition: value,
-                    isSearchFieldHidden: value === "button-only"
+                    buttonPosition: value
                   });
                 },
                 options: buttonPositionControls

package/build-module/search/edit.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/search/edit.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseBlockProps,\n\tInspectorControls,\n\tRichText,\n\t__experimentalUseBorderProps as useBorderProps,\n\t__experimentalUseColorProps as useColorProps,\n\tgetTypographyClassesAndStyles as useTypographyProps,\n\tstore as blockEditorStore,\n\t__experimentalGetElementClassName,\n\tuseSettings,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\nimport {\n\tSelectControl,\n\tToggleControl,\n\tResizableBox,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Icon, search } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport {\n\tPC_WIDTH_DEFAULT,\n\tPX_WIDTH_DEFAULT,\n\tMIN_WIDTH,\n\tisPercentageUnit,\n} from './utils.js';\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\n\n// Used to calculate border radius adjustment to avoid \"fat\" corners when\n// button is placed inside wrapper.\nconst DEFAULT_INNER_PADDING = '4px';\nconst PERCENTAGE_WIDTHS = [ 25, 50, 75, 100 ];\n\nexport default function SearchEdit( {\n\tclassName,\n\tattributes,\n\tsetAttributes,\n\ttoggleSelection,\n\tisSelected,\n\tclientId,\n} ) {\n\tconst {\n\t\tlabel,\n\t\tshowLabel,\n\t\tplaceholder,\n\t\twidth,\n\t\twidthUnit,\n\t\talign,\n\t\tbuttonText,\n\t\tbuttonPosition,\n\t\tbuttonUseIcon,\n\t\tisSearchFieldHidden,\n\t\tstyle,\n\t} = attributes;\n\n\tconst wasJustInsertedIntoNavigationBlock = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockParentsByBlockName, wasBlockJustInserted } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn (\n\t\t\t\t!! getBlockParentsByBlockName( clientId, 'core/navigation' )\n\t\t\t\t\t?.length && wasBlockJustInserted( clientId )\n\t\t\t);\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst { __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\tuseEffect( () => {\n\t\tif ( wasJustInsertedIntoNavigationBlock ) {\n\t\t\t// This side-effect should not create an undo level.\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tsetAttributes( {\n\t\t\t\tshowLabel: false,\n\t\t\t\tbuttonUseIcon: true,\n\t\t\t\tbuttonPosition: 'button-inside',\n\t\t\t} );\n\t\t}\n\t}, [\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\twasJustInsertedIntoNavigationBlock,\n\t\tsetAttributes,\n\t] );\n\n\tconst borderRadius = style?.border?.radius;\n\tlet borderProps = useBorderProps( attributes );\n\n\t// Check for old deprecated numerical border radius. Done as a separate\n\t// check so that a borderRadius style won't overwrite the longhand\n\t// per-corner styles.\n\tif ( typeof borderRadius === 'number' ) {\n\t\tborderProps = {\n\t\t\t...borderProps,\n\t\t\tstyle: {\n\t\t\t\t...borderProps.style,\n\t\t\t\tborderRadius: `${ borderRadius }px`,\n\t\t\t},\n\t\t};\n\t}\n\n\tconst colorProps = useColorProps( attributes );\n\tconst [ fluidTypographySettings, layout ] = useSettings(\n\t\t'typography.fluid',\n\t\t'layout'\n\t);\n\tconst typographyProps = useTypographyProps( attributes, {\n\t\ttypography: {\n\t\t\tfluid: fluidTypographySettings,\n\t\t},\n\t\tlayout: {\n\t\t\twideSize: layout?.wideSize,\n\t\t},\n\t} );\n\tconst unitControlInstanceId = useInstanceId( UnitControl );\n\tconst unitControlInputId = `wp-block-search__width-${ unitControlInstanceId }`;\n\tconst isButtonPositionInside = 'button-inside' === buttonPosition;\n\tconst isButtonPositionOutside = 'button-outside' === buttonPosition;\n\tconst hasNoButton = 'no-button' === buttonPosition;\n\tconst hasOnlyButton = 'button-only' === buttonPosition;\n\tconst searchFieldRef = useRef();\n\tconst buttonRef = useRef();\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ '%', 'px' ],\n\t\tdefaultValues: { '%': PC_WIDTH_DEFAULT, px: PX_WIDTH_DEFAULT },\n\t} );\n\n\tuseEffect( () => {\n\t\tif ( hasOnlyButton && ! isSelected ) {\n\t\t\tsetAttributes( {\n\t\t\t\tisSearchFieldHidden: true,\n\t\t\t} );\n\t\t}\n\t}, [ hasOnlyButton, isSelected, setAttributes ] );\n\n\t// Show the search field when width changes.\n\tuseEffect( () => {\n\t\tif ( ! hasOnlyButton || ! isSelected ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\tisSearchFieldHidden: false,\n\t\t} );\n\t}, [ hasOnlyButton, isSelected, setAttributes, width ] );\n\n\tconst getBlockClassNames = () => {\n\t\treturn clsx(\n\t\t\tclassName,\n\t\t\tisButtonPositionInside\n\t\t\t\t? 'wp-block-search__button-inside'\n\t\t\t\t: undefined,\n\t\t\tisButtonPositionOutside\n\t\t\t\t? 'wp-block-search__button-outside'\n\t\t\t\t: undefined,\n\t\t\thasNoButton ? 'wp-block-search__no-button' : undefined,\n\t\t\thasOnlyButton ? 'wp-block-search__button-only' : undefined,\n\t\t\t! buttonUseIcon && ! hasNoButton\n\t\t\t\t? 'wp-block-search__text-button'\n\t\t\t\t: undefined,\n\t\t\tbuttonUseIcon && ! hasNoButton\n\t\t\t\t? 'wp-block-search__icon-button'\n\t\t\t\t: undefined,\n\t\t\thasOnlyButton && isSearchFieldHidden\n\t\t\t\t? 'wp-block-search__searchfield-hidden'\n\t\t\t\t: undefined\n\t\t);\n\t};\n\n\tconst buttonPositionControls = [\n\t\t{\n\t\t\tlabel: __( 'Button outside' ),\n\t\t\tvalue: 'button-outside',\n\t\t},\n\t\t{\n\t\t\tlabel: __( 'Button inside' ),\n\t\t\tvalue: 'button-inside',\n\t\t},\n\t\t{\n\t\t\tlabel: __( 'No button' ),\n\t\t\tvalue: 'no-button',\n\t\t},\n\t\t{\n\t\t\tlabel: __( 'Button only' ),\n\t\t\tvalue: 'button-only',\n\t\t},\n\t];\n\n\tconst getResizableSides = () => {\n\t\tif ( hasOnlyButton ) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn {\n\t\t\tright: align !== 'right',\n\t\t\tleft: align === 'right',\n\t\t};\n\t};\n\n\tconst renderTextField = () => {\n\t\t// If the input is inside the wrapper, the wrapper gets the border color styles/classes, not the input control.\n\t\tconst textFieldClasses = clsx(\n\t\t\t'wp-block-search__input',\n\t\t\tisButtonPositionInside ? undefined : borderProps.className,\n\t\t\ttypographyProps.className\n\t\t);\n\t\tconst textFieldStyles = {\n\t\t\t...( isButtonPositionInside\n\t\t\t\t? {\n\t\t\t\t\t\tborderRadius: borderProps.style?.borderRadius,\n\t\t\t\t\t\tborderTopLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopLeftRadius,\n\t\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopRightRadius,\n\t\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomLeftRadius,\n\t\t\t\t\t\tborderBottomRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomRightRadius,\n\t\t\t\t  }\n\t\t\t\t: borderProps.style ),\n\t\t\t...typographyProps.style,\n\t\t\ttextDecoration: undefined,\n\t\t};\n\n\t\treturn (\n\t\t\t<input\n\t\t\t\ttype=\"search\"\n\t\t\t\tclassName={ textFieldClasses }\n\t\t\t\tstyle={ textFieldStyles }\n\t\t\t\taria-label={ __( 'Optional placeholder text' ) }\n\t\t\t\t// We hide the placeholder field's placeholder when there is a value. This\n\t\t\t\t// stops screen readers from reading the placeholder field's placeholder\n\t\t\t\t// which is confusing.\n\t\t\t\tplaceholder={\n\t\t\t\t\tplaceholder ? undefined : __( 'Optional placeholder\u2026' )\n\t\t\t\t}\n\t\t\t\tvalue={ placeholder }\n\t\t\t\tonChange={ ( event ) =>\n\t\t\t\t\tsetAttributes( { placeholder: event.target.value } )\n\t\t\t\t}\n\t\t\t\tref={ searchFieldRef }\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst renderButton = () => {\n\t\t// If the button is inside the wrapper, the wrapper gets the border color styles/classes, not the button.\n\t\tconst buttonClasses = clsx(\n\t\t\t'wp-block-search__button',\n\t\t\tcolorProps.className,\n\t\t\ttypographyProps.className,\n\t\t\tisButtonPositionInside ? undefined : borderProps.className,\n\t\t\tbuttonUseIcon ? 'has-icon' : undefined,\n\t\t\t__experimentalGetElementClassName( 'button' )\n\t\t);\n\t\tconst buttonStyles = {\n\t\t\t...colorProps.style,\n\t\t\t...typographyProps.style,\n\t\t\t...( isButtonPositionInside\n\t\t\t\t? {\n\t\t\t\t\t\tborderRadius: borderProps.style?.borderRadius,\n\t\t\t\t\t\tborderTopLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopLeftRadius,\n\t\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopRightRadius,\n\t\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomLeftRadius,\n\t\t\t\t\t\tborderBottomRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomRightRadius,\n\t\t\t\t  }\n\t\t\t\t: borderProps.style ),\n\t\t};\n\t\tconst handleButtonClick = () => {\n\t\t\tif ( hasOnlyButton ) {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tisSearchFieldHidden: ! isSearchFieldHidden,\n\t\t\t\t} );\n\t\t\t}\n\t\t};\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ buttonUseIcon && (\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclassName={ buttonClasses }\n\t\t\t\t\t\tstyle={ buttonStyles }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\tbuttonText\n\t\t\t\t\t\t\t\t? stripHTML( buttonText )\n\t\t\t\t\t\t\t\t: __( 'Search' )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={ handleButtonClick }\n\t\t\t\t\t\tref={ buttonRef }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={ search } />\n\t\t\t\t\t</button>\n\t\t\t\t) }\n\n\t\t\t\t{ ! buttonUseIcon && (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\tidentifier=\"buttonText\"\n\t\t\t\t\t\tclassName={ buttonClasses }\n\t\t\t\t\t\tstyle={ buttonStyles }\n\t\t\t\t\t\taria-label={ __( 'Button text' ) }\n\t\t\t\t\t\tplaceholder={ __( 'Add button text\u2026' ) }\n\t\t\t\t\t\twithoutInteractiveFormatting\n\t\t\t\t\t\tvalue={ buttonText }\n\t\t\t\t\t\tonChange={ ( html ) =>\n\t\t\t\t\t\t\tsetAttributes( { buttonText: html } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={ handleButtonClick }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t};\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\tconst controls = (\n\t\t<>\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\twidth: undefined,\n\t\t\t\t\t\t\twidthUnit: undefined,\n\t\t\t\t\t\t\tshowLabel: true,\n\t\t\t\t\t\t\tbuttonUseIcon: false,\n\t\t\t\t\t\t\tbuttonPosition: 'button-outside',\n\t\t\t\t\t\t\tisSearchFieldHidden: false,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => ! showLabel }\n\t\t\t\t\t\tlabel={ __( 'Show label' ) }\n\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tshowLabel: true,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tchecked={ showLabel }\n\t\t\t\t\t\t\tlabel={ __( 'Show label' ) }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tshowLabel: value,\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</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => buttonPosition !== 'button-outside' }\n\t\t\t\t\t\tlabel={ __( 'Button position' ) }\n\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tbuttonPosition: 'button-outside',\n\t\t\t\t\t\t\t\tisSearchFieldHidden: false,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\tvalue={ buttonPosition }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tlabel={ __( 'Button position' ) }\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tbuttonPosition: value,\n\t\t\t\t\t\t\t\t\tisSearchFieldHidden:\n\t\t\t\t\t\t\t\t\t\tvalue === 'button-only',\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\toptions={ buttonPositionControls }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t{ buttonPosition !== 'no-button' && (\n\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\thasValue={ () => !! buttonUseIcon }\n\t\t\t\t\t\t\tlabel={ __( 'Use button with icon' ) }\n\t\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tbuttonUseIcon: false,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\tchecked={ buttonUseIcon }\n\t\t\t\t\t\t\t\tlabel={ __( 'Use button with icon' ) }\n\t\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tbuttonUseIcon: value,\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</ToolsPanelItem>\n\t\t\t\t\t) }\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => !! width }\n\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\twidth: undefined,\n\t\t\t\t\t\t\t\twidthUnit: undefined,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<VStack>\n\t\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\t\t\tid={ unitControlInputId } // Unused, kept for backwards compatibility\n\t\t\t\t\t\t\t\tmin={\n\t\t\t\t\t\t\t\t\tisPercentageUnit( widthUnit )\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: MIN_WIDTH\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\t\tisPercentageUnit( widthUnit )\n\t\t\t\t\t\t\t\t\t\t? 100\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\t\tonChange={ ( newWidth ) => {\n\t\t\t\t\t\t\t\t\tconst parsedNewWidth =\n\t\t\t\t\t\t\t\t\t\tnewWidth === ''\n\t\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t\t: parseInt( newWidth, 10 );\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\twidth: parsedNewWidth,\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\tonUnitChange={ ( newUnit ) => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t'%' === newUnit\n\t\t\t\t\t\t\t\t\t\t\t\t? PC_WIDTH_DEFAULT\n\t\t\t\t\t\t\t\t\t\t\t\t: PX_WIDTH_DEFAULT,\n\t\t\t\t\t\t\t\t\t\twidthUnit: newUnit,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t__unstableInputWidth=\"80px\"\n\t\t\t\t\t\t\t\tvalue={ `${ width }${ widthUnit }` }\n\t\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t\t\t\tlabel={ __( 'Percentage Width' ) }\n\t\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\t\tPERCENTAGE_WIDTHS.includes( width ) &&\n\t\t\t\t\t\t\t\t\twidthUnit === '%'\n\t\t\t\t\t\t\t\t\t\t? width\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tonChange={ ( newWidth ) => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\twidth: newWidth,\n\t\t\t\t\t\t\t\t\t\twidthUnit: '%',\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\tisBlock\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ PERCENTAGE_WIDTHS.map( ( widthValue ) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\t\t\t\t\tkey={ widthValue }\n\t\t\t\t\t\t\t\t\t\t\tvalue={ widthValue }\n\t\t\t\t\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t/* translators: %d: Percentage value. */\n\t\t\t\t\t\t\t\t\t\t\t\t__( '%d%%' ),\n\t\t\t\t\t\t\t\t\t\t\t\twidthValue\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t</ToggleGroupControl>\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n\n\tconst isNonZeroBorderRadius = ( radius ) =>\n\t\tradius !== undefined && parseInt( radius, 10 ) !== 0;\n\n\tconst padBorderRadius = ( radius ) =>\n\t\tisNonZeroBorderRadius( radius )\n\t\t\t? `calc(${ radius } + ${ DEFAULT_INNER_PADDING })`\n\t\t\t: undefined;\n\n\tconst getWrapperStyles = () => {\n\t\tconst styles = isButtonPositionInside\n\t\t\t? borderProps.style\n\t\t\t: {\n\t\t\t\t\tborderRadius: borderProps.style?.borderRadius,\n\t\t\t\t\tborderTopLeftRadius: borderProps.style?.borderTopLeftRadius,\n\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\tborderProps.style?.borderTopRightRadius,\n\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\tborderProps.style?.borderBottomLeftRadius,\n\t\t\t\t\tborderBottomRightRadius:\n\t\t\t\t\t\tborderProps.style?.borderBottomRightRadius,\n\t\t\t  };\n\n\t\tif ( isButtonPositionInside ) {\n\t\t\t// We have button inside wrapper and a border radius value to apply.\n\t\t\t// Add default padding so we don't get \"fat\" corners.\n\t\t\t//\n\t\t\t// CSS calc() is used here to support non-pixel units. The inline\n\t\t\t// style using calc() will only apply if both values have units.\n\n\t\t\tif ( typeof borderRadius === 'object' ) {\n\t\t\t\t// Individual corner border radii present.\n\t\t\t\tconst {\n\t\t\t\t\tborderTopLeftRadius,\n\t\t\t\t\tborderTopRightRadius,\n\t\t\t\t\tborderBottomLeftRadius,\n\t\t\t\t\tborderBottomRightRadius,\n\t\t\t\t} = borderProps.style;\n\n\t\t\t\treturn {\n\t\t\t\t\t...styles,\n\t\t\t\t\tborderTopLeftRadius: padBorderRadius( borderTopLeftRadius ),\n\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\tpadBorderRadius( borderTopRightRadius ),\n\t\t\t\t\tborderBottomLeftRadius: padBorderRadius(\n\t\t\t\t\t\tborderBottomLeftRadius\n\t\t\t\t\t),\n\t\t\t\t\tborderBottomRightRadius: padBorderRadius(\n\t\t\t\t\t\tborderBottomRightRadius\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t}\n\n\t\t\t// The inline style using calc() will only apply if both values\n\t\t\t// supplied to calc() have units. Deprecated block's may have\n\t\t\t// unitless integer.\n\t\t\tconst radius = Number.isInteger( borderRadius )\n\t\t\t\t? `${ borderRadius }px`\n\t\t\t\t: borderRadius;\n\n\t\t\tstyles.borderRadius = `calc(${ radius } + ${ DEFAULT_INNER_PADDING })`;\n\t\t}\n\n\t\treturn styles;\n\t};\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: getBlockClassNames(),\n\t\tstyle: {\n\t\t\t...typographyProps.style,\n\t\t\t// Input opts out of text decoration.\n\t\t\ttextDecoration: undefined,\n\t\t},\n\t} );\n\n\tconst labelClassnames = clsx(\n\t\t'wp-block-search__label',\n\t\ttypographyProps.className\n\t);\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t{ controls }\n\n\t\t\t{ showLabel && (\n\t\t\t\t<RichText\n\t\t\t\t\tidentifier=\"label\"\n\t\t\t\t\tclassName={ labelClassnames }\n\t\t\t\t\taria-label={ __( 'Label text' ) }\n\t\t\t\t\tplaceholder={ __( 'Add label\u2026' ) }\n\t\t\t\t\twithoutInteractiveFormatting\n\t\t\t\t\tvalue={ label }\n\t\t\t\t\tonChange={ ( html ) => setAttributes( { label: html } ) }\n\t\t\t\t\tstyle={ typographyProps.style }\n\t\t\t\t/>\n\t\t\t) }\n\n\t\t\t<ResizableBox\n\t\t\t\tsize={ {\n\t\t\t\t\twidth:\n\t\t\t\t\t\twidth === undefined\n\t\t\t\t\t\t\t? 'auto'\n\t\t\t\t\t\t\t: `${ width }${ widthUnit }`,\n\t\t\t\t\theight: 'auto',\n\t\t\t\t} }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'wp-block-search__inside-wrapper',\n\t\t\t\t\tisButtonPositionInside ? borderProps.className : undefined\n\t\t\t\t) }\n\t\t\t\tstyle={ getWrapperStyles() }\n\t\t\t\tminWidth={ MIN_WIDTH }\n\t\t\t\tenable={ getResizableSides() }\n\t\t\t\tonResizeStart={ ( event, direction, elt ) => {\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\twidth: parseInt( elt.offsetWidth, 10 ),\n\t\t\t\t\t\twidthUnit: 'px',\n\t\t\t\t\t} );\n\t\t\t\t\ttoggleSelection( false );\n\t\t\t\t} }\n\t\t\t\tonResizeStop={ ( event, direction, elt, delta ) => {\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\twidth: parseInt( width + delta.width, 10 ),\n\t\t\t\t\t} );\n\t\t\t\t\ttoggleSelection( true );\n\t\t\t\t} }\n\t\t\t\tshowHandle={ isSelected }\n\t\t\t>\n\t\t\t\t{ ( isButtonPositionInside ||\n\t\t\t\t\tisButtonPositionOutside ||\n\t\t\t\t\thasOnlyButton ) && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{ renderTextField() }\n\t\t\t\t\t\t{ renderButton() }\n\t\t\t\t\t</>\n\t\t\t\t) }\n\n\t\t\t\t{ hasNoButton && renderTextField() }\n\t\t\t</ResizableBox>\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\tuseBlockProps,\n\tInspectorControls,\n\tRichText,\n\t__experimentalUseBorderProps as useBorderProps,\n\t__experimentalUseColorProps as useColorProps,\n\tgetTypographyClassesAndStyles as useTypographyProps,\n\tstore as blockEditorStore,\n\t__experimentalGetElementClassName,\n\tuseSettings,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\nimport {\n\tSelectControl,\n\tToggleControl,\n\tResizableBox,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Icon, search } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport {\n\tPC_WIDTH_DEFAULT,\n\tPX_WIDTH_DEFAULT,\n\tMIN_WIDTH,\n\tisPercentageUnit,\n} from './utils.js';\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\n\n// Used to calculate border radius adjustment to avoid \"fat\" corners when\n// button is placed inside wrapper.\nconst DEFAULT_INNER_PADDING = '4px';\nconst PERCENTAGE_WIDTHS = [ 25, 50, 75, 100 ];\n\nexport default function SearchEdit( {\n\tclassName,\n\tattributes,\n\tsetAttributes,\n\ttoggleSelection,\n\tisSelected,\n\tclientId,\n} ) {\n\tconst {\n\t\tlabel,\n\t\tshowLabel,\n\t\tplaceholder,\n\t\twidth,\n\t\twidthUnit,\n\t\talign,\n\t\tbuttonText,\n\t\tbuttonPosition,\n\t\tbuttonUseIcon,\n\t\tstyle,\n\t} = attributes;\n\n\tconst wasJustInsertedIntoNavigationBlock = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockParentsByBlockName, wasBlockJustInserted } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn (\n\t\t\t\t!! getBlockParentsByBlockName( clientId, 'core/navigation' )\n\t\t\t\t\t?.length && wasBlockJustInserted( clientId )\n\t\t\t);\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst { __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\tuseEffect( () => {\n\t\tif ( wasJustInsertedIntoNavigationBlock ) {\n\t\t\t// This side-effect should not create an undo level.\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tsetAttributes( {\n\t\t\t\tshowLabel: false,\n\t\t\t\tbuttonUseIcon: true,\n\t\t\t\tbuttonPosition: 'button-inside',\n\t\t\t} );\n\t\t}\n\t}, [\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\twasJustInsertedIntoNavigationBlock,\n\t\tsetAttributes,\n\t] );\n\n\tconst borderRadius = style?.border?.radius;\n\tlet borderProps = useBorderProps( attributes );\n\n\t// Check for old deprecated numerical border radius. Done as a separate\n\t// check so that a borderRadius style won't overwrite the longhand\n\t// per-corner styles.\n\tif ( typeof borderRadius === 'number' ) {\n\t\tborderProps = {\n\t\t\t...borderProps,\n\t\t\tstyle: {\n\t\t\t\t...borderProps.style,\n\t\t\t\tborderRadius: `${ borderRadius }px`,\n\t\t\t},\n\t\t};\n\t}\n\n\tconst colorProps = useColorProps( attributes );\n\tconst [ fluidTypographySettings, layout ] = useSettings(\n\t\t'typography.fluid',\n\t\t'layout'\n\t);\n\tconst typographyProps = useTypographyProps( attributes, {\n\t\ttypography: {\n\t\t\tfluid: fluidTypographySettings,\n\t\t},\n\t\tlayout: {\n\t\t\twideSize: layout?.wideSize,\n\t\t},\n\t} );\n\tconst unitControlInstanceId = useInstanceId( UnitControl );\n\tconst unitControlInputId = `wp-block-search__width-${ unitControlInstanceId }`;\n\tconst isButtonPositionInside = 'button-inside' === buttonPosition;\n\tconst isButtonPositionOutside = 'button-outside' === buttonPosition;\n\tconst hasNoButton = 'no-button' === buttonPosition;\n\tconst hasOnlyButton = 'button-only' === buttonPosition;\n\tconst isSearchFieldHidden = hasOnlyButton && ! isSelected;\n\tconst searchFieldRef = useRef();\n\tconst buttonRef = useRef();\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ '%', 'px' ],\n\t\tdefaultValues: { '%': PC_WIDTH_DEFAULT, px: PX_WIDTH_DEFAULT },\n\t} );\n\n\tconst getBlockClassNames = () => {\n\t\treturn clsx(\n\t\t\tclassName,\n\t\t\tisButtonPositionInside\n\t\t\t\t? 'wp-block-search__button-inside'\n\t\t\t\t: undefined,\n\t\t\tisButtonPositionOutside\n\t\t\t\t? 'wp-block-search__button-outside'\n\t\t\t\t: undefined,\n\t\t\thasNoButton ? 'wp-block-search__no-button' : undefined,\n\t\t\thasOnlyButton ? 'wp-block-search__button-only' : undefined,\n\t\t\t! buttonUseIcon && ! hasNoButton\n\t\t\t\t? 'wp-block-search__text-button'\n\t\t\t\t: undefined,\n\t\t\tbuttonUseIcon && ! hasNoButton\n\t\t\t\t? 'wp-block-search__icon-button'\n\t\t\t\t: undefined,\n\t\t\tisSearchFieldHidden\n\t\t\t\t? 'wp-block-search__searchfield-hidden'\n\t\t\t\t: undefined\n\t\t);\n\t};\n\n\tconst buttonPositionControls = [\n\t\t{\n\t\t\tlabel: __( 'Button outside' ),\n\t\t\tvalue: 'button-outside',\n\t\t},\n\t\t{\n\t\t\tlabel: __( 'Button inside' ),\n\t\t\tvalue: 'button-inside',\n\t\t},\n\t\t{\n\t\t\tlabel: __( 'No button' ),\n\t\t\tvalue: 'no-button',\n\t\t},\n\t\t{\n\t\t\tlabel: __( 'Button only' ),\n\t\t\tvalue: 'button-only',\n\t\t},\n\t];\n\n\tconst getResizableSides = () => {\n\t\tif ( hasOnlyButton ) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn {\n\t\t\tright: align !== 'right',\n\t\t\tleft: align === 'right',\n\t\t};\n\t};\n\n\tconst renderTextField = () => {\n\t\t// If the input is inside the wrapper, the wrapper gets the border color styles/classes, not the input control.\n\t\tconst textFieldClasses = clsx(\n\t\t\t'wp-block-search__input',\n\t\t\tisButtonPositionInside ? undefined : borderProps.className,\n\t\t\ttypographyProps.className\n\t\t);\n\t\tconst textFieldStyles = {\n\t\t\t...( isButtonPositionInside\n\t\t\t\t? {\n\t\t\t\t\t\tborderRadius: borderProps.style?.borderRadius,\n\t\t\t\t\t\tborderTopLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopLeftRadius,\n\t\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopRightRadius,\n\t\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomLeftRadius,\n\t\t\t\t\t\tborderBottomRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomRightRadius,\n\t\t\t\t  }\n\t\t\t\t: borderProps.style ),\n\t\t\t...typographyProps.style,\n\t\t\ttextDecoration: undefined,\n\t\t};\n\n\t\treturn (\n\t\t\t<input\n\t\t\t\ttype=\"search\"\n\t\t\t\tclassName={ textFieldClasses }\n\t\t\t\tstyle={ textFieldStyles }\n\t\t\t\taria-label={ __( 'Optional placeholder text' ) }\n\t\t\t\t// We hide the placeholder field's placeholder when there is a value. This\n\t\t\t\t// stops screen readers from reading the placeholder field's placeholder\n\t\t\t\t// which is confusing.\n\t\t\t\tplaceholder={\n\t\t\t\t\tplaceholder ? undefined : __( 'Optional placeholder\u2026' )\n\t\t\t\t}\n\t\t\t\tvalue={ placeholder }\n\t\t\t\tonChange={ ( event ) =>\n\t\t\t\t\tsetAttributes( { placeholder: event.target.value } )\n\t\t\t\t}\n\t\t\t\tref={ searchFieldRef }\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst renderButton = () => {\n\t\t// If the button is inside the wrapper, the wrapper gets the border color styles/classes, not the button.\n\t\tconst buttonClasses = clsx(\n\t\t\t'wp-block-search__button',\n\t\t\tcolorProps.className,\n\t\t\ttypographyProps.className,\n\t\t\tisButtonPositionInside ? undefined : borderProps.className,\n\t\t\tbuttonUseIcon ? 'has-icon' : undefined,\n\t\t\t__experimentalGetElementClassName( 'button' )\n\t\t);\n\t\tconst buttonStyles = {\n\t\t\t...colorProps.style,\n\t\t\t...typographyProps.style,\n\t\t\t...( isButtonPositionInside\n\t\t\t\t? {\n\t\t\t\t\t\tborderRadius: borderProps.style?.borderRadius,\n\t\t\t\t\t\tborderTopLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopLeftRadius,\n\t\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderTopRightRadius,\n\t\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomLeftRadius,\n\t\t\t\t\t\tborderBottomRightRadius:\n\t\t\t\t\t\t\tborderProps.style?.borderBottomRightRadius,\n\t\t\t\t  }\n\t\t\t\t: borderProps.style ),\n\t\t};\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ buttonUseIcon && (\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclassName={ buttonClasses }\n\t\t\t\t\t\tstyle={ buttonStyles }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\tbuttonText\n\t\t\t\t\t\t\t\t? stripHTML( buttonText )\n\t\t\t\t\t\t\t\t: __( 'Search' )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tref={ buttonRef }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={ search } />\n\t\t\t\t\t</button>\n\t\t\t\t) }\n\n\t\t\t\t{ ! buttonUseIcon && (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\tidentifier=\"buttonText\"\n\t\t\t\t\t\tclassName={ buttonClasses }\n\t\t\t\t\t\tstyle={ buttonStyles }\n\t\t\t\t\t\taria-label={ __( 'Button text' ) }\n\t\t\t\t\t\tplaceholder={ __( 'Add button text\u2026' ) }\n\t\t\t\t\t\twithoutInteractiveFormatting\n\t\t\t\t\t\tvalue={ buttonText }\n\t\t\t\t\t\tonChange={ ( html ) =>\n\t\t\t\t\t\t\tsetAttributes( { buttonText: html } )\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t};\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\tconst controls = (\n\t\t<>\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\twidth: undefined,\n\t\t\t\t\t\t\twidthUnit: undefined,\n\t\t\t\t\t\t\tshowLabel: true,\n\t\t\t\t\t\t\tbuttonUseIcon: false,\n\t\t\t\t\t\t\tbuttonPosition: 'button-outside',\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => ! showLabel }\n\t\t\t\t\t\tlabel={ __( 'Show label' ) }\n\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tshowLabel: true,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tchecked={ showLabel }\n\t\t\t\t\t\t\tlabel={ __( 'Show label' ) }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tshowLabel: value,\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</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => buttonPosition !== 'button-outside' }\n\t\t\t\t\t\tlabel={ __( 'Button position' ) }\n\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tbuttonPosition: 'button-outside',\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\tvalue={ buttonPosition }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tlabel={ __( 'Button position' ) }\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tbuttonPosition: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\toptions={ buttonPositionControls }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t{ buttonPosition !== 'no-button' && (\n\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\thasValue={ () => !! buttonUseIcon }\n\t\t\t\t\t\t\tlabel={ __( 'Use button with icon' ) }\n\t\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tbuttonUseIcon: false,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\tchecked={ buttonUseIcon }\n\t\t\t\t\t\t\t\tlabel={ __( 'Use button with icon' ) }\n\t\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tbuttonUseIcon: value,\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</ToolsPanelItem>\n\t\t\t\t\t) }\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => !! width }\n\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\tonDeselect={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\twidth: undefined,\n\t\t\t\t\t\t\t\twidthUnit: undefined,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<VStack>\n\t\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\t\t\tid={ unitControlInputId } // Unused, kept for backwards compatibility\n\t\t\t\t\t\t\t\tmin={\n\t\t\t\t\t\t\t\t\tisPercentageUnit( widthUnit )\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: MIN_WIDTH\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\t\tisPercentageUnit( widthUnit )\n\t\t\t\t\t\t\t\t\t\t? 100\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\t\tonChange={ ( newWidth ) => {\n\t\t\t\t\t\t\t\t\tconst parsedNewWidth =\n\t\t\t\t\t\t\t\t\t\tnewWidth === ''\n\t\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t\t: parseInt( newWidth, 10 );\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\twidth: parsedNewWidth,\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\tonUnitChange={ ( newUnit ) => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t'%' === newUnit\n\t\t\t\t\t\t\t\t\t\t\t\t? PC_WIDTH_DEFAULT\n\t\t\t\t\t\t\t\t\t\t\t\t: PX_WIDTH_DEFAULT,\n\t\t\t\t\t\t\t\t\t\twidthUnit: newUnit,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t__unstableInputWidth=\"80px\"\n\t\t\t\t\t\t\t\tvalue={ `${ width }${ widthUnit }` }\n\t\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t\t\t\tlabel={ __( 'Percentage Width' ) }\n\t\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\t\tPERCENTAGE_WIDTHS.includes( width ) &&\n\t\t\t\t\t\t\t\t\twidthUnit === '%'\n\t\t\t\t\t\t\t\t\t\t? width\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tonChange={ ( newWidth ) => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\twidth: newWidth,\n\t\t\t\t\t\t\t\t\t\twidthUnit: '%',\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\tisBlock\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ PERCENTAGE_WIDTHS.map( ( widthValue ) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\t\t\t\t\tkey={ widthValue }\n\t\t\t\t\t\t\t\t\t\t\tvalue={ widthValue }\n\t\t\t\t\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t/* translators: %d: Percentage value. */\n\t\t\t\t\t\t\t\t\t\t\t\t__( '%d%%' ),\n\t\t\t\t\t\t\t\t\t\t\t\twidthValue\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t</ToggleGroupControl>\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n\n\tconst isNonZeroBorderRadius = ( radius ) =>\n\t\tradius !== undefined && parseInt( radius, 10 ) !== 0;\n\n\tconst padBorderRadius = ( radius ) =>\n\t\tisNonZeroBorderRadius( radius )\n\t\t\t? `calc(${ radius } + ${ DEFAULT_INNER_PADDING })`\n\t\t\t: undefined;\n\n\tconst getWrapperStyles = () => {\n\t\tconst styles = isButtonPositionInside\n\t\t\t? borderProps.style\n\t\t\t: {\n\t\t\t\t\tborderRadius: borderProps.style?.borderRadius,\n\t\t\t\t\tborderTopLeftRadius: borderProps.style?.borderTopLeftRadius,\n\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\tborderProps.style?.borderTopRightRadius,\n\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\tborderProps.style?.borderBottomLeftRadius,\n\t\t\t\t\tborderBottomRightRadius:\n\t\t\t\t\t\tborderProps.style?.borderBottomRightRadius,\n\t\t\t  };\n\n\t\tif ( isButtonPositionInside ) {\n\t\t\t// We have button inside wrapper and a border radius value to apply.\n\t\t\t// Add default padding so we don't get \"fat\" corners.\n\t\t\t//\n\t\t\t// CSS calc() is used here to support non-pixel units. The inline\n\t\t\t// style using calc() will only apply if both values have units.\n\n\t\t\tif ( typeof borderRadius === 'object' ) {\n\t\t\t\t// Individual corner border radii present.\n\t\t\t\tconst {\n\t\t\t\t\tborderTopLeftRadius,\n\t\t\t\t\tborderTopRightRadius,\n\t\t\t\t\tborderBottomLeftRadius,\n\t\t\t\t\tborderBottomRightRadius,\n\t\t\t\t} = borderProps.style;\n\n\t\t\t\treturn {\n\t\t\t\t\t...styles,\n\t\t\t\t\tborderTopLeftRadius: padBorderRadius( borderTopLeftRadius ),\n\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\tpadBorderRadius( borderTopRightRadius ),\n\t\t\t\t\tborderBottomLeftRadius: padBorderRadius(\n\t\t\t\t\t\tborderBottomLeftRadius\n\t\t\t\t\t),\n\t\t\t\t\tborderBottomRightRadius: padBorderRadius(\n\t\t\t\t\t\tborderBottomRightRadius\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t}\n\n\t\t\t// The inline style using calc() will only apply if both values\n\t\t\t// supplied to calc() have units. Deprecated block's may have\n\t\t\t// unitless integer.\n\t\t\tconst radius = Number.isInteger( borderRadius )\n\t\t\t\t? `${ borderRadius }px`\n\t\t\t\t: borderRadius;\n\n\t\t\tstyles.borderRadius = `calc(${ radius } + ${ DEFAULT_INNER_PADDING })`;\n\t\t}\n\n\t\treturn styles;\n\t};\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: getBlockClassNames(),\n\t\tstyle: {\n\t\t\t...typographyProps.style,\n\t\t\t// Input opts out of text decoration.\n\t\t\ttextDecoration: undefined,\n\t\t},\n\t} );\n\n\tconst labelClassnames = clsx(\n\t\t'wp-block-search__label',\n\t\ttypographyProps.className\n\t);\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t{ controls }\n\n\t\t\t{ showLabel && (\n\t\t\t\t<RichText\n\t\t\t\t\tidentifier=\"label\"\n\t\t\t\t\tclassName={ labelClassnames }\n\t\t\t\t\taria-label={ __( 'Label text' ) }\n\t\t\t\t\tplaceholder={ __( 'Add label\u2026' ) }\n\t\t\t\t\twithoutInteractiveFormatting\n\t\t\t\t\tvalue={ label }\n\t\t\t\t\tonChange={ ( html ) => setAttributes( { label: html } ) }\n\t\t\t\t\tstyle={ typographyProps.style }\n\t\t\t\t/>\n\t\t\t) }\n\n\t\t\t<ResizableBox\n\t\t\t\tsize={ {\n\t\t\t\t\twidth:\n\t\t\t\t\t\twidth === undefined\n\t\t\t\t\t\t\t? 'auto'\n\t\t\t\t\t\t\t: `${ width }${ widthUnit }`,\n\t\t\t\t\theight: 'auto',\n\t\t\t\t} }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'wp-block-search__inside-wrapper',\n\t\t\t\t\tisButtonPositionInside ? borderProps.className : undefined\n\t\t\t\t) }\n\t\t\t\tstyle={ getWrapperStyles() }\n\t\t\t\tminWidth={ MIN_WIDTH }\n\t\t\t\tenable={ getResizableSides() }\n\t\t\t\tonResizeStart={ ( event, direction, elt ) => {\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\twidth: parseInt( elt.offsetWidth, 10 ),\n\t\t\t\t\t\twidthUnit: 'px',\n\t\t\t\t\t} );\n\t\t\t\t\ttoggleSelection( false );\n\t\t\t\t} }\n\t\t\t\tonResizeStop={ ( event, direction, elt, delta ) => {\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\twidth: parseInt( width + delta.width, 10 ),\n\t\t\t\t\t} );\n\t\t\t\t\ttoggleSelection( true );\n\t\t\t\t} }\n\t\t\t\tshowHandle={ isSelected }\n\t\t\t>\n\t\t\t\t{ ( isButtonPositionInside ||\n\t\t\t\t\tisButtonPositionOutside ||\n\t\t\t\t\thasOnlyButton ) && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{ renderTextField() }\n\t\t\t\t\t\t{ renderButton() }\n\t\t\t\t\t</>\n\t\t\t\t) }\n\n\t\t\t\t{ hasNoButton && renderTextField() }\n\t\t\t</ResizableBox>\n\t\t</div>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-style/code/style-rtl.css

@@ -5,7 +5,7 @@
   display: block;
   font-family: inherit;
   overflow-wrap: break-word;
-  white-space: pre-wrap;
+  white-space: break-spaces;
   direction: ltr;
   text-align: initial;
 }

package/build-style/code/style.css

@@ -5,7 +5,7 @@
   display: block;
   font-family: inherit;
   overflow-wrap: break-word;
-  white-space: pre-wrap;
+  white-space: break-spaces;
   /*!rtl:begin:ignore*/
   direction: ltr;
   text-align: initial;

package/build-style/style-rtl.css

@@ -427,7 +427,7 @@
   display: block;
   font-family: inherit;
   overflow-wrap: break-word;
-  white-space: pre-wrap;
+  white-space: break-spaces;
   direction: ltr;
   text-align: initial;
 }

package/build-style/style.css

@@ -430,7 +430,7 @@
   display: block;
   font-family: inherit;
   overflow-wrap: break-word;
-  white-space: pre-wrap;
+  white-space: break-spaces;
   /*!rtl:begin:ignore*/
   direction: ltr;
   text-align: initial;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "9.43.0",
+	"version": "9.43.1-next.v.202604091042.0+668146787",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -95,42 +95,42 @@
 	],
 	"dependencies": {
 		"@arraypress/waveform-player": "1.2.1",
-		"@wordpress/a11y": "^4.43.0",
-		"@wordpress/api-fetch": "^7.43.0",
-		"@wordpress/autop": "^4.43.0",
-		"@wordpress/base-styles": "^6.19.0",
-		"@wordpress/blob": "^4.43.0",
-		"@wordpress/block-editor": "^15.16.0",
-		"@wordpress/blocks": "^15.16.0",
-		"@wordpress/components": "^32.5.0",
-		"@wordpress/compose": "^7.43.0",
-		"@wordpress/core-data": "^7.43.0",
-		"@wordpress/data": "^10.43.0",
-		"@wordpress/date": "^5.43.0",
-		"@wordpress/deprecated": "^4.43.0",
-		"@wordpress/dom": "^4.43.0",
-		"@wordpress/element": "^6.43.0",
-		"@wordpress/escape-html": "^3.43.0",
-		"@wordpress/hooks": "^4.43.0",
-		"@wordpress/html-entities": "^4.43.0",
-		"@wordpress/i18n": "^6.16.0",
-		"@wordpress/icons": "^12.1.0",
-		"@wordpress/interactivity": "^6.43.0",
-		"@wordpress/interactivity-router": "^2.43.0",
-		"@wordpress/keyboard-shortcuts": "^5.43.0",
-		"@wordpress/keycodes": "^4.43.0",
-		"@wordpress/latex-to-mathml": "^1.11.0",
-		"@wordpress/notices": "^5.43.0",
-		"@wordpress/patterns": "^2.43.0",
-		"@wordpress/primitives": "^4.43.0",
-		"@wordpress/private-apis": "^1.43.0",
-		"@wordpress/reusable-blocks": "^5.43.0",
-		"@wordpress/rich-text": "^7.43.0",
-		"@wordpress/server-side-render": "^6.19.0",
-		"@wordpress/upload-media": "^0.28.0",
-		"@wordpress/url": "^4.43.0",
-		"@wordpress/viewport": "^6.43.0",
-		"@wordpress/wordcount": "^4.43.0",
+		"@wordpress/a11y": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/api-fetch": "^7.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/autop": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/base-styles": "^6.19.1-next.v.202604091042.0+668146787",
+		"@wordpress/blob": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/block-editor": "^15.16.1-next.v.202604091042.0+668146787",
+		"@wordpress/blocks": "^15.16.1-next.v.202604091042.0+668146787",
+		"@wordpress/components": "^32.5.2-next.v.202604091042.0+668146787",
+		"@wordpress/compose": "^7.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/core-data": "^7.43.2-next.v.202604091042.0+668146787",
+		"@wordpress/data": "^10.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/date": "^5.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/deprecated": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/dom": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/element": "^6.44.1-next.v.202604091042.0+668146787",
+		"@wordpress/escape-html": "^3.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/hooks": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/html-entities": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/i18n": "^6.17.1-next.v.202604091042.0+668146787",
+		"@wordpress/icons": "^12.1.1-next.v.202604091042.0+668146787",
+		"@wordpress/interactivity": "^6.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/interactivity-router": "^2.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/keyboard-shortcuts": "^5.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/keycodes": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/latex-to-mathml": "^1.11.1-next.v.202604091042.0+668146787",
+		"@wordpress/notices": "^5.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/patterns": "^2.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/primitives": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/private-apis": "^1.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/reusable-blocks": "^5.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/rich-text": "^7.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/server-side-render": "^6.19.1-next.v.202604091042.0+668146787",
+		"@wordpress/upload-media": "^0.28.1-next.v.202604091042.0+668146787",
+		"@wordpress/url": "^4.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/viewport": "^6.43.1-next.v.202604091042.0+668146787",
+		"@wordpress/wordcount": "^4.43.1-next.v.202604091042.0+668146787",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -151,5 +151,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "2cea90674d11aa521ec3f71652fb3a6a4c383969"
+	"gitHead": "73606df74f1c38a084bfa5db97205259ef817593"
 }

package/src/code/edit.js

@@ -29,6 +29,7 @@ export default function CodeEdit( {
 				__unstableOnSplitAtDoubleLineEnd={ () =>
 					insertBlocksAfter( createBlock( getDefaultBlockName() ) )
 				}
+				style={ { whiteSpace: 'break-spaces' } }
 			/>
 		</pre>
 	);

package/src/code/style.scss

@@ -8,7 +8,7 @@
 		display: block;
 		font-family: inherit;
 		overflow-wrap: break-word;
-		white-space: pre-wrap;
+		white-space: break-spaces;
 		// Set direction and avoid inheriting alignment from a parent element.
 		/*!rtl:begin:ignore*/
 		direction: ltr;

package/src/cover/edit/color-utils.js

@@ -92,7 +92,7 @@ export const getMediaColor = memoize( async ( url ) => {
 			crossOrigin: imgCrossOrigin,
 		} );
 		return color.hex;
-	} catch ( error ) {
+	} catch {
 		// If there's an error return the fallback color.
 		return DEFAULT_BACKGROUND_COLOR;
 	}

package/src/cover/edit/index.js

@@ -7,8 +7,13 @@ import clsx from 'clsx';
  * WordPress dependencies
  */
 import { useEntityProp, store as coreStore } from '@wordpress/core-data';
-import { useEffect, useMemo, useRef } from '@wordpress/element';
-import { Placeholder, Spinner } from '@wordpress/components';
+import {
+	useEffect,
+	useLayoutEffect,
+	useMemo,
+	useRef,
+} from '@wordpress/element';
+import { Placeholder, SandBox, Spinner } from '@wordpress/components';
 import { compose, useResizeObserver } from '@wordpress/compose';
 import {
 	withColors,
@@ -49,7 +54,7 @@ import {
 	DEFAULT_OVERLAY_COLOR,
 } from './color-utils';
 import { DEFAULT_MEDIA_SIZE_SLUG } from '../constants';
-import { getIframeSrc, getBackgroundVideoSrc } from '../embed-video-utils';
+import { getBackgroundEmbedHtml } from '../embed-video-utils';
 
 function getInnerBlocksTemplate( attributes ) {
 	return [
@@ -121,6 +126,14 @@ function CoverEdit( {
 
 	const { __unstableMarkNextChangeAsNotPersistent } =
 		useDispatch( blockEditorStore );
+
+	// Ref to access latest values after async operations (e.g. getMediaColor),
+	// avoiding stale values that could overwrite concurrent remote changes.
+	const propsRef = useRef( { attributes, overlayColor } );
+	useLayoutEffect( () => {
+		propsRef.current = { attributes, overlayColor };
+	} );
+
 	const { media } = useSelect(
 		( select ) => {
 			return {
@@ -155,22 +168,26 @@ function CoverEdit( {
 
 			const averageBackgroundColor = await getMediaColor( mediaUrl );
 
-			let newOverlayColor = overlayColor.color;
-			if ( ! isUserOverlayColor ) {
+			// Read latest values after await to avoid stale closures.
+			const { attributes: currentAttrs, overlayColor: currentOverlay } =
+				propsRef.current;
+
+			let newOverlayColor = currentOverlay.color;
+			if ( ! currentAttrs.isUserOverlayColor ) {
 				newOverlayColor = averageBackgroundColor;
 				__unstableMarkNextChangeAsNotPersistent();
 				setOverlayColor( newOverlayColor );
 			}
 
 			const newIsDark = compositeIsDark(
-				dimRatio,
+				currentAttrs.dimRatio,
 				newOverlayColor,
 				averageBackgroundColor
 			);
 			__unstableMarkNextChangeAsNotPersistent();
 			setAttributes( {
 				isDark: newIsDark,
-				isUserOverlayColor: isUserOverlayColor || false,
+				isUserOverlayColor: currentAttrs.isUserOverlayColor || false,
 			} );
 		} )();
 		// Update the block only when the featured image changes.
@@ -201,8 +218,12 @@ function CoverEdit( {
 			isImage ? newMedia?.url : undefined
 		);
 
-		let newOverlayColor = overlayColor.color;
-		if ( ! isUserOverlayColor ) {
+		// Read latest values to avoid stale closures.
+		const { attributes: currentAttrs, overlayColor: currentOverlay } =
+			propsRef.current;
+
+		let newOverlayColor = currentOverlay.color;
+		if ( ! currentAttrs.isUserOverlayColor ) {
 			newOverlayColor = averageBackgroundColor;
 			setOverlayColor( newOverlayColor );
 
@@ -214,7 +235,9 @@ function CoverEdit( {
 		// to avoid resetting to 50 if it has been explicitly set to 100.
 		// See issue #52835 for context.
 		const newDimRatio =
-			originalUrl === undefined && dimRatio === 100 ? 50 : dimRatio;
+			currentAttrs.url === undefined && currentAttrs.dimRatio === 100
+				? 50
+				: currentAttrs.dimRatio;
 
 		const newIsDark = compositeIsDark(
 			newDimRatio,
@@ -256,7 +279,7 @@ function CoverEdit( {
 			useFeaturedImage: undefined,
 			dimRatio: newDimRatio,
 			isDark: newIsDark,
-			isUserOverlayColor: isUserOverlayColor || false,
+			isUserOverlayColor: currentAttrs.isUserOverlayColor || false,
 		} );
 	};
 
@@ -290,8 +313,12 @@ function CoverEdit( {
 
 	const onSetOverlayColor = async ( newOverlayColor ) => {
 		const averageBackgroundColor = await getMediaColor( url );
+
+		// Read latest dimRatio after await to avoid stale closure.
+		const { attributes: currentAttrs } = propsRef.current;
+
 		const newIsDark = compositeIsDark(
-			dimRatio,
+			currentAttrs.dimRatio,
 			newOverlayColor,
 			averageBackgroundColor
 		);
@@ -309,9 +336,13 @@ function CoverEdit( {
 
 	const onUpdateDimRatio = async ( newDimRatio ) => {
 		const averageBackgroundColor = await getMediaColor( url );
+
+		// Read latest overlayColor after await to avoid stale closure.
+		const { overlayColor: currentOverlay } = propsRef.current;
+
 		const newIsDark = compositeIsDark(
 			newDimRatio,
-			overlayColor.color,
+			currentOverlay.color,
 			averageBackgroundColor
 		);
 
@@ -365,23 +396,15 @@ function CoverEdit( {
 		[ url, backgroundType ]
 	);
 
-	// Compute embedSrc on-the-fly from embed preview for editor display
-	const embedSrc = useMemo( () => {
+	// Compute embed HTML for editor display via SandBox
+	const embedHtml = useMemo( () => {
 		if (
 			backgroundType !== EMBED_VIDEO_BACKGROUND_TYPE ||
 			! embedPreview?.html
 		) {
 			return null;
 		}
-
-		// Extract iframe src from embed HTML
-		const iframeSrc = getIframeSrc( embedPreview.html );
-		if ( ! iframeSrc ) {
-			return null;
-		}
-
-		// Modify the src to add background video parameters (provider auto-detected)
-		return getBackgroundVideoSrc( iframeSrc );
+		return getBackgroundEmbedHtml( embedPreview.html );
 	}, [ embedPreview, backgroundType ] );
 
 	const isUploadingMedia = isTemporaryMedia( id, url );
@@ -477,11 +500,15 @@ function CoverEdit( {
 			? await getMediaColor( mediaUrl )
 			: DEFAULT_BACKGROUND_COLOR;
 
-		const newOverlayColor = ! isUserOverlayColor
+		// Read latest values after await to avoid stale closures.
+		const { attributes: currentAttrs, overlayColor: currentOverlay } =
+			propsRef.current;
+
+		const newOverlayColor = ! currentAttrs.isUserOverlayColor
 			? averageBackgroundColor
-			: overlayColor.color;
+			: currentOverlay.color;
 
-		if ( ! isUserOverlayColor ) {
+		if ( ! currentAttrs.isUserOverlayColor ) {
 			if ( newUseFeaturedImage ) {
 				setOverlayColor( newOverlayColor );
 			} else {
@@ -492,7 +519,8 @@ function CoverEdit( {
 			__unstableMarkNextChangeAsNotPersistent();
 		}
 
-		const newDimRatio = dimRatio === 100 ? 50 : dimRatio;
+		const newDimRatio =
+			currentAttrs.dimRatio === 100 ? 50 : currentAttrs.dimRatio;
 		const newIsDark = compositeIsDark(
 			newDimRatio,
 			newOverlayColor,
@@ -668,21 +696,22 @@ function CoverEdit( {
 						style={ mediaStyle }
 					/>
 				) }
-				{ isEmbedVideoBackground && embedSrc && (
+				{ isEmbedVideoBackground && embedHtml && (
 					<div
 						ref={ mediaElement }
 						className="wp-block-cover__video-background wp-block-cover__embed-background"
 						style={ mediaStyle }
 					>
-						<iframe
-							src={ embedSrc }
+						<SandBox
+							html={ embedHtml }
 							title="Background video"
-							frameBorder="0"
-							allow="autoplay; fullscreen"
+							styles={ [
+								'iframe{position:fixed;top:0;left:0;width:100%;height:100%;}',
+							] }
 						/>
 					</div>
 				) }
-				{ isEmbedVideoBackground && ! embedSrc && isFetchingEmbed && (
+				{ isEmbedVideoBackground && ! embedHtml && isFetchingEmbed && (
 					<Spinner />
 				) }