@wordpress/block-library 9.7.0 → 9.7.1-next.1f6eadc42.0

package/build/form-input/deprecated.js

@@ -27,6 +27,118 @@ const getNameFromLabelV1 = content => {
   // Remove any remaining leading or trailing hyphens.
   .replace(/(^-+)|(-+$)/g, '');
 };
+const v2 = {
+  attributes: {
+    type: {
+      type: 'string',
+      default: 'text'
+    },
+    name: {
+      type: 'string'
+    },
+    label: {
+      type: 'string',
+      default: 'Label',
+      selector: '.wp-block-form-input__label-content',
+      source: 'html',
+      __experimentalRole: 'content'
+    },
+    inlineLabel: {
+      type: 'boolean',
+      default: false
+    },
+    required: {
+      type: 'boolean',
+      default: false,
+      selector: '.wp-block-form-input__input',
+      source: 'attribute',
+      attribute: 'required'
+    },
+    placeholder: {
+      type: 'string',
+      selector: '.wp-block-form-input__input',
+      source: 'attribute',
+      attribute: 'placeholder',
+      __experimentalRole: 'content'
+    },
+    value: {
+      type: 'string',
+      default: '',
+      selector: 'input',
+      source: 'attribute',
+      attribute: 'value'
+    },
+    visibilityPermissions: {
+      type: 'string',
+      default: 'all'
+    }
+  },
+  supports: {
+    anchor: true,
+    reusable: false,
+    spacing: {
+      margin: ['top', 'bottom']
+    },
+    __experimentalBorder: {
+      radius: true,
+      __experimentalSkipSerialization: true,
+      __experimentalDefaultControls: {
+        radius: true
+      }
+    }
+  },
+  save({
+    attributes
+  }) {
+    const {
+      type,
+      name,
+      label,
+      inlineLabel,
+      required,
+      placeholder,
+      value
+    } = attributes;
+    const borderProps = (0, _blockEditor.__experimentalGetBorderClassesAndStyles)(attributes);
+    const colorProps = (0, _blockEditor.__experimentalGetColorClassesAndStyles)(attributes);
+    const inputStyle = {
+      ...borderProps.style,
+      ...colorProps.style
+    };
+    const inputClasses = (0, _clsx.default)('wp-block-form-input__input', colorProps.className, borderProps.className);
+    const TagName = type === 'textarea' ? 'textarea' : 'input';
+    const blockProps = _blockEditor.useBlockProps.save();
+    if ('hidden' === type) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+        type: type,
+        name: name,
+        value: value
+      });
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      ...blockProps,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
+        className: (0, _clsx.default)('wp-block-form-input__label', {
+          'is-label-inline': inlineLabel
+        }),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "wp-block-form-input__label-content",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, {
+            value: label
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TagName, {
+          className: inputClasses,
+          type: 'textarea' === type ? undefined : type,
+          name: name || getNameFromLabelV1(label),
+          required: required,
+          "aria-required": required,
+          placeholder: placeholder || undefined,
+          style: inputStyle
+        })]
+      })
+    });
+  }
+};
 
 // Version without wrapper div in saved markup
 // See: https://github.com/WordPress/gutenberg/pull/56507
@@ -142,6 +254,6 @@ const v1 = {
     /* eslint-enable jsx-a11y/label-has-associated-control */
   }
 };
-const deprecated = [v1];
+const deprecated = [v2, v1];
 var _default = exports.default = deprecated;
 //# sourceMappingURL=deprecated.js.map

