@dxos/plugin-debug 0.8.4-main.3c1ae3b → 0.8.4-main.52d7546f51

package/src/components/DevtoolsOverviewContainer.tsx

@@ -4,7 +4,7 @@
 
 import React from 'react';
 
-import { Surface } from '@dxos/app-framework/react';
+import { Surface } from '@dxos/app-framework/ui';
 import { StatsPanel, useStats } from '@dxos/devtools';
 
 export const DevtoolsOverviewContainer = () => {
@@ -12,7 +12,7 @@ export const DevtoolsOverviewContainer = () => {
 
   return (
     <StatsPanel stats={stats} onRefresh={refreshStats}>
-      <Surface role='devtools-overview' />
+      <Surface.Surface role='devtools-overview' />
     </StatsPanel>
   );
 };

package/src/components/SpaceGenerator/ObjectGenerator.tsx

@@ -4,14 +4,14 @@
 
 import type * as Schema from 'effect/Schema';
 
-import { type PromiseIntentDispatcher, createIntent } from '@dxos/app-framework';
 import { addressToA1Notation } from '@dxos/compute';
 import { ComputeGraph, ComputeGraphModel, DEFAULT_OUTPUT, NODE_INPUT, NODE_OUTPUT } from '@dxos/conductor';
 import { DXN, Filter, Key, type Type } from '@dxos/echo';
+import { type OperationInvoker } from '@dxos/operation';
 import { Markdown } from '@dxos/plugin-markdown/types';
 import { Sheet } from '@dxos/plugin-sheet/types';
 import { Diagram } from '@dxos/plugin-sketch/types';
-import { SpaceAction } from '@dxos/plugin-space/types';
+import { SpaceOperation } from '@dxos/plugin-space/types';
 import { faker } from '@dxos/random';
 import { type Client } from '@dxos/react-client';
 import { type Space } from '@dxos/react-client/echo';
@@ -29,7 +29,7 @@ export type ObjectGenerator<T> = (space: Space, n: number, cb?: (objects: T[]) =
 
 export const createGenerator = <S extends Type.Obj.Any>(
   client: Client,
-  dispatch: PromiseIntentDispatcher,
+  invokePromise: OperationInvoker.OperationInvoker['invokePromise'],
   schema: S,
 ): ObjectGenerator<Schema.Schema.Type<S>> => {
   return async (space: Space, n: number): Promise<Schema.Schema.Type<S>[]> => {
@@ -40,9 +40,9 @@ export const createGenerator = <S extends Type.Obj.Any>(
     const view = await findViewByTypename(views, typename);
     const staticSchema = client?.graph.schemaRegistry.query({ typename }).runSync()[0];
     if (!view && !staticSchema) {
-      await dispatch(createIntent(SpaceAction.AddSchema, { space, schema, show: false }));
+      await invokePromise(SpaceOperation.AddSchema, { db: space.db, schema, show: false });
     } else if (!view && staticSchema) {
-      await dispatch(createIntent(SpaceAction.UseStaticSchema, { space, typename, show: false }));
+      await invokePromise(SpaceOperation.UseStaticSchema, { db: space.db, typename, show: false });
     }
 
     // Create objects.

package/src/components/SpaceGenerator/SpaceGenerator.stories.tsx

@@ -3,9 +3,10 @@
 //
 
 import { type Meta, type StoryObj } from '@storybook/react-vite';
+import * as Effect from 'effect/Effect';
 import React from 'react';
 
-import { IntentPlugin } from '@dxos/app-framework';
+import { OperationPlugin } from '@dxos/app-framework';
 import { withPluginManager } from '@dxos/app-framework/testing';
 import { ClientPlugin } from '@dxos/plugin-client';
 import { useSpaces } from '@dxos/react-client/echo';
@@ -28,15 +29,16 @@ const meta = {
   component: SpaceGenerator as any,
   render: render(DefaultStory),
   decorators: [
-    withTheme,
+    withTheme(),
     withPluginManager({
       plugins: [
         ClientPlugin({
-          onClientInitialized: async ({ client }) => {
-            await client.halo.createIdentity();
-          },
+          onClientInitialized: ({ client }) =>
+            Effect.gen(function* () {
+              yield* Effect.promise(() => client.halo.createIdentity());
+            }),
         }),
-        IntentPlugin(),
+        OperationPlugin(),
       ],
     }),
   ],

package/src/components/SpaceGenerator/SpaceGenerator.tsx

@@ -4,7 +4,7 @@
 
 import React, { useCallback, useMemo, useState } from 'react';
 
-import { useIntentDispatcher } from '@dxos/app-framework/react';
+import { useOperationInvoker } from '@dxos/app-framework/ui';
 import { ComputeGraph } from '@dxos/conductor';
 import { Filter, Obj, type Type } from '@dxos/echo';
 import { Markdown } from '@dxos/plugin-markdown/types';
@@ -12,7 +12,7 @@ import { Sheet } from '@dxos/plugin-sheet/types';
 import { Diagram } from '@dxos/plugin-sketch/types';
 import { useClient } from '@dxos/react-client';
 import { type Space } from '@dxos/react-client/echo';
-import { IconButton, Input, Toolbar, useAsyncEffect } from '@dxos/react-ui';
+import { IconButton, Input, Layout, ScrollArea, Toolbar, useAsyncEffect } from '@dxos/react-ui';
 import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
 import { Organization, Person, Task } from '@dxos/types';
 import { jsonKeyReplacer, sortKeys } from '@dxos/util';
@@ -23,11 +23,11 @@ import { SchemaTable } from './SchemaTable';
 
 export type SpaceGeneratorProps = {
   space: Space;
-  onCreateObjects?: (objects: Obj.Any[]) => void;
+  onCreateObjects?: (objects: Obj.Unknown[]) => void;
 };
 
 export const SpaceGenerator = ({ space, onCreateObjects }: SpaceGeneratorProps) => {
-  const { dispatchPromise: dispatch } = useIntentDispatcher();
+  const { invokePromise } = useOperationInvoker();
   const client = useClient();
   const staticTypes = [Markdown.Document, Diagram.Diagram, Sheet.Sheet, ComputeGraph]; // TODO(burdon): Make extensible.
   const recordTypes: Type.Obj.Any[] = [Organization.Organization, Person.Person, Task.Task];
@@ -43,17 +43,17 @@ export const SpaceGenerator = ({ space, onCreateObjects }: SpaceGeneratorProps)
   // Create type generators.
   const typeMap = useMemo(() => {
     const recordGenerators = new Map<string, ObjectGenerator<any>>(
-      recordTypes.map((type) => [type.typename, createGenerator(client, dispatch, type)]),
+      recordTypes.map((type) => [type.typename, createGenerator(client, invokePromise, type)]),
     );
 
     return new Map([...staticGenerators, ...presets.items, ...recordGenerators]);
-  }, [client, recordTypes]);
+  }, [client, recordTypes, invokePromise]);
 
   // Query space to get info.
   const updateInfo = async () => {
     // Create schema map.
     const echoSchema = await space.db.schemaRegistry.query().run();
-    const staticSchema = space.db.graph.schemaRegistry.schemas;
+    const staticSchema = await space.db.graph.schemaRegistry.query().run();
 
     // Create object map.
     const objects = await space.db.query(Filter.everything()).run();
@@ -64,6 +64,7 @@ export const SpaceGenerator = ({ space, onCreateObjects }: SpaceGeneratorProps)
           const count = map[type] ?? 0;
           map[type] = count + 1;
         }
+
         return map;
       }, {}),
     );
@@ -92,35 +93,34 @@ export const SpaceGenerator = ({ space, onCreateObjects }: SpaceGeneratorProps)
   );
 
   return (
-    <div role='none' className='flex flex-col grow overflow-hidden'>
-      <Toolbar.Root classNames='border-be border-subduedSeparator'>
+    <Layout.Main toolbar>
+      <Toolbar.Root>
         <IconButton icon='ph--arrow-clockwise--regular' iconOnly label='Refresh' onClick={updateInfo} />
         <Toolbar.Separator variant='gap' />
         <Input.Root>
           <Input.TextInput
             type='number'
+            placeholder='Count'
+            classNames='is-[4rem] text-right'
             min={1}
             max={100}
-            placeholder={'Count'}
-            classNames='!w-[4rem] !text-right'
             size={8}
             value={count}
-            onChange={(ev) => setCount(parseInt(ev.target.value))}
+            onChange={(event) => setCount(parseInt(event.target.value))}
           />
         </Input.Root>
       </Toolbar.Root>
 
-      <div className='flex flex-col overflow-y-auto divide-y divide-separator'>
-        <SchemaTable types={staticTypes} objects={info.objects} label='Static Types' onClick={handleCreateData} />
-        <SchemaTable types={recordTypes} objects={info.objects} label='Record Types' onClick={handleCreateData} />
-        <SchemaTable types={presets.types} objects={info.objects} label='Presets' onClick={handleCreateData} />
-
-        <div>
+      <ScrollArea.Root thin orientation='vertical'>
+        <ScrollArea.Viewport classNames='gap-4 divide-y divide-subduedSeparator'>
+          <SchemaTable types={staticTypes} objects={info.objects} label='Static Types' onClick={handleCreateData} />
+          <SchemaTable types={recordTypes} objects={info.objects} label='Record Types' onClick={handleCreateData} />
+          <SchemaTable types={presets.types} objects={info.objects} label='Presets' onClick={handleCreateData} />
           <SyntaxHighlighter language='json' classNames='text-xs'>
             {JSON.stringify({ space, ...info }, jsonKeyReplacer({ truncate: true }), 2)}
           </SyntaxHighlighter>
-        </div>
-      </div>
-    </div>
+        </ScrollArea.Viewport>
+      </ScrollArea.Root>
+    </Layout.Main>
   );
 };

