@veltdev/react 1.0.70 → 1.0.72

package/cjs/index.js

@@ -23,6 +23,17 @@ OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
 PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
 
+var __assign = function() {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
 function __awaiter(thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -94,7 +105,8 @@ var loadVelt = function (callback, version, staging) {
     }
 };
 
-var VELT_SDK_VERSION = '1.0.87';
+var VELT_SDK_VERSION = '1.0.89';
+var VELT_SDK_INIT_EVENT = 'onVeltInit';
 
 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, onClientLoad = props.onClientLoad, children = props.children;
@@ -107,7 +119,7 @@ var SnippylyProvider = function (props) {
         }
     }, []);
     var initVelt = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var velt;
+        var velt, event;
         var _a, _b;
         return __generator(this, function (_c) {
             switch (_c.label) {
@@ -164,6 +176,8 @@ var SnippylyProvider = function (props) {
                     if (documentId) {
                         velt === null || velt === void 0 ? void 0 : velt.setDocumentId(documentId);
                     }
+                    event = new CustomEvent(VELT_SDK_INIT_EVENT, { detail: velt });
+                    window.dispatchEvent(event);
                     return [2 /*return*/];
             }
         });
@@ -178,7 +192,7 @@ var SnippylyCommentBubble = function (props) {
 };
 
 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, scrollToComponent = props.scrollToComponent, userMentions = props.userMentions, deleteOnBackspace = props.deleteOnBackspace, allowedElementIds = props.allowedElementIds, 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, scrollToComponent = props.scrollToComponent, userMentions = props.userMentions, deleteOnBackspace = props.deleteOnBackspace, hotkey = props.hotkey, allowedElementIds = props.allowedElementIds, 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 ref = React.useRef();
     React.useEffect(function () {
         if (ref.current) {
@@ -225,7 +239,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, "scroll-to-component": [true, false].includes(scrollToComponent) ? (scrollToComponent ? 'true' : 'false') : undefined, "user-mentions": [true, false].includes(userMentions) ? (userMentions ? 'true' : 'false') : undefined, "delete-on-backspace": [true, false].includes(deleteOnBackspace) ? (deleteOnBackspace ? 'true' : 'false') : undefined, "allowed-element-ids": JSON.stringify(allowedElementIds), "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, "scroll-to-component": [true, false].includes(scrollToComponent) ? (scrollToComponent ? '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, "allowed-element-ids": JSON.stringify(allowedElementIds), "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) {
@@ -893,6 +907,82 @@ function useTagAnnotations(documentId, location) {
     return data;
 }
 
+var sessionId = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
+var getSessionId = function () {
+    return sessionId;
+};
+var VELT_DEFAULT_LIVE_STATE_ID = 'velt-default-redux-live-state';
+var createLiveStateMiddleware = function (config) {
+    if (config === void 0) { config = {}; }
+    var _a = config.allowedActionTypes, allowedActionTypes = _a === void 0 ? new Set() : _a, // Set of allowed action types for sync
+    _b = config.disabledActionTypes, // Set of allowed action types for sync
+    disabledActionTypes = _b === void 0 ? new Set() : _b, // Set of disabled action types for sync
+    _c = config.allowAction, // Set of disabled action types for sync
+    allowAction = _c === void 0 ? function () { return true; } : _c, // Callback to decide if an action should sync with live state
+    _d = config.liveStateDataId, // Callback to decide if an action should sync with live state
+    liveStateDataId = _d === void 0 ? VELT_DEFAULT_LIVE_STATE_ID : _d;
+    if (!liveStateDataId) {
+        liveStateDataId = VELT_DEFAULT_LIVE_STATE_ID;
+    }
+    return function (store) {
+        var isSdkInitialized = false;
+        var getDataSubscriptionSet = false;
+        var setupGetDataSubscription = function () {
+            var _a;
+            if (!getDataSubscriptionSet) {
+                getDataSubscriptionSet = true;
+                var liveStateSyncElement = (_a = window.Velt) === null || _a === void 0 ? void 0 : _a.getLiveStateSyncElement();
+                liveStateSyncElement.getLiveStateData(liveStateDataId).subscribe(function (data) {
+                    // Dispatch action to update local state, marking it as remote
+                    if (data) {
+                        var sessionId_1 = getSessionId();
+                        if (data.id === sessionId_1) {
+                            return;
+                        }
+                        else {
+                            store.dispatch(__assign(__assign({}, data.action), { isRemote: true }));
+                        }
+                    }
+                });
+            }
+        };
+        var veltSdkInitializedListener = function () {
+            isSdkInitialized = true;
+            setupGetDataSubscription();
+            // Remove the event listener after it's triggered
+            window.removeEventListener(VELT_SDK_INIT_EVENT, veltSdkInitializedListener);
+        };
+        // Add the event listener for the veltSdkInitialized event
+        window.addEventListener(VELT_SDK_INIT_EVENT, veltSdkInitializedListener);
+        return function (next) { return function (action) {
+            // Always process the action locally
+            var result = next(action);
+            // Decide whether to sync this action with Firebase
+            if (isSdkInitialized && !action.isRemote && allowAction(action) && !disabledActionTypes.has(action.type) && (allowedActionTypes.size === 0 || allowedActionTypes.has(action.type))) {
+                logLiveState(action, liveStateDataId);
+            }
+            return result;
+        }; };
+    };
+};
+var logLiveState = function (action, liveStateDataId) {
+    var _a;
+    if (window.Velt) {
+        var sessionId_2 = getSessionId();
+        var liveStateElement = (_a = window === null || window === void 0 ? void 0 : window.Velt) === null || _a === void 0 ? void 0 : _a.getLiveStateSyncElement();
+        if (liveStateElement === null || liveStateElement === void 0 ? void 0 : liveStateElement.setLiveStateData) {
+            liveStateElement.setLiveStateData(liveStateDataId, {
+                id: sessionId_2,
+                action: action
+            });
+        }
+        liveStateElement.setLiveStateData(liveStateDataId, {
+            id: sessionId_2,
+            action: action
+        });
+    }
+};
+
 exports.VeltArrowTool = SnippylyArrowTool;
 exports.VeltArrows = SnippylyArrows;
 exports.VeltCommentBubble = SnippylyCommentBubble;
@@ -915,6 +1005,7 @@ exports.VeltTags = SnippylyTags;
 exports.VeltUserInviteTool = SnippylyUserInviteTool;
 exports.VeltUserRequestTool = SnippylyUserRequestTool;
 exports.VeltVideoPlayer = VeltVideoPlayer;
+exports.createLiveStateMiddleware = createLiveStateMiddleware;
 exports.useAIRewriterUtils = useAIRewriterUtils;
 exports.useAddLocation = useAddLocation;
 exports.useClient = useClient;