@opexa/portal-components 0.0.515 → 0.0.516

package/dist/components/KYC/KYC.lazy.d.ts

@@ -0,0 +1,6 @@
+import type { ImageProps } from 'next/image';
+import { type KYCReminderProps } from './KYCReminder.lazy';
+export interface KYCProps extends KYCReminderProps {
+    logo: ImageProps['src'];
+}
+export declare function KYC(props: KYCProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import Image from 'next/image';
+import { useEffect } from 'react';
+import { useShallow } from 'zustand/shallow';
+import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import { useMemberVerificationQuery } from '../../client/hooks/useMemberVerificationQuery.js';
+import { XIcon } from '../../icons/XIcon.js';
+import { Dialog } from '../../ui/Dialog/index.js';
+import { Portal } from '../../ui/Portal/index.js';
+import { BasicInformation } from './BasicInformation.js';
+import { IdentityVerification } from './IdentityVerification.js';
+import { Indicator } from './Indicator.js';
+import { KYCContext } from './KYCContext.js';
+import { KYCReminder } from './KYCReminder.lazy.js';
+import { PersonalInformation } from './PersonalInformation.js';
+import { useKYC } from './useKYC.js';
+export function KYC(props) {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({ kyc: ctx.kyc })));
+    const kyc = useKYC();
+    const { data: account } = useAccountQuery();
+    const { data: verification } = useMemberVerificationQuery();
+    const isBasicInfoCompleted = account?.realName !== null && account?.birthDay !== null;
+    const isUploadCompleted = Boolean(verification?.idFrontImage) && Boolean(verification?.selfieImage);
+    const isVerified = Boolean(verification?.status === 'VERIFIED') ||
+        Boolean(verification?.status === 'PENDING') ||
+        Boolean(verification?.status === 'APPROVED');
+    const isRejected = Boolean(verification?.status === 'REJECTED');
+    const hasMissingData = !isBasicInfoCompleted || !isUploadCompleted || !isVerified;
+    const steps = !isBasicInfoCompleted
+        ? 1
+        : !isUploadCompleted
+            ? 2
+            : isRejected
+                ? 2
+                : 3;
+    useEffect(() => {
+        if (steps) {
+            kyc.setStep(steps);
+        }
+    }, [steps, kyc]);
+    return (_jsxs(_Fragment, { children: [_jsx(KYCContext, { value: kyc, children: _jsx(Dialog.Root, { open: globalStore.kyc.open && hasMissingData, onOpenChange: (details) => {
+                        globalStore.kyc.setOpen(details.open);
+                    }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: kyc.reset, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: "mx-auto min-h-full w-full overflow-y-auto bg-bg-primary-alt lg:min-h-auto lg:w-fit", children: _jsxs("div", { className: "flex h-dvh w-full flex-col overflow-y-auto p-3xl sm:h-fit sm:overflow-auto lg:w-[400px]", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto mb-5 block h-7.5 w-auto", draggable: false }), _jsx(Indicator, {}), kyc.step === 1 && _jsx(BasicInformation, {}), kyc.step === 2 && _jsx(IdentityVerification, {}), kyc.step === 3 && _jsx(PersonalInformation, {})] }) }) })] }) }) }), _jsx(KYCReminder, { ...props })] }));
+}

package/dist/components/KYC/KYCContext.d.ts

@@ -0,0 +1,6 @@
+import type { UseKYCReturn } from './useKYC';
+export declare const KYCContext: (props: {
+    value: UseKYCReturn;
+} & {
+    children?: import("react").ReactNode | undefined;
+}) => React.ReactNode, useKYCContext: () => UseKYCReturn;

package/dist/components/KYC/KYCContext.js

@@ -0,0 +1,2 @@
+import { createContext } from '../../client/utils/createContext.js';
+export const [KYCContext, useKYCContext] = createContext();

package/dist/components/KYC/KYCDefault/IdentityVerification.js

@@ -5,7 +5,6 @@ import { useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { useShallow } from 'zustand/shallow';
-import { useAccountQuery } from '../../../client/hooks/useAccountQuery.js';
 import { useCreateMemberVerificationMutation } from '../../../client/hooks/useCreateMemberVerificationMutation.js';
 import { useFeatureFlag } from '../../../client/hooks/useFeatureFlag.js';
 import { useGlobalStore } from '../../../client/hooks/useGlobalStore.js';
@@ -27,8 +26,6 @@ const formSchema = z.object({
 export function IdentityVerification() {
     const kyc = useKYCDefaultContext();
     const featureFlag = useFeatureFlag();
-    const { data: account, isLoading: accountLoading } = useAccountQuery();
-    const isVerificationLocked = account?.status === 'VERIFICATION_LOCKED';
     const { mutate: createMemberVerification, isPending: createPending } = useCreateMemberVerificationMutation({
         onSuccess: () => {
             toaster.success({

package/dist/components/KYC/KYCDefault/PersonalInformation.js

@@ -3,7 +3,6 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { useShallow } from 'zustand/shallow';
-import { useAccountQuery } from '../../../client/hooks/useAccountQuery.js';
 import { useApproveMemberVerification } from '../../../client/hooks/useApproveMemberVerification.js';
 import { useCreateMemberVerificationMutation } from '../../../client/hooks/useCreateMemberVerificationMutation.js';
 import { useFeatureFlag } from '../../../client/hooks/useFeatureFlag.js';
@@ -36,8 +35,6 @@ export function PersonalInformation() {
     })));
     const memberVerificationQuery = useMemberVerificationQuery();
     const memberVerificationId = memberVerificationQuery.data?.id;
-    const { data: account, isLoading: accountLoading } = useAccountQuery();
-    const isVerificationLocked = account?.status === 'VERIFICATION_LOCKED';
     const approveMemberVerificationMutation = useApproveMemberVerification();
     const updateMemberVerificationMutation = useUpdateMemberVerificationMutation({
         onError(error) {

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

@@ -43,11 +43,16 @@ export function KYCReminder(props) {
         }, 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: _jsxs(Dialog.Content, { className: "mx-auto h-fit max-w-[calc(100dvw-1rem)] overflow-y-auto rounded-lg bg-bg-primary lg:max-w-[400px]", children: [isVerificationLocked && !isPending && (_jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto mb-4 w-fit rounded-full p-2", children: _jsx(Image, { src: props.logo, alt: `${props.siteName} logo`, width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }) }), _jsx("h2", { className: `mt-4 font-semibold text-lg ${props.titleBgColor}`, children: "Temporarily Locked" }), _jsx("p", { className: `mt-xs text-sm text-text-tertiary-600 ${props.descriptionBgColor}`, children: "Your account has been locked due to incomplete verification. Please complete your verification to restore full access." }), _jsxs("div", { className: "mt-6 flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: props.pagcorLogo ?? pagcorLogo, alt: "PAGCOR logo", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false, unoptimized: true }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "Responsible Gaming logo", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false, unoptimized: true })] }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-6 space-y-lg", children: _jsx(Button, { onClick: () => {
                                                     api.setOpen(false);
                                                     globalStore.kyc.setOpen(true);
-                                                }, children: "Complete KYC" }) })) })] })), isNotVerified && daysFromCreationToNow <= 3 && daysFromCreationToNow >= 1 && !isVerificationLocked && (_jsxs(_Fragment, { children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto mb-4 w-fit rounded-full bg-bg-primary p-2", children: _jsx(Image, { src: props.logo, alt: `${props.siteName} logo`, width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }) }), _jsx("h2", { className: `mt-4 font-semibold text-lg ${props.titleBgColor}`, children: "JUST A FRIENDLY REMINDER" }), _jsxs("p", { className: `mt-xs text-sm text-text-tertiary-600 ${props.descriptionBgColor}`, children: ["Please complete your KYC information within", ' ', _jsx("span", { className: "font-semibold text-[#FF0000]", children: "3 days" }), ' ', "to avoid temporary lock on your account."] }), _jsxs("div", { className: "mt-6 flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: props.pagcorLogo ?? pagcorLogo, alt: "PAGCOR logo", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false, unoptimized: true }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "Responsible Gaming logo", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false, unoptimized: true })] }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-6 space-y-lg", children: _jsx(Button, { onClick: () => {
+                                                }, children: "Complete KYC" }) })) })] })), isNotVerified &&
+                                daysFromCreationToNow <= 3 &&
+                                daysFromCreationToNow >= 1 &&
+                                !isVerificationLocked && (_jsxs(_Fragment, { children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto mb-4 w-fit rounded-full bg-bg-primary p-2", children: _jsx(Image, { src: props.logo, alt: `${props.siteName} logo`, width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }) }), _jsx("h2", { className: `mt-4 font-semibold text-lg ${props.titleBgColor}`, children: "JUST A FRIENDLY REMINDER" }), _jsxs("p", { className: `mt-xs text-sm text-text-tertiary-600 ${props.descriptionBgColor}`, children: ["Please complete your KYC information within", ' ', _jsx("span", { className: "font-semibold text-[#FF0000]", children: "3 days" }), ' ', "to avoid temporary lock on your account."] }), _jsxs("div", { className: "mt-6 flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: props.pagcorLogo ?? pagcorLogo, alt: "PAGCOR logo", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false, unoptimized: true }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "Responsible Gaming logo", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false, unoptimized: true })] }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-6 space-y-lg", children: _jsx(Button, { onClick: () => {
                                                             api.setOpen(false);
                                                             globalStore.kyc.setOpen(true);
-                                                        }, children: "Complete KYC" }) })) })] })] })), isNotVerified && !(daysFromCreationToNow <= 3 && daysFromCreationToNow >= 1) && !isVerificationLocked && (_jsxs(_Fragment, { children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto w-fit rounded-full bg-bg-primary p-2", children: _jsx(FileCheck02Icon, { className: "text-[#FEDF89]" }) }), _jsx("h2", { className: `mt-4 font-semibold text-lg ${props.titleBgColor}`, children: "Personal Verification" }), _jsxs("p", { className: `mt-xs text-sm text-text-tertiary-600 ${props.descriptionBgColor}`, children: ["All new users are required to complete identity verification to access the full range of ", props.siteName, " services, including withdrawals."] }), _jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "mt-3xl space-y-lg", children: [_jsx(Button, { onClick: () => {
+                                                        }, children: "Complete KYC" }) })) })] })] })), isNotVerified &&
+                                !(daysFromCreationToNow <= 3 && daysFromCreationToNow >= 1) &&
+                                !isVerificationLocked && (_jsxs(_Fragment, { children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto w-fit rounded-full bg-bg-primary p-2", children: _jsx(FileCheck02Icon, { className: "text-[#FEDF89]" }) }), _jsx("h2", { className: `mt-4 font-semibold text-lg ${props.titleBgColor}`, children: "Personal Verification" }), _jsxs("p", { className: `mt-xs text-sm text-text-tertiary-600 ${props.descriptionBgColor}`, children: ["All new users are required to complete identity verification to access the full range of ", props.siteName, ' ', "services, including withdrawals."] }), _jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "mt-3xl space-y-lg", children: [_jsx(Button, { onClick: () => {
                                                                 api.setOpen(false);
                                                                 globalStore.kyc.setOpen(true);
-                                                            }, children: "Verify Now" }), _jsx(Button, { type: "button", variant: "outline", fullWidth: true, onClick: () => api.setOpen(false), children: "Do it later" })] })) })] })] })), isPending && (_jsx(_Fragment, { children: _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto mb-4 w-fit rounded-full bg-bg-primary p-2", children: _jsx(Image, { src: props.logo, alt: `${props.siteName} logo`, width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }) }), _jsx("div", { className: "mx-auto w-fit rounded-full border border-[#F9DBAF] dark:border-[#932F19] bg-[#FEF6EE] dark:bg-[#511C10] px-2.5 py-0.5", children: _jsx("p", { className: "text-sm font-medium text-[#B93815] dark:text-[#F7B27A]", children: "Pending..." }) }), _jsx("h2", { className: `mt-4 font-semibold text-lg ${props.titleBgColor}`, children: "VERIFICATION IN PROGRESS" }), _jsx("p", { className: `mt-xs text-sm text-text-tertiary-600 ${props.descriptionBgColor}`, children: "Your account is verification-locked. Please wait for approval to regain full access to this platform." }), _jsxs("div", { className: "mt-6 flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: props.pagcorLogo ?? pagcorLogo, alt: "PAGCOR logo", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false, unoptimized: true }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "Responsible Gaming logo", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false, unoptimized: true })] })] }) }))] }) })] }) }));
+                                                            }, children: "Verify Now" }), _jsx(Button, { type: "button", variant: "outline", fullWidth: true, onClick: () => api.setOpen(false), children: "Do it later" })] })) })] })] })), isPending && (_jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto mb-4 w-fit rounded-full bg-bg-primary p-2", children: _jsx(Image, { src: props.logo, alt: `${props.siteName} logo`, width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }) }), _jsx("div", { className: 'mx-auto w-fit rounded-full border border-[#F9DBAF] bg-[#FEF6EE] px-2.5 py-0.5 dark:border-[#932F19] dark:bg-[#511C10]', children: _jsx("p", { className: 'font-medium text-[#B93815] text-sm dark:text-[#F7B27A]', children: "Pending..." }) }), _jsx("h2", { className: `mt-4 font-semibold text-lg ${props.titleBgColor}`, children: "VERIFICATION IN PROGRESS" }), _jsx("p", { className: `mt-xs text-sm text-text-tertiary-600 ${props.descriptionBgColor}`, children: "Your account is verification-locked. Please wait for approval to regain full access to this platform." }), _jsxs("div", { className: "mt-6 flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: props.pagcorLogo ?? pagcorLogo, alt: "PAGCOR logo", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false, unoptimized: true }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "Responsible Gaming logo", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false, unoptimized: true })] })] }))] }) })] }) }));
 }

package/dist/components/KYC/KycOpenOnHomeMount.js

@@ -53,6 +53,7 @@ export function KycOpenOnHomeMount() {
         accountLoading,
         hasntCompletedKYC,
         isVerificationLocked,
+        isPending
     ]);
     return null;
 }

package/dist/components/KYC/PersonalInformation.d.ts

@@ -0,0 +1 @@
+export declare function PersonalInformation(): import("react/jsx-runtime").JSX.Element;

package/dist/components/KYC/PersonalInformation.js

@@ -0,0 +1,122 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+import { useShallow } from 'zustand/shallow';
+import { useApproveMemberVerification } from '../../client/hooks/useApproveMemberVerification.js';
+import { useCreateMemberVerificationMutation } from '../../client/hooks/useCreateMemberVerificationMutation.js';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import { useMemberVerificationQuery } from '../../client/hooks/useMemberVerificationQuery.js';
+import { useUpdateMemberVerificationMutation } from '../../client/hooks/useUpdateMemberVerificationMutation.js';
+import { toaster } from '../../client/utils/toaster.js';
+import { CheckIcon } from '../../icons/CheckIcon.js';
+import { Button } from '../../ui/Button/index.js';
+import { Checkbox } from '../../ui/Checkbox/index.js';
+import { Dialog } from '../../ui/Dialog/index.js';
+import { Field } from '../../ui/Field/index.js';
+import { getQueryClient } from '../../utils/getQueryClient.js';
+import { getMemberVerificationQueryKey } from '../../utils/queryKeys.js';
+import { useKYCContext } from './KYCContext.js';
+const definition = z.object({
+    address: z.string().trim().min(1, 'Current address is required'),
+    permanentAddress: z.string().trim().min(1, 'Permanent address is required'),
+    sourceOfIncome: z.string().trim().min(1, 'Source of Income is required'),
+    natureOfWork: z.string().trim().min(1, 'Nature of Work is required'),
+    placeOfBirth: z.string().trim().min(1, 'Place of Birth is required'),
+    nationality: z.string().trim().min(1, 'Nationality is required'),
+});
+export function PersonalInformation() {
+    const kyc = useKYCContext();
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        kyc: ctx.kyc,
+    })));
+    const memberVerificationQuery = useMemberVerificationQuery();
+    const memberVerificationId = memberVerificationQuery.data?.id;
+    const approveMemberVerificationMutation = useApproveMemberVerification();
+    const updateMemberVerificationMutation = useUpdateMemberVerificationMutation({
+        onError(error) {
+            toaster.error({
+                description: error.message,
+            });
+        },
+        onSuccess() {
+            const queryClient = getQueryClient();
+            queryClient.setQueryData(getMemberVerificationQueryKey(), (prev) => {
+                if (!prev)
+                    return prev;
+                return {
+                    ...prev,
+                    status: 'PENDING',
+                };
+            });
+            kyc.setDone(true);
+            globalStore.kyc.setOpen(false);
+            toaster.success({
+                title: 'Success',
+                description: 'Personal information has been set successfully.',
+            });
+        },
+    });
+    const createMemberVerificationMutation = useCreateMemberVerificationMutation({
+        onError(error) {
+            toaster.error({
+                description: error.message,
+            });
+        },
+        onSuccess() {
+            kyc.setDone(true);
+            globalStore.kyc.setOpen(false);
+            toaster.success({
+                title: 'Success',
+                description: 'Personal information has been set successfully.',
+            });
+        },
+    });
+    const form = useForm({
+        resolver: zodResolver(definition),
+        defaultValues: {
+            address: '',
+            nationality: '',
+            natureOfWork: '',
+            placeOfBirth: '',
+            permanentAddress: '',
+        },
+        mode: 'all',
+    });
+    async function onSubmit(values) {
+        if (!memberVerificationId) {
+            createMemberVerificationMutation.mutate({
+                ...values,
+            });
+        }
+        else {
+            await updateMemberVerificationMutation.mutateAsync({
+                id: memberVerificationId,
+                data: {
+                    ...values,
+                },
+            });
+            //approve status of member to be pending
+            await approveMemberVerificationMutation.mutateAsync({
+                id: memberVerificationId,
+            });
+        }
+    }
+    const address = form.watch('address');
+    const permanentAddress = form.watch('permanentAddress');
+    return (_jsxs("div", { children: [_jsx(Dialog.Title, { className: "text-center font-semibold text-lg", children: "Personal Information" }), _jsx(Dialog.Description, { className: "mt-xs text-center text-sm text-text-secondary-700", children: "Provide your basic details and work info." }), _jsxs("form", { className: "mt-7", onSubmit: form.handleSubmit(onSubmit), children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.permanentAddress, children: [_jsx(Field.Label, { children: "Permanent address" }), _jsx(Field.Input, { placeholder: "Enter your permanent address", ...form.register('permanentAddress') }), _jsx(Field.ErrorText, { children: form.formState.errors.permanentAddress?.message })] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.address, children: [_jsx(Field.Label, { children: "Current address" }), _jsx(Field.Input, { placeholder: "Enter your current address", ...form.register('address') }), _jsx(Field.ErrorText, { children: form.formState.errors.address?.message })] }), _jsxs(Checkbox.Root, { className: "mt-md", checked: address !== '' &&
+                            permanentAddress !== '' &&
+                            address === permanentAddress, onCheckedChange: (details) => {
+                            if (details.checked === true) {
+                                form.setValue('address', form.getValues('permanentAddress'), {
+                                    shouldDirty: true,
+                                    shouldTouch: true,
+                                    shouldValidate: true,
+                                });
+                            }
+                        }, disabled: !permanentAddress, children: [_jsx(Checkbox.Control, { children: _jsx(Checkbox.Indicator, { asChild: true, children: _jsx(CheckIcon, {}) }) }), _jsx(Checkbox.Label, { children: "Use permanent address as current address" }), _jsx(Checkbox.HiddenInput, {})] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.sourceOfIncome, children: [_jsx(Field.Label, { children: "Source of income" }), _jsx(Field.Input, { placeholder: "Enter your source of income", ...form.register('sourceOfIncome') }), _jsx(Field.ErrorText, { children: form.formState.errors.sourceOfIncome?.message })] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.natureOfWork, children: [_jsx(Field.Label, { children: "Work Description" }), _jsx(Field.Input, { placeholder: "Enter your work description", ...form.register('natureOfWork') }), _jsx(Field.ErrorText, { children: form.formState.errors.natureOfWork?.message })] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.placeOfBirth, children: [_jsx(Field.Label, { children: "Place of birth" }), _jsx(Field.Input, { placeholder: "Enter your place of birth", ...form.register('placeOfBirth') }), _jsx(Field.ErrorText, { children: form.formState.errors.placeOfBirth?.message })] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.nationality, children: [_jsx(Field.Label, { children: "Nationality" }), _jsx(Field.Input, { placeholder: "Enter your nationality", ...form.register('nationality') }), _jsx(Field.ErrorText, { children: form.formState.errors.nationality?.message })] }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: updateMemberVerificationMutation.isPending ||
+                            createMemberVerificationMutation.isPending, children: "Continue" }), _jsx(Button, { variant: "outline", colorScheme: "gray", className: "mt-lg", onClick: () => {
+                            globalStore.kyc.setOpen(false);
+                        }, disabled: updateMemberVerificationMutation.isPending ||
+                            createMemberVerificationMutation.isPending, children: "Skip for now" })] })] }));
+}

