@sero-ai/app-runtime 0.1.3 → 0.2.1

package/LICENSE

@@ -0,0 +1,201 @@
+Apache License
+Version 2.0, January 2004
+https://www.apache.org/licenses/
+
+TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+1. Definitions.
+
+   "License" shall mean the terms and conditions for use, reproduction,
+   and distribution as defined by Sections 1 through 9 of this document.
+
+   "Licensor" shall mean the copyright owner or entity authorized by
+   the copyright owner that is granting the License.
+
+   "Legal Entity" shall mean the union of the acting entity and all
+   other entities that control, are controlled by, or are under common
+   control with that entity. For the purposes of this definition,
+   "control" means (i) the power, direct or indirect, to cause the
+   direction or management of such entity, whether by contract or
+   otherwise, or (ii) ownership of fifty percent (50%) or more of the
+   outstanding shares, or (iii) beneficial ownership of such entity.
+
+   "You" (or "Your") shall mean an individual or Legal Entity
+   exercising permissions granted by this License.
+
+   "Source" form shall mean the preferred form for making modifications,
+   including but not limited to software source code, documentation
+   source, and configuration files.
+
+   "Object" form shall mean any form resulting from mechanical
+   transformation or translation of a Source form, including but
+   not limited to compiled object code, generated documentation,
+   and conversions to other media types.
+
+   "Work" shall mean the work of authorship, whether in Source or
+   Object form, made available under the License, as indicated by a
+   copyright notice that is included in or attached to the work
+   (an example is provided in the Appendix below).
+
+   "Derivative Works" shall mean any work, whether in Source or Object
+   form, that is based on (or derived from) the Work and for which the
+   editorial revisions, annotations, elaborations, or other modifications
+   represent, as a whole, an original work of authorship. For the purposes
+   of this License, Derivative Works shall not include works that remain
+   separable from, or merely link (or bind by name) to the interfaces of,
+   the Work and Derivative Works thereof.
+
+   "Contribution" shall mean any work of authorship, including
+   the original version of the Work and any modifications or additions
+   to that Work or Derivative Works thereof, that is intentionally
+   submitted to Licensor for inclusion in the Work by the copyright owner
+   or by an individual or Legal Entity authorized to submit on behalf of
+   the copyright owner. For the purposes of this definition, "submitted"
+   means any form of electronic, verbal, or written communication sent
+   to the Licensor or its representatives, including but not limited to
+   communication on electronic mailing lists, source code control systems,
+   and issue tracking systems that are managed by, or on behalf of, the
+   Licensor for the purpose of discussing and improving the Work, but
+   excluding communication that is conspicuously marked or otherwise
+   designated in writing by the copyright owner as "Not a Contribution."
+
+   "Contributor" shall mean Licensor and any individual or Legal Entity
+   on behalf of whom a Contribution has been received by Licensor and
+   subsequently incorporated within the Work.
+
+2. Grant of Copyright License. Subject to the terms and conditions of
+   this License, each Contributor hereby grants to You a perpetual,
+   worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+   copyright license to reproduce, prepare Derivative Works of,
+   publicly display, publicly perform, sublicense, and distribute the
+   Work and such Derivative Works in Source or Object form.
+
+3. Grant of Patent License. Subject to the terms and conditions of
+   this License, each Contributor hereby grants to You a perpetual,
+   worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+   (except as stated in this section) patent license to make, have made,
+   use, offer to sell, sell, import, and otherwise transfer the Work,
+   where such license applies only to those patent claims licensable
+   by such Contributor that are necessarily infringed by their
+   Contribution(s) alone or by combination of their Contribution(s)
+   with the Work to which such Contribution(s) was submitted. If You
+   institute patent litigation against any entity (including a
+   cross-claim or counterclaim in a lawsuit) alleging that the Work
+   or a Contribution incorporated within the Work constitutes direct
+   or contributory patent infringement, then any patent licenses
+   granted to You under this License for that Work shall terminate
+   as of the date such litigation is filed.
+
+4. Redistribution. You may reproduce and distribute copies of the
+   Work or Derivative Works thereof in any medium, with or without
+   modifications, and in Source or Object form, provided that You
+   meet the following conditions:
+
+   (a) You must give any other recipients of the Work or
+       Derivative Works a copy of this License; and
+
+   (b) You must cause any modified files to carry prominent notices
+       stating that You changed the files; and
+
+   (c) You must retain, in the Source form of any Derivative Works
+       that You distribute, all copyright, patent, trademark, and
+       attribution notices from the Source form of the Work,
+       excluding those notices that do not pertain to any part of
+       the Derivative Works; and
+
+   (d) If the Work includes a "NOTICE" text file as part of its
+       distribution, then any Derivative Works that You distribute must
+       include a readable copy of the attribution notices contained
+       within such NOTICE file, excluding those notices that do not
+       pertain to any part of the Derivative Works, in at least one
+       of the following places: within a NOTICE text file distributed
+       as part of the Derivative Works; within the Source form or
+       documentation, if provided along with the Derivative Works; or,
+       within a display generated by the Derivative Works, if and
+       wherever such third-party notices normally appear. The contents
+       of the NOTICE file are for informational purposes only and
+       do not modify the License. You may add Your own attribution
+       notices within Derivative Works that You distribute, alongside
+       or as an addendum to the NOTICE text from the Work, provided
+       that such additional attribution notices cannot be construed
+       as modifying the License.
+
+   You may add Your own copyright statement to Your modifications and
+   may provide additional or different license terms and conditions
+   for use, reproduction, or distribution of Your modifications, or
+   for any such Derivative Works as a whole, provided Your use,
+   reproduction, and distribution of the Work otherwise complies with
+   the conditions stated in this License.
+
+5. Submission of Contributions. Unless You explicitly state otherwise,
+   any Contribution intentionally submitted for inclusion in the Work
+   by You to the Licensor shall be under the terms and conditions of
+   this License, without any additional terms or conditions.
+   Notwithstanding the above, nothing herein shall supersede or modify
+   the terms of any separate license agreement you may have executed
+   with Licensor regarding such Contributions.
+
+6. Trademarks. This License does not grant permission to use the trade
+   names, trademarks, service marks, or product names of the Licensor,
+   except as required for reasonable and customary use in describing the
+   origin of the Work and reproducing the content of the NOTICE file.
+
+7. Disclaimer of Warranty. Unless required by applicable law or
+   agreed to in writing, Licensor provides the Work (and each
+   Contributor provides its Contributions) on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+   implied, including, without limitation, any warranties or conditions
+   of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+   PARTICULAR PURPOSE. You are solely responsible for determining the
+   appropriateness of using or redistributing the Work and assume any
+   risks associated with Your exercise of permissions under this License.
+
+8. Limitation of Liability. In no event and under no legal theory,
+   whether in tort (including negligence), contract, or otherwise,
+   unless required by applicable law (such as deliberate and grossly
+   negligent acts) or agreed to in writing, shall any Contributor be
+   liable to You for damages, including any direct, indirect, special,
+   incidental, or consequential damages of any character arising as a
+   result of this License or out of the use or inability to use the
+   Work (including but not limited to damages for loss of goodwill,
+   work stoppage, computer failure or malfunction, or any and all
+   other commercial damages or losses), even if such Contributor
+   has been advised of the possibility of such damages.
+
+9. Accepting Warranty or Additional Liability. While redistributing
+   the Work or Derivative Works thereof, You may choose to offer,
+   and charge a fee for, acceptance of support, warranty, indemnity,
+   or other liability obligations and/or rights consistent with this
+   License. However, in accepting such obligations, You may act only
+   on Your own behalf and on Your sole responsibility, not on behalf
+   of any other Contributor, and only if You agree to indemnify,
+   defend, and hold each Contributor harmless for any liability
+   incurred by, or claims asserted against, such Contributor by reason
+   of your accepting any such warranty or additional liability.
+
+END OF TERMS AND CONDITIONS
+
+APPENDIX: How to apply the Apache License to your work.
+
+   To apply the Apache License to your work, attach the following
+   boilerplate notice, with the fields enclosed by brackets "[]"
+   replaced with your own identifying information. (Don't include
+   the brackets!) The text should be enclosed in the appropriate
+   comment syntax for the file format. We also recommend that a
+   file or class name and description of purpose be included on the
+   same "printed page" as the copyright notice for easier
+   identification within third-party archives.
+
+Copyright 2026 Dan Carter and contributors
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    https://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sero-ai/app-runtime",
-  "version": "0.1.3",
+  "version": "0.2.1",
   "description": "Hooks for Sero federated app modules — useAppState, useAppInfo, useAgentPrompt, useAppTools",
   "type": "module",
   "main": "./src/index.ts",
