@dxos/plugin-deck 0.8.4-main.422d1c7879 → 0.8.4-main.4f23b4e393

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-deck",
-  "version": "0.8.4-main.422d1c7879",
+  "version": "0.8.4-main.4f23b4e393",
   "description": "DXOS Surface plugin for the main application layout.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -13,31 +13,71 @@
   "sideEffects": true,
   "type": "module",
   "imports": {
-    "#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",
-    "#types": "./src/types/index.ts"
+    "#capabilities": {
+      "source": "./src/capabilities/index.ts",
+      "types": "./dist/types/src/capabilities/index.d.ts",
+      "default": "./dist/lib/neutral/capabilities/index.mjs"
+    },
+    "#components": {
+      "source": "./src/components/index.ts",
+      "types": "./dist/types/src/components/index.d.ts",
+      "default": "./dist/lib/neutral/components/index.mjs"
+    },
+    "#containers": {
+      "source": "./src/containers/index.ts",
+      "types": "./dist/types/src/containers/index.d.ts",
+      "default": "./dist/lib/neutral/containers/index.mjs"
+    },
+    "#hooks": {
+      "source": "./src/hooks/index.ts",
+      "types": "./dist/types/src/hooks/index.d.ts",
+      "default": "./dist/lib/neutral/hooks/index.mjs"
+    },
+    "#meta": {
+      "source": "./src/meta.ts",
+      "types": "./dist/types/src/meta.d.ts",
+      "default": "./dist/lib/neutral/meta.mjs"
+    },
+    "#operations": {
+      "source": "./src/operations/index.ts",
+      "types": "./dist/types/src/operations/index.d.ts",
+      "default": "./dist/lib/neutral/operations/index.mjs"
+    },
+    "#plugin": {
+      "source": {
+        "node": "./src/DeckPlugin.node.ts",
+        "default": "./src/DeckPlugin.ts"
+      },
+      "types": "./dist/types/src/DeckPlugin.d.ts",
+      "node": "./dist/lib/neutral/DeckPlugin.node.mjs",
+      "default": "./dist/lib/neutral/DeckPlugin.mjs"
+    },
+    "#translations": {
+      "source": "./src/translations.ts",
+      "types": "./dist/types/src/translations.d.ts",
+      "default": "./dist/lib/neutral/translations.mjs"
+    },
+    "#types": {
+      "source": "./src/types/index.ts",
+      "types": "./dist/types/src/types/index.d.ts",
+      "default": "./dist/lib/neutral/types/index.mjs"
+    }
   },
   "exports": {
     ".": {
       "source": "./src/index.ts",
       "types": "./dist/types/src/index.d.ts",
-      "browser": "./dist/lib/browser/index.mjs"
+      "default": "./dist/lib/neutral/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"
+    "./plugin": {
+      "source": "./src/plugin.ts",
+      "types": "./dist/types/src/plugin.d.ts",
+      "default": "./dist/lib/neutral/plugin.mjs"
     },
-    "./types": {
-      "source": "./src/types/index.ts",
-      "types": "./dist/types/src/types/index.d.ts",
-      "browser": "./dist/lib/browser/types/index.mjs",
-      "node": "./dist/lib/node-esm/types/index.mjs"
+    "./translations": {
+      "source": "./src/translations.ts",
+      "types": "./dist/types/src/translations.d.ts",
+      "default": "./dist/lib/neutral/translations.mjs"
     }
   },
   "types": "dist/types/src/index.d.ts",
@@ -54,38 +94,37 @@
     "@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.422d1c7879",
-    "@dxos/app-graph": "0.8.4-main.422d1c7879",
-    "@dxos/app-toolkit": "0.8.4-main.422d1c7879",
-    "@dxos/assistant": "0.8.4-main.422d1c7879",
-    "@dxos/async": "0.8.4-main.422d1c7879",
-    "@dxos/blueprints": "0.8.4-main.422d1c7879",
-    "@dxos/context": "0.8.4-main.422d1c7879",
-    "@dxos/debug": "0.8.4-main.422d1c7879",
-    "@dxos/effect": "0.8.4-main.422d1c7879",
-    "@dxos/echo": "0.8.4-main.422d1c7879",
-    "@dxos/errors": "0.8.4-main.422d1c7879",
-    "@dxos/invariant": "0.8.4-main.422d1c7879",
-    "@dxos/keyboard": "0.8.4-main.422d1c7879",
-    "@dxos/app-framework": "0.8.4-main.422d1c7879",
-    "@dxos/operation": "0.8.4-main.422d1c7879",
-    "@dxos/plugin-attention": "0.8.4-main.422d1c7879",
-    "@dxos/log": "0.8.4-main.422d1c7879",
-    "@dxos/plugin-graph": "0.8.4-main.422d1c7879",
-    "@dxos/plugin-client": "0.8.4-main.422d1c7879",
-    "@dxos/plugin-observability": "0.8.4-main.422d1c7879",
-    "@dxos/plugin-theme": "0.8.4-main.422d1c7879",
-    "@dxos/react-client": "0.8.4-main.422d1c7879",
-    "@dxos/react-error-boundary": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-attention": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-mosaic": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-form": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-menu": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-tabs": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-stack": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-text-tooltip": "0.8.4-main.422d1c7879",
-    "@dxos/ui-types": "0.8.4-main.422d1c7879",
-    "@dxos/util": "0.8.4-main.422d1c7879"
+    "@dxos/ai": "0.8.4-main.4f23b4e393",
+    "@dxos/app-graph": "0.8.4-main.4f23b4e393",
+    "@dxos/assistant": "0.8.4-main.4f23b4e393",
+    "@dxos/app-toolkit": "0.8.4-main.4f23b4e393",
+    "@dxos/app-framework": "0.8.4-main.4f23b4e393",
+    "@dxos/async": "0.8.4-main.4f23b4e393",
+    "@dxos/context": "0.8.4-main.4f23b4e393",
+    "@dxos/compute": "0.8.4-main.4f23b4e393",
+    "@dxos/debug": "0.8.4-main.4f23b4e393",
+    "@dxos/echo": "0.8.4-main.4f23b4e393",
+    "@dxos/effect": "0.8.4-main.4f23b4e393",
+    "@dxos/errors": "0.8.4-main.4f23b4e393",
+    "@dxos/invariant": "0.8.4-main.4f23b4e393",
+    "@dxos/keyboard": "0.8.4-main.4f23b4e393",
+    "@dxos/log": "0.8.4-main.4f23b4e393",
+    "@dxos/plugin-attention": "0.8.4-main.4f23b4e393",
+    "@dxos/plugin-client": "0.8.4-main.4f23b4e393",
+    "@dxos/plugin-graph": "0.8.4-main.4f23b4e393",
+    "@dxos/plugin-observability": "0.8.4-main.4f23b4e393",
+    "@dxos/plugin-theme": "0.8.4-main.4f23b4e393",
+    "@dxos/react-client": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-form": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-menu": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-mosaic": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-stack": "0.8.4-main.4f23b4e393",
+    "@dxos/react-error-boundary": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-tabs": "0.8.4-main.4f23b4e393",
+    "@dxos/ui-types": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-text-tooltip": "0.8.4-main.4f23b4e393",
+    "@dxos/util": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-attention": "0.8.4-main.4f23b4e393"
   },
   "devDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
@@ -95,16 +134,16 @@
     "effect": "3.20.0",
     "react": "~19.2.3",
     "react-dom": "~19.2.3",
-    "vite": "^7.1.11",
-    "@dxos/plugin-testing": "0.8.4-main.422d1c7879",
-    "@dxos/react-hooks": "0.8.4-main.422d1c7879",
-    "@dxos/random": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui-syntax-highlighter": "0.8.4-main.422d1c7879",
-    "@dxos/react-ui": "0.8.4-main.422d1c7879",
-    "@dxos/schema": "0.8.4-main.422d1c7879",
-    "@dxos/storybook-utils": "0.8.4-main.422d1c7879",
-    "@dxos/types": "0.8.4-main.422d1c7879",
-    "@dxos/ui-theme": "0.8.4-main.422d1c7879"
+    "vite": "^8.0.10",
+    "@dxos/plugin-testing": "0.8.4-main.4f23b4e393",
+    "@dxos/random": "0.8.4-main.4f23b4e393",
+    "@dxos/react-hooks": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui": "0.8.4-main.4f23b4e393",
+    "@dxos/react-ui-syntax-highlighter": "0.8.4-main.4f23b4e393",
+    "@dxos/schema": "0.8.4-main.4f23b4e393",
+    "@dxos/types": "0.8.4-main.4f23b4e393",
+    "@dxos/ui-theme": "0.8.4-main.4f23b4e393",
+    "@dxos/storybook-utils": "0.8.4-main.4f23b4e393"
   },
   "peerDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
