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

package/build/form-input/edit.cjs

@@ -110,23 +110,38 @@ function InputFieldBlock({ attributes, setAttributes, className }) {
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_editor.InspectorControls, { group: "advanced", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_components.TextControl,
-      {
-        __next40pxDefaultSize: true,
-        autoComplete: "off",
-        label: (0, import_i18n.__)("Name"),
-        value: name,
-        onChange: (newVal) => {
-          setAttributes({
-            name: newVal
-          });
-        },
-        help: (0, import_i18n.__)(
-          'Affects the "name" attribute of the input element, and is used as a name for the form submission results.'
-        )
-      }
-    ) })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_block_editor.InspectorControls, { group: "advanced", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_components.TextControl,
+        {
+          __next40pxDefaultSize: true,
+          autoComplete: "off",
+          label: (0, import_i18n.__)("Name"),
+          value: name,
+          onChange: (newVal) => {
+            setAttributes({
+              name: newVal
+            });
+          },
+          help: (0, import_i18n.__)(
+            'Affects the "name" attribute of the input element, and is used as a name for the form submission results.'
+          )
+        }
+      ),
+      "hidden" === type && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_components.TextControl,
+        {
+          __next40pxDefaultSize: true,
+          autoComplete: "off",
+          label: (0, import_i18n.__)("Value"),
+          value,
+          onChange: (newVal) => setAttributes({ value: newVal }),
+          help: (0, import_i18n.__)(
+            "Sets the stored value for this hidden field."
+          )
+        }
+      )
+    ] })
   ] });
   const content = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_block_editor.RichText,
@@ -141,21 +156,13 @@ function InputFieldBlock({ attributes, setAttributes, className }) {
     }
   );
   if ("hidden" === type) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ...blockProps, children: [
       controls,
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "input",
+        "span",
         {
-          type: "hidden",
-          className: (0, import_clsx.default)(
-            className,
-            "wp-block-form-input__input",
-            colorProps.className,
-            borderProps.className
-          ),
-          "aria-label": (0, import_i18n.__)("Value"),
-          value,
-          onChange: (event) => setAttributes({ value: event.target.value })
+          className: "wp-block-form-input__label is-input-hidden",
+          "data-message": (0, import_i18n.__)("Hidden field")
         }
       )
     ] });

