@dxos/react-ui-canvas-compute 0.8.4-main.72ec0f3 → 0.8.4-main.74a063c4e0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (75) hide show
  1. package/dist/lib/browser/index.mjs +894 -1059
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/lib/node-esm/index.mjs +894 -1059
  5. package/dist/lib/node-esm/index.mjs.map +4 -4
  6. package/dist/lib/node-esm/meta.json +1 -1
  7. package/dist/types/src/compute.stories.d.ts +22 -1
  8. package/dist/types/src/compute.stories.d.ts.map +1 -1
  9. package/dist/types/src/graph/controller.d.ts +8 -4
  10. package/dist/types/src/graph/controller.d.ts.map +1 -1
  11. package/dist/types/src/hooks/useComputeNodeState.d.ts.map +1 -1
  12. package/dist/types/src/hooks/useGraphMonitor.d.ts +2 -2
  13. package/dist/types/src/hooks/useGraphMonitor.d.ts.map +1 -1
  14. package/dist/types/src/shapes/Audio.d.ts.map +1 -1
  15. package/dist/types/src/shapes/Beacon.d.ts.map +1 -1
  16. package/dist/types/src/shapes/Chat.d.ts.map +1 -1
  17. package/dist/types/src/shapes/Constant.d.ts.map +1 -1
  18. package/dist/types/src/shapes/{Queue.d.ts → Feed.d.ts} +8 -8
  19. package/dist/types/src/shapes/Feed.d.ts.map +1 -0
  20. package/dist/types/src/shapes/Function.d.ts.map +1 -1
  21. package/dist/types/src/shapes/Gpt.d.ts.map +1 -1
  22. package/dist/types/src/shapes/Json.d.ts.map +1 -1
  23. package/dist/types/src/shapes/RNG.d.ts.map +1 -1
  24. package/dist/types/src/shapes/Scope.d.ts.map +1 -1
  25. package/dist/types/src/shapes/Surface.d.ts.map +1 -1
  26. package/dist/types/src/shapes/Switch.d.ts.map +1 -1
  27. package/dist/types/src/shapes/Template.d.ts.map +1 -1
  28. package/dist/types/src/shapes/Text.d.ts.map +1 -1
  29. package/dist/types/src/shapes/Thread.d.ts.map +1 -1
  30. package/dist/types/src/shapes/Trigger.d.ts +4 -2
  31. package/dist/types/src/shapes/Trigger.d.ts.map +1 -1
  32. package/dist/types/src/shapes/common/Box.d.ts +4 -4
  33. package/dist/types/src/shapes/common/Box.d.ts.map +1 -1
  34. package/dist/types/src/shapes/common/FunctionBody.d.ts +2 -2
  35. package/dist/types/src/shapes/common/FunctionBody.d.ts.map +1 -1
  36. package/dist/types/src/shapes/index.d.ts +2 -2
  37. package/dist/types/src/shapes/index.d.ts.map +1 -1
  38. package/dist/types/src/testing/circuits.d.ts +18 -24
  39. package/dist/types/src/testing/circuits.d.ts.map +1 -1
  40. package/dist/types/tsconfig.tsbuildinfo +1 -1
  41. package/package.json +60 -56
  42. package/src/README.md +0 -3
  43. package/src/compute.stories.tsx +80 -116
  44. package/src/graph/controller.ts +101 -68
  45. package/src/graph/node-defs.ts +31 -31
  46. package/src/hooks/useComputeNodeState.ts +0 -1
  47. package/src/hooks/useGraphMonitor.ts +11 -10
  48. package/src/json.test.ts +3 -3
  49. package/src/registry.ts +2 -2
  50. package/src/schema.test.ts +11 -11
  51. package/src/shapes/Audio.tsx +2 -3
  52. package/src/shapes/Beacon.tsx +1 -2
  53. package/src/shapes/Boolean.tsx +2 -2
  54. package/src/shapes/Chat.tsx +0 -1
  55. package/src/shapes/Constant.tsx +0 -1
  56. package/src/shapes/{Queue.tsx → Feed.tsx} +26 -21
  57. package/src/shapes/Function.tsx +10 -8
  58. package/src/shapes/Gpt.tsx +6 -2
  59. package/src/shapes/GptRealtime.tsx +1 -1
  60. package/src/shapes/Json.tsx +7 -3
  61. package/src/shapes/RNG.tsx +0 -1
  62. package/src/shapes/Scope.tsx +1 -2
  63. package/src/shapes/Surface.tsx +4 -3
  64. package/src/shapes/Switch.tsx +1 -2
  65. package/src/shapes/Template.tsx +0 -1
  66. package/src/shapes/Text.tsx +0 -1
  67. package/src/shapes/Thread.tsx +15 -9
  68. package/src/shapes/Trigger.tsx +13 -8
  69. package/src/shapes/common/Box.tsx +8 -11
  70. package/src/shapes/common/FunctionBody.tsx +4 -4
  71. package/src/shapes/common/TypeSelect.tsx +1 -1
  72. package/src/shapes/defs.ts +3 -3
  73. package/src/shapes/index.ts +2 -2
  74. package/src/testing/circuits.ts +7 -16
  75. package/dist/types/src/shapes/Queue.d.ts.map +0 -1
