import { defineComponent as d, createElementBlock as s, openBlock as o, createVNode as a, unref as e, withCtx as m, createElementVNode as f, withModifiers as v } from "vue";
import { useUser as x, useUserAvatar as _ } from "./composables-BAZQlC3e.js";
import { AccountAvatar as b, FormPicture as k } from "./components.js";
const y = { class: "flex flex-col relative items-center justify-center" }, z = { class: "text-2xl" }, A = {
  key: 0,
  class: "i-la-camera"
}, w = /* @__PURE__ */ d({
  __name: "UserAvatar",
  props: {
    size: { type: Number, default: 120 },
    pic: { type: Number, default: 200 }
  },
  setup(r) {
    const { user: n } = x(), l = r, { remove: c, upload: p, avatar: u } = _();
    return (N, t) => (o(), s("div", y, [
      a(e(b), {
        pub: e(n).pub,
        size: r.size
      }, null, 8, ["pub", "size"]),
      a(e(k), {
        class: "absolute",
        options: { picSize: l.pic, preserveRatio: !1 },
        onUpdate: t[1] || (t[1] = (i) => e(p)(i))
      }, {
        default: m(() => [
          f("div", z, [
            e(u) ? (o(), s("div", {
              key: 1,
              class: "i-la-trash-alt",
              onClick: t[0] || (t[0] = v((i) => e(c)(), ["stop", "prevent"]))
            })) : (o(), s("div", A))
          ])
        ]),
        _: 1
      }, 8, ["options"])
    ]));
  }
});
export {
  w as default
};
//# sourceMappingURL=UserAvatar-D6j-9dDL.js.map