package/build/form-input/deprecated.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_removeAccents","_blockEditor","_dom","_jsxRuntime","getNameFromLabelV1","content","removeAccents","stripHTML","replace","toLowerCase","v1","attributes","type","default","name","label","selector","source","__experimentalRole","inlineLabel","required","attribute","placeholder","value","visibilityPermissions","supports","className","anchor","reusable","spacing","margin","__experimentalBorder","radius","__experimentalSkipSerialization","__experimentalDefaultControls","save","borderProps","getBorderClassesAndStyles","colorProps","getColorClassesAndStyles","inputStyle","style","inputClasses","clsx","TagName","jsx","jsxs","children","RichText","Content","undefined","deprecated","_default","exports"],"sources":["@wordpress/block-library/src/form-input/deprecated.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tRichText,\n\t__experimentalGetBorderClassesAndStyles as getBorderClassesAndStyles,\n\t__experimentalGetColorClassesAndStyles as getColorClassesAndStyles,\n} from '@wordpress/block-editor';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\nconst getNameFromLabelV1 = ( content ) => {\n\treturn (\n\t\tremoveAccents( stripHTML( content ) )\n\t\t\t// Convert anything that's not a letter or number to a hyphen.\n\t\t\t.replace( /[^\\p{L}\\p{N}]+/gu, '-' )\n\t\t\t// Convert to lowercase\n\t\t\t.toLowerCase()\n\t\t\t// Remove any remaining leading or trailing hyphens.\n\t\t\t.replace( /(^-+)|(-+$)/g, '' )\n\t);\n};\n\n// Version without wrapper div in saved markup\n// See: https://github.com/WordPress/gutenberg/pull/56507\nconst v1 = {\n\tattributes: {\n\t\ttype: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'text',\n\t\t},\n\t\tname: {\n\t\t\ttype: 'string',\n\t\t},\n\t\tlabel: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'Label',\n\t\t\tselector: '.wp-block-form-input__label-content',\n\t\t\tsource: 'html',\n\t\t\t__experimentalRole: 'content',\n\t\t},\n\t\tinlineLabel: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t},\n\t\trequired: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'required',\n\t\t},\n\t\tplaceholder: {\n\t\t\ttype: 'string',\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'placeholder',\n\t\t\t__experimentalRole: 'content',\n\t\t},\n\t\tvalue: {\n\t\t\ttype: 'string',\n\t\t\tdefault: '',\n\t\t\tselector: 'input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'value',\n\t\t},\n\t\tvisibilityPermissions: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'all',\n\t\t},\n\t},\n\tsupports: {\n\t\tclassName: false,\n\t\tanchor: true,\n\t\treusable: false,\n\t\tspacing: {\n\t\t\tmargin: [ 'top', 'bottom' ],\n\t\t},\n\t\t__experimentalBorder: {\n\t\t\tradius: true,\n\t\t\t__experimentalSkipSerialization: true,\n\t\t\t__experimentalDefaultControls: {\n\t\t\t\tradius: true,\n\t\t\t},\n\t\t},\n\t},\n\tsave( { attributes } ) {\n\t\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\t\tattributes;\n\n\t\tconst borderProps = getBorderClassesAndStyles( attributes );\n\t\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\t\tconst inputStyle = {\n\t\t\t...borderProps.style,\n\t\t\t...colorProps.style,\n\t\t};\n\n\t\tconst inputClasses = clsx(\n\t\t\t'wp-block-form-input__input',\n\t\t\tcolorProps.className,\n\t\t\tborderProps.className\n\t\t);\n\t\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\t\tif ( 'hidden' === type ) {\n\t\t\treturn <input type={ type } name={ name } value={ value } />;\n\t\t}\n\n\t\t/* eslint-disable jsx-a11y/label-has-associated-control */\n\t\treturn (\n\t\t\t<label\n\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t'is-label-inline': inlineLabel,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t</span>\n\t\t\t\t<TagName\n\t\t\t\t\tclassName={ inputClasses }\n\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\tname={ name || getNameFromLabelV1( label ) }\n\t\t\t\t\trequired={ required }\n\t\t\t\t\taria-required={ required }\n\t\t\t\t\tplaceholder={ placeholder || undefined }\n\t\t\t\t\tstyle={ inputStyle }\n\t\t\t\t/>\n\t\t\t</label>\n\t\t);\n\t\t/* eslint-enable jsx-a11y/label-has-associated-control */\n\t},\n};\n\nconst deprecated = [ v1 ];\n\nexport default deprecated;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_removeAccents","_blockEditor","_dom","_jsxRuntime","getNameFromLabelV1","content","removeAccents","stripHTML","replace","toLowerCase","v2","attributes","type","default","name","label","selector","source","__experimentalRole","inlineLabel","required","attribute","placeholder","value","visibilityPermissions","supports","anchor","reusable","spacing","margin","__experimentalBorder","radius","__experimentalSkipSerialization","__experimentalDefaultControls","save","borderProps","getBorderClassesAndStyles","colorProps","getColorClassesAndStyles","inputStyle","style","inputClasses","clsx","className","TagName","blockProps","useBlockProps","jsx","children","jsxs","RichText","Content","undefined","v1","deprecated","_default","exports"],"sources":["@wordpress/block-library/src/form-input/deprecated.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tRichText,\n\tuseBlockProps,\n\t__experimentalGetBorderClassesAndStyles as getBorderClassesAndStyles,\n\t__experimentalGetColorClassesAndStyles as getColorClassesAndStyles,\n} from '@wordpress/block-editor';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\nconst getNameFromLabelV1 = ( content ) => {\n\treturn (\n\t\tremoveAccents( stripHTML( content ) )\n\t\t\t// Convert anything that's not a letter or number to a hyphen.\n\t\t\t.replace( /[^\\p{L}\\p{N}]+/gu, '-' )\n\t\t\t// Convert to lowercase\n\t\t\t.toLowerCase()\n\t\t\t// Remove any remaining leading or trailing hyphens.\n\t\t\t.replace( /(^-+)|(-+$)/g, '' )\n\t);\n};\n\nconst v2 = {\n\tattributes: {\n\t\ttype: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'text',\n\t\t},\n\t\tname: {\n\t\t\ttype: 'string',\n\t\t},\n\t\tlabel: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'Label',\n\t\t\tselector: '.wp-block-form-input__label-content',\n\t\t\tsource: 'html',\n\t\t\t__experimentalRole: 'content',\n\t\t},\n\t\tinlineLabel: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t},\n\t\trequired: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'required',\n\t\t},\n\t\tplaceholder: {\n\t\t\ttype: 'string',\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'placeholder',\n\t\t\t__experimentalRole: 'content',\n\t\t},\n\t\tvalue: {\n\t\t\ttype: 'string',\n\t\t\tdefault: '',\n\t\t\tselector: 'input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'value',\n\t\t},\n\t\tvisibilityPermissions: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'all',\n\t\t},\n\t},\n\tsupports: {\n\t\tanchor: true,\n\t\treusable: false,\n\t\tspacing: {\n\t\t\tmargin: [ 'top', 'bottom' ],\n\t\t},\n\t\t__experimentalBorder: {\n\t\t\tradius: true,\n\t\t\t__experimentalSkipSerialization: true,\n\t\t\t__experimentalDefaultControls: {\n\t\t\t\tradius: true,\n\t\t\t},\n\t\t},\n\t},\n\tsave( { attributes } ) {\n\t\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\t\tattributes;\n\n\t\tconst borderProps = getBorderClassesAndStyles( attributes );\n\t\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\t\tconst inputStyle = {\n\t\t\t...borderProps.style,\n\t\t\t...colorProps.style,\n\t\t};\n\n\t\tconst inputClasses = clsx(\n\t\t\t'wp-block-form-input__input',\n\t\t\tcolorProps.className,\n\t\t\tborderProps.className\n\t\t);\n\t\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\t\tconst blockProps = useBlockProps.save();\n\n\t\tif ( 'hidden' === type ) {\n\t\t\treturn <input type={ type } name={ name } value={ value } />;\n\t\t}\n\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ /* eslint-disable jsx-a11y/label-has-associated-control */ }\n\t\t\t\t<label\n\t\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t\t'is-label-inline': inlineLabel,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t\t</span>\n\t\t\t\t\t<TagName\n\t\t\t\t\t\tclassName={ inputClasses }\n\t\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\t\tname={ name || getNameFromLabelV1( label ) }\n\t\t\t\t\t\trequired={ required }\n\t\t\t\t\t\taria-required={ required }\n\t\t\t\t\t\tplaceholder={ placeholder || undefined }\n\t\t\t\t\t\tstyle={ inputStyle }\n\t\t\t\t\t/>\n\t\t\t\t</label>\n\t\t\t\t{ /* eslint-enable jsx-a11y/label-has-associated-control */ }\n\t\t\t</div>\n\t\t);\n\t},\n};\n\n// Version without wrapper div in saved markup\n// See: https://github.com/WordPress/gutenberg/pull/56507\nconst v1 = {\n\tattributes: {\n\t\ttype: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'text',\n\t\t},\n\t\tname: {\n\t\t\ttype: 'string',\n\t\t},\n\t\tlabel: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'Label',\n\t\t\tselector: '.wp-block-form-input__label-content',\n\t\t\tsource: 'html',\n\t\t\t__experimentalRole: 'content',\n\t\t},\n\t\tinlineLabel: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t},\n\t\trequired: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'required',\n\t\t},\n\t\tplaceholder: {\n\t\t\ttype: 'string',\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'placeholder',\n\t\t\t__experimentalRole: 'content',\n\t\t},\n\t\tvalue: {\n\t\t\ttype: 'string',\n\t\t\tdefault: '',\n\t\t\tselector: 'input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'value',\n\t\t},\n\t\tvisibilityPermissions: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'all',\n\t\t},\n\t},\n\tsupports: {\n\t\tclassName: false,\n\t\tanchor: true,\n\t\treusable: false,\n\t\tspacing: {\n\t\t\tmargin: [ 'top', 'bottom' ],\n\t\t},\n\t\t__experimentalBorder: {\n\t\t\tradius: true,\n\t\t\t__experimentalSkipSerialization: true,\n\t\t\t__experimentalDefaultControls: {\n\t\t\t\tradius: true,\n\t\t\t},\n\t\t},\n\t},\n\tsave( { attributes } ) {\n\t\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\t\tattributes;\n\n\t\tconst borderProps = getBorderClassesAndStyles( attributes );\n\t\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\t\tconst inputStyle = {\n\t\t\t...borderProps.style,\n\t\t\t...colorProps.style,\n\t\t};\n\n\t\tconst inputClasses = clsx(\n\t\t\t'wp-block-form-input__input',\n\t\t\tcolorProps.className,\n\t\t\tborderProps.className\n\t\t);\n\t\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\t\tif ( 'hidden' === type ) {\n\t\t\treturn <input type={ type } name={ name } value={ value } />;\n\t\t}\n\n\t\t/* eslint-disable jsx-a11y/label-has-associated-control */\n\t\treturn (\n\t\t\t<label\n\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t'is-label-inline': inlineLabel,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t</span>\n\t\t\t\t<TagName\n\t\t\t\t\tclassName={ inputClasses }\n\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\tname={ name || getNameFromLabelV1( label ) }\n\t\t\t\t\trequired={ required }\n\t\t\t\t\taria-required={ required }\n\t\t\t\t\tplaceholder={ placeholder || undefined }\n\t\t\t\t\tstyle={ inputStyle }\n\t\t\t\t/>\n\t\t\t</label>\n\t\t);\n\t\t/* eslint-enable jsx-a11y/label-has-associated-control */\n\t},\n};\n\nconst deprecated = [ v2, v1 ];\n\nexport default deprecated;\n"],"mappings":"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","ignoreList":[]}

package/build/form-input/edit.js

@@ -41,6 +41,9 @@ function InputFieldBlock({
   if (ref.current) {
     ref.current.focus();
   }
+
+  // Note: radio inputs aren't implemented yet.
+  const isCheckboxOrRadio = type === 'checkbox' || type === 'radio';
   const controls = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: ['hidden' !== type && /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.PanelBody, {
@@ -82,6 +85,17 @@ function InputFieldBlock({
       })
     })]
   });
+  const content = /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText, {
+    tagName: "span",
+    className: "wp-block-form-input__label-content",
+    value: label,
+    onChange: newLabel => setAttributes({
+      label: newLabel
+    }),
+    "aria-label": label ? (0, _i18n.__)('Label') : (0, _i18n.__)('Empty label'),
+    "data-empty": !label,
+    placeholder: (0, _i18n.__)('Type the label for this input')
+  });
   if ('hidden' === type) {
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [controls, /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
@@ -101,17 +115,7 @@ function InputFieldBlock({
       className: (0, _clsx.default)('wp-block-form-input__label', {
         'is-label-inline': inlineLabel || 'checkbox' === type
       }),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText, {
-        tagName: "span",
-        className: "wp-block-form-input__label-content",
-        value: label,
-        onChange: newLabel => setAttributes({
-          label: newLabel
-        }),
-        "aria-label": label ? (0, _i18n.__)('Label') : (0, _i18n.__)('Empty label'),
-        "data-empty": label ? false : true,
-        placeholder: (0, _i18n.__)('Type the label for this input')
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TagName, {
+      children: [!isCheckboxOrRadio && content, /*#__PURE__*/(0, _jsxRuntime.jsx)(TagName, {
         type: 'textarea' === type ? undefined : type,
         className: (0, _clsx.default)(className, 'wp-block-form-input__input', colorProps.className, borderProps.className),
         "aria-label": (0, _i18n.__)('Optional placeholder text')
@@ -129,7 +133,7 @@ function InputFieldBlock({
           ...borderProps.style,
           ...colorProps.style
         }
-      })]
+      }), isCheckboxOrRadio && content]
     })]
   });
 }

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

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_i18n","_blockEditor","_components","_element","_jsxRuntime","InputFieldBlock","attributes","setAttributes","className","type","name","label","inlineLabel","required","placeholder","value","blockProps","useBlockProps","ref","useRef","TagName","borderProps","useBorderProps","colorProps","useColorProps","current","focus","controls","jsxs","Fragment","children","jsx","InspectorControls","PanelBody","title","__","CheckboxControl","__nextHasNoMarginBottom","checked","onChange","newVal","group","TextControl","__next40pxDefaultSize","autoComplete","help","clsx","event","target","RichText","tagName","newLabel","undefined","style","_default","exports","default"],"sources":["@wordpress/block-library/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 { PanelBody, TextControl, CheckboxControl } from '@wordpress/components';\n\nimport { useRef } from '@wordpress/element';\n\nfunction InputFieldBlock( { attributes, setAttributes, className } ) {\n\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\tattributes;\n\tconst blockProps = useBlockProps();\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\tconst controls = (\n\t\t<>\n\t\t\t{ 'hidden' !== type && (\n\t\t\t\t<InspectorControls>\n\t\t\t\t\t<PanelBody title={ __( 'Settings' ) }>\n\t\t\t\t\t\t{ 'checkbox' !== type && (\n\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t\tlabel={ __( 'Inline label' ) }\n\t\t\t\t\t\t\t\tchecked={ inlineLabel }\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\tinlineLabel: 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) }\n\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\tlabel={ __( 'Required' ) }\n\t\t\t\t\t\t\tchecked={ required }\n\t\t\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\trequired: newVal,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PanelBody>\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\t__nextHasNoMarginBottom\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\" atribute 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\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<RichText\n\t\t\t\t\ttagName=\"span\"\n\t\t\t\t\tclassName=\"wp-block-form-input__label-content\"\n\t\t\t\t\tvalue={ label }\n\t\t\t\t\tonChange={ ( newLabel ) =>\n\t\t\t\t\t\tsetAttributes( { label: newLabel } )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={ label ? __( 'Label' ) : __( 'Empty label' ) }\n\t\t\t\t\tdata-empty={ label ? false : true }\n\t\t\t\t\tplaceholder={ __( 'Type the label for this input' ) }\n\t\t\t\t/>\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…' )\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</span>\n\t\t</div>\n\t);\n}\n\nexport default InputFieldBlock;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_i18n","_blockEditor","_components","_element","_jsxRuntime","InputFieldBlock","attributes","setAttributes","className","type","name","label","inlineLabel","required","placeholder","value","blockProps","useBlockProps","ref","useRef","TagName","borderProps","useBorderProps","colorProps","useColorProps","current","focus","isCheckboxOrRadio","controls","jsxs","Fragment","children","jsx","InspectorControls","PanelBody","title","__","CheckboxControl","__nextHasNoMarginBottom","checked","onChange","newVal","group","TextControl","__next40pxDefaultSize","autoComplete","help","content","RichText","tagName","newLabel","clsx","event","target","undefined","style","_default","exports","default"],"sources":["@wordpress/block-library/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 { PanelBody, TextControl, CheckboxControl } from '@wordpress/components';\n\nimport { useRef } from '@wordpress/element';\n\nfunction InputFieldBlock( { attributes, setAttributes, className } ) {\n\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\tattributes;\n\tconst blockProps = useBlockProps();\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<PanelBody title={ __( 'Settings' ) }>\n\t\t\t\t\t\t{ 'checkbox' !== type && (\n\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t\tlabel={ __( 'Inline label' ) }\n\t\t\t\t\t\t\t\tchecked={ inlineLabel }\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\tinlineLabel: 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) }\n\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\tlabel={ __( 'Required' ) }\n\t\t\t\t\t\t\tchecked={ required }\n\t\t\t\t\t\t\tonChange={ ( newVal ) => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\trequired: newVal,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PanelBody>\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\t__nextHasNoMarginBottom\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\" atribute 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…' )\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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","ignoreList":[]}

package/build/form-input/save.js

@@ -54,6 +54,9 @@ function save({
   const inputClasses = (0, _clsx.default)('wp-block-form-input__input', colorProps.className, borderProps.className);
   const TagName = type === 'textarea' ? 'textarea' : 'input';
   const blockProps = _blockEditor.useBlockProps.save();
+
+  // Note: radio inputs aren't implemented yet.
+  const isCheckboxOrRadio = type === 'checkbox' || type === 'radio';
   if ('hidden' === type) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
       type: type,
@@ -67,7 +70,7 @@ function save({
       className: (0, _clsx.default)('wp-block-form-input__label', {
         'is-label-inline': inlineLabel
       }),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: [!isCheckboxOrRadio && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "wp-block-form-input__label-content",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, {
           value: label
@@ -80,6 +83,11 @@ function save({
         "aria-required": required,
         placeholder: placeholder || undefined,
         style: inputStyle
+      }), isCheckboxOrRadio && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "wp-block-form-input__label-content",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, {
+          value: label
+        })
       })]
     })
   });

package/build/form-input/save.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_removeAccents","_blockEditor","_dom","_jsxRuntime","getNameFromLabel","content","removeAccents","stripHTML","replace","toLowerCase","save","attributes","type","name","label","inlineLabel","required","placeholder","value","borderProps","getBorderClassesAndStyles","colorProps","getColorClassesAndStyles","inputStyle","style","inputClasses","clsx","className","TagName","blockProps","useBlockProps","jsx","children","jsxs","RichText","Content","undefined"],"sources":["@wordpress/block-library/src/form-input/save.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tRichText,\n\tuseBlockProps,\n\t__experimentalGetBorderClassesAndStyles as getBorderClassesAndStyles,\n\t__experimentalGetColorClassesAndStyles as getColorClassesAndStyles,\n} from '@wordpress/block-editor';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\n/**\n * Get the name attribute from a content string.\n *\n * @param {string} content The block content.\n *\n * @return {string} Returns the slug.\n */\nconst getNameFromLabel = ( content ) => {\n\treturn (\n\t\tremoveAccents( stripHTML( content ) )\n\t\t\t// Convert anything that's not a letter or number to a hyphen.\n\t\t\t.replace( /[^\\p{L}\\p{N}]+/gu, '-' )\n\t\t\t// Convert to lowercase\n\t\t\t.toLowerCase()\n\t\t\t// Remove any remaining leading or trailing hyphens.\n\t\t\t.replace( /(^-+)|(-+$)/g, '' )\n\t);\n};\n\nexport default function save( { attributes } ) {\n\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\tattributes;\n\n\tconst borderProps = getBorderClassesAndStyles( attributes );\n\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\tconst inputStyle = {\n\t\t...borderProps.style,\n\t\t...colorProps.style,\n\t};\n\n\tconst inputClasses = clsx(\n\t\t'wp-block-form-input__input',\n\t\tcolorProps.className,\n\t\tborderProps.className\n\t);\n\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\tconst blockProps = useBlockProps.save();\n\n\tif ( 'hidden' === type ) {\n\t\treturn <input type={ type } name={ name } value={ value } />;\n\t}\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t{ /* eslint-disable jsx-a11y/label-has-associated-control */ }\n\t\t\t<label\n\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t'is-label-inline': inlineLabel,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t</span>\n\t\t\t\t<TagName\n\t\t\t\t\tclassName={ inputClasses }\n\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\tname={ name || getNameFromLabel( label ) }\n\t\t\t\t\trequired={ required }\n\t\t\t\t\taria-required={ required }\n\t\t\t\t\tplaceholder={ placeholder || undefined }\n\t\t\t\t\tstyle={ inputStyle }\n\t\t\t\t/>\n\t\t\t</label>\n\t\t\t{ /* eslint-enable jsx-a11y/label-has-associated-control */ }\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAF,sBAAA,CAAAC,OAAA;AAKA,IAAAE,YAAA,GAAAF,OAAA;AAMA,IAAAG,IAAA,GAAAH,OAAA;AAAkE,IAAAI,WAAA,GAAAJ,OAAA;AAflE;AACA;AACA;;AAIA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,MAAMK,gBAAgB,GAAKC,OAAO,IAAM;EACvC,OACC,IAAAC,sBAAa,EAAE,IAAAC,wBAAS,EAAEF,OAAQ,CAAE;EACnC;EAAA,CACCG,OAAO,CAAE,kBAAkB,EAAE,GAAI;EAClC;EAAA,CACCC,WAAW,CAAC;EACb;EAAA,CACCD,OAAO,CAAE,cAAc,EAAE,EAAG,CAAC;AAEjC,CAAC;AAEc,SAASE,IAAIA,CAAE;EAAEC;AAAW,CAAC,EAAG;EAC9C,MAAM;IAAEC,IAAI;IAAEC,IAAI;IAAEC,KAAK;IAAEC,WAAW;IAAEC,QAAQ;IAAEC,WAAW;IAAEC;EAAM,CAAC,GACrEP,UAAU;EAEX,MAAMQ,WAAW,GAAG,IAAAC,oDAAyB,EAAET,UAAW,CAAC;EAC3D,MAAMU,UAAU,GAAG,IAAAC,mDAAwB,EAAEX,UAAW,CAAC;EAEzD,MAAMY,UAAU,GAAG;IAClB,GAAGJ,WAAW,CAACK,KAAK;IACpB,GAAGH,UAAU,CAACG;EACf,CAAC;EAED,MAAMC,YAAY,GAAG,IAAAC,aAAI,EACxB,4BAA4B,EAC5BL,UAAU,CAACM,SAAS,EACpBR,WAAW,CAACQ,SACb,CAAC;EACD,MAAMC,OAAO,GAAGhB,IAAI,KAAK,UAAU,GAAG,UAAU,GAAG,OAAO;EAE1D,MAAMiB,UAAU,GAAGC,0BAAa,CAACpB,IAAI,CAAC,CAAC;EAEvC,IAAK,QAAQ,KAAKE,IAAI,EAAG;IACxB,oBAAO,IAAAT,WAAA,CAAA4B,GAAA;MAAOnB,IAAI,EAAGA,IAAM;MAACC,IAAI,EAAGA,IAAM;MAACK,KAAK,EAAGA;IAAO,CAAE,CAAC;EAC7D;EAEA,oBACC,IAAAf,WAAA,CAAA4B,GAAA;IAAA,GAAUF,UAAU;IAAAG,QAAA,eAEnB,IAAA7B,WAAA,CAAA8B,IAAA;MACCN,SAAS,EAAG,IAAAD,aAAI,EAAE,4BAA4B,EAAE;QAC/C,iBAAiB,EAAEX;MACpB,CAAE,CAAG;MAAAiB,QAAA,gBAEL,IAAA7B,WAAA,CAAA4B,GAAA;QAAMJ,SAAS,EAAC,oCAAoC;QAAAK,QAAA,eACnD,IAAA7B,WAAA,CAAA4B,GAAA,EAAC9B,YAAA,CAAAiC,QAAQ,CAACC,OAAO;UAACjB,KAAK,EAAGJ;QAAO,CAAE;MAAC,CAC/B,CAAC,eACP,IAAAX,WAAA,CAAA4B,GAAA,EAACH,OAAO;QACPD,SAAS,EAAGF,YAAc;QAC1Bb,IAAI,EAAG,UAAU,KAAKA,IAAI,GAAGwB,SAAS,GAAGxB,IAAM;QAC/CC,IAAI,EAAGA,IAAI,IAAIT,gBAAgB,CAAEU,KAAM,CAAG;QAC1CE,QAAQ,EAAGA,QAAU;QACrB,iBAAgBA,QAAU;QAC1BC,WAAW,EAAGA,WAAW,IAAImB,SAAW;QACxCZ,KAAK,EAAGD;MAAY,CACpB,CAAC;IAAA,CACI;EAAC,CAEJ,CAAC;AAER","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_removeAccents","_blockEditor","_dom","_jsxRuntime","getNameFromLabel","content","removeAccents","stripHTML","replace","toLowerCase","save","attributes","type","name","label","inlineLabel","required","placeholder","value","borderProps","getBorderClassesAndStyles","colorProps","getColorClassesAndStyles","inputStyle","style","inputClasses","clsx","className","TagName","blockProps","useBlockProps","isCheckboxOrRadio","jsx","children","jsxs","RichText","Content","undefined"],"sources":["@wordpress/block-library/src/form-input/save.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tRichText,\n\tuseBlockProps,\n\t__experimentalGetBorderClassesAndStyles as getBorderClassesAndStyles,\n\t__experimentalGetColorClassesAndStyles as getColorClassesAndStyles,\n} from '@wordpress/block-editor';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\n/**\n * Get the name attribute from a content string.\n *\n * @param {string} content The block content.\n *\n * @return {string} Returns the slug.\n */\nconst getNameFromLabel = ( content ) => {\n\treturn (\n\t\tremoveAccents( stripHTML( content ) )\n\t\t\t// Convert anything that's not a letter or number to a hyphen.\n\t\t\t.replace( /[^\\p{L}\\p{N}]+/gu, '-' )\n\t\t\t// Convert to lowercase\n\t\t\t.toLowerCase()\n\t\t\t// Remove any remaining leading or trailing hyphens.\n\t\t\t.replace( /(^-+)|(-+$)/g, '' )\n\t);\n};\n\nexport default function save( { attributes } ) {\n\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\tattributes;\n\n\tconst borderProps = getBorderClassesAndStyles( attributes );\n\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\tconst inputStyle = {\n\t\t...borderProps.style,\n\t\t...colorProps.style,\n\t};\n\n\tconst inputClasses = clsx(\n\t\t'wp-block-form-input__input',\n\t\tcolorProps.className,\n\t\tborderProps.className\n\t);\n\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\tconst blockProps = useBlockProps.save();\n\n\t// Note: radio inputs aren't implemented yet.\n\tconst isCheckboxOrRadio = type === 'checkbox' || type === 'radio';\n\n\tif ( 'hidden' === type ) {\n\t\treturn <input type={ type } name={ name } value={ value } />;\n\t}\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t{ /* eslint-disable jsx-a11y/label-has-associated-control */ }\n\t\t\t<label\n\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t'is-label-inline': inlineLabel,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ ! isCheckboxOrRadio && (\n\t\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t<TagName\n\t\t\t\t\tclassName={ inputClasses }\n\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\tname={ name || getNameFromLabel( label ) }\n\t\t\t\t\trequired={ required }\n\t\t\t\t\taria-required={ required }\n\t\t\t\t\tplaceholder={ placeholder || undefined }\n\t\t\t\t\tstyle={ inputStyle }\n\t\t\t\t/>\n\t\t\t\t{ isCheckboxOrRadio && (\n\t\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t</label>\n\t\t\t{ /* eslint-enable jsx-a11y/label-has-associated-control */ }\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAF,sBAAA,CAAAC,OAAA;AAKA,IAAAE,YAAA,GAAAF,OAAA;AAMA,IAAAG,IAAA,GAAAH,OAAA;AAAkE,IAAAI,WAAA,GAAAJ,OAAA;AAflE;AACA;AACA;;AAIA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,MAAMK,gBAAgB,GAAKC,OAAO,IAAM;EACvC,OACC,IAAAC,sBAAa,EAAE,IAAAC,wBAAS,EAAEF,OAAQ,CAAE;EACnC;EAAA,CACCG,OAAO,CAAE,kBAAkB,EAAE,GAAI;EAClC;EAAA,CACCC,WAAW,CAAC;EACb;EAAA,CACCD,OAAO,CAAE,cAAc,EAAE,EAAG,CAAC;AAEjC,CAAC;AAEc,SAASE,IAAIA,CAAE;EAAEC;AAAW,CAAC,EAAG;EAC9C,MAAM;IAAEC,IAAI;IAAEC,IAAI;IAAEC,KAAK;IAAEC,WAAW;IAAEC,QAAQ;IAAEC,WAAW;IAAEC;EAAM,CAAC,GACrEP,UAAU;EAEX,MAAMQ,WAAW,GAAG,IAAAC,oDAAyB,EAAET,UAAW,CAAC;EAC3D,MAAMU,UAAU,GAAG,IAAAC,mDAAwB,EAAEX,UAAW,CAAC;EAEzD,MAAMY,UAAU,GAAG;IAClB,GAAGJ,WAAW,CAACK,KAAK;IACpB,GAAGH,UAAU,CAACG;EACf,CAAC;EAED,MAAMC,YAAY,GAAG,IAAAC,aAAI,EACxB,4BAA4B,EAC5BL,UAAU,CAACM,SAAS,EACpBR,WAAW,CAACQ,SACb,CAAC;EACD,MAAMC,OAAO,GAAGhB,IAAI,KAAK,UAAU,GAAG,UAAU,GAAG,OAAO;EAE1D,MAAMiB,UAAU,GAAGC,0BAAa,CAACpB,IAAI,CAAC,CAAC;;EAEvC;EACA,MAAMqB,iBAAiB,GAAGnB,IAAI,KAAK,UAAU,IAAIA,IAAI,KAAK,OAAO;EAEjE,IAAK,QAAQ,KAAKA,IAAI,EAAG;IACxB,oBAAO,IAAAT,WAAA,CAAA6B,GAAA;MAAOpB,IAAI,EAAGA,IAAM;MAACC,IAAI,EAAGA,IAAM;MAACK,KAAK,EAAGA;IAAO,CAAE,CAAC;EAC7D;EAEA,oBACC,IAAAf,WAAA,CAAA6B,GAAA;IAAA,GAAUH,UAAU;IAAAI,QAAA,eAEnB,IAAA9B,WAAA,CAAA+B,IAAA;MACCP,SAAS,EAAG,IAAAD,aAAI,EAAE,4BAA4B,EAAE;QAC/C,iBAAiB,EAAEX;MACpB,CAAE,CAAG;MAAAkB,QAAA,GAEH,CAAEF,iBAAiB,iBACpB,IAAA5B,WAAA,CAAA6B,GAAA;QAAML,SAAS,EAAC,oCAAoC;QAAAM,QAAA,eACnD,IAAA9B,WAAA,CAAA6B,GAAA,EAAC/B,YAAA,CAAAkC,QAAQ,CAACC,OAAO;UAAClB,KAAK,EAAGJ;QAAO,CAAE;MAAC,CAC/B,CACN,eACD,IAAAX,WAAA,CAAA6B,GAAA,EAACJ,OAAO;QACPD,SAAS,EAAGF,YAAc;QAC1Bb,IAAI,EAAG,UAAU,KAAKA,IAAI,GAAGyB,SAAS,GAAGzB,IAAM;QAC/CC,IAAI,EAAGA,IAAI,IAAIT,gBAAgB,CAAEU,KAAM,CAAG;QAC1CE,QAAQ,EAAGA,QAAU;QACrB,iBAAgBA,QAAU;QAC1BC,WAAW,EAAGA,WAAW,IAAIoB,SAAW;QACxCb,KAAK,EAAGD;MAAY,CACpB,CAAC,EACAQ,iBAAiB,iBAClB,IAAA5B,WAAA,CAAA6B,GAAA;QAAML,SAAS,EAAC,oCAAoC;QAAAM,QAAA,eACnD,IAAA9B,WAAA,CAAA6B,GAAA,EAAC/B,YAAA,CAAAkC,QAAQ,CAACC,OAAO;UAAClB,KAAK,EAAGJ;QAAO,CAAE;MAAC,CAC/B,CACN;IAAA,CACK;EAAC,CAEJ,CAAC;AAER","ignoreList":[]}

package/build/freeform/modal.js

@@ -25,10 +25,8 @@ function ModalAuxiliaryActions({
   if (isMobileViewport) {
     return null;
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
-  // TODO: Switch to `true` (40px size) if possible
-  , {
-    __next40pxDefaultSize: false,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+    size: "small",
     onClick: onClick,
     icon: _icons.fullscreen,
     isPressed: isModalFullScreen,
@@ -114,19 +112,15 @@ function ModalEdit(props) {
         justify: "flex-end",
         expanded: false,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
-          // TODO: Switch to `true` (40px size) if possible
-          , {
-            __next40pxDefaultSize: false,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+            __next40pxDefaultSize: true,
             variant: "tertiary",
             onClick: onClose,
             children: (0, _i18n.__)('Cancel')
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
-          // TODO: Switch to `true` (40px size) if possible
-          , {
-            __next40pxDefaultSize: false,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+            __next40pxDefaultSize: true,
             variant: "primary",
             onClick: () => {
               setAttributes({

package/build/freeform/modal.js.map

@@ -1 +1 @@
-{"version":3,"names":["_blockEditor","require","_components","_element","_i18n","_data","_icons","_compose","_jsxRuntime","ModalAuxiliaryActions","onClick","isModalFullScreen","isMobileViewport","useViewportMatch","jsx","Button","__next40pxDefaultSize","icon","fullscreen","isPressed","label","__","ClassicEdit","props","styles","useSelect","select","store","getSettings","useEffect","baseURL","suffix","settings","window","wpEditorL10n","tinymce","EditorManager","overrideDefaults","base_url","wp","oldEditor","initialize","id","setup","editor","on","doc","getDoc","forEach","css","styleEl","createElement","innerHTML","head","appendChild","remove","ModalEdit","clientId","attributes","content","setAttributes","onReplace","isOpen","setOpen","useState","setIsModalFullScreen","onClose","jsxs","Fragment","children","BlockControls","ToolbarGroup","ToolbarButton","RawHTML","Modal","title","onRequestClose","shouldCloseOnClickOutside","overlayClassName","isFullScreen","className","headerActions","defaultValue","Flex","justify","expanded","FlexItem","variant","getContent"],"sources":["@wordpress/block-library/src/freeform/modal.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { BlockControls, store } from '@wordpress/block-editor';\nimport {\n\tToolbarGroup,\n\tToolbarButton,\n\tModal,\n\tButton,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { useEffect, useState, RawHTML } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { fullscreen } from '@wordpress/icons';\nimport { useViewportMatch } from '@wordpress/compose';\n\nfunction ModalAuxiliaryActions( { onClick, isModalFullScreen } ) {\n\t// 'small' to match the rules in editor.scss.\n\tconst isMobileViewport = useViewportMatch( 'small', '<' );\n\tif ( isMobileViewport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Button\n\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t__next40pxDefaultSize={ false }\n\t\t\tonClick={ onClick }\n\t\t\ticon={ fullscreen }\n\t\t\tisPressed={ isModalFullScreen }\n\t\t\tlabel={\n\t\t\t\tisModalFullScreen\n\t\t\t\t\t? __( 'Exit fullscreen' )\n\t\t\t\t\t: __( 'Enter fullscreen' )\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction ClassicEdit( props ) {\n\tconst styles = useSelect(\n\t\t( select ) => select( store ).getSettings().styles\n\t);\n\tuseEffect( () => {\n\t\tconst { baseURL, suffix, settings } = window.wpEditorL10n.tinymce;\n\n\t\twindow.tinymce.EditorManager.overrideDefaults( {\n\t\t\tbase_url: baseURL,\n\t\t\tsuffix,\n\t\t} );\n\n\t\twindow.wp.oldEditor.initialize( props.id, {\n\t\t\ttinymce: {\n\t\t\t\t...settings,\n\t\t\t\tsetup( editor ) {\n\t\t\t\t\teditor.on( 'init', () => {\n\t\t\t\t\t\tconst doc = editor.getDoc();\n\t\t\t\t\t\tstyles.forEach( ( { css } ) => {\n\t\t\t\t\t\t\tconst styleEl = doc.createElement( 'style' );\n\t\t\t\t\t\t\tstyleEl.innerHTML = css;\n\t\t\t\t\t\t\tdoc.head.appendChild( styleEl );\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\n\t\treturn () => {\n\t\t\twindow.wp.oldEditor.remove( props.id );\n\t\t};\n\t}, [] );\n\n\treturn <textarea { ...props } />;\n}\n\nexport default function ModalEdit( props ) {\n\tconst {\n\t\tclientId,\n\t\tattributes: { content },\n\t\tsetAttributes,\n\t\tonReplace,\n\t} = props;\n\tconst [ isOpen, setOpen ] = useState( false );\n\tconst [ isModalFullScreen, setIsModalFullScreen ] = useState( false );\n\tconst id = `editor-${ clientId }`;\n\n\tconst onClose = () => ( content ? setOpen( false ) : onReplace( [] ) );\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls>\n\t\t\t\t<ToolbarGroup>\n\t\t\t\t\t<ToolbarButton onClick={ () => setOpen( true ) }>\n\t\t\t\t\t\t{ __( 'Edit' ) }\n\t\t\t\t\t</ToolbarButton>\n\t\t\t\t</ToolbarGroup>\n\t\t\t</BlockControls>\n\t\t\t{ content && <RawHTML>{ content }</RawHTML> }\n\t\t\t{ ( isOpen || ! content ) && (\n\t\t\t\t<Modal\n\t\t\t\t\ttitle={ __( 'Classic Editor' ) }\n\t\t\t\t\tonRequestClose={ onClose }\n\t\t\t\t\tshouldCloseOnClickOutside={ false }\n\t\t\t\t\toverlayClassName=\"block-editor-freeform-modal\"\n\t\t\t\t\tisFullScreen={ isModalFullScreen }\n\t\t\t\t\tclassName=\"block-editor-freeform-modal__content\"\n\t\t\t\t\theaderActions={\n\t\t\t\t\t\t<ModalAuxiliaryActions\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetIsModalFullScreen( ! isModalFullScreen )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tisModalFullScreen={ isModalFullScreen }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<ClassicEdit id={ id } defaultValue={ content } />\n\t\t\t\t\t<Flex\n\t\t\t\t\t\tclassName=\"block-editor-freeform-modal__actions\"\n\t\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tcontent:\n\t\t\t\t\t\t\t\t\t\t\twindow.wp.oldEditor.getContent(\n\t\t\t\t\t\t\t\t\t\t\t\tid\n\t\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\tsetOpen( false );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Save' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t</Flex>\n\t\t\t\t</Modal>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_blockEditor","require","_components","_element","_i18n","_data","_icons","_compose","_jsxRuntime","ModalAuxiliaryActions","onClick","isModalFullScreen","isMobileViewport","useViewportMatch","jsx","Button","size","icon","fullscreen","isPressed","label","__","ClassicEdit","props","styles","useSelect","select","store","getSettings","useEffect","baseURL","suffix","settings","window","wpEditorL10n","tinymce","EditorManager","overrideDefaults","base_url","wp","oldEditor","initialize","id","setup","editor","on","doc","getDoc","forEach","css","styleEl","createElement","innerHTML","head","appendChild","remove","ModalEdit","clientId","attributes","content","setAttributes","onReplace","isOpen","setOpen","useState","setIsModalFullScreen","onClose","jsxs","Fragment","children","BlockControls","ToolbarGroup","ToolbarButton","RawHTML","Modal","title","onRequestClose","shouldCloseOnClickOutside","overlayClassName","isFullScreen","className","headerActions","defaultValue","Flex","justify","expanded","FlexItem","__next40pxDefaultSize","variant","getContent"],"sources":["@wordpress/block-library/src/freeform/modal.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { BlockControls, store } from '@wordpress/block-editor';\nimport {\n\tToolbarGroup,\n\tToolbarButton,\n\tModal,\n\tButton,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { useEffect, useState, RawHTML } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { fullscreen } from '@wordpress/icons';\nimport { useViewportMatch } from '@wordpress/compose';\n\nfunction ModalAuxiliaryActions( { onClick, isModalFullScreen } ) {\n\t// 'small' to match the rules in editor.scss.\n\tconst isMobileViewport = useViewportMatch( 'small', '<' );\n\tif ( isMobileViewport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Button\n\t\t\tsize=\"small\"\n\t\t\tonClick={ onClick }\n\t\t\ticon={ fullscreen }\n\t\t\tisPressed={ isModalFullScreen }\n\t\t\tlabel={\n\t\t\t\tisModalFullScreen\n\t\t\t\t\t? __( 'Exit fullscreen' )\n\t\t\t\t\t: __( 'Enter fullscreen' )\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction ClassicEdit( props ) {\n\tconst styles = useSelect(\n\t\t( select ) => select( store ).getSettings().styles\n\t);\n\tuseEffect( () => {\n\t\tconst { baseURL, suffix, settings } = window.wpEditorL10n.tinymce;\n\n\t\twindow.tinymce.EditorManager.overrideDefaults( {\n\t\t\tbase_url: baseURL,\n\t\t\tsuffix,\n\t\t} );\n\n\t\twindow.wp.oldEditor.initialize( props.id, {\n\t\t\ttinymce: {\n\t\t\t\t...settings,\n\t\t\t\tsetup( editor ) {\n\t\t\t\t\teditor.on( 'init', () => {\n\t\t\t\t\t\tconst doc = editor.getDoc();\n\t\t\t\t\t\tstyles.forEach( ( { css } ) => {\n\t\t\t\t\t\t\tconst styleEl = doc.createElement( 'style' );\n\t\t\t\t\t\t\tstyleEl.innerHTML = css;\n\t\t\t\t\t\t\tdoc.head.appendChild( styleEl );\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\n\t\treturn () => {\n\t\t\twindow.wp.oldEditor.remove( props.id );\n\t\t};\n\t}, [] );\n\n\treturn <textarea { ...props } />;\n}\n\nexport default function ModalEdit( props ) {\n\tconst {\n\t\tclientId,\n\t\tattributes: { content },\n\t\tsetAttributes,\n\t\tonReplace,\n\t} = props;\n\tconst [ isOpen, setOpen ] = useState( false );\n\tconst [ isModalFullScreen, setIsModalFullScreen ] = useState( false );\n\tconst id = `editor-${ clientId }`;\n\n\tconst onClose = () => ( content ? setOpen( false ) : onReplace( [] ) );\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls>\n\t\t\t\t<ToolbarGroup>\n\t\t\t\t\t<ToolbarButton onClick={ () => setOpen( true ) }>\n\t\t\t\t\t\t{ __( 'Edit' ) }\n\t\t\t\t\t</ToolbarButton>\n\t\t\t\t</ToolbarGroup>\n\t\t\t</BlockControls>\n\t\t\t{ content && <RawHTML>{ content }</RawHTML> }\n\t\t\t{ ( isOpen || ! content ) && (\n\t\t\t\t<Modal\n\t\t\t\t\ttitle={ __( 'Classic Editor' ) }\n\t\t\t\t\tonRequestClose={ onClose }\n\t\t\t\t\tshouldCloseOnClickOutside={ false }\n\t\t\t\t\toverlayClassName=\"block-editor-freeform-modal\"\n\t\t\t\t\tisFullScreen={ isModalFullScreen }\n\t\t\t\t\tclassName=\"block-editor-freeform-modal__content\"\n\t\t\t\t\theaderActions={\n\t\t\t\t\t\t<ModalAuxiliaryActions\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetIsModalFullScreen( ! isModalFullScreen )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tisModalFullScreen={ isModalFullScreen }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<ClassicEdit id={ id } defaultValue={ content } />\n\t\t\t\t\t<Flex\n\t\t\t\t\t\tclassName=\"block-editor-freeform-modal__actions\"\n\t\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tcontent:\n\t\t\t\t\t\t\t\t\t\t\twindow.wp.oldEditor.getContent(\n\t\t\t\t\t\t\t\t\t\t\t\tid\n\t\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\tsetOpen( false );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Save' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t</Flex>\n\t\t\t\t</Modal>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/image/edit.js

@@ -20,6 +20,8 @@ var _compose = require("@wordpress/compose");
 var _lockUnlock = require("../lock-unlock");
 var _hooks = require("../utils/hooks");
 var _image = _interopRequireDefault(require("./image"));
+var _utils = require("./utils");
+var _useMaxWidthObserver = require("./use-max-width-observer");
 var _constants = require("./constants");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
@@ -95,9 +97,16 @@ function ImageEdit({
     metadata
   } = attributes;
   const [temporaryURL, setTemporaryURL] = (0, _element.useState)(attributes.blob);
-  const [contentResizeListener, {
-    width: containerWidth
+  const containerRef = (0, _element.useRef)();
+  // Only observe the max width from the parent container when the parent layout is not flex nor grid.
+  // This won't work for them because the container width changes with the image.
+  // TODO: Find a way to observe the container width for flex and grid layouts.
+  const isMaxWidthContainerWidth = !parentLayout || parentLayout.type !== 'flex' && parentLayout.type !== 'grid';
+  const [maxWidthObserver, maxContentWidth] = (0, _useMaxWidthObserver.useMaxWidthObserver)();
+  const [placeholderResizeListener, {
+    width: placeholderWidth
   }] = (0, _compose.useResizeObserver)();
+  const isSmallContainer = placeholderWidth && placeholderWidth < 160;
   const altRef = (0, _element.useRef)();
   (0, _element.useEffect)(() => {
     altRef.current = alt;
@@ -107,7 +116,8 @@ function ImageEdit({
     captionRef.current = caption;
   }, [caption]);
   const {
-    __unstableMarkNextChangeAsNotPersistent
+    __unstableMarkNextChangeAsNotPersistent,
+    replaceBlock
   } = (0, _data.useDispatch)(_blockEditor.store);
   (0, _element.useEffect)(() => {
     if (['wide', 'full'].includes(align)) {
@@ -121,7 +131,10 @@ function ImageEdit({
     }
   }, [__unstableMarkNextChangeAsNotPersistent, align, setAttributes]);
   const {
-    getSettings
+    getSettings,
+    getBlockRootClientId,
+    getBlockName,
+    canInsertBlockType
   } = (0, _data.useSelect)(_blockEditor.store);
   const blockEditingMode = (0, _blockEditor.useBlockEditingMode)();
   const {
@@ -138,7 +151,35 @@ function ImageEdit({
       blob: undefined
     });
   }
+  function onSelectImagesList(images) {
+    const win = containerRef.current?.ownerDocument.defaultView;
+    if (images.every(file => file instanceof win.File)) {
+      /** @type {File[]} */
+      const files = images;
+      const rootClientId = getBlockRootClientId(clientId);
+      if (files.some(file => !(0, _utils.isValidFileType)(file))) {
+        // Copied from the same notice in the gallery block.
+        createErrorNotice((0, _i18n.__)('If uploading to a gallery all files need to be image formats'), {
+          id: 'gallery-upload-invalid-file',
+          type: 'snackbar'
+        });
+      }
+      const imageBlocks = files.filter(file => (0, _utils.isValidFileType)(file)).map(file => (0, _blocks.createBlock)('core/image', {
+        blob: (0, _blob.createBlobURL)(file)
+      }));
+      if (getBlockName(rootClientId) === 'core/gallery') {
+        replaceBlock(clientId, imageBlocks);
+      } else if (canInsertBlockType('core/gallery', rootClientId)) {
+        const galleryBlock = (0, _blocks.createBlock)('core/gallery', {}, imageBlocks);
+        replaceBlock(clientId, galleryBlock);
+      }
+    }
+  }
   function onSelectImage(media) {
+    if (Array.isArray(media)) {
+      onSelectImagesList(media);
+      return;
+    }
     if (!media || !media.url) {
       setAttributes({
         url: undefined,
@@ -269,6 +310,7 @@ function ImageEdit({
     'has-custom-border': !!borderProps.className || borderProps.style && Object.keys(borderProps.style).length > 0
   });
   const blockProps = (0, _blockEditor.useBlockProps)({
+    ref: containerRef,
     className: classes
   });
 
@@ -292,14 +334,14 @@ function ImageEdit({
     };
   }, [context, isSingleSelected, metadata?.bindings?.url]);
   const placeholder = content => {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Placeholder, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.Placeholder, {
       className: (0, _clsx.default)('block-editor-media-placeholder', {
         [borderProps.className]: !!borderProps.className && !isSingleSelected
       }),
-      withIllustration: true,
-      icon: lockUrlControls ? _icons.plugins : _icons.image,
-      label: (0, _i18n.__)('Image'),
-      instructions: !lockUrlControls && (0, _i18n.__)('Upload an image file, pick one from your media library, or add one with a URL.'),
+      icon: !isSmallContainer && (lockUrlControls ? _icons.plugins : _icons.image),
+      withIllustration: !isSingleSelected || isSmallContainer,
+      label: !isSmallContainer && (0, _i18n.__)('Image'),
+      instructions: !lockUrlControls && !isSmallContainer && (0, _i18n.__)('Upload or drag an image file here, or pick one from your library.'),
       style: {
         aspectRatio: !(width && height) && aspectRatio ? aspectRatio : undefined,
         width: height && aspectRatio ? '100%' : width,
@@ -308,10 +350,7 @@ function ImageEdit({
         ...borderProps.style,
         ...shadowProps.style
       },
-      children: lockUrlControls ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: "block-bindings-media-placeholder-message",
-        children: lockUrlControlsMessage
-      }) : content
+      children: [lockUrlControls && !isSmallContainer && lockUrlControlsMessage, !lockUrlControls && !isSmallContainer && content, placeholderResizeListener]
     });
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
@@ -331,7 +370,7 @@ function ImageEdit({
         clientId: clientId,
         blockEditingMode: blockEditingMode,
         parentLayoutType: parentLayout?.type,
-        containerWidth: containerWidth
+        maxContentWidth: maxContentWidth
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.MediaPlaceholder, {
         icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.BlockIcon, {
           icon: _icons.image
@@ -342,6 +381,7 @@ function ImageEdit({
         placeholder: placeholder,
         accept: "image/*",
         allowedTypes: _constants.ALLOWED_MEDIA_TYPES,
+        handleUpload: files => files.length === 1,
         value: {
           id,
           src
@@ -352,7 +392,7 @@ function ImageEdit({
     }),
     // The listener cannot be placed as the first element as it will break the in-between inserter.
     // See https://github.com/WordPress/gutenberg/blob/71134165868298fc15e22896d0c28b41b3755ff7/packages/block-editor/src/components/block-list/use-in-between-inserter.js#L120
-    contentResizeListener]
+    isSingleSelected && isMaxWidthContainerWidth && maxWidthObserver]
   });
 }
 var _default = exports.default = ImageEdit;