@dxos/plugin-markdown 0.7.4 → 0.7.5-labs.071a3e2

package/dist/lib/node/state-QSA5AOLH.cjs

@@ -0,0 +1,51 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var state_QSA5AOLH_exports = {};
+__export(state_QSA5AOLH_exports, {
+  default: () => state_default
+});
+module.exports = __toCommonJS(state_QSA5AOLH_exports);
+var import_chunk_23NQGZX3 = require("./chunk-23NQGZX3.cjs");
+var import_chunk_QZ4XQYNC = require("./chunk-QZ4XQYNC.cjs");
+var import_app_framework = require("@dxos/app-framework");
+var import_local_storage = require("@dxos/local-storage");
+var import_react_ui_editor = require("@dxos/react-ui-editor");
+var state_default = (context) => {
+  const state = new import_local_storage.LocalStorageStore(import_chunk_QZ4XQYNC.MARKDOWN_PLUGIN, {
+    extensionProviders: [],
+    viewMode: {}
+  });
+  state.prop({
+    key: "viewMode",
+    type: import_local_storage.LocalStorageStore.json()
+  });
+  const editorState = (0, import_react_ui_editor.createEditorStateStore)(`${import_chunk_QZ4XQYNC.MARKDOWN_PLUGIN}/editor`);
+  const getViewMode = (id) => {
+    const defaultViewMode = context.requestCapability(import_app_framework.Capabilities.SettingsStore).getStore(import_chunk_QZ4XQYNC.MARKDOWN_PLUGIN).value.defaultViewMode;
+    return id && state.values.viewMode[id] || defaultViewMode;
+  };
+  const setViewMode = (id, viewMode) => state.values.viewMode[id] = viewMode;
+  return (0, import_app_framework.contributes)(import_chunk_23NQGZX3.MarkdownCapabilities.State, {
+    state: state.values,
+    editorState,
+    getViewMode,
+    setViewMode
+  });
+};
+//# sourceMappingURL=state-QSA5AOLH.cjs.map

package/dist/lib/node/state-QSA5AOLH.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/capabilities/state.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { Capabilities, contributes, type PluginsContext } from '@dxos/app-framework';\nimport { LocalStorageStore } from '@dxos/local-storage';\nimport { type EditorViewMode, createEditorStateStore } from '@dxos/react-ui-editor';\n\nimport { MarkdownCapabilities } from './capabilities';\nimport { MARKDOWN_PLUGIN } from '../meta';\nimport { type MarkdownPluginState, type MarkdownSettingsProps } from '../types';\n\nexport default (context: PluginsContext) => {\n  const state = new LocalStorageStore<MarkdownPluginState>(MARKDOWN_PLUGIN, { extensionProviders: [], viewMode: {} });\n\n  state.prop({ key: 'viewMode', type: LocalStorageStore.json<{ [key: string]: EditorViewMode }>() });\n\n  // TODO(wittjosiah): Fold into state.\n  const editorState = createEditorStateStore(`${MARKDOWN_PLUGIN}/editor`);\n\n  const getViewMode = (id: string) => {\n    const defaultViewMode = context\n      .requestCapability(Capabilities.SettingsStore)\n      .getStore<MarkdownSettingsProps>(MARKDOWN_PLUGIN)!.value.defaultViewMode;\n    return (id && state.values.viewMode[id]) || defaultViewMode;\n  };\n\n  const setViewMode = (id: string, viewMode: EditorViewMode) => (state.values.viewMode[id] = viewMode);\n\n  return contributes(MarkdownCapabilities.State, { state: state.values, editorState, getViewMode, setViewMode });\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAIA,2BAA+D;AAC/D,2BAAkC;AAClC,6BAA4D;AAM5D,IAAA,gBAAe,CAACA,YAAAA;AACd,QAAMC,QAAQ,IAAIC,uCAAuCC,uCAAiB;IAAEC,oBAAoB,CAAA;IAAIC,UAAU,CAAC;EAAE,CAAA;AAEjHJ,QAAMK,KAAK;IAAEC,KAAK;IAAYC,MAAMN,uCAAkBO,KAAI;EAAsC,CAAA;AAGhG,QAAMC,kBAAcC,+CAAuB,GAAGR,qCAAAA,SAAwB;AAEtE,QAAMS,cAAc,CAACC,OAAAA;AACnB,UAAMC,kBAAkBd,QACrBe,kBAAkBC,kCAAaC,aAAa,EAC5CC,SAAgCf,qCAAAA,EAAkBgB,MAAML;AAC3D,WAAQD,MAAMZ,MAAMmB,OAAOf,SAASQ,EAAAA,KAAQC;EAC9C;AAEA,QAAMO,cAAc,CAACR,IAAYR,aAA8BJ,MAAMmB,OAAOf,SAASQ,EAAAA,IAAMR;AAE3F,aAAOiB,kCAAYC,2CAAqBC,OAAO;IAAEvB,OAAOA,MAAMmB;IAAQV;IAAaE;IAAaS;EAAY,CAAA;AAC9G;",
+  "names": ["context", "state", "LocalStorageStore", "MARKDOWN_PLUGIN", "extensionProviders", "viewMode", "prop", "key", "type", "json", "editorState", "createEditorStateStore", "getViewMode", "id", "defaultViewMode", "requestCapability", "Capabilities", "SettingsStore", "getStore", "value", "values", "setViewMode", "contributes", "MarkdownCapabilities", "State"]
+}

