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
80 lines (79 loc) • 2.2 kB
JavaScript
var n = Object.defineProperty;
var a = (o, t, e) => t in o ? n(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e;
var i = (o, t, e) => a(o, typeof t != "symbol" ? t + "" : t, e);
import { ContextMenu as l } from "../../../core/ui/ContextMenu.mjs";
import r from "../../../icons/copy.svg.mjs";
import s from "../../../icons/delete.svg.mjs";
import h from "../../../icons/edit.svg.mjs";
import d from "../../../icons/format.svg.mjs";
class f {
constructor(t, e) {
i(this, "contextMenu");
i(this, "activeBlock", null);
this.onEdit = e, this.contextMenu = new l(
t,
[
{
title: t.t("Edit"),
icon: h,
action: "edit",
onClick: () => this.handleAction("edit")
},
{
title: t.t("Copy"),
icon: r,
action: "copy",
onClick: () => this.handleAction("copy")
},
{
title: t.t("Format"),
icon: d,
action: "format",
onClick: () => this.handleAction("format")
},
{
type: "divider"
},
{
title: t.t("Remove"),
icon: s,
action: "remove",
className: "text-red-600",
onClick: () => this.handleAction("remove")
}
],
{ orientation: "vertical" }
// Ориентация меню (вертикальная)
);
}
handleAction(t) {
if (this.activeBlock)
switch (t) {
case "edit":
this.onEdit(this.activeBlock);
break;
case "copy":
const e = this.activeBlock.querySelector("code");
e && navigator.clipboard.writeText(e.textContent || "");
break;
case "format":
this.activeBlock.querySelector("code");
break;
case "remove":
this.activeBlock.remove();
break;
}
}
show(t, e, c) {
this.activeBlock = t, this.contextMenu.show(t, e, c);
}
hide() {
this.contextMenu.hide(), this.activeBlock = null;
}
destroy() {
this.contextMenu.destroy(), this.contextMenu = null, this.activeBlock = null;
}
}
export {
f as CodeBlockContextMenu
};