> ## 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

## 1. `onCommentClick` Callback

* When the user clicks on the comment thread, you can listen to it using this method.
* Example: Use this to fetch the context and make the necessary app state changes to navigate to the comment.

> [tab] React / Next.js
>
> ```jsx theme={null}
> <VeltCommentThread
>     annotationId="COMMENT_ANNOTATION_ID"
>     onCommentClick={(data) => handleOnCommentClick(data)}
> />
> ```

> [tab] Other Frameworks
>
> ```jsx theme={null}
> <velt-comment-thread annotation-id="COMMENT_ANNOTATION_ID"></velt-comment-thread>
> <script>
>     const commentThreadTag = document.querySelector("velt-comment-thread");
>     commentThreadTag.addEventListener('onCommentClick', (event) => {
>         console.log('onCommentClick', event.detail);
>     });
> </script>
> ```

## 2. Pass Comment Annotation Object

* You can pass a Comment Annotation object directly to render the comment thread
* When using annotations from other documents:
  * Comments will be read-only
  * Reactions and recordings will not be rendered
* This enables creating Kanban boards by fetching comment annotations from multiple documents using our REST APIs

> [tab] React / Next.js
>
> ```jsx theme={null}
> <VeltCommentThread annotation={COMMENT_ANNOTATION_OBJECT} />
> ```

> [tab] Other Frameworks
>
> ```html theme={null}
> <velt-comment-thread annotation="STRINGIFIED_COMMENT_ANNOTATION_OBJECT"></velt-comment-thread>
> ```


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