Comments
Threads
addCommentAnnotation()
Add a new comment annotation.- Params: AddCommentAnnotationRequest
- Returns: AddCommentAnnotationEvent
- React Hook:
useAddCommentAnnotation() - Note: For
organizationPrivatevisibility, the visibility config acceptsorganizationIds?: string[](multi-org) alongsideorganizationId; they are merged + de-duplicated. With neither provided, the comment defaults to the logged-in user’s own org. - Full Documentation →
addCommentOnSelectedText()
Add a comment on selected text.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
addCommentOnElement()
Add a comment on a specific element.- Params:
{ targetElement: object, commentData: array, status?: string } - Returns:
void - React Hook:
n/a - Full Documentation →
addManualComment()
Add a comment with custom positioning.- Params:
ManualCommentAnnotationConfig - Returns:
void - React Hook:
n/a - Full Documentation →
deleteCommentAnnotation()
Delete a comment annotation.- Params: DeleteCommentAnnotationRequest
- Returns: DeleteCommentAnnotationEvent
- React Hook:
useDeleteCommentAnnotation() - Full Documentation →
deleteSelectedComment()
Delete the currently selected comment.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
getCommentAnnotationsCount()
Get the total and unread comment annotations count for specified documents.- Params: CommentRequestQuery (optional)
- Returns:
Observable<GetCommentAnnotationsCountResponse> - React Hook:
useCommentAnnotationsCount() - Full Documentation →
getUnreadCommentAnnotationCountByLocationId()
Get count of unread comment annotations by location ID.- Params:
locationId: string - Returns:
Observable<UnreadCommentsCount | null> - React Hook:
useUnreadCommentAnnotationCountByLocationId() - Full Documentation →
getCommentAnnotations()
Get all the comment annotations for all the specified documents.- Params: CommentRequestQuery (optional)
- Returns:
Observable<GetCommentAnnotationsResponse> - React Hook:
useGetCommentAnnotations() - Full Documentation →
getSelectedComments()
Get currently selected comment annotations.- Params: none
- Returns:
Observable<CommentAnnotation[]> - React Hook:
n/a - Full Documentation →
getCommentAnnotationById()
Get a specific comment annotation by ID.- Params:
{ annotationId: string, documentId?: string } - Returns:
Observable<CommentAnnotation> - React Hook:
useCommentAnnotationById() - Full Documentation →
getElementRefByAnnotationId()
Get the DOM element reference for a comment annotation.- Params:
annotationId: string - Returns:
string - React Hook:
n/a - Full Documentation →
submitComment()
Programmatically submit a comment from a composer.- Params:
SubmitCommentRequest - Returns:
void - React Hook:
n/a - Full Documentation →
enableDraftMode()
Enable Draft Mode to save partial comments as drafts.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableDraftMode()
Disable Draft Mode to prevent saving partial comments as drafts.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
clearComposer()
Reset composer state including text, attachments, recordings, tagged users, assignments, custom lists.- Params:
ClearComposerRequest - Returns:
void - React Hook:
n/a - Full Documentation →
getComposerData()
Fetch current composer state on-demand. Returns same data structure as composerTextChange event.- Params:
GetComposerDataRequest - Returns:
ComposerTextChangeEvent|null - React Hook:
n/a - Full Documentation →
setContextProvider()
Set a function to provide context dynamically for comment annotations.- Params:
CommentContextProvider|null - Returns:
void - React Hook:
useSetContextProvider() - Full Documentation →
updateVisibility()
Programmatically set comment visibility topublic, organizationPrivate, or restricted. When setting restricted type, the current user’s userId is automatically appended to userIds if not already present.
- Params:
annotationId: string,config: CommentVisibilityConfig - Returns:
void - React Hook:
n/a - Note: For
organizationPrivate,configacceptsorganizationIds?: string[](multi-org) alongsideorganizationId; they are merged + de-duplicated. With neither provided, the comment defaults to the logged-in user’s own org. - Full Documentation →
enablePrivateMode()
Enable private mode so new comments are created with restricted visibility by default.- Params:
PrivateModeConfig - Returns:
void - React Hook:
n/a - Note:
PrivateModeConfignow acceptsorganizationId/organizationIds?: string[]fororganizationPrivatemode;organizationIdsis merged + de-duplicated withorganizationId. With neither provided, comments default to the logged-in user’s own org. - Full Documentation →
disablePrivateMode()
Disable private mode, reverting new comments to default visibility.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableVisibilityOptions()
Enable the visibility banner in the comment composer, letting users set visibility before submitting.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableVisibilityOptions()
Disable the visibility banner in the comment composer.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setAssignToType()
Configure assignment UI mode.- Params:
AssignToConfig - Returns:
void - React Hook:
n/a - Full Documentation →
enableContextInPageModeComposer()
Enable passing context data to page mode composer when opening via comment tool.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableContextInPageModeComposer()
Disable passing context data to page mode composer.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
clearPageModeComposerContext()
Clear context data from page mode composer.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableFormatOptions()
Enable text formatting toolbar in comment composers.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableFormatOptions()
Disable text formatting toolbar in comment composers.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setFormatConfig()
Configure individual text formatting options (bold, italic, underline, strikethrough).- Params:
FormatConfig - Returns:
void - React Hook:
n/a - Full Documentation →
applyCommentSidebarClientFilters()
Applies client-providedCommentSidebarFilters to a set of annotations, honoring the current systemFiltersOperator. Backs the Comment Sidebar V2 declarative filtering.
- Params:
annotations:CommentAnnotation[],filters:CommentSidebarFilters - Returns:
CommentAnnotation[] - React Hook:
n/a - Full Documentation →
Slate
withVeltComments()
Higher-order function that enhances a Slate editor with Velt comments capabilities.- Params:
editor: Editoroptions?: VeltCommentsEditorOptions
- Returns:
VeltCommentsEditor - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the editor.- Signature:
async (request:AddCommentRequest) => Promise<void> - Params:
request:AddCommentRequest - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the editor.- Signature:
(request:RenderCommentsRequest) => void - Params:
request:RenderCommentsRequest - Returns:
void - React Hook:
n/a - Full Documentation →
SlateVeltComment
React component that renders a Velt comment text element with annotation ID.- Params:
props: RenderElementPropselement:VeltCommentsElement
- Returns:
N/A - React Hook:
n/a - Full Documentation →
Tiptap
TiptapVeltComments.configure()
A custom Tiptap extension for Velt comments.- Params:
options?:TiptapVeltCommentsOptions - Returns:
TiptapVeltComments - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the editor.- Params:
request:AddCommentRequesteditor: EditoreditorId?: stringcontext?: unknown
- Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the editor.- Params:
request:RenderCommentsRequesteditor: EditoreditorId?: stringcommentAnnotations?:CommentAnnotation[]
- Returns:
void - React Hook:
n/a - Full Documentation →
Lexical
addComment()
Creates a comment annotation for the currently selected text in the editor.- Signature:
addComment: async (request:AddCommentRequest)=> Promise<void> - Params:
AddCommentRequest - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the editor.- Signature:
renderComments: (request:RenderCommentsRequest) => void - Params:
RenderCommentsRequest - Returns:
void - React Hook:
n/a - Full Documentation →
exportJSONWithoutComments()
Export the editor state JSON while stripping comment nodes and normalizing adjacent text nodes.- Signature:
exportJSONWithoutComments(editor: LexicalEditor): SerializedEditorState<SerializedLexicalNode> - Params:
editor:LexicalEditor - Returns:
SerializedEditorState<SerializedLexicalNode> - React Hook:
n/a - Full Documentation →
Plate
VeltCommentsPlugin.configure()
A Plate.js plugin for Velt comments.- Params:
options?:VeltCommentsPluginConfig - Returns:
Plate Plugin - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the editor.- Params:
request:AddCommentRequesteditor: PlateEditoreditorId?: stringcontext?: object
- Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the editor.- Params:
request:RenderCommentsRequesteditor: PlateEditoreditorId?: stringcommentAnnotations?:CommentAnnotation[]
- Returns:
void - React Hook:
n/a - Full Documentation →
exportJSONWithoutComments()
Exports the editor content as JSON with Velt comment elements removed.- Params:
content: Descendant[] - Returns:
Descendant[] - React Hook:
n/a - Full Documentation →
PlateVeltComment
React component that renders a Velt comment element in the editor.- Params:
props: PlateRenderElementPropselement:VeltCommentsElement
- Returns:
N/A - React Hook:
n/a - Full Documentation →
CodeMirror
CodemirrorVeltComments()
Creates the Velt Comments extension for CodeMirror.- Params:
config?:CodemirrorVeltCommentsConfig - Returns: CodeMirror
Extension - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the editor.- Params:
request:AddCommentRequesteditor: EditorVieweditorId?: stringcontext?: object
- Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the editor.- Params:
request:RenderCommentsRequesteditor: EditorVieweditorId?: stringcommentAnnotations?:CommentAnnotation[]
- Returns:
void - React Hook:
n/a - Full Documentation →
Ace
AceVeltComments()
Initializes the Velt Comments extension for an Ace Editor instance.- Params:
editor: Ace.Editor,config?:AceVeltCommentsConfig - Returns:
() => void- Cleanup function to remove event listeners - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the editor.- Params:
request:AddCommentRequesteditor: Ace.EditoreditorId?: stringcontext?: object
- Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the editor.- Params:
request:RenderCommentsRequesteditor: Ace.EditoreditorId?: stringcommentAnnotations?:CommentAnnotation[]
- Returns:
void - React Hook:
n/a - Full Documentation →
Quill
QuillVeltComments
The Velt Comments module for Quill. Register it with Quill before creating the editor.- Params:
config?:QuillVeltCommentsConfig - Returns:
Quill Module - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the editor.- Params:
request:AddCommentRequesteditor: QuilleditorId?: stringcontext?: object
- Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the editor.- Params:
request:RenderCommentsRequesteditor: QuilleditorId?: stringcommentAnnotations?:CommentAnnotation[]
- Returns:
void - React Hook:
n/a - Full Documentation →
Apryse
ApryseVeltComments.configure()
Creates the Velt Comments extension for the Apryse WebViewer. Call.attach(instance) on the result to wire it to a WebViewer instance.
- Params:
config?:ApryseVeltCommentsConfig - Returns:
ApryseVeltComments(call.attach(instance)to get an AttachedExtension) - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the WebViewer.- Params:
request:AddCommentArgsinstance: WebViewerInstance
- Returns:
Promise<AddCommentResult| null> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the WebViewer.- Params:
request:RenderCommentsArgsinstance: WebViewerInstancecommentAnnotations:CommentAnnotation[]
- Returns:
void - React Hook:
n/a - Full Documentation →
DraftJS
DraftJSVeltEditor
React wrapper around the DraftJSEditor component that handles Velt comment decorator setup and annotation context tracking.
- Params:
props:DraftJSVeltEditorProps - Returns: React element
- React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the editor.- Signature:
async (request:AddCommentRequest) => Promise<void> - Params:
request:AddCommentRequest - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the DraftJS editor.- Signature:
(request:RenderCommentsRequest) => void - Params:
request:RenderCommentsRequest - Returns:
void - React Hook:
n/a - Full Documentation →
exportContentStateWithoutComments()
Returns a DraftJSContentState with Velt comment entities removed.
- Params:
contentState: ContentState - Returns:
ContentState - React Hook:
n/a - Full Documentation →
ProseMirror
VeltCommentsPlugin()
Creates the ProseMirror plugin that powers Velt comments. Add it to the editor state’splugins array.
- Params:
config?:VeltCommentsPluginConfig - Returns: ProseMirror
Plugin - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the ProseMirror editor.- Signature:
async (request:AddCommentRequest) => Promise<void> - Params:
request:AddCommentRequest - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and highlights comment annotations in the ProseMirror editor.- Signature:
(request:RenderCommentsRequest) => void - Params:
request:RenderCommentsRequest - Returns:
void - React Hook:
n/a - Full Documentation →
veltCommentsPluginKey
The ProseMirrorPluginKey used by the package. Exported for advanced plugin state inspection.
- Params: none
- Returns:
PluginKey<VeltPluginState> - React Hook:
n/a - Full Documentation →
TinyMCE
VeltCommentsPlugin
The registered TinyMCE plugin name ('veltcomments') that powers Velt comments. Import the package and add it to the editor’s plugins list.
- Params: none
- Returns: TinyMCE plugin name
- React Hook:
n/a - Full Documentation →
registerVeltCommentsPlugin()
Explicitly registers the TinyMCEveltcomments plugin against a TinyMCE instance. Use this when TinyMCE is loaded or provided after package import.
- Params:
instance?: TinyMCE - Returns:
void - React Hook:
n/a - Full Documentation →
addComment()
Creates a Velt comment annotation for the currently selected TinyMCE text.- Signature:
async (request:AddCommentRequest) => Promise<void> - Params:
request:AddCommentRequest - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Resolves Velt comment annotations back to TinyMCE DOM ranges and renders stable<velt-comment-text> overlay elements for the visible comments.
- Signature:
(request:RenderCommentsRequest) => void - Params:
request:RenderCommentsRequest - Returns:
void - React Hook:
n/a - Full Documentation →
CKEditor
VeltCommentsPlugin
The CKEditor 5 plugin class that powers Velt comments. Add it to the editor’splugins list and configure it with config.veltComments.
- Config: VeltCommentsPluginConfig
- Returns: CKEditor plugin class
- React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in CKEditor.- Signature:
async (request:AddCommentRequest) => Promise<void> - Params:
request:AddCommentRequest - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Resolves and highlights Velt comment annotations in CKEditor.- Signature:
(request:RenderCommentsRequest) => void - Params:
request:RenderCommentsRequest - Returns:
void - React Hook:
n/a - Full Documentation →
Monaco
registerVeltComments()
Registers the Velt comments integration on a Monaco editor instance and returns a disposable handle.- Signature:
(editor: MonacoEditor, config?:MonacoVeltCommentsConfig) =>VeltCommentsHandle - Params:
editor: MonacoEditorconfig?:MonacoVeltCommentsConfig
- Returns: VeltCommentsHandle
- React Hook:
n/a - Full Documentation →
addComment()
Creates a Velt comment annotation for the currently selected Monaco text.- Signature:
async (request:AddCommentRequest) => Promise<void> - Params:
request:AddCommentRequest - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
renderComments()
Resolves Velt comment annotations to Monaco ranges and renders stable<velt-comment-text> overlay elements for the visible comments.
- Signature:
(request:RenderCommentsRequest) => void - Params:
request:RenderCommentsRequest - Returns:
void - React Hook:
n/a - Full Documentation →
isVeltAvailable()
Checks whether the Velt SDK is loaded onwindow.Velt.
- Params: none
- Returns:
boolean - React Hook:
n/a - Full Documentation →
SuperDoc
SuperDocVeltComments
Creates the Velt Comments extension for a SuperDoc editor. Configure it, then call.attach(instance) to wire it to an editor.
- Config: SuperDocVeltCommentsConfig
- Returns:
SuperDocVeltComments - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected text in the SuperDoc editor.- Signature:
async (args: AddCommentArgs) => Promise<AddCommentResult | null> - Params:
args:AddCommentArgs - Returns:
Promise<AddCommentResult | null> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and updates Velt comment highlights in the SuperDoc editor.- Signature:
(args:RenderCommentsArgs) => void - Params:
args:RenderCommentsArgs - Returns:
void - React Hook:
n/a - Full Documentation →
Nutrient
NutrientVeltComments
Creates the Velt Comments extension for a Nutrient viewer. Configure it, then call.attach(instance) to wire it to a viewer instance.
- Config: NutrientVeltCommentsConfig
- Returns:
NutrientVeltComments - React Hook:
n/a - Full Documentation →
captureSelection()
Records the current Nutrient text selection for the nextaddComment() call.
- Signature:
(instance: NutrientInstance) => Promise<void> - Params:
instance: NutrientInstance - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently captured text selection in the Nutrient viewer.- Signature:
async (args: AddCommentArgs) => Promise<AddCommentResult | null> - Params:
args:AddCommentArgs - Returns:
Promise<AddCommentResult | null> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and updates Velt comment highlights in the Nutrient viewer.- Signature:
(args:RenderCommentsArgs) => void - Params:
args:RenderCommentsArgs - Returns:
void - React Hook:
n/a - Full Documentation →
SpreadJS
SpreadJSVeltComments
Creates the Velt Comments extension for a SpreadJS workbook. Configure it, then call.attach(instance) to wire it to a workbook instance.
- Config: SpreadJSVeltCommentsConfig
- Returns:
SpreadJSVeltComments - React Hook:
n/a - Full Documentation →
addComment()
Creates a comment annotation for the currently selected SpreadJS cell or range.- Signature:
async (args: AddCommentArgs) => Promise<AddCommentResult | null> - Params:
args:AddCommentArgs - Returns:
Promise<AddCommentResult | null> - React Hook:
n/a - Full Documentation →
renderComments()
Renders and updates Velt comment highlights in the SpreadJS workbook.- Signature:
(args:RenderCommentsArgs) => void - Params:
args:RenderCommentsArgs - Returns:
void - React Hook:
n/a - Full Documentation →
Messages
addComment()
Add a comment to a specific comment annotation.- Params: AddCommentRequest
- Returns: AddCommentEvent
- React Hook:
useAddComment() - Full Documentation →
updateComment()
Update a comment in a specific comment annotation.- Params: UpdateCommentRequest
- Returns: UpdateCommentEvent
- React Hook:
useUpdateComment() - Full Documentation →
deleteComment()
Delete a comment from a specific comment annotation.- Params: DeleteCommentRequest
- Returns: DeleteCommentEvent
- React Hook:
useDeleteComment() - Full Documentation →
getComment()
Get comments from a specific comment annotation.- Params: GetCommentRequest
- Returns: Comment[]
- React Hook:
useGetComment() - Full Documentation →
getUnreadCommentCountOnCurrentDocument()
Get the number of unread comments on the current document.- Params: none
- Returns:
Observable<UnreadCommentsCount | null> - React Hook:
useUnreadCommentCountOnCurrentDocument() - Full Documentation →
getUnreadCommentCountByLocationId()
Get the number of unread comments by location ID.- Params:
locationId: string - Returns:
Observable<UnreadCommentsCount | null> - React Hook:
useUnreadCommentCountByLocationId() - Full Documentation →
getUnreadCommentCountByAnnotationId()
Get the number of unread comments by annotation ID.- Params:
annotationId: string - Returns:
Observable<number> - React Hook:
useUnreadCommentCountByAnnotationId() - Full Documentation →
markAsRead()
Mark a comment annotation as read for the current user.- Params:
annotationId: string - Returns:
Promise<void> - React Hook:
useCommentUtils() - Full Documentation →
markAsUnread()
Mark a comment annotation as unread for the current user.- Params:
annotationId: string - Returns:
Promise<void> - React Hook:
useCommentUtils() - Full Documentation →
@Mentions
assignUser()
Assign a user to a comment annotation.- Params: AssignUserRequest
- Returns: AssignUserEvent
- React Hook:
useAssignUser() - Full Documentation →
disableCustomAutocompleteSearch()
Disable custom autocomplete search for contact list.- Params:
none - Returns:
void - React Hook:
useContactUtils()oruseCommentUtils() - Full Documentation →
enableAtHere()
Enable or disable @here mentions.- Params: none
- Returns:
void - React Hook:
useContactUtils() - Full Documentation →
enableUserMentions()
Enable or disable user @mentions.- Params: none
- Returns:
void - React Hook:
useContactUtils() - Full Documentation →
enablePaginatedContactList()
Enable paginated loading of contact list.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disablePaginatedContactList()
Disable paginated loading of contact list.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableAnonymousEmail()
Enable display of unrecognized email addresses in the @mention dropdown.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableAnonymousEmail()
Suppress unrecognized email addresses from appearing in the @mention dropdown.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableCustomAutocompleteSearch()
Enable custom autocomplete search for contact list.- Params:
none - Returns:
void - React Hook:
useContactUtils()oruseCommentUtils() - Full Documentation →
getContactList()
Subscribe to the list of users added to organization, folder, document, user groups or the ones overwritten using theupdateContactList API.
- Params: none
- Returns:
Observable<GetContactListResponse> - React Hook:
useContactList() - Full Documentation →
onContactSelected()
Listen for when a contact is selected from the dropdown.- Params: none
- Returns:
Observable<UserContactSelectedPayload> - React Hook:
useContactSelected() - Full Documentation →
setAtHereLabel()
Customize the @here label text.- Params:
label: string - Returns:
void - React Hook:
useContactUtils() - Full Documentation →
setAtHereDescription()
Customize the @here description text.- Params:
description: string - Returns:
void - React Hook:
useContactUtils() - Full Documentation →
subscribeCommentAnnotation()
Subscribe to a comment annotation.- Params: SubscribeCommentAnnotationRequest
- Returns: SubscribeCommentAnnotationEvent
- React Hook:
useSubscribeCommentAnnotation() - Full Documentation →
unsubscribeCommentAnnotation()
Unsubscribe from a comment annotation.- Params: UnsubscribeCommentAnnotationRequest
- Returns: UnsubscribeCommentAnnotationEvent
- React Hook:
useUnsubscribeCommentAnnotation() - Full Documentation →
updateContactList()
Update the contact list for the current user session.- Params:
contacts: Array<{userId: string, name: string, email: string}>, options?: {merge: boolean, filters: boolean} - Returns:
void - React Hook:
useContactUtils() - Full Documentation →
updateOrgList()
Supplies the list of teams shown in the comment dialog’s “Selected Teams” visibility picker. UnlikeupdateContactList(), this is a full replace on every call (it does not merge); pass { orgList: [] } to clear the picker. Exposed on contactElement only.
- Params:
config: UpdateOrgListConfig(orgListis an array ofOrgContact) - Returns:
void - React Hook:
useContactUtils() - Full Documentation →
updateContactListScopeForOrganizationUsers()
Restrict which contacts are shown in the dropdown for organization users.- Params:
scopes: Array<'all' | 'organization' | 'organizationUserGroup' | 'document'> - Returns:
void - React Hook:
n/a - Full Documentation →
Metadata
addContext()
Add custom metadata to a comment annotation.- Params:
{ [key: string]: any } - Returns:
void - React Hook:
useCommentEventCallback('addCommentAnnotation') - Full Documentation →
updateContext()
Update custom metadata on a comment annotation.- Params:
annotationId: string, context: { [key: string]: any }, config?: { merge: boolean } - Returns:
void - React Hook:
n/a - Full Documentation →
Custom Lists
addCustomListDataOnAnnotation()
Add a custom dropdown list at the Comment Annotation level.- Params:
{ type: 'multi' | 'single', placeholder: string, data: Array<{ id: string, label: string }> } - Returns:
void - React Hook:
useCommentUtils() - Full Documentation →
addCustomListDataOnComment()
Add a custom dropdown list that appears when a hotkey is pressed in the comment composer.- Params:
{ hotkey: string, type: 'custom', data: Array<AutocompleteItem> } - Returns:
void - React Hook:
useCommentUtils() - Full Documentation →
onAutocompleteChipClick()
Listen for clicks on autocomplete chips in comments.- Params: none
- Returns:
Observable<AutocompleteItem> - React Hook:
useAutocompleteChipClick() - Full Documentation →
enableCustomAutocompleteSearch()
Enable custom autocomplete search for custom list.- Params:
none - Returns:
void - React Hook:
useCommentUtils() - Full Documentation →
disableCustomAutocompleteSearch()
Disable custom autocomplete search for custom list.- Params:
none - Returns:
void - React Hook:
useCommentUtils() - Full Documentation →
Event Subscription
on()
Subscribe to comment events.- Params:
CommentEventType. Here is the list of event types you can subscribe to. - Returns:
Observable<CommentEventTypesMap[T]>. Here is the list of events object types you can expect to receive. - React Hook:
useCommentEventCallback(CommentEventType) - Full Documentation →
Attachments
enableAttachments()
Enable file attachments in comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableAttachmentDownload()
Allow clicking an attachment to trigger a file download.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableAttachmentDownload()
Prevent clicking an attachment from triggering a file download;attachmentDownloadClicked still fires.
- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableScreenshot()
Enable screenshot option in comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableScreenshot()
Disable screenshot option in comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
addAttachment()
Add an attachment to a specific comment annotation.- Params: AddAttachmentRequest
- Returns:
Promise<AddAttachmentResponse[]> - React Hook:
useAddAttachment() - Full Documentation →
deleteAttachment()
Delete an attachment from a specific comment annotation.- Params: DeleteAttachmentRequest
- Returns:
Promise<DeleteAttachmentEvent | null> - React Hook:
useDeleteAttachment() - Full Documentation →
getAttachment()
Get attachments from a specific comment annotation.- Params: GetAttachmentRequest
- Returns:
Promise<Attachment[]> - React Hook:
useGetAttachment() - Full Documentation →
setAllowedFileTypes()
Limit file types in comment attachments by specifying allowed file extensions.- Params:
string[](array of file extensions) - Returns:
void - React Hook:
n/a - Full Documentation →
setComposerFileAttachments()
Programmatically add file attachments to the comment composer from your application instead of requiring users to select files from the file system.- Params: UploadFileData
- Returns:
void - React Hook:
n/a - Full Documentation →
enableAttachmentDownload()
Enable automatic file downloads when clicking the download button on attachments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableAttachmentDownload()
Disable automatic file downloads. TheattachmentDownloadClicked event still fires, allowing custom download logic.
- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Reactions
enableReactions()
Enable emoji reactions in comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setCustomReactions()
Set custom reactions by passing a map containing reaction information.- Params:
{[reactionId: string]: {url?: string, emoji?: string}} - Returns:
void - React Hook:
n/a - Full Documentation →
addReaction()
Add a reaction to a specific comment annotation.- Params: AddReactionRequest
- Returns:
Promise<AddReactionEvent | null> - React Hook:
useAddReaction() - Full Documentation →
deleteReaction()
Delete a reaction from a specific comment annotation.- Params: DeleteReactionRequest
- Returns:
Promise<DeleteReactionEvent | null> - React Hook:
useDeleteReaction() - Full Documentation →
toggleReaction()
Toggle a reaction for a specific comment annotation.- Params: ToggleReactionRequest
- Returns:
Promise<ToggleReactionEvent | null> - React Hook:
useToggleReaction() - Full Documentation →
Status & Priority
enableStatus()
Enable status dropdown & filters in comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setCustomStatus()
Set custom statuses by passing an array of status objects.- Params:
StatusConfig[] - Returns:
void - React Hook:
n/a - Full Documentation →
enableResolveButton()
Enable resolve button on comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
updateStatus()
Update the status of a comment annotation.- Params: UpdateStatusRequest
- Returns:
Promise<UpdateStatusEvent> - React Hook:
useUpdateStatus() - Full Documentation →
resolveCommentAnnotation()
Resolve a comment annotation.- Params: ResolveCommentAnnotationRequest
- Returns:
Promise<ResolveCommentAnnotationEvent> - React Hook:
useResolveCommentAnnotation() - Full Documentation →
enablePriority()
Enable priority settings in comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setCustomPriority()
Set custom priorities by passing an array of priority objects.- Params:
PriorityConfig[] - Returns:
void - React Hook:
n/a - Full Documentation →
updatePriority()
Update the priority of a comment annotation.- Params: UpdatePriorityRequest
- Returns:
Promise<UpdatePriorityEvent> - React Hook:
useUpdatePriority() - Full Documentation →
Recordings
deleteRecording()
Delete a recording from a comment.- Params: DeleteRecordingRequest
- Returns:
Promise<DeleteRecordingEvent | null> - React Hook:
useDeleteRecording() - Full Documentation →
getRecording()
Get recordings from a comment.- Params: GetRecordingRequest
- Returns:
Promise<RecordedData[]> - React Hook:
useGetRecording() - Full Documentation →
setAllowedRecordings()
Set allowed recording types (audio, video, screen).- Params:
string - Returns:
void - React Hook:
n/a - Full Documentation →
enableRecordingCountdown()
Enable countdown before recording starts.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableRecordingTranscription()
Enable AI transcription for recordings.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Deep Link
getLink()
Get a link to a specific comment annotation.- Params: GetLinkRequest
- Returns: GetLinkResponse
- React Hook:
useGetLink() - Full Documentation →
copyLink()
Copy a link to a specific comment annotation to clipboard.- Params: CopyLinkRequest
- Returns: CopyLinkEvent
- React Hook:
useCopyLink() - Full Documentation →
Navigation
scrollToCommentByAnnotationId()
Scroll the page to a comment’s location.- Params:
annotationId: string - Returns:
void - React Hook:
n/a - Full Documentation →
selectCommentByAnnotationId()
Programmatically select a comment annotation. When called without arguments or with an invalid ID, it will close the currently selected annotation.- Params:
annotationId?: string(optional) - Returns:
void - React Hook:
n/a - Full Documentation →
onCommentSelectionChange()
Subscribe to comment selection changes.- Params: none
- Returns:
Observable<CommentSelectionChangeData> - React Hook:
useCommentSelectionChangeHandler() - Full Documentation →
enablescrollToComment()
Enable automatic scrolling to comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
DOM Controls
allowedElementIds()
Set allowed element IDs for commenting.- Params:
elementIds: string[] - Returns:
void - React Hook:
n/a - Full Documentation →
allowedElementClassNames()
Set allowed element class names for commenting.- Params:
classNames: string[] - Returns:
void - React Hook:
n/a - Full Documentation →
allowedElementQuerySelectors()
Set allowed element query selectors for commenting.- Params:
selectors: string[] - Returns:
void - React Hook:
n/a - Full Documentation →
setContextInPageModeComposer()
Set context data and optional target element for page mode composer.- Params:
PageModeComposerConfig - Returns:
void - React Hook:
n/a - Full Documentation →
focusPageModeComposer()
Focus the page mode composer input field.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
AI Categorization
enableAutoCategorize()
Enable AI auto-categorization of comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setCustomCategory()
Set custom categories for comment categorization.- Params:
categories: Array<{id: string, name: string, color: string}> - Returns:
void - React Hook:
n/a - Full Documentation →
UI
updateCommentDialogPosition()
Update position of comment dialog relative to pin.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableSidebarButtonOnCommentDialog()
Enable sidebar button on comment dialogs.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
onSidebarButtonOnCommentDialogClick()
Subscribe to clicks on comment dialog sidebar button.- Params: none
- Returns:
Observable<any> - React Hook:
useCommentDialogSidebarClickHandler() - Full Documentation →
CommentDialogActionService.isSubmitInFlight()
Returnstrue while a real (non-draft) addComment call is in flight for the given dialog instance. Use this to guard against duplicate submits or skip auto-draft-save logic during an active submit.
- Params:
dialogInstanceId?: string— optional; if omitted, returnsfalse(the in-flight flag is only tracked when adialogInstanceIdis supplied). - Returns:
boolean - React Hook:
n/a - Full Documentation →
enableDeleteReplyConfirmation()
Enable confirmation dialog before deleting replies.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableMobileMode()
Enable mobile-optimized comment UI.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableCommentPinHighlighter()
Enable highlighting outline around comment pins.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enablePinDrag()
Enable dragging of comment pins to reposition them.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disablePinDrag()
Disable dragging of comment pins.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
showCommentsOnDom()
Show comments on the DOM.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableDialogOnHover()
Enable showing comment dialog on hover.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableFloatingCommentDialog()
Enable floating comment dialog next to pins.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
showResolvedCommentsOnDom()
Show resolved comments on the DOM.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableCollapsedComments()
Enable collapsing of comments in annotations.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableShortUserName()
Enable shortening of long user names.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableSignInButton()
Enable sign in button on comment dialog when user is anonymous or signed out.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
onSignIn()
Handle sign in button click event.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Extra Information
enableCommentIndex()
Enable comment index indicators on pins and sidebar.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableDeviceInfo()
Enable device type indicators in comment threads.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableDeviceIndicatorOnCommentPins()
Enable device type indicators on comment pins.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableGhostComments()
Enable showing ghost comments on the DOM.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableGhostCommentsIndicator()
Enable ghost comment labels in the sidebar.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Special File Type Support
enableSvgAsImg()
Treat SVGs as flat images instead of layered elements.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Keyboard Controls
enableHotkey()
Enable hotkeys for comments (e.g. ‘c’ to enable comment mode).- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableEnterKeyToSubmit()
Enable using Enter key to submit comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableDeleteOnBackspace()
Enable deleting comments with backspace key.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Moderation
enableModeratorMode()
Enable moderator mode for comments requiring approval.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableResolveStatusAccessAdminOnly()
Restrict resolve action to admin users and comment authors.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
approveCommentAnnotation()
Approve a comment annotation in moderator mode.- Params:
ApproveCommentAnnotationRequest - Returns:
Promise<ApproveCommentAnnotationEvent> - React Hook:
useApproveCommentAnnotation() - Full Documentation →
acceptCommentAnnotation()
Accept a comment annotation in suggestion mode.- Params:
AcceptCommentAnnotationRequest - Returns:
Promise<AcceptCommentAnnotationEvent> - React Hook:
useAcceptCommentAnnotation() - Full Documentation →
rejectCommentAnnotation()
Reject a comment annotation in suggestion mode.- Params:
RejectCommentAnnotationRequest - Returns:
Promise<RejectCommentAnnotationEvent> - React Hook:
useRejectCommentAnnotation() - Full Documentation →
enableSuggestionMode()
Enable suggestion mode for accepting/rejecting comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
acceptSuggestion()
Accept an AI agent suggestion annotation.- Params:
AcceptSuggestionRequest,source?: 'internal' | 'external' - Returns:
Promise<SuggestionAcceptEvent | null> - React Hook:
n/a
rejectSuggestion()
Reject an AI agent suggestion annotation.- Params:
RejectSuggestionRequest,source?: 'internal' | 'external' - Returns:
Promise<SuggestionRejectEvent | null> - React Hook:
n/a
Comment Read Status
enableSeenByUsers()
Enable “Seen By” feature to show which users have seen each comment.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setUnreadIndicatorMode()
Set unread indicator mode to either minimal (dot) or verbose (badge).- Params:
mode: "minimal" | "verbose" - Returns:
void - React Hook:
n/a - Full Documentation →
Toggle Comment Types
enableAreaComment()
Enable area comments that allow drawing rectangles with comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableInboxMode()
Enable inbox mode for comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enablePopoverMode()
Enable popover mode for comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableStreamMode()
Enable stream mode for comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableTextMode()
Enable text mode for comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableInlineCommentMode()
Enable inline comment mode to show comments under associated text.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableMultithread()
Enable multithreaded comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableCollapsedRepliesPreview()
Show the collapsed thread teaser (first comment, “Show N replies…” divider, last comment) in a comment dialog’s non-selected preview state. Defaults to disabled.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableCollapsedRepliesPreview()
Revert to showing only the first comment in a comment dialog’s non-selected preview state.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Comment Bubble
enableGroupMatchedComments()
Enable grouping of multiple comment annotations in Comment Bubble component when multiple annotations match the providedcontext or targetElementId.
- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Comment Tool
enableCommentMode()
Enable comment mode to allow attaching comments to DOM elements.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
onCommentModeChange()
Subscribe to changes in comment mode state.- Params: none
- Returns:
Observable<boolean> - React Hook:
useCommentModeState() - Full Documentation →
enableCommentTool()
Enable/disable the comment tool button.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableChangeDetectionInCommentMode()
Enable DOM change detection while in comment mode.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enablePersistentCommentMode()
Enable persistent comment mode to continue leaving comments after finishing one.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableForceCloseAllOnEsc()
Force close persistent comment mode when ESC key is pressed, even if a comment thread is active.- Params: none
- Returns:
void - React Hook:
useCommentUtils() - Full Documentation →
disableForceCloseAllOnEsc()
Disable force close behavior for persistent comment mode when ESC key is pressed.- Params: none
- Returns:
void - React Hook:
useCommentUtils() - Full Documentation →
setPinCursorImage()
Set custom cursor image for comment mode.- Params:
base64ImageString: string - Returns:
void - React Hook:
n/a - Full Documentation →
Minimap
enableMinimap()
Enable minimap showing comment locations on screen edge.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Popover Comments
enableDialogOnTargetElementClick()
Enable opening comment dialog on target element click in popover mode.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enablePopoverTriangleComponent()
Enable triangle indicator on popover comments.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Video Timeline Comments
setTotalMediaLength()
Set the total length of media (in frames or seconds) for the timeline.- Params:
length: number - Returns:
void - React Hook:
n/a - Full Documentation →
Comment Pin
enableBubbleOnPin()
Show a Comment Bubble when hovering/clicking on Comment Pin instead of Comment Dialog.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableBubbleOnPinHover()
Show Comment Bubble on hover vs click for Comment Pins.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Component Props
VeltComments
Props accepted by theVeltComments root component, including edit-mode placeholder overrides. Setting props here propagates to all comment dialogs automatically.
- Params:
VeltCommentsProps - Returns:
N/A - React Hook:
n/a - Full Documentation →
VeltCommentDialog
Props accepted by theVeltCommentDialog component, including edit-mode placeholder overrides.
- Params:
VeltCommentDialogProps - Returns:
N/A - React Hook:
n/a - Full Documentation →
VeltCommentsSidebar
Props accepted by theVeltCommentsSidebar component, including edit-mode placeholder overrides.
- Params:
VeltCommentsSidebarProps - Returns:
N/A - React Hook:
n/a - Full Documentation →
VeltInlineCommentsSection
Props accepted by theVeltInlineCommentsSection component, including edit-mode placeholder overrides.
- Params:
VeltInlineCommentsSectionProps - Returns:
N/A - React Hook:
n/a - Full Documentation →
Comments Sidebar
Custom filtering, sorting and grouping
enableSidebarCustomActions()
Enable custom filtering, sorting and grouping actions in the comments sidebar.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setCommentSidebarData()
Set filtered/sorted/grouped data in the comments sidebar.- Params:
data: CommentSidebarData[], options?: {grouping?: boolean} - Returns:
void - React Hook:
n/a - Full Documentation →
getCustomSidebarDataAnnotationIds()
Returns a snapshot of the deduplicated annotation-ID set most recently passed tosetCommentSidebarData().
Advanced / internal — prefer
setCommentSidebarData() for most use cases.- Params: none
- Returns:
Set<string> | null—nullbefore anysetCommentSidebarData()call or afterclearCache() - React Hook:
n/a
null indicates no override is active (no setCommentSidebarData call yet, or clearCache was called); an empty Set<string> means the client has explicitly set the visible list to empty (show nothing).getCustomSidebarDataAnnotationIds$()
Returns an Observable that replays the current annotation-ID set and emits on everysetCommentSidebarData() call. Structurally equal ID sets are deduplicated (no redundant emissions).
Advanced / internal — prefer
setCommentSidebarData() for most use cases.- Params: none
- Returns:
Observable<Set<string> | null>— emitsnullbefore anysetCommentSidebarData()call and afterclearCache() - React Hook:
n/a - Full Documentation →
Navigation
onCommentClick()
Listen for comment click events in the sidebar.- Params:
(event: {documentId: string, location: Object, targetElementId: string, context: Object, annotation: CommentAnnotation}) => void - Returns:
void - React Hook:
n/a - Full Documentation →
enableSidebarUrlNavigation()
Enable automatic URL navigation when clicking comments in the sidebar.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
UI
openCommentSidebar()
Open the comments sidebar.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
closeCommentSidebar()
Close the comments sidebar.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
toggleCommentSidebar()
Toggle the comments sidebar open/closed state.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableFullScreenInSidebar()
Enable full-screen mode for the Comments Sidebar (only works in default mode).- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableFullScreenInSidebar()
Disable full-screen mode for the Comments Sidebar.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
excludeLocationIdsFromSidebar()
Filter out comments from specified locations in the sidebar.- Params:
locationIds: string[] - Returns:
void - React Hook:
n/a - Full Documentation →
System Filters, Sorting and Grouping
setCommentSidebarFilters()
Set filters for the comments sidebar programmatically. Included keys replace their selected values while omitted keys are preserved. The values render as checked options and are cleared by Reset — pass a present-but-empty array to clear one field, or an empty object to clear all selections.- Params:
filters:CommentSidebarFilters - Returns:
void - React Hook:
n/a - Full Documentation →
setSystemFiltersOperator()
Set how selections from different sidebar filter fields are combined. Values within one field always use OR.- Params:
operator: 'and' | 'or' - Returns:
void - React Hook:
n/a - Full Documentation →
setSidebarButtonCountType()
Change what the sidebar button count badge reflects:'default' counts comments in open and in-progress states; 'filter' counts the sidebar’s filtered list.
- Params:
type: string - Returns:
void - React Hook:
n/a - Full Documentation →
Notifications
Data
getNotificationsData()
Get the notifications data for the current user.- Params:
- query: Optional.
GetNotificationsDataQuerytype: Filter for notification type: all, for you, or documents.forYou: returns notifications where the current user is involved.all/documents: returns all notifications from the documents the user has access to.
- query: Optional.
- Returns:
Observable<Notification[]> - React Hook:
useNotificationsData() - Full Documentation →
getUnreadNotificationsCount()
Get count of unread notifications by tab.- Params: none
- Returns:
Observable<{forYou: number, all: number}> - React Hook:
useUnreadNotificationsCount() - Full Documentation →
Event Subscription
on()
Subscribe to Notification events.- Params:
NotificationEventType. Here is the list of events you can subscribe to. - Returns:
Observable<NotificationEventTypesMap[T]>. Here is the list of events object types you can expect to receive. - React Hook:
useNotificationEventCallback(NotificationEventType)
onNotificationClick()
Listen for notification click events in the Notifications Panel.- Params:
(notification: Notification) => void - Returns:
void - React Hook:
n/a - Full Documentation →
Configuration
setTabConfig()
Customize notification tab names and visibility.- Params:
tabConfig: TabConfig - Returns:
void - React Hook:
n/a - Full Documentation →
setMaxDays()
Set maximum age in days for displayed notifications.- Params:
days: number - Returns:
void - React Hook:
n/a - Full Documentation →
enableReadNotificationsOnForYouTab()
Show read notifications in the “For You” tab.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableCrossOrganization()
Enable cross-organization “For You” notifications, merging notifications from other orgs the user belongs to. Passingnull or omitting config opts in with defaults; { enabled: false } disables.
- Params:
config?:CrossOrganizationConfig| null - Returns:
void - React Hook:
n/a - Full Documentation →
disableCrossOrganization()
Disable cross-organization notifications.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
getCrossOrganizationConfig()
Get the current cross-organization configuration.- Params: none
- Returns:
CrossOrganizationConfig - React Hook:
n/a - Full Documentation →
getCrossOrganizationConfig$()
Subscribe to changes in the cross-organization configuration.- Params: none
- Returns:
Observable<CrossOrganizationConfig> - React Hook:
n/a - Full Documentation →
Actions
setAllNotificationsAsRead()
Mark all notifications as read globally or by tab.- Params:
options?: {tabId?: string} - Returns:
void - React Hook:
n/a - Full Documentation →
markNotificationAsReadById()
Mark a specific notification as read.- Params:
notificationId: string - Returns:
void - React Hook:
n/a - Full Documentation →
Notification Settings
enableSettings()
Enable or disable the settings feature for notifications.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableSettings()
Disable the settings feature for notifications.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableSettingsAtOrganizationLevel()
Enable organization-level notification settings. Settings apply to all documents in the organization instead of per-document.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableSettingsAtOrganizationLevel()
Disable organization-level notification settings. Settings revert to per-document configuration.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setSettingsInitialConfig()
Set the initial default configuration for notification settings.- Params:
NotificationInitialSettingsConfig[] - Returns:
void - React Hook:
n/a - Full Documentation →
muteAllNotifications()
Mute all notifications across all channels for the current user.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setSettings()
Update notification settings configuration for the current user.- Params:
NotificationSettingsConfig - Returns:
void - React Hook:
n/a - Full Documentation →
getSettings()
Get the current notification settings configuration for the user.- Params: none
- Returns:
Observable<NotificationSettingsConfig> - React Hook:
n/a - Full Documentation →
enableCurrentDocumentOnly()
Filters notifications to show only those from the current document.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableCurrentDocumentOnly()
Shows notifications from all documents, not just the current document.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Activity Logs
Data
getAllActivities()
Subscribe to the real-time activity log feed, optionally filtered by document, feature type, or action type.- Params:
config?:ActivitySubscribeConfig - Returns:
Observable<ActivityRecord[] | null> - React Hook:
useAllActivities(config?) - Full Documentation →
Actions
createActivity()
Create a custom activity log record for non-Velt events.- Params:
data:CreateActivityData—targetEntityIdis required only whenfeatureTypeis'custom'; it is optional forcomment,reaction,recorder, andcrdt. - Returns:
Promise<void> - React Hook:
useActivityUtils()(access viaactivityElement?.createActivity(data)) - Full Documentation →
Element Access
getActivityElement()
Get the ActivityElement instance from the Velt client.- Params: none
- Returns:
ActivityElement - React Hook:
n/a - Full Documentation →
React Hooks
useAllActivities()
React Hook to subscribe to the activity log feed with optional filtering.- Params:
config?:ActivitySubscribeConfig - Returns:
ActivityRecord[]| null - React Hook: Yes
- Full Documentation →
useActivityUtils()
React Hook to access ActivityElement utility methods such ascreateActivity().
- Params: none
- Returns:
ActivityElement | null - React Hook: Yes
- Full Documentation →
Recorder
downloadLatestVideo()
Downloads the latest version of a recording.- Params:
recorderId: string - Returns:
Promise<boolean> - React Hook:
n/a - Full Documentation →
enableRecordingCountdown()
Controls whether to display a countdown timer before a recording starts.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableRecordingTranscription()
Controls whether to enable AI transcription for recordings.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
fetchRecordings()
Fetches recording data.- Params: RecorderRequestQuery
- Returns:
Promise<GetRecordingDataResponse> - React Hook:
n/a - Full Documentation →
RecorderElement Methods
setMaxLength()
Sets the maximum recording duration in seconds.- Params:
value: number - Returns:
void - React Hook:
n/a - Full Documentation →
enablePictureInPicture()
Enables Picture-in-Picture mode for recordings.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disablePictureInPicture()
Disables Picture-in-Picture mode for recordings.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
openPictureInPicture()
Opens the Picture-in-Picture window for the current recording.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
exitPictureInPicture()
Exits the Picture-in-Picture window.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
requestScreenPermission()
Requests screen capture permissions for recording preview.- Params: none
- Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
enablePlaybackOnPreviewClick()
Enables click-to-play/pause functionality on recording preview thumbnails.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disablePlaybackOnPreviewClick()
Disables click-to-play/pause functionality on recording preview thumbnails.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
Event Subscription
on()
Subscribe to Recorder events.- Params:
RecorderEventType. Here is the list of events you can subscribe to. - Returns:
Observable<RecorderEventTypesMap[T]>. Here is the list of events object types you can expect to receive. - React Hook:
useRecorderEventCallback(RecorderEventType) - Full Documentation →
Inline Reactions
setCustomReactions()
Set custom reaction emojis for inline reactions.- Params:
customReactions: { [reactionId: string]: { url?: string, emoji?: string } } - Returns:
void - React Hook:
n/a - Full Documentation →
View Analytics
getUniqueViewsByUser()
Get unique views by user, optionally filtered by location.- Params:
locationId?: string - Returns:
Observable<ViewsByUser[]> - React Hook:
useUniqueViewsByUser() - Full Documentation →
getUniqueViewsByDate()
Get unique views by date, optionally filtered by location.- Params:
locationId?: string - Returns:
Observable<ViewsByDate[]> - React Hook:
useUniqueViewsByDate() - Full Documentation →
Live State Sync
getLiveStateData()
Retrieves live state data as an observable based on the provided ID.- Params:
liveStateDataId?: string - Returns:
Observable<any> - React Hook:
n/a - Full Documentation →
setLiveStateData()
Sets live state data for the provided ID and data.- Params:
liveStateDataId:stringliveStateData:anyconfig:SetLiveStateDataConfig
- Returns:
any - React Hook:
useSetLiveStateData() - Full Documentation →
fetchLiveStateData()
Fetches live state data as a Promise. Use this when you need to retrieve the current state once, rather than subscribing to ongoing changes.- Params:
request?:FetchLiveStateDataRequest - Optional. If not provided or if liveStateDataId is not specified, all live state data will be returned. - Returns:
Promise<T>- Generic type support allows you to specify the expected data type - React Hook:
n/a - Full Documentation →
Single Editor Mode
enableSingleEditorMode()
Enables the single editor mode with an optional configuration.- Params:
config?: SingleEditorConfig - Returns:
void - React Hook:
n/a - Full Documentation →
disableSingleEditorMode()
Disables the single editor mode.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
isUserEditor()
Checks if the current user is an editor. Returns an observable.- Params: none
- Returns:
Observable<UserEditorAccess | null> - React Hook:
n/a - Full Documentation →
getEditor()
Retrieves the current editor information.- Params: none
- Returns:
Observable<User | null> - React Hook:
n/a - Full Documentation →
setUserAsEditor()
Sets the current user as an editor.- Params: none
- Returns:
Promise<SetUserAsEditorResponse | void> - React Hook:
n/a - Full Documentation →
SetUserAsEditorResponse.error:
same_user_editor_current_tabsame_user_editor_different_tabanother_user_editor
resetUserAccess()
Resets the user access.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
singleEditorModeContainerIds()
Disables elements inside specific elements only when single editor mode is on.- Params:
elementIds: string[] - Returns:
void - React Hook:
n/a - Full Documentation →
enableAutoSyncState()
Enables the autosync state feature.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
requestEditorAccess()
Initiates a request for editor access.- Params: none
- Returns:
Observable<boolean | null> - React Hook:
n/a - Full Documentation →
isEditorAccessRequested()
Checks if editor access has been requested.- Params: none
- Returns:
Observable<{ requestStatus: string, requestedBy: User } | null> - React Hook:
n/a - Full Documentation →
acceptEditorAccessRequest()
Accepts an editor access request.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
rejectEditorAccessRequest()
Rejects an editor access request.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
cancelEditorAccessRequest()
Cancels an editor access request.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
editCurrentTab()
Edits the current tab.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
setEditorAccessTimeout()
Sets a timeout for editor access. (in milliseconds)- Params:
timeout: number - Returns:
void - React Hook:
n/a - Full Documentation →
enableEditorAccessTransferOnTimeOut()
Enables the transfer of editor access on timeout.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableDefaultSingleEditorUI()
Enables the default UI for single editor mode.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
enableHeartbeat()
Enables the heartbeat mechanism for Single Editor Mode presence detection. This feature is enabled by default when single editor mode is enabled.- Params:
void - Returns:
void - React Hook:
n/a - Full Documentation →
disableHeartbeat()
Disables the heartbeat mechanism for Single Editor Mode presence detection. Must be called before enabling single editor mode if you don’t want to use the heartbeat functionality.- Params:
void - Returns:
void - React Hook:
n/a - Full Documentation →
Cursors
setInactivityTime()
Set the time it takes for a user’s cursor to be marked as inactive.- Params:
milliseconds: number - Returns:
void - React Hook:
n/a - Full Documentation →
allowedElementIds()
Set specific element IDs where cursors should be shown.- Params:
elementIds: string[] - Returns:
void - React Hook:
n/a - Full Documentation →
onCursorUserChange()
Subscribe to cursor position changes for all users.- Params:
callback: (cursorUsers: CursorUser[]) => void - Returns:
void - React Hook:
n/a - Full Documentation →
Presence
updateUserPresence()
Send a lightweight heartbeat from your host app to Velt. Velt will use that as a fallback in rare edge cases if it fails to detect multi‑tab/device presence. Most apps don’t need this; use only if you see ambiguity in who’s the active editor.- Params:
userPresence: LiveStateSingleEditorExternalUserPresence - Returns:
void - React Hook:
n/a - Full Documentation → See types: LiveStateSingleEditorExternalUserPresence
- Params:
milliseconds: number - Returns:
void - React Hook:
n/a - Full Documentation →
enableSelf()
Include the current user in the list of presence users.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
on()
Subscribe to Presence events.- Params:
PresenceEventType. Here is the list of events you can subscribe to. - Returns:
Observable<PresenceEventTypesMap[T]>. Here is the list of events object types you can expect to receive. - React Hook:
usePresenceEventCallback(PresenceEventType) - Full Documentation →
onPresenceUserChange()
Subscribe to presence changes for all users.- Params:
callback: (presenceUsers: PresenceUser[]) => void - Returns:
void - React Hook:
n/a - Full Documentation →
onPresenceUserClick()
Handle click events on presence avatar circles.- Params:
callback: (user: User) => void - Returns:
void - React Hook:
n/a - Full Documentation →
getData()
Subscribe to presence data.- Params:
PresenceRequestQuery - Returns:
Observable<GetPresenceDataResponse> - React Hook:
usePresenceData() - Full Documentation →
addUser()
Programmatically add a custom user (e.g., AI agent, bot) to the presence list. SetlocalOnly: true to restrict the change to the current client without persisting to the database.
- Params:
{ user: Partial<PresenceUser>, localOnly?: boolean } - Returns:
void - React Hook:
n/a - Full Documentation →
removeUser()
Programmatically remove a custom user from the presence list. SetlocalOnly: true to restrict the removal to the current client.
- Params:
{ user: Partial<PresenceUser>, localOnly?: boolean } - Returns:
void - React Hook:
n/a - Full Documentation →
Follow Mode
enableFlockMode()
Enable Follow Me mode globally wherever Presence is shown.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
startFollowingUser()
Start following a specific user.- Params:
userId: string - Returns:
void - React Hook:
n/a - Full Documentation →
stopFollowingUser()
Stop following the current user.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
onNavigate()
Handle navigation events during Follow Me sessions.- Params:
callback: (pageInfo: PageInfo) => void - Returns:
void - React Hook:
n/a - Full Documentation →
Huddle
enableChat()
Enable the ephemeral chat feature in Huddle.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
enableFlockModeOnAvatarClick()
Enable Follow Me mode when clicking on a user’s avatar in Huddle.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
Live Selection
enableDefaultElementsTracking()
Enable automatic tracking of user presence on default element types (input, textarea, button, contenteditable).- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
enableUserIndicator()
Enable the user indicator (avatar/name label) that appears near selected elements.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
setUserIndicatorPosition()
Set the position of the user indicator globally.- Params:
position: 'start' | 'end' - Returns:
void - React Hook:
n/a - Full Documentation →
setUserIndicatorType()
Set the type of user indicator globally.- Params:
type: 'avatar' | 'label' - Returns:
void - React Hook:
n/a - Full Documentation →
getLiveSelectionData()
Get the live selection data for the current document.- Params:
none - Returns:
Observable<LiveSelectionData> - React Hook:
useLiveSelectionDataHandler() - Full Documentation →
setInactivityTime()
Set inactivity duration before hiding inactive selections.- Params:
milliseconds: number - Returns:
void - React Hook:
n/a - Full Documentation →
AI
Rewriter
enableRewriter()
Enable the rewriter.- Params:
n/a - Returns:
void - React Hook:
n/a - Full Documentation →
on()
Subscribe to Rewriter events. Supports'textSelected' to receive TextSelectedEvent whenever a user selects text in a Rewriter-enabled region.
- Params:
action: 'textSelected' - Returns:
Observable<TextSelectedEvent> - React Hook:
n/a - Full Documentation →
askAi()
Send a text-generation prompt to any AI model via Velt’s proxy. Model is resolved from the name prefix to the configured provider.- Params:
RewriterAskAiRequest - Returns:
Promise<RewriterAskAiResponse> - React Hook:
n/a - Full Documentation →
replaceText()
Replace the DOM text identified by aTextSelectedEvent with new text.
- Params:
RewriterReplaceTextRequest - Returns:
Promise<RewriterReplaceTextResponse> - React Hook:
n/a - Full Documentation →
addComment()
Create a comment annotation anchored to the text range from aTextSelectedEvent.
- Params:
RewriterAddCommentRequest - Returns:
Promise<RewriterAddCommentResponse> - React Hook:
n/a - Full Documentation →
enableDefaultUI()
Show the built-in Velt rewriter toolbar on text selection. This is the default state.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
disableDefaultUI()
Hide the built-in Velt rewriter toolbar; custom UI only. Rewriter events remain active.- Params: none
- Returns:
void - React Hook:
n/a - Full Documentation →
ReactFlow
useVeltReactFlowCrdtExtension()
Provides real-time collaborative ReactFlow editor functionality with Yjs and Velt SDK synchronization.- Signature: useVeltReactFlowCrdtExtension(config: VeltReactFlowCrdtExtensionConfig)
- Params: VeltReactFlowCrdtExtensionConfig
- Returns: VeltReactFlowCrdtExtensionResponse
- React Hook:
useVeltReactFlowCrdtExtension() - Full Documentation →
veltReactFlowStore
Create and initialize a collaborative React Flow Zustand store.- Params: VeltReactFlowStoreConfig
- React Hook:
n/a - Full Documentation →
onNodesChange
CRDT-aware handler to apply node changes (add/update/remove) that sync across collaborators.- Params: NodeChange[]
- Returns:
void - React Hook:
n/a - Full Documentation →
onEdgesChange
CRDT-aware handler to apply edge changes (add/update/remove) that sync across collaborators.- Params: EdgeChange[]
- Returns:
void - React Hook:
n/a - Full Documentation →
onConnect
CRDT-aware connect handler compatible with React Flow’sonConnect prop.
- Params: Connection
- Returns:
void - React Hook:
n/a - Full Documentation →
setNodes
Imperative setter for nodes (useful for non-event updates). Synced via the store.- Params: Node[] | ((prev: Node[]) => Node[])
- Returns:
void - React Hook:
n/a - Full Documentation →
setEdges
Imperative setter for edges (useful for non-event updates). Synced via the store.- Params: Edge[] | ((prev: Edge[]) => Edge[])
- Returns:
void - React Hook:
n/a - Full Documentation →
Encryption
setEncryptionProvider(encryptionProvider)
Register a custom encrypt/decrypt provider used by CRDT features.- Params:
VeltEncryptionProvider - Returns:
void - Full Documentation →
CodeMirror
v2 API
useCollaboration()
Primary React hook for collaborative CodeMirror editing. Creates a CollaborationManager, initializes the CRDT store, and returns collaboration primitives for CodeMirror integration.- Signature:
useCollaboration(config: UseCollaborationConfig) - Params: UseCollaborationConfig
- Returns: UseCollaborationReturn
- React Hook:
useCollaboration() - Full Documentation →
createCollaboration()
Non-React factory function that creates a CollaborationManager for CodeMirror, initializes the CRDT store, and returns a ready-to-use instance.- Signature:
createCollaboration(config: CollaborationConfig): Promise<CollaborationManager> - Params: CollaborationConfig
- Returns:
Promise<CollaborationManager> - React Hook:
n/a - Full Documentation →
CollaborationManager Methods
TheCollaborationManager is returned by useCollaboration (React) via the manager property, or directly by createCollaboration (non-React). All methods below work in both contexts.
manager.getCollaborationPrimitives()
Returns the Yjs primitives (ytext, awareness, undoManager, doc) needed to call yCollab(). Non-React only — the React hook returns primitives directly.
- Params:
none - Returns:
CollaborationPrimitives - Full Documentation →
manager.onStatusChange()
Subscribe to connection status changes. Non-React only — the React hook returnsstatus directly.
- Params:
callback: (status: SyncStatus) => void - Returns:
Unsubscribe - Full Documentation →
manager.onSynced()
Subscribe to sync state changes. Non-React only — the React hook returnsisSynced directly.
- Params:
callback: (synced: boolean) => void - Returns:
Unsubscribe - Full Documentation →
manager.initialized
Whether initialization has completed.- Returns:
boolean - Full Documentation →
manager.synced
Whether initial sync with the backend has completed.- Returns:
boolean - Full Documentation →
manager.status
Current connection status.- Returns:
SyncStatus - Full Documentation →
manager.saveVersion()
Save a named snapshot of the document state. Returns the version ID.- Params:
name: string - Returns:
Promise<string> - Full Documentation →
manager.getVersions()
List all saved versions.- Params:
none - Returns:
Promise<Version[]> - Full Documentation →
manager.restoreVersion()
Restore to a saved version. Returnstrue on success.
- Params:
versionId: string - Returns:
Promise<boolean> - Full Documentation →
manager.setStateFromVersion()
Apply a Version object’s state locally to the current document.- Params:
version: Version - Returns:
Promise<void> - Full Documentation →
manager.getDoc()
Get the underlying Yjs document.- Params:
none - Returns:
Y.Doc - Full Documentation →
manager.getText() / manager.getYText()
Get the Y.Text bound to the document content. React usesgetText(), non-React uses getYText().
- Params:
none - Returns:
Y.Text | null - Full Documentation →
manager.getProvider()
Get the sync provider.- Params:
none - Returns:
SyncProvider - Full Documentation →
manager.getAwareness()
Get the Yjs Awareness instance.- Params:
none - Returns:
Awareness - Full Documentation →
manager.getStore()
Get the core CRDT Store.- Params:
none - Returns:
Store<string> - Full Documentation →
manager.getUndoManager()
Get the Y.UndoManager for undo/redo operations.- Params:
none - Returns:
Y.UndoManager | null - Full Documentation →
manager.destroy()
Full cleanup. Automatic on editor destroy or component unmount. Safe to call multiple times.- Params:
none - Returns:
void - Full Documentation →
v1 API (deprecated)
useVeltCodeMirrorCrdtExtension() (deprecated)
Legacy React hook for collaborative CodeMirror editing. Internally delegates touseCollaboration via a compatibility wrapper.
- Signature:
useVeltCodeMirrorCrdtExtension(config: VeltCodeMirrorCrdtExtensionConfig) - Params: VeltCodeMirrorCrdtExtensionConfig
- Returns: VeltCodeMirrorCrdtExtensionResponse
- React Hook:
useVeltCodeMirrorCrdtExtension() - Full Documentation →
createVeltCodeMirrorCrdtExtension() (deprecated)
Legacy non-React function for collaborative CodeMirror editing using a callback-based pattern.- Signature:
createVeltCodeMirrorCrdtExtension(config: VeltCodeMirrorStoreConfig, onReady: callback): () => void - Params: VeltCodeMirrorStoreConfig
- Returns:
() => void(cleanup function) - React Hook:
n/a - Full Documentation →
createVeltCodeMirrorStore() (deprecated)
Legacy factory to create and initialize a collaborative CodeMirror store instance.- Params:
config: VeltCodeMirrorStoreConfig - Returns:
Promise<VeltCodeMirrorStore | null> - React Hook:
n/a - Full Documentation →
store.getStore() (deprecated)
Get the underlying Store that manages state and synchronization.- Params:
none - Returns:
Store<string> - React Hook:
n/a - Full Documentation →
store.getYDoc() (deprecated)
Access the Yjs document used for collaborative editing.- Params:
none - Returns:
Y.Doc - React Hook:
n/a - Full Documentation →
store.getYText() (deprecated)
Get the shared Y.Text bound to the current CodeMirror document.- Params:
none - Returns:
Y.Text | null - React Hook:
n/a - Full Documentation →
store.getAwareness() (deprecated)
Access the Yjs Awareness instance associated with the store.- Params:
none - Returns:
Awareness - React Hook:
n/a - Full Documentation →
store.getUndoManager() (deprecated)
Access the Yjs UndoManager for collaborative undo/redo.- Params:
none - Returns:
Y.UndoManager - React Hook:
n/a - Full Documentation →
store.destroy() (deprecated)
Clean up listeners and release resources.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
BlockNote
v2 API
useCollaboration()
Primary React hook for collaborative BlockNote editing. Creates a CollaborationManager, initializes the CRDT store, and returns a BlockNoteCollaborationConfig with cursor support.- Signature:
useCollaboration(config: UseCollaborationConfig) - Params: UseCollaborationConfig
- Returns: UseCollaborationReturn
- React Hook:
useCollaboration() - Full Documentation →
manager.getCollaborationConfig()
Get the BlockNote collaboration config.- Params:
none - Returns:
BlockNoteCollaborationConfig | null - React Hook:
n/a(accessed viamanagerfromuseCollaboration) - Full Documentation →
manager.saveVersion()
Save a named snapshot of the document state.- Params:
name: string - Returns:
Promise<string>(version ID, or empty string on failure) - React Hook:
n/a(also available as first-classsaveVersionfromuseCollaboration) - Full Documentation →
manager.getVersions()
List all saved versions for this document.- Params:
none - Returns:
Promise<Version[]>(empty array on failure) - React Hook:
n/a(also available as first-classgetVersionsfromuseCollaboration) - Full Documentation →
manager.restoreVersion()
Restore the document to a previously saved version. The restored state is pushed to all connected clients.- Params:
versionId: string - Returns:
Promise<boolean>(trueon success,falseon failure) - React Hook:
n/a(also available as first-classrestoreVersionfromuseCollaboration) - Full Documentation →
manager.setStateFromVersion()
Apply a Version object’s state locally to the current document.- Params:
version: Version - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
manager.getDoc()
Get the underlying Yjs document.- Params:
none - Returns:
Y.Doc | null - React Hook:
n/a(accessed viamanagerfromuseCollaboration) - Full Documentation →
manager.getXmlFragment()
Get the XmlFragment bound to BlockNote’s document-store key.- Params:
none - Returns:
Y.XmlFragment | null - React Hook:
n/a(accessed viamanagerfromuseCollaboration) - Full Documentation →
manager.getProvider()
Get the sync provider.- Params:
none - Returns:
SyncProvider | null - React Hook:
n/a(accessed viamanagerfromuseCollaboration) - Full Documentation →
manager.getAwareness()
Get the Yjs Awareness instance.- Params:
none - Returns:
Awareness | null - React Hook:
n/a(accessed viamanagerfromuseCollaboration) - Full Documentation →
manager.getStore()
Get the core CRDT Store.- Params:
none - Returns:
Store<string> | null - React Hook:
n/a(accessed viamanagerfromuseCollaboration) - Full Documentation →
manager.destroy()
Full cleanup of the CollaborationManager (automatic on unmount).- Params:
none - Returns:
void - React Hook:
n/a(accessed viamanagerfromuseCollaboration) - Full Documentation →
Non-React v2 API
createCollaboration()
Factory function that creates a CollaborationManager for BlockNote, initializes the CRDT store, and returns a ready-to-use instance.- Signature:
createCollaboration(config: CollaborationConfig): Promise<CollaborationManager> - Params: CollaborationConfig
- Returns:
Promise<CollaborationManager> - React Hook:
n/a - Full Documentation →
manager.getCollaborationConfig()
Returns the BlockNote collaboration config. Pass toBlockNoteEditor.create({ collaboration: ... }).
- Params:
options?: { showCursorLabels?: 'activity' | 'always' } - Returns:
BlockNoteCollaborationConfig | null - React Hook:
n/a(React hook returnscollaborationConfigdirectly) - Full Documentation →
manager.onStatusChange()
Subscribe to connection status changes.- Params:
callback: (status: SyncStatus) => void - Returns:
Unsubscribe - React Hook:
n/a(React hook returnsstatusdirectly) - Full Documentation →
manager.onSynced()
Subscribe to sync state changes.- Params:
callback: (synced: boolean) => void - Returns:
Unsubscribe - React Hook:
n/a(React hook returnsisSynceddirectly) - Full Documentation →
manager.initialized
Whether initialization has completed.- Returns:
boolean - React Hook:
n/a(React hook returnsisLoading) - Full Documentation →
manager.synced
Whether initial sync with the backend has completed.- Returns:
boolean - React Hook:
n/a(React hook returnsisSynced) - Full Documentation →
manager.status
Current connection status.- Returns:
SyncStatus - React Hook:
n/a(React hook returnsstatus) - Full Documentation →
v1 API (deprecated)
useVeltBlockNoteCrdtExtension() (deprecated)
Legacy React hook for collaborative BlockNote editing. Internally delegates touseCollaboration via a compatibility wrapper.
- Signature:
useVeltBlockNoteCrdtExtension(config: VeltBlockNoteCrdtExtensionConfig) - Params: VeltBlockNoteCrdtExtensionConfig
- Returns: VeltBlockNoteCrdtExtensionResponse
- React Hook:
useVeltBlockNoteCrdtExtension() - Full Documentation →
createVeltBlockNoteStore() (deprecated)
Create and initialize a legacy collaborative BlockNote store instance.- Params:
VeltBlockNoteStoreConfig - Returns:
VeltBlockNoteStore | null - React Hook:
n/a
store.getStore() (deprecated)
Access the underlying CRDT store.- Params:
none - Returns:
Store - React Hook:
n/a
store.getYDoc() (deprecated)
Accessor for the underlying Yjs document.- Params:
none - Returns:
Y.Doc - React Hook:
n/a
store.getYXml() (deprecated)
Get the Y.XmlFragment representing the BlockNote document tree.- Params:
none - Returns:
Y.XmlFragment | null - React Hook:
n/a
store.destroy() (deprecated)
Tear down the store and clean listeners/resources.- Params:
none - Returns:
void - React Hook:
n/a
Tiptap
React v2 API
useCollaboration()
Primary React hook for collaborative TipTap editing. Creates a CollaborationManager, initializes the CRDT store, and returns a TipTap Extension with cursor support.- Signature:
useCollaboration(config: UseCollaborationConfig) - Params: UseCollaborationConfig
- Returns: UseCollaborationReturn
- React Hook:
useCollaboration() - Full Documentation →
Non-React v2 API
createCollaboration()
Factory function that creates a CollaborationManager, initializes the CRDT store, and returns a ready-to-use instance.- Signature:
createCollaboration(config: CollaborationConfig): Promise<CollaborationManager> - Params: CollaborationConfig
- Returns:
Promise<CollaborationManager> - React Hook:
n/a - Full Documentation →
manager.createExtension()
Returns a single TipTap Extension that bundles Yjs document binding and remote cursor rendering. Non-React only — the React hook returns the extension directly.- Params:
none - Returns:
Extension - React Hook:
n/a(React hook returns extension directly) - Full Documentation →
CollaborationManager Methods
Shared methods available on theCollaborationManager instance. In React, access via manager from the useCollaboration hook. In non-React, the manager is returned by createCollaboration().
manager.onStatusChange()
Subscribe to connection status changes.- Params:
callback: (status: SyncStatus) => void - Returns:
Unsubscribe - React Hook:
n/a(React hook returnsstatusdirectly) - Full Documentation →
manager.onSynced()
Subscribe to sync state changes.- Params:
callback: (synced: boolean) => void - Returns:
Unsubscribe - React Hook:
n/a(React hook returnsisSynceddirectly) - Full Documentation →
manager.initialized
Whether initialization has completed.- Returns:
boolean - React Hook:
n/a(React hook returnsisLoading) - Full Documentation →
manager.synced
Whether initial sync with the backend has completed.- Returns:
boolean - React Hook:
n/a(React hook returnsisSynced) - Full Documentation →
manager.status
Current connection status.- Returns:
SyncStatus - React Hook:
n/a(React hook returnsstatus) - Full Documentation →
manager.saveVersion()
Save a named snapshot of the document state. Returns the version ID.- Params:
name: string - Returns:
Promise<string> - Full Documentation →
manager.getVersions()
List all saved versions.- Params:
none - Returns:
Promise<Version[]> - Full Documentation →
manager.restoreVersion()
Restore to a saved version. Returnstrue on success.
- Params:
versionId: string - Returns:
Promise<boolean> - Full Documentation →
manager.setStateFromVersion()
Apply a Version object’s state locally to the current document.- Params:
version: Version - Returns:
Promise<void> - Full Documentation →
manager.getDoc()
Get the underlying Yjs document.- Params:
none - Returns:
Y.Doc - Full Documentation →
manager.getXmlFragment()
Get the XmlFragment bound to TipTap content.- Params:
none - Returns:
Y.XmlFragment | null - Full Documentation →
manager.getProvider()
Get the sync provider.- Params:
none - Returns:
SyncProvider - Full Documentation →
manager.getAwareness()
Get the Yjs Awareness instance.- Params:
none - Returns:
Awareness - Full Documentation →
manager.getStore()
Get the core CRDT Store from the CollaborationManager.- Params:
none - Returns:
Store<string> - Full Documentation →
manager.destroy()
Full cleanup of the CollaborationManager (automatic on unmount).- Params:
none - Returns:
void - Full Documentation →
v1 API (deprecated)
useVeltTiptapCrdtExtension() (deprecated)
Legacy React hook for collaborative Tiptap editing. Internally delegates touseCollaboration via a compatibility wrapper.
- Signature:
useVeltTiptapCrdtExtension(config: VeltTiptapCrdtExtensionConfig) - Params: VeltTiptapCrdtExtensionConfig
- Returns: VeltTiptapCrdtExtensionResponse
- React Hook:
useVeltTiptapCrdtExtension() - Full Documentation →
createVeltTiptapCrdtExtension() (deprecated)
Legacy non-React function for collaborative Tiptap editing using a callback-based pattern.- Signature:
createVeltTiptapCrdtExtension(config: VeltTipTapStoreConfig, onReady: callback): () => void - Params: VeltTipTapStoreConfig
- Returns:
() => void(cleanup function) - React Hook:
n/a - Full Documentation →
createVeltTipTapStore() (deprecated)
Legacy factory to create and initialize a collaborative Tiptap store instance.- Params:
config: VeltTipTapStoreConfig - Returns:
Promise<VeltTipTapStore | null> - React Hook:
n/a - Full Documentation →
store.getCollabExtension() (deprecated)
Get the Tiptap collaboration extension bound to the current Yjs document.- Params:
none - Returns:
Extension - React Hook:
n/a - Full Documentation →
store.getStore() (deprecated)
Access the underlying CRDT store managing document state.- Params:
none - Returns:
Store<string> - React Hook:
n/a - Full Documentation →
store.destroy() (deprecated)
Tear down the store and clean up listeners/resources.- Params:
none - Returns:
void - React Hook:
n/a - Full Documentation →
store.getYDoc() (deprecated)
Accessor for the underlying Yjs document.- Params:
none - Returns:
Y.Doc - React Hook:
n/a - Full Documentation →
store.getYXml() (deprecated)
Accessor for the XML fragment in the Yjs document.- Params:
none - Returns:
Y.XmlFragment | null - React Hook:
n/a - Full Documentation →
store.setStateFromVersion() (deprecated)
Restores the document to a specific version state.- Params:
version: Version - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
Core
Client
initConfig()
Set up initial configurations for the Velt SDK.- Params:
apiKey: string, config?:VeltProviderConfig - Returns:
void - React Hook:
n/a
getVeltInitState()
Subscribe to detect whether Velt is initialized.- Params:
void - Returns:
Observable<boolean> - React Hook:
useVeltInitState()
get Velt Client
Access the core Velt client instance to call SDK APIs and subscribe to core events.- Signature:
- React:
const { client } = useVeltClient() - Other frameworks:
const client = await initVelt(apiKey) - HTML:
await Velt.init(apiKey)then useVelt
- React:
- Params:
noneHere is the list of events you can subscribe to. - Returns:
VeltHere is the list of events object types you can expect to receive. - React Hook:
useVeltClient() - See event payloads: Core data model
- Overview: Client Event Subscriptions
getMetadata()
Get the currently set organization, document and location objects.- Params: none
- Returns:
Promise<VeltEventMetadata> - React Hook:
n/a
getUserPermissions()
Get the current user’s access roles across organization, folder, and document scopes.- Params: GetUserPermissionsRequest
- Returns:
Promise<GetUserPermissionsResponse> - React Hook:
n/a - Full Documentation →
errorCode from the UserPermissionAccessRoleResult enum:
does_not_exist: Resource not foundpermission_denied: User lacks access to the resourcesomething_went_wrong: Unexpected error
getCurrentUserPermissions()
Subscribe to current user permissions updates. Returns real-time permission changes for the authenticated user across organization, folder, and document scopes. Useful for debugging and developer tools integration.- Params:
void - Returns:
Observable<GetUserPermissionsResponse> - React Hook:
n/a - Full Documentation →
getHeartbeat()
Subscribe to user-specific heartbeat data. Retrieve heartbeat data for the current user or specify a userId to monitor heartbeats for any user.- Params:
HeartbeatConfig(optional) - Returns:
Observable<GetHeartbeatResponse> - React Hook:
useHeartbeat()
enableFirestorePersistentCache()
Enable Firestore offline persistence and multi-tab synchronization. Call beforeidentify() to activate offline reads.
- Params:
config?: { ha?: boolean } - Returns:
void - React Hook:
n/a
disableFirestorePersistentCache()
Disable Firestore offline persistence and revert to the default non-persistent mode.- Params:
config?: { ha?: boolean } - Returns:
void - React Hook:
n/a
Authentication
identify()
Authenticate the client’s user with the Velt SDK. When called with organization change, previous document is set unlesssetDocuments() is explicitly called.
- Params:
user: User, userOptions?: UserOptions - Returns:
Promise<unknown> - React Hook:
useIdentify()
setPermissionProvider()
Configure Permission Provider for real-time access validation. Supports a client-side dev resolver for local testing via thedev, endpointConfig, resolvePermissions, and resolveTimeout fields on VeltPermissionProvider.
- Params:
VeltPermissionProvider - Returns:
void - React Hook:
n/a - Full Documentation →
signOutUser()
To sign out a user.- Params:
void - Returns:
any - React Hook:
n/a
getUser()
Get the current authenticated user in Velt.- Params:
void - Returns:
User - React Hook:
n/a
getCurrentUser()
Subscribe to changes in the current user object.- Params:
void - Returns:
Observable<User | null> - React Hook:
useCurrentUser() - Full Documentation →
Collaboration
v2 React API
useStore()
React hook that creates and manages a CRDT store with reactive value, status, and version management.- Params: UseStoreConfig
- Returns: UseStoreReturn
- React Hook:
useStore() - Full Documentation →
useAwareness()
React hook for reactive Yjs Awareness state (remote peers and local state).- Params:
store: Store<any> | null - Returns: UseAwarenessReturn
- React Hook:
useAwareness() - Full Documentation →
Non-React API
createVeltStore()
Create and initialize a collaborative CRDT store instance.- Params:
StoreConfig<T> - Returns:
Promise<Store<T> | null> - React Hook:
n/a - Full Documentation →
Store Methods
update()
Update the store value.- Params:
newValue: T - Returns:
void - Full Documentation →
getValue()
Get the current store value.- Params:
none - Returns:
T - Full Documentation →
subscribe()
Subscribe to store updates.- Params:
(newValue: T) => void - Returns:
() => void(unsubscribe) - Full Documentation →
getDoc()
Get the underlying Yjs document.- Params:
none - Returns:
Y.Doc - Full Documentation →
getProvider()
Get the provider instance for the store.- Params:
none - Returns:
Provider - Full Documentation →
getText()
Get the Y.Text instance if store type is ‘text’.- Params:
none - Returns:
Y.Text | null - Full Documentation →
getXml()
Get the Y.XmlFragment instance if store type is ‘xml’.- Params:
none - Returns:
Y.XmlFragment | null - Full Documentation →
getAwareness()
Get the Awareness instance for cursor/presence tracking.- Params:
none - Returns:
Awareness - Full Documentation →
destroy()
Destroy the store, cleaning up resources and listeners.- Params:
none - Returns:
void - Full Documentation →
Version Methods
saveVersion()
Save the current state as a named version.- Params:
versionName: string - Returns:
Promise<string> - Full Documentation →
getVersions()
Retrieve all saved versions.- Params:
none - Returns:
Promise<Version[]> - Full Documentation →
getVersionById()
Fetch a specific version by ID.- Params:
versionId: string - Returns:
Promise<Version | null> - Full Documentation →
restoreVersion()
Restore the store to a specific version by ID.- Params:
versionId: string - Returns:
Promise<boolean> - Full Documentation →
setStateFromVersion()
Restore the state from a given version.- Params:
version: Version - Returns:
Promise<void> - Full Documentation →
v1 React API (deprecated)
useVeltCrdtStore() (deprecated)
Legacy React Hook to create and sync a CRDT store. Internally delegates touseStore via a compatibility wrapper.
- Params:
VeltCrdtStoreConfig<T> - Returns:
Store<T> - React Hook:
useVeltCrdtStore() - Full Documentation →
enableWebhook()
Enable webhook notifications for CRDT data changes.- Params:
none - Returns:
void - React Hook:
crdtUtils.enableWebhook() - Full Documentation →
disableWebhook()
Disable webhook notifications for CRDT data changes.- Params:
none - Returns:
void - React Hook:
crdtUtils.disableWebhook() - Full Documentation →
setWebhookDebounceTime()
Configure webhook debounce interval (minimum 5000ms).- Params:
debounceTime: number - Returns:
void - React Hook:
crdtUtils.setWebhookDebounceTime() - Full Documentation →
setActivityDebounceTime()
Set how long CRDT editor keystrokes are batched before a single activity log record is flushed. Default: 10 minutes. Minimum: 10 seconds (10,000 ms).- Params:
time: number(milliseconds) - Returns:
void - React Hook:
crdtUtils.setActivityDebounceTime() - Full Documentation →
getCrdtElement()
Get the CRDT element instance from the client.- Params:
none - Returns:
CrdtElement - React Hook:
n/a - Full Documentation →
Message Stream
pushMessage()
Push a raw Yjs message into the unified message stream for a document.- Params:
CrdtPushMessageQuery - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
onMessage()
Subscribe to incoming messages on the unified message stream. Returns an unsubscribe function.- Params:
CrdtOnMessageQuery - Returns:
() => void - React Hook:
n/a - Full Documentation →
getMessages()
Retrieve historical messages from the unified message stream.- Params:
CrdtGetMessagesQuery - Returns:
Promise<CrdtMessageData[]> - React Hook:
n/a - Full Documentation →
getSnapshot()
Retrieve the latest CRDT state snapshot for a document.- Params:
CrdtGetSnapshotQuery - Returns:
Promise<CrdtSnapshotData | null> - React Hook:
n/a - Full Documentation →
saveSnapshot()
Persist a CRDT state snapshot for a document.- Params:
CrdtSaveSnapshotQuery - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
pruneMessages()
Delete historical messages older than a given timestamp from the message stream.- Params:
CrdtPruneMessagesQuery - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
useCrdtUtils()
React Hook to access CRDT utility methods.- Params:
none - Returns:
CrdtUtils - React Hook:
Yes - Full Documentation →
useCrdtEventCallback()
React Hook to subscribe to CRDT events.- Params:
eventName: 'updateData' - Returns:
CrdtUpdateDataEvent| null - React Hook:
Yes - Full Documentation →
Debug Info
fetchDebugInfo()
Retrieve debug information about the current Velt SDK state as a one-time fetch. Returns a Promise that resolves with comprehensive debug data including SDK version, API key, and server/client state metadata.- Params:
none - Returns:
Promise<VeltDebugInfo> - React Hook:
n/a - Full Documentation →
getDebugInfo()
Subscribe to debug information updates about the current Velt SDK state. Returns an Observable that emits debug data whenever the SDK state changes.- Params:
none - Returns:
Observable<VeltDebugInfo> - React Hook:
n/a - Full Documentation →
Folders
fetchFolders()
Fetch folder metadata and subfolders by organizationId, folderId with pagination.- Params:
fetchFoldersRequest: FetchFoldersRequest - Returns:
Observable<FetchFoldersResponse> - React Hook:
n/a - Full Documentation →
Documents
setDocuments()
Initialize and subscribe to multiple Documents at once.- Params:
documents: Document[]options?: SetDocumentsRequestOptions
- Returns:
Promise<void> - React Hook:
useSetDocuments() - Full Documentation →
Behavior Update: This method now filters out documents the user doesn’t have access to instead of failing the entire operation. When using the
allDocuments flag with a folder, only the first 50 documents are retrieved, and any inaccessible documents are automatically filtered out.setDocument()
Initialize and subscribe to a single Document.- Params:
documentId: stringmetadata?: DocumentMetadata
- Returns:
Promise<void> - React Hook:
useSetDocument() - Full Documentation →
setRootDocument()
Set a different document as the root document when multiple documents are active.- Params:
document:Document - Returns:
Promise<void> - React Hook:
n/a
unsetDocuments()
Use this to unsubscribe from all documents at once.- Params:
void - Returns:
void - React Hook:
useUnsetDocuments() - Full Documentation →
fetchDocuments()
Fetch document metadata byorganizationId, folderId, or specific documentIds. Supports pagination.
- Params: FetchDocumentsRequest
- Returns:
Promise<FetchDocumentsResponse> - React Hook:
n/a - Full Documentation →
updateDocuments()
Update document metadata by organizationId, folderId or documentIds.- Params:
UpdateDocumentsRequest<T = unknown> - Returns:
Promise<void> - React Hook:
n/a - Full Documentation →
Page Info
setPageInfo()
Set custom page info (URL, title, path, etc.) used for all newly created data — comments, reactions, recordings, presence, cursors. Existing saved data is not affected.- Params:
pageInfo: PageInfooptions?: Object:documentId?: string — reserved for a future per-document scope; only global page info ships in this release
- Returns:
void - React Hook:
useSetPageInfo() - Full Documentation →
clearPageInfo()
Clear custom page info and revert to the SDK’s automatic browser-derived page info for newly created data.- Params:
options?: Object:documentId?: string — reserved for a future per-document scope; only global page info ships in this release
- Returns:
void - React Hook:
useClearPageInfo() - Full Documentation →
Location
setLocation()
Set the current location context. Used to define specific areas within a document.- Params:
location: Location, isAdditional?: booleanlocation: Location object with:id?: Unique string or numeric identifier. Optional whenlocationNameis provided.locationName?: Non-empty display name that identifies the location whenidis omitted.version?: Optional version object with:id: Version identifiername: Version display name
- Additional custom key/value pairs
isAdditional?: Boolean to add additional locationsfalse(default): Set this as the root locationtrue: Add as additional location
- Returns:
Promise<void> - React Hook:
useSetLocation() - Full Documentation →
setLocations()
Initialize and/or append multiple locations at once.- Params:
locations: Location[]options?: SetLocationsRequestOptions
- Returns:
Promise<void> - React Hook:
n/a
setRootLocation()
Set a different location as the root location when multiple locations are active.- Params:
location:Location - Returns:
Promise<void> - React Hook:
n/a
removeLocations()
Remove multiple locations.- Params:
...locations:Location[] - Returns:
void - React Hook:
n/a
unsetLocationsIds()
Unset locations by ids or all of them if you don’t specify any parameters.- Params:
ids?: string[]- If no ids provided, removes all locations
- If ids provided, removes that specific location
- Returns:
void - React Hook:
n/a - Full Documentation →
Event Subscription
on()
Subscribe to Velt core events- Params:
eventType: string. Here is the list of events you can subscribe to. - Returns:
Observable<VeltEventTypesMap[T]>. It will return one of the objects from here - React Hook:
useVeltEventCallback()
Self Hosting
setDataProviders()
Set the data providers for self hosting data.- Params:
VeltDataProvider - Returns:
void - React Hook:
n/a - Full Documentation →
setAnonymousUserDataProvider()
Register a provider to resolve email → userId mappings for anonymous users tagged by email in comments.- Params:
AnonymousUserDataProvider - Returns:
void - React Hook:
n/a - Full Documentation →
UI
setUiState()
Set custom state data that can be used in Velt wireframes, Velt if and Velt data components.- Params:
Record<string, any>- Object containing key-value pairs of custom state data
- Returns:
void - React Hook:
n/a
getUiState()
Get the custom UI state data.- Params:
void - Returns:
Observable<Record<string, any>>- Observable that emits the current UI state object
- React Hook:
n/a
injectCustomCss()
To inject custom CSS within Components with Shadow DOM enabled.- Params:
customCss: CustomCss - Returns:
void - React Hook:
n/a
removeVeltContent()
To remove Velt specific content from provided html content. This is useful when using Velt on a text editor or editable element.- Params:
htmlContent: string - Returns:
string - React Hook:
n/a
resetVeltButtonState()
Reset the state of Velt Button components.- Params: (optional) VeltResetButtonStateConfig
- Returns:
void - React Hook:
n/a - Full Documentation →
Feature Utilities
getPresenceElement()
Get the Presence Element Object to access the raw presence data.- Params:
void - Returns:
PresenceElement - React Hook:
n/a
getCursorElement()
Get the Cursor Element Object to access the raw cursor data.- Params:
void - Returns:
CursorElement - React Hook:
n/a
getCommentElement()
Get the Comment Element Object to access the raw comment data.- Params:
void - Returns:
CommentElement - React Hook:
useCommentUtils()
getSelectionElement()
Get the Selection Object to enable/disable the feature.- Params:
void - Returns:
SelectionElement - React Hook:
n/a
getRecorderElement()
Get the Recorder Object.- Params:
void - Returns:
RecorderElement - React Hook:
n/a
getContactElement()
Get the Contact Object.- Params:
void - Returns:
ContactElement - React Hook:
n/a
getRewriterElement()
Get the Rewriter Object.- Params:
void - Returns:
RewriterElement - React Hook:
n/a
getLiveStateSyncElement()
Get the LiveStateSync Object.- Params:
void - Returns:
LiveStateSyncElement - React Hook:
n/a
getArrowElement()
Get the Arrow Object.- Params:
void - Returns:
ArrowElement - React Hook:
n/a
getSuggestionElement()
Get the singletonSuggestionElement instance. Repeat calls return the same object.
- Params:
void - Returns:
SuggestionElement - React Hook:
useSuggestionUtils() - Full Documentation →
Feature Gating
isUserAllowed$()
To check if user is allowed in provided document or not.- Params:
void - Returns:
Observable<boolean> - React Hook:
n/a
disableFeatures()
Provide a list of features to disable. Provide an empty array to enable all the features.- Params:
features: Array<FeatureType> - Returns:
void - React Hook:
n/a
isPlanExpired$()
To check if plan is expired or not.- Params:
void - Returns:
Observable<boolean> - React Hook:
n/a
Localization
setLanguage()
To set the language.- Params:
language: string - Returns:
void - React Hook:
n/a
setTranslations()
To set the translations for the language.- Params:
language: string, translations: { [key: string]: string } - Returns:
void - React Hook:
n/a
enableAutoTranslation()
To enable automatic translation of text in Velt Components based on User’s language preference.- Params:
void - Returns:
void - React Hook:
n/a
DOM Control
setScrollableElementsIds()
Tell us about the scrollable document ids to keep track on its scroll changes.- Params:
ids: string[] - Returns:
void - React Hook:
n/a
removeScrollableElementsIds()
To remove document params from a User.- Params:
void - Returns:
void - React Hook:
n/a
Suggestions
Methods on theSuggestionElement singleton returned by client.getSuggestionElement(). Tag DOM targets with data-velt-suggestion-target="<targetId>".
Mode Control
enableSuggestionMode()
Turn on suggesting mode; users can propose changes to registered targets.- Params:
config?: EnableSuggestionModeConfig(optional) - Returns:
void - React Hook:
useEnableSuggestionMode() - Full Documentation →
disableSuggestionMode()
Turn off suggesting mode; targets revert to normal edit behavior.- Params: none
- Returns:
void - React Hook:
useDisableSuggestionMode() - Full Documentation →
isSuggestionModeEnabled()
Synchronously check whether suggestion mode is currently active.- Params: none
- Returns:
boolean - React Hook:
useSuggestionModeState() - Full Documentation →
isSuggestionModeEnabled$()
Reactively observe suggestion mode state changes.- Params: none
- Returns:
Observable<boolean> - React Hook:
useSuggestionModeState() - Full Documentation →
Target Management
registerTarget()
Associate a getter function with a target ID so the SDK can snapshot complex (non-primitive) values. Remove the registration withunregisterTarget().
- Params:
config: RegisterTargetConfig<T> - Returns:
void - React Hook:
useRegisterTarget() - Full Documentation →
unregisterTarget()
Remove a previously registered target and clean up its subscription.- Params:
targetId: string - Returns:
void - React Hook:
useUnregisterTarget() - Full Documentation →
Suggestion Lifecycle
startSuggestion()
Manually capture a snapshot of a target’s current value to begin a suggestion.- Params:
targetId: string - Returns:
void - React Hook:
useStartSuggestion() - Full Documentation →
commitSuggestion()
Explicitly commit a pending suggestion with a new value. Returns the created suggestion ID.- Params:
config: CommitSuggestionConfig<T> - Returns:
Promise<{ id: string }> - React Hook:
useCommitSuggestion() - Full Documentation →
Querying Suggestions
getSuggestions()
Return all suggestions matching the optional filter synchronously.- Params:
filter?: SuggestionGetSuggestionsFilter(optional) - Returns:
Suggestion<unknown>[] - React Hook:
useSuggestions() - Full Documentation →
getSuggestions$()
Reactively observe suggestions matching the optional filter.- Params:
filter?: SuggestionGetSuggestionsFilter(optional) - Returns:
Observable<Suggestion<unknown>[]> - React Hook:
useSuggestions() - Full Documentation →
getPendingSuggestion()
Return the pending suggestion for a specific target, ornull if none exists.
- Params:
targetId: string - Returns:
Suggestion<unknown> | null - React Hook:
usePendingSuggestion() - Full Documentation →
getPendingSuggestion$()
Reactively observe the pending suggestion for a specific target.- Params:
targetId: string - Returns:
Observable<Suggestion<unknown> | null> - React Hook:
usePendingSuggestion() - Full Documentation →
Event Subscription
on()
Subscribe to a suggestion lifecycle event.- Params:
SuggestionEventType— one of'suggestionCreated','suggestionApproved','suggestionRejected','suggestionStale','targetEditStart','targetEditCommit' - Returns:
Observable<SuggestionEventTypesMap[T]>. Here is the list of event payload types you can expect to receive. - React Hook:
useSuggestionEventCallback(SuggestionEventType) - Full Documentation →