Skip to content

Multi-select + drag-drop reorder (dnd-kit) #117

Description

@tayebmokni

Summary

Implement multi-select (Shift-click ranges, Cmd/Ctrl-click toggles) and drag-drop reordering with @dnd-kit/core. Multi-selection toolbar exposes Group, Delete, Copy, Convert to Reusable. Drag handle appears on hover; drop zones above/below siblings and into container blocks' inner-blocks area.

Design reference

  • docs/04-block-editor.md §3.5 (Multi-select)
  • docs/04-block-editor.md §3.6 (Drag-drop reordering)
  • docs/04-block-editor.md §15.1 (Keyboard equivalent for drag)

Acceptance criteria

  • Shift-click selects a contiguous range of siblings
  • Cmd/Ctrl-click toggles individual selection
  • Multi-selection toolbar: Group, Delete, Copy, Convert to Reusable
  • @dnd-kit/core integration with drag handle in the gutter on hover
  • Drop zones: above sibling, below sibling, into container inner-blocks
  • Single insertion marker during drag
  • Drop commits a single moveBlock action (no chained re-renders)
  • Keyboard equivalent: "Move up", "Move down", "Move to position…" actions
  • Drag-drop in document outline (Block inspector sidebar (Block + Document tabs) #103) also wired via dnd-kit
  • a11y: dnd-kit KeyboardSensor configured per docs

Dependencies

#79, #103

Complexity

L

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions