@wordpress/block-editor 8.4.0 → 8.5.2

package/build-module/components/rich-text/use-input-rules.js

@@ -1,9 +1,14 @@
+/**
+ * External dependencies
+ */
+import { findKey } from 'lodash';
 /**
  * WordPress dependencies
  */
+
 import { useRef } from '@wordpress/element';
 import { useRefEffect } from '@wordpress/compose';
-import { slice, toHTMLString } from '@wordpress/rich-text';
+import { insert, toHTMLString } from '@wordpress/rich-text';
 import { getBlockTransforms, findTransform } from '@wordpress/blocks';
 import { useDispatch } from '@wordpress/data';
 /**
@@ -11,7 +16,31 @@ import { useDispatch } from '@wordpress/data';
  */
 
 import { store as blockEditorStore } from '../../store';
-import { preventEventDiscovery } from './prevent-event-discovery';
+import { preventEventDiscovery } from './prevent-event-discovery'; // A robust way to retain selection position through various
+// transforms is to insert a special character at the position and
+// then recover it.
+
+const START_OF_SELECTED_AREA = '\u0086';
+
+function findSelection(blocks) {
+  let i = blocks.length;
+
+  while (i--) {
+    const attributeKey = findKey(blocks[i].attributes, v => typeof v === 'string' && v.indexOf(START_OF_SELECTED_AREA) !== -1);
+
+    if (attributeKey) {
+      blocks[i].attributes[attributeKey] = blocks[i].attributes[attributeKey].replace(START_OF_SELECTED_AREA, '');
+      return blocks[i].clientId;
+    }
+
+    const nestedSelection = findSelection(blocks[i].innerBlocks);
+
+    if (nestedSelection) {
+      return nestedSelection;
+    }
+  }
+}
+
 export function useInputRules(props) {
   const {
     __unstableMarkLastChangeAsPersistent,
@@ -23,7 +52,8 @@ export function useInputRules(props) {
     function inputRule() {
       const {
         value,
-        onReplace
+        onReplace,
+        selectionChange
       } = propsRef.current;
 
       if (!onReplace) {
@@ -59,9 +89,10 @@ export function useInputRules(props) {
       }
 
       const content = toHTMLString({
-        value: slice(value, start, text.length)
+        value: insert(value, START_OF_SELECTED_AREA, 0, start)
       });
       const block = transformation.transform(content);
+      selectionChange(findSelection([block]));
       onReplace([block]);
 
       __unstableMarkAutomaticChange();

package/build-module/components/rich-text/use-input-rules.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/rich-text/use-input-rules.js"],"names":["useRef","useRefEffect","slice","toHTMLString","getBlockTransforms","findTransform","useDispatch","store","blockEditorStore","preventEventDiscovery","useInputRules","props","__unstableMarkLastChangeAsPersistent","__unstableMarkAutomaticChange","propsRef","current","element","inputRule","value","onReplace","start","text","characterBefore","trimmedTextBefore","trim","prefixTransforms","filter","type","transformation","prefix","content","length","block","transform","onInput","event","inputType","onChange","__unstableAllowPrefixTransformations","formatTypes","transformed","reduce","accumlator","__unstableInputRule","activeFormats","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\nimport { useRefEffect } from '@wordpress/compose';\nimport { slice, toHTMLString } from '@wordpress/rich-text';\nimport { getBlockTransforms, findTransform } from '@wordpress/blocks';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { preventEventDiscovery } from './prevent-event-discovery';\n\nexport function useInputRules( props ) {\n\tconst {\n\t\t__unstableMarkLastChangeAsPersistent,\n\t\t__unstableMarkAutomaticChange,\n\t} = useDispatch( blockEditorStore );\n\tconst propsRef = useRef( props );\n\tpropsRef.current = props;\n\treturn useRefEffect( ( element ) => {\n\t\tfunction inputRule() {\n\t\t\tconst { value, onReplace } = propsRef.current;\n\n\t\t\tif ( ! onReplace ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { start, text } = value;\n\t\t\tconst characterBefore = text.slice( start - 1, start );\n\n\t\t\t// The character right before the caret must be a plain space.\n\t\t\tif ( characterBefore !== ' ' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst trimmedTextBefore = text.slice( 0, start ).trim();\n\t\t\tconst prefixTransforms = getBlockTransforms( 'from' ).filter(\n\t\t\t\t( { type } ) => type === 'prefix'\n\t\t\t);\n\t\t\tconst transformation = findTransform(\n\t\t\t\tprefixTransforms,\n\t\t\t\t( { prefix } ) => {\n\t\t\t\t\treturn trimmedTextBefore === prefix;\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tif ( ! transformation ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst content = toHTMLString( {\n\t\t\t\tvalue: slice( value, start, text.length ),\n\t\t\t} );\n\t\t\tconst block = transformation.transform( content );\n\n\t\t\tonReplace( [ block ] );\n\t\t\t__unstableMarkAutomaticChange();\n\t\t}\n\n\t\tfunction onInput( event ) {\n\t\t\tconst { inputType, type } = event;\n\t\t\tconst {\n\t\t\t\tvalue,\n\t\t\t\tonChange,\n\t\t\t\t__unstableAllowPrefixTransformations,\n\t\t\t\tformatTypes,\n\t\t\t} = propsRef.current;\n\n\t\t\t// Only run input rules when inserting text.\n\t\t\tif ( inputType !== 'insertText' && type !== 'compositionend' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( __unstableAllowPrefixTransformations && inputRule ) {\n\t\t\t\tinputRule();\n\t\t\t}\n\n\t\t\tconst transformed = formatTypes.reduce(\n\t\t\t\t( accumlator, { __unstableInputRule } ) => {\n\t\t\t\t\tif ( __unstableInputRule ) {\n\t\t\t\t\t\taccumlator = __unstableInputRule( accumlator );\n\t\t\t\t\t}\n\n\t\t\t\t\treturn accumlator;\n\t\t\t\t},\n\t\t\t\tpreventEventDiscovery( value )\n\t\t\t);\n\n\t\t\tif ( transformed !== value ) {\n\t\t\t\t__unstableMarkLastChangeAsPersistent();\n\t\t\t\tonChange( {\n\t\t\t\t\t...transformed,\n\t\t\t\t\tactiveFormats: value.activeFormats,\n\t\t\t\t} );\n\t\t\t\t__unstableMarkAutomaticChange();\n\t\t\t}\n\t\t}\n\n\t\telement.addEventListener( 'input', onInput );\n\t\telement.addEventListener( 'compositionend', onInput );\n\t\treturn () => {\n\t\t\telement.removeEventListener( 'input', onInput );\n\t\t\telement.removeEventListener( 'compositionend', onInput );\n\t\t};\n\t}, [] );\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/rich-text/use-input-rules.js"],"names":["findKey","useRef","useRefEffect","insert","toHTMLString","getBlockTransforms","findTransform","useDispatch","store","blockEditorStore","preventEventDiscovery","START_OF_SELECTED_AREA","findSelection","blocks","i","length","attributeKey","attributes","v","indexOf","replace","clientId","nestedSelection","innerBlocks","useInputRules","props","__unstableMarkLastChangeAsPersistent","__unstableMarkAutomaticChange","propsRef","current","element","inputRule","value","onReplace","selectionChange","start","text","characterBefore","slice","trimmedTextBefore","trim","prefixTransforms","filter","type","transformation","prefix","content","block","transform","onInput","event","inputType","onChange","__unstableAllowPrefixTransformations","formatTypes","transformed","reduce","accumlator","__unstableInputRule","activeFormats","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { findKey } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\nimport { useRefEffect } from '@wordpress/compose';\nimport { insert, toHTMLString } from '@wordpress/rich-text';\nimport { getBlockTransforms, findTransform } from '@wordpress/blocks';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { preventEventDiscovery } from './prevent-event-discovery';\n\n// A robust way to retain selection position through various\n// transforms is to insert a special character at the position and\n// then recover it.\nconst START_OF_SELECTED_AREA = '\\u0086';\n\nfunction findSelection( blocks ) {\n\tlet i = blocks.length;\n\n\twhile ( i-- ) {\n\t\tconst attributeKey = findKey(\n\t\t\tblocks[ i ].attributes,\n\t\t\t( v ) =>\n\t\t\t\ttypeof v === 'string' &&\n\t\t\t\tv.indexOf( START_OF_SELECTED_AREA ) !== -1\n\t\t);\n\n\t\tif ( attributeKey ) {\n\t\t\tblocks[ i ].attributes[ attributeKey ] = blocks[ i ].attributes[\n\t\t\t\tattributeKey\n\t\t\t].replace( START_OF_SELECTED_AREA, '' );\n\t\t\treturn blocks[ i ].clientId;\n\t\t}\n\n\t\tconst nestedSelection = findSelection( blocks[ i ].innerBlocks );\n\n\t\tif ( nestedSelection ) {\n\t\t\treturn nestedSelection;\n\t\t}\n\t}\n}\n\nexport function useInputRules( props ) {\n\tconst {\n\t\t__unstableMarkLastChangeAsPersistent,\n\t\t__unstableMarkAutomaticChange,\n\t} = useDispatch( blockEditorStore );\n\tconst propsRef = useRef( props );\n\tpropsRef.current = props;\n\treturn useRefEffect( ( element ) => {\n\t\tfunction inputRule() {\n\t\t\tconst { value, onReplace, selectionChange } = propsRef.current;\n\n\t\t\tif ( ! onReplace ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { start, text } = value;\n\t\t\tconst characterBefore = text.slice( start - 1, start );\n\n\t\t\t// The character right before the caret must be a plain space.\n\t\t\tif ( characterBefore !== ' ' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst trimmedTextBefore = text.slice( 0, start ).trim();\n\t\t\tconst prefixTransforms = getBlockTransforms( 'from' ).filter(\n\t\t\t\t( { type } ) => type === 'prefix'\n\t\t\t);\n\t\t\tconst transformation = findTransform(\n\t\t\t\tprefixTransforms,\n\t\t\t\t( { prefix } ) => {\n\t\t\t\t\treturn trimmedTextBefore === prefix;\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tif ( ! transformation ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst content = toHTMLString( {\n\t\t\t\tvalue: insert( value, START_OF_SELECTED_AREA, 0, start ),\n\t\t\t} );\n\t\t\tconst block = transformation.transform( content );\n\n\t\t\tselectionChange( findSelection( [ block ] ) );\n\t\t\tonReplace( [ block ] );\n\t\t\t__unstableMarkAutomaticChange();\n\t\t}\n\n\t\tfunction onInput( event ) {\n\t\t\tconst { inputType, type } = event;\n\t\t\tconst {\n\t\t\t\tvalue,\n\t\t\t\tonChange,\n\t\t\t\t__unstableAllowPrefixTransformations,\n\t\t\t\tformatTypes,\n\t\t\t} = propsRef.current;\n\n\t\t\t// Only run input rules when inserting text.\n\t\t\tif ( inputType !== 'insertText' && type !== 'compositionend' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( __unstableAllowPrefixTransformations && inputRule ) {\n\t\t\t\tinputRule();\n\t\t\t}\n\n\t\t\tconst transformed = formatTypes.reduce(\n\t\t\t\t( accumlator, { __unstableInputRule } ) => {\n\t\t\t\t\tif ( __unstableInputRule ) {\n\t\t\t\t\t\taccumlator = __unstableInputRule( accumlator );\n\t\t\t\t\t}\n\n\t\t\t\t\treturn accumlator;\n\t\t\t\t},\n\t\t\t\tpreventEventDiscovery( value )\n\t\t\t);\n\n\t\t\tif ( transformed !== value ) {\n\t\t\t\t__unstableMarkLastChangeAsPersistent();\n\t\t\t\tonChange( {\n\t\t\t\t\t...transformed,\n\t\t\t\t\tactiveFormats: value.activeFormats,\n\t\t\t\t} );\n\t\t\t\t__unstableMarkAutomaticChange();\n\t\t\t}\n\t\t}\n\n\t\telement.addEventListener( 'input', onInput );\n\t\telement.addEventListener( 'compositionend', onInput );\n\t\treturn () => {\n\t\t\telement.removeEventListener( 'input', onInput );\n\t\t\telement.removeEventListener( 'compositionend', onInput );\n\t\t};\n\t}, [] );\n}\n"]}

package/build-module/components/skip-to-selected-block/index.js

@@ -29,6 +29,10 @@ const SkipToSelectedBlock = _ref => {
     onClick: onClick
   }, __('Skip to the selected block')) : null;
 };
+/**
+ * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/skip-to-selected-block/README.md
+ */
+
 
 export default withSelect(select => {
   return {

package/build-module/components/skip-to-selected-block/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/skip-to-selected-block/index.js"],"names":["withSelect","__","Button","store","blockEditorStore","__unstableUseBlockRef","useBlockRef","SkipToSelectedBlock","selectedBlockClientId","ref","onClick","current","focus","select","getBlockSelectionStart"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,iBAA3B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,MAAT,QAAuB,uBAAvB;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AACA,SAASC,qBAAqB,IAAIC,WAAlC,QAAqD,8CAArD;;AAEA,MAAMC,mBAAmB,GAAG,QAAiC;AAAA,MAA/B;AAAEC,IAAAA;AAAF,GAA+B;AAC5D,QAAMC,GAAG,GAAGH,WAAW,CAAEE,qBAAF,CAAvB;;AACA,QAAME,OAAO,GAAG,MAAM;AACrBD,IAAAA,GAAG,CAACE,OAAJ,CAAYC,KAAZ;AACA,GAFD;;AAIA,SAAOJ,qBAAqB,GAC3B,cAAC,MAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,SAAS,EAAC,qCAFX;AAGC,IAAA,OAAO,EAAGE;AAHX,KAKGT,EAAE,CAAE,4BAAF,CALL,CAD2B,GAQxB,IARJ;AASA,CAfD;;AAiBA,eAAeD,UAAU,CAAIa,MAAF,IAAc;AACxC,SAAO;AACNL,IAAAA,qBAAqB,EAAEK,MAAM,CAC5BT,gBAD4B,CAAN,CAErBU,sBAFqB;AADjB,GAAP;AAKA,CANwB,CAAV,CAMVP,mBANU,CAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { withSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\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\nconst SkipToSelectedBlock = ( { selectedBlockClientId } ) => {\n\tconst ref = useBlockRef( selectedBlockClientId );\n\tconst onClick = () => {\n\t\tref.current.focus();\n\t};\n\n\treturn selectedBlockClientId ? (\n\t\t<Button\n\t\t\tvariant=\"secondary\"\n\t\t\tclassName=\"block-editor-skip-to-selected-block\"\n\t\t\tonClick={ onClick }\n\t\t>\n\t\t\t{ __( 'Skip to the selected block' ) }\n\t\t</Button>\n\t) : null;\n};\n\nexport default withSelect( ( select ) => {\n\treturn {\n\t\tselectedBlockClientId: select(\n\t\t\tblockEditorStore\n\t\t).getBlockSelectionStart(),\n\t};\n} )( SkipToSelectedBlock );\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/skip-to-selected-block/index.js"],"names":["withSelect","__","Button","store","blockEditorStore","__unstableUseBlockRef","useBlockRef","SkipToSelectedBlock","selectedBlockClientId","ref","onClick","current","focus","select","getBlockSelectionStart"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,iBAA3B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,MAAT,QAAuB,uBAAvB;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AACA,SAASC,qBAAqB,IAAIC,WAAlC,QAAqD,8CAArD;;AAEA,MAAMC,mBAAmB,GAAG,QAAiC;AAAA,MAA/B;AAAEC,IAAAA;AAAF,GAA+B;AAC5D,QAAMC,GAAG,GAAGH,WAAW,CAAEE,qBAAF,CAAvB;;AACA,QAAME,OAAO,GAAG,MAAM;AACrBD,IAAAA,GAAG,CAACE,OAAJ,CAAYC,KAAZ;AACA,GAFD;;AAIA,SAAOJ,qBAAqB,GAC3B,cAAC,MAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,SAAS,EAAC,qCAFX;AAGC,IAAA,OAAO,EAAGE;AAHX,KAKGT,EAAE,CAAE,4BAAF,CALL,CAD2B,GAQxB,IARJ;AASA,CAfD;AAiBA;AACA;AACA;;;AACA,eAAeD,UAAU,CAAIa,MAAF,IAAc;AACxC,SAAO;AACNL,IAAAA,qBAAqB,EAAEK,MAAM,CAC5BT,gBAD4B,CAAN,CAErBU,sBAFqB;AADjB,GAAP;AAKA,CANwB,CAAV,CAMVP,mBANU,CAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { withSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\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\nconst SkipToSelectedBlock = ( { selectedBlockClientId } ) => {\n\tconst ref = useBlockRef( selectedBlockClientId );\n\tconst onClick = () => {\n\t\tref.current.focus();\n\t};\n\n\treturn selectedBlockClientId ? (\n\t\t<Button\n\t\t\tvariant=\"secondary\"\n\t\t\tclassName=\"block-editor-skip-to-selected-block\"\n\t\t\tonClick={ onClick }\n\t\t>\n\t\t\t{ __( 'Skip to the selected block' ) }\n\t\t</Button>\n\t) : null;\n};\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/skip-to-selected-block/README.md\n */\nexport default withSelect( ( select ) => {\n\treturn {\n\t\tselectedBlockClientId: select(\n\t\t\tblockEditorStore\n\t\t).getBlockSelectionStart(),\n\t};\n} )( SkipToSelectedBlock );\n"]}

package/build-module/components/writing-flow/index.js

@@ -21,11 +21,15 @@ import useMultiSelection from './use-multi-selection';
 import useTabNav from './use-tab-nav';
 import useArrowNav from './use-arrow-nav';
 import useSelectAll from './use-select-all';
+import useDragSelection from './use-drag-selection';
+import useSelectionObserver from './use-selection-observer';
+import useClickSelection from './use-click-selection';
+import useInput from './use-input';
 import { store as blockEditorStore } from '../../store';
 export function useWritingFlow() {
   const [before, ref, after] = useTabNav();
   const hasMultiSelection = useSelect(select => select(blockEditorStore).hasMultiSelection(), []);
-  return [before, useMergeRefs([ref, useMultiSelection(), useSelectAll(), useArrowNav(), useRefEffect(node => {
+  return [before, useMergeRefs([ref, useInput(), useDragSelection(), useSelectionObserver(), useClickSelection(), useMultiSelection(), useSelectAll(), useArrowNav(), useRefEffect(node => {
     node.tabIndex = -1;
     node.contentEditable = hasMultiSelection;
 

package/build-module/components/writing-flow/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/index.js"],"names":["classNames","useSelect","__","useMergeRefs","useRefEffect","forwardRef","useMultiSelection","useTabNav","useArrowNav","useSelectAll","store","blockEditorStore","useWritingFlow","before","ref","after","hasMultiSelection","select","node","tabIndex","contentEditable","setAttribute","removeAttribute","WritingFlow","forwardedRef","children","props","className"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,YAAT,EAAuBC,YAAvB,QAA2C,oBAA3C;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,iBAAP,MAA8B,uBAA9B;AACA,OAAOC,SAAP,MAAsB,eAAtB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,OAAO,SAASC,cAAT,GAA0B;AAChC,QAAM,CAAEC,MAAF,EAAUC,GAAV,EAAeC,KAAf,IAAyBR,SAAS,EAAxC;AACA,QAAMS,iBAAiB,GAAGf,SAAS,CAChCgB,MAAF,IAAcA,MAAM,CAAEN,gBAAF,CAAN,CAA2BK,iBAA3B,EADoB,EAElC,EAFkC,CAAnC;AAKA,SAAO,CACNH,MADM,EAENV,YAAY,CAAE,CACbW,GADa,EAEbR,iBAAiB,EAFJ,EAGbG,YAAY,EAHC,EAIbD,WAAW,EAJE,EAKbJ,YAAY,CACTc,IAAF,IAAY;AACXA,IAAAA,IAAI,CAACC,QAAL,GAAgB,CAAC,CAAjB;AACAD,IAAAA,IAAI,CAACE,eAAL,GAAuBJ,iBAAvB;;AAEA,QAAK,CAAEA,iBAAP,EAA2B;AAC1B;AACA;;AAEDE,IAAAA,IAAI,CAACG,YAAL,CACC,YADD,EAECnB,EAAE,CAAE,0BAAF,CAFH;AAKA,WAAO,MAAM;AACZgB,MAAAA,IAAI,CAACI,eAAL,CAAsB,YAAtB;AACA,KAFD;AAGA,GAjBU,EAkBX,CAAEN,iBAAF,CAlBW,CALC,CAAF,CAFN,EA4BND,KA5BM,CAAP;AA8BA;;AAED,SAASQ,WAAT,OAA8CC,YAA9C,EAA6D;AAAA,MAAvC;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAAuC;AAC5D,QAAM,CAAEb,MAAF,EAAUC,GAAV,EAAeC,KAAf,IAAyBH,cAAc,EAA7C;AACA,SACC,8BACGC,MADH,EAEC,kCACMa,KADN;AAEC,IAAA,GAAG,EAAGvB,YAAY,CAAE,CAAEW,GAAF,EAAOU,YAAP,CAAF,CAFnB;AAGC,IAAA,SAAS,EAAGxB,UAAU,CACrB0B,KAAK,CAACC,SADe,EAErB,2BAFqB;AAHvB,MAQGF,QARH,CAFD,EAYGV,KAZH,CADD;AAgBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAeV,UAAU,CAAEkB,WAAF,CAAzB","sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useMultiSelection from './use-multi-selection';\nimport useTabNav from './use-tab-nav';\nimport useArrowNav from './use-arrow-nav';\nimport useSelectAll from './use-select-all';\nimport { store as blockEditorStore } from '../../store';\n\nexport function useWritingFlow() {\n\tconst [ before, ref, after ] = useTabNav();\n\tconst hasMultiSelection = useSelect(\n\t\t( select ) => select( blockEditorStore ).hasMultiSelection(),\n\t\t[]\n\t);\n\n\treturn [\n\t\tbefore,\n\t\tuseMergeRefs( [\n\t\t\tref,\n\t\t\tuseMultiSelection(),\n\t\t\tuseSelectAll(),\n\t\t\tuseArrowNav(),\n\t\t\tuseRefEffect(\n\t\t\t\t( node ) => {\n\t\t\t\t\tnode.tabIndex = -1;\n\t\t\t\t\tnode.contentEditable = hasMultiSelection;\n\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\tnode.setAttribute(\n\t\t\t\t\t\t'aria-label',\n\t\t\t\t\t\t__( 'Multiple selected blocks' )\n\t\t\t\t\t);\n\n\t\t\t\t\treturn () => {\n\t\t\t\t\t\tnode.removeAttribute( 'aria-label' );\n\t\t\t\t\t};\n\t\t\t\t},\n\t\t\t\t[ hasMultiSelection ]\n\t\t\t),\n\t\t] ),\n\t\tafter,\n\t];\n}\n\nfunction WritingFlow( { children, ...props }, forwardedRef ) {\n\tconst [ before, ref, after ] = useWritingFlow();\n\treturn (\n\t\t<>\n\t\t\t{ before }\n\t\t\t<div\n\t\t\t\t{ ...props }\n\t\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\t\tclassName={ classNames(\n\t\t\t\t\tprops.className,\n\t\t\t\t\t'block-editor-writing-flow'\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t\t{ after }\n\t\t</>\n\t);\n}\n\n/**\n * Handles selection and navigation across blocks. This component should be\n * wrapped around BlockList.\n *\n * @param {Object}    props          Component properties.\n * @param {WPElement} props.children Children to be rendered.\n */\nexport default forwardRef( WritingFlow );\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/index.js"],"names":["classNames","useSelect","__","useMergeRefs","useRefEffect","forwardRef","useMultiSelection","useTabNav","useArrowNav","useSelectAll","useDragSelection","useSelectionObserver","useClickSelection","useInput","store","blockEditorStore","useWritingFlow","before","ref","after","hasMultiSelection","select","node","tabIndex","contentEditable","setAttribute","removeAttribute","WritingFlow","forwardedRef","children","props","className"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,YAAT,EAAuBC,YAAvB,QAA2C,oBAA3C;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,iBAAP,MAA8B,uBAA9B;AACA,OAAOC,SAAP,MAAsB,eAAtB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,gBAAP,MAA6B,sBAA7B;AACA,OAAOC,oBAAP,MAAiC,0BAAjC;AACA,OAAOC,iBAAP,MAA8B,uBAA9B;AACA,OAAOC,QAAP,MAAqB,aAArB;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,OAAO,SAASC,cAAT,GAA0B;AAChC,QAAM,CAAEC,MAAF,EAAUC,GAAV,EAAeC,KAAf,IAAyBZ,SAAS,EAAxC;AACA,QAAMa,iBAAiB,GAAGnB,SAAS,CAChCoB,MAAF,IAAcA,MAAM,CAAEN,gBAAF,CAAN,CAA2BK,iBAA3B,EADoB,EAElC,EAFkC,CAAnC;AAKA,SAAO,CACNH,MADM,EAENd,YAAY,CAAE,CACbe,GADa,EAEbL,QAAQ,EAFK,EAGbH,gBAAgB,EAHH,EAIbC,oBAAoB,EAJP,EAKbC,iBAAiB,EALJ,EAMbN,iBAAiB,EANJ,EAObG,YAAY,EAPC,EAQbD,WAAW,EARE,EASbJ,YAAY,CACTkB,IAAF,IAAY;AACXA,IAAAA,IAAI,CAACC,QAAL,GAAgB,CAAC,CAAjB;AACAD,IAAAA,IAAI,CAACE,eAAL,GAAuBJ,iBAAvB;;AAEA,QAAK,CAAEA,iBAAP,EAA2B;AAC1B;AACA;;AAEDE,IAAAA,IAAI,CAACG,YAAL,CACC,YADD,EAECvB,EAAE,CAAE,0BAAF,CAFH;AAKA,WAAO,MAAM;AACZoB,MAAAA,IAAI,CAACI,eAAL,CAAsB,YAAtB;AACA,KAFD;AAGA,GAjBU,EAkBX,CAAEN,iBAAF,CAlBW,CATC,CAAF,CAFN,EAgCND,KAhCM,CAAP;AAkCA;;AAED,SAASQ,WAAT,OAA8CC,YAA9C,EAA6D;AAAA,MAAvC;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAAuC;AAC5D,QAAM,CAAEb,MAAF,EAAUC,GAAV,EAAeC,KAAf,IAAyBH,cAAc,EAA7C;AACA,SACC,8BACGC,MADH,EAEC,kCACMa,KADN;AAEC,IAAA,GAAG,EAAG3B,YAAY,CAAE,CAAEe,GAAF,EAAOU,YAAP,CAAF,CAFnB;AAGC,IAAA,SAAS,EAAG5B,UAAU,CACrB8B,KAAK,CAACC,SADe,EAErB,2BAFqB;AAHvB,MAQGF,QARH,CAFD,EAYGV,KAZH,CADD;AAgBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAed,UAAU,CAAEsB,WAAF,CAAzB","sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useMultiSelection from './use-multi-selection';\nimport useTabNav from './use-tab-nav';\nimport useArrowNav from './use-arrow-nav';\nimport useSelectAll from './use-select-all';\nimport useDragSelection from './use-drag-selection';\nimport useSelectionObserver from './use-selection-observer';\nimport useClickSelection from './use-click-selection';\nimport useInput from './use-input';\nimport { store as blockEditorStore } from '../../store';\n\nexport function useWritingFlow() {\n\tconst [ before, ref, after ] = useTabNav();\n\tconst hasMultiSelection = useSelect(\n\t\t( select ) => select( blockEditorStore ).hasMultiSelection(),\n\t\t[]\n\t);\n\n\treturn [\n\t\tbefore,\n\t\tuseMergeRefs( [\n\t\t\tref,\n\t\t\tuseInput(),\n\t\t\tuseDragSelection(),\n\t\t\tuseSelectionObserver(),\n\t\t\tuseClickSelection(),\n\t\t\tuseMultiSelection(),\n\t\t\tuseSelectAll(),\n\t\t\tuseArrowNav(),\n\t\t\tuseRefEffect(\n\t\t\t\t( node ) => {\n\t\t\t\t\tnode.tabIndex = -1;\n\t\t\t\t\tnode.contentEditable = hasMultiSelection;\n\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\tnode.setAttribute(\n\t\t\t\t\t\t'aria-label',\n\t\t\t\t\t\t__( 'Multiple selected blocks' )\n\t\t\t\t\t);\n\n\t\t\t\t\treturn () => {\n\t\t\t\t\t\tnode.removeAttribute( 'aria-label' );\n\t\t\t\t\t};\n\t\t\t\t},\n\t\t\t\t[ hasMultiSelection ]\n\t\t\t),\n\t\t] ),\n\t\tafter,\n\t];\n}\n\nfunction WritingFlow( { children, ...props }, forwardedRef ) {\n\tconst [ before, ref, after ] = useWritingFlow();\n\treturn (\n\t\t<>\n\t\t\t{ before }\n\t\t\t<div\n\t\t\t\t{ ...props }\n\t\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\t\tclassName={ classNames(\n\t\t\t\t\tprops.className,\n\t\t\t\t\t'block-editor-writing-flow'\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t\t{ after }\n\t\t</>\n\t);\n}\n\n/**\n * Handles selection and navigation across blocks. This component should be\n * wrapped around BlockList.\n *\n * @param {Object}    props          Component properties.\n * @param {WPElement} props.children Children to be rendered.\n */\nexport default forwardRef( WritingFlow );\n"]}

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

@@ -8,7 +8,7 @@ import { find, reverse } from 'lodash';
 
 import { computeCaretRect, focus, isHorizontalEdge, isVerticalEdge, placeCaretAtHorizontalEdge, placeCaretAtVerticalEdge, isRTL } from '@wordpress/dom';
 import { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';
-import { useSelect, useDispatch } from '@wordpress/data';
+import { useSelect } from '@wordpress/data';
 import { useRefEffect } from '@wordpress/compose';
 /**
  * Internal dependencies
@@ -101,19 +101,12 @@ export function getClosestTabbable(target, isReverse, containerElement, onlyVert
 export default function useArrowNav() {
   const {
     getSelectedBlockClientId,
-    getMultiSelectedBlocksStartClientId,
     getMultiSelectedBlocksEndClientId,
     getPreviousBlockClientId,
     getNextBlockClientId,
-    getFirstMultiSelectedBlockClientId,
-    getLastMultiSelectedBlockClientId,
     getSettings,
     hasMultiSelection
   } = useSelect(blockEditorStore);
-  const {
-    multiSelect,
-    selectBlock
-  } = useDispatch(blockEditorStore);
   return useRefEffect(node => {
     // Here a DOMRect is stored while moving the caret vertically so
     // vertical position of the start position can be restored. This is to
@@ -123,33 +116,6 @@ export default function useArrowNav() {
     function onMouseDown() {
       verticalRect = null;
     }
-
-    function expandSelection(isReverse) {
-      const selectedBlockClientId = getSelectedBlockClientId();
-      const selectionStartClientId = getMultiSelectedBlocksStartClientId();
-      const selectionEndClientId = getMultiSelectedBlocksEndClientId();
-      const selectionBeforeEndClientId = getPreviousBlockClientId(selectionEndClientId || selectedBlockClientId);
-      const selectionAfterEndClientId = getNextBlockClientId(selectionEndClientId || selectedBlockClientId);
-      const nextSelectionEndClientId = isReverse ? selectionBeforeEndClientId : selectionAfterEndClientId;
-
-      if (nextSelectionEndClientId) {
-        if (selectionStartClientId === nextSelectionEndClientId) {
-          selectBlock(nextSelectionEndClientId);
-        } else {
-          multiSelect(selectionStartClientId || selectedBlockClientId, nextSelectionEndClientId);
-        }
-      }
-    }
-
-    function moveSelection(isReverse) {
-      const selectedFirstClientId = getFirstMultiSelectedBlockClientId();
-      const selectedLastClientId = getLastMultiSelectedBlockClientId();
-      const focusedBlockClientId = isReverse ? selectedFirstClientId : selectedLastClientId;
-
-      if (focusedBlockClientId) {
-        selectBlock(focusedBlockClientId);
-      }
-    }
     /**
      * Returns true if the given target field is the last in its block which
      * can be considered for tab transition. For example, in a block with
@@ -192,12 +158,6 @@ export default function useArrowNav() {
       } = ownerDocument;
 
       if (hasMultiSelection()) {
-        if (isNav) {
-          const action = isShift ? expandSelection : moveSelection;
-          action(isReverse);
-          event.preventDefault();
-        }
-
         return;
       } // When presing any key other than up or down, the initial vertical
       // position must ALWAYS be reset. The vertical position is saved so
@@ -245,10 +205,9 @@ export default function useArrowNav() {
 
         if ( // Ensure that there is a target block.
         (isReverse && selectionBeforeEndClientId || !isReverse && selectionAfterEndClientId) && isTabbableEdge(target, isReverse) && isNavEdge(target, isReverse)) {
-          // Shift key is down, and there is multi selection or we're
-          // at the end of the current block.
-          expandSelection(isReverse);
-          event.preventDefault();
+          node.contentEditable = true; // Firefox doesn't automatically move focus.
+
+          node.focus();
         }
       } else if (isVertical && isVerticalEdge(target, isReverse) && !keepCaretInsideBlock) {
         const closestTabbable = getClosestTabbable(target, isReverse, node, true);

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-arrow-nav.js"],"names":["find","reverse","computeCaretRect","focus","isHorizontalEdge","isVerticalEdge","placeCaretAtHorizontalEdge","placeCaretAtVerticalEdge","isRTL","UP","DOWN","LEFT","RIGHT","useSelect","useDispatch","useRefEffect","isInSameBlock","store","blockEditorStore","isNavigationCandidate","element","keyCode","hasModifier","isVertical","tagName","getClosestTabbable","target","isReverse","containerElement","onlyVertical","focusableNodes","focusable","slice","indexOf","targetRect","getBoundingClientRect","isTabCandidate","node","tabbable","isTabbableIndex","isContentEditable","contentEditable","nodeRect","left","right","useArrowNav","getSelectedBlockClientId","getMultiSelectedBlocksStartClientId","getMultiSelectedBlocksEndClientId","getPreviousBlockClientId","getNextBlockClientId","getFirstMultiSelectedBlockClientId","getLastMultiSelectedBlockClientId","getSettings","hasMultiSelection","multiSelect","selectBlock","verticalRect","onMouseDown","expandSelection","selectedBlockClientId","selectionStartClientId","selectionEndClientId","selectionBeforeEndClientId","selectionAfterEndClientId","nextSelectionEndClientId","moveSelection","selectedFirstClientId","selectedLastClientId","focusedBlockClientId","isTabbableEdge","closestTabbable","onKeyDown","event","isUp","isDown","isLeft","isRight","isHorizontal","isNav","isShift","shiftKey","ctrlKey","altKey","metaKey","isNavEdge","ownerDocument","defaultView","action","preventDefault","defaultPrevented","isReverseDir","keepCaretInsideBlock","getSelection","isCollapsed","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { find, reverse } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcomputeCaretRect,\n\tfocus,\n\tisHorizontalEdge,\n\tisVerticalEdge,\n\tplaceCaretAtHorizontalEdge,\n\tplaceCaretAtVerticalEdge,\n\tisRTL,\n} from '@wordpress/dom';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { isInSameBlock } from '../../utils/dom';\nimport { store as blockEditorStore } from '../../store';\n\n/**\n * Returns true if the element should consider edge navigation upon a keyboard\n * event of the given directional key code, or false otherwise.\n *\n * @param {Element} element     HTML element to test.\n * @param {number}  keyCode     KeyboardEvent keyCode to test.\n * @param {boolean} hasModifier Whether a modifier is pressed.\n *\n * @return {boolean} Whether element should consider edge navigation.\n */\nexport function isNavigationCandidate( element, keyCode, hasModifier ) {\n\tconst isVertical = keyCode === UP || keyCode === DOWN;\n\n\t// Currently, all elements support unmodified vertical navigation.\n\tif ( isVertical && ! hasModifier ) {\n\t\treturn true;\n\t}\n\n\t// Native inputs should not navigate horizontally.\n\tconst { tagName } = element;\n\treturn tagName !== 'INPUT' && tagName !== 'TEXTAREA';\n}\n\n/**\n * Returns the optimal tab target from the given focused element in the desired\n * direction. A preference is made toward text fields, falling back to the block\n * focus stop if no other candidates exist for the block.\n *\n * @param {Element} target           Currently focused text field.\n * @param {boolean} isReverse        True if considering as the first field.\n * @param {Element} containerElement Element containing all blocks.\n * @param {boolean} onlyVertical     Whether to only consider tabbable elements\n *                                   that are visually above or under the\n *                                   target.\n *\n * @return {?Element} Optimal tab target, if one exists.\n */\nexport function getClosestTabbable(\n\ttarget,\n\tisReverse,\n\tcontainerElement,\n\tonlyVertical\n) {\n\t// Since the current focus target is not guaranteed to be a text field, find\n\t// all focusables. Tabbability is considered later.\n\tlet focusableNodes = focus.focusable.find( containerElement );\n\n\tif ( isReverse ) {\n\t\tfocusableNodes = reverse( focusableNodes );\n\t}\n\n\t// Consider as candidates those focusables after the current target. It's\n\t// assumed this can only be reached if the target is focusable (on its\n\t// keydown event), so no need to verify it exists in the set.\n\tfocusableNodes = focusableNodes.slice(\n\t\tfocusableNodes.indexOf( target ) + 1\n\t);\n\n\tlet targetRect;\n\n\tif ( onlyVertical ) {\n\t\ttargetRect = target.getBoundingClientRect();\n\t}\n\n\tfunction isTabCandidate( node ) {\n\t\t// Not a candidate if the node is not tabbable.\n\t\tif ( ! focus.tabbable.isTabbableIndex( node ) ) {\n\t\t\treturn false;\n\t\t}\n\n\t\t// Skip focusable elements such as links within content editable nodes.\n\t\tif ( node.isContentEditable && node.contentEditable !== 'true' ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tif ( onlyVertical ) {\n\t\t\tconst nodeRect = node.getBoundingClientRect();\n\n\t\t\tif (\n\t\t\t\tnodeRect.left >= targetRect.right ||\n\t\t\t\tnodeRect.right <= targetRect.left\n\t\t\t) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t}\n\n\t\treturn true;\n\t}\n\n\treturn find( focusableNodes, isTabCandidate );\n}\n\nexport default function useArrowNav() {\n\tconst {\n\t\tgetSelectedBlockClientId,\n\t\tgetMultiSelectedBlocksStartClientId,\n\t\tgetMultiSelectedBlocksEndClientId,\n\t\tgetPreviousBlockClientId,\n\t\tgetNextBlockClientId,\n\t\tgetFirstMultiSelectedBlockClientId,\n\t\tgetLastMultiSelectedBlockClientId,\n\t\tgetSettings,\n\t\thasMultiSelection,\n\t} = useSelect( blockEditorStore );\n\tconst { multiSelect, selectBlock } = useDispatch( blockEditorStore );\n\treturn useRefEffect( ( node ) => {\n\t\t// Here a DOMRect is stored while moving the caret vertically so\n\t\t// vertical position of the start position can be restored. This is to\n\t\t// recreate browser behaviour across blocks.\n\t\tlet verticalRect;\n\n\t\tfunction onMouseDown() {\n\t\t\tverticalRect = null;\n\t\t}\n\n\t\tfunction expandSelection( isReverse ) {\n\t\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\t\tconst selectionStartClientId = getMultiSelectedBlocksStartClientId();\n\t\t\tconst selectionEndClientId = getMultiSelectedBlocksEndClientId();\n\t\t\tconst selectionBeforeEndClientId = getPreviousBlockClientId(\n\t\t\t\tselectionEndClientId || selectedBlockClientId\n\t\t\t);\n\t\t\tconst selectionAfterEndClientId = getNextBlockClientId(\n\t\t\t\tselectionEndClientId || selectedBlockClientId\n\t\t\t);\n\t\t\tconst nextSelectionEndClientId = isReverse\n\t\t\t\t? selectionBeforeEndClientId\n\t\t\t\t: selectionAfterEndClientId;\n\n\t\t\tif ( nextSelectionEndClientId ) {\n\t\t\t\tif ( selectionStartClientId === nextSelectionEndClientId ) {\n\t\t\t\t\tselectBlock( nextSelectionEndClientId );\n\t\t\t\t} else {\n\t\t\t\t\tmultiSelect(\n\t\t\t\t\t\tselectionStartClientId || selectedBlockClientId,\n\t\t\t\t\t\tnextSelectionEndClientId\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfunction moveSelection( isReverse ) {\n\t\t\tconst selectedFirstClientId = getFirstMultiSelectedBlockClientId();\n\t\t\tconst selectedLastClientId = getLastMultiSelectedBlockClientId();\n\t\t\tconst focusedBlockClientId = isReverse\n\t\t\t\t? selectedFirstClientId\n\t\t\t\t: selectedLastClientId;\n\n\t\t\tif ( focusedBlockClientId ) {\n\t\t\t\tselectBlock( focusedBlockClientId );\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Returns true if the given target field is the last in its block which\n\t\t * can be considered for tab transition. For example, in a block with\n\t\t * two text fields, this would return true when reversing from the first\n\t\t * of the two fields, but false when reversing from the second.\n\t\t *\n\t\t * @param {Element} target    Currently focused text field.\n\t\t * @param {boolean} isReverse True if considering as the first field.\n\t\t *\n\t\t * @return {boolean} Whether field is at edge for tab transition.\n\t\t */\n\t\tfunction isTabbableEdge( target, isReverse ) {\n\t\t\tconst closestTabbable = getClosestTabbable(\n\t\t\t\ttarget,\n\t\t\t\tisReverse,\n\t\t\t\tnode\n\t\t\t);\n\t\t\treturn (\n\t\t\t\t! closestTabbable || ! isInSameBlock( target, closestTabbable )\n\t\t\t);\n\t\t}\n\n\t\tfunction onKeyDown( event ) {\n\t\t\tconst { keyCode, target } = event;\n\t\t\tconst isUp = keyCode === UP;\n\t\t\tconst isDown = keyCode === DOWN;\n\t\t\tconst isLeft = keyCode === LEFT;\n\t\t\tconst isRight = keyCode === RIGHT;\n\t\t\tconst isReverse = isUp || isLeft;\n\t\t\tconst isHorizontal = isLeft || isRight;\n\t\t\tconst isVertical = isUp || isDown;\n\t\t\tconst isNav = isHorizontal || isVertical;\n\t\t\tconst isShift = event.shiftKey;\n\t\t\tconst hasModifier =\n\t\t\t\tisShift || event.ctrlKey || event.altKey || event.metaKey;\n\t\t\tconst isNavEdge = isVertical ? isVerticalEdge : isHorizontalEdge;\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView } = ownerDocument;\n\n\t\t\tif ( hasMultiSelection() ) {\n\t\t\t\tif ( isNav ) {\n\t\t\t\t\tconst action = isShift ? expandSelection : moveSelection;\n\t\t\t\t\taction( isReverse );\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// When presing any key other than up or down, the initial vertical\n\t\t\t// position must ALWAYS be reset. The vertical position is saved so\n\t\t\t// it can be restored as well as possible on sebsequent vertical\n\t\t\t// arrow key presses. It may not always be possible to restore the\n\t\t\t// exact same position (such as at an empty line), so it wouldn't be\n\t\t\t// good to compute the position right before any vertical arrow key\n\t\t\t// press.\n\t\t\tif ( ! isVertical ) {\n\t\t\t\tverticalRect = null;\n\t\t\t} else if ( ! verticalRect ) {\n\t\t\t\tverticalRect = computeCaretRect( defaultView );\n\t\t\t}\n\n\t\t\t// Abort if navigation has already been handled (e.g. RichText\n\t\t\t// inline boundaries).\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! isNav ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Abort if our current target is not a candidate for navigation\n\t\t\t// (e.g. preserve native input behaviors).\n\t\t\tif ( ! isNavigationCandidate( target, keyCode, hasModifier ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// In the case of RTL scripts, right means previous and left means\n\t\t\t// next, which is the exact reverse of LTR.\n\t\t\tconst isReverseDir = isRTL( target ) ? ! isReverse : isReverse;\n\t\t\tconst { keepCaretInsideBlock } = getSettings();\n\t\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\n\t\t\tif ( isShift ) {\n\t\t\t\tconst selectionEndClientId = getMultiSelectedBlocksEndClientId();\n\t\t\t\tconst selectionBeforeEndClientId = getPreviousBlockClientId(\n\t\t\t\t\tselectionEndClientId || selectedBlockClientId\n\t\t\t\t);\n\t\t\t\tconst selectionAfterEndClientId = getNextBlockClientId(\n\t\t\t\t\tselectionEndClientId || selectedBlockClientId\n\t\t\t\t);\n\n\t\t\t\tif (\n\t\t\t\t\t// Ensure that there is a target block.\n\t\t\t\t\t( ( isReverse && selectionBeforeEndClientId ) ||\n\t\t\t\t\t\t( ! isReverse && selectionAfterEndClientId ) ) &&\n\t\t\t\t\tisTabbableEdge( target, isReverse ) &&\n\t\t\t\t\tisNavEdge( target, isReverse )\n\t\t\t\t) {\n\t\t\t\t\t// Shift key is down, and there is multi selection or we're\n\t\t\t\t\t// at the end of the current block.\n\t\t\t\t\texpandSelection( isReverse );\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t} else if (\n\t\t\t\tisVertical &&\n\t\t\t\tisVerticalEdge( target, isReverse ) &&\n\t\t\t\t! keepCaretInsideBlock\n\t\t\t) {\n\t\t\t\tconst closestTabbable = getClosestTabbable(\n\t\t\t\t\ttarget,\n\t\t\t\t\tisReverse,\n\t\t\t\t\tnode,\n\t\t\t\t\ttrue\n\t\t\t\t);\n\n\t\t\t\tif ( closestTabbable ) {\n\t\t\t\t\tplaceCaretAtVerticalEdge(\n\t\t\t\t\t\tclosestTabbable,\n\t\t\t\t\t\tisReverse,\n\t\t\t\t\t\tverticalRect\n\t\t\t\t\t);\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t} else if (\n\t\t\t\tisHorizontal &&\n\t\t\t\tdefaultView.getSelection().isCollapsed &&\n\t\t\t\tisHorizontalEdge( target, isReverseDir ) &&\n\t\t\t\t! keepCaretInsideBlock\n\t\t\t) {\n\t\t\t\tconst closestTabbable = getClosestTabbable(\n\t\t\t\t\ttarget,\n\t\t\t\t\tisReverseDir,\n\t\t\t\t\tnode\n\t\t\t\t);\n\t\t\t\tplaceCaretAtHorizontalEdge( closestTabbable, isReverse );\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tnode.addEventListener( 'mousedown', onMouseDown );\n\t\tnode.addEventListener( 'keydown', onKeyDown );\n\t\treturn () => {\n\t\t\tnode.removeEventListener( 'mousedown', onMouseDown );\n\t\t\tnode.removeEventListener( 'keydown', onKeyDown );\n\t\t};\n\t}, [] );\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-arrow-nav.js"],"names":["find","reverse","computeCaretRect","focus","isHorizontalEdge","isVerticalEdge","placeCaretAtHorizontalEdge","placeCaretAtVerticalEdge","isRTL","UP","DOWN","LEFT","RIGHT","useSelect","useRefEffect","isInSameBlock","store","blockEditorStore","isNavigationCandidate","element","keyCode","hasModifier","isVertical","tagName","getClosestTabbable","target","isReverse","containerElement","onlyVertical","focusableNodes","focusable","slice","indexOf","targetRect","getBoundingClientRect","isTabCandidate","node","tabbable","isTabbableIndex","isContentEditable","contentEditable","nodeRect","left","right","useArrowNav","getSelectedBlockClientId","getMultiSelectedBlocksEndClientId","getPreviousBlockClientId","getNextBlockClientId","getSettings","hasMultiSelection","verticalRect","onMouseDown","isTabbableEdge","closestTabbable","onKeyDown","event","isUp","isDown","isLeft","isRight","isHorizontal","isNav","isShift","shiftKey","ctrlKey","altKey","metaKey","isNavEdge","ownerDocument","defaultView","defaultPrevented","isReverseDir","keepCaretInsideBlock","selectedBlockClientId","selectionEndClientId","selectionBeforeEndClientId","selectionAfterEndClientId","preventDefault","getSelection","isCollapsed","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { find, reverse } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcomputeCaretRect,\n\tfocus,\n\tisHorizontalEdge,\n\tisVerticalEdge,\n\tplaceCaretAtHorizontalEdge,\n\tplaceCaretAtVerticalEdge,\n\tisRTL,\n} from '@wordpress/dom';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\nimport { useSelect } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { isInSameBlock } from '../../utils/dom';\nimport { store as blockEditorStore } from '../../store';\n\n/**\n * Returns true if the element should consider edge navigation upon a keyboard\n * event of the given directional key code, or false otherwise.\n *\n * @param {Element} element     HTML element to test.\n * @param {number}  keyCode     KeyboardEvent keyCode to test.\n * @param {boolean} hasModifier Whether a modifier is pressed.\n *\n * @return {boolean} Whether element should consider edge navigation.\n */\nexport function isNavigationCandidate( element, keyCode, hasModifier ) {\n\tconst isVertical = keyCode === UP || keyCode === DOWN;\n\n\t// Currently, all elements support unmodified vertical navigation.\n\tif ( isVertical && ! hasModifier ) {\n\t\treturn true;\n\t}\n\n\t// Native inputs should not navigate horizontally.\n\tconst { tagName } = element;\n\treturn tagName !== 'INPUT' && tagName !== 'TEXTAREA';\n}\n\n/**\n * Returns the optimal tab target from the given focused element in the desired\n * direction. A preference is made toward text fields, falling back to the block\n * focus stop if no other candidates exist for the block.\n *\n * @param {Element} target           Currently focused text field.\n * @param {boolean} isReverse        True if considering as the first field.\n * @param {Element} containerElement Element containing all blocks.\n * @param {boolean} onlyVertical     Whether to only consider tabbable elements\n *                                   that are visually above or under the\n *                                   target.\n *\n * @return {?Element} Optimal tab target, if one exists.\n */\nexport function getClosestTabbable(\n\ttarget,\n\tisReverse,\n\tcontainerElement,\n\tonlyVertical\n) {\n\t// Since the current focus target is not guaranteed to be a text field, find\n\t// all focusables. Tabbability is considered later.\n\tlet focusableNodes = focus.focusable.find( containerElement );\n\n\tif ( isReverse ) {\n\t\tfocusableNodes = reverse( focusableNodes );\n\t}\n\n\t// Consider as candidates those focusables after the current target. It's\n\t// assumed this can only be reached if the target is focusable (on its\n\t// keydown event), so no need to verify it exists in the set.\n\tfocusableNodes = focusableNodes.slice(\n\t\tfocusableNodes.indexOf( target ) + 1\n\t);\n\n\tlet targetRect;\n\n\tif ( onlyVertical ) {\n\t\ttargetRect = target.getBoundingClientRect();\n\t}\n\n\tfunction isTabCandidate( node ) {\n\t\t// Not a candidate if the node is not tabbable.\n\t\tif ( ! focus.tabbable.isTabbableIndex( node ) ) {\n\t\t\treturn false;\n\t\t}\n\n\t\t// Skip focusable elements such as links within content editable nodes.\n\t\tif ( node.isContentEditable && node.contentEditable !== 'true' ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tif ( onlyVertical ) {\n\t\t\tconst nodeRect = node.getBoundingClientRect();\n\n\t\t\tif (\n\t\t\t\tnodeRect.left >= targetRect.right ||\n\t\t\t\tnodeRect.right <= targetRect.left\n\t\t\t) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t}\n\n\t\treturn true;\n\t}\n\n\treturn find( focusableNodes, isTabCandidate );\n}\n\nexport default function useArrowNav() {\n\tconst {\n\t\tgetSelectedBlockClientId,\n\t\tgetMultiSelectedBlocksEndClientId,\n\t\tgetPreviousBlockClientId,\n\t\tgetNextBlockClientId,\n\t\tgetSettings,\n\t\thasMultiSelection,\n\t} = useSelect( blockEditorStore );\n\treturn useRefEffect( ( node ) => {\n\t\t// Here a DOMRect is stored while moving the caret vertically so\n\t\t// vertical position of the start position can be restored. This is to\n\t\t// recreate browser behaviour across blocks.\n\t\tlet verticalRect;\n\n\t\tfunction onMouseDown() {\n\t\t\tverticalRect = null;\n\t\t}\n\n\t\t/**\n\t\t * Returns true if the given target field is the last in its block which\n\t\t * can be considered for tab transition. For example, in a block with\n\t\t * two text fields, this would return true when reversing from the first\n\t\t * of the two fields, but false when reversing from the second.\n\t\t *\n\t\t * @param {Element} target    Currently focused text field.\n\t\t * @param {boolean} isReverse True if considering as the first field.\n\t\t *\n\t\t * @return {boolean} Whether field is at edge for tab transition.\n\t\t */\n\t\tfunction isTabbableEdge( target, isReverse ) {\n\t\t\tconst closestTabbable = getClosestTabbable(\n\t\t\t\ttarget,\n\t\t\t\tisReverse,\n\t\t\t\tnode\n\t\t\t);\n\t\t\treturn (\n\t\t\t\t! closestTabbable || ! isInSameBlock( target, closestTabbable )\n\t\t\t);\n\t\t}\n\n\t\tfunction onKeyDown( event ) {\n\t\t\tconst { keyCode, target } = event;\n\t\t\tconst isUp = keyCode === UP;\n\t\t\tconst isDown = keyCode === DOWN;\n\t\t\tconst isLeft = keyCode === LEFT;\n\t\t\tconst isRight = keyCode === RIGHT;\n\t\t\tconst isReverse = isUp || isLeft;\n\t\t\tconst isHorizontal = isLeft || isRight;\n\t\t\tconst isVertical = isUp || isDown;\n\t\t\tconst isNav = isHorizontal || isVertical;\n\t\t\tconst isShift = event.shiftKey;\n\t\t\tconst hasModifier =\n\t\t\t\tisShift || event.ctrlKey || event.altKey || event.metaKey;\n\t\t\tconst isNavEdge = isVertical ? isVerticalEdge : isHorizontalEdge;\n\t\t\tconst { ownerDocument } = node;\n\t\t\tconst { defaultView } = ownerDocument;\n\n\t\t\tif ( hasMultiSelection() ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// When presing any key other than up or down, the initial vertical\n\t\t\t// position must ALWAYS be reset. The vertical position is saved so\n\t\t\t// it can be restored as well as possible on sebsequent vertical\n\t\t\t// arrow key presses. It may not always be possible to restore the\n\t\t\t// exact same position (such as at an empty line), so it wouldn't be\n\t\t\t// good to compute the position right before any vertical arrow key\n\t\t\t// press.\n\t\t\tif ( ! isVertical ) {\n\t\t\t\tverticalRect = null;\n\t\t\t} else if ( ! verticalRect ) {\n\t\t\t\tverticalRect = computeCaretRect( defaultView );\n\t\t\t}\n\n\t\t\t// Abort if navigation has already been handled (e.g. RichText\n\t\t\t// inline boundaries).\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! isNav ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Abort if our current target is not a candidate for navigation\n\t\t\t// (e.g. preserve native input behaviors).\n\t\t\tif ( ! isNavigationCandidate( target, keyCode, hasModifier ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// In the case of RTL scripts, right means previous and left means\n\t\t\t// next, which is the exact reverse of LTR.\n\t\t\tconst isReverseDir = isRTL( target ) ? ! isReverse : isReverse;\n\t\t\tconst { keepCaretInsideBlock } = getSettings();\n\t\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\n\t\t\tif ( isShift ) {\n\t\t\t\tconst selectionEndClientId = getMultiSelectedBlocksEndClientId();\n\t\t\t\tconst selectionBeforeEndClientId = getPreviousBlockClientId(\n\t\t\t\t\tselectionEndClientId || selectedBlockClientId\n\t\t\t\t);\n\t\t\t\tconst selectionAfterEndClientId = getNextBlockClientId(\n\t\t\t\t\tselectionEndClientId || selectedBlockClientId\n\t\t\t\t);\n\n\t\t\t\tif (\n\t\t\t\t\t// Ensure that there is a target block.\n\t\t\t\t\t( ( isReverse && selectionBeforeEndClientId ) ||\n\t\t\t\t\t\t( ! isReverse && selectionAfterEndClientId ) ) &&\n\t\t\t\t\tisTabbableEdge( target, isReverse ) &&\n\t\t\t\t\tisNavEdge( target, isReverse )\n\t\t\t\t) {\n\t\t\t\t\tnode.contentEditable = true;\n\t\t\t\t\t// Firefox doesn't automatically move focus.\n\t\t\t\t\tnode.focus();\n\t\t\t\t}\n\t\t\t} else if (\n\t\t\t\tisVertical &&\n\t\t\t\tisVerticalEdge( target, isReverse ) &&\n\t\t\t\t! keepCaretInsideBlock\n\t\t\t) {\n\t\t\t\tconst closestTabbable = getClosestTabbable(\n\t\t\t\t\ttarget,\n\t\t\t\t\tisReverse,\n\t\t\t\t\tnode,\n\t\t\t\t\ttrue\n\t\t\t\t);\n\n\t\t\t\tif ( closestTabbable ) {\n\t\t\t\t\tplaceCaretAtVerticalEdge(\n\t\t\t\t\t\tclosestTabbable,\n\t\t\t\t\t\tisReverse,\n\t\t\t\t\t\tverticalRect\n\t\t\t\t\t);\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t} else if (\n\t\t\t\tisHorizontal &&\n\t\t\t\tdefaultView.getSelection().isCollapsed &&\n\t\t\t\tisHorizontalEdge( target, isReverseDir ) &&\n\t\t\t\t! keepCaretInsideBlock\n\t\t\t) {\n\t\t\t\tconst closestTabbable = getClosestTabbable(\n\t\t\t\t\ttarget,\n\t\t\t\t\tisReverseDir,\n\t\t\t\t\tnode\n\t\t\t\t);\n\t\t\t\tplaceCaretAtHorizontalEdge( closestTabbable, isReverse );\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tnode.addEventListener( 'mousedown', onMouseDown );\n\t\tnode.addEventListener( 'keydown', onKeyDown );\n\t\treturn () => {\n\t\t\tnode.removeEventListener( 'mousedown', onMouseDown );\n\t\t\tnode.removeEventListener( 'keydown', onKeyDown );\n\t\t};\n\t}, [] );\n}\n"]}

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

@@ -0,0 +1,57 @@
+/**
+ * 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';
+export default function useClickSelection() {
+  const {
+    multiSelect,
+    selectBlock
+  } = useDispatch(blockEditorStore);
+  const {
+    isSelectionEnabled,
+    getBlockParents,
+    getBlockSelectionStart,
+    hasMultiSelection
+  } = useSelect(blockEditorStore);
+  return useRefEffect(node => {
+    function onMouseDown(event) {
+      // The main button.
+      // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
+      if (!isSelectionEnabled() || event.button !== 0) {
+        return;
+      }
+
+      const startClientId = getBlockSelectionStart();
+      const clickedClientId = getBlockClientId(event.target);
+
+      if (event.shiftKey) {
+        if (startClientId !== clickedClientId) {
+          node.contentEditable = true; // Firefox doesn't automatically move focus.
+
+          node.focus();
+        }
+      } else if (hasMultiSelection()) {
+        // Allow user to escape out of a multi-selection to a
+        // singular selection of a block via click. This is handled
+        // here since focus handling excludes blocks when there is
+        // multiselection, as focus can be incurred by starting a
+        // multiselection (focus moved to first block's multi-
+        // controls).
+        selectBlock(clickedClientId);
+      }
+    }
+
+    node.addEventListener('mousedown', onMouseDown);
+    return () => {
+      node.removeEventListener('mousedown', onMouseDown);
+    };
+  }, [multiSelect, selectBlock, isSelectionEnabled, getBlockParents, getBlockSelectionStart, hasMultiSelection]);
+}
+//# sourceMappingURL=use-click-selection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/writing-flow/use-click-selection.js"],"names":["useSelect","useDispatch","useRefEffect","store","blockEditorStore","getBlockClientId","useClickSelection","multiSelect","selectBlock","isSelectionEnabled","getBlockParents","getBlockSelectionStart","hasMultiSelection","node","onMouseDown","event","button","startClientId","clickedClientId","target","shiftKey","contentEditable","focus","addEventListener","removeEventListener"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AACA,SAASC,YAAT,QAA6B,oBAA7B;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AACA,SAASC,gBAAT,QAAiC,iBAAjC;AAEA,eAAe,SAASC,iBAAT,GAA6B;AAC3C,QAAM;AAAEC,IAAAA,WAAF;AAAeC,IAAAA;AAAf,MAA+BP,WAAW,CAAEG,gBAAF,CAAhD;AACA,QAAM;AACLK,IAAAA,kBADK;AAELC,IAAAA,eAFK;AAGLC,IAAAA,sBAHK;AAILC,IAAAA;AAJK,MAKFZ,SAAS,CAAEI,gBAAF,CALb;AAMA,SAAOF,YAAY,CAChBW,IAAF,IAAY;AACX,aAASC,WAAT,CAAsBC,KAAtB,EAA8B;AAC7B;AACA;AACA,UAAK,CAAEN,kBAAkB,EAApB,IAA0BM,KAAK,CAACC,MAAN,KAAiB,CAAhD,EAAoD;AACnD;AACA;;AAED,YAAMC,aAAa,GAAGN,sBAAsB,EAA5C;AACA,YAAMO,eAAe,GAAGb,gBAAgB,CAAEU,KAAK,CAACI,MAAR,CAAxC;;AAEA,UAAKJ,KAAK,CAACK,QAAX,EAAsB;AACrB,YAAKH,aAAa,KAAKC,eAAvB,EAAyC;AACxCL,UAAAA,IAAI,CAACQ,eAAL,GAAuB,IAAvB,CADwC,CAExC;;AACAR,UAAAA,IAAI,CAACS,KAAL;AACA;AACD,OAND,MAMO,IAAKV,iBAAiB,EAAtB,EAA2B;AACjC;AACA;AACA;AACA;AACA;AACA;AACAJ,QAAAA,WAAW,CAAEU,eAAF,CAAX;AACA;AACD;;AAEDL,IAAAA,IAAI,CAACU,gBAAL,CAAuB,WAAvB,EAAoCT,WAApC;AAEA,WAAO,MAAM;AACZD,MAAAA,IAAI,CAACW,mBAAL,CAA0B,WAA1B,EAAuCV,WAAvC;AACA,KAFD;AAGA,GAlCiB,EAmClB,CACCP,WADD,EAECC,WAFD,EAGCC,kBAHD,EAICC,eAJD,EAKCC,sBALD,EAMCC,iBAND,CAnCkB,CAAnB;AA4CA","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\nexport default function useClickSelection() {\n\tconst { multiSelect, selectBlock } = useDispatch( blockEditorStore );\n\tconst {\n\t\tisSelectionEnabled,\n\t\tgetBlockParents,\n\t\tgetBlockSelectionStart,\n\t\thasMultiSelection,\n\t} = useSelect( blockEditorStore );\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tfunction onMouseDown( event ) {\n\t\t\t\t// The main button.\n\t\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button\n\t\t\t\tif ( ! isSelectionEnabled() || event.button !== 0 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst startClientId = getBlockSelectionStart();\n\t\t\t\tconst clickedClientId = getBlockClientId( event.target );\n\n\t\t\t\tif ( event.shiftKey ) {\n\t\t\t\t\tif ( startClientId !== clickedClientId ) {\n\t\t\t\t\t\tnode.contentEditable = true;\n\t\t\t\t\t\t// Firefox doesn't automatically move focus.\n\t\t\t\t\t\tnode.focus();\n\t\t\t\t\t}\n\t\t\t\t} else if ( hasMultiSelection() ) {\n\t\t\t\t\t// Allow user to escape out of a multi-selection to a\n\t\t\t\t\t// singular selection of a block via click. This is handled\n\t\t\t\t\t// here since focus handling excludes blocks when there is\n\t\t\t\t\t// multiselection, as focus can be incurred by starting a\n\t\t\t\t\t// multiselection (focus moved to first block's multi-\n\t\t\t\t\t// controls).\n\t\t\t\t\tselectBlock( clickedClientId );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tnode.addEventListener( 'mousedown', onMouseDown );\n\n\t\t\treturn () => {\n\t\t\t\tnode.removeEventListener( 'mousedown', onMouseDown );\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tmultiSelect,\n\t\t\tselectBlock,\n\t\t\tisSelectionEnabled,\n\t\t\tgetBlockParents,\n\t\t\tgetBlockSelectionStart,\n\t\t\thasMultiSelection,\n\t\t]\n\t);\n}\n"]}

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"]}