import { currentRoom as d, useRoom as f, useGun as g, useUser as v, useRoomLogo as _, openBlock as t, createElementBlock as s, createBaseVNode as l, unref as e, createBlock as b, withCtx as k, withModifiers as x, createCommentVNode as y } from "./composables-61bf5e40.js";
import { FormPicture as h } from "./components.js";
const R = { class: "flex flex-col relative items-center justify-center" }, B = ["src"], L = { class: "text-2xl" }, N = {
  key: 0,
  class: "i-la-camera"
}, P = {
  __name: "RoomLogo",
  props: {
    pub: { type: String, default: d.pub },
    size: { type: Number, default: 120 },
    pic: { type: Number, default: 200 }
  },
  setup(n) {
    const r = n, { room: a, updateRoomProfile: C } = f();
    g();
    const { user: c } = v(), { logo: i, uploadLogo: p, removeLogo: m } = _(r.pub);
    return (j, o) => (t(), s("div", R, [
      l("img", {
        src: e(i) || "https://gun-vue.js.org/media/gun-vue-logo.svg"
      }, null, 8, B),
      e(a).hosts[e(c).pub] ? (t(), b(e(h), {
        key: 0,
        class: "absolute",
        options: { picSize: r.pic, preserveRatio: !1 },
        onUpdate: o[1] || (o[1] = (u) => e(p)(u))
      }, {
        default: k(() => [
          l("div", L, [
            e(i) ? (t(), s("div", {
              key: 1,
              class: "i-la-trash-alt",
              onClick: o[0] || (o[0] = x((u) => e(m)(), ["stop", "prevent"]))
            })) : (t(), s("div", N))
          ])
        ]),
        _: 1
      }, 8, ["options"])) : y("", !0)
    ]));
  }
};
export {
  P as default
};
//# sourceMappingURL=RoomLogo-59e57d3c.js.map
