notations 1.0.2 → 1.0.4

package/lib/cjs/web/components/NotebookView.js

@@ -0,0 +1,379 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const loader_1 = require("../../loader");
+const carnatic_1 = require("../../carnatic");
+const grids_1 = require("../../grids");
+const block_1 = require("../../block");
+const cellFactory_1 = require("../utils/cellFactory");
+const DEFAULT_CONFIG = {
+    maxDepth: 1,
+    enableReordering: false,
+    enableAddCell: true,
+    enableDeleteCell: true,
+};
+class NotebookView {
+    constructor(container, config = {}) {
+        var _a, _b;
+        this.notation = null;
+        this.notationSource = "";
+        this.cells = [];
+        this.cellElements = new Map();
+        this.cellNotationViews = new Map();
+        this.layoutChangeUnsubscribe = null;
+        this.config = Object.assign(Object.assign({}, DEFAULT_CONFIG), config);
+        this.rootElement = document.createElement("div");
+        this.rootElement.className = "notebook-view";
+        if ((_a = this.config.cssClasses) === null || _a === void 0 ? void 0 : _a.root) {
+            this.rootElement.className += " " + this.config.cssClasses.root;
+        }
+        container.appendChild(this.rootElement);
+        this.gridLayoutGroup = (_b = this.config.sharedGridLayoutGroup) !== null && _b !== void 0 ? _b : new grids_1.GridLayoutGroup();
+        this.layoutChangeUnsubscribe = this.gridLayoutGroup.onLayoutChange((event) => {
+            this.handleLayoutChange(event);
+        });
+    }
+    loadNotation(source) {
+        this.notationSource = source;
+        const [notation, beatLayout, errors] = (0, loader_1.load)(source, { log: false });
+        if (errors.length > 0) {
+            console.error("Notation parse errors:", errors);
+            return;
+        }
+        this.notation = notation;
+        this.cells = (0, cellFactory_1.createCellModels)(notation, {
+            maxDepth: this.config.maxDepth,
+            notationSource: source,
+            includeLines: true,
+            includeRawBlocks: true,
+        });
+        this.render();
+    }
+    getNotation() {
+        return this.notation;
+    }
+    getCells() {
+        return this.cells;
+    }
+    getVisibleCells() {
+        return (0, cellFactory_1.getVisibleCells)(this.cells);
+    }
+    getCell(cellId) {
+        return (0, cellFactory_1.findCellById)(this.cells, cellId);
+    }
+    render() {
+        this.rootElement.innerHTML = "";
+        this.cellElements.clear();
+        this.cellNotationViews.clear();
+        for (let i = 0; i < this.cells.length; i++) {
+            const cell = this.cells[i];
+            this.renderCell(cell, this.rootElement);
+            if (this.config.enableAddCell && i < this.cells.length - 1) {
+                this.renderAddCellButton(this.rootElement, i + 1);
+            }
+        }
+        if (this.config.enableAddCell) {
+            this.renderAddCellButton(this.rootElement, this.cells.length);
+        }
+    }
+    renderCell(cell, parent) {
+        var _a, _b;
+        const cellClass = ((_a = this.config.cssClasses) === null || _a === void 0 ? void 0 : _a.cell) || "";
+        const container = document.createElement("div");
+        container.className = `notebook-cell notebook-cell-${cell.state.type} ${cellClass}`;
+        container.dataset.cellId = cell.state.id;
+        container.dataset.depth = String(cell.state.depth);
+        this.renderCellHeader(cell, container);
+        const contentContainer = document.createElement("div");
+        contentContainer.className = "notebook-cell-content";
+        if ((_b = this.config.cssClasses) === null || _b === void 0 ? void 0 : _b.cellContent) {
+            contentContainer.className += " " + this.config.cssClasses.cellContent;
+        }
+        container.appendChild(contentContainer);
+        if (cell.state.isEditing) {
+            this.renderCellEditMode(cell, contentContainer);
+        }
+        else {
+            this.renderCellPreviewMode(cell, contentContainer);
+        }
+        this.cellElements.set(cell.state.id, container);
+        parent.appendChild(container);
+        if (cell.state.isExpanded && cell.children.length > 0) {
+            const childrenContainer = document.createElement("div");
+            childrenContainer.className = "notebook-cell-children";
+            container.appendChild(childrenContainer);
+            for (const child of cell.children) {
+                this.renderCell(child, childrenContainer);
+            }
+        }
+    }
+    renderCellHeader(cell, container) {
+        var _a, _b, _c;
+        const headerClass = ((_a = this.config.cssClasses) === null || _a === void 0 ? void 0 : _a.cellHeader) || "";
+        const header = document.createElement("div");
+        header.className = `notebook-cell-header ${headerClass}`;
+        const badge = document.createElement("span");
+        badge.className = `notebook-cell-badge badge-${cell.state.type}`;
+        badge.textContent = cell.state.type;
+        header.appendChild(badge);
+        if ((0, block_1.isBlock)(cell.blockItem)) {
+            const block = cell.blockItem;
+            if (block.name) {
+                const name = document.createElement("span");
+                name.className = "notebook-cell-name";
+                name.textContent = block.name;
+                header.appendChild(name);
+            }
+        }
+        if (cell.children.length > 0) {
+            const expandBtn = document.createElement("button");
+            expandBtn.className = "notebook-btn notebook-expand-btn";
+            expandBtn.textContent = cell.state.isExpanded ? "▼" : "▶";
+            expandBtn.title = cell.state.isExpanded ? "Collapse" : "Expand";
+            expandBtn.addEventListener("click", () => this.toggleExpanded(cell.state.id));
+            header.appendChild(expandBtn);
+        }
+        const controlsClass = ((_b = this.config.cssClasses) === null || _b === void 0 ? void 0 : _b.cellControls) || "";
+        const controls = document.createElement("div");
+        controls.className = `notebook-cell-controls ${controlsClass}`;
+        const editBtn = document.createElement("button");
+        editBtn.className = "notebook-btn notebook-edit-btn";
+        editBtn.textContent = cell.state.isEditing ? "Cancel" : "Edit";
+        editBtn.addEventListener("click", () => {
+            if (cell.state.isEditing) {
+                this.cancelEdit(cell.state.id);
+            }
+            else {
+                this.startEdit(cell.state.id);
+            }
+        });
+        controls.appendChild(editBtn);
+        if (this.config.enableDeleteCell) {
+            const deleteBtn = document.createElement("button");
+            deleteBtn.className = "notebook-btn notebook-delete-btn";
+            deleteBtn.textContent = "Delete";
+            deleteBtn.addEventListener("click", () => this.deleteCell(cell.state.id));
+            controls.appendChild(deleteBtn);
+        }
+        header.appendChild(controls);
+        container.appendChild(header);
+        if (cell.state.hasError && cell.state.errorMessage) {
+            const errorClass = ((_c = this.config.cssClasses) === null || _c === void 0 ? void 0 : _c.errorMessage) || "";
+            const errorDiv = document.createElement("div");
+            errorDiv.className = `notebook-cell-error ${errorClass}`;
+            errorDiv.textContent = cell.state.errorMessage;
+            container.appendChild(errorDiv);
+        }
+    }
+    renderCellPreviewMode(cell, container) {
+        if ((0, block_1.isRawBlock)(cell.blockItem)) {
+            const rawBlock = cell.blockItem;
+            const content = document.createElement("div");
+            content.className = "notebook-rawblock-content";
+            if (this.config.markdownParser && rawBlock.contentType === "md") {
+                content.innerHTML = this.config.markdownParser(rawBlock.content);
+            }
+            else {
+                content.textContent = rawBlock.content;
+            }
+            container.appendChild(content);
+        }
+        else if ((0, block_1.isLine)(cell.blockItem) || (0, block_1.isBlock)(cell.blockItem)) {
+            const viewContainer = document.createElement("div");
+            viewContainer.className = "notebook-notation-view";
+            container.appendChild(viewContainer);
+            const notationView = new carnatic_1.NotationView(viewContainer, {
+                sharedGridLayoutGroup: this.gridLayoutGroup,
+                markdownParser: this.config.markdownParser,
+            });
+            this.cellNotationViews.set(cell.state.id, notationView);
+            const placeholder = document.createElement("div");
+            placeholder.className = "notebook-notation-placeholder";
+            placeholder.textContent = `[${cell.state.type} notation content]`;
+            viewContainer.appendChild(placeholder);
+        }
+    }
+    renderCellEditMode(cell, container) {
+        var _a;
+        const textareaClass = ((_a = this.config.cssClasses) === null || _a === void 0 ? void 0 : _a.editTextarea) || "";
+        const textarea = document.createElement("textarea");
+        textarea.className = `notebook-edit-textarea ${textareaClass}`;
+        textarea.value = cell.source;
+        textarea.rows = Math.max(3, cell.source.split("\n").length);
+        container.appendChild(textarea);
+        const actions = document.createElement("div");
+        actions.className = "notebook-edit-actions";
+        const applyBtn = document.createElement("button");
+        applyBtn.className = "notebook-btn notebook-apply-btn";
+        applyBtn.textContent = "Apply";
+        applyBtn.addEventListener("click", () => {
+            this.applyEdit(cell.state.id, textarea.value);
+        });
+        actions.appendChild(applyBtn);
+        const cancelBtn = document.createElement("button");
+        cancelBtn.className = "notebook-btn notebook-cancel-btn";
+        cancelBtn.textContent = "Cancel";
+        cancelBtn.addEventListener("click", () => this.cancelEdit(cell.state.id));
+        actions.appendChild(cancelBtn);
+        container.appendChild(actions);
+    }
+    renderAddCellButton(parent, insertIndex) {
+        var _a;
+        const btnClass = ((_a = this.config.cssClasses) === null || _a === void 0 ? void 0 : _a.addCellButton) || "";
+        const btn = document.createElement("button");
+        btn.className = `notebook-add-cell-btn ${btnClass}`;
+        btn.textContent = "+ Add Cell";
+        btn.addEventListener("click", () => {
+            const newCell = this.insertCell(insertIndex, "");
+            this.startEdit(newCell.state.id);
+        });
+        parent.appendChild(btn);
+    }
+    handleLayoutChange(event) {
+        if (this.config.onLayoutChange) {
+            this.config.onLayoutChange(event);
+        }
+        if (!event.columnWidthsChanged && !event.rowHeightsChanged) {
+            return;
+        }
+    }
+    startEdit(cellId) {
+        const cell = (0, cellFactory_1.findCellById)(this.cells, cellId);
+        if (!cell)
+            return;
+        const updatedCell = (0, cellFactory_1.updateCellState)(cell, { isEditing: true });
+        this.replaceCellInTree(cell, updatedCell);
+        this.rerenderCell(updatedCell);
+    }
+    applyEdit(cellId, newSource) {
+        const cell = (0, cellFactory_1.findCellById)(this.cells, cellId);
+        if (!cell)
+            return;
+        const updatedCell = Object.assign(Object.assign({}, cell), { source: newSource, state: Object.assign(Object.assign({}, cell.state), { isEditing: false, hasError: false, errorMessage: undefined }) });
+        this.replaceCellInTree(cell, updatedCell);
+        this.rerenderCell(updatedCell);
+        if (this.config.onNotationChange) {
+            this.config.onNotationChange(this.notationSource, this.notation);
+        }
+    }
+    cancelEdit(cellId) {
+        const cell = (0, cellFactory_1.findCellById)(this.cells, cellId);
+        if (!cell)
+            return;
+        const updatedCell = (0, cellFactory_1.updateCellState)(cell, { isEditing: false });
+        this.replaceCellInTree(cell, updatedCell);
+        this.rerenderCell(updatedCell);
+    }
+    deleteCell(cellId) {
+        const cell = (0, cellFactory_1.findCellById)(this.cells, cellId);
+        if (!cell)
+            return;
+        if (cell.parent) {
+            const index = cell.parent.children.indexOf(cell);
+            if (index >= 0) {
+                cell.parent.children.splice(index, 1);
+            }
+        }
+        else {
+            const index = this.cells.indexOf(cell);
+            if (index >= 0) {
+                this.cells.splice(index, 1);
+            }
+        }
+        const element = this.cellElements.get(cellId);
+        if (element) {
+            element.remove();
+            this.cellElements.delete(cellId);
+        }
+        this.cellNotationViews.delete(cellId);
+    }
+    moveCell(cellId, targetIndex) {
+        const cell = (0, cellFactory_1.findCellById)(this.cells, cellId);
+        if (!cell)
+            return;
+        if (cell.parent) {
+            console.warn("Moving nested cells not yet supported");
+            return;
+        }
+        const currentIndex = this.cells.indexOf(cell);
+        if (currentIndex < 0 || currentIndex === targetIndex)
+            return;
+        this.cells.splice(currentIndex, 1);
+        this.cells.splice(targetIndex, 0, cell);
+        this.render();
+    }
+    insertCell(index, source) {
+        const rawBlock = new block_1.RawBlock(source, "notation");
+        const cell = {
+            blockItem: rawBlock,
+            state: {
+                id: `cell-${Date.now()}`,
+                type: "rawblock",
+                depth: 0,
+                isExpanded: true,
+                isEditing: false,
+                hasError: false,
+            },
+            source,
+            children: [],
+            parent: null,
+        };
+        this.cells.splice(index, 0, cell);
+        this.render();
+        return cell;
+    }
+    toggleExpanded(cellId) {
+        const cell = (0, cellFactory_1.findCellById)(this.cells, cellId);
+        if (!cell)
+            return;
+        const updatedCell = (0, cellFactory_1.updateCellState)(cell, {
+            isExpanded: !cell.state.isExpanded,
+        });
+        this.replaceCellInTree(cell, updatedCell);
+        this.rerenderCell(updatedCell);
+    }
+    replaceCellInTree(oldCell, newCell) {
+        if (oldCell.parent) {
+            const index = oldCell.parent.children.indexOf(oldCell);
+            if (index >= 0) {
+                oldCell.parent.children[index] = newCell;
+                newCell.parent = oldCell.parent;
+            }
+        }
+        else {
+            const index = this.cells.indexOf(oldCell);
+            if (index >= 0) {
+                this.cells[index] = newCell;
+            }
+        }
+    }
+    rerenderCell(cell) {
+        const element = this.cellElements.get(cell.state.id);
+        if (!element || !element.parentElement)
+            return;
+        const parent = element.parentElement;
+        const nextSibling = element.nextSibling;
+        element.remove();
+        this.cellElements.delete(cell.state.id);
+        this.cellNotationViews.delete(cell.state.id);
+        const tempContainer = document.createElement("div");
+        this.renderCell(cell, tempContainer);
+        const newElement = tempContainer.firstChild;
+        if (nextSibling) {
+            parent.insertBefore(newElement, nextSibling);
+        }
+        else {
+            parent.appendChild(newElement);
+        }
+    }
+    destroy() {
+        if (this.layoutChangeUnsubscribe) {
+            this.layoutChangeUnsubscribe();
+            this.layoutChangeUnsubscribe = null;
+        }
+        this.rootElement.innerHTML = "";
+        this.cellElements.clear();
+        this.cellNotationViews.clear();
+    }
+}
+exports.default = NotebookView;
+//# sourceMappingURL=NotebookView.js.map

package/lib/cjs/web/components/NotebookView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotebookView.js","sourceRoot":"","sources":["../../../../src/web/components/NotebookView.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * NotebookView - Main container for notebook-style notation editing.\n *\n * The NotebookView owns a shared GridLayoutGroup and manages a collection\n * of cells, each representing a Block from the notation.\n */\n\nimport { load } from \"../../loader\";\nimport { NotationView } from \"../../carnatic\";\nimport { GridLayoutGroup } from \"../../grids\";\nimport { Notation } from \"../../notation\";\nimport { isBlock, isLine, isRawBlock, Block, RawBlock } from \"../../block\";\nimport { NotebookConfig, CellModel, CellOperations, LayoutChangeEvent } from \"../types/notebook\";\nimport {\n  createCellModels,\n  findCellById,\n  findCellIndex,\n  flattenCells,\n  getVisibleCells,\n  updateCellState,\n} from \"../utils/cellFactory\";\n\n/**\n * Default configuration for NotebookView.\n */\nconst DEFAULT_CONFIG: NotebookConfig = {\n  maxDepth: 1,\n  enableReordering: false,\n  enableAddCell: true,\n  enableDeleteCell: true,\n};\n\n/**\n * NotebookView manages a notebook-style view of notation with editable cells.\n *\n * Features:\n * - Shared GridLayoutGroup for column alignment across all cells\n * - Cell-based editing with preview/edit modes\n * - Support for nested blocks up to configurable depth\n * - Optional cell reordering, adding, and deleting\n */\nexport default class NotebookView implements CellOperations {\n  /** The root HTML element */\n  readonly rootElement: HTMLDivElement;\n\n  /** Configuration options */\n  readonly config: NotebookConfig;\n\n  /** Shared grid layout group for column alignment */\n  readonly gridLayoutGroup: GridLayoutGroup;\n\n  /** The current notation */\n  private notation: Notation | null = null;\n\n  /** The full notation source */\n  private notationSource: string = \"\";\n\n  /** Cell models representing the notebook structure */\n  private cells: CellModel[] = [];\n\n  /** Map of cell ID to its rendered container element */\n  private cellElements = new Map<string, HTMLElement>();\n\n  /** Map of cell ID to its NotationView (for notation cells) */\n  private cellNotationViews = new Map<string, NotationView>();\n\n  /** Unsubscribe function for layout change listener */\n  private layoutChangeUnsubscribe: (() => void) | null = null;\n\n  /**\n   * Creates a new NotebookView.\n   *\n   * @param container The container element to render into\n   * @param config Configuration options\n   */\n  constructor(container: HTMLElement, config: Partial<NotebookConfig> = {}) {\n    this.config = { ...DEFAULT_CONFIG, ...config };\n\n    // Create root element\n    this.rootElement = document.createElement(\"div\");\n    this.rootElement.className = \"notebook-view\";\n    if (this.config.cssClasses?.root) {\n      this.rootElement.className += \" \" + this.config.cssClasses.root;\n    }\n    container.appendChild(this.rootElement);\n\n    // Create or use shared grid layout group\n    this.gridLayoutGroup = this.config.sharedGridLayoutGroup ?? new GridLayoutGroup();\n\n    // Subscribe to layout changes\n    this.layoutChangeUnsubscribe = this.gridLayoutGroup.onLayoutChange((event) => {\n      this.handleLayoutChange(event);\n    });\n  }\n\n  /**\n   * Loads notation from source text.\n   *\n   * @param source The notation source text\n   */\n  loadNotation(source: string): void {\n    this.notationSource = source;\n\n    // Parse the notation\n    const [notation, beatLayout, errors] = load(source, { log: false });\n\n    if (errors.length > 0) {\n      console.error(\"Notation parse errors:\", errors);\n      // TODO: Show errors in UI\n      return;\n    }\n\n    this.notation = notation;\n\n    // Create cell models from the notation\n    this.cells = createCellModels(notation, {\n      maxDepth: this.config.maxDepth,\n      notationSource: source,\n      includeLines: true,\n      includeRawBlocks: true,\n    });\n\n    // Render all cells\n    this.render();\n  }\n\n  /**\n   * Gets the current notation.\n   */\n  getNotation(): Notation | null {\n    return this.notation;\n  }\n\n  /**\n   * Gets all cell models.\n   */\n  getCells(): CellModel[] {\n    return this.cells;\n  }\n\n  /**\n   * Gets visible cells (respecting expanded state).\n   */\n  getVisibleCells(): CellModel[] {\n    return getVisibleCells(this.cells);\n  }\n\n  /**\n   * Gets a cell by ID.\n   */\n  getCell(cellId: string): CellModel | null {\n    return findCellById(this.cells, cellId);\n  }\n\n  /**\n   * Renders the notebook.\n   */\n  private render(): void {\n    // Clear existing content\n    this.rootElement.innerHTML = \"\";\n    this.cellElements.clear();\n    this.cellNotationViews.clear();\n\n    // Render each top-level cell\n    for (let i = 0; i < this.cells.length; i++) {\n      const cell = this.cells[i];\n      this.renderCell(cell, this.rootElement);\n\n      // Add \"add cell\" button between cells if enabled\n      if (this.config.enableAddCell && i < this.cells.length - 1) {\n        this.renderAddCellButton(this.rootElement, i + 1);\n      }\n    }\n\n    // Add final \"add cell\" button if enabled\n    if (this.config.enableAddCell) {\n      this.renderAddCellButton(this.rootElement, this.cells.length);\n    }\n  }\n\n  /**\n   * Renders a single cell.\n   */\n  private renderCell(cell: CellModel, parent: HTMLElement): void {\n    const cellClass = this.config.cssClasses?.cell || \"\";\n    const container = document.createElement(\"div\");\n    container.className = `notebook-cell notebook-cell-${cell.state.type} ${cellClass}`;\n    container.dataset.cellId = cell.state.id;\n    container.dataset.depth = String(cell.state.depth);\n\n    // Render cell header\n    this.renderCellHeader(cell, container);\n\n    // Render cell content\n    const contentContainer = document.createElement(\"div\");\n    contentContainer.className = \"notebook-cell-content\";\n    if (this.config.cssClasses?.cellContent) {\n      contentContainer.className += \" \" + this.config.cssClasses.cellContent;\n    }\n    container.appendChild(contentContainer);\n\n    if (cell.state.isEditing) {\n      this.renderCellEditMode(cell, contentContainer);\n    } else {\n      this.renderCellPreviewMode(cell, contentContainer);\n    }\n\n    // Store reference\n    this.cellElements.set(cell.state.id, container);\n    parent.appendChild(container);\n\n    // Render children if expanded\n    if (cell.state.isExpanded && cell.children.length > 0) {\n      const childrenContainer = document.createElement(\"div\");\n      childrenContainer.className = \"notebook-cell-children\";\n      container.appendChild(childrenContainer);\n\n      for (const child of cell.children) {\n        this.renderCell(child, childrenContainer);\n      }\n    }\n  }\n\n  /**\n   * Renders the cell header with type badge, name, and controls.\n   */\n  private renderCellHeader(cell: CellModel, container: HTMLElement): void {\n    const headerClass = this.config.cssClasses?.cellHeader || \"\";\n    const header = document.createElement(\"div\");\n    header.className = `notebook-cell-header ${headerClass}`;\n\n    // Type badge\n    const badge = document.createElement(\"span\");\n    badge.className = `notebook-cell-badge badge-${cell.state.type}`;\n    badge.textContent = cell.state.type;\n    header.appendChild(badge);\n\n    // Name (if block has a name)\n    if (isBlock(cell.blockItem)) {\n      const block = cell.blockItem as Block;\n      if (block.name) {\n        const name = document.createElement(\"span\");\n        name.className = \"notebook-cell-name\";\n        name.textContent = block.name;\n        header.appendChild(name);\n      }\n    }\n\n    // Expand/collapse button for cells with children\n    if (cell.children.length > 0) {\n      const expandBtn = document.createElement(\"button\");\n      expandBtn.className = \"notebook-btn notebook-expand-btn\";\n      expandBtn.textContent = cell.state.isExpanded ? \"▼\" : \"▶\";\n      expandBtn.title = cell.state.isExpanded ? \"Collapse\" : \"Expand\";\n      expandBtn.addEventListener(\"click\", () => this.toggleExpanded(cell.state.id));\n      header.appendChild(expandBtn);\n    }\n\n    // Controls container\n    const controlsClass = this.config.cssClasses?.cellControls || \"\";\n    const controls = document.createElement(\"div\");\n    controls.className = `notebook-cell-controls ${controlsClass}`;\n\n    // Edit button\n    const editBtn = document.createElement(\"button\");\n    editBtn.className = \"notebook-btn notebook-edit-btn\";\n    editBtn.textContent = cell.state.isEditing ? \"Cancel\" : \"Edit\";\n    editBtn.addEventListener(\"click\", () => {\n      if (cell.state.isEditing) {\n        this.cancelEdit(cell.state.id);\n      } else {\n        this.startEdit(cell.state.id);\n      }\n    });\n    controls.appendChild(editBtn);\n\n    // Delete button (if enabled)\n    if (this.config.enableDeleteCell) {\n      const deleteBtn = document.createElement(\"button\");\n      deleteBtn.className = \"notebook-btn notebook-delete-btn\";\n      deleteBtn.textContent = \"Delete\";\n      deleteBtn.addEventListener(\"click\", () => this.deleteCell(cell.state.id));\n      controls.appendChild(deleteBtn);\n    }\n\n    header.appendChild(controls);\n    container.appendChild(header);\n\n    // Error message (if any)\n    if (cell.state.hasError && cell.state.errorMessage) {\n      const errorClass = this.config.cssClasses?.errorMessage || \"\";\n      const errorDiv = document.createElement(\"div\");\n      errorDiv.className = `notebook-cell-error ${errorClass}`;\n      errorDiv.textContent = cell.state.errorMessage;\n      container.appendChild(errorDiv);\n    }\n  }\n\n  /**\n   * Renders cell content in preview mode.\n   */\n  private renderCellPreviewMode(cell: CellModel, container: HTMLElement): void {\n    if (isRawBlock(cell.blockItem)) {\n      // Render RawBlock content (markdown or plain text)\n      const rawBlock = cell.blockItem as RawBlock;\n      const content = document.createElement(\"div\");\n      content.className = \"notebook-rawblock-content\";\n\n      if (this.config.markdownParser && rawBlock.contentType === \"md\") {\n        content.innerHTML = this.config.markdownParser(rawBlock.content);\n      } else {\n        content.textContent = rawBlock.content;\n      }\n      container.appendChild(content);\n    } else if (isLine(cell.blockItem) || isBlock(cell.blockItem)) {\n      // Render notation content using NotationView\n      const viewContainer = document.createElement(\"div\");\n      viewContainer.className = \"notebook-notation-view\";\n      container.appendChild(viewContainer);\n\n      // Create NotationView sharing the grid layout group\n      const notationView = new NotationView(viewContainer, {\n        sharedGridLayoutGroup: this.gridLayoutGroup,\n        markdownParser: this.config.markdownParser,\n      });\n\n      this.cellNotationViews.set(cell.state.id, notationView);\n\n      // For now, render placeholder - full implementation would need\n      // to create a mini-notation from just this cell's content\n      // This is a simplified version that shows the cell exists\n      const placeholder = document.createElement(\"div\");\n      placeholder.className = \"notebook-notation-placeholder\";\n      placeholder.textContent = `[${cell.state.type} notation content]`;\n      viewContainer.appendChild(placeholder);\n    }\n  }\n\n  /**\n   * Renders cell content in edit mode.\n   */\n  private renderCellEditMode(cell: CellModel, container: HTMLElement): void {\n    const textareaClass = this.config.cssClasses?.editTextarea || \"\";\n    const textarea = document.createElement(\"textarea\");\n    textarea.className = `notebook-edit-textarea ${textareaClass}`;\n    textarea.value = cell.source;\n    textarea.rows = Math.max(3, cell.source.split(\"\\n\").length);\n    container.appendChild(textarea);\n\n    // Apply/Cancel buttons\n    const actions = document.createElement(\"div\");\n    actions.className = \"notebook-edit-actions\";\n\n    const applyBtn = document.createElement(\"button\");\n    applyBtn.className = \"notebook-btn notebook-apply-btn\";\n    applyBtn.textContent = \"Apply\";\n    applyBtn.addEventListener(\"click\", () => {\n      this.applyEdit(cell.state.id, textarea.value);\n    });\n    actions.appendChild(applyBtn);\n\n    const cancelBtn = document.createElement(\"button\");\n    cancelBtn.className = \"notebook-btn notebook-cancel-btn\";\n    cancelBtn.textContent = \"Cancel\";\n    cancelBtn.addEventListener(\"click\", () => this.cancelEdit(cell.state.id));\n    actions.appendChild(cancelBtn);\n\n    container.appendChild(actions);\n  }\n\n  /**\n   * Renders an \"add cell\" button.\n   */\n  private renderAddCellButton(parent: HTMLElement, insertIndex: number): void {\n    const btnClass = this.config.cssClasses?.addCellButton || \"\";\n    const btn = document.createElement(\"button\");\n    btn.className = `notebook-add-cell-btn ${btnClass}`;\n    btn.textContent = \"+ Add Cell\";\n    btn.addEventListener(\"click\", () => {\n      const newCell = this.insertCell(insertIndex, \"\");\n      this.startEdit(newCell.state.id);\n    });\n    parent.appendChild(btn);\n  }\n\n  /**\n   * Handles layout change events from the shared GridLayoutGroup.\n   */\n  private handleLayoutChange(event: LayoutChangeEvent): void {\n    // Notify external listener if configured\n    if (this.config.onLayoutChange) {\n      this.config.onLayoutChange(event);\n    }\n\n    // If dimensions didn't change, no need to update views\n    if (!event.columnWidthsChanged && !event.rowHeightsChanged) {\n      return;\n    }\n\n    // TODO: Implement incremental re-render based on affected range\n    // For now, this is a placeholder for future optimization\n  }\n\n  // ============================================\n  // CellOperations implementation\n  // ============================================\n\n  /**\n   * Enters edit mode for a cell.\n   */\n  startEdit(cellId: string): void {\n    const cell = findCellById(this.cells, cellId);\n    if (!cell) return;\n\n    // Update cell state\n    const updatedCell = updateCellState(cell, { isEditing: true });\n    this.replaceCellInTree(cell, updatedCell);\n\n    // Re-render the cell\n    this.rerenderCell(updatedCell);\n  }\n\n  /**\n   * Applies edit and exits edit mode.\n   */\n  applyEdit(cellId: string, newSource: string): void {\n    const cell = findCellById(this.cells, cellId);\n    if (!cell) return;\n\n    // TODO: Parse newSource and update the block\n    // For now, just update the source and exit edit mode\n    const updatedCell: CellModel = {\n      ...cell,\n      source: newSource,\n      state: {\n        ...cell.state,\n        isEditing: false,\n        hasError: false,\n        errorMessage: undefined,\n      },\n    };\n\n    this.replaceCellInTree(cell, updatedCell);\n    this.rerenderCell(updatedCell);\n\n    // Notify change listener\n    if (this.config.onNotationChange) {\n      // TODO: Serialize cells back to source\n      this.config.onNotationChange(this.notationSource, this.notation);\n    }\n  }\n\n  /**\n   * Cancels edit mode without applying changes.\n   */\n  cancelEdit(cellId: string): void {\n    const cell = findCellById(this.cells, cellId);\n    if (!cell) return;\n\n    const updatedCell = updateCellState(cell, { isEditing: false });\n    this.replaceCellInTree(cell, updatedCell);\n    this.rerenderCell(updatedCell);\n  }\n\n  /**\n   * Deletes a cell.\n   */\n  deleteCell(cellId: string): void {\n    const cell = findCellById(this.cells, cellId);\n    if (!cell) return;\n\n    // Remove from parent's children or top-level cells\n    if (cell.parent) {\n      const index = cell.parent.children.indexOf(cell);\n      if (index >= 0) {\n        cell.parent.children.splice(index, 1);\n      }\n    } else {\n      const index = this.cells.indexOf(cell);\n      if (index >= 0) {\n        this.cells.splice(index, 1);\n      }\n    }\n\n    // Remove DOM element\n    const element = this.cellElements.get(cellId);\n    if (element) {\n      element.remove();\n      this.cellElements.delete(cellId);\n    }\n\n    // Clean up NotationView\n    this.cellNotationViews.delete(cellId);\n  }\n\n  /**\n   * Moves a cell to a new position.\n   */\n  moveCell(cellId: string, targetIndex: number): void {\n    const cell = findCellById(this.cells, cellId);\n    if (!cell) return;\n\n    // For now, only support moving top-level cells\n    if (cell.parent) {\n      console.warn(\"Moving nested cells not yet supported\");\n      return;\n    }\n\n    const currentIndex = this.cells.indexOf(cell);\n    if (currentIndex < 0 || currentIndex === targetIndex) return;\n\n    // Remove and reinsert\n    this.cells.splice(currentIndex, 1);\n    this.cells.splice(targetIndex, 0, cell);\n\n    // Re-render\n    this.render();\n  }\n\n  /**\n   * Inserts a new cell at the given index.\n   */\n  insertCell(index: number, source: string): CellModel {\n    // Create a new RawBlock for the cell\n    const rawBlock = new RawBlock(source, \"notation\");\n\n    // Create cell model\n    const cell: CellModel = {\n      blockItem: rawBlock,\n      state: {\n        id: `cell-${Date.now()}`,\n        type: \"rawblock\",\n        depth: 0,\n        isExpanded: true,\n        isEditing: false,\n        hasError: false,\n      },\n      source,\n      children: [],\n      parent: null,\n    };\n\n    // Insert at index\n    this.cells.splice(index, 0, cell);\n\n    // Re-render\n    this.render();\n\n    return cell;\n  }\n\n  /**\n   * Toggles expanded state for a cell with children.\n   */\n  toggleExpanded(cellId: string): void {\n    const cell = findCellById(this.cells, cellId);\n    if (!cell) return;\n\n    const updatedCell = updateCellState(cell, {\n      isExpanded: !cell.state.isExpanded,\n    });\n    this.replaceCellInTree(cell, updatedCell);\n    this.rerenderCell(updatedCell);\n  }\n\n  // ============================================\n  // Helper methods\n  // ============================================\n\n  /**\n   * Replaces a cell in the tree with an updated version.\n   */\n  private replaceCellInTree(oldCell: CellModel, newCell: CellModel): void {\n    if (oldCell.parent) {\n      const index = oldCell.parent.children.indexOf(oldCell);\n      if (index >= 0) {\n        oldCell.parent.children[index] = newCell;\n        newCell.parent = oldCell.parent;\n      }\n    } else {\n      const index = this.cells.indexOf(oldCell);\n      if (index >= 0) {\n        this.cells[index] = newCell;\n      }\n    }\n  }\n\n  /**\n   * Re-renders a single cell (and its children).\n   */\n  private rerenderCell(cell: CellModel): void {\n    const element = this.cellElements.get(cell.state.id);\n    if (!element || !element.parentElement) return;\n\n    const parent = element.parentElement;\n    const nextSibling = element.nextSibling;\n\n    // Remove old element\n    element.remove();\n    this.cellElements.delete(cell.state.id);\n    this.cellNotationViews.delete(cell.state.id);\n\n    // Create new element\n    const tempContainer = document.createElement(\"div\");\n    this.renderCell(cell, tempContainer);\n\n    // Insert at same position\n    const newElement = tempContainer.firstChild as HTMLElement;\n    if (nextSibling) {\n      parent.insertBefore(newElement, nextSibling);\n    } else {\n      parent.appendChild(newElement);\n    }\n  }\n\n  /**\n   * Cleans up resources when the view is destroyed.\n   */\n  destroy(): void {\n    // Unsubscribe from layout changes\n    if (this.layoutChangeUnsubscribe) {\n      this.layoutChangeUnsubscribe();\n      this.layoutChangeUnsubscribe = null;\n    }\n\n    // Clear DOM\n    this.rootElement.innerHTML = \"\";\n    this.cellElements.clear();\n    this.cellNotationViews.clear();\n  }\n}\n"]}

package/lib/cjs/web/components/SideBySideEditor.d.ts

@@ -0,0 +1,47 @@
+import { NotationView } from "../../carnatic";
+import { GridLayoutGroup } from "../../grids";
+import { Notation } from "../../notation";
+import { GlobalBeatLayout } from "../../beats";
+export interface SideBySideEditorConfig {
+    initialSource?: string;
+    debounceDelay?: number;
+    syncScroll?: boolean;
+    onSourceChange?: (source: string) => void;
+    onNotationParsed?: (notation: Notation, beatLayout: GlobalBeatLayout) => void;
+    onParseError?: (errors: any[]) => void;
+    sharedGridLayoutGroup?: GridLayoutGroup;
+    markdownParser?: (content: string) => string;
+    editorClass?: string;
+    outputClass?: string;
+}
+export default class SideBySideEditor {
+    readonly editorElement: HTMLTextAreaElement;
+    readonly outputElement: HTMLDivElement;
+    readonly notationView: NotationView;
+    readonly config: SideBySideEditorConfig;
+    private notation;
+    private beatLayout;
+    private debounceTimer;
+    private isScrollSyncing;
+    constructor(config?: SideBySideEditorConfig);
+    get source(): string;
+    set source(value: string);
+    getNotation(): Notation | null;
+    getBeatLayout(): GlobalBeatLayout | null;
+    render(): boolean;
+    private setupEventListeners;
+    private syncScrollToOutput;
+    private syncScrollToEditor;
+    scrollToTop(): void;
+    scrollToBottom(): void;
+    scrollToLine(lineNumber: number): void;
+    focus(): void;
+    insertAtCursor(text: string): void;
+    getSelection(): {
+        start: number;
+        end: number;
+        text: string;
+    };
+    setSelection(start: number, end: number): void;
+    destroy(): void;
+}

package/lib/cjs/web/components/SideBySideEditor.js

@@ -0,0 +1,171 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const loader_1 = require("../../loader");
+const carnatic_1 = require("../../carnatic");
+const DEFAULT_CONFIG = {
+    debounceDelay: 300,
+    syncScroll: true,
+};
+class SideBySideEditor {
+    constructor(config = {}) {
+        this.notation = null;
+        this.beatLayout = null;
+        this.debounceTimer = null;
+        this.isScrollSyncing = false;
+        this.config = Object.assign(Object.assign({}, DEFAULT_CONFIG), config);
+        this.editorElement = document.createElement("textarea");
+        this.editorElement.className = "side-by-side-editor";
+        if (this.config.editorClass) {
+            this.editorElement.className += " " + this.config.editorClass;
+        }
+        this.editorElement.spellcheck = false;
+        this.editorElement.placeholder = "Enter notation source...";
+        if (this.config.initialSource) {
+            this.editorElement.value = this.config.initialSource;
+        }
+        this.outputElement = document.createElement("div");
+        this.outputElement.className = "side-by-side-output";
+        if (this.config.outputClass) {
+            this.outputElement.className += " " + this.config.outputClass;
+        }
+        this.notationView = new carnatic_1.NotationView(this.outputElement, {
+            sharedGridLayoutGroup: this.config.sharedGridLayoutGroup,
+            markdownParser: this.config.markdownParser,
+        });
+        this.setupEventListeners();
+        if (this.config.initialSource) {
+            this.render();
+        }
+    }
+    get source() {
+        return this.editorElement.value;
+    }
+    set source(value) {
+        this.editorElement.value = value;
+        this.render();
+    }
+    getNotation() {
+        return this.notation;
+    }
+    getBeatLayout() {
+        return this.beatLayout;
+    }
+    render() {
+        var _a, _b, _c, _d;
+        const source = this.editorElement.value;
+        this.notationView.clear();
+        const [notation, beatLayout, errors] = (0, loader_1.load)(source, { log: false });
+        if (errors.length > 0) {
+            this.notation = null;
+            this.beatLayout = null;
+            (_b = (_a = this.config).onParseError) === null || _b === void 0 ? void 0 : _b.call(_a, errors);
+            return false;
+        }
+        this.notation = notation;
+        this.beatLayout = beatLayout;
+        this.notationView.renderNotation(notation, beatLayout);
+        (_d = (_c = this.config).onNotationParsed) === null || _d === void 0 ? void 0 : _d.call(_c, notation, beatLayout);
+        return true;
+    }
+    setupEventListeners() {
+        this.editorElement.addEventListener("input", () => {
+            var _a, _b;
+            (_b = (_a = this.config).onSourceChange) === null || _b === void 0 ? void 0 : _b.call(_a, this.editorElement.value);
+            if (this.config.debounceDelay && this.config.debounceDelay > 0) {
+                if (this.debounceTimer) {
+                    clearTimeout(this.debounceTimer);
+                }
+                this.debounceTimer = setTimeout(() => {
+                    this.render();
+                }, this.config.debounceDelay);
+            }
+        });
+        if (this.config.syncScroll) {
+            this.editorElement.addEventListener("scroll", () => {
+                this.syncScrollToOutput();
+            });
+            this.outputElement.addEventListener("scroll", () => {
+                this.syncScrollToEditor();
+            });
+        }
+    }
+    syncScrollToOutput() {
+        if (this.isScrollSyncing)
+            return;
+        this.isScrollSyncing = true;
+        const editor = this.editorElement;
+        const output = this.outputElement;
+        const maxScrollTop = editor.scrollHeight - editor.clientHeight;
+        if (maxScrollTop <= 0) {
+            this.isScrollSyncing = false;
+            return;
+        }
+        const scrollPercent = editor.scrollTop / maxScrollTop;
+        const outputMaxScroll = output.scrollHeight - output.clientHeight;
+        output.scrollTop = scrollPercent * outputMaxScroll;
+        this.isScrollSyncing = false;
+    }
+    syncScrollToEditor() {
+        if (this.isScrollSyncing)
+            return;
+        this.isScrollSyncing = true;
+        const editor = this.editorElement;
+        const output = this.outputElement;
+        const maxScrollTop = output.scrollHeight - output.clientHeight;
+        if (maxScrollTop <= 0) {
+            this.isScrollSyncing = false;
+            return;
+        }
+        const scrollPercent = output.scrollTop / maxScrollTop;
+        const editorMaxScroll = editor.scrollHeight - editor.clientHeight;
+        editor.scrollTop = scrollPercent * editorMaxScroll;
+        this.isScrollSyncing = false;
+    }
+    scrollToTop() {
+        this.editorElement.scrollTop = 0;
+        this.outputElement.scrollTop = 0;
+    }
+    scrollToBottom() {
+        this.editorElement.scrollTop = this.editorElement.scrollHeight;
+        this.outputElement.scrollTop = this.outputElement.scrollHeight;
+    }
+    scrollToLine(lineNumber) {
+        const lines = this.editorElement.value.split("\n");
+        const lineHeight = this.editorElement.scrollHeight / lines.length;
+        this.editorElement.scrollTop = (lineNumber - 1) * lineHeight;
+        this.syncScrollToOutput();
+    }
+    focus() {
+        this.editorElement.focus();
+    }
+    insertAtCursor(text) {
+        var _a, _b;
+        const start = this.editorElement.selectionStart;
+        const end = this.editorElement.selectionEnd;
+        const value = this.editorElement.value;
+        this.editorElement.value = value.substring(0, start) + text + value.substring(end);
+        this.editorElement.selectionStart = start + text.length;
+        this.editorElement.selectionEnd = start + text.length;
+        (_b = (_a = this.config).onSourceChange) === null || _b === void 0 ? void 0 : _b.call(_a, this.editorElement.value);
+    }
+    getSelection() {
+        return {
+            start: this.editorElement.selectionStart,
+            end: this.editorElement.selectionEnd,
+            text: this.editorElement.value.substring(this.editorElement.selectionStart, this.editorElement.selectionEnd),
+        };
+    }
+    setSelection(start, end) {
+        this.editorElement.selectionStart = start;
+        this.editorElement.selectionEnd = end;
+    }
+    destroy() {
+        if (this.debounceTimer) {
+            clearTimeout(this.debounceTimer);
+        }
+        this.editorElement.remove();
+        this.outputElement.remove();
+    }
+}
+exports.default = SideBySideEditor;
+//# sourceMappingURL=SideBySideEditor.js.map