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) • 2.62 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 y=(s,e,t)=>e in s?p(s,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[e]=t;var i=(s,e,t)=>y(s,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class S{constructor(e,t,l){i(this,"table");i(this,"options");i(this,"previousState");this.table=t,this.options=l,this.previousState={className:this.table.className,styles:new Map,headerStyles:new Map},["width","--cell-padding","border-style","border-width","border-color"].forEach(o=>{const r=this.table.style.getPropertyValue(o);r&&this.previousState.styles.set(o,r)}),this.table.querySelectorAll(".table-header-cell").forEach((o,r)=>{const b=o,d=[];["backgroundColor","color"].forEach(n=>{const c=b.style[n];c&&d.push([n,c])}),this.previousState.headerStyles.set(r.toString(),d)})}execute(){this.table.className="html-editor-table",this.table.style.removeProperty("width"),this.table.style.removeProperty("--cell-padding"),this.table.style.removeProperty("border-style"),this.table.style.removeProperty("border-width"),this.table.style.removeProperty("border-color"),this.options.style&&this.table.classList.add(`table-${this.options.style}`),this.options.theme&&this.table.classList.add(`theme-${this.options.theme}`),this.options.zebraStripe&&this.table.classList.add("table-striped"),this.options.hoverEffect&&this.table.classList.add("table-hover"),this.options.width&&(this.table.style.width=this.options.width),this.options.cellPadding&&this.table.style.setProperty("--cell-padding",this.options.cellPadding),this.options.borderStyle&&(this.table.style.borderStyle=this.options.borderStyle),this.options.borderWidth&&(this.table.style.borderWidth=this.options.borderWidth),this.options.borderColor&&(this.table.style.borderColor=this.options.borderColor),this.table.querySelectorAll(".table-header-cell").forEach(t=>{this.options.headerBackground&&(t.style.backgroundColor=this.options.headerBackground),this.options.headerColor&&(t.style.color=this.options.headerColor)})}undo(){this.table.className=this.previousState.className,this.previousState.styles.forEach((t,l)=>{this.table.style.setProperty(l,t)}),this.table.querySelectorAll(".table-header-cell").forEach((t,l)=>{const a=this.previousState.headerStyles.get(l.toString());if(a){const h=t;a.forEach(([o,r])=>{h.style.setProperty(o,r)})}})}}exports.ApplyTableStyleCommand=S;