package/src/components/SpaceGenerator/presets.ts

@@ -7,7 +7,7 @@ import * as Schema from 'effect/Schema';
 import { Agent, EntityExtraction, ResearchBlueprint } from '@dxos/assistant-toolkit';
 import { Prompt } from '@dxos/blueprints';
 import { type ComputeGraphModel, NODE_INPUT } from '@dxos/conductor';
-import { DXN, Filter, Key, Obj, Query, Ref, Tag, Type } from '@dxos/echo';
+import { DXN, Filter, Key, Obj, Query, type QueryAST, Ref, Tag, Type } from '@dxos/echo';
 import { Trigger, serializeFunction } from '@dxos/functions';
 import { invariant } from '@dxos/invariant';
 import { gmail } from '@dxos/plugin-inbox';
@@ -29,15 +29,9 @@ import {
   createText,
   createTrigger,
 } from '@dxos/react-ui-canvas-compute';
-import {
-  CanvasBoardType,
-  CanvasGraphModel,
-  pointMultiply,
-  pointsToRect,
-  rectToPoints,
-} from '@dxos/react-ui-canvas-editor';
+import { CanvasBoard, CanvasGraphModel, pointMultiply, pointsToRect, rectToPoints } from '@dxos/react-ui-canvas-editor';
 import { View } from '@dxos/schema';
