@wordpress/block-library 8.11.0 → 8.12.1

package/build-module/search/edit.js

@@ -10,7 +10,7 @@ import classnames from 'classnames';
 
 import { useBlockProps, BlockControls, InspectorControls, RichText, __experimentalUseBorderProps as useBorderProps, __experimentalUseColorProps as useColorProps, getTypographyClassesAndStyles as useTypographyProps, store as blockEditorStore, __experimentalGetElementClassName, useSetting } from '@wordpress/block-editor';
 import { useDispatch, useSelect } from '@wordpress/data';
-import { useEffect } from '@wordpress/element';
+import { useEffect, useRef } from '@wordpress/element';
 import { ToolbarDropdownMenu, ToolbarGroup, Button, ButtonGroup, ToolbarButton, ResizableBox, PanelBody, BaseControl, __experimentalUseCustomUnits as useCustomUnits, __experimentalUnitControl as UnitControl } from '@wordpress/components';
 import { useInstanceId } from '@wordpress/compose';
 import { Icon, search } from '@wordpress/icons';
@@ -25,17 +25,15 @@ import { PC_WIDTH_DEFAULT, PX_WIDTH_DEFAULT, MIN_WIDTH, MIN_WIDTH_UNIT } from '.
 // button is placed inside wrapper.
 
 const DEFAULT_INNER_PADDING = '4px';
-export default function SearchEdit(_ref) {
-  var _style$border;
-
-  let {
-    className,
-    attributes,
-    setAttributes,
-    toggleSelection,
-    isSelected,
-    clientId
-  } = _ref;
+const BUTTON_BEHAVIOR_EXPAND = 'expand-searchfield';
+export default function SearchEdit({
+  className,
+  attributes,
+  setAttributes,
+  toggleSelection,
+  isSelected,
+  clientId
+}) {
   const {
     label,
     showLabel,
@@ -46,16 +44,16 @@ export default function SearchEdit(_ref) {
     buttonText,
     buttonPosition,
     buttonUseIcon,
+    buttonBehavior,
+    isSearchFieldHidden,
     style
   } = attributes;
   const insertedInNavigationBlock = useSelect(select => {
-    var _getBlockParentsByBlo;
-
     const {
       getBlockParentsByBlockName,
       wasBlockJustInserted
     } = select(blockEditorStore);
-    return !!((_getBlockParentsByBlo = getBlockParentsByBlockName(clientId, 'core/navigation')) !== null && _getBlockParentsByBlo !== void 0 && _getBlockParentsByBlo.length) && wasBlockJustInserted(clientId);
+    return !!getBlockParentsByBlockName(clientId, 'core/navigation')?.length && wasBlockJustInserted(clientId);
   }, [clientId]);
   const {
     __unstableMarkNextChangeAsNotPersistent
@@ -71,7 +69,7 @@ export default function SearchEdit(_ref) {
       buttonPosition: 'button-inside'
     });
   }, [insertedInNavigationBlock]);
-  const borderRadius = style === null || style === void 0 ? void 0 : (_style$border = style.border) === null || _style$border === void 0 ? void 0 : _style$border.radius;
+  const borderRadius = style?.border?.radius;
   const borderProps = useBorderProps(attributes); // Check for old deprecated numerical border radius. Done as a separate
   // check so that a borderRadius style won't overwrite the longhand
   // per-corner styles.
@@ -88,7 +86,7 @@ export default function SearchEdit(_ref) {
       fluid: fluidTypographySettings
     },
     layout: {
-      wideSize: layout === null || layout === void 0 ? void 0 : layout.wideSize
+      wideSize: layout?.wideSize
     }
   });
   const unitControlInstanceId = useInstanceId(UnitControl);
