@arbidocs/blocks 0.4.12 → 0.4.13

package/dist/{chunk-HSFGOA6V.js → chunk-NEFHQHQV.js}

@@ -1,7 +1,7 @@
 "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 { MDXEditor, headingsPlugin, listsPlugin, quotePlugin, thematicBreakPlugin, linkPlugin, linkDialogPlugin, tablePlugin, codeBlockPlugin, markdownShortcutPlugin, toolbarPlugin, UndoRedo, Separator, BoldItalicUnderlineToggles, BlockTypeSelect, ListsToggle, CreateLink, InsertTable, InsertThematicBreak, useCodeBlockEditorContext, usePublisher, insertMarkdown$ } from '@mdxeditor/editor';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 function DictationSlot({
@@ -10,6 +10,20 @@ function DictationSlot({
   const insertMarkdown = usePublisher(insertMarkdown$);
   return /* @__PURE__ */ jsx(Fragment, { children: render(insertMarkdown) });
 }
+function PlainCodeBlockEditor({ code }) {
+  const { setCode } = useCodeBlockEditorContext();
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      className: "w-full rounded-md border border-border bg-muted p-3 font-mono text-sm",
+      rows: Math.max(2, code.split("\n").length),
+      value: code,
+      spellCheck: false,
+      onChange: (e) => setCode(e.target.value)
+    }
+  );
+}
+var CODE_BLOCK_DESCRIPTORS = [{ priority: -10, match: () => true, Editor: PlainCodeBlockEditor }];
 var DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS = {
   editor: "Document editor",
   placeholder: "Start typing\u2026"
@@ -55,6 +69,7 @@ function ArtifactMarkdownEditor({
             linkPlugin(),
             linkDialogPlugin(),
             tablePlugin(),
+            codeBlockPlugin({ codeBlockEditorDescriptors: CODE_BLOCK_DESCRIPTORS }),
             markdownShortcutPlugin(),
             toolbarPlugin({
               toolbarContents: () => /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -82,5 +97,5 @@ function ArtifactMarkdownEditor({
 }
 
 export { ArtifactMarkdownEditor, DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS };
-//# sourceMappingURL=chunk-HSFGOA6V.js.map
-//# sourceMappingURL=chunk-HSFGOA6V.js.map
+//# sourceMappingURL=chunk-NEFHQHQV.js.map
+//# sourceMappingURL=chunk-NEFHQHQV.js.map

package/dist/chunk-NEFHQHQV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/artifacts/editor/ArtifactMarkdownEditor.tsx"],"names":[],"mappings":"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","file":"chunk-NEFHQHQV.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  codeBlockPlugin,\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  useCodeBlockEditorContext,\n  type CodeBlockEditorProps,\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\n/** A plain-text editor for a fenced code block (no syntax highlighting, so no extra bundle). */\nfunction PlainCodeBlockEditor({ code }: CodeBlockEditorProps): React.ReactElement {\n  const { setCode } = useCodeBlockEditorContext()\n  return (\n    <textarea\n      className=\"w-full rounded-md border border-border bg-muted p-3 font-mono text-sm\"\n      rows={Math.max(2, code.split('\\n').length)}\n      value={code}\n      spellCheck={false}\n      onChange={(e) => setCode(e.target.value)}\n    />\n  )\n}\n\n// MDXEditor stops importing at a construct it has no plugin for (a code fence), flags a\n// processing error and from then on never calls `onChange`: the rest of the document disappears\n// and no edit can be saved. A catch-all code block editor keeps such documents editable.\nconst CODE_BLOCK_DESCRIPTORS = [{ priority: -10, match: () => true, Editor: PlainCodeBlockEditor }]\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          codeBlockPlugin({ codeBlockEditorDescriptors: CODE_BLOCK_DESCRIPTORS }),\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"]}

package/dist/{chunk-RUNQFXPH.cjs → chunk-QS4RV3MA.cjs}

@@ -12,6 +12,20 @@ function DictationSlot({
   const insertMarkdown = editor.usePublisher(editor.insertMarkdown$);
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: render(insertMarkdown) });
 }
+function PlainCodeBlockEditor({ code }) {
+  const { setCode } = editor.useCodeBlockEditorContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "textarea",
+    {
+      className: "w-full rounded-md border border-border bg-muted p-3 font-mono text-sm",
+      rows: Math.max(2, code.split("\n").length),
+      value: code,
+      spellCheck: false,
+      onChange: (e) => setCode(e.target.value)
+    }
+  );
+}
+var CODE_BLOCK_DESCRIPTORS = [{ priority: -10, match: () => true, Editor: PlainCodeBlockEditor }];
 var DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS = {
   editor: "Document editor",
   placeholder: "Start typing\u2026"
@@ -57,6 +71,7 @@ function ArtifactMarkdownEditor({
             editor.linkPlugin(),
             editor.linkDialogPlugin(),
             editor.tablePlugin(),
+            editor.codeBlockPlugin({ codeBlockEditorDescriptors: CODE_BLOCK_DESCRIPTORS }),
             editor.markdownShortcutPlugin(),
             editor.toolbarPlugin({
               toolbarContents: () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -85,5 +100,5 @@ function ArtifactMarkdownEditor({
 
 exports.ArtifactMarkdownEditor = ArtifactMarkdownEditor;
 exports.DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS = DEFAULT_ARTIFACT_MARKDOWN_EDITOR_LABELS;
-//# sourceMappingURL=chunk-RUNQFXPH.cjs.map
-//# sourceMappingURL=chunk-RUNQFXPH.cjs.map
+//# sourceMappingURL=chunk-QS4RV3MA.cjs.map
+//# sourceMappingURL=chunk-QS4RV3MA.cjs.map

package/dist/chunk-QS4RV3MA.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/artifacts/editor/ArtifactMarkdownEditor.tsx"],"names":["usePublisher","insertMarkdown$","jsx","Fragment","useCodeBlockEditorContext","useRef","testIdOr","MDXEditor","headingsPlugin","listsPlugin","quotePlugin","thematicBreakPlugin","linkPlugin","linkDialogPlugin","tablePlugin","codeBlockPlugin","markdownShortcutPlugin","toolbarPlugin","jsxs","UndoRedo","Separator","BoldItalicUnderlineToggles","BlockTypeSelect","ListsToggle","CreateLink","InsertTable","InsertThematicBreak"],"mappings":";;;;;;;AA8BA,SAAS,aAAA,CAAc;AAAA,EACrB;AACF,CAAA,EAEuB;AACrB,EAAA,MAAM,cAAA,GAAiBA,oBAAaC,sBAAe,CAAA;AACnD,EAAA,uBAAOC,cAAA,CAAAC,mBAAA,EAAA,EAAG,QAAA,EAAA,MAAA,CAAO,cAAc,CAAA,EAAE,CAAA;AACnC;AAGA,SAAS,oBAAA,CAAqB,EAAE,IAAA,EAAK,EAA6C;AAChF,EAAA,MAAM,EAAE,OAAA,EAAQ,GAAIC,gCAAA,EAA0B;AAC9C,EAAA,uBACEF,cAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,uEAAA;AAAA,MACV,IAAA,EAAM,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,KAAA,CAAM,IAAI,EAAE,MAAM,CAAA;AAAA,MACzC,KAAA,EAAO,IAAA;AAAA,MACP,UAAA,EAAY,KAAA;AAAA,MACZ,UAAU,CAAC,CAAA,KAAM,OAAA,CAAQ,CAAA,CAAE,OAAO,KAAK;AAAA;AAAA,GACzC;AAEJ;AAKA,IAAM,sBAAA,GAAyB,CAAC,EAAE,QAAA,EAAU,GAAA,EAAK,OAAO,MAAM,IAAA,EAAM,MAAA,EAAQ,oBAAA,EAAsB,CAAA;AAQ3F,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,GAAMG,aAAyB,IAAI,CAAA;AAGzC,EAAA,MAAM,uBAAA,GAA0BA,aAAO,IAAI,CAAA;AAE3C,EAAA,uBACEH,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,OAAA;AAAA,MACL,cAAY,CAAA,CAAE,MAAA;AAAA,MACd,eAAaI,0BAAA,CAAS,MAAA,EAAQ,EAAE,MAAA,EAAQ,4BAA4B,CAAA;AAAA,MACpE,SAAA,EAAU,4GAAA;AAAA,MAEV,QAAA,kBAAAJ,cAAA;AAAA,QAACK,gBAAA;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,6BAAaL,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uBAAA,EAAyB,YAAE,WAAA,EAAY,CAAA;AAAA,UACpE,OAAA,EAAS;AAAA,YACPM,qBAAA,EAAe;AAAA,YACfC,kBAAA,EAAY;AAAA,YACZC,kBAAA,EAAY;AAAA,YACZC,0BAAA,EAAoB;AAAA,YACpBC,iBAAA,EAAW;AAAA,YACXC,uBAAA,EAAiB;AAAA,YACjBC,kBAAA,EAAY;AAAA,YACZC,sBAAA,CAAgB,EAAE,0BAAA,EAA4B,sBAAA,EAAwB,CAAA;AAAA,YACtEC,6BAAA,EAAuB;AAAA,YACvBC,oBAAA,CAAc;AAAA,cACZ,eAAA,EAAiB,sBACfC,eAAA,CAAAf,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,gCAAAD,cAAA,CAACiB,eAAA,EAAA,EAAS,CAAA;AAAA,+CACTC,gBAAA,EAAA,EAAU,CAAA;AAAA,+CACVC,iCAAA,EAAA,EAA2B,CAAA;AAAA,+CAC3BD,gBAAA,EAAA,EAAU,CAAA;AAAA,+CACVE,sBAAA,EAAA,EAAgB,CAAA;AAAA,+CAChBC,kBAAA,EAAA,EAAY,CAAA;AAAA,+CACZH,gBAAA,EAAA,EAAU,CAAA;AAAA,+CACVI,iBAAA,EAAA,EAAW,CAAA;AAAA,+CACXC,kBAAA,EAAA,EAAY,CAAA;AAAA,+CACZC,0BAAA,EAAA,EAAoB,CAAA;AAAA,gBACpB,6BACCR,eAAA,CAAAf,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,kCAAAD,cAAA,CAACkB,gBAAA,EAAA,EAAU,CAAA;AAAA,kCACXlB,cAAA,CAAC,aAAA,EAAA,EAAc,MAAA,EAAQ,SAAA,EAAW;AAAA,iBAAA,EACpC;AAAA,eAAA,EAEJ;AAAA,aAEH;AAAA;AACH;AAAA;AACF;AAAA,GACF;AAEJ","file":"chunk-QS4RV3MA.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  codeBlockPlugin,\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  useCodeBlockEditorContext,\n  type CodeBlockEditorProps,\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\n/** A plain-text editor for a fenced code block (no syntax highlighting, so no extra bundle). */\nfunction PlainCodeBlockEditor({ code }: CodeBlockEditorProps): React.ReactElement {\n  const { setCode } = useCodeBlockEditorContext()\n  return (\n    <textarea\n      className=\"w-full rounded-md border border-border bg-muted p-3 font-mono text-sm\"\n      rows={Math.max(2, code.split('\\n').length)}\n      value={code}\n      spellCheck={false}\n      onChange={(e) => setCode(e.target.value)}\n    />\n  )\n}\n\n// MDXEditor stops importing at a construct it has no plugin for (a code fence), flags a\n// processing error and from then on never calls `onChange`: the rest of the document disappears\n// and no edit can be saved. A catch-all code block editor keeps such documents editable.\nconst CODE_BLOCK_DESCRIPTORS = [{ priority: -10, match: () => true, Editor: PlainCodeBlockEditor }]\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          codeBlockPlugin({ codeBlockEditorDescriptors: CODE_BLOCK_DESCRIPTORS }),\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"]}

package/dist/{chunk-67HGXV4I.cjs → chunk-SY7UURF7.cjs}

@@ -1,8 +1,8 @@
 "use client";
 'use strict';
 
-var chunkV4ISCZJ7_cjs = require('./chunk-V4ISCZJ7.cjs');
 var chunkZVPTFTGV_cjs = require('./chunk-ZVPTFTGV.cjs');
+var chunkV4ISCZJ7_cjs = require('./chunk-V4ISCZJ7.cjs');
 var chunkRFIBUWLF_cjs = require('./chunk-RFIBUWLF.cjs');
 var chunk5B4PXAKI_cjs = require('./chunk-5B4PXAKI.cjs');
 var chunkZW6FPIFC_cjs = require('./chunk-ZW6FPIFC.cjs');
@@ -5825,5 +5825,5 @@ exports.workflowFromFrontmatter = workflowFromFrontmatter;
 exports.workflowTaskFields = workflowTaskFields;
 exports.workflowsAccepting = workflowsAccepting;
 exports.workflowsForHost = workflowsForHost;
-//# sourceMappingURL=chunk-67HGXV4I.cjs.map
-//# sourceMappingURL=chunk-67HGXV4I.cjs.map
+//# sourceMappingURL=chunk-SY7UURF7.cjs.map
+//# sourceMappingURL=chunk-SY7UURF7.cjs.map