Skip to content

fix(user-input): atomic chip selection, modifier-key handling, and stale overlay ghost#4902

Merged
waleedlatif1 merged 13 commits into
stagingfrom
fix/logo
Jun 8, 2026
Merged

fix(user-input): atomic chip selection, modifier-key handling, and stale overlay ghost#4902
waleedlatif1 merged 13 commits into
stagingfrom
fix/logo

Conversation

@waleedlatif1

Copy link
Copy Markdown
Collaborator

Summary

  • Mention chips in the home user input are now atomic under every selection gesture: select-all, drag, Shift+arrows (grow and shrink), Cmd+Shift jumps, and double-click all snap selection edges to chip boundaries instead of collapsing the selection
  • Plain arrow chip-hop no longer swallows Shift/Cmd/Alt/Ctrl arrow combos or IME composition; Cmd/Ctrl shortcuts are no longer blocked when the caret sits at a chip edge
  • Fixed ghost text lingering after Cmd+A + Delete: the mirror overlay was an unnecessary composited scroll container whose stale GPU layer could outlive the clear — it is now pinned inset-0 with overflow-hidden and shares one class source with the textarea so the two layers can't drift

Type of Change

  • Bug fix

Testing

Tested manually (selection matrix: select-all, drag grow/shrink, shift-arrow grow/shrink across chips, cmd+shift jumps, double-click, click-in-chip caret snap). Typecheck and lint pass.

Checklist

  • Code follows project style guidelines
  • Self-reviewed my changes
  • Tests added/updated and passing
  • No new warnings introduced
  • I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)
@vercel

vercel Bot commented Jun 7, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Skipped Skipped Jun 8, 2026 7:13pm

Request Review

@cursor

cursor Bot commented Jun 7, 2026

Copy link
Copy Markdown

PR Summary

Medium Risk
Touches core chat input selection, keyboard routing, and DOM/state sync; behavior is broad but localized to the user-input surface with new unit tests for snapping logic.

Overview
Mention chips in the home chat input are treated as atomic for selection and editing: new snapSelectionToChips (with unit tests) drives onSelect/mouseup so carets and range edges never sit inside a chip—supporting select-all, drag, Shift+arrow grow/shrink, and click-in-chip snap—with prior selection tracked via a document selectionchange listener.

Keyboard and deletion: Plain arrow chip-hop no longer intercepts Shift/Cmd/Alt/Ctrl arrows or IME composition; Cmd/Ctrl shortcuts pass through at chip edges; typing inside a chip is blocked without treating Space as insert text; Cmd+Backspace stays native. Chip delete in useMentionTokens uses execCommand('delete') when possible for undo and widens the delete span to collapse space seams.

Mirror overlay / scroll: The textarea and highlight overlay share typography via FIELD_MIRROR_CLASSES, live in one SCROLLER_CLASSES container, and co-scroll without JS scrollTop sync or per-layer max-height on the textarea—textarea grows to full scrollHeight while the scroller caps visible height (fixes stale ghost text after clear). Removed autoResizeTextarea, MAX_CHAT_TEXTAREA_HEIGHT, and overlay ref scroll wiring. adoptDomValue syncs React state when the DOM value changes without a normal onChange.

Reviewed by Cursor Bugbot for commit e2dfe15. Configure here.

Comment thread apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx Outdated
@greptile-apps

greptile-apps Bot commented Jun 7, 2026

Copy link
Copy Markdown
Contributor

Greptile Summary

This PR fixes three related UX bugs in the mention-chip textarea: selection edges now snap atomically to chip boundaries for every gesture (select-all, drag, Shift+arrows, double-click), modifier-key arrow/shortcut combos and IME composition are no longer intercepted by the chip-hop and type-block handlers, and the ghost-text overlay is eliminated by replacing the independently-scrolling mirror with a single native scroller that co-scrolls both the textarea and the overlay together.

  • Chip selection atomicity (chip-selection.ts, user-input.tsx): snap logic extracted into a pure, well-tested snapSelectionToChips function; a selectionchange listener maintains a one-step-behind prevSelectionRef so handleSelectAdjust can always distinguish a growing from a shrinking edge.
  • Modifier-key pass-through (user-input.tsx): arrow-hop now guards !shiftKey && !metaKey && !altKey && !ctrlKey && !isComposing; the type-block guard now allows metaKey/ctrlKey shortcuts; !metaKey added to the single-chip Backspace/Delete path so Cmd+Backspace falls through natively.
  • Overlay co-scroll (constants.ts, user-input.tsx): FIELD_MIRROR_CLASSES shared between textarea and overlay guarantees identical box model; SCROLLER_CLASSES div holds both and owns the scrollbar, replacing JS scrollTop synchronisation and eliminating the stale-GPU-layer ghost.

