@wordpress/block-editor 8.4.0 → 8.5.0

package/build-module/components/writing-flow/use-drag-selection.js

@@ -0,0 +1,124 @@
+/**
+ * WordPress dependencies
+ */
+import { useSelect, useDispatch } from '@wordpress/data';
+import { useRefEffect } from '@wordpress/compose';
+/**
+ * Internal dependencies
+ */
+
+import { store as blockEditorStore } from '../../store';
+/**
+ * Sets the `contenteditable` wrapper element to `value`.
+ *
+ * @param {HTMLElement} node  Block element.
+ * @param {boolean}     value `contentEditable` value (true or false)
+ */
+
+function setContentEditableWrapper(node, value) {
+  node.contentEditable = value; // Firefox doesn't automatically move focus.
+
+  if (value) node.focus();
+}
+/**
+ * Sets a multi-selection based on the native selection across blocks.
+ */
+
+
+export default function useDragSelection() {
+  const {
+    startMultiSelect,
+    stopMultiSelect
+  } = useDispatch(blockEditorStore);
+  const {
+    isSelectionEnabled,
+    hasMultiSelection
+  } = useSelect(blockEditorStore);
+  return useRefEffect(node => {
+    const {
+      ownerDocument
+    } = node;
+    const {
+      defaultView
+    } = ownerDocument;
+    let anchorElement;
+    let rafId;
+
+    function onMouseUp() {
+      stopMultiSelect(); // Equivalent to attaching the listener once.
+
+      defaultView.removeEventListener('mouseup', onMouseUp); // The browser selection won't have updated yet at this point,
+      // so wait until the next animation frame to get the browser
+      // selection.
+
+      rafId = defaultView.requestAnimationFrame(() => {
+        if (hasMultiSelection()) {
+          return;
+        } // If the selection is complete (on mouse up), and no
+        // multiple blocks have been selected, set focus back to the
+        // anchor element. if the anchor element contains the
+        // selection. Additionally, the contentEditable wrapper can
+        // now be disabled again.
+
+
+        setContentEditableWrapper(node, false);
+        const selection = defaultView.getSelection();
+
+        if (selection.rangeCount) {
+          const {
+            commonAncestorContainer
+          } = selection.getRangeAt(0);
+
+          if (anchorElement.contains(commonAncestorContainer)) {
+            anchorElement.focus();
+          }
+        }
+      });
+    }
+
+    function onMouseLeave(_ref) {
+      let {
+        buttons,
+        target
+      } = _ref;
+
+      // The primary button must be pressed to initiate selection.
+      // See https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons
+      if (buttons !== 1) {
+        return;
+      } // Check the attribute, not the contentEditable attribute. All
+      // child elements of the content editable wrapper are editable
+      // and return true for this property. We only want to start
+      // multi selecting when the mouse leaves the wrapper.
+
+
+      if (!target.getAttribute('contenteditable')) {
+        return;
+      }
+
+      if (!isSelectionEnabled()) {
+        return;
+      }
+
+      anchorElement = ownerDocument.activeElement;
+      startMultiSelect(); // `onSelectionStart` is called after `mousedown` and
+      // `mouseleave` (from a block). The selection ends when
+      // `mouseup` happens anywhere in the window.
+
+      defaultView.addEventListener('mouseup', onMouseUp); // Allow cross contentEditable selection by temporarily making
+      // all content editable. We can't rely on using the store and
+      // React because re-rending happens too slowly. We need to be
+      // able to select across instances immediately.
+
+      setContentEditableWrapper(node, true);
+    }
+
+    node.addEventListener('mouseout', onMouseLeave);
+    return () => {
+      node.removeEventListener('mouseout', onMouseLeave);
+      defaultView.removeEventListener('mouseup', onMouseUp);
+      defaultView.cancelAnimationFrame(rafId);
+    };
+  }, [startMultiSelect, stopMultiSelect, isSelectionEnabled, hasMultiSelection]);
+}
+//# sourceMappingURL=use-drag-selection.js.map

