Skip to content

Replace drag surfaces with drag handle, fix hover interactions#3

Open
alizme wants to merge 1 commit intomasterfrom
1st-mvp
Open

Replace drag surfaces with drag handle, fix hover interactions#3
alizme wants to merge 1 commit intomasterfrom
1st-mvp

Conversation

@alizme
Copy link
Copy Markdown

@alizme alizme commented Mar 31, 2026

Summary

  • Fix focus ring lag after reorder: Added #nodeVersion counter to EditorState so overlay measurements re-trigger when sibling/parent nodes change (not just the selected node)
  • Replace large drag surfaces with drag handle: Removed the full-frame auto/absolute drag surface overlays that blocked hover and click interactions on child frames. Replaced with a small 16x16px drag handle icon at top-center of the selected frame
  • Robust hover detection: Use document.elementsFromPoint to find content elements through overlays, extracted into updateHover() called from both pointermove and keydown/keyup so Cmd+hover instantly shows the parent focus ring without requiring cursor movement
  • Cmd+hover parent promotion: When Cmd is held and cursor is over the selected node or any of its descendants, the hover ring targets the selected node's parent container frame

Test plan

  • Select a frame in a layout, drag to reorder — verify focus ring moves instantly with the frame
  • Select a parent container frame — verify children are hoverable and clickable
  • Use the drag handle (blue dot icon above frame) to drag/reorder frames
  • Hold Cmd while hovering a selected frame — verify parent's focus ring appears instantly
  • Release Cmd — verify hover reverts to deepest frame under cursor
  • Resize frames via edge/corner handles — verify resize still works
  • Undo/redo operations — verify focus ring updates correctly

🤖 Generated with Claude Code

…over interactions

- Add #nodeVersion counter to EditorState so overlay measurements update
  when sibling/parent nodes change (fixes focus ring lag after reorder)
- Replace large drag surface overlays with a small 16x16 drag handle icon
  at top-center, eliminating pointer event conflicts with child frames
- Use document.elementsFromPoint for robust hover detection through overlays
- Extract hover logic into updateHover() called from both pointermove and
  keydown/keyup, so Cmd+hover instantly shows parent focus ring
- Cmd+hover promotes to selected node's parent when cursor is inside it

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant