import { resolveComponent as x, unref as e, openBlock as s, createElementBlock as n, createElementVNode as b, normalizeStyle as k, createVNode as f, toDisplayString as g, createCommentVNode as i, withDirectives as v, isRef as y, withModifiers as h, vModelText as _ } from "vue";
import { useUser as w, useColor as C, useMate as M } from "./composables-5f691338.js";
const V = {
  key: 0,
  class: "flex items-center"
}, B = {
  key: 0,
  class: "p-2"
}, D = {
  key: 2,
  class: "i-la-plus"
}, N = {
  key: 3,
  class: "i-la-times"
}, j = {
  __name: "MateButton",
  props: {
    pub: { type: String, default: "" }
  },
  setup(l) {
    const d = l, { user: r } = w(), p = C("deep"), { emoji: u, isMate: o, toggleMate: c } = M(d.pub);
    return (S, t) => {
      const m = x("account-badge");
      return e(r).is && e(r).pub != l.pub ? (s(), n("div", V, [
        b("button", {
          class: "flex items-center rounded-2xl shadow-xl px-2 text-3xl bg-light-500 dark-bg-dark-700",
          style: k({ backgroundColor: e(o) ? e(p).hex(l.pub) : "" }),
          onClick: t[2] || (t[2] = (a) => e(c)())
        }, [
          f(m, {
            pub: e(r).pub,
            "show-name": !1
          }, null, 8, ["pub"]),
          e(o) ? (s(), n("div", B, g(e(o)), 1)) : i("", !0),
          e(o) ? i("", !0) : v((s(), n("input", {
            key: 1,
            class: "mx-1 rounded-2xl w-46px p-2 rounded-lg shadow-inner text-center",
            "onUpdate:modelValue": t[0] || (t[0] = (a) => y(u) ? u.value = a : null),
            type: "text",
            placeholder: "",
            onClick: t[1] || (t[1] = h(() => {
            }, ["stop", "prevent"]))
          }, null, 512)), [
            [_, e(u)]
          ]),
          e(o) ? (s(), n("div", N)) : (s(), n("div", D))
        ], 4)
      ])) : i("", !0);
    };
  }
};
export {
  j as default
};
//# sourceMappingURL=MateButton-cd8539c1.js.map