package/build-module/components/writing-flow/use-drag-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-drag-selection.js"],"names":["useSelect","useDispatch","useRefEffect","store","blockEditorStore","setContentEditableWrapper","node","value","contentEditable","focus","useDragSelection","startMultiSelect","stopMultiSelect","isSelectionEnabled","hasMultiSelection","ownerDocument","defaultView","anchorElement","rafId","onMouseUp","removeEventListener","requestAnimationFrame","selection","getSelection","rangeCount","commonAncestorContainer","getRangeAt","contains","onMouseLeave","buttons","target","getAttribute","activeElement","addEventListener","cancelAnimationFrame"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\n/**\n * Sets the `contenteditable` wrapper element to `value`.\n *\n * @param {HTMLElement} node  Block element.\n * @param {boolean}     value `contentEditable` value (true or false)\n */\nfunction setContentEditableWrapper( node, value ) {\n\tnode.contentEditable = value;\n\t// Firefox doesn't automatically move focus.\n\tif ( value ) node.focus();\n}\n\n/**\n * Sets a multi-selection based on the native selection across blocks.\n */\nexport default function useDragSelection() {\n\tconst { startMultiSelect, stopMultiSelect } = useDispatch(\n\t\tblockEditorStore\n\t);\n\tconst { isSelectionEnabled, hasMultiSelection } = useSelect(\n\t\tblockEditorStore\n\t);\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView } = ownerDocument;\n\n\t\t\tlet anchorElement;\n\t\t\tlet rafId;\n\n\t\t\tfunction onMouseUp() {\n\t\t\t\tstopMultiSelect();\n\t\t\t\t// Equivalent to attaching the listener once.\n\t\t\t\tdefaultView.removeEventListener( 'mouseup', onMouseUp );\n\t\t\t\t// The browser selection won't have updated yet at this point,\n\t\t\t\t// so wait until the next animation frame to get the browser\n\t\t\t\t// selection.\n\t\t\t\trafId = defaultView.requestAnimationFrame( () => {\n\t\t\t\t\tif ( hasMultiSelection() ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\t// If the selection is complete (on mouse up), and no\n\t\t\t\t\t// multiple blocks have been selected, set focus back to the\n\t\t\t\t\t// anchor element. if the anchor element contains the\n\t\t\t\t\t// selection. Additionally, the contentEditable wrapper can\n\t\t\t\t\t// now be disabled again.\n\t\t\t\t\tsetContentEditableWrapper( node, false );\n\n\t\t\t\t\tconst selection = defaultView.getSelection();\n\n\t\t\t\t\tif ( selection.rangeCount ) {\n\t\t\t\t\t\tconst {\n\t\t\t\t\t\t\tcommonAncestorContainer,\n\t\t\t\t\t\t} = selection.getRangeAt( 0 );\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tanchorElement.contains( commonAncestorContainer )\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tanchorElement.focus();\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\tfunction onMouseLeave( { buttons, target } ) {\n\t\t\t\t// The primary button must be pressed to initiate selection.\n\t\t\t\t// See https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons\n\t\t\t\tif ( buttons !== 1 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Check the attribute, not the contentEditable attribute. All\n\t\t\t\t// child elements of the content editable wrapper are editable\n\t\t\t\t// and return true for this property. We only want to start\n\t\t\t\t// multi selecting when the mouse leaves the wrapper.\n\t\t\t\tif ( ! target.getAttribute( 'contenteditable' ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( ! isSelectionEnabled() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tanchorElement = ownerDocument.activeElement;\n\t\t\t\tstartMultiSelect();\n\n\t\t\t\t// `onSelectionStart` is called after `mousedown` and\n\t\t\t\t// `mouseleave` (from a block). The selection ends when\n\t\t\t\t// `mouseup` happens anywhere in the window.\n\t\t\t\tdefaultView.addEventListener( 'mouseup', onMouseUp );\n\n\t\t\t\t// Allow cross contentEditable selection by temporarily making\n\t\t\t\t// all content editable. We can't rely on using the store and\n\t\t\t\t// React because re-rending happens too slowly. We need to be\n\t\t\t\t// able to select across instances immediately.\n\t\t\t\tsetContentEditableWrapper( node, true );\n\t\t\t}\n\n\t\t\tnode.addEventListener( 'mouseout', onMouseLeave );\n\n\t\t\treturn () => {\n\t\t\t\tnode.removeEventListener( 'mouseout', onMouseLeave );\n\t\t\t\tdefaultView.removeEventListener( 'mouseup', onMouseUp );\n\t\t\t\tdefaultView.cancelAnimationFrame( rafId );\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tstartMultiSelect,\n\t\t\tstopMultiSelect,\n\t\t\tisSelectionEnabled,\n\t\t\thasMultiSelection,\n\t\t]\n\t);\n}\n"]}

package/build-module/components/writing-flow/use-input.js

@@ -0,0 +1,104 @@
+/**
+ * WordPress dependencies
+ */
+import { useSelect, useDispatch } from '@wordpress/data';
+import { useRefEffect } from '@wordpress/compose';
+import { ENTER, BACKSPACE, DELETE } from '@wordpress/keycodes';
+import { createBlock, getDefaultBlockName } from '@wordpress/blocks';
+/**
+ * Internal dependencies
+ */
+
+import { store as blockEditorStore } from '../../store';
+/**
+ * Handles input for selections across blocks.
+ */
+
+export default function useInput() {
+  const {
+    __unstableIsFullySelected,
+    getSelectedBlockClientIds,
+    __unstableIsSelectionMergeable,
+    hasMultiSelection
+  } = useSelect(blockEditorStore);
+  const {
+    replaceBlocks,
+    __unstableSplitSelection,
+    removeBlocks,
+    __unstableDeleteSelection,
+    __unstableExpandSelection
+  } = useDispatch(blockEditorStore);
+  return useRefEffect(node => {
+    function onKeyDown(event) {
+      if (event.defaultPrevented) {
+        return;
+      }
+
+      if (!hasMultiSelection()) {
+        return;
+      }
+
+      if (event.keyCode === ENTER) {
+        node.contentEditable = false;
+        event.preventDefault();
+
+        if (__unstableIsFullySelected()) {
+          replaceBlocks(getSelectedBlockClientIds(), createBlock(getDefaultBlockName()));
+        } else {
+          __unstableSplitSelection();
+        }
+      } else if (event.keyCode === BACKSPACE || event.keyCode === DELETE) {
+        node.contentEditable = false;
+        event.preventDefault();
+
+        if (__unstableIsFullySelected()) {
+          removeBlocks(getSelectedBlockClientIds());
+        } else if (__unstableIsSelectionMergeable()) {
+          __unstableDeleteSelection(event.keyCode === DELETE);
+        } else {
+          __unstableExpandSelection();
+        }
+      } else if ( // If key.length is longer than 1, it's a control key that doesn't
+      // input anything.
+      event.key.length === 1 && !(event.metaKey || event.ctrlKey)) {
+        node.contentEditable = false;
+
+        if (__unstableIsSelectionMergeable()) {
+          __unstableDeleteSelection(event.keyCode === DELETE);
+        } else {
+          event.preventDefault(); // Safari does not stop default behaviour with either
+          // event.preventDefault() or node.contentEditable = false, so
+          // remove the selection to stop browser manipulation.
+
+          node.ownerDocument.defaultView.getSelection().removeAllRanges();
+        }
+      }
+    }
+
+    function onCompositionStart(event) {
+      if (!hasMultiSelection()) {
+        return;
+      }
+
+      node.contentEditable = false;
+
+      if (__unstableIsSelectionMergeable()) {
+        __unstableDeleteSelection();
+      } else {
+        event.preventDefault(); // Safari does not stop default behaviour with either
+        // event.preventDefault() or node.contentEditable = false, so
+        // remove the selection to stop browser manipulation.
+
+        node.ownerDocument.defaultView.getSelection().removeAllRanges();
+      }
+    }
+
+    node.addEventListener('keydown', onKeyDown);
+    node.addEventListener('compositionstart', onCompositionStart);
+    return () => {
+      node.removeEventListener('keydown', onKeyDown);
+      node.removeEventListener('compositionstart', onCompositionStart);
+    };
+  }, []);
+}
+//# sourceMappingURL=use-input.js.map

