@opexa/portal-components 0.0.260 → 0.0.262

package/dist/components/SignUp/SignUpPagcor/SignUpFormPagcor.js

@@ -1,429 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { createListCollection, parseDate } from '@ark-ui/react';
-import { useDialogContext } from '@ark-ui/react/dialog';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { ObjectId } from '@opexa/object-id';
-import { differenceInYears, format } from 'date-fns';
-import Image from 'next/image';
-import Link from 'next/link';
-import { useSearchParams } from 'next/navigation';
-import { useEffect, useRef, useState } from 'react';
-import { Controller, useForm } from 'react-hook-form';
-import { z } from 'zod';
-import { useShallow } from 'zustand/shallow';
-import { useControllableState } from '../../../client/hooks/useControllableState.js';
-import { useCooldown } from '../../../client/hooks/useCooldown.js';
-import { useCreateMemberVerificationMutation } from '../../../client/hooks/useCreateMemberVerificationMutation.js';
-import { useGlobalStore } from '../../../client/hooks/useGlobalStore.js';
-import { useLocaleInfo } from '../../../client/hooks/useLocaleInfo.js';
-import { useMemberVerificationQuery } from '../../../client/hooks/useMemberVerificationQuery.js';
-import { useMobileNumberParser } from '../../../client/hooks/useMobileNumberParser.js';
-import { useSendVerificationCodeMutation } from '../../../client/hooks/useSendVerificationCodeMutation.js';
-import { useSignInMutation } from '../../../client/hooks/useSignInMutation.js';
-import { useSignUpMutation } from '../../../client/hooks/useSignUpMutation.js';
-import { useUpdateAccountMutation } from '../../../client/hooks/useUpdateAccountMutation.js';
-import { useUpdateMemberVerificationMutation } from '../../../client/hooks/useUpdateMemberVerificationMutation.js';
-import { useUploadImageFileMutation } from '../../../client/hooks/useUploadImageFileMutation.js';
-import { toaster } from '../../../client/utils/toaster.js';
-import { BRANCHES } from '../../../constants/index.js';
-import { ArrowLeftIcon } from '../../../icons/ArrowLeftIcon.js';
-import { CalendarIcon } from '../../../icons/CalendarIcon.js';
-import { CheckIcon } from '../../../icons/CheckIcon.js';
-import { ChevronDownIcon } from '../../../icons/ChevronDownIcon.js';
-import { ChevronLeftIcon } from '../../../icons/ChevronLeftIcon.js';
-import { ChevronRightIcon } from '../../../icons/ChevronRightIcon.js';
-import pagcorLogo from '../../../images/pagcor.png';
-import responsibleGamingLogo from '../../../images/responsible-gaming.png';
-import { ObjectType } from '../../../services/ObjectType.js';
-import { Button } from '../../../ui/Button/index.js';
-import { Checkbox } from '../../../ui/Checkbox/index.js';
-import { DatePicker } from '../../../ui/DatePicker/index.js';
-import { Field } from '../../../ui/Field/index.js';
-import { PinInput } from '../../../ui/PinInput/index.js';
-import { Select } from '../../../ui/Select/index.js';
-import { createPoll } from '../../../utils/createPoll.js';
-import { getQueryClient } from '../../../utils/getQueryClient.js';
-import { getMemberVerificationQueryKey } from '../../../utils/queryKeys.js';
-import ImageUploader from './ImageUploader.js';
-import { useSignUpPagcorPropsContext } from './SignUpPagcorContext.js';
-export function SignUpFormPagcor() {
-    const props = useSignUpPagcorPropsContext();
-    const branchCollection = createListCollection({
-        items: props.branches ?? BRANCHES,
-        itemToValue: (item) => item.code,
-        itemToString: (item) => `${item.code} - ${item.name}`,
-    });
-    const [step, setStep] = useState(1);
-    const dialog = useDialogContext();
-    const search = useSearchParams();
-    const signInStore = useGlobalStore(useShallow((ctx) => ctx.signIn));
-    const signUpMutation = useSignUpMutation();
-    const signInMutation = useSignInMutation();
-    const updateAccountMutation = useUpdateAccountMutation();
-    const sendVerificationCodeMutation = useSendVerificationCodeMutation();
-    const localeInfo = useLocaleInfo();
-    const mobileNumberParser = useMobileNumberParser();
-    const fileSchema = z
-        .instanceof(File)
-        .refine((file) => file.size > 0, {
-        message: 'File is required.',
-    })
-        .refine((file) => file.type.startsWith('image/'), {
-        message: 'File must be an image.',
-    });
-    const Step1Definition = z.object({
-        name: z
-            .string()
-            .min(8, 'Username must be 8 or more characters')
-            .max(30, 'Username must not be more than 30 characters')
-            .trim(),
-        password: z
-            .string()
-            .min(8, 'Password must be 8 or more characters')
-            .max(30, 'Password must not be more than 30 characters')
-            .trim(),
-        mobileNumber: z
-            .string()
-            .min(1, 'Mobile number is required')
-            .superRefine((v, ctx) => {
-            if (!mobileNumberParser.validate(v)) {
-                ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'Invalid mobile number',
-                });
-            }
-        }),
-        firstName: z
-            .string()
-            .min(2, 'First name must be 2 or more characters')
-            .max(50, 'First name must not be more than 50 characters')
-            .trim(),
-        middleName: z
-            .string()
-            .min(2, 'First name must be 2 or more characters')
-            .max(50, 'First name must not be more than 50 characters')
-            .trim(),
-        lastName: z
-            .string()
-            .min(2, 'First name must be 2 or more characters')
-            .max(50, 'First name must not be more than 50 characters')
-            .trim(),
-        birthDay: z
-            .date({
-            invalid_type_error: 'Date of birth is required',
-            required_error: 'Date of birth is required',
-        })
-            .superRefine((val, ctx) => {
-            const now = new Date();
-            const age = differenceInYears(now, val);
-            if (age < 21) {
-                return ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'You must be at least 21 years old',
-                });
-            }
-        }),
-        branchCode: z.string().min(1, 'Branch is required').trim(),
-        selfieImage: fileSchema,
-        frontImage: fileSchema,
-        termsAccepted: z.boolean().superRefine((v, ctx) => {
-            if (!v) {
-                ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'You must accept the terms and conditions',
-                });
-            }
-        }),
-    });
-    const Step2Definition = z.object({
-        verificationCode: z.array(z.string()).superRefine((val, ctx) => {
-            if (val.length !== 6 || val.some((v) => v.length !== 1)) {
-                ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'Please Enter your 6 digits verification code',
-                });
-            }
-        }),
-    });
-    const step1Form = useForm({
-        mode: 'all',
-        resolver: zodResolver(Step1Definition),
-        defaultValues: {
-            name: '',
-            password: '',
-            mobileNumber: '',
-            firstName: '',
-            middleName: '',
-            lastName: '',
-            branchCode: props?.branches?.[0]?.code ?? BRANCHES[0].code,
-            termsAccepted: false,
-            frontImage: undefined,
-            selfieImage: undefined,
-        },
-    });
-    const step2Form = useForm({
-        resolver: zodResolver(Step2Definition),
-        defaultValues: {
-            verificationCode: Array.from({ length: 6 }).fill(''),
-        },
-    });
-    const cooldown = useCooldown({
-        max: 60,
-        duration: 1000 * 60,
-    });
-    const form2Ref = useRef(null);
-    const birthDay = step1Form.watch('birthDay');
-    const branchCode = step1Form.watch('branchCode', '');
-    useEffect(() => {
-        if (props.frontImage) {
-            step1Form.setValue('frontImage', props.frontImage);
-        }
-        if (props.selfieImage) {
-            step1Form.setValue('selfieImage', props.selfieImage);
-        }
-    }, [step1Form, props]);
-    const { mutateAsync: createMemberVerification } = useCreateMemberVerificationMutation({
-        onError: (error) => {
-            toaster.error({
-                title: 'Failed to upload ID Front Image & Selfie Image',
-                description: error.message,
-            });
-        },
-    });
-    const { mutateAsync: updateMemberVerification } = useUpdateMemberVerificationMutation({
-        onSuccess: () => {
-            const queryClient = getQueryClient();
-            queryClient.setQueryData(getMemberVerificationQueryKey(), (prev) => {
-                if (!prev)
-                    return prev;
-                return {
-                    ...prev,
-                    status: 'CREATED',
-                };
-            });
-        },
-        onError: (error) => {
-            toaster.error({
-                title: 'Failed to upload ID Front Image & Selfie Image',
-                description: error.message,
-            });
-        },
-    });
-    const memberVerification = useMemberVerificationQuery();
-    const memberId = memberVerification.data?.id;
-    const { mutate: uploadImageFile } = useUploadImageFileMutation();
-    return (_jsxs(_Fragment, { children: [step === 1 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "mt-xl text-center text-lg font-semibold", children: "Create an account" }), _jsx("p", { className: "text-text-secondary-700 mt-xs text-center text-sm", children: "Register instantly and start playing!" }), _jsxs("form", { className: "mt-3xl", autoComplete: "off", onSubmit: step1Form.handleSubmit(async (data) => {
-                            try {
-                                await sendVerificationCodeMutation.mutateAsync({
-                                    channel: 'SMS',
-                                    recipient: mobileNumberParser.format(data.mobileNumber),
-                                });
-                                setStep(2);
-                                cooldown.start();
-                            }
-                            catch (e) {
-                                toaster.error({
-                                    description: e instanceof Error
-                                        ? e.message
-                                        : 'Failed to send verification code',
-                                });
-                            }
-                        }), children: [_jsxs(Field.Root, { invalid: !!step1Form.formState.errors.name, className: "mt-xl", children: [_jsx(Field.Label, { children: "Account Username" }), _jsx(Field.Input, { placeholder: "Enter Username", ...step1Form.register('name') }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.name?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.password, className: "mt-xl", children: [_jsx(Field.Label, { children: "Password" }), _jsx(Field.Input, { type: "password", placeholder: "Enter a password", ...step1Form.register('password') }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.password?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.mobileNumber, className: "mt-xl", children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsxs("div", { className: "absolute left-3.5 top-1/2 flex shrink-0 -translate-y-1/2 items-center gap-md", children: [_jsx(localeInfo.country.flag, { className: "size-5" }), _jsx("span", { className: "text-text-placeholder", children: localeInfo.mobileNumber.areaCode })] }), _jsx(Field.Input, { style: {
-                                                    paddingLeft: `calc(2.75rem + ${localeInfo.mobileNumber.areaCode.length}ch)`,
-                                                }, ...step1Form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.mobileNumber?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.firstName, className: "mt-xl", children: [_jsx(Field.Label, { children: "First Name" }), _jsx(Field.Input, { placeholder: "Enter your First Name", ...step1Form.register('firstName') }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.firstName?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.middleName, className: "mt-xl", children: [_jsx(Field.Label, { children: "Middle Name" }), _jsx(Field.Input, { placeholder: "Enter your Middle Name", ...step1Form.register('middleName') }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.middleName?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.lastName, className: "mt-xl", children: [_jsx(Field.Label, { children: "Last Name" }), _jsx(Field.Input, { placeholder: "Enter your Last Name", ...step1Form.register('lastName') }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.lastName?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.birthDay, className: "mt-xl", children: [_jsx(DateOfBirthField, { value: birthDay, onChange: (value) => {
-                                            if (!value)
-                                                return;
-                                            step1Form.setValue('birthDay', value, {
-                                                shouldDirty: true,
-                                                shouldTouch: true,
-                                                shouldValidate: true,
-                                            });
-                                        }, onBlur: () => {
-                                            step1Form.trigger('birthDay');
-                                        } }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.birthDay?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.branchCode, className: "mt-xl", children: [_jsxs(Select.Root, { value: [branchCode], onValueChange: (details) => {
-                                            step1Form.setValue('branchCode', details.value.at(0) ??
-                                                props?.branches?.[0]?.code ??
-                                                BRANCHES[0].code, {
-                                                shouldDirty: true,
-                                                shouldTouch: true,
-                                                shouldValidate: true,
-                                            });
-                                        }, collection: branchCollection, positioning: {
-                                            sameWidth: true,
-                                            placement: 'bottom',
-                                        }, lazyMount: true, unmountOnExit: true, children: [_jsx(Select.Label, { className: "flex items-center gap-1", children: "Select Nearest Branch Around You" }), _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, children: _jsx("div", { title: label, className: "line-clamp-1", children: label }) }, item.code));
-                                                    }) }) })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.branchCode?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.frontImage, className: "mt-xl", children: [_jsx(Field.Label, { children: "Front of your ID" }), _jsx(ImageUploader, { value: props.frontImage || null, hasDescription: true, name: "idFrontImage", captureObject: "ID_DOCUMENT", onChange: (file) => {
-                                            step1Form.setValue('frontImage', file);
-                                            props.setFrontImage(file);
-                                        } }, "id-front-image-upload"), _jsx(Field.ErrorText, { children: step1Form.formState.errors.frontImage?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.selfieImage, className: "mt-xl", children: [_jsx(Field.Label, { children: "Selfie holding your ID" }), _jsx(ImageUploader, { value: props.selfieImage || null, name: "selfieImage", captureObject: "SELFIE", onChange: (file) => {
-                                            step1Form.setValue('selfieImage', file);
-                                            props.setSelfieImage(file);
-                                        } }, "selfie-image-upload"), _jsx(Field.ErrorText, { children: step1Form.formState.errors.selfieImage?.message })] }), _jsxs("div", { className: "mt-xl text-center text-sm", children: ["Prohibition to play in open and public places", _jsxs("div", { className: "mt-5 flex items-center justify-center gap-3xl", children: [_jsx("div", { className: "flex size-5xl items-center justify-center overflow-hidden rounded-full bg-white", children: _jsx(Image, { src: pagcorLogo, alt: "", draggable: false, className: "h-9.5 w-auto" }) }), _jsx(Image, { src: responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-10 w-auto", draggable: false })] })] }), _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) => {
-                                                o.field.onChange(details.checked);
-                                            }, children: [_jsx(Checkbox.Control, { children: _jsx(Checkbox.Indicator, { asChild: true, children: _jsx(CheckIcon, {}) }) }), _jsxs(Checkbox.Label, { children: ["I am at least 21 years of age and I accept the", ' ', _jsx(Link, { href: props.termsAndConditionsUrl ?? '/terms-and-conditions', onClick: () => {
-                                                                dialog.setOpen(false);
-                                                            }, className: "text-brand-400 whitespace-nowrap underline underline-offset-2", children: "Terms and Conditions." })] }), ' ', _jsx(Checkbox.HiddenInput, {})] }), _jsx(Field.ErrorText, { className: "ml-6 text-xs", children: o.fieldState.error?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: step1Form.formState.isSubmitting, children: "Create Account" })] }), _jsxs("div", { className: "mt-6 flex w-full items-center justify-center gap-xs text-sm", children: [_jsx("span", { className: "text-text-tertiary-600", children: "Already have an account?" }), _jsx("button", { type: "submit", className: "text-button-tertiary-fg font-semibold", onClick: () => {
-                                    dialog.setOpen(false);
-                                    signInStore.setOpen(true);
-                                }, children: "Log In" })] })] })), step === 2 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "mt-xl text-center text-lg font-semibold", children: "Check your Phone" }), _jsxs("p", { className: "text-text-secondary-700 mt-xs text-center text-sm", children: ["We\u2019ve sent a verification code to your mobile number", ' ', _jsx("span", { className: "font-semibold", children: mobileNumberParser.format(step1Form.getValues('mobileNumber')) }), ' ', "via text"] }), _jsxs("form", { ref: form2Ref, className: "mt-5", onSubmit: step2Form.handleSubmit(async ({ verificationCode }) => {
-                            const id = ObjectId.generate(ObjectType.MemberAccount).toString();
-                            const { mobileNumber } = step1Form.getValues();
-                            try {
-                                await signUpMutation.mutateAsync({
-                                    id,
-                                    mobileNumber: mobileNumberParser.format(mobileNumber),
-                                    verificationCode: verificationCode.join(''),
-                                    referralCode: search.get('referralCode') ?? undefined,
-                                    btag: search.get('btag') ?? undefined,
-                                });
-                                const name = mobileNumberParser.format(mobileNumber);
-                                const password = `${name}${id}`;
-                                const pollLogin = createPoll(async () => {
-                                    try {
-                                        await signInMutation.mutateAsync({
-                                            type: 'NAME_AND_PASSWORD',
-                                            name,
-                                            password,
-                                        });
-                                        return true;
-                                    }
-                                    catch {
-                                        return false;
-                                    }
-                                }, {
-                                    until: (ok) => ok,
-                                    maxAttempt: 3,
-                                });
-                                const ok = await pollLogin();
-                                if (!ok) {
-                                    signInStore.setOpen(true);
-                                }
-                                else {
-                                    const pollUpdateAccount = createPoll(async () => {
-                                        try {
-                                            await updateAccountMutation.mutateAsync({
-                                                name: step1Form.getValues('name'),
-                                                password: step1Form.getValues('password'),
-                                                branchCode: step1Form.getValues('branchCode'),
-                                                realName: [
-                                                    step1Form.getValues('firstName'),
-                                                    step1Form.getValues('middleName'),
-                                                    step1Form.getValues('lastName'),
-                                                ]
-                                                    .filter(Boolean)
-                                                    .join(' '),
-                                                birthDay: format(step1Form.getValues('birthDay'), 'yyyy-MM-dd'),
-                                            });
-                                            return true;
-                                        }
-                                        catch {
-                                            return false;
-                                        }
-                                    }, {
-                                        until: (ok) => ok,
-                                        maxAttempt: 3,
-                                    });
-                                    const pollImageUpload = createPoll(async () => {
-                                        const uploadImage = (file) => new Promise((resolve, reject) => {
-                                            if (!file) {
-                                                return reject(new Error('No file provided'));
-                                            }
-                                            uploadImageFile({ file }, {
-                                                onSuccess: (result) => resolve(result),
-                                                onError: (error) => reject(error || new Error('Upload failed')),
-                                            });
-                                        });
-                                        try {
-                                            const selfieFile = step1Form.getValues('selfieImage');
-                                            const frontFile = step1Form.getValues('frontImage');
-                                            if (!(selfieFile instanceof File) ||
-                                                !(frontFile instanceof File)) {
-                                                throw new Error('Invalid or missing image files');
-                                            }
-                                            const selfieImageId = await uploadImage(selfieFile);
-                                            const frontImageId = await uploadImage(frontFile);
-                                            const data = {
-                                                selfieImage: selfieImageId,
-                                                idFrontImage: frontImageId,
-                                            };
-                                            const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
-                                            await delay(2000);
-                                            if (!memberId) {
-                                                await createMemberVerification({
-                                                    ...data,
-                                                    address: '',
-                                                    nationality: '',
-                                                    natureOfWork: '',
-                                                    permanentAddress: '',
-                                                    placeOfBirth: '',
-                                                    sourceOfIncome: '',
-                                                });
-                                            }
-                                            else {
-                                                await updateMemberVerification({
-                                                    id: memberId,
-                                                    data,
-                                                });
-                                            }
-                                            return true;
-                                        }
-                                        catch (error) {
-                                            console.error('Image upload or verification failed:', error);
-                                            return false;
-                                        }
-                                    }, {
-                                        until: (ok) => ok,
-                                        maxAttempt: 1,
-                                    });
-                                    await pollUpdateAccount();
-                                    await pollImageUpload();
-                                }
-                                dialog.setOpen(false);
-                                step1Form.reset();
-                                step2Form.reset();
-                                setStep(1);
-                            }
-                            catch (error) {
-                                toaster.error({
-                                    description: error instanceof Error
-                                        ? error.message
-                                        : 'Invalid Verification Code',
-                                });
-                            }
-                        }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", value: o.field.value, onValueChange: (details) => {
-                                                o.field.onChange(details.value);
-                                            }, onValueComplete: () => {
-                                                form2Ref.current?.requestSubmit();
-                                            }, children: [_jsxs(PinInput.Control, { className: "grid-cols-[1fr_1fr_1fr_auto_1fr_1fr_1fr] items-center gap-md", children: [_jsx(PinInput.Input, { index: 0 }), _jsx(PinInput.Input, { index: 1 }), _jsx(PinInput.Input, { index: 2 }), _jsx("span", { className: "text-text-placeholder-subtle text-2xl font-medium", children: "\u2013" }), _jsx(PinInput.Input, { index: 3 }), _jsx(PinInput.Input, { index: 4 }), _jsx(PinInput.Input, { index: 5 })] }), _jsx(PinInput.HiddenInput, {})] }), _jsx(Field.ErrorText, { children: o.formState.errors.verificationCode?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: step2Form.formState.isSubmitting, children: "Verify" }), _jsxs("div", { className: "mt-3 flex w-full items-center justify-center gap-xs text-sm", children: [_jsx("span", { className: "text-text-secondary-700", children: "Didn't recieve the code?" }), _jsx("button", { type: "button", className: "text-button-secondary-fg font-semibold disabled:cursor-not-allowed disabled:opacity-75", disabled: cooldown.cooling, onClick: async () => {
-                                            await sendVerificationCodeMutation.mutateAsync({
-                                                channel: 'SMS',
-                                                recipient: mobileNumberParser.format(step1Form.getValues('mobileNumber')),
-                                            });
-                                            cooldown.start();
-                                        }, children: cooldown.cooling
-                                            ? `Resend in ${cooldown.countdown}s`
-                                            : 'Resend' })] }), _jsxs("button", { type: "button", className: "text-text-tertiary-600 mx-auto mt-3xl flex w-fit items-center gap-1 text-sm font-semibold", onClick: () => {
-                                    setStep(1);
-                                    step2Form.reset();
-                                    cooldown.stop();
-                                }, children: [_jsx(ArrowLeftIcon, { className: "size-5" }), "Back"] })] })] }))] }));
-}
-const DEVICE_TIMEZONE = Intl.DateTimeFormat().resolvedOptions().timeZone;
-function DateOfBirthField(props) {
-    const [value, setValue] = useControllableState({
-        value: props.value,
-        defaultValue: props.defaultValue ?? null,
-        onChange: props.onChange,
-    });
-    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
-                                                    .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 })
-                                                    .map((years, id) => (_jsx(DatePicker.TableRow, { children: years.map((year, id) => (_jsx(DatePicker.TableCell, { value: year.value, children: _jsx(DatePicker.TableCellTrigger, { className: "w-[4.425rem]", children: year.label }) }, id))) }, id))) }) })] })) }) })] }) })] }));
-}

