Visual modes

Blur

mode="blur" applies inline CSS to original text. It works without a stylesheet import. The original remains in the DOM. blurRadius defaults to 6 and can be overridden per component.

Mask

mode="mask" shows bullets for a plain text child. maskChar changes the character. Manual mask does not render the original child while enabled, but application props and data remain unchanged. For a fixed-length mask that does not disclose original length, use a scenario rule with behavior: 'mask'.

Replace

mode="replace" generates deterministic sample text. <Redact replacement="Example person"> uses an authored value. Synthetic examples use reserved email/IP ranges; they are not anonymization.

Secure

mode="secure" remains a compatibility API with replacement behavior. For manual Redact, the original child is not rendered while enabled. For RedactAuto, scanning still happens after rendering: original server HTML and newly inserted text may be present before a scan. All automatic modes now keep restoration values in memory. See the complete boundaries.

Custom

<Redact mode="custom" renderRedacted={() => <span data-redact>Demo customer</span>}>
  {'someone@example.com'}
</Redact>

The custom renderer owns its output and accessible semantics. It must not echo private inputs accidentally. A provider customRender is used when a component does not supply renderRedacted.