feat(web): add surround selection in composer

[mbuvarp]

What

Add surround-selection support in the composer so that when text is selected and the user types a supported surround symbol, the selection is wrapped instead of replaced.

This also includes dead-key backtick support, so layouts that produce ` through composition can still surround the selected text.

Currently applies to these symbols: (, [, {, ', ", `, <, «, *, _

Why

I understand this is a feature and not a bug fix, and might land outside of what you are likely to accept re: the contribution guidelines. But it's something I always miss in editors when they don't have it, since I habitually select text and press parenthesis, quote or whatever.

If this is something that should be opt-in behind a setting, I can add that as well.

Checklist

• This PR is small and focused
• I explained what changed and why
• I included a video for animation/interaction changes

Video

t3code-surround-selection.mov

---

Note

Medium Risk
Changes low-level composer input/selection handling (including composition/dead-key paths) which can affect typing, selection, and undo behavior across browsers and keyboard layouts.

Overview
Adds surround-selection behavior to the prompt composer: when a non-collapsed selection exists and the user types a supported opening symbol (parens/brackets/quotes/backticks/asterisk/underscore/guillemets), the selection is wrapped and the inner selection is preserved for repeated wrapping; selections that include inline tokens (e.g. mentions/terminal chips) fall back to normal replacement.

Implements a new Lexical ComposerSurroundSelectionPlugin that hooks keydown/beforeinput/input/composition events (including a dead-key backtick composition path with a discrete undo entry), and adds browser integration tests in ChatView.browser.tsx covering forward/backward selections, collapsed caret behavior, option-produced symbols, and mention-adjacent/mention-including selections.

^{Written by Cursor Bugbot for commit dcb7d6f. This will update automatically on new commits. Configure here.}

Note

Add surround selection support to the composer editor

• Adds ComposerSurroundSelectionPlugin in ComposerPromptEditor.tsx that wraps a non-collapsed selection with a matching close symbol when the user types a configured opening symbol (parentheses, brackets, quotes, backticks, angle brackets, asterisks, underscores, etc.).
• The inner selection is preserved after wrapping, enabling repeated wrapping. Selections that intersect inline token nodes (e.g. mentions) fall back to normal replacement behavior.
• Handles dead-key backtick composition as a special case, resolving it into a backtick-surrounded selection with a single history push.
• Adds integration tests in ChatView.browser.tsx covering forward/backward selections, special symbols, mention adjacency, and mention-intersecting fallback.

^{Macroscope summarized dcb7d6f.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 1d9f2e68-fb85-4e58-b12e-2b79dc5689a1

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}