@veltdev/react 4.5.0-beta.6 → 4.5.0-beta.61

package/esm/index.js

@@ -91,7 +91,7 @@ function useVeltClient() {
     return useContext(VeltContext);
 }
 
-var loadVelt = function (callback, version, staging, develop, proxyDomain) {
+var loadVelt = function (callback, version, staging, develop, proxyDomain, integrity, integrityValue) {
     if (version === void 0) { version = 'latest'; }
     if (staging === void 0) { staging = false; }
     if (develop === void 0) { develop = false; }
@@ -118,6 +118,10 @@ var loadVelt = function (callback, version, staging, develop, proxyDomain) {
         }
         script.id = 'veltScript';
         script.type = 'module';
+        if (integrity && integrityValue) {
+            script.integrity = integrityValue;
+            script.crossOrigin = 'anonymous';
+        }
         document.body.appendChild(script);
         script.onload = function () {
             if (callback) {
@@ -132,34 +136,61 @@ var loadVelt = function (callback, version, staging, develop, proxyDomain) {
     }
 };
 
-var VELT_SDK_VERSION = '4.5.0-beta.6';
+var VELT_SDK_VERSION = '4.5.0-beta.61';
 var VELT_SDK_INIT_EVENT = 'onVeltInit';
 var VELT_TAB_ID = 'veltTabId';
+// integrity map for the Velt SDK
+// Note: generate integrity hashes with: https://www.srihash.org/
+var INTEGRITY_MAP = {
+    '4.5.0-beta.61': 'sha384-+bZu6eyD7r1LzK/K3c2nmnPJGYvKMBicoLrZf42giIz95aUC1ZMw8h0aXU7fIKNk',
+};
 
 var SnippylyProvider = function (props) {
-    var apiKey = props.apiKey, user = props.user, config = props.config, documentId = props.documentId, language = props.language, translations = props.translations, autoTranslation = props.autoTranslation, userDataProvider = props.userDataProvider, dataProviders = props.dataProviders, onClientLoad = props.onClientLoad, children = props.children;
+    var apiKey = props.apiKey, user = props.user, config = props.config, documentId = props.documentId, language = props.language, translations = props.translations, autoTranslation = props.autoTranslation, userDataProvider = props.userDataProvider, dataProviders = props.dataProviders, authProvider = props.authProvider, onClientLoad = props.onClientLoad, children = props.children;
     var _a = useState(null), client = _a[0], setClient = _a[1];
     useEffect(function () {
         if (apiKey) {
+            var staging = config === null || config === void 0 ? void 0 : config.staging;
+            var develop = config === null || config === void 0 ? void 0 : config.develop;
+            var version = (config === null || config === void 0 ? void 0 : config.version) || VELT_SDK_VERSION;
+            var integrity = !!(config === null || config === void 0 ? void 0 : config.integrity);
+            var integrityValue = "";
+            if (integrity) {
+                if (develop || staging) {
+                    if (config === null || config === void 0 ? void 0 : config.sriv) {
+                        integrityValue = config === null || config === void 0 ? void 0 : config.sriv;
+                    }
+                }
+                else {
+                    if (INTEGRITY_MAP[version]) {
+                        integrityValue = INTEGRITY_MAP[version];
+                    }
+                }
+            }
             loadVelt(function () {
                 initVelt();
-            }, (config === null || config === void 0 ? void 0 : config.version) || VELT_SDK_VERSION, config === null || config === void 0 ? void 0 : config.staging, config === null || config === void 0 ? void 0 : config.develop, config === null || config === void 0 ? void 0 : config.proxyDomain);
+            }, version, staging, develop, config === null || config === void 0 ? void 0 : config.proxyDomain, integrity, integrityValue);
         }
     }, []);
     useEffect(function () {
         if (client && userDataProvider) {
-            if (typeof (client === null || client === void 0 ? void 0 : client.setUserDataProvider) === 'function') {
+            if (typeof (client === null || client === void 0 ? void 0 : client.setUserDataProvider) === "function") {
                 client === null || client === void 0 ? void 0 : client.setUserDataProvider(userDataProvider);
             }
         }
     }, [client, userDataProvider]);
     useEffect(function () {
         if (client && dataProviders) {
-            if (typeof (client === null || client === void 0 ? void 0 : client.setDataProviders) === 'function') {
+            if (typeof (client === null || client === void 0 ? void 0 : client.setDataProviders) === "function") {
                 client === null || client === void 0 ? void 0 : client.setDataProviders(dataProviders);
             }
         }
     }, [client, dataProviders]);
+    useEffect(function () {
+        if (client && authProvider && authProvider.user) {
+            client.setVeltAuthProvider(authProvider);
+        }
+    }, [client, authProvider]);
     var initVelt = function () { return __awaiter(void 0, void 0, void 0, function () {
         var velt, event;
         var _a, _b;
@@ -194,7 +225,7 @@ var SnippylyProvider = function (props) {
                     }
                     // Set translations
                     if (translations && (velt === null || velt === void 0 ? void 0 : velt.setTranslations)) {
-                        if (typeof translations === 'object') {
+                        if (typeof translations === "object") {
                             Object.keys(translations).forEach(function (languageCode) {
                                 velt === null || velt === void 0 ? void 0 : velt.setTranslations(languageCode, translations[languageCode] || {});
                             });
@@ -209,7 +240,7 @@ var SnippylyProvider = function (props) {
                         }
                     }
                     if (velt === null || velt === void 0 ? void 0 : velt.st) {
-                        velt === null || velt === void 0 ? void 0 : velt.st('react');
+                        velt === null || velt === void 0 ? void 0 : velt.st("react");
                     }
                     setClient(velt);
                     if (onClientLoad) {
@@ -235,12 +266,12 @@ var SnippylyProvider = function (props) {
 };
 
 var SnippylyCommentBubble = function (props) {
-    var targetCommentElementId = props.targetCommentElementId, targetElementId = props.targetElementId, avatar = props.avatar, showAvatar = props.showAvatar, commentBubbleTargetPinHover = props.commentBubbleTargetPinHover, children = props.children, shadowDom = props.shadowDom, variant = props.variant, darkMode = props.darkMode, commentCountType = props.commentCountType;
-    return (React.createElement("velt-comment-bubble", { "comment-count-type": commentCountType, "target-comment-element-id": targetCommentElementId, "target-element-id": targetElementId, "show-avatar": [true, false].includes(showAvatar) ? (showAvatar ? 'true' : 'false') : undefined, avatar: [true, false].includes(avatar) ? (avatar ? 'true' : 'false') : undefined, "comment-bubble-target-pin-hover": commentBubbleTargetPinHover ? 'true' : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, variant: variant }, children));
+    var targetCommentElementId = props.targetCommentElementId, targetElementId = props.targetElementId, avatar = props.avatar, showAvatar = props.showAvatar, commentBubbleTargetPinHover = props.commentBubbleTargetPinHover, children = props.children, shadowDom = props.shadowDom, variant = props.variant, darkMode = props.darkMode, commentCountType = props.commentCountType, context = props.context, contextOptions = props.contextOptions, annotationId = props.annotationId, documentId = props.documentId, folderId = props.folderId, locationId = props.locationId;
+    return (React.createElement("velt-comment-bubble", { "annotation-id": annotationId, "comment-count-type": commentCountType, "target-comment-element-id": targetCommentElementId, "target-element-id": targetElementId, context: JSON.stringify(context), "context-options": JSON.stringify(contextOptions), "location-id": locationId, "document-id": documentId, "folder-id": folderId, "show-avatar": [true, false].includes(showAvatar) ? (showAvatar ? 'true' : 'false') : undefined, avatar: [true, false].includes(avatar) ? (avatar ? 'true' : 'false') : undefined, "comment-bubble-target-pin-hover": commentBubbleTargetPinHover ? 'true' : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, variant: variant }, children));
 };
 
 var SnippylyComments = function (props) {
-    var autoCategorize = props.autoCategorize, streamViewContainerId = props.streamViewContainerId, onSignIn = props.onSignIn, onUpgrade = props.onUpgrade, textMode = props.textMode, popoverMode = props.popoverMode, popoverTriangleComponent = props.popoverTriangleComponent, floatingCommentDialog = props.floatingCommentDialog, moderatorMode = props.moderatorMode, streamMode = props.streamMode, signInButton = props.signInButton, upgradeButton = props.upgradeButton, attachments = props.attachments, recordings = props.recordings, reactions = props.reactions, deviceInfo = props.deviceInfo, commentIndex = props.commentIndex, dialogOnHover = props.dialogOnHover, dialogOnTargetElementClick = props.dialogOnTargetElementClick, priority = props.priority, inboxMode = props.inboxMode, suggestionMode = props.suggestionMode, mobileMode = props.mobileMode, inlineCommentMode = props.inlineCommentMode, privateCommentMode = props.privateCommentMode, minimap = props.minimap, minimapPosition = props.minimapPosition, persistentCommentMode = props.persistentCommentMode, ghostComments = props.ghostComments, ghostCommentsIndicator = props.ghostCommentsIndicator, commentsOnDom = props.commentsOnDom, resolvedCommentsOnDom = props.resolvedCommentsOnDom, bubbleOnPin = props.bubbleOnPin, bubbleOnPinHover = props.bubbleOnPinHover, commentTool = props.commentTool, sidebarButtonOnCommentDialog = props.sidebarButtonOnCommentDialog, deviceIndicatorOnCommentPins = props.deviceIndicatorOnCommentPins, scrollToComment = props.scrollToComment, userMentions = props.userMentions, deleteOnBackspace = props.deleteOnBackspace, hotkey = props.hotkey, recordingSummary = props.recordingSummary, recordingTranscription = props.recordingTranscription, recordingCountdown = props.recordingCountdown, unreadIndicatorMode = props.unreadIndicatorMode, enterKeyToSubmit = props.enterKeyToSubmit, pinShadowDom = props.pinShadowDom, dialogShadowDom = props.dialogShadowDom, persistentCommentShadowDom = props.persistentCommentShadowDom, shadowDom = props.shadowDom, changeDetectionInCommentMode = props.changeDetectionInCommentMode, areaComment = props.areaComment, pinCursorImage = props.pinCursorImage, allowedElementIds = props.allowedElementIds, allowedElementClassNames = props.allowedElementClassNames, allowedElementQuerySelectors = props.allowedElementQuerySelectors, commentPinHighlighter = props.commentPinHighlighter, customReactions = props.customReactions, onCommentAdd = props.onCommentAdd, onCommentUpdate = props.onCommentUpdate, onCommentAccept = props.onCommentAccept, onCommentReject = props.onCommentReject, onSidebarButtonOnCommentDialogClick = props.onSidebarButtonOnCommentDialogClick, onCommentSelectionChange = props.onCommentSelectionChange, customStatus = props.customStatus, customListDataOnAnnotation = props.customListDataOnAnnotation, customListDataOnComment = props.customListDataOnComment, customPriority = props.customPriority, customCategory = props.customCategory, status = props.status, resolveButton = props.resolveButton, darkMode = props.darkMode, onCustomPinInject = props.onCustomPinInject, children = props.children, textCommentToolShadowDom = props.textCommentToolShadowDom, textCommentToolbarShadowDom = props.textCommentToolbarShadowDom, dialogDarkMode = props.dialogDarkMode, pinDarkMode = props.pinDarkMode, textCommentToolDarkMode = props.textCommentToolDarkMode, textCommentToolbarDarkMode = props.textCommentToolbarDarkMode, composerMode = props.composerMode, atHereLabel = props.atHereLabel, atHereDescription = props.atHereDescription, multiThreadMode = props.multiThreadMode, multiThread = props.multiThread, onCopyLink = props.onCopyLink, deleteReplyConfirmation = props.deleteReplyConfirmation, collapsedComments = props.collapsedComments, shortUserName = props.shortUserName, resolveStatusAccessAdminOnly = props.resolveStatusAccessAdminOnly, svgAsImg = props.svgAsImg, seenByUsers = props.seenByUsers, readOnly = props.readOnly, atHereEnabled = props.atHereEnabled, customAutocompleteSearch = props.customAutocompleteSearch, deleteThreadWithFirstComment = props.deleteThreadWithFirstComment, expandMentionGroups = props.expandMentionGroups, showMentionGroupsFirst = props.showMentionGroupsFirst, showMentionGroupsOnly = props.showMentionGroupsOnly, fullExpanded = props.fullExpanded, commentToNearestAllowedElement = props.commentToNearestAllowedElement, draftMode = props.draftMode;
+    var autoCategorize = props.autoCategorize, streamViewContainerId = props.streamViewContainerId, onSignIn = props.onSignIn, onUpgrade = props.onUpgrade, textMode = props.textMode, popoverMode = props.popoverMode, popoverTriangleComponent = props.popoverTriangleComponent, floatingCommentDialog = props.floatingCommentDialog, moderatorMode = props.moderatorMode, streamMode = props.streamMode, signInButton = props.signInButton, upgradeButton = props.upgradeButton, attachments = props.attachments, recordings = props.recordings, reactions = props.reactions, deviceInfo = props.deviceInfo, commentIndex = props.commentIndex, dialogOnHover = props.dialogOnHover, dialogOnTargetElementClick = props.dialogOnTargetElementClick, priority = props.priority, inboxMode = props.inboxMode, suggestionMode = props.suggestionMode, mobileMode = props.mobileMode, inlineCommentMode = props.inlineCommentMode, privateCommentMode = props.privateCommentMode, minimap = props.minimap, minimapPosition = props.minimapPosition, persistentCommentMode = props.persistentCommentMode, ghostComments = props.ghostComments, ghostCommentsIndicator = props.ghostCommentsIndicator, commentsOnDom = props.commentsOnDom, resolvedCommentsOnDom = props.resolvedCommentsOnDom, filterCommentsOnDom = props.filterCommentsOnDom, bubbleOnPin = props.bubbleOnPin, bubbleOnPinHover = props.bubbleOnPinHover, commentTool = props.commentTool, sidebarButtonOnCommentDialog = props.sidebarButtonOnCommentDialog, deviceIndicatorOnCommentPins = props.deviceIndicatorOnCommentPins, scrollToComment = props.scrollToComment, userMentions = props.userMentions, deleteOnBackspace = props.deleteOnBackspace, hotkey = props.hotkey, recordingSummary = props.recordingSummary, recordingTranscription = props.recordingTranscription, recordingCountdown = props.recordingCountdown, unreadIndicatorMode = props.unreadIndicatorMode, enterKeyToSubmit = props.enterKeyToSubmit, pinShadowDom = props.pinShadowDom, dialogShadowDom = props.dialogShadowDom, persistentCommentShadowDom = props.persistentCommentShadowDom, shadowDom = props.shadowDom, changeDetectionInCommentMode = props.changeDetectionInCommentMode, areaComment = props.areaComment, pinCursorImage = props.pinCursorImage, allowedElementIds = props.allowedElementIds, allowedElementClassNames = props.allowedElementClassNames, allowedElementQuerySelectors = props.allowedElementQuerySelectors, commentPinHighlighter = props.commentPinHighlighter, customReactions = props.customReactions, onCommentAdd = props.onCommentAdd, onCommentUpdate = props.onCommentUpdate, onCommentAccept = props.onCommentAccept, onCommentReject = props.onCommentReject, onSidebarButtonOnCommentDialogClick = props.onSidebarButtonOnCommentDialogClick, onCommentSelectionChange = props.onCommentSelectionChange, customStatus = props.customStatus, customListDataOnAnnotation = props.customListDataOnAnnotation, customListDataOnComment = props.customListDataOnComment, customPriority = props.customPriority, customCategory = props.customCategory, status = props.status, resolveButton = props.resolveButton, darkMode = props.darkMode, onCustomPinInject = props.onCustomPinInject, children = props.children, textCommentToolShadowDom = props.textCommentToolShadowDom, textCommentToolbarShadowDom = props.textCommentToolbarShadowDom, dialogDarkMode = props.dialogDarkMode, pinDarkMode = props.pinDarkMode, textCommentToolDarkMode = props.textCommentToolDarkMode, textCommentToolbarDarkMode = props.textCommentToolbarDarkMode, composerMode = props.composerMode, atHereLabel = props.atHereLabel, atHereDescription = props.atHereDescription, multiThreadMode = props.multiThreadMode, multiThread = props.multiThread, groupMultipleMatch = props.groupMultipleMatch, groupMatchedComments = props.groupMatchedComments, onCopyLink = props.onCopyLink, deleteReplyConfirmation = props.deleteReplyConfirmation, collapsedComments = props.collapsedComments, shortUserName = props.shortUserName, resolveStatusAccessAdminOnly = props.resolveStatusAccessAdminOnly, svgAsImg = props.svgAsImg, seenByUsers = props.seenByUsers, readOnly = props.readOnly, atHereEnabled = props.atHereEnabled, customAutocompleteSearch = props.customAutocompleteSearch, deleteThreadWithFirstComment = props.deleteThreadWithFirstComment, expandMentionGroups = props.expandMentionGroups, showMentionGroupsFirst = props.showMentionGroupsFirst, showMentionGroupsOnly = props.showMentionGroupsOnly, fullExpanded = props.fullExpanded, commentToNearestAllowedElement = props.commentToNearestAllowedElement, draftMode = props.draftMode, maxReplyAvatars = props.maxReplyAvatars, replyAvatars = props.replyAvatars;
     var ref = useRef();
     var onSignInRef = useRef(onSignIn);
     var onUpgradeRef = useRef(onUpgrade);
@@ -365,11 +396,11 @@ var SnippylyComments = function (props) {
             }
         };
     }, []);
-    return (React.createElement("velt-comments", { ref: ref, "at-here-label": atHereLabel, "at-here-description": atHereDescription, "at-here-enabled": [true, false].includes(atHereEnabled) ? (atHereEnabled ? 'true' : 'false') : undefined, "composer-mode": composerMode, "seen-by-users": [true, false].includes(seenByUsers) ? (seenByUsers ? 'true' : 'false') : undefined, "collapsed-comments": [true, false].includes(collapsedComments) ? (collapsedComments ? 'true' : 'false') : undefined, "short-user-name": [true, false].includes(shortUserName) ? (shortUserName ? 'true' : 'false') : undefined, "resolve-status-access-admin-only": [true, false].includes(resolveStatusAccessAdminOnly) ? (resolveStatusAccessAdminOnly ? 'true' : 'false') : undefined, "delete-reply-confirmation": [true, false].includes(deleteReplyConfirmation) ? (deleteReplyConfirmation ? 'true' : 'false') : undefined, "auto-categorize": [true, false].includes(autoCategorize) ? (autoCategorize ? 'true' : 'false') : undefined, "data-stream-view-container-id": streamViewContainerId, "text-mode": [true, false].includes(textMode) ? (textMode ? 'true' : 'false') : undefined, "popover-mode": [true, false].includes(popoverMode) ? (popoverMode ? 'true' : 'false') : undefined, "popover-triangle-component": [true, false].includes(popoverTriangleComponent) ? (popoverTriangleComponent ? 'true' : 'false') : undefined, "floating-comment-dialog": [true, false].includes(floatingCommentDialog) ? (floatingCommentDialog ? 'true' : 'false') : undefined, "moderator-mode": [true, false].includes(moderatorMode) ? (moderatorMode ? 'true' : 'false') : undefined, "stream-mode": [true, false].includes(streamMode) ? (streamMode ? 'true' : 'false') : undefined, "sign-in-button": [true, false].includes(signInButton) ? (signInButton ? 'true' : 'false') : undefined, "upgrade-button": [true, false].includes(upgradeButton) ? (upgradeButton ? 'true' : 'false') : undefined, attachments: [true, false].includes(attachments) ? (attachments ? 'true' : 'false') : undefined, recordings: recordings, reactions: [true, false].includes(reactions) ? (reactions ? 'true' : 'false') : undefined, "device-info": [true, false].includes(deviceInfo) ? (deviceInfo ? 'true' : 'false') : undefined, "comment-index": [true, false].includes(commentIndex) ? (commentIndex ? 'true' : 'false') : undefined, "dialog-on-hover": [true, false].includes(dialogOnHover) ? (dialogOnHover ? 'true' : 'false') : undefined, "dialog-on-target-element-click": [true, false].includes(dialogOnTargetElementClick) ? (dialogOnTargetElementClick ? 'true' : 'false') : undefined, priority: [true, false].includes(priority) ? (priority ? 'true' : 'false') : undefined, status: [true, false].includes(status) ? (status ? 'true' : 'false') : undefined, "resolve-button": [true, false].includes(resolveButton) ? (resolveButton ? 'true' : 'false') : undefined, "inbox-mode": [true, false].includes(inboxMode) ? (inboxMode ? 'true' : 'false') : undefined, "suggestion-mode": [true, false].includes(suggestionMode) ? (suggestionMode ? 'true' : 'false') : undefined, "mobile-mode": [true, false].includes(mobileMode) ? (mobileMode ? 'true' : 'false') : undefined, "inline-comment-mode": [true, false].includes(inlineCommentMode) ? (inlineCommentMode ? 'true' : 'false') : undefined, "private-comment-mode": [true, false].includes(privateCommentMode) ? (privateCommentMode ? 'true' : 'false') : undefined, minimap: [true, false].includes(minimap) ? (minimap ? 'true' : 'false') : undefined, "minimap-position": minimapPosition, "persistent-comment-mode": [true, false].includes(persistentCommentMode) ? (persistentCommentMode ? 'true' : 'false') : undefined, "ghost-comments": [true, false].includes(ghostComments) ? (ghostComments ? 'true' : 'false') : undefined, "ghost-comments-indicator": [true, false].includes(ghostCommentsIndicator) ? (ghostCommentsIndicator ? 'true' : 'false') : undefined, "comments-on-dom": [true, false].includes(commentsOnDom) ? (commentsOnDom ? 'true' : 'false') : undefined, "resolved-comments-on-dom": [true, false].includes(resolvedCommentsOnDom) ? (resolvedCommentsOnDom ? 'true' : 'false') : undefined, "bubble-on-pin": [true, false].includes(bubbleOnPin) ? (bubbleOnPin ? 'true' : 'false') : undefined, "bubble-on-pin-hover": [true, false].includes(bubbleOnPinHover) ? (bubbleOnPinHover ? 'true' : 'false') : undefined, "comment-tool": [true, false].includes(commentTool) ? (commentTool ? 'true' : 'false') : undefined, "sidebar-button-on-comment-dialog": [true, false].includes(sidebarButtonOnCommentDialog) ? (sidebarButtonOnCommentDialog ? 'true' : 'false') : undefined, "device-indicator-on-comment-pins": [true, false].includes(deviceIndicatorOnCommentPins) ? (deviceIndicatorOnCommentPins ? 'true' : 'false') : undefined, "scroll-to-comment": [true, false].includes(scrollToComment) ? (scrollToComment ? 'true' : 'false') : undefined, "user-mentions": [true, false].includes(userMentions) ? (userMentions ? 'true' : 'false') : undefined, "delete-on-backspace": [true, false].includes(deleteOnBackspace) ? (deleteOnBackspace ? 'true' : 'false') : undefined, hotkey: [true, false].includes(hotkey) ? (hotkey ? 'true' : 'false') : undefined, "recording-summary": [true, false].includes(recordingSummary) ? (recordingSummary ? 'true' : 'false') : undefined, "recording-transcription": [true, false].includes(recordingTranscription) ? (recordingTranscription ? 'true' : 'false') : undefined, "recording-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined, "unread-indicator-mode": unreadIndicatorMode, "enter-key-to-submit": [true, false].includes(enterKeyToSubmit) ? (enterKeyToSubmit ? 'true' : 'false') : undefined, "pin-shadow-dom": [true, false].includes(pinShadowDom) ? (pinShadowDom ? 'true' : 'false') : undefined, "dialog-shadow-dom": [true, false].includes(dialogShadowDom) ? (dialogShadowDom ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "text-comment-tool-shadow-dom": [true, false].includes(textCommentToolShadowDom) ? (textCommentToolShadowDom ? 'true' : 'false') : undefined, "text-comment-toolbar-shadow-dom": [true, false].includes(textCommentToolbarShadowDom) ? (textCommentToolbarShadowDom ? 'true' : 'false') : undefined, "persistent-comment-shadow-dom": [true, false].includes(persistentCommentShadowDom) ? (persistentCommentShadowDom ? 'true' : 'false') : undefined, "change-detection-in-comment-mode": [true, false].includes(changeDetectionInCommentMode) ? (changeDetectionInCommentMode ? 'true' : 'false') : undefined, "area-comment": [true, false].includes(areaComment) ? (areaComment ? 'true' : 'false') : undefined, "pin-cursor-image": pinCursorImage, "allowed-element-ids": JSON.stringify(allowedElementIds), "allowed-element-class-names": JSON.stringify(allowedElementClassNames), "allowed-element-query-selectors": JSON.stringify(allowedElementQuerySelectors), "comment-pin-highlighter": [true, false].includes(commentPinHighlighter) ? (commentPinHighlighter ? 'true' : 'false') : undefined, "custom-reactions": JSON.stringify(customReactions), "custom-status": JSON.stringify(customStatus), "custom-list-data-on-annotation": JSON.stringify(customListDataOnAnnotation), "custom-list-data-on-comment": JSON.stringify(customListDataOnComment), "custom-priority": JSON.stringify(customPriority), "custom-category": JSON.stringify(customCategory), "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "dialog-dark-mode": [true, false].includes(dialogDarkMode) ? (dialogDarkMode ? 'true' : 'false') : undefined, "pin-dark-mode": [true, false].includes(pinDarkMode) ? (pinDarkMode ? 'true' : 'false') : undefined, "text-comment-tool-dark-mode": [true, false].includes(textCommentToolDarkMode) ? (textCommentToolDarkMode ? 'true' : 'false') : undefined, "text-comment-toolbar-dark-mode": [true, false].includes(textCommentToolbarDarkMode) ? (textCommentToolbarDarkMode ? 'true' : 'false') : undefined, "multi-thread-mode": [true, false].includes(multiThreadMode) ? (multiThreadMode ? 'true' : 'false') : undefined, "multi-thread": [true, false].includes(multiThread) ? (multiThread ? 'true' : 'false') : undefined, "read-only": [true, false].includes(readOnly) ? (readOnly ? 'true' : 'false') : undefined, "custom-autocomplete-search": [true, false].includes(customAutocompleteSearch) ? (customAutocompleteSearch ? 'true' : 'false') : undefined, "delete-thread-with-first-comment": [true, false].includes(deleteThreadWithFirstComment) ? (deleteThreadWithFirstComment ? 'true' : 'false') : undefined, "svg-as-img": [true, false].includes(svgAsImg) ? (svgAsImg ? 'true' : 'false') : undefined, "expand-mention-groups": [true, false].includes(expandMentionGroups) ? (expandMentionGroups ? 'true' : 'false') : undefined, "show-mention-groups-first": [true, false].includes(showMentionGroupsFirst) ? (showMentionGroupsFirst ? 'true' : 'false') : undefined, "show-mention-groups-only": [true, false].includes(showMentionGroupsOnly) ? (showMentionGroupsOnly ? 'true' : 'false') : undefined, "full-expanded": [true, false].includes(fullExpanded) ? (fullExpanded ? 'true' : 'false') : undefined, "comment-to-nearest-allowed-element": [true, false].includes(commentToNearestAllowedElement) ? (commentToNearestAllowedElement ? 'true' : 'false') : undefined, "draft-mode": [true, false].includes(draftMode) ? (draftMode ? 'true' : 'false') : undefined }, children));
+    return (React.createElement("velt-comments", { ref: ref, "at-here-label": atHereLabel, "at-here-description": atHereDescription, "at-here-enabled": [true, false].includes(atHereEnabled) ? (atHereEnabled ? 'true' : 'false') : undefined, "composer-mode": composerMode, "seen-by-users": [true, false].includes(seenByUsers) ? (seenByUsers ? 'true' : 'false') : undefined, "collapsed-comments": [true, false].includes(collapsedComments) ? (collapsedComments ? 'true' : 'false') : undefined, "short-user-name": [true, false].includes(shortUserName) ? (shortUserName ? 'true' : 'false') : undefined, "resolve-status-access-admin-only": [true, false].includes(resolveStatusAccessAdminOnly) ? (resolveStatusAccessAdminOnly ? 'true' : 'false') : undefined, "delete-reply-confirmation": [true, false].includes(deleteReplyConfirmation) ? (deleteReplyConfirmation ? 'true' : 'false') : undefined, "auto-categorize": [true, false].includes(autoCategorize) ? (autoCategorize ? 'true' : 'false') : undefined, "data-stream-view-container-id": streamViewContainerId, "text-mode": [true, false].includes(textMode) ? (textMode ? 'true' : 'false') : undefined, "popover-mode": [true, false].includes(popoverMode) ? (popoverMode ? 'true' : 'false') : undefined, "popover-triangle-component": [true, false].includes(popoverTriangleComponent) ? (popoverTriangleComponent ? 'true' : 'false') : undefined, "floating-comment-dialog": [true, false].includes(floatingCommentDialog) ? (floatingCommentDialog ? 'true' : 'false') : undefined, "moderator-mode": [true, false].includes(moderatorMode) ? (moderatorMode ? 'true' : 'false') : undefined, "stream-mode": [true, false].includes(streamMode) ? (streamMode ? 'true' : 'false') : undefined, "sign-in-button": [true, false].includes(signInButton) ? (signInButton ? 'true' : 'false') : undefined, "upgrade-button": [true, false].includes(upgradeButton) ? (upgradeButton ? 'true' : 'false') : undefined, attachments: [true, false].includes(attachments) ? (attachments ? 'true' : 'false') : undefined, recordings: recordings, reactions: [true, false].includes(reactions) ? (reactions ? 'true' : 'false') : undefined, "device-info": [true, false].includes(deviceInfo) ? (deviceInfo ? 'true' : 'false') : undefined, "comment-index": [true, false].includes(commentIndex) ? (commentIndex ? 'true' : 'false') : undefined, "dialog-on-hover": [true, false].includes(dialogOnHover) ? (dialogOnHover ? 'true' : 'false') : undefined, "dialog-on-target-element-click": [true, false].includes(dialogOnTargetElementClick) ? (dialogOnTargetElementClick ? 'true' : 'false') : undefined, priority: [true, false].includes(priority) ? (priority ? 'true' : 'false') : undefined, status: [true, false].includes(status) ? (status ? 'true' : 'false') : undefined, "resolve-button": [true, false].includes(resolveButton) ? (resolveButton ? 'true' : 'false') : undefined, "inbox-mode": [true, false].includes(inboxMode) ? (inboxMode ? 'true' : 'false') : undefined, "suggestion-mode": [true, false].includes(suggestionMode) ? (suggestionMode ? 'true' : 'false') : undefined, "mobile-mode": [true, false].includes(mobileMode) ? (mobileMode ? 'true' : 'false') : undefined, "inline-comment-mode": [true, false].includes(inlineCommentMode) ? (inlineCommentMode ? 'true' : 'false') : undefined, "private-comment-mode": [true, false].includes(privateCommentMode) ? (privateCommentMode ? 'true' : 'false') : undefined, minimap: [true, false].includes(minimap) ? (minimap ? 'true' : 'false') : undefined, "minimap-position": minimapPosition, "persistent-comment-mode": [true, false].includes(persistentCommentMode) ? (persistentCommentMode ? 'true' : 'false') : undefined, "ghost-comments": [true, false].includes(ghostComments) ? (ghostComments ? 'true' : 'false') : undefined, "ghost-comments-indicator": [true, false].includes(ghostCommentsIndicator) ? (ghostCommentsIndicator ? 'true' : 'false') : undefined, "comments-on-dom": [true, false].includes(commentsOnDom) ? (commentsOnDom ? 'true' : 'false') : undefined, "resolved-comments-on-dom": [true, false].includes(resolvedCommentsOnDom) ? (resolvedCommentsOnDom ? 'true' : 'false') : undefined, "filter-comments-on-dom": [true, false].includes(filterCommentsOnDom) ? (filterCommentsOnDom ? 'true' : 'false') : undefined, "bubble-on-pin": [true, false].includes(bubbleOnPin) ? (bubbleOnPin ? 'true' : 'false') : undefined, "bubble-on-pin-hover": [true, false].includes(bubbleOnPinHover) ? (bubbleOnPinHover ? 'true' : 'false') : undefined, "comment-tool": [true, false].includes(commentTool) ? (commentTool ? 'true' : 'false') : undefined, "sidebar-button-on-comment-dialog": [true, false].includes(sidebarButtonOnCommentDialog) ? (sidebarButtonOnCommentDialog ? 'true' : 'false') : undefined, "device-indicator-on-comment-pins": [true, false].includes(deviceIndicatorOnCommentPins) ? (deviceIndicatorOnCommentPins ? 'true' : 'false') : undefined, "scroll-to-comment": [true, false].includes(scrollToComment) ? (scrollToComment ? 'true' : 'false') : undefined, "user-mentions": [true, false].includes(userMentions) ? (userMentions ? 'true' : 'false') : undefined, "delete-on-backspace": [true, false].includes(deleteOnBackspace) ? (deleteOnBackspace ? 'true' : 'false') : undefined, hotkey: [true, false].includes(hotkey) ? (hotkey ? 'true' : 'false') : undefined, "recording-summary": [true, false].includes(recordingSummary) ? (recordingSummary ? 'true' : 'false') : undefined, "recording-transcription": [true, false].includes(recordingTranscription) ? (recordingTranscription ? 'true' : 'false') : undefined, "recording-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined, "unread-indicator-mode": unreadIndicatorMode, "enter-key-to-submit": [true, false].includes(enterKeyToSubmit) ? (enterKeyToSubmit ? 'true' : 'false') : undefined, "pin-shadow-dom": [true, false].includes(pinShadowDom) ? (pinShadowDom ? 'true' : 'false') : undefined, "dialog-shadow-dom": [true, false].includes(dialogShadowDom) ? (dialogShadowDom ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "text-comment-tool-shadow-dom": [true, false].includes(textCommentToolShadowDom) ? (textCommentToolShadowDom ? 'true' : 'false') : undefined, "text-comment-toolbar-shadow-dom": [true, false].includes(textCommentToolbarShadowDom) ? (textCommentToolbarShadowDom ? 'true' : 'false') : undefined, "persistent-comment-shadow-dom": [true, false].includes(persistentCommentShadowDom) ? (persistentCommentShadowDom ? 'true' : 'false') : undefined, "change-detection-in-comment-mode": [true, false].includes(changeDetectionInCommentMode) ? (changeDetectionInCommentMode ? 'true' : 'false') : undefined, "area-comment": [true, false].includes(areaComment) ? (areaComment ? 'true' : 'false') : undefined, "pin-cursor-image": pinCursorImage, "allowed-element-ids": JSON.stringify(allowedElementIds), "allowed-element-class-names": JSON.stringify(allowedElementClassNames), "allowed-element-query-selectors": JSON.stringify(allowedElementQuerySelectors), "comment-pin-highlighter": [true, false].includes(commentPinHighlighter) ? (commentPinHighlighter ? 'true' : 'false') : undefined, "custom-reactions": JSON.stringify(customReactions), "custom-status": JSON.stringify(customStatus), "custom-list-data-on-annotation": JSON.stringify(customListDataOnAnnotation), "custom-list-data-on-comment": JSON.stringify(customListDataOnComment), "custom-priority": JSON.stringify(customPriority), "custom-category": JSON.stringify(customCategory), "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "dialog-dark-mode": [true, false].includes(dialogDarkMode) ? (dialogDarkMode ? 'true' : 'false') : undefined, "pin-dark-mode": [true, false].includes(pinDarkMode) ? (pinDarkMode ? 'true' : 'false') : undefined, "text-comment-tool-dark-mode": [true, false].includes(textCommentToolDarkMode) ? (textCommentToolDarkMode ? 'true' : 'false') : undefined, "text-comment-toolbar-dark-mode": [true, false].includes(textCommentToolbarDarkMode) ? (textCommentToolbarDarkMode ? 'true' : 'false') : undefined, "multi-thread-mode": [true, false].includes(multiThreadMode) ? (multiThreadMode ? 'true' : 'false') : undefined, "multi-thread": [true, false].includes(multiThread) ? (multiThread ? 'true' : 'false') : undefined, "group-multiple-match": [true, false].includes(groupMultipleMatch) ? (groupMultipleMatch ? 'true' : 'false') : undefined, "group-matched-comments": [true, false].includes(groupMatchedComments) ? (groupMatchedComments ? 'true' : 'false') : undefined, "read-only": [true, false].includes(readOnly) ? (readOnly ? 'true' : 'false') : undefined, "custom-autocomplete-search": [true, false].includes(customAutocompleteSearch) ? (customAutocompleteSearch ? 'true' : 'false') : undefined, "delete-thread-with-first-comment": [true, false].includes(deleteThreadWithFirstComment) ? (deleteThreadWithFirstComment ? 'true' : 'false') : undefined, "svg-as-img": [true, false].includes(svgAsImg) ? (svgAsImg ? 'true' : 'false') : undefined, "expand-mention-groups": [true, false].includes(expandMentionGroups) ? (expandMentionGroups ? 'true' : 'false') : undefined, "show-mention-groups-first": [true, false].includes(showMentionGroupsFirst) ? (showMentionGroupsFirst ? 'true' : 'false') : undefined, "show-mention-groups-only": [true, false].includes(showMentionGroupsOnly) ? (showMentionGroupsOnly ? 'true' : 'false') : undefined, "full-expanded": [true, false].includes(fullExpanded) ? (fullExpanded ? 'true' : 'false') : undefined, "comment-to-nearest-allowed-element": [true, false].includes(commentToNearestAllowedElement) ? (commentToNearestAllowedElement ? 'true' : 'false') : undefined, "draft-mode": [true, false].includes(draftMode) ? (draftMode ? 'true' : 'false') : undefined, "max-reply-avatars": maxReplyAvatars, "reply-avatars": [true, false].includes(replyAvatars) ? (replyAvatars ? 'true' : 'false') : undefined }, children));
 };
 
 var SnippylyCommentsSidebar = function (props) {
-    var embedMode = props.embedMode; props.floatingMode; var enableUrlNavigation = props.enableUrlNavigation, urlNavigation = props.urlNavigation, queryParamsComments = props.queryParamsComments, pageMode = props.pageMode, currentLocationSuffix = props.currentLocationSuffix, sortData = props.sortData, filterConfig = props.filterConfig, groupConfig = props.groupConfig, filters = props.filters, excludeLocationIds = props.excludeLocationIds, variant = props.variant, pageModeComposerVariant = props.pageModeComposerVariant, dialogVariant = props.dialogVariant, shadowDom = props.shadowDom, searchPlaceholder = props.searchPlaceholder, openSidebar = props.openSidebar, onSidebarOpen = props.onSidebarOpen, onSidebarCommentClick = props.onSidebarCommentClick, onCommentClick = props.onCommentClick, onSidebarClose = props.onSidebarClose, darkMode = props.darkMode, position = props.position, filterPanelLayout = props.filterPanelLayout, customActions = props.customActions, focusedThreadDialogVariant = props.focusedThreadDialogVariant, focusedThreadMode = props.focusedThreadMode, onCommentNavigationButtonClick = props.onCommentNavigationButtonClick, filterOptionLayout = props.filterOptionLayout, filterCount = props.filterCount, fullExpanded = props.fullExpanded, systemFiltersOperator = props.systemFiltersOperator;
+    var embedMode = props.embedMode; props.floatingMode; var enableUrlNavigation = props.enableUrlNavigation, urlNavigation = props.urlNavigation, queryParamsComments = props.queryParamsComments, pageMode = props.pageMode, currentLocationSuffix = props.currentLocationSuffix, sortData = props.sortData, filterConfig = props.filterConfig, groupConfig = props.groupConfig, filters = props.filters, excludeLocationIds = props.excludeLocationIds, variant = props.variant, pageModeComposerVariant = props.pageModeComposerVariant, dialogVariant = props.dialogVariant, shadowDom = props.shadowDom, searchPlaceholder = props.searchPlaceholder, openSidebar = props.openSidebar, onSidebarOpen = props.onSidebarOpen, onSidebarCommentClick = props.onSidebarCommentClick, onCommentClick = props.onCommentClick, onSidebarClose = props.onSidebarClose, darkMode = props.darkMode, position = props.position, filterPanelLayout = props.filterPanelLayout, customActions = props.customActions, focusedThreadDialogVariant = props.focusedThreadDialogVariant, focusedThreadMode = props.focusedThreadMode, onCommentNavigationButtonClick = props.onCommentNavigationButtonClick, filterOptionLayout = props.filterOptionLayout, filterCount = props.filterCount, fullExpanded = props.fullExpanded, systemFiltersOperator = props.systemFiltersOperator, sidebarButtonCountType = props.sidebarButtonCountType;
     var ref = useRef();
     var openSidebarRef = useRef(openSidebar);
     var onSidebarOpenRef = useRef(onSidebarOpen);
@@ -442,11 +473,11 @@ var SnippylyCommentsSidebar = function (props) {
             }
         };
     }, []);
-    return (React.createElement("velt-comments-sidebar", { ref: ref, position: position, "filter-panel-layout": filterPanelLayout, "focused-thread-mode": [true, false].includes(focusedThreadMode) ? (focusedThreadMode ? 'true' : 'false') : undefined, "focused-thread-dialog-variant": focusedThreadDialogVariant, "custom-actions": [true, false].includes(customActions) ? (customActions ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "embed-mode": [true, false].includes(embedMode) ? (embedMode ? 'true' : 'false') : undefined, "enable-url-navigation": [true, false].includes(enableUrlNavigation) ? (enableUrlNavigation ? 'true' : 'false') : undefined, "url-navigation": [true, false].includes(urlNavigation) ? (urlNavigation ? 'true' : 'false') : undefined, "query-params-comments": [true, false].includes(queryParamsComments) ? (queryParamsComments ? 'true' : 'false') : undefined, "page-mode": [true, false].includes(pageMode) ? (pageMode ? 'true' : 'false') : undefined, "current-location-suffix": [true, false].includes(currentLocationSuffix) ? (currentLocationSuffix ? 'true' : 'false') : undefined, "filter-config": filterConfig ? JSON.stringify(filterConfig) : undefined, "group-config": groupConfig ? JSON.stringify(groupConfig) : undefined, filters: filters ? JSON.stringify(filters) : undefined, "exclude-location-ids": excludeLocationIds ? JSON.stringify(excludeLocationIds) : undefined, variant: variant, "page-mode-composer-variant": pageModeComposerVariant, "dialog-variant": dialogVariant, "sort-data": sortData, "search-placeholder": searchPlaceholder, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "floating-mode": [true, false].includes(embedMode) ? (embedMode ? 'true' : 'false') : undefined, "filter-option-layout": filterOptionLayout, "filter-count": [true, false].includes(filterCount) ? (filterCount ? 'true' : 'false') : undefined, "full-expanded": [true, false].includes(fullExpanded) ? (fullExpanded ? 'true' : 'false') : undefined, "system-filters-operator": systemFiltersOperator }));
+    return (React.createElement("velt-comments-sidebar", { ref: ref, position: position, "filter-panel-layout": filterPanelLayout, "focused-thread-mode": [true, false].includes(focusedThreadMode) ? (focusedThreadMode ? 'true' : 'false') : undefined, "focused-thread-dialog-variant": focusedThreadDialogVariant, "custom-actions": [true, false].includes(customActions) ? (customActions ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "embed-mode": [true, false].includes(embedMode) ? (embedMode ? 'true' : 'false') : undefined, "enable-url-navigation": [true, false].includes(enableUrlNavigation) ? (enableUrlNavigation ? 'true' : 'false') : undefined, "url-navigation": [true, false].includes(urlNavigation) ? (urlNavigation ? 'true' : 'false') : undefined, "query-params-comments": [true, false].includes(queryParamsComments) ? (queryParamsComments ? 'true' : 'false') : undefined, "page-mode": [true, false].includes(pageMode) ? (pageMode ? 'true' : 'false') : undefined, "current-location-suffix": [true, false].includes(currentLocationSuffix) ? (currentLocationSuffix ? 'true' : 'false') : undefined, "filter-config": filterConfig ? JSON.stringify(filterConfig) : undefined, "group-config": groupConfig ? JSON.stringify(groupConfig) : undefined, filters: filters ? JSON.stringify(filters) : undefined, "exclude-location-ids": excludeLocationIds ? JSON.stringify(excludeLocationIds) : undefined, variant: variant, "page-mode-composer-variant": pageModeComposerVariant, "dialog-variant": dialogVariant, "sort-data": sortData, "search-placeholder": searchPlaceholder, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "floating-mode": [true, false].includes(embedMode) ? (embedMode ? 'true' : 'false') : undefined, "filter-option-layout": filterOptionLayout, "filter-count": [true, false].includes(filterCount) ? (filterCount ? 'true' : 'false') : undefined, "full-expanded": [true, false].includes(fullExpanded) ? (fullExpanded ? 'true' : 'false') : undefined, "system-filters-operator": systemFiltersOperator, "sidebar-button-count-type": sidebarButtonCountType }));
 };
 
 var SnippylyCommentTool = function (props) {
-    var targetCommentElementId = props.targetCommentElementId, targetElementId = props.targetElementId, onCommentModeChange = props.onCommentModeChange, sourceId = props.sourceId, children = props.children, darkMode = props.darkMode, variant = props.variant, shadowDom = props.shadowDom;
+    var targetCommentElementId = props.targetCommentElementId, targetElementId = props.targetElementId, onCommentModeChange = props.onCommentModeChange, sourceId = props.sourceId, children = props.children, darkMode = props.darkMode, variant = props.variant, shadowDom = props.shadowDom, context = props.context, contextOptions = props.contextOptions, documentId = props.documentId, folderId = props.folderId, locationId = props.locationId;
     var ref = useRef();
     var onCommentModeChangeRef = useRef(onCommentModeChange);
     // Update the ref to always point to the latest callback function
@@ -472,7 +503,7 @@ var SnippylyCommentTool = function (props) {
             }
         };
     }, []);
-    return (React.createElement("velt-comment-tool", { ref: ref, "target-comment-element-id": targetCommentElementId, "target-element-id": targetElementId, "source-id": sourceId, variant: variant, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
+    return (React.createElement("velt-comment-tool", { ref: ref, "target-comment-element-id": targetCommentElementId, "target-element-id": targetElementId, "source-id": sourceId, variant: variant, context: JSON.stringify(context), "context-options": JSON.stringify(contextOptions), "location-id": locationId, "document-id": documentId, "folder-id": folderId, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
 };
 
 var SnippylyCursor = function (props) {
@@ -513,8 +544,8 @@ var SnippylyCursor = function (props) {
 };
 
 var SnippylyHuddle = function (props) {
-    var chat = props.chat, flockModeOnAvatarClick = props.flockModeOnAvatarClick;
-    return (React.createElement("velt-huddle", { chat: [true, false].includes(chat) ? (chat ? 'true' : 'false') : undefined, "flock-mode-on-avatar-click": [true, false].includes(flockModeOnAvatarClick) ? (flockModeOnAvatarClick ? 'true' : 'false') : undefined }));
+    var chat = props.chat, flockModeOnAvatarClick = props.flockModeOnAvatarClick, serverFallback = props.serverFallback;
+    return (React.createElement("velt-huddle", { chat: [true, false].includes(chat) ? (chat ? 'true' : 'false') : undefined, "flock-mode-on-avatar-click": [true, false].includes(flockModeOnAvatarClick) ? (flockModeOnAvatarClick ? 'true' : 'false') : undefined, "server-fallback": [true, false].includes(serverFallback) ? (serverFallback ? 'true' : 'false') : undefined }));
 };
 
 var SnippylyHuddleTool = function (props) {
@@ -582,7 +613,7 @@ var SnippylyPresence = function (props) {
 };
 
 var SnippylyRecorderControlPanel = function (props) {
-    var mode = props.mode, panelId = props.panelId, onRecordedData = props.onRecordedData, recordingCountdown = props.recordingCountdown, recordingTranscription = props.recordingTranscription, videoEditor = props.videoEditor, settingsEmbedded = props.settingsEmbedded, autoOpenVideoEditor = props.autoOpenVideoEditor, playVideoInFullScreen = props.playVideoInFullScreen;
+    var mode = props.mode, panelId = props.panelId, onRecordedData = props.onRecordedData, recordingCountdown = props.recordingCountdown, recordingTranscription = props.recordingTranscription, videoEditor = props.videoEditor, settingsEmbedded = props.settingsEmbedded, autoOpenVideoEditor = props.autoOpenVideoEditor, playVideoInFullScreen = props.playVideoInFullScreen, retakeOnVideoEditor = props.retakeOnVideoEditor;
     var ref = useRef();
     var onRecordedDataRef = useRef(onRecordedData);
     // Update the ref to always point to the latest callback function
@@ -608,7 +639,7 @@ var SnippylyRecorderControlPanel = function (props) {
             }
         };
     }, []);
-    return (React.createElement("velt-recorder-control-panel", { ref: ref, mode: mode, "panel-id": panelId, "recording-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined, "recording-transcription": [true, false].includes(recordingTranscription) ? (recordingTranscription ? 'true' : 'false') : undefined, "video-editor": [true, false].includes(videoEditor) ? (videoEditor ? 'true' : 'false') : undefined, "settings-embedded": [true, false].includes(settingsEmbedded) ? (settingsEmbedded ? 'true' : 'false') : undefined, "auto-open-video-editor": [true, false].includes(autoOpenVideoEditor) ? (autoOpenVideoEditor ? 'true' : 'false') : undefined, "play-video-in-full-screen": [true, false].includes(playVideoInFullScreen) ? (playVideoInFullScreen ? 'true' : 'false') : undefined }));
+    return (React.createElement("velt-recorder-control-panel", { ref: ref, mode: mode, "panel-id": panelId, "retake-on-video-editor": [true, false].includes(retakeOnVideoEditor) ? (retakeOnVideoEditor ? 'true' : 'false') : undefined, "recording-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined, "recording-transcription": [true, false].includes(recordingTranscription) ? (recordingTranscription ? 'true' : 'false') : undefined, "video-editor": [true, false].includes(videoEditor) ? (videoEditor ? 'true' : 'false') : undefined, "settings-embedded": [true, false].includes(settingsEmbedded) ? (settingsEmbedded ? 'true' : 'false') : undefined, "auto-open-video-editor": [true, false].includes(autoOpenVideoEditor) ? (autoOpenVideoEditor ? 'true' : 'false') : undefined, "play-video-in-full-screen": [true, false].includes(playVideoInFullScreen) ? (playVideoInFullScreen ? 'true' : 'false') : undefined }));
 };
 
 var SnippylyRecorderNotes = function (props) {
@@ -617,7 +648,7 @@ var SnippylyRecorderNotes = function (props) {
 };
 
 var SnippylyRecorderPlayer = function (props) {
-    var recorderId = props.recorderId, onDelete = props.onDelete, showSummary = props.showSummary, summary = props.summary, shadowDom = props.shadowDom, videoEditor = props.videoEditor, playVideoInFullScreen = props.playVideoInFullScreen;
+    var recorderId = props.recorderId, onDelete = props.onDelete, showSummary = props.showSummary, summary = props.summary, shadowDom = props.shadowDom, videoEditor = props.videoEditor, playVideoInFullScreen = props.playVideoInFullScreen, retakeOnVideoEditor = props.retakeOnVideoEditor;
     var ref = useRef();
     var onDeleteRef = useRef(onDelete);
     // Update the ref to always point to the latest callback function
@@ -643,16 +674,16 @@ var SnippylyRecorderPlayer = function (props) {
             }
         };
     }, []);
-    return (React.createElement("velt-recorder-player", { ref: ref, "recorder-id": recorderId, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "show-summary": [true, false].includes(showSummary) ? (showSummary ? 'true' : 'false') : undefined, summary: [true, false].includes(summary) ? (summary ? 'true' : 'false') : undefined, "video-editor": [true, false].includes(videoEditor) ? (videoEditor ? 'true' : 'false') : undefined, "play-video-in-full-screen": [true, false].includes(playVideoInFullScreen) ? (playVideoInFullScreen ? 'true' : 'false') : undefined }));
+    return (React.createElement("velt-recorder-player", { ref: ref, "recorder-id": recorderId, "retake-on-video-editor": [true, false].includes(retakeOnVideoEditor) ? (retakeOnVideoEditor ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "show-summary": [true, false].includes(showSummary) ? (showSummary ? 'true' : 'false') : undefined, summary: [true, false].includes(summary) ? (summary ? 'true' : 'false') : undefined, "video-editor": [true, false].includes(videoEditor) ? (videoEditor ? 'true' : 'false') : undefined, "play-video-in-full-screen": [true, false].includes(playVideoInFullScreen) ? (playVideoInFullScreen ? 'true' : 'false') : undefined }));
 };
 
 var SnippylyRecorderTool = function (props) {
-    var type = props.type, panelId = props.panelId, buttonLabel = props.buttonLabel, children = props.children, darkMode = props.darkMode, shadowDom = props.shadowDom, recordingCountdown = props.recordingCountdown;
-    return (React.createElement("velt-recorder-tool", { type: type, "panel-id": panelId, "button-label": buttonLabel, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "recording-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined }, children));
+    var type = props.type, panelId = props.panelId, buttonLabel = props.buttonLabel, children = props.children, darkMode = props.darkMode, shadowDom = props.shadowDom, recordingCountdown = props.recordingCountdown, variant = props.variant, retakeOnVideoEditor = props.retakeOnVideoEditor;
+    return (React.createElement("velt-recorder-tool", { type: type, "panel-id": panelId, "button-label": buttonLabel, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "retake-on-video-editor": [true, false].includes(retakeOnVideoEditor) ? (retakeOnVideoEditor ? 'true' : 'false') : undefined, variant: variant, "recording-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined }, children));
 };
 
 var SnippylySidebarButton = function (props) {
-    var tooltipText = props.tooltipText, children = props.children, darkMode = props.darkMode, shadowDom = props.shadowDom, floatingMode = props.floatingMode, pageMode = props.pageMode, sortData = props.sortData, urlNavigation = props.urlNavigation, currentLocationSuffix = props.currentLocationSuffix, filterConfig = props.filterConfig, groupConfig = props.groupConfig, filters = props.filters, excludeLocationIds = props.excludeLocationIds, dialogVariant = props.dialogVariant, pageModeComposerVariant = props.pageModeComposerVariant, sidebarShadowDom = props.sidebarShadowDom, sidebarVariant = props.sidebarVariant, position = props.position, onCommentClick = props.onCommentClick, onSidebarOpen = props.onSidebarOpen, filterPanelLayout = props.filterPanelLayout;
+    var tooltipText = props.tooltipText, children = props.children, darkMode = props.darkMode, shadowDom = props.shadowDom, floatingMode = props.floatingMode, pageMode = props.pageMode, sortData = props.sortData, urlNavigation = props.urlNavigation, currentLocationSuffix = props.currentLocationSuffix, filterConfig = props.filterConfig, groupConfig = props.groupConfig, filters = props.filters, excludeLocationIds = props.excludeLocationIds, dialogVariant = props.dialogVariant, pageModeComposerVariant = props.pageModeComposerVariant, sidebarShadowDom = props.sidebarShadowDom, sidebarVariant = props.sidebarVariant, position = props.position, onCommentClick = props.onCommentClick, onSidebarOpen = props.onSidebarOpen, filterPanelLayout = props.filterPanelLayout, sidebarButtonCountType = props.sidebarButtonCountType;
     var ref = useRef();
     var onSidebarOpenRef = useRef(onSidebarOpen);
     var onCommentClickRef = useRef(onCommentClick);
@@ -688,7 +719,7 @@ var SnippylySidebarButton = function (props) {
             }
         };
     });
-    return (React.createElement("velt-sidebar-button", { "tooltip-text": tooltipText, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "floating-mode": [true, false].includes(floatingMode) ? (floatingMode ? 'true' : 'false') : undefined, ref: ref, "page-mode": [true, false].includes(pageMode) ? (pageMode ? 'true' : 'false') : undefined, "sort-data": sortData, "url-navigation": [true, false].includes(urlNavigation) ? (urlNavigation ? 'true' : 'false') : undefined, "current-location-suffix": [true, false].includes(currentLocationSuffix) ? (currentLocationSuffix ? 'true' : 'false') : undefined, "filter-config": filterConfig ? JSON.stringify(filterConfig) : undefined, "group-config": groupConfig ? JSON.stringify(groupConfig) : undefined, filters: filters ? JSON.stringify(filters) : undefined, "exclude-location-ids": excludeLocationIds ? JSON.stringify(excludeLocationIds) : undefined, "dialog-variant": dialogVariant, "page-mode-composer-variant": pageModeComposerVariant, "sidebar-shadow-dom": [true, false].includes(sidebarShadowDom) ? (sidebarShadowDom ? 'true' : 'false') : undefined, "sidebar-variant": sidebarVariant, position: position, "filter-panel-layout": filterPanelLayout }, children));
+    return (React.createElement("velt-sidebar-button", { "tooltip-text": tooltipText, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "floating-mode": [true, false].includes(floatingMode) ? (floatingMode ? 'true' : 'false') : undefined, ref: ref, "page-mode": [true, false].includes(pageMode) ? (pageMode ? 'true' : 'false') : undefined, "sort-data": sortData, "url-navigation": [true, false].includes(urlNavigation) ? (urlNavigation ? 'true' : 'false') : undefined, "current-location-suffix": [true, false].includes(currentLocationSuffix) ? (currentLocationSuffix ? 'true' : 'false') : undefined, "filter-config": filterConfig ? JSON.stringify(filterConfig) : undefined, "group-config": groupConfig ? JSON.stringify(groupConfig) : undefined, filters: filters ? JSON.stringify(filters) : undefined, "exclude-location-ids": excludeLocationIds ? JSON.stringify(excludeLocationIds) : undefined, "dialog-variant": dialogVariant, "page-mode-composer-variant": pageModeComposerVariant, "sidebar-shadow-dom": [true, false].includes(sidebarShadowDom) ? (sidebarShadowDom ? 'true' : 'false') : undefined, "sidebar-variant": sidebarVariant, position: position, "filter-panel-layout": filterPanelLayout, "sidebar-button-count-type": sidebarButtonCountType }, children));
 };
 
 var VeltCommentsSidebarButton = function (props) {
@@ -841,7 +872,7 @@ var VeltCommentThread = function (props) {
 };
 
 var VeltNotificationsTool = function (props) {
-    var children = props.children, darkMode = props.darkMode, onNotificationClick = props.onNotificationClick, shadowDom = props.shadowDom, panelShadowDom = props.panelShadowDom, variant = props.variant, maxDays = props.maxDays, tabConfig = props.tabConfig, panelOpenMode = props.panelOpenMode, panelVariant = props.panelVariant, readNotificationsOnForYouTab = props.readNotificationsOnForYouTab;
+    var children = props.children, darkMode = props.darkMode, onNotificationClick = props.onNotificationClick, shadowDom = props.shadowDom, panelShadowDom = props.panelShadowDom, variant = props.variant, maxDays = props.maxDays, tabConfig = props.tabConfig, panelOpenMode = props.panelOpenMode, panelVariant = props.panelVariant, readNotificationsOnForYouTab = props.readNotificationsOnForYouTab, settings = props.settings, selfNotifications = props.selfNotifications;
     var ref = useRef();
     var onNotificationClickRef = useRef(onNotificationClick);
     // Update the ref to always point to the latest callback function
@@ -867,11 +898,11 @@ var VeltNotificationsTool = function (props) {
             }
         };
     }, []);
-    return (React.createElement("velt-notifications-tool", { ref: ref, "panel-open-mode": panelOpenMode, panelVariant: panelVariant, "tab-config": JSON.stringify(tabConfig), variant: variant, "max-days": (maxDays && maxDays > 0) ? maxDays + '' : undefined, "panel-shadow-dom": [true, false].includes(panelShadowDom) ? (panelShadowDom ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "read-notifications-on-for-you-tab": [true, false].includes(readNotificationsOnForYouTab) ? (readNotificationsOnForYouTab ? 'true' : 'false') : undefined }, children));
+    return (React.createElement("velt-notifications-tool", { ref: ref, "panel-open-mode": panelOpenMode, panelVariant: panelVariant, "tab-config": JSON.stringify(tabConfig), variant: variant, "max-days": (maxDays && maxDays > 0) ? maxDays + '' : undefined, "panel-shadow-dom": [true, false].includes(panelShadowDom) ? (panelShadowDom ? 'true' : 'false') : undefined, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, settings: [true, false].includes(settings) ? (settings ? 'true' : 'false') : undefined, "self-notifications": [true, false].includes(selfNotifications) ? (selfNotifications ? 'true' : 'false') : undefined, "read-notifications-on-for-you-tab": [true, false].includes(readNotificationsOnForYouTab) ? (readNotificationsOnForYouTab ? 'true' : 'false') : undefined }, children));
 };
 
 var VeltNotificationsPanel = function (props) {
-    var darkMode = props.darkMode, onNotificationClick = props.onNotificationClick, shadowDom = props.shadowDom, tabConfig = props.tabConfig, variant = props.variant, readNotificationsOnForYouTab = props.readNotificationsOnForYouTab, panelOpenMode = props.panelOpenMode;
+    var darkMode = props.darkMode, onNotificationClick = props.onNotificationClick, shadowDom = props.shadowDom, tabConfig = props.tabConfig, variant = props.variant, readNotificationsOnForYouTab = props.readNotificationsOnForYouTab, panelOpenMode = props.panelOpenMode, settings = props.settings, selfNotifications = props.selfNotifications;
     var ref = useRef();
     var onNotificationClickRef = useRef(onNotificationClick);
     // Update the ref to always point to the latest callback function
@@ -897,7 +928,7 @@ var VeltNotificationsPanel = function (props) {
             }
         };
     }, []);
-    return (React.createElement("velt-notifications-panel", { ref: ref, variant: variant, "tab-config": JSON.stringify(tabConfig), "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "read-notifications-on-for-you-tab": [true, false].includes(readNotificationsOnForYouTab) ? (readNotificationsOnForYouTab ? 'true' : 'false') : undefined, "panel-open-mode": panelOpenMode }));
+    return (React.createElement("velt-notifications-panel", { ref: ref, variant: variant, "tab-config": JSON.stringify(tabConfig), "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, settings: [true, false].includes(settings) ? (settings ? 'true' : 'false') : undefined, "self-notifications": [true, false].includes(selfNotifications) ? (selfNotifications ? 'true' : 'false') : undefined, "read-notifications-on-for-you-tab": [true, false].includes(readNotificationsOnForYouTab) ? (readNotificationsOnForYouTab ? 'true' : 'false') : undefined, "panel-open-mode": panelOpenMode }));
 };
 
 var VeltNotificationsHistoryPanel = function (props) {
@@ -1400,13 +1431,13 @@ var VeltAutocomplete = function (props) {
 };
 
 var VeltInlineCommentsSection = function (props) {
-    var config = props.config, children = props.children, darkMode = props.darkMode, variant = props.variant, shadowDom = props.shadowDom, dialogVariant = props.dialogVariant, targetInlineCommentElementId = props.targetInlineCommentElementId, targetCommentElementId = props.targetCommentElementId, targetElementId = props.targetElementId, multiThread = props.multiThread, sortData = props.sortData, composerVariant = props.composerVariant, composerPosition = props.composerPosition, sortBy = props.sortBy, sortOrder = props.sortOrder, fullExpanded = props.fullExpanded;
-    return (React.createElement("velt-inline-comments-section", { "target-inline-comment-element-id": targetInlineCommentElementId, "target-comment-element-id": targetCommentElementId, "target-element-id": targetElementId, config: JSON.stringify(config), variant: variant, "dialog-variant": dialogVariant, "sort-data": sortData, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "multi-thread": [true, false].includes(multiThread) ? (multiThread ? 'true' : 'false') : undefined, "composer-variant": composerVariant, "composer-position": composerPosition, "sort-by": sortBy, "sort-order": sortOrder, "full-expanded": [true, false].includes(fullExpanded) ? (fullExpanded ? 'true' : 'false') : undefined }, children));
+    var config = props.config, children = props.children, darkMode = props.darkMode, variant = props.variant, shadowDom = props.shadowDom, dialogVariant = props.dialogVariant, targetInlineCommentElementId = props.targetInlineCommentElementId, targetCommentElementId = props.targetCommentElementId, targetElementId = props.targetElementId, multiThread = props.multiThread, sortData = props.sortData, composerVariant = props.composerVariant, composerPosition = props.composerPosition, sortBy = props.sortBy, sortOrder = props.sortOrder, fullExpanded = props.fullExpanded, context = props.context, contextOptions = props.contextOptions, documentId = props.documentId, folderId = props.folderId, locationId = props.locationId;
+    return (React.createElement("velt-inline-comments-section", { "target-inline-comment-element-id": targetInlineCommentElementId, "target-comment-element-id": targetCommentElementId, "target-element-id": targetElementId, config: JSON.stringify(config), variant: variant, "dialog-variant": dialogVariant, "sort-data": sortData, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined, "multi-thread": [true, false].includes(multiThread) ? (multiThread ? 'true' : 'false') : undefined, "composer-variant": composerVariant, "composer-position": composerPosition, "sort-by": sortBy, "sort-order": sortOrder, "full-expanded": [true, false].includes(fullExpanded) ? (fullExpanded ? 'true' : 'false') : undefined, context: JSON.stringify(context), "context-options": JSON.stringify(contextOptions), "location-id": locationId, "document-id": documentId, "folder-id": folderId }, children));
 };
 
 var VeltCommentPin = function (props) {
-    var children = props.children, annotationId = props.annotationId, multiThreadAnnotationId = props.multiThreadAnnotationId, variant = props.variant;
-    return (React.createElement("velt-comment-pin", { "annotation-id": annotationId, "multi-thread-annotation-id": multiThreadAnnotationId, variant: variant }, children));
+    var children = props.children, annotationId = props.annotationId, multiThreadAnnotationId = props.multiThreadAnnotationId, variant = props.variant, context = props.context, contextOptions = props.contextOptions, documentId = props.documentId, folderId = props.folderId, locationId = props.locationId;
+    return (React.createElement("velt-comment-pin", { "annotation-id": annotationId, "multi-thread-annotation-id": multiThreadAnnotationId, variant: variant, context: JSON.stringify(context), "context-options": JSON.stringify(contextOptions), "location-id": locationId, "document-id": documentId, "folder-id": folderId }, children));
 };
 
 var VeltCommentText = function (props) {
@@ -1481,12 +1512,23 @@ var VeltSingleEditorModePanel = function (props) {
     return (React.createElement("velt-single-editor-mode-panel", { ref: ref, variant: variant, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
 };
 
+var VeltVideoEditor = function (props) {
+    var darkMode = props.darkMode, variant = props.variant, blob = props.blob, url = props.url, annotationId = props.annotationId, rest = __rest(props, ["darkMode", "variant", "blob", "url", "annotationId"]);
+    var ref = useRef(null);
+    useEffect(function () {
+        if (ref.current && blob) {
+            ref.current.blob = blob;
+        }
+    }, [blob]);
+    return (React.createElement("velt-video-editor", __assign({ ref: ref, variant: variant, "dark-mode": darkMode ? 'true' : undefined, url: url, "annotation-id": annotationId }, rest)));
+};
+
 var VeltWireframe = function (props) {
     var children = props.children;
     return (React.createElement("velt-wireframe", { style: { display: 'none' } }, children));
 };
 
-var validProps = ['veltIf', 'veltClass', 'className'];
+var validProps = ['veltIf', 'veltClass', 'className', 'variant'];
 var transformWireframeProps = function (props) {
     try {
         var transformedProps_1 = {};
@@ -2410,6 +2452,33 @@ var VeltCommentDialogNavigationButton = function (props) {
     return (React.createElement("velt-comment-dialog-navigation-button-wireframe", __assign({}, transformedProps), children));
 };
 
+var VeltCommentDialogReplyAvatarsListItem = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comment-dialog-reply-avatars-list-item-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCommentDialogReplyAvatarsList = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comment-dialog-reply-avatars-list-wireframe", __assign({}, transformedProps), children));
+};
+VeltCommentDialogReplyAvatarsList.Item = VeltCommentDialogReplyAvatarsListItem;
+
+var VeltCommentDialogReplyAvatarsRemainingCount = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comment-dialog-reply-avatars-remaining-count-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCommentDialogReplyAvatars = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comment-dialog-reply-avatars-wireframe", __assign({}, transformedProps), children));
+};
+VeltCommentDialogReplyAvatars.List = VeltCommentDialogReplyAvatarsList;
+VeltCommentDialogReplyAvatars.RemainingCount = VeltCommentDialogReplyAvatarsRemainingCount;
+
 var VeltCommentDialogWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
     var transformedProps = transformWireframeProps(remainingProps);
@@ -2444,6 +2513,7 @@ VeltCommentDialogWireframe.CustomAnnotationDropdown = VeltCommentDialogCustomAnn
 VeltCommentDialogWireframe.DeleteButton = VeltCommentDialogDeleteButton;
 VeltCommentDialogWireframe.CloseButton = VeltCommentDialogCloseButton;
 VeltCommentDialogWireframe.NavigationButton = VeltCommentDialogNavigationButton;
+VeltCommentDialogWireframe.ReplyAvatars = VeltCommentDialogReplyAvatars;
 
 var VeltCommentsSidebarCloseButton = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
@@ -2517,9 +2587,9 @@ var VeltCommentsSidebarFilterSearchHiddenCount = function (props) {
 };
 
 var VeltCommentsSidebarFilterSearchInput = function (props) {
-    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var children = props.children, placeholder = props.placeholder, remainingProps = __rest(props, ["children", "placeholder"]);
     var transformedProps = transformWireframeProps(remainingProps);
-    return (React.createElement("velt-comments-sidebar-filter-search-input-wireframe", __assign({}, transformedProps), children));
+    return (React.createElement("velt-comments-sidebar-filter-search-input-wireframe", __assign({}, transformedProps, { placeholder: placeholder }), children));
 };
 
 var VeltCommentsSidebarFilterSearchTagsItemName = function (props) {
@@ -2550,9 +2620,9 @@ var VeltCommentsSidebarFilterSearchTags = function (props) {
 VeltCommentsSidebarFilterSearchTags.Item = VeltCommentsSidebarFilterSearchTagsItem;
 
 var VeltCommentsSidebarFilterSearch = function (props) {
-    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var children = props.children, placeholder = props.placeholder, remainingProps = __rest(props, ["children", "placeholder"]);
     var transformedProps = transformWireframeProps(remainingProps);
-    return (React.createElement("velt-comments-sidebar-filter-search-wireframe", __assign({}, transformedProps), children));
+    return (React.createElement("velt-comments-sidebar-filter-search-wireframe", __assign({}, transformedProps, { placeholder: placeholder }), children));
 };
 VeltCommentsSidebarFilterSearch.DropdownIcon = VeltCommentsSidebarFilterSearchDropdownIcon;
 VeltCommentsSidebarFilterSearch.Tags = VeltCommentsSidebarFilterSearchTags;
@@ -2678,6 +2748,34 @@ VeltCommentsSidebarFilterTagged.Name = VeltCommentsSidebarFilterName;
 VeltCommentsSidebarFilterTagged.Item = VeltCommentsSidebarFilterItem;
 VeltCommentsSidebarFilterTagged.Search = VeltCommentsSidebarFilterSearch;
 
+var VeltCommentsSidebarFilterDocument = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comments-sidebar-filter-document-wireframe", __assign({}, transformedProps), children));
+};
+VeltCommentsSidebarFilterDocument.Name = VeltCommentsSidebarFilterName;
+VeltCommentsSidebarFilterDocument.Item = VeltCommentsSidebarFilterItem;
+VeltCommentsSidebarFilterDocument.ViewAll = VeltCommentsSidebarFilterViewAll;
+VeltCommentsSidebarFilterDocument.Search = VeltCommentsSidebarFilterSearch;
+
+var VeltCommentsSidebarFilterCustom = function (props) {
+    var children = props.children, id = props.id, remainingProps = __rest(props, ["children", "id"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comments-sidebar-filter-custom-wireframe", __assign({ id: id }, transformedProps), children));
+};
+VeltCommentsSidebarFilterCustom.Name = VeltCommentsSidebarFilterName;
+VeltCommentsSidebarFilterCustom.Item = VeltCommentsSidebarFilterItem;
+VeltCommentsSidebarFilterCustom.Search = VeltCommentsSidebarFilterSearch;
+
+var VeltCommentsSidebarFilterInvolved = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comments-sidebar-filter-involved-wireframe", __assign({}, transformedProps), children));
+};
+VeltCommentsSidebarFilterInvolved.Name = VeltCommentsSidebarFilterName;
+VeltCommentsSidebarFilterInvolved.Item = VeltCommentsSidebarFilterItem;
+VeltCommentsSidebarFilterInvolved.Search = VeltCommentsSidebarFilterSearch;
+
 var VeltCommentsSidebarFilter = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
     var transformedProps = transformWireframeProps(remainingProps);
@@ -2699,6 +2797,9 @@ VeltCommentsSidebarFilter.Item = VeltCommentsSidebarFilterItem;
 VeltCommentsSidebarFilter.Status = VeltCommentsSidebarFilterStatus;
 VeltCommentsSidebarFilter.ResetButton = VeltCommentsSidebarFilterResetButton;
 VeltCommentsSidebarFilter.Search = VeltCommentsSidebarFilterSearch;
+VeltCommentsSidebarFilter.Document = VeltCommentsSidebarFilterDocument;
+VeltCommentsSidebarFilter.Custom = VeltCommentsSidebarFilterCustom;
+VeltCommentsSidebarFilter.Involved = VeltCommentsSidebarFilterInvolved;
 
 var VeltCommentsSidebarFilterButton = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
@@ -2787,6 +2888,33 @@ var VeltCommentsSidebarLocationFilterDropdown = function (props) {
 VeltCommentsSidebarLocationFilterDropdown.Trigger = VeltCommentsSidebarLocationFilterDropdownTrigger;
 VeltCommentsSidebarLocationFilterDropdown.Content = VeltCommentsSidebarLocationFilterDropdownContent;
 
+var VeltCommentsSidebarDocumentFilterDropdownContent = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comments-sidebar-document-filter-dropdown-content-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCommentsSidebarDocumentFilterDropdownTriggerLabel = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comments-sidebar-document-filter-dropdown-trigger-label-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCommentsSidebarDocumentFilterDropdownTrigger = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comments-sidebar-document-filter-dropdown-trigger-wireframe", __assign({}, transformedProps), children));
+};
+VeltCommentsSidebarDocumentFilterDropdownTrigger.Label = VeltCommentsSidebarDocumentFilterDropdownTriggerLabel;
+
+var VeltCommentsSidebarDocumentFilterDropdownWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-comments-sidebar-document-filter-dropdown-wireframe", __assign({}, transformedProps), children));
+};
+VeltCommentsSidebarDocumentFilterDropdownWireframe.Trigger = VeltCommentsSidebarDocumentFilterDropdownTrigger;
+VeltCommentsSidebarDocumentFilterDropdownWireframe.Content = VeltCommentsSidebarDocumentFilterDropdownContent;
+
 var VeltCommentsSidebarMinimalActionsDropdownContentMarkAllReadWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
     var transformedProps = transformWireframeProps(remainingProps);
@@ -2903,9 +3031,9 @@ var VeltCommentsSidebarPanel = function (props) {
 };
 
 var VeltCommentsSidebarSearch = function (props) {
-    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var children = props.children, placeholder = props.placeholder, remainingProps = __rest(props, ["children", "placeholder"]);
     var transformedProps = transformWireframeProps(remainingProps);
-    return (React.createElement("velt-comments-sidebar-search-wireframe", __assign({}, transformedProps), children));
+    return (React.createElement("velt-comments-sidebar-search-wireframe", __assign({}, transformedProps, { placeholder: placeholder }), children));
 };
 
 var VeltCommentsSidebarSkeleton = function (props) {
@@ -3054,6 +3182,7 @@ VeltCommentsSidebarWireframe.Skeleton = VeltCommentsSidebarSkeleton;
 VeltCommentsSidebarWireframe.Panel = VeltCommentsSidebarPanel;
 VeltCommentsSidebarWireframe.MinimalFilterDropdown = VeltCommentsSidebarMinimalFilterDropdown;
 VeltCommentsSidebarWireframe.LocationFilterDropdown = VeltCommentsSidebarLocationFilterDropdown;
+VeltCommentsSidebarWireframe.DocumentFilterDropdown = VeltCommentsSidebarDocumentFilterDropdownWireframe;
 VeltCommentsSidebarWireframe.MinimalActionsDropdown = VeltCommentsSidebarMinimalActionsDropdownWireframe;
 VeltCommentsSidebarWireframe.ResetFilterButton = VeltCommentsSidebarResetFilterButtonWireframe;
 VeltCommentsSidebarWireframe.ActionButton = VeltCommentsSidebarActionButton;
@@ -3763,6 +3892,157 @@ var VeltNotificationsPanelSkeletonWireframe = function (props) {
     return (React.createElement("velt-notifications-panel-skeleton-wireframe", __assign({}, transformedProps), children));
 };
 
+var VeltNotificationsPanelSettingsButtonWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-button-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsDescriptionWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-description-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsBackButtonWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-back-button-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsFooterWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-footer-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsHeaderTitleWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-header-title-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsHeaderWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-header-wireframe", __assign({}, transformedProps), children));
+};
+VeltNotificationsPanelSettingsHeaderWireframe.Title = VeltNotificationsPanelSettingsHeaderTitleWireframe;
+
+var VeltNotificationsPanelSettingsAccordionTriggerSelectedValueWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-trigger-selected-value-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsAccordionTriggerLabelWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-trigger-label-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsAccordionTriggerIconWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-trigger-icon-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsAccordionTriggerWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-trigger-wireframe", __assign({}, transformedProps), children));
+};
+VeltNotificationsPanelSettingsAccordionTriggerWireframe.SelectedValue = VeltNotificationsPanelSettingsAccordionTriggerSelectedValueWireframe;
+VeltNotificationsPanelSettingsAccordionTriggerWireframe.Label = VeltNotificationsPanelSettingsAccordionTriggerLabelWireframe;
+VeltNotificationsPanelSettingsAccordionTriggerWireframe.Icon = VeltNotificationsPanelSettingsAccordionTriggerIconWireframe;
+
+var VeltNotificationsPanelSettingsAccordionContentItemLabelWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-content-item-label-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsAccordionContentItemIconWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-content-item-icon-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsAccordionContentItemWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-content-item-wireframe", __assign({}, transformedProps), children));
+};
+VeltNotificationsPanelSettingsAccordionContentItemWireframe.Icon = VeltNotificationsPanelSettingsAccordionContentItemIconWireframe;
+VeltNotificationsPanelSettingsAccordionContentItemWireframe.Label = VeltNotificationsPanelSettingsAccordionContentItemLabelWireframe;
+
+var VeltNotificationsPanelSettingsAccordionContentWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-content-wireframe", __assign({}, transformedProps), children));
+};
+VeltNotificationsPanelSettingsAccordionContentWireframe.Item = VeltNotificationsPanelSettingsAccordionContentItemWireframe;
+
+var VeltNotificationsPanelSettingsAccordionWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-accordion-wireframe", __assign({}, transformedProps), children));
+};
+VeltNotificationsPanelSettingsAccordionWireframe.Trigger = VeltNotificationsPanelSettingsAccordionTriggerWireframe;
+VeltNotificationsPanelSettingsAccordionWireframe.Content = VeltNotificationsPanelSettingsAccordionContentWireframe;
+
+var VeltNotificationsPanelSettingsListWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-list-wireframe", __assign({}, transformedProps), children));
+};
+VeltNotificationsPanelSettingsListWireframe.Accordion = VeltNotificationsPanelSettingsAccordionWireframe;
+
+var VeltNotificationsPanelSettingsMuteAllDescriptionWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-mute-all-description-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsMuteAllTitleWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-mute-all-title-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsMuteAllToggleWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-mute-all-toggle-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsTitleWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-title-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltNotificationsPanelSettingsWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-settings-wireframe", __assign({}, transformedProps), children));
+};
+VeltNotificationsPanelSettingsWireframe.BackButton = VeltNotificationsPanelSettingsBackButtonWireframe;
+VeltNotificationsPanelSettingsWireframe.Description = VeltNotificationsPanelSettingsDescriptionWireframe;
+VeltNotificationsPanelSettingsWireframe.Footer = VeltNotificationsPanelSettingsFooterWireframe;
+VeltNotificationsPanelSettingsWireframe.Header = VeltNotificationsPanelSettingsHeaderWireframe;
+VeltNotificationsPanelSettingsWireframe.List = VeltNotificationsPanelSettingsListWireframe;
+VeltNotificationsPanelSettingsWireframe.MuteAllDescription = VeltNotificationsPanelSettingsMuteAllDescriptionWireframe;
+VeltNotificationsPanelSettingsWireframe.MuteAllTitle = VeltNotificationsPanelSettingsMuteAllTitleWireframe;
+VeltNotificationsPanelSettingsWireframe.MuteAllToggle = VeltNotificationsPanelSettingsMuteAllToggleWireframe;
+VeltNotificationsPanelSettingsWireframe.Title = VeltNotificationsPanelSettingsTitleWireframe;
+
+var VeltNotificationsPanelTitleTextWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-notifications-panel-title-text-wireframe", __assign({}, transformedProps), children));
+};
+
 var VeltNotificationsPanelWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
     var transformedProps = transformWireframeProps(remainingProps);
@@ -3775,6 +4055,9 @@ VeltNotificationsPanelWireframe.Title = VeltNotificationsPanelTitleWireframe;
 VeltNotificationsPanelWireframe.ViewAllButton = VeltNotificationsPanelViewAllButtonWireframe;
 VeltNotificationsPanelWireframe.CloseButton = VeltNotificationsPanelCloseButtonWireframe;
 VeltNotificationsPanelWireframe.Skeleton = VeltNotificationsPanelSkeletonWireframe;
+VeltNotificationsPanelWireframe.SettingsButton = VeltNotificationsPanelSettingsButtonWireframe;
+VeltNotificationsPanelWireframe.Settings = VeltNotificationsPanelSettingsWireframe;
+VeltNotificationsPanelWireframe.TitleText = VeltNotificationsPanelTitleTextWireframe;
 
 var VeltNotificationsToolIconWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
@@ -4682,6 +4965,12 @@ var VeltRecorderPlayerVideoWireframe = function (props) {
     return (React.createElement("velt-recorder-player-video-wireframe", __assign({}, transformedProps), children));
 };
 
+var VeltRecorderPlayerEditButtonWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-recorder-player-edit-button-wireframe", __assign({}, transformedProps), children));
+};
+
 var VeltRecorderPlayerVideoContainerWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
     var transformedProps = transformWireframeProps(remainingProps);
@@ -4700,6 +4989,7 @@ VeltRecorderPlayerVideoContainerWireframe.Transcription = VeltRecorderPlayerTran
 VeltRecorderPlayerVideoContainerWireframe.CopyLink = VeltRecorderPlayerCopyLinkWireframe;
 VeltRecorderPlayerVideoContainerWireframe.Delete = VeltRecorderPlayerDeleteWireframe;
 VeltRecorderPlayerVideoContainerWireframe.Avatar = VeltRecorderPlayerAvatarWireframe;
+VeltRecorderPlayerVideoContainerWireframe.EditButton = VeltRecorderPlayerEditButtonWireframe;
 
 var VeltRecorderPlayerWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
@@ -5023,11 +5313,72 @@ var VeltVideoEditorPlayerTimelineContainerWireframe = function (props) {
     return (React.createElement("velt-video-editor-player-timeline-container-wireframe", __assign({}, transformedProps), children));
 };
 
-var VeltVideoEditorPlayerTimelinePlayheadWireframe = function (props) {
+var VeltVideoEditorPlayerTimelinePlayheadLineWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-playhead-line-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerTimelinePlayheadActionsWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-playhead-actions-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerTimelinePlayhead = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
     var transformedProps = transformWireframeProps(remainingProps);
     return (React.createElement("velt-video-editor-player-timeline-playhead-wireframe", __assign({}, transformedProps), children));
 };
+VeltVideoEditorPlayerTimelinePlayhead.Line = VeltVideoEditorPlayerTimelinePlayheadLineWireframe;
+VeltVideoEditorPlayerTimelinePlayhead.Actions = VeltVideoEditorPlayerTimelinePlayheadActionsWireframe;
+
+var VeltVideoEditorPlayerTimelineOnboardingContentWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-onboarding-content-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerTimelineOnboardingTextTitleWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-onboarding-text-title-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerTimelineOnboardingTextDescriptionWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-onboarding-text-description-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerTimelineOnboardingTextWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-onboarding-text-wireframe", __assign({}, transformedProps), children));
+};
+VeltVideoEditorPlayerTimelineOnboardingTextWireframe.Title = VeltVideoEditorPlayerTimelineOnboardingTextTitleWireframe;
+VeltVideoEditorPlayerTimelineOnboardingTextWireframe.Description = VeltVideoEditorPlayerTimelineOnboardingTextDescriptionWireframe;
+
+var VeltVideoEditorPlayerTimelineOnboardingArrowWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-onboarding-arrow-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerTimelineOnboardingWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-onboarding-wireframe", __assign({}, transformedProps), children));
+};
+VeltVideoEditorPlayerTimelineOnboardingWireframe.Content = VeltVideoEditorPlayerTimelineOnboardingContentWireframe;
+VeltVideoEditorPlayerTimelineOnboardingWireframe.Text = VeltVideoEditorPlayerTimelineOnboardingTextWireframe;
+VeltVideoEditorPlayerTimelineOnboardingWireframe.Arrow = VeltVideoEditorPlayerTimelineOnboardingArrowWireframe;
+
+var VeltVideoEditorPlayerTimelineBackspaceHintWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-timeline-backspace-hint-wireframe", __assign({}, transformedProps), children));
+};
 
 var VeltVideoEditorPlayerTimelineWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
@@ -5038,7 +5389,27 @@ VeltVideoEditorPlayerTimelineWireframe.Marker = VeltVideoEditorPlayerTimelineMar
 VeltVideoEditorPlayerTimelineWireframe.Scale = VeltVideoEditorPlayerTimelineScaleWireframe;
 VeltVideoEditorPlayerTimelineWireframe.Trim = VeltVideoEditorPlayerTimelineTrimWireframe;
 VeltVideoEditorPlayerTimelineWireframe.Container = VeltVideoEditorPlayerTimelineContainerWireframe;
-VeltVideoEditorPlayerTimelineWireframe.Playhead = VeltVideoEditorPlayerTimelinePlayheadWireframe;
+VeltVideoEditorPlayerTimelineWireframe.Playhead = VeltVideoEditorPlayerTimelinePlayhead;
+VeltVideoEditorPlayerTimelineWireframe.Onboarding = VeltVideoEditorPlayerTimelineOnboardingWireframe;
+VeltVideoEditorPlayerTimelineWireframe.BackspaceHint = VeltVideoEditorPlayerTimelineBackspaceHintWireframe;
+
+var VeltVideoEditorPlayerDownloadButtonWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-download-button-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerAddZoomButtonWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-add-zoom-button-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltVideoEditorPlayerRetakeButtonWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-video-editor-player-retake-button-wireframe", __assign({}, transformedProps), children));
+};
 
 var VeltVideoEditorPlayerWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
@@ -5056,6 +5427,9 @@ VeltVideoEditorPlayerWireframe.TotalTime = VeltVideoEditorPlayerTotalTimeWirefra
 VeltVideoEditorPlayerWireframe.SplitButton = VeltVideoEditorPlayerSplitButtonWireframe;
 VeltVideoEditorPlayerWireframe.DeleteButton = VeltVideoEditorPlayerDeleteButtonWireframe;
 VeltVideoEditorPlayerWireframe.Timeline = VeltVideoEditorPlayerTimelineWireframe;
+VeltVideoEditorPlayerWireframe.DownloadButton = VeltVideoEditorPlayerDownloadButtonWireframe;
+VeltVideoEditorPlayerWireframe.AddZoomButton = VeltVideoEditorPlayerAddZoomButtonWireframe;
+VeltVideoEditorPlayerWireframe.RetakeButton = VeltVideoEditorPlayerRetakeButtonWireframe;
 
 var VeltSubtitlesTextWireframe = function (props) {
     var children = props.children, remainingProps = __rest(props, ["children"]);
@@ -5322,6 +5696,143 @@ VeltSingleEditorModePanelWireframe.Countdown = VeltSingleEditorModePanelCountdow
 VeltSingleEditorModePanelWireframe.CancelRequest = VeltSingleEditorModePanelCancelRequestWireframe;
 VeltSingleEditorModePanelWireframe.AcceptRequest = VeltSingleEditorModePanelAcceptRequestWireframe;
 
+var VeltPresenceAvatarListItemWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-avatar-list-item-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltPresenceAvatarListWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-avatar-list-wireframe", __assign({}, transformedProps), children));
+};
+VeltPresenceAvatarListWireframe.Item = VeltPresenceAvatarListItemWireframe;
+
+var VeltPresenceAvatarRemainingCountWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-avatar-remaining-count-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltPresenceWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-wireframe", __assign({}, transformedProps), children));
+};
+VeltPresenceWireframe.AvatarList = VeltPresenceAvatarListWireframe;
+VeltPresenceWireframe.AvatarRemainingCount = VeltPresenceAvatarRemainingCountWireframe;
+
+var VeltPresenceTooltipAvatarWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-tooltip-avatar-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltPresenceTooltipUserActiveWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-tooltip-user-active-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltPresenceTooltipUserInactiveWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-tooltip-user-inactive-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltPresenceTooltipUserNameWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-tooltip-user-name-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltPresenceTooltipStatusContainerWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-tooltip-status-container-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltPresenceTooltipWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-presence-tooltip-wireframe", __assign({}, transformedProps), children));
+};
+VeltPresenceTooltipWireframe.Avatar = VeltPresenceTooltipAvatarWireframe;
+VeltPresenceTooltipWireframe.UserActive = VeltPresenceTooltipUserActiveWireframe;
+VeltPresenceTooltipWireframe.UserInactive = VeltPresenceTooltipUserInactiveWireframe;
+VeltPresenceTooltipWireframe.UserName = VeltPresenceTooltipUserNameWireframe;
+VeltPresenceTooltipWireframe.StatusContainer = VeltPresenceTooltipStatusContainerWireframe;
+
+var VeltCursorPointerArrowWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-arrow-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCursorPointerAudioHuddleAvatarWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-audio-huddle-avatar-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCursorPointerAudioHuddleAudioWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-audio-huddle-audio-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCursorPointerAudioHuddleWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-audio-huddle-wireframe", __assign({}, transformedProps), children));
+};
+VeltCursorPointerAudioHuddleWireframe.Avatar = VeltCursorPointerAudioHuddleAvatarWireframe;
+VeltCursorPointerAudioHuddleWireframe.Audio = VeltCursorPointerAudioHuddleAudioWireframe;
+
+var VeltCursorPointerAvatarWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-avatar-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCursorPointerDefaultNameWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-default-name-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCursorPointerDefaultCommentWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-default-comment-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCursorPointerDefaultWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-default-wireframe", __assign({}, transformedProps), children));
+};
+VeltCursorPointerDefaultWireframe.Name = VeltCursorPointerDefaultNameWireframe;
+VeltCursorPointerDefaultWireframe.Comment = VeltCursorPointerDefaultCommentWireframe;
+
+var VeltCursorPointerVideoHuddleWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-video-huddle-wireframe", __assign({}, transformedProps), children));
+};
+
+var VeltCursorPointerWireframe = function (props) {
+    var children = props.children, remainingProps = __rest(props, ["children"]);
+    var transformedProps = transformWireframeProps(remainingProps);
+    return (React.createElement("velt-cursor-pointer-wireframe", __assign({}, transformedProps), children));
+};
+VeltCursorPointerWireframe.Arrow = VeltCursorPointerArrowWireframe;
+VeltCursorPointerWireframe.AudioHuddle = VeltCursorPointerAudioHuddleWireframe;
+VeltCursorPointerWireframe.Avatar = VeltCursorPointerAvatarWireframe;
+VeltCursorPointerWireframe.Default = VeltCursorPointerDefaultWireframe;
+VeltCursorPointerWireframe.VideoHuddle = VeltCursorPointerVideoHuddleWireframe;
+
 function useClient() {
     var client = useVeltClient().client;
     var _a = React.useState(), veltClient = _a[0], setVeltClient = _a[1];
@@ -5373,15 +5884,15 @@ function useSetDocuments() {
     var client = useVeltClient().client;
     var _a = React.useState(undefined), data = _a[0], setData = _a[1];
     // Memoize the setDocuments call
-    var memoizedData = React.useMemo(function () {
-        return data;
-    }, [JSON.stringify(data === null || data === void 0 ? void 0 : data.documents), JSON.stringify(data === null || data === void 0 ? void 0 : data.options)]);
+    // const memoizedData = React.useMemo(() => {
+    //   return data;
+    // }, [JSON.stringify(data?.documents), JSON.stringify(data?.options)]);
     React.useEffect(function () {
         var _a;
-        if (client && ((_a = memoizedData === null || memoizedData === void 0 ? void 0 : memoizedData.documents) === null || _a === void 0 ? void 0 : _a.length)) {
-            client.setDocuments(memoizedData.documents, memoizedData.options);
+        if ((client === null || client === void 0 ? void 0 : client.setDocuments) && ((_a = data === null || data === void 0 ? void 0 : data.documents) === null || _a === void 0 ? void 0 : _a.length)) {
+            client.setDocuments(data.documents, data.options);
         }
-    }, [client === null || client === void 0 ? void 0 : client.setDocuments, memoizedData]);
+    }, [client === null || client === void 0 ? void 0 : client.setDocuments, data]);
     // Memoize the setDocuments callback
     var setDocumentsCallback = React.useCallback(function (documents, options) {
         setData({ documents: documents, options: options });
@@ -5390,6 +5901,22 @@ function useSetDocuments() {
         setDocuments: setDocumentsCallback
     };
 }
+function useSetRootDocument() {
+    var client = useVeltClient().client;
+    var _a = React.useState(undefined), data = _a[0], setData = _a[1];
+    React.useEffect(function () {
+        if ((client === null || client === void 0 ? void 0 : client.setRootDocument) && data) {
+            client.setRootDocument(data);
+        }
+    }, [client === null || client === void 0 ? void 0 : client.setRootDocument, data]);
+    // Memoize the setRootDocument callback
+    var setRootDocumentCallback = React.useCallback(function (document) {
+        setData(document);
+    }, []); // Empty dependency array since it only uses setState which is stable
+    return {
+        setRootDocument: setRootDocumentCallback
+    };
+}
 function useUnsetDocumentId() {
     var client = useVeltClient().client;
     React.useEffect(function () {
@@ -5414,6 +5941,39 @@ function useSetLocation(location, appendLocation) {
         }
     }, [client, shouldSetLocation]);
 }
+function useSetLocations() {
+    var client = useVeltClient().client;
+    var _a = React.useState(undefined), data = _a[0], setData = _a[1];
+    React.useEffect(function () {
+        var _a;
+        if ((client === null || client === void 0 ? void 0 : client.setLocations) && ((_a = data === null || data === void 0 ? void 0 : data.locations) === null || _a === void 0 ? void 0 : _a.length)) {
+            client.setLocations(data.locations, data.options);
+        }
+    }, [client === null || client === void 0 ? void 0 : client.setLocations, data]);
+    // Memoize the setLocations callback
+    var setLocationsCallback = React.useCallback(function (locations, options) {
+        setData({ locations: locations, options: options });
+    }, []); // Empty dependency array since it only uses setState which is stable
+    return {
+        setLocations: setLocationsCallback
+    };
+}
+function useSetRootLocation() {
+    var client = useVeltClient().client;
+    var _a = React.useState(undefined), data = _a[0], setData = _a[1];
+    React.useEffect(function () {
+        if ((client === null || client === void 0 ? void 0 : client.setRootLocation) && data) {
+            client.setRootLocation(data);
+        }
+    }, [client === null || client === void 0 ? void 0 : client.setRootLocation, data]);
+    // Memoize the setRootLocation callback
+    var setRootLocationCallback = React.useCallback(function (location) {
+        setData(location);
+    }, []); // Empty dependency array since it only uses setState which is stable
+    return {
+        setRootLocation: setRootLocationCallback
+    };
+}
 function useVeltInitState() {
     var client = useVeltClient().client;
     var _a = React.useState(), data = _a[0], setData = _a[1];
@@ -6484,6 +7044,9 @@ function usePresenceUtils() {
     }, [client, setPresenceElement, presenceElement]);
     return presenceElement;
 }
+/**
+ * @deprecated Use `usePresenceData` hook instead.
+ */
 function usePresenceUsers() {
     var presenceElement = usePresenceUtils();
     var _a = React.useState(null), data = _a[0], setData = _a[1];
@@ -6499,6 +7062,41 @@ function usePresenceUsers() {
     }, [presenceElement]);
     return data;
 }
+function usePresenceData(query) {
+    var presenceElement = usePresenceUtils();
+    var _a = useState({ data: null }), data = _a[0], setData = _a[1];
+    var subscriptionRef = useRef();
+    // Memoize the inputs
+    var memoizedData = useMemo(function () {
+        return query;
+    }, [JSON.stringify(query)]);
+    useEffect(function () {
+        if (!(presenceElement === null || presenceElement === void 0 ? void 0 : presenceElement.getData))
+            return;
+        // Unsubscribe from the previous subscription if it exists
+        if (subscriptionRef.current) {
+            subscriptionRef.current.unsubscribe();
+        }
+        var subscription = presenceElement.getData(memoizedData)
+            .subscribe(function (res) {
+            if (res) {
+                setData(res);
+            }
+            else {
+                setData({ data: null });
+            }
+        });
+        // Store the new subscription
+        subscriptionRef.current = subscription;
+        // Cleanup function
+        return function () {
+            if (subscriptionRef.current) {
+                subscriptionRef.current.unsubscribe();
+            }
+        };
+    }, [presenceElement === null || presenceElement === void 0 ? void 0 : presenceElement.getData, memoizedData]);
+    return data;
+}
 
 function usePresenceEventCallback(action) {
     var presenceElement = usePresenceUtils();
@@ -6777,19 +7375,32 @@ function useNotificationUtils() {
     }, [client, setNotificationElement, notificationElement]);
     return notificationElement;
 }
-function useNotificationsData() {
+function useNotificationsData(query) {
     var notificationElement = useNotificationUtils();
     var _a = React.useState(null), data = _a[0], setData = _a[1];
+    var subscriptionRef = useRef();
+    var memoizedData = useMemo(function () {
+        return query;
+    }, [JSON.stringify(query)]);
     useEffect(function () {
         if (!(notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.getNotificationsData))
             return;
-        var subscription = notificationElement.getNotificationsData().subscribe(function (res) {
+        // Unsubscribe from the previous subscription if it exists
+        if (subscriptionRef.current) {
+            subscriptionRef.current.unsubscribe();
+        }
+        var subscription = notificationElement.getNotificationsData(memoizedData).subscribe(function (res) {
             setData(res);
         });
+        // Store the new subscription
+        subscriptionRef.current = subscription;
+        // Cleanup function
         return function () {
-            subscription.unsubscribe();
+            if (subscriptionRef.current) {
+                subscriptionRef.current.unsubscribe();
+            }
         };
-    }, [notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.getNotificationsData]);
+    }, [notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.getNotificationsData, memoizedData]);
     return data;
 }
 function useUnreadNotificationsCount() {
@@ -6807,6 +7418,74 @@ function useUnreadNotificationsCount() {
     }, [notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.getUnreadNotificationsCount]);
     return data;
 }
+function useNotificationSettings() {
+    var notificationElement = useNotificationUtils();
+    var _a = React.useState(null), settings = _a[0], setSettings = _a[1];
+    var _b = React.useState(undefined), settingsData = _b[0], setSettingsData = _b[1];
+    var _c = React.useState(undefined), settingsInitialConfigData = _c[0], setSettingsInitialConfigData = _c[1];
+    useEffect(function () {
+        if ((notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.setSettingsInitialConfig) && settingsInitialConfigData) {
+            notificationElement.setSettingsInitialConfig(settingsInitialConfigData);
+        }
+    }, [notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.setSettingsInitialConfig, settingsInitialConfigData]);
+    useEffect(function () {
+        if ((notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.setSettings) && settingsData) {
+            notificationElement.setSettings(settingsData);
+        }
+    }, [notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.setSettings, settingsData]);
+    useEffect(function () {
+        var _a;
+        if (!(notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.getSettings))
+            return;
+        // Added this check to make is backward compatible with the old version of the SDK where getSettings() returns value instead of observable
+        if (!((_a = notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.getSettings()) === null || _a === void 0 ? void 0 : _a.subscribe))
+            return;
+        var subscription = notificationElement.getSettings().subscribe(function (res) {
+            setSettings(res);
+        });
+        return function () {
+            subscription.unsubscribe();
+        };
+    }, [notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.getSettings]);
+    var setSettingsInitialConfigCallback = React.useCallback(function (settingsInitialConfig) {
+        setSettingsInitialConfigData(settingsInitialConfig);
+    }, []);
+    var setSettingsCallback = React.useCallback(function (settings) {
+        setSettingsData(settings);
+    }, []);
+    return {
+        settings: settings,
+        setSettings: setSettingsCallback,
+        setSettingsInitialConfig: setSettingsInitialConfigCallback,
+    };
+}
+
+function useNotificationEventCallback(action) {
+    var notificationElement = useNotificationUtils();
+    var _a = useState(null), data = _a[0], setData = _a[1];
+    var subscriptionRef = useRef(null);
+    var memoizedAction = useMemo(function () { return action; }, [action]);
+    useEffect(function () {
+        var _a;
+        if (!(notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.on))
+            return;
+        if (subscriptionRef.current) {
+            subscriptionRef.current.unsubscribe();
+        }
+        var subscription = (_a = notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.on(memoizedAction)) === null || _a === void 0 ? void 0 : _a.subscribe(function (data) {
+            setData(data);
+        });
+        // Store the new subscription
+        subscriptionRef.current = subscription;
+        // Cleanup function
+        return function () {
+            if (subscriptionRef.current) {
+                subscriptionRef.current.unsubscribe();
+            }
+        };
+    }, [notificationElement === null || notificationElement === void 0 ? void 0 : notificationElement.on, memoizedAction]);
+    return data;
+}
 
 function useAutocompleteUtils() {
     var _a = React.useState(), autocompleteElement = _a[0], setAutocompleteElement = _a[1];
@@ -7022,5 +7701,5 @@ var logLiveState = function (action, liveStateDataId) {
     }
 };
 
-export { SnippylyArrowTool as VeltArrowTool, SnippylyArrows as VeltArrows, VeltAutocomplete, VeltAutocompleteChipTooltipWireframe, VeltAutocompleteGroupOptionWireframe, VeltAutocompleteOptionWireframe, VeltButtonWireframe, VeltCanvasComment, VeltChartComment, SnippylyCommentBubble as VeltCommentBubble, VeltCommentBubbleWireframe, VeltCommentComposer, VeltCommentComposerWireframe, VeltCommentDialogOptionsDropdownContentWireframe, VeltCommentDialogOptionsDropdownTriggerWireframe, VeltCommentDialogPriorityDropdownContentWireframe, VeltCommentDialogPriorityDropdownTriggerWireframe, VeltCommentDialogStatusDropdownContentWireframe, VeltCommentDialogStatusDropdownTriggerWireframe, VeltCommentDialogWireframe, VeltCommentPin, VeltCommentPinWireframe, VeltCommentPlayerTimeline, VeltCommentText, VeltCommentThread, VeltCommentThreadWireframe, SnippylyCommentTool as VeltCommentTool, VeltCommentToolWireframe, SnippylyComments as VeltComments, VeltCommentsMinimap, SnippylyCommentsSidebar as VeltCommentsSidebar, VeltCommentsSidebarButton, VeltCommentsSidebarStatusDropdownWireframe, VeltCommentsSidebarWireframe, VeltConfirmDialogWireframe, SnippylyCursor as VeltCursor, VeltData, VeltHighChartComments, SnippylyHuddle as VeltHuddle, SnippylyHuddleTool as VeltHuddleTool, VeltIf, VeltInlineCommentsSection, VeltInlineCommentsSectionWireframe, VeltInlineReactionsSection, VeltInlineReactionsSectionWireframe, VeltMediaSourceSettingsWireframe, VeltMultiThreadCommentDialogWireframe, VeltNivoChartComments, VeltNotificationsHistoryPanel, VeltNotificationsPanel, VeltNotificationsPanelWireframe, VeltNotificationsTool, VeltNotificationsToolWireframe, VeltPersistentCommentModeWireframe, SnippylyPresence as VeltPresence, SnippylyProvider as VeltProvider, VeltReactionPinTooltipWireframe, VeltReactionPinWireframe, VeltReactionTool, VeltReactionToolWireframe, VeltReactionsPanelWireframe, VeltRecorderAllToolMenuWireframe, VeltRecorderAllToolWireframe, VeltRecorderAudioToolWireframe, SnippylyRecorderControlPanel as VeltRecorderControlPanel, VeltRecorderControlPanelWireframe, SnippylyRecorderNotes as VeltRecorderNotes, SnippylyRecorderPlayer as VeltRecorderPlayer, VeltRecorderPlayerExpandedWireframe, VeltRecorderPlayerWireframe, VeltRecorderScreenToolWireframe, SnippylyRecorderTool as VeltRecorderTool, VeltRecorderVideoToolWireframe, VeltRecordingPreviewStepsDialogWireframe, SnippylySidebarButton as VeltSidebarButton, VeltSidebarButtonWireframe, VeltSingleEditorModePanel, VeltSingleEditorModePanelWireframe, VeltSubtitlesWireframe, SnippylyTagTool as VeltTagTool, SnippylyTags as VeltTags, VeltTextCommentToolWireframe, VeltTextCommentToolbar as VeltTextCommentToolbarWireframe, VeltTranscriptionWireframe, SnippylyUserInviteTool as VeltUserInviteTool, SnippylyUserRequestTool as VeltUserRequestTool, VeltUserSelectorDropdown as VeltUserSelectorDropdownWireframe, VeltVideoEditorPlayerWireframe, VeltVideoPlayer, VeltViewAnalytics, VeltWireframe, createLiveStateMiddleware, useAIRewriterUtils, useAddAttachment, useAddComment, useAddCommentAnnotation, useAddReaction, useApproveCommentAnnotation, useAssignUser, useAutocompleteChipClick, useAutocompleteUtils, useClient, useCommentActionCallback, useCommentAddHandler, useCommentAnnotationById, useCommentAnnotations, useCommentAnnotationsCount, useCommentCopyLinkHandler, useCommentDialogSidebarClickHandler, useCommentEventCallback, useCommentModeState, useCommentSelectionChangeHandler, useCommentSidebarActionButtonClick, useCommentSidebarData, useCommentSidebarInit, useCommentUpdateHandler, useCommentUtils, useContactList, useContactSelected, useContactUtils, useCopyLink, useCursorUsers, useCursorUtils, useDeleteAttachment, useDeleteComment, useDeleteCommentAnnotation, useDeleteReaction, useDeleteRecording, useEditor, useEditorAccessRequestHandler, useEditorAccessTimer, useGetAttachment, useGetComment, useGetCommentAnnotations, useGetLink, useGetRecording, useHuddleUtils, useIdentify, useLiveSelectionDataHandler, useLiveSelectionUtils, useLiveState, useLiveStateData, useLiveStateSyncEventCallback, useLiveStateSyncUtils, useNotificationUtils, useNotificationsData, usePresenceEventCallback, usePresenceUsers, usePresenceUtils, useRecorderAddHandler, useRecorderEventCallback, useRecorderUtils, useRecordingDataByRecorderId, useRecordings, useRejectCommentAnnotation, useResolveCommentAnnotation, useServerConnectionStateChangeHandler, useSetDocument, useSetDocumentId, useSetDocuments, useSetLiveStateData, useSetLocation, useSubscribeCommentAnnotation, useTagAnnotations, useTagUtils, useToggleReaction, useUniqueViewsByDate, useUniqueViewsByUser, useUnreadCommentAnnotationCountByLocationId, useUnreadCommentAnnotationCountOnCurrentDocument, useUnreadCommentCountByAnnotationId, useUnreadCommentCountByLocationId, useUnreadCommentCountOnCurrentDocument, useUnreadNotificationsCount, useUnsetDocumentId, useUnsetDocuments, useUnsubscribeCommentAnnotation, useUpdateAccess, useUpdateComment, useUpdatePriority, useUpdateStatus, useUserEditorState, useVeltClient, useVeltEventCallback, useVeltInitState, useViewsUtils };
+export { SnippylyArrowTool as VeltArrowTool, SnippylyArrows as VeltArrows, VeltAutocomplete, VeltAutocompleteChipTooltipWireframe, VeltAutocompleteGroupOptionWireframe, VeltAutocompleteOptionWireframe, VeltButtonWireframe, VeltCanvasComment, VeltChartComment, SnippylyCommentBubble as VeltCommentBubble, VeltCommentBubbleWireframe, VeltCommentComposer, VeltCommentComposerWireframe, VeltCommentDialogOptionsDropdownContentWireframe, VeltCommentDialogOptionsDropdownTriggerWireframe, VeltCommentDialogPriorityDropdownContentWireframe, VeltCommentDialogPriorityDropdownTriggerWireframe, VeltCommentDialogStatusDropdownContentWireframe, VeltCommentDialogStatusDropdownTriggerWireframe, VeltCommentDialogWireframe, VeltCommentPin, VeltCommentPinWireframe, VeltCommentPlayerTimeline, VeltCommentText, VeltCommentThread, VeltCommentThreadWireframe, SnippylyCommentTool as VeltCommentTool, VeltCommentToolWireframe, SnippylyComments as VeltComments, VeltCommentsMinimap, SnippylyCommentsSidebar as VeltCommentsSidebar, VeltCommentsSidebarButton, VeltCommentsSidebarStatusDropdownWireframe, VeltCommentsSidebarWireframe, VeltConfirmDialogWireframe, SnippylyCursor as VeltCursor, VeltCursorPointerWireframe, VeltData, VeltHighChartComments, SnippylyHuddle as VeltHuddle, SnippylyHuddleTool as VeltHuddleTool, VeltIf, VeltInlineCommentsSection, VeltInlineCommentsSectionWireframe, VeltInlineReactionsSection, VeltInlineReactionsSectionWireframe, VeltMediaSourceSettingsWireframe, VeltMultiThreadCommentDialogWireframe, VeltNivoChartComments, VeltNotificationsHistoryPanel, VeltNotificationsPanel, VeltNotificationsPanelWireframe, VeltNotificationsTool, VeltNotificationsToolWireframe, VeltPersistentCommentModeWireframe, SnippylyPresence as VeltPresence, VeltPresenceTooltipWireframe, VeltPresenceWireframe, SnippylyProvider as VeltProvider, VeltReactionPinTooltipWireframe, VeltReactionPinWireframe, VeltReactionTool, VeltReactionToolWireframe, VeltReactionsPanelWireframe, VeltRecorderAllToolMenuWireframe, VeltRecorderAllToolWireframe, VeltRecorderAudioToolWireframe, SnippylyRecorderControlPanel as VeltRecorderControlPanel, VeltRecorderControlPanelWireframe, SnippylyRecorderNotes as VeltRecorderNotes, SnippylyRecorderPlayer as VeltRecorderPlayer, VeltRecorderPlayerExpandedWireframe, VeltRecorderPlayerWireframe, VeltRecorderScreenToolWireframe, SnippylyRecorderTool as VeltRecorderTool, VeltRecorderVideoToolWireframe, VeltRecordingPreviewStepsDialogWireframe, SnippylySidebarButton as VeltSidebarButton, VeltSidebarButtonWireframe, VeltSingleEditorModePanel, VeltSingleEditorModePanelWireframe, VeltSubtitlesWireframe, SnippylyTagTool as VeltTagTool, SnippylyTags as VeltTags, VeltTextCommentToolWireframe, VeltTextCommentToolbar as VeltTextCommentToolbarWireframe, VeltTranscriptionWireframe, SnippylyUserInviteTool as VeltUserInviteTool, SnippylyUserRequestTool as VeltUserRequestTool, VeltUserSelectorDropdown as VeltUserSelectorDropdownWireframe, VeltVideoEditor, VeltVideoEditorPlayerWireframe, VeltVideoPlayer, VeltViewAnalytics, VeltWireframe, createLiveStateMiddleware, useAIRewriterUtils, useAddAttachment, useAddComment, useAddCommentAnnotation, useAddReaction, useApproveCommentAnnotation, useAssignUser, useAutocompleteChipClick, useAutocompleteUtils, useClient, useCommentActionCallback, useCommentAddHandler, useCommentAnnotationById, useCommentAnnotations, useCommentAnnotationsCount, useCommentCopyLinkHandler, useCommentDialogSidebarClickHandler, useCommentEventCallback, useCommentModeState, useCommentSelectionChangeHandler, useCommentSidebarActionButtonClick, useCommentSidebarData, useCommentSidebarInit, useCommentUpdateHandler, useCommentUtils, useContactList, useContactSelected, useContactUtils, useCopyLink, useCursorUsers, useCursorUtils, useDeleteAttachment, useDeleteComment, useDeleteCommentAnnotation, useDeleteReaction, useDeleteRecording, useEditor, useEditorAccessRequestHandler, useEditorAccessTimer, useGetAttachment, useGetComment, useGetCommentAnnotations, useGetLink, useGetRecording, useHuddleUtils, useIdentify, useLiveSelectionDataHandler, useLiveSelectionUtils, useLiveState, useLiveStateData, useLiveStateSyncEventCallback, useLiveStateSyncUtils, useNotificationEventCallback, useNotificationSettings, useNotificationUtils, useNotificationsData, usePresenceData, usePresenceEventCallback, usePresenceUsers, usePresenceUtils, useRecorderAddHandler, useRecorderEventCallback, useRecorderUtils, useRecordingDataByRecorderId, useRecordings, useRejectCommentAnnotation, useResolveCommentAnnotation, useServerConnectionStateChangeHandler, useSetDocument, useSetDocumentId, useSetDocuments, useSetLiveStateData, useSetLocation, useSetLocations, useSetRootDocument, useSetRootLocation, useSubscribeCommentAnnotation, useTagAnnotations, useTagUtils, useToggleReaction, useUniqueViewsByDate, useUniqueViewsByUser, useUnreadCommentAnnotationCountByLocationId, useUnreadCommentAnnotationCountOnCurrentDocument, useUnreadCommentCountByAnnotationId, useUnreadCommentCountByLocationId, useUnreadCommentCountOnCurrentDocument, useUnreadNotificationsCount, useUnsetDocumentId, useUnsetDocuments, useUnsubscribeCommentAnnotation, useUpdateAccess, useUpdateComment, useUpdatePriority, useUpdateStatus, useUserEditorState, useVeltClient, useVeltEventCallback, useVeltInitState, useViewsUtils };
 //# sourceMappingURL=index.js.map