import { useContext as b, useRef as se, useState as C, useEffect as S } from "react";
import { cj as u, eP as ie, eM as E, w as I, a4 as a, X as k, V as F, a9 as ce, a5 as W, eQ as de, aG as me, ej as L, v as ue, U as pe, H as n, ad as l, I as V, ae as c, af as d, am as v, ag as he, ah as ge, aj as f, ai as ye, aD as be, aE as Ce, eR as M, eS as ve, eT as fe, az as we, eU as X, aA as De, c8 as xe, ar as Ae, eV as Se, eW as Ee, eX as Ie, _ as m, aq as ke, eY as Le } from "./56c67d3b.js";
import { commentDate as Ve, convertCommentData as Me, checkUserInfoData as Te, checkMentionListData as Ne, CommentDataTooltip as je, CommentUserDataTooltip as Pe } from "./b8c81969.js";
import "react-dom";
u.extend(ie);
const Ue = [Ae, Se, Ee, Ie], Be = {
  value: E(Me, Ve),
  title: I(k, a("comment.titledDefaultValue")),
  placeholder: I(k, a("comment.placeholder")),
  buttonText: I(k, a("comment.buttonText")),
  sendCommentAble: F.DEFAULT_TRUE,
  deleteAble: F,
  userInfo: E(Te, {
    name: "{{currentUser.name}}",
    email: "{{currentUser.email}}"
  }),
  mentionList: E(Ne, {
    "@": ["John Doe", "Jane Doe", "Michael Smith", "Emily Davis", "Robert Johnson", "Patricia Brown", "William Jones", "Jennifer Miller", "David Wilson", "Linda Moore"],
    "#": ["#lowcode", "#automation", "#appbuilder", "#nocode", "#workflow", "#draganddrop", "#rapiddevelopment", "#digitaltransformation", "#integration", "#api"]
  }),
  onEvent: ce(Ue),
  style: W(de, "style"),
  animationStyle: W(me, "animationStyle"),
  commentList: L("commentList", []),
  deletedItem: L("deletedItem", []),
  submitedItem: L("submitedItem", []),
  mentionName: ue("")
}, He = (t) => {
  const p = se(null), {
    value: N,
    dispatch: _,
    style: s,
    title: w,
    sendCommentAble: K,
    buttonText: $,
    onEvent: Re,
    mentionList: g,
    userInfo: q,
    placeholder: G,
    deleteAble: Q,
    animationStyle: y
  } = t, [j, Z] = C([]), [r, D] = C([]), [ee, te] = C("@"), [x, P] = C(""), A = (e) => {
    Z(m.merge(e, {
      "@": m.union(m.concat(e["@"], m.map(r, (o, i) => {
        var h;
        return (h = o == null ? void 0 : o.user) == null ? void 0 : h.name;
      })))
    }));
  };
  S(() => {
    D(N);
  }, [N]), S(() => {
    A(g);
  }, [g]), S(() => {
    t.commentList.onChange(r), A(g), setTimeout(() => {
      p.current && (p.current.scrollTop = 999999);
    }, 50);
  }, [r]);
  const ne = (e, o) => {
    te(o);
  }, ae = (e) => {
    var o, i, h, B, H, R, J, O, Y, z;
    return /* @__PURE__ */ l(ke, {
      onClick: () => t.onEvent("click"),
      style: {
        backgroundColor: (o = e == null ? void 0 : e.user) != null && o.avatar ? "" : Le(((i = e == null ? void 0 : e.user) == null ? void 0 : i.displayName) === void 0 ? (h = e == null ? void 0 : e.user) == null ? void 0 : h.name : (B = e == null ? void 0 : e.user) == null ? void 0 : B.displayName)[1],
        verticalAlign: "middle"
      },
      src: (H = e == null ? void 0 : e.user) == null ? void 0 : H.avatar,
      children: [" ", (R = e == null ? void 0 : e.user) != null && R.displayName ? (J = e == null ? void 0 : e.user) == null ? void 0 : J.displayName : /^([\u4e00-\u9fa5]{2,4})$/gi.test((O = e == null ? void 0 : e.user) == null ? void 0 : O.name) ? (Y = e == null ? void 0 : e.user) == null ? void 0 : Y.name.slice(-2) : (z = e == null ? void 0 : e.user) == null ? void 0 : z.name[0]]
    });
  }, oe = (e) => {
    P(e);
  }, U = () => {
    let e = {
      user: q,
      value: x,
      createdAt: u().format()
    };
    t.submitedItem.onChange(e), D(m.concat(r, [e])), P(""), A(g), t.onEvent("submit");
  }, le = (e) => {
    let o = m.cloneDeep(r);
    t.deletedItem.onChange(o.splice(e, 1)), D(o), t.onEvent("delete");
  }, re = (e) => {
    e.shiftKey && (e.preventDefault(), U());
  };
  return /* @__PURE__ */ n("div", {
    style: {
      margin: s.margin ?? "3px",
      padding: s.padding ?? "3px",
      width: be(s.margin ?? "3px"),
      height: Ce(s.margin ?? "3px"),
      background: s.background,
      borderRadius: s.radius,
      animation: y.animation,
      animationDelay: y.animationDelay,
      animationDuration: y.animationDuration,
      animationIterationCount: y.animationIterationCount
    },
    children: /* @__PURE__ */ l("div", {
      style: {
        overflow: "auto",
        overflowX: "hidden",
        height: "100%"
      },
      ref: p,
      children: [/* @__PURE__ */ n(M, {
        header: w !== "" ? /* @__PURE__ */ n("div", {
          style: {
            position: "sticky",
            top: 0,
            background: s.background
          },
          children: r.length > 1 ? w.replaceAll("%d", r.length.toString()).replace("comment", "comments") : w.replaceAll("%d", r.length.toString())
        }) : "",
        size: "small",
        children: /* @__PURE__ */ n(ve, {
          data: r,
          itemKey: "createdAt",
          children: (e, o) => {
            var i;
            return /* @__PURE__ */ n(M.Item, {
              actions: Q ? [/* @__PURE__ */ n(fe, {
                style: {
                  color: "#c32230"
                },
                onClick: () => le(o)
              })] : void 0,
              children: /* @__PURE__ */ n(M.Item.Meta, {
                avatar: ae(e),
                title: /* @__PURE__ */ l("div", {
                  onClick: () => t.onEvent("click"),
                  children: [/* @__PURE__ */ n("a", {
                    children: (i = e == null ? void 0 : e.user) == null ? void 0 : i.name
                  }), /* @__PURE__ */ n(we, {
                    title: u(e == null ? void 0 : e.createdAt).isValid() ? u(e == null ? void 0 : e.createdAt).format("YYYY/M/D HH:mm:ss") : a("comment.dateErr"),
                    placement: "bottom",
                    children: /* @__PURE__ */ n("span", {
                      style: {
                        paddingLeft: "5px",
                        color: "#999",
                        fontSize: "11px"
                      },
                      children: u(e == null ? void 0 : e.createdAt).isValid() ? u(e == null ? void 0 : e.createdAt).fromNow() : a("comment.dateErr")
                    })
                  })]
                }),
                description: /* @__PURE__ */ n("span", {
                  children: e == null ? void 0 : e.value
                })
              })
            }, e == null ? void 0 : e.createdAt);
          }
        })
      }), K ? /* @__PURE__ */ l("div", {
        style: {
          position: "sticky",
          bottom: 0,
          background: s.background
        },
        children: [/* @__PURE__ */ n(X, {
          style: {
            width: "100%",
            height: 50
          },
          onSearch: ne,
          prefix: Object.keys(j),
          onChange: oe,
          onSelect: (e) => {
            _(De("mentionName", e == null ? void 0 : e.value, !1)), t.onEvent("mention");
          },
          value: x,
          rows: 2,
          onPressEnter: re,
          placeholder: G,
          children: (j[ee] || []).map((e, o) => /* @__PURE__ */ n(X.Option, {
            value: e,
            children: e
          }, o.toString()))
        }), /* @__PURE__ */ n(xe, {
          type: "primary",
          style: {
            width: "100%",
            marginTop: "10px"
          },
          onClick: U,
          disabled: x === "",
          children: $
        })]
      }) : ""]
    })
  });
};
let T = function() {
  return new pe(Be, (t, p) => /* @__PURE__ */ n(He, {
    ...t,
    dispatch: p
  })).setPropertyViewFn((t) => /* @__PURE__ */ l(V, {
    children: [/* @__PURE__ */ n(c, {
      name: d.basic,
      children: t.title.propertyView({
        label: a("comment.title")
      })
    }), (b(v).editorModeStatus === "logic" || b(v).editorModeStatus === "both") && /* @__PURE__ */ l(V, {
      children: [/* @__PURE__ */ l(c, {
        name: d.data,
        children: [t.value.propertyView({
          label: a("comment.value"),
          tooltip: je,
          placeholder: "[]"
        }), t.userInfo.propertyView({
          label: a("comment.userInfo"),
          tooltip: Pe
        }), t.mentionList.propertyView({
          label: a("comment.mentionList"),
          tooltip: a("comment.mentionListDec")
        })]
      }), /* @__PURE__ */ l(c, {
        name: d.interaction,
        children: [t.onEvent.getPropertyView(), he(t), t.sendCommentAble.propertyView({
          label: a("comment.showSendButton")
        }), t.deleteAble.propertyView({
          label: a("comment.deleteAble")
        })]
      })]
    }), (b(v).editorModeStatus === "layout" || b(v).editorModeStatus === "both") && /* @__PURE__ */ l(V, {
      children: [/* @__PURE__ */ l(c, {
        name: d.layout,
        children: [t.sendCommentAble.getView() && t.buttonText.propertyView({
          label: a("comment.buttonTextDec")
        }), t.placeholder.propertyView({
          label: a("comment.placeholderDec")
        })]
      }), /* @__PURE__ */ n(c, {
        name: d.style,
        children: t.style.getPropertyView()
      }), /* @__PURE__ */ n(c, {
        name: d.animationStyle,
        hasTooltip: !0,
        children: t.animationStyle.getPropertyView()
      })]
    })]
  })).build();
}();
T = class extends T {
  autoHeight() {
    return !1;
  }
};
const Fe = ge(T, [new f("commentList", a("comment.commentList")), new f("deletedItem", a("comment.deletedItem")), new f("submitedItem", a("comment.submitedItem")), new f("mentionName", a("comment.submitedItem")), ye]);
export {
  Fe as CommentComp
};