@@ -13,9 +13,6 @@
     "src",
     "README.md"
   ],
-  "scripts": {
-    "typecheck": "tsc --noEmit"
-  },
   "publishConfig": {
     "access": "public"
   },
@@ -24,8 +21,13 @@
     "react": "^19.2.4"
   },
   "devDependencies": {
-    "@sero-ai/common": "workspace:*",
     "@types/react": "^19.2.13",
-    "typescript": "^5.9.3"
+    "typescript": "^5.9.3",
+    "vitest": "^4.1.7",
+    "@sero-ai/common": "0.7.0"
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run"
   }
-}
+}

package/src/app-launch.ts

@@ -0,0 +1,94 @@
+/**
+ * Cross-app navigation — open another Sero app, optionally handing it launch
+ * params (e.g. the Scheduler app opening the Orchestrator on a specific loop).
+ *
+ * Only the active app is mounted, so the target app always mounts fresh and can
+ * consume its pending params in a state initializer. The registry is a
+ * globalThis singleton so all module-federation copies share it, matching the
+ * AppContext pattern.
+ */
+
+import { getSeroApi } from './sero-bridge';
+
+declare global {
+  var __sero_app_launch_params__: Map<string, Record<string, unknown>> | undefined;
+}
+
+function getRegistry(): Map<string, Record<string, unknown>> {
+  globalThis.__sero_app_launch_params__ ??= new Map();
+  return globalThis.__sero_app_launch_params__;
+}
+
+function launchEventName(appId: string): string {
+  return `sero:app-launch:${appId}`;
+}
+
+/**
+ * Switch the shell to another app. Optional `params` are held for the target
+ * app to pick up via `consumeAppLaunchParams` when it mounts. Resolves false
+ * when the app is unknown or the shell doesn't expose app control.
+ */
+export async function openSeroApp(appId: string, params?: Record<string, unknown>): Promise<boolean> {
+  if (params) getRegistry().set(appId, params);
+  const opened = (await getSeroApi().appControl?.open(appId)) ?? false;
+  if (!opened) getRegistry().delete(appId);
+  if (opened && params && typeof window !== 'undefined') {
+    window.dispatchEvent(new CustomEvent(launchEventName(appId), { detail: params }));
+  }
+  return opened;
+}
+
+/**
+ * Open a workspace file in the shell's explorer editor. Resolves false when the
+ * shell doesn't expose file opening. Used by search panels to make results
+ * clickable — `workspaceId` + `filePath` come straight from graph node tags.
+ * Opening a file does NOT close the search overlay; the panel decides that via
+ * `closeSeroSearch` so it can keep the overlay open for opening several files.
+ */
+export async function openSeroFile(workspaceId: string, filePath: string): Promise<boolean> {
+  return (await getSeroApi().appControl?.openFile(workspaceId, filePath)) ?? false;
+}
+
+/** Event the shell's global-search overlay listens for to dismiss itself. */
+export const SERO_GLOBAL_SEARCH_CLOSE_EVENT = 'sero:global-search:close';
+
+/**
+ * Ask the shell to close the global-search overlay a search panel is mounted in.
+ * Uses a window event (same renderer as the host, like `openSeroApp`'s launch
+ * events) so panels stay decoupled from the host's store. No-op outside a window.
+ */
+export function closeSeroSearch(): void {
+  if (typeof window === 'undefined') return;
+  window.dispatchEvent(new CustomEvent(SERO_GLOBAL_SEARCH_CLOSE_EVENT));
+}
+
+/**
+ * Take (and clear) the launch params another app handed to `openSeroApp`.
+ * Call from a mount-time state initializer; returns undefined when the app
+ * was opened without params.
+ */
+export function consumeAppLaunchParams<T extends Record<string, unknown>>(appId: string): T | undefined {
+  const registry = getRegistry();
+  const params = registry.get(appId);
+  registry.delete(appId);
+  return params as T | undefined;
+}
+
+/**
+ * Receives launch params when an already-mounted app is opened again. Apps still
+ * consume the registry on mount; this covers same-app deep links without forcing
+ * an unnecessary unmount/remount.
+ */
+export function onAppLaunchParams<T extends Record<string, unknown>>(
+  appId: string,
+  callback: (params: T) => void,
+): () => void {
+  if (typeof window === 'undefined') return () => {};
+  const listener = (event: Event) => {
+    getRegistry().delete(appId);
+    callback((event as CustomEvent<T>).detail);
+  };
+  const eventName = launchEventName(appId);
+  window.addEventListener(eventName, listener);
+  return () => window.removeEventListener(eventName, listener);
+}

