@veltdev/react 1.0.118 → 1.0.120

package/cjs/index.js

@@ -228,12 +228,12 @@ var SnippylyProvider = function (props) {
 };
 
 var SnippylyCommentBubble = function (props) {
-    var targetCommentElementId = props.targetCommentElementId, avatar = props.avatar, showAvatar = props.showAvatar, commentBubbleTargetPinHover = props.commentBubbleTargetPinHover, children = props.children;
-    return (React__default["default"].createElement("velt-comment-bubble", { "target-comment-element-id": targetCommentElementId, "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 }, children));
+    var targetCommentElementId = props.targetCommentElementId, avatar = props.avatar, showAvatar = props.showAvatar, commentBubbleTargetPinHover = props.commentBubbleTargetPinHover, children = props.children, shadowDom = props.shadowDom, variant = props.variant;
+    return (React__default["default"].createElement("velt-comment-bubble", { "target-comment-element-id": targetCommentElementId, "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, 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, persistentCommentMode = props.persistentCommentMode, ghostComments = props.ghostComments, ghostCommentsIndicator = props.ghostCommentsIndicator, commentsOnDom = props.commentsOnDom, commentTool = props.commentTool, sidebarButtonOnCommentDialog = props.sidebarButtonOnCommentDialog, deviceIndicatorOnCommentPins = props.deviceIndicatorOnCommentPins, scrollToComment = props.scrollToComment, userMentions = props.userMentions, deleteOnBackspace = props.deleteOnBackspace, hotkey = props.hotkey, recordingSummary = props.recordingSummary, recordingCountdown = props.recordingCountdown, unreadIndicatorMode = props.unreadIndicatorMode, pinShadowDom = props.pinShadowDom, dialogShadowDom = props.dialogShadowDom, shadowDom = props.shadowDom, changeDetectionInCommentMode = props.changeDetectionInCommentMode, allowedElementIds = props.allowedElementIds, allowedElementClassNames = props.allowedElementClassNames, allowedElementQuerySelectors = props.allowedElementQuerySelectors, onCommentAdd = props.onCommentAdd, onCommentUpdate = props.onCommentUpdate, onCommentAccept = props.onCommentAccept, onCommentReject = props.onCommentReject, onSidebarButtonOnCommentDialogClick = props.onSidebarButtonOnCommentDialogClick, customStatus = props.customStatus, customPriority = props.customPriority, customCategory = props.customCategory, status = props.status, resolveButton = props.resolveButton, darkMode = props.darkMode, onCustomPinInject = props.onCustomPinInject, children = props.children;
+    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, persistentCommentMode = props.persistentCommentMode, ghostComments = props.ghostComments, ghostCommentsIndicator = props.ghostCommentsIndicator, commentsOnDom = props.commentsOnDom, commentTool = props.commentTool, sidebarButtonOnCommentDialog = props.sidebarButtonOnCommentDialog, deviceIndicatorOnCommentPins = props.deviceIndicatorOnCommentPins, scrollToComment = props.scrollToComment, userMentions = props.userMentions, deleteOnBackspace = props.deleteOnBackspace, hotkey = props.hotkey, recordingSummary = props.recordingSummary, recordingCountdown = props.recordingCountdown, unreadIndicatorMode = props.unreadIndicatorMode, pinShadowDom = props.pinShadowDom, dialogShadowDom = props.dialogShadowDom, shadowDom = props.shadowDom, changeDetectionInCommentMode = props.changeDetectionInCommentMode, allowedElementIds = props.allowedElementIds, allowedElementClassNames = props.allowedElementClassNames, allowedElementQuerySelectors = props.allowedElementQuerySelectors, onCommentAdd = props.onCommentAdd, onCommentUpdate = props.onCommentUpdate, onCommentAccept = props.onCommentAccept, onCommentReject = props.onCommentReject, onSidebarButtonOnCommentDialogClick = props.onSidebarButtonOnCommentDialogClick, customStatus = props.customStatus, 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;
     var ref = React.useRef();
     var onSignInRef = React.useRef(onSignIn);
     var onUpgradeRef = React.useRef(onUpgrade);
@@ -313,7 +313,7 @@ var SnippylyComments = function (props) {
             });
         }
     }, []);
-    return (React__default["default"].createElement("velt-comments", { ref: ref, "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, "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, "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-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined, "unread-indicator-mode": unreadIndicatorMode, "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, "change-detection-in-comment-mode": [true, false].includes(changeDetectionInCommentMode) ? (changeDetectionInCommentMode ? 'true' : 'false') : undefined, "allowed-element-ids": JSON.stringify(allowedElementIds), "allowed-element-class-names": JSON.stringify(allowedElementClassNames), "allowed-element-query-selectors": JSON.stringify(allowedElementQuerySelectors), "custom-status": JSON.stringify(customStatus), "custom-priority": JSON.stringify(customPriority), "custom-category": JSON.stringify(customCategory), "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
+    return (React__default["default"].createElement("velt-comments", { ref: ref, "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, "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, "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-countdown": [true, false].includes(recordingCountdown) ? (recordingCountdown ? 'true' : 'false') : undefined, "unread-indicator-mode": unreadIndicatorMode, "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, "change-detection-in-comment-mode": [true, false].includes(changeDetectionInCommentMode) ? (changeDetectionInCommentMode ? 'true' : 'false') : undefined, "allowed-element-ids": JSON.stringify(allowedElementIds), "allowed-element-class-names": JSON.stringify(allowedElementClassNames), "allowed-element-query-selectors": JSON.stringify(allowedElementQuerySelectors), "custom-status": JSON.stringify(customStatus), "custom-priority": JSON.stringify(customPriority), "custom-category": JSON.stringify(customCategory), "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
 };
 
 var SnippylyCommentsSidebar = function (props) {
@@ -357,11 +357,11 @@ var SnippylyCommentsSidebar = function (props) {
             });
         }
     }, []);
-    return (React__default["default"].createElement("velt-comments-sidebar", { ref: ref, "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, "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, variant: variant, "page-mode-composer-variant": pageModeComposerVariant, "dialog-variant": dialogVariant, "sort-data": sortData, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined }));
+    return (React__default["default"].createElement("velt-comments-sidebar", { ref: ref, "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, "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, variant: variant, "page-mode-composer-variant": pageModeComposerVariant, "dialog-variant": dialogVariant, "sort-data": sortData }));
 };
 
 var SnippylyCommentTool = function (props) {
-    var targetCommentElementId = props.targetCommentElementId, onCommentModeChange = props.onCommentModeChange, children = props.children, darkMode = props.darkMode, variant = props.variant;
+    var targetCommentElementId = props.targetCommentElementId, onCommentModeChange = props.onCommentModeChange, children = props.children, darkMode = props.darkMode, variant = props.variant, shadowDom = props.shadowDom;
     var ref = React.useRef();
     var onCommentModeChangeRef = React.useRef(onCommentModeChange);
     // Update the ref to always point to the latest callback function
@@ -378,7 +378,7 @@ var SnippylyCommentTool = function (props) {
             });
         }
     }, []);
-    return (React__default["default"].createElement("velt-comment-tool", { ref: ref, "target-comment-element-id": targetCommentElementId, variant: variant, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
+    return (React__default["default"].createElement("velt-comment-tool", { ref: ref, "target-comment-element-id": targetCommentElementId, variant: variant, "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) {
@@ -517,8 +517,8 @@ var SnippylyRecorderTool = function (props) {
 };
 
 var SnippylySidebarButton = function (props) {
-    var tooltipText = props.tooltipText, children = props.children, darkMode = props.darkMode;
-    return (React__default["default"].createElement("velt-sidebar-button", { "tooltip-text": tooltipText, "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
+    var tooltipText = props.tooltipText, children = props.children, darkMode = props.darkMode, shadowDom = props.shadowDom;
+    return (React__default["default"].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 }, children));
 };
 
 var SnippylyTags = function (props) {
@@ -1113,6 +1113,11 @@ var VeltHighChartComments = function (_a) {
             React__default["default"].createElement(VeltChartComment, { ghostComment: true, commentMetadata: point.metadata, dialogMetadataTemplate: dialogMetadataTemplate || point.dialogMetadataTemplate || ['groupId', 'label', 'value'] }))); })));
 };
 
+var VeltAutocomplete = function (props) {
+    var hotkey = props.hotkey, listData = props.listData;
+    return (React__default["default"].createElement("velt-autocomplete", { hotkey: hotkey, "list-data": (typeof listData === 'object') ? JSON.stringify(listData) : undefined }));
+};
+
 var VeltWireframe = function (props) {
     var children = props.children;
     return (React__default["default"].createElement("velt-wireframe", null, children));
@@ -1166,9 +1171,9 @@ var VeltCommentDialogCommentCategory = function (props) {
     return (React__default["default"].createElement("velt-comment-dialog-comment-category-wireframe", null, children));
 };
 
-var VeltCommentDialogCommentCount = function (props) {
+var VeltCommentDialogCommentIndex = function (props) {
     var children = props.children;
-    return (React__default["default"].createElement("velt-comment-dialog-comment-count-wireframe", null, children));
+    return (React__default["default"].createElement("velt-comment-dialog-comment-index-wireframe", null, children));
 };
 
 var VeltCommentDialogCommentSuggestionStatus = function (props) {
@@ -1375,7 +1380,7 @@ VeltCommentDialogWireframe.AssigneeBanner = VeltCommentDialogAssigneeBanner;
 VeltCommentDialogWireframe.AssignMenu = VeltCommentDialogAssignMenu;
 VeltCommentDialogWireframe.Body = VeltCommentDialogBody;
 VeltCommentDialogWireframe.CommentCategory = VeltCommentDialogCommentCategory;
-VeltCommentDialogWireframe.CommentCount = VeltCommentDialogCommentCount;
+VeltCommentDialogWireframe.CommentIndex = VeltCommentDialogCommentIndex;
 VeltCommentDialogWireframe.CommentSuggestionStatus = VeltCommentDialogCommentSuggestionStatus;
 VeltCommentDialogWireframe.Composer = VeltCommentDialogComposer;
 VeltCommentDialogWireframe.CopyLink = VeltCommentDialogCopyLink;
@@ -1504,9 +1509,9 @@ var VeltCommentsSidebarList = function (props) {
     return (React__default["default"].createElement("velt-comments-sidebar-list-wireframe", null, children));
 };
 
-var VeltCommentsSidebarPageMode = function (props) {
+var VeltCommentsSidebarPageModeComposer = function (props) {
     var children = props.children;
-    return (React__default["default"].createElement("velt-comments-sidebar-page-mode-wireframe", null, children));
+    return (React__default["default"].createElement("velt-comments-sidebar-page-mode-composer-wireframe", null, children));
 };
 
 var VeltCommentsSidebarSearch = function (props) {
@@ -1533,7 +1538,7 @@ VeltCommentsSidebarWireframe.EmptyPlaceholder = VeltCommentsSidebarEmptyPlacehol
 VeltCommentsSidebarWireframe.Filter = VeltCommentsSidebarFilter;
 VeltCommentsSidebarWireframe.Header = VeltCommentsSidebarHeader;
 VeltCommentsSidebarWireframe.List = VeltCommentsSidebarList;
-VeltCommentsSidebarWireframe.PageMode = VeltCommentsSidebarPageMode;
+VeltCommentsSidebarWireframe.PageModeComposer = VeltCommentsSidebarPageModeComposer;
 VeltCommentsSidebarWireframe.Search = VeltCommentsSidebarSearch;
 VeltCommentsSidebarWireframe.Status = VeltCommentsSidebarStatus;
 VeltCommentsSidebarWireframe.FilterButton = VeltCommentsSidebarFilterButton;
@@ -1579,8 +1584,8 @@ var VeltSidebarButtonCommentsCount = function (props) {
 };
 
 var VeltSidebarButtonWireframe = function (props) {
-    var children = props.children;
-    return (React__default["default"].createElement("velt-sidebar-button-wireframe", null, children));
+    var children = props.children, remainingProp = __rest(props, ["children"]);
+    return (React__default["default"].createElement("velt-sidebar-button-wireframe", __assign({}, remainingProp), children));
 };
 VeltSidebarButtonWireframe.CommentsCount = VeltSidebarButtonCommentsCount;
 
@@ -1652,6 +1657,35 @@ VeltUserSelectorDropdown.Email = VeltUserSelectorDropdownEmail;
 VeltUserSelectorDropdown.ErrorIcon = VeltUserSelectorDropdownErrorIcon;
 VeltUserSelectorDropdown.Name = VeltUserSelectorDropdownName;
 
+var VeltAutocompleteOptionIconWireframe = function (props) {
+    var children = props.children;
+    return (React__default["default"].createElement("velt-autocomplete-option-icon-wireframe", null, children));
+};
+
+var VeltAutocompleteOptionNameWireframe = function (props) {
+    var children = props.children;
+    return (React__default["default"].createElement("velt-autocomplete-option-name-wireframe", null, children));
+};
+
+var VeltAutocompleteOptionDescriptionWireframe = function (props) {
+    var children = props.children;
+    return (React__default["default"].createElement("velt-autocomplete-option-description-wireframe", null, children));
+};
+
+var VeltAutocompleteOptionErrorIconWireframe = function (props) {
+    var children = props.children;
+    return (React__default["default"].createElement("velt-autocomplete-option-error-icon-wireframe", null, children));
+};
+
+var VeltAutocompleteOptionWireframe = function (props) {
+    var children = props.children;
+    return (React__default["default"].createElement("velt-autocomplete-option-wireframe", null, children));
+};
+VeltAutocompleteOptionWireframe.Icon = VeltAutocompleteOptionIconWireframe;
+VeltAutocompleteOptionWireframe.Description = VeltAutocompleteOptionDescriptionWireframe;
+VeltAutocompleteOptionWireframe.ErrorIcon = VeltAutocompleteOptionErrorIconWireframe;
+VeltAutocompleteOptionWireframe.Name = VeltAutocompleteOptionNameWireframe;
+
 var VeltCommentBubbleAvatar = function (props) {
     var children = props.children;
     return (React__default["default"].createElement("velt-comment-bubble-avatar-wireframe", null, children));
@@ -1992,18 +2026,45 @@ function useEditorAccessRequestHandler() {
 /**
  * @beta This hook is in beta
  */
-function useLiveState(liveStateDataId, initialValue, debounceTime) {
-    if (debounceTime === void 0) { debounceTime = 50; }
+function useLiveState(liveStateDataId, initialValue, options) {
     var liveStateSyncElement = useLiveStateSyncUtils();
-    var _a = React__default["default"].useState(initialValue), data = _a[0], setData = _a[1];
+    var client = useVeltClient().client;
+    var _a = React__default["default"].useState(null), documentId = _a[0], setDocumentId = _a[1];
+    var _b = React__default["default"].useState(null), user = _b[0], setUser = _b[1];
+    var _c = React__default["default"].useState(initialValue), data = _c[0], setData = _c[1];
+    React.useEffect(function () {
+        resetLiveStateData();
+    }, [documentId, user]);
+    var resetLiveStateData = function () {
+        if (user && documentId) {
+            liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.setLiveStateData(liveStateDataId, data);
+        }
+    };
     React.useEffect(function () {
         if (!(liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.getLiveStateData))
             return;
+        var documentPathsSubscription, userSubscription;
+        if (options === null || options === void 0 ? void 0 : options.resetLiveState) {
+            documentPathsSubscription = client.docService.getDocumentPaths$().subscribe(function (paths) {
+                if (paths) {
+                    setDocumentId(paths === null || paths === void 0 ? void 0 : paths.documentId);
+                    documentPathsSubscription === null || documentPathsSubscription === void 0 ? void 0 : documentPathsSubscription.unsubscribe();
+                }
+            });
+            userSubscription = client.authService.getUser$().subscribe(function (user) {
+                if (user) {
+                    setUser(user);
+                    userSubscription === null || userSubscription === void 0 ? void 0 : userSubscription.unsubscribe();
+                }
+            });
+        }
         var subscription = liveStateSyncElement.getLiveStateData(liveStateDataId).subscribe(function (res) {
             setData(res);
         });
         return function () {
             subscription.unsubscribe();
+            documentPathsSubscription === null || documentPathsSubscription === void 0 ? void 0 : documentPathsSubscription.unsubscribe();
+            userSubscription === null || userSubscription === void 0 ? void 0 : userSubscription.unsubscribe();
         };
     }, [liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.getLiveStateData]);
     var useDebounce = function (callback) {
@@ -2024,7 +2085,7 @@ function useLiveState(liveStateDataId, initialValue, debounceTime) {
     };
     var setDataFunction = function (value) {
         setData(value);
-        debouncedOnInput(value, debounceTime); // default 50ms debounce time
+        debouncedOnInput(value, (options === null || options === void 0 ? void 0 : options.syncDuration) >= 0 ? options === null || options === void 0 ? void 0 : options.syncDuration : 50); // default 50ms debounce time
     };
     var debouncedOnInput = useDebounce(function (value) {
         if (liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.setLiveStateData) {
@@ -2247,6 +2308,39 @@ function useNotificationsData() {
     return data;
 }
 
+/**
+ * @beta This hook is in beta
+ */
+function useAutocompleteUtils() {
+    var _a = React__default["default"].useState(), autocompleteElement = _a[0], setAutocompleteElement = _a[1];
+    var client = useVeltClient().client;
+    React__default["default"].useEffect(function () {
+        if (!client || autocompleteElement)
+            return;
+        var loadedAutocompleteElement = client.getAutocompleteElement();
+        setAutocompleteElement(loadedAutocompleteElement);
+    }, [client, setAutocompleteElement, autocompleteElement]);
+    return autocompleteElement;
+}
+/**
+ * @beta This hook is in beta
+ */
+function useAutocompleteChipClick() {
+    var autocompleteElement = useAutocompleteUtils();
+    var _a = React__default["default"].useState(), data = _a[0], setData = _a[1];
+    React.useEffect(function () {
+        if (!autocompleteElement)
+            return;
+        var subscription = autocompleteElement.onAutocompleteChipClick().subscribe(function (res) {
+            setData(res);
+        });
+        return function () {
+            subscription.unsubscribe();
+        };
+    }, [autocompleteElement]);
+    return data;
+}
+
 var sessionId = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
 var getSessionId = function () {
     return sessionId;
@@ -2340,6 +2434,8 @@ var logLiveState = function (action, liveStateDataId) {
 
 exports.VeltArrowTool = SnippylyArrowTool;
 exports.VeltArrows = SnippylyArrows;
+exports.VeltAutocomplete = VeltAutocomplete;
+exports.VeltAutocompleteOptionWireframe = VeltAutocompleteOptionWireframe;
 exports.VeltChartComment = VeltChartComment;
 exports.VeltCommentBubble = SnippylyCommentBubble;
 exports.VeltCommentBubbleAvatar = VeltCommentBubbleAvatar;
@@ -2382,6 +2478,8 @@ exports.VeltWireframe = VeltWireframe;
 exports.createLiveStateMiddleware = createLiveStateMiddleware;
 exports.useAIRewriterUtils = useAIRewriterUtils;
 exports.useAddLocation = useAddLocation;
+exports.useAutocompleteChipClick = useAutocompleteChipClick;
+exports.useAutocompleteUtils = useAutocompleteUtils;
 exports.useClient = useClient;
 exports.useCommentAddHandler = useCommentAddHandler;
 exports.useCommentAnnotations = useCommentAnnotations;