@eclipse-lyra/extension-notebook 0.7.56 → 0.7.58

package/dist/notebook-runtime-DQ4uFUbN.js

@@ -1,1162 +0,0 @@
-import { html, css } from "lit";
-import { property, state, customElement } from "lit/decorators.js";
-import { ref, createRef } from "lit/directives/ref.js";
-import { repeat } from "lit/directives/repeat.js";
-import { styleMap } from "lit/directives/style-map.js";
-import { unsafeHTML } from "lit/directives/unsafe-html.js";
-import { marked } from "marked";
-import { LyraPart, unsubscribe, subscribe, TOPIC_CONTRIBUTEIONS_CHANGED, contributionRegistry, createLogger } from "@eclipse-lyra/core";
-import { T as TARGET_NOTEBOOK_KERNELS } from "./notebook-kernel-api--RBL5TaE.js";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-const logger = createLogger("NotebookRuntime");
-let LyraNotebookEditor = class extends LyraPart {
-  constructor() {
-    super(...arguments);
-    this.cellOutputs = /* @__PURE__ */ new Map();
-    this.executingCells = /* @__PURE__ */ new Set();
-    this.availableKernels = [];
-    this.selectedKernelId = null;
-    this.kernel = null;
-    this.kernelConnected = false;
-    this.kernelConnecting = false;
-    this.kernelVersion = void 0;
-    this.editingMarkdownCells = /* @__PURE__ */ new Set();
-    this.executionCounter = 0;
-    this.isRunningAll = false;
-    this.highlightedCellIndex = -1;
-    this.focusedCellIndex = -1;
-    this.cancelRunAll = false;
-    this.cellWidgetRefs = /* @__PURE__ */ new Map();
-    this.cellHeights = /* @__PURE__ */ new Map();
-  }
-  doClose() {
-    this.input = void 0;
-    this.notebook = void 0;
-    this.cellOutputs.clear();
-    this.executingCells.clear();
-    this.cellWidgetRefs.clear();
-    this.cellHeights.clear();
-    this.focusedCellIndex = -1;
-    if (this.unsubscribeContributionsToken) {
-      unsubscribe(this.unsubscribeContributionsToken);
-      this.unsubscribeContributionsToken = void 0;
-    }
-    if (this.kernel?.close) {
-      void Promise.resolve(this.kernel.close());
-    }
-    this.kernel = null;
-    this.kernelConnected = false;
-    this.kernelVersion = void 0;
-  }
-  async save() {
-    if (!this.notebook || !this.input) return;
-    try {
-      this.saveEditorContents();
-      this.notebook.cells.forEach((cell, index) => {
-        if (cell.cell_type === "code") {
-          const output = this.cellOutputs.get(index);
-          cell.outputs = output ? this.convertOutputToJupyter(output, cell.execution_count) : [];
-        }
-      });
-      const notebookJson = JSON.stringify(this.notebook, null, 2);
-      const file = this.input.data;
-      await file.saveContents(notebookJson);
-      this.markDirty(false);
-    } catch (error) {
-      console.error("Failed to save notebook:", error);
-      throw error;
-    }
-  }
-  doBeforeUI() {
-    this.loadNotebook();
-  }
-  async onKernelDropdownSelect(e) {
-    const value = e.detail?.item?.value ?? "";
-    const nextId = value || null;
-    if (this.selectedKernelId === nextId) return;
-    if (this.kernel?.close) void Promise.resolve(this.kernel.close());
-    this.kernel = null;
-    this.kernelConnected = false;
-    this.kernelVersion = void 0;
-    this.selectedKernelId = nextId;
-    if (this.notebook) {
-      if (!this.notebook.metadata) this.notebook.metadata = {};
-      this.notebook.metadata.kernel = nextId ?? void 0;
-    }
-    this.cellOutputs.clear();
-    this.executionCounter = 0;
-    this.notebook?.cells?.forEach((cell) => {
-      if (cell.cell_type === "code") {
-        cell.execution_count = null;
-        cell.outputs = [];
-      }
-    });
-    this.resetCellState();
-    await this.ensureKernelLoaded();
-    this.requestUpdate();
-  }
-  renderToolbar() {
-    const kernels = this.availableKernels;
-    kernels.length > 0;
-    const currentLabel = this.selectedKernelId ? kernels.find((c) => c.id === this.selectedKernelId)?.label ?? this.selectedKernelId : "Select kernel";
-    const connectionTitle = this.kernelConnecting ? "Connecting..." : this.kernelConnected ? "Kernel connected" : "Kernel disconnected";
-    const connectionText = this.kernelConnecting ? "Connecting..." : this.kernelConnected ? this.kernelVersion ?? "Connected" : "Not connected";
-    const iconColor = this.kernelConnected ? "var(--wa-color-green-40)" : this.kernelConnecting ? "var(--wa-color-warning-500)" : "var(--wa-color-red-40)";
-    const runAllButton = this.isRunningAll ? html`
-            <wa-button size="small" appearance="plain" @click=${() => this.cancelAllCells()} title="Cancel running all cells">
-                <wa-icon name="stop" label="Stop"></wa-icon>
-                Cancel All
-            </wa-button>
-        ` : html`
-            <wa-button size="small" appearance="plain" @click=${() => this.runAllCells()} title="Run all code cells sequentially">
-                <wa-icon name="play" label="Run"></wa-icon>
-                Run All
-            </wa-button>
-        `;
-    return html`
-            <wa-dropdown
-                class="kernel-select"
-                placement="bottom-start"
-                distance="4"
-                size="small"
-                @wa-select=${(e) => void this.onKernelDropdownSelect(e)}
-            >
-                <wa-button
-                    slot="trigger"
-                    appearance="plain"
-                    size="small"
-                    with-caret
-                    title="Notebook kernel"
-                >
-                    ${currentLabel}
-                </wa-button>
-                ${kernels.map(
-      (c) => html`
-                        <wa-dropdown-item
-                            value=${c.id}
-                            type="checkbox"
-                            ?checked=${c.id === this.selectedKernelId}
-                        >
-                            ${c.label}
-                        </wa-dropdown-item>
-                    `
-    )}
-            </wa-dropdown>
-            ${runAllButton}
-            <wa-button
-                size="small"
-                appearance="plain"
-                @click=${() => this.clearAllOutputs()}
-                title="Clear all outputs and reset execution counter"
-            >
-                <wa-icon name="eraser" label="Clear"></wa-icon>
-                Clear Outputs
-            </wa-button>
-            ${this.kernel?.restart ? html`
-                <wa-button
-                    size="small"
-                    appearance="plain"
-                    @click=${() => void this.restartKernel()}
-                    title="Restart kernel"
-                    ?disabled=${!this.kernelConnected || this.kernelConnecting}
-                >
-                    <wa-icon name="arrows-rotate" label="Restart"></wa-icon>
-                    Restart Kernel
-                </wa-button>
-            ` : ""}
-            ${this.kernel?.openPackageManager ? html`
-                <wa-button
-                    size="small"
-                    appearance="plain"
-                    @click=${() => this.openPackageManager()}
-                    title="Manage packages"
-                >
-                    <wa-icon name="box" label="Packages"></wa-icon>
-                    Packages
-                </wa-button>
-            ` : ""}
-            ${this.kernel ? this.kernel.connect ? html`
-                <wa-button
-                    appearance="plain"
-                    size="small"
-                    style="display: flex; align-items: center; gap: 0.5rem;"
-                    ?disabled=${this.kernelConnecting}
-                    @click=${() => void this.connectKernel()}
-                    title=${connectionTitle}
-                >
-                    <wa-icon name="circle" label="Kernel status" style=${styleMap({ color: iconColor })}></wa-icon>
-                    ${connectionText}
-                </wa-button>
-            ` : html`
-                <span style="display: flex; align-items: center; gap: 0.5rem;" title=${connectionTitle}>
-                    <wa-icon name="circle" label="Kernel status" style=${styleMap({ color: iconColor })}></wa-icon>
-                    ${connectionText}
-                </span>
-            ` : ""}
-        `;
-  }
-  async connectKernel() {
-    if (this.kernelConnecting || !this.kernel?.connect) return;
-    try {
-      this.kernelConnecting = true;
-      this.requestUpdate();
-      await this.kernel.connect({
-        requiredPackages: this.notebook?.metadata?.required_packages
-      });
-      this.kernelConnected = true;
-      if (this.kernel.getVersion) this.kernelVersion = await this.kernel.getVersion();
-    } catch (err) {
-      logger.error("Failed to connect kernel", err);
-    } finally {
-      this.kernelConnecting = false;
-      this.requestUpdate();
-    }
-  }
-  async doInitUI() {
-    this.unsubscribeContributionsToken = subscribe(TOPIC_CONTRIBUTEIONS_CHANGED, (event) => {
-      if (event?.target === TARGET_NOTEBOOK_KERNELS) {
-        void this.refreshKernels();
-      }
-    });
-    await this.refreshKernels();
-  }
-  resolveDefaultKernelId(contributions) {
-    if (!contributions.length) return null;
-    const fromMeta = this.notebook?.metadata?.kernel;
-    if (fromMeta && contributions.some((c) => c.id === fromMeta)) return fromMeta;
-    const python = contributions.find((c) => c.id === "python");
-    if (python) return python.id;
-    const js = contributions.find((c) => c.id === "javascript");
-    if (js) return js.id;
-    return contributions[0].id;
-  }
-  async refreshKernels() {
-    const contributions = contributionRegistry.getContributions(TARGET_NOTEBOOK_KERNELS);
-    this.availableKernels = contributions;
-    if (!this.selectedKernelId && contributions.length) {
-      this.selectedKernelId = this.resolveDefaultKernelId(contributions);
-      if (this.notebook && this.selectedKernelId) {
-        if (!this.notebook.metadata) this.notebook.metadata = {};
-        this.notebook.metadata.kernel = this.selectedKernelId;
-      }
-    }
-    if (this.selectedKernelId && !contributions.some((c) => c.id === this.selectedKernelId)) {
-      this.selectedKernelId = contributions.length ? contributions[0].id : null;
-    }
-    this.requestUpdate();
-    await this.ensureKernelLoaded();
-  }
-  async ensureKernelLoaded() {
-    const id = this.selectedKernelId;
-    if (!id || this.kernel?.id === id) return;
-    if (this.kernel?.close) void Promise.resolve(this.kernel.close());
-    this.kernel = null;
-    this.kernelConnected = false;
-    this.kernelVersion = void 0;
-    const contribution = this.availableKernels.find((c) => c.id === id);
-    if (!contribution) return;
-    try {
-      this.kernelConnecting = true;
-      this.requestUpdate();
-      const k = await contribution.loadKernel();
-      if (this.selectedKernelId !== id) return;
-      this.kernel = k;
-      if (k.connect) {
-        await k.connect({
-          requiredPackages: this.notebook?.metadata?.required_packages
-        });
-      }
-      this.kernelConnected = true;
-      if (k.getVersion) {
-        this.kernelVersion = await k.getVersion();
-      }
-    } catch (err) {
-      logger.error("Failed to load kernel", id, err);
-    } finally {
-      this.kernelConnecting = false;
-      this.requestUpdate();
-    }
-  }
-  async loadNotebook() {
-    const file = this.input.data;
-    const contents = await file.getContents();
-    try {
-      this.notebook = JSON.parse(contents);
-    } catch (e) {
-      console.error("Failed to parse notebook:", e);
-      this.notebook = {
-        cells: [{
-          cell_type: "markdown",
-          source: ["# Error\nFailed to parse notebook file."]
-        }]
-      };
-    }
-    if (this.notebook?.metadata?.kernel) {
-      this.selectedKernelId = this.notebook.metadata.kernel;
-    }
-    if (this.notebook?.cells) {
-      const maxCount = this.notebook.cells.filter((cell) => cell.cell_type === "code").map((cell) => cell.execution_count ?? 0).reduce((max, count) => Math.max(max, count), 0);
-      this.executionCounter = maxCount;
-      this.notebook.cells.forEach((cell, index) => {
-        if (cell.cell_type === "code" && cell.outputs && cell.outputs.length > 0) {
-          const output = this.convertOutputFromJupyter(cell.outputs[0]);
-          if (output) {
-            this.cellOutputs.set(index, output);
-          }
-        }
-      });
-    }
-    void this.refreshKernels();
-  }
-  getCellSource(cell) {
-    return Array.isArray(cell.source) ? cell.source.join("") : cell.source;
-  }
-  convertOutputToJupyter(output, executionCount) {
-    if (output.type === "execute_result") {
-      const data = {};
-      if (output.imageData) data["image/png"] = output.imageData;
-      if (output.data) data["text/plain"] = output.data;
-      return [{
-        output_type: "execute_result",
-        data,
-        execution_count: executionCount,
-        metadata: {}
-      }];
-    } else if (output.type === "error") {
-      return [{
-        output_type: "error",
-        ename: "Error",
-        evalue: output.data,
-        traceback: [output.data]
-      }];
-    }
-    return [];
-  }
-  convertOutputFromJupyter(jupyterOutput) {
-    if (jupyterOutput.output_type === "execute_result" && jupyterOutput.data) {
-      return {
-        type: "execute_result",
-        data: jupyterOutput.data["text/plain"] || "",
-        imageData: jupyterOutput.data["image/png"] || void 0
-      };
-    } else if (jupyterOutput.output_type === "error") {
-      return {
-        type: "error",
-        data: jupyterOutput.evalue || jupyterOutput.traceback?.join("\n") || "Unknown error"
-      };
-    }
-    return null;
-  }
-  renderHeaderActions(index, additionalButton) {
-    return html`
-            <div class="cell-header-actions">
-                ${additionalButton || ""}
-                ${additionalButton ? html`<span class="divider"></span>` : ""}
-                <wa-button size="small" appearance="plain" @click=${() => this.addCell(index, "code")} title="Add code cell before">
-                    <wa-icon name="plus"></wa-icon>
-                    <wa-icon name="code" label="Code"></wa-icon>
-                </wa-button>
-                <wa-button size="small" appearance="plain" @click=${() => this.addCell(index, "markdown")} title="Add markdown cell before">
-                    <wa-icon name="plus"></wa-icon>
-                    <wa-icon name="font" label="Markdown"></wa-icon>
-                </wa-button>
-                <span class="divider"></span>
-                <wa-button size="small" appearance="plain" @click=${() => this.deleteCell(index)} title="Delete cell" ?disabled=${this.notebook.cells.length <= 1}>
-                    <wa-icon name="trash" label="Delete cell"></wa-icon>
-                </wa-button>
-            </div>
-        `;
-  }
-  renderFooterActions(index) {
-    return html`
-            <div class="cell-footer">
-                <wa-button size="small" appearance="plain" @click=${() => this.addCell(index + 1, "code")} title="Add code cell after">
-                    <wa-icon name="code" label="Code"></wa-icon>
-                    <wa-icon name="plus"></wa-icon>
-                </wa-button>
-                <wa-button size="small" appearance="plain" @click=${() => this.addCell(index + 1, "markdown")} title="Add markdown cell after">
-                    <wa-icon name="font" label="Markdown"></wa-icon>
-                    <wa-icon name="plus"></wa-icon>
-                </wa-button>
-            </div>
-        `;
-  }
-  // Helper to convert string to Jupyter source format
-  stringToSourceArray(content) {
-    if (!content) return [""];
-    const lines = content.split("\n").map((line) => line + "\n");
-    if (lines.length > 0) {
-      lines[lines.length - 1] = lines[lines.length - 1].replace(/\n$/, "");
-    }
-    return lines;
-  }
-  // Helper to create a new cell
-  createCell(cellType) {
-    const newCell = {
-      cell_type: cellType,
-      source: [""],
-      metadata: {}
-    };
-    if (cellType === "code") {
-      newCell.execution_count = null;
-      newCell.outputs = [];
-    }
-    return newCell;
-  }
-  async executeCell(cellIndex) {
-    const cell = this.notebook.cells[cellIndex];
-    if (cell.cell_type !== "code") return;
-    this.executingCells.add(cellIndex);
-    this.requestUpdate();
-    try {
-      await this.ensureKernelLoaded();
-      const k = this.kernel;
-      if (!k) {
-        if (this.executingCells.has(cellIndex)) {
-          this.cellOutputs.set(cellIndex, { type: "error", data: "No kernel selected" });
-        }
-        return;
-      }
-      const widget = this.getCellWidgetRef(cellIndex).value;
-      const code = widget ? widget.getContent() : this.getCellSource(cell);
-      if (code === null || code === void 0) return;
-      const result = await k.execute(code);
-      if (result.error) {
-        this.cellOutputs.set(cellIndex, { type: "error", data: result.error });
-      } else {
-        this.cellOutputs.set(cellIndex, {
-          type: "execute_result",
-          data: result.data,
-          imageData: result.imageData
-        });
-      }
-      this.executionCounter++;
-      cell.execution_count = this.executionCounter;
-      this.markDirty(true);
-    } catch (error) {
-      if (this.executingCells.has(cellIndex)) {
-        this.cellOutputs.set(cellIndex, {
-          type: "error",
-          data: error instanceof Error ? error.message : String(error)
-        });
-      }
-    } finally {
-      this.executingCells.delete(cellIndex);
-      this.requestUpdate();
-    }
-  }
-  cancelExecution(cellIndex) {
-    if (this.kernel?.interrupt) {
-      this.kernel.interrupt();
-    } else {
-      this.cellOutputs.set(cellIndex, {
-        type: "error",
-        data: "Cancellation not supported for this kernel"
-      });
-      this.executingCells.delete(cellIndex);
-      this.requestUpdate();
-    }
-  }
-  clearAllOutputs() {
-    this.cellOutputs.clear();
-    this.executionCounter = 0;
-    if (this.notebook?.cells) {
-      this.notebook.cells.forEach((cell) => {
-        if (cell.cell_type === "code") {
-          cell.execution_count = null;
-          cell.outputs = [];
-        }
-      });
-    }
-    this.markDirty(true);
-    this.requestUpdate();
-  }
-  async restartKernel() {
-    if (!this.kernel?.restart || this.kernelConnecting) return;
-    try {
-      this.kernelConnecting = true;
-      this.requestUpdate();
-      await this.kernel.restart();
-      this.kernelConnected = true;
-      if (this.kernel.getVersion) this.kernelVersion = await this.kernel.getVersion();
-    } catch (error) {
-      logger.error("Failed to restart kernel", error);
-    } finally {
-      this.kernelConnecting = false;
-      this.requestUpdate();
-    }
-  }
-  async runAllCells() {
-    if (!this.notebook?.cells) return;
-    this.isRunningAll = true;
-    this.cancelRunAll = false;
-    this.requestUpdate();
-    try {
-      for (let i = 0; i < this.notebook.cells.length; i++) {
-        if (this.cancelRunAll) {
-          break;
-        }
-        const cell = this.notebook.cells[i];
-        if (cell.cell_type === "code") {
-          await this.executeCell(i);
-        }
-      }
-    } finally {
-      this.isRunningAll = false;
-      this.cancelRunAll = false;
-      this.requestUpdate();
-    }
-  }
-  cancelAllCells() {
-    this.cancelRunAll = true;
-    this.kernel?.interrupt?.();
-  }
-  toggleMarkdownEdit(index) {
-    if (this.editingMarkdownCells.has(index)) {
-      this.editingMarkdownCells.delete(index);
-    } else {
-      this.editingMarkdownCells.add(index);
-    }
-    this.requestUpdate();
-  }
-  saveMarkdownEdit(index, event) {
-    const textarea = event.target;
-    const newContent = textarea.value;
-    if (this.notebook && this.notebook.cells[index]) {
-      const cell = this.notebook.cells[index];
-      const oldContent = this.getCellSource(cell);
-      cell.source = this.stringToSourceArray(newContent);
-      if (oldContent !== newContent) {
-        this.markDirty(true);
-      }
-    }
-    this.editingMarkdownCells.delete(index);
-    this.requestUpdate();
-  }
-  renderMarkdownCell(cell, index) {
-    const source = this.getCellSource(cell);
-    const isEmpty = !source || source.trim() === "";
-    const isEditing = this.editingMarkdownCells.has(index);
-    if (isEditing) {
-      const editButtons = html`
-                <wa-button 
-                    size="small" 
-                    appearance="plain"
-                    @click=${(e) => {
-        const textarea = e.target.closest(".markdown-cell")?.querySelector("textarea");
-        if (textarea) {
-          this.saveMarkdownEdit(index, { target: textarea });
-        }
-      }}
-                    title="Save changes">
-                    <wa-icon name="check" label="Save"></wa-icon>
-                </wa-button>
-                <wa-button 
-                    size="small" 
-                    appearance="plain"
-                    @click=${() => this.toggleMarkdownEdit(index)}
-                    title="Cancel editing">
-                    <wa-icon name="xmark" label="Cancel"></wa-icon>
-                </wa-button>
-            `;
-      return html`
-                <div class="cell-wrapper">
-                    <wa-animation 
-                        name="bounce" 
-                        duration="1000" 
-                        iterations="1"
-                        ?play=${this.highlightedCellIndex === index}
-                        @wa-finish=${() => this.highlightedCellIndex = -1}>
-                        <div class="cell markdown-cell editing">
-                            <div class="cell-header">
-                                ${this.renderHeaderActions(index, editButtons)}
-                                <span class="cell-label">Markdown</span>
-                            </div>
-                            <textarea 
-                                class="markdown-editor"
-                                .value=${source}
-                                @blur=${(e) => this.saveMarkdownEdit(index, e)}
-                                placeholder="Enter markdown content here... (# for headings, ** for bold, etc.)"></textarea>
-                            ${this.renderFooterActions(index)}
-                        </div>
-                    </wa-animation>
-                </div>
-            `;
-    }
-    const rendered = marked.parse(source);
-    const editButton = html`
-            <wa-button 
-                size="small" 
-                appearance="plain"
-                @click=${() => this.toggleMarkdownEdit(index)}
-                title="Edit markdown">
-                <wa-icon name="pencil" label="Edit"></wa-icon>
-            </wa-button>
-        `;
-    return html`
-            <div class="cell-wrapper">
-                <wa-animation 
-                    name="bounce" 
-                    duration="1000" 
-                    iterations="1"
-                    ?play=${this.highlightedCellIndex === index}
-                    @wa-finish=${() => this.highlightedCellIndex = -1}>
-                    <div class="cell markdown-cell ${isEmpty ? "empty" : ""}" @dblclick=${() => this.toggleMarkdownEdit(index)}>
-                        <div class="cell-header">
-                            ${this.renderHeaderActions(index, editButton)}
-                            <span class="cell-label"></span>
-                        </div>
-                        <div class="cell-content">
-                            ${isEmpty ? html`
-                                <div class="markdown-placeholder">
-                                    <wa-icon name="font" label="Markdown"></wa-icon>
-                                    <span>Double-click or click the pencil icon to edit markdown</span>
-                                </div>
-                            ` : unsafeHTML(rendered)}
-                        </div>
-                        ${this.renderFooterActions(index)}
-                    </div>
-                </wa-animation>
-            </div>
-        `;
-  }
-  renderCodeCell(cell, index) {
-    const output = this.cellOutputs.get(index);
-    const isExecuting = this.executingCells.has(index);
-    const source = this.getCellSource(cell);
-    const language = this.kernel?.language ?? "javascript";
-    const notebookPath = this.input?.data?.getWorkspacePath?.() ?? "notebook";
-    const cellUri = `${notebookPath}-cell-${index}`;
-    const cellHeight = this.cellHeights.get(index) ?? Math.max(100, source.split("\n").length * 19 + 10);
-    const runButton = isExecuting ? html`
-            <wa-button 
-                size="small" 
-                appearance="plain"
-                @click=${() => this.cancelExecution(index)}
-                title="Stop execution">
-                <wa-icon name="stop" label="Stop" style="color: var(--wa-color-danger-500);"></wa-icon>
-            </wa-button>
-        ` : html`
-            <lyra-command 
-                cmd="notebook.runCell"
-                icon="play"
-                title="Run cell"
-                size="small"
-                appearance="plain"
-                .params=${{ cellIndex: index }}>
-            </lyra-command>
-        `;
-    return html`
-            <div class="cell-wrapper">
-                <wa-animation 
-                    name="bounce" 
-                    duration="1000" 
-                    iterations="1"
-                    ?play=${this.highlightedCellIndex === index}
-                    @wa-finish=${() => this.highlightedCellIndex = -1}>
-                    <div class="cell code-cell ${isExecuting ? "executing" : ""}">
-                        <div class="cell-header">
-                            <span class="cell-label">
-                                ${isExecuting ? html`
-                                    In [<wa-animation name="pulse" duration="1000" iterations="Infinity" ?play=${isExecuting}>
-                                        <span class="executing-indicator">*</span>
-                                    </wa-animation>]
-                                ` : html`
-                                    In [${cell.execution_count ?? " "}]
-                                `}
-                            </span>
-                            ${this.renderHeaderActions(index, runButton)}
-                        </div>
-                        <div
-                            class="cell-input monaco-container"
-                            style=${styleMap({ height: `${cellHeight}px` })}
-                            @wheel=${(e) => this.onCellWheel(index, e)}
-                        >
-                            <lyra-monaco-widget
-                                .value=${source}
-                                .language=${language}
-                                .uri=${cellUri}
-                                ?autoLayout=${true}
-                                @content-change=${() => this.markDirty(true)}
-                                @editor-focus=${() => {
-      this.focusedCellIndex = index;
-    }}
-                                @editor-blur=${() => {
-      if (this.focusedCellIndex === index) this.focusedCellIndex = -1;
-    }}
-                                @content-height-changed=${(e) => this.onCellHeightChange(index, e.detail.height)}
-                                ${ref(this.getCellWidgetRef(index))}
-                            ></lyra-monaco-widget>
-                        </div>
-                        ${output ? html`
-                            <div class="cell-output ${output.type === "error" ? "output-error" : ""}">
-                                <div class="output-label">Out [${index + 1}]:</div>
-                                ${output.imageData ? html`
-                                    <img src="data:image/png;base64,${output.imageData}" alt="Output image" class="output-image" />
-                                ` : ""}
-                                ${output.data ? html`<pre><code>${output.data}</code></pre>` : ""}
-                            </div>
-                        ` : ""}
-                        ${this.renderFooterActions(index)}
-                    </div>
-                </wa-animation>
-            </div>
-        `;
-  }
-  renderCell(cell, index) {
-    if (cell.cell_type === "markdown") {
-      return this.renderMarkdownCell(cell, index);
-    } else if (cell.cell_type === "code") {
-      return this.renderCodeCell(cell, index);
-    } else {
-      const source = this.getCellSource(cell);
-      return html`
-                <div class="cell raw-cell">
-                    <pre><code>${source}</code></pre>
-                </div>
-            `;
-    }
-  }
-  addCell(index, cellType = "code") {
-    if (!this.notebook) return;
-    this.saveEditorContents();
-    this.shiftIndices(index, "up");
-    this.notebook.cells.splice(index, 0, this.createCell(cellType));
-    if (cellType === "markdown") {
-      this.editingMarkdownCells.add(index);
-    }
-    this.resetCellState();
-    this.highlightedCellIndex = index;
-    this.updateComplete.then(() => {
-      this.scrollToCell(index);
-    });
-  }
-  scrollToCell(index) {
-    const cellWrapper = this.shadowRoot?.querySelectorAll(".cell-wrapper")[index];
-    if (!cellWrapper) return;
-    const scroller = this.closest("wa-scroller");
-    if (!scroller) {
-      cellWrapper.scrollIntoView({
-        behavior: "smooth",
-        block: "center",
-        inline: "nearest"
-      });
-      return;
-    }
-    const scrollerRect = scroller.getBoundingClientRect();
-    const cellRect = cellWrapper.getBoundingClientRect();
-    const scrollTop = scroller.scrollTop;
-    const targetScroll = scrollTop + (cellRect.top - scrollerRect.top) - scrollerRect.height / 2 + cellRect.height / 2;
-    scroller.scrollTo({
-      top: targetScroll,
-      behavior: "smooth"
-    });
-  }
-  saveEditorContents() {
-    this.notebook?.cells.forEach((cell, index) => {
-      if (cell.cell_type !== "code") return;
-      const widget = this.getCellWidgetRef(index).value;
-      const value = widget?.getContent();
-      if (value !== void 0 && value !== null) {
-        cell.source = this.stringToSourceArray(value);
-      }
-    });
-  }
-  resetCellState() {
-    this.markDirty(true);
-  }
-  deleteCell(index) {
-    if (!this.notebook || this.notebook.cells.length <= 1) return;
-    this.saveEditorContents();
-    this.cellOutputs.delete(index);
-    this.executingCells.delete(index);
-    this.editingMarkdownCells.delete(index);
-    this.notebook.cells.splice(index, 1);
-    this.shiftIndices(index, "down");
-    this.resetCellState();
-  }
-  shiftIndices(startIndex, direction) {
-    const shift = direction === "up" ? 1 : -1;
-    const filterFn = direction === "up" ? (idx) => idx >= startIndex : (idx) => idx > startIndex;
-    const sortFn = direction === "up" ? (a, b) => b - a : (a, b) => a - b;
-    const shiftMap = (map) => {
-      const indices = Array.from(map.keys()).filter(filterFn).sort(sortFn);
-      indices.forEach((oldIndex) => {
-        const value = map.get(oldIndex);
-        map.delete(oldIndex);
-        map.set(oldIndex + shift, value);
-      });
-    };
-    const shiftSet = (set) => {
-      const indices = Array.from(set).filter(filterFn).sort(sortFn);
-      indices.forEach((oldIndex) => {
-        set.delete(oldIndex);
-        set.add(oldIndex + shift);
-      });
-    };
-    shiftMap(this.cellOutputs);
-    shiftSet(this.executingCells);
-    shiftSet(this.editingMarkdownCells);
-    shiftMap(this.cellWidgetRefs);
-    shiftMap(this.cellHeights);
-  }
-  getCellWidgetRef(index) {
-    if (!this.cellWidgetRefs.has(index)) {
-      this.cellWidgetRefs.set(index, createRef());
-    }
-    return this.cellWidgetRefs.get(index);
-  }
-  onCellHeightChange(index, height) {
-    const padding = 10;
-    const minHeight = 100;
-    const newHeight = Math.max(minHeight, height + padding);
-    const current = this.cellHeights.get(index);
-    if (current === newHeight) return;
-    this.cellHeights = new Map(this.cellHeights);
-    this.cellHeights.set(index, newHeight);
-    this.requestUpdate();
-    this.updateComplete.then(() => this.getCellWidgetRef(index).value?.layout?.());
-  }
-  onCellWheel(index, e) {
-    const widget = this.getCellWidgetRef(index).value;
-    const editor = widget?.getEditor();
-    if (!editor) return;
-    const scrollTop = editor.getScrollTop();
-    const scrollHeight = editor.getScrollHeight();
-    const contentHeight = editor.getContentHeight();
-    const canScroll = scrollHeight > contentHeight;
-    const atBoundary = e.deltaY < 0 && scrollTop <= 0 || e.deltaY > 0 && scrollTop + contentHeight >= scrollHeight;
-    if (!canScroll || atBoundary) {
-      e.stopImmediatePropagation();
-    }
-  }
-  openPackageManager() {
-    if (!this.kernel?.openPackageManager) return;
-    const packages = this.notebook?.metadata?.required_packages ?? [];
-    this.kernel.openPackageManager({
-      requiredPackages: packages,
-      onPackageAdded: (packageName) => {
-        if (!this.notebook) return;
-        if (!this.notebook.metadata) this.notebook.metadata = {};
-        if (!this.notebook.metadata.required_packages) this.notebook.metadata.required_packages = [];
-        if (!this.notebook.metadata.required_packages.includes(packageName)) {
-          this.notebook.metadata.required_packages.push(packageName);
-          this.markDirty(true);
-        }
-      },
-      onPackageRemoved: (packageName) => {
-        if (!this.notebook?.metadata?.required_packages) return;
-        const index = this.notebook.metadata.required_packages.indexOf(packageName);
-        if (index > -1) {
-          this.notebook.metadata.required_packages.splice(index, 1);
-          this.markDirty(true);
-        }
-      }
-    });
-  }
-  updated(changedProperties) {
-    super.updated(changedProperties);
-    if (changedProperties.has("kernelConnected") || changedProperties.has("kernelConnecting") || changedProperties.has("kernelVersion") || changedProperties.has("isRunningAll") || changedProperties.has("availableKernels") || changedProperties.has("selectedKernelId")) ;
-  }
-  renderContent() {
-    if (!this.notebook) {
-      return html`<div class="loading">Loading notebook...</div>`;
-    }
-    return html`
-            <div class="noteboocells">
-                ${repeat(
-      this.notebook.cells,
-      (_cell, index) => index,
-      (cell, index) => this.renderCell(cell, index)
-    )}
-            </div>
-        `;
-  }
-};
-LyraNotebookEditor.styles = css`
-        :host {
-            display: block;
-            width: 100%;
-        }
-
-        .kernel-select {
-            max-width: 10rem;
-        }
-
-        .noteboocells {
-            display: flex;
-            flex-direction: column;
-            gap: 3rem;
-            max-width: 1200px;
-            margin: 0 auto;
-            padding: 2rem 1rem;
-            width: 100%;
-            box-sizing: border-box;
-        }
-
-        .cell-wrapper {
-            position: relative;
-        }
-
-        .cell {
-            border-radius: 4px;
-            overflow: hidden;
-            opacity: 0.9;
-            position: relative;
-        }
-
-        .cell-header-actions {
-            display: flex;
-            gap: 0.25rem;
-            align-items: center;
-            opacity: 0.5;
-            transition: opacity 0.2s;
-        }
-
-        .cell-header-actions .divider {
-            width: 1px;
-            height: 1rem;
-            background: var(--wa-color-outline);
-            margin: 0 0.25rem;
-            opacity: 0.5;
-        }
-
-        .cell-header:hover .cell-header-actions {
-            opacity: 1;
-        }
-
-        .cell-footer {
-            display: flex;
-            gap: 0.5rem;
-            align-items: center;
-            justify-content: flex-start;
-            padding: 0.5rem;
-            border-top: 1px solid var(--wa-color-outline);
-            opacity: 0.5;
-            transition: opacity 0.2s;
-        }
-
-        .cell-footer:hover {
-            opacity: 1;
-        }
-
-        .markdown-cell {
-            cursor: pointer;
-            transition: opacity 0.2s;
-        }
-
-        .markdown-cell:hover:not(.editing) {
-            opacity: 0.9;
-        }
-        
-        .markdown-cell .cell-content {
-            padding: 1rem;
-        }
-
-        .markdown-cell.editing {
-            cursor: default;
-            padding: 0;
-        }
-        
-        .markdown-cell.editing .cell-actions {
-            display: none;
-        }
-
-        .markdown-editor {
-            width: 100%;
-            min-height: 200px;
-            padding: 1rem;
-            font-family: monospace;
-            font-size: 0.95rem;
-            line-height: 1.6;
-            border: none;
-            outline: none;
-            resize: vertical;
-            background: transparent;
-            color: inherit;
-        }
-
-        .code-cell {
-            border-left: 3px solid var(--wa-color-primary-500);
-            transition: all 0.3s ease;
-        }
-        
-        .code-cell.executing {
-            border-left: 4px solid var(--wa-color-primary-500);
-            box-shadow: 0 0 0 2px var(--wa-color-primary-500, rgba(59, 130, 246, 0.3));
-            animation: pulse-cell 2s ease-in-out infinite;
-        }
-        
-        @keyframes pulse-cell {
-            0%, 100% {
-                box-shadow: 0 0 0 2px var(--wa-color-primary-500, rgba(59, 130, 246, 0.3));
-                opacity: 1;
-            }
-            50% {
-                box-shadow: 0 0 0 4px var(--wa-color-primary-500, rgba(59, 130, 246, 0.5));
-                opacity: 0.95;
-            }
-        }
-
-        .cell-header {
-            display: flex;
-            align-items: center;
-            justify-content: flex-start;
-            gap: 0.5rem;
-            padding: 0.5rem 1rem;
-            flex-wrap: nowrap;
-        }
-
-        .cell-label {
-            font-family: monospace;
-            font-weight: bold;
-            flex-shrink: 0;
-        }
-        
-        .executing-indicator {
-            display: inline-block;
-            color: var(--wa-color-primary-500);
-            font-weight: bold;
-            font-size: 1.2em;
-        }
-
-        .cell-input {
-            margin: 0;
-        }
-
-        .monaco-container {
-            min-height: 100px;
-            height: auto;
-            width: 100%;
-        }
-
-        .cell-output {
-            padding: 1rem;
-        }
-
-        .output-label {
-            font-family: monospace;
-            font-weight: bold;
-            margin-bottom: 0.5rem;
-            opacity: 0.7;
-        }
-
-        .cell-output pre {
-            margin: 0;
-            overflow-x: auto;
-        }
-
-        .cell-output code {
-            font-family: 'Courier New', monospace;
-            font-size: 0.9rem;
-            line-height: 1.5;
-        }
-
-        .output-image {
-            max-width: 100%;
-            height: auto;
-            display: block;
-            margin: 0.5rem 0;
-            border-radius: 4px;
-        }
-
-        .output-error {
-            border-left: 3px solid var(--wa-color-danger-500);
-        }
-
-        .raw-cell {
-            padding: 1rem;
-        }
-
-        .raw-cell pre {
-            margin: 0;
-        }
-
-        .loading {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            height: 100%;
-            font-size: 1.2rem;
-        }
-
-        .markdown-placeholder {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            gap: 0.75rem;
-            padding: 3rem 1rem;
-            opacity: 0.5;
-            font-style: italic;
-            transition: opacity 0.2s;
-        }
-
-        .markdown-cell.empty:hover .markdown-placeholder {
-            opacity: 0.8;
-        }
-
-        .markdown-placeholder wa-icon {
-            font-size: 1.5rem;
-        }
-    `;
-__decorateClass([
-  property({ attribute: false })
-], LyraNotebookEditor.prototype, "input", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "notebook", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "cellOutputs", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "executingCells", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "availableKernels", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "selectedKernelId", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "kernel", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "kernelConnected", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "kernelConnecting", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "kernelVersion", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "editingMarkdownCells", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "executionCounter", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "isRunningAll", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "highlightedCellIndex", 2);
-__decorateClass([
-  state()
-], LyraNotebookEditor.prototype, "cellHeights", 2);
-LyraNotebookEditor = __decorateClass([
-  customElement("lyra-notebook-editor")
-], LyraNotebookEditor);
-export {
-  LyraNotebookEditor
-};
-//# sourceMappingURL=notebook-runtime-DQ4uFUbN.js.map