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