@dxos/react-ui-editor 0.8.1-main.ba2dec9 → 0.8.1-staging.31c3ee1

package/dist/types/src/extensions/comments.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"comments.d.ts","sourceRoot":"","sources":["../../../../src/extensions/comments.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"comments.d.ts","sourceRoot":"","sources":["../../../../src/extensions/comments.ts"],"names":[],"mappings":"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"}

package/dist/types/src/extensions/factories.d.ts

@@ -24,7 +24,8 @@ export type BasicExtensionsOptions = {
     lineNumbers?: boolean;
     lineWrapping?: boolean;
     placeholder?: string;
-    readonly?: boolean;
+    /** If true user cannot edit the text, but they can still select and copy it. */
+    readOnly?: boolean;
     search?: boolean;
     scrollPastEnd?: boolean;
     standardKeymap?: boolean;

package/dist/types/src/extensions/factories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"factories.d.ts","sourceRoot":"","sources":["../../../../src/extensions/factories.ts"],"names":[],"mappings":"AAQA,OAAO,EAAe,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAkBhE,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAOhD,OAAO,EAAE,KAAK,WAAW,EAAgB,MAAM,WAAW,CAAC;AAM3D,eAAO,MAAM,cAAc,WAA4E,CAAC;AAExG;;;;GAIG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,UAAU,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAsBF,eAAO,MAAM,qBAAqB,YAAa,sBAAsB,KAAG,SA8CvE,CAAC;AAMF,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,KAAK,CAAC,EAAE;QACN,MAAM,CAAC,EAAE;YACP,SAAS,CAAC,EAAE,MAAM,CAAC;SACpB,CAAC;QACF,OAAO,CAAC,EAAE;YACR,SAAS,CAAC,EAAE,MAAM,CAAC;SACpB,CAAC;KACH,CAAC;CACH,CAAC;AAQF;;GAEG;AACH,eAAO,MAAM,qBAAqB,oFAK/B,sBAAsB,KAAQ,SAWhC,CAAC;AAMF,MAAM,MAAM,mBAAmB,CAAC,CAAC,IAAI;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;CAC5B,CAAC;AAGF,eAAO,MAAM,oBAAoB,GAAI,CAAC,iCAAiC,mBAAmB,CAAC,CAAC,CAAC,KAAG,SAAS,EA2BxG,CAAC"}
+{"version":3,"file":"factories.d.ts","sourceRoot":"","sources":["../../../../src/extensions/factories.ts"],"names":[],"mappings":"AAQA,OAAO,EAAe,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAkBhE,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAOhD,OAAO,EAAE,KAAK,WAAW,EAAgB,MAAM,WAAW,CAAC;AAM3D,eAAO,MAAM,cAAc,WAA4E,CAAC;AAExG;;;;GAIG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,UAAU,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAqBF,eAAO,MAAM,qBAAqB,YAAa,sBAAsB,KAAG,SA+CvE,CAAC;AAMF,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,KAAK,CAAC,EAAE;QACN,MAAM,CAAC,EAAE;YACP,SAAS,CAAC,EAAE,MAAM,CAAC;SACpB,CAAC;QACF,OAAO,CAAC,EAAE;YACR,SAAS,CAAC,EAAE,MAAM,CAAC;SACpB,CAAC;KACH,CAAC;CACH,CAAC;AAQF;;GAEG;AACH,eAAO,MAAM,qBAAqB,oFAK/B,sBAAsB,KAAQ,SAWhC,CAAC;AAMF,MAAM,MAAM,mBAAmB,CAAC,CAAC,IAAI;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;CAC5B,CAAC;AAGF,eAAO,MAAM,oBAAoB,GAAI,CAAC,iCAAiC,mBAAmB,CAAC,CAAC,CAAC,KAAG,SAAS,EA2BxG,CAAC"}

package/dist/types/src/{styles/stack-item-content-class-names.d.ts → fragments.d.ts}

@@ -1,3 +1,3 @@
 export declare const stackItemContentEditorClassNames: (role?: string) => string;
 export declare const stackItemContentToolbarClassNames: (role?: string) => string;
-//# sourceMappingURL=stack-item-content-class-names.d.ts.map
+//# sourceMappingURL=fragments.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"fragments.d.ts","sourceRoot":"","sources":["../../../src/fragments.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,gCAAgC,UAAW,MAAM,WAI3D,CAAC;AAEJ,eAAO,MAAM,iCAAiC,UAAW,MAAM,WAI5D,CAAC"}

package/dist/types/src/hooks/useTextEditor.d.ts

@@ -1,13 +1,13 @@
 import { type EditorStateConfig } from '@codemirror/state';
 import { EditorView } from '@codemirror/view';
-import { useFocusableGroup } from '@fluentui/react-tabster';
+import { type TabsterTypes } from '@fluentui/react-tabster';
 import { type DependencyList, type KeyboardEventHandler, type RefObject } from 'react';
 import { type MaybeProvider } from '@dxos/util';
 import { type EditorSelection } from '../extensions';
 export type UseTextEditor = {
     parentRef: RefObject<HTMLDivElement>;
     view?: EditorView;
-    focusAttributes: ReturnType<typeof useFocusableGroup> & {
+    focusAttributes?: TabsterTypes.TabsterDOMAttribute & {
         tabIndex: 0;
         onKeyUp: KeyboardEventHandler<HTMLDivElement>;
     };
@@ -31,7 +31,7 @@ export type UseTextEditorProps = Pick<EditorStateConfig, 'extensions'> & {
     debug?: boolean;
 };
 /**
- * Hook for creating editor.
+ * Creates codemirror text editor.
  */
 export declare const useTextEditor: (props?: MaybeProvider<UseTextEditorProps>, deps?: DependencyList) => UseTextEditor;
 //# sourceMappingURL=useTextEditor.d.ts.map

package/dist/types/src/hooks/useTextEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTextEditor.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useTextEditor.ts"],"names":[],"mappings":"AAIA,OAAO,EAAe,KAAK,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,oBAAoB,EACzB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAgC,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAE9E,OAAO,EAAmB,KAAK,eAAe,EAA4C,MAAM,eAAe,CAAC;AAGhH,MAAM,MAAM,aAAa,GAAG;IAE1B,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,eAAe,EAAE,UAAU,CAAC,OAAO,iBAAiB,CAAC,GAAG;QACtD,QAAQ,EAAE,CAAC,CAAC;QACZ,OAAO,EAAE,oBAAoB,CAAC,cAAc,CAAC,CAAC;KAC/C,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,EAAE,YAAY,CAAC,GAAG;IACvE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAIF;;GAEG;AACH,eAAO,MAAM,aAAa,WACjB,aAAa,CAAC,kBAAkB,CAAC,SAClC,cAAc,KACnB,aAsHF,CAAC"}
+{"version":3,"file":"useTextEditor.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useTextEditor.ts"],"names":[],"mappings":"AAIA,OAAO,EAAe,KAAK,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAqB,KAAK,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAC/E,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,oBAAoB,EACzB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAgC,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAE9E,OAAO,EAAE,KAAK,eAAe,EAA6D,MAAM,eAAe,CAAC;AAGhH,MAAM,MAAM,aAAa,GAAG;IAE1B,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,eAAe,CAAC,EAAE,YAAY,CAAC,mBAAmB,GAAG;QACnD,QAAQ,EAAE,CAAC,CAAC;QACZ,OAAO,EAAE,oBAAoB,CAAC,cAAc,CAAC,CAAC;KAC/C,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,EAAE,YAAY,CAAC,GAAG;IACvE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAIF;;GAEG;AACH,eAAO,MAAM,aAAa,WACjB,aAAa,CAAC,kBAAkB,CAAC,SAClC,cAAc,KACnB,aA+HF,CAAC"}

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

@@ -7,7 +7,6 @@ export * from './components';
 export * from './defaults';
 export * from './extensions';
 export * from './hooks';
-export { stackItemContentEditorClassNames, stackItemContentToolbarClassNames, } from './styles/stack-item-content-class-names';
 export * from './types';
 export * from './util';
 export { translations };

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EAAE,KAAK,SAAS,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAC;AAEtE,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,OAAO,EACL,gCAAgC,EAChC,iCAAiC,GAClC,MAAM,yCAAyC,CAAC;AACjD,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AAEvB,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EAAE,KAAK,SAAS,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAC;AAEtE,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AAEvB,OAAO,EAAE,YAAY,EAAE,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,WA8M1B,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,WAmN1B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-editor",
-  "version": "0.8.1-main.ba2dec9",
+  "version": "0.8.1-staging.31c3ee1",
   "description": "Document editing experience within a DXOS shell.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -35,7 +35,7 @@
     "@codemirror/state": "^6.4.1",
     "@codemirror/theme-one-dark": "^6.1.2",
     "@codemirror/view": "^6.34.1",
-    "@fluentui/react-tabster": "9.23.3",
+    "@fluentui/react-tabster": "^9.24.2",
     "@lezer/common": "^1.2.2",
     "@lezer/generator": "^1.7.1",
     "@lezer/highlight": "^1.2.1",
@@ -51,20 +51,20 @@
     "lodash.merge": "^4.6.2",
     "lodash.sortby": "^4.7.0",
     "style-mod": "^4.1.0",
-    "@dxos/app-graph": "0.8.1-main.ba2dec9",
-    "@dxos/async": "0.8.1-main.ba2dec9",
-    "@dxos/automerge": "0.8.1-main.ba2dec9",
-    "@dxos/context": "0.8.1-main.ba2dec9",
-    "@dxos/debug": "0.8.1-main.ba2dec9",
-    "@dxos/echo-schema": "0.8.1-main.ba2dec9",
-    "@dxos/display-name": "0.8.1-main.ba2dec9",
-    "@dxos/live-object": "0.8.1-main.ba2dec9",
-    "@dxos/invariant": "0.8.1-main.ba2dec9",
-    "@dxos/log": "0.8.1-main.ba2dec9",
-    "@dxos/protocols": "0.8.1-main.ba2dec9",
-    "@dxos/react-hooks": "0.8.1-main.ba2dec9",
-    "@dxos/react-ui-menu": "0.8.1-main.ba2dec9",
-    "@dxos/util": "0.8.1-main.ba2dec9"
+    "@dxos/app-graph": "0.8.1-staging.31c3ee1",
+    "@dxos/async": "0.8.1-staging.31c3ee1",
+    "@dxos/context": "0.8.1-staging.31c3ee1",
+    "@dxos/automerge": "0.8.1-staging.31c3ee1",
+    "@dxos/echo-schema": "0.8.1-staging.31c3ee1",
+    "@dxos/display-name": "0.8.1-staging.31c3ee1",
+    "@dxos/live-object": "0.8.1-staging.31c3ee1",
+    "@dxos/debug": "0.8.1-staging.31c3ee1",
+    "@dxos/log": "0.8.1-staging.31c3ee1",
+    "@dxos/react-hooks": "0.8.1-staging.31c3ee1",
+    "@dxos/protocols": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-menu": "0.8.1-staging.31c3ee1",
+    "@dxos/util": "0.8.1-staging.31c3ee1",
+    "@dxos/invariant": "0.8.1-staging.31c3ee1"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.1.5",
@@ -88,23 +88,23 @@
     "vite": "5.4.7",
     "vite-plugin-top-level-await": "^1.4.1",
     "vite-plugin-wasm": "^3.3.0",
-    "@dxos/automerge": "0.8.1-main.ba2dec9",
-    "@dxos/config": "0.8.1-main.ba2dec9",
-    "@dxos/echo-signals": "0.8.1-main.ba2dec9",
-    "@dxos/keyboard": "0.8.1-main.ba2dec9",
-    "@dxos/react-client": "0.8.1-main.ba2dec9",
-    "@dxos/random": "0.8.1-main.ba2dec9",
-    "@dxos/react-ui": "0.8.1-main.ba2dec9",
-    "@dxos/react-ui-theme": "0.8.1-main.ba2dec9",
-    "@dxos/storybook-utils": "0.8.1-main.ba2dec9"
+    "@dxos/automerge": "0.8.1-staging.31c3ee1",
+    "@dxos/config": "0.8.1-staging.31c3ee1",
+    "@dxos/echo-signals": "0.8.1-staging.31c3ee1",
+    "@dxos/random": "0.8.1-staging.31c3ee1",
+    "@dxos/keyboard": "0.8.1-staging.31c3ee1",
+    "@dxos/react-client": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-theme": "0.8.1-staging.31c3ee1",
+    "@dxos/storybook-utils": "0.8.1-staging.31c3ee1"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.1.5",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/react-client": "0.8.1-main.ba2dec9",
-    "@dxos/react-ui-theme": "0.8.1-main.ba2dec9",
-    "@dxos/react-ui": "0.8.1-main.ba2dec9"
+    "@dxos/react-client": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-theme": "0.8.1-staging.31c3ee1"
   },
   "publishConfig": {
     "access": "public"

package/src/InputMode.stories.tsx

@@ -24,9 +24,9 @@ import {
 import { useActionHandler, useTextEditor, type UseTextEditorProps } from './hooks';
 import translations from './translations';
 
-type StoryProps = { placeholder?: string; readonly?: boolean } & UseTextEditorProps;
+type StoryProps = { placeholder?: string; readOnly?: boolean } & UseTextEditorProps;
 
-const DefaultStory = ({ autoFocus, initialValue, placeholder, readonly }: StoryProps) => {
+const DefaultStory = ({ autoFocus, initialValue, placeholder, readOnly }: StoryProps) => {
   const { themeMode } = useThemeContext();
   const toolbarState = useEditorToolbarState({ viewMode: 'source' });
   const trackFormatting = useFormattingState(toolbarState);
@@ -38,7 +38,7 @@ const DefaultStory = ({ autoFocus, initialValue, placeholder, readonly }: StoryP
       moveToEndOfLine: true,
       extensions: [
         editorInputMode ? InputModeExtensions[editorInputMode] : [],
-        createBasicExtensions({ placeholder, lineWrapping: true, readonly }),
+        createBasicExtensions({ placeholder, lineWrapping: true, readOnly }),
         createMarkdownExtensions({ themeMode }),
         createThemeExtensions({ themeMode, syntaxHighlighting: true }),
         decorateMarkdown(),
@@ -46,7 +46,7 @@ const DefaultStory = ({ autoFocus, initialValue, placeholder, readonly }: StoryP
         trackFormatting,
       ],
     }),
-    [editorInputMode, themeMode, placeholder, readonly],
+    [editorInputMode, themeMode, placeholder, readOnly],
   );
 
   const handleAction = useActionHandler(view);

package/src/TextEditor.stories.tsx

@@ -4,12 +4,13 @@
 
 import '@dxos-theme';
 
+import { type Completion } from '@codemirror/autocomplete';
 import { javascript } from '@codemirror/lang-javascript';
 import { markdown } from '@codemirror/lang-markdown';
 import { openSearchPanel } from '@codemirror/search';
 import { type Extension } from '@codemirror/state';
 import { type EditorView } from '@codemirror/view';
-import { ArrowSquareOut, X } from '@phosphor-icons/react';
+import { X } from '@phosphor-icons/react';
 import { effect, useSignal } from '@preact/signals-react';
 import defaultsDeep from 'lodash.defaultsdeep';
 import React, { useEffect, useState, type FC, type KeyboardEvent } from 'react';
@@ -22,9 +23,9 @@ import { create } from '@dxos/live-object';
 import { log } from '@dxos/log';
 import { faker } from '@dxos/random';
 import { createDocAccessor, createObject } from '@dxos/react-client/echo';
-import { Button, Input, useThemeContext } from '@dxos/react-ui';
-import { baseSurface, getSize, mx } from '@dxos/react-ui-theme';
-import { withLayout, withTheme } from '@dxos/storybook-utils';
+import { Button, Icon, IconButton, Input, ThemeProvider, useThemeContext } from '@dxos/react-ui';
+import { baseSurface, defaultTx, getSize, mx } from '@dxos/react-ui-theme';
+import { type Meta, withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { editorContent, editorGutter, editorMonospace } from './defaults';
 import {
@@ -202,7 +203,7 @@ const text = str(
   '=== LAST LINE ===',
 );
 
-const links = [
+const links: Completion[] = [
   { label: 'DXOS', apply: '[DXOS](https://dxos.org)' },
   { label: 'GitHub', apply: '[DXOS GitHub](https://github.com/dxos)' },
   { label: 'Automerge', apply: '[Automerge](https://automerge.org/)' },
@@ -215,16 +216,6 @@ const names = ['adam', 'alice', 'alison', 'bob', 'carol', 'charlie', 'sayuri', '
 const hover =
   'rounded-sm text-baseText text-primary-600 hover:text-primary-500 dark:text-primary-300 hover:dark:text-primary-200';
 
-const renderLinkTooltip = (el: Element, url: string) => {
-  const web = new URL(url);
-  createRoot(el).render(
-    <a href={url} target='_blank' rel='noreferrer' className={hover}>
-      {web.origin}
-      <ArrowSquareOut weight='bold' className={mx(getSize(4), 'inline-block leading-none mis-1')} />
-    </a>,
-  );
-};
-
 const Key: FC<{ char: string }> = ({ char }) => (
   <span className='flex justify-center items-center w-[24px] h-[24px] rounded text-xs bg-neutral-200 text-black'>
     {char}
@@ -244,11 +235,25 @@ const onCommentsHover: CommentsOptions['onHover'] = (el, shortcut) => {
   );
 };
 
+const renderLinkTooltip = (el: Element, url: string) => {
+  const web = new URL(url);
+  createRoot(el).render(
+    <ThemeProvider tx={defaultTx}>
+      <a href={url} target='_blank' rel='noreferrer' className={mx(hover, 'flex items-center gap-2')}>
+        {web.origin}
+        <Icon icon='ph--arrow-square-out--regular' size={4} />
+      </a>
+    </ThemeProvider>,
+  );
+};
+
 const renderLinkButton = (el: Element, url: string) => {
   createRoot(el).render(
-    <a href={url} target='_blank' rel='noreferrer' className={hover}>
-      <ArrowSquareOut weight='bold' className={mx(getSize(4), 'inline-block leading-none mis-1 mb-[2px]')} />
-    </a>,
+    <ThemeProvider tx={defaultTx}>
+      <a href={url} target='_blank' rel='noreferrer' className={mx(hover)}>
+        <Icon icon='ph--arrow-square-out--regular' size={4} classNames='inline-block mis-1 mb-[3px]' />
+      </a>
+    </ThemeProvider>,
   );
 };
 
@@ -262,7 +267,7 @@ type StoryProps = {
   id?: string;
   debug?: DebugMode;
   text?: string;
-  readonly?: boolean;
+  readOnly?: boolean;
   placeholder?: string;
   lineNumbers?: boolean;
   onReady?: (view: EditorView) => void;
@@ -273,7 +278,7 @@ const DefaultStory = ({
   debug,
   text,
   extensions,
-  readonly,
+  readOnly,
   placeholder = 'New document.',
   scrollTo,
   selection,
@@ -289,7 +294,7 @@ const DefaultStory = ({
       initialValue: text,
       extensions: [
         createDataExtensions({ id, text: createDocAccessor(object, ['content']) }),
-        createBasicExtensions({ readonly, placeholder, lineNumbers, scrollPastEnd: true }),
+        createBasicExtensions({ readOnly, placeholder, lineNumbers, scrollPastEnd: true }),
         createMarkdownExtensions({ themeMode }),
         createThemeExtensions({
           themeMode,
@@ -335,26 +340,22 @@ const DefaultStory = ({
   );
 };
 
-export default {
+const meta: Meta<typeof DefaultStory> = {
   title: 'ui/react-ui-editor/TextEditor',
   decorators: [withTheme, withLayout({ fullscreen: true })],
   render: DefaultStory,
   parameters: { translations, layout: 'fullscreen' },
 };
 
+export default meta;
+
 const defaultExtensions: Extension[] = [
-  autocomplete({
-    onSearch: (text) => links.filter(({ label }) => label.toLowerCase().includes(text.toLowerCase())),
-  }),
   decorateMarkdown({ renderLinkButton, selectionChangeDelay: 100 }),
   formattingKeymap(),
   linkTooltip(renderLinkTooltip),
 ];
 
 const allExtensions: Extension[] = [
-  autocomplete({
-    onSearch: (text) => links.filter(({ label }) => label.toLowerCase().includes(text.toLowerCase())),
-  }),
   decorateMarkdown({ numberedHeadings: { from: 2, to: 4 }, renderLinkButton, selectionChangeDelay: 100 }),
   formattingKeymap(),
   linkTooltip(renderLinkTooltip),
@@ -363,26 +364,50 @@ const allExtensions: Extension[] = [
   folding(),
 ];
 
+//
+// Default
+//
+
 export const Default = {
   render: () => <DefaultStory text={text} extensions={defaultExtensions} />,
 };
 
+//
+// Everything
+//
+
 export const Everything = {
   render: () => <DefaultStory text={text} extensions={allExtensions} selection={{ anchor: 99, head: 110 }} />,
 };
 
+//
+// Empty
+//
+
 export const Empty = {
   render: () => <DefaultStory extensions={defaultExtensions} />,
 };
 
+//
+// Readonly
+//
+
 export const Readonly = {
-  render: () => <DefaultStory text={text} extensions={defaultExtensions} readonly />,
+  render: () => <DefaultStory text={text} extensions={defaultExtensions} readOnly />,
 };
 
+//
+// No Extensions
+//
+
 export const NoExtensions = {
   render: () => <DefaultStory text={text} />,
 };
 
+//
+// Vim
+//
+
 export const Vim = {
   render: () => (
     <DefaultStory
@@ -511,6 +536,10 @@ export const Table = {
   render: () => <DefaultStory text={str(content.table, content.footer)} extensions={[decorateMarkdown(), table()]} />,
 };
 
+//
+// Commented out
+//
+
 export const CommentedOut = {
   render: () => (
     <DefaultStory
@@ -524,6 +553,10 @@ export const CommentedOut = {
   ),
 };
 
+//
+// Typescript
+//
+
 export const Typescript = {
   render: () => (
     <DefaultStory
@@ -545,13 +578,19 @@ export const Autocomplete = {
       extensions={[
         decorateMarkdown({ renderLinkButton }),
         autocomplete({
-          onSearch: (text) => links.filter(({ label }) => label.toLowerCase().includes(text.toLowerCase())),
+          onSearch: (text) => {
+            return links.filter(({ label }) => label.toLowerCase().includes(text.toLowerCase()));
+          },
         }),
       ]}
     />
   ),
 };
 
+//
+// Mention
+//
+
 export const Mention = {
   render: () => (
     <DefaultStory
@@ -565,6 +604,10 @@ export const Mention = {
   ),
 };
 
+//
+// Search
+//
+
 export const Search = {
   render: () => (
     <DefaultStory
@@ -575,10 +618,65 @@ export const Search = {
   ),
 };
 
+//
+// Command
+//
+
+export const Command = {
+  render: () => (
+    <DefaultStory
+      text={str('# Command', '', '', '[Test](dxn:queue:data:123)', '', '', '')}
+      extensions={[
+        command({
+          onHint: () => 'Press / for commands.',
+          onRenderMenu: (el, onClick) => {
+            renderRoot(
+              el,
+              <ThemeProvider tx={defaultTx}>
+                <Button classNames='p-1 aspect-square' onClick={onClick}>
+                  <Icon icon={'ph--sparkle--regular'} size={5} />
+                </Button>
+              </ThemeProvider>,
+            );
+          },
+          onRenderDialog: (el, onClose) => {
+            renderRoot(el, <CommandDialog onClose={onClose} />);
+          },
+          onRenderPreview: (el, { text }) => {
+            faker.seed(text.length);
+            const data = Array.from({ length: 2 }, () => faker.lorem.sentences(2));
+            renderRoot(
+              el,
+              <ThemeProvider tx={defaultTx}>
+                <div className='flex flex-col gap-2'>
+                  <div className='flex items-center gap-4'>
+                    <div className='grow truncate'>
+                      <span className='text-xs text-subdued mie-2'>Prompt</span>
+                      {text}
+                    </div>
+                    <div className='flex gap-1'>
+                      <IconButton classNames='text-green-500' label='Apply' icon={'ph--check--regular'} />
+                      <IconButton classNames='text-red-500' label='Cancel' icon={'ph--x--regular'} />
+                    </div>
+                  </div>
+                  <div>{data.join('\n\n')}</div>
+                </div>
+              </ThemeProvider>,
+            );
+          },
+        }),
+      ]}
+    />
+  ),
+};
+
 const CommandDialog = ({ onClose }: { onClose: (action?: CommandAction) => void }) => {
   const [text, setText] = useState('');
   const handleInsert = () => {
-    onClose(text.length ? { insert: text + '\n' } : undefined);
+    // TODO(burdon): Use queue ref.
+    const link = `[${text}](dxn:queue:data:123)`;
+    console.log({ link });
+    onClose(text.length ? { insert: link } : undefined);
   };
 
   const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {
@@ -595,38 +693,34 @@ const CommandDialog = ({ onClose }: { onClose: (action?: CommandAction) => void
   };
 
   return (
-    <div className={mx('flex items-center p-2 gap-2 border rounded-md', baseSurface)}>
-      <Input.Root>
-        <Input.TextInput
-          autoFocus={true}
-          placeholder='Enter command.'
-          value={text}
-          onChange={({ target: { value } }) => setText(value)}
-          onKeyDown={handleKeyDown}
-        />
-      </Input.Root>
-      <Button variant='ghost' classNames='pli-0' onClick={() => onClose()}>
-        <X className={getSize(5)} />
-      </Button>
+    <div className='flex w-full justify-center'>
+      <div
+        className={mx(
+          'flex w-full p-2 gap-2 items-center border border-separator rounded-md',
+          editorContent,
+          baseSurface,
+        )}
+      >
+        <Input.Root>
+          <Input.TextInput
+            autoFocus={true}
+            placeholder='Ask a question...'
+            value={text}
+            onChange={({ target: { value } }) => setText(value)}
+            onKeyDown={handleKeyDown}
+          />
+        </Input.Root>
+        <Button variant='ghost' classNames='pli-0' onClick={() => onClose()}>
+          <X className={getSize(5)} />
+        </Button>
+      </div>
     </div>
   );
 };
 
-export const Command = {
-  render: () => (
-    <DefaultStory
-      text={str('# Command', '')}
-      extensions={[
-        command({
-          onRender: (el, onClose) => {
-            renderRoot(el, <CommandDialog onClose={onClose} />);
-          },
-          onHint: () => 'Press / for commands.',
-        }),
-      ]}
-    />
-  ),
-};
+//
+// Comments
+//
 
 export const Comments = {
   render: () => {
@@ -668,12 +762,20 @@ export const Comments = {
   },
 };
 
+//
+// Annotations
+//
+
 export const Annotations = {
   render: () => (
     <DefaultStory text={str('# Annotations', '', longText)} extensions={[annotations({ match: /volup/gi })]} />
   ),
 };
 
+//
+// DND
+//
+
 export const DND = {
   render: () => (
     <DefaultStory
@@ -689,6 +791,10 @@ export const DND = {
   ),
 };
 
+//
+// Listener
+//
+
 export const Listener = {
   render: () => (
     <DefaultStory
@@ -707,6 +813,10 @@ export const Listener = {
   ),
 };
 
+//
+// Typewriter
+//
+
 const typewriterItems = localStorage.getItem('dxos.org/plugin/markdown/typewriter')?.split(',');
 
 export const Typewriter = {
@@ -718,6 +828,10 @@ export const Typewriter = {
   ),
 };
 
+//
+// Blast
+//
+
 export const Blast = {
   render: () => (
     <DefaultStory