@dxos/plugin-deck 0.8.4-main.1068cf700f → 0.8.4-main.1c7ec43d41

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-deck",
-  "version": "0.8.4-main.1068cf700f",
+  "version": "0.8.4-main.1c7ec43d41",
   "description": "DXOS Surface plugin for the main application layout.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -12,26 +12,47 @@
   "author": "DXOS.org",
   "sideEffects": true,
   "type": "module",
+  "imports": {
+    "#plugin": {
+      "browser": "./src/DeckPlugin.ts",
+      "node": "./src/DeckPlugin.node.ts",
+      "default": "./src/DeckPlugin.ts"
+    },
+    "#capabilities": "./src/capabilities/index.ts",
+    "#components": "./src/components/index.ts",
+    "#containers": "./src/containers/index.ts",
+    "#hooks": "./src/hooks/index.ts",
+    "#meta": "./src/meta.ts",
+    "#operations": "./src/operations/index.ts",
+    "#translations": "./src/translations.ts",
+    "#types": "./src/types/index.ts"
+  },
   "exports": {
     ".": {
       "source": "./src/index.ts",
       "types": "./dist/types/src/index.d.ts",
       "browser": "./dist/lib/browser/index.mjs"
     },
+    "./operations": {
+      "source": "./src/operations/index.ts",
+      "types": "./dist/types/src/operations/index.d.ts",
+      "browser": "./dist/lib/browser/operations/index.mjs",
+      "node": "./dist/lib/node-esm/operations/index.mjs"
+    },
+    "./translations": {
+      "source": "./src/translations.ts",
+      "types": "./dist/types/src/translations.d.ts",
+      "browser": "./dist/lib/browser/translations.mjs",
+      "node": "./dist/lib/node-esm/translations.mjs"
+    },
     "./types": {
       "source": "./src/types/index.ts",
       "types": "./dist/types/src/types/index.d.ts",
-      "browser": "./dist/lib/browser/types/index.mjs"
+      "browser": "./dist/lib/browser/types/index.mjs",
+      "node": "./dist/lib/node-esm/types/index.mjs"
     }
   },
   "types": "dist/types/src/index.d.ts",
