@veltdev/react 4.5.0-beta.1 → 4.5.0-beta.3

package/cjs/index.js

@@ -140,7 +140,7 @@ var loadVelt = function (callback, version, staging, develop, proxyDomain) {
     }
 };
 
-var VELT_SDK_VERSION = '4.5.0-beta.1';
+var VELT_SDK_VERSION = '4.5.0-beta.3';
 var VELT_SDK_INIT_EVENT = 'onVeltInit';
 var VELT_TAB_ID = 'veltTabId';
 
@@ -531,7 +531,7 @@ var SnippylyHuddleTool = function (props) {
 };
 
 var SnippylyPresence = function (props) {
-    var maxUsers = props.maxUsers, inactivityTime = props.inactivityTime, documentParams = props.documentParams, location = props.location, locationId = props.locationId, self = props.self, onPresenceUserClick = props.onPresenceUserClick, onUsersChanged = props.onUsersChanged, onPresenceUserChange = props.onPresenceUserChange, disableFlockNavigation = props.disableFlockNavigation, defaultFlockNavigation = props.defaultFlockNavigation, onNavigate = props.onNavigate, flockMode = props.flockMode, shadowDom = props.shadowDom;
+    var maxUsers = props.maxUsers, inactivityTime = props.inactivityTime, offlineInactivityTime = props.offlineInactivityTime, documentParams = props.documentParams, location = props.location, locationId = props.locationId, self = props.self, onPresenceUserClick = props.onPresenceUserClick, onUsersChanged = props.onUsersChanged, onPresenceUserChange = props.onPresenceUserChange, disableFlockNavigation = props.disableFlockNavigation, defaultFlockNavigation = props.defaultFlockNavigation, onNavigate = props.onNavigate, flockMode = props.flockMode, shadowDom = props.shadowDom;
     var ref = React.useRef();
     var onUsersChangedRef = React.useRef(onUsersChanged);
     var onPresenceUserChangeRef = React.useRef(onPresenceUserChange);
@@ -586,7 +586,7 @@ var SnippylyPresence = function (props) {
             }
         };
     }, []);
-    return (React__default["default"].createElement("velt-presence", { ref: ref, "flock-mode": [true, false].includes(flockMode) ? (flockMode ? 'true' : 'false') : undefined, "max-users": maxUsers, "inactivity-time": inactivityTime, "document-params": (typeof documentParams === 'object') ? JSON.stringify(documentParams) : (documentParams ? documentParams : undefined), "disable-flock-navigation": [true, false].includes(disableFlockNavigation) ? (disableFlockNavigation ? 'true' : 'false') : undefined, "default-flock-navigation": [true, false].includes(defaultFlockNavigation) ? (defaultFlockNavigation ? 'true' : 'false') : undefined, self: [true, false].includes(self) ? (self ? 'true' : 'false') : undefined, location: (typeof location === 'object') ? JSON.stringify(location) : (location ? location : undefined), "location-id": locationId, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined }));
+    return (React__default["default"].createElement("velt-presence", { ref: ref, "flock-mode": [true, false].includes(flockMode) ? (flockMode ? 'true' : 'false') : undefined, "max-users": maxUsers, "inactivity-time": inactivityTime, "offline-inactivity-time": offlineInactivityTime, "document-params": (typeof documentParams === 'object') ? JSON.stringify(documentParams) : (documentParams ? documentParams : undefined), "disable-flock-navigation": [true, false].includes(disableFlockNavigation) ? (disableFlockNavigation ? 'true' : 'false') : undefined, "default-flock-navigation": [true, false].includes(defaultFlockNavigation) ? (defaultFlockNavigation ? 'true' : 'false') : undefined, self: [true, false].includes(self) ? (self ? 'true' : 'false') : undefined, location: (typeof location === 'object') ? JSON.stringify(location) : (location ? location : undefined), "location-id": locationId, "shadow-dom": [true, false].includes(shadowDom) ? (shadowDom ? 'true' : 'false') : undefined }));
 };
 
 var SnippylyRecorderControlPanel = function (props) {
@@ -6377,6 +6377,33 @@ function useLiveState(liveStateDataId, initialValue, options) {
     return [data, setDataFunction, serverConnectionState];
 }
 
+function useLiveStateSyncEventCallback(action) {
+    var liveStateSyncElement = useLiveStateSyncUtils();
+    var _a = React.useState(null), data = _a[0], setData = _a[1];
+    var subscriptionRef = React.useRef(null);
+    var memoizedAction = React.useMemo(function () { return action; }, [action]);
+    React.useEffect(function () {
+        var _a;
+        if (!(liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.on))
+            return;
+        if (subscriptionRef.current) {
+            subscriptionRef.current.unsubscribe();
+        }
+        var subscription = (_a = liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.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();
+            }
+        };
+    }, [liveStateSyncElement === null || liveStateSyncElement === void 0 ? void 0 : liveStateSyncElement.on, memoizedAction]);
+    return data;
+}
+
 function usePresenceUtils() {
     var _a = React__default["default"].useState(), presenceElement = _a[0], setPresenceElement = _a[1];
     var client = useVeltClient().client;
@@ -6404,6 +6431,33 @@ function usePresenceUsers() {
     return data;
 }
 
+function usePresenceEventCallback(action) {
+    var presenceElement = usePresenceUtils();
+    var _a = React.useState(null), data = _a[0], setData = _a[1];
+    var subscriptionRef = React.useRef(null);
+    var memoizedAction = React.useMemo(function () { return action; }, [action]);
+    React.useEffect(function () {
+        var _a;
+        if (!(presenceElement === null || presenceElement === void 0 ? void 0 : presenceElement.on))
+            return;
+        if (subscriptionRef.current) {
+            subscriptionRef.current.unsubscribe();
+        }
+        var subscription = (_a = presenceElement === null || presenceElement === void 0 ? void 0 : presenceElement.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();
+            }
+        };
+    }, [presenceElement === null || presenceElement === void 0 ? void 0 : presenceElement.on, memoizedAction]);
+    return data;
+}
+
 function useRecorderUtils() {
     var _a = React__default["default"].useState(), recorderElement = _a[0], setRecorderElement = _a[1];
     var client = useVeltClient().client;
@@ -7041,9 +7095,11 @@ exports.useLiveSelectionDataHandler = useLiveSelectionDataHandler;
 exports.useLiveSelectionUtils = useLiveSelectionUtils;
 exports.useLiveState = useLiveState;
 exports.useLiveStateData = useLiveStateData;
+exports.useLiveStateSyncEventCallback = useLiveStateSyncEventCallback;
 exports.useLiveStateSyncUtils = useLiveStateSyncUtils;
 exports.useNotificationUtils = useNotificationUtils;
 exports.useNotificationsData = useNotificationsData;
+exports.usePresenceEventCallback = usePresenceEventCallback;
 exports.usePresenceUsers = usePresenceUsers;
 exports.usePresenceUtils = usePresenceUtils;
 exports.useRecorderAddHandler = useRecorderAddHandler;