on-codemerge
Version:
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
3 lines (2 loc) • 3.58 kB
JavaScript
/*! 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 p=Object.defineProperty;var r=(s,t,e)=>t in s?p(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e;var a=(s,t,e)=>r(s,typeof t!="symbol"?t+"":t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../../../core/ui/PopupManager.cjs"),d=require("../commands/InsertLazyTableCommand.cjs"),c=require("../commands/ImportTableFromHTMLCommand.cjs");class u{constructor(t,e,o={}){a(this,"popup",null);a(this,"editor");a(this,"range");a(this,"options");this.editor=t,this.range=e.cloneRange(),this.options=o}show(){let t=this.editor.t("Insert Lazy Table");this.options.isEdit?t=this.editor.t("Edit Lazy Table"):this.options.isFillMode&&(t=this.editor.t("Fill Table with Data")),this.popup=new h.PopupManager(this.editor,{title:t,className:"lazy-table-modal",closeOnClickOutside:!0,items:[{type:"list",id:"import-type",label:this.editor.t("Import Type"),options:["json","csv","html"],value:this.options.format||"json",onChange:e=>this.onImportTypeChange(e)},{type:"input",id:"url",label:this.editor.t("Data URL"),placeholder:"https://example.com/data.json",value:this.options.url||""},{type:"input",id:"selector",label:this.editor.t("CSS Selector (for HTML)"),placeholder:"table, .my-table, #data-table",value:"",className:"html-only-field"},{type:"checkbox",id:"hasHeaders",label:this.editor.t("First row contains headers"),value:this.options.hasHeaders!==!1,className:"json-csv-only-field"},{type:"input",id:"delimiter",label:this.editor.t("CSV Delimiter"),placeholder:",",value:this.options.delimiter||",",className:"csv-only-field"},{type:"input",id:"tableId",label:this.editor.t("Table ID (optional)"),placeholder:"my-data-table",value:this.options.tableId||""}],buttons:[{label:this.editor.t("Cancel"),variant:"secondary",onClick:()=>{var e;return(e=this.popup)==null?void 0:e.hide()}},{label:this.options.isEdit?this.editor.t("Update Table"):this.options.isFillMode?this.editor.t("Fill Table"):this.editor.t("Insert Table"),variant:"primary",onClick:()=>this.insertTable()}]}),this.onImportTypeChange(this.options.format||"json"),this.popup.show()}onImportTypeChange(t){if(!this.popup)return;const e=this.popup.getElement().querySelectorAll(".html-only-field"),o=this.popup.getElement().querySelectorAll(".json-csv-only-field"),n=this.popup.getElement().querySelectorAll(".csv-only-field");e.forEach(l=>{const i=l.closest(".popup-item");i&&(i.style.display=t==="html"?"block":"none")}),o.forEach(l=>{const i=l.closest(".popup-item");i&&(i.style.display=t==="json"||t==="csv"?"block":"none")}),n.forEach(l=>{const i=l.closest(".popup-item");i&&(i.style.display=t==="csv"?"block":"none")})}insertTable(){if(!this.popup)return;const t=this.popup.getValue("import-type"),e=this.popup.getValue("url");if(!e){alert(this.editor.t("Please enter a valid URL"));return}if(t==="html"){const o={url:e,selector:this.popup.getValue("selector"),tableId:this.popup.getValue("tableId")};this.options.onSave?this.options.onSave(o):new c.ImportTableFromHTMLCommand(this.editor,o,this.range).execute()}else{const o={url:e,format:t,hasHeaders:this.popup.getValue("hasHeaders"),delimiter:this.popup.getValue("delimiter"),tableId:this.popup.getValue("tableId")};this.options.onSave?this.options.onSave(o):new d.InsertLazyTableCommand(this.editor,o,this.range).execute()}this.popup.hide()}}exports.LazyTableModal=u;