@wordpress/block-editor 15.11.0 → 15.11.1-next.v.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/build/components/block-controls/index.cjs +1 -1
- package/build/components/block-controls/index.cjs.map +2 -2
- package/build/components/block-inspector/index.cjs +6 -19
- package/build/components/block-inspector/index.cjs.map +3 -3
- package/build/components/block-list/use-block-props/use-selected-block-event-handlers.cjs +37 -13
- package/build/components/block-list/use-block-props/use-selected-block-event-handlers.cjs.map +2 -2
- package/build/components/block-settings-menu-controls/index.cjs +1 -1
- package/build/components/block-settings-menu-controls/index.cjs.map +2 -2
- package/build/components/block-toolbar/index.cjs +1 -1
- package/build/components/block-toolbar/index.cjs.map +2 -2
- package/build/components/block-tools/index.cjs +2 -26
- package/build/components/block-tools/index.cjs.map +2 -2
- package/build/components/block-visibility/index.cjs +7 -9
- package/build/components/block-visibility/index.cjs.map +3 -3
- package/build/components/block-visibility/modal.cjs +13 -11
- package/build/components/block-visibility/modal.cjs.map +2 -2
- package/build/components/block-visibility/use-block-visibility.cjs +1 -1
- package/build/components/block-visibility/use-block-visibility.cjs.map +2 -2
- package/build/components/block-visibility/utils.cjs +5 -1
- package/build/components/block-visibility/utils.cjs.map +2 -2
- package/build/components/block-visibility/viewport-menu-item.cjs +11 -4
- package/build/components/block-visibility/viewport-menu-item.cjs.map +2 -2
- package/build/components/block-visibility/viewport-toolbar.cjs +4 -6
- package/build/components/block-visibility/viewport-toolbar.cjs.map +2 -2
- package/build/components/block-visibility/viewport-visibility-info.cjs +121 -0
- package/build/components/block-visibility/viewport-visibility-info.cjs.map +7 -0
- package/build/components/color-palette/with-color-context.cjs +1 -1
- package/build/components/color-palette/with-color-context.cjs.map +2 -2
- package/build/components/color-style-selector/index.cjs +1 -1
- package/build/components/color-style-selector/index.cjs.map +2 -2
- package/build/components/colors/with-colors.cjs +5 -3
- package/build/components/colors/with-colors.cjs.map +2 -2
- package/build/components/colors-gradients/dropdown.cjs +1 -1
- package/build/components/colors-gradients/dropdown.cjs.map +2 -2
- package/build/components/editable-text/index.cjs +5 -1
- package/build/components/editable-text/index.cjs.map +2 -2
- package/build/components/font-sizes/with-font-sizes.cjs +5 -3
- package/build/components/font-sizes/with-font-sizes.cjs.map +2 -2
- package/build/components/global-styles/advanced-panel.cjs +26 -13
- package/build/components/global-styles/advanced-panel.cjs.map +2 -2
- package/build/components/global-styles/filters-panel.cjs +1 -1
- package/build/components/global-styles/filters-panel.cjs.map +2 -2
- package/build/components/global-styles/shadow-panel-components.cjs +1 -1
- package/build/components/global-styles/shadow-panel-components.cjs.map +2 -2
- package/build/components/gradients/with-gradient.cjs +1 -1
- package/build/components/gradients/with-gradient.cjs.map +2 -2
- package/build/components/inspector-controls/fill.cjs +12 -2
- package/build/components/inspector-controls/fill.cjs.map +2 -2
- package/build/components/inspector-controls/index.cjs +1 -1
- package/build/components/inspector-controls/index.cjs.map +2 -2
- package/build/components/inspector-controls-tabs/index.cjs +1 -1
- package/build/components/inspector-controls-tabs/index.cjs.map +2 -2
- package/build/components/inspector-controls-tabs/use-inspector-controls-tabs.cjs +2 -2
- package/build/components/inspector-controls-tabs/use-inspector-controls-tabs.cjs.map +2 -2
- package/build/components/list-view/block-select-button.cjs +8 -16
- package/build/components/list-view/block-select-button.cjs.map +2 -2
- package/build/components/list-view/block.cjs +29 -34
- package/build/components/list-view/block.cjs.map +3 -3
- package/build/components/list-view/utils.cjs +3 -1
- package/build/components/list-view/utils.cjs.map +2 -2
- package/build/components/provider/index.cjs +7 -8
- package/build/components/provider/index.cjs.map +2 -2
- package/build/components/provider/with-registry-provider.cjs +1 -1
- package/build/components/provider/with-registry-provider.cjs.map +2 -2
- package/build/components/use-block-commands/index.cjs +2 -34
- package/build/components/use-block-commands/index.cjs.map +2 -2
- package/build/hooks/cross-origin-isolation.cjs +1 -1
- package/build/hooks/cross-origin-isolation.cjs.map +2 -2
- package/build/hooks/custom-css.cjs +141 -0
- package/build/hooks/custom-css.cjs.map +7 -0
- package/build/hooks/fit-text.cjs +14 -7
- package/build/hooks/fit-text.cjs.map +2 -2
- package/build/hooks/grid-visualizer.cjs +1 -1
- package/build/hooks/grid-visualizer.cjs.map +2 -2
- package/build/hooks/index.cjs +4 -0
- package/build/hooks/index.cjs.map +3 -3
- package/build/hooks/layout.cjs +10 -4
- package/build/hooks/layout.cjs.map +2 -2
- package/build/hooks/list-view.cjs +9 -5
- package/build/hooks/list-view.cjs.map +3 -3
- package/build/hooks/utils.cjs +2 -2
- package/build/hooks/utils.cjs.map +2 -2
- package/build/layouts/grid.cjs +12 -1
- package/build/layouts/grid.cjs.map +2 -2
- package/build/store/defaults.cjs +3 -0
- package/build/store/defaults.cjs.map +2 -2
- package/build/store/private-selectors.cjs +45 -37
- package/build/store/private-selectors.cjs.map +2 -2
- package/build/utils/fit-text-utils.cjs +5 -1
- package/build/utils/fit-text-utils.cjs.map +2 -2
- package/build-module/components/block-controls/index.mjs +1 -1
- package/build-module/components/block-controls/index.mjs.map +2 -2
- package/build-module/components/block-inspector/index.mjs +6 -19
- package/build-module/components/block-inspector/index.mjs.map +2 -2
- package/build-module/components/block-list/use-block-props/use-selected-block-event-handlers.mjs +37 -13
- package/build-module/components/block-list/use-block-props/use-selected-block-event-handlers.mjs.map +2 -2
- package/build-module/components/block-settings-menu-controls/index.mjs +2 -2
- package/build-module/components/block-settings-menu-controls/index.mjs.map +2 -2
- package/build-module/components/block-toolbar/index.mjs +2 -2
- package/build-module/components/block-toolbar/index.mjs.map +2 -2
- package/build-module/components/block-tools/index.mjs +2 -26
- package/build-module/components/block-tools/index.mjs.map +2 -2
- package/build-module/components/block-visibility/index.mjs +6 -9
- package/build-module/components/block-visibility/index.mjs.map +2 -2
- package/build-module/components/block-visibility/modal.mjs +13 -11
- package/build-module/components/block-visibility/modal.mjs.map +2 -2
- package/build-module/components/block-visibility/use-block-visibility.mjs +1 -1
- package/build-module/components/block-visibility/use-block-visibility.mjs.map +2 -2
- package/build-module/components/block-visibility/utils.mjs +5 -1
- package/build-module/components/block-visibility/utils.mjs.map +2 -2
- package/build-module/components/block-visibility/viewport-menu-item.mjs +11 -4
- package/build-module/components/block-visibility/viewport-menu-item.mjs.map +2 -2
- package/build-module/components/block-visibility/viewport-toolbar.mjs +4 -6
- package/build-module/components/block-visibility/viewport-toolbar.mjs.map +2 -2
- package/build-module/components/block-visibility/viewport-visibility-info.mjs +95 -0
- package/build-module/components/block-visibility/viewport-visibility-info.mjs.map +7 -0
- package/build-module/components/color-palette/with-color-context.mjs +1 -1
- package/build-module/components/color-palette/with-color-context.mjs.map +2 -2
- package/build-module/components/color-style-selector/index.mjs +1 -1
- package/build-module/components/color-style-selector/index.mjs.map +2 -2
- package/build-module/components/colors/with-colors.mjs +5 -3
- package/build-module/components/colors/with-colors.mjs.map +2 -2
- package/build-module/components/colors-gradients/dropdown.mjs +1 -1
- package/build-module/components/colors-gradients/dropdown.mjs.map +2 -2
- package/build-module/components/editable-text/index.mjs +5 -1
- package/build-module/components/editable-text/index.mjs.map +2 -2
- package/build-module/components/font-sizes/with-font-sizes.mjs +5 -3
- package/build-module/components/font-sizes/with-font-sizes.mjs.map +2 -2
- package/build-module/components/global-styles/advanced-panel.mjs +22 -13
- package/build-module/components/global-styles/advanced-panel.mjs.map +2 -2
- package/build-module/components/global-styles/filters-panel.mjs +1 -1
- package/build-module/components/global-styles/filters-panel.mjs.map +2 -2
- package/build-module/components/global-styles/shadow-panel-components.mjs +1 -1
- package/build-module/components/global-styles/shadow-panel-components.mjs.map +2 -2
- package/build-module/components/gradients/with-gradient.mjs +1 -1
- package/build-module/components/gradients/with-gradient.mjs.map +2 -2
- package/build-module/components/inspector-controls/fill.mjs +12 -2
- package/build-module/components/inspector-controls/fill.mjs.map +2 -2
- package/build-module/components/inspector-controls/index.mjs +1 -1
- package/build-module/components/inspector-controls/index.mjs.map +2 -2
- package/build-module/components/inspector-controls-tabs/index.mjs +1 -1
- package/build-module/components/inspector-controls-tabs/index.mjs.map +2 -2
- package/build-module/components/inspector-controls-tabs/use-inspector-controls-tabs.mjs +2 -2
- package/build-module/components/inspector-controls-tabs/use-inspector-controls-tabs.mjs.map +2 -2
- package/build-module/components/list-view/block-select-button.mjs +8 -16
- package/build-module/components/list-view/block-select-button.mjs.map +2 -2
- package/build-module/components/list-view/block.mjs +31 -36
- package/build-module/components/list-view/block.mjs.map +2 -2
- package/build-module/components/list-view/utils.mjs +3 -1
- package/build-module/components/list-view/utils.mjs.map +2 -2
- package/build-module/components/provider/index.mjs +7 -8
- package/build-module/components/provider/index.mjs.map +2 -2
- package/build-module/components/provider/with-registry-provider.mjs +1 -1
- package/build-module/components/provider/with-registry-provider.mjs.map +2 -2
- package/build-module/components/use-block-commands/index.mjs +3 -37
- package/build-module/components/use-block-commands/index.mjs.map +2 -2
- package/build-module/hooks/cross-origin-isolation.mjs +1 -1
- package/build-module/hooks/cross-origin-isolation.mjs.map +2 -2
- package/build-module/hooks/custom-css.mjs +112 -0
- package/build-module/hooks/custom-css.mjs.map +7 -0
- package/build-module/hooks/fit-text.mjs +14 -7
- package/build-module/hooks/fit-text.mjs.map +2 -2
- package/build-module/hooks/grid-visualizer.mjs +1 -1
- package/build-module/hooks/grid-visualizer.mjs.map +2 -2
- package/build-module/hooks/index.mjs +4 -0
- package/build-module/hooks/index.mjs.map +2 -2
- package/build-module/hooks/layout.mjs +10 -4
- package/build-module/hooks/layout.mjs.map +2 -2
- package/build-module/hooks/list-view.mjs +10 -6
- package/build-module/hooks/list-view.mjs.map +2 -2
- package/build-module/hooks/utils.mjs +2 -2
- package/build-module/hooks/utils.mjs.map +2 -2
- package/build-module/layouts/grid.mjs +12 -1
- package/build-module/layouts/grid.mjs.map +2 -2
- package/build-module/store/defaults.mjs +3 -0
- package/build-module/store/defaults.mjs.map +2 -2
- package/build-module/store/private-selectors.mjs +42 -40
- package/build-module/store/private-selectors.mjs.map +2 -2
- package/build-module/utils/fit-text-utils.mjs +5 -1
- package/build-module/utils/fit-text-utils.mjs.map +2 -2
- package/build-style/style-rtl.css +3 -0
- package/build-style/style.css +3 -0
- package/package.json +39 -39
- package/src/components/block-controls/index.js +1 -1
- package/src/components/block-controls/test/index.js +1 -0
- package/src/components/block-edit/test/edit.js +10 -0
- package/src/components/block-inspector/index.js +14 -32
- package/src/components/block-list/use-block-props/use-selected-block-event-handlers.js +49 -29
- package/src/components/block-preview/test/index.js +11 -7
- package/src/components/block-settings-menu-controls/index.js +2 -2
- package/src/components/block-switcher/test/index.js +2 -0
- package/src/components/block-switcher/test/use-transformed.patterns.js +2 -0
- package/src/components/block-switcher/test/utils.js +2 -0
- package/src/components/block-toolbar/index.js +2 -2
- package/src/components/block-tools/index.js +2 -29
- package/src/components/block-visibility/index.js +3 -19
- package/src/components/block-visibility/modal.js +16 -14
- package/src/components/block-visibility/test/use-block-visibility.js +27 -25
- package/src/components/block-visibility/test/utils.js +24 -8
- package/src/components/block-visibility/use-block-visibility.js +1 -4
- package/src/components/block-visibility/utils.js +9 -1
- package/src/components/block-visibility/viewport-menu-item.js +11 -5
- package/src/components/block-visibility/viewport-toolbar.js +5 -6
- package/src/components/block-visibility/viewport-visibility-info.js +131 -0
- package/src/components/color-palette/with-color-context.js +1 -1
- package/src/components/color-style-selector/index.js +2 -3
- package/src/components/colors/with-colors.js +23 -20
- package/src/components/colors-gradients/dropdown.js +2 -3
- package/src/components/editable-text/index.js +5 -1
- package/src/components/font-sizes/with-font-sizes.js +13 -10
- package/src/components/global-styles/advanced-panel.js +35 -16
- package/src/components/global-styles/filters-panel.js +2 -3
- package/src/components/global-styles/shadow-panel-components.js +1 -1
- package/src/components/global-styles/style.scss +9 -5
- package/src/components/gradients/with-gradient.js +7 -4
- package/src/components/inner-blocks/test/index.js +2 -0
- package/src/components/inspector-controls/fill.js +25 -5
- package/src/components/inspector-controls/index.js +1 -1
- package/src/components/inspector-controls-tabs/index.js +5 -1
- package/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js +3 -4
- package/src/components/link-control/test/index.js +6 -1
- package/src/components/list-view/block-select-button.js +16 -25
- package/src/components/list-view/block.js +38 -43
- package/src/components/list-view/utils.js +4 -2
- package/src/components/media-replace-flow/test/index.js +13 -11
- package/src/components/provider/index.js +11 -10
- package/src/components/provider/test/use-block-sync.js +1 -0
- package/src/components/provider/with-registry-provider.js +1 -1
- package/src/components/use-block-commands/index.js +0 -41
- package/src/hooks/cross-origin-isolation.js +19 -18
- package/src/hooks/custom-css.js +176 -0
- package/src/hooks/fit-text.js +20 -5
- package/src/hooks/grid-visualizer.js +15 -14
- package/src/hooks/index.js +4 -0
- package/src/hooks/layout.js +55 -43
- package/src/hooks/list-view.js +10 -6
- package/src/hooks/test/align.js +1 -0
- package/src/hooks/test/allowed-blocks.js +8 -0
- package/src/hooks/test/auto-inspector-controls.js +4 -0
- package/src/hooks/test/font-size.js +1 -0
- package/src/hooks/test/metadata.js +4 -0
- package/src/hooks/test/text-align.js +1 -0
- package/src/hooks/utils.js +123 -119
- package/src/layouts/grid.js +19 -3
- package/src/layouts/test/grid.js +1 -1
- package/src/store/defaults.js +4 -0
- package/src/store/private-selectors.js +94 -63
- package/src/store/test/actions.js +7 -0
- package/src/store/test/private-selectors.js +116 -119
- package/src/store/test/reducer.js +4 -0
- package/src/store/test/registry-selectors.js +2 -0
- package/src/store/test/selectors.js +19 -0
- package/src/utils/fit-text-utils.js +12 -2
- package/build/components/block-visibility/block-visibility-info.cjs +0 -63
- package/build/components/block-visibility/block-visibility-info.cjs.map +0 -7
- package/build/components/block-visibility/menu-item.cjs +0 -109
- package/build/components/block-visibility/menu-item.cjs.map +0 -7
- package/build/components/block-visibility/toolbar.cjs +0 -92
- package/build/components/block-visibility/toolbar.cjs.map +0 -7
- package/build-module/components/block-visibility/block-visibility-info.mjs +0 -47
- package/build-module/components/block-visibility/block-visibility-info.mjs.map +0 -7
- package/build-module/components/block-visibility/menu-item.mjs +0 -88
- package/build-module/components/block-visibility/menu-item.mjs.map +0 -7
- package/build-module/components/block-visibility/toolbar.mjs +0 -71
- package/build-module/components/block-visibility/toolbar.mjs.map +0 -7
- package/src/components/block-visibility/block-visibility-info.js +0 -62
- package/src/components/block-visibility/menu-item.js +0 -96
- package/src/components/block-visibility/toolbar.js +0 -88
|
@@ -32,7 +32,7 @@ function InspectorControlsTabs({
|
|
|
32
32
|
hasUserSelectionRef.current = false;
|
|
33
33
|
}, [clientId]);
|
|
34
34
|
useEffect(() => {
|
|
35
|
-
if (!tabs?.length || hasUserSelectionRef.current) {
|
|
35
|
+
if (!tabs?.length || hasUserSelectionRef.current && tabs.some((tab) => tab.name === selectedTabId)) {
|
|
36
36
|
return;
|
|
37
37
|
}
|
|
38
38
|
const firstTabName = tabs[0]?.name;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/inspector-controls-tabs/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\tTooltip,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useEffect, useState, useRef } from '@wordpress/element';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { TAB_SETTINGS, TAB_STYLES, TAB_LIST_VIEW, TAB_CONTENT } from './utils';\nimport SettingsTab from './settings-tab';\nimport StylesTab from './styles-tab';\nimport ContentTab from './content-tab';\nimport InspectorControls from '../inspector-controls';\nimport { unlock } from '../../lock-unlock';\n\nconst { Tabs } = unlock( componentsPrivateApis );\n\nexport default function InspectorControlsTabs( {\n\tblockName,\n\tclientId,\n\thasBlockStyles,\n\ttabs,\n\tisSectionBlock,\n\tcontentClientIds,\n} ) {\n\tconst showIconLabels = useSelect( ( select ) => {\n\t\treturn select( preferencesStore ).get( 'core', 'showIconLabels' );\n\t}, [] );\n\n\tconst [ selectedTabId, setSelectedTabId ] = useState( tabs[ 0 ]?.name );\n\tconst hasUserSelectionRef = useRef( false );\n\n\t// Reset when switching blocks\n\tuseEffect( () => {\n\t\thasUserSelectionRef.current = false;\n\t}, [ clientId ] );\n\n\t// Auto-select first available tab unless user has made a selection\n\tuseEffect( () => {\n\t\tif (
|
|
5
|
-
"mappings": ";AAGA;AAAA,EACC;AAAA,EACA;AAAA,EACA,eAAe;AAAA,OACT;AACP,SAAS,WAAW,UAAU,cAAc;AAC5C,SAAS,SAAS,wBAAwB;AAC1C,SAAS,iBAAiB;AAK1B,SAAS,cAAc,YAAY,eAAe,mBAAmB;AACrE,OAAO,iBAAiB;AACxB,OAAO,eAAe;AACtB,OAAO,gBAAgB;AACvB,OAAO,uBAAuB;AAC9B,SAAS,cAAc;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\tTooltip,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useEffect, useState, useRef } from '@wordpress/element';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { TAB_SETTINGS, TAB_STYLES, TAB_LIST_VIEW, TAB_CONTENT } from './utils';\nimport SettingsTab from './settings-tab';\nimport StylesTab from './styles-tab';\nimport ContentTab from './content-tab';\nimport InspectorControls from '../inspector-controls';\nimport { unlock } from '../../lock-unlock';\n\nconst { Tabs } = unlock( componentsPrivateApis );\n\nexport default function InspectorControlsTabs( {\n\tblockName,\n\tclientId,\n\thasBlockStyles,\n\ttabs,\n\tisSectionBlock,\n\tcontentClientIds,\n} ) {\n\tconst showIconLabels = useSelect( ( select ) => {\n\t\treturn select( preferencesStore ).get( 'core', 'showIconLabels' );\n\t}, [] );\n\n\tconst [ selectedTabId, setSelectedTabId ] = useState( tabs[ 0 ]?.name );\n\tconst hasUserSelectionRef = useRef( false );\n\n\t// Reset when switching blocks\n\tuseEffect( () => {\n\t\thasUserSelectionRef.current = false;\n\t}, [ clientId ] );\n\n\t// Auto-select first available tab unless user has made a selection\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! tabs?.length ||\n\t\t\t( hasUserSelectionRef.current &&\n\t\t\t\ttabs.some( ( tab ) => tab.name === selectedTabId ) )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst firstTabName = tabs[ 0 ]?.name;\n\t\tif ( selectedTabId !== firstTabName ) {\n\t\t\tsetSelectedTabId( firstTabName );\n\t\t}\n\t}, [ tabs, selectedTabId ] );\n\n\tconst handleTabSelect = ( tabId ) => {\n\t\tsetSelectedTabId( tabId );\n\t\thasUserSelectionRef.current = true;\n\t};\n\n\treturn (\n\t\t<div className=\"block-editor-block-inspector__tabs\">\n\t\t\t<Tabs\n\t\t\t\tselectedTabId={ selectedTabId }\n\t\t\t\tonSelect={ handleTabSelect }\n\t\t\t\tkey={ clientId }\n\t\t\t>\n\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t{ tabs.map( ( tab ) =>\n\t\t\t\t\t\tshowIconLabels ? (\n\t\t\t\t\t\t\t<Tabs.Tab key={ tab.name } tabId={ tab.name }>\n\t\t\t\t\t\t\t\t{ tab.title }\n\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<Tooltip text={ tab.title } key={ tab.name }>\n\t\t\t\t\t\t\t\t<Tabs.Tab\n\t\t\t\t\t\t\t\t\ttabId={ tab.name }\n\t\t\t\t\t\t\t\t\taria-label={ tab.title }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Icon icon={ tab.icon } />\n\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t)\n\t\t\t\t\t) }\n\t\t\t\t</Tabs.TabList>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_SETTINGS.name } focusable={ false }>\n\t\t\t\t\t<SettingsTab showAdvancedControls={ !! blockName } />\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_STYLES.name } focusable={ false }>\n\t\t\t\t\t<StylesTab\n\t\t\t\t\t\tblockName={ blockName }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t\thasBlockStyles={ hasBlockStyles }\n\t\t\t\t\t\tisSectionBlock={ isSectionBlock }\n\t\t\t\t\t\tcontentClientIds={ contentClientIds }\n\t\t\t\t\t/>\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_CONTENT.name } focusable={ false }>\n\t\t\t\t\t<InspectorControls.Slot group=\"content\" />\n\t\t\t\t\t<ContentTab contentClientIds={ contentClientIds } />\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_LIST_VIEW.name } focusable={ false }>\n\t\t\t\t\t<InspectorControls.Slot group=\"list\" />\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t</Tabs>\n\t\t</div>\n\t);\n}\n"],
|
|
5
|
+
"mappings": ";AAGA;AAAA,EACC;AAAA,EACA;AAAA,EACA,eAAe;AAAA,OACT;AACP,SAAS,WAAW,UAAU,cAAc;AAC5C,SAAS,SAAS,wBAAwB;AAC1C,SAAS,iBAAiB;AAK1B,SAAS,cAAc,YAAY,eAAe,mBAAmB;AACrE,OAAO,iBAAiB;AACxB,OAAO,eAAe;AACtB,OAAO,gBAAgB;AACvB,OAAO,uBAAuB;AAC9B,SAAS,cAAc;AAuDhB,cA2BH,YA3BG;AArDP,IAAM,EAAE,KAAK,IAAI,OAAQ,qBAAsB;AAEhC,SAAR,sBAAwC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,iBAAiB,UAAW,CAAE,WAAY;AAC/C,WAAO,OAAQ,gBAAiB,EAAE,IAAK,QAAQ,gBAAiB;AAAA,EACjE,GAAG,CAAC,CAAE;AAEN,QAAM,CAAE,eAAe,gBAAiB,IAAI,SAAU,KAAM,CAAE,GAAG,IAAK;AACtE,QAAM,sBAAsB,OAAQ,KAAM;AAG1C,YAAW,MAAM;AAChB,wBAAoB,UAAU;AAAA,EAC/B,GAAG,CAAE,QAAS,CAAE;AAGhB,YAAW,MAAM;AAChB,QACC,CAAE,MAAM,UACN,oBAAoB,WACrB,KAAK,KAAM,CAAE,QAAS,IAAI,SAAS,aAAc,GACjD;AACD;AAAA,IACD;AAEA,UAAM,eAAe,KAAM,CAAE,GAAG;AAChC,QAAK,kBAAkB,cAAe;AACrC,uBAAkB,YAAa;AAAA,IAChC;AAAA,EACD,GAAG,CAAE,MAAM,aAAc,CAAE;AAE3B,QAAM,kBAAkB,CAAE,UAAW;AACpC,qBAAkB,KAAM;AACxB,wBAAoB,UAAU;AAAA,EAC/B;AAEA,SACC,oBAAC,SAAI,WAAU,sCACd;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,UAAW;AAAA,MAGX;AAAA,4BAAC,KAAK,SAAL,EACE,eAAK;AAAA,UAAK,CAAE,QACb,iBACC,oBAAC,KAAK,KAAL,EAA0B,OAAQ,IAAI,MACpC,cAAI,SADS,IAAI,IAEpB,IAEA,oBAAC,WAAQ,MAAO,IAAI,OACnB;AAAA,YAAC,KAAK;AAAA,YAAL;AAAA,cACA,OAAQ,IAAI;AAAA,cACZ,cAAa,IAAI;AAAA,cAEjB,8BAAC,QAAK,MAAO,IAAI,MAAO;AAAA;AAAA,UACzB,KANiC,IAAI,IAOtC;AAAA,QAEF,GACD;AAAA,QACA,oBAAC,KAAK,UAAL,EAAc,OAAQ,aAAa,MAAO,WAAY,OACtD,8BAAC,eAAY,sBAAuB,CAAC,CAAE,WAAY,GACpD;AAAA,QACA,oBAAC,KAAK,UAAL,EAAc,OAAQ,WAAW,MAAO,WAAY,OACpD;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACD,GACD;AAAA,QACA,qBAAC,KAAK,UAAL,EAAc,OAAQ,YAAY,MAAO,WAAY,OACrD;AAAA,8BAAC,kBAAkB,MAAlB,EAAuB,OAAM,WAAU;AAAA,UACxC,oBAAC,cAAW,kBAAsC;AAAA,WACnD;AAAA,QACA,oBAAC,KAAK,UAAL,EAAc,OAAQ,cAAc,MAAO,WAAY,OACvD,8BAAC,kBAAkB,MAAlB,EAAuB,OAAM,QAAO,GACtC;AAAA;AAAA;AAAA,IAtCM;AAAA,EAuCP,GACD;AAEF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -60,8 +60,8 @@ function useInspectorControlsTabs(blockName, contentClientIds, isSectionBlock, h
|
|
|
60
60
|
if (hasListFills) {
|
|
61
61
|
tabs.push(TAB_LIST_VIEW);
|
|
62
62
|
}
|
|
63
|
-
if (
|
|
64
|
-
advancedFills.length && (hasContentTab || hasListFills))
|
|
63
|
+
if (settingsFills.length || // Advanced fills show up in settings tab if available or they blend into the default tab, if there's only one tab.
|
|
64
|
+
advancedFills.length && (hasContentTab || hasListFills)) {
|
|
65
65
|
tabs.push(TAB_SETTINGS);
|
|
66
66
|
}
|
|
67
67
|
if (hasBlockStyles || hasStyleFills) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/inspector-controls-tabs/use-inspector-controls-tabs.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalUseSlotFills as useSlotFills } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport InspectorControlsGroups from '../inspector-controls/groups';\nimport { InspectorAdvancedControls } from '../inspector-controls';\nimport { TAB_LIST_VIEW, TAB_SETTINGS, TAB_STYLES, TAB_CONTENT } from './utils';\nimport { store as blockEditorStore } from '../../store';\n\nconst EMPTY_ARRAY = [];\n\nfunction getShowTabs( blockName, tabSettings = {} ) {\n\t// Block specific setting takes precedence over generic default.\n\tif ( tabSettings[ blockName ] !== undefined ) {\n\t\treturn tabSettings[ blockName ];\n\t}\n\n\t// Use generic default if set over the Gutenberg experiment option.\n\tif ( tabSettings.default !== undefined ) {\n\t\treturn tabSettings.default;\n\t}\n\n\treturn true;\n}\n\nexport default function useInspectorControlsTabs(\n\tblockName,\n\tcontentClientIds,\n\tisSectionBlock,\n\thasBlockStyles\n) {\n\tconst tabs = [];\n\tconst {\n\t\tbindings: bindingsGroup,\n\t\tborder: borderGroup,\n\t\tcolor: colorGroup,\n\t\tcontent: contentGroup,\n\t\tdefault: defaultGroup,\n\t\tdimensions: dimensionsGroup,\n\t\tlist: listGroup,\n\t\tposition: positionGroup,\n\t\tstyles: stylesGroup,\n\t\ttypography: typographyGroup,\n\t\teffects: effectsGroup,\n\t} = InspectorControlsGroups;\n\n\t// List View Tab: If there are any fills for the list group add that tab.\n\tconst listFills = useSlotFills( listGroup.name );\n\tconst hasListFills = !! listFills && listFills.length;\n\n\t// Content Tab: If there are any fills for the content group add that tab.\n\tconst contentFills = useSlotFills( contentGroup.name );\n\tconst hasContentFills = !! contentFills && contentFills.length;\n\n\t// Styles Tab: Add this tab if there are any fills for block supports\n\t// e.g. border, color, spacing, typography, etc.\n\tconst styleFills = [\n\t\t...( useSlotFills( borderGroup.name ) || [] ),\n\t\t...( useSlotFills( colorGroup.name ) || [] ),\n\t\t...( useSlotFills( dimensionsGroup.name ) || [] ),\n\t\t...( useSlotFills( stylesGroup.name ) || [] ),\n\t\t...( useSlotFills( typographyGroup.name ) || [] ),\n\t\t...( useSlotFills( effectsGroup.name ) || [] ),\n\t];\n\tconst hasStyleFills = styleFills.length;\n\n\t// Settings Tab: If we don't have multiple tabs to display\n\t// (i.e. both list view and styles), check only the default and position\n\t// InspectorControls slots. If we have multiple tabs, we'll need to check\n\t// the advanced controls slot as well to ensure they are rendered.\n\tconst advancedFills = [\n\t\t...( useSlotFills( InspectorAdvancedControls.slotName ) || [] ),\n\t\t...( useSlotFills( bindingsGroup.name ) || [] ),\n\t];\n\n\tconst settingsFills = [\n\t\t...( useSlotFills( defaultGroup.name ) || [] ),\n\t\t...( useSlotFills( positionGroup.name ) || [] ),\n\t\t...( hasListFills && hasStyleFills > 1 ? advancedFills : [] ),\n\t];\n\n\t// When the block fields experiment is active, only rely on `hasContentFills`\n\t// to determine whether the content tab to be shown. The tab purely uses slot\n\t// fills in this situation.\n\tconst shouldShowBlockFields =\n\t\twindow?.__experimentalContentOnlyInspectorFields;\n\tconst hasContentTab =\n\t\thasContentFills ||\n\t\t( ! shouldShowBlockFields && contentClientIds?.length );\n\n\tif ( hasContentTab ) {\n\t\ttabs.push( TAB_CONTENT );\n\t}\n\n\t// Add the tabs in the order that they will default to if available.\n\t// List View > Content > Settings > Styles.\n\tif ( hasListFills ) {\n\t\ttabs.push( TAB_LIST_VIEW );\n\t}\n\n\tif (\n\t\
|
|
5
|
-
"mappings": ";AAGA,SAAS,8BAA8B,oBAAoB;AAC3D,SAAS,iBAAiB;AAK1B,OAAO,6BAA6B;AACpC,SAAS,iCAAiC;AAC1C,SAAS,eAAe,cAAc,YAAY,mBAAmB;AACrE,SAAS,SAAS,wBAAwB;AAE1C,IAAM,cAAc,CAAC;AAErB,SAAS,YAAa,WAAW,cAAc,CAAC,GAAI;AAEnD,MAAK,YAAa,SAAU,MAAM,QAAY;AAC7C,WAAO,YAAa,SAAU;AAAA,EAC/B;AAGA,MAAK,YAAY,YAAY,QAAY;AACxC,WAAO,YAAY;AAAA,EACpB;AAEA,SAAO;AACR;AAEe,SAAR,yBACN,WACA,kBACA,gBACA,gBACC;AACD,QAAM,OAAO,CAAC;AACd,QAAM;AAAA,IACL,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,SAAS;AAAA,EACV,IAAI;AAGJ,QAAM,YAAY,aAAc,UAAU,IAAK;AAC/C,QAAM,eAAe,CAAC,CAAE,aAAa,UAAU;AAG/C,QAAM,eAAe,aAAc,aAAa,IAAK;AACrD,QAAM,kBAAkB,CAAC,CAAE,gBAAgB,aAAa;AAIxD,QAAM,aAAa;AAAA,IAClB,GAAK,aAAc,YAAY,IAAK,KAAK,CAAC;AAAA,IAC1C,GAAK,aAAc,WAAW,IAAK,KAAK,CAAC;AAAA,IACzC,GAAK,aAAc,gBAAgB,IAAK,KAAK,CAAC;AAAA,IAC9C,GAAK,aAAc,YAAY,IAAK,KAAK,CAAC;AAAA,IAC1C,GAAK,aAAc,gBAAgB,IAAK,KAAK,CAAC;AAAA,IAC9C,GAAK,aAAc,aAAa,IAAK,KAAK,CAAC;AAAA,EAC5C;AACA,QAAM,gBAAgB,WAAW;AAMjC,QAAM,gBAAgB;AAAA,IACrB,GAAK,aAAc,0BAA0B,QAAS,KAAK,CAAC;AAAA,IAC5D,GAAK,aAAc,cAAc,IAAK,KAAK,CAAC;AAAA,EAC7C;AAEA,QAAM,gBAAgB;AAAA,IACrB,GAAK,aAAc,aAAa,IAAK,KAAK,CAAC;AAAA,IAC3C,GAAK,aAAc,cAAc,IAAK,KAAK,CAAC;AAAA,IAC5C,GAAK,gBAAgB,gBAAgB,IAAI,gBAAgB,CAAC;AAAA,EAC3D;AAKA,QAAM,wBACL,QAAQ;AACT,QAAM,gBACL,mBACE,CAAE,yBAAyB,kBAAkB;AAEhD,MAAK,eAAgB;AACpB,SAAK,KAAM,WAAY;AAAA,EACxB;AAIA,MAAK,cAAe;AACnB,SAAK,KAAM,aAAc;AAAA,EAC1B;AAEA,
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalUseSlotFills as useSlotFills } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport InspectorControlsGroups from '../inspector-controls/groups';\nimport { InspectorAdvancedControls } from '../inspector-controls';\nimport { TAB_LIST_VIEW, TAB_SETTINGS, TAB_STYLES, TAB_CONTENT } from './utils';\nimport { store as blockEditorStore } from '../../store';\n\nconst EMPTY_ARRAY = [];\n\nfunction getShowTabs( blockName, tabSettings = {} ) {\n\t// Block specific setting takes precedence over generic default.\n\tif ( tabSettings[ blockName ] !== undefined ) {\n\t\treturn tabSettings[ blockName ];\n\t}\n\n\t// Use generic default if set over the Gutenberg experiment option.\n\tif ( tabSettings.default !== undefined ) {\n\t\treturn tabSettings.default;\n\t}\n\n\treturn true;\n}\n\nexport default function useInspectorControlsTabs(\n\tblockName,\n\tcontentClientIds,\n\tisSectionBlock,\n\thasBlockStyles\n) {\n\tconst tabs = [];\n\tconst {\n\t\tbindings: bindingsGroup,\n\t\tborder: borderGroup,\n\t\tcolor: colorGroup,\n\t\tcontent: contentGroup,\n\t\tdefault: defaultGroup,\n\t\tdimensions: dimensionsGroup,\n\t\tlist: listGroup,\n\t\tposition: positionGroup,\n\t\tstyles: stylesGroup,\n\t\ttypography: typographyGroup,\n\t\teffects: effectsGroup,\n\t} = InspectorControlsGroups;\n\n\t// List View Tab: If there are any fills for the list group add that tab.\n\tconst listFills = useSlotFills( listGroup.name );\n\tconst hasListFills = !! listFills && listFills.length;\n\n\t// Content Tab: If there are any fills for the content group add that tab.\n\tconst contentFills = useSlotFills( contentGroup.name );\n\tconst hasContentFills = !! contentFills && contentFills.length;\n\n\t// Styles Tab: Add this tab if there are any fills for block supports\n\t// e.g. border, color, spacing, typography, etc.\n\tconst styleFills = [\n\t\t...( useSlotFills( borderGroup.name ) || [] ),\n\t\t...( useSlotFills( colorGroup.name ) || [] ),\n\t\t...( useSlotFills( dimensionsGroup.name ) || [] ),\n\t\t...( useSlotFills( stylesGroup.name ) || [] ),\n\t\t...( useSlotFills( typographyGroup.name ) || [] ),\n\t\t...( useSlotFills( effectsGroup.name ) || [] ),\n\t];\n\tconst hasStyleFills = styleFills.length;\n\n\t// Settings Tab: If we don't have multiple tabs to display\n\t// (i.e. both list view and styles), check only the default and position\n\t// InspectorControls slots. If we have multiple tabs, we'll need to check\n\t// the advanced controls slot as well to ensure they are rendered.\n\tconst advancedFills = [\n\t\t...( useSlotFills( InspectorAdvancedControls.slotName ) || [] ),\n\t\t...( useSlotFills( bindingsGroup.name ) || [] ),\n\t];\n\n\tconst settingsFills = [\n\t\t...( useSlotFills( defaultGroup.name ) || [] ),\n\t\t...( useSlotFills( positionGroup.name ) || [] ),\n\t\t...( hasListFills && hasStyleFills > 1 ? advancedFills : [] ),\n\t];\n\n\t// When the block fields experiment is active, only rely on `hasContentFills`\n\t// to determine whether the content tab to be shown. The tab purely uses slot\n\t// fills in this situation.\n\tconst shouldShowBlockFields =\n\t\twindow?.__experimentalContentOnlyInspectorFields;\n\tconst hasContentTab =\n\t\thasContentFills ||\n\t\t( ! shouldShowBlockFields && contentClientIds?.length );\n\n\tif ( hasContentTab ) {\n\t\ttabs.push( TAB_CONTENT );\n\t}\n\n\t// Add the tabs in the order that they will default to if available.\n\t// List View > Content > Settings > Styles.\n\tif ( hasListFills ) {\n\t\ttabs.push( TAB_LIST_VIEW );\n\t}\n\n\tif (\n\t\tsettingsFills.length ||\n\t\t// Advanced fills show up in settings tab if available or they blend into the default tab, if there's only one tab.\n\t\t( advancedFills.length && ( hasContentTab || hasListFills ) )\n\t) {\n\t\ttabs.push( TAB_SETTINGS );\n\t}\n\n\tif ( hasBlockStyles || hasStyleFills ) {\n\t\ttabs.push( TAB_STYLES );\n\t}\n\n\tconst tabSettings = useSelect( ( select ) => {\n\t\treturn select( blockEditorStore ).getSettings().blockInspectorTabs;\n\t}, [] );\n\n\tconst showTabs = getShowTabs( blockName, tabSettings );\n\treturn showTabs ? tabs : EMPTY_ARRAY;\n}\n"],
|
|
5
|
+
"mappings": ";AAGA,SAAS,8BAA8B,oBAAoB;AAC3D,SAAS,iBAAiB;AAK1B,OAAO,6BAA6B;AACpC,SAAS,iCAAiC;AAC1C,SAAS,eAAe,cAAc,YAAY,mBAAmB;AACrE,SAAS,SAAS,wBAAwB;AAE1C,IAAM,cAAc,CAAC;AAErB,SAAS,YAAa,WAAW,cAAc,CAAC,GAAI;AAEnD,MAAK,YAAa,SAAU,MAAM,QAAY;AAC7C,WAAO,YAAa,SAAU;AAAA,EAC/B;AAGA,MAAK,YAAY,YAAY,QAAY;AACxC,WAAO,YAAY;AAAA,EACpB;AAEA,SAAO;AACR;AAEe,SAAR,yBACN,WACA,kBACA,gBACA,gBACC;AACD,QAAM,OAAO,CAAC;AACd,QAAM;AAAA,IACL,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,SAAS;AAAA,EACV,IAAI;AAGJ,QAAM,YAAY,aAAc,UAAU,IAAK;AAC/C,QAAM,eAAe,CAAC,CAAE,aAAa,UAAU;AAG/C,QAAM,eAAe,aAAc,aAAa,IAAK;AACrD,QAAM,kBAAkB,CAAC,CAAE,gBAAgB,aAAa;AAIxD,QAAM,aAAa;AAAA,IAClB,GAAK,aAAc,YAAY,IAAK,KAAK,CAAC;AAAA,IAC1C,GAAK,aAAc,WAAW,IAAK,KAAK,CAAC;AAAA,IACzC,GAAK,aAAc,gBAAgB,IAAK,KAAK,CAAC;AAAA,IAC9C,GAAK,aAAc,YAAY,IAAK,KAAK,CAAC;AAAA,IAC1C,GAAK,aAAc,gBAAgB,IAAK,KAAK,CAAC;AAAA,IAC9C,GAAK,aAAc,aAAa,IAAK,KAAK,CAAC;AAAA,EAC5C;AACA,QAAM,gBAAgB,WAAW;AAMjC,QAAM,gBAAgB;AAAA,IACrB,GAAK,aAAc,0BAA0B,QAAS,KAAK,CAAC;AAAA,IAC5D,GAAK,aAAc,cAAc,IAAK,KAAK,CAAC;AAAA,EAC7C;AAEA,QAAM,gBAAgB;AAAA,IACrB,GAAK,aAAc,aAAa,IAAK,KAAK,CAAC;AAAA,IAC3C,GAAK,aAAc,cAAc,IAAK,KAAK,CAAC;AAAA,IAC5C,GAAK,gBAAgB,gBAAgB,IAAI,gBAAgB,CAAC;AAAA,EAC3D;AAKA,QAAM,wBACL,QAAQ;AACT,QAAM,gBACL,mBACE,CAAE,yBAAyB,kBAAkB;AAEhD,MAAK,eAAgB;AACpB,SAAK,KAAM,WAAY;AAAA,EACxB;AAIA,MAAK,cAAe;AACnB,SAAK,KAAM,aAAc;AAAA,EAC1B;AAEA,MACC,cAAc;AAAA,EAEZ,cAAc,WAAY,iBAAiB,eAC5C;AACD,SAAK,KAAM,YAAa;AAAA,EACzB;AAEA,MAAK,kBAAkB,eAAgB;AACtC,SAAK,KAAM,UAAW;AAAA,EACvB;AAEA,QAAM,cAAc,UAAW,CAAE,WAAY;AAC5C,WAAO,OAAQ,gBAAiB,EAAE,YAAY,EAAE;AAAA,EACjD,GAAG,CAAC,CAAE;AAEN,QAAM,WAAW,YAAa,WAAW,WAAY;AACrD,SAAO,WAAW,OAAO;AAC1B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -15,7 +15,6 @@ import {
|
|
|
15
15
|
} from "@wordpress/icons";
|
|
16
16
|
import { SPACE, ENTER } from "@wordpress/keycodes";
|
|
17
17
|
import { useSelect } from "@wordpress/data";
|
|
18
|
-
import { hasBlockSupport } from "@wordpress/blocks";
|
|
19
18
|
import BlockIcon from "../block-icon/index.mjs";
|
|
20
19
|
import useBlockDisplayInformation from "../use-block-display-information/index.mjs";
|
|
21
20
|
import useBlockDisplayTitle from "../block-title/use-block-display-title.mjs";
|
|
@@ -47,27 +46,20 @@ function ListViewBlockSelectButton({
|
|
|
47
46
|
context: "list-view"
|
|
48
47
|
});
|
|
49
48
|
const { isLocked } = useBlockLock(clientId);
|
|
50
|
-
const {
|
|
49
|
+
const { isBlockHidden, hasPatternName } = useSelect(
|
|
51
50
|
(select) => {
|
|
52
|
-
const {
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
);
|
|
56
|
-
const blockAttributes = getBlockAttributes(clientId);
|
|
51
|
+
const {
|
|
52
|
+
isBlockHiddenAnywhere: _isBlockHidden,
|
|
53
|
+
getBlockAttributes
|
|
54
|
+
} = unlock(select(blockEditorStore));
|
|
57
55
|
return {
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
"visibility",
|
|
61
|
-
true
|
|
62
|
-
),
|
|
63
|
-
isBlockHidden: areBlocksHiddenAnywhere([clientId]),
|
|
64
|
-
hasPatternName: !!blockAttributes?.metadata?.patternName
|
|
56
|
+
isBlockHidden: _isBlockHidden(clientId),
|
|
57
|
+
hasPatternName: !!getBlockAttributes(clientId)?.metadata?.patternName
|
|
65
58
|
};
|
|
66
59
|
},
|
|
67
60
|
[clientId]
|
|
68
61
|
);
|
|
69
62
|
const shouldShowLockIcon = isLocked;
|
|
70
|
-
const shouldShowBlockVisibilityIcon = canToggleBlockVisibility && isBlockHidden;
|
|
71
63
|
const isSticky = blockInformation?.positionType === "sticky";
|
|
72
64
|
const images = useListViewImages({ clientId, isExpanded });
|
|
73
65
|
const onDragStartHandler = (event) => {
|
|
@@ -139,7 +131,7 @@ function ListViewBlockSelectButton({
|
|
|
139
131
|
))
|
|
140
132
|
}
|
|
141
133
|
) : null,
|
|
142
|
-
|
|
134
|
+
isBlockHidden && /* @__PURE__ */ jsx("span", { className: "block-editor-list-view-block-select-button__block-visibility", children: /* @__PURE__ */ jsx(Icon, { icon: unseen }) }),
|
|
143
135
|
shouldShowLockIcon && /* @__PURE__ */ jsx("span", { className: "block-editor-list-view-block-select-button__lock", children: /* @__PURE__ */ jsx(Icon, { icon: lock }) })
|
|
144
136
|
]
|
|
145
137
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/list-view/block-select-button.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { forwardRef } from '@wordpress/element';\nimport {\n\tIcon,\n\tlockSmall as lock,\n\tpinSmall,\n\tunseen,\n\tsymbol,\n} from '@wordpress/icons';\nimport { SPACE, ENTER } from '@wordpress/keycodes';\nimport { useSelect } from '@wordpress/data';\
|
|
5
|
-
"mappings": ";AAGA,OAAO,UAAU;AAKjB;AAAA,EACC,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,eAAe;AAAA,OACT;AACP,SAAS,kBAAkB;AAC3B;AAAA,EACC;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,OAAO,aAAa;AAC7B,SAAS,iBAAiB;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { forwardRef } from '@wordpress/element';\nimport {\n\tIcon,\n\tlockSmall as lock,\n\tpinSmall,\n\tunseen,\n\tsymbol,\n} from '@wordpress/icons';\nimport { SPACE, ENTER } from '@wordpress/keycodes';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport BlockIcon from '../block-icon';\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport useBlockDisplayTitle from '../block-title/use-block-display-title';\nimport ListViewExpander from './expander';\nimport { useBlockLock } from '../block-lock';\nimport useListViewImages from './use-list-view-images';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\nconst { Badge } = unlock( componentsPrivateApis );\n\nfunction ListViewBlockSelectButton(\n\t{\n\t\tclassName,\n\t\tblock: { clientId },\n\t\tonClick,\n\t\tonContextMenu,\n\t\tonMouseDown,\n\t\tonToggleExpanded,\n\t\ttabIndex,\n\t\tonFocus,\n\t\tonDragStart,\n\t\tonDragEnd,\n\t\tdraggable,\n\t\tisExpanded,\n\t\tariaDescribedBy,\n\t},\n\tref\n) {\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\tconst blockTitle = useBlockDisplayTitle( {\n\t\tclientId,\n\t\tcontext: 'list-view',\n\t} );\n\tconst { isLocked } = useBlockLock( clientId );\n\tconst { isBlockHidden, hasPatternName } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tisBlockHiddenAnywhere: _isBlockHidden,\n\t\t\t\tgetBlockAttributes,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\t\t\treturn {\n\t\t\t\tisBlockHidden: _isBlockHidden( clientId ),\n\t\t\t\thasPatternName:\n\t\t\t\t\t!! getBlockAttributes( clientId )?.metadata?.patternName,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst shouldShowLockIcon = isLocked;\n\tconst isSticky = blockInformation?.positionType === 'sticky';\n\tconst images = useListViewImages( { clientId, isExpanded } );\n\n\t// The `href` attribute triggers the browser's native HTML drag operations.\n\t// When the link is dragged, the element's outerHTML is set in DataTransfer object as text/html.\n\t// We need to clear any HTML drag data to prevent `pasteHandler` from firing\n\t// inside the `useOnBlockDrop` hook.\n\tconst onDragStartHandler = ( event ) => {\n\t\tevent.dataTransfer.clearData();\n\t\tonDragStart?.( event );\n\t};\n\n\t/**\n\t * @param {KeyboardEvent} event\n\t */\n\tfunction onKeyDown( event ) {\n\t\tif ( event.keyCode === ENTER || event.keyCode === SPACE ) {\n\t\t\tonClick( event );\n\t\t}\n\t}\n\n\treturn (\n\t\t<a\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-list-view-block-select-button',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tonClick={ onClick }\n\t\t\tonContextMenu={ onContextMenu }\n\t\t\tonKeyDown={ onKeyDown }\n\t\t\tonMouseDown={ onMouseDown }\n\t\t\tref={ ref }\n\t\t\ttabIndex={ tabIndex }\n\t\t\tonFocus={ onFocus }\n\t\t\tonDragStart={ onDragStartHandler }\n\t\t\tonDragEnd={ onDragEnd }\n\t\t\tdraggable={ draggable }\n\t\t\thref={ `#block-${ clientId }` }\n\t\t\taria-describedby={ ariaDescribedBy }\n\t\t\taria-expanded={ isExpanded }\n\t\t>\n\t\t\t<ListViewExpander onClick={ onToggleExpanded } />\n\t\t\t<BlockIcon\n\t\t\t\ticon={ hasPatternName ? symbol : blockInformation?.icon }\n\t\t\t\tshowColors\n\t\t\t\tcontext=\"list-view\"\n\t\t\t/>\n\t\t\t<HStack\n\t\t\t\talignment=\"center\"\n\t\t\t\tclassName=\"block-editor-list-view-block-select-button__label-wrapper\"\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tspacing={ 1 }\n\t\t\t>\n\t\t\t\t<span className=\"block-editor-list-view-block-select-button__title\">\n\t\t\t\t\t<Truncate ellipsizeMode=\"auto\">{ blockTitle }</Truncate>\n\t\t\t\t</span>\n\t\t\t\t{ blockInformation?.anchor && (\n\t\t\t\t\t<span className=\"block-editor-list-view-block-select-button__anchor-wrapper\">\n\t\t\t\t\t\t<Badge className=\"block-editor-list-view-block-select-button__anchor\">\n\t\t\t\t\t\t\t{ blockInformation.anchor }\n\t\t\t\t\t\t</Badge>\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t{ isSticky && (\n\t\t\t\t\t<span className=\"block-editor-list-view-block-select-button__sticky\">\n\t\t\t\t\t\t<Icon icon={ pinSmall } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t{ images.length ? (\n\t\t\t\t\t<span\n\t\t\t\t\t\tclassName=\"block-editor-list-view-block-select-button__images\"\n\t\t\t\t\t\taria-hidden\n\t\t\t\t\t>\n\t\t\t\t\t\t{ images.map( ( image, index ) => (\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tclassName=\"block-editor-list-view-block-select-button__image\"\n\t\t\t\t\t\t\t\tkey={ image.clientId }\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tbackgroundImage: `url(${ image.url })`,\n\t\t\t\t\t\t\t\t\tzIndex: images.length - index, // Ensure the first image is on top, and subsequent images are behind.\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</span>\n\t\t\t\t) : null }\n\t\t\t\t{ isBlockHidden && (\n\t\t\t\t\t<span className=\"block-editor-list-view-block-select-button__block-visibility\">\n\t\t\t\t\t\t<Icon icon={ unseen } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t{ shouldShowLockIcon && (\n\t\t\t\t\t<span className=\"block-editor-list-view-block-select-button__lock\">\n\t\t\t\t\t\t<Icon icon={ lock } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</a>\n\t);\n}\n\nexport default forwardRef( ListViewBlockSelectButton );\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -19,7 +19,7 @@ import {
|
|
|
19
19
|
memo
|
|
20
20
|
} from "@wordpress/element";
|
|
21
21
|
import { useDispatch, useSelect } from "@wordpress/data";
|
|
22
|
-
import { __ } from "@wordpress/i18n";
|
|
22
|
+
import { __, sprintf } from "@wordpress/i18n";
|
|
23
23
|
import { BACKSPACE, DELETE } from "@wordpress/keycodes";
|
|
24
24
|
import { isShallowEqual } from "@wordpress/is-shallow-equal";
|
|
25
25
|
import { __unstableUseShortcutEventMatch as useShortcutEventMatch } from "@wordpress/keyboard-shortcuts";
|
|
@@ -43,8 +43,9 @@ import { useBlockLock } from "../block-lock/index.mjs";
|
|
|
43
43
|
import AriaReferencedText from "./aria-referenced-text.mjs";
|
|
44
44
|
import { unlock } from "../../lock-unlock.mjs";
|
|
45
45
|
import usePasteStyles from "../use-paste-styles/index.mjs";
|
|
46
|
-
import {
|
|
47
|
-
import {
|
|
46
|
+
import { useBlockVisibility, BlockVisibilityModal } from "../block-visibility/index.mjs";
|
|
47
|
+
import { deviceTypeKey } from "../../store/private-keys.mjs";
|
|
48
|
+
import { BLOCK_VISIBILITY_VIEWPORTS } from "../block-visibility/constants.mjs";
|
|
48
49
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
49
50
|
function ListViewBlock({
|
|
50
51
|
block: { clientId },
|
|
@@ -81,8 +82,7 @@ function ListViewBlock({
|
|
|
81
82
|
replaceBlocks,
|
|
82
83
|
removeBlocks,
|
|
83
84
|
insertAfterBlock,
|
|
84
|
-
insertBeforeBlock
|
|
85
|
-
updateBlockAttributes
|
|
85
|
+
insertBeforeBlock
|
|
86
86
|
} = unlock(useDispatch(blockEditorStore));
|
|
87
87
|
const debouncedToggleBlockHighlight = useDebounce(
|
|
88
88
|
toggleBlockHighlight,
|
|
@@ -104,25 +104,41 @@ function ListViewBlock({
|
|
|
104
104
|
const { getGroupingBlockName } = useSelect(blocksStore);
|
|
105
105
|
const blockInformation = useBlockDisplayInformation(clientId);
|
|
106
106
|
const pasteStyles = usePasteStyles();
|
|
107
|
-
const { block, blockName, allowRightClickOverrides,
|
|
107
|
+
const { block, blockName, allowRightClickOverrides, selectedDeviceType } = useSelect(
|
|
108
108
|
(select) => {
|
|
109
|
-
const {
|
|
110
|
-
getBlock,
|
|
111
|
-
getBlockName: _getBlockName,
|
|
112
|
-
getSettings
|
|
113
|
-
} = select(blockEditorStore);
|
|
114
|
-
const { isBlockHidden: _isBlockHidden } = unlock(
|
|
109
|
+
const { getBlock, getBlockName, getSettings } = unlock(
|
|
115
110
|
select(blockEditorStore)
|
|
116
111
|
);
|
|
117
112
|
return {
|
|
118
113
|
block: getBlock(clientId),
|
|
119
|
-
blockName:
|
|
114
|
+
blockName: getBlockName(clientId),
|
|
120
115
|
allowRightClickOverrides: getSettings().allowRightClickOverrides,
|
|
121
|
-
|
|
116
|
+
selectedDeviceType: getSettings()?.[deviceTypeKey]?.toLowerCase() || BLOCK_VISIBILITY_VIEWPORTS.desktop.value
|
|
122
117
|
};
|
|
123
118
|
},
|
|
124
119
|
[clientId]
|
|
125
120
|
);
|
|
121
|
+
const { isBlockCurrentlyHidden, currentViewport } = useBlockVisibility({
|
|
122
|
+
blockVisibility: block?.attributes?.metadata?.blockVisibility,
|
|
123
|
+
deviceType: selectedDeviceType
|
|
124
|
+
});
|
|
125
|
+
const blockVisibilityDescription = useMemo(() => {
|
|
126
|
+
if (isBlockCurrentlyHidden) {
|
|
127
|
+
if (block?.attributes?.metadata?.blockVisibility === false) {
|
|
128
|
+
return __("Block is hidden");
|
|
129
|
+
}
|
|
130
|
+
return sprintf(
|
|
131
|
+
/* translators: %s: viewport name (Desktop, Tablet, Mobile) */
|
|
132
|
+
__("Block is hidden on %s"),
|
|
133
|
+
BLOCK_VISIBILITY_VIEWPORTS[currentViewport]?.label || currentViewport
|
|
134
|
+
);
|
|
135
|
+
}
|
|
136
|
+
return null;
|
|
137
|
+
}, [
|
|
138
|
+
isBlockCurrentlyHidden,
|
|
139
|
+
block?.attributes?.metadata?.blockVisibility,
|
|
140
|
+
currentViewport
|
|
141
|
+
]);
|
|
126
142
|
const showBlockActions = (
|
|
127
143
|
// When a block hides its toolbar it also hides the block settings menu,
|
|
128
144
|
// since that menu is part of the toolbar in the editor canvas.
|
|
@@ -277,27 +293,7 @@ function ListViewBlock({
|
|
|
277
293
|
if (!supportsBlockVisibility) {
|
|
278
294
|
return;
|
|
279
295
|
}
|
|
280
|
-
|
|
281
|
-
setVisibilityModalClientIds(blocksToUpdate);
|
|
282
|
-
} else {
|
|
283
|
-
const hasHiddenBlock = blocks.some(
|
|
284
|
-
(blockToUpdate) => blockToUpdate.attributes.metadata?.blockVisibility === false
|
|
285
|
-
);
|
|
286
|
-
const attributesByClientId = Object.fromEntries(
|
|
287
|
-
blocks.map(({ clientId: mapClientId, attributes }) => [
|
|
288
|
-
mapClientId,
|
|
289
|
-
{
|
|
290
|
-
metadata: cleanEmptyObject({
|
|
291
|
-
...attributes?.metadata,
|
|
292
|
-
blockVisibility: hasHiddenBlock ? void 0 : false
|
|
293
|
-
})
|
|
294
|
-
}
|
|
295
|
-
])
|
|
296
|
-
);
|
|
297
|
-
updateBlockAttributes(blocksToUpdate, attributesByClientId, {
|
|
298
|
-
uniqueByBlock: true
|
|
299
|
-
});
|
|
300
|
-
}
|
|
296
|
+
setVisibilityModalClientIds(blocksToUpdate);
|
|
301
297
|
}
|
|
302
298
|
}
|
|
303
299
|
const onMouseEnter = useCallback(() => {
|
|
@@ -392,7 +388,6 @@ function ListViewBlock({
|
|
|
392
388
|
blockInformation,
|
|
393
389
|
isLocked
|
|
394
390
|
);
|
|
395
|
-
const blockVisibilityDescription = isBlockHidden ? __("Block is hidden.") : null;
|
|
396
391
|
const hasSiblings = siblingBlockCount > 0;
|
|
397
392
|
const hasRenderedMovers = showBlockMovers && hasSiblings;
|
|
398
393
|
const moverCellClassName = clsx(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/list-view/block.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\thasBlockSupport,\n\tswitchToBlockType,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport {\n\t__experimentalTreeGridCell as TreeGridCell,\n\t__experimentalTreeGridItem as TreeGridItem,\n} from '@wordpress/components';\nimport { useInstanceId, useDebounce } from '@wordpress/compose';\nimport { moreVertical } from '@wordpress/icons';\nimport {\n\tuseCallback,\n\tuseMemo,\n\tuseState,\n\tuseRef,\n\tmemo,\n} from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { BACKSPACE, DELETE } from '@wordpress/keycodes';\nimport { isShallowEqual } from '@wordpress/is-shallow-equal';\nimport { __unstableUseShortcutEventMatch as useShortcutEventMatch } from '@wordpress/keyboard-shortcuts';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport ListViewLeaf from './leaf';\nimport useListViewScrollIntoView from './use-list-view-scroll-into-view';\nimport {\n\tBlockMoverUpButton,\n\tBlockMoverDownButton,\n} from '../block-mover/button';\nimport ListViewBlockContents from './block-contents';\nimport { useListViewContext } from './context';\nimport {\n\tgetBlockPositionDescription,\n\tgetBlockPropertiesDescription,\n\tfocusListItem,\n} from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport { useBlockLock } from '../block-lock';\nimport AriaReferencedText from './aria-referenced-text';\nimport { unlock } from '../../lock-unlock';\nimport usePasteStyles from '../use-paste-styles';\nimport { cleanEmptyObject } from '../../hooks/utils';\nimport { BlockVisibilityModal } from '../block-visibility';\n\nfunction ListViewBlock( {\n\tblock: { clientId },\n\tdisplacement,\n\tisAfterDraggedBlocks,\n\tisDragged,\n\tisNesting,\n\tisSelected,\n\tisBranchSelected,\n\tselectBlock,\n\tposition,\n\tlevel,\n\trowCount,\n\tsiblingBlockCount,\n\tshowBlockMovers,\n\tpath,\n\tisExpanded,\n\tselectedClientIds,\n\tisSyncedBranch,\n} ) {\n\tconst cellRef = useRef( null );\n\tconst rowRef = useRef( null );\n\tconst settingsRef = useRef( null );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ settingsAnchorRect, setSettingsAnchorRect ] = useState();\n\tconst [ visibilityModalClientIds, setVisibilityModalClientIds ] =\n\t\tuseState( null );\n\tconst { isLocked } = useBlockLock( clientId );\n\n\tconst isFirstSelectedBlock =\n\t\tisSelected && selectedClientIds[ 0 ] === clientId;\n\tconst isLastSelectedBlock =\n\t\tisSelected &&\n\t\tselectedClientIds[ selectedClientIds.length - 1 ] === clientId;\n\n\tconst {\n\t\ttoggleBlockHighlight,\n\t\tduplicateBlocks,\n\t\tmultiSelect,\n\t\treplaceBlocks,\n\t\tremoveBlocks,\n\t\tinsertAfterBlock,\n\t\tinsertBeforeBlock,\n\t\tupdateBlockAttributes,\n\t} = unlock( useDispatch( blockEditorStore ) );\n\n\tconst debouncedToggleBlockHighlight = useDebounce(\n\t\ttoggleBlockHighlight,\n\t\t50\n\t);\n\n\tconst {\n\t\tcanInsertBlockType,\n\t\tgetSelectedBlockClientIds,\n\t\tgetPreviousBlockClientId,\n\t\tgetBlockRootClientId,\n\t\tgetBlockOrder,\n\t\tgetBlockParents,\n\t\tgetBlocksByClientId,\n\t\tcanEditBlock,\n\t\tcanMoveBlock,\n\t\tcanRemoveBlocks,\n\t\tisGroupable,\n\t} = useSelect( blockEditorStore );\n\tconst { getGroupingBlockName } = useSelect( blocksStore );\n\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\tconst pasteStyles = usePasteStyles();\n\n\tconst { block, blockName, allowRightClickOverrides, isBlockHidden } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetBlock,\n\t\t\t\t\tgetBlockName: _getBlockName,\n\t\t\t\t\tgetSettings,\n\t\t\t\t} = select( blockEditorStore );\n\t\t\t\tconst { isBlockHidden: _isBlockHidden } = unlock(\n\t\t\t\t\tselect( blockEditorStore )\n\t\t\t\t);\n\n\t\t\t\treturn {\n\t\t\t\t\tblock: getBlock( clientId ),\n\t\t\t\t\tblockName: _getBlockName( clientId ),\n\t\t\t\t\tallowRightClickOverrides:\n\t\t\t\t\t\tgetSettings().allowRightClickOverrides,\n\t\t\t\t\tisBlockHidden: _isBlockHidden( clientId ),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientId ]\n\t\t);\n\n\tconst showBlockActions =\n\t\t// When a block hides its toolbar it also hides the block settings menu,\n\t\t// since that menu is part of the toolbar in the editor canvas.\n\t\t// List View respects this by also hiding the block settings menu.\n\t\thasBlockSupport( blockName, '__experimentalToolbar', true );\n\tconst instanceId = useInstanceId( ListViewBlock );\n\tconst descriptionId = `list-view-block-select-button__description-${ instanceId }`;\n\n\tconst {\n\t\texpand,\n\t\tcollapse,\n\t\tcollapseAll,\n\t\tBlockSettingsMenu,\n\t\tlistViewInstanceId,\n\t\texpandedState,\n\t\tsetInsertedBlock,\n\t\ttreeGridElementRef,\n\t\trootClientId,\n\t} = useListViewContext();\n\tconst isMatch = useShortcutEventMatch();\n\n\t// Determine which blocks to update:\n\t// If the current (focused) block is part of the block selection, use the whole selection.\n\t// If the focused block is not part of the block selection, only update the focused block.\n\tfunction getBlocksToUpdate() {\n\t\tconst selectedBlockClientIds = getSelectedBlockClientIds();\n\t\tconst isUpdatingSelectedBlocks =\n\t\t\tselectedBlockClientIds.includes( clientId );\n\t\tconst firstBlockClientId = isUpdatingSelectedBlocks\n\t\t\t? selectedBlockClientIds[ 0 ]\n\t\t\t: clientId;\n\t\tconst firstBlockRootClientId =\n\t\t\tgetBlockRootClientId( firstBlockClientId );\n\n\t\tconst blocksToUpdate = isUpdatingSelectedBlocks\n\t\t\t? selectedBlockClientIds\n\t\t\t: [ clientId ];\n\n\t\treturn {\n\t\t\tblocksToUpdate,\n\t\t\tfirstBlockClientId,\n\t\t\tfirstBlockRootClientId,\n\t\t\tselectedBlockClientIds,\n\t\t};\n\t}\n\n\t/**\n\t * @param {KeyboardEvent} event\n\t */\n\tasync function onKeyDown( event ) {\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Do not handle events if it comes from modals;\n\t\t// retain the default behavior for these keys.\n\t\tif ( event.target.closest( '[role=dialog]' ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst isDeleteKey = [ BACKSPACE, DELETE ].includes( event.keyCode );\n\n\t\t// If multiple blocks are selected, deselect all blocks when the user\n\t\t// presses the escape key.\n\t\tif (\n\t\t\tisMatch( 'core/block-editor/unselect', event ) &&\n\t\t\tselectedClientIds.length > 0\n\t\t) {\n\t\t\tevent.stopPropagation();\n\t\t\tevent.preventDefault();\n\t\t\tselectBlock( event, undefined );\n\t\t} else if (\n\t\t\tisDeleteKey ||\n\t\t\tisMatch( 'core/block-editor/remove', event )\n\t\t) {\n\t\t\tconst {\n\t\t\t\tblocksToUpdate: blocksToDelete,\n\t\t\t\tfirstBlockClientId,\n\t\t\t\tfirstBlockRootClientId,\n\t\t\t\tselectedBlockClientIds,\n\t\t\t} = getBlocksToUpdate();\n\n\t\t\t// Don't update the selection if the blocks cannot be deleted.\n\t\t\tif ( ! canRemoveBlocks( blocksToDelete ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tlet blockToFocus =\n\t\t\t\tgetPreviousBlockClientId( firstBlockClientId ) ??\n\t\t\t\t// If the previous block is not found (when the first block is deleted),\n\t\t\t\t// fallback to focus the parent block.\n\t\t\t\tfirstBlockRootClientId;\n\n\t\t\tremoveBlocks( blocksToDelete, false );\n\n\t\t\t// Update the selection if the original selection has been removed.\n\t\t\tconst shouldUpdateSelection =\n\t\t\t\tselectedBlockClientIds.length > 0 &&\n\t\t\t\tgetSelectedBlockClientIds().length === 0;\n\n\t\t\t// If there's no previous block nor parent block, focus the first block.\n\t\t\tif ( ! blockToFocus ) {\n\t\t\t\tblockToFocus = getBlockOrder()[ 0 ];\n\t\t\t}\n\n\t\t\tupdateFocusAndSelection( blockToFocus, shouldUpdateSelection );\n\t\t} else if ( isMatch( 'core/block-editor/paste-styles', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tconst blocks = getBlocksByClientId( blocksToUpdate );\n\n\t\t\tpasteStyles( blocks );\n\t\t} else if ( isMatch( 'core/block-editor/duplicate', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate, firstBlockRootClientId } =\n\t\t\t\tgetBlocksToUpdate();\n\n\t\t\tconst canDuplicate = getBlocksByClientId( blocksToUpdate ).every(\n\t\t\t\t( blockToUpdate ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t!! blockToUpdate &&\n\t\t\t\t\t\thasBlockSupport(\n\t\t\t\t\t\t\tblockToUpdate.name,\n\t\t\t\t\t\t\t'multiple',\n\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t) &&\n\t\t\t\t\t\tcanInsertBlockType(\n\t\t\t\t\t\t\tblockToUpdate.name,\n\t\t\t\t\t\t\tfirstBlockRootClientId\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tif ( canDuplicate ) {\n\t\t\t\tconst updatedBlocks = await duplicateBlocks(\n\t\t\t\t\tblocksToUpdate,\n\t\t\t\t\tfalse\n\t\t\t\t);\n\n\t\t\t\tif ( updatedBlocks?.length ) {\n\t\t\t\t\t// If blocks have been duplicated, focus the first duplicated block.\n\t\t\t\t\tupdateFocusAndSelection( updatedBlocks[ 0 ], false );\n\t\t\t\t}\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/insert-before', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tawait insertBeforeBlock( blocksToUpdate[ 0 ] );\n\t\t\tconst newlySelectedBlocks = getSelectedBlockClientIds();\n\n\t\t\t// Focus the first block of the newly inserted blocks, to keep focus within the list view.\n\t\t\tupdateFocusAndSelection( newlySelectedBlocks[ 0 ], false );\n\t\t} else if ( isMatch( 'core/block-editor/insert-after', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tawait insertAfterBlock( blocksToUpdate.at( -1 ) );\n\t\t\tconst newlySelectedBlocks = getSelectedBlockClientIds();\n\n\t\t\t// Focus the first block of the newly inserted blocks, to keep focus within the list view.\n\t\t\tupdateFocusAndSelection( newlySelectedBlocks[ 0 ], false );\n\t\t} else if ( isMatch( 'core/block-editor/select-all', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { firstBlockRootClientId, selectedBlockClientIds } =\n\t\t\t\tgetBlocksToUpdate();\n\t\t\tconst blockClientIds = getBlockOrder( firstBlockRootClientId );\n\t\t\tif ( ! blockClientIds.length ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If we have selected all sibling nested blocks, try selecting up a level.\n\t\t\t// This is a similar implementation to that used by `useSelectAll`.\n\t\t\t// `isShallowEqual` is used for the list view instead of a length check,\n\t\t\t// as the array of siblings of the currently focused block may be a different\n\t\t\t// set of blocks from the current block selection if the user is focused\n\t\t\t// on a different part of the list view from the block selection.\n\t\t\tif ( isShallowEqual( selectedBlockClientIds, blockClientIds ) ) {\n\t\t\t\t// Only select up a level if the first block is not the root block.\n\t\t\t\t// This ensures that the block selection can't break out of the root block\n\t\t\t\t// used by the list view, if the list view is only showing a partial hierarchy.\n\t\t\t\tif (\n\t\t\t\t\tfirstBlockRootClientId &&\n\t\t\t\t\tfirstBlockRootClientId !== rootClientId\n\t\t\t\t) {\n\t\t\t\t\tupdateFocusAndSelection( firstBlockRootClientId, true );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Select all while passing `null` to skip focusing to the editor canvas,\n\t\t\t// and retain focus within the list view.\n\t\t\tmultiSelect(\n\t\t\t\tblockClientIds[ 0 ],\n\t\t\t\tblockClientIds[ blockClientIds.length - 1 ],\n\t\t\t\tnull\n\t\t\t);\n\t\t} else if ( isMatch( 'core/block-editor/collapse-list-view', event ) ) {\n\t\t\tevent.preventDefault();\n\t\t\tconst { firstBlockClientId } = getBlocksToUpdate();\n\t\t\tconst blockParents = getBlockParents( firstBlockClientId, false );\n\t\t\t// Collapse all blocks.\n\t\t\tcollapseAll();\n\t\t\t// Expand all parents of the current block.\n\t\t\texpand( blockParents );\n\t\t} else if ( isMatch( 'core/block-editor/group', event ) ) {\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tif ( blocksToUpdate.length > 1 && isGroupable( blocksToUpdate ) ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst blocks = getBlocksByClientId( blocksToUpdate );\n\t\t\t\tconst groupingBlockName = getGroupingBlockName();\n\t\t\t\tconst newBlocks = switchToBlockType(\n\t\t\t\t\tblocks,\n\t\t\t\t\tgroupingBlockName\n\t\t\t\t);\n\t\t\t\treplaceBlocks( blocksToUpdate, newBlocks );\n\t\t\t\tspeak( __( 'Selected blocks are grouped.' ) );\n\t\t\t\tconst newlySelectedBlocks = getSelectedBlockClientIds();\n\t\t\t\t// Focus the first block of the newly inserted blocks, to keep focus within the list view.\n\t\t\t\tupdateFocusAndSelection( newlySelectedBlocks[ 0 ], false );\n\t\t\t}\n\t\t} else if (\n\t\t\tisMatch( 'core/block-editor/toggle-block-visibility', event )\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tconst blocks = getBlocksByClientId( blocksToUpdate );\n\t\t\tconst supportsBlockVisibility = blocks.every( ( _block ) =>\n\t\t\t\thasBlockSupport( _block.name, 'visibility', true )\n\t\t\t);\n\n\t\t\tif ( ! supportsBlockVisibility ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( window.__experimentalHideBlocksBasedOnScreenSize ) {\n\t\t\t\t// Open the visibility breakpoints modal.\n\t\t\t\tsetVisibilityModalClientIds( blocksToUpdate );\n\t\t\t} else {\n\t\t\t\tconst hasHiddenBlock = blocks.some(\n\t\t\t\t\t( blockToUpdate ) =>\n\t\t\t\t\t\tblockToUpdate.attributes.metadata?.blockVisibility ===\n\t\t\t\t\t\tfalse\n\t\t\t\t);\n\t\t\t\tconst attributesByClientId = Object.fromEntries(\n\t\t\t\t\tblocks.map( ( { clientId: mapClientId, attributes } ) => [\n\t\t\t\t\t\tmapClientId,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tmetadata: cleanEmptyObject( {\n\t\t\t\t\t\t\t\t...attributes?.metadata,\n\t\t\t\t\t\t\t\tblockVisibility: hasHiddenBlock\n\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t: false,\n\t\t\t\t\t\t\t} ),\n\t\t\t\t\t\t},\n\t\t\t\t\t] )\n\t\t\t\t);\n\t\t\t\tupdateBlockAttributes( blocksToUpdate, attributesByClientId, {\n\t\t\t\t\tuniqueByBlock: true,\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onMouseEnter = useCallback( () => {\n\t\tsetIsHovered( true );\n\t\tdebouncedToggleBlockHighlight( clientId, true );\n\t}, [ clientId, setIsHovered, debouncedToggleBlockHighlight ] );\n\tconst onMouseLeave = useCallback( () => {\n\t\tsetIsHovered( false );\n\t\tdebouncedToggleBlockHighlight( clientId, false );\n\t}, [ clientId, setIsHovered, debouncedToggleBlockHighlight ] );\n\n\tconst selectEditorBlock = useCallback(\n\t\t( event ) => {\n\t\t\tselectBlock( event, clientId );\n\t\t\tevent.preventDefault();\n\t\t},\n\t\t[ clientId, selectBlock ]\n\t);\n\n\tconst updateFocusAndSelection = useCallback(\n\t\t( focusClientId, shouldSelectBlock ) => {\n\t\t\tif ( shouldSelectBlock ) {\n\t\t\t\tselectBlock( undefined, focusClientId, null, null );\n\t\t\t}\n\n\t\t\tfocusListItem( focusClientId, treeGridElementRef?.current );\n\t\t},\n\t\t[ selectBlock, treeGridElementRef ]\n\t);\n\n\tconst toggleExpanded = useCallback(\n\t\t( event ) => {\n\t\t\t// Prevent shift+click from opening link in a new window when toggling.\n\t\t\tevent.preventDefault();\n\t\t\tevent.stopPropagation();\n\t\t\tif ( isExpanded === true ) {\n\t\t\t\tcollapse( clientId );\n\t\t\t} else if ( isExpanded === false ) {\n\t\t\t\texpand( clientId );\n\t\t\t}\n\t\t},\n\t\t[ clientId, expand, collapse, isExpanded ]\n\t);\n\n\t// Allow right-clicking an item in the List View to open up the block settings dropdown.\n\tconst onContextMenu = useCallback(\n\t\t( event ) => {\n\t\t\tconst { ownerDocument } = settingsRef?.current || {};\n\t\t\tif ( ! ownerDocument || ! ownerDocument.hasFocus() ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( showBlockActions && allowRightClickOverrides ) {\n\t\t\t\tsettingsRef.current?.click();\n\t\t\t\t// Ensure the position of the settings dropdown is at the cursor.\n\t\t\t\tsetSettingsAnchorRect(\n\t\t\t\t\tnew window.DOMRect( event.clientX, event.clientY, 0, 0 )\n\t\t\t\t);\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ allowRightClickOverrides, settingsRef, showBlockActions ]\n\t);\n\n\tconst onMouseDown = useCallback(\n\t\t( event ) => {\n\t\t\t// Prevent right-click from focusing the block,\n\t\t\t// because focus will be handled when opening the block settings dropdown.\n\t\t\tif ( allowRightClickOverrides && event.button === 2 ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ allowRightClickOverrides ]\n\t);\n\n\tconst settingsPopoverAnchor = useMemo( () => {\n\t\tconst { ownerDocument } = rowRef?.current || {};\n\n\t\t// If no custom position is set, the settings dropdown will be anchored to the\n\t\t// DropdownMenu toggle button.\n\t\tif ( ! settingsAnchorRect || ! ownerDocument ) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\t// Position the settings dropdown at the cursor when right-clicking a block.\n\t\treturn {\n\t\t\townerDocument,\n\t\t\tgetBoundingClientRect() {\n\t\t\t\treturn settingsAnchorRect;\n\t\t\t},\n\t\t};\n\t}, [ settingsAnchorRect ] );\n\n\tconst clearSettingsAnchorRect = useCallback( () => {\n\t\t// Clear the custom position for the settings dropdown so that it is restored back\n\t\t// to being anchored to the DropdownMenu toggle button.\n\t\tsetSettingsAnchorRect( undefined );\n\t}, [ setSettingsAnchorRect ] );\n\n\t// Pass in a ref to the row, so that it can be scrolled\n\t// into view when selected. For long lists, the placeholder for the\n\t// selected block is also observed, within ListViewLeafPlaceholder.\n\tuseListViewScrollIntoView( {\n\t\tisSelected,\n\t\trowItemRef: rowRef,\n\t\tselectedClientIds,\n\t} );\n\n\t// When switching between rendering modes (such as template preview and content only),\n\t// it is possible for a block to temporarily be unavailable. In this case, we should not\n\t// render the leaf, to avoid errors further down the tree.\n\tif ( ! block ) {\n\t\treturn null;\n\t}\n\n\tconst blockPositionDescription = getBlockPositionDescription(\n\t\tposition,\n\t\tsiblingBlockCount,\n\t\tlevel\n\t);\n\n\tconst blockPropertiesDescription = getBlockPropertiesDescription(\n\t\tblockInformation,\n\t\tisLocked\n\t);\n\n\tconst blockVisibilityDescription = isBlockHidden\n\t\t? __( 'Block is hidden.' )\n\t\t: null;\n\n\tconst hasSiblings = siblingBlockCount > 0;\n\tconst hasRenderedMovers = showBlockMovers && hasSiblings;\n\tconst moverCellClassName = clsx(\n\t\t'block-editor-list-view-block__mover-cell',\n\t\t{ 'is-visible': isHovered || isSelected }\n\t);\n\n\tconst listViewBlockSettingsClassName = clsx(\n\t\t'block-editor-list-view-block__menu-cell',\n\t\t{ 'is-visible': isHovered || isFirstSelectedBlock }\n\t);\n\n\tlet colSpan;\n\tif ( hasRenderedMovers ) {\n\t\tcolSpan = 2;\n\t} else if ( ! showBlockActions ) {\n\t\tcolSpan = 3;\n\t}\n\n\tconst classes = clsx( {\n\t\t'is-selected': isSelected,\n\t\t'is-first-selected': isFirstSelectedBlock,\n\t\t'is-last-selected': isLastSelectedBlock,\n\t\t'is-branch-selected': isBranchSelected,\n\t\t'is-synced-branch': isSyncedBranch,\n\t\t'is-dragging': isDragged,\n\t\t'has-single-cell': ! showBlockActions,\n\t\t'is-synced': blockInformation?.isSynced,\n\t\t'is-draggable': canMoveBlock,\n\t\t'is-displacement-normal': displacement === 'normal',\n\t\t'is-displacement-up': displacement === 'up',\n\t\t'is-displacement-down': displacement === 'down',\n\t\t'is-after-dragged-blocks': isAfterDraggedBlocks,\n\t\t'is-nesting': isNesting,\n\t} );\n\n\t// Only include all selected blocks if the currently clicked on block\n\t// is one of the selected blocks. This ensures that if a user attempts\n\t// to alter a block that isn't part of the selection, they're still able\n\t// to do so.\n\tconst dropdownClientIds = selectedClientIds.includes( clientId )\n\t\t? selectedClientIds\n\t\t: [ clientId ];\n\n\t// Detect if there is a block in the canvas currently being edited and multi-selection is not happening.\n\tconst currentlyEditingBlockInCanvas =\n\t\tisSelected && selectedClientIds.length === 1;\n\n\treturn (\n\t\t<ListViewLeaf\n\t\t\tclassName={ classes }\n\t\t\tisDragged={ isDragged }\n\t\t\tonKeyDown={ onKeyDown }\n\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\tonFocus={ onMouseEnter }\n\t\t\tonBlur={ onMouseLeave }\n\t\t\tlevel={ level }\n\t\t\tposition={ position }\n\t\t\trowCount={ rowCount }\n\t\t\tpath={ path }\n\t\t\tid={ `list-view-${ listViewInstanceId }-block-${ clientId }` }\n\t\t\tdata-block={ clientId }\n\t\t\tdata-expanded={ canEditBlock ? isExpanded : undefined }\n\t\t\tref={ rowRef }\n\t\t>\n\t\t\t<TreeGridCell\n\t\t\t\tclassName=\"block-editor-list-view-block__contents-cell\"\n\t\t\t\tcolSpan={ colSpan }\n\t\t\t\tref={ cellRef }\n\t\t\t\taria-selected={ !! isSelected }\n\t\t\t>\n\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t<div className=\"block-editor-list-view-block__contents-container\">\n\t\t\t\t\t\t<ListViewBlockContents\n\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\tonClick={ selectEditorBlock }\n\t\t\t\t\t\t\tonContextMenu={ onContextMenu }\n\t\t\t\t\t\t\tonMouseDown={ onMouseDown }\n\t\t\t\t\t\t\tonToggleExpanded={ toggleExpanded }\n\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\tposition={ position }\n\t\t\t\t\t\t\tsiblingBlockCount={ siblingBlockCount }\n\t\t\t\t\t\t\tlevel={ level }\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\ttabIndex={\n\t\t\t\t\t\t\t\tcurrentlyEditingBlockInCanvas ? 0 : tabIndex\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\tisExpanded={ canEditBlock ? isExpanded : undefined }\n\t\t\t\t\t\t\tselectedClientIds={ selectedClientIds }\n\t\t\t\t\t\t\tariaDescribedBy={ descriptionId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<AriaReferencedText id={ descriptionId }>\n\t\t\t\t\t\t\t{ [\n\t\t\t\t\t\t\t\tblockPositionDescription,\n\t\t\t\t\t\t\t\tblockPropertiesDescription,\n\t\t\t\t\t\t\t\tblockVisibilityDescription,\n\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t.filter( Boolean )\n\t\t\t\t\t\t\t\t.join( ' ' ) }\n\t\t\t\t\t\t</AriaReferencedText>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</TreeGridCell>\n\t\t\t{ hasRenderedMovers && (\n\t\t\t\t<>\n\t\t\t\t\t<TreeGridCell\n\t\t\t\t\t\tclassName={ moverCellClassName }\n\t\t\t\t\t\twithoutGridItem\n\t\t\t\t\t>\n\t\t\t\t\t\t<TreeGridItem>\n\t\t\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t\t\t<BlockMoverUpButton\n\t\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\t\tclientIds={ [ clientId ] }\n\t\t\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</TreeGridItem>\n\t\t\t\t\t\t<TreeGridItem>\n\t\t\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t\t\t<BlockMoverDownButton\n\t\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\t\tclientIds={ [ clientId ] }\n\t\t\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</TreeGridItem>\n\t\t\t\t\t</TreeGridCell>\n\t\t\t\t</>\n\t\t\t) }\n\n\t\t\t{ showBlockActions && BlockSettingsMenu && (\n\t\t\t\t<TreeGridCell\n\t\t\t\t\tclassName={ listViewBlockSettingsClassName }\n\t\t\t\t\taria-selected={ !! isSelected }\n\t\t\t\t\tref={ settingsRef }\n\t\t\t\t>\n\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t<BlockSettingsMenu\n\t\t\t\t\t\t\tclientIds={ dropdownClientIds }\n\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\tlabel={ __( 'Options' ) }\n\t\t\t\t\t\t\tpopoverProps={ {\n\t\t\t\t\t\t\t\tanchor: settingsPopoverAnchor, // Used to position the settings at the cursor on right-click.\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\tref,\n\t\t\t\t\t\t\t\tclassName: 'block-editor-list-view-block__menu',\n\t\t\t\t\t\t\t\ttabIndex,\n\t\t\t\t\t\t\t\tonClick: clearSettingsAnchorRect,\n\t\t\t\t\t\t\t\tonFocus,\n\t\t\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tdisableOpenOnArrowDown\n\t\t\t\t\t\t\texpand={ expand }\n\t\t\t\t\t\t\texpandedState={ expandedState }\n\t\t\t\t\t\t\tsetInsertedBlock={ setInsertedBlock }\n\t\t\t\t\t\t\t__experimentalSelectBlock={\n\t\t\t\t\t\t\t\tupdateFocusAndSelection\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</TreeGridCell>\n\t\t\t) }\n\t\t\t{ visibilityModalClientIds && (\n\t\t\t\t<BlockVisibilityModal\n\t\t\t\t\tclientIds={ visibilityModalClientIds }\n\t\t\t\t\tonClose={ () => setVisibilityModalClientIds( null ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</ListViewLeaf>\n\t);\n}\n\nexport default memo( ListViewBlock );\n"],
|
|
5
|
-
"mappings": ";AAGA,OAAO,UAAU;AAKjB;AAAA,EACC;AAAA,EACA;AAAA,EACA,SAAS;AAAA,OACH;AACP;AAAA,EACC,8BAA8B;AAAA,EAC9B,8BAA8B;AAAA,OACxB;AACP,SAAS,eAAe,mBAAmB;AAC3C,SAAS,oBAAoB;AAC7B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,aAAa,iBAAiB;AACvC,SAAS,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\thasBlockSupport,\n\tswitchToBlockType,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport {\n\t__experimentalTreeGridCell as TreeGridCell,\n\t__experimentalTreeGridItem as TreeGridItem,\n} from '@wordpress/components';\nimport { useInstanceId, useDebounce } from '@wordpress/compose';\nimport { moreVertical } from '@wordpress/icons';\nimport {\n\tuseCallback,\n\tuseMemo,\n\tuseState,\n\tuseRef,\n\tmemo,\n} from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { BACKSPACE, DELETE } from '@wordpress/keycodes';\nimport { isShallowEqual } from '@wordpress/is-shallow-equal';\nimport { __unstableUseShortcutEventMatch as useShortcutEventMatch } from '@wordpress/keyboard-shortcuts';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport ListViewLeaf from './leaf';\nimport useListViewScrollIntoView from './use-list-view-scroll-into-view';\nimport {\n\tBlockMoverUpButton,\n\tBlockMoverDownButton,\n} from '../block-mover/button';\nimport ListViewBlockContents from './block-contents';\nimport { useListViewContext } from './context';\nimport {\n\tgetBlockPositionDescription,\n\tgetBlockPropertiesDescription,\n\tfocusListItem,\n} from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport { useBlockLock } from '../block-lock';\nimport AriaReferencedText from './aria-referenced-text';\nimport { unlock } from '../../lock-unlock';\nimport usePasteStyles from '../use-paste-styles';\nimport { useBlockVisibility, BlockVisibilityModal } from '../block-visibility';\nimport { deviceTypeKey } from '../../store/private-keys';\nimport { BLOCK_VISIBILITY_VIEWPORTS } from '../block-visibility/constants';\n\nfunction ListViewBlock( {\n\tblock: { clientId },\n\tdisplacement,\n\tisAfterDraggedBlocks,\n\tisDragged,\n\tisNesting,\n\tisSelected,\n\tisBranchSelected,\n\tselectBlock,\n\tposition,\n\tlevel,\n\trowCount,\n\tsiblingBlockCount,\n\tshowBlockMovers,\n\tpath,\n\tisExpanded,\n\tselectedClientIds,\n\tisSyncedBranch,\n} ) {\n\tconst cellRef = useRef( null );\n\tconst rowRef = useRef( null );\n\tconst settingsRef = useRef( null );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ settingsAnchorRect, setSettingsAnchorRect ] = useState();\n\tconst [ visibilityModalClientIds, setVisibilityModalClientIds ] =\n\t\tuseState( null );\n\tconst { isLocked } = useBlockLock( clientId );\n\n\tconst isFirstSelectedBlock =\n\t\tisSelected && selectedClientIds[ 0 ] === clientId;\n\tconst isLastSelectedBlock =\n\t\tisSelected &&\n\t\tselectedClientIds[ selectedClientIds.length - 1 ] === clientId;\n\n\tconst {\n\t\ttoggleBlockHighlight,\n\t\tduplicateBlocks,\n\t\tmultiSelect,\n\t\treplaceBlocks,\n\t\tremoveBlocks,\n\t\tinsertAfterBlock,\n\t\tinsertBeforeBlock,\n\t} = unlock( useDispatch( blockEditorStore ) );\n\n\tconst debouncedToggleBlockHighlight = useDebounce(\n\t\ttoggleBlockHighlight,\n\t\t50\n\t);\n\n\tconst {\n\t\tcanInsertBlockType,\n\t\tgetSelectedBlockClientIds,\n\t\tgetPreviousBlockClientId,\n\t\tgetBlockRootClientId,\n\t\tgetBlockOrder,\n\t\tgetBlockParents,\n\t\tgetBlocksByClientId,\n\t\tcanEditBlock,\n\t\tcanMoveBlock,\n\t\tcanRemoveBlocks,\n\t\tisGroupable,\n\t} = useSelect( blockEditorStore );\n\tconst { getGroupingBlockName } = useSelect( blocksStore );\n\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\tconst pasteStyles = usePasteStyles();\n\n\tconst { block, blockName, allowRightClickOverrides, selectedDeviceType } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst { getBlock, getBlockName, getSettings } = unlock(\n\t\t\t\t\tselect( blockEditorStore )\n\t\t\t\t);\n\n\t\t\t\treturn {\n\t\t\t\t\tblock: getBlock( clientId ),\n\t\t\t\t\tblockName: getBlockName( clientId ),\n\t\t\t\t\tallowRightClickOverrides:\n\t\t\t\t\t\tgetSettings().allowRightClickOverrides,\n\t\t\t\t\tselectedDeviceType:\n\t\t\t\t\t\tgetSettings()?.[ deviceTypeKey ]?.toLowerCase() ||\n\t\t\t\t\t\tBLOCK_VISIBILITY_VIEWPORTS.desktop.value,\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientId ]\n\t\t);\n\n\t// Use hook to get current viewport and if block is currently hidden (accurate viewport detection)\n\tconst { isBlockCurrentlyHidden, currentViewport } = useBlockVisibility( {\n\t\tblockVisibility: block?.attributes?.metadata?.blockVisibility,\n\t\tdeviceType: selectedDeviceType,\n\t} );\n\n\t// Determine label based on whether block or parent is hidden\n\tconst blockVisibilityDescription = useMemo( () => {\n\t\tif ( isBlockCurrentlyHidden ) {\n\t\t\tif ( block?.attributes?.metadata?.blockVisibility === false ) {\n\t\t\t\treturn __( 'Block is hidden' );\n\t\t\t}\n\t\t\treturn sprintf(\n\t\t\t\t/* translators: %s: viewport name (Desktop, Tablet, Mobile) */\n\t\t\t\t__( 'Block is hidden on %s' ),\n\t\t\t\tBLOCK_VISIBILITY_VIEWPORTS[ currentViewport ]?.label ||\n\t\t\t\t\tcurrentViewport\n\t\t\t);\n\t\t}\n\t\treturn null;\n\t}, [\n\t\tisBlockCurrentlyHidden,\n\t\tblock?.attributes?.metadata?.blockVisibility,\n\t\tcurrentViewport,\n\t] );\n\n\tconst showBlockActions =\n\t\t// When a block hides its toolbar it also hides the block settings menu,\n\t\t// since that menu is part of the toolbar in the editor canvas.\n\t\t// List View respects this by also hiding the block settings menu.\n\t\thasBlockSupport( blockName, '__experimentalToolbar', true );\n\tconst instanceId = useInstanceId( ListViewBlock );\n\tconst descriptionId = `list-view-block-select-button__description-${ instanceId }`;\n\n\tconst {\n\t\texpand,\n\t\tcollapse,\n\t\tcollapseAll,\n\t\tBlockSettingsMenu,\n\t\tlistViewInstanceId,\n\t\texpandedState,\n\t\tsetInsertedBlock,\n\t\ttreeGridElementRef,\n\t\trootClientId,\n\t} = useListViewContext();\n\tconst isMatch = useShortcutEventMatch();\n\n\t// Determine which blocks to update:\n\t// If the current (focused) block is part of the block selection, use the whole selection.\n\t// If the focused block is not part of the block selection, only update the focused block.\n\tfunction getBlocksToUpdate() {\n\t\tconst selectedBlockClientIds = getSelectedBlockClientIds();\n\t\tconst isUpdatingSelectedBlocks =\n\t\t\tselectedBlockClientIds.includes( clientId );\n\t\tconst firstBlockClientId = isUpdatingSelectedBlocks\n\t\t\t? selectedBlockClientIds[ 0 ]\n\t\t\t: clientId;\n\t\tconst firstBlockRootClientId =\n\t\t\tgetBlockRootClientId( firstBlockClientId );\n\n\t\tconst blocksToUpdate = isUpdatingSelectedBlocks\n\t\t\t? selectedBlockClientIds\n\t\t\t: [ clientId ];\n\n\t\treturn {\n\t\t\tblocksToUpdate,\n\t\t\tfirstBlockClientId,\n\t\t\tfirstBlockRootClientId,\n\t\t\tselectedBlockClientIds,\n\t\t};\n\t}\n\n\t/**\n\t * @param {KeyboardEvent} event\n\t */\n\tasync function onKeyDown( event ) {\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Do not handle events if it comes from modals;\n\t\t// retain the default behavior for these keys.\n\t\tif ( event.target.closest( '[role=dialog]' ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst isDeleteKey = [ BACKSPACE, DELETE ].includes( event.keyCode );\n\n\t\t// If multiple blocks are selected, deselect all blocks when the user\n\t\t// presses the escape key.\n\t\tif (\n\t\t\tisMatch( 'core/block-editor/unselect', event ) &&\n\t\t\tselectedClientIds.length > 0\n\t\t) {\n\t\t\tevent.stopPropagation();\n\t\t\tevent.preventDefault();\n\t\t\tselectBlock( event, undefined );\n\t\t} else if (\n\t\t\tisDeleteKey ||\n\t\t\tisMatch( 'core/block-editor/remove', event )\n\t\t) {\n\t\t\tconst {\n\t\t\t\tblocksToUpdate: blocksToDelete,\n\t\t\t\tfirstBlockClientId,\n\t\t\t\tfirstBlockRootClientId,\n\t\t\t\tselectedBlockClientIds,\n\t\t\t} = getBlocksToUpdate();\n\n\t\t\t// Don't update the selection if the blocks cannot be deleted.\n\t\t\tif ( ! canRemoveBlocks( blocksToDelete ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tlet blockToFocus =\n\t\t\t\tgetPreviousBlockClientId( firstBlockClientId ) ??\n\t\t\t\t// If the previous block is not found (when the first block is deleted),\n\t\t\t\t// fallback to focus the parent block.\n\t\t\t\tfirstBlockRootClientId;\n\n\t\t\tremoveBlocks( blocksToDelete, false );\n\n\t\t\t// Update the selection if the original selection has been removed.\n\t\t\tconst shouldUpdateSelection =\n\t\t\t\tselectedBlockClientIds.length > 0 &&\n\t\t\t\tgetSelectedBlockClientIds().length === 0;\n\n\t\t\t// If there's no previous block nor parent block, focus the first block.\n\t\t\tif ( ! blockToFocus ) {\n\t\t\t\tblockToFocus = getBlockOrder()[ 0 ];\n\t\t\t}\n\n\t\t\tupdateFocusAndSelection( blockToFocus, shouldUpdateSelection );\n\t\t} else if ( isMatch( 'core/block-editor/paste-styles', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tconst blocks = getBlocksByClientId( blocksToUpdate );\n\n\t\t\tpasteStyles( blocks );\n\t\t} else if ( isMatch( 'core/block-editor/duplicate', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate, firstBlockRootClientId } =\n\t\t\t\tgetBlocksToUpdate();\n\n\t\t\tconst canDuplicate = getBlocksByClientId( blocksToUpdate ).every(\n\t\t\t\t( blockToUpdate ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t!! blockToUpdate &&\n\t\t\t\t\t\thasBlockSupport(\n\t\t\t\t\t\t\tblockToUpdate.name,\n\t\t\t\t\t\t\t'multiple',\n\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t) &&\n\t\t\t\t\t\tcanInsertBlockType(\n\t\t\t\t\t\t\tblockToUpdate.name,\n\t\t\t\t\t\t\tfirstBlockRootClientId\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tif ( canDuplicate ) {\n\t\t\t\tconst updatedBlocks = await duplicateBlocks(\n\t\t\t\t\tblocksToUpdate,\n\t\t\t\t\tfalse\n\t\t\t\t);\n\n\t\t\t\tif ( updatedBlocks?.length ) {\n\t\t\t\t\t// If blocks have been duplicated, focus the first duplicated block.\n\t\t\t\t\tupdateFocusAndSelection( updatedBlocks[ 0 ], false );\n\t\t\t\t}\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/insert-before', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tawait insertBeforeBlock( blocksToUpdate[ 0 ] );\n\t\t\tconst newlySelectedBlocks = getSelectedBlockClientIds();\n\n\t\t\t// Focus the first block of the newly inserted blocks, to keep focus within the list view.\n\t\t\tupdateFocusAndSelection( newlySelectedBlocks[ 0 ], false );\n\t\t} else if ( isMatch( 'core/block-editor/insert-after', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tawait insertAfterBlock( blocksToUpdate.at( -1 ) );\n\t\t\tconst newlySelectedBlocks = getSelectedBlockClientIds();\n\n\t\t\t// Focus the first block of the newly inserted blocks, to keep focus within the list view.\n\t\t\tupdateFocusAndSelection( newlySelectedBlocks[ 0 ], false );\n\t\t} else if ( isMatch( 'core/block-editor/select-all', event ) ) {\n\t\t\tevent.preventDefault();\n\n\t\t\tconst { firstBlockRootClientId, selectedBlockClientIds } =\n\t\t\t\tgetBlocksToUpdate();\n\t\t\tconst blockClientIds = getBlockOrder( firstBlockRootClientId );\n\t\t\tif ( ! blockClientIds.length ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If we have selected all sibling nested blocks, try selecting up a level.\n\t\t\t// This is a similar implementation to that used by `useSelectAll`.\n\t\t\t// `isShallowEqual` is used for the list view instead of a length check,\n\t\t\t// as the array of siblings of the currently focused block may be a different\n\t\t\t// set of blocks from the current block selection if the user is focused\n\t\t\t// on a different part of the list view from the block selection.\n\t\t\tif ( isShallowEqual( selectedBlockClientIds, blockClientIds ) ) {\n\t\t\t\t// Only select up a level if the first block is not the root block.\n\t\t\t\t// This ensures that the block selection can't break out of the root block\n\t\t\t\t// used by the list view, if the list view is only showing a partial hierarchy.\n\t\t\t\tif (\n\t\t\t\t\tfirstBlockRootClientId &&\n\t\t\t\t\tfirstBlockRootClientId !== rootClientId\n\t\t\t\t) {\n\t\t\t\t\tupdateFocusAndSelection( firstBlockRootClientId, true );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Select all while passing `null` to skip focusing to the editor canvas,\n\t\t\t// and retain focus within the list view.\n\t\t\tmultiSelect(\n\t\t\t\tblockClientIds[ 0 ],\n\t\t\t\tblockClientIds[ blockClientIds.length - 1 ],\n\t\t\t\tnull\n\t\t\t);\n\t\t} else if ( isMatch( 'core/block-editor/collapse-list-view', event ) ) {\n\t\t\tevent.preventDefault();\n\t\t\tconst { firstBlockClientId } = getBlocksToUpdate();\n\t\t\tconst blockParents = getBlockParents( firstBlockClientId, false );\n\t\t\t// Collapse all blocks.\n\t\t\tcollapseAll();\n\t\t\t// Expand all parents of the current block.\n\t\t\texpand( blockParents );\n\t\t} else if ( isMatch( 'core/block-editor/group', event ) ) {\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tif ( blocksToUpdate.length > 1 && isGroupable( blocksToUpdate ) ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst blocks = getBlocksByClientId( blocksToUpdate );\n\t\t\t\tconst groupingBlockName = getGroupingBlockName();\n\t\t\t\tconst newBlocks = switchToBlockType(\n\t\t\t\t\tblocks,\n\t\t\t\t\tgroupingBlockName\n\t\t\t\t);\n\t\t\t\treplaceBlocks( blocksToUpdate, newBlocks );\n\t\t\t\tspeak( __( 'Selected blocks are grouped.' ) );\n\t\t\t\tconst newlySelectedBlocks = getSelectedBlockClientIds();\n\t\t\t\t// Focus the first block of the newly inserted blocks, to keep focus within the list view.\n\t\t\t\tupdateFocusAndSelection( newlySelectedBlocks[ 0 ], false );\n\t\t\t}\n\t\t} else if (\n\t\t\tisMatch( 'core/block-editor/toggle-block-visibility', event )\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tconst { blocksToUpdate } = getBlocksToUpdate();\n\t\t\tconst blocks = getBlocksByClientId( blocksToUpdate );\n\t\t\tconst supportsBlockVisibility = blocks.every( ( _block ) =>\n\t\t\t\thasBlockSupport( _block.name, 'visibility', true )\n\t\t\t);\n\n\t\t\tif ( ! supportsBlockVisibility ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Open the visibility breakpoints modal.\n\t\t\tsetVisibilityModalClientIds( blocksToUpdate );\n\t\t}\n\t}\n\n\tconst onMouseEnter = useCallback( () => {\n\t\tsetIsHovered( true );\n\t\tdebouncedToggleBlockHighlight( clientId, true );\n\t}, [ clientId, setIsHovered, debouncedToggleBlockHighlight ] );\n\tconst onMouseLeave = useCallback( () => {\n\t\tsetIsHovered( false );\n\t\tdebouncedToggleBlockHighlight( clientId, false );\n\t}, [ clientId, setIsHovered, debouncedToggleBlockHighlight ] );\n\n\tconst selectEditorBlock = useCallback(\n\t\t( event ) => {\n\t\t\tselectBlock( event, clientId );\n\t\t\tevent.preventDefault();\n\t\t},\n\t\t[ clientId, selectBlock ]\n\t);\n\n\tconst updateFocusAndSelection = useCallback(\n\t\t( focusClientId, shouldSelectBlock ) => {\n\t\t\tif ( shouldSelectBlock ) {\n\t\t\t\tselectBlock( undefined, focusClientId, null, null );\n\t\t\t}\n\n\t\t\tfocusListItem( focusClientId, treeGridElementRef?.current );\n\t\t},\n\t\t[ selectBlock, treeGridElementRef ]\n\t);\n\n\tconst toggleExpanded = useCallback(\n\t\t( event ) => {\n\t\t\t// Prevent shift+click from opening link in a new window when toggling.\n\t\t\tevent.preventDefault();\n\t\t\tevent.stopPropagation();\n\t\t\tif ( isExpanded === true ) {\n\t\t\t\tcollapse( clientId );\n\t\t\t} else if ( isExpanded === false ) {\n\t\t\t\texpand( clientId );\n\t\t\t}\n\t\t},\n\t\t[ clientId, expand, collapse, isExpanded ]\n\t);\n\n\t// Allow right-clicking an item in the List View to open up the block settings dropdown.\n\tconst onContextMenu = useCallback(\n\t\t( event ) => {\n\t\t\tconst { ownerDocument } = settingsRef?.current || {};\n\t\t\tif ( ! ownerDocument || ! ownerDocument.hasFocus() ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( showBlockActions && allowRightClickOverrides ) {\n\t\t\t\tsettingsRef.current?.click();\n\t\t\t\t// Ensure the position of the settings dropdown is at the cursor.\n\t\t\t\tsetSettingsAnchorRect(\n\t\t\t\t\tnew window.DOMRect( event.clientX, event.clientY, 0, 0 )\n\t\t\t\t);\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ allowRightClickOverrides, settingsRef, showBlockActions ]\n\t);\n\n\tconst onMouseDown = useCallback(\n\t\t( event ) => {\n\t\t\t// Prevent right-click from focusing the block,\n\t\t\t// because focus will be handled when opening the block settings dropdown.\n\t\t\tif ( allowRightClickOverrides && event.button === 2 ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ allowRightClickOverrides ]\n\t);\n\n\tconst settingsPopoverAnchor = useMemo( () => {\n\t\tconst { ownerDocument } = rowRef?.current || {};\n\n\t\t// If no custom position is set, the settings dropdown will be anchored to the\n\t\t// DropdownMenu toggle button.\n\t\tif ( ! settingsAnchorRect || ! ownerDocument ) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\t// Position the settings dropdown at the cursor when right-clicking a block.\n\t\treturn {\n\t\t\townerDocument,\n\t\t\tgetBoundingClientRect() {\n\t\t\t\treturn settingsAnchorRect;\n\t\t\t},\n\t\t};\n\t}, [ settingsAnchorRect ] );\n\n\tconst clearSettingsAnchorRect = useCallback( () => {\n\t\t// Clear the custom position for the settings dropdown so that it is restored back\n\t\t// to being anchored to the DropdownMenu toggle button.\n\t\tsetSettingsAnchorRect( undefined );\n\t}, [ setSettingsAnchorRect ] );\n\n\t// Pass in a ref to the row, so that it can be scrolled\n\t// into view when selected. For long lists, the placeholder for the\n\t// selected block is also observed, within ListViewLeafPlaceholder.\n\tuseListViewScrollIntoView( {\n\t\tisSelected,\n\t\trowItemRef: rowRef,\n\t\tselectedClientIds,\n\t} );\n\n\t// When switching between rendering modes (such as template preview and content only),\n\t// it is possible for a block to temporarily be unavailable. In this case, we should not\n\t// render the leaf, to avoid errors further down the tree.\n\tif ( ! block ) {\n\t\treturn null;\n\t}\n\n\tconst blockPositionDescription = getBlockPositionDescription(\n\t\tposition,\n\t\tsiblingBlockCount,\n\t\tlevel\n\t);\n\n\tconst blockPropertiesDescription = getBlockPropertiesDescription(\n\t\tblockInformation,\n\t\tisLocked\n\t);\n\n\tconst hasSiblings = siblingBlockCount > 0;\n\tconst hasRenderedMovers = showBlockMovers && hasSiblings;\n\tconst moverCellClassName = clsx(\n\t\t'block-editor-list-view-block__mover-cell',\n\t\t{ 'is-visible': isHovered || isSelected }\n\t);\n\n\tconst listViewBlockSettingsClassName = clsx(\n\t\t'block-editor-list-view-block__menu-cell',\n\t\t{ 'is-visible': isHovered || isFirstSelectedBlock }\n\t);\n\n\tlet colSpan;\n\tif ( hasRenderedMovers ) {\n\t\tcolSpan = 2;\n\t} else if ( ! showBlockActions ) {\n\t\tcolSpan = 3;\n\t}\n\n\tconst classes = clsx( {\n\t\t'is-selected': isSelected,\n\t\t'is-first-selected': isFirstSelectedBlock,\n\t\t'is-last-selected': isLastSelectedBlock,\n\t\t'is-branch-selected': isBranchSelected,\n\t\t'is-synced-branch': isSyncedBranch,\n\t\t'is-dragging': isDragged,\n\t\t'has-single-cell': ! showBlockActions,\n\t\t'is-synced': blockInformation?.isSynced,\n\t\t'is-draggable': canMoveBlock,\n\t\t'is-displacement-normal': displacement === 'normal',\n\t\t'is-displacement-up': displacement === 'up',\n\t\t'is-displacement-down': displacement === 'down',\n\t\t'is-after-dragged-blocks': isAfterDraggedBlocks,\n\t\t'is-nesting': isNesting,\n\t} );\n\n\t// Only include all selected blocks if the currently clicked on block\n\t// is one of the selected blocks. This ensures that if a user attempts\n\t// to alter a block that isn't part of the selection, they're still able\n\t// to do so.\n\tconst dropdownClientIds = selectedClientIds.includes( clientId )\n\t\t? selectedClientIds\n\t\t: [ clientId ];\n\n\t// Detect if there is a block in the canvas currently being edited and multi-selection is not happening.\n\tconst currentlyEditingBlockInCanvas =\n\t\tisSelected && selectedClientIds.length === 1;\n\n\treturn (\n\t\t<ListViewLeaf\n\t\t\tclassName={ classes }\n\t\t\tisDragged={ isDragged }\n\t\t\tonKeyDown={ onKeyDown }\n\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\tonFocus={ onMouseEnter }\n\t\t\tonBlur={ onMouseLeave }\n\t\t\tlevel={ level }\n\t\t\tposition={ position }\n\t\t\trowCount={ rowCount }\n\t\t\tpath={ path }\n\t\t\tid={ `list-view-${ listViewInstanceId }-block-${ clientId }` }\n\t\t\tdata-block={ clientId }\n\t\t\tdata-expanded={ canEditBlock ? isExpanded : undefined }\n\t\t\tref={ rowRef }\n\t\t>\n\t\t\t<TreeGridCell\n\t\t\t\tclassName=\"block-editor-list-view-block__contents-cell\"\n\t\t\t\tcolSpan={ colSpan }\n\t\t\t\tref={ cellRef }\n\t\t\t\taria-selected={ !! isSelected }\n\t\t\t>\n\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t<div className=\"block-editor-list-view-block__contents-container\">\n\t\t\t\t\t\t<ListViewBlockContents\n\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\tonClick={ selectEditorBlock }\n\t\t\t\t\t\t\tonContextMenu={ onContextMenu }\n\t\t\t\t\t\t\tonMouseDown={ onMouseDown }\n\t\t\t\t\t\t\tonToggleExpanded={ toggleExpanded }\n\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\tposition={ position }\n\t\t\t\t\t\t\tsiblingBlockCount={ siblingBlockCount }\n\t\t\t\t\t\t\tlevel={ level }\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\ttabIndex={\n\t\t\t\t\t\t\t\tcurrentlyEditingBlockInCanvas ? 0 : tabIndex\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\tisExpanded={ canEditBlock ? isExpanded : undefined }\n\t\t\t\t\t\t\tselectedClientIds={ selectedClientIds }\n\t\t\t\t\t\t\tariaDescribedBy={ descriptionId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<AriaReferencedText id={ descriptionId }>\n\t\t\t\t\t\t\t{ [\n\t\t\t\t\t\t\t\tblockPositionDescription,\n\t\t\t\t\t\t\t\tblockPropertiesDescription,\n\t\t\t\t\t\t\t\tblockVisibilityDescription,\n\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t.filter( Boolean )\n\t\t\t\t\t\t\t\t.join( ' ' ) }\n\t\t\t\t\t\t</AriaReferencedText>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</TreeGridCell>\n\t\t\t{ hasRenderedMovers && (\n\t\t\t\t<>\n\t\t\t\t\t<TreeGridCell\n\t\t\t\t\t\tclassName={ moverCellClassName }\n\t\t\t\t\t\twithoutGridItem\n\t\t\t\t\t>\n\t\t\t\t\t\t<TreeGridItem>\n\t\t\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t\t\t<BlockMoverUpButton\n\t\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\t\tclientIds={ [ clientId ] }\n\t\t\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</TreeGridItem>\n\t\t\t\t\t\t<TreeGridItem>\n\t\t\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t\t\t<BlockMoverDownButton\n\t\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\t\tclientIds={ [ clientId ] }\n\t\t\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</TreeGridItem>\n\t\t\t\t\t</TreeGridCell>\n\t\t\t\t</>\n\t\t\t) }\n\n\t\t\t{ showBlockActions && BlockSettingsMenu && (\n\t\t\t\t<TreeGridCell\n\t\t\t\t\tclassName={ listViewBlockSettingsClassName }\n\t\t\t\t\taria-selected={ !! isSelected }\n\t\t\t\t\tref={ settingsRef }\n\t\t\t\t>\n\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t<BlockSettingsMenu\n\t\t\t\t\t\t\tclientIds={ dropdownClientIds }\n\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\tlabel={ __( 'Options' ) }\n\t\t\t\t\t\t\tpopoverProps={ {\n\t\t\t\t\t\t\t\tanchor: settingsPopoverAnchor, // Used to position the settings at the cursor on right-click.\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\tref,\n\t\t\t\t\t\t\t\tclassName: 'block-editor-list-view-block__menu',\n\t\t\t\t\t\t\t\ttabIndex,\n\t\t\t\t\t\t\t\tonClick: clearSettingsAnchorRect,\n\t\t\t\t\t\t\t\tonFocus,\n\t\t\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tdisableOpenOnArrowDown\n\t\t\t\t\t\t\texpand={ expand }\n\t\t\t\t\t\t\texpandedState={ expandedState }\n\t\t\t\t\t\t\tsetInsertedBlock={ setInsertedBlock }\n\t\t\t\t\t\t\t__experimentalSelectBlock={\n\t\t\t\t\t\t\t\tupdateFocusAndSelection\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</TreeGridCell>\n\t\t\t) }\n\t\t\t{ visibilityModalClientIds && (\n\t\t\t\t<BlockVisibilityModal\n\t\t\t\t\tclientIds={ visibilityModalClientIds }\n\t\t\t\t\tonClose={ () => setVisibilityModalClientIds( null ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</ListViewLeaf>\n\t);\n}\n\nexport default memo( ListViewBlock );\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -54,7 +54,9 @@ function focusListItem(focusClientId, treeGridElement) {
|
|
|
54
54
|
resolve(null);
|
|
55
55
|
}, 3e3);
|
|
56
56
|
}).then((element) => {
|
|
57
|
-
|
|
57
|
+
if (element && element.isConnected) {
|
|
58
|
+
focus.focusable.find(element)?.[0]?.focus();
|
|
59
|
+
}
|
|
58
60
|
});
|
|
59
61
|
}
|
|
60
62
|
function getDragDisplacementValues({
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/list-view/utils.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { focus } from '@wordpress/dom';\n\nexport const getBlockPositionDescription = ( position, siblingCount, level ) =>\n\tsprintf(\n\t\t/* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */\n\t\t__( 'Block %1$d of %2$d, Level %3$d.' ),\n\t\tposition,\n\t\tsiblingCount,\n\t\tlevel\n\t);\n\nexport const getBlockPropertiesDescription = ( blockInformation, isLocked ) =>\n\t[\n\t\tblockInformation?.positionLabel\n\t\t\t? `${ sprintf(\n\t\t\t\t\t// translators: %s: Position of selected block, e.g. \"Sticky\" or \"Fixed\".\n\t\t\t\t\t__( 'Position: %s' ),\n\t\t\t\t\tblockInformation.positionLabel\n\t\t\t ) }.`\n\t\t\t: undefined,\n\t\tisLocked ? __( 'This block is locked.' ) : undefined,\n\t]\n\t\t.filter( Boolean )\n\t\t.join( ' ' );\n\n/**\n * Returns true if the client ID occurs within the block selection or multi-selection,\n * or false otherwise.\n *\n * @param {string} clientId Block client ID.\n * @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs.\n *\n * @return {boolean} Whether the block is in multi-selection set.\n */\nexport const isClientIdSelected = ( clientId, selectedBlockClientIds ) =>\n\tArray.isArray( selectedBlockClientIds ) && selectedBlockClientIds.length\n\t\t? selectedBlockClientIds.indexOf( clientId ) !== -1\n\t\t: selectedBlockClientIds === clientId;\n\n/**\n * From a start and end clientId of potentially different nesting levels,\n * return the nearest-depth ids that have a common level of depth in the\n * nesting hierarchy. For multiple block selection, this ensure that the\n * selection is always at the same nesting level, and not split across\n * separate levels.\n *\n * @param {string} startId The first id of a selection.\n * @param {string} endId The end id of a selection, usually one that has been clicked on.\n * @param {string[]} startParents An array of ancestor ids for the start id, in descending order.\n * @param {string[]} endParents An array of ancestor ids for the end id, in descending order.\n * @return {Object} An object containing the start and end ids.\n */\nexport function getCommonDepthClientIds(\n\tstartId,\n\tendId,\n\tstartParents,\n\tendParents\n) {\n\tconst startPath = [ ...startParents, startId ];\n\tconst endPath = [ ...endParents, endId ];\n\tconst depth = Math.min( startPath.length, endPath.length ) - 1;\n\tconst start = startPath[ depth ];\n\tconst end = endPath[ depth ];\n\n\treturn {\n\t\tstart,\n\t\tend,\n\t};\n}\n\n/**\n * Shift focus to the list view item associated with a particular clientId.\n *\n * @typedef {import('@wordpress/element').RefObject} RefObject\n *\n * @param {string} focusClientId The client ID of the block to focus.\n * @param {?HTMLElement} treeGridElement The container element to search within.\n */\nexport function focusListItem( focusClientId, treeGridElement ) {\n\tif ( ! treeGridElement ) {\n\t\treturn;\n\t}\n\n\tconst selector = `[role=row][data-block=\"${ focusClientId }\"]`;\n\n\treturn new Promise( ( resolve ) => {\n\t\tif ( treeGridElement.querySelector( selector ) ) {\n\t\t\treturn resolve( treeGridElement.querySelector( selector ) );\n\t\t}\n\n\t\tlet timer = null;\n\t\t// Wait for the element to be added to the DOM.\n\t\tconst observer = new window.MutationObserver( () => {\n\t\t\tif ( treeGridElement.querySelector( selector ) ) {\n\t\t\t\tclearTimeout( timer );\n\t\t\t\tobserver.disconnect();\n\t\t\t\tresolve( treeGridElement.querySelector( selector ) );\n\t\t\t}\n\t\t} );\n\n\t\tobserver.observe( treeGridElement, {\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\t// Stop trying after 3 seconds.\n\t\ttimer = setTimeout( () => {\n\t\t\tobserver.disconnect();\n\t\t\tresolve( null );\n\t\t}, 3000 );\n\t} ).then( ( element ) => {\n\t\t// Focus the first focusable in the row, which is the ListViewBlockSelectButton.\n\t\tfocus.focusable.find( element )?.[ 0 ]?.focus();\n\t} );\n}\n\n/**\n * Get values for the block that flag whether the block should be displaced up or down,\n * whether the block is being nested, and whether the block appears after the dragged\n * blocks. These values are used to determine the class names to apply to the block.\n * The list view rows are displaced visually via CSS rules. Displacement rules:\n * - `normal`: no displacement \u2014 used to apply a translateY of `0` so that the block\n * appears in its original position, and moves to that position smoothly when dragging\n * outside of the list view area.\n * - `up`: the block should be displaced up, creating room beneath the block for the drop indicator.\n * - `down`: the block should be displaced down, creating room above the block for the drop indicator.\n *\n * @param {Object} props\n * @param {Object} props.blockIndexes The indexes of all the blocks in the list view, keyed by clientId.\n * @param {number|null|undefined} props.blockDropTargetIndex The index of the block that the user is dropping to.\n * @param {?string} props.blockDropPosition The position relative to the block that the user is dropping to.\n * @param {string} props.clientId The client id for the current block.\n * @param {?number} props.firstDraggedBlockIndex The index of the first dragged block.\n * @param {?boolean} props.isDragged Whether the current block is being dragged. Dragged blocks skip displacement.\n * @return {Object} An object containing the `displacement`, `isAfterDraggedBlocks` and `isNesting` values.\n */\nexport function getDragDisplacementValues( {\n\tblockIndexes,\n\tblockDropTargetIndex,\n\tblockDropPosition,\n\tclientId,\n\tfirstDraggedBlockIndex,\n\tisDragged,\n} ) {\n\tlet displacement;\n\tlet isNesting;\n\tlet isAfterDraggedBlocks;\n\n\tif ( ! isDragged ) {\n\t\tisNesting = false;\n\t\tconst thisBlockIndex = blockIndexes[ clientId ];\n\t\tisAfterDraggedBlocks = thisBlockIndex > firstDraggedBlockIndex;\n\n\t\t// Determine where to displace the position of the current block, relative\n\t\t// to the blocks being dragged (in their original position) and the drop target\n\t\t// (the position where a user is currently dragging the blocks to).\n\t\tif (\n\t\t\tblockDropTargetIndex !== undefined &&\n\t\t\tblockDropTargetIndex !== null &&\n\t\t\tfirstDraggedBlockIndex !== undefined\n\t\t) {\n\t\t\t// If the block is being dragged and there is a valid drop target,\n\t\t\t// determine if the block being rendered should be displaced up or down.\n\n\t\t\tif ( thisBlockIndex !== undefined ) {\n\t\t\t\tif (\n\t\t\t\t\tthisBlockIndex >= firstDraggedBlockIndex &&\n\t\t\t\t\tthisBlockIndex < blockDropTargetIndex\n\t\t\t\t) {\n\t\t\t\t\t// If the current block appears after the set of dragged blocks\n\t\t\t\t\t// (in their original position), but is before the drop target,\n\t\t\t\t\t// then the current block should be displaced up.\n\t\t\t\t\tdisplacement = 'up';\n\t\t\t\t} else if (\n\t\t\t\t\tthisBlockIndex < firstDraggedBlockIndex &&\n\t\t\t\t\tthisBlockIndex >= blockDropTargetIndex\n\t\t\t\t) {\n\t\t\t\t\t// If the current block appears before the set of dragged blocks\n\t\t\t\t\t// (in their original position), but is after the drop target,\n\t\t\t\t\t// then the current block should be displaced down.\n\t\t\t\t\tdisplacement = 'down';\n\t\t\t\t} else {\n\t\t\t\t\tdisplacement = 'normal';\n\t\t\t\t}\n\t\t\t\tisNesting =\n\t\t\t\t\ttypeof blockDropTargetIndex === 'number' &&\n\t\t\t\t\tblockDropTargetIndex - 1 === thisBlockIndex &&\n\t\t\t\t\tblockDropPosition === 'inside';\n\t\t\t}\n\t\t} else if (\n\t\t\tblockDropTargetIndex === null &&\n\t\t\tfirstDraggedBlockIndex !== undefined\n\t\t) {\n\t\t\t// A `null` value for `blockDropTargetIndex` indicates that the\n\t\t\t// drop target is outside of the valid areas within the list view.\n\t\t\t// In this case, the drag is still active, but as there is no\n\t\t\t// valid drop target, we should remove the gap indicating where\n\t\t\t// the block would be inserted.\n\t\t\tif (\n\t\t\t\tthisBlockIndex !== undefined &&\n\t\t\t\tthisBlockIndex >= firstDraggedBlockIndex\n\t\t\t) {\n\t\t\t\tdisplacement = 'up';\n\t\t\t} else {\n\t\t\t\tdisplacement = 'normal';\n\t\t\t}\n\t\t} else if (\n\t\t\tblockDropTargetIndex !== undefined &&\n\t\t\tblockDropTargetIndex !== null &&\n\t\t\tfirstDraggedBlockIndex === undefined\n\t\t) {\n\t\t\t// If the blockdrop target is defined, but there are no dragged blocks,\n\t\t\t// then the block should be displaced relative to the drop target.\n\t\t\tif ( thisBlockIndex !== undefined ) {\n\t\t\t\tif ( thisBlockIndex < blockDropTargetIndex ) {\n\t\t\t\t\tdisplacement = 'normal';\n\t\t\t\t} else {\n\t\t\t\t\tdisplacement = 'down';\n\t\t\t\t}\n\t\t\t}\n\t\t} else if ( blockDropTargetIndex === null ) {\n\t\t\tdisplacement = 'normal';\n\t\t}\n\t}\n\n\treturn {\n\t\tdisplacement,\n\t\tisNesting,\n\t\tisAfterDraggedBlocks,\n\t};\n}\n"],
|
|
5
|
-
"mappings": ";AAGA,SAAS,IAAI,eAAe;AAC5B,SAAS,aAAa;AAEf,IAAM,8BAA8B,CAAE,UAAU,cAAc,UACpE;AAAA;AAAA,EAEC,GAAI,iCAAkC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AACD;AAEM,IAAM,gCAAgC,CAAE,kBAAkB,aAChE;AAAA,EACC,kBAAkB,gBACf,GAAI;AAAA;AAAA,IAEJ,GAAI,cAAe;AAAA,IACnB,iBAAiB;AAAA,EACjB,CAAE,MACF;AAAA,EACH,WAAW,GAAI,uBAAwB,IAAI;AAC5C,EACE,OAAQ,OAAQ,EAChB,KAAM,GAAI;AAWN,IAAM,qBAAqB,CAAE,UAAU,2BAC7C,MAAM,QAAS,sBAAuB,KAAK,uBAAuB,SAC/D,uBAAuB,QAAS,QAAS,MAAM,KAC/C,2BAA2B;AAexB,SAAS,wBACf,SACA,OACA,cACA,YACC;AACD,QAAM,YAAY,CAAE,GAAG,cAAc,OAAQ;AAC7C,QAAM,UAAU,CAAE,GAAG,YAAY,KAAM;AACvC,QAAM,QAAQ,KAAK,IAAK,UAAU,QAAQ,QAAQ,MAAO,IAAI;AAC7D,QAAM,QAAQ,UAAW,KAAM;AAC/B,QAAM,MAAM,QAAS,KAAM;AAE3B,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;AAUO,SAAS,cAAe,eAAe,iBAAkB;AAC/D,MAAK,CAAE,iBAAkB;AACxB;AAAA,EACD;AAEA,QAAM,WAAW,0BAA2B,aAAc;AAE1D,SAAO,IAAI,QAAS,CAAE,YAAa;AAClC,QAAK,gBAAgB,cAAe,QAAS,GAAI;AAChD,aAAO,QAAS,gBAAgB,cAAe,QAAS,CAAE;AAAA,IAC3D;AAEA,QAAI,QAAQ;AAEZ,UAAM,WAAW,IAAI,OAAO,iBAAkB,MAAM;AACnD,UAAK,gBAAgB,cAAe,QAAS,GAAI;AAChD,qBAAc,KAAM;AACpB,iBAAS,WAAW;AACpB,gBAAS,gBAAgB,cAAe,QAAS,CAAE;AAAA,MACpD;AAAA,IACD,CAAE;AAEF,aAAS,QAAS,iBAAiB;AAAA,MAClC,WAAW;AAAA,MACX,SAAS;AAAA,IACV,CAAE;AAGF,YAAQ,WAAY,MAAM;AACzB,eAAS,WAAW;AACpB,cAAS,IAAK;AAAA,IACf,GAAG,GAAK;AAAA,EACT,CAAE,EAAE,KAAM,CAAE,YAAa;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { focus } from '@wordpress/dom';\n\nexport const getBlockPositionDescription = ( position, siblingCount, level ) =>\n\tsprintf(\n\t\t/* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */\n\t\t__( 'Block %1$d of %2$d, Level %3$d.' ),\n\t\tposition,\n\t\tsiblingCount,\n\t\tlevel\n\t);\n\nexport const getBlockPropertiesDescription = ( blockInformation, isLocked ) =>\n\t[\n\t\tblockInformation?.positionLabel\n\t\t\t? `${ sprintf(\n\t\t\t\t\t// translators: %s: Position of selected block, e.g. \"Sticky\" or \"Fixed\".\n\t\t\t\t\t__( 'Position: %s' ),\n\t\t\t\t\tblockInformation.positionLabel\n\t\t\t ) }.`\n\t\t\t: undefined,\n\t\tisLocked ? __( 'This block is locked.' ) : undefined,\n\t]\n\t\t.filter( Boolean )\n\t\t.join( ' ' );\n\n/**\n * Returns true if the client ID occurs within the block selection or multi-selection,\n * or false otherwise.\n *\n * @param {string} clientId Block client ID.\n * @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs.\n *\n * @return {boolean} Whether the block is in multi-selection set.\n */\nexport const isClientIdSelected = ( clientId, selectedBlockClientIds ) =>\n\tArray.isArray( selectedBlockClientIds ) && selectedBlockClientIds.length\n\t\t? selectedBlockClientIds.indexOf( clientId ) !== -1\n\t\t: selectedBlockClientIds === clientId;\n\n/**\n * From a start and end clientId of potentially different nesting levels,\n * return the nearest-depth ids that have a common level of depth in the\n * nesting hierarchy. For multiple block selection, this ensure that the\n * selection is always at the same nesting level, and not split across\n * separate levels.\n *\n * @param {string} startId The first id of a selection.\n * @param {string} endId The end id of a selection, usually one that has been clicked on.\n * @param {string[]} startParents An array of ancestor ids for the start id, in descending order.\n * @param {string[]} endParents An array of ancestor ids for the end id, in descending order.\n * @return {Object} An object containing the start and end ids.\n */\nexport function getCommonDepthClientIds(\n\tstartId,\n\tendId,\n\tstartParents,\n\tendParents\n) {\n\tconst startPath = [ ...startParents, startId ];\n\tconst endPath = [ ...endParents, endId ];\n\tconst depth = Math.min( startPath.length, endPath.length ) - 1;\n\tconst start = startPath[ depth ];\n\tconst end = endPath[ depth ];\n\n\treturn {\n\t\tstart,\n\t\tend,\n\t};\n}\n\n/**\n * Shift focus to the list view item associated with a particular clientId.\n *\n * @typedef {import('@wordpress/element').RefObject} RefObject\n *\n * @param {string} focusClientId The client ID of the block to focus.\n * @param {?HTMLElement} treeGridElement The container element to search within.\n */\nexport function focusListItem( focusClientId, treeGridElement ) {\n\tif ( ! treeGridElement ) {\n\t\treturn;\n\t}\n\n\tconst selector = `[role=row][data-block=\"${ focusClientId }\"]`;\n\n\treturn new Promise( ( resolve ) => {\n\t\tif ( treeGridElement.querySelector( selector ) ) {\n\t\t\treturn resolve( treeGridElement.querySelector( selector ) );\n\t\t}\n\n\t\tlet timer = null;\n\t\t// Wait for the element to be added to the DOM.\n\t\tconst observer = new window.MutationObserver( () => {\n\t\t\tif ( treeGridElement.querySelector( selector ) ) {\n\t\t\t\tclearTimeout( timer );\n\t\t\t\tobserver.disconnect();\n\t\t\t\tresolve( treeGridElement.querySelector( selector ) );\n\t\t\t}\n\t\t} );\n\n\t\tobserver.observe( treeGridElement, {\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\t// Stop trying after 3 seconds.\n\t\ttimer = setTimeout( () => {\n\t\t\tobserver.disconnect();\n\t\t\tresolve( null );\n\t\t}, 3000 );\n\t} ).then( ( element ) => {\n\t\tif ( element && element.isConnected ) {\n\t\t\t// Focus the first focusable in the row, which is the ListViewBlockSelectButton.\n\t\t\tfocus.focusable.find( element )?.[ 0 ]?.focus();\n\t\t}\n\t} );\n}\n\n/**\n * Get values for the block that flag whether the block should be displaced up or down,\n * whether the block is being nested, and whether the block appears after the dragged\n * blocks. These values are used to determine the class names to apply to the block.\n * The list view rows are displaced visually via CSS rules. Displacement rules:\n * - `normal`: no displacement \u2014 used to apply a translateY of `0` so that the block\n * appears in its original position, and moves to that position smoothly when dragging\n * outside of the list view area.\n * - `up`: the block should be displaced up, creating room beneath the block for the drop indicator.\n * - `down`: the block should be displaced down, creating room above the block for the drop indicator.\n *\n * @param {Object} props\n * @param {Object} props.blockIndexes The indexes of all the blocks in the list view, keyed by clientId.\n * @param {number|null|undefined} props.blockDropTargetIndex The index of the block that the user is dropping to.\n * @param {?string} props.blockDropPosition The position relative to the block that the user is dropping to.\n * @param {string} props.clientId The client id for the current block.\n * @param {?number} props.firstDraggedBlockIndex The index of the first dragged block.\n * @param {?boolean} props.isDragged Whether the current block is being dragged. Dragged blocks skip displacement.\n * @return {Object} An object containing the `displacement`, `isAfterDraggedBlocks` and `isNesting` values.\n */\nexport function getDragDisplacementValues( {\n\tblockIndexes,\n\tblockDropTargetIndex,\n\tblockDropPosition,\n\tclientId,\n\tfirstDraggedBlockIndex,\n\tisDragged,\n} ) {\n\tlet displacement;\n\tlet isNesting;\n\tlet isAfterDraggedBlocks;\n\n\tif ( ! isDragged ) {\n\t\tisNesting = false;\n\t\tconst thisBlockIndex = blockIndexes[ clientId ];\n\t\tisAfterDraggedBlocks = thisBlockIndex > firstDraggedBlockIndex;\n\n\t\t// Determine where to displace the position of the current block, relative\n\t\t// to the blocks being dragged (in their original position) and the drop target\n\t\t// (the position where a user is currently dragging the blocks to).\n\t\tif (\n\t\t\tblockDropTargetIndex !== undefined &&\n\t\t\tblockDropTargetIndex !== null &&\n\t\t\tfirstDraggedBlockIndex !== undefined\n\t\t) {\n\t\t\t// If the block is being dragged and there is a valid drop target,\n\t\t\t// determine if the block being rendered should be displaced up or down.\n\n\t\t\tif ( thisBlockIndex !== undefined ) {\n\t\t\t\tif (\n\t\t\t\t\tthisBlockIndex >= firstDraggedBlockIndex &&\n\t\t\t\t\tthisBlockIndex < blockDropTargetIndex\n\t\t\t\t) {\n\t\t\t\t\t// If the current block appears after the set of dragged blocks\n\t\t\t\t\t// (in their original position), but is before the drop target,\n\t\t\t\t\t// then the current block should be displaced up.\n\t\t\t\t\tdisplacement = 'up';\n\t\t\t\t} else if (\n\t\t\t\t\tthisBlockIndex < firstDraggedBlockIndex &&\n\t\t\t\t\tthisBlockIndex >= blockDropTargetIndex\n\t\t\t\t) {\n\t\t\t\t\t// If the current block appears before the set of dragged blocks\n\t\t\t\t\t// (in their original position), but is after the drop target,\n\t\t\t\t\t// then the current block should be displaced down.\n\t\t\t\t\tdisplacement = 'down';\n\t\t\t\t} else {\n\t\t\t\t\tdisplacement = 'normal';\n\t\t\t\t}\n\t\t\t\tisNesting =\n\t\t\t\t\ttypeof blockDropTargetIndex === 'number' &&\n\t\t\t\t\tblockDropTargetIndex - 1 === thisBlockIndex &&\n\t\t\t\t\tblockDropPosition === 'inside';\n\t\t\t}\n\t\t} else if (\n\t\t\tblockDropTargetIndex === null &&\n\t\t\tfirstDraggedBlockIndex !== undefined\n\t\t) {\n\t\t\t// A `null` value for `blockDropTargetIndex` indicates that the\n\t\t\t// drop target is outside of the valid areas within the list view.\n\t\t\t// In this case, the drag is still active, but as there is no\n\t\t\t// valid drop target, we should remove the gap indicating where\n\t\t\t// the block would be inserted.\n\t\t\tif (\n\t\t\t\tthisBlockIndex !== undefined &&\n\t\t\t\tthisBlockIndex >= firstDraggedBlockIndex\n\t\t\t) {\n\t\t\t\tdisplacement = 'up';\n\t\t\t} else {\n\t\t\t\tdisplacement = 'normal';\n\t\t\t}\n\t\t} else if (\n\t\t\tblockDropTargetIndex !== undefined &&\n\t\t\tblockDropTargetIndex !== null &&\n\t\t\tfirstDraggedBlockIndex === undefined\n\t\t) {\n\t\t\t// If the blockdrop target is defined, but there are no dragged blocks,\n\t\t\t// then the block should be displaced relative to the drop target.\n\t\t\tif ( thisBlockIndex !== undefined ) {\n\t\t\t\tif ( thisBlockIndex < blockDropTargetIndex ) {\n\t\t\t\t\tdisplacement = 'normal';\n\t\t\t\t} else {\n\t\t\t\t\tdisplacement = 'down';\n\t\t\t\t}\n\t\t\t}\n\t\t} else if ( blockDropTargetIndex === null ) {\n\t\t\tdisplacement = 'normal';\n\t\t}\n\t}\n\n\treturn {\n\t\tdisplacement,\n\t\tisNesting,\n\t\tisAfterDraggedBlocks,\n\t};\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -43,16 +43,15 @@ var ExperimentalBlockEditorProvider = withRegistryProvider(
|
|
|
43
43
|
stripExperimentalSettings = false
|
|
44
44
|
} = props;
|
|
45
45
|
const mediaUploadSettings = useMediaUploadSettings(_settings);
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
() => ({
|
|
46
|
+
const settings = useMemo(() => {
|
|
47
|
+
if (window.__experimentalMediaProcessing && _settings?.mediaUpload) {
|
|
48
|
+
return {
|
|
50
49
|
..._settings,
|
|
51
50
|
mediaUpload: mediaUpload.bind(null, registry)
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
}
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
return _settings;
|
|
54
|
+
}, [_settings, registry]);
|
|
56
55
|
const { __experimentalUpdateSettings } = unlock(
|
|
57
56
|
useDispatch(blockEditorStore)
|
|
58
57
|
);
|