import { defineComponent as c, computed as p, createElementBlock as o, createCommentVNode as f, unref as e, openBlock as n, normalizeStyle as r, createElementVNode as l, createVNode as a, toDisplayString as v } from "vue";
import { UserAvatar as b, MateButton as k } from "./components.js";
import { useUser as x, useColor as _, useBackground as g } from "./composables-BAZQlC3e.js";
const y = { class: "flex items-center" }, C = { class: "text-2xl mx-2 font-bold" }, w = {
  key: 0,
  class: "i-la-lock"
}, B = {
  key: 1,
  class: "i-la-unlock"
}, $ = /* @__PURE__ */ c({
  __name: "UserPanel",
  emits: ["browse"],
  setup(z, { emit: N }) {
    const { user: t, leave: u } = x();
    _("deep");
    const d = p(() => g({ pub: t.pub, size: 600, light: 0.5, draw: "circles" }));
    return (U, s) => {
      var i;
      return e(t).is ? (n(), o("div", {
        key: 0,
        class: "p-4 flex items-center w-full",
        style: r({ ...d.value })
      }, [
        l("div", y, [
          a(e(b), { size: 120 }),
          l("div", C, v((i = e(t)) == null ? void 0 : i.name), 1)
        ]),
        a(e(k), {
          pub: e(t).pub
        }, null, 8, ["pub"]),
        s[3] || (s[3] = l("div", { class: "flex-1" }, null, -1)),
        l("div", {
          class: "p-1 m-1 rounded-full transition-all duration-300 ease-in-out",
          style: r({ backgroundColor: e(t).blink ? "white" : "black" })
        }, null, 4),
        l("button", {
          class: "p-2 text-2xl",
          onClick: s[0] || (s[0] = (m) => e(t).db.get("safe").get("saved").put(!e(t).safe.saved))
        }, [
          e(t).safe.saved ? (n(), o("div", w)) : (n(), o("div", B))
        ]),
        l("button", {
          class: "text-2xl ml-1 p-2",
          onClick: s[1] || (s[1] = (m) => e(u)())
        }, s[2] || (s[2] = [
          l("div", { class: "i-ion-exit-outline" }, null, -1)
        ]))
      ], 4)) : f("", !0);
    };
  }
});
export {
  $ as default
};
//# sourceMappingURL=UserPanel-GPRGmECM.js.map
