@noya-app/noya-multiplayer-react 0.1.42 → 0.1.44

package/dist/index.js

@@ -31,94 +31,70 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
+  AnyEphemeralUserDataManagerContext: () => AnyEphemeralUserDataManagerContext,
+  ConnectedUsersContext: () => ConnectedUsersContext,
+  FallbackUntilInitialized: () => FallbackUntilInitialized,
   StateInspector: () => StateInspector,
-  UserNameTag: () => UserNameTag,
-  UserPointer: () => UserPointer2,
-  UserPointerContainer: () => UserPointerContainer,
-  UserPointerIcon: () => UserPointerIcon,
   UserPointersOverlay: () => UserPointersOverlay,
   createDefaultAppData: () => createDefaultAppData,
   createNoyaContext: () => createNoyaContext,
   enforceSchema: () => enforceSchema,
   getAppData: () => getAppData,
-  getAvatarInitials: () => getAvatarInitials,
-  getAvatarStyle: () => getAvatarStyle,
   isEmbeddedApp: () => isEmbeddedApp,
   parseAppDataParameter: () => parseAppDataParameter,
+  useAIManager: () => useAIManager,
+  useAnyEphemeralUserData: () => useAnyEphemeralUserData,
   useAsset: () => useAsset,
   useAssetManager: () => useAssetManager,
   useAssets: () => useAssets,
   useBroadcastConnectedUsers: () => useBroadcastConnectedUsers,
   useBroadcastMenuItems: () => useBroadcastMenuItems,
-  useEphemeralUserData: () => useEphemeralUserData,
+  useConnectedUsersManager: () => useConnectedUsersManager,
+  useCurrentUserId: () => useCurrentUserId,
+  useIsInitialized: () => useIsInitialized,
   useManagedHistory: () => useManagedHistory,
   useManagedState: () => useManagedState,
   useMultiplayerState: () => useMultiplayerState,
   useNoyaState: () => useNoyaState,
   useObservable: () => useObservable,
+  useSecret: () => useSecret,
+  useSecretManager: () => useSecretManager,
+  useSecrets: () => useSecrets,
   useSyncMultiplayerStateManager: () => useSyncMultiplayerStateManager,
-  useSyncStateManager: () => useSyncStateManager
+  useSyncStateManager: () => useSyncStateManager,
+  useWorkflowManager: () => useWorkflowManager
 });
 module.exports = __toCommonJS(src_exports);
 __reExport(src_exports, require("@noya-app/state-manager"), module.exports);
 
-// src/avatarStyle.ts
-function hashCode(string) {
-  let hash = 0;
-  for (const char of string) {
-    hash = char.charCodeAt(0) + ((hash << 5) - hash);
-  }
-  return hash;
-}
-function elementFromHash(array, hash) {
-  return array[Math.abs(hash) % array.length];
-}
-function getAvatarInitials(name) {
-  return name.split(" ").filter((c) => c.length > 0).map((c) => c[0]).join("").toLocaleUpperCase();
-}
-function getAvatarStyle(name) {
-  const hash = hashCode(name);
-  const color = elementFromHash(Object.values(colors500), hash);
-  return {
-    color: "white",
-    backgroundColor: color
-    // primaryColors: {
-    //   "500": color,
-    //   "800": darkerColor,
-    // },
-  };
-}
-var colors500 = {
-  red500: "#ef4444",
-  orange500: "#f97316",
-  amber500: "#f59e0b",
-  yellow500: "#eab308",
-  lime500: "#84cc16",
-  green500: "#22c55e",
-  emerald500: "#10b981",
-  teal500: "#14b8a6",
-  cyan500: "#06b6d4",
-  sky500: "#0ea5e9",
-  blue500: "#3b82f6",
-  indigo500: "#6366f1",
-  violet500: "#8b5cf6",
-  purple500: "#a855f7",
-  fuchsia500: "#d946ef",
-  pink500: "#ec4899",
-  rose500: "#f43f5e"
-};
-
 // src/components/UserPointersOverlay.tsx
+var import_react_utils = require("@noya-app/react-utils");
 var import_react2 = __toESM(require("react"));
 
 // src/useObservable.ts
 var import_react = require("react");
