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
68 lines (67 loc) • 2.72 kB
JavaScript
var o = Object.defineProperty;
var l = (i, t, e) => t in i ? o(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
var n = (i, t, e) => l(i, typeof t != "symbol" ? t + "" : t, e);
import { PopupManager as c } from "../../../core/ui/PopupManager.mjs";
import { createContainer as a, createTextarea as r, createP as h, createButton as u } from "../../../utils/helpers.mjs";
class x {
constructor(t) {
n(this, "editor");
n(this, "popup");
n(this, "callback", null);
// Ссылки на элементы
n(this, "textarea", null);
n(this, "deleteButton", null);
this.editor = t, this.popup = new c(t, {
title: t.t("Insert Comment"),
className: "comment-menu",
closeOnClickOutside: !0,
buttons: [
{
label: t.t("Cancel"),
variant: "secondary",
onClick: () => this.popup.hide()
},
{
label: t.t("Save"),
variant: "primary",
onClick: () => this.handleSubmit()
}
],
items: [
{
type: "custom",
id: "comment-content",
content: () => this.createContent()
}
]
});
}
createContent() {
const t = a("p-4");
this.textarea = r("Add your comment..."), this.textarea.className = "comment-content w-full h-32 p-2 border rounded-lg resize-none focus:outline-none focus:ring-2 focus:ring-blue-500";
const e = a("flex justify-between items-center mt-4"), s = h(
"text-sm text-gray-500",
this.editor.t("Use comments to provide feedback or suggestions.")
);
return this.deleteButton = u(this.editor.t("Delete Comment"), () => {
this.callback && (this.callback("", "delete"), this.popup.hide());
}), this.deleteButton.className = "delete-comment hidden px-3 py-1.5 text-sm text-red-600 hover:text-red-700 transition-colors", e.appendChild(s), e.appendChild(this.deleteButton), t.appendChild(this.textarea), t.appendChild(e), t;
}
handleSubmit() {
if (this.textarea && this.callback) {
const t = this.textarea.value.trim();
t && (this.callback(t, "save"), this.popup.hide());
}
}
show(t, e = "", s = !1) {
this.callback = t, this.textarea && this.deleteButton && (this.textarea.value = e, this.deleteButton.classList.toggle("hidden", !s), this.popup.show(), this.textarea.focus());
}
destroy() {
this.deleteButton && this.deleteButton.removeEventListener("click", () => {
this.callback && (this.callback("", "delete"), this.popup.hide());
}), this.popup.destroy(), this.editor = null, this.popup = null, this.callback = null, this.textarea = null, this.deleteButton = null;
}
}
export {
x as CommentMenu
};