feat(BlockEditor): add single block selection via drag handle click
- add `onSelectBlock` prop to Block component wired to drag handle click - implement `selectBlock` function in BlockEditor to select a single block and clear text selection
This commit is contained in:
@@ -41,6 +41,7 @@ const Block = forwardRef(function Block(
|
||||
onSlashOpen,
|
||||
onSlashClose,
|
||||
onSelectAllBlocks,
|
||||
onSelectBlock,
|
||||
onShortcutMatch,
|
||||
onFocus,
|
||||
onDragStart,
|
||||
@@ -298,6 +299,7 @@ const Block = forwardRef(function Block(
|
||||
tabIndex={-1}
|
||||
title="Glisser pour réordonner"
|
||||
onMouseDown={handleHandleMouseDown}
|
||||
onClick={() => onSelectBlock?.(block.id)}
|
||||
disabled={disabled}
|
||||
className="w-5 h-5 flex items-center justify-center rounded text-neutral-500 hover:bg-neutral-200 dark:hover:bg-neutral-700/60 hover:text-neutral-900 dark:hover:text-white text-xs cursor-grab active:cursor-grabbing leading-none"
|
||||
>
|
||||
|
||||
@@ -86,6 +86,13 @@ export default function BlockEditor({
|
||||
if (document.activeElement instanceof HTMLElement) document.activeElement.blur();
|
||||
}
|
||||
|
||||
function selectBlock(id) {
|
||||
setSelectedBlockIds(new Set([id]));
|
||||
const sel = typeof window !== 'undefined' ? window.getSelection() : null;
|
||||
sel?.removeAllRanges();
|
||||
if (document.activeElement instanceof HTMLElement) document.activeElement.blur();
|
||||
}
|
||||
|
||||
function deleteSelectedBlocks() {
|
||||
if (selectedBlockIds.size === 0) return;
|
||||
const next = blocks.filter(b => !selectedBlockIds.has(b.id));
|
||||
@@ -820,6 +827,7 @@ export default function BlockEditor({
|
||||
onSlashOpen={handleSlashOpen}
|
||||
onSlashClose={handleSlashClose}
|
||||
onSelectAllBlocks={handleBlockSelectAll}
|
||||
onSelectBlock={selectBlock}
|
||||
onDragStart={() => setDragOver(null)}
|
||||
onDragEnd={handleDragEnd}
|
||||
onDragOver={handleDragOver}
|
||||
|
||||
Reference in New Issue
Block a user