# Replace clauses from your application

> Replace a tagged block-level field from application-owned UI.



Use a block-level content control as a clause slot. The DOCX owns where the clause appears. Your application owns the
available clauses and chooses which content fills that slot.

## Try a clause slot [#try-a-clause-slot]

Choose a clause below. The Editor replaces the paragraph inside the control tagged `agreement.confidentiality`.

> **Interactive editor: Choose a confidentiality clause**
>
> The DOCX contains one block-level content control tagged `agreement.confidentiality`.
>
> - **Mutual:** Each party must protect the other party's confidential information and use it only to perform this agreement.
> - **Recipient only:** The receiving party must protect the disclosing party's confidential information and use it only to perform this agreement.
> - **Limited use:** The recipient may use confidential information only to evaluate and perform the services described in this agreement.
>
> Choosing an option replaces the paragraph inside the control. Reset restores the original clause.


## Replace the clause [#replace-the-clause]

For a complete project, use the [Add fields example](https://go.superdoc.dev/examples/content-controls?workflow=add).
Create the block field, then choose **Use mutual confidentiality clause**. The paragraph changes while its tag remains.

Continue with an Editor that has finished loading, and use `superdoc.activeEditor.doc` as `doc`. The
[clause sample](/fixtures/clause-library-sample.docx) already contains the required slot; the Quickstart sample does not.
Create `src/replace-clause.ts` with this helper and call it from your clause picker:

Find the slot by tag, require one block-level control, then replace its content:

```ts
import type { BrowserDocumentApi } from 'superdoc/ui';

export async function replaceClause(doc: BrowserDocumentApi, tag: string, content: string) {
  const { items } = await doc.contentControls.selectByTag({ tag });

  if (items.length !== 1) {
    throw new Error(`Expected one content control tagged "${tag}", found ${items.length}.`);
  }

  const [control] = items;
  if (control.kind !== 'block') {
    throw new Error(`Content control "${tag}" must be block-level.`);
  }

  return doc.contentControls.replaceContent({
    target: control.target,
    content,
    format: 'text',
  });
}

```

`replaceContent()` changes the content inside the control. Its tag and ID remain attached to the slot. Inspect the
mutation receipt before updating your application UI.

In the current Editor, replacement content is rebuilt as text. Keep each replaceable clause to one paragraph. Your
application can store approval state, versions, and clause metadata outside the DOCX.

Export through your existing [load and save flow](/editor/load-and-save-documents). Reopen the saved DOCX and confirm
that the chosen paragraph and its `agreement.confidentiality` tag remain.

Continue with [Lock template fields](/editor/content-controls/lock-template-fields) to keep a clause slot or its contents
from being removed. Use the [Document API reference](/document-api/reference/content-controls/) for every
content-control operation.