@@ -97,6 +95,8 @@ export default function SearchEdit(_ref) {
   const isButtonPositionOutside = 'button-outside' === buttonPosition;
   const hasNoButton = 'no-button' === buttonPosition;
   const hasOnlyButton = 'button-only' === buttonPosition;
+  const searchFieldRef = useRef();
+  const buttonRef = useRef();
   const units = useCustomUnits({
     availableUnits: ['%', 'px'],
     defaultValues: {
@@ -104,9 +104,26 @@ export default function SearchEdit(_ref) {
       px: PX_WIDTH_DEFAULT
     }
   });
+  useEffect(() => {
+    if (hasOnlyButton && !isSelected) {
+      setAttributes({
+        isSearchFieldHidden: true
+      });
+    }
+  }, [hasOnlyButton, isSelected, setAttributes]); // Show the search field when width changes.
+
+  useEffect(() => {
+    if (!hasOnlyButton || !isSelected) {
+      return;
+    }
+
+    setAttributes({
+      isSearchFieldHidden: false
+    });
+  }, [hasOnlyButton, isSelected, setAttributes, width]);
 
   const getBlockClassNames = () => {
-    return classnames(className, isButtonPositionInside ? 'wp-block-search__button-inside' : undefined, isButtonPositionOutside ? 'wp-block-search__button-outside' : undefined, hasNoButton ? 'wp-block-search__no-button' : undefined, hasOnlyButton ? 'wp-block-search__button-only' : undefined, !buttonUseIcon && !hasNoButton ? 'wp-block-search__text-button' : undefined, buttonUseIcon && !hasNoButton ? 'wp-block-search__icon-button' : undefined);
+    return classnames(className, isButtonPositionInside ? 'wp-block-search__button-inside' : undefined, isButtonPositionOutside ? 'wp-block-search__button-outside' : undefined, hasNoButton ? 'wp-block-search__no-button' : undefined, hasOnlyButton ? 'wp-block-search__button-only' : undefined, !buttonUseIcon && !hasNoButton ? 'wp-block-search__text-button' : undefined, buttonUseIcon && !hasNoButton ? 'wp-block-search__icon-button' : undefined, hasOnlyButton && BUTTON_BEHAVIOR_EXPAND === buttonBehavior ? 'wp-block-search__button-behavior-expand' : undefined, hasOnlyButton && isSearchFieldHidden ? 'wp-block-search__searchfield-hidden' : undefined);
   };
 
   const buttonPositionControls = [{
@@ -116,7 +133,8 @@ export default function SearchEdit(_ref) {
     icon: buttonOutside,
     onClick: () => {
       setAttributes({
-        buttonPosition: 'button-outside'
+        buttonPosition: 'button-outside',
+        isSearchFieldHidden: false
       });
     }
   }, {
@@ -126,7 +144,8 @@ export default function SearchEdit(_ref) {
     icon: buttonInside,
     onClick: () => {
       setAttributes({
-        buttonPosition: 'button-inside'
+        buttonPosition: 'button-inside',
+        isSearchFieldHidden: false
       });
     }
   }, {
@@ -136,7 +155,19 @@ export default function SearchEdit(_ref) {
     icon: noButton,
     onClick: () => {
       setAttributes({
-        buttonPosition: 'no-button'
+        buttonPosition: 'no-button',
+        isSearchFieldHidden: false
+      });
+    }
+  }, {
+    role: 'menuitemradio',
+    title: __('Button only'),
+    isActive: buttonPosition === 'button-only',
+    icon: buttonOnly,
+    onClick: () => {
+      setAttributes({
+        buttonPosition: 'button-only',
+        isSearchFieldHidden: true
       });
     }
   }];
@@ -189,7 +220,8 @@ export default function SearchEdit(_ref) {
       value: placeholder,
       onChange: event => setAttributes({
         placeholder: event.target.value
-      })
+      }),
+      ref: searchFieldRef
     });
   };
 
@@ -202,11 +234,22 @@ export default function SearchEdit(_ref) {
         borderRadius
       } : borderProps.style)
     };
+
+    const handleButtonClick = () => {
+      if (hasOnlyButton && BUTTON_BEHAVIOR_EXPAND === buttonBehavior) {
+        setAttributes({
+          isSearchFieldHidden: !isSearchFieldHidden
+        });
+      }
+    };
+
     return createElement(Fragment, null, buttonUseIcon && createElement("button", {
       type: "button",
       className: buttonClasses,
       style: buttonStyles,
-      "aria-label": buttonText ? stripHTML(buttonText) : __('Search')
+      "aria-label": buttonText ? stripHTML(buttonText) : __('Search'),
+      onClick: handleButtonClick,
+      ref: buttonRef
     }, createElement(Icon, {
       icon: search
     })), !buttonUseIcon && createElement(RichText, {
@@ -218,7 +261,8 @@ export default function SearchEdit(_ref) {
       value: buttonText,
       onChange: html => setAttributes({
         buttonText: html
-      })
+      }),
+      onClick: handleButtonClick
     }));
   };
 
