@dxos/plugin-deck 0.8.4-main.74a063c4e0 → 0.8.4-main.765dc60934

package/src/containers/Plank/PlankComponent.tsx

@@ -6,12 +6,12 @@ import { useFocusFinders } from '@fluentui/react-tabster';
 import React, { type KeyboardEvent, memo, useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 
 import { Surface } from '@dxos/app-framework/ui';
-import { type AppSurface } from '@dxos/app-toolkit/ui';
+import { AppSurface } from '@dxos/app-toolkit/ui';
 import { debounce } from '@dxos/async';
 import { type Node } from '@dxos/plugin-graph';
 import { getLinkedVariant } from '@dxos/react-ui-attention';
 import { useAttentionAttributes } from '@dxos/react-ui-attention';
-import { StackItem, railGridHorizontal } from '@dxos/react-ui-stack';
+import { StackItem, type StackItemSize, railGridHorizontal } from '@dxos/react-ui-stack';
 import { mainIntrinsicSize, mx } from '@dxos/ui-theme';
 
 import { useMainSize } from '#hooks';
@@ -22,6 +22,32 @@ import { PlankHeading } from './PlankHeading';
 import { PlankLoading } from './PlankLoading';
 import { PlankRootProps, usePlankContext } from './PlankRoot';
 
+/**
+ * JS-based smooth scroll that won't be interrupted by MutationObserver or layout changes.
+ */
+const smoothScrollTo = (element: HTMLElement, target: number, duration: number) => {
+  const start = element.scrollLeft;
+  const distance = target - start;
+  const startTime = performance.now();
+
+  const step = (currentTime: number) => {
+    const elapsed = currentTime - startTime;
+    const progress = Math.min(elapsed / duration, 1);
+    // Ease-out cubic.
+    const eased = 1 - Math.pow(1 - progress, 3);
+    element.scrollLeft = start + distance * eased;
+    if (progress < 1) {
+      requestAnimationFrame(step);
+    }
+  };
+
+  requestAnimationFrame(step);
+};
+
+// NOTE: Calibrated to show PLANK + COMPANION on MBP 16" screen.
+export const DEFAULT_SIZE = 48 satisfies StackItemSize;
+export const DEFAULT_COMPANION_SIZE = 35 satisfies StackItemSize;
+
 export type PlankComponentProps = Pick<PlankRootProps, 'part'> & {
   id: string;
   path?: string[];
@@ -40,25 +66,29 @@ export const PlankComponent = memo(
 
     const canResize = layoutMode === 'multi';
     const { findFirstFocusable } = useFocusFinders();
+    const isCompanion = companioned === 'companion';
     const attentionAttrs = useAttentionAttributes(primary?.id ?? id);
-    const orderId = companioned === 'companion' ? primary?.id : id;
+    const orderId = isCompanion ? primary?.id : id;
     const index = orderId && active ? active.findIndex((entryId) => entryId === orderId) : -1;
     const length = active?.length ?? 1;
     const isOrdered = !!active && index >= 0;
     const canIncrementStart = isOrdered && index > 0;
     const canIncrementEnd = isOrdered && index < length - 1;
-
     const rootElement = useRef<HTMLDivElement | null>(null);
-
     const variant = node?.type === PLANK_COMPANION_TYPE ? getLinkedVariant(id) : undefined;
-    const sizeKey = id.split('+')[0];
-    const size = plankSizing?.[sizeKey] as number | undefined;
 
+    // Sizing.
+    const sizeAttrs = useMainSize();
+    const sizeKey = id.split('+')[0];
+    const size = isCompanion
+      ? DEFAULT_COMPANION_SIZE
+      : ((plankSizing?.[sizeKey] as number | undefined) ?? DEFAULT_SIZE);
     const handleSizeChange = useCallback(
       debounce((nextSize: number) => {
-        onResize?.(sizeKey, nextSize);
+        const size = Math.round(nextSize);
+        onResize?.(sizeKey, size);
       }, 200),
-      [onResize, sizeKey],
+      [sizeKey, onResize],
     );
 
     // TODO(thure): Tabster's focus group should handle moving focus to Main, but something is blocking it.
@@ -76,8 +106,17 @@ export const PlankComponent = memo(
     }, []);
 
     useLayoutEffect(() => {
-      if (scrollIntoView === id) {
-        layoutMode === 'multi' && rootElement.current?.scrollIntoView({ behavior: 'smooth', inline: 'center' });
+      if (scrollIntoView === id && layoutMode === 'multi' && rootElement.current) {
+        const element = rootElement.current;
+        const scrollParent = element.closest('[style*="overflow"], .overflow-x-auto') as HTMLElement | null;
+        if (scrollParent) {
+          const elementRect = element.getBoundingClientRect();
+          const parentRect = scrollParent.getBoundingClientRect();
+          const targetScrollLeft = scrollParent.scrollLeft + (elementRect.left - parentRect.left);
+
+          smoothScrollTo(scrollParent, targetScrollLeft, 300);
+        }
+
         onScrollIntoView?.(undefined);
       }
     }, [id, scrollIntoView, layoutMode, onScrollIntoView]);
@@ -85,7 +124,6 @@ export const PlankComponent = memo(
     const isSolo = layoutMode.startsWith('solo') && part === 'solo';
     const isAttendable =
       (layoutMode.startsWith('solo') && part.startsWith('solo')) || (layoutMode === 'multi' && part === 'multi');
-    const sizeAttrs = useMainSize();
 
     const data = useMemo<AppSurface.ArticleData | undefined>(
       () =>
@@ -104,8 +142,9 @@ export const PlankComponent = memo(
     // TODO(wittjosiah): Change prop to accept a component.
     const placeholder = useMemo(() => <PlankLoading />, []);
 
+    const Root = part.startsWith('solo') ? 'article' : StackItem.Root;
     const fullscreen = layoutMode === 'solo--fullscreen';
-    const className = mx(
+    const classNames = [
       'dx-attention-surface relative dx-focus-ring-inset-over-all dx-density-coarse',
       isSolo && 'absolute inset-0',
       isSolo && mainIntrinsicSize,
@@ -113,14 +152,12 @@ export const PlankComponent = memo(
       part.startsWith('solo') && 'grid',
       part.startsWith('solo-') && 'grid-rows-subgrid row-span-2 min-w-0',
       fullscreen && 'grid-rows-1',
-      part === 'multi' && (companioned === 'companion' ? 'border-separator! border-e' : 'border-separator! border-x'),
+      part === 'multi' && (isCompanion ? 'border-separator! border-e' : 'border-separator! border-x'),
       part === 'solo-companion' && 'border-separator! border-s',
       settings?.encapsulatedPlanks &&
         !part.startsWith('solo') &&
         'mx-(--main-spacing) border-separator! border rounded-sm overflow-hidden',
-    );
-
-    const Root = part.startsWith('solo') ? 'article' : StackItem.Root;
+    ];
 
     return (
       <Root
@@ -130,15 +167,15 @@ export const PlankComponent = memo(
         tabIndex={0}
         {...(part.startsWith('solo')
           ? ({
-              className,
+              className: mx(classNames),
               ...sizeAttrs,
             } as any)
           : {
               role: 'article',
-              classNames: className,
+              item: { id },
+              classNames,
               order,
               size,
-              item: { id },
               onSizeChange: handleSizeChange,
             })}
         {...(isAttendable ? attentionAttrs : {})}
@@ -163,7 +200,7 @@ export const PlankComponent = memo(
             )}
             <Surface.Surface
               key={node.id}
-              role='article'
+              type={AppSurface.Article}
               data={data}
               limit={1}
               fallback={PlankErrorFallback}

package/src/containers/Plank/PlankControls.tsx

@@ -5,10 +5,10 @@
 import React, { forwardRef, useCallback } from 'react';
 
 import { useOperationInvoker } from '@dxos/app-framework/ui';
+import { LayoutOperation } from '@dxos/app-toolkit';
 import { ButtonGroup, type ButtonGroupProps, type ButtonProps, IconButton, useTranslation } from '@dxos/react-ui';
 
 import { meta } from '#meta';
-import { DeckOperation } from '#operations';
 import { type DeckAction, type LayoutMode } from '#types';
 
 export type PlankControlHandler = (event: DeckAction.PartAdjustment) => void;
@@ -37,7 +37,7 @@ export const PlankCompanionControls = forwardRef<HTMLDivElement, PlankCompanionC
     const { t } = useTranslation(meta.id);
     const { invokePromise } = useOperationInvoker();
     const handleCloseCompanion = useCallback(() => {
-      return invokePromise(DeckOperation.ChangeCompanion, { companion: null });
+      return invokePromise(LayoutOperation.UpdateCompanion, { subject: null });
     }, [invokePromise]);
     return (
       <div ref={forwardedRef} className='contents dx-app-no-drag'>

package/src/containers/Plank/PlankError.tsx

@@ -56,7 +56,7 @@ export const PlankErrorFallback = ({ error }: ErrorFallbackProps) => {
 
   useEffect(() => {
     if (error) {
-      log.error(error);
+      log.error('plank error', { error });
     }
   }, [error]);
 

package/src/containers/Plank/PlankHeading.tsx

@@ -5,7 +5,7 @@
 import React, { Fragment, type MouseEvent, memo, useCallback, useEffect, useMemo } from 'react';
 
 import { Surface } from '@dxos/app-framework/ui';
-import { type AppSurface } from '@dxos/app-toolkit/ui';
+import { AppSurface } from '@dxos/app-toolkit/ui';
 import { Graph, type Node, useActionRunner } from '@dxos/plugin-graph';
 import { Icon, IconButton, Popover, toLocalizedString, useTranslation } from '@dxos/react-ui';
 import { getLinkedVariant } from '@dxos/react-ui-attention';
@@ -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';
@@ -37,6 +37,7 @@ export type PlankHeadingProps = {
   companioned?: 'primary' | 'companion';
   companions?: Node.Node[];
   actions?: StackItemSigilAction[];
+  debug?: boolean;
 };
 
 export const PlankHeading = memo(
@@ -54,9 +55,10 @@ export const PlankHeading = memo(
     companions,
     layoutMode,
     actions = [],
+    debug = false,
   }: PlankHeadingProps) => {
     const { t } = useTranslation(meta.id);
-    const { graph, onAdjust, onChangeCompanion } = usePlankContext('PlankHeading');
+    const { graph, onAdjust, onUpdateCompanion } = usePlankContext('PlankHeading');
     const runAction = useActionRunner();
     const breakpoint = useBreakpoints();
     const icon = node?.properties?.icon ?? 'ph--placeholder--regular';
@@ -129,10 +131,10 @@ export const PlankHeading = memo(
         const target = (event.target as HTMLElement).closest('[data-id]') as HTMLElement | null;
         const tabId = target?.dataset?.id;
         if (tabId) {
-          onChangeCompanion?.(tabId);
+          onUpdateCompanion?.(tabId);
         }
       },
-      [onChangeCompanion],
+      [onUpdateCompanion],
     );
 
     return (
@@ -159,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}
@@ -185,7 +187,7 @@ export const PlankHeading = memo(
                   onAction={handleAction}
                 >
                   <Surface.Surface
-                    role='menu-footer'
+                    type={AppSurface.MenuFooter}
                     data={{ subject: node.data } satisfies AppSurface.MenuFooterData}
                   />
                 </StackItem.Sigil>
@@ -208,8 +210,16 @@ export const PlankHeading = memo(
             </TextTooltip>
           </>
         )}
+        {debug && (
+          <div className='flex items-center text-sm text-info-text'>
+            {layoutMode}:{part}:{companioned}
+          </div>
+        )}
         {node && part !== 'complementary' && (
-          <Surface.Surface role='navbar-end' data={{ subject: node.data } satisfies AppSurface.NavbarEndData} />
+          <Surface.Surface
+            type={AppSurface.NavbarEnd}
+            data={{ subject: node.data } satisfies AppSurface.NavbarEndData}
+          />
         )}
         {companioned === 'companion' ? (
           <PlankCompanionControls primary={primaryId} />

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';
@@ -33,8 +33,8 @@ export type PlankContextValue = {
   onResize?: (id: string, size: number) => void;
   /** Callback to clear scroll-into-view state. */
   onScrollIntoView?: (id?: string) => void;
-  /** Callback to change the companion. */
-  onChangeCompanion?: (companion: string | null) => void;
+  /** Callback to update the companion. */
+  onUpdateCompanion?: (companion: string | null) => void;
 };
 
 export const [PlankProvider, usePlankContext] = createContext<PlankContextValue>(PLANK_NAME);

package/src/containers/Sidebar/ComplementarySidebar.tsx

@@ -84,13 +84,12 @@ export const ComplementarySidebar = ({ current }: ComplementarySidebarProps) =>
       ]}
     >
       {/* 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',
           )}
@@ -105,6 +104,7 @@ export const ComplementarySidebar = ({ current }: ComplementarySidebarProps) =>
                   iconOnly
                   tooltipSide='left'
                   data-value={getLinkedVariant(companion.id)}
+                  {...(companion.properties.joyride && { 'data-joyride': companion.properties.joyride })}
                   variant={
                     activeId === getLinkedVariant(companion.id)
                       ? state.complementarySidebarState === 'expanded'
@@ -119,14 +119,13 @@ export const ComplementarySidebar = ({ current }: ComplementarySidebarProps) =>
           </Tabs.Tablist>
           {!hoistStatusbar && (
             <div
-              role='none'
-              className='grid grid-cols-1 auto-rows-(--dx-rail-item) gap-0.5 overflow-y-auto'
+              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 role='none' className='hidden lg:grid grid-cols-1 auto-rows-(--dx-rail-action) p-1'>
+          <div className='hidden lg:grid grid-cols-1 auto-rows-(--dx-rail-action) p-1'>
             <ToggleComplementarySidebarButton />
           </div>
         </div>
@@ -139,7 +138,7 @@ 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 })}
             >
@@ -200,7 +199,7 @@ const ComplementarySidebarPanel = ({ companion, activeId, data, hoistStatusbar }
         />
       </Panel.Content>
       {!hoistStatusbar && (
-        <Panel.Statusbar classNames='px-1' size='sm'>
+        <Panel.Statusbar size='sm'>
           <Surface.Surface role='status-bar--r1-footer' limit={1} />
         </Panel.Statusbar>
       )}

package/src/containers/Sidebar/Sidebar.tsx

@@ -5,7 +5,7 @@
 import React, { useMemo } from 'react';
 
 import { Surface } from '@dxos/app-framework/ui';
-import { type AppSurface } from '@dxos/app-toolkit/ui';
+import { AppSurface } from '@dxos/app-toolkit/ui';
 import { type Label, Main } from '@dxos/react-ui';
 
 import { useBreakpoints, useDeckState, useHoistStatusbar } from '#hooks';
@@ -38,7 +38,7 @@ export const Sidebar = () => {
         hoistStatusbar && 'bottom-(--dx-statusbar-size)',
       ]}
     >
-      <Surface.Surface role='navigation' data={navigationData} limit={1} />
+      <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/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';
@@ -19,6 +19,7 @@ export type DeckCompanion = NodeType.Node<
     /** If true, the panel will not be wrapped in a scroll area. */
     fixed?: boolean;
     position?: Position;
+    joyride?: string;
   }
 >;
 

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

@@ -13,4 +13,5 @@ export const meta: Plugin.Meta = {
     Customize your workspace organization with drag-and-drop layout management.
   `,
   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, ChangeCompanion } 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);
@@ -73,7 +72,7 @@ const handler: Operation.WithHandler<typeof Adjust> = Adjust.pipe(
         );
 
         if (Option.isSome(companion)) {
-          yield* Operation.invoke(ChangeCompanion, { companion: companion.value.id });
+          yield* Operation.invoke(LayoutOperation.UpdateCompanion, { subject: companion.value.id });
         }
       }
     }),

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,14 +2,11 @@
 // 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'),
   () => import('./adjust'),
-  () => import('./change-companion'),
   () => import('./close'),
   () => import('./open'),
   () => import('./revert-workspace'),
@@ -18,6 +15,7 @@ export const DeckOperationHandlerSet = OperationHandlerSet.lazy(
   () => import('./set-layout-mode'),
   () => import('./show-undo'),
   () => import('./switch-workspace'),
+  () => import('./update-companion'),
   () => import('./update-complementary'),
   () => import('./update-dialog'),
   () => import('./update-plank-size'),

package/src/operations/open.ts

@@ -13,13 +13,13 @@ 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 { 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';
@@ -74,7 +74,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 +88,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 +103,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';

package/src/operations/show-undo.ts

@@ -6,7 +6,7 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability, UndoOperation } from '@dxos/app-framework';
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { meta } from '#meta';
 

package/src/operations/switch-workspace.ts

@@ -6,8 +6,8 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { AppCapabilities, isPinnedWorkspace, LayoutOperation } from '@dxos/app-toolkit';
+import { Operation } from '@dxos/compute';
 import { invariant } from '@dxos/invariant';
-import { Operation } from '@dxos/operation';
 import { Graph, Node } from '@dxos/plugin-graph';
 
 import { DeckCapabilities, defaultDeck } from '../types';