@wordpress/block-editor
Version:
8 lines (7 loc) • 12.6 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/components/list-view/branch.js"],
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalTreeGridRow as TreeGridRow,\n\t__experimentalTreeGridCell as TreeGridCell,\n} from '@wordpress/components';\nimport { memo, useRef } from '@wordpress/element';\nimport { AsyncModeProvider, useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { Appender } from './appender';\nimport ListViewBlock from './block';\nimport { useListViewContext } from './context';\nimport { getDragDisplacementValues, isClientIdSelected } from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport useBlockDisplayInformation from '../use-block-display-information';\n\n/**\n * Given a block, returns the total number of blocks in that subtree. This is used to help determine\n * the list position of a block.\n *\n * When a block is collapsed, we do not count their children as part of that total. In the current drag\n * implementation dragged blocks and their children are not counted.\n *\n * @param {Object} block block tree\n * @param {Object} expandedState state that notes which branches are collapsed\n * @param {Array} draggedClientIds a list of dragged client ids\n * @param {boolean} isExpandedByDefault flag to determine the default fallback expanded state.\n * @return {number} block count\n */\nfunction countBlocks(\n\tblock,\n\texpandedState,\n\tdraggedClientIds,\n\tisExpandedByDefault\n) {\n\tconst isDragged = draggedClientIds?.includes( block.clientId );\n\tif ( isDragged ) {\n\t\treturn 0;\n\t}\n\tconst isExpanded = expandedState[ block.clientId ] ?? isExpandedByDefault;\n\n\tif ( isExpanded ) {\n\t\treturn (\n\t\t\t1 +\n\t\t\tblock.innerBlocks.reduce(\n\t\t\t\tcountReducer(\n\t\t\t\t\texpandedState,\n\t\t\t\t\tdraggedClientIds,\n\t\t\t\t\tisExpandedByDefault\n\t\t\t\t),\n\t\t\t\t0\n\t\t\t)\n\t\t);\n\t}\n\treturn 1;\n}\nconst countReducer =\n\t( expandedState, draggedClientIds, isExpandedByDefault ) =>\n\t( count, block ) => {\n\t\tconst isDragged = draggedClientIds?.includes( block.clientId );\n\t\tif ( isDragged ) {\n\t\t\treturn count;\n\t\t}\n\t\tconst isExpanded =\n\t\t\texpandedState[ block.clientId ] ?? isExpandedByDefault;\n\t\tif ( isExpanded && block.innerBlocks.length > 0 ) {\n\t\t\treturn (\n\t\t\t\tcount +\n\t\t\t\tcountBlocks(\n\t\t\t\t\tblock,\n\t\t\t\t\texpandedState,\n\t\t\t\t\tdraggedClientIds,\n\t\t\t\t\tisExpandedByDefault\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\t\treturn count + 1;\n\t};\n\nconst noop = () => {};\n\nfunction ListViewBranch( props ) {\n\tconst {\n\t\tblocks,\n\t\tselectBlock = noop,\n\t\tshowBlockMovers,\n\t\tselectedClientIds,\n\t\tlevel = 1,\n\t\tpath = '',\n\t\tisBranchSelected = false,\n\t\tlistPosition = 0,\n\t\tfixedListWindow,\n\t\tisExpanded,\n\t\tparentId,\n\t\tshouldShowInnerBlocks = true,\n\t\tisSyncedBranch = false,\n\t\tshowAppender: showAppenderProp = true,\n\t} = props;\n\n\tconst parentBlockInformation = useBlockDisplayInformation( parentId );\n\tconst syncedBranch = isSyncedBranch || !! parentBlockInformation?.isSynced;\n\n\tconst canParentExpand = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! parentId ) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\treturn select( blockEditorStore ).canEditBlock( parentId );\n\t\t},\n\t\t[ parentId ]\n\t);\n\n\tconst {\n\t\tblockDropPosition,\n\t\tblockDropTargetIndex,\n\t\tfirstDraggedBlockIndex,\n\t\tblockIndexes,\n\t\texpandedState,\n\t\tdraggedClientIds,\n\t} = useListViewContext();\n\n\tconst nextPositionRef = useRef();\n\n\tif ( ! canParentExpand ) {\n\t\treturn null;\n\t}\n\n\t// Only show the appender at the first level.\n\tconst showAppender = showAppenderProp && level === 1;\n\tconst filteredBlocks = blocks.filter( Boolean );\n\tconst blockCount = filteredBlocks.length;\n\t// The appender means an extra row in List View, so add 1 to the row count.\n\tconst rowCount = showAppender ? blockCount + 1 : blockCount;\n\tnextPositionRef.current = listPosition;\n\n\treturn (\n\t\t<>\n\t\t\t{ filteredBlocks.map( ( block, index ) => {\n\t\t\t\tconst { clientId, innerBlocks } = block;\n\n\t\t\t\tif ( index > 0 ) {\n\t\t\t\t\tnextPositionRef.current += countBlocks(\n\t\t\t\t\t\tfilteredBlocks[ index - 1 ],\n\t\t\t\t\t\texpandedState,\n\t\t\t\t\t\tdraggedClientIds,\n\t\t\t\t\t\tisExpanded\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\tconst isDragged = !! draggedClientIds?.includes( clientId );\n\n\t\t\t\t// Determine the displacement of the block while dragging. This\n\t\t\t\t// works out whether the current block should be displaced up or\n\t\t\t\t// down, relative to the dragged blocks and the drop target.\n\t\t\t\tconst { displacement, isAfterDraggedBlocks, isNesting } =\n\t\t\t\t\tgetDragDisplacementValues( {\n\t\t\t\t\t\tblockIndexes,\n\t\t\t\t\t\tblockDropTargetIndex,\n\t\t\t\t\t\tblockDropPosition,\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\tfirstDraggedBlockIndex,\n\t\t\t\t\t\tisDragged,\n\t\t\t\t\t} );\n\n\t\t\t\tconst { itemInView } = fixedListWindow;\n\t\t\t\tconst blockInView = itemInView( nextPositionRef.current );\n\n\t\t\t\tconst position = index + 1;\n\t\t\t\tconst updatedPath =\n\t\t\t\t\tpath.length > 0\n\t\t\t\t\t\t? `${ path }_${ position }`\n\t\t\t\t\t\t: `${ position }`;\n\t\t\t\tconst hasNestedBlocks = !! innerBlocks?.length;\n\n\t\t\t\tconst shouldExpand =\n\t\t\t\t\thasNestedBlocks && shouldShowInnerBlocks\n\t\t\t\t\t\t? expandedState[ clientId ] ?? isExpanded\n\t\t\t\t\t\t: undefined;\n\n\t\t\t\t// Make updates to the selected or dragged blocks synchronous,\n\t\t\t\t// but asynchronous for any other block.\n\t\t\t\tconst isSelected = isClientIdSelected(\n\t\t\t\t\tclientId,\n\t\t\t\t\tselectedClientIds\n\t\t\t\t);\n\t\t\t\tconst isSelectedBranch =\n\t\t\t\t\tisBranchSelected || ( isSelected && hasNestedBlocks );\n\n\t\t\t\t// To avoid performance issues, we only render blocks that are in view,\n\t\t\t\t// or blocks that are selected or dragged. If a block is selected,\n\t\t\t\t// it is only counted if it is the first of the block selection.\n\t\t\t\t// This prevents the entire tree from being rendered when a branch is\n\t\t\t\t// selected, or a user selects all blocks, while still enabling scroll\n\t\t\t\t// into view behavior when selecting a block or opening the list view.\n\t\t\t\t// The first and last blocks of the list are always rendered, to ensure\n\t\t\t\t// that Home and End keys work as expected.\n\t\t\t\tconst showBlock =\n\t\t\t\t\tisDragged ||\n\t\t\t\t\tblockInView ||\n\t\t\t\t\t( isSelected && clientId === selectedClientIds[ 0 ] ) ||\n\t\t\t\t\tindex === 0 ||\n\t\t\t\t\tindex === blockCount - 1;\n\t\t\t\treturn (\n\t\t\t\t\t<AsyncModeProvider key={ clientId } value={ ! isSelected }>\n\t\t\t\t\t\t{ showBlock && (\n\t\t\t\t\t\t\t<ListViewBlock\n\t\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\t\tselectBlock={ selectBlock }\n\t\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\t\tisBranchSelected={ isSelectedBranch }\n\t\t\t\t\t\t\t\tisDragged={ isDragged }\n\t\t\t\t\t\t\t\tlevel={ level }\n\t\t\t\t\t\t\t\tposition={ position }\n\t\t\t\t\t\t\t\trowCount={ rowCount }\n\t\t\t\t\t\t\t\tsiblingBlockCount={ blockCount }\n\t\t\t\t\t\t\t\tshowBlockMovers={ showBlockMovers }\n\t\t\t\t\t\t\t\tpath={ updatedPath }\n\t\t\t\t\t\t\t\tisExpanded={ isDragged ? false : shouldExpand }\n\t\t\t\t\t\t\t\tlistPosition={ nextPositionRef.current }\n\t\t\t\t\t\t\t\tselectedClientIds={ selectedClientIds }\n\t\t\t\t\t\t\t\tisSyncedBranch={ syncedBranch }\n\t\t\t\t\t\t\t\tdisplacement={ displacement }\n\t\t\t\t\t\t\t\tisAfterDraggedBlocks={ isAfterDraggedBlocks }\n\t\t\t\t\t\t\t\tisNesting={ isNesting }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ ! showBlock && (\n\t\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t\t<td className=\"block-editor-list-view-placeholder\" />\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ hasNestedBlocks && shouldExpand && ! isDragged && (\n\t\t\t\t\t\t\t<ListViewBranch\n\t\t\t\t\t\t\t\tparentId={ clientId }\n\t\t\t\t\t\t\t\tblocks={ innerBlocks }\n\t\t\t\t\t\t\t\tselectBlock={ selectBlock }\n\t\t\t\t\t\t\t\tshowBlockMovers={ showBlockMovers }\n\t\t\t\t\t\t\t\tlevel={ level + 1 }\n\t\t\t\t\t\t\t\tpath={ updatedPath }\n\t\t\t\t\t\t\t\tlistPosition={ nextPositionRef.current + 1 }\n\t\t\t\t\t\t\t\tfixedListWindow={ fixedListWindow }\n\t\t\t\t\t\t\t\tisBranchSelected={ isSelectedBranch }\n\t\t\t\t\t\t\t\tselectedClientIds={ selectedClientIds }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tisSyncedBranch={ syncedBranch }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AsyncModeProvider>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ showAppender && (\n\t\t\t\t<TreeGridRow\n\t\t\t\t\tlevel={ level }\n\t\t\t\t\tsetSize={ rowCount }\n\t\t\t\t\tpositionInSet={ rowCount }\n\t\t\t\t\tisExpanded\n\t\t\t\t>\n\t\t\t\t\t<TreeGridCell>\n\t\t\t\t\t\t{ ( treeGridCellProps ) => (\n\t\t\t\t\t\t\t<Appender\n\t\t\t\t\t\t\t\tclientId={ parentId }\n\t\t\t\t\t\t\t\tnestingLevel={ level }\n\t\t\t\t\t\t\t\tblockCount={ blockCount }\n\t\t\t\t\t\t\t\t{ ...treeGridCellProps }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</TreeGridCell>\n\t\t\t\t</TreeGridRow>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default memo( ListViewBranch );\n"],
"mappings": "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",
"names": ["useBlockDisplayInformation", "blockEditorStore", "ListViewBlock", "TreeGridRow", "TreeGridCell"]
}