@@ -274,7 +318,7 @@ export default function SearchEdit(_ref) {
     return createElement(Button, {
       key: widthValue,
       isSmall: true,
-      variant: `${widthValue}%` === `${width}${widthUnit}` ? 'primary' : undefined,
+      variant: widthValue === width && widthUnit === '%' ? 'primary' : undefined,
       onClick: () => setAttributes({
         width: widthValue,
         widthUnit: '%'
@@ -285,14 +329,12 @@ export default function SearchEdit(_ref) {
   const padBorderRadius = radius => radius ? `calc(${radius} + ${DEFAULT_INNER_PADDING})` : undefined;
 
   const getWrapperStyles = () => {
-    var _borderProps$style, _borderProps$style2, _borderProps$style3, _borderProps$style4, _borderProps$style5;
-
     const styles = isButtonPositionInside ? borderProps.style : {
-      borderRadius: (_borderProps$style = borderProps.style) === null || _borderProps$style === void 0 ? void 0 : _borderProps$style.borderRadius,
-      borderTopLeftRadius: (_borderProps$style2 = borderProps.style) === null || _borderProps$style2 === void 0 ? void 0 : _borderProps$style2.borderTopLeftRadius,
-      borderTopRightRadius: (_borderProps$style3 = borderProps.style) === null || _borderProps$style3 === void 0 ? void 0 : _borderProps$style3.borderTopRightRadius,
-      borderBottomLeftRadius: (_borderProps$style4 = borderProps.style) === null || _borderProps$style4 === void 0 ? void 0 : _borderProps$style4.borderBottomLeftRadius,
-      borderBottomRightRadius: (_borderProps$style5 = borderProps.style) === null || _borderProps$style5 === void 0 ? void 0 : _borderProps$style5.borderBottomRightRadius
+      borderRadius: borderProps.style?.borderRadius,
+      borderTopLeftRadius: borderProps.style?.borderTopLeftRadius,
+      borderTopRightRadius: borderProps.style?.borderTopRightRadius,
+      borderBottomLeftRadius: borderProps.style?.borderBottomLeftRadius,
+      borderBottomRightRadius: borderProps.style?.borderBottomRightRadius
     };
     const isNonZeroBorderRadius = borderRadius !== undefined && parseInt(borderRadius, 10) !== 0;
 
@@ -336,7 +378,8 @@ export default function SearchEdit(_ref) {
     }
   });
   const labelClassnames = classnames('wp-block-search__label', typographyProps.className);
-  return createElement("div", blockProps, controls, showLabel && createElement(RichText, {
+  return createElement("div", { ...blockProps
+  }, controls, showLabel && createElement(RichText, {
     className: labelClassnames,
     "aria-label": __('Label text'),
     placeholder: __('Add label…'),
@@ -368,6 +411,6 @@ export default function SearchEdit(_ref) {
       toggleSelection(true);
     },
     showHandle: isSelected
-  }, (isButtonPositionInside || isButtonPositionOutside) && createElement(Fragment, null, renderTextField(), renderButton()), hasOnlyButton && renderButton(), hasNoButton && renderTextField()));
+  }, (isButtonPositionInside || isButtonPositionOutside || hasOnlyButton) && createElement(Fragment, null, renderTextField(), renderButton()), hasNoButton && renderTextField()));
 }
 //# sourceMappingURL=edit.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/search/edit.js"],"names":["classnames","useBlockProps","BlockControls","InspectorControls","RichText","__experimentalUseBorderProps","useBorderProps","__experimentalUseColorProps","useColorProps","getTypographyClassesAndStyles","useTypographyProps","store","blockEditorStore","__experimentalGetElementClassName","useSetting","useDispatch","useSelect","useEffect","ToolbarDropdownMenu","ToolbarGroup","Button","ButtonGroup","ToolbarButton","ResizableBox","PanelBody","BaseControl","__experimentalUseCustomUnits","useCustomUnits","__experimentalUnitControl","UnitControl","useInstanceId","Icon","search","__","__unstableStripHTML","stripHTML","buttonOnly","buttonOutside","buttonInside","noButton","buttonWithIcon","toggleLabel","PC_WIDTH_DEFAULT","PX_WIDTH_DEFAULT","MIN_WIDTH","MIN_WIDTH_UNIT","DEFAULT_INNER_PADDING","SearchEdit","className","attributes","setAttributes","toggleSelection","isSelected","clientId","label","showLabel","placeholder","width","widthUnit","align","buttonText","buttonPosition","buttonUseIcon","style","insertedInNavigationBlock","select","getBlockParentsByBlockName","wasBlockJustInserted","length","__unstableMarkNextChangeAsNotPersistent","borderRadius","border","radius","borderProps","colorProps","fluidTypographySettings","layout","typographyProps","typography","fluid","wideSize","unitControlInstanceId","unitControlInputId","isButtonPositionInside","isButtonPositionOutside","hasNoButton","hasOnlyButton","units","availableUnits","defaultValues","px","getBlockClassNames","undefined","buttonPositionControls","role","title","isActive","icon","onClick","getButtonPositionIcon","getResizableSides","right","left","renderTextField","textFieldClasses","textFieldStyles","textDecoration","event","target","value","renderButton","buttonClasses","buttonStyles","html","controls","newWidth","filteredWidth","parseInt","newUnit","map","widthValue","padBorderRadius","getWrapperStyles","styles","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","isNonZeroBorderRadius","topLeft","topRight","bottomLeft","bottomRight","Number","isInteger","blockProps","labelClassnames","direction","elt","offsetWidth","delta"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseBlockProps,\n\tBlockControls,\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\tuseSetting,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\nimport {\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tButton,\n\tButtonGroup,\n\tToolbarButton,\n\tResizableBox,\n\tPanelBody,\n\tBaseControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Icon, search } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport {\n\tbuttonOnly,\n\tbuttonOutside,\n\tbuttonInside,\n\tnoButton,\n\tbuttonWithIcon,\n\ttoggleLabel,\n} from './icons';\nimport {\n\tPC_WIDTH_DEFAULT,\n\tPX_WIDTH_DEFAULT,\n\tMIN_WIDTH,\n\tMIN_WIDTH_UNIT,\n} from './utils.js';\n\n// Used to calculate border radius adjustment to avoid \"fat\" corners when\n// button is placed inside wrapper.\nconst DEFAULT_INNER_PADDING = '4px';\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 insertedInNavigationBlock = 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\tuseEffect( () => {\n\t\tif ( ! insertedInNavigationBlock ) return;\n\t\t// This side-effect should not create an undo level.\n\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\tsetAttributes( {\n\t\t\tshowLabel: false,\n\t\t\tbuttonUseIcon: true,\n\t\t\tbuttonPosition: 'button-inside',\n\t\t} );\n\t}, [ insertedInNavigationBlock ] );\n\tconst borderRadius = style?.border?.radius;\n\tconst 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.style.borderRadius = `${ borderRadius }px`;\n\t}\n\n\tconst colorProps = useColorProps( attributes );\n\tconst fluidTypographySettings = useSetting( 'typography.fluid' );\n\tconst layout = useSetting( 'layout' );\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\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 classnames(\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);\n\t};\n\n\tconst buttonPositionControls = [\n\t\t{\n\t\t\trole: 'menuitemradio',\n\t\t\ttitle: __( 'Button outside' ),\n\t\t\tisActive: buttonPosition === 'button-outside',\n\t\t\ticon: buttonOutside,\n\t\t\tonClick: () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tbuttonPosition: 'button-outside',\n\t\t\t\t} );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\trole: 'menuitemradio',\n\t\t\ttitle: __( 'Button inside' ),\n\t\t\tisActive: buttonPosition === 'button-inside',\n\t\t\ticon: buttonInside,\n\t\t\tonClick: () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tbuttonPosition: 'button-inside',\n\t\t\t\t} );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\trole: 'menuitemradio',\n\t\t\ttitle: __( 'No button' ),\n\t\t\tisActive: buttonPosition === 'no-button',\n\t\t\ticon: noButton,\n\t\t\tonClick: () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tbuttonPosition: 'no-button',\n\t\t\t\t} );\n\t\t\t},\n\t\t},\n\t];\n\n\tconst getButtonPositionIcon = () => {\n\t\tswitch ( buttonPosition ) {\n\t\t\tcase 'button-inside':\n\t\t\t\treturn buttonInside;\n\t\t\tcase 'button-outside':\n\t\t\t\treturn buttonOutside;\n\t\t\tcase 'no-button':\n\t\t\t\treturn noButton;\n\t\t\tcase 'button-only':\n\t\t\t\treturn buttonOnly;\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 = classnames(\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? { borderRadius }\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…' )\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/>\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 = classnames(\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? { borderRadius }\n\t\t\t\t: borderProps.style ),\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>\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\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…' ) }\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\n\tconst controls = (\n\t\t<>\n\t\t\t<BlockControls>\n\t\t\t\t<ToolbarGroup>\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\ttitle={ __( 'Toggle search label' ) }\n\t\t\t\t\t\ticon={ toggleLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tshowLabel: ! showLabel,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tclassName={ showLabel ? 'is-pressed' : undefined }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToolbarDropdownMenu\n\t\t\t\t\t\ticon={ getButtonPositionIcon() }\n\t\t\t\t\t\tlabel={ __( 'Change button position' ) }\n\t\t\t\t\t\tcontrols={ buttonPositionControls }\n\t\t\t\t\t/>\n\t\t\t\t\t{ ! hasNoButton && (\n\t\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\t\ttitle={ __( 'Use button with icon' ) }\n\t\t\t\t\t\t\ticon={ buttonWithIcon }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tbuttonUseIcon: ! buttonUseIcon,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\tbuttonUseIcon ? 'is-pressed' : undefined\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</ToolbarGroup>\n\t\t\t</BlockControls>\n\n\t\t\t<InspectorControls>\n\t\t\t\t<PanelBody title={ __( 'Display Settings' ) }>\n\t\t\t\t\t<BaseControl\n\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\tid={ unitControlInputId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tid={ unitControlInputId }\n\t\t\t\t\t\t\tmin={ `${ MIN_WIDTH }${ MIN_WIDTH_UNIT }` }\n\t\t\t\t\t\t\tonChange={ ( newWidth ) => {\n\t\t\t\t\t\t\t\tconst filteredWidth =\n\t\t\t\t\t\t\t\t\twidthUnit === '%' &&\n\t\t\t\t\t\t\t\t\tparseInt( newWidth, 10 ) > 100\n\t\t\t\t\t\t\t\t\t\t? 100\n\t\t\t\t\t\t\t\t\t\t: newWidth;\n\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\twidth: parseInt( filteredWidth, 10 ),\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonUnitChange={ ( newUnit ) => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t'%' === newUnit\n\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: PX_WIDTH_DEFAULT,\n\t\t\t\t\t\t\t\t\twidthUnit: newUnit,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t__unstableInputWidth={ '80px' }\n\t\t\t\t\t\t\tvalue={ `${ width }${ widthUnit }` }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t<ButtonGroup\n\t\t\t\t\t\t\tclassName=\"wp-block-search__components-button-group\"\n\t\t\t\t\t\t\taria-label={ __( 'Percentage Width' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ [ 25, 50, 75, 100 ].map( ( widthValue ) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tkey={ widthValue }\n\t\t\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\t`${ widthValue }%` ===\n\t\t\t\t\t\t\t\t\t\t\t`${ width }${ widthUnit }`\n\t\t\t\t\t\t\t\t\t\t\t\t? 'primary'\n\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\t\twidth: widthValue,\n\t\t\t\t\t\t\t\t\t\t\t\twidthUnit: '%',\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\t\t{ widthValue }%\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t</BaseControl>\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n\n\tconst padBorderRadius = ( radius ) =>\n\t\tradius ? `calc(${ radius } + ${ DEFAULT_INNER_PADDING })` : 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\tconst isNonZeroBorderRadius =\n\t\t\tborderRadius !== undefined && parseInt( borderRadius, 10 ) !== 0;\n\n\t\tif ( isButtonPositionInside && isNonZeroBorderRadius ) {\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 { topLeft, topRight, bottomLeft, bottomRight } =\n\t\t\t\t\tborderRadius;\n\n\t\t\t\treturn {\n\t\t\t\t\t...styles,\n\t\t\t\t\tborderTopLeftRadius: padBorderRadius( topLeft ),\n\t\t\t\t\tborderTopRightRadius: padBorderRadius( topRight ),\n\t\t\t\t\tborderBottomLeftRadius: padBorderRadius( bottomLeft ),\n\t\t\t\t\tborderBottomRightRadius: padBorderRadius( bottomRight ),\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 = classnames(\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\tclassName={ labelClassnames }\n\t\t\t\t\taria-label={ __( 'Label text' ) }\n\t\t\t\t\tplaceholder={ __( 'Add label…' ) }\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: `${ width }${ widthUnit }`,\n\t\t\t\t} }\n\t\t\t\tclassName={ classnames(\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 || isButtonPositionOutside ) && (\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{ hasOnlyButton && renderButton() }\n\t\t\t\t{ hasNoButton && renderTextField() }\n\t\t\t</ResizableBox>\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/search/edit.js"],"names":["classnames","useBlockProps","BlockControls","InspectorControls","RichText","__experimentalUseBorderProps","useBorderProps","__experimentalUseColorProps","useColorProps","getTypographyClassesAndStyles","useTypographyProps","store","blockEditorStore","__experimentalGetElementClassName","useSetting","useDispatch","useSelect","useEffect","useRef","ToolbarDropdownMenu","ToolbarGroup","Button","ButtonGroup","ToolbarButton","ResizableBox","PanelBody","BaseControl","__experimentalUseCustomUnits","useCustomUnits","__experimentalUnitControl","UnitControl","useInstanceId","Icon","search","__","__unstableStripHTML","stripHTML","buttonOnly","buttonOutside","buttonInside","noButton","buttonWithIcon","toggleLabel","PC_WIDTH_DEFAULT","PX_WIDTH_DEFAULT","MIN_WIDTH","MIN_WIDTH_UNIT","DEFAULT_INNER_PADDING","BUTTON_BEHAVIOR_EXPAND","SearchEdit","className","attributes","setAttributes","toggleSelection","isSelected","clientId","label","showLabel","placeholder","width","widthUnit","align","buttonText","buttonPosition","buttonUseIcon","buttonBehavior","isSearchFieldHidden","style","insertedInNavigationBlock","select","getBlockParentsByBlockName","wasBlockJustInserted","length","__unstableMarkNextChangeAsNotPersistent","borderRadius","border","radius","borderProps","colorProps","fluidTypographySettings","layout","typographyProps","typography","fluid","wideSize","unitControlInstanceId","unitControlInputId","isButtonPositionInside","isButtonPositionOutside","hasNoButton","hasOnlyButton","searchFieldRef","buttonRef","units","availableUnits","defaultValues","px","getBlockClassNames","undefined","buttonPositionControls","role","title","isActive","icon","onClick","getButtonPositionIcon","getResizableSides","right","left","renderTextField","textFieldClasses","textFieldStyles","textDecoration","event","target","value","renderButton","buttonClasses","buttonStyles","handleButtonClick","html","controls","newWidth","filteredWidth","parseInt","newUnit","map","widthValue","padBorderRadius","getWrapperStyles","styles","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","isNonZeroBorderRadius","topLeft","topRight","bottomLeft","bottomRight","Number","isInteger","blockProps","labelClassnames","direction","elt","offsetWidth","delta"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseBlockProps,\n\tBlockControls,\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\tuseSetting,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\nimport {\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tButton,\n\tButtonGroup,\n\tToolbarButton,\n\tResizableBox,\n\tPanelBody,\n\tBaseControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Icon, search } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport {\n\tbuttonOnly,\n\tbuttonOutside,\n\tbuttonInside,\n\tnoButton,\n\tbuttonWithIcon,\n\ttoggleLabel,\n} from './icons';\nimport {\n\tPC_WIDTH_DEFAULT,\n\tPX_WIDTH_DEFAULT,\n\tMIN_WIDTH,\n\tMIN_WIDTH_UNIT,\n} from './utils.js';\n\n// Used to calculate border radius adjustment to avoid \"fat\" corners when\n// button is placed inside wrapper.\nconst DEFAULT_INNER_PADDING = '4px';\n\nconst BUTTON_BEHAVIOR_EXPAND = 'expand-searchfield';\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\tbuttonBehavior,\n\t\tisSearchFieldHidden,\n\t\tstyle,\n\t} = attributes;\n\n\tconst insertedInNavigationBlock = 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\tuseEffect( () => {\n\t\tif ( ! insertedInNavigationBlock ) return;\n\t\t// This side-effect should not create an undo level.\n\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\tsetAttributes( {\n\t\t\tshowLabel: false,\n\t\t\tbuttonUseIcon: true,\n\t\t\tbuttonPosition: 'button-inside',\n\t\t} );\n\t}, [ insertedInNavigationBlock ] );\n\tconst borderRadius = style?.border?.radius;\n\tconst 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.style.borderRadius = `${ borderRadius }px`;\n\t}\n\n\tconst colorProps = useColorProps( attributes );\n\tconst fluidTypographySettings = useSetting( 'typography.fluid' );\n\tconst layout = useSetting( 'layout' );\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 classnames(\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 && BUTTON_BEHAVIOR_EXPAND === buttonBehavior\n\t\t\t\t? 'wp-block-search__button-behavior-expand'\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\trole: 'menuitemradio',\n\t\t\ttitle: __( 'Button outside' ),\n\t\t\tisActive: buttonPosition === 'button-outside',\n\t\t\ticon: buttonOutside,\n\t\t\tonClick: () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tbuttonPosition: 'button-outside',\n\t\t\t\t\tisSearchFieldHidden: false,\n\t\t\t\t} );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\trole: 'menuitemradio',\n\t\t\ttitle: __( 'Button inside' ),\n\t\t\tisActive: buttonPosition === 'button-inside',\n\t\t\ticon: buttonInside,\n\t\t\tonClick: () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tbuttonPosition: 'button-inside',\n\t\t\t\t\tisSearchFieldHidden: false,\n\t\t\t\t} );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\trole: 'menuitemradio',\n\t\t\ttitle: __( 'No button' ),\n\t\t\tisActive: buttonPosition === 'no-button',\n\t\t\ticon: noButton,\n\t\t\tonClick: () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tbuttonPosition: 'no-button',\n\t\t\t\t\tisSearchFieldHidden: false,\n\t\t\t\t} );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\trole: 'menuitemradio',\n\t\t\ttitle: __( 'Button only' ),\n\t\t\tisActive: buttonPosition === 'button-only',\n\t\t\ticon: buttonOnly,\n\t\t\tonClick: () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tbuttonPosition: 'button-only',\n\t\t\t\t\tisSearchFieldHidden: true,\n\t\t\t\t} );\n\t\t\t},\n\t\t},\n\t];\n\n\tconst getButtonPositionIcon = () => {\n\t\tswitch ( buttonPosition ) {\n\t\t\tcase 'button-inside':\n\t\t\t\treturn buttonInside;\n\t\t\tcase 'button-outside':\n\t\t\t\treturn buttonOutside;\n\t\t\tcase 'no-button':\n\t\t\t\treturn noButton;\n\t\t\tcase 'button-only':\n\t\t\t\treturn buttonOnly;\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 = classnames(\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? { borderRadius }\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…' )\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 = classnames(\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? { borderRadius }\n\t\t\t\t: borderProps.style ),\n\t\t};\n\t\tconst handleButtonClick = () => {\n\t\t\tif ( hasOnlyButton && BUTTON_BEHAVIOR_EXPAND === buttonBehavior ) {\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\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…' ) }\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\n\tconst controls = (\n\t\t<>\n\t\t\t<BlockControls>\n\t\t\t\t<ToolbarGroup>\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\ttitle={ __( 'Toggle search label' ) }\n\t\t\t\t\t\ticon={ toggleLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tshowLabel: ! showLabel,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tclassName={ showLabel ? 'is-pressed' : undefined }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToolbarDropdownMenu\n\t\t\t\t\t\ticon={ getButtonPositionIcon() }\n\t\t\t\t\t\tlabel={ __( 'Change button position' ) }\n\t\t\t\t\t\tcontrols={ buttonPositionControls }\n\t\t\t\t\t/>\n\t\t\t\t\t{ ! hasNoButton && (\n\t\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\t\ttitle={ __( 'Use button with icon' ) }\n\t\t\t\t\t\t\ticon={ buttonWithIcon }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tbuttonUseIcon: ! buttonUseIcon,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\tbuttonUseIcon ? 'is-pressed' : undefined\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</ToolbarGroup>\n\t\t\t</BlockControls>\n\n\t\t\t<InspectorControls>\n\t\t\t\t<PanelBody title={ __( 'Display Settings' ) }>\n\t\t\t\t\t<BaseControl\n\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\tid={ unitControlInputId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tid={ unitControlInputId }\n\t\t\t\t\t\t\tmin={ `${ MIN_WIDTH }${ MIN_WIDTH_UNIT }` }\n\t\t\t\t\t\t\tonChange={ ( newWidth ) => {\n\t\t\t\t\t\t\t\tconst filteredWidth =\n\t\t\t\t\t\t\t\t\twidthUnit === '%' &&\n\t\t\t\t\t\t\t\t\tparseInt( newWidth, 10 ) > 100\n\t\t\t\t\t\t\t\t\t\t? 100\n\t\t\t\t\t\t\t\t\t\t: newWidth;\n\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\twidth: parseInt( filteredWidth, 10 ),\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonUnitChange={ ( newUnit ) => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t'%' === newUnit\n\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: PX_WIDTH_DEFAULT,\n\t\t\t\t\t\t\t\t\twidthUnit: newUnit,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t__unstableInputWidth={ '80px' }\n\t\t\t\t\t\t\tvalue={ `${ width }${ widthUnit }` }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t<ButtonGroup\n\t\t\t\t\t\t\tclassName=\"wp-block-search__components-button-group\"\n\t\t\t\t\t\t\taria-label={ __( 'Percentage Width' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ [ 25, 50, 75, 100 ].map( ( widthValue ) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tkey={ widthValue }\n\t\t\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\twidthValue === width &&\n\t\t\t\t\t\t\t\t\t\t\twidthUnit === '%'\n\t\t\t\t\t\t\t\t\t\t\t\t? 'primary'\n\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\t\twidth: widthValue,\n\t\t\t\t\t\t\t\t\t\t\t\twidthUnit: '%',\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\t\t{ widthValue }%\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t</BaseControl>\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n\n\tconst padBorderRadius = ( radius ) =>\n\t\tradius ? `calc(${ radius } + ${ DEFAULT_INNER_PADDING })` : 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\tconst isNonZeroBorderRadius =\n\t\t\tborderRadius !== undefined && parseInt( borderRadius, 10 ) !== 0;\n\n\t\tif ( isButtonPositionInside && isNonZeroBorderRadius ) {\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 { topLeft, topRight, bottomLeft, bottomRight } =\n\t\t\t\t\tborderRadius;\n\n\t\t\t\treturn {\n\t\t\t\t\t...styles,\n\t\t\t\t\tborderTopLeftRadius: padBorderRadius( topLeft ),\n\t\t\t\t\tborderTopRightRadius: padBorderRadius( topRight ),\n\t\t\t\t\tborderBottomLeftRadius: padBorderRadius( bottomLeft ),\n\t\t\t\t\tborderBottomRightRadius: padBorderRadius( bottomRight ),\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 = classnames(\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\tclassName={ labelClassnames }\n\t\t\t\t\taria-label={ __( 'Label text' ) }\n\t\t\t\t\tplaceholder={ __( 'Add label…' ) }\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: `${ width }${ widthUnit }`,\n\t\t\t\t} }\n\t\t\t\tclassName={ classnames(\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"]}

package/build-module/search/edit.native.js

@@ -1,7 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-
-var _styles$widthMargin, _styles$widthMargin2;
-
 import { createElement } from "@wordpress/element";
 
 /**
@@ -29,7 +25,7 @@ import styles from './style.scss';
  */
 
 const MIN_BUTTON_WIDTH = 75;
-const MARGINS = ((_styles$widthMargin = styles.widthMargin) === null || _styles$widthMargin === void 0 ? void 0 : _styles$widthMargin.marginLeft) + ((_styles$widthMargin2 = styles.widthMargin) === null || _styles$widthMargin2 === void 0 ? void 0 : _styles$widthMargin2.paddingLeft);
+const MARGINS = styles.widthMargin?.marginLeft + styles.widthMargin?.paddingLeft;
 const BUTTON_OPTIONS = [{
   value: 'button-inside',
   label: __('Button inside')
@@ -59,18 +55,15 @@ function useIsScreenReaderEnabled() {
   return isScreenReaderEnabled;
 }
 
-export default function SearchEdit(_ref) {
-  var _style$baseColors, _style$baseColors2, _style$baseColors2$co, _style$baseColors3, _style$baseColors4, _style$baseColors4$co, _style$baseColors5, _style$baseColors5$bl, _style$baseColors5$bl2, _attributes$style, _styles$richTextButto2;
-
-  let {
-    onFocus,
-    isSelected,
-    attributes,
-    setAttributes,
-    className,
-    blockWidth,
-    style
-  } = _ref;
+export default function SearchEdit({
+  onFocus,
+  isSelected,
+  attributes,
+  setAttributes,
+  className,
+  blockWidth,
+  style
+}) {
   const [isButtonSelected, setIsButtonSelected] = useState(false);
   const [isLabelSelected, setIsLabelSelected] = useState(false);
   const [isPlaceholderSelected, setIsPlaceholderSelected] = useState(false);
@@ -109,13 +102,12 @@ export default function SearchEdit(_ref) {
     return textInputRef && textInputRef.current;
   };
 
-  const onLayoutButton = _ref2 => {
-    let {
-      nativeEvent
-    } = _ref2;
+  const onLayoutButton = ({
+    nativeEvent
+  }) => {
     const {
       width
-    } = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.layout;
+    } = nativeEvent?.layout;
 
     if (width) {
       setButtonWidth(width);
@@ -173,12 +165,12 @@ export default function SearchEdit(_ref) {
   })));
   const isButtonInside = buttonPosition === 'button-inside';
   const borderStyle = usePreferredColorSchemeStyle(styles.border, styles.borderDark);
-  const inputStyle = [!isButtonInside && borderStyle, usePreferredColorSchemeStyle(styles.plainTextInput, styles.plainTextInputDark), (style === null || style === void 0 ? void 0 : (_style$baseColors = style.baseColors) === null || _style$baseColors === void 0 ? void 0 : _style$baseColors.color) && {
-    color: style === null || style === void 0 ? void 0 : (_style$baseColors2 = style.baseColors) === null || _style$baseColors2 === void 0 ? void 0 : (_style$baseColors2$co = _style$baseColors2.color) === null || _style$baseColors2$co === void 0 ? void 0 : _style$baseColors2$co.text
+  const inputStyle = [!isButtonInside && borderStyle, usePreferredColorSchemeStyle(styles.plainTextInput, styles.plainTextInputDark), style?.baseColors?.color && {
+    color: style?.baseColors?.color?.text
   }];
   const placeholderStyle = { ...usePreferredColorSchemeStyle(styles.plainTextPlaceholder, styles.plainTextPlaceholderDark),
-    ...((style === null || style === void 0 ? void 0 : (_style$baseColors3 = style.baseColors) === null || _style$baseColors3 === void 0 ? void 0 : _style$baseColors3.color) && {
-      color: style === null || style === void 0 ? void 0 : (_style$baseColors4 = style.baseColors) === null || _style$baseColors4 === void 0 ? void 0 : (_style$baseColors4$co = _style$baseColors4.color) === null || _style$baseColors4$co === void 0 ? void 0 : _style$baseColors4$co.text
+    ...(style?.baseColors?.color && {
+      color: style?.baseColors?.color?.text
     })
   };
   const searchBarStyle = [styles.searchBarContainer, isButtonInside && borderStyle, isLongButton && {
@@ -259,7 +251,7 @@ export default function SearchEdit(_ref) {
         onFocus();
       },
       onBlur: () => setIsPlaceholderSelected(false),
-      placeholderTextColor: placeholderStyle === null || placeholderStyle === void 0 ? void 0 : placeholderStyle.color
+      placeholderTextColor: placeholderStyle?.color
     }));
   }; // To achieve proper expanding and shrinking `RichText` on Android, there is a need to set
   // a `placeholder` as an empty string when `RichText` is focused,
@@ -267,41 +259,39 @@ export default function SearchEdit(_ref) {
 
 
   const buttonPlaceholderText = isButtonSelected || !isButtonSelected && buttonText && buttonText !== '' ? '' : __('Add button text');
-  const baseButtonStyles = { ...(style === null || style === void 0 ? void 0 : (_style$baseColors5 = style.baseColors) === null || _style$baseColors5 === void 0 ? void 0 : (_style$baseColors5$bl = _style$baseColors5.blocks) === null || _style$baseColors5$bl === void 0 ? void 0 : (_style$baseColors5$bl2 = _style$baseColors5$bl['core/button']) === null || _style$baseColors5$bl2 === void 0 ? void 0 : _style$baseColors5$bl2.color),
-    ...(attributes === null || attributes === void 0 ? void 0 : (_attributes$style = attributes.style) === null || _attributes$style === void 0 ? void 0 : _attributes$style.color),
-    ...((style === null || style === void 0 ? void 0 : style.color) && {
+  const baseButtonStyles = { ...style?.baseColors?.blocks?.['core/button']?.color,
+    ...attributes?.style?.color,
+    ...(style?.color && {
       text: style.color
     })
   };
-  const richTextButtonContainerStyle = [styles.buttonContainer, isLongButton && styles.buttonContainerWide, (baseButtonStyles === null || baseButtonStyles === void 0 ? void 0 : baseButtonStyles.background) && {
+  const richTextButtonContainerStyle = [styles.buttonContainer, isLongButton && styles.buttonContainerWide, baseButtonStyles?.background && {
     backgroundColor: baseButtonStyles.background,
     borderWidth: 0
-  }, (style === null || style === void 0 ? void 0 : style.backgroundColor) && {
+  }, style?.backgroundColor && {
     backgroundColor: style.backgroundColor,
     borderWidth: 0
   }];
   const richTextButtonStyle = { ...styles.richTextButton,
-    ...((baseButtonStyles === null || baseButtonStyles === void 0 ? void 0 : baseButtonStyles.text) && {
+    ...(baseButtonStyles?.text && {
       color: baseButtonStyles.text,
       placeholderColor: baseButtonStyles.text
     })
   };
   const iconStyles = { ...styles.icon,
-    ...((baseButtonStyles === null || baseButtonStyles === void 0 ? void 0 : baseButtonStyles.text) && {
+    ...(baseButtonStyles?.text && {
       fill: baseButtonStyles.text
     })
   };
 
   const renderButton = () => {
-    var _styles$richTextButto;
-
     return createElement(View, {
       style: richTextButtonContainerStyle
-    }, buttonUseIcon && createElement(Icon, _extends({
-      icon: search
-    }, iconStyles, {
+    }, buttonUseIcon && createElement(Icon, {
+      icon: search,
+      ...iconStyles,
       onLayout: onLayoutButton
-    })), !buttonUseIcon && createElement(View, {
+    }), !buttonUseIcon && createElement(View, {
       accessible: true,
       accessibilityRole: "none",
       accessibilityHint: isScreenReaderEnabled ? __('Double tap to edit button text') : undefined,
@@ -329,15 +319,15 @@ export default function SearchEdit(_ref) {
       onBlur: () => {
         setIsButtonSelected(false);
       },
-      selectionColor: (_styles$richTextButto = styles.richTextButtonCursor) === null || _styles$richTextButto === void 0 ? void 0 : _styles$richTextButto.color
+      selectionColor: styles.richTextButtonCursor?.color
     })));
   };
 
-  return createElement(View, _extends({}, blockProps, {
+  return createElement(View, { ...blockProps,
     style: styles.searchBlockContainer,
     importantForAccessibility: isSelected ? 'yes' : 'no-hide-descendants',
     accessibilityElementsHidden: isSelected ? false : true
-  }), isSelected && controls, showLabel && createElement(View, {
+  }, isSelected && controls, showLabel && createElement(View, {
     accessible: true,
     accessibilityRole: "none",
     accessibilityHint: isScreenReaderEnabled ? __('Double tap to edit label text') : undefined,
@@ -361,7 +351,7 @@ export default function SearchEdit(_ref) {
     onBlur: () => {
       setIsLabelSelected(false);
     },
-    selectionColor: (_styles$richTextButto2 = styles.richTextButtonCursor) === null || _styles$richTextButto2 === void 0 ? void 0 : _styles$richTextButto2.color
+    selectionColor: styles.richTextButtonCursor?.color
   })), ('button-inside' === buttonPosition || 'button-outside' === buttonPosition) && createElement(View, {
     style: searchBarStyle
   }, renderTextField(), renderButton()), 'button-only' === buttonPosition && renderButton(), 'no-button' === buttonPosition && renderTextField());