import { openBlock as t, createElementBlock as s, createVNode as d, TransitionGroup as c, withCtx as i, Fragment as u, renderList as p, normalizeStyle as _, createElementVNode as n, toDisplayString as r, unref as m } from "vue";
import { isEmoji as g } from "./composables-5f691338.js";
const x = { class: "p-2 flex flex-wrap bg-light-800 shadow-md rounded-xl gap-2" }, f = ["onClick"], h = { class: "text-4xl" }, k = /* @__PURE__ */ n("div", { class: "flex-1 w-4" }, null, -1), y = {
  key: 0,
  class: "i-la-angle-up"
}, v = {
  key: 1,
  class: "i-la-angle-down"
}, b = { class: "text-lg ml-1" }, B = {
  __name: "PostReactionTabs",
  props: {
    reactions: { type: Object, default: () => ({}) },
    current: { type: String, default: "" }
  },
  emits: ["update:current"],
  setup(l, { emit: o }) {
    return (w, C) => (t(), s("div", x, [
      d(c, { name: "fade" }, {
        default: i(() => [
          (t(!0), s(u, null, p(l.reactions, (a, e) => (t(), s("div", {
            class: "flex py-2 items-center cursor-pointer bg-light-100 dark-bg-dark-200 rounded-xl shadow-lg px-4",
            key: e,
            style: _([{ flex: "1 1 10px" }, { backgroundColor: l.current == e ? "#999" : "" }]),
            onClick: (j) => o("update:current", e)
          }, [
            n("div", h, r(m(g)(e) ? e : "👋"), 1),
            k,
            l.current == e ? (t(), s("div", y)) : (t(), s("div", v)),
            n("div", b, r(Object.keys(a).length), 1)
          ], 12, f))), 128))
        ]),
        _: 1
      })
    ]));
  }
};
export {
  B as default
};
//# sourceMappingURL=PostReactionTabs-35c4643d.js.map
