@dxos/plugin-deck 0.8.4-main.422d1c7879 → 0.8.4-main.4668b7de9b

package/src/containers/Plank/Plank.stories.tsx

@@ -20,8 +20,8 @@ import { Organization } from '@dxos/types';
 
 import { DeckSettings, DeckState } from '#capabilities';
 import { meta as pluginMeta } from '#meta';
+import { translations } from '#translations';
 
-import { translations } from '../../translations';
 import { Plank } from './Plank';
 
 const TestPlugin = Plugin.define(pluginMeta).pipe(
@@ -42,7 +42,7 @@ random.seed(101);
 const storySurfaceExtension = Capability.contributes(
   Capabilities.ReactSurface,
   Surface.create({
-    id: 'story-article',
+    id: 'storyArticle',
     role: 'article',
     component: ({ data }) => {
       const subject = (data as any)?.subject;
@@ -71,7 +71,7 @@ const DefaultStory = () => {
   return (
     <Main.Root>
       <Main.Content bounce handlesFocus classNames='grid' style={{ '--main-spacing': '0' } as any}>
-        <div role='none' className='relative overflow-hidden bg-deck-surface'>
+        <div className='relative overflow-hidden bg-deck-surface'>
           <StackContext.Provider value={{ orientation: 'horizontal', size: 'contain', rail: true }}>
             <Plank.Root graph={graph} part='solo' layoutMode='solo'>
               <Plank.Content solo companion={false} encapsulate={false}>

package/src/containers/Plank/PlankComponent.tsx

@@ -9,10 +9,11 @@ import { Surface } from '@dxos/app-framework/ui';
 import { AppSurface } from '@dxos/app-toolkit/ui';
 import { debounce } from '@dxos/async';
 import { type Node } from '@dxos/plugin-graph';
+import { mainIntrinsicSize } from '@dxos/react-ui';
 import { getLinkedVariant } from '@dxos/react-ui-attention';
 import { useAttentionAttributes } from '@dxos/react-ui-attention';
 import { StackItem, type StackItemSize, railGridHorizontal } from '@dxos/react-ui-stack';
-import { mainIntrinsicSize, mx } from '@dxos/ui-theme';
+import { mx } from '@dxos/ui-theme';
 
 import { useMainSize } from '#hooks';
 import { PLANK_COMPANION_TYPE } from '#types';
@@ -145,7 +146,7 @@ export const PlankComponent = memo(
     const Root = part.startsWith('solo') ? 'article' : StackItem.Root;
     const fullscreen = layoutMode === 'solo--fullscreen';
     const classNames = [
-      'dx-attention-surface relative dx-focus-ring-inset-over-all dx-density-coarse',
+      'dx-attention-surface relative dx-focus-ring-inset-over-all dx-density-lg',
       isSolo && 'absolute inset-0',
       isSolo && mainIntrinsicSize,
       railGridHorizontal,

package/src/containers/Plank/PlankContent.tsx

@@ -4,8 +4,8 @@
 
 import React, { type PropsWithChildren } from 'react';
 
+import { composable, composableProps, mainIntrinsicSize } from '@dxos/react-ui';
 import { railGridHorizontal } from '@dxos/react-ui-stack';
-import { composable, composableProps, mainIntrinsicSize } from '@dxos/ui-theme';
 
 import { useMainSize } from '#hooks';
 

package/src/containers/Plank/PlankError.tsx

@@ -64,15 +64,18 @@ export const PlankErrorFallback = ({ error }: ErrorFallbackProps) => {
     return <ErrorFallback title='Plank Error' error={error} />;
   } else {
     const errorString = error?.toString() ?? '';
+
     return (
       <div
         role='alert'
         data-testid='plank-content-error'
         className='dx-attention-surface overflow-y-auto p-8 grid place-items-center'
       >
-        <p className={mx(descriptionMessage, 'break-all rounded-md p-4')}>
-          {error ? errorString : t('error-fallback.message')}
-        </p>
+        <div className='flex flex-col items-center gap-2'>
+          <p className={mx(descriptionMessage, 'break-all rounded-md p-4')}>
+            {error ? errorString : t('error-fallback.message')}
+          </p>
+        </div>
       </div>
     );
   }

package/src/containers/Plank/PlankHeading.tsx

@@ -15,7 +15,7 @@ import { hoverableControls, hoverableFocusedWithinControls, iconSize } from '@dx
 
 import { useBreakpoints } from '#hooks';
 import { meta } from '#meta';
-import { DeckOperation } from '#operations';
+import { DeckOperation } from '#types';
 import { type LayoutMode, PLANK_COMPANION_TYPE, type ResolvedPart } from '#types';
 
 import { PlankCompanionControls, PlankControls } from './PlankControls';
@@ -61,7 +61,7 @@ export const PlankHeading = memo(
     const { graph, onAdjust, onUpdateCompanion } = usePlankContext('PlankHeading');
     const runAction = useActionRunner();
     const breakpoint = useBreakpoints();
-    const icon = node?.properties?.icon ?? 'ph--placeholder--regular';
+    const icon = node?.properties?.icon ?? 'ph--circle-dashed--regular';
     const label = pending
       ? t('pending.heading')
       : toLocalizedString(node?.properties?.label ?? ['plank-heading-fallback.label', { ns: meta.id }], t);
@@ -143,7 +143,7 @@ export const PlankHeading = memo(
         data-plank-heading
         style={iconSize(5)}
         classNames={[
-          'py-1 items-stretch gap-1 sticky left-12 dx-app-drag min-w-0 dx-contain-layout dx-density-coarse',
+          'py-1 items-stretch gap-1 sticky left-12 dx-app-drag min-w-0 dx-contain-layout dx-density-lg',
           part === 'solo'
             ? 'ps-[calc(env(safe-area-inset-left)+.25rem)] pe-[calc(env(safe-area-inset-right)+.25rem)]'
             : 'px-1',
@@ -161,7 +161,7 @@ export const PlankHeading = memo(
       >
         {companions && isCompanionNode ? (
           /* TODO(thure): IMPORTANT: This is a tablist; it should be implemented as such. */
-          <div data-tauri-drag-region role='none' className='flex-1 min-w-0 overflow-x-auto scrollbar-none flex gap-1'>
+          <div data-tauri-drag-region className='flex-1 min-w-0 overflow-x-auto scrollbar-none flex gap-1'>
             {companions.map(({ id, properties: { icon, label } }) => (
               <IconButton
                 key={id}
@@ -211,7 +211,7 @@ export const PlankHeading = memo(
           </>
         )}
         {debug && (
-          <div role='none' className='flex items-center text-sm text-info-text'>
+          <div className='flex items-center text-sm text-info-text'>
             {layoutMode}:{part}:{companioned}
           </div>
         )}

package/src/containers/Plank/PlankLoading.tsx

@@ -6,5 +6,5 @@ import React from 'react';
 
 // TODO(burdon): Show skeleton: https://github.com/dxos/dxos/issues/8259
 export const PlankLoading = () => {
-  return <div role='none' className='grid place-items-center dx-attention-surface' />;
+  return <div className='grid place-items-center dx-attention-surface' />;
 };

package/src/containers/Plank/PlankRoot.tsx

@@ -7,7 +7,7 @@ import React, { PropsWithChildren } from 'react';
 
 import { type Graph } from '@dxos/plugin-graph';
 
-import { type DeckOperation } from '#operations';
+import { type DeckOperation } from '#types';
 import { type LayoutMode, type PlankSizing, type ResolvedPart, type Settings } from '#types';
 
 const PLANK_NAME = 'Plank';

package/src/containers/Sidebar/ComplementarySidebar.tsx

@@ -11,7 +11,7 @@ import { getLinkedVariant } from '@dxos/react-ui-attention';
 import { Tabs } from '@dxos/react-ui-tabs';
 import { iconSize, mx } from '@dxos/ui-theme';
 
-import { type DeckCompanion, useBreakpoints, useDeckCompanions, useDeckState, useHoistStatusbar } from '#hooks';
+import { type DeckCompanion, useBreakpoints, useDeckCompanions, useDeckState } from '#hooks';
 import { meta } from '#meta';
 import { getMode } from '#types';
 
@@ -32,7 +32,6 @@ export const ComplementarySidebar = ({ current }: ComplementarySidebarProps) =>
   const layoutMode = getMode(deck);
   const breakpoint = useBreakpoints();
   const topbar = layoutAppliesTopbar(breakpoint, layoutMode);
-  const hoistStatusbar = useHoistStatusbar(breakpoint, layoutMode);
 
   const companions = useDeckCompanions();
   const activeCompanion = companions.find((companion) => getLinkedVariant(companion.id) === current);
@@ -78,28 +77,24 @@ export const ComplementarySidebar = ({ current }: ComplementarySidebarProps) =>
   return (
     <Main.ComplementarySidebar
       label={label}
-      classNames={[
-        topbar && 'top-[calc(env(safe-area-inset-top)+var(--dx-rail-size))]',
-        hoistStatusbar && 'bottom-(--dx-statusbar-size)',
-      ]}
+      classNames={[topbar && 'top-[calc(env(safe-area-inset-top)+var(--dx-rail-size))]']}
     >
       {/* R0 Tabs */}
-      <Tabs.Root orientation='vertical' value={internalValue} classNames='contents'>
+      <Tabs.Root classNames='contents' orientation='vertical' value={internalValue}>
         <div
           data-tauri-drag-region
-          role='none'
           style={iconSize(5)}
           className={mx(
-            'absolute z-20 inset-y-0 end-0 w-(--dx-r0-size)!',
+            'absolute z-1 inset-y-0 end-0 w-(--dx-r0-size)!',
             'py-[env(safe-area-inset-top)] pb-[env(safe-area-inset-bottom)] border-s border-subdued-separator',
-            'grid grid-cols-1 grid-rows-[1fr_min-content] bg-toolbar-surface dx-contain-layout dx-app-drag',
+            'grid grid-cols-1 grid-rows-[1fr_min-content] bg-r0-surface dx-contain-layout dx-app-drag',
           )}
         >
-          {/* TODO(burdon): ScrollArea. */}
-          <Tabs.Tablist classNames='grid grid-cols-1 auto-rows-(--dx-rail-action) overflow-y-auto'>
+          <Tabs.Tablist classNames='grid grid-cols-1 auto-rows-(--dx-rail-action) overflow-y-auto scrollbar-none gap-1 p-1'>
             {companions.map((companion) => (
               <Tabs.Tab key={getLinkedVariant(companion.id)} value={getLinkedVariant(companion.id)} asChild>
                 <IconButton
+                  classNames='w-(--dx-rail-action) h-(--dx-rail-action) min-h-0 px-0'
                   label={toLocalizedString(companion.properties.label, t)}
                   icon={companion.properties.icon}
                   iconOnly
@@ -118,16 +113,13 @@ export const ComplementarySidebar = ({ current }: ComplementarySidebarProps) =>
               </Tabs.Tab>
             ))}
           </Tabs.Tablist>
-          {!hoistStatusbar && (
-            <div
-              role='none'
-              className='grid grid-cols-1 auto-rows-(--dx-rail-item) gap-0.5 overflow-y-auto'
-              style={iconSize(4)}
-            >
-              <Surface.Surface role='status-indicator' />
-            </div>
-          )}
-          <div role='none' className='hidden lg:grid grid-cols-1 auto-rows-(--dx-rail-action) p-1'>
+          <div
+            className='grid grid-cols-1 auto-rows-(--dx-rail-item) py-0.5 gap-0.5 overflow-y-auto scrollbar-none'
+            style={iconSize(4)}
+          >
+            <Surface.Surface role='status-indicator' />
+          </div>
+          <div className='hidden lg:grid grid-cols-1 auto-rows-(--dx-rail-action) p-1'>
             <ToggleComplementarySidebarButton />
           </div>
         </div>
@@ -140,16 +132,11 @@ export const ComplementarySidebar = ({ current }: ComplementarySidebarProps) =>
               value={getLinkedVariant(companion.id)}
               classNames={[
                 'absolute data-[state="inactive"]:-z-[1] overflow-hidden',
-                'inset-y-0 start-0 w-[calc(100%-var(--dx-r0-size))] lg:w-(--dx-r1-size)',
+                'inset-y-0 start-0 w-full lg:w-(--dx-r1-size)',
               ]}
               {...(state.complementarySidebarState !== 'expanded' && { inert: true })}
             >
-              <ComplementarySidebarPanel
-                companion={companion}
-                activeId={activeId}
-                data={data}
-                hoistStatusbar={hoistStatusbar}
-              />
+              <ComplementarySidebarPanel companion={companion} activeId={activeId} data={data} />
             </Tabs.Panel>
           ))}
       </Tabs.Root>
@@ -164,10 +151,9 @@ type ComplementarySidebarPanelProps = {
     id: string;
     subject: any;
   };
-  hoistStatusbar: boolean;
 };
 
-const ComplementarySidebarPanel = ({ companion, activeId, data, hoistStatusbar }: ComplementarySidebarPanelProps) => {
+const ComplementarySidebarPanel = ({ companion, activeId, data }: ComplementarySidebarPanelProps) => {
   const { t } = useTranslation(meta.id);
 
   if (getLinkedVariant(companion.id) !== activeId && !data) {
@@ -177,14 +163,14 @@ const ComplementarySidebarPanel = ({ companion, activeId, data, hoistStatusbar }
   return (
     <Panel.Root>
       <Panel.Toolbar asChild size='lg'>
-        <Toolbar.Root classNames='bg-modal-surface border-b border-subdued-separator'>
+        <Toolbar.Root style={iconSize(5)} classNames='bg-header-surface'>
           <IconButton
+            classNames='w-(--dx-rail-action) h-(--dx-rail-action) min-h-0 px-0'
             label={toLocalizedString(companion.properties.label, t)}
             icon={companion.properties.icon}
             iconOnly
             tooltipSide='left'
             data-value={getLinkedVariant(companion.id)}
-            classNames='h-10 w-10'
             variant='default'
           />
           <div role='none' className='px-1'>
@@ -192,7 +178,7 @@ const ComplementarySidebarPanel = ({ companion, activeId, data, hoistStatusbar }
           </div>
         </Toolbar.Root>
       </Panel.Toolbar>
-      <Panel.Content classNames='bg-base-surface'>
+      <Panel.Content classNames='bg-r1-surface'>
         <Surface.Surface
           role={`deck-companion--${getLinkedVariant(companion.id)}`}
           data={data}
@@ -200,11 +186,6 @@ const ComplementarySidebarPanel = ({ companion, activeId, data, hoistStatusbar }
           placeholder={<PlankLoading />}
         />
       </Panel.Content>
-      {!hoistStatusbar && (
-        <Panel.Statusbar size='sm'>
-          <Surface.Surface role='status-bar--r1-footer' limit={1} />
-        </Panel.Statusbar>
-      )}
     </Panel.Root>
   );
 };

package/src/containers/Sidebar/Sidebar.tsx

@@ -8,7 +8,7 @@ import { Surface } from '@dxos/app-framework/ui';
 import { AppSurface } from '@dxos/app-toolkit/ui';
 import { type Label, Main } from '@dxos/react-ui';
 
-import { useBreakpoints, useDeckState, useHoistStatusbar } from '#hooks';
+import { useBreakpoints, useDeckState } from '#hooks';
 import { meta } from '#meta';
 import { getMode } from '#types';
 
@@ -22,21 +22,16 @@ export const Sidebar = () => {
   const breakpoint = useBreakpoints();
   const layoutMode = getMode(deck);
   const topbar = layoutAppliesTopbar(breakpoint, layoutMode);
-  const hoistStatusbar = useHoistStatusbar(breakpoint, layoutMode);
 
-  const navigationData = useMemo<AppSurface.NavigationData<{ topbar: boolean; hoistStatusbar: boolean }>>(
-    () => ({ popoverAnchorId, topbar, hoistStatusbar, current }),
-    [popoverAnchorId, topbar, hoistStatusbar, current],
+  const navigationData = useMemo<AppSurface.NavigationData<{ topbar: boolean }>>(
+    () => ({ popoverAnchorId, topbar, current }),
+    [popoverAnchorId, topbar, current],
   );
 
   return (
     <Main.NavigationSidebar
       label={label}
-      classNames={[
-        'grid',
-        topbar && 'top-[calc(env(safe-area-inset-top)+var(--dx-rail-size))]',
-        hoistStatusbar && 'bottom-(--dx-statusbar-size)',
-      ]}
+      classNames={['grid', topbar && 'top-[calc(env(safe-area-inset-top)+var(--dx-rail-size))]']}
     >
       <Surface.Surface type={AppSurface.Navigation} data={navigationData} limit={1} />
     </Main.NavigationSidebar>

package/src/containers/Sidebar/SidebarButton.tsx

@@ -80,13 +80,19 @@ export const ToggleComplementarySidebarButton = ({
     }
   }, [state, updateState, current, companions, invokePromise]);
 
+  const label = t(
+    state.complementarySidebarState === 'expanded'
+      ? 'close-complementary-sidebar.label'
+      : 'open-complementary-sidebar.label',
+  );
+
   return (
     <IconButton
       variant='ghost'
       classNames={['[&>svg]:-scale-x-100', classNames]}
       icon='ph--sidebar-simple--regular'
       iconOnly
-      label={t('open-complementary-sidebar.label')}
+      label={label}
       tooltipSide={inR0 ? 'left' : undefined}
       onClick={handleClick}
     />

package/src/hooks/index.ts

@@ -6,7 +6,6 @@ export * from './useBreakpoints';
 export * from './useCompanions';
 export * from './useDeckCompanions';
 export * from './useDeckState';
-export * from './useHoistStatusbar';
 export * from './useMainSize';
 export * from './useNodeActionExpander';
 export * from './useSelectedCompanion';

package/src/hooks/useDeckCompanions.ts

@@ -5,7 +5,7 @@
 import { useAppGraph } from '@dxos/app-toolkit/ui';
 import { Node, type Node as NodeType } from '@dxos/plugin-graph';
 import { useConnections } from '@dxos/plugin-graph';
-import { type Label } from '@dxos/ui-types';
+import { type Label } from '@dxos/ui-types/translations';
 import { type Position, byPosition } from '@dxos/util';
 
 import { DECK_COMPANION_TYPE } from '#types';

package/src/index.ts

@@ -2,7 +2,5 @@
 // Copyright 2023 DXOS.org
 //
 
-export { DeckCapabilities, DeckEvents } from './types';
-export * from './DeckPlugin';
 export * from './meta';
-export { useCompanions } from './hooks';
+export * from './types';

package/src/meta.ts

@@ -2,15 +2,33 @@
 // Copyright 2023 DXOS.org
 //
 
-import { type Plugin } from '@dxos/app-framework';
+import { Plugin } from '@dxos/app-framework';
+import { DXN } from '@dxos/keys';
 import { trim } from '@dxos/util';
 
-export const meta: Plugin.Meta = {
-  id: 'org.dxos.plugin.deck',
+export const meta = Plugin.makeMeta({
+  key: DXN.make('org.dxos.plugin.deck'),
   name: 'Layout',
+  author: 'DXOS',
+  spec: 'PLUGIN.mdl',
   description: trim`
-    Flexible layout system for arranging workspace views in tabs, splits, and panels.
-    Customize your workspace organization with drag-and-drop layout management.
+    The Deck plugin is the core layout engine for DXOS Composer. It manages the multi-plank
+    workspace (the "deck"), sidebar panels, dialogs, popovers, and toast notifications, giving
+    users a flexible, persistent workspace they can arrange to match their workflow.
+
+    In multi mode, subjects are opened as resizable "planks" arranged side by side. Users can
+    navigate with stack semantics — opening from a pivot truncates planks to the right and
+    appends the new one — or switch to solo or fullscreen mode for focused, distraction-free
+    viewing.
+
+    Layout state (active planks, sidebar visibility, plank sizes, companion pane) is persisted
+    across sessions via KVS/localStorage. URL routing is handled by the plugin so that any
+    workspace configuration can be bookmarked or shared as a deep link.
+
+    All layout changes are expressed through typed LayoutOperations (Open, Close, SetLayoutMode,
+    UpdateSidebar, UpdateDialog, UpdatePopover, etc.) that any plugin in the system can dispatch,
+    keeping the layout logic centralised and easy to extend.
   `,
   icon: 'ph--layout--regular',
-};
+  tags: ['system'],
+});

package/src/operations/add-toast.ts

@@ -6,7 +6,7 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities } from '@dxos/app-framework';
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { DeckCapabilities } from '../types';
 

package/src/operations/adjust.ts

@@ -8,18 +8,17 @@ import * as Option from 'effect/Option';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { AppCapabilities, LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
+import { Operation } from '@dxos/compute';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
 import { Graph } from '@dxos/plugin-graph';
 import { byPosition } from '@dxos/util';
 
 import { incrementPlank } from '../layout';
-import { DeckCapabilities, PLANK_COMPANION_TYPE } from '../types';
+import { DeckCapabilities, DeckOperation, PLANK_COMPANION_TYPE } from '../types';
 import { computeActiveUpdates } from '../util';
-import { Adjust } from './definitions';
 import { updateActiveDeck } from './helpers';
 
-const handler: Operation.WithHandler<typeof Adjust> = Adjust.pipe(
+const handler: Operation.WithHandler<typeof DeckOperation.Adjust> = DeckOperation.Adjust.pipe(
   Operation.withHandler(
     Effect.fnUntraced(function* (input) {
       const _state = yield* Capabilities.getAtomValue(DeckCapabilities.State);

package/src/operations/close.ts

@@ -6,8 +6,8 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
+import { Operation } from '@dxos/compute';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
 
 import { closeEntry } from '../layout';
 import { DeckCapabilities } from '../types';

package/src/operations/index.ts

@@ -2,9 +2,7 @@
 // Copyright 2025 DXOS.org
 //
 
-import { OperationHandlerSet } from '@dxos/operation';
-
-export * as DeckOperation from './definitions';
+import { OperationHandlerSet } from '@dxos/compute';
 
 export const DeckOperationHandlerSet = OperationHandlerSet.lazy(
   () => import('./add-toast'),
@@ -15,7 +13,6 @@ export const DeckOperationHandlerSet = OperationHandlerSet.lazy(
   () => import('./scroll-into-view'),
   () => import('./set'),
   () => import('./set-layout-mode'),
-  () => import('./show-undo'),
   () => import('./switch-workspace'),
   () => import('./update-companion'),
   () => import('./update-complementary'),

package/src/operations/open.ts

@@ -13,13 +13,14 @@ import {
   expandPath,
   validateNavigationTarget,
 } from '@dxos/app-toolkit';
+import { Operation } from '@dxos/compute';
 import { Context } from '@dxos/context';
-import { Obj } from '@dxos/echo';
-import { Operation } from '@dxos/operation';
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
-import { ClientCapabilities } from '@dxos/plugin-client/types';
+import { Database, EID, Obj } from '@dxos/echo';
+import { log } from '@dxos/log';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
+import { ClientCapabilities } from '@dxos/plugin-client';
 import { Graph } from '@dxos/plugin-graph';
-import { ObservabilityOperation } from '@dxos/plugin-observability/operations';
+import { ObservabilityOperation } from '@dxos/plugin-observability';
 
 import { openSubjectsOnActiveDeck } from '../layout';
 import { DeckCapabilities } from '../types';
@@ -29,18 +30,33 @@ import { updateActiveDeck } from './helpers';
 const handler: Operation.WithHandler<typeof LayoutOperation.Open> = LayoutOperation.Open.pipe(
   Operation.withHandler(
     Effect.fnUntraced(function* (input) {
+      log('LayoutOperation.Open handler start');
       const { graph } = yield* Capability.get(AppCapabilities.AppGraph);
       const attention = yield* Capability.get(AttentionCapabilities.Attention);
 
       // Validate navigation targets, redirecting to 404 if not found.
       const capabilities = yield* Capability.Service;
       const pathResolvers = capabilities.getAll(AppCapabilities.NavigationPathResolver);
-      const checkRemoteExistence = yield* Capability.get(ClientCapabilities.Client).pipe(
-        Effect.map((client) =>
-          createEdgeExistenceChecker((spaceId, body) => client.edge.http.execQuery(new Context(), spaceId, body)),
-        ),
+      const client = yield* Capability.get(ClientCapabilities.Client).pipe(
         Effect.catchAll(() => Effect.succeed(undefined)),
       );
+      // Existence checkers for the resolved EID: local (loadOption) first, then remote (edge).
+      const checkLocalExistence = client
+        ? (id: EID.EID) => {
+            const spaceId = EID.getSpaceId(id);
+            const space = spaceId ? client.spaces.get(spaceId) : undefined;
+            if (!space) {
+              return Effect.succeed(false);
+            }
+            return Database.loadOption(space.db.makeRef(id)).pipe(
+              Effect.map(Option.isSome),
+              Effect.catchAll(() => Effect.succeed(false)),
+            );
+          }
+        : undefined;
+      const checkRemoteExistence = client
+        ? createEdgeExistenceChecker((spaceId, body) => client.edge.http.execQuery(new Context(), spaceId, body))
+        : undefined;
 
       // Immediate: skip 404 / resolver checks but still expand the path (same as validate’s first step).
       if (input.navigation === 'immediate') {
@@ -53,7 +69,7 @@ const handler: Operation.WithHandler<typeof LayoutOperation.Open> = LayoutOperat
         input.subject.map((subjectId) =>
           input.navigation === 'immediate'
             ? Effect.succeed(subjectId)
-            : validateNavigationTarget({ graph, subjectId, pathResolvers, checkRemoteExistence }),
+            : validateNavigationTarget({ graph, subjectId, pathResolvers, checkLocalExistence, checkRemoteExistence }),
         ),
       );
       input = { ...input, subject: validatedSubjects };
@@ -74,7 +90,7 @@ const handler: Operation.WithHandler<typeof LayoutOperation.Open> = LayoutOperat
         const deck = yield* DeckCapabilities.getDeck();
         const active = !deck.solo && deck.initialized ? deck.active : [];
         if (active.length > 0 && input.subject.length > 0) {
-          const resolveDxn = (qualifiedPath: string) =>
+          const resolveDXN = (qualifiedPath: string) =>
             Effect.reduce(pathResolvers, Option.none<string>(), (acc, resolver) =>
               Option.isSome(acc)
                 ? Effect.succeed(acc)
@@ -88,7 +104,7 @@ const handler: Operation.WithHandler<typeof LayoutOperation.Open> = LayoutOperat
           const deckDxnMap = new Map<string, string>();
           yield* Effect.all(
             active.map((deckId) =>
-              resolveDxn(deckId).pipe(
+              resolveDXN(deckId).pipe(
                 Effect.map((opt) => {
                   if (Option.isSome(opt)) {
                     deckDxnMap.set(opt.value, deckId);
@@ -103,7 +119,7 @@ const handler: Operation.WithHandler<typeof LayoutOperation.Open> = LayoutOperat
           if (deckDxnMap.size > 0) {
             const remapped = yield* Effect.all(
               input.subject.map((subjectId) =>
-                resolveDxn(subjectId).pipe(
+                resolveDXN(subjectId).pipe(
                   Effect.map((opt) => {
                     if (Option.isSome(opt)) {
                       const existing = deckDxnMap.get(opt.value);

package/src/operations/revert-workspace.ts

@@ -6,7 +6,7 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities } from '@dxos/app-framework';
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { DeckCapabilities } from '../types';
 

package/src/operations/scroll-into-view.ts

@@ -6,7 +6,7 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities } from '@dxos/app-framework';
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { DeckCapabilities } from '../types';
 

package/src/operations/set-layout-mode.ts

@@ -6,8 +6,8 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities } from '@dxos/app-framework';
 import { LayoutOperation } from '@dxos/app-toolkit';
+import { Operation } from '@dxos/compute';
 import { log } from '@dxos/log';
-import { Operation } from '@dxos/operation';
 import { isNonNullable } from '@dxos/util';
 
 import { DeckCapabilities, type DeckState, type LayoutMode, getMode, isLayoutMode } from '../types';

package/src/operations/set.ts

@@ -6,8 +6,8 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
+import { Operation } from '@dxos/compute';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
 
 import { DeckCapabilities } from '../types';
 import { computeActiveUpdates } from '../util';