@dxos/react-ui-editor 0.3.11-main.08776d7 → 0.3.11-main.0999ea0

package/src/extensions/markdown/formatting.ts

@@ -0,0 +1,159 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+import { syntaxTree } from '@codemirror/language';
+import { type Extension, RangeSetBuilder } from '@codemirror/state';
+import {
+  type Command,
+  Decoration,
+  type DecorationSet,
+  type EditorView,
+  keymap,
+  ViewPlugin,
+  type ViewUpdate,
+} from '@codemirror/view';
+import { type SyntaxNodeRef, type SyntaxNode } from '@lezer/common';
+
+export type FormattingOptions = {};
+
+export const setHeading =
+  (level: number): Command =>
+  (view: EditorView) => {
+    const {
+      selection: { ranges },
+      doc,
+    } = view.state;
+    const changes = [];
+    for (const range of ranges) {
+      const { number } = doc.lineAt(range.anchor);
+      const { from } = doc.line(number);
+
+      // Check heading doesn't already exist.
+      const line = doc.sliceString(from, from + 7);
+      const [_, marks, spaces] = line.match(/(#+)(\s+)/) ?? [];
+      const current = marks?.length ?? 0;
+      if (level !== current) {
+        changes.push({
+          from,
+          to: from + current + (spaces?.length ?? 0),
+          insert: '#'.repeat(level) + (level > 0 ? ' ' : ''),
+        });
+      }
+    }
+
+    if (changes.length) {
+      view.dispatch({ changes });
+    }
+
+    return true;
+  };
+
+export const toggleStyle =
+  (mark: string): Command =>
+  (view) => {
+    const { ranges } = view.state.selection;
+    for (const range of ranges) {
+      if (range.from === range.to) {
+        return false;
+      }
+
+      // TODO(burdon): Detect if already styled (or nested).
+      view.dispatch({
+        changes: [
+          {
+            from: range.from,
+            insert: mark,
+          },
+          {
+            from: range.to,
+            insert: mark,
+          },
+        ],
+      });
+    }
+
+    return true;
+  };
+
+export const toggleBold = toggleStyle('**');
+export const toggleItalic = toggleStyle('_');
+export const toggleStrikethrough = toggleStyle('~~');
+
+export const toggleList = (view: EditorView) => {};
+
+export const formatting = (options: FormattingOptions = {}): Extension => {
+  return [
+    keymap.of([
+      {
+        key: 'meta-b',
+        run: toggleBold,
+      },
+    ]),
+    styling(),
+  ];
+};
+
+// https://github.github.com/gfm
+// https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax
+
+const styling = (): Extension => {
+  const buildDecorations = (view: EditorView): DecorationSet => {
+    const builder = new RangeSetBuilder<Decoration>();
+    const { state } = view;
+    const cursor = state.selection.main.head;
+
+    // TODO(burdon): Bug if '***foo***' (since StrongEmphasis is nested inside EmphasisMark).
+    //  Ranges must be added sorted by `from` position and `startSide`.
+    const replace = (node: SyntaxNodeRef, marks: SyntaxNode[]) => {
+      if (cursor <= node.from || cursor >= node.to) {
+        for (const mark of marks) {
+          builder.add(mark.from, mark.to, Decoration.replace({}));
+        }
+      }
+    };
+
+    for (const { from, to } of view.visibleRanges) {
+      syntaxTree(state).iterate({
+        enter: (node) => {
+          switch (node.name) {
+            case 'Emphasis':
+            case 'StrongEmphasis': {
+              const marks = node.node.getChildren('EmphasisMark');
+              replace(node, marks);
+              break;
+            }
+
+            case 'Strikethrough': {
+              const marks = node.node.getChildren('StrikethroughMark');
+              replace(node, marks);
+              break;
+            }
+          }
+        },
+        from,
+        to,
+      });
+    }
+
+    return builder.finish();
+  };
+
+  return [
+    ViewPlugin.fromClass(
+      class {
+        decorations: DecorationSet;
+        constructor(view: EditorView) {
+          this.decorations = buildDecorations(view);
+        }
+
+        update(update: ViewUpdate) {
+          this.decorations = buildDecorations(update.view);
+        }
+      },
+      {
+        decorations: (value) => value.decorations,
+      },
+    ),
+  ];
+};

package/src/extensions/markdown/heading.ts

@@ -0,0 +1,59 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import { syntaxTree } from '@codemirror/language';
+import { RangeSetBuilder } from '@codemirror/state';
+import { Decoration, type DecorationSet, type EditorView, ViewPlugin, type ViewUpdate } from '@codemirror/view';
+
+const buildDecorations = (view: EditorView): DecorationSet => {
+  const builder = new RangeSetBuilder<Decoration>();
+  const { state } = view;
+  const cursor = state.selection.main.head;
+
+  for (const { from, to } of view.visibleRanges) {
+    syntaxTree(state).iterate({
+      enter: (node) => {
+        switch (node.name) {
+          case 'ATXHeading1':
+          case 'ATXHeading2':
+          case 'ATXHeading3':
+          case 'ATXHeading4':
+          case 'ATXHeading5':
+          case 'ATXHeading6': {
+            const mark = node.node.getChild('HeaderMark');
+            if (mark) {
+              if (!view.hasFocus || view.state.readOnly || cursor < node.from || cursor > node.to) {
+                builder.add(mark.from, mark.to + 1, Decoration.replace({}));
+              }
+            }
+          }
+        }
+      },
+      from,
+      to,
+    });
+  }
+
+  return builder.finish();
+};
+
+export const heading = () => {
+  return [
+    ViewPlugin.fromClass(
+      class {
+        decorations: DecorationSet;
+        constructor(view: EditorView) {
+          this.decorations = buildDecorations(view);
+        }
+
+        update(update: ViewUpdate) {
+          this.decorations = buildDecorations(update.view);
+        }
+      },
+      {
+        decorations: (value) => value.decorations,
+      },
+    ),
+  ];
+};

package/src/extensions/markdown/highlight.ts

@@ -128,13 +128,13 @@ export const markdownHighlightStyle = (readonly?: boolean) => {
       // Markdown marks.
       {
         tag: [markdownTags.CodeMark, markdownTags.HeaderMark, markdownTags.QuoteMark, markdownTags.EmphasisMark],
-        class: readonly ? 'hidden' : mark,
+        class: mark,
       },
 
       // E.g., code block language (after ```).
       {
         tag: [tags.function(tags.variableName), tags.labelName],
-        class: readonly ? 'hidden' : codeMark,
+        class: codeMark,
       },
 
       {
@@ -143,12 +143,12 @@ export const markdownHighlightStyle = (readonly?: boolean) => {
       },
 
       // Headings.
-      { tag: tags.heading1, class: heading(1, readonly) },
-      { tag: tags.heading2, class: heading(2, readonly) },
-      { tag: tags.heading3, class: heading(3, readonly) },
-      { tag: tags.heading4, class: heading(4, readonly) },
-      { tag: tags.heading5, class: heading(5, readonly) },
-      { tag: tags.heading6, class: heading(6, readonly) },
+      { tag: tags.heading1, class: heading(1) },
+      { tag: tags.heading2, class: heading(2) },
+      { tag: tags.heading3, class: heading(3) },
+      { tag: tags.heading4, class: heading(4) },
+      { tag: tags.heading5, class: heading(5) },
+      { tag: tags.heading6, class: heading(6) },
 
       // Emphasis.
       { tag: tags.emphasis, class: italic },
@@ -165,7 +165,7 @@ export const markdownHighlightStyle = (readonly?: boolean) => {
       // However, since `codeLanguages` is also defined, the `lezer` will not parse fenced code blocks,
       // when a language is specified. In this case, the syntax highlighting extensions will colorize
       // the code, but all other CSS properties will be inherited.
-      // IMPORTANT: Therefore, the fenced code block will use the base editor font.
+      // IMPORTANT: Therefore, the fenced code block will use the base editor font unless changed by an extension.
       {
         tag: [markdownTags.CodeText, markdownTags.InlineCode],
         class: code,
@@ -180,12 +180,6 @@ export const markdownHighlightStyle = (readonly?: boolean) => {
         tag: [markdownTags.TableCell],
         class: 'font-mono',
       },
-
-      // Main content, paragraphs, etc.
-      // {
-      //   tag: [tags.content],
-      //   fontFamily: getToken('fontFamily.body', []).join(','),
-      // },
     ],
     {
       scope: markdownLanguage,

package/src/extensions/markdown/hr.ts

@@ -0,0 +1,71 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import { syntaxTree } from '@codemirror/language';
+import { RangeSetBuilder } from '@codemirror/state';
+import { Decoration, type DecorationSet, EditorView, ViewPlugin, type ViewUpdate, WidgetType } from '@codemirror/view';
+
+import { getToken } from '../../styles';
+
+// TODO(burdon): Reconcile with theme.
+const styles = EditorView.baseTheme({
+  '& .cm-hr': {
+    // Note that block-level decorations should not have vertical margins,
+    borderTop: `1px solid ${getToken('extend.colors.neutral.200')}`,
+  },
+});
+
+class HorizontalRuleWidget extends WidgetType {
+  override toDOM() {
+    const el = document.createElement('div');
+    el.className = 'cm-hr';
+    return el;
+  }
+}
+
+const decoration = Decoration.replace({ widget: new HorizontalRuleWidget() });
+
+const buildDecorations = (view: EditorView): DecorationSet => {
+  const builder = new RangeSetBuilder<Decoration>();
+  const { state } = view;
+  const cursor = state.selection.main.head;
+
+  for (const { from, to } of view.visibleRanges) {
+    syntaxTree(state).iterate({
+      enter: (node) => {
+        if (node.name === 'HorizontalRule') {
+          // Check if cursor is inside text.
+          if (cursor <= node.from || cursor >= node.to) {
+            builder.add(node.from, node.to, decoration);
+          }
+        }
+      },
+      from,
+      to,
+    });
+  }
+
+  return builder.finish();
+};
+
+export const hr = () => {
+  return [
+    ViewPlugin.fromClass(
+      class {
+        decorations: DecorationSet;
+        constructor(view: EditorView) {
+          this.decorations = buildDecorations(view);
+        }
+
+        update(update: ViewUpdate) {
+          this.decorations = buildDecorations(update.view);
+        }
+      },
+      {
+        decorations: (value) => value.decorations,
+      },
+    ),
+    styles,
+  ];
+};

package/src/extensions/markdown/index.ts

@@ -3,4 +3,12 @@
 //
 
 export * from './bundle';
+export * from './code';
+export * from './formatting';
+export * from './heading';
 export * from './highlight';
+export * from './hr';
+export * from './image';
+export * from './link';
+export * from './table';
+export * from './tasklist';

package/src/extensions/{link.ts → markdown/link.ts}

@@ -22,6 +22,7 @@ import { tooltipContent } from '@dxos/react-ui-theme';
 // https://codemirror.net/try/?c=aW1wb3J0IHsgYmFzaWNTZXR1cCwgRWRpdG9yVmlldyB9IGZyb20gImNvZGVtaXJyb3IiCmltcG9ydCB7IG1hcmtkb3duIH0gZnJvbSAiQGNvZGVtaXJyb3IvbGFuZy1tYXJrZG93biIKaW1wb3J0IHsgc3ludGF4VHJlZSB9IGZyb20gIkBjb2RlbWlycm9yL2xhbmd1YWdlIjsKaW1wb3J0IHsgRWRpdG9yU3RhdGUsIFJhbmdlU2V0QnVpbGRlciwgU3RhdGVGaWVsZCB9IGZyb20gIkBjb2RlbWlycm9yL3N0YXRlIjsKaW1wb3J0IHsgRGVjb3JhdGlvbiwgV2lkZ2V0VHlwZSB9IGZyb20gIkBjb2RlbWlycm9yL3ZpZXciOwoKY2xhc3MgTGluayBleHRlbmRzIFdpZGdldFR5cGUgewogIGNvbnN0cnVjdG9yKHRleHQsIHVybCkgewogICAgc3VwZXIoKQogICAgdGhpcy50ZXh0ID0gdGV4dAogICAgdGhpcy51cmwgPSB1cmwKICB9CiAgZXEob3RoZXIpIHsgcmV0dXJuIHRoaXMudGV4dCA9PSBvdGhlci50ZXh0ICYmIHRoaXMudXJsID09IG90aGVyLnVybCB9CiAgdG9ET00oKSB7CiAgICBsZXQgbGluayA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoImEiKQogICAgbGluay50ZXh0Q29udGVudCA9IHRoaXMudGV4dAogICAgbGluay5ocmVmID0gdGhpcy51cmwKICAgIHJldHVybiBsaW5rOwogIH0KfQoKbGV0IGRlY29yYXRpb25zRmllbGQgPSBTdGF0ZUZpZWxkLmRlZmluZSh7CiAgY3JlYXRlKCkgewogICAgcmV0dXJuIERlY29yYXRpb24ubm9uZTsKICB9LAogIHVwZGF0ZShfLCB0cikgewogICAgY29uc3QgYnVpbGRlciA9IG5ldyBSYW5nZVNldEJ1aWxkZXIoKTsKICAgIGxldCBjdXJzb3IgPSB0ci5zdGF0ZS5zZWxlY3Rpb24ubWFpbi5oZWFkOwogICAgc3ludGF4VHJlZSh0ci5zdGF0ZSkuaXRlcmF0ZSh7CiAgICAgIGVudGVyOiAobm9kZSkgPT4gewogICAgICAgIGlmICgoY3Vyc29yIDwgbm9kZS5mcm9tIHx8IGN1cnNvciA+IG5vZGUudG8pICYmIG5vZGUubmFtZSA9PSAiTGluayIpIHsKICAgICAgICAgIGxldCBtYXJrcyA9IG5vZGUubm9kZS5nZXRDaGlsZHJlbigiTGlua01hcmsiKTsKICAgICAgICAgIGxldCB0ZXh0ID0gbWFya3MubGVuZ3RoID49IDIgPyB0ci5zdGF0ZS5zbGljZURvYyhtYXJrc1swXS50bywgbWFya3NbMV0uZnJvbSkgOiAiIgoKICAgICAgICAgIGxldCB1cmxOb2RlID0gbm9kZS5ub2RlLmdldENoaWxkKCJVUkwiKTsKICAgICAgICAgIGxldCB1cmwgPSB1cmxOb2RlID8gdHIuc3RhdGUuc2xpY2VEb2ModXJsTm9kZS5mcm9tLCB1cmxOb2RlLnRvKSA6ICIiCiAgICAgICAgICBidWlsZGVyLmFkZChub2RlLmZyb20sIG5vZGUudG8sIERlY29yYXRpb24ucmVwbGFjZSh7CiAgICAgICAgICAgIHdpZGdldDogbmV3IExpbmsodGV4dCwgdXJsKSwKICAgICAgICAgIH0pLAogICAgICAgICAgICAgICAgICAgICApOwogICAgICAgICAgcmV0dXJuIGZhbHNlOwogICAgICAgIH0KICAgICAgICByZXR1cm4gdHJ1ZTsKICAgICAgfSwKICAgIH0pOwogICAgcmV0dXJuIGJ1aWxkZXIuZmluaXNoKCk7CiAgfSwKICBwcm92aWRlOiAoZikgPT4gRWRpdG9yVmlldy5kZWNvcmF0aW9ucy5mcm9tKGYpLAp9KTsKCmxldCB2aWV3ID0gbmV3IEVkaXRvclZpZXcoewogIGRvYzogIiMgSGVsbG8gV29ybGRcblxuW1Rlc3RdKGh0dHBzOi8vZXhhbXBsZS5jb20pXG5cblxuIiwKICBleHRlbnNpb25zOiBbZGVjb3JhdGlvbnNGaWVsZCwgbWFya2Rvd24oKV0sCiAgcGFyZW50OiBkb2N1bWVudC5ib2R5LAp9KTsKCnZpZXcuZm9jdXMoKTs=
 // https://discuss.codemirror.net/t/link-widget-is-clicked-only-if-editor-is-out-of-focus/7433
 
+// TODO(burdon): Callback to dynamically lookup title of linked pages.
 export type LinkOptions = {
   link?: boolean;
   onHover?: (el: Element, url: string) => void;
@@ -37,7 +38,6 @@ export const link = (options: LinkOptions = {}): Extension => {
     ViewPlugin.fromClass(
       class {
         decorations: DecorationSet;
-
         constructor(view: EditorView) {
           this.decorations = buildDecorations(view, options);
         }
@@ -49,7 +49,7 @@ export const link = (options: LinkOptions = {}): Extension => {
         }
       },
       {
-        decorations: (v) => v.decorations,
+        decorations: (value) => value.decorations,
       },
     ),
   ];
@@ -65,10 +65,12 @@ export const link = (options: LinkOptions = {}): Extension => {
         for (let i = 0, node: SyntaxNode | null = syntax; !link && node && i < 5; node = node.parent, i++) {
           link = node.name === 'Link' ? node : null;
         }
+
         const url = link && link.getChild('URL');
         if (!url || !link) {
           return null;
         }
+
         const urlText = view.state.sliceDoc(url.from, url.to);
         return {
           pos: link.from,
@@ -158,6 +160,7 @@ const buildDecorations = (view: EditorView, options: LinkOptions): DecorationSet
             return false;
           }
 
+          // TODO(burdon): Don't expand if moving cursor up/down.
           if (!view.hasFocus || state.readOnly || cursor < node.from || cursor > node.to) {
             builder.add(
               node.from,

package/src/extensions/{tasklist.ts → markdown/tasklist.ts}

@@ -6,6 +6,19 @@ import { syntaxTree } from '@codemirror/language';
 import { RangeSetBuilder } from '@codemirror/state';
 import { EditorView, Decoration, WidgetType, ViewPlugin, type DecorationSet, type ViewUpdate } from '@codemirror/view';
 
+import { getToken } from '../../styles';
+
+// TODO(burdon): Reconcile with theme.
+const styles = EditorView.baseTheme({
+  '& .cm-task': {
+    color: getToken('extend.colors.blue.500'),
+  },
+  '& .cm-task-checkbox': {
+    marginLeft: '4px',
+    marginRight: '4px',
+  },
+});
+
 class CheckboxWidget extends WidgetType {
   constructor(private _checked: boolean) {
     super();
@@ -17,6 +30,7 @@ class CheckboxWidget extends WidgetType {
 
   override toDOM(view: EditorView) {
     const input = document.createElement('input');
+    input.className = 'cm-task-checkbox';
     input.type = 'checkbox';
     input.checked = this._checked;
     if (view.state.readOnly) {
@@ -42,36 +56,8 @@ class CheckboxWidget extends WidgetType {
   }
 }
 
-const checkedDeco = Decoration.replace({ widget: new CheckboxWidget(true) });
-const uncheckedDeco = Decoration.replace({ widget: new CheckboxWidget(false) });
-
-export type TasklistOptions = {};
-
-export const tasklist = (options: TasklistOptions = {}) => {
-  return ViewPlugin.fromClass(
-    class {
-      decorations: DecorationSet;
-
-      constructor(view: EditorView) {
-        this.decorations = buildDecorations(view);
-      }
-
-      update(update: ViewUpdate) {
-        if (update.docChanged || update.viewportChanged || update.selectionSet) {
-          this.decorations = buildDecorations(update.view);
-        }
-      }
-    },
-    {
-      decorations: (v) => v.decorations,
-      // TODO(burdon): Is this still required?
-      provide: (plugin) =>
-        EditorView.atomicRanges.of((view) => {
-          return view.plugin(plugin)?.decorations || Decoration.none;
-        }),
-    },
-  );
-};
+const checkedDecoration = Decoration.replace({ widget: new CheckboxWidget(true) });
+const uncheckedDecoration = Decoration.replace({ widget: new CheckboxWidget(false) });
 
 const buildDecorations = (view: EditorView): DecorationSet => {
   const builder = new RangeSetBuilder<Decoration>();
@@ -81,10 +67,13 @@ const buildDecorations = (view: EditorView): DecorationSet => {
   for (const { from, to } of view.visibleRanges) {
     syntaxTree(state).iterate({
       enter: (node) => {
-        // Check if cursor is inside text.
-        if (node.name === 'TaskMarker' && (cursor < node.from || cursor > node.to)) {
-          const checked = state.doc.sliceString(node.from + 1, node.to - 1) === 'x';
-          builder.add(node.from, node.to, checked ? checkedDeco : uncheckedDeco);
+        if (node.name === 'TaskMarker') {
+          // Check if cursor is inside text.
+          if (cursor < node.from || cursor > node.to) {
+            const checked = state.doc.sliceString(node.from + 1, node.to - 1) === 'x';
+            builder.add(node.from - 2, node.from - 1, Decoration.mark({ class: 'cm-task' }));
+            builder.add(node.from, node.to, checked ? checkedDecoration : uncheckedDecoration);
+          }
         }
       },
       from,
@@ -94,3 +83,28 @@ const buildDecorations = (view: EditorView): DecorationSet => {
 
   return builder.finish();
 };
+
+export type TasklistOptions = {};
+
+export const tasklist = (options: TasklistOptions = {}) => {
+  return [
+    ViewPlugin.fromClass(
+      class {
+        decorations: DecorationSet;
+        constructor(view: EditorView) {
+          this.decorations = buildDecorations(view);
+        }
+
+        update(update: ViewUpdate) {
+          if (update.docChanged || update.viewportChanged || update.selectionSet) {
+            this.decorations = buildDecorations(update.view);
+          }
+        }
+      },
+      {
+        decorations: (value) => value.decorations,
+      },
+    ),
+    styles,
+  ];
+};

package/src/extensions/mention.ts

@@ -9,18 +9,25 @@ export type MentionOptions = {
   onSearch: (text: string) => string[];
 };
 
+// TODO(burdon): Can only have a single autocompletion. Merge configuration with autocomplete.
 export const mention = ({ onSearch }: MentionOptions): Extension => {
   return autocompletion({
+    // TODO(burdon): Not working.
+    activateOnTyping: true,
+    // activateOnTypingDelay: 100,
+    // selectOnOpen: true,
     closeOnBlur: false, // For debugging.
+    // defaultKeymap: false,
+    icons: false,
     override: [
       (context: CompletionContext): CompletionResult | null => {
+        console.log(context);
+
         const match = context.matchBefore(/@(\w+)?/);
         if (!match || (match.from === match.to && !context.explicit)) {
           return null;
         }
 
-        console.log(match);
-
         return {
           from: match.from,
           options: onSearch(match.text.slice(1).toLowerCase()).map((value) => ({ label: `@${value}` })),

package/src/hooks/awareness-provider.ts

@@ -29,9 +29,10 @@ export type AwarenessProviderParams = {
   info: AwarenessInfo;
 };
 
+/**
+ * Receives and broadcasts profile and cursor position.
+ */
 export class SpaceAwarenessProvider implements AwarenessProvider {
-  public readonly remoteStateChange = new Event<void>();
-
   private readonly _remoteStates = new Map<string, AwarenessState>();
 
   private readonly _space: Space;
@@ -39,9 +40,11 @@ export class SpaceAwarenessProvider implements AwarenessProvider {
   private readonly _peerId: string;
   private readonly _info: AwarenessInfo;
 
-  private _localState?: AwarenessState;
-  private _postTask?: DeferredTask;
   private _ctx?: Context;
+  private _postTask?: DeferredTask;
+  private _localState?: AwarenessState;
+
+  public readonly remoteStateChange = new Event<void>();
 
   constructor(params: AwarenessProviderParams) {
     this._space = params.space;
@@ -63,19 +66,20 @@ export class SpaceAwarenessProvider implements AwarenessProvider {
       }
     });
 
-    const unsubscribe = this._space.listen(this._channel, (message: GossipMessage) => {
-      switch (message.payload.kind) {
-        case 'query': {
-          this._handleQueryMessage();
-          break;
+    this._ctx.onDispose(
+      this._space.listen(this._channel, (message: GossipMessage) => {
+        switch (message.payload.kind) {
+          case 'query': {
+            this._handleQueryMessage();
+            break;
+          }
+          case 'post': {
+            this._handlePostMessage(message.payload);
+            break;
+          }
         }
-        case 'post': {
-          this._handlePostMessage(message.payload);
-          break;
-        }
-      }
-    });
-    this._ctx.onDispose(unsubscribe);
+      }),
+    );
 
     void this._space
       .postMessage(this._channel, {
@@ -92,6 +96,10 @@ export class SpaceAwarenessProvider implements AwarenessProvider {
     this._postTask = undefined;
   }
 
+  getRemoteStates(): AwarenessState[] {
+    return Array.from(this._remoteStates.values());
+  }
+
   update(position: AwarenessPosition | undefined): void {
     invariant(this._postTask);
     this._localState = {
@@ -103,10 +111,6 @@ export class SpaceAwarenessProvider implements AwarenessProvider {
     this._postTask.schedule();
   }
 
-  getRemoteStates(): AwarenessState[] {
-    return Array.from(this._remoteStates.values());
-  }
-
   private _handleQueryMessage() {
     invariant(this._postTask);
     this._postTask.schedule();

package/src/hooks/defs.ts

@@ -3,10 +3,8 @@
 //
 
 import { type Extension, StateField } from '@codemirror/state';
-import type * as YP from 'y-protocols/awareness';
 
 import { type DocAccessor } from '@dxos/echo-schema';
-import type { YText, YXmlFragment } from '@dxos/text-model';
 
 // Runtime data structure.
 export type Range = {
@@ -26,10 +24,7 @@ export type EditorModel = {
   extension?: Extension;
 
   // TODO(burdon): Remove.
-  content: string | YText | YXmlFragment | DocAccessor;
-
-  // TODO(burdon): Move into extension.
-  awareness?: YP.Awareness;
+  content: string | DocAccessor;
 
   // TODO(burdon): Remove.
   peer?: {

package/src/hooks/index.ts

@@ -2,9 +2,9 @@
 // Copyright 2023 DXOS.org
 //
 
-export * from './automerge';
 export * from './awareness-provider';
 export * from './defs';
-export * from './yjs';
 
+export * from './useActionHandler';
+export * from './useTextEditor';
 export * from './useTextModel';