/* Hide scrollbar for Chrome, Safari and Opera */
::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
* {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/* #content-area {
  overflow: scroll !important;
} */

th {
  text-align: left;
}


/* .update-container .prose-sm{
  width: 75% !important;
} */

.update-container .relative{
  max-width: 525px !important;
}

#table-of-contents-content {
  overflow-x: clip;
  height: 100%;
}

Default Subcomponent

The subcomponent of the Comments Sidebar that represents the Header of the Sidebar

Velt

Quickstart for React. For other frameworks like `vue`, `angular`, `svelte`, `vanilla js` etc. check out the setup guide.

Quickstart

Self-host the user generated content on your infrastructure while storing only minimal identifiers on Velt servers.

Overview

Self-host your users' PII while using Velt's collaboration features. Keep sensitive user data on your infrastructure with only user IDs stored on Velt servers.

Users

Self-host your comments data while using Velt's components. Keep comment storage on your infrastructure with minimal metadata stored on Velt servers.

Comments

Self-host your reactions data while using Velt's components. Keep reaction storage on your infrastructure with minimal metadata stored on Velt servers.

Reactions

Self-host your comments file attachments data while using Velt's components. Keep attachment storage on your infrastructure with minimal metadata stored on Velt servers.

Attachments

MCP Servers (Beta)

Basic Webhooks

Advanced Webhooks

Generating Auth Tokens

Generate JWT Tokens for additional security

JWT Tokens

Proxy Server

Supported Regions

Migrate from Cord to Velt

Migrate from Liveblocks to Velt

Setup Wireframes

Layout Customization

CSS Customization

Template Variables

Conditional Templates

Action Components

Localisation

This component is used to render the reaction tool and all the reactions.

Inline Reactions Section

The Presence component displays the avatars of users in a room.

Presence

The Cursors component displays the cursors of users in a document.

Cursors

Wireframes for the Single Editor Mode Panel.

Single Editor Mode

Live Selection

Version 3.0.0

Steps to integrate Velt into an existing app

1. Install

Autheticate your logged in users with the SDK.

2. Authenticate

3. Initialize Document

Advanced Setup Options

Setup

Use Multiple Locations at once

Remove Locations

Your users can add comments in context to ask questions, leave feedback, report bugs etc. We handle all complexity to ensure the comments are robust against content changes. We support many types of comment UX patterns as illustrated below.

Customize Behavior

There are several options to send notifications to your users.

Comments Notifications

In-app Notifications

Inline Reactions

The Recorder allows your users to create audio, screen, and video recordings.

Recorder

View Analytics

Arrows

Your users can see other users online on the document. This makes your app feel alive.

Your users can view each other's cursors when interacting on the same document. This makes your app more alive. We handle the complexity of adapting the cursors to different screen sizes, differences in content etc.

This is like Figma's follow along feature. Start a shared session in a click. One person is the leader, and whatever they do - like clicking, scrolling, or navigating - happens automatically on everyone else's screen.

Enable slack-style effortless audio, video and screen sharing discussions inside your own product. It even comes with built in chat.

Huddle Webhooks

Your users can see what part of the document others are interacting with in real-time.

Sync and broadcast data in real-time across all connected clients.

Redux Middleware

Allow only one user to edit at a time but still allow everyone to see the changes as they happen.

Variants

Styling

Slots

Custom Button

Parts

Variables

Create Your Own UI

Comments Webhooks

Add Organizations

Update Organizations

Delete Organizations

Get Organizations

Get Organizations v2

Update Disabled State for Organizations

Add Folder

Get Folders

Update Folder

Update Access for Folders

Add Documents

Update Documents

Delete Documents

Get Documents

Get Documents v2

Move Documents

Update Access for Documents

Update Disabled State for Documents

Update Location

Delete all data associated with a specific location

Delete Data by Location

Add Users

Update Users

Remove Users from an Organization or a Document.

Concepts

Async Collaboration

Realtime Collaboration

Header

Default Subcomponent

Concepts

Async Collaboration

Realtime Collaboration

​Default Subcomponent

Default Subcomponent