@arbidocs/blocks 0.4.9 → 0.4.11

package/README.md

@@ -148,6 +148,15 @@ Every part takes `labels` and `testIds`; Mod+S saves while editing; touch target
 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.
 See `examples/custom-ui/ArtifactPage.tsx` for a custom editing surface on in-memory data.
 
+An agent's draft from stream to editor is one part: `StreamedArtifact` from
+`@arbidocs/blocks/connect` shows the live canvas, then "Preparing editor..." while the finished
+draft is stored and parsed, then the editor on the stored version (the presentational switch is
+`StreamedArtifactFrame` in `/artifacts`; the phase comes from `useStreamedArtifact`).
+
+```tsx
+<StreamedArtifact artifacts={task.artifacts} workspaceId={workspaceId} busy={task.status === 'running'} error={task.error} />
+```
+
 ## Editorial site parts
 
 `@arbidocs/blocks/site` (and the root) carry the layout parts for static marketing pages:

package/dist/StreamedArtifactEditor-5BMNWSS4.cjs

@@ -0,0 +1,106 @@
+"use client";
+'use strict';
+
+var chunkRUNQFXPH_cjs = require('./chunk-RUNQFXPH.cjs');
+var chunkPVK3GAMH_cjs = require('./chunk-PVK3GAMH.cjs');
+require('./chunk-QVBZESYQ.cjs');
+require('./chunk-MHVNT4J3.cjs');
+var react = require('react');
+var lucideReact = require('lucide-react');
+var ui = require('@arbidocs/react/ui');
+var artifacts = require('@arbidocs/react/artifacts');
+var jsxRuntime = require('react/jsx-runtime');
+
+function StreamedArtifactEditor({
+  workspaceId,
+  docId,
+  title,
+  testId,
+  className,
+  editorProps,
+  onSaved,
+  onSaveError,
+  actions,
+  hideDefaultActions,
+  labels
+}) {
+  const [openId, setOpenId] = react.useState(docId);
+  const s = artifacts.useArtifactSession({
+    workspaceId,
+    docId: openId,
+    title,
+    onSaved: ({ docId: next }) => {
+      if (next) setOpenId(next);
+      onSaved?.(next);
+    },
+    onSaveError
+  });
+  const copy = () => void navigator.clipboard.writeText(s.content);
+  const download = () => {
+    const url = URL.createObjectURL(new Blob([s.content], { type: "text/markdown" }));
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `${title.replace(/\.md$/i, "")}.md`;
+    a.click();
+    URL.revokeObjectURL(url);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: ui.cn(
+        "flex min-h-[560px] flex-col rounded-xl border border-border bg-card",
+        className
+      ),
+      "data-testid": testId,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        chunkPVK3GAMH_cjs.ArtifactEditor,
+        {
+          ...s.view,
+          className: "min-h-[560px] flex-1",
+          labels,
+          onOpenVersion: setOpenId,
+          renderMarkdown: artifacts.renderArtifactMarkdown,
+          editor: /* @__PURE__ */ jsxRuntime.jsx(chunkRUNQFXPH_cjs.ArtifactMarkdownEditor, { ...editorProps, ...s.editorProps }),
+          redline: /* @__PURE__ */ jsxRuntime.jsx(chunkPVK3GAMH_cjs.ArtifactRedlineView, { ...s.redlineProps, renderMarkdown: artifacts.renderArtifactMarkdown }),
+          actions: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            !hideDefaultActions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                ui.Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: copy,
+                  "data-testid": `${testId}-copy`,
+                  className: "pointer-coarse:min-h-11",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "size-4", "aria-hidden": true }),
+                    " Copy"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                ui.Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: download,
+                  "data-testid": `${testId}-download`,
+                  className: "pointer-coarse:min-h-11",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "size-4", "aria-hidden": true }),
+                    " Download"
+                  ]
+                }
+              )
+            ] }),
+            actions?.({ content: s.content, title })
+          ] })
+        }
+      )
+    }
+  );
+}
+
+module.exports = StreamedArtifactEditor;
+//# sourceMappingURL=StreamedArtifactEditor-5BMNWSS4.cjs.map
+//# sourceMappingURL=StreamedArtifactEditor-5BMNWSS4.cjs.map

package/dist/StreamedArtifactEditor-5BMNWSS4.cjs.map

@@ -0,0 +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"]}

package/dist/StreamedArtifactEditor-6ETUHNQN.js

