@dxos/plugin-markdown 0.9.0 → 0.9.1-main.c7dcc2e112

package/dx.config.ts

@@ -0,0 +1,31 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { Config2 } from '@dxos/app-framework/config';
+import { trim } from '@dxos/util';
+
+export default Config2.make({
+  plugin: {
+    key: 'org.dxos.plugin.markdown',
+    name: 'Markdown',
+    author: 'DXOS',
+    description: trim`
+      A full-featured markdown editor for authoring documents in your space. Edits flow through a collaborative CodeMirror surface backed by ECHO Text, so every keystroke replicates to other peers in real time without merge conflicts or lost work.
+
+      Documents can be opened in source, preview, or read-only mode and rendered as a full-surface article or as embeddable cards. An optional formatting toolbar exposes headings, lists, links, and other common markdown actions, and dispositional toolbar actions contributed by other plugins are surfaced inline alongside it.
+
+      The editor integrates with the rest of the workspace through @ references that link to any ECHO object, image and file uploads stored in the active space, and anchored comment threads on text ranges. Comments can optionally be routed to an AI agent on every message or only on @mention.
+
+      A built-in blueprint exposes create, open, and update operations as tools for AI agents. Updates are applied as compact find-and-replace diffs against the document, making it safe for agents to edit large documents incrementally while you continue collaborating.
+    `,
+    source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-markdown',
+    icon: { key: 'ph--text-aa--regular', hue: 'indigo' },
+    screenshots: [
+      {
+        dark: 'https://customer-5rxcjpyab08avpmn.cloudflarestream.com/cdf2656365bb1fd327c1fc2105d75e5a/iframe?poster=https%3A%2F%2Fcustomer-5rxcjpyab08avpmn.cloudflarestream.com%2Fcdf2656365bb1fd327c1fc2105d75e5a%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600',
+      },
+      { dark: 'https://dxos.network/plugin-details-markdown-dark.png' },
+    ],
+  },
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-markdown",
-  "version": "0.9.0",
+  "version": "0.9.1-main.c7dcc2e112",
   "description": "DXOS Surface plugin for interacting with Markdown",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -114,6 +114,7 @@
   "types": "dist/types/src/index.d.ts",
   "files": [
     "dist",
+    "dx.config.ts",
     "src"
   ],
   "dependencies": {
@@ -125,36 +126,36 @@
     "@effect/experimental": "0.60.0",
     "@radix-ui/react-context": "1.1.1",
     "react-dropzone": "^14.2.3",
-    "@dxos/ai": "0.9.0",
-    "@dxos/app-framework": "0.9.0",
-    "@dxos/assistant": "0.9.0",
-    "@dxos/app-toolkit": "0.9.0",
-    "@dxos/client": "0.9.0",
-    "@dxos/async": "0.9.0",
-    "@dxos/client-protocol": "0.9.0",
-    "@dxos/compute": "0.9.0",
-    "@dxos/echo": "0.9.0",
-    "@dxos/echo-client": "0.9.0",
-    "@dxos/invariant": "0.9.0",
-    "@dxos/functions-runtime": "0.9.0",
-    "@dxos/keys": "0.9.0",
-    "@dxos/effect": "0.9.0",
-    "@dxos/log": "0.9.0",
-    "@dxos/plugin-client": "0.9.0",
-    "@dxos/plugin-attention": "0.9.0",
-    "@dxos/plugin-graph": "0.9.0",
-    "@dxos/plugin-preview": "0.9.0",
-    "@dxos/plugin-space": "0.9.0",
-    "@dxos/react-ui-attention": "0.9.0",
-    "@dxos/react-client": "0.9.0",
-    "@dxos/react-ui-form": "0.9.0",
-    "@dxos/react-ui-editor": "0.9.0",
-    "@dxos/react-ui-mosaic": "0.9.0",
-    "@dxos/types": "0.9.0",
-    "@dxos/schema": "0.9.0",
-    "@dxos/ui-editor": "0.9.0",
-    "@dxos/ui": "0.9.0",
-    "@dxos/util": "0.9.0"
+    "@dxos/ai": "0.9.1-main.c7dcc2e112",
+    "@dxos/app-toolkit": "0.9.1-main.c7dcc2e112",
+    "@dxos/app-framework": "0.9.1-main.c7dcc2e112",
+    "@dxos/async": "0.9.1-main.c7dcc2e112",
+    "@dxos/client-protocol": "0.9.1-main.c7dcc2e112",
+    "@dxos/client": "0.9.1-main.c7dcc2e112",
+    "@dxos/assistant": "0.9.1-main.c7dcc2e112",
+    "@dxos/compute": "0.9.1-main.c7dcc2e112",
+    "@dxos/echo-client": "0.9.1-main.c7dcc2e112",
+    "@dxos/echo": "0.9.1-main.c7dcc2e112",
+    "@dxos/functions-runtime": "0.9.1-main.c7dcc2e112",
+    "@dxos/invariant": "0.9.1-main.c7dcc2e112",
+    "@dxos/keys": "0.9.1-main.c7dcc2e112",
+    "@dxos/plugin-client": "0.9.1-main.c7dcc2e112",
+    "@dxos/effect": "0.9.1-main.c7dcc2e112",
+    "@dxos/plugin-attention": "0.9.1-main.c7dcc2e112",
+    "@dxos/plugin-preview": "0.9.1-main.c7dcc2e112",
+    "@dxos/plugin-space": "0.9.1-main.c7dcc2e112",
+    "@dxos/plugin-graph": "0.9.1-main.c7dcc2e112",
+    "@dxos/react-client": "0.9.1-main.c7dcc2e112",
+    "@dxos/react-ui-attention": "0.9.1-main.c7dcc2e112",
+    "@dxos/react-ui-editor": "0.9.1-main.c7dcc2e112",
+    "@dxos/react-ui-mosaic": "0.9.1-main.c7dcc2e112",
+    "@dxos/react-ui-form": "0.9.1-main.c7dcc2e112",
+    "@dxos/schema": "0.9.1-main.c7dcc2e112",
+    "@dxos/types": "0.9.1-main.c7dcc2e112",
+    "@dxos/ui-editor": "0.9.1-main.c7dcc2e112",
+    "@dxos/ui": "0.9.1-main.c7dcc2e112",
+    "@dxos/util": "0.9.1-main.c7dcc2e112",
+    "@dxos/log": "0.9.1-main.c7dcc2e112"
   },
   "devDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
@@ -165,13 +166,13 @@
     "react": "~19.2.3",
     "react-dom": "~19.2.3",
     "vite": "^8.0.16",
-    "@dxos/debug": "0.9.0",
-    "@dxos/plugin-theme": "0.9.0",
-    "@dxos/plugin-testing": "0.9.0",
-    "@dxos/react-ui": "0.9.0",
-    "@dxos/random": "0.9.0",
-    "@dxos/ui-theme": "0.9.0",
-    "@dxos/storybook-utils": "0.9.0"
+    "@dxos/debug": "0.9.1-main.c7dcc2e112",
+    "@dxos/plugin-testing": "0.9.1-main.c7dcc2e112",
+    "@dxos/plugin-theme": "0.9.1-main.c7dcc2e112",
+    "@dxos/react-ui": "0.9.1-main.c7dcc2e112",
+    "@dxos/ui-theme": "0.9.1-main.c7dcc2e112",
+    "@dxos/random": "0.9.1-main.c7dcc2e112",
+    "@dxos/storybook-utils": "0.9.1-main.c7dcc2e112"
   },
   "peerDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
@@ -179,8 +180,8 @@
     "effect": "3.21.3",
     "react": "~19.2.3",
     "react-dom": "~19.2.3",
-    "@dxos/react-ui": "0.9.0",
-    "@dxos/ui-theme": "0.9.0"
+    "@dxos/ui-theme": "0.9.1-main.c7dcc2e112",
+    "@dxos/react-ui": "0.9.1-main.c7dcc2e112"
   },
   "publishConfig": {
     "access": "public"

package/src/MarkdownPlugin.test.ts

@@ -11,7 +11,7 @@ import { MarkdownPlugin } from '#plugin';
 
 import { meta } from './meta';
 
-const moduleId = (name: string) => `${meta.id}.module.${name}`;
+const moduleId = (name: string) => `${meta.profile.key}.module.${name}`;
 
 describe('MarkdownPlugin', () => {
   test('modules activate on the expected events', async ({ expect }) => {

package/src/MarkdownPlugin.tsx

@@ -2,8 +2,9 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Plugin } from '@dxos/app-framework';
+import { ActivationEvent, Plugin } from '@dxos/app-framework';
 import { AppActivationEvents, AppPlugin } from '@dxos/app-toolkit';
+import { AttentionEvents } from '@dxos/plugin-attention';
 import { translations as editorTranslations } from '@dxos/react-ui-editor/translations';
 import { Text } from '@dxos/schema';
 
@@ -11,7 +12,6 @@ import {
   AnchorSort,
   AppGraphBuilder,
   NavigationResolver,
-  AppGraphSerializer,
   BlueprintDefinition,
   CommentConfig,
   CreateObject,
@@ -43,16 +43,11 @@ export const MarkdownPlugin = Plugin.define(meta).pipe(
   }),
   Plugin.addModule({
     id: 'state',
-    // TODO(wittjosiah): Does not integrate with settings store.
-    //   Should this be a different event?
-    //   Should settings store be renamed to be more generic?
-    activatesOn: AppActivationEvents.SetupSettings,
+    // Wait for AttentionEvents.AttentionReady so ViewStateManager is available when the module
+    // resolves AttentionCapabilities.ViewState to build the editor state store.
+    activatesOn: ActivationEvent.allOf(AppActivationEvents.SetupSettings, AttentionEvents.AttentionReady),
     activate: MarkdownState,
   }),
-  Plugin.addModule({
-    activatesOn: AppActivationEvents.AppGraphReady,
-    activate: AppGraphSerializer,
-  }),
   Plugin.addModule({
     // TODO(wittjosiah): More relevant event?
     activatesOn: AppActivationEvents.AppGraphReady,

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

@@ -6,7 +6,7 @@ import * as Effect from 'effect/Effect';
 import * as Option from 'effect/Option';
 
 import { Capability } from '@dxos/app-framework';
-import { AppCapabilities, LayoutOperation, createTypeSectionExtension } from '@dxos/app-toolkit';
+import { AppCapabilities, LayoutOperation } from '@dxos/app-toolkit';
 import { isSpace } from '@dxos/client/echo';
 import { Operation } from '@dxos/compute';
 import { Type } from '@dxos/echo';
@@ -22,8 +22,6 @@ const documentTypename = Type.getTypename(Markdown.Document);
 export default Capability.makeModule(
   Effect.fnUntraced(function* () {
     const extensions = yield* Effect.all([
-      createTypeSectionExtension(Markdown.Document),
-
       GraphBuilder.createExtension({
         id: 'documentsSectionActions',
         match: (node) => {

package/src/capabilities/editor-view-state.ts

@@ -0,0 +1,28 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import { invariant } from '@dxos/invariant';
+import { type ViewStateManager, defineViewState } from '@dxos/react-ui-attention';
+import { type EditorStateStore, EditorSelectionStateSchema } from '@dxos/ui-editor';
+
+/** Per-document editor scroll/caret state, persisted to localStorage on this device. */
+export const editorViewStateAspect = defineViewState({
+  key: 'editor',
+  backend: 'local',
+  schema: EditorSelectionStateSchema,
+  defaultValue: () => ({}),
+});
+
+/** Adapts the imperative editor store seam onto the ViewState manager (local backend). */
+export const createEditorViewStateStore = (manager: ViewStateManager): EditorStateStore => ({
+  getState: (id) => {
+    // Guard against an unset document id, which would key state under a literal "undefined".
+    invariant(id);
+    return manager.get(editorViewStateAspect, id);
+  },
+  setState: (id, state) => {
+    invariant(id);
+    manager.set(editorViewStateAspect, id, state);
+  },
+});

package/src/capabilities/index.ts

@@ -3,26 +3,14 @@
 //
 
 import { Capability } from '@dxos/app-framework';
-import { type AppCapabilities } from '@dxos/app-toolkit';
 import type { OperationHandlerSet } from '@dxos/compute';
 
 export const AppGraphBuilder = Capability.lazy('AppGraphBuilder', () => import('./app-graph-builder'));
 export const NavigationResolver = Capability.lazy('NavigationResolver', () => import('./navigation-resolver'));
 export const AnchorSort = Capability.lazy('AnchorSort', () => import('./anchor-sort'));
-export const AppGraphSerializer = Capability.lazy('AppGraphSerializer', () => import('./app-graph-serializer'));
-// The contributed capability type references Operation types from @dxos/compute, so the lazy
-// wrapper needs an explicit annotation to keep the inferred type portable (TS2883).
-export const CommentConfig: Capability.LazyCapability<
-  void,
-  Capability.Capability<typeof AppCapabilities.CommentConfig>
-> = Capability.lazy('CommentConfig', () => import('./comment-config'));
+export const CommentConfig = Capability.lazy('CommentConfig', () => import('./comment-config'));
 export const CreateObject = Capability.lazy('CreateObject', () => import('./create-object'));
-// The contributed capability type references Blueprint types from @dxos/compute, so the lazy
-// wrapper needs an explicit annotation to keep the inferred type portable (TS2883).
-export const BlueprintDefinition: Capability.LazyCapability<
-  void,
-  Capability.Capability<typeof AppCapabilities.BlueprintDefinition>[]
-> = Capability.lazy('BlueprintDefinition', () => import('./blueprint-definition'));
+export const BlueprintDefinition = Capability.lazy('BlueprintDefinition', () => import('./blueprint-definition'));
 export const OperationHandler = Capability.lazy<OperationHandlerSet.OperationHandlerSet>(
   'OperationHandler',
   () => import('./operation-handler'),

package/src/capabilities/navigation-resolver.ts

@@ -5,7 +5,7 @@
 import * as Effect from 'effect/Effect';
 
 import { Capability } from '@dxos/app-framework';
-import { AppCapabilities, createTypeSectionPathResolver } from '@dxos/app-toolkit';
+import { AppCapabilities, TypeSection } from '@dxos/app-toolkit';
 
 import { Markdown } from '#types';
 
@@ -13,7 +13,7 @@ export default Capability.makeModule(
   Effect.fnUntraced(function* () {
     return Capability.contributes(
       AppCapabilities.NavigationPathResolver,
-      createTypeSectionPathResolver(Markdown.Document),
+      TypeSection.createTypeSectionPathResolver(Markdown.Document),
     );
   }),
 );

package/src/capabilities/react-surface.tsx

@@ -31,9 +31,11 @@ export default Capability.makeModule(() =>
       Surface.create({
         id: 'surface.document',
         // TODO(wittjosiah): Split into multiple surfaces if this filter proves too strict for non-article roles.
-        role: ['article', 'section', 'tabpanel'],
-        filter: (data): data is { subject: Markdown.Document; attendableId: string; variant: undefined } =>
-          typeof data.attendableId === 'string' && Obj.instanceOf(Markdown.Document, data.subject) && !data.variant,
+        filter: AppSurface.oneOf(
+          AppSurface.object(AppSurface.Article, Markdown.Document, (data) => !data.variant),
+          AppSurface.object(AppSurface.Section, Markdown.Document),
+          AppSurface.object(AppSurface.Tabpanel, Markdown.Document, (data) => !data.variant),
+        ),
         component: ({ data, role, ref }) => {
           return (
             <Container
@@ -41,7 +43,7 @@ export default Capability.makeModule(() =>
               attendableId={data.attendableId}
               subject={data.subject}
               role={role}
-              ref={ref}
+              ref={ref as React.Ref<HTMLDivElement>}
             />
           );
         },
@@ -62,14 +64,14 @@ export default Capability.makeModule(() =>
               attendableId={data.attendableId}
               subject={data.subject}
               role={role}
-              ref={ref}
+              ref={ref as React.Ref<HTMLDivElement>}
             />
           );
         },
       }),
       Surface.create({
         id: 'surface.pluginSettings',
-        filter: AppSurface.settings(AppSurface.Article, meta.id),
+        filter: AppSurface.settings(AppSurface.Article, meta.profile.key),
         component: ({ data: { subject } }) => {
           const { settings, updateSettings } = useSettingsState<Markdown.Settings>(subject.atom);
           return <MarkdownSettings settings={settings} onSettingsChange={updateSettings} />;
@@ -78,12 +80,20 @@ export default Capability.makeModule(() =>
       Surface.create({
         id: 'surface.editable',
         position: 'first',
-        filter: AppSurface.object(AppSurface.Card, [Markdown.Document, Text.Text], (data) => data.editable === true),
+        filter: AppSurface.object(
+          AppSurface.CardContent,
+          [Markdown.Document, Text.Text],
+          (data) => data.editable === true,
+        ),
         component: ({ data }) => <EditableMarkdownCard subject={data.subject} />,
       }),
       Surface.create({
         id: 'surface.preview',
-        filter: AppSurface.object(AppSurface.Card, [Markdown.Document, Text.Text], (data) => data.editable !== true),
+        filter: AppSurface.object(
+          AppSurface.CardContent,
+          [Markdown.Document, Text.Text],
+          (data) => data.editable !== true,
+        ),
         component: ({ data }) => <MarkdownCard {...data} />,
       }),
     ]),
@@ -97,7 +107,7 @@ const Container = forwardRef<
   HTMLDivElement,
   AppSurface.ObjectArticleProps<Markdown.Document | Text.Text, { id: string }>
 >(({ id, attendableId, subject, role }, forwardedRef) => {
-  const selectionManager = useCapability(AttentionCapabilities.Selection);
+  const viewState = useCapability(AttentionCapabilities.ViewState);
   const settings = useAtomCapability(MarkdownCapabilities.Settings);
   const [state, setState] = useAtomCapabilityState(MarkdownCapabilities.State);
   const editorState = useCapability(MarkdownCapabilities.EditorState);
@@ -117,7 +127,7 @@ const Container = forwardRef<
       id={id}
       attendableId={attendableId}
       settings={settings}
-      selectionManager={selectionManager}
+      viewState={viewState}
       extensionProviders={extensionProviders}
       editorStateStore={editorState}
       viewMode={viewMode}

package/src/capabilities/settings.ts

@@ -14,7 +14,7 @@ import { Markdown, MarkdownCapabilities } from '#types';
 export default Capability.makeModule(() =>
   Effect.sync(() => {
     const settingsAtom = createKvsStore({
-      key: meta.id,
+      key: meta.profile.key,
       schema: Markdown.Settings,
       defaultValue: () => ({
         defaultViewMode: 'preview' as const,
@@ -28,7 +28,7 @@ export default Capability.makeModule(() =>
     return [
       Capability.contributes(MarkdownCapabilities.Settings, settingsAtom),
       Capability.contributes(AppCapabilities.Settings, {
-        prefix: meta.id,
+        prefix: meta.profile.key,
         schema: Markdown.Settings,
         atom: settingsAtom,
       }),

package/src/capabilities/state.ts

@@ -6,11 +6,13 @@ import * as Effect from 'effect/Effect';
 
 import { Capability } from '@dxos/app-framework';
 import { createKvsStore } from '@dxos/effect';
-import { createEditorStateStore } from '@dxos/ui-editor';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
 
 import { meta } from '#meta';
 import { MarkdownCapabilities } from '#types';
 
+import { createEditorViewStateStore } from './editor-view-state';
+
 const createEditorViewRegistry = (): MarkdownCapabilities.EditorViewRegistry => {
   const views = new Map<string, MarkdownCapabilities.EditorViewEntry>();
   return {
@@ -28,13 +30,15 @@ export default Capability.makeModule(
   Effect.fnUntraced(function* () {
     // Persisted state using KVS store.
     const stateAtom = createKvsStore({
-      key: `${meta.id}.state`,
+      key: `${meta.profile.key}.state`,
       schema: MarkdownCapabilities.StateSchema,
       defaultValue: () => ({ viewMode: {} }),
     });
 
-    // TODO(wittjosiah): Fold into state.
-    const editorState = createEditorStateStore(`${meta.id}.editor`);
+    // Resolve ViewStateManager contributed by plugin-attention (guaranteed available because this
+    // module activates only after AttentionEvents.AttentionReady fires — see MarkdownPlugin.tsx).
+    const viewState = yield* Capability.get(AttentionCapabilities.ViewState);
+    const editorState = createEditorViewStateStore(viewState);
 
     const editorViews = createEditorViewRegistry();
 

package/src/components/MarkdownEditor/FileUpload.tsx

@@ -7,7 +7,7 @@ import React, { forwardRef, useEffect, useImperativeHandle } from 'react';
 import { createPortal } from 'react-dom';
 import { useDropzone } from 'react-dropzone';
 
-import { type FileInfo } from '@dxos/app-toolkit';
+import { AppCapabilities } from '@dxos/app-toolkit';
 import { addLink } from '@dxos/ui-editor';
 
 export const IMAGE_FILES = ['.jpg', '.jpeg', '.png', '.gif'];
@@ -19,7 +19,7 @@ export type FileUploadProps = {
   // that React 19.2's dev render-logger would walk into a cross-origin frame. See
   // `react-ui-editor/.../controller.ts` for the full rationale.
   getView?: () => EditorView | null;
-  onFileUpload?: (file: File) => Promise<FileInfo | undefined>;
+  onFileUpload?: (file: File) => Promise<AppCapabilities.FileInfo | undefined>;
 };
 
 // TODO(burdon): Factor out.

package/src/components/MarkdownEditor/MarkdownEditor.tsx

@@ -74,7 +74,7 @@ export type MarkdownEditorProviderProps = {
   'id' | 'attendableId' | 'viewMode' | 'compact' | 'onAction' | 'onFileUpload' | 'onViewModeChange'
 > &
   Pick<UseEditorMenuOptionsProps, 'slashCommandGroups' | 'onLinkQuery'> &
-  Pick<ExtensionsOptions, 'editorStateStore' | 'selectionManager' | 'settings' | 'onSelectObject'>;
+  Pick<ExtensionsOptions, 'editorStateStore' | 'viewState' | 'settings' | 'onSelectObject'>;
 
 export const MarkdownEditorProvider = ({
   children,
@@ -84,7 +84,7 @@ export const MarkdownEditorProvider = ({
   settings,
   compact,
   viewMode,
-  selectionManager,
+  viewState,
   editorStateStore,
   extensions: extensionsProp,
   slashCommandGroups,
@@ -118,7 +118,7 @@ export const MarkdownEditorProvider = ({
     object,
     compact,
     viewMode,
-    selectionManager,
+    viewState,
     editorStateStore,
     previewOptions,
     settings,
@@ -270,7 +270,7 @@ const PreviewBlock = ({ el, link }: PreviewBlock) => {
   const subject = client.graph.makeRef(dxn).target;
   const data = useMemo(() => ({ subject }), [subject]);
 
-  return createPortal(<Surface.Surface type={AppSurface.Card} data={data} limit={1} />, el);
+  return createPortal(<Surface.Surface type={AppSurface.CardContent} data={data} limit={1} />, el);
 };
 
 //

package/src/components/MarkdownEditor/MarkdownEditorContent.tsx

@@ -7,6 +7,7 @@ import { type Atom, RegistryContext } from '@effect-atom/atom-react';
 import React, { forwardRef, useCallback, useContext, useEffect, useImperativeHandle, useMemo } from 'react';
 
 import { useCapabilities } from '@dxos/app-framework/ui';
+import { AppSurface } from '@dxos/app-toolkit/ui';
 import { type ThemedClassName, useThemeContext, useTranslation } from '@dxos/react-ui';
 import {
   type EditorMenuGroup,
@@ -72,7 +73,7 @@ export const MarkdownEditorContent = forwardRef<EditorView | null, MarkdownEdito
     },
     forwardedRef,
   ) => {
-    const { t } = useTranslation(meta.id);
+    const { t } = useTranslation(meta.profile.key);
     const { themeMode } = useThemeContext();
     const registry = useContext(RegistryContext);
 
@@ -95,7 +96,7 @@ export const MarkdownEditorContent = forwardRef<EditorView | null, MarkdownEdito
       focusAttributes,
     } = useTextEditor(
       () => ({
-        ...(role !== 'section' && {
+        ...(role !== AppSurface.Section.role && {
           id,
           scrollTo,
           selection,
@@ -117,7 +118,7 @@ export const MarkdownEditorContent = forwardRef<EditorView | null, MarkdownEdito
           createMarkdownExtensions(),
           scrollbarAutohide(),
           toolbarState && formattingListener(updateToolbarState),
-          role !== 'section' &&
+          role !== AppSurface.Section.role &&
             onFileUpload &&
             dropFile({
               // TODO(wittjosiah): Factor out to file uploader plugin.

package/src/components/MarkdownEditor/MarkdownEditorToolbar.tsx

@@ -5,7 +5,7 @@
 import { type EditorView } from '@codemirror/view';
 import React, { useCallback, useState } from 'react';
 
-import { type FileInfo } from '@dxos/app-toolkit';
+import { AppCapabilities } from '@dxos/app-toolkit';
 import { composable, composableProps } from '@dxos/react-ui';
 import { Editor, type EditorToolbarProps } from '@dxos/react-ui-editor';
 
@@ -17,7 +17,7 @@ export type MarkdownEditorToolbarProps = {
   // that React 19.2's dev render-logger would walk into a cross-origin frame. See
   // `react-ui-editor/.../controller.ts` for the full rationale.
   getView?: () => EditorView | null;
-  onFileUpload?: (file: File) => Promise<FileInfo | undefined>;
+  onFileUpload?: (file: File) => Promise<AppCapabilities.FileInfo | undefined>;
 } & Pick<EditorToolbarProps, 'role' | 'customActions' | 'onAction' | 'onViewModeChange'>;
 
 export const MarkdownEditorToolbar = composable<HTMLDivElement, MarkdownEditorToolbarProps>(

package/src/components/MarkdownSettings/MarkdownSettings.tsx

@@ -20,7 +20,7 @@ const SnippetsField = ({ value, onChange, readonly }: SettingsFieldProps<string
 export const MarkdownSettings = ({ settings, onSettingsChange }: MarkdownSettingsProps) => {
   return (
     <SettingsForm.Viewport>
-      <SettingsForm.Section title={meta.name ?? 'Editor'}>
+      <SettingsForm.Section title={meta.profile.name ?? 'Editor'}>
         <SettingsForm.FieldSet
           readonly={!onSettingsChange}
           schema={Markdown.Settings}

package/src/containers/MarkdownArticle/MarkdownArticle.stories.tsx

@@ -91,10 +91,9 @@ const meta = {
               const createObjects = createObjectFactory(personalSpace.db, generator);
               yield* Effect.promise(() => createObjects([{ type: Organization.Organization, count: 10 }]));
 
-              const queue = personalSpace.queues.create();
-              const kai = Obj.make(Person.Person, { fullName: 'Kai' });
-              const dxos = Obj.make(Organization.Organization, { name: 'DXOS' });
-              yield* Effect.promise(() => queue.append([kai, dxos]));
+              const kai = personalSpace.db.add(Obj.make(Person.Person, { fullName: 'Kai' }));
+              const dxos = personalSpace.db.add(Obj.make(Organization.Organization, { name: 'DXOS' }));
+              yield* Effect.promise(() => personalSpace.db.flush());
 
               personalSpace.db.add(
                 Markdown.make({

package/src/containers/MarkdownArticle/MarkdownArticle.tsx

@@ -13,7 +13,7 @@ import { Obj } from '@dxos/echo';
 import { useActionRunner } from '@dxos/plugin-graph';
 import { useObject } from '@dxos/react-client/echo';
 import { Panel } from '@dxos/react-ui';
-import { type SelectionManager } from '@dxos/react-ui-attention';
+import { type ViewStateManager } from '@dxos/react-ui-attention';
 import { Editor } from '@dxos/react-ui-editor';
 import { Text } from '@dxos/schema';
 
@@ -31,7 +31,7 @@ export type MarkdownArticleProps = AppSurface.ObjectArticleProps<
   {
     id: string;
     settings: Markdown.Settings;
-    selectionManager?: SelectionManager;
+    viewState?: ViewStateManager;
   } & Pick<MarkdownPluginState, 'extensionProviders'> &
     Pick<MarkdownEditorProviderProps, 'viewMode' | 'onSelectObject' | 'onViewModeChange'> &
     Pick<MarkdownEditorContentProps, 'editorStateStore'>
@@ -115,7 +115,7 @@ export const MarkdownArticle = forwardRef<HTMLDivElement, MarkdownArticleProps>(
         id={id}
         attendableId={attendableId}
         object={object}
-        compact={role !== 'article'}
+        compact={role !== AppSurface.Article.role}
         extensions={extensions}
         settings={settings}
         viewMode={viewMode}

package/src/containers/MarkdownCard/MarkdownCard.tsx

@@ -20,7 +20,7 @@ import { snippet as snippetExtension } from './snippet';
 export type MarkdownCardProps = { subject: Markdown.Document | Text.Text };
 
 export const MarkdownCard = ({ subject }: MarkdownCardProps) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   // NOTE: Newline is added so that Fade does not obscure the last line.
   const snippet = useMemo(() => getSnippet(subject) + '\n', [subject]);
   const extensions = useMemo(() => [snippetExtension({ height: 300, scale: 0.8 })], []);

package/src/hooks/useEditorMenuOptions.ts

@@ -28,7 +28,7 @@ export const useEditorMenuOptions = ({
   slashCommandGroups,
   onLinkQuery,
 }: UseEditorMenuOptionsProps): UseEditorMenuProps => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
 
   const getMenu = useCallback<NonNullable<UseEditorMenuProps['getMenu']>>(
     ({ text, trigger }) => {