package/dist/components/KYC/useKYC.d.ts

@@ -0,0 +1,25 @@
+type EventDetail = {
+    type: 'SELFIE_CAPTURED';
+    data: string;
+} | {
+    type: 'ID_DOCUMENT_CAPTURED';
+    data: string;
+};
+type UnsubscribeFn = () => void;
+type Subscriber = (detail: EventDetail) => UnsubscribeFn;
+export type CaptureSubject = 'SELFIE' | 'ID_DOCUMENT';
+export interface UseKYCReturn {
+    step: number;
+    setStep: (step: number) => void;
+    done: boolean;
+    setDone: (done: boolean) => void;
+    subscribe: (subscriber: Subscriber) => UnsubscribeFn;
+    triggerEvent: (detail: EventDetail) => void;
+    idFrontImageId: string | null;
+    setFrontImageId: (id: string | null) => void;
+    selfieImageId: string | null;
+    setSelfieImageId: (id: string | null) => void;
+    reset: () => void;
+}
+export declare function useKYC(): UseKYCReturn;
+export {};

package/dist/components/KYC/useKYC.js

@@ -0,0 +1,38 @@
+import { useRef, useState } from 'react';
+export function useKYC() {
+    const [step, setStep] = useState(2);
+    const [done, setDone] = useState(false);
+    const [idFrontImageId, setFrontImageId] = useState(null);
+    const [selfieImageId, setSelfieImageId] = useState(null);
+    const subscribers = useRef([]);
+    const subscribe = (subscriber) => {
+        subscribers.current.push(subscriber);
+        return () => {
+            subscribers.current = subscribers.current.filter((item) => item !== subscriber);
+        };
+    };
+    const triggerEvent = (detail) => {
+        subscribers.current.forEach((subscriber) => {
+            subscriber(detail);
+        });
+    };
+    const reset = () => {
+        setStep(1);
+        setDone(false);
+        setFrontImageId(null);
+        setSelfieImageId(null);
+    };
+    return {
+        step,
+        setStep,
+        done,
+        setDone,
+        idFrontImageId,
+        setFrontImageId,
+        selfieImageId,
+        setSelfieImageId,
+        subscribe,
+        triggerEvent,
+        reset,
+    };
+}