@@ -0,0 +1,104 @@
+"use client";
+import { ArtifactMarkdownEditor } from './chunk-HSFGOA6V.js';
+import { ArtifactEditor, ArtifactRedlineView } from './chunk-DTLOXXPN.js';
+import './chunk-LOJVUGBJ.js';
+import './chunk-7F6CBP3Z.js';
+import { useState } from 'react';
+import { Copy, Download } from 'lucide-react';
+import { Button, cn } from '@arbidocs/react/ui';
+import { useArtifactSession, renderArtifactMarkdown } from '@arbidocs/react/artifacts';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function StreamedArtifactEditor({
+  workspaceId,
+  docId,
+  title,
+  testId,
+  className,
+  editorProps,
+  onSaved,
+  onSaveError,
+  actions,
+  hideDefaultActions,
+  labels
+}) {
+  const [openId, setOpenId] = useState(docId);
+  const s = useArtifactSession({
+    workspaceId,
+    docId: openId,
+    title,
+    onSaved: ({ docId: next }) => {
+      if (next) setOpenId(next);
+      onSaved?.(next);
+    },
+    onSaveError
+  });
+  const copy = () => void navigator.clipboard.writeText(s.content);
+  const download = () => {
+    const url = URL.createObjectURL(new Blob([s.content], { type: "text/markdown" }));
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `${title.replace(/\.md$/i, "")}.md`;
+    a.click();
+    URL.revokeObjectURL(url);
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "flex min-h-[560px] flex-col rounded-xl border border-border bg-card",
+        className
+      ),
+      "data-testid": testId,
+      children: /* @__PURE__ */ jsx(
+        ArtifactEditor,
+        {
+          ...s.view,
+          className: "min-h-[560px] flex-1",
+          labels,
+          onOpenVersion: setOpenId,
+          renderMarkdown: renderArtifactMarkdown,
+          editor: /* @__PURE__ */ jsx(ArtifactMarkdownEditor, { ...editorProps, ...s.editorProps }),
+          redline: /* @__PURE__ */ jsx(ArtifactRedlineView, { ...s.redlineProps, renderMarkdown: renderArtifactMarkdown }),
+          actions: /* @__PURE__ */ jsxs(Fragment, { children: [
+            !hideDefaultActions && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: copy,
+                  "data-testid": `${testId}-copy`,
+                  className: "pointer-coarse:min-h-11",
+                  children: [
+                    /* @__PURE__ */ jsx(Copy, { className: "size-4", "aria-hidden": true }),
+                    " Copy"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: download,
+                  "data-testid": `${testId}-download`,
+                  className: "pointer-coarse:min-h-11",
+                  children: [
+                    /* @__PURE__ */ jsx(Download, { className: "size-4", "aria-hidden": true }),
+                    " Download"
+                  ]
+                }
+              )
+            ] }),
+            actions?.({ content: s.content, title })
+          ] })
+        }
+      )
+    }
+  );
+}
+
+export { StreamedArtifactEditor as default };
+//# sourceMappingURL=StreamedArtifactEditor-6ETUHNQN.js.map
+//# sourceMappingURL=StreamedArtifactEditor-6ETUHNQN.js.map

package/dist/StreamedArtifactEditor-6ETUHNQN.js.map

@@ -0,0 +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"]}

package/dist/artifacts/ArtifactEditor.d.ts

@@ -5,13 +5,28 @@ import type { RenderMarkdown } from './ArtifactRedlineView';
 import { type ArtifactToolbarLabels } from './ArtifactToolbar';
 import { type ArtifactVersionBarLabels, type ArtifactVersionBarTestIds } from './ArtifactVersionBar';
 import type { VersionEntry } from './VersionTimeline';