package/dist/components/SignUp/SignUpPagcor/SignUpPagcor.lazy.d.ts

@@ -1,13 +0,0 @@
-import { type ImageProps } from 'next/image';
-import { type ReactNode } from 'react';
-import type { Branch } from '../../../types';
-export interface SignUpPagcorProps {
-    logo: ImageProps['src'];
-    children?: ReactNode;
-    /** @default "/terms-and-conditions" */
-    termsAndConditionsUrl?: string;
-    className?: string;
-    branches?: Branch[];
-    layout: 'pagcor';
-}
-export declare function SignUpPagcor(props: SignUpPagcorProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/SignUp/SignUpPagcor/SignUpPagcor.lazy.js

@@ -1,26 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Image, {} from 'next/image';
-import { Suspense } from 'react';
-import { twMerge } from 'tailwind-merge';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../../client/hooks/useGlobalStore.js';
-import { XIcon } from '../../../icons/XIcon.js';
-import { Dialog } from '../../../ui/Dialog/index.js';
-import { Portal } from '../../../ui/Portal/index.js';
-import { CaptureIdDocument } from './CaptureIdDocument.js';
-import { CaptureSelfie } from './CaptureSelfie.js';
-import { SignUpFormPagcor } from './SignUpFormPagcor.js';
-import { SignUpPagcorPropsProvider } from './SignUpPagcorContext.js';
-import { useImageUploader } from './useImageUploader.js';
-export function SignUpPagcor(props) {
-    const signUpStore = useGlobalStore(useShallow((ctx) => ctx.signUp));
-    const imageUploader = useImageUploader();
-    const value = {
-        ...props,
-        ...imageUploader,
-    };
-    return (_jsx(SignUpPagcorPropsProvider, { value: value, children: _jsx(Dialog.Root, { open: signUpStore.open, onOpenChange: (details) => {
-                signUpStore.setOpen(details.open);
-            }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-fit lg:rounded-xl', props.className), children: [_jsx(CaptureIdDocument, {}), _jsx(CaptureSelfie, {}), _jsxs("div", { className: "w-full lg:w-[400px]", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsx(Suspense, { children: _jsx(SignUpFormPagcor, {}) })] })] }) })] }) }) }));
-}

package/dist/components/SignUp/SignUpPagcor/SignUpPagcorContext.d.ts

@@ -1,7 +0,0 @@
-import type { SignUpPagcorProps } from './SignUpPagcor.lazy';
-import type { UseImageUploaderReturn } from './useImageUploader';
-export declare const SignUpPagcorPropsProvider: (props: {
-    value: SignUpPagcorProps & UseImageUploaderReturn;
-} & {
-    children?: import("react").ReactNode | undefined;
-}) => React.ReactNode, useSignUpPagcorPropsContext: () => SignUpPagcorProps & UseImageUploaderReturn;

package/dist/components/SignUp/SignUpPagcor/SignUpPagcorContext.js

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

package/dist/components/SignUp/SignUpPagcor/useImageUploader.d.ts

@@ -1,11 +0,0 @@
-export type CaptureSubject = 'SELFIE' | 'ID_DOCUMENT';
-export interface UseImageUploaderReturn {
-    capturing: CaptureSubject | null;
-    setCapturing: (capturing: CaptureSubject | null) => void;
-    frontImage: File | null;
-    setFrontImage: (id: File | null) => void;
-    selfieImage: File | null;
-    setSelfieImage: (id: File | null) => void;
-    reset: () => void;
-}
-export declare function useImageUploader(): UseImageUploaderReturn;

package/dist/components/SignUp/SignUpPagcor/useImageUploader.js

@@ -1,20 +0,0 @@
-import { useState } from 'react';
-export function useImageUploader() {
-    const [frontImage, setFrontImage] = useState(null);
-    const [selfieImage, setSelfieImage] = useState(null);
-    const [capturing, setCapturing] = useState(null);
-    const reset = () => {
-        setCapturing(null);
-        setFrontImage(null);
-        setFrontImage(null);
-    };
-    return {
-        capturing,
-        setCapturing,
-        frontImage,
-        setFrontImage,
-        selfieImage,
-        setSelfieImage,
-        reset,
-    };
-}

package/dist/constants/BranchCode.d.ts

@@ -1,4 +0,0 @@
-export declare const BRANCH_CODES: {
-    code: string;
-    name: string;
-}[];

package/dist/constants/BranchCode.js

@@ -1,42 +0,0 @@
-export const BRANCH_CODES = [
-    {
-        code: 'BRCAL',
-        name: 'Bingo Republic 2nd floor Primark Center Deparo St., Caloocan City',
-    },
-    {
-        code: 'BRNAG',
-        name: 'Bingo Republic 3rd floor Robinsons Mall, Naga City, Camarines Sur',
-    },
-    {
-        code: 'BRANT',
-        name: 'Bingo Republic 2nd floor Robinsons Mall, San Vicente,Antique',
-    },
-    {
-        code: 'BRCLA',
-        name: 'Clark',
-    },
-    {
-        code: 'BRLAG',
-        name: 'Laguna',
-    },
-    {
-        code: 'BREAS',
-        name: 'Eastwood City, Quezon City',
-    },
-    {
-        code: 'BRMAR',
-        name: 'Bingo ng Bayan 4th floor Marikina Public Market, Marikina City',
-    },
-    {
-        code: 'BRILO',
-        name: 'Iloilo',
-    },
-    {
-        code: 'BRFIM',
-        name: 'Fisher Mall,Quezon City',
-    },
-    {
-        code: 'BRCAC',
-        name: 'Villa Caceres Hotel, Naga City,Camsur',
-    },
-];

package/dist/icons/BellRingIcon.d.ts

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

package/dist/icons/BellRingIcon.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export function BellRingIcon(props) {
-    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 25 24", fill: "none", stroke: "currentColor", ...props, children: _jsx("path", { d: "M15.5002 19C15.5002 20.6569 14.1571 22 12.5002 22C10.8434 22 9.50025 20.6569 9.50025 19M14.2968 6.23856C14.7322 5.78864 15.0002 5.17562 15.0002 4.5C15.0002 3.11929 13.881 2 12.5002 2C11.1195 2 10.0002 3.11929 10.0002 4.5C10.0002 5.17562 10.2683 5.78864 10.7037 6.23856M3.04707 8.32296C3.03272 6.87161 3.8152 5.51631 5.07928 4.80306M21.9534 8.32296C21.9678 6.87161 21.1853 5.51631 19.9212 4.80306M18.5002 11.2C18.5002 9.82087 17.8681 8.49823 16.7429 7.52304C15.6177 6.54786 14.0915 6 12.5002 6C10.9089 6 9.38283 6.54786 8.25761 7.52304C7.13239 8.49823 6.50025 9.82087 6.50025 11.2C6.50025 13.4818 5.93438 15.1506 5.22831 16.3447C4.42359 17.7056 4.02122 18.3861 4.03711 18.5486C4.05529 18.7346 4.08876 18.7933 4.23959 18.9036C4.37142 19 5.03376 19 6.35844 19H18.6421C19.9667 19 20.6291 19 20.7609 18.9036C20.9117 18.7933 20.9452 18.7346 20.9634 18.5486C20.9793 18.3861 20.5769 17.7056 19.7722 16.3447C19.0661 15.1506 18.5002 13.4818 18.5002 11.2Z", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }));
-}

package/dist/utils/dataUrlToBlob.d.ts

@@ -1 +0,0 @@
-export declare function dataURLtoBlob(dataURL: string): Blob;

package/dist/utils/dataUrlToBlob.js

@@ -1,11 +0,0 @@
-export function dataURLtoBlob(dataURL) {
-    const parts = dataURL.split(';base64,');
-    const contentType = parts[0].split(':')[1];
-    const raw = window.atob(parts[1]);
-    const rawLength = raw.length;
-    const uInt8Array = new Uint8Array(rawLength);
-    for (let i = 0; i < rawLength; ++i) {
-        uInt8Array[i] = raw.charCodeAt(i);
-    }
-    return new Blob([uInt8Array], { type: contentType });
-}

package/dist/utils/resizeImageSize.d.ts

@@ -1,2 +0,0 @@
-export declare const resizeFile: (file: File) => Promise<unknown>;
-export declare const resizeFileBase64: (file: File) => Promise<string>;

package/dist/utils/resizeImageSize.js

@@ -1,11 +0,0 @@
-import Resizer from 'react-image-file-resizer';
-export const resizeFile = (file) => new Promise((resolve) => {
-    Resizer.imageFileResizer(file, 300, 300, 'jpeg', 100, 0, (uri) => {
-        resolve(uri);
-    }, 'file');
-});
-export const resizeFileBase64 = (file) => new Promise((resolve) => {
-    Resizer.imageFileResizer(file, 1200, 300, 'WEBP', 100, 0, (uri) => {
-        resolve(uri);
-    }, 'base64');
-});