package/dist/lib/node/thread-BZE6RKFE.cjs

@@ -0,0 +1,52 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var thread_BZE6RKFE_exports = {};
+__export(thread_BZE6RKFE_exports, {
+  default: () => thread_default
+});
+module.exports = __toCommonJS(thread_BZE6RKFE_exports);
+var import_chunk_CZXXBKMN = require("./chunk-CZXXBKMN.cjs");
+var import_chunk_QZ4XQYNC = require("./chunk-QZ4XQYNC.cjs");
+var import_app_framework = require("@dxos/app-framework");
+var import_plugin_space = require("@dxos/plugin-space");
+var import_echo = require("@dxos/react-client/echo");
+var thread_default = () => (0, import_app_framework.contributes)(import_plugin_space.ThreadCapabilities.Thread, {
+  predicate: (obj) => obj instanceof import_chunk_CZXXBKMN.DocumentType,
+  createSort: (doc) => {
+    const accessor = doc.content.target ? (0, import_echo.createDocAccessor)(doc.content.target, [
+      "content"
+    ]) : void 0;
+    if (!accessor) {
+      return (_) => 0;
+    }
+    const getStartPosition = (cursor) => {
+      const range = cursor ? (0, import_echo.getRangeFromCursor)(accessor, cursor) : void 0;
+      return range?.start ?? Number.MAX_SAFE_INTEGER;
+    };
+    return (anchorA, anchorB) => {
+      if (anchorA === void 0 || anchorB === void 0) {
+        return 0;
+      }
+      const posA = getStartPosition(anchorA);
+      const posB = getStartPosition(anchorB);
+      return posA - posB;
+    };
+  }
+});
+//# sourceMappingURL=thread-BZE6RKFE.cjs.map