package/build/form-input/edit.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/form-input/edit.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tInspectorControls,\n\tRichText,\n\tuseBlockProps,\n\t__experimentalUseBorderProps as useBorderProps,\n\t__experimentalUseColorProps as useColorProps,\n} from '@wordpress/block-editor';\nimport {\n\tTextControl,\n\tCheckboxControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\n\nfunction InputFieldBlock( { attributes, setAttributes, className } ) {\n\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\tattributes;\n\tconst blockProps = useBlockProps();\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst ref = useRef();\n\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\tconst borderProps = useBorderProps( attributes );\n\tconst colorProps = useColorProps( attributes );\n\tif ( ref.current ) {\n\t\tref.current.focus();\n\t}\n\n\t// Note: radio inputs aren't implemented yet.\n\tconst isCheckboxOrRadio = type === 'checkbox' || type === 'radio';\n\n\tconst controls = (\n\t\t<>\n\t\t\t{ 'hidden' !== type && (\n\t\t\t\t<InspectorControls>\n\t\t\t\t\t<ToolsPanel\n\t\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tinlineLabel: false,\n\t\t\t\t\t\t\t\trequired: false,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ 'checkbox' !== type && (\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Inline label' ) }\n\t\t\t\t\t\t\t\thasValue={ () => !! inlineLabel }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { inlineLabel: false } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Inline label' ) }\n\t\t\t\t\t\t\t\t\tchecked={ inlineLabel }\n\t\t\t\t\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\tinlineLabel: newVal,\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</ToolsPanelItem>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\tlabel={ __( 'Required' ) }\n\t\t\t\t\t\t\thasValue={ () => !! required }\n\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( { required: false } )\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<CheckboxControl\n\t\t\t\t\t\t\t\tlabel={ __( 'Required' ) }\n\t\t\t\t\t\t\t\tchecked={ required }\n\t\t\t\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\trequired: newVal,\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</ToolsPanel>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t<InspectorControls group=\"advanced\">\n\t\t\t\t<TextControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\tvalue={ name }\n\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tname: newVal,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t'Affects the \"name\" attribute of the input element, and is used as a name for the form submission results.'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n\n\tconst content = (\n\t\t<RichText\n\t\t\ttagName=\"span\"\n\t\t\tclassName=\"wp-block-form-input__label-content\"\n\t\t\tvalue={ label }\n\t\t\tonChange={ ( newLabel ) => setAttributes( { label: newLabel } ) }\n\t\t\taria-label={ label ? __( 'Label' ) : __( 'Empty label' ) }\n\t\t\tdata-empty={ ! label }\n\t\t\tplaceholder={ __( 'Type the label for this input' ) }\n\t\t/>\n\t);\n\n\tif ( 'hidden' === type ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ controls }\n\t\t\t\t<input\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t'wp-block-form-input__input',\n\t\t\t\t\t\tcolorProps.className,\n\t\t\t\t\t\tborderProps.className\n\t\t\t\t\t) }\n\t\t\t\t\taria-label={ __( 'Value' ) }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tonChange={ ( event ) =>\n\t\t\t\t\t\tsetAttributes( { value: event.target.value } )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t{ controls }\n\t\t\t<span\n\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t'is-label-inline': inlineLabel || 'checkbox' === type,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ ! isCheckboxOrRadio && content }\n\t\t\t\t<TagName\n\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t'wp-block-form-input__input',\n\t\t\t\t\t\tcolorProps.className,\n\t\t\t\t\t\tborderProps.className\n\t\t\t\t\t) }\n\t\t\t\t\taria-label={ __( 'Optional placeholder text' ) }\n\t\t\t\t\t// We hide the placeholder field's placeholder when there is a value. This\n\t\t\t\t\t// stops screen readers from reading the placeholder field's placeholder\n\t\t\t\t\t// which is confusing.\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tplaceholder ? undefined : __( 'Optional placeholder\u2026' )\n\t\t\t\t\t}\n\t\t\t\t\tvalue={ placeholder }\n\t\t\t\t\tonChange={ ( event ) =>\n\t\t\t\t\t\tsetAttributes( { placeholder: event.target.value } )\n\t\t\t\t\t}\n\t\t\t\t\taria-required={ required }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t...borderProps.style,\n\t\t\t\t\t\t...colorProps.style,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t{ isCheckboxOrRadio && content }\n\t\t\t</span>\n\t\t</div>\n\t);\n}\n\nexport default InputFieldBlock;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tInspectorControls,\n\tRichText,\n\tuseBlockProps,\n\t__experimentalUseBorderProps as useBorderProps,\n\t__experimentalUseColorProps as useColorProps,\n} from '@wordpress/block-editor';\nimport {\n\tTextControl,\n\tCheckboxControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\n\nfunction InputFieldBlock( { attributes, setAttributes, className } ) {\n\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\tattributes;\n\tconst blockProps = useBlockProps();\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst ref = useRef();\n\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\tconst borderProps = useBorderProps( attributes );\n\tconst colorProps = useColorProps( attributes );\n\tif ( ref.current ) {\n\t\tref.current.focus();\n\t}\n\n\t// Note: radio inputs aren't implemented yet.\n\tconst isCheckboxOrRadio = type === 'checkbox' || type === 'radio';\n\n\tconst controls = (\n\t\t<>\n\t\t\t{ 'hidden' !== type && (\n\t\t\t\t<InspectorControls>\n\t\t\t\t\t<ToolsPanel\n\t\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tinlineLabel: false,\n\t\t\t\t\t\t\t\trequired: false,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ 'checkbox' !== type && (\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Inline label' ) }\n\t\t\t\t\t\t\t\thasValue={ () => !! inlineLabel }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { inlineLabel: false } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Inline label' ) }\n\t\t\t\t\t\t\t\t\tchecked={ inlineLabel }\n\t\t\t\t\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\tinlineLabel: newVal,\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</ToolsPanelItem>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\tlabel={ __( 'Required' ) }\n\t\t\t\t\t\t\thasValue={ () => !! required }\n\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( { required: false } )\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<CheckboxControl\n\t\t\t\t\t\t\t\tlabel={ __( 'Required' ) }\n\t\t\t\t\t\t\t\tchecked={ required }\n\t\t\t\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\trequired: newVal,\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</ToolsPanel>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t<InspectorControls group=\"advanced\">\n\t\t\t\t<TextControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\tvalue={ name }\n\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tname: newVal,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t'Affects the \"name\" attribute of the input element, and is used as a name for the form submission results.'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t{ 'hidden' === type && (\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\tlabel={ __( 'Value' ) }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ ( newVal ) =>\n\t\t\t\t\t\t\tsetAttributes( { value: newVal } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Sets the stored value for this hidden field.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n\n\tconst content = (\n\t\t<RichText\n\t\t\ttagName=\"span\"\n\t\t\tclassName=\"wp-block-form-input__label-content\"\n\t\t\tvalue={ label }\n\t\t\tonChange={ ( newLabel ) => setAttributes( { label: newLabel } ) }\n\t\t\taria-label={ label ? __( 'Label' ) : __( 'Empty label' ) }\n\t\t\tdata-empty={ ! label }\n\t\t\tplaceholder={ __( 'Type the label for this input' ) }\n\t\t/>\n\t);\n\n\tif ( 'hidden' === type ) {\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ controls }\n\t\t\t\t<span\n\t\t\t\t\tclassName=\"wp-block-form-input__label is-input-hidden\"\n\t\t\t\t\tdata-message={ __( 'Hidden field' ) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t{ controls }\n\t\t\t<span\n\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t'is-label-inline': inlineLabel || 'checkbox' === type,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ ! isCheckboxOrRadio && content }\n\t\t\t\t<TagName\n\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t'wp-block-form-input__input',\n\t\t\t\t\t\tcolorProps.className,\n\t\t\t\t\t\tborderProps.className\n\t\t\t\t\t) }\n\t\t\t\t\taria-label={ __( 'Optional placeholder text' ) }\n\t\t\t\t\t// We hide the placeholder field's placeholder when there is a value. This\n\t\t\t\t\t// stops screen readers from reading the placeholder field's placeholder\n\t\t\t\t\t// which is confusing.\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tplaceholder ? undefined : __( 'Optional placeholder\u2026' )\n\t\t\t\t\t}\n\t\t\t\t\tvalue={ placeholder }\n\t\t\t\t\tonChange={ ( event ) =>\n\t\t\t\t\t\tsetAttributes( { placeholder: event.target.value } )\n\t\t\t\t\t}\n\t\t\t\t\taria-required={ required }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t...borderProps.style,\n\t\t\t\t\t\t...colorProps.style,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t{ isCheckboxOrRadio && content }\n\t\t\t</span>\n\t\t</div>\n\t);\n}\n\nexport default InputFieldBlock;\n"],
+  "mappings": "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",
   "names": ["useBorderProps", "useColorProps", "ToolsPanel", "ToolsPanelItem", "clsx"]
 }

package/build/form-input/variations.cjs

@@ -89,6 +89,16 @@ var variations = [
     isDefault: true,
     scope: ["inserter", "transform"],
     isActive: (blockAttributes) => blockAttributes?.type === "number"
+  },
+  {
+    name: "hidden",
+    title: (0, import_i18n.__)("Hidden Input"),
+    icon: "visibility",
+    description: (0, import_i18n.__)("A hidden input field."),
+    attributes: { type: "hidden" },
+    isDefault: true,
+    scope: ["inserter", "transform"],
+    isActive: (blockAttributes) => blockAttributes?.type === "hidden"
   }
 ];
 var variations_default = variations;

