@veltdev/react 1.0.118 → 1.0.119

package/cjs/types/hooks/LiveStateSyncElement.d.ts

@@ -33,4 +33,7 @@ export declare function useEditorAccessRequestHandler(): {
 /**
  * @beta This hook is in beta
  */
-export declare function useLiveState<T>(liveStateDataId: string, initialValue?: any, debounceTime?: number): [T, (value: T) => void];
+export declare function useLiveState<T>(liveStateDataId: string, initialValue?: any, options?: {
+    syncDuration?: number;
+    resetLiveState?: boolean;
+}): [T, (value: T) => void];

package/esm/index.js

@@ -1984,18 +1984,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.useState(initialValue), data = _a[0], setData = _a[1];
+    var client = useVeltClient().client;
+    var _a = React.useState(null), documentId = _a[0], setDocumentId = _a[1];
+    var _b = React.useState(null), user = _b[0], setUser = _b[1];
+    var _c = React.useState(initialValue), data = _c[0], setData = _c[1];
+    useEffect(function () {
+        resetLiveStateData();
+    }, [documentId, user]);
+    var resetLiveStateData = function () {
+        if (user && documentId) {
+            liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.setLiveStateData(liveStateDataId, data);
+        }
+    };
     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) {
@@ -2016,7 +2043,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) {