@dxos/plugin-markdown 0.8.3-staging.0fa589b → 0.8.4-main.c1de068

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-markdown",
-  "version": "0.8.3-staging.0fa589b",
+  "version": "0.8.4-main.c1de068",
   "description": "DXOS Surface plugin for interacting with Markdown",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -33,68 +33,66 @@
     "src"
   ],
   "dependencies": {
-    "@automerge/automerge": "3.0.0-beta.4",
+    "@automerge/automerge": "3.0.0",
     "@codemirror/search": "^6.5.6",
     "@codemirror/view": "^6.34.1",
     "@preact-signals/safe-react": "^0.9.0",
     "@preact/signals-core": "^1.9.0",
     "react-dropzone": "^14.2.3",
-    "@dxos/ai": "0.8.3-staging.0fa589b",
-    "@dxos/app-framework": "0.8.3-staging.0fa589b",
-    "@dxos/assistant": "0.8.3-staging.0fa589b",
-    "@dxos/artifact": "0.8.3-staging.0fa589b",
-    "@dxos/async": "0.8.3-staging.0fa589b",
-    "@dxos/invariant": "0.8.3-staging.0fa589b",
-    "@dxos/echo": "0.8.3-staging.0fa589b",
-    "@dxos/keys": "0.8.3-staging.0fa589b",
-    "@dxos/echo-schema": "0.8.3-staging.0fa589b",
-    "@dxos/lit-ui": "0.8.3-staging.0fa589b",
-    "@dxos/local-storage": "0.8.3-staging.0fa589b",
-    "@dxos/log": "0.8.3-staging.0fa589b",
-    "@dxos/live-object": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-attention": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-client": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-deck": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-preview": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-graph": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-space": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-theme": "0.8.3-staging.0fa589b",
-    "@dxos/react-client": "0.8.3-staging.0fa589b",
-    "@dxos/react-ui-attention": "0.8.3-staging.0fa589b",
-    "@dxos/react-ui-editor": "0.8.3-staging.0fa589b",
-    "@dxos/react-ui-form": "0.8.3-staging.0fa589b",
-    "@dxos/react-hooks": "0.8.3-staging.0fa589b",
-    "@dxos/react-ui-stack": "0.8.3-staging.0fa589b",
-    "@dxos/schema": "0.8.3-staging.0fa589b",
-    "@dxos/util": "0.8.3-staging.0fa589b"
+    "@dxos/ai": "0.8.4-main.c1de068",
+    "@dxos/app-framework": "0.8.4-main.c1de068",
+    "@dxos/assistant": "0.8.4-main.c1de068",
+    "@dxos/async": "0.8.4-main.c1de068",
+    "@dxos/blueprints": "0.8.4-main.c1de068",
+    "@dxos/echo": "0.8.4-main.c1de068",
+    "@dxos/invariant": "0.8.4-main.c1de068",
+    "@dxos/keys": "0.8.4-main.c1de068",
+    "@dxos/lit-ui": "0.8.4-main.c1de068",
+    "@dxos/echo-schema": "0.8.4-main.c1de068",
+    "@dxos/live-object": "0.8.4-main.c1de068",
+    "@dxos/local-storage": "0.8.4-main.c1de068",
+    "@dxos/log": "0.8.4-main.c1de068",
+    "@dxos/plugin-attention": "0.8.4-main.c1de068",
+    "@dxos/plugin-client": "0.8.4-main.c1de068",
+    "@dxos/plugin-deck": "0.8.4-main.c1de068",
+    "@dxos/plugin-graph": "0.8.4-main.c1de068",
+    "@dxos/plugin-preview": "0.8.4-main.c1de068",
+    "@dxos/plugin-space": "0.8.4-main.c1de068",
+    "@dxos/react-client": "0.8.4-main.c1de068",
+    "@dxos/plugin-theme": "0.8.4-main.c1de068",
+    "@dxos/react-hooks": "0.8.4-main.c1de068",
+    "@dxos/react-ui-attention": "0.8.4-main.c1de068",
+    "@dxos/react-ui-form": "0.8.4-main.c1de068",
+    "@dxos/react-ui-editor": "0.8.4-main.c1de068",
+    "@dxos/react-ui-stack": "0.8.4-main.c1de068",
+    "@dxos/schema": "0.8.4-main.c1de068",
+    "@dxos/util": "0.8.4-main.c1de068"
   },
   "devDependencies": {
-    "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
-    "@phosphor-icons/react": "^2.1.5",
+    "@effect-rx/rx-react": "0.38.0",
+    "@effect/platform": "0.89.0",
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
-    "effect": "3.14.21",
+    "effect": "3.17.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "vite": "5.4.7",
-    "@dxos/debug": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-theme": "0.8.3-staging.0fa589b",
-    "@dxos/plugin-storybook-layout": "0.8.3-staging.0fa589b",
-    "@dxos/random": "0.8.3-staging.0fa589b",
-    "@dxos/react-ui": "0.8.3-staging.0fa589b",
-    "@dxos/react-ui-theme": "0.8.3-staging.0fa589b",
-    "@dxos/storybook-utils": "0.8.3-staging.0fa589b"
+    "@dxos/plugin-storybook-layout": "0.8.4-main.c1de068",
+    "@dxos/plugin-theme": "0.8.4-main.c1de068",
+    "@dxos/debug": "0.8.4-main.c1de068",
+    "@dxos/random": "0.8.4-main.c1de068",
+    "@dxos/react-ui": "0.8.4-main.c1de068",
+    "@dxos/react-ui-theme": "0.8.4-main.c1de068",
+    "@dxos/storybook-utils": "0.8.4-main.c1de068"
   },
   "peerDependencies": {
     "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
-    "@phosphor-icons/react": "^2.1.5",
+    "@effect/platform": "^0.80.12",
     "effect": "^3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/react-ui": "0.8.3-staging.0fa589b",
-    "@dxos/react-ui-theme": "0.8.3-staging.0fa589b"
+    "@dxos/react-ui": "0.8.4-main.c1de068",
+    "@dxos/react-ui-theme": "0.8.4-main.c1de068"
   },
   "publishConfig": {
     "access": "public"

package/src/MarkdownPlugin.tsx

@@ -22,7 +22,7 @@ import {
 } from './capabilities';
 import { MarkdownEvents } from './events';
 import { meta } from './meta';
-import translations from './translations';
+import { translations } from './translations';
 import { DocumentType, MarkdownAction } from './types';
 import { serializer } from './util';
 

package/src/capabilities/app-graph-serializer.ts

@@ -5,12 +5,12 @@
 import { pipe } from 'effect';
 
 import { contributes, Capabilities, type PluginContext, chain, createIntent } from '@dxos/app-framework';
-import { Obj, Type } from '@dxos/echo';
+import { Obj } from '@dxos/echo';
 import { SpaceAction } from '@dxos/plugin-space/types';
 import { isSpace } from '@dxos/react-client/echo';
 import { DataType } from '@dxos/schema';
 
-import translations from '../translations';
+import { translations } from '../translations';
 import { MarkdownAction, DocumentType } from '../types';
 
 export default (context: PluginContext) =>
@@ -33,7 +33,7 @@ export default (context: PluginContext) =>
         const space = ancestors.find(isSpace);
         const target =
           ancestors.findLast((ancestor) => Obj.instanceOf(DataType.Collection, ancestor)) ??
-          space?.properties[Type.getTypename(DataType.Collection)]?.target;
+          space?.properties[DataType.Collection.typename]?.target;
         if (!space || !target) {
           return;
         }

package/src/capabilities/artifact-definition.ts

@@ -6,8 +6,8 @@ import { pipe, Schema } from 'effect';
 
 import { createTool, ToolResult } from '@dxos/ai';
 import { Capabilities, chain, contributes, createIntent, type PromiseIntentDispatcher } from '@dxos/app-framework';
-import { ArtifactId, defineArtifact } from '@dxos/artifact';
-import { createArtifactElement } from '@dxos/assistant';
+import { createArtifactElement, ArtifactId } from '@dxos/assistant';
+import { defineArtifact } from '@dxos/blueprints';
 import { Obj } from '@dxos/echo';
 import { invariant, assertArgument } from '@dxos/invariant';
 import { SpaceAction } from '@dxos/plugin-space/types';

package/src/capabilities/react-surface.tsx

@@ -105,7 +105,7 @@ export default () =>
     }),
     createSurface({
       id: `${MARKDOWN_PLUGIN}/preview`,
-      role: ['popover', 'card--kanban', 'card--document', 'card'],
+      role: ['card--popover', 'card--intrinsic', 'card--extrinsic', 'card--transclusion', 'card'],
       filter: (data): data is { subject: DocumentType | DataType.Text } =>
         Obj.instanceOf(DocumentType, data.subject) || Obj.instanceOf(DataType.Text, data.subject),
       component: ({ data, role }) => <MarkdownPreview {...data} role={role} />,

package/src/components/MarkdownContainer.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import React, { useMemo } from 'react';
 
 import { Capabilities, contributes, IntentPlugin, SettingsPlugin, Surface } from '@dxos/app-framework';
@@ -26,7 +26,7 @@ import { createObjectFactory, Testing, type ValueGenerator } from '@dxos/schema/
 import { withLayout } from '@dxos/storybook-utils';
 
 import { MarkdownPlugin } from '../MarkdownPlugin';
-import translations from '../translations';
+import { translations } from '../translations';
 import { DocumentType } from '../types';
 
 faker.seed(1);

package/src/components/MarkdownContainer.tsx

@@ -7,7 +7,8 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { createPortal } from 'react-dom';
 
 import { Capabilities, Surface, useAppGraph, useCapabilities, usePluginManager } from '@dxos/app-framework';
-import { DXN, Filter, Obj, Query } from '@dxos/echo';
+import { DXN, Filter, Obj, Query, Type } from '@dxos/echo';
+import { ClientCapabilities } from '@dxos/plugin-client';
 import { SpaceCapabilities } from '@dxos/plugin-space';
 import { fullyQualifiedId, getSpace, useQuery, useSpace } from '@dxos/react-client/echo';
 import { toLocalizedString, useTranslation } from '@dxos/react-ui';
@@ -83,18 +84,30 @@ const MarkdownContainer = ({
   );
   const space = getSpace(object);
   const objectForms = useCapabilities(SpaceCapabilities.ObjectForm);
-  const filter = useMemo(() => Filter.or(...objectForms.map((form) => Filter.type(form.objectSchema))), [objectForms]);
+  const schemaWhiteList = useCapabilities(ClientCapabilities.SchemaWhiteList);
+  const filter = useMemo(
+    () =>
+      Filter.or(
+        ...objectForms.map((form) => Filter.type(form.objectSchema)),
+        ...schemaWhiteList.flat().map((schema) => Filter.typename(Type.getTypename(schema))),
+      ),
+    [objectForms, schemaWhiteList],
+  );
   const onLinkQuery = useCallback(
     async (query?: string): Promise<CommandMenuGroup[]> => {
-      const name = query?.startsWith('@') ? query.slice(1).toLowerCase() : query?.toLowerCase() ?? '';
+      const name = query?.startsWith('@') ? query.slice(1).toLowerCase() : (query?.toLowerCase() ?? '');
       const results = await space?.db.query(Query.select(filter)).run();
       // TODO(wittjosiah): Use `Obj.Any` type.
       const getLabel = (object: any) => {
+        const label = Obj.getLabel(object);
+        if (label) {
+          return label;
+        }
+
+        // TODO(wittjosiah): Remove metadata labels.
         const type = Obj.getTypename(object)!;
         const metadata = resolve(type);
-        return (
-          metadata.label?.(object) || object.name || ['object name placeholder', { ns: type, default: 'New object' }]
-        );
+        return metadata.label?.(object) || ['object name placeholder', { ns: type, default: 'New object' }];
       };
       const items =
         results?.objects
@@ -181,7 +194,7 @@ const PreviewBlock = ({ link, el }: { link: PreviewLinkRef; el: HTMLElement }) =
   const [subject] = useQuery(space, Query.select(Filter.ids(echoDXN?.echoId ?? '')));
   const data = useMemo(() => ({ subject }), [subject]);
 
-  return createPortal(<Surface role='card--document' data={data} limit={1} />, el);
+  return createPortal(<Surface role='card--transclusion' data={data} limit={1} />, el);
 };
 
 type DocumentEditorProps = Omit<MarkdownContainerProps, 'object' | 'extensionProviders' | 'editorStateStore'> &

package/src/components/MarkdownEditor/MarkdownEditor.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import React, { useMemo } from 'react';
 
 import { IntentPlugin } from '@dxos/app-framework';
@@ -15,7 +15,7 @@ import { automerge, translations as editorTranslations } from '@dxos/react-ui-ed
 import { withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { MarkdownEditor, type MarkdownEditorProps } from './MarkdownEditor';
-import translations from '../../translations';
+import { translations } from '../../translations';
 
 const content = Array.from({ length: 100 }, (_, i) => `Line ${i + 1}`).join('\n');
 

package/src/components/MarkdownPreview/MarkdownPreview.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import React from 'react';
 
 import { IntentPlugin } from '@dxos/app-framework';
@@ -12,31 +12,23 @@ import { withPluginManager } from '@dxos/app-framework/testing';
 import { Obj, Ref } from '@dxos/echo';
 import { DocumentType } from '@dxos/plugin-markdown/types';
 import { faker } from '@dxos/random';
-import { Icon, Popover } from '@dxos/react-ui';
+import { CardContainer } from '@dxos/react-ui-stack/testing';
 import { DataType } from '@dxos/schema';
 import { withTheme, withLayout } from '@dxos/storybook-utils';
 
 import { MarkdownPreview } from './MarkdownPreview';
-import translations from '../../translations';
+import { translations } from '../../translations';
 
 faker.seed(1234);
 
 const meta: Meta<typeof MarkdownPreview> = {
-  title: 'plugins/plugin-markdown/MarkdownPreview',
+  title: 'Cards/plugin-markdown',
   component: MarkdownPreview,
-  render: ({ subject }) => {
+  render: ({ role, subject, ...args }) => {
     return (
-      <Popover.Root open>
-        <Popover.Content>
-          <Popover.Viewport>
-            <MarkdownPreview subject={subject} role='popover' />
-          </Popover.Viewport>
-          <Popover.Arrow />
-        </Popover.Content>
-        <Popover.Trigger>
-          <Icon icon='ph--text-aa--regular' size={5} />
-        </Popover.Trigger>
-      </Popover.Root>
+      <CardContainer icon='ph--text-aa--regular' role={role}>
+        <MarkdownPreview subject={subject} role={role} />
+      </CardContainer>
     );
   },
   decorators: [
@@ -67,8 +59,23 @@ const data = (() => {
   return { document };
 })();
 
-export const Default = {
+export const Popover = {
   args: {
     subject: Obj.make(DocumentType, data.document),
+    role: 'card--popover',
+  },
+};
+
+export const Extrinsic = {
+  args: {
+    subject: Obj.make(DocumentType, data.document),
+    role: 'card--extrinsic',
+  },
+};
+
+export const Intrinsic = {
+  args: {
+    subject: Obj.make(DocumentType, data.document),
+    role: 'card--intrinsic',
   },
 };

package/src/components/MarkdownPreview/MarkdownPreview.tsx

@@ -57,15 +57,17 @@ export const MarkdownPreview = ({ subject, role }: PreviewProps<DocumentType | D
   );
 
   return (
-    <Card.Container role={role}>
+    <Card.SurfaceRoot role={role}>
       <Card.Heading>{getTitle(subject, t('fallback title'))}</Card.Heading>
       {snippet && <Card.Text classNames='line-clamp-3 break-words col-span-2'>{snippet}</Card.Text>}
-      <Card.Chrome>
-        <Button onClick={handleNavigate}>
-          <span className='grow'>{t('navigate to document label')}</span>
-          <Icon icon='ph--arrow-right--regular' />
-        </Button>
-      </Card.Chrome>
-    </Card.Container>
+      {role === 'card--popover' && (
+        <Card.Chrome>
+          <Button onClick={handleNavigate}>
+            <span className='grow'>{t('navigate to document label')}</span>
+            <Icon icon='ph--arrow-right--regular' />
+          </Button>
+        </Card.Chrome>
+      )}
+    </Card.SurfaceRoot>
   );
 };

package/src/components/Suggestions.stories.tsx

@@ -4,11 +4,10 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import { Match, Option, pipe, Schema } from 'effect';
 import React, { type FC, useEffect, useMemo, useState } from 'react';
 
-import { Message } from '@dxos/ai';
 import {
   Capabilities,
   CollaborationActions,
@@ -34,13 +33,14 @@ import { IconButton, Toolbar } from '@dxos/react-ui';
 import { command, type EditorSelection, type Range, useTextEditor } from '@dxos/react-ui-editor';
 import { StackItem } from '@dxos/react-ui-stack';
 import { defaultTx } from '@dxos/react-ui-theme';
+import { DataType } from '@dxos/schema';
 import { withLayout } from '@dxos/storybook-utils';
 
 import MarkdownContainer from './MarkdownContainer';
 import { MarkdownPlugin } from '../MarkdownPlugin';
 import { MarkdownCapabilities } from '../capabilities';
 import { MARKDOWN_PLUGIN } from '../meta';
-import translations from '../translations';
+import { translations } from '../translations';
 import { createDocument, DocumentType, type MarkdownSettingsProps } from '../types';
 
 faker.seed(1);
@@ -68,12 +68,18 @@ const TestChat: FC<{ doc: DocumentType; content: string }> = ({ doc, content })
 
   const space = useSpace();
   const queueDxn = useMemo(() => space && space.queues.create().dxn, [space]);
-  const queue = useQueue<Message>(queueDxn);
+  const queue = useQueue<DataType.Message>(queueDxn);
 
   const handleInsert = async () => {
     invariant(space);
     invariant(queue);
-    await queue.append([Obj.make(Message, { role: 'assistant', content: [{ type: 'text', text: 'Hello' }] })]);
+    await queue.append([
+      Obj.make(DataType.Message, {
+        created: new Date().toISOString(),
+        sender: { role: 'assistant' },
+        blocks: [{ _tag: 'text', text: 'Hello' }],
+      }),
+    ]);
     const message = queue.objects.at(-1);
     invariant(message);
 

package/src/components/Toolbar.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import React, { type FC, useCallback, useState } from 'react';
 
 import { Obj } from '@dxos/echo';

package/src/extensions.tsx

@@ -2,6 +2,7 @@
 // Copyright 2023 DXOS.org
 //
 
+import { type ViewUpdate } from '@codemirror/view';
 import React, { type AnchorHTMLAttributes, type ReactNode, useMemo } from 'react';
 import { createRoot } from 'react-dom/client';
 
@@ -12,6 +13,7 @@ import {
   useCapabilities,
   useIntentDispatcher,
 } from '@dxos/app-framework';
+import { debounceAndThrottle } from '@dxos/async';
 import { invariant } from '@dxos/invariant';
 import { createDocAccessor, fullyQualifiedId, getSpace, type QueryResult } from '@dxos/react-client/echo';
 import { useIdentity } from '@dxos/react-client/halo';
@@ -249,20 +251,22 @@ const createBaseExtensions = ({
 };
 
 export const selectionChange = (selectionManager: SelectionManager) => {
-  return EditorView.updateListener.of((update) => {
-    if (update.selectionSet) {
-      const id = update.state.facet(documentId);
-      const cursorConverter = update.state.facet(Cursor.converter);
-      const selection = update.state.selection;
-      const ranges = selection.ranges
-        .map((range) => ({
-          from: cursorConverter.toCursor(range.from),
-          to: cursorConverter.toCursor(range.to),
-        }))
-        .filter(({ from, to }) => to > from);
-      selectionManager.updateMultiRange(id, ranges);
-    }
-  });
+  return EditorView.updateListener.of(
+    debounceAndThrottle((update: ViewUpdate) => {
+      if (update.selectionSet) {
+        const id = update.state.facet(documentId);
+        const cursorConverter = update.state.facet(Cursor.converter);
+        const selection = update.state.selection;
+        const ranges = selection.ranges
+          .map((range) => ({
+            from: cursorConverter.toCursor(range.from),
+            to: cursorConverter.toCursor(range.to),
+          }))
+          .filter(({ from, to }) => to > from);
+        selectionManager.updateMultiRange(id, ranges);
+      }
+    }, 100),
+  );
 };
 
 // TODO(burdon): Factor out styles.

package/src/translations.ts

@@ -2,22 +2,24 @@
 // Copyright 2023 DXOS.org
 //
 
-import { Type } from '@dxos/echo';
+import { type Resource } from '@dxos/react-ui';
 
-import { MARKDOWN_PLUGIN } from './meta';
+import { meta } from './meta';
 import { DocumentType } from './types';
 
-export default [
+export const translations = [
   {
     'en-US': {
-      [Type.getTypename(DocumentType)]: {
+      [DocumentType.typename]: {
         'typename label': 'Document',
         'typename label_zero': 'Documents',
         'typename label_one': 'Document',
         'typename label_other': 'Documents',
         'object name placeholder': 'New document',
+        'rename object label': 'Rename document',
+        'delete object label': 'Delete document',
       },
-      [MARKDOWN_PLUGIN]: {
+      [meta.id]: {
         'plugin name': 'Editor',
         'choose markdown from space dialog title': 'Choose one or more documents to add',
         // TODO(burdon): Style-guide for user-facing text (e.g., hints, questions, capitalization, etc.)
@@ -43,4 +45,4 @@ export default [
       },
     },
   },
-];
+] as const satisfies Resource[];

package/src/types/types.ts

@@ -5,8 +5,8 @@
 import { Schema } from 'effect';
 
 import { Type } from '@dxos/echo';
-// TODO(wittjosiah): This pulls in UI code into the types entrypoint.
-import { type Extension, EditorInputMode, EditorViewMode } from '@dxos/react-ui-editor';
+import { type Extension } from '@dxos/react-ui-editor';
+import { EditorInputMode, EditorViewMode } from '@dxos/react-ui-editor/types';
 
 import { DocumentType } from './schema';
 import { MARKDOWN_PLUGIN } from '../meta';