@noya-app/noya-multiplayer-react 0.1.65 → 0.1.67

package/dist/index.js

@@ -1495,24 +1495,30 @@ var require_lib2 = __commonJS({
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  AnyEphemeralUserDataManagerContext: () => AnyEphemeralUserDataManagerContext,
   AnyNoyaStateContext: () => AnyNoyaStateContext,
-  ConnectedUsersContext: () => ConnectedUsersContext,
   FallbackUntilInitialized: () => FallbackUntilInitialized,
   StateInspector: () => StateInspector,
   UserPointersOverlay: () => UserPointersOverlay,
   WebSocketConnection: () => WebSocketConnection,
+  buildCreateResourcePayload: () => buildCreateResourcePayload,
   createDefaultAppData: () => createDefaultAppData,
   createNoyaContext: () => createNoyaContext,
+  createStateInspectorRoot: () => createStateInspectorRoot,
   decodeAll: () => decodeAll,
+  deleteNoyaSingleton: () => deleteNoyaSingleton,
   encodeAll: () => encodeAll,
   enforceSchema: () => enforceSchema,
   exportAll: () => exportAll,
   fetchAssetMap: () => fetchAssetMap,
   getAppData: () => getAppData,
+  getNoyaManagerSingleton: () => getNoyaManagerSingleton,
+  getNoyaSingletonBindings: () => getNoyaSingletonBindings,
+  getSyncAdapter: () => getSyncAdapter,
   importAll: () => importAll,
+  initializeNoyaSingleton: () => initializeNoyaSingleton,
   parseAppDataParameter: () => parseAppDataParameter,
   replaceDeep: () => replaceDeep,
+  resourceToCreateParameters: () => resourceToCreateParameters,
   resourceToMediaItem: () => resourceToMediaItem,
   useAIManager: () => useAIManager,
   useActivityEvents: () => useActivityEvents,
@@ -1523,12 +1529,15 @@ __export(src_exports, {
   useAsset: () => useAsset,
   useAssetManager: () => useAssetManager,
   useAssets: () => useAssets,
+  useBindNoyaManager: () => useBindNoyaManager,
   useCallableAITools: () => useCallableAITools,
   useColorScheme: () => useColorScheme,
   useConnectedUser: () => useConnectedUser,
   useConnectedUsers: () => useConnectedUsers,
   useConnectedUsersManager: () => useConnectedUsersManager,
   useCurrentUserId: () => useCurrentUserId,
+  useFileName: () => useFileName,
+  useFilePropertyManager: () => useFilePropertyManager,
   useIOManager: () => useIOManager,
   useInputs: () => useInputs,
   useIsInitialized: () => useIsInitialized,
@@ -1536,7 +1545,7 @@ __export(src_exports, {
   useManagedHistory: () => useManagedHistory,
   useManagedState: () => useManagedState,
   useMultiplayerState: () => useMultiplayerState,
-  useNoyaState: () => useNoyaState,
+  useNoyaStateInternal: () => useNoyaStateInternal,
   useObservable: () => useObservable,
   useOutputTransforms: () => useOutputTransforms,
   usePipelineManager: () => usePipelineManager,
@@ -1547,15 +1556,15 @@ __export(src_exports, {
   useSecret: () => useSecret,
   useSecretManager: () => useSecretManager,
   useSecrets: () => useSecrets,
+  useSetFileNameState: () => useSetFileNameState,
   useStateInspector: () => useStateInspector,
-  useSyncStateManager: () => useSyncStateManager,
   useViewType: () => useViewType
 });
 module.exports = __toCommonJS(src_exports);
 __reExport(src_exports, require("@noya-app/state-manager"), module.exports);
 
 // src/ai.ts
-var import_react19 = require("react");
+var import_react20 = require("react");
 
 // ../../node_modules/@sinclair/typebox/build/esm/type/symbols/symbols.mjs
 var TransformKind = Symbol.for("TypeBox.Transform");
@@ -4044,6 +4053,7 @@ var activityEventSchema = Type.Object({
 // ../noya-schemas/src/asset.ts
 var assetSchema = Type.Object({
   id: Type.String(),
+  stableId: Type.String(),
   url: Type.String(),
   createdAt: Type.String(),
   size: Type.Number(),
@@ -4549,6 +4559,26 @@ var flatResourceSchema = Type.Object({
   fileId: Nullable(Type.String()),
   resourceId: Nullable(Type.String())
 });
+function getChangedResourceProperties({
+  oldResource,
+  newResource,
+  oldPath,
+  newPath
+}) {
+  const changed = {};
+  if (newPath !== void 0 && (oldPath ?? oldResource.path) !== newPath) {
+    changed.path = newPath;
+  }
+  const oldAssetId = oldResource.type === "asset" ? oldResource.assetId : void 0;
+  const newAssetId = newResource.type === "asset" ? newResource.assetId : void 0;
+  if (oldAssetId !== newAssetId) {
+    changed.assetId = newAssetId;
+  }
+  if (newResource.type === "asset" && newResource.asset !== void 0) {
+    changed.asset = newResource.asset;
+  }
+  return changed;
+}
 function diffResourceMaps(resourceMap, newResourceMap, idProperty) {
   const oldIdToPathMap = new Map(
     Object.entries(resourceMap).map(([path2, entity]) => [
@@ -4575,7 +4605,7 @@ function diffResourceMaps(resourceMap, newResourceMap, idProperty) {
   const removedResources = Object.values(resourceMap).filter(
     (entity) => !newIds.has(entity[idProperty])
   );
-  const modifiedResources = [...sameIds].flatMap((id) => {
+  const sameIdModifiedResources = [...sameIds].flatMap((id) => {
     const oldResource = Object.values(resourceMap).find(
       (resource) => resource[idProperty] === id
     );
@@ -4585,17 +4615,54 @@ function diffResourceMaps(resourceMap, newResourceMap, idProperty) {
     if (!oldResource || !newResource) return [];
     const oldPath = oldIdToPathMap.get(id);
     const newPath = newIdToPathMap.get(id);
-    const oldAssetId = oldResource.type === "asset" ? oldResource.assetId : void 0;
-    const newAssetId = newResource.type === "asset" ? newResource.assetId : void 0;
-    const changedProperties = {
-      ...oldPath !== newPath ? { path: newPath } : {},
-      ...oldAssetId !== newAssetId ? { assetId: newAssetId } : {},
-      ...newResource.type === "asset" && newResource.asset !== void 0 ? { asset: newResource.asset } : {}
-    };
+    const changedProperties = getChangedResourceProperties({
+      oldResource,
+      newResource,
+      oldPath,
+      newPath
+    });
     if (Object.keys(changedProperties).length === 0) return [];
     return [{ id, stableId: newResource.stableId, ...changedProperties }];
   });
-  return { addedResources, removedResources, modifiedResources };
+  const removedResourcesByPath = new Map(
+    removedResources.map((resource) => [resource.path, resource])
+  );
+  const swappedPaths = /* @__PURE__ */ new Set();
+  const swappedModifiedResources = [];
+  for (const addedResource of addedResources) {
+    const existingResource = removedResourcesByPath.get(addedResource.path);
+    if (!existingResource) continue;
+    if (existingResource.type !== addedResource.type) continue;
+    if (existingResource[idProperty] === addedResource[idProperty]) continue;
+    swappedPaths.add(addedResource.path);
+    const changedProperties = getChangedResourceProperties({
+      oldResource: existingResource,
+      newResource: addedResource,
+      oldPath: existingResource.path,
+      newPath: addedResource.path
+    });
+    if (Object.keys(changedProperties).length === 0) continue;
+    const id = existingResource[idProperty];
+    swappedModifiedResources.push({
+      id,
+      stableId: existingResource.stableId,
+      ...changedProperties
+    });
+  }
+  const filteredAddedResources = addedResources.filter(
+    (resource) => !swappedPaths.has(resource.path)
+  );
+  const filteredRemovedResources = removedResources.filter(
+    (resource) => !swappedPaths.has(resource.path)
+  );
+  return {
+    addedResources: filteredAddedResources,
+    removedResources: filteredRemovedResources,
+    modifiedResources: [
+      ...sameIdModifiedResources,
+      ...swappedModifiedResources
+    ]
+  };
 }
 
 // ../noya-schemas/src/resourceTree.ts
@@ -4614,7 +4681,7 @@ format_exports.Set("uuid", validateUUID);
 // src/NoyaStateContext.tsx
 var import_observable = require("@noya-app/observable");
 var import_react_utils3 = require("@noya-app/react-utils");
-var import_react18 = __toESM(require("react"));
+var import_react19 = __toESM(require("react"));
 
 // src/noyaApp.ts
 var import_state_manager3 = require("@noya-app/state-manager");
@@ -4747,6 +4814,26 @@ var FILE_TYPE_TO_EXTENSION = {
 };
 var FILE_EXTENSION_TO_TYPE = invert(FILE_TYPE_TO_EXTENSION);
 
+// ../noya-utils/src/memoize.ts
+function memoize(f) {
+  const intermediateCache = /* @__PURE__ */ new Map();
+  const cache = /* @__PURE__ */ new Map();
+  let intermediateCacheIndex = 0;
+  return (...values) => {
+    let key = "";
+    for (const value of values) {
+      if (!intermediateCache.has(value)) {
+        intermediateCache.set(value, `${intermediateCacheIndex++}`);
+      }
+      key += intermediateCache.get(value) + ":";
+    }
+    if (!cache.has(key)) {
+      cache.set(key, f(...values));
+    }
+    return cache.get(key);
+  };
+}
+
 // ../noya-utils/src/memoizeDeep.ts
 var TOKEN_OBJECT = Symbol("object");
 var TOKEN_ARRAY = Symbol("array");
@@ -5967,19 +6054,17 @@ async function importAll(buffer, noyaManager, {
   }
   if (assets.length) {
     await Promise.all(
-      noyaManager.assetManager.assets$.get().map((asset) => noyaManager.assetManager.delete(asset.id))
+      noyaManager.assetManager.assets$.get().map((asset) => noyaManager.assetManager.delete(asset.stableId))
     );
-    const idPairs = await Promise.all(
+    await Promise.all(
       assets.map(async (asset) => {
-        const newAsset = await noyaManager.assetManager.create({
+        await noyaManager.assetManager.create({
           data: assetMap[asset.id],
-          contentType: asset.contentType
+          contentType: asset.contentType,
+          stableId: asset.stableId
         });
-        return [asset.id, newAsset.id];
       })
     );
-    const replacementMap = Object.fromEntries(idPairs);
-    state = replaceDeep(state, replacementMap);
   }
   noyaManager.initialState = state;
   noyaManager.forceInit();
@@ -6495,7 +6580,14 @@ var StateInspector = (0, import_react_utils.memoGeneric)(function StateInspector
           "Upload"
         ))
       },
-      /* @__PURE__ */ import_react14.default.createElement(StateInspectorDisclosureRowInner, null, assets.map((asset) => /* @__PURE__ */ import_react14.default.createElement(StateInspectorRow, { key: asset.id, colorScheme }, /* @__PURE__ */ import_react14.default.createElement(import_react_inspector6.ObjectInspector, { name: asset.id, data: asset, theme }), /* @__PURE__ */ import_react14.default.createElement(
+      /* @__PURE__ */ import_react14.default.createElement(StateInspectorDisclosureRowInner, null, assets.map((asset) => /* @__PURE__ */ import_react14.default.createElement(StateInspectorRow, { key: asset.id, colorScheme }, /* @__PURE__ */ import_react14.default.createElement(
+        import_react_inspector6.ObjectInspector,
+        {
+          name: asset.id,
+          data: truncateAsset(asset),
+          theme
+        }
+      ), /* @__PURE__ */ import_react14.default.createElement(
         StateInspectorButton,
         {
           theme,
@@ -6520,10 +6612,8 @@ var StateInspector = (0, import_react_utils.memoGeneric)(function StateInspector
                 "Are you sure you want to delete all resources?"
               );
               if (!ok) return;
-              await Promise.all(
-                resources.map(
-                  (resource) => resourceManager.deleteResource({ id: resource.id })
-                )
+              await resourceManager.deleteResource(
+                resources.map((resource) => ({ id: resource.id }))
               );
             }
           },
@@ -6736,6 +6826,12 @@ var StateInspector = (0, import_react_utils.memoGeneric)(function StateInspector
     )
   );
 });
+var truncateAsset = memoize((asset) => {
+  if (asset.url.startsWith("data:") || asset.url.startsWith("blob:")) {
+    return { ...asset, url: ellipsis(asset.url, 40) };
+  }
+  return asset;
+});
 
 // src/inspector/useStateInspector.tsx
 function createShadowRootElement() {
@@ -6746,6 +6842,17 @@ function createShadowRootElement() {
   shadowRoot.appendChild(container);
   return { host, container };
 }
+function createStateInspectorRoot() {
+  const { host, container } = createShadowRootElement();
+  const root = (0, import_client.createRoot)(container);
+  document.body.appendChild(host);
+  return {
+    root,
+    unmount: () => {
+      document.body.removeChild(host);
+    }
+  };
+}
 function useStateInspector({
   noyaManager,
   disabled = false,
@@ -6755,13 +6862,9 @@ function useStateInspector({
   const [root, setRoot] = import_react15.default.useState(null);
   (0, import_react_utils2.useIsomorphicLayoutEffect)(() => {
     if (disabled) return;
-    const { host, container } = createShadowRootElement();
-    const root2 = (0, import_client.createRoot)(container);
-    document.body.appendChild(host);
+    const { root: root2, unmount } = createStateInspectorRoot();
     setRoot(root2);
-    return () => {
-      document.body.removeChild(host);
-    };
+    return unmount;
   }, [disabled]);
   (0, import_react_utils2.useIsomorphicLayoutEffect)(() => {
     if (!root) return;
@@ -6779,22 +6882,18 @@ function useStateInspector({
 }
 
 // src/hooks.ts
-function useSyncStateManager(stateManager, path2) {
-  const getSnapshot = (0, import_react16.useCallback)(
-    () => typeof path2 === "string" ? stateManager.getState(path2) : stateManager.getState(),
-    [stateManager, path2]
+function useManagedState(createInitialState, options) {
+  const [stateManager] = (0, import_react16.useState)(
+    () => new import_state_manager2.StateManager(createInitialState(), options)
   );
-  return (0, import_react16.useSyncExternalStore)(
+  const getSnapshot = (0, import_react16.useCallback)(() => {
+    return stateManager.getState();
+  }, [stateManager]);
+  const state = (0, import_react16.useSyncExternalStore)(
     stateManager.addListener,
     getSnapshot,
     getSnapshot
   );
-}
-function useManagedState(createInitialState, options) {
-  const [stateManager] = (0, import_react16.useState)(
-    () => new import_state_manager2.StateManager(createInitialState(), options)
-  );
-  const state = useSyncStateManager(stateManager);
   const setState = (0, import_react16.useCallback)(
     (...args) => {
       const [metadata, action] = args.length === 1 ? [void 0, args[0]] : args;
@@ -6837,15 +6936,7 @@ function useManagedHistory(stateManager) {
     stateManager.getHistorySnapshot
   );
 }
-function useMultiplayerState(initialState, options) {
-  const {
-    sync = (0, import_state_manager2.stubSync)(),
-    inspector,
-    ...rest
-  } = options ?? {};
-  const [noyaManager] = (0, import_react16.useState)(
-    () => new import_state_manager2.NoyaManager(initialState, rest)
-  );
+function useBindNoyaManager(noyaManager, options) {
   const state = useObservable(
     noyaManager.multiplayerStateManager.optimisticState$
   );
@@ -6869,7 +6960,7 @@ function useMultiplayerState(initialState, options) {
       assets
     };
   }, [noyaManager, assets]);
-  const syncRef = (0, import_react16.useRef)(sync);
+  const syncRef = (0, import_react16.useRef)(options?.sync);
   (0, import_react16.useEffect)(() => {
     if (syncRef.current) {
       return syncRef.current({ noyaManager });
@@ -6878,11 +6969,22 @@ function useMultiplayerState(initialState, options) {
   useErrorOverlay(noyaManager);
   useStateInspector({
     noyaManager,
-    disabled: !inspector,
-    ...typeof inspector === "object" && inspector
+    disabled: !options?.inspector,
+    ...typeof options?.inspector === "object" && options?.inspector
   });
   return [state, noyaManager.multiplayerStateManager.setState, extras];
 }
+function useMultiplayerState(initialState, options) {
+  const {
+    sync = (0, import_state_manager2.stubSync)(),
+    inspector,
+    ...rest
+  } = options ?? {};
+  const [noyaManager] = (0, import_react16.useState)(
+    () => new import_state_manager2.NoyaManager(initialState, rest)
+  );
+  return useBindNoyaManager(noyaManager, { sync, inspector });
+}
 function useErrorOverlay(noyaManager) {
   const unrecoverableError = useObservable(noyaManager.unrecoverableError);
   (0, import_react16.useEffect)(() => {
@@ -6938,7 +7040,11 @@ function getAppData(initialState, schema, options) {
   appData.initialState = enforceSchema(appData.initialState, schema);
   return appData;
 }
-function useNoyaState(...args) {
+function getSyncAdapter(params) {
+  const { multiplayerUrl, offlineStorageKey, debug } = params ?? {};
+  return (0, import_state_manager3.isEmbeddedApp)() ? (0, import_state_manager3.parentFrameSync)({ debug }) : multiplayerUrl ? (0, import_state_manager3.webSocketSync)({ url: multiplayerUrl, debug }) : offlineStorageKey ? (0, import_state_manager3.localStorageSync)({ key: offlineStorageKey }) : (0, import_state_manager3.stubSync)();
+}
+function useNoyaStateInternal(...args) {
   const [initialState, options] = typeof args[0] === "object" && args[0] !== null && "schema" in args[0] && import_state_manager3.TypeGuard.IsSchema(args[0].schema) ? [null, args[0]] : [args[0], args[1]];
   const [
     {
@@ -6954,13 +7060,16 @@ function useNoyaState(...args) {
     });
   });
   const sync = (0, import_react17.useMemo)(() => {
-    return (0, import_state_manager3.isEmbeddedApp)() ? (0, import_state_manager3.parentFrameSync)({ debug: options?.debug }) : multiplayerUrl ? (0, import_state_manager3.webSocketSync)({
-      url: multiplayerUrl,
+    return getSyncAdapter({
+      multiplayerUrl,
+      offlineStorageKey: options?.offlineStorageKey,
       debug: options?.debug
-    }) : options?.offlineStorageKey ? (0, import_state_manager3.localStorageSync)({ key: options.offlineStorageKey }) : (0, import_state_manager3.stubSync)();
+    });
   }, [multiplayerUrl, options?.offlineStorageKey, options?.debug]);
-  const result = useMultiplayerState(noyaAppInitialState, {
-    ...options,
+  const [noyaManager] = (0, import_react17.useState)(
+    () => new import_state_manager3.NoyaManager(noyaAppInitialState, options)
+  );
+  const result = useBindNoyaManager(noyaManager, {
     inspector: options?.inspector ?? inspector,
     sync: options?.sync ?? sync
   });
@@ -6971,11 +7080,164 @@ function useNoyaState(...args) {
   return [result[0], result[1], mergedExtras];
 }
 
+// src/singleton.tsx
+var import_state_manager4 = require("@noya-app/state-manager");
+var import_react18 = __toESM(require("react"));
+var noyaManagerSingleton;
+var noyaSingletonBindings;
+function initializeNoyaSingleton(options) {
+  if (noyaManagerSingleton) {
+    throw new Error(
+      "Noya has already been initialized. Call `useNoyaState` instead."
+    );
+  }
+  const {
+    initialState,
+    sync,
+    inspector,
+    theme,
+    viewType,
+    offlineStorageKey,
+    multiplayerUrl,
+    ...managerOptions
+  } = options ?? {};
+  const appData = getAppData(
+    initialState ?? null,
+    managerOptions?.schema,
+    { overrideExistingState: managerOptions?.overrideExistingState }
+  );
+  noyaManagerSingleton = new import_state_manager4.NoyaManager(
+    appData.initialState,
+    managerOptions
+  );
+  const resolvedSync = sync ?? getSyncAdapter({
+    multiplayerUrl: multiplayerUrl ?? appData.multiplayerUrl,
+    offlineStorageKey,
+    debug: managerOptions?.debug
+  });
+  try {
+    resolvedSync({ noyaManager: noyaManagerSingleton });
+  } catch (error) {
+    console.warn("Failed to activate sync", error);
+  }
+  const resolvedInspector = inspector ?? appData.inspector;
+  const resolvedTheme = theme ?? appData.theme ?? "light";
+  const resolvedViewType = viewType ?? appData.viewType ?? "editable";
+  if (resolvedInspector) {
+    const { root } = createStateInspectorRoot();
+    root.render(
+      /* @__PURE__ */ import_react18.default.createElement(
+        StateInspector,
+        {
+          noyaManager: noyaManagerSingleton,
+          colorScheme: resolvedInspector === true ? resolvedTheme : resolvedInspector.colorScheme,
+          anchor: resolvedInspector === true ? "bottom right" : resolvedInspector.anchor
+        }
+      )
+    );
+  }
+  noyaSingletonBindings = {
+    sync: resolvedSync,
+    inspector: resolvedInspector,
+    theme: resolvedTheme,
+    viewType: resolvedViewType
+  };
+}
+function getNoyaManagerSingleton() {
+  if (!noyaManagerSingleton || !noyaSingletonBindings) {
+    throw new Error(
+      "Noya has not been initialized. Call initializeNoya once before using Noya hooks."
+    );
+  }
+  return noyaManagerSingleton;
+}
+function getNoyaSingletonBindings() {
+  return noyaSingletonBindings;
+}
+function deleteNoyaSingleton() {
+  noyaManagerSingleton = void 0;
+  noyaSingletonBindings = void 0;
+}
+
 // src/NoyaStateContext.tsx
-var AnyNoyaStateContext = (0, import_react18.createContext)(void 0);
+function resourceToCreateParameters(resource) {
+  switch (resource.type) {
+    case "directory":
+      return {
+        path: resource.path,
+        type: "directory"
+      };
+    case "asset":
+      return {
+        path: resource.path,
+        type: "asset",
+        assetId: resource.assetId,
+        asset: resource.asset
+      };
+    case "file":
+      return {
+        path: resource.path,
+        type: "file",
+        fileId: resource.fileId
+      };
+    case "resource":
+      return {
+        path: resource.path,
+        type: "resource",
+        fileId: resource.fileId,
+        resourceId: resource.resourceId
+      };
+    default:
+      throw new Error(`Unknown resource type: ${resource.type}`);
+  }
+}
+function buildCreateResourcePayload({
+  addedResources,
+  modifiedResources,
+  newResourceMap,
+  resourceMap
+}) {
+  const toCreateParameters = resourceToCreateParameters;
+  const resourcesById = new Map(
+    Object.values(resourceMap).map((resource) => [resource.id, resource])
+  );
+  const payload = [
+    ...addedResources.map(toCreateParameters)
+  ];
+  const handledModifiedResourceIds = [];
+  const assetReplacements = modifiedResources.filter(
+    (resource) => resource.assetId !== void 0 || resource.asset !== void 0
+  ).map((resource) => {
+    const previousResource = resourcesById.get(resource.id);
+    const path2 = resource.path ?? previousResource?.path;
+    if (!path2) return void 0;
+    const updated = newResourceMap[path2];
+    if (!updated || updated.type !== "asset") return void 0;
+    handledModifiedResourceIds.push(resource.id);
+    return toCreateParameters(updated);
+  }).filter(
+    (resource) => resource !== void 0
+  );
+  const deduped = new Map(
+    [...payload, ...assetReplacements].map((item) => [item.path, item])
+  );
+  return {
+    payload: Array.from(deduped.values()),
+    consumedModifiedResourceIds: [...new Set(handledModifiedResourceIds)]
+  };
+}
+var AnyNoyaStateContext = (0, import_react19.createContext)(void 0);
 function useAnyNoyaStateContext() {
-  const value = (0, import_react18.useContext)(AnyNoyaStateContext);
+  const value = (0, import_react19.useContext)(AnyNoyaStateContext);
   if (!value) {
+    const bindings = getNoyaSingletonBindings();
+    if (bindings) {
+      return {
+        noyaManager: getNoyaManagerSingleton(),
+        theme: bindings.theme,
+        viewType: bindings.viewType
+      };
+    }
     throw new Error(
       "useNoyaStateContext must be used within a NoyaStateProvider"
     );
@@ -7000,9 +7262,9 @@ function useAssets() {
 }
 function useAsset(id) {
   const { noyaManager } = useAnyNoyaStateContext();
-  const observable = (0, import_react18.useMemo)(
+  const observable = (0, import_react19.useMemo)(
     () => noyaManager.assetManager.assets$.map(
-      (assets) => assets.find((a) => a.id === id)
+      (assets) => assets.find((a) => a.stableId === id) ?? assets.find((a) => a.id === id)
     ),
     [noyaManager, id]
   );
@@ -7011,7 +7273,7 @@ function useAsset(id) {
 function useAssetManager() {
   const { noyaManager } = useAnyNoyaStateContext();
   const isInitialized = useObservable(noyaManager.assetManager.isInitialized$);
-  return (0, import_react18.useMemo)(
+  return (0, import_react19.useMemo)(
     () => ({
       create: noyaManager.assetManager.create,
       delete: noyaManager.assetManager.delete,
@@ -7036,7 +7298,7 @@ function useSecret(name) {
   const { noyaManager } = useAnyNoyaStateContext();
   return useObservable(
     noyaManager.secretManager.secrets$,
-    (0, import_react18.useCallback)((secrets) => secrets.find((s) => s.name === name), [name])
+    (0, import_react19.useCallback)((secrets) => secrets.find((s) => s.name === name), [name])
   );
 }
 function useInputs() {
@@ -7054,7 +7316,7 @@ function useIOManager() {
 function usePublish(callback) {
   const { noyaManager } = useAnyNoyaStateContext();
   const stableCallback = (0, import_react_utils3.useStableCallback)(callback);
-  (0, import_react18.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     noyaManager.publishingManager.setPublishingEnabled(true);
     noyaManager.publishingManager.getFilesToPublish = stableCallback;
     return () => {
@@ -7065,7 +7327,7 @@ function usePublish(callback) {
 }
 function useIsInitialized() {
   const { noyaManager, viewType } = useAnyNoyaStateContext();
-  const isInitializedObservable = (0, import_react18.useMemo)(
+  const isInitializedObservable = (0, import_react19.useMemo)(
     () => import_observable.Observable.combine(
       [
         ...viewType === "preview" ? [] : [noyaManager.multiplayerStateManager.isInitialized$],
@@ -7082,9 +7344,9 @@ function usePipelineManager() {
   const { noyaManager } = useAnyNoyaStateContext();
   return noyaManager.pipelineManager;
 }
-var ConnectedUsersContext = (0, import_react18.createContext)(void 0);
 function useConnectedUsersManager() {
-  return (0, import_react18.useContext)(ConnectedUsersContext);
+  const { noyaManager } = useAnyNoyaStateContext();
+  return noyaManager.connectedUsersManager;
 }
 function useConnectedUsers() {
   const connectedUsersManager = useConnectedUsersManager();
@@ -7094,7 +7356,7 @@ function useConnectedUser(userId) {
   const connectedUsersManager = useConnectedUsersManager();
   return useObservable(
     connectedUsersManager?.connectedUsers$,
-    (0, import_react18.useCallback)(
+    (0, import_react19.useCallback)(
       (users) => {
         return users.find((user) => {
           const prefix = user.id.slice(0, 8);
@@ -7105,9 +7367,9 @@ function useConnectedUser(userId) {
     )
   );
 }
-var AnyEphemeralUserDataManagerContext = (0, import_react18.createContext)(void 0);
 function useAnyEphemeralUserData() {
-  return (0, import_react18.useContext)(AnyEphemeralUserDataManagerContext);
+  const { noyaManager } = useAnyNoyaStateContext();
+  return noyaManager.ephemeralUserDataManager;
 }
 function useCurrentUserId() {
   const connectedUsersManager = useConnectedUsersManager();
@@ -7117,6 +7379,19 @@ function useIsProcessing() {
   const { noyaManager } = useAnyNoyaStateContext();
   return useObservable(noyaManager.isProcessing$);
 }
+function useFileName() {
+  const { noyaManager } = useAnyNoyaStateContext();
+  return useObservable(noyaManager.filePropertyManager.optimisticValue$);
+}
+function useFilePropertyManager() {
+  const { noyaManager } = useAnyNoyaStateContext();
+  return noyaManager.filePropertyManager;
+}
+function useSetFileNameState() {
+  const fileName = useFileName();
+  const filePropertyManager = useFilePropertyManager();
+  return [fileName, filePropertyManager.updateName];
+}
 function useResourceManager() {
   const { noyaManager } = useAnyNoyaStateContext();
   return noyaManager.resourceManager;
@@ -7138,69 +7413,48 @@ function useResources({
   const assetManager = useAssetManager();
   const resourceMap = useObservable(
     resourceManager.optimisticResources$,
-    (0, import_react18.useCallback)((resources) => {
+    (0, import_react19.useCallback)((resources) => {
       return Object.fromEntries(
         resources.map((resource) => [resource.path, resource])
       );
     }, [])
   );
-  const setResourceMap = (0, import_react18.useCallback)(
+  const setResourceMap = (0, import_react19.useCallback)(
     async (action) => {
       const newResourceMap = action instanceof Function ? action(resourceMap) : action;
       const { addedResources, removedResources, modifiedResources } = diffResourceMaps(resourceMap, newResourceMap, "id");
-      if (addedResources.length > 0) {
-        const payload = addedResources.map((resource) => {
-          switch (resource.type) {
-            case "directory":
-              return {
-                path: resource.path,
-                type: "directory"
-              };
-            case "asset":
-              return {
-                path: resource.path,
-                type: "asset",
-                assetId: resource.assetId,
-                asset: resource.asset
-              };
-            case "file":
-              return {
-                path: resource.path,
-                type: "file",
-                fileId: resource.fileId
-              };
-            case "resource":
-              return {
-                path: resource.path,
-                type: "resource",
-                fileId: resource.fileId,
-                resourceId: resource.resourceId
-              };
-            default:
-              throw new Error(
-                `Unknown resource type: ${resource.type}`
-              );
-          }
-        });
-        await resourceManager.createResource(payload);
+      const { payload: createPayload, consumedModifiedResourceIds } = buildCreateResourcePayload({
+        addedResources,
+        modifiedResources,
+        newResourceMap,
+        resourceMap
+      });
+      if (createPayload.length > 0) {
+        await resourceManager.createResource(createPayload);
       }
-      for (const resource of removedResources) {
-        await resourceManager.deleteResource({ id: resource.id });
-        if (shouldDeleteAssets && resource.type === "asset") {
-          try {
+      const consumedModifiedResourceIdsSet = new Set(
+        consumedModifiedResourceIds
+      );
+      const remainingModifiedResources = modifiedResources.filter(
+        (resource) => !consumedModifiedResourceIdsSet.has(resource.id)
+      );
+      await resourceManager.deleteResource(
+        removedResources.map((resource) => ({ id: resource.id }))
+      );
+      if (shouldDeleteAssets) {
+        for (const resource of removedResources) {
+          if (resource.type === "asset") {
             await assetManager.delete(resource.assetId);
-          } catch (error) {
-            console.error("Failed to delete asset:", error);
           }
         }
       }
       await Promise.all(
-        modifiedResources.map(
+        remainingModifiedResources.map(
           ({ id, path: path2, assetId, asset }) => resourceManager.updateResource({
             id,
             path: path2,
             assetId,
-            asset
+            ...assetId ? {} : asset ? { asset } : {}
           })
         )
       );
@@ -7218,9 +7472,9 @@ function useActivityEvents(streamFilter) {
   );
 }
 function useActivityEventsForManager(streamFilter, activityEventsManager) {
-  const [streamId, setStreamId] = (0, import_react18.useState)(void 0);
+  const [streamId, setStreamId] = (0, import_react19.useState)(void 0);
   const stableStreamFilter = (0, import_react_utils3.useJsonMemo)(streamFilter);
-  (0, import_react18.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     if (!stableStreamFilter) return;
     const streamId2 = activityEventsManager.subscribe(stableStreamFilter);
     setStreamId(streamId2);
@@ -7247,42 +7501,26 @@ function createNoyaContext({
   safeEval
 }) {
   const NoyaStateContext = AnyNoyaStateContext;
-  const EphemeralUserDataManagerContext = AnyEphemeralUserDataManagerContext;
   function NoyaContextProvider({
     children,
     contextValue
   }) {
-    return /* @__PURE__ */ import_react18.default.createElement(AnyNoyaStateContext.Provider, { value: contextValue }, /* @__PURE__ */ import_react18.default.createElement(
-      ConnectedUsersContext.Provider,
-      {
-        value: contextValue.noyaManager.connectedUsersManager
-      },
-      /* @__PURE__ */ import_react18.default.createElement(
-        EphemeralUserDataManagerContext.Provider,
-        {
-          value: contextValue.noyaManager.ephemeralUserDataManager
-        },
-        children
-      )
-    ));
+    return /* @__PURE__ */ import_react19.default.createElement(AnyNoyaStateContext.Provider, { value: contextValue }, children);
   }
   function NoyaStateProvider({
     children,
     initialState,
     ...options
   }) {
-    const [, , { noyaManager, theme, viewType }] = useNoyaState(
-      initialState,
-      {
-        schema,
-        mergeHistoryEntries,
-        outputTransforms,
-        inputs,
-        safeEval,
-        ...options
-      }
-    );
-    const contextValue = (0, import_react18.useMemo)(
+    const [, , { noyaManager, theme, viewType }] = useNoyaStateInternal(initialState, {
+      schema,
+      mergeHistoryEntries,
+      outputTransforms,
+      inputs,
+      safeEval,
+      ...options
+    });
+    const contextValue = (0, import_react19.useMemo)(
       () => ({
         noyaManager,
         theme,
@@ -7290,12 +7528,12 @@ function createNoyaContext({
       }),
       [noyaManager, theme, viewType]
     );
-    return /* @__PURE__ */ import_react18.default.createElement(NoyaContextProvider, { contextValue }, options.fallback !== void 0 ? /* @__PURE__ */ import_react18.default.createElement(FallbackUntilInitialized, { fallback: options.fallback }, children) : children);
+    return /* @__PURE__ */ import_react19.default.createElement(NoyaContextProvider, { contextValue }, options.fallback !== void 0 ? /* @__PURE__ */ import_react19.default.createElement(FallbackUntilInitialized, { fallback: options.fallback }, children) : children);
   }
   function useValue(path2, options) {
     const { noyaManager } = useAnyNoyaStateContext();
     let actualPath = typeof path2 === "function" || !path2 ? "" : path2;
-    const mappedObservable = (0, import_react18.useMemo)(() => {
+    const mappedObservable = (0, import_react19.useMemo)(() => {
       if (typeof path2 === "function") {
         return noyaManager.multiplayerStateManager.optimisticState$.map(path2, {
           isEqual: options?.isEqual
@@ -7308,7 +7546,7 @@ function createNoyaContext({
   }
   function useSetValue(path2) {
     const { noyaManager } = useAnyNoyaStateContext();
-    const setValue = (0, import_react18.useCallback)(
+    const setValue = (0, import_react19.useCallback)(
       (...args) => {
         const [metadata, value] = args.length === 2 ? args : [{}, args[0]];
         noyaManager.multiplayerStateManager.setStateAtPath(
@@ -7332,13 +7570,8 @@ function createNoyaContext({
     return noyaManager.multiplayerStateManager;
   }
   function useEphemeralUserDataManager() {
-    const ephemeralUserData = (0, import_react18.useContext)(EphemeralUserDataManagerContext);
-    if (!ephemeralUserData) {
-      throw new Error(
-        "useEphemeralUserData must be used within a NoyaStateProvider"
-      );
-    }
-    return ephemeralUserData;
+    const { noyaManager } = useAnyNoyaStateContext();
+    return noyaManager.ephemeralUserDataManager;
   }
   function useNoyaManager() {
     return useAnyNoyaStateContext().noyaManager;
@@ -7349,7 +7582,7 @@ function createNoyaContext({
   }
   function useSetLeftMenuItems(leftMenuItems) {
     const { menuManager } = useNoyaManager();
-    (0, import_react18.useEffect)(() => {
+    (0, import_react19.useEffect)(() => {
       if (leftMenuItems) {
         menuManager.setLeftMenuItems(leftMenuItems);
       }
@@ -7361,7 +7594,7 @@ function createNoyaContext({
   }
   function useSetRightMenuItems(rightMenuItems) {
     const { menuManager } = useNoyaManager();
-    (0, import_react18.useEffect)(() => {
+    (0, import_react19.useEffect)(() => {
       if (rightMenuItems) {
         menuManager.setRightMenuItems(rightMenuItems);
       }
@@ -7369,19 +7602,19 @@ function createNoyaContext({
   }
   function useHandleMenuItem(callback) {
     const { menuManager } = useNoyaManager();
-    (0, import_react18.useEffect)(() => {
+    (0, import_react19.useEffect)(() => {
       return menuManager.addListener(callback);
     }, [menuManager, callback]);
   }
   function useOnSelectMenuItemCallback() {
     const { menuManager } = useNoyaManager();
-    return (0, import_react18.useCallback)((type) => menuManager.emit(type), [menuManager]);
+    return (0, import_react19.useCallback)((type) => menuManager.emit(type), [menuManager]);
   }
   function useMenu(options) {
     const { leftMenuItems, rightMenuItems, onSelectMenuItem } = options;
     useSetLeftMenuItems(leftMenuItems);
     useSetRightMenuItems(rightMenuItems);
-    const noop = (0, import_react18.useCallback)(() => {
+    const noop = (0, import_react19.useCallback)(() => {
     }, []);
     useHandleMenuItem(onSelectMenuItem ?? noop);
   }
@@ -7408,7 +7641,7 @@ function createNoyaContext({
 // src/ai.ts
 function useRegisterAITool(tool) {
   const aiManager = useAIManager();
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     return aiManager.registerTool(tool);
   }, [aiManager, tool]);
 }
@@ -7420,7 +7653,7 @@ function useCallableAITools() {
 // src/components/UserPointersOverlay.tsx
 var import_observable2 = require("@noya-app/observable");
 var import_react_utils4 = require("@noya-app/react-utils");
-var import_react20 = __toESM(require("react"));
+var import_react21 = __toESM(require("react"));
 function shouldShow(hideAfter, updatedAt) {
   return !!updatedAt && Date.now() - updatedAt < hideAfter;
 }
@@ -7430,7 +7663,7 @@ var UserPointerInternal = (0, import_react_utils4.memoGeneric)(function UserPoin
   hideAfter = 5e3,
   renderUserPointer
 }) {
-  const observable = (0, import_react20.useMemo)(() => {
+  const observable = (0, import_react21.useMemo)(() => {
     const metadata$ = ephemeralUserDataManager.metadata$.observePath([user.id]).throttle(50);
     const data$ = ephemeralUserDataManager.data$.observePath([user.id]).throttle(50);
     return import_observable2.Observable.combine([metadata$, data$], ([metadata2, data2]) => {
@@ -7438,10 +7671,10 @@ var UserPointerInternal = (0, import_react_utils4.memoGeneric)(function UserPoin
     });
   }, [ephemeralUserDataManager, user.id]);
   const { metadata, data } = useObservable(observable);
-  const [, setForceUpdate] = (0, import_react20.useState)(0);
+  const [, setForceUpdate] = (0, import_react21.useState)(0);
   const updatedAt = metadata?.updatedAt ?? 0;
   const show = shouldShow(hideAfter, updatedAt);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (!show) return;
     const timeoutId = setTimeout(() => {
       setForceUpdate((prev) => prev + 1);
@@ -7463,9 +7696,9 @@ var UserPointersOverlay = (0, import_react_utils4.memoGeneric)(function UserPoin
 }) {
   const currentUserId = useObservable(ephemeralUserDataManager.currentUserId$);
   const connectedUsers = useObservable(connectedUsersManager.connectedUsers$);
-  return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, connectedUsers.map((user) => {
+  return /* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, connectedUsers.map((user) => {
     if (user.id === currentUserId) return null;
-    return /* @__PURE__ */ import_react20.default.createElement(
+    return /* @__PURE__ */ import_react21.default.createElement(
       UserPointerInternal,
       {
         key: user.id,
@@ -7478,17 +7711,17 @@ var UserPointersOverlay = (0, import_react_utils4.memoGeneric)(function UserPoin
 });
 
 // src/WebSocketConnection.ts
-var import_state_manager4 = require("@noya-app/state-manager");
+var import_state_manager5 = require("@noya-app/state-manager");
 var WebSocketConnection = class {
   constructor(url, options = {}) {
     this.url = url;
     this.options = options;
-    this.ws = new import_state_manager4.ReconnectingWebSocket({
+    this.ws = new import_state_manager5.ReconnectingWebSocket({
       debug: options.debug,
       onopen: this.handleOpen,
       onmessage: this.handleMessage,
       onclose: this.handleClose,
-      activityDetector: new import_state_manager4.UserActivityDetector()
+      activityDetector: new import_state_manager5.UserActivityDetector()
     });
   }
   ws;
@@ -7556,24 +7789,30 @@ var WebSocketConnection = class {
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  AnyEphemeralUserDataManagerContext,
   AnyNoyaStateContext,
-  ConnectedUsersContext,
   FallbackUntilInitialized,
   StateInspector,
   UserPointersOverlay,
   WebSocketConnection,
+  buildCreateResourcePayload,
   createDefaultAppData,
   createNoyaContext,
+  createStateInspectorRoot,
   decodeAll,
+  deleteNoyaSingleton,
   encodeAll,
   enforceSchema,
   exportAll,
   fetchAssetMap,
   getAppData,
+  getNoyaManagerSingleton,
+  getNoyaSingletonBindings,
+  getSyncAdapter,
   importAll,
+  initializeNoyaSingleton,
   parseAppDataParameter,
   replaceDeep,
+  resourceToCreateParameters,
   resourceToMediaItem,
   useAIManager,
   useActivityEvents,
@@ -7584,12 +7823,15 @@ var WebSocketConnection = class {
   useAsset,
   useAssetManager,
   useAssets,
+  useBindNoyaManager,
   useCallableAITools,
   useColorScheme,
   useConnectedUser,
   useConnectedUsers,
   useConnectedUsersManager,
   useCurrentUserId,
+  useFileName,
+  useFilePropertyManager,
   useIOManager,
   useInputs,
   useIsInitialized,
@@ -7597,7 +7839,7 @@ var WebSocketConnection = class {
   useManagedHistory,
   useManagedState,
   useMultiplayerState,
-  useNoyaState,
+  useNoyaStateInternal,
   useObservable,
   useOutputTransforms,
   usePipelineManager,
@@ -7608,8 +7850,8 @@ var WebSocketConnection = class {
   useSecret,
   useSecretManager,
   useSecrets,
+  useSetFileNameState,
   useStateInspector,
-  useSyncStateManager,
   useViewType,
   ...require("@noya-app/state-manager")
 });