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.

Sign up for GitHub

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

Jump to bottom

Edit Mode: Prevent editable text selection on first click #65702

Open
wants to merge 8 commits into
base: trunk
Choose a base branch
from
Open

Edit Mode: Prevent editable text selection on first click #65702

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
4d67490
Edit Mode: Prevent editable text selection on first click
youknowriad Sep 27, 2024
f77f81b
Show zoom-out toolbar even when child blocks are selected
youknowriad Sep 27, 2024
0afce85
Show slots in zoom-out
youknowriad Oct 21, 2024
d5fa686
Fix sections
youknowriad Oct 21, 2024
b33cdf3
Fix content only lock behavior
youknowriad Oct 22, 2024
16052f9
Fix inserter position
youknowriad Oct 23, 2024
76c259f
Remove useless change
youknowriad Oct 23, 2024
0c7161a
Fix section root case
youknowriad Oct 24, 2024
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
4 changes: 1 addition & 3 deletions packages/block-editor/src/components/block-toolbar/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,6 @@ export function PrivateBlockToolbar( {
hasParentPattern,
hasContentOnlyLocking,
showShuffleButton,
showSlots,
showGroupButtons,
showLockButtons,
} = useSelect( ( select ) => {
Expand Down Expand Up @@ -138,7 +137,6 @@ export function PrivateBlockToolbar( {
hasParentPattern: _hasParentPattern,
hasContentOnlyLocking: _hasTemplateLock,
showShuffleButton: isZoomOut(),
showSlots: ! isZoomOut(),
showGroupButtons: ! isZoomOut(),
showLockButtons: ! isZoomOut(),
};
Expand Down Expand Up @@ -227,7 +225,7 @@ export function PrivateBlockToolbar( {
/>
</ToolbarGroup>
) }
{ shouldShowVisualToolbar && showSlots && (
{ shouldShowVisualToolbar && (
<>
<BlockControls.Slot
group="parent"
Expand Down
1 change: 0 additions & 1 deletion packages/block-editor/src/components/block-tools/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,6 @@ export default function BlockTools( {
} ) {
const { clientId, hasFixedToolbar, isTyping, isZoomOutMode, isDragging } =
useSelect( selector, [] );

youknowriad marked this conversation as resolved.
Show resolved Hide resolved
const isMatch = useShortcutEventMatch();
const {
getBlocksByClientId,
Expand Down
6 changes: 4 additions & 2 deletions packages/block-editor/src/store/private-selectors.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,8 @@ import {
getBlockName,
getTemplateLock,
getClientIdsWithDescendants,
isNavigationMode,
getBlockRootClientId,
__unstableGetEditorMode,
} from './selectors';
import {
checkAllowListRecursive,
Expand Down Expand Up @@ -523,7 +523,9 @@ export function isSectionBlock( state, clientId ) {
return (
getBlockName( state, clientId ) === 'core/block' ||
getTemplateLock( state, clientId ) === 'contentOnly' ||
( isNavigationMode( state ) && sectionClientIds.includes( clientId ) )
( ( __unstableGetEditorMode( state ) === 'navigation' ||
isZoomOut( state ) ) &&
sectionClientIds.includes( clientId ) )
);
}

Expand Down
53 changes: 8 additions & 45 deletions packages/block-editor/src/store/selectors.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2934,33 +2934,18 @@ export const __unstableGetVisibleBlocks = createSelector(
);

export function __unstableHasActiveBlockOverlayActive( state, clientId ) {
// Prevent overlay on blocks with a non-default editing mode. If the mdoe is
// 'disabled' then the overlay is redundant since the block can't be
// selected. If the mode is 'contentOnly' then the overlay is redundant
// since there will be no controls to interact with once selected.
if ( getBlockEditingMode( state, clientId ) !== 'default' ) {
return false;
}

// If the block editing is locked, the block overlay is always active.
if ( ! canEditBlock( state, clientId ) ) {
return true;
}

// In zoom-out mode, the block overlay is always active for section level blocks.
if ( isZoomOut( state ) ) {
const sectionRootClientId = getSectionRootClientId( state );
if ( sectionRootClientId ) {
const sectionClientIds = getBlockOrder(
state,
sectionRootClientId
);
if ( sectionClientIds?.includes( clientId ) ) {
return true;
}
} else if ( clientId && ! getBlockRootClientId( state, clientId ) ) {
return true;
}
// Section blocks need to be selected first before being able to select their children.
if (
isSectionBlock( state, clientId ) &&
! isBlockSelected( state, clientId ) &&
! hasSelectedInnerBlock( state, clientId, true )
) {
draganescu marked this conversation as resolved.
Show resolved Hide resolved
return true;
}

// In navigation mode, the block overlay is active when the block is not
Expand Down Expand Up @@ -3047,30 +3032,8 @@ export const getBlockEditingMode = createRegistrySelector(
// In zoom-out mode, override the behavior set by
// __unstableSetBlockEditingMode to only allow editing the top-level
// sections.
if ( isZoomOut( state ) ) {
const sectionRootClientId = getSectionRootClientId( state );

if ( clientId === '' /* ROOT_CONTAINER_CLIENT_ID */ ) {
return sectionRootClientId ? 'disabled' : 'contentOnly';
}
if ( clientId === sectionRootClientId ) {
return 'contentOnly';
}
const sectionsClientIds = getBlockOrder(
state,
sectionRootClientId
);

// Sections are always contentOnly.
if ( sectionsClientIds?.includes( clientId ) ) {
return 'contentOnly';
}

return 'disabled';
}

const editorMode = __unstableGetEditorMode( state );
if ( editorMode === 'navigation' ) {
if ( editorMode === 'navigation' || isZoomOut( state ) ) {
const sectionRootClientId = getSectionRootClientId( state );

// The root section is "default mode"
Expand Down
Loading