# Text Annotate

## Overview

A text field used for highlighting and tagging text.

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FBzhwniDQryj7NcdivlLW%2FCleanShot%202025-09-09%20at%2016.12.40%402x-min.png?alt=media&#x26;token=1463b163-a34b-4195-9231-70409d43b2c9" alt=""><figcaption></figcaption></figure>

### Properties

<table><thead><tr><th width="174.140625">Name</th><th width="248.96484375">Type</th><th>Description</th></tr></thead><tbody><tr><td><code>name</code></td><td><code>string</code></td><td>Component name</td></tr><tr><td><code>annotations</code></td><td><code>UITextAnnotation[]</code></td><td>An array of annotation objects</td></tr><tr><td><code>addedAnnotation</code></td><td><code>TextAnnotationAddedEvent</code></td><td>Last added annotation event</td></tr><tr><td><code>removedAnnotation</code></td><td><code>TextAnnotationRemovedEvent</code></td><td>Last removed annotation event</td></tr></tbody></table>

### Methods

<table><thead><tr><th width="147.203125">Name</th><th width="239.953125">Parameters</th><th width="104.7421875">Returns</th><th>Description</th></tr></thead><tbody><tr><td><code>setTags</code></td><td><code>tags: string[] |</code> <br><br><br><code>object[]</code>   </td><td><code>void</code></td><td><p>Set component tags. Tags is an array of strings or objects with the following structure:</p><p><code>{</code><br></p><p><code>label: string;</code></p><p><code>key: string;</code></p><p><code>color: string</code></p><p><code>}</code> </p></td></tr><tr><td><code>setText</code></td><td><code>value: string</code></td><td><code>void</code></td><td>Set component text setting</td></tr><tr><td><code>setAnnotations</code></td><td><code>annotations: object[]</code>   </td><td><code>void</code></td><td>Set component annotations setting. Annotations is an array of object with the following structure:<br><code>{</code><br><code>startIndex: number;</code><br><code>endIndex: number;</code><br><code>key: string;</code><br><code>label: string</code><br><code>text: string</code><br><code>}</code></td></tr></tbody></table>

### Triggers

<table><thead><tr><th width="207.3125">Name</th><th>Description</th></tr></thead><tbody><tr><td><strong>On Init</strong></td><td>Triggered when the component is initialized</td></tr><tr><td><strong>On Change</strong></td><td>Triggered when the component's state changes</td></tr><tr><td><strong>On Annotation Add</strong></td><td>Triggered when an annotation is added</td></tr><tr><td><strong>On Annotation Remove</strong></td><td>Triggered when an annotation is removed</td></tr></tbody></table>
