@noya-app/noya-multiplayer-react 0.1.47 → 0.1.49

package/dist/index.d.mts

@@ -3,7 +3,7 @@ import { ConnectedUsersManager, EphemeralUserDataManager, NoyaManager, StateMana
 export * from '@noya-app/state-manager';
 import React, { SetStateAction } from 'react';
 import { GetAtPath, ObservableOptions, PathKey, Observable } from '@noya-app/observable';
-import * as _noya_app_noya_designsystem from '@noya-app/noya-designsystem';
+import { MenuItem } from '@noya-app/noya-designsystem';
 
 type Point = {
     x: number;
@@ -116,11 +116,20 @@ interface NoyaStateProviderProps<S, M extends object, E extends object, MenuT ex
     initialState?: S;
     fallback?: React.ReactNode;
 }
+declare function useAnyNoyaStateContext(): {
+    noyaManager: NoyaManager<any, any, any, any>;
+    theme: AppTheme;
+    viewType: AppViewType;
+};
+declare function useAnyNoyaManager(): NoyaManager<any, any, any, any>;
+declare function useColorScheme(): AppTheme;
+declare function useViewType(): AppViewType;
 declare function useAssets(): _noya_app_state_manager.Asset[];
 declare function useAsset(id: string | undefined): _noya_app_state_manager.Asset | undefined;
 declare function useAssetManager(): {
     create: (options: _noya_app_state_manager.CreateAssetOptions | Uint8Array | File | Blob) => Promise<_noya_app_state_manager.Asset>;
     delete: (id: string) => Promise<void>;
+    isInitialized: boolean;
 };
 declare function useAIManager(): _noya_app_state_manager.AIManager;
 declare function useSecretManager(): _noya_app_state_manager.SecretManager;
@@ -159,11 +168,18 @@ declare function createNoyaContext<Schema extends TSchema, M extends object = ob
     };
     useStateManager: () => MultiplayerStateManager<Static<Schema>, M>;
     useEphemeralUserDataManager: () => EphemeralUserDataManager<E>;
-    useLeftMenuItems: () => _noya_app_noya_designsystem.RegularMenuItem<MenuT>[];
-    useRightMenuItems: () => _noya_app_noya_designsystem.RegularMenuItem<MenuT>[];
+    useLeftMenuItems: () => MenuItem<MenuT>[];
+    useSetLeftMenuItems: (leftMenuItems?: MenuItem<MenuT>[]) => void;
+    useRightMenuItems: () => MenuItem<MenuT>[];
+    useSetRightMenuItems: (rightMenuItems?: MenuItem<MenuT>[]) => void;
     useHandleMenuItem: (callback: (type: MenuT) => void) => void;
     useOnSelectMenuItemCallback: () => (type: MenuT) => void;
     useNoyaManager: () => NoyaManager<Static<Schema>, M, E, MenuT>;
+    useMenu: (options: {
+        leftMenuItems?: MenuItem<MenuT>[];
+        rightMenuItems?: MenuItem<MenuT>[];
+        onSelectMenuItem?: (type: MenuT) => void;
+    }) => void;
 };
 
 declare function useObservable<T>(observable: Observable<T>): T;
@@ -208,4 +224,4 @@ declare class WebSocketConnection<State> {
     removeListener(listener: (state: ReconnectingWebSocketState) => void): void;
 }
 