package/build/form-input/variations.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/form-input/variations.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nconst variations = [\n\t{\n\t\tname: 'text',\n\t\ttitle: __( 'Text Input' ),\n\t\tdescription: __( 'A generic text input.' ),\n\t\tattributes: { type: 'text' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) =>\n\t\t\t! blockAttributes?.type || blockAttributes?.type === 'text',\n\t},\n\t{\n\t\tname: 'textarea',\n\t\ttitle: __( 'Textarea Input' ),\n\t\tdescription: __(\n\t\t\t'A textarea input to allow entering multiple lines of text.'\n\t\t),\n\t\tattributes: { type: 'textarea' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'textarea',\n\t},\n\t{\n\t\tname: 'checkbox',\n\t\ttitle: __( 'Checkbox Input' ),\n\t\tdescription: __( 'A simple checkbox input.' ),\n\t\tattributes: { type: 'checkbox', inlineLabel: true },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'checkbox',\n\t},\n\t{\n\t\tname: 'email',\n\t\ttitle: __( 'Email Input' ),\n\t\tdescription: __( 'Used for email addresses.' ),\n\t\tattributes: { type: 'email' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'email',\n\t},\n\t{\n\t\tname: 'url',\n\t\ttitle: __( 'URL Input' ),\n\t\tdescription: __( 'Used for URLs.' ),\n\t\tattributes: { type: 'url' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'url',\n\t},\n\t{\n\t\tname: 'tel',\n\t\ttitle: __( 'Telephone Input' ),\n\t\tdescription: __( 'Used for phone numbers.' ),\n\t\tattributes: { type: 'tel' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'tel',\n\t},\n\t{\n\t\tname: 'number',\n\t\ttitle: __( 'Number Input' ),\n\t\tdescription: __( 'A numeric input.' ),\n\t\tattributes: { type: 'number' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'number',\n\t},\n];\n\nexport default variations;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AAEnB,IAAM,aAAa;AAAA,EAClB;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,YAAa;AAAA,IACxB,iBAAa,gBAAI,uBAAwB;AAAA,IACzC,YAAY,EAAE,MAAM,OAAO;AAAA,IAC3B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBACX,CAAE,iBAAiB,QAAQ,iBAAiB,SAAS;AAAA,EACvD;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,gBAAiB;AAAA,IAC5B,iBAAa;AAAA,MACZ;AAAA,IACD;AAAA,IACA,YAAY,EAAE,MAAM,WAAW;AAAA,IAC/B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,gBAAiB;AAAA,IAC5B,iBAAa,gBAAI,0BAA2B;AAAA,IAC5C,YAAY,EAAE,MAAM,YAAY,aAAa,KAAK;AAAA,IAClD,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,aAAc;AAAA,IACzB,iBAAa,gBAAI,2BAA4B;AAAA,IAC7C,YAAY,EAAE,MAAM,QAAQ;AAAA,IAC5B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,WAAY;AAAA,IACvB,iBAAa,gBAAI,gBAAiB;AAAA,IAClC,YAAY,EAAE,MAAM,MAAM;AAAA,IAC1B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,iBAAkB;AAAA,IAC7B,iBAAa,gBAAI,yBAA0B;AAAA,IAC3C,YAAY,EAAE,MAAM,MAAM;AAAA,IAC1B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,cAAe;AAAA,IAC1B,iBAAa,gBAAI,kBAAmB;AAAA,IACpC,YAAY,EAAE,MAAM,SAAS;AAAA,IAC7B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AACD;AAEA,IAAO,qBAAQ;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nconst variations = [\n\t{\n\t\tname: 'text',\n\t\ttitle: __( 'Text Input' ),\n\t\tdescription: __( 'A generic text input.' ),\n\t\tattributes: { type: 'text' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) =>\n\t\t\t! blockAttributes?.type || blockAttributes?.type === 'text',\n\t},\n\t{\n\t\tname: 'textarea',\n\t\ttitle: __( 'Textarea Input' ),\n\t\tdescription: __(\n\t\t\t'A textarea input to allow entering multiple lines of text.'\n\t\t),\n\t\tattributes: { type: 'textarea' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'textarea',\n\t},\n\t{\n\t\tname: 'checkbox',\n\t\ttitle: __( 'Checkbox Input' ),\n\t\tdescription: __( 'A simple checkbox input.' ),\n\t\tattributes: { type: 'checkbox', inlineLabel: true },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'checkbox',\n\t},\n\t{\n\t\tname: 'email',\n\t\ttitle: __( 'Email Input' ),\n\t\tdescription: __( 'Used for email addresses.' ),\n\t\tattributes: { type: 'email' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'email',\n\t},\n\t{\n\t\tname: 'url',\n\t\ttitle: __( 'URL Input' ),\n\t\tdescription: __( 'Used for URLs.' ),\n\t\tattributes: { type: 'url' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'url',\n\t},\n\t{\n\t\tname: 'tel',\n\t\ttitle: __( 'Telephone Input' ),\n\t\tdescription: __( 'Used for phone numbers.' ),\n\t\tattributes: { type: 'tel' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'tel',\n\t},\n\t{\n\t\tname: 'number',\n\t\ttitle: __( 'Number Input' ),\n\t\tdescription: __( 'A numeric input.' ),\n\t\tattributes: { type: 'number' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'number',\n\t},\n\t{\n\t\tname: 'hidden',\n\t\ttitle: __( 'Hidden Input' ),\n\t\ticon: 'visibility',\n\t\tdescription: __( 'A hidden input field.' ),\n\t\tattributes: { type: 'hidden' },\n\t\tisDefault: true,\n\t\tscope: [ 'inserter', 'transform' ],\n\t\tisActive: ( blockAttributes ) => blockAttributes?.type === 'hidden',\n\t},\n];\n\nexport default variations;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AAEnB,IAAM,aAAa;AAAA,EAClB;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,YAAa;AAAA,IACxB,iBAAa,gBAAI,uBAAwB;AAAA,IACzC,YAAY,EAAE,MAAM,OAAO;AAAA,IAC3B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBACX,CAAE,iBAAiB,QAAQ,iBAAiB,SAAS;AAAA,EACvD;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,gBAAiB;AAAA,IAC5B,iBAAa;AAAA,MACZ;AAAA,IACD;AAAA,IACA,YAAY,EAAE,MAAM,WAAW;AAAA,IAC/B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,gBAAiB;AAAA,IAC5B,iBAAa,gBAAI,0BAA2B;AAAA,IAC5C,YAAY,EAAE,MAAM,YAAY,aAAa,KAAK;AAAA,IAClD,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,aAAc;AAAA,IACzB,iBAAa,gBAAI,2BAA4B;AAAA,IAC7C,YAAY,EAAE,MAAM,QAAQ;AAAA,IAC5B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,WAAY;AAAA,IACvB,iBAAa,gBAAI,gBAAiB;AAAA,IAClC,YAAY,EAAE,MAAM,MAAM;AAAA,IAC1B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,iBAAkB;AAAA,IAC7B,iBAAa,gBAAI,yBAA0B;AAAA,IAC3C,YAAY,EAAE,MAAM,MAAM;AAAA,IAC1B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,cAAe;AAAA,IAC1B,iBAAa,gBAAI,kBAAmB;AAAA,IACpC,YAAY,EAAE,MAAM,SAAS;AAAA,IAC7B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,cAAe;AAAA,IAC1B,MAAM;AAAA,IACN,iBAAa,gBAAI,uBAAwB;AAAA,IACzC,YAAY,EAAE,MAAM,SAAS;AAAA,IAC7B,WAAW;AAAA,IACX,OAAO,CAAE,YAAY,WAAY;AAAA,IACjC,UAAU,CAAE,oBAAqB,iBAAiB,SAAS;AAAA,EAC5D;AACD;AAEA,IAAO,qBAAQ;",
   "names": []
 }

package/build/group/block.json

@@ -28,8 +28,10 @@
 		"background": {
 			"backgroundImage": true,
 			"backgroundSize": true,
+			"gradient": true,
 			"__experimentalDefaultControls": {
-				"backgroundImage": true
+				"backgroundImage": true,
+				"gradient": true
 			}
 		},
 		"color": {

package/build/icon/edit.cjs

@@ -83,9 +83,7 @@ function Edit({ attributes, setAttributes }) {
       const { getEntityRecord, getEntityRecords } = select(import_core_data.store);
       return {
         selectedIcon: icon ? getEntityRecord("root", "icon", icon) : null,
-        allIcons: isInserterOpen ? getEntityRecords("root", "icon", {
-          per_page: -1
-        }) : void 0
+        allIcons: isInserterOpen ? getEntityRecords("root", "icon") : void 0
       };
     },
     [isInserterOpen, icon]

package/build/icon/edit.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/icon/edit.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tDropdownMenu,\n\tTextControl,\n\tToolbarButton,\n\tToolbarGroup,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport {\n\tBlockControls,\n\tInspectorControls,\n\tuseBlockProps,\n\tuseBlockEditingMode,\n\t__experimentalUseColorProps as useColorProps,\n\t__experimentalUseBorderProps as useBorderProps,\n\t__experimentalGetSpacingClassesAndStyles as useSpacingProps,\n\tgetDimensionsClassesAndStyles as useDimensionsProps,\n} from '@wordpress/block-editor';\nimport { useState } from '@wordpress/element';\nimport { SVG, Rect, Path } from '@wordpress/primitives';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\nimport HtmlRenderer from '../utils/html-renderer';\nimport { CustomInserterModal } from './components';\n\nconst IconPlaceholder = ( { className, style } ) => (\n\t<SVG\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t\tfill=\"none\"\n\t\taria-hidden=\"true\"\n\t\tclassName={ clsx( 'wp-block-icon__placeholder', className ) }\n\t\tstyle={ style }\n\t>\n\t\t<Rect width=\"60\" height=\"60\" fill=\"currentColor\" fillOpacity={ 0.1 } />\n\t\t<Path\n\t\t\tvectorEffect=\"non-scaling-stroke\"\n\t\t\tstroke=\"currentColor\"\n\t\t\tstrokeOpacity={ 0.25 }\n\t\t\td=\"M60 60 0 0\"\n\t\t/>\n\t</SVG>\n);\n\nexport function Edit( { attributes, setAttributes } ) {\n\tconst { icon, ariaLabel } = attributes;\n\n\tconst [ isInserterOpen, setInserterOpen ] = useState( false );\n\n\tconst isContentOnlyMode = useBlockEditingMode() === 'contentOnly';\n\n\tconst colorProps = useColorProps( attributes );\n\tconst spacingProps = useSpacingProps( attributes );\n\tconst borderProps = useBorderProps( attributes );\n\tconst dimensionsProps = useDimensionsProps( attributes );\n\n\tconst { selectedIcon, allIcons = [] } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEntityRecord, getEntityRecords } =\n\t\t\t\tselect( coreDataStore );\n\t\t\treturn {\n\t\t\t\tselectedIcon: icon\n\t\t\t\t\t? getEntityRecord( 'root', 'icon', icon )\n\t\t\t\t\t: null,\n\t\t\t\tallIcons: isInserterOpen\n\t\t\t\t\t? getEntityRecords( 'root', 'icon', {\n\t\t\t\t\t\t\tper_page: -1,\n\t\t\t\t\t  } )\n\t\t\t\t\t: undefined,\n\t\t\t};\n\t\t},\n\t\t[ isInserterOpen, icon ]\n\t);\n\n\tconst iconToDisplay = selectedIcon?.content || '';\n\n\tconst blockControls = (\n\t\t<>\n\t\t\t<BlockControls group={ isContentOnlyMode ? 'inline' : 'other' }>\n\t\t\t\t<ToolbarButton\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tsetInserterOpen( true );\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ icon ? __( 'Replace' ) : __( 'Choose icon' ) }\n\t\t\t\t</ToolbarButton>\n\t\t\t</BlockControls>\n\t\t\t{ isContentOnlyMode && icon && (\n\t\t\t\t// Add some extra controls for content attributes when content only mode is active.\n\t\t\t\t// With content only mode active, the inspector is hidden, so users need another way\n\t\t\t\t// to edit these attributes.\n\t\t\t\t<BlockControls group=\"other\">\n\t\t\t\t\t<ToolbarGroup className=\"components-toolbar-group\">\n\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\ticon=\"\"\n\t\t\t\t\t\t\tpopoverProps={ {\n\t\t\t\t\t\t\t\tclassName: 'is-alternate',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\ttext={ __( 'Label' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ () => (\n\t\t\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\t\t\tclassName=\"wp-block-icon__toolbar-content\"\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Label' ) }\n\t\t\t\t\t\t\t\t\tvalue={ ariaLabel || '' }\n\t\t\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( { ariaLabel: value } )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t\t\t\t'Briefly describe the icon to help screen reader users. Leave blank for decorative icons.'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</DropdownMenu>\n\t\t\t\t\t</ToolbarGroup>\n\t\t\t\t</BlockControls>\n\t\t\t) }\n\t\t</>\n\t);\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst inspectorControls = icon && (\n\t\t<>\n\t\t\t<InspectorControls group=\"settings\">\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\tariaLabel: undefined,\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\tlabel={ __( 'Label' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => !! ariaLabel }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { ariaLabel: undefined } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\tlabel={ __( 'Label' ) }\n\t\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t\t'Briefly describe the icon to help screen reader users. Leave blank for decorative icons.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tvalue={ ariaLabel || '' }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tsetAttributes( { ariaLabel: value } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t/>\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\treturn (\n\t\t<>\n\t\t\t{ blockControls }\n\t\t\t{ inspectorControls }\n\t\t\t<div { ...useBlockProps() }>\n\t\t\t\t{ icon ? (\n\t\t\t\t\t<HtmlRenderer\n\t\t\t\t\t\thtml={ iconToDisplay }\n\t\t\t\t\t\twrapperProps={ {\n\t\t\t\t\t\t\tclassName: clsx(\n\t\t\t\t\t\t\t\tcolorProps.className,\n\t\t\t\t\t\t\t\tborderProps.className,\n\t\t\t\t\t\t\t\tspacingProps.className,\n\t\t\t\t\t\t\t\tdimensionsProps.className\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\t...colorProps.style,\n\t\t\t\t\t\t\t\t...borderProps.style,\n\t\t\t\t\t\t\t\t...spacingProps.style,\n\t\t\t\t\t\t\t\t...dimensionsProps.style,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<IconPlaceholder\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tborderProps.className,\n\t\t\t\t\t\t\tspacingProps.className,\n\t\t\t\t\t\t\tdimensionsProps.className\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t...borderProps.style,\n\t\t\t\t\t\t\t...spacingProps.style,\n\t\t\t\t\t\t\t...dimensionsProps.style,\n\t\t\t\t\t\t\theight: 'auto',\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ isInserterOpen && (\n\t\t\t\t<CustomInserterModal\n\t\t\t\t\ticons={ allIcons }\n\t\t\t\t\tsetInserterOpen={ setInserterOpen }\n\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default Edit;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tDropdownMenu,\n\tTextControl,\n\tToolbarButton,\n\tToolbarGroup,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport {\n\tBlockControls,\n\tInspectorControls,\n\tuseBlockProps,\n\tuseBlockEditingMode,\n\t__experimentalUseColorProps as useColorProps,\n\t__experimentalUseBorderProps as useBorderProps,\n\t__experimentalGetSpacingClassesAndStyles as useSpacingProps,\n\tgetDimensionsClassesAndStyles as useDimensionsProps,\n} from '@wordpress/block-editor';\nimport { useState } from '@wordpress/element';\nimport { SVG, Rect, Path } from '@wordpress/primitives';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\nimport HtmlRenderer from '../utils/html-renderer';\nimport { CustomInserterModal } from './components';\n\nconst IconPlaceholder = ( { className, style } ) => (\n\t<SVG\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t\tfill=\"none\"\n\t\taria-hidden=\"true\"\n\t\tclassName={ clsx( 'wp-block-icon__placeholder', className ) }\n\t\tstyle={ style }\n\t>\n\t\t<Rect width=\"60\" height=\"60\" fill=\"currentColor\" fillOpacity={ 0.1 } />\n\t\t<Path\n\t\t\tvectorEffect=\"non-scaling-stroke\"\n\t\t\tstroke=\"currentColor\"\n\t\t\tstrokeOpacity={ 0.25 }\n\t\t\td=\"M60 60 0 0\"\n\t\t/>\n\t</SVG>\n);\n\nexport function Edit( { attributes, setAttributes } ) {\n\tconst { icon, ariaLabel } = attributes;\n\n\tconst [ isInserterOpen, setInserterOpen ] = useState( false );\n\n\tconst isContentOnlyMode = useBlockEditingMode() === 'contentOnly';\n\n\tconst colorProps = useColorProps( attributes );\n\tconst spacingProps = useSpacingProps( attributes );\n\tconst borderProps = useBorderProps( attributes );\n\tconst dimensionsProps = useDimensionsProps( attributes );\n\n\tconst { selectedIcon, allIcons = [] } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEntityRecord, getEntityRecords } =\n\t\t\t\tselect( coreDataStore );\n\t\t\treturn {\n\t\t\t\tselectedIcon: icon\n\t\t\t\t\t? getEntityRecord( 'root', 'icon', icon )\n\t\t\t\t\t: null,\n\t\t\t\tallIcons: isInserterOpen\n\t\t\t\t\t? getEntityRecords( 'root', 'icon' )\n\t\t\t\t\t: undefined,\n\t\t\t};\n\t\t},\n\t\t[ isInserterOpen, icon ]\n\t);\n\n\tconst iconToDisplay = selectedIcon?.content || '';\n\n\tconst blockControls = (\n\t\t<>\n\t\t\t<BlockControls group={ isContentOnlyMode ? 'inline' : 'other' }>\n\t\t\t\t<ToolbarButton\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tsetInserterOpen( true );\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ icon ? __( 'Replace' ) : __( 'Choose icon' ) }\n\t\t\t\t</ToolbarButton>\n\t\t\t</BlockControls>\n\t\t\t{ isContentOnlyMode && icon && (\n\t\t\t\t// Add some extra controls for content attributes when content only mode is active.\n\t\t\t\t// With content only mode active, the inspector is hidden, so users need another way\n\t\t\t\t// to edit these attributes.\n\t\t\t\t<BlockControls group=\"other\">\n\t\t\t\t\t<ToolbarGroup className=\"components-toolbar-group\">\n\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\ticon=\"\"\n\t\t\t\t\t\t\tpopoverProps={ {\n\t\t\t\t\t\t\t\tclassName: 'is-alternate',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\ttext={ __( 'Label' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ () => (\n\t\t\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\t\t\tclassName=\"wp-block-icon__toolbar-content\"\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Label' ) }\n\t\t\t\t\t\t\t\t\tvalue={ ariaLabel || '' }\n\t\t\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( { ariaLabel: value } )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t\t\t\t'Briefly describe the icon to help screen reader users. Leave blank for decorative icons.'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</DropdownMenu>\n\t\t\t\t\t</ToolbarGroup>\n\t\t\t\t</BlockControls>\n\t\t\t) }\n\t\t</>\n\t);\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst inspectorControls = icon && (\n\t\t<>\n\t\t\t<InspectorControls group=\"settings\">\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\tariaLabel: undefined,\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\tlabel={ __( 'Label' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => !! ariaLabel }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { ariaLabel: undefined } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\tlabel={ __( 'Label' ) }\n\t\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t\t'Briefly describe the icon to help screen reader users. Leave blank for decorative icons.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tvalue={ ariaLabel || '' }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tsetAttributes( { ariaLabel: value } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t/>\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\treturn (\n\t\t<>\n\t\t\t{ blockControls }\n\t\t\t{ inspectorControls }\n\t\t\t<div { ...useBlockProps() }>\n\t\t\t\t{ icon ? (\n\t\t\t\t\t<HtmlRenderer\n\t\t\t\t\t\thtml={ iconToDisplay }\n\t\t\t\t\t\twrapperProps={ {\n\t\t\t\t\t\t\tclassName: clsx(\n\t\t\t\t\t\t\t\tcolorProps.className,\n\t\t\t\t\t\t\t\tborderProps.className,\n\t\t\t\t\t\t\t\tspacingProps.className,\n\t\t\t\t\t\t\t\tdimensionsProps.className\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\t...colorProps.style,\n\t\t\t\t\t\t\t\t...borderProps.style,\n\t\t\t\t\t\t\t\t...spacingProps.style,\n\t\t\t\t\t\t\t\t...dimensionsProps.style,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<IconPlaceholder\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tborderProps.className,\n\t\t\t\t\t\t\tspacingProps.className,\n\t\t\t\t\t\t\tdimensionsProps.className\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t...borderProps.style,\n\t\t\t\t\t\t\t...spacingProps.style,\n\t\t\t\t\t\t\t...dimensionsProps.style,\n\t\t\t\t\t\t\theight: 'auto',\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ isInserterOpen && (\n\t\t\t\t<CustomInserterModal\n\t\t\t\t\ticons={ allIcons }\n\t\t\t\t\tsetInserterOpen={ setInserterOpen }\n\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default Edit;\n"],
+  "mappings": "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",
   "names": ["import_components", "clsx", "useColorProps", "useSpacingProps", "useBorderProps", "useDimensionsProps", "coreDataStore", "ToolsPanel", "ToolsPanelItem", "HtmlRenderer"]
 }

package/build/image/image.cjs

@@ -44,7 +44,9 @@ var import_hooks = require("../utils/hooks.cjs");
 var import_constants = require("./constants.cjs");
 var import_utils = require("./utils.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
-var { DimensionsTool, ResolutionTool } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
+var { DimensionsTool, ResolutionTool, mediaEditKey } = (0, import_lock_unlock.unlock)(
+  import_block_editor.privateApis
+);
 var scaleOptions = [
   {
     value: "cover",
@@ -281,7 +283,13 @@ function Image({
     },
     [id, isSingleSelected]
   );
-  const { canInsertCover, imageEditing, imageSizes, maxWidth } = (0, import_data.useSelect)(
+  const {
+    canInsertCover,
+    imageEditing,
+    imageSizes,
+    maxWidth,
+    editMediaEntity
+  } = (0, import_data.useSelect)(
     (select) => {
       const { getBlockRootClientId, canInsertBlockType, getSettings: getSettings2 } = select(import_block_editor.store);
       const rootClientId = getBlockRootClientId(clientId);
@@ -290,6 +298,7 @@ function Image({
         imageEditing: settings.imageEditing,
         imageSizes: settings.imageSizes,
         maxWidth: settings.maxWidth,
+        editMediaEntity: settings?.[mediaEditKey],
         canInsertCover: canInsertBlockType(
           "core/cover",
           rootClientId
@@ -316,6 +325,7 @@ function Image({
   const isContentOnlyMode = blockEditingMode === "contentOnly";
   const showDimensionsControls = allowResize && hasNonContentControls;
   const isResizable = allowResize && hasNonContentControls && !isWideAligned && isLargeViewport;
+  const isUploading = !!temporaryURL || isSideloading;
   const imageSizeOptions = imageSizes.filter(
     ({ slug }) => image?.media_details?.sizes?.[slug]?.source_url
   ).map(({ name, slug }) => ({ value: slug, label: name }));
@@ -431,7 +441,7 @@ function Image({
       setIsEditingImage(false);
     }
   }, [isSingleSelected]);
-  const canEditImage = id && naturalWidth && naturalHeight && imageEditing;
+  const canEditImage = id && naturalWidth && naturalHeight && imageEditing && !!editMediaEntity;
   const allowCrop = isSingleSelected && canEditImage && !isEditingImage && !isContentOnlyMode;
   function switchToCover() {
     replaceBlocks(
@@ -589,7 +599,7 @@ function Image({
     }
   ) });
   const hasDataFormBlockFields = window?.__experimentalContentOnlyInspectorFields;
-  const editMediaButton = window?.__experimentalMediaEditor && id && isSingleSelected && canUserEdit && !(0, import_edit.isExternalImage)(id, url) && !isEditingImage && onNavigateToEntityRecord && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_editor.BlockControls, { group: "other", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  const editMediaButton = window?.__experimentalMediaEditor && id && isSingleSelected && canUserEdit && !!editMediaEntity && !(0, import_edit.isExternalImage)(id, url) && !isEditingImage && onNavigateToEntityRecord && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_editor.BlockControls, { group: "other", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_components.ToolbarButton,
     {
       onClick: () => {
@@ -685,7 +695,7 @@ function Image({
                   onSelectURL,
                   onError: onUploadError,
                   onReset: () => onSelectImage(void 0),
-                  isUploading: !!temporaryURL || isSideloading,
+                  isUploading,
                   emptyLabel: (0, import_i18n.__)("Add image")
                 }
               )
@@ -864,7 +874,7 @@ function Image({
         }
       }
     ),
-    (temporaryURL || isSideloading) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {})
+    isUploading && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {})
   ] });
   if (canEditImage && isEditingImage) {
     img = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ImageWrapper, { href, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -886,7 +896,7 @@ function Image({
     img = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ImageWrapper, { href, children: img });
   }
   let resizableBox;
-  if (isResizable && isSingleSelected && !isEditingImage && !import_constants.SIZED_LAYOUTS.includes(parentLayoutType)) {
+  if (isResizable && isSingleSelected && !isEditingImage && !isUploading && !import_constants.SIZED_LAYOUTS.includes(parentLayoutType)) {
     const numericRatio = aspectRatio && (0, import_utils.evalAspectRatio)(aspectRatio);
     const customRatio = pixelSize.width / pixelSize.height;
     const naturalRatio = naturalWidth / naturalHeight;