@@ -112,10 +151,7 @@
     "effect": "3.20.0",
     "react": "~19.2.3",
     "react-dom": "~19.2.3",
-    "@dxos/react-ui": "0.8.4-main.422d1c7879",
-    "@dxos/ui-theme": "0.8.4-main.422d1c7879"
-  },
-  "publishConfig": {
-    "access": "public"
+    "@dxos/react-ui": "0.8.4-main.4f23b4e393",
+    "@dxos/ui-theme": "0.8.4-main.4f23b4e393"
   }
 }

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,7 +6,7 @@ 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,
@@ -19,10 +19,9 @@ import {
   UrlHandler,
 } from '#capabilities';
 import { meta } from '#meta';
+import { translations } from '#translations';
 import { DeckEvents } from '#types';
 
-import { translations } from './translations';
-
 // 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.
 // TODO(Zan): Move this to a more global location if we use immer more broadly.
@@ -64,3 +63,5 @@ export const DeckPlugin = Plugin.define(meta).pipe(
   }),
   Plugin.make,
 );
+
+export default DeckPlugin;

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

@@ -6,8 +6,8 @@ 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/operation';
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
+import { Operation } from '@dxos/compute';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
 import { GraphBuilder, NodeMatcher } from '@dxos/plugin-graph';
 
 import { meta } from '#meta';
