Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Partial multi selection: limit if selection contains unmergeable block #42934

Merged
merged 2 commits into from
Aug 31, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,8 @@
}

// Provide exceptions for placeholders.
.components-placeholder {
.components-placeholder,
.block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) {
::selection {
background: transparent;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ export function useBlockClassNames( clientId ) {
hasSelectedInnerBlock,
isTyping,
__unstableIsFullySelected,
__unstableSelectionHasUnmergeableBlock,
} = select( blockEditorStore );
const { outlineMode } = getSettings();
const isDragging = isBlockBeingDragged( clientId );
Expand All @@ -51,7 +52,9 @@ export function useBlockClassNames( clientId ) {
'is-highlighted': isBlockHighlighted( clientId ),
'is-multi-selected': isMultiSelected,
'is-partially-selected':
isMultiSelected && ! __unstableIsFullySelected(),
isMultiSelected &&
! __unstableIsFullySelected() &&
! __unstableSelectionHasUnmergeableBlock(),
'is-reusable': isReusableBlock( getBlockType( name ) ),
'is-dragging': isDragging,
'has-child-selected': isAncestorOfSelectedBlock,
Expand Down
16 changes: 12 additions & 4 deletions packages/block-editor/src/store/selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -948,6 +948,14 @@ export function __unstableIsSelectionCollapsed( state ) {
);
}

export function __unstableSelectionHasUnmergeableBlock( state ) {
return getSelectedBlockClientIds( state ).some( ( clientId ) => {
const blockName = getBlockName( state, clientId );
const blockType = getBlockType( blockName );
return ! blockType.merge;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

May need to fine tune this by also checking if switchToBlockType returns a result.

} );
}

/**
* Check whether the selection is mergeable.
*
Expand Down Expand Up @@ -1009,19 +1017,19 @@ export function __unstableIsSelectionMergeable( state, isForward ) {
? selectionStart.clientId
: selectionEnd.clientId;

const targetBlock = getBlock( state, targetBlockClientId );
const targetBlockType = getBlockType( targetBlock.name );
const targetBlockName = getBlockName( state, targetBlockClientId );
const targetBlockType = getBlockType( targetBlockName );

if ( ! targetBlockType.merge ) return false;

const blockToMerge = getBlock( state, blockToMergeClientId );

// It's mergeable if the blocks are of the same type.
if ( blockToMerge.name === targetBlock.name ) return true;
if ( blockToMerge.name === targetBlockName ) return true;

// If the blocks are of a different type, try to transform the block being
// merged into the same type of block.
const blocksToMerge = switchToBlockType( blockToMerge, targetBlock.name );
const blocksToMerge = switchToBlockType( blockToMerge, targetBlockName );

return blocksToMerge && blocksToMerge.length;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -684,6 +684,7 @@ describe( 'Writing Flow', () => {
// Create the table.
await page.keyboard.press( 'Space' );
// Navigate to the second cell.
await page.waitForSelector( 'table' );
await page.keyboard.press( 'ArrowRight' );
await page.keyboard.type( '2' );
// Confirm correct setup.
Expand Down