@velo-sci/notebook-react 0.6.1 → 0.6.3

package/dist/index.cjs

@@ -123,12 +123,12 @@ function useNotebookEvent(type, handler) {
 }
 
 // src/components/SciNotebook.tsx
-var import_react13 = __toESM(require("react"), 1);
+var import_react14 = __toESM(require("react"), 1);
 var import_notebook_core = require("@velo-sci/notebook-core");
-var import_notebook_renderer = require("@velo-sci/notebook-renderer");
+var import_notebook_renderer2 = require("@velo-sci/notebook-renderer");
 
 // src/components/Cell.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 
 // src/components/FloatingToolbar.tsx
 var import_react2 = require("react");
@@ -259,10 +259,11 @@ function parseInlineStyle(css) {
 
 // src/components/MathEditor.tsx
 var import_react3 = require("react");
-var import_jsx_runtime2 = require("react/jsx-runtime");
+
+// src/components/math-categories.ts
 var MATH_CATEGORIES = [
   {
-    name: "Estructuras",
+    name: "Structures",
     icon: "\u2B1A",
     blocks: [
       { label: "a/b", latex: "\\frac{\u25A2}{\u25A2}", cursor: 6 },
@@ -279,7 +280,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Integrales",
+    name: "Integrals",
     icon: "\u222B",
     blocks: [
       { label: "\u222B", latex: "\\int{\u25A2}\\,d{\u25A2}", cursor: 5 },
@@ -290,7 +291,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Sumatorias",
+    name: "Summations",
     icon: "\u2211",
     blocks: [
       { label: "\u2211", latex: "\\sum_{\u25A2}^{\u25A2}{\u25A2}", cursor: 5 },
@@ -307,11 +308,11 @@ var MATH_CATEGORIES = [
       { label: "3\xD73", latex: "\\begin{pmatrix} \u25A2 & \u25A2 & \u25A2 \\\\ \u25A2 & \u25A2 & \u25A2 \\\\ \u25A2 & \u25A2 & \u25A2 \\end{pmatrix}", cursor: 16 },
       { label: "[2\xD72]", latex: "\\begin{bmatrix} \u25A2 & \u25A2 \\\\ \u25A2 & \u25A2 \\end{bmatrix}", cursor: 16 },
       { label: "|2\xD72|", latex: "\\begin{vmatrix} \u25A2 & \u25A2 \\\\ \u25A2 & \u25A2 \\end{vmatrix}", cursor: 16 },
-      { label: "cases", latex: "\\begin{cases} \u25A2 & \\text{si } \u25A2 \\\\ \u25A2 & \\text{si } \u25A2 \\end{cases}", cursor: 14 }
+      { label: "cases", latex: "\\begin{cases} \u25A2 & \\text{if } \u25A2 \\\\ \u25A2 & \\text{if } \u25A2 \\end{cases}", cursor: 14 }
     ]
   },
   {
-    name: "Griegos",
+    name: "Greek",
     icon: "\u03B1",
     blocks: [
       { label: "\u03B1", latex: "\\alpha" },
@@ -342,7 +343,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Operadores",
+    name: "Operators",
     icon: "\xB1",
     blocks: [
       { label: "\xB1", latex: "\\pm" },
@@ -374,7 +375,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Flechas",
+    name: "Arrows",
     icon: "\u2192",
     blocks: [
       { label: "\u2192", latex: "\\rightarrow" },
@@ -389,7 +390,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Funciones",
+    name: "Functions",
     icon: "f(x)",
     blocks: [
       { label: "sin", latex: "\\sin{\u25A2}", cursor: 5 },
@@ -405,7 +406,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Delimitadores",
+    name: "Delimiters",
     icon: "()",
     blocks: [
       { label: "(\u2026)", latex: "\\left( \u25A2 \\right)", cursor: 7 },
@@ -418,9 +419,12 @@ var MATH_CATEGORIES = [
     ]
   }
 ];
+
+// src/components/MathEditor.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
 function renderLatexPreview(latex) {
   const clean = latex.replace(/^\$\$\s*/, "").replace(/\s*\$\$$/, "").trim();
-  if (!clean) return '<span class="sci-nb-math-preview-empty">Formula vacia</span>';
+  if (!clean) return '<span class="sci-nb-math-preview-empty">Empty formula</span>';
   if (typeof globalThis !== "undefined" && globalThis.katex) {
     try {
       return globalThis.katex.renderToString(clean, {
@@ -430,14 +434,13 @@ function renderLatexPreview(latex) {
     } catch {
     }
   }
-  return `<code class="sci-nb-math-preview-code">${escapeHtml(clean)}</code>`;
-}
-function escapeHtml(s) {
-  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+  const escaped = clean.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+  return `<code class="sci-nb-math-preview-code">${escaped}</code>`;
 }
 var MathEditor = ({ cellId, source, onExit }) => {
   const engine = useSciNotebook();
   const textareaRef = (0, import_react3.useRef)(null);
+  const containerRef = (0, import_react3.useRef)(null);
   const [activeCategory, setActiveCategory] = (0, import_react3.useState)(0);
   const [showRaw, setShowRaw] = (0, import_react3.useState)(false);
   const innerLatex = source.replace(/^\$\$\s*/, "").replace(/\s*\$\$$/, "").trim();
@@ -474,15 +477,42 @@ $$`);
       }
     });
   }, [innerLatex, updateSource]);
+  const exitAndNext = (0, import_react3.useCallback)(() => {
+    onExit();
+    const cells = engine.getCells();
+    const idx = cells.findIndex((c) => c.id === cellId);
+    if (idx < cells.length - 1) {
+      engine.focusCell(cells[idx + 1].id);
+      engine.setEditMode(cells[idx + 1].id);
+    }
+  }, [engine, cellId, onExit]);
   const handleKeyDown = (0, import_react3.useCallback)((e) => {
     if (e.key === "Escape") {
       e.preventDefault();
+      e.stopPropagation();
       onExit();
     } else if (e.key === "Enter" && e.shiftKey) {
       e.preventDefault();
+      e.stopPropagation();
+      exitAndNext();
+    } else if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
+      e.preventDefault();
+      e.stopPropagation();
       onExit();
     }
-  }, [onExit]);
+  }, [onExit, exitAndNext]);
+  (0, import_react3.useEffect)(() => {
+    if (showRaw && textareaRef.current) {
+      textareaRef.current.focus();
+    } else if (containerRef.current) {
+      containerRef.current.focus();
+    }
+  }, [showRaw]);
+  (0, import_react3.useEffect)(() => {
+    if (containerRef.current) {
+      containerRef.current.focus();
+    }
+  }, []);
   (0, import_react3.useEffect)(() => {
     if (showRaw && textareaRef.current) {
       const ta = textareaRef.current;
@@ -491,82 +521,97 @@ $$`);
     }
   }, [innerLatex, showRaw]);
   const category = MATH_CATEGORIES[activeCategory];
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-math-editor", onKeyDown: handleKeyDown, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "sci-nb-math-tabs", children: MATH_CATEGORIES.map((cat, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-      "button",
-      {
-        className: `sci-nb-math-tab ${i === activeCategory ? "sci-nb-math-tab--active" : ""}`,
-        onClick: () => setActiveCategory(i),
-        title: cat.name,
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "sci-nb-math-tab-icon", children: cat.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "sci-nb-math-tab-label", children: cat.name })
-        ]
-      },
-      cat.name
-    )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "sci-nb-math-palette", children: category.blocks.map((block, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      "button",
-      {
-        className: "sci-nb-math-block",
-        onClick: () => insertBlock(block),
-        title: block.latex,
-        children: block.label
-      },
-      i
-    )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-math-editor-area", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-math-mode-toggle", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      ref: containerRef,
+      className: "sci-nb-math-editor",
+      onKeyDown: handleKeyDown,
+      tabIndex: -1,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "sci-nb-math-tabs", children: MATH_CATEGORIES.map((cat, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
           "button",
           {
-            className: `sci-nb-math-mode-btn ${!showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
-            onClick: () => setShowRaw(false),
-            children: "Preview"
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            className: `sci-nb-math-tab ${i === activeCategory ? "sci-nb-math-tab--active" : ""}`,
+            onClick: () => setActiveCategory(i),
+            title: cat.name,
+            tabIndex: -1,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "sci-nb-math-tab-icon", children: cat.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "sci-nb-math-tab-label", children: cat.name })
+            ]
+          },
+          cat.name
+        )) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "sci-nb-math-palette", children: category.blocks.map((block, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "button",
           {
-            className: `sci-nb-math-mode-btn ${showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
-            onClick: () => setShowRaw(true),
-            children: "LaTeX"
-          }
-        )
-      ] }),
-      showRaw ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "textarea",
-        {
-          ref: textareaRef,
-          className: "sci-nb-math-raw",
-          value: innerLatex,
-          onChange: handleRawChange,
-          placeholder: "Escribe LaTeX aqui...",
-          spellCheck: false,
-          autoFocus: true
-        }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-math-visual", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-          "div",
-          {
-            className: "sci-nb-math-preview",
-            dangerouslySetInnerHTML: { __html: renderLatexPreview(source) }
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { className: "sci-nb-math-visual-hint", children: [
-          "Haz click en los bloques de arriba para construir tu formula. Cambia a modo ",
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { children: "LaTeX" }),
-          " para editar directamente."
+            className: "sci-nb-math-block",
+            onClick: () => insertBlock(block),
+            title: block.latex,
+            tabIndex: -1,
+            children: block.label
+          },
+          i
+        )) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-math-editor-area", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-math-mode-toggle", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "button",
+              {
+                className: `sci-nb-math-mode-btn ${!showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
+                onClick: () => setShowRaw(false),
+                tabIndex: -1,
+                children: "Preview"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "button",
+              {
+                className: `sci-nb-math-mode-btn ${showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
+                onClick: () => setShowRaw(true),
+                tabIndex: -1,
+                children: "LaTeX"
+              }
+            )
+          ] }),
+          showRaw ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            "textarea",
+            {
+              ref: textareaRef,
+              className: "sci-nb-math-raw",
+              value: innerLatex,
+              onChange: handleRawChange,
+              placeholder: "Type LaTeX here...",
+              spellCheck: false,
+              autoFocus: true
+            }
+          ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-math-visual", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "div",
+              {
+                className: "sci-nb-math-preview",
+                dangerouslySetInnerHTML: { __html: renderLatexPreview(source) }
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { className: "sci-nb-math-visual-hint", children: [
+              "Click the blocks above to build your formula. Switch to ",
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { children: "LaTeX" }),
+              " mode to edit directly."
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-cell-hint", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "Esc" }),
+          " exit \xB7 ",
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "Shift+Enter" }),
+          " next \xB7 ",
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "Ctrl+Enter" }),
+          " render"
         ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "sci-nb-cell-hint", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "Esc" }),
-      " salir \xB7 ",
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "Shift+Enter" }),
-      " siguiente"
-    ] })
-  ] });
+      ]
+    }
+  );
 };
 
 // src/components/ImageCell.tsx
@@ -664,7 +709,7 @@ var ImageCell = ({ cellId, source, metadata, onExit }) => {
             /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("circle", { cx: "12", cy: "12", r: "2.5" }),
             /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M4 22l6-6 4 4 4-4 10 10", strokeLinejoin: "round" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { children: "Arrastra, pega (Ctrl+V) o haz click para seleccionar" }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { children: "Drag, paste (Ctrl+V) or click to select" }),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             "input",
             {
@@ -703,7 +748,7 @@ var ImageCell = ({ cellId, source, metadata, onExit }) => {
             type: "text",
             value: data.alt,
             onChange: (e) => save({ alt: e.target.value }),
-            placeholder: "Descripcion de la imagen"
+            placeholder: "Image description"
           }
         )
       ] }),
@@ -715,13 +760,13 @@ var ImageCell = ({ cellId, source, metadata, onExit }) => {
             type: "text",
             value: data.caption,
             onChange: (e) => save({ caption: e.target.value }),
-            placeholder: "Pie de imagen (opcional)"
+            placeholder: "Caption (optional)"
           }
         )
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "sci-nb-image-row", children: [
         /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "sci-nb-image-field sci-nb-image-field--small", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("label", { children: "Ancho" }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("label", { children: "Width" }),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("select", { value: data.width, onChange: (e) => save({ width: e.target.value }), children: [
             /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "25%", children: "25%" }),
             /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "50%", children: "50%" }),
@@ -731,38 +776,38 @@ var ImageCell = ({ cellId, source, metadata, onExit }) => {
           ] })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "sci-nb-image-field sci-nb-image-field--small", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("label", { children: "Alinear" }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("label", { children: "Align" }),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("select", { value: data.align, onChange: (e) => save({ align: e.target.value }), children: [
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "left", children: "Izquierda" }),
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "center", children: "Centro" }),
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "right", children: "Derecha" })
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "left", children: "Left" }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "center", children: "Center" }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "right", children: "Right" })
           ] })
         ] }),
-        hasSrc && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { className: "sci-nb-image-clear", onClick: () => save({ src: "" }), children: "Quitar imagen" })
+        hasSrc && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { className: "sci-nb-image-clear", onClick: () => save({ src: "" }), children: "Remove image" })
       ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "sci-nb-cell-hint", children: [
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("kbd", { children: "Esc" }),
-      " salir"
+      " exit"
     ] })
   ] });
 };
 function renderImagePreview(source, metadata) {
   const data = parseImageSource(source, metadata);
   if (!data.src) {
-    return '<div class="sci-nb-image-empty"><span class="sci-nb-placeholder">Click para agregar imagen</span></div>';
+    return '<div class="sci-nb-image-empty"><span class="sci-nb-placeholder">Click to add image</span></div>';
   }
   const alignStyle = `text-align:${data.align}`;
   const widthStyle = `max-width:${data.width};width:auto;max-height:400px`;
   let html = `<div class="sci-nb-image-view" style="${alignStyle}">`;
   html += `<img src="${escapeAttr(data.src)}" alt="${escapeAttr(data.alt)}" style="${widthStyle}" />`;
   if (data.caption) {
-    html += `<p class="sci-nb-image-caption">${escapeHtml2(data.caption)}</p>`;
+    html += `<p class="sci-nb-image-caption">${escapeHtml(data.caption)}</p>`;
   }
   html += `</div>`;
   return html;
 }
-function escapeHtml2(s) {
+function escapeHtml(s) {
   return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
 function escapeAttr(s) {
@@ -888,22 +933,22 @@ var EmbedCell = ({ cellId, source, metadata, onExit }) => {
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { children: "Sandbox" }),
           /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("select", { value: data.sandbox, onChange: (e) => save({ sandbox: e.target.value }), children: [
             /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "allow-scripts allow-same-origin allow-popups", children: "Standard" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "allow-scripts", children: "Solo scripts" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "", children: "Restringido" })
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "allow-scripts", children: "Scripts only" }),
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "", children: "Restricted" })
           ] })
         ] })
       ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "sci-nb-cell-hint", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("kbd", { children: "Esc" }),
-      " salir"
+      " exit"
     ] })
   ] });
 };
 function renderEmbedPreview(source, metadata) {
   const data = parseEmbedSource(source, metadata);
   if (!data.url) {
-    return '<div class="sci-nb-embed-empty"><span class="sci-nb-placeholder">Click para agregar contenido embebido</span></div>';
+    return '<div class="sci-nb-embed-empty"><span class="sci-nb-placeholder">Click to add embedded content</span></div>';
   }
   const titleAttr = data.title ? ` title="${escapeAttr2(data.title)}"` : "";
   return `<div class="sci-nb-embed-view" style="height:${data.height}">
@@ -918,14 +963,14 @@ function escapeAttr2(s) {
 var import_react6 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var DEFAULT_COMMANDS = [
-  { type: "markdown", label: "Texto", description: "Bloque de texto con formato Markdown", icon: "M", keywords: ["text", "markdown", "paragraph", "texto"] },
-  { type: "code", label: "C\xF3digo", description: "Bloque de c\xF3digo con syntax highlighting", icon: "</>", keywords: ["code", "codigo", "script", "program"] },
-  { type: "latex", label: "F\xF3rmula", description: "Editor visual de f\xF3rmulas LaTeX", icon: "\u2211", keywords: ["latex", "math", "formula", "ecuacion", "equation"] },
-  { type: "image", label: "Imagen", description: "Imagen con drag & drop, URL, caption", icon: "\u{1F5BC}", keywords: ["image", "imagen", "foto", "picture", "img"] },
+  { type: "markdown", label: "Text", description: "Markdown formatted text block", icon: "M", keywords: ["text", "markdown", "paragraph"] },
+  { type: "code", label: "Code", description: "Code block with syntax highlighting", icon: "</>", keywords: ["code", "script", "program"] },
+  { type: "latex", label: "Formula", description: "Visual LaTeX formula editor", icon: "\u2211", keywords: ["latex", "math", "formula", "equation"] },
+  { type: "image", label: "Image", description: "Image with drag & drop, URL, caption", icon: "\u{1F5BC}", keywords: ["image", "picture", "photo", "img"] },
   { type: "embed", label: "Embed", description: "YouTube, CodePen, Desmos, iframe", icon: "\u29C9", keywords: ["embed", "iframe", "youtube", "video", "codepen"] },
-  { type: "table", label: "Tabla", description: "Tabla editable con filas y columnas", icon: "\u25A6", keywords: ["table", "tabla", "grid", "spreadsheet"] },
-  { type: "mermaid", label: "Diagrama", description: "Diagrama Mermaid (flowchart, sequence, etc.)", icon: "\u25C7", keywords: ["mermaid", "diagram", "diagrama", "flowchart", "chart"] },
-  { type: "raw", label: "Raw", description: "Texto sin formato", icon: "T", keywords: ["raw", "plain", "text", "crudo"] }
+  { type: "table", label: "Table", description: "Editable table with rows and columns", icon: "\u25A6", keywords: ["table", "grid", "spreadsheet"] },
+  { type: "mermaid", label: "Diagram", description: "Mermaid diagram (flowchart, sequence, etc.)", icon: "\u25C7", keywords: ["mermaid", "diagram", "flowchart", "chart"] },
+  { type: "raw", label: "Raw", description: "Plain unformatted text", icon: "T", keywords: ["raw", "plain", "text"] }
 ];
 var SlashCommand = ({
   position,
@@ -980,7 +1025,7 @@ var SlashCommand = ({
         className: "sci-nb-slash-menu",
         style: { top: position.top, left: position.left },
         children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "sci-nb-slash-empty", children: [
-          'Sin resultados para "/',
+          'No results for "/',
           query,
           '"'
         ] })
@@ -994,7 +1039,7 @@ var SlashCommand = ({
       className: "sci-nb-slash-menu",
       style: { top: position.top, left: position.left },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "sci-nb-slash-header", children: "Insertar bloque" }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "sci-nb-slash-header", children: "Insert block" }),
         filtered.map((cmd, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
           "button",
           {
@@ -1047,6 +1092,8 @@ function toMarkdownTable(data) {
 var TableCell = ({ cellId, source, onExit }) => {
   const engine = useSciNotebook();
   const [data, setData] = (0, import_react7.useState)(() => parseMarkdownTable(source));
+  const [hoverCol, setHoverCol] = (0, import_react7.useState)(null);
+  const [hoverRow, setHoverRow] = (0, import_react7.useState)(null);
   const syncToEngine = (0, import_react7.useCallback)((newData) => {
     setData(newData);
     engine.updateCellSource(cellId, toMarkdownTable(newData));
@@ -1085,142 +1132,104 @@ var TableCell = ({ cellId, source, onExit }) => {
     if (e.key === "Escape") {
       e.preventDefault();
       onExit();
-    } else if (e.key === "Tab" && !e.shiftKey) {
     }
   }, [onExit]);
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "sci-nb-table-editor", onKeyDown: handleKeyDown, children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "sci-nb-table-toolbar", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { onClick: addRow, children: "+ Fila" }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { onClick: addColumn, children: "+ Columna" })
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { onClick: addRow, children: "+ Row" }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { onClick: addColumn, children: "+ Column" })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("table", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("tr", { children: [
-        data.headers.map((h, ci) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("th", { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-          "input",
-          {
-            value: h,
-            onChange: (e) => updateHeader(ci, e.target.value),
-            placeholder: `Col ${ci + 1}`
-          }
-        ) }, ci)),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("th", { style: { width: 30, padding: 0 } })
-      ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("tbody", { children: data.rows.map((row, ri) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("tr", { children: [
-        row.map((cell, ci) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-          "input",
-          {
-            value: cell,
-            onChange: (e) => updateCell(ri, ci, e.target.value),
-            placeholder: "..."
-          }
-        ) }, ci)),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("td", { style: { width: 30, padding: 0, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-          "button",
-          {
-            className: "sci-nb-btn sci-nb-btn--danger",
-            onClick: () => removeRow(ri),
-            title: "Eliminar fila",
-            style: { padding: "2px 4px", fontSize: 10, border: "none", background: "transparent" },
-            children: "\u2715"
-          }
-        ) })
-      ] }, ri)) })
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("tr", { children: data.headers.map((h, ci) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        "th",
+        {
+          className: "sci-nb-table-header-cell",
+          onMouseEnter: () => setHoverCol(ci),
+          onMouseLeave: () => setHoverCol(null),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              "input",
+              {
+                value: h,
+                onChange: (e) => updateHeader(ci, e.target.value),
+                placeholder: `Col ${ci + 1}`
+              }
+            ),
+            data.headers.length > 1 && hoverCol === ci && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              "button",
+              {
+                className: "sci-nb-table-delete-btn",
+                onClick: () => removeColumn(ci),
+                title: "Delete column",
+                children: "\u2715"
+              }
+            )
+          ]
+        },
+        ci
+      )) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("tbody", { children: data.rows.map((row, ri) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        "tr",
+        {
+          onMouseEnter: () => setHoverRow(ri),
+          onMouseLeave: () => setHoverRow(null),
+          children: row.map((cell, ci) => {
+            const isLastCol = ci === row.length - 1;
+            return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+              "td",
+              {
+                className: isLastCol ? "sci-nb-table-row-end" : "",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                    "input",
+                    {
+                      value: cell,
+                      onChange: (e) => updateCell(ri, ci, e.target.value),
+                      placeholder: "..."
+                    }
+                  ),
+                  isLastCol && data.rows.length > 1 && hoverRow === ri && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                    "button",
+                    {
+                      className: "sci-nb-table-delete-btn",
+                      onClick: () => removeRow(ri),
+                      title: "Delete row",
+                      children: "\u2715"
+                    }
+                  )
+                ]
+              },
+              ci
+            );
+          })
+        },
+        ri
+      )) })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "sci-nb-cell-hint", children: [
       /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("kbd", { children: "Tab" }),
-      " siguiente celda \xB7 ",
+      " next cell \xB7 ",
       /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("kbd", { children: "Esc" }),
-      " salir"
+      " exit"
     ] })
   ] });
 };
 function renderTablePreview(source) {
   const data = parseMarkdownTable(source);
-  if (data.headers.length === 0) return "<p>Tabla vac\xEDa</p>";
-  const ths = data.headers.map((h) => `<th>${escapeHtml3(h)}</th>`).join("");
+  if (data.headers.length === 0) return "<p>Empty table</p>";
+  const ths = data.headers.map((h) => `<th>${escapeHtml2(h)}</th>`).join("");
   const trs = data.rows.map(
-    (row) => `<tr>${row.map((c) => `<td>${escapeHtml3(c)}</td>`).join("")}</tr>`
+    (row) => `<tr>${row.map((c) => `<td>${escapeHtml2(c)}</td>`).join("")}</tr>`
   ).join("");
   return `<table class="sci-nb-rendered-table"><thead><tr>${ths}</tr></thead><tbody>${trs}</tbody></table>`;
 }
-function escapeHtml3(s) {
+function escapeHtml2(s) {
   return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
 
-// src/components/CellOutput.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var CellOutputDisplay = ({ outputs }) => {
-  if (!outputs || outputs.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "sci-nb-cell-outputs", children: outputs.map((output, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `sci-nb-output sci-nb-output--${output.outputType}`, children: renderOutput(output) }, i)) });
-};
-function renderOutput(output) {
-  switch (output.outputType) {
-    case "stream":
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("pre", { className: `sci-nb-output-stream sci-nb-output-stream--${output.name}`, children: output.text });
-    case "display": {
-      if (output.data["text/html"]) {
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-          "div",
-          {
-            className: "sci-nb-output-html",
-            dangerouslySetInnerHTML: { __html: output.data["text/html"] }
-          }
-        );
-      }
-      if (output.data["image/svg+xml"]) {
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-          "div",
-          {
-            className: "sci-nb-output-svg",
-            dangerouslySetInnerHTML: { __html: output.data["image/svg+xml"] }
-          }
-        );
-      }
-      if (output.data["image/png"]) {
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-          "img",
-          {
-            className: "sci-nb-output-image",
-            src: `data:image/png;base64,${output.data["image/png"]}`,
-            alt: "Output"
-          }
-        );
-      }
-      if (output.data["image/jpeg"]) {
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-          "img",
-          {
-            className: "sci-nb-output-image",
-            src: `data:image/jpeg;base64,${output.data["image/jpeg"]}`,
-            alt: "Output"
-          }
-        );
-      }
-      if (output.data["application/json"]) {
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("pre", { className: "sci-nb-output-json", children: JSON.stringify(JSON.parse(output.data["application/json"]), null, 2) });
-      }
-      if (output.data["text/plain"]) {
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("pre", { className: "sci-nb-output-text", children: output.data["text/plain"] });
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("pre", { className: "sci-nb-output-text", children: "[Display output]" });
-    }
-    case "error":
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "sci-nb-output-error", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("strong", { className: "sci-nb-output-error-name", children: [
-          output.name,
-          ": "
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "sci-nb-output-error-msg", children: output.message }),
-        output.traceback && output.traceback.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("pre", { className: "sci-nb-output-traceback", children: output.traceback.join("\n") })
-      ] });
-    default:
-      return null;
-  }
-}
-
 // src/components/MermaidCell.tsx
 var import_react8 = require("react");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var mermaidIdCounter = 0;
 var MermaidPreview = ({ source, onClick }) => {
   const [svg, setSvg] = (0, import_react8.useState)(null);
@@ -1263,29 +1272,29 @@ var MermaidPreview = ({ source, onClick }) => {
   }, [source]);
   const mermaid = globalThis.mermaid;
   if (!source.trim()) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "sci-nb-placeholder", children: "Diagrama vacio \u2014 escribe sintaxis Mermaid" }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "sci-nb-placeholder", children: "Empty diagram \u2014 write Mermaid syntax" }) });
   }
   if (!mermaid) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "sci-nb-mermaid-preview", onClick, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("pre", { className: "sci-nb-code", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("code", { className: "language-mermaid", children: source }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { fontSize: 11, color: "#94a3b8", textAlign: "center", padding: 4 }, children: [
-        "Mermaid no disponible. Importa ",
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("code", { children: "mermaid" }),
-        " y exponlo como ",
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("code", { children: "globalThis.mermaid" }),
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "sci-nb-mermaid-preview", onClick, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("pre", { className: "sci-nb-code", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { className: "language-mermaid", children: source }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { fontSize: 11, color: "#94a3b8", textAlign: "center", padding: 4 }, children: [
+        "Mermaid not available. Import ",
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { children: "mermaid" }),
+        " and expose it as ",
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { children: "globalThis.mermaid" }),
         "."
       ] })
     ] });
   }
   if (error) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "sci-nb-mermaid-error", onClick, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("strong", { children: "Mermaid error:" }),
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "sci-nb-mermaid-error", onClick, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("strong", { children: "Mermaid error:" }),
       " ",
       error
     ] });
   }
   if (svg) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "div",
       {
         ref: containerRef,
@@ -1293,125 +1302,361 @@ var MermaidPreview = ({ source, onClick }) => {
         onClick,
         dangerouslySetInnerHTML: { __html: svg }
       }
-    );
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "sci-nb-placeholder", children: "Rendering diagram..." }) });
+};
+function initMermaid(mermaidLib, config) {
+  globalThis.mermaid = mermaidLib;
+  mermaidLib.initialize({
+    startOnLoad: false,
+    theme: "default",
+    securityLevel: "loose",
+    ...config
+  });
+}
+
+// src/components/CodeEditor.tsx
+var import_react9 = require("react");
+var import_notebook_renderer = require("@velo-sci/notebook-renderer");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var CodeEditor = ({
+  source,
+  language,
+  onChange,
+  onKeyDown,
+  placeholder
+}) => {
+  const textareaRef = (0, import_react9.useRef)(null);
+  const preRef = (0, import_react9.useRef)(null);
+  const [highlighted, setHighlighted] = (0, import_react9.useState)("");
+  (0, import_react9.useEffect)(() => {
+    const html = (0, import_notebook_renderer.highlightCodeTokens)(source, language || "text");
+    const match = html.match(/<code[^>]*>([\s\S]*)<\/code>/);
+    setHighlighted(match ? match[1] : html);
+  }, [source, language]);
+  const syncScroll = (0, import_react9.useCallback)(() => {
+    if (textareaRef.current && preRef.current) {
+      preRef.current.scrollTop = textareaRef.current.scrollTop;
+      preRef.current.scrollLeft = textareaRef.current.scrollLeft;
+    }
+  }, []);
+  (0, import_react9.useEffect)(() => {
+    if (textareaRef.current) {
+      const ta = textareaRef.current;
+      ta.style.height = "auto";
+      ta.style.height = `${Math.max(40, ta.scrollHeight)}px`;
+    }
+  }, [source]);
+  (0, import_react9.useEffect)(() => {
+    textareaRef.current?.focus();
+  }, []);
+  const handleChange = (0, import_react9.useCallback)((e) => {
+    onChange(e.target.value);
+  }, [onChange]);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "sci-nb-code-editor-wrap", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      "pre",
+      {
+        ref: preRef,
+        className: "sci-nb-code-editor-highlight sci-nb-code--highlighted",
+        "aria-hidden": "true",
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("code", { className: `language-${language || "text"}`, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { dangerouslySetInnerHTML: { __html: highlighted || "&nbsp;" } }),
+          "\n"
+        ] })
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      "textarea",
+      {
+        ref: textareaRef,
+        className: "sci-nb-code-editor-input",
+        value: source,
+        onChange: handleChange,
+        onKeyDown,
+        onScroll: syncScroll,
+        placeholder,
+        spellCheck: false,
+        autoComplete: "off",
+        autoCapitalize: "off",
+        rows: 1
+      }
+    )
+  ] });
+};
+
+// src/components/CellRenderers.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function renderEditMode(cell, cellId, engine, textareaRef, handleSourceChange, handleKeyDown, placeholder, exitEdit, slashState, onSlashSelect, onSlashClose) {
+  if (cell.type === "latex") {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(MathEditor, { cellId, source: cell.source, onExit: exitEdit });
+  }
+  if (cell.type === "image") {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ImageCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
+  }
+  if (cell.type === "embed") {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(EmbedCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
+  }
+  if (cell.type === "table") {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
+  }
+  if (cell.type === "code") {
+    const lang = cell.metadata.language || "javascript";
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        CodeEditor,
+        {
+          cellId,
+          source: cell.source,
+          language: lang,
+          onChange: (val) => engine.updateCellSource(cellId, val),
+          onKeyDown: handleKeyDown,
+          placeholder
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "sci-nb-cell-hint", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "Shift+Enter" }),
+        " next \xB7 ",
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "Esc" }),
+        " exit"
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
+    cell.type === "markdown" && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(FloatingToolbar, { cellId, textareaRef }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      "textarea",
+      {
+        ref: textareaRef,
+        className: "sci-nb-editor",
+        value: cell.source,
+        onChange: handleSourceChange,
+        onKeyDown: handleKeyDown,
+        placeholder,
+        spellCheck: cell.type === "markdown",
+        rows: 1
+      }
+    ),
+    slashState && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      SlashCommand,
+      {
+        position: slashState.pos,
+        query: slashState.query,
+        onSelect: onSlashSelect,
+        onClose: onSlashClose
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "sci-nb-cell-hint", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "/" }),
+      " commands \xB7 ",
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "Shift+Enter" }),
+      " next \xB7 ",
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "Esc" }),
+      " exit"
+    ] })
+  ] });
+}
+function renderViewMode(cell, renderedHtml, isEmpty, placeholder, enterEdit) {
+  if (cell.type === "image") {
+    const html = renderImagePreview(cell.source, cell.metadata);
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "sci-nb-preview", onClick: enterEdit, dangerouslySetInnerHTML: { __html: html } });
+  }
+  if (cell.type === "embed") {
+    const html = renderEmbedPreview(cell.source, cell.metadata);
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "sci-nb-preview sci-nb-preview--embed", onClick: enterEdit, dangerouslySetInnerHTML: { __html: html } });
+  }
+  if (cell.type === "table") {
+    const html = renderTablePreview(cell.source);
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "sci-nb-preview", onClick: enterEdit, dangerouslySetInnerHTML: { __html: html } });
+  }
+  if (cell.type === "mermaid") {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(MermaidPreview, { source: cell.source, onClick: enterEdit });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    "div",
+    {
+      className: `sci-nb-preview ${isEmpty ? "sci-nb-preview--empty" : ""}`,
+      onClick: enterEdit,
+      dangerouslySetInnerHTML: isEmpty ? { __html: `<span class="sci-nb-placeholder">${placeholder}</span>` } : { __html: renderedHtml }
+    }
+  );
+}
+
+// src/components/CellOutput.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var CellOutputDisplay = ({ outputs }) => {
+  if (!outputs || outputs.length === 0) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "sci-nb-cell-outputs", children: outputs.map((output, i) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: `sci-nb-output sci-nb-output--${output.outputType}`, children: renderOutput(output) }, i)) });
+};
+function renderOutput(output) {
+  switch (output.outputType) {
+    case "stream":
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("pre", { className: `sci-nb-output-stream sci-nb-output-stream--${output.name}`, children: output.text });
+    case "display": {
+      if (output.data["text/html"]) {
+        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          "div",
+          {
+            className: "sci-nb-output-html",
+            dangerouslySetInnerHTML: { __html: output.data["text/html"] }
+          }
+        );
+      }
+      if (output.data["image/svg+xml"]) {
+        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          "div",
+          {
+            className: "sci-nb-output-svg",
+            dangerouslySetInnerHTML: { __html: output.data["image/svg+xml"] }
+          }
+        );
+      }
+      if (output.data["image/png"]) {
+        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          "img",
+          {
+            className: "sci-nb-output-image",
+            src: `data:image/png;base64,${output.data["image/png"]}`,
+            alt: "Output"
+          }
+        );
+      }
+      if (output.data["image/jpeg"]) {
+        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          "img",
+          {
+            className: "sci-nb-output-image",
+            src: `data:image/jpeg;base64,${output.data["image/jpeg"]}`,
+            alt: "Output"
+          }
+        );
+      }
+      if (output.data["application/json"]) {
+        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("pre", { className: "sci-nb-output-json", children: JSON.stringify(JSON.parse(output.data["application/json"]), null, 2) });
+      }
+      if (output.data["text/plain"]) {
+        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("pre", { className: "sci-nb-output-text", children: output.data["text/plain"] });
+      }
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("pre", { className: "sci-nb-output-text", children: "[Display output]" });
+    }
+    case "error":
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "sci-nb-output-error", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("strong", { className: "sci-nb-output-error-name", children: [
+          output.name,
+          ": "
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "sci-nb-output-error-msg", children: output.message }),
+        output.traceback && output.traceback.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("pre", { className: "sci-nb-output-traceback", children: output.traceback.join("\n") })
+      ] });
+    default:
+      return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "sci-nb-placeholder", children: "Renderizando diagrama..." }) });
-};
-function initMermaid(mermaidLib, config) {
-  globalThis.mermaid = mermaidLib;
-  mermaidLib.initialize({
-    startOnLoad: false,
-    theme: "default",
-    securityLevel: "loose",
-    ...config
-  });
 }
 
 // src/components/Cell.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var CELL_TYPES = [
   { value: "markdown", label: "Markdown", icon: "M" },
   { value: "code", label: "Code", icon: "</>" },
   { value: "raw", label: "Raw", icon: "T" },
   { value: "latex", label: "LaTeX", icon: "\u2211" },
-  { value: "image", label: "Imagen", icon: "\u{1F5BC}" },
+  { value: "image", label: "Image", icon: "\u{1F5BC}" },
   { value: "embed", label: "Embed", icon: "\u29C9" }
 ];
 var PLACEHOLDERS = {
-  markdown: "Escribe markdown aqui... (click para editar)",
-  code: "Escribe codigo aqui...",
-  raw: "Texto raw...",
-  latex: "Escribe LaTeX aqui... e.g. \\int_0^1 x^2 dx",
-  image: "Click para agregar imagen",
-  embed: "Click para agregar contenido embebido"
+  markdown: "Write markdown here... (click to edit)",
+  code: "Write code here...",
+  raw: "Raw text...",
+  latex: "Write LaTeX here... e.g. \\int_0^1 x^2 dx",
+  image: "Click to add image",
+  embed: "Click to add embedded content"
 };
 var Cell = ({ cellId, pipeline, index, totalCells }) => {
   const cell = useCell(cellId);
   const engine = useSciNotebook();
-  const textareaRef = (0, import_react9.useRef)(null);
-  const cellRef = (0, import_react9.useRef)(null);
-  const [showTypeMenu, setShowTypeMenu] = (0, import_react9.useState)(false);
-  const [hovered, setHovered] = (0, import_react9.useState)(false);
-  const [slashState, setSlashState] = (0, import_react9.useState)(null);
-  const [dragOver, setDragOver] = (0, import_react9.useState)(null);
-  const [isDragging, setIsDragging] = (0, import_react9.useState)(false);
-  const rendered = (0, import_react9.useMemo)(() => {
+  const textareaRef = (0, import_react10.useRef)(null);
+  const cellRef = (0, import_react10.useRef)(null);
+  const [showTypeMenu, setShowTypeMenu] = (0, import_react10.useState)(false);
+  const [hovered, setHovered] = (0, import_react10.useState)(false);
+  const [slashState, setSlashState] = (0, import_react10.useState)(null);
+  const [dragOver, setDragOver] = (0, import_react10.useState)(null);
+  const [isDragging, setIsDragging] = (0, import_react10.useState)(false);
+  const rendered = (0, import_react10.useMemo)(() => {
     if (!cell) return { html: "", cellId: "", renderTime: 0, cached: false };
     return pipeline.render(cell);
   }, [cell?.source, cell?.type, cell?.metadata, pipeline]);
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (cell?.editing && textareaRef.current) {
       const ta = textareaRef.current;
       ta.style.height = "auto";
       ta.style.height = `${Math.max(40, ta.scrollHeight)}px`;
     }
   }, [cell?.source, cell?.editing]);
-  (0, import_react9.useEffect)(() => {
-    if (cell?.editing && textareaRef.current) {
-      textareaRef.current.focus();
-    }
+  (0, import_react10.useEffect)(() => {
+    if (cell?.editing && textareaRef.current) textareaRef.current.focus();
   }, [cell?.editing]);
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (!showTypeMenu) return;
     const handler = (e) => {
-      if (cellRef.current && !cellRef.current.contains(e.target)) {
-        setShowTypeMenu(false);
-      }
+      if (cellRef.current && !cellRef.current.contains(e.target)) setShowTypeMenu(false);
     };
     document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [showTypeMenu]);
-  const handleSourceChange = (0, import_react9.useCallback)((e) => {
+  const handleSourceChange = (0, import_react10.useCallback)((e) => {
     const val = e.target.value;
     engine.updateCellSource(cellId, val);
     const ta = e.target;
     const cursor = ta.selectionStart;
     const textBefore = val.slice(0, cursor);
     const lastNewline = textBefore.lastIndexOf("\n");
-    const lineStart = lastNewline + 1;
-    const currentLine = textBefore.slice(lineStart);
+    const currentLine = textBefore.slice(lastNewline + 1);
     if (currentLine.startsWith("/")) {
-      const query = currentLine.slice(1);
       const rect = ta.getBoundingClientRect();
-      const lineHeight = 22;
       const lines = textBefore.split("\n").length;
-      setSlashState({
-        query,
-        pos: { top: rect.top + lines * lineHeight + 4 - ta.scrollTop, left: rect.left + 8 }
-      });
+      setSlashState({ query: currentLine.slice(1), pos: { top: rect.top + lines * 22 + 4 - ta.scrollTop, left: rect.left + 8 } });
     } else {
       setSlashState(null);
     }
   }, [engine, cellId]);
-  const enterEdit = (0, import_react9.useCallback)(() => {
+  const enterEdit = (0, import_react10.useCallback)(() => {
     engine.setEditMode(cellId);
     engine.focusCell(cellId);
   }, [engine, cellId]);
-  const exitEdit = (0, import_react9.useCallback)(() => {
+  const exitEdit = (0, import_react10.useCallback)(() => {
     engine.setViewMode(cellId);
   }, [engine, cellId]);
-  const handleSlashSelect = (0, import_react9.useCallback)((type) => {
+  const handleSlashSelect = (0, import_react10.useCallback)((type) => {
     const val = cell?.source || "";
     const ta = textareaRef.current;
     if (ta) {
       const cursor = ta.selectionStart;
       const textBefore = val.slice(0, cursor);
-      const lastNewline = textBefore.lastIndexOf("\n");
-      const lineStart = lastNewline + 1;
-      const cleaned = val.slice(0, lineStart) + val.slice(cursor);
-      engine.updateCellSource(cellId, cleaned.trim());
+      const lineStart = textBefore.lastIndexOf("\n") + 1;
+      engine.updateCellSource(cellId, (val.slice(0, lineStart) + val.slice(cursor)).trim());
     }
     engine.setCellType(cellId, type);
     setSlashState(null);
   }, [engine, cellId, cell?.source]);
-  const handleKeyDown = (0, import_react9.useCallback)((e) => {
-    if (slashState) {
-      if (["ArrowDown", "ArrowUp", "Enter"].includes(e.key)) return;
-      if (e.key === "Escape") {
-        e.preventDefault();
-        setSlashState(null);
-        return;
+  const wrapSelection = (0, import_react10.useCallback)((before, after) => {
+    const ta = textareaRef.current;
+    if (!ta) return;
+    const { selectionStart: start, selectionEnd: end, value: val } = ta;
+    engine.updateCellSource(cellId, val.substring(0, start) + before + val.substring(start, end) + after + val.substring(end));
+    requestAnimationFrame(() => {
+      if (textareaRef.current) {
+        textareaRef.current.selectionStart = start + before.length;
+        textareaRef.current.selectionEnd = end + before.length;
       }
+    });
+  }, [engine, cellId]);
+  const handleKeyDown = (0, import_react10.useCallback)((e) => {
+    if (slashState && ["ArrowDown", "ArrowUp", "Enter"].includes(e.key)) return;
+    if (slashState && e.key === "Escape") {
+      e.preventDefault();
+      setSlashState(null);
+      return;
     }
     if (e.key === "Escape") {
       e.preventDefault();
@@ -1432,30 +1677,24 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
       e.preventDefault();
       const ta = e.currentTarget;
       const start = ta.selectionStart;
-      const end = ta.selectionEnd;
-      const val = ta.value;
-      const newVal = val.substring(0, start) + "  " + val.substring(end);
-      engine.updateCellSource(cellId, newVal);
+      engine.updateCellSource(cellId, ta.value.substring(0, start) + "  " + ta.value.substring(ta.selectionEnd));
       requestAnimationFrame(() => {
         if (textareaRef.current) {
-          textareaRef.current.selectionStart = start + 2;
-          textareaRef.current.selectionEnd = start + 2;
+          textareaRef.current.selectionStart = textareaRef.current.selectionEnd = start + 2;
         }
       });
     } else if (e.key === "Tab" && e.shiftKey) {
       e.preventDefault();
       const ta = e.currentTarget;
       const start = ta.selectionStart;
-      const val = ta.value;
-      const before = val.substring(0, start);
+      const before = ta.value.substring(0, start);
       const trimmed = before.replace(/  $/, "");
       if (trimmed !== before) {
-        engine.updateCellSource(cellId, trimmed + val.substring(start));
         const diff = before.length - trimmed.length;
+        engine.updateCellSource(cellId, trimmed + ta.value.substring(start));
         requestAnimationFrame(() => {
           if (textareaRef.current) {
-            textareaRef.current.selectionStart = start - diff;
-            textareaRef.current.selectionEnd = start - diff;
+            textareaRef.current.selectionStart = textareaRef.current.selectionEnd = start - diff;
           }
         });
       }
@@ -1466,27 +1705,12 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
       e.preventDefault();
       wrapSelection("*", "*");
     }
-  }, [engine, cellId, exitEdit]);
-  const wrapSelection = (0, import_react9.useCallback)((before, after) => {
-    const ta = textareaRef.current;
-    if (!ta) return;
-    const start = ta.selectionStart;
-    const end = ta.selectionEnd;
-    const val = ta.value;
-    const newVal = val.substring(0, start) + before + val.substring(start, end) + after + val.substring(end);
-    engine.updateCellSource(cellId, newVal);
-    requestAnimationFrame(() => {
-      if (textareaRef.current) {
-        textareaRef.current.selectionStart = start + before.length;
-        textareaRef.current.selectionEnd = end + before.length;
-      }
-    });
-  }, [engine, cellId]);
+  }, [engine, cellId, exitEdit, slashState, wrapSelection]);
   if (!cell) return null;
   const isEditing = !!cell.editing;
   const isEmpty = !cell.source.trim();
   const placeholder = PLACEHOLDERS[cell.type] || "Click to edit...";
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
     "div",
     {
       ref: cellRef,
@@ -1513,18 +1737,14 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
         e.preventDefault();
         e.dataTransfer.dropEffect = "move";
         const rect = e.currentTarget.getBoundingClientRect();
-        const midY = rect.top + rect.height / 2;
-        setDragOver(e.clientY < midY ? "top" : "bottom");
+        setDragOver(e.clientY < rect.top + rect.height / 2 ? "top" : "bottom");
       },
       onDragLeave: () => setDragOver(null),
       onDrop: (e) => {
         e.preventDefault();
-        const draggedId = e.dataTransfer.getData("text/plain");
+        const did = e.dataTransfer.getData("text/plain");
         setDragOver(null);
-        if (draggedId && draggedId !== cellId) {
-          const targetIdx = dragOver === "top" ? index : index + 1;
-          engine.moveCell(draggedId, targetIdx);
-        }
+        if (did && did !== cellId) engine.moveCell(did, dragOver === "top" ? index : index + 1);
       },
       "data-testid": `cell-${cell.id}`,
       "data-editing": String(isEditing),
@@ -1537,35 +1757,27 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
       onMouseLeave: () => setHovered(false),
       onClick: () => engine.focusCell(cellId),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "sci-nb-cell-gutter", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "sci-nb-cell-handle", title: "Drag to reorder", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("svg", { width: "12", height: "20", viewBox: "0 0 12 20", fill: "currentColor", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "3", cy: "4", r: "1.5" }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "9", cy: "4", r: "1.5" }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "3", cy: "10", r: "1.5" }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "9", cy: "10", r: "1.5" }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "3", cy: "16", r: "1.5" }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "9", cy: "16", r: "1.5" })
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "sci-nb-cell-gutter", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "sci-nb-cell-handle", title: "Drag to reorder", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("svg", { width: "12", height: "20", viewBox: "0 0 12 20", fill: "currentColor", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { cx: "3", cy: "4", r: "1.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { cx: "9", cy: "4", r: "1.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { cx: "3", cy: "10", r: "1.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { cx: "9", cy: "10", r: "1.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { cx: "3", cy: "16", r: "1.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { cx: "9", cy: "16", r: "1.5" })
           ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "sci-nb-cell-index", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "sci-nb-cell-index", children: [
             "[",
             index + 1,
             "]"
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "sci-nb-cell-badge-wrap", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            "button",
-            {
-              className: "sci-nb-cell-badge",
-              onClick: (e) => {
-                e.stopPropagation();
-                setShowTypeMenu(!showTypeMenu);
-              },
-              title: "Change cell type",
-              children: CELL_TYPES.find((ct) => ct.value === cell.type)?.icon || cell.type.slice(0, 2).toUpperCase()
-            }
-          ),
-          showTypeMenu && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "sci-nb-type-menu", children: CELL_TYPES.map((ct) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "sci-nb-cell-badge-wrap", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "sci-nb-cell-badge", onClick: (e) => {
+            e.stopPropagation();
+            setShowTypeMenu(!showTypeMenu);
+          }, title: "Change cell type", children: CELL_TYPES.find((ct) => ct.value === cell.type)?.icon || cell.type.slice(0, 2).toUpperCase() }),
+          showTypeMenu && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "sci-nb-type-menu", children: CELL_TYPES.map((ct) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
             "button",
             {
               className: `sci-nb-type-option ${cell.type === ct.value ? "sci-nb-type-option--active" : ""}`,
@@ -1575,173 +1787,46 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
                 setShowTypeMenu(false);
               },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "sci-nb-type-option-icon", children: ct.icon }),
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "sci-nb-type-option-icon", children: ct.icon }),
                 ct.label
               ]
             },
             ct.value
           )) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "sci-nb-cell-content", children: [
-          isEditing ? renderEditMode(cell, cellId, textareaRef, handleSourceChange, handleKeyDown, placeholder, exitEdit, slashState, handleSlashSelect, () => setSlashState(null)) : renderViewMode(cell, rendered.html, isEmpty, placeholder, enterEdit),
-          cell.outputs && cell.outputs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CellOutputDisplay, { outputs: cell.outputs })
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "sci-nb-cell-content", children: [
+          isEditing ? renderEditMode(cell, cellId, engine, textareaRef, handleSourceChange, handleKeyDown, placeholder, exitEdit, slashState, handleSlashSelect, () => setSlashState(null)) : renderViewMode(cell, rendered.html, isEmpty, placeholder, enterEdit),
+          cell.outputs && cell.outputs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CellOutputDisplay, { outputs: cell.outputs })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "sci-nb-cell-actions", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            "button",
-            {
-              className: "sci-nb-btn",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.moveCell(cellId, index - 1);
-              },
-              disabled: index === 0,
-              title: "Move up",
-              children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M7 11V3M7 3L3 7M7 3l4 4", strokeLinecap: "round", strokeLinejoin: "round" }) })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            "button",
-            {
-              className: "sci-nb-btn",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.moveCell(cellId, index + 1);
-              },
-              disabled: index >= totalCells - 1,
-              title: "Move down",
-              children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M7 3v8M7 11l-4-4M7 11l4-4", strokeLinecap: "round", strokeLinejoin: "round" }) })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            "button",
-            {
-              className: "sci-nb-btn",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.duplicateCell(cellId);
-              },
-              title: "Duplicate cell",
-              children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("rect", { x: "4", y: "4", width: "8", height: "8", rx: "1.5" }),
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M10 2H3.5A1.5 1.5 0 002 3.5V10" })
-              ] })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            "button",
-            {
-              className: "sci-nb-btn sci-nb-btn--danger",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.deleteCell(cellId);
-              },
-              title: "Delete cell",
-              children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M3 4h8M5.5 4V3a1 1 0 011-1h1a1 1 0 011 1v1M6 6.5v3M8 6.5v3M4 4l.5 7a1.5 1.5 0 001.5 1.5h2A1.5 1.5 0 0010 11l.5-7", strokeLinecap: "round", strokeLinejoin: "round" }) })
-            }
-          )
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "sci-nb-cell-actions", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "sci-nb-btn", onClick: (e) => {
+            e.stopPropagation();
+            engine.moveCell(cellId, index - 1);
+          }, disabled: index === 0, title: "Move up", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M7 11V3M7 3L3 7M7 3l4 4", strokeLinecap: "round", strokeLinejoin: "round" }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "sci-nb-btn", onClick: (e) => {
+            e.stopPropagation();
+            engine.moveCell(cellId, index + 1);
+          }, disabled: index >= totalCells - 1, title: "Move down", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M7 3v8M7 11l-4-4M7 11l4-4", strokeLinecap: "round", strokeLinejoin: "round" }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "sci-nb-btn", onClick: (e) => {
+            e.stopPropagation();
+            engine.duplicateCell(cellId);
+          }, title: "Duplicate cell", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", { x: "4", y: "4", width: "8", height: "8", rx: "1.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M10 2H3.5A1.5 1.5 0 002 3.5V10" })
+          ] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "sci-nb-btn sci-nb-btn--danger", onClick: (e) => {
+            e.stopPropagation();
+            engine.deleteCell(cellId);
+          }, title: "Delete cell", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M3 4h8M5.5 4V3a1 1 0 011-1h1a1 1 0 011 1v1M6 6.5v3M8 6.5v3M4 4l.5 7a1.5 1.5 0 001.5 1.5h2A1.5 1.5 0 0010 11l.5-7", strokeLinecap: "round", strokeLinejoin: "round" }) }) })
         ] })
       ]
     }
   );
 };
-function renderEditMode(cell, cellId, textareaRef, handleSourceChange, handleKeyDown, placeholder, exitEdit, slashState, onSlashSelect, onSlashClose) {
-  if (cell.type === "latex") {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(MathEditor, { cellId, source: cell.source, onExit: exitEdit });
-  }
-  if (cell.type === "image") {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ImageCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
-  }
-  if (cell.type === "embed") {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(EmbedCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
-  }
-  if (cell.type === "table") {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
-    cell.type === "markdown" && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(FloatingToolbar, { cellId, textareaRef }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      "textarea",
-      {
-        ref: textareaRef,
-        className: "sci-nb-editor",
-        value: cell.source,
-        onChange: handleSourceChange,
-        onKeyDown: handleKeyDown,
-        placeholder,
-        spellCheck: cell.type === "markdown",
-        rows: 1
-      }
-    ),
-    slashState && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      SlashCommand,
-      {
-        position: slashState.pos,
-        query: slashState.query,
-        onSelect: onSlashSelect,
-        onClose: onSlashClose
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "sci-nb-cell-hint", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "/" }),
-      " comandos \xB7 ",
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "Shift+Enter" }),
-      " siguiente \xB7 ",
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { children: "Esc" }),
-      " salir"
-    ] })
-  ] });
-}
-function renderViewMode(cell, renderedHtml, isEmpty, placeholder, enterEdit) {
-  if (cell.type === "image") {
-    const html = renderImagePreview(cell.source, cell.metadata);
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      "div",
-      {
-        className: "sci-nb-preview",
-        onClick: enterEdit,
-        dangerouslySetInnerHTML: { __html: html }
-      }
-    );
-  }
-  if (cell.type === "embed") {
-    const html = renderEmbedPreview(cell.source, cell.metadata);
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      "div",
-      {
-        className: "sci-nb-preview sci-nb-preview--embed",
-        onClick: enterEdit,
-        dangerouslySetInnerHTML: { __html: html }
-      }
-    );
-  }
-  if (cell.type === "table") {
-    const html = renderTablePreview(cell.source);
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      "div",
-      {
-        className: "sci-nb-preview",
-        onClick: enterEdit,
-        dangerouslySetInnerHTML: { __html: html }
-      }
-    );
-  }
-  if (cell.type === "mermaid") {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(MermaidPreview, { source: cell.source, onClick: enterEdit });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-    "div",
-    {
-      className: `sci-nb-preview ${isEmpty ? "sci-nb-preview--empty" : ""}`,
-      onClick: enterEdit,
-      dangerouslySetInnerHTML: isEmpty ? { __html: `<span class="sci-nb-placeholder">${placeholder}</span>` } : { __html: renderedHtml }
-    }
-  );
-}
 
 // src/components/InsertHandle.tsx
-var import_react10 = require("react");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_react11 = require("react");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var INSERT_TYPES = [
   { type: "markdown", label: "Markdown", icon: "M" },
   { type: "code", label: "Code", icon: "</>" },
@@ -1752,9 +1837,9 @@ var INSERT_TYPES = [
 ];
 var InsertHandle = ({ index }) => {
   const engine = useSciNotebook();
-  const [open, setOpen] = (0, import_react10.useState)(false);
-  const menuRef = (0, import_react10.useRef)(null);
-  (0, import_react10.useEffect)(() => {
+  const [open, setOpen] = (0, import_react11.useState)(false);
+  const menuRef = (0, import_react11.useRef)(null);
+  (0, import_react11.useEffect)(() => {
     if (!open) return;
     const onClickOutside = (e) => {
       if (menuRef.current && !menuRef.current.contains(e.target)) {
@@ -1775,27 +1860,27 @@ var InsertHandle = ({ index }) => {
       }
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "sci-nb-insert-handle", ref: menuRef, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "sci-nb-insert-line", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "sci-nb-insert-handle", ref: menuRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "sci-nb-insert-line", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       "button",
       {
         className: "sci-nb-insert-btn",
         onClick: () => setOpen(!open),
         title: "Insert cell",
-        children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("line", { x1: "8", y1: "3", x2: "8", y2: "13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("line", { x1: "3", y1: "8", x2: "13", y2: "8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("line", { x1: "8", y1: "3", x2: "8", y2: "13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("line", { x1: "3", y1: "8", x2: "13", y2: "8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
         ] })
       }
     ) }),
-    open && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "sci-nb-insert-menu", children: INSERT_TYPES.map((ct) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "sci-nb-insert-menu", children: INSERT_TYPES.map((ct) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
       "button",
       {
         className: "sci-nb-insert-option",
         onClick: () => handleInsert(ct.type),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "sci-nb-insert-option-icon", children: ct.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: ct.label })
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "sci-nb-insert-option-icon", children: ct.icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: ct.label })
         ]
       },
       ct.type
@@ -1804,12 +1889,12 @@ var InsertHandle = ({ index }) => {
 };
 
 // src/components/TOCSidebar.tsx
-var import_react11 = require("react");
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_react12 = require("react");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 var TOCSidebar = ({ focusedCellId }) => {
   const notebook = useNotebook();
   const engine = useSciNotebook();
-  const items = (0, import_react11.useMemo)(() => {
+  const items = (0, import_react12.useMemo)(() => {
     if (!notebook) return [];
     const result = [];
     for (const cell of notebook.cells) {
@@ -1828,16 +1913,16 @@ var TOCSidebar = ({ focusedCellId }) => {
     }
     return result;
   }, [notebook]);
-  const handleClick = (0, import_react11.useCallback)((cellId) => {
+  const handleClick = (0, import_react12.useCallback)((cellId) => {
     engine.focusCell(cellId);
     engine.setEditMode(cellId);
     const el = document.querySelector(`[data-testid="cell-${cellId}"]`);
     if (el) el.scrollIntoView({ behavior: "smooth", block: "center" });
   }, [engine]);
   if (items.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("nav", { className: "sci-nb-toc", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "sci-nb-toc-title", children: "Contenido" }),
-    items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("nav", { className: "sci-nb-toc", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "sci-nb-toc-title", children: "Contenido" }),
+    items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       "button",
       {
         className: [
@@ -1855,21 +1940,21 @@ var TOCSidebar = ({ focusedCellId }) => {
 };
 
 // src/components/FindReplace.tsx
-var import_react12 = require("react");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_react13 = require("react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var FindReplace = ({ onClose }) => {
   const notebook = useNotebook();
   const engine = useSciNotebook();
-  const [query, setQuery] = (0, import_react12.useState)("");
-  const [replacement, setReplacement] = (0, import_react12.useState)("");
-  const [showReplace, setShowReplace] = (0, import_react12.useState)(false);
-  const [caseSensitive, setCaseSensitive] = (0, import_react12.useState)(false);
-  const [currentIdx, setCurrentIdx] = (0, import_react12.useState)(0);
-  const inputRef = (0, import_react12.useRef)(null);
-  (0, import_react12.useEffect)(() => {
+  const [query, setQuery] = (0, import_react13.useState)("");
+  const [replacement, setReplacement] = (0, import_react13.useState)("");
+  const [showReplace, setShowReplace] = (0, import_react13.useState)(false);
+  const [caseSensitive, setCaseSensitive] = (0, import_react13.useState)(false);
+  const [currentIdx, setCurrentIdx] = (0, import_react13.useState)(0);
+  const inputRef = (0, import_react13.useRef)(null);
+  (0, import_react13.useEffect)(() => {
     inputRef.current?.focus();
   }, []);
-  const matches = (0, import_react12.useMemo)(() => {
+  const matches = (0, import_react13.useMemo)(() => {
     if (!query || !notebook) return [];
     const result = [];
     const q = caseSensitive ? query : query.toLowerCase();
@@ -1885,27 +1970,27 @@ var FindReplace = ({ onClose }) => {
     }
     return result;
   }, [query, notebook, caseSensitive]);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     setCurrentIdx(0);
   }, [query, caseSensitive]);
-  const navigateToMatch = (0, import_react12.useCallback)((match) => {
+  const navigateToMatch = (0, import_react13.useCallback)((match) => {
     engine.focusCell(match.cellId);
     const el = document.querySelector(`[data-testid="cell-${match.cellId}"]`);
     if (el) el.scrollIntoView({ behavior: "smooth", block: "center" });
   }, [engine]);
-  const goNext = (0, import_react12.useCallback)(() => {
+  const goNext = (0, import_react13.useCallback)(() => {
     if (matches.length === 0) return;
     const next = (currentIdx + 1) % matches.length;
     setCurrentIdx(next);
     navigateToMatch(matches[next]);
   }, [matches, currentIdx, navigateToMatch]);
-  const goPrev = (0, import_react12.useCallback)(() => {
+  const goPrev = (0, import_react13.useCallback)(() => {
     if (matches.length === 0) return;
     const prev = (currentIdx - 1 + matches.length) % matches.length;
     setCurrentIdx(prev);
     navigateToMatch(matches[prev]);
   }, [matches, currentIdx, navigateToMatch]);
-  const replaceCurrent = (0, import_react12.useCallback)(() => {
+  const replaceCurrent = (0, import_react13.useCallback)(() => {
     if (matches.length === 0) return;
     const match = matches[currentIdx];
     if (!match) return;
@@ -1914,7 +1999,7 @@ var FindReplace = ({ onClose }) => {
     const newSource = cell.source.slice(0, match.index) + replacement + cell.source.slice(match.index + match.length);
     engine.updateCellSource(match.cellId, newSource);
   }, [matches, currentIdx, replacement, notebook, engine]);
-  const replaceAll = (0, import_react12.useCallback)(() => {
+  const replaceAll = (0, import_react13.useCallback)(() => {
     if (matches.length === 0 || !notebook) return;
     const byCellId = /* @__PURE__ */ new Map();
     for (const m of matches) {
@@ -1933,7 +2018,7 @@ var FindReplace = ({ onClose }) => {
       engine.updateCellSource(cellId, src);
     }
   }, [matches, replacement, notebook, engine]);
-  const handleKeyDown = (0, import_react12.useCallback)((e) => {
+  const handleKeyDown = (0, import_react13.useCallback)((e) => {
     if (e.key === "Escape") {
       e.preventDefault();
       onClose();
@@ -1946,21 +2031,21 @@ var FindReplace = ({ onClose }) => {
       setShowReplace((v) => !v);
     }
   }, [onClose, goNext, goPrev]);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "sci-nb-find-bar", onKeyDown: handleKeyDown, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "sci-nb-find-bar", onKeyDown: handleKeyDown, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "input",
       {
         ref: inputRef,
         type: "text",
         value: query,
         onChange: (e) => setQuery(e.target.value),
-        placeholder: "Buscar..."
+        placeholder: "Search..."
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "sci-nb-find-count", children: matches.length > 0 ? `${currentIdx + 1}/${matches.length}` : query ? "0" : "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { onClick: goPrev, title: "Anterior (Shift+Enter)", children: "\u25B2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { onClick: goNext, title: "Siguiente (Enter)", children: "\u25BC" }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "sci-nb-find-count", children: matches.length > 0 ? `${currentIdx + 1}/${matches.length}` : query ? "0" : "" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { onClick: goPrev, title: "Previous (Shift+Enter)", children: "\u25B2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { onClick: goNext, title: "Next (Enter)", children: "\u25BC" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "button",
       {
         onClick: () => setCaseSensitive((v) => !v),
@@ -1969,29 +2054,29 @@ var FindReplace = ({ onClose }) => {
         children: "Aa"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("button", { onClick: () => setShowReplace((v) => !v), title: "Reemplazar (Ctrl+H)", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("button", { onClick: () => setShowReplace((v) => !v), title: "Replace (Ctrl+H)", children: [
       showReplace ? "\u25BE" : "\u25B8",
-      " Reemplazar"
+      " Replace"
     ] }),
-    showReplace && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    showReplace && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         "input",
         {
           type: "text",
           value: replacement,
           onChange: (e) => setReplacement(e.target.value),
-          placeholder: "Reemplazar con..."
+          placeholder: "Replace with..."
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { onClick: replaceCurrent, title: "Reemplazar actual", children: "1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { onClick: replaceAll, title: "Reemplazar todos", children: "\u2200" })
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { onClick: replaceCurrent, title: "Replace current", children: "1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { onClick: replaceAll, title: "Replace all", children: "\u2200" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { onClick: onClose, title: "Cerrar (Esc)", children: "\u2715" })
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { onClick: onClose, title: "Close (Esc)", children: "\u2715" })
   ] });
 };
 
 // src/components/SciNotebook.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var SciNotebook = ({
   notebook: initialNotebook,
   engine: providedEngine,
@@ -2007,7 +2092,7 @@ var SciNotebook = ({
   engineRef,
   showTOC: showTOCProp = false
 }) => {
-  const engine = (0, import_react13.useMemo)(() => {
+  const engine = (0, import_react14.useMemo)(() => {
     if (providedEngine) return providedEngine;
     if (initialContent && !initialNotebook) {
       const cells2 = parseInitialContent(initialContent);
@@ -2026,37 +2111,37 @@ var SciNotebook = ({
     }
     return (0, import_notebook_core.createNotebook)({ notebook: initialNotebook, config: { plugins } });
   }, [providedEngine]);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (engineRef) engineRef.current = engine;
     return () => {
       if (engineRef) engineRef.current = null;
     };
   }, [engine, engineRef]);
-  const [notebook, setNotebook] = (0, import_react13.useState)(initialNotebook || engine.getNotebook());
-  (0, import_react13.useEffect)(() => {
+  const [notebook, setNotebook] = (0, import_react14.useState)(initialNotebook || engine.getNotebook());
+  (0, import_react14.useEffect)(() => {
     const unsub = engine.on("notebook:updated", (payload) => {
       setNotebook(payload.data.notebook);
       if (onChange) onChange(payload.data.notebook);
     });
     return unsub;
   }, [engine, onChange]);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (!onCellFocus) return;
     return engine.on("cell:focused", (payload) => {
       onCellFocus(payload.data.cellId);
     });
   }, [engine, onCellFocus]);
-  const pipeline = (0, import_react13.useMemo)(() => new import_notebook_renderer.RenderPipeline(), []);
+  const pipeline = (0, import_react14.useMemo)(() => new import_notebook_renderer2.RenderPipeline(), []);
   const cells = notebook.cells;
-  const [showFind, setShowFind] = (0, import_react13.useState)(false);
-  const [showTOC, setShowTOC] = (0, import_react13.useState)(showTOCProp);
-  const [focusedCellId, setFocusedCellId] = (0, import_react13.useState)(null);
-  (0, import_react13.useEffect)(() => {
+  const [showFind, setShowFind] = (0, import_react14.useState)(false);
+  const [showTOC, setShowTOC] = (0, import_react14.useState)(showTOCProp);
+  const [focusedCellId, setFocusedCellId] = (0, import_react14.useState)(null);
+  (0, import_react14.useEffect)(() => {
     return engine.on("cell:focused", (payload) => {
       setFocusedCellId(payload.data.cellId);
     });
   }, [engine]);
-  const handleGlobalKeyDown = (0, import_react13.useCallback)((e) => {
+  const handleGlobalKeyDown = (0, import_react14.useCallback)((e) => {
     if (readOnly) return;
     if ((e.ctrlKey || e.metaKey) && e.key === "f") {
       e.preventDefault();
@@ -2065,7 +2150,7 @@ var SciNotebook = ({
     }
     engine.handleKeyDown(e.nativeEvent);
   }, [engine, readOnly]);
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(NotebookContext.Provider, { value: engine, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(NotebookContext.Provider, { value: engine, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     "div",
     {
       className: `sci-nb ${className || ""}`,
@@ -2074,10 +2159,10 @@ var SciNotebook = ({
       onKeyDown: handleGlobalKeyDown,
       tabIndex: 0,
       children: [
-        showToolbar && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "sci-nb-toolbar", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "sci-nb-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "sci-nb-toolbar-title", children: notebook.title }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "sci-nb-toolbar-group", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+        showToolbar && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "sci-nb-toolbar", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "sci-nb-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "sci-nb-toolbar-title", children: notebook.title }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "sci-nb-toolbar-group", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2085,12 +2170,12 @@ var SciNotebook = ({
                 disabled: !engine.canUndo(),
                 title: "Undo (Ctrl+Z)",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M3 7h6a3 3 0 010 6H7M3 7l3-3M3 7l3 3", strokeLinecap: "round", strokeLinejoin: "round" }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: "M3 7h6a3 3 0 010 6H7M3 7l3-3M3 7l3 3", strokeLinecap: "round", strokeLinejoin: "round" }) }),
                   "Undo"
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2099,12 +2184,12 @@ var SciNotebook = ({
                 title: "Redo (Ctrl+Shift+Z)",
                 children: [
                   "Redo",
-                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M11 7H5a3 3 0 000 6h2M11 7l-3-3M11 7l-3 3", strokeLinecap: "round", strokeLinejoin: "round" }) })
+                  /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: "M11 7H5a3 3 0 000 6h2M11 7l-3-3M11 7l-3 3", strokeLinecap: "round", strokeLinejoin: "round" }) })
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "sci-nb-toolbar-sep" }),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "sci-nb-toolbar-sep" }),
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2113,7 +2198,7 @@ var SciNotebook = ({
                 children: "Edit All"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2122,17 +2207,17 @@ var SciNotebook = ({
                 children: "View All"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "sci-nb-toolbar-sep" }),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "sci-nb-toolbar-sep" }),
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
                 onClick: () => setShowFind((v) => !v),
                 title: "Find & Replace (Ctrl+F)",
-                children: "Buscar"
+                children: "Find"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               "button",
               {
                 className: `sci-nb-toolbar-btn ${showTOC ? "sci-nb-toolbar-btn--active" : ""}`,
@@ -2143,23 +2228,23 @@ var SciNotebook = ({
             )
           ] })
         ] }),
-        showFind && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FindReplace, { onClose: () => setShowFind(false) }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "sci-nb-layout", style: { display: "flex", gap: 16 }, children: [
-          showTOC && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(TOCSidebar, { focusedCellId }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "sci-nb-cells", style: { flex: 1 }, children: [
-            cells.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "sci-nb-empty", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "sci-nb-empty-icon", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("svg", { width: "48", height: "48", viewBox: "0 0 48 48", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("rect", { x: "8", y: "6", width: "32", height: "36", rx: "4" }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("line", { x1: "14", y1: "14", x2: "34", y2: "14" }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("line", { x1: "14", y1: "22", x2: "28", y2: "22" }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("line", { x1: "14", y1: "30", x2: "22", y2: "30" })
+        showFind && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FindReplace, { onClose: () => setShowFind(false) }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "sci-nb-layout", style: { display: "flex", gap: 16 }, children: [
+          showTOC && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(TOCSidebar, { focusedCellId }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "sci-nb-cells", style: { flex: 1 }, children: [
+            cells.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "sci-nb-empty", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "sci-nb-empty-icon", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("svg", { width: "48", height: "48", viewBox: "0 0 48 48", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("rect", { x: "8", y: "6", width: "32", height: "36", rx: "4" }),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("line", { x1: "14", y1: "14", x2: "34", y2: "14" }),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("line", { x1: "14", y1: "22", x2: "28", y2: "22" }),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("line", { x1: "14", y1: "30", x2: "22", y2: "30" })
               ] }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { children: "Notebook vacio. Agrega una celda para comenzar." }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(InsertHandle, { index: 0 })
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { children: "Empty notebook. Add a cell to get started." }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(InsertHandle, { index: 0 })
             ] }),
-            cells.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(InsertHandle, { index: 0 }),
-            cells.map((cell, idx) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_react13.default.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            cells.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(InsertHandle, { index: 0 }),
+            cells.map((cell, idx) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react14.default.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                 Cell,
                 {
                   cellId: cell.id,
@@ -2168,7 +2253,7 @@ var SciNotebook = ({
                   totalCells: cells.length
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(InsertHandle, { index: idx + 1 })
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(InsertHandle, { index: idx + 1 })
             ] }, cell.id))
           ] })
         ] })
@@ -2190,8 +2275,8 @@ function parseInitialContent(content) {
 }
 
 // src/components/LatexAutocomplete.tsx
-var import_react14 = require("react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_react15 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 var LATEX_COMMANDS = [
   // Structures
   { cmd: "\\frac{}{}", desc: "Fracci\xF3n", category: "struct" },
@@ -2323,19 +2408,19 @@ var LatexAutocomplete = ({
   onSelect,
   onClose
 }) => {
-  const [selectedIndex, setSelectedIndex] = (0, import_react14.useState)(0);
-  const menuRef = (0, import_react14.useRef)(null);
-  const filtered = (0, import_react14.useMemo)(() => {
+  const [selectedIndex, setSelectedIndex] = (0, import_react15.useState)(0);
+  const menuRef = (0, import_react15.useRef)(null);
+  const filtered = (0, import_react15.useMemo)(() => {
     if (!query) return LATEX_COMMANDS.slice(0, 12);
     const q = query.toLowerCase();
     return LATEX_COMMANDS.filter(
       (c) => c.cmd.toLowerCase().includes(q) || c.desc.toLowerCase().includes(q)
     ).slice(0, 10);
   }, [query]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     setSelectedIndex(0);
   }, [query]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     const handleKey = (e) => {
       if (e.key === "ArrowDown") {
         e.preventDefault();
@@ -2360,23 +2445,23 @@ var LatexAutocomplete = ({
     return () => document.removeEventListener("keydown", handleKey, true);
   }, [filtered, selectedIndex, onSelect, onClose]);
   if (filtered.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     "div",
     {
       ref: menuRef,
       className: "sci-nb-slash-menu",
       style: { top: position.top, left: position.left, minWidth: 220 },
-      children: filtered.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+      children: filtered.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
         "button",
         {
           className: `sci-nb-slash-item ${i === selectedIndex ? "sci-nb-slash-item--active" : ""}`,
           onMouseEnter: () => setSelectedIndex(i),
           onClick: () => onSelect(item.cmd),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "sci-nb-slash-icon", style: { fontFamily: "monospace", fontSize: 11 }, children: item.desc.length <= 2 ? item.desc : item.cmd.slice(0, 4) }),
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "sci-nb-slash-text", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "sci-nb-slash-label", style: { fontFamily: "monospace", fontSize: 12 }, children: item.cmd }),
-              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "sci-nb-slash-desc", children: item.desc })
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "sci-nb-slash-icon", style: { fontFamily: "monospace", fontSize: 11 }, children: item.desc.length <= 2 ? item.desc : item.cmd.slice(0, 4) }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "sci-nb-slash-text", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "sci-nb-slash-label", style: { fontFamily: "monospace", fontSize: 12 }, children: item.cmd }),
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "sci-nb-slash-desc", children: item.desc })
             ] })
           ]
         },
@@ -2387,15 +2472,15 @@ var LatexAutocomplete = ({
 };
 
 // src/components/GhostText.tsx
-var import_react15 = require("react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_react16 = require("react");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var GhostText = ({
   text,
   textareaRef,
   onAccept,
   onDismiss
 }) => {
-  const handleKeyDown = (0, import_react15.useCallback)((e) => {
+  const handleKeyDown = (0, import_react16.useCallback)((e) => {
     if (e.key === "Tab" && !e.shiftKey) {
       e.preventDefault();
       e.stopPropagation();
@@ -2405,7 +2490,7 @@ var GhostText = ({
       onDismiss();
     }
   }, [onAccept, onDismiss]);
-  (0, import_react15.useEffect)(() => {
+  (0, import_react16.useEffect)(() => {
     const ta2 = textareaRef.current;
     if (!ta2) return;
     ta2.addEventListener("keydown", handleKeyDown, true);
@@ -2423,7 +2508,7 @@ var GhostText = ({
   const left = lines[lines.length - 1].length * charWidth;
   const firstLine = text.split("\n")[0];
   const hasMore = text.includes("\n");
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "div",
     {
       className: "sci-nb-ghost-text",
@@ -2441,15 +2526,15 @@ var GhostText = ({
       children: [
         firstLine,
         hasMore ? "..." : "",
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { style: { fontSize: 10, opacity: 0.5, marginLeft: 8 }, children: "Tab \u21B9" })
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { style: { fontSize: 10, opacity: 0.5, marginLeft: 8 }, children: "Tab \u21B9" })
       ]
     }
   );
 };
 
 // src/components/ChatSidebar.tsx
-var import_react16 = require("react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_react17 = require("react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var ChatSidebar = ({
   onSend,
   systemPrompt,
@@ -2457,23 +2542,23 @@ var ChatSidebar = ({
   onClose
 }) => {
   const engine = useSciNotebook();
-  const [messages, setMessages] = (0, import_react16.useState)(() => {
+  const [messages, setMessages] = (0, import_react17.useState)(() => {
     if (systemPrompt) {
       return [{ role: "system", content: systemPrompt, timestamp: Date.now() }];
     }
     return [];
   });
-  const [input, setInput] = (0, import_react16.useState)("");
-  const [loading, setLoading] = (0, import_react16.useState)(false);
-  const messagesEndRef = (0, import_react16.useRef)(null);
-  const inputRef = (0, import_react16.useRef)(null);
-  (0, import_react16.useEffect)(() => {
+  const [input, setInput] = (0, import_react17.useState)("");
+  const [loading, setLoading] = (0, import_react17.useState)(false);
+  const messagesEndRef = (0, import_react17.useRef)(null);
+  const inputRef = (0, import_react17.useRef)(null);
+  (0, import_react17.useEffect)(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages]);
-  (0, import_react16.useEffect)(() => {
+  (0, import_react17.useEffect)(() => {
     inputRef.current?.focus();
   }, []);
-  const handleSend = (0, import_react16.useCallback)(async () => {
+  const handleSend = (0, import_react17.useCallback)(async () => {
     const text = input.trim();
     if (!text || loading) return;
     const userMsg = { role: "user", content: text, timestamp: Date.now() };
@@ -2511,17 +2596,17 @@ var ChatSidebar = ({
       setLoading(false);
     }
   }, [input, messages, loading, onSend]);
-  const handleKeyDown = (0, import_react16.useCallback)((e) => {
+  const handleKeyDown = (0, import_react17.useCallback)((e) => {
     if (e.key === "Enter" && !e.shiftKey) {
       e.preventDefault();
       handleSend();
     }
   }, [handleSend]);
   const visibleMessages = messages.filter((m) => m.role !== "system");
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "sci-nb-chat-sidebar", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "sci-nb-chat-header", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { children: "AI Assistant" }),
-      onClose && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "sci-nb-chat-sidebar", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "sci-nb-chat-header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: "AI Assistant" }),
+      onClose && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         "button",
         {
           onClick: onClose,
@@ -2530,11 +2615,11 @@ var ChatSidebar = ({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "sci-nb-chat-messages", children: [
-      visibleMessages.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { textAlign: "center", color: "#94a3b8", padding: 24 }, children: "Ask me anything about your notebook..." }),
-      visibleMessages.map((msg, i) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: `sci-nb-chat-msg sci-nb-chat-msg--${msg.role}`, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children: msg.content }),
-        msg.role === "assistant" && onApply && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "sci-nb-chat-messages", children: [
+      visibleMessages.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { textAlign: "center", color: "#94a3b8", padding: 24 }, children: "Ask me anything about your notebook..." }),
+      visibleMessages.map((msg, i) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: `sci-nb-chat-msg sci-nb-chat-msg--${msg.role}`, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { children: msg.content }),
+        msg.role === "assistant" && onApply && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
           "button",
           {
             onClick: () => onApply(msg.content),
@@ -2551,11 +2636,11 @@ var ChatSidebar = ({
           }
         )
       ] }, i)),
-      loading && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "sci-nb-chat-msg sci-nb-chat-msg--assistant", style: { opacity: 0.6 }, children: "Thinking..." }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { ref: messagesEndRef })
+      loading && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "sci-nb-chat-msg sci-nb-chat-msg--assistant", style: { opacity: 0.6 }, children: "Thinking..." }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { ref: messagesEndRef })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "sci-nb-chat-input", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "sci-nb-chat-input", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         "input",
         {
           ref: inputRef,
@@ -2567,14 +2652,14 @@ var ChatSidebar = ({
           disabled: loading
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("button", { onClick: handleSend, disabled: loading || !input.trim(), children: "Send" })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("button", { onClick: handleSend, disabled: loading || !input.trim(), children: "Send" })
     ] })
   ] });
 };
 
 // src/components/ImageResize.tsx
-var import_react17 = require("react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_react18 = require("react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var ImageResize = ({
   src,
   alt = "",
@@ -2583,12 +2668,12 @@ var ImageResize = ({
   onResize,
   children
 }) => {
-  const containerRef = (0, import_react17.useRef)(null);
-  const imgRef = (0, import_react17.useRef)(null);
-  const [dragging, setDragging] = (0, import_react17.useState)(false);
-  const [width, setWidth] = (0, import_react17.useState)(null);
-  const startRef = (0, import_react17.useRef)({ x: 0, w: 0 });
-  const handleMouseDown = (0, import_react17.useCallback)((e) => {
+  const containerRef = (0, import_react18.useRef)(null);
+  const imgRef = (0, import_react18.useRef)(null);
+  const [dragging, setDragging] = (0, import_react18.useState)(false);
+  const [width, setWidth] = (0, import_react18.useState)(null);
+  const startRef = (0, import_react18.useRef)({ x: 0, w: 0 });
+  const handleMouseDown = (0, import_react18.useCallback)((e) => {
     e.preventDefault();
     e.stopPropagation();
     const img = imgRef.current;
@@ -2596,7 +2681,7 @@ var ImageResize = ({
     startRef.current = { x: e.clientX, w: img.offsetWidth };
     setDragging(true);
   }, []);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     if (!dragging) return;
     const handleMouseMove = (e) => {
       const dx = e.clientX - startRef.current.x;
@@ -2624,8 +2709,8 @@ var ImageResize = ({
     position: "relative",
     display: "inline-block"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { ref: containerRef, className: "sci-nb-image-resizable", style, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { ref: containerRef, className: "sci-nb-image-resizable", style, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       "img",
       {
         ref: imgRef,
@@ -2636,7 +2721,7 @@ var ImageResize = ({
       }
     ),
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       "div",
       {
         className: "sci-nb-image-resize-handle sci-nb-image-resize-handle--se",
@@ -2647,28 +2732,28 @@ var ImageResize = ({
 };
 
 // src/components/VirtualRenderer.tsx
-var import_react18 = require("react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_react19 = require("react");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var VirtualRenderer = ({
   cells,
   pipeline,
   estimatedHeight = 120,
   overscan = 5
 }) => {
-  const containerRef = (0, import_react18.useRef)(null);
-  const [visibleRange, setVisibleRange] = (0, import_react18.useState)({ start: 0, end: 20 });
-  const cellHeights = (0, import_react18.useRef)(/* @__PURE__ */ new Map());
-  const getHeight = (0, import_react18.useCallback)((index) => {
+  const containerRef = (0, import_react19.useRef)(null);
+  const [visibleRange, setVisibleRange] = (0, import_react19.useState)({ start: 0, end: 20 });
+  const cellHeights = (0, import_react19.useRef)(/* @__PURE__ */ new Map());
+  const getHeight = (0, import_react19.useCallback)((index) => {
     return cellHeights.current.get(index) ?? estimatedHeight;
   }, [estimatedHeight]);
-  const totalHeight = (0, import_react18.useMemo)(() => {
+  const totalHeight = (0, import_react19.useMemo)(() => {
     let h = 0;
     for (let i = 0; i < cells.length; i++) {
       h += getHeight(i) + 32;
     }
     return h;
   }, [cells.length, getHeight]);
-  (0, import_react18.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     const container = containerRef.current;
     if (!container) return;
     const handleScroll = () => {
@@ -2697,7 +2782,7 @@ var VirtualRenderer = ({
     container.addEventListener("scroll", handleScroll, { passive: true });
     return () => container.removeEventListener("scroll", handleScroll);
   }, [cells.length, getHeight, overscan]);
-  const measureRef = (0, import_react18.useCallback)((index) => {
+  const measureRef = (0, import_react19.useCallback)((index) => {
     return (el) => {
       if (!el) return;
       const observer = new ResizeObserver((entries) => {
@@ -2711,7 +2796,7 @@ var VirtualRenderer = ({
       observer.observe(el);
     };
   }, []);
-  const topOffset = (0, import_react18.useMemo)(() => {
+  const topOffset = (0, import_react19.useMemo)(() => {
     let h = 0;
     for (let i = 0; i < visibleRange.start; i++) {
       h += getHeight(i) + 32;
@@ -2719,18 +2804,18 @@ var VirtualRenderer = ({
     return h;
   }, [visibleRange.start, getHeight]);
   const visibleCells = cells.slice(visibleRange.start, visibleRange.end);
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "div",
     {
       ref: containerRef,
       className: "sci-nb-virtual-container",
       style: { height: "100%", overflow: "auto", position: "relative" },
-      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { height: totalHeight, position: "relative" }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { position: "absolute", top: topOffset, left: 0, right: 0 }, children: [
-        visibleRange.start === 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(InsertHandle, { index: 0 }),
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { height: totalHeight, position: "relative" }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { position: "absolute", top: topOffset, left: 0, right: 0 }, children: [
+        visibleRange.start === 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(InsertHandle, { index: 0 }),
         visibleCells.map((cell, i) => {
           const realIndex = visibleRange.start + i;
-          return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { ref: measureRef(realIndex), children: [
-            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { ref: measureRef(realIndex), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
               Cell,
               {
                 cellId: cell.id,
@@ -2739,7 +2824,7 @@ var VirtualRenderer = ({
                 totalCells: cells.length
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(InsertHandle, { index: realIndex + 1 })
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(InsertHandle, { index: realIndex + 1 })
           ] }, cell.id);
         })
       ] }) })
@@ -2748,8 +2833,8 @@ var VirtualRenderer = ({
 };
 
 // src/components/AIRewrite.tsx
-var import_react19 = require("react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_react20 = require("react");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var AIRewrite = ({
   selectedText,
   position,
@@ -2757,15 +2842,15 @@ var AIRewrite = ({
   onAccept,
   onReject
 }) => {
-  const [state, setState] = (0, import_react19.useState)("prompt");
-  const [instruction, setInstruction] = (0, import_react19.useState)("");
-  const [result, setResult] = (0, import_react19.useState)("");
-  const [error, setError] = (0, import_react19.useState)(null);
-  const inputRef = (0, import_react19.useRef)(null);
-  (0, import_react19.useEffect)(() => {
+  const [state, setState] = (0, import_react20.useState)("prompt");
+  const [instruction, setInstruction] = (0, import_react20.useState)("");
+  const [result, setResult] = (0, import_react20.useState)("");
+  const [error, setError] = (0, import_react20.useState)(null);
+  const inputRef = (0, import_react20.useRef)(null);
+  (0, import_react20.useEffect)(() => {
     inputRef.current?.focus();
   }, []);
-  const handleSubmit = (0, import_react19.useCallback)(async () => {
+  const handleSubmit = (0, import_react20.useCallback)(async () => {
     if (!instruction.trim()) return;
     setState("loading");
     setError(null);
@@ -2778,7 +2863,7 @@ var AIRewrite = ({
       setState("prompt");
     }
   }, [instruction, selectedText, onRewrite]);
-  const handleKeyDown = (0, import_react19.useCallback)((e) => {
+  const handleKeyDown = (0, import_react20.useCallback)((e) => {
     if (e.key === "Enter" && !e.shiftKey) {
       e.preventDefault();
       handleSubmit();
@@ -2787,15 +2872,15 @@ var AIRewrite = ({
       onReject();
     }
   }, [handleSubmit, onReject]);
-  const handleAccept = (0, import_react19.useCallback)(() => {
+  const handleAccept = (0, import_react20.useCallback)(() => {
     onAccept(result);
   }, [result, onAccept]);
-  const handleRetry = (0, import_react19.useCallback)(() => {
+  const handleRetry = (0, import_react20.useCallback)(() => {
     setState("prompt");
     setResult("");
     inputRef.current?.focus();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "div",
     {
       className: "sci-nb-ai-rewrite",
@@ -2806,13 +2891,13 @@ var AIRewrite = ({
         zIndex: 100
       },
       children: [
-        state === "prompt" && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-prompt", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-selected", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "sci-nb-ai-rewrite-label", children: "Selected:" }),
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "sci-nb-ai-rewrite-text", children: selectedText.length > 80 ? selectedText.slice(0, 80) + "..." : selectedText })
+        state === "prompt" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-prompt", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-selected", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "sci-nb-ai-rewrite-label", children: "Selected:" }),
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "sci-nb-ai-rewrite-text", children: selectedText.length > 80 ? selectedText.slice(0, 80) + "..." : selectedText })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-input-row", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-input-row", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
               "input",
               {
                 ref: inputRef,
@@ -2824,7 +2909,7 @@ var AIRewrite = ({
                 className: "sci-nb-ai-rewrite-input"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
               "button",
               {
                 onClick: handleSubmit,
@@ -2833,24 +2918,24 @@ var AIRewrite = ({
                 children: "Rewrite"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
           ] }),
-          error && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "sci-nb-ai-rewrite-error", children: error })
+          error && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "sci-nb-ai-rewrite-error", children: error })
         ] }),
-        state === "loading" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "sci-nb-ai-rewrite-loading", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { children: "Rewriting..." }) }),
-        state === "preview" && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-preview", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-diff", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-diff-old", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Original:" }),
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("pre", { children: selectedText })
+        state === "loading" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "sci-nb-ai-rewrite-loading", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Rewriting..." }) }),
+        state === "preview" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-preview", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-diff", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-diff-old", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Original:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("pre", { children: selectedText })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-diff-new", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Rewritten:" }),
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("pre", { children: result })
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-diff-new", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Rewritten:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("pre", { children: result })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "sci-nb-ai-rewrite-actions", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sci-nb-ai-rewrite-actions", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
               "button",
               {
                 onClick: handleAccept,
@@ -2858,8 +2943,8 @@ var AIRewrite = ({
                 children: "Accept"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { onClick: handleRetry, className: "sci-nb-ai-rewrite-btn", children: "Retry" }),
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Reject" })
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: handleRetry, className: "sci-nb-ai-rewrite-btn", children: "Retry" }),
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Reject" })
           ] })
         ] })
       ]
@@ -2868,22 +2953,22 @@ var AIRewrite = ({
 };
 
 // src/components/AICellGenerate.tsx
-var import_react20 = require("react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_react21 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var AICellGenerate = ({
   onGenerate,
   onAccept,
   onCancel
 }) => {
-  const [state, setState] = (0, import_react20.useState)("prompt");
-  const [prompt, setPrompt] = (0, import_react20.useState)("");
-  const [cells, setCells] = (0, import_react20.useState)([]);
-  const [error, setError] = (0, import_react20.useState)(null);
-  const inputRef = (0, import_react20.useRef)(null);
-  (0, import_react20.useEffect)(() => {
+  const [state, setState] = (0, import_react21.useState)("prompt");
+  const [prompt, setPrompt] = (0, import_react21.useState)("");
+  const [cells, setCells] = (0, import_react21.useState)([]);
+  const [error, setError] = (0, import_react21.useState)(null);
+  const inputRef = (0, import_react21.useRef)(null);
+  (0, import_react21.useEffect)(() => {
     inputRef.current?.focus();
   }, []);
-  const handleGenerate = (0, import_react20.useCallback)(async () => {
+  const handleGenerate = (0, import_react21.useCallback)(async () => {
     if (!prompt.trim()) return;
     setState("loading");
     setError(null);
@@ -2896,7 +2981,7 @@ var AICellGenerate = ({
       setState("prompt");
     }
   }, [prompt, onGenerate]);
-  const handleKeyDown = (0, import_react20.useCallback)((e) => {
+  const handleKeyDown = (0, import_react21.useCallback)((e) => {
     if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
       e.preventDefault();
       handleGenerate();
@@ -2905,10 +2990,10 @@ var AICellGenerate = ({
       onCancel();
     }
   }, [handleGenerate, onCancel]);
-  const handleAccept = (0, import_react20.useCallback)(() => {
+  const handleAccept = (0, import_react21.useCallback)(() => {
     onAccept(cells);
   }, [cells, onAccept]);
-  const handleRegenerate = (0, import_react20.useCallback)(() => {
+  const handleRegenerate = (0, import_react21.useCallback)(() => {
     setState("prompt");
     setCells([]);
     inputRef.current?.focus();
@@ -2921,13 +3006,13 @@ var AICellGenerate = ({
     mermaid: "Mermaid",
     raw: "Raw"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "sci-nb-ai-generate", children: [
-    state === "prompt" && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "sci-nb-ai-generate-prompt", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "sci-nb-ai-generate-header", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M8 1v14M1 8h14", strokeLinecap: "round" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { children: "Generate cells with AI" })
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sci-nb-ai-generate", children: [
+    state === "prompt" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sci-nb-ai-generate-prompt", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sci-nb-ai-generate-header", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M8 1v14M1 8h14", strokeLinecap: "round" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Generate cells with AI" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
         "textarea",
         {
           ref: inputRef,
@@ -2939,8 +3024,8 @@ var AICellGenerate = ({
           rows: 3
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "sci-nb-ai-generate-actions", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sci-nb-ai-generate-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           "button",
           {
             onClick: handleGenerate,
@@ -2949,24 +3034,24 @@ var AICellGenerate = ({
             children: "Generate (Ctrl+Enter)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
       ] }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "sci-nb-ai-rewrite-error", children: error })
+      error && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "sci-nb-ai-rewrite-error", children: error })
     ] }),
-    state === "loading" && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "sci-nb-ai-generate-loading", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { children: "Generating cells..." }) }),
-    state === "preview" && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "sci-nb-ai-generate-preview", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "sci-nb-ai-generate-header", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { children: [
+    state === "loading" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "sci-nb-ai-generate-loading", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Generating cells..." }) }),
+    state === "preview" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sci-nb-ai-generate-preview", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "sci-nb-ai-generate-header", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { children: [
         "Generated ",
         cells.length,
         " cell",
         cells.length !== 1 ? "s" : ""
       ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "sci-nb-ai-generate-cells", children: cells.map((cell, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "sci-nb-ai-generate-cell", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "sci-nb-ai-generate-cell-badge", children: CELL_TYPE_LABELS[cell.type] || cell.type }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("pre", { className: "sci-nb-ai-generate-cell-source", children: cell.source.length > 200 ? cell.source.slice(0, 200) + "..." : cell.source })
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "sci-nb-ai-generate-cells", children: cells.map((cell, i) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sci-nb-ai-generate-cell", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "sci-nb-ai-generate-cell-badge", children: CELL_TYPE_LABELS[cell.type] || cell.type }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("pre", { className: "sci-nb-ai-generate-cell-source", children: cell.source.length > 200 ? cell.source.slice(0, 200) + "..." : cell.source })
       ] }, i)) }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "sci-nb-ai-generate-actions", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sci-nb-ai-generate-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
           "button",
           {
             onClick: handleAccept,
@@ -2979,8 +3064,8 @@ var AICellGenerate = ({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: handleRegenerate, className: "sci-nb-ai-rewrite-btn", children: "Regenerate" }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: handleRegenerate, className: "sci-nb-ai-rewrite-btn", children: "Regenerate" }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
       ] })
     ] })
   ] });