✨ Find/Replace in Document
Description
We should allow users to search for text within the currently open document and optionally replace matching instances.
Additional Context
Users can search for text occurrences in the current file. Matching results should be highlighted.
Users should have the option to replace individual or all instances of the matching text within the document.
This should integrate into the existing Source Editor UI. A search bar should appear when the user initiates the find by pressing ⌘ F, where users can input both search and replacement strings.
The find bar will then appear at the top of the active source editor and consists of the following components:
- Find Options picker, options include:
- Find
- Replace
- Recents List (recents should be completed with a separate issue)
- Clear Recents
- Wrap Around
- Text field
- Result count (visible when there are results)
- Clear text button (visible when text is present)
- Insert Pattern button (this should be completed with a separate issue)
- Case-sensitive toggle
- Match style picker, options include:
- Contains
- Matches Word
- Starts With
- Ends With
- Regular Expression
All found instances should be clearly highlighted, with the currently selected match being prominently highlighted for easy navigation.
HUD Behavior
The HUD will provide visual feedback for users when navigating through occurrences:
-
Looping Navigation:
- If the user reaches the last occurrence and clicks "Next," the search will loop to the first occurrence. A HUD should be displayed with the
arrow.triangle.capsulepathsymbol, indicating that the bottom of the document has been reached and navigation has looped back to the first occurrence. - If the user reaches the first occurrence and clicks "Previous," the search will loop to the last occurrence. A flipped version of the
arrow.triangle.capsulepathsymbol should be displayed in the HUD, indicating that the top of the document has been reached and navigation has looped back to the last occurrence.
- If the user reaches the last occurrence and clicks "Next," the search will loop to the first occurrence. A HUD should be displayed with the
-
End of Document:
- If there are no more occurrences in the document, the HUD should display an icon such as
arrow.down.to.line, signaling that the end of the document has been reached with no further results.
- If there are no more occurrences in the document, the HUD should display an icon such as
This HUD behavior will help users understand the state of their search, particularly when reaching the beginning or end of the document, or when no additional occurrences are found.
Screenshots
@RayZhao1998 Would you like to tackle this one since find is fresh on your mind?
Yep, assigned to me.
Just a quick consideration, when a query has been entered in the Find input, pressing next after the last result will loop back to the first result and display a temporary HUD symbol in the center of the current editor pane.
Moved this issue into CodeEditTextView.
@lukepistrol Work has been done in the past on this. Now that we are working on a new editor view will this need to be done again or can this work translate over?
It looks like we have Find/Replace however it does not look the same as Xcode. Created CodeEditApp/CodeEditTextView#3.