package/src/context.ts

@@ -27,6 +27,11 @@ export interface AppContextValue {
   themeMode?: 'light' | 'dark';
   /** Active theme preset ID. */
   themePresetId?: string;
+  /**
+   * Active editor/diff theme ID (`'auto'` follows `themeMode`). Plugins that
+   * render code or diffs use it so their syntax colours match the host editor.
+   */
+  editorThemeId?: string;
 }
 
 declare global {

package/src/index.ts

@@ -12,8 +12,18 @@ export { useAgentPrompt } from './use-agent-prompt';
 export { useAI, type AppAI } from './use-ai';
 export { useAppTools, type AppTools } from './use-app-tools';
 export { useAvailableModels, type UseAvailableModelsResult } from './use-available-models';
+export { useSubagentContext, type UseSubagentContextResult } from './use-subagent-context';
+export { useContextPresets, type UseContextPresetsResult } from './use-context-presets';
 export { useTheme, type UseThemeResult } from './use-theme';
 export { getSeroApi } from './sero-bridge';
+export {
+  openSeroApp,
+  openSeroFile,
+  closeSeroSearch,
+  SERO_GLOBAL_SEARCH_CLOSE_EVENT,
+  consumeAppLaunchParams,
+  onAppLaunchParams,
+} from './app-launch';
 export type { AppModelInfo, AppModelGroup } from './sero-bridge';
 export type { AppToolContentBlock, AppToolImageContent, AppToolResult, AppToolTextContent } from '@sero-ai/common';
 export { registerWidget, getRuntimeWidgets, onWidgetRegistryChange } from './widget-registry';

package/src/sero-bridge.ts

@@ -9,6 +9,8 @@
 
 import type {
   AppToolResult,
+  AvailableContext,
+  ContextPreset,
   GitActionResult,
   GitManagerRequest,
   SharedAvailableModelGroup,
@@ -41,6 +43,13 @@ export interface SeroAppAgentBridge {
   ): Promise<AppToolResult>;
 }
 
+export interface SeroAppControlBridge {
+  /** Switch the shell to the app with this id. False when the app is unknown. */
+  open(appId: string): Promise<boolean>;
+  /** Open a workspace file in the explorer editor. False when unavailable. */
+  openFile(workspaceId: string, filePath: string): Promise<boolean>;
+}
+
 export interface SeroGitAppBridge {
   run(workspaceId: string, params: GitManagerRequest): Promise<GitActionResult>;
 }
@@ -71,13 +80,28 @@ export interface SeroModelsBridge {
   list(): Promise<AppModelGroup[]>;
 }
 
+export interface SeroSubagentContextBridge {
+  /** Available context (tools + skills) for a workspace's background subagents, no session. */
+  get(workspaceId: string): Promise<AvailableContext>;
+}
+
+export interface SeroContextPresetsBridge {
+  /** Load profile-level context presets. */
+  load(): Promise<ContextPreset[]>;
+  /** Persist the full preset list. */
+  save(presets: ContextPreset[]): Promise<void>;
+}
+
 export interface SeroBridge {
   appState: SeroWindowAppStateBridge;
   appAgent: SeroAppAgentBridge;
+  appControl?: SeroAppControlBridge;
   gitApp?: SeroGitAppBridge;
   webApp?: SeroWebAppBridge;
   editor?: SeroEditorBridge;
   models?: SeroModelsBridge;
+  subagentContext?: SeroSubagentContextBridge;
+  contextPresets?: SeroContextPresetsBridge;
 }
 
 function readWindowSero(value: Window): unknown {

package/src/use-agent-prompt.ts

@@ -7,7 +7,7 @@
  * session IDs or storage details.
  */
 
-import { useContext, useCallback } from 'react';
+import { use, useCallback } from 'react';
 import { AppContext } from './context';
 
 /**
@@ -18,7 +18,7 @@ import { AppContext } from './context';
  *   prompt("Add a todo: buy milk");
  */
 export function useAgentPrompt(): (text: string) => void {
-  const ctx = useContext(AppContext);
+  const ctx = use(AppContext);
 
   return useCallback(
     (text: string) => {

package/src/use-ai.ts

@@ -11,7 +11,7 @@
  *   const response = await ai.prompt("Generate an inspirational quote.");
  */
 
-import { useContext, useCallback, useMemo } from 'react';
+import { use, useCallback, useMemo } from 'react';
 import { AppContext } from './context';
 import { getSeroApi } from './sero-bridge';
 
@@ -23,7 +23,7 @@ export interface AppAI {
 }
 
 export function useAI(): AppAI {
-  const ctx = useContext(AppContext);
+  const ctx = use(AppContext);
 
   const prompt = useCallback(
     async (text: string): Promise<string> => {

package/src/use-app-info.ts

@@ -2,7 +2,7 @@
  * useAppInfo — read-only context about the current app and workspace.
  */
 
-import { useContext } from 'react';
+import { use } from 'react';
 import { AppContext } from './context';
 
 export interface AppInfo {
@@ -12,7 +12,7 @@ export interface AppInfo {
 }
 
 export function useAppInfo(): AppInfo {
-  const ctx = useContext(AppContext);
+  const ctx = use(AppContext);
   if (!ctx) {
     throw new Error('useAppInfo must be used inside an <AppProvider>');
   }

package/src/use-app-state.test.ts

@@ -0,0 +1,56 @@
+import { describe, expect, it } from 'vitest';
+
+import { applyDefaultState } from './use-app-state';
+
+interface DemoState {
+  name: string;
+  count: number;
+  tags: string[];
+  nested: { open: boolean };
+  optional?: { from: string };
+}
+
+const DEFAULT_STATE: DemoState = {
+  name: '',
+  count: 0,
+  tags: [],
+  nested: { open: false },
+};
+
+describe('applyDefaultState', () => {
+  it('takes the file’s values over the defaults', () => {
+    expect(applyDefaultState(DEFAULT_STATE, {
+      name: 'repo',
+      count: 3,
+      tags: ['a'],
+      nested: { open: true },
+    })).toEqual({ name: 'repo', count: 3, tags: ['a'], nested: { open: true } });
+  });
+
+  it('keeps the default where the file disagrees about the type', () => {
+    const merged = applyDefaultState(DEFAULT_STATE, { name: 42, tags: 'nope' });
+    expect(merged.name).toBe('');
+    expect(merged.tags).toEqual([]);
+  });
+
+  it('fills in what the file leaves out', () => {
+    expect(applyDefaultState(DEFAULT_STATE, { name: 'repo' }).count).toBe(0);
+  });
+
+  // An `undefined` default says the field is optional, not that it must be
+  // absent. Enforcing it dropped the file's value on every read, which is how
+  // a whole feature's state could be written correctly and never arrive.
+  it('passes optional fields through when the default is undefined', () => {
+    const withOptional: DemoState = { ...DEFAULT_STATE, optional: undefined };
+
+    expect(applyDefaultState(withOptional, {
+      name: 'repo',
+      optional: { from: 'the file' },
+    }).optional).toEqual({ from: 'the file' });
+  });
+
+  it('leaves an absent optional field absent', () => {
+    const withOptional: DemoState = { ...DEFAULT_STATE, optional: undefined };
+    expect(applyDefaultState(withOptional, { name: 'repo' }).optional).toBeUndefined();
+  });
+});

package/src/use-app-state.ts

@@ -6,7 +6,7 @@
  * 3. Writes via IPC (atomic file write → watcher fires → all consumers update)
  */
 
-import { useState, useEffect, useCallback, useContext, useRef } from 'react';
+import { useState, useEffect, useCallback, use, useRef } from 'react';
 import { AppContext } from './context';
 import { getSeroApi, type SeroWindowAppStateBridge } from './sero-bridge';
 
@@ -20,7 +20,19 @@ function isPlainObject(value: unknown): value is Record<string, unknown> {
   return typeof value === 'object' && value !== null && !Array.isArray(value);
 }
 
+/**
+ * The state file is merged over the app's default state key by key, and the
+ * default wins wherever the two disagree in type — a malformed file cannot
+ * hand an app a number where it expects a string.
+ *
+ * An `undefined` default is the exception: it says the field is optional, not
+ * that it must be absent. Enforcing it would drop the file's value on every
+ * read, which is exactly what used to happen to any optional field an app
+ * declared as `undefined` in its default state.
+ */
 function normalizeStateValue(defaultValue: unknown, currentValue: unknown): unknown {
+  if (defaultValue === undefined) return currentValue;
+
   if (Array.isArray(defaultValue)) {
     return Array.isArray(currentValue) ? currentValue : defaultValue;
   }
@@ -39,12 +51,16 @@ function normalizeStateValue(defaultValue: unknown, currentValue: unknown): unkn
   return typeof currentValue === typeof defaultValue ? currentValue : defaultValue;
 }
 
-function applyDefaultState<T>(defaultState: T, current: unknown): T {
+/**
+ * Merge a state file's contents over an app's default state. Exported for its
+ * tests, not from the package entry point — it is not public API.
+ */
+export function applyDefaultState<T>(defaultState: T, current: unknown): T {
   return normalizeStateValue(defaultState, current) as T;
 }
 
 export function useAppState<T>(defaultState: T): [T, (updater: (prev: T) => T) => void] {
-  const ctx = useContext(AppContext);
+  const ctx = use(AppContext);
   if (!ctx) {
     throw new Error('useAppState must be used inside an <AppProvider>');
   }

package/src/use-app-tools.ts

@@ -1,5 +1,5 @@
 import type { AppToolResult } from '@sero-ai/common';
-import { useCallback, useContext, useMemo } from 'react';
+import { useCallback, use, useMemo } from 'react';
 
 import { AppContext } from './context';
 import { getSeroApi } from './sero-bridge';
@@ -9,7 +9,7 @@ export interface AppTools {
 }
 
 export function useAppTools(): AppTools {
-  const ctx = useContext(AppContext);
+  const ctx = use(AppContext);
 
   const run = useCallback<AppTools['run']>(
     async (toolName, params): Promise<AppToolResult> => {

package/src/use-context-presets.ts

@@ -0,0 +1,52 @@
+/**
+ * useContextPresets — loads and persists profile-level context-editor presets,
+ * the same store the chat session editor uses. Lets app modules reuse a user's
+ * saved contexts.
+ *
+ * Returns { presets, save, loading, error }.
+ */
+
+import { useState, useEffect, useCallback } from 'react';
+import type { ContextPreset } from '@sero-ai/common';
+import { getSeroApi } from './sero-bridge';
+
+export interface UseContextPresetsResult {
+  presets: ContextPreset[];
+  /** Persist a new full preset list and update local state. */
+  save: (next: ContextPreset[]) => Promise<void>;
+  loading: boolean;
+  error: string | null;
+}
+
+export function useContextPresets(): UseContextPresetsResult {
+  const [presets, setPresets] = useState<ContextPreset[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    const api = getSeroApi();
+    if (!api.contextPresets) {
+      setError('Context presets not available in this Sero version');
+      setLoading(false);
+      return;
+    }
+    api.contextPresets
+      .load()
+      .then(setPresets)
+      .catch((err: unknown) => setError(err instanceof Error ? err.message : 'Failed to load presets'))
+      .finally(() => setLoading(false));
+  }, []);
+
+  const save = useCallback(async (next: ContextPreset[]) => {
+    setPresets(next);
+    const api = getSeroApi();
+    if (!api.contextPresets) return;
+    try {
+      await api.contextPresets.save(next);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to save presets');
+    }
+  }, []);
+
+  return { presets, save, loading, error };
+}

package/src/use-subagent-context.ts

@@ -0,0 +1,59 @@
+/**
+ * useSubagentContext — fetches the available context (tools + skills) for a
+ * workspace's background subagents, without an agent session. Lets app modules
+ * (e.g. the Orchestrator loop context override) offer tool/skill toggles.
+ *
+ * Returns { context, loading, error, refresh }.
+ */
+
+import { useState, useEffect, useCallback } from 'react';
+import type { AvailableContext } from '@sero-ai/common';
+import { getSeroApi } from './sero-bridge';
+
+export interface UseSubagentContextResult {
+  context: AvailableContext | null;
+  loading: boolean;
+  error: string | null;
+  refresh: () => void;
+}
+
+export function useSubagentContext(workspaceId: string | null): UseSubagentContextResult {
+  const [context, setContext] = useState<AvailableContext | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const fetch = useCallback(() => {
+    if (!workspaceId) {
+      setContext(null);
+      return;
+    }
+    setLoading(true);
+    setError(null);
+
+    const api = getSeroApi();
+    if (!api.subagentContext) {
+      setError('Subagent context not available in this Sero version');
+      setLoading(false);
+      return;
+    }
+
+    api.subagentContext
+      .get(workspaceId)
+      .then((result) => {
+        setContext(result);
+        setError(null);
+      })
+      .catch((err: unknown) => {
+        setError(err instanceof Error ? err.message : 'Failed to fetch context');
+      })
+      .finally(() => {
+        setLoading(false);
+      });
+  }, [workspaceId]);
+
+  useEffect(() => {
+    fetch();
+  }, [fetch]);
+
+  return { context, loading, error, refresh: fetch };
+}

package/src/use-theme.ts

@@ -6,7 +6,7 @@
  * canvas rendering, charts, or conditional logic).
  */
 
-import { useContext } from 'react';
+import { use } from 'react';
 import { AppContext } from './context';
 
 export interface UseThemeResult {
@@ -14,12 +14,15 @@ export interface UseThemeResult {
   mode: 'light' | 'dark';
   /** Active theme preset ID. */
   presetId: string;
+  /** Active editor/diff theme ID; `'auto'` follows `mode`. */
+  editorThemeId: string;
 }
 
 export function useTheme(): UseThemeResult {
-  const ctx = useContext(AppContext);
+  const ctx = use(AppContext);
   return {
     mode: ctx?.themeMode ?? 'dark',
     presetId: ctx?.themePresetId ?? 'default',
+    editorThemeId: ctx?.editorThemeId ?? 'auto',
   };
 }

package/src/use-widget-registration.ts

@@ -21,7 +21,7 @@
  * ```
  */
 
-import { useContext, useEffect } from 'react';
+import { use, useEffect } from 'react';
 import type { ComponentType } from 'react';
 import { AppContext } from './context';
 import { registerWidget } from './widget-registry';
@@ -50,8 +50,14 @@ interface WidgetRegistrationOptions {
  * dashboard widget can keep rendering after the full app view unmounts.
  */
 export function useWidgetRegistration(options: WidgetRegistrationOptions): void {
-  const ctx = useContext(AppContext);
+  const ctx = use(AppContext);
   const appId = ctx?.appId;
+  const { component, defaultSize, description, maxSize, minSize, name, widgetId } = options;
+  const { h: defaultHeight, w: defaultWidth } = defaultSize;
+  const minHeight = minSize?.h;
+  const minWidth = minSize?.w;
+  const maxHeight = maxSize?.h;
+  const maxWidth = maxSize?.w;
 
   // Acceptable useEffect — registration into a shared external registry
   useEffect(() => {
@@ -59,25 +65,25 @@ export function useWidgetRegistration(options: WidgetRegistrationOptions): void
 
     registerWidget({
       appId,
-      widgetId: options.widgetId,
-      name: options.name,
-      component: options.component,
-      defaultSize: options.defaultSize,
-      minSize: options.minSize,
-      maxSize: options.maxSize,
-      description: options.description,
+      widgetId,
+      name,
+      component,
+      defaultSize: { w: defaultWidth, h: defaultHeight },
+      minSize: minWidth === undefined || minHeight === undefined ? undefined : { w: minWidth, h: minHeight },
+      maxSize: maxWidth === undefined || maxHeight === undefined ? undefined : { w: maxWidth, h: maxHeight },
+      description,
     });
   }, [
     appId,
-    options.widgetId,
-    options.name,
-    options.component,
-    options.defaultSize.w,
-    options.defaultSize.h,
-    options.minSize?.w,
-    options.minSize?.h,
-    options.maxSize?.w,
-    options.maxSize?.h,
-    options.description,
+    widgetId,
+    name,
+    component,
+    defaultHeight,
+    defaultWidth,
+    minHeight,
+    minWidth,
+    maxHeight,
+    maxWidth,
+    description,
   ]);
 }