-export { AnyEphemeralUserDataManagerContext, type AppData, type AppTheme, type AppViewType, ConnectedUsersContext, type ConnectionEvent, type ConnectionOptions, FallbackUntilInitialized, type GetAppDataOptions, type RenderUserPointer, type RenderUserPointerProps, StateInspector, type StateInspectorAnchor, type StateInspectorOptions, type UseMultiplayerStateOptions, type UseNoyaStateOptions, type UseNoyaStateResult, type UserPointerData, UserPointersOverlay, type UserPointersOverlayProps, WebSocketConnection, createDefaultAppData, createNoyaContext, enforceSchema, getAppData, parseAppDataParameter, useAIManager, useAnyEphemeralUserData, useAsset, useAssetManager, useAssets, useConnectedUsersManager, useCurrentUserId, useIsInitialized, useManagedHistory, useManagedState, useMultiplayerState, useNoyaState, useObservable, useSecret, useSecretManager, useSecrets, useSyncStateManager, useWorkflowManager };
+export { AnyEphemeralUserDataManagerContext, type AppData, type AppTheme, type AppViewType, ConnectedUsersContext, type ConnectionEvent, type ConnectionOptions, FallbackUntilInitialized, type GetAppDataOptions, type RenderUserPointer, type RenderUserPointerProps, StateInspector, type StateInspectorAnchor, type StateInspectorOptions, type UseMultiplayerStateOptions, type UseNoyaStateOptions, type UseNoyaStateResult, type UserPointerData, UserPointersOverlay, type UserPointersOverlayProps, WebSocketConnection, createDefaultAppData, createNoyaContext, enforceSchema, getAppData, parseAppDataParameter, useAIManager, useAnyEphemeralUserData, useAnyNoyaManager, useAnyNoyaStateContext, useAsset, useAssetManager, useAssets, useColorScheme, useConnectedUsersManager, useCurrentUserId, useIsInitialized, useManagedHistory, useManagedState, useMultiplayerState, useNoyaState, useObservable, useSecret, useSecretManager, useSecrets, useSyncStateManager, useViewType, useWorkflowManager };

package/dist/index.d.ts

@@ -3,7 +3,7 @@ import { ConnectedUsersManager, EphemeralUserDataManager, NoyaManager, StateMana
 export * from '@noya-app/state-manager';
 import React, { SetStateAction } from 'react';
 import { GetAtPath, ObservableOptions, PathKey, Observable } from '@noya-app/observable';
-import * as _noya_app_noya_designsystem from '@noya-app/noya-designsystem';
+import { MenuItem } from '@noya-app/noya-designsystem';
 
 type Point = {
     x: number;
@@ -116,11 +116,20 @@ interface NoyaStateProviderProps<S, M extends object, E extends object, MenuT ex
     initialState?: S;
     fallback?: React.ReactNode;
 }
+declare function useAnyNoyaStateContext(): {
+    noyaManager: NoyaManager<any, any, any, any>;
+    theme: AppTheme;
+    viewType: AppViewType;
+};
+declare function useAnyNoyaManager(): NoyaManager<any, any, any, any>;
+declare function useColorScheme(): AppTheme;
+declare function useViewType(): AppViewType;
 declare function useAssets(): _noya_app_state_manager.Asset[];
 declare function useAsset(id: string | undefined): _noya_app_state_manager.Asset | undefined;
 declare function useAssetManager(): {
     create: (options: _noya_app_state_manager.CreateAssetOptions | Uint8Array | File | Blob) => Promise<_noya_app_state_manager.Asset>;
     delete: (id: string) => Promise<void>;
+    isInitialized: boolean;
 };
 declare function useAIManager(): _noya_app_state_manager.AIManager;
 declare function useSecretManager(): _noya_app_state_manager.SecretManager;
@@ -159,11 +168,18 @@ declare function createNoyaContext<Schema extends TSchema, M extends object = ob
     };
     useStateManager: () => MultiplayerStateManager<Static<Schema>, M>;
     useEphemeralUserDataManager: () => EphemeralUserDataManager<E>;
