@wordpress/block-editor 10.1.1-next.4d3b314fd5.0 → 10.3.0

package/build-module/components/spacing-sizes-control/spacing-input-control.js

@@ -10,7 +10,7 @@ import classnames from 'classnames';
 
 import { useState, useMemo } from '@wordpress/element';
 import { useSelect } from '@wordpress/data';
-import { Button, RangeControl, CustomSelectControl, __experimentalUnitControl as UnitControl, __experimentalHStack as HStack, __experimentalText as Text, __experimentalUseCustomUnits as useCustomUnits, __experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue } from '@wordpress/components';
+import { BaseControl, Button, RangeControl, CustomSelectControl, __experimentalUnitControl as UnitControl, __experimentalHStack as HStack, __experimentalUseCustomUnits as useCustomUnits, __experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
 import { settings } from '@wordpress/icons';
 /**
@@ -20,8 +20,34 @@ import { settings } from '@wordpress/icons';
 import useSetting from '../use-setting';
 import { store as blockEditorStore } from '../../store';
 import { LABELS, getSliderValueFromPreset, getCustomValueFromPreset, getPresetValueFromCustomValue, isValueSpacingPreset } from './utils';
+const CUSTOM_VALUE_SETTINGS = {
+  px: {
+    max: 300,
+    steps: 1
+  },
+  '%': {
+    max: 100,
+    steps: 1
+  },
+  vw: {
+    max: 100,
+    steps: 1
+  },
+  vh: {
+    max: 100,
+    steps: 1
+  },
+  em: {
+    max: 10,
+    steps: 0.1
+  },
+  rm: {
+    max: 10,
+    steps: 0.1
+  }
+};
 export default function SpacingInputControl(_ref) {
-  var _spacingSizes$current;
+  var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2, _CUSTOM_VALUE_SETTING3, _CUSTOM_VALUE_SETTING4, _spacingSizes$current;
 
   let {
     spacingSizes,
@@ -73,7 +99,7 @@ export default function SpacingInputControl(_ref) {
     return value === undefined ? undefined : (_spacingSizes$newValu = spacingSizes[newValue]) === null || _spacingSizes$newValu === void 0 ? void 0 : _spacingSizes$newValu.name;
   };
 
-  const customRangeValue = parseInt(currentValue, 10);
+  const customRangeValue = parseFloat(currentValue, 10);
 
   const getNewCustomValue = newSize => {
     const isNumeric = !isNaN(parseFloat(newSize));
@@ -120,11 +146,11 @@ export default function SpacingInputControl(_ref) {
   const showHint = showRangeControl && !showCustomValueControl && currentValueHint !== undefined;
   return createElement(Fragment, null, side !== 'all' && createElement(HStack, {
     className: "components-spacing-sizes-control__side-labels"
-  }, createElement(Text, {
+  }, createElement(BaseControl.VisualLabel, {
     className: "components-spacing-sizes-control__side-label"
-  }, LABELS[side]), showHint && createElement(Text, {
+  }, LABELS[side]), showHint && createElement(BaseControl.VisualLabel, {
     className: "components-spacing-sizes-control__hint-single"
-  }, currentValueHint)), side === 'all' && showHint && createElement(Text, {
+  }, currentValueHint)), side === 'all' && showHint && createElement(BaseControl.VisualLabel, {
     className: "components-spacing-sizes-control__hint-all"
   }, currentValueHint), !disableCustomSpacingSizes && createElement(Button, {
     label: showCustomValueControl ? __('Use size preset') : __('Set custom size'),
@@ -151,11 +177,13 @@ export default function SpacingInputControl(_ref) {
     className: "components-spacing-sizes-control__custom-value-input",
     style: {
       gridColumn: '1'
-    }
+    },
+    size: '__unstable-large'
   }), createElement(RangeControl, {
     value: customRangeValue,
     min: 0,
-    max: 100,
+    max: (_CUSTOM_VALUE_SETTING = (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[selectedUnit]) === null || _CUSTOM_VALUE_SETTING2 === void 0 ? void 0 : _CUSTOM_VALUE_SETTING2.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
+    step: (_CUSTOM_VALUE_SETTING3 = (_CUSTOM_VALUE_SETTING4 = CUSTOM_VALUE_SETTINGS[selectedUnit]) === null || _CUSTOM_VALUE_SETTING4 === void 0 ? void 0 : _CUSTOM_VALUE_SETTING4.steps) !== null && _CUSTOM_VALUE_SETTING3 !== void 0 ? _CUSTOM_VALUE_SETTING3 : 0.1,
     withInputField: false,
     onChange: handleCustomValueSliderChange,
     className: "components-spacing-sizes-control__custom-value-range"
@@ -180,7 +208,8 @@ export default function SpacingInputControl(_ref) {
     max: spacingSizes.length - 1,
     marks: marks,
     label: ariaLabel,
-    hideLabelFromVision: true
+    hideLabelFromVision: true,
+    __nextHasNoMarginBottom: true
   }), !showRangeControl && !showCustomValueControl && createElement(CustomSelectControl, {
     className: "components-spacing-sizes-control__custom-select-control",
     value: options.find(option => option.key === currentValue) || '' // passing undefined here causes a downshift controlled/uncontrolled warning
@@ -191,7 +220,8 @@ export default function SpacingInputControl(_ref) {
     options: options,
     label: ariaLabel,
     hideLabelFromVision: true,
-    __nextUnconstrainedWidth: true
+    __nextUnconstrainedWidth: true,
+    size: '__unstable-large'
   }));
 }
 //# sourceMappingURL=spacing-input-control.js.map

package/build-module/components/spacing-sizes-control/spacing-input-control.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/spacing-sizes-control/spacing-input-control.js"],"names":["classnames","useState","useMemo","useSelect","Button","RangeControl","CustomSelectControl","__experimentalUnitControl","UnitControl","__experimentalHStack","HStack","__experimentalText","Text","__experimentalUseCustomUnits","useCustomUnits","__experimentalParseQuantityAndUnitFromRawValue","parseQuantityAndUnitFromRawValue","__","sprintf","settings","useSetting","store","blockEditorStore","LABELS","getSliderValueFromPreset","getCustomValueFromPreset","getPresetValueFromCustomValue","isValueSpacingPreset","SpacingInputControl","spacingSizes","value","side","onChange","isMixed","type","minimumCustomValue","selectListSizes","showRangeControl","length","disableCustomSpacingSizes","select","editorSettings","getSettings","showCustomValueControl","setShowCustomValueControl","undefined","units","availableUnits","currentValue","showCustomValueInSelectList","name","slug","size","selectedUnit","setInitialValue","customTooltipContent","newValue","customRangeValue","parseInt","getNewCustomValue","newSize","isNumeric","isNaN","parseFloat","nextValue","getNewPresetValue","controlType","handleCustomValueSliderChange","next","join","allPlaceholder","currentValueHint","options","map","index","key","marks","label","ariaLabel","toLowerCase","showHint","gridColumn","event","nativeEvent","offsetX","find","option","selection","selectedItem"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useMemo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tButton,\n\tRangeControl,\n\tCustomSelectControl,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalHStack as HStack,\n\t__experimentalText as Text,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\nimport { store as blockEditorStore } from '../../store';\nimport {\n\tLABELS,\n\tgetSliderValueFromPreset,\n\tgetCustomValueFromPreset,\n\tgetPresetValueFromCustomValue,\n\tisValueSpacingPreset,\n} from './utils';\n\nexport default function SpacingInputControl( {\n\tspacingSizes,\n\tvalue,\n\tside,\n\tonChange,\n\tisMixed = false,\n\ttype,\n\tminimumCustomValue,\n} ) {\n\t// Treat value as a preset value if the passed in value matches the value of one of the spacingSizes.\n\tvalue = getPresetValueFromCustomValue( value, spacingSizes );\n\n\tlet selectListSizes = spacingSizes;\n\tconst showRangeControl = spacingSizes.length <= 8;\n\n\tconst disableCustomSpacingSizes = useSelect( ( select ) => {\n\t\tconst editorSettings = select( blockEditorStore ).getSettings();\n\t\treturn editorSettings?.disableCustomSpacingSizes;\n\t} );\n\n\tconst [ showCustomValueControl, setShowCustomValueControl ] = useState(\n\t\t! disableCustomSpacingSizes &&\n\t\t\tvalue !== undefined &&\n\t\t\t! isValueSpacingPreset( value )\n\t);\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [ 'px', 'em', 'rem' ],\n\t} );\n\n\tlet currentValue = null;\n\n\tconst showCustomValueInSelectList =\n\t\t! showRangeControl &&\n\t\t! showCustomValueControl &&\n\t\tvalue !== undefined &&\n\t\t( ! isValueSpacingPreset( value ) ||\n\t\t\t( isValueSpacingPreset( value ) && isMixed ) );\n\n\tif ( showCustomValueInSelectList ) {\n\t\tselectListSizes = [\n\t\t\t...spacingSizes,\n\t\t\t{\n\t\t\t\tname: ! isMixed\n\t\t\t\t\t? // translators: A custom measurement, eg. a number followed by a unit like 12px.\n\t\t\t\t\t  sprintf( __( 'Custom (%s)' ), value )\n\t\t\t\t\t: __( 'Mixed' ),\n\t\t\t\tslug: 'custom',\n\t\t\t\tsize: value,\n\t\t\t},\n\t\t];\n\t\tcurrentValue = selectListSizes.length - 1;\n\t} else if ( ! isMixed ) {\n\t\tcurrentValue = ! showCustomValueControl\n\t\t\t? getSliderValueFromPreset( value, spacingSizes )\n\t\t\t: getCustomValueFromPreset( value, spacingSizes );\n\t}\n\n\tconst selectedUnit =\n\t\tuseMemo(\n\t\t\t() => parseQuantityAndUnitFromRawValue( currentValue ),\n\t\t\t[ currentValue ]\n\t\t)[ 1 ] || units[ 0 ].value;\n\n\tconst setInitialValue = () => {\n\t\tif ( value === undefined ) {\n\t\t\tonChange( '0' );\n\t\t}\n\t};\n\n\tconst customTooltipContent = ( newValue ) =>\n\t\tvalue === undefined ? undefined : spacingSizes[ newValue ]?.name;\n\n\tconst customRangeValue = parseInt( currentValue, 10 );\n\n\tconst getNewCustomValue = ( newSize ) => {\n\t\tconst isNumeric = ! isNaN( parseFloat( newSize ) );\n\t\tconst nextValue = isNumeric ? newSize : undefined;\n\t\treturn nextValue;\n\t};\n\n\tconst getNewPresetValue = ( newSize, controlType ) => {\n\t\tconst size = parseInt( newSize, 10 );\n\n\t\tif ( controlType === 'selectList' ) {\n\t\t\tif ( size === 0 ) {\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tif ( size === 1 ) {\n\t\t\t\treturn '0';\n\t\t\t}\n\t\t} else if ( size === 0 ) {\n\t\t\treturn '0';\n\t\t}\n\t\treturn `var:preset|spacing|${ spacingSizes[ newSize ]?.slug }`;\n\t};\n\n\tconst handleCustomValueSliderChange = ( next ) => {\n\t\tonChange( [ next, selectedUnit ].join( '' ) );\n\t};\n\n\tconst allPlaceholder = isMixed ? __( 'Mixed' ) : null;\n\n\tconst currentValueHint = ! isMixed\n\t\t? customTooltipContent( currentValue )\n\t\t: __( 'Mixed' );\n\n\tconst options = selectListSizes.map( ( size, index ) => ( {\n\t\tkey: index,\n\t\tname: size.name,\n\t} ) );\n\n\tconst marks = spacingSizes.map( ( newValue, index ) => ( {\n\t\tvalue: index,\n\t\tlabel: undefined,\n\t} ) );\n\n\tconst ariaLabel = sprintf(\n\t\t// translators: 1: The side of the block being modified (top, bottom, left, etc.). 2. Type of spacing being modified (Padding, margin, etc)\n\t\t__( '%1$s %2$s' ),\n\t\tLABELS[ side ],\n\t\ttype?.toLowerCase()\n\t);\n\n\tconst showHint =\n\t\tshowRangeControl &&\n\t\t! showCustomValueControl &&\n\t\tcurrentValueHint !== undefined;\n\n\treturn (\n\t\t<>\n\t\t\t{ side !== 'all' && (\n\t\t\t\t<HStack className=\"components-spacing-sizes-control__side-labels\">\n\t\t\t\t\t<Text className=\"components-spacing-sizes-control__side-label\">\n\t\t\t\t\t\t{ LABELS[ side ] }\n\t\t\t\t\t</Text>\n\n\t\t\t\t\t{ showHint && (\n\t\t\t\t\t\t<Text className=\"components-spacing-sizes-control__hint-single\">\n\t\t\t\t\t\t\t{ currentValueHint }\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ side === 'all' && showHint && (\n\t\t\t\t<Text className=\"components-spacing-sizes-control__hint-all\">\n\t\t\t\t\t{ currentValueHint }\n\t\t\t\t</Text>\n\t\t\t) }\n\n\t\t\t{ ! disableCustomSpacingSizes && (\n\t\t\t\t<Button\n\t\t\t\t\tlabel={\n\t\t\t\t\t\tshowCustomValueControl\n\t\t\t\t\t\t\t? __( 'Use size preset' )\n\t\t\t\t\t\t\t: __( 'Set custom size' )\n\t\t\t\t\t}\n\t\t\t\t\ticon={ settings }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tsetShowCustomValueControl( ! showCustomValueControl );\n\t\t\t\t\t} }\n\t\t\t\t\tisPressed={ showCustomValueControl }\n\t\t\t\t\tisSmall\n\t\t\t\t\tclassName={ classnames( {\n\t\t\t\t\t\t'components-spacing-sizes-control__custom-toggle-all':\n\t\t\t\t\t\t\tside === 'all',\n\t\t\t\t\t\t'components-spacing-sizes-control__custom-toggle-single':\n\t\t\t\t\t\t\tside !== 'all',\n\t\t\t\t\t} ) }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showCustomValueControl && (\n\t\t\t\t<>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tonChange={ ( newSize ) =>\n\t\t\t\t\t\t\tonChange( getNewCustomValue( newSize ) )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ currentValue }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tmin={ minimumCustomValue }\n\t\t\t\t\t\tplaceholder={ allPlaceholder }\n\t\t\t\t\t\tdisableUnits={ isMixed }\n\t\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-value-input\"\n\t\t\t\t\t\tstyle={ { gridColumn: '1' } }\n\t\t\t\t\t/>\n\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\tonChange={ handleCustomValueSliderChange }\n\t\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-value-range\"\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ showRangeControl && ! showCustomValueControl && (\n\t\t\t\t<RangeControl\n\t\t\t\t\tclassName=\"components-spacing-sizes-control__range-control\"\n\t\t\t\t\tvalue={ currentValue }\n\t\t\t\t\tonChange={ ( newSize ) =>\n\t\t\t\t\t\tonChange( getNewPresetValue( newSize ) )\n\t\t\t\t\t}\n\t\t\t\t\tonMouseDown={ ( event ) => {\n\t\t\t\t\t\t// If mouse down is near start of range set initial value to 0, which\n\t\t\t\t\t\t// prevents the user have to drag right then left to get 0 setting.\n\t\t\t\t\t\tif ( event?.nativeEvent?.offsetX < 35 ) {\n\t\t\t\t\t\t\tsetInitialValue();\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\twithInputField={ false }\n\t\t\t\t\taria-valuenow={ currentValue }\n\t\t\t\t\taria-valuetext={ spacingSizes[ currentValue ]?.name }\n\t\t\t\t\trenderTooltipContent={ customTooltipContent }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tmax={ spacingSizes.length - 1 }\n\t\t\t\t\tmarks={ marks }\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! showRangeControl && ! showCustomValueControl && (\n\t\t\t\t<CustomSelectControl\n\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-select-control\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\toptions.find(\n\t\t\t\t\t\t\t( option ) => option.key === currentValue\n\t\t\t\t\t\t) || '' // passing undefined here causes a downshift controlled/uncontrolled warning\n\t\t\t\t\t}\n\t\t\t\t\tonChange={ ( selection ) => {\n\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\tgetNewPresetValue(\n\t\t\t\t\t\t\t\tselection.selectedItem.key,\n\t\t\t\t\t\t\t\t'selectList'\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\toptions={ options }\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\t__nextUnconstrainedWidth={ true }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/spacing-sizes-control/spacing-input-control.js"],"names":["classnames","useState","useMemo","useSelect","BaseControl","Button","RangeControl","CustomSelectControl","__experimentalUnitControl","UnitControl","__experimentalHStack","HStack","__experimentalUseCustomUnits","useCustomUnits","__experimentalParseQuantityAndUnitFromRawValue","parseQuantityAndUnitFromRawValue","__","sprintf","settings","useSetting","store","blockEditorStore","LABELS","getSliderValueFromPreset","getCustomValueFromPreset","getPresetValueFromCustomValue","isValueSpacingPreset","CUSTOM_VALUE_SETTINGS","px","max","steps","vw","vh","em","rm","SpacingInputControl","spacingSizes","value","side","onChange","isMixed","type","minimumCustomValue","selectListSizes","showRangeControl","length","disableCustomSpacingSizes","select","editorSettings","getSettings","showCustomValueControl","setShowCustomValueControl","undefined","units","availableUnits","currentValue","showCustomValueInSelectList","name","slug","size","selectedUnit","setInitialValue","customTooltipContent","newValue","customRangeValue","parseFloat","getNewCustomValue","newSize","isNumeric","isNaN","nextValue","getNewPresetValue","controlType","parseInt","handleCustomValueSliderChange","next","join","allPlaceholder","currentValueHint","options","map","index","key","marks","label","ariaLabel","toLowerCase","showHint","gridColumn","event","nativeEvent","offsetX","find","option","selection","selectedItem"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useMemo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tBaseControl,\n\tButton,\n\tRangeControl,\n\tCustomSelectControl,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalHStack as HStack,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\nimport { store as blockEditorStore } from '../../store';\nimport {\n\tLABELS,\n\tgetSliderValueFromPreset,\n\tgetCustomValueFromPreset,\n\tgetPresetValueFromCustomValue,\n\tisValueSpacingPreset,\n} from './utils';\n\nconst CUSTOM_VALUE_SETTINGS = {\n\tpx: { max: 300, steps: 1 },\n\t'%': { max: 100, steps: 1 },\n\tvw: { max: 100, steps: 1 },\n\tvh: { max: 100, steps: 1 },\n\tem: { max: 10, steps: 0.1 },\n\trm: { max: 10, steps: 0.1 },\n};\n\nexport default function SpacingInputControl( {\n\tspacingSizes,\n\tvalue,\n\tside,\n\tonChange,\n\tisMixed = false,\n\ttype,\n\tminimumCustomValue,\n} ) {\n\t// Treat value as a preset value if the passed in value matches the value of one of the spacingSizes.\n\tvalue = getPresetValueFromCustomValue( value, spacingSizes );\n\n\tlet selectListSizes = spacingSizes;\n\tconst showRangeControl = spacingSizes.length <= 8;\n\n\tconst disableCustomSpacingSizes = useSelect( ( select ) => {\n\t\tconst editorSettings = select( blockEditorStore ).getSettings();\n\t\treturn editorSettings?.disableCustomSpacingSizes;\n\t} );\n\n\tconst [ showCustomValueControl, setShowCustomValueControl ] = useState(\n\t\t! disableCustomSpacingSizes &&\n\t\t\tvalue !== undefined &&\n\t\t\t! isValueSpacingPreset( value )\n\t);\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [ 'px', 'em', 'rem' ],\n\t} );\n\n\tlet currentValue = null;\n\n\tconst showCustomValueInSelectList =\n\t\t! showRangeControl &&\n\t\t! showCustomValueControl &&\n\t\tvalue !== undefined &&\n\t\t( ! isValueSpacingPreset( value ) ||\n\t\t\t( isValueSpacingPreset( value ) && isMixed ) );\n\n\tif ( showCustomValueInSelectList ) {\n\t\tselectListSizes = [\n\t\t\t...spacingSizes,\n\t\t\t{\n\t\t\t\tname: ! isMixed\n\t\t\t\t\t? // translators: A custom measurement, eg. a number followed by a unit like 12px.\n\t\t\t\t\t  sprintf( __( 'Custom (%s)' ), value )\n\t\t\t\t\t: __( 'Mixed' ),\n\t\t\t\tslug: 'custom',\n\t\t\t\tsize: value,\n\t\t\t},\n\t\t];\n\t\tcurrentValue = selectListSizes.length - 1;\n\t} else if ( ! isMixed ) {\n\t\tcurrentValue = ! showCustomValueControl\n\t\t\t? getSliderValueFromPreset( value, spacingSizes )\n\t\t\t: getCustomValueFromPreset( value, spacingSizes );\n\t}\n\n\tconst selectedUnit =\n\t\tuseMemo(\n\t\t\t() => parseQuantityAndUnitFromRawValue( currentValue ),\n\t\t\t[ currentValue ]\n\t\t)[ 1 ] || units[ 0 ].value;\n\n\tconst setInitialValue = () => {\n\t\tif ( value === undefined ) {\n\t\t\tonChange( '0' );\n\t\t}\n\t};\n\n\tconst customTooltipContent = ( newValue ) =>\n\t\tvalue === undefined ? undefined : spacingSizes[ newValue ]?.name;\n\n\tconst customRangeValue = parseFloat( currentValue, 10 );\n\n\tconst getNewCustomValue = ( newSize ) => {\n\t\tconst isNumeric = ! isNaN( parseFloat( newSize ) );\n\t\tconst nextValue = isNumeric ? newSize : undefined;\n\t\treturn nextValue;\n\t};\n\n\tconst getNewPresetValue = ( newSize, controlType ) => {\n\t\tconst size = parseInt( newSize, 10 );\n\n\t\tif ( controlType === 'selectList' ) {\n\t\t\tif ( size === 0 ) {\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tif ( size === 1 ) {\n\t\t\t\treturn '0';\n\t\t\t}\n\t\t} else if ( size === 0 ) {\n\t\t\treturn '0';\n\t\t}\n\t\treturn `var:preset|spacing|${ spacingSizes[ newSize ]?.slug }`;\n\t};\n\n\tconst handleCustomValueSliderChange = ( next ) => {\n\t\tonChange( [ next, selectedUnit ].join( '' ) );\n\t};\n\n\tconst allPlaceholder = isMixed ? __( 'Mixed' ) : null;\n\n\tconst currentValueHint = ! isMixed\n\t\t? customTooltipContent( currentValue )\n\t\t: __( 'Mixed' );\n\n\tconst options = selectListSizes.map( ( size, index ) => ( {\n\t\tkey: index,\n\t\tname: size.name,\n\t} ) );\n\n\tconst marks = spacingSizes.map( ( newValue, index ) => ( {\n\t\tvalue: index,\n\t\tlabel: undefined,\n\t} ) );\n\n\tconst ariaLabel = sprintf(\n\t\t// translators: 1: The side of the block being modified (top, bottom, left, etc.). 2. Type of spacing being modified (Padding, margin, etc)\n\t\t__( '%1$s %2$s' ),\n\t\tLABELS[ side ],\n\t\ttype?.toLowerCase()\n\t);\n\n\tconst showHint =\n\t\tshowRangeControl &&\n\t\t! showCustomValueControl &&\n\t\tcurrentValueHint !== undefined;\n\n\treturn (\n\t\t<>\n\t\t\t{ side !== 'all' && (\n\t\t\t\t<HStack className=\"components-spacing-sizes-control__side-labels\">\n\t\t\t\t\t<BaseControl.VisualLabel className=\"components-spacing-sizes-control__side-label\">\n\t\t\t\t\t\t{ LABELS[ side ] }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\n\t\t\t\t\t{ showHint && (\n\t\t\t\t\t\t<BaseControl.VisualLabel className=\"components-spacing-sizes-control__hint-single\">\n\t\t\t\t\t\t\t{ currentValueHint }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ side === 'all' && showHint && (\n\t\t\t\t<BaseControl.VisualLabel className=\"components-spacing-sizes-control__hint-all\">\n\t\t\t\t\t{ currentValueHint }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t) }\n\n\t\t\t{ ! disableCustomSpacingSizes && (\n\t\t\t\t<Button\n\t\t\t\t\tlabel={\n\t\t\t\t\t\tshowCustomValueControl\n\t\t\t\t\t\t\t? __( 'Use size preset' )\n\t\t\t\t\t\t\t: __( 'Set custom size' )\n\t\t\t\t\t}\n\t\t\t\t\ticon={ settings }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tsetShowCustomValueControl( ! showCustomValueControl );\n\t\t\t\t\t} }\n\t\t\t\t\tisPressed={ showCustomValueControl }\n\t\t\t\t\tisSmall\n\t\t\t\t\tclassName={ classnames( {\n\t\t\t\t\t\t'components-spacing-sizes-control__custom-toggle-all':\n\t\t\t\t\t\t\tside === 'all',\n\t\t\t\t\t\t'components-spacing-sizes-control__custom-toggle-single':\n\t\t\t\t\t\t\tside !== 'all',\n\t\t\t\t\t} ) }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showCustomValueControl && (\n\t\t\t\t<>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tonChange={ ( newSize ) =>\n\t\t\t\t\t\t\tonChange( getNewCustomValue( newSize ) )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ currentValue }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tmin={ minimumCustomValue }\n\t\t\t\t\t\tplaceholder={ allPlaceholder }\n\t\t\t\t\t\tdisableUnits={ isMixed }\n\t\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-value-input\"\n\t\t\t\t\t\tstyle={ { gridColumn: '1' } }\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t/>\n\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tmax={ CUSTOM_VALUE_SETTINGS[ selectedUnit ]?.max ?? 10 }\n\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ]?.steps ?? 0.1\n\t\t\t\t\t\t}\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\tonChange={ handleCustomValueSliderChange }\n\t\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-value-range\"\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ showRangeControl && ! showCustomValueControl && (\n\t\t\t\t<RangeControl\n\t\t\t\t\tclassName=\"components-spacing-sizes-control__range-control\"\n\t\t\t\t\tvalue={ currentValue }\n\t\t\t\t\tonChange={ ( newSize ) =>\n\t\t\t\t\t\tonChange( getNewPresetValue( newSize ) )\n\t\t\t\t\t}\n\t\t\t\t\tonMouseDown={ ( event ) => {\n\t\t\t\t\t\t// If mouse down is near start of range set initial value to 0, which\n\t\t\t\t\t\t// prevents the user have to drag right then left to get 0 setting.\n\t\t\t\t\t\tif ( event?.nativeEvent?.offsetX < 35 ) {\n\t\t\t\t\t\t\tsetInitialValue();\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\twithInputField={ false }\n\t\t\t\t\taria-valuenow={ currentValue }\n\t\t\t\t\taria-valuetext={ spacingSizes[ currentValue ]?.name }\n\t\t\t\t\trenderTooltipContent={ customTooltipContent }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tmax={ spacingSizes.length - 1 }\n\t\t\t\t\tmarks={ marks }\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\t__nextHasNoMarginBottom={ true }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! showRangeControl && ! showCustomValueControl && (\n\t\t\t\t<CustomSelectControl\n\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-select-control\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\toptions.find(\n\t\t\t\t\t\t\t( option ) => option.key === currentValue\n\t\t\t\t\t\t) || '' // passing undefined here causes a downshift controlled/uncontrolled warning\n\t\t\t\t\t}\n\t\t\t\t\tonChange={ ( selection ) => {\n\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\tgetNewPresetValue(\n\t\t\t\t\t\t\t\tselection.selectedItem.key,\n\t\t\t\t\t\t\t\t'selectList'\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\toptions={ options }\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\t__nextUnconstrainedWidth={ true }\n\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}

package/build-module/components/use-block-drop-zone/index.js

@@ -5,15 +5,18 @@ import { useDispatch, useSelect } from '@wordpress/data';
 import { useCallback, useState } from '@wordpress/element';
 import { useThrottle, __experimentalUseDropZone as useDropZone } from '@wordpress/compose';
 import { isRTL } from '@wordpress/i18n';
+import { isUnmodifiedDefaultBlock as getIsUnmodifiedDefaultBlock } from '@wordpress/blocks';
 /**
  * Internal dependencies
  */
 
 import useOnBlockDrop from '../use-on-block-drop';
-import { getDistanceToNearestEdge } from '../../utils/math';
+import { getDistanceToNearestEdge, isPointContainedByRect } from '../../utils/math';
 import { store as blockEditorStore } from '../../store';
 /** @typedef {import('../../utils/math').WPPoint} WPPoint */
 
+/** @typedef {import('../use-on-block-drop/types').WPDropOperation} WPDropOperation */
+
 /**
  * The orientation of a block list.
  *
@@ -21,48 +24,70 @@ import { store as blockEditorStore } from '../../store';
  */
 
 /**
- * Given a list of block DOM elements finds the index that a block should be dropped
- * at.
+ * The insert position when dropping a block.
  *
- * @param {Element[]}              elements    Array of DOM elements that represent each block in a block list.
- * @param {WPPoint}                position    The position of the item being dragged.
- * @param {WPBlockListOrientation} orientation The orientation of a block list.
+ * @typedef {'before'|'after'} WPInsertPosition
+ */
+
+/**
+ * @typedef {Object} WPBlockData
+ * @property {boolean}       isUnmodifiedDefaultBlock Is the block unmodified default block.
+ * @property {() => DOMRect} getBoundingClientRect    Get the bounding client rect of the block.
+ * @property {number}        blockIndex               The index of the block.
+ */
+
+/**
+ * Get the drop target position from a given drop point and the orientation.
  *
- * @return {number|undefined} The block index that's closest to the drag position.
+ * @param {WPBlockData[]}          blocksData  The block data list.
+ * @param {WPPoint}                position    The position of the item being dragged.
+ * @param {WPBlockListOrientation} orientation The orientation of the block list.
+ * @return {[number, WPDropOperation]} The drop target position.
  */
 
-export function getNearestBlockIndex(elements, position, orientation) {
+export function getDropTargetPosition(blocksData, position) {
+  var _blocksData$nearestIn, _blocksData$adjacentI;
+
+  let orientation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'vertical';
   const allowedEdges = orientation === 'horizontal' ? ['left', 'right'] : ['top', 'bottom'];
   const isRightToLeft = isRTL();
-  let candidateIndex;
-  let candidateDistance;
-  elements.forEach((element, index) => {
-    const rect = element.getBoundingClientRect();
-    const [distance, edge] = getDistanceToNearestEdge(position, rect, allowedEdges);
-
-    if (candidateDistance === undefined || distance < candidateDistance) {
-      // If the user is dropping to the trailing edge of the block
-      // add 1 to the index to represent dragging after.
-      // Take RTL languages into account where the left edge is
-      // the trailing edge.
-      const isTrailingEdge = edge === 'bottom' || !isRightToLeft && edge === 'right' || isRightToLeft && edge === 'left';
-      const offset = isTrailingEdge ? 1 : 0; // Update the currently known best candidate.
-
-      candidateDistance = distance;
-      candidateIndex = index + offset;
+  let nearestIndex = 0;
+  let insertPosition = 'before';
+  let minDistance = Infinity;
+  blocksData.forEach(_ref => {
+    let {
+      isUnmodifiedDefaultBlock,
+      getBoundingClientRect,
+      blockIndex
+    } = _ref;
+    const rect = getBoundingClientRect();
+    let [distance, edge] = getDistanceToNearestEdge(position, rect, allowedEdges); // Prioritize the element if the point is inside of an unmodified default block.
+
+    if (isUnmodifiedDefaultBlock && isPointContainedByRect(position, rect)) {
+      distance = 0;
+    }
+
+    if (distance < minDistance) {
+      // Where the dropped block will be inserted on the nearest block.
+      insertPosition = edge === 'bottom' || !isRightToLeft && edge === 'right' || isRightToLeft && edge === 'left' ? 'after' : 'before'; // Update the currently known best candidate.
+
+      minDistance = distance;
+      nearestIndex = blockIndex;
     }
   });
-  return candidateIndex;
-}
-/**
- * Determine if the element is an empty paragraph block.
- *
- * @param {?HTMLElement} element The element being tested.
- * @return {boolean} True or False.
- */
+  const adjacentIndex = nearestIndex + (insertPosition === 'after' ? 1 : -1);
+  const isNearestBlockUnmodifiedDefaultBlock = !!((_blocksData$nearestIn = blocksData[nearestIndex]) !== null && _blocksData$nearestIn !== void 0 && _blocksData$nearestIn.isUnmodifiedDefaultBlock);
+  const isAdjacentBlockUnmodifiedDefaultBlock = !!((_blocksData$adjacentI = blocksData[adjacentIndex]) !== null && _blocksData$adjacentI !== void 0 && _blocksData$adjacentI.isUnmodifiedDefaultBlock); // If both blocks are not unmodified default blocks then just insert between them.
+
+  if (!isNearestBlockUnmodifiedDefaultBlock && !isAdjacentBlockUnmodifiedDefaultBlock) {
+    // If the user is dropping to the trailing edge of the block
+    // add 1 to the index to represent dragging after.
+    const insertionIndex = insertPosition === 'after' ? nearestIndex + 1 : nearestIndex;
+    return [insertionIndex, 'insert'];
+  } // Otherwise, replace the nearest unmodified default block.
+
 
-function isEmptyParagraph(element) {
-  return !!element && element.dataset.type === 'core/paragraph' && element.dataset.empty === 'true';
+  return [isNearestBlockUnmodifiedDefaultBlock ? nearestIndex : adjacentIndex, 'replace'];
 }
 /**
  * @typedef  {Object} WPBlockDropZoneConfig
@@ -75,7 +100,6 @@ function isEmptyParagraph(element) {
  * @param {WPBlockDropZoneConfig} dropZoneConfig configuration data for the drop zone.
  */
 
-
 export default function useBlockDropZone() {
   let {
     // An undefined value represents a top-level block. Default to an empty
@@ -84,7 +108,10 @@ export default function useBlockDropZone() {
     // an empty string to represent top-level blocks.
     rootClientId: targetRootClientId = ''
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  const [targetBlockIndex, setTargetBlockIndex] = useState(null);
+  const [dropTarget, setDropTarget] = useState({
+    index: null,
+    operation: 'insert'
+  });
   const isDisabled = useSelect(select => {
     const {
       getTemplateLock,
@@ -95,35 +122,50 @@ export default function useBlockDropZone() {
     return ['all', 'contentOnly'].some(lock => lock === templateLock) || __unstableHasActiveBlockOverlayActive(targetRootClientId) || __unstableIsWithinBlockOverlay(targetRootClientId);
   }, [targetRootClientId]);
   const {
-    getBlockListSettings
+    getBlockListSettings,
+    getBlocks,
+    getBlockIndex
   } = useSelect(blockEditorStore);
   const {
     showInsertionPoint,
     hideInsertionPoint
   } = useDispatch(blockEditorStore);
-  const onBlockDrop = useOnBlockDrop(targetRootClientId, targetBlockIndex);
-  const throttled = useThrottle(useCallback((event, currentTarget) => {
+  const onBlockDrop = useOnBlockDrop(targetRootClientId, dropTarget.index, {
+    operation: dropTarget.operation
+  });
+  const throttled = useThrottle(useCallback((event, ownerDocument) => {
     var _getBlockListSettings;
 
-    const blockElements = Array.from(currentTarget.children).filter( // Ensure the element is a block. It should have the `wp-block` class.
-    element => element.classList.contains('wp-block'));
-    const targetIndex = getNearestBlockIndex(blockElements, {
+    const blocks = getBlocks(targetRootClientId); // The block list is empty, don't show the insertion point but still allow dropping.
+
+    if (blocks.length === 0) {
+      setDropTarget({
+        index: 0,
+        operation: 'insert'
+      });
+      return;
+    }
+
+    const blocksData = blocks.map(block => {
+      const clientId = block.clientId;
+      return {
+        isUnmodifiedDefaultBlock: getIsUnmodifiedDefaultBlock(block),
+        getBoundingClientRect: () => ownerDocument.getElementById(`block-${clientId}`).getBoundingClientRect(),
+        blockIndex: getBlockIndex(clientId)
+      };
+    });
+    const [targetIndex, operation] = getDropTargetPosition(blocksData, {
       x: event.clientX,
       y: event.clientY
     }, (_getBlockListSettings = getBlockListSettings(targetRootClientId)) === null || _getBlockListSettings === void 0 ? void 0 : _getBlockListSettings.orientation);
-    setTargetBlockIndex(targetIndex === undefined ? 0 : targetIndex);
-
-    if (targetIndex !== undefined) {
-      const nextBlock = blockElements[targetIndex];
-      const previousBlock = blockElements[targetIndex - 1]; // Don't show the insertion point when it's near an empty paragraph block.
-
-      if (isEmptyParagraph(nextBlock) || isEmptyParagraph(previousBlock)) {
-        return;
-      }
-
-      showInsertionPoint(targetRootClientId, targetIndex);
-    }
-  }, []), 200);
+    setDropTarget({
+      index: targetIndex,
+      operation
+    });
+    showInsertionPoint(targetRootClientId, targetIndex, {
+      operation
+    });
+  }, [targetRootClientId]), 200);
   return useDropZone({
     isDisabled,
     onDrop: onBlockDrop,
@@ -132,19 +174,17 @@ export default function useBlockDropZone() {
       // `currentTarget` is only available while the event is being
       // handled, so get it now and pass it to the thottled function.
       // https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget
-      throttled(event, event.currentTarget);
+      throttled(event, event.currentTarget.ownerDocument);
     },
 
     onDragLeave() {
       throttled.cancel();
       hideInsertionPoint();
-      setTargetBlockIndex(null);
     },
 
     onDragEnd() {
       throttled.cancel();
       hideInsertionPoint();
-      setTargetBlockIndex(null);
     }
 
   });

package/build-module/components/use-block-drop-zone/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/use-block-drop-zone/index.js"],"names":["useDispatch","useSelect","useCallback","useState","useThrottle","__experimentalUseDropZone","useDropZone","isRTL","useOnBlockDrop","getDistanceToNearestEdge","store","blockEditorStore","getNearestBlockIndex","elements","position","orientation","allowedEdges","isRightToLeft","candidateIndex","candidateDistance","forEach","element","index","rect","getBoundingClientRect","distance","edge","undefined","isTrailingEdge","offset","isEmptyParagraph","dataset","type","empty","useBlockDropZone","rootClientId","targetRootClientId","targetBlockIndex","setTargetBlockIndex","isDisabled","select","getTemplateLock","__unstableIsWithinBlockOverlay","__unstableHasActiveBlockOverlayActive","templateLock","some","lock","getBlockListSettings","showInsertionPoint","hideInsertionPoint","onBlockDrop","throttled","event","currentTarget","blockElements","Array","from","children","filter","classList","contains","targetIndex","x","clientX","y","clientY","nextBlock","previousBlock","onDrop","onDragOver","onDragLeave","cancel","onDragEnd"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useCallback, useState } from '@wordpress/element';\nimport {\n\tuseThrottle,\n\t__experimentalUseDropZone as useDropZone,\n} from '@wordpress/compose';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useOnBlockDrop from '../use-on-block-drop';\nimport { getDistanceToNearestEdge } from '../../utils/math';\nimport { store as blockEditorStore } from '../../store';\n\n/** @typedef {import('../../utils/math').WPPoint} WPPoint */\n\n/**\n * The orientation of a block list.\n *\n * @typedef {'horizontal'|'vertical'|undefined} WPBlockListOrientation\n */\n\n/**\n * Given a list of block DOM elements finds the index that a block should be dropped\n * at.\n *\n * @param {Element[]}              elements    Array of DOM elements that represent each block in a block list.\n * @param {WPPoint}                position    The position of the item being dragged.\n * @param {WPBlockListOrientation} orientation The orientation of a block list.\n *\n * @return {number|undefined} The block index that's closest to the drag position.\n */\nexport function getNearestBlockIndex( elements, position, orientation ) {\n\tconst allowedEdges =\n\t\torientation === 'horizontal'\n\t\t\t? [ 'left', 'right' ]\n\t\t\t: [ 'top', 'bottom' ];\n\n\tconst isRightToLeft = isRTL();\n\n\tlet candidateIndex;\n\tlet candidateDistance;\n\n\telements.forEach( ( element, index ) => {\n\t\tconst rect = element.getBoundingClientRect();\n\t\tconst [ distance, edge ] = getDistanceToNearestEdge(\n\t\t\tposition,\n\t\t\trect,\n\t\t\tallowedEdges\n\t\t);\n\n\t\tif ( candidateDistance === undefined || distance < candidateDistance ) {\n\t\t\t// If the user is dropping to the trailing edge of the block\n\t\t\t// add 1 to the index to represent dragging after.\n\t\t\t// Take RTL languages into account where the left edge is\n\t\t\t// the trailing edge.\n\t\t\tconst isTrailingEdge =\n\t\t\t\tedge === 'bottom' ||\n\t\t\t\t( ! isRightToLeft && edge === 'right' ) ||\n\t\t\t\t( isRightToLeft && edge === 'left' );\n\t\t\tconst offset = isTrailingEdge ? 1 : 0;\n\n\t\t\t// Update the currently known best candidate.\n\t\t\tcandidateDistance = distance;\n\t\t\tcandidateIndex = index + offset;\n\t\t}\n\t} );\n\n\treturn candidateIndex;\n}\n\n/**\n * Determine if the element is an empty paragraph block.\n *\n * @param {?HTMLElement} element The element being tested.\n * @return {boolean} True or False.\n */\nfunction isEmptyParagraph( element ) {\n\treturn (\n\t\t!! element &&\n\t\telement.dataset.type === 'core/paragraph' &&\n\t\telement.dataset.empty === 'true'\n\t);\n}\n\n/**\n * @typedef  {Object} WPBlockDropZoneConfig\n * @property {string} rootClientId The root client id for the block list.\n */\n\n/**\n * A React hook that can be used to make a block list handle drag and drop.\n *\n * @param {WPBlockDropZoneConfig} dropZoneConfig configuration data for the drop zone.\n */\nexport default function useBlockDropZone( {\n\t// An undefined value represents a top-level block. Default to an empty\n\t// string for this so that `targetRootClientId` can be easily compared to\n\t// values returned by the `getRootBlockClientId` selector, which also uses\n\t// an empty string to represent top-level blocks.\n\trootClientId: targetRootClientId = '',\n} = {} ) {\n\tconst [ targetBlockIndex, setTargetBlockIndex ] = useState( null );\n\n\tconst isDisabled = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetTemplateLock,\n\t\t\t\t__unstableIsWithinBlockOverlay,\n\t\t\t\t__unstableHasActiveBlockOverlayActive,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst templateLock = getTemplateLock( targetRootClientId );\n\t\t\treturn (\n\t\t\t\t[ 'all', 'contentOnly' ].some(\n\t\t\t\t\t( lock ) => lock === templateLock\n\t\t\t\t) ||\n\t\t\t\t__unstableHasActiveBlockOverlayActive( targetRootClientId ) ||\n\t\t\t\t__unstableIsWithinBlockOverlay( targetRootClientId )\n\t\t\t);\n\t\t},\n\t\t[ targetRootClientId ]\n\t);\n\n\tconst { getBlockListSettings } = useSelect( blockEditorStore );\n\tconst { showInsertionPoint, hideInsertionPoint } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst onBlockDrop = useOnBlockDrop( targetRootClientId, targetBlockIndex );\n\tconst throttled = useThrottle(\n\t\tuseCallback( ( event, currentTarget ) => {\n\t\t\tconst blockElements = Array.from( currentTarget.children ).filter(\n\t\t\t\t// Ensure the element is a block. It should have the `wp-block` class.\n\t\t\t\t( element ) => element.classList.contains( 'wp-block' )\n\t\t\t);\n\t\t\tconst targetIndex = getNearestBlockIndex(\n\t\t\t\tblockElements,\n\t\t\t\t{ x: event.clientX, y: event.clientY },\n\t\t\t\tgetBlockListSettings( targetRootClientId )?.orientation\n\t\t\t);\n\n\t\t\tsetTargetBlockIndex( targetIndex === undefined ? 0 : targetIndex );\n\n\t\t\tif ( targetIndex !== undefined ) {\n\t\t\t\tconst nextBlock = blockElements[ targetIndex ];\n\t\t\t\tconst previousBlock = blockElements[ targetIndex - 1 ];\n\n\t\t\t\t// Don't show the insertion point when it's near an empty paragraph block.\n\t\t\t\tif (\n\t\t\t\t\tisEmptyParagraph( nextBlock ) ||\n\t\t\t\t\tisEmptyParagraph( previousBlock )\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tshowInsertionPoint( targetRootClientId, targetIndex );\n\t\t\t}\n\t\t}, [] ),\n\t\t200\n\t);\n\n\treturn useDropZone( {\n\t\tisDisabled,\n\t\tonDrop: onBlockDrop,\n\t\tonDragOver( event ) {\n\t\t\t// `currentTarget` is only available while the event is being\n\t\t\t// handled, so get it now and pass it to the thottled function.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget\n\t\t\tthrottled( event, event.currentTarget );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tthrottled.cancel();\n\t\t\thideInsertionPoint();\n\t\t\tsetTargetBlockIndex( null );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tthrottled.cancel();\n\t\t\thideInsertionPoint();\n\t\t\tsetTargetBlockIndex( null );\n\t\t},\n\t} );\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/use-block-drop-zone/index.js"],"names":["useDispatch","useSelect","useCallback","useState","useThrottle","__experimentalUseDropZone","useDropZone","isRTL","isUnmodifiedDefaultBlock","getIsUnmodifiedDefaultBlock","useOnBlockDrop","getDistanceToNearestEdge","isPointContainedByRect","store","blockEditorStore","getDropTargetPosition","blocksData","position","orientation","allowedEdges","isRightToLeft","nearestIndex","insertPosition","minDistance","Infinity","forEach","getBoundingClientRect","blockIndex","rect","distance","edge","adjacentIndex","isNearestBlockUnmodifiedDefaultBlock","isAdjacentBlockUnmodifiedDefaultBlock","insertionIndex","useBlockDropZone","rootClientId","targetRootClientId","dropTarget","setDropTarget","index","operation","isDisabled","select","getTemplateLock","__unstableIsWithinBlockOverlay","__unstableHasActiveBlockOverlayActive","templateLock","some","lock","getBlockListSettings","getBlocks","getBlockIndex","showInsertionPoint","hideInsertionPoint","onBlockDrop","throttled","event","ownerDocument","blocks","length","map","block","clientId","getElementById","targetIndex","x","clientX","y","clientY","onDrop","onDragOver","currentTarget","onDragLeave","cancel","onDragEnd"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useCallback, useState } from '@wordpress/element';\nimport {\n\tuseThrottle,\n\t__experimentalUseDropZone as useDropZone,\n} from '@wordpress/compose';\nimport { isRTL } from '@wordpress/i18n';\nimport { isUnmodifiedDefaultBlock as getIsUnmodifiedDefaultBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport useOnBlockDrop from '../use-on-block-drop';\nimport {\n\tgetDistanceToNearestEdge,\n\tisPointContainedByRect,\n} from '../../utils/math';\nimport { store as blockEditorStore } from '../../store';\n\n/** @typedef {import('../../utils/math').WPPoint} WPPoint */\n/** @typedef {import('../use-on-block-drop/types').WPDropOperation} WPDropOperation */\n\n/**\n * The orientation of a block list.\n *\n * @typedef {'horizontal'|'vertical'|undefined} WPBlockListOrientation\n */\n\n/**\n * The insert position when dropping a block.\n *\n * @typedef {'before'|'after'} WPInsertPosition\n */\n\n/**\n * @typedef {Object} WPBlockData\n * @property {boolean}       isUnmodifiedDefaultBlock Is the block unmodified default block.\n * @property {() => DOMRect} getBoundingClientRect    Get the bounding client rect of the block.\n * @property {number}        blockIndex               The index of the block.\n */\n\n/**\n * Get the drop target position from a given drop point and the orientation.\n *\n * @param {WPBlockData[]}          blocksData  The block data list.\n * @param {WPPoint}                position    The position of the item being dragged.\n * @param {WPBlockListOrientation} orientation The orientation of the block list.\n * @return {[number, WPDropOperation]} The drop target position.\n */\nexport function getDropTargetPosition(\n\tblocksData,\n\tposition,\n\torientation = 'vertical'\n) {\n\tconst allowedEdges =\n\t\torientation === 'horizontal'\n\t\t\t? [ 'left', 'right' ]\n\t\t\t: [ 'top', 'bottom' ];\n\n\tconst isRightToLeft = isRTL();\n\n\tlet nearestIndex = 0;\n\tlet insertPosition = 'before';\n\tlet minDistance = Infinity;\n\n\tblocksData.forEach(\n\t\t( { isUnmodifiedDefaultBlock, getBoundingClientRect, blockIndex } ) => {\n\t\t\tconst rect = getBoundingClientRect();\n\n\t\t\tlet [ distance, edge ] = getDistanceToNearestEdge(\n\t\t\t\tposition,\n\t\t\t\trect,\n\t\t\t\tallowedEdges\n\t\t\t);\n\t\t\t// Prioritize the element if the point is inside of an unmodified default block.\n\t\t\tif (\n\t\t\t\tisUnmodifiedDefaultBlock &&\n\t\t\t\tisPointContainedByRect( position, rect )\n\t\t\t) {\n\t\t\t\tdistance = 0;\n\t\t\t}\n\n\t\t\tif ( distance < minDistance ) {\n\t\t\t\t// Where the dropped block will be inserted on the nearest block.\n\t\t\t\tinsertPosition =\n\t\t\t\t\tedge === 'bottom' ||\n\t\t\t\t\t( ! isRightToLeft && edge === 'right' ) ||\n\t\t\t\t\t( isRightToLeft && edge === 'left' )\n\t\t\t\t\t\t? 'after'\n\t\t\t\t\t\t: 'before';\n\n\t\t\t\t// Update the currently known best candidate.\n\t\t\t\tminDistance = distance;\n\t\t\t\tnearestIndex = blockIndex;\n\t\t\t}\n\t\t}\n\t);\n\n\tconst adjacentIndex =\n\t\tnearestIndex + ( insertPosition === 'after' ? 1 : -1 );\n\tconst isNearestBlockUnmodifiedDefaultBlock =\n\t\t!! blocksData[ nearestIndex ]?.isUnmodifiedDefaultBlock;\n\tconst isAdjacentBlockUnmodifiedDefaultBlock =\n\t\t!! blocksData[ adjacentIndex ]?.isUnmodifiedDefaultBlock;\n\n\t// If both blocks are not unmodified default blocks then just insert between them.\n\tif (\n\t\t! isNearestBlockUnmodifiedDefaultBlock &&\n\t\t! isAdjacentBlockUnmodifiedDefaultBlock\n\t) {\n\t\t// If the user is dropping to the trailing edge of the block\n\t\t// add 1 to the index to represent dragging after.\n\t\tconst insertionIndex =\n\t\t\tinsertPosition === 'after' ? nearestIndex + 1 : nearestIndex;\n\t\treturn [ insertionIndex, 'insert' ];\n\t}\n\n\t// Otherwise, replace the nearest unmodified default block.\n\treturn [\n\t\tisNearestBlockUnmodifiedDefaultBlock ? nearestIndex : adjacentIndex,\n\t\t'replace',\n\t];\n}\n\n/**\n * @typedef  {Object} WPBlockDropZoneConfig\n * @property {string} rootClientId The root client id for the block list.\n */\n\n/**\n * A React hook that can be used to make a block list handle drag and drop.\n *\n * @param {WPBlockDropZoneConfig} dropZoneConfig configuration data for the drop zone.\n */\nexport default function useBlockDropZone( {\n\t// An undefined value represents a top-level block. Default to an empty\n\t// string for this so that `targetRootClientId` can be easily compared to\n\t// values returned by the `getRootBlockClientId` selector, which also uses\n\t// an empty string to represent top-level blocks.\n\trootClientId: targetRootClientId = '',\n} = {} ) {\n\tconst [ dropTarget, setDropTarget ] = useState( {\n\t\tindex: null,\n\t\toperation: 'insert',\n\t} );\n\n\tconst isDisabled = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetTemplateLock,\n\t\t\t\t__unstableIsWithinBlockOverlay,\n\t\t\t\t__unstableHasActiveBlockOverlayActive,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst templateLock = getTemplateLock( targetRootClientId );\n\t\t\treturn (\n\t\t\t\t[ 'all', 'contentOnly' ].some(\n\t\t\t\t\t( lock ) => lock === templateLock\n\t\t\t\t) ||\n\t\t\t\t__unstableHasActiveBlockOverlayActive( targetRootClientId ) ||\n\t\t\t\t__unstableIsWithinBlockOverlay( targetRootClientId )\n\t\t\t);\n\t\t},\n\t\t[ targetRootClientId ]\n\t);\n\n\tconst { getBlockListSettings, getBlocks, getBlockIndex } =\n\t\tuseSelect( blockEditorStore );\n\tconst { showInsertionPoint, hideInsertionPoint } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst onBlockDrop = useOnBlockDrop( targetRootClientId, dropTarget.index, {\n\t\toperation: dropTarget.operation,\n\t} );\n\tconst throttled = useThrottle(\n\t\tuseCallback(\n\t\t\t( event, ownerDocument ) => {\n\t\t\t\tconst blocks = getBlocks( targetRootClientId );\n\n\t\t\t\t// The block list is empty, don't show the insertion point but still allow dropping.\n\t\t\t\tif ( blocks.length === 0 ) {\n\t\t\t\t\tsetDropTarget( {\n\t\t\t\t\t\tindex: 0,\n\t\t\t\t\t\toperation: 'insert',\n\t\t\t\t\t} );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst blocksData = blocks.map( ( block ) => {\n\t\t\t\t\tconst clientId = block.clientId;\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\tisUnmodifiedDefaultBlock:\n\t\t\t\t\t\t\tgetIsUnmodifiedDefaultBlock( block ),\n\t\t\t\t\t\tgetBoundingClientRect: () =>\n\t\t\t\t\t\t\townerDocument\n\t\t\t\t\t\t\t\t.getElementById( `block-${ clientId }` )\n\t\t\t\t\t\t\t\t.getBoundingClientRect(),\n\t\t\t\t\t\tblockIndex: getBlockIndex( clientId ),\n\t\t\t\t\t};\n\t\t\t\t} );\n\n\t\t\t\tconst [ targetIndex, operation ] = getDropTargetPosition(\n\t\t\t\t\tblocksData,\n\t\t\t\t\t{ x: event.clientX, y: event.clientY },\n\t\t\t\t\tgetBlockListSettings( targetRootClientId )?.orientation\n\t\t\t\t);\n\n\t\t\t\tsetDropTarget( {\n\t\t\t\t\tindex: targetIndex,\n\t\t\t\t\toperation,\n\t\t\t\t} );\n\t\t\t\tshowInsertionPoint( targetRootClientId, targetIndex, {\n\t\t\t\t\toperation,\n\t\t\t\t} );\n\t\t\t},\n\t\t\t[ targetRootClientId ]\n\t\t),\n\t\t200\n\t);\n\n\treturn useDropZone( {\n\t\tisDisabled,\n\t\tonDrop: onBlockDrop,\n\t\tonDragOver( event ) {\n\t\t\t// `currentTarget` is only available while the event is being\n\t\t\t// handled, so get it now and pass it to the thottled function.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget\n\t\t\tthrottled( event, event.currentTarget.ownerDocument );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tthrottled.cancel();\n\t\t\thideInsertionPoint();\n\t\t},\n\t\tonDragEnd() {\n\t\t\tthrottled.cancel();\n\t\t\thideInsertionPoint();\n\t\t},\n\t} );\n}\n"]}

package/build-module/components/use-on-block-drop/index.js

@@ -12,6 +12,8 @@ import { getFilesFromDataTransfer } from '@wordpress/dom';
 import { store as blockEditorStore } from '../../store';
 /** @typedef {import('@wordpress/element').WPSyntheticEvent} WPSyntheticEvent */
 
+/** @typedef {import('./types').WPDropOperation} WPDropOperation */
+
 /**
  * Retrieve the data for a block drop event.
  *
@@ -146,20 +148,18 @@ export function onHTMLDrop(targetRootClientId, targetBlockIndex, insertOrReplace
 /**
  * A React hook for handling block drop events.
  *
- * @typedef {'insert'|'replace'} DropAction The type of action to perform on drop.
- *
- * @param {string}     targetRootClientId The root client id where the block(s) will be inserted.
- * @param {number}     targetBlockIndex   The index where the block(s) will be inserted.
- * @param {Object}     options            The optional options.
- * @param {DropAction} options.action     The type of action to perform on drop. Could be `insert` or `replace` for now.
+ * @param {string}          targetRootClientId  The root client id where the block(s) will be inserted.
+ * @param {number}          targetBlockIndex    The index where the block(s) will be inserted.
+ * @param {Object}          options             The optional options.
+ * @param {WPDropOperation} [options.operation] The type of operation to perform on drop. Could be `insert` or `replace` for now.
  *
- * @return {Object} An object that contains the event handlers `onDrop`, `onFilesDrop` and `onHTMLDrop`.
+ * @return {Function} A function to be passed to the onDrop handler.
  */
 
 export default function useOnBlockDrop(targetRootClientId, targetBlockIndex) {
   let options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   const {
-    action = 'insert'
+    operation = 'insert'
   } = options;
   const hasUploadPermissions = useSelect(select => select(blockEditorStore).getSettings().mediaUpload, []);
   const {
@@ -182,16 +182,16 @@ export default function useOnBlockDrop(targetRootClientId, targetBlockIndex) {
     let updateSelection = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
     let initialPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
 
-    if (action === 'replace') {
+    if (operation === 'replace') {
       const clientIds = getBlockOrder(targetRootClientId);
       const clientId = clientIds[targetBlockIndex];
       replaceBlocks(clientId, blocks, undefined, initialPosition);
     } else {
       insertBlocks(blocks, targetBlockIndex, targetRootClientId, updateSelection, initialPosition);
     }
-  }, [action, getBlockOrder, insertBlocks, replaceBlocks, targetBlockIndex, targetRootClientId]);
+  }, [operation, getBlockOrder, insertBlocks, replaceBlocks, targetBlockIndex, targetRootClientId]);
   const moveBlocks = useCallback((sourceClientIds, sourceRootClientId, insertIndex) => {
-    if (action === 'replace') {
+    if (operation === 'replace') {
       const sourceBlocks = getBlocksByClientId(sourceClientIds);
       const targetBlockClientIds = getBlockOrder(targetRootClientId);
       const targetBlockClientId = targetBlockClientIds[targetBlockIndex];
@@ -204,7 +204,7 @@ export default function useOnBlockDrop(targetRootClientId, targetBlockIndex) {
     } else {
       moveBlocksToPosition(sourceClientIds, sourceRootClientId, targetRootClientId, insertIndex);
     }
-  }, [action, getBlockOrder, getBlocksByClientId, insertBlocks, moveBlocksToPosition, removeBlocks, targetBlockIndex, targetRootClientId]);
+  }, [operation, getBlockOrder, getBlocksByClientId, insertBlocks, moveBlocksToPosition, removeBlocks, targetBlockIndex, targetRootClientId]);
 
   const _onDrop = onBlockDrop(targetRootClientId, targetBlockIndex, getBlockIndex, getClientIdsOfDescendants, moveBlocks, insertOrReplaceBlocks, clearSelectedBlock);