@velo-sci/notebook-react 0.6.1

package/dist/index.js

@@ -0,0 +1,2954 @@
+// src/hooks.ts
+import { createContext, useContext, useEffect, useState } from "react";
+var NotebookContext = createContext(null);
+function useSciNotebook() {
+  const engine = useContext(NotebookContext);
+  if (!engine) {
+    throw new Error("useSciNotebook must be used within a NotebookProvider or SciNotebook component");
+  }
+  return engine;
+}
+function useNotebook() {
+  const engine = useSciNotebook();
+  const [notebook, setNotebook] = useState(engine.getNotebook());
+  useEffect(() => {
+    return engine.on("notebook:updated", (payload) => {
+      setNotebook({ ...payload.data.notebook });
+    });
+  }, [engine]);
+  return notebook;
+}
+function useCell(cellId) {
+  const engine = useSciNotebook();
+  const [, forceUpdate] = useState(0);
+  useEffect(() => {
+    const handler = (payload) => {
+      if (payload.data.cellId === cellId || payload.type === "notebook:updated") {
+        forceUpdate((v) => v + 1);
+      }
+    };
+    const unsubUpdated = engine.on("cell:updated", handler);
+    const unsubMode = engine.on("cell:mode-changed", handler);
+    const unsubNb = engine.on("notebook:updated", handler);
+    return () => {
+      unsubUpdated();
+      unsubMode();
+      unsubNb();
+    };
+  }, [engine, cellId]);
+  return engine.getCell(cellId);
+}
+function useFocusedCell() {
+  const engine = useSciNotebook();
+  const [focusedId, setFocusedId] = useState(null);
+  useEffect(() => {
+    return engine.on("cell:focused", (payload) => {
+      setFocusedId(payload.data.cellId);
+    });
+  }, [engine]);
+  return focusedId;
+}
+function useNotebookEvent(type, handler) {
+  const engine = useSciNotebook();
+  useEffect(() => {
+    return engine.on(type, handler);
+  }, [engine, type, handler]);
+}
+
+// src/components/SciNotebook.tsx
+import React12, { useMemo as useMemo6, useEffect as useEffect10, useState as useState12, useCallback as useCallback11 } 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";
+
+// src/components/FloatingToolbar.tsx
+import { useEffect as useEffect2, useRef, useState as useState2, useCallback } from "react";
+import { jsx } from "react/jsx-runtime";
+var FORMAT_ACTIONS = [
+  { label: "B", title: "Bold (Ctrl+B)", wrap: ["**", "**"], style: "font-weight:700" },
+  { label: "I", title: "Italic (Ctrl+I)", wrap: ["*", "*"], style: "font-style:italic" },
+  { label: "S", title: "Strikethrough", wrap: ["~~", "~~"], style: "text-decoration:line-through" },
+  { label: "<>", title: "Inline code", wrap: ["`", "`"], style: "font-family:monospace;font-size:12px" },
+  { label: "H1", title: "Heading 1", prefix: "# ", wrap: null, style: "font-weight:700;font-size:12px" },
+  { label: "H2", title: "Heading 2", prefix: "## ", wrap: null, style: "font-weight:700;font-size:11px" },
+  { label: "\u{1F517}", title: "Link", wrap: ["[", "](url)"], style: "" },
+  { label: "\u2022", title: "Bullet list", prefix: "- ", wrap: null, style: "font-size:16px" }
+];
+var FloatingToolbar = ({ cellId, textareaRef }) => {
+  const engine = useSciNotebook();
+  const toolbarRef = useRef(null);
+  const [pos, setPos] = useState2({ top: 0, left: 0, visible: false });
+  const updatePosition = useCallback(() => {
+    const ta = textareaRef.current;
+    if (!ta) return;
+    const start = ta.selectionStart;
+    const end = ta.selectionEnd;
+    if (start === end) {
+      setPos((p) => ({ ...p, visible: false }));
+      return;
+    }
+    const taRect = ta.getBoundingClientRect();
+    setPos({
+      top: taRect.top - 44,
+      left: taRect.left + taRect.width / 2,
+      visible: true
+    });
+  }, [textareaRef]);
+  useEffect2(() => {
+    const ta = textareaRef.current;
+    if (!ta) return;
+    const onSelect = () => {
+      requestAnimationFrame(updatePosition);
+    };
+    ta.addEventListener("select", onSelect);
+    ta.addEventListener("mouseup", onSelect);
+    ta.addEventListener("keyup", onSelect);
+    document.addEventListener("mousedown", (e) => {
+      if (toolbarRef.current && !toolbarRef.current.contains(e.target) && e.target !== ta) {
+        setPos((p) => ({ ...p, visible: false }));
+      }
+    });
+    return () => {
+      ta.removeEventListener("select", onSelect);
+      ta.removeEventListener("mouseup", onSelect);
+      ta.removeEventListener("keyup", onSelect);
+    };
+  }, [textareaRef, updatePosition]);
+  const applyFormat = useCallback((action) => {
+    const ta = textareaRef.current;
+    if (!ta) return;
+    const start = ta.selectionStart;
+    const end = ta.selectionEnd;
+    const source = ta.value;
+    const selected = source.slice(start, end);
+    let newSource;
+    let newCursorStart;
+    let newCursorEnd;
+    if (action.wrap) {
+      const [before, after] = action.wrap;
+      newSource = source.slice(0, start) + before + selected + after + source.slice(end);
+      newCursorStart = start + before.length;
+      newCursorEnd = end + before.length;
+    } else if ("prefix" in action && action.prefix) {
+      const lineStart = source.lastIndexOf("\n", start - 1) + 1;
+      const lineEnd = source.indexOf("\n", end);
+      const actualEnd = lineEnd === -1 ? source.length : lineEnd;
+      const lines = source.slice(lineStart, actualEnd).split("\n");
+      const prefixed = lines.map((l) => action.prefix + l).join("\n");
+      newSource = source.slice(0, lineStart) + prefixed + source.slice(actualEnd);
+      newCursorStart = start + action.prefix.length;
+      newCursorEnd = end + action.prefix.length * lines.length;
+    } else {
+      return;
+    }
+    engine.updateCellSource(cellId, newSource);
+    requestAnimationFrame(() => {
+      if (ta) {
+        ta.focus();
+        ta.setSelectionRange(newCursorStart, newCursorEnd);
+      }
+    });
+  }, [engine, cellId, textareaRef]);
+  if (!pos.visible) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: toolbarRef,
+      className: "sci-nb-floating-toolbar",
+      style: {
+        position: "fixed",
+        top: `${pos.top}px`,
+        left: `${pos.left}px`,
+        transform: "translateX(-50%)"
+      },
+      onMouseDown: (e) => e.preventDefault(),
+      children: FORMAT_ACTIONS.map((action, i) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "sci-nb-ft-btn",
+          title: action.title,
+          style: action.style ? { ...parseInlineStyle(action.style) } : void 0,
+          onClick: () => applyFormat(action),
+          children: action.label
+        },
+        i
+      ))
+    }
+  );
+};
+function parseInlineStyle(css) {
+  const style = {};
+  css.split(";").forEach((pair) => {
+    const [key, val] = pair.split(":");
+    if (key && val) {
+      const camelKey = key.trim().replace(/-([a-z])/g, (_, c) => c.toUpperCase());
+      style[camelKey] = val.trim();
+    }
+  });
+  return style;
+}
+
+// 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";
+var MATH_CATEGORIES = [
+  {
+    name: "Estructuras",
+    icon: "\u2B1A",
+    blocks: [
+      { label: "a/b", latex: "\\frac{\u25A2}{\u25A2}", cursor: 6 },
+      { label: "\u221A", latex: "\\sqrt{\u25A2}", cursor: 6 },
+      { label: "\u207F\u221A", latex: "\\sqrt[\u25A2]{\u25A2}", cursor: 6 },
+      { label: "x\u207F", latex: "{\u25A2}^{\u25A2}", cursor: 1 },
+      { label: "x\u2099", latex: "{\u25A2}_{\u25A2}", cursor: 1 },
+      { label: "x\u0302", latex: "\\hat{\u25A2}", cursor: 5 },
+      { label: "x\u0304", latex: "\\bar{\u25A2}", cursor: 5 },
+      { label: "x\u20D7", latex: "\\vec{\u25A2}", cursor: 5 },
+      { label: "x\u0303", latex: "\\tilde{\u25A2}", cursor: 7 },
+      { label: "\u1E8B", latex: "\\dot{\u25A2}", cursor: 5 },
+      { label: "\u1E8D", latex: "\\ddot{\u25A2}", cursor: 6 }
+    ]
+  },
+  {
+    name: "Integrales",
+    icon: "\u222B",
+    blocks: [
+      { label: "\u222B", latex: "\\int{\u25A2}\\,d{\u25A2}", cursor: 5 },
+      { label: "\u222B\u2090\u1D47", latex: "\\int_{\u25A2}^{\u25A2}{\u25A2}\\,d{\u25A2}", cursor: 5 },
+      { label: "\u222C", latex: "\\iint{\u25A2}", cursor: 6 },
+      { label: "\u222D", latex: "\\iiint{\u25A2}", cursor: 7 },
+      { label: "\u222E", latex: "\\oint{\u25A2}", cursor: 6 }
+    ]
+  },
+  {
+    name: "Sumatorias",
+    icon: "\u2211",
+    blocks: [
+      { label: "\u2211", latex: "\\sum_{\u25A2}^{\u25A2}{\u25A2}", cursor: 5 },
+      { label: "\u220F", latex: "\\prod_{\u25A2}^{\u25A2}{\u25A2}", cursor: 6 },
+      { label: "lim", latex: "\\lim_{\u25A2 \\to \u25A2}{\u25A2}", cursor: 5 },
+      { label: "\u2211\u2099", latex: "\\sum_{n=\u25A2}^{\u25A2}{\u25A2}", cursor: 7 }
+    ]
+  },
+  {
+    name: "Matrices",
+    icon: "[ ]",
+    blocks: [
+      { label: "2\xD72", latex: "\\begin{pmatrix} \u25A2 & \u25A2 \\\\ \u25A2 & \u25A2 \\end{pmatrix}", cursor: 16 },
+      { 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 }
+    ]
+  },
+  {
+    name: "Griegos",
+    icon: "\u03B1",
+    blocks: [
+      { label: "\u03B1", latex: "\\alpha" },
+      { label: "\u03B2", latex: "\\beta" },
+      { label: "\u03B3", latex: "\\gamma" },
+      { label: "\u03B4", latex: "\\delta" },
+      { label: "\u03B5", latex: "\\epsilon" },
+      { label: "\u03B6", latex: "\\zeta" },
+      { label: "\u03B7", latex: "\\eta" },
+      { label: "\u03B8", latex: "\\theta" },
+      { label: "\u03BB", latex: "\\lambda" },
+      { label: "\u03BC", latex: "\\mu" },
+      { label: "\u03C0", latex: "\\pi" },
+      { label: "\u03C1", latex: "\\rho" },
+      { label: "\u03C3", latex: "\\sigma" },
+      { label: "\u03C4", latex: "\\tau" },
+      { label: "\u03C6", latex: "\\phi" },
+      { label: "\u03C8", latex: "\\psi" },
+      { label: "\u03C9", latex: "\\omega" },
+      { label: "\u0393", latex: "\\Gamma" },
+      { label: "\u0394", latex: "\\Delta" },
+      { label: "\u0398", latex: "\\Theta" },
+      { label: "\u039B", latex: "\\Lambda" },
+      { label: "\u03A3", latex: "\\Sigma" },
+      { label: "\u03A6", latex: "\\Phi" },
+      { label: "\u03A8", latex: "\\Psi" },
+      { label: "\u03A9", latex: "\\Omega" }
+    ]
+  },
+  {
+    name: "Operadores",
+    icon: "\xB1",
+    blocks: [
+      { label: "\xB1", latex: "\\pm" },
+      { label: "\u2213", latex: "\\mp" },
+      { label: "\xD7", latex: "\\times" },
+      { label: "\xF7", latex: "\\div" },
+      { label: "\xB7", latex: "\\cdot" },
+      { label: "\u2218", latex: "\\circ" },
+      { label: "\u2297", latex: "\\otimes" },
+      { label: "\u2295", latex: "\\oplus" },
+      { label: "\u2202", latex: "\\partial" },
+      { label: "\u2207", latex: "\\nabla" },
+      { label: "\u221E", latex: "\\infty" },
+      { label: "\u2248", latex: "\\approx" },
+      { label: "\u2260", latex: "\\neq" },
+      { label: "\u2264", latex: "\\leq" },
+      { label: "\u2265", latex: "\\geq" },
+      { label: "\u2261", latex: "\\equiv" },
+      { label: "\u221D", latex: "\\propto" },
+      { label: "\u2208", latex: "\\in" },
+      { label: "\u2209", latex: "\\notin" },
+      { label: "\u2282", latex: "\\subset" },
+      { label: "\u2283", latex: "\\supset" },
+      { label: "\u222A", latex: "\\cup" },
+      { label: "\u2229", latex: "\\cap" },
+      { label: "\u2205", latex: "\\emptyset" },
+      { label: "\u2200", latex: "\\forall" },
+      { label: "\u2203", latex: "\\exists" }
+    ]
+  },
+  {
+    name: "Flechas",
+    icon: "\u2192",
+    blocks: [
+      { label: "\u2192", latex: "\\rightarrow" },
+      { label: "\u2190", latex: "\\leftarrow" },
+      { label: "\u2194", latex: "\\leftrightarrow" },
+      { label: "\u21D2", latex: "\\Rightarrow" },
+      { label: "\u21D0", latex: "\\Leftarrow" },
+      { label: "\u21D4", latex: "\\Leftrightarrow" },
+      { label: "\u21A6", latex: "\\mapsto" },
+      { label: "\u2191", latex: "\\uparrow" },
+      { label: "\u2193", latex: "\\downarrow" }
+    ]
+  },
+  {
+    name: "Funciones",
+    icon: "f(x)",
+    blocks: [
+      { label: "sin", latex: "\\sin{\u25A2}", cursor: 5 },
+      { label: "cos", latex: "\\cos{\u25A2}", cursor: 5 },
+      { label: "tan", latex: "\\tan{\u25A2}", cursor: 5 },
+      { label: "log", latex: "\\log{\u25A2}", cursor: 5 },
+      { label: "ln", latex: "\\ln{\u25A2}", cursor: 4 },
+      { label: "exp", latex: "\\exp{\u25A2}", cursor: 5 },
+      { label: "lim", latex: "\\lim_{\u25A2}{\u25A2}", cursor: 5 },
+      { label: "max", latex: "\\max{\u25A2}", cursor: 5 },
+      { label: "min", latex: "\\min{\u25A2}", cursor: 5 },
+      { label: "det", latex: "\\det{\u25A2}", cursor: 5 }
+    ]
+  },
+  {
+    name: "Delimitadores",
+    icon: "()",
+    blocks: [
+      { label: "(\u2026)", latex: "\\left( \u25A2 \\right)", cursor: 7 },
+      { label: "[\u2026]", latex: "\\left[ \u25A2 \\right]", cursor: 7 },
+      { label: "{\u2026}", latex: "\\left\\{ \u25A2 \\right\\}", cursor: 8 },
+      { label: "|\u2026|", latex: "\\left| \u25A2 \\right|", cursor: 7 },
+      { label: "\u2016\u2026\u2016", latex: "\\left\\| \u25A2 \\right\\|", cursor: 8 },
+      { label: "\u230A\u2026\u230B", latex: "\\lfloor \u25A2 \\rfloor", cursor: 8 },
+      { label: "\u2308\u2026\u2309", latex: "\\lceil \u25A2 \\rceil", cursor: 7 }
+    ]
+  }
+];
+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 (typeof globalThis !== "undefined" && globalThis.katex) {
+    try {
+      return globalThis.katex.renderToString(clean, {
+        displayMode: true,
+        throwOnError: false
+      });
+    } 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;");
+}
+var MathEditor = ({ cellId, source, onExit }) => {
+  const engine = useSciNotebook();
+  const textareaRef = useRef2(null);
+  const [activeCategory, setActiveCategory] = useState3(0);
+  const [showRaw, setShowRaw] = useState3(false);
+  const innerLatex = source.replace(/^\$\$\s*/, "").replace(/\s*\$\$$/, "").trim();
+  const updateSource = useCallback2((newInner) => {
+    engine.updateCellSource(cellId, `$$
+${newInner}
+$$`);
+  }, [engine, cellId]);
+  const handleRawChange = useCallback2((e) => {
+    updateSource(e.target.value);
+  }, [updateSource]);
+  const insertBlock = useCallback2((block) => {
+    const ta = textareaRef.current;
+    if (!ta) {
+      updateSource(innerLatex + (innerLatex ? " " : "") + block.latex.replace(/▢/g, ""));
+      return;
+    }
+    const start = ta.selectionStart;
+    const end = ta.selectionEnd;
+    const val = ta.value;
+    const selected = val.slice(start, end);
+    let inserted = block.latex;
+    if (selected) {
+      inserted = inserted.replace("\u25A2", selected);
+    }
+    inserted = inserted.replace(/▢/g, "");
+    const newVal = val.slice(0, start) + inserted + val.slice(end);
+    updateSource(newVal);
+    requestAnimationFrame(() => {
+      if (textareaRef.current) {
+        const cursorPos = block.cursor != null ? start + block.cursor : start + inserted.length;
+        textareaRef.current.focus();
+        textareaRef.current.setSelectionRange(cursorPos, cursorPos);
+      }
+    });
+  }, [innerLatex, updateSource]);
+  const handleKeyDown = useCallback2((e) => {
+    if (e.key === "Escape") {
+      e.preventDefault();
+      onExit();
+    } else if (e.key === "Enter" && e.shiftKey) {
+      e.preventDefault();
+      onExit();
+    }
+  }, [onExit]);
+  useEffect3(() => {
+    if (showRaw && textareaRef.current) {
+      const ta = textareaRef.current;
+      ta.style.height = "auto";
+      ta.style.height = `${Math.max(60, ta.scrollHeight)}px`;
+    }
+  }, [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(
+          "button",
+          {
+            className: `sci-nb-math-mode-btn ${!showRaw ? "sci-nb-math-mode-btn--active" : ""}`,
+            onClick: () => setShowRaw(false),
+            children: "Preview"
+          }
+        ),
+        /* @__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."
+        ] })
+      ] })
+    ] }),
+    /* @__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
+import { useState as useState4, useCallback as useCallback3, useRef as useRef3, useEffect as useEffect4 } from "react";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function parseImageSource(source, metadata) {
+  return {
+    src: source || "",
+    alt: metadata.alt || "",
+    caption: metadata.caption || "",
+    width: metadata.width || "100%",
+    align: metadata.align || "center"
+  };
+}
+var ImageCell = ({ cellId, source, metadata, onExit }) => {
+  const engine = useSciNotebook();
+  const fileInputRef = useRef3(null);
+  const [data, setData] = useState4(() => parseImageSource(source, metadata));
+  const [dragOver, setDragOver] = useState4(false);
+  const save = useCallback3((updates) => {
+    const next = { ...data, ...updates };
+    setData(next);
+    engine.updateCellSource(cellId, next.src);
+    engine.updateCellMetadata(cellId, {
+      alt: next.alt,
+      caption: next.caption,
+      width: next.width,
+      align: next.align
+    });
+  }, [engine, cellId, data]);
+  const handleFileSelect = useCallback3((file) => {
+    if (!file.type.startsWith("image/")) return;
+    const reader = new FileReader();
+    reader.onload = (e) => {
+      const dataUrl = e.target?.result;
+      save({ src: dataUrl });
+    };
+    reader.readAsDataURL(file);
+  }, [save]);
+  const handleDrop = useCallback3((e) => {
+    e.preventDefault();
+    setDragOver(false);
+    const file = e.dataTransfer.files[0];
+    if (file) handleFileSelect(file);
+  }, [handleFileSelect]);
+  const handleDragOver = useCallback3((e) => {
+    e.preventDefault();
+    setDragOver(true);
+  }, []);
+  const handleKeyDown = useCallback3((e) => {
+    if (e.key === "Escape") {
+      e.preventDefault();
+      onExit();
+    }
+  }, [onExit]);
+  useEffect4(() => {
+    const handlePaste = (e) => {
+      const items = e.clipboardData?.items;
+      if (!items) return;
+      for (const item of Array.from(items)) {
+        if (item.type.startsWith("image/")) {
+          e.preventDefault();
+          const file = item.getAsFile();
+          if (file) handleFileSelect(file);
+          return;
+        }
+      }
+    };
+    document.addEventListener("paste", handlePaste);
+    return () => document.removeEventListener("paste", handlePaste);
+  }, [handleFileSelect]);
+  const hasSrc = !!data.src.trim();
+  return /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-editor", onKeyDown: handleKeyDown, children: [
+    hasSrc ? /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-preview", style: { textAlign: data.align }, children: [
+      /* @__PURE__ */ jsx3(
+        "img",
+        {
+          src: data.src,
+          alt: data.alt,
+          style: { maxWidth: data.width, width: "auto", maxHeight: "400px" }
+        }
+      ),
+      data.caption && /* @__PURE__ */ jsx3("p", { className: "sci-nb-image-caption", children: data.caption })
+    ] }) : /* @__PURE__ */ jsxs2(
+      "div",
+      {
+        className: `sci-nb-image-dropzone ${dragOver ? "sci-nb-image-dropzone--active" : ""}`,
+        onDrop: handleDrop,
+        onDragOver: handleDragOver,
+        onDragLeave: () => setDragOver(false),
+        onClick: () => fileInputRef.current?.click(),
+        children: [
+          /* @__PURE__ */ jsxs2("svg", { width: "32", height: "32", viewBox: "0 0 32 32", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+            /* @__PURE__ */ jsx3("rect", { x: "4", y: "4", width: "24", height: "24", rx: "3" }),
+            /* @__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(
+            "input",
+            {
+              ref: fileInputRef,
+              type: "file",
+              accept: "image/*",
+              style: { display: "none" },
+              onChange: (e) => {
+                const file = e.target.files?.[0];
+                if (file) handleFileSelect(file);
+              }
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-controls", children: [
+      /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-field", children: [
+        /* @__PURE__ */ jsx3("label", { children: "URL" }),
+        /* @__PURE__ */ jsx3(
+          "input",
+          {
+            type: "text",
+            value: data.src.startsWith("data:") ? "(archivo local)" : data.src,
+            onChange: (e) => save({ src: e.target.value }),
+            placeholder: "https://example.com/image.png",
+            disabled: data.src.startsWith("data:")
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-field", children: [
+        /* @__PURE__ */ jsx3("label", { children: "Alt text" }),
+        /* @__PURE__ */ jsx3(
+          "input",
+          {
+            type: "text",
+            value: data.alt,
+            onChange: (e) => save({ alt: e.target.value }),
+            placeholder: "Descripcion de la imagen"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-field", children: [
+        /* @__PURE__ */ jsx3("label", { children: "Caption" }),
+        /* @__PURE__ */ jsx3(
+          "input",
+          {
+            type: "text",
+            value: data.caption,
+            onChange: (e) => save({ caption: e.target.value }),
+            placeholder: "Pie de imagen (opcional)"
+          }
+        )
+      ] }),
+      /* @__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__ */ 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%" }),
+            /* @__PURE__ */ jsx3("option", { value: "75%", children: "75%" }),
+            /* @__PURE__ */ jsx3("option", { value: "100%", children: "100%" }),
+            /* @__PURE__ */ jsx3("option", { value: "auto", children: "Auto" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs2("div", { className: "sci-nb-image-field sci-nb-image-field--small", children: [
+          /* @__PURE__ */ jsx3("label", { children: "Alinear" }),
+          /* @__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" })
+          ] })
+        ] }),
+        hasSrc && /* @__PURE__ */ jsx3("button", { className: "sci-nb-image-clear", onClick: () => save({ src: "" }), children: "Quitar imagen" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs2("div", { className: "sci-nb-cell-hint", children: [
+      /* @__PURE__ */ jsx3("kbd", { children: "Esc" }),
+      " salir"
+    ] })
+  ] });
+};
+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>';
+  }
+  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 += `</div>`;
+  return html;
+}
+function escapeHtml2(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+function escapeAttr(s) {
+  return s.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+
+// src/components/EmbedCell.tsx
+import { useState as useState5, useCallback as useCallback4 } from "react";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var EMBED_PRESETS = [
+  { label: "YouTube", pattern: "https://www.youtube.com/embed/", icon: "\u25B6" },
+  { label: "CodePen", pattern: "https://codepen.io/", icon: "\u2328" },
+  { label: "Observable", pattern: "https://observablehq.com/embed/", icon: "\u25C9" },
+  { label: "Desmos", pattern: "https://www.desmos.com/calculator/", icon: "\u{1F4C8}" },
+  { label: "GeoGebra", pattern: "https://www.geogebra.org/material/iframe/id/", icon: "\u{1F4D0}" },
+  { label: "Custom URL", pattern: "", icon: "\u{1F517}" }
+];
+function parseEmbedSource(source, metadata) {
+  return {
+    url: source || "",
+    height: metadata.height || "400px",
+    sandbox: metadata.sandbox || "allow-scripts allow-same-origin allow-popups",
+    title: metadata.title || ""
+  };
+}
+var EmbedCell = ({ cellId, source, metadata, onExit }) => {
+  const engine = useSciNotebook();
+  const [data, setData] = useState5(() => parseEmbedSource(source, metadata));
+  const [showPreview, setShowPreview] = useState5(!!data.url);
+  const save = useCallback4((updates) => {
+    const next = { ...data, ...updates };
+    setData(next);
+    engine.updateCellSource(cellId, next.url);
+    engine.updateCellMetadata(cellId, {
+      height: next.height,
+      sandbox: next.sandbox,
+      title: next.title
+    });
+  }, [engine, cellId, data]);
+  const handleKeyDown = useCallback4((e) => {
+    if (e.key === "Escape") {
+      e.preventDefault();
+      onExit();
+    }
+  }, [onExit]);
+  const hasUrl = !!data.url.trim();
+  return /* @__PURE__ */ jsxs3("div", { className: "sci-nb-embed-editor", onKeyDown: handleKeyDown, children: [
+    /* @__PURE__ */ jsx4("div", { className: "sci-nb-embed-presets", children: EMBED_PRESETS.map((preset) => /* @__PURE__ */ jsxs3(
+      "button",
+      {
+        className: "sci-nb-embed-preset",
+        onClick: () => {
+          if (preset.pattern) {
+            save({ url: preset.pattern });
+          }
+        },
+        title: preset.label,
+        children: [
+          /* @__PURE__ */ jsx4("span", { children: preset.icon }),
+          /* @__PURE__ */ jsx4("span", { children: preset.label })
+        ]
+      },
+      preset.label
+    )) }),
+    /* @__PURE__ */ jsxs3("div", { className: "sci-nb-embed-url-row", children: [
+      /* @__PURE__ */ jsx4(
+        "input",
+        {
+          type: "text",
+          className: "sci-nb-embed-url",
+          value: data.url,
+          onChange: (e) => save({ url: e.target.value }),
+          placeholder: "https://www.youtube.com/embed/dQw4w9WgXcQ",
+          autoFocus: true
+        }
+      ),
+      /* @__PURE__ */ jsx4(
+        "button",
+        {
+          className: `sci-nb-embed-preview-btn ${showPreview ? "sci-nb-embed-preview-btn--active" : ""}`,
+          onClick: () => setShowPreview(!showPreview),
+          disabled: !hasUrl,
+          children: showPreview ? "Ocultar" : "Preview"
+        }
+      )
+    ] }),
+    showPreview && hasUrl && /* @__PURE__ */ jsx4("div", { className: "sci-nb-embed-frame-wrap", style: { height: data.height }, children: /* @__PURE__ */ jsx4(
+      "iframe",
+      {
+        src: data.url,
+        title: data.title || "Embedded content",
+        sandbox: data.sandbox,
+        style: { width: "100%", height: "100%", border: "none", borderRadius: "6px" },
+        loading: "lazy",
+        allowFullScreen: true
+      }
+    ) }),
+    /* @__PURE__ */ jsxs3("div", { className: "sci-nb-embed-settings", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "sci-nb-embed-field", children: [
+        /* @__PURE__ */ jsx4("label", { children: "Titulo" }),
+        /* @__PURE__ */ jsx4(
+          "input",
+          {
+            type: "text",
+            value: data.title,
+            onChange: (e) => save({ title: e.target.value }),
+            placeholder: "Titulo del embed (accesibilidad)"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs3("div", { className: "sci-nb-embed-row", children: [
+        /* @__PURE__ */ jsxs3("div", { className: "sci-nb-embed-field sci-nb-embed-field--small", children: [
+          /* @__PURE__ */ jsx4("label", { children: "Altura" }),
+          /* @__PURE__ */ jsxs3("select", { value: data.height, onChange: (e) => save({ height: e.target.value }), children: [
+            /* @__PURE__ */ jsx4("option", { value: "200px", children: "200px" }),
+            /* @__PURE__ */ jsx4("option", { value: "300px", children: "300px" }),
+            /* @__PURE__ */ jsx4("option", { value: "400px", children: "400px" }),
+            /* @__PURE__ */ jsx4("option", { value: "500px", children: "500px" }),
+            /* @__PURE__ */ jsx4("option", { value: "600px", children: "600px" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs3("div", { className: "sci-nb-embed-field sci-nb-embed-field--small", children: [
+          /* @__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__ */ jsxs3("div", { className: "sci-nb-cell-hint", children: [
+      /* @__PURE__ */ jsx4("kbd", { children: "Esc" }),
+      " salir"
+    ] })
+  ] });
+};
+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>';
+  }
+  const titleAttr = data.title ? ` title="${escapeAttr2(data.title)}"` : "";
+  return `<div class="sci-nb-embed-view" style="height:${data.height}">
+    <iframe src="${escapeAttr2(data.url)}"${titleAttr} sandbox="${escapeAttr2(data.sandbox)}" style="width:100%;height:100%;border:none;border-radius:6px" loading="lazy" allowfullscreen></iframe>
+  </div>`;
+}
+function escapeAttr2(s) {
+  return s.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+
+// src/components/SlashCommand.tsx
+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: "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"] }
+];
+var SlashCommand = ({
+  position,
+  query,
+  onSelect,
+  onClose,
+  extraCommands
+}) => {
+  const allCommands = extraCommands ? [...DEFAULT_COMMANDS, ...extraCommands] : DEFAULT_COMMANDS;
+  const filtered = query ? allCommands.filter((cmd) => {
+    const q = query.toLowerCase();
+    return cmd.label.toLowerCase().includes(q) || cmd.type.toLowerCase().includes(q) || cmd.keywords.some((k) => k.includes(q));
+  }) : allCommands;
+  const [selectedIndex, setSelectedIndex] = useState6(0);
+  const menuRef = useRef4(null);
+  useEffect5(() => {
+    setSelectedIndex(0);
+  }, [query]);
+  useEffect5(() => {
+    const handleKey = (e) => {
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        setSelectedIndex((i) => (i + 1) % Math.max(filtered.length, 1));
+      } else if (e.key === "ArrowUp") {
+        e.preventDefault();
+        setSelectedIndex((i) => (i - 1 + filtered.length) % Math.max(filtered.length, 1));
+      } else if (e.key === "Enter" && filtered.length > 0) {
+        e.preventDefault();
+        onSelect(filtered[selectedIndex]?.type || "markdown");
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        onClose();
+      }
+    };
+    document.addEventListener("keydown", handleKey, true);
+    return () => document.removeEventListener("keydown", handleKey, true);
+  }, [filtered, selectedIndex, onSelect, onClose]);
+  useEffect5(() => {
+    const handleClick = (e) => {
+      if (menuRef.current && !menuRef.current.contains(e.target)) {
+        onClose();
+      }
+    };
+    document.addEventListener("mousedown", handleClick);
+    return () => document.removeEventListener("mousedown", handleClick);
+  }, [onClose]);
+  if (filtered.length === 0) {
+    return /* @__PURE__ */ jsx5(
+      "div",
+      {
+        ref: menuRef,
+        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 "/',
+          query,
+          '"'
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      ref: menuRef,
+      className: "sci-nb-slash-menu",
+      style: { top: position.top, left: position.left },
+      children: [
+        /* @__PURE__ */ jsx5("div", { className: "sci-nb-slash-header", children: "Insertar bloque" }),
+        filtered.map((cmd, i) => /* @__PURE__ */ jsxs4(
+          "button",
+          {
+            className: `sci-nb-slash-item ${i === selectedIndex ? "sci-nb-slash-item--active" : ""}`,
+            onMouseEnter: () => setSelectedIndex(i),
+            onClick: () => onSelect(cmd.type),
+            children: [
+              /* @__PURE__ */ jsx5("span", { className: "sci-nb-slash-icon", children: cmd.icon }),
+              /* @__PURE__ */ jsxs4("div", { className: "sci-nb-slash-text", children: [
+                /* @__PURE__ */ jsx5("span", { className: "sci-nb-slash-label", children: cmd.label }),
+                /* @__PURE__ */ jsx5("span", { className: "sci-nb-slash-desc", children: cmd.description })
+              ] })
+            ]
+          },
+          cmd.type + cmd.label
+        ))
+      ]
+    }
+  );
+};
+
+// src/components/TableCell.tsx
+import { useState as useState7, useCallback as useCallback6 } from "react";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+function parseMarkdownTable(source) {
+  const lines = source.trim().split("\n").filter((l) => l.trim());
+  if (lines.length < 2) {
+    return { headers: ["Col 1", "Col 2", "Col 3"], rows: [["", "", ""], ["", "", ""]] };
+  }
+  const parseLine = (line) => line.split("|").map((c) => c.trim()).filter((_, i, arr) => i > 0 && i < arr.length);
+  const headers = parseLine(lines[0]);
+  const rows = lines.slice(2).map(parseLine);
+  const colCount = headers.length;
+  const normalizedRows = rows.map((row) => {
+    while (row.length < colCount) row.push("");
+    return row.slice(0, colCount);
+  });
+  if (normalizedRows.length === 0) {
+    normalizedRows.push(new Array(colCount).fill(""));
+  }
+  return { headers, rows: normalizedRows };
+}
+function toMarkdownTable(data) {
+  const { headers, rows } = data;
+  const headerLine = `| ${headers.join(" | ")} |`;
+  const sepLine = `| ${headers.map(() => "---").join(" | ")} |`;
+  const rowLines = rows.map((row) => `| ${row.join(" | ")} |`);
+  return [headerLine, sepLine, ...rowLines].join("\n");
+}
+var TableCell = ({ cellId, source, onExit }) => {
+  const engine = useSciNotebook();
+  const [data, setData] = useState7(() => parseMarkdownTable(source));
+  const syncToEngine = useCallback6((newData) => {
+    setData(newData);
+    engine.updateCellSource(cellId, toMarkdownTable(newData));
+  }, [engine, cellId]);
+  const updateHeader = useCallback6((colIdx, value) => {
+    const newHeaders = [...data.headers];
+    newHeaders[colIdx] = value;
+    syncToEngine({ ...data, headers: newHeaders });
+  }, [data, syncToEngine]);
+  const updateCell = useCallback6((rowIdx, colIdx, value) => {
+    const newRows = data.rows.map((r) => [...r]);
+    newRows[rowIdx][colIdx] = value;
+    syncToEngine({ ...data, rows: newRows });
+  }, [data, syncToEngine]);
+  const addRow = useCallback6(() => {
+    const newRow = new Array(data.headers.length).fill("");
+    syncToEngine({ ...data, rows: [...data.rows, newRow] });
+  }, [data, syncToEngine]);
+  const addColumn = useCallback6(() => {
+    const newHeaders = [...data.headers, `Col ${data.headers.length + 1}`];
+    const newRows = data.rows.map((row) => [...row, ""]);
+    syncToEngine({ headers: newHeaders, rows: newRows });
+  }, [data, syncToEngine]);
+  const removeRow = useCallback6((rowIdx) => {
+    if (data.rows.length <= 1) return;
+    const newRows = data.rows.filter((_, i) => i !== rowIdx);
+    syncToEngine({ ...data, rows: newRows });
+  }, [data, syncToEngine]);
+  const removeColumn = useCallback6((colIdx) => {
+    if (data.headers.length <= 1) return;
+    const newHeaders = data.headers.filter((_, i) => i !== colIdx);
+    const newRows = data.rows.map((row) => row.filter((_, i) => i !== colIdx));
+    syncToEngine({ headers: newHeaders, rows: newRows });
+  }, [data, syncToEngine]);
+  const handleKeyDown = useCallback6((e) => {
+    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__ */ 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__ */ jsxs5("div", { className: "sci-nb-cell-hint", children: [
+      /* @__PURE__ */ jsx6("kbd", { children: "Tab" }),
+      " siguiente celda \xB7 ",
+      /* @__PURE__ */ jsx6("kbd", { children: "Esc" }),
+      " salir"
+    ] })
+  ] });
+};
+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("");
+  const trs = data.rows.map(
+    (row) => `<tr>${row.map((c) => `<td>${escapeHtml3(c)}</td>`).join("")}</tr>`
+  ).join("");
+  return `<table class="sci-nb-rendered-table"><thead><tr>${ths}</tr></thead><tbody>${trs}</tbody></table>`;
+}
+function escapeHtml3(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";
+var mermaidIdCounter = 0;
+var MermaidPreview = ({ source, onClick }) => {
+  const [svg, setSvg] = useState8(null);
+  const [error, setError] = useState8(null);
+  const containerRef = useRef5(null);
+  useEffect6(() => {
+    const trimmed = source.trim();
+    if (!trimmed) {
+      setSvg(null);
+      setError(null);
+      return;
+    }
+    const mermaid2 = globalThis.mermaid;
+    if (!mermaid2) {
+      setError(null);
+      setSvg(null);
+      return;
+    }
+    let cancelled = false;
+    const id = `sci-mermaid-${++mermaidIdCounter}`;
+    (async () => {
+      try {
+        const result = await mermaid2.render(id, trimmed);
+        if (!cancelled) {
+          setSvg(result.svg);
+          setError(null);
+        }
+      } catch (e) {
+        if (!cancelled) {
+          setError(e.message || String(e));
+          setSvg(null);
+        }
+        const errEl = document.getElementById(`d${id}`);
+        if (errEl) errEl.remove();
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [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" }) });
+  }
+  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" }),
+        "."
+      ] })
+    ] });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxs7("div", { className: "sci-nb-mermaid-error", onClick, children: [
+      /* @__PURE__ */ jsx8("strong", { children: "Mermaid error:" }),
+      " ",
+      error
+    ] });
+  }
+  if (svg) {
+    return /* @__PURE__ */ jsx8(
+      "div",
+      {
+        ref: containerRef,
+        className: "sci-nb-mermaid-preview",
+        onClick,
+        dangerouslySetInnerHTML: { __html: svg }
+      }
+    );
+  }
+  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";
+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: "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"
+};
+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(() => {
+    if (!cell) return { html: "", cellId: "", renderTime: 0, cached: false };
+    return pipeline.render(cell);
+  }, [cell?.source, cell?.type, cell?.metadata, pipeline]);
+  useEffect7(() => {
+    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();
+    }
+  }, [cell?.editing]);
+  useEffect7(() => {
+    if (!showTypeMenu) return;
+    const handler = (e) => {
+      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 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);
+    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 }
+      });
+    } else {
+      setSlashState(null);
+    }
+  }, [engine, cellId]);
+  const enterEdit = useCallback8(() => {
+    engine.setEditMode(cellId);
+    engine.focusCell(cellId);
+  }, [engine, cellId]);
+  const exitEdit = useCallback8(() => {
+    engine.setViewMode(cellId);
+  }, [engine, cellId]);
+  const handleSlashSelect = useCallback8((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());
+    }
+    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;
+      }
+    }
+    if (e.key === "Escape") {
+      e.preventDefault();
+      exitEdit();
+    } else if (e.key === "Enter" && e.shiftKey) {
+      e.preventDefault();
+      exitEdit();
+      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);
+      }
+    } else if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
+      e.preventDefault();
+      exitEdit();
+    } else if (e.key === "Tab" && !e.shiftKey) {
+      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);
+      requestAnimationFrame(() => {
+        if (textareaRef.current) {
+          textareaRef.current.selectionStart = start + 2;
+          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 trimmed = before.replace(/  $/, "");
+      if (trimmed !== before) {
+        engine.updateCellSource(cellId, trimmed + val.substring(start));
+        const diff = before.length - trimmed.length;
+        requestAnimationFrame(() => {
+          if (textareaRef.current) {
+            textareaRef.current.selectionStart = start - diff;
+            textareaRef.current.selectionEnd = start - diff;
+          }
+        });
+      }
+    } else if (e.key === "b" && (e.ctrlKey || e.metaKey)) {
+      e.preventDefault();
+      wrapSelection("**", "**");
+    } else if (e.key === "i" && (e.ctrlKey || e.metaKey)) {
+      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]);
+  if (!cell) return null;
+  const isEditing = !!cell.editing;
+  const isEmpty = !cell.source.trim();
+  const placeholder = PLACEHOLDERS[cell.type] || "Click to edit...";
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      ref: cellRef,
+      className: [
+        "sci-nb-cell",
+        `sci-nb-cell--${cell.type}`,
+        isEditing ? "sci-nb-cell--edit" : "sci-nb-cell--view",
+        hovered ? "sci-nb-cell--hover" : "",
+        isDragging ? "sci-nb-cell--dragging" : "",
+        dragOver === "top" ? "sci-nb-cell--drag-over-top" : "",
+        dragOver === "bottom" ? "sci-nb-cell--drag-over-bottom" : ""
+      ].filter(Boolean).join(" "),
+      draggable: !isEditing,
+      onDragStart: (e) => {
+        e.dataTransfer.setData("text/plain", cellId);
+        e.dataTransfer.effectAllowed = "move";
+        setIsDragging(true);
+      },
+      onDragEnd: () => {
+        setIsDragging(false);
+        setDragOver(null);
+      },
+      onDragOver: (e) => {
+        e.preventDefault();
+        e.dataTransfer.dropEffect = "move";
+        const rect = e.currentTarget.getBoundingClientRect();
+        const midY = rect.top + rect.height / 2;
+        setDragOver(e.clientY < midY ? "top" : "bottom");
+      },
+      onDragLeave: () => setDragOver(null),
+      onDrop: (e) => {
+        e.preventDefault();
+        const draggedId = e.dataTransfer.getData("text/plain");
+        setDragOver(null);
+        if (draggedId && draggedId !== cellId) {
+          const targetIdx = dragOver === "top" ? index : index + 1;
+          engine.moveCell(draggedId, targetIdx);
+        }
+      },
+      "data-testid": `cell-${cell.id}`,
+      "data-editing": String(isEditing),
+      "data-cell-type": cell.type,
+      role: "region",
+      "aria-label": `${cell.type} cell ${index + 1} of ${totalCells}${isEditing ? ", editing" : ""}`,
+      "aria-selected": isEditing,
+      tabIndex: 0,
+      onMouseEnter: () => setHovered(true),
+      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__ */ jsxs8("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(
+            "button",
+            {
+              className: `sci-nb-type-option ${cell.type === ct.value ? "sci-nb-type-option--active" : ""}`,
+              onClick: (e) => {
+                e.stopPropagation();
+                engine.setCellType(cellId, ct.value);
+                setShowTypeMenu(false);
+              },
+              children: [
+                /* @__PURE__ */ jsx9("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__ */ 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" }) })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+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";
+var INSERT_TYPES = [
+  { type: "markdown", label: "Markdown", icon: "M" },
+  { type: "code", label: "Code", icon: "</>" },
+  { type: "latex", label: "LaTeX", icon: "\u2211" },
+  { type: "image", label: "Imagen", icon: "\u{1F5BC}" },
+  { type: "embed", label: "Embed", icon: "\u29C9" },
+  { type: "raw", label: "Raw", icon: "T" }
+];
+var InsertHandle = ({ index }) => {
+  const engine = useSciNotebook();
+  const [open, setOpen] = useState10(false);
+  const menuRef = useRef7(null);
+  useEffect8(() => {
+    if (!open) return;
+    const onClickOutside = (e) => {
+      if (menuRef.current && !menuRef.current.contains(e.target)) {
+        setOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", onClickOutside);
+    return () => document.removeEventListener("mousedown", onClickOutside);
+  }, [open]);
+  const handleInsert = (type) => {
+    engine.insertCell(index, type);
+    setOpen(false);
+    requestAnimationFrame(() => {
+      const cells = engine.getCells();
+      if (cells[index]) {
+        engine.setEditMode(cells[index].id);
+        engine.focusCell(cells[index].id);
+      }
+    });
+  };
+  return /* @__PURE__ */ jsxs9("div", { className: "sci-nb-insert-handle", ref: menuRef, children: [
+    /* @__PURE__ */ jsx10("div", { className: "sci-nb-insert-line", children: /* @__PURE__ */ jsx10(
+      "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" })
+        ] })
+      }
+    ) }),
+    open && /* @__PURE__ */ jsx10("div", { className: "sci-nb-insert-menu", children: INSERT_TYPES.map((ct) => /* @__PURE__ */ jsxs9(
+      "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 })
+        ]
+      },
+      ct.type
+    )) })
+  ] });
+};
+
+// src/components/TOCSidebar.tsx
+import { useMemo as useMemo4, useCallback as useCallback9 } from "react";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+var TOCSidebar = ({ focusedCellId }) => {
+  const notebook = useNotebook();
+  const engine = useSciNotebook();
+  const items = useMemo4(() => {
+    if (!notebook) return [];
+    const result = [];
+    for (const cell of notebook.cells) {
+      if (cell.type !== "markdown") continue;
+      const lines = cell.source.split("\n");
+      for (const line of lines) {
+        const match = line.match(/^(#{1,3})\s+(.+)/);
+        if (match) {
+          result.push({
+            cellId: cell.id,
+            level: match[1].length,
+            text: match[2].replace(/[*_`~#]/g, "").trim()
+          });
+        }
+      }
+    }
+    return result;
+  }, [notebook]);
+  const handleClick = useCallback9((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(
+      "button",
+      {
+        className: [
+          "sci-nb-toc-item",
+          `sci-nb-toc-item--h${item.level}`,
+          item.cellId === focusedCellId ? "sci-nb-toc-item--active" : ""
+        ].join(" "),
+        onClick: () => handleClick(item.cellId),
+        title: item.text,
+        children: item.text
+      },
+      `${item.cellId}-${i}`
+    ))
+  ] });
+};
+
+// 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";
+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(() => {
+    inputRef.current?.focus();
+  }, []);
+  const matches = useMemo5(() => {
+    if (!query || !notebook) return [];
+    const result = [];
+    const q = caseSensitive ? query : query.toLowerCase();
+    for (const cell of notebook.cells) {
+      const src = caseSensitive ? cell.source : cell.source.toLowerCase();
+      let pos = 0;
+      while (true) {
+        const idx = src.indexOf(q, pos);
+        if (idx === -1) break;
+        result.push({ cellId: cell.id, index: idx, length: query.length });
+        pos = idx + 1;
+      }
+    }
+    return result;
+  }, [query, notebook, caseSensitive]);
+  useEffect9(() => {
+    setCurrentIdx(0);
+  }, [query, caseSensitive]);
+  const navigateToMatch = useCallback10((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(() => {
+    if (matches.length === 0) return;
+    const next = (currentIdx + 1) % matches.length;
+    setCurrentIdx(next);
+    navigateToMatch(matches[next]);
+  }, [matches, currentIdx, navigateToMatch]);
+  const goPrev = useCallback10(() => {
+    if (matches.length === 0) return;
+    const prev = (currentIdx - 1 + matches.length) % matches.length;
+    setCurrentIdx(prev);
+    navigateToMatch(matches[prev]);
+  }, [matches, currentIdx, navigateToMatch]);
+  const replaceCurrent = useCallback10(() => {
+    if (matches.length === 0) return;
+    const match = matches[currentIdx];
+    if (!match) return;
+    const cell = notebook?.cells.find((c) => c.id === match.cellId);
+    if (!cell) return;
+    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(() => {
+    if (matches.length === 0 || !notebook) return;
+    const byCellId = /* @__PURE__ */ new Map();
+    for (const m of matches) {
+      const arr = byCellId.get(m.cellId) || [];
+      arr.push(m);
+      byCellId.set(m.cellId, arr);
+    }
+    for (const [cellId, cellMatches] of byCellId) {
+      const cell = notebook.cells.find((c) => c.id === cellId);
+      if (!cell) continue;
+      let src = cell.source;
+      for (let i = cellMatches.length - 1; i >= 0; i--) {
+        const m = cellMatches[i];
+        src = src.slice(0, m.index) + replacement + src.slice(m.index + m.length);
+      }
+      engine.updateCellSource(cellId, src);
+    }
+  }, [matches, replacement, notebook, engine]);
+  const handleKeyDown = useCallback10((e) => {
+    if (e.key === "Escape") {
+      e.preventDefault();
+      onClose();
+    } else if (e.key === "Enter") {
+      e.preventDefault();
+      if (e.shiftKey) goPrev();
+      else goNext();
+    } else if (e.key === "h" && (e.ctrlKey || e.metaKey)) {
+      e.preventDefault();
+      setShowReplace((v) => !v);
+    }
+  }, [onClose, goNext, goPrev]);
+  return /* @__PURE__ */ jsxs11("div", { className: "sci-nb-find-bar", onKeyDown: handleKeyDown, children: [
+    /* @__PURE__ */ jsx12(
+      "input",
+      {
+        ref: inputRef,
+        type: "text",
+        value: query,
+        onChange: (e) => setQuery(e.target.value),
+        placeholder: "Buscar..."
+      }
+    ),
+    /* @__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(
+      "button",
+      {
+        onClick: () => setCaseSensitive((v) => !v),
+        title: "Aa: Case sensitive",
+        style: { fontWeight: caseSensitive ? 700 : 400 },
+        children: "Aa"
+      }
+    ),
+    /* @__PURE__ */ jsxs11("button", { onClick: () => setShowReplace((v) => !v), title: "Reemplazar (Ctrl+H)", children: [
+      showReplace ? "\u25BE" : "\u25B8",
+      " Reemplazar"
+    ] }),
+    showReplace && /* @__PURE__ */ jsxs11(Fragment2, { children: [
+      /* @__PURE__ */ jsx12(
+        "input",
+        {
+          type: "text",
+          value: replacement,
+          onChange: (e) => setReplacement(e.target.value),
+          placeholder: "Reemplazar con..."
+        }
+      ),
+      /* @__PURE__ */ jsx12("button", { onClick: replaceCurrent, title: "Reemplazar actual", children: "1" }),
+      /* @__PURE__ */ jsx12("button", { onClick: replaceAll, title: "Reemplazar todos", children: "\u2200" })
+    ] }),
+    /* @__PURE__ */ jsx12("button", { onClick: onClose, title: "Cerrar (Esc)", children: "\u2715" })
+  ] });
+};
+
+// src/components/SciNotebook.tsx
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+var SciNotebook = ({
+  notebook: initialNotebook,
+  engine: providedEngine,
+  plugins,
+  initialContent,
+  theme = "light",
+  onChange,
+  onCellFocus,
+  readOnly = false,
+  showToolbar = true,
+  className,
+  style,
+  engineRef,
+  showTOC: showTOCProp = false
+}) => {
+  const engine = useMemo6(() => {
+    if (providedEngine) return providedEngine;
+    if (initialContent && !initialNotebook) {
+      const cells2 = parseInitialContent(initialContent);
+      return createNotebook({
+        notebook: {
+          id: "",
+          title: "Untitled",
+          cells: cells2,
+          metadata: {},
+          version: 1,
+          createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+          updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+        },
+        config: { plugins }
+      });
+    }
+    return createNotebook({ notebook: initialNotebook, config: { plugins } });
+  }, [providedEngine]);
+  useEffect10(() => {
+    if (engineRef) engineRef.current = engine;
+    return () => {
+      if (engineRef) engineRef.current = null;
+    };
+  }, [engine, engineRef]);
+  const [notebook, setNotebook] = useState12(initialNotebook || engine.getNotebook());
+  useEffect10(() => {
+    const unsub = engine.on("notebook:updated", (payload) => {
+      setNotebook(payload.data.notebook);
+      if (onChange) onChange(payload.data.notebook);
+    });
+    return unsub;
+  }, [engine, onChange]);
+  useEffect10(() => {
+    if (!onCellFocus) return;
+    return engine.on("cell:focused", (payload) => {
+      onCellFocus(payload.data.cellId);
+    });
+  }, [engine, onCellFocus]);
+  const pipeline = useMemo6(() => new RenderPipeline(), []);
+  const cells = notebook.cells;
+  const [showFind, setShowFind] = useState12(false);
+  const [showTOC, setShowTOC] = useState12(showTOCProp);
+  const [focusedCellId, setFocusedCellId] = useState12(null);
+  useEffect10(() => {
+    return engine.on("cell:focused", (payload) => {
+      setFocusedCellId(payload.data.cellId);
+    });
+  }, [engine]);
+  const handleGlobalKeyDown = useCallback11((e) => {
+    if (readOnly) return;
+    if ((e.ctrlKey || e.metaKey) && e.key === "f") {
+      e.preventDefault();
+      setShowFind((v) => !v);
+      return;
+    }
+    engine.handleKeyDown(e.nativeEvent);
+  }, [engine, readOnly]);
+  return /* @__PURE__ */ jsx13(NotebookContext.Provider, { value: engine, children: /* @__PURE__ */ jsxs12(
+    "div",
+    {
+      className: `sci-nb ${className || ""}`,
+      style,
+      "data-theme": theme,
+      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(
+              "button",
+              {
+                className: "sci-nb-toolbar-btn",
+                onClick: () => engine.undo(),
+                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" }) }),
+                  "Undo"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs12(
+              "button",
+              {
+                className: "sci-nb-toolbar-btn",
+                onClick: () => engine.redo(),
+                disabled: !engine.canRedo(),
+                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__ */ jsx13("span", { className: "sci-nb-toolbar-sep" }),
+            /* @__PURE__ */ jsx13(
+              "button",
+              {
+                className: "sci-nb-toolbar-btn",
+                onClick: () => engine.setAllEditMode(),
+                title: "Edit all cells",
+                children: "Edit All"
+              }
+            ),
+            /* @__PURE__ */ jsx13(
+              "button",
+              {
+                className: "sci-nb-toolbar-btn",
+                onClick: () => engine.setAllViewMode(),
+                title: "Preview all cells",
+                children: "View All"
+              }
+            ),
+            /* @__PURE__ */ jsx13("span", { className: "sci-nb-toolbar-sep" }),
+            /* @__PURE__ */ jsx13(
+              "button",
+              {
+                className: "sci-nb-toolbar-btn",
+                onClick: () => setShowFind((v) => !v),
+                title: "Find & Replace (Ctrl+F)",
+                children: "Buscar"
+              }
+            ),
+            /* @__PURE__ */ jsx13(
+              "button",
+              {
+                className: `sci-nb-toolbar-btn ${showTOC ? "sci-nb-toolbar-btn--active" : ""}`,
+                onClick: () => setShowTOC((v) => !v),
+                title: "Table of Contents",
+                children: "TOC"
+              }
+            )
+          ] })
+        ] }),
+        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" })
+              ] }) }),
+              /* @__PURE__ */ jsx13("p", { children: "Notebook vacio. Agrega una celda para comenzar." }),
+              /* @__PURE__ */ jsx13(InsertHandle, { index: 0 })
+            ] }),
+            cells.length > 0 && /* @__PURE__ */ jsx13(InsertHandle, { index: 0 }),
+            cells.map((cell, idx) => /* @__PURE__ */ jsxs12(React12.Fragment, { children: [
+              /* @__PURE__ */ jsx13(
+                Cell,
+                {
+                  cellId: cell.id,
+                  pipeline,
+                  index: idx,
+                  totalCells: cells.length
+                }
+              ),
+              /* @__PURE__ */ jsx13(InsertHandle, { index: idx + 1 })
+            ] }, cell.id))
+          ] })
+        ] })
+      ]
+    }
+  ) });
+};
+function parseInitialContent(content) {
+  const blocks = content.split(/\n---\n/).filter((b) => b.trim());
+  if (blocks.length === 0) {
+    return [{ id: `cell_${Date.now()}`, type: "markdown", source: content, metadata: {} }];
+  }
+  return blocks.map((block, i) => ({
+    id: `cell_${Date.now()}_${i}`,
+    type: "markdown",
+    source: block.trim(),
+    metadata: {}
+  }));
+}
+
+// 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";
+var LATEX_COMMANDS = [
+  // Structures
+  { cmd: "\\frac{}{}", desc: "Fracci\xF3n", category: "struct" },
+  { cmd: "\\sqrt{}", desc: "Ra\xEDz cuadrada", category: "struct" },
+  { cmd: "\\sqrt[]{}", desc: "Ra\xEDz n-\xE9sima", category: "struct" },
+  { cmd: "^{}", desc: "Super\xEDndice", category: "struct" },
+  { cmd: "_{}", desc: "Sub\xEDndice", category: "struct" },
+  { cmd: "\\hat{}", desc: "Hat", category: "struct" },
+  { cmd: "\\bar{}", desc: "Bar", category: "struct" },
+  { cmd: "\\vec{}", desc: "Vector", category: "struct" },
+  { cmd: "\\tilde{}", desc: "Tilde", category: "struct" },
+  { cmd: "\\dot{}", desc: "Dot", category: "struct" },
+  { cmd: "\\ddot{}", desc: "Double dot", category: "struct" },
+  { cmd: "\\overline{}", desc: "Overline", category: "struct" },
+  { cmd: "\\underline{}", desc: "Underline", category: "struct" },
+  { cmd: "\\overbrace{}", desc: "Overbrace", category: "struct" },
+  { cmd: "\\underbrace{}", desc: "Underbrace", category: "struct" },
+  // Integrals
+  { cmd: "\\int", desc: "Integral", category: "calc" },
+  { cmd: "\\int_{}^{}", desc: "Integral definida", category: "calc" },
+  { cmd: "\\iint", desc: "Integral doble", category: "calc" },
+  { cmd: "\\iiint", desc: "Integral triple", category: "calc" },
+  { cmd: "\\oint", desc: "Integral de contorno", category: "calc" },
+  { cmd: "\\sum_{}^{}", desc: "Sumatoria", category: "calc" },
+  { cmd: "\\prod_{}^{}", desc: "Productoria", category: "calc" },
+  { cmd: "\\lim_{\\to}", desc: "L\xEDmite", category: "calc" },
+  { cmd: "\\partial", desc: "Derivada parcial", category: "calc" },
+  { cmd: "\\nabla", desc: "Nabla", category: "calc" },
+  { cmd: "\\infty", desc: "Infinito", category: "calc" },
+  // Greek
+  { cmd: "\\alpha", desc: "\u03B1", category: "greek" },
+  { cmd: "\\beta", desc: "\u03B2", category: "greek" },
+  { cmd: "\\gamma", desc: "\u03B3", category: "greek" },
+  { cmd: "\\delta", desc: "\u03B4", category: "greek" },
+  { cmd: "\\epsilon", desc: "\u03B5", category: "greek" },
+  { cmd: "\\zeta", desc: "\u03B6", category: "greek" },
+  { cmd: "\\eta", desc: "\u03B7", category: "greek" },
+  { cmd: "\\theta", desc: "\u03B8", category: "greek" },
+  { cmd: "\\iota", desc: "\u03B9", category: "greek" },
+  { cmd: "\\kappa", desc: "\u03BA", category: "greek" },
+  { cmd: "\\lambda", desc: "\u03BB", category: "greek" },
+  { cmd: "\\mu", desc: "\u03BC", category: "greek" },
+  { cmd: "\\nu", desc: "\u03BD", category: "greek" },
+  { cmd: "\\xi", desc: "\u03BE", category: "greek" },
+  { cmd: "\\pi", desc: "\u03C0", category: "greek" },
+  { cmd: "\\rho", desc: "\u03C1", category: "greek" },
+  { cmd: "\\sigma", desc: "\u03C3", category: "greek" },
+  { cmd: "\\tau", desc: "\u03C4", category: "greek" },
+  { cmd: "\\upsilon", desc: "\u03C5", category: "greek" },
+  { cmd: "\\phi", desc: "\u03C6", category: "greek" },
+  { cmd: "\\chi", desc: "\u03C7", category: "greek" },
+  { cmd: "\\psi", desc: "\u03C8", category: "greek" },
+  { cmd: "\\omega", desc: "\u03C9", category: "greek" },
+  { cmd: "\\Gamma", desc: "\u0393", category: "greek" },
+  { cmd: "\\Delta", desc: "\u0394", category: "greek" },
+  { cmd: "\\Theta", desc: "\u0398", category: "greek" },
+  { cmd: "\\Lambda", desc: "\u039B", category: "greek" },
+  { cmd: "\\Sigma", desc: "\u03A3", category: "greek" },
+  { cmd: "\\Phi", desc: "\u03A6", category: "greek" },
+  { cmd: "\\Psi", desc: "\u03A8", category: "greek" },
+  { cmd: "\\Omega", desc: "\u03A9", category: "greek" },
+  // Operators
+  { cmd: "\\pm", desc: "\xB1", category: "op" },
+  { cmd: "\\mp", desc: "\u2213", category: "op" },
+  { cmd: "\\times", desc: "\xD7", category: "op" },
+  { cmd: "\\div", desc: "\xF7", category: "op" },
+  { cmd: "\\cdot", desc: "\xB7", category: "op" },
+  { cmd: "\\leq", desc: "\u2264", category: "op" },
+  { cmd: "\\geq", desc: "\u2265", category: "op" },
+  { cmd: "\\neq", desc: "\u2260", category: "op" },
+  { cmd: "\\approx", desc: "\u2248", category: "op" },
+  { cmd: "\\equiv", desc: "\u2261", category: "op" },
+  { cmd: "\\in", desc: "\u2208", category: "op" },
+  { cmd: "\\notin", desc: "\u2209", category: "op" },
+  { cmd: "\\subset", desc: "\u2282", category: "op" },
+  { cmd: "\\supset", desc: "\u2283", category: "op" },
+  { cmd: "\\cup", desc: "\u222A", category: "op" },
+  { cmd: "\\cap", desc: "\u2229", category: "op" },
+  { cmd: "\\forall", desc: "\u2200", category: "op" },
+  { cmd: "\\exists", desc: "\u2203", category: "op" },
+  // Arrows
+  { cmd: "\\rightarrow", desc: "\u2192", category: "arrow" },
+  { cmd: "\\leftarrow", desc: "\u2190", category: "arrow" },
+  { cmd: "\\leftrightarrow", desc: "\u2194", category: "arrow" },
+  { cmd: "\\Rightarrow", desc: "\u21D2", category: "arrow" },
+  { cmd: "\\Leftarrow", desc: "\u21D0", category: "arrow" },
+  { cmd: "\\Leftrightarrow", desc: "\u21D4", category: "arrow" },
+  { cmd: "\\mapsto", desc: "\u21A6", category: "arrow" },
+  // Functions
+  { cmd: "\\sin", desc: "sin", category: "func" },
+  { cmd: "\\cos", desc: "cos", category: "func" },
+  { cmd: "\\tan", desc: "tan", category: "func" },
+  { cmd: "\\log", desc: "log", category: "func" },
+  { cmd: "\\ln", desc: "ln", category: "func" },
+  { cmd: "\\exp", desc: "exp", category: "func" },
+  { cmd: "\\max", desc: "max", category: "func" },
+  { cmd: "\\min", desc: "min", category: "func" },
+  { cmd: "\\det", desc: "det", category: "func" },
+  // Environments
+  { cmd: "\\begin{pmatrix}\\end{pmatrix}", desc: "Matriz ()", category: "env" },
+  { cmd: "\\begin{bmatrix}\\end{bmatrix}", desc: "Matriz []", category: "env" },
+  { cmd: "\\begin{vmatrix}\\end{vmatrix}", desc: "Determinante ||", category: "env" },
+  { cmd: "\\begin{cases}\\end{cases}", desc: "Cases {", category: "env" },
+  { cmd: "\\begin{aligned}\\end{aligned}", desc: "Aligned", category: "env" },
+  // Delimiters
+  { cmd: "\\left(\\right)", desc: "Par\xE9ntesis auto", category: "delim" },
+  { cmd: "\\left[\\right]", desc: "Corchetes auto", category: "delim" },
+  { cmd: "\\left\\{\\right\\}", desc: "Llaves auto", category: "delim" },
+  { cmd: "\\left|\\right|", desc: "Valor absoluto", category: "delim" },
+  { cmd: "\\lfloor\\rfloor", desc: "Piso", category: "delim" },
+  { cmd: "\\lceil\\rceil", desc: "Techo", category: "delim" },
+  // Misc
+  { cmd: "\\text{}", desc: "Texto", category: "misc" },
+  { cmd: "\\mathbb{}", desc: "Blackboard bold", category: "misc" },
+  { cmd: "\\mathcal{}", desc: "Caligr\xE1fico", category: "misc" },
+  { cmd: "\\mathrm{}", desc: "Roman", category: "misc" },
+  { cmd: "\\mathbf{}", desc: "Bold", category: "misc" },
+  { cmd: "\\quad", desc: "Espacio grande", category: "misc" },
+  { cmd: "\\qquad", desc: "Espacio doble", category: "misc" },
+  { cmd: "\\,", desc: "Espacio fino", category: "misc" },
+  { cmd: "\\ldots", desc: "Puntos ...", category: "misc" },
+  { cmd: "\\cdots", desc: "Puntos centrados", category: "misc" },
+  { cmd: "\\vdots", desc: "Puntos verticales", category: "misc" },
+  { cmd: "\\ddots", desc: "Puntos diagonales", category: "misc" }
+];
+var LatexAutocomplete = ({
+  query,
+  position,
+  onSelect,
+  onClose
+}) => {
+  const [selectedIndex, setSelectedIndex] = useState13(0);
+  const menuRef = useRef9(null);
+  const filtered = useMemo7(() => {
+    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(() => {
+    setSelectedIndex(0);
+  }, [query]);
+  useEffect11(() => {
+    const handleKey = (e) => {
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        e.stopPropagation();
+        setSelectedIndex((i) => (i + 1) % Math.max(filtered.length, 1));
+      } else if (e.key === "ArrowUp") {
+        e.preventDefault();
+        e.stopPropagation();
+        setSelectedIndex((i) => (i - 1 + filtered.length) % Math.max(filtered.length, 1));
+      } else if (e.key === "Enter" || e.key === "Tab") {
+        if (filtered.length > 0) {
+          e.preventDefault();
+          e.stopPropagation();
+          onSelect(filtered[selectedIndex]?.cmd || "");
+        }
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        onClose();
+      }
+    };
+    document.addEventListener("keydown", handleKey, true);
+    return () => document.removeEventListener("keydown", handleKey, true);
+  }, [filtered, selectedIndex, onSelect, onClose]);
+  if (filtered.length === 0) return null;
+  return /* @__PURE__ */ jsx14(
+    "div",
+    {
+      ref: menuRef,
+      className: "sci-nb-slash-menu",
+      style: { top: position.top, left: position.left, minWidth: 220 },
+      children: filtered.map((item, i) => /* @__PURE__ */ jsxs13(
+        "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 })
+            ] })
+          ]
+        },
+        item.cmd
+      ))
+    }
+  );
+};
+
+// src/components/GhostText.tsx
+import { useEffect as useEffect12, useCallback as useCallback13 } from "react";
+import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+var GhostText = ({
+  text,
+  textareaRef,
+  onAccept,
+  onDismiss
+}) => {
+  const handleKeyDown = useCallback13((e) => {
+    if (e.key === "Tab" && !e.shiftKey) {
+      e.preventDefault();
+      e.stopPropagation();
+      onAccept();
+    } else if (e.key === "Escape") {
+      e.preventDefault();
+      onDismiss();
+    }
+  }, [onAccept, onDismiss]);
+  useEffect12(() => {
+    const ta2 = textareaRef.current;
+    if (!ta2) return;
+    ta2.addEventListener("keydown", handleKeyDown, true);
+    return () => ta2.removeEventListener("keydown", handleKeyDown, true);
+  }, [textareaRef, handleKeyDown]);
+  if (!text) return null;
+  const ta = textareaRef.current;
+  if (!ta) return null;
+  const cursorPos = ta.selectionStart;
+  const before = ta.value.slice(0, cursorPos);
+  const lines = before.split("\n");
+  const lineHeight = 22;
+  const charWidth = 7.8;
+  const top = (lines.length - 1) * lineHeight;
+  const left = lines[lines.length - 1].length * charWidth;
+  const firstLine = text.split("\n")[0];
+  const hasMore = text.includes("\n");
+  return /* @__PURE__ */ jsxs14(
+    "div",
+    {
+      className: "sci-nb-ghost-text",
+      style: {
+        position: "absolute",
+        top: `${top + 10}px`,
+        left: `${left + 12}px`,
+        pointerEvents: "none",
+        whiteSpace: "pre",
+        fontFamily: "inherit",
+        fontSize: "inherit",
+        lineHeight: `${lineHeight}px`,
+        zIndex: 5
+      },
+      children: [
+        firstLine,
+        hasMore ? "..." : "",
+        /* @__PURE__ */ jsx15("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";
+var ChatSidebar = ({
+  onSend,
+  systemPrompt,
+  onApply,
+  onClose
+}) => {
+  const engine = useSciNotebook();
+  const [messages, setMessages] = useState14(() => {
+    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(() => {
+    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, [messages]);
+  useEffect13(() => {
+    inputRef.current?.focus();
+  }, []);
+  const handleSend = useCallback14(async () => {
+    const text = input.trim();
+    if (!text || loading) return;
+    const userMsg = { role: "user", content: text, timestamp: Date.now() };
+    const newMessages = [...messages, userMsg];
+    setMessages(newMessages);
+    setInput("");
+    setLoading(true);
+    try {
+      if (onSend) {
+        const response = await onSend(text, newMessages);
+        setMessages((prev) => [
+          ...prev,
+          { role: "assistant", content: response, timestamp: Date.now() }
+        ]);
+      } else {
+        setMessages((prev) => [
+          ...prev,
+          {
+            role: "assistant",
+            content: "No AI provider configured. Pass an `onSend` prop to enable AI chat.",
+            timestamp: Date.now()
+          }
+        ]);
+      }
+    } catch (e) {
+      setMessages((prev) => [
+        ...prev,
+        {
+          role: "assistant",
+          content: `Error: ${e.message || "Failed to get response"}`,
+          timestamp: Date.now()
+        }
+      ]);
+    } finally {
+      setLoading(false);
+    }
+  }, [input, messages, loading, onSend]);
+  const handleKeyDown = useCallback14((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(
+        "button",
+        {
+          onClick: onClose,
+          style: { border: "none", background: "transparent", cursor: "pointer", fontSize: 16 },
+          children: "\u2715"
+        }
+      )
+    ] }),
+    /* @__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(
+          "button",
+          {
+            onClick: () => onApply(msg.content),
+            style: {
+              marginTop: 4,
+              fontSize: 11,
+              padding: "2px 6px",
+              border: "1px solid #e2e8f0",
+              borderRadius: 4,
+              background: "transparent",
+              cursor: "pointer"
+            },
+            children: "Apply to cell"
+          }
+        )
+      ] }, 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 })
+    ] }),
+    /* @__PURE__ */ jsxs15("div", { className: "sci-nb-chat-input", children: [
+      /* @__PURE__ */ jsx16(
+        "input",
+        {
+          ref: inputRef,
+          type: "text",
+          value: input,
+          onChange: (e) => setInput(e.target.value),
+          onKeyDown: handleKeyDown,
+          placeholder: "Ask something...",
+          disabled: loading
+        }
+      ),
+      /* @__PURE__ */ jsx16("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";
+var ImageResize = ({
+  src,
+  alt = "",
+  initialWidth,
+  maxWidth = "100%",
+  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) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const img = imgRef.current;
+    if (!img) return;
+    startRef.current = { x: e.clientX, w: img.offsetWidth };
+    setDragging(true);
+  }, []);
+  useEffect14(() => {
+    if (!dragging) return;
+    const handleMouseMove = (e) => {
+      const dx = e.clientX - startRef.current.x;
+      const newW = Math.max(50, startRef.current.w + dx);
+      setWidth(newW);
+    };
+    const handleMouseUp = () => {
+      setDragging(false);
+      if (width !== null && containerRef.current) {
+        const parentW = containerRef.current.parentElement?.offsetWidth || 1;
+        const pct = Math.round(width / parentW * 100);
+        onResize(`${Math.min(pct, 100)}%`);
+      }
+    };
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("mouseup", handleMouseUp);
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+    };
+  }, [dragging, width, onResize]);
+  const style = {
+    maxWidth,
+    width: width !== null ? `${width}px` : initialWidth,
+    position: "relative",
+    display: "inline-block"
+  };
+  return /* @__PURE__ */ jsxs16("div", { ref: containerRef, className: "sci-nb-image-resizable", style, children: [
+    /* @__PURE__ */ jsx17(
+      "img",
+      {
+        ref: imgRef,
+        src,
+        alt,
+        style: { width: "100%", height: "auto", display: "block" },
+        draggable: false
+      }
+    ),
+    children,
+    /* @__PURE__ */ jsx17(
+      "div",
+      {
+        className: "sci-nb-image-resize-handle sci-nb-image-resize-handle--se",
+        onMouseDown: handleMouseDown
+      }
+    )
+  ] });
+};
+
+// 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";
+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) => {
+    return cellHeights.current.get(index) ?? estimatedHeight;
+  }, [estimatedHeight]);
+  const totalHeight = useMemo8(() => {
+    let h = 0;
+    for (let i = 0; i < cells.length; i++) {
+      h += getHeight(i) + 32;
+    }
+    return h;
+  }, [cells.length, getHeight]);
+  useEffect15(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const handleScroll = () => {
+      const scrollTop = container.scrollTop;
+      const viewportHeight = container.clientHeight;
+      let accum = 0;
+      let start = 0;
+      let end = cells.length;
+      for (let i = 0; i < cells.length; i++) {
+        const h = getHeight(i) + 32;
+        if (accum + h >= scrollTop && start === 0) {
+          start = Math.max(0, i - overscan);
+        }
+        if (accum > scrollTop + viewportHeight) {
+          end = Math.min(cells.length, i + overscan);
+          break;
+        }
+        accum += h;
+      }
+      setVisibleRange((prev) => {
+        if (prev.start === start && prev.end === end) return prev;
+        return { start, end };
+      });
+    };
+    handleScroll();
+    container.addEventListener("scroll", handleScroll, { passive: true });
+    return () => container.removeEventListener("scroll", handleScroll);
+  }, [cells.length, getHeight, overscan]);
+  const measureRef = useCallback16((index) => {
+    return (el) => {
+      if (!el) return;
+      const observer = new ResizeObserver((entries) => {
+        for (const entry of entries) {
+          const h = entry.contentRect.height;
+          if (h > 0 && cellHeights.current.get(index) !== h) {
+            cellHeights.current.set(index, h);
+          }
+        }
+      });
+      observer.observe(el);
+    };
+  }, []);
+  const topOffset = useMemo8(() => {
+    let h = 0;
+    for (let i = 0; i < visibleRange.start; i++) {
+      h += getHeight(i) + 32;
+    }
+    return h;
+  }, [visibleRange.start, getHeight]);
+  const visibleCells = cells.slice(visibleRange.start, visibleRange.end);
+  return /* @__PURE__ */ jsx18(
+    "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 }),
+        visibleCells.map((cell, i) => {
+          const realIndex = visibleRange.start + i;
+          return /* @__PURE__ */ jsxs17("div", { ref: measureRef(realIndex), children: [
+            /* @__PURE__ */ jsx18(
+              Cell,
+              {
+                cellId: cell.id,
+                pipeline,
+                index: realIndex,
+                totalCells: cells.length
+              }
+            ),
+            /* @__PURE__ */ jsx18(InsertHandle, { index: realIndex + 1 })
+          ] }, cell.id);
+        })
+      ] }) })
+    }
+  );
+};
+
+// 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";
+var AIRewrite = ({
+  selectedText,
+  position,
+  onRewrite,
+  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(() => {
+    inputRef.current?.focus();
+  }, []);
+  const handleSubmit = useCallback17(async () => {
+    if (!instruction.trim()) return;
+    setState("loading");
+    setError(null);
+    try {
+      const rewritten = await onRewrite(instruction, selectedText);
+      setResult(rewritten);
+      setState("preview");
+    } catch (e) {
+      setError(e.message || "Rewrite failed");
+      setState("prompt");
+    }
+  }, [instruction, selectedText, onRewrite]);
+  const handleKeyDown = useCallback17((e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSubmit();
+    } else if (e.key === "Escape") {
+      e.preventDefault();
+      onReject();
+    }
+  }, [handleSubmit, onReject]);
+  const handleAccept = useCallback17(() => {
+    onAccept(result);
+  }, [result, onAccept]);
+  const handleRetry = useCallback17(() => {
+    setState("prompt");
+    setResult("");
+    inputRef.current?.focus();
+  }, []);
+  return /* @__PURE__ */ jsxs18(
+    "div",
+    {
+      className: "sci-nb-ai-rewrite",
+      style: {
+        position: "absolute",
+        top: position.top,
+        left: position.left,
+        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 })
+          ] }),
+          /* @__PURE__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-input-row", children: [
+            /* @__PURE__ */ jsx19(
+              "input",
+              {
+                ref: inputRef,
+                type: "text",
+                value: instruction,
+                onChange: (e) => setInstruction(e.target.value),
+                onKeyDown: handleKeyDown,
+                placeholder: "How should I rewrite this?",
+                className: "sci-nb-ai-rewrite-input"
+              }
+            ),
+            /* @__PURE__ */ jsx19(
+              "button",
+              {
+                onClick: handleSubmit,
+                disabled: !instruction.trim(),
+                className: "sci-nb-ai-rewrite-btn sci-nb-ai-rewrite-btn--primary",
+                children: "Rewrite"
+              }
+            ),
+            /* @__PURE__ */ jsx19("button", { onClick: onReject, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+          ] }),
+          error && /* @__PURE__ */ jsx19("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 })
+            ] }),
+            /* @__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__ */ jsxs18("div", { className: "sci-nb-ai-rewrite-actions", children: [
+            /* @__PURE__ */ jsx19(
+              "button",
+              {
+                onClick: handleAccept,
+                className: "sci-nb-ai-rewrite-btn sci-nb-ai-rewrite-btn--primary",
+                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" })
+          ] })
+        ] })
+      ]
+    }
+  );
+};
+
+// 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";
+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(() => {
+    inputRef.current?.focus();
+  }, []);
+  const handleGenerate = useCallback18(async () => {
+    if (!prompt.trim()) return;
+    setState("loading");
+    setError(null);
+    try {
+      const generated = await onGenerate(prompt);
+      setCells(generated);
+      setState("preview");
+    } catch (e) {
+      setError(e.message || "Generation failed");
+      setState("prompt");
+    }
+  }, [prompt, onGenerate]);
+  const handleKeyDown = useCallback18((e) => {
+    if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
+      e.preventDefault();
+      handleGenerate();
+    } else if (e.key === "Escape") {
+      e.preventDefault();
+      onCancel();
+    }
+  }, [handleGenerate, onCancel]);
+  const handleAccept = useCallback18(() => {
+    onAccept(cells);
+  }, [cells, onAccept]);
+  const handleRegenerate = useCallback18(() => {
+    setState("prompt");
+    setCells([]);
+    inputRef.current?.focus();
+  }, []);
+  const CELL_TYPE_LABELS = {
+    markdown: "Markdown",
+    code: "Code",
+    latex: "LaTeX",
+    table: "Table",
+    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" })
+      ] }),
+      /* @__PURE__ */ jsx20(
+        "textarea",
+        {
+          ref: inputRef,
+          value: prompt,
+          onChange: (e) => setPrompt(e.target.value),
+          onKeyDown: handleKeyDown,
+          placeholder: "Describe what you want to generate...\ne.g. 'Create a markdown cell explaining Newton's second law with a LaTeX formula'",
+          className: "sci-nb-ai-generate-textarea",
+          rows: 3
+        }
+      ),
+      /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-actions", children: [
+        /* @__PURE__ */ jsx20(
+          "button",
+          {
+            onClick: handleGenerate,
+            disabled: !prompt.trim(),
+            className: "sci-nb-ai-rewrite-btn sci-nb-ai-rewrite-btn--primary",
+            children: "Generate (Ctrl+Enter)"
+          }
+        ),
+        /* @__PURE__ */ jsx20("button", { onClick: onCancel, className: "sci-nb-ai-rewrite-btn", children: "Cancel" })
+      ] }),
+      error && /* @__PURE__ */ jsx20("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: [
+        "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 })
+      ] }, i)) }),
+      /* @__PURE__ */ jsxs19("div", { className: "sci-nb-ai-generate-actions", children: [
+        /* @__PURE__ */ jsxs19(
+          "button",
+          {
+            onClick: handleAccept,
+            className: "sci-nb-ai-rewrite-btn sci-nb-ai-rewrite-btn--primary",
+            children: [
+              "Insert ",
+              cells.length,
+              " cell",
+              cells.length !== 1 ? "s" : ""
+            ]
+          }
+        ),
+        /* @__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" })
+      ] })
+    ] })
+  ] });
+};
+export {
+  AICellGenerate,
+  AIRewrite,
+  Cell,
+  CellOutputDisplay,
+  ChatSidebar,
+  DEFAULT_COMMANDS,
+  EmbedCell,
+  FindReplace,
+  FloatingToolbar,
+  GhostText,
+  ImageCell,
+  ImageResize,
+  InsertHandle,
+  LATEX_COMMANDS,
+  LatexAutocomplete,
+  MathEditor,
+  MermaidPreview,
+  NotebookContext,
+  SciNotebook,
+  SlashCommand,
+  TOCSidebar,
+  TableCell,
+  VirtualRenderer,
+  initMermaid,
+  renderEmbedPreview,
+  renderImagePreview,
+  renderTablePreview,
+  useCell,
+  useFocusedCell,
+  useNotebook,
+  useNotebookEvent,
+  useSciNotebook
+};