-    useLeftMenuItems: () => _noya_app_noya_designsystem.RegularMenuItem<MenuT>[];
-    useRightMenuItems: () => _noya_app_noya_designsystem.RegularMenuItem<MenuT>[];
+    useLeftMenuItems: () => MenuItem<MenuT>[];
+    useSetLeftMenuItems: (leftMenuItems?: MenuItem<MenuT>[]) => void;
+    useRightMenuItems: () => MenuItem<MenuT>[];
+    useSetRightMenuItems: (rightMenuItems?: MenuItem<MenuT>[]) => void;
     useHandleMenuItem: (callback: (type: MenuT) => void) => void;
     useOnSelectMenuItemCallback: () => (type: MenuT) => void;
     useNoyaManager: () => NoyaManager<Static<Schema>, M, E, MenuT>;
+    useMenu: (options: {
+        leftMenuItems?: MenuItem<MenuT>[];
+        rightMenuItems?: MenuItem<MenuT>[];
+        onSelectMenuItem?: (type: MenuT) => void;
+    }) => void;
 };
 
 declare function useObservable<T>(observable: Observable<T>): T;
@@ -208,4 +224,4 @@ declare class WebSocketConnection<State> {
     removeListener(listener: (state: ReconnectingWebSocketState) => void): void;
 }
 
-export { AnyEphemeralUserDataManagerContext, type AppData, type AppTheme, type AppViewType, ConnectedUsersContext, type ConnectionEvent, type ConnectionOptions, FallbackUntilInitialized, type GetAppDataOptions, type RenderUserPointer, type RenderUserPointerProps, StateInspector, type StateInspectorAnchor, type StateInspectorOptions, type UseMultiplayerStateOptions, type UseNoyaStateOptions, type UseNoyaStateResult, type UserPointerData, UserPointersOverlay, type UserPointersOverlayProps, WebSocketConnection, createDefaultAppData, createNoyaContext, enforceSchema, getAppData, parseAppDataParameter, useAIManager, useAnyEphemeralUserData, useAsset, useAssetManager, useAssets, useConnectedUsersManager, useCurrentUserId, useIsInitialized, useManagedHistory, useManagedState, useMultiplayerState, useNoyaState, useObservable, useSecret, useSecretManager, useSecrets, useSyncStateManager, useWorkflowManager };
+export { AnyEphemeralUserDataManagerContext, type AppData, type AppTheme, type AppViewType, ConnectedUsersContext, type ConnectionEvent, type ConnectionOptions, FallbackUntilInitialized, type GetAppDataOptions, type RenderUserPointer, type RenderUserPointerProps, StateInspector, type StateInspectorAnchor, type StateInspectorOptions, type UseMultiplayerStateOptions, type UseNoyaStateOptions, type UseNoyaStateResult, type UserPointerData, UserPointersOverlay, type UserPointersOverlayProps, WebSocketConnection, createDefaultAppData, createNoyaContext, enforceSchema, getAppData, parseAppDataParameter, useAIManager, useAnyEphemeralUserData, useAnyNoyaManager, useAnyNoyaStateContext, useAsset, useAssetManager, useAssets, useColorScheme, useConnectedUsersManager, useCurrentUserId, useIsInitialized, useManagedHistory, useManagedState, useMultiplayerState, useNoyaState, useObservable, useSecret, useSecretManager, useSecrets, useSyncStateManager, useViewType, useWorkflowManager };

package/dist/index.js

