@wordpress/block-editor 7.0.2 → 8.0.1

package/build-module/components/list-view/block-contents.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/list-view/block-contents.js"],"names":["classnames","useSelect","forwardRef","useListViewContext","ListViewBlockSlot","ListViewBlockSelectButton","BlockDraggable","store","blockEditorStore","ListViewBlockContents","onClick","onToggleExpanded","block","isSelected","position","siblingBlockCount","level","props","ref","__experimentalFeatures","clientId","blockMovingClientId","selectedBlockInBlockEditor","select","getBlockRootClientId","hasBlockMovingClientId","getSelectedBlockClientId","rootClientId","isBlockMoveTarget","className","draggable","onDragStart","onDragEnd"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,SAASC,kBAAT,QAAmC,WAAnC;AACA,OAAOC,iBAAP,MAA8B,cAA9B;AACA,OAAOC,yBAAP,MAAsC,uBAAtC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,MAAMC,qBAAqB,GAAGP,UAAU,CACvC,CACC;AACCQ,EAAAA,OADD;AAECC,EAAAA,gBAFD;AAGCC,EAAAA,KAHD;AAICC,EAAAA,UAJD;AAKCC,EAAAA,QALD;AAMCC,EAAAA,iBAND;AAOCC,EAAAA,KAPD;AAQC,KAAGC;AARJ,CADD,EAWCC,GAXD,KAYK;AACJ,QAAM;AAAEC,IAAAA;AAAF,MAA6BhB,kBAAkB,EAArD;AAEA,QAAM;AAAEiB,IAAAA;AAAF,MAAeR,KAArB;AAEA,QAAM;AAAES,IAAAA,mBAAF;AAAuBC,IAAAA;AAAvB,MAAsDrB,SAAS,CAClEsB,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,oBADK;AAELC,MAAAA,sBAFK;AAGLC,MAAAA;AAHK,QAIFH,MAAM,CAAEf,gBAAF,CAJV;AAKA,WAAO;AACNmB,MAAAA,YAAY,EAAEH,oBAAoB,CAAEJ,QAAF,CAApB,IAAoC,EAD5C;AAENC,MAAAA,mBAAmB,EAAEI,sBAAsB,EAFrC;AAGNH,MAAAA,0BAA0B,EAAEI,wBAAwB;AAH9C,KAAP;AAKA,GAZmE,EAapE,CAAEN,QAAF,CAboE,CAArE;AAgBA,QAAMQ,iBAAiB,GACtBP,mBAAmB,IAAIC,0BAA0B,KAAKF,QADvD;AAGA,QAAMS,SAAS,GAAG7B,UAAU,CAAE,uCAAF,EAA2C;AACtE,0BAAsB4B;AADgD,GAA3C,CAA5B;AAIA,SACC,cAAC,cAAD;AAAgB,IAAA,SAAS,EAAG,CAAEhB,KAAK,CAACQ,QAAR;AAA5B,KACG,CAAE;AAAEU,IAAAA,SAAF;AAAaC,IAAAA,WAAb;AAA0BC,IAAAA;AAA1B,GAAF,KACDb,sBAAsB,GACrB,cAAC,iBAAD;AACC,IAAA,GAAG,EAAGD,GADP;AAEC,IAAA,SAAS,EAAGW,SAFb;AAGC,IAAA,KAAK,EAAGjB,KAHT;AAIC,IAAA,gBAAgB,EAAGD,gBAJpB;AAKC,IAAA,UAAU,EAAGE,UALd;AAMC,IAAA,QAAQ,EAAGC,QANZ;AAOC,IAAA,iBAAiB,EAAGC,iBAPrB;AAQC,IAAA,KAAK,EAAGC,KART;AASC,IAAA,SAAS,EAAGc,SAAS,IAAIX,sBAT1B;AAUC,IAAA,WAAW,EAAGY,WAVf;AAWC,IAAA,SAAS,EAAGC;AAXb,KAYMf,KAZN,EADqB,GAgBrB,cAAC,yBAAD;AACC,IAAA,GAAG,EAAGC,GADP;AAEC,IAAA,SAAS,EAAGW,SAFb;AAGC,IAAA,KAAK,EAAGjB,KAHT;AAIC,IAAA,OAAO,EAAGF,OAJX;AAKC,IAAA,gBAAgB,EAAGC,gBALpB;AAMC,IAAA,UAAU,EAAGE,UANd;AAOC,IAAA,QAAQ,EAAGC,QAPZ;AAQC,IAAA,iBAAiB,EAAGC,iBARrB;AASC,IAAA,KAAK,EAAGC,KATT;AAUC,IAAA,SAAS,EAAGc,SAVb;AAWC,IAAA,WAAW,EAAGC,WAXf;AAYC,IAAA,SAAS,EAAGC;AAZb,KAaMf,KAbN,EAlBH,CADD;AAsCA,CA/EsC,CAAxC;AAkFA,eAAeR,qBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useListViewContext } from './context';\nimport ListViewBlockSlot from './block-slot';\nimport ListViewBlockSelectButton from './block-select-button';\nimport BlockDraggable from '../block-draggable';\nimport { store as blockEditorStore } from '../../store';\n\nconst ListViewBlockContents = forwardRef(\n\t(\n\t\t{\n\t\t\tonClick,\n\t\t\tonToggleExpanded,\n\t\t\tblock,\n\t\t\tisSelected,\n\t\t\tposition,\n\t\t\tsiblingBlockCount,\n\t\t\tlevel,\n\t\t\t...props\n\t\t},\n\t\tref\n\t) => {\n\t\tconst { __experimentalFeatures } = useListViewContext();\n\n\t\tconst { clientId } = block;\n\n\t\tconst { blockMovingClientId, selectedBlockInBlockEditor } = useSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\thasBlockMovingClientId,\n\t\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\t} = select( blockEditorStore );\n\t\t\t\treturn {\n\t\t\t\t\trootClientId: getBlockRootClientId( clientId ) || '',\n\t\t\t\t\tblockMovingClientId: hasBlockMovingClientId(),\n\t\t\t\t\tselectedBlockInBlockEditor: getSelectedBlockClientId(),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientId ]\n\t\t);\n\n\t\tconst isBlockMoveTarget =\n\t\t\tblockMovingClientId && selectedBlockInBlockEditor === clientId;\n\n\t\tconst className = classnames( 'block-editor-list-view-block-contents', {\n\t\t\t'is-dropping-before': isBlockMoveTarget,\n\t\t} );\n\n\t\treturn (\n\t\t\t<BlockDraggable clientIds={ [ block.clientId ] }>\n\t\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) =>\n\t\t\t\t\t__experimentalFeatures ? (\n\t\t\t\t\t\t<ListViewBlockSlot\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\tonToggleExpanded={ onToggleExpanded }\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\tdraggable={ draggable && __experimentalFeatures }\n\t\t\t\t\t\t\tonDragStart={ onDragStart }\n\t\t\t\t\t\t\tonDragEnd={ onDragEnd }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<ListViewBlockSelectButton\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t\t\tonToggleExpanded={ onToggleExpanded }\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\tdraggable={ draggable }\n\t\t\t\t\t\t\tonDragStart={ onDragStart }\n\t\t\t\t\t\t\tonDragEnd={ onDragEnd }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t/>\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t</BlockDraggable>\n\t\t);\n\t}\n);\n\nexport default ListViewBlockContents;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/list-view/block-contents.js"],"names":["classnames","useSelect","forwardRef","ListViewBlockSelectButton","BlockDraggable","store","blockEditorStore","ListViewBlockContents","onClick","onToggleExpanded","block","isSelected","position","siblingBlockCount","level","props","ref","clientId","blockMovingClientId","selectedBlockInBlockEditor","select","getBlockRootClientId","hasBlockMovingClientId","getSelectedBlockClientId","rootClientId","isBlockMoveTarget","className","draggable","onDragStart","onDragEnd"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,yBAAP,MAAsC,uBAAtC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,MAAMC,qBAAqB,GAAGL,UAAU,CACvC,CACC;AACCM,EAAAA,OADD;AAECC,EAAAA,gBAFD;AAGCC,EAAAA,KAHD;AAICC,EAAAA,UAJD;AAKCC,EAAAA,QALD;AAMCC,EAAAA,iBAND;AAOCC,EAAAA,KAPD;AAQC,KAAGC;AARJ,CADD,EAWCC,GAXD,KAYK;AACJ,QAAM;AAAEC,IAAAA;AAAF,MAAeP,KAArB;AAEA,QAAM;AAAEQ,IAAAA,mBAAF;AAAuBC,IAAAA;AAAvB,MAAsDlB,SAAS,CAClEmB,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,oBADK;AAELC,MAAAA,sBAFK;AAGLC,MAAAA;AAHK,QAIFH,MAAM,CAAEd,gBAAF,CAJV;AAKA,WAAO;AACNkB,MAAAA,YAAY,EAAEH,oBAAoB,CAAEJ,QAAF,CAApB,IAAoC,EAD5C;AAENC,MAAAA,mBAAmB,EAAEI,sBAAsB,EAFrC;AAGNH,MAAAA,0BAA0B,EAAEI,wBAAwB;AAH9C,KAAP;AAKA,GAZmE,EAapE,CAAEN,QAAF,CAboE,CAArE;AAgBA,QAAMQ,iBAAiB,GACtBP,mBAAmB,IAAIC,0BAA0B,KAAKF,QADvD;AAGA,QAAMS,SAAS,GAAG1B,UAAU,CAAE,uCAAF,EAA2C;AACtE,0BAAsByB;AADgD,GAA3C,CAA5B;AAIA,SACC,cAAC,cAAD;AAAgB,IAAA,SAAS,EAAG,CAAEf,KAAK,CAACO,QAAR;AAA5B,KACG,CAAE;AAAEU,IAAAA,SAAF;AAAaC,IAAAA,WAAb;AAA0BC,IAAAA;AAA1B,GAAF,KACD,cAAC,yBAAD;AACC,IAAA,GAAG,EAAGb,GADP;AAEC,IAAA,SAAS,EAAGU,SAFb;AAGC,IAAA,KAAK,EAAGhB,KAHT;AAIC,IAAA,OAAO,EAAGF,OAJX;AAKC,IAAA,gBAAgB,EAAGC,gBALpB;AAMC,IAAA,UAAU,EAAGE,UANd;AAOC,IAAA,QAAQ,EAAGC,QAPZ;AAQC,IAAA,iBAAiB,EAAGC,iBARrB;AASC,IAAA,KAAK,EAAGC,KATT;AAUC,IAAA,SAAS,EAAGa,SAVb;AAWC,IAAA,WAAW,EAAGC,WAXf;AAYC,IAAA,SAAS,EAAGC;AAZb,KAaMd,KAbN,EAFF,CADD;AAqBA,CA5DsC,CAAxC;AA+DA,eAAeR,qBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ListViewBlockSelectButton from './block-select-button';\nimport BlockDraggable from '../block-draggable';\nimport { store as blockEditorStore } from '../../store';\n\nconst ListViewBlockContents = forwardRef(\n\t(\n\t\t{\n\t\t\tonClick,\n\t\t\tonToggleExpanded,\n\t\t\tblock,\n\t\t\tisSelected,\n\t\t\tposition,\n\t\t\tsiblingBlockCount,\n\t\t\tlevel,\n\t\t\t...props\n\t\t},\n\t\tref\n\t) => {\n\t\tconst { clientId } = block;\n\n\t\tconst { blockMovingClientId, selectedBlockInBlockEditor } = useSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\thasBlockMovingClientId,\n\t\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\t} = select( blockEditorStore );\n\t\t\t\treturn {\n\t\t\t\t\trootClientId: getBlockRootClientId( clientId ) || '',\n\t\t\t\t\tblockMovingClientId: hasBlockMovingClientId(),\n\t\t\t\t\tselectedBlockInBlockEditor: getSelectedBlockClientId(),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientId ]\n\t\t);\n\n\t\tconst isBlockMoveTarget =\n\t\t\tblockMovingClientId && selectedBlockInBlockEditor === clientId;\n\n\t\tconst className = classnames( 'block-editor-list-view-block-contents', {\n\t\t\t'is-dropping-before': isBlockMoveTarget,\n\t\t} );\n\n\t\treturn (\n\t\t\t<BlockDraggable clientIds={ [ block.clientId ] }>\n\t\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t\t<ListViewBlockSelectButton\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t\tonToggleExpanded={ onToggleExpanded }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tposition={ position }\n\t\t\t\t\t\tsiblingBlockCount={ siblingBlockCount }\n\t\t\t\t\t\tlevel={ level }\n\t\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\t\tonDragStart={ onDragStart }\n\t\t\t\t\t\tonDragEnd={ onDragEnd }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</BlockDraggable>\n\t\t);\n\t}\n);\n\nexport default ListViewBlockContents;\n"]}

