@dxos/react-ui-editor 0.8.4-main.3eb6e50203 → 0.8.4-main.3fbcb4aa9b

package/src/stories/components/EditorStory.tsx

@@ -12,7 +12,7 @@ import { PublicKey } from '@dxos/keys';
 import { log } from '@dxos/log';
 import { useMergeRefs, useThemeContext } from '@dxos/react-ui';
 import { useAttentionAttributes } from '@dxos/react-ui-attention';
-import { JsonFilter } from '@dxos/react-ui-syntax-highlighter';
+import { Syntax } from '@dxos/react-ui-syntax-highlighter';
 import {
   type DebugNode,
   type ThemeExtensionsOptions,
@@ -20,8 +20,7 @@ import {
   createMarkdownExtensions,
   createThemeExtensions,
   debugTree,
-  decorateMarkdown,
-  editorSlots,
+  documentSlots,
 } from '@dxos/ui-editor';
 import { mx } from '@dxos/ui-theme';
 import { isNonNullable } from '@dxos/util';
@@ -34,12 +33,12 @@ export type DebugMode = 'raw' | 'tree' | 'raw+tree';
 
 const defaultId = 'editor-' + PublicKey.random().toHex().slice(0, 8);
 
-export type StoryProps = Pick<UseTextEditorProps, 'id' | 'scrollTo' | 'selection' | 'extensions'> &
+export type EditorStoryProps = Pick<UseTextEditorProps, 'id' | 'scrollTo' | 'selection' | 'extensions'> &
   Pick<ThemeExtensionsOptions, 'slots'> & {
     debug?: DebugMode;
     debugCustom?: (view: EditorView) => ReactNode;
     text?: string;
-    object?: Obj.Obj<TestSchema.Expando>;
+    object?: Obj.OfShape<TestSchema.Expando>;
     readOnly?: boolean;
     placeholder?: string;
     lineNumbers?: boolean;
@@ -47,7 +46,7 @@ export type StoryProps = Pick<UseTextEditorProps, 'id' | 'scrollTo' | 'selection
     onReady?: (view: EditorView) => void;
   };
 
-export const EditorStory = forwardRef<EditorController, StoryProps>(
+export const EditorStory = forwardRef<EditorController, EditorStoryProps>(
   ({ debug, debugCustom, text, extensions: extensionsProp, ...props }, forwardedRef) => {
     const controllerRef = useRef<EditorController>(null);
     const mergedRef = useMergeRefs([controllerRef, forwardedRef]);
@@ -63,12 +62,12 @@ export const EditorStory = forwardRef<EditorController, StoryProps>(
 
     const view = controllerRef.current?.view;
     return (
-      <div className={mx('is-full bs-full grid overflow-hidden', debug && 'grid-cols-2 lg:grid-cols-[1fr_600px]')}>
+      <div className={mx('dx-container grid', debug && 'grid-cols-2 lg:grid-cols-[1fr_600px]')}>
         <EditorComponent ref={mergedRef} object={object} text={text} extensions={extensions} {...props} />
 
         {debug && (
           <div
-            className='grid bs-full auto-rows-fr border-l border-separator divide-y divide-separator overflow-hidden'
+            className='grid h-full auto-rows-fr border-l border-separator divide-y divide-separator overflow-hidden'
             {...attentionAttrs}
           >
             {view && debugCustom?.(view)}
@@ -77,7 +76,16 @@ export const EditorStory = forwardRef<EditorController, StoryProps>(
                 {view?.state.doc.toString()}
               </pre>
             )}
-            {(debug === 'tree' || debug === 'raw+tree') && <JsonFilter data={tree} classNames='p-1 text-xs' />}
+            {(debug === 'tree' || debug === 'raw+tree') && (
+              <Syntax.Root data={tree}>
+                <Syntax.Content>
+                  <Syntax.Filter />
+                  <Syntax.Viewport>
+                    <Syntax.Code classNames='p-1 text-xs' />
+                  </Syntax.Viewport>
+                </Syntax.Content>
+              </Syntax.Root>
+            )}
           </div>
         )}
       </div>
@@ -88,7 +96,7 @@ export const EditorStory = forwardRef<EditorController, StoryProps>(
 /**
  * Default story component.
  */
-const EditorComponent = forwardRef<EditorController, StoryProps>(
+const EditorComponent = forwardRef<EditorController, EditorStoryProps>(
   (
     {
       id = defaultId,
@@ -101,7 +109,7 @@ const EditorComponent = forwardRef<EditorController, StoryProps>(
       scrollTo,
       selection,
       extensions,
-      slots = editorSlots,
+      slots = documentSlots,
       onReady,
     },
     forwardedRef,
@@ -119,7 +127,6 @@ const EditorComponent = forwardRef<EditorController, StoryProps>(
           createBasicExtensions({ readOnly, placeholder, lineNumbers, scrollPastEnd: true, search: true }),
           createThemeExtensions({ monospace, themeMode, syntaxHighlighting: true, slots }),
           createMarkdownExtensions(),
-          decorateMarkdown(),
           extensions || [],
         ],
       }),

package/src/stories/components/util.tsx

@@ -4,10 +4,9 @@
 
 import { type Completion } from '@codemirror/autocomplete';
 import { type Extension } from '@codemirror/state';
-import React, { type FC } from 'react';
 
-import { faker } from '@dxos/random';
-import { Icon } from '@dxos/react-ui';
+import { random } from '@dxos/random';
+import { Domino } from '@dxos/ui';
 import {
   type EditorSelectionState,
   decorateMarkdown,
@@ -17,11 +16,12 @@ import {
   linkTooltip,
   table,
 } from '@dxos/ui-editor';
-import { mx } from '@dxos/ui-theme';
+import { type RenderCallback } from '@dxos/ui-editor/types';
+import { safeUrl } from '@dxos/util';
 
-import { createRenderer, str } from '../../util';
+import { str } from '../../util';
 
-export const num = () => faker.number.int({ min: 0, max: 9999 }).toLocaleString();
+export const num = () => random.number.int({ min: 0, max: 9999 }).toLocaleString();
 
 export const img = '![dxos](https://dxos.network/dxos-logotype-blue.png)';
 
@@ -41,11 +41,11 @@ export const content = {
     // prettier-ignore
     '### TaskList',
     '',
-    `- [x] ${faker.lorem.sentences()}`,
-    `- [ ] ${faker.lorem.sentences()}`,
-    `  - [ ] ${faker.lorem.sentences()}`,
-    `    - [ ] ${faker.lorem.sentences()}`,
-    `    - [x] ${faker.lorem.sentences()}`,
+    `- [x] ${random.lorem.sentences()}`,
+    `- [ ] ${random.lorem.sentences()}`,
+    `  - [ ] ${random.lorem.sentences()}`,
+    `    - [ ] ${random.lorem.sentences()}`,
+    `    - [x] ${random.lorem.sentences()}`,
     '',
   ),
 
@@ -53,11 +53,11 @@ export const content = {
     // prettier-ignore
     '### BulletList',
     '',
-    `- ${faker.lorem.sentences()}`,
-    `- ${faker.lorem.sentences()}`,
-    `  - ${faker.lorem.sentences()}`,
-    `  - ${faker.lorem.sentences()}`,
-    `- ${faker.lorem.sentences()}`,
+    `- ${random.lorem.sentences()}`,
+    `- ${random.lorem.sentences()}`,
+    `  - ${random.lorem.sentences()}`,
+    `  - ${random.lorem.sentences()}`,
+    `- ${random.lorem.sentences()}`,
     '',
   ),
 
@@ -65,17 +65,17 @@ export const content = {
     // prettier-ignore
     '### OrderedList (part 1)',
     '',
-    `1. ${faker.lorem.sentences()}`,
-    `1. ${faker.lorem.sentences()}`,
-    `1. ${faker.lorem.sentences()}`,
-    `    1. ${faker.lorem.sentences()}`,
-    `    1. ${faker.lorem.sentences()}`,
-    `        1. ${faker.lorem.sentences()}`,
-    `1. ${faker.lorem.sentences()}`,
+    `1. ${random.lorem.sentences()}`,
+    `1. ${random.lorem.sentences()}`,
+    `1. ${random.lorem.sentences()}`,
+    `    1. ${random.lorem.sentences()}`,
+    `    1. ${random.lorem.sentences()}`,
+    `        1. ${random.lorem.sentences()}`,
+    `1. ${random.lorem.sentences()}`,
     '',
     '### OrderedList (part 2)',
     '',
-    `1. ${faker.lorem.sentences()}`,
+    `1. ${random.lorem.sentences()}`,
     '',
   ),
 
@@ -123,7 +123,7 @@ export const content = {
     // prettier-ignore
     '### Tables',
     '',
-    `| ${faker.lorem.word().padStart(12)} | ${faker.lorem.word().padStart(12)} | ${faker.lorem.word().padStart(12)} |`,
+    `| ${random.lorem.word().padStart(12)} | ${random.lorem.word().padStart(12)} | ${random.lorem.word().padStart(12)} |`,
     `|-${''.padStart(12, '-')}-|-${''.padStart(12, '-')}-|-${''.padStart(12, '-')}-|`,
     `| ${num().padStart(12)} | ${num().padStart(12)} | ${num().padStart(12)} |`,
     `| ${num().padStart(12)} | ${num().padStart(12)} | ${num().padStart(12)} |`,
@@ -134,7 +134,9 @@ export const content = {
   image: str('### Image', '', img),
 
   headings: str(
-    ...[1, 2, 3, 4, 5, 6].map((level) => ['#'.repeat(level) + ` Heading ${level}`, faker.lorem.sentences(), '']).flat(),
+    ...[1, 2, 3, 4, 5, 6]
+      .map((level) => ['#'.repeat(level) + ` Heading ${level}`, random.lorem.sentences(), ''])
+      .flat(),
   ),
 
   formatting: str(
@@ -159,7 +161,7 @@ export const content = {
     '',
   ),
 
-  paragraphs: str(...faker.helpers.multiple(() => [faker.lorem.paragraph(), ''], { count: 3 }).flat()),
+  paragraphs: str(...random.helpers.multiple(() => [random.lorem.paragraph(), ''], { count: 3 }).flat()),
 
   footer: str('', '', '', '', ''),
 };
@@ -204,30 +206,27 @@ export const links: Completion[] = [
 export const names = ['adam', 'alice', 'alison', 'bob', 'carol', 'charlie', 'sayuri', 'shoko'];
 
 const hover =
-  'rounded-sm text-baseText text-primary-600 hover:text-primary-500 dark:text-primary-300 hover:dark:text-primary-200';
-
-const LinkTooltip: FC<{ url: string }> = ({ url }) => {
-  const web = new URL(url);
-  return (
-    <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>
+  'rounded-xs text-base-surface-text text-primary-600 hover:text-primary-500 dark:text-primary-300 hover:dark:text-primary-200';
+
+export const renderLinkTooltip: RenderCallback<{ url: string }> = (el, { url }) => {
+  el.appendChild(
+    Domino.of('a')
+      .attributes({ href: url, target: '_blank', rel: 'noreferrer', 'aria-label': 'Open link' })
+      .classNames(hover, 'flex items-center gap-2')
+      .text(safeUrl(url)?.toString() ?? url)
+      .append(Domino.svg('ph--arrow-square-out--regular')).root,
   );
 };
 
-export const renderLinkTooltip = createRenderer(LinkTooltip);
-
-const LinkButton: FC<{ url: string }> = ({ url }) => {
-  return (
-    <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>
+export const renderLinkButton: RenderCallback<{ url: string }> = (el, { url }) => {
+  el.appendChild(
+    Domino.of('span')
+      .attributes({ 'aria-hidden': 'true' })
+      .classNames(hover, 'ms-1 inline-block align-[-0.125em]')
+      .append(Domino.svg('ph--arrow-square-out--regular')).root,
   );
 };
 
-export const renderLinkButton = createRenderer(LinkButton);
-
 // Shared extensions.
 export const defaultExtensions: Extension[] = [
   decorateMarkdown({ renderLinkButton, selectionChangeDelay: 100 }),
@@ -245,18 +244,18 @@ export const allExtensions: Extension[] = [
 ];
 
 // Long text for scrolling stories.
-export const longText = faker.helpers
-  .multiple(() => faker.lorem.paragraph({ min: 8, max: 16 }), { count: 20 })
+export const longText = random.helpers
+  .multiple(() => random.lorem.paragraph({ min: 8, max: 16 }), { count: 20 })
   .join('\n\n');
 
-export const largeWithImages = faker.helpers
-  .multiple(() => [faker.lorem.paragraph({ min: 12, max: 16 }), img], { count: 20 })
+export const largeWithImages = random.helpers
+  .multiple(() => [random.lorem.paragraph({ min: 12, max: 16 }), img], { count: 20 })
   .flatMap((x) => x)
   .join('\n\n');
 
 export const headings = str(
   ...[1, 2, 2, 3, 3, 4, 4, 4, 5, 5, 2, 3, 3, 2, 2, 6, 1]
-    .map((level) => ['#'.repeat(level) + ' ' + faker.lorem.sentence(3), faker.lorem.sentences(), ''])
+    .map((level) => ['#'.repeat(level) + ' ' + random.lorem.sentence(3), random.lorem.sentences(), ''])
     .flat(),
 );
 

package/src/translations.ts

@@ -10,30 +10,35 @@ export const translations = [
   {
     'en-US': {
       [translationKey]: {
-        'strong label': 'Bold',
-        'emphasis label': 'Italics',
-        'strikethrough label': 'Strikethrough',
-        'code label': 'Code',
-        'link label': 'Link',
-        'list-bullet label': 'Bullet list',
-        'list-ordered label': 'Numbered list',
-        'list-task label': 'Task list',
-        'blockquote label': 'Block quote',
-        'codeblock label': 'Code block',
-        'comment label': 'Create comment',
-        'selection overlaps existing comment label': 'Selection overlaps existing comment',
-        'select text to comment label': 'Select text to comment',
-        'image label': 'Insert image',
-        'table label': 'Create table',
-        'heading label': 'Heading level',
-        'heading level label_zero': 'Paragraph',
-        'heading level label_one': 'Heading level {{count}}',
-        'heading level label_other': 'Heading level {{count}}',
-        'search label': 'Search',
-        'view mode label': 'Editor view',
-        'preview mode label': 'Markdown',
-        'readonly mode label': 'Read only',
-        'source mode label': 'Plain text',
+        'comment.label': 'Create comment',
+        'image.label': 'Insert image',
+        'search.label': 'Search',
+
+        'block.label': 'Block',
+        'block.blockquote.label': 'Block quote',
+        'block.codeblock.label': 'Code block',
+        'block.table.label': 'Create table',
+
+        'formatting.label': 'Formatting',
+        'formatting.strong.label': 'Bold',
+        'formatting.emphasis.label': 'Italics',
+        'formatting.strikethrough.label': 'Strikethrough',
+        'formatting.code.label': 'Code',
+        'formatting.link.label': 'Link',
+
+        'list.bullet.label': 'Bullet list',
+        'list.ordered.label': 'Numbered list',
+        'list.task.label': 'Task list',
+
+        'heading.label': 'Heading level',
+        'heading-level.label_zero': 'Paragraph',
+        'heading-level.label_one': 'Heading level {{count}}',
+        'heading-level.label_other': 'Heading level {{count}}',
+
+        'view-mode.label': 'Editor view',
+        'view-mode.preview.label': 'Markdown',
+        'view-mode.source.label': 'Plain text',
+        'view-mode.readonly.label': 'Read only',
       },
     },
   },

package/src/util/react.tsx

@@ -2,11 +2,11 @@
 // Copyright 2024 DXOS.org
 //
 
-import React, { type FC, type ReactNode } from 'react';
+import React, { type FC } from 'react';
 import { createRoot } from 'react-dom/client';
 
 import { ThemeProvider, Tooltip } from '@dxos/react-ui';
-import { type RenderCallback } from '@dxos/ui-editor';
+import { type RenderCallback } from '@dxos/ui-editor/types';
 import { defaultTx } from '@dxos/ui-theme';
 
 /**
@@ -14,22 +14,13 @@ import { defaultTx } from '@dxos/ui-theme';
  */
 export const str = (...lines: string[]) => lines.join('\n');
 
-/** @deprecated */
-// TODO(wittjosiah): Replace with portals which are lighter weight and inherit context from the main react tree.
-export const renderRoot = <T extends Element>(root: T, node: ReactNode): T => {
-  createRoot(root).render(<ThemeProvider tx={defaultTx}>{node}</ThemeProvider>);
-  return root;
-};
-
 /**
- * Utility to create a renderer for a React component.
  * @deprecated
  */
 export const createRenderer =
   <TProps extends object>(Component: FC<TProps>): RenderCallback<TProps> =>
   (el, props) => {
-    renderRoot(
-      el,
+    createRoot(el).render(
       <ThemeProvider tx={defaultTx}>
         <Tooltip.Provider>
           <Component {...props} />

package/dist/types/src/components/EditorContent/EditorContent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EditorContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/EditorContent/EditorContent.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAItD,OAAO,EAAE,KAAK,kBAAkB,EAAiB,MAAM,aAAa,CAAC;AAErE,OAAO,EAAE,KAAK,gBAAgB,EAA0B,MAAM,cAAc,CAAC;AAE7E,MAAM,MAAM,kBAAkB,GAAG,eAAe,CAC9C;IACE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,GAAG,kBAAkB,CACvB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa;gBAXV,OAAO;YACX,MAAM;eACH,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;;;;;;;;;;;;0CA8DrC,CAAC"}

package/dist/types/src/components/EditorContent/controller.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"controller.d.ts","sourceRoot":"","sources":["../../../../../src/components/EditorContent/controller.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAEnD,MAAM,WAAW,gBAAgB;IAC/B,IAAI,IAAI,IAAI,UAAU,GAAG,IAAI,CAAC;IAC9B,OAAO,EAAE,MAAM,MAAM,CAAC;IACtB,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,eAAO,MAAM,cAAc,EAAE,gBAO5B,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAAI,MAAM,UAAU,GAAG,IAAI,KAAG,gBA2BhE,CAAC"}

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

@@ -1,3 +0,0 @@
-export * from './controller';
-export * from './EditorContent';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/EditorContent/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC"}

package/dist/types/src/components/EditorToolbar/actions.d.ts

@@ -1,24 +0,0 @@
-import { type EditorView } from '@codemirror/view';
-import { type Node } from '@dxos/app-graph';
-import { type MenuItemGroup, type ToolbarMenuActionGroupProperties } from '@dxos/react-ui-menu';
-import { type MenuActionProperties } from '@dxos/ui-types';
-import { type EditorToolbarState } from './useEditorToolbar';
-export declare const createLists: (state: EditorToolbarState, getView: () => EditorView) => {
-    nodes: (Node.NodeArg<any, Record<string, any>> | Readonly<Omit<Readonly<{
-        id: string;
-        type: string;
-        cacheable?: string[];
-        properties: Readonly<MenuActionProperties>;
-        data: Node.ActionData<never>;
-    }>, "properties"> & {
-        properties: Readonly<MenuActionProperties>;
-        _actionContext?: Node.ActionContext;
-    }>)[];
-    edges: {
-        source: string;
-        target: string;
-    }[];
-};
-export declare const createEditorAction: (id: string, props: Partial<MenuActionProperties>, invoke: () => void) => Node.Action<MenuActionProperties>;
-export declare const createEditorActionGroup: (id: string, props: Omit<ToolbarMenuActionGroupProperties, "icon">, icon?: string) => MenuItemGroup<ToolbarMenuActionGroupProperties>;
-//# sourceMappingURL=actions.d.ts.map

package/dist/types/src/components/EditorToolbar/actions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"actions.d.ts","sourceRoot":"","sources":["../../../../../src/components/EditorToolbar/actions.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAEnD,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,gCAAgC,EAGtC,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAI3D,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAQ7D,eAAO,MAAM,WAAW,GAAI,OAAO,kBAAkB,EAAE,SAAS,MAAM,UAAU;;;;;;;;;;;;;;;CAW/E,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,IAAI,MAAM,EAAE,OAAO,OAAO,CAAC,oBAAoB,CAAC,EAAE,QAAQ,MAAM,IAAI,KAM/F,IAAI,CAAC,MAAM,CAAC,oBAAoB,CACvC,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAClC,IAAI,MAAM,EACV,OAAO,IAAI,CAAC,gCAAgC,EAAE,MAAM,CAAC,EACrD,OAAO,MAAM,KACZ,aAAa,CAAC,gCAAgC,CAShD,CAAC"}

package/dist/types/src/components/EditorToolbar/useEditorToolbar.d.ts

@@ -1,11 +0,0 @@
-import { Atom } from '@effect-atom/atom-react';
-import { type EditorViewMode, type Formatting } from '@dxos/ui-editor';
-export type EditorToolbarState = {
-    viewMode?: EditorViewMode;
-} & Formatting;
-/**
- * Creates an atom for editor toolbar state.
- * @deprecated Use Editor.Root
- */
-export declare const useEditorToolbar: (initialState?: EditorToolbarState) => Atom.Writable<EditorToolbarState>;
-//# sourceMappingURL=useEditorToolbar.d.ts.map

package/dist/types/src/components/EditorToolbar/useEditorToolbar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useEditorToolbar.d.ts","sourceRoot":"","sources":["../../../../../src/components/EditorToolbar/useEditorToolbar.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAG/C,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGvE,MAAM,MAAM,kBAAkB,GAAG;IAAE,QAAQ,CAAC,EAAE,cAAc,CAAA;CAAE,GAAG,UAAU,CAAC;AAE5E;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAAI,eAAc,kBAAuB,KAAG,IAAI,CAAC,QAAQ,CAAC,kBAAkB,CAGxG,CAAC"}

package/dist/types/src/stories/CommandDialog.stories.d.ts

@@ -1,14 +0,0 @@
-import { type StoryObj } from '@storybook/react-vite';
-import React from 'react';
-declare const meta: {
-    title: string;
-    render: () => React.JSX.Element;
-    decorators: import("@storybook/react").Decorator[];
-    parameters: {
-        layout: string;
-    };
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-//# sourceMappingURL=CommandDialog.stories.d.ts.map

package/dist/types/src/stories/CommandDialog.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CommandDialog.stories.d.ts","sourceRoot":"","sources":["../../../../src/stories/CommandDialog.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAuC,MAAM,OAAO,CAAC;AA8D5D,QAAA,MAAM,IAAI;;;;;;;CAOqB,CAAC;AAEhC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}

package/src/components/EditorContent/EditorContent.tsx

@@ -1,83 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { Transaction } from '@codemirror/state';
-import { EditorView } from '@codemirror/view';
-import React, { forwardRef, useEffect, useImperativeHandle } from 'react';
-
-import { type ThemedClassName } from '@dxos/react-ui';
-import { initialSync } from '@dxos/ui-editor';
-import { mx } from '@dxos/ui-theme';
-
-import { type UseTextEditorProps, useTextEditor } from '../../hooks';
-
-import { type EditorController, createEditorController } from './controller';
-
-export type EditorContentProps = ThemedClassName<
-  {
-    focusable?: boolean;
-    value?: string;
-    onChange?: (value: string) => void;
-  } & UseTextEditorProps
->;
-
-/**
- * Minimal text editor.
- * NOTE: This shouold not be used with the automerge extension.
- * @deprecated Use Editor.Content
- */
-export const EditorContent = forwardRef<EditorController, EditorContentProps>(
-  ({ classNames, id, extensions, selectionEnd, focusable = true, value, onChange, ...props }, forwardedRef) => {
-    const { parentRef, focusAttributes, view } = useTextEditor(
-      () => ({
-        id,
-        initialValue: value,
-        selectionEnd,
-        extensions: [
-          extensions ?? [],
-          EditorView.updateListener.of(({ view, docChanged, transactions }) => {
-            const isInitialSync = transactions.some((tr) => tr.annotation(Transaction.userEvent) === initialSync.value);
-            if (!isInitialSync && docChanged) {
-              onChange?.(view.state.doc.toString());
-            }
-          }),
-        ],
-        ...props,
-      }),
-      [id, extensions, selectionEnd, onChange],
-    );
-
-    // External controller.
-    useImperativeHandle(forwardedRef, () => {
-      return createEditorController(view);
-    }, [id, view]);
-
-    // Set initial value and cursor position.
-    useEffect(() => {
-      requestAnimationFrame(() => {
-        view?.dispatch({
-          annotations: initialSync,
-          changes: value ? [{ from: 0, to: view?.state.doc.length ?? 0, insert: value ?? '' }] : [],
-          selection: selectionEnd ? { anchor: view?.state.doc.length ?? 0 } : undefined,
-        });
-
-        if (selectionEnd) {
-          view?.focus();
-        }
-      });
-    }, [view, value, selectionEnd]);
-
-    return (
-      <div
-        role='none'
-        className={mx(
-          'is-full outline-none focus:border-accentSurface focus-within:border-neutralFocusIndicator',
-          classNames,
-        )}
-        ref={parentRef}
-        {...(focusable ? focusAttributes : {})}
-      />
-    );
-  },
-);

package/src/components/EditorContent/index.ts

@@ -1,6 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-export * from './controller';
-export * from './EditorContent';

package/src/components/EditorToolbar/actions.ts

@@ -1,87 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { type EditorView } from '@codemirror/view';
-
-import { type Node } from '@dxos/app-graph';
-import {
-  type MenuItemGroup,
-  type ToolbarMenuActionGroupProperties,
-  createMenuAction,
-  createMenuItemGroup,
-} from '@dxos/react-ui-menu';
-import { List, addList, removeList } from '@dxos/ui-editor';
-import { type MenuActionProperties } from '@dxos/ui-types';
-
-import { translationKey } from '../../translations';
-
-import { type EditorToolbarState } from './useEditorToolbar';
-
-const listStyles = {
-  bullet: 'ph--list-bullets--regular',
-  ordered: 'ph--list-numbers--regular',
-  task: 'ph--list-checks--regular',
-};
-
-export const createLists = (state: EditorToolbarState, getView: () => EditorView) => {
-  const value = state.listStyle ?? '';
-  const listGroupAction = createListGroupAction(value);
-  const listActionsMap = createListActions(value, getView);
-  return {
-    nodes: [listGroupAction as Node.NodeArg<any>, ...listActionsMap],
-    edges: [
-      { source: 'root', target: 'list' },
-      ...listActionsMap.map(({ id }) => ({ source: listGroupAction.id, target: id })),
-    ],
-  };
-};
-
-export const createEditorAction = (id: string, props: Partial<MenuActionProperties>, invoke: () => void) => {
-  const { label = [`${id} label`, { ns: translationKey }], ...rest } = props;
-
-  return createMenuAction(id, invoke, {
-    label,
-    ...rest,
-  }) as Node.Action<MenuActionProperties>;
-};
-
-export const createEditorActionGroup = (
-  id: string,
-  props: Omit<ToolbarMenuActionGroupProperties, 'icon'>,
-  icon?: string,
-): MenuItemGroup<ToolbarMenuActionGroupProperties> => {
-  const { label = [`${id} label`, { ns: translationKey }], ...rest } = props;
-
-  return createMenuItemGroup(id, {
-    label,
-    icon,
-    iconOnly: true,
-    ...rest,
-  }) as MenuItemGroup<ToolbarMenuActionGroupProperties>;
-};
-
-const createListGroupAction = (value: string) =>
-  createEditorActionGroup('list', {
-    variant: 'toggleGroup',
-    selectCardinality: 'single',
-    value,
-  } as ToolbarMenuActionGroupProperties);
-
-const createListActions = (value: string, getView: () => EditorView) =>
-  Object.entries(listStyles).map(([listStyle, icon]) => {
-    const checked = value === listStyle;
-    return createEditorAction(`list-${listStyle}`, { checked, icon }, () => {
-      const view = getView();
-      if (!view) {
-        return;
-      }
-
-      const listType = listStyle === 'ordered' ? List.Ordered : listStyle === 'bullet' ? List.Bullet : List.Task;
-      if (checked) {
-        removeList(listType)(view);
-      } else {
-        addList(listType)(view);
-      }
-    });
-  });