@wordpress/block-editor 12.10.3 → 12.11.0

package/build/components/colors-gradients/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_control","WithToolsPanelItem","setting","children","panelId","props","clearValue","colorValue","onColorChange","gradientValue","onGradientChange","_element","createElement","__experimentalToolsPanelItem","hasValue","label","onDeselect","isShownByDefault","undefined","className","resetAllFilter","LabeledColorIndicator","__experimentalHStack","justify","ColorIndicator","FlexItem","title","renderToggle","settings","onToggle","isOpen","toggleProps","onClick","classnames","Button","ColorGradientSettingsDropdown","colors","disableCustomColors","disableCustomGradients","enableAlpha","gradients","__experimentalIsRenderedInSidebar","popoverProps","placement","offset","shift","Fragment","map","index","_setting$gradientValu","controlProps","clearable","showTitle","toggleSettings","key","Dropdown","renderContent","__experimentalDropdownContentWrapper","paddingSize","default"],"sources":["@wordpress/block-editor/src/components/colors-gradients/dropdown.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tColorIndicator,\n\tDropdown,\n\tFlexItem,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\t__experimentalHStack as HStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientControl from './control';\n\n// When the `ColorGradientSettingsDropdown` controls are being rendered to a\n// `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.\nconst WithToolsPanelItem = ( { setting, children, panelId, ...props } ) => {\n\tconst clearValue = () => {\n\t\tif ( setting.colorValue ) {\n\t\t\tsetting.onColorChange();\n\t\t} else if ( setting.gradientValue ) {\n\t\t\tsetting.onGradientChange();\n\t\t}\n\t};\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => {\n\t\t\t\treturn !! setting.colorValue || !! setting.gradientValue;\n\t\t\t} }\n\t\t\tlabel={ setting.label }\n\t\t\tonDeselect={ clearValue }\n\t\t\tisShownByDefault={\n\t\t\t\tsetting.isShownByDefault !== undefined\n\t\t\t\t\t? setting.isShownByDefault\n\t\t\t\t\t: true\n\t\t\t}\n\t\t\t{ ...props }\n\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__item\"\n\t\t\tpanelId={ panelId }\n\t\t\t// Pass resetAllFilter if supplied due to rendering via SlotFill\n\t\t\t// into parent ToolsPanel.\n\t\t\tresetAllFilter={ setting.resetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanelItem>\n\t);\n};\n\nconst LabeledColorIndicator = ( { colorValue, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ColorIndicator\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-indicator\"\n\t\t\tcolorValue={ colorValue }\n\t\t/>\n\t\t<FlexItem\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-name\"\n\t\t\ttitle={ label }\n\t\t>\n\t\t\t{ label }\n\t\t</FlexItem>\n\t</HStack>\n);\n\n// Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`\n// or as a `Button` if it isn't e.g. the controls are being rendered in\n// a `ToolsPanel`.\nconst renderToggle =\n\t( settings ) =>\n\t( { onToggle, isOpen } ) => {\n\t\tconst { colorValue, label } = settings;\n\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings__dropdown',\n\t\t\t\t{ 'is-open': isOpen }\n\t\t\t),\n\t\t\t'aria-expanded': isOpen,\n\t\t};\n\n\t\treturn (\n\t\t\t<Button { ...toggleProps }>\n\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\tcolorValue={ colorValue }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t);\n\t};\n\n// Renders a collection of color controls as dropdowns. Depending upon the\n// context in which these dropdowns are being rendered, they may be wrapped\n// in an `ItemGroup` with each dropdown's toggle as an `Item`, or alternatively,\n// the may be individually wrapped in a `ToolsPanelItem` with the toggle as\n// a regular `Button`.\n//\n// For more context see: https://github.com/WordPress/gutenberg/pull/40084\nexport default function ColorGradientSettingsDropdown( {\n\tcolors,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tenableAlpha,\n\tgradients,\n\tsettings,\n\t__experimentalIsRenderedInSidebar,\n\t...props\n} ) {\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tpopoverProps = {\n\t\t\tplacement: 'left-start',\n\t\t\toffset: 36,\n\t\t\tshift: true,\n\t\t};\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ settings.map( ( setting, index ) => {\n\t\t\t\tconst controlProps = {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tcolorValue: setting.colorValue,\n\t\t\t\t\tcolors,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t\tgradientValue: setting.gradientValue,\n\t\t\t\t\tgradients,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t\tonColorChange: setting.onColorChange,\n\t\t\t\t\tonGradientChange: setting.onGradientChange,\n\t\t\t\t\tshowTitle: false,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\t...setting,\n\t\t\t\t};\n\t\t\t\tconst toggleSettings = {\n\t\t\t\t\tcolorValue: setting.gradientValue ?? setting.colorValue,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\tsetting && (\n\t\t\t\t\t\t// If not in an `ItemGroup` wrap the dropdown in a\n\t\t\t\t\t\t// `ToolsPanelItem`\n\t\t\t\t\t\t<WithToolsPanelItem\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tsetting={ setting }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__dropdown\"\n\t\t\t\t\t\t\t\trenderToggle={ renderToggle( toggleSettings ) }\n\t\t\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-panel-color-gradient-settings__dropdown-content\">\n\t\t\t\t\t\t\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\t\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</WithToolsPanelItem>\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_control","WithToolsPanelItem","setting","children","panelId","props","clearValue","colorValue","onColorChange","gradientValue","onGradientChange","_react","createElement","__experimentalToolsPanelItem","hasValue","label","onDeselect","isShownByDefault","undefined","className","resetAllFilter","LabeledColorIndicator","__experimentalHStack","justify","ColorIndicator","FlexItem","title","renderToggle","settings","onToggle","isOpen","toggleProps","onClick","classnames","Button","ColorGradientSettingsDropdown","colors","disableCustomColors","disableCustomGradients","enableAlpha","gradients","__experimentalIsRenderedInSidebar","popoverProps","placement","offset","shift","Fragment","map","index","_setting$gradientValu","controlProps","clearable","showTitle","toggleSettings","key","Dropdown","renderContent","__experimentalDropdownContentWrapper","paddingSize","default"],"sources":["@wordpress/block-editor/src/components/colors-gradients/dropdown.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tColorIndicator,\n\tDropdown,\n\tFlexItem,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\t__experimentalHStack as HStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientControl from './control';\n\n// When the `ColorGradientSettingsDropdown` controls are being rendered to a\n// `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.\nconst WithToolsPanelItem = ( { setting, children, panelId, ...props } ) => {\n\tconst clearValue = () => {\n\t\tif ( setting.colorValue ) {\n\t\t\tsetting.onColorChange();\n\t\t} else if ( setting.gradientValue ) {\n\t\t\tsetting.onGradientChange();\n\t\t}\n\t};\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => {\n\t\t\t\treturn !! setting.colorValue || !! setting.gradientValue;\n\t\t\t} }\n\t\t\tlabel={ setting.label }\n\t\t\tonDeselect={ clearValue }\n\t\t\tisShownByDefault={\n\t\t\t\tsetting.isShownByDefault !== undefined\n\t\t\t\t\t? setting.isShownByDefault\n\t\t\t\t\t: true\n\t\t\t}\n\t\t\t{ ...props }\n\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__item\"\n\t\t\tpanelId={ panelId }\n\t\t\t// Pass resetAllFilter if supplied due to rendering via SlotFill\n\t\t\t// into parent ToolsPanel.\n\t\t\tresetAllFilter={ setting.resetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanelItem>\n\t);\n};\n\nconst LabeledColorIndicator = ( { colorValue, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ColorIndicator\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-indicator\"\n\t\t\tcolorValue={ colorValue }\n\t\t/>\n\t\t<FlexItem\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-name\"\n\t\t\ttitle={ label }\n\t\t>\n\t\t\t{ label }\n\t\t</FlexItem>\n\t</HStack>\n);\n\n// Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`\n// or as a `Button` if it isn't e.g. the controls are being rendered in\n// a `ToolsPanel`.\nconst renderToggle =\n\t( settings ) =>\n\t( { onToggle, isOpen } ) => {\n\t\tconst { colorValue, label } = settings;\n\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings__dropdown',\n\t\t\t\t{ 'is-open': isOpen }\n\t\t\t),\n\t\t\t'aria-expanded': isOpen,\n\t\t};\n\n\t\treturn (\n\t\t\t<Button { ...toggleProps }>\n\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\tcolorValue={ colorValue }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t);\n\t};\n\n// Renders a collection of color controls as dropdowns. Depending upon the\n// context in which these dropdowns are being rendered, they may be wrapped\n// in an `ItemGroup` with each dropdown's toggle as an `Item`, or alternatively,\n// the may be individually wrapped in a `ToolsPanelItem` with the toggle as\n// a regular `Button`.\n//\n// For more context see: https://github.com/WordPress/gutenberg/pull/40084\nexport default function ColorGradientSettingsDropdown( {\n\tcolors,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tenableAlpha,\n\tgradients,\n\tsettings,\n\t__experimentalIsRenderedInSidebar,\n\t...props\n} ) {\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tpopoverProps = {\n\t\t\tplacement: 'left-start',\n\t\t\toffset: 36,\n\t\t\tshift: true,\n\t\t};\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ settings.map( ( setting, index ) => {\n\t\t\t\tconst controlProps = {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tcolorValue: setting.colorValue,\n\t\t\t\t\tcolors,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t\tgradientValue: setting.gradientValue,\n\t\t\t\t\tgradients,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t\tonColorChange: setting.onColorChange,\n\t\t\t\t\tonGradientChange: setting.onGradientChange,\n\t\t\t\t\tshowTitle: false,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\t...setting,\n\t\t\t\t};\n\t\t\t\tconst toggleSettings = {\n\t\t\t\t\tcolorValue: setting.gradientValue ?? setting.colorValue,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\tsetting && (\n\t\t\t\t\t\t// If not in an `ItemGroup` wrap the dropdown in a\n\t\t\t\t\t\t// `ToolsPanelItem`\n\t\t\t\t\t\t<WithToolsPanelItem\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tsetting={ setting }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__dropdown\"\n\t\t\t\t\t\t\t\trenderToggle={ renderToggle( toggleSettings ) }\n\t\t\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-panel-color-gradient-settings__dropdown-content\">\n\t\t\t\t\t\t\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\t\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</WithToolsPanelItem>\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}