@@ -7,7 +7,8 @@ import React, { useCallback, useRef } from 'react';
7
7
 
8
8
  import { AnyOutput, FunctionInput } from '@dxos/conductor';
9
9
  import { Ref, getSnapshot, isInstanceOf } from '@dxos/echo/internal';
10
- import { Function, Script } from '@dxos/functions';
10
+ import { Script } from '@dxos/functions';
11
+ import { Operation } from '@dxos/operation';
11
12
  import { useClient } from '@dxos/react-client';
12
13
  import { Filter, parseId } from '@dxos/react-client/echo';
13
14
  import {
@@ -19,7 +20,6 @@ import {
19
20
  } from '@dxos/react-ui-canvas-editor';
20
21
 
21
22
  import { useComputeNodeState } from '../hooks';
22
-
23
23
  import { Box, createFunctionAnchors } from './common';
24
24
  import { ComputeShape, type CreateShapeProps, createShape } from './defs';
25
25
 
@@ -35,7 +35,11 @@ export type FunctionShape = Schema.Schema.Type<typeof FunctionShape>;
35
35
  export type CreateFunctionProps = CreateShapeProps<FunctionShape>;
36
36
 
37
37
  export const createFunction = (props: CreateFunctionProps) =>
38
- createShape<FunctionShape>({ type: 'function', size: { width: 256, height: 192 }, ...props });
38
+ createShape<FunctionShape>({
39
+ type: 'function',
40
+ size: { width: 256, height: 192 },
41
+ ...props,
42
+ });
39
43
 
40
44
  //
41
45
  // Component
@@ -62,17 +66,15 @@ const TextInputComponent = ({ shape, title, ...props }: TextInputComponentProps)
62
66
  return;
63
67
  }
64
68
 
65
- const {
66
- objects: [fn],
67
- } = await space.db.query(Filter.type(Function.Function, { source: Ref.make(object) })).run();
69
+ const [fn] = await space.db.query(Filter.type(Operation.PersistentOperation, { source: Ref.make(object) })).run();
68
70
  if (!fn) {
69
71
  return;
70
72
  }
71
73
 
72
74
  node.value = value;
73
75
  node.function = Ref.make(fn);
74
- node.inputSchema = getSnapshot(fn.inputSchema);
75
- node.outputSchema = getSnapshot(fn.outputSchema);
76
+ node.inputSchema = fn.inputSchema ? getSnapshot(fn.inputSchema) : undefined;
77
+ node.outputSchema = fn.outputSchema ? getSnapshot(fn.outputSchema) : undefined;
76
78
  },
77
79
  [client, node],
78
80
  );
@@ -6,10 +6,10 @@ import * as Schema from 'effect/Schema';
6
6
  import React, { useEffect, useState } from 'react';
7
7
 
8
8
  import { GptInput, GptOutput } from '@dxos/conductor';
9
+ import { ScrollArea } from '@dxos/react-ui';
9
10
  import { type ShapeComponentProps, type ShapeDef } from '@dxos/react-ui-canvas-editor';
10
11
 
11
12
  import { useComputeNodeState } from '../hooks';
12
-
13
13
  import { FunctionBody, createFunctionAnchors, getHeight } from './common';
14
14
  import { ComputeShape, type CreateShapeProps, createShape } from './defs';
15
15
 
