md-editor-rt
Version:
Markdown editor for react, developed in jsx and typescript, dark theme、beautify content by prettier、render articles directly、paste or clip the picture and upload it...
1,523 lines • 97.5 kB
JavaScript
var Go = Object.defineProperty;
var Zo = (e, l, a) => l in e ? Go(e, l, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[l] = a;
var J = (e, l, a) => Zo(e, typeof l != "symbol" ? l + "" : l, a);
import { jsx as i, jsxs as T, Fragment as Bo } from "react/jsx-runtime";
import { useContext as j, useMemo as _, useState as V, useEffect as M, useRef as W, useCallback as D, memo as _e, cloneElement as Ko, forwardRef as _o, useImperativeHandle as Xo } from "react";
import { C as Jo, a as Yo, u as Qo, b as ea, c as ta, d as oa, e as aa, f as ra, g as la, h as na } from "./ContentPreview.mjs";
import { b as ia, c as y } from "./index3.mjs";
import { p as t, g as re, a as sa, M as Me, b as ca, d as N } from "./config.mjs";
import { E as z } from "./context.mjs";
import { linkTo as da, draggingScroll as ma, createSmoothScroll as ua } from "@vavt/util";
import { b as g, E as ce, U as We, C as po, O as He, R as A, a as ha, c as Wo, d as Be, e as Ke, f as To, T as $o, S as wo, G as yo } from "./event-name.mjs";
import { D as fe } from "./index4.mjs";
import { M as zo, I as x } from "./index.mjs";
import { a as ba } from "./dom.mjs";
import { s as ga, a as fa, M as va } from "./index2.mjs";
import { EditorView as oe } from "codemirror";
import { placeholder as Ca, EditorView as ze, keymap as ka, drawSelection as pa } from "@codemirror/view";
import { languages as Ta } from "@codemirror/language-data";
import { markdown as $a } from "@codemirror/lang-markdown";
import { EditorState as Oe, EditorSelection as se, Compartment as ae, StateEffect as wa } from "@codemirror/state";
import { deleteLine as ya, defaultKeymap as Na, historyKeymap as xa, indentWithTab as Sa, history as No, undo as Ia, redo as Ea } from "@codemirror/commands";
import { indentUnit as La, syntaxHighlighting as qo, HighlightStyle as Uo } from "@codemirror/language";
import { tags as d } from "@lezer/highlight";
import { autocompletion as Da } from "@codemirror/autocomplete";
import { searchKeymap as Aa } from "@codemirror/search";
const Ma = () => /* @__PURE__ */ i("div", { className: `${t}-divider` }), Ra = (e) => {
var u, h, k, v, c;
const { editorId: l, usedLanguageText: a } = j(z), n = _(() => {
var o, f;
switch (e.type) {
case "link":
return (o = a.linkModalTips) == null ? void 0 : o.linkTitle;
case "image":
return (f = a.linkModalTips) == null ? void 0 : f.imageTitle;
default:
return "";
}
}, [e.type, a]), [s, r] = V({
desc: "",
url: ""
});
return M(() => {
e.visible || setTimeout(() => {
r({
desc: "",
url: ""
});
}, 200);
}, [e.visible]), _(() => {
var o, f, p, w, b;
return /* @__PURE__ */ T(zo, { title: n, visible: e.visible, onClose: e.onCancel, children: [
/* @__PURE__ */ T("div", { className: `${t}-form-item`, children: [
/* @__PURE__ */ i("label", { className: `${t}-label`, htmlFor: `link-desc-${l}`, children: (o = a.linkModalTips) == null ? void 0 : o.descLabel }),
/* @__PURE__ */ i(
"input",
{
placeholder: (f = a.linkModalTips) == null ? void 0 : f.descLabelPlaceHolder,
className: `${t}-input`,
id: `link-desc-${l}`,
type: "text",
value: s.desc,
onChange: (S) => {
r((m) => ({
...m,
desc: S.target.value
}));
}
}
)
] }),
/* @__PURE__ */ T("div", { className: `${t}-form-item`, children: [
/* @__PURE__ */ i("label", { className: `${t}-label`, htmlFor: `link-url-${l}`, children: (p = a.linkModalTips) == null ? void 0 : p.urlLabel }),
/* @__PURE__ */ i(
"input",
{
placeholder: (w = a.linkModalTips) == null ? void 0 : w.urlLabelPlaceHolder,
className: `${t}-input`,
id: `link-url-${l}`,
type: "text",
value: s.url,
onChange: (S) => {
r((m) => ({
...m,
url: S.target.value
}));
}
}
)
] }),
/* @__PURE__ */ i("div", { className: `${t}-form-item`, children: /* @__PURE__ */ i(
"button",
{
className: `${t}-btn ${t}-btn-row`,
type: "button",
onClick: () => {
e.onOk(s), r((S) => ({
...S,
desc: "",
url: ""
}));
},
children: (b = a.linkModalTips) == null ? void 0 : b.buttonOK
}
) })
] });
}, [
n,
e,
l,
(u = a.linkModalTips) == null ? void 0 : u.descLabel,
(h = a.linkModalTips) == null ? void 0 : h.descLabelPlaceHolder,
(k = a.linkModalTips) == null ? void 0 : k.urlLabel,
(v = a.linkModalTips) == null ? void 0 : v.urlLabelPlaceHolder,
(c = a.linkModalTips) == null ? void 0 : c.buttonOK,
s
]);
};
let Y = null;
const Oa = (e) => {
var w, b, S;
const l = j(z), { editorId: a, usedLanguageText: n, rootRef: s } = l, r = re.editorExtensions.cropper.instance, u = W(null), h = W(null), k = W(null), [v, c] = V({
cropperInited: !1,
imgSelected: !1,
imgSrc: "",
// 是否全屏
isFullscreen: !1
});
M(() => {
e.visible && !v.cropperInited && (window.Cropper = r || window.Cropper, u.current.onchange = () => {
if (!window.Cropper) {
g.emit(a, ce, {
name: "Cropper",
message: "Cropper is undefined"
});
return;
}
const m = u.current.files || [];
if ((m == null ? void 0 : m.length) > 0) {
const C = new FileReader();
C.onload = (I) => {
c((L) => ({
...L,
imgSelected: !0,
imgSrc: I.target.result
}));
}, C.readAsDataURL(m[0]);
}
});
}, [e.visible, v.cropperInited, r, a]), M(() => {
var m;
(m = k.current) == null || m.setAttribute("style", "");
}, [v.imgSelected]), M(() => {
var m, C;
Y == null || Y.destroy(), (m = k.current) == null || m.setAttribute("style", ""), h.current && v.imgSrc && (Y = new window.Cropper(h.current, {
viewMode: 2,
preview: ((C = s.current) == null ? void 0 : C.getRootNode()).querySelector(
`.${t}-clip-preview-target`
)
}));
}, [v.imgSrc, v.isFullscreen, s]);
const o = _(() => v.isFullscreen ? {
width: "100%",
height: "100%"
} : {
width: "668px",
height: "392px"
}, [v.isFullscreen]), f = () => {
Y.clear(), Y.destroy(), Y = null, u.current.value = "", c((m) => ({
...m,
imgSrc: "",
imgSelected: !1
}));
}, p = D((m) => {
c((C) => ({
...C,
isFullscreen: m
}));
}, []);
return _(() => {
var m, C, I;
return /* @__PURE__ */ T(
zo,
{
className: `${t}-modal-clip`,
title: (m = n.clipModalTips) == null ? void 0 : m.title,
visible: e.visible,
onClose: e.onCancel,
showAdjust: !0,
isFullscreen: v.isFullscreen,
onAdjust: p,
...o,
children: [
/* @__PURE__ */ T("div", { className: `${t}-form-item ${t}-clip`, children: [
/* @__PURE__ */ i("div", { className: `${t}-clip-main`, children: v.imgSelected ? /* @__PURE__ */ T("div", { className: `${t}-clip-cropper`, children: [
/* @__PURE__ */ i(
"img",
{
src: v.imgSrc,
ref: h,
style: { display: "none" },
alt: ""
}
),
/* @__PURE__ */ i("div", { className: `${t}-clip-delete`, onClick: f, children: /* @__PURE__ */ i(x, { name: "delete" }) })
] }) : /* @__PURE__ */ i(
"div",
{
className: `${t}-clip-upload`,
onClick: () => {
u.current.click();
},
role: "button",
tabIndex: 0,
"aria-label": (C = n.imgTitleItem) == null ? void 0 : C.upload,
children: /* @__PURE__ */ i(x, { name: "upload" })
}
) }),
/* @__PURE__ */ i("div", { className: `${t}-clip-preview`, children: /* @__PURE__ */ i("div", { className: `${t}-clip-preview-target`, ref: k }) })
] }),
/* @__PURE__ */ i("div", { className: `${t}-form-item`, children: /* @__PURE__ */ i(
"button",
{
className: `${t}-btn`,
type: "button",
onClick: () => {
if (Y) {
const L = Y.getCroppedCanvas();
g.emit(
a,
We,
[ia(L.toDataURL("image/png"))],
e.onOk
), f();
}
},
children: (I = n.linkModalTips) == null ? void 0 : I.buttonOK
}
) }),
/* @__PURE__ */ i(
"input",
{
ref: u,
accept: "image/*",
type: "file",
multiple: !1,
style: { display: "none" },
"aria-hidden": "true"
}
)
]
}
);
}, [
(w = n.clipModalTips) == null ? void 0 : w.title,
(b = n.linkModalTips) == null ? void 0 : b.buttonOK,
(S = n.imgTitleItem) == null ? void 0 : S.upload,
e.visible,
e.onCancel,
e.onOk,
v.isFullscreen,
v.imgSelected,
v.imgSrc,
p,
o,
a
]);
}, Fa = (e) => /* @__PURE__ */ T(Bo, { children: [
/* @__PURE__ */ i(
Ra,
{
type: e.type,
visible: e.linkVisible,
onOk: e.onOk,
onCancel: e.onCancel
}
),
/* @__PURE__ */ i(
Oa,
{
visible: e.clipVisible,
onOk: e.onOk,
onCancel: e.onCancel
}
)
] }), Pa = (e) => {
const [l, a] = V({
x: -1,
y: -1
}), n = _(() => JSON.stringify(e.tableShape), [e.tableShape]), s = D(() => {
const h = [...JSON.parse(n)];
return (!h[2] || h[2] < h[0]) && (h[2] = h[0]), (!h[3] || h[3] < h[3]) && (h[3] = h[1]), h;
}, [n]), [r, u] = V(s);
return M(() => {
u(s), a({
x: -1,
y: -1
});
}, [s]), /* @__PURE__ */ i(
"div",
{
className: `${t}-table-shape`,
onMouseLeave: () => {
u(s), a({
x: -1,
y: -1
});
},
children: new Array(r[1]).fill("").map((h, k) => /* @__PURE__ */ i("div", { className: `${t}-table-shape-row`, children: new Array(r[0]).fill("").map((v, c) => /* @__PURE__ */ i(
"div",
{
className: `${t}-table-shape-col`,
onMouseEnter: () => {
a({
x: k,
y: c
}), c + 1 === r[0] && c + 1 < r[2] ? u((o) => {
const f = [...o];
return f[0] = o[0] + 1, f;
}) : c + 2 < r[0] && r[0] > e.tableShape[0] && u((o) => {
const f = [...o];
return f[0] = o[0] - 1, f;
}), k + 1 === r[1] && k + 1 < r[3] ? u((o) => {
const f = [...o];
return f[1] = o[1] + 1, f;
}) : k + 2 < r[1] && r[1] > e.tableShape[1] && u((o) => {
const f = [...o];
return f[1] = o[1] - 1, f;
});
},
onClick: () => {
e.onSelected(l);
},
children: /* @__PURE__ */ i(
"div",
{
className: [
`${t}-table-shape-col-default`,
k <= l.x && c <= l.y && `${t}-table-shape-col-include`
].filter((o) => !!o).join(" ")
}
)
},
`table-shape-col-${c}`
)) }, `table-shape-row-${k}`))
}
);
}, Va = (e) => {
const { updateSetting: l } = e, { editorId: a } = j(z), n = W(re.editorExtensions.screenfull.instance), s = W(!1), r = D(
(u) => {
if (!n.current) {
g.emit(a, ce, {
name: "fullscreen",
message: "fullscreen is undefined"
});
return;
}
n.current.isEnabled ? (s.current = !s.current, (u === void 0 ? !n.current.isFullscreen : u) ? n.current.request() : n.current.exit()) : console.error("browser does not support screenfull!");
},
[a]
);
return M(() => {
const u = () => {
l("fullscreen", s.current);
};
let h = -1;
if (!n.current) {
const { editorExtensions: k, editorExtensionsAttrs: v } = re;
h = requestAnimationFrame(() => {
var c;
ba(
"script",
{
...(c = v.screenfull) == null ? void 0 : c.js,
src: k.screenfull.js,
id: Jo.screenfull,
onload() {
n.current = window.screenfull, n.current && n.current.isEnabled && n.current.on("change", u);
}
},
"screenfull"
);
});
}
return n.current && n.current.isEnabled && n.current.on("change", u), () => {
n.current || cancelAnimationFrame(h), n.current && n.current.isEnabled && n.current.off("change", u);
};
}, [l]), M(() => (g.on(a, {
name: po,
callback: r
}), () => {
g.remove(a, po, r);
}), [a, r]), { fullscreenHandler: r };
}, Ha = (e, l) => {
const { editorId: a } = j(z), [n, s] = V({
type: "link",
linkVisible: !1,
clipVisible: !1
}), r = D(() => {
s((h) => ({
...h,
linkVisible: !1,
clipVisible: !1
}));
}, []), u = D(
(h) => {
h && l(n.type, {
desc: h.desc,
url: h.url,
transform: n.type === "image"
}), r();
},
[l, n.type, r]
);
return M(() => {
g.on(a, {
name: He,
callback(k) {
s((v) => ({
...v,
type: k,
linkVisible: !0
}));
}
});
const h = () => {
g.emit(
a,
We,
Array.from(e.current.files || [])
), e.current.value = "";
};
e.current.addEventListener("change", h);
}, [a, e]), {
modalData: n,
setModalData: s,
onCancel: r,
onOk: u
};
}, Ba = (e) => {
const [l, a] = V({
title: !1,
catalog: !1,
// 图片上传下拉
image: !1,
// 表格预选
table: !1,
// mermaid
mermaid: !1,
katex: !1
}), n = D((p) => {
a((w) => ({
...w,
title: p
}));
}, []), s = D(() => {
a((p) => ({
...p,
title: !1
}));
}, []), r = D((p) => {
a((w) => ({
...w,
image: p
}));
}, []), u = D(() => {
a((p) => ({
...p,
image: !1
}));
}, []), h = D((p) => {
a((w) => ({
...w,
table: p
}));
}, []), k = D(
(p) => {
e("table", { selectedShape: p });
},
[e]
), v = D((p) => {
a((w) => ({
...w,
mermaid: p
}));
}, []), c = D(() => {
a((p) => ({
...p,
mermaid: !1
}));
}, []), o = D((p) => {
a((w) => ({
...w,
katex: p
}));
}, []), f = D(() => {
a((p) => ({
...p,
katex: !1
}));
}, []);
return {
visible: l,
onTitleChange: n,
onTitleClose: s,
onImageChange: r,
onImageClose: u,
onTableChange: h,
onTableSelected: k,
onMermaidChange: v,
onMermaidClose: c,
onKatexChange: o,
onKatexClose: f
};
};
let Ka = 0;
const _a = (e) => {
var me, ue, Ie, ne, Ee, Le, G, he, De, Ae, Ue, je, Ge, Ze, Xe, Je, Ye, Qe, et, tt, ot, at, rt, lt, nt, it, st, ct, dt, mt, ut, ht, bt, gt, ft, vt, Ct, kt, pt, Tt, $t, wt, yt, Nt, xt, St, It, Et, Lt, Dt;
const { toolbars: l, toolbarsExclude: a, updateSetting: n, codeTheme: s } = e, { editorId: r, usedLanguageText: u, theme: h, previewTheme: k, language: v, disabled: c } = j(z), o = u, [f] = V(() => `${r}-toolbar-wrapper`), p = W(null), w = W(null), b = D(
(E, R) => {
if (c)
return !1;
g.emit(r, A, E, R);
},
[c, r]
), { fullscreenHandler: S } = Va(e), { modalData: m, setModalData: C, onCancel: I, onOk: L } = Ha(w, b), {
visible: $,
onTitleChange: O,
onTitleClose: F,
onImageChange: q,
onImageClose: Q,
onTableChange: Z,
onTableSelected: ke,
onMermaidChange: pe,
onMermaidClose: Te,
onKatexChange: $e,
onKatexClose: we
} = Ba(b), ye = _(() => {
var E, R, B, K, H, U, ee, te;
return /* @__PURE__ */ i(
fe,
{
relative: `#${f}`,
visible: $.title,
onChange: O,
overlay: /* @__PURE__ */ T(
"ul",
{
className: `${t}-menu`,
onClick: F,
role: "menu",
children: [
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-title`,
onClick: () => {
b("h1");
},
role: "menuitem",
tabIndex: 0,
children: (E = o.titleItem) == null ? void 0 : E.h1
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-title`,
onClick: () => {
b("h2");
},
role: "menuitem",
tabIndex: 0,
children: (R = o.titleItem) == null ? void 0 : R.h2
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-title`,
onClick: () => {
b("h3");
},
role: "menuitem",
tabIndex: 0,
children: (B = o.titleItem) == null ? void 0 : B.h3
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-title`,
onClick: () => {
b("h4");
},
role: "menuitem",
tabIndex: 0,
children: (K = o.titleItem) == null ? void 0 : K.h4
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-title`,
onClick: () => {
b("h5");
},
role: "menuitem",
tabIndex: 0,
children: (H = o.titleItem) == null ? void 0 : H.h5
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-title`,
onClick: () => {
b("h6");
},
role: "menuitem",
tabIndex: 0,
children: (U = o.titleItem) == null ? void 0 : U.h6
}
)
]
},
"bar-title-overlay"
),
disabled: c,
children: /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (ee = o.toolbarTips) == null ? void 0 : ee.title,
children: [
/* @__PURE__ */ i(x, { name: "title" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (te = o.toolbarTips) == null ? void 0 : te.title })
]
},
"bar-title-trigger"
)
},
"bar-title"
);
}, [
f,
$.title,
O,
F,
(me = o.titleItem) == null ? void 0 : me.h1,
(ue = o.titleItem) == null ? void 0 : ue.h2,
(Ie = o.titleItem) == null ? void 0 : Ie.h3,
(ne = o.titleItem) == null ? void 0 : ne.h4,
(Ee = o.titleItem) == null ? void 0 : Ee.h5,
(Le = o.titleItem) == null ? void 0 : Le.h6,
(G = o.toolbarTips) == null ? void 0 : G.title,
c,
e.showToolbarName,
b
]), Ne = _(() => {
var E, R, B, K, H;
return /* @__PURE__ */ i(
fe,
{
relative: `#${f}`,
visible: $.image,
onChange: q,
overlay: /* @__PURE__ */ T(
"ul",
{
className: `${t}-menu`,
onClick: Q,
role: "menu",
children: [
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-image`,
onClick: () => {
e.insertLinkDirect ? b("image") : C((U) => ({
...U,
type: "image",
linkVisible: !0
}));
},
role: "menuitem",
tabIndex: 0,
children: (E = o.imgTitleItem) == null ? void 0 : E.link
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-image`,
onClick: () => {
w.current.click();
},
role: "menuitem",
tabIndex: 0,
children: (R = o.imgTitleItem) == null ? void 0 : R.upload
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-image`,
onClick: () => {
C((U) => ({
...U,
type: "image",
clipVisible: !0
}));
},
role: "menuitem",
tabIndex: 0,
children: (B = o.imgTitleItem) == null ? void 0 : B.clip2upload
}
)
]
},
"bar-image-overlay"
),
disabled: c,
children: /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (K = o.toolbarTips) == null ? void 0 : K.image,
children: [
/* @__PURE__ */ i(x, { name: "image" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (H = o.toolbarTips) == null ? void 0 : H.image })
]
},
"bar-image-trigger"
)
},
"bar-image"
);
}, [
f,
$.image,
q,
Q,
(he = o.imgTitleItem) == null ? void 0 : he.link,
(De = o.imgTitleItem) == null ? void 0 : De.upload,
(Ae = o.imgTitleItem) == null ? void 0 : Ae.clip2upload,
(Ue = o.toolbarTips) == null ? void 0 : Ue.image,
c,
e.showToolbarName,
e.insertLinkDirect,
b,
C
]), xe = _(() => {
var E, R;
return /* @__PURE__ */ i(
fe,
{
relative: `#${f}`,
visible: $.table,
onChange: Z,
disabled: c,
overlay: /* @__PURE__ */ i(
Pa,
{
tableShape: e.tableShape,
onSelected: ke
},
"bar-table-overlay"
),
children: /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (E = o.toolbarTips) == null ? void 0 : E.table,
children: [
/* @__PURE__ */ i(x, { name: "table" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (R = o.toolbarTips) == null ? void 0 : R.table })
]
},
"bar-table-trigger"
)
},
"bar-table"
);
}, [
f,
$.table,
Z,
c,
e.tableShape,
e.showToolbarName,
ke,
(je = o.toolbarTips) == null ? void 0 : je.table
]), Se = _(() => {
var E, R, B, K, H, U, ee, te, be, ge;
return /* @__PURE__ */ i(
fe,
{
relative: `#${f}`,
visible: $.mermaid,
onChange: pe,
overlay: /* @__PURE__ */ T(
"ul",
{
className: `${t}-menu`,
onClick: Te,
role: "menu",
children: [
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("flow");
},
role: "menuitem",
tabIndex: 0,
children: (E = o.mermaid) == null ? void 0 : E.flow
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("sequence");
},
role: "menuitem",
tabIndex: 0,
children: (R = o.mermaid) == null ? void 0 : R.sequence
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("gantt");
},
role: "menuitem",
tabIndex: 0,
children: (B = o.mermaid) == null ? void 0 : B.gantt
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("class");
},
role: "menuitem",
tabIndex: 0,
children: (K = o.mermaid) == null ? void 0 : K.class
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("state");
},
role: "menuitem",
tabIndex: 0,
children: (H = o.mermaid) == null ? void 0 : H.state
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("pie");
},
role: "menuitem",
tabIndex: 0,
children: (U = o.mermaid) == null ? void 0 : U.pie
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("relationship");
},
role: "menuitem",
tabIndex: 0,
children: (ee = o.mermaid) == null ? void 0 : ee.relationship
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-mermaid`,
onClick: () => {
b("journey");
},
role: "menuitem",
tabIndex: 0,
children: (te = o.mermaid) == null ? void 0 : te.journey
}
)
]
},
"bar-mermaid-overlay"
),
disabled: c,
children: /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (be = o.toolbarTips) == null ? void 0 : be.mermaid,
children: [
/* @__PURE__ */ i(x, { name: "mermaid" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (ge = o.toolbarTips) == null ? void 0 : ge.mermaid })
]
},
"bar-mermaid-trigger"
)
},
"bar-mermaid"
);
}, [
f,
$.mermaid,
pe,
Te,
(Ge = o.mermaid) == null ? void 0 : Ge.flow,
(Ze = o.mermaid) == null ? void 0 : Ze.sequence,
(Xe = o.mermaid) == null ? void 0 : Xe.gantt,
(Je = o.mermaid) == null ? void 0 : Je.class,
(Ye = o.mermaid) == null ? void 0 : Ye.state,
(Qe = o.mermaid) == null ? void 0 : Qe.pie,
(et = o.mermaid) == null ? void 0 : et.relationship,
(tt = o.mermaid) == null ? void 0 : tt.journey,
(ot = o.toolbarTips) == null ? void 0 : ot.mermaid,
c,
e.showToolbarName,
b
]), P = _(() => {
var E, R, B, K;
return /* @__PURE__ */ i(
fe,
{
relative: `#${f}`,
visible: $.katex,
onChange: $e,
overlay: /* @__PURE__ */ T(
"ul",
{
className: `${t}-menu`,
onClick: we,
role: "menu",
children: [
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-katex`,
onClick: () => {
b("katexInline");
},
role: "menuitem",
tabIndex: 0,
children: (E = o.katex) == null ? void 0 : E.inline
}
),
/* @__PURE__ */ i(
"li",
{
className: `${t}-menu-item ${t}-menu-item-katex`,
onClick: () => {
b("katexBlock");
},
role: "menuitem",
tabIndex: 0,
children: (R = o.katex) == null ? void 0 : R.block
}
)
]
},
"bar-katex-overlay"
),
disabled: c,
children: /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (B = o.toolbarTips) == null ? void 0 : B.katex,
children: [
/* @__PURE__ */ i(x, { name: "formula" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (K = o.toolbarTips) == null ? void 0 : K.katex })
]
},
"bar-katex-trigger"
)
},
"bar-katex"
);
}, [
f,
$.katex,
$e,
we,
(at = o.katex) == null ? void 0 : at.inline,
(rt = o.katex) == null ? void 0 : rt.block,
(lt = o.toolbarTips) == null ? void 0 : lt.katex,
c,
e.showToolbarName,
b
]), le = D(
(E) => {
var R, B, K, H, U, ee, te, be, ge, At, Mt, Rt, Ot, Ft, Pt, Vt, Ht, Bt, Kt, _t, Wt, zt, qt, Ut, jt, Gt, Zt, Xt, Jt, Yt, Qt, eo, to, oo, ao, ro, lo, no, io, so, co, mo, uo, ho, bo, go, fo, vo, Co, ko;
if (sa.includes(E))
switch (E) {
case "-":
return /* @__PURE__ */ i(Ma, {}, `bar-${Ka++}`);
case "bold":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (R = o.toolbarTips) == null ? void 0 : R.bold,
onClick: () => {
b("bold");
},
children: [
/* @__PURE__ */ i(x, { name: "bold" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (B = o.toolbarTips) == null ? void 0 : B.bold })
]
},
"bar-bold"
);
case "underline":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (K = o.toolbarTips) == null ? void 0 : K.underline,
onClick: () => {
b("underline");
},
children: [
/* @__PURE__ */ i(x, { name: "underline" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (H = o.toolbarTips) == null ? void 0 : H.underline })
]
},
"bar-underline"
);
case "italic":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (U = o.toolbarTips) == null ? void 0 : U.italic,
onClick: () => {
b("italic");
},
children: [
/* @__PURE__ */ i(x, { name: "italic" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (ee = o.toolbarTips) == null ? void 0 : ee.italic })
]
},
"bar-italic"
);
case "strikeThrough":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (te = o.toolbarTips) == null ? void 0 : te.strikeThrough,
onClick: () => {
b("strikeThrough");
},
children: [
/* @__PURE__ */ i(x, { name: "strike-through" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (be = o.toolbarTips) == null ? void 0 : be.strikeThrough })
]
},
"bar-strikeThrough"
);
case "title":
return ye;
case "sub":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (ge = o.toolbarTips) == null ? void 0 : ge.sub,
onClick: () => {
b("sub");
},
children: [
/* @__PURE__ */ i(x, { name: "sub" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (At = o.toolbarTips) == null ? void 0 : At.sub })
]
},
"bar-sub"
);
case "sup":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Mt = o.toolbarTips) == null ? void 0 : Mt.sup,
onClick: () => {
b("sup");
},
children: [
/* @__PURE__ */ i(x, { name: "sup" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Rt = o.toolbarTips) == null ? void 0 : Rt.sup })
]
},
"bar-sup"
);
case "quote":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Ot = o.toolbarTips) == null ? void 0 : Ot.quote,
onClick: () => {
b("quote");
},
children: [
/* @__PURE__ */ i(x, { name: "quote" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Ft = o.toolbarTips) == null ? void 0 : Ft.quote })
]
},
"bar-quote"
);
case "unorderedList":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Pt = o.toolbarTips) == null ? void 0 : Pt.unorderedList,
onClick: () => {
b("unorderedList");
},
children: [
/* @__PURE__ */ i(x, { name: "unordered-list" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Vt = o.toolbarTips) == null ? void 0 : Vt.unorderedList })
]
},
"bar-unorderedList"
);
case "orderedList":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Ht = o.toolbarTips) == null ? void 0 : Ht.orderedList,
onClick: () => {
b("orderedList");
},
children: [
/* @__PURE__ */ i(x, { name: "ordered-list" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Bt = o.toolbarTips) == null ? void 0 : Bt.orderedList })
]
},
"bar-orderedList"
);
case "task":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Kt = o.toolbarTips) == null ? void 0 : Kt.task,
onClick: () => {
b("task");
},
children: [
/* @__PURE__ */ i(x, { name: "task" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (_t = o.toolbarTips) == null ? void 0 : _t.task })
]
},
"bar-task"
);
case "codeRow":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Wt = o.toolbarTips) == null ? void 0 : Wt.codeRow,
onClick: () => {
b("codeRow");
},
children: [
/* @__PURE__ */ i(x, { name: "code-row" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (zt = o.toolbarTips) == null ? void 0 : zt.codeRow })
]
},
"bar-codeRow"
);
case "code":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (qt = o.toolbarTips) == null ? void 0 : qt.code,
onClick: () => {
b("code");
},
children: [
/* @__PURE__ */ i(x, { name: "code" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Ut = o.toolbarTips) == null ? void 0 : Ut.code })
]
},
"bar-code"
);
case "link":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (jt = o.toolbarTips) == null ? void 0 : jt.link,
onClick: () => {
if (c)
return !1;
e.insertLinkDirect ? b("link") : C({
...m,
type: "link",
linkVisible: !0
});
},
children: [
/* @__PURE__ */ i(x, { name: "link" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Gt = o.toolbarTips) == null ? void 0 : Gt.link })
]
},
"bar-link"
);
case "image":
return e.noUploadImg ? /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Zt = o.toolbarTips) == null ? void 0 : Zt.image,
onClick: () => {
if (c)
return !1;
e.insertLinkDirect ? b("image") : C((X) => ({
...X,
type: "image",
linkVisible: !0
}));
},
children: [
/* @__PURE__ */ i(x, { name: "image" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Xt = o.toolbarTips) == null ? void 0 : Xt.image })
]
},
"bar-image-no-upload"
) : Ne;
case "table":
return xe;
case "revoke":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Jt = o.toolbarTips) == null ? void 0 : Jt.revoke,
onClick: () => {
if (c)
return !1;
g.emit(r, Ke);
},
children: [
/* @__PURE__ */ i(x, { name: "revoke" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (Yt = o.toolbarTips) == null ? void 0 : Yt.revoke })
]
},
"bar-revoke"
);
case "next":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (Qt = o.toolbarTips) == null ? void 0 : Qt.next,
onClick: () => {
if (c)
return !1;
g.emit(r, Be);
},
children: [
/* @__PURE__ */ i(x, { name: "next" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (eo = o.toolbarTips) == null ? void 0 : eo.next })
]
},
"bar-next"
);
case "save":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (to = o.toolbarTips) == null ? void 0 : to.save,
onClick: () => {
if (c)
return !1;
g.emit(r, Wo);
},
children: [
/* @__PURE__ */ i(x, { name: "save" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (oo = o.toolbarTips) == null ? void 0 : oo.save })
]
},
"bar-save"
);
case "prettier":
return e.noPrettier ? "" : /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
c && `${t}-disabled`
]),
title: (ao = o.toolbarTips) == null ? void 0 : ao.prettier,
onClick: () => {
b("prettier");
},
children: [
/* @__PURE__ */ i(x, { name: "prettier" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (ro = o.toolbarTips) == null ? void 0 : ro.prettier })
]
},
"bar-prettier"
);
case "pageFullscreen":
return !e.setting.fullscreen && /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
e.setting.pageFullscreen && `${t}-toolbar-active`,
c && `${t}-disabled`
]),
title: (lo = o.toolbarTips) == null ? void 0 : lo.pageFullscreen,
onClick: () => {
if (c)
return !1;
n("pageFullscreen");
},
children: [
/* @__PURE__ */ i(x, { name: e.setting.pageFullscreen ? "minimize" : "maximize" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (no = o.toolbarTips) == null ? void 0 : no.pageFullscreen })
]
},
"bar-pageFullscreen"
);
case "fullscreen":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
e.setting.fullscreen && `${t}-toolbar-active`,
c && `${t}-disabled`
]),
title: (io = o.toolbarTips) == null ? void 0 : io.fullscreen,
onClick: () => {
if (c)
return !1;
S();
},
children: [
/* @__PURE__ */ i(
x,
{
name: e.setting.fullscreen ? "fullscreen-exit" : "fullscreen"
}
),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (so = o.toolbarTips) == null ? void 0 : so.fullscreen })
]
},
"bar-fullscreen"
);
case "catalog":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
e.catalogVisible && `${t}-toolbar-active`,
c && `${t}-disabled`
]),
title: (co = o.toolbarTips) == null ? void 0 : co.catalog,
onClick: () => {
if (c)
return !1;
g.emit(r, ha);
},
children: [
/* @__PURE__ */ i(x, { name: "catalog" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (mo = o.toolbarTips) == null ? void 0 : mo.catalog })
]
},
"bar-catalog"
);
case "preview":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
e.setting.preview && `${t}-toolbar-active`,
c && `${t}-disabled`
]),
title: (uo = o.toolbarTips) == null ? void 0 : uo.preview,
onClick: () => {
if (c)
return !1;
n("preview");
},
children: [
/* @__PURE__ */ i(x, { name: "preview" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (ho = o.toolbarTips) == null ? void 0 : ho.preview })
]
},
"bar-preview"
);
case "previewOnly":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
e.setting.previewOnly && `${t}-toolbar-active`,
c && `${t}-disabled`
]),
title: (bo = o.toolbarTips) == null ? void 0 : bo.previewOnly,
onClick: () => {
if (c)
return !1;
n("previewOnly");
},
children: [
/* @__PURE__ */ i(x, { name: "preview-only" }),
e.showToolbarName && /* @__PURE__ */ i("div", { className: `${t}-toolbar-item-name`, children: (go = o.toolbarTips) == null ? void 0 : go.previewOnly })
]
},
"bar-preview-only"
);
case "htmlPreview":
return /* @__PURE__ */ T(
"div",
{
className: y([
`${t}-toolbar-item`,
e.setting.htmlPreview && `${t}-toolbar-active`,
c && `${t}-disabled`
]),
title: (fo = o.toolbarTips) == null ? void 0 : fo.htmlPreview,
onClick: () => {
i