package/dist/lib/node/thread-BZE6RKFE.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/capabilities/thread.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { contributes } from '@dxos/app-framework';\nimport { ThreadCapabilities } from '@dxos/plugin-space';\nimport { createDocAccessor, getRangeFromCursor } from '@dxos/react-client/echo';\n\nimport { DocumentType } from '../types';\n\nexport default () =>\n  contributes(ThreadCapabilities.Thread, {\n    predicate: (obj) => obj instanceof DocumentType,\n    createSort: (doc: DocumentType) => {\n      const accessor = doc.content.target ? createDocAccessor(doc.content.target, ['content']) : undefined;\n      if (!accessor) {\n        return (_) => 0;\n      }\n\n      const getStartPosition = (cursor: string | undefined) => {\n        const range = cursor ? getRangeFromCursor(accessor, cursor) : undefined;\n        return range?.start ?? Number.MAX_SAFE_INTEGER;\n      };\n\n      return (anchorA: string | undefined, anchorB: string | undefined): number => {\n        if (anchorA === undefined || anchorB === undefined) {\n          return 0;\n        }\n        const posA = getStartPosition(anchorA);\n        const posB = getStartPosition(anchorB);\n        return posA - posB;\n      };\n    },\n  });\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAIA,2BAA4B;AAC5B,0BAAmC;AACnC,kBAAsD;AAItD,IAAA,iBAAe,UACbA,kCAAYC,uCAAmBC,QAAQ;EACrCC,WAAW,CAACC,QAAQA,eAAeC;EACnCC,YAAY,CAACC,QAAAA;AACX,UAAMC,WAAWD,IAAIE,QAAQC,aAASC,+BAAkBJ,IAAIE,QAAQC,QAAQ;MAAC;KAAU,IAAIE;AAC3F,QAAI,CAACJ,UAAU;AACb,aAAO,CAACK,MAAM;IAChB;AAEA,UAAMC,mBAAmB,CAACC,WAAAA;AACxB,YAAMC,QAAQD,aAASE,gCAAmBT,UAAUO,MAAAA,IAAUH;AAC9D,aAAOI,OAAOE,SAASC,OAAOC;IAChC;AAEA,WAAO,CAACC,SAA6BC,YAAAA;AACnC,UAAID,YAAYT,UAAaU,YAAYV,QAAW;AAClD,eAAO;MACT;AACA,YAAMW,OAAOT,iBAAiBO,OAAAA;AAC9B,YAAMG,OAAOV,iBAAiBQ,OAAAA;AAC9B,aAAOC,OAAOC;IAChB;EACF;AACF,CAAA;",
+  "names": ["contributes", "ThreadCapabilities", "Thread", "predicate", "obj", "DocumentType", "createSort", "doc", "accessor", "content", "target", "createDocAccessor", "undefined", "_", "getStartPosition", "cursor", "range", "getRangeFromCursor", "start", "Number", "MAX_SAFE_INTEGER", "anchorA", "anchorB", "posA", "posB"]
+}

package/dist/lib/node/types/index.cjs

@@ -18,19 +18,19 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var types_exports = {};
 __export(types_exports, {
-  DocumentType: () => import_chunk_YGMWZIIJ.DocumentType,
-  MarkdownAction: () => import_chunk_YGMWZIIJ.MarkdownAction,
-  TextType: () => import_chunk_YGMWZIIJ.TextType,
-  isEditorModel: () => import_chunk_YGMWZIIJ.isEditorModel
+  DocumentType: () => import_chunk_CZXXBKMN.DocumentType,
+  MarkdownAction: () => import_chunk_CZXXBKMN.MarkdownAction,
+  MarkdownSettingsSchema: () => import_chunk_CZXXBKMN.MarkdownSettingsSchema,
+  isEditorModel: () => import_chunk_CZXXBKMN.isEditorModel
 });
 module.exports = __toCommonJS(types_exports);
-var import_chunk_YGMWZIIJ = require("../chunk-YGMWZIIJ.cjs");
-var import_chunk_PHHIPRJC = require("../chunk-PHHIPRJC.cjs");
+var import_chunk_CZXXBKMN = require("../chunk-CZXXBKMN.cjs");
+var import_chunk_QZ4XQYNC = require("../chunk-QZ4XQYNC.cjs");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   DocumentType,
   MarkdownAction,
-  TextType,
+  MarkdownSettingsSchema,
   isEditorModel
 });
 //# sourceMappingURL=index.cjs.map

package/dist/lib/node/types/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["index.cjs"],
-  "sourcesContent": ["import {\n  DocumentType,\n  MarkdownAction,\n  TextType,\n  isEditorModel\n} from \"../chunk-YGMWZIIJ.cjs\";\nimport \"../chunk-PHHIPRJC.cjs\";\nexport {\n  DocumentType,\n  MarkdownAction,\n  TextType,\n  isEditorModel\n};\n//# sourceMappingURL=index.cjs.map\n"],
+  "sourcesContent": ["import {\n  DocumentType,\n  MarkdownAction,\n  MarkdownSettingsSchema,\n  isEditorModel\n} from \"../chunk-CZXXBKMN.cjs\";\nimport \"../chunk-QZ4XQYNC.cjs\";\nexport {\n  DocumentType,\n  MarkdownAction,\n  MarkdownSettingsSchema,\n  isEditorModel\n};\n//# sourceMappingURL=index.cjs.map\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKO;AACP,4BAAO;",
   "names": []
 }