package/build/components/colors-gradients/panel-color-gradient-settings.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.PanelColorGradientSettingsInner = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _components = require("@wordpress/components");
 var _data = require("@wordpress/data");
@@ -45,7 +45,7 @@ const PanelColorGradientSettingsInner = ({
   if ((!colors || colors.length === 0) && (!gradients || gradients.length === 0) && disableCustomColors && disableCustomGradients && settings?.every(setting => (!setting.colors || setting.colors.length === 0) && (!setting.gradients || setting.gradients.length === 0) && (setting.disableCustomColors === undefined || setting.disableCustomColors) && (setting.disableCustomGradients === undefined || setting.disableCustomGradients))) {
     return null;
   }
-  return (0, _element.createElement)(_components.__experimentalToolsPanel, {
+  return (0, _react.createElement)(_components.__experimentalToolsPanel, {
     className: (0, _classnames.default)('block-editor-panel-color-gradient-settings', className),
     label: showTitle ? title : undefined,
     resetAll: () => {
@@ -67,7 +67,7 @@ const PanelColorGradientSettingsInner = ({
     panelId: panelId,
     __experimentalFirstVisibleItemClass: "first",
     __experimentalLastVisibleItemClass: "last"
-  }, (0, _element.createElement)(_dropdown.default, {
+  }, (0, _react.createElement)(_dropdown.default, {
     settings: settings,
     panelId: panelId,
     colors,
@@ -76,25 +76,25 @@ const PanelColorGradientSettingsInner = ({
     disableCustomGradients,
     __experimentalIsRenderedInSidebar,
     enableAlpha
-  }), !!children && (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.__experimentalSpacer, {
+  }), !!children && (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_components.__experimentalSpacer, {
     marginY: 4
   }), " ", children));
 };
 exports.PanelColorGradientSettingsInner = PanelColorGradientSettingsInner;
 const PanelColorGradientSettingsSelect = props => {
   const colorGradientSettings = (0, _useMultipleOriginColorsAndGradients.default)();
-  return (0, _element.createElement)(PanelColorGradientSettingsInner, {
+  return (0, _react.createElement)(PanelColorGradientSettingsInner, {
     ...colorGradientSettings,
     ...props
   });
 };
 const PanelColorGradientSettings = props => {
   if (colorsAndGradientKeys.every(key => props.hasOwnProperty(key))) {
-    return (0, _element.createElement)(PanelColorGradientSettingsInner, {
+    return (0, _react.createElement)(PanelColorGradientSettingsInner, {
       ...props
     });
   }
-  return (0, _element.createElement)(PanelColorGradientSettingsSelect, {
+  return (0, _react.createElement)(PanelColorGradientSettingsSelect, {
     ...props
   });
 };

package/build/components/colors-gradients/panel-color-gradient-settings.js.map

@@ -1 +1 @@
-{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_data","_compose","_dropdown","_useMultipleOriginColorsAndGradients","colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalIsRenderedInSidebar","enableAlpha","panelId","useInstanceId","batch","useRegistry","length","every","setting","undefined","_element","createElement","__experimentalToolsPanel","classnames","label","resetAll","forEach","colorValue","gradientValue","onColorChange","onGradientChange","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","default","Fragment","__experimentalSpacer","marginY","exports","PanelColorGradientSettingsSelect","props","colorGradientSettings","useColorsAndGradientsPalettes","PanelColorGradientSettings","key","hasOwnProperty","_default"],"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientSettingsDropdown from './dropdown';\nimport useColorsAndGradientsPalettes from './use-multiple-origin-colors-and-gradients';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nexport const PanelColorGradientSettingsInner = ( {\n\tclassName,\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tchildren,\n\tsettings,\n\ttitle,\n\tshowTitle = true,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\t( ! colors || colors.length === 0 ) &&\n\t\t( ! gradients || gradients.length === 0 ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tsettings?.every(\n\t\t\t( setting ) =>\n\t\t\t\t( ! setting.colors || setting.colors.length === 0 ) &&\n\t\t\t\t( ! setting.gradients || setting.gradients.length === 0 ) &&\n\t\t\t\t( setting.disableCustomColors === undefined ||\n\t\t\t\t\tsetting.disableCustomColors ) &&\n\t\t\t\t( setting.disableCustomGradients === undefined ||\n\t\t\t\t\tsetting.disableCustomGradients )\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tlabel={ showTitle ? title : undefined }\n\t\t\tresetAll={ () => {\n\t\t\t\tbatch( () => {\n\t\t\t\t\tsettings.forEach(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\tif ( colorValue ) {\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t\t} else if ( gradientValue ) {\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tpanelId={ panelId }\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t>\n\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\tsettings={ settings }\n\t\t\t\tpanelId={ panelId }\n\t\t\t\t{ ...{\n\t\t\t\t\tcolors,\n\t\t\t\t\tgradients,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ !! children && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer marginY={ 4 } /> { children }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n};\n\nconst PanelColorGradientSettingsSelect = ( props ) => {\n\tconst colorGradientSettings = useColorsAndGradientsPalettes();\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettings = ( props ) => {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"],"mappings":"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"}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_data","_compose","_dropdown","_useMultipleOriginColorsAndGradients","colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalIsRenderedInSidebar","enableAlpha","panelId","useInstanceId","batch","useRegistry","length","every","setting","undefined","_react","createElement","__experimentalToolsPanel","classnames","label","resetAll","forEach","colorValue","gradientValue","onColorChange","onGradientChange","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","default","Fragment","__experimentalSpacer","marginY","exports","PanelColorGradientSettingsSelect","props","colorGradientSettings","useColorsAndGradientsPalettes","PanelColorGradientSettings","key","hasOwnProperty","_default"],"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientSettingsDropdown from './dropdown';\nimport useColorsAndGradientsPalettes from './use-multiple-origin-colors-and-gradients';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nexport const PanelColorGradientSettingsInner = ( {\n\tclassName,\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tchildren,\n\tsettings,\n\ttitle,\n\tshowTitle = true,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\t( ! colors || colors.length === 0 ) &&\n\t\t( ! gradients || gradients.length === 0 ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tsettings?.every(\n\t\t\t( setting ) =>\n\t\t\t\t( ! setting.colors || setting.colors.length === 0 ) &&\n\t\t\t\t( ! setting.gradients || setting.gradients.length === 0 ) &&\n\t\t\t\t( setting.disableCustomColors === undefined ||\n\t\t\t\t\tsetting.disableCustomColors ) &&\n\t\t\t\t( setting.disableCustomGradients === undefined ||\n\t\t\t\t\tsetting.disableCustomGradients )\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tlabel={ showTitle ? title : undefined }\n\t\t\tresetAll={ () => {\n\t\t\t\tbatch( () => {\n\t\t\t\t\tsettings.forEach(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\tif ( colorValue ) {\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t\t} else if ( gradientValue ) {\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tpanelId={ panelId }\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t>\n\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\tsettings={ settings }\n\t\t\t\tpanelId={ panelId }\n\t\t\t\t{ ...{\n\t\t\t\t\tcolors,\n\t\t\t\t\tgradients,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ !! children && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer marginY={ 4 } /> { children }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n};\n\nconst PanelColorGradientSettingsSelect = ( props ) => {\n\tconst colorGradientSettings = useColorsAndGradientsPalettes();\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettings = ( props ) => {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"],"mappings":"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"}

package/build/components/colors-gradients/panel-color-gradient-settings.native.js

@@ -4,9 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = PanelColorGradientSettings;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _native = require("@react-navigation/native");
 var _components = require("@wordpress/components");
+var _element = require("@wordpress/element");
 var _blockSettings = require("../block-settings");
 /**
  * External dependencies
@@ -34,7 +35,7 @@ function PanelColorGradientSettings({
       onGradientChange,
       gradientValue,
       label
-    }) => (0, _element.createElement)(_components.ColorControl, {
+    }) => (0, _react.createElement)(_components.ColorControl, {
       onPress: () => {
         navigation.navigate(_blockSettings.blockSettingsScreens.color, {
           onColorChange,
@@ -50,8 +51,8 @@ function PanelColorGradientSettings({
       color: gradientValue || colorValue
     }));
   }, [settings]);
-  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.PanelBody, {
+  return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_components.PanelBody, {
     title: title
-  }, mappedSettings), (0, _element.createElement)(_components.PanelBody, null, children));
+  }, mappedSettings), (0, _react.createElement)(_components.PanelBody, null, children));
 }
 //# sourceMappingURL=panel-color-gradient-settings.native.js.map

package/build/components/colors-gradients/panel-color-gradient-settings.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_native","_components","_blockSettings","PanelColorGradientSettings","settings","title","children","navigation","useNavigation","mappedSettings","useMemo","map","onColorChange","onColorCleared","colorValue","onGradientChange","gradientValue","label","createElement","ColorControl","onPress","navigate","blockSettingsScreens","color","key","Fragment","PanelBody"],"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\n\n/**\n * WordPress dependencies\n */\nimport { ColorControl, PanelBody } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { blockSettingsScreens } from '../block-settings';\n\nexport default function PanelColorGradientSettings( {\n\tsettings,\n\ttitle,\n\tchildren,\n} ) {\n\tconst navigation = useNavigation();\n\n\tconst mappedSettings = useMemo( () => {\n\t\treturn settings.map(\n\t\t\t( {\n\t\t\t\tonColorChange,\n\t\t\t\tonColorCleared,\n\t\t\t\tcolorValue,\n\t\t\t\tonGradientChange,\n\t\t\t\tgradientValue,\n\t\t\t\tlabel,\n\t\t\t} ) => (\n\t\t\t\t<ColorControl\n\t\t\t\t\tonPress={ () => {\n\t\t\t\t\t\tnavigation.navigate( blockSettingsScreens.color, {\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tcolorValue: gradientValue || colorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t\tonColorCleared,\n\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tkey={ `color-setting-${ label }` }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tcolor={ gradientValue || colorValue }\n\t\t\t\t/>\n\t\t\t)\n\t\t);\n\t}, [ settings ] );\n\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ title }>{ mappedSettings }</PanelBody>\n\t\t\t<PanelBody>{ children }</PanelBody>\n\t\t</>\n\t);\n}\n"],"mappings":";;;;;;AASA,IAAAA,QAAA,GAAAC,OAAA;AANA,IAAAC,OAAA,GAAAD,OAAA;AAKA,IAAAE,WAAA,GAAAF,OAAA;AAMA,IAAAG,cAAA,GAAAH,OAAA;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;;AAGe,SAASI,0BAA0BA,CAAE;EACnDC,QAAQ;EACRC,KAAK;EACLC;AACD,CAAC,EAAG;EACH,MAAMC,UAAU,GAAG,IAAAC,qBAAa,EAAC,CAAC;EAElC,MAAMC,cAAc,GAAG,IAAAC,gBAAO,EAAE,MAAM;IACrC,OAAON,QAAQ,CAACO,GAAG,CAClB,CAAE;MACDC,aAAa;MACbC,cAAc;MACdC,UAAU;MACVC,gBAAgB;MAChBC,aAAa;MACbC;IACD,CAAC,KACA,IAAAnB,QAAA,CAAAoB,aAAA,EAACjB,WAAA,CAAAkB,YAAY;MACZC,OAAO,EAAGA,CAAA,KAAM;QACfb,UAAU,CAACc,QAAQ,CAAEC,mCAAoB,CAACC,KAAK,EAAE;UAChDX,aAAa;UACbE,UAAU,EAAEE,aAAa,IAAIF,UAAU;UACvCE,aAAa;UACbD,gBAAgB;UAChBF,cAAc;UACdI;QACD,CAAE,CAAC;MACJ,CAAG;MACHO,GAAG,EAAI,iBAAiBP,KAAO,EAAG;MAClCA,KAAK,EAAGA,KAAO;MACfM,KAAK,EAAGP,aAAa,IAAIF;IAAY,CACrC,CAEH,CAAC;EACF,CAAC,EAAE,CAAEV,QAAQ,CAAG,CAAC;EAEjB,OACC,IAAAN,QAAA,CAAAoB,aAAA,EAAApB,QAAA,CAAA2B,QAAA,QACC,IAAA3B,QAAA,CAAAoB,aAAA,EAACjB,WAAA,CAAAyB,SAAS;IAACrB,KAAK,EAAGA;EAAO,GAAGI,cAA2B,CAAC,EACzD,IAAAX,QAAA,CAAAoB,aAAA,EAACjB,WAAA,CAAAyB,SAAS,QAAGpB,QAAqB,CACjC,CAAC;AAEL"}
+{"version":3,"names":["_native","require","_components","_element","_blockSettings","PanelColorGradientSettings","settings","title","children","navigation","useNavigation","mappedSettings","useMemo","map","onColorChange","onColorCleared","colorValue","onGradientChange","gradientValue","label","_react","createElement","ColorControl","onPress","navigate","blockSettingsScreens","color","key","Fragment","PanelBody"],"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\n\n/**\n * WordPress dependencies\n */\nimport { ColorControl, PanelBody } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { blockSettingsScreens } from '../block-settings';\n\nexport default function PanelColorGradientSettings( {\n\tsettings,\n\ttitle,\n\tchildren,\n} ) {\n\tconst navigation = useNavigation();\n\n\tconst mappedSettings = useMemo( () => {\n\t\treturn settings.map(\n\t\t\t( {\n\t\t\t\tonColorChange,\n\t\t\t\tonColorCleared,\n\t\t\t\tcolorValue,\n\t\t\t\tonGradientChange,\n\t\t\t\tgradientValue,\n\t\t\t\tlabel,\n\t\t\t} ) => (\n\t\t\t\t<ColorControl\n\t\t\t\t\tonPress={ () => {\n\t\t\t\t\t\tnavigation.navigate( blockSettingsScreens.color, {\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tcolorValue: gradientValue || colorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t\tonColorCleared,\n\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tkey={ `color-setting-${ label }` }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tcolor={ gradientValue || colorValue }\n\t\t\t\t/>\n\t\t\t)\n\t\t);\n\t}, [ settings ] );\n\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ title }>{ mappedSettings }</PanelBody>\n\t\t\t<PanelBody>{ children }</PanelBody>\n\t\t</>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAKA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAKA,IAAAG,cAAA,GAAAH,OAAA;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;;AAGe,SAASI,0BAA0BA,CAAE;EACnDC,QAAQ;EACRC,KAAK;EACLC;AACD,CAAC,EAAG;EACH,MAAMC,UAAU,GAAG,IAAAC,qBAAa,EAAC,CAAC;EAElC,MAAMC,cAAc,GAAG,IAAAC,gBAAO,EAAE,MAAM;IACrC,OAAON,QAAQ,CAACO,GAAG,CAClB,CAAE;MACDC,aAAa;MACbC,cAAc;MACdC,UAAU;MACVC,gBAAgB;MAChBC,aAAa;MACbC;IACD,CAAC,KACA,IAAAC,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAAoB,YAAY;MACZC,OAAO,EAAGA,CAAA,KAAM;QACfd,UAAU,CAACe,QAAQ,CAAEC,mCAAoB,CAACC,KAAK,EAAE;UAChDZ,aAAa;UACbE,UAAU,EAAEE,aAAa,IAAIF,UAAU;UACvCE,aAAa;UACbD,gBAAgB;UAChBF,cAAc;UACdI;QACD,CAAE,CAAC;MACJ,CAAG;MACHQ,GAAG,EAAI,iBAAiBR,KAAO,EAAG;MAClCA,KAAK,EAAGA,KAAO;MACfO,KAAK,EAAGR,aAAa,IAAIF;IAAY,CACrC,CAEH,CAAC;EACF,CAAC,EAAE,CAAEV,QAAQ,CAAG,CAAC;EAEjB,OACC,IAAAc,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAQ,QAAA,QACC,IAAAR,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAA2B,SAAS;IAACtB,KAAK,EAAGA;EAAO,GAAGI,cAA2B,CAAC,EACzD,IAAAS,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAA2B,SAAS,QAAGrB,QAAqB,CACjC,CAAC;AAEL"}

package/build/components/contrast-checker/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _a11y = _interopRequireDefault(require("colord/plugins/a11y"));
 var _names = _interopRequireDefault(require("colord/plugins/names"));
 var _colord = require("colord");
@@ -104,9 +104,9 @@ function ContrastChecker({
   // announcements are made. Notably, the message will be re-announced if a
   // new color combination is selected and the contrast is still insufficient.
   (0, _a11y2.speak)(speakMessage);
-  return (0, _element.createElement)("div", {
+  return (0, _react.createElement)("div", {
     className: "block-editor-contrast-checker"
-  }, (0, _element.createElement)(_components.Notice, {
+  }, (0, _react.createElement)(_components.Notice, {
     spokenMessage: null,
     status: "warning",
     isDismissible: false

package/build/components/contrast-checker/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_a11y","_interopRequireDefault","require","_names","_colord","_i18n","_components","_a11y2","extend","namesPlugin","a11yPlugin","ContrastChecker","backgroundColor","fallbackBackgroundColor","fallbackTextColor","fallbackLinkColor","fontSize","isLargeText","textColor","linkColor","enableAlphaChecker","currentBackgroundColor","currentTextColor","currentLinkColor","textColors","color","description","__","colordBackgroundColor","colord","backgroundColorHasTransparency","alpha","backgroundColorBrightness","brightness","isReadableOptions","level","size","message","speakMessage","item","colordTextColor","isColordTextReadable","isReadable","textHasTransparency","sprintf","speak","_element","createElement","className","Notice","spokenMessage","status","isDismissible","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/contrast-checker/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport a11yPlugin from 'colord/plugins/a11y';\nimport namesPlugin from 'colord/plugins/names';\nimport { colord, extend } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Notice } from '@wordpress/components';\nimport { speak } from '@wordpress/a11y';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction ContrastChecker( {\n\tbackgroundColor,\n\tfallbackBackgroundColor,\n\tfallbackTextColor,\n\tfallbackLinkColor,\n\tfontSize, // Font size value in pixels.\n\tisLargeText,\n\ttextColor,\n\tlinkColor,\n\tenableAlphaChecker = false,\n} ) {\n\tconst currentBackgroundColor = backgroundColor || fallbackBackgroundColor;\n\n\t// Must have a background color.\n\tif ( ! currentBackgroundColor ) {\n\t\treturn null;\n\t}\n\n\tconst currentTextColor = textColor || fallbackTextColor;\n\tconst currentLinkColor = linkColor || fallbackLinkColor;\n\n\t// Must have at least one text color.\n\tif ( ! currentTextColor && ! currentLinkColor ) {\n\t\treturn null;\n\t}\n\n\tconst textColors = [\n\t\t{\n\t\t\tcolor: currentTextColor,\n\t\t\tdescription: __( 'text color' ),\n\t\t},\n\t\t{\n\t\t\tcolor: currentLinkColor,\n\t\t\tdescription: __( 'link color' ),\n\t\t},\n\t];\n\tconst colordBackgroundColor = colord( currentBackgroundColor );\n\tconst backgroundColorHasTransparency = colordBackgroundColor.alpha() < 1;\n\tconst backgroundColorBrightness = colordBackgroundColor.brightness();\n\tconst isReadableOptions = {\n\t\tlevel: 'AA',\n\t\tsize:\n\t\t\tisLargeText || ( isLargeText !== false && fontSize >= 24 )\n\t\t\t\t? 'large'\n\t\t\t\t: 'small',\n\t};\n\n\tlet message = '';\n\tlet speakMessage = '';\n\tfor ( const item of textColors ) {\n\t\t// If there is no color, go no further.\n\t\tif ( ! item.color ) {\n\t\t\tcontinue;\n\t\t}\n\t\tconst colordTextColor = colord( item.color );\n\t\tconst isColordTextReadable = colordTextColor.isReadable(\n\t\t\tcolordBackgroundColor,\n\t\t\tisReadableOptions\n\t\t);\n\t\tconst textHasTransparency = colordTextColor.alpha() < 1;\n\n\t\t// If the contrast is not readable.\n\t\tif ( ! isColordTextReadable ) {\n\t\t\t// Don't show the message if the background or text is transparent.\n\t\t\tif ( backgroundColorHasTransparency || textHasTransparency ) {\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t\tmessage =\n\t\t\t\tbackgroundColorBrightness < colordTextColor.brightness()\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s is a type of text color, e.g., \"text color\" or \"link color\".\n\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t'This color combination may be hard for people to read. Try using a darker background color and/or a brighter %s.'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\titem.description\n\t\t\t\t\t  )\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t// translators: %s is a type of text color, e.g., \"text color\" or \"link color\".\n\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t'This color combination may be hard for people to read. Try using a brighter background color and/or a darker %s.'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\titem.description\n\t\t\t\t\t  );\n\t\t\tspeakMessage = __(\n\t\t\t\t'This color combination may be hard for people to read.'\n\t\t\t);\n\t\t\t// Break from the loop when we have a contrast warning.\n\t\t\t// These messages take priority over the transparency warning.\n\t\t\tbreak;\n\t\t}\n\n\t\t// If there is no contrast warning and the text is transparent,\n\t\t// show the transparent warning if alpha check is enabled.\n\t\tif ( textHasTransparency && enableAlphaChecker ) {\n\t\t\tmessage = __( 'Transparent text may be hard for people to read.' );\n\t\t\tspeakMessage = __(\n\t\t\t\t'Transparent text may be hard for people to read.'\n\t\t\t);\n\t\t}\n\t}\n\n\tif ( ! message ) {\n\t\treturn null;\n\t}\n\n\t// Note: The `Notice` component can speak messages via its `spokenMessage`\n\t// prop, but the contrast checker requires granular control over when the\n\t// announcements are made. Notably, the message will be re-announced if a\n\t// new color combination is selected and the contrast is still insufficient.\n\tspeak( speakMessage );\n\n\treturn (\n\t\t<div className=\"block-editor-contrast-checker\">\n\t\t\t<Notice\n\t\t\t\tspokenMessage={ null }\n\t\t\t\tstatus=\"warning\"\n\t\t\t\tisDismissible={ false }\n\t\t\t>\n\t\t\t\t{ message }\n\t\t\t</Notice>\n\t\t</div>\n\t);\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/contrast-checker/README.md\n */\nexport default ContrastChecker;\n"],"mappings":"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"}
+{"version":3,"names":["_a11y","_interopRequireDefault","require","_names","_colord","_i18n","_components","_a11y2","extend","namesPlugin","a11yPlugin","ContrastChecker","backgroundColor","fallbackBackgroundColor","fallbackTextColor","fallbackLinkColor","fontSize","isLargeText","textColor","linkColor","enableAlphaChecker","currentBackgroundColor","currentTextColor","currentLinkColor","textColors","color","description","__","colordBackgroundColor","colord","backgroundColorHasTransparency","alpha","backgroundColorBrightness","brightness","isReadableOptions","level","size","message","speakMessage","item","colordTextColor","isColordTextReadable","isReadable","textHasTransparency","sprintf","speak","_react","createElement","className","Notice","spokenMessage","status","isDismissible","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/contrast-checker/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport a11yPlugin from 'colord/plugins/a11y';\nimport namesPlugin from 'colord/plugins/names';\nimport { colord, extend } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Notice } from '@wordpress/components';\nimport { speak } from '@wordpress/a11y';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction ContrastChecker( {\n\tbackgroundColor,\n\tfallbackBackgroundColor,\n\tfallbackTextColor,\n\tfallbackLinkColor,\n\tfontSize, // Font size value in pixels.\n\tisLargeText,\n\ttextColor,\n\tlinkColor,\n\tenableAlphaChecker = false,\n} ) {\n\tconst currentBackgroundColor = backgroundColor || fallbackBackgroundColor;\n\n\t// Must have a background color.\n\tif ( ! currentBackgroundColor ) {\n\t\treturn null;\n\t}\n\n\tconst currentTextColor = textColor || fallbackTextColor;\n\tconst currentLinkColor = linkColor || fallbackLinkColor;\n\n\t// Must have at least one text color.\n\tif ( ! currentTextColor && ! currentLinkColor ) {\n\t\treturn null;\n\t}\n\n\tconst textColors = [\n\t\t{\n\t\t\tcolor: currentTextColor,\n\t\t\tdescription: __( 'text color' ),\n\t\t},\n\t\t{\n\t\t\tcolor: currentLinkColor,\n\t\t\tdescription: __( 'link color' ),\n\t\t},\n\t];\n\tconst colordBackgroundColor = colord( currentBackgroundColor );\n\tconst backgroundColorHasTransparency = colordBackgroundColor.alpha() < 1;\n\tconst backgroundColorBrightness = colordBackgroundColor.brightness();\n\tconst isReadableOptions = {\n\t\tlevel: 'AA',\n\t\tsize:\n\t\t\tisLargeText || ( isLargeText !== false && fontSize >= 24 )\n\t\t\t\t? 'large'\n\t\t\t\t: 'small',\n\t};\n\n\tlet message = '';\n\tlet speakMessage = '';\n\tfor ( const item of textColors ) {\n\t\t// If there is no color, go no further.\n\t\tif ( ! item.color ) {\n\t\t\tcontinue;\n\t\t}\n\t\tconst colordTextColor = colord( item.color );\n\t\tconst isColordTextReadable = colordTextColor.isReadable(\n\t\t\tcolordBackgroundColor,\n\t\t\tisReadableOptions\n\t\t);\n\t\tconst textHasTransparency = colordTextColor.alpha() < 1;\n\n\t\t// If the contrast is not readable.\n\t\tif ( ! isColordTextReadable ) {\n\t\t\t// Don't show the message if the background or text is transparent.\n\t\t\tif ( backgroundColorHasTransparency || textHasTransparency ) {\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t\tmessage =\n\t\t\t\tbackgroundColorBrightness < colordTextColor.brightness()\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s is a type of text color, e.g., \"text color\" or \"link color\".\n\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t'This color combination may be hard for people to read. Try using a darker background color and/or a brighter %s.'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\titem.description\n\t\t\t\t\t  )\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t// translators: %s is a type of text color, e.g., \"text color\" or \"link color\".\n\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t'This color combination may be hard for people to read. Try using a brighter background color and/or a darker %s.'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\titem.description\n\t\t\t\t\t  );\n\t\t\tspeakMessage = __(\n\t\t\t\t'This color combination may be hard for people to read.'\n\t\t\t);\n\t\t\t// Break from the loop when we have a contrast warning.\n\t\t\t// These messages take priority over the transparency warning.\n\t\t\tbreak;\n\t\t}\n\n\t\t// If there is no contrast warning and the text is transparent,\n\t\t// show the transparent warning if alpha check is enabled.\n\t\tif ( textHasTransparency && enableAlphaChecker ) {\n\t\t\tmessage = __( 'Transparent text may be hard for people to read.' );\n\t\t\tspeakMessage = __(\n\t\t\t\t'Transparent text may be hard for people to read.'\n\t\t\t);\n\t\t}\n\t}\n\n\tif ( ! message ) {\n\t\treturn null;\n\t}\n\n\t// Note: The `Notice` component can speak messages via its `spokenMessage`\n\t// prop, but the contrast checker requires granular control over when the\n\t// announcements are made. Notably, the message will be re-announced if a\n\t// new color combination is selected and the contrast is still insufficient.\n\tspeak( speakMessage );\n\n\treturn (\n\t\t<div className=\"block-editor-contrast-checker\">\n\t\t\t<Notice\n\t\t\t\tspokenMessage={ null }\n\t\t\t\tstatus=\"warning\"\n\t\t\t\tisDismissible={ false }\n\t\t\t>\n\t\t\t\t{ message }\n\t\t\t</Notice>\n\t\t</div>\n\t);\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/contrast-checker/README.md\n */\nexport default ContrastChecker;\n"],"mappings":";;;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAKA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,WAAA,GAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AAZA;AACA;AACA;;AAKA;AACA;AACA;;AAKA,IAAAM,cAAM,EAAE,CAAEC,cAAW,EAAEC,aAAU,CAAG,CAAC;AAErC,SAASC,eAAeA,CAAE;EACzBC,eAAe;EACfC,uBAAuB;EACvBC,iBAAiB;EACjBC,iBAAiB;EACjBC,QAAQ;EAAE;EACVC,WAAW;EACXC,SAAS;EACTC,SAAS;EACTC,kBAAkB,GAAG;AACtB,CAAC,EAAG;EACH,MAAMC,sBAAsB,GAAGT,eAAe,IAAIC,uBAAuB;;EAEzE;EACA,IAAK,CAAEQ,sBAAsB,EAAG;IAC/B,OAAO,IAAI;EACZ;EAEA,MAAMC,gBAAgB,GAAGJ,SAAS,IAAIJ,iBAAiB;EACvD,MAAMS,gBAAgB,GAAGJ,SAAS,IAAIJ,iBAAiB;;EAEvD;EACA,IAAK,CAAEO,gBAAgB,IAAI,CAAEC,gBAAgB,EAAG;IAC/C,OAAO,IAAI;EACZ;EAEA,MAAMC,UAAU,GAAG,CAClB;IACCC,KAAK,EAAEH,gBAAgB;IACvBI,WAAW,EAAE,IAAAC,QAAE,EAAE,YAAa;EAC/B,CAAC,EACD;IACCF,KAAK,EAAEF,gBAAgB;IACvBG,WAAW,EAAE,IAAAC,QAAE,EAAE,YAAa;EAC/B,CAAC,CACD;EACD,MAAMC,qBAAqB,GAAG,IAAAC,cAAM,EAAER,sBAAuB,CAAC;EAC9D,MAAMS,8BAA8B,GAAGF,qBAAqB,CAACG,KAAK,CAAC,CAAC,GAAG,CAAC;EACxE,MAAMC,yBAAyB,GAAGJ,qBAAqB,CAACK,UAAU,CAAC,CAAC;EACpE,MAAMC,iBAAiB,GAAG;IACzBC,KAAK,EAAE,IAAI;IACXC,IAAI,EACHnB,WAAW,IAAMA,WAAW,KAAK,KAAK,IAAID,QAAQ,IAAI,EAAI,GACvD,OAAO,GACP;EACL,CAAC;EAED,IAAIqB,OAAO,GAAG,EAAE;EAChB,IAAIC,YAAY,GAAG,EAAE;EACrB,KAAM,MAAMC,IAAI,IAAIf,UAAU,EAAG;IAChC;IACA,IAAK,CAAEe,IAAI,CAACd,KAAK,EAAG;MACnB;IACD;IACA,MAAMe,eAAe,GAAG,IAAAX,cAAM,EAAEU,IAAI,CAACd,KAAM,CAAC;IAC5C,MAAMgB,oBAAoB,GAAGD,eAAe,CAACE,UAAU,CACtDd,qBAAqB,EACrBM,iBACD,CAAC;IACD,MAAMS,mBAAmB,GAAGH,eAAe,CAACT,KAAK,CAAC,CAAC,GAAG,CAAC;;IAEvD;IACA,IAAK,CAAEU,oBAAoB,EAAG;MAC7B;MACA,IAAKX,8BAA8B,IAAIa,mBAAmB,EAAG;QAC5D;MACD;MACAN,OAAO,GACNL,yBAAyB,GAAGQ,eAAe,CAACP,UAAU,CAAC,CAAC,GACrD,IAAAW,aAAO;MACP;MACA,IAAAjB,QAAE,EACD,kHACD,CAAC,EACDY,IAAI,CAACb,WACL,CAAC,GACD,IAAAkB,aAAO;MACP;MACA,IAAAjB,QAAE,EACD,kHACD,CAAC,EACDY,IAAI,CAACb,WACL,CAAC;MACLY,YAAY,GAAG,IAAAX,QAAE,EAChB,wDACD,CAAC;MACD;MACA;MACA;IACD;;IAEA;IACA;IACA,IAAKgB,mBAAmB,IAAIvB,kBAAkB,EAAG;MAChDiB,OAAO,GAAG,IAAAV,QAAE,EAAE,kDAAmD,CAAC;MAClEW,YAAY,GAAG,IAAAX,QAAE,EAChB,kDACD,CAAC;IACF;EACD;EAEA,IAAK,CAAEU,OAAO,EAAG;IAChB,OAAO,IAAI;EACZ;;EAEA;EACA;EACA;EACA;EACA,IAAAQ,YAAK,EAAEP,YAAa,CAAC;EAErB,OACC,IAAAQ,MAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAA+B,GAC7C,IAAAF,MAAA,CAAAC,aAAA,EAACzC,WAAA,CAAA2C,MAAM;IACNC,aAAa,EAAG,IAAM;IACtBC,MAAM,EAAC,SAAS;IAChBC,aAAa,EAAG;EAAO,GAErBf,OACK,CACJ,CAAC;AAER;;AAEA;AACA;AACA;AAFA,IAAAgB,QAAA,GAGe1C,eAAe;AAAA2C,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

package/build/components/contrast-checker/index.native.js

@@ -5,13 +5,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _reactNative = require("react-native");
 var _colord = require("colord");
 var _names = _interopRequireDefault(require("colord/plugins/names"));
 var _a11y = _interopRequireDefault(require("colord/plugins/a11y"));
 var _a11y2 = require("@wordpress/a11y");
 var _i18n = require("@wordpress/i18n");
+var _element = require("@wordpress/element");
 var _compose = require("@wordpress/compose");
 var _icons = require("@wordpress/icons");
 var _style = _interopRequireDefault(require("./style.scss"));
@@ -45,12 +46,12 @@ function ContrastCheckerMessage({
     (0, _a11y2.speak)((0, _i18n.__)('This color combination may be hard for people to read.'));
   }, [backgroundColor, textColor]);
   const iconStyle = (0, _compose.usePreferredColorSchemeStyle)(_style.default['block-editor-contrast-checker__icon'], _style.default['block-editor-contrast-checker__icon-dark']);
-  return (0, _element.createElement)(_reactNative.View, {
+  return (0, _react.createElement)(_reactNative.View, {
     style: _style.default['block-editor-contrast-checker']
-  }, (0, _element.createElement)(_icons.Icon, {
+  }, (0, _react.createElement)(_icons.Icon, {
     style: iconStyle,
     icon: _icons.warning
-  }), (0, _element.createElement)(_reactNative.Text, {
+  }), (0, _react.createElement)(_reactNative.Text, {
     style: msgStyle
   }, msg));
 }
@@ -76,7 +77,7 @@ function ContrastChecker({
   })) {
     return null;
   }
-  return (0, _element.createElement)(ContrastCheckerMessage, {
+  return (0, _react.createElement)(ContrastCheckerMessage, {
     backgroundColor: backgroundColor,
     textColor: textColor,
     colordBackgroundColor: colordBackgroundColor,

package/build/components/contrast-checker/index.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_reactNative","_colord","_names","_interopRequireDefault","_a11y","_a11y2","_i18n","_compose","_icons","_style","extend","namesPlugin","a11yPlugin","ContrastCheckerMessage","colordBackgroundColor","colordTextColor","backgroundColor","textColor","msgStyle","msg","brightness","__","useEffect","speak","iconStyle","usePreferredColorSchemeStyle","styles","createElement","View","style","Icon","icon","warning","Text","ContrastChecker","fallbackBackgroundColor","fallbackTextColor","fontSize","isLargeText","colord","hasTransparency","alpha","isReadable","level","size","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/contrast-checker/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { __ } from '@wordpress/i18n';\nimport { useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\nimport { Icon, warning } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction ContrastCheckerMessage( {\n\tcolordBackgroundColor,\n\tcolordTextColor,\n\tbackgroundColor,\n\ttextColor,\n\tmsgStyle,\n} ) {\n\tconst msg =\n\t\tcolordBackgroundColor.brightness() < colordTextColor.brightness()\n\t\t\t? __(\n\t\t\t\t\t'This color combination may be hard for people to read. Try using a darker background color and/or a brighter text color.'\n\t\t\t  )\n\t\t\t: __(\n\t\t\t\t\t'This color combination may be hard for people to read. Try using a brighter background color and/or a darker text color.'\n\t\t\t  );\n\n\t// Note: The `Notice` component can speak messages via its `spokenMessage`\n\t// prop, but the contrast checker requires granular control over when the\n\t// announcements are made. Notably, the message will be re-announced if a\n\t// new color combination is selected and the contrast is still insufficient.\n\tuseEffect( () => {\n\t\tspeak( __( 'This color combination may be hard for people to read.' ) );\n\t}, [ backgroundColor, textColor ] );\n\n\tconst iconStyle = usePreferredColorSchemeStyle(\n\t\tstyles[ 'block-editor-contrast-checker__icon' ],\n\t\tstyles[ 'block-editor-contrast-checker__icon-dark' ]\n\t);\n\n\treturn (\n\t\t<View style={ styles[ 'block-editor-contrast-checker' ] }>\n\t\t\t<Icon style={ iconStyle } icon={ warning } />\n\t\t\t<Text style={ msgStyle }>{ msg }</Text>\n\t\t</View>\n\t);\n}\n\nfunction ContrastChecker( {\n\tbackgroundColor,\n\tfallbackBackgroundColor,\n\tfallbackTextColor,\n\tfontSize, // font size value in pixels\n\tisLargeText,\n\ttextColor,\n} ) {\n\tconst msgStyle = usePreferredColorSchemeStyle(\n\t\tstyles[ 'block-editor-contrast-checker__notice' ],\n\t\tstyles[ 'block-editor-contrast-checker__notice-dark' ]\n\t);\n\n\tif (\n\t\t! ( backgroundColor || fallbackBackgroundColor ) ||\n\t\t! ( textColor || fallbackTextColor )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst colordBackgroundColor = colord(\n\t\tbackgroundColor || fallbackBackgroundColor\n\t);\n\tconst colordTextColor = colord( textColor || fallbackTextColor );\n\n\tconst hasTransparency =\n\t\tcolordBackgroundColor.alpha() !== 1 || colordTextColor.alpha() !== 1;\n\n\tif (\n\t\thasTransparency ||\n\t\tcolordTextColor.isReadable( colordBackgroundColor, {\n\t\t\tlevel: 'AA',\n\t\t\tsize:\n\t\t\t\tisLargeText || ( isLargeText !== false && fontSize >= 24 )\n\t\t\t\t\t? 'large'\n\t\t\t\t\t: 'small',\n\t\t} )\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ContrastCheckerMessage\n\t\t\tbackgroundColor={ backgroundColor }\n\t\t\ttextColor={ textColor }\n\t\t\tcolordBackgroundColor={ colordBackgroundColor }\n\t\t\tcolordTextColor={ colordTextColor }\n\t\t\tmsgStyle={ msgStyle }\n\t\t/>\n\t);\n}\n\nexport default ContrastChecker;\n"],"mappings":";;;;;;;AAaA,IAAAA,QAAA,GAAAC,OAAA;AAVA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAD,sBAAA,CAAAJ,OAAA;AAKA,IAAAM,MAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAP,OAAA;AAEA,IAAAQ,QAAA,GAAAR,OAAA;AACA,IAAAS,MAAA,GAAAT,OAAA;AAIA,IAAAU,MAAA,GAAAN,sBAAA,CAAAJ,OAAA;AAnBA;AACA;AACA;;AAMA;AACA;AACA;;AAMA;AACA;AACA;;AAGA,IAAAW,cAAM,EAAE,CAAEC,cAAW,EAAEC,aAAU,CAAG,CAAC;AAErC,SAASC,sBAAsBA,CAAE;EAChCC,qBAAqB;EACrBC,eAAe;EACfC,eAAe;EACfC,SAAS;EACTC;AACD,CAAC,EAAG;EACH,MAAMC,GAAG,GACRL,qBAAqB,CAACM,UAAU,CAAC,CAAC,GAAGL,eAAe,CAACK,UAAU,CAAC,CAAC,GAC9D,IAAAC,QAAE,EACF,0HACA,CAAC,GACD,IAAAA,QAAE,EACF,0HACA,CAAC;;EAEL;EACA;EACA;EACA;EACA,IAAAC,kBAAS,EAAE,MAAM;IAChB,IAAAC,YAAK,EAAE,IAAAF,QAAE,EAAE,wDAAyD,CAAE,CAAC;EACxE,CAAC,EAAE,CAAEL,eAAe,EAAEC,SAAS,CAAG,CAAC;EAEnC,MAAMO,SAAS,GAAG,IAAAC,qCAA4B,EAC7CC,cAAM,CAAE,qCAAqC,CAAE,EAC/CA,cAAM,CAAE,0CAA0C,CACnD,CAAC;EAED,OACC,IAAA5B,QAAA,CAAA6B,aAAA,EAAC3B,YAAA,CAAA4B,IAAI;IAACC,KAAK,EAAGH,cAAM,CAAE,+BAA+B;EAAI,GACxD,IAAA5B,QAAA,CAAA6B,aAAA,EAACnB,MAAA,CAAAsB,IAAI;IAACD,KAAK,EAAGL,SAAW;IAACO,IAAI,EAAGC;EAAS,CAAE,CAAC,EAC7C,IAAAlC,QAAA,CAAA6B,aAAA,EAAC3B,YAAA,CAAAiC,IAAI;IAACJ,KAAK,EAAGX;EAAU,GAAGC,GAAW,CACjC,CAAC;AAET;AAEA,SAASe,eAAeA,CAAE;EACzBlB,eAAe;EACfmB,uBAAuB;EACvBC,iBAAiB;EACjBC,QAAQ;EAAE;EACVC,WAAW;EACXrB;AACD,CAAC,EAAG;EACH,MAAMC,QAAQ,GAAG,IAAAO,qCAA4B,EAC5CC,cAAM,CAAE,uCAAuC,CAAE,EACjDA,cAAM,CAAE,4CAA4C,CACrD,CAAC;EAED,IACC,EAAIV,eAAe,IAAImB,uBAAuB,CAAE,IAChD,EAAIlB,SAAS,IAAImB,iBAAiB,CAAE,EACnC;IACD,OAAO,IAAI;EACZ;EAEA,MAAMtB,qBAAqB,GAAG,IAAAyB,cAAM,EACnCvB,eAAe,IAAImB,uBACpB,CAAC;EACD,MAAMpB,eAAe,GAAG,IAAAwB,cAAM,EAAEtB,SAAS,IAAImB,iBAAkB,CAAC;EAEhE,MAAMI,eAAe,GACpB1B,qBAAqB,CAAC2B,KAAK,CAAC,CAAC,KAAK,CAAC,IAAI1B,eAAe,CAAC0B,KAAK,CAAC,CAAC,KAAK,CAAC;EAErE,IACCD,eAAe,IACfzB,eAAe,CAAC2B,UAAU,CAAE5B,qBAAqB,EAAE;IAClD6B,KAAK,EAAE,IAAI;IACXC,IAAI,EACHN,WAAW,IAAMA,WAAW,KAAK,KAAK,IAAID,QAAQ,IAAI,EAAI,GACvD,OAAO,GACP;EACL,CAAE,CAAC,EACF;IACD,OAAO,IAAI;EACZ;EAEA,OACC,IAAAvC,QAAA,CAAA6B,aAAA,EAACd,sBAAsB;IACtBG,eAAe,EAAGA,eAAiB;IACnCC,SAAS,EAAGA,SAAW;IACvBH,qBAAqB,EAAGA,qBAAuB;IAC/CC,eAAe,EAAGA,eAAiB;IACnCG,QAAQ,EAAGA;EAAU,CACrB,CAAC;AAEJ;AAAC,IAAA2B,QAAA,GAEcX,eAAe;AAAAY,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
+{"version":3,"names":["_reactNative","require","_colord","_names","_interopRequireDefault","_a11y","_a11y2","_i18n","_element","_compose","_icons","_style","extend","namesPlugin","a11yPlugin","ContrastCheckerMessage","colordBackgroundColor","colordTextColor","backgroundColor","textColor","msgStyle","msg","brightness","__","useEffect","speak","iconStyle","usePreferredColorSchemeStyle","styles","_react","createElement","View","style","Icon","icon","warning","Text","ContrastChecker","fallbackBackgroundColor","fallbackTextColor","fontSize","isLargeText","colord","hasTransparency","alpha","isReadable","level","size","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/contrast-checker/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { __ } from '@wordpress/i18n';\nimport { useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\nimport { Icon, warning } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction ContrastCheckerMessage( {\n\tcolordBackgroundColor,\n\tcolordTextColor,\n\tbackgroundColor,\n\ttextColor,\n\tmsgStyle,\n} ) {\n\tconst msg =\n\t\tcolordBackgroundColor.brightness() < colordTextColor.brightness()\n\t\t\t? __(\n\t\t\t\t\t'This color combination may be hard for people to read. Try using a darker background color and/or a brighter text color.'\n\t\t\t  )\n\t\t\t: __(\n\t\t\t\t\t'This color combination may be hard for people to read. Try using a brighter background color and/or a darker text color.'\n\t\t\t  );\n\n\t// Note: The `Notice` component can speak messages via its `spokenMessage`\n\t// prop, but the contrast checker requires granular control over when the\n\t// announcements are made. Notably, the message will be re-announced if a\n\t// new color combination is selected and the contrast is still insufficient.\n\tuseEffect( () => {\n\t\tspeak( __( 'This color combination may be hard for people to read.' ) );\n\t}, [ backgroundColor, textColor ] );\n\n\tconst iconStyle = usePreferredColorSchemeStyle(\n\t\tstyles[ 'block-editor-contrast-checker__icon' ],\n\t\tstyles[ 'block-editor-contrast-checker__icon-dark' ]\n\t);\n\n\treturn (\n\t\t<View style={ styles[ 'block-editor-contrast-checker' ] }>\n\t\t\t<Icon style={ iconStyle } icon={ warning } />\n\t\t\t<Text style={ msgStyle }>{ msg }</Text>\n\t\t</View>\n\t);\n}\n\nfunction ContrastChecker( {\n\tbackgroundColor,\n\tfallbackBackgroundColor,\n\tfallbackTextColor,\n\tfontSize, // font size value in pixels\n\tisLargeText,\n\ttextColor,\n} ) {\n\tconst msgStyle = usePreferredColorSchemeStyle(\n\t\tstyles[ 'block-editor-contrast-checker__notice' ],\n\t\tstyles[ 'block-editor-contrast-checker__notice-dark' ]\n\t);\n\n\tif (\n\t\t! ( backgroundColor || fallbackBackgroundColor ) ||\n\t\t! ( textColor || fallbackTextColor )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst colordBackgroundColor = colord(\n\t\tbackgroundColor || fallbackBackgroundColor\n\t);\n\tconst colordTextColor = colord( textColor || fallbackTextColor );\n\n\tconst hasTransparency =\n\t\tcolordBackgroundColor.alpha() !== 1 || colordTextColor.alpha() !== 1;\n\n\tif (\n\t\thasTransparency ||\n\t\tcolordTextColor.isReadable( colordBackgroundColor, {\n\t\t\tlevel: 'AA',\n\t\t\tsize:\n\t\t\t\tisLargeText || ( isLargeText !== false && fontSize >= 24 )\n\t\t\t\t\t? 'large'\n\t\t\t\t\t: 'small',\n\t\t} )\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ContrastCheckerMessage\n\t\t\tbackgroundColor={ backgroundColor }\n\t\t\ttextColor={ textColor }\n\t\t\tcolordBackgroundColor={ colordBackgroundColor }\n\t\t\tcolordTextColor={ colordTextColor }\n\t\t\tmsgStyle={ msgStyle }\n\t\t/>\n\t);\n}\n\nexport default ContrastChecker;\n"],"mappings":"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"}

package/build/components/convert-to-group-buttons/index.js

@@ -17,7 +17,7 @@ Object.defineProperty(exports, "useConvertToGroupButtonProps", {
     return _useConvertToGroupButtonProps.default;
   }
 });
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
 var _blocks = require("@wordpress/blocks");
@@ -65,12 +65,12 @@ function ConvertToGroupButton({
   if (!isGroupable && !isUngroupable) {
     return null;
   }
-  return (0, _element.createElement)(_element.Fragment, null, isGroupable && (0, _element.createElement)(_components.MenuItem, {
+  return (0, _react.createElement)(_react.Fragment, null, isGroupable && (0, _react.createElement)(_components.MenuItem, {
     onClick: () => {
       onConvertToGroup();
       onClose();
     }
-  }, (0, _i18n._x)('Group', 'verb')), isUngroupable && (0, _element.createElement)(_components.MenuItem, {
+  }, (0, _i18n._x)('Group', 'verb')), isUngroupable && (0, _react.createElement)(_components.MenuItem, {
     onClick: () => {
       onConvertFromGroup();
       onClose();

package/build/components/convert-to-group-buttons/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","_blocks","_data","_store","_useConvertToGroupButtonProps","_interopRequireDefault","_toolbar","ConvertToGroupButton","clientIds","isGroupable","isUngroupable","onUngroup","blocksSelection","groupingBlockName","onClose","replaceBlocks","useDispatch","blockEditorStore","onConvertToGroup","newBlocks","switchToBlockType","onConvertFromGroup","innerBlocks","length","attributes","_element","createElement","Fragment","MenuItem","onClick","_x"],"sources":["@wordpress/block-editor/src/components/convert-to-group-buttons/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuItem } from '@wordpress/components';\nimport { _x } from '@wordpress/i18n';\nimport { switchToBlockType } from '@wordpress/blocks';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport useConvertToGroupButtonProps from './use-convert-to-group-button-props';\nimport BlockGroupToolbar from './toolbar';\n\nfunction ConvertToGroupButton( {\n\tclientIds,\n\tisGroupable,\n\tisUngroupable,\n\tonUngroup,\n\tblocksSelection,\n\tgroupingBlockName,\n\tonClose = () => {},\n} ) {\n\tconst { replaceBlocks } = useDispatch( blockEditorStore );\n\tconst onConvertToGroup = () => {\n\t\t// Activate the `transform` on the Grouping Block which does the conversion.\n\t\tconst newBlocks = switchToBlockType(\n\t\t\tblocksSelection,\n\t\t\tgroupingBlockName\n\t\t);\n\t\tif ( newBlocks ) {\n\t\t\treplaceBlocks( clientIds, newBlocks );\n\t\t}\n\t};\n\n\tconst onConvertFromGroup = () => {\n\t\tlet innerBlocks = blocksSelection[ 0 ].innerBlocks;\n\t\tif ( ! innerBlocks.length ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( onUngroup ) {\n\t\t\tinnerBlocks = onUngroup(\n\t\t\t\tblocksSelection[ 0 ].attributes,\n\t\t\t\tblocksSelection[ 0 ].innerBlocks\n\t\t\t);\n\t\t}\n\t\treplaceBlocks( clientIds, innerBlocks );\n\t};\n\n\tif ( ! isGroupable && ! isUngroupable ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isGroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertToGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x( 'Group', 'verb' ) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t\t{ isUngroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertFromGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x(\n\t\t\t\t\t\t'Ungroup',\n\t\t\t\t\t\t'Ungrouping blocks from within a grouping block back into individual blocks within the Editor '\n\t\t\t\t\t) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport {\n\tBlockGroupToolbar,\n\tConvertToGroupButton,\n\tuseConvertToGroupButtonProps,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,6BAAA,GAAAC,sBAAA,CAAAN,OAAA;AACA,IAAAO,QAAA,GAAAD,sBAAA,CAAAN,OAAA;AAbA;AACA;AACA;;AAMA;AACA;AACA;;AAKA,SAASQ,oBAAoBA,CAAE;EAC9BC,SAAS;EACTC,WAAW;EACXC,aAAa;EACbC,SAAS;EACTC,eAAe;EACfC,iBAAiB;EACjBC,OAAO,GAAGA,CAAA,KAAM,CAAC;AAClB,CAAC,EAAG;EACH,MAAM;IAAEC;EAAc,CAAC,GAAG,IAAAC,iBAAW,EAAEC,YAAiB,CAAC;EACzD,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;IAC9B;IACA,MAAMC,SAAS,GAAG,IAAAC,yBAAiB,EAClCR,eAAe,EACfC,iBACD,CAAC;IACD,IAAKM,SAAS,EAAG;MAChBJ,aAAa,CAAEP,SAAS,EAAEW,SAAU,CAAC;IACtC;EACD,CAAC;EAED,MAAME,kBAAkB,GAAGA,CAAA,KAAM;IAChC,IAAIC,WAAW,GAAGV,eAAe,CAAE,CAAC,CAAE,CAACU,WAAW;IAClD,IAAK,CAAEA,WAAW,CAACC,MAAM,EAAG;MAC3B;IACD;IACA,IAAKZ,SAAS,EAAG;MAChBW,WAAW,GAAGX,SAAS,CACtBC,eAAe,CAAE,CAAC,CAAE,CAACY,UAAU,EAC/BZ,eAAe,CAAE,CAAC,CAAE,CAACU,WACtB,CAAC;IACF;IACAP,aAAa,CAAEP,SAAS,EAAEc,WAAY,CAAC;EACxC,CAAC;EAED,IAAK,CAAEb,WAAW,IAAI,CAAEC,aAAa,EAAG;IACvC,OAAO,IAAI;EACZ;EAEA,OACC,IAAAe,QAAA,CAAAC,aAAA,EAAAD,QAAA,CAAAE,QAAA,QACGlB,WAAW,IACZ,IAAAgB,QAAA,CAAAC,aAAA,EAAC5B,WAAA,CAAA8B,QAAQ;IACRC,OAAO,EAAGA,CAAA,KAAM;MACfX,gBAAgB,CAAC,CAAC;MAClBJ,OAAO,CAAC,CAAC;IACV;EAAG,GAED,IAAAgB,QAAE,EAAE,OAAO,EAAE,MAAO,CACb,CACV,EACCpB,aAAa,IACd,IAAAe,QAAA,CAAAC,aAAA,EAAC5B,WAAA,CAAA8B,QAAQ;IACRC,OAAO,EAAGA,CAAA,KAAM;MACfR,kBAAkB,CAAC,CAAC;MACpBP,OAAO,CAAC,CAAC;IACV;EAAG,GAED,IAAAgB,QAAE,EACH,SAAS,EACT,+FACD,CACS,CAEV,CAAC;AAEL"}
+{"version":3,"names":["_components","require","_i18n","_blocks","_data","_store","_useConvertToGroupButtonProps","_interopRequireDefault","_toolbar","ConvertToGroupButton","clientIds","isGroupable","isUngroupable","onUngroup","blocksSelection","groupingBlockName","onClose","replaceBlocks","useDispatch","blockEditorStore","onConvertToGroup","newBlocks","switchToBlockType","onConvertFromGroup","innerBlocks","length","attributes","_react","createElement","Fragment","MenuItem","onClick","_x"],"sources":["@wordpress/block-editor/src/components/convert-to-group-buttons/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuItem } from '@wordpress/components';\nimport { _x } from '@wordpress/i18n';\nimport { switchToBlockType } from '@wordpress/blocks';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport useConvertToGroupButtonProps from './use-convert-to-group-button-props';\nimport BlockGroupToolbar from './toolbar';\n\nfunction ConvertToGroupButton( {\n\tclientIds,\n\tisGroupable,\n\tisUngroupable,\n\tonUngroup,\n\tblocksSelection,\n\tgroupingBlockName,\n\tonClose = () => {},\n} ) {\n\tconst { replaceBlocks } = useDispatch( blockEditorStore );\n\tconst onConvertToGroup = () => {\n\t\t// Activate the `transform` on the Grouping Block which does the conversion.\n\t\tconst newBlocks = switchToBlockType(\n\t\t\tblocksSelection,\n\t\t\tgroupingBlockName\n\t\t);\n\t\tif ( newBlocks ) {\n\t\t\treplaceBlocks( clientIds, newBlocks );\n\t\t}\n\t};\n\n\tconst onConvertFromGroup = () => {\n\t\tlet innerBlocks = blocksSelection[ 0 ].innerBlocks;\n\t\tif ( ! innerBlocks.length ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( onUngroup ) {\n\t\t\tinnerBlocks = onUngroup(\n\t\t\t\tblocksSelection[ 0 ].attributes,\n\t\t\t\tblocksSelection[ 0 ].innerBlocks\n\t\t\t);\n\t\t}\n\t\treplaceBlocks( clientIds, innerBlocks );\n\t};\n\n\tif ( ! isGroupable && ! isUngroupable ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isGroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertToGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x( 'Group', 'verb' ) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t\t{ isUngroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertFromGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x(\n\t\t\t\t\t\t'Ungroup',\n\t\t\t\t\t\t'Ungrouping blocks from within a grouping block back into individual blocks within the Editor '\n\t\t\t\t\t) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport {\n\tBlockGroupToolbar,\n\tConvertToGroupButton,\n\tuseConvertToGroupButtonProps,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,6BAAA,GAAAC,sBAAA,CAAAN,OAAA;AACA,IAAAO,QAAA,GAAAD,sBAAA,CAAAN,OAAA;AAbA;AACA;AACA;;AAMA;AACA;AACA;;AAKA,SAASQ,oBAAoBA,CAAE;EAC9BC,SAAS;EACTC,WAAW;EACXC,aAAa;EACbC,SAAS;EACTC,eAAe;EACfC,iBAAiB;EACjBC,OAAO,GAAGA,CAAA,KAAM,CAAC;AAClB,CAAC,EAAG;EACH,MAAM;IAAEC;EAAc,CAAC,GAAG,IAAAC,iBAAW,EAAEC,YAAiB,CAAC;EACzD,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;IAC9B;IACA,MAAMC,SAAS,GAAG,IAAAC,yBAAiB,EAClCR,eAAe,EACfC,iBACD,CAAC;IACD,IAAKM,SAAS,EAAG;MAChBJ,aAAa,CAAEP,SAAS,EAAEW,SAAU,CAAC;IACtC;EACD,CAAC;EAED,MAAME,kBAAkB,GAAGA,CAAA,KAAM;IAChC,IAAIC,WAAW,GAAGV,eAAe,CAAE,CAAC,CAAE,CAACU,WAAW;IAClD,IAAK,CAAEA,WAAW,CAACC,MAAM,EAAG;MAC3B;IACD;IACA,IAAKZ,SAAS,EAAG;MAChBW,WAAW,GAAGX,SAAS,CACtBC,eAAe,CAAE,CAAC,CAAE,CAACY,UAAU,EAC/BZ,eAAe,CAAE,CAAC,CAAE,CAACU,WACtB,CAAC;IACF;IACAP,aAAa,CAAEP,SAAS,EAAEc,WAAY,CAAC;EACxC,CAAC;EAED,IAAK,CAAEb,WAAW,IAAI,CAAEC,aAAa,EAAG;IACvC,OAAO,IAAI;EACZ;EAEA,OACC,IAAAe,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAE,QAAA,QACGlB,WAAW,IACZ,IAAAgB,MAAA,CAAAC,aAAA,EAAC5B,WAAA,CAAA8B,QAAQ;IACRC,OAAO,EAAGA,CAAA,KAAM;MACfX,gBAAgB,CAAC,CAAC;MAClBJ,OAAO,CAAC,CAAC;IACV;EAAG,GAED,IAAAgB,QAAE,EAAE,OAAO,EAAE,MAAO,CACb,CACV,EACCpB,aAAa,IACd,IAAAe,MAAA,CAAAC,aAAA,EAAC5B,WAAA,CAAA8B,QAAQ;IACRC,OAAO,EAAGA,CAAA,KAAM;MACfR,kBAAkB,CAAC,CAAC;MACpBP,OAAO,CAAC,CAAC;IACV;EAAG,GAED,IAAAgB,QAAE,EACH,SAAS,EACT,+FACD,CACS,CAEV,CAAC;AAEL"}

package/build/components/convert-to-group-buttons/toolbar.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _data = require("@wordpress/data");
 var _blocks = require("@wordpress/blocks");
 var _components = require("@wordpress/components");
@@ -86,15 +86,15 @@ function BlockGroupToolbar() {
   const canInsertStack = !!variations.find(({
     name
   }) => name === 'group-stack');
-  return (0, _element.createElement)(_components.ToolbarGroup, null, (0, _element.createElement)(_components.ToolbarButton, {
+  return (0, _react.createElement)(_components.ToolbarGroup, null, (0, _react.createElement)(_components.ToolbarButton, {
     icon: _icons.group,
     label: (0, _i18n._x)('Group', 'verb'),
     onClick: onConvertToGroup
-  }), canInsertRow && (0, _element.createElement)(_components.ToolbarButton, {
+  }), canInsertRow && (0, _react.createElement)(_components.ToolbarButton, {
     icon: _icons.row,
     label: (0, _i18n._x)('Row', 'single horizontal line'),
     onClick: onConvertToRow
-  }), canInsertStack && (0, _element.createElement)(_components.ToolbarButton, {
+  }), canInsertStack && (0, _react.createElement)(_components.ToolbarButton, {
     icon: _icons.stack,
     label: (0, _i18n._x)('Stack', 'verb'),
     onClick: onConvertToStack

package/build/components/convert-to-group-buttons/toolbar.js.map

@@ -1 +1 @@
-{"version":3,"names":["_data","require","_blocks","_components","_icons","_i18n","_convertToGroupButtons","_store","layouts","group","type","row","flexWrap","stack","orientation","BlockGroupToolbar","blocksSelection","clientIds","groupingBlockName","isGroupable","useConvertToGroupButtonProps","replaceBlocks","useDispatch","blockEditorStore","canRemove","variations","useSelect","select","canRemoveBlocks","getBlockVariations","blocksStore","onConvertToGroup","layout","newBlocks","switchToBlockType","length","attributes","onConvertToRow","onConvertToStack","canInsertRow","find","name","canInsertStack","_element","createElement","ToolbarGroup","ToolbarButton","icon","label","_x","onClick","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/convert-to-group-buttons/toolbar.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { switchToBlockType, store as blocksStore } from '@wordpress/blocks';\nimport { ToolbarButton, ToolbarGroup } from '@wordpress/components';\nimport { group, row, stack } from '@wordpress/icons';\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useConvertToGroupButtonProps } from '../convert-to-group-buttons';\nimport { store as blockEditorStore } from '../../store';\n\nconst layouts = {\n\tgroup: { type: 'constrained' },\n\trow: { type: 'flex', flexWrap: 'nowrap' },\n\tstack: { type: 'flex', orientation: 'vertical' },\n};\n\nfunction BlockGroupToolbar() {\n\tconst { blocksSelection, clientIds, groupingBlockName, isGroupable } =\n\t\tuseConvertToGroupButtonProps();\n\tconst { replaceBlocks } = useDispatch( blockEditorStore );\n\n\tconst { canRemove, variations } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { canRemoveBlocks } = select( blockEditorStore );\n\t\t\tconst { getBlockVariations } = select( blocksStore );\n\n\t\t\treturn {\n\t\t\t\tcanRemove: canRemoveBlocks( clientIds ),\n\t\t\t\tvariations: getBlockVariations(\n\t\t\t\t\tgroupingBlockName,\n\t\t\t\t\t'transform'\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ clientIds, groupingBlockName ]\n\t);\n\n\tconst onConvertToGroup = ( layout ) => {\n\t\tconst newBlocks = switchToBlockType(\n\t\t\tblocksSelection,\n\t\t\tgroupingBlockName\n\t\t);\n\n\t\tif ( typeof layout !== 'string' ) {\n\t\t\tlayout = 'group';\n\t\t}\n\n\t\tif ( newBlocks && newBlocks.length > 0 ) {\n\t\t\t// Because the block is not in the store yet we can't use\n\t\t\t// updateBlockAttributes so need to manually update attributes.\n\t\t\tnewBlocks[ 0 ].attributes.layout = layouts[ layout ];\n\t\t\treplaceBlocks( clientIds, newBlocks );\n\t\t}\n\t};\n\n\tconst onConvertToRow = () => onConvertToGroup( 'row' );\n\tconst onConvertToStack = () => onConvertToGroup( 'stack' );\n\n\t// Don't render the button if the current selection cannot be grouped.\n\t// A good example is selecting multiple button blocks within a Buttons block:\n\t// The group block is not a valid child of Buttons, so we should not show the button.\n\t// Any blocks that are locked against removal also cannot be grouped.\n\tif ( ! isGroupable || ! canRemove ) {\n\t\treturn null;\n\t}\n\n\tconst canInsertRow = !! variations.find(\n\t\t( { name } ) => name === 'group-row'\n\t);\n\tconst canInsertStack = !! variations.find(\n\t\t( { name } ) => name === 'group-stack'\n\t);\n\n\treturn (\n\t\t<ToolbarGroup>\n\t\t\t<ToolbarButton\n\t\t\t\ticon={ group }\n\t\t\t\tlabel={ _x( 'Group', 'verb' ) }\n\t\t\t\tonClick={ onConvertToGroup }\n\t\t\t/>\n\t\t\t{ canInsertRow && (\n\t\t\t\t<ToolbarButton\n\t\t\t\t\ticon={ row }\n\t\t\t\t\tlabel={ _x( 'Row', 'single horizontal line' ) }\n\t\t\t\t\tonClick={ onConvertToRow }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ canInsertStack && (\n\t\t\t\t<ToolbarButton\n\t\t\t\t\ticon={ stack }\n\t\t\t\t\tlabel={ _x( 'Stack', 'verb' ) }\n\t\t\t\t\tonClick={ onConvertToStack }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</ToolbarGroup>\n\t);\n}\n\nexport default BlockGroupToolbar;\n"],"mappings":"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"}
+{"version":3,"names":["_data","require","_blocks","_components","_icons","_i18n","_convertToGroupButtons","_store","layouts","group","type","row","flexWrap","stack","orientation","BlockGroupToolbar","blocksSelection","clientIds","groupingBlockName","isGroupable","useConvertToGroupButtonProps","replaceBlocks","useDispatch","blockEditorStore","canRemove","variations","useSelect","select","canRemoveBlocks","getBlockVariations","blocksStore","onConvertToGroup","layout","newBlocks","switchToBlockType","length","attributes","onConvertToRow","onConvertToStack","canInsertRow","find","name","canInsertStack","_react","createElement","ToolbarGroup","ToolbarButton","icon","label","_x","onClick","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/convert-to-group-buttons/toolbar.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { switchToBlockType, store as blocksStore } from '@wordpress/blocks';\nimport { ToolbarButton, ToolbarGroup } from '@wordpress/components';\nimport { group, row, stack } from '@wordpress/icons';\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useConvertToGroupButtonProps } from '../convert-to-group-buttons';\nimport { store as blockEditorStore } from '../../store';\n\nconst layouts = {\n\tgroup: { type: 'constrained' },\n\trow: { type: 'flex', flexWrap: 'nowrap' },\n\tstack: { type: 'flex', orientation: 'vertical' },\n};\n\nfunction BlockGroupToolbar() {\n\tconst { blocksSelection, clientIds, groupingBlockName, isGroupable } =\n\t\tuseConvertToGroupButtonProps();\n\tconst { replaceBlocks } = useDispatch( blockEditorStore );\n\n\tconst { canRemove, variations } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { canRemoveBlocks } = select( blockEditorStore );\n\t\t\tconst { getBlockVariations } = select( blocksStore );\n\n\t\t\treturn {\n\t\t\t\tcanRemove: canRemoveBlocks( clientIds ),\n\t\t\t\tvariations: getBlockVariations(\n\t\t\t\t\tgroupingBlockName,\n\t\t\t\t\t'transform'\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ clientIds, groupingBlockName ]\n\t);\n\n\tconst onConvertToGroup = ( layout ) => {\n\t\tconst newBlocks = switchToBlockType(\n\t\t\tblocksSelection,\n\t\t\tgroupingBlockName\n\t\t);\n\n\t\tif ( typeof layout !== 'string' ) {\n\t\t\tlayout = 'group';\n\t\t}\n\n\t\tif ( newBlocks && newBlocks.length > 0 ) {\n\t\t\t// Because the block is not in the store yet we can't use\n\t\t\t// updateBlockAttributes so need to manually update attributes.\n\t\t\tnewBlocks[ 0 ].attributes.layout = layouts[ layout ];\n\t\t\treplaceBlocks( clientIds, newBlocks );\n\t\t}\n\t};\n\n\tconst onConvertToRow = () => onConvertToGroup( 'row' );\n\tconst onConvertToStack = () => onConvertToGroup( 'stack' );\n\n\t// Don't render the button if the current selection cannot be grouped.\n\t// A good example is selecting multiple button blocks within a Buttons block:\n\t// The group block is not a valid child of Buttons, so we should not show the button.\n\t// Any blocks that are locked against removal also cannot be grouped.\n\tif ( ! isGroupable || ! canRemove ) {\n\t\treturn null;\n\t}\n\n\tconst canInsertRow = !! variations.find(\n\t\t( { name } ) => name === 'group-row'\n\t);\n\tconst canInsertStack = !! variations.find(\n\t\t( { name } ) => name === 'group-stack'\n\t);\n\n\treturn (\n\t\t<ToolbarGroup>\n\t\t\t<ToolbarButton\n\t\t\t\ticon={ group }\n\t\t\t\tlabel={ _x( 'Group', 'verb' ) }\n\t\t\t\tonClick={ onConvertToGroup }\n\t\t\t/>\n\t\t\t{ canInsertRow && (\n\t\t\t\t<ToolbarButton\n\t\t\t\t\ticon={ row }\n\t\t\t\t\tlabel={ _x( 'Row', 'single horizontal line' ) }\n\t\t\t\t\tonClick={ onConvertToRow }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ canInsertStack && (\n\t\t\t\t<ToolbarButton\n\t\t\t\t\ticon={ stack }\n\t\t\t\t\tlabel={ _x( 'Stack', 'verb' ) }\n\t\t\t\t\tonClick={ onConvertToStack }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</ToolbarGroup>\n\t);\n}\n\nexport default BlockGroupToolbar;\n"],"mappings":"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"}