@@ -112,7 +112,7 @@ export default Capability.makeModule(
                   macos: "meta+'",
                 },
                 disposition: 'pin-end',
-                position: 'hoist',
+                position: 'fallback',
                 l0Breakpoint: 'lg',
               },
             };

package/src/capabilities/index.ts

@@ -3,7 +3,7 @@
 //
 
 import { Capability } from '@dxos/app-framework';
-import { OperationHandlerSet } from '@dxos/operation';
+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'));

package/src/capabilities/operation-handler.ts

@@ -5,7 +5,7 @@
 import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
-import type { OperationHandlerSet } from '@dxos/operation';
+import type { OperationHandlerSet } from '@dxos/compute';
 
 import { DeckOperationHandlerSet } from '#operations';
 

package/src/capabilities/settings.ts

@@ -20,7 +20,7 @@ export default Capability.makeModule(() =>
         showHints: false,
         enableDeck: false,
         enableStatusbar: false,
-        enableNativeRedirect: !import.meta.env.DEV,
+        enableNativeRedirect: false,
         encapsulatedPlanks: false,
       }),
     });

package/src/capabilities/url-handler.ts

@@ -14,10 +14,10 @@ import {
   getWorkspaceFromPath,
   toUrlPath,
 } from '@dxos/app-toolkit';
+import { Operation } from '@dxos/compute';
 import { runAndForwardErrors } from '@dxos/effect';
 import { invariant } from '@dxos/invariant';
 import { log } from '@dxos/log';
-import { Operation } from '@dxos/operation';
 import { Node } from '@dxos/plugin-graph';
 import { isTauri } from '@dxos/util';
 

package/src/components/DeckSettings/DeckSettings.stories.tsx

@@ -6,7 +6,8 @@ import { type Meta, type StoryObj } from '@storybook/react-vite';
 
 import { withLayout, withTheme } from '@dxos/react-ui/testing';
 