package/dist/components/PortalProvider/CXDTokenObserver.d.ts

@@ -0,0 +1 @@
+export declare function CXDTokenObserver(): null;

package/dist/components/PortalProvider/CXDTokenObserver.js

@@ -0,0 +1,30 @@
+'use client';
+import { addHours } from 'date-fns';
+import { clamp } from 'lodash-es';
+import { useSearchParams } from 'next/navigation';
+import { useLocalStorage, useTimeout } from 'usehooks-ts';
+import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
+export function CXDTokenObserver() {
+    const searchParams = useSearchParams();
+    const cxdToken = searchParams.get('cxd');
+    const accountQuery = useAccountQuery();
+    const account = accountQuery.data;
+    const [cxd, setCxd, removeCxd] = useLocalStorage('WebPortalCellxpertCxd', null);
+    const now = new Date();
+    const shouldTimeoutRun = cxdToken && account;
+    const removeCxdUntilInMs = cxd?.timestamp
+        ? clamp(cxd.timestamp - now.getTime(), 0, Infinity)
+        : 0;
+    useTimeout(() => {
+        const isSame = cxd?.cxd === cxdToken;
+        if (!isSame) {
+            const extendedTimestamp = addHours(new Date(), 6).getTime();
+            setCxd({
+                cxd: cxdToken,
+                timestamp: extendedTimestamp,
+            });
+        }
+    }, shouldTimeoutRun ? 100 : null);
+    useTimeout(() => removeCxd(), shouldTimeoutRun ? removeCxdUntilInMs : null);
+    return null;
+}