-import { Message, Organization, Person, Project } from '@dxos/types';
+import { Message, Organization, Person, Pipeline } from '@dxos/types';
 import { range, trim } from '@dxos/util';
 
 import { type ObjectGenerator } from './ObjectGenerator';
@@ -57,14 +51,19 @@ export enum PresetName {
 }
 
 export const generator = () => ({
-  schemas: [CanvasBoardType, Trigger.Trigger],
+  schemas: [CanvasBoard.CanvasBoard, Trigger.Trigger] as any[],
   types: Object.values(PresetName).map((name) => ({ typename: name })),
   items: [
     [
       PresetName.DXOS_TEAM,
       async (space, n, cb) => {
         const objects = range(n, () => {
-          const org = space.db.add(Obj.make(Organization.Organization, { name: 'DXOS', website: 'https://dxos.org' }));
+          const org = space.db.add(
+            Obj.make(Organization.Organization, {
+              name: 'DXOS',
+              website: 'https://dxos.org',
+            }),
+          );
           const doc = space.db.add(
             Markdown.make({
               name: 'DXOS Research',
@@ -74,7 +73,9 @@ export const generator = () => ({
 
           const tag = space.db.add(Tag.make({ label: 'Investor' }));
           const tagDxn = Obj.getDXN(tag).toString();
-          Obj.getMeta(doc).tags = [tagDxn];
+          Obj.change(doc, (d) => {
+            Obj.getMeta(d).tags = [tagDxn];
+          });
 
           // space.db.add(
           //   Relation.make(HasSubject, {
@@ -85,9 +86,24 @@ export const generator = () => ({
           // );
 
           space.db.add(Obj.make(Person.Person, { fullName: 'Rich', organization: Ref.make(org) }, { tags: [tagDxn] }));
-          space.db.add(Obj.make(Person.Person, { fullName: 'Josiah', organization: Ref.make(org) }));
-          space.db.add(Obj.make(Person.Person, { fullName: 'Dima', organization: Ref.make(org) }));
-          space.db.add(Obj.make(Person.Person, { fullName: 'Mykola', organization: Ref.make(org) }));
+          space.db.add(
+            Obj.make(Person.Person, {
+              fullName: 'Josiah',
+              organization: Ref.make(org),
+            }),
+          );
+          space.db.add(
+            Obj.make(Person.Person, {
+              fullName: 'Dima',
+              organization: Ref.make(org),
+            }),
+          );
+          space.db.add(
+            Obj.make(Person.Person, {
+              fullName: 'Mykola',
+              organization: Ref.make(org),
+            }),
+          );
 
           return doc;
         });
@@ -116,7 +132,7 @@ export const generator = () => ({
               },
               function: Ref.make(serializeFunction(gmail.sync)),
               input: {
-                mailboxId: Obj.getDXN(mailbox).toString(),
+                mailbox: Ref.make(mailbox),
               },
             }),
           );
@@ -175,7 +191,9 @@ export const generator = () => ({
 
           const mailboxView = View.make({
             query: Query.select(
-              Filter.type(Message.Message, { properties: { labels: Filter.contains('investor') } }),
+              Filter.type(Message.Message, {
+                properties: { labels: Filter.contains('investor') },
+              }),
             ).options({
               queues: [mailbox.queue.dxn.toString()],
             }),
@@ -195,7 +213,7 @@ export const generator = () => ({
           });
 
           return space.db.add(
-            Project.make({
+            Pipeline.make({
               name: 'Investor Research',
               columns: [
                 {
@@ -247,10 +265,24 @@ export const generator = () => ({
             const append = canvasModel.createNode(createAppend(position({ x: 10, y: 6 })));
 
             builder
-              .createEdge({ source: trigger.id, target: gpt.id, input: 'prompt', output: 'bodyText' })
+              .createEdge({
+                source: trigger.id,
+                target: gpt.id,
+                input: 'prompt',
+                output: 'bodyText',
+              })
               .createEdge({ source: gpt.id, target: text.id, output: 'text' })
-              .createEdge({ source: queueId.id, target: append.id, input: 'id' })
-              .createEdge({ source: gpt.id, target: append.id, output: 'messages', input: 'items' });
+              .createEdge({
+                source: queueId.id,
+                target: append.id,
+                input: 'id',
+              })
+              .createEdge({
+                source: gpt.id,
+                target: append.id,
+                output: 'messages',
+                input: 'items',
+              });
 
             functionTrigger = triggerShape.functionTrigger!.target!;
           });
@@ -275,7 +307,7 @@ export const generator = () => ({
             'subscription',
             (triggerSpec) =>
               (triggerSpec.query = {
-                ast: Query.select(Filter.typename('dxos.org/type/Chess')).ast,
+                ast: Query.select(Filter.typename('dxos.org/type/Chess')).ast as Obj.Mutable<QueryAST.Query>,
               }),
             'type',
           );
@@ -388,8 +420,17 @@ export const generator = () => ({
             builder
               .createEdge({ source: chat.id, target: gpt.id, input: 'prompt' })
               .createEdge({ source: gpt.id, target: text.id, output: 'text' })
-              .createEdge({ source: queueId.id, target: append.id, input: 'id' })
-              .createEdge({ source: gpt.id, target: append.id, output: 'messages', input: 'items' });
+              .createEdge({
+                source: queueId.id,
+                target: append.id,
+                input: 'id',
+              })
+              .createEdge({
+                source: gpt.id,
+                target: append.id,
+                output: 'messages',
+                input: 'items',
+              });
           });
 
           const computeModel = createComputeGraph(canvasModel);
@@ -513,9 +554,21 @@ export const generator = () => ({
             const view = canvasModel.createNode(createSurface(position({ x: 12, y: 0 })));
 
             builder
-              .createEdge({ source: sourceCurrency.id, target: converter.id, input: 'from' })
-              .createEdge({ source: targetCurrency.id, target: converter.id, input: 'to' })
-              .createEdge({ source: converter.id, target: view.id, output: 'rate' });
+              .createEdge({
+                source: sourceCurrency.id,
+                target: converter.id,
+                input: 'from',
+              })
+              .createEdge({
+                source: targetCurrency.id,
+                target: converter.id,
+                input: 'to',
+              })
+              .createEdge({
+                source: converter.id,
+                target: view.id,
+                output: 'rate',
+              });
           });
 
           const computeModel = createComputeGraph(canvasModel);
@@ -543,7 +596,10 @@ export const generator = () => ({
             const trigger = canvasModel.createNode(triggerShape);
             // DXOS dev-null channel.
             const channelId = canvasModel.createNode(
-              createConstant({ value: '1088569858767212554', ...position({ x: -10, y: 0 }) }),
+              createConstant({
+                value: '1088569858767212554',
+                ...position({ x: -10, y: 0 }),
+              }),
             );
             const queueId = canvasModel.createNode(
               createConstant({
@@ -556,11 +612,31 @@ export const generator = () => ({
             const queue = canvasModel.createNode(createQueue(position({ x: 0, y: 12 })));
 
             builder
-              .createEdge({ source: trigger.id, target: converter.id, input: 'tick' })
-              .createEdge({ source: channelId.id, target: converter.id, input: 'channelId' })
-              .createEdge({ source: queueId.id, target: converter.id, input: 'queueId' })
-              .createEdge({ source: converter.id, target: view.id, output: 'newMessages' })
-              .createEdge({ source: queueId.id, target: queue.id, input: 'input' });
+              .createEdge({
+                source: trigger.id,
+                target: converter.id,
+                input: 'tick',
+              })
+              .createEdge({
+                source: channelId.id,
+                target: converter.id,
+                input: 'channelId',
+              })
+              .createEdge({
+                source: queueId.id,
+                target: converter.id,
+                input: 'queueId',
+              })
+              .createEdge({
+                source: converter.id,
+                target: view.id,
+                output: 'newMessages',
+              })
+              .createEdge({
+                source: queueId.id,
+                target: queue.id,
+                input: 'input',
+              });
 
             functionTrigger = triggerShape.functionTrigger!.target!;
           });
@@ -630,7 +706,7 @@ export const generator = () => ({
 const createQueueSinkPreset = <SpecType extends Trigger.Kind>(
   space: Space,
   triggerKind: SpecType,
-  initSpec: (spec: Extract<Trigger.Spec, { kind: SpecType }>) => void,
+  initSpec: (spec: Obj.Mutable<Extract<Trigger.Spec, { kind: SpecType }>>) => void,
   triggerOutputName: string,
 ) => {
   const canvasModel = CanvasGraphModel.create<ComputeShape>();
@@ -663,7 +739,12 @@ const createQueueSinkPreset = <SpecType extends Trigger.Kind>(
     builder
       .createEdge({ source: queueId.id, target: append.id, input: 'id' })
       .createEdge({ source: template.id, target: append.id, input: 'items' })
-      .createEdge({ source: trigger.id, target: template.id, output: triggerOutputName, input: 'type' })
+      .createEdge({
+        source: trigger.id,
+        target: template.id,
+        output: triggerOutputName,
+        input: 'type',
+      })
       .createEdge({
         source: random.id,
         target: template.id,
@@ -673,13 +754,16 @@ const createQueueSinkPreset = <SpecType extends Trigger.Kind>(
     functionTrigger = triggerShape.functionTrigger!.target!;
     const triggerSpec = functionTrigger.spec;
     invariant(triggerSpec && triggerSpec.kind === triggerKind, 'No trigger spec.');
-    initSpec(triggerSpec as any);
+    Obj.change(functionTrigger, (ft) => {
+      initSpec(ft.spec as any);
+    });
   });
 
   const computeModel = createComputeGraph(canvasModel);
 
   const templateComputeNode = computeModel.nodes.find((n) => n.id === template.node);
   invariant(templateComputeNode, 'Template compute node was not created.');
+  // NOTE: These are plain object mutations during model construction, not ECHO object mutations.
   templateComputeNode.value = ['{', '  "@type": "{{type}}",', '  "id": "@{{changeId}}"', '}'].join('\n');
   templateComputeNode.inputSchema = Type.toJsonSchema(Schema.Struct({ type: Schema.String, changeId: Schema.String }));
   attachTrigger(functionTrigger, computeModel);
@@ -689,7 +773,7 @@ const createQueueSinkPreset = <SpecType extends Trigger.Kind>(
 
 const addToSpace = (name: string, space: Space, canvas: CanvasGraphModel, compute: ComputeGraphModel) => {
   return space.db.add(
-    Obj.make(CanvasBoardType, {
+    Obj.make(CanvasBoard.CanvasBoard, {
       name,
       computeGraph: Ref.make(compute.root),
       layout: canvas.graph,
@@ -719,15 +803,25 @@ const setupQueue = (
 
 const attachTrigger = (functionTrigger: Trigger.Trigger | undefined, computeModel: ComputeGraphModel) => {
   invariant(functionTrigger);
-  functionTrigger.function = Ref.make(computeModel.root);
   const inputNode = computeModel.nodes.find((node) => node.type === NODE_INPUT)!;
-  functionTrigger.inputNodeId = inputNode.id;
+  Obj.change(functionTrigger, (t) => {
+    t.function = Ref.make(computeModel.root);
+    t.inputNodeId = inputNode.id;
+  });
 };
 
-type RawPositionInput = { centerX: number; centerY: number; width: number; height: number };
+type RawPositionInput = {
+  centerX: number;
+  centerY: number;
+  width: number;
+  height: number;
+};
 
 const rawPosition = (args: RawPositionInput) => {
-  return { center: { x: args.centerX, y: args.centerY }, size: { width: args.width, height: args.height } };
+  return {
+    center: { x: args.centerX, y: args.centerY },
+    size: { width: args.width, height: args.height },
+  };
 };
 
 const position = (rect: { x: number; y: number; width?: number; height?: number }) => {
@@ -735,7 +829,10 @@ const position = (rect: { x: number; y: number; width?: number; height?: number
   const [center, size] = rectToPoints({ width: 0, height: 0, ...rect });
   const { x, y, width, height } = pointsToRect([pointMultiply(center, snap), pointMultiply(size, snap)]);
   if (width && height) {
-    return { center: { x, y }, size: width && height ? { width, height } : undefined };
+    return {
+      center: { x, y },
+      size: width && height ? { width, height } : undefined,
+    };
   } else {
     return { center: { x, y } };
   }

package/src/components/Wireframe.tsx

@@ -9,11 +9,11 @@ import { Obj } from '@dxos/echo';
 import { type ThemedClassName } from '@dxos/react-ui';
 import { useAttentionAttributes } from '@dxos/react-ui-attention';
 import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
-import { mx } from '@dxos/react-ui-theme';
+import { mx } from '@dxos/ui-theme';
 
 // TODO(burdon): Create generic container with wireframe mode.
 export type WireframeProps = ThemedClassName<{
-  object: Obj.Any;
+  object: Obj.Unknown;
   label?: string;
 }>;
 

package/src/components/index.ts

@@ -3,8 +3,11 @@
 //
 
 import { lazy } from 'react';
+import { type FC } from 'react';
 
-export const DebugGraph = lazy(() => import('./DebugGraph'));
+import { type DebugGraphProps } from './DebugGraph';
+
+export const DebugGraph: ReturnType<typeof lazy<FC<DebugGraphProps>>> = lazy(() => import('./DebugGraph'));
 export const DevtoolsOverviewContainer = lazy(() => import('./DevtoolsOverviewContainer'));
 export const SpaceGenerator = lazy(() => import('./SpaceGenerator'));
 

package/src/meta.ts

@@ -2,10 +2,10 @@
 // Copyright 2023 DXOS.org
 //
 
-import { type PluginMeta } from '@dxos/app-framework';
+import { type Plugin } from '@dxos/app-framework';
 import { trim } from '@dxos/util';
 
-export const meta: PluginMeta = {
+export const meta: Plugin.Meta = {
   id: 'dxos.org/plugin/debug',
   name: 'Debug',
   description: trim`

package/src/types.ts

@@ -2,11 +2,15 @@
 // Copyright 2023 DXOS.org
 //
 
+import { type Atom } from '@effect-atom/atom-react';
 import * as Schema from 'effect/Schema';
 import { type Context, createContext } from 'react';
 
+import { Capability } from '@dxos/app-framework';
 import type { TimerCallback, TimerOptions } from '@dxos/async';
 
+import { meta } from './meta';
+
 export type DebugContextType = {
   running: boolean;
   start: (cb: TimerCallback, options: TimerOptions) => void;
@@ -27,6 +31,10 @@ export const DebugSettingsSchema = Schema.mutable(
 
 export interface DebugSettingsProps extends Schema.Schema.Type<typeof DebugSettingsSchema> {}
 
+export namespace DebugCapabilities {
+  export const Settings = Capability.make<Atom.Writable<DebugSettingsProps>>(`${meta.id}/capability/settings`);
+}
+
 export namespace Devtools {
   // TODO(wittjosiah): Cannot use slashes in ids until we have a router which decouples ids from url paths.
   export const id = 'dxos.org.plugin.debug.devtools';

package/dist/lib/browser/DebugGraph-EDOH6R2G.mjs

@@ -1,20 +0,0 @@
-// src/components/DebugGraph.tsx
-import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
-import React from "react";
-import { Tree } from "@dxos/devtools";
-var DebugGraph = ({ graph, root }) => {
-  var _effect = _useSignals();
-  try {
-    return /* @__PURE__ */ React.createElement(Tree, {
-      data: graph.toJSON(root)
-    });
-  } finally {
-    _effect.f();
-  }
-};
-var DebugGraph_default = DebugGraph;
-export {
-  DebugGraph,
-  DebugGraph_default as default
-};
-//# sourceMappingURL=DebugGraph-EDOH6R2G.mjs.map

package/dist/lib/browser/DebugGraph-EDOH6R2G.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/components/DebugGraph.tsx"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { type FC } from 'react';\n\nimport { Tree } from '@dxos/devtools';\nimport { type Graph } from '@dxos/plugin-graph';\n\nexport const DebugGraph: FC<{ graph: Graph; root: string }> = ({ graph, root }) => {\n  return <Tree data={graph.toJSON(root)} />;\n};\n\nexport default DebugGraph;\n"],
-  "mappings": ";;AAIA,OAAOA,WAAwB;AAE/B,SAASC,YAAY;AAGd,IAAMC,aAAiD,CAAC,EAAEC,OAAOC,KAAI,MAAE;;;AAC5E,WAAO,sBAAA,cAACC,MAAAA;MAAKC,MAAMH,MAAMI,OAAOH,IAAAA;;;;;AAClC;AAEA,IAAA,qBAAeF;",
-  "names": ["React", "Tree", "DebugGraph", "graph", "root", "Tree", "data", "toJSON"]
-}

package/dist/lib/browser/DevtoolsOverviewContainer-JXVZVPHN.mjs

@@ -1,25 +0,0 @@
-// src/components/DevtoolsOverviewContainer.tsx
-import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
-import React from "react";
-import { Surface } from "@dxos/app-framework/react";
-import { StatsPanel, useStats } from "@dxos/devtools";
-var DevtoolsOverviewContainer = () => {
-  var _effect = _useSignals();
-  try {
-    const [stats, refreshStats] = useStats();
-    return /* @__PURE__ */ React.createElement(StatsPanel, {
-      stats,
-      onRefresh: refreshStats
-    }, /* @__PURE__ */ React.createElement(Surface, {
-      role: "devtools-overview"
-    }));
-  } finally {
-    _effect.f();
-  }
-};
-var DevtoolsOverviewContainer_default = DevtoolsOverviewContainer;
-export {
-  DevtoolsOverviewContainer,
-  DevtoolsOverviewContainer_default as default
-};
-//# sourceMappingURL=DevtoolsOverviewContainer-JXVZVPHN.mjs.map