@wordpress/block-editor 10.2.0 → 10.4.0

package/build/components/colors-gradients/control.js

@@ -127,7 +127,7 @@ function ColorGradientControlSelect(props) {
 }
 
 function ColorGradientControl(props) {
-  if ((0, _lodash.every)(colorsAndGradientKeys, key => props.hasOwnProperty(key))) {
+  if (colorsAndGradientKeys.every(key => props.hasOwnProperty(key))) {
     return (0, _element.createElement)(ColorGradientControlInner, props);
   }
 

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/control.js"],"names":["colorsAndGradientKeys","TAB_COLOR","name","title","value","TAB_GRADIENT","TABS_SETTINGS","ColorGradientControlInner","colors","gradients","disableCustomColors","disableCustomGradients","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","className","label","onColorChange","onGradientChange","colorValue","gradientValue","clearable","showTitle","enableAlpha","canChooseAColor","canChooseAGradient","tabPanels","newColor","newGradient","renderPanelType","type","tab","ColorGradientControlSelect","props","colorGradientSettings","ColorGradientControl","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { every, isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tTabPanel,\n\tColorPalette,\n\tGradientPicker,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_COLOR = {\n\tname: 'color',\n\ttitle: 'Solid',\n\tvalue: 'color',\n};\nconst TAB_GRADIENT = {\n\tname: 'gradient',\n\ttitle: 'Gradient',\n\tvalue: 'gradient',\n};\n\nconst TABS_SETTINGS = [ TAB_COLOR, TAB_GRADIENT ];\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalHasMultipleOrigins,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange && ( ! isEmpty( colors ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ! isEmpty( gradients ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst tabPanels = {\n\t\t[ TAB_COLOR.value ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAGradient\n\t\t\t\t\t\t? ( newColor ) => {\n\t\t\t\t\t\t\t\tonColorChange( newColor );\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onColorChange\n\t\t\t\t}\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t}\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_GRADIENT.value ]: (\n\t\t\t<GradientPicker\n\t\t\t\t__nextHasNoMargin\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t}\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<TabPanel\n\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__tabs\"\n\t\t\t\t\t\t\ttabs={ TABS_SETTINGS }\n\t\t\t\t\t\t\tinitialTabName={\n\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t? TAB_GRADIENT.value\n\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_COLOR.value\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( tab ) => renderPanelType( tab.value ) }\n\t\t\t\t\t\t</TabPanel>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canChooseAGradient &&\n\t\t\t\t\t\trenderPanelType( TAB_COLOR.value ) }\n\t\t\t\t\t{ ! canChooseAColor &&\n\t\t\t\t\t\trenderPanelType( TAB_GRADIENT.value ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst colorGradientSettings = {};\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\tcolorGradientSettings.disableCustomColors = ! useSetting( 'color.custom' );\n\tcolorGradientSettings.disableCustomGradients = ! useSetting(\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tevery( colorsAndGradientKeys, ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/control.js"],"names":["colorsAndGradientKeys","TAB_COLOR","name","title","value","TAB_GRADIENT","TABS_SETTINGS","ColorGradientControlInner","colors","gradients","disableCustomColors","disableCustomGradients","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","className","label","onColorChange","onGradientChange","colorValue","gradientValue","clearable","showTitle","enableAlpha","canChooseAColor","canChooseAGradient","tabPanels","newColor","newGradient","renderPanelType","type","tab","ColorGradientControlSelect","props","colorGradientSettings","ColorGradientControl","every","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tTabPanel,\n\tColorPalette,\n\tGradientPicker,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_COLOR = {\n\tname: 'color',\n\ttitle: 'Solid',\n\tvalue: 'color',\n};\nconst TAB_GRADIENT = {\n\tname: 'gradient',\n\ttitle: 'Gradient',\n\tvalue: 'gradient',\n};\n\nconst TABS_SETTINGS = [ TAB_COLOR, TAB_GRADIENT ];\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalHasMultipleOrigins,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange && ( ! isEmpty( colors ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ! isEmpty( gradients ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst tabPanels = {\n\t\t[ TAB_COLOR.value ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAGradient\n\t\t\t\t\t\t? ( newColor ) => {\n\t\t\t\t\t\t\t\tonColorChange( newColor );\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onColorChange\n\t\t\t\t}\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t}\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_GRADIENT.value ]: (\n\t\t\t<GradientPicker\n\t\t\t\t__nextHasNoMargin\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t}\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<TabPanel\n\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__tabs\"\n\t\t\t\t\t\t\ttabs={ TABS_SETTINGS }\n\t\t\t\t\t\t\tinitialTabName={\n\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t? TAB_GRADIENT.value\n\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_COLOR.value\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( tab ) => renderPanelType( tab.value ) }\n\t\t\t\t\t\t</TabPanel>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canChooseAGradient &&\n\t\t\t\t\t\trenderPanelType( TAB_COLOR.value ) }\n\t\t\t\t\t{ ! canChooseAColor &&\n\t\t\t\t\t\trenderPanelType( TAB_GRADIENT.value ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst colorGradientSettings = {};\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\tcolorGradientSettings.disableCustomColors = ! useSetting( 'color.custom' );\n\tcolorGradientSettings.disableCustomGradients = ! useSetting(\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"]}

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

@@ -62,7 +62,7 @@ const PanelColorGradientSettingsInner = _ref => {
     batch
   } = (0, _data.useRegistry)();
 
-  if ((0, _lodash.isEmpty)(colors) && (0, _lodash.isEmpty)(gradients) && disableCustomColors && disableCustomGradients && (0, _lodash.every)(settings, setting => (0, _lodash.isEmpty)(setting.colors) && (0, _lodash.isEmpty)(setting.gradients) && (setting.disableCustomColors === undefined || setting.disableCustomColors) && (setting.disableCustomGradients === undefined || setting.disableCustomGradients))) {
+  if ((0, _lodash.isEmpty)(colors) && (0, _lodash.isEmpty)(gradients) && disableCustomColors && disableCustomGradients && settings !== null && settings !== void 0 && settings.every(setting => (0, _lodash.isEmpty)(setting.colors) && (0, _lodash.isEmpty)(setting.gradients) && (setting.disableCustomColors === undefined || setting.disableCustomColors) && (setting.disableCustomGradients === undefined || setting.disableCustomGradients))) {
     return null;
   }
 
@@ -120,7 +120,7 @@ const PanelColorGradientSettingsMultipleSelect = props => {
 };
 
 const PanelColorGradientSettings = props => {
-  if ((0, _lodash.every)(colorsAndGradientKeys, key => props.hasOwnProperty(key))) {
+  if (colorsAndGradientKeys.every(key => props.hasOwnProperty(key))) {
     return (0, _element.createElement)(PanelColorGradientSettingsInner, props);
   }
 

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"names":["colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","enableAlpha","panelId","batch","setting","undefined","forEach","colorValue","gradientValue","onColorChange","onGradientChange","PanelColorGradientSettingsSingleSelect","props","colorGradientSettings","PanelColorGradientSettingsMultipleSelect","PanelColorGradientSettings","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { every, isEmpty } from 'lodash';\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 useSetting from '../use-setting';\nimport useCommonSingleMultipleSelects from './use-common-single-multiple-selects';\nimport useMultipleOriginColorsAndGradients 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__experimentalHasMultipleOrigins,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\tisEmpty( colors ) &&\n\t\tisEmpty( gradients ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tevery(\n\t\t\tsettings,\n\t\t\t( setting ) =>\n\t\t\t\tisEmpty( setting.colors ) &&\n\t\t\t\tisEmpty( setting.gradients ) &&\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__experimentalHasMultipleOrigins,\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 PanelColorGradientSettingsSingleSelect = ( props ) => {\n\tconst colorGradientSettings = useCommonSingleMultipleSelects();\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettingsMultipleSelect = ( props ) => {\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\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\tevery( colorsAndGradientKeys, ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\tif ( props.__experimentalHasMultipleOrigins ) {\n\t\treturn <PanelColorGradientSettingsMultipleSelect { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSingleSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"names":["colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","enableAlpha","panelId","batch","every","setting","undefined","forEach","colorValue","gradientValue","onColorChange","onGradientChange","PanelColorGradientSettingsSingleSelect","props","colorGradientSettings","PanelColorGradientSettingsMultipleSelect","PanelColorGradientSettings","key","hasOwnProperty"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AAIA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AAtBA;AACA;AACA;;AAIA;AACA;AACA;;AAQA;AACA;AACA;AAMA,MAAMA,qBAAqB,GAAG,CAC7B,QAD6B,EAE7B,qBAF6B,EAG7B,WAH6B,EAI7B,wBAJ6B,CAA9B;;AAOO,MAAMC,+BAA+B,GAAG,QAaxC;AAAA,MAb0C;AAChDC,IAAAA,SADgD;AAEhDC,IAAAA,MAFgD;AAGhDC,IAAAA,SAHgD;AAIhDC,IAAAA,mBAJgD;AAKhDC,IAAAA,sBALgD;AAMhDC,IAAAA,QANgD;AAOhDC,IAAAA,QAPgD;AAQhDC,IAAAA,KARgD;AAShDC,IAAAA,SAAS,GAAG,IAToC;AAUhDC,IAAAA,gCAVgD;AAWhDC,IAAAA,iCAXgD;AAYhDC,IAAAA;AAZgD,GAa1C;AACN,QAAMC,OAAO,GAAG,4BAAeb,+BAAf,CAAhB;AACA,QAAM;AAAEc,IAAAA;AAAF,MAAY,wBAAlB;;AACA,MACC,qBAASZ,MAAT,KACA,qBAASC,SAAT,CADA,IAEAC,mBAFA,IAGAC,sBAHA,IAIAE,QAJA,aAIAA,QAJA,eAIAA,QAAQ,CAAEQ,KAAV,CACGC,OAAF,IACC,qBAASA,OAAO,CAACd,MAAjB,KACA,qBAASc,OAAO,CAACb,SAAjB,CADA,KAEEa,OAAO,CAACZ,mBAAR,KAAgCa,SAAhC,IACDD,OAAO,CAACZ,mBAHT,MAIEY,OAAO,CAACX,sBAAR,KAAmCY,SAAnC,IACDD,OAAO,CAACX,sBALT,CAFF,CALD,EAcE;AACD,WAAO,IAAP;AACA;;AAED,SACC,4BAAC,oCAAD;AACC,IAAA,SAAS,EAAG,yBACX,4CADW,EAEXJ,SAFW,CADb;AAKC,IAAA,KAAK,EAAGQ,SAAS,GAAGD,KAAH,GAAWS,SAL7B;AAMC,IAAA,QAAQ,EAAG,MAAM;AAChBH,MAAAA,KAAK,CAAE,MAAM;AACZP,QAAAA,QAAQ,CAACW,OAAT,CACC,SAKO;AAAA,cALL;AACDC,YAAAA,UADC;AAEDC,YAAAA,aAFC;AAGDC,YAAAA,aAHC;AAIDC,YAAAA;AAJC,WAKK;;AACN,cAAKH,UAAL,EAAkB;AACjBE,YAAAA,aAAa;AACb,WAFD,MAEO,IAAKD,aAAL,EAAqB;AAC3BE,YAAAA,gBAAgB;AAChB;AACD,SAZF;AAcA,OAfI,CAAL;AAgBA,KAvBF;AAwBC,IAAA,OAAO,EAAGT,OAxBX;AAyBC,IAAA,mCAAmC,EAAC,OAzBrC;AA0BC,IAAA,kCAAkC,EAAC;AA1BpC,KA4BC,4BAAC,iBAAD;AACC,IAAA,QAAQ,EAAGN,QADZ;AAEC,IAAA,OAAO,EAAGM,OAFX;AAIEX,IAAAA,MAJF;AAKEC,IAAAA,SALF;AAMEC,IAAAA,mBANF;AAOEC,IAAAA,sBAPF;AAQEK,IAAAA,gCARF;AASEC,IAAAA,iCATF;AAUEC,IAAAA;AAVF,IA5BD,EAyCG,CAAC,CAAEN,QAAH,IACD,qDACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,IADD,OAC4BA,QAD5B,CA1CF,CADD;AAiDA,CAnFM;;;;AAqFP,MAAMiB,sCAAsC,GAAKC,KAAF,IAAa;AAC3D,QAAMC,qBAAqB,GAAG,8CAA9B;AACAA,EAAAA,qBAAqB,CAACvB,MAAtB,GAA+B,yBAAY,eAAZ,CAA/B;AACAuB,EAAAA,qBAAqB,CAACtB,SAAtB,GAAkC,yBAAY,iBAAZ,CAAlC;AACA,SACC,4BAAC,+BAAD,6BACWsB,qBADX,EACqCD,KADrC,EADD;AAKA,CATD;;AAWA,MAAME,wCAAwC,GAAKF,KAAF,IAAa;AAC7D,QAAMC,qBAAqB,GAAG,mDAA9B;AACA,SACC,4BAAC,+BAAD,6BACWA,qBADX,EACqCD,KADrC,EADD;AAKA,CAPD;;AASA,MAAMG,0BAA0B,GAAKH,KAAF,IAAa;AAC/C,MACCzB,qBAAqB,CAACgB,KAAtB,CAA+Ba,GAAF,IAAWJ,KAAK,CAACK,cAAN,CAAsBD,GAAtB,CAAxC,CADD,EAEE;AACD,WAAO,4BAAC,+BAAD,EAAsCJ,KAAtC,CAAP;AACA;;AACD,MAAKA,KAAK,CAACd,gCAAX,EAA8C;AAC7C,WAAO,4BAAC,wCAAD,EAA+Cc,KAA/C,CAAP;AACA;;AACD,SAAO,4BAAC,sCAAD,EAA6CA,KAA7C,CAAP;AACA,CAVD;;eAYeG,0B","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { isEmpty } from 'lodash';\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 useSetting from '../use-setting';\nimport useCommonSingleMultipleSelects from './use-common-single-multiple-selects';\nimport useMultipleOriginColorsAndGradients 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__experimentalHasMultipleOrigins,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\tisEmpty( colors ) &&\n\t\tisEmpty( gradients ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tsettings?.every(\n\t\t\t( setting ) =>\n\t\t\t\tisEmpty( setting.colors ) &&\n\t\t\t\tisEmpty( setting.gradients ) &&\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__experimentalHasMultipleOrigins,\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 PanelColorGradientSettingsSingleSelect = ( props ) => {\n\tconst colorGradientSettings = useCommonSingleMultipleSelects();\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettingsMultipleSelect = ( props ) => {\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\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\tif ( props.__experimentalHasMultipleOrigins ) {\n\t\treturn <PanelColorGradientSettingsMultipleSelect { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSingleSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"]}

package/build/components/duotone-control/index.js

@@ -47,7 +47,7 @@ function DuotoneControl(_ref) {
     popoverProps: {
       className: 'block-editor-duotone-control__popover',
       headerTitle: (0, _i18n.__)('Duotone'),
-      isAlternate: true
+      variant: 'toolbar'
     },
     renderToggle: _ref2 => {
       let {

package/build/components/duotone-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/duotone-control/index.js"],"names":["DuotoneControl","colorPalette","duotonePalette","disableCustomColors","disableCustomDuotone","value","onChange","toolbarIcon","filter","className","headerTitle","isAlternate","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault"],"mappings":";;;;;;;;;AAGA;;AAQA;;AACA;;AACA;;AAbA;AACA;AACA;AAaA,SAASA,cAAT,OAOI;AAAA,MAPqB;AACxBC,IAAAA,YADwB;AAExBC,IAAAA,cAFwB;AAGxBC,IAAAA,mBAHwB;AAIxBC,IAAAA,oBAJwB;AAKxBC,IAAAA,KALwB;AAMxBC,IAAAA;AANwB,GAOrB;AACH,MAAIC,WAAJ;;AACA,MAAKF,KAAK,KAAK,OAAf,EAAyB;AACxBE,IAAAA,WAAW,GACV,4BAAC,0BAAD;AAAgB,MAAA,SAAS,EAAC;AAA1B,MADD;AAGA,GAJD,MAIO,IAAKF,KAAL,EAAa;AACnBE,IAAAA,WAAW,GAAG,4BAAC,yBAAD;AAAe,MAAA,MAAM,EAAGF;AAAxB,MAAd;AACA,GAFM,MAEA;AACNE,IAAAA,WAAW,GAAG,4BAAC,WAAD;AAAM,MAAA,IAAI,EAAGC;AAAb,MAAd;AACA;;AACD,SACC,4BAAC,oBAAD;AACC,IAAA,YAAY,EAAG;AACdC,MAAAA,SAAS,EAAE,uCADG;AAEdC,MAAAA,WAAW,EAAE,cAAI,SAAJ,CAFC;AAGdC,MAAAA,WAAW,EAAE;AAHC,KADhB;AAMC,IAAA,YAAY,EAAG,SAA4B;AAAA,UAA1B;AAAEC,QAAAA,MAAF;AAAUC,QAAAA;AAAV,OAA0B;;AAC1C,YAAMC,eAAe,GAAKC,KAAF,IAAa;AACpC,YAAK,CAAEH,MAAF,IAAYG,KAAK,CAACC,OAAN,KAAkBC,cAAnC,EAA0C;AACzCF,UAAAA,KAAK,CAACG,cAAN;AACAL,UAAAA,QAAQ;AACR;AACD,OALD;;AAMA,aACC,4BAAC,yBAAD;AACC,QAAA,WAAW,MADZ;AAEC,QAAA,OAAO,EAAGA,QAFX;AAGC,yBAAc,MAHf;AAIC,yBAAgBD,MAJjB;AAKC,QAAA,SAAS,EAAGE,eALb;AAMC,QAAA,KAAK,EAAG,cAAI,sBAAJ,CANT;AAOC,QAAA,IAAI,EAAGP;AAPR,QADD;AAWA,KAxBF;AAyBC,IAAA,aAAa,EAAG,MACf,4BAAC,qBAAD;AAAW,MAAA,KAAK,EAAG,cAAI,SAAJ;AAAnB,OACC;AAAK,MAAA,SAAS,EAAC;AAAf,OACG,cACD,oEADC,CADH,CADD,EAMC,4BAAC,yBAAD;AACC,MAAA,YAAY,EAAGN,YADhB;AAEC,MAAA,cAAc,EAAGC,cAFlB;AAGC,MAAA,mBAAmB,EAAGC,mBAHvB;AAIC,MAAA,oBAAoB,EAAGC,oBAJxB;AAKC,MAAA,KAAK,EAAGC,KALT;AAMC,MAAA,QAAQ,EAAGC;AANZ,MAND;AA1BF,IADD;AA6CA;;eAEcN,c","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tColorIndicator,\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\n\nfunction DuotoneControl( {\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\tlet toolbarIcon;\n\tif ( value === 'unset' ) {\n\t\ttoolbarIcon = (\n\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t);\n\t} else if ( value ) {\n\t\ttoolbarIcon = <DuotoneSwatch values={ value } />;\n\t} else {\n\t\ttoolbarIcon = <Icon icon={ filter } />;\n\t}\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t\tisAlternate: true,\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ __( 'Apply duotone filter' ) }\n\t\t\t\t\t\ticon={ toolbarIcon }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<div className=\"block-editor-duotone-control__description\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/duotone-control/index.js"],"names":["DuotoneControl","colorPalette","duotonePalette","disableCustomColors","disableCustomDuotone","value","onChange","toolbarIcon","filter","className","headerTitle","variant","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault"],"mappings":";;;;;;;;;AAGA;;AAQA;;AACA;;AACA;;AAbA;AACA;AACA;AAaA,SAASA,cAAT,OAOI;AAAA,MAPqB;AACxBC,IAAAA,YADwB;AAExBC,IAAAA,cAFwB;AAGxBC,IAAAA,mBAHwB;AAIxBC,IAAAA,oBAJwB;AAKxBC,IAAAA,KALwB;AAMxBC,IAAAA;AANwB,GAOrB;AACH,MAAIC,WAAJ;;AACA,MAAKF,KAAK,KAAK,OAAf,EAAyB;AACxBE,IAAAA,WAAW,GACV,4BAAC,0BAAD;AAAgB,MAAA,SAAS,EAAC;AAA1B,MADD;AAGA,GAJD,MAIO,IAAKF,KAAL,EAAa;AACnBE,IAAAA,WAAW,GAAG,4BAAC,yBAAD;AAAe,MAAA,MAAM,EAAGF;AAAxB,MAAd;AACA,GAFM,MAEA;AACNE,IAAAA,WAAW,GAAG,4BAAC,WAAD;AAAM,MAAA,IAAI,EAAGC;AAAb,MAAd;AACA;;AACD,SACC,4BAAC,oBAAD;AACC,IAAA,YAAY,EAAG;AACdC,MAAAA,SAAS,EAAE,uCADG;AAEdC,MAAAA,WAAW,EAAE,cAAI,SAAJ,CAFC;AAGdC,MAAAA,OAAO,EAAE;AAHK,KADhB;AAMC,IAAA,YAAY,EAAG,SAA4B;AAAA,UAA1B;AAAEC,QAAAA,MAAF;AAAUC,QAAAA;AAAV,OAA0B;;AAC1C,YAAMC,eAAe,GAAKC,KAAF,IAAa;AACpC,YAAK,CAAEH,MAAF,IAAYG,KAAK,CAACC,OAAN,KAAkBC,cAAnC,EAA0C;AACzCF,UAAAA,KAAK,CAACG,cAAN;AACAL,UAAAA,QAAQ;AACR;AACD,OALD;;AAMA,aACC,4BAAC,yBAAD;AACC,QAAA,WAAW,MADZ;AAEC,QAAA,OAAO,EAAGA,QAFX;AAGC,yBAAc,MAHf;AAIC,yBAAgBD,MAJjB;AAKC,QAAA,SAAS,EAAGE,eALb;AAMC,QAAA,KAAK,EAAG,cAAI,sBAAJ,CANT;AAOC,QAAA,IAAI,EAAGP;AAPR,QADD;AAWA,KAxBF;AAyBC,IAAA,aAAa,EAAG,MACf,4BAAC,qBAAD;AAAW,MAAA,KAAK,EAAG,cAAI,SAAJ;AAAnB,OACC;AAAK,MAAA,SAAS,EAAC;AAAf,OACG,cACD,oEADC,CADH,CADD,EAMC,4BAAC,yBAAD;AACC,MAAA,YAAY,EAAGN,YADhB;AAEC,MAAA,cAAc,EAAGC,cAFlB;AAGC,MAAA,mBAAmB,EAAGC,mBAHvB;AAIC,MAAA,oBAAoB,EAAGC,oBAJxB;AAKC,MAAA,KAAK,EAAGC,KALT;AAMC,MAAA,QAAQ,EAAGC;AANZ,MAND;AA1BF,IADD;AA6CA;;eAEcN,c","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tColorIndicator,\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\n\nfunction DuotoneControl( {\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\tlet toolbarIcon;\n\tif ( value === 'unset' ) {\n\t\ttoolbarIcon = (\n\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t);\n\t} else if ( value ) {\n\t\ttoolbarIcon = <DuotoneSwatch values={ value } />;\n\t} else {\n\t\ttoolbarIcon = <Icon icon={ filter } />;\n\t}\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t\tvariant: 'toolbar',\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ __( 'Apply duotone filter' ) }\n\t\t\t\t\t\ticon={ toolbarIcon }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<div className=\"block-editor-duotone-control__description\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"]}

package/build/components/font-sizes/fluid-utils.js

@@ -0,0 +1,256 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getComputedFluidTypographyValue = getComputedFluidTypographyValue;
+exports.getTypographyValueAndUnit = getTypographyValueAndUnit;
+exports.roundToPrecision = roundToPrecision;
+
+/**
+ * The fluid utilities must match the backend equivalent.
+ * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php
+ * ---------------------------------------------------------------
+ */
+// Defaults.
+const DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';
+const DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';
+const DEFAULT_SCALE_FACTOR = 1;
+const DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;
+const DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;
+const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';
+/**
+ * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum
+ * font size OR a single font size can be specified.
+ *
+ * If a single font size is specified, it is scaled up and down by
+ * minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and
+ * maximum sizes.
+ *
+ * @example
+ * ```js
+ * // Calculate fluid font-size value from a minimum and maximum value.
+ * const fontSize = getComputedFluidTypographyValue( {
+ *     minimumFontSize: '20px',
+ *     maximumFontSize: '45px'
+ * } );
+ * // Calculate fluid font-size value from a single font size.
+ * const fontSize = getComputedFluidTypographyValue( {
+ *     fontSize: '30px',
+ * } );
+ * ```
+ *
+ * @param {Object}        args
+ * @param {?string}       args.minimumViewPortWidth  Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.
+ * @param {?string}       args.maximumViewPortWidth  Maximum size up to which type will have fluidity. Optional if fontSize is specified.
+ * @param {string|number} [args.fontSize]            Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.
+ * @param {?string}       args.maximumFontSize       Maximum font size for any clamp() calculation. Optional.
+ * @param {?string}       args.minimumFontSize       Minimum font size for any clamp() calculation. Optional.
+ * @param {?number}       args.scaleFactor           A scale factor to determine how fast a font scales within boundaries. Optional.
+ * @param {?number}       args.minimumFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.
+ * @param {?number}       args.maximumFontSizeFactor How much to scale defaultFontSize by to derive maximumFontSize. Optional.
+ *
+ * @return {string|null} A font-size value using clamp().
+ */
+
+function getComputedFluidTypographyValue(_ref) {
+  let {
+    minimumFontSize,
+    maximumFontSize,
+    fontSize,
+    minimumViewPortWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,
+    maximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,
+    scaleFactor = DEFAULT_SCALE_FACTOR,
+    minimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,
+    maximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,
+    minimumFontSizeLimit = DEFAULT_MINIMUM_FONT_SIZE_LIMIT
+  } = _ref;
+
+  /*
+   * Caches minimumFontSize in minimumFontSizeValue
+   * so we can check if minimumFontSize exists later.
+   */
+  let minimumFontSizeValue = minimumFontSize;
+  /*
+   * Calculates missing minimumFontSize and maximumFontSize from
+   * defaultFontSize if provided.
+   */
+
+  if (fontSize) {
+    // Parses default font size.
+    const fontSizeParsed = getTypographyValueAndUnit(fontSize); // Protect against invalid units.
+
+    if (!(fontSizeParsed !== null && fontSizeParsed !== void 0 && fontSizeParsed.unit)) {
+      return null;
+    } // If no minimumFontSize is provided, derive using min scale factor.
+
+
+    if (!minimumFontSizeValue) {
+      minimumFontSizeValue = roundToPrecision(fontSizeParsed.value * minimumFontSizeFactor, 3) + fontSizeParsed.unit;
+    } // Parses the minimum font size limit, so we can perform checks using it.
+
+
+    const minimumFontSizeLimitParsed = getTypographyValueAndUnit(minimumFontSizeLimit, {
+      coerceTo: fontSizeParsed.unit
+    });
+
+    if (!!(minimumFontSizeLimitParsed !== null && minimumFontSizeLimitParsed !== void 0 && minimumFontSizeLimitParsed.value)) {
+      /*
+       * If a minimum size was not passed to this function
+       * and the user-defined font size is lower than `minimumFontSizeLimit`,
+       * then uses the user-defined font size as the minimum font-size.
+       */
+      if (!minimumFontSize && (fontSizeParsed === null || fontSizeParsed === void 0 ? void 0 : fontSizeParsed.value) < (minimumFontSizeLimitParsed === null || minimumFontSizeLimitParsed === void 0 ? void 0 : minimumFontSizeLimitParsed.value)) {
+        minimumFontSizeValue = `${fontSizeParsed.value}${fontSizeParsed.unit}`;
+      } else {
+        const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSizeValue, {
+          coerceTo: fontSizeParsed.unit
+        });
+        /*
+         * Otherwise, if the passed or calculated minimum font size is lower than `minimumFontSizeLimit`
+         * use `minimumFontSizeLimit` instead.
+         */
+
+        if (!!(minimumFontSizeParsed !== null && minimumFontSizeParsed !== void 0 && minimumFontSizeParsed.value) && minimumFontSizeParsed.value < minimumFontSizeLimitParsed.value) {
+          minimumFontSizeValue = `${minimumFontSizeLimitParsed.value}${minimumFontSizeLimitParsed.unit}`;
+        }
+      }
+    } // If no maximumFontSize is provided, derive using max scale factor.
+
+
+    if (!maximumFontSize) {
+      maximumFontSize = roundToPrecision(fontSizeParsed.value * maximumFontSizeFactor, 3) + fontSizeParsed.unit;
+    }
+  } // Return early if one of the provided inputs is not provided.
+
+
+  if (!minimumFontSizeValue || !maximumFontSize) {
+    return null;
+  } // Grab the minimum font size and normalize it in order to use the value for calculations.
+
+
+  const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSizeValue); // We get a 'preferred' unit to keep units consistent when calculating,
+  // otherwise the result will not be accurate.
+
+  const fontSizeUnit = (minimumFontSizeParsed === null || minimumFontSizeParsed === void 0 ? void 0 : minimumFontSizeParsed.unit) || 'rem'; // Grabs the maximum font size and normalize it in order to use the value for calculations.
+
+  const maximumFontSizeParsed = getTypographyValueAndUnit(maximumFontSize, {
+    coerceTo: fontSizeUnit
+  }); // Checks for mandatory min and max sizes, and protects against unsupported units.
+
+  if (!minimumFontSizeParsed || !maximumFontSizeParsed) {
+    return null;
+  } // Uses rem for accessible fluid target font scaling.
+
+
+  const minimumFontSizeRem = getTypographyValueAndUnit(minimumFontSizeValue, {
+    coerceTo: 'rem'
+  }); // Viewport widths defined for fluid typography. Normalize units
+
+  const maximumViewPortWidthParsed = getTypographyValueAndUnit(maximumViewPortWidth, {
+    coerceTo: fontSizeUnit
+  });
+  const minumumViewPortWidthParsed = getTypographyValueAndUnit(minimumViewPortWidth, {
+    coerceTo: fontSizeUnit
+  }); // Protect against unsupported units.
+
+  if (!maximumViewPortWidthParsed || !minumumViewPortWidthParsed || !minimumFontSizeRem) {
+    return null;
+  } // Build CSS rule.
+  // Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.
+
+
+  const minViewPortWidthOffsetValue = roundToPrecision(minumumViewPortWidthParsed.value / 100, 3);
+  const viewPortWidthOffset = roundToPrecision(minViewPortWidthOffsetValue, 3) + fontSizeUnit;
+  const linearFactor = 100 * ((maximumFontSizeParsed.value - minimumFontSizeParsed.value) / (maximumViewPortWidthParsed.value - minumumViewPortWidthParsed.value));
+  const linearFactorScaled = roundToPrecision((linearFactor || 1) * scaleFactor, 3);
+  const fluidTargetFontSize = `${minimumFontSizeRem.value}${minimumFontSizeRem.unit} + ((1vw - ${viewPortWidthOffset}) * ${linearFactorScaled})`;
+  return `clamp(${minimumFontSizeValue}, ${fluidTargetFontSize}, ${maximumFontSize})`;
+}
+/**
+ * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].
+ * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.
+ *
+ * @param {string|number}    rawValue Raw size value from theme.json.
+ * @param {Object|undefined} options  Calculation options.
+ *
+ * @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties.
+ */
+
+
+function getTypographyValueAndUnit(rawValue) {
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+  if (typeof rawValue !== 'string' && typeof rawValue !== 'number') {
+    return null;
+  } // Converts numeric values to pixel values by default.
+
+
+  if (isFinite(rawValue)) {
+    rawValue = `${rawValue}px`;
+  }
+
+  const {
+    coerceTo,
+    rootSizeValue,
+    acceptableUnits
+  } = {
+    coerceTo: '',
+    // Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( "html" ) ).fontSize`.
+    rootSizeValue: 16,
+    acceptableUnits: ['rem', 'px', 'em'],
+    ...options
+  };
+  const acceptableUnitsGroup = acceptableUnits === null || acceptableUnits === void 0 ? void 0 : acceptableUnits.join('|');
+  const regexUnits = new RegExp(`^(\\d*\\.?\\d+)(${acceptableUnitsGroup}){1,1}$`);
+  const matches = rawValue.match(regexUnits); // We need a number value and a unit.
+
+  if (!matches || matches.length < 3) {
+    return null;
+  }
+
+  let [, value, unit] = matches;
+  let returnValue = parseFloat(value);
+
+  if ('px' === coerceTo && ('em' === unit || 'rem' === unit)) {
+    returnValue = returnValue * rootSizeValue;
+    unit = coerceTo;
+  }
+
+  if ('px' === unit && ('em' === coerceTo || 'rem' === coerceTo)) {
+    returnValue = returnValue / rootSizeValue;
+    unit = coerceTo;
+  }
+  /*
+   * No calculation is required if swapping between em and rem yet,
+   * since we assume a root size value. Later we might like to differentiate between
+   * :root font size (rem) and parent element font size (em) relativity.
+   */
+
+
+  if (('em' === coerceTo || 'rem' === coerceTo) && ('em' === unit || 'rem' === unit)) {
+    unit = coerceTo;
+  }
+
+  return {
+    value: roundToPrecision(returnValue, 3),
+    unit
+  };
+}
+/**
+ * Returns a value rounded to defined precision.
+ * Returns `undefined` if the value is not a valid finite number.
+ *
+ * @param {number} value  Raw value.
+ * @param {number} digits The number of digits to appear after the decimal point
+ *
+ * @return {number|undefined} Value rounded to standard precision.
+ */
+
+
+function roundToPrecision(value) {
+  let digits = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
+  const base = Math.pow(10, digits);
+  return Number.isFinite(value) ? parseFloat(Math.round(value * base) / base) : undefined;
+}
+//# sourceMappingURL=fluid-utils.js.map

package/build/components/font-sizes/fluid-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/fluid-utils.js"],"names":["DEFAULT_MAXIMUM_VIEWPORT_WIDTH","DEFAULT_MINIMUM_VIEWPORT_WIDTH","DEFAULT_SCALE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_FACTOR","DEFAULT_MAXIMUM_FONT_SIZE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_LIMIT","getComputedFluidTypographyValue","minimumFontSize","maximumFontSize","fontSize","minimumViewPortWidth","maximumViewPortWidth","scaleFactor","minimumFontSizeFactor","maximumFontSizeFactor","minimumFontSizeLimit","minimumFontSizeValue","fontSizeParsed","getTypographyValueAndUnit","unit","roundToPrecision","value","minimumFontSizeLimitParsed","coerceTo","minimumFontSizeParsed","fontSizeUnit","maximumFontSizeParsed","minimumFontSizeRem","maximumViewPortWidthParsed","minumumViewPortWidthParsed","minViewPortWidthOffsetValue","viewPortWidthOffset","linearFactor","linearFactorScaled","fluidTargetFontSize","rawValue","options","isFinite","rootSizeValue","acceptableUnits","acceptableUnitsGroup","join","regexUnits","RegExp","matches","match","length","returnValue","parseFloat","digits","base","Math","pow","Number","round","undefined"],"mappings":"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","sourcesContent":["/**\n * The fluid utilities must match the backend equivalent.\n * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php\n * ---------------------------------------------------------------\n */\n\n// Defaults.\nconst DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';\nconst DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';\nconst DEFAULT_SCALE_FACTOR = 1;\nconst DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;\nconst DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;\nconst DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';\n\n/**\n * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum\n * font size OR a single font size can be specified.\n *\n * If a single font size is specified, it is scaled up and down by\n * minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and\n * maximum sizes.\n *\n * @example\n * ```js\n * // Calculate fluid font-size value from a minimum and maximum value.\n * const fontSize = getComputedFluidTypographyValue( {\n *     minimumFontSize: '20px',\n *     maximumFontSize: '45px'\n * } );\n * // Calculate fluid font-size value from a single font size.\n * const fontSize = getComputedFluidTypographyValue( {\n *     fontSize: '30px',\n * } );\n * ```\n *\n * @param {Object}        args\n * @param {?string}       args.minimumViewPortWidth  Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.\n * @param {?string}       args.maximumViewPortWidth  Maximum size up to which type will have fluidity. Optional if fontSize is specified.\n * @param {string|number} [args.fontSize]            Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.\n * @param {?string}       args.maximumFontSize       Maximum font size for any clamp() calculation. Optional.\n * @param {?string}       args.minimumFontSize       Minimum font size for any clamp() calculation. Optional.\n * @param {?number}       args.scaleFactor           A scale factor to determine how fast a font scales within boundaries. Optional.\n * @param {?number}       args.minimumFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.\n * @param {?number}       args.maximumFontSizeFactor How much to scale defaultFontSize by to derive maximumFontSize. Optional.\n *\n * @return {string|null} A font-size value using clamp().\n */\nexport function getComputedFluidTypographyValue( {\n\tminimumFontSize,\n\tmaximumFontSize,\n\tfontSize,\n\tminimumViewPortWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,\n\tmaximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,\n\tscaleFactor = DEFAULT_SCALE_FACTOR,\n\tminimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,\n\tmaximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,\n\tminimumFontSizeLimit = DEFAULT_MINIMUM_FONT_SIZE_LIMIT,\n} ) {\n\t/*\n\t * Caches minimumFontSize in minimumFontSizeValue\n\t * so we can check if minimumFontSize exists later.\n\t */\n\tlet minimumFontSizeValue = minimumFontSize;\n\n\t/*\n\t * Calculates missing minimumFontSize and maximumFontSize from\n\t * defaultFontSize if provided.\n\t */\n\tif ( fontSize ) {\n\t\t// Parses default font size.\n\t\tconst fontSizeParsed = getTypographyValueAndUnit( fontSize );\n\n\t\t// Protect against invalid units.\n\t\tif ( ! fontSizeParsed?.unit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\t// If no minimumFontSize is provided, derive using min scale factor.\n\t\tif ( ! minimumFontSizeValue ) {\n\t\t\tminimumFontSizeValue =\n\t\t\t\troundToPrecision(\n\t\t\t\t\tfontSizeParsed.value * minimumFontSizeFactor,\n\t\t\t\t\t3\n\t\t\t\t) + fontSizeParsed.unit;\n\t\t}\n\n\t\t// Parses the minimum font size limit, so we can perform checks using it.\n\t\tconst minimumFontSizeLimitParsed = getTypographyValueAndUnit(\n\t\t\tminimumFontSizeLimit,\n\t\t\t{\n\t\t\t\tcoerceTo: fontSizeParsed.unit,\n\t\t\t}\n\t\t);\n\n\t\tif ( !! minimumFontSizeLimitParsed?.value ) {\n\t\t\t/*\n\t\t\t * If a minimum size was not passed to this function\n\t\t\t * and the user-defined font size is lower than `minimumFontSizeLimit`,\n\t\t\t * then uses the user-defined font size as the minimum font-size.\n\t\t\t */\n\t\t\tif (\n\t\t\t\t! minimumFontSize &&\n\t\t\t\tfontSizeParsed?.value < minimumFontSizeLimitParsed?.value\n\t\t\t) {\n\t\t\t\tminimumFontSizeValue = `${ fontSizeParsed.value }${ fontSizeParsed.unit }`;\n\t\t\t} else {\n\t\t\t\tconst minimumFontSizeParsed = getTypographyValueAndUnit(\n\t\t\t\t\tminimumFontSizeValue,\n\t\t\t\t\t{\n\t\t\t\t\t\tcoerceTo: fontSizeParsed.unit,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\t/*\n\t\t\t\t * Otherwise, if the passed or calculated minimum font size is lower than `minimumFontSizeLimit`\n\t\t\t\t * use `minimumFontSizeLimit` instead.\n\t\t\t\t */\n\t\t\t\tif (\n\t\t\t\t\t!! minimumFontSizeParsed?.value &&\n\t\t\t\t\tminimumFontSizeParsed.value <\n\t\t\t\t\t\tminimumFontSizeLimitParsed.value\n\t\t\t\t) {\n\t\t\t\t\tminimumFontSizeValue = `${ minimumFontSizeLimitParsed.value }${ minimumFontSizeLimitParsed.unit }`;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// If no maximumFontSize is provided, derive using max scale factor.\n\t\tif ( ! maximumFontSize ) {\n\t\t\tmaximumFontSize =\n\t\t\t\troundToPrecision(\n\t\t\t\t\tfontSizeParsed.value * maximumFontSizeFactor,\n\t\t\t\t\t3\n\t\t\t\t) + fontSizeParsed.unit;\n\t\t}\n\t}\n\n\t// Return early if one of the provided inputs is not provided.\n\tif ( ! minimumFontSizeValue || ! maximumFontSize ) {\n\t\treturn null;\n\t}\n\n\t// Grab the minimum font size and normalize it in order to use the value for calculations.\n\tconst minimumFontSizeParsed =\n\t\tgetTypographyValueAndUnit( minimumFontSizeValue );\n\n\t// We get a 'preferred' unit to keep units consistent when calculating,\n\t// otherwise the result will not be accurate.\n\tconst fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';\n\n\t// Grabs the maximum font size and normalize it in order to use the value for calculations.\n\tconst maximumFontSizeParsed = getTypographyValueAndUnit( maximumFontSize, {\n\t\tcoerceTo: fontSizeUnit,\n\t} );\n\n\t// Checks for mandatory min and max sizes, and protects against unsupported units.\n\tif ( ! minimumFontSizeParsed || ! maximumFontSizeParsed ) {\n\t\treturn null;\n\t}\n\n\t// Uses rem for accessible fluid target font scaling.\n\tconst minimumFontSizeRem = getTypographyValueAndUnit(\n\t\tminimumFontSizeValue,\n\t\t{\n\t\t\tcoerceTo: 'rem',\n\t\t}\n\t);\n\n\t// Viewport widths defined for fluid typography. Normalize units\n\tconst maximumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tmaximumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\tconst minumumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tminimumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\n\t// Protect against unsupported units.\n\tif (\n\t\t! maximumViewPortWidthParsed ||\n\t\t! minumumViewPortWidthParsed ||\n\t\t! minimumFontSizeRem\n\t) {\n\t\treturn null;\n\t}\n\n\t// Build CSS rule.\n\t// Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.\n\tconst minViewPortWidthOffsetValue = roundToPrecision(\n\t\tminumumViewPortWidthParsed.value / 100,\n\t\t3\n\t);\n\n\tconst viewPortWidthOffset =\n\t\troundToPrecision( minViewPortWidthOffsetValue, 3 ) + fontSizeUnit;\n\tconst linearFactor =\n\t\t100 *\n\t\t( ( maximumFontSizeParsed.value - minimumFontSizeParsed.value ) /\n\t\t\t( maximumViewPortWidthParsed.value -\n\t\t\t\tminumumViewPortWidthParsed.value ) );\n\tconst linearFactorScaled = roundToPrecision(\n\t\t( linearFactor || 1 ) * scaleFactor,\n\t\t3\n\t);\n\tconst fluidTargetFontSize = `${ minimumFontSizeRem.value }${ minimumFontSizeRem.unit } + ((1vw - ${ viewPortWidthOffset }) * ${ linearFactorScaled })`;\n\n\treturn `clamp(${ minimumFontSizeValue }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;\n}\n\n/**\n * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].\n * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.\n *\n * @param {string|number}    rawValue Raw size value from theme.json.\n * @param {Object|undefined} options  Calculation options.\n *\n * @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties.\n */\nexport function getTypographyValueAndUnit( rawValue, options = {} ) {\n\tif ( typeof rawValue !== 'string' && typeof rawValue !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Converts numeric values to pixel values by default.\n\tif ( isFinite( rawValue ) ) {\n\t\trawValue = `${ rawValue }px`;\n\t}\n\n\tconst { coerceTo, rootSizeValue, acceptableUnits } = {\n\t\tcoerceTo: '',\n\t\t// Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( \"html\" ) ).fontSize`.\n\t\trootSizeValue: 16,\n\t\tacceptableUnits: [ 'rem', 'px', 'em' ],\n\t\t...options,\n\t};\n\n\tconst acceptableUnitsGroup = acceptableUnits?.join( '|' );\n\tconst regexUnits = new RegExp(\n\t\t`^(\\\\d*\\\\.?\\\\d+)(${ acceptableUnitsGroup }){1,1}$`\n\t);\n\n\tconst matches = rawValue.match( regexUnits );\n\n\t// We need a number value and a unit.\n\tif ( ! matches || matches.length < 3 ) {\n\t\treturn null;\n\t}\n\n\tlet [ , value, unit ] = matches;\n\n\tlet returnValue = parseFloat( value );\n\n\tif ( 'px' === coerceTo && ( 'em' === unit || 'rem' === unit ) ) {\n\t\treturnValue = returnValue * rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\tif ( 'px' === unit && ( 'em' === coerceTo || 'rem' === coerceTo ) ) {\n\t\treturnValue = returnValue / rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\t/*\n\t * No calculation is required if swapping between em and rem yet,\n\t * since we assume a root size value. Later we might like to differentiate between\n\t * :root font size (rem) and parent element font size (em) relativity.\n\t */\n\tif (\n\t\t( 'em' === coerceTo || 'rem' === coerceTo ) &&\n\t\t( 'em' === unit || 'rem' === unit )\n\t) {\n\t\tunit = coerceTo;\n\t}\n\n\treturn {\n\t\tvalue: roundToPrecision( returnValue, 3 ),\n\t\tunit,\n\t};\n}\n\n/**\n * Returns a value rounded to defined precision.\n * Returns `undefined` if the value is not a valid finite number.\n *\n * @param {number} value  Raw value.\n * @param {number} digits The number of digits to appear after the decimal point\n *\n * @return {number|undefined} Value rounded to standard precision.\n */\nexport function roundToPrecision( value, digits = 3 ) {\n\tconst base = Math.pow( 10, digits );\n\treturn Number.isFinite( value )\n\t\t? parseFloat( Math.round( value * base ) / base )\n\t\t: undefined;\n}\n"]}

package/build/components/font-sizes/index.js

@@ -11,6 +11,12 @@ Object.defineProperty(exports, "FontSizePicker", {
     return _fontSizePicker.default;
   }
 });
+Object.defineProperty(exports, "getComputedFluidTypographyValue", {
+  enumerable: true,
+  get: function () {
+    return _fluidUtils.getComputedFluidTypographyValue;
+  }
+});
 Object.defineProperty(exports, "getFontSize", {
   enumerable: true,
   get: function () {
@@ -38,6 +44,8 @@ Object.defineProperty(exports, "withFontSizes", {
 
 var _utils = require("./utils");
 
+var _fluidUtils = require("./fluid-utils");
+
 var _fontSizePicker = _interopRequireDefault(require("./font-size-picker"));
 
 var _withFontSizes = _interopRequireDefault(require("./with-font-sizes"));

package/build/components/font-sizes/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAKA;;AACA","sourcesContent":["export {\n\tgetFontSize,\n\tgetFontSizeClass,\n\tgetFontSizeObjectByValue,\n} from './utils';\nexport { default as FontSizePicker } from './font-size-picker';\nexport { default as withFontSizes } from './with-font-sizes';\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAKA;;AACA;;AACA","sourcesContent":["export {\n\tgetFontSize,\n\tgetFontSizeClass,\n\tgetFontSizeObjectByValue,\n} from './utils';\nexport { getComputedFluidTypographyValue } from './fluid-utils';\nexport { default as FontSizePicker } from './font-size-picker';\nexport { default as withFontSizes } from './with-font-sizes';\n"]}

package/build/components/font-sizes/with-font-sizes.js

@@ -123,7 +123,7 @@ var _default = function _default() {
           return true;
         };
 
-        if (!(0, _lodash.some)(fontSizeAttributeNames, didAttributesChange)) {
+        if (!Object.values(fontSizeAttributeNames).some(didAttributesChange)) {
           return null;
         }
 

package/build/components/font-sizes/with-font-sizes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/with-font-sizes.js"],"names":["DEFAULT_FONT_SIZES","upperFirst","firstLetter","rest","toUpperCase","join","fontSizeNames","fontSizeAttributeNames","fontSizeAttributeNamesAccumulator","fontSizeAttributeName","WrappedComponent","props","fontSizes","Component","constructor","setters","createSetters","state","settersAccumulator","customFontSizeAttributeName","upperFirstFontSizeAttributeName","createSetFontSize","fontSizeValue","fontSizeObject","size","Number","setAttributes","slug","undefined","getDerivedStateFromProps","previousState","attributes","didAttributesChange","newState","newStateAccumulator","fontSizeAttributeValue","class","render"],"mappings":";;;;;;;;;AASA;;;;AANA;;AAKA;;AAMA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAIA,MAAMA,kBAAkB,GAAG,EAA3B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMC,UAAU,GAAG;AAAA,MAAE,CAAEC,WAAF,EAAe,GAAGC,IAAlB,CAAF;AAAA,SAClBD,WAAW,CAACE,WAAZ,KAA4BD,IAAI,CAACE,IAAL,CAAW,EAAX,CADV;AAAA,CAAnB;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;eACe,oBAAwB;AAAA,oCAAnBC,aAAmB;AAAnBA,IAAAA,aAAmB;AAAA;;AACtC;AACD;AACA;AACA;AACA;AACC,QAAMC,sBAAsB,GAAG,oBAC9BD,aAD8B,EAE9B,CAAEE,iCAAF,EAAqCC,qBAArC,KAAgE;AAC/DD,IAAAA,iCAAiC,CAChCC,qBADgC,CAAjC,GAEK,SAASR,UAAU,CAAEQ,qBAAF,CAA2B,EAFnD;AAGA,WAAOD,iCAAP;AACA,GAP6B,EAQ9B,EAR8B,CAA/B;AAWA,SAAO,yCACN,sBAAS,CACR,yCACGE,gBAAF,IAA0BC,KAAF,IAAa;AACpC,UAAMC,SAAS,GACd,yBAAY,sBAAZ,KACAZ,kBAFD;AAGA,WACC,4BAAC,gBAAD,6BACMW,KADN;AAEC,MAAA,SAAS,EAAGC;AAFb,OADD;AAMA,GAXF,EAYC,eAZD,CADQ,EAeNF,gBAAF,IAAwB;AACvB,WAAO,cAAcG,kBAAd,CAAwB;AAC9BC,MAAAA,WAAW,CAAEH,KAAF,EAAU;AACpB,cAAOA,KAAP;AAEA,aAAKI,OAAL,GAAe,KAAKC,aAAL,EAAf;AAEA,aAAKC,KAAL,GAAa,EAAb;AACA;;AAEDD,MAAAA,aAAa,GAAG;AACf,eAAO,oBACNT,sBADM,EAEN,CACCW,kBADD,EAECC,2BAFD,EAGCV,qBAHD,KAIK;AACJ,gBAAMW,+BAA+B,GACpCnB,UAAU,CAAEQ,qBAAF,CADX;AAEAS,UAAAA,kBAAkB,CAChB,MAAME,+BAAiC,EADvB,CAAlB,GAEI,KAAKC,iBAAL,CACHZ,qBADG,EAEHU,2BAFG,CAFJ;AAMA,iBAAOD,kBAAP;AACA,SAhBK,EAiBN,EAjBM,CAAP;AAmBA;;AAEDG,MAAAA,iBAAiB,CAChBZ,qBADgB,EAEhBU,2BAFgB,EAGf;AACD,eAASG,aAAF,IAAqB;AAC3B,gBAAMC,cAAc,GAAG,kBAAM,KAAKZ,KAAL,CAAWC,SAAjB,EAA4B;AAClDY,YAAAA,IAAI,EAAEC,MAAM,CAAEH,aAAF;AADsC,WAA5B,CAAvB;AAGA,eAAKX,KAAL,CAAWe,aAAX,CAA0B;AACzB,aAAEjB,qBAAF,GACCc,cAAc,IAAIA,cAAc,CAACI,IAAjC,GACGJ,cAAc,CAACI,IADlB,GAEGC,SAJqB;AAKzB,aAAET,2BAAF,GACCI,cAAc,IAAIA,cAAc,CAACI,IAAjC,GACGC,SADH,GAEGN;AARqB,WAA1B;AAUA,SAdD;AAeA;;AAE8B,aAAxBO,wBAAwB,QAE9BC,aAF8B,EAG7B;AAAA,YAFD;AAAEC,UAAAA,UAAF;AAAcnB,UAAAA;AAAd,SAEC;;AACD,cAAMoB,mBAAmB,GAAG,CAC3Bb,2BAD2B,EAE3BV,qBAF2B,KAGvB;AACJ,cAAKqB,aAAa,CAAErB,qBAAF,CAAlB,EAA8C;AAC7C;AACA,gBAAKsB,UAAU,CAAEtB,qBAAF,CAAf,EAA2C;AAC1C,qBACCsB,UAAU,CAAEtB,qBAAF,CAAV,KACAqB,aAAa,CAAErB,qBAAF,CAAb,CACEkB,IAHH;AAKA,aAR4C,CAS7C;;;AACA,mBACCG,aAAa,CAAErB,qBAAF,CAAb,CACEe,IADF,KAEAO,UAAU,CAAEZ,2BAAF,CAHX;AAKA,WAhBG,CAiBJ;;;AACA,iBAAO,IAAP;AACA,SAtBD;;AAwBA,YACC,CAAE,kBACDZ,sBADC,EAEDyB,mBAFC,CADH,EAKE;AACD,iBAAO,IAAP;AACA;;AAED,cAAMC,QAAQ,GAAG,oBAChB,oBACC1B,sBADD,EAECyB,mBAFD,CADgB,EAKhB,CACCE,mBADD,EAECf,2BAFD,EAGCV,qBAHD,KAIK;AACJ,gBAAM0B,sBAAsB,GAC3BJ,UAAU,CAAEtB,qBAAF,CADX;AAEA,gBAAMc,cAAc,GAAG,wBACtBX,SADsB,EAEtBuB,sBAFsB,EAGtBJ,UAAU,CAAEZ,2BAAF,CAHY,CAAvB;AAKAe,UAAAA,mBAAmB,CAAEzB,qBAAF,CAAnB,GAA+C,EAC9C,GAAGc,cAD2C;AAE9Ca,YAAAA,KAAK,EAAE,6BACND,sBADM;AAFuC,WAA/C;AAMA,iBAAOD,mBAAP;AACA,SAxBe,EAyBhB,EAzBgB,CAAjB;AA4BA,eAAO,EACN,GAAGJ,aADG;AAEN,aAAGG;AAFG,SAAP;AAIA;;AAEDI,MAAAA,MAAM,GAAG;AACR,eACC,4BAAC,gBAAD,6BAEK,KAAK1B,KAFV;AAGEC,UAAAA,SAAS,EAAEgB;AAHb,WAIK,KAAKX,KAJV,EAKK,KAAKF,OALV,EADD;AAUA;;AAtI6B,KAA/B;AAwIA,GAxJO,CAAT,CADM,EA2JN,eA3JM,CAAP;AA6JA,C","sourcesContent":["/**\n * External dependencies\n */\nimport { find, pickBy, reduce, some } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent, compose } from '@wordpress/compose';\nimport { Component } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getFontSize, getFontSizeClass } from './utils';\nimport useSetting from '../use-setting';\n\nconst DEFAULT_FONT_SIZES = [];\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param {string} str The string whose first letter the function will capitalize.\n *\n * @return {string} Capitalized string.\n */\nconst upperFirst = ( [ firstLetter, ...rest ] ) =>\n\tfirstLetter.toUpperCase() + rest.join( '' );\n\n/**\n * Higher-order component, which handles font size logic for class generation,\n * font size value retrieval, and font size change handling.\n *\n * @param {...(Object|string)} fontSizeNames The arguments should all be strings.\n *                                           Each string contains the font size\n *                                           attribute name e.g: 'fontSize'.\n *\n * @return {Function} Higher-order component.\n */\nexport default ( ...fontSizeNames ) => {\n\t/*\n\t * Computes an object whose key is the font size attribute name as passed in the array,\n\t * and the value is the custom font size attribute name.\n\t * Custom font size is automatically compted by appending custom followed by the font size attribute name in with the first letter capitalized.\n\t */\n\tconst fontSizeAttributeNames = reduce(\n\t\tfontSizeNames,\n\t\t( fontSizeAttributeNamesAccumulator, fontSizeAttributeName ) => {\n\t\t\tfontSizeAttributeNamesAccumulator[\n\t\t\t\tfontSizeAttributeName\n\t\t\t] = `custom${ upperFirst( fontSizeAttributeName ) }`;\n\t\t\treturn fontSizeAttributeNamesAccumulator;\n\t\t},\n\t\t{}\n\t);\n\n\treturn createHigherOrderComponent(\n\t\tcompose( [\n\t\t\tcreateHigherOrderComponent(\n\t\t\t\t( WrappedComponent ) => ( props ) => {\n\t\t\t\t\tconst fontSizes =\n\t\t\t\t\t\tuseSetting( 'typography.fontSizes' ) ||\n\t\t\t\t\t\tDEFAULT_FONT_SIZES;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t\t'withFontSizes'\n\t\t\t),\n\t\t\t( WrappedComponent ) => {\n\t\t\t\treturn class extends Component {\n\t\t\t\t\tconstructor( props ) {\n\t\t\t\t\t\tsuper( props );\n\n\t\t\t\t\t\tthis.setters = this.createSetters();\n\n\t\t\t\t\t\tthis.state = {};\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetters() {\n\t\t\t\t\t\treturn reduce(\n\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst upperFirstFontSizeAttributeName =\n\t\t\t\t\t\t\t\t\tupperFirst( fontSizeAttributeName );\n\t\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t\t`set${ upperFirstFontSizeAttributeName }`\n\t\t\t\t\t\t\t\t] = this.createSetFontSize(\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\treturn settersAccumulator;\n\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}\n\n\t\t\t\t\tcreateSetFontSize(\n\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn ( fontSizeValue ) => {\n\t\t\t\t\t\t\tconst fontSizeObject = find( this.props.fontSizes, {\n\t\t\t\t\t\t\t\tsize: Number( fontSizeValue ),\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t\t[ fontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t[ customFontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t: fontSizeValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\tstatic getDerivedStateFromProps(\n\t\t\t\t\t\t{ attributes, fontSizes },\n\t\t\t\t\t\tpreviousState\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst didAttributesChange = (\n\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tif ( previousState[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t// If new font size is name compare with the previous slug.\n\t\t\t\t\t\t\t\tif ( attributes[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ] !==\n\t\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t\t.slug\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// If font size is not named, update when the font size value changes.\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t.size !==\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\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// In this case we need to build the font size object.\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! some(\n\t\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst newState = reduce(\n\t\t\t\t\t\t\tpickBy(\n\t\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tnewStateAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst fontSizeAttributeValue =\n\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ];\n\t\t\t\t\t\t\t\tconst fontSizeObject = getFontSize(\n\t\t\t\t\t\t\t\t\tfontSizes,\n\t\t\t\t\t\t\t\t\tfontSizeAttributeValue,\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tnewStateAccumulator[ fontSizeAttributeName ] = {\n\t\t\t\t\t\t\t\t\t...fontSizeObject,\n\t\t\t\t\t\t\t\t\tclass: getFontSizeClass(\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue\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\treturn newStateAccumulator;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...previousState,\n\t\t\t\t\t\t\t...newState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\trender() {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\t\tfontSizes: undefined,\n\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t...this.setters,\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}\n\t\t\t\t};\n\t\t\t},\n\t\t] ),\n\t\t'withFontSizes'\n\t);\n};\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/with-font-sizes.js"],"names":["DEFAULT_FONT_SIZES","upperFirst","firstLetter","rest","toUpperCase","join","fontSizeNames","fontSizeAttributeNames","fontSizeAttributeNamesAccumulator","fontSizeAttributeName","WrappedComponent","props","fontSizes","Component","constructor","setters","createSetters","state","settersAccumulator","customFontSizeAttributeName","upperFirstFontSizeAttributeName","createSetFontSize","fontSizeValue","fontSizeObject","size","Number","setAttributes","slug","undefined","getDerivedStateFromProps","previousState","attributes","didAttributesChange","Object","values","some","newState","newStateAccumulator","fontSizeAttributeValue","class","render"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { find, pickBy, reduce } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent, compose } from '@wordpress/compose';\nimport { Component } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getFontSize, getFontSizeClass } from './utils';\nimport useSetting from '../use-setting';\n\nconst DEFAULT_FONT_SIZES = [];\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param {string} str The string whose first letter the function will capitalize.\n *\n * @return {string} Capitalized string.\n */\nconst upperFirst = ( [ firstLetter, ...rest ] ) =>\n\tfirstLetter.toUpperCase() + rest.join( '' );\n\n/**\n * Higher-order component, which handles font size logic for class generation,\n * font size value retrieval, and font size change handling.\n *\n * @param {...(Object|string)} fontSizeNames The arguments should all be strings.\n *                                           Each string contains the font size\n *                                           attribute name e.g: 'fontSize'.\n *\n * @return {Function} Higher-order component.\n */\nexport default ( ...fontSizeNames ) => {\n\t/*\n\t * Computes an object whose key is the font size attribute name as passed in the array,\n\t * and the value is the custom font size attribute name.\n\t * Custom font size is automatically compted by appending custom followed by the font size attribute name in with the first letter capitalized.\n\t */\n\tconst fontSizeAttributeNames = reduce(\n\t\tfontSizeNames,\n\t\t( fontSizeAttributeNamesAccumulator, fontSizeAttributeName ) => {\n\t\t\tfontSizeAttributeNamesAccumulator[\n\t\t\t\tfontSizeAttributeName\n\t\t\t] = `custom${ upperFirst( fontSizeAttributeName ) }`;\n\t\t\treturn fontSizeAttributeNamesAccumulator;\n\t\t},\n\t\t{}\n\t);\n\n\treturn createHigherOrderComponent(\n\t\tcompose( [\n\t\t\tcreateHigherOrderComponent(\n\t\t\t\t( WrappedComponent ) => ( props ) => {\n\t\t\t\t\tconst fontSizes =\n\t\t\t\t\t\tuseSetting( 'typography.fontSizes' ) ||\n\t\t\t\t\t\tDEFAULT_FONT_SIZES;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t\t'withFontSizes'\n\t\t\t),\n\t\t\t( WrappedComponent ) => {\n\t\t\t\treturn class extends Component {\n\t\t\t\t\tconstructor( props ) {\n\t\t\t\t\t\tsuper( props );\n\n\t\t\t\t\t\tthis.setters = this.createSetters();\n\n\t\t\t\t\t\tthis.state = {};\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetters() {\n\t\t\t\t\t\treturn reduce(\n\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst upperFirstFontSizeAttributeName =\n\t\t\t\t\t\t\t\t\tupperFirst( fontSizeAttributeName );\n\t\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t\t`set${ upperFirstFontSizeAttributeName }`\n\t\t\t\t\t\t\t\t] = this.createSetFontSize(\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\treturn settersAccumulator;\n\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}\n\n\t\t\t\t\tcreateSetFontSize(\n\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn ( fontSizeValue ) => {\n\t\t\t\t\t\t\tconst fontSizeObject = find( this.props.fontSizes, {\n\t\t\t\t\t\t\t\tsize: Number( fontSizeValue ),\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t\t[ fontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t[ customFontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t: fontSizeValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\tstatic getDerivedStateFromProps(\n\t\t\t\t\t\t{ attributes, fontSizes },\n\t\t\t\t\t\tpreviousState\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst didAttributesChange = (\n\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tif ( previousState[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t// If new font size is name compare with the previous slug.\n\t\t\t\t\t\t\t\tif ( attributes[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ] !==\n\t\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t\t.slug\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// If font size is not named, update when the font size value changes.\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t.size !==\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\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// In this case we need to build the font size object.\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! Object.values( fontSizeAttributeNames ).some(\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst newState = reduce(\n\t\t\t\t\t\t\tpickBy(\n\t\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tnewStateAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst fontSizeAttributeValue =\n\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ];\n\t\t\t\t\t\t\t\tconst fontSizeObject = getFontSize(\n\t\t\t\t\t\t\t\t\tfontSizes,\n\t\t\t\t\t\t\t\t\tfontSizeAttributeValue,\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tnewStateAccumulator[ fontSizeAttributeName ] = {\n\t\t\t\t\t\t\t\t\t...fontSizeObject,\n\t\t\t\t\t\t\t\t\tclass: getFontSizeClass(\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue\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\treturn newStateAccumulator;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...previousState,\n\t\t\t\t\t\t\t...newState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\trender() {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\t\tfontSizes: undefined,\n\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t...this.setters,\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}\n\t\t\t\t};\n\t\t\t},\n\t\t] ),\n\t\t'withFontSizes'\n\t);\n};\n"]}

package/build/components/iframe/index.js

@@ -272,7 +272,7 @@ function Iframe(_ref3, ref) {
   }, []);
   const bodyRef = (0, _compose.useMergeRefs)([contentRef, clearerRef, writingFlowRef]);
   const styleCompatibilityRef = useStylesCompatibility();
-  head = (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)("style", null, 'body{margin:0}'), styles.map(_ref4 => {
+  head = (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)("style", null, 'html{height:auto!important;}body{margin:0}'), styles.map(_ref4 => {
     let {
       tagName,
       href,