package/build-module/components/writing-flow/use-input.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-input.js"],"names":["useSelect","useDispatch","useRefEffect","ENTER","BACKSPACE","DELETE","createBlock","getDefaultBlockName","store","blockEditorStore","useInput","__unstableIsFullySelected","getSelectedBlockClientIds","__unstableIsSelectionMergeable","hasMultiSelection","replaceBlocks","__unstableSplitSelection","removeBlocks","__unstableDeleteSelection","__unstableExpandSelection","node","onKeyDown","event","defaultPrevented","keyCode","contentEditable","preventDefault","key","length","metaKey","ctrlKey","ownerDocument","defaultView","getSelection","removeAllRanges","onCompositionStart","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\nimport { ENTER, BACKSPACE, DELETE } from '@wordpress/keycodes';\nimport { createBlock, getDefaultBlockName } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\n/**\n * Handles input for selections across blocks.\n */\nexport default function useInput() {\n\tconst {\n\t\t__unstableIsFullySelected,\n\t\tgetSelectedBlockClientIds,\n\t\t__unstableIsSelectionMergeable,\n\t\thasMultiSelection,\n\t} = useSelect( blockEditorStore );\n\tconst {\n\t\treplaceBlocks,\n\t\t__unstableSplitSelection,\n\t\tremoveBlocks,\n\t\t__unstableDeleteSelection,\n\t\t__unstableExpandSelection,\n\t} = useDispatch( blockEditorStore );\n\n\treturn useRefEffect( ( node ) => {\n\t\tfunction onKeyDown( event ) {\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! hasMultiSelection() ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( event.keyCode === ENTER ) {\n\t\t\t\tnode.contentEditable = false;\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif ( __unstableIsFullySelected() ) {\n\t\t\t\t\treplaceBlocks(\n\t\t\t\t\t\tgetSelectedBlockClientIds(),\n\t\t\t\t\t\tcreateBlock( getDefaultBlockName() )\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\t__unstableSplitSelection();\n\t\t\t\t}\n\t\t\t} else if (\n\t\t\t\tevent.keyCode === BACKSPACE ||\n\t\t\t\tevent.keyCode === DELETE\n\t\t\t) {\n\t\t\t\tnode.contentEditable = false;\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif ( __unstableIsFullySelected() ) {\n\t\t\t\t\tremoveBlocks( getSelectedBlockClientIds() );\n\t\t\t\t} else if ( __unstableIsSelectionMergeable() ) {\n\t\t\t\t\t__unstableDeleteSelection( event.keyCode === DELETE );\n\t\t\t\t} else {\n\t\t\t\t\t__unstableExpandSelection();\n\t\t\t\t}\n\t\t\t} else if (\n\t\t\t\t// If key.length is longer than 1, it's a control key that doesn't\n\t\t\t\t// input anything.\n\t\t\t\tevent.key.length === 1 &&\n\t\t\t\t! ( event.metaKey || event.ctrlKey )\n\t\t\t) {\n\t\t\t\tnode.contentEditable = false;\n\t\t\t\tif ( __unstableIsSelectionMergeable() ) {\n\t\t\t\t\t__unstableDeleteSelection( event.keyCode === DELETE );\n\t\t\t\t} else {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t// Safari does not stop default behaviour with either\n\t\t\t\t\t// event.preventDefault() or node.contentEditable = false, so\n\t\t\t\t\t// remove the selection to stop browser manipulation.\n\t\t\t\t\tnode.ownerDocument.defaultView\n\t\t\t\t\t\t.getSelection()\n\t\t\t\t\t\t.removeAllRanges();\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfunction onCompositionStart( event ) {\n\t\t\tif ( ! hasMultiSelection() ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tnode.contentEditable = false;\n\n\t\t\tif ( __unstableIsSelectionMergeable() ) {\n\t\t\t\t__unstableDeleteSelection();\n\t\t\t} else {\n\t\t\t\tevent.preventDefault();\n\t\t\t\t// Safari does not stop default behaviour with either\n\t\t\t\t// event.preventDefault() or node.contentEditable = false, so\n\t\t\t\t// remove the selection to stop browser manipulation.\n\t\t\t\tnode.ownerDocument.defaultView.getSelection().removeAllRanges();\n\t\t\t}\n\t\t}\n\n\t\tnode.addEventListener( 'keydown', onKeyDown );\n\t\tnode.addEventListener( 'compositionstart', onCompositionStart );\n\t\treturn () => {\n\t\t\tnode.removeEventListener( 'keydown', onKeyDown );\n\t\t\tnode.removeEventListener( 'compositionstart', onCompositionStart );\n\t\t};\n\t}, [] );\n}\n"]}

package/build-module/components/writing-flow/use-multi-selection.js

@@ -14,28 +14,6 @@ import { useSelect } from '@wordpress/data';
 
 import { store as blockEditorStore } from '../../store';
 import { __unstableUseBlockRef as useBlockRef } from '../block-list/use-block-props/use-block-refs';
-/**
- * Returns for the deepest node at the start or end of a container node. Ignores
- * any text nodes that only contain HTML formatting whitespace.
- *
- * @param {Element} node Container to search.
- * @param {string}  type 'start' or 'end'.
- */
-
-function getDeepestNode(node, type) {
-  const child = type === 'start' ? 'firstChild' : 'lastChild';
-  const sibling = type === 'start' ? 'nextSibling' : 'previousSibling';
-
-  while (node[child]) {
-    node = node[child];
-
-    while (node.nodeType === node.TEXT_NODE && /^[ \t\n]*$/.test(node.data) && node[sibling]) {
-      node = node[sibling];
-    }
-  }
-
-  return node;
-}
 
 function selector(select) {
   const {
@@ -43,14 +21,16 @@ function selector(select) {
     getMultiSelectedBlockClientIds,
     hasMultiSelection,
     getSelectedBlockClientId,
-    getSelectedBlocksInitialCaretPosition
+    getSelectedBlocksInitialCaretPosition,
+    __unstableIsFullySelected
   } = select(blockEditorStore);
   return {
     isMultiSelecting: isMultiSelecting(),
     multiSelectedBlockClientIds: getMultiSelectedBlockClientIds(),
     hasMultiSelection: hasMultiSelection(),
     selectedBlockClientId: getSelectedBlockClientId(),
-    initialPosition: getSelectedBlocksInitialCaretPosition()
+    initialPosition: getSelectedBlocksInitialCaretPosition(),
+    isFullSelection: __unstableIsFullySelected()
   };
 }
 
@@ -60,7 +40,8 @@ export default function useMultiSelection() {
     isMultiSelecting,
     multiSelectedBlockClientIds,
     hasMultiSelection,
-    selectedBlockClientId
+    selectedBlockClientId,
+    isFullSelection
   } = useSelect(selector, []);
   const selectedRef = useBlockRef(selectedBlockClientId); // These must be in the right DOM order.
 
@@ -113,11 +94,9 @@ export default function useMultiSelection() {
 
     if (length < 2) {
       return;
-    } // The block refs might not be immediately available
-    // when dragging blocks into another block.
-
+    }
 
-    if (!startRef.current || !endRef.current) {
+    if (!isFullSelection) {
       return;
     } // Allow cross contentEditable selection by temporarily making
     // all content editable. We can't rely on using the store and
@@ -128,18 +107,20 @@ export default function useMultiSelection() {
     node.contentEditable = true; // For some browsers, like Safari, it is important that focus happens
     // BEFORE selection.
 
-    node.focus();
+    node.focus(); // The block refs might not be immediately available
+    // when dragging blocks into another block.
+
+    if (!startRef.current || !endRef.current) {
+      return;
+    }
+
     const selection = defaultView.getSelection();
     const range = ownerDocument.createRange(); // These must be in the right DOM order.
-    // The most stable way to select the whole block contents is to start
-    // and end at the deepest points.
 
-    const startNode = getDeepestNode(startRef.current, 'start');
-    const endNode = getDeepestNode(endRef.current, 'end');
-    range.setStartBefore(startNode);
-    range.setEndAfter(endNode);
+    range.setStartBefore(startRef.current);
+    range.setEndAfter(endRef.current);
     selection.removeAllRanges();
     selection.addRange(range);
-  }, [hasMultiSelection, isMultiSelecting, multiSelectedBlockClientIds, selectedBlockClientId, initialPosition]);
+  }, [hasMultiSelection, isMultiSelecting, multiSelectedBlockClientIds, selectedBlockClientId, initialPosition, isFullSelection]);
 }
 //# sourceMappingURL=use-multi-selection.js.map

package/build-module/components/writing-flow/use-multi-selection.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-multi-selection.js"],"names":["first","last","useRefEffect","useSelect","store","blockEditorStore","__unstableUseBlockRef","useBlockRef","getDeepestNode","node","type","child","sibling","nodeType","TEXT_NODE","test","data","selector","select","isMultiSelecting","getMultiSelectedBlockClientIds","hasMultiSelection","getSelectedBlockClientId","getSelectedBlocksInitialCaretPosition","multiSelectedBlockClientIds","selectedBlockClientId","initialPosition","useMultiSelection","selectedRef","startRef","endRef","ownerDocument","defaultView","undefined","selection","getSelection","rangeCount","isCollapsed","blockNode","current","startContainer","endContainer","getRangeAt","contains","removeAllRanges","length","contentEditable","focus","range","createRange","startNode","endNode","setStartBefore","setEndAfter","addRange"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,KAAT,EAAgBC,IAAhB,QAA4B,QAA5B;AAEA;AACA;AACA;;AACA,SAASC,YAAT,QAA6B,oBAA7B;AACA,SAASC,SAAT,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AACA,SAASC,qBAAqB,IAAIC,WAAlC,QAAqD,8CAArD;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,IAAzB,EAA+BC,IAA/B,EAAsC;AACrC,QAAMC,KAAK,GAAGD,IAAI,KAAK,OAAT,GAAmB,YAAnB,GAAkC,WAAhD;AACA,QAAME,OAAO,GAAGF,IAAI,KAAK,OAAT,GAAmB,aAAnB,GAAmC,iBAAnD;;AAEA,SAAQD,IAAI,CAAEE,KAAF,CAAZ,EAAwB;AACvBF,IAAAA,IAAI,GAAGA,IAAI,CAAEE,KAAF,CAAX;;AAEA,WACCF,IAAI,CAACI,QAAL,KAAkBJ,IAAI,CAACK,SAAvB,IACA,aAAaC,IAAb,CAAmBN,IAAI,CAACO,IAAxB,CADA,IAEAP,IAAI,CAAEG,OAAF,CAHL,EAIE;AACDH,MAAAA,IAAI,GAAGA,IAAI,CAAEG,OAAF,CAAX;AACA;AACD;;AAED,SAAOH,IAAP;AACA;;AAED,SAASQ,QAAT,CAAmBC,MAAnB,EAA4B;AAC3B,QAAM;AACLC,IAAAA,gBADK;AAELC,IAAAA,8BAFK;AAGLC,IAAAA,iBAHK;AAILC,IAAAA,wBAJK;AAKLC,IAAAA;AALK,MAMFL,MAAM,CAAEb,gBAAF,CANV;AAQA,SAAO;AACNc,IAAAA,gBAAgB,EAAEA,gBAAgB,EAD5B;AAENK,IAAAA,2BAA2B,EAAEJ,8BAA8B,EAFrD;AAGNC,IAAAA,iBAAiB,EAAEA,iBAAiB,EAH9B;AAINI,IAAAA,qBAAqB,EAAEH,wBAAwB,EAJzC;AAKNI,IAAAA,eAAe,EAAEH,qCAAqC;AALhD,GAAP;AAOA;;AAED,eAAe,SAASI,iBAAT,GAA6B;AAC3C,QAAM;AACLD,IAAAA,eADK;AAELP,IAAAA,gBAFK;AAGLK,IAAAA,2BAHK;AAILH,IAAAA,iBAJK;AAKLI,IAAAA;AALK,MAMFtB,SAAS,CAAEc,QAAF,EAAY,EAAZ,CANb;AAOA,QAAMW,WAAW,GAAGrB,WAAW,CAAEkB,qBAAF,CAA/B,CAR2C,CAS3C;;AACA,QAAMI,QAAQ,GAAGtB,WAAW,CAAEP,KAAK,CAAEwB,2BAAF,CAAP,CAA5B;AACA,QAAMM,MAAM,GAAGvB,WAAW,CAAEN,IAAI,CAAEuB,2BAAF,CAAN,CAA1B;AAEA;AACD;AACA;AACA;;AACC,SAAOtB,YAAY,CAChBO,IAAF,IAAY;AACX,UAAM;AAAEsB,MAAAA;AAAF,QAAoBtB,IAA1B;AACA,UAAM;AAAEuB,MAAAA;AAAF,QAAkBD,aAAxB,CAFW,CAIX;AACA;AACA;;AACA,QAAKL,eAAe,KAAKO,SAApB,IAAiCP,eAAe,KAAK,IAA1D,EAAiE;AAChE;AACA;;AAED,QAAK,CAAEL,iBAAF,IAAuBF,gBAA5B,EAA+C;AAC9C,UAAK,CAAEM,qBAAF,IAA2BN,gBAAhC,EAAmD;AAClD;AACA;;AAED,YAAMe,SAAS,GAAGF,WAAW,CAACG,YAAZ,EAAlB;;AAEA,UAAKD,SAAS,CAACE,UAAV,IAAwB,CAAEF,SAAS,CAACG,WAAzC,EAAuD;AACtD,cAAMC,SAAS,GAAGV,WAAW,CAACW,OAA9B;AACA,cAAM;AACLC,UAAAA,cADK;AAELC,UAAAA;AAFK,YAGFP,SAAS,CAACQ,UAAV,CAAsB,CAAtB,CAHJ;;AAKA,YACC,CAAC,CAAEJ,SAAH,KACE,CAAEA,SAAS,CAACK,QAAV,CAAoBH,cAApB,CAAF,IACD,CAAEF,SAAS,CAACK,QAAV,CAAoBF,YAApB,CAFH,CADD,EAIE;AACDP,UAAAA,SAAS,CAACU,eAAV;AACA;AACD;;AAED;AACA;;AAED,UAAM;AAAEC,MAAAA;AAAF,QAAarB,2BAAnB;;AAEA,QAAKqB,MAAM,GAAG,CAAd,EAAkB;AACjB;AACA,KAzCU,CA2CX;AACA;;;AACA,QAAK,CAAEhB,QAAQ,CAACU,OAAX,IAAsB,CAAET,MAAM,CAACS,OAApC,EAA8C;AAC7C;AACA,KA/CU,CAiDX;AACA;AACA;AACA;;;AACA9B,IAAAA,IAAI,CAACqC,eAAL,GAAuB,IAAvB,CArDW,CAuDX;AACA;;AACArC,IAAAA,IAAI,CAACsC,KAAL;AAEA,UAAMb,SAAS,GAAGF,WAAW,CAACG,YAAZ,EAAlB;AACA,UAAMa,KAAK,GAAGjB,aAAa,CAACkB,WAAd,EAAd,CA5DW,CA8DX;AACA;AACA;;AACA,UAAMC,SAAS,GAAG1C,cAAc,CAAEqB,QAAQ,CAACU,OAAX,EAAoB,OAApB,CAAhC;AACA,UAAMY,OAAO,GAAG3C,cAAc,CAAEsB,MAAM,CAACS,OAAT,EAAkB,KAAlB,CAA9B;AAEAS,IAAAA,KAAK,CAACI,cAAN,CAAsBF,SAAtB;AACAF,IAAAA,KAAK,CAACK,WAAN,CAAmBF,OAAnB;AAEAjB,IAAAA,SAAS,CAACU,eAAV;AACAV,IAAAA,SAAS,CAACoB,QAAV,CAAoBN,KAApB;AACA,GA1EiB,EA2ElB,CACC3B,iBADD,EAECF,gBAFD,EAGCK,2BAHD,EAICC,qBAJD,EAKCC,eALD,CA3EkB,CAAnB;AAmFA","sourcesContent":["/**\n * External dependencies\n */\nimport { first, last } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useRefEffect } from '@wordpress/compose';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { __unstableUseBlockRef as useBlockRef } from '../block-list/use-block-props/use-block-refs';\n\n/**\n * Returns for the deepest node at the start or end of a container node. Ignores\n * any text nodes that only contain HTML formatting whitespace.\n *\n * @param {Element} node Container to search.\n * @param {string}  type 'start' or 'end'.\n */\nfunction getDeepestNode( node, type ) {\n\tconst child = type === 'start' ? 'firstChild' : 'lastChild';\n\tconst sibling = type === 'start' ? 'nextSibling' : 'previousSibling';\n\n\twhile ( node[ child ] ) {\n\t\tnode = node[ child ];\n\n\t\twhile (\n\t\t\tnode.nodeType === node.TEXT_NODE &&\n\t\t\t/^[ \\t\\n]*$/.test( node.data ) &&\n\t\t\tnode[ sibling ]\n\t\t) {\n\t\t\tnode = node[ sibling ];\n\t\t}\n\t}\n\n\treturn node;\n}\n\nfunction selector( select ) {\n\tconst {\n\t\tisMultiSelecting,\n\t\tgetMultiSelectedBlockClientIds,\n\t\thasMultiSelection,\n\t\tgetSelectedBlockClientId,\n\t\tgetSelectedBlocksInitialCaretPosition,\n\t} = select( blockEditorStore );\n\n\treturn {\n\t\tisMultiSelecting: isMultiSelecting(),\n\t\tmultiSelectedBlockClientIds: getMultiSelectedBlockClientIds(),\n\t\thasMultiSelection: hasMultiSelection(),\n\t\tselectedBlockClientId: getSelectedBlockClientId(),\n\t\tinitialPosition: getSelectedBlocksInitialCaretPosition(),\n\t};\n}\n\nexport default function useMultiSelection() {\n\tconst {\n\t\tinitialPosition,\n\t\tisMultiSelecting,\n\t\tmultiSelectedBlockClientIds,\n\t\thasMultiSelection,\n\t\tselectedBlockClientId,\n\t} = useSelect( selector, [] );\n\tconst selectedRef = useBlockRef( selectedBlockClientId );\n\t// These must be in the right DOM order.\n\tconst startRef = useBlockRef( first( multiSelectedBlockClientIds ) );\n\tconst endRef = useBlockRef( last( multiSelectedBlockClientIds ) );\n\n\t/**\n\t * When the component updates, and there is multi selection, we need to\n\t * select the entire block contents.\n\t */\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView } = ownerDocument;\n\n\t\t\t// Allow initialPosition to bypass focus behavior. This is useful\n\t\t\t// for the list view or other areas where we don't want to transfer\n\t\t\t// focus to the editor canvas.\n\t\t\tif ( initialPosition === undefined || initialPosition === null ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! hasMultiSelection || isMultiSelecting ) {\n\t\t\t\tif ( ! selectedBlockClientId || isMultiSelecting ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst selection = defaultView.getSelection();\n\n\t\t\t\tif ( selection.rangeCount && ! selection.isCollapsed ) {\n\t\t\t\t\tconst blockNode = selectedRef.current;\n\t\t\t\t\tconst {\n\t\t\t\t\t\tstartContainer,\n\t\t\t\t\t\tendContainer,\n\t\t\t\t\t} = selection.getRangeAt( 0 );\n\n\t\t\t\t\tif (\n\t\t\t\t\t\t!! blockNode &&\n\t\t\t\t\t\t( ! blockNode.contains( startContainer ) ||\n\t\t\t\t\t\t\t! blockNode.contains( endContainer ) )\n\t\t\t\t\t) {\n\t\t\t\t\t\tselection.removeAllRanges();\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { length } = multiSelectedBlockClientIds;\n\n\t\t\tif ( length < 2 ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The block refs might not be immediately available\n\t\t\t// when dragging blocks into another block.\n\t\t\tif ( ! startRef.current || ! endRef.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Allow cross contentEditable selection by temporarily making\n\t\t\t// all content editable. We can't rely on using the store and\n\t\t\t// React because re-rending happens too slowly. We need to be\n\t\t\t// able to select across instances immediately.\n\t\t\tnode.contentEditable = true;\n\n\t\t\t// For some browsers, like Safari, it is important that focus happens\n\t\t\t// BEFORE selection.\n\t\t\tnode.focus();\n\n\t\t\tconst selection = defaultView.getSelection();\n\t\t\tconst range = ownerDocument.createRange();\n\n\t\t\t// These must be in the right DOM order.\n\t\t\t// The most stable way to select the whole block contents is to start\n\t\t\t// and end at the deepest points.\n\t\t\tconst startNode = getDeepestNode( startRef.current, 'start' );\n\t\t\tconst endNode = getDeepestNode( endRef.current, 'end' );\n\n\t\t\trange.setStartBefore( startNode );\n\t\t\trange.setEndAfter( endNode );\n\n\t\t\tselection.removeAllRanges();\n\t\t\tselection.addRange( range );\n\t\t},\n\t\t[\n\t\t\thasMultiSelection,\n\t\t\tisMultiSelecting,\n\t\t\tmultiSelectedBlockClientIds,\n\t\t\tselectedBlockClientId,\n\t\t\tinitialPosition,\n\t\t]\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-multi-selection.js"],"names":["first","last","useRefEffect","useSelect","store","blockEditorStore","__unstableUseBlockRef","useBlockRef","selector","select","isMultiSelecting","getMultiSelectedBlockClientIds","hasMultiSelection","getSelectedBlockClientId","getSelectedBlocksInitialCaretPosition","__unstableIsFullySelected","multiSelectedBlockClientIds","selectedBlockClientId","initialPosition","isFullSelection","useMultiSelection","selectedRef","startRef","endRef","node","ownerDocument","defaultView","undefined","selection","getSelection","rangeCount","isCollapsed","blockNode","current","startContainer","endContainer","getRangeAt","contains","removeAllRanges","length","contentEditable","focus","range","createRange","setStartBefore","setEndAfter","addRange"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { first, last } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useRefEffect } from '@wordpress/compose';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { __unstableUseBlockRef as useBlockRef } from '../block-list/use-block-props/use-block-refs';\n\nfunction selector( select ) {\n\tconst {\n\t\tisMultiSelecting,\n\t\tgetMultiSelectedBlockClientIds,\n\t\thasMultiSelection,\n\t\tgetSelectedBlockClientId,\n\t\tgetSelectedBlocksInitialCaretPosition,\n\t\t__unstableIsFullySelected,\n\t} = select( blockEditorStore );\n\n\treturn {\n\t\tisMultiSelecting: isMultiSelecting(),\n\t\tmultiSelectedBlockClientIds: getMultiSelectedBlockClientIds(),\n\t\thasMultiSelection: hasMultiSelection(),\n\t\tselectedBlockClientId: getSelectedBlockClientId(),\n\t\tinitialPosition: getSelectedBlocksInitialCaretPosition(),\n\t\tisFullSelection: __unstableIsFullySelected(),\n\t};\n}\n\nexport default function useMultiSelection() {\n\tconst {\n\t\tinitialPosition,\n\t\tisMultiSelecting,\n\t\tmultiSelectedBlockClientIds,\n\t\thasMultiSelection,\n\t\tselectedBlockClientId,\n\t\tisFullSelection,\n\t} = useSelect( selector, [] );\n\tconst selectedRef = useBlockRef( selectedBlockClientId );\n\t// These must be in the right DOM order.\n\tconst startRef = useBlockRef( first( multiSelectedBlockClientIds ) );\n\tconst endRef = useBlockRef( last( multiSelectedBlockClientIds ) );\n\n\t/**\n\t * When the component updates, and there is multi selection, we need to\n\t * select the entire block contents.\n\t */\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView } = ownerDocument;\n\n\t\t\t// Allow initialPosition to bypass focus behavior. This is useful\n\t\t\t// for the list view or other areas where we don't want to transfer\n\t\t\t// focus to the editor canvas.\n\t\t\tif ( initialPosition === undefined || initialPosition === null ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! hasMultiSelection || isMultiSelecting ) {\n\t\t\t\tif ( ! selectedBlockClientId || isMultiSelecting ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst selection = defaultView.getSelection();\n\n\t\t\t\tif ( selection.rangeCount && ! selection.isCollapsed ) {\n\t\t\t\t\tconst blockNode = selectedRef.current;\n\t\t\t\t\tconst {\n\t\t\t\t\t\tstartContainer,\n\t\t\t\t\t\tendContainer,\n\t\t\t\t\t} = selection.getRangeAt( 0 );\n\n\t\t\t\t\tif (\n\t\t\t\t\t\t!! blockNode &&\n\t\t\t\t\t\t( ! blockNode.contains( startContainer ) ||\n\t\t\t\t\t\t\t! blockNode.contains( endContainer ) )\n\t\t\t\t\t) {\n\t\t\t\t\t\tselection.removeAllRanges();\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { length } = multiSelectedBlockClientIds;\n\n\t\t\tif ( length < 2 ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! isFullSelection ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Allow cross contentEditable selection by temporarily making\n\t\t\t// all content editable. We can't rely on using the store and\n\t\t\t// React because re-rending happens too slowly. We need to be\n\t\t\t// able to select across instances immediately.\n\t\t\tnode.contentEditable = true;\n\n\t\t\t// For some browsers, like Safari, it is important that focus happens\n\t\t\t// BEFORE selection.\n\t\t\tnode.focus();\n\n\t\t\t// The block refs might not be immediately available\n\t\t\t// when dragging blocks into another block.\n\t\t\tif ( ! startRef.current || ! endRef.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst selection = defaultView.getSelection();\n\t\t\tconst range = ownerDocument.createRange();\n\n\t\t\t// These must be in the right DOM order.\n\t\t\trange.setStartBefore( startRef.current );\n\t\t\trange.setEndAfter( endRef.current );\n\n\t\t\tselection.removeAllRanges();\n\t\t\tselection.addRange( range );\n\t\t},\n\t\t[\n\t\t\thasMultiSelection,\n\t\t\tisMultiSelecting,\n\t\t\tmultiSelectedBlockClientIds,\n\t\t\tselectedBlockClientId,\n\t\t\tinitialPosition,\n\t\t\tisFullSelection,\n\t\t]\n\t);\n}\n"]}

package/build-module/components/writing-flow/use-selection-observer.js

@@ -0,0 +1,150 @@
+/**
+ * WordPress dependencies
+ */
+import { useSelect, useDispatch } from '@wordpress/data';
+import { useRefEffect } from '@wordpress/compose';
+/**
+ * Internal dependencies
+ */
+
+import { store as blockEditorStore } from '../../store';
+import { getBlockClientId } from '../../utils/dom';
+/**
+ * Extract the selection start node from the selection. When the anchor node is
+ * not a text node, the selection offset is the index of a child node.
+ *
+ * @param {Selection} selection The selection.
+ *
+ * @return {Element} The selection start node.
+ */
+
+function extractSelectionStartNode(selection) {
+  const {
+    anchorNode,
+    anchorOffset
+  } = selection;
+
+  if (anchorNode.nodeType === anchorNode.TEXT_NODE) {
+    return anchorNode;
+  }
+
+  return anchorNode.childNodes[anchorOffset];
+}
+/**
+ * Extract the selection end node from the selection. When the focus node is not
+ * a text node, the selection offset is the index of a child node. The selection
+ * reaches up to but excluding that child node.
+ *
+ * @param {Selection} selection The selection.
+ *
+ * @return {Element} The selection start node.
+ */
+
+
+function extractSelectionEndNode(selection) {
+  const {
+    focusNode,
+    focusOffset
+  } = selection;
+
+  if (focusNode.nodeType === focusNode.TEXT_NODE) {
+    return focusNode;
+  }
+
+  return focusNode.childNodes[focusOffset - 1];
+}
+
+function findDepth(a, b) {
+  let depth = 0;
+
+  while (a[depth] === b[depth]) {
+    depth++;
+  }
+
+  return depth;
+}
+/**
+ * Sets the `contenteditable` wrapper element to `value`.
+ *
+ * @param {HTMLElement} node  Block element.
+ * @param {boolean}     value `contentEditable` value (true or false)
+ */
+
+
+function setContentEditableWrapper(node, value) {
+  node.contentEditable = value; // Firefox doesn't automatically move focus.
+
+  if (value) node.focus();
+}
+/**
+ * Sets a multi-selection based on the native selection across blocks.
+ */
+
+
+export default function useSelectionObserver() {
+  const {
+    multiSelect,
+    selectBlock,
+    selectionChange
+  } = useDispatch(blockEditorStore);
+  const {
+    getBlockParents
+  } = useSelect(blockEditorStore);
+  return useRefEffect(node => {
+    const {
+      ownerDocument
+    } = node;
+    const {
+      defaultView
+    } = ownerDocument;
+
+    function onSelectionChange() {
+      const selection = defaultView.getSelection(); // If no selection is found, end multi selection and disable the
+      // contentEditable wrapper.
+
+      if (!selection.rangeCount || selection.isCollapsed) {
+        setContentEditableWrapper(node, false);
+        return;
+      }
+
+      const clientId = getBlockClientId(extractSelectionStartNode(selection));
+      const endClientId = getBlockClientId(extractSelectionEndNode(selection));
+      const isSingularSelection = clientId === endClientId;
+
+      if (isSingularSelection) {
+        selectBlock(clientId);
+      } else {
+        const startPath = [...getBlockParents(clientId), clientId];
+        const endPath = [...getBlockParents(endClientId), endClientId];
+        const depth = findDepth(startPath, endPath);
+        multiSelect(startPath[depth], endPath[depth]);
+      }
+    }
+
+    function addListeners() {
+      ownerDocument.addEventListener('selectionchange', onSelectionChange);
+      defaultView.addEventListener('mouseup', onSelectionChange);
+    }
+
+    function removeListeners() {
+      ownerDocument.removeEventListener('selectionchange', onSelectionChange);
+      defaultView.removeEventListener('mouseup', onSelectionChange);
+    }
+
+    function resetListeners() {
+      removeListeners();
+      addListeners();
+    }
+
+    addListeners(); // We must allow rich text to set selection first. This ensures that
+    // our `selectionchange` listener is always reset to be called after
+    // the rich text one.
+
+    node.addEventListener('focusin', resetListeners);
+    return () => {
+      removeListeners();
+      node.removeEventListener('focusin', resetListeners);
+    };
+  }, [multiSelect, selectBlock, selectionChange, getBlockParents]);
+}
+//# sourceMappingURL=use-selection-observer.js.map

package/build-module/components/writing-flow/use-selection-observer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-selection-observer.js"],"names":["useSelect","useDispatch","useRefEffect","store","blockEditorStore","getBlockClientId","extractSelectionStartNode","selection","anchorNode","anchorOffset","nodeType","TEXT_NODE","childNodes","extractSelectionEndNode","focusNode","focusOffset","findDepth","a","b","depth","setContentEditableWrapper","node","value","contentEditable","focus","useSelectionObserver","multiSelect","selectBlock","selectionChange","getBlockParents","ownerDocument","defaultView","onSelectionChange","getSelection","rangeCount","isCollapsed","clientId","endClientId","isSingularSelection","startPath","endPath","addListeners","addEventListener","removeListeners","removeEventListener","resetListeners"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { getBlockClientId } from '../../utils/dom';\n\n/**\n * Extract the selection start node from the selection. When the anchor node is\n * not a text node, the selection offset is the index of a child node.\n *\n * @param {Selection} selection The selection.\n *\n * @return {Element} The selection start node.\n */\nfunction extractSelectionStartNode( selection ) {\n\tconst { anchorNode, anchorOffset } = selection;\n\n\tif ( anchorNode.nodeType === anchorNode.TEXT_NODE ) {\n\t\treturn anchorNode;\n\t}\n\n\treturn anchorNode.childNodes[ anchorOffset ];\n}\n\n/**\n * Extract the selection end node from the selection. When the focus node is not\n * a text node, the selection offset is the index of a child node. The selection\n * reaches up to but excluding that child node.\n *\n * @param {Selection} selection The selection.\n *\n * @return {Element} The selection start node.\n */\nfunction extractSelectionEndNode( selection ) {\n\tconst { focusNode, focusOffset } = selection;\n\n\tif ( focusNode.nodeType === focusNode.TEXT_NODE ) {\n\t\treturn focusNode;\n\t}\n\n\treturn focusNode.childNodes[ focusOffset - 1 ];\n}\n\nfunction findDepth( a, b ) {\n\tlet depth = 0;\n\n\twhile ( a[ depth ] === b[ depth ] ) {\n\t\tdepth++;\n\t}\n\n\treturn depth;\n}\n\n/**\n * Sets the `contenteditable` wrapper element to `value`.\n *\n * @param {HTMLElement} node  Block element.\n * @param {boolean}     value `contentEditable` value (true or false)\n */\nfunction setContentEditableWrapper( node, value ) {\n\tnode.contentEditable = value;\n\t// Firefox doesn't automatically move focus.\n\tif ( value ) node.focus();\n}\n\n/**\n * Sets a multi-selection based on the native selection across blocks.\n */\nexport default function useSelectionObserver() {\n\tconst { multiSelect, selectBlock, selectionChange } = useDispatch(\n\t\tblockEditorStore\n\t);\n\tconst { getBlockParents } = useSelect( blockEditorStore );\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView } = ownerDocument;\n\n\t\t\tfunction onSelectionChange() {\n\t\t\t\tconst selection = defaultView.getSelection();\n\n\t\t\t\t// If no selection is found, end multi selection and disable the\n\t\t\t\t// contentEditable wrapper.\n\t\t\t\tif ( ! selection.rangeCount || selection.isCollapsed ) {\n\t\t\t\t\tsetContentEditableWrapper( node, false );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst clientId = getBlockClientId(\n\t\t\t\t\textractSelectionStartNode( selection )\n\t\t\t\t);\n\t\t\t\tconst endClientId = getBlockClientId(\n\t\t\t\t\textractSelectionEndNode( selection )\n\t\t\t\t);\n\t\t\t\tconst isSingularSelection = clientId === endClientId;\n\n\t\t\t\tif ( isSingularSelection ) {\n\t\t\t\t\tselectBlock( clientId );\n\t\t\t\t} else {\n\t\t\t\t\tconst startPath = [\n\t\t\t\t\t\t...getBlockParents( clientId ),\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t];\n\t\t\t\t\tconst endPath = [\n\t\t\t\t\t\t...getBlockParents( endClientId ),\n\t\t\t\t\t\tendClientId,\n\t\t\t\t\t];\n\t\t\t\t\tconst depth = findDepth( startPath, endPath );\n\n\t\t\t\t\tmultiSelect( startPath[ depth ], endPath[ depth ] );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction addListeners() {\n\t\t\t\townerDocument.addEventListener(\n\t\t\t\t\t'selectionchange',\n\t\t\t\t\tonSelectionChange\n\t\t\t\t);\n\t\t\t\tdefaultView.addEventListener( 'mouseup', onSelectionChange );\n\t\t\t}\n\n\t\t\tfunction removeListeners() {\n\t\t\t\townerDocument.removeEventListener(\n\t\t\t\t\t'selectionchange',\n\t\t\t\t\tonSelectionChange\n\t\t\t\t);\n\t\t\t\tdefaultView.removeEventListener( 'mouseup', onSelectionChange );\n\t\t\t}\n\n\t\t\tfunction resetListeners() {\n\t\t\t\tremoveListeners();\n\t\t\t\taddListeners();\n\t\t\t}\n\n\t\t\taddListeners();\n\t\t\t// We must allow rich text to set selection first. This ensures that\n\t\t\t// our `selectionchange` listener is always reset to be called after\n\t\t\t// the rich text one.\n\t\t\tnode.addEventListener( 'focusin', resetListeners );\n\t\t\treturn () => {\n\t\t\t\tremoveListeners();\n\t\t\t\tnode.removeEventListener( 'focusin', resetListeners );\n\t\t\t};\n\t\t},\n\t\t[ multiSelect, selectBlock, selectionChange, getBlockParents ]\n\t);\n}\n"]}

package/build-module/components/writing-flow/use-tab-nav.js

@@ -3,7 +3,7 @@ import { createElement } from "@wordpress/element";
 /**
  * WordPress dependencies
  */
-import { focus } from '@wordpress/dom';
+import { focus, isFormElement } from '@wordpress/dom';
 import { TAB, ESCAPE } from '@wordpress/keycodes';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { useRefEffect, useMergeRefs } from '@wordpress/compose';
@@ -13,14 +13,6 @@ import { useRef } from '@wordpress/element';
  */
 
 import { store as blockEditorStore } from '../../store';
-
-function isFormElement(element) {
-  const {
-    tagName
-  } = element;
-  return tagName === 'INPUT' || tagName === 'BUTTON' || tagName === 'SELECT' || tagName === 'TEXTAREA';
-}
-
 export default function useTabNav() {
   const container = useRef();
   const focusCaptureBeforeRef = useRef();