-  "typesVersions": {
-    "*": {
-      "types": [
-        "dist/types/src/types/index.d.ts"
-      ]
-    }
-  },
   "files": [
     "dist",
     "src"
@@ -43,56 +64,67 @@
     "@effect/experimental": "0.58.0",
     "@fluentui/react-tabster": "9.26.11",
     "@radix-ui/react-context": "1.1.1",
+    "@tauri-apps/plugin-deep-link": "^2.2.0",
     "immer": "^10.1.1",
-    "@dxos/ai": "0.8.4-main.1068cf700f",
-    "@dxos/app-framework": "0.8.4-main.1068cf700f",
-    "@dxos/app-toolkit": "0.8.4-main.1068cf700f",
-    "@dxos/assistant": "0.8.4-main.1068cf700f",
-    "@dxos/blueprints": "0.8.4-main.1068cf700f",
-    "@dxos/debug": "0.8.4-main.1068cf700f",
-    "@dxos/async": "0.8.4-main.1068cf700f",
-    "@dxos/echo": "0.8.4-main.1068cf700f",
-    "@dxos/invariant": "0.8.4-main.1068cf700f",
-    "@dxos/log": "0.8.4-main.1068cf700f",
-    "@dxos/effect": "0.8.4-main.1068cf700f",
-    "@dxos/operation": "0.8.4-main.1068cf700f",
-    "@dxos/keyboard": "0.8.4-main.1068cf700f",
-    "@dxos/plugin-observability": "0.8.4-main.1068cf700f",
-    "@dxos/plugin-attention": "0.8.4-main.1068cf700f",
-    "@dxos/plugin-graph": "0.8.4-main.1068cf700f",
-    "@dxos/plugin-theme": "0.8.4-main.1068cf700f",
-    "@dxos/react-client": "0.8.4-main.1068cf700f",
-    "@dxos/react-ui-attention": "0.8.4-main.1068cf700f",
-    "@dxos/react-ui-mosaic": "0.8.4-main.1068cf700f",
-    "@dxos/react-ui-form": "0.8.4-main.1068cf700f",
-    "@dxos/react-ui-stack": "0.8.4-main.1068cf700f",
-    "@dxos/react-ui-tabs": "0.8.4-main.1068cf700f",
-    "@dxos/react-ui-text-tooltip": "0.8.4-main.1068cf700f",
-    "@dxos/util": "0.8.4-main.1068cf700f",
-    "@dxos/ui-types": "0.8.4-main.1068cf700f"
+    "@dxos/ai": "0.8.4-main.1c7ec43d41",
+    "@dxos/app-graph": "0.8.4-main.1c7ec43d41",
+    "@dxos/app-framework": "0.8.4-main.1c7ec43d41",
+    "@dxos/app-toolkit": "0.8.4-main.1c7ec43d41",
+    "@dxos/assistant": "0.8.4-main.1c7ec43d41",
+    "@dxos/async": "0.8.4-main.1c7ec43d41",
+    "@dxos/context": "0.8.4-main.1c7ec43d41",
+    "@dxos/compute": "0.8.4-main.1c7ec43d41",
+    "@dxos/debug": "0.8.4-main.1c7ec43d41",
+    "@dxos/echo": "0.8.4-main.1c7ec43d41",
+    "@dxos/effect": "0.8.4-main.1c7ec43d41",
+    "@dxos/keyboard": "0.8.4-main.1c7ec43d41",
+    "@dxos/invariant": "0.8.4-main.1c7ec43d41",
+    "@dxos/log": "0.8.4-main.1c7ec43d41",
+    "@dxos/errors": "0.8.4-main.1c7ec43d41",
+    "@dxos/plugin-client": "0.8.4-main.1c7ec43d41",
+    "@dxos/plugin-attention": "0.8.4-main.1c7ec43d41",
+    "@dxos/plugin-graph": "0.8.4-main.1c7ec43d41",
+    "@dxos/plugin-observability": "0.8.4-main.1c7ec43d41",
+    "@dxos/plugin-theme": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-client": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-attention": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-error-boundary": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-mosaic": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-tabs": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-menu": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-stack": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-form": "0.8.4-main.1c7ec43d41",
+    "@dxos/ui-types": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-text-tooltip": "0.8.4-main.1c7ec43d41",
+    "@dxos/util": "0.8.4-main.1c7ec43d41"
   },
   "devDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
     "@effect/platform": "0.94.4",
     "@types/react": "~19.2.7",
     "@types/react-dom": "~19.2.3",
-    "effect": "3.19.16",
+    "effect": "3.20.0",
     "react": "~19.2.3",
     "react-dom": "~19.2.3",
-    "vite": "7.1.9",
-    "@dxos/react-ui": "0.8.4-main.1068cf700f",
-    "@dxos/plugin-testing": "0.8.4-main.1068cf700f",
-    "@dxos/storybook-utils": "0.8.4-main.1068cf700f",
-    "@dxos/ui-theme": "0.8.4-main.1068cf700f"
+    "vite": "^8.0.10",
+    "@dxos/plugin-testing": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui": "0.8.4-main.1c7ec43d41",
+    "@dxos/random": "0.8.4-main.1c7ec43d41",
+    "@dxos/schema": "0.8.4-main.1c7ec43d41",
+    "@dxos/storybook-utils": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-ui-syntax-highlighter": "0.8.4-main.1c7ec43d41",
+    "@dxos/types": "0.8.4-main.1c7ec43d41",
+    "@dxos/react-hooks": "0.8.4-main.1c7ec43d41",
+    "@dxos/ui-theme": "0.8.4-main.1c7ec43d41"
   },
   "peerDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
     "@effect/platform": "0.94.4",
