@baishuyun/ui-base 2.1.0 → 2.2.2

package/dist/Editor/index-C0MY9j94.js

@@ -0,0 +1,832 @@
+import { jsx as i, jsxs as g, Fragment as V } from "react/jsx-runtime";
+import { I as D } from "../Icon/Icon-CkHAU1fA.js";
+import fe, { createContext as ge, useContext as ve, useMemo as ke, useCallback as T, useState as w, forwardRef as oe, useImperativeHandle as ae, useRef as J } from "react";
+import { c as xe } from "../vendors/clsx-OuTLNxxd.js";
+import { o as C, l as G, P as A, _ as O, M as H, p as ye, r as Ne, t as we, v as se, x as z, u as ce, i as de, y as Q, w as W, E as X, z as Ce, A as be, b as Ie, B as Ue } from "../vendors/lexical-DdSmj_Kv.js";
+import { u as N } from "../vendors/useLocale-DgqW9M3h.js";
+import { D as ue } from "../DropDown/DropDown-BkTY-3y0.js";
+import { FONT_SIZES as Oe } from "./constants/index.js";
+import { C as pe } from "../ColorPicker/ColorPicker-049kyJn6.js";
+import { AlignLeftOutlined as ee, AlignCenterOutlined as Se, AlignRightOutlined as Le } from "@ant-design/icons";
+import { M as _e } from "../Modal/Modal-oRJ-Almn.js";
+import { message as Y, Input as K, Button as j, Form as $ } from "antd";
+import Ae from "../CheckBox/index.js";
+import { AnimatePresence as Te, motion as E } from "motion/react";
+const te = {
+  "lexical-editor__toolbar-button": "_lexical-editor__toolbar-button_1y192_1",
+  "lexical-editor__toolbar-button-active": "_lexical-editor__toolbar-button-active_1y192_7"
+}, b = (n) => {
+  const { icon: e, tooltip: t, onClick: r, disabled: l = !1, active: o = !1, size: c = 14 } = n;
+  return /* @__PURE__ */ i(
+    "button",
+    {
+      className: xe(te["lexical-editor__toolbar-button"], {
+        [te["lexical-editor__toolbar-button-active"]]: o
+      }),
+      type: "button",
+      onClick: r,
+      disabled: l,
+      title: t,
+      children: fe.isValidElement(e) ? e : /* @__PURE__ */ i(D, { name: e, size: c })
+    }
+  );
+}, Me = ge(null), U = () => {
+  const n = ve(Me);
+  if (!n)
+    throw new Error("useTextFormatsContext must be used within TextFormatsProvider");
+  return n;
+}, Re = () => {
+  const [n] = C(), e = U(), { t } = N(), r = e.bold, l = () => {
+    n.dispatchCommand(G, "bold");
+  };
+  return /* @__PURE__ */ i(b, { icon: "bold", tooltip: t("editor.bold"), active: r, onClick: l });
+}, Fe = () => {
+  const [n] = C(), e = U(), { t } = N(), r = e.underline, l = () => {
+    n.dispatchCommand(G, "underline");
+  };
+  return /* @__PURE__ */ i(
+    b,
+    {
+      icon: "underline",
+      tooltip: t("editor.underline"),
+      active: r,
+      onClick: l
+    }
+  );
+}, De = () => {
+  const [n] = C(), e = U(), { t } = N(), r = e.italic, l = () => {
+    n.dispatchCommand(G, "italic");
+  };
+  return /* @__PURE__ */ i(
+    b,
+    {
+      icon: "italic",
+      tooltip: t("editor.italic"),
+      active: r,
+      onClick: l
+    }
+  );
+}, Be = () => {
+  const [n] = C(), e = U(), t = ke(() => Oe.map((l) => ({
+    key: l.value,
+    label: l.label
+  })), []), r = T(
+    (l) => {
+      const o = l.key;
+      n.update(() => {
+        const c = A();
+        O(c) && H(c, {
+          "font-size": o
+        });
+      });
+    },
+    [n]
+  );
+  return /* @__PURE__ */ i(
+    ue,
+    {
+      menus: t,
+      onClick: r,
+      activeKey: [e.fontSize],
+      showSearch: !1,
+      style: {
+        width: "60px",
+        minWidth: "60px"
+      },
+      children: /* @__PURE__ */ i("div", { className: "dropdown__trigger inline-flex", children: /* @__PURE__ */ i(b, { icon: "fontsize", tooltip: "字号", active: !1 }) })
+    }
+  );
+}, Ee = () => {
+  const [n] = C(), e = U(), { t } = N(), r = T(
+    (l) => {
+      n.update(() => {
+        const o = A();
+        O(o) && H(o, {
+          color: l
+        });
+      });
+    },
+    [n]
+  );
+  return /* @__PURE__ */ i(
+    pe,
+    {
+      value: e.fontColor,
+      onChange: r,
+      placement: "bottom-start",
+      children: /* @__PURE__ */ i("div", { className: "trigger-picker inline-flex", children: /* @__PURE__ */ i(
+        b,
+        {
+          icon: "fontcolor",
+          tooltip: t("editor.fontColor"),
+          onClick: () => {
+          },
+          active: !1
+        }
+      ) })
+    }
+  );
+}, Pe = () => {
+  const [n] = C(), e = U(), { t } = N(), r = T(
+    (l) => {
+      n.update(() => {
+        const o = A();
+        O(o) && H(o, {
+          "background-color": l
+        });
+      });
+    },
+    [n]
+  );
+  return /* @__PURE__ */ i(
+    pe,
+    {
+      value: e.backgroundColor,
+      onChange: r,
+      placement: "bottom-start",
+      children: /* @__PURE__ */ i("div", { className: "trigger-picker inline-flex", children: /* @__PURE__ */ i(b, { icon: "fill", tooltip: t("editor.fill"), onClick: () => {
+      }, active: !1 }) })
+    }
+  );
+}, je = () => {
+  var m;
+  const [n] = C(), { align: e } = U(), { t } = N(), r = [
+    {
+      key: "left",
+      label: t("leftAlign"),
+      icon: /* @__PURE__ */ i(ee, {})
+    },
+    {
+      key: "center",
+      label: t("editor.centerAlign"),
+      icon: /* @__PURE__ */ i(Se, {})
+    },
+    {
+      key: "right",
+      label: t("editor.rightAlign"),
+      icon: /* @__PURE__ */ i(Le, {})
+    }
+  ], l = T(
+    (a) => {
+      n.dispatchCommand(ye, a);
+    },
+    [n]
+  ), o = r.map((a) => ({
+    key: a.key,
+    label: /* @__PURE__ */ g("div", { className: "flex items-center gap-2", children: [
+      a.icon,
+      /* @__PURE__ */ i("span", { children: a.label })
+    ] })
+  })), c = T(
+    (a) => {
+      l(a.key);
+    },
+    [l]
+  ), _ = ((m = r.find((a) => a.key === e)) == null ? void 0 : m.icon) || /* @__PURE__ */ i(ee, {});
+  return /* @__PURE__ */ i(
+    ue,
+    {
+      menus: o,
+      onClick: c,
+      showSearch: !1,
+      activeKey: [e],
+      style: { width: "110px", minWidth: "110px" },
+      children: /* @__PURE__ */ i("div", { className: "trigger-dropdown inline-flex text-sm", children: /* @__PURE__ */ i(
+        b,
+        {
+          icon: _,
+          tooltip: t("editor.alignment"),
+          onClick: () => {
+          },
+          active: !1
+        }
+      ) })
+    }
+  );
+}, ze = /* @__PURE__ */ new Set(["http:", "https:", "mailto:", "sms:", "tel:"]);
+class B extends Ne {
+  static getType() {
+    return "link";
+  }
+  static clone(e) {
+    return new B(e.__url, { rel: e.__rel, target: e.__target, title: e.__title }, e.__key);
+  }
+  constructor(e = "", t = {}, r) {
+    super(r);
+    const { target: l = null, rel: o = null, title: c = null } = t;
+    this.__url = e, this.__target = l, this.__rel = o, this.__title = c;
+  }
+  createDOM(e) {
+    const t = document.createElement("a");
+    return this.updateLinkDOM(null, t, e), we(t, e.theme.link), t;
+  }
+  updateLinkDOM(e, t, r) {
+    if (se(t)) {
+      e && e.__url === this.__url || (t.href = this.sanitizeUrl(this.__url));
+      for (const l of ["target", "rel", "title"]) {
+        const o = `__${l}`, c = this[o];
+        e && e[o] === c || (c ? t[l] = c : t.removeAttribute(l));
+      }
+    }
+  }
+  updateDOM(e, t, r) {
+    return this.updateLinkDOM(e, t, r), !1;
+  }
+  static importDOM() {
+    return { a: (e) => ({ conversion: qe, priority: 1 }) };
+  }
+  static importJSON(e) {
+    return R().updateFromJSON(e);
+  }
+  updateFromJSON(e) {
+    return super.updateFromJSON(e).setURL(e.url).setRel(e.rel || null).setTarget(e.target || null).setTitle(e.title || null);
+  }
+  sanitizeUrl(e) {
+    e = le(e);
+    try {
+      const t = new URL(le(e));
+      if (!ze.has(t.protocol)) return "about:blank";
+    } catch {
+      return e;
+    }
+    return e;
+  }
+  exportJSON() {
+    return { ...super.exportJSON(), rel: this.getRel(), target: this.getTarget(), title: this.getTitle(), url: this.getURL() };
+  }
+  getURL() {
+    return this.getLatest().__url;
+  }
+  setURL(e) {
+    const t = this.getWritable();
+    return t.__url = e, t;
+  }
+  getTarget() {
+    return this.getLatest().__target;
+  }
+  setTarget(e) {
+    const t = this.getWritable();
+    return t.__target = e, t;
+  }
+  getRel() {
+    return this.getLatest().__rel;
+  }
+  setRel(e) {
+    const t = this.getWritable();
+    return t.__rel = e, t;
+  }
+  getTitle() {
+    return this.getLatest().__title;
+  }
+  setTitle(e) {
+    const t = this.getWritable();
+    return t.__title = e, t;
+  }
+  insertNewAfter(e, t = !0) {
+    const r = R(this.__url, { rel: this.__rel, target: this.__target, title: this.__title });
+    return this.insertAfter(r, t), r;
+  }
+  canInsertTextBefore() {
+    return !1;
+  }
+  canInsertTextAfter() {
+    return !1;
+  }
+  canBeEmpty() {
+    return !1;
+  }
+  isInline() {
+    return !0;
+  }
+  extractWithChild(e, t, r) {
+    if (!O(t)) return !1;
+    const l = t.anchor.getNode(), o = t.focus.getNode();
+    return this.isParentOf(l) && this.isParentOf(o) && t.getTextContent().length > 0;
+  }
+  isEmailURI() {
+    return this.__url.startsWith("mailto:");
+  }
+  isWebSiteURI() {
+    return this.__url.startsWith("https://") || this.__url.startsWith("http://");
+  }
+}
+function qe(n) {
+  let e = null;
+  if (se(n)) {
+    const t = n.textContent;
+    (t !== null && t !== "" || n.children.length > 0) && (e = R(n.getAttribute("href") || "", { rel: n.getAttribute("rel"), target: n.getAttribute("target"), title: n.getAttribute("title") }));
+  }
+  return { node: e };
+}
+function R(n = "", e) {
+  return de(new B(n, e));
+}
+function L(n) {
+  return n instanceof B;
+}
+class q extends B {
+  constructor(e = "", t = {}, r) {
+    super(e, t, r), this.__isUnlinked = t.isUnlinked !== void 0 && t.isUnlinked !== null && t.isUnlinked;
+  }
+  static getType() {
+    return "autolink";
+  }
+  static clone(e) {
+    return new q(e.__url, { isUnlinked: e.__isUnlinked, rel: e.__rel, target: e.__target, title: e.__title }, e.__key);
+  }
+  getIsUnlinked() {
+    return this.__isUnlinked;
+  }
+  setIsUnlinked(e) {
+    const t = this.getWritable();
+    return t.__isUnlinked = e, t;
+  }
+  createDOM(e) {
+    return this.__isUnlinked ? document.createElement("span") : super.createDOM(e);
+  }
+  updateDOM(e, t, r) {
+    return super.updateDOM(e, t, r) || e.__isUnlinked !== this.__isUnlinked;
+  }
+  static importJSON(e) {
+    return ne().updateFromJSON(e);
+  }
+  updateFromJSON(e) {
+    return super.updateFromJSON(e).setIsUnlinked(e.isUnlinked || !1);
+  }
+  static importDOM() {
+    return null;
+  }
+  exportJSON() {
+    return { ...super.exportJSON(), isUnlinked: this.__isUnlinked };
+  }
+  insertNewAfter(e, t = !0) {
+    const r = this.getParentOrThrow().insertNewAfter(e, t);
+    if (z(r)) {
+      const l = ne(this.__url, { isUnlinked: this.__isUnlinked, rel: this.__rel, target: this.__target, title: this.__title });
+      return r.append(l), l;
+    }
+    return null;
+  }
+}
+function ne(n = "", e) {
+  return de(new q(n, e));
+}
+function P(n) {
+  return n instanceof q;
+}
+const We = ce("TOGGLE_LINK_COMMAND");
+function ie(n, e) {
+  if (n.type === "element") {
+    const t = n.getNode();
+    return z(t) || (function(r, ...l) {
+      const o = new URL("https://lexical.dev/docs/error"), c = new URLSearchParams();
+      c.append("code", r);
+      for (const _ of l) c.append("v", _);
+      throw o.search = c.toString(), Error(`Minified Lexical error #${r}; visit ${o.toString()} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`);
+    })(252), t.getChildren()[n.offset + e] || null;
+  }
+  return null;
+}
+function $e(n, e = {}) {
+  const { target: t, title: r } = e, l = e.rel === void 0 ? "noreferrer" : e.rel, o = A();
+  if (o === null || !O(o) && !Q(o)) return;
+  if (Q(o)) {
+    const a = o.getNodes();
+    return a.length === 0 ? void 0 : void a.forEach(((d) => {
+      if (n === null) {
+        const u = W(d, ((s) => !P(s) && L(s)));
+        u && (u.insertBefore(d), u.getChildren().length === 0 && u.remove());
+      } else {
+        const u = W(d, ((s) => !P(s) && L(s)));
+        if (u) u.setURL(n), t !== void 0 && u.setTarget(t), l !== void 0 && u.setRel(l);
+        else {
+          const s = R(n, { rel: l, target: t });
+          d.insertBefore(s), s.append(d);
+        }
+      }
+    }));
+  }
+  const c = o.extract();
+  if (n === null) return void c.forEach(((a) => {
+    const d = W(a, ((u) => !P(u) && L(u)));
+    if (d) {
+      const u = d.getChildren();
+      for (let s = 0; s < u.length; s++) d.insertBefore(u[s]);
+      d.remove();
+    }
+  }));
+  const _ = /* @__PURE__ */ new Set(), m = (a) => {
+    _.has(a.getKey()) || (_.add(a.getKey()), a.setURL(n), t !== void 0 && a.setTarget(t), l !== void 0 && a.setRel(l), r !== void 0 && a.setTitle(r));
+  };
+  if (c.length === 1) {
+    const a = re(c[0], L);
+    if (a !== null) return m(a);
+  }
+  (function(a) {
+    const d = A();
+    if (!O(d)) return a();
+    const u = X(d), s = u.isBackward(), v = ie(u.anchor, s ? -1 : 0), x = ie(u.focus, s ? 0 : -1);
+    if (a(), v || x) {
+      const M = A();
+      if (O(M)) {
+        const h = M.clone();
+        if (v) {
+          const I = v.getParent();
+          I && h.anchor.set(I.getKey(), v.getIndexWithinParent() + (s ? 1 : 0), "element");
+        }
+        if (x) {
+          const I = x.getParent();
+          I && h.focus.set(I.getKey(), x.getIndexWithinParent() + (s ? 0 : 1), "element");
+        }
+        Ce(X(h));
+      }
+    }
+  })((() => {
+    let a = null;
+    for (const d of c) {
+      if (!d.isAttached()) continue;
+      const u = re(d, L);
+      if (u) {
+        m(u);
+        continue;
+      }
+      if (z(d)) {
+        if (!d.isInline()) continue;
+        if (L(d)) {
+          if (!(P(d) || a !== null && a.getParentOrThrow().isParentOf(d))) {
+            m(d), a = d;
+            continue;
+          }
+          for (const v of d.getChildren()) d.insertBefore(v);
+          d.remove();
+          continue;
+        }
+      }
+      const s = d.getPreviousSibling();
+      L(s) && s.is(a) ? s.append(d) : (a = R(n, { rel: l, target: t, title: r }), d.insertAfter(a), a.append(d));
+    }
+  }));
+}
+function re(n, e) {
+  let t = n;
+  for (; t !== null && t.getParent() !== null && !e(t); ) t = t.getParentOrThrow();
+  return e(t) ? t : null;
+}
+const Je = /^\+?[0-9\s()-]{5,}$/;
+function le(n) {
+  return n.match(/^[a-z][a-z0-9+.-]*:/i) || n.match(/^[/#.]/) ? n : n.includes("@") ? `mailto:${n}` : Je.test(n) ? `tel:${n}` : `https://${n}`;
+}
+const Ke = () => {
+  const [n] = C(), { link: e } = U(), { t } = N(), [r, l] = w(!1), [o, c] = w(""), [_, m] = w(""), [a, d] = w(!0), [u, s] = Y.useMessage(), v = T((h) => h ? h.startsWith("@") ? "javascript:void(0);" : h.match(/^https?:\/\//) ? h : `http://${h}` : "", []), x = () => {
+    if (!o) {
+      u.warning(t("editor.linkAddressEmpty"));
+      return;
+    }
+    const h = v(o);
+    n.update(() => {
+      const I = a ? { target: "_blank", rel: "noopener noreferrer", title: o } : { title: o }, F = A(), S = R(h, I), p = be(_ || o);
+      if (O(F))
+        F.isCollapsed() ? (S.append(p), F.insertNodes([S])) : $e(h);
+      else {
+        S.append(p);
+        const k = Ie(), y = k.getLastChild();
+        if (z(y) && y.isEmpty())
+          y.append(S);
+        else {
+          const Z = Ue();
+          Z.append(S), k.append(Z);
+        }
+      }
+    }), c(""), m(""), l(!1);
+  }, M = T(() => {
+    e ? (c(e.link === "javascript:void(0);" ? "" : e.link), m(e.linkText)) : (c(""), m("")), l(!0);
+  }, [e]);
+  return /* @__PURE__ */ g(V, { children: [
+    /* @__PURE__ */ i(
+      b,
+      {
+        icon: "Insertlink",
+        tooltip: t("link"),
+        onClick: M,
+        active: !!(e != null && e.link)
+      }
+    ),
+    s,
+    /* @__PURE__ */ i(_e, { title: t("link"), open: r, onOpenChange: l, children: /* @__PURE__ */ g("div", { children: [
+      /* @__PURE__ */ g("div", { className: "px-[20px] pb-[60px] pt-[40px]", children: [
+        /* @__PURE__ */ g("div", { className: "flex items-center relative", children: [
+          /* @__PURE__ */ i("label", { className: "w-[80px] shrink-0", children: t("linkAddress") }),
+          /* @__PURE__ */ i(
+            K,
+            {
+              value: o,
+              onChange: (h) => c(h.target.value),
+              placeholder: t("editor.linkTip")
+            }
+          ),
+          /* @__PURE__ */ i("div", { className: "absolute bottom-[-30px] left-[80px]", children: /* @__PURE__ */ i("p", { className: "text-[#999]", children: "链接可用 @表单别名，用于应用内表单跳转" }) })
+        ] }),
+        /* @__PURE__ */ g("div", { className: "flex items-center mt-[40px]", children: [
+          /* @__PURE__ */ i("label", { className: "w-[80px] shrink-0", children: t("showContent") }),
+          /* @__PURE__ */ i(K, { value: _, onChange: (h) => m(h.target.value) })
+        ] })
+      ] }),
+      /* @__PURE__ */ g("div", { className: "py-[14px] px-[20px] flex justify-between items-center border-t-[1px] border-solid border-[#e0e0e0]", children: [
+        /* @__PURE__ */ i("div", { children: /* @__PURE__ */ i(Ae, { checked: a, onChange: (h) => d(h), children: t("openInNewTab") }) }),
+        /* @__PURE__ */ g("div", { className: "flex gap-[15px]", children: [
+          /* @__PURE__ */ i(j, { onClick: () => l(!1), children: t("cancel") }),
+          /* @__PURE__ */ i(j, { type: "primary", onClick: x, children: t("confirm") })
+        ] })
+      ] })
+    ] }) })
+  ] });
+}, Ve = () => {
+  const [n] = C(), { link: e } = U(), { t } = N(), r = () => {
+    e && n.dispatchCommand(We, null);
+  };
+  return /* @__PURE__ */ i(b, { icon: "cancellink", tooltip: t("cancelLink"), onClick: r });
+}, f = {
+  "picture-modal__container": "_picture-modal__container_qyj1h_1",
+  "picture-modal__sidebar": "_picture-modal__sidebar_qyj1h_4",
+  "picture-modal__menu-list": "_picture-modal__menu-list_qyj1h_9",
+  "picture-modal__menu-item": "_picture-modal__menu-item_qyj1h_14",
+  "picture-modal__slider": "_picture-modal__slider_qyj1h_24",
+  "picture-modal__content": "_picture-modal__content_qyj1h_35",
+  "picture-modal__content-title": "_picture-modal__content-title_qyj1h_51",
+  "picture-modal__upload-area": "_picture-modal__upload-area_qyj1h_62",
+  "picture-modal__upload-area--dragging": "_picture-modal__upload-area--dragging_qyj1h_77",
+  "picture-modal__preview": "_picture-modal__preview_qyj1h_83",
+  "picture-modal__preview-image": "_picture-modal__preview-image_qyj1h_92",
+  "picture-modal__preview-info": "_picture-modal__preview-info_qyj1h_99",
+  "picture-modal__preview-filename": "_picture-modal__preview-filename_qyj1h_103",
+  "picture-modal__preview-size": "_picture-modal__preview-size_qyj1h_109",
+  "picture-modal__preview-delete": "_picture-modal__preview-delete_qyj1h_113",
+  "picture-modal__upload-text": "_picture-modal__upload-text_qyj1h_121",
+  "picture-modal__footer": "_picture-modal__footer_qyj1h_125"
+}, me = oe((n, e) => {
+  const [t] = $.useForm(), [r, l] = w(""), { t: o } = N(), c = (_) => /^https?:\/\/.+/i.test(_);
+  return ae(e, () => ({
+    getValue: async () => {
+      try {
+        return await t.validateFields(), r;
+      } catch {
+        throw new Error("URL validation failed");
+      }
+    }
+  })), /* @__PURE__ */ g(V, { children: [
+    /* @__PURE__ */ i("div", { className: f["picture-modal__content-title"], "data-title": o("editor.imageUrlNote"), children: o("editor.enterImageUrl") }),
+    /* @__PURE__ */ i($, { form: t, children: /* @__PURE__ */ i(
+      $.Item,
+      {
+        name: "url",
+        rules: [
+          { required: !0, message: o("editor.pleaseEnterImageUrl") },
+          {
+            validator: (_, m) => !m || c(m) ? Promise.resolve() : Promise.reject(new Error(o("editor.pleaseEnterValidImageUrl")))
+          }
+        ],
+        children: /* @__PURE__ */ i(
+          K,
+          {
+            placeholder: o("editor.pleaseEnterImageUrl"),
+            value: r,
+            onChange: (_) => l(_.target.value)
+          }
+        )
+      }
+    ) })
+  ] });
+});
+me.displayName = "LinkInput";
+const he = oe((n, e) => {
+  const [t, r] = w(null), [l, o] = w(!1), [c, _] = w(null), m = J(null), [a, d] = Y.useMessage(), { t: u } = N(), s = (p) => (p / 1024).toFixed(1) + "kb", v = (p) => p.type.startsWith("image/") ? p.size > 1048576 ? (a.warning(u("editor.imageSizeNote")), !1) : !0 : (a.warning(u("editor.onlyImageFormatsSupported")), !1), x = (p) => {
+    if (v(p)) {
+      const k = URL.createObjectURL(p);
+      r(k), _(p);
+    }
+  }, M = () => {
+    var p;
+    (p = m.current) == null || p.click();
+  }, h = (p) => {
+    var y;
+    const k = (y = p.target.files) == null ? void 0 : y[0];
+    k && x(k);
+  }, I = (p) => {
+    p.preventDefault(), o(!0);
+  }, F = (p) => {
+    p.preventDefault(), o(!1);
+  }, S = (p) => {
+    p.preventDefault(), o(!1);
+    const k = p.dataTransfer.files[0];
+    k && x(k);
+  };
+  return ae(e, () => ({
+    getValue: async () => {
+      if (!c)
+        throw a.warning(u("editor.pleaseUploadImageFirst")), new Error(u("editor.pleaseUploadImageFirst"));
+      return new Promise((p, k) => {
+        const y = new FileReader();
+        y.onload = () => {
+          p({
+            src: y.result,
+            fileName: c.name
+          });
+        }, y.onerror = () => {
+          k(new Error(u("editor.operationFailed")));
+        }, y.readAsDataURL(c);
+      });
+    }
+  })), /* @__PURE__ */ g(
+    "div",
+    {
+      className: "h-full",
+      onDragOver: I,
+      onDragLeave: F,
+      onDrop: S,
+      children: [
+        /* @__PURE__ */ i(
+          "div",
+          {
+            className: f["picture-modal__content-title"],
+            "data-title": u("editor.imageSizeNote"),
+            children: u("editor.uploadImage")
+          }
+        ),
+        /* @__PURE__ */ g(
+          "div",
+          {
+            className: `${f["picture-modal__upload-area"]} ${l ? f["picture-modal__upload-area--dragging"] : ""}`,
+            onClick: M,
+            children: [
+              /* @__PURE__ */ i(D, { name: "upload" }),
+              /* @__PURE__ */ i("span", { className: f["picture-modal__upload-text"], children: u("editor.clickOrDragToUpload") })
+            ]
+          }
+        ),
+        /* @__PURE__ */ i(Te, { mode: "wait", children: t && c && /* @__PURE__ */ g(
+          E.div,
+          {
+            className: f["picture-modal__preview"],
+            initial: { opacity: 0, y: 20, scale: 0.95 },
+            animate: { opacity: 1, y: 0, scale: 1 },
+            exit: { opacity: 0, y: -10, scale: 0.95 },
+            transition: {
+              duration: 0.3,
+              ease: [0.4, 0, 0.2, 1]
+            },
+            children: [
+              /* @__PURE__ */ i(
+                E.div,
+                {
+                  className: f["picture-modal__preview-image"],
+                  initial: { opacity: 0, scale: 0.8 },
+                  animate: { opacity: 1, scale: 1 },
+                  transition: { delay: 0.1, duration: 0.2 },
+                  children: /* @__PURE__ */ i(
+                    "img",
+                    {
+                      src: t,
+                      style: { maxWidth: "120px", height: "80px" },
+                      alt: u("editor.previewImage")
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ g(
+                E.div,
+                {
+                  className: f["picture-modal__preview-info"],
+                  initial: { opacity: 0, x: 20 },
+                  animate: { opacity: 1, x: 0 },
+                  transition: { delay: 0.15, duration: 0.2 },
+                  children: [
+                    /* @__PURE__ */ i("div", { className: f["picture-modal__preview-filename"], children: c.name }),
+                    /* @__PURE__ */ i("div", { className: f["picture-modal__preview-size"], children: s(c.size) })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ i(
+                E.div,
+                {
+                  className: f["picture-modal__preview-delete"],
+                  role: "button",
+                  onClick: () => {
+                    r(null), _(null);
+                  },
+                  initial: { opacity: 0, scale: 0.8 },
+                  animate: { opacity: 1, scale: 1 },
+                  transition: { delay: 0.2, duration: 0.2 },
+                  whileHover: { scale: 1.1 },
+                  whileTap: { scale: 0.95 },
+                  children: /* @__PURE__ */ i(D, { name: "delete" })
+                }
+              )
+            ]
+          },
+          "preview"
+        ) }),
+        /* @__PURE__ */ i(
+          "input",
+          {
+            ref: m,
+            type: "file",
+            accept: "image/*",
+            style: { display: "none" },
+            onChange: h
+          }
+        ),
+        d
+      ]
+    }
+  );
+});
+he.displayName = "UploadImage";
+const Ge = ce(
+  "INSERT_INLINE_IMAGE_COMMAND"
+), He = () => {
+  const { t: n } = N(), [e] = C(), [t, r] = w(!1), l = J(null), o = J(null), c = [
+    {
+      key: "upload",
+      title: n("editor.uploadImage"),
+      icon: /* @__PURE__ */ i(D, { name: "picture" })
+    },
+    {
+      key: "url",
+      title: n("editor.imageUrl"),
+      icon: /* @__PURE__ */ i(D, { name: "Insertlink" })
+    }
+  ], [_, m] = w(c[0].key), a = () => c.findIndex((v) => v.key === _) * 40, d = async () => {
+    try {
+      let s = "", v = "";
+      if (_ === "upload" && o.current) {
+        const x = await o.current.getValue();
+        s = x.src, v = x.fileName;
+      } else l.current && (s = await l.current.getValue(), v = s);
+      e.dispatchCommand(Ge, {
+        src: s,
+        altText: v
+      }), r(!1);
+    } catch (s) {
+      Y.error(s instanceof Error ? s.message : n("editor.operationFailed"));
+    }
+  }, u = {
+    upload: /* @__PURE__ */ i(he, { ref: o }),
+    url: /* @__PURE__ */ i(me, { ref: l })
+  };
+  return /* @__PURE__ */ g(V, { children: [
+    /* @__PURE__ */ i(b, { icon: "picture", tooltip: n("picture"), onClick: () => r(!0) }),
+    /* @__PURE__ */ g(_e, { title: n("addPicture"), open: t, onOpenChange: r, width: "620px", children: [
+      /* @__PURE__ */ g("div", { className: f["picture-modal__container"], children: [
+        /* @__PURE__ */ g("div", { className: f["picture-modal__sidebar"], children: [
+          /* @__PURE__ */ i(
+            "div",
+            {
+              className: f["picture-modal__slider"],
+              style: {
+                transform: `translateY(${a()}px)`
+              }
+            }
+          ),
+          /* @__PURE__ */ i("ul", { className: f["picture-modal__menu-list"], children: c.map((s) => /* @__PURE__ */ g(
+            "li",
+            {
+              className: `${f["picture-modal__menu-item"]} ${_ === s.key ? f["picture-modal__menu-item--active"] : ""}`,
+              onClick: () => m(s.key),
+              children: [
+                /* @__PURE__ */ i("span", { className: f["picture-modal__menu-icon"], children: s.icon }),
+                /* @__PURE__ */ i("span", { children: s.title })
+              ]
+            },
+            s.title
+          )) })
+        ] }),
+        /* @__PURE__ */ i("div", { className: f["picture-modal__content"], children: u[_] })
+      ] }),
+      /* @__PURE__ */ g("div", { className: f["picture-modal__footer"], children: [
+        /* @__PURE__ */ i(j, { onClick: () => r(!1), children: n("cancel") }),
+        /* @__PURE__ */ i(j, { type: "primary", onClick: d, children: n("confirm") })
+      ] })
+    ] })
+  ] });
+}, dt = {
+  bold: Re,
+  underline: Fe,
+  italic: De,
+  fontSize: Be,
+  fontColor: Ee,
+  fill: Pe,
+  align: je,
+  link: Ke,
+  unLink: Ve,
+  picture: He
+};
+export {
+  dt as B,
+  Ge as I,
+  Me as T,
+  B as g,
+  We as k,
+  q as m,
+  L as p,
+  $e as v
+};