@dxos/plugin-deck 0.8.4-main.bc674ce → 0.8.4-main.bcb3aa67d6

package/src/capabilities/{settings/settings.ts → settings.ts}

@@ -4,22 +4,23 @@
 
 import * as Effect from 'effect/Effect';
 
-import { Capability, Common } from '@dxos/app-framework';
+import { Capability } from '@dxos/app-framework';
+import { AppCapabilities } from '@dxos/app-toolkit';
 import { createKvsStore } from '@dxos/effect';
 
-import { meta } from '../../meta';
-import { DeckCapabilities, DeckSettingsSchema } from '../../types';
+import { meta } from '#meta';
+import { DeckCapabilities, Settings } from '#types';
 
 export default Capability.makeModule(() =>
   Effect.sync(() => {
     const settingsAtom = createKvsStore({
       key: meta.id,
-      schema: DeckSettingsSchema,
+      schema: Settings.Settings,
       defaultValue: () => ({
         showHints: false,
         enableDeck: false,
         enableStatusbar: false,
-        enableNativeRedirect: false,
+        enableNativeRedirect: !import.meta.env.DEV,
         newPlankPositioning: 'start' as const,
         overscroll: 'none' as const,
         encapsulatedPlanks: false,
@@ -28,9 +29,9 @@ export default Capability.makeModule(() =>
 
     return [
       Capability.contributes(DeckCapabilities.Settings, settingsAtom),
-      Capability.contributes(Common.Capability.Settings, {
+      Capability.contributes(AppCapabilities.Settings, {
         prefix: meta.id,
-        schema: DeckSettingsSchema,
+        schema: Settings.Settings,
         atom: settingsAtom,
       }),
     ];

package/src/capabilities/{state/state.ts → state.ts}

@@ -5,22 +5,17 @@
 import { Atom } from '@effect-atom/atom-react';
 import * as Effect from 'effect/Effect';
 
-import { Capability, Common } from '@dxos/app-framework';
+import { Capabilities, Capability } from '@dxos/app-framework';
+import { AppCapabilities } from '@dxos/app-toolkit';
 import { createKvsStore } from '@dxos/effect';
 import { invariant } from '@dxos/invariant';
 
-import { meta } from '../../meta';
-import {
-  DeckCapabilities,
-  type DeckEphemeralStateProps,
-  type DeckStateProps,
-  DeckStateSchema,
-  defaultDeck,
-  getMode,
-} from '../../types';
+import { meta } from '#meta';
+import { DeckCapabilities, type EphemeralDeckState, StoredDeckState, defaultDeck, getMode } from '#types';
+import { sanitizePersistedState } from '../util';
 
 /** Default persisted state. */
-const defaultDeckState: DeckStateProps = {
+const defaultDeckState: StoredDeckState = {
   sidebarState: 'expanded',
   complementarySidebarState: 'collapsed',
   complementarySidebarPanel: undefined,
@@ -33,7 +28,7 @@ const defaultDeckState: DeckStateProps = {
 };
 
 /** Default ephemeral state. */
-const defaultDeckEphemeralState: DeckEphemeralStateProps = {
+const defaultDeckEphemeralState: EphemeralDeckState = {
   dialogContent: null,
   dialogOpen: false,
   dialogBlockAlign: undefined,
@@ -49,32 +44,23 @@ const defaultDeckEphemeralState: DeckEphemeralStateProps = {
 
 export default Capability.makeModule(
   Effect.fnUntraced(function* () {
-    const registry = yield* Capability.get(Common.Capability.AtomRegistry);
+    const registry = yield* Capability.get(Capabilities.AtomRegistry);
 
     // Persisted state using KVS store.
     const stateAtom = createKvsStore({
-      key: `${meta.id}/state`,
-      schema: DeckStateSchema,
+      key: `${meta.id}.state`,
+      schema: StoredDeckState,
       defaultValue: () => ({ ...defaultDeckState }),
     });
 
     // Ephemeral state (not persisted, but kept alive to prevent GC resets).
-    const ephemeralAtom = Atom.make<DeckEphemeralStateProps>({ ...defaultDeckEphemeralState }).pipe(Atom.keepAlive);
+    const ephemeralAtom = Atom.make<EphemeralDeckState>({ ...defaultDeckEphemeralState }).pipe(Atom.keepAlive);
 
-    // Don't allow fullscreen mode to be persisted to prevent getting stuck in it.
+    // Sanitize persisted state on startup (see sanitizePersistedState for details).
     const currentState = registry.get(stateAtom);
-    const currentDeck = currentState.decks[currentState.activeDeck];
-    if (currentDeck?.fullscreen) {
-      registry.set(stateAtom, {
-        ...currentState,
-        decks: {
-          ...currentState.decks,
-          [currentState.activeDeck]: {
-            ...currentDeck,
-            fullscreen: false,
-          },
-        },
-      });
+    const sanitizedState = sanitizePersistedState(currentState);
+    if (sanitizedState !== currentState) {
+      registry.set(stateAtom, sanitizedState);
     }
 
     // Create derived layout atom (read-only) from both state atoms.
@@ -92,13 +78,13 @@ export default Capability.makeModule(
         active: deck.solo ? [deck.solo] : deck.active,
         inactive: deck.inactive,
         scrollIntoView: ephemeral.scrollIntoView,
-      } satisfies Common.Capability.Layout;
+      } satisfies AppCapabilities.Layout;
     }).pipe(Atom.keepAlive);
 
     return [
       Capability.contributes(DeckCapabilities.State, stateAtom),
       Capability.contributes(DeckCapabilities.EphemeralState, ephemeralAtom),
-      Capability.contributes(Common.Capability.Layout, layoutAtom),
+      Capability.contributes(AppCapabilities.Layout, layoutAtom),
     ];
   }),
 );

package/src/capabilities/{tools/tools.ts → tools.ts}

@@ -19,15 +19,15 @@ import { type OperationInvoker } from '@dxos/app-framework/plugin-operation/invo
 import { invariant } from '@dxos/invariant';
 import { trim } from '@dxos/util';
 
-import { meta } from '../../meta';
-import { DeckOperation } from '../../types';
+import { meta } from '#meta';
+import { DeckOperation } from '#operations';
 
 // TODO(burdon): Factor out.
 declare global {
   interface ToolContextExtensions {
     dispatch?: PromiseIntentDispatcher;
     pivotId?: string;
-    part?: 'deck' | 'dialog';
+    part?: 'multi' | 'dialog';
   }
 }
 
@@ -58,9 +58,8 @@ export default Capability.makeModule(() =>
           invariant(pivotId, 'No pivot ID');
           invariant(invokePromise, 'No operation invoker');
 
-          if (part === 'deck') {
+          if (part === 'multi') {
             const { error } = await invokePromise(DeckOperation.ChangeCompanion, {
-              primary: pivotId,
               companion: id,
             });
             if (error) {

package/src/capabilities/url-handler.ts

@@ -0,0 +1,209 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+
+import { Capabilities, Capability } from '@dxos/app-framework';
+import {
+  AppCapabilities,
+  LayoutOperation,
+  NOT_FOUND_PATH,
+  fromUrlPath,
+  getWorkspaceFromPath,
+  toUrlPath,
+} from '@dxos/app-toolkit';
+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';
+
+import { shouldDeferNavigationHandlers } from './check-app-scheme';
+import { DeckCapabilities, type StoredDeckState, defaultDeck } from '#types';
+
+/** Dispatch all NavigationHandler contributions with a given URL. */
+const dispatchNavigationHandlers = Effect.fn(function* (url: URL) {
+  const handlers = yield* Capability.getAll(AppCapabilities.NavigationHandler);
+  yield* Effect.all(
+    handlers.map((handler) => handler(url)),
+    { concurrency: 'unbounded' },
+  );
+});
+
+export default Capability.makeModule(
+  Effect.fnUntraced(function* () {
+    const operationService = yield* Capability.get(Capabilities.OperationInvoker);
+    const capabilities = yield* Capability.Service;
+    const registry = yield* Capability.get(Capabilities.AtomRegistry);
+    const stateAtom = yield* Capability.get(DeckCapabilities.State);
+    const settingsAtom = yield* Capability.get(DeckCapabilities.Settings);
+
+    const provideServices = <A, E>(effect: Effect.Effect<A, E, Capability.Service | Operation.Service>) =>
+      effect.pipe(
+        Effect.provideService(Capability.Service, capabilities),
+        Effect.provideService(Operation.Service, operationService),
+      );
+
+    // Helper to get state.
+    const getState = () => registry.get(stateAtom);
+
+    // Helper to get computed deck from state.
+    const getDeck = () => {
+      const state = getState();
+      const deck = state.decks[state.activeDeck];
+      invariant(deck, `Deck not found: ${state.activeDeck}`);
+      return deck;
+    };
+
+    // Helper to update state.
+    const updateState = (fn: (current: StoredDeckState) => StoredDeckState) => {
+      registry.set(stateAtom, fn(getState()));
+    };
+
+    const handleNavigation = Effect.fn(function* (url?: URL) {
+      const resolvedUrl = url ?? new URL(window.location.href);
+      // When native redirect is active, check-app-scheme owns the initial dispatch
+      // to prevent one-time tokens from being consumed before the native app can use them.
+      const settings = registry.get(settingsAtom);
+      const deferHandlers = settings?.enableNativeRedirect && shouldDeferNavigationHandlers();
+      if (!deferHandlers) {
+        yield* dispatchNavigationHandlers(resolvedUrl);
+      }
+
+      const pathname = resolvedUrl.pathname;
+      const state = getState();
+      if (pathname === '/reset') {
+        updateState((s) => ({
+          ...s,
+          activeDeck: 'default',
+          decks: {
+            default: { ...defaultDeck },
+          },
+        }));
+        window.location.pathname = '/';
+        return;
+      }
+
+      const qualifiedId = fromUrlPath(pathname);
+      const workspace = getWorkspaceFromPath(qualifiedId);
+      if (workspace !== Node.RootId && workspace !== state.activeDeck) {
+        yield* Operation.invoke(LayoutOperation.SwitchWorkspace, { subject: workspace });
+      }
+
+      const deck = getDeck();
+      const activeId = qualifiedId !== workspace ? qualifiedId : undefined;
+      if (activeId) {
+        // Ensure the object referenced by the URL is open in the deck.
+        // Open validates the target and may redirect to 404, returning the resolved IDs.
+        const resolvedIds = yield* Operation.invoke(LayoutOperation.Open, { subject: [activeId] });
+        // If not already in solo mode, switch to solo for the resolved target.
+        if (!deck.solo) {
+          yield* Operation.invoke(LayoutOperation.SetLayoutMode, {
+            subject: resolvedIds?.[0] ?? activeId,
+            mode: 'solo',
+          });
+        }
+      } else if (deck.solo && deck.solo !== NOT_FOUND_PATH) {
+        // Stay in solo mode; redirect URL to reflect the current solo item.
+        // Do not switch to deck mode here — only explicit user action should change layout mode.
+        const path = toUrlPath(deck.solo);
+        if (window.location.pathname !== path) {
+          history.replaceState(null, '', `${path}${window.location.search}`);
+        }
+      }
+    });
+
+    const onPopState = () => void runAndForwardErrors(provideServices(handleNavigation()));
+
+    // Initial navigation.
+    yield* provideServices(handleNavigation());
+    window.addEventListener('popstate', onPopState);
+
+    // Tauri deep link support.
+    let unlistenDeepLink: (() => void) | undefined;
+    if (isTauri()) {
+      yield* Effect.gen(function* () {
+        const { getCurrent, onOpenUrl } = yield* Effect.promise(() => import('@tauri-apps/plugin-deep-link'));
+
+        const launchUrls = yield* Effect.promise(() => getCurrent());
+        if (launchUrls && launchUrls.length > 0) {
+          log('app launched with deep links', { urls: launchUrls });
+          for (const urlString of launchUrls) {
+            yield* provideServices(handleDeepLink(urlString, handleNavigation));
+          }
+        }
+
+        unlistenDeepLink = yield* Effect.promise(() =>
+          onOpenUrl((urls) => {
+            for (const urlString of urls) {
+              void runAndForwardErrors(provideServices(handleDeepLink(urlString, handleNavigation)));
+            }
+          }),
+        );
+      }).pipe(
+        Effect.catchAll((error) => Effect.sync(() => log.warn('failed to initialize deep link listener', { error }))),
+      );
+    }
+
+    // Sync URL with layout state changes.
+    let lastSolo: string | undefined;
+    let lastActiveDeck: string | undefined;
+    const unsubscribe = registry.subscribe(stateAtom, () => {
+      const state = getState();
+      const deck = getDeck();
+      const solo = deck.solo;
+      const activeDeck = state.activeDeck;
+
+      if (solo !== lastSolo || activeDeck !== lastActiveDeck) {
+        lastSolo = solo;
+        lastActiveDeck = activeDeck;
+
+        const path = solo && solo !== NOT_FOUND_PATH ? toUrlPath(solo) : toUrlPath(activeDeck);
+        if (window.location.pathname !== path) {
+          history.pushState(null, '', `${path}${window.location.search}`);
+        }
+      }
+    });
+
+    return Capability.contributes(Capabilities.Null, null, () =>
+      Effect.sync(() => {
+        window.removeEventListener('popstate', onPopState);
+        unsubscribe();
+        unlistenDeepLink?.();
+      }),
+    );
+  }),
+);
+
+/** Check if a path is a redirect path handled elsewhere (e.g., OAuth). */
+const isRedirectPath = (pathname: string): boolean => pathname.startsWith('/redirect/');
+
+/** Handle a deep link URL string. Merges query params into window.location and navigates. */
+const handleDeepLink = Effect.fn(function* (urlString: string, navigate: (url?: URL) => Effect.Effect<void, any, any>) {
+  log('deep link received', { url: urlString });
+
+  const deepLinkUrl = new URL(urlString);
+
+  // For custom schemes (e.g., composer://a/b/c), new URL() treats the first segment as the
+  // hostname. Reconstruct the full path from hostname + pathname.
+  const fullPath =
+    deepLinkUrl.protocol !== 'https:' && deepLinkUrl.protocol !== 'http:' && deepLinkUrl.hostname
+      ? '/' + deepLinkUrl.hostname + deepLinkUrl.pathname
+      : deepLinkUrl.pathname;
+
+  if (isRedirectPath(fullPath)) {
+    return;
+  }
+
+  // Merge deep link query params into the current window URL so handlers can read them.
+  const current = new URL(window.location.href);
+  if (deepLinkUrl.search) {
+    deepLinkUrl.searchParams.forEach((value, key) => current.searchParams.set(key, value));
+  }
+  current.pathname = fullPath;
+  history.replaceState(null, '', current.pathname + current.search);
+
+  yield* navigate(current);
+});

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

@@ -0,0 +1,40 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { type Meta, type StoryObj } from '@storybook/react-vite';
+
+import { withLayout, withTheme } from '@dxos/react-ui/testing';
+
+import { translations } from '../../translations';
+
+import { DeckSettings } from './DeckSettings';
+
+const meta = {
+  title: 'plugins/plugin-deck/components/DeckSettings',
+  tags: ['settings'],
+  component: DeckSettings,
+  decorators: [withTheme(), withLayout({ layout: 'fullscreen' })],
+  parameters: {
+    layout: 'fullscreen',
+    translations,
+  },
+} satisfies Meta<typeof DeckSettings>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    settings: {
+      enableDeck: true,
+      encapsulatedPlanks: false,
+      enableStatusbar: true,
+      showHints: true,
+      enableNativeRedirect: false,
+      newPlankPositioning: 'end',
+      overscroll: 'none',
+    },
+  },
+};

package/src/components/DeckSettings/DeckSettings.tsx

@@ -4,110 +4,120 @@
 
 import React from 'react';
 
+import { type SettingsSurfaceProps } from '@dxos/app-toolkit/ui';
 import { Input, Select, useTranslation } from '@dxos/react-ui';
-import { ControlGroup, ControlItemInput, ControlPage, ControlSection } from '@dxos/react-ui-form';
+import { Settings as SettingsForm } from '@dxos/react-ui-form';
 
-import { meta } from '../../meta';
-import {
-  type DeckSettingsProps,
-  type NewPlankPositioning,
-  NewPlankPositions,
-  type Overscroll,
-  OverscrollOptions,
-} from '../../types';
+import { meta } from '#meta';
+import { Settings } from '#types';
 
 const isSocket = !!(globalThis as any).__args;
 
-export type DeckSettingsComponentProps = {
-  settings: DeckSettingsProps;
-  onSettingsChange: (fn: (current: DeckSettingsProps) => DeckSettingsProps) => void;
-};
+export type DeckSettingsProps = SettingsSurfaceProps<Settings.Settings>;
 
-export const DeckSettings = ({ settings, onSettingsChange }: DeckSettingsComponentProps) => {
+export const DeckSettings = ({ settings, onSettingsChange }: DeckSettingsProps) => {
   const { t } = useTranslation(meta.id);
 
   return (
-    <ControlPage>
-      <ControlSection title={t('settings title', { ns: meta.id })}>
-        <ControlGroup>
-          <ControlItemInput title={t('settings enable deck label')}>
-            <Input.Switch
-              checked={settings.enableDeck}
-              onCheckedChange={(checked) => onSettingsChange((s) => ({ ...s, enableDeck: checked }))}
-            />
-          </ControlItemInput>
-          <ControlItemInput title={t('settings encapsulated planks label')}>
-            <Input.Switch
-              checked={settings.encapsulatedPlanks ?? false}
-              onCheckedChange={(checked) => onSettingsChange((s) => ({ ...s, encapsulatedPlanks: checked }))}
-            />
-          </ControlItemInput>
-          <ControlItemInput title={t('select new plank positioning label')}>
-            <Select.Root
-              disabled={!settings.enableDeck}
-              value={settings.newPlankPositioning ?? 'start'}
-              onValueChange={(value) =>
-                onSettingsChange((s) => ({ ...s, newPlankPositioning: value as NewPlankPositioning }))
-              }
-            >
-              <Select.TriggerButton placeholder={t('select new plank positioning placeholder')} />
-              <Select.Portal>
-                <Select.Content>
-                  <Select.Viewport>
-                    {NewPlankPositions.map((position) => (
-                      <Select.Option key={position} value={position}>
-                        {t(`settings new plank position ${position} label`)}
-                      </Select.Option>
-                    ))}
-                  </Select.Viewport>
-                  <Select.Arrow />
-                </Select.Content>
-              </Select.Portal>
-            </Select.Root>
-          </ControlItemInput>
-          <ControlItemInput title={t('settings overscroll label')}>
-            <Select.Root
-              disabled={!settings.enableDeck}
-              value={settings.overscroll ?? 'none'}
-              onValueChange={(value) => onSettingsChange((s) => ({ ...s, overscroll: value as Overscroll }))}
-            >
-              <Select.TriggerButton placeholder={t('select overscroll placeholder')} />
-              <Select.Portal>
-                <Select.Content>
-                  <Select.Viewport>
-                    {OverscrollOptions.map((option) => (
-                      <Select.Option key={option} value={option}>
-                        {t(`settings overscroll ${option} label`)}
-                      </Select.Option>
-                    ))}
-                  </Select.Viewport>
-                  <Select.Arrow />
-                </Select.Content>
-              </Select.Portal>
-            </Select.Root>
-          </ControlItemInput>
-          <ControlItemInput title={t('settings enable statusbar label')}>
-            <Input.Switch
-              checked={settings.enableStatusbar}
-              onCheckedChange={(checked) => onSettingsChange((s) => ({ ...s, enableStatusbar: checked }))}
+    <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('select-new-plank-positioning.label')}
+          description={t('select-new-plank-positioning.description')}
+        >
+          <Select.Root
+            disabled={!settings.enableDeck || !onSettingsChange}
+            value={settings.newPlankPositioning ?? 'start'}
+            onValueChange={(value) =>
+              onSettingsChange?.((s) => ({ ...s, newPlankPositioning: value as Settings.NewPlankPositioning }))
+            }
+          >
+            <Select.TriggerButton
+              disabled={!onSettingsChange}
+              placeholder={t('select-new-plank-positioning.placeholder')}
             />
-          </ControlItemInput>
-          <ControlItemInput title={t('settings show hints label')}>
+            <Select.Portal>
+              <Select.Content>
+                <Select.Viewport>
+                  {Settings.NewPlankPositions.map((position) => (
+                    <Select.Option key={position} value={position}>
+                      {t(`settings.new-plank-position.${position}.label`)}
+                    </Select.Option>
+                  ))}
+                </Select.Viewport>
+                <Select.Arrow />
+              </Select.Content>
+            </Select.Portal>
+          </Select.Root>
+        </SettingsForm.Item>
+        <SettingsForm.Item title={t('settings.overscroll.label')} description={t('settings.overscroll.description')}>
+          <Select.Root
+            disabled={!settings.enableDeck || !onSettingsChange}
+            value={settings.overscroll ?? 'none'}
+            onValueChange={(value) => onSettingsChange?.((s) => ({ ...s, overscroll: value as Settings.Overscroll }))}
+          >
+            <Select.TriggerButton placeholder={t('select-overscroll.placeholder')} />
+            <Select.Portal>
+              <Select.Content>
+                <Select.Viewport>
+                  {Settings.OverScrollToProps.map((option) => (
+                    <Select.Option key={option} value={option}>
+                      {t(`settings.overscroll.${option}.label`)}
+                    </Select.Option>
+                  ))}
+                </Select.Viewport>
+                <Select.Arrow />
+              </Select.Content>
+            </Select.Portal>
+          </Select.Root>
+        </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
-              checked={settings.showHints}
-              onCheckedChange={(checked) => onSettingsChange((s) => ({ ...s, showHints: checked }))}
+              disabled={!onSettingsChange}
+              checked={settings.enableNativeRedirect}
+              onCheckedChange={(checked) => onSettingsChange?.((s) => ({ ...s, enableNativeRedirect: checked }))}
             />
-          </ControlItemInput>
-          {!isSocket && (
-            <ControlItemInput title={t('settings native redirect label')}>
-              <Input.Switch
-                checked={settings.enableNativeRedirect}
-                onCheckedChange={(checked) => onSettingsChange((s) => ({ ...s, enableNativeRedirect: checked }))}
-              />
-            </ControlItemInput>
-          )}
-        </ControlGroup>
-      </ControlSection>
-    </ControlPage>
+          </SettingsForm.Item>
+        )}
+      </SettingsForm.Section>
+    </SettingsForm.Viewport>
   );
 };

package/src/components/DeckSettings/index.ts

@@ -1,5 +1,7 @@
 //
-// Copyright 2025 DXOS.org
+// Copyright 2024 DXOS.org
 //
 
-export * from './DeckSettings';
+import { DeckSettings } from './DeckSettings';
+
+export default DeckSettings;