package/dist/lib/node-esm/{MarkdownContainer-GBNSGROQ.mjs → MarkdownContainer-ILR7OVRM.mjs}

@@ -2,108 +2,116 @@ import { createRequire } from 'node:module';const require = createRequire(import
 import {
   getFallbackName,
   setFallbackName
-} from "./chunk-NUMUUCYF.mjs";
+} from "./chunk-T62F7XQE.mjs";
 import {
   DocumentType
-} from "./chunk-ERJ52KN2.mjs";
+} from "./chunk-MMVIEZ43.mjs";
+import {
+  MarkdownCapabilities
+} from "./chunk-Y5QKDC4V.mjs";
 import {
   MARKDOWN_PLUGIN
-} from "./chunk-BABK7FMW.mjs";
+} from "./chunk-BBVPC53M.mjs";
 
 // packages/plugins/plugin-markdown/src/components/MarkdownContainer.tsx
-import React3, { useEffect as useEffect2, useMemo as useMemo3 } from "react";
-import { useResolvePlugin, parseFileManagerPlugin } from "@dxos/app-framework";
+import React3, { useEffect as useEffect2, useMemo as useMemo4 } from "react";
+import { Capabilities, useCapabilities as useCapabilities2 } from "@dxos/app-framework";
 import { fullyQualifiedId as fullyQualifiedId2, getSpace as getSpace2 } from "@dxos/react-client/echo";
 
 // packages/plugins/plugin-markdown/src/components/MarkdownEditor.tsx
 import { openSearchPanel } from "@codemirror/search";
-import React, { useMemo, useEffect, useCallback as useCallback2 } from "react";
-import { LayoutAction as LayoutAction2, NavigationAction, useIntentDispatcher } from "@dxos/app-framework";
+import React, { useMemo as useMemo2, useEffect, useCallback } from "react";
+import { useDropzone } from "react-dropzone";
+import { createIntent, LayoutAction as LayoutAction2, useIntentDispatcher } from "@dxos/app-framework";
 import { useThemeContext, useTranslation } from "@dxos/react-ui";
-import { useAttention } from "@dxos/react-ui-attention";
-import { Toolbar, createBasicExtensions, createMarkdownExtensions, createThemeExtensions, dropFile, editorContent, editorGutter, processAction, useActionHandler, useCommentState, useCommentClickListener, useFormattingState, useTextEditor } from "@dxos/react-ui-editor";
+import { EditorToolbar, createBasicExtensions, createMarkdownExtensions, createThemeExtensions, dropFile, editorContent, editorGutter, processEditorPayload, useActionHandler, useCommentState, useCommentClickListener, useFormattingState, useTextEditor, stackItemContentEditorClassNames, useEditorToolbarState, createEditorAction } from "@dxos/react-ui-editor";
 import { StackItem } from "@dxos/react-ui-stack";
-import { mx, textBlockWidth } from "@dxos/react-ui-theme";
 import { isNotFalsy, nonNullable } from "@dxos/util";
 
 // packages/plugins/plugin-markdown/src/hooks/useSelectCurrentThread.tsx
 import { EditorView } from "@codemirror/view";