@@ -74,7 +74,11 @@ export const GptComponent = ({ shape }: ShapeComponentProps<GptShape>) => {
74
74
  return (
75
75
  <FunctionBody
76
76
  shape={shape}
77
- content={<div className='pli-2 plb-1 overflow-y-auto'>{text}</div>}
77
+ content={
78
+ <ScrollArea.Root orientation='vertical' thin>
79
+ <ScrollArea.Viewport>{text}</ScrollArea.Viewport>
80
+ </ScrollArea.Root>
81
+ }
78
82
  status={`${tokens} tokens`}
79
83
  inputSchema={meta.input}
80
84
  outputSchema={meta.output}
@@ -143,7 +143,7 @@ export const GptRealtimeComponent = ({ shape }: ShapeComponentProps<GptRealtimeS
143
143
  };
144
144
 
145
145
  return (
146
- <div className='flex is-full justify-center items-center'>
146
+ <div className='flex w-full justify-center items-center'>
147
147
  <Icon
148
148
  icon={isReady ? 'ph--waveform--regular' : isLive ? 'ph--pulse--regular' : 'ph--play--regular'}
149
149
  size={16}
@@ -8,10 +8,9 @@ import React from 'react';
8
8
  import { DEFAULT_INPUT, DefaultOutput, JsonTransformInput } from '@dxos/conductor';
9
9
  import { type ShapeComponentProps, type ShapeDef } from '@dxos/react-ui-canvas-editor';
10
10
  import { createAnchorMap } from '@dxos/react-ui-canvas-editor';
11
- import { JsonFilter } from '@dxos/react-ui-syntax-highlighter';
11
+ import { Json } from '@dxos/react-ui-syntax-highlighter';
12
12
 
13
13
  import { useComputeNodeState } from '../hooks';
14
-
15
14
  import { Box, createFunctionAnchors, getHeight } from './common';
16
15
  import { ComputeShape, type CreateShapeProps, createAnchorId, createShape } from './defs';
17
16
 
@@ -50,7 +49,12 @@ export const JsonComponent = ({ shape, ...props }: JsonComponentProps) => {
50
49
 
51
50
  return (
52
51
  <Box shape={shape}>
53
- <JsonFilter data={value} classNames='text-xs' />
52
+ <Json.Root data={value}>
53
+ <Json.Content>
54
+ <Json.Filter />
55
+ <Json.Data classNames='text-xs' />
56
+ </Json.Content>
57
+ </Json.Root>
54
58
  </Box>
55
59
  );
56
60
  };
@@ -10,7 +10,6 @@ import { Icon, type IconProps } from '@dxos/react-ui';
10
10
  import { type ShapeComponentProps, type ShapeDef, createAnchorMap } from '@dxos/react-ui-canvas-editor';
11
11
 
12
12
  import { useComputeNodeState } from '../hooks';
13
-
14
13
  import { ComputeShape, type CreateShapeProps, createAnchorId, createShape } from './defs';
15
14
 
16
15
  export const RandomShape = Schema.extend(
@@ -10,7 +10,6 @@ import { type ShapeComponentProps, type ShapeDef, createAnchorMap } from '@dxos/
10
10
  import { Chaos, shaderPresets, useAudioStream } from '@dxos/react-ui-sfx';
11
11
 
12
12
  import { useComputeNodeState } from '../hooks';
13
-
14
13
  import { ComputeShape, type CreateShapeProps, createAnchorId, createShape } from './defs';
15
14
 
16
15
  export const ScopeShape = Schema.extend(
@@ -39,7 +38,7 @@ export const ScopeComponent = ({ shape }: ShapeComponentProps<ScopeShape>) => {
39
38
  const { getAverage } = useAudioStream(active);
40
39
 
41
40
  return (
42
- <div className='flex is-full justify-center items-center bg-black'>
41
+ <div className='flex w-full justify-center items-center bg-black'>
43
42
  <Chaos active={active} getValue={getAverage} options={{ ...shaderPresets.heptapod, zoom: 1.2 }} />
44
43
  </div>
45
44
  );
@@ -5,13 +5,13 @@
5
5
  import * as Schema from 'effect/Schema';
6
6
  import React from 'react';
7
7
 
8
- import { Surface } from '@dxos/app-framework/react';
8
+ import { Surface } from '@dxos/app-framework/ui';
9
9
  import { DEFAULT_INPUT } from '@dxos/conductor';
10
+ import { Card } from '@dxos/react-ui';
10
11
  import { type ShapeComponentProps, type ShapeDef } from '@dxos/react-ui-canvas-editor';
11
12
  import { createAnchorMap } from '@dxos/react-ui-canvas-editor';
12
13
 
13
14
  import { useComputeNodeState } from '../hooks';
14
-
15
15
  import { Box, type BoxActionHandler } from './common';
16
16
  import { ComputeShape, type CreateShapeProps, createAnchorId, createShape } from './defs';
17
17
 
@@ -44,9 +44,10 @@ export const SurfaceComponent = ({ shape }: ShapeComponentProps<SurfaceShape>) =
44
44
  }
45
45
  };
46
46
 
47
+ // TODO(burdon): Subject property?
47
48
  return (
48
49
  <Box shape={shape} onAction={handleAction}>
49
- {value !== null && <Surface role='card--extrinsic' data={{ value }} limit={1} />}
50
+ <Card.Root>{value !== null && <Surface.Surface role='card--content' data={{ value }} limit={1} />}</Card.Root>
50
51
  </Box>
51
52
  );
52
53
  };
@@ -10,7 +10,6 @@ import { Input } from '@dxos/react-ui';
10
10
  import { type ShapeComponentProps, type ShapeDef, createAnchorMap } from '@dxos/react-ui-canvas-editor';
11
11
 
12
12
  import { useComputeNodeState } from '../hooks';
13
-
14
13
  import { ComputeShape, type CreateShapeProps, createAnchorId, createShape } from './defs';
15
14
 
16
15
  export const SwitchShape = Schema.extend(
@@ -36,7 +35,7 @@ export const SwitchComponent = ({ shape }: ShapeComponentProps<SwitchShape>) =>
36
35
  }, [value]);
37
36
 
38
37
  return (
39
- <div className='flex is-full justify-center items-center' onClick={(ev) => ev.stopPropagation()}>
38
+ <div className='flex w-full justify-center items-center' onClick={(ev) => ev.stopPropagation()}>
40
39
  <Input.Root>
41
40
  <Input.Switch checked={value} onCheckedChange={(value) => setValue(value)} />
42
41
  </Input.Root>
@@ -17,7 +17,6 @@ import {
17
17
  } from '@dxos/react-ui-canvas-editor';
18
18
 
19
19
  import { useComputeNodeState } from '../hooks';
20
-
21
20
  import { Box, TypeSelect, createFunctionAnchors } from './common';
22
21
  import { ComputeShape, type CreateShapeProps, createShape } from './defs';
23
22
 
@@ -10,7 +10,6 @@ import { type ShapeComponentProps, type ShapeDef, TextBox } from '@dxos/react-ui
10
10
  import { createAnchorMap } from '@dxos/react-ui-canvas-editor';
11
11
 
12
12
  import { useComputeNodeState } from '../hooks';
13
-
14
13
  import { Box, type BoxActionHandler } from './common';
15
14
  import { ComputeShape, type CreateShapeProps, createAnchorId, createShape } from './defs';
16
15
 
@@ -6,10 +6,10 @@ import * as Schema from 'effect/Schema';
6
6
  import React, { useEffect, useRef } from 'react';
7
7
 
8
8
  import { createInputSchema, createOutputSchema } from '@dxos/conductor';
9
- import { type ThemedClassName } from '@dxos/react-ui';
9
+ import { ScrollArea, type ThemedClassName } from '@dxos/react-ui';
10
10
  import { type ShapeComponentProps, type ShapeDef } from '@dxos/react-ui-canvas-editor';
11
- import { mx } from '@dxos/react-ui-theme';
12
11
  import { Message } from '@dxos/types';
12
+ import { mx } from '@dxos/ui-theme';
13
13
 
14
14
  import { Box, createFunctionAnchors } from './common';
15
15
  import { ComputeShape, type CreateShapeProps, createShape } from './defs';
@@ -42,18 +42,24 @@ export const ThreadComponent = ({ shape }: ShapeComponentProps<ThreadShape>) =>
42
42
 
43
43
  return (
44
44
  <Box shape={shape}>
45
- <div ref={scrollRef} className='flex flex-col is-full overflow-y-auto gap-2 p-2'>
46
- {[...items].map((item, i) => (
47
- <ThreadItem key={i} item={item} />
48
- ))}
49
- </div>
45
+ <ScrollArea.Root orientation='vertical'>
46
+ <ScrollArea.Viewport classNames='gap-2 p-2' ref={scrollRef}>
47
+ {[...items].map((item, i) => (
48
+ <ThreadItem key={i} item={item} />
49
+ ))}
50
+ </ScrollArea.Viewport>
51
+ </ScrollArea.Root>
50
52
  </Box>
51
53
  );
52
54
  };
53
55
 
54
56
  export const ThreadItem = ({ classNames, item }: ThemedClassName<{ item: any }>) => {
55
57
  if (typeof item !== 'object') {
56
- return <div className={mx(classNames)}>{item}</div>;
58
+ return (
59
+ <div role='none' className={mx(classNames)}>
60
+ {item}
61
+ </div>
62
+ );
57
63
  }
58
64
 
59
65
  // TODO(burdon): Hack; introspect type.
@@ -63,7 +69,7 @@ export const ThreadItem = ({ classNames, item }: ThemedClassName<{ item: any }>)
63
69
  <div className={mx('flex', classNames, role === 'user' && 'justify-end')}>
64
70
  <div
65
71
  className={mx(
66
- 'block rounded-md p-1 pli-2 text-sm',
72
+ 'block rounded-md p-1 px-2 text-sm',
67
73
  role === 'user'
68
74
  ? 'bg-blue-100 dark:bg-blue-800'
69
75
  : role === 'system'
@@ -6,8 +6,8 @@ import * as Schema from 'effect/Schema';
6
6
  import React, { useEffect } from 'react';
7
7
 
8
8
  import { VoidInput } from '@dxos/conductor';
9
- import { Filter, Query } from '@dxos/echo';
10
- import { ObjectId, Ref } from '@dxos/echo/internal';
9
+ import { Filter, Obj, Query, Ref } from '@dxos/echo';
10
+ import { type Mutable } from '@dxos/echo/internal';
11
11
  import { Trigger, TriggerEvent } from '@dxos/functions';
12
12
  import { DXN, SpaceId } from '@dxos/keys';
13
13
  import { useSpace } from '@dxos/react-client/echo';
@@ -21,10 +21,11 @@ export const TriggerShape = Schema.extend(
21
21
  ComputeShape,
22
22
  Schema.Struct({
23
23
  type: Schema.Literal('trigger'),
24
- functionTrigger: Schema.optional(Ref(Trigger.Trigger)),
24
+ functionTrigger: Schema.optional(Ref.Ref(Trigger.Trigger)),
25
25
  }),
26
26
  );
27
- export type TriggerShape = Schema.Schema.Type<typeof TriggerShape>;
27
+
28
+ export interface TriggerShape extends Schema.Schema.Type<typeof TriggerShape> {}
28
29
 
29
30
  export type CreateTriggerProps = CreateShapeProps<Omit<TriggerShape, 'functionTrigger'>> & {
30
31
  spaceId?: SpaceId;
@@ -52,7 +53,9 @@ export const TriggerComponent = ({ shape }: TriggerComponentProps) => {
52
53
 
53
54
  useEffect(() => {
54
55
  if (functionTrigger && !functionTrigger.spec) {
55
- functionTrigger.spec = createTriggerSpec({ triggerKind: 'email', spaceId: space?.id });
56
+ Obj.change(functionTrigger, (obj) => {
57
+ obj.spec = createTriggerSpec({ triggerKind: 'email', spaceId: space?.id }) as Mutable<Trigger.Spec>;
58
+ });
56
59
  }
57
60
  }, [functionTrigger, functionTrigger?.spec]);
58
61
 
@@ -62,7 +65,9 @@ export const TriggerComponent = ({ shape }: TriggerComponentProps) => {
62
65
 
63
66
  const setKind = (kind: Trigger.Kind) => {
64
67
  if (functionTrigger?.spec?.kind !== kind) {
65
- functionTrigger!.spec = createTriggerSpec({ triggerKind: kind, spaceId: space?.id });
68
+ Obj.change(functionTrigger!, (obj) => {
69
+ obj.spec = createTriggerSpec({ triggerKind: kind, spaceId: space?.id }) as Mutable<Trigger.Spec>;
70
+ });
66
71
  }
67
72
  };
68
73
 
@@ -86,7 +91,7 @@ export const TriggerComponent = ({ shape }: TriggerComponentProps) => {
86
91
  const TriggerKindSelect = ({ value, onValueChange }: Pick<SelectRootProps, 'value' | 'onValueChange'>) => {
87
92
  return (
88
93
  <Select.Root value={value} onValueChange={onValueChange}>
89
- <Select.TriggerButton variant='ghost' classNames='is-full !pli-0' />
94
+ <Select.TriggerButton variant='ghost' classNames='w-full px-0!' />
90
95
  <Select.Portal>
91
96
  <Select.Content>
92
97
  <Select.ScrollUpButton />
@@ -122,7 +127,7 @@ const createTriggerSpec = (props: { triggerKind?: Trigger.Kind; spaceId?: SpaceI
122
127
  case 'email':
123
128
  return { kind: 'email' } satisfies Trigger.EmailSpec;
124
129
  case 'queue': {
125
- const dxn = new DXN(DXN.kind.QUEUE, ['data', props.spaceId ?? SpaceId.random(), ObjectId.random()]).toString();
130
+ const dxn = new DXN(DXN.kind.QUEUE, ['data', props.spaceId ?? SpaceId.random(), Obj.ID.random()]).toString();
126
131
  return { kind: 'queue', queue: dxn } satisfies Trigger.QueueSpec;
127
132
  }
128
133
  }
@@ -6,9 +6,8 @@ import React, { type PropsWithChildren, type ReactNode, forwardRef } from 'react
6
6
 
7
7
  import { invariant } from '@dxos/invariant';
8
8
  import { Icon, IconButton, type ThemedClassName } from '@dxos/react-ui';
9
- import { useEditorContext, useShapeDef } from '@dxos/react-ui-canvas-editor';
10
- import { type Shape } from '@dxos/react-ui-canvas-editor';
11
- import { mx } from '@dxos/react-ui-theme';
9
+ import { type CanvasBoard, useEditorContext, useShapeDef } from '@dxos/react-ui-canvas-editor';
10
+ import { mx } from '@dxos/ui-theme';
12
11
 
13
12
  export const headerHeight = 32;
14
13
  export const footerHeight = 32;
@@ -17,7 +16,7 @@ export type BoxActionHandler = (action: 'run' | 'open' | 'close') => void;
17
16
 
18
17
  export type BoxProps = PropsWithChildren<
19
18
  ThemedClassName<{
20
- shape: Shape;
19
+ shape: CanvasBoard.Shape;
21
20
  title?: string;
22
21
  status?: string | ReactNode;
23
22
  open?: boolean;
@@ -32,15 +31,14 @@ export const Box = forwardRef<HTMLDivElement, BoxProps>(
32
31
  const { debug } = useEditorContext();
33
32
 
34
33
  return (
35
- <div ref={forwardedRef} className='flex flex-col bs-full is-full justify-between'>
36
- <div className='flex shrink-0 is-full justify-between items-center bs-[32px] bg-hoverSurface'>
34
+ <div ref={forwardedRef} className='flex flex-col h-full w-full justify-between'>
35
+ <div className='flex shrink-0 w-full justify-between items-center h-[32px] bg-input-surface'>
37
36
  <Icon icon={icon} classNames='mx-2' />
38
37
  <div className='grow text-sm truncate'>{debug ? shape.type : (name ?? shape.text ?? title)}</div>
39
38
  <IconButton
40
39
  classNames='p-1 text-green-500'
41
40
  variant='ghost'
42
41
  icon='ph--play--regular'
43
- size={4}
44
42
  label='run'
45
43
  iconOnly
46
44
  onDoubleClick={(ev) => ev.stopPropagation()}
@@ -50,15 +48,14 @@ export const Box = forwardRef<HTMLDivElement, BoxProps>(
50
48
  }}
51
49
  />
52
50
  </div>
53
- <div className={mx('flex flex-col bs-full grow overflow-hidden', classNames)}>{children}</div>
54
- <div className='flex shrink-0 is-full justify-between items-center bs-[32px] bg-hoverSurface'>
55
- <div className='grow pli-2 text-sm truncate'>{debug ? shape.id : status}</div>
51
+ <div className={mx('flex flex-col h-full grow overflow-hidden', classNames)}>{children}</div>
52
+ <div className='flex shrink-0 w-full justify-between items-center h-[32px] bg-input-surface'>
53
+ <div className='grow px-2 text-sm truncate'>{debug ? shape.id : status}</div>
56
54
  {openable && (
57
55
  <IconButton
58
56
  classNames='p-1'
59
57
  variant='ghost'
60
58
  icon={open ? 'ph--caret-up--regular' : 'ph--caret-down--regular'}
61
- size={4}
62
59
  label={open ? 'close' : 'open'}
63
60
  iconOnly
64
61
  onClick={(ev) => {
@@ -8,7 +8,7 @@ import React, { type JSX, useRef, useState } from 'react';
8
8
 
9
9
  import { VoidInput, VoidOutput } from '@dxos/conductor';
10
10
  import { useCanvasContext } from '@dxos/react-ui-canvas';
11
- import { type Polygon, type Shape } from '@dxos/react-ui-canvas-editor';
11
+ import { type CanvasBoard, type Polygon } from '@dxos/react-ui-canvas-editor';
12
12
  import { createAnchors, getParentShapeElement, rowHeight } from '@dxos/react-ui-canvas-editor';
13
13
 
14
14
  import { Box, type BoxProps, footerHeight, headerHeight } from '../common';
@@ -18,7 +18,7 @@ const bodyPadding = 8;
18
18
  const expandedHeight = 200;
19
19
 
20
20
  export type FunctionBodyProps = {
21
- shape: Shape;
21
+ shape: CanvasBoard.Shape;
22
22
  name?: string;
23
23
  content?: JSX.Element;
24
24
  inputSchema?: Schema.Schema.Any;
@@ -82,7 +82,7 @@ export const FunctionBody = ({
82
82
  {(inputs?.length ?? 0) > 0 && (
83
83
  <div className='flex flex-col'>
84
84
  {inputs?.map(({ name }) => (
85
- <div key={name} className='pli-2 truncate text-sm font-mono items-center' style={{ height: rowHeight }}>
85
+ <div key={name} className='px-2 truncate text-sm font-mono items-center' style={{ height: rowHeight }}>
86
86
  {name}
87
87
  </div>
88
88
  ))}
@@ -93,7 +93,7 @@ export const FunctionBody = ({
93
93
  {outputs?.map(({ name }) => (
94
94
  <div
95
95
  key={name}
96
- className='pli-2 truncate text-sm font-mono items-center text-right'
96
+ className='px-2 truncate text-sm font-mono items-center text-right'
97
97
  style={{ height: rowHeight }}
98
98
  >
99
99
  {name}
@@ -11,7 +11,7 @@ import { Select, type SelectRootProps } from '@dxos/react-ui';
11
11
  export const TypeSelect = ({ value, onValueChange }: Pick<SelectRootProps, 'value' | 'onValueChange'>) => {
12
12
  return (
13
13
  <Select.Root value={value} onValueChange={onValueChange}>
14
- <Select.TriggerButton variant='ghost' classNames='is-full !pli-0' />
14
+ <Select.TriggerButton variant='ghost' classNames='w-full px-0!' />
15
15
  <Select.Portal>
16
16
  <Select.Content>
17
17
  <Select.ScrollUpButton />
@@ -6,7 +6,7 @@ import * as Schema from 'effect/Schema';
6
6
  import * as SchemaAST from 'effect/SchemaAST';
7
7
 
8
8
  import { DEFAULT_INPUT, DEFAULT_OUTPUT } from '@dxos/conductor';
9
- import { ObjectId } from '@dxos/echo/internal';
9
+ import { Obj } from '@dxos/echo';
10
10
  import { Polygon } from '@dxos/react-ui-canvas-editor';
11
11
  import { type MakeOptional } from '@dxos/util';
12
12
 
@@ -37,7 +37,7 @@ export const ComputeShape = Schema.extend(
37
37
  Polygon,
38
38
  Schema.Struct({
39
39
  // TODO(burdon): Rename computeNode?
40
- node: Schema.optional(ObjectId.annotations({ description: 'Compute node id' })),
40
+ node: Schema.optional(Obj.ID.annotations({ description: 'Compute node id' })),
41
41
  }).pipe(Schema.mutable),
42
42
  );
43
43
 
@@ -45,7 +45,7 @@ export type ComputeShape = Schema.Schema.Type<typeof ComputeShape>;
45
45
 
46
46
  export const createShape = <S extends ComputeShape>({ id, ...rest }: CreateShapeProps<S> & { type: string }): S => {
47
47
  return {
48
- id: id ?? ObjectId.random(),
48
+ id: id ?? Obj.ID.random(),
49
49
  ...rest,
50
50
  } as S;
51
51
  };
@@ -13,11 +13,12 @@ export * from './Boolean';
13
13
  export * from './Chat';
14
14
  export * from './Constant';
15
15
  export * from './Database';
16
+ export * from './Feed';
16
17
  export * from './Function';
17
18
  export * from './Gpt';
19
+ export * from './GptRealtime';
18
20
  export * from './Json';
19
21
  export * from './Logic';
20
- export * from './Queue';
21
22
  export * from './RNG';
22
23
  export * from './Scope';
23
24
  export * from './Surface';
@@ -28,4 +29,3 @@ export * from './Text';
28
29
  export * from './Thread';
29
30
  export * from './TextToImage';
30
31
  export * from './Trigger';
31
- export * from './GptRealtime';
@@ -3,14 +3,10 @@
3
3
  //
4
4
 
5
5
  import { createSystemPrompt } from '@dxos/assistant';
6
- import { ObjectId } from '@dxos/echo/internal';
7
- import { type ServiceContainer } from '@dxos/functions-runtime';
8
- import { DXN, SpaceId } from '@dxos/keys';
6
+ import { DXN, ObjectId, SpaceId } from '@dxos/keys';
9
7
  import { type Dimension, type Point } from '@dxos/react-ui-canvas';
10
8
  import { CanvasGraphModel, createNote, pointMultiply, pointsToRect, rectToPoints } from '@dxos/react-ui-canvas-editor';
11
9
 
12
- import { ComputeGraphController } from '../graph';
13
- import { createComputeGraph } from '../hooks';
14
10
  import {
15
11
  type ComputeShape,
16
12
  createAnd,
@@ -28,7 +24,7 @@ import {
28
24
  createJsonTransform,
29
25
  createNot,
30
26
  createOr,
31
- createQueue,
27
+ createFeed,
32
28
  createRandom,
33
29
  createScope,
34
30
  createSurface,
@@ -38,19 +34,14 @@ import {
38
34
  createTextToImage,
39
35
  } from '../shapes';
40
36
 
41
- export const createComputeGraphController = (
42
- graph: CanvasGraphModel<ComputeShape>,
43
- serviceContainer: ServiceContainer,
44
- ) => {
45
- const computeGraph = createComputeGraph(graph);
46
- const controller = new ComputeGraphController(serviceContainer, computeGraph);
47
- return { controller, graph };
48
- };
49
-
50
37
  //
51
38
  // Circuits
52
39
  //
53
40
 
41
+ export const createEmptyCircuit = () => {
42
+ return CanvasGraphModel.create<ComputeShape>();
43
+ };
44
+
54
45
  export const createBasicCircuit = () => {
55
46
  const model = CanvasGraphModel.create<ComputeShape>();
56
47
  model.builder.call(({ model }) => {
@@ -250,7 +241,7 @@ export const createGptCircuit = (options: {
250
241
  }),
251
242
  );
252
243
 
253
- const thread = model.createNode(createQueue(position({ x: -3, y: 3, width: 14, height: 10 })));
244
+ const thread = model.createNode(createFeed(position({ x: -3, y: 3, width: 14, height: 10 })));
254
245
  const append = model.createNode(createAppend(position({ x: 10, y: 6 })));
255
246
 
256
247
  builder
@@ -1 +0,0 @@
1
- {"version":3,"file":"Queue.d.ts","sourceRoot":"","sources":["../../../../src/shapes/Queue.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AACxC,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,KAAK,mBAAmB,EAAE,KAAK,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAOvF,OAAO,EAAgB,KAAK,gBAAgB,EAAe,MAAM,QAAQ,CAAC;AAE1E,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;GAKtB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,UAAU,CAAC,CAAC;AAE/D,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,CAAC,UAAU,CAAC,CAAC;AAE5D,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB;;;;;;;;;;;;;;;;;;;CACsC,CAAC;AAE1F,eAAO,MAAM,cAAc,GAAI,WAAW,mBAAmB,CAAC,UAAU,CAAC,sBAmBxE,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,sBAAsB,eAAe,CAAC;IAAE,IAAI,EAAE,GAAG,CAAA;CAAE,CAAC,sBAe7E,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,QAAQ,CAAC,UAAU,CAQ3C,CAAC"}