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
53 lines (52 loc) • 3.03 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 */
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 l = (s, e, t) => y(s, typeof e != "symbol" ? e + "" : e, t);
class f {
constructor(e, t, i) {
l(this, "table");
l(this, "options");
l(this, "previousState");
this.table = t, this.options = i, this.previousState = {
className: this.table.className,
styles: /* @__PURE__ */ new Map(),
headerStyles: /* @__PURE__ */ 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((c) => {
const n = b.style[c];
n && d.push([c, n]);
}), 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, i) => {
this.table.style.setProperty(i, t);
}), this.table.querySelectorAll(".table-header-cell").forEach((t, i) => {
const a = this.previousState.headerStyles.get(i.toString());
if (a) {
const h = t;
a.forEach(([o, r]) => {
h.style.setProperty(o, r);
});
}
});
}
}
export {
f as ApplyTableStyleCommand
};