@dxos/plugin-script 0.8.4-main.c1de068 → 0.8.4-main.dedc0f3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-script",
-  "version": "0.8.4-main.c1de068",
+  "version": "0.8.4-main.dedc0f3",
   "description": "Braneframe notebook plugin",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -10,16 +10,19 @@
   "type": "module",
   "exports": {
     ".": {
+      "source": "./src/index.ts",
       "types": "./dist/types/src/index.d.ts",
       "browser": "./dist/lib/browser/index.mjs",
       "node": "./dist/lib/node-esm/index.mjs"
     },
     "./types": {
+      "source": "./src/types/index.ts",
       "types": "./dist/types/src/types/index.d.ts",
       "browser": "./dist/lib/browser/types/index.mjs",
       "node": "./dist/lib/node-esm/types/index.mjs"
     },
     "./templates": {
+      "source": "./src/templates/index.ts",
       "types": "./dist/types/src/templates/index.d.ts",
       "browser": "./dist/lib/browser/templates/index.mjs",
       "node": "./dist/lib/node-esm/templates/index.mjs"
@@ -41,13 +44,13 @@
     "src"
   ],
   "dependencies": {
-    "@codemirror/autocomplete": "^6.18.1",
-    "@codemirror/lang-javascript": "^6.2.2",
-    "@codemirror/language": "^6.10.3",
-    "@codemirror/lint": "^6.8.2",
-    "@codemirror/state": "^6.4.1",
-    "@codemirror/theme-one-dark": "^6.1.2",
-    "@codemirror/view": "^6.34.1",
+    "@codemirror/autocomplete": "^6.18.7",
+    "@codemirror/lang-javascript": "^6.2.4",
+    "@codemirror/language": "^6.11.3",
+    "@codemirror/lint": "^6.8.5",
+    "@codemirror/state": "^6.5.2",
+    "@codemirror/theme-one-dark": "^6.1.3",
+    "@codemirror/view": "^6.38.2",
     "@lezer/common": "^1.2.2",
     "@lezer/highlight": "^1.2.1",
     "@octokit/core": "^4.0.4",
@@ -60,64 +63,64 @@
     "date-fns": "^3.3.1",
     "esbuild-wasm": "^0.16.14",
     "prettier": "^3.6.2",
-    "react-syntax-highlighter": "^15.5.0",
-    "typescript": "^5.8.3",
-    "@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/client": "0.8.4-main.c1de068",
-    "@dxos/blueprints": "0.8.4-main.c1de068",
-    "@dxos/compute": "0.8.4-main.c1de068",
-    "@dxos/debug": "0.8.4-main.c1de068",
-    "@dxos/client-protocol": "0.8.4-main.c1de068",
-    "@dxos/devtools": "0.8.4-main.c1de068",
-    "@dxos/echo": "0.8.4-main.c1de068",
-    "@dxos/echo-protocol": "0.8.4-main.c1de068",
-    "@dxos/echo-schema": "0.8.4-main.c1de068",
-    "@dxos/functions": "0.8.4-main.c1de068",
-    "@dxos/invariant": "0.8.4-main.c1de068",
-    "@dxos/keys": "0.8.4-main.c1de068",
-    "@dxos/live-object": "0.8.4-main.c1de068",
-    "@dxos/plugin-client": "0.8.4-main.c1de068",
-    "@dxos/log": "0.8.4-main.c1de068",
-    "@dxos/local-storage": "0.8.4-main.c1de068",
-    "@dxos/plugin-deck": "0.8.4-main.c1de068",
-    "@dxos/plugin-explorer": "0.8.4-main.c1de068",
-    "@dxos/plugin-graph": "0.8.4-main.c1de068",
-    "@dxos/plugin-markdown": "0.8.4-main.c1de068",
-    "@dxos/plugin-space": "0.8.4-main.c1de068",
-    "@dxos/plugin-stack": "0.8.4-main.c1de068",
-    "@dxos/plugin-theme": "0.8.4-main.c1de068",
-    "@dxos/plugin-token-manager": "0.8.4-main.c1de068",
-    "@dxos/protocols": "0.8.4-main.c1de068",
-    "@dxos/react-edge-client": "0.8.4-main.c1de068",
-    "@dxos/react-client": "0.8.4-main.c1de068",
-    "@dxos/react-ui-attention": "0.8.4-main.c1de068",
-    "@dxos/react-ui-editor": "0.8.4-main.c1de068",
-    "@dxos/react-ui-list": "0.8.4-main.c1de068",
-    "@dxos/react-ui-form": "0.8.4-main.c1de068",
-    "@dxos/react-ui-menu": "0.8.4-main.c1de068",
-    "@dxos/react-ui-stack": "0.8.4-main.c1de068",
-    "@dxos/react-ui-syntax-highlighter": "0.8.4-main.c1de068",
-    "@dxos/util": "0.8.4-main.c1de068",
-    "@dxos/rpc": "0.8.4-main.c1de068",
-    "@dxos/rpc-tunnel": "0.8.4-main.c1de068",
-    "@dxos/schema": "0.8.4-main.c1de068"
+    "react-syntax-highlighter": "^15.6.1",
+    "typescript": "^5.9.2",
+    "@dxos/ai": "0.8.4-main.dedc0f3",
+    "@dxos/assistant": "0.8.4-main.dedc0f3",
+    "@dxos/client": "0.8.4-main.dedc0f3",
+    "@dxos/client-protocol": "0.8.4-main.dedc0f3",
+    "@dxos/app-framework": "0.8.4-main.dedc0f3",
+    "@dxos/blueprints": "0.8.4-main.dedc0f3",
+    "@dxos/compute": "0.8.4-main.dedc0f3",
+    "@dxos/async": "0.8.4-main.dedc0f3",
+    "@dxos/debug": "0.8.4-main.dedc0f3",
+    "@dxos/devtools": "0.8.4-main.dedc0f3",
+    "@dxos/echo-protocol": "0.8.4-main.dedc0f3",
+    "@dxos/echo": "0.8.4-main.dedc0f3",
+    "@dxos/echo-schema": "0.8.4-main.dedc0f3",
+    "@dxos/functions": "0.8.4-main.dedc0f3",
+    "@dxos/invariant": "0.8.4-main.dedc0f3",
+    "@dxos/keys": "0.8.4-main.dedc0f3",
+    "@dxos/live-object": "0.8.4-main.dedc0f3",
+    "@dxos/local-storage": "0.8.4-main.dedc0f3",
+    "@dxos/log": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-client": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-deck": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-explorer": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-graph": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-markdown": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-space": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-theme": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-stack": "0.8.4-main.dedc0f3",
+    "@dxos/plugin-token-manager": "0.8.4-main.dedc0f3",
+    "@dxos/protocols": "0.8.4-main.dedc0f3",
+    "@dxos/react-client": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-attention": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-editor": "0.8.4-main.dedc0f3",
+    "@dxos/react-edge-client": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-form": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-menu": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-stack": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-list": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-syntax-highlighter": "0.8.4-main.dedc0f3",
+    "@dxos/rpc-tunnel": "0.8.4-main.dedc0f3",
+    "@dxos/schema": "0.8.4-main.dedc0f3",
+    "@dxos/rpc": "0.8.4-main.dedc0f3",
+    "@dxos/util": "0.8.4-main.dedc0f3"
   },
   "devDependencies": {
     "@effect-rx/rx-react": "0.38.0",
-    "@effect/platform": "0.89.0",
+    "@effect/platform": "0.90.2",
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
-    "effect": "3.17.0",
+    "effect": "3.17.7",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "vite": "5.4.7",
-    "@dxos/random": "0.8.4-main.c1de068",
-    "@dxos/react-ui-theme": "0.8.4-main.c1de068",
-    "@dxos/react-ui": "0.8.4-main.c1de068",
-    "@dxos/storybook-utils": "0.8.4-main.c1de068"
+    "vite": "7.1.1",
+    "@dxos/random": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-theme": "0.8.4-main.dedc0f3",
+    "@dxos/storybook-utils": "0.8.4-main.dedc0f3"
   },
   "peerDependencies": {
     "@effect-rx/rx-react": "^0.34.1",
@@ -125,8 +128,8 @@
     "effect": "^3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/react-ui": "0.8.4-main.c1de068",
-    "@dxos/react-ui-theme": "0.8.4-main.c1de068"
+    "@dxos/react-ui": "0.8.4-main.dedc0f3",
+    "@dxos/react-ui-theme": "0.8.4-main.dedc0f3"
   },
   "publishConfig": {
     "access": "public"

package/src/ScriptPlugin.tsx

@@ -4,7 +4,7 @@
 
 import { Schema } from 'effect';
 
-import { Capabilities, contributes, createIntent, defineModule, definePlugin, Events } from '@dxos/app-framework';
+import { Capabilities, Events, contributes, createIntent, defineModule, definePlugin } from '@dxos/app-framework';
 import { Ref } from '@dxos/echo';
 import { ScriptType } from '@dxos/functions';
 import { ClientEvents } from '@dxos/plugin-client';
@@ -13,7 +13,7 @@ import { defineObjectForm } from '@dxos/plugin-space/types';
 
 import {
   AppGraphBuilder,
-  ArtifactDefinition,
+  BlueprintDefinition,
   Compiler,
   IntentResolver,
   ReactSurface,
@@ -85,8 +85,8 @@ export const ScriptPlugin = () =>
       activate: IntentResolver,
     }),
     defineModule({
-      id: `${meta.id}/module/artifact-definition`,
+      id: `${meta.id}/module/blueprint`,
       activatesOn: Events.SetupArtifactDefinition,
-      activate: ArtifactDefinition,
+      activate: BlueprintDefinition,
     }),
   ]);

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

@@ -5,10 +5,10 @@
 import { Rx } from '@effect-rx/rx-react';
 import { Option, pipe } from 'effect';
 
-import { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';
+import { Capabilities, type PluginContext, contributes } from '@dxos/app-framework';
 import { Obj } from '@dxos/echo';
 import { ScriptType } from '@dxos/functions';
-import { PLANK_COMPANION_TYPE, ATTENDABLE_PATH_SEPARATOR } from '@dxos/plugin-deck/types';
+import { ATTENDABLE_PATH_SEPARATOR, PLANK_COMPANION_TYPE } from '@dxos/plugin-deck/types';
 import { createExtension } from '@dxos/plugin-graph';
 
 import { meta } from '../meta';

package/src/capabilities/artifact-definition.ts

@@ -2,11 +2,14 @@
 // Copyright 2025 DXOS.org
 //
 
+// ISSUE(burdon): defineArtifact
+// @ts-nocheck
+
 import { Schema } from 'effect';
 
-import { createTool, ToolResult } from '@dxos/ai';
-import { Capabilities, contributes, createIntent, type PromiseIntentDispatcher } from '@dxos/app-framework';
-import { createArtifactElement, ArtifactId } from '@dxos/assistant';
+import { ToolResult, createTool } from '@dxos/ai';
+import { Capabilities, type PromiseIntentDispatcher, contributes, createIntent } from '@dxos/app-framework';
+import { ArtifactId, createArtifactElement } from '@dxos/assistant';
 import { defineArtifact } from '@dxos/blueprints';
 import { Filter, Obj, Ref } from '@dxos/echo';
 import { ScriptType } from '@dxos/functions';
@@ -156,14 +159,7 @@ export default () => {
         execute: async ({ name, code }, { extensions }) => {
           invariant(extensions?.space, 'No space');
           invariant(extensions?.dispatch, 'No intent dispatcher');
-          const script = Obj.make(ScriptType, {
-            name,
-            source: Ref.make(
-              Obj.make(DataType.Text, {
-                content: code,
-              }),
-            ),
-          });
+          const script = Obj.make(ScriptType, { name, source: Ref.make(DataType.makeText(code)) });
           extensions.space.db.add(script);
           await extensions.space.db.flush();
 

package/src/capabilities/blueprint-definition.ts

@@ -0,0 +1,30 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { Capabilities, contributes } from '@dxos/app-framework';
+import { Blueprint, Template } from '@dxos/blueprints';
+import { type FunctionDefinition } from '@dxos/functions';
+import { trim } from '@dxos/util';
+
+const functions: FunctionDefinition[] = [];
+const tools: string[] = [];
+
+export default () => {
+  return [
+    contributes(Capabilities.Functions, functions),
+    contributes(
+      Capabilities.BlueprintDefinition,
+      Blueprint.make({
+        key: 'dxos.org/blueprint/script',
+        name: 'Script',
+        tools: Blueprint.toolDefinitions({ functions, tools }),
+        instructions: Template.make({
+          source: trim`
+            You can create and update scripts which contain Typescript code.
+          `,
+        }),
+      }),
+    ),
+  ];
+};

package/src/capabilities/compiler.ts

@@ -8,9 +8,10 @@ import wasmUrl from 'esbuild-wasm/esbuild.wasm?url';
 import { contributes } from '@dxos/app-framework';
 import { initializeBundler } from '@dxos/functions/bundler';
 
-import { ScriptCapabilities } from './capabilities';
 import { Compiler } from '../compiler';
 
+import { ScriptCapabilities } from './capabilities';
+
 export default async () => {
   const compiler = new Compiler();
 

package/src/capabilities/index.ts

@@ -5,7 +5,7 @@
 import { lazy } from '@dxos/app-framework';
 
 export const AppGraphBuilder = lazy(() => import('./app-graph-builder'));
-export const ArtifactDefinition = lazy(() => import('./artifact-definition'));
+export const BlueprintDefinition = lazy(() => import('./blueprint-definition'));
 export const Compiler = lazy(() => import('./compiler'));
 export const IntentResolver = lazy(() => import('./intent-resolver'));
 export const ReactSurface = lazy(() => import('./react-surface'));

package/src/capabilities/intent-resolver.ts

@@ -5,7 +5,7 @@
 import { Octokit } from '@octokit/core';
 import { Predicate } from 'effect';
 
-import { contributes, Capabilities, createResolver, createIntent, LayoutAction } from '@dxos/app-framework';
+import { Capabilities, LayoutAction, contributes, createIntent, createResolver } from '@dxos/app-framework';
 import { Obj, Ref } from '@dxos/echo';
 import { ScriptType } from '@dxos/functions';
 import { TokenManagerAction } from '@dxos/plugin-token-manager/types';
@@ -47,10 +47,7 @@ export default () =>
 
         return {
           data: {
-            object: Obj.make(ScriptType, {
-              name,
-              source: Ref.make(Obj.make(DataType.Text, { content })),
-            }),
+            object: Obj.make(ScriptType, { name, source: Ref.make(DataType.makeText(content)) }),
           },
         };
       },

package/src/capabilities/react-surface.tsx

@@ -13,19 +13,20 @@ import { getSpace } from '@dxos/react-client/echo';
 import { StackItem } from '@dxos/react-ui-stack';
 import { type DataType } from '@dxos/schema';
 
-import { ScriptCapabilities } from './capabilities';
 import {
   DEPLOYMENT_DIALOG,
   DeploymentDialog,
   ScriptContainer,
-  ScriptPluginSettings,
   ScriptObjectSettings,
+  ScriptPluginSettings,
   ScriptProperties,
   TestContainer,
 } from '../components';
 import { meta } from '../meta';
 import { type ScriptSettingsProps } from '../types';
 
+import { ScriptCapabilities } from './capabilities';
+
 export default () =>
   contributes(Capabilities.ReactSurface, [
     createSurface({

package/src/compiler/compiler.ts

@@ -3,10 +3,10 @@
 //
 
 import {
+  type VirtualTypeScriptEnvironment,
   createDefaultMapFromCDN,
   createSystem,
   createVirtualTypeScriptEnvironment,
-  type VirtualTypeScriptEnvironment,
 } from '@typescript/vfs';
 import ts from 'typescript';
 

package/src/components/DeploymentDialog/DeploymentDialog.stories.tsx

@@ -4,36 +4,48 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react-vite';
+import { type Meta, type StoryObj } from '@storybook/react-vite';
 import React from 'react';
 
+import { Obj } from '@dxos/echo';
 import { Dialog } from '@dxos/react-ui';
+import { DataType } from '@dxos/schema';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { translations } from '../../translations';
-import { DeploymentDialog } from '../DeploymentDialog/DeploymentDialog';
 
-export const Default = {
-  args: {
-    accessToken: { value: 'example-token' },
-    scripts: [
-      { label: 'Script 1', templateId: 'template1' },
-      { label: 'Script 2', templateId: 'template2' },
-      { label: 'Script 3', templateId: 'template3' },
-    ],
-  },
-  render: (args: any) => (
+import { DeploymentDialog, type DeploymentDialogProps } from './DeploymentDialog';
+
+const DefaultStory = (props: DeploymentDialogProps) => {
+  return (
     <Dialog.Root defaultOpen={true}>
-      <DeploymentDialog {...args} />
+      <DeploymentDialog {...props} />
     </Dialog.Root>
-  ),
+  );
 };
 
-const meta: Meta = {
+const meta = {
   title: 'plugins/plugin-script/DeploymentDialog',
   component: DeploymentDialog,
+  render: DefaultStory,
   parameters: { translations },
   decorators: [withTheme, withLayout()],
-};
+} satisfies Meta<typeof DefaultStory>;
 
 export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    accessToken: Obj.make(DataType.AccessToken, {
+      source: 'example.com',
+      token: 'example-token',
+    }),
+    scriptTemplates: [
+      { id: 't-1', name: 'Script 1', source: 'template1' },
+      { id: 't-2', name: 'Script 2', source: 'template2' },
+      { id: 't-3', name: 'Script 3', source: 'template3' },
+    ],
+  },
+};

package/src/components/DeploymentDialog/DeploymentDialog.tsx

@@ -4,7 +4,7 @@
 
 import React, { useEffect, useMemo } from 'react';
 
-import { createIntent, LayoutAction, useIntentDispatcher } from '@dxos/app-framework';
+import { LayoutAction, createIntent, useIntentDispatcher } from '@dxos/app-framework';
 import { getSpace } from '@dxos/react-client/echo';
 import { Button, Dialog, Icon, useTranslation } from '@dxos/react-ui';
 import { type DataType } from '@dxos/schema';
@@ -16,11 +16,11 @@ import { type Template } from '../../templates';
 export const DEPLOYMENT_DIALOG = `${SCRIPT_PLUGIN}/deployment/dialog`;
 
 // TODO(ZaymonFC):
-//   - Show activity and feedback to the user.
-//   - Only take an array of templateIds and get the name from the data.
-//   - Pending / onError states.
+//  - Show activity and feedback to the user.
+//  - Only take an array of templateIds and get the name from the data.
+//  - Pending / onError states.
 
-type DeploymentDialogProps = {
+export type DeploymentDialogProps = {
   accessToken: DataType.AccessToken;
   scriptTemplates: Template[];
 };

package/src/components/DeploymentDialog/index.ts

@@ -2,7 +2,7 @@
 // Copyright 2025 DXOS.org
 //
 
-import { DeploymentDialog, DEPLOYMENT_DIALOG } from './DeploymentDialog';
+import { DEPLOYMENT_DIALOG, DeploymentDialog } from './DeploymentDialog';
 
 export { DEPLOYMENT_DIALOG };
 

package/src/components/FrameContainer/FrameContainer.tsx

@@ -48,7 +48,8 @@ export const FrameContainer = ({ containerUrl, result, debug = true }: FrameCont
   // Encodes compiled code via URL.
   invariant(result.sourceHash, 'Source hash is required.');
   const sourceHash = Buffer.from(result.sourceHash).toString('hex');
-  const src = result.bundle && `${containerUrl}?ts=${sourceHash}#code=${encodeURIComponent(result.bundle)}`;
+  const src =
+    'bundle' in result ? `${containerUrl}?ts=${sourceHash}#code=${encodeURIComponent(result.bundle)}` : undefined;
 
   return (
     <>
@@ -68,7 +69,7 @@ export const FrameContainer = ({ containerUrl, result, debug = true }: FrameCont
                 {
                   timestamp: result.timestamp,
                   sourceHash,
-                  error: result.error,
+                  error: 'error' in result ? result.error : undefined,
                   src,
                 },
                 undefined,

package/src/components/ScriptContainer.tsx

@@ -10,11 +10,12 @@ import { useIdentity } from '@dxos/react-client/halo';
 import { createDataExtensions, listener, stackItemContentEditorClassNames } from '@dxos/react-ui-editor';
 import { StackItem } from '@dxos/react-ui-stack';
 
-import { ScriptToolbar } from './ScriptToolbar';
-import { TypescriptEditor, type TypescriptEditorProps } from './TypescriptEditor';
 import { useDeployState, useToolbarState } from '../hooks';
 import { type ScriptSettingsProps } from '../types';
 
+import { ScriptToolbar } from './ScriptToolbar';
+import { TypescriptEditor, type TypescriptEditorProps } from './TypescriptEditor';
+
 export type ScriptEditorProps = {
   role: string;
   script: ScriptType;

package/src/components/ScriptToolbar/ScriptToolbar.stories.tsx

@@ -4,27 +4,32 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react-vite';
+import { type Meta, type StoryObj } from '@storybook/react-vite';
 
+import { Obj, Ref } from '@dxos/echo';
+import { ScriptType } from '@dxos/functions';
+import { DataType } from '@dxos/schema';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { ScriptToolbar } from './ScriptToolbar';
-import { templates } from '../../templates';
 
-export const Default = {
-  args: {
-    binding: 'example',
-    deployed: true,
-    templates,
-    onFormat: () => console.log('Format'),
-    onTogglePanel: () => {},
-  },
-};
-
-const meta: Meta = {
+const meta = {
   title: 'plugins/plugin-script/Toolbar',
   component: ScriptToolbar,
   decorators: [withTheme, withLayout()],
-};
+} satisfies Meta<typeof ScriptToolbar>;
 
 export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    script: Obj.make(ScriptType, {
+      name: 'test',
+      description: 'test',
+      source: Ref.make(DataType.makeText('test')),
+    }),
+    state: {},
+  },
+};

package/src/components/ScriptToolbar/ScriptToolbar.tsx

@@ -7,8 +7,15 @@ import React, { useMemo } from 'react';
 
 import { type ScriptType } from '@dxos/functions';
 import { fullyQualifiedId } from '@dxos/react-client/echo';
-import { ElevationProvider, useTranslation, type ThemedClassName } from '@dxos/react-ui';
-import { createGapSeparator, MenuProvider, rxFromSignal, ToolbarMenu, useMenuActions } from '@dxos/react-ui-menu';
+import { ElevationProvider, type ThemedClassName, useTranslation } from '@dxos/react-ui';
+import {
+  type ActionGraphProps,
+  MenuProvider,
+  ToolbarMenu,
+  createGapSeparator,
+  rxFromSignal,
+  useMenuActions,
+} from '@dxos/react-ui-menu';
 
 import {
   type CreateDeployOptions,
@@ -20,7 +27,7 @@ import {
 } from '../../hooks';
 import { SCRIPT_PLUGIN } from '../../meta';
 
-const createToolbar = ({ state, script, ...options }: CreateDeployOptions) =>
+const createToolbarActions = ({ state, script, ...options }: CreateDeployOptions): Rx.Rx<ActionGraphProps> =>
   Rx.make((get) =>
     get(
       rxFromSignal(() => {
@@ -45,7 +52,10 @@ export type ScriptToolbarProps = ThemedClassName<{
 export const ScriptToolbar = ({ script, role, state, classNames }: ScriptToolbarProps) => {
   const { t } = useTranslation(SCRIPT_PLUGIN);
   const options = useDeployDeps({ script });
-  const toolbarCreator = useMemo(() => createToolbar({ state, script, t, ...options }), [state, script, options, t]);
+  const toolbarCreator = useMemo(
+    () => createToolbarActions({ state, script, t, ...options }),
+    [state, script, options, t],
+  );
   const menu = useMenuActions(toolbarCreator);
 
   return (