@levo-so/studio 0.1.102 → 0.1.104

package/VerifyButton-TNkt-SDu.js

@@ -0,0 +1,177 @@
+"use client";
+import { i as e, n as t, o as n, t as r } from "./Dialog-IrII0ugb.js";
+import { t as i } from "./Button-lUfKisu8.js";
+import { t as a } from "./CollectionInput-CpNGIXJx.js";
+import { c as o } from "react/compiler-runtime";
+import { errorToast as s, successToast as c, useLevo as l } from "@levo-so/react";
+import { useEffect as u, useState as d } from "react";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+import h from "clsx";
+import { IconCircleCheck as g, IconLoader as _ } from "@tabler/icons-react";
+//#region ../../libraries/levocn/dist/ui/spinner/Spinner.cssm.js
+var v = "_1k4xirc1", y = (e) => {
+	let t = o(8), n, r;
+	t[0] === e ? (n = t[1], r = t[2]) : ({className: n, ...r} = e, t[0] = e, t[1] = n, t[2] = r);
+	let i;
+	t[3] === n ? i = t[4] : (i = h(v, n), t[3] = n, t[4] = i);
+	let a;
+	return t[5] !== r || t[6] !== i ? (a = /* @__PURE__ */ p(_, {
+		role: "status",
+		"aria-label": "Loading",
+		className: i,
+		...r
+	}), t[5] = r, t[6] = i, t[7] = a) : a = t[7], a;
+}, b = "_6o7s4x0", x = "qkytrb0", S = "qkytrb1", C = "qkytrb2", w = "qkytrb3", T = "qkytrb4", E = "qkytrb5", D = "qkytrb6", O = ({ isOpen: o, onClose: f, value: h, type: g = "email", onVerifySuccess: _ }) => {
+	let { membership: v } = l(), [y, O] = d(""), [k, A] = d(!1), [j, M] = d(!1), [N, P] = d(30);
+	return u(() => {
+		let e;
+		return o && N > 0 && (e = setInterval(() => {
+			P((e) => e - 1);
+		}, 1e3)), () => clearInterval(e);
+	}, [o, N]), u(() => {
+		o && (O(""), P(30), A(!1), M(!1));
+	}, [o]), /* @__PURE__ */ p(n, {
+		open: o,
+		onOpenChange: (e) => {
+			e || f();
+		},
+		children: /* @__PURE__ */ m(t, {
+			className: b,
+			children: [/* @__PURE__ */ p(r, { children: /* @__PURE__ */ p(e, { children: `Verify ${g === "email" ? "Email" : "Phone"}` }) }), /* @__PURE__ */ m("div", {
+				className: x,
+				children: [
+					/* @__PURE__ */ m("div", {
+						className: S,
+						children: [
+							"Enter the 4-digit code sent to ",
+							/* @__PURE__ */ p("strong", { children: h }),
+							".",
+							" ",
+							/* @__PURE__ */ p("button", {
+								onClick: () => f(),
+								className: C,
+								children: "Change?"
+							})
+						]
+					}),
+					/* @__PURE__ */ p("div", {
+						className: w,
+						children: /* @__PURE__ */ p(a, {
+							value: y,
+							onChange: (e) => {
+								O(e.target.value.replace(/\D/g, "").slice(0, 4));
+							},
+							placeholder: "0000",
+							maxLength: 4,
+							className: E
+						})
+					}),
+					/* @__PURE__ */ m("div", {
+						className: T,
+						children: [/* @__PURE__ */ p(i, {
+							onClick: async () => {
+								if (!(!y || y.length !== 4)) {
+									A(!0);
+									try {
+										await v?.signInWithOtp({
+											content: h,
+											code: y
+										}), c("Verification successful"), _(h), f();
+									} catch (e) {
+										let t = e;
+										s(t?.message || "Invalid OTP", t?.title || "Verification Failed");
+									} finally {
+										A(!1);
+									}
+								}
+							},
+							disabled: y.length !== 4 || k,
+							className: "w-full",
+							children: k ? "Verifying..." : "Verify"
+						}), /* @__PURE__ */ p("div", {
+							className: D,
+							children: N > 0 ? /* @__PURE__ */ m("span", { children: [
+								"Resend code in ",
+								N,
+								"s"
+							] }) : /* @__PURE__ */ p("button", {
+								onClick: async () => {
+									if (!(N > 0)) {
+										M(!0);
+										try {
+											await v?.requestOtp({
+												content: h,
+												medium: g === "phone" ? "whatsapp" : "email"
+											}), c("OTP resent successfully"), P(30);
+										} catch (e) {
+											let t = e;
+											s(t?.message || "Failed to resend OTP", t?.title || "Error");
+										} finally {
+											M(!1);
+										}
+									}
+								},
+								disabled: j,
+								className: C,
+								children: j ? "Resending..." : "Resend Code"
+							})
+						})]
+					})
+				]
+			})]
+		})
+	});
+}, k = "jfrbe10", A = "jfrbe11", j = "jfrbe12", M = ({ value: e, type: t, isVerified: n, onVerifySuccess: r, onStateChange: a }) => {
+	let { membership: o } = l(), [c, u] = d(!1), [h, _] = d(!1), v = (e) => {
+		a && a(e);
+	}, b = async () => {
+		let n = e?.trim()?.toLowerCase();
+		if (!n) {
+			s(`Please enter a ${t}`);
+			return;
+		}
+		if (t === "email" && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(n)) {
+			s("Please enter a valid email address");
+			return;
+		}
+		_(!0), v(!0);
+		try {
+			await o?.requestOtp({
+				content: n,
+				medium: t === "phone" ? "whatsapp" : "email"
+			}), u(!0);
+		} catch (e) {
+			let t = e;
+			s(t?.message || "Failed to send OTP", t?.title || "Error"), v(!1);
+		} finally {
+			_(!1);
+		}
+	}, x = () => {
+		u(!1), v(!1);
+	};
+	return n ? /* @__PURE__ */ m("div", {
+		className: k,
+		children: [/* @__PURE__ */ p(g, { className: j }), /* @__PURE__ */ p("span", {
+			className: A,
+			children: "Verified"
+		})]
+	}) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(i, {
+		size: "default",
+		variant: "ghost",
+		onClick: b,
+		onMouseDown: (e) => e.preventDefault(),
+		disabled: !e || h,
+		type: "button",
+		children: h ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(y, { size: 14 }), "Sending..."] }) : "Verify"
+	}), c && /* @__PURE__ */ p(O, {
+		isOpen: c,
+		onClose: x,
+		value: e?.trim()?.toLowerCase() || "",
+		type: t,
+		onVerifySuccess: (e) => {
+			r(e), x();
+		}
+	})] });
+};
+//#endregion
+export { b as n, y as r, M as t };