@dxos/plugin-script 0.6.11-staging.a542fc9 → 0.6.11
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.
- package/dist/lib/browser/{ScriptEditor-C6MMOFDI.mjs → ScriptEditor-5Y3EROG3.mjs} +17 -18
- package/dist/lib/browser/ScriptEditor-5Y3EROG3.mjs.map +7 -0
- package/dist/lib/browser/{TypescriptEditor-XTGRVCMY.mjs → TypescriptEditor-GPE72Y6I.mjs} +2 -2
- package/dist/lib/browser/{chunk-DX5CSOBP.mjs → chunk-MRGOT5RF.mjs} +25 -26
- package/dist/lib/browser/chunk-MRGOT5RF.mjs.map +7 -0
- package/dist/lib/browser/index.mjs +2 -2
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node/{ScriptEditor-XQESJORL.cjs → ScriptEditor-YCUQFWQM.cjs} +20 -21
- package/dist/lib/node/ScriptEditor-YCUQFWQM.cjs.map +7 -0
- package/dist/lib/node/{TypescriptEditor-CRONCQSI.cjs → TypescriptEditor-M3WWFIP2.cjs} +7 -7
- package/dist/lib/node/{TypescriptEditor-CRONCQSI.cjs.map → TypescriptEditor-M3WWFIP2.cjs.map} +2 -2
- package/dist/lib/node/{chunk-RXI576K3.cjs → chunk-IMLDKD5Y.cjs} +28 -29
- package/dist/lib/node/chunk-IMLDKD5Y.cjs.map +7 -0
- package/dist/lib/node/index.cjs +2 -2
- package/dist/lib/node/meta.json +1 -1
- package/dist/types/src/components/DebugPanel.d.ts.map +1 -1
- package/dist/types/src/components/ScriptBlock/ScriptBlock.stories.d.ts +1 -4
- package/dist/types/src/components/ScriptBlock/ScriptBlock.stories.d.ts.map +1 -1
- package/dist/types/src/components/ScriptEditor.d.ts.map +1 -1
- package/dist/types/src/components/Toolbar.d.ts.map +1 -1
- package/dist/types/src/components/Toolbar.stories.d.ts +1 -3
- package/dist/types/src/components/Toolbar.stories.d.ts.map +1 -1
- package/dist/types/src/components/TypescriptEditor.d.ts +3 -4
- package/dist/types/src/components/TypescriptEditor.d.ts.map +1 -1
- package/dist/types/src/components/TypescriptEditor.stories.d.ts +1 -4
- package/dist/types/src/components/TypescriptEditor.stories.d.ts.map +1 -1
- package/dist/types/src/components/index.d.ts +1 -1
- package/package.json +35 -33
- package/src/components/DebugPanel.tsx +2 -16
- package/src/components/ScriptBlock/ScriptBlock.stories.tsx +27 -20
- package/src/components/ScriptEditor.tsx +18 -3
- package/src/components/Toolbar.stories.tsx +2 -4
- package/src/components/Toolbar.tsx +2 -1
- package/src/components/TypescriptEditor.stories.tsx +9 -12
- package/src/components/TypescriptEditor.tsx +15 -17
- package/dist/lib/browser/ScriptEditor-C6MMOFDI.mjs.map +0 -7
- package/dist/lib/browser/chunk-DX5CSOBP.mjs.map +0 -7
- package/dist/lib/node/ScriptEditor-XQESJORL.cjs.map +0 -7
- package/dist/lib/node/chunk-RXI576K3.cjs.map +0 -7
- /package/dist/lib/browser/{TypescriptEditor-XTGRVCMY.mjs.map → TypescriptEditor-GPE72Y6I.mjs.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/Toolbar.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAIL,KAAK,eAAe,EAIrB,MAAM,gBAAgB,CAAC;AAIxB,MAAM,MAAM,YAAY,GAAG,eAAe,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACrC,CAAC,CAAC;AAEH,eAAO,MAAM,OAAO,gGASjB,YAAY,
|
|
1
|
+
{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/Toolbar.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAIL,KAAK,eAAe,EAIrB,MAAM,gBAAgB,CAAC;AAIxB,MAAM,MAAM,YAAY,GAAG,eAAe,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACrC,CAAC,CAAC;AAEH,eAAO,MAAM,OAAO,gGASjB,YAAY,sBA6Gd,CAAC"}
|
|
@@ -2,9 +2,7 @@ import '@dxos-theme';
|
|
|
2
2
|
declare const _default: {
|
|
3
3
|
title: string;
|
|
4
4
|
component: ({ classNames, deployed, error, functionUrl, showPanel, onDeploy, onFormat, onTogglePanel, }: import("./Toolbar").ToolbarProps) => import("react").JSX.Element;
|
|
5
|
-
|
|
6
|
-
layout: string;
|
|
7
|
-
};
|
|
5
|
+
decorators: import("@storybook/react/*").Decorator[];
|
|
8
6
|
};
|
|
9
7
|
export default _default;
|
|
10
8
|
export declare const Default: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toolbar.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Toolbar.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC
|
|
1
|
+
{"version":3,"file":"Toolbar.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Toolbar.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;;;;;;AAMrB,wBAIE;AAEF,eAAO,MAAM,OAAO;;;;;CAAmD,CAAC"}
|
|
@@ -3,10 +3,9 @@ import React from 'react';
|
|
|
3
3
|
import { type UseTextEditorProps } from '@dxos/react-ui-editor';
|
|
4
4
|
export type TypescriptEditorProps = {
|
|
5
5
|
id: string;
|
|
6
|
-
env?: VirtualTypeScriptEnvironment;
|
|
7
|
-
className?: string;
|
|
8
6
|
scrollPastEnd?: boolean;
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
env?: VirtualTypeScriptEnvironment;
|
|
8
|
+
} & Pick<UseTextEditorProps, 'className' | 'initialValue' | 'extensions' | 'scrollTo' | 'selection'>;
|
|
9
|
+
export declare const TypescriptEditor: ({ id, scrollPastEnd, env, className, initialValue, extensions, scrollTo, selection, }: TypescriptEditorProps) => React.JSX.Element;
|
|
11
10
|
export default TypescriptEditor;
|
|
12
11
|
//# sourceMappingURL=TypescriptEditor.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TypescriptEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/TypescriptEditor.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TypescriptEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/TypescriptEditor.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,4BAA4B,EAAE,MAAM,iBAAiB,CAAC;AAEpE,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EASL,KAAK,kBAAkB,EACxB,MAAM,uBAAuB,CAAC;AAG/B,MAAM,MAAM,qBAAqB,GAAG;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,GAAG,CAAC,EAAE,4BAA4B,CAAC;CACpC,GAAG,IAAI,CAAC,kBAAkB,EAAE,WAAW,GAAG,cAAc,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC,CAAC;AAErG,eAAO,MAAM,gBAAgB,0FAS1B,qBAAqB,sBAwCvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -2,11 +2,8 @@ import '@dxos-theme';
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
declare const _default: {
|
|
4
4
|
title: string;
|
|
5
|
-
component: ({ id,
|
|
5
|
+
component: ({ id, scrollPastEnd, env, className, initialValue, extensions, scrollTo, selection, }: import("./TypescriptEditor").TypescriptEditorProps) => React.JSX.Element;
|
|
6
6
|
render: () => React.JSX.Element;
|
|
7
|
-
parameters: {
|
|
8
|
-
layout: string;
|
|
9
|
-
};
|
|
10
7
|
};
|
|
11
8
|
export default _default;
|
|
12
9
|
export declare const Default: {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TypescriptEditor.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/TypescriptEditor.stories.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TypescriptEditor.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/TypescriptEditor.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,KAAkB,MAAM,OAAO,CAAC;;;;;;AA+CvC,wBAIE;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export declare const ScriptEditor: React.LazyExoticComponent<({ env, script, role }: import("./ScriptEditor").ScriptEditorProps) => React.JSX.Element>;
|
|
3
|
-
export declare const TypescriptEditor: React.LazyExoticComponent<({ id,
|
|
3
|
+
export declare const TypescriptEditor: React.LazyExoticComponent<({ id, scrollPastEnd, env, className, initialValue, extensions, scrollTo, selection, }: import("./TypescriptEditor").TypescriptEditorProps) => React.JSX.Element>;
|
|
4
4
|
//# sourceMappingURL=index.d.ts.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dxos/plugin-script",
|
|
3
|
-
"version": "0.6.11
|
|
3
|
+
"version": "0.6.11",
|
|
4
4
|
"description": "Braneframe notebook plugin",
|
|
5
5
|
"homepage": "https://dxos.org",
|
|
6
6
|
"bugs": "https://github.com/dxos/dxos/issues",
|
|
@@ -73,29 +73,31 @@
|
|
|
73
73
|
"prettier": "^3.2.4",
|
|
74
74
|
"react-syntax-highlighter": "^15.5.0",
|
|
75
75
|
"typescript": "^5.5.4",
|
|
76
|
-
"@dxos/app-framework": "0.6.11
|
|
77
|
-
"@dxos/
|
|
78
|
-
"@dxos/
|
|
79
|
-
"@dxos/
|
|
80
|
-
"@dxos/
|
|
81
|
-
"@dxos/
|
|
82
|
-
"@dxos/
|
|
83
|
-
"@dxos/
|
|
84
|
-
"@dxos/
|
|
85
|
-
"@dxos/log": "0.6.11
|
|
86
|
-
"@dxos/plugin-client": "0.6.11
|
|
87
|
-
"@dxos/plugin-
|
|
88
|
-
"@dxos/plugin-
|
|
89
|
-
"@dxos/plugin-space": "0.6.11
|
|
90
|
-
"@dxos/plugin-
|
|
91
|
-
"@dxos/plugin-stack": "0.6.11
|
|
92
|
-
"@dxos/
|
|
93
|
-
"@dxos/
|
|
94
|
-
"@dxos/react-
|
|
95
|
-
"@dxos/react-
|
|
96
|
-
"@dxos/
|
|
97
|
-
"@dxos/
|
|
98
|
-
"@dxos/rpc
|
|
76
|
+
"@dxos/app-framework": "0.6.11",
|
|
77
|
+
"@dxos/async": "0.6.11",
|
|
78
|
+
"@dxos/client-protocol": "0.6.11",
|
|
79
|
+
"@dxos/debug": "0.6.11",
|
|
80
|
+
"@dxos/crypto": "0.6.11",
|
|
81
|
+
"@dxos/echo-schema": "0.6.11",
|
|
82
|
+
"@dxos/client": "0.6.11",
|
|
83
|
+
"@dxos/invariant": "0.6.11",
|
|
84
|
+
"@dxos/keys": "0.6.11",
|
|
85
|
+
"@dxos/log": "0.6.11",
|
|
86
|
+
"@dxos/plugin-client": "0.6.11",
|
|
87
|
+
"@dxos/plugin-markdown": "0.6.11",
|
|
88
|
+
"@dxos/plugin-explorer": "0.6.11",
|
|
89
|
+
"@dxos/plugin-space": "0.6.11",
|
|
90
|
+
"@dxos/plugin-theme": "0.6.11",
|
|
91
|
+
"@dxos/plugin-stack": "0.6.11",
|
|
92
|
+
"@dxos/protocols": "0.6.11",
|
|
93
|
+
"@dxos/plugin-graph": "0.6.11",
|
|
94
|
+
"@dxos/react-ui-attention": "0.6.11",
|
|
95
|
+
"@dxos/react-client": "0.6.11",
|
|
96
|
+
"@dxos/react-ui-editor": "0.6.11",
|
|
97
|
+
"@dxos/react-ui-syntax-highlighter": "0.6.11",
|
|
98
|
+
"@dxos/rpc": "0.6.11",
|
|
99
|
+
"@dxos/rpc-tunnel": "0.6.11",
|
|
100
|
+
"@dxos/util": "0.6.11"
|
|
99
101
|
},
|
|
100
102
|
"devDependencies": {
|
|
101
103
|
"@phosphor-icons/react": "^2.1.5",
|
|
@@ -105,20 +107,20 @@
|
|
|
105
107
|
"react": "~18.2.0",
|
|
106
108
|
"react-dom": "~18.2.0",
|
|
107
109
|
"vite": "^5.3.4",
|
|
108
|
-
"@dxos/
|
|
109
|
-
"@dxos/
|
|
110
|
-
"@dxos/
|
|
111
|
-
"@dxos/react-ui-mosaic": "0.6.11
|
|
112
|
-
"@dxos/
|
|
113
|
-
"@dxos/
|
|
110
|
+
"@dxos/random": "0.6.11",
|
|
111
|
+
"@dxos/react-ui": "0.6.11",
|
|
112
|
+
"@dxos/echo-generator": "0.6.11",
|
|
113
|
+
"@dxos/react-ui-mosaic": "0.6.11",
|
|
114
|
+
"@dxos/react-ui-theme": "0.6.11",
|
|
115
|
+
"@dxos/storybook-utils": "0.6.11"
|
|
114
116
|
},
|
|
115
117
|
"optionalDependencies": {
|
|
116
118
|
"@phosphor-icons/react": "^2.1.5",
|
|
117
119
|
"react": "^18.0.0",
|
|
118
120
|
"react-dom": "^18.0.0",
|
|
119
|
-
"@dxos/react-ui": "0.6.11
|
|
120
|
-
"@dxos/react-ui-mosaic": "0.6.11
|
|
121
|
-
"@dxos/react-ui-theme": "0.6.11
|
|
121
|
+
"@dxos/react-ui": "0.6.11",
|
|
122
|
+
"@dxos/react-ui-mosaic": "0.6.11",
|
|
123
|
+
"@dxos/react-ui-theme": "0.6.11"
|
|
122
124
|
},
|
|
123
125
|
"publishConfig": {
|
|
124
126
|
"access": "public"
|
|
@@ -3,15 +3,6 @@
|
|
|
3
3
|
//
|
|
4
4
|
|
|
5
5
|
import React, { useEffect, useRef, useState } from 'react';
|
|
6
|
-
// @ts-ignore
|
|
7
|
-
// eslint-disable-next-line no-restricted-imports
|
|
8
|
-
import SyntaxHighlighter from 'react-syntax-highlighter';
|
|
9
|
-
// @ts-ignore
|
|
10
|
-
// eslint-disable-next-line no-restricted-imports
|
|
11
|
-
import styleDark from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark';
|
|
12
|
-
// @ts-ignore
|
|
13
|
-
// eslint-disable-next-line no-restricted-imports
|
|
14
|
-
import styleLight from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-light';
|
|
15
6
|
|
|
16
7
|
import { log } from '@dxos/log';
|
|
17
8
|
import {
|
|
@@ -22,9 +13,9 @@ import {
|
|
|
22
13
|
type ThemedClassName,
|
|
23
14
|
Toolbar,
|
|
24
15
|
useControlledValue,
|
|
25
|
-
useThemeContext,
|
|
26
16
|
useTranslation,
|
|
27
17
|
} from '@dxos/react-ui';
|
|
18
|
+
import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
|
|
28
19
|
import { mx } from '@dxos/react-ui-theme';
|
|
29
20
|
|
|
30
21
|
import { SCRIPT_PLUGIN } from '../meta';
|
|
@@ -233,17 +224,12 @@ const RobotAvatar = () => (
|
|
|
233
224
|
);
|
|
234
225
|
|
|
235
226
|
const MessageItem = ({ classNames, message }: ThemedClassName<{ message: Message }>) => {
|
|
236
|
-
const { themeMode } = useThemeContext();
|
|
237
227
|
const { text, data, error } = message;
|
|
238
228
|
if (error) {
|
|
239
229
|
return <span className={mx(classNames, 'whitespace-pre text-error')}>{String(error)}</span>;
|
|
240
230
|
} else if (data) {
|
|
241
231
|
return (
|
|
242
|
-
<SyntaxHighlighter
|
|
243
|
-
language='json'
|
|
244
|
-
style={themeMode === 'dark' ? styleDark : styleLight}
|
|
245
|
-
className={mx('w-full text-xs', classNames)}
|
|
246
|
-
>
|
|
232
|
+
<SyntaxHighlighter language='json' className={mx('text-xs', classNames)}>
|
|
247
233
|
{JSON.stringify(data, null, 2)}
|
|
248
234
|
</SyntaxHighlighter>
|
|
249
235
|
);
|
|
@@ -3,15 +3,14 @@
|
|
|
3
3
|
//
|
|
4
4
|
|
|
5
5
|
import '@dxos-theme';
|
|
6
|
-
|
|
7
6
|
import React, { useEffect, useMemo } from 'react';
|
|
8
7
|
|
|
9
8
|
import { createSpaceObjectGenerator, TestSchemaType } from '@dxos/echo-generator';
|
|
10
9
|
import { TextType } from '@dxos/plugin-markdown/types';
|
|
11
10
|
import { useClient } from '@dxos/react-client';
|
|
12
|
-
import { create,
|
|
13
|
-
import {
|
|
14
|
-
import { withTheme } from '@dxos/storybook-utils';
|
|
11
|
+
import { create, createEchoObject, useSpaces } from '@dxos/react-client/echo';
|
|
12
|
+
import { withClientProvider } from '@dxos/react-client/testing';
|
|
13
|
+
import { withLayout, withTheme } from '@dxos/storybook-utils';
|
|
15
14
|
|
|
16
15
|
// @ts-ignore
|
|
17
16
|
import mainUrl from './FrameContainer/frame?url';
|
|
@@ -32,33 +31,41 @@ const code = [
|
|
|
32
31
|
|
|
33
32
|
const Story = () => {
|
|
34
33
|
const client = useClient();
|
|
35
|
-
|
|
34
|
+
const spaces = useSpaces();
|
|
35
|
+
console.log(spaces.length);
|
|
36
|
+
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
try {
|
|
39
|
+
// TODO(burdon): Default not set.
|
|
40
|
+
const generator = createSpaceObjectGenerator(client.spaces.default);
|
|
41
|
+
generator.addSchemas();
|
|
42
|
+
void generator
|
|
43
|
+
.createObjects({
|
|
44
|
+
[TestSchemaType.organization]: 20,
|
|
45
|
+
[TestSchemaType.contact]: 50,
|
|
46
|
+
})
|
|
47
|
+
.catch();
|
|
48
|
+
} catch (err) {
|
|
49
|
+
console.log(err);
|
|
50
|
+
}
|
|
51
|
+
}, [client]);
|
|
52
|
+
|
|
53
|
+
// TODO(burdon): Review what's the right way to create automerge-backed objects.
|
|
36
54
|
const object = useMemo(
|
|
37
55
|
() => createEchoObject(create(ScriptType, { source: create(TextType, { content: code }) })),
|
|
38
|
-
[
|
|
56
|
+
[],
|
|
39
57
|
);
|
|
40
|
-
const accessor = useMemo(() => createDocAccessor(object, ['content']), [object]);
|
|
41
|
-
useEffect(() => {
|
|
42
|
-
const generator = createSpaceObjectGenerator(client.spaces.default);
|
|
43
|
-
generator.addSchemas();
|
|
44
|
-
void generator.createObjects({ [TestSchemaType.organization]: 20, [TestSchemaType.contact]: 50 }).catch();
|
|
45
|
-
}, []);
|
|
46
58
|
|
|
47
59
|
// TODO(dmaretskyi): Not sure how to provide `containerUrl` here since the html now lives in composer-app.
|
|
48
60
|
// TODO(burdon): Normalize html/frame.tsx with composer-app to test locally.
|
|
49
|
-
return
|
|
50
|
-
<div className={'flex fixed inset-0'}>{accessor && <ScriptBlock script={object} containerUrl={mainUrl} />}</div>
|
|
51
|
-
);
|
|
61
|
+
return <ScriptBlock script={object} containerUrl={mainUrl} />;
|
|
52
62
|
};
|
|
53
63
|
|
|
54
64
|
export default {
|
|
55
65
|
title: 'plugin-script/ScriptBlock',
|
|
56
66
|
component: ScriptBlock,
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
parameters: {
|
|
60
|
-
layout: 'fullscreen',
|
|
61
|
-
},
|
|
67
|
+
decorators: [withTheme, withLayout({ fullscreen: true, tooltips: true }), withClientProvider({ createSpace: true })],
|
|
68
|
+
render: Story,
|
|
62
69
|
};
|
|
63
70
|
|
|
64
71
|
export const Default = {};
|
|
@@ -10,9 +10,18 @@ import React, { useCallback, useMemo, useState } from 'react';
|
|
|
10
10
|
|
|
11
11
|
import { log } from '@dxos/log';
|
|
12
12
|
import { useClient } from '@dxos/react-client';
|
|
13
|
-
import {
|
|
13
|
+
import {
|
|
14
|
+
create,
|
|
15
|
+
createDocAccessor,
|
|
16
|
+
Filter,
|
|
17
|
+
fullyQualifiedId,
|
|
18
|
+
getMeta,
|
|
19
|
+
getSpace,
|
|
20
|
+
useQuery,
|
|
21
|
+
} from '@dxos/react-client/echo';
|
|
14
22
|
import { useIdentity } from '@dxos/react-client/halo';
|
|
15
23
|
import { useTranslation } from '@dxos/react-ui';
|
|
24
|
+
import { useHasAttention } from '@dxos/react-ui-attention';
|
|
16
25
|
import { createDataExtensions, listener } from '@dxos/react-ui-editor';
|
|
17
26
|
import { mx } from '@dxos/react-ui-theme';
|
|
18
27
|
|
|
@@ -36,6 +45,7 @@ export type ScriptEditorProps = {
|
|
|
36
45
|
|
|
37
46
|
export const ScriptEditor = ({ env, script, role }: ScriptEditorProps) => {
|
|
38
47
|
const { t } = useTranslation(SCRIPT_PLUGIN);
|
|
48
|
+
const hasAttention = useHasAttention(fullyQualifiedId(script));
|
|
39
49
|
const client = useClient();
|
|
40
50
|
const identity = useIdentity();
|
|
41
51
|
const space = getSpace(script);
|
|
@@ -157,17 +167,22 @@ export const ScriptEditor = ({ env, script, role }: ScriptEditorProps) => {
|
|
|
157
167
|
return (
|
|
158
168
|
<div
|
|
159
169
|
role='none'
|
|
160
|
-
className={mx(
|
|
170
|
+
className={mx(
|
|
171
|
+
'flex flex-col is-full bs-full overflow-hidden',
|
|
172
|
+
role === 'article' && 'row-span-2',
|
|
173
|
+
hasAttention && 'attention-surface',
|
|
174
|
+
)}
|
|
161
175
|
>
|
|
162
176
|
<TypescriptEditor
|
|
163
177
|
id={script.id}
|
|
164
178
|
env={env}
|
|
165
179
|
initialValue={initialValue}
|
|
166
180
|
extensions={extensions}
|
|
167
|
-
className='flex is-full bs-full overflow-hidden
|
|
181
|
+
className='flex is-full bs-full overflow-hidden ch-focus-ring-inset-over-all'
|
|
168
182
|
/>
|
|
169
183
|
|
|
170
184
|
<Toolbar
|
|
185
|
+
classNames='border-t border-separator'
|
|
171
186
|
deployed={Boolean(existingFunctionUrl) && !script.changed}
|
|
172
187
|
functionUrl={functionUrl}
|
|
173
188
|
error={error}
|
|
@@ -4,16 +4,14 @@
|
|
|
4
4
|
|
|
5
5
|
import '@dxos-theme';
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
import { withLayout, withTheme } from '@dxos/storybook-utils';
|
|
8
8
|
|
|
9
9
|
import { Toolbar } from './Toolbar';
|
|
10
10
|
|
|
11
11
|
export default {
|
|
12
12
|
title: 'plugin-script/Toolbar',
|
|
13
13
|
component: Toolbar,
|
|
14
|
-
|
|
15
|
-
layout: 'fullscreen',
|
|
16
|
-
},
|
|
14
|
+
decorators: [withTheme, withLayout({ tooltips: true })],
|
|
17
15
|
};
|
|
18
16
|
|
|
19
17
|
export const Default = { args: { binding: 'example', deployed: true } };
|
|
@@ -53,6 +53,7 @@ export const Toolbar = ({
|
|
|
53
53
|
setPending(false);
|
|
54
54
|
};
|
|
55
55
|
|
|
56
|
+
// TODO(burdon): Simplify tooltips.
|
|
56
57
|
// TODO(burdon): Factor out common toolbar components with sheet/editor?
|
|
57
58
|
return (
|
|
58
59
|
<DensityProvider density='fine'>
|
|
@@ -62,7 +63,7 @@ export const Toolbar = ({
|
|
|
62
63
|
<Tooltip.Root>
|
|
63
64
|
<Tooltip.Trigger asChild>
|
|
64
65
|
<NaturalToolbar.Button variant='ghost' onClick={onFormat}>
|
|
65
|
-
<Icon icon='ph--magic-
|
|
66
|
+
<Icon icon='ph--magic-wand--regular' size={4} />
|
|
66
67
|
</NaturalToolbar.Button>
|
|
67
68
|
</Tooltip.Trigger>
|
|
68
69
|
<Tooltip.Portal>
|
|
@@ -2,6 +2,15 @@
|
|
|
2
2
|
// Copyright 2023 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
+
import '@dxos-theme';
|
|
6
|
+
|
|
7
|
+
import React, { useMemo } from 'react';
|
|
8
|
+
|
|
9
|
+
import { createDocAccessor, createEchoObject } from '@dxos/react-client/echo';
|
|
10
|
+
import { createDataExtensions } from '@dxos/react-ui-editor';
|
|
11
|
+
|
|
12
|
+
import { TypescriptEditor } from './TypescriptEditor';
|
|
13
|
+
|
|
5
14
|
// TODO(burdon): Typescript.
|
|
6
15
|
// TODO(burdon): Effect schema.
|
|
7
16
|
// TODO(burdon): JSX.
|
|
@@ -13,15 +22,6 @@
|
|
|
13
22
|
// - virtual document image rendering
|
|
14
23
|
// - mobile rendering error
|
|
15
24
|
|
|
16
|
-
import '@dxos-theme';
|
|
17
|
-
|
|
18
|
-
import React, { useMemo } from 'react';
|
|
19
|
-
|
|
20
|
-
import { createDocAccessor, createEchoObject } from '@dxos/react-client/echo';
|
|
21
|
-
import { createDataExtensions } from '@dxos/react-ui-editor';
|
|
22
|
-
|
|
23
|
-
import { TypescriptEditor } from './TypescriptEditor';
|
|
24
|
-
|
|
25
25
|
const examples: string[] = [
|
|
26
26
|
[
|
|
27
27
|
'// Example function.',
|
|
@@ -55,9 +55,6 @@ export default {
|
|
|
55
55
|
title: 'plugin-script/TypescriptEditor',
|
|
56
56
|
component: TypescriptEditor,
|
|
57
57
|
render: Story,
|
|
58
|
-
parameters: {
|
|
59
|
-
layout: 'fullscreen',
|
|
60
|
-
},
|
|
61
58
|
};
|
|
62
59
|
|
|
63
60
|
export const Default = {};
|
|
@@ -3,8 +3,6 @@
|
|
|
3
3
|
//
|
|
4
4
|
|
|
5
5
|
import { javascript } from '@codemirror/lang-javascript';
|
|
6
|
-
import { defaultHighlightStyle, syntaxHighlighting } from '@codemirror/language';
|
|
7
|
-
import { oneDarkHighlightStyle } from '@codemirror/theme-one-dark';
|
|
8
6
|
import { type VirtualTypeScriptEnvironment } from '@typescript/vfs';
|
|
9
7
|
import { tsSync, tsFacet, tsLinter, tsAutocomplete, tsHover } from '@valtown/codemirror-ts';
|
|
10
8
|
import React from 'react';
|
|
@@ -25,20 +23,19 @@ import { nonNullable } from '@dxos/util';
|
|
|
25
23
|
|
|
26
24
|
export type TypescriptEditorProps = {
|
|
27
25
|
id: string;
|
|
28
|
-
env?: VirtualTypeScriptEnvironment;
|
|
29
|
-
className?: string;
|
|
30
26
|
scrollPastEnd?: boolean;
|
|
31
|
-
|
|
27
|
+
env?: VirtualTypeScriptEnvironment;
|
|
28
|
+
} & Pick<UseTextEditorProps, 'className' | 'initialValue' | 'extensions' | 'scrollTo' | 'selection'>;
|
|
32
29
|
|
|
33
30
|
export const TypescriptEditor = ({
|
|
34
31
|
id,
|
|
35
|
-
|
|
32
|
+
scrollPastEnd,
|
|
36
33
|
env,
|
|
34
|
+
className,
|
|
37
35
|
initialValue,
|
|
36
|
+
extensions,
|
|
38
37
|
scrollTo,
|
|
39
38
|
selection,
|
|
40
|
-
className,
|
|
41
|
-
scrollPastEnd,
|
|
42
39
|
}: TypescriptEditorProps) => {
|
|
43
40
|
const { themeMode } = useThemeContext();
|
|
44
41
|
const { parentRef, focusAttributes } = useTextEditor(
|
|
@@ -47,7 +44,6 @@ export const TypescriptEditor = ({
|
|
|
47
44
|
initialValue,
|
|
48
45
|
extensions: [
|
|
49
46
|
extensions,
|
|
50
|
-
// TODO(wittjosiah): Highlight active line doesn't work.
|
|
51
47
|
createBasicExtensions({
|
|
52
48
|
highlightActiveLine: true,
|
|
53
49
|
indentWithTab: true,
|
|
@@ -55,21 +51,23 @@ export const TypescriptEditor = ({
|
|
|
55
51
|
lineWrapping: false,
|
|
56
52
|
scrollPastEnd,
|
|
57
53
|
}),
|
|
58
|
-
// TODO(wittjosiah): Factor out syntax highlighting to theme extensions.
|
|
59
|
-
themeMode === 'dark' ? syntaxHighlighting(oneDarkHighlightStyle) : syntaxHighlighting(defaultHighlightStyle),
|
|
60
54
|
createThemeExtensions({
|
|
61
55
|
themeMode,
|
|
56
|
+
syntaxHighlighting: true,
|
|
62
57
|
slots: {
|
|
63
58
|
content: { className: editorFullWidth },
|
|
64
59
|
},
|
|
65
60
|
}),
|
|
66
61
|
editorGutter,
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
62
|
+
// TODO(burdon): Factor out.
|
|
63
|
+
[
|
|
64
|
+
editorMonospace,
|
|
65
|
+
javascript({ typescript: true }),
|
|
66
|
+
// https://github.com/val-town/codemirror-ts
|
|
67
|
+
autocomplete({ override: env ? [tsAutocomplete()] : [] }),
|
|
68
|
+
env ? [tsFacet.of({ env, path: `/src/${id}.ts` }), tsSync(), tsLinter(), tsHover()] : [],
|
|
69
|
+
InputModeExtensions.vscode,
|
|
70
|
+
],
|
|
73
71
|
].filter(nonNullable),
|
|
74
72
|
selection,
|
|
75
73
|
scrollTo,
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/ScriptEditor.tsx", "../../../src/components/DebugPanel.tsx", "../../../src/components/Toolbar.tsx"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type DID } from 'iso-did/types';\nimport { format } from 'prettier';\nimport prettierPluginEstree from 'prettier/plugins/estree';\nimport prettierPluginTypescript from 'prettier/plugins/typescript';\nimport React, { useCallback, useMemo, useState } from 'react';\n\nimport { log } from '@dxos/log';\nimport { useClient } from '@dxos/react-client';\nimport { create, createDocAccessor, Filter, getMeta, getSpace, useQuery } from '@dxos/react-client/echo';\nimport { useIdentity } from '@dxos/react-client/halo';\nimport { useTranslation } from '@dxos/react-ui';\nimport { createDataExtensions, listener } from '@dxos/react-ui-editor';\nimport { mx } from '@dxos/react-ui-theme';\n\nimport { DebugPanel } from './DebugPanel';\nimport { Toolbar } from './Toolbar';\nimport { TypescriptEditor, type TypescriptEditorProps } from './TypescriptEditor';\nimport { Bundler } from '../bundler';\nimport {\n getUserFunctionUrlInMetadata,\n publicKeyToDid,\n setUserFunctionUrlInMetadata,\n uploadWorkerFunction,\n} from '../edge';\nimport { SCRIPT_PLUGIN } from '../meta';\nimport { FunctionType, type ScriptType } from '../types';\n\nexport type ScriptEditorProps = {\n script: ScriptType;\n role?: string;\n} & Pick<TypescriptEditorProps, 'env'>;\n\nexport const ScriptEditor = ({ env, script, role }: ScriptEditorProps) => {\n const { t } = useTranslation(SCRIPT_PLUGIN);\n const client = useClient();\n const identity = useIdentity();\n const space = getSpace(script);\n const [fn] = useQuery(\n space,\n Filter.schema(FunctionType, (fn) => fn.source === script),\n );\n\n const extensions = useMemo(\n () => [\n listener({\n onChange: (text) => {\n if (script.source && script.source?.content !== text) {\n script.changed = true;\n }\n },\n }),\n createDataExtensions({\n id: script.id,\n text: script.source && createDocAccessor(script.source, ['content']),\n space,\n identity,\n }),\n ],\n [script, script.source, space, identity],\n );\n\n const [showPanel, setShowPanel] = useState(false);\n const initialValue = useMemo(() => script.source?.content, [script.source]);\n const existingFunctionUrl = fn && getUserFunctionUrlInMetadata(getMeta(fn));\n const [error, setError] = useState<string>();\n\n const handleBindingChange = useCallback(\n (binding: string) => {\n fn.binding = binding;\n },\n [fn],\n );\n\n const handleFormat = useCallback(async () => {\n if (!script.source) {\n return;\n }\n\n try {\n script.source.content = await format(script.source.content, {\n parser: 'typescript',\n plugins: [prettierPluginEstree, prettierPluginTypescript],\n semi: true,\n singleQuote: true,\n });\n } catch (err: any) {\n // TODO(wittjosiah): Show error in UI.\n log.catch(err);\n }\n }, [script.source]);\n\n const handleDeploy = useCallback(async () => {\n if (!script.source || !identity || !space) {\n return;\n }\n\n setError(undefined);\n\n try {\n const existingFunctionId = existingFunctionUrl?.split('/').at(-1);\n const ownerDid = (existingFunctionUrl?.split('/').at(-2) as DID) ?? publicKeyToDid(identity.identityKey);\n\n const bundler = new Bundler({\n platform: 'browser',\n sandboxedModules: [],\n remoteModules: {},\n });\n const buildResult = await bundler.bundle(script.source.content);\n if (buildResult.error || !buildResult.bundle) {\n throw buildResult.error;\n }\n\n const { result, functionId, functionVersionNumber, errorMessage } = await uploadWorkerFunction({\n clientConfig: client.config,\n halo: client.halo,\n ownerDid,\n functionId: existingFunctionId,\n source: buildResult.bundle,\n });\n if (result !== 'success' || functionId === undefined || functionVersionNumber === undefined) {\n throw new Error(errorMessage);\n }\n log.info('function uploaded', { functionId, functionVersionNumber });\n if (fn) {\n fn.version = functionVersionNumber;\n }\n const deployedFunction =\n fn ?? space.db.add(create(FunctionType, { version: functionVersionNumber, source: script }));\n const meta = getMeta(deployedFunction);\n setUserFunctionUrlInMetadata(meta, `/${ownerDid}/${functionId}`);\n script.changed = false;\n } catch (err: any) {\n log.catch(err);\n setError(t('upload failed label'));\n }\n }, [fn, existingFunctionUrl, script, script.name, script.source]);\n\n const functionUrl = useMemo(() => {\n if (!existingFunctionUrl) {\n return;\n }\n\n const baseUrl = new URL('functions/', client.config.values.runtime?.services?.edge?.url);\n\n // Leading slashes cause the URL to be treated as an absolute path.\n const relativeUrl = existingFunctionUrl.replace(/^\\//, '');\n const url = new URL(`./${relativeUrl}`, baseUrl.toString());\n space && url.searchParams.set('spaceId', space.id);\n url.protocol = 'https';\n return url.toString();\n }, [existingFunctionUrl, space]);\n\n return (\n <div\n role='none'\n className={mx(role === 'article' && 'row-span-2', 'flex flex-col is-full bs-full overflow-hidden')}\n >\n <TypescriptEditor\n id={script.id}\n env={env}\n initialValue={initialValue}\n extensions={extensions}\n className='flex is-full bs-full overflow-hidden border-b border-separator'\n />\n\n <Toolbar\n deployed={Boolean(existingFunctionUrl) && !script.changed}\n functionUrl={functionUrl}\n error={error}\n showPanel={showPanel}\n onDeploy={handleDeploy}\n onFormat={handleFormat}\n onTogglePanel={async () => setShowPanel((showDetails) => !showDetails)}\n />\n\n {showPanel && (\n <DebugPanel functionUrl={functionUrl} binding={fn?.binding} onBindingChange={handleBindingChange} />\n )}\n </div>\n );\n};\n\nexport default ScriptEditor;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useEffect, useRef, useState } from 'react';\n// @ts-ignore\n// eslint-disable-next-line no-restricted-imports\nimport SyntaxHighlighter from 'react-syntax-highlighter';\n// @ts-ignore\n// eslint-disable-next-line no-restricted-imports\nimport styleDark from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark';\n// @ts-ignore\n// eslint-disable-next-line no-restricted-imports\nimport styleLight from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-light';\n\nimport { log } from '@dxos/log';\nimport {\n Avatar,\n DensityProvider,\n Icon,\n Input,\n type ThemedClassName,\n Toolbar,\n useControlledValue,\n useThemeContext,\n useTranslation,\n} from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\nimport { SCRIPT_PLUGIN } from '../meta';\n\ntype State = 'pending' | 'responding';\n\n/**\n * Request or response.\n */\ntype Message = { type: 'request' | 'response'; text?: string; data?: any; error?: Error };\n\nexport type DebugPanelProps = ThemedClassName<{\n functionUrl?: string;\n binding?: string;\n onBindingChange?: (binding: string) => void;\n}>;\n\nexport const DebugPanel = ({ classNames, functionUrl, binding: _binding, onBindingChange }: DebugPanelProps) => {\n const { t } = useTranslation(SCRIPT_PLUGIN);\n\n const bindingInputRef = useRef<HTMLInputElement>(null);\n const [binding, setBinding] = useControlledValue(_binding ?? '');\n const handleBlur = () => {\n onBindingChange?.(binding);\n };\n\n const inputRef = useRef<HTMLInputElement>(null);\n const [input, setInput] = useState('');\n const [result, setResult] = useState('');\n const [state, setState] = useState<State | null>(null);\n\n // TODO(burdon): Persistent history (non-space ECHO data?)\n const [history, setHistory] = useState<Message[]>([]);\n\n const scrollerRef = useRef<HTMLDivElement>(null);\n const handleScroll = () => {\n if (scrollerRef.current) {\n scrollerRef.current.scrollTop = scrollerRef.current.scrollHeight;\n }\n };\n\n const controller = useRef<AbortController>();\n useEffect(() => {\n return () => {\n handleStop();\n };\n }, []);\n\n const handleStop = () => {\n controller.current?.abort('stop');\n controller.current = undefined;\n };\n\n const handleClear = () => {\n handleStop();\n setInput('');\n setResult('');\n setHistory([]);\n inputRef.current?.focus();\n };\n\n const handleResponse = ({ text, data, error }: { text?: string; data?: any; error?: Error } = {}) => {\n controller.current = undefined;\n setHistory((history) => [...history, { type: 'response', text, data, error } satisfies Message]);\n setResult('');\n setState(null);\n handleScroll();\n };\n\n const handleRequest = async (input: string) => {\n // Returns a promise that resolves when a value has been received.\n try {\n setState('pending');\n\n let data = null;\n // Detect JSON input.\n if (input.charAt(0) === '{') {\n try {\n const validJsonString = input.replace(/'/g, '\"').replace(/([{,]\\s*)([a-zA-Z0-9_]+)(\\s*:)/g, '$1\"$2\"$3');\n data = JSON.parse(validJsonString);\n input = JSON.stringify(data, null, 2);\n } catch (err) {\n inputRef.current?.focus();\n return;\n }\n }\n\n setInput('');\n setResult('');\n setHistory((history) => [...history, { type: 'request', text: input }]);\n setTimeout(() => {\n handleScroll();\n });\n\n // Throws DOMException when aborted.\n controller.current = new AbortController();\n const response = await fetch(functionUrl!, {\n signal: controller.current.signal,\n method: 'POST',\n body: input,\n headers: {\n 'Content-Type': data ? 'application/json' : 'text/plain',\n },\n });\n\n // Check for error.\n if (!response.ok) {\n const text = await response.text();\n handleResponse({ error: new Error(text || response.statusText || String(response.status)) });\n return;\n }\n\n // Check for JSON.\n const contentType = response.headers.get('content-type');\n if (contentType === 'application/json') {\n const data = await response.json();\n handleResponse({ data });\n return;\n }\n\n // Text (including streaming).\n setState('responding');\n let text = '';\n const reader = response.body!.getReader();\n const pump = async ({ done, value }: ReadableStreamReadResult<Uint8Array>): Promise<void> => {\n text = text + new TextDecoder().decode(value);\n if (!controller.current || done) {\n handleResponse({ text });\n return;\n }\n\n setResult(text);\n setTimeout(() => {\n handleScroll();\n });\n\n return reader.read().then(pump);\n };\n\n void reader\n .read()\n .then(pump)\n .catch((err) => {\n if (err.name !== 'AbortError') {\n log.catch(err);\n }\n });\n } catch (err: any) {\n if (err !== 'stop') {\n const error = err instanceof Error ? err : new Error(err);\n handleResponse({ error });\n log.catch(err);\n } else {\n handleResponse();\n }\n }\n };\n\n return (\n <DensityProvider density='fine'>\n <div className={mx('flex flex-col h-full overflow-hidden', classNames)}>\n {/* TODO(burdon): Replace with Thread? */}\n <div ref={scrollerRef} className='flex flex-col gap-6 h-full p-4 overflow-x-hidden overflow-y-auto'>\n <MessageThread state={state} result={result} history={history} />\n </div>\n\n <Toolbar.Root classNames='p-2'>\n <Input.Root>\n <Input.TextInput\n ref={inputRef}\n autoFocus\n placeholder={t('function request placeholder')}\n value={input}\n onChange={(ev) => setInput(ev.target.value)}\n onKeyDown={(ev) => ev.key === 'Enter' && handleRequest(input)}\n />\n </Input.Root>\n <Input.Root>\n <Input.TextInput\n ref={bindingInputRef}\n classNames='!w-[10rem]'\n placeholder={t('binding placeholder')}\n value={binding}\n onChange={(ev) => setBinding(ev.target.value.toUpperCase())}\n onBlur={handleBlur}\n />\n </Input.Root>\n <Toolbar.Button onClick={() => handleRequest(input)}>\n <Icon icon='ph--play--regular' size={4} />\n </Toolbar.Button>\n <Toolbar.Button onClick={() => (state ? handleStop() : handleClear())}>\n <Icon icon={state ? 'ph--stop--regular' : 'ph--trash--regular'} size={4} />\n </Toolbar.Button>\n </Toolbar.Root>\n </div>\n </DensityProvider>\n );\n};\n\nconst RobotAvatar = () => (\n <Avatar.Root size={6} variant='circle'>\n <Avatar.Frame>\n <Avatar.Icon icon='ph--robot--regular' />\n </Avatar.Frame>\n </Avatar.Root>\n);\n\nconst MessageItem = ({ classNames, message }: ThemedClassName<{ message: Message }>) => {\n const { themeMode } = useThemeContext();\n const { text, data, error } = message;\n if (error) {\n return <span className={mx(classNames, 'whitespace-pre text-error')}>{String(error)}</span>;\n } else if (data) {\n return (\n <SyntaxHighlighter\n language='json'\n style={themeMode === 'dark' ? styleDark : styleLight}\n className={mx('w-full text-xs', classNames)}\n >\n {JSON.stringify(data, null, 2)}\n </SyntaxHighlighter>\n );\n }\n\n return <span className={mx(classNames)}>{text || '\\u00D8'}</span>;\n};\n\n// TODO(burdon): Replace with thread?\n// TODO(burdon): Button to delete individual messages.\n// TODO(burdon): Button to re-run question.\nconst MessageThread = ({ state, result, history }: { state: State | null; result: string; history: Message[] }) => {\n return (\n <>\n {history.map((message, i) => (\n <div key={i} className='grid grid-cols-[3rem_1fr]'>\n <div>{message.type === 'response' && <RobotAvatar />}</div>\n <div className={mx('flex', message.type === 'request' && 'justify-end')}>\n <MessageItem\n classNames={[message.type === 'request' && 'p-1 px-2 rounded-lg bg-hoverSurface']}\n message={message}\n />\n </div>\n </div>\n ))}\n <div className='grid grid-cols-[3rem_1fr]'>\n <div>\n {(state === 'pending' && <Icon icon='ph--spinner--regular' size={6} classNames='animate-spin-slow' />) ||\n (result.length > 0 && <RobotAvatar />)}\n </div>\n <div>\n <span>{result}</span>\n </div>\n </div>\n </>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useState } from 'react';\n\nimport {\n DensityProvider,\n ElevationProvider,\n Icon,\n type ThemedClassName,\n Toolbar as NaturalToolbar,\n Tooltip,\n useTranslation,\n} from '@dxos/react-ui';\n\nimport { SCRIPT_PLUGIN } from '../meta';\n\nexport type ToolbarProps = ThemedClassName<{\n deployed?: boolean;\n error?: string;\n functionUrl?: string;\n showPanel?: boolean;\n onDeploy?: () => Promise<void>;\n onFormat?: () => Promise<void>;\n onTogglePanel?: () => Promise<void>;\n}>;\n\nexport const Toolbar = ({\n classNames,\n deployed,\n error,\n functionUrl,\n showPanel,\n onDeploy,\n onFormat,\n onTogglePanel,\n}: ToolbarProps) => {\n const { t } = useTranslation(SCRIPT_PLUGIN);\n const [pending, setPending] = useState(false);\n\n const handleCopyLink = async () => {\n if (!functionUrl) {\n return;\n }\n\n await navigator.clipboard.writeText(functionUrl);\n };\n\n const handleDeploy = async () => {\n setPending(true);\n await onDeploy?.();\n setPending(false);\n };\n\n // TODO(burdon): Factor out common toolbar components with sheet/editor?\n return (\n <DensityProvider density='fine'>\n <ElevationProvider elevation='chrome'>\n <NaturalToolbar.Root classNames={['p-1', classNames]} style={{ contain: 'layout' }}>\n {onFormat && (\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <NaturalToolbar.Button variant='ghost' onClick={onFormat}>\n <Icon icon='ph--magic-want--regular' size={4} />\n </NaturalToolbar.Button>\n </Tooltip.Trigger>\n <Tooltip.Portal>\n <Tooltip.Content>\n <Tooltip.Arrow />\n {t('format label')}\n </Tooltip.Content>\n </Tooltip.Portal>\n </Tooltip.Root>\n )}\n\n <div role='separator' className='grow' />\n\n {error ? (\n <Tooltip.Root>\n <Tooltip.Trigger>\n <Icon icon='ph--warning-circle--regular' size={4} />\n </Tooltip.Trigger>\n <Tooltip.Portal>\n <Tooltip.Content>\n <Tooltip.Arrow />\n {error}\n </Tooltip.Content>\n </Tooltip.Portal>\n </Tooltip.Root>\n ) : null}\n\n {functionUrl && deployed && (\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <NaturalToolbar.Button variant='ghost' onClick={handleCopyLink}>\n <Icon icon='ph--link--regular' size={4} />\n </NaturalToolbar.Button>\n </Tooltip.Trigger>\n <Tooltip.Portal>\n <Tooltip.Content>\n <Tooltip.Arrow />\n {t('copy link label')}\n </Tooltip.Content>\n </Tooltip.Portal>\n </Tooltip.Root>\n )}\n\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <NaturalToolbar.Button variant='ghost' onClick={handleDeploy} disabled={pending}>\n {pending ? (\n <Icon icon='ph--spinner--regular' size={4} classNames='animate-spin-slow' />\n ) : (\n <Icon icon='ph--cloud-arrow-up--regular' size={4} />\n )}\n </NaturalToolbar.Button>\n </Tooltip.Trigger>\n <Tooltip.Portal>\n <Tooltip.Content>\n <Tooltip.Arrow />\n {pending ? t('pending label') : t('deploy label')}\n </Tooltip.Content>\n </Tooltip.Portal>\n </Tooltip.Root>\n\n {onTogglePanel && (\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <NaturalToolbar.Button variant='ghost' onClick={onTogglePanel}>\n <Icon icon={showPanel ? 'ph--caret-down--regular' : 'ph--caret-up--regular'} size={4} />\n </NaturalToolbar.Button>\n </Tooltip.Trigger>\n <Tooltip.Portal>\n <Tooltip.Content>\n <Tooltip.Arrow />\n {t('toggle details label')}\n </Tooltip.Content>\n </Tooltip.Portal>\n </Tooltip.Root>\n )}\n </NaturalToolbar.Root>\n </ElevationProvider>\n </DensityProvider>\n );\n};\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": ["format", "prettierPluginEstree", "prettierPluginTypescript", "React", "useCallback", "useMemo", "useState", "log", "useClient", "create", "createDocAccessor", "Filter", "getMeta", "getSpace", "useQuery", "useIdentity", "useTranslation", "createDataExtensions", "listener", "mx", "React", "useEffect", "useRef", "useState", "SyntaxHighlighter", "styleDark", "styleLight", "log", "Avatar", "DensityProvider", "Icon", "Input", "Toolbar", "useControlledValue", "useThemeContext", "useTranslation", "mx", "DebugPanel", "classNames", "functionUrl", "binding", "_binding", "onBindingChange", "t", "useTranslation", "SCRIPT_PLUGIN", "bindingInputRef", "useRef", "setBinding", "useControlledValue", "handleBlur", "inputRef", "input", "setInput", "useState", "result", "setResult", "state", "setState", "history", "setHistory", "scrollerRef", "handleScroll", "current", "scrollTop", "scrollHeight", "controller", "useEffect", "handleStop", "abort", "undefined", "handleClear", "focus", "handleResponse", "text", "data", "error", "type", "handleRequest", "charAt", "validJsonString", "replace", "JSON", "parse", "stringify", "err", "setTimeout", "AbortController", "response", "fetch", "signal", "method", "body", "headers", "ok", "Error", "statusText", "String", "status", "contentType", "get", "json", "reader", "getReader", "pump", "done", "value", "TextDecoder", "decode", "read", "then", "catch", "name", "log", "DensityProvider", "density", "div", "className", "mx", "ref", "MessageThread", "Toolbar", "Root", "Input", "TextInput", "autoFocus", "placeholder", "onChange", "ev", "target", "onKeyDown", "key", "toUpperCase", "onBlur", "Button", "onClick", "Icon", "icon", "size", "RobotAvatar", "Avatar", "variant", "Frame", "MessageItem", "message", "themeMode", "useThemeContext", "span", "SyntaxHighlighter", "language", "style", "styleDark", "styleLight", "map", "i", "length", "React", "useState", "DensityProvider", "ElevationProvider", "Icon", "Toolbar", "NaturalToolbar", "Tooltip", "useTranslation", "Toolbar", "classNames", "deployed", "error", "functionUrl", "showPanel", "onDeploy", "onFormat", "onTogglePanel", "t", "useTranslation", "SCRIPT_PLUGIN", "pending", "setPending", "useState", "handleCopyLink", "navigator", "clipboard", "writeText", "handleDeploy", "React", "DensityProvider", "density", "ElevationProvider", "elevation", "NaturalToolbar", "Root", "style", "contain", "Tooltip", "Trigger", "asChild", "Button", "variant", "onClick", "Icon", "icon", "size", "Portal", "Content", "Arrow", "div", "role", "className", "disabled", "ScriptEditor", "env", "script", "role", "t", "useTranslation", "SCRIPT_PLUGIN", "client", "useClient", "identity", "useIdentity", "space", "getSpace", "fn", "useQuery", "Filter", "schema", "FunctionType", "source", "extensions", "useMemo", "listener", "onChange", "text", "content", "changed", "createDataExtensions", "id", "createDocAccessor", "showPanel", "setShowPanel", "useState", "initialValue", "existingFunctionUrl", "getUserFunctionUrlInMetadata", "getMeta", "error", "setError", "handleBindingChange", "useCallback", "binding", "handleFormat", "format", "parser", "plugins", "prettierPluginEstree", "prettierPluginTypescript", "semi", "singleQuote", "err", "log", "catch", "handleDeploy", "undefined", "existingFunctionId", "split", "at", "ownerDid", "publicKeyToDid", "identityKey", "bundler", "Bundler", "platform", "sandboxedModules", "remoteModules", "buildResult", "bundle", "result", "functionId", "functionVersionNumber", "errorMessage", "uploadWorkerFunction", "clientConfig", "config", "halo", "Error", "info", "version", "deployedFunction", "db", "add", "create", "meta", "setUserFunctionUrlInMetadata", "name", "functionUrl", "baseUrl", "URL", "values", "runtime", "services", "edge", "url", "relativeUrl", "replace", "toString", "searchParams", "set", "protocol", "React", "div", "className", "mx", "TypescriptEditor", "Toolbar", "deployed", "Boolean", "onDeploy", "onFormat", "onTogglePanel", "showDetails", "DebugPanel", "onBindingChange"]
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/TypescriptEditor.tsx"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { javascript } from '@codemirror/lang-javascript';\nimport { defaultHighlightStyle, syntaxHighlighting } from '@codemirror/language';\nimport { oneDarkHighlightStyle } from '@codemirror/theme-one-dark';\nimport { type VirtualTypeScriptEnvironment } from '@typescript/vfs';\nimport { tsSync, tsFacet, tsLinter, tsAutocomplete, tsHover } from '@valtown/codemirror-ts';\nimport React from 'react';\n\nimport { useThemeContext } from '@dxos/react-ui';\nimport {\n autocomplete,\n createBasicExtensions,\n createThemeExtensions,\n editorFullWidth,\n editorGutter,\n editorMonospace,\n InputModeExtensions,\n useTextEditor,\n type UseTextEditorProps,\n} from '@dxos/react-ui-editor';\nimport { nonNullable } from '@dxos/util';\n\nexport type TypescriptEditorProps = {\n id: string;\n env?: VirtualTypeScriptEnvironment;\n className?: string;\n scrollPastEnd?: boolean;\n} & Pick<UseTextEditorProps, 'initialValue' | 'extensions' | 'scrollTo' | 'selection'>;\n\nexport const TypescriptEditor = ({\n id,\n extensions,\n env,\n initialValue,\n scrollTo,\n selection,\n className,\n scrollPastEnd,\n}: TypescriptEditorProps) => {\n const { themeMode } = useThemeContext();\n const { parentRef, focusAttributes } = useTextEditor(\n () => ({\n id,\n initialValue,\n extensions: [\n extensions,\n // TODO(wittjosiah): Highlight active line doesn't work.\n createBasicExtensions({\n highlightActiveLine: true,\n indentWithTab: true,\n lineNumbers: true,\n lineWrapping: false,\n scrollPastEnd,\n }),\n // TODO(wittjosiah): Factor out syntax highlighting to theme extensions.\n themeMode === 'dark' ? syntaxHighlighting(oneDarkHighlightStyle) : syntaxHighlighting(defaultHighlightStyle),\n createThemeExtensions({\n themeMode,\n slots: {\n content: { className: editorFullWidth },\n },\n }),\n editorGutter,\n editorMonospace,\n javascript({ typescript: true }),\n // https://github.com/val-town/codemirror-ts\n env ? [tsFacet.of({ env, path: `/src/${id}.ts` }), tsSync(), tsLinter(), tsHover()] : [],\n autocomplete({ override: env ? [tsAutocomplete()] : [] }),\n InputModeExtensions.vscode,\n ].filter(nonNullable),\n selection,\n scrollTo,\n }),\n [id, initialValue, extensions, themeMode, selection, scrollTo],\n );\n\n return <div ref={parentRef} className={className} {...focusAttributes} />;\n};\n\nexport default TypescriptEditor;\n"],
|
|
5
|
-
"mappings": ";AAIA,SAASA,kBAAkB;AAC3B,SAASC,uBAAuBC,0BAA0B;AAC1D,SAASC,6BAA6B;AAEtC,SAASC,QAAQC,SAASC,UAAUC,gBAAgBC,eAAe;AACnE,OAAOC,WAAW;AAElB,SAASC,uBAAuB;AAChC,SACEC,cACAC,uBACAC,uBACAC,iBACAC,cACAC,iBACAC,qBACAC,qBAEK;AACP,SAASC,mBAAmB;AASrB,IAAMC,mBAAmB,CAAC,EAC/BC,IACAC,YACAC,KACAC,cACAC,UACAC,WACAC,WACAC,cAAa,MACS;AACtB,QAAM,EAAEC,UAAS,IAAKC,gBAAAA;AACtB,QAAM,EAAEC,WAAWC,gBAAe,IAAKC,cACrC,OAAO;IACLZ;IACAG;IACAF,YAAY;MACVA;;MAEAY,sBAAsB;QACpBC,qBAAqB;QACrBC,eAAe;QACfC,aAAa;QACbC,cAAc;QACdV;MACF,CAAA;;MAEAC,cAAc,SAASU,mBAAmBC,qBAAAA,IAAyBD,mBAAmBE,qBAAAA;MACtFC,sBAAsB;QACpBb;QACAc,OAAO;UACLC,SAAS;YAAEjB,WAAWkB;UAAgB;QACxC;MACF,CAAA;MACAC;MACAC;MACAC,WAAW;QAAEC,YAAY;MAAK,CAAA;;MAE9B1B,MAAM;QAAC2B,QAAQC,GAAG;UAAE5B;UAAK6B,MAAM,QAAQ/B,EAAAA;QAAQ,CAAA;QAAIgC,OAAAA;QAAUC,SAAAA;QAAYC,QAAAA;UAAa,CAAA;MACtFC,aAAa;QAAEC,UAAUlC,MAAM;UAACmC,eAAAA;YAAoB,CAAA;MAAG,CAAA;MACvDC,oBAAoBC;MACpBC,OAAOC,WAAAA;IACTpC;IACAD;EACF,IACA;IAACJ;IAAIG;IAAcF;IAAYO;IAAWH;IAAWD;GAAS;AAGhE,SAAO,sBAAA,cAACsC,OAAAA;IAAIC,KAAKjC;IAAWJ;IAAuB,GAAGK;;AACxD;AAEA,IAAA,2BAAeZ;",
|
|
6
|
-
"names": ["javascript", "defaultHighlightStyle", "syntaxHighlighting", "oneDarkHighlightStyle", "tsSync", "tsFacet", "tsLinter", "tsAutocomplete", "tsHover", "React", "useThemeContext", "autocomplete", "createBasicExtensions", "createThemeExtensions", "editorFullWidth", "editorGutter", "editorMonospace", "InputModeExtensions", "useTextEditor", "nonNullable", "TypescriptEditor", "id", "extensions", "env", "initialValue", "scrollTo", "selection", "className", "scrollPastEnd", "themeMode", "useThemeContext", "parentRef", "focusAttributes", "useTextEditor", "createBasicExtensions", "highlightActiveLine", "indentWithTab", "lineNumbers", "lineWrapping", "syntaxHighlighting", "oneDarkHighlightStyle", "defaultHighlightStyle", "createThemeExtensions", "slots", "content", "editorFullWidth", "editorGutter", "editorMonospace", "javascript", "typescript", "tsFacet", "of", "path", "tsSync", "tsLinter", "tsHover", "autocomplete", "override", "tsAutocomplete", "InputModeExtensions", "vscode", "filter", "nonNullable", "div", "ref"]
|
|
7
|
-
}
|