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) • 1.59 kB
JavaScript
var h = Object.defineProperty;
var m = (i, e, l) => e in i ? h(i, e, { enumerable: !0, configurable: !0, writable: !0, value: l }) : i[e] = l;
var a = (i, e, l) => m(i, typeof e != "symbol" ? e + "" : e, l);
import { TableCell as c } from "./TableCell.mjs";
import { createTh as d } from "../../../utils/helpers.mjs";
class T {
constructor(e) {
a(this, "element");
this.element = document.createElement("table"), this.initialize(e);
}
initialize({ hasHeader: e, rows: l, cols: n }) {
if (this.element.className = "html-editor-table", e) {
const t = this.element.createTHead().insertRow();
for (let o = 0; o < n; o++) {
const s = d();
s.textContent = `Column ${o + 1}`, t.appendChild(s), new c(s);
}
}
const r = this.element.createTBody();
for (let t = 0; t < l; t++) {
const o = r.insertRow();
for (let s = 0; s < n; s++) {
const f = o.insertCell();
f.textContent = `Cell ${t + 1} - ${s + 1}`, new c(f);
}
}
}
getElement() {
return this.element;
}
focusFirstCell() {
const e = this.element.querySelector("th, td");
e instanceof HTMLTableCellElement && new c(e).focus();
}
adjustColumnWidths() {
const e = this.element.rows;
if (e.length === 0) return;
const l = e[0].cells.length;
for (let n = 0; n < l; n++) {
let r = 0;
for (const t of e) {
const o = t.cells[n];
o.offsetWidth > r && (r = o.offsetWidth);
}
for (const t of e)
t.cells[n].style.width = `${r}px`;
}
}
}
export {
T as Table
};