> ## Documentation Index
> Fetch the complete documentation index at: https://velt.dev/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Customize Behavior

# addComment

Create a comment annotation anchored to the text range from a [`TextSelectedEvent`](https://velt.dev/docs/api-reference/sdk/models/data-models#textselectedevent).

* **Params:** [`RewriterAddCommentRequest`](https://velt.dev/docs/api-reference/sdk/models/data-models#rewriteraddcommentrequest)
* **Returns:** `Promise<`[`RewriterAddCommentResponse`](https://velt.dev/docs/api-reference/sdk/models/data-models#rewriteraddcommentresponse)`>`

> [tab] React / Next.js
>
> ```js theme={null}
> const rewriterElement = client.getRewriterElement();
>
> const result = await rewriterElement.addComment({ text: 'Consider simplifying this.', event });
>
> if (result.success) {
>   console.log('Created annotation:', result.annotationId);
> }
> ```

> [tab] Other Frameworks
>
> ```js theme={null}
> const rewriterElement = Velt.getRewriterElement();
>
> const result = await rewriterElement.addComment({ text: 'Consider simplifying this.', event });
>
> if (result.success) {
>   console.log('Created annotation:', result.annotationId);
> }
> ```

# askAi

Send a text-generation prompt to any AI model via Velt's proxy. The provider is resolved automatically from the model name prefix (`gpt-*`/`o1-*`/`o3-*`/`o4-*` → OpenAI, `claude-*` → Anthropic, `gemini-*` → Gemini).

* **Params:** [`RewriterAskAiRequest`](https://velt.dev/docs/api-reference/sdk/models/data-models#rewriteraskairequest)
* **Returns:** `Promise<`[`RewriterAskAiResponse`](https://velt.dev/docs/api-reference/sdk/models/data-models#rewriteraskairesponse)`>`

> [tab] React / Next.js
>
> ```js theme={null}
> const rewriterElement = client.getRewriterElement();
>
> const response = await rewriterElement.askAi({
>   model: 'gemini-2.5-flash',
>   prompt: 'Make it more formal',
>   selectedText: event.text,
> });
>
> if (response.success) {
>   console.log('AI output:', response.text);
> }
> ```

> [tab] Other Frameworks
>
> ```js theme={null}
> const rewriterElement = Velt.getRewriterElement();
>
> const response = await rewriterElement.askAi({
>   model: 'gemini-2.5-flash',
>   prompt: 'Make it more formal',
>   selectedText: event.text,
> });
>
> if (response.success) {
>   console.log('AI output:', response.text);
> }
> ```

# enableRewriter

> [tab] React / Next.js
>
> ```js theme={null}
> const rewriterElement = client.getRewriterElement();
> rewriterElement.enableRewriter();
> rewriterElement.disableRewriter(); //to disable
>
> ```

> [tab] Other Frameworks
>
> ```js theme={null}
> if (Velt) {
>   const rewriterElement = Velt.getRewriterElement();
>   rewriterElement.enableRewriter();
>   rewriterElement.disableRewriter(); //to disable
> }
> ```

# on

Subscribe to Rewriter events. Supports `'textSelected'` to receive a [`TextSelectedEvent`](https://velt.dev/docs/api-reference/sdk/models/data-models#textselectedevent) whenever a user selects text in a Rewriter-enabled region.

* **Params:** `action: 'textSelected'`
* **Returns:** `Observable<`[`TextSelectedEvent`](https://velt.dev/docs/api-reference/sdk/models/data-models#textselectedevent)`>`

> [tab] React / Next.js
>
> ```js theme={null}
> const rewriterElement = client.getRewriterElement();
>
> rewriterElement.on('textSelected').subscribe((event) => {
>   console.log('Selected text:', event.text);
> });
> ```

> [tab] Other Frameworks
>
> ```js theme={null}
> const rewriterElement = Velt.getRewriterElement();
>
> rewriterElement.on('textSelected').subscribe((event) => {
>   console.log('Selected text:', event.text);
> });
> ```

# replaceText

Replace the DOM text identified by a [`TextSelectedEvent`](https://velt.dev/docs/api-reference/sdk/models/data-models#textselectedevent) with new text.

* **Params:** [`RewriterReplaceTextRequest`](https://velt.dev/docs/api-reference/sdk/models/data-models#rewriterreplacetextrequest)
* **Returns:** `Promise<`[`RewriterReplaceTextResponse`](https://velt.dev/docs/api-reference/sdk/models/data-models#rewriterreplacetextresponse)`>`

> [tab] React / Next.js
>
> ```js theme={null}
> const rewriterElement = client.getRewriterElement();
>
> const result = await rewriterElement.replaceText({ text: 'Replacement text', event });
>
> if (result.success) {
>   console.log('Replaced:', result.originalText, '→', result.replacedText);
> }
> ```

> [tab] Other Frameworks
>
> ```js theme={null}
> const rewriterElement = Velt.getRewriterElement();
>
> const result = await rewriterElement.replaceText({ text: 'Replacement text', event });
>
> if (result.success) {
>   console.log('Replaced:', result.originalText, '→', result.replacedText);
> }
> ```

> [!NOTE]
>
> `textSelected` does not fire, and `replaceText()` returns `success: false`, for a selection inside TipTap or another ProseMirror-based editor.

# enableDefaultUI

Show or hide the built-in Velt rewriter toolbar. Calling `disableDefaultUI()` suppresses the toolbar on text selection while keeping all rewriter events active, so you can render a fully custom UI. Call `enableDefaultUI()` to restore the default toolbar.

* **Returns:** `void`

> [tab] React / Next.js
>
> ```js theme={null}
> const rewriterElement = client.getRewriterElement();
>
> // Show the default Velt toolbar on text selection (default state)
> rewriterElement.enableDefaultUI();
>
> // Hide the default Velt toolbar; handle UI yourself
> rewriterElement.disableDefaultUI();
> ```

> [tab] Other Frameworks
>
> ```js theme={null}
> const rewriterElement = Velt.getRewriterElement();
>
> // Show the default Velt toolbar on text selection (default state)
> rewriterElement.enableDefaultUI();
>
> // Hide the default Velt toolbar; handle UI yourself
> rewriterElement.disableDefaultUI();
> ```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.