on-codemerge/dist/src/plugins/TablePlugin/index.cjs

A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product

/*! on-codemerge v1.3.1 @author Pavel Kuzmin @license MIT @homepage https://s00d.github.io/on-codemerge/ @repository git+https://github.com/s00d/on-codemerge.git Copyright (c) 2026 Pavel Kuzmin - Built on 2026-07-02T13:39:17.947Z */
"use strict";var C=Object.defineProperty;var p=(c,e,t)=>e in c?C(c,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):c[e]=t;var r=(c,e,t)=>p(c,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css             */;/* empty css              */const f=require("./components/TablePopup.cjs"),S=require("./components/TableContextMenu.cjs"),y=require("./components/TableEditor.cjs"),T=require("./components/CellFormatter.cjs"),v=require("./services/TableExportService.cjs"),g=require("../ToolbarPlugin/utils.cjs"),w=require("../../icons/table.svg.cjs"),E=require("../../utils/Resizer.cjs"),x=require("./commands/ExportTableCommand.cjs"),z=require("./commands/ImportTableCommand.cjs"),q=require("./commands/FormatCellCommand.cjs"),L=require("./commands/ShowTablePropertiesCommand.cjs"),k=require("./commands/SortTableCommand.cjs"),M=require("./commands/ResizeColumnsCommand.cjs"),P=require("./commands/DeleteCellContentCommand.cjs"),R=require("./commands/CopyCellCommand.cjs"),A=require("./commands/PasteCellCommand.cjs"),D=require("./commands/CutCellCommand.cjs"),F=require("./commands/SelectAllCommand.cjs"),m=require("./components/LazyTableModal.cjs"),u=require("./commands/EditLazyTableCommand.cjs");class O{constructor(){r(this,"name","table");r(this,"hotkeys",[{keys:"Ctrl+Shift+T",description:"Insert table",command:"insert-table",icon:"📊"},{keys:"Ctrl+Shift+J",description:"Insert lazy table",command:"insert-lazy-table",icon:"📊⏳"},{keys:"Ctrl+L",description:"Edit lazy table",command:"edit-lazy-table",icon:"🔄"},{keys:"Ctrl+Shift+Z",description:"Import from HTML",command:"import-from-html",icon:"🌐"},{keys:"Ctrl+Shift+E",description:"Export table",command:"export-table",icon:"📤"},{keys:"Ctrl+Shift+I",description:"Import table",command:"import-table",icon:"📥"},{keys:"Alt+Shift+F",description:"Format cells",command:"format-cells",icon:"🎨"},{keys:"Ctrl+Shift+P",description:"Table properties",command:"table-properties",icon:"⚙️"},{keys:"Alt+Shift+S",description:"Sort table",command:"sort-table",icon:"📈"},{keys:"Ctrl+Shift+R",description:"Resize columns",command:"resize-columns",icon:"📏"},{keys:"Delete",description:"Delete selected cells",command:"delete-selected-cells",icon:"🗑️"},{keys:"Backspace",description:"Delete selected cells",command:"delete-selected-cells",icon:"🗑️"},{keys:"Alt+Shift+C",description:"Copy selected cells",command:"copy-selected-cells",icon:"📋"},{keys:"Ctrl+Shift+V",description:"Paste cells",command:"paste-cells",icon:"📋"},{keys:"Ctrl+Shift+X",description:"Cut selected cells",command:"cut-selected-cells",icon:"✂️"},{keys:"Ctrl+Shift+A",description:"Select all cells",command:"select-all-cells",icon:"☑️"}]);r(this,"editor",null);r(this,"popup",null);r(this,"contextMenu",null);r(this,"tableEditor",null);r(this,"cellFormatter",null);r(this,"exportService",null);r(this,"currentResizer",null);r(this,"selectedCells",[]);r(this,"toolbarButton",null);r(this,"handleContextMenu",e=>{var l;const t=e.target.closest(".table-cell, .table-header-cell");if(t instanceof HTMLElement){e.preventDefault();const o=e.clientX,s=e.clientY;(l=this.contextMenu)==null||l.show(t,o,s)}});r(this,"handleClick",e=>{var o,s,i,n;const t=e.target.closest(".html-editor-table");t instanceof HTMLElement&&(e.preventDefault(),(s=(o=this.editor)==null?void 0:o.getSelector())==null||s.saveTable(t));const l=e.target.closest(".table-cell, .table-header-cell");l&&l instanceof HTMLElement&&(e.preventDefault(),(n=(i=this.editor)==null?void 0:i.getSelector())==null||n.selectCell(l),this.currentResizer&&(this.currentResizer.destroy(),this.currentResizer=null),this.currentResizer=new E.Resizer(l,{handleSize:10,handleColor:"blue",onResizeStart:()=>{var a;return(a=this.editor)==null?void 0:a.disableObserver()},onResize:(a,d)=>{l.style.width=`${a}px`,l.style.height=`${d}px`},onResizeEnd:()=>{var a;return(a=this.editor)==null?void 0:a.enableObserver()}}))});r(this,"handleMouseDown",e=>{const t=e.target.closest(".table-cell, .table-header-cell");t&&(e.shiftKey?(e.preventDefault(),this.addToSelection(t)):(this.clearSelection(),this.addToSelection(t)))});r(this,"handleMouseOver",e=>{const t=e.target.closest(".table-cell, .table-header-cell");t&&t.classList.add("hover")});r(this,"handleMouseOut",e=>{const t=e.target.closest(".table-cell, .table-header-cell");t&&t.classList.remove("hover")});r(this,"handleKeydown",e=>{var t,l,o,s;if(e.key==="Delete"){const i=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();i&&(i.remove(),(s=(o=this.editor)==null?void 0:o.getSelector())==null||s.clearTable())}e.target instanceof HTMLElement&&(e.target.classList.contains("table-cell")||e.target.classList.contains("table-header-cell"))&&this.handleTableNavigation(e)})}initialize(e){this.editor=e,this.popup=new f.TablePopup(e),this.contextMenu=new S.TableContextMenu(e),this.tableEditor=new y.TableEditor(e),this.cellFormatter=new T.CellFormatter(e),this.exportService=new v.TableExportService,this.addToolbarButton(),this.setupTableEvents(),this.setupKeyboardShortcuts(),this.editor.on("table",()=>{var l,o;const t=(l=this.editor)==null?void 0:l.saveCursorPosition();(o=this.popup)==null||o.show(s=>{var i;t&&((i=this.editor)==null||i.restoreCursorPosition(t)),this.insertTable(s)})})}addToolbarButton(){var t,l;const e=(t=this.editor)==null?void 0:t.getToolbar();if(e){const o=g.createToolbarButton({icon:w.default,title:(l=this.editor)==null?void 0:l.t("Insert Table"),onClick:()=>{var i,n;const s=(i=this.editor)==null?void 0:i.saveCursorPosition();(n=this.popup)==null||n.show(a=>{var d;s&&((d=this.editor)==null||d.restoreCursorPosition(s)),this.insertTable(a)})}});this.toolbarButton=o,e.appendChild(o)}}setupTableEvents(){if(!this.editor)return;const e=this.editor.getContainer();e&&(e.addEventListener("click",this.handleClick),e.addEventListener("contextmenu",this.handleContextMenu),e.addEventListener("keydown",this.handleKeydown),e.addEventListener("mousedown",this.handleMouseDown),e.addEventListener("mouseover",this.handleMouseOver),e.addEventListener("mouseout",this.handleMouseOut))}setupKeyboardShortcuts(){this.editor&&(this.editor.on("insert-table",()=>{var t,l;const e=(t=this.editor)==null?void 0:t.saveCursorPosition();(l=this.popup)==null||l.show(o=>{var s;e&&((s=this.editor)==null||s.restoreCursorPosition(e)),this.insertTable(o)})}),this.editor.on("insert-lazy-table",()=>{var l,o,s,i;const e=(l=this.editor)==null?void 0:l.saveCursorPosition();e&&((o=this.editor)==null||o.restoreCursorPosition(e));const t=(i=(s=this.editor)==null?void 0:s.getTextFormatter())==null?void 0:i.getSelection();if(t&&t.rangeCount>0){const n=t.getRangeAt(0);new m.LazyTableModal(this.editor,n).show()}}),this.editor.on("edit-lazy-table",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();e&&this.editor&&e.classList.contains("lazy-table")&&new u.EditLazyTableCommand(this.editor,e).execute()}),this.editor.on("import-from-html",()=>{var l,o,s,i;const e=(l=this.editor)==null?void 0:l.saveCursorPosition();e&&((o=this.editor)==null||o.restoreCursorPosition(e));const t=(i=(s=this.editor)==null?void 0:s.getTextFormatter())==null?void 0:i.getSelection();if(t&&t.rangeCount>0){const n=t.getRangeAt(0);new m.LazyTableModal(this.editor,n).show()}}),this.editor.on("export-table",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();e&&this.editor&&new x.ExportTableCommand(this.editor,e).execute()}),this.editor.on("import-table",()=>{this.editor&&new z.ImportTableCommand(this.editor).execute()}),this.editor.on("format-cells",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();if(e&&this.editor){const o=e.querySelectorAll(".table-cell.selected, .table-header-cell.selected");o.length>0&&new q.FormatCellCommand(this.editor,o[0]).execute()}}),this.editor.on("table-properties",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();e&&this.editor&&new L.ShowTablePropertiesCommand(this.editor,e).execute()}),this.editor.on("sort-table",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();e&&this.editor&&new k.SortTableCommand(this.editor,e).execute()}),this.editor.on("resize-columns",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();e&&this.editor&&new M.ResizeColumnsCommand(this.editor,e).execute()}),this.editor.on("delete-selected-cells",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();if(e&&this.editor){const o=e.querySelectorAll(".table-cell.selected, .table-header-cell.selected");o.length>0&&new P.DeleteCellContentCommand(this.editor,o[0]).execute()}}),this.editor.on("copy-selected-cells",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();if(e&&this.editor){const o=e.querySelectorAll(".table-cell.selected, .table-header-cell.selected");o.length>0&&new R.CopyCellCommand(this.editor,o[0]).execute()}}),this.editor.on("paste-cells",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();if(e&&this.editor){const o=e.querySelectorAll(".table-cell.selected, .table-header-cell.selected");o.length>0&&new A.PasteCellCommand(this.editor,o[0]).execute()}}),this.editor.on("cut-selected-cells",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();if(e&&this.editor){const o=e.querySelectorAll(".table-cell.selected, .table-header-cell.selected");o.length>0&&new D.CutCellCommand(this.editor,o[0]).execute()}}),this.editor.on("select-all-cells",()=>{var t,l;const e=(l=(t=this.editor)==null?void 0:t.getSelector())==null?void 0:l.restoreTable();e&&this.editor&&new F.SelectAllCommand(this.editor,e).execute()}))}handleTableNavigation(e){var n,a;const t=e.target;if(!t.closest(".html-editor-table"))return;const o=t.parentElement,s=Array.from(o.querySelectorAll(".table-cell, .table-header-cell")).indexOf(t);let i=null;switch(e.key){case"ArrowUp":o.previousElementSibling&&(i=o.previousElementSibling.querySelectorAll(".table-cell, .table-header-cell")[s]||null);break;case"ArrowDown":o.nextElementSibling&&(i=o.nextElementSibling.querySelectorAll(".table-cell, .table-header-cell")[s]||null);break;case"ArrowLeft":i=o.querySelectorAll(".table-cell, .table-header-cell")[s-1]||null;break;case"ArrowRight":i=o.querySelectorAll(".table-cell, .table-header-cell")[s+1]||null;break;case"Tab":e.preventDefault(),e.shiftKey?i=o.querySelectorAll(".table-cell, .table-header-cell")[s-1]||null:i=o.querySelectorAll(".table-cell, .table-header-cell")[s+1]||null;break}i&&(e.preventDefault(),i.focus(),(a=(n=this.editor)==null?void 0:n.getSelector())==null||a.selectCell(i))}addToSelection(e){this.selectedCells.includes(e)||(this.selectedCells.push(e),e.classList.add("selected"))}clearSelection(){this.selectedCells.forEach(e=>e.classList.remove("selected")),this.selectedCells=[]}insertTable(e){var l;if(!this.editor)return;const t=document.createElement("div");if(t.className="html-editor-table table-modern",e.hasHeader){const o=document.createElement("div");o.className="table-header-row";for(let s=0;s<e.cols;s++){const i=document.createElement("div");i.className="table-header-cell",i.textContent=`Header ${s+1}`,i.contentEditable="true",o.appendChild(i)}t.appendChild(o)}for(let o=0;o<e.rows;o++){const s=document.createElement("div");s.className="table-row";for(let i=0;i<e.cols;i++){const n=document.createElement("div");n.className="table-cell",n.textContent=`Cell ${o+1}-${i+1}`,n.contentEditable="true",s.appendChild(n)}t.appendChild(s)}this.editor.insertContent(t),(l=this.editor.getSelector())==null||l.saveTable(t)}destroy(){var t;if(!this.editor)return;this.toolbarButton&&(this.toolbarButton.remove(),this.toolbarButton=null);const e=this.editor.getContainer();e&&(e.removeEventListener("click",this.handleClick),e.removeEventListener("contextmenu",this.handleContextMenu),e.removeEventListener("keydown",this.handleKeydown),e.removeEventListener("mousedown",this.handleMouseDown),e.removeEventListener("mouseover",this.handleMouseOver),e.removeEventListener("mouseout",this.handleMouseOut)),this.popup&&(this.popup.destroy(),this.popup=null),this.contextMenu&&(this.contextMenu.destroy(),this.contextMenu=null),this.tableEditor&&(this.tableEditor.destroy(),this.tableEditor=null),this.cellFormatter&&(this.cellFormatter.destroy(),this.cellFormatter=null),this.currentResizer&&(this.currentResizer.destroy(),this.currentResizer=null),this.exportService&&(this.exportService=null),this.editor.off("table"),(t=this.editor.getSelector())==null||t.clearTable(),this.editor=null,this.selectedCells=[]}}exports.LazyTableModal=m.LazyTableModal;exports.EditLazyTableCommand=u.EditLazyTableCommand;exports.TablePlugin=O;