-import { translations } from '../../translations';
+import { translations } from '#translations';
+
 import { DeckSettings } from './DeckSettings';
 
 const meta = {

package/src/components/DeckSettings/DeckSettings.tsx

@@ -5,7 +5,7 @@
 import React from 'react';
 
 import { type AppSurface } from '@dxos/app-toolkit/ui';
-import { Input, useTranslation } from '@dxos/react-ui';
+import { useTranslation } from '@dxos/react-ui';
 import { Settings as SettingsForm } from '@dxos/react-ui-form';
 
 import { meta } from '#meta';
@@ -21,52 +21,13 @@ export const DeckSettings = ({ settings, onSettingsChange }: DeckSettingsProps)
   return (
     <SettingsForm.Viewport>
       <SettingsForm.Section title={t('settings.title', { ns: meta.id })}>
-        <SettingsForm.Item title={t('settings.enable-deck.label')} description={t('settings.enable-deck.description')}>
-          <Input.Switch
-            disabled={!onSettingsChange}
-            checked={settings.enableDeck}
-            onCheckedChange={(checked) => onSettingsChange?.((s) => ({ ...s, enableDeck: checked }))}
-          />
-        </SettingsForm.Item>
-        <SettingsForm.Item
-          title={t('settings.encapsulated-planks.label')}
-          description={t('settings.encapsulated-planks.description')}
-        >
-          <Input.Switch
-            disabled={!onSettingsChange}
-            checked={settings.encapsulatedPlanks ?? false}
-            onCheckedChange={(checked) => onSettingsChange?.((s) => ({ ...s, encapsulatedPlanks: checked }))}
-          />
-        </SettingsForm.Item>
-        <SettingsForm.Item
-          title={t('settings.enable-statusbar.label')}
-          description={t('settings.enable-statusbar.description')}
-        >
-          <Input.Switch
-            disabled={!onSettingsChange}
-            checked={settings.enableStatusbar}
-            onCheckedChange={(checked) => onSettingsChange?.((s) => ({ ...s, enableStatusbar: checked }))}
-          />
-        </SettingsForm.Item>
-        <SettingsForm.Item title={t('settings.show-hints.label')} description={t('settings.show-hints.description')}>
-          <Input.Switch
-            disabled={!onSettingsChange}
-            checked={settings.showHints}
-            onCheckedChange={(checked) => onSettingsChange?.((s) => ({ ...s, showHints: checked }))}
-          />
-        </SettingsForm.Item>
-        {!isSocket && (
-          <SettingsForm.Item
-            title={t('settings.native-redirect.label')}
-            description={t('settings.native-redirect.description')}
-          >
-            <Input.Switch
-              disabled={!onSettingsChange}
-              checked={settings.enableNativeRedirect}
-              onCheckedChange={(checked) => onSettingsChange?.((s) => ({ ...s, enableNativeRedirect: checked }))}
-            />
-          </SettingsForm.Item>
-        )}
+        <SettingsForm.FieldSet
+          readonly={!onSettingsChange}
+          schema={Settings.Settings}
+          visible={(path) => path !== 'enableNativeRedirect' || !isSocket}
+          values={settings}
+          onValuesChanged={(values) => onSettingsChange?.(() => values)}
+        />
       </SettingsForm.Section>
     </SettingsForm.Viewport>
   );

package/src/components/Matrix/Matrix.stories.tsx

@@ -25,9 +25,9 @@ import { Organization, Person } from '@dxos/types';
 
 import { DeckState, OperationHandler } from '#capabilities';
 import { meta as pluginMeta } from '#meta';
+import { translations } from '#translations';
 
 import { Plank } from '../../containers/Plank';
-import { translations } from '../../translations';
 import { Matrix, type MatrixController, type MatrixRootProps } from './Matrix';
 
 random.seed(123);

package/src/containers/Deck/Banner.tsx

@@ -27,8 +27,8 @@ export const Banner = ({ variant, classNames }: ThemedClassName<{ variant?: 'top
       {variant === 'sidebar' ? <CloseSidebarButton /> : <ToggleSidebarButton />}
       <span className='self-center grow ms-1'>{t('current-app.name', { ns: osTranslations })}</span>
       {variant === 'topbar' && (
-        <div role='none' className='absolute inset-0 pointer-events-none'>
-          <div role='none' className='grid h-full pointer-fine:p-1 max-w-md mx-auto pointer-events-auto'>
+        <div className='absolute inset-0 pointer-events-none'>
+          <div className='grid h-full pointer-fine:p-1 max-w-md mx-auto pointer-events-auto'>
             <Surface.Surface role='search-input' limit={1} />
           </div>
         </div>

package/src/containers/Deck/Deck.stories.tsx

@@ -14,9 +14,9 @@ import { corePlugins } from '@dxos/plugin-testing';
 import { DeckSettings, DeckState } from '#capabilities';
 import { useDeckState } from '#hooks';
 import { meta as pluginMeta } from '#meta';
+import { translations } from '#translations';
 import { DeckCapabilities, getMode } from '#types';
 
-import { translations } from '../../translations';
 import { Deck } from './Deck';
 
 const TestPlugin = Plugin.define(pluginMeta).pipe(

package/src/containers/Deck/DeckContent.tsx

@@ -4,7 +4,7 @@
 
 import React, { type PropsWithChildren, useCallback, useEffect, useRef } from 'react';
 
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
 import { Main, useMediaQuery } from '@dxos/react-ui';
 
 import { useBreakpoints, useHoistStatusbar } from '#hooks';

package/src/containers/Deck/DeckViewport.tsx

@@ -25,7 +25,7 @@ import { hoverableControls, hoverableFocusedWithinControls, mainPaddingTransitio
 
 import { useBreakpoints, useCompanions, useDeckState, useHoistStatusbar, useSelectedCompanion } from '#hooks';
 import { meta } from '#meta';
-import { DeckOperation } from '#operations';
+import { DeckOperation } from '#types';
 import { getMode } from '#types';
 
 import { layoutAppliesTopbar } from '../../util';
@@ -105,11 +105,7 @@ export const DeckContentEmpty = () => {
   const layoutMode = getMode(deck);
   const topbar = layoutAppliesTopbar(breakpoint, layoutMode);
   return (
-    <div
-      role='none'
-      className='grid place-items-center p-8 relative bg-deck-surface'
-      data-testid='layoutPlugin.firstRunMessage'
-    >
+    <div className='grid place-items-center p-8 relative bg-deck-surface' data-testid='layoutPlugin.firstRunMessage'>
       <Surface.Surface role='keyshortcuts' />
       {!topbar && <ToggleSidebarButton />}
     </div>
@@ -149,7 +145,7 @@ export const DeckSoloMode = () => {
   }, [fullscreen, onLayoutChange]);
 
   return (
-    <div role='none' className='relative overflow-hidden bg-deck-surface'>
+    <div className='relative overflow-hidden bg-deck-surface'>
       <DeckSidebarToggles topbar={topbar} fullscreen={fullscreen} />
       {fullscreen && <ExitFullscreenButton onExit={() => onLayoutChange({ mode: 'solo--fullscreen' })} />}
       <StackContext.Provider
@@ -233,7 +229,7 @@ export const DeckMultiMode = () => {
   }, [active, lastPlankCompanions.length]);
 
   return (
-    <div role='none' className='relative bg-deck-surface overflow-hidden'>
+    <div className='relative bg-deck-surface overflow-hidden'>
       <DeckSidebarToggles topbar={topbar} fullscreen={fullscreen} />
       <Stack
         classNames={[
@@ -281,7 +277,6 @@ const ExitFullscreenButton = ({ onExit }: { onExit: () => void }) => {
   const { t } = useTranslation(meta.id);
   return (
     <div
-      role='none'
       className={mx(
         'fixed top-2 right-2 z-[1]',
         hoverableControls,

package/src/containers/DeckLayout/ActiveNode.tsx

@@ -19,7 +19,7 @@ export const ActiveNode = () => {
   useNodeActionExpander(activeNode);
 
   return (
-    <div role='none' className='sr-only'>
+    <div className='sr-only'>
       {/* TODO(wittjosiah): Weird that this is a surface, feel like it's not really render logic.
             Probably this lives in React-land currently in order to access translations? */}
       <Surface.Surface

package/src/containers/DeckLayout/DeckLayout.stories.tsx

@@ -24,6 +24,7 @@ import { Loading, withLayout } from '@dxos/react-ui/testing';
 
 import { OperationHandler } from '#capabilities';
 import { meta as pluginMeta } from '#meta';
+import { translations } from '#translations';
 import {
   DeckCapabilities,
   type EphemeralDeckState,
@@ -34,7 +35,6 @@ import {
   PLANK_COMPANION_TYPE,
 } from '#types';
 
-import { translations } from '../../translations';
 import { DeckLayout } from './DeckLayout';
 
 random.seed(1234);
@@ -285,7 +285,7 @@ const NavContainer = forwardRef<HTMLDivElement, NavContainerProps>((_props, forw
         {items.map((node) => (
           <ListItem.Root
             key={node.id}
-            classNames={activeSet.has(node.id) ? 'bg-active-surface' : undefined}
+            classNames={activeSet.has(node.id) ? 'bg-current-surface' : undefined}
             onClick={() => void invokePromise(LayoutOperation.Set, { subject: [node.id] })}
           >
             {node.properties.icon && (

package/src/containers/DeckLayout/Fallback.tsx

@@ -12,7 +12,7 @@ const Fallback = () => {
   const { t } = useTranslation(meta.id);
 
   return (
-    <div role='none' className='min-h-screen w-full flex items-center justify-center p-8'>
+    <div className='min-h-screen w-full flex items-center justify-center p-8'>
       <p
         role='alert'
         className='flex items-center justify-center p-8 font-normal text-lg text-error-text border border-rose-fill rounded-md'

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(
@@ -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/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';
@@ -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';