fix(editor): restore cursor position after tag/env-var completion in code editors#3406
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
4c3f206 to
b3d3312
Compare
|
@cursor review |
|
@greptile |
Greptile SummaryThis PR fixes cursor jumping to the end of Key changes:
Confidence Score: 4/5
Important Files Changed
Sequence DiagramsequenceDiagram
participant User
participant Dropdown as TagDropdown / EnvVarDropdown
participant Handler as handleTagSelect / handleEnvVarSelect
participant React as React (setState)
participant Utils as restoreCursorAfterInsertion
participant DOM as Textarea DOM
User->>Dropdown: Clicks / presses Enter on item
Dropdown->>Dropdown: Compute newValue & newCursorPos<br/>(insertStart + tag length)
Dropdown->>Handler: onSelect(newValue, newCursorPos)
Handler->>React: setState / setCode(newValue)
Handler->>Utils: restoreCursorAfterInsertion(textarea, newCursorPos)
Note over Utils: setTimeout(0) — macrotask
React-->>DOM: Re-render commits new value
Utils->>DOM: textarea.focus()<br/>selectionStart = newCursorPos<br/>selectionEnd = newCursorPos
DOM-->>User: Cursor at correct position
Last reviewed commit: a73bd6c |
|
@greptile |
|
@cursor review |
|
@greptile |
|
@cursor review |
Move restoreCursorAfterInsertion inside the !isPreview && !readOnly guard so cursor position isn't computed against newValue when the textarea still holds liveValue. Add comment documenting the cross-string index invariant in the shared helper. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
|
@greptile |
Prevents potential SyntaxError if blockId ever contains CSS special characters when querying the textarea for cursor restoration. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
|
@greptile |
Replace cursorPosition state in handleSubflowTagSelect's dependency array with a cursorPositionRef. This avoids recreating the callback on every keystroke since cursorPosition is only used as a fallback when textareaRef.current is null. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
|
@greptile |
|
@cursor review |
Instead of inferring cursor position by searching for delimiters in the
output string (which could match unrelated < or {{ in code), compute
the exact cursor position in TagDropdown and EnvVarDropdown where the
insertion range is definitively known, and pass it through onSelect.
This follows the same pattern used by CodeMirror, Monaco, and
ProseMirror: the insertion source always knows the range, so cursor
position is computed at the source rather than inferred by the consumer.
- TagDropdown/EnvVarDropdown: compute newCursorPosition, pass as 2nd arg
- restoreCursorAfterInsertion: simplified to just (textarea, position)
- code.tsx, condition-input.tsx, use-subflow-editor.ts: accept position
- Removed editorValueRef and cursorPositionRef from use-subflow-editor
(no longer needed since dropdown computes position)
- Other consumers (native inputs) unaffected due to TS callback compat
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
|
@greptile |
|
@cursor review |
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Summary
<>tag or{{}}env var from dropdownreact-simple-code-editorconsumers: code sub-block, condition input, and subflow editorType of Change
Testing
Tested manually
Checklist