+/** Whether the artifact's text is available (`ArtifactTextStatus` of `@arbidocs/react/artifacts`). */
+export type ArtifactEditorStatus = 'loading' | 'parsing' | 'ready' | 'error';
+export interface ArtifactEditorStatusLabels {
+    /** Shown while the backend is still parsing a fresh upload. */
+    preparing: string;
+    error: string;
+    retry: string;
+}
+export declare const DEFAULT_ARTIFACT_EDITOR_STATUS_LABELS: ArtifactEditorStatusLabels;
 export interface ArtifactEditorLabels {
+    status: Partial<ArtifactEditorStatusLabels>;
     toolbar: Partial<ArtifactToolbarLabels>;
     versions: Partial<ArtifactVersionBarLabels>;
     compare: Partial<ArtifactCompareBarLabels>;
 }
 export interface ArtifactEditorTestIds {
     root: string;
+    /** The "Preparing editor" state. */
+    preparing: string;
+    /** The error state and its retry button. */
+    error: string;
+    retry: string;
     compareRow: string;
     body: Partial<ArtifactEditorBodyTestIds>;
     versions: Partial<ArtifactVersionBarTestIds>;
@@ -31,6 +46,14 @@ export interface ArtifactEditorProps {
     /** The version being compared against. */
     compareId?: string | null;
     showTrackChanges: boolean;
+    /**
+     * Whether the text is available. While `loading` or `parsing` the body is a "Preparing editor"
+     * state (the toolbar is disabled: an editor on an empty baseline would save a blank version);
+     * `error` shows `labels.status.error` with Retry (`onRetry`). Default `ready`.
+     */
+    status?: ArtifactEditorStatus;
+    /** Ask for the text again after an `error`. */
+    onRetry?: () => void;
     /** The lineage, oldest first. The version bar shows only for two or more. */
     versions?: VersionEntry[];
     currentVersionId?: string;
@@ -61,4 +84,4 @@ export interface ArtifactEditorProps {
  * changes). Everything is view-model driven: a host binds state with `useArtifactSession` from
  * `@arbidocs/react/artifacts` and passes the editor and redline as slots.
  */
-export declare function ArtifactEditor({ content, isEditing, hasChanges, isSaving, isDraft, compact, canCompare, comparing, compareId, showTrackChanges, versions, currentVersionId, onStartEdit, onCancel, onSave, onCompare, onStopCompare, onToggleTrackChanges, onOpenVersion, formatDate, editor, redline, renderMarkdown, actions, className, labels, testIds, }: ArtifactEditorProps): import("react").JSX.Element;
+export declare function ArtifactEditor({ content, isEditing, hasChanges, isSaving, isDraft, compact, canCompare, comparing, compareId, showTrackChanges, status, onRetry, versions, currentVersionId, onStartEdit, onCancel, onSave, onCompare, onStopCompare, onToggleTrackChanges, onOpenVersion, formatDate, editor, redline, renderMarkdown, actions, className, labels, testIds, }: ArtifactEditorProps): import("react").JSX.Element;

package/dist/artifacts/ArtifactToolbar.d.ts

@@ -36,6 +36,8 @@ export interface ArtifactToolbarProps {
     /** Offer "Compare against the previous version". */
     canCompare: boolean;
     onStartEdit: () => void;
+    /** Edit is not offered yet (the text is still being prepared). */
+    editDisabled?: boolean;
     /** Discard the buffer and leave edit mode. */
     onCancel: () => void;
     onCompare: () => void;
@@ -50,4 +52,4 @@ export interface ArtifactToolbarProps {
  * once there is something to save; a dot marks unsaved changes and a polite status announces them.
  * Touch targets are 44px on coarse pointers.
  */
-export declare function ArtifactToolbar({ isEditing, isDraft, compact, hasChanges, isSaving, canCompare, onStartEdit, onCancel, onCompare, onSave, className, labels, testIds, }: ArtifactToolbarProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export declare function ArtifactToolbar({ isEditing, isDraft, compact, hasChanges, isSaving, canCompare, editDisabled, onStartEdit, onCancel, onCompare, onSave, className, labels, testIds, }: ArtifactToolbarProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/dist/artifacts/StreamedArtifactFrame.d.ts

@@ -0,0 +1,36 @@
+import type { ReactNode } from 'react';
+/** `StreamedArtifactPhase` of `@arbidocs/react/artifacts`. */
+export type StreamedArtifactFramePhase = 'streaming' | 'persisting' | 'parsing' | 'ready' | 'error';
+export interface StreamedArtifactFrameLabels {
+    preparing: string;
+    error: string;
+    retry: string;
+}
+export declare const DEFAULT_STREAMED_ARTIFACT_FRAME_LABELS: StreamedArtifactFrameLabels;
+export interface StreamedArtifactFrameTestIds {
+    /** The "Preparing editor" wrapper (`persisting` and `parsing`). */
+    preparing: string;
+    error: string;
+    retry: string;
+}
+export interface StreamedArtifactFrameProps {
+    phase: StreamedArtifactFramePhase;
+    /** The live canvas: shown while streaming, and kept in view under the status while preparing. */
+    canvas: ReactNode;
+    /** The editor, mounted only when `phase` is `ready`. */
+    children: ReactNode;
+    /** Why it failed (shown under the message). */
+    error?: string | null;
+    onRetry?: () => void;
+    className?: string;
+    labels?: Partial<StreamedArtifactFrameLabels>;
+    testIds?: Partial<StreamedArtifactFrameTestIds>;
+}
+/**
+ * The STREAM -> PERSIST -> EDIT switch of an agent-drafted artifact, presentational. The live
+ * `canvas` while the agent streams; "Preparing editor..." (a polite status above the canvas, so
+ * the draft stays readable) while the draft is stored and parsed; the editor (`children`) when it
+ * is ready; an alert with Retry when storing or parsing failed. The connected version is
+ * `StreamedArtifact` in `@arbidocs/blocks/connect`.
+ */
+export declare function StreamedArtifactFrame({ phase, canvas, children, error, onRetry, className, labels, testIds, }: StreamedArtifactFrameProps): import("react").JSX.Element;

package/dist/artifacts/editor/index.cjs

@@ -1,89 +1,18 @@
 "use client";
 'use strict';
 
-var chunkMHVNT4J3_cjs = require('../../chunk-MHVNT4J3.cjs');
-var react = require('react');
-var editor = require('@mdxeditor/editor');
-var jsxRuntime = require('react/jsx-runtime');
+var chunkRUNQFXPH_cjs = require('../../chunk-RUNQFXPH.cjs');
+require('../../chunk-MHVNT4J3.cjs');
 
-function DictationSlot({
-  render
-}) {
-  const insertMarkdown = editor.usePublisher(editor.insertMarkdown$);
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: render(insertMarkdown) });
-}
-var DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS = {
-  editor: "Document editor",
-  placeholder: "Start typing\u2026"
-};
-function ArtifactMarkdownEditor({
-  markdown,
-  onChange,
-  onNormalized,
-  dictation,
-  labels,
-  testId
-}) {
-  const l = { ...DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS, ...labels };
-  const ref = react.useRef(null);
-  const pendingNormalizationRef = react.useRef(true);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      role: "group",
-      "aria-label": l.editor,
-      "data-testid": chunkMHVNT4J3_cjs.testIdOr(testId, { testId: "artifact-markdown-editor" }),
-      className: "h-full pointer-coarse:[&_[role=toolbar]_button]:min-h-11 pointer-coarse:[&_[role=toolbar]_button]:min-w-11",
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        editor.MDXEditor,
-        {
-          ref,
-          markdown,
-          onChange: (next) => {
-            if (pendingNormalizationRef.current) {
-              pendingNormalizationRef.current = false;
-              onNormalized?.(next);
-            }
-            onChange(next);
-          },
-          contentEditableClassName: "markdown-content max-w-none px-6 py-4 outline-none min-h-full",
-          className: "h-full overflow-auto bg-background",
-          placeholder: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: l.placeholder }),
-          plugins: [
-            editor.headingsPlugin(),
-            editor.listsPlugin(),
-            editor.quotePlugin(),
-            editor.thematicBreakPlugin(),
-            editor.linkPlugin(),
-            editor.linkDialogPlugin(),
-            editor.tablePlugin(),
-            editor.markdownShortcutPlugin(),
-            editor.toolbarPlugin({
-              toolbarContents: () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(editor.UndoRedo, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.Separator, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.BoldItalicUnderlineToggles, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.Separator, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.BlockTypeSelect, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.ListsToggle, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.Separator, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.CreateLink, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.InsertTable, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(editor.InsertThematicBreak, {}),
-                dictation && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(editor.Separator, {}),
-                  /* @__PURE__ */ jsxRuntime.jsx(DictationSlot, { render: dictation })
-                ] })
-              ] })
-            })
-          ]
-        }
-      )
-    }
-  );
-}
 
-exports.ArtifactMarkdownEditor = ArtifactMarkdownEditor;
-exports.DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS = DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS;
+
+Object.defineProperty(exports, "ArtifactMarkdownEditor", {
+  enumerable: true,
+  get: function () { return chunkRUNQFXPH_cjs.ArtifactMarkdownEditor; }
+});
+Object.defineProperty(exports, "DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS", {
+  enumerable: true,
+  get: function () { return chunkRUNQFXPH_cjs.DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS; }
+});
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/artifacts/editor/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/artifacts/editor/ArtifactMarkdownEditor.tsx"],"names":["usePublisher","insertMarkdown$","jsx","Fragment","useRef","testIdOr","MDXEditor","headingsPlugin","listsPlugin","quotePlugin","thematicBreakPlugin","linkPlugin","linkDialogPlugin","tablePlugin","markdownShortcutPlugin","toolbarPlugin","jsxs","UndoRedo","Separator","BoldItalicUnderlineToggles","BlockTypeSelect","ListsToggle","CreateLink","InsertTable","InsertThematicBreak"],"mappings":"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","file":"index.cjs","sourcesContent":["import { useRef, type ReactNode } from 'react'\nimport {\n  MDXEditor,\n  type MDXEditorMethods,\n  headingsPlugin,\n  listsPlugin,\n  quotePlugin,\n  thematicBreakPlugin,\n  linkPlugin,\n  linkDialogPlugin,\n  tablePlugin,\n  markdownShortcutPlugin,\n  toolbarPlugin,\n  UndoRedo,\n  BoldItalicUnderlineToggles,\n  BlockTypeSelect,\n  ListsToggle,\n  CreateLink,\n  InsertTable,\n  InsertThematicBreak,\n  Separator,\n  insertMarkdown$,\n  usePublisher,\n} from '@mdxeditor/editor'\nimport { testIdOr } from '../../chat/test-id'\n\n/** Renders the host's dictation control; `insert` puts text at the cursor. */\nfunction DictationSlot({\n  render,\n}: {\n  render: (insert: (markdown: string) => void) => ReactNode\n}): React.ReactElement {\n  const insertMarkdown = usePublisher(insertMarkdown$)\n  return <>{render(insertMarkdown)}</>\n}\n\nexport interface ArtifactMarkdownEditorLabels {\n  /** The accessible name of the editor region. */\n  editor: string\n  placeholder: string\n}\n\nexport const DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS: ArtifactMarkdownEditorLabels = {\n  editor: 'Document editor',\n  placeholder: 'Start typing…',\n}\n\nexport interface ArtifactMarkdownEditorProps {\n  /** Current markdown (controlled by the parent). */\n  markdown: string\n  /** Called with the new markdown whenever the document changes. */\n  onChange: (markdown: string) => void\n  /**\n   * Fired exactly once per editor instance, with the markdown the editor produces on mount.\n   * MDXEditor canonicalises the source as it parses (table padding, escapes, thematic-break\n   * style), so the first `onChange` after mount is the round-tripped form of the input, not a\n   * user edit. Use it to adopt the normalised form as the baseline so entering edit mode does\n   * not look dirty. Remount via `key` to receive it for the next document.\n   */\n  onNormalized?: (normalized: string) => void\n  /**\n   * A dictation control for the toolbar (the host owns recording and transcription, for example\n   * `@arbidocs/react`'s `InlineMicButton`). It gets a function that inserts text at the cursor.\n   */\n  dictation?: (insert: (markdown: string) => void) => ReactNode\n  labels?: Partial<ArtifactMarkdownEditorLabels>\n  testId?: string\n}\n\n/**\n * WYSIWYG editor for artifact documents: the user edits the rendered document directly and the\n * editor round-trips Markdown, so `onChange` always yields markdown a save can persist unchanged.\n *\n *\n * Heavy (Lexical via MDXEditor): mount it behind a lazy boundary. The host imports\n * `@mdxeditor/editor/style.css` once and, from the module that lazily imports this one, a module\n * that defines the global `Prism` FIRST (assign the prismjs core to `globalThis.Prism`):\n * `@lexical/code` reads it while it evaluates, and a library cannot order that in every bundler.\n */\nexport function ArtifactMarkdownEditor({\n  markdown,\n  onChange,\n  onNormalized,\n  dictation,\n  labels,\n  testId,\n}: ArtifactMarkdownEditorProps): React.ReactElement {\n  const l = { ...DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS, ...labels }\n  const ref = useRef<MDXEditorMethods>(null)\n  // Latched until MDXEditor fires its first onChange after mount: that is the canonicalisation\n  // round-trip, not a user edit.\n  const pendingNormalizationRef = useRef(true)\n\n  return (\n    <div\n      role=\"group\"\n      aria-label={l.editor}\n      data-testid={testIdOr(testId, { testId: 'artifact-markdown-editor' })}\n      className=\"h-full pointer-coarse:[&_[role=toolbar]_button]:min-h-11 pointer-coarse:[&_[role=toolbar]_button]:min-w-11\"\n    >\n      <MDXEditor\n        ref={ref}\n        markdown={markdown}\n        onChange={(next) => {\n          if (pendingNormalizationRef.current) {\n            pendingNormalizationRef.current = false\n            onNormalized?.(next)\n          }\n          onChange(next)\n        }}\n        contentEditableClassName=\"markdown-content max-w-none px-6 py-4 outline-none min-h-full\"\n        className=\"h-full overflow-auto bg-background\"\n        placeholder={<span className=\"text-muted-foreground\">{l.placeholder}</span>}\n        plugins={[\n          headingsPlugin(),\n          listsPlugin(),\n          quotePlugin(),\n          thematicBreakPlugin(),\n          linkPlugin(),\n          linkDialogPlugin(),\n          tablePlugin(),\n          markdownShortcutPlugin(),\n          toolbarPlugin({\n            toolbarContents: () => (\n              <>\n                <UndoRedo />\n                <Separator />\n                <BoldItalicUnderlineToggles />\n                <Separator />\n                <BlockTypeSelect />\n                <ListsToggle />\n                <Separator />\n                <CreateLink />\n                <InsertTable />\n                <InsertThematicBreak />\n                {dictation && (\n                  <>\n                    <Separator />\n                    <DictationSlot render={dictation} />\n                  </>\n                )}\n              </>\n            ),\n          }),\n        ]}\n      />\n    </div>\n  )\n}\n"]}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs"}

package/dist/artifacts/editor/index.js

@@ -1,86 +1,5 @@
 "use client";
-import { testIdOr } from '../../chunk-7F6CBP3Z.js';
-import { useRef } from 'react';
-import { MDXEditor, headingsPlugin, listsPlugin, quotePlugin, thematicBreakPlugin, linkPlugin, linkDialogPlugin, tablePlugin, markdownShortcutPlugin, toolbarPlugin, UndoRedo, Separator, BoldItalicUnderlineToggles, BlockTypeSelect, ListsToggle, CreateLink, InsertTable, InsertThematicBreak, usePublisher, insertMarkdown$ } from '@mdxeditor/editor';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-
-function DictationSlot({
-  render
-}) {
-  const insertMarkdown = usePublisher(insertMarkdown$);
-  return /* @__PURE__ */ jsx(Fragment, { children: render(insertMarkdown) });
-}
-var DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS = {
-  editor: "Document editor",
-  placeholder: "Start typing\u2026"
-};
-function ArtifactMarkdownEditor({
-  markdown,
-  onChange,
-  onNormalized,
-  dictation,
-  labels,
-  testId
-}) {
-  const l = { ...DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS, ...labels };
-  const ref = useRef(null);
-  const pendingNormalizationRef = useRef(true);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      role: "group",
-      "aria-label": l.editor,
-      "data-testid": testIdOr(testId, { testId: "artifact-markdown-editor" }),
-      className: "h-full pointer-coarse:[&_[role=toolbar]_button]:min-h-11 pointer-coarse:[&_[role=toolbar]_button]:min-w-11",
-      children: /* @__PURE__ */ jsx(
-        MDXEditor,
-        {
-          ref,
-          markdown,
-          onChange: (next) => {
-            if (pendingNormalizationRef.current) {
-              pendingNormalizationRef.current = false;
-              onNormalized?.(next);
-            }
-            onChange(next);
-          },
-          contentEditableClassName: "markdown-content max-w-none px-6 py-4 outline-none min-h-full",
-          className: "h-full overflow-auto bg-background",
-          placeholder: /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: l.placeholder }),
-          plugins: [
-            headingsPlugin(),
-            listsPlugin(),
-            quotePlugin(),
-            thematicBreakPlugin(),
-            linkPlugin(),
-            linkDialogPlugin(),
-            tablePlugin(),
-            markdownShortcutPlugin(),
-            toolbarPlugin({
-              toolbarContents: () => /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(UndoRedo, {}),
-                /* @__PURE__ */ jsx(Separator, {}),
-                /* @__PURE__ */ jsx(BoldItalicUnderlineToggles, {}),
-                /* @__PURE__ */ jsx(Separator, {}),
-                /* @__PURE__ */ jsx(BlockTypeSelect, {}),
-                /* @__PURE__ */ jsx(ListsToggle, {}),
-                /* @__PURE__ */ jsx(Separator, {}),
-                /* @__PURE__ */ jsx(CreateLink, {}),
-                /* @__PURE__ */ jsx(InsertTable, {}),
-                /* @__PURE__ */ jsx(InsertThematicBreak, {}),
-                dictation && /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Separator, {}),
-                  /* @__PURE__ */ jsx(DictationSlot, { render: dictation })
-                ] })
-              ] })
-            })
-          ]
-        }
-      )
-    }
-  );
-}
-
-export { ArtifactMarkdownEditor, DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS };
+export { ArtifactMarkdownEditor, DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS } from '../../chunk-HSFGOA6V.js';
+import '../../chunk-7F6CBP3Z.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/artifacts/editor/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/artifacts/editor/ArtifactMarkdownEditor.tsx"],"names":[],"mappings":";;;;;AA2BA,SAAS,aAAA,CAAc;AAAA,EACrB;AACF,CAAA,EAEuB;AACrB,EAAA,MAAM,cAAA,GAAiB,aAAa,eAAe,CAAA;AACnD,EAAA,uBAAO,GAAA,CAAA,QAAA,EAAA,EAAG,QAAA,EAAA,MAAA,CAAO,cAAc,CAAA,EAAE,CAAA;AACnC;AAQO,IAAM,uCAAA,GAAwE;AAAA,EACnF,MAAA,EAAQ,iBAAA;AAAA,EACR,WAAA,EAAa;AACf;AAkCO,SAAS,sBAAA,CAAuB;AAAA,EACrC,QAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAAoD;AAClD,EAAA,MAAM,CAAA,GAAI,EAAE,GAAG,uCAAA,EAAyC,GAAG,MAAA,EAAO;AAClE,EAAA,MAAM,GAAA,GAAM,OAAyB,IAAI,CAAA;AAGzC,EAAA,MAAM,uBAAA,GAA0B,OAAO,IAAI,CAAA;AAE3C,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,OAAA;AAAA,MACL,cAAY,CAAA,CAAE,MAAA;AAAA,MACd,eAAa,QAAA,CAAS,MAAA,EAAQ,EAAE,MAAA,EAAQ,4BAA4B,CAAA;AAAA,MACpE,SAAA,EAAU,4GAAA;AAAA,MAEV,QAAA,kBAAA,GAAA;AAAA,QAAC,SAAA;AAAA,QAAA;AAAA,UACC,GAAA;AAAA,UACA,QAAA;AAAA,UACA,QAAA,EAAU,CAAC,IAAA,KAAS;AAClB,YAAA,IAAI,wBAAwB,OAAA,EAAS;AACnC,cAAA,uBAAA,CAAwB,OAAA,GAAU,KAAA;AAClC,cAAA,YAAA,GAAe,IAAI,CAAA;AAAA,YACrB;AACA,YAAA,QAAA,CAAS,IAAI,CAAA;AAAA,UACf,CAAA;AAAA,UACA,wBAAA,EAAyB,+DAAA;AAAA,UACzB,SAAA,EAAU,oCAAA;AAAA,UACV,6BAAa,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uBAAA,EAAyB,YAAE,WAAA,EAAY,CAAA;AAAA,UACpE,OAAA,EAAS;AAAA,YACP,cAAA,EAAe;AAAA,YACf,WAAA,EAAY;AAAA,YACZ,WAAA,EAAY;AAAA,YACZ,mBAAA,EAAoB;AAAA,YACpB,UAAA,EAAW;AAAA,YACX,gBAAA,EAAiB;AAAA,YACjB,WAAA,EAAY;AAAA,YACZ,sBAAA,EAAuB;AAAA,YACvB,aAAA,CAAc;AAAA,cACZ,eAAA,EAAiB,sBACf,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,QAAA,EAAA,EAAS,CAAA;AAAA,oCACT,SAAA,EAAA,EAAU,CAAA;AAAA,oCACV,0BAAA,EAAA,EAA2B,CAAA;AAAA,oCAC3B,SAAA,EAAA,EAAU,CAAA;AAAA,oCACV,eAAA,EAAA,EAAgB,CAAA;AAAA,oCAChB,WAAA,EAAA,EAAY,CAAA;AAAA,oCACZ,SAAA,EAAA,EAAU,CAAA;AAAA,oCACV,UAAA,EAAA,EAAW,CAAA;AAAA,oCACX,WAAA,EAAA,EAAY,CAAA;AAAA,oCACZ,mBAAA,EAAA,EAAoB,CAAA;AAAA,gBACpB,6BACC,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,kCAAA,GAAA,CAAC,SAAA,EAAA,EAAU,CAAA;AAAA,kCACX,GAAA,CAAC,aAAA,EAAA,EAAc,MAAA,EAAQ,SAAA,EAAW;AAAA,iBAAA,EACpC;AAAA,eAAA,EAEJ;AAAA,aAEH;AAAA;AACH;AAAA;AACF;AAAA,GACF;AAEJ","file":"index.js","sourcesContent":["import { useRef, type ReactNode } from 'react'\nimport {\n  MDXEditor,\n  type MDXEditorMethods,\n  headingsPlugin,\n  listsPlugin,\n  quotePlugin,\n  thematicBreakPlugin,\n  linkPlugin,\n  linkDialogPlugin,\n  tablePlugin,\n  markdownShortcutPlugin,\n  toolbarPlugin,\n  UndoRedo,\n  BoldItalicUnderlineToggles,\n  BlockTypeSelect,\n  ListsToggle,\n  CreateLink,\n  InsertTable,\n  InsertThematicBreak,\n  Separator,\n  insertMarkdown$,\n  usePublisher,\n} from '@mdxeditor/editor'\nimport { testIdOr } from '../../chat/test-id'\n\n/** Renders the host's dictation control; `insert` puts text at the cursor. */\nfunction DictationSlot({\n  render,\n}: {\n  render: (insert: (markdown: string) => void) => ReactNode\n}): React.ReactElement {\n  const insertMarkdown = usePublisher(insertMarkdown$)\n  return <>{render(insertMarkdown)}</>\n}\n\nexport interface ArtifactMarkdownEditorLabels {\n  /** The accessible name of the editor region. */\n  editor: string\n  placeholder: string\n}\n\nexport const DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS: ArtifactMarkdownEditorLabels = {\n  editor: 'Document editor',\n  placeholder: 'Start typing…',\n}\n\nexport interface ArtifactMarkdownEditorProps {\n  /** Current markdown (controlled by the parent). */\n  markdown: string\n  /** Called with the new markdown whenever the document changes. */\n  onChange: (markdown: string) => void\n  /**\n   * Fired exactly once per editor instance, with the markdown the editor produces on mount.\n   * MDXEditor canonicalises the source as it parses (table padding, escapes, thematic-break\n   * style), so the first `onChange` after mount is the round-tripped form of the input, not a\n   * user edit. Use it to adopt the normalised form as the baseline so entering edit mode does\n   * not look dirty. Remount via `key` to receive it for the next document.\n   */\n  onNormalized?: (normalized: string) => void\n  /**\n   * A dictation control for the toolbar (the host owns recording and transcription, for example\n   * `@arbidocs/react`'s `InlineMicButton`). It gets a function that inserts text at the cursor.\n   */\n  dictation?: (insert: (markdown: string) => void) => ReactNode\n  labels?: Partial<ArtifactMarkdownEditorLabels>\n  testId?: string\n}\n\n/**\n * WYSIWYG editor for artifact documents: the user edits the rendered document directly and the\n * editor round-trips Markdown, so `onChange` always yields markdown a save can persist unchanged.\n *\n *\n * Heavy (Lexical via MDXEditor): mount it behind a lazy boundary. The host imports\n * `@mdxeditor/editor/style.css` once and, from the module that lazily imports this one, a module\n * that defines the global `Prism` FIRST (assign the prismjs core to `globalThis.Prism`):\n * `@lexical/code` reads it while it evaluates, and a library cannot order that in every bundler.\n */\nexport function ArtifactMarkdownEditor({\n  markdown,\n  onChange,\n  onNormalized,\n  dictation,\n  labels,\n  testId,\n}: ArtifactMarkdownEditorProps): React.ReactElement {\n  const l = { ...DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS, ...labels }\n  const ref = useRef<MDXEditorMethods>(null)\n  // Latched until MDXEditor fires its first onChange after mount: that is the canonicalisation\n  // round-trip, not a user edit.\n  const pendingNormalizationRef = useRef(true)\n\n  return (\n    <div\n      role=\"group\"\n      aria-label={l.editor}\n      data-testid={testIdOr(testId, { testId: 'artifact-markdown-editor' })}\n      className=\"h-full pointer-coarse:[&_[role=toolbar]_button]:min-h-11 pointer-coarse:[&_[role=toolbar]_button]:min-w-11\"\n    >\n      <MDXEditor\n        ref={ref}\n        markdown={markdown}\n        onChange={(next) => {\n          if (pendingNormalizationRef.current) {\n            pendingNormalizationRef.current = false\n            onNormalized?.(next)\n          }\n          onChange(next)\n        }}\n        contentEditableClassName=\"markdown-content max-w-none px-6 py-4 outline-none min-h-full\"\n        className=\"h-full overflow-auto bg-background\"\n        placeholder={<span className=\"text-muted-foreground\">{l.placeholder}</span>}\n        plugins={[\n          headingsPlugin(),\n          listsPlugin(),\n          quotePlugin(),\n          thematicBreakPlugin(),\n          linkPlugin(),\n          linkDialogPlugin(),\n          tablePlugin(),\n          markdownShortcutPlugin(),\n          toolbarPlugin({\n            toolbarContents: () => (\n              <>\n                <UndoRedo />\n                <Separator />\n                <BoldItalicUnderlineToggles />\n                <Separator />\n                <BlockTypeSelect />\n                <ListsToggle />\n                <Separator />\n                <CreateLink />\n                <InsertTable />\n                <InsertThematicBreak />\n                {dictation && (\n                  <>\n                    <Separator />\n                    <DictationSlot render={dictation} />\n                  </>\n                )}\n              </>\n            ),\n          }),\n        ]}\n      />\n    </div>\n  )\n}\n"]}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}