import { X as w, M as h, S as c, L as F, am as s, a6 as r, G as i, Y as e, F as o, an as $, ao as V, ap as S, Z as u, aq as A, $ as x, w as v, a3 as k, O as p, a2 as M, a as G, ar as E, U as T, af as C, a7 as l, a8 as n, a9 as I, aa as z, ac as B, ab as O, ad as b, aj as m, as as P, at as j, ak as N, au as R } from "./603b75d9.js";
import { useContext as y } 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(), L = [N, R], H = [{
  label: /* @__PURE__ */ o($, {}),
  value: "flex-start"
}, {
  label: /* @__PURE__ */ o(V, {}),
  value: "center"
}, {
  label: /* @__PURE__ */ o(S, {}),
  value: "flex-end"
}], q = {
  avatar: u(A, "avatar"),
  style: u(x, "style"),
  maxCount: v(b, 3),
  avatarSize: v(b, 40),
  alignment: k(H, "center"),
  autoColor: p.DEFAULT_TRUE,
  onEvent: M(L),
  currentAvatar: G({}),
  avatars: E(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(m.Group, {
    maxCount: a.maxCount,
    size: a.avatarSize,
    children: a.avatars.map((t, f) => {
      var d;
      return /* @__PURE__ */ o(P, {
        title: t.Tooltip,
        children: /* @__PURE__ */ o(m, {
          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(j("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(y(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(y(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 J = z(X, [new B("currentAvatar", e("avatarGroup.currentAvatar")), O]);
export {
  J as AvatarGroupComp,
  H as alignOptions
};
