@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.
Files changed (40) hide show
  1. package/dist/lib/browser/{ScriptEditor-C6MMOFDI.mjs → ScriptEditor-5Y3EROG3.mjs} +17 -18
  2. package/dist/lib/browser/ScriptEditor-5Y3EROG3.mjs.map +7 -0
  3. package/dist/lib/browser/{TypescriptEditor-XTGRVCMY.mjs → TypescriptEditor-GPE72Y6I.mjs} +2 -2
  4. package/dist/lib/browser/{chunk-DX5CSOBP.mjs → chunk-MRGOT5RF.mjs} +25 -26
  5. package/dist/lib/browser/chunk-MRGOT5RF.mjs.map +7 -0
  6. package/dist/lib/browser/index.mjs +2 -2
  7. package/dist/lib/browser/meta.json +1 -1
  8. package/dist/lib/node/{ScriptEditor-XQESJORL.cjs → ScriptEditor-YCUQFWQM.cjs} +20 -21
  9. package/dist/lib/node/ScriptEditor-YCUQFWQM.cjs.map +7 -0
  10. package/dist/lib/node/{TypescriptEditor-CRONCQSI.cjs → TypescriptEditor-M3WWFIP2.cjs} +7 -7
  11. package/dist/lib/node/{TypescriptEditor-CRONCQSI.cjs.map → TypescriptEditor-M3WWFIP2.cjs.map} +2 -2
  12. package/dist/lib/node/{chunk-RXI576K3.cjs → chunk-IMLDKD5Y.cjs} +28 -29
  13. package/dist/lib/node/chunk-IMLDKD5Y.cjs.map +7 -0
  14. package/dist/lib/node/index.cjs +2 -2
  15. package/dist/lib/node/meta.json +1 -1
  16. package/dist/types/src/components/DebugPanel.d.ts.map +1 -1
  17. package/dist/types/src/components/ScriptBlock/ScriptBlock.stories.d.ts +1 -4
  18. package/dist/types/src/components/ScriptBlock/ScriptBlock.stories.d.ts.map +1 -1
  19. package/dist/types/src/components/ScriptEditor.d.ts.map +1 -1
  20. package/dist/types/src/components/Toolbar.d.ts.map +1 -1
  21. package/dist/types/src/components/Toolbar.stories.d.ts +1 -3
  22. package/dist/types/src/components/Toolbar.stories.d.ts.map +1 -1
  23. package/dist/types/src/components/TypescriptEditor.d.ts +3 -4
  24. package/dist/types/src/components/TypescriptEditor.d.ts.map +1 -1
  25. package/dist/types/src/components/TypescriptEditor.stories.d.ts +1 -4
  26. package/dist/types/src/components/TypescriptEditor.stories.d.ts.map +1 -1
  27. package/dist/types/src/components/index.d.ts +1 -1
  28. package/package.json +35 -33
  29. package/src/components/DebugPanel.tsx +2 -16
  30. package/src/components/ScriptBlock/ScriptBlock.stories.tsx +27 -20
  31. package/src/components/ScriptEditor.tsx +18 -3
  32. package/src/components/Toolbar.stories.tsx +2 -4
  33. package/src/components/Toolbar.tsx +2 -1
  34. package/src/components/TypescriptEditor.stories.tsx +9 -12
  35. package/src/components/TypescriptEditor.tsx +15 -17
  36. package/dist/lib/browser/ScriptEditor-C6MMOFDI.mjs.map +0 -7
  37. package/dist/lib/browser/chunk-DX5CSOBP.mjs.map +0 -7
  38. package/dist/lib/node/ScriptEditor-XQESJORL.cjs.map +0 -7
  39. package/dist/lib/node/chunk-RXI576K3.cjs.map +0 -7
  40. /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,sBA4Gd,CAAC"}
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
- parameters: {
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;;;;;;;;AAMrB,wBAME;AAEF,eAAO,MAAM,OAAO;;;;;CAAmD,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
- } & Pick<UseTextEditorProps, 'initialValue' | 'extensions' | 'scrollTo' | 'selection'>;
10
- export declare const TypescriptEditor: ({ id, extensions, env, initialValue, scrollTo, selection, className, scrollPastEnd, }: TypescriptEditorProps) => React.JSX.Element;
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":"AAOA,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,GAAG,CAAC,EAAE,4BAA4B,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,GAAG,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC,CAAC;AAEvF,eAAO,MAAM,gBAAgB,0FAS1B,qBAAqB,sBAuCvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
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, extensions, env, initialValue, scrollTo, selection, className, scrollPastEnd, }: import("./TypescriptEditor").TypescriptEditorProps) => React.JSX.Element;
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":"AAeA,OAAO,aAAa,CAAC;AAErB,OAAO,KAAkB,MAAM,OAAO,CAAC;;;;;;;;;AAoCvC,wBAOE;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC"}
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, extensions, env, initialValue, scrollTo, selection, className, scrollPastEnd, }: import("./TypescriptEditor").TypescriptEditorProps) => React.JSX.Element>;
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-staging.a542fc9",
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-staging.a542fc9",
77
- "@dxos/client-protocol": "0.6.11-staging.a542fc9",
78
- "@dxos/crypto": "0.6.11-staging.a542fc9",
79
- "@dxos/client": "0.6.11-staging.a542fc9",
80
- "@dxos/echo-schema": "0.6.11-staging.a542fc9",
81
- "@dxos/invariant": "0.6.11-staging.a542fc9",
82
- "@dxos/keys": "0.6.11-staging.a542fc9",
83
- "@dxos/async": "0.6.11-staging.a542fc9",
84
- "@dxos/debug": "0.6.11-staging.a542fc9",
85
- "@dxos/log": "0.6.11-staging.a542fc9",
86
- "@dxos/plugin-client": "0.6.11-staging.a542fc9",
87
- "@dxos/plugin-explorer": "0.6.11-staging.a542fc9",
88
- "@dxos/plugin-graph": "0.6.11-staging.a542fc9",
89
- "@dxos/plugin-space": "0.6.11-staging.a542fc9",
90
- "@dxos/plugin-markdown": "0.6.11-staging.a542fc9",
91
- "@dxos/plugin-stack": "0.6.11-staging.a542fc9",
92
- "@dxos/plugin-theme": "0.6.11-staging.a542fc9",
93
- "@dxos/protocols": "0.6.11-staging.a542fc9",
94
- "@dxos/react-client": "0.6.11-staging.a542fc9",
95
- "@dxos/react-ui-editor": "0.6.11-staging.a542fc9",
96
- "@dxos/rpc": "0.6.11-staging.a542fc9",
97
- "@dxos/util": "0.6.11-staging.a542fc9",
98
- "@dxos/rpc-tunnel": "0.6.11-staging.a542fc9"
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/echo-generator": "0.6.11-staging.a542fc9",
109
- "@dxos/random": "0.6.11-staging.a542fc9",
110
- "@dxos/react-ui": "0.6.11-staging.a542fc9",
111
- "@dxos/react-ui-mosaic": "0.6.11-staging.a542fc9",
112
- "@dxos/storybook-utils": "0.6.11-staging.a542fc9",
113
- "@dxos/react-ui-theme": "0.6.11-staging.a542fc9"
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-staging.a542fc9",
120
- "@dxos/react-ui-mosaic": "0.6.11-staging.a542fc9",
121
- "@dxos/react-ui-theme": "0.6.11-staging.a542fc9"
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, createDocAccessor, createEchoObject } from '@dxos/react-client/echo';
13
- import { ClientRepeater } from '@dxos/react-client/testing';
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
- // TODO(dmaretskyi): Review what's the right way to create automerge-backed objects.
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
- [code],
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
- render: () => <ClientRepeater component={Story} createSpace />,
58
- decorators: [withTheme],
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 { create, createDocAccessor, Filter, getMeta, getSpace, useQuery } from '@dxos/react-client/echo';
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(role === 'article' && 'row-span-2', 'flex flex-col is-full bs-full overflow-hidden')}
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 border-b border-separator'
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
- // import React from 'react';
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
- parameters: {
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-want--regular' size={4} />
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
- } & Pick<UseTextEditorProps, 'initialValue' | 'extensions' | 'scrollTo' | 'selection'>;
27
+ env?: VirtualTypeScriptEnvironment;
28
+ } & Pick<UseTextEditorProps, 'className' | 'initialValue' | 'extensions' | 'scrollTo' | 'selection'>;
32
29
 
33
30
  export const TypescriptEditor = ({
34
31
  id,
35
- extensions,
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
- editorMonospace,
68
- javascript({ typescript: true }),
69
- // https://github.com/val-town/codemirror-ts
70
- env ? [tsFacet.of({ env, path: `/src/${id}.ts` }), tsSync(), tsLinter(), tsHover()] : [],
71
- autocomplete({ override: env ? [tsAutocomplete()] : [] }),
72
- InputModeExtensions.vscode,
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
- }