@veltdev/react 1.0.68 → 1.0.70

package/cjs/index.js

@@ -94,7 +94,7 @@ var loadVelt = function (callback, version, staging) {
     }
 };
 
-var VELT_SDK_VERSION = '1.0.83';
+var VELT_SDK_VERSION = '1.0.87';
 
 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;
@@ -593,7 +593,7 @@ function useCursorUtils() {
  */
 function useCursorUsers() {
     var cursorElement = useCursorUtils();
-    var _a = React__default["default"].useState(), data = _a[0], setData = _a[1];
+    var _a = React__default["default"].useState(null), data = _a[0], setData = _a[1];
     React.useEffect(function () {
         if (!cursorElement)
             return;
@@ -670,7 +670,7 @@ function useSetLiveStateData(liveStateDataId, liveStateData) {
  */
 function useUserEditorState() {
     var liveStateSyncElement = useLiveStateSyncUtils();
-    var _a = React__default["default"].useState(), data = _a[0], setData = _a[1];
+    var _a = React__default["default"].useState(null), data = _a[0], setData = _a[1];
     React.useEffect(function () {
         if (!(liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.isUserEditor))
             return;
@@ -688,7 +688,7 @@ function useUserEditorState() {
  */
 function useEditor() {
     var liveStateSyncElement = useLiveStateSyncUtils();
-    var _a = React__default["default"].useState(), data = _a[0], setData = _a[1];
+    var _a = React__default["default"].useState(null), data = _a[0], setData = _a[1];
     React.useEffect(function () {
         if (!(liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.getEditor))
             return;
@@ -706,7 +706,7 @@ function useEditor() {
  */
 function useEditorAccessRequestHandler() {
     var liveStateSyncElement = useLiveStateSyncUtils();
-    var _a = React__default["default"].useState(), data = _a[0], setData = _a[1];
+    var _a = React__default["default"].useState(null), data = _a[0], setData = _a[1];
     React.useEffect(function () {
         if (!(liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.isEditorAccessRequested))
             return;
@@ -719,6 +719,50 @@ function useEditorAccessRequestHandler() {
     }, [liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.isEditorAccessRequested]);
     return data;
 }
+/**
+ * @beta This hook is in beta
+ */
+function useLiveState(liveStateDataId, initialValue, debounceTime) {
+    if (debounceTime === void 0) { debounceTime = 50; }
+    var liveStateSyncElement = useLiveStateSyncUtils();
+    var _a = React__default["default"].useState(initialValue), data = _a[0], setData = _a[1];
+    React.useEffect(function () {
+        if (!(liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.getLiveStateData))
+            return;
+        var subscription = liveStateSyncElement.getLiveStateData(liveStateDataId).subscribe(function (res) {
+            setData(res);
+        });
+        return function () {
+            subscription.unsubscribe();
+        };
+    }, [liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.getLiveStateData]);
+    var useDebounce = function (callback) {
+        var callbackRef = React.useRef(callback);
+        var timerRef = React.useRef(null);
+        React.useEffect(function () {
+            callbackRef.current = callback;
+        });
+        var debounce = function (value, delay) {
+            if (timerRef.current) {
+                clearTimeout(timerRef.current);
+            }
+            timerRef.current = setTimeout(function () {
+                callbackRef.current(value);
+            }, delay);
+        };
+        return debounce;
+    };
+    var setDataFunction = function (value) {
+        setData(value);
+        debouncedOnInput(value, debounceTime); // default 50ms debounce time
+    };
+    var debouncedOnInput = useDebounce(function (value) {
+        if (liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.setLiveStateData) {
+            liveStateSyncElement.setLiveStateData(liveStateDataId, value);
+        }
+    });
+    return [data, setDataFunction];
+}
 
 /**
  * @beta This hook is in beta
@@ -739,7 +783,7 @@ function usePresenceUtils() {
  */
 function usePresenceUsers() {
     var presenceElement = usePresenceUtils();
-    var _a = React__default["default"].useState(), data = _a[0], setData = _a[1];
+    var _a = React__default["default"].useState(null), data = _a[0], setData = _a[1];
     React.useEffect(function () {
         if (!presenceElement)
             return;
@@ -835,7 +879,7 @@ function useTagUtils() {
  */
 function useTagAnnotations(documentId, location) {
     var tagElement = useTagUtils();
-    var _a = React__default["default"].useState(), data = _a[0], setData = _a[1];
+    var _a = React__default["default"].useState(null), data = _a[0], setData = _a[1];
     React.useEffect(function () {
         if (!tagElement)
             return;
@@ -887,6 +931,7 @@ exports.useEditorAccessRequestHandler = useEditorAccessRequestHandler;
 exports.useHuddleUtils = useHuddleUtils;
 exports.useIdentify = useIdentify;
 exports.useLiveSelectionUtils = useLiveSelectionUtils;
+exports.useLiveState = useLiveState;
 exports.useLiveStateData = useLiveStateData;
 exports.useLiveStateSyncUtils = useLiveStateSyncUtils;
 exports.usePresenceUsers = usePresenceUsers;