Search and replace document text

Use the built-in search surface to find text across the open document without leaving the Editor.

Try search and replace

Expand the Editor and open Search from the toolbar. The sample has three short pages built for these checks:

1. Search for Client and confirm that there are eight matches.
2. Move through the results with Previous and Next, and watch the Editor scroll between pages.
3. Turn on Match case and confirm that the count changes to seven.
4. Turn Match case off, then replace one result with Customer.
5. Search for Legacy with Tracked deletions set to Exclude and confirm that there are no matches.
6. Set Tracked deletions to Include, reopen Search, and search for Legacy again. The pending deletion is the only match.

Set Replace controls to Hide. Search remains available, but the replacement row disappears. The demo reloads the current document when you change either option because they configure Search at startup. Document edits remain, while the active search resets.

Switch to Viewing after the search. The matches and navigation controls remain available, while the replace controls disappear because Viewing cannot change the document.

Enable built-in search

Continue with /sample.docx from the Quickstart, then enable the search surface:

import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: '/sample.docx',
  ui: {
    toolbar: { container: '#toolbar' },
    search: true,
  },
});

window.addEventListener('beforeunload', () => superdoc.destroy());

Vanilla also needs separate toolbar and Editor mounts:

<div id="toolbar"></div>
<div id="editor" style="height: 70vh"></div>

<script type="module" src="/src/main.ts"></script>

ui: { search: true } connects the toolbar Search button and Ctrl+F or Command+F to the same document search. Without it, the browser keeps its native page search shortcut.

Open Search with both methods. Search for Client and confirm that each method shows the same match count and active result.

Configure the search surface

Choose a group, then choose a field. Each entry shows its type, default, and a configuration fragment you can copy.

replaceControls: false changes only the built-in UI. It does not disable superdoc.ui.search.replace() or enforce a permission. Keep application-owned replacement controls synchronized with canReplace from superdoc.ui.search.observe().

Search also supports match case and regular expressions. Invalid regular expressions show an error instead of running a partial search.

Finding a pending deletion does not restore, accept, or reject it. It only adds that text to the current search results.

Search highlights and the active match are temporary Editor state. Replacements change the document, so use the save flow from Load and save to persist them.

Use custom search controls when your application should render the search surface. Use Document API queries when code needs document targets instead of a visual search session.