npm - @wordpress/block-editor - Versions diffs - 15.23.0 → 16.0.0 - Mend

@wordpress/block-editor 15.23.0 → 16.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (684) hide show

package/build/components/use-on-block-drop/index.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/use-on-block-drop/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\nimport {\n\tcloneBlock,\n\tcreateBlock,\n\tfindTransform,\n\tgetBlockTransforms,\n\tpasteHandler,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useDispatch, useSelect, useRegistry } from '@wordpress/data';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\n/** @typedef {React.SyntheticEvent} SyntheticEvent */\n/** @typedef {import('./types').WPDropOperation} WPDropOperation */\n\n/**\n * Retrieve the data for a block drop event.\n *\n * @param {SyntheticEvent} event The drop event.\n *\n * @return {Object} An object with block drag and drop data.\n */\nexport function parseDropEvent( event ) {\n\tlet result = {\n\t\tsrcRootClientId: null,\n\t\tsrcClientIds: null,\n\t\tsrcIndex: null,\n\t\ttype: null,\n\t\tblocks: null,\n\t};\n\n\tif ( ! event.dataTransfer ) {\n\t\treturn result;\n\t}\n\n\ttry {\n\t\tresult = Object.assign(\n\t\t\tresult,\n\t\t\tJSON.parse( event.dataTransfer.getData( 'wp-blocks' ) )\n\t\t);\n\t} catch {\n\t\treturn result;\n\t}\n\n\treturn result;\n}\n\n/**\n * A function that returns an event handler function for block drop events.\n *\n * @param {string}   targetRootClientId        The root client id where the block(s) will be inserted.\n * @param {number}   targetBlockIndex          The index where the block(s) will be inserted.\n * @param {Function} getBlockIndex             A function that gets the index of a block.\n * @param {Function} getClientIdsOfDescendants A function that gets the client ids of descendant blocks.\n * @param {Function} moveBlocks                A function that moves blocks.\n * @param {Function} insertOrReplaceBlocks     A function that inserts or replaces blocks.\n * @param {Function} clearSelectedBlock        A function that clears block selection.\n * @param {string}   operation                 The type of operation to perform on drop. Could be `insert` or `replace` or `group`.\n * @param {Function} getBlock                  A function that returns a block given its client id.\n * @return {Function} The event handler for a block drop event.\n */\nexport function onBlockDrop(\n\ttargetRootClientId,\n\ttargetBlockIndex,\n\tgetBlockIndex,\n\tgetClientIdsOfDescendants,\n\tmoveBlocks,\n\tinsertOrReplaceBlocks,\n\tclearSelectedBlock,\n\toperation,\n\tgetBlock\n) {\n\treturn ( event ) => {\n\t\tconst {\n\t\t\tsrcRootClientId: sourceRootClientId,\n\t\t\tsrcClientIds: sourceClientIds,\n\t\t\ttype: dropType,\n\t\t\tblocks,\n\t\t} = parseDropEvent( event );\n\n\t\t// If the user is inserting a block.\n\t\tif ( dropType === 'inserter' ) {\n\t\t\tclearSelectedBlock();\n\t\t\tconst blocksToInsert = blocks.map( ( block ) =>\n\t\t\t\tcloneBlock( block )\n\t\t\t);\n\t\t\tinsertOrReplaceBlocks( blocksToInsert, true, null );\n\t\t}\n\n\t\t// If the user is moving a block.\n\t\tif ( dropType === 'block' ) {\n\t\t\tconst sourceBlockIndex = getBlockIndex( sourceClientIds[ 0 ] );\n\n\t\t\t// If the user is dropping to the same position, return early.\n\t\t\tif (\n\t\t\t\tsourceRootClientId === targetRootClientId &&\n\t\t\t\tsourceBlockIndex === targetBlockIndex\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If the user is attempting to drop a block within its own\n\t\t\t// nested blocks, return early as this would create infinite\n\t\t\t// recursion.\n\t\t\tif (\n\t\t\t\tsourceClientIds.includes( targetRootClientId ) ||\n\t\t\t\tgetClientIdsOfDescendants( sourceClientIds ).some(\n\t\t\t\t\t( id ) => id === targetRootClientId\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If the user is dropping a block over another block, replace both blocks\n\t\t\t// with a group block containing them\n\t\t\tif ( operation === 'group' ) {\n\t\t\t\tconst blocksToInsert = sourceClientIds.map( ( clientId ) =>\n\t\t\t\t\tgetBlock( clientId )\n\t\t\t\t);\n\t\t\t\tinsertOrReplaceBlocks(\n\t\t\t\t\tblocksToInsert,\n\t\t\t\t\ttrue,\n\t\t\t\t\tnull,\n\t\t\t\t\tsourceClientIds\n\t\t\t\t);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst isAtSameLevel = sourceRootClientId === targetRootClientId;\n\t\t\tconst draggedBlockCount = sourceClientIds.length;\n\n\t\t\t// If the block is kept at the same level and moved downwards,\n\t\t\t// subtract to take into account that the blocks being dragged\n\t\t\t// were removed from the block list above the insertion point.\n\t\t\tconst insertIndex =\n\t\t\t\tisAtSameLevel && sourceBlockIndex < targetBlockIndex\n\t\t\t\t\t? targetBlockIndex - draggedBlockCount\n\t\t\t\t\t: targetBlockIndex;\n\n\t\t\tmoveBlocks( sourceClientIds, sourceRootClientId, insertIndex );\n\t\t}\n\t};\n}\n\n/**\n * A function that returns an event handler function for block-related file drop events.\n *\n * @param {string}   targetRootClientId    The root client id where the block(s) will be inserted.\n * @param {Function} getSettings           A function that gets the block editor settings.\n * @param {Function} updateBlockAttributes A function that updates a block's attributes.\n * @param {Function} canInsertBlockType    A function that returns checks whether a block type can be inserted.\n * @param {Function} insertOrReplaceBlocks A function that inserts or replaces blocks.\n *\n * @return {Function} The event handler for a block-related file drop event.\n */\nexport function onFilesDrop(\n\ttargetRootClientId,\n\tgetSettings,\n\tupdateBlockAttributes,\n\tcanInsertBlockType,\n\tinsertOrReplaceBlocks\n) {\n\treturn ( files ) => {\n\t\tif ( ! getSettings().mediaUpload ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst transformation = findTransform(\n\t\t\tgetBlockTransforms( 'from' ),\n\t\t\t( transform ) =>\n\t\t\t\ttransform.type === 'files' &&\n\t\t\t\tcanInsertBlockType( transform.blockName, targetRootClientId ) &&\n\t\t\t\ttransform.isMatch( files )\n\t\t);\n\n\t\tif ( transformation ) {\n\t\t\tconst blocks = transformation.transform(\n\t\t\t\tfiles,\n\t\t\t\tupdateBlockAttributes\n\t\t\t);\n\t\t\tinsertOrReplaceBlocks( blocks );\n\t\t}\n\t};\n}\n\n/**\n * A function that returns an event handler function for block-related HTML drop events.\n *\n * @param {Function} insertOrReplaceBlocks A function that inserts or replaces blocks.\n *\n * @return {Function} The event handler for a block-related HTML drop event.\n */\nexport function onHTMLDrop( insertOrReplaceBlocks ) {\n\treturn ( HTML ) => {\n\t\tconst blocks = pasteHandler( { HTML, mode: 'BLOCKS' } );\n\n\t\tif ( blocks.length ) {\n\t\t\tinsertOrReplaceBlocks( blocks );\n\t\t}\n\t};\n}\n\n/**\n * A React hook for handling block drop events.\n *\n * @param {string}          targetRootClientId  The root client id where the block(s) will be inserted.\n * @param {number}          targetBlockIndex    The index where the block(s) will be inserted.\n * @param {Object}          options             The optional options.\n * @param {WPDropOperation} [options.operation] The type of operation to perform on drop. Could be `insert` or `replace` for now.\n *\n * @return {Function} A function to be passed to the onDrop handler.\n */\nexport default function useOnBlockDrop(\n\ttargetRootClientId,\n\ttargetBlockIndex,\n\toptions = {}\n) {\n\tconst { operation = 'insert', nearestSide = 'right' } = options;\n\tconst {\n\t\tcanInsertBlockType,\n\t\tgetBlockIndex,\n\t\tgetClientIdsOfDescendants,\n\t\tgetBlockOrder,\n\t\tgetBlocksByClientId,\n\t\tgetSettings,\n\t\tgetBlock,\n\t} = useSelect( blockEditorStore );\n\tconst { getGroupingBlockName } = useSelect( blocksStore );\n\tconst {\n\t\tinsertBlocks,\n\t\tmoveBlocksToPosition,\n\t\tupdateBlockAttributes,\n\t\tclearSelectedBlock,\n\t\treplaceBlocks,\n\t\tremoveBlocks,\n\t} = useDispatch( blockEditorStore );\n\tconst registry = useRegistry();\n\n\tconst insertOrReplaceBlocks = useCallback(\n\t\t(\n\t\t\tblocks,\n\t\t\tupdateSelection = true,\n\t\t\tinitialPosition = 0,\n\t\t\tclientIdsToReplace = []\n\t\t) => {\n\t\t\tif ( ! Array.isArray( blocks ) ) {\n\t\t\t\tblocks = [ blocks ];\n\t\t\t}\n\t\t\tconst clientIds = getBlockOrder( targetRootClientId );\n\t\t\tconst clientId = clientIds[ targetBlockIndex ];\n\t\t\tif ( operation === 'replace' ) {\n\t\t\t\treplaceBlocks( clientId, blocks, undefined, initialPosition );\n\t\t\t} else if ( operation === 'group' ) {\n\t\t\t\tconst targetBlock = getBlock( clientId );\n\t\t\t\tif ( nearestSide === 'left' ) {\n\t\t\t\t\tblocks.push( targetBlock );\n\t\t\t\t} else {\n\t\t\t\t\tblocks.unshift( targetBlock );\n\t\t\t\t}\n\n\t\t\t\tconst groupInnerBlocks = blocks.map( ( block ) => {\n\t\t\t\t\treturn createBlock(\n\t\t\t\t\t\tblock.name,\n\t\t\t\t\t\tblock.attributes,\n\t\t\t\t\t\tblock.innerBlocks\n\t\t\t\t\t);\n\t\t\t\t} );\n\n\t\t\t\tconst areAllImages = blocks.every( ( block ) => {\n\t\t\t\t\treturn block.name === 'core/image';\n\t\t\t\t} );\n\n\t\t\t\tconst galleryBlock = canInsertBlockType(\n\t\t\t\t\t'core/gallery',\n\t\t\t\t\ttargetRootClientId\n\t\t\t\t);\n\n\t\t\t\tconst wrappedBlocks = createBlock(\n\t\t\t\t\tareAllImages && galleryBlock\n\t\t\t\t\t\t? 'core/gallery'\n\t\t\t\t\t\t: getGroupingBlockName(),\n\t\t\t\t\t{\n\t\t\t\t\t\tlayout: {\n\t\t\t\t\t\t\ttype: 'flex',\n\t\t\t\t\t\t\tflexWrap:\n\t\t\t\t\t\t\t\tareAllImages && galleryBlock ? null : 'nowrap',\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t\tgroupInnerBlocks\n\t\t\t\t);\n\t\t\t\t// Need to make sure both the target block and the block being dragged are replaced\n\t\t\t\t// otherwise the dragged block will be duplicated.\n\t\t\t\treplaceBlocks(\n\t\t\t\t\t[ clientId, ...clientIdsToReplace ],\n\t\t\t\t\twrappedBlocks,\n\t\t\t\t\tundefined,\n\t\t\t\t\tinitialPosition\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tinsertBlocks(\n\t\t\t\t\tblocks,\n\t\t\t\t\ttargetBlockIndex,\n\t\t\t\t\ttargetRootClientId,\n\t\t\t\t\tupdateSelection,\n\t\t\t\t\tinitialPosition\n\t\t\t\t);\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tgetBlockOrder,\n\t\t\ttargetRootClientId,\n\t\t\ttargetBlockIndex,\n\t\t\toperation,\n\t\t\treplaceBlocks,\n\t\t\tgetBlock,\n\t\t\tnearestSide,\n\t\t\tcanInsertBlockType,\n\t\t\tgetGroupingBlockName,\n\t\t\tinsertBlocks,\n\t\t]\n\t);\n\n\tconst moveBlocks = useCallback(\n\t\t( sourceClientIds, sourceRootClientId, insertIndex ) => {\n\t\t\tif ( operation === 'replace' ) {\n\t\t\t\tconst sourceBlocks = getBlocksByClientId( sourceClientIds );\n\t\t\t\tconst targetBlockClientIds =\n\t\t\t\t\tgetBlockOrder( targetRootClientId );\n\t\t\t\tconst targetBlockClientId =\n\t\t\t\t\ttargetBlockClientIds[ targetBlockIndex ];\n\n\t\t\t\tregistry.batch( () => {\n\t\t\t\t\t// Remove the source blocks.\n\t\t\t\t\tremoveBlocks( sourceClientIds, false );\n\t\t\t\t\t// Replace the target block with the source blocks.\n\t\t\t\t\treplaceBlocks(\n\t\t\t\t\t\ttargetBlockClientId,\n\t\t\t\t\t\tsourceBlocks,\n\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t0\n\t\t\t\t\t);\n\t\t\t\t} );\n\t\t\t} else {\n\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\tsourceClientIds,\n\t\t\t\t\tsourceRootClientId,\n\t\t\t\t\ttargetRootClientId,\n\t\t\t\t\tinsertIndex\n\t\t\t\t);\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\toperation,\n\t\t\tgetBlockOrder,\n\t\t\tgetBlocksByClientId,\n\t\t\tmoveBlocksToPosition,\n\t\t\tregistry,\n\t\t\tremoveBlocks,\n\t\t\treplaceBlocks,\n\t\t\ttargetBlockIndex,\n\t\t\ttargetRootClientId,\n\t\t]\n\t);\n\n\tconst _onDrop = onBlockDrop(\n\t\ttargetRootClientId,\n\t\ttargetBlockIndex,\n\t\tgetBlockIndex,\n\t\tgetClientIdsOfDescendants,\n\t\tmoveBlocks,\n\t\tinsertOrReplaceBlocks,\n\t\tclearSelectedBlock,\n\t\toperation,\n\t\tgetBlock\n\t);\n\tconst _onFilesDrop = onFilesDrop(\n\t\ttargetRootClientId,\n\t\tgetSettings,\n\t\tupdateBlockAttributes,\n\t\tcanInsertBlockType,\n\t\tinsertOrReplaceBlocks\n\t);\n\tconst _onHTMLDrop = onHTMLDrop( insertOrReplaceBlocks );\n\n\treturn ( event ) => {\n\t\tconst files = getFilesFromDataTransfer( event.dataTransfer );\n\t\tconst html = event.dataTransfer.getData( 'text/html' );\n\n\t\t/**\n\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t */\n\t\tif ( html ) {\n\t\t\t_onHTMLDrop( html );\n\t\t} else if ( files.length ) {\n\t\t\t_onFilesDrop( files );\n\t\t} else {\n\t\t\t_onDrop( event );\n\t\t}\n\t};\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\nimport {\n\tcloneBlock,\n\tcreateBlock,\n\tcloneSanitizedBlock,\n\tfindTransform,\n\tgetBlockTransforms,\n\tpasteHandler,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useDispatch, useSelect, useRegistry } from '@wordpress/data';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\n/** @typedef {React.SyntheticEvent} SyntheticEvent */\n/** @typedef {import('./types').WPDropOperation} WPDropOperation */\n\n/**\n * Retrieve the data for a block drop event.\n *\n * @param {SyntheticEvent} event The drop event.\n *\n * @return {Object} An object with block drag and drop data.\n */\nexport function parseDropEvent( event ) {\n\tlet result = {\n\t\tsrcRootClientId: null,\n\t\tsrcClientIds: null,\n\t\tsrcIndex: null,\n\t\ttype: null,\n\t\tblocks: null,\n\t};\n\n\tif ( ! event.dataTransfer ) {\n\t\treturn result;\n\t}\n\n\ttry {\n\t\tresult = Object.assign(\n\t\t\tresult,\n\t\t\tJSON.parse( event.dataTransfer.getData( 'wp-blocks' ) )\n\t\t);\n\t} catch {\n\t\treturn result;\n\t}\n\n\treturn result;\n}\n\n/**\n * A function that returns an event handler function for block drop events.\n *\n * @param {string}   targetRootClientId        The root client id where the block(s) will be inserted.\n * @param {number}   targetBlockIndex          The index where the block(s) will be inserted.\n * @param {Function} getBlockIndex             A function that gets the index of a block.\n * @param {Function} getClientIdsOfDescendants A function that gets the client ids of descendant blocks.\n * @param {Function} moveBlocks                A function that moves blocks.\n * @param {Function} insertOrReplaceBlocks     A function that inserts or replaces blocks.\n * @param {Function} clearSelectedBlock        A function that clears block selection.\n * @param {string}   operation                 The type of operation to perform on drop. Could be `insert` or `replace` or `group`.\n * @param {Function} getBlock                  A function that returns a block given its client id.\n * @return {Function} The event handler for a block drop event.\n */\nexport function onBlockDrop(\n\ttargetRootClientId,\n\ttargetBlockIndex,\n\tgetBlockIndex,\n\tgetClientIdsOfDescendants,\n\tmoveBlocks,\n\tinsertOrReplaceBlocks,\n\tclearSelectedBlock,\n\toperation,\n\tgetBlock\n) {\n\treturn ( event ) => {\n\t\tconst {\n\t\t\tsrcRootClientId: sourceRootClientId,\n\t\t\tsrcClientIds: sourceClientIds,\n\t\t\ttype: dropType,\n\t\t\tblocks,\n\t\t} = parseDropEvent( event );\n\n\t\t// If the user is inserting a block.\n\t\tif ( dropType === 'inserter' ) {\n\t\t\tclearSelectedBlock();\n\t\t\tconst blocksToInsert = blocks.map( ( block ) =>\n\t\t\t\tcloneBlock( block )\n\t\t\t);\n\t\t\tinsertOrReplaceBlocks( blocksToInsert, true, null );\n\t\t}\n\n\t\t// If the user is moving a block.\n\t\tif ( dropType === 'block' ) {\n\t\t\tconst sourceBlockIndex = getBlockIndex( sourceClientIds[ 0 ] );\n\n\t\t\t// If the user is dropping to the same position, return early.\n\t\t\tif (\n\t\t\t\tsourceRootClientId === targetRootClientId &&\n\t\t\t\tsourceBlockIndex === targetBlockIndex\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If the user is attempting to drop a block within its own\n\t\t\t// nested blocks, return early as this would create infinite\n\t\t\t// recursion.\n\t\t\tif (\n\t\t\t\tsourceClientIds.includes( targetRootClientId ) ||\n\t\t\t\tgetClientIdsOfDescendants( sourceClientIds ).some(\n\t\t\t\t\t( id ) => id === targetRootClientId\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If the user is dropping a block over another block, replace both blocks\n\t\t\t// with a group block containing them\n\t\t\tif ( operation === 'group' ) {\n\t\t\t\tconst blocksToInsert = sourceClientIds.map( ( clientId ) =>\n\t\t\t\t\tgetBlock( clientId )\n\t\t\t\t);\n\t\t\t\tinsertOrReplaceBlocks(\n\t\t\t\t\tblocksToInsert,\n\t\t\t\t\ttrue,\n\t\t\t\t\tnull,\n\t\t\t\t\tsourceClientIds\n\t\t\t\t);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst isAtSameLevel = sourceRootClientId === targetRootClientId;\n\t\t\tconst draggedBlockCount = sourceClientIds.length;\n\n\t\t\t// If the block is kept at the same level and moved downwards,\n\t\t\t// subtract to take into account that the blocks being dragged\n\t\t\t// were removed from the block list above the insertion point.\n\t\t\tconst insertIndex =\n\t\t\t\tisAtSameLevel && sourceBlockIndex < targetBlockIndex\n\t\t\t\t\t? targetBlockIndex - draggedBlockCount\n\t\t\t\t\t: targetBlockIndex;\n\n\t\t\tmoveBlocks( sourceClientIds, sourceRootClientId, insertIndex );\n\t\t}\n\t};\n}\n\n/**\n * A function that returns an event handler function for block-related file drop events.\n *\n * @param {string}   targetRootClientId    The root client id where the block(s) will be inserted.\n * @param {Function} getSettings           A function that gets the block editor settings.\n * @param {Function} updateBlockAttributes A function that updates a block's attributes.\n * @param {Function} canInsertBlockType    A function that returns checks whether a block type can be inserted.\n * @param {Function} insertOrReplaceBlocks A function that inserts or replaces blocks.\n *\n * @return {Function} The event handler for a block-related file drop event.\n */\nexport function onFilesDrop(\n\ttargetRootClientId,\n\tgetSettings,\n\tupdateBlockAttributes,\n\tcanInsertBlockType,\n\tinsertOrReplaceBlocks\n) {\n\treturn ( files ) => {\n\t\tif ( ! getSettings().mediaUpload ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst transformation = findTransform(\n\t\t\tgetBlockTransforms( 'from' ),\n\t\t\t( transform ) =>\n\t\t\t\ttransform.type === 'files' &&\n\t\t\t\tcanInsertBlockType( transform.blockName, targetRootClientId ) &&\n\t\t\t\ttransform.isMatch( files )\n\t\t);\n\n\t\tif ( transformation ) {\n\t\t\tconst blocks = transformation.transform(\n\t\t\t\tfiles,\n\t\t\t\tupdateBlockAttributes\n\t\t\t);\n\t\t\tinsertOrReplaceBlocks( blocks );\n\t\t}\n\t};\n}\n\n/**\n * A function that returns an event handler function for block-related HTML drop events.\n *\n * @param {Function} insertOrReplaceBlocks A function that inserts or replaces blocks.\n *\n * @return {Function} The event handler for a block-related HTML drop event.\n */\nexport function onHTMLDrop( insertOrReplaceBlocks ) {\n\treturn ( HTML ) => {\n\t\tconst blocks = pasteHandler( { HTML, mode: 'BLOCKS' } );\n\n\t\tif ( blocks.length ) {\n\t\t\tinsertOrReplaceBlocks( blocks );\n\t\t}\n\t};\n}\n\n/**\n * A React hook for handling block drop events.\n *\n * @param {string}          targetRootClientId  The root client id where the block(s) will be inserted.\n * @param {number}          targetBlockIndex    The index where the block(s) will be inserted.\n * @param {Object}          options             The optional options.\n * @param {WPDropOperation} [options.operation] The type of operation to perform on drop. Could be `insert` or `replace` for now.\n *\n * @return {Function} A function to be passed to the onDrop handler.\n */\nexport default function useOnBlockDrop(\n\ttargetRootClientId,\n\ttargetBlockIndex,\n\toptions = {}\n) {\n\tconst { operation = 'insert', nearestSide = 'right' } = options;\n\tconst {\n\t\tcanInsertBlockType,\n\t\tgetBlockIndex,\n\t\tgetClientIdsOfDescendants,\n\t\tgetBlockOrder,\n\t\tgetBlocksByClientId,\n\t\tgetSettings,\n\t\tgetBlock,\n\t} = useSelect( blockEditorStore );\n\tconst { getGroupingBlockName } = useSelect( blocksStore );\n\tconst {\n\t\tinsertBlocks,\n\t\tmoveBlocksToPosition,\n\t\tupdateBlockAttributes,\n\t\tclearSelectedBlock,\n\t\treplaceBlocks,\n\t\tremoveBlocks,\n\t} = useDispatch( blockEditorStore );\n\tconst registry = useRegistry();\n\n\tconst insertOrReplaceBlocks = useCallback(\n\t\t(\n\t\t\tblocks,\n\t\t\tupdateSelection = true,\n\t\t\tinitialPosition = 0,\n\t\t\tclientIdsToReplace = []\n\t\t) => {\n\t\t\tif ( ! Array.isArray( blocks ) ) {\n\t\t\t\tblocks = [ blocks ];\n\t\t\t}\n\t\t\tconst clientIds = getBlockOrder( targetRootClientId );\n\t\t\tconst clientId = clientIds[ targetBlockIndex ];\n\t\t\tif ( operation === 'replace' ) {\n\t\t\t\treplaceBlocks( clientId, blocks, undefined, initialPosition );\n\t\t\t} else if ( operation === 'group' ) {\n\t\t\t\tconst targetBlock = getBlock( clientId );\n\t\t\t\tif ( nearestSide === 'left' ) {\n\t\t\t\t\tblocks.push( targetBlock );\n\t\t\t\t} else {\n\t\t\t\t\tblocks.unshift( targetBlock );\n\t\t\t\t}\n\n\t\t\t\tconst groupInnerBlocks = blocks.map( ( block ) =>\n\t\t\t\t\tcloneSanitizedBlock( block )\n\t\t\t\t);\n\n\t\t\t\tconst areAllImages = blocks.every( ( block ) => {\n\t\t\t\t\treturn block.name === 'core/image';\n\t\t\t\t} );\n\n\t\t\t\tconst galleryBlock = canInsertBlockType(\n\t\t\t\t\t'core/gallery',\n\t\t\t\t\ttargetRootClientId\n\t\t\t\t);\n\n\t\t\t\tconst wrappedBlocks = createBlock(\n\t\t\t\t\tareAllImages && galleryBlock\n\t\t\t\t\t\t? 'core/gallery'\n\t\t\t\t\t\t: getGroupingBlockName(),\n\t\t\t\t\t{\n\t\t\t\t\t\tlayout: {\n\t\t\t\t\t\t\ttype: 'flex',\n\t\t\t\t\t\t\tflexWrap:\n\t\t\t\t\t\t\t\tareAllImages && galleryBlock ? null : 'nowrap',\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t\tgroupInnerBlocks\n\t\t\t\t);\n\t\t\t\t// Need to make sure both the target block and the block being dragged are replaced\n\t\t\t\t// otherwise the dragged block will be duplicated.\n\t\t\t\treplaceBlocks(\n\t\t\t\t\t[ clientId, ...clientIdsToReplace ],\n\t\t\t\t\twrappedBlocks,\n\t\t\t\t\tundefined,\n\t\t\t\t\tinitialPosition\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tinsertBlocks(\n\t\t\t\t\tblocks,\n\t\t\t\t\ttargetBlockIndex,\n\t\t\t\t\ttargetRootClientId,\n\t\t\t\t\tupdateSelection,\n\t\t\t\t\tinitialPosition\n\t\t\t\t);\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tgetBlockOrder,\n\t\t\ttargetRootClientId,\n\t\t\ttargetBlockIndex,\n\t\t\toperation,\n\t\t\treplaceBlocks,\n\t\t\tgetBlock,\n\t\t\tnearestSide,\n\t\t\tcanInsertBlockType,\n\t\t\tgetGroupingBlockName,\n\t\t\tinsertBlocks,\n\t\t]\n\t);\n\n\tconst moveBlocks = useCallback(\n\t\t( sourceClientIds, sourceRootClientId, insertIndex ) => {\n\t\t\tif ( operation === 'replace' ) {\n\t\t\t\tconst sourceBlocks = getBlocksByClientId( sourceClientIds );\n\t\t\t\tconst targetBlockClientIds =\n\t\t\t\t\tgetBlockOrder( targetRootClientId );\n\t\t\t\tconst targetBlockClientId =\n\t\t\t\t\ttargetBlockClientIds[ targetBlockIndex ];\n\n\t\t\t\tregistry.batch( () => {\n\t\t\t\t\t// Remove the source blocks.\n\t\t\t\t\tremoveBlocks( sourceClientIds, false );\n\t\t\t\t\t// Replace the target block with the source blocks.\n\t\t\t\t\treplaceBlocks(\n\t\t\t\t\t\ttargetBlockClientId,\n\t\t\t\t\t\tsourceBlocks,\n\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t0\n\t\t\t\t\t);\n\t\t\t\t} );\n\t\t\t} else {\n\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\tsourceClientIds,\n\t\t\t\t\tsourceRootClientId,\n\t\t\t\t\ttargetRootClientId,\n\t\t\t\t\tinsertIndex\n\t\t\t\t);\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\toperation,\n\t\t\tgetBlockOrder,\n\t\t\tgetBlocksByClientId,\n\t\t\tmoveBlocksToPosition,\n\t\t\tregistry,\n\t\t\tremoveBlocks,\n\t\t\treplaceBlocks,\n\t\t\ttargetBlockIndex,\n\t\t\ttargetRootClientId,\n\t\t]\n\t);\n\n\tconst _onDrop = onBlockDrop(\n\t\ttargetRootClientId,\n\t\ttargetBlockIndex,\n\t\tgetBlockIndex,\n\t\tgetClientIdsOfDescendants,\n\t\tmoveBlocks,\n\t\tinsertOrReplaceBlocks,\n\t\tclearSelectedBlock,\n\t\toperation,\n\t\tgetBlock\n\t);\n\tconst _onFilesDrop = onFilesDrop(\n\t\ttargetRootClientId,\n\t\tgetSettings,\n\t\tupdateBlockAttributes,\n\t\tcanInsertBlockType,\n\t\tinsertOrReplaceBlocks\n\t);\n\tconst _onHTMLDrop = onHTMLDrop( insertOrReplaceBlocks );\n\n\treturn ( event ) => {\n\t\tconst files = getFilesFromDataTransfer( event.dataTransfer );\n\t\tconst html = event.dataTransfer.getData( 'text/html' );\n\n\t\t/**\n\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t */\n\t\tif ( html ) {\n\t\t\t_onHTMLDrop( html );\n\t\t} else if ( files.length ) {\n\t\t\t_onFilesDrop( files );\n\t\t} else {\n\t\t\t_onDrop( event );\n\t\t}\n\t};\n}\n"],
+  "mappings": "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",
   "names": ["blockEditorStore", "blocksStore"]
 }

package/build/components/writing-flow/index.cjs CHANGED Viewed

@@ -39,6 +39,8 @@ var import_data = require("@wordpress/data");
 var import_i18n = require("@wordpress/i18n");
 var import_compose = require("@wordpress/compose");
 var import_element = require("@wordpress/element");
+var import_use_editable_root = __toESM(require("./use-editable-root.cjs"));
+var import_use_home_end = __toESM(require("./use-home-end.cjs"));
 var import_use_multi_selection = __toESM(require("./use-multi-selection.cjs"));
 var import_use_tab_nav = __toESM(require("./use-tab-nav.cjs"));
 var import_use_arrow_nav = __toESM(require("./use-arrow-nav.cjs"));
@@ -63,6 +65,8 @@ function useWritingFlow() {
       ref,
       (0, import_use_clipboard_handler.default)(),
       (0, import_use_input.default)(),
+      (0, import_use_editable_root.default)(),
+      (0, import_use_home_end.default)(),
       (0, import_use_drag_selection.default)(),
       (0, import_use_selection_observer.default)(),
       (0, import_use_click_selection.default)(),
@@ -85,7 +89,14 @@ function useWritingFlow() {
           );
           return () => {
             delete node.dataset.hasMultiSelection;
-            node.removeAttribute("aria-label");
+            if (node.contentEditable === "true") {
+              node.setAttribute(
+                "aria-label",
+                (0, import_i18n.__)("Editor canvas")
+              );
+            } else {
+              node.removeAttribute("aria-label");
+            }
           };
         },
         [hasMultiSelection]

package/build/components/writing-flow/index.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/writing-flow/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\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 { usePreviewModeNav } from './use-preview-mode-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 useClipboardHandler from './use-clipboard-handler';\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\tuseClipboardHandler(),\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\tusePreviewModeNav(),\n\t\t\tuseRefEffect(\n\t\t\t\t( node ) => {\n\t\t\t\t\tnode.tabIndex = 0;\n\t\t\t\t\tnode.dataset.hasMultiSelection = hasMultiSelection;\n\n\t\t\t\t\tif ( ! hasMultiSelection ) {\n\t\t\t\t\t\treturn () => {\n\t\t\t\t\t\t\tdelete node.dataset.hasMultiSelection;\n\t\t\t\t\t\t};\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\tdelete node.dataset.hasMultiSelection;\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={ clsx(\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 {Element} props.children Children to be rendered.\n */\nexport default forwardRef( WritingFlow );\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAA0B;AAC1B,kBAAmB;AACnB,qBAA2C;AAC3C,qBAA2B;AAK3B,iCAA8B;AAC9B,yBAAsB;AACtB,2BAAwB;AACxB,kCAAkC;AAClC,4BAAyB;AACzB,gCAA6B;AAC7B,oCAAiC;AACjC,iCAA8B;AAC9B,uBAAqB;AACrB,mCAAgC;AAChC,mBAA0C;AAqDxC;AAnDK,SAAS,iBAAiB;AAChC,QAAM,CAAE,QAAQ,KAAK,KAAM,QAAI,mBAAAA,SAAU;AACzC,QAAM,wBAAoB;AAAA,IACzB,CAAE,WAAY,OAAQ,aAAAC,KAAiB,EAAE,kBAAkB;AAAA,IAC3D,CAAC;AAAA,EACF;AAEA,SAAO;AAAA,IACN;AAAA,QACA,6BAAc;AAAA,MACb;AAAA,UACA,6BAAAC,SAAoB;AAAA,UACpB,iBAAAC,SAAS;AAAA,UACT,0BAAAC,SAAiB;AAAA,UACjB,8BAAAC,SAAqB;AAAA,UACrB,2BAAAC,SAAkB;AAAA,UAClB,2BAAAC,SAAkB;AAAA,UAClB,sBAAAC,SAAa;AAAA,UACb,qBAAAC,SAAY;AAAA,UACZ,+CAAkB;AAAA,UAClB;AAAA,QACC,CAAE,SAAU;AACX,eAAK,WAAW;AAChB,eAAK,QAAQ,oBAAoB;AAEjC,cAAK,CAAE,mBAAoB;AAC1B,mBAAO,MAAM;AACZ,qBAAO,KAAK,QAAQ;AAAA,YACrB;AAAA,UACD;AAEA,eAAK;AAAA,YACJ;AAAA,gBACA,gBAAI,0BAA2B;AAAA,UAChC;AAEA,iBAAO,MAAM;AACZ,mBAAO,KAAK,QAAQ;AACpB,iBAAK,gBAAiB,YAAa;AAAA,UACpC;AAAA,QACD;AAAA,QACA,CAAE,iBAAkB;AAAA,MACrB;AAAA,IACD,CAAE;AAAA,IACF;AAAA,EACD;AACD;AAEA,SAAS,YAAa,EAAE,UAAU,GAAG,MAAM,GAAG,cAAe;AAC5D,QAAM,CAAE,QAAQ,KAAK,KAAM,IAAI,eAAe;AAC9C,SACC,4EACG;AAAA;AAAA,IACF;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACL,SAAM,6BAAc,CAAE,KAAK,YAAa,CAAE;AAAA,QAC1C,eAAY,YAAAC;AAAA,UACX,MAAM;AAAA,UACN;AAAA,QACD;AAAA,QAEE;AAAA;AAAA,IACH;AAAA,IACE;AAAA,KACH;AAEF;AASA,IAAO,2BAAQ,2BAAY,WAAY;",
-  "names": ["useTabNav", "blockEditorStore", "useClipboardHandler", "useInput", "useDragSelection", "useSelectionObserver", "useClickSelection", "useMultiSelection", "useSelectAll", "useArrowNav", "clsx"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\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 useEditableRoot from './use-editable-root';\nimport useHomeEnd from './use-home-end';\nimport useMultiSelection from './use-multi-selection';\nimport useTabNav from './use-tab-nav';\nimport useArrowNav from './use-arrow-nav';\nimport { usePreviewModeNav } from './use-preview-mode-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 useClipboardHandler from './use-clipboard-handler';\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\tuseClipboardHandler(),\n\t\t\tuseInput(),\n\t\t\tuseEditableRoot(),\n\t\t\tuseHomeEnd(),\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\tusePreviewModeNav(),\n\t\t\tuseRefEffect(\n\t\t\t\t( node ) => {\n\t\t\t\t\tnode.tabIndex = 0;\n\t\t\t\t\tnode.dataset.hasMultiSelection = hasMultiSelection;\n\n\t\t\t\t\tif ( ! hasMultiSelection ) {\n\t\t\t\t\t\treturn () => {\n\t\t\t\t\t\t\tdelete node.dataset.hasMultiSelection;\n\t\t\t\t\t\t};\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\tdelete node.dataset.hasMultiSelection;\n\t\t\t\t\t\t// The wrapper may remain the editing host (the\n\t\t\t\t\t\t// collapsed block supports `editableRoot`): keep it\n\t\t\t\t\t\t// named, as the textbox role requires.\n\t\t\t\t\t\tif ( node.contentEditable === 'true' ) {\n\t\t\t\t\t\t\tnode.setAttribute(\n\t\t\t\t\t\t\t\t'aria-label',\n\t\t\t\t\t\t\t\t__( 'Editor canvas' )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnode.removeAttribute( 'aria-label' );\n\t\t\t\t\t\t}\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={ clsx(\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 {Element} props.children Children to be rendered.\n */\nexport default forwardRef( WritingFlow );\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAA0B;AAC1B,kBAAmB;AACnB,qBAA2C;AAC3C,qBAA2B;AAK3B,+BAA4B;AAC5B,0BAAuB;AACvB,iCAA8B;AAC9B,yBAAsB;AACtB,2BAAwB;AACxB,kCAAkC;AAClC,4BAAyB;AACzB,gCAA6B;AAC7B,oCAAiC;AACjC,iCAA8B;AAC9B,uBAAqB;AACrB,mCAAgC;AAChC,mBAA0C;AAiExC;AA/DK,SAAS,iBAAiB;AAChC,QAAM,CAAE,QAAQ,KAAK,KAAM,QAAI,mBAAAA,SAAU;AACzC,QAAM,wBAAoB;AAAA,IACzB,CAAE,WAAY,OAAQ,aAAAC,KAAiB,EAAE,kBAAkB;AAAA,IAC3D,CAAC;AAAA,EACF;AAEA,SAAO;AAAA,IACN;AAAA,QACA,6BAAc;AAAA,MACb;AAAA,UACA,6BAAAC,SAAoB;AAAA,UACpB,iBAAAC,SAAS;AAAA,UACT,yBAAAC,SAAgB;AAAA,UAChB,oBAAAC,SAAW;AAAA,UACX,0BAAAC,SAAiB;AAAA,UACjB,8BAAAC,SAAqB;AAAA,UACrB,2BAAAC,SAAkB;AAAA,UAClB,2BAAAC,SAAkB;AAAA,UAClB,sBAAAC,SAAa;AAAA,UACb,qBAAAC,SAAY;AAAA,UACZ,+CAAkB;AAAA,UAClB;AAAA,QACC,CAAE,SAAU;AACX,eAAK,WAAW;AAChB,eAAK,QAAQ,oBAAoB;AAEjC,cAAK,CAAE,mBAAoB;AAC1B,mBAAO,MAAM;AACZ,qBAAO,KAAK,QAAQ;AAAA,YACrB;AAAA,UACD;AAEA,eAAK;AAAA,YACJ;AAAA,gBACA,gBAAI,0BAA2B;AAAA,UAChC;AAEA,iBAAO,MAAM;AACZ,mBAAO,KAAK,QAAQ;AAIpB,gBAAK,KAAK,oBAAoB,QAAS;AACtC,mBAAK;AAAA,gBACJ;AAAA,oBACA,gBAAI,eAAgB;AAAA,cACrB;AAAA,YACD,OAAO;AACN,mBAAK,gBAAiB,YAAa;AAAA,YACpC;AAAA,UACD;AAAA,QACD;AAAA,QACA,CAAE,iBAAkB;AAAA,MACrB;AAAA,IACD,CAAE;AAAA,IACF;AAAA,EACD;AACD;AAEA,SAAS,YAAa,EAAE,UAAU,GAAG,MAAM,GAAG,cAAe;AAC5D,QAAM,CAAE,QAAQ,KAAK,KAAM,IAAI,eAAe;AAC9C,SACC,4EACG;AAAA;AAAA,IACF;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACL,SAAM,6BAAc,CAAE,KAAK,YAAa,CAAE;AAAA,QAC1C,eAAY,YAAAC;AAAA,UACX,MAAM;AAAA,UACN;AAAA,QACD;AAAA,QAEE;AAAA;AAAA,IACH;AAAA,IACE;AAAA,KACH;AAEF;AASA,IAAO,2BAAQ,2BAAY,WAAY;",
+  "names": ["useTabNav", "blockEditorStore", "useClipboardHandler", "useInput", "useEditableRoot", "useHomeEnd", "useDragSelection", "useSelectionObserver", "useClickSelection", "useMultiSelection", "useSelectAll", "useArrowNav", "clsx"]
 }

package/build/components/writing-flow/use-arrow-nav.cjs CHANGED Viewed

@@ -31,6 +31,7 @@ var import_data = require("@wordpress/data");
 var import_compose = require("@wordpress/compose");
 var import_dom2 = require("../../utils/dom.cjs");
 var import_store = require("../../store/index.cjs");
+var import_utils = require("./utils.cjs");
 function isNavigationCandidate(element, keyCode, hasModifier) {
   const isVertical = keyCode === import_keycodes.UP || keyCode === import_keycodes.DOWN;
   const { tagName } = element;
@@ -85,7 +86,7 @@ function getClosestTabbable(target, isReverse, containerElement, onlyVertical) {
     if (!import_dom.focus.tabbable.isTabbableIndex(node)) {
       return false;
     }
-    if (node.isContentEditable && node.contentEditable !== "true") {
+    if (node.isContentEditable && node.contentEditable !== "true" && (0, import_dom2.getBlockClientId)(node.closest('[contenteditable="true"]'))) {
       return false;
     }
     if (onlyVertical) {
@@ -124,7 +125,11 @@ function useArrowNav() {
       if (event.defaultPrevented) {
         return;
       }
-      const { keyCode, target, shiftKey, ctrlKey, altKey, metaKey } = event;
+      const { keyCode, shiftKey, ctrlKey, altKey, metaKey } = event;
+      const target = event.target === node && (0, import_dom2.getSelectionEditableElement)(
+        node.ownerDocument.defaultView.getSelection(),
+        node
+      ) || event.target;
       const isUp = keyCode === import_keycodes.UP;
       const isDown = keyCode === import_keycodes.DOWN;
       const isLeft = keyCode === import_keycodes.LEFT;
@@ -169,9 +174,17 @@ function useArrowNav() {
       const isReverseDir = (0, import_dom.isRTL)(target) ? !isReverse : isReverse;
       const { keepCaretInsideBlock } = getSettings();
       if (shiftKey) {
-        if (isClosestTabbableABlock(target, isReverse) && isNavEdge(target, isReverse)) {
-          node.contentEditable = true;
-          node.focus();
+        if (isNavEdge(target, isReverse)) {
+          if (isClosestTabbableABlock(target, isReverse)) {
+            (0, import_utils.setContentEditableWrapper)(node, true);
+          } else if (node.contentEditable === "true") {
+            const selection = defaultView.getSelection();
+            selection.extend(
+              target,
+              isReverse ? 0 : target.childNodes.length
+            );
+            event.preventDefault();
+          }
         }
       } else if (isVertical && (0, import_dom.isVerticalEdge)(target, isReverse) && // When Alt is pressed, only intercept if the caret is also at
       // the horizontal edge.

package/build/components/writing-flow/use-arrow-nav.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/writing-flow/use-arrow-nav.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tcomputeCaretRect,\n\tfocus,\n\tisHorizontalEdge,\n\tisVerticalEdge,\n\tplaceCaretAtHorizontalEdge,\n\tplaceCaretAtVerticalEdge,\n\tisRTL,\n\tisFormElement,\n} from '@wordpress/dom';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { getBlockClientId } 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\tconst { tagName } = element;\n\tconst elementType = element.getAttribute( 'type' );\n\n\t// Native inputs should not navigate vertically, unless they are simple types that don't need up/down arrow keys.\n\tif ( isVertical && ! hasModifier ) {\n\t\tif ( tagName === 'INPUT' ) {\n\t\t\tconst verticalInputTypes = [\n\t\t\t\t'date',\n\t\t\t\t'datetime-local',\n\t\t\t\t'month',\n\t\t\t\t'number',\n\t\t\t\t'range',\n\t\t\t\t'time',\n\t\t\t\t'week',\n\t\t\t];\n\t\t\treturn ! verticalInputTypes.includes( elementType );\n\t\t}\n\t\treturn true;\n\t}\n\n\t// Native inputs should not navigate horizontally, unless they are simple types that don't need left/right arrow keys.\n\tif ( tagName === 'INPUT' ) {\n\t\tconst simpleInputTypes = [\n\t\t\t'button',\n\t\t\t'checkbox',\n\t\t\t'number',\n\t\t\t'color',\n\t\t\t'file',\n\t\t\t'image',\n\t\t\t'radio',\n\t\t\t'reset',\n\t\t\t'submit',\n\t\t];\n\t\treturn simpleInputTypes.includes( elementType );\n\t}\n\n\t// Native textareas should not navigate horizontally.\n\treturn 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();\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// If it's a block wrapper (not itself a contenteditable editing surface)\n\t\t// and there are nested focusable nodes, skip because there are better\n\t\t// candidates. We must not skip contenteditable nodes that happen to\n\t\t// contain links or other focusable inline elements, since those are the\n\t\t// correct navigation targets.\n\t\t//\n\t\t// See https://github.com/WordPress/gutenberg/pull/77474\n\t\t// TODO: Consider fixing focus.tabbable\n\t\tif (\n\t\t\tnode.contentEditable !== 'true' &&\n\t\t\tgetBlockClientId( node ) &&\n\t\t\tfocus.focusable\n\t\t\t\t.find( node )\n\t\t\t\t// Exclude form elements for now because primary+a cannot be\n\t\t\t\t// used to select the parent element.\n\t\t\t\t.filter( ( element ) => ! isFormElement( element ) ).length !==\n\t\t\t\t0\n\t\t) {\n\t\t\treturn false;\n\t\t}\n\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 focusableNodes.find( isTabCandidate );\n}\n\nexport default function useArrowNav() {\n\tconst {\n\t\tgetMultiSelectedBlocksStartClientId,\n\t\tgetMultiSelectedBlocksEndClientId,\n\t\tgetSettings,\n\t\thasMultiSelection,\n\t\t__unstableIsFullySelected,\n\t} = useSelect( blockEditorStore );\n\tconst { 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 isClosestTabbableABlock( 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 closestTabbable && getBlockClientId( closestTabbable );\n\t\t}\n\n\t\tfunction onKeyDown( event ) {\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\tconst { keyCode, target, shiftKey, ctrlKey, altKey, metaKey } =\n\t\t\t\tevent;\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 hasModifier = shiftKey || ctrlKey || altKey || 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 ( ! isNav ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// In preview mode, navigation is handled by useSelectableBlocksNav.\n\t\t\tif ( getSettings().isPreviewMode ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If there is a multi-selection, the arrow keys should collapse the\n\t\t\t// selection to the start or end of the selection.\n\t\t\tif ( hasMultiSelection() ) {\n\t\t\t\tif ( shiftKey ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Only handle if we have a full selection (not a native partial\n\t\t\t\t// selection).\n\t\t\t\tif ( ! __unstableIsFullySelected() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tif ( isReverse ) {\n\t\t\t\t\tselectBlock( getMultiSelectedBlocksStartClientId() );\n\t\t\t\t} else {\n\t\t\t\t\tselectBlock( getMultiSelectedBlocksEndClientId(), -1 );\n\t\t\t\t}\n\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// 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// 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\n\t\t\tif ( shiftKey ) {\n\t\t\t\tif (\n\t\t\t\t\tisClosestTabbableABlock( 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// When Alt is pressed, only intercept if the caret is also at\n\t\t\t\t// the horizontal edge.\n\t\t\t\t( altKey ? isHorizontalEdge( target, isReverseDir ) : true ) &&\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\t// When Alt is pressed, place the caret at the furthest\n\t\t\t\t\t\t// horizontal edge and the furthest vertical edge.\n\t\t\t\t\t\taltKey ? ! isReverse : isReverse,\n\t\t\t\t\t\taltKey ? undefined : verticalRect\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"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tcomputeCaretRect,\n\tfocus,\n\tisHorizontalEdge,\n\tisVerticalEdge,\n\tplaceCaretAtHorizontalEdge,\n\tplaceCaretAtVerticalEdge,\n\tisRTL,\n\tisFormElement,\n} from '@wordpress/dom';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { getBlockClientId, getSelectionEditableElement } from '../../utils/dom';\nimport { store as blockEditorStore } from '../../store';\nimport { setContentEditableWrapper } from './utils';\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\tconst { tagName } = element;\n\tconst elementType = element.getAttribute( 'type' );\n\n\t// Native inputs should not navigate vertically, unless they are simple types that don't need up/down arrow keys.\n\tif ( isVertical && ! hasModifier ) {\n\t\tif ( tagName === 'INPUT' ) {\n\t\t\tconst verticalInputTypes = [\n\t\t\t\t'date',\n\t\t\t\t'datetime-local',\n\t\t\t\t'month',\n\t\t\t\t'number',\n\t\t\t\t'range',\n\t\t\t\t'time',\n\t\t\t\t'week',\n\t\t\t];\n\t\t\treturn ! verticalInputTypes.includes( elementType );\n\t\t}\n\t\treturn true;\n\t}\n\n\t// Native inputs should not navigate horizontally, unless they are simple types that don't need left/right arrow keys.\n\tif ( tagName === 'INPUT' ) {\n\t\tconst simpleInputTypes = [\n\t\t\t'button',\n\t\t\t'checkbox',\n\t\t\t'number',\n\t\t\t'color',\n\t\t\t'file',\n\t\t\t'image',\n\t\t\t'radio',\n\t\t\t'reset',\n\t\t\t'submit',\n\t\t];\n\t\treturn simpleInputTypes.includes( elementType );\n\t}\n\n\t// Native textareas should not navigate horizontally.\n\treturn 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();\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// If it's a block wrapper (not itself a contenteditable editing surface)\n\t\t// and there are nested focusable nodes, skip because there are better\n\t\t// candidates. We must not skip contenteditable nodes that happen to\n\t\t// contain links or other focusable inline elements, since those are the\n\t\t// correct navigation targets.\n\t\t//\n\t\t// See https://github.com/WordPress/gutenberg/pull/77474\n\t\t// TODO: Consider fixing focus.tabbable\n\t\tif (\n\t\t\tnode.contentEditable !== 'true' &&\n\t\t\tgetBlockClientId( node ) &&\n\t\t\tfocus.focusable\n\t\t\t\t.find( node )\n\t\t\t\t// Exclude form elements for now because primary+a cannot be\n\t\t\t\t// used to select the parent element.\n\t\t\t\t.filter( ( element ) => ! isFormElement( element ) ).length !==\n\t\t\t\t0\n\t\t) {\n\t\t\treturn false;\n\t\t}\n\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\n\t\t// nodes: nodes whose closest editable host is an editable element\n\t\t// within a block. When an editable root (e.g. the canvas wrapper)\n\t\t// is the editing host, everything within it is content editable,\n\t\t// but focusables like block wrappers are not text content.\n\t\tif (\n\t\t\tnode.isContentEditable &&\n\t\t\tnode.contentEditable !== 'true' &&\n\t\t\tgetBlockClientId( node.closest( '[contenteditable=\"true\"]' ) )\n\t\t) {\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 focusableNodes.find( isTabCandidate );\n}\n\nexport default function useArrowNav() {\n\tconst {\n\t\tgetMultiSelectedBlocksStartClientId,\n\t\tgetMultiSelectedBlocksEndClientId,\n\t\tgetSettings,\n\t\thasMultiSelection,\n\t\t__unstableIsFullySelected,\n\t} = useSelect( blockEditorStore );\n\tconst { 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 isClosestTabbableABlock( 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 closestTabbable && getBlockClientId( closestTabbable );\n\t\t}\n\n\t\tfunction onKeyDown( event ) {\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\tconst { keyCode, shiftKey, ctrlKey, altKey, metaKey } = event;\n\t\t\t// When the wrapper is contentEditable and holds focus (the\n\t\t\t// selected block supports `editableRoot`), the event targets the\n\t\t\t// wrapper; resolve the editable element containing the selection.\n\t\t\tconst target =\n\t\t\t\t( event.target === node &&\n\t\t\t\t\tgetSelectionEditableElement(\n\t\t\t\t\t\tnode.ownerDocument.defaultView.getSelection(),\n\t\t\t\t\t\tnode\n\t\t\t\t\t) ) ||\n\t\t\t\tevent.target;\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 hasModifier = shiftKey || ctrlKey || altKey || 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 ( ! isNav ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// In preview mode, navigation is handled by useSelectableBlocksNav.\n\t\t\tif ( getSettings().isPreviewMode ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If there is a multi-selection, the arrow keys should collapse the\n\t\t\t// selection to the start or end of the selection.\n\t\t\tif ( hasMultiSelection() ) {\n\t\t\t\tif ( shiftKey ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Only handle if we have a full selection (not a native partial\n\t\t\t\t// selection).\n\t\t\t\tif ( ! __unstableIsFullySelected() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tif ( isReverse ) {\n\t\t\t\t\tselectBlock( getMultiSelectedBlocksStartClientId() );\n\t\t\t\t} else {\n\t\t\t\t\tselectBlock( getMultiSelectedBlocksEndClientId(), -1 );\n\t\t\t\t}\n\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// 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// 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\n\t\t\tif ( shiftKey ) {\n\t\t\t\tif ( isNavEdge( target, isReverse ) ) {\n\t\t\t\t\tif ( isClosestTabbableABlock( target, isReverse ) ) {\n\t\t\t\t\t\tsetContentEditableWrapper( node, true );\n\t\t\t\t\t} else if ( node.contentEditable === 'true' ) {\n\t\t\t\t\t\t// There is no block to extend the selection into.\n\t\t\t\t\t\t// Within an editable wrapper the selection could\n\t\t\t\t\t\t// natively escape into surrounding editable elements\n\t\t\t\t\t\t// (e.g. the post title), so keep it inside the block\n\t\t\t\t\t\t// by extending it to the block's edge.\n\t\t\t\t\t\tconst selection = defaultView.getSelection();\n\t\t\t\t\t\tselection.extend(\n\t\t\t\t\t\t\ttarget,\n\t\t\t\t\t\t\tisReverse ? 0 : target.childNodes.length\n\t\t\t\t\t\t);\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\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// When Alt is pressed, only intercept if the caret is also at\n\t\t\t\t// the horizontal edge.\n\t\t\t\t( altKey ? isHorizontalEdge( target, isReverseDir ) : true ) &&\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\t// When Alt is pressed, place the caret at the furthest\n\t\t\t\t\t\t// horizontal edge and the furthest vertical edge.\n\t\t\t\t\t\taltKey ? ! isReverse : isReverse,\n\t\t\t\t\t\taltKey ? undefined : verticalRect\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"],
+  "mappings": "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",
   "names": ["import_dom", "blockEditorStore"]
 }

package/build/components/writing-flow/use-click-selection.cjs CHANGED Viewed

@@ -26,6 +26,7 @@ module.exports = __toCommonJS(use_click_selection_exports);
 var import_data = require("@wordpress/data");
 var import_compose = require("@wordpress/compose");
 var import_store = require("../../store/index.cjs");
+var import_utils = require("./utils.cjs");
 var import_dom = require("../../utils/dom.cjs");
 function useClickSelection() {
   const { selectBlock } = (0, import_data.useDispatch)(import_store.store);
@@ -40,8 +41,7 @@ function useClickSelection() {
         const clickedClientId = (0, import_dom.getBlockClientId)(event.target);
         if (event.shiftKey) {
           if (startClientId && startClientId !== clickedClientId) {
-            node.contentEditable = true;
-            node.focus();
+            (0, import_utils.setContentEditableWrapper)(node, true);
           }
         } else if (hasMultiSelection()) {
           selectBlock(clickedClientId);

package/build/components/writing-flow/use-click-selection.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/writing-flow/use-click-selection.js"],
-  "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 { selectBlock } = useDispatch( blockEditorStore );\n\tconst { isSelectionEnabled, getBlockSelectionStart, hasMultiSelection } =\n\t\tuseSelect( 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\t// When selecting a single block in a document by holding the shift key,\n\t\t\t\t\t// don't mark this action as multiselection.\n\t\t\t\t\tif ( startClientId && 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\tselectBlock,\n\t\t\tisSelectionEnabled,\n\t\t\tgetBlockSelectionStart,\n\t\t\thasMultiSelection,\n\t\t]\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAuC;AACvC,qBAA6B;AAK7B,mBAA0C;AAC1C,iBAAiC;AAElB,SAAR,oBAAqC;AAC3C,QAAM,EAAE,YAAY,QAAI,yBAAa,aAAAA,KAAiB;AACtD,QAAM,EAAE,oBAAoB,wBAAwB,kBAAkB,QACrE,uBAAW,aAAAA,KAAiB;AAC7B,aAAO;AAAA,IACN,CAAE,SAAU;AACX,eAAS,YAAa,OAAQ;AAG7B,YAAK,CAAE,mBAAmB,KAAK,MAAM,WAAW,GAAI;AACnD;AAAA,QACD;AAEA,cAAM,gBAAgB,uBAAuB;AAC7C,cAAM,sBAAkB,6BAAkB,MAAM,MAAO;AAEvD,YAAK,MAAM,UAAW;AAGrB,cAAK,iBAAiB,kBAAkB,iBAAkB;AACzD,iBAAK,kBAAkB;AAEvB,iBAAK,MAAM;AAAA,UACZ;AAAA,QACD,WAAY,kBAAkB,GAAI;AAOjC,sBAAa,eAAgB;AAAA,QAC9B;AAAA,MACD;AAEA,WAAK,iBAAkB,aAAa,WAAY;AAEhD,aAAO,MAAM;AACZ,aAAK,oBAAqB,aAAa,WAAY;AAAA,MACpD;AAAA,IACD;AAAA,IACA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;",
+  "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 { setContentEditableWrapper } from './utils';\nimport { getBlockClientId } from '../../utils/dom';\n\nexport default function useClickSelection() {\n\tconst { selectBlock } = useDispatch( blockEditorStore );\n\tconst { isSelectionEnabled, getBlockSelectionStart, hasMultiSelection } =\n\t\tuseSelect( 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\t// When selecting a single block in a document by holding the shift key,\n\t\t\t\t\t// don't mark this action as multiselection.\n\t\t\t\t\tif ( startClientId && startClientId !== clickedClientId ) {\n\t\t\t\t\t\tsetContentEditableWrapper( node, true );\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\tselectBlock,\n\t\t\tisSelectionEnabled,\n\t\t\tgetBlockSelectionStart,\n\t\t\thasMultiSelection,\n\t\t]\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAuC;AACvC,qBAA6B;AAK7B,mBAA0C;AAC1C,mBAA0C;AAC1C,iBAAiC;AAElB,SAAR,oBAAqC;AAC3C,QAAM,EAAE,YAAY,QAAI,yBAAa,aAAAA,KAAiB;AACtD,QAAM,EAAE,oBAAoB,wBAAwB,kBAAkB,QACrE,uBAAW,aAAAA,KAAiB;AAC7B,aAAO;AAAA,IACN,CAAE,SAAU;AACX,eAAS,YAAa,OAAQ;AAG7B,YAAK,CAAE,mBAAmB,KAAK,MAAM,WAAW,GAAI;AACnD;AAAA,QACD;AAEA,cAAM,gBAAgB,uBAAuB;AAC7C,cAAM,sBAAkB,6BAAkB,MAAM,MAAO;AAEvD,YAAK,MAAM,UAAW;AAGrB,cAAK,iBAAiB,kBAAkB,iBAAkB;AACzD,wDAA2B,MAAM,IAAK;AAAA,UACvC;AAAA,QACD,WAAY,kBAAkB,GAAI;AAOjC,sBAAa,eAAgB;AAAA,QAC9B;AAAA,MACD;AAEA,WAAK,iBAAkB,aAAa,WAAY;AAEhD,aAAO,MAAM;AACZ,aAAK,oBAAqB,aAAa,WAAY;AAAA,MACpD;AAAA,IACD;AAAA,IACA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;",
   "names": ["blockEditorStore"]
 }

package/build/components/writing-flow/use-clipboard-handler.cjs CHANGED Viewed

@@ -108,7 +108,10 @@ function useClipboardHandler() {
         if (shouldHandleWholeBlocks && !expandSelectionIsNeeded) {
           removeBlocks(selectedBlockClientIds);
         } else {
-          event.target.ownerDocument.activeElement.contentEditable = false;
+          (0, import_utils.setContentEditableWrapper)(
+            event.target.ownerDocument.activeElement,
+            false
+          );
           __unstableDeleteSelection();
         }
       } else if (event.type === "paste") {

package/build/components/writing-flow/use-clipboard-handler.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/writing-flow/use-clipboard-handler.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tpasteHandler,\n\tfindTransform,\n\tgetBlockTransforms,\n\thasBlockSupport,\n\tswitchToBlockType,\n} from '@wordpress/blocks';\nimport {\n\tdocumentHasSelection,\n\tdocumentHasUncollapsedSelection,\n} from '@wordpress/dom';\nimport { useDispatch, useRegistry, useSelect } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { useNotifyCopy } from '../../utils/use-notify-copy';\nimport { setClipboardBlocks } from './utils';\nimport { getPasteEventData } from '../../utils/pasting';\n\nexport default function useClipboardHandler() {\n\tconst registry = useRegistry();\n\tconst {\n\t\tgetBlocksByClientId,\n\t\tgetSelectedBlockClientIds,\n\t\thasMultiSelection,\n\t\tgetSettings,\n\t\tgetBlockName,\n\t\t__unstableIsFullySelected,\n\t\t__unstableIsSelectionCollapsed,\n\t\t__unstableIsSelectionMergeable,\n\t\t__unstableGetSelectedBlocksWithPartialSelection,\n\t\tcanInsertBlockType,\n\t\tgetBlockRootClientId,\n\t} = useSelect( blockEditorStore );\n\tconst {\n\t\tflashBlock,\n\t\tremoveBlocks,\n\t\treplaceBlocks,\n\t\t__unstableDeleteSelection,\n\t\t__unstableExpandSelection,\n\t\t__unstableSplitSelection,\n\t} = useDispatch( blockEditorStore );\n\tconst notifyCopy = useNotifyCopy();\n\n\treturn useRefEffect( ( node ) => {\n\t\tfunction handler( event ) {\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\t// This was likely already handled in rich-text/use-paste-handler.js.\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst selectedBlockClientIds = getSelectedBlockClientIds();\n\n\t\t\tif ( selectedBlockClientIds.length === 0 ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Let native copy/paste behaviour take over in input fields.\n\t\t\t// But always handle multiple selected blocks.\n\t\t\tif ( ! hasMultiSelection() ) {\n\t\t\t\tconst { target } = event;\n\t\t\t\tconst { ownerDocument } = target;\n\t\t\t\t// If copying, only consider actual text selection as selection.\n\t\t\t\t// Otherwise, any focus on an input field is considered.\n\t\t\t\tconst hasSelection =\n\t\t\t\t\tevent.type === 'copy' || event.type === 'cut'\n\t\t\t\t\t\t? documentHasUncollapsedSelection( ownerDocument )\n\t\t\t\t\t\t: documentHasSelection( ownerDocument ) &&\n\t\t\t\t\t\t  ! ownerDocument.activeElement.isContentEditable;\n\n\t\t\t\t// Let native copy behaviour take over in input fields.\n\t\t\t\tif ( hasSelection ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst { activeElement } = event.target.ownerDocument;\n\n\t\t\tif ( ! node.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst isSelectionMergeable = __unstableIsSelectionMergeable();\n\t\t\tconst shouldHandleWholeBlocks =\n\t\t\t\t__unstableIsSelectionCollapsed() || __unstableIsFullySelected();\n\t\t\tconst expandSelectionIsNeeded =\n\t\t\t\t! shouldHandleWholeBlocks && ! isSelectionMergeable;\n\t\t\tif ( event.type === 'copy' || event.type === 'cut' ) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tif ( selectedBlockClientIds.length === 1 ) {\n\t\t\t\t\tflashBlock( selectedBlockClientIds[ 0 ] );\n\t\t\t\t}\n\t\t\t\t// If we have a partial selection that is not mergeable, just\n\t\t\t\t// expand the selection to the whole blocks.\n\t\t\t\tif ( expandSelectionIsNeeded ) {\n\t\t\t\t\t__unstableExpandSelection();\n\t\t\t\t} else {\n\t\t\t\t\tnotifyCopy( event.type, selectedBlockClientIds );\n\t\t\t\t\tlet blocks;\n\t\t\t\t\t// Check if we have partial selection.\n\t\t\t\t\tif ( shouldHandleWholeBlocks ) {\n\t\t\t\t\t\tblocks = getBlocksByClientId( selectedBlockClientIds );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst [ head, tail ] =\n\t\t\t\t\t\t\t__unstableGetSelectedBlocksWithPartialSelection();\n\t\t\t\t\t\tconst inBetweenBlocks = getBlocksByClientId(\n\t\t\t\t\t\t\tselectedBlockClientIds.slice(\n\t\t\t\t\t\t\t\t1,\n\t\t\t\t\t\t\t\tselectedBlockClientIds.length - 1\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t\tblocks = [ head, ...inBetweenBlocks, tail ];\n\t\t\t\t\t}\n\n\t\t\t\t\tsetClipboardBlocks( event, blocks, registry );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( event.type === 'cut' ) {\n\t\t\t\t// We need to also check if at the start we needed to\n\t\t\t\t// expand the selection, as in this point we might have\n\t\t\t\t// programmatically fully selected the blocks above.\n\t\t\t\tif ( shouldHandleWholeBlocks && ! expandSelectionIsNeeded ) {\n\t\t\t\t\tremoveBlocks( selectedBlockClientIds );\n\t\t\t\t} else {\n\t\t\t\t\tevent.target.ownerDocument.activeElement.contentEditable = false;\n\t\t\t\t\t__unstableDeleteSelection();\n\t\t\t\t}\n\t\t\t} else if ( event.type === 'paste' ) {\n\t\t\t\tconst {\n\t\t\t\t\t__experimentalCanUserUseUnfilteredHTML:\n\t\t\t\t\t\tcanUserUseUnfilteredHTML,\n\t\t\t\t\tmediaUpload,\n\t\t\t\t} = getSettings();\n\t\t\t\tconst isInternal =\n\t\t\t\t\tevent.clipboardData.getData( 'rich-text' ) === 'true';\n\t\t\t\tif ( isInternal ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tconst { plainText, html, files } = getPasteEventData( event );\n\t\t\t\tconst isFullySelected = __unstableIsFullySelected();\n\t\t\t\tlet blocks = [];\n\n\t\t\t\tif ( files.length ) {\n\t\t\t\t\tif ( ! mediaUpload ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst fromTransforms = getBlockTransforms( 'from' );\n\t\t\t\t\tblocks = files\n\t\t\t\t\t\t.reduce( ( accumulator, file ) => {\n\t\t\t\t\t\t\tconst transformation = findTransform(\n\t\t\t\t\t\t\t\tfromTransforms,\n\t\t\t\t\t\t\t\t( transform ) =>\n\t\t\t\t\t\t\t\t\ttransform.type === 'files' &&\n\t\t\t\t\t\t\t\t\ttransform.isMatch( [ file ] )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tif ( transformation ) {\n\t\t\t\t\t\t\t\taccumulator.push(\n\t\t\t\t\t\t\t\t\ttransformation.transform( [ file ] )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn accumulator;\n\t\t\t\t\t\t}, [] )\n\t\t\t\t\t\t.flat();\n\t\t\t\t} else {\n\t\t\t\t\tblocks = pasteHandler( {\n\t\t\t\t\t\tHTML: html,\n\t\t\t\t\t\tplainText,\n\t\t\t\t\t\tmode: isFullySelected ? 'BLOCKS' : 'AUTO',\n\t\t\t\t\t\tcanUserUseUnfilteredHTML,\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// Inline paste: let rich text handle it.\n\t\t\t\tif ( typeof blocks === 'string' ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( isFullySelected ) {\n\t\t\t\t\treplaceBlocks(\n\t\t\t\t\t\tselectedBlockClientIds,\n\t\t\t\t\t\tblocks,\n\t\t\t\t\t\tblocks.length - 1,\n\t\t\t\t\t\t-1\n\t\t\t\t\t);\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// If a block doesn't support splitting, let rich text paste\n\t\t\t\t// inline.\n\t\t\t\tif (\n\t\t\t\t\t! hasMultiSelection() &&\n\t\t\t\t\t! hasBlockSupport(\n\t\t\t\t\t\tgetBlockName( selectedBlockClientIds[ 0 ] ),\n\t\t\t\t\t\t'splitting',\n\t\t\t\t\t\tfalse\n\t\t\t\t\t) &&\n\t\t\t\t\t! event.__deprecatedOnSplit\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst [ firstSelectedClientId ] = selectedBlockClientIds;\n\t\t\t\tconst rootClientId = getBlockRootClientId(\n\t\t\t\t\tfirstSelectedClientId\n\t\t\t\t);\n\n\t\t\t\tconst newBlocks = [];\n\n\t\t\t\tfor ( const block of blocks ) {\n\t\t\t\t\tif ( canInsertBlockType( block.name, rootClientId ) ) {\n\t\t\t\t\t\tnewBlocks.push( block );\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// If a block cannot be inserted in a root block, try\n\t\t\t\t\t\t// converting it to that root block type and insert the\n\t\t\t\t\t\t// inner blocks.\n\t\t\t\t\t\t// Example: paragraphs cannot be inserted into a list,\n\t\t\t\t\t\t// so convert the paragraphs to a list for list items.\n\t\t\t\t\t\tconst rootBlockName = getBlockName( rootClientId );\n\t\t\t\t\t\tconst switchedBlocks =\n\t\t\t\t\t\t\tblock.name !== rootBlockName\n\t\t\t\t\t\t\t\t? switchToBlockType( block, rootBlockName )\n\t\t\t\t\t\t\t\t: [ block ];\n\n\t\t\t\t\t\tif ( ! switchedBlocks ) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tfor ( const switchedBlock of switchedBlocks ) {\n\t\t\t\t\t\t\tfor ( const innerBlock of switchedBlock.innerBlocks ) {\n\t\t\t\t\t\t\t\tnewBlocks.push( innerBlock );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t__unstableSplitSelection( newBlocks );\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tnode.ownerDocument.addEventListener( 'copy', handler );\n\t\tnode.ownerDocument.addEventListener( 'cut', handler );\n\t\tnode.ownerDocument.addEventListener( 'paste', handler );\n\n\t\treturn () => {\n\t\t\tnode.ownerDocument.removeEventListener( 'copy', handler );\n\t\t\tnode.ownerDocument.removeEventListener( 'cut', handler );\n\t\t\tnode.ownerDocument.removeEventListener( 'paste', handler );\n\t\t};\n\t}, [] );\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tpasteHandler,\n\tfindTransform,\n\tgetBlockTransforms,\n\thasBlockSupport,\n\tswitchToBlockType,\n} from '@wordpress/blocks';\nimport {\n\tdocumentHasSelection,\n\tdocumentHasUncollapsedSelection,\n} from '@wordpress/dom';\nimport { useDispatch, useRegistry, useSelect } from '@wordpress/data';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { useNotifyCopy } from '../../utils/use-notify-copy';\nimport { setClipboardBlocks, setContentEditableWrapper } from './utils';\nimport { getPasteEventData } from '../../utils/pasting';\n\nexport default function useClipboardHandler() {\n\tconst registry = useRegistry();\n\tconst {\n\t\tgetBlocksByClientId,\n\t\tgetSelectedBlockClientIds,\n\t\thasMultiSelection,\n\t\tgetSettings,\n\t\tgetBlockName,\n\t\t__unstableIsFullySelected,\n\t\t__unstableIsSelectionCollapsed,\n\t\t__unstableIsSelectionMergeable,\n\t\t__unstableGetSelectedBlocksWithPartialSelection,\n\t\tcanInsertBlockType,\n\t\tgetBlockRootClientId,\n\t} = useSelect( blockEditorStore );\n\tconst {\n\t\tflashBlock,\n\t\tremoveBlocks,\n\t\treplaceBlocks,\n\t\t__unstableDeleteSelection,\n\t\t__unstableExpandSelection,\n\t\t__unstableSplitSelection,\n\t} = useDispatch( blockEditorStore );\n\tconst notifyCopy = useNotifyCopy();\n\n\treturn useRefEffect( ( node ) => {\n\t\tfunction handler( event ) {\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\t// This was likely already handled in rich-text/use-paste-handler.js.\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst selectedBlockClientIds = getSelectedBlockClientIds();\n\n\t\t\tif ( selectedBlockClientIds.length === 0 ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Let native copy/paste behaviour take over in input fields.\n\t\t\t// But always handle multiple selected blocks.\n\t\t\tif ( ! hasMultiSelection() ) {\n\t\t\t\tconst { target } = event;\n\t\t\t\tconst { ownerDocument } = target;\n\t\t\t\t// If copying, only consider actual text selection as selection.\n\t\t\t\t// Otherwise, any focus on an input field is considered.\n\t\t\t\tconst hasSelection =\n\t\t\t\t\tevent.type === 'copy' || event.type === 'cut'\n\t\t\t\t\t\t? documentHasUncollapsedSelection( ownerDocument )\n\t\t\t\t\t\t: documentHasSelection( ownerDocument ) &&\n\t\t\t\t\t\t  ! ownerDocument.activeElement.isContentEditable;\n\n\t\t\t\t// Let native copy behaviour take over in input fields.\n\t\t\t\tif ( hasSelection ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst { activeElement } = event.target.ownerDocument;\n\n\t\t\tif ( ! node.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst isSelectionMergeable = __unstableIsSelectionMergeable();\n\t\t\tconst shouldHandleWholeBlocks =\n\t\t\t\t__unstableIsSelectionCollapsed() || __unstableIsFullySelected();\n\t\t\tconst expandSelectionIsNeeded =\n\t\t\t\t! shouldHandleWholeBlocks && ! isSelectionMergeable;\n\t\t\tif ( event.type === 'copy' || event.type === 'cut' ) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tif ( selectedBlockClientIds.length === 1 ) {\n\t\t\t\t\tflashBlock( selectedBlockClientIds[ 0 ] );\n\t\t\t\t}\n\t\t\t\t// If we have a partial selection that is not mergeable, just\n\t\t\t\t// expand the selection to the whole blocks.\n\t\t\t\tif ( expandSelectionIsNeeded ) {\n\t\t\t\t\t__unstableExpandSelection();\n\t\t\t\t} else {\n\t\t\t\t\tnotifyCopy( event.type, selectedBlockClientIds );\n\t\t\t\t\tlet blocks;\n\t\t\t\t\t// Check if we have partial selection.\n\t\t\t\t\tif ( shouldHandleWholeBlocks ) {\n\t\t\t\t\t\tblocks = getBlocksByClientId( selectedBlockClientIds );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst [ head, tail ] =\n\t\t\t\t\t\t\t__unstableGetSelectedBlocksWithPartialSelection();\n\t\t\t\t\t\tconst inBetweenBlocks = getBlocksByClientId(\n\t\t\t\t\t\t\tselectedBlockClientIds.slice(\n\t\t\t\t\t\t\t\t1,\n\t\t\t\t\t\t\t\tselectedBlockClientIds.length - 1\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t\tblocks = [ head, ...inBetweenBlocks, tail ];\n\t\t\t\t\t}\n\n\t\t\t\t\tsetClipboardBlocks( event, blocks, registry );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( event.type === 'cut' ) {\n\t\t\t\t// We need to also check if at the start we needed to\n\t\t\t\t// expand the selection, as in this point we might have\n\t\t\t\t// programmatically fully selected the blocks above.\n\t\t\t\tif ( shouldHandleWholeBlocks && ! expandSelectionIsNeeded ) {\n\t\t\t\t\tremoveBlocks( selectedBlockClientIds );\n\t\t\t\t} else {\n\t\t\t\t\tsetContentEditableWrapper(\n\t\t\t\t\t\tevent.target.ownerDocument.activeElement,\n\t\t\t\t\t\tfalse\n\t\t\t\t\t);\n\t\t\t\t\t__unstableDeleteSelection();\n\t\t\t\t}\n\t\t\t} else if ( event.type === 'paste' ) {\n\t\t\t\tconst {\n\t\t\t\t\t__experimentalCanUserUseUnfilteredHTML:\n\t\t\t\t\t\tcanUserUseUnfilteredHTML,\n\t\t\t\t\tmediaUpload,\n\t\t\t\t} = getSettings();\n\t\t\t\tconst isInternal =\n\t\t\t\t\tevent.clipboardData.getData( 'rich-text' ) === 'true';\n\t\t\t\tif ( isInternal ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tconst { plainText, html, files } = getPasteEventData( event );\n\t\t\t\tconst isFullySelected = __unstableIsFullySelected();\n\t\t\t\tlet blocks = [];\n\n\t\t\t\tif ( files.length ) {\n\t\t\t\t\tif ( ! mediaUpload ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst fromTransforms = getBlockTransforms( 'from' );\n\t\t\t\t\tblocks = files\n\t\t\t\t\t\t.reduce( ( accumulator, file ) => {\n\t\t\t\t\t\t\tconst transformation = findTransform(\n\t\t\t\t\t\t\t\tfromTransforms,\n\t\t\t\t\t\t\t\t( transform ) =>\n\t\t\t\t\t\t\t\t\ttransform.type === 'files' &&\n\t\t\t\t\t\t\t\t\ttransform.isMatch( [ file ] )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tif ( transformation ) {\n\t\t\t\t\t\t\t\taccumulator.push(\n\t\t\t\t\t\t\t\t\ttransformation.transform( [ file ] )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn accumulator;\n\t\t\t\t\t\t}, [] )\n\t\t\t\t\t\t.flat();\n\t\t\t\t} else {\n\t\t\t\t\tblocks = pasteHandler( {\n\t\t\t\t\t\tHTML: html,\n\t\t\t\t\t\tplainText,\n\t\t\t\t\t\tmode: isFullySelected ? 'BLOCKS' : 'AUTO',\n\t\t\t\t\t\tcanUserUseUnfilteredHTML,\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// Inline paste: let rich text handle it.\n\t\t\t\tif ( typeof blocks === 'string' ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( isFullySelected ) {\n\t\t\t\t\treplaceBlocks(\n\t\t\t\t\t\tselectedBlockClientIds,\n\t\t\t\t\t\tblocks,\n\t\t\t\t\t\tblocks.length - 1,\n\t\t\t\t\t\t-1\n\t\t\t\t\t);\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// If a block doesn't support splitting, let rich text paste\n\t\t\t\t// inline.\n\t\t\t\tif (\n\t\t\t\t\t! hasMultiSelection() &&\n\t\t\t\t\t! hasBlockSupport(\n\t\t\t\t\t\tgetBlockName( selectedBlockClientIds[ 0 ] ),\n\t\t\t\t\t\t'splitting',\n\t\t\t\t\t\tfalse\n\t\t\t\t\t) &&\n\t\t\t\t\t! event.__deprecatedOnSplit\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst [ firstSelectedClientId ] = selectedBlockClientIds;\n\t\t\t\tconst rootClientId = getBlockRootClientId(\n\t\t\t\t\tfirstSelectedClientId\n\t\t\t\t);\n\n\t\t\t\tconst newBlocks = [];\n\n\t\t\t\tfor ( const block of blocks ) {\n\t\t\t\t\tif ( canInsertBlockType( block.name, rootClientId ) ) {\n\t\t\t\t\t\tnewBlocks.push( block );\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// If a block cannot be inserted in a root block, try\n\t\t\t\t\t\t// converting it to that root block type and insert the\n\t\t\t\t\t\t// inner blocks.\n\t\t\t\t\t\t// Example: paragraphs cannot be inserted into a list,\n\t\t\t\t\t\t// so convert the paragraphs to a list for list items.\n\t\t\t\t\t\tconst rootBlockName = getBlockName( rootClientId );\n\t\t\t\t\t\tconst switchedBlocks =\n\t\t\t\t\t\t\tblock.name !== rootBlockName\n\t\t\t\t\t\t\t\t? switchToBlockType( block, rootBlockName )\n\t\t\t\t\t\t\t\t: [ block ];\n\n\t\t\t\t\t\tif ( ! switchedBlocks ) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tfor ( const switchedBlock of switchedBlocks ) {\n\t\t\t\t\t\t\tfor ( const innerBlock of switchedBlock.innerBlocks ) {\n\t\t\t\t\t\t\t\tnewBlocks.push( innerBlock );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t__unstableSplitSelection( newBlocks );\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tnode.ownerDocument.addEventListener( 'copy', handler );\n\t\tnode.ownerDocument.addEventListener( 'cut', handler );\n\t\tnode.ownerDocument.addEventListener( 'paste', handler );\n\n\t\treturn () => {\n\t\t\tnode.ownerDocument.removeEventListener( 'copy', handler );\n\t\t\tnode.ownerDocument.removeEventListener( 'cut', handler );\n\t\t\tnode.ownerDocument.removeEventListener( 'paste', handler );\n\t\t};\n\t}, [] );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oBAMO;AACP,iBAGO;AACP,kBAAoD;AACpD,qBAA6B;AAK7B,mBAA0C;AAC1C,6BAA8B;AAC9B,mBAA8D;AAC9D,qBAAkC;AAEnB,SAAR,sBAAuC;AAC7C,QAAM,eAAW,yBAAY;AAC7B,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI,uBAAW,aAAAA,KAAiB;AAChC,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI,yBAAa,aAAAA,KAAiB;AAClC,QAAM,iBAAa,sCAAc;AAEjC,aAAO,6BAAc,CAAE,SAAU;AAChC,aAAS,QAAS,OAAQ;AACzB,UAAK,MAAM,kBAAmB;AAE7B;AAAA,MACD;AAEA,YAAM,yBAAyB,0BAA0B;AAEzD,UAAK,uBAAuB,WAAW,GAAI;AAC1C;AAAA,MACD;AAIA,UAAK,CAAE,kBAAkB,GAAI;AAC5B,cAAM,EAAE,OAAO,IAAI;AACnB,cAAM,EAAE,cAAc,IAAI;AAG1B,cAAM,eACL,MAAM,SAAS,UAAU,MAAM,SAAS,YACrC,4CAAiC,aAAc,QAC/C,iCAAsB,aAAc,KACpC,CAAE,cAAc,cAAc;AAGlC,YAAK,cAAe;AACnB;AAAA,QACD;AAAA,MACD;AAEA,YAAM,EAAE,cAAc,IAAI,MAAM,OAAO;AAEvC,UAAK,CAAE,KAAK,SAAU,aAAc,GAAI;AACvC;AAAA,MACD;AAEA,YAAM,uBAAuB,+BAA+B;AAC5D,YAAM,0BACL,+BAA+B,KAAK,0BAA0B;AAC/D,YAAM,0BACL,CAAE,2BAA2B,CAAE;AAChC,UAAK,MAAM,SAAS,UAAU,MAAM,SAAS,OAAQ;AACpD,cAAM,eAAe;AAErB,YAAK,uBAAuB,WAAW,GAAI;AAC1C,qBAAY,uBAAwB,CAAE,CAAE;AAAA,QACzC;AAGA,YAAK,yBAA0B;AAC9B,oCAA0B;AAAA,QAC3B,OAAO;AACN,qBAAY,MAAM,MAAM,sBAAuB;AAC/C,cAAI;AAEJ,cAAK,yBAA0B;AAC9B,qBAAS,oBAAqB,sBAAuB;AAAA,UACtD,OAAO;AACN,kBAAM,CAAE,MAAM,IAAK,IAClB,gDAAgD;AACjD,kBAAM,kBAAkB;AAAA,cACvB,uBAAuB;AAAA,gBACtB;AAAA,gBACA,uBAAuB,SAAS;AAAA,cACjC;AAAA,YACD;AACA,qBAAS,CAAE,MAAM,GAAG,iBAAiB,IAAK;AAAA,UAC3C;AAEA,+CAAoB,OAAO,QAAQ,QAAS;AAAA,QAC7C;AAAA,MACD;AAEA,UAAK,MAAM,SAAS,OAAQ;AAI3B,YAAK,2BAA2B,CAAE,yBAA0B;AAC3D,uBAAc,sBAAuB;AAAA,QACtC,OAAO;AACN;AAAA,YACC,MAAM,OAAO,cAAc;AAAA,YAC3B;AAAA,UACD;AACA,oCAA0B;AAAA,QAC3B;AAAA,MACD,WAAY,MAAM,SAAS,SAAU;AACpC,cAAM;AAAA,UACL,wCACC;AAAA,UACD;AAAA,QACD,IAAI,YAAY;AAChB,cAAM,aACL,MAAM,cAAc,QAAS,WAAY,MAAM;AAChD,YAAK,YAAa;AACjB;AAAA,QACD;AACA,cAAM,EAAE,WAAW,MAAM,MAAM,QAAI,kCAAmB,KAAM;AAC5D,cAAM,kBAAkB,0BAA0B;AAClD,YAAI,SAAS,CAAC;AAEd,YAAK,MAAM,QAAS;AACnB,cAAK,CAAE,aAAc;AACpB,kBAAM,eAAe;AACrB;AAAA,UACD;AAEA,gBAAM,qBAAiB,kCAAoB,MAAO;AAClD,mBAAS,MACP,OAAQ,CAAE,aAAa,SAAU;AACjC,kBAAM,qBAAiB;AAAA,cACtB;AAAA,cACA,CAAE,cACD,UAAU,SAAS,WACnB,UAAU,QAAS,CAAE,IAAK,CAAE;AAAA,YAC9B;AACA,gBAAK,gBAAiB;AACrB,0BAAY;AAAA,gBACX,eAAe,UAAW,CAAE,IAAK,CAAE;AAAA,cACpC;AAAA,YACD;AACA,mBAAO;AAAA,UACR,GAAG,CAAC,CAAE,EACL,KAAK;AAAA,QACR,OAAO;AACN,uBAAS,4BAAc;AAAA,YACtB,MAAM;AAAA,YACN;AAAA,YACA,MAAM,kBAAkB,WAAW;AAAA,YACnC;AAAA,UACD,CAAE;AAAA,QACH;AAGA,YAAK,OAAO,WAAW,UAAW;AACjC;AAAA,QACD;AAEA,YAAK,iBAAkB;AACtB;AAAA,YACC;AAAA,YACA;AAAA,YACA,OAAO,SAAS;AAAA,YAChB;AAAA,UACD;AACA,gBAAM,eAAe;AACrB;AAAA,QACD;AAIA,YACC,CAAE,kBAAkB,KACpB,KAAE;AAAA,UACD,aAAc,uBAAwB,CAAE,CAAE;AAAA,UAC1C;AAAA,UACA;AAAA,QACD,KACA,CAAE,MAAM,qBACP;AACD;AAAA,QACD;AAEA,cAAM,CAAE,qBAAsB,IAAI;AAClC,cAAM,eAAe;AAAA,UACpB;AAAA,QACD;AAEA,cAAM,YAAY,CAAC;AAEnB,mBAAY,SAAS,QAAS;AAC7B,cAAK,mBAAoB,MAAM,MAAM,YAAa,GAAI;AACrD,sBAAU,KAAM,KAAM;AAAA,UACvB,OAAO;AAMN,kBAAM,gBAAgB,aAAc,YAAa;AACjD,kBAAM,iBACL,MAAM,SAAS,oBACZ,iCAAmB,OAAO,aAAc,IACxC,CAAE,KAAM;AAEZ,gBAAK,CAAE,gBAAiB;AACvB;AAAA,YACD;AAEA,uBAAY,iBAAiB,gBAAiB;AAC7C,yBAAY,cAAc,cAAc,aAAc;AACrD,0BAAU,KAAM,UAAW;AAAA,cAC5B;AAAA,YACD;AAAA,UACD;AAAA,QACD;AAEA,iCAA0B,SAAU;AACpC,cAAM,eAAe;AAAA,MACtB;AAAA,IACD;AAEA,SAAK,cAAc,iBAAkB,QAAQ,OAAQ;AACrD,SAAK,cAAc,iBAAkB,OAAO,OAAQ;AACpD,SAAK,cAAc,iBAAkB,SAAS,OAAQ;AAEtD,WAAO,MAAM;AACZ,WAAK,cAAc,oBAAqB,QAAQ,OAAQ;AACxD,WAAK,cAAc,oBAAqB,OAAO,OAAQ;AACvD,WAAK,cAAc,oBAAqB,SAAS,OAAQ;AAAA,IAC1D;AAAA,EACD,GAAG,CAAC,CAAE;AACP;",
   "names": ["blockEditorStore"]
 }

package/build/components/writing-flow/use-drag-selection.cjs CHANGED Viewed

@@ -26,12 +26,7 @@ module.exports = __toCommonJS(use_drag_selection_exports);
 var import_data = require("@wordpress/data");
 var import_compose = require("@wordpress/compose");
 var import_store = require("../../store/index.cjs");
-function setContentEditableWrapper(node, value) {
-  node.contentEditable = value;
-  if (value) {
-    node.focus();
-  }
-}
+var import_utils = require("./utils.cjs");
 function useDragSelection() {
   const { startMultiSelect, stopMultiSelect } = (0, import_data.useDispatch)(import_store.store);
   const {
@@ -54,7 +49,7 @@ function useDragSelection() {
           if (!hasSelectedBlock()) {
             return;
           }
-          setContentEditableWrapper(node, false);
+          (0, import_utils.setContentEditableWrapper)(node, false);
           const selection = defaultView.getSelection();
           if (selection.rangeCount) {
             const range = selection.getRangeAt(0);
@@ -100,7 +95,7 @@ function useDragSelection() {
         anchorElement = target;
         startMultiSelect();
         defaultView.addEventListener("mouseup", onMouseUp);
-        setContentEditableWrapper(node, true);
+        (0, import_utils.setContentEditableWrapper)(node, true);
       }
       node.addEventListener("mouseout", onMouseLeave);
       node.addEventListener("mousedown", onMouseDown);

package/build/components/writing-flow/use-drag-selection.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/writing-flow/use-drag-selection.js"],
-  "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 ) {\n\t\tnode.focus();\n\t}\n}\n\n/**\n * Sets a multi-selection based on the native selection across blocks.\n */\nexport default function useDragSelection() {\n\tconst { startMultiSelect, stopMultiSelect } =\n\t\tuseDispatch( blockEditorStore );\n\tconst {\n\t\tgetSettings,\n\t\tisSelectionEnabled,\n\t\thasSelectedBlock,\n\t\tisDraggingBlocks,\n\t\tisMultiSelecting,\n\t} = 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\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 ( ! hasSelectedBlock() ) {\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 range = selection.getRangeAt( 0 );\n\t\t\t\t\t\tconst { commonAncestorContainer } = range;\n\t\t\t\t\t\tconst clonedRange = range.cloneRange();\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\tselection.removeAllRanges();\n\t\t\t\t\t\t\tselection.addRange( clonedRange );\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\tlet lastMouseDownTarget;\n\n\t\t\tfunction onMouseDown( { target } ) {\n\t\t\t\tlastMouseDownTarget = target;\n\t\t\t}\n\n\t\t\tfunction onMouseLeave( { buttons, target, relatedTarget } ) {\n\t\t\t\tif ( ! target.contains( lastMouseDownTarget ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// If we're moving into a child element, ignore. We're tracking\n\t\t\t\t// the mouse leaving the element to a parent, no a child.\n\t\t\t\tif ( target.contains( relatedTarget ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Avoid triggering a multi-selection if the user is already\n\t\t\t\t// dragging blocks.\n\t\t\t\tif ( isDraggingBlocks() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\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// Abort if we are already multi-selecting.\n\t\t\t\tif ( isMultiSelecting() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Abort if selection is leaving writing flow.\n\t\t\t\tif ( node === target ) {\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\t// In preview mode, allow drag selection from blocks since they\n\t\t\t\t// are not contenteditable.\n\t\t\t\tif (\n\t\t\t\t\ttarget.getAttribute( 'contenteditable' ) !== 'true' &&\n\t\t\t\t\t! getSettings().isPreviewMode\n\t\t\t\t) {\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\t// Do not rely on the active element because it may change after\n\t\t\t\t// the mouse leaves for the first time. See\n\t\t\t\t// https://github.com/WordPress/gutenberg/issues/48747.\n\t\t\t\tanchorElement = target;\n\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\t\t\tnode.addEventListener( 'mousedown', onMouseDown );\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\thasSelectedBlock,\n\t\t]\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAuC;AACvC,qBAA6B;AAK7B,mBAA0C;AAQ1C,SAAS,0BAA2B,MAAM,OAAQ;AACjD,OAAK,kBAAkB;AAEvB,MAAK,OAAQ;AACZ,SAAK,MAAM;AAAA,EACZ;AACD;AAKe,SAAR,mBAAoC;AAC1C,QAAM,EAAE,kBAAkB,gBAAgB,QACzC,yBAAa,aAAAA,KAAiB;AAC/B,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI,uBAAW,aAAAA,KAAiB;AAChC,aAAO;AAAA,IACN,CAAE,SAAU;AACX,YAAM,EAAE,cAAc,IAAI;AAC1B,YAAM,EAAE,YAAY,IAAI;AAExB,UAAI;AACJ,UAAI;AAEJ,eAAS,YAAY;AACpB,wBAAgB;AAEhB,oBAAY,oBAAqB,WAAW,SAAU;AAItD,gBAAQ,YAAY,sBAAuB,MAAM;AAChD,cAAK,CAAE,iBAAiB,GAAI;AAC3B;AAAA,UACD;AAOA,oCAA2B,MAAM,KAAM;AAEvC,gBAAM,YAAY,YAAY,aAAa;AAE3C,cAAK,UAAU,YAAa;AAC3B,kBAAM,QAAQ,UAAU,WAAY,CAAE;AACtC,kBAAM,EAAE,wBAAwB,IAAI;AACpC,kBAAM,cAAc,MAAM,WAAW;AAErC,gBACC,cAAc,SAAU,uBAAwB,GAC/C;AACD,4BAAc,MAAM;AACpB,wBAAU,gBAAgB;AAC1B,wBAAU,SAAU,WAAY;AAAA,YACjC;AAAA,UACD;AAAA,QACD,CAAE;AAAA,MACH;AAEA,UAAI;AAEJ,eAAS,YAAa,EAAE,OAAO,GAAI;AAClC,8BAAsB;AAAA,MACvB;AAEA,eAAS,aAAc,EAAE,SAAS,QAAQ,cAAc,GAAI;AAC3D,YAAK,CAAE,OAAO,SAAU,mBAAoB,GAAI;AAC/C;AAAA,QACD;AAIA,YAAK,OAAO,SAAU,aAAc,GAAI;AACvC;AAAA,QACD;AAIA,YAAK,iBAAiB,GAAI;AACzB;AAAA,QACD;AAIA,YAAK,YAAY,GAAI;AACpB;AAAA,QACD;AAGA,YAAK,iBAAiB,GAAI;AACzB;AAAA,QACD;AAGA,YAAK,SAAS,QAAS;AACtB;AAAA,QACD;AAQA,YACC,OAAO,aAAc,iBAAkB,MAAM,UAC7C,CAAE,YAAY,EAAE,eACf;AACD;AAAA,QACD;AAEA,YAAK,CAAE,mBAAmB,GAAI;AAC7B;AAAA,QACD;AAKA,wBAAgB;AAEhB,yBAAiB;AAKjB,oBAAY,iBAAkB,WAAW,SAAU;AAMnD,kCAA2B,MAAM,IAAK;AAAA,MACvC;AAEA,WAAK,iBAAkB,YAAY,YAAa;AAChD,WAAK,iBAAkB,aAAa,WAAY;AAEhD,aAAO,MAAM;AACZ,aAAK,oBAAqB,YAAY,YAAa;AACnD,oBAAY,oBAAqB,WAAW,SAAU;AACtD,oBAAY,qBAAsB,KAAM;AAAA,MACzC;AAAA,IACD;AAAA,IACA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;",
+  "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 { setContentEditableWrapper } from './utils';\n\n/**\n * Sets a multi-selection based on the native selection across blocks.\n */\nexport default function useDragSelection() {\n\tconst { startMultiSelect, stopMultiSelect } =\n\t\tuseDispatch( blockEditorStore );\n\tconst {\n\t\tgetSettings,\n\t\tisSelectionEnabled,\n\t\thasSelectedBlock,\n\t\tisDraggingBlocks,\n\t\tisMultiSelecting,\n\t} = 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\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 ( ! hasSelectedBlock() ) {\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 range = selection.getRangeAt( 0 );\n\t\t\t\t\t\tconst { commonAncestorContainer } = range;\n\t\t\t\t\t\tconst clonedRange = range.cloneRange();\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\tselection.removeAllRanges();\n\t\t\t\t\t\t\tselection.addRange( clonedRange );\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\tlet lastMouseDownTarget;\n\n\t\t\tfunction onMouseDown( { target } ) {\n\t\t\t\tlastMouseDownTarget = target;\n\t\t\t}\n\n\t\t\tfunction onMouseLeave( { buttons, target, relatedTarget } ) {\n\t\t\t\tif ( ! target.contains( lastMouseDownTarget ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// If we're moving into a child element, ignore. We're tracking\n\t\t\t\t// the mouse leaving the element to a parent, no a child.\n\t\t\t\tif ( target.contains( relatedTarget ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Avoid triggering a multi-selection if the user is already\n\t\t\t\t// dragging blocks.\n\t\t\t\tif ( isDraggingBlocks() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\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// Abort if we are already multi-selecting.\n\t\t\t\tif ( isMultiSelecting() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Abort if selection is leaving writing flow.\n\t\t\t\tif ( node === target ) {\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\t// In preview mode, allow drag selection from blocks since they\n\t\t\t\t// are not contenteditable.\n\t\t\t\tif (\n\t\t\t\t\ttarget.getAttribute( 'contenteditable' ) !== 'true' &&\n\t\t\t\t\t! getSettings().isPreviewMode\n\t\t\t\t) {\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\t// Do not rely on the active element because it may change after\n\t\t\t\t// the mouse leaves for the first time. See\n\t\t\t\t// https://github.com/WordPress/gutenberg/issues/48747.\n\t\t\t\tanchorElement = target;\n\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\t\t\tnode.addEventListener( 'mousedown', onMouseDown );\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\thasSelectedBlock,\n\t\t]\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAuC;AACvC,qBAA6B;AAK7B,mBAA0C;AAC1C,mBAA0C;AAK3B,SAAR,mBAAoC;AAC1C,QAAM,EAAE,kBAAkB,gBAAgB,QACzC,yBAAa,aAAAA,KAAiB;AAC/B,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI,uBAAW,aAAAA,KAAiB;AAChC,aAAO;AAAA,IACN,CAAE,SAAU;AACX,YAAM,EAAE,cAAc,IAAI;AAC1B,YAAM,EAAE,YAAY,IAAI;AAExB,UAAI;AACJ,UAAI;AAEJ,eAAS,YAAY;AACpB,wBAAgB;AAEhB,oBAAY,oBAAqB,WAAW,SAAU;AAItD,gBAAQ,YAAY,sBAAuB,MAAM;AAChD,cAAK,CAAE,iBAAiB,GAAI;AAC3B;AAAA,UACD;AAOA,sDAA2B,MAAM,KAAM;AAEvC,gBAAM,YAAY,YAAY,aAAa;AAE3C,cAAK,UAAU,YAAa;AAC3B,kBAAM,QAAQ,UAAU,WAAY,CAAE;AACtC,kBAAM,EAAE,wBAAwB,IAAI;AACpC,kBAAM,cAAc,MAAM,WAAW;AAErC,gBACC,cAAc,SAAU,uBAAwB,GAC/C;AACD,4BAAc,MAAM;AACpB,wBAAU,gBAAgB;AAC1B,wBAAU,SAAU,WAAY;AAAA,YACjC;AAAA,UACD;AAAA,QACD,CAAE;AAAA,MACH;AAEA,UAAI;AAEJ,eAAS,YAAa,EAAE,OAAO,GAAI;AAClC,8BAAsB;AAAA,MACvB;AAEA,eAAS,aAAc,EAAE,SAAS,QAAQ,cAAc,GAAI;AAC3D,YAAK,CAAE,OAAO,SAAU,mBAAoB,GAAI;AAC/C;AAAA,QACD;AAIA,YAAK,OAAO,SAAU,aAAc,GAAI;AACvC;AAAA,QACD;AAIA,YAAK,iBAAiB,GAAI;AACzB;AAAA,QACD;AAIA,YAAK,YAAY,GAAI;AACpB;AAAA,QACD;AAGA,YAAK,iBAAiB,GAAI;AACzB;AAAA,QACD;AAGA,YAAK,SAAS,QAAS;AACtB;AAAA,QACD;AAQA,YACC,OAAO,aAAc,iBAAkB,MAAM,UAC7C,CAAE,YAAY,EAAE,eACf;AACD;AAAA,QACD;AAEA,YAAK,CAAE,mBAAmB,GAAI;AAC7B;AAAA,QACD;AAKA,wBAAgB;AAEhB,yBAAiB;AAKjB,oBAAY,iBAAkB,WAAW,SAAU;AAMnD,oDAA2B,MAAM,IAAK;AAAA,MACvC;AAEA,WAAK,iBAAkB,YAAY,YAAa;AAChD,WAAK,iBAAkB,aAAa,WAAY;AAEhD,aAAO,MAAM;AACZ,aAAK,oBAAqB,YAAY,YAAa;AACnD,oBAAY,oBAAqB,WAAW,SAAU;AACtD,oBAAY,qBAAsB,KAAM;AAAA,MACzC;AAAA,IACD;AAAA,IACA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;",
   "names": ["blockEditorStore"]
 }

package/build/components/writing-flow/use-editable-root.cjs ADDED Viewed

@@ -0,0 +1,112 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+// packages/block-editor/src/components/writing-flow/use-editable-root.js
+var use_editable_root_exports = {};
+__export(use_editable_root_exports, {
+  canHostEditableRoot: () => canHostEditableRoot,
+  default: () => useEditableRoot,
+  useHasEditableRoot: () => useHasEditableRoot
+});
+module.exports = __toCommonJS(use_editable_root_exports);
+var import_data = require("@wordpress/data");
+var import_compose = require("@wordpress/compose");
+var import_blocks = require("@wordpress/blocks");
+var import_store = require("../../store/index.cjs");
+var import_utils = require("./utils.cjs");
+var import_dom = require("../../utils/dom.cjs");
+var import_lock_unlock = require("../../lock-unlock.cjs");
+function canHostEditableRoot(select, clientId) {
+  const {
+    getBlockName,
+    getBlockEditingMode,
+    getBlockMode,
+    getBlockRootClientId,
+    getBlockOrder
+  } = select;
+  if (!clientId || getBlockEditingMode(clientId) !== "default" || // Not when the block is edited as HTML: there is no rich text to
+  // host then, only a textarea, which the editing host would
+  // interfere with.
+  getBlockMode(clientId) !== "visual" || !(0, import_blocks.hasBlockSupport)(getBlockName(clientId), "editableRoot", false)) {
+    return false;
+  }
+  const siblings = getBlockOrder(getBlockRootClientId(clientId));
+  return siblings.length > 1 && siblings.every(
+    (siblingClientId) => getBlockEditingMode(siblingClientId) === "default"
+  );
+}
+function useHasEditableRoot() {
+  return (0, import_data.useSelect)((select) => {
+    const selectors = select(import_store.store);
+    return canHostEditableRoot(
+      selectors,
+      selectors.getSelectedBlockClientId()
+    );
+  }, []);
+}
+function useEditableRoot() {
+  const registry = (0, import_data.useRegistry)();
+  const isZoomOut = (0, import_data.useSelect)(
+    (select) => (0, import_lock_unlock.unlock)(select(import_store.store)).isZoomOut(),
+    []
+  );
+  const enabled = useHasEditableRoot() && !isZoomOut;
+  return (0, import_compose.useRefEffect)(
+    (node) => {
+      if (!enabled) {
+        return;
+      }
+      const {
+        getSelectedBlockClientId,
+        hasMultiSelection,
+        isMultiSelecting
+      } = registry.select(import_store.store);
+      if (!(0, import_utils.setContentEditableWrapper)(node, true, { focus: false })) {
+        return;
+      }
+      const { activeElement } = node.ownerDocument;
+      const selection = node.ownerDocument.defaultView.getSelection();
+      if (activeElement !== node && activeElement?.isContentEditable && node.contains(activeElement) && (0, import_dom.getBlockClientId)(activeElement) === getSelectedBlockClientId() && selection.anchorNode && activeElement.contains(selection.anchorNode)) {
+        node.focus();
+      }
+      return () => {
+        if (hasMultiSelection() || isMultiSelecting()) {
+          return;
+        }
+        (0, import_utils.setContentEditableWrapper)(node, false);
+        if (node.ownerDocument.activeElement === node) {
+          const editable = (0, import_dom.getSelectionEditableElement)(
+            node.ownerDocument.defaultView.getSelection(),
+            node
+          );
+          if (editable && (0, import_dom.getBlockClientId)(editable) === getSelectedBlockClientId()) {
+            editable.focus();
+          }
+        }
+      };
+    },
+    [enabled, registry]
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  canHostEditableRoot,
+  useHasEditableRoot
+});
+//# sourceMappingURL=use-editable-root.cjs.map