-import { useCallback } from "react";
-import { LayoutAction, useIntentResolver } from "@dxos/app-framework";
+import { useMemo } from "react";
+import { createResolver, LayoutAction, useIntentResolver } from "@dxos/app-framework";
+import { S } from "@dxos/echo-schema";
+import { invariant } from "@dxos/invariant";
 import { Cursor, setSelection } from "@dxos/react-ui-editor";
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-markdown/src/hooks/useSelectCurrentThread.tsx";
 var useSelectCurrentThread = (editorView, documentId) => {
-  const handleScrollIntoView = useCallback(({ action, data }) => {
-    if (action === LayoutAction.SCROLL_INTO_VIEW) {
-      if (editorView && data?.id === documentId && data?.cursor) {
-        const range = Cursor.getRangeFromCursor(editorView.state, data.cursor);
-        if (range) {
-          const selection = editorView.state.selection.main.from !== range.from ? {
-            anchor: range.from
-          } : void 0;
-          const effects = [
-            // NOTE: This does not use the DOM scrollIntoView function.
-            EditorView.scrollIntoView(range.from, {
-              y: "start",
-              yMargin: 96
-            })
-          ];
-          if (selection) {
-            effects.push(setSelection.of({
-              current: documentId
-            }));
-          }
-          editorView.dispatch({
-            effects,
-            selection: selection ? {
-              anchor: range.from
-            } : void 0
-          });
-          return {
-            data: true
-          };
+  const scrollIntoViewResolver = useMemo(() => createResolver({
+    intent: LayoutAction.UpdateLayout,
+    position: "hoist",
+    filter: (data) => {
+      if (!S.is(LayoutAction.ScrollIntoView.fields.input)(data)) {
+        return false;
+      }
+      return !!editorView && data.subject === documentId && !!data.options?.cursor;
+    },
+    resolve: ({ options: { cursor } }) => {
+      invariant(editorView, "Editor view is not defined.", {
+        F: __dxlog_file,
+        L: 32,
+        S: void 0,
+        A: [
+          "editorView",
+          "'Editor view is not defined.'"
+        ]
+      });
+      const range = Cursor.getRangeFromCursor(editorView.state, cursor);
+      if (range) {
+        const selection = editorView.state.selection.main.from !== range.from ? {
+          anchor: range.from
+        } : void 0;
+        const effects = [
+          // NOTE: This does not use the DOM scrollIntoView function.
+          EditorView.scrollIntoView(range.from, {
+            y: "start",
+            yMargin: 96
+          })
+        ];
+        if (selection) {
+          effects.push(setSelection.of({
+            current: documentId
+          }));
         }
+        editorView.dispatch({
+          effects,
+          selection: selection ? {
+            anchor: range.from
+          } : void 0
+        });
       }
     }
-  }, [
+  }), [
     documentId,
     editorView
   ]);
-  useIntentResolver(MARKDOWN_PLUGIN, handleScrollIntoView);
+  useIntentResolver(MARKDOWN_PLUGIN, scrollIntoViewResolver);
 };
 
 // packages/plugins/plugin-markdown/src/components/MarkdownEditor.tsx
-var DEFAULT_VIEW_MODE = "preview";
 var MarkdownEditor = ({ id, role = "article", initialValue, extensions, extensionProviders, scrollPastEnd, toolbar, viewMode, editorStateStore, onFileUpload, onViewModeChange }) => {
   const { t } = useTranslation(MARKDOWN_PLUGIN);
   const { themeMode } = useThemeContext();
-  const dispatch = useIntentDispatcher();
-  const [formattingState, formattingObserver] = useFormattingState();
-  const { hasAttention } = useAttention(id);
-  const { scrollTo, selection } = useMemo(() => editorStateStore?.getState(id) ?? {}, [
+  const { dispatchPromise: dispatch } = useIntentDispatcher();
+  const toolbarState = useEditorToolbarState({
+    viewMode
+  });
+  const formattingObserver = useFormattingState(toolbarState);
+  const { scrollTo, selection } = useMemo2(() => editorStateStore?.getState(id) ?? {}, [
     id
   ]);
-  const providerExtensions = useMemo(() => extensionProviders?.flatMap((provider) => provider({})).filter(nonNullable), [
+  const providerExtensions = useMemo2(() => extensionProviders?.flatMap((provider) => provider({})).filter(nonNullable), [
     extensionProviders
   ]);
-  const [commentsState, commentObserver] = useCommentState();
-  const onCommentClick = useCallback2(() => {
-    void dispatch([
-      {
-        action: NavigationAction.OPEN,
-        data: {
-          activeParts: {
-            complementary: "comments"
-          }
-        }
-      },
-      {
-        action: LayoutAction2.SET_LAYOUT,
-        data: {
-          element: "complementary",
-          state: true
-        }
+  const commentObserver = useCommentState(toolbarState);
+  const onCommentClick = useCallback(async () => {
+    await dispatch(createIntent(LayoutAction2.UpdateComplementary, {
+      part: "complementary",
+      subject: "comments",
+      options: {
+        state: "expanded"
       }
-    ]);
+    }));
   }, [
     dispatch
   ]);
@@ -112,7 +120,7 @@ var MarkdownEditor = ({ id, role = "article", initialValue, extensions, extensio
     const file = files[0];
     const info = file && onFileUpload ? await onFileUpload(file) : void 0;
     if (info) {
-      processAction(view, {
+      processEditorPayload(view, {
         type: "image",
         data: info.url
       });
@@ -166,9 +174,44 @@ var MarkdownEditor = ({ id, role = "article", initialValue, extensions, extensio
   ]);
   useTest(editorView);
   useSelectCurrentThread(editorView, id);
+  const { acceptedFiles, getInputProps, open } = useDropzone({
+    multiple: false,
+    noDrag: true,
+    accept: {
+      "image/*": [
+        ".jpg",
+        ".jpeg",
+        ".png",
+        ".gif"
+      ]
+    }
+  });
+  useEffect(() => {
+    if (editorView && onFileUpload && acceptedFiles.length) {
+      requestAnimationFrame(async () => {
+        const f = acceptedFiles[0];
+        const file = new File([
+          f
+        ], f.name, {
+          type: f.type,
+          lastModified: f.lastModified
+        });
+        const info = await onFileUpload(file);
+        if (info) {
+          processEditorPayload(editorView, {
+            type: "image",
+            data: info.url
+          });
+        }
+      });
+    }
+  }, [
+    acceptedFiles,
+    editorView
+  ]);
   const handleToolbarAction = useActionHandler(editorView);
-  const handleAction = (action) => {
-    switch (action.type) {
+  const handleAction = useCallback((action) => {
+    switch (action.properties.type) {
       case "search": {
         if (editorView) {
           openSearchPanel(editorView);
@@ -176,37 +219,34 @@ var MarkdownEditor = ({ id, role = "article", initialValue, extensions, extensio
         return;
       }
       case "view-mode": {
-        onViewModeChange?.(id, action.data);
+        onViewModeChange?.(id, action.properties.data);
+        return;
+      }
+      case "image": {
+        open();
         return;
       }
     }
     handleToolbarAction?.(action);
-  };
+  }, [
+    editorView,
+    onViewModeChange,
+    open
+  ]);
   return /* @__PURE__ */ React.createElement(StackItem.Content, {
-    toolbar
-  }, toolbar && /* @__PURE__ */ React.createElement("div", {
-    role: "none",
-    className: mx("attention-surface is-full border-be !border-separator", role === "section" && "sticky block-start-0 z-[1] -mbe-px min-is-0")
-  }, /* @__PURE__ */ React.createElement(Toolbar.Root, {
-    classNames: [
-      textBlockWidth,
-      !hasAttention && "opacity-20"
-    ],
-    state: formattingState && {
-      ...formattingState,
-      ...commentsState
-    },
+    toolbar: !!toolbar
+  }, toolbar && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(EditorToolbar, {
+    attendableId: id,
+    role,
+    state: toolbarState,
+    customActions: onFileUpload ? createUploadAction : void 0,
     onAction: handleAction
-  }, /* @__PURE__ */ React.createElement(Toolbar.Markdown, null), onFileUpload && /* @__PURE__ */ React.createElement(Toolbar.Custom, {
-    onUpload: onFileUpload
-  }), /* @__PURE__ */ React.createElement(Toolbar.Separator, null), /* @__PURE__ */ React.createElement(Toolbar.View, {
-    mode: viewMode ?? DEFAULT_VIEW_MODE
-  }), /* @__PURE__ */ React.createElement(Toolbar.Actions, null))), /* @__PURE__ */ React.createElement("div", {
+  }), /* @__PURE__ */ React.createElement("input", getInputProps())), /* @__PURE__ */ React.createElement("div", {
     role: "none",
     ref: parentRef,
     "data-testid": "composer.markdownRoot",
     "data-toolbar": toolbar ? "enabled" : "disabled",
-    className: mx("ch-focus-ring-inset data-[toolbar=disabled]:pbs-2 attention-surface", role === "article" ? "min-bs-0" : "[&_.cm-scroller]:overflow-hidden [&_.cm-scroller]:min-bs-24"),
+    className: stackItemContentEditorClassNames(role),
     ...focusAttributes
   }));
 };
@@ -220,24 +260,43 @@ var useTest = (view) => {
     view
   ]);
 };
+var createUploadAction = () => ({
+  nodes: [
+    createEditorAction({
+      type: "image",
+      testId: "editor.toolbar.image"
+    }, "ph--image-square--regular", [
+      "upload image label",
+      {
+        ns: MARKDOWN_PLUGIN
+      }
+    ])
+  ],
+  edges: [
+    {
+      source: "root",
+      target: "image"
+    }
+  ]
+});
 
 // packages/plugins/plugin-markdown/src/extensions.tsx
-import React2, { useMemo as useMemo2 } from "react";
+import React2, { useMemo as useMemo3 } from "react";
 import { createRoot } from "react-dom/client";
-import { NavigationAction as NavigationAction2, useIntentDispatcher as useIntentDispatcher2 } from "@dxos/app-framework";
-import { invariant } from "@dxos/invariant";
+import { createIntent as createIntent2, LayoutAction as LayoutAction3, useCapabilities, useIntentDispatcher as useIntentDispatcher2 } from "@dxos/app-framework";
+import { invariant as invariant2 } from "@dxos/invariant";
 import { createDocAccessor, fullyQualifiedId, getSpace } from "@dxos/react-client/echo";
 import { useIdentity } from "@dxos/react-client/halo";
 import { Icon, ThemeProvider } from "@dxos/react-ui";
 import { InputModeExtensions, createDataExtensions, autocomplete, decorateMarkdown, folding, formattingKeymap, linkTooltip, listener, selectionState, typewriter } from "@dxos/react-ui-editor";
 import { defaultTx } from "@dxos/react-ui-theme";
 import { isNotFalsy as isNotFalsy2 } from "@dxos/util";
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-markdown/src/extensions.tsx";
-var useExtensions = ({ document, settings, viewMode, editorStateStore, extensionProviders }) => {
-  const dispatch = useIntentDispatcher2();
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-markdown/src/extensions.tsx";
+var useExtensions = ({ document, settings, viewMode, editorStateStore }) => {
+  const { dispatchPromise: dispatch } = useIntentDispatcher2();
   const identity = useIdentity();
   const space = getSpace(document);
-  const baseExtensions = useMemo2(() => createBaseExtensions({
+  const baseExtensions = useMemo3(() => createBaseExtensions({
     document,
     settings,
     viewMode,
@@ -253,7 +312,8 @@ var useExtensions = ({ document, settings, viewMode, editorStateStore, extension
     settings.debug,
     settings.typewriter
   ]);
-  const pluginExtensions = useMemo2(() => extensionProviders?.reduce((acc, provider) => {
+  const extensionProviders = useCapabilities(MarkdownCapabilities.Extensions);
+  const pluginExtensions = useMemo3(() => extensionProviders.flat().reduce((acc, provider) => {
     const extension = typeof provider === "function" ? provider({
       document
     }) : provider;
@@ -265,11 +325,11 @@ var useExtensions = ({ document, settings, viewMode, editorStateStore, extension
     extensionProviders,
     document
   ]);
-  return useMemo2(() => [
+  return useMemo3(() => [
     // NOTE: Data extensions must be first so that automerge is updated before other extensions compute their state.
     document && createDataExtensions({
       id: document.id,
-      text: document.content && createDocAccessor(document.content, [
+      text: document.content.target && createDocAccessor(document.content.target, [
         "content"
       ]),
       space,
@@ -285,7 +345,7 @@ var useExtensions = ({ document, settings, viewMode, editorStateStore, extension
     baseExtensions,
     pluginExtensions,
     document,
-    document?.content,
+    document?.content?.target,
     space,
     identity
   ]);
@@ -305,15 +365,15 @@ var createBaseExtensions = ({ document, dispatch, settings, query, viewMode }) =
         } : void 0,
         // TODO(wittjosiah): For internal links, consider ignoring the link text and rendering the label of the object being linked to.
         renderLinkButton: dispatch && document ? onRenderLink((id) => {
-          void dispatch({
-            action: NavigationAction2.ADD_TO_ACTIVE,
-            data: {
-              id,
-              part: "main",
-              pivotId: fullyQualifiedId(document),
-              scrollIntoView: true
+          void dispatch(createIntent2(LayoutAction3.Open, {
+            part: "main",
+            subject: [
+              id
+            ],
+            options: {
+              pivotId: fullyQualifiedId(document)
             }
-          });
+          }));
         }) : void 0
       }),
       linkTooltip(renderLinkTooltip)
@@ -350,9 +410,9 @@ var onRenderLink = (onSelectObject) => (el, url) => {
   const options = isInternal ? {
     onClick: () => {
       const qualifiedId = url.split("/").at(-1);
-      invariant(qualifiedId, "Invalid link format.", {
-        F: __dxlog_file,
-        L: 215,
+      invariant2(qualifiedId, "Invalid link format.", {
+        F: __dxlog_file2,
+        L: 218,
         S: void 0,
         A: [
           "qualifiedId",
@@ -396,11 +456,10 @@ var renderRoot = (root, node) => {
 };
 
 // packages/plugins/plugin-markdown/src/components/MarkdownContainer.tsx
-var MarkdownContainer = ({ id, role, object, extensionProviders, settings, viewMode, editorStateStore, onViewModeChange }) => {
+var MarkdownContainer = ({ id, role, object, settings, viewMode, editorStateStore, onViewModeChange }) => {
   const scrollPastEnd = role === "article";
   const doc = object instanceof DocumentType ? object : void 0;
   const extensions = useExtensions({
-    extensionProviders,
     document: doc,
     settings,
     viewMode,
@@ -434,26 +493,30 @@ var MarkdownContainer = ({ id, role, object, extensionProviders, settings, viewM
 var DocumentEditor = ({ id, document: doc, settings, viewMode, ...props }) => {
   const space = getSpace2(doc);
   useEffect2(() => {
-    if (!doc.fallbackName && doc.content?.content) {
-      doc.fallbackName = getFallbackName(doc.content.content);
+    if (typeof doc.fallbackName === "string") {
+      return;
+    }
+    const fallbackName = doc.content?.target?.content ? getFallbackName(doc.content.target.content) : void 0;
+    if (fallbackName) {
+      doc.fallbackName = fallbackName;
     }
   }, [
     doc,
     doc.content
   ]);
-  const fileManagerPlugin = useResolvePlugin(parseFileManagerPlugin);
-  const handleFileUpload = useMemo3(() => {
-    if (space === void 0 || fileManagerPlugin?.provides.file.upload === void 0) {
+  const [upload] = useCapabilities2(Capabilities.FileUploader);
+  const handleFileUpload = useMemo4(() => {
+    if (space === void 0 || upload === void 0) {
       return void 0;
     }
-    return async (file) => fileManagerPlugin?.provides?.file?.upload?.(file, space);
+    return async (file) => upload(file, space);
   }, [
     space,
-    fileManagerPlugin
+    upload
   ]);
   return /* @__PURE__ */ React3.createElement(MarkdownEditor, {
     id,
-    initialValue: doc.content?.content,
+    initialValue: doc.content?.target?.content,
     viewMode,
     toolbar: settings.toolbar,
     inputMode: settings.editorInputMode,
@@ -466,4 +529,4 @@ export {
   DocumentEditor,
   MarkdownContainer_default as default
 };
-//# sourceMappingURL=MarkdownContainer-GBNSGROQ.mjs.map
+//# sourceMappingURL=MarkdownContainer-ILR7OVRM.mjs.map