Confidence Score: 5/5

Safe to merge — the changes are well-scoped UI bug fixes with no data-path or API-route impact, and the core snap logic is covered by new unit tests.

The chip-selection math is pure and fully unit-tested. The layout refactor replaces fragile JS scroll-sync with a single CSS scroller, which is simpler and harder to regress. Modifier-key guards are additive conditions on existing event handlers with no side-effects when the new guard is false. No state-management, persistence, or network paths are touched.

No files require special attention. The copilot use-mention-tokens.ts switch to execCommand is the most novel change, but the behavior is equivalent to the prior string-manipulation approach and the deprecation trade-off is acknowledged in comments.

Important Files Changed

Filename Overview
apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx Major selection-handling refactor: selectionchange-tracked prevSelectionRef feeds snapSelectionToChips; layout simplified to single-scroller co-scroll; modifier-key guards added to arrow-hop and text-block paths; handleInput/handleScroll/overlayRef removed cleanly.
apps/sim/app/workspace/[workspaceId]/home/components/user-input/chip-selection.ts New pure-function module extracting chip-snap math; logic is clean, edge cases (tie-break, invert-clamp, singleEdgeMoved XOR) are correct and well-documented.
apps/sim/app/workspace/[workspaceId]/home/components/user-input/components/constants.ts Introduces FIELD_MIRROR_CLASSES as a shared base for TEXTAREA_BASE_CLASSES and OVERLAY_CLASSES, and extracts SCROLLER_CLASSES; scrollbar-hiding utilities correctly migrated to the scroller level.
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/components/user-input/hooks/use-mention-tokens.ts deleteRange switched from string-mutation setMessage to document.execCommand('delete') to preserve native undo; spacing-collapse logic is equivalent to the old code but now operates on the DOM range.
apps/sim/app/workspace/[workspaceId]/home/components/user-input/chip-selection.test.ts Comprehensive unit tests for snapSelectionToChips covering collapsed caret, fresh ranged selection, single-edge grow/shrink, within-chip clamp, and no-chip passthrough.
apps/sim/app/workspace/[workspaceId]/home/components/user-input/components/index.ts Export surface updated to reflect removal of autoResizeTextarea/MAX_CHAT_TEXTAREA_HEIGHT and addition of SCROLLER_CLASSES.

Sequence Diagram

sequenceDiagram
    participant User
    participant Browser
    participant SCL as selectionchange listener
    participant prevRef as prevSelectionRef
    participant HSA as handleSelectAdjust
    participant snap as snapSelectionToChips
    participant DOM as textarea DOM

    User->>Browser: gesture
    Browser->>DOM: update selectionStart and selectionEnd
    Browser->>SCL: fire selectionchange
    SCL->>prevRef: store previous last into prevRef then capture current
    Browser->>HSA: fire onSelect or onMouseUp
    HSA->>DOM: read start and end
    HSA->>prevRef: read prev
    HSA->>snap: snapSelectionToChips with sel prev startChip endChip
    alt edge inside chip
        snap-->>HSA: snapped differs from sel
        HSA->>DOM: setTimeout setSelectionRange with snapped and dir
        DOM->>SCL: fire selectionchange on snap write
        SCL->>prevRef: update prevRef to pre-snap value
        DOM->>HSA: fire onSelect again
        HSA->>snap: already snapped noop
        HSA->>DOM: syncMentionState and syncSlashState
    else no chip hit
        snap-->>HSA: snapped equals sel noop
        HSA->>DOM: syncMentionState and syncSlashState
    end
Loading

Reviews (7): Last reviewed commit: "docs(user-input): trim verbose comments ..." | Re-trigger Greptile

Comment thread apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx Outdated
Comment thread apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx Outdated
Comment thread apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx Outdated
@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@greptile review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit 1a2e63f. Configure here.

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@greptile review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit 6997d3e. Configure here.

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit 7c3e298. Configure here.

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit 5b02798. Configure here.

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@greptile review

Comment thread apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx Outdated
@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

1 issue from previous review remains unresolved.

Fix All in Cursor

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit 31c66fa. Configure here.

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@greptile review

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit d505023. Configure here.

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@greptile review

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit e2dfe15. Configure here.

@waleedlatif1 waleedlatif1 merged commit 27fc6dd into staging Jun 8, 2026
14 checks passed
@waleedlatif1 waleedlatif1 deleted the fix/logo branch June 8, 2026 21:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

1 participant