package/dist/components/PortalProvider/LinkGoogleAccountObserver.d.ts

@@ -0,0 +1 @@
+export declare function LinkGoogleAccountObserver(): null;

package/dist/components/PortalProvider/LinkGoogleAccountObserver.js

@@ -0,0 +1,29 @@
+'use client';
+import { useSearchParams } from 'next/navigation';
+import { useTimeout } from 'usehooks-ts';
+import { toaster } from '../../client/utils/toaster.js';
+import { getQueryClient } from '../../utils/getQueryClient.js';
+import { getSessionQueryKey } from '../../utils/queryKeys.js';
+export function LinkGoogleAccountObserver() {
+    const searchParams = useSearchParams();
+    const code = searchParams.get('message') ?? searchParams.get('status');
+    const queryClient = getQueryClient();
+    useTimeout(() => {
+        if (code === 'duplicate') {
+            return toaster.error({
+                title: 'Duplicate Account',
+                description: 'An account with this email already exists. Please try signing in instead.',
+            });
+        }
+        if (code === 'linked') {
+            queryClient.invalidateQueries({
+                queryKey: getSessionQueryKey(),
+            });
+            return toaster.success({
+                title: 'Google Account Linked Successfully',
+                description: 'Your Google account has been successfully connected.',
+            });
+        }
+    }, code ? 100 : null);
+    return null;
+}

