@arbidocs/blocks 0.4.8 → 0.4.10
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/README.md +9 -0
- package/dist/StreamedArtifactEditor-5BMNWSS4.cjs +106 -0
- package/dist/StreamedArtifactEditor-5BMNWSS4.cjs.map +1 -0
- package/dist/StreamedArtifactEditor-6ETUHNQN.js +104 -0
- package/dist/StreamedArtifactEditor-6ETUHNQN.js.map +1 -0
- package/dist/agents/index.cjs +163 -163
- package/dist/agents/index.js +6 -6
- package/dist/artifacts/ArtifactEditor.d.ts +24 -1
- package/dist/artifacts/ArtifactToolbar.d.ts +3 -1
- package/dist/artifacts/StreamedArtifactFrame.d.ts +36 -0
- package/dist/artifacts/editor/index.cjs +11 -82
- package/dist/artifacts/editor/index.cjs.map +1 -1
- package/dist/artifacts/editor/index.js +2 -83
- package/dist/artifacts/editor/index.js.map +1 -1
- package/dist/artifacts/index.cjs +92 -800
- package/dist/artifacts/index.cjs.map +1 -1
- package/dist/artifacts/index.d.ts +2 -1
- package/dist/artifacts/index.js +3 -784
- package/dist/artifacts/index.js.map +1 -1
- package/dist/chat/AssistantToaster.d.ts +8 -0
- package/dist/chat/index.cjs +68 -62
- package/dist/chat/index.d.ts +1 -0
- package/dist/chat/index.js +3 -1
- package/dist/{chunk-JLOYWXRB.js → chunk-557EU3G4.js} +3 -3
- package/dist/{chunk-JLOYWXRB.js.map → chunk-557EU3G4.js.map} +1 -1
- package/dist/chunk-BV7FEMSI.js +34 -0
- package/dist/chunk-BV7FEMSI.js.map +1 -0
- package/dist/{chunk-YP264PVL.js → chunk-D5BZVKIF.js} +6 -6
- package/dist/{chunk-YP264PVL.js.map → chunk-D5BZVKIF.js.map} +1 -1
- package/dist/{chunk-LRUCMZK6.cjs → chunk-D6XY3C4O.cjs} +4 -15
- package/dist/chunk-D6XY3C4O.cjs.map +1 -0
- package/dist/{chunk-YVIOCITQ.cjs → chunk-DCEI37AX.cjs} +3 -3
- package/dist/{chunk-YVIOCITQ.cjs.map → chunk-DCEI37AX.cjs.map} +1 -1
- package/dist/chunk-DTLOXXPN.js +831 -0
- package/dist/chunk-DTLOXXPN.js.map +1 -0
- package/dist/chunk-FX3K6LNZ.cjs +47 -0
- package/dist/chunk-FX3K6LNZ.cjs.map +1 -0
- package/dist/{chunk-QXEJXIP4.js → chunk-H7OD4CHN.js} +5 -16
- package/dist/chunk-H7OD4CHN.js.map +1 -0
- package/dist/chunk-HSFGOA6V.js +86 -0
- package/dist/chunk-HSFGOA6V.js.map +1 -0
- package/dist/{chunk-7OCFHEE6.js → chunk-ILOYJE63.js} +10 -3
- package/dist/chunk-ILOYJE63.js.map +1 -0
- package/dist/chunk-LOJVUGBJ.js +67 -0
- package/dist/chunk-LOJVUGBJ.js.map +1 -0
- package/dist/{chunk-QMDLPO3M.cjs → chunk-LXC5PTTI.cjs} +2 -2
- package/dist/{chunk-QMDLPO3M.cjs.map → chunk-LXC5PTTI.cjs.map} +1 -1
- package/dist/{chunk-G2E3O3HI.js → chunk-OJSWQM4G.js} +158 -5
- package/dist/chunk-OJSWQM4G.js.map +1 -0
- package/dist/chunk-PVK3GAMH.cjs +852 -0
- package/dist/chunk-PVK3GAMH.cjs.map +1 -0
- package/dist/chunk-QVBZESYQ.cjs +70 -0
- package/dist/chunk-QVBZESYQ.cjs.map +1 -0
- package/dist/{chunk-JG4TFS3Z.cjs → chunk-RGHQFJOL.cjs} +160 -2
- package/dist/chunk-RGHQFJOL.cjs.map +1 -0
- package/dist/{chunk-SY7UURF7.cjs → chunk-RMIACB7N.cjs} +6 -6
- package/dist/{chunk-SY7UURF7.cjs.map → chunk-RMIACB7N.cjs.map} +1 -1
- package/dist/chunk-RUNQFXPH.cjs +89 -0
- package/dist/chunk-RUNQFXPH.cjs.map +1 -0
- package/dist/chunk-SLSBJRWW.js +41 -0
- package/dist/chunk-SLSBJRWW.js.map +1 -0
- package/dist/chunk-XKSFJYOD.cjs +37 -0
- package/dist/chunk-XKSFJYOD.cjs.map +1 -0
- package/dist/{chunk-MGUHR3JI.cjs → chunk-YWSWRTGH.cjs} +10 -2
- package/dist/chunk-YWSWRTGH.cjs.map +1 -0
- package/dist/{chunk-EY2RJW27.js → chunk-ZJ6RIPFS.js} +2 -2
- package/dist/{chunk-EY2RJW27.js.map → chunk-ZJ6RIPFS.js.map} +1 -1
- package/dist/collaboration/contacts/ContactCard.d.ts +43 -0
- package/dist/collaboration/contacts/index.d.ts +2 -0
- package/dist/collaboration/contacts/vcard.d.ts +26 -0
- package/dist/collaboration/index.cjs +56 -36
- package/dist/collaboration/index.js +1 -1
- package/dist/connect/index.cjs +97 -23
- package/dist/connect/index.cjs.map +1 -1
- package/dist/connect/index.d.ts +1 -0
- package/dist/connect/index.js +79 -6
- package/dist/connect/index.js.map +1 -1
- package/dist/connection/StreamedArtifact.d.ts +43 -0
- package/dist/connection/StreamedArtifactEditor.d.ts +31 -0
- package/dist/facts/index.cjs +4 -3
- package/dist/facts/index.cjs.map +1 -1
- package/dist/facts/index.js +2 -1
- package/dist/facts/index.js.map +1 -1
- package/dist/files/index.cjs +10 -9
- package/dist/files/index.cjs.map +1 -1
- package/dist/files/index.js +7 -6
- package/dist/files/index.js.map +1 -1
- package/dist/index.cjs +650 -596
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +18 -16
- package/dist/index.js.map +1 -1
- package/dist/lib/use-media-query.d.ts +32 -0
- package/dist/settings/index.cjs +32 -32
- package/dist/settings/index.js +3 -3
- package/dist/shell/Toaster.d.ts +28 -0
- package/dist/shell/index.cjs +78 -48
- package/dist/shell/index.d.ts +2 -0
- package/dist/shell/index.js +5 -3
- package/dist/site/index.cjs +14 -14
- package/dist/site/index.js +2 -2
- package/dist/studio/index.cjs +3 -3
- package/dist/studio/index.js +3 -3
- package/dist/workspaces/index.cjs +12 -5
- package/dist/workspaces/index.cjs.map +1 -1
- package/dist/workspaces/index.js +13 -6
- package/dist/workspaces/index.js.map +1 -1
- package/package.json +3 -3
- package/dist/chunk-7OCFHEE6.js.map +0 -1
- package/dist/chunk-G2E3O3HI.js.map +0 -1
- package/dist/chunk-JG4TFS3Z.cjs.map +0 -1
- package/dist/chunk-LRUCMZK6.cjs.map +0 -1
- package/dist/chunk-MGUHR3JI.cjs.map +0 -1
- package/dist/chunk-QXEJXIP4.js.map +0 -1
package/README.md
CHANGED
|
@@ -148,6 +148,15 @@ Every part takes `labels` and `testIds`; Mod+S saves while editing; touch target
|
|
|
148
148
|
editor needs `@mdxeditor/editor` (optional peer) and is heavy (mount it behind `lazy`) and needs the global `Prism` defined before it loads (`@lexical/code` reads it while it evaluates): in the module that lazily imports the editor, import first a side-effect module with `import Prism from 'prismjs'; globalThis.Prism = Prism`. A library cannot order that reliably across bundlers.
|
|
149
149
|
See `examples/custom-ui/ArtifactPage.tsx` for a custom editing surface on in-memory data.
|
|
150
150
|
|
|
151
|
+
An agent's draft from stream to editor is one part: `StreamedArtifact` from
|
|
152
|
+
`@arbidocs/blocks/connect` shows the live canvas, then "Preparing editor..." while the finished
|
|
153
|
+
draft is stored and parsed, then the editor on the stored version (the presentational switch is
|
|
154
|
+
`StreamedArtifactFrame` in `/artifacts`; the phase comes from `useStreamedArtifact`).
|
|
155
|
+
|
|
156
|
+
```tsx
|
|
157
|
+
<StreamedArtifact artifacts={task.artifacts} workspaceId={workspaceId} busy={task.status === 'running'} error={task.error} />
|
|
158
|
+
```
|
|
159
|
+
|
|
151
160
|
## Editorial site parts
|
|
152
161
|
|
|
153
162
|
`@arbidocs/blocks/site` (and the root) carry the layout parts for static marketing pages:
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var chunkRUNQFXPH_cjs = require('./chunk-RUNQFXPH.cjs');
|
|
5
|
+
var chunkPVK3GAMH_cjs = require('./chunk-PVK3GAMH.cjs');
|
|
6
|
+
require('./chunk-QVBZESYQ.cjs');
|
|
7
|
+
require('./chunk-MHVNT4J3.cjs');
|
|
8
|
+
var react = require('react');
|
|
9
|
+
var lucideReact = require('lucide-react');
|
|
10
|
+
var ui = require('@arbidocs/react/ui');
|
|
11
|
+
var artifacts = require('@arbidocs/react/artifacts');
|
|
12
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
13
|
+
|
|
14
|
+
function StreamedArtifactEditor({
|
|
15
|
+
workspaceId,
|
|
16
|
+
docId,
|
|
17
|
+
title,
|
|
18
|
+
testId,
|
|
19
|
+
className,
|
|
20
|
+
editorProps,
|
|
21
|
+
onSaved,
|
|
22
|
+
onSaveError,
|
|
23
|
+
actions,
|
|
24
|
+
hideDefaultActions,
|
|
25
|
+
labels
|
|
26
|
+
}) {
|
|
27
|
+
const [openId, setOpenId] = react.useState(docId);
|
|
28
|
+
const s = artifacts.useArtifactSession({
|
|
29
|
+
workspaceId,
|
|
30
|
+
docId: openId,
|
|
31
|
+
title,
|
|
32
|
+
onSaved: ({ docId: next }) => {
|
|
33
|
+
if (next) setOpenId(next);
|
|
34
|
+
onSaved?.(next);
|
|
35
|
+
},
|
|
36
|
+
onSaveError
|
|
37
|
+
});
|
|
38
|
+
const copy = () => void navigator.clipboard.writeText(s.content);
|
|
39
|
+
const download = () => {
|
|
40
|
+
const url = URL.createObjectURL(new Blob([s.content], { type: "text/markdown" }));
|
|
41
|
+
const a = document.createElement("a");
|
|
42
|
+
a.href = url;
|
|
43
|
+
a.download = `${title.replace(/\.md$/i, "")}.md`;
|
|
44
|
+
a.click();
|
|
45
|
+
URL.revokeObjectURL(url);
|
|
46
|
+
};
|
|
47
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
48
|
+
"div",
|
|
49
|
+
{
|
|
50
|
+
className: ui.cn(
|
|
51
|
+
"flex min-h-[560px] flex-col rounded-xl border border-border bg-card",
|
|
52
|
+
className
|
|
53
|
+
),
|
|
54
|
+
"data-testid": testId,
|
|
55
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
56
|
+
chunkPVK3GAMH_cjs.ArtifactEditor,
|
|
57
|
+
{
|
|
58
|
+
...s.view,
|
|
59
|
+
className: "min-h-[560px] flex-1",
|
|
60
|
+
labels,
|
|
61
|
+
onOpenVersion: setOpenId,
|
|
62
|
+
renderMarkdown: artifacts.renderArtifactMarkdown,
|
|
63
|
+
editor: /* @__PURE__ */ jsxRuntime.jsx(chunkRUNQFXPH_cjs.ArtifactMarkdownEditor, { ...editorProps, ...s.editorProps }),
|
|
64
|
+
redline: /* @__PURE__ */ jsxRuntime.jsx(chunkPVK3GAMH_cjs.ArtifactRedlineView, { ...s.redlineProps, renderMarkdown: artifacts.renderArtifactMarkdown }),
|
|
65
|
+
actions: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
66
|
+
!hideDefaultActions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
67
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
68
|
+
ui.Button,
|
|
69
|
+
{
|
|
70
|
+
variant: "ghost",
|
|
71
|
+
size: "sm",
|
|
72
|
+
onClick: copy,
|
|
73
|
+
"data-testid": `${testId}-copy`,
|
|
74
|
+
className: "pointer-coarse:min-h-11",
|
|
75
|
+
children: [
|
|
76
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "size-4", "aria-hidden": true }),
|
|
77
|
+
" Copy"
|
|
78
|
+
]
|
|
79
|
+
}
|
|
80
|
+
),
|
|
81
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
82
|
+
ui.Button,
|
|
83
|
+
{
|
|
84
|
+
variant: "ghost",
|
|
85
|
+
size: "sm",
|
|
86
|
+
onClick: download,
|
|
87
|
+
"data-testid": `${testId}-download`,
|
|
88
|
+
className: "pointer-coarse:min-h-11",
|
|
89
|
+
children: [
|
|
90
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "size-4", "aria-hidden": true }),
|
|
91
|
+
" Download"
|
|
92
|
+
]
|
|
93
|
+
}
|
|
94
|
+
)
|
|
95
|
+
] }),
|
|
96
|
+
actions?.({ content: s.content, title })
|
|
97
|
+
] })
|
|
98
|
+
}
|
|
99
|
+
)
|
|
100
|
+
}
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
module.exports = StreamedArtifactEditor;
|
|
105
|
+
//# sourceMappingURL=StreamedArtifactEditor-5BMNWSS4.cjs.map
|
|
106
|
+
//# sourceMappingURL=StreamedArtifactEditor-5BMNWSS4.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/connection/StreamedArtifactEditor.tsx"],"names":["useState","useArtifactSession","jsx","cn","ArtifactEditor","renderArtifactMarkdown","ArtifactMarkdownEditor","ArtifactRedlineView","jsxs","Fragment","Button","Copy","Download"],"mappings":"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","file":"StreamedArtifactEditor-5BMNWSS4.cjs","sourcesContent":["import { useState, type ReactNode } from 'react'\nimport { Copy, Download } from 'lucide-react'\nimport { Button, cn } from '@arbidocs/react/ui'\nimport { renderArtifactMarkdown, useArtifactSession } from '@arbidocs/react/artifacts'\nimport { ArtifactEditor, ArtifactRedlineView, type ArtifactEditorLabels } from '../artifacts'\nimport {\n ArtifactMarkdownEditor,\n type ArtifactMarkdownEditorProps,\n} from '../artifacts/editor/ArtifactMarkdownEditor'\n\nexport interface StreamedArtifactEditorProps {\n workspaceId: string | undefined\n /** The stored first version (the lineage's root as far as this panel goes). */\n docId: string\n /** File name for the versions saved from here. */\n title: string\n testId: string\n className?: string\n /** Extra props of the rich-text editor (`dictation`, labels). */\n editorProps?: Partial<Omit<ArtifactMarkdownEditorProps, 'markdown' | 'onChange' | 'onNormalized'>>\n /** Called after a version is saved. */\n onSaved?: (docId: string | undefined) => void\n onSaveError?: (error: unknown) => void\n /** Extra header actions next to the toolbar. */\n actions?: (ctx: { content: string; title: string }) => ReactNode\n /** Hide the default Copy and Download buttons. */\n hideDefaultActions?: boolean\n labels?: Partial<ArtifactEditorLabels>\n}\n\n/**\n * The editing stage of `StreamedArtifact`: `ArtifactEditor` bound to `useArtifactSession`. It is\n * a separate module because it pulls the rich-text editor (Lexical), which must stay behind a\n * `lazy()` boundary.\n */\nexport default function StreamedArtifactEditor({\n workspaceId,\n docId,\n title,\n testId,\n className,\n editorProps,\n onSaved,\n onSaveError,\n actions,\n hideDefaultActions,\n labels,\n}: StreamedArtifactEditorProps) {\n const [openId, setOpenId] = useState(docId)\n const s = useArtifactSession({\n workspaceId,\n docId: openId,\n title,\n onSaved: ({ docId: next }) => {\n if (next) setOpenId(next)\n onSaved?.(next)\n },\n onSaveError,\n })\n\n const copy = () => void navigator.clipboard.writeText(s.content)\n const download = () => {\n const url = URL.createObjectURL(new Blob([s.content], { type: 'text/markdown' }))\n const a = document.createElement('a')\n a.href = url\n a.download = `${title.replace(/\\.md$/i, '')}.md`\n a.click()\n URL.revokeObjectURL(url)\n }\n\n return (\n <div\n className={cn(\n 'flex min-h-[560px] flex-col rounded-xl border border-border bg-card',\n className\n )}\n data-testid={testId}\n >\n <ArtifactEditor\n {...s.view}\n className=\"min-h-[560px] flex-1\"\n labels={labels}\n onOpenVersion={setOpenId}\n renderMarkdown={renderArtifactMarkdown}\n editor={<ArtifactMarkdownEditor {...editorProps} {...s.editorProps} />}\n redline={\n <ArtifactRedlineView {...s.redlineProps} renderMarkdown={renderArtifactMarkdown} />\n }\n actions={\n <>\n {!hideDefaultActions && (\n <>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={copy}\n data-testid={`${testId}-copy`}\n className=\"pointer-coarse:min-h-11\"\n >\n <Copy className=\"size-4\" aria-hidden /> Copy\n </Button>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={download}\n data-testid={`${testId}-download`}\n className=\"pointer-coarse:min-h-11\"\n >\n <Download className=\"size-4\" aria-hidden /> Download\n </Button>\n </>\n )}\n {actions?.({ content: s.content, title })}\n </>\n }\n />\n </div>\n )\n}\n"]}
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { ArtifactMarkdownEditor } from './chunk-HSFGOA6V.js';
|
|
3
|
+
import { ArtifactEditor, ArtifactRedlineView } from './chunk-DTLOXXPN.js';
|
|
4
|
+
import './chunk-LOJVUGBJ.js';
|
|
5
|
+
import './chunk-7F6CBP3Z.js';
|
|
6
|
+
import { useState } from 'react';
|
|
7
|
+
import { Copy, Download } from 'lucide-react';
|
|
8
|
+
import { Button, cn } from '@arbidocs/react/ui';
|
|
9
|
+
import { useArtifactSession, renderArtifactMarkdown } from '@arbidocs/react/artifacts';
|
|
10
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
11
|
+
|
|
12
|
+
function StreamedArtifactEditor({
|
|
13
|
+
workspaceId,
|
|
14
|
+
docId,
|
|
15
|
+
title,
|
|
16
|
+
testId,
|
|
17
|
+
className,
|
|
18
|
+
editorProps,
|
|
19
|
+
onSaved,
|
|
20
|
+
onSaveError,
|
|
21
|
+
actions,
|
|
22
|
+
hideDefaultActions,
|
|
23
|
+
labels
|
|
24
|
+
}) {
|
|
25
|
+
const [openId, setOpenId] = useState(docId);
|
|
26
|
+
const s = useArtifactSession({
|
|
27
|
+
workspaceId,
|
|
28
|
+
docId: openId,
|
|
29
|
+
title,
|
|
30
|
+
onSaved: ({ docId: next }) => {
|
|
31
|
+
if (next) setOpenId(next);
|
|
32
|
+
onSaved?.(next);
|
|
33
|
+
},
|
|
34
|
+
onSaveError
|
|
35
|
+
});
|
|
36
|
+
const copy = () => void navigator.clipboard.writeText(s.content);
|
|
37
|
+
const download = () => {
|
|
38
|
+
const url = URL.createObjectURL(new Blob([s.content], { type: "text/markdown" }));
|
|
39
|
+
const a = document.createElement("a");
|
|
40
|
+
a.href = url;
|
|
41
|
+
a.download = `${title.replace(/\.md$/i, "")}.md`;
|
|
42
|
+
a.click();
|
|
43
|
+
URL.revokeObjectURL(url);
|
|
44
|
+
};
|
|
45
|
+
return /* @__PURE__ */ jsx(
|
|
46
|
+
"div",
|
|
47
|
+
{
|
|
48
|
+
className: cn(
|
|
49
|
+
"flex min-h-[560px] flex-col rounded-xl border border-border bg-card",
|
|
50
|
+
className
|
|
51
|
+
),
|
|
52
|
+
"data-testid": testId,
|
|
53
|
+
children: /* @__PURE__ */ jsx(
|
|
54
|
+
ArtifactEditor,
|
|
55
|
+
{
|
|
56
|
+
...s.view,
|
|
57
|
+
className: "min-h-[560px] flex-1",
|
|
58
|
+
labels,
|
|
59
|
+
onOpenVersion: setOpenId,
|
|
60
|
+
renderMarkdown: renderArtifactMarkdown,
|
|
61
|
+
editor: /* @__PURE__ */ jsx(ArtifactMarkdownEditor, { ...editorProps, ...s.editorProps }),
|
|
62
|
+
redline: /* @__PURE__ */ jsx(ArtifactRedlineView, { ...s.redlineProps, renderMarkdown: renderArtifactMarkdown }),
|
|
63
|
+
actions: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
64
|
+
!hideDefaultActions && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
65
|
+
/* @__PURE__ */ jsxs(
|
|
66
|
+
Button,
|
|
67
|
+
{
|
|
68
|
+
variant: "ghost",
|
|
69
|
+
size: "sm",
|
|
70
|
+
onClick: copy,
|
|
71
|
+
"data-testid": `${testId}-copy`,
|
|
72
|
+
className: "pointer-coarse:min-h-11",
|
|
73
|
+
children: [
|
|
74
|
+
/* @__PURE__ */ jsx(Copy, { className: "size-4", "aria-hidden": true }),
|
|
75
|
+
" Copy"
|
|
76
|
+
]
|
|
77
|
+
}
|
|
78
|
+
),
|
|
79
|
+
/* @__PURE__ */ jsxs(
|
|
80
|
+
Button,
|
|
81
|
+
{
|
|
82
|
+
variant: "ghost",
|
|
83
|
+
size: "sm",
|
|
84
|
+
onClick: download,
|
|
85
|
+
"data-testid": `${testId}-download`,
|
|
86
|
+
className: "pointer-coarse:min-h-11",
|
|
87
|
+
children: [
|
|
88
|
+
/* @__PURE__ */ jsx(Download, { className: "size-4", "aria-hidden": true }),
|
|
89
|
+
" Download"
|
|
90
|
+
]
|
|
91
|
+
}
|
|
92
|
+
)
|
|
93
|
+
] }),
|
|
94
|
+
actions?.({ content: s.content, title })
|
|
95
|
+
] })
|
|
96
|
+
}
|
|
97
|
+
)
|
|
98
|
+
}
|
|
99
|
+
);
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
export { StreamedArtifactEditor as default };
|
|
103
|
+
//# sourceMappingURL=StreamedArtifactEditor-6ETUHNQN.js.map
|
|
104
|
+
//# sourceMappingURL=StreamedArtifactEditor-6ETUHNQN.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/connection/StreamedArtifactEditor.tsx"],"names":[],"mappings":"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","file":"StreamedArtifactEditor-6ETUHNQN.js","sourcesContent":["import { useState, type ReactNode } from 'react'\nimport { Copy, Download } from 'lucide-react'\nimport { Button, cn } from '@arbidocs/react/ui'\nimport { renderArtifactMarkdown, useArtifactSession } from '@arbidocs/react/artifacts'\nimport { ArtifactEditor, ArtifactRedlineView, type ArtifactEditorLabels } from '../artifacts'\nimport {\n ArtifactMarkdownEditor,\n type ArtifactMarkdownEditorProps,\n} from '../artifacts/editor/ArtifactMarkdownEditor'\n\nexport interface StreamedArtifactEditorProps {\n workspaceId: string | undefined\n /** The stored first version (the lineage's root as far as this panel goes). */\n docId: string\n /** File name for the versions saved from here. */\n title: string\n testId: string\n className?: string\n /** Extra props of the rich-text editor (`dictation`, labels). */\n editorProps?: Partial<Omit<ArtifactMarkdownEditorProps, 'markdown' | 'onChange' | 'onNormalized'>>\n /** Called after a version is saved. */\n onSaved?: (docId: string | undefined) => void\n onSaveError?: (error: unknown) => void\n /** Extra header actions next to the toolbar. */\n actions?: (ctx: { content: string; title: string }) => ReactNode\n /** Hide the default Copy and Download buttons. */\n hideDefaultActions?: boolean\n labels?: Partial<ArtifactEditorLabels>\n}\n\n/**\n * The editing stage of `StreamedArtifact`: `ArtifactEditor` bound to `useArtifactSession`. It is\n * a separate module because it pulls the rich-text editor (Lexical), which must stay behind a\n * `lazy()` boundary.\n */\nexport default function StreamedArtifactEditor({\n workspaceId,\n docId,\n title,\n testId,\n className,\n editorProps,\n onSaved,\n onSaveError,\n actions,\n hideDefaultActions,\n labels,\n}: StreamedArtifactEditorProps) {\n const [openId, setOpenId] = useState(docId)\n const s = useArtifactSession({\n workspaceId,\n docId: openId,\n title,\n onSaved: ({ docId: next }) => {\n if (next) setOpenId(next)\n onSaved?.(next)\n },\n onSaveError,\n })\n\n const copy = () => void navigator.clipboard.writeText(s.content)\n const download = () => {\n const url = URL.createObjectURL(new Blob([s.content], { type: 'text/markdown' }))\n const a = document.createElement('a')\n a.href = url\n a.download = `${title.replace(/\\.md$/i, '')}.md`\n a.click()\n URL.revokeObjectURL(url)\n }\n\n return (\n <div\n className={cn(\n 'flex min-h-[560px] flex-col rounded-xl border border-border bg-card',\n className\n )}\n data-testid={testId}\n >\n <ArtifactEditor\n {...s.view}\n className=\"min-h-[560px] flex-1\"\n labels={labels}\n onOpenVersion={setOpenId}\n renderMarkdown={renderArtifactMarkdown}\n editor={<ArtifactMarkdownEditor {...editorProps} {...s.editorProps} />}\n redline={\n <ArtifactRedlineView {...s.redlineProps} renderMarkdown={renderArtifactMarkdown} />\n }\n actions={\n <>\n {!hideDefaultActions && (\n <>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={copy}\n data-testid={`${testId}-copy`}\n className=\"pointer-coarse:min-h-11\"\n >\n <Copy className=\"size-4\" aria-hidden /> Copy\n </Button>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={download}\n data-testid={`${testId}-download`}\n className=\"pointer-coarse:min-h-11\"\n >\n <Download className=\"size-4\" aria-hidden /> Download\n </Button>\n </>\n )}\n {actions?.({ content: s.content, title })}\n </>\n }\n />\n </div>\n )\n}\n"]}
|