@@ -44,9 +44,12 @@ __export(src_exports, {
   parseAppDataParameter: () => parseAppDataParameter,
   useAIManager: () => useAIManager,
   useAnyEphemeralUserData: () => useAnyEphemeralUserData,
+  useAnyNoyaManager: () => useAnyNoyaManager,
+  useAnyNoyaStateContext: () => useAnyNoyaStateContext,
   useAsset: () => useAsset,
   useAssetManager: () => useAssetManager,
   useAssets: () => useAssets,
+  useColorScheme: () => useColorScheme,
   useConnectedUsersManager: () => useConnectedUsersManager,
   useCurrentUserId: () => useCurrentUserId,
   useIsInitialized: () => useIsInitialized,
@@ -59,6 +62,7 @@ __export(src_exports, {
   useSecretManager: () => useSecretManager,
   useSecrets: () => useSecrets,
   useSyncStateManager: () => useSyncStateManager,
+  useViewType: () => useViewType,
   useWorkflowManager: () => useWorkflowManager
 });
 module.exports = __toCommonJS(src_exports);
@@ -1370,7 +1374,10 @@ function useNoyaState(...args) {
     });
   });
   const sync = (0, import_react7.useMemo)(() => {
-    return (0, import_state_manager2.isEmbeddedApp)() ? (0, import_state_manager2.parentFrameSync)({ debug: options?.debug }) : multiplayerUrl ? (0, import_state_manager2.webSocketSync)(multiplayerUrl) : options?.offlineStorageKey ? (0, import_state_manager2.localStorageSync)({ key: options.offlineStorageKey }) : (0, import_state_manager2.stubSync)();
+    return (0, import_state_manager2.isEmbeddedApp)() ? (0, import_state_manager2.parentFrameSync)({ debug: options?.debug }) : multiplayerUrl ? (0, import_state_manager2.webSocketSync)({
+      url: multiplayerUrl,
+      debug: options?.debug
+    }) : options?.offlineStorageKey ? (0, import_state_manager2.localStorageSync)({ key: options.offlineStorageKey }) : (0, import_state_manager2.stubSync)();
   }, [multiplayerUrl, options?.offlineStorageKey, options?.debug]);
   const result = useMultiplayerState(noyaAppInitialState, {
     ...options,
@@ -1397,69 +1404,81 @@ function useAnyNoyaStateContext() {
   }
   return value;
 }
+function useAnyNoyaManager() {
+  const { noyaManager } = useAnyNoyaStateContext();
+  return noyaManager;
+}
+function useColorScheme() {
+  const { theme } = useAnyNoyaStateContext();
+  return theme;
+}
+function useViewType() {
+  const { viewType } = useAnyNoyaStateContext();
+  return viewType;
+}
 function useAssets() {
-  const { assetManager } = useAnyNoyaStateContext();
-  return useObservable(assetManager.assets$);
+  const { noyaManager } = useAnyNoyaStateContext();
+  return useObservable(noyaManager.assetManager.assets$);
 }
 function useAsset(id) {
-  const { assetManager } = useAnyNoyaStateContext();
+  const { noyaManager } = useAnyNoyaStateContext();
   const observable = (0, import_react8.useMemo)(
-    () => assetManager.assets$.map((assets) => assets.find((a) => a.id === id)),
-    [assetManager, id]
+    () => noyaManager.assetManager.assets$.map(
+      (assets) => assets.find((a) => a.id === id)
+    ),
+    [noyaManager, id]
   );
   return useObservable(observable);
 }
 function useAssetManager() {
-  const { assetManager } = useAnyNoyaStateContext();
+  const { noyaManager } = useAnyNoyaStateContext();
+  const isInitialized = useObservable(noyaManager.assetManager.isInitialized$);
   return (0, import_react8.useMemo)(
     () => ({
-      create: assetManager.create,
-      delete: assetManager.delete
+      create: noyaManager.assetManager.create,
+      delete: noyaManager.assetManager.delete,
+      isInitialized
     }),
-    [assetManager]
+    [noyaManager, isInitialized]
   );
 }
 function useAIManager() {
-  const { aiManager } = useAnyNoyaStateContext();
-  return aiManager;
+  const { noyaManager } = useAnyNoyaStateContext();
+  return noyaManager.aiManager;
 }
 function useSecretManager() {
-  const { secretManager } = useAnyNoyaStateContext();
-  return secretManager;
+  const { noyaManager } = useAnyNoyaStateContext();
+  return noyaManager.secretManager;
 }
 function useSecrets() {
-  const { secretManager } = useAnyNoyaStateContext();
-  return useObservable(secretManager.secrets$);
+  const { noyaManager } = useAnyNoyaStateContext();
+  return useObservable(noyaManager.secretManager.secrets$);
 }
 function useSecret(name) {
-  const { secretManager } = useAnyNoyaStateContext();
+  const { noyaManager } = useAnyNoyaStateContext();
   return useObservable(
-    secretManager.secrets$,
+    noyaManager.secretManager.secrets$,
     (0, import_react8.useCallback)((secrets) => secrets.find((s) => s.name === name), [name])
   );
 }
 function useIsInitialized() {
-  const {
-    multiplayerStateManager: ms,
-    secretManager,
-    assetManager
-  } = useAnyNoyaStateContext();
+  const { noyaManager, viewType } = useAnyNoyaStateContext();
   const isInitializedObservable = (0, import_react8.useMemo)(
     () => import_observable.Observable.combine(
       [
-        ms.isInitialized$,
-        secretManager.isInitialized$,
-        assetManager.isInitialized$
+        ...viewType === "preview" ? [] : [noyaManager.multiplayerStateManager.isInitialized$],
+        noyaManager.secretManager.isInitialized$,
+        noyaManager.assetManager.isInitialized$
       ],
       (values) => values.every((v) => v)
     ),
-    [ms, secretManager, assetManager]
+    [noyaManager, viewType]
   );
   return useObservable(isInitializedObservable);
 }
 function useWorkflowManager() {
-  const { workflowManager } = useAnyNoyaStateContext();
-  return workflowManager;
+  const { noyaManager } = useAnyNoyaStateContext();
+  return noyaManager.workflowManager;
 }
 var ConnectedUsersContext = (0, import_react8.createContext)(void 0);
 function useConnectedUsersManager() {
@@ -1491,12 +1510,23 @@ function createNoyaContext({
     initialState,
     ...options
   }) {
-    const [, , { noyaManager }] = useNoyaState(initialState, {
-      ...options,
-      schema,
-      mergeHistoryEntries
-    });
-    return /* @__PURE__ */ import_react8.default.createElement(AnyNoyaStateContext.Provider, { value: noyaManager }, /* @__PURE__ */ import_react8.default.createElement(
+    const [, , { noyaManager, theme, viewType }] = useNoyaState(
+      initialState,
+      {
+        ...options,
+        schema,
+        mergeHistoryEntries
+      }
+    );
+    const contextValue = (0, import_react8.useMemo)(
+      () => ({
+        noyaManager,
+        theme,
+        viewType
+      }),
+      [noyaManager, theme, viewType]
+    );
+    return /* @__PURE__ */ import_react8.default.createElement(AnyNoyaStateContext.Provider, { value: contextValue }, /* @__PURE__ */ import_react8.default.createElement(
       ConnectedUsersContext.Provider,
       {
         value: noyaManager.connectedUsersManager
@@ -1511,25 +1541,31 @@ function createNoyaContext({
     ));
   }
   function useValue(path, options) {
-    const { multiplayerStateManager: ms } = useAnyNoyaStateContext();
+    const { noyaManager } = useAnyNoyaStateContext();
     let actualPath = typeof path === "function" || !path ? "" : path;
     const mappedObservable = (0, import_react8.useMemo)(() => {
       if (typeof path === "function") {
-        return ms.optimisticState$.map(path, { isEqual: options?.isEqual });
+        return noyaManager.multiplayerStateManager.optimisticState$.map(path, {
+          isEqual: options?.isEqual
+        });
       }
-      return ms.optimisticState$;
-    }, [ms, path, options?.isEqual]);
+      return noyaManager.multiplayerStateManager.optimisticState$;
+    }, [noyaManager, path, options?.isEqual]);
     const value = useObservable(mappedObservable, actualPath);
     return value;
   }
   function useSetValue(path) {
-    const { multiplayerStateManager: ms } = useAnyNoyaStateContext();
+    const { noyaManager } = useAnyNoyaStateContext();
     const setValue = (0, import_react8.useCallback)(
       (...args) => {
         const [metadata, value] = args.length === 2 ? args : [{}, args[0]];
-        ms.setStateAtPath(metadata, path ?? "", value);
+        noyaManager.multiplayerStateManager.setStateAtPath(
+          metadata,
+          path ?? "",
+          value
+        );
       },
-      [ms, path]
+      [noyaManager, path]
     );
     return setValue;
   }
@@ -1540,8 +1576,8 @@ function createNoyaContext({
     return [value, setValue];
   }
   function useStateManager() {
-    const { multiplayerStateManager: ms } = useAnyNoyaStateContext();
-    return ms;
+    const { noyaManager } = useAnyNoyaStateContext();
+    return noyaManager.multiplayerStateManager;
   }
   function useEphemeralUserDataManager() {
     const ephemeralUserData = (0, import_react8.useContext)(EphemeralUserDataManagerContext);
@@ -1553,16 +1589,32 @@ function createNoyaContext({
     return ephemeralUserData;
   }
   function useNoyaManager() {
-    return useAnyNoyaStateContext();
+    return useAnyNoyaStateContext().noyaManager;
   }
   function useLeftMenuItems() {
     const { menuManager } = useNoyaManager();
     return useObservable(menuManager.leftMenuItems$);
   }
+  function useSetLeftMenuItems(leftMenuItems) {
+    const { menuManager } = useNoyaManager();
+    (0, import_react8.useEffect)(() => {
+      if (leftMenuItems) {
+        menuManager.setLeftMenuItems(leftMenuItems);
+      }
+    }, [menuManager, leftMenuItems]);
+  }
   function useRightMenuItems() {
     const { menuManager } = useNoyaManager();
     return useObservable(menuManager.rightMenuItems$);
   }
+  function useSetRightMenuItems(rightMenuItems) {
+    const { menuManager } = useNoyaManager();
+    (0, import_react8.useEffect)(() => {
+      if (rightMenuItems) {
+        menuManager.setRightMenuItems(rightMenuItems);
+      }
+    }, [menuManager, rightMenuItems]);
+  }
   function useHandleMenuItem(callback) {
     const { menuManager } = useNoyaManager();
     (0, import_react8.useEffect)(() => {
@@ -1573,6 +1625,14 @@ function createNoyaContext({
     const { menuManager } = useNoyaManager();
     return (0, import_react8.useCallback)((type) => menuManager.emit(type), [menuManager]);
   }
+  function useMenu(options) {
+    const { leftMenuItems, rightMenuItems, onSelectMenuItem } = options;
+    useSetLeftMenuItems(leftMenuItems);
+    useSetRightMenuItems(rightMenuItems);
+    const noop = (0, import_react8.useCallback)(() => {
+    }, []);
+    useHandleMenuItem(onSelectMenuItem ?? noop);
+  }
   return {
     Context: NoyaStateContext,
     Provider: NoyaStateProvider,
@@ -1582,10 +1642,13 @@ function createNoyaContext({
     useStateManager,
     useEphemeralUserDataManager,
     useLeftMenuItems,
+    useSetLeftMenuItems,
     useRightMenuItems,
+    useSetRightMenuItems,
     useHandleMenuItem,
     useOnSelectMenuItemCallback,
-    useNoyaManager
+    useNoyaManager,
+    useMenu
   };
 }
 
@@ -1699,9 +1762,12 @@ var WebSocketConnection = class {
   parseAppDataParameter,
   useAIManager,
   useAnyEphemeralUserData,
+  useAnyNoyaManager,
+  useAnyNoyaStateContext,
   useAsset,
   useAssetManager,
   useAssets,
+  useColorScheme,
   useConnectedUsersManager,
   useCurrentUserId,
   useIsInitialized,
@@ -1714,6 +1780,7 @@ var WebSocketConnection = class {
   useSecretManager,
   useSecrets,
   useSyncStateManager,
+  useViewType,
   useWorkflowManager,
   ...require("@noya-app/state-manager")
 });