package/build-module/components/list-view/block.js

@@ -8,11 +8,10 @@ import classnames from 'classnames';
  * WordPress dependencies
  */
 
-import { __experimentalTreeGridCell as TreeGridCell, __experimentalTreeGridItem as TreeGridItem, MenuGroup, MenuItem } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
+import { __experimentalTreeGridCell as TreeGridCell, __experimentalTreeGridItem as TreeGridItem } from '@wordpress/components';
 import { moreVertical } from '@wordpress/icons';
-import { useState, useRef, useEffect } from '@wordpress/element';
-import { useDispatch, useSelect } from '@wordpress/data';
+import { useState, useRef, useEffect, useCallback, memo } from '@wordpress/element';
+import { useDispatch } from '@wordpress/data';
 /**
  * Internal dependencies
  */
@@ -23,13 +22,13 @@ import ListViewBlockContents from './block-contents';
 import BlockSettingsDropdown from '../block-settings-menu/block-settings-dropdown';
 import { useListViewContext } from './context';
 import { store as blockEditorStore } from '../../store';
-export default function ListViewBlock({
+
+function ListViewBlock({
   block,
+  isDragged,
   isSelected,
   isBranchSelected,
-  isLastOfSelectedBranch,
-  onClick,
-  onToggleExpanded,
+  selectBlock,
   position,
   level,
   rowCount,
@@ -44,35 +43,23 @@ export default function ListViewBlock({
     clientId
   } = block;
   const {
-    isDragging,
-    blockParents
-  } = useSelect(select => {
-    const {
-      isBlockBeingDragged,
-      isAncestorBeingDragged,
-      getBlockParents
-    } = select(blockEditorStore);
-    return {
-      isDragging: isBlockBeingDragged(clientId) || isAncestorBeingDragged(clientId),
-      blockParents: getBlockParents(clientId)
-    };
-  }, [clientId]);
-  const {
-    selectBlock: selectEditorBlock,
     toggleBlockHighlight
   } = useDispatch(blockEditorStore);
-  const hasSiblings = siblingBlockCount > 0;
-  const hasRenderedMovers = showBlockMovers && hasSiblings;
-  const moverCellClassName = classnames('block-editor-list-view-block__mover-cell', {
-    'is-visible': isHovered
-  });
   const {
     __experimentalFeatures: withExperimentalFeatures,
     __experimentalPersistentListViewFeatures: withExperimentalPersistentListViewFeatures,
-    isTreeGridMounted
+    __experimentalHideContainerBlockActions: hideContainerBlockActions,
+    isTreeGridMounted,
+    expand,
+    collapse
   } = useListViewContext();
+  const hasSiblings = siblingBlockCount > 0;
+  const hasRenderedMovers = showBlockMovers && hasSiblings;
+  const moverCellClassName = classnames('block-editor-list-view-block__mover-cell', {
+    'is-visible': isHovered || isSelected
+  });
   const listViewBlockSettingsClassName = classnames('block-editor-list-view-block__menu-cell', {
-    'is-visible': isHovered
+    'is-visible': isHovered || isSelected
   }); // If ListView has experimental features related to the Persistent List View,
   // only focus the selected list item on mount; otherwise the list would always
   // try to steal the focus from the editor canvas.
@@ -81,31 +68,45 @@ export default function ListViewBlock({
     if (withExperimentalPersistentListViewFeatures && !isTreeGridMounted && isSelected) {
       cellRef.current.focus();
     }
-  }, []); // If ListView has experimental features (such as drag and drop) enabled,
-  // leave the focus handling as it was before, to avoid accidental regressions.
-
-  useEffect(() => {
-    if (withExperimentalFeatures && isSelected) {
-      cellRef.current.focus();
-    }
-  }, [withExperimentalFeatures, isSelected]);
+  }, []);
   const highlightBlock = withExperimentalPersistentListViewFeatures ? toggleBlockHighlight : () => {};
-
-  const onMouseEnter = () => {
+  const onMouseEnter = useCallback(() => {
     setIsHovered(true);
     highlightBlock(clientId, true);
-  };
-
-  const onMouseLeave = () => {
+  }, [clientId, setIsHovered, highlightBlock]);
+  const onMouseLeave = useCallback(() => {
     setIsHovered(false);
     highlightBlock(clientId, false);
-  };
+  }, [clientId, setIsHovered, highlightBlock]);
+  const selectEditorBlock = useCallback(event => {
+    event.stopPropagation();
+    selectBlock(clientId);
+  }, [clientId, selectBlock]);
+  const toggleExpanded = useCallback(event => {
+    event.stopPropagation();
+
+    if (isExpanded === true) {
+      collapse(clientId);
+    } else if (isExpanded === false) {
+      expand(clientId);
+    }
+  }, [clientId, expand, collapse, isExpanded]);
+  const showBlockActions = withExperimentalFeatures && ( //hide actions for blocks like core/widget-areas
+  !hideContainerBlockActions || hideContainerBlockActions && level > 1);
+  const hideBlockActions = withExperimentalFeatures && !showBlockActions;
+  let colSpan;
+
+  if (hasRenderedMovers) {
+    colSpan = 2;
+  } else if (hideBlockActions) {
+    colSpan = 3;
+  }
 
   const classes = classnames({
     'is-selected': isSelected,
     'is-branch-selected': withExperimentalPersistentListViewFeatures && isBranchSelected,
-    'is-last-of-selected-branch': withExperimentalPersistentListViewFeatures && isLastOfSelectedBranch,
-    'is-dragging': isDragging
+    'is-dragging': isDragged,
+    'has-single-cell': hideBlockActions
   });
   return createElement(ListViewLeaf, {
     className: classes,
@@ -122,7 +123,7 @@ export default function ListViewBlock({
     isExpanded: isExpanded
   }, createElement(TreeGridCell, {
     className: "block-editor-list-view-block__contents-cell",
-    colSpan: hasRenderedMovers ? undefined : 2,
+    colSpan: colSpan,
     ref: cellRef
   }, ({
     ref,
@@ -132,8 +133,8 @@ export default function ListViewBlock({
     className: "block-editor-list-view-block__contents-container"
   }, createElement(ListViewBlockContents, {
     block: block,
-    onClick: onClick,
-    onToggleExpanded: onToggleExpanded,
+    onClick: selectEditorBlock,
+    onToggleExpanded: toggleExpanded,
     isSelected: isSelected,
     position: position,
     siblingBlockCount: siblingBlockCount,
@@ -164,7 +165,7 @@ export default function ListViewBlock({
     ref: ref,
     tabIndex: tabIndex,
     onFocus: onFocus
-  })))), withExperimentalFeatures && createElement(TreeGridCell, {
+  })))), showBlockActions && createElement(TreeGridCell, {
     className: listViewBlockSettingsClassName
   }, ({
     ref,
@@ -175,30 +176,14 @@ export default function ListViewBlock({
     icon: moreVertical,
     toggleProps: {
       ref,
+      className: 'block-editor-list-view-block__menu',
       tabIndex,
       onFocus
     },
     disableOpenOnArrowDown: true,
-    __experimentalSelectBlock: onClick
-  }, ({
-    onClose
-  }) => createElement(MenuGroup, null, createElement(MenuItem, {
-    onClick: async () => {
-      if (blockParents.length) {
-        // If the block to select is inside a dropdown, we need to open the dropdown.
-        // Otherwise focus won't transfer to the block.
-        for (const parent of blockParents) {
-          await selectEditorBlock(parent);
-        }
-      } else {
-        // If clientId is already selected, it won't be focused (see block-wrapper.js)
-        // This removes the selection first to ensure the focus will always switch.
-        await selectEditorBlock(null);
-      }
-
-      await selectEditorBlock(clientId);
-      onClose();
-    }
-  }, __('Go to block'))))));
+    __experimentalSelectBlock: selectEditorBlock
+  })));
 }
+
+export default memo(ListViewBlock);
 //# sourceMappingURL=block.js.map

package/build-module/components/list-view/block.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/list-view/block.js"],"names":["classnames","__experimentalTreeGridCell","TreeGridCell","__experimentalTreeGridItem","TreeGridItem","MenuGroup","MenuItem","__","moreVertical","useState","useRef","useEffect","useDispatch","useSelect","ListViewLeaf","BlockMoverUpButton","BlockMoverDownButton","ListViewBlockContents","BlockSettingsDropdown","useListViewContext","store","blockEditorStore","ListViewBlock","block","isSelected","isBranchSelected","isLastOfSelectedBranch","onClick","onToggleExpanded","position","level","rowCount","siblingBlockCount","showBlockMovers","path","isExpanded","cellRef","isHovered","setIsHovered","clientId","isDragging","blockParents","select","isBlockBeingDragged","isAncestorBeingDragged","getBlockParents","selectBlock","selectEditorBlock","toggleBlockHighlight","hasSiblings","hasRenderedMovers","moverCellClassName","__experimentalFeatures","withExperimentalFeatures","__experimentalPersistentListViewFeatures","withExperimentalPersistentListViewFeatures","isTreeGridMounted","listViewBlockSettingsClassName","current","focus","highlightBlock","onMouseEnter","onMouseLeave","classes","undefined","ref","tabIndex","onFocus","onClose","length","parent"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalTreeGridCell as TreeGridCell,\n\t__experimentalTreeGridItem as TreeGridItem,\n\tMenuGroup,\n\tMenuItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { moreVertical } from '@wordpress/icons';\nimport { useState, useRef, useEffect } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport ListViewLeaf from './leaf';\nimport {\n\tBlockMoverUpButton,\n\tBlockMoverDownButton,\n} from '../block-mover/button';\nimport ListViewBlockContents from './block-contents';\nimport BlockSettingsDropdown from '../block-settings-menu/block-settings-dropdown';\nimport { useListViewContext } from './context';\nimport { store as blockEditorStore } from '../../store';\n\nexport default function ListViewBlock( {\n\tblock,\n\tisSelected,\n\tisBranchSelected,\n\tisLastOfSelectedBranch,\n\tonClick,\n\tonToggleExpanded,\n\tposition,\n\tlevel,\n\trowCount,\n\tsiblingBlockCount,\n\tshowBlockMovers,\n\tpath,\n\tisExpanded,\n} ) {\n\tconst cellRef = useRef( null );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst { clientId } = block;\n\tconst { isDragging, blockParents } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tisBlockBeingDragged,\n\t\t\t\tisAncestorBeingDragged,\n\t\t\t\tgetBlockParents,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\treturn {\n\t\t\t\tisDragging:\n\t\t\t\t\tisBlockBeingDragged( clientId ) ||\n\t\t\t\t\tisAncestorBeingDragged( clientId ),\n\t\t\t\tblockParents: getBlockParents( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst {\n\t\tselectBlock: selectEditorBlock,\n\t\ttoggleBlockHighlight,\n\t} = useDispatch( blockEditorStore );\n\n\tconst hasSiblings = siblingBlockCount > 0;\n\tconst hasRenderedMovers = showBlockMovers && hasSiblings;\n\tconst moverCellClassName = classnames(\n\t\t'block-editor-list-view-block__mover-cell',\n\t\t{ 'is-visible': isHovered }\n\t);\n\tconst {\n\t\t__experimentalFeatures: withExperimentalFeatures,\n\t\t__experimentalPersistentListViewFeatures: withExperimentalPersistentListViewFeatures,\n\t\tisTreeGridMounted,\n\t} = useListViewContext();\n\tconst listViewBlockSettingsClassName = classnames(\n\t\t'block-editor-list-view-block__menu-cell',\n\t\t{ 'is-visible': isHovered }\n\t);\n\n\t// If ListView has experimental features related to the Persistent List View,\n\t// only focus the selected list item on mount; otherwise the list would always\n\t// try to steal the focus from the editor canvas.\n\tuseEffect( () => {\n\t\tif (\n\t\t\twithExperimentalPersistentListViewFeatures &&\n\t\t\t! isTreeGridMounted &&\n\t\t\tisSelected\n\t\t) {\n\t\t\tcellRef.current.focus();\n\t\t}\n\t}, [] );\n\n\t// If ListView has experimental features (such as drag and drop) enabled,\n\t// leave the focus handling as it was before, to avoid accidental regressions.\n\tuseEffect( () => {\n\t\tif ( withExperimentalFeatures && isSelected ) {\n\t\t\tcellRef.current.focus();\n\t\t}\n\t}, [ withExperimentalFeatures, isSelected ] );\n\n\tconst highlightBlock = withExperimentalPersistentListViewFeatures\n\t\t? toggleBlockHighlight\n\t\t: () => {};\n\n\tconst onMouseEnter = () => {\n\t\tsetIsHovered( true );\n\t\thighlightBlock( clientId, true );\n\t};\n\tconst onMouseLeave = () => {\n\t\tsetIsHovered( false );\n\t\thighlightBlock( clientId, false );\n\t};\n\n\tconst classes = classnames( {\n\t\t'is-selected': isSelected,\n\t\t'is-branch-selected':\n\t\t\twithExperimentalPersistentListViewFeatures && isBranchSelected,\n\t\t'is-last-of-selected-branch':\n\t\t\twithExperimentalPersistentListViewFeatures &&\n\t\t\tisLastOfSelectedBranch,\n\t\t'is-dragging': isDragging,\n\t} );\n\n\treturn (\n\t\t<ListViewLeaf\n\t\t\tclassName={ classes }\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-block-${ clientId }` }\n\t\t\tdata-block={ clientId }\n\t\t\tisExpanded={ isExpanded }\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={ hasRenderedMovers ? undefined : 2 }\n\t\t\t\tref={ cellRef }\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={ onClick }\n\t\t\t\t\t\t\tonToggleExpanded={ onToggleExpanded }\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={ tabIndex }\n\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t/>\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{ withExperimentalFeatures && (\n\t\t\t\t<TreeGridCell className={ listViewBlockSettingsClassName }>\n\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t<BlockSettingsDropdown\n\t\t\t\t\t\t\tclientIds={ [ clientId ] }\n\t\t\t\t\t\t\ticon={ moreVertical }\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\ttabIndex,\n\t\t\t\t\t\t\t\tonFocus,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tdisableOpenOnArrowDown\n\t\t\t\t\t\t\t__experimentalSelectBlock={ onClick }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( { onClose } ) => (\n\t\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\tonClick={ async () => {\n\t\t\t\t\t\t\t\t\t\t\tif ( blockParents.length ) {\n\t\t\t\t\t\t\t\t\t\t\t\t// If the block to select is inside a dropdown, we need to open the dropdown.\n\t\t\t\t\t\t\t\t\t\t\t\t// Otherwise focus won't transfer to the block.\n\t\t\t\t\t\t\t\t\t\t\t\tfor ( const parent of blockParents ) {\n\t\t\t\t\t\t\t\t\t\t\t\t\tawait selectEditorBlock(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tparent\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\t// If clientId is already selected, it won't be focused (see block-wrapper.js)\n\t\t\t\t\t\t\t\t\t\t\t\t// This removes the selection first to ensure the focus will always switch.\n\t\t\t\t\t\t\t\t\t\t\t\tawait selectEditorBlock( null );\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tawait selectEditorBlock( clientId );\n\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Go to block' ) }\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</BlockSettingsDropdown>\n\t\t\t\t\t) }\n\t\t\t\t</TreeGridCell>\n\t\t\t) }\n\t\t</ListViewLeaf>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/list-view/block.js"],"names":["classnames","__experimentalTreeGridCell","TreeGridCell","__experimentalTreeGridItem","TreeGridItem","moreVertical","useState","useRef","useEffect","useCallback","memo","useDispatch","ListViewLeaf","BlockMoverUpButton","BlockMoverDownButton","ListViewBlockContents","BlockSettingsDropdown","useListViewContext","store","blockEditorStore","ListViewBlock","block","isDragged","isSelected","isBranchSelected","selectBlock","position","level","rowCount","siblingBlockCount","showBlockMovers","path","isExpanded","cellRef","isHovered","setIsHovered","clientId","toggleBlockHighlight","__experimentalFeatures","withExperimentalFeatures","__experimentalPersistentListViewFeatures","withExperimentalPersistentListViewFeatures","__experimentalHideContainerBlockActions","hideContainerBlockActions","isTreeGridMounted","expand","collapse","hasSiblings","hasRenderedMovers","moverCellClassName","listViewBlockSettingsClassName","current","focus","highlightBlock","onMouseEnter","onMouseLeave","selectEditorBlock","event","stopPropagation","toggleExpanded","showBlockActions","hideBlockActions","colSpan","classes","ref","tabIndex","onFocus","className"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalTreeGridCell as TreeGridCell,\n\t__experimentalTreeGridItem as TreeGridItem,\n} from '@wordpress/components';\nimport { moreVertical } from '@wordpress/icons';\nimport {\n\tuseState,\n\tuseRef,\n\tuseEffect,\n\tuseCallback,\n\tmemo,\n} from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport ListViewLeaf from './leaf';\nimport {\n\tBlockMoverUpButton,\n\tBlockMoverDownButton,\n} from '../block-mover/button';\nimport ListViewBlockContents from './block-contents';\nimport BlockSettingsDropdown from '../block-settings-menu/block-settings-dropdown';\nimport { useListViewContext } from './context';\nimport { store as blockEditorStore } from '../../store';\n\nfunction ListViewBlock( {\n\tblock,\n\tisDragged,\n\tisSelected,\n\tisBranchSelected,\n\tselectBlock,\n\tposition,\n\tlevel,\n\trowCount,\n\tsiblingBlockCount,\n\tshowBlockMovers,\n\tpath,\n\tisExpanded,\n} ) {\n\tconst cellRef = useRef( null );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst { clientId } = block;\n\n\tconst { toggleBlockHighlight } = useDispatch( blockEditorStore );\n\n\tconst {\n\t\t__experimentalFeatures: withExperimentalFeatures,\n\t\t__experimentalPersistentListViewFeatures: withExperimentalPersistentListViewFeatures,\n\t\t__experimentalHideContainerBlockActions: hideContainerBlockActions,\n\t\tisTreeGridMounted,\n\t\texpand,\n\t\tcollapse,\n\t} = useListViewContext();\n\n\tconst hasSiblings = siblingBlockCount > 0;\n\tconst hasRenderedMovers = showBlockMovers && hasSiblings;\n\tconst moverCellClassName = classnames(\n\t\t'block-editor-list-view-block__mover-cell',\n\t\t{ 'is-visible': isHovered || isSelected }\n\t);\n\n\tconst listViewBlockSettingsClassName = classnames(\n\t\t'block-editor-list-view-block__menu-cell',\n\t\t{ 'is-visible': isHovered || isSelected }\n\t);\n\n\t// If ListView has experimental features related to the Persistent List View,\n\t// only focus the selected list item on mount; otherwise the list would always\n\t// try to steal the focus from the editor canvas.\n\tuseEffect( () => {\n\t\tif (\n\t\t\twithExperimentalPersistentListViewFeatures &&\n\t\t\t! isTreeGridMounted &&\n\t\t\tisSelected\n\t\t) {\n\t\t\tcellRef.current.focus();\n\t\t}\n\t}, [] );\n\n\tconst highlightBlock = withExperimentalPersistentListViewFeatures\n\t\t? toggleBlockHighlight\n\t\t: () => {};\n\n\tconst onMouseEnter = useCallback( () => {\n\t\tsetIsHovered( true );\n\t\thighlightBlock( clientId, true );\n\t}, [ clientId, setIsHovered, highlightBlock ] );\n\tconst onMouseLeave = useCallback( () => {\n\t\tsetIsHovered( false );\n\t\thighlightBlock( clientId, false );\n\t}, [ clientId, setIsHovered, highlightBlock ] );\n\n\tconst selectEditorBlock = useCallback(\n\t\t( event ) => {\n\t\t\tevent.stopPropagation();\n\t\t\tselectBlock( clientId );\n\t\t},\n\t\t[ clientId, selectBlock ]\n\t);\n\n\tconst toggleExpanded = useCallback(\n\t\t( event ) => {\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\tconst showBlockActions =\n\t\twithExperimentalFeatures &&\n\t\t//hide actions for blocks like core/widget-areas\n\t\t( ! hideContainerBlockActions ||\n\t\t\t( hideContainerBlockActions && level > 1 ) );\n\n\tconst hideBlockActions = withExperimentalFeatures && ! showBlockActions;\n\n\tlet colSpan;\n\tif ( hasRenderedMovers ) {\n\t\tcolSpan = 2;\n\t} else if ( hideBlockActions ) {\n\t\tcolSpan = 3;\n\t}\n\n\tconst classes = classnames( {\n\t\t'is-selected': isSelected,\n\t\t'is-branch-selected':\n\t\t\twithExperimentalPersistentListViewFeatures && isBranchSelected,\n\t\t'is-dragging': isDragged,\n\t\t'has-single-cell': hideBlockActions,\n\t} );\n\n\treturn (\n\t\t<ListViewLeaf\n\t\t\tclassName={ classes }\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-block-${ clientId }` }\n\t\t\tdata-block={ clientId }\n\t\t\tisExpanded={ isExpanded }\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>\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\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={ tabIndex }\n\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t/>\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 && (\n\t\t\t\t<TreeGridCell className={ listViewBlockSettingsClassName }>\n\t\t\t\t\t{ ( { ref, tabIndex, onFocus } ) => (\n\t\t\t\t\t\t<BlockSettingsDropdown\n\t\t\t\t\t\t\tclientIds={ [ clientId ] }\n\t\t\t\t\t\t\ticon={ moreVertical }\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\tonFocus,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tdisableOpenOnArrowDown\n\t\t\t\t\t\t\t__experimentalSelectBlock={ selectEditorBlock }\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</ListViewLeaf>\n\t);\n}\n\nexport default memo( ListViewBlock );\n"]}

package/build-module/components/list-view/branch.js

@@ -1,131 +1,155 @@
-import { createElement } from "@wordpress/element";
+import { createElement, Fragment } from "@wordpress/element";
 
 /**
  * External dependencies
  */
-import { map, compact } from 'lodash';
+import { compact } from 'lodash';
 /**
  * WordPress dependencies
  */
 
-import { Fragment } from '@wordpress/element';
+import { memo } from '@wordpress/element';
+import { AsyncModeProvider } from '@wordpress/data';
 /**
  * Internal dependencies
  */
 
 import ListViewBlock from './block';
-import ListViewAppender from './appender';
-import { isClientIdSelected } from './utils';
 import { useListViewContext } from './context';
-export default function ListViewBranch(props) {
+import { isClientIdSelected } from './utils';
+/**
+ * Given a block, returns the total number of blocks in that subtree. This is used to help determine
+ * the list position of a block.
+ *
+ * When a block is collapsed, we do not count their children as part of that total. In the current drag
+ * implementation dragged blocks and their children are not counted.
+ *
+ * @param {Object} block            block tree
+ * @param {Object} expandedState    state that notes which branches are collapsed
+ * @param {Array}  draggedClientIds a list of dragged client ids
+ * @return {number} block count
+ */
+
+function countBlocks(block, expandedState, draggedClientIds) {
+  var _expandedState$block$;
+
+  const isDragged = draggedClientIds === null || draggedClientIds === void 0 ? void 0 : draggedClientIds.includes(block.clientId);
+
+  if (isDragged) {
+    return 0;
+  }
+
+  const isExpanded = (_expandedState$block$ = expandedState[block.clientId]) !== null && _expandedState$block$ !== void 0 ? _expandedState$block$ : true;
+
+  if (isExpanded) {
+    return 1 + block.innerBlocks.reduce(countReducer(expandedState, draggedClientIds), 0);
+  }
+
+  return 1;
+}
+
+const countReducer = (expandedState, draggedClientIds) => (count, block) => {
+  var _expandedState$block$2;
+
+  const isDragged = draggedClientIds === null || draggedClientIds === void 0 ? void 0 : draggedClientIds.includes(block.clientId);
+
+  if (isDragged) {
+    return count;
+  }
+
+  const isExpanded = (_expandedState$block$2 = expandedState[block.clientId]) !== null && _expandedState$block$2 !== void 0 ? _expandedState$block$2 : true;
+
+  if (isExpanded && block.innerBlocks.length > 0) {
+    return count + countBlocks(block, expandedState, draggedClientIds);
+  }
+
+  return count + 1;
+};
+
+function ListViewBranch(props) {
   const {
     blocks,
     selectBlock,
-    selectedBlockClientIds,
-    showAppender,
     showBlockMovers,
     showNestedBlocks,
-    parentBlockClientId,
+    selectedClientIds,
     level = 1,
-    terminatedLevels = [],
-    path = [],
+    path = '',
     isBranchSelected = false,
-    isLastOfBranch = false
+    listPosition = 0,
+    fixedListWindow
   } = props;
-  const isTreeRoot = !parentBlockClientId;
-  const filteredBlocks = compact(blocks);
-
-  const itemHasAppender = parentClientId => showAppender && !isTreeRoot && isClientIdSelected(parentClientId, selectedBlockClientIds);
-
-  const hasAppender = itemHasAppender(parentBlockClientId); // Add +1 to the rowCount to take the block appender into account.
-
-  const blockCount = filteredBlocks.length;
-  const rowCount = hasAppender ? blockCount + 1 : blockCount;
-  const appenderPosition = rowCount;
   const {
     expandedState,
-    expand,
-    collapse
+    draggedClientIds,
+    __experimentalPersistentListViewFeatures
   } = useListViewContext();
-  return createElement(Fragment, null, map(filteredBlocks, (block, index) => {
+  const filteredBlocks = compact(blocks);
+  const blockCount = filteredBlocks.length;
+  let nextPosition = listPosition;
+  return createElement(Fragment, null, filteredBlocks.map((block, index) => {
     var _expandedState$client;
 
     const {
       clientId,
       innerBlocks
     } = block;
+
+    if (index > 0) {
+      nextPosition += countBlocks(filteredBlocks[index - 1], expandedState, draggedClientIds);
+    }
+
+    const usesWindowing = __experimentalPersistentListViewFeatures;
+    const {
+      itemInView
+    } = fixedListWindow;
+    const blockInView = !usesWindowing || itemInView(nextPosition);
     const position = index + 1;
-    const isLastRowAtLevel = rowCount === position;
-    const updatedTerminatedLevels = isLastRowAtLevel ? [...terminatedLevels, level] : terminatedLevels;
-    const updatedPath = [...path, position];
+    const updatedPath = path.length > 0 ? `${path}_${position}` : `${position}`;
     const hasNestedBlocks = showNestedBlocks && !!innerBlocks && !!innerBlocks.length;
-    const hasNestedAppender = itemHasAppender(clientId);
-    const hasNestedBranch = hasNestedBlocks || hasNestedAppender;
-    const isSelected = isClientIdSelected(clientId, selectedBlockClientIds);
-    const isSelectedBranch = isBranchSelected || isSelected && hasNestedBranch; // Logic needed to target the last item of a selected branch which might be deeply nested.
-    // This is currently only needed for styling purposes. See: `.is-last-of-selected-branch`.
-
-    const isLastBlock = index === blockCount - 1;
-    const isLast = isSelected || isLastOfBranch && isLastBlock;
-    const isLastOfSelectedBranch = isLastOfBranch && !hasNestedBranch && isLastBlock;
-    const isExpanded = hasNestedBranch ? (_expandedState$client = expandedState[clientId]) !== null && _expandedState$client !== void 0 ? _expandedState$client : true : undefined;
-
-    const selectBlockWithClientId = event => {
-      event.stopPropagation();
-      selectBlock(clientId);
-    };
-
-    const toggleExpanded = event => {
-      event.stopPropagation();
-
-      if (isExpanded === true) {
-        collapse(clientId);
-      } else if (isExpanded === false) {
-        expand(clientId);
-      }
-    };
-
-    return createElement(Fragment, {
-      key: clientId
-    }, createElement(ListViewBlock, {
+    const isExpanded = hasNestedBlocks ? (_expandedState$client = expandedState[clientId]) !== null && _expandedState$client !== void 0 ? _expandedState$client : true : undefined;
+    const isDragged = !!(draggedClientIds !== null && draggedClientIds !== void 0 && draggedClientIds.includes(clientId));
+    const showBlock = isDragged || blockInView; // Make updates to the selected or dragged blocks synchronous,
+    // but asynchronous for any other block.
+
+    const isSelected = isClientIdSelected(clientId, selectedClientIds);
+    const isSelectedBranch = isBranchSelected || isSelected && hasNestedBlocks;
+    return createElement(AsyncModeProvider, {
+      key: clientId,
+      value: !isSelected
+    }, showBlock && createElement(ListViewBlock, {
       block: block,
-      onClick: selectBlockWithClientId,
-      onToggleExpanded: toggleExpanded,
+      selectBlock: selectBlock,
       isSelected: isSelected,
       isBranchSelected: isSelectedBranch,
-      isLastOfSelectedBranch: isLastOfSelectedBranch,
+      isDragged: isDragged,
       level: level,
       position: position,
-      rowCount: rowCount,
+      rowCount: blockCount,
       siblingBlockCount: blockCount,
       showBlockMovers: showBlockMovers,
-      terminatedLevels: terminatedLevels,
       path: updatedPath,
-      isExpanded: isExpanded
-    }), hasNestedBranch && isExpanded && createElement(ListViewBranch, {
+      isExpanded: isExpanded,
+      listPosition: nextPosition
+    }), !showBlock && createElement("tr", null, createElement("td", {
+      className: "block-editor-list-view-placeholder"
+    })), hasNestedBlocks && isExpanded && !isDragged && createElement(ListViewBranch, {
       blocks: innerBlocks,
-      selectedBlockClientIds: selectedBlockClientIds,
       selectBlock: selectBlock,
-      isBranchSelected: isSelectedBranch,
-      isLastOfBranch: isLast,
-      showAppender: showAppender,
       showBlockMovers: showBlockMovers,
       showNestedBlocks: showNestedBlocks,
-      parentBlockClientId: clientId,
       level: level + 1,
-      terminatedLevels: updatedTerminatedLevels,
-      path: updatedPath
+      path: updatedPath,
+      listPosition: nextPosition + 1,
+      fixedListWindow: fixedListWindow,
+      isBranchSelected: isSelectedBranch,
+      selectedClientIds: selectedClientIds
     }));
-  }), hasAppender && createElement(ListViewAppender, {
-    parentBlockClientId: parentBlockClientId,
-    position: rowCount,
-    rowCount: appenderPosition,
-    level: level,
-    terminatedLevels: terminatedLevels,
-    path: [...path, appenderPosition]
   }));
 }
+
 ListViewBranch.defaultProps = {
   selectBlock: () => {}
 };
+export default memo(ListViewBranch);
 //# sourceMappingURL=branch.js.map

package/build-module/components/list-view/branch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/list-view/branch.js"],"names":["map","compact","Fragment","ListViewBlock","ListViewAppender","isClientIdSelected","useListViewContext","ListViewBranch","props","blocks","selectBlock","selectedBlockClientIds","showAppender","showBlockMovers","showNestedBlocks","parentBlockClientId","level","terminatedLevels","path","isBranchSelected","isLastOfBranch","isTreeRoot","filteredBlocks","itemHasAppender","parentClientId","hasAppender","blockCount","length","rowCount","appenderPosition","expandedState","expand","collapse","block","index","clientId","innerBlocks","position","isLastRowAtLevel","updatedTerminatedLevels","updatedPath","hasNestedBlocks","hasNestedAppender","hasNestedBranch","isSelected","isSelectedBranch","isLastBlock","isLast","isLastOfSelectedBranch","isExpanded","undefined","selectBlockWithClientId","event","stopPropagation","toggleExpanded","defaultProps"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { map, compact } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { Fragment } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ListViewBlock from './block';\nimport ListViewAppender from './appender';\nimport { isClientIdSelected } from './utils';\nimport { useListViewContext } from './context';\n\nexport default function ListViewBranch( props ) {\n\tconst {\n\t\tblocks,\n\t\tselectBlock,\n\t\tselectedBlockClientIds,\n\t\tshowAppender,\n\t\tshowBlockMovers,\n\t\tshowNestedBlocks,\n\t\tparentBlockClientId,\n\t\tlevel = 1,\n\t\tterminatedLevels = [],\n\t\tpath = [],\n\t\tisBranchSelected = false,\n\t\tisLastOfBranch = false,\n\t} = props;\n\n\tconst isTreeRoot = ! parentBlockClientId;\n\tconst filteredBlocks = compact( blocks );\n\tconst itemHasAppender = ( parentClientId ) =>\n\t\tshowAppender &&\n\t\t! isTreeRoot &&\n\t\tisClientIdSelected( parentClientId, selectedBlockClientIds );\n\tconst hasAppender = itemHasAppender( parentBlockClientId );\n\t// Add +1 to the rowCount to take the block appender into account.\n\tconst blockCount = filteredBlocks.length;\n\tconst rowCount = hasAppender ? blockCount + 1 : blockCount;\n\tconst appenderPosition = rowCount;\n\n\tconst { expandedState, expand, collapse } = useListViewContext();\n\n\treturn (\n\t\t<>\n\t\t\t{ map( filteredBlocks, ( block, index ) => {\n\t\t\t\tconst { clientId, innerBlocks } = block;\n\t\t\t\tconst position = index + 1;\n\t\t\t\tconst isLastRowAtLevel = rowCount === position;\n\t\t\t\tconst updatedTerminatedLevels = isLastRowAtLevel\n\t\t\t\t\t? [ ...terminatedLevels, level ]\n\t\t\t\t\t: terminatedLevels;\n\t\t\t\tconst updatedPath = [ ...path, position ];\n\t\t\t\tconst hasNestedBlocks =\n\t\t\t\t\tshowNestedBlocks && !! innerBlocks && !! innerBlocks.length;\n\t\t\t\tconst hasNestedAppender = itemHasAppender( clientId );\n\t\t\t\tconst hasNestedBranch = hasNestedBlocks || hasNestedAppender;\n\n\t\t\t\tconst isSelected = isClientIdSelected(\n\t\t\t\t\tclientId,\n\t\t\t\t\tselectedBlockClientIds\n\t\t\t\t);\n\t\t\t\tconst isSelectedBranch =\n\t\t\t\t\tisBranchSelected || ( isSelected && hasNestedBranch );\n\n\t\t\t\t// Logic needed to target the last item of a selected branch which might be deeply nested.\n\t\t\t\t// This is currently only needed for styling purposes. See: `.is-last-of-selected-branch`.\n\t\t\t\tconst isLastBlock = index === blockCount - 1;\n\t\t\t\tconst isLast = isSelected || ( isLastOfBranch && isLastBlock );\n\t\t\t\tconst isLastOfSelectedBranch =\n\t\t\t\t\tisLastOfBranch && ! hasNestedBranch && isLastBlock;\n\n\t\t\t\tconst isExpanded = hasNestedBranch\n\t\t\t\t\t? expandedState[ clientId ] ?? true\n\t\t\t\t\t: undefined;\n\n\t\t\t\tconst selectBlockWithClientId = ( event ) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tselectBlock( clientId );\n\t\t\t\t};\n\n\t\t\t\tconst toggleExpanded = ( event ) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tif ( isExpanded === true ) {\n\t\t\t\t\t\tcollapse( clientId );\n\t\t\t\t\t} else if ( isExpanded === false ) {\n\t\t\t\t\t\texpand( clientId );\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\t<Fragment key={ clientId }>\n\t\t\t\t\t\t<ListViewBlock\n\t\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\t\tonClick={ selectBlockWithClientId }\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\tisBranchSelected={ isSelectedBranch }\n\t\t\t\t\t\t\tisLastOfSelectedBranch={ isLastOfSelectedBranch }\n\t\t\t\t\t\t\tlevel={ level }\n\t\t\t\t\t\t\tposition={ position }\n\t\t\t\t\t\t\trowCount={ rowCount }\n\t\t\t\t\t\t\tsiblingBlockCount={ blockCount }\n\t\t\t\t\t\t\tshowBlockMovers={ showBlockMovers }\n\t\t\t\t\t\t\tterminatedLevels={ terminatedLevels }\n\t\t\t\t\t\t\tpath={ updatedPath }\n\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ hasNestedBranch && isExpanded && (\n\t\t\t\t\t\t\t<ListViewBranch\n\t\t\t\t\t\t\t\tblocks={ innerBlocks }\n\t\t\t\t\t\t\t\tselectedBlockClientIds={\n\t\t\t\t\t\t\t\t\tselectedBlockClientIds\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tselectBlock={ selectBlock }\n\t\t\t\t\t\t\t\tisBranchSelected={ isSelectedBranch }\n\t\t\t\t\t\t\t\tisLastOfBranch={ isLast }\n\t\t\t\t\t\t\t\tshowAppender={ showAppender }\n\t\t\t\t\t\t\t\tshowBlockMovers={ showBlockMovers }\n\t\t\t\t\t\t\t\tshowNestedBlocks={ showNestedBlocks }\n\t\t\t\t\t\t\t\tparentBlockClientId={ clientId }\n\t\t\t\t\t\t\t\tlevel={ level + 1 }\n\t\t\t\t\t\t\t\tterminatedLevels={ updatedTerminatedLevels }\n\t\t\t\t\t\t\t\tpath={ updatedPath }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Fragment>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ hasAppender && (\n\t\t\t\t<ListViewAppender\n\t\t\t\t\tparentBlockClientId={ parentBlockClientId }\n\t\t\t\t\tposition={ rowCount }\n\t\t\t\t\trowCount={ appenderPosition }\n\t\t\t\t\tlevel={ level }\n\t\t\t\t\tterminatedLevels={ terminatedLevels }\n\t\t\t\t\tpath={ [ ...path, appenderPosition ] }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nListViewBranch.defaultProps = {\n\tselectBlock: () => {},\n};\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/list-view/branch.js"],"names":["compact","memo","AsyncModeProvider","ListViewBlock","useListViewContext","isClientIdSelected","countBlocks","block","expandedState","draggedClientIds","isDragged","includes","clientId","isExpanded","innerBlocks","reduce","countReducer","count","length","ListViewBranch","props","blocks","selectBlock","showBlockMovers","showNestedBlocks","selectedClientIds","level","path","isBranchSelected","listPosition","fixedListWindow","__experimentalPersistentListViewFeatures","filteredBlocks","blockCount","nextPosition","map","index","usesWindowing","itemInView","blockInView","position","updatedPath","hasNestedBlocks","undefined","showBlock","isSelected","isSelectedBranch","defaultProps"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { compact } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { memo } from '@wordpress/element';\nimport { AsyncModeProvider } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport ListViewBlock from './block';\nimport { useListViewContext } from './context';\nimport { isClientIdSelected } from './utils';\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 * @return {number} block count\n */\nfunction countBlocks( block, expandedState, draggedClientIds ) {\n\tconst isDragged = draggedClientIds?.includes( block.clientId );\n\tif ( isDragged ) {\n\t\treturn 0;\n\t}\n\tconst isExpanded = expandedState[ block.clientId ] ?? true;\n\tif ( isExpanded ) {\n\t\treturn (\n\t\t\t1 +\n\t\t\tblock.innerBlocks.reduce(\n\t\t\t\tcountReducer( expandedState, draggedClientIds ),\n\t\t\t\t0\n\t\t\t)\n\t\t);\n\t}\n\treturn 1;\n}\nconst countReducer = ( expandedState, draggedClientIds ) => (\n\tcount,\n\tblock\n) => {\n\tconst isDragged = draggedClientIds?.includes( block.clientId );\n\tif ( isDragged ) {\n\t\treturn count;\n\t}\n\tconst isExpanded = expandedState[ block.clientId ] ?? true;\n\tif ( isExpanded && block.innerBlocks.length > 0 ) {\n\t\treturn count + countBlocks( block, expandedState, draggedClientIds );\n\t}\n\treturn count + 1;\n};\n\nfunction ListViewBranch( props ) {\n\tconst {\n\t\tblocks,\n\t\tselectBlock,\n\t\tshowBlockMovers,\n\t\tshowNestedBlocks,\n\t\tselectedClientIds,\n\t\tlevel = 1,\n\t\tpath = '',\n\t\tisBranchSelected = false,\n\t\tlistPosition = 0,\n\t\tfixedListWindow,\n\t} = props;\n\n\tconst {\n\t\texpandedState,\n\t\tdraggedClientIds,\n\t\t__experimentalPersistentListViewFeatures,\n\t} = useListViewContext();\n\n\tconst filteredBlocks = compact( blocks );\n\tconst blockCount = filteredBlocks.length;\n\tlet nextPosition = 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\tnextPosition += 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);\n\t\t\t\t}\n\n\t\t\t\tconst usesWindowing = __experimentalPersistentListViewFeatures;\n\n\t\t\t\tconst { itemInView } = fixedListWindow;\n\n\t\t\t\tconst blockInView =\n\t\t\t\t\t! usesWindowing || itemInView( nextPosition );\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 =\n\t\t\t\t\tshowNestedBlocks && !! innerBlocks && !! innerBlocks.length;\n\n\t\t\t\tconst isExpanded = hasNestedBlocks\n\t\t\t\t\t? expandedState[ clientId ] ?? true\n\t\t\t\t\t: undefined;\n\n\t\t\t\tconst isDragged = !! draggedClientIds?.includes( clientId );\n\n\t\t\t\tconst showBlock = isDragged || blockInView;\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\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={ blockCount }\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={ isExpanded }\n\t\t\t\t\t\t\t\tlistPosition={ nextPosition }\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 && isExpanded && ! isDragged && (\n\t\t\t\t\t\t\t<ListViewBranch\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\tshowNestedBlocks={ showNestedBlocks }\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={ nextPosition + 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/>\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</>\n\t);\n}\n\nListViewBranch.defaultProps = {\n\tselectBlock: () => {},\n};\n\nexport default memo( ListViewBranch );\n"]}