-    "effect": "3.19.16",
+    "effect": "3.20.0",
     "react": "~19.2.3",
     "react-dom": "~19.2.3",
-    "@dxos/react-ui": "0.8.4-main.1068cf700f",
-    "@dxos/ui-theme": "0.8.4-main.1068cf700f"
+    "@dxos/react-ui": "0.8.4-main.1c7ec43d41",
+    "@dxos/ui-theme": "0.8.4-main.1c7ec43d41"
   },
   "publishConfig": {
     "access": "public"

package/src/DeckPlugin.node.ts

@@ -0,0 +1,17 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { Plugin } from '@dxos/app-framework';
+import { AppPlugin } from '@dxos/app-toolkit';
+
+import { AppGraphBuilder, OperationHandler } from '#capabilities';
+import { meta } from '#meta';
+
+export const DeckPlugin = Plugin.define(meta).pipe(
+  AppPlugin.addAppGraphModule({ activate: AppGraphBuilder }),
+  AppPlugin.addOperationHandlerModule({ activate: OperationHandler }),
+  Plugin.make,
+);
+
+export default DeckPlugin;

package/src/DeckPlugin.test.ts

@@ -0,0 +1,27 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import { describe, test } from 'vitest';
+
+import { ActivationEvents } from '@dxos/app-framework';
+import { createComposerTestApp } from '@dxos/plugin-testing/harness';
+
+import { DeckPlugin } from '#plugin';
+
+import { meta } from './meta';
+
+const moduleId = (name: string) => `${meta.id}.module.${name}`;
+
+describe('DeckPlugin', () => {
+  test('modules activate on the expected events', async ({ expect }) => {
+    await using harness = await createComposerTestApp({
+      plugins: [DeckPlugin()],
+    });
+
+    expect(harness.manager.getActive()).toContain(moduleId('AppGraphBuilder'));
+
+    await harness.fire(ActivationEvents.SetupOperationHandler);
+    expect(harness.manager.getActive()).toContain(moduleId('OperationHandler'));
+  });
+});

package/src/DeckPlugin.ts

@@ -6,22 +6,21 @@ import { setAutoFreeze } from 'immer';
 
 import { ActivationEvent, ActivationEvents, Plugin } from '@dxos/app-framework';
 import { AppActivationEvents, AppPlugin } from '@dxos/app-toolkit';
-import { translations as stackTranslations } from '@dxos/react-ui-stack';
+import { translations as stackTranslations } from '@dxos/react-ui-stack/translations';
 
 import {
   AppGraphBuilder,
   CheckAppScheme,
   DeckSettings,
   DeckState,
-  LayoutOperationResolver,
+  OperationHandler,
   ReactRoot,
   ReactSurface,
-  Toolkit,
   UrlHandler,
-} from './capabilities';
-import { meta } from './meta';
-import { translations } from './translations';
-import { DeckEvents } from './types';
+} from '#capabilities';
+import { meta } from '#meta';
+import { translations } from '#translations';
+import { DeckEvents } from '#types';
 
 // NOTE(Zan): When producing values with immer, we shouldn't auto-freeze them because
 //   our signal implementation needs to add some hidden properties to the produced values.
