@solidxai/core-ui 0.0.1

package/dist/components/auth/SolidInitialLoginOtp.d.ts

@@ -0,0 +1,3 @@
+declare const SolidInitialLoginOtp: () => import("react/jsx-runtime").JSX.Element;
+export default SolidInitialLoginOtp;
+//# sourceMappingURL=SolidInitialLoginOtp.d.ts.map

package/dist/components/auth/SolidInitialLoginOtp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidInitialLoginOtp.d.ts","sourceRoot":"","sources":["../../../src/components/auth/SolidInitialLoginOtp.tsx"],"names":[],"mappings":"AAmBA,QAAA,MAAM,oBAAoB,+CAiNzB,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/dist/components/auth/SolidInitialLoginOtp.js

@@ -0,0 +1,220 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useInitateLoginMutation } from "../../redux/api/authApi";
+import { Form, Formik } from "formik";
+import Image from "../common/Image";
+import { useRouter } from "../../hooks/useRouter";
+import { useSearchParams } from "../../hooks/useSearchParams";
+import { Button } from "primereact/button";
+import { InputOtp } from "primereact/inputotp";
+import { Message } from "primereact/message";
+import { Toast } from "primereact/toast";
+import { useEffect, useRef, useState } from "react";
+import * as Yup from "yup";
+import SolidLogo from '../../resources/images/SolidXLogo.svg';
+import { signInWithOtp } from "../../adapters/auth/index";
+import { ERROR_MESSAGES } from "../../constants/error-messages";
+import { useLazyGetAuthSettingsQuery } from "../../redux/api/solidSettingsApi";
+import { env } from "../../adapters/env";
+import showToast from "../../helpers/showToast";
+var SolidInitialLoginOtp = function () {
+    var _a, _b, _c, _d, _e;
+    var searchParams = useSearchParams();
+    var tempIdentifier = searchParams.get('identifier');
+    var type = searchParams.get('type') || 'email';
+    var identifier = tempIdentifier ? decodeURIComponent(tempIdentifier) : '';
+    var RESEND_OTP_KEY = "resendOtpLogin_".concat(identifier);
+    var RESEND_OTP_TIMER_MIN = parseFloat(env("NEXT_PUBLIC_RESEND_OTP_TIMER") || '0.5');
+    var RESEND_OTP_TIMER = Math.round(RESEND_OTP_TIMER_MIN * 60);
+    var _f = useLazyGetAuthSettingsQuery(), trigger = _f[0], solidSettingsData = _f[1].data;
+    useEffect(function () {
+        trigger(""); // Fetch settings on mount
+    }, [trigger]);
+    var initiateResendOTP = useInitateLoginMutation()[0];
+    var toast = useRef(null);
+    var router = useRouter();
+    var _g = useState(RESEND_OTP_TIMER), timeLeft = _g[0], setTimeLeft = _g[1];
+    var _h = useState(false), resendEnabled = _h[0], setResendEnabled = _h[1];
+    var getDisplayText = function () {
+        switch (type) {
+            case "mobile":
+                return {
+                    title: "OTP Verification",
+                    subtitle: "Please enter the OTP sent to your mobile number to complete verification"
+                };
+            case "transactional":
+                return {
+                    title: "OTP Verification",
+                    subtitle: "Please enter the OTP for your transaction to complete verification"
+                };
+            case "email":
+            default:
+                return {
+                    title: "OTP Verification",
+                    subtitle: "Please enter the OTP sent to your email to complete verification"
+                };
+        }
+    };
+    var displayText = getDisplayText();
+    useEffect(function () {
+        // Set timer if not already set (e.g., after login)
+        var storedTime = localStorage.getItem(RESEND_OTP_KEY);
+        if (!storedTime) {
+            localStorage.setItem(RESEND_OTP_KEY, Date.now().toString());
+        }
+        var lastSent = storedTime ? parseInt(storedTime, 10) : Date.now();
+        var elapsed = Math.floor((Date.now() - lastSent) / 1000);
+        var remaining = RESEND_OTP_TIMER - elapsed;
+        if (remaining > 0) {
+            setTimeLeft(remaining);
+            setResendEnabled(false);
+        }
+        else {
+            setTimeLeft(0);
+            setResendEnabled(true);
+        }
+    }, [identifier]);
+    useEffect(function () {
+        if (resendEnabled || timeLeft <= 0)
+            return;
+        var interval = setInterval(function () {
+            setTimeLeft(function (prev) {
+                if (prev <= 1) {
+                    clearInterval(interval);
+                    setResendEnabled(true);
+                    return 0;
+                }
+                return prev - 1;
+            });
+        }, 1000);
+        return function () { return clearInterval(interval); };
+    }, [resendEnabled, timeLeft]);
+    var validationSchema = Yup.object({
+        otp: Yup.string()
+            .matches(/^\d{6}$/, ERROR_MESSAGES.OTP_CHARACTER(6))
+            .required(ERROR_MESSAGES.FIELD_REUQIRED('OTP')),
+    });
+    var isFormFieldValid = function (formik, fieldName) {
+        return formik.touched[fieldName] && formik.errors[fieldName];
+    };
+    var handleResendOtp = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var payload, response, err_1;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    _c.trys.push([0, 2, , 3]);
+                    payload = {
+                        type: type,
+                        identifier: identifier,
+                    };
+                    return [4 /*yield*/, initiateResendOTP(payload).unwrap()];
+                case 1:
+                    response = _c.sent();
+                    if ((response === null || response === void 0 ? void 0 : response.statusCode) === 200) {
+                        showToast(toast, "success", ERROR_MESSAGES.OPT_RESEND, (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.message);
+                        localStorage.setItem(RESEND_OTP_KEY, Date.now().toString());
+                        setTimeLeft(RESEND_OTP_TIMER);
+                        setResendEnabled(false);
+                    }
+                    else {
+                        showToast(toast, "error", ERROR_MESSAGES.LOGIN_ERROR, response.error);
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _c.sent();
+                    showToast(toast, "error", ERROR_MESSAGES.LOGIN_ERROR, ((_b = err_1 === null || err_1 === void 0 ? void 0 : err_1.data) === null || _b === void 0 ? void 0 : _b.message) || ERROR_MESSAGES.SOMETHING_WRONG);
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    return (_jsxs(_Fragment, { children: [_jsx(Toast, { ref: toast }), _jsxs("div", { className: "auth-container ".concat(((_a = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _a === void 0 ? void 0 : _a.authPagesLayout) === 'center' ? 'center' : 'side'), style: { minWidth: 480 }, children: [((_b = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _b === void 0 ? void 0 : _b.authPagesLayout) === 'center' &&
+                        _jsx("div", { className: "flex justify-content-center", children: _jsx("div", { className: "solid-logo flex align-items-center ".concat((_c = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _c === void 0 ? void 0 : _c.appLogoPosition), children: _jsx(Image, { alt: "solid logo", src: ((_d = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _d === void 0 ? void 0 : _d.appLogo) || SolidLogo, className: "relative", fill: true }) }) }), _jsx("h2", { className: "solid-auth-title ".concat(((_e = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _e === void 0 ? void 0 : _e.authPagesLayout) === 'center' ? 'text-center mt-2 md:mt-4' : 'text-left'), children: "OTP Verification" }), _jsx("p", { className: "solid-auth-subtitle text-sm", children: "Please enter the OTP sent to your email to complete verification" }), _jsx(_Fragment, { children: _jsx(Formik, { initialValues: {
+                                otp: "",
+                            }, validationSchema: validationSchema, onSubmit: function (values, _a) {
+                                var setSubmitting = _a.setSubmitting, setErrors = _a.setErrors;
+                                return __awaiter(void 0, void 0, void 0, function () {
+                                    var response, redirectUrl, err_2;
+                                    var _b;
+                                    return __generator(this, function (_c) {
+                                        switch (_c.label) {
+                                            case 0:
+                                                _c.trys.push([0, 2, 3, 4]);
+                                                return [4 /*yield*/, signInWithOtp({
+                                                        type: type,
+                                                        identifier: identifier,
+                                                        otp: values.otp,
+                                                    })];
+                                            case 1:
+                                                response = _c.sent();
+                                                if (response === null || response === void 0 ? void 0 : response.error) {
+                                                    showToast(toast, "error", ERROR_MESSAGES.INAVLID_OTP, response.error);
+                                                    setErrors({
+                                                        otp: ERROR_MESSAGES.INAVLID_OTP,
+                                                    });
+                                                }
+                                                else {
+                                                    localStorage.removeItem("resendOtpLogin_".concat(identifier));
+                                                    showToast(toast, "success", ERROR_MESSAGES.LOGIN_SUCCESS, ERROR_MESSAGES.DASHBOARD_REDIRECTING);
+                                                    redirectUrl = env("NEXT_PUBLIC_LOGIN_REDIRECT_URL") || "/admin";
+                                                    router.push(redirectUrl);
+                                                }
+                                                return [3 /*break*/, 4];
+                                            case 2:
+                                                err_2 = _c.sent();
+                                                showToast(toast, "error", ERROR_MESSAGES.LOGIN_ERROR, (err_2 === null || err_2 === void 0 ? void 0 : err_2.data) ? (_b = err_2 === null || err_2 === void 0 ? void 0 : err_2.data) === null || _b === void 0 ? void 0 : _b.message : ERROR_MESSAGES.SOMETHING_WRONG);
+                                                return [3 /*break*/, 4];
+                                            case 3:
+                                                setSubmitting(false);
+                                                return [7 /*endfinally*/];
+                                            case 4: return [2 /*return*/];
+                                        }
+                                    });
+                                });
+                            }, children: function (formik) {
+                                var _a;
+                                return (_jsxs(Form, { children: [_jsxs("div", { className: "flex flex-column gap-2", children: [_jsx("label", { htmlFor: "otp", className: "solid-auth-input-label", children: "Enter OTP" }), _jsx(InputOtp, { value: formik.values.otp, onChange: function (e) { return formik.setFieldValue("otp", e.value); }, length: 6, style: { width: '100%' }, invalid: !!formik.errors.otp }), isFormFieldValid(formik, "otp") && (_jsx(Message, { className: "text-red-500 text-sm", severity: "error", text: (_a = formik.errors.otp) === null || _a === void 0 ? void 0 : _a.toString() })), _jsxs("div", { className: "flex align-items-center justify-content-between", children: [_jsx(Button, { type: "button", icon: 'pi pi-refresh', iconPos: "left", link: true, label: "Resend Code", className: "px-0 text-sm font-normal", onClick: handleResendOtp, disabled: !resendEnabled }), _jsx("p", { className: "m-0 text-sm text-color", children: resendEnabled
+                                                                ? "You can resend now"
+                                                                : "Time left: ".concat(Math.floor(timeLeft / 60)
+                                                                    .toString()
+                                                                    .padStart(2, "0"), ":").concat((timeLeft % 60).toString().padStart(2, "0")) })] })] }), _jsxs("div", { className: "mt-4", children: [_jsx(Button, { type: "submit", className: "w-full font-light auth-submit-button", label: "Verify", disabled: formik.isSubmitting, loading: formik.isSubmitting }), _jsx(Button, { type: "button", label: "Back", className: "w-full auth-back-button text-center mt-1", link: true, onClick: function () { return (window.location.href = '/auth/login'); } })] })] }));
+                            } }) })] })] }));
+};
+export default SolidInitialLoginOtp;
+//# sourceMappingURL=SolidInitialLoginOtp.js.map

package/dist/components/auth/SolidInitialLoginOtp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidInitialLoginOtp.js","sourceRoot":"","sources":["../../../src/components/auth/SolidInitialLoginOtp.tsx"],"names":[],"mappings":"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"}

package/dist/components/auth/SolidInitialLoginOtp.tsx

@@ -0,0 +1,231 @@
+import { useInitateLoginMutation } from "../../redux/api/authApi";
+import { Form, Formik } from "formik";
+import Image from "../common/Image";
+import { useRouter } from "../../hooks/useRouter";
+import { useSearchParams } from "../../hooks/useSearchParams";
+import { Button } from "primereact/button";
+import { InputOtp } from "primereact/inputotp";
+import { Message } from "primereact/message";
+import { Toast } from "primereact/toast";
+import { useEffect, useRef, useState } from "react";
+import * as Yup from "yup";
+import SolidLogo from '../../resources/images/SolidXLogo.svg'
+import { signInWithOtp } from "../../adapters/auth/index";
+import { ERROR_MESSAGES } from "../../constants/error-messages";
+import { useLazyGetAuthSettingsQuery } from "../../redux/api/solidSettingsApi";
+import { env } from "../../adapters/env";
+import showToast from "../../helpers/showToast";
+
+
+const SolidInitialLoginOtp = () => {
+    const searchParams = useSearchParams();
+    const tempIdentifier = searchParams.get('identifier');
+    const type = searchParams.get('type') || 'email';
+    const identifier = tempIdentifier ? decodeURIComponent(tempIdentifier) : '';
+
+    const RESEND_OTP_KEY = `resendOtpLogin_${identifier}`;
+    const RESEND_OTP_TIMER_MIN = parseFloat(env("NEXT_PUBLIC_RESEND_OTP_TIMER") || '0.5');
+    const RESEND_OTP_TIMER = Math.round(RESEND_OTP_TIMER_MIN * 60);
+    const [trigger, { data: solidSettingsData }] = useLazyGetAuthSettingsQuery();
+    useEffect(() => {
+        trigger("") // Fetch settings on mount
+    }, [trigger])
+
+    const [initiateResendOTP] = useInitateLoginMutation();
+    const toast = useRef<Toast>(null);
+    const router = useRouter();
+    const [timeLeft, setTimeLeft] = useState(RESEND_OTP_TIMER);
+    const [resendEnabled, setResendEnabled] = useState(false);
+
+    const getDisplayText = () => {
+        switch (type) {
+            case "mobile":
+                return {
+                    title: "OTP Verification",
+                    subtitle: "Please enter the OTP sent to your mobile number to complete verification"
+                };
+            case "transactional":
+                return {
+                    title: "OTP Verification",
+                    subtitle: "Please enter the OTP for your transaction to complete verification"
+                };
+            case "email":
+            default:
+                return {
+                    title: "OTP Verification",
+                    subtitle: "Please enter the OTP sent to your email to complete verification"
+                };
+        }
+    };
+
+    const displayText = getDisplayText();
+
+    useEffect(() => {
+
+        // Set timer if not already set (e.g., after login)
+        const storedTime = localStorage.getItem(RESEND_OTP_KEY);
+        if (!storedTime) {
+            localStorage.setItem(RESEND_OTP_KEY, Date.now().toString());
+        }
+
+        const lastSent = storedTime ? parseInt(storedTime, 10) : Date.now();
+        const elapsed = Math.floor((Date.now() - lastSent) / 1000);
+        const remaining = RESEND_OTP_TIMER - elapsed;
+
+        if (remaining > 0) {
+            setTimeLeft(remaining);
+            setResendEnabled(false);
+        } else {
+            setTimeLeft(0);
+            setResendEnabled(true);
+        }
+    }, [identifier]);
+
+    useEffect(() => {
+        if (resendEnabled || timeLeft <= 0) return;
+
+        const interval = setInterval(() => {
+            setTimeLeft((prev) => {
+                if (prev <= 1) {
+                    clearInterval(interval);
+                    setResendEnabled(true);
+                    return 0;
+                }
+                return prev - 1;
+            });
+        }, 1000);
+
+        return () => clearInterval(interval);
+    }, [resendEnabled, timeLeft]);
+
+    const validationSchema = Yup.object({
+        otp: Yup.string()
+            .matches(/^\d{6}$/, ERROR_MESSAGES.OTP_CHARACTER(6))
+            .required(ERROR_MESSAGES.FIELD_REUQIRED('OTP')),
+    });
+
+    const isFormFieldValid = (formik: any, fieldName: string) =>
+        formik.touched[fieldName] && formik.errors[fieldName];
+
+
+    const handleResendOtp = async () => {
+        try {
+            const payload = {
+                type: type,
+                identifier: identifier,
+            };
+
+            const response = await initiateResendOTP(payload).unwrap();
+
+            if (response?.statusCode === 200) {
+                showToast(toast, "success", ERROR_MESSAGES.OPT_RESEND, response?.data?.message);
+                localStorage.setItem(RESEND_OTP_KEY, Date.now().toString());
+                setTimeLeft(RESEND_OTP_TIMER);
+                setResendEnabled(false);
+            } else {
+                showToast(toast, "error", ERROR_MESSAGES.LOGIN_ERROR, response.error);
+            }
+        } catch (err: any) {
+            showToast(toast, "error", ERROR_MESSAGES.LOGIN_ERROR, err?.data?.message || ERROR_MESSAGES.SOMETHING_WRONG);
+        }
+    };
+
+    return (
+        <>
+            <Toast ref={toast} />
+            <div className={`auth-container ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'center' : 'side'}`} style={{ minWidth: 480 }}>
+                {solidSettingsData?.data?.authPagesLayout === 'center' &&
+                    <div className="flex justify-content-center">
+                        <div className={`solid-logo flex align-items-center ${solidSettingsData?.data?.appLogoPosition}`}>
+                            <Image
+                                alt="solid logo"
+                                src={solidSettingsData?.data?.appLogo || SolidLogo}
+                                className="relative"
+                                fill
+                            />
+                        </div>
+                    </div>
+                }
+                <h2 className={`solid-auth-title ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'text-center mt-2 md:mt-4' : 'text-left'}`}>OTP Verification</h2>
+                <p className="solid-auth-subtitle text-sm">
+                    Please enter the OTP sent to your email to complete verification
+                </p>
+                <>
+                    <Formik
+                        initialValues={{
+                            otp: "",
+                        }}
+                        validationSchema={validationSchema}
+                        onSubmit={async (values, { setSubmitting, setErrors }) => {
+                            try {
+                                const response = await signInWithOtp({
+                                    type: type,
+                                    identifier: identifier,
+                                    otp: values.otp,
+                                });
+
+                                if (response?.error) {
+                                    showToast(toast, "error", ERROR_MESSAGES.INAVLID_OTP, response.error);
+                                    setErrors({
+                                        otp: ERROR_MESSAGES.INAVLID_OTP,
+                                    });
+                                } else {
+                                    localStorage.removeItem(`resendOtpLogin_${identifier}`);
+                                    showToast(toast, "success", ERROR_MESSAGES.LOGIN_SUCCESS, ERROR_MESSAGES.DASHBOARD_REDIRECTING);
+                                    const redirectUrl = env("NEXT_PUBLIC_LOGIN_REDIRECT_URL") || "/admin";
+                                    router.push(redirectUrl);
+                                }
+                            } catch (err: any) {
+                                showToast(toast, "error", ERROR_MESSAGES.LOGIN_ERROR, err?.data ? err?.data?.message : ERROR_MESSAGES.SOMETHING_WRONG);
+                            } finally {
+                                setSubmitting(false);
+                            }
+                        }}
+                    >
+                        {(formik) => (
+                            <Form>
+                                <div className="flex flex-column gap-2">
+                                    <label htmlFor="otp" className="solid-auth-input-label">Enter OTP</label>
+                                    <InputOtp
+                                        value={formik.values.otp}
+                                        onChange={(e) => formik.setFieldValue("otp", e.value)}
+                                        length={6}
+                                        style={{ width: '100%' }}
+                                        invalid={!!formik.errors.otp}
+                                    />
+                                    {isFormFieldValid(formik, "otp") && (
+                                        <Message className="text-red-500 text-sm" severity="error" text={formik.errors.otp?.toString()} />
+                                    )}
+                                    <div className="flex align-items-center justify-content-between">
+                                        <Button type="button" icon='pi pi-refresh' iconPos="left" link label="Resend Code" className="px-0 text-sm font-normal"
+                                            onClick={handleResendOtp}
+                                            disabled={!resendEnabled}
+                                        />
+                                        <p className="m-0 text-sm text-color">
+                                            {resendEnabled
+                                                ? "You can resend now"
+                                                : `Time left: ${Math.floor(timeLeft / 60)
+                                                    .toString()
+                                                    .padStart(2, "0")}:${(timeLeft % 60).toString().padStart(2, "0")}`}
+                                        </p>
+                                    </div>
+                                </div>
+                                <div className="mt-4">
+                                    <Button type="submit" className="w-full font-light auth-submit-button" label="Verify" disabled={formik.isSubmitting} loading={formik.isSubmitting} />
+                                    <Button type="button" label="Back" className="w-full auth-back-button text-center mt-1" link onClick={() => (window.location.href = '/auth/login')} />
+                                </div>
+                            </Form>
+                        )}
+                    </Formik>
+                </>
+            </div>
+            {/* <div className="text-center mt-5">
+                <div className="text-sm text-400 secondary-dark-color">
+                    {'<'} Back to <Link className="font-bold" href="/auth/login">Back</Link>
+                </div>
+            </div> */}
+        </>
+    );
+};
+
+export default SolidInitialLoginOtp;

package/dist/components/auth/SolidInitiateRegisterOtp.d.ts

@@ -0,0 +1,3 @@
+declare const SolidInitiateRegisterOtp: () => import("react/jsx-runtime").JSX.Element;
+export default SolidInitiateRegisterOtp;
+//# sourceMappingURL=SolidInitiateRegisterOtp.d.ts.map

package/dist/components/auth/SolidInitiateRegisterOtp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidInitiateRegisterOtp.d.ts","sourceRoot":"","sources":["../../../src/components/auth/SolidInitiateRegisterOtp.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,wBAAwB,+CA4L7B,CAAC;AAEF,eAAe,wBAAwB,CAAC"}