@dxos/plugin-assistant 0.9.0 → 0.9.1-staging.ee54ba693a

package/src/components/TemplateEditor/extensions/handlebars-extension.ts

@@ -1,274 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import {
-  type CompletionContext,
-  type CompletionResult,
-  autocompletion,
-  completionKeymap,
-} from '@codemirror/autocomplete';
-import { type Extension, RangeSetBuilder } from '@codemirror/state';
-import {
-  Decoration,
-  type DecorationSet,
-  type EditorView,
-  ViewPlugin,
-  type ViewUpdate,
-  WidgetType,
-  keymap,
-} from '@codemirror/view';
-
-import { Domino, mx } from '@dxos/ui';
-
-export type HandlebarsOptions = {};
-
-/**
- * Simple Handlebars plugin for CodeMirror.
- * Supports:
- * - Comments: {{! comment }}
- * - Commands: {{#command}} {{/command}}
- * - Variables: {{var}}
- * - Commands with variables: {{#each items}} {{/each}}
- */
-export const handlebars = (_: HandlebarsOptions = {}): Extension => {
-  return [
-    handlebarsHighlightPlugin,
-    autocompletion({
-      activateOnTyping: true,
-      aboveCursor: true,
-      closeOnBlur: true,
-      override: [handlebarsCompletions],
-    }),
-    keymap.of(completionKeymap),
-  ];
-};
-
-const regex = {
-  // {{! comment }}
-  comment: /\{\{!\s*[^}]*\}\}/g,
-
-  // {{var}}
-  brackets: /\{\{[^}]*\}\}/g,
-
-  // {{#command}} {{/command}}
-  command: /\{\{[#/]([^}]+)\}\}/g,
-
-  // {{var}}
-  var: /\{\{(?!\s*!)(\w[^}]*)\}\}/g,
-
-  // @echo://space/id or @dxn:nsid
-  dxn: /@?(?:echo:\/{1,3}[\w/]+|dxn:[\w.-]+)/g,
-
-  // example.com/path/xxx
-  url: /[\w.-]+\.[\w.-]+\/[\w/]+/g,
-};
-
-const tagPadding = 'mx-0.5 px-1 rounded-xs';
-
-/**
- * ViewPlugin that decorates Handlebars syntax.
- */
-const handlebarsHighlightPlugin = ViewPlugin.fromClass(
-  class {
-    decorations: DecorationSet;
-
-    constructor(view: EditorView) {
-      this.decorations = this.buildDecorations(view);
-    }
-
-    update(update: ViewUpdate) {
-      if (update.docChanged || update.viewportChanged || update.selectionSet) {
-        this.decorations = this.buildDecorations(update.view);
-      }
-    }
-
-    // NOTE: Decorations may clash with other extensions (e.g., markdown).
-    buildDecorations(view: EditorView) {
-      const selection = view.state.selection.main;
-      const decorations: Array<{
-        from: number;
-        to: number;
-        decoration: Decoration;
-      }> = [];
-
-      for (const { from, to } of view.visibleRanges) {
-        const text = view.state.doc.sliceString(from, to);
-
-        // Match DXN.
-        {
-          let match;
-          while ((match = regex.dxn.exec(text)) !== null) {
-            const start = from + match.index;
-            const end = start + match[0].length;
-            // Only show widget if selection doesn't overlap with the match range.
-            const overlaps = selection.to > start && selection.from <= end;
-            if (!overlaps) {
-              decorations.push({
-                from: start,
-                to: end,
-                decoration: Decoration.widget({
-                  widget: new DXNWidget(match[0]),
-                }),
-              });
-            }
-          }
-        }
-
-        // Match URLs.
-        {
-          let match;
-          while ((match = regex.url.exec(text)) !== null) {
-            const start = from + match.index;
-            const end = start + match[0].length;
-            decorations.push({
-              from: start,
-              to: end,
-              decoration: Decoration.mark({
-                class: mx('dx-tag--blue', tagPadding),
-              }),
-            });
-          }
-        }
-
-        // Match brackets: {{ and }}.
-        {
-          let match;
-          while ((match = regex.brackets.exec(text)) !== null) {
-            const start = from + match.index;
-            const end = start + match[0].length;
-            decorations.push({
-              from: start,
-              to: end,
-              decoration: Decoration.mark({ class: 'text-subdued' }),
-            });
-          }
-        }
-
-        // Match commands: {{#command}} and {{/command}}.
-        {
-          let match;
-          while ((match = regex.command.exec(text)) !== null) {
-            const start = from + match.index + 2;
-            let end = start + match[0].length - 4;
-            const text = view.state.doc.sliceString(start, end);
-            const parts = text.split(/\s+/);
-            if (parts.length > 1) {
-              const idx = start + parts[0].length;
-              decorations.push({
-                from: idx,
-                to: end,
-                decoration: Decoration.mark({ class: 'text-green-text' }),
-              });
-              end = idx;
-            }
-            decorations.push({
-              from: start,
-              to: end,
-              decoration: Decoration.mark({ class: 'text-blue-text' }),
-            });
-          }
-        }
-
-        // Match variables: {{var}}.
-        {
-          let match;
-          while ((match = regex.var.exec(text)) !== null) {
-            const start = from + match.index + 2;
-            const end = start + match[0].length - 4;
-            decorations.push({
-              from: start,
-              to: end,
-              decoration: Decoration.mark({ class: 'text-green-text' }),
-            });
-          }
-        }
-      }
-
-      // Sort decorations by position to satisfy RangeSetBuilder requirements.
-      decorations.sort((a, b) => a.from - b.from || a.to - b.to);
-
-      // Add sorted decorations to builder.
-      const builder = new RangeSetBuilder<Decoration>();
-      for (const { from, to, decoration } of decorations) {
-        builder.add(from, to, decoration);
-      }
-
-      return builder.finish();
-    }
-  },
-  {
-    decorations: (v) => v.decorations,
-  },
-);
-
-class DXNWidget extends WidgetType {
-  constructor(private readonly _identifier: string) {
-    super();
-  }
-
-  override ignoreEvent() {
-    return false;
-  }
-
-  override eq(other: this) {
-    return this._identifier === other._identifier;
-  }
-
-  override toDOM() {
-    const text = this._identifier
-      .split(':')
-      .map((part) => {
-        const len = 16;
-        const plen = 4;
-        if (part.length > len) {
-          return `[${part.slice(0, plen)}…${part.slice(-plen)}]`;
-        }
-        return part;
-      })
-      .join(':');
-    return Domino.of('span').classNames(mx('font-mono dx-tag--blue', tagPadding)).text(text).root;
-  }
-}
-
-// TODO(burdon): Pass in variables.
-const variables = ['this'];
-const commands = ['this', 'each', 'if', 'unless', 'with'];
-
-/**
- * Provides completions for Handlebars variables.
- */
-function handlebarsCompletions(context: CompletionContext): CompletionResult | null {
-  const match = context.matchBefore(/\{\{[^}]*/);
-  if (!match || match.from === match.to) {
-    return null;
-  }
-
-  let type = 'variable';
-  let text = match.text.slice(2);
-  let from = match.from + 2;
-  let matches = [];
-  if (text.startsWith('#') || text.startsWith('/')) {
-    const idx = text.lastIndexOf(' ');
-    if (idx !== -1) {
-      type = 'variable';
-      matches = variables;
-      text = text.slice(idx + 1);
-      from += idx + 1;
-    } else {
-      type = 'command';
-      text = text.slice(1);
-      matches = commands;
-      from += 1;
-    }
-  } else {
-    type = 'variable';
-    matches = variables;
-  }
-
-  const options = matches.filter((name) => name.startsWith(text)).map((name) => ({ type, label: name }));
-  return {
-    from,
-    options,
-  };
-}

package/src/components/TemplateEditor/extensions/index.ts

@@ -1,6 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-export * from './handlebars-extension';
-export * from './xml-extension';

package/src/components/TemplateEditor/extensions/xml-extension.ts

@@ -1,64 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { syntaxTree } from '@codemirror/language';
-import { type Extension, RangeSetBuilder } from '@codemirror/state';
-import { Decoration, type DecorationSet, type EditorView, ViewPlugin, type ViewUpdate } from '@codemirror/view';
-
-export type XmlOptions = {};
-
-/**
- * XML decorator plugin for CodeMirror.
- * Decorates XML tags with monospace font using the XML language grammar.
- */
-export const xmlDecorator = (_: XmlOptions = {}): Extension => {
-  return [xmlDecoratorPlugin];
-};
-
-/**
- * ViewPlugin that decorates XML tags using syntax tree.
- */
-const xmlDecoratorPlugin = ViewPlugin.fromClass(
-  class {
-    decorations: DecorationSet;
-
-    constructor(view: EditorView) {
-      this.decorations = this.buildDecorations(view);
-    }
-
-    update(update: ViewUpdate) {
-      if (update.docChanged || update.viewportChanged) {
-        this.decorations = this.buildDecorations(update.view);
-      }
-    }
-
-    buildDecorations(view: EditorView) {
-      const builder = new RangeSetBuilder<Decoration>();
-
-      for (const { from, to } of view.visibleRanges) {
-        syntaxTree(view.state).iterate({
-          from,
-          to,
-          enter: (node) => {
-            // Decorate XML elements (opening tags, closing tags, self-closing tags).
-            if (
-              node.name === 'HTMLTag' ||
-              node.name === 'OpenTag' ||
-              node.name === 'CloseTag' ||
-              node.name === 'SelfClosingTag' ||
-              node.name === 'Element'
-            ) {
-              builder.add(node.from, node.to, Decoration.mark({ class: 'font-mono text-subdued' }));
-            }
-          },
-        });
-      }
-
-      return builder.finish();
-    }
-  },
-  {
-    decorations: (v) => v.decorations,
-  },
-);

package/src/components/TemplateEditor/index.ts

@@ -1,5 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-export * from './TemplateEditor';

package/src/components/TemplateEditor/types.tsx

@@ -1,28 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-// TODO(burdon): Factor out (shared with backend). core/chain (@dxos/chain).
-// TODO(burdon): Agent/plan-and-execute (with tools). Create design doc/ontology of sequence/agent.
-
-export type Step = {
-  id: string;
-};
-
-export type Variable = {
-  name: string;
-  type: 'value' | 'function' | 'query' | 'retriever' | 'pass-through';
-};
-
-export type Prompt = Step & {
-  title?: string;
-  description?: string;
-  template: string;
-  variables: Variable[];
-};
-
-export type Sequence = Step & {
-  runnable: Step[];
-};
-
-export type Chain = {};

package/src/containers/BlueprintArticle/BlueprintArticle.tsx

@@ -1,29 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React from 'react';
-
-import { type AppSurface } from '@dxos/app-toolkit/ui';
-import { type Blueprint } from '@dxos/compute';
-import { Panel, Toolbar } from '@dxos/react-ui';
-import { useAttention } from '@dxos/react-ui-attention';
-
-import { TemplateEditor } from '#components';
-
-export type BlueprintArticleProps = AppSurface.ObjectArticleProps<Blueprint.Blueprint>;
-
-export const BlueprintArticle = ({ role, attendableId, subject }: BlueprintArticleProps) => {
-  const { hasAttention } = useAttention(attendableId);
-
-  return (
-    <Panel.Root role={role} classNames='dx-document'>
-      <Panel.Toolbar asChild>
-        <Toolbar.Root disabled={!hasAttention} />
-      </Panel.Toolbar>
-      <Panel.Content asChild>
-        <TemplateEditor id={subject.id} source={subject.instructions.source} />
-      </Panel.Content>
-    </Panel.Root>
-  );
-};

package/src/containers/BlueprintArticle/index.ts

@@ -1,5 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-export { BlueprintArticle as default } from './BlueprintArticle';

package/src/containers/RoutineArticle/RoutineArticle.stories.tsx

@@ -1,75 +0,0 @@
-//
-// Copyright 2026 DXOS.org
-//
-
-import { type Meta, type StoryObj } from '@storybook/react-vite';
-import * as Effect from 'effect/Effect';
-import React from 'react';
-
-import { withPluginManager } from '@dxos/app-framework/testing';
-import { Routine } from '@dxos/compute';
-import { Filter } from '@dxos/echo';
-import { AutomationPlugin } from '@dxos/plugin-automation/testing';
-import { ClientPlugin } from '@dxos/plugin-client/testing';
-import { initializeIdentity } from '@dxos/plugin-client/testing';
-import { corePlugins } from '@dxos/plugin-testing';
-import { useQuery, useSpaces } from '@dxos/react-client/echo';
-import { Loading, withLayout, withTheme } from '@dxos/react-ui/testing';
-
-import { translations } from '#translations';
-
-import { AssistantPlugin } from '../../AssistantPlugin';
-import { RoutineArticle } from './RoutineArticle';
-
-const DefaultStory = () => {
-  const [space] = useSpaces();
-  const [routine] = useQuery(space?.db, Filter.type(Routine.Routine));
-  if (!routine) {
-    return <Loading />;
-  }
-
-  return <RoutineArticle role='article' subject={routine} attendableId='story' />;
-};
-
-const meta = {
-  title: 'plugins/plugin-assistant/containers/RoutineArticle',
-  render: DefaultStory,
-  decorators: [
-    withTheme(),
-    withLayout({ layout: 'column' }),
-    withPluginManager({
-      plugins: [
-        ...corePlugins(),
-        ClientPlugin({
-          types: [Routine.Routine],
-          onClientInitialized: ({ client }) =>
-            Effect.gen(function* () {
-              yield* initializeIdentity(client);
-              const [space] = client.spaces.get();
-              yield* Effect.promise(() => space.waitUntilReady());
-
-              space.db.add(
-                Routine.make({
-                  name: 'Summarize',
-                  description: 'Summarize the selected object.',
-                  instructions: 'Create a new markdown document that is a summary of the selected object.',
-                }),
-              );
-            }),
-        }),
-        AutomationPlugin(),
-        AssistantPlugin(),
-      ],
-    }),
-  ],
-  parameters: {
-    layout: 'fullscreen',
-    translations,
-  },
-} satisfies Meta<typeof DefaultStory>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

package/src/containers/RoutineArticle/RoutineArticle.tsx

@@ -1,109 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-
-import { useSpaceCallback } from '@dxos/app-framework/ui';
-import { type AppSurface } from '@dxos/app-toolkit/ui';
-import { AgentPrompt } from '@dxos/assistant-toolkit';
-import { Operation, type Routine } from '@dxos/compute';
-import { Database, Feed, Obj } from '@dxos/echo';
-import { invariant } from '@dxos/invariant';
-import { Panel, Toolbar, useTranslation } from '@dxos/react-ui';
-import { useAttention } from '@dxos/react-ui-attention';
-import { JsonHighlighter } from '@dxos/react-ui-syntax-highlighter';
-
-import { TemplateEditor } from '#components';
-import { meta } from '#meta';
-
-export type RoutineArticleProps = AppSurface.ObjectArticleProps<Routine.Routine>;
-
-type RunState =
-  | { status: 'idle' }
-  | { status: 'running' }
-  | { status: 'success'; result: unknown }
-  | { status: 'error'; error: Error };
-
-// TODO(burdon): Trigger editor.
-export const RoutineArticle = ({ role, attendableId, subject }: RoutineArticleProps) => {
-  const { t } = useTranslation(meta.id);
-  const { hasAttention } = useAttention(attendableId);
-  const invoke = usePromptHandler(subject);
-  const [state, setState] = useState<RunState>({ status: 'idle' });
-  const mountedRef = useRef(true);
-  useEffect(() => {
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-
-  const handleRun = useCallback(async () => {
-    setState({ status: 'running' });
-    try {
-      const result = await invoke();
-      if (mountedRef.current) {
-        setState({ status: 'success', result });
-      }
-    } catch (err) {
-      if (mountedRef.current) {
-        setState({ status: 'error', error: err instanceof Error ? err : new Error(String(err)) });
-      }
-    }
-  }, [invoke]);
-
-  return (
-    <Panel.Root role={role} className='dx-document'>
-      <Panel.Toolbar asChild>
-        <Toolbar.Root disabled={!hasAttention || state.status === 'running'}>
-          <Toolbar.IconButton
-            iconOnly
-            icon={state.status === 'running' ? 'ph--spinner-gap--regular' : 'ph--play--regular'}
-            label={t('run-prompt.label')}
-            onClick={handleRun}
-          />
-        </Toolbar.Root>
-      </Panel.Toolbar>
-      <Panel.Content classNames='flex flex-col gap-2'>
-        <TemplateEditor id={subject.id} source={subject.instructions} />
-        <RoutineResult state={state} />
-      </Panel.Content>
-    </Panel.Root>
-  );
-};
-
-const RoutineResult = ({ state }: { state: RunState }) => {
-  const { t } = useTranslation(meta.id);
-  switch (state.status) {
-    case 'idle':
-      return null;
-    case 'running':
-      return <div className='p-2 text-sm text-subdued'>{t('routine-running.label')}</div>;
-    case 'error':
-      return <div className='p-2 text-sm text-error'>{state.error.message}</div>;
-    case 'success':
-      return <JsonHighlighter classNames='p-2! text-sm' data={state.result} />;
-  }
-};
-
-const usePromptHandler = (routine: Routine.Routine) => {
-  const db = Obj.getDatabase(routine);
-  const data = useMemo<Operation.Definition.Input<typeof AgentPrompt> | undefined>(() => {
-    if (db && routine) {
-      return {
-        prompt: db.makeRef(Obj.getURI(routine)),
-        input: {},
-      };
-    }
-  }, [routine, db]);
-
-  return useSpaceCallback(
-    db?.spaceId,
-    [Database.Service, Feed.FeedService] as const,
-    () => {
-      invariant(data);
-      return Operation.invoke(AgentPrompt, data);
-    },
-    [data],
-  );
-};

package/src/containers/RoutineArticle/index.ts

@@ -1,5 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-export { RoutineArticle as default } from './RoutineArticle';