import { a3 as w, M as h, X as c, P as F, at as s, ad as r, I as i, a4 as e, H as o, au as V, av as $, aw as A, a5 as u, ax as x, a6 as S, w as v, aa as k, V as M, a9 as p, a as E, ay as G, U as T, am as C, ae as l, af as n, ag as I, ah as z, aj as B, ai as P, ak as b, aq as y, az as j, aA as N, ar as O, aB as R } from "./56c67d3b.js";
import { useContext as m } from "react";
import "react-dom";
const g = ["#fde68a", "#eecff3", "#a7f3d0", "#bfdbfe", "#bfdbfe", "#c7d2fe", "#fecaca", "#fcd6bb"], U = w.div`
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: ${(a) => a.alignment};
  cursor: pointer;
  background: ${(a) => {
  var t;
  return (t = a == null ? void 0 : a.$style) == null ? void 0 : t.background;
}};
  margin: ${(a) => {
  var t;
  return (t = a == null ? void 0 : a.$style) == null ? void 0 : t.margin;
}};
  padding: ${(a) => {
  var t;
  return (t = a == null ? void 0 : a.$style) == null ? void 0 : t.padding;
}};
  border: ${(a) => {
  var t;
  return (t = a == null ? void 0 : a.$style) == null ? void 0 : t.border;
}};
  border-style: ${(a) => {
  var t;
  return (t = a == null ? void 0 : a.$style) == null ? void 0 : t.borderStyle;
}};
  border-radius: ${(a) => {
  var t;
  return (t = a == null ? void 0 : a.$style) == null ? void 0 : t.radius;
}};
  border-width: ${(a) => {
  var t;
  return (t = a == null ? void 0 : a.$style) == null ? void 0 : t.borderWidth;
}};
`, D = new h({
  src: c,
  AvatarIcon: F,
  label: c,
  color: s,
  backgroundColor: s,
  Tooltip: c
}, (a) => a).setPropertyViewFn((a) => /* @__PURE__ */ r(i, {
  children: [a.src.propertyView({
    label: e("avatarComp.src"),
    placeholder: "",
    tooltip: e("avatarComp.avatarCompTooltip")
  }), a.label.propertyView({
    label: e("avatarComp.title"),
    tooltip: e("avatarComp.avatarCompTooltip")
  }), a.AvatarIcon.propertyView({
    label: e("avatarComp.icon"),
    IconType: "All",
    tooltip: e("avatarComp.avatarCompTooltip")
  }), a.color.propertyView({
    label: e("style.fill")
  }), a.backgroundColor.propertyView({
    label: e("style.background")
  }), a.Tooltip.propertyView({
    label: e("badge.tooltip")
  })]
})).build(), H = [O, R], L = [{
  label: /* @__PURE__ */ o(V, {}),
  value: "flex-start"
}, {
  label: /* @__PURE__ */ o($, {}),
  value: "center"
}, {
  label: /* @__PURE__ */ o(A, {}),
  value: "flex-end"
}], q = {
  avatar: u(x, "avatar"),
  style: u(S, "style"),
  maxCount: v(b, 3),
  avatarSize: v(b, 40),
  alignment: k(L, "center"),
  autoColor: M.DEFAULT_TRUE,
  onEvent: p(H),
  currentAvatar: E({}),
  avatars: G(D, {
    initOptions: [{
      src: "https://api.dicebear.com/7.x/miniavs/svg?seed=1",
      label: String.fromCharCode(65 + Math.ceil(Math.random() * 25))
    }, {
      AvatarIcon: "/icon:antd/startwotone"
    }, {
      label: String.fromCharCode(65 + Math.ceil(Math.random() * 25))
    }, {
      label: String.fromCharCode(65 + Math.ceil(Math.random() * 25))
    }]
  })
}, W = (a) => /* @__PURE__ */ o(U, {
  $style: a.style,
  alignment: a.alignment,
  children: /* @__PURE__ */ o(y.Group, {
    maxCount: a.maxCount,
    size: a.avatarSize,
    children: a.avatars.map((t, f) => {
      var d;
      return /* @__PURE__ */ o(j, {
        title: t.Tooltip,
        children: /* @__PURE__ */ o(y, {
          src: t.src ?? void 0,
          icon: ((d = t.AvatarIcon) == null ? void 0 : d.props.value) === "" || t.label.trim() !== "" ? void 0 : t.AvatarIcon,
          style: {
            color: t.color ? t.color : a.avatar.fill !== "#FFFFFF" ? a.avatar.fill : "#FFFFFF",
            backgroundColor: t.backgroundColor ? t.backgroundColor : a.autoColor ? g[f % g.length] : a.avatar.background
          },
          size: a.avatarSize,
          onClick: () => {
            a.onEvent("click"), a.dispatch(N("currentAvatar", t, !1));
          },
          children: t.label
        })
      });
    })
  })
});
let X = function() {
  return new T(q, (a, t) => /* @__PURE__ */ o(W, {
    ...a,
    dispatch: t
  })).setPropertyViewFn((a) => /* @__PURE__ */ r(i, {
    children: [["logic", "both"].includes(m(C).editorModeStatus) && /* @__PURE__ */ r(i, {
      children: [/* @__PURE__ */ r(l, {
        name: n.basic,
        children: [a.avatars.propertyView({}), a.maxCount.propertyView({
          label: e("avatarGroup.maxCount")
        }), a.avatarSize.propertyView({
          label: e("avatarGroup.avatarSize")
        }), a.autoColor.propertyView({
          label: e("avatarGroup.autoColor")
        }), a.alignment.propertyView({
          label: e("avatarGroup.alignment"),
          radioButton: !0
        })]
      }), /* @__PURE__ */ r(l, {
        name: n.interaction,
        children: [I(a), a.onEvent.propertyView()]
      })]
    }), ["layout", "both"].includes(m(C).editorModeStatus) && /* @__PURE__ */ r(i, {
      children: [/* @__PURE__ */ o(l, {
        name: n.avatarStyle,
        children: a.avatar.getPropertyView()
      }), /* @__PURE__ */ o(l, {
        name: n.style,
        children: a.style.getPropertyView()
      })]
    })]
  })).build();
}();
const Q = z(X, [new B("currentAvatar", e("avatarGroup.currentAvatar")), P]);
export {
  Q as AvatarGroupComp,
  L as alignOptions
};
