​
Versions

​
Option to Disable ShadowDOM

We’ve added an option for you to disable the ShadowDOM on certain components.

By default, a ShadowDOM is used with certain components to ensure that your application’s CSS does not interfere with the styling of the SDK components.

If you want your application’s CSS to affect the styling of the SDK components, you can disable the ShadowDOM.

<VeltComments pinShadowDom={false} dialogShadowDom={false} />
<VeltCommentsSidebar shadowDom={false} />

API methods:

const commentElement = client.getCommentElement();
commentElement.enablePinShadowDOM();
commentElement.disablePinShadowDOM();
commentElement.enableDialogShadowDOM();
commentElement.disableDialogShadowDOM();
commentElement.enableSidebarShadowDOM();
commentElement.disableSidebarShadowDOM();

​
Method to Unsubscribe from Subscriptions

We added an unsubscribe() method to unsubscribe from any event subscriptions.

Example subscription:

let subscription = commentElement.getAllCommentAnnotations().subscribe((comments) => {
// Do something with comments
});

To unsubscribe from the subscription:

subscription?.unsubscribe()

​
Added webhook notifications for Huddle Create and Join Events

Your users will now receive webhook notifications when a Huddle is created or joined.

Example notification schema:

{
  "from": {
      // UserObject
  },
  "projectName": "string",
  "projectUrl": "string",
  "actionType": "string", // created | joined
  "notificationSource": "huddle",
  "documentId": "string",
  "clientDocumentId": "string",
  "id": "string",
  "timestamp": 1234567890,
  "actionUser": {
      // UserObject
  },
}

Click here to see the Notification schema.

​
Added Validations to check for Audio and Video permissions on Huddles

Your users will now be prompted to check for Audio and Video permissions on Huddles

​
Option to disable Chat feature on Huddles

You can now disable the Chat feature that is enabled by default on Huddle component.

​
Option to disable flockMode feature on Huddles

You can now disable the flockMode feature that is enabled by default on Huddle component when clicking on another user’s Avatar.

​
Added support to set a custom order of locations to sort by in the Comments Sidebar.

You can now define the order in which locations appear in the Comments Sidebar filter through the ‘order’ field in the filterConfig object.

<VeltCommentsSidebar
  filterConfig={{
    location: {
      enable: true,
      name: 'Pages',
      enableGrouping: true,
      multiSelection: true,
      order: ['locationId1', 'locationId2', 'locationId3'] // pass array of location ids here
    },
  }}
/>

​
Added configuration for Unread Comments Indicator

You can now configure the Unread Comments Indicator to be either minimal or verbose.

In minimal mode unread comments will be indicated by a small red dot.

In verbose mode unread comments will be indicated by a larger badge that says UNREAD

​
Added hook for useUnsetDocumentId

There is now a hook called useUnsetDocumentId() that calls client.unsetDocumentId()

import { useUnsetDocumentId} from '@veltdev/react'
import React from 'react'

export default function YourComponent() {

  useUnsetDocumentId();

  return (
    <div>...</div>
  )
}

​
Added option to use a specific version of the Velt React SDK.

You can now use a specific version of the Velt React SDK.

To do so, in your VeltProvider component, set the config props object to { version: '1.0.XYZ' }.

Example:

<VeltProvider apiKey='YOUR_API_KEY' config={{ version: '1.0.126' }}>
	...
</VeltProvider>