@dxos/react-ui-editor 0.6.11 → 0.6.12-main.2d19bf1

package/dist/types/src/{extensions → state}/state.d.ts

@@ -1,4 +1,4 @@
-import { type Extension, type TransactionSpec } from '@codemirror/state';
+import { type EditorState, type Extension, type TransactionSpec } from '@codemirror/state';
 export type EditorSelection = {
     anchor: number;
     head?: number;
@@ -12,7 +12,7 @@ export type EditorStateOptions = {
     getState: (id: string) => EditorSelectionState | undefined;
 };
 export declare const localStorageStateStoreAdapter: EditorStateOptions;
-export declare const createEditorStateTransaction: ({ scrollTo, selection }: EditorSelectionState) => TransactionSpec;
+export declare const createEditorStateTransaction: (state: EditorState, { scrollTo, selection }: EditorSelectionState) => TransactionSpec;
 /**
  * Track scrolling and selection state to be restored when switching to document.
  */

package/dist/types/src/state/state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../../../src/state/state.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAe,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAWxG,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,eAAe,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC5D,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,oBAAoB,GAAG,SAAS,CAAC;CAC5D,CAAC;AAGF,eAAO,MAAM,6BAA6B,EAAE,kBAW3C,CAAC;AAEF,eAAO,MAAM,4BAA4B,UAChC,WAAW,2BACO,oBAAoB,KAC5C,eAOF,CAAC;AAEF;;GAEG;AAEH,eAAO,MAAM,KAAK,4BAA4B,OAAO,CAAC,kBAAkB,CAAC,KAAQ,SAuChF,CAAC"}

package/dist/types/src/state/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/state/types.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,KAAK,GAAG;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAIF,MAAM,MAAM,OAAO,GAAG;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC"}

package/dist/types/src/state/util.d.ts

@@ -0,0 +1,3 @@
+import { Facet } from '@codemirror/state';
+export declare const singleValueFacet: <I, O = I>(defaultValue?: O) => Facet<I, O>;
+//# sourceMappingURL=util.d.ts.map

package/dist/types/src/state/util.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../src/state/util.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,eAAO,MAAM,gBAAgB,GAAI,CAAC,EAAE,CAAC,qBAAqB,CAAC,gBAMvD,CAAC"}

package/dist/types/src/styles/markdown.d.ts

@@ -1,9 +1,8 @@
 export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
 export declare const theme: {
-    mark: string;
     code: string;
     codeMark: string;
-    blockquote: string;
+    mark: string;
     heading: (level: HeadingLevel) => string;
 };
 //# sourceMappingURL=markdown.d.ts.map

package/dist/types/src/styles/markdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../../../src/styles/markdown.ts"],"names":[],"mappings":"AAMA,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAYjD,eAAO,MAAM,KAAK;;;;;qBAMC,YAAY;CAG9B,CAAC"}
+{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../../../src/styles/markdown.ts"],"names":[],"mappings":"AAMA,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAYjD,eAAO,MAAM,KAAK;;;;qBAIC,YAAY;CAG9B,CAAC"}

package/dist/types/src/styles/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AAI3C,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,YAAY,EAAE,WA6M1B,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AAI3C,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,YAAY,EAAE,WA+M1B,CAAC"}

package/dist/types/src/util.d.ts

@@ -1,7 +1,13 @@
 import type { Transaction } from '@codemirror/state';
+import { type EditorView } from '@codemirror/view';
 /**
  * CodeMirror callbacks swallow errors so wrap handlers.
  */
 export declare const callbackWrapper: <T extends Function>(fn: T) => T;
+/**
+ * Log all changes before dispatching them to the view.
+ * https://codemirror.net/docs/ref/#view.EditorView.dispatch
+ */
+export declare const debugDispatcher: (trs: readonly Transaction[], view: EditorView) => void;
 export declare const logChanges: (trs: readonly Transaction[]) => void;
 //# sourceMappingURL=util.d.ts.map

package/dist/types/src/util.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../src/util.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD;;GAEG;AAEH,eAAO,MAAM,eAAe,GAAI,CAAC,SAAS,QAAQ,MAAM,CAAC,KAAG,CAOxC,CAAC;AAErB,eAAO,MAAM,UAAU,QAAS,SAAS,WAAW,EAAE,SAmBrD,CAAC"}
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../src/util.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAInD;;GAEG;AAEH,eAAO,MAAM,eAAe,GAAI,CAAC,SAAS,QAAQ,MAAM,CAAC,KAAG,CAOxC,CAAC;AAErB;;;GAGG;AACH,eAAO,MAAM,eAAe,QAAS,SAAS,WAAW,EAAE,QAAQ,UAAU,SAG5E,CAAC;AAEF,eAAO,MAAM,UAAU,QAAS,SAAS,WAAW,EAAE,SAmBrD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-editor",
-  "version": "0.6.11",
+  "version": "0.6.12-main.2d19bf1",
   "description": "Document editing experience within a DXOS shell.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -9,7 +9,19 @@
   "exports": {
     ".": {
       "browser": "./dist/lib/browser/index.mjs",
+      "node": {
+        "require": "./dist/lib/node/index.cjs",
+        "default": "./dist/lib/node-esm/index.mjs"
+      },
       "types": "./dist/types/src/index.d.ts"
+    },
+    "./state": {
+      "browser": "./dist/lib/browser/state/index.mjs",
+      "node": {
+        "require": "./dist/lib/node/state/index.cjs",
+        "default": "./dist/lib/node-esm/state/index.mjs"
+      },
+      "types": "./dist/types/src/state/index.d.ts"
     }
   },
   "types": "dist/types/src/index.d.ts",
@@ -21,23 +33,24 @@
     "src"
   ],
   "dependencies": {
-    "@codemirror/autocomplete": "^6.18.0",
-    "@codemirror/commands": "^6.6.0",
+    "@codemirror/autocomplete": "^6.18.1",
+    "@codemirror/commands": "^6.6.2",
     "@codemirror/lang-javascript": "^6.2.2",
-    "@codemirror/lang-markdown": "^6.2.5",
-    "@codemirror/language": "^6.10.2",
+    "@codemirror/lang-markdown": "^6.3.0",
+    "@codemirror/language": "^6.10.3",
     "@codemirror/language-data": "^6.5.1",
-    "@codemirror/lint": "^6.8.1",
+    "@codemirror/lint": "^6.8.2",
     "@codemirror/search": "^6.5.6",
     "@codemirror/state": "^6.4.1",
     "@codemirror/theme-one-dark": "^6.1.2",
-    "@codemirror/view": "^6.29.1",
+    "@codemirror/view": "^6.34.1",
     "@fluentui/react-tabster": "^9.19.0",
-    "@lezer/common": "^1.2.1",
-    "@lezer/highlight": "^1.2.0",
-    "@lezer/markdown": "^1.3.0",
+    "@lezer/common": "^1.2.2",
+    "@lezer/generator": "^1.7.1",
+    "@lezer/highlight": "^1.2.1",
+    "@lezer/markdown": "^1.3.1",
     "@radix-ui/react-context": "^1.0.0",
-    "@replit/codemirror-vim": "^6.0.14",
+    "@replit/codemirror-vim": "^6.2.1",
     "@replit/codemirror-vscode-keymap": "^6.0.2",
     "codemirror": "^6.0.1",
     "lib0": "^0.2.65",
@@ -47,19 +60,19 @@
     "lodash.sortby": "^4.7.0",
     "react-dropzone": "^14.2.3",
     "style-mod": "^4.1.0",
-    "@dxos/async": "0.6.11",
-    "@dxos/automerge": "0.6.11",
-    "@dxos/context": "0.6.11",
-    "@dxos/debug": "0.6.11",
-    "@dxos/display-name": "0.6.11",
-    "@dxos/echo-schema": "0.6.11",
-    "@dxos/log": "0.6.11",
-    "@dxos/react-ui": "0.6.11",
-    "@dxos/react-ui-theme": "0.6.11",
-    "@dxos/protocols": "0.6.11",
-    "@dxos/react-hooks": "0.6.11",
-    "@dxos/util": "0.6.11",
-    "@dxos/invariant": "0.6.11"
+    "@dxos/async": "0.6.12-main.2d19bf1",
+    "@dxos/automerge": "0.6.12-main.2d19bf1",
+    "@dxos/context": "0.6.12-main.2d19bf1",
+    "@dxos/debug": "0.6.12-main.2d19bf1",
+    "@dxos/echo-schema": "0.6.12-main.2d19bf1",
+    "@dxos/display-name": "0.6.12-main.2d19bf1",
+    "@dxos/invariant": "0.6.12-main.2d19bf1",
+    "@dxos/protocols": "0.6.12-main.2d19bf1",
+    "@dxos/react-ui": "0.6.12-main.2d19bf1",
+    "@dxos/log": "0.6.12-main.2d19bf1",
+    "@dxos/react-hooks": "0.6.12-main.2d19bf1",
+    "@dxos/react-ui-theme": "0.6.12-main.2d19bf1",
+    "@dxos/util": "0.6.12-main.2d19bf1"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.1.5",
@@ -67,6 +80,8 @@
     "@testing-library/dom": "^8.17.1",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^14.4.3",
+    "@types/chai": "^4.2.15",
+    "@types/chai-dom": "^1.11.0",
     "@types/lodash.defaultsdeep": "^4.6.6",
     "@types/lodash.get": "^4.4.7",
     "@types/lodash.merge": "^4.6.6",
@@ -74,29 +89,31 @@
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
     "@types/react-test-renderer": "^17.0.2",
+    "chai": "^4.4.1",
+    "chai-dom": "^1.11.0",
     "happy-dom": "^13.3.1",
     "jsdom": "^24.0.0",
+    "mocha": "^10.6.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "react-test-renderer": "~18.2.0",
-    "vite": "^5.3.4",
+    "vite": "5.4.7",
     "vite-plugin-top-level-await": "^1.4.1",
     "vite-plugin-wasm": "^3.3.0",
-    "@dxos/automerge": "0.6.11",
-    "@dxos/config": "0.6.11",
-    "@dxos/echo-signals": "0.6.11",
-    "@dxos/echo-typegen": "0.6.11",
-    "@dxos/keyboard": "0.6.11",
-    "@dxos/random": "0.6.11",
-    "@dxos/react-client": "0.6.11",
-    "@dxos/react-ui": "0.6.11",
-    "@dxos/storybook-utils": "0.6.11"
+    "@dxos/automerge": "0.6.12-main.2d19bf1",
+    "@dxos/config": "0.6.12-main.2d19bf1",
+    "@dxos/echo-signals": "0.6.12-main.2d19bf1",
+    "@dxos/keyboard": "0.6.12-main.2d19bf1",
+    "@dxos/random": "0.6.12-main.2d19bf1",
+    "@dxos/react-client": "0.6.12-main.2d19bf1",
+    "@dxos/react-ui": "0.6.12-main.2d19bf1",
+    "@dxos/storybook-utils": "0.6.12-main.2d19bf1"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.1.5",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
-    "@dxos/react-client": "0.6.11"
+    "react": "~18.2.0",
+    "react-dom": "~18.2.0",
+    "@dxos/react-client": "0.6.12-main.2d19bf1"
   },
   "publishConfig": {
     "access": "public"

package/src/TextEditor.stories.tsx

@@ -3,6 +3,7 @@
 //
 
 import '@dxos-theme';
+
 import { javascript } from '@codemirror/lang-javascript';
 import { markdown } from '@codemirror/lang-markdown';
 import { openSearchPanel } from '@codemirror/search';
@@ -46,18 +47,16 @@ import {
   linkTooltip,
   listener,
   mention,
-  state,
   table,
   typewriter,
   type CommandAction,
-  type Comment,
   type CommentsOptions,
-  type EditorSelectionState,
   debugTree,
   type DebugNode,
 } from './extensions';
 import { renderRoot } from './extensions/util';
 import { useTextEditor, type UseTextEditorProps } from './hooks';
+import { type Comment, type EditorSelectionState, state } from './state';
 import translations from './translations';
 
 faker.seed(101);
@@ -164,8 +163,8 @@ const content = {
     '> This is a long wrapping block quote. Neque reiciendis ullam quae error labore sit, at, et, nulla, aut at nostrum omnis quas nostrum, at consectetur vitae eos asperiores non omnis ullam in beatae at vitae deserunt asperiores sapiente.',
     '',
     '> This is ...',
-    '> ... a multi-line ...',
-    '> block quote.',
+    '... a multi-line ...',
+    'block quote.',
     '',
   ),
 
@@ -254,7 +253,7 @@ const renderLinkButton = (el: Element, url: string) => {
 // Story
 //
 
-type DebugMode = 'syntax' | 'raw';
+type DebugMode = 'raw' | 'tree' | 'raw+tree';
 
 type StoryProps = {
   id?: string;
@@ -317,16 +316,16 @@ const Story = ({
   return (
     <div className='flex w-full'>
       <div role='none' className='flex w-full overflow-hidden' ref={parentRef} {...focusAttributes} />
-      {debug === 'raw' && (
-        <div className='w-[800px] border-l border-separator overflow-auto'>
-          <pre className='p-1 font-mono text-xs text-green-800 dark:text-green-200'>{view?.state.doc.toString()}</pre>
-        </div>
-      )}
-      {debug === 'syntax' && (
-        <div className='w-[800px] border-l border-separator overflow-auto'>
-          <pre className='p-1 font-mono text-xs text-green-800 dark:text-green-200'>
-            {JSON.stringify(tree, null, 2)}
-          </pre>
+      {debug && (
+        <div className='flex flex-col w-[800px] border-l border-separator divide-y divide-separator overflow-auto'>
+          {(debug === 'raw' || debug === 'raw+tree') && (
+            <pre className='p-1 font-mono text-xs text-green-800 dark:text-green-200'>{view?.state.doc.toString()}</pre>
+          )}
+          {(debug === 'tree' || debug === 'raw+tree') && (
+            <pre className='p-1 font-mono text-xs text-green-800 dark:text-green-200'>
+              {JSON.stringify(tree, null, 2)}
+            </pre>
+          )}
         </div>
       )}
     </div>
@@ -452,6 +451,12 @@ export const ScrollTo = {
 // Markdown
 //
 
+export const Blockquote = {
+  render: () => (
+    <Story text={str('> Blockquote', 'continuation', content.footer)} extensions={decorateMarkdown()} debug='raw' />
+  ),
+};
+
 export const Headings = {
   render: () => <Story text={headings} extensions={decorateMarkdown({ numberedHeadings: { from: 2, to: 4 } })} />,
 };
@@ -486,7 +491,7 @@ export const OrderedList = {
 };
 
 export const TaskList = {
-  render: () => <Story text={str(content.tasks, content.footer)} extensions={[decorateMarkdown()]} debug='raw' />,
+  render: () => <Story text={str(content.tasks, content.footer)} extensions={[decorateMarkdown()]} debug='raw+tree' />,
 };
 
 export const Table = {

package/src/defaults.ts

@@ -8,8 +8,6 @@ import { mx } from '@dxos/react-ui-theme';
 
 import { fontMono } from './styles';
 
-// TODO(burdon): Define scrollMargins for fixed gutter?
-//  https://codemirror.net/docs/ref/#view.EditorView^scrollMargins
 const margin = '!mt-[1rem]';
 
 /**

package/src/extensions/annotations.ts

@@ -7,7 +7,7 @@ import { Decoration, EditorView } from '@codemirror/view';
 
 import { isNotFalsy } from '@dxos/util';
 
-import { Cursor } from './cursor';
+import { Cursor } from '../state';
 
 type Annotation = {
   cursor: string;

package/src/extensions/autocomplete.ts

@@ -2,10 +2,6 @@
 // Copyright 2023 DXOS.org
 //
 
-// https://codemirror.net/examples/autocompletion
-// https://codemirror.net/docs/ref/#autocomplete.autocompletion
-// https://codemirror.net/docs/ref/#autocomplete.Completion
-
 import {
   autocompletion,
   completionKeymap,
@@ -15,6 +11,7 @@ import {
   type CompletionResult,
 } from '@codemirror/autocomplete';
 import { markdownLanguage } from '@codemirror/lang-markdown';
+import { type Extension } from '@codemirror/state';
 import { keymap } from '@codemirror/view';
 
 export type AutocompleteResult = Completion;
@@ -25,11 +22,15 @@ export type AutocompleteOptions = {
   onSearch?: (text: string) => Completion[];
 };
 
+// https://codemirror.net/examples/autocompletion
+// https://codemirror.net/docs/ref/#autocomplete.autocompletion
+// https://codemirror.net/docs/ref/#autocomplete.Completion
+
 /**
  * Autocomplete extension.
  */
-export const autocomplete = ({ activateOnTyping, override, onSearch }: AutocompleteOptions = {}) => {
-  const extentions = [
+export const autocomplete = ({ activateOnTyping, override, onSearch }: AutocompleteOptions = {}): Extension => {
+  const extensions: Extension[] = [
     // https://codemirror.net/docs/ref/#view.keymap
     // https://discuss.codemirror.net/t/how-can-i-replace-the-default-autocompletion-keymap-v6/3322
     // TODO(burdon): Set custom keymap.
@@ -50,7 +51,7 @@ export const autocomplete = ({ activateOnTyping, override, onSearch }: Autocompl
   ];
 
   if (onSearch) {
-    extentions.push(
+    extensions.push(
       // TODO(burdon): Optional decoration via addToOptions
       markdownLanguage.data.of({
         autocomplete: (context: CompletionContext): CompletionResult | null => {
@@ -68,5 +69,5 @@ export const autocomplete = ({ activateOnTyping, override, onSearch }: Autocompl
     );
   }
 
-  return extentions;
+  return extensions;
 };

package/src/extensions/automerge/automerge.stories.tsx

@@ -129,7 +129,7 @@ export const WithEcho = {
         count={2}
         component={EchoStory}
         createSpace
-        onCreateSpace={async (space) => {
+        onSpaceCreated={async ({ space }) => {
           space.db.add(
             create({
               type: 'test',

package/src/extensions/automerge/{automerge.spec.tsx → automerge.test.tsx}

@@ -5,6 +5,7 @@
 import { EditorState } from '@codemirror/state';
 import { EditorView } from '@codemirror/view';
 import { render, screen } from '@testing-library/react';
+// TODO(wittjosiah): Move to vitest expect.
 import chai, { expect } from 'chai';
 import chaiDom from 'chai-dom';
 import get from 'lodash.get';

package/src/extensions/automerge/automerge.ts

@@ -1,5 +1,5 @@
 //
-// Copyright 2023 DXOS.org
+// Copyright 2024 DXOS.org
 // Copyright 2024 Automerge
 // Ref: https://github.com/automerge/automerge-codemirror
 //
@@ -13,7 +13,7 @@ import { type DocAccessor } from '@dxos/react-client/echo';
 import { cursorConverter } from './cursor';
 import { updateHeadsEffect, isReconcile, type State } from './defs';
 import { Syncer } from './sync';
-import { Cursor } from '../cursor';
+import { Cursor } from '../../state';
 
 export const automerge = (accessor: DocAccessor): Extension => {
   const syncState = StateField.define<State>({

package/src/extensions/automerge/cursor.ts

@@ -5,7 +5,7 @@
 import { log } from '@dxos/log';
 import { type DocAccessor, fromCursor, toCursor } from '@dxos/react-client/echo';
 
-import { type CursorConverter } from '../cursor';
+import { type CursorConverter } from '../../state';
 
 export const cursorConverter = (accessor: DocAccessor): CursorConverter => ({
   toCursor: (pos, assoc) => {

package/src/extensions/awareness/awareness.ts

@@ -2,7 +2,7 @@
 // Copyright 2024 DXOS.org
 //
 
-import { Annotation, Facet, type Extension, RangeSet, type Range } from '@codemirror/state';
+import { Annotation, type Extension, RangeSet, type Range } from '@codemirror/state';
 import {
   Decoration,
   type DecorationSet,
@@ -16,7 +16,7 @@ import {
 import { Event } from '@dxos/async';
 import { Context } from '@dxos/context';
 
-import { Cursor, type CursorConverter } from '../cursor';
+import { singleValueFacet, Cursor, type CursorConverter } from '../../state';
 
 export interface AwarenessProvider {
   remoteStateChange: Event<void>;
@@ -38,9 +38,7 @@ const dummyProvider: AwarenessProvider = {
   update: () => {},
 };
 
-export const awarenessProvider = Facet.define<AwarenessProvider, AwarenessProvider>({
-  combine: (providers) => providers[0] ?? dummyProvider,
-});
+export const awarenessProvider = singleValueFacet<AwarenessProvider>(dummyProvider);
 
 // TODO(dmaretskyi): Specify the users that actually changed. Currently, we recalculate positions for every user.
 const RemoteSelectionChangedAnnotation = Annotation.define();

package/src/extensions/command/hint.ts

@@ -7,7 +7,7 @@ import { Decoration, EditorView, ViewPlugin, type ViewUpdate, WidgetType } from
 
 import { type CommandOptions } from './command';
 import { commandState } from './state';
-import { clientRectsFor, flattenRect } from '../util/dom';
+import { clientRectsFor, flattenRect } from '../util';
 
 class CommandHint extends WidgetType {
   constructor(readonly content: string | HTMLElement) {

package/src/extensions/command/state.ts

@@ -2,7 +2,7 @@
 // Copyright 2024 DXOS.org
 //
 
-import { Facet, StateEffect, StateField } from '@codemirror/state';
+import { StateEffect, StateField } from '@codemirror/state';
 import {
   type Command,
   type EditorView,
@@ -13,14 +13,13 @@ import {
 } from '@codemirror/view';
 
 import { type CommandOptions } from './command';
+import { singleValueFacet } from '../../state';
 
 type CommandState = {
   tooltip?: Tooltip | null;
 };
 
-export const commandConfig = Facet.define<CommandOptions, Required<CommandOptions>>({
-  combine: (providers) => providers[0],
-});
+export const commandConfig = singleValueFacet<CommandOptions>();
 
 export const commandState = StateField.define<CommandState>({
   create: () => ({}),