import { defineComponent as d, useUser as p, useGuests as _, computed as f, openBlock as t, createElementBlock as o, createVNode as k, withCtx as b, Fragment as v, renderList as y, unref as s, createBlock as h, normalizeStyle as C, TransitionGroup as x, withModifiers as B, joinRoom as w, createCommentVNode as G, createBaseVNode as l } from "./composables-Ci32s3jE.js";
import { AccountBadge as N } from "./components.js";
const V = { class: "flex flex-wrap" }, $ = /* @__PURE__ */ l("div", { class: "i-la-plus" }, null, -1), g = /* @__PURE__ */ l("div", { class: "ml-2" }, "Join", -1), z = [
  $,
  g
], A = /* @__PURE__ */ d({
  __name: "GuestList",
  props: {
    state: { type: String, default: "online" }
  },
  emits: ["user"],
  setup(u, { emit: L }) {
    const { user: n } = p(), r = _(), a = f(() => r.guests[n.pub]);
    return (c, i) => (t(), o("div", V, [
      k(x, { name: "fade" }, {
        default: b(() => [
          (t(!0), o(v, null, y(s(r)[u.state], (e, m) => (t(), h(s(N), {
            class: "shadow-md m-1",
            key: m,
            size: 30,
            pub: e.pub,
            style: C({ opacity: e.online ? 1 : 0.5, order: e.order }),
            onClick: (R) => c.$emit("user", e.pub)
          }, null, 8, ["pub", "style", "onClick"]))), 128))
        ]),
        _: 1
      }),
      s(n).is && !a.value ? (t(), o("button", {
        key: 0,
        class: "button flex items-center m-4 p-2",
        onClick: i[0] || (i[0] = B((e) => s(w)(), ["stop", "prevent"]))
      }, z)) : G("", !0)
    ]));
  }
});
export {
  A as default
};
//# sourceMappingURL=GuestList-B4cA3Kmo.js.map
