import { defineComponent as C, ref as f, createElementBlock as a, createCommentVNode as s, unref as o, openBlock as u, normalizeStyle as v, createElementVNode as n, createBlock as w, withModifiers as d, withDirectives as A, vModelText as E, nextTick as $ } from "vue";
import { useColor as b, useUser as B, useRefHistory as P, SEA as S, updateProfile as T } from "./composables-BAZQlC3e.js";
import { AccountAvatar as U } from "./components.js";
const V = { class: "flex justify-center my-4" }, j = {
  key: 0,
  class: "button w-full flex justify-center items-center",
  type: "submit"
}, R = /* @__PURE__ */ C({
  __name: "AuthCreate",
  setup(z) {
    const m = b("deep");
    b("light");
    const { user: p, auth: x } = B(), r = f(""), t = f(null), { history: y, undo: k } = P(t);
    async function i() {
      t.value = await S.pair();
    }
    i();
    function g() {
      x(t.value, () => $(() => {
        T("name", r.value);
      }));
    }
    return (D, e) => {
      var c;
      return o(p).is ? s("", !0) : (u(), a("div", {
        key: 0,
        class: "flex flex-col items-center flex-1 p-2 bg-light-700 dark-bg-dark-200 rounded-3xl shadow-lg text-center p-4 transition duration-300ms ease-in",
        style: v({ backgroundColor: o(m).hex(((c = t.value) == null ? void 0 : c.pub) || "") })
      }, [
        e[7] || (e[7] = n("div", { class: "text-xl font-bold" }, "Create a new account", -1)),
        e[8] || (e[8] = n("div", { class: "mb-4 mt-2" }, "Tap the circle to generate a new key", -1)),
        t.value ? (u(), w(o(U), {
          key: 0,
          class: "cursor-pointer rounded-full shadow-xl border-8",
          pub: t.value.pub,
          size: 200,
          style: v({ borderColor: o(m).hex(t.value.pub) }),
          onClick: e[0] || (e[0] = (l) => i())
        }, null, 8, ["pub", "style"])) : s("", !0),
        n("form", {
          class: "flex flex-col",
          onSubmit: e[4] || (e[4] = d((l) => g(), ["prevent"]))
        }, [
          n("div", V, [
            o(y).length > 2 ? (u(), a("button", {
              key: 0,
              class: "m-2 button items-center",
              type: "button",
              onClick: e[1] || (e[1] = d((l) => o(k)(), ["stop"]))
            }, e[5] || (e[5] = [
              n("div", { class: "i-la-undo text-2xl" }, null, -1)
            ]))) : s("", !0),
            n("button", {
              class: "m-2 button items-center",
              type: "button",
              onClick: e[2] || (e[2] = d((l) => i(), ["stop"]))
            }, e[6] || (e[6] = [
              n("div", { class: "i-fad-random-1dice text-3xl" }, null, -1)
            ]))
          ]),
          A(n("input", {
            class: "p-4 rounded-2xl my-2 dark-bg-dark-200",
            "onUpdate:modelValue": e[3] || (e[3] = (l) => r.value = l),
            placeholder: "Enter your name or nickname",
            autocomplete: "username"
          }, null, 512), [
            [E, r.value]
          ]),
          t.value && !o(p).is && r.value ? (u(), a("button", j, "Authenticate")) : s("", !0)
        ], 32)
      ], 4));
    };
  }
});
export {
  R as default
};
//# sourceMappingURL=AuthCreate-bsmvTbFy.js.map