@@ -30,16 +29,16 @@ setAutoFreeze(false);
 
 export const DeckPlugin = Plugin.define(meta).pipe(
   AppPlugin.addAppGraphModule({ activate: AppGraphBuilder }),
-  AppPlugin.addOperationResolverModule({ activate: LayoutOperationResolver }),
+  AppPlugin.addOperationHandlerModule({ activate: OperationHandler }),
   AppPlugin.addSurfaceModule({ activate: ReactSurface }),
   AppPlugin.addTranslationsModule({ translations: [...translations, ...stackTranslations] }),
   Plugin.addModule({
     activatesOn: AppActivationEvents.SetupSettings,
-    activatesAfter: [DeckEvents.SettingsReady],
+    firesAfterActivation: [DeckEvents.SettingsReady],
     activate: DeckSettings,
   }),
   Plugin.addModule({
-    activatesOn: DeckEvents.SettingsReady,
+    activatesOn: ActivationEvent.allOf(DeckEvents.SettingsReady, ActivationEvents.OperationInvokerReady),
     activate: CheckAppScheme,
   }),
   Plugin.addModule({
@@ -47,7 +46,7 @@ export const DeckPlugin = Plugin.define(meta).pipe(
     //   Should this be a different event?
     //   Should settings store be renamed to be more generic?
     activatesOn: ActivationEvent.oneOf(AppActivationEvents.SetupSettings, AppActivationEvents.SetupAppGraph),
-    activatesAfter: [AppActivationEvents.LayoutReady, DeckEvents.StateReady],
+    firesAfterActivation: [AppActivationEvents.LayoutReady, DeckEvents.StateReady],
     activate: DeckState,
   }),
   Plugin.addModule({
@@ -58,14 +57,11 @@ export const DeckPlugin = Plugin.define(meta).pipe(
   //   activatesOn: Events.SetupArtifactDefinition,
   //   activate: Tools,
   // }),
-  Plugin.addModule({
-    // TODO(wittjosiah): Shouldn't use the startup event.
-    activatesOn: ActivationEvents.Startup,
-    activate: Toolkit,
-  }),
   Plugin.addModule({
     activatesOn: ActivationEvent.allOf(ActivationEvents.OperationInvokerReady, DeckEvents.StateReady),
     activate: UrlHandler,
   }),
   Plugin.make,
 );
+
+export default DeckPlugin;

package/src/capabilities/app-graph-builder.ts

@@ -0,0 +1,127 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+
+import { Capabilities, Capability } from '@dxos/app-framework';
+import { AppCapabilities, AppNode, LayoutOperation } from '@dxos/app-toolkit';
+import { Operation } from '@dxos/compute';
+import { AttentionCapabilities } from '@dxos/plugin-attention/types';
+import { GraphBuilder, NodeMatcher } from '@dxos/plugin-graph';
+
+import { meta } from '#meta';
+import { DeckCapabilities } from '#types';
+
+export default Capability.makeModule(
+  Effect.fnUntraced(function* () {
+    const extensions = yield* Effect.all([
+      GraphBuilder.createExtension({
+        id: 'not-found',
+        match: NodeMatcher.whenRoot,
+        connector: () => Effect.succeed([AppNode.makeNotFound()]),
+      }),
+
+      GraphBuilder.createExtension({
+        id: 'root',
+        match: NodeMatcher.whenRoot,
+        actions: (_node, get) =>
+          Effect.gen(function* () {
+            // NOTE(Zan): This is currently disabled.
+            // TODO(Zan): Fullscreen needs to know the active node and provide that to the layout part.
+            // const _fullscreen = {
+            //   id: `${LayoutAction.UpdateLayout._tag}/fullscreen`,
+            //   data: async () => {
+            //     const { dispatchPromise: dispatch } = context.get(Capabilities.IntentDispatcher);
+            //     await dispatch(
+            //       createIntent(LayoutAction.SetLayoutMode, { part: 'mode', options: { mode: 'fullscreen' } }),
+            //     );
+            //   },
+            //   properties: {
+            //     label: ['toggle-fullscreen.label', { ns: meta.id }],
+            //     icon: 'ph--arrows-out--regular',
+            //     keyBinding: {
+            //       macos: 'ctrl+meta+f',
+            //       windows: 'shift+ctrl+f',
+            //     },
+            //   },
+            // };
+
+            const closeCurrent = {
+              id: `${LayoutOperation.Close.meta.key}.current`,
+              data: Effect.fnUntraced(function* () {
+                const attention = yield* Capability.get(AttentionCapabilities.Attention);
+                const attended = attention.getCurrent().at(-1);
+                if (attended) {
+                  yield* Operation.invoke(LayoutOperation.Close, { subject: [attended] });
+                }
+              }),
+              properties: {
+                label: ['close-current.label', { ns: meta.id }],
+                icon: 'ph--x--regular',
+              },
+            };
+
+            const closeOthers = {
+              id: `${LayoutOperation.Close.meta.key}.others`,
+              data: Effect.fnUntraced(function* () {
+                const attention = yield* Capability.get(AttentionCapabilities.Attention);
+                const deck = yield* DeckCapabilities.getDeck();
+                const attended = attention.getCurrent().at(-1);
+                const ids = deck.active.filter((id: string) => id !== attended) ?? [];
+                yield* Operation.invoke(LayoutOperation.Close, { subject: ids });
+              }),
+              properties: {
+                label: ['close-others.label', { ns: meta.id }],
+                icon: 'ph--x-square--regular',
+              },
+            };
+
+            const closeAll = {
+              id: `${LayoutOperation.Close.meta.key}.all`,
+              data: Effect.fnUntraced(function* () {
+                const deck = yield* DeckCapabilities.getDeck();
+                yield* Operation.invoke(LayoutOperation.Close, { subject: deck.active });
+              }),
+              properties: {
+                label: ['close-all.label', { ns: meta.id }],
+                icon: 'ph--x-circle--regular',
+              },
+            };
+
+            const state = get(yield* Capability.get(DeckCapabilities.State));
+            const deck = state.decks[state.activeDeck];
+
+            const toggleSidebar = {
+              id: `${LayoutOperation.UpdateSidebar.meta.key}.nav`,
+              data: Effect.fnUntraced(function* () {
+                yield* Capabilities.updateAtomValue(DeckCapabilities.State, (s) => ({
+                  ...s,
+                  sidebarState: s.sidebarState === 'expanded' ? ('collapsed' as const) : ('expanded' as const),
+                }));
+              }),
+              properties: {
+                label: [
+                  state.sidebarState === 'expanded'
+                    ? 'collapse-navigation-sidebar.label'
+                    : 'open-navigation-sidebar.label',
+                  { ns: meta.id },
+                ],
+                icon: 'ph--sidebar--regular',
+                keyBinding: {
+                  macos: "meta+'",
+                },
+                disposition: 'pin-end',
+                position: 'fallback',
+                l0Breakpoint: 'lg',
+              },
+            };
+
+            return !deck?.solo ? [closeCurrent, closeOthers, closeAll, toggleSidebar] : [toggleSidebar];
+          }),
+      }),
+    ]);
+
+    return Capability.contributes(AppCapabilities.AppGraphBuilder, extensions.flat());
+  }),
+);

package/src/capabilities/check-app-scheme.ts

@@ -0,0 +1,139 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+
+import { Capabilities, Capability } from '@dxos/app-framework';
+import { APP_SCHEME, AppCapabilities, LayoutOperation } from '@dxos/app-toolkit';
+import { runAndForwardErrors } from '@dxos/effect';
+import { isTauri } from '@dxos/util';
+
+import { DeckCapabilities } from '#types';
+
+/** Identifier for the native redirect dialog surface (defined in welcome plugin). */
+const NATIVE_REDIRECT_DIALOG = 'org.dxos.plugin.welcome.component.native-redirect-dialog';
+
+const SCHEME_TIMEOUT_MS = 500;
+
+const isSafari = (): boolean => {
+  const ua = navigator.userAgent;
+  return ua.includes('Safari') && !ua.includes('Chrome') && !ua.includes('Chromium');
+};
+
+/** Check if the current page URL can be converted to a valid custom scheme URL. */
+const canRedirectToScheme = (): boolean => {
+  try {
+    const schemeUrl = APP_SCHEME + window.location.pathname.replace(/^\/+/, '') + window.location.search;
+    new URL(schemeUrl);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+/**
+ * Try to open the native app via custom scheme.
+ * Resolves `true` if the app opened (page lost focus), `false` if it didn't within the timeout.
+ */
+const tryOpenNativeApp = (): Promise<boolean> => {
+  return new Promise((resolve) => {
+    let resolved = false;
+
+    const onBlur = () => {
+      if (!resolved) {
+        resolved = true;
+        cleanup();
+        resolve(true);
+      }
+    };
+
+    const cleanup = () => {
+      window.removeEventListener('blur', onBlur);
+      document.removeEventListener('visibilitychange', onVisibilityChange);
+    };
+
+    const onVisibilityChange = () => {
+      if (document.hidden) {
+        onBlur();
+      }
+    };
+
+    window.addEventListener('blur', onBlur);
+    document.addEventListener('visibilitychange', onVisibilityChange);
+
+    // Try the scheme via hidden iframe.
+    const schemeUrl = APP_SCHEME + window.location.pathname.replace(/^\/+/, '') + window.location.search;
+    const iframe = document.createElement('iframe');
+    iframe.style.display = 'none';
+    iframe.src = schemeUrl;
+    document.body.appendChild(iframe);
+    setTimeout(() => iframe.remove(), 3000);
+
+    // If no blur within timeout, the app isn't running.
+    setTimeout(() => {
+      if (!resolved) {
+        resolved = true;
+        cleanup();
+        resolve(false);
+      }
+    }, SCHEME_TIMEOUT_MS);
+  });
+};
+
+/** Dispatch all NavigationHandler contributions with the current page URL. */
+const dispatchNavigationHandlers = Effect.fn(function* () {
+  const url = new URL(window.location.href);
+  const handlers = yield* Capability.getAll(AppCapabilities.NavigationHandler);
+  yield* Effect.all(
+    handlers.map((handler) => handler(url)),
+    { concurrency: 'unbounded' },
+  );
+});
+
+/**
+ * Checks whether the native redirect setting is enabled and the redirect should be attempted.
+ * Exported for the URL handler to decide whether to defer NavigationHandler dispatch.
+ */
+export const shouldDeferNavigationHandlers = (): boolean => {
+  return !isTauri() && !isSafari() && !import.meta.env.DEV && canRedirectToScheme();
+};
+
+/**
+ * When running in a web browser (not Tauri) with native redirect enabled,
+ * tries to open the native app via custom scheme. Defers NavigationHandlers
+ * to prevent the web app from consuming one-time tokens before the native app.
+ *
+ * If the app opens: shows dialog with "Open here" callback that dispatches handlers.
+ * If the app doesn't open: dispatches handlers immediately.
+ * In Safari: universal links handle this natively, so the check is skipped.
+ */
+export default Capability.makeModule(
+  Effect.fnUntraced(function* () {
+    const capabilities = yield* Capability.Service;
+    const { invoke } = yield* Capability.get(Capabilities.OperationInvoker);
+    const settings = yield* Capabilities.getAtomValue(DeckCapabilities.Settings);
+
+    if (!settings?.enableNativeRedirect || !shouldDeferNavigationHandlers()) {
+      return;
+    }
+
+    const appOpened = yield* Effect.promise(() => tryOpenNativeApp());
+    if (appOpened) {
+      const onOpenHere = () =>
+        Effect.gen(function* () {
+          yield* dispatchNavigationHandlers();
+          yield* invoke(LayoutOperation.UpdateDialog, { state: false });
+        }).pipe(Effect.provideService(Capability.Service, capabilities), runAndForwardErrors);
+
+      yield* invoke(LayoutOperation.UpdateDialog, {
+        subject: NATIVE_REDIRECT_DIALOG,
+        type: 'alert',
+        overlayClasses: 'dark bg-neutral-950!',
+        props: { onOpenHere },
+      });
+    } else {
+      yield* dispatchNavigationHandlers();
+    }
+  }),
+);

package/src/capabilities/index.ts

@@ -2,13 +2,17 @@
 // Copyright 2025 DXOS.org
 //
 
-export * from './app-graph-builder';
-export * from './check-app-scheme';
-export * from './operation-resolver';
-export * from './react-root';
-export * from './react-surface';
-export * from './settings';
-export * from './state';
-export * from './toolkit';
-// export * from './tools';
-export * from './url-handler';
+import { Capability } from '@dxos/app-framework';
+import { OperationHandlerSet } from '@dxos/compute';
+
+export const AppGraphBuilder = Capability.lazy('AppGraphBuilder', () => import('./app-graph-builder'));
+export const CheckAppScheme = Capability.lazy('CheckAppScheme', () => import('./check-app-scheme'));
+export const OperationHandler = Capability.lazy<OperationHandlerSet.OperationHandlerSet>(
+  'OperationHandler',
+  () => import('./operation-handler'),
+);
+export const ReactRoot = Capability.lazy('ReactRoot', () => import('./react-root'));
+export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));
+export const DeckSettings = Capability.lazy('DeckSettings', () => import('./settings'));
+export const DeckState = Capability.lazy('DeckState', () => import('./state'));
+export const UrlHandler = Capability.lazy('UrlHandler', () => import('./url-handler'));

package/src/capabilities/operation-handler.ts

@@ -0,0 +1,16 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+
+import { Capabilities, Capability } from '@dxos/app-framework';
+import type { OperationHandlerSet } from '@dxos/compute';
+
+import { DeckOperationHandlerSet } from '#operations';
+
+export default Capability.makeModule<OperationHandlerSet.OperationHandlerSet>(
+  Effect.fnUntraced(function* () {
+    return Capability.contributes(Capabilities.OperationHandler, DeckOperationHandlerSet);
+  }),
+);

package/src/capabilities/{react-root/react-root.tsx → react-root.tsx}

@@ -7,9 +7,9 @@ import React, { useCallback } from 'react';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 
-import { DeckLayout } from '../../components';
-import { useDeckState } from '../../hooks';
-import { meta } from '../../meta';
+import { DeckLayout } from '#containers';
+import { useDeckState } from '#hooks';
+import { meta } from '#meta';
 
 export default Capability.makeModule(() =>
   Effect.succeed(

package/src/capabilities/{react-surface/react-surface.tsx → react-surface.tsx}

@@ -7,31 +7,29 @@ import React from 'react';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { Surface, useSettingsState } from '@dxos/app-framework/ui';
-import { AppCapabilities } from '@dxos/app-toolkit';
+import { NOT_FOUND_PATH } from '@dxos/app-toolkit';
+import { AppSurface, NotFoundArticle } from '@dxos/app-toolkit/ui';
 
-import { Banner, DeckSettings } from '../../components';
-import { meta } from '../../meta';
-import { type DeckSettingsProps } from '../../types';
+import { DeckSettings } from '#components';
+import { meta } from '#meta';
+import { type Settings } from '#types';
 
 export default Capability.makeModule(() =>
   Effect.succeed(
     Capability.contributes(Capabilities.ReactSurface, [
       Surface.create({
-        id: `${meta.id}/plugin-settings`,
-        role: 'article',
-        filter: (data): data is { subject: AppCapabilities.Settings } =>
-          AppCapabilities.isSettings(data.subject) && data.subject.prefix === meta.id,
+        id: 'plugin-settings',
+        filter: AppSurface.settings(AppSurface.Article, meta.id),
         component: ({ data: { subject } }) => {
-          const { settings, updateSettings } = useSettingsState<DeckSettingsProps>(subject.atom);
+          const { settings, updateSettings } = useSettingsState<Settings.Settings>(subject.atom);
           return <DeckSettings settings={settings} onSettingsChange={updateSettings} />;
         },
       }),
       Surface.create({
-        id: `${meta.id}/banner`,
-        role: 'banner',
-        component: ({ data }: { data: { variant?: 'topbar' | 'sidebar' } }) => {
-          return <Banner variant={data.variant} />;
-        },
+        id: 'not-found',
+        role: 'article',
+        filter: (data): data is { attendableId: string } => data.attendableId === NOT_FOUND_PATH,
+        component: () => <NotFoundArticle />,
       }),
     ]),
   ),