@wordpress/block-editor 10.0.1 → 10.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -0
- package/build/components/block-list/index.js +19 -5
- package/build/components/block-list/index.js.map +1 -1
- package/build/components/block-list/use-block-props/index.js +7 -1
- package/build/components/block-list/use-block-props/index.js.map +1 -1
- package/build/components/block-list/use-in-between-inserter.js +10 -1
- package/build/components/block-list/use-in-between-inserter.js.map +1 -1
- package/build/components/block-popover/inbetween.js +24 -9
- package/build/components/block-popover/inbetween.js.map +1 -1
- package/build/components/block-popover/index.js +29 -2
- package/build/components/block-popover/index.js.map +1 -1
- package/build/components/block-preview/auto.js +23 -11
- package/build/components/block-preview/auto.js.map +1 -1
- package/build/components/block-styles/index.js +1 -3
- package/build/components/block-styles/index.js.map +1 -1
- package/build/components/block-tools/index.js +18 -13
- package/build/components/block-tools/index.js.map +1 -1
- package/build/components/block-tools/insertion-point.js +5 -3
- package/build/components/block-tools/insertion-point.js.map +1 -1
- package/build/components/block-variation-picker/index.native.js +2 -1
- package/build/components/block-variation-picker/index.native.js.map +1 -1
- package/build/components/button-block-appender/index.native.js +1 -0
- package/build/components/button-block-appender/index.native.js.map +1 -1
- package/build/components/list-view/index.js +2 -1
- package/build/components/list-view/index.js.map +1 -1
- package/build/components/rich-text/format-toolbar-container.js +8 -1
- package/build/components/rich-text/format-toolbar-container.js.map +1 -1
- package/build/components/rich-text/index.js +12 -0
- package/build/components/rich-text/index.js.map +1 -1
- package/build/components/url-input/index.js +1 -3
- package/build/components/url-input/index.js.map +1 -1
- package/build/components/use-setting/index.js +16 -12
- package/build/components/use-setting/index.js.map +1 -1
- package/build/components/writing-flow/use-arrow-nav.js +7 -1
- package/build/components/writing-flow/use-arrow-nav.js.map +1 -1
- package/build/store/reducer.js +33 -19
- package/build/store/reducer.js.map +1 -1
- package/build/store/selectors.js +4 -4
- package/build/store/selectors.js.map +1 -1
- package/build-module/components/block-list/index.js +22 -8
- package/build-module/components/block-list/index.js.map +1 -1
- package/build-module/components/block-list/use-block-props/index.js +8 -2
- package/build-module/components/block-list/use-block-props/index.js.map +1 -1
- package/build-module/components/block-list/use-in-between-inserter.js +11 -2
- package/build-module/components/block-list/use-in-between-inserter.js.map +1 -1
- package/build-module/components/block-popover/inbetween.js +24 -9
- package/build-module/components/block-popover/inbetween.js.map +1 -1
- package/build-module/components/block-popover/index.js +29 -3
- package/build-module/components/block-popover/index.js.map +1 -1
- package/build-module/components/block-preview/auto.js +22 -10
- package/build-module/components/block-preview/auto.js.map +1 -1
- package/build-module/components/block-styles/index.js +1 -2
- package/build-module/components/block-styles/index.js.map +1 -1
- package/build-module/components/block-tools/index.js +18 -12
- package/build-module/components/block-tools/index.js.map +1 -1
- package/build-module/components/block-tools/insertion-point.js +5 -3
- package/build-module/components/block-tools/insertion-point.js.map +1 -1
- package/build-module/components/block-variation-picker/index.native.js +2 -1
- package/build-module/components/block-variation-picker/index.native.js.map +1 -1
- package/build-module/components/button-block-appender/index.native.js +1 -0
- package/build-module/components/button-block-appender/index.native.js.map +1 -1
- package/build-module/components/list-view/index.js +2 -1
- package/build-module/components/list-view/index.js.map +1 -1
- package/build-module/components/rich-text/format-toolbar-container.js +6 -1
- package/build-module/components/rich-text/format-toolbar-container.js.map +1 -1
- package/build-module/components/rich-text/index.js +12 -0
- package/build-module/components/rich-text/index.js.map +1 -1
- package/build-module/components/url-input/index.js +1 -2
- package/build-module/components/url-input/index.js.map +1 -1
- package/build-module/components/use-setting/index.js +16 -12
- package/build-module/components/use-setting/index.js.map +1 -1
- package/build-module/components/writing-flow/use-arrow-nav.js +8 -2
- package/build-module/components/writing-flow/use-arrow-nav.js.map +1 -1
- package/build-module/store/reducer.js +29 -18
- package/build-module/store/reducer.js.map +1 -1
- package/build-module/store/selectors.js +4 -4
- package/build-module/store/selectors.js.map +1 -1
- package/build-style/style-rtl.css +3 -5
- package/build-style/style.css +3 -5
- package/package.json +28 -28
- package/src/components/block-controls/test/index.js +84 -8
- package/src/components/block-list/index.js +42 -6
- package/src/components/block-list/use-block-props/index.js +6 -1
- package/src/components/block-list/use-in-between-inserter.js +9 -3
- package/src/components/block-mover/style.scss +2 -7
- package/src/components/block-popover/inbetween.js +34 -10
- package/src/components/block-popover/index.js +47 -2
- package/src/components/block-preview/auto.js +77 -65
- package/src/components/block-styles/index.js +1 -2
- package/src/components/block-tools/index.js +16 -10
- package/src/components/block-tools/insertion-point.js +3 -3
- package/src/components/block-variation-picker/index.native.js +1 -0
- package/src/components/button-block-appender/index.native.js +1 -0
- package/src/components/link-control/test/index.js +1 -2
- package/src/components/list-view/index.js +1 -0
- package/src/components/rich-text/format-toolbar-container.js +8 -2
- package/src/components/rich-text/index.js +14 -0
- package/src/components/url-input/index.js +6 -2
- package/src/components/use-setting/index.js +18 -16
- package/src/components/warning/style.scss +1 -0
- package/src/components/writing-flow/use-arrow-nav.js +11 -1
- package/src/store/reducer.js +22 -14
- package/src/store/selectors.js +4 -4
- package/src/store/test/reducer.js +0 -17
- package/src/components/block-controls/test/__snapshots__/index.js.snap +0 -64
|
@@ -8,9 +8,9 @@ import classnames from 'classnames';
|
|
|
8
8
|
* WordPress dependencies
|
|
9
9
|
*/
|
|
10
10
|
|
|
11
|
-
import { AsyncModeProvider, useSelect, useDispatch } from '@wordpress/data';
|
|
12
|
-
import { useViewportMatch, useMergeRefs } from '@wordpress/compose';
|
|
13
|
-
import { createContext, useState, useMemo } from '@wordpress/element';
|
|
11
|
+
import { AsyncModeProvider, useSelect, useDispatch, useRegistry } from '@wordpress/data';
|
|
12
|
+
import { useViewportMatch, useMergeRefs, useDebounce } from '@wordpress/compose';
|
|
13
|
+
import { createContext, useState, useMemo, useCallback } from '@wordpress/element';
|
|
14
14
|
/**
|
|
15
15
|
* Internal dependencies
|
|
16
16
|
*/
|
|
@@ -27,6 +27,7 @@ import { useInnerBlocksProps } from '../inner-blocks';
|
|
|
27
27
|
import { BlockEditContextProvider, DEFAULT_BLOCK_EDIT_CONTEXT } from '../block-edit/context';
|
|
28
28
|
const elementContext = createContext();
|
|
29
29
|
export const IntersectionObserver = createContext();
|
|
30
|
+
const pendingBlockVisibilityUpdatesPerRegistry = new WeakMap();
|
|
30
31
|
|
|
31
32
|
function Root(_ref) {
|
|
32
33
|
let {
|
|
@@ -54,9 +55,20 @@ function Root(_ref) {
|
|
|
54
55
|
editorMode: __unstableGetEditorMode()
|
|
55
56
|
};
|
|
56
57
|
}, []);
|
|
58
|
+
const registry = useRegistry();
|
|
57
59
|
const {
|
|
58
60
|
setBlockVisibility
|
|
59
61
|
} = useDispatch(blockEditorStore);
|
|
62
|
+
const delayedBlockVisibilityUpdates = useDebounce(useCallback(() => {
|
|
63
|
+
const updates = {};
|
|
64
|
+
pendingBlockVisibilityUpdatesPerRegistry.get(registry).forEach(_ref2 => {
|
|
65
|
+
let [id, isIntersecting] = _ref2;
|
|
66
|
+
updates[id] = isIntersecting;
|
|
67
|
+
});
|
|
68
|
+
setBlockVisibility(updates);
|
|
69
|
+
}, [registry]), 300, {
|
|
70
|
+
trailing: true
|
|
71
|
+
});
|
|
60
72
|
const intersectionObserver = useMemo(() => {
|
|
61
73
|
const {
|
|
62
74
|
IntersectionObserver: Observer
|
|
@@ -67,14 +79,16 @@ function Root(_ref) {
|
|
|
67
79
|
}
|
|
68
80
|
|
|
69
81
|
return new Observer(entries => {
|
|
70
|
-
|
|
82
|
+
if (!pendingBlockVisibilityUpdatesPerRegistry.get(registry)) {
|
|
83
|
+
pendingBlockVisibilityUpdatesPerRegistry.set(registry, []);
|
|
84
|
+
}
|
|
71
85
|
|
|
72
86
|
for (const entry of entries) {
|
|
73
87
|
const clientId = entry.target.getAttribute('data-block');
|
|
74
|
-
|
|
88
|
+
pendingBlockVisibilityUpdatesPerRegistry.get(registry).push([clientId, entry.isIntersecting]);
|
|
75
89
|
}
|
|
76
90
|
|
|
77
|
-
|
|
91
|
+
delayedBlockVisibilityUpdates();
|
|
78
92
|
});
|
|
79
93
|
}, []);
|
|
80
94
|
const innerBlocksProps = useInnerBlocksProps({
|
|
@@ -100,14 +114,14 @@ export default function BlockList(settings) {
|
|
|
100
114
|
}
|
|
101
115
|
BlockList.__unstableElementContext = elementContext;
|
|
102
116
|
|
|
103
|
-
function Items(
|
|
117
|
+
function Items(_ref3) {
|
|
104
118
|
let {
|
|
105
119
|
placeholder,
|
|
106
120
|
rootClientId,
|
|
107
121
|
renderAppender,
|
|
108
122
|
__experimentalAppenderTagName,
|
|
109
123
|
__experimentalLayout: layout = defaultLayout
|
|
110
|
-
} =
|
|
124
|
+
} = _ref3;
|
|
111
125
|
const {
|
|
112
126
|
order,
|
|
113
127
|
selectedBlocks,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/block-editor/src/components/block-list/index.js"],"names":["classnames","AsyncModeProvider","useSelect","useDispatch","useViewportMatch","useMergeRefs","createContext","useState","useMemo","BlockListBlock","BlockListAppender","useInBetweenInserter","store","blockEditorStore","usePreParsePatterns","LayoutProvider","defaultLayout","BlockToolsBackCompat","useBlockSelectionClearer","useInnerBlocksProps","BlockEditContextProvider","DEFAULT_BLOCK_EDIT_CONTEXT","elementContext","IntersectionObserver","Root","className","settings","element","setElement","isLargeViewport","isOutlineMode","isFocusMode","editorMode","select","getSettings","__unstableGetEditorMode","outlineMode","focusMode","setBlockVisibility","intersectionObserver","Observer","window","entries","updates","entry","clientId","target","getAttribute","isIntersecting","innerBlocksProps","ref","BlockList","__unstableElementContext","Items","placeholder","rootClientId","renderAppender","__experimentalAppenderTagName","__experimentalLayout","layout","order","selectedBlocks","visibleBlocks","getBlockOrder","getSelectedBlockClientIds","__unstableGetVisibleBlocks","map","has","includes","length","BlockListItems","props"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { AsyncModeProvider, useSelect, useDispatch } from '@wordpress/data';\nimport { useViewportMatch, useMergeRefs } from '@wordpress/compose';\nimport { createContext, useState, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BlockListBlock from './block';\nimport BlockListAppender from '../block-list-appender';\nimport { useInBetweenInserter } from './use-in-between-inserter';\nimport { store as blockEditorStore } from '../../store';\nimport { usePreParsePatterns } from '../../utils/pre-parse-patterns';\nimport { LayoutProvider, defaultLayout } from './layout';\nimport BlockToolsBackCompat from '../block-tools/back-compat';\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useInnerBlocksProps } from '../inner-blocks';\nimport {\n\tBlockEditContextProvider,\n\tDEFAULT_BLOCK_EDIT_CONTEXT,\n} from '../block-edit/context';\n\nconst elementContext = createContext();\n\nexport const IntersectionObserver = createContext();\n\nfunction Root( { className, ...settings } ) {\n\tconst [ element, setElement ] = useState();\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst { isOutlineMode, isFocusMode, editorMode } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getSettings, __unstableGetEditorMode } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst { outlineMode, focusMode } = getSettings();\n\t\t\treturn {\n\t\t\t\tisOutlineMode: outlineMode,\n\t\t\t\tisFocusMode: focusMode,\n\t\t\t\teditorMode: __unstableGetEditorMode(),\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { setBlockVisibility } = useDispatch( blockEditorStore );\n\tconst intersectionObserver = useMemo( () => {\n\t\tconst { IntersectionObserver: Observer } = window;\n\n\t\tif ( ! Observer ) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn new Observer( ( entries ) => {\n\t\t\tconst updates = {};\n\t\t\tfor ( const entry of entries ) {\n\t\t\t\tconst clientId = entry.target.getAttribute( 'data-block' );\n\t\t\t\tupdates[ clientId ] = entry.isIntersecting;\n\t\t\t}\n\t\t\tsetBlockVisibility( updates );\n\t\t} );\n\t}, [] );\n\tconst innerBlocksProps = useInnerBlocksProps(\n\t\t{\n\t\t\tref: useMergeRefs( [\n\t\t\t\tuseBlockSelectionClearer(),\n\t\t\t\tuseInBetweenInserter(),\n\t\t\t\tsetElement,\n\t\t\t] ),\n\t\t\tclassName: classnames( 'is-root-container', className, {\n\t\t\t\t'is-outline-mode': isOutlineMode,\n\t\t\t\t'is-focus-mode': isFocusMode && isLargeViewport,\n\t\t\t\t'is-navigate-mode': editorMode === 'navigation',\n\t\t\t} ),\n\t\t},\n\t\tsettings\n\t);\n\treturn (\n\t\t<elementContext.Provider value={ element }>\n\t\t\t<IntersectionObserver.Provider value={ intersectionObserver }>\n\t\t\t\t<div { ...innerBlocksProps } />\n\t\t\t</IntersectionObserver.Provider>\n\t\t</elementContext.Provider>\n\t);\n}\n\nexport default function BlockList( settings ) {\n\tusePreParsePatterns();\n\treturn (\n\t\t<BlockToolsBackCompat>\n\t\t\t<BlockEditContextProvider value={ DEFAULT_BLOCK_EDIT_CONTEXT }>\n\t\t\t\t<Root { ...settings } />\n\t\t\t</BlockEditContextProvider>\n\t\t</BlockToolsBackCompat>\n\t);\n}\n\nBlockList.__unstableElementContext = elementContext;\n\nfunction Items( {\n\tplaceholder,\n\trootClientId,\n\trenderAppender,\n\t__experimentalAppenderTagName,\n\t__experimentalLayout: layout = defaultLayout,\n} ) {\n\tconst { order, selectedBlocks, visibleBlocks } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockOrder,\n\t\t\t\tgetSelectedBlockClientIds,\n\t\t\t\t__unstableGetVisibleBlocks,\n\t\t\t} = select( blockEditorStore );\n\t\t\treturn {\n\t\t\t\torder: getBlockOrder( rootClientId ),\n\t\t\t\tselectedBlocks: getSelectedBlockClientIds(),\n\t\t\t\tvisibleBlocks: __unstableGetVisibleBlocks(),\n\t\t\t};\n\t\t},\n\t\t[ rootClientId ]\n\t);\n\n\treturn (\n\t\t<LayoutProvider value={ layout }>\n\t\t\t{ order.map( ( clientId ) => (\n\t\t\t\t<AsyncModeProvider\n\t\t\t\t\tkey={ clientId }\n\t\t\t\t\tvalue={\n\t\t\t\t\t\t// Only provide data asynchronously if the block is\n\t\t\t\t\t\t// not visible and not selected.\n\t\t\t\t\t\t! visibleBlocks.has( clientId ) &&\n\t\t\t\t\t\t! selectedBlocks.includes( clientId )\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<BlockListBlock\n\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t</AsyncModeProvider>\n\t\t\t) ) }\n\t\t\t{ order.length < 1 && placeholder }\n\t\t\t<BlockListAppender\n\t\t\t\ttagName={ __experimentalAppenderTagName }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t\trenderAppender={ renderAppender }\n\t\t\t/>\n\t\t</LayoutProvider>\n\t);\n}\n\nexport function BlockListItems( props ) {\n\t// This component needs to always be synchronous as it's the one changing\n\t// the async mode depending on the block selection.\n\treturn (\n\t\t<AsyncModeProvider value={ false }>\n\t\t\t<Items { ...props } />\n\t\t</AsyncModeProvider>\n\t);\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/block-editor/src/components/block-list/index.js"],"names":["classnames","AsyncModeProvider","useSelect","useDispatch","useRegistry","useViewportMatch","useMergeRefs","useDebounce","createContext","useState","useMemo","useCallback","BlockListBlock","BlockListAppender","useInBetweenInserter","store","blockEditorStore","usePreParsePatterns","LayoutProvider","defaultLayout","BlockToolsBackCompat","useBlockSelectionClearer","useInnerBlocksProps","BlockEditContextProvider","DEFAULT_BLOCK_EDIT_CONTEXT","elementContext","IntersectionObserver","pendingBlockVisibilityUpdatesPerRegistry","WeakMap","Root","className","settings","element","setElement","isLargeViewport","isOutlineMode","isFocusMode","editorMode","select","getSettings","__unstableGetEditorMode","outlineMode","focusMode","registry","setBlockVisibility","delayedBlockVisibilityUpdates","updates","get","forEach","id","isIntersecting","trailing","intersectionObserver","Observer","window","entries","set","entry","clientId","target","getAttribute","push","innerBlocksProps","ref","BlockList","__unstableElementContext","Items","placeholder","rootClientId","renderAppender","__experimentalAppenderTagName","__experimentalLayout","layout","order","selectedBlocks","visibleBlocks","getBlockOrder","getSelectedBlockClientIds","__unstableGetVisibleBlocks","map","has","includes","length","BlockListItems","props"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tAsyncModeProvider,\n\tuseSelect,\n\tuseDispatch,\n\tuseRegistry,\n} from '@wordpress/data';\nimport {\n\tuseViewportMatch,\n\tuseMergeRefs,\n\tuseDebounce,\n} from '@wordpress/compose';\nimport {\n\tcreateContext,\n\tuseState,\n\tuseMemo,\n\tuseCallback,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BlockListBlock from './block';\nimport BlockListAppender from '../block-list-appender';\nimport { useInBetweenInserter } from './use-in-between-inserter';\nimport { store as blockEditorStore } from '../../store';\nimport { usePreParsePatterns } from '../../utils/pre-parse-patterns';\nimport { LayoutProvider, defaultLayout } from './layout';\nimport BlockToolsBackCompat from '../block-tools/back-compat';\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useInnerBlocksProps } from '../inner-blocks';\nimport {\n\tBlockEditContextProvider,\n\tDEFAULT_BLOCK_EDIT_CONTEXT,\n} from '../block-edit/context';\n\nconst elementContext = createContext();\n\nexport const IntersectionObserver = createContext();\nconst pendingBlockVisibilityUpdatesPerRegistry = new WeakMap();\n\nfunction Root( { className, ...settings } ) {\n\tconst [ element, setElement ] = useState();\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst { isOutlineMode, isFocusMode, editorMode } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getSettings, __unstableGetEditorMode } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst { outlineMode, focusMode } = getSettings();\n\t\t\treturn {\n\t\t\t\tisOutlineMode: outlineMode,\n\t\t\t\tisFocusMode: focusMode,\n\t\t\t\teditorMode: __unstableGetEditorMode(),\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst registry = useRegistry();\n\tconst { setBlockVisibility } = useDispatch( blockEditorStore );\n\n\tconst delayedBlockVisibilityUpdates = useDebounce(\n\t\tuseCallback( () => {\n\t\t\tconst updates = {};\n\t\t\tpendingBlockVisibilityUpdatesPerRegistry\n\t\t\t\t.get( registry )\n\t\t\t\t.forEach( ( [ id, isIntersecting ] ) => {\n\t\t\t\t\tupdates[ id ] = isIntersecting;\n\t\t\t\t} );\n\t\t\tsetBlockVisibility( updates );\n\t\t}, [ registry ] ),\n\t\t300,\n\t\t{\n\t\t\ttrailing: true,\n\t\t}\n\t);\n\tconst intersectionObserver = useMemo( () => {\n\t\tconst { IntersectionObserver: Observer } = window;\n\n\t\tif ( ! Observer ) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn new Observer( ( entries ) => {\n\t\t\tif ( ! pendingBlockVisibilityUpdatesPerRegistry.get( registry ) ) {\n\t\t\t\tpendingBlockVisibilityUpdatesPerRegistry.set( registry, [] );\n\t\t\t}\n\t\t\tfor ( const entry of entries ) {\n\t\t\t\tconst clientId = entry.target.getAttribute( 'data-block' );\n\t\t\t\tpendingBlockVisibilityUpdatesPerRegistry\n\t\t\t\t\t.get( registry )\n\t\t\t\t\t.push( [ clientId, entry.isIntersecting ] );\n\t\t\t}\n\t\t\tdelayedBlockVisibilityUpdates();\n\t\t} );\n\t}, [] );\n\tconst innerBlocksProps = useInnerBlocksProps(\n\t\t{\n\t\t\tref: useMergeRefs( [\n\t\t\t\tuseBlockSelectionClearer(),\n\t\t\t\tuseInBetweenInserter(),\n\t\t\t\tsetElement,\n\t\t\t] ),\n\t\t\tclassName: classnames( 'is-root-container', className, {\n\t\t\t\t'is-outline-mode': isOutlineMode,\n\t\t\t\t'is-focus-mode': isFocusMode && isLargeViewport,\n\t\t\t\t'is-navigate-mode': editorMode === 'navigation',\n\t\t\t} ),\n\t\t},\n\t\tsettings\n\t);\n\treturn (\n\t\t<elementContext.Provider value={ element }>\n\t\t\t<IntersectionObserver.Provider value={ intersectionObserver }>\n\t\t\t\t<div { ...innerBlocksProps } />\n\t\t\t</IntersectionObserver.Provider>\n\t\t</elementContext.Provider>\n\t);\n}\n\nexport default function BlockList( settings ) {\n\tusePreParsePatterns();\n\treturn (\n\t\t<BlockToolsBackCompat>\n\t\t\t<BlockEditContextProvider value={ DEFAULT_BLOCK_EDIT_CONTEXT }>\n\t\t\t\t<Root { ...settings } />\n\t\t\t</BlockEditContextProvider>\n\t\t</BlockToolsBackCompat>\n\t);\n}\n\nBlockList.__unstableElementContext = elementContext;\n\nfunction Items( {\n\tplaceholder,\n\trootClientId,\n\trenderAppender,\n\t__experimentalAppenderTagName,\n\t__experimentalLayout: layout = defaultLayout,\n} ) {\n\tconst { order, selectedBlocks, visibleBlocks } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockOrder,\n\t\t\t\tgetSelectedBlockClientIds,\n\t\t\t\t__unstableGetVisibleBlocks,\n\t\t\t} = select( blockEditorStore );\n\t\t\treturn {\n\t\t\t\torder: getBlockOrder( rootClientId ),\n\t\t\t\tselectedBlocks: getSelectedBlockClientIds(),\n\t\t\t\tvisibleBlocks: __unstableGetVisibleBlocks(),\n\t\t\t};\n\t\t},\n\t\t[ rootClientId ]\n\t);\n\n\treturn (\n\t\t<LayoutProvider value={ layout }>\n\t\t\t{ order.map( ( clientId ) => (\n\t\t\t\t<AsyncModeProvider\n\t\t\t\t\tkey={ clientId }\n\t\t\t\t\tvalue={\n\t\t\t\t\t\t// Only provide data asynchronously if the block is\n\t\t\t\t\t\t// not visible and not selected.\n\t\t\t\t\t\t! visibleBlocks.has( clientId ) &&\n\t\t\t\t\t\t! selectedBlocks.includes( clientId )\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<BlockListBlock\n\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t</AsyncModeProvider>\n\t\t\t) ) }\n\t\t\t{ order.length < 1 && placeholder }\n\t\t\t<BlockListAppender\n\t\t\t\ttagName={ __experimentalAppenderTagName }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t\trenderAppender={ renderAppender }\n\t\t\t/>\n\t\t</LayoutProvider>\n\t);\n}\n\nexport function BlockListItems( props ) {\n\t// This component needs to always be synchronous as it's the one changing\n\t// the async mode depending on the block selection.\n\treturn (\n\t\t<AsyncModeProvider value={ false }>\n\t\t\t<Items { ...props } />\n\t\t</AsyncModeProvider>\n\t);\n}\n"]}
|
|
@@ -8,7 +8,7 @@ import classnames from 'classnames';
|
|
|
8
8
|
|
|
9
9
|
import { useContext } from '@wordpress/element';
|
|
10
10
|
import { __, sprintf } from '@wordpress/i18n';
|
|
11
|
-
import { __unstableGetBlockProps as getBlockProps, getBlockType } from '@wordpress/blocks';
|
|
11
|
+
import { __unstableGetBlockProps as getBlockProps, getBlockType, store as blocksStore } from '@wordpress/blocks';
|
|
12
12
|
import { useMergeRefs, useDisabled } from '@wordpress/compose';
|
|
13
13
|
import { useSelect } from '@wordpress/data';
|
|
14
14
|
import warning from '@wordpress/warning';
|
|
@@ -77,6 +77,7 @@ export function useBlockProps() {
|
|
|
77
77
|
enableAnimation
|
|
78
78
|
} = useSelect(select => {
|
|
79
79
|
const {
|
|
80
|
+
getBlockAttributes,
|
|
80
81
|
getBlockIndex,
|
|
81
82
|
getBlockMode,
|
|
82
83
|
getBlockName,
|
|
@@ -87,16 +88,21 @@ export function useBlockProps() {
|
|
|
87
88
|
isAncestorMultiSelected,
|
|
88
89
|
isFirstMultiSelectedBlock
|
|
89
90
|
} = select(blockEditorStore);
|
|
91
|
+
const {
|
|
92
|
+
getActiveBlockVariation
|
|
93
|
+
} = select(blocksStore);
|
|
90
94
|
const isSelected = isBlockSelected(clientId);
|
|
91
95
|
const isPartOfMultiSelection = isBlockMultiSelected(clientId) || isAncestorMultiSelected(clientId);
|
|
92
96
|
const blockName = getBlockName(clientId);
|
|
93
97
|
const blockType = getBlockType(blockName);
|
|
98
|
+
const attributes = getBlockAttributes(clientId);
|
|
99
|
+
const match = getActiveBlockVariation(blockName, attributes);
|
|
94
100
|
return {
|
|
95
101
|
index: getBlockIndex(clientId),
|
|
96
102
|
mode: getBlockMode(clientId),
|
|
97
103
|
name: blockName,
|
|
98
104
|
blockApiVersion: (blockType === null || blockType === void 0 ? void 0 : blockType.apiVersion) || 1,
|
|
99
|
-
blockTitle: blockType === null || blockType === void 0 ? void 0 : blockType.title,
|
|
105
|
+
blockTitle: (match === null || match === void 0 ? void 0 : match.title) || (blockType === null || blockType === void 0 ? void 0 : blockType.title),
|
|
100
106
|
isPartOfSelection: isSelected || isPartOfMultiSelection,
|
|
101
107
|
adjustScrolling: isSelected || isFirstMultiSelectedBlock(clientId),
|
|
102
108
|
enableAnimation: !isTyping() && getGlobalBlockCount() <= BLOCK_ANIMATION_THRESHOLD
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/block-editor/src/components/block-list/use-block-props/index.js"],"names":["classnames","useContext","__","sprintf","__unstableGetBlockProps","getBlockProps","getBlockType","useMergeRefs","useDisabled","useSelect","warning","useMovingAnimation","BlockListBlockContext","useFocusFirstElement","useIsHovered","useBlockEditContext","useBlockClassNames","useBlockDefaultClassName","useBlockCustomClassName","useBlockMovingModeClassNames","useFocusHandler","useEventHandlers","useNavModeExit","useBlockRefProvider","useIntersectionObserver","store","blockEditorStore","useBlockOverlayActive","BLOCK_ANIMATION_THRESHOLD","useBlockProps","props","__unstableIsHtml","clientId","className","wrapperProps","isAligned","index","mode","name","blockApiVersion","blockTitle","isPartOfSelection","adjustScrolling","enableAnimation","select","getBlockIndex","getBlockMode","getBlockName","isTyping","getGlobalBlockCount","isBlockSelected","isBlockMultiSelected","isAncestorMultiSelected","isFirstMultiSelectedBlock","isSelected","isPartOfMultiSelection","blockName","blockType","apiVersion","title","hasOverlay","blockLabel","htmlSuffix","mergedRefs","ref","triggerAnimationOnChange","isDisabled","blockEditContext","tabIndex","id","role","style","save"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\t__unstableGetBlockProps as getBlockProps,\n\tgetBlockType,\n} from '@wordpress/blocks';\nimport { useMergeRefs, useDisabled } from '@wordpress/compose';\nimport { useSelect } from '@wordpress/data';\nimport warning from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport useMovingAnimation from '../../use-moving-animation';\nimport { BlockListBlockContext } from '../block';\nimport { useFocusFirstElement } from './use-focus-first-element';\nimport { useIsHovered } from './use-is-hovered';\nimport { useBlockEditContext } from '../../block-edit/context';\nimport { useBlockClassNames } from './use-block-class-names';\nimport { useBlockDefaultClassName } from './use-block-default-class-name';\nimport { useBlockCustomClassName } from './use-block-custom-class-name';\nimport { useBlockMovingModeClassNames } from './use-block-moving-mode-class-names';\nimport { useFocusHandler } from './use-focus-handler';\nimport { useEventHandlers } from './use-selected-block-event-handlers';\nimport { useNavModeExit } from './use-nav-mode-exit';\nimport { useBlockRefProvider } from './use-block-refs';\nimport { useIntersectionObserver } from './use-intersection-observer';\nimport { store as blockEditorStore } from '../../../store';\nimport useBlockOverlayActive from '../../block-content-overlay';\n\n/**\n * If the block count exceeds the threshold, we disable the reordering animation\n * to avoid laginess.\n */\nconst BLOCK_ANIMATION_THRESHOLD = 200;\n\n/**\n * This hook is used to lightly mark an element as a block element. The element\n * should be the outermost element of a block. Call this hook and pass the\n * returned props to the element to mark as a block. If you define a ref for the\n * element, it is important to pass the ref to this hook, which the hook in turn\n * will pass to the component through the props it returns. Optionally, you can\n * also pass any other props through this hook, and they will be merged and\n * returned.\n *\n * @param {Object} props Optional. Props to pass to the element. Must contain\n * the ref if one is defined.\n * @param {Object} options Options for internal use only.\n * @param {boolean} options.__unstableIsHtml\n *\n * @return {Object} Props to pass to the element to mark as a block.\n */\nexport function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {\n\tconst {\n\t\tclientId,\n\t\tclassName,\n\t\twrapperProps = {},\n\t\tisAligned,\n\t} = useContext( BlockListBlockContext );\n\tconst {\n\t\tindex,\n\t\tmode,\n\t\tname,\n\t\tblockApiVersion,\n\t\tblockTitle,\n\t\tisPartOfSelection,\n\t\tadjustScrolling,\n\t\tenableAnimation,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockIndex,\n\t\t\t\tgetBlockMode,\n\t\t\t\tgetBlockName,\n\t\t\t\tisTyping,\n\t\t\t\tgetGlobalBlockCount,\n\t\t\t\tisBlockSelected,\n\t\t\t\tisBlockMultiSelected,\n\t\t\t\tisAncestorMultiSelected,\n\t\t\t\tisFirstMultiSelectedBlock,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst isSelected = isBlockSelected( clientId );\n\t\t\tconst isPartOfMultiSelection =\n\t\t\t\tisBlockMultiSelected( clientId ) ||\n\t\t\t\tisAncestorMultiSelected( clientId );\n\t\t\tconst blockName = getBlockName( clientId );\n\t\t\tconst blockType = getBlockType( blockName );\n\n\t\t\treturn {\n\t\t\t\tindex: getBlockIndex( clientId ),\n\t\t\t\tmode: getBlockMode( clientId ),\n\t\t\t\tname: blockName,\n\t\t\t\tblockApiVersion: blockType?.apiVersion || 1,\n\t\t\t\tblockTitle: blockType?.title,\n\t\t\t\tisPartOfSelection: isSelected || isPartOfMultiSelection,\n\t\t\t\tadjustScrolling:\n\t\t\t\t\tisSelected || isFirstMultiSelectedBlock( clientId ),\n\t\t\t\tenableAnimation:\n\t\t\t\t\t! isTyping() &&\n\t\t\t\t\tgetGlobalBlockCount() <= BLOCK_ANIMATION_THRESHOLD,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst hasOverlay = useBlockOverlayActive( clientId );\n\n\t// translators: %s: Type of block (i.e. Text, Image etc)\n\tconst blockLabel = sprintf( __( 'Block: %s' ), blockTitle );\n\tconst htmlSuffix = mode === 'html' && ! __unstableIsHtml ? '-visual' : '';\n\tconst mergedRefs = useMergeRefs( [\n\t\tprops.ref,\n\t\tuseFocusFirstElement( clientId ),\n\t\tuseBlockRefProvider( clientId ),\n\t\tuseFocusHandler( clientId ),\n\t\tuseEventHandlers( clientId ),\n\t\tuseNavModeExit( clientId ),\n\t\tuseIsHovered(),\n\t\tuseIntersectionObserver(),\n\t\tuseMovingAnimation( {\n\t\t\tisSelected: isPartOfSelection,\n\t\t\tadjustScrolling,\n\t\t\tenableAnimation,\n\t\t\ttriggerAnimationOnChange: index,\n\t\t} ),\n\t\tuseDisabled( { isDisabled: ! hasOverlay } ),\n\t] );\n\n\tconst blockEditContext = useBlockEditContext();\n\t// Ensures it warns only inside the `edit` implementation for the block.\n\tif ( blockApiVersion < 2 && clientId === blockEditContext.clientId ) {\n\t\twarning(\n\t\t\t`Block type \"${ name }\" must support API version 2 or higher to work correctly with \"useBlockProps\" method.`\n\t\t);\n\t}\n\n\treturn {\n\t\ttabIndex: 0,\n\t\t...wrapperProps,\n\t\t...props,\n\t\tref: mergedRefs,\n\t\tid: `block-${ clientId }${ htmlSuffix }`,\n\t\trole: 'document',\n\t\t'aria-label': blockLabel,\n\t\t'data-block': clientId,\n\t\t'data-type': name,\n\t\t'data-title': blockTitle,\n\t\tclassName: classnames(\n\t\t\t// The wp-block className is important for editor styles.\n\t\t\tclassnames( 'block-editor-block-list__block', {\n\t\t\t\t'wp-block': ! isAligned,\n\t\t\t\t'has-block-overlay': hasOverlay,\n\t\t\t} ),\n\t\t\tclassName,\n\t\t\tprops.className,\n\t\t\twrapperProps.className,\n\t\t\tuseBlockClassNames( clientId ),\n\t\t\tuseBlockDefaultClassName( clientId ),\n\t\t\tuseBlockCustomClassName( clientId ),\n\t\t\tuseBlockMovingModeClassNames( clientId )\n\t\t),\n\t\tstyle: { ...wrapperProps.style, ...props.style },\n\t};\n}\n\n/**\n * Call within a save function to get the props for the block wrapper.\n *\n * @param {Object} props Optional. Props to pass to the element.\n */\nuseBlockProps.save = getBlockProps;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/block-editor/src/components/block-list/use-block-props/index.js"],"names":["classnames","useContext","__","sprintf","__unstableGetBlockProps","getBlockProps","getBlockType","store","blocksStore","useMergeRefs","useDisabled","useSelect","warning","useMovingAnimation","BlockListBlockContext","useFocusFirstElement","useIsHovered","useBlockEditContext","useBlockClassNames","useBlockDefaultClassName","useBlockCustomClassName","useBlockMovingModeClassNames","useFocusHandler","useEventHandlers","useNavModeExit","useBlockRefProvider","useIntersectionObserver","blockEditorStore","useBlockOverlayActive","BLOCK_ANIMATION_THRESHOLD","useBlockProps","props","__unstableIsHtml","clientId","className","wrapperProps","isAligned","index","mode","name","blockApiVersion","blockTitle","isPartOfSelection","adjustScrolling","enableAnimation","select","getBlockAttributes","getBlockIndex","getBlockMode","getBlockName","isTyping","getGlobalBlockCount","isBlockSelected","isBlockMultiSelected","isAncestorMultiSelected","isFirstMultiSelectedBlock","getActiveBlockVariation","isSelected","isPartOfMultiSelection","blockName","blockType","attributes","match","apiVersion","title","hasOverlay","blockLabel","htmlSuffix","mergedRefs","ref","triggerAnimationOnChange","isDisabled","blockEditContext","tabIndex","id","role","style","save"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\t__unstableGetBlockProps as getBlockProps,\n\tgetBlockType,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useMergeRefs, useDisabled } from '@wordpress/compose';\nimport { useSelect } from '@wordpress/data';\nimport warning from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport useMovingAnimation from '../../use-moving-animation';\nimport { BlockListBlockContext } from '../block';\nimport { useFocusFirstElement } from './use-focus-first-element';\nimport { useIsHovered } from './use-is-hovered';\nimport { useBlockEditContext } from '../../block-edit/context';\nimport { useBlockClassNames } from './use-block-class-names';\nimport { useBlockDefaultClassName } from './use-block-default-class-name';\nimport { useBlockCustomClassName } from './use-block-custom-class-name';\nimport { useBlockMovingModeClassNames } from './use-block-moving-mode-class-names';\nimport { useFocusHandler } from './use-focus-handler';\nimport { useEventHandlers } from './use-selected-block-event-handlers';\nimport { useNavModeExit } from './use-nav-mode-exit';\nimport { useBlockRefProvider } from './use-block-refs';\nimport { useIntersectionObserver } from './use-intersection-observer';\nimport { store as blockEditorStore } from '../../../store';\nimport useBlockOverlayActive from '../../block-content-overlay';\n\n/**\n * If the block count exceeds the threshold, we disable the reordering animation\n * to avoid laginess.\n */\nconst BLOCK_ANIMATION_THRESHOLD = 200;\n\n/**\n * This hook is used to lightly mark an element as a block element. The element\n * should be the outermost element of a block. Call this hook and pass the\n * returned props to the element to mark as a block. If you define a ref for the\n * element, it is important to pass the ref to this hook, which the hook in turn\n * will pass to the component through the props it returns. Optionally, you can\n * also pass any other props through this hook, and they will be merged and\n * returned.\n *\n * @param {Object} props Optional. Props to pass to the element. Must contain\n * the ref if one is defined.\n * @param {Object} options Options for internal use only.\n * @param {boolean} options.__unstableIsHtml\n *\n * @return {Object} Props to pass to the element to mark as a block.\n */\nexport function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {\n\tconst {\n\t\tclientId,\n\t\tclassName,\n\t\twrapperProps = {},\n\t\tisAligned,\n\t} = useContext( BlockListBlockContext );\n\tconst {\n\t\tindex,\n\t\tmode,\n\t\tname,\n\t\tblockApiVersion,\n\t\tblockTitle,\n\t\tisPartOfSelection,\n\t\tadjustScrolling,\n\t\tenableAnimation,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetBlockIndex,\n\t\t\t\tgetBlockMode,\n\t\t\t\tgetBlockName,\n\t\t\t\tisTyping,\n\t\t\t\tgetGlobalBlockCount,\n\t\t\t\tisBlockSelected,\n\t\t\t\tisBlockMultiSelected,\n\t\t\t\tisAncestorMultiSelected,\n\t\t\t\tisFirstMultiSelectedBlock,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst { getActiveBlockVariation } = select( blocksStore );\n\t\t\tconst isSelected = isBlockSelected( clientId );\n\t\t\tconst isPartOfMultiSelection =\n\t\t\t\tisBlockMultiSelected( clientId ) ||\n\t\t\t\tisAncestorMultiSelected( clientId );\n\t\t\tconst blockName = getBlockName( clientId );\n\t\t\tconst blockType = getBlockType( blockName );\n\t\t\tconst attributes = getBlockAttributes( clientId );\n\t\t\tconst match = getActiveBlockVariation( blockName, attributes );\n\n\t\t\treturn {\n\t\t\t\tindex: getBlockIndex( clientId ),\n\t\t\t\tmode: getBlockMode( clientId ),\n\t\t\t\tname: blockName,\n\t\t\t\tblockApiVersion: blockType?.apiVersion || 1,\n\t\t\t\tblockTitle: match?.title || blockType?.title,\n\t\t\t\tisPartOfSelection: isSelected || isPartOfMultiSelection,\n\t\t\t\tadjustScrolling:\n\t\t\t\t\tisSelected || isFirstMultiSelectedBlock( clientId ),\n\t\t\t\tenableAnimation:\n\t\t\t\t\t! isTyping() &&\n\t\t\t\t\tgetGlobalBlockCount() <= BLOCK_ANIMATION_THRESHOLD,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst hasOverlay = useBlockOverlayActive( clientId );\n\n\t// translators: %s: Type of block (i.e. Text, Image etc)\n\tconst blockLabel = sprintf( __( 'Block: %s' ), blockTitle );\n\tconst htmlSuffix = mode === 'html' && ! __unstableIsHtml ? '-visual' : '';\n\tconst mergedRefs = useMergeRefs( [\n\t\tprops.ref,\n\t\tuseFocusFirstElement( clientId ),\n\t\tuseBlockRefProvider( clientId ),\n\t\tuseFocusHandler( clientId ),\n\t\tuseEventHandlers( clientId ),\n\t\tuseNavModeExit( clientId ),\n\t\tuseIsHovered(),\n\t\tuseIntersectionObserver(),\n\t\tuseMovingAnimation( {\n\t\t\tisSelected: isPartOfSelection,\n\t\t\tadjustScrolling,\n\t\t\tenableAnimation,\n\t\t\ttriggerAnimationOnChange: index,\n\t\t} ),\n\t\tuseDisabled( { isDisabled: ! hasOverlay } ),\n\t] );\n\n\tconst blockEditContext = useBlockEditContext();\n\t// Ensures it warns only inside the `edit` implementation for the block.\n\tif ( blockApiVersion < 2 && clientId === blockEditContext.clientId ) {\n\t\twarning(\n\t\t\t`Block type \"${ name }\" must support API version 2 or higher to work correctly with \"useBlockProps\" method.`\n\t\t);\n\t}\n\n\treturn {\n\t\ttabIndex: 0,\n\t\t...wrapperProps,\n\t\t...props,\n\t\tref: mergedRefs,\n\t\tid: `block-${ clientId }${ htmlSuffix }`,\n\t\trole: 'document',\n\t\t'aria-label': blockLabel,\n\t\t'data-block': clientId,\n\t\t'data-type': name,\n\t\t'data-title': blockTitle,\n\t\tclassName: classnames(\n\t\t\t// The wp-block className is important for editor styles.\n\t\t\tclassnames( 'block-editor-block-list__block', {\n\t\t\t\t'wp-block': ! isAligned,\n\t\t\t\t'has-block-overlay': hasOverlay,\n\t\t\t} ),\n\t\t\tclassName,\n\t\t\tprops.className,\n\t\t\twrapperProps.className,\n\t\t\tuseBlockClassNames( clientId ),\n\t\t\tuseBlockDefaultClassName( clientId ),\n\t\t\tuseBlockCustomClassName( clientId ),\n\t\t\tuseBlockMovingModeClassNames( clientId )\n\t\t),\n\t\tstyle: { ...wrapperProps.style, ...props.style },\n\t};\n}\n\n/**\n * Call within a save function to get the props for the block wrapper.\n *\n * @param {Object} props Optional. Props to pass to the element.\n */\nuseBlockProps.save = getBlockProps;\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* WordPress dependencies
|
|
3
3
|
*/
|
|
4
|
-
import { useRefEffect } from '@wordpress/compose';
|
|
4
|
+
import { useRefEffect, useDebounce } from '@wordpress/compose';
|
|
5
5
|
import { useSelect, useDispatch } from '@wordpress/data';
|
|
6
6
|
import { useContext } from '@wordpress/element';
|
|
7
7
|
/**
|
|
@@ -27,6 +27,9 @@ export function useInBetweenInserter() {
|
|
|
27
27
|
showInsertionPoint,
|
|
28
28
|
hideInsertionPoint
|
|
29
29
|
} = useDispatch(blockEditorStore);
|
|
30
|
+
const delayedShowInsertionPoint = useDebounce(showInsertionPoint, 500, {
|
|
31
|
+
trailing: true
|
|
32
|
+
});
|
|
30
33
|
return useRefEffect(node => {
|
|
31
34
|
if (isInBetweenInserterDisabled) {
|
|
32
35
|
return;
|
|
@@ -44,6 +47,8 @@ export function useInBetweenInserter() {
|
|
|
44
47
|
}
|
|
45
48
|
|
|
46
49
|
if (!event.target.classList.contains('block-editor-block-list__layout')) {
|
|
50
|
+
delayedShowInsertionPoint.cancel();
|
|
51
|
+
|
|
47
52
|
if (isBlockInsertionPointVisible()) {
|
|
48
53
|
hideInsertionPoint();
|
|
49
54
|
}
|
|
@@ -103,6 +108,8 @@ export function useInBetweenInserter() {
|
|
|
103
108
|
const elementRect = element.getBoundingClientRect();
|
|
104
109
|
|
|
105
110
|
if (orientation === 'horizontal' && (event.clientY > elementRect.bottom || event.clientY < elementRect.top) || orientation === 'vertical' && (event.clientX > elementRect.right || event.clientX < elementRect.left)) {
|
|
111
|
+
delayedShowInsertionPoint.cancel();
|
|
112
|
+
|
|
106
113
|
if (isBlockInsertionPointVisible()) {
|
|
107
114
|
hideInsertionPoint();
|
|
108
115
|
}
|
|
@@ -114,6 +121,8 @@ export function useInBetweenInserter() {
|
|
|
114
121
|
// the list (preserves the original behaviour).
|
|
115
122
|
|
|
116
123
|
if (index === 0) {
|
|
124
|
+
delayedShowInsertionPoint.cancel();
|
|
125
|
+
|
|
117
126
|
if (isBlockInsertionPointVisible()) {
|
|
118
127
|
hideInsertionPoint();
|
|
119
128
|
}
|
|
@@ -121,7 +130,7 @@ export function useInBetweenInserter() {
|
|
|
121
130
|
return;
|
|
122
131
|
}
|
|
123
132
|
|
|
124
|
-
|
|
133
|
+
delayedShowInsertionPoint(rootClientId, index, {
|
|
125
134
|
__unstableWithInserter: true
|
|
126
135
|
});
|
|
127
136
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/block-editor/src/components/block-list/use-in-between-inserter.js"],"names":["useRefEffect","useSelect","useDispatch","useContext","store","blockEditorStore","InsertionPointOpenRef","useInBetweenInserter","openRef","isInBetweenInserterDisabled","select","getSettings","hasReducedUI","__unstableGetEditorMode","getBlockListSettings","getBlockRootClientId","getBlockIndex","isBlockInsertionPointVisible","isMultiSelecting","getSelectedBlockClientIds","getTemplateLock","__unstableIsWithinBlockOverlay","showInsertionPoint","hideInsertionPoint","node","onMouseMove","event","current","target","classList","contains","rootClientId","blockElement","getAttribute","closest","orientation","rect","getBoundingClientRect","offsetTop","clientY","top","offsetLeft","clientX","left","children","Array","from","element","find","blockEl","id","firstElementChild","clientId","slice","length","includes","elementRect","bottom","right","index","__unstableWithInserter","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRefEffect } from '@wordpress/compose';\n\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { InsertionPointOpenRef } from '../block-tools/insertion-point';\n\nexport function useInBetweenInserter() {\n\tconst openRef = useContext( InsertionPointOpenRef );\n\tconst isInBetweenInserterDisabled = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().hasReducedUI ||\n\t\t\tselect( blockEditorStore ).__unstableGetEditorMode() === 'zoom-out',\n\t\t[]\n\t);\n\tconst {\n\t\tgetBlockListSettings,\n\t\tgetBlockRootClientId,\n\t\tgetBlockIndex,\n\t\tisBlockInsertionPointVisible,\n\t\tisMultiSelecting,\n\t\tgetSelectedBlockClientIds,\n\t\tgetTemplateLock,\n\t\t__unstableIsWithinBlockOverlay,\n\t} = useSelect( blockEditorStore );\n\tconst { showInsertionPoint, hideInsertionPoint } =\n\t\tuseDispatch( blockEditorStore );\n\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tif ( isInBetweenInserterDisabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfunction onMouseMove( event ) {\n\t\t\t\tif ( openRef.current ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( isMultiSelecting() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\t! event.target.classList.contains(\n\t\t\t\t\t\t'block-editor-block-list__layout'\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tif ( isBlockInsertionPointVisible() ) {\n\t\t\t\t\t\thideInsertionPoint();\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tlet rootClientId;\n\t\t\t\tif (\n\t\t\t\t\t! event.target.classList.contains( 'is-root-container' )\n\t\t\t\t) {\n\t\t\t\t\tconst blockElement = !! event.target.getAttribute(\n\t\t\t\t\t\t'data-block'\n\t\t\t\t\t)\n\t\t\t\t\t\t? event.target\n\t\t\t\t\t\t: event.target.closest( '[data-block]' );\n\t\t\t\t\trootClientId = blockElement.getAttribute( 'data-block' );\n\t\t\t\t}\n\n\t\t\t\t// Don't set the insertion point if the template is locked.\n\t\t\t\tif ( getTemplateLock( rootClientId ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst orientation =\n\t\t\t\t\tgetBlockListSettings( rootClientId )?.orientation ||\n\t\t\t\t\t'vertical';\n\t\t\t\tconst rect = event.target.getBoundingClientRect();\n\t\t\t\tconst offsetTop = event.clientY - rect.top;\n\t\t\t\tconst offsetLeft = event.clientX - rect.left;\n\n\t\t\t\tconst children = Array.from( event.target.children );\n\t\t\t\tlet element = children.find( ( blockEl ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t( blockEl.classList.contains( 'wp-block' ) &&\n\t\t\t\t\t\t\torientation === 'vertical' &&\n\t\t\t\t\t\t\tblockEl.offsetTop > offsetTop ) ||\n\t\t\t\t\t\t( blockEl.classList.contains( 'wp-block' ) &&\n\t\t\t\t\t\t\torientation === 'horizontal' &&\n\t\t\t\t\t\t\tblockEl.offsetLeft > offsetLeft )\n\t\t\t\t\t);\n\t\t\t\t} );\n\n\t\t\t\tif ( ! element ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// The block may be in an alignment wrapper, so check the first direct\n\t\t\t\t// child if the element has no ID.\n\t\t\t\tif ( ! element.id ) {\n\t\t\t\t\telement = element.firstElementChild;\n\n\t\t\t\t\tif ( ! element ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Don't show the insertion point if a parent block has an \"overlay\"\n\t\t\t\t// See https://github.com/WordPress/gutenberg/pull/34012#pullrequestreview-727762337\n\t\t\t\tconst clientId = element.id.slice( 'block-'.length );\n\t\t\t\tif (\n\t\t\t\t\t! clientId ||\n\t\t\t\t\t__unstableIsWithinBlockOverlay( clientId )\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Don't show the inserter when hovering above (conflicts with\n\t\t\t\t// block toolbar) or inside selected block(s).\n\t\t\t\tif ( getSelectedBlockClientIds().includes( clientId ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tconst elementRect = element.getBoundingClientRect();\n\n\t\t\t\tif (\n\t\t\t\t\t( orientation === 'horizontal' &&\n\t\t\t\t\t\t( event.clientY > elementRect.bottom ||\n\t\t\t\t\t\t\tevent.clientY < elementRect.top ) ) ||\n\t\t\t\t\t( orientation === 'vertical' &&\n\t\t\t\t\t\t( event.clientX > elementRect.right ||\n\t\t\t\t\t\t\tevent.clientX < elementRect.left ) )\n\t\t\t\t) {\n\t\t\t\t\tif ( isBlockInsertionPointVisible() ) {\n\t\t\t\t\t\thideInsertionPoint();\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst index = getBlockIndex( clientId );\n\n\t\t\t\t// Don't show the in-between inserter before the first block in\n\t\t\t\t// the list (preserves the original behaviour).\n\t\t\t\tif ( index === 0 ) {\n\t\t\t\t\tif ( isBlockInsertionPointVisible() ) {\n\t\t\t\t\t\thideInsertionPoint();\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tshowInsertionPoint( rootClientId, index, {\n\t\t\t\t\t__unstableWithInserter: true,\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tnode.addEventListener( 'mousemove', onMouseMove );\n\n\t\t\treturn () => {\n\t\t\t\tnode.removeEventListener( 'mousemove', onMouseMove );\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\topenRef,\n\t\t\tgetBlockListSettings,\n\t\t\tgetBlockRootClientId,\n\t\t\tgetBlockIndex,\n\t\t\tisBlockInsertionPointVisible,\n\t\t\tisMultiSelecting,\n\t\t\tshowInsertionPoint,\n\t\t\thideInsertionPoint,\n\t\t\tgetSelectedBlockClientIds,\n\t\t\tisInBetweenInserterDisabled,\n\t\t]\n\t);\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/block-editor/src/components/block-list/use-in-between-inserter.js"],"names":["useRefEffect","useDebounce","useSelect","useDispatch","useContext","store","blockEditorStore","InsertionPointOpenRef","useInBetweenInserter","openRef","isInBetweenInserterDisabled","select","getSettings","hasReducedUI","__unstableGetEditorMode","getBlockListSettings","getBlockRootClientId","getBlockIndex","isBlockInsertionPointVisible","isMultiSelecting","getSelectedBlockClientIds","getTemplateLock","__unstableIsWithinBlockOverlay","showInsertionPoint","hideInsertionPoint","delayedShowInsertionPoint","trailing","node","onMouseMove","event","current","target","classList","contains","cancel","rootClientId","blockElement","getAttribute","closest","orientation","rect","getBoundingClientRect","offsetTop","clientY","top","offsetLeft","clientX","left","children","Array","from","element","find","blockEl","id","firstElementChild","clientId","slice","length","includes","elementRect","bottom","right","index","__unstableWithInserter","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRefEffect, useDebounce } from '@wordpress/compose';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { InsertionPointOpenRef } from '../block-tools/insertion-point';\n\nexport function useInBetweenInserter() {\n\tconst openRef = useContext( InsertionPointOpenRef );\n\tconst isInBetweenInserterDisabled = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().hasReducedUI ||\n\t\t\tselect( blockEditorStore ).__unstableGetEditorMode() === 'zoom-out',\n\t\t[]\n\t);\n\tconst {\n\t\tgetBlockListSettings,\n\t\tgetBlockRootClientId,\n\t\tgetBlockIndex,\n\t\tisBlockInsertionPointVisible,\n\t\tisMultiSelecting,\n\t\tgetSelectedBlockClientIds,\n\t\tgetTemplateLock,\n\t\t__unstableIsWithinBlockOverlay,\n\t} = useSelect( blockEditorStore );\n\tconst { showInsertionPoint, hideInsertionPoint } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst delayedShowInsertionPoint = useDebounce( showInsertionPoint, 500, {\n\t\ttrailing: true,\n\t} );\n\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tif ( isInBetweenInserterDisabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfunction onMouseMove( event ) {\n\t\t\t\tif ( openRef.current ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( isMultiSelecting() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\t! event.target.classList.contains(\n\t\t\t\t\t\t'block-editor-block-list__layout'\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tdelayedShowInsertionPoint.cancel();\n\t\t\t\t\tif ( isBlockInsertionPointVisible() ) {\n\t\t\t\t\t\thideInsertionPoint();\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tlet rootClientId;\n\t\t\t\tif (\n\t\t\t\t\t! event.target.classList.contains( 'is-root-container' )\n\t\t\t\t) {\n\t\t\t\t\tconst blockElement = !! event.target.getAttribute(\n\t\t\t\t\t\t'data-block'\n\t\t\t\t\t)\n\t\t\t\t\t\t? event.target\n\t\t\t\t\t\t: event.target.closest( '[data-block]' );\n\t\t\t\t\trootClientId = blockElement.getAttribute( 'data-block' );\n\t\t\t\t}\n\n\t\t\t\t// Don't set the insertion point if the template is locked.\n\t\t\t\tif ( getTemplateLock( rootClientId ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst orientation =\n\t\t\t\t\tgetBlockListSettings( rootClientId )?.orientation ||\n\t\t\t\t\t'vertical';\n\t\t\t\tconst rect = event.target.getBoundingClientRect();\n\t\t\t\tconst offsetTop = event.clientY - rect.top;\n\t\t\t\tconst offsetLeft = event.clientX - rect.left;\n\n\t\t\t\tconst children = Array.from( event.target.children );\n\t\t\t\tlet element = children.find( ( blockEl ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t( blockEl.classList.contains( 'wp-block' ) &&\n\t\t\t\t\t\t\torientation === 'vertical' &&\n\t\t\t\t\t\t\tblockEl.offsetTop > offsetTop ) ||\n\t\t\t\t\t\t( blockEl.classList.contains( 'wp-block' ) &&\n\t\t\t\t\t\t\torientation === 'horizontal' &&\n\t\t\t\t\t\t\tblockEl.offsetLeft > offsetLeft )\n\t\t\t\t\t);\n\t\t\t\t} );\n\n\t\t\t\tif ( ! element ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// The block may be in an alignment wrapper, so check the first direct\n\t\t\t\t// child if the element has no ID.\n\t\t\t\tif ( ! element.id ) {\n\t\t\t\t\telement = element.firstElementChild;\n\n\t\t\t\t\tif ( ! element ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Don't show the insertion point if a parent block has an \"overlay\"\n\t\t\t\t// See https://github.com/WordPress/gutenberg/pull/34012#pullrequestreview-727762337\n\t\t\t\tconst clientId = element.id.slice( 'block-'.length );\n\t\t\t\tif (\n\t\t\t\t\t! clientId ||\n\t\t\t\t\t__unstableIsWithinBlockOverlay( clientId )\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Don't show the inserter when hovering above (conflicts with\n\t\t\t\t// block toolbar) or inside selected block(s).\n\t\t\t\tif ( getSelectedBlockClientIds().includes( clientId ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tconst elementRect = element.getBoundingClientRect();\n\n\t\t\t\tif (\n\t\t\t\t\t( orientation === 'horizontal' &&\n\t\t\t\t\t\t( event.clientY > elementRect.bottom ||\n\t\t\t\t\t\t\tevent.clientY < elementRect.top ) ) ||\n\t\t\t\t\t( orientation === 'vertical' &&\n\t\t\t\t\t\t( event.clientX > elementRect.right ||\n\t\t\t\t\t\t\tevent.clientX < elementRect.left ) )\n\t\t\t\t) {\n\t\t\t\t\tdelayedShowInsertionPoint.cancel();\n\t\t\t\t\tif ( isBlockInsertionPointVisible() ) {\n\t\t\t\t\t\thideInsertionPoint();\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst index = getBlockIndex( clientId );\n\n\t\t\t\t// Don't show the in-between inserter before the first block in\n\t\t\t\t// the list (preserves the original behaviour).\n\t\t\t\tif ( index === 0 ) {\n\t\t\t\t\tdelayedShowInsertionPoint.cancel();\n\t\t\t\t\tif ( isBlockInsertionPointVisible() ) {\n\t\t\t\t\t\thideInsertionPoint();\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdelayedShowInsertionPoint( rootClientId, index, {\n\t\t\t\t\t__unstableWithInserter: true,\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tnode.addEventListener( 'mousemove', onMouseMove );\n\n\t\t\treturn () => {\n\t\t\t\tnode.removeEventListener( 'mousemove', onMouseMove );\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\topenRef,\n\t\t\tgetBlockListSettings,\n\t\t\tgetBlockRootClientId,\n\t\t\tgetBlockIndex,\n\t\t\tisBlockInsertionPointVisible,\n\t\t\tisMultiSelecting,\n\t\t\tshowInsertionPoint,\n\t\t\thideInsertionPoint,\n\t\t\tgetSelectedBlockClientIds,\n\t\t\tisInBetweenInserterDisabled,\n\t\t]\n\t);\n}\n"]}
|
|
@@ -20,6 +20,7 @@ import { isRTL } from '@wordpress/i18n';
|
|
|
20
20
|
import { store as blockEditorStore } from '../../store';
|
|
21
21
|
import { __unstableUseBlockElement as useBlockElement } from '../block-list/use-block-props/use-block-refs';
|
|
22
22
|
import usePopoverScroll from './use-popover-scroll';
|
|
23
|
+
const MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER;
|
|
23
24
|
export const InsertionPointOpenRef = createContext();
|
|
24
25
|
|
|
25
26
|
function BlockPopoverInbetween(_ref) {
|
|
@@ -32,7 +33,8 @@ function BlockPopoverInbetween(_ref) {
|
|
|
32
33
|
...props
|
|
33
34
|
} = _ref;
|
|
34
35
|
// This is a temporary hack to get the inbetween inserter to recompute properly.
|
|
35
|
-
const [
|
|
36
|
+
const [popoverRecomputeCounter, forcePopoverRecompute] = useReducer( // Module is there to make sure that the counter doesn't overflow.
|
|
37
|
+
s => (s + 1) % MAX_POPOVER_RECOMPUTE_COUNTER, 0);
|
|
36
38
|
const {
|
|
37
39
|
orientation,
|
|
38
40
|
rootClientId,
|
|
@@ -58,7 +60,10 @@ function BlockPopoverInbetween(_ref) {
|
|
|
58
60
|
const nextElement = useBlockElement(nextClientId);
|
|
59
61
|
const isVertical = orientation === 'vertical';
|
|
60
62
|
const style = useMemo(() => {
|
|
61
|
-
if (
|
|
63
|
+
if ( // popoverRecomputeCounter is by definition always equal or greater than 0.
|
|
64
|
+
// This check is only there to satisfy the correctness of the
|
|
65
|
+
// exhaustive-deps rule for the `useMemo` hook.
|
|
66
|
+
popoverRecomputeCounter < 0 || !previousElement && !nextElement || !isVisible) {
|
|
62
67
|
return {};
|
|
63
68
|
}
|
|
64
69
|
|
|
@@ -82,9 +87,12 @@ function BlockPopoverInbetween(_ref) {
|
|
|
82
87
|
width,
|
|
83
88
|
height: previousRect ? previousRect.height : nextRect.height
|
|
84
89
|
};
|
|
85
|
-
}, [previousElement, nextElement, isVertical,
|
|
90
|
+
}, [previousElement, nextElement, isVertical, popoverRecomputeCounter, isVisible]);
|
|
86
91
|
const popoverAnchor = useMemo(() => {
|
|
87
|
-
if (
|
|
92
|
+
if ( // popoverRecomputeCounter is by definition always equal or greater than 0.
|
|
93
|
+
// This check is only there to satisfy the correctness of the
|
|
94
|
+
// exhaustive-deps rule for the `useMemo` hook.
|
|
95
|
+
popoverRecomputeCounter < 0 || !previousElement && !nextElement || !isVisible) {
|
|
88
96
|
return undefined;
|
|
89
97
|
}
|
|
90
98
|
|
|
@@ -127,15 +135,22 @@ function BlockPopoverInbetween(_ref) {
|
|
|
127
135
|
}
|
|
128
136
|
|
|
129
137
|
};
|
|
130
|
-
}, [previousElement, nextElement,
|
|
138
|
+
}, [previousElement, nextElement, popoverRecomputeCounter, isVertical, isVisible]);
|
|
131
139
|
const popoverScrollRef = usePopoverScroll(__unstableContentRef); // This is only needed for a smooth transition when moving blocks.
|
|
140
|
+
// When blocks are moved up/down, their position can be set by
|
|
141
|
+
// updating the `transform` property manually (i.e. without using CSS
|
|
142
|
+
// transitions or animations). The animation, which can also scroll the block
|
|
143
|
+
// editor, can sometimes cause the position of the Popover to get out of sync.
|
|
144
|
+
// A MutationObserver is therefore used to make sure that changes to the
|
|
145
|
+
// selectedElement's attribute (i.e. `transform`) can be tracked and used to
|
|
146
|
+
// trigger the Popover to rerender.
|
|
132
147
|
|
|
133
148
|
useLayoutEffect(() => {
|
|
134
149
|
if (!previousElement) {
|
|
135
150
|
return;
|
|
136
151
|
}
|
|
137
152
|
|
|
138
|
-
const observer = new window.MutationObserver(
|
|
153
|
+
const observer = new window.MutationObserver(forcePopoverRecompute);
|
|
139
154
|
observer.observe(previousElement, {
|
|
140
155
|
attributes: true
|
|
141
156
|
});
|
|
@@ -148,7 +163,7 @@ function BlockPopoverInbetween(_ref) {
|
|
|
148
163
|
return;
|
|
149
164
|
}
|
|
150
165
|
|
|
151
|
-
const observer = new window.MutationObserver(
|
|
166
|
+
const observer = new window.MutationObserver(forcePopoverRecompute);
|
|
152
167
|
observer.observe(nextElement, {
|
|
153
168
|
attributes: true
|
|
154
169
|
});
|
|
@@ -161,9 +176,9 @@ function BlockPopoverInbetween(_ref) {
|
|
|
161
176
|
return;
|
|
162
177
|
}
|
|
163
178
|
|
|
164
|
-
previousElement.ownerDocument.defaultView.addEventListener('resize',
|
|
179
|
+
previousElement.ownerDocument.defaultView.addEventListener('resize', forcePopoverRecompute);
|
|
165
180
|
return () => {
|
|
166
|
-
previousElement.ownerDocument.defaultView.removeEventListener('resize',
|
|
181
|
+
previousElement.ownerDocument.defaultView.removeEventListener('resize', forcePopoverRecompute);
|
|
167
182
|
};
|
|
168
183
|
}, [previousElement]); // If there's either a previous or a next element, show the inbetween popover.
|
|
169
184
|
// Note that drag and drop uses the inbetween popover to show the drop indicator
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/block-editor/src/components/block-popover/inbetween.js"],"names":["classnames","useSelect","useMemo","createContext","useReducer","useLayoutEffect","Popover","isRTL","store","blockEditorStore","__unstableUseBlockElement","useBlockElement","usePopoverScroll","InsertionPointOpenRef","BlockPopoverInbetween","previousClientId","nextClientId","children","__unstablePopoverSlot","__unstableContentRef","props","positionRecompute","forceRecompute","s","orientation","rootClientId","isVisible","select","getBlockListSettings","getBlockRootClientId","isBlockVisible","_rootClientId","previousElement","nextElement","isVertical","style","previousRect","getBoundingClientRect","nextRect","width","height","top","bottom","left","right","popoverAnchor","undefined","ownerDocument","window","DOMRect","popoverScrollRef","observer","MutationObserver","observe","attributes","disconnect","defaultView","addEventListener","removeEventListener","className"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport {\n\tuseMemo,\n\tcreateContext,\n\tuseReducer,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport { Popover } from '@wordpress/components';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { __unstableUseBlockElement as useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport usePopoverScroll from './use-popover-scroll';\n\nexport const InsertionPointOpenRef = createContext();\n\nfunction BlockPopoverInbetween( {\n\tpreviousClientId,\n\tnextClientId,\n\tchildren,\n\t__unstablePopoverSlot,\n\t__unstableContentRef,\n\t...props\n} ) {\n\t// This is a temporary hack to get the inbetween inserter to recompute properly.\n\tconst [ positionRecompute, forceRecompute ] = useReducer(\n\t\t( s ) => s + 1,\n\t\t0\n\t);\n\n\tconst { orientation, rootClientId, isVisible } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockListSettings,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tisBlockVisible,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\tconst _rootClientId = getBlockRootClientId(\n\t\t\t\tpreviousClientId ?? nextClientId\n\t\t\t);\n\t\t\treturn {\n\t\t\t\torientation:\n\t\t\t\t\tgetBlockListSettings( _rootClientId )?.orientation ||\n\t\t\t\t\t'vertical',\n\t\t\t\trootClientId: _rootClientId,\n\t\t\t\tisVisible:\n\t\t\t\t\tisBlockVisible( previousClientId ) &&\n\t\t\t\t\tisBlockVisible( nextClientId ),\n\t\t\t};\n\t\t},\n\t\t[ previousClientId, nextClientId ]\n\t);\n\tconst previousElement = useBlockElement( previousClientId );\n\tconst nextElement = useBlockElement( nextClientId );\n\tconst isVertical = orientation === 'vertical';\n\tconst style = useMemo( () => {\n\t\tif ( ( ! previousElement && ! nextElement ) || ! isVisible ) {\n\t\t\treturn {};\n\t\t}\n\n\t\tconst previousRect = previousElement\n\t\t\t? previousElement.getBoundingClientRect()\n\t\t\t: null;\n\t\tconst nextRect = nextElement\n\t\t\t? nextElement.getBoundingClientRect()\n\t\t\t: null;\n\n\t\tif ( isVertical ) {\n\t\t\treturn {\n\t\t\t\twidth: previousRect ? previousRect.width : nextRect.width,\n\t\t\t\theight:\n\t\t\t\t\tnextRect && previousRect\n\t\t\t\t\t\t? nextRect.top - previousRect.bottom\n\t\t\t\t\t\t: 0,\n\t\t\t};\n\t\t}\n\n\t\tlet width = 0;\n\t\tif ( previousRect && nextRect ) {\n\t\t\twidth = isRTL()\n\t\t\t\t? previousRect.left - nextRect.right\n\t\t\t\t: nextRect.left - previousRect.right;\n\t\t}\n\n\t\treturn {\n\t\t\twidth,\n\t\t\theight: previousRect ? previousRect.height : nextRect.height,\n\t\t};\n\t}, [\n\t\tpreviousElement,\n\t\tnextElement,\n\t\tisVertical,\n\t\tpositionRecompute,\n\t\tisVisible,\n\t] );\n\n\tconst popoverAnchor = useMemo( () => {\n\t\tif ( ( ! previousElement && ! nextElement ) || ! isVisible ) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst { ownerDocument } = previousElement || nextElement;\n\n\t\treturn {\n\t\t\townerDocument,\n\t\t\tgetBoundingClientRect() {\n\t\t\t\tconst previousRect = previousElement\n\t\t\t\t\t? previousElement.getBoundingClientRect()\n\t\t\t\t\t: null;\n\t\t\t\tconst nextRect = nextElement\n\t\t\t\t\t? nextElement.getBoundingClientRect()\n\t\t\t\t\t: null;\n\n\t\t\t\tlet left = 0;\n\t\t\t\tlet top = 0;\n\n\t\t\t\tif ( isVertical ) {\n\t\t\t\t\t// vertical\n\t\t\t\t\ttop = previousRect ? previousRect.bottom : nextRect.top;\n\n\t\t\t\t\tif ( isRTL() ) {\n\t\t\t\t\t\t// vertical, rtl\n\t\t\t\t\t\tleft = previousRect\n\t\t\t\t\t\t\t? previousRect.right\n\t\t\t\t\t\t\t: nextRect.right;\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// vertical, ltr\n\t\t\t\t\t\tleft = previousRect ? previousRect.left : nextRect.left;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\ttop = previousRect ? previousRect.top : nextRect.top;\n\n\t\t\t\t\tif ( isRTL() ) {\n\t\t\t\t\t\t// non vertical, rtl\n\t\t\t\t\t\tleft = previousRect\n\t\t\t\t\t\t\t? previousRect.left\n\t\t\t\t\t\t\t: nextRect.right;\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// non vertical, ltr\n\t\t\t\t\t\tleft = previousRect\n\t\t\t\t\t\t\t? previousRect.right\n\t\t\t\t\t\t\t: nextRect.left;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn new window.DOMRect( left, top, 0, 0 );\n\t\t\t},\n\t\t};\n\t}, [\n\t\tpreviousElement,\n\t\tnextElement,\n\t\tpositionRecompute,\n\t\tisVertical,\n\t\tisVisible,\n\t] );\n\n\tconst popoverScrollRef = usePopoverScroll( __unstableContentRef );\n\n\t// This is only needed for a smooth transition when moving blocks.\n\tuseLayoutEffect( () => {\n\t\tif ( ! previousElement ) {\n\t\t\treturn;\n\t\t}\n\t\tconst observer = new window.MutationObserver( forceRecompute );\n\t\tobserver.observe( previousElement, { attributes: true } );\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ previousElement ] );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! nextElement ) {\n\t\t\treturn;\n\t\t}\n\t\tconst observer = new window.MutationObserver( forceRecompute );\n\t\tobserver.observe( nextElement, { attributes: true } );\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ nextElement ] );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! previousElement ) {\n\t\t\treturn;\n\t\t}\n\t\tpreviousElement.ownerDocument.defaultView.addEventListener(\n\t\t\t'resize',\n\t\t\tforceRecompute\n\t\t);\n\t\treturn () => {\n\t\t\tpreviousElement.ownerDocument.defaultView.removeEventListener(\n\t\t\t\t'resize',\n\t\t\t\tforceRecompute\n\t\t\t);\n\t\t};\n\t}, [ previousElement ] );\n\n\t// If there's either a previous or a next element, show the inbetween popover.\n\t// Note that drag and drop uses the inbetween popover to show the drop indicator\n\t// before the first block and after the last block.\n\tif ( ( ! previousElement && ! nextElement ) || ! isVisible ) {\n\t\treturn null;\n\t}\n\n\t/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n\t// While ideally it would be enough to capture the\n\t// bubbling focus event from the Inserter, due to the\n\t// characteristics of click focusing of `button`s in\n\t// Firefox and Safari, it is not reliable.\n\t//\n\t// See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\treturn (\n\t\t<Popover\n\t\t\tref={ popoverScrollRef }\n\t\t\tanimate={ false }\n\t\t\tanchor={ popoverAnchor }\n\t\t\tfocusOnMount={ false }\n\t\t\t// Render in the old slot if needed for backward compatibility,\n\t\t\t// otherwise render in place (not in the default popover slot).\n\t\t\t__unstableSlotName={ __unstablePopoverSlot || null }\n\t\t\t// Forces a remount of the popover when its position changes\n\t\t\t// This makes sure the popover doesn't animate from its previous position.\n\t\t\tkey={ nextClientId + '--' + rootClientId }\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-block-popover',\n\t\t\t\t'block-editor-block-popover__inbetween',\n\t\t\t\tprops.className\n\t\t\t) }\n\t\t\tresize={ false }\n\t\t\tflip={ false }\n\t\t\tplacement=\"bottom-start\"\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"block-editor-block-popover__inbetween-container\"\n\t\t\t\tstyle={ style }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</Popover>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n}\n\nexport default BlockPopoverInbetween;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/block-editor/src/components/block-popover/inbetween.js"],"names":["classnames","useSelect","useMemo","createContext","useReducer","useLayoutEffect","Popover","isRTL","store","blockEditorStore","__unstableUseBlockElement","useBlockElement","usePopoverScroll","MAX_POPOVER_RECOMPUTE_COUNTER","Number","MAX_SAFE_INTEGER","InsertionPointOpenRef","BlockPopoverInbetween","previousClientId","nextClientId","children","__unstablePopoverSlot","__unstableContentRef","props","popoverRecomputeCounter","forcePopoverRecompute","s","orientation","rootClientId","isVisible","select","getBlockListSettings","getBlockRootClientId","isBlockVisible","_rootClientId","previousElement","nextElement","isVertical","style","previousRect","getBoundingClientRect","nextRect","width","height","top","bottom","left","right","popoverAnchor","undefined","ownerDocument","window","DOMRect","popoverScrollRef","observer","MutationObserver","observe","attributes","disconnect","defaultView","addEventListener","removeEventListener","className"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport {\n\tuseMemo,\n\tcreateContext,\n\tuseReducer,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport { Popover } from '@wordpress/components';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { __unstableUseBlockElement as useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport usePopoverScroll from './use-popover-scroll';\n\nconst MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER;\n\nexport const InsertionPointOpenRef = createContext();\n\nfunction BlockPopoverInbetween( {\n\tpreviousClientId,\n\tnextClientId,\n\tchildren,\n\t__unstablePopoverSlot,\n\t__unstableContentRef,\n\t...props\n} ) {\n\t// This is a temporary hack to get the inbetween inserter to recompute properly.\n\tconst [ popoverRecomputeCounter, forcePopoverRecompute ] = useReducer(\n\t\t// Module is there to make sure that the counter doesn't overflow.\n\t\t( s ) => ( s + 1 ) % MAX_POPOVER_RECOMPUTE_COUNTER,\n\t\t0\n\t);\n\n\tconst { orientation, rootClientId, isVisible } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockListSettings,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tisBlockVisible,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\tconst _rootClientId = getBlockRootClientId(\n\t\t\t\tpreviousClientId ?? nextClientId\n\t\t\t);\n\t\t\treturn {\n\t\t\t\torientation:\n\t\t\t\t\tgetBlockListSettings( _rootClientId )?.orientation ||\n\t\t\t\t\t'vertical',\n\t\t\t\trootClientId: _rootClientId,\n\t\t\t\tisVisible:\n\t\t\t\t\tisBlockVisible( previousClientId ) &&\n\t\t\t\t\tisBlockVisible( nextClientId ),\n\t\t\t};\n\t\t},\n\t\t[ previousClientId, nextClientId ]\n\t);\n\tconst previousElement = useBlockElement( previousClientId );\n\tconst nextElement = useBlockElement( nextClientId );\n\tconst isVertical = orientation === 'vertical';\n\tconst style = useMemo( () => {\n\t\tif (\n\t\t\t// popoverRecomputeCounter is by definition always equal or greater than 0.\n\t\t\t// This check is only there to satisfy the correctness of the\n\t\t\t// exhaustive-deps rule for the `useMemo` hook.\n\t\t\tpopoverRecomputeCounter < 0 ||\n\t\t\t( ! previousElement && ! nextElement ) ||\n\t\t\t! isVisible\n\t\t) {\n\t\t\treturn {};\n\t\t}\n\n\t\tconst previousRect = previousElement\n\t\t\t? previousElement.getBoundingClientRect()\n\t\t\t: null;\n\t\tconst nextRect = nextElement\n\t\t\t? nextElement.getBoundingClientRect()\n\t\t\t: null;\n\n\t\tif ( isVertical ) {\n\t\t\treturn {\n\t\t\t\twidth: previousRect ? previousRect.width : nextRect.width,\n\t\t\t\theight:\n\t\t\t\t\tnextRect && previousRect\n\t\t\t\t\t\t? nextRect.top - previousRect.bottom\n\t\t\t\t\t\t: 0,\n\t\t\t};\n\t\t}\n\n\t\tlet width = 0;\n\t\tif ( previousRect && nextRect ) {\n\t\t\twidth = isRTL()\n\t\t\t\t? previousRect.left - nextRect.right\n\t\t\t\t: nextRect.left - previousRect.right;\n\t\t}\n\n\t\treturn {\n\t\t\twidth,\n\t\t\theight: previousRect ? previousRect.height : nextRect.height,\n\t\t};\n\t}, [\n\t\tpreviousElement,\n\t\tnextElement,\n\t\tisVertical,\n\t\tpopoverRecomputeCounter,\n\t\tisVisible,\n\t] );\n\n\tconst popoverAnchor = useMemo( () => {\n\t\tif (\n\t\t\t// popoverRecomputeCounter is by definition always equal or greater than 0.\n\t\t\t// This check is only there to satisfy the correctness of the\n\t\t\t// exhaustive-deps rule for the `useMemo` hook.\n\t\t\tpopoverRecomputeCounter < 0 ||\n\t\t\t( ! previousElement && ! nextElement ) ||\n\t\t\t! isVisible\n\t\t) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst { ownerDocument } = previousElement || nextElement;\n\n\t\treturn {\n\t\t\townerDocument,\n\t\t\tgetBoundingClientRect() {\n\t\t\t\tconst previousRect = previousElement\n\t\t\t\t\t? previousElement.getBoundingClientRect()\n\t\t\t\t\t: null;\n\t\t\t\tconst nextRect = nextElement\n\t\t\t\t\t? nextElement.getBoundingClientRect()\n\t\t\t\t\t: null;\n\n\t\t\t\tlet left = 0;\n\t\t\t\tlet top = 0;\n\n\t\t\t\tif ( isVertical ) {\n\t\t\t\t\t// vertical\n\t\t\t\t\ttop = previousRect ? previousRect.bottom : nextRect.top;\n\n\t\t\t\t\tif ( isRTL() ) {\n\t\t\t\t\t\t// vertical, rtl\n\t\t\t\t\t\tleft = previousRect\n\t\t\t\t\t\t\t? previousRect.right\n\t\t\t\t\t\t\t: nextRect.right;\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// vertical, ltr\n\t\t\t\t\t\tleft = previousRect ? previousRect.left : nextRect.left;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\ttop = previousRect ? previousRect.top : nextRect.top;\n\n\t\t\t\t\tif ( isRTL() ) {\n\t\t\t\t\t\t// non vertical, rtl\n\t\t\t\t\t\tleft = previousRect\n\t\t\t\t\t\t\t? previousRect.left\n\t\t\t\t\t\t\t: nextRect.right;\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// non vertical, ltr\n\t\t\t\t\t\tleft = previousRect\n\t\t\t\t\t\t\t? previousRect.right\n\t\t\t\t\t\t\t: nextRect.left;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn new window.DOMRect( left, top, 0, 0 );\n\t\t\t},\n\t\t};\n\t}, [\n\t\tpreviousElement,\n\t\tnextElement,\n\t\tpopoverRecomputeCounter,\n\t\tisVertical,\n\t\tisVisible,\n\t] );\n\n\tconst popoverScrollRef = usePopoverScroll( __unstableContentRef );\n\n\t// This is only needed for a smooth transition when moving blocks.\n\t// When blocks are moved up/down, their position can be set by\n\t// updating the `transform` property manually (i.e. without using CSS\n\t// transitions or animations). The animation, which can also scroll the block\n\t// editor, can sometimes cause the position of the Popover to get out of sync.\n\t// A MutationObserver is therefore used to make sure that changes to the\n\t// selectedElement's attribute (i.e. `transform`) can be tracked and used to\n\t// trigger the Popover to rerender.\n\tuseLayoutEffect( () => {\n\t\tif ( ! previousElement ) {\n\t\t\treturn;\n\t\t}\n\t\tconst observer = new window.MutationObserver( forcePopoverRecompute );\n\t\tobserver.observe( previousElement, { attributes: true } );\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ previousElement ] );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! nextElement ) {\n\t\t\treturn;\n\t\t}\n\t\tconst observer = new window.MutationObserver( forcePopoverRecompute );\n\t\tobserver.observe( nextElement, { attributes: true } );\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ nextElement ] );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! previousElement ) {\n\t\t\treturn;\n\t\t}\n\t\tpreviousElement.ownerDocument.defaultView.addEventListener(\n\t\t\t'resize',\n\t\t\tforcePopoverRecompute\n\t\t);\n\t\treturn () => {\n\t\t\tpreviousElement.ownerDocument.defaultView.removeEventListener(\n\t\t\t\t'resize',\n\t\t\t\tforcePopoverRecompute\n\t\t\t);\n\t\t};\n\t}, [ previousElement ] );\n\n\t// If there's either a previous or a next element, show the inbetween popover.\n\t// Note that drag and drop uses the inbetween popover to show the drop indicator\n\t// before the first block and after the last block.\n\tif ( ( ! previousElement && ! nextElement ) || ! isVisible ) {\n\t\treturn null;\n\t}\n\n\t/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n\t// While ideally it would be enough to capture the\n\t// bubbling focus event from the Inserter, due to the\n\t// characteristics of click focusing of `button`s in\n\t// Firefox and Safari, it is not reliable.\n\t//\n\t// See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\treturn (\n\t\t<Popover\n\t\t\tref={ popoverScrollRef }\n\t\t\tanimate={ false }\n\t\t\tanchor={ popoverAnchor }\n\t\t\tfocusOnMount={ false }\n\t\t\t// Render in the old slot if needed for backward compatibility,\n\t\t\t// otherwise render in place (not in the default popover slot).\n\t\t\t__unstableSlotName={ __unstablePopoverSlot || null }\n\t\t\t// Forces a remount of the popover when its position changes\n\t\t\t// This makes sure the popover doesn't animate from its previous position.\n\t\t\tkey={ nextClientId + '--' + rootClientId }\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-block-popover',\n\t\t\t\t'block-editor-block-popover__inbetween',\n\t\t\t\tprops.className\n\t\t\t) }\n\t\t\tresize={ false }\n\t\t\tflip={ false }\n\t\t\tplacement=\"bottom-start\"\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"block-editor-block-popover__inbetween-container\"\n\t\t\t\tstyle={ style }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</Popover>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n}\n\nexport default BlockPopoverInbetween;\n"]}
|
|
@@ -11,13 +11,14 @@ import classnames from 'classnames';
|
|
|
11
11
|
|
|
12
12
|
import { useMergeRefs } from '@wordpress/compose';
|
|
13
13
|
import { Popover } from '@wordpress/components';
|
|
14
|
-
import { forwardRef, useMemo } from '@wordpress/element';
|
|
14
|
+
import { forwardRef, useMemo, useReducer, useLayoutEffect } from '@wordpress/element';
|
|
15
15
|
/**
|
|
16
16
|
* Internal dependencies
|
|
17
17
|
*/
|
|
18
18
|
|
|
19
19
|
import { __unstableUseBlockElement as useBlockElement } from '../block-list/use-block-props/use-block-refs';
|
|
20
20
|
import usePopoverScroll from './use-popover-scroll';
|
|
21
|
+
const MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER;
|
|
21
22
|
|
|
22
23
|
function BlockPopover(_ref, ref) {
|
|
23
24
|
let {
|
|
@@ -44,8 +45,33 @@ function BlockPopover(_ref, ref) {
|
|
|
44
45
|
height: selectedElement.offsetHeight
|
|
45
46
|
};
|
|
46
47
|
}, [selectedElement, lastSelectedElement, __unstableRefreshSize]);
|
|
48
|
+
const [popoverAnchorRecomputeCounter, forceRecomputePopoverAnchor] = useReducer( // Module is there to make sure that the counter doesn't overflow.
|
|
49
|
+
s => (s + 1) % MAX_POPOVER_RECOMPUTE_COUNTER, 0); // When blocks are moved up/down, they are animated to their new position by
|
|
50
|
+
// updating the `transform` property manually (i.e. without using CSS
|
|
51
|
+
// transitions or animations). The animation, which can also scroll the block
|
|
52
|
+
// editor, can sometimes cause the position of the Popover to get out of sync.
|
|
53
|
+
// A MutationObserver is therefore used to make sure that changes to the
|
|
54
|
+
// selectedElement's attribute (i.e. `transform`) can be tracked and used to
|
|
55
|
+
// trigger the Popover to rerender.
|
|
56
|
+
|
|
57
|
+
useLayoutEffect(() => {
|
|
58
|
+
if (!selectedElement) {
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
const observer = new window.MutationObserver(forceRecomputePopoverAnchor);
|
|
63
|
+
observer.observe(selectedElement, {
|
|
64
|
+
attributes: true
|
|
65
|
+
});
|
|
66
|
+
return () => {
|
|
67
|
+
observer.disconnect();
|
|
68
|
+
};
|
|
69
|
+
}, [selectedElement]);
|
|
47
70
|
const popoverAnchor = useMemo(() => {
|
|
48
|
-
if (
|
|
71
|
+
if ( // popoverAnchorRecomputeCounter is by definition always equal or greater
|
|
72
|
+
// than 0. This check is only there to satisfy the correctness of the
|
|
73
|
+
// exhaustive-deps rule for the `useMemo` hook.
|
|
74
|
+
popoverAnchorRecomputeCounter < 0 || !selectedElement || bottomClientId && !lastSelectedElement) {
|
|
49
75
|
return undefined;
|
|
50
76
|
}
|
|
51
77
|
|
|
@@ -70,7 +96,7 @@ function BlockPopover(_ref, ref) {
|
|
|
70
96
|
|
|
71
97
|
ownerDocument: selectedElement.ownerDocument
|
|
72
98
|
};
|
|
73
|
-
}, [bottomClientId, lastSelectedElement, selectedElement]);
|
|
99
|
+
}, [bottomClientId, lastSelectedElement, selectedElement, popoverAnchorRecomputeCounter]);
|
|
74
100
|
|
|
75
101
|
if (!selectedElement || bottomClientId && !lastSelectedElement) {
|
|
76
102
|
return null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/block-editor/src/components/block-popover/index.js"],"names":["classnames","useMergeRefs","Popover","forwardRef","useMemo","__unstableUseBlockElement","useBlockElement","usePopoverScroll","BlockPopover","ref","clientId","bottomClientId","children","__unstableRefreshSize","__unstableCoverTarget","__unstablePopoverSlot","__unstableContentRef","props","selectedElement","lastSelectedElement","mergedRefs","style","position","width","offsetWidth","height","offsetHeight","popoverAnchor","undefined","getBoundingClientRect","selectedBCR","lastSelectedBCR","left","Math","min","Infinity","top","right","max","bottom","
|
|
1
|
+
{"version":3,"sources":["@wordpress/block-editor/src/components/block-popover/index.js"],"names":["classnames","useMergeRefs","Popover","forwardRef","useMemo","useReducer","useLayoutEffect","__unstableUseBlockElement","useBlockElement","usePopoverScroll","MAX_POPOVER_RECOMPUTE_COUNTER","Number","MAX_SAFE_INTEGER","BlockPopover","ref","clientId","bottomClientId","children","__unstableRefreshSize","__unstableCoverTarget","__unstablePopoverSlot","__unstableContentRef","props","selectedElement","lastSelectedElement","mergedRefs","style","position","width","offsetWidth","height","offsetHeight","popoverAnchorRecomputeCounter","forceRecomputePopoverAnchor","s","observer","window","MutationObserver","observe","attributes","disconnect","popoverAnchor","undefined","getBoundingClientRect","selectedBCR","lastSelectedBCR","left","Math","min","Infinity","top","right","max","bottom","DOMRect","ownerDocument","className"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useMergeRefs } from '@wordpress/compose';\nimport { Popover } from '@wordpress/components';\nimport {\n\tforwardRef,\n\tuseMemo,\n\tuseReducer,\n\tuseLayoutEffect,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { __unstableUseBlockElement as useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport usePopoverScroll from './use-popover-scroll';\n\nconst MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER;\n\nfunction BlockPopover(\n\t{\n\t\tclientId,\n\t\tbottomClientId,\n\t\tchildren,\n\t\t__unstableRefreshSize,\n\t\t__unstableCoverTarget = false,\n\t\t__unstablePopoverSlot,\n\t\t__unstableContentRef,\n\t\t...props\n\t},\n\tref\n) {\n\tconst selectedElement = useBlockElement( clientId );\n\tconst lastSelectedElement = useBlockElement( bottomClientId ?? clientId );\n\tconst mergedRefs = useMergeRefs( [\n\t\tref,\n\t\tusePopoverScroll( __unstableContentRef ),\n\t] );\n\tconst style = useMemo( () => {\n\t\tif ( ! selectedElement || lastSelectedElement !== selectedElement ) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn {\n\t\t\tposition: 'absolute',\n\t\t\twidth: selectedElement.offsetWidth,\n\t\t\theight: selectedElement.offsetHeight,\n\t\t};\n\t}, [ selectedElement, lastSelectedElement, __unstableRefreshSize ] );\n\n\tconst [ popoverAnchorRecomputeCounter, forceRecomputePopoverAnchor ] =\n\t\tuseReducer(\n\t\t\t// Module is there to make sure that the counter doesn't overflow.\n\t\t\t( s ) => ( s + 1 ) % MAX_POPOVER_RECOMPUTE_COUNTER,\n\t\t\t0\n\t\t);\n\n\t// When blocks are moved up/down, they are animated to their new position by\n\t// updating the `transform` property manually (i.e. without using CSS\n\t// transitions or animations). The animation, which can also scroll the block\n\t// editor, can sometimes cause the position of the Popover to get out of sync.\n\t// A MutationObserver is therefore used to make sure that changes to the\n\t// selectedElement's attribute (i.e. `transform`) can be tracked and used to\n\t// trigger the Popover to rerender.\n\tuseLayoutEffect( () => {\n\t\tif ( ! selectedElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst observer = new window.MutationObserver(\n\t\t\tforceRecomputePopoverAnchor\n\t\t);\n\t\tobserver.observe( selectedElement, { attributes: true } );\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ selectedElement ] );\n\n\tconst popoverAnchor = useMemo( () => {\n\t\tif (\n\t\t\t// popoverAnchorRecomputeCounter is by definition always equal or greater\n\t\t\t// than 0. This check is only there to satisfy the correctness of the\n\t\t\t// exhaustive-deps rule for the `useMemo` hook.\n\t\t\tpopoverAnchorRecomputeCounter < 0 ||\n\t\t\t! selectedElement ||\n\t\t\t( bottomClientId && ! lastSelectedElement )\n\t\t) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\treturn {\n\t\t\tgetBoundingClientRect() {\n\t\t\t\tconst selectedBCR = selectedElement.getBoundingClientRect();\n\t\t\t\tconst lastSelectedBCR =\n\t\t\t\t\tlastSelectedElement?.getBoundingClientRect();\n\n\t\t\t\t// Get the biggest rectangle that encompasses completely the currently\n\t\t\t\t// selected element and the last selected element:\n\t\t\t\t// - for top/left coordinates, use the smaller numbers\n\t\t\t\t// - for the bottom/right coordinates, use the largest numbers\n\t\t\t\tconst left = Math.min(\n\t\t\t\t\tselectedBCR.left,\n\t\t\t\t\tlastSelectedBCR?.left ?? Infinity\n\t\t\t\t);\n\t\t\t\tconst top = Math.min(\n\t\t\t\t\tselectedBCR.top,\n\t\t\t\t\tlastSelectedBCR?.top ?? Infinity\n\t\t\t\t);\n\t\t\t\tconst right = Math.max(\n\t\t\t\t\tselectedBCR.right,\n\t\t\t\t\tlastSelectedBCR.right ?? -Infinity\n\t\t\t\t);\n\t\t\t\tconst bottom = Math.max(\n\t\t\t\t\tselectedBCR.bottom,\n\t\t\t\t\tlastSelectedBCR.bottom ?? -Infinity\n\t\t\t\t);\n\t\t\t\tconst width = right - left;\n\t\t\t\tconst height = bottom - top;\n\n\t\t\t\treturn new window.DOMRect( left, top, width, height );\n\t\t\t},\n\t\t\townerDocument: selectedElement.ownerDocument,\n\t\t};\n\t}, [\n\t\tbottomClientId,\n\t\tlastSelectedElement,\n\t\tselectedElement,\n\t\tpopoverAnchorRecomputeCounter,\n\t] );\n\n\tif ( ! selectedElement || ( bottomClientId && ! lastSelectedElement ) ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Popover\n\t\t\tref={ mergedRefs }\n\t\t\tanimate={ false }\n\t\t\tposition=\"top right left\"\n\t\t\tfocusOnMount={ false }\n\t\t\tanchor={ popoverAnchor }\n\t\t\t// Render in the old slot if needed for backward compatibility,\n\t\t\t// otherwise render in place (not in the default popover slot).\n\t\t\t__unstableSlotName={ __unstablePopoverSlot || null }\n\t\t\tresize={ false }\n\t\t\tflip={ false }\n\t\t\tshift\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-block-popover',\n\t\t\t\tprops.className\n\t\t\t) }\n\t\t>\n\t\t\t{ __unstableCoverTarget && <div style={ style }>{ children }</div> }\n\t\t\t{ ! __unstableCoverTarget && children }\n\t\t</Popover>\n\t);\n}\n\nexport default forwardRef( BlockPopover );\n"]}
|