package/dist/components/Quests/Quests.client.js

@@ -60,7 +60,7 @@ export function Quests__client(props) {
                     setTab(TabDefinition.catch('AVAILABLE').parse(details.value));
                 }, className: "mt-3 w-full overflow-x-auto lg:mt-4.5 lg:w-fit", children: [_jsxs(SegmentGroup.Item, { value: "AVAILABLE", className: "w-full lg:w-fit", children: [_jsx(SegmentGroup.ItemText, { children: "Available" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "COMPLETED", className: "w-full lg:w-fit", children: [_jsx(SegmentGroup.ItemText, { children: "Completed" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "FAILED", className: "w-full lg:w-fit", children: [_jsx(SegmentGroup.ItemText, { children: "Failed" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsx(SegmentGroup.Indicator, {})] }), _jsx("div", { className: "mt-3xl grid gap-3xl lg:mt-lg lg:grid-cols-3", children: quests.length > 0 ? (quests.map((quest) => {
                     const Quest = quest.stages?.length && featureFlag.enabled
-                        ? QUEST_COMPONENT_MAP['MULTI_WAGERING']
+                        ? QUEST_COMPONENT_MAP.MULTI_WAGERING
                         : QUEST_COMPONENT_MAP[quest.type];
                     return (_jsx(QuestContext, { value: quest, children: _jsx(Suspense, { children: _jsx(Quest, { className: quest.type === 'WAGERING'
                                     ? classNames?.wageringQuest

package/dist/components/SessionWatcher/SessionWatcher.d.ts

@@ -0,0 +1 @@
+export declare function SessionWatcher(): null;

package/dist/components/SessionWatcher/SessionWatcher.js

@@ -0,0 +1,20 @@
+'use client';
+import { useRouter } from 'next/navigation';
+import { useCallback, useEffect } from 'react';
+import { useSessionHealthQuery } from '../../client/hooks/useSessionHealthQuery.js';
+import { useSignOutMutation } from '../../client/hooks/useSignOutMutation.js';
+export function SessionWatcher() {
+    const router = useRouter();
+    const query = useSessionHealthQuery({ refetchInterval: 1000 * 5 });
+    const healthy = query.data ?? true;
+    const mutation = useSignOutMutation();
+    const signOut = useCallback(async () => {
+        await mutation.mutateAsync();
+        router.refresh();
+    }, [mutation, router]);
+    useEffect(() => {
+        if (!healthy)
+            signOut();
+    }, [healthy, signOut]);
+    return null;
+}

package/dist/components/SessionWatcher/index.d.ts

@@ -0,0 +1 @@
+export * from './SessionWatcher';

package/dist/components/SessionWatcher/index.js

@@ -0,0 +1 @@
+export * from './SessionWatcher.js';

package/dist/components/SignIn/MobileNumberSignIn.js

@@ -48,7 +48,7 @@ export function MobileNumberSignIn() {
             context.setStep(1);
             globalStore.signIn.setOpen(false);
         },
-        onError: (err) => {
+        onError: () => {
             toaster.error({
                 title: 'Invalid Verification Code',
                 description: 'Please enter the correct verification code',

package/dist/components/SignUp/SignUpDefault/SignUpDefaultForm.js

@@ -199,7 +199,7 @@ export function SignUpDefaultForm() {
                                             placement: 'bottom',
                                         }, lazyMount: true, unmountOnExit: true, children: [_jsxs(Select.Label, { className: "flex items-center gap-1", children: ["Branch", _jsxs(Tooltip.Root, { openDelay: 0, closeDelay: 100, lazyMount: true, unmountOnExit: true, positioning: {
                                                             placement: 'top',
-                                                        }, children: [_jsx(Tooltip.Trigger, { children: _jsx(HelpCircleIcon, { className: "size-4 text-text-nav-item-button-icon" }) }), _jsx(Tooltip.Positioner, { children: _jsxs(Tooltip.Content, { children: [_jsx(Tooltip.Arrow, { children: _jsx(Tooltip.ArrowTip, {}) }), "Choose branch closest to your residence."] }) })] })] }), _jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, {}), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: branchCollection.items.map((item) => {
+                                                        }, children: [_jsx(Tooltip.Trigger, { asChild: true, children: _jsx(HelpCircleIcon, { className: "size-4 text-text-nav-item-button-icon" }) }), _jsx(Tooltip.Positioner, { children: _jsxs(Tooltip.Content, { children: [_jsx(Tooltip.Arrow, { children: _jsx(Tooltip.ArrowTip, {}) }), "Choose branch closest to your residence."] }) })] })] }), _jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, {}), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: branchCollection.items.map((item) => {
                                                         const label = branchCollection.stringifyItem(item) ?? '';
                                                         return (_jsx(Select.Item, { item: item, "aria-disabled": item.disabled, className: twMerge(item.disabled && 'text-border-disabled'), children: _jsx("div", { title: label, className: "line-clamp-1", children: label }) }, item.code));
                                                     }) }) })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.branchCode?.message })] })), _jsx(Controller, { control: step1Form.control, name: "termsAccepted", render: (o) => (_jsxs(Field.Root, { className: "mt-2xl", invalid: o.fieldState.invalid, children: [_jsxs(Checkbox.Root, { checked: o.field.value, onCheckedChange: (details) => {
@@ -313,10 +313,26 @@ function DateOfBirthField(props) {
         defaultValue: props.defaultValue ?? null,
         onChange: props.onChange,
     });
+    // Custom input handler to automatically add slashes
+    const handleInput = (e) => {
+        const input = e.currentTarget;
+        let value = input.value.replace(/\D/g, ''); // Remove all non-digits
+        // Add slashes at appropriate positions
+        if (value.length >= 2) {
+            value = value.slice(0, 2) + '/' + value.slice(2);
+        }
+        if (value.length >= 5) {
+            value = value.slice(0, 5) + '/' + value.slice(5);
+        }
+        // Limit to MM/DD/YYYY format (8 characters + 2 slashes = 10 total)
+        value = value.slice(0, 10);
+        // Update the input value
+        input.value = value;
+    };
     return (_jsxs(DatePicker.Root, { size: "md", variant: "outline", placeholder: "MM/DD/YYYY", lazyMount: true, unmountOnExit: true, fixedWeeks: true, selectionMode: "single", value: value ? [parseDate(value)] : [], onValueChange: (details) => {
             const value = details.value.at(0)?.toDate(DEVICE_TIMEZONE);
             setValue(value ?? null);
-        }, children: [_jsx(DatePicker.Label, { children: "Date of Birth" }), _jsxs(DatePicker.Control, { children: [_jsx(DatePicker.Input, { onBlur: props.onBlur, onFocus: props.onFocus }), _jsx(DatePicker.Trigger, { children: _jsx(CalendarIcon, {}) })] }), _jsx(DatePicker.Positioner, { children: _jsxs(DatePicker.Content, { children: [_jsx(DatePicker.View, { view: "day", children: _jsx(DatePicker.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: api.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.substring(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: api.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] })) }) }), _jsx(DatePicker.View, { view: "month", children: _jsx(DatePicker.Context, { children: (datePicker) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsx(DatePicker.Table, { children: _jsx(DatePicker.TableBody, { children: datePicker
+        }, children: [_jsx(DatePicker.Label, { children: "Date of Birth" }), _jsxs(DatePicker.Control, { children: [_jsx(DatePicker.Input, { onBlur: props.onBlur, onFocus: props.onFocus, onInput: handleInput }), _jsx(DatePicker.Trigger, { children: _jsx(CalendarIcon, {}) })] }), _jsx(DatePicker.Positioner, { children: _jsxs(DatePicker.Content, { children: [_jsx(DatePicker.View, { view: "day", children: _jsx(DatePicker.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: api.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.substring(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: api.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] })) }) }), _jsx(DatePicker.View, { view: "month", children: _jsx(DatePicker.Context, { children: (datePicker) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsx(DatePicker.Table, { children: _jsx(DatePicker.TableBody, { children: datePicker
                                                     .getMonthsGrid({ columns: 4, format: 'short' })
                                                     .map((months, id) => (_jsx(DatePicker.TableRow, { children: months.map((month, id) => (_jsx(DatePicker.TableCell, { value: month.value, children: _jsx(DatePicker.TableCellTrigger, { className: "w-[4.425rem]", children: month.label }) }, id))) }, id))) }) })] })) }) }), _jsx(DatePicker.View, { view: "year", children: _jsx(DatePicker.Context, { children: (datePicker) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsx(DatePicker.Table, { children: _jsx(DatePicker.TableBody, { children: datePicker
                                                     .getYearsGrid({ columns: 4 })

package/dist/components/SignUp/SignUpKYC/SignUpKYCForm.js

@@ -462,10 +462,26 @@ function DateOfBirthField(props) {
         defaultValue: props.defaultValue ?? null,
         onChange: props.onChange,
     });
+    // Custom input handler to automatically add slashes
+    const handleInput = (e) => {
+        const input = e.currentTarget;
+        let value = input.value.replace(/\D/g, ''); // Remove all non-digits
+        // Add slashes at appropriate positions
+        if (value.length >= 2) {
+            value = value.slice(0, 2) + '/' + value.slice(2);
+        }
+        if (value.length >= 5) {
+            value = value.slice(0, 5) + '/' + value.slice(5);
+        }
+        // Limit to MM/DD/YYYY format (8 characters + 2 slashes = 10 total)
+        value = value.slice(0, 10);
+        // Update the input value
+        input.value = value;
+    };
     return (_jsxs(DatePicker.Root, { size: "md", variant: "outline", placeholder: "MM/DD/YYYY", lazyMount: true, unmountOnExit: true, fixedWeeks: true, selectionMode: "single", value: value ? [parseDate(value)] : [], onValueChange: (details) => {
             const value = details.value.at(0)?.toDate(DEVICE_TIMEZONE);
             setValue(value ?? null);
-        }, children: [_jsx(DatePicker.Label, { children: "Date of Birth" }), _jsxs(DatePicker.Control, { children: [_jsx(DatePicker.Input, { onBlur: props.onBlur, onFocus: props.onFocus }), _jsx(DatePicker.Trigger, { children: _jsx(CalendarIcon, {}) })] }), _jsx(DatePicker.Positioner, { children: _jsxs(DatePicker.Content, { children: [_jsx(DatePicker.View, { view: "day", children: _jsx(DatePicker.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: api.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.substring(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: api.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] })) }) }), _jsx(DatePicker.View, { view: "month", children: _jsx(DatePicker.Context, { children: (datePicker) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsx(DatePicker.Table, { children: _jsx(DatePicker.TableBody, { children: datePicker
+        }, children: [_jsx(DatePicker.Label, { children: "Date of Birth" }), _jsxs(DatePicker.Control, { children: [_jsx(DatePicker.Input, { onBlur: props.onBlur, onFocus: props.onFocus, onInput: handleInput }), _jsx(DatePicker.Trigger, { children: _jsx(CalendarIcon, {}) })] }), _jsx(DatePicker.Positioner, { children: _jsxs(DatePicker.Content, { children: [_jsx(DatePicker.View, { view: "day", children: _jsx(DatePicker.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: api.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.substring(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: api.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] })) }) }), _jsx(DatePicker.View, { view: "month", children: _jsx(DatePicker.Context, { children: (datePicker) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsx(DatePicker.Table, { children: _jsx(DatePicker.TableBody, { children: datePicker
                                                     .getMonthsGrid({ columns: 4, format: 'short' })
                                                     .map((months, id) => (_jsx(DatePicker.TableRow, { children: months.map((month, id) => (_jsx(DatePicker.TableCell, { value: month.value, children: _jsx(DatePicker.TableCellTrigger, { className: "w-[4.425rem]", children: month.label }) }, id))) }, id))) }) })] })) }) }), _jsx(DatePicker.View, { view: "year", children: _jsx(DatePicker.Context, { children: (datePicker) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsx(DatePicker.Table, { children: _jsx(DatePicker.TableBody, { children: datePicker
                                                     .getYearsGrid({ columns: 4 })

package/dist/components/shared/IdFrontImageField/useIdFrontImageField.js

@@ -1,7 +1,6 @@
 import { useFieldContext } from '@ark-ui/react';
 import { useRef } from 'react';
 import invariant from 'tiny-invariant';
-import { useMediaQuery } from 'usehooks-ts';
 import { useCamera } from '../../../client/hooks/useCamera.js';
 import { useControllableState } from '../../../client/hooks/useControllableState.js';
 import { useDisclosure } from '../../../client/hooks/useDisclosure.js';
@@ -42,10 +41,10 @@ export function useIdFrontImageField(props) {
     const inputRef = useRef(null);
     const maskRef = useRef(null);
     const guideRef = useRef(null);
-    const desktop = useMediaQuery('(min-width: 1024px)');
+    // const desktop = useMediaQuery('(min-width: 1024px)');
     const camera = useCamera({
         video: {
-            facingMode: desktop ? 'user' : 'environment',
+            facingMode: 'user',
         },
         async transform(data) {
             const guideRect = guideRef.current?.getBoundingClientRect();

package/dist/components/shared/SelfieImageField/useSelfieImageField.js

@@ -45,6 +45,9 @@ export function useSelfieImageField(props) {
     const guideRef = useRef(null);
     const [validatingFace, setValidatingFace] = useState(false);
     const camera = useCamera({
+        video: {
+            facingMode: 'environment',
+        },
         async transform(data) {
             if (validatingFace)
                 return { ok: true, data };

package/dist/constants/EnvVar.d.ts

@@ -1,5 +1,5 @@
 export declare const SITE_ID: string;
 export declare const PLATFORM_ID: string;
 export declare const PLATFORM_CODE: string;
-export declare const ENVIRONMENT: "production" | "development";
+export declare const ENVIRONMENT: "development" | "production";
 export declare const INTERNALS__REPORT_WEB_VITALS: boolean;

package/dist/icons/LinkBrokenIcon.d.ts

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

package/dist/icons/LinkBrokenIcon.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function LinkBrokenIcon(props) {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", ...props, children: _jsx("path", { d: "M8.5 15.5L15.5 8.49998M9 4V2M15 20V22M4 9H2M20 15H22M4.91421 4.91421L3.5 3.5M19.0858 19.0857L20.5 20.4999M12 17.6568L9.87871 19.7781C8.31662 21.3402 5.78396 21.3402 4.22186 19.7781C2.65976 18.216 2.65976 15.6833 4.22186 14.1212L6.34318 11.9999M17.6569 11.9999L19.7782 9.87859C21.3403 8.31649 21.3403 5.78383 19.7782 4.22174C18.2161 2.65964 15.6835 2.65964 14.1214 4.22174L12 6.34306", stroke: "#FEDF89", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
+}