-function useObservable(observable, path) {
+function useObservable(observable, pathOrSelector, options) {
   const { get, listen } = (0, import_react.useMemo)(() => {
-    const listen2 = path ? (callback) => observable.subscribe(path, callback) : observable.subscribe;
-    const get2 = path ? () => observable.get(path) : observable.get;
+    if (!observable) {
+      return {
+        get: () => void 0,
+        listen: () => () => {
+        }
+      };
+    }
+    if (typeof pathOrSelector === "function") {
+      const mappedObservable = observable.map(pathOrSelector, {
+        isEqual: options?.isEqual
+      });
+      return {
+        get: mappedObservable.get,
+        listen: mappedObservable.subscribe
+      };
+    }
+    const listen2 = pathOrSelector ? (callback) => observable.subscribe(pathOrSelector, callback) : observable.subscribe;
+    const get2 = pathOrSelector ? () => observable.get(pathOrSelector) : observable.get;
     return { get: get2, listen: listen2 };
-  }, [observable, path]);
+  }, [observable, pathOrSelector, options?.isEqual]);
   return (0, import_react.useSyncExternalStore)(listen, get, get);
 }
 
@@ -126,136 +102,78 @@ function useObservable(observable, path) {
 function shouldShow(hideAfter, updatedAt) {
   return !!updatedAt && Date.now() - updatedAt < hideAfter;
 }
-var UserPointer_ = function UserPointer({
+var UserPointerInternal = (0, import_react_utils.memoGeneric)(function UserPointerInternal2({
   user,
-  ephemeralUserData,
-  hideAfter = 5e3
+  ephemeralUserDataManager,
+  hideAfter = 5e3,
+  renderUserPointer
 }) {
-  const metadata = useObservable(ephemeralUserData.metadata$, [
+  const metadata = useObservable(ephemeralUserDataManager.metadata$, [
+    user.id
+  ]);
+  const data = useObservable(ephemeralUserDataManager.data$, [
     user.id
   ]);
-  const data = useObservable(ephemeralUserData.data$, [user.id]);
-  const avatarStyle = (0, import_react2.useMemo)(() => getAvatarStyle(user.id), [user.id]);
   const [, setForceUpdate] = (0, import_react2.useState)(0);
   const updatedAt = metadata?.updatedAt ?? 0;
+  const show = shouldShow(hideAfter, updatedAt);
   (0, import_react2.useEffect)(() => {
-    if (!shouldShow(hideAfter, updatedAt)) return;
+    if (!show) return;
     const timeoutId = setTimeout(() => {
       setForceUpdate((prev) => prev + 1);
     }, hideAfter);
     return () => clearTimeout(timeoutId);
-  }, [hideAfter, updatedAt]);
-  const show = shouldShow(hideAfter, updatedAt);
-  if (!data || !data.pointer) return null;
-  return /* @__PURE__ */ import_react2.default.createElement(UserPointerContainer, { key: user.id, point: data.pointer, show }, /* @__PURE__ */ import_react2.default.createElement(UserPointerIcon, { color: avatarStyle.backgroundColor }), /* @__PURE__ */ import_react2.default.createElement(UserNameTag, { background: avatarStyle.backgroundColor }, user.name));
-};
-var UserPointer2 = (0, import_react2.memo)(UserPointer_);
-var UserPointerContainer = (0, import_react2.memo)(function UserPointerContainer2({
-  point,
-  children,
-  show = true
-}) {
-  return /* @__PURE__ */ import_react2.default.createElement(
-    "div",
-    {
-      style: {
-        position: "absolute",
-        top: 0,
-        left: 0,
-        transform: `translate(${Math.round(point.x)}px, ${Math.round(
-          point.y
-        )}px)`,
-        opacity: show ? 1 : 0,
-        transition: "transform 0.1s, opacity 0.2s"
-      }
-    },
-    children
-  );
+  }, [hideAfter, show, updatedAt]);
+  if (!data?.pointer) return null;
+  return renderUserPointer({
+    userId: user.id,
+    name: user.name,
+    point: data.pointer,
+    visible: show
+  });
 });
-var UserNameTag = (0, import_react2.memo)(function UserNameTag2({
-  background,
-  children
+var UserPointersOverlay = (0, import_react_utils.memoGeneric)(function UserPointers({
+  connectedUsersManager,
+  ephemeralUserDataManager,
+  renderUserPointer
 }) {
-  return /* @__PURE__ */ import_react2.default.createElement(
-    "span",
-    {
-      style: {
-        position: "relative",
-        top: "8px",
-        left: "15px",
-        fontSize: 11,
-        lineHeight: "1",
-        fontWeight: 500,
-        boxShadow: "0 1px 1px rgba(0,0,0,0.1)",
-        padding: "2px 4px 3px",
-        pointerEvents: "none",
-        letterSpacing: "-0.3px",
-        outline: `1px solid rgba(255,255,255,0.3)`,
-        outlineOffset: "-1px",
-        background,
-        color: "white"
-      }
-    },
-    children
-  );
-});
-var UserPointersOverlay = (0, import_react2.memo)(function UserPointers({ connectedUsers, ephemeralUserData }) {
-  const currentUserId = useObservable(ephemeralUserData.currentUserId$);
+  const currentUserId = useObservable(ephemeralUserDataManager.currentUserId$);
+  const connectedUsers = useObservable(connectedUsersManager.connectedUsers$);
   return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, connectedUsers.map((user) => {
     if (user.id === currentUserId) return null;
     return /* @__PURE__ */ import_react2.default.createElement(
-      UserPointer2,
+      UserPointerInternal,
       {
         key: user.id,
         user,
-        ephemeralUserData
+        ephemeralUserDataManager,
+        renderUserPointer
       }
     );
   }));
 });
-var UserPointerIcon = (0, import_react2.memo)(function CursorIcon({
-  color = "black"
-}) {
-  return /* @__PURE__ */ import_react2.default.createElement(
-    "svg",
-    {
-      width: "15",
-      height: "15",
-      viewBox: "0 0 15 15",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      style: {
-        position: "absolute",
-        filter: "drop-shadow(0 1px 1px rgba(0,0,0,0.1))"
-        // filter: "drop-shadow(0 1px 1px rgba(0,0,0,0.6))",
-      }
-    },
-    /* @__PURE__ */ import_react2.default.createElement(
-      "path",
-      {
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M3.29227 0.0451998C3.47033 -0.0361222 3.67946 -0.00606629 3.8274 0.122107L12.8587 7.94648C13.0134 8.08054 13.0708 8.29538 13.0035 8.48873C12.9362 8.68208 12.7578 8.81488 12.5533 8.8239L9.21887 8.97096L11.1504 13.2149C11.2648 13.4662 11.1538 13.7626 10.9026 13.877L8.75024 14.8575C8.499 14.972 8.20255 14.8611 8.08802 14.6099L6.15339 10.3665L3.86279 12.7817C3.72196 12.9302 3.50487 12.9779 3.31479 12.9021C3.1247 12.8263 3 12.6423 3 12.4376V0.500008C3 0.304264 3.11422 0.126522 3.29227 0.0451998Z",
-        fill: color
-      }
-    ),
-    /* @__PURE__ */ import_react2.default.createElement(
-      "path",
-      {
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M3.29227 0.048984C3.47033 -0.032338 3.67946 -0.00228211 3.8274 0.125891L12.8587 7.95026C13.0134 8.08432 13.0708 8.29916 13.0035 8.49251C12.9362 8.68586 12.7578 8.81866 12.5533 8.82768L9.21887 8.97474L11.1504 13.2187C11.2648 13.47 11.1538 13.7664 10.9026 13.8808L8.75024 14.8613C8.499 14.9758 8.20255 14.8649 8.08802 14.6137L6.15339 10.3703L3.86279 12.7855C3.72196 12.934 3.50487 12.9817 3.31479 12.9059C3.1247 12.8301 3 12.6461 3 12.4414V0.503792C3 0.308048 3.11422 0.130306 3.29227 0.048984ZM4 1.59852V11.1877L5.93799 9.14425C6.05238 9.02363 6.21924 8.96776 6.38319 8.99516C6.54715 9.02256 6.68677 9.12965 6.75573 9.2809L8.79056 13.7441L10.0332 13.178L8.00195 8.71497C7.93313 8.56376 7.94391 8.38824 8.03072 8.24659C8.11753 8.10494 8.26903 8.01566 8.435 8.00834L11.2549 7.88397L4 1.59852Z",
-        fill: "rgba(255,255,255,0.5)"
-      }
-    )
-  );
-});
 
 // src/hooks.ts
 var import_state_manager = require("@noya-app/state-manager");
 var import_react7 = require("react");
 var import_client2 = require("react-dom/client");
 
+// ../noya-state-manager/src/SecretManager.ts
+var import_observable = require("@noya-app/observable");
+var SecretManager = class {
+  constructor(rpcManager) {
+    this.rpcManager = rpcManager;
+  }
+  secrets$ = new import_observable.Observable([]);
+  isInitialized$ = new import_observable.Observable(false);
+  async createSecret(name, value) {
+    return await this.rpcManager.request({ type: "createSecret", name, value });
+  }
+  async deleteSecret(name) {
+    return await this.rpcManager.request({ type: "deleteSecret", name });
+  }
+};
+
 // src/components/ErrorOverlay.tsx
 var import_react3 = __toESM(require("react"));
 function ErrorOverlay({
@@ -331,15 +249,16 @@ function ErrorOverlay({
 }
 
 // src/globals.ts
-var import_observable = require("@noya-app/observable");
-var shouldTrackEvents$ = new import_observable.Observable(false);
-var shouldTrackTasks$ = new import_observable.Observable(false);
+var import_observable2 = require("@noya-app/observable");
+var shouldTrackEvents$ = new import_observable2.Observable(false);
+var shouldTrackTasks$ = new import_observable2.Observable(false);
 
 // src/inspector/useStateInspector.tsx
 var import_react6 = __toESM(require("react"));
 var import_client = require("react-dom/client");
 
 // src/inspector/StateInspector.tsx
+var import_react_utils2 = require("@noya-app/react-utils");
 var import_react5 = __toESM(require("react"));
 var import_react_inspector = require("react-inspector");
 
@@ -523,7 +442,7 @@ function InspectorRow({
         padding: "2px 12px 1px",
         display: "flex",
         alignItems: "center",
-        background: variant === "up" ? "rgba(0,255,0,0.1)" : variant === "down" ? "rgba(255,0,0,0.1)" : selected ? "rgb(59 130 246 / 15%)" : void 0,
+        background: variant === "up" ? "rgba(0,255,0,0.1)" : variant === "down" ? "transparent" : selected ? "rgb(59 130 246 / 15%)" : void 0,
         // background:
         //   colorScheme === "light"
         //     ? "rgba(0,0,0,0.05)"
@@ -546,17 +465,17 @@ function InspectorRow({
   );
 }
 var HISTORY_ELEMENT_PREFIX = "noya-multiplayer-history-";
-var StateInspector = (0, import_react5.memo)(function StateInspector2({
+var StateInspector = (0, import_react_utils2.memoGeneric)(function StateInspector2({
   state,
   connectionEvents,
-  connectedUsers,
   tasks,
-  userId,
   unstyled,
   colorScheme = "light",
   multiplayerStateManager,
   assetManager,
-  ephemeralUserData,
+  secretManager,
+  connectedUsersManager,
+  ephemeralUserDataManager,
   anchor = "right",
   forceInit,
   ...props
@@ -599,6 +518,10 @@ var StateInspector = (0, import_react5.memo)(function StateInspector2({
     "noya-multiplayer-react-show-assets",
     false
   );
+  const [showSecrets, setShowSecrets] = useLocalStorageState(
+    "noya-multiplayer-react-show-secrets",
+    false
+  );
   (0, import_react5.useEffect)(() => {
     shouldTrackEvents$.set(showEvents);
   }, [showEvents]);
@@ -610,9 +533,12 @@ var StateInspector = (0, import_react5.memo)(function StateInspector2({
       eventsContainerRef.current.scrollTop = eventsContainerRef.current.scrollHeight;
     }
   }, [connectionEvents]);
-  const ephemeral = useEphemeralUserData(ephemeralUserData);
+  const ephemeral = useObservable(ephemeralUserDataManager.data$);
   const historySnapshot = useManagedHistory(multiplayerStateManager.sm);
   const assets = useObservable(assetManager.assets$);
+  const secrets = useObservable(secretManager.secrets$);
+  const connectedUsers = useObservable(connectedUsersManager.connectedUsers$);
+  const userId = useObservable(connectedUsersManager.currentUserId$);
   (0, import_react5.useEffect)(() => {
     if (historyContainerRef.current) {
       historyContainerRef.current.scrollTop = historyContainerRef.current.scrollHeight;
@@ -995,6 +921,37 @@ var StateInspector = (0, import_react5.memo)(function StateInspector2({
         )
       )))
     ),
+    /* @__PURE__ */ import_react5.default.createElement(
+      DisclosureSection,
+      {
+        title: "Secrets",
+        colorScheme,
+        open: showSecrets,
+        setOpen: setShowSecrets,
+        right: /* @__PURE__ */ import_react5.default.createElement(
+          SmallButton,
+          {
+            theme,
+            onClick: () => {
+              const name = prompt("Enter secret name");
+              if (!name) return;
+              const value = prompt("Enter secret value");
+              if (!value) return;
+              secretManager.createSecret(name, value);
+            }
+          },
+          "Create"
+        )
+      },
+      /* @__PURE__ */ import_react5.default.createElement("div", { style: styles.sectionInner }, secrets.map((secret) => /* @__PURE__ */ import_react5.default.createElement(InspectorRow, { key: secret.id, colorScheme }, /* @__PURE__ */ import_react5.default.createElement(import_react_inspector.ObjectInspector, { data: secret, theme }), /* @__PURE__ */ import_react5.default.createElement(
+        SmallButton,
+        {
+          theme,
+          onClick: () => secretManager.deleteSecret(secret.name)
+        },
+        "Delete"
+      ))))
+    ),
     /* @__PURE__ */ import_react5.default.createElement(
       DisclosureSection,
       {
@@ -1191,15 +1148,15 @@ function createShadowRootElement() {
 function useStateInspector({
   state,
   connectionEvents,
-  connectedUsers,
   tasks,
-  userId,
   disabled = false,
   colorScheme,
   anchor,
   multiplayerStateManager,
   assetManager,
-  ephemeralUserData,
+  secretManager,
+  connectedUsersManager,
+  ephemeralUserDataManager,
   forceInit
 }) {
   const [root, setRoot] = import_react6.default.useState(null);
@@ -1221,31 +1178,31 @@ function useStateInspector({
         {
           state,
           connectionEvents,
-          connectedUsers,
           tasks,
-          userId,
           colorScheme,
           anchor,
           forceInit,
           multiplayerStateManager,
           assetManager,
-          ephemeralUserData
+          secretManager,
+          ephemeralUserDataManager,
+          connectedUsersManager
         }
       )
     );
   }, [
     anchor,
     colorScheme,
-    connectedUsers,
     connectionEvents,
     root,
     state,
     multiplayerStateManager,
-    userId,
     tasks,
     forceInit,
-    ephemeralUserData,
-    assetManager
+    ephemeralUserDataManager,
+    assetManager,
+    secretManager,
+    connectedUsersManager
   ]);
 }
 
@@ -1315,95 +1272,63 @@ function useSyncMultiplayerStateManager(multiplayerStateManager) {
     multiplayerStateManager.getOptimisticState
   );
 }
-function throttle(fn, ms) {
-  let lastCall = 0;
-  let timeoutId = null;
-  return (...args) => {
-    const now = Date.now();
-    if (now - lastCall < ms) {
-      if (timeoutId) clearTimeout(timeoutId);
-      timeoutId = setTimeout(
-        () => {
-          lastCall = now;
-          fn(...args);
-        },
-        ms - (now - lastCall)
-      );
-      return;
-    }
-    lastCall = now;
-    return fn(...args);
-  };
-}
-function useEphemeralUserData(ephemeralUserData, options) {
-  const throttledAddListener = (0, import_react7.useMemo)(() => {
-    const throttleMs = options?.throttle ?? 0;
-    if (throttleMs > 0) {
-      const addListener = (fn) => {
-        const throttledFn = throttle(fn, throttleMs);
-        return ephemeralUserData.addListener(throttledFn);
-      };
-      return addListener;
-    }
-    return ephemeralUserData.addListener;
-  }, [ephemeralUserData, options?.throttle]);
-  return (0, import_react7.useSyncExternalStore)(
-    throttledAddListener,
-    ephemeralUserData.getSnapshot,
-    ephemeralUserData.getSnapshot
-  );
-}
 var defaultStubSync = (0, import_state_manager.stubSync)();
 function useMultiplayerState(initialState, options) {
   const { sync = defaultStubSync, ...rest } = options ?? {};
+  const [rpcManager] = (0, import_react7.useState)(
+    () => new import_state_manager.RPCManager()
+  );
   const [multiplayerStateManager] = (0, import_react7.useState)(
     () => new import_state_manager.MultiplayerStateManager(initialState, rest)
   );
   const [assetManager] = (0, import_react7.useState)(() => new import_state_manager.AssetManager());
+  const [aiManager] = (0, import_react7.useState)(() => new import_state_manager.AIManager(rpcManager));
+  const [workflowManager] = (0, import_react7.useState)(() => new import_state_manager.WorkflowManager(rpcManager));
+  const [secretManager] = (0, import_react7.useState)(() => new SecretManager(rpcManager));
+  const [connectedUsersManager] = (0, import_react7.useState)(() => new import_state_manager.ConnectedUsersManager());
   const syncRef = (0, import_react7.useRef)(sync);
   const [connectionEvents, setConnectionEvents] = (0, import_react7.useState)();
-  const [connectedUsers, setConnectedUsers] = (0, import_react7.useState)([]);
-  const [ephemeralUserData] = (0, import_react7.useState)(
-    () => new import_state_manager.EphemeralUserData()
+  const [ephemeralUserDataManager] = (0, import_react7.useState)(
+    () => new import_state_manager.EphemeralUserDataManager()
   );
   const [tasks, setTasks] = (0, import_react7.useState)([]);
-  const [userId, setUserId] = (0, import_react7.useState)();
   const assets = useObservable(assetManager.assets$);
   const extras = (0, import_react7.useMemo)(() => {
     return {
       tasks,
-      userId,
       connectionEvents,
-      connectedUsers,
-      ephemeralUserData,
+      connectedUsersManager,
+      ephemeralUserDataManager,
       multiplayerStateManager,
       assets,
       assetManager,
+      aiManager,
+      rpcManager,
+      workflowManager,
+      secretManager,
       createAsset: assetManager.create,
       deleteAsset: assetManager.delete
-      // evaluate: async (code: string) => {
-      //   const payload = await rpcManager.request({ type: "eval", code });
-      //   if (payload.type !== "eval") {
-      //     throw new Error(`Unexpected rpc response type: ${payload.type}`);
-      //   }
-      // },
+      // connectionStatus,
+      // isConnected: connectionStatus === "connected",
     };
   }, [
     tasks,
-    userId,
     connectionEvents,
-    connectedUsers,
-    ephemeralUserData,
+    connectedUsersManager,
+    ephemeralUserDataManager,
     multiplayerStateManager,
+    assets,
     assetManager,
-    assets
+    aiManager,
+    rpcManager,
+    workflowManager,
+    secretManager
   ]);
   const globalTrackEvents = useObservable(shouldTrackEvents$);
   const globalTrackTasks = useObservable(shouldTrackTasks$);
   const shouldTrackEvents = options?.trackConnectionEvents ?? globalTrackEvents;
   const shouldTrackTasks = options?.trackTasks ?? globalTrackTasks;
   const trackEventsCallbackRef = (0, import_react7.useRef)();
-  const trackConnectedUsersCallbackRef = (0, import_react7.useRef)();
   const trackTasksCallbackRef = (0, import_react7.useRef)();
   (0, import_react7.useEffect)(() => {
     trackEventsCallbackRef.current = shouldTrackEvents ? (e) => setConnectionEvents((events) => {
@@ -1411,12 +1336,6 @@ function useMultiplayerState(initialState, options) {
       return updated.length > 50 ? updated.slice(-50) : updated;
     }) : void 0;
   }, [shouldTrackEvents]);
-  (0, import_react7.useEffect)(() => {
-    trackConnectedUsersCallbackRef.current = (users, userId2) => {
-      setConnectedUsers(users);
-      setUserId(userId2);
-    };
-  }, []);
   (0, import_react7.useEffect)(() => {
     trackTasksCallbackRef.current = shouldTrackTasks ? (tasks2) => {
       setTasks((old) => {
@@ -1431,13 +1350,26 @@ function useMultiplayerState(initialState, options) {
       return syncRef.current({
         ms: multiplayerStateManager,
         assetManager,
-        ephemeralUserData,
+        workflowManager,
+        secretManager,
+        rpcManager,
+        aiManager,
+        ephemeralUserDataManager,
+        connectedUsersManager,
         onConnectionEvent: (e) => trackEventsCallbackRef.current?.(e),
-        onChangeConnectedUsers: (users, userId2) => trackConnectedUsersCallbackRef.current?.(users, userId2),
         onChangeTasks: (tasks2) => trackTasksCallbackRef.current?.(tasks2)
       });
     }
-  }, [assetManager, ephemeralUserData, multiplayerStateManager]);
+  }, [
+    assetManager,
+    ephemeralUserDataManager,
+    multiplayerStateManager,
+    workflowManager,
+    secretManager,
+    rpcManager,
+    aiManager,
+    connectedUsersManager
+  ]);
   const state = useSyncMultiplayerStateManager(multiplayerStateManager);
   const forceInit = (0, import_react7.useCallback)(() => {
     const state2 = initialState instanceof Function ? initialState() : initialState;
@@ -1472,14 +1404,14 @@ function useMultiplayerState(initialState, options) {
     };
   });
   useStateInspector({
-    ephemeralUserData,
+    ephemeralUserDataManager,
     multiplayerStateManager,
     assetManager,
+    secretManager,
     state,
     connectionEvents,
-    connectedUsers,
+    connectedUsersManager,
     tasks,
-    userId,
     forceInit,
     disabled: !options?.inspector,
     ...typeof options?.inspector === "object" && options.inspector
@@ -1528,15 +1460,20 @@ function getAppData(initialState, schema, options) {
   appData.initialState = enforceSchema(appData.initialState, schema);
   return appData;
 }
-function useBroadcastConnectedUsers(connectedUsers) {
+function useBroadcastConnectedUsers(connectedUsersManager) {
   (0, import_react8.useEffect)(() => {
     if (!isEmbeddedApp()) return;
-    const message = {
-      type: "multiplayer.setUsers",
-      payload: { users: connectedUsers }
-    };
-    parent?.postMessage(message, "*");
-  }, [connectedUsers]);
+    const unsubscribe = connectedUsersManager.connectedUsers$.subscribe(
+      (users) => {
+        const message = {
+          type: "multiplayer.setUsers",
+          payload: { users }
+        };
+        parent?.postMessage(message, "*");
+      }
+    );
+    return unsubscribe;
+  }, [connectedUsersManager]);
 }
 function useBroadcastMenuItems(menuItems, handleSelectMenuItem) {
   (0, import_react8.useEffect)(() => {
@@ -1584,7 +1521,7 @@ function useNoyaState(...args) {
     sync: options?.sync ?? sync
   });
   const [, , extras] = result;
-  useBroadcastConnectedUsers(extras.connectedUsers);
+  useBroadcastConnectedUsers(extras.connectedUsersManager);
   const mergedExtras = (0, import_react8.useMemo)(() => {
     return { ...extras, theme, viewType };
   }, [extras, theme, viewType]);
@@ -1592,6 +1529,7 @@ function useNoyaState(...args) {
 }
 
 // src/NoyaStateContext.tsx
+var import_observable3 = require("@noya-app/observable");
 var import_react9 = __toESM(require("react"));
 var AnyNoyaStateContext = (0, import_react9.createContext)(void 0);
 function useAnyNoyaStateContext() {
@@ -1625,32 +1563,114 @@ function useAssetManager() {
     [assetManager]
   );
 }
+function useAIManager() {
+  const { aiManager } = useAnyNoyaStateContext();
+  return aiManager;
+}
+function useSecretManager() {
+  const { secretManager } = useAnyNoyaStateContext();
+  return secretManager;
+}
+function useSecrets() {
+  const { secretManager } = useAnyNoyaStateContext();
+  return useObservable(secretManager.secrets$);
+}
+function useSecret(name) {
+  const { secretManager } = useAnyNoyaStateContext();
+  return useObservable(
+    secretManager.secrets$,
+    (0, import_react9.useCallback)((secrets) => secrets.find((s) => s.name === name), [name])
+  );
+}
+function useIsInitialized() {
+  const { ms, secretManager, assetManager } = useAnyNoyaStateContext();
+  const isInitializedObservable = (0, import_react9.useMemo)(
+    () => import_observable3.Observable.combine(
+      [
+        ms.isInitialized$,
+        secretManager.isInitialized$,
+        assetManager.isInitialized$
+      ],
+      (values) => values.every((v) => v)
+    ),
+    [ms, secretManager, assetManager]
+  );
+  return useObservable(isInitializedObservable);
+}
+function useWorkflowManager() {
+  const { workflowManager } = useAnyNoyaStateContext();
+  return workflowManager;
+}
+var ConnectedUsersContext = (0, import_react9.createContext)(void 0);
+function useConnectedUsersManager() {
+  return (0, import_react9.useContext)(ConnectedUsersContext);
+}
+var AnyEphemeralUserDataManagerContext = (0, import_react9.createContext)(void 0);
+function useAnyEphemeralUserData() {
+  return (0, import_react9.useContext)(AnyEphemeralUserDataManagerContext);
+}
+function useCurrentUserId() {
+  const connectedUsersManager = useConnectedUsersManager();
+  return useObservable(connectedUsersManager?.currentUserId$);
+}
+var FallbackUntilInitialized = ({
+  children,
+  fallback
+}) => {
+  const isInitialized = useIsInitialized();
+  return isInitialized ? children : fallback ?? null;
+};
 function createNoyaContext({
   schema,
   mergeHistoryEntries
 }) {
   const NoyaStateContext = AnyNoyaStateContext;
+  const EphemeralUserDataManagerContext = AnyEphemeralUserDataManagerContext;
   function NoyaStateProvider({
     children,
     initialState,
     ...options
   }) {
-    const [, , { multiplayerStateManager, assetManager }] = useNoyaState(
-      initialState,
+    const [
+      ,
+      ,
       {
-        ...options,
-        schema,
-        mergeHistoryEntries
+        multiplayerStateManager,
+        assetManager,
+        workflowManager,
+        secretManager,
+        aiManager,
+        ephemeralUserDataManager,
+        connectedUsersManager
       }
-    );
+    ] = useNoyaState(initialState, {
+      ...options,
+      schema,
+      mergeHistoryEntries
+    });
     const value = (0, import_react9.useMemo)(
       () => ({
         ms: multiplayerStateManager,
-        assetManager
+        assetManager,
+        workflowManager,
+        secretManager,
+        aiManager
       }),
-      [multiplayerStateManager, assetManager]
+      [
+        multiplayerStateManager,
+        assetManager,
+        workflowManager,
+        secretManager,
+        aiManager
+      ]
     );
-    return /* @__PURE__ */ import_react9.default.createElement(AnyNoyaStateContext.Provider, { value }, children);
+    return /* @__PURE__ */ import_react9.default.createElement(AnyNoyaStateContext.Provider, { value }, /* @__PURE__ */ import_react9.default.createElement(ConnectedUsersContext.Provider, { value: connectedUsersManager }, /* @__PURE__ */ import_react9.default.createElement(
+      EphemeralUserDataManagerContext.Provider,
+      {
+        value: ephemeralUserDataManager
+      },
+      options.fallback !== void 0 ? /* @__PURE__ */ import_react9.default.createElement(FallbackUntilInitialized, { fallback: options.fallback }, children) : children
+    )));
   }
   function useValue(path, options) {
     const { ms } = useAnyNoyaStateContext();
@@ -1686,13 +1706,23 @@ function createNoyaContext({
     const { ms } = useAnyNoyaStateContext();
     return ms;
   }
+  function useEphemeralUserDataManager() {
+    const ephemeralUserData = (0, import_react9.useContext)(EphemeralUserDataManagerContext);
+    if (!ephemeralUserData) {
+      throw new Error(
+        "useEphemeralUserData must be used within a NoyaStateProvider"
+      );
+    }
+    return ephemeralUserData;
+  }
   return {
     Context: NoyaStateContext,
     Provider: NoyaStateProvider,
     useValue,
     useSetValue,
     useValueState,
-    useStateManager
+    useStateManager,
+    useEphemeralUserDataManager
     // useAssets,
     // useAssetManager,
     // useAsset,
@@ -1700,33 +1730,38 @@ function createNoyaContext({
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  AnyEphemeralUserDataManagerContext,
+  ConnectedUsersContext,
+  FallbackUntilInitialized,
   StateInspector,
-  UserNameTag,
-  UserPointer,
-  UserPointerContainer,
-  UserPointerIcon,
   UserPointersOverlay,
   createDefaultAppData,
   createNoyaContext,
   enforceSchema,
   getAppData,
-  getAvatarInitials,
-  getAvatarStyle,
   isEmbeddedApp,
   parseAppDataParameter,
+  useAIManager,
+  useAnyEphemeralUserData,
   useAsset,
   useAssetManager,
   useAssets,
   useBroadcastConnectedUsers,
   useBroadcastMenuItems,
-  useEphemeralUserData,
+  useConnectedUsersManager,
+  useCurrentUserId,
+  useIsInitialized,
   useManagedHistory,
   useManagedState,
   useMultiplayerState,
   useNoyaState,
   useObservable,
+  useSecret,
+  useSecretManager,
+  useSecrets,
   useSyncMultiplayerStateManager,
   useSyncStateManager,
+  useWorkflowManager,
   ...require("@noya-app/state-manager")
 });
 //# sourceMappingURL=index.js.map