@velo-sci/notebook-react 0.6.1 → 0.6.3

package/dist/index.js

@@ -56,12 +56,12 @@ function useNotebookEvent(type, handler) {
 }
 
 // src/components/SciNotebook.tsx
-import React12, { useMemo as useMemo6, useEffect as useEffect10, useState as useState12, useCallback as useCallback11 } from "react";
+import React13, { useMemo as useMemo5, useEffect as useEffect11, useState as useState13, useCallback as useCallback12 } from "react";
 import { createNotebook } from "@velo-sci/notebook-core";
 import { RenderPipeline } from "@velo-sci/notebook-renderer";
 
 // src/components/Cell.tsx
-import { useMemo as useMemo3, useCallback as useCallback8, useRef as useRef6, useEffect as useEffect7, useState as useState9 } from "react";
+import { useMemo as useMemo2, useCallback as useCallback9, useRef as useRef7, useEffect as useEffect8, useState as useState10 } from "react";
 
 // src/components/FloatingToolbar.tsx
 import { useEffect as useEffect2, useRef, useState as useState2, useCallback } from "react";
@@ -192,10 +192,11 @@ function parseInlineStyle(css) {
 
 // src/components/MathEditor.tsx
 import { useState as useState3, useCallback as useCallback2, useRef as useRef2, useEffect as useEffect3 } from "react";
-import { jsx as jsx2, jsxs } from "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 },
@@ -212,7 +213,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Integrales",
+    name: "Integrals",
     icon: "\u222B",
     blocks: [
       { label: "\u222B", latex: "\\int{\u25A2}\\,d{\u25A2}", cursor: 5 },
@@ -223,7 +224,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Sumatorias",
+    name: "Summations",
     icon: "\u2211",
     blocks: [
       { label: "\u2211", latex: "\\sum_{\u25A2}^{\u25A2}{\u25A2}", cursor: 5 },
@@ -240,11 +241,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" },
@@ -275,7 +276,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Operadores",
+    name: "Operators",
     icon: "\xB1",
     blocks: [
       { label: "\xB1", latex: "\\pm" },
@@ -307,7 +308,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Flechas",
+    name: "Arrows",
     icon: "\u2192",
     blocks: [
       { label: "\u2192", latex: "\\rightarrow" },
@@ -322,7 +323,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Funciones",
+    name: "Functions",
     icon: "f(x)",
     blocks: [
       { label: "sin", latex: "\\sin{\u25A2}", cursor: 5 },
@@ -338,7 +339,7 @@ var MATH_CATEGORIES = [
     ]
   },
   {
-    name: "Delimitadores",
+    name: "Delimiters",
     icon: "()",
     blocks: [
       { label: "(\u2026)", latex: "\\left( \u25A2 \\right)", cursor: 7 },
@@ -351,9 +352,12 @@ var MATH_CATEGORIES = [
     ]
   }
 ];
+
+// src/components/MathEditor.tsx
+import { jsx as jsx2, jsxs } from "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, {
@@ -363,14 +367,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 = useRef2(null);
+  const containerRef = useRef2(null);
   const [activeCategory, setActiveCategory] = useState3(0);
   const [showRaw, setShowRaw] = useState3(false);
   const innerLatex = source.replace(/^\$\$\s*/, "").replace(/\s*\$\$$/, "").trim();
@@ -407,15 +410,42 @@ $$`);
       }
     });
   }, [innerLatex, updateSource]);
+  const exitAndNext = useCallback2(() => {
+    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 = useCallback2((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]);
+  useEffect3(() => {
+    if (showRaw && textareaRef.current) {
+      textareaRef.current.focus();
+    } else if (containerRef.current) {
+      containerRef.current.focus();
+    }
+  }, [showRaw]);
+  useEffect3(() => {
+    if (containerRef.current) {
+      containerRef.current.focus();
+    }
+  }, []);
   useEffect3(() => {
     if (showRaw && textareaRef.current) {
       const ta = textareaRef.current;
@@ -424,82 +454,97 @@ $$`);
     }
   }, [innerLatex, showRaw]);
   const category = MATH_CATEGORIES[activeCategory];
-  return /* @__PURE__ */ jsxs("div", { className: "sci-nb-math-editor", onKeyDown: handleKeyDown, children: [
-    /* @__PURE__ */ jsx2("div", { className: "sci-nb-math-tabs", children: MATH_CATEGORIES.map((cat, i) => /* @__PURE__ */ jsxs(
-      "button",
-      {
-        className: `sci-nb-math-tab ${i === activeCategory ? "sci-nb-math-tab--active" : ""}`,
-        onClick: () => setActiveCategory(i),
-        title: cat.name,
-        children: [
-          /* @__PURE__ */ jsx2("span", { className: "sci-nb-math-tab-icon", children: cat.icon }),
-          /* @__PURE__ */ jsx2("span", { className: "sci-nb-math-tab-label", children: cat.name })
-        ]
-      },
-      cat.name
-    )) }),
-    /* @__PURE__ */ jsx2("div", { className: "sci-nb-math-palette", children: category.blocks.map((block, i) => /* @__PURE__ */ jsx2(
-      "button",
-      {
-        className: "sci-nb-math-block",
-        onClick: () => insertBlock(block),
-        title: block.latex,
-        children: block.label
-      },
-      i
-    )) }),
-    /* @__PURE__ */ jsxs("div", { className: "sci-nb-math-editor-area", children: [
-      /* @__PURE__ */ jsxs("div", { className: "sci-nb-math-mode-toggle", children: [
-        /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: "sci-nb-math-editor",
+      onKeyDown: handleKeyDown,
+      tabIndex: -1,
+      children: [
+        /* @__PURE__ */ jsx2("div", { className: "sci-nb-math-tabs", children: MATH_CATEGORIES.map((cat, i) => /* @__PURE__ */ jsxs(
           "button",
           {
-            className: `sci-nb-math-mode-btn ${!showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
-            onClick: () => setShowRaw(false),
-            children: "Preview"
-          }
-        ),
-        /* @__PURE__ */ jsx2(
+            className: `sci-nb-math-tab ${i === activeCategory ? "sci-nb-math-tab--active" : ""}`,
+            onClick: () => setActiveCategory(i),
+            title: cat.name,
+            tabIndex: -1,
+            children: [
+              /* @__PURE__ */ jsx2("span", { className: "sci-nb-math-tab-icon", children: cat.icon }),
+              /* @__PURE__ */ jsx2("span", { className: "sci-nb-math-tab-label", children: cat.name })
+            ]
+          },
+          cat.name
+        )) }),
+        /* @__PURE__ */ jsx2("div", { className: "sci-nb-math-palette", children: category.blocks.map((block, i) => /* @__PURE__ */ jsx2(
           "button",
           {
-            className: `sci-nb-math-mode-btn ${showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
-            onClick: () => setShowRaw(true),
-            children: "LaTeX"
-          }
-        )
-      ] }),
-      showRaw ? /* @__PURE__ */ jsx2(
-        "textarea",
-        {
-          ref: textareaRef,
-          className: "sci-nb-math-raw",
-          value: innerLatex,
-          onChange: handleRawChange,
-          placeholder: "Escribe LaTeX aqui...",
-          spellCheck: false,
-          autoFocus: true
-        }
-      ) : /* @__PURE__ */ jsxs("div", { className: "sci-nb-math-visual", children: [
-        /* @__PURE__ */ jsx2(
-          "div",
-          {
-            className: "sci-nb-math-preview",
-            dangerouslySetInnerHTML: { __html: renderLatexPreview(source) }
-          }
-        ),
-        /* @__PURE__ */ jsxs("p", { className: "sci-nb-math-visual-hint", children: [
-          "Haz click en los bloques de arriba para construir tu formula. Cambia a modo ",
-          /* @__PURE__ */ jsx2("strong", { children: "LaTeX" }),
-          " para editar directamente."
+            className: "sci-nb-math-block",
+            onClick: () => insertBlock(block),
+            title: block.latex,
+            tabIndex: -1,
+            children: block.label
+          },
+          i
+        )) }),
+        /* @__PURE__ */ jsxs("div", { className: "sci-nb-math-editor-area", children: [
+          /* @__PURE__ */ jsxs("div", { className: "sci-nb-math-mode-toggle", children: [
+            /* @__PURE__ */ jsx2(
+              "button",
+              {
+                className: `sci-nb-math-mode-btn ${!showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
+                onClick: () => setShowRaw(false),
+                tabIndex: -1,
+                children: "Preview"
+              }
+            ),
+            /* @__PURE__ */ jsx2(
+              "button",
+              {
+                className: `sci-nb-math-mode-btn ${showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
+                onClick: () => setShowRaw(true),
+                tabIndex: -1,
+                children: "LaTeX"
+              }
+            )
+          ] }),
+          showRaw ? /* @__PURE__ */ jsx2(
+            "textarea",
+            {
+              ref: textareaRef,
+              className: "sci-nb-math-raw",
+              value: innerLatex,
+              onChange: handleRawChange,
+              placeholder: "Type LaTeX here...",
+              spellCheck: false,
+              autoFocus: true
+            }
+          ) : /* @__PURE__ */ jsxs("div", { className: "sci-nb-math-visual", children: [
+            /* @__PURE__ */ jsx2(
+              "div",
+              {
+                className: "sci-nb-math-preview",
+                dangerouslySetInnerHTML: { __html: renderLatexPreview(source) }
+              }
+            ),
+            /* @__PURE__ */ jsxs("p", { className: "sci-nb-math-visual-hint", children: [
+              "Click the blocks above to build your formula. Switch to ",
+              /* @__PURE__ */ jsx2("strong", { children: "LaTeX" }),
+              " mode to edit directly."
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "sci-nb-cell-hint", children: [
+          /* @__PURE__ */ jsx2("kbd", { children: "Esc" }),
+          " exit \xB7 ",
+          /* @__PURE__ */ jsx2("kbd", { children: "Shift+Enter" }),
+          " next \xB7 ",
+          /* @__PURE__ */ jsx2("kbd", { children: "Ctrl+Enter" }),
+          " render"
         ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "sci-nb-cell-hint", children: [
-      /* @__PURE__ */ jsx2("kbd", { children: "Esc" }),
-      " salir \xB7 ",
-      /* @__PURE__ */ jsx2("kbd", { children: "Shift+Enter" }),
-      " siguiente"
-    ] })
-  ] });
+      ]
+    }
+  );
 };
 
 // src/components/ImageCell.tsx
@@ -597,7 +642,7 @@ var ImageCell = ({ cellId, source, metadata, onExit }) => {
             /* @__PURE__ */ jsx3("circle", { cx: "12", cy: "12", r: "2.5" }),
             /* @__PURE__ */ jsx3("path", { d: "M4 22l6-6 4 4 4-4 10 10", strokeLinejoin: "round" })
           ] }),
-          /* @__PURE__ */ jsx3("p", { children: "Arrastra, pega (Ctrl+V) o haz click para seleccionar" }),
+          /* @__PURE__ */ jsx3("p", { children: "Drag, paste (Ctrl+V) or click to select" }),
           /* @__PURE__ */ jsx3(
             "input",
             {
@@ -636,7 +681,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"
           }
         )
       ] }),
@@ -648,13 +693,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__ */ jsxs2("div", { className: "sci-nb-image-row", children: [
         /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-field sci-nb-image-field--small", children: [
-          /* @__PURE__ */ jsx3("label", { children: "Ancho" }),
+          /* @__PURE__ */ jsx3("label", { children: "Width" }),
           /* @__PURE__ */ jsxs2("select", { value: data.width, onChange: (e) => save({ width: e.target.value }), children: [
             /* @__PURE__ */ jsx3("option", { value: "25%", children: "25%" }),
             /* @__PURE__ */ jsx3("option", { value: "50%", children: "50%" }),
@@ -664,38 +709,38 @@ var ImageCell = ({ cellId, source, metadata, onExit }) => {
           ] })
         ] }),
         /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-field sci-nb-image-field--small", children: [
-          /* @__PURE__ */ jsx3("label", { children: "Alinear" }),
+          /* @__PURE__ */ jsx3("label", { children: "Align" }),
           /* @__PURE__ */ jsxs2("select", { value: data.align, onChange: (e) => save({ align: e.target.value }), children: [
-            /* @__PURE__ */ jsx3("option", { value: "left", children: "Izquierda" }),
-            /* @__PURE__ */ jsx3("option", { value: "center", children: "Centro" }),
-            /* @__PURE__ */ jsx3("option", { value: "right", children: "Derecha" })
+            /* @__PURE__ */ jsx3("option", { value: "left", children: "Left" }),
+            /* @__PURE__ */ jsx3("option", { value: "center", children: "Center" }),
+            /* @__PURE__ */ jsx3("option", { value: "right", children: "Right" })
           ] })
         ] }),
-        hasSrc && /* @__PURE__ */ jsx3("button", { className: "sci-nb-image-clear", onClick: () => save({ src: "" }), children: "Quitar imagen" })
+        hasSrc && /* @__PURE__ */ jsx3("button", { className: "sci-nb-image-clear", onClick: () => save({ src: "" }), children: "Remove image" })
       ] })
     ] }),
     /* @__PURE__ */ jsxs2("div", { className: "sci-nb-cell-hint", children: [
       /* @__PURE__ */ jsx3("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) {
@@ -821,22 +866,22 @@ var EmbedCell = ({ cellId, source, metadata, onExit }) => {
           /* @__PURE__ */ jsx4("label", { children: "Sandbox" }),
           /* @__PURE__ */ jsxs3("select", { value: data.sandbox, onChange: (e) => save({ sandbox: e.target.value }), children: [
             /* @__PURE__ */ jsx4("option", { value: "allow-scripts allow-same-origin allow-popups", children: "Standard" }),
-            /* @__PURE__ */ jsx4("option", { value: "allow-scripts", children: "Solo scripts" }),
-            /* @__PURE__ */ jsx4("option", { value: "", children: "Restringido" })
+            /* @__PURE__ */ jsx4("option", { value: "allow-scripts", children: "Scripts only" }),
+            /* @__PURE__ */ jsx4("option", { value: "", children: "Restricted" })
           ] })
         ] })
       ] })
     ] }),
     /* @__PURE__ */ jsxs3("div", { className: "sci-nb-cell-hint", children: [
       /* @__PURE__ */ jsx4("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}">
@@ -851,14 +896,14 @@ function escapeAttr2(s) {
 import { useState as useState6, useEffect as useEffect5, useRef as useRef4 } from "react";
 import { jsx as jsx5, jsxs as jsxs4 } from "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,
@@ -913,7 +958,7 @@ var SlashCommand = ({
         className: "sci-nb-slash-menu",
         style: { top: position.top, left: position.left },
         children: /* @__PURE__ */ jsxs4("div", { className: "sci-nb-slash-empty", children: [
-          'Sin resultados para "/',
+          'No results for "/',
           query,
           '"'
         ] })
@@ -927,7 +972,7 @@ var SlashCommand = ({
       className: "sci-nb-slash-menu",
       style: { top: position.top, left: position.left },
       children: [
-        /* @__PURE__ */ jsx5("div", { className: "sci-nb-slash-header", children: "Insertar bloque" }),
+        /* @__PURE__ */ jsx5("div", { className: "sci-nb-slash-header", children: "Insert block" }),
         filtered.map((cmd, i) => /* @__PURE__ */ jsxs4(
           "button",
           {
@@ -980,6 +1025,8 @@ function toMarkdownTable(data) {
 var TableCell = ({ cellId, source, onExit }) => {
   const engine = useSciNotebook();
   const [data, setData] = useState7(() => parseMarkdownTable(source));
+  const [hoverCol, setHoverCol] = useState7(null);
+  const [hoverRow, setHoverRow] = useState7(null);
   const syncToEngine = useCallback6((newData) => {
     setData(newData);
     engine.updateCellSource(cellId, toMarkdownTable(newData));
@@ -1018,142 +1065,104 @@ var TableCell = ({ cellId, source, onExit }) => {
     if (e.key === "Escape") {
       e.preventDefault();
       onExit();
-    } else if (e.key === "Tab" && !e.shiftKey) {
     }
   }, [onExit]);
   return /* @__PURE__ */ jsxs5("div", { className: "sci-nb-table-editor", onKeyDown: handleKeyDown, children: [
     /* @__PURE__ */ jsxs5("div", { className: "sci-nb-table-toolbar", children: [
-      /* @__PURE__ */ jsx6("button", { onClick: addRow, children: "+ Fila" }),
-      /* @__PURE__ */ jsx6("button", { onClick: addColumn, children: "+ Columna" })
+      /* @__PURE__ */ jsx6("button", { onClick: addRow, children: "+ Row" }),
+      /* @__PURE__ */ jsx6("button", { onClick: addColumn, children: "+ Column" })
     ] }),
     /* @__PURE__ */ jsxs5("table", { children: [
-      /* @__PURE__ */ jsx6("thead", { children: /* @__PURE__ */ jsxs5("tr", { children: [
-        data.headers.map((h, ci) => /* @__PURE__ */ jsx6("th", { children: /* @__PURE__ */ jsx6(
-          "input",
-          {
-            value: h,
-            onChange: (e) => updateHeader(ci, e.target.value),
-            placeholder: `Col ${ci + 1}`
-          }
-        ) }, ci)),
-        /* @__PURE__ */ jsx6("th", { style: { width: 30, padding: 0 } })
-      ] }) }),
-      /* @__PURE__ */ jsx6("tbody", { children: data.rows.map((row, ri) => /* @__PURE__ */ jsxs5("tr", { children: [
-        row.map((cell, ci) => /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsx6(
-          "input",
-          {
-            value: cell,
-            onChange: (e) => updateCell(ri, ci, e.target.value),
-            placeholder: "..."
-          }
-        ) }, ci)),
-        /* @__PURE__ */ jsx6("td", { style: { width: 30, padding: 0, textAlign: "center" }, children: /* @__PURE__ */ jsx6(
-          "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__ */ jsx6("thead", { children: /* @__PURE__ */ jsx6("tr", { children: data.headers.map((h, ci) => /* @__PURE__ */ jsxs5(
+        "th",
+        {
+          className: "sci-nb-table-header-cell",
+          onMouseEnter: () => setHoverCol(ci),
+          onMouseLeave: () => setHoverCol(null),
+          children: [
+            /* @__PURE__ */ jsx6(
+              "input",
+              {
+                value: h,
+                onChange: (e) => updateHeader(ci, e.target.value),
+                placeholder: `Col ${ci + 1}`
+              }
+            ),
+            data.headers.length > 1 && hoverCol === ci && /* @__PURE__ */ jsx6(
+              "button",
+              {
+                className: "sci-nb-table-delete-btn",
+                onClick: () => removeColumn(ci),
+                title: "Delete column",
+                children: "\u2715"
+              }
+            )
+          ]
+        },
+        ci
+      )) }) }),
+      /* @__PURE__ */ jsx6("tbody", { children: data.rows.map((row, ri) => /* @__PURE__ */ jsx6(
+        "tr",
+        {
+          onMouseEnter: () => setHoverRow(ri),
+          onMouseLeave: () => setHoverRow(null),
+          children: row.map((cell, ci) => {
+            const isLastCol = ci === row.length - 1;
+            return /* @__PURE__ */ jsxs5(
+              "td",
+              {
+                className: isLastCol ? "sci-nb-table-row-end" : "",
+                children: [
+                  /* @__PURE__ */ jsx6(
+                    "input",
+                    {
+                      value: cell,
+                      onChange: (e) => updateCell(ri, ci, e.target.value),
+                      placeholder: "..."
+                    }
+                  ),
+                  isLastCol && data.rows.length > 1 && hoverRow === ri && /* @__PURE__ */ jsx6(
+                    "button",
+                    {
+                      className: "sci-nb-table-delete-btn",
+                      onClick: () => removeRow(ri),
+                      title: "Delete row",
+                      children: "\u2715"
+                    }
+                  )
+                ]
+              },
+              ci
+            );
+          })
+        },
+        ri
+      )) })
     ] }),
     /* @__PURE__ */ jsxs5("div", { className: "sci-nb-cell-hint", children: [
       /* @__PURE__ */ jsx6("kbd", { children: "Tab" }),
-      " siguiente celda \xB7 ",
+      " next cell \xB7 ",
       /* @__PURE__ */ jsx6("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
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
-var CellOutputDisplay = ({ outputs }) => {
-  if (!outputs || outputs.length === 0) return null;
-  return /* @__PURE__ */ jsx7("div", { className: "sci-nb-cell-outputs", children: outputs.map((output, i) => /* @__PURE__ */ jsx7("div", { className: `sci-nb-output sci-nb-output--${output.outputType}`, children: renderOutput(output) }, i)) });
-};
-function renderOutput(output) {
-  switch (output.outputType) {
-    case "stream":
-      return /* @__PURE__ */ jsx7("pre", { className: `sci-nb-output-stream sci-nb-output-stream--${output.name}`, children: output.text });
-    case "display": {
-      if (output.data["text/html"]) {
-        return /* @__PURE__ */ jsx7(
-          "div",
-          {
-            className: "sci-nb-output-html",
-            dangerouslySetInnerHTML: { __html: output.data["text/html"] }
-          }
-        );
-      }
-      if (output.data["image/svg+xml"]) {
-        return /* @__PURE__ */ jsx7(
-          "div",
-          {
-            className: "sci-nb-output-svg",
-            dangerouslySetInnerHTML: { __html: output.data["image/svg+xml"] }
-          }
-        );
-      }
-      if (output.data["image/png"]) {
-        return /* @__PURE__ */ jsx7(
-          "img",
-          {
-            className: "sci-nb-output-image",
-            src: `data:image/png;base64,${output.data["image/png"]}`,
-            alt: "Output"
-          }
-        );
-      }
-      if (output.data["image/jpeg"]) {
-        return /* @__PURE__ */ jsx7(
-          "img",
-          {
-            className: "sci-nb-output-image",
-            src: `data:image/jpeg;base64,${output.data["image/jpeg"]}`,
-            alt: "Output"
-          }
-        );
-      }
-      if (output.data["application/json"]) {
-        return /* @__PURE__ */ jsx7("pre", { className: "sci-nb-output-json", children: JSON.stringify(JSON.parse(output.data["application/json"]), null, 2) });
-      }
-      if (output.data["text/plain"]) {
-        return /* @__PURE__ */ jsx7("pre", { className: "sci-nb-output-text", children: output.data["text/plain"] });
-      }
-      return /* @__PURE__ */ jsx7("pre", { className: "sci-nb-output-text", children: "[Display output]" });
-    }
-    case "error":
-      return /* @__PURE__ */ jsxs6("div", { className: "sci-nb-output-error", children: [
-        /* @__PURE__ */ jsxs6("strong", { className: "sci-nb-output-error-name", children: [
-          output.name,
-          ": "
-        ] }),
-        /* @__PURE__ */ jsx7("span", { className: "sci-nb-output-error-msg", children: output.message }),
-        output.traceback && output.traceback.length > 0 && /* @__PURE__ */ jsx7("pre", { className: "sci-nb-output-traceback", children: output.traceback.join("\n") })
-      ] });
-    default:
-      return null;
-  }
-}
-
 // src/components/MermaidCell.tsx
 import { useState as useState8, useEffect as useEffect6, useRef as useRef5 } from "react";
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 var mermaidIdCounter = 0;
 var MermaidPreview = ({ source, onClick }) => {
   const [svg, setSvg] = useState8(null);
@@ -1196,29 +1205,29 @@ var MermaidPreview = ({ source, onClick }) => {
   }, [source]);
   const mermaid = globalThis.mermaid;
   if (!source.trim()) {
-    return /* @__PURE__ */ jsx8("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ jsx8("span", { className: "sci-nb-placeholder", children: "Diagrama vacio \u2014 escribe sintaxis Mermaid" }) });
+    return /* @__PURE__ */ jsx7("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ jsx7("span", { className: "sci-nb-placeholder", children: "Empty diagram \u2014 write Mermaid syntax" }) });
   }
   if (!mermaid) {
-    return /* @__PURE__ */ jsxs7("div", { className: "sci-nb-mermaid-preview", onClick, children: [
-      /* @__PURE__ */ jsx8("pre", { className: "sci-nb-code", children: /* @__PURE__ */ jsx8("code", { className: "language-mermaid", children: source }) }),
-      /* @__PURE__ */ jsxs7("div", { style: { fontSize: 11, color: "#94a3b8", textAlign: "center", padding: 4 }, children: [
-        "Mermaid no disponible. Importa ",
-        /* @__PURE__ */ jsx8("code", { children: "mermaid" }),
-        " y exponlo como ",
-        /* @__PURE__ */ jsx8("code", { children: "globalThis.mermaid" }),
+    return /* @__PURE__ */ jsxs6("div", { className: "sci-nb-mermaid-preview", onClick, children: [
+      /* @__PURE__ */ jsx7("pre", { className: "sci-nb-code", children: /* @__PURE__ */ jsx7("code", { className: "language-mermaid", children: source }) }),
+      /* @__PURE__ */ jsxs6("div", { style: { fontSize: 11, color: "#94a3b8", textAlign: "center", padding: 4 }, children: [
+        "Mermaid not available. Import ",
+        /* @__PURE__ */ jsx7("code", { children: "mermaid" }),
+        " and expose it as ",
+        /* @__PURE__ */ jsx7("code", { children: "globalThis.mermaid" }),
         "."
       ] })
     ] });
   }
   if (error) {
-    return /* @__PURE__ */ jsxs7("div", { className: "sci-nb-mermaid-error", onClick, children: [
-      /* @__PURE__ */ jsx8("strong", { children: "Mermaid error:" }),
+    return /* @__PURE__ */ jsxs6("div", { className: "sci-nb-mermaid-error", onClick, children: [
+      /* @__PURE__ */ jsx7("strong", { children: "Mermaid error:" }),
       " ",
       error
     ] });
   }
   if (svg) {
-    return /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx7(
       "div",
       {
         ref: containerRef,
@@ -1226,125 +1235,361 @@ var MermaidPreview = ({ source, onClick }) => {
         onClick,
         dangerouslySetInnerHTML: { __html: svg }
       }
-    );
+    );
+  }
+  return /* @__PURE__ */ jsx7("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ jsx7("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
+import { useRef as useRef6, useEffect as useEffect7, useCallback as useCallback8, useState as useState9 } from "react";
+import { highlightCodeTokens } from "@velo-sci/notebook-renderer";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+var CodeEditor = ({
+  source,
+  language,
+  onChange,
+  onKeyDown,
+  placeholder
+}) => {
+  const textareaRef = useRef6(null);
+  const preRef = useRef6(null);
+  const [highlighted, setHighlighted] = useState9("");
+  useEffect7(() => {
+    const html = highlightCodeTokens(source, language || "text");
+    const match = html.match(/<code[^>]*>([\s\S]*)<\/code>/);
+    setHighlighted(match ? match[1] : html);
+  }, [source, language]);
+  const syncScroll = useCallback8(() => {
+    if (textareaRef.current && preRef.current) {
+      preRef.current.scrollTop = textareaRef.current.scrollTop;
+      preRef.current.scrollLeft = textareaRef.current.scrollLeft;
+    }
+  }, []);
+  useEffect7(() => {
+    if (textareaRef.current) {
+      const ta = textareaRef.current;
+      ta.style.height = "auto";
+      ta.style.height = `${Math.max(40, ta.scrollHeight)}px`;
+    }
+  }, [source]);
+  useEffect7(() => {
+    textareaRef.current?.focus();
+  }, []);
+  const handleChange = useCallback8((e) => {
+    onChange(e.target.value);
+  }, [onChange]);
+  return /* @__PURE__ */ jsxs7("div", { className: "sci-nb-code-editor-wrap", children: [
+    /* @__PURE__ */ jsx8(
+      "pre",
+      {
+        ref: preRef,
+        className: "sci-nb-code-editor-highlight sci-nb-code--highlighted",
+        "aria-hidden": "true",
+        children: /* @__PURE__ */ jsxs7("code", { className: `language-${language || "text"}`, children: [
+          /* @__PURE__ */ jsx8("span", { dangerouslySetInnerHTML: { __html: highlighted || "&nbsp;" } }),
+          "\n"
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx8(
+      "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
+import { Fragment, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+function renderEditMode(cell, cellId, engine, textareaRef, handleSourceChange, handleKeyDown, placeholder, exitEdit, slashState, onSlashSelect, onSlashClose) {
+  if (cell.type === "latex") {
+    return /* @__PURE__ */ jsx9(MathEditor, { cellId, source: cell.source, onExit: exitEdit });
+  }
+  if (cell.type === "image") {
+    return /* @__PURE__ */ jsx9(ImageCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
+  }
+  if (cell.type === "embed") {
+    return /* @__PURE__ */ jsx9(EmbedCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
+  }
+  if (cell.type === "table") {
+    return /* @__PURE__ */ jsx9(TableCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
+  }
+  if (cell.type === "code") {
+    const lang = cell.metadata.language || "javascript";
+    return /* @__PURE__ */ jsxs8(Fragment, { children: [
+      /* @__PURE__ */ jsx9(
+        CodeEditor,
+        {
+          cellId,
+          source: cell.source,
+          language: lang,
+          onChange: (val) => engine.updateCellSource(cellId, val),
+          onKeyDown: handleKeyDown,
+          placeholder
+        }
+      ),
+      /* @__PURE__ */ jsxs8("div", { className: "sci-nb-cell-hint", children: [
+        /* @__PURE__ */ jsx9("kbd", { children: "Shift+Enter" }),
+        " next \xB7 ",
+        /* @__PURE__ */ jsx9("kbd", { children: "Esc" }),
+        " exit"
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs8(Fragment, { children: [
+    cell.type === "markdown" && /* @__PURE__ */ jsx9(FloatingToolbar, { cellId, textareaRef }),
+    /* @__PURE__ */ jsx9(
+      "textarea",
+      {
+        ref: textareaRef,
+        className: "sci-nb-editor",
+        value: cell.source,
+        onChange: handleSourceChange,
+        onKeyDown: handleKeyDown,
+        placeholder,
+        spellCheck: cell.type === "markdown",
+        rows: 1
+      }
+    ),
+    slashState && /* @__PURE__ */ jsx9(
+      SlashCommand,
+      {
+        position: slashState.pos,
+        query: slashState.query,
+        onSelect: onSlashSelect,
+        onClose: onSlashClose
+      }
+    ),
+    /* @__PURE__ */ jsxs8("div", { className: "sci-nb-cell-hint", children: [
+      /* @__PURE__ */ jsx9("kbd", { children: "/" }),
+      " commands \xB7 ",
+      /* @__PURE__ */ jsx9("kbd", { children: "Shift+Enter" }),
+      " next \xB7 ",
+      /* @__PURE__ */ jsx9("kbd", { children: "Esc" }),
+      " exit"
+    ] })
+  ] });
+}
+function renderViewMode(cell, renderedHtml, isEmpty, placeholder, enterEdit) {
+  if (cell.type === "image") {
+    const html = renderImagePreview(cell.source, cell.metadata);
+    return /* @__PURE__ */ jsx9("div", { className: "sci-nb-preview", onClick: enterEdit, dangerouslySetInnerHTML: { __html: html } });
+  }
+  if (cell.type === "embed") {
+    const html = renderEmbedPreview(cell.source, cell.metadata);
+    return /* @__PURE__ */ jsx9("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__ */ jsx9("div", { className: "sci-nb-preview", onClick: enterEdit, dangerouslySetInnerHTML: { __html: html } });
+  }
+  if (cell.type === "mermaid") {
+    return /* @__PURE__ */ jsx9(MermaidPreview, { source: cell.source, onClick: enterEdit });
+  }
+  return /* @__PURE__ */ jsx9(
+    "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
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+var CellOutputDisplay = ({ outputs }) => {
+  if (!outputs || outputs.length === 0) return null;
+  return /* @__PURE__ */ jsx10("div", { className: "sci-nb-cell-outputs", children: outputs.map((output, i) => /* @__PURE__ */ jsx10("div", { className: `sci-nb-output sci-nb-output--${output.outputType}`, children: renderOutput(output) }, i)) });
+};
+function renderOutput(output) {
+  switch (output.outputType) {
+    case "stream":
+      return /* @__PURE__ */ jsx10("pre", { className: `sci-nb-output-stream sci-nb-output-stream--${output.name}`, children: output.text });
+    case "display": {
+      if (output.data["text/html"]) {
+        return /* @__PURE__ */ jsx10(
+          "div",
+          {
+            className: "sci-nb-output-html",
+            dangerouslySetInnerHTML: { __html: output.data["text/html"] }
+          }
+        );
+      }
+      if (output.data["image/svg+xml"]) {
+        return /* @__PURE__ */ jsx10(
+          "div",
+          {
+            className: "sci-nb-output-svg",
+            dangerouslySetInnerHTML: { __html: output.data["image/svg+xml"] }
+          }
+        );
+      }
+      if (output.data["image/png"]) {
+        return /* @__PURE__ */ jsx10(
+          "img",
+          {
+            className: "sci-nb-output-image",
+            src: `data:image/png;base64,${output.data["image/png"]}`,
+            alt: "Output"
+          }
+        );
+      }
+      if (output.data["image/jpeg"]) {
+        return /* @__PURE__ */ jsx10(
+          "img",
+          {
+            className: "sci-nb-output-image",
+            src: `data:image/jpeg;base64,${output.data["image/jpeg"]}`,
+            alt: "Output"
+          }
+        );
+      }
+      if (output.data["application/json"]) {
+        return /* @__PURE__ */ jsx10("pre", { className: "sci-nb-output-json", children: JSON.stringify(JSON.parse(output.data["application/json"]), null, 2) });
+      }
+      if (output.data["text/plain"]) {
+        return /* @__PURE__ */ jsx10("pre", { className: "sci-nb-output-text", children: output.data["text/plain"] });
+      }
+      return /* @__PURE__ */ jsx10("pre", { className: "sci-nb-output-text", children: "[Display output]" });
+    }
+    case "error":
+      return /* @__PURE__ */ jsxs9("div", { className: "sci-nb-output-error", children: [
+        /* @__PURE__ */ jsxs9("strong", { className: "sci-nb-output-error-name", children: [
+          output.name,
+          ": "
+        ] }),
+        /* @__PURE__ */ jsx10("span", { className: "sci-nb-output-error-msg", children: output.message }),
+        output.traceback && output.traceback.length > 0 && /* @__PURE__ */ jsx10("pre", { className: "sci-nb-output-traceback", children: output.traceback.join("\n") })
+      ] });
+    default:
+      return null;
   }
-  return /* @__PURE__ */ jsx8("div", { className: "sci-nb-mermaid-preview", onClick, children: /* @__PURE__ */ jsx8("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
-import { Fragment, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs10 } from "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 = useRef6(null);
-  const cellRef = useRef6(null);
-  const [showTypeMenu, setShowTypeMenu] = useState9(false);
-  const [hovered, setHovered] = useState9(false);
-  const [slashState, setSlashState] = useState9(null);
-  const [dragOver, setDragOver] = useState9(null);
-  const [isDragging, setIsDragging] = useState9(false);
-  const rendered = useMemo3(() => {
+  const textareaRef = useRef7(null);
+  const cellRef = useRef7(null);
+  const [showTypeMenu, setShowTypeMenu] = useState10(false);
+  const [hovered, setHovered] = useState10(false);
+  const [slashState, setSlashState] = useState10(null);
+  const [dragOver, setDragOver] = useState10(null);
+  const [isDragging, setIsDragging] = useState10(false);
+  const rendered = useMemo2(() => {
     if (!cell) return { html: "", cellId: "", renderTime: 0, cached: false };
     return pipeline.render(cell);
   }, [cell?.source, cell?.type, cell?.metadata, pipeline]);
-  useEffect7(() => {
+  useEffect8(() => {
     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]);
-  useEffect7(() => {
-    if (cell?.editing && textareaRef.current) {
-      textareaRef.current.focus();
-    }
+  useEffect8(() => {
+    if (cell?.editing && textareaRef.current) textareaRef.current.focus();
   }, [cell?.editing]);
-  useEffect7(() => {
+  useEffect8(() => {
     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 = useCallback8((e) => {
+  const handleSourceChange = useCallback9((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 = useCallback8(() => {
+  const enterEdit = useCallback9(() => {
     engine.setEditMode(cellId);
     engine.focusCell(cellId);
   }, [engine, cellId]);
-  const exitEdit = useCallback8(() => {
+  const exitEdit = useCallback9(() => {
     engine.setViewMode(cellId);
   }, [engine, cellId]);
-  const handleSlashSelect = useCallback8((type) => {
+  const handleSlashSelect = useCallback9((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 = useCallback8((e) => {
-    if (slashState) {
-      if (["ArrowDown", "ArrowUp", "Enter"].includes(e.key)) return;
-      if (e.key === "Escape") {
-        e.preventDefault();
-        setSlashState(null);
-        return;
+  const wrapSelection = useCallback9((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 = useCallback9((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();
@@ -1365,30 +1610,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;
           }
         });
       }
@@ -1399,27 +1638,12 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
       e.preventDefault();
       wrapSelection("*", "*");
     }
-  }, [engine, cellId, exitEdit]);
-  const wrapSelection = useCallback8((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__ */ jsxs8(
+  return /* @__PURE__ */ jsxs10(
     "div",
     {
       ref: cellRef,
@@ -1446,18 +1670,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),
@@ -1470,35 +1690,27 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
       onMouseLeave: () => setHovered(false),
       onClick: () => engine.focusCell(cellId),
       children: [
-        /* @__PURE__ */ jsxs8("div", { className: "sci-nb-cell-gutter", children: [
-          /* @__PURE__ */ jsx9("div", { className: "sci-nb-cell-handle", title: "Drag to reorder", children: /* @__PURE__ */ jsxs8("svg", { width: "12", height: "20", viewBox: "0 0 12 20", fill: "currentColor", children: [
-            /* @__PURE__ */ jsx9("circle", { cx: "3", cy: "4", r: "1.5" }),
-            /* @__PURE__ */ jsx9("circle", { cx: "9", cy: "4", r: "1.5" }),
-            /* @__PURE__ */ jsx9("circle", { cx: "3", cy: "10", r: "1.5" }),
-            /* @__PURE__ */ jsx9("circle", { cx: "9", cy: "10", r: "1.5" }),
-            /* @__PURE__ */ jsx9("circle", { cx: "3", cy: "16", r: "1.5" }),
-            /* @__PURE__ */ jsx9("circle", { cx: "9", cy: "16", r: "1.5" })
+        /* @__PURE__ */ jsxs10("div", { className: "sci-nb-cell-gutter", children: [
+          /* @__PURE__ */ jsx11("div", { className: "sci-nb-cell-handle", title: "Drag to reorder", children: /* @__PURE__ */ jsxs10("svg", { width: "12", height: "20", viewBox: "0 0 12 20", fill: "currentColor", children: [
+            /* @__PURE__ */ jsx11("circle", { cx: "3", cy: "4", r: "1.5" }),
+            /* @__PURE__ */ jsx11("circle", { cx: "9", cy: "4", r: "1.5" }),
+            /* @__PURE__ */ jsx11("circle", { cx: "3", cy: "10", r: "1.5" }),
+            /* @__PURE__ */ jsx11("circle", { cx: "9", cy: "10", r: "1.5" }),
+            /* @__PURE__ */ jsx11("circle", { cx: "3", cy: "16", r: "1.5" }),
+            /* @__PURE__ */ jsx11("circle", { cx: "9", cy: "16", r: "1.5" })
           ] }) }),
-          /* @__PURE__ */ jsxs8("span", { className: "sci-nb-cell-index", children: [
+          /* @__PURE__ */ jsxs10("span", { className: "sci-nb-cell-index", children: [
             "[",
             index + 1,
             "]"
           ] })
         ] }),
-        /* @__PURE__ */ jsxs8("div", { className: "sci-nb-cell-badge-wrap", children: [
-          /* @__PURE__ */ jsx9(
-            "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__ */ jsx9("div", { className: "sci-nb-type-menu", children: CELL_TYPES.map((ct) => /* @__PURE__ */ jsxs8(
+        /* @__PURE__ */ jsxs10("div", { className: "sci-nb-cell-badge-wrap", children: [
+          /* @__PURE__ */ jsx11("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__ */ jsx11("div", { className: "sci-nb-type-menu", children: CELL_TYPES.map((ct) => /* @__PURE__ */ jsxs10(
             "button",
             {
               className: `sci-nb-type-option ${cell.type === ct.value ? "sci-nb-type-option--active" : ""}`,
@@ -1508,173 +1720,46 @@ var Cell = ({ cellId, pipeline, index, totalCells }) => {
                 setShowTypeMenu(false);
               },
               children: [
-                /* @__PURE__ */ jsx9("span", { className: "sci-nb-type-option-icon", children: ct.icon }),
+                /* @__PURE__ */ jsx11("span", { className: "sci-nb-type-option-icon", children: ct.icon }),
                 ct.label
               ]
             },
             ct.value
           )) })
         ] }),
-        /* @__PURE__ */ jsxs8("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__ */ jsx9(CellOutputDisplay, { outputs: cell.outputs })
+        /* @__PURE__ */ jsxs10("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__ */ jsx11(CellOutputDisplay, { outputs: cell.outputs })
         ] }),
-        /* @__PURE__ */ jsxs8("div", { className: "sci-nb-cell-actions", children: [
-          /* @__PURE__ */ jsx9(
-            "button",
-            {
-              className: "sci-nb-btn",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.moveCell(cellId, index - 1);
-              },
-              disabled: index === 0,
-              title: "Move up",
-              children: /* @__PURE__ */ jsx9("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx9("path", { d: "M7 11V3M7 3L3 7M7 3l4 4", strokeLinecap: "round", strokeLinejoin: "round" }) })
-            }
-          ),
-          /* @__PURE__ */ jsx9(
-            "button",
-            {
-              className: "sci-nb-btn",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.moveCell(cellId, index + 1);
-              },
-              disabled: index >= totalCells - 1,
-              title: "Move down",
-              children: /* @__PURE__ */ jsx9("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx9("path", { d: "M7 3v8M7 11l-4-4M7 11l4-4", strokeLinecap: "round", strokeLinejoin: "round" }) })
-            }
-          ),
-          /* @__PURE__ */ jsx9(
-            "button",
-            {
-              className: "sci-nb-btn",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.duplicateCell(cellId);
-              },
-              title: "Duplicate cell",
-              children: /* @__PURE__ */ jsxs8("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-                /* @__PURE__ */ jsx9("rect", { x: "4", y: "4", width: "8", height: "8", rx: "1.5" }),
-                /* @__PURE__ */ jsx9("path", { d: "M10 2H3.5A1.5 1.5 0 002 3.5V10" })
-              ] })
-            }
-          ),
-          /* @__PURE__ */ jsx9(
-            "button",
-            {
-              className: "sci-nb-btn sci-nb-btn--danger",
-              onClick: (e) => {
-                e.stopPropagation();
-                engine.deleteCell(cellId);
-              },
-              title: "Delete cell",
-              children: /* @__PURE__ */ jsx9("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx9("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__ */ jsxs10("div", { className: "sci-nb-cell-actions", children: [
+          /* @__PURE__ */ jsx11("button", { className: "sci-nb-btn", onClick: (e) => {
+            e.stopPropagation();
+            engine.moveCell(cellId, index - 1);
+          }, disabled: index === 0, title: "Move up", children: /* @__PURE__ */ jsx11("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx11("path", { d: "M7 11V3M7 3L3 7M7 3l4 4", strokeLinecap: "round", strokeLinejoin: "round" }) }) }),
+          /* @__PURE__ */ jsx11("button", { className: "sci-nb-btn", onClick: (e) => {
+            e.stopPropagation();
+            engine.moveCell(cellId, index + 1);
+          }, disabled: index >= totalCells - 1, title: "Move down", children: /* @__PURE__ */ jsx11("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx11("path", { d: "M7 3v8M7 11l-4-4M7 11l4-4", strokeLinecap: "round", strokeLinejoin: "round" }) }) }),
+          /* @__PURE__ */ jsx11("button", { className: "sci-nb-btn", onClick: (e) => {
+            e.stopPropagation();
+            engine.duplicateCell(cellId);
+          }, title: "Duplicate cell", children: /* @__PURE__ */ jsxs10("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+            /* @__PURE__ */ jsx11("rect", { x: "4", y: "4", width: "8", height: "8", rx: "1.5" }),
+            /* @__PURE__ */ jsx11("path", { d: "M10 2H3.5A1.5 1.5 0 002 3.5V10" })
+          ] }) }),
+          /* @__PURE__ */ jsx11("button", { className: "sci-nb-btn sci-nb-btn--danger", onClick: (e) => {
+            e.stopPropagation();
+            engine.deleteCell(cellId);
+          }, title: "Delete cell", children: /* @__PURE__ */ jsx11("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx11("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__ */ jsx9(MathEditor, { cellId, source: cell.source, onExit: exitEdit });
-  }
-  if (cell.type === "image") {
-    return /* @__PURE__ */ jsx9(ImageCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
-  }
-  if (cell.type === "embed") {
-    return /* @__PURE__ */ jsx9(EmbedCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
-  }
-  if (cell.type === "table") {
-    return /* @__PURE__ */ jsx9(TableCell, { cellId, source: cell.source, metadata: cell.metadata, onExit: exitEdit });
-  }
-  return /* @__PURE__ */ jsxs8(Fragment, { children: [
-    cell.type === "markdown" && /* @__PURE__ */ jsx9(FloatingToolbar, { cellId, textareaRef }),
-    /* @__PURE__ */ jsx9(
-      "textarea",
-      {
-        ref: textareaRef,
-        className: "sci-nb-editor",
-        value: cell.source,
-        onChange: handleSourceChange,
-        onKeyDown: handleKeyDown,
-        placeholder,
-        spellCheck: cell.type === "markdown",
-        rows: 1
-      }
-    ),
-    slashState && /* @__PURE__ */ jsx9(
-      SlashCommand,
-      {
-        position: slashState.pos,
-        query: slashState.query,
-        onSelect: onSlashSelect,
-        onClose: onSlashClose
-      }
-    ),
-    /* @__PURE__ */ jsxs8("div", { className: "sci-nb-cell-hint", children: [
-      /* @__PURE__ */ jsx9("kbd", { children: "/" }),
-      " comandos \xB7 ",
-      /* @__PURE__ */ jsx9("kbd", { children: "Shift+Enter" }),
-      " siguiente \xB7 ",
-      /* @__PURE__ */ jsx9("kbd", { children: "Esc" }),
-      " salir"
-    ] })
-  ] });
-}
-function renderViewMode(cell, renderedHtml, isEmpty, placeholder, enterEdit) {
-  if (cell.type === "image") {
-    const html = renderImagePreview(cell.source, cell.metadata);
-    return /* @__PURE__ */ jsx9(
-      "div",
-      {
-        className: "sci-nb-preview",
-        onClick: enterEdit,
-        dangerouslySetInnerHTML: { __html: html }
-      }
-    );
-  }
-  if (cell.type === "embed") {
-    const html = renderEmbedPreview(cell.source, cell.metadata);
-    return /* @__PURE__ */ jsx9(
-      "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__ */ jsx9(
-      "div",
-      {
-        className: "sci-nb-preview",
-        onClick: enterEdit,
-        dangerouslySetInnerHTML: { __html: html }
-      }
-    );
-  }
-  if (cell.type === "mermaid") {
-    return /* @__PURE__ */ jsx9(MermaidPreview, { source: cell.source, onClick: enterEdit });
-  }
-  return /* @__PURE__ */ jsx9(
-    "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
-import { useState as useState10, useRef as useRef7, useEffect as useEffect8 } from "react";
-import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import { useState as useState11, useRef as useRef8, useEffect as useEffect9 } from "react";
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var INSERT_TYPES = [
   { type: "markdown", label: "Markdown", icon: "M" },
   { type: "code", label: "Code", icon: "</>" },
@@ -1685,9 +1770,9 @@ var INSERT_TYPES = [
 ];
 var InsertHandle = ({ index }) => {
   const engine = useSciNotebook();
-  const [open, setOpen] = useState10(false);
-  const menuRef = useRef7(null);
-  useEffect8(() => {
+  const [open, setOpen] = useState11(false);
+  const menuRef = useRef8(null);
+  useEffect9(() => {
     if (!open) return;
     const onClickOutside = (e) => {
       if (menuRef.current && !menuRef.current.contains(e.target)) {
@@ -1708,27 +1793,27 @@ var InsertHandle = ({ index }) => {
       }
     });
   };
-  return /* @__PURE__ */ jsxs9("div", { className: "sci-nb-insert-handle", ref: menuRef, children: [
-    /* @__PURE__ */ jsx10("div", { className: "sci-nb-insert-line", children: /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsxs11("div", { className: "sci-nb-insert-handle", ref: menuRef, children: [
+    /* @__PURE__ */ jsx12("div", { className: "sci-nb-insert-line", children: /* @__PURE__ */ jsx12(
       "button",
       {
         className: "sci-nb-insert-btn",
         onClick: () => setOpen(!open),
         title: "Insert cell",
-        children: /* @__PURE__ */ jsxs9("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
-          /* @__PURE__ */ jsx10("line", { x1: "8", y1: "3", x2: "8", y2: "13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
-          /* @__PURE__ */ jsx10("line", { x1: "3", y1: "8", x2: "13", y2: "8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+        children: /* @__PURE__ */ jsxs11("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
+          /* @__PURE__ */ jsx12("line", { x1: "8", y1: "3", x2: "8", y2: "13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx12("line", { x1: "3", y1: "8", x2: "13", y2: "8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
         ] })
       }
     ) }),
-    open && /* @__PURE__ */ jsx10("div", { className: "sci-nb-insert-menu", children: INSERT_TYPES.map((ct) => /* @__PURE__ */ jsxs9(
+    open && /* @__PURE__ */ jsx12("div", { className: "sci-nb-insert-menu", children: INSERT_TYPES.map((ct) => /* @__PURE__ */ jsxs11(
       "button",
       {
         className: "sci-nb-insert-option",
         onClick: () => handleInsert(ct.type),
         children: [
-          /* @__PURE__ */ jsx10("span", { className: "sci-nb-insert-option-icon", children: ct.icon }),
-          /* @__PURE__ */ jsx10("span", { children: ct.label })
+          /* @__PURE__ */ jsx12("span", { className: "sci-nb-insert-option-icon", children: ct.icon }),
+          /* @__PURE__ */ jsx12("span", { children: ct.label })
         ]
       },
       ct.type
@@ -1737,12 +1822,12 @@ var InsertHandle = ({ index }) => {
 };
 
 // src/components/TOCSidebar.tsx
-import { useMemo as useMemo4, useCallback as useCallback9 } from "react";
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { useMemo as useMemo3, useCallback as useCallback10 } from "react";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
 var TOCSidebar = ({ focusedCellId }) => {
   const notebook = useNotebook();
   const engine = useSciNotebook();
-  const items = useMemo4(() => {
+  const items = useMemo3(() => {
     if (!notebook) return [];
     const result = [];
     for (const cell of notebook.cells) {
@@ -1761,16 +1846,16 @@ var TOCSidebar = ({ focusedCellId }) => {
     }
     return result;
   }, [notebook]);
-  const handleClick = useCallback9((cellId) => {
+  const handleClick = useCallback10((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__ */ jsxs10("nav", { className: "sci-nb-toc", children: [
-    /* @__PURE__ */ jsx11("div", { className: "sci-nb-toc-title", children: "Contenido" }),
-    items.map((item, i) => /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsxs12("nav", { className: "sci-nb-toc", children: [
+    /* @__PURE__ */ jsx13("div", { className: "sci-nb-toc-title", children: "Contenido" }),
+    items.map((item, i) => /* @__PURE__ */ jsx13(
       "button",
       {
         className: [
@@ -1788,21 +1873,21 @@ var TOCSidebar = ({ focusedCellId }) => {
 };
 
 // src/components/FindReplace.tsx
-import { useState as useState11, useCallback as useCallback10, useMemo as useMemo5, useEffect as useEffect9, useRef as useRef8 } from "react";
-import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { useState as useState12, useCallback as useCallback11, useMemo as useMemo4, useEffect as useEffect10, useRef as useRef9 } from "react";
+import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 var FindReplace = ({ onClose }) => {
   const notebook = useNotebook();
   const engine = useSciNotebook();
-  const [query, setQuery] = useState11("");
-  const [replacement, setReplacement] = useState11("");
-  const [showReplace, setShowReplace] = useState11(false);
-  const [caseSensitive, setCaseSensitive] = useState11(false);
-  const [currentIdx, setCurrentIdx] = useState11(0);
-  const inputRef = useRef8(null);
-  useEffect9(() => {
+  const [query, setQuery] = useState12("");
+  const [replacement, setReplacement] = useState12("");
+  const [showReplace, setShowReplace] = useState12(false);
+  const [caseSensitive, setCaseSensitive] = useState12(false);
+  const [currentIdx, setCurrentIdx] = useState12(0);
+  const inputRef = useRef9(null);
+  useEffect10(() => {
     inputRef.current?.focus();
   }, []);
-  const matches = useMemo5(() => {
+  const matches = useMemo4(() => {
     if (!query || !notebook) return [];
     const result = [];
     const q = caseSensitive ? query : query.toLowerCase();
@@ -1818,27 +1903,27 @@ var FindReplace = ({ onClose }) => {
     }
     return result;
   }, [query, notebook, caseSensitive]);
-  useEffect9(() => {
+  useEffect10(() => {
     setCurrentIdx(0);
   }, [query, caseSensitive]);
-  const navigateToMatch = useCallback10((match) => {
+  const navigateToMatch = useCallback11((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 = useCallback10(() => {
+  const goNext = useCallback11(() => {
     if (matches.length === 0) return;
     const next = (currentIdx + 1) % matches.length;
     setCurrentIdx(next);
     navigateToMatch(matches[next]);
   }, [matches, currentIdx, navigateToMatch]);
-  const goPrev = useCallback10(() => {
+  const goPrev = useCallback11(() => {
     if (matches.length === 0) return;
     const prev = (currentIdx - 1 + matches.length) % matches.length;
     setCurrentIdx(prev);
     navigateToMatch(matches[prev]);
   }, [matches, currentIdx, navigateToMatch]);
-  const replaceCurrent = useCallback10(() => {
+  const replaceCurrent = useCallback11(() => {
     if (matches.length === 0) return;
     const match = matches[currentIdx];
     if (!match) return;
@@ -1847,7 +1932,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 = useCallback10(() => {
+  const replaceAll = useCallback11(() => {
     if (matches.length === 0 || !notebook) return;
     const byCellId = /* @__PURE__ */ new Map();
     for (const m of matches) {
@@ -1866,7 +1951,7 @@ var FindReplace = ({ onClose }) => {
       engine.updateCellSource(cellId, src);
     }
   }, [matches, replacement, notebook, engine]);
-  const handleKeyDown = useCallback10((e) => {
+  const handleKeyDown = useCallback11((e) => {
     if (e.key === "Escape") {
       e.preventDefault();
       onClose();
@@ -1879,21 +1964,21 @@ var FindReplace = ({ onClose }) => {
       setShowReplace((v) => !v);
     }
   }, [onClose, goNext, goPrev]);
-  return /* @__PURE__ */ jsxs11("div", { className: "sci-nb-find-bar", onKeyDown: handleKeyDown, children: [
-    /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsxs13("div", { className: "sci-nb-find-bar", onKeyDown: handleKeyDown, children: [
+    /* @__PURE__ */ jsx14(
       "input",
       {
         ref: inputRef,
         type: "text",
         value: query,
         onChange: (e) => setQuery(e.target.value),
-        placeholder: "Buscar..."
+        placeholder: "Search..."
       }
     ),
-    /* @__PURE__ */ jsx12("span", { className: "sci-nb-find-count", children: matches.length > 0 ? `${currentIdx + 1}/${matches.length}` : query ? "0" : "" }),
-    /* @__PURE__ */ jsx12("button", { onClick: goPrev, title: "Anterior (Shift+Enter)", children: "\u25B2" }),
-    /* @__PURE__ */ jsx12("button", { onClick: goNext, title: "Siguiente (Enter)", children: "\u25BC" }),
-    /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx14("span", { className: "sci-nb-find-count", children: matches.length > 0 ? `${currentIdx + 1}/${matches.length}` : query ? "0" : "" }),
+    /* @__PURE__ */ jsx14("button", { onClick: goPrev, title: "Previous (Shift+Enter)", children: "\u25B2" }),
+    /* @__PURE__ */ jsx14("button", { onClick: goNext, title: "Next (Enter)", children: "\u25BC" }),
+    /* @__PURE__ */ jsx14(
       "button",
       {
         onClick: () => setCaseSensitive((v) => !v),
@@ -1902,29 +1987,29 @@ var FindReplace = ({ onClose }) => {
         children: "Aa"
       }
     ),
-    /* @__PURE__ */ jsxs11("button", { onClick: () => setShowReplace((v) => !v), title: "Reemplazar (Ctrl+H)", children: [
+    /* @__PURE__ */ jsxs13("button", { onClick: () => setShowReplace((v) => !v), title: "Replace (Ctrl+H)", children: [
       showReplace ? "\u25BE" : "\u25B8",
-      " Reemplazar"
+      " Replace"
     ] }),
-    showReplace && /* @__PURE__ */ jsxs11(Fragment2, { children: [
-      /* @__PURE__ */ jsx12(
+    showReplace && /* @__PURE__ */ jsxs13(Fragment2, { children: [
+      /* @__PURE__ */ jsx14(
         "input",
         {
           type: "text",
           value: replacement,
           onChange: (e) => setReplacement(e.target.value),
-          placeholder: "Reemplazar con..."
+          placeholder: "Replace with..."
         }
       ),
-      /* @__PURE__ */ jsx12("button", { onClick: replaceCurrent, title: "Reemplazar actual", children: "1" }),
-      /* @__PURE__ */ jsx12("button", { onClick: replaceAll, title: "Reemplazar todos", children: "\u2200" })
+      /* @__PURE__ */ jsx14("button", { onClick: replaceCurrent, title: "Replace current", children: "1" }),
+      /* @__PURE__ */ jsx14("button", { onClick: replaceAll, title: "Replace all", children: "\u2200" })
     ] }),
-    /* @__PURE__ */ jsx12("button", { onClick: onClose, title: "Cerrar (Esc)", children: "\u2715" })
+    /* @__PURE__ */ jsx14("button", { onClick: onClose, title: "Close (Esc)", children: "\u2715" })
   ] });
 };
 
 // src/components/SciNotebook.tsx
-import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 var SciNotebook = ({
   notebook: initialNotebook,
   engine: providedEngine,
@@ -1940,7 +2025,7 @@ var SciNotebook = ({
   engineRef,
   showTOC: showTOCProp = false
 }) => {
-  const engine = useMemo6(() => {
+  const engine = useMemo5(() => {
     if (providedEngine) return providedEngine;
     if (initialContent && !initialNotebook) {
       const cells2 = parseInitialContent(initialContent);
@@ -1959,37 +2044,37 @@ var SciNotebook = ({
     }
     return createNotebook({ notebook: initialNotebook, config: { plugins } });
   }, [providedEngine]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (engineRef) engineRef.current = engine;
     return () => {
       if (engineRef) engineRef.current = null;
     };
   }, [engine, engineRef]);
-  const [notebook, setNotebook] = useState12(initialNotebook || engine.getNotebook());
-  useEffect10(() => {
+  const [notebook, setNotebook] = useState13(initialNotebook || engine.getNotebook());
+  useEffect11(() => {
     const unsub = engine.on("notebook:updated", (payload) => {
       setNotebook(payload.data.notebook);
       if (onChange) onChange(payload.data.notebook);
     });
     return unsub;
   }, [engine, onChange]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (!onCellFocus) return;
     return engine.on("cell:focused", (payload) => {
       onCellFocus(payload.data.cellId);
     });
   }, [engine, onCellFocus]);
-  const pipeline = useMemo6(() => new RenderPipeline(), []);
+  const pipeline = useMemo5(() => new RenderPipeline(), []);
   const cells = notebook.cells;
-  const [showFind, setShowFind] = useState12(false);
-  const [showTOC, setShowTOC] = useState12(showTOCProp);
-  const [focusedCellId, setFocusedCellId] = useState12(null);
-  useEffect10(() => {
+  const [showFind, setShowFind] = useState13(false);
+  const [showTOC, setShowTOC] = useState13(showTOCProp);
+  const [focusedCellId, setFocusedCellId] = useState13(null);
+  useEffect11(() => {
     return engine.on("cell:focused", (payload) => {
       setFocusedCellId(payload.data.cellId);
     });
   }, [engine]);
-  const handleGlobalKeyDown = useCallback11((e) => {
+  const handleGlobalKeyDown = useCallback12((e) => {
     if (readOnly) return;
     if ((e.ctrlKey || e.metaKey) && e.key === "f") {
       e.preventDefault();
@@ -1998,7 +2083,7 @@ var SciNotebook = ({
     }
     engine.handleKeyDown(e.nativeEvent);
   }, [engine, readOnly]);
-  return /* @__PURE__ */ jsx13(NotebookContext.Provider, { value: engine, children: /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsx15(NotebookContext.Provider, { value: engine, children: /* @__PURE__ */ jsxs14(
     "div",
     {
       className: `sci-nb ${className || ""}`,
@@ -2007,10 +2092,10 @@ var SciNotebook = ({
       onKeyDown: handleGlobalKeyDown,
       tabIndex: 0,
       children: [
-        showToolbar && /* @__PURE__ */ jsxs12("div", { className: "sci-nb-toolbar", children: [
-          /* @__PURE__ */ jsx13("div", { className: "sci-nb-toolbar-group", children: /* @__PURE__ */ jsx13("span", { className: "sci-nb-toolbar-title", children: notebook.title }) }),
-          /* @__PURE__ */ jsxs12("div", { className: "sci-nb-toolbar-group", children: [
-            /* @__PURE__ */ jsxs12(
+        showToolbar && /* @__PURE__ */ jsxs14("div", { className: "sci-nb-toolbar", children: [
+          /* @__PURE__ */ jsx15("div", { className: "sci-nb-toolbar-group", children: /* @__PURE__ */ jsx15("span", { className: "sci-nb-toolbar-title", children: notebook.title }) }),
+          /* @__PURE__ */ jsxs14("div", { className: "sci-nb-toolbar-group", children: [
+            /* @__PURE__ */ jsxs14(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2018,12 +2103,12 @@ var SciNotebook = ({
                 disabled: !engine.canUndo(),
                 title: "Undo (Ctrl+Z)",
                 children: [
-                  /* @__PURE__ */ jsx13("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx13("path", { d: "M3 7h6a3 3 0 010 6H7M3 7l3-3M3 7l3 3", strokeLinecap: "round", strokeLinejoin: "round" }) }),
+                  /* @__PURE__ */ jsx15("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx15("path", { d: "M3 7h6a3 3 0 010 6H7M3 7l3-3M3 7l3 3", strokeLinecap: "round", strokeLinejoin: "round" }) }),
                   "Undo"
                 ]
               }
             ),
-            /* @__PURE__ */ jsxs12(
+            /* @__PURE__ */ jsxs14(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2032,12 +2117,12 @@ var SciNotebook = ({
                 title: "Redo (Ctrl+Shift+Z)",
                 children: [
                   "Redo",
-                  /* @__PURE__ */ jsx13("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx13("path", { d: "M11 7H5a3 3 0 000 6h2M11 7l-3-3M11 7l-3 3", strokeLinecap: "round", strokeLinejoin: "round" }) })
+                  /* @__PURE__ */ jsx15("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx15("path", { d: "M11 7H5a3 3 0 000 6h2M11 7l-3-3M11 7l-3 3", strokeLinecap: "round", strokeLinejoin: "round" }) })
                 ]
               }
             ),
-            /* @__PURE__ */ jsx13("span", { className: "sci-nb-toolbar-sep" }),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15("span", { className: "sci-nb-toolbar-sep" }),
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2046,7 +2131,7 @@ var SciNotebook = ({
                 children: "Edit All"
               }
             ),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
@@ -2055,17 +2140,17 @@ var SciNotebook = ({
                 children: "View All"
               }
             ),
-            /* @__PURE__ */ jsx13("span", { className: "sci-nb-toolbar-sep" }),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15("span", { className: "sci-nb-toolbar-sep" }),
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 className: "sci-nb-toolbar-btn",
                 onClick: () => setShowFind((v) => !v),
                 title: "Find & Replace (Ctrl+F)",
-                children: "Buscar"
+                children: "Find"
               }
             ),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 className: `sci-nb-toolbar-btn ${showTOC ? "sci-nb-toolbar-btn--active" : ""}`,
@@ -2076,23 +2161,23 @@ var SciNotebook = ({
             )
           ] })
         ] }),
-        showFind && /* @__PURE__ */ jsx13(FindReplace, { onClose: () => setShowFind(false) }),
-        /* @__PURE__ */ jsxs12("div", { className: "sci-nb-layout", style: { display: "flex", gap: 16 }, children: [
-          showTOC && /* @__PURE__ */ jsx13(TOCSidebar, { focusedCellId }),
-          /* @__PURE__ */ jsxs12("div", { className: "sci-nb-cells", style: { flex: 1 }, children: [
-            cells.length === 0 && /* @__PURE__ */ jsxs12("div", { className: "sci-nb-empty", children: [
-              /* @__PURE__ */ jsx13("div", { className: "sci-nb-empty-icon", children: /* @__PURE__ */ jsxs12("svg", { width: "48", height: "48", viewBox: "0 0 48 48", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-                /* @__PURE__ */ jsx13("rect", { x: "8", y: "6", width: "32", height: "36", rx: "4" }),
-                /* @__PURE__ */ jsx13("line", { x1: "14", y1: "14", x2: "34", y2: "14" }),
-                /* @__PURE__ */ jsx13("line", { x1: "14", y1: "22", x2: "28", y2: "22" }),
-                /* @__PURE__ */ jsx13("line", { x1: "14", y1: "30", x2: "22", y2: "30" })
+        showFind && /* @__PURE__ */ jsx15(FindReplace, { onClose: () => setShowFind(false) }),
+        /* @__PURE__ */ jsxs14("div", { className: "sci-nb-layout", style: { display: "flex", gap: 16 }, children: [
+          showTOC && /* @__PURE__ */ jsx15(TOCSidebar, { focusedCellId }),
+          /* @__PURE__ */ jsxs14("div", { className: "sci-nb-cells", style: { flex: 1 }, children: [
+            cells.length === 0 && /* @__PURE__ */ jsxs14("div", { className: "sci-nb-empty", children: [
+              /* @__PURE__ */ jsx15("div", { className: "sci-nb-empty-icon", children: /* @__PURE__ */ jsxs14("svg", { width: "48", height: "48", viewBox: "0 0 48 48", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+                /* @__PURE__ */ jsx15("rect", { x: "8", y: "6", width: "32", height: "36", rx: "4" }),
+                /* @__PURE__ */ jsx15("line", { x1: "14", y1: "14", x2: "34", y2: "14" }),
+                /* @__PURE__ */ jsx15("line", { x1: "14", y1: "22", x2: "28", y2: "22" }),
+                /* @__PURE__ */ jsx15("line", { x1: "14", y1: "30", x2: "22", y2: "30" })
               ] }) }),
-              /* @__PURE__ */ jsx13("p", { children: "Notebook vacio. Agrega una celda para comenzar." }),
-              /* @__PURE__ */ jsx13(InsertHandle, { index: 0 })
+              /* @__PURE__ */ jsx15("p", { children: "Empty notebook. Add a cell to get started." }),
+              /* @__PURE__ */ jsx15(InsertHandle, { index: 0 })
             ] }),
-            cells.length > 0 && /* @__PURE__ */ jsx13(InsertHandle, { index: 0 }),
-            cells.map((cell, idx) => /* @__PURE__ */ jsxs12(React12.Fragment, { children: [
-              /* @__PURE__ */ jsx13(
+            cells.length > 0 && /* @__PURE__ */ jsx15(InsertHandle, { index: 0 }),
+            cells.map((cell, idx) => /* @__PURE__ */ jsxs14(React13.Fragment, { children: [
+              /* @__PURE__ */ jsx15(
                 Cell,
                 {
                   cellId: cell.id,
@@ -2101,7 +2186,7 @@ var SciNotebook = ({
                   totalCells: cells.length
                 }
               ),
-              /* @__PURE__ */ jsx13(InsertHandle, { index: idx + 1 })
+              /* @__PURE__ */ jsx15(InsertHandle, { index: idx + 1 })
             ] }, cell.id))
           ] })
         ] })
@@ -2123,8 +2208,8 @@ function parseInitialContent(content) {
 }
 
 // src/components/LatexAutocomplete.tsx
-import { useState as useState13, useEffect as useEffect11, useRef as useRef9, useMemo as useMemo7 } from "react";
-import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { useState as useState14, useEffect as useEffect12, useRef as useRef10, useMemo as useMemo6 } from "react";
+import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
 var LATEX_COMMANDS = [
   // Structures
   { cmd: "\\frac{}{}", desc: "Fracci\xF3n", category: "struct" },
@@ -2256,19 +2341,19 @@ var LatexAutocomplete = ({
   onSelect,
   onClose
 }) => {
-  const [selectedIndex, setSelectedIndex] = useState13(0);
-  const menuRef = useRef9(null);
-  const filtered = useMemo7(() => {
+  const [selectedIndex, setSelectedIndex] = useState14(0);
+  const menuRef = useRef10(null);
+  const filtered = useMemo6(() => {
     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]);
-  useEffect11(() => {
+  useEffect12(() => {
     setSelectedIndex(0);
   }, [query]);
-  useEffect11(() => {
+  useEffect12(() => {
     const handleKey = (e) => {
       if (e.key === "ArrowDown") {
         e.preventDefault();
@@ -2293,23 +2378,23 @@ var LatexAutocomplete = ({
     return () => document.removeEventListener("keydown", handleKey, true);
   }, [filtered, selectedIndex, onSelect, onClose]);
   if (filtered.length === 0) return null;
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       ref: menuRef,
       className: "sci-nb-slash-menu",
       style: { top: position.top, left: position.left, minWidth: 220 },
-      children: filtered.map((item, i) => /* @__PURE__ */ jsxs13(
+      children: filtered.map((item, i) => /* @__PURE__ */ jsxs15(
         "button",
         {
           className: `sci-nb-slash-item ${i === selectedIndex ? "sci-nb-slash-item--active" : ""}`,
           onMouseEnter: () => setSelectedIndex(i),
           onClick: () => onSelect(item.cmd),
           children: [
-            /* @__PURE__ */ jsx14("span", { className: "sci-nb-slash-icon", style: { fontFamily: "monospace", fontSize: 11 }, children: item.desc.length <= 2 ? item.desc : item.cmd.slice(0, 4) }),
-            /* @__PURE__ */ jsxs13("div", { className: "sci-nb-slash-text", children: [
-              /* @__PURE__ */ jsx14("span", { className: "sci-nb-slash-label", style: { fontFamily: "monospace", fontSize: 12 }, children: item.cmd }),
-              /* @__PURE__ */ jsx14("span", { className: "sci-nb-slash-desc", children: item.desc })
+            /* @__PURE__ */ jsx16("span", { className: "sci-nb-slash-icon", style: { fontFamily: "monospace", fontSize: 11 }, children: item.desc.length <= 2 ? item.desc : item.cmd.slice(0, 4) }),
+            /* @__PURE__ */ jsxs15("div", { className: "sci-nb-slash-text", children: [
+              /* @__PURE__ */ jsx16("span", { className: "sci-nb-slash-label", style: { fontFamily: "monospace", fontSize: 12 }, children: item.cmd }),
+              /* @__PURE__ */ jsx16("span", { className: "sci-nb-slash-desc", children: item.desc })
             ] })
           ]
         },
@@ -2320,15 +2405,15 @@ var LatexAutocomplete = ({
 };
 
 // src/components/GhostText.tsx
-import { useEffect as useEffect12, useCallback as useCallback13 } from "react";
-import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+import { useEffect as useEffect13, useCallback as useCallback14 } from "react";
+import { jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
 var GhostText = ({
   text,
   textareaRef,
   onAccept,
   onDismiss
 }) => {
-  const handleKeyDown = useCallback13((e) => {
+  const handleKeyDown = useCallback14((e) => {
     if (e.key === "Tab" && !e.shiftKey) {
       e.preventDefault();
       e.stopPropagation();
@@ -2338,7 +2423,7 @@ var GhostText = ({
       onDismiss();
     }
   }, [onAccept, onDismiss]);
-  useEffect12(() => {
+  useEffect13(() => {
     const ta2 = textareaRef.current;
     if (!ta2) return;
     ta2.addEventListener("keydown", handleKeyDown, true);
@@ -2356,7 +2441,7 @@ var GhostText = ({
   const left = lines[lines.length - 1].length * charWidth;
   const firstLine = text.split("\n")[0];
   const hasMore = text.includes("\n");
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs16(
     "div",
     {
       className: "sci-nb-ghost-text",
@@ -2374,15 +2459,15 @@ var GhostText = ({
       children: [
         firstLine,
         hasMore ? "..." : "",
-        /* @__PURE__ */ jsx15("span", { style: { fontSize: 10, opacity: 0.5, marginLeft: 8 }, children: "Tab \u21B9" })
+        /* @__PURE__ */ jsx17("span", { style: { fontSize: 10, opacity: 0.5, marginLeft: 8 }, children: "Tab \u21B9" })
       ]
     }
   );
 };
 
 // src/components/ChatSidebar.tsx
-import { useState as useState14, useCallback as useCallback14, useRef as useRef10, useEffect as useEffect13 } from "react";
-import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
+import { useState as useState15, useCallback as useCallback15, useRef as useRef11, useEffect as useEffect14 } from "react";
+import { jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
 var ChatSidebar = ({
   onSend,
   systemPrompt,
@@ -2390,23 +2475,23 @@ var ChatSidebar = ({
   onClose
 }) => {
   const engine = useSciNotebook();
-  const [messages, setMessages] = useState14(() => {
+  const [messages, setMessages] = useState15(() => {
     if (systemPrompt) {
       return [{ role: "system", content: systemPrompt, timestamp: Date.now() }];
     }
     return [];
   });
-  const [input, setInput] = useState14("");
-  const [loading, setLoading] = useState14(false);
-  const messagesEndRef = useRef10(null);
-  const inputRef = useRef10(null);
-  useEffect13(() => {
+  const [input, setInput] = useState15("");
+  const [loading, setLoading] = useState15(false);
+  const messagesEndRef = useRef11(null);
+  const inputRef = useRef11(null);
+  useEffect14(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages]);
-  useEffect13(() => {
+  useEffect14(() => {
     inputRef.current?.focus();
   }, []);
-  const handleSend = useCallback14(async () => {
+  const handleSend = useCallback15(async () => {
     const text = input.trim();
     if (!text || loading) return;
     const userMsg = { role: "user", content: text, timestamp: Date.now() };
@@ -2444,17 +2529,17 @@ var ChatSidebar = ({
       setLoading(false);
     }
   }, [input, messages, loading, onSend]);
-  const handleKeyDown = useCallback14((e) => {
+  const handleKeyDown = useCallback15((e) => {
     if (e.key === "Enter" && !e.shiftKey) {
       e.preventDefault();
       handleSend();
     }
   }, [handleSend]);
   const visibleMessages = messages.filter((m) => m.role !== "system");
-  return /* @__PURE__ */ jsxs15("div", { className: "sci-nb-chat-sidebar", children: [
-    /* @__PURE__ */ jsxs15("div", { className: "sci-nb-chat-header", children: [
-      /* @__PURE__ */ jsx16("span", { children: "AI Assistant" }),
-      onClose && /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs17("div", { className: "sci-nb-chat-sidebar", children: [
+    /* @__PURE__ */ jsxs17("div", { className: "sci-nb-chat-header", children: [
+      /* @__PURE__ */ jsx18("span", { children: "AI Assistant" }),
+      onClose && /* @__PURE__ */ jsx18(
         "button",
         {
           onClick: onClose,
@@ -2463,11 +2548,11 @@ var ChatSidebar = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs15("div", { className: "sci-nb-chat-messages", children: [
-      visibleMessages.length === 0 && /* @__PURE__ */ jsx16("div", { style: { textAlign: "center", color: "#94a3b8", padding: 24 }, children: "Ask me anything about your notebook..." }),
-      visibleMessages.map((msg, i) => /* @__PURE__ */ jsxs15("div", { className: `sci-nb-chat-msg sci-nb-chat-msg--${msg.role}`, children: [
-        /* @__PURE__ */ jsx16("div", { children: msg.content }),
-        msg.role === "assistant" && onApply && /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsxs17("div", { className: "sci-nb-chat-messages", children: [
+      visibleMessages.length === 0 && /* @__PURE__ */ jsx18("div", { style: { textAlign: "center", color: "#94a3b8", padding: 24 }, children: "Ask me anything about your notebook..." }),
+      visibleMessages.map((msg, i) => /* @__PURE__ */ jsxs17("div", { className: `sci-nb-chat-msg sci-nb-chat-msg--${msg.role}`, children: [
+        /* @__PURE__ */ jsx18("div", { children: msg.content }),
+        msg.role === "assistant" && onApply && /* @__PURE__ */ jsx18(
           "button",
           {
             onClick: () => onApply(msg.content),
@@ -2484,11 +2569,11 @@ var ChatSidebar = ({
           }
         )
       ] }, i)),
-      loading && /* @__PURE__ */ jsx16("div", { className: "sci-nb-chat-msg sci-nb-chat-msg--assistant", style: { opacity: 0.6 }, children: "Thinking..." }),
-      /* @__PURE__ */ jsx16("div", { ref: messagesEndRef })
+      loading && /* @__PURE__ */ jsx18("div", { className: "sci-nb-chat-msg sci-nb-chat-msg--assistant", style: { opacity: 0.6 }, children: "Thinking..." }),
+      /* @__PURE__ */ jsx18("div", { ref: messagesEndRef })
     ] }),
-    /* @__PURE__ */ jsxs15("div", { className: "sci-nb-chat-input", children: [
-      /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsxs17("div", { className: "sci-nb-chat-input", children: [
+      /* @__PURE__ */ jsx18(
         "input",
         {
           ref: inputRef,
@@ -2500,14 +2585,14 @@ var ChatSidebar = ({
           disabled: loading
         }
       ),
-      /* @__PURE__ */ jsx16("button", { onClick: handleSend, disabled: loading || !input.trim(), children: "Send" })
+      /* @__PURE__ */ jsx18("button", { onClick: handleSend, disabled: loading || !input.trim(), children: "Send" })
     ] })
   ] });
 };
 
 // src/components/ImageResize.tsx
-import { useState as useState15, useCallback as useCallback15, useRef as useRef11, useEffect as useEffect14 } from "react";
-import { jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useState as useState16, useCallback as useCallback16, useRef as useRef12, useEffect as useEffect15 } from "react";
+import { jsx as jsx19, jsxs as jsxs18 } from "react/jsx-runtime";
 var ImageResize = ({
   src,
   alt = "",
@@ -2516,12 +2601,12 @@ var ImageResize = ({
   onResize,
   children
 }) => {
-  const containerRef = useRef11(null);
-  const imgRef = useRef11(null);
-  const [dragging, setDragging] = useState15(false);
-  const [width, setWidth] = useState15(null);
-  const startRef = useRef11({ x: 0, w: 0 });
-  const handleMouseDown = useCallback15((e) => {
+  const containerRef = useRef12(null);
+  const imgRef = useRef12(null);
+  const [dragging, setDragging] = useState16(false);
+  const [width, setWidth] = useState16(null);
+  const startRef = useRef12({ x: 0, w: 0 });
+  const handleMouseDown = useCallback16((e) => {
     e.preventDefault();
     e.stopPropagation();
     const img = imgRef.current;
@@ -2529,7 +2614,7 @@ var ImageResize = ({
     startRef.current = { x: e.clientX, w: img.offsetWidth };
     setDragging(true);
   }, []);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!dragging) return;
     const handleMouseMove = (e) => {
       const dx = e.clientX - startRef.current.x;
@@ -2557,8 +2642,8 @@ var ImageResize = ({
     position: "relative",
     display: "inline-block"
   };
-  return /* @__PURE__ */ jsxs16("div", { ref: containerRef, className: "sci-nb-image-resizable", style, children: [
-    /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsxs18("div", { ref: containerRef, className: "sci-nb-image-resizable", style, children: [
+    /* @__PURE__ */ jsx19(
       "img",
       {
         ref: imgRef,
@@ -2569,7 +2654,7 @@ var ImageResize = ({
       }
     ),
     children,
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx19(
       "div",
       {
         className: "sci-nb-image-resize-handle sci-nb-image-resize-handle--se",
@@ -2580,28 +2665,28 @@ var ImageResize = ({
 };
 
 // src/components/VirtualRenderer.tsx
-import { useState as useState16, useEffect as useEffect15, useRef as useRef12, useMemo as useMemo8, useCallback as useCallback16 } from "react";
-import { jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
+import { useState as useState17, useEffect as useEffect16, useRef as useRef13, useMemo as useMemo7, useCallback as useCallback17 } from "react";
+import { jsx as jsx20, jsxs as jsxs19 } from "react/jsx-runtime";
 var VirtualRenderer = ({
   cells,
   pipeline,
   estimatedHeight = 120,
   overscan = 5
 }) => {
-  const containerRef = useRef12(null);
-  const [visibleRange, setVisibleRange] = useState16({ start: 0, end: 20 });
-  const cellHeights = useRef12(/* @__PURE__ */ new Map());
-  const getHeight = useCallback16((index) => {
+  const containerRef = useRef13(null);
+  const [visibleRange, setVisibleRange] = useState17({ start: 0, end: 20 });
+  const cellHeights = useRef13(/* @__PURE__ */ new Map());
+  const getHeight = useCallback17((index) => {
     return cellHeights.current.get(index) ?? estimatedHeight;
   }, [estimatedHeight]);
-  const totalHeight = useMemo8(() => {
+  const totalHeight = useMemo7(() => {
     let h = 0;
     for (let i = 0; i < cells.length; i++) {
       h += getHeight(i) + 32;
     }
     return h;
   }, [cells.length, getHeight]);
-  useEffect15(() => {
+  useEffect16(() => {
     const container = containerRef.current;
     if (!container) return;
     const handleScroll = () => {
@@ -2630,7 +2715,7 @@ var VirtualRenderer = ({
     container.addEventListener("scroll", handleScroll, { passive: true });
     return () => container.removeEventListener("scroll", handleScroll);
   }, [cells.length, getHeight, overscan]);
-  const measureRef = useCallback16((index) => {
+  const measureRef = useCallback17((index) => {
     return (el) => {
       if (!el) return;
       const observer = new ResizeObserver((entries) => {
@@ -2644,7 +2729,7 @@ var VirtualRenderer = ({
       observer.observe(el);
     };
   }, []);
-  const topOffset = useMemo8(() => {
+  const topOffset = useMemo7(() => {
     let h = 0;
     for (let i = 0; i < visibleRange.start; i++) {
       h += getHeight(i) + 32;
@@ -2652,18 +2737,18 @@ var VirtualRenderer = ({
     return h;
   }, [visibleRange.start, getHeight]);
   const visibleCells = cells.slice(visibleRange.start, visibleRange.end);
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx20(
     "div",
     {
       ref: containerRef,
       className: "sci-nb-virtual-container",
       style: { height: "100%", overflow: "auto", position: "relative" },
-      children: /* @__PURE__ */ jsx18("div", { style: { height: totalHeight, position: "relative" }, children: /* @__PURE__ */ jsxs17("div", { style: { position: "absolute", top: topOffset, left: 0, right: 0 }, children: [
-        visibleRange.start === 0 && /* @__PURE__ */ jsx18(InsertHandle, { index: 0 }),
+      children: /* @__PURE__ */ jsx20("div", { style: { height: totalHeight, position: "relative" }, children: /* @__PURE__ */ jsxs19("div", { style: { position: "absolute", top: topOffset, left: 0, right: 0 }, children: [
+        visibleRange.start === 0 && /* @__PURE__ */ jsx20(InsertHandle, { index: 0 }),
         visibleCells.map((cell, i) => {
           const realIndex = visibleRange.start + i;
-          return /* @__PURE__ */ jsxs17("div", { ref: measureRef(realIndex), children: [
-            /* @__PURE__ */ jsx18(
+          return /* @__PURE__ */ jsxs19("div", { ref: measureRef(realIndex), children: [
+            /* @__PURE__ */ jsx20(
               Cell,
               {
                 cellId: cell.id,
@@ -2672,7 +2757,7 @@ var VirtualRenderer = ({
                 totalCells: cells.length
               }
             ),
-            /* @__PURE__ */ jsx18(InsertHandle, { index: realIndex + 1 })
+            /* @__PURE__ */ jsx20(InsertHandle, { index: realIndex + 1 })
           ] }, cell.id);
         })
       ] }) })
@@ -2681,8 +2766,8 @@ var VirtualRenderer = ({
 };
 
 // src/components/AIRewrite.tsx
-import { useState as useState17, useCallback as useCallback17, useRef as useRef13, useEffect as useEffect16 } from "react";
-import { jsx as jsx19, jsxs as jsxs18 } from "react/jsx-runtime";
+import { useState as useState18, useCallback as useCallback18, useRef as useRef14, useEffect as useEffect17 } from "react";
+import { jsx as jsx21, jsxs as jsxs20 } from "react/jsx-runtime";
 var AIRewrite = ({
   selectedText,
   position,
@@ -2690,15 +2775,15 @@ var AIRewrite = ({
   onAccept,
   onReject
 }) => {
-  const [state, setState] = useState17("prompt");
-  const [instruction, setInstruction] = useState17("");
-  const [result, setResult] = useState17("");
-  const [error, setError] = useState17(null);
-  const inputRef = useRef13(null);
-  useEffect16(() => {
+  const [state, setState] = useState18("prompt");
+  const [instruction, setInstruction] = useState18("");
+  const [result, setResult] = useState18("");
+  const [error, setError] = useState18(null);
+  const inputRef = useRef14(null);
+  useEffect17(() => {
     inputRef.current?.focus();
   }, []);
-  const handleSubmit = useCallback17(async () => {
+  const handleSubmit = useCallback18(async () => {
     if (!instruction.trim()) return;
     setState("loading");
     setError(null);
@@ -2711,7 +2796,7 @@ var AIRewrite = ({
       setState("prompt");
     }
   }, [instruction, selectedText, onRewrite]);
-  const handleKeyDown = useCallback17((e) => {
+  const handleKeyDown = useCallback18((e) => {
     if (e.key === "Enter" && !e.shiftKey) {
       e.preventDefault();
       handleSubmit();
@@ -2720,15 +2805,15 @@ var AIRewrite = ({
       onReject();
     }
   }, [handleSubmit, onReject]);
-  const handleAccept = useCallback17(() => {
+  const handleAccept = useCallback18(() => {
     onAccept(result);
   }, [result, onAccept]);
-  const handleRetry = useCallback17(() => {
+  const handleRetry = useCallback18(() => {
     setState("prompt");
     setResult("");
     inputRef.current?.focus();
   }, []);
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs20(
     "div",
     {
       className: "sci-nb-ai-rewrite",
@@ -2739,13 +2824,13 @@ var AIRewrite = ({
         zIndex: 100
       },
       children: [
-        state === "prompt" && /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-prompt", children: [
-          /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-selected", children: [
-            /* @__PURE__ */ jsx19("span", { className: "sci-nb-ai-rewrite-label", children: "Selected:" }),
-            /* @__PURE__ */ jsx19("span", { className: "sci-nb-ai-rewrite-text", children: selectedText.length > 80 ? selectedText.slice(0, 80) + "..." : selectedText })
+        state === "prompt" && /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-prompt", children: [
+          /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-selected", children: [
+            /* @__PURE__ */ jsx21("span", { className: "sci-nb-ai-rewrite-label", children: "Selected:" }),
+            /* @__PURE__ */ jsx21("span", { className: "sci-nb-ai-rewrite-text", children: selectedText.length > 80 ? selectedText.slice(0, 80) + "..." : selectedText })
           ] }),
-          /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-input-row", children: [
-            /* @__PURE__ */ jsx19(
+          /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-input-row", children: [
+            /* @__PURE__ */ jsx21(
               "input",
               {
                 ref: inputRef,
@@ -2757,7 +2842,7 @@ var AIRewrite = ({
                 className: "sci-nb-ai-rewrite-input"
               }
             ),
-            /* @__PURE__ */ jsx19(
+            /* @__PURE__ */ jsx21(
               "button",
               {
                 onClick: handleSubmit,
@@ -2766,24 +2851,24 @@ var AIRewrite = ({
                 children: "Rewrite"
               }
             ),
-            /* @__PURE__ */ jsx19("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+            /* @__PURE__ */ jsx21("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
           ] }),
-          error && /* @__PURE__ */ jsx19("div", { className: "sci-nb-ai-rewrite-error", children: error })
+          error && /* @__PURE__ */ jsx21("div", { className: "sci-nb-ai-rewrite-error", children: error })
         ] }),
-        state === "loading" && /* @__PURE__ */ jsx19("div", { className: "sci-nb-ai-rewrite-loading", children: /* @__PURE__ */ jsx19("span", { children: "Rewriting..." }) }),
-        state === "preview" && /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-preview", children: [
-          /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-diff", children: [
-            /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-diff-old", children: [
-              /* @__PURE__ */ jsx19("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Original:" }),
-              /* @__PURE__ */ jsx19("pre", { children: selectedText })
+        state === "loading" && /* @__PURE__ */ jsx21("div", { className: "sci-nb-ai-rewrite-loading", children: /* @__PURE__ */ jsx21("span", { children: "Rewriting..." }) }),
+        state === "preview" && /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-preview", children: [
+          /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-diff", children: [
+            /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-diff-old", children: [
+              /* @__PURE__ */ jsx21("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Original:" }),
+              /* @__PURE__ */ jsx21("pre", { children: selectedText })
             ] }),
-            /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-diff-new", children: [
-              /* @__PURE__ */ jsx19("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Rewritten:" }),
-              /* @__PURE__ */ jsx19("pre", { children: result })
+            /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-diff-new", children: [
+              /* @__PURE__ */ jsx21("span", { className: "sci-nb-ai-rewrite-diff-label", children: "Rewritten:" }),
+              /* @__PURE__ */ jsx21("pre", { children: result })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-actions", children: [
-            /* @__PURE__ */ jsx19(
+          /* @__PURE__ */ jsxs20("div", { className: "sci-nb-ai-rewrite-actions", children: [
+            /* @__PURE__ */ jsx21(
               "button",
               {
                 onClick: handleAccept,
@@ -2791,8 +2876,8 @@ var AIRewrite = ({
                 children: "Accept"
               }
             ),
-            /* @__PURE__ */ jsx19("button", { onClick: handleRetry, className: "sci-nb-ai-rewrite-btn", children: "Retry" }),
-            /* @__PURE__ */ jsx19("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Reject" })
+            /* @__PURE__ */ jsx21("button", { onClick: handleRetry, className: "sci-nb-ai-rewrite-btn", children: "Retry" }),
+            /* @__PURE__ */ jsx21("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Reject" })
           ] })
         ] })
       ]
@@ -2801,22 +2886,22 @@ var AIRewrite = ({
 };
 
 // src/components/AICellGenerate.tsx
-import { useState as useState18, useCallback as useCallback18, useRef as useRef14, useEffect as useEffect17 } from "react";
-import { jsx as jsx20, jsxs as jsxs19 } from "react/jsx-runtime";
+import { useState as useState19, useCallback as useCallback19, useRef as useRef15, useEffect as useEffect18 } from "react";
+import { jsx as jsx22, jsxs as jsxs21 } from "react/jsx-runtime";
 var AICellGenerate = ({
   onGenerate,
   onAccept,
   onCancel
 }) => {
-  const [state, setState] = useState18("prompt");
-  const [prompt, setPrompt] = useState18("");
-  const [cells, setCells] = useState18([]);
-  const [error, setError] = useState18(null);
-  const inputRef = useRef14(null);
-  useEffect17(() => {
+  const [state, setState] = useState19("prompt");
+  const [prompt, setPrompt] = useState19("");
+  const [cells, setCells] = useState19([]);
+  const [error, setError] = useState19(null);
+  const inputRef = useRef15(null);
+  useEffect18(() => {
     inputRef.current?.focus();
   }, []);
-  const handleGenerate = useCallback18(async () => {
+  const handleGenerate = useCallback19(async () => {
     if (!prompt.trim()) return;
     setState("loading");
     setError(null);
@@ -2829,7 +2914,7 @@ var AICellGenerate = ({
       setState("prompt");
     }
   }, [prompt, onGenerate]);
-  const handleKeyDown = useCallback18((e) => {
+  const handleKeyDown = useCallback19((e) => {
     if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
       e.preventDefault();
       handleGenerate();
@@ -2838,10 +2923,10 @@ var AICellGenerate = ({
       onCancel();
     }
   }, [handleGenerate, onCancel]);
-  const handleAccept = useCallback18(() => {
+  const handleAccept = useCallback19(() => {
     onAccept(cells);
   }, [cells, onAccept]);
-  const handleRegenerate = useCallback18(() => {
+  const handleRegenerate = useCallback19(() => {
     setState("prompt");
     setCells([]);
     inputRef.current?.focus();
@@ -2854,13 +2939,13 @@ var AICellGenerate = ({
     mermaid: "Mermaid",
     raw: "Raw"
   };
-  return /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate", children: [
-    state === "prompt" && /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-prompt", children: [
-      /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-header", children: [
-        /* @__PURE__ */ jsx20("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx20("path", { d: "M8 1v14M1 8h14", strokeLinecap: "round" }) }),
-        /* @__PURE__ */ jsx20("span", { children: "Generate cells with AI" })
+  return /* @__PURE__ */ jsxs21("div", { className: "sci-nb-ai-generate", children: [
+    state === "prompt" && /* @__PURE__ */ jsxs21("div", { className: "sci-nb-ai-generate-prompt", children: [
+      /* @__PURE__ */ jsxs21("div", { className: "sci-nb-ai-generate-header", children: [
+        /* @__PURE__ */ jsx22("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx22("path", { d: "M8 1v14M1 8h14", strokeLinecap: "round" }) }),
+        /* @__PURE__ */ jsx22("span", { children: "Generate cells with AI" })
       ] }),
-      /* @__PURE__ */ jsx20(
+      /* @__PURE__ */ jsx22(
         "textarea",
         {
           ref: inputRef,
@@ -2872,8 +2957,8 @@ var AICellGenerate = ({
           rows: 3
         }
       ),
-      /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-actions", children: [
-        /* @__PURE__ */ jsx20(
+      /* @__PURE__ */ jsxs21("div", { className: "sci-nb-ai-generate-actions", children: [
+        /* @__PURE__ */ jsx22(
           "button",
           {
             onClick: handleGenerate,
@@ -2882,24 +2967,24 @@ var AICellGenerate = ({
             children: "Generate (Ctrl+Enter)"
           }
         ),
-        /* @__PURE__ */ jsx20("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+        /* @__PURE__ */ jsx22("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
       ] }),
-      error && /* @__PURE__ */ jsx20("div", { className: "sci-nb-ai-rewrite-error", children: error })
+      error && /* @__PURE__ */ jsx22("div", { className: "sci-nb-ai-rewrite-error", children: error })
     ] }),
-    state === "loading" && /* @__PURE__ */ jsx20("div", { className: "sci-nb-ai-generate-loading", children: /* @__PURE__ */ jsx20("span", { children: "Generating cells..." }) }),
-    state === "preview" && /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-preview", children: [
-      /* @__PURE__ */ jsx20("div", { className: "sci-nb-ai-generate-header", children: /* @__PURE__ */ jsxs19("span", { children: [
+    state === "loading" && /* @__PURE__ */ jsx22("div", { className: "sci-nb-ai-generate-loading", children: /* @__PURE__ */ jsx22("span", { children: "Generating cells..." }) }),
+    state === "preview" && /* @__PURE__ */ jsxs21("div", { className: "sci-nb-ai-generate-preview", children: [
+      /* @__PURE__ */ jsx22("div", { className: "sci-nb-ai-generate-header", children: /* @__PURE__ */ jsxs21("span", { children: [
         "Generated ",
         cells.length,
         " cell",
         cells.length !== 1 ? "s" : ""
       ] }) }),
-      /* @__PURE__ */ jsx20("div", { className: "sci-nb-ai-generate-cells", children: cells.map((cell, i) => /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-cell", children: [
-        /* @__PURE__ */ jsx20("div", { className: "sci-nb-ai-generate-cell-badge", children: CELL_TYPE_LABELS[cell.type] || cell.type }),
-        /* @__PURE__ */ jsx20("pre", { className: "sci-nb-ai-generate-cell-source", children: cell.source.length > 200 ? cell.source.slice(0, 200) + "..." : cell.source })
+      /* @__PURE__ */ jsx22("div", { className: "sci-nb-ai-generate-cells", children: cells.map((cell, i) => /* @__PURE__ */ jsxs21("div", { className: "sci-nb-ai-generate-cell", children: [
+        /* @__PURE__ */ jsx22("div", { className: "sci-nb-ai-generate-cell-badge", children: CELL_TYPE_LABELS[cell.type] || cell.type }),
+        /* @__PURE__ */ jsx22("pre", { className: "sci-nb-ai-generate-cell-source", children: cell.source.length > 200 ? cell.source.slice(0, 200) + "..." : cell.source })
       ] }, i)) }),
-      /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-actions", children: [
-        /* @__PURE__ */ jsxs19(
+      /* @__PURE__ */ jsxs21("div", { className: "sci-nb-ai-generate-actions", children: [
+        /* @__PURE__ */ jsxs21(
           "button",
           {
             onClick: handleAccept,
@@ -2912,8 +2997,8 @@ var AICellGenerate = ({
             ]
           }
         ),
-        /* @__PURE__ */ jsx20("button", { onClick: handleRegenerate, className: "sci-nb-ai-rewrite-btn", children: "Regenerate" }),
-        /* @__PURE__ */ jsx20("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+        /* @__PURE__ */ jsx22("button", { onClick: handleRegenerate, className: "sci-nb-ai-rewrite-btn", children: "Regenerate" }),
+        /* @__PURE__ */ jsx22("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
       ] })
     ] })
   ] });