@opexa/portal-components 0.0.920 → 0.0.921

package/dist/components/AccountInfo/AccountInfo.js

@@ -29,6 +29,7 @@ import { FacebookIcon } from '../../icons/FacebookIcon.js';
 import { GoogleIcon } from '../../icons/GoogleIcon.js';
 import { LinkBroken02Icon } from '../../icons/LinkBroken02Icon.js';
 import { XIcon } from '../../icons/XIcon.js';
+import AlertCircleIconImage from '../../images/alert-circle-icon.png';
 import avatarPlaceholder from '../../images/placeholder-avatar.png';
 import { Button } from '../../ui/Button/index.js';
 import { Dialog } from '../../ui/Dialog/index.js';
@@ -204,9 +205,7 @@ function ContactInfo({ variant }) {
             });
         }
     }, [account, form, parse]);
-    return (_jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h2", { className: "grow font-semibold text-sm text-text-secondary-700", children: "Contact Info" }), _jsx(ark.svg, { asChild: true, className: twMerge('size-6', profileCompletion?.personalInformation
-                            ? 'text-text-success-primary'
-                            : 'text-text-warning-primary'), children: profileCompletion?.personalInformation ? (_jsx(CheckVerified02Icon, {})) : (_jsx(AlertCircleIcon, {})) })] }), _jsxs("form", { className: "mt-5 rounded-xl border border-border-secondary bg-bg-primary-alt shadow-xs", onSubmit: form.handleSubmit((data) => {
+    return (_jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h2", { className: "grow font-semibold text-sm text-text-secondary-700", children: "Contact Info" }), profileCompletion?.personalInformation ? (_jsx(ark.svg, { asChild: true, className: "size-6 text-text-success-primary", children: _jsx(CheckVerified02Icon, {}) })) : (_jsxs("div", { className: "flex items-center gap-1 rounded-sm border border-[#93370d] bg-[#4e1d09] px-sm py-xs", children: [_jsx(AlertCircleIcon, { className: "h-5 w-5 text-[#FEC84B]" }), _jsx("span", { className: "m-0 text-[#FEC84B] text-xs", children: "Not Set" })] }))] }), _jsx(AlertWarning, { title: "Please add an email address to your account to receive important notifications.", className: "my-3" }), _jsxs("form", { className: "rounded-xl border border-border-secondary bg-bg-primary-alt shadow-xs", onSubmit: form.handleSubmit((data) => {
                     updateAccountMutation.mutate({
                         emailAddress: data.emailAddress && account?.emailAddress !== data.emailAddress
                             ? data.emailAddress
@@ -316,3 +315,6 @@ function UnlinkGoogleAccount() {
                                                     unlinkGoogleMutation.mutate(account.id);
                                                 }, children: "Disconnect" })] })) })] }) })] })] }));
 }
+function AlertWarning({ title, className, }) {
+    return (_jsxs("div", { className: twMerge('flex items-center gap-2 rounded-xl border border-border-secondary bg-bg-primary-alt p-xl', className), children: [_jsx(Image, { src: AlertCircleIconImage, alt: "Alert", className: "w-10 object-contain", draggable: false }), _jsx("p", { className: "font-semibold text-sm text-text-tertiary-600", children: title })] }));
+}

package/dist/components/AccountSecurity/AccountSecurity.js

@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createListCollection } from '@ark-ui/react/collection';
 import { ark } from '@ark-ui/react/factory';
 import { zodResolver } from '@hookform/resolvers/zod';
+import Image from 'next/image';
 import { useForm } from 'react-hook-form';
 import { twMerge } from 'tailwind-merge';
 import { z } from 'zod';
@@ -16,6 +17,7 @@ import { CheckVerified02Icon } from '../../icons/CheckVerified02Icon.js';
 import { ChevronDownIcon } from '../../icons/ChevronDownIcon.js';
 import { EyeIcon } from '../../icons/EyeIcon.js';
 import { EyeOffIcon } from '../../icons/EyeOffIcon.js';
+import AlertCircleIconImage from '../../images/alert-circle-icon.png';
 import { Button } from '../../ui/Button/index.js';
 import { Field } from '../../ui/Field/index.js';
 import { PasswordInput } from '../../ui/PasswordInput/index.js';
@@ -158,14 +160,15 @@ function TransactionPassword() {
             confirmPassword: '',
         },
     });
-    return (_jsxs("div", { children: [_jsxs("div", { className: "flex items-start gap-8", children: [_jsxs("div", { className: "grow", children: [_jsx("h2", { className: "font-semibold text-sm text-text-secondary-700", children: "Transaction password" }), _jsx("p", { className: "text-sm text-text-tertiary-600", children: "The transaction password secures and confirms your wallet withdrawals." })] }), _jsx(ark.svg, { asChild: true, className: twMerge('size-6', profileCompletion?.transactionPassword
-                            ? 'text-text-success-primary'
-                            : 'text-text-warning-primary'), children: profileCompletion?.transactionPassword ? (_jsx(CheckVerified02Icon, {})) : (_jsx(AlertCircleIcon, {})) })] }), _jsxs("form", { className: "mt-5 rounded-xl border border-border-secondary bg-bg-primary-alt shadow-xs", onSubmit: form.handleSubmit((data) => {
+    return (_jsxs("div", { children: [_jsxs("div", { className: "flex items-start gap-8", children: [_jsxs("div", { className: "grow", children: [_jsx("h2", { className: "font-semibold text-sm text-text-secondary-700", children: "Transaction password" }), _jsx("p", { className: "text-sm text-text-tertiary-600", children: "The transaction password secures and confirms your wallet withdrawals." })] }), profileCompletion?.personalInformation ? (_jsx(ark.svg, { asChild: true, className: "size-6 text-text-success-primary", children: _jsx(CheckVerified02Icon, {}) })) : (_jsxs("div", { className: "flex items-center gap-1 rounded-sm border border-[#93370d] bg-[#4e1d09] px-sm py-xs", children: [_jsx(AlertCircleIcon, { className: "h-5 w-5 text-[#FEC84B]" }), _jsx("span", { className: "m-0 text-nowrap text-[#FEC84B] text-xs", children: "Not Set" })] }))] }), _jsx(AlertWarning, { title: "Please set your transaction password. This is required when making withdrawals and helps secure your account.", className: "my-3" }), _jsxs("form", { className: "mt-5 rounded-xl border border-border-secondary bg-bg-primary-alt shadow-xs", onSubmit: form.handleSubmit((data) => {
                     updateAccountMutation.mutate({
                         transactionPassword: data.password,
                     });
                 }), children: [_jsxs("div", { className: "px-xl py-5 lg:px-3xl lg:py-5", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.password, children: [_jsxs(PasswordInput.Root, { children: [_jsx(PasswordInput.Label, { children: "Password" }), _jsxs(PasswordInput.Control, { children: [_jsx(PasswordInput.Input, { ...form.register('password') }), _jsx(PasswordInput.VisibilityTrigger, { children: _jsx(PasswordInput.Indicator, { fallback: _jsx(EyeOffIcon, {}), asChild: true, children: _jsx(EyeIcon, {}) }) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.password?.message })] }), _jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.confirmPassword, children: [_jsxs(PasswordInput.Root, { children: [_jsx(PasswordInput.Label, { children: "Confirm Password" }), _jsxs(PasswordInput.Control, { children: [_jsx(PasswordInput.Input, { ...form.register('confirmPassword') }), _jsx(PasswordInput.VisibilityTrigger, { children: _jsx(PasswordInput.Indicator, { fallback: _jsx(EyeOffIcon, {}), asChild: true, children: _jsx(EyeIcon, {}) }) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.confirmPassword?.message })] })] }), form.formState.isDirty && (_jsxs("div", { className: "flex justify-end gap-lg border-border-secondary border-t px-xl py-lg lg:px-3xl lg:py-xl", children: [_jsx(Button, { size: "sm", variant: "outline", fullWidth: false, disabled: updateAccountMutation.isPending, onClick: () => form.reset(), children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || updateAccountMutation.isPending, children: "Save Changes" })] }))] })] }));
 }
+function AlertWarning({ title, className, }) {
+    return (_jsxs("div", { className: twMerge('flex items-center gap-2 rounded-xl border border-border-secondary bg-bg-primary-alt p-xl', className), children: [_jsx(Image, { src: AlertCircleIconImage, alt: "Alert", className: "w-10 object-contain", draggable: false }), _jsx("p", { className: "font-semibold text-sm text-text-tertiary-600", children: title })] }));
+}
 const secretQuestionCollection = createListCollection({
     items: SECRET_QUESTIONS,
     itemToValue: (item) => item,

package/dist/components/AccountVerification/AccountVerification.js

@@ -53,7 +53,7 @@ function Status__Missing() {
     return (_jsxs("div", { className: "mt-6 flex flex-col gap-2 rounded-xl border border-border-primary bg-bg-primary-alt p-xl shadow-xs lg:flex-row", children: [_jsx("div", { className: "flex size-[2.1875rem] items-center justify-center rounded-full border-2 border-text-warning-primary/10", children: _jsx("div", { className: "flex size-[1.666625rem] items-center justify-center rounded-full border-2 border-text-warning-primary/30", children: _jsx(AlertCircleIcon, { className: "size-5 text-text-warning-primary" }) }) }), _jsx("p", { className: "max-w-[800px] text-sm text-text-tertiary-600", children: "To serve you better and unlock all features, please provide valid identification documents. This helps protect your account and makes recovery easier if ever needed." })] }));
 }
 function Status__Pending() {
-    return (_jsxs("div", { className: "mt-6 flex flex-col gap-2 rounded-xl border border-border-primary bg-bg-primary-alt p-xl shadow-xs lg:flex-row", children: [_jsx("div", { className: "flex size-[2.1875rem] items-center justify-center rounded-full border-2 border-text-warning-primary/10", children: _jsx("div", { className: "flex size-[1.666625rem] items-center justify-center rounded-full border-2 border-text-warning-primary/30", children: _jsx(FileSearch02Icon, { className: "size-5 text-text-warning-primary" }) }) }), _jsxs("div", { children: [_jsx("h2", { className: "font-semibold text-sm text-text-secondary-700", children: "Under review" }), _jsx("p", { className: "mt-xs text-sm text-text-tertiary-600", children: "To serve you better and unlock all features, please provide valid identification documents. This helps protect your account and makes recovery easier if ever needed." })] })] }));
+    return (_jsxs("div", { className: "mt-6 flex flex-col gap-2 rounded-xl border border-border-primary bg-bg-primary-alt p-xl shadow-xs lg:flex-row", children: [_jsx("div", { className: "flex size-[2.1875rem] items-center justify-center rounded-full border-2 border-text-warning-primary/10", children: _jsx("div", { className: "flex size-[1.666625rem] items-center justify-center rounded-full border-2 border-text-warning-primary/30", children: _jsx(FileSearch02Icon, { className: "size-5 text-text-warning-primary" }) }) }), _jsxs("div", { children: [_jsx("h2", { className: "font-semibold text-sm text-text-secondary-700", children: "Under review" }), _jsx("p", { className: "mt-xs text-sm text-text-tertiary-600", children: "Your documents have been successfully submitted and are currently under review. This process may take some time. You will be notified once verification is complete." })] })] }));
 }
 function Status__Success() {
     return (_jsxs("div", { className: "mt-6 flex flex-col gap-2 rounded-xl border border-border-primary bg-bg-primary-alt p-xl shadow-xs lg:flex-row", children: [_jsx("div", { className: "flex size-[2.1875rem] items-center justify-center rounded-full border-2 border-text-success-primary/10", children: _jsx("div", { className: "flex size-[1.666625rem] items-center justify-center rounded-full border-2 border-text-success-primary/30", children: _jsx(FileCheck02Icon, { className: "size-5 text-text-success-primary" }) }) }), _jsxs("div", { children: [_jsx("h2", { className: "font-semibold text-sm text-text-secondary-700", children: "Verification successful" }), _jsx("p", { className: "mt-xs text-sm text-text-tertiary-600", children: "Your account has been successfully verified. You now have full access to all features and improved account security." })] })] }));

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositContext.d.ts

@@ -1,7 +1,7 @@
 export declare const OnlineBankDepositContext: (props: {
     value: {
         view: "form" | "vca";
-        status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+        status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
         deposit: import("../../../../types").Deposit | null;
@@ -14,7 +14,7 @@ export declare const OnlineBankDepositContext: (props: {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useOnlineBankDepositContext: () => {
     view: "form" | "vca";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: import("../../../../types").Deposit | null;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/useOnlineBankDeposit.d.ts

@@ -2,7 +2,7 @@ import type { Deposit } from '../../../../types';
 export type UseOnlineBankDepositReturn = ReturnType<typeof useOnlineBankDeposit>;
 export declare function useOnlineBankDeposit(): {
     view: "form" | "vca";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: Deposit | null;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositContext.d.ts

@@ -1,7 +1,7 @@
 export declare const QRPHDepositContext: (props: {
     value: {
-        view: "form" | "qrCode";
-        status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+        view: "qrCode" | "form";
+        status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
         deposit: import("../../../../types").Deposit | null;
@@ -13,8 +13,8 @@ export declare const QRPHDepositContext: (props: {
 } & {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useQRPHDepositContext: () => {
-    view: "form" | "qrCode";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    view: "qrCode" | "form";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: import("../../../../types").Deposit | null;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/useQRPHDeposit.d.ts

@@ -1,8 +1,8 @@
 import type { Deposit } from '../../../../types';
 export type UseQRPHDepositReturn = ReturnType<typeof useQRPHDeposit>;
 export declare function useQRPHDeposit(): {
-    view: "form" | "qrCode";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    view: "qrCode" | "form";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: Deposit | null;

package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositContext.d.ts

@@ -1,7 +1,7 @@
 export declare const OnlineBankDepositContext: (props: {
     value: {
-        view: "form" | "vca";
-        status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+        view: "vca" | "form";
+        status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
         deposit: import("../../../../types").Deposit | null;
@@ -13,8 +13,8 @@ export declare const OnlineBankDepositContext: (props: {
 } & {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useOnlineBankDepositContext: () => {
-    view: "form" | "vca";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    view: "vca" | "form";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: import("../../../../types").Deposit | null;

package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/useOnlineBankDeposit.d.ts

@@ -1,8 +1,8 @@
 import type { Deposit } from '../../../../types';
 export type UseOnlineBankDepositReturn = ReturnType<typeof useOnlineBankDeposit>;
 export declare function useOnlineBankDeposit(): {
-    view: "form" | "vca";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    view: "vca" | "form";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: Deposit | null;

package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositContext.d.ts

@@ -1,7 +1,7 @@
 export declare const QRPHDepositContext: (props: {
     value: {
-        view: "form" | "qrCode";
-        status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+        view: "qrCode" | "form";
+        status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
         deposit: import("../../../../types").Deposit | null;
@@ -13,8 +13,8 @@ export declare const QRPHDepositContext: (props: {
 } & {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useQRPHDepositContext: () => {
-    view: "form" | "qrCode";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    view: "qrCode" | "form";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: import("../../../../types").Deposit | null;

package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/useQRPHDeposit.d.ts

@@ -1,8 +1,8 @@
 import type { Deposit } from '../../../../types';
 export type UseQRPHDepositReturn = ReturnType<typeof useQRPHDeposit>;
 export declare function useQRPHDeposit(): {
-    view: "form" | "qrCode";
-    status: "waiting" | "failed" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    view: "qrCode" | "form";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: Deposit | null;

package/dist/components/KYC/KYCVerificationStatus.lazy.js

@@ -19,18 +19,15 @@ export function KYCVerificationStatus() {
     const icons = status === 'PENDING' ? bellIcon : alertIcon;
     return (_jsx(Dialog.Root, { open: globalStore.kycVerificationStatus.open, onOpenChange: (details) => {
             globalStore.kycVerificationStatus.setOpen(details.open);
-        }, closeOnEscape: false, closeOnInteractOutside: false, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsx(Dialog.Content, { className: "mx-auto h-fit w-[450px] overflow-y-auto rounded-lg bg-bg-primary", children: _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mb-3xl grid h-[200px] w-full place-items-center rounded-xl bg-radial from-40% from-button-primary-bg to-bg-brand-solid", children: _jsx(Image, { src: icons, alt: "icon", className: "w-60 object-contain", draggable: false, width: 120, height: 120 }) }), _jsxs("h1", { className: "font-semibold text-lg text-white", children: [status === 'PENDING' && 'Verification in Progress', status === 'REJECTED' && 'Verification Rejected', status === 'UNVERIFIED' ||
-                                            (status === 'CREATED' && 'Verification Required')] }), _jsxs("p", { className: "mb-4xl text-[#94969C] text-base", children: [status === 'PENDING' &&
+        }, closeOnEscape: false, closeOnInteractOutside: false, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsx(Dialog.Content, { className: "mx-auto h-fit w-[450px] overflow-y-auto rounded-lg bg-bg-primary", children: _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mb-3xl grid h-[200px] w-full place-items-center rounded-xl bg-radial from-40% from-button-primary-bg to-bg-brand-solid", children: _jsx(Image, { src: icons, alt: "icon", className: "w-60 object-contain", draggable: false, width: 120, height: 120 }) }), _jsxs("h1", { className: "font-semibold text-lg text-white", children: [status === 'PENDING' && 'Verification in Progress', status === 'REJECTED' && 'Verification Rejected', status === 'UNVERIFIED' && 'Verification Required'] }), _jsxs("p", { className: "mb-4xl text-[#94969C] text-base", children: [status === 'PENDING' &&
                                             `Your account verification is still under review. Please wait
 								until it's approved before you can continue playing or
 								depositing.`, status === 'REJECTED' &&
-                                            'Your account verification was not approved. Please resubmit your verification to regain full access.', status === 'UNVERIFIED' ||
-                                            (status === 'CREATED' &&
-                                                'Your account is not yet verified. Please complete the verification process to continue playing or depositing.')] }), _jsxs(Button, { variant: "solid", className: twMerge('mb-2 w-full', status === 'PENDING' && 'hidden'), onClick: () => {
+                                            'Your account verification was not approved. Please resubmit your verification to regain full access.', status === 'UNVERIFIED' &&
+                                            'Your account is not yet verified. Please complete the verification process to continue playing or depositing.'] }), _jsxs(Button, { variant: "solid", className: twMerge('mb-2 w-full', status === 'PENDING' && 'hidden'), onClick: () => {
                                         globalStore.kycVerificationStatus.setOpen(false);
                                         globalStore.kyc.setOpen(true);
-                                    }, children: [status === 'REJECTED' && 'Resubmit Verification', status === 'UNVERIFIED' ||
-                                            (status === 'CREATED' && 'Verify Now')] }), _jsx(Button, { type: "button", variant: "outline", onClick: () => {
+                                    }, children: [status === 'REJECTED' && 'Resubmit Verification', status === 'UNVERIFIED' && 'Verify Now'] }), _jsx(Button, { type: "button", variant: "outline", onClick: () => {
                                         globalStore.kycVerificationStatus.setOpen(false);
                                     }, children: "Close" })] }) }) })] }) }));
 }

package/dist/components/ResponsibleGaming/ResponsibleGamingV2.lazy.js

@@ -1,17 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Image, {} from 'next/image';
-import { useRef } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useShallow } from 'zustand/shallow';
 import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
 import { ScrollToBottomIcon } from '../../icons/ScrollToBottomIcon.js';
-import decorativebackground from '../../images/decorative-patern.png';
-import pagcorLogo from '../../images/pagcor.png';
-import responsibleGamingLogo from '../../images/responsible-gaming.png';
+import { ScrollToTopIcon } from '../../icons/ScrollToTopIcon.js';
 import { Button } from '../../ui/Button/index.js';
 import { Dialog } from '../../ui/Dialog/index.js';
 import { Portal } from '../../ui/Portal/index.js';
 export function ResponsibleGamingV2(props) {
+    const [hasReachedBottom, setHasReachedBottom] = useState(false);
+    const [isAtBottom, setIsAtBottom] = useState(false);
     const scrollableContentRef = useRef(null);
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         signIn: ctx.signIn,
@@ -19,6 +19,16 @@ export function ResponsibleGamingV2(props) {
         disclaimer: ctx.disclaimer,
         responsibleGaming: ctx.responsibleGaming,
     })));
+    useEffect(() => {
+        if (scrollableContentRef.current) {
+            const { scrollHeight, clientHeight } = scrollableContentRef.current;
+            const atBottom = scrollHeight <= clientHeight;
+            setIsAtBottom(atBottom);
+            if (atBottom) {
+                setHasReachedBottom(true);
+            }
+        }
+    }, []);
     return (_jsx(Dialog.Root, { open: globalStore.responsibleGaming.open, onOpenChange: (details) => {
             globalStore.responsibleGaming.setOpen(details.open);
             if (!details.open)
@@ -34,14 +44,27 @@ export function ResponsibleGamingV2(props) {
                 globalStore.disclaimer.setOpen(true);
             }
             globalStore.responsibleGaming.setNext(null);
-        }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-y-auto p-4 sm:p-6 lg:mx-auto lg:h-auto lg:max-h-[90vh] lg:w-[650px] lg:p-3xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: decorativebackground, alt: "", width: 200, height: 200, className: "absolute top-safe-area-inset-top left-0 h-32 w-32 sm:h-40 sm:w-40 lg:h-50 lg:w-50" }), _jsx(Image, { src: props.logo, alt: "", width: 250, height: 150, className: "h-auto w-20 sm:w-24 lg:w-[7.5rem]", draggable: false }), _jsxs("div", { className: "relative w-full grow", children: [_jsx(Dialog.Title, { className: "mt-4 text-center font-semibold text-base text-brand-400 sm:mt-6 sm:text-lg lg:mt-3xl", children: "Responsible Gaming Guidelines" }), _jsxs("div", { ref: scrollableContentRef, className: "mt-2 scrollbar:h-2 max-h-[90vh] scrollbar:w-2 overflow-y-auto rounded-md scrollbar-thumb:rounded-full bg-[#021C25] p-3 sm:mt-xs sm:max-h-80 sm:p-4 lg:max-h-96", children: [_jsxs("div", { className: "flex flex-row items-center justify-center gap-4 sm:gap-6 lg:gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-12 w-auto shrink-0 sm:h-16 lg:h-[5.5rem]", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-8 w-auto shrink-0 sm:h-12 lg:h-[3.875rem]", draggable: false })] }), _jsx(Dialog.Description, { className: "text-xs leading-relaxed sm:text-sm sm:leading-2xl", children: props.content }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-3 flex items-center justify-center gap-x-sm sm:mt-4", children: _jsx("div", { className: "w-[80%]", children: _jsx(Button, { type: "button", className: "flex-1 py-2 text-sm sm:py-2.5 sm:text-base", onClick: () => {
-                                                                api.setOpen(false);
-                                                            }, children: "I Agree" }) }) })) })] })] }), _jsx(Button, { type: "button", className: "absolute right-6 bottom-7 w-fit flex-1 rounded-lg bg-bg-active py-2 sm:right-6 sm:bottom-6 sm:py-2.5 lg:right-9 lg:bottom-10", onClick: () => {
-                                    if (scrollableContentRef.current) {
-                                        scrollableContentRef.current.scrollTo({
-                                            top: scrollableContentRef.current.scrollHeight,
-                                            behavior: 'smooth',
-                                        });
-                                    }
-                                }, children: _jsx(ScrollToBottomIcon, {}) })] }) })] }) }));
+        }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-hidden p-4 sm:p-6 lg:mx-auto lg:max-h-[90vh] lg:w-[500px] lg:p-3xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: props.logo, alt: "", width: 250, height: 150, className: "mx-auto h-auto w-20 sm:w-24 lg:w-[7.5rem]", draggable: false }), _jsxs("div", { className: "relative flex h-full w-full flex-col overflow-hidden", children: [_jsx(Dialog.Title, { className: "my-3 text-center font-semibold text-brand-400 sm:mt-6 sm:text-lg lg:my-xl lg:text-2xl", children: "Responsible Gaming Guidelines" }), _jsx("div", { className: "flex min-h-0 flex-1 flex-col rounded-md bg-[#021C25] px-2 py-2", children: _jsxs("div", { ref: scrollableContentRef, className: "mt-2 scrollbar:h-2 scrollbar:w-2 flex-1 overflow-y-auto scrollbar-thumb:rounded-full scrollbar-track:rounded-full bg-[#021C25] scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-bg-primary p-3 pr-4 sm:mt-xs sm:p-4", onScroll: (e) => {
+                                                const { scrollTop, scrollHeight, clientHeight } = e.currentTarget;
+                                                const atBottom = Math.abs(scrollHeight - clientHeight - scrollTop) < 1;
+                                                setIsAtBottom(atBottom);
+                                                if (atBottom) {
+                                                    setHasReachedBottom(true);
+                                                }
+                                            }, children: [_jsx(Dialog.Description, { className: "text-xs leading-relaxed sm:text-sm sm:leading-2xl", children: props.content }), _jsx(Button, { type: "button", className: twMerge('absolute right-6 bottom-7 z-10 size-10 rounded-lg transition-colors duration-75 ease-in-out sm:right-6 sm:bottom-6 lg:right-8 lg:bottom-8', isAtBottom
+                                                        ? 'border border-[#CECFD2] bg-bg-secondary'
+                                                        : 'bg-bg-brand-secondary'), onClick: () => {
+                                                        if (scrollableContentRef.current) {
+                                                            scrollableContentRef.current.scrollTo({
+                                                                top: isAtBottom
+                                                                    ? 0
+                                                                    : scrollableContentRef.current.scrollHeight,
+                                                                behavior: 'smooth',
+                                                            });
+                                                        }
+                                                    }, children: isAtBottom ? _jsx(ScrollToTopIcon, {}) : _jsx(ScrollToBottomIcon, {}) })] }) })] }), _jsx(Dialog.Context, { children: (api) => (_jsx(Button, { type: "button", className: twMerge('mt-4 w-full py-2 text-sm sm:py-2.5 sm:text-base', hasReachedBottom
+                                        ? 'bg-bg-brand-secondary'
+                                        : 'bg-bg-disabled text-text-disabled'), onClick: () => {
+                                        api.setOpen(false);
+                                    }, disabled: !hasReachedBottom, children: "I Agree" })) })] }) })] }) }));
 }

package/dist/components/TermsOfUse/TermsOfUseV2.lazy.js

@@ -1,24 +1,34 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Image, {} from 'next/image';
-import { useRef } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useShallow } from 'zustand/shallow';
 import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
 import { ScrollToBottomIcon } from '../../icons/ScrollToBottomIcon.js';
-import decorativebackground from '../../images/decorative-patern.png';
-import pagcorLogo from '../../images/pagcor.png';
-import responsibleGamingLogo from '../../images/responsible-gaming.png';
+import { ScrollToTopIcon } from '../../icons/ScrollToTopIcon.js';
 import { Button } from '../../ui/Button/index.js';
 import { Dialog } from '../../ui/Dialog/index.js';
 import { Portal } from '../../ui/Portal/index.js';
 export function TermsOfUseV2({ logo, siteName, content, ...props }) {
     const scrollableContentRef = useRef(null);
+    const [hasReachedBottom, setHasReachedBottom] = useState(false);
+    const [isAtBottom, setIsAtBottom] = useState(false);
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         signIn: ctx.signIn,
         signUp: ctx.signUp,
         disclaimer: ctx.disclaimer,
         termsOfUse: ctx.termsOfUse,
     })));
+    useEffect(() => {
+        if (scrollableContentRef.current) {
+            const { scrollHeight, clientHeight } = scrollableContentRef.current;
+            const atBottom = scrollHeight <= clientHeight;
+            setIsAtBottom(atBottom);
+            if (atBottom) {
+                setHasReachedBottom(true);
+            }
+        }
+    }, []);
     return (_jsx(Dialog.Root, { open: globalStore.termsOfUse.open, onOpenChange: (details) => {
             globalStore.termsOfUse.setOpen(details.open);
             if (!details.open)
@@ -34,14 +44,25 @@ export function TermsOfUseV2({ logo, siteName, content, ...props }) {
                 globalStore.disclaimer.setOpen(true);
             }
             globalStore.termsOfUse.setNext(null);
-        }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-y-auto p-4 sm:p-6 lg:mx-auto lg:h-auto lg:max-h-[90vh] lg:w-[650px] lg:p-3xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: decorativebackground, alt: "", width: 200, height: 200, className: "absolute top-safe-area-inset-top left-0 h-32 w-32 sm:h-40 sm:w-40 lg:h-50 lg:w-50" }), _jsx(Image, { src: logo, alt: "", width: 250, height: 150, className: "h-auto w-20 sm:w-24 lg:w-[7.5rem]", draggable: false }), _jsxs("div", { className: "relative w-full grow", children: [_jsxs(Dialog.Title, { className: 'mt-4 text-center font-semibold text-base text-brand-400 sm:mt-6 sm:text-lg lg:mt-3xl', children: [siteName, " Terms of Use"] }), _jsxs("div", { ref: scrollableContentRef, className: "mt-2 scrollbar:h-2 max-h-[90vh] scrollbar:w-2 overflow-y-auto rounded-md scrollbar-thumb:rounded-full bg-[#021C25] p-3 sm:mt-xs sm:max-h-80 sm:p-4 lg:max-h-96", children: [_jsxs("div", { className: "flex flex-row items-center justify-center gap-4 sm:gap-6 lg:gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-12 w-auto shrink-0 sm:h-16 lg:h-[5.5rem]", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-8 w-auto shrink-0 sm:h-12 lg:h-[3.875rem]", draggable: false })] }), _jsx(Dialog.Description, { className: "text-xs leading-relaxed sm:text-sm sm:leading-2xl", children: content }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-3 flex items-center justify-center gap-x-sm sm:mt-4", children: _jsx("div", { className: "w-[80%]", children: _jsx(Button, { type: "button", className: "flex-1 py-2 text-sm sm:py-2.5 sm:text-base", onClick: () => {
-                                                                api.setOpen(false);
-                                                            }, children: "I Agree" }) }) })) })] })] }), _jsx(Button, { type: "button", className: "absolute right-6 bottom-7 w-fit flex-1 rounded-lg bg-bg-active py-2 sm:right-6 sm:bottom-6 sm:py-2.5 lg:right-9 lg:bottom-10", onClick: () => {
-                                    if (scrollableContentRef.current) {
-                                        scrollableContentRef.current.scrollTo({
-                                            top: scrollableContentRef.current.scrollHeight,
-                                            behavior: 'smooth',
-                                        });
-                                    }
-                                }, children: _jsx(ScrollToBottomIcon, {}) })] }) })] }) }));
+        }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-hidden p-4 sm:p-6 lg:mx-auto lg:max-h-[90vh] lg:w-[500px] lg:p-3xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: logo, alt: "", width: 250, height: 150, className: "mx-auto h-auto w-20 sm:w-24 lg:w-[7.5rem]", draggable: false }), _jsxs("div", { className: "relative flex h-full w-full flex-col overflow-hidden", children: [_jsx(Dialog.Title, { className: "my-3 text-center font-semibold text-brand-400 sm:mt-6 sm:text-lg lg:my-xl lg:text-2xl", children: "Terms of Use" }), _jsx("div", { className: "flex min-h-0 flex-1 flex-col rounded-md bg-[#021C25] px-2 py-2", children: _jsxs("div", { ref: scrollableContentRef, className: "mt-2 scrollbar:h-2 scrollbar:w-2 flex-1 overflow-y-auto scrollbar-thumb:rounded-full scrollbar-track:rounded-full bg-[#021C25] scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-bg-primary p-3 pr-4 sm:mt-xs sm:p-4", onScroll: (e) => {
+                                                const { scrollTop, scrollHeight, clientHeight } = e.currentTarget;
+                                                if (Math.abs(scrollHeight - clientHeight - scrollTop) < 1) {
+                                                    setHasReachedBottom(true);
+                                                }
+                                            }, children: [_jsx(Dialog.Description, { className: "text-xs leading-relaxed sm:text-sm sm:leading-2xl", children: content }), _jsx(Button, { type: "button", className: twMerge('absolute right-6 bottom-7 z-10 size-10 rounded-lg transition-colors duration-75 ease-in-out sm:right-6 sm:bottom-6 lg:right-8 lg:bottom-8', isAtBottom
+                                                        ? 'border border-[#CECFD2] bg-bg-secondary'
+                                                        : 'bg-bg-brand-secondary'), onClick: () => {
+                                                        if (scrollableContentRef.current) {
+                                                            scrollableContentRef.current.scrollTo({
+                                                                top: isAtBottom
+                                                                    ? 0
+                                                                    : scrollableContentRef.current.scrollHeight,
+                                                                behavior: 'smooth',
+                                                            });
+                                                        }
+                                                    }, children: isAtBottom ? _jsx(ScrollToTopIcon, {}) : _jsx(ScrollToBottomIcon, {}) })] }) })] }), _jsx(Dialog.Context, { children: (api) => (_jsx(Button, { type: "button", className: twMerge('mt-4 flex-1 py-2 text-sm sm:py-2.5 sm:text-base', hasReachedBottom
+                                        ? 'bg-bg-brand-secondary'
+                                        : 'bg-bg-disabled text-text-disabled'), onClick: () => {
+                                        api.setOpen(false);
+                                    }, disabled: !hasReachedBottom, children: "Accept" })) })] }) })] }) }));
 }

package/dist/icons/ScrollToBottomIcon.js

@@ -1,4 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 export function ScrollToBottomIcon(props) {
-    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "12", fill: "none", viewBox: "0 0 10 12", ...props, children: _jsx("path", { stroke: "#85888E", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.667", d: "M.833 6.833 5 11l4.167-4.167M.833 1 5 5.167 9.167 1" }) }));
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "12", fill: "none", viewBox: "0 0 10 12", ...props, children: _jsx("path", { stroke: "#fff", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.667", d: "M.833 6.833 5 11l4.167-4.167M.833 1 5 5.167 9.167 1" }) }));
 }

package/dist/icons/ScrollToTopIcon.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentPropsWithRef } from 'react';
+export declare function ScrollToTopIcon(props: ComponentPropsWithRef<'svg'>): import("react/jsx-runtime").JSX.Element;

package/dist/icons/ScrollToTopIcon.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function ScrollToTopIcon(props) {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "12", viewBox: "0 0 10 12", fill: "none", ...props, children: _jsx("path", { d: "M9.16634 10.8335L4.99967 6.66683L0.833008 10.8335M9.16634 5.00016L4.99967 0.833496L0.833008 5.00016", stroke: "#CECFD2", strokeWidth: "1.66667", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+}

package/dist/schemas/forgotPasswordSchema.d.ts

@@ -8,23 +8,23 @@ export declare const createForgotPasswordSchema: (mobileNumberParser: MobileNumb
     mobileNumber: z.ZodEffects<z.ZodString, string, string>;
     verificationCode: z.ZodEffects<z.ZodString, string, string>;
 }, "strip", z.ZodTypeAny, {
-    password: string;
     verificationCode: string;
+    password: string;
     mobileNumber: string;
     confirmPassword: string;
 }, {
-    password: string;
     verificationCode: string;
+    password: string;
     mobileNumber: string;
     confirmPassword: string;
 }>, {
-    password: string;
     verificationCode: string;
+    password: string;
     mobileNumber: string;
     confirmPassword: string;
 }, {
-    password: string;
     verificationCode: string;
+    password: string;
     mobileNumber: string;
     confirmPassword: string;
 }>;