@mieweb/ui 0.6.1-dev.158 → 0.6.1-dev.159

package/dist/kerebron.cjs

@@ -67,6 +67,21 @@ var CodeEditor = ({
   const editorInstance = react.useRef(null);
   const onChangeRef = react.useRef(onChange);
   onChangeRef.current = onChange;
+  react.useEffect(() => {
+    const root = editorRef.current;
+    if (!root) return;
+    const applySelectLabel = () => {
+      root.querySelectorAll("select.codejar-select").forEach((element) => {
+        if (!element.getAttribute("aria-label")) {
+          element.setAttribute("aria-label", "Code editor language");
+        }
+      });
+    };
+    applySelectLabel();
+    const observer = new MutationObserver(() => applySelectLabel());
+    observer.observe(root, { childList: true, subtree: true });
+    return () => observer.disconnect();
+  }, []);
   react.useEffect(() => {
     if (!editorRef.current) return;
     const editor$1 = editor.CoreEditor.create({

package/dist/kerebron.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/RichEditor/RichEditor.tsx","../src/components/RichEditor/CodeEditor.tsx"],"names":["useRef","useState","useEffect","editor","CoreEditor","createAssetLoad","AdvancedEditorKit","jsx","jsxs","CodeEditorKit"],"mappings":"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","file":"kerebron.cjs","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { AdvancedEditorKit } from '@kerebron/editor-kits/AdvancedEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface RichEditorProps {\n  /** Initial markdown content to load into the editor. */\n  value?: string;\n  /** Called with the editor's markdown content whenever it changes. */\n  onChange?: (value: string) => void;\n  /** Whether to render the live markdown output preview. Defaults to `false`. */\n  showPreview?: boolean;\n}\n\nconst RichEditor: React.FC<RichEditorProps> = ({\n  value = '',\n  onChange,\n  showPreview = false,\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  const [md, setMd] = useState<string>('');\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.md',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new AdvancedEditorKit()],\n    });\n\n    editorInstance.current = editor;\n\n    // Listen to transactions and update markdown preview\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer =\n          await editorInstance.current.saveDocument('text/x-markdown');\n        const markdown = new globalThis.TextDecoder().decode(buffer);\n        setMd(markdown);\n        onChangeRef.current?.(markdown);\n      } catch (err) {\n        console.error('Failed to save markdown:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content, then populate the preview once on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/x-markdown', value)\n        .then(() => onTransaction())\n        .catch((err) => console.error('Failed to load markdown:', err));\n    } else {\n      void onTransaction();\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value` is intentionally only applied on mount (uncontrolled).\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n\n      {showPreview && (\n        <div>\n          <div>\n            <h5>Markdown Output</h5>\n            <pre>{md}</pre>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nRichEditor.displayName = 'RichEditor';\n\nexport { RichEditor };\n","import React, { useEffect, useRef } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { CodeEditorKit } from '@kerebron/editor-kits/CodeEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface CodeEditorProps {\n  /** Initial source code to load into the editor. */\n  value?: string;\n  /** Called with the editor's contents whenever they change. */\n  onChange?: (value: string) => void;\n  /** Language/grammar to use for syntax highlighting. Defaults to `typescript`. */\n  lang?: string;\n}\n\nconst CodeEditor: React.FC<CodeEditorProps> = ({\n  value = '',\n  onChange,\n  lang = 'typescript',\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.ts',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new CodeEditorKit(lang)],\n    });\n\n    editorInstance.current = editor;\n\n    // Surface edits to callers.\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer = await editorInstance.current.saveDocument('text/plain');\n        onChangeRef.current?.(new globalThis.TextDecoder().decode(buffer));\n      } catch (err) {\n        console.error('Failed to read code:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/plain', value)\n        .catch((err) => console.error('Failed to load code:', err));\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value`/`lang` are intentionally only applied on mount.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n    </div>\n  );\n};\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport { CodeEditor };\n"]}
+{"version":3,"sources":["../src/components/RichEditor/RichEditor.tsx","../src/components/RichEditor/CodeEditor.tsx"],"names":["useRef","useState","useEffect","editor","CoreEditor","createAssetLoad","AdvancedEditorKit","jsx","jsxs","CodeEditorKit"],"mappings":"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","file":"kerebron.cjs","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { AdvancedEditorKit } from '@kerebron/editor-kits/AdvancedEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface RichEditorProps {\n  /** Initial markdown content to load into the editor. */\n  value?: string;\n  /** Called with the editor's markdown content whenever it changes. */\n  onChange?: (value: string) => void;\n  /** Whether to render the live markdown output preview. Defaults to `false`. */\n  showPreview?: boolean;\n}\n\nconst RichEditor: React.FC<RichEditorProps> = ({\n  value = '',\n  onChange,\n  showPreview = false,\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  const [md, setMd] = useState<string>('');\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.md',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new AdvancedEditorKit()],\n    });\n\n    editorInstance.current = editor;\n\n    // Listen to transactions and update markdown preview\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer =\n          await editorInstance.current.saveDocument('text/x-markdown');\n        const markdown = new globalThis.TextDecoder().decode(buffer);\n        setMd(markdown);\n        onChangeRef.current?.(markdown);\n      } catch (err) {\n        console.error('Failed to save markdown:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content, then populate the preview once on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/x-markdown', value)\n        .then(() => onTransaction())\n        .catch((err) => console.error('Failed to load markdown:', err));\n    } else {\n      void onTransaction();\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value` is intentionally only applied on mount (uncontrolled).\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n\n      {showPreview && (\n        <div>\n          <div>\n            <h5>Markdown Output</h5>\n            <pre>{md}</pre>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nRichEditor.displayName = 'RichEditor';\n\nexport { RichEditor };\n","import React, { useEffect, useRef } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { CodeEditorKit } from '@kerebron/editor-kits/CodeEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface CodeEditorProps {\n  /** Initial source code to load into the editor. */\n  value?: string;\n  /** Called with the editor's contents whenever they change. */\n  onChange?: (value: string) => void;\n  /** Language/grammar to use for syntax highlighting. Defaults to `typescript`. */\n  lang?: string;\n}\n\nconst CodeEditor: React.FC<CodeEditorProps> = ({\n  value = '',\n  onChange,\n  lang = 'typescript',\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    const root = editorRef.current;\n    if (!root) return;\n\n    const applySelectLabel = () => {\n      root.querySelectorAll('select.codejar-select').forEach((element) => {\n        if (!element.getAttribute('aria-label')) {\n          element.setAttribute('aria-label', 'Code editor language');\n        }\n      });\n    };\n\n    applySelectLabel();\n    const observer = new MutationObserver(() => applySelectLabel());\n    observer.observe(root, { childList: true, subtree: true });\n    return () => observer.disconnect();\n  }, []);\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.ts',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new CodeEditorKit(lang)],\n    });\n\n    editorInstance.current = editor;\n\n    // Surface edits to callers.\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer = await editorInstance.current.saveDocument('text/plain');\n        onChangeRef.current?.(new globalThis.TextDecoder().decode(buffer));\n      } catch (err) {\n        console.error('Failed to read code:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/plain', value)\n        .catch((err) => console.error('Failed to load code:', err));\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value`/`lang` are intentionally only applied on mount.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n    </div>\n  );\n};\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport { CodeEditor };\n"]}

package/dist/kerebron.js

@@ -65,6 +65,21 @@ var CodeEditor = ({
   const editorInstance = useRef(null);
   const onChangeRef = useRef(onChange);
   onChangeRef.current = onChange;
+  useEffect(() => {
+    const root = editorRef.current;
+    if (!root) return;
+    const applySelectLabel = () => {
+      root.querySelectorAll("select.codejar-select").forEach((element) => {
+        if (!element.getAttribute("aria-label")) {
+          element.setAttribute("aria-label", "Code editor language");
+        }
+      });
+    };
+    applySelectLabel();
+    const observer = new MutationObserver(() => applySelectLabel());
+    observer.observe(root, { childList: true, subtree: true });
+    return () => observer.disconnect();
+  }, []);
   useEffect(() => {
     if (!editorRef.current) return;
     const editor = CoreEditor.create({

package/dist/kerebron.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/RichEditor/RichEditor.tsx","../src/components/RichEditor/CodeEditor.tsx"],"names":["useRef","useEffect","CoreEditor","createAssetLoad","jsx"],"mappings":"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","file":"kerebron.js","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { AdvancedEditorKit } from '@kerebron/editor-kits/AdvancedEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface RichEditorProps {\n  /** Initial markdown content to load into the editor. */\n  value?: string;\n  /** Called with the editor's markdown content whenever it changes. */\n  onChange?: (value: string) => void;\n  /** Whether to render the live markdown output preview. Defaults to `false`. */\n  showPreview?: boolean;\n}\n\nconst RichEditor: React.FC<RichEditorProps> = ({\n  value = '',\n  onChange,\n  showPreview = false,\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  const [md, setMd] = useState<string>('');\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.md',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new AdvancedEditorKit()],\n    });\n\n    editorInstance.current = editor;\n\n    // Listen to transactions and update markdown preview\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer =\n          await editorInstance.current.saveDocument('text/x-markdown');\n        const markdown = new globalThis.TextDecoder().decode(buffer);\n        setMd(markdown);\n        onChangeRef.current?.(markdown);\n      } catch (err) {\n        console.error('Failed to save markdown:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content, then populate the preview once on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/x-markdown', value)\n        .then(() => onTransaction())\n        .catch((err) => console.error('Failed to load markdown:', err));\n    } else {\n      void onTransaction();\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value` is intentionally only applied on mount (uncontrolled).\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n\n      {showPreview && (\n        <div>\n          <div>\n            <h5>Markdown Output</h5>\n            <pre>{md}</pre>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nRichEditor.displayName = 'RichEditor';\n\nexport { RichEditor };\n","import React, { useEffect, useRef } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { CodeEditorKit } from '@kerebron/editor-kits/CodeEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface CodeEditorProps {\n  /** Initial source code to load into the editor. */\n  value?: string;\n  /** Called with the editor's contents whenever they change. */\n  onChange?: (value: string) => void;\n  /** Language/grammar to use for syntax highlighting. Defaults to `typescript`. */\n  lang?: string;\n}\n\nconst CodeEditor: React.FC<CodeEditorProps> = ({\n  value = '',\n  onChange,\n  lang = 'typescript',\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.ts',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new CodeEditorKit(lang)],\n    });\n\n    editorInstance.current = editor;\n\n    // Surface edits to callers.\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer = await editorInstance.current.saveDocument('text/plain');\n        onChangeRef.current?.(new globalThis.TextDecoder().decode(buffer));\n      } catch (err) {\n        console.error('Failed to read code:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/plain', value)\n        .catch((err) => console.error('Failed to load code:', err));\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value`/`lang` are intentionally only applied on mount.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n    </div>\n  );\n};\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport { CodeEditor };\n"]}
+{"version":3,"sources":["../src/components/RichEditor/RichEditor.tsx","../src/components/RichEditor/CodeEditor.tsx"],"names":["useRef","useEffect","CoreEditor","createAssetLoad","jsx"],"mappings":"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","file":"kerebron.js","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { AdvancedEditorKit } from '@kerebron/editor-kits/AdvancedEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface RichEditorProps {\n  /** Initial markdown content to load into the editor. */\n  value?: string;\n  /** Called with the editor's markdown content whenever it changes. */\n  onChange?: (value: string) => void;\n  /** Whether to render the live markdown output preview. Defaults to `false`. */\n  showPreview?: boolean;\n}\n\nconst RichEditor: React.FC<RichEditorProps> = ({\n  value = '',\n  onChange,\n  showPreview = false,\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  const [md, setMd] = useState<string>('');\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.md',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new AdvancedEditorKit()],\n    });\n\n    editorInstance.current = editor;\n\n    // Listen to transactions and update markdown preview\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer =\n          await editorInstance.current.saveDocument('text/x-markdown');\n        const markdown = new globalThis.TextDecoder().decode(buffer);\n        setMd(markdown);\n        onChangeRef.current?.(markdown);\n      } catch (err) {\n        console.error('Failed to save markdown:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content, then populate the preview once on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/x-markdown', value)\n        .then(() => onTransaction())\n        .catch((err) => console.error('Failed to load markdown:', err));\n    } else {\n      void onTransaction();\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value` is intentionally only applied on mount (uncontrolled).\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n\n      {showPreview && (\n        <div>\n          <div>\n            <h5>Markdown Output</h5>\n            <pre>{md}</pre>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nRichEditor.displayName = 'RichEditor';\n\nexport { RichEditor };\n","import React, { useEffect, useRef } from 'react';\n\nimport { CoreEditor } from '@kerebron/editor';\nimport { CodeEditorKit } from '@kerebron/editor-kits/CodeEditorKit';\nimport { createAssetLoad } from '@kerebron/wasm/web';\n\nexport interface CodeEditorProps {\n  /** Initial source code to load into the editor. */\n  value?: string;\n  /** Called with the editor's contents whenever they change. */\n  onChange?: (value: string) => void;\n  /** Language/grammar to use for syntax highlighting. Defaults to `typescript`. */\n  lang?: string;\n}\n\nconst CodeEditor: React.FC<CodeEditorProps> = ({\n  value = '',\n  onChange,\n  lang = 'typescript',\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const editorInstance = useRef<CoreEditor | null>(null);\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    const root = editorRef.current;\n    if (!root) return;\n\n    const applySelectLabel = () => {\n      root.querySelectorAll('select.codejar-select').forEach((element) => {\n        if (!element.getAttribute('aria-label')) {\n          element.setAttribute('aria-label', 'Code editor language');\n        }\n      });\n    };\n\n    applySelectLabel();\n    const observer = new MutationObserver(() => applySelectLabel());\n    observer.observe(root, { childList: true, subtree: true });\n    return () => observer.disconnect();\n  }, []);\n\n  useEffect(() => {\n    if (!editorRef.current) return;\n\n    // Initialize the editor\n    const editor = CoreEditor.create({\n      element: editorRef.current,\n      uri: 'file:///untitled.ts',\n      assetLoad: createAssetLoad('/kerebron-wasm'),\n      editorKits: [new CodeEditorKit(lang)],\n    });\n\n    editorInstance.current = editor;\n\n    // Surface edits to callers.\n    const onTransaction = async () => {\n      if (!editorInstance.current) return;\n\n      try {\n        const buffer = await editorInstance.current.saveDocument('text/plain');\n        onChangeRef.current?.(new globalThis.TextDecoder().decode(buffer));\n      } catch (err) {\n        console.error('Failed to read code:', err);\n      }\n    };\n\n    editor.addEventListener('transaction', onTransaction);\n\n    // Seed initial content on mount.\n    if (value) {\n      editor\n        .loadDocumentText('text/plain', value)\n        .catch((err) => console.error('Failed to load code:', err));\n    }\n\n    // Cleanup on unmount\n    return () => {\n      editor.removeEventListener('transaction', onTransaction);\n      editor.destroy();\n    };\n    // Initial `value`/`lang` are intentionally only applied on mount.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div>\n      <div>\n        <div ref={editorRef} className=\"kb-component\" />\n      </div>\n    </div>\n  );\n};\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport { CodeEditor };\n"]}

package/dist/{nitroTableGrid-J7F6D2QA.cjs → nitroTableGrid-RQNSZQO4.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkLZPPH5BW_cjs = require('./chunk-LZPPH5BW.cjs');
+var chunkWJIANZPI_cjs = require('./chunk-WJIANZPI.cjs');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -25,20 +25,23 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 function NitroTableGrid({ headers, rows }) {
-  const url = React__namespace.useMemo(() => {
-    const payload = {
+  const varName = React__namespace.useMemo(() => {
+    const nextVarName = `__superchat_nitro_table_${Math.random().toString(36).slice(2)}`;
+    window[nextVarName] = {
       typeInfo: headers.map((field) => ({ field, type: "string" })),
       data: rows
     };
-    const blob = new Blob([JSON.stringify(payload)], {
-      type: "application/json"
-    });
-    return URL.createObjectURL(blob);
+    return nextVarName;
   }, [headers, rows]);
-  React__namespace.useEffect(() => () => URL.revokeObjectURL(url), [url]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "superchat-nitro-table", className: "my-2", children: /* @__PURE__ */ jsxRuntime.jsx(chunkLZPPH5BW_cjs.DataVisNitroSource, { type: "http", url, children: /* @__PURE__ */ jsxRuntime.jsx(chunkLZPPH5BW_cjs.DataVisNitroGrid, { columns: headers, minimalMode: true, className: "max-h-80" }) }) });
+  React__namespace.useEffect(
+    () => () => {
+      delete window[varName];
+    },
+    [varName]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "superchat-nitro-table", className: "my-2", children: /* @__PURE__ */ jsxRuntime.jsx(chunkWJIANZPI_cjs.DataVisNitroSource, { type: "local", varName, children: /* @__PURE__ */ jsxRuntime.jsx(chunkWJIANZPI_cjs.DataVisNitroGrid, { columns: headers, className: "max-h-80" }) }) });
 }
 
 module.exports = NitroTableGrid;
-//# sourceMappingURL=nitroTableGrid-J7F6D2QA.cjs.map
-//# sourceMappingURL=nitroTableGrid-J7F6D2QA.cjs.map
+//# sourceMappingURL=nitroTableGrid-RQNSZQO4.cjs.map
+//# sourceMappingURL=nitroTableGrid-RQNSZQO4.cjs.map

package/dist/nitroTableGrid-RQNSZQO4.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SuperChat/plugins/nitroTableGrid.tsx"],"names":["React","DataVisNitroSource","DataVisNitroGrid"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAqBe,SAAR,cAAA,CAAgC,EAAE,OAAA,EAAS,IAAA,EAAK,EAAwB;AAC7E,EAAA,MAAM,OAAA,GAAgBA,yBAAQ,MAAM;AAClC,IAAA,MAAM,WAAA,GAAc,CAAA,wBAAA,EAA2B,IAAA,CAAK,MAAA,EAAO,CAAE,SAAS,EAAE,CAAA,CAAE,KAAA,CAAM,CAAC,CAAC,CAAA,CAAA;AAClF,IAAC,MAAA,CAA8C,WAAW,CAAA,GAAI;AAAA,MAC5D,QAAA,EAAU,QAAQ,GAAA,CAAI,CAAC,WAAW,EAAE,KAAA,EAAO,IAAA,EAAM,QAAA,EAAS,CAAE,CAAA;AAAA,MAC5D,IAAA,EAAM;AAAA,KACR;AACA,IAAA,OAAO,WAAA;AAAA,EACT,CAAA,EAAG,CAAC,OAAA,EAAS,IAAI,CAAC,CAAA;AAElB,EAAMA,gBAAA,CAAA,SAAA;AAAA,IACJ,MAAM,MAAM;AACV,MAAA,OAAQ,OAA8C,OAAO,CAAA;AAAA,IAC/D,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,sCACG,KAAA,EAAA,EAAI,WAAA,EAAU,yBAAwB,SAAA,EAAU,MAAA,EAC/C,yCAACC,oCAAA,EAAA,EAAmB,IAAA,EAAK,OAAA,EAAQ,OAAA,EAC/B,yCAACC,kCAAA,EAAA,EAAiB,OAAA,EAAS,SAAS,SAAA,EAAU,UAAA,EAAW,GAC3D,CAAA,EACF,CAAA;AAEJ","file":"nitroTableGrid-RQNSZQO4.cjs","sourcesContent":["/**\n * SuperChat NITRO table grid (lazy chunk).\n *\n * Default-exported so it can be pulled in with `React.lazy` only when a GFM\n * table actually renders — this keeps the heavy `datavis` / `datavis-ace`\n * dependencies out of the SuperChat (and Markdown core) bundle.\n *\n * Data is handed to {@link DataVisNitroSource} through a short-lived local\n * source so Storybook never pauses in the intermediate \"Waiting…\" state.\n */\n\nimport * as React from 'react';\nimport { DataVisNitroGrid, DataVisNitroSource } from '../../DataVisNITRO';\n\nexport interface NitroTableGridProps {\n  /** Column headers, in order. */\n  headers: string[];\n  /** Row objects keyed by header. */\n  rows: Array<Record<string, string>>;\n}\n\nexport default function NitroTableGrid({ headers, rows }: NitroTableGridProps) {\n  const varName = React.useMemo(() => {\n    const nextVarName = `__superchat_nitro_table_${Math.random().toString(36).slice(2)}`;\n    (window as unknown as Record<string, unknown>)[nextVarName] = {\n      typeInfo: headers.map((field) => ({ field, type: 'string' })),\n      data: rows,\n    };\n    return nextVarName;\n  }, [headers, rows]);\n\n  React.useEffect(\n    () => () => {\n      delete (window as unknown as Record<string, unknown>)[varName];\n    },\n    [varName]\n  );\n\n  return (\n    <div data-slot=\"superchat-nitro-table\" className=\"my-2\">\n      <DataVisNitroSource type=\"local\" varName={varName}>\n        <DataVisNitroGrid columns={headers} className=\"max-h-80\" />\n      </DataVisNitroSource>\n    </div>\n  );\n}\n"]}

package/dist/nitroTableGrid-W6XWRFA7.js

@@ -0,0 +1,25 @@
+import { DataVisNitroSource, DataVisNitroGrid } from './chunk-4N72FAQW.js';
+import * as React from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+function NitroTableGrid({ headers, rows }) {
+  const varName = React.useMemo(() => {
+    const nextVarName = `__superchat_nitro_table_${Math.random().toString(36).slice(2)}`;
+    window[nextVarName] = {
+      typeInfo: headers.map((field) => ({ field, type: "string" })),
+      data: rows
+    };
+    return nextVarName;
+  }, [headers, rows]);
+  React.useEffect(
+    () => () => {
+      delete window[varName];
+    },
+    [varName]
+  );
+  return /* @__PURE__ */ jsx("div", { "data-slot": "superchat-nitro-table", className: "my-2", children: /* @__PURE__ */ jsx(DataVisNitroSource, { type: "local", varName, children: /* @__PURE__ */ jsx(DataVisNitroGrid, { columns: headers, className: "max-h-80" }) }) });
+}
+
+export { NitroTableGrid as default };
+//# sourceMappingURL=nitroTableGrid-W6XWRFA7.js.map
+//# sourceMappingURL=nitroTableGrid-W6XWRFA7.js.map

package/dist/nitroTableGrid-W6XWRFA7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SuperChat/plugins/nitroTableGrid.tsx"],"names":[],"mappings":";;;;AAqBe,SAAR,cAAA,CAAgC,EAAE,OAAA,EAAS,IAAA,EAAK,EAAwB;AAC7E,EAAA,MAAM,OAAA,GAAgB,cAAQ,MAAM;AAClC,IAAA,MAAM,WAAA,GAAc,CAAA,wBAAA,EAA2B,IAAA,CAAK,MAAA,EAAO,CAAE,SAAS,EAAE,CAAA,CAAE,KAAA,CAAM,CAAC,CAAC,CAAA,CAAA;AAClF,IAAC,MAAA,CAA8C,WAAW,CAAA,GAAI;AAAA,MAC5D,QAAA,EAAU,QAAQ,GAAA,CAAI,CAAC,WAAW,EAAE,KAAA,EAAO,IAAA,EAAM,QAAA,EAAS,CAAE,CAAA;AAAA,MAC5D,IAAA,EAAM;AAAA,KACR;AACA,IAAA,OAAO,WAAA;AAAA,EACT,CAAA,EAAG,CAAC,OAAA,EAAS,IAAI,CAAC,CAAA;AAElB,EAAM,KAAA,CAAA,SAAA;AAAA,IACJ,MAAM,MAAM;AACV,MAAA,OAAQ,OAA8C,OAAO,CAAA;AAAA,IAC/D,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,2BACG,KAAA,EAAA,EAAI,WAAA,EAAU,yBAAwB,SAAA,EAAU,MAAA,EAC/C,8BAAC,kBAAA,EAAA,EAAmB,IAAA,EAAK,OAAA,EAAQ,OAAA,EAC/B,8BAAC,gBAAA,EAAA,EAAiB,OAAA,EAAS,SAAS,SAAA,EAAU,UAAA,EAAW,GAC3D,CAAA,EACF,CAAA;AAEJ","file":"nitroTableGrid-W6XWRFA7.js","sourcesContent":["/**\n * SuperChat NITRO table grid (lazy chunk).\n *\n * Default-exported so it can be pulled in with `React.lazy` only when a GFM\n * table actually renders — this keeps the heavy `datavis` / `datavis-ace`\n * dependencies out of the SuperChat (and Markdown core) bundle.\n *\n * Data is handed to {@link DataVisNitroSource} through a short-lived local\n * source so Storybook never pauses in the intermediate \"Waiting…\" state.\n */\n\nimport * as React from 'react';\nimport { DataVisNitroGrid, DataVisNitroSource } from '../../DataVisNITRO';\n\nexport interface NitroTableGridProps {\n  /** Column headers, in order. */\n  headers: string[];\n  /** Row objects keyed by header. */\n  rows: Array<Record<string, string>>;\n}\n\nexport default function NitroTableGrid({ headers, rows }: NitroTableGridProps) {\n  const varName = React.useMemo(() => {\n    const nextVarName = `__superchat_nitro_table_${Math.random().toString(36).slice(2)}`;\n    (window as unknown as Record<string, unknown>)[nextVarName] = {\n      typeInfo: headers.map((field) => ({ field, type: 'string' })),\n      data: rows,\n    };\n    return nextVarName;\n  }, [headers, rows]);\n\n  React.useEffect(\n    () => () => {\n      delete (window as unknown as Record<string, unknown>)[varName];\n    },\n    [varName]\n  );\n\n  return (\n    <div data-slot=\"superchat-nitro-table\" className=\"my-2\">\n      <DataVisNitroSource type=\"local\" varName={varName}>\n        <DataVisNitroGrid columns={headers} className=\"max-h-80\" />\n      </DataVisNitroSource>\n    </div>\n  );\n}\n"]}