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
37 lines (36 loc) • 1.88 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 u = Object.defineProperty;
var b = (n, e, t) => e in n ? u(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
var a = (n, e, t) => b(n, typeof e != "symbol" ? e + "" : e, t);
import { createContainer as r, createForm as C, createLabel as p, createInputField as f, createTextarea as x } from "../../../utils/helpers.mjs";
class y {
constructor(e, t, i) {
a(this, "editor");
a(this, "element");
a(this, "onSubmit");
a(this, "template");
this.editor = e, this.element = r(), this.onSubmit = t, this.template = i, this.initialize();
}
initialize() {
var d, c;
const e = C("space-y-4"), t = r(), i = p(this.editor.t("Name"));
i.className = "block text-sm font-medium text-gray-700";
const m = f("text", "Template Name", ((d = this.template) == null ? void 0 : d.name) || "");
m.className = "template-name mt-1 block w-full rounded-md border-gray-300 shadow-sm", m.required = !0, t.appendChild(i), t.appendChild(m);
const l = r(), s = p(this.editor.t("Content"));
s.className = "block text-sm font-medium text-gray-700";
const o = x(this.editor.t("Content"), ((c = this.template) == null ? void 0 : c.content) || "");
o.className = "template-content mt-1 block w-full rounded-md border-gray-300 shadow-sm h-40", o.required = !0, l.appendChild(s), l.appendChild(o), e.appendChild(t), e.appendChild(l), e.addEventListener("submit", (h) => {
h.preventDefault(), this.onSubmit({
name: m.value,
content: o.value
});
}), this.element.appendChild(e);
}
getElement() {
return this.element;
}
}
export {
y as TemplateForm
};