@opexa/portal-components 0.0.1135 → 0.1.1

package/dist/lib/components/TransactionRecords/WithdrawalRecordsTable.js

@@ -1,124 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { TZDateMini, tz } from '@date-fns/tz';
-import { endOfDay, format, startOfDay } from 'date-fns';
-import { isString } from 'lodash-es';
-import { usePathname, useRouter, useSearchParams } from 'next/navigation';
-import { useReducer } from 'react';
-import { twMerge } from 'tailwind-merge';
-import { useInfiniteQueryHelper } from '../../client/hooks/useInfiniteQueryHelper.js';
-import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
-import { useWithdrawalRecordsQuery } from '../../client/hooks/useWithdrawalRecordsQuery.js';
-import { ChevronLeftIcon } from '../../icons/ChevronLeftIcon.js';
-import { ChevronRightIcon } from '../../icons/ChevronRightIcon.js';
-import { File02Icon } from '../../icons/File02Icon.js';
-import { SpinnerIcon } from '../../icons/SpinnerIcon.js';
-import { Badge } from '../../ui/Badge/index.js';
-import { IconButton } from '../../ui/IconButton/index.js';
-import { Table } from '../../ui/Table/index.js';
-import { capitalize } from '../../utils/capitalize.js';
-import { formatNumber } from '../../utils/formatNumber.js';
-import { Empty } from '../shared/Empty.js';
-import { TableFilters } from './TableFilters.js';
-import { useTransactionPropsContext } from './TransactionContext.js';
-export function WithdrawalRecordsTable(props) {
-    const router = useRouter();
-    const pathname = usePathname();
-    const searchParams = useSearchParams();
-    const { enabledWithdrawalTypes } = useTransactionPropsContext();
-    const [state, setState] = useReducer((prev, next) => ({
-        ...prev,
-        ...next,
-    }), {
-        type: enabledWithdrawalTypes?.length === 1 ? enabledWithdrawalTypes[0] : null,
-    });
-    const localeInfo = useLocaleInfo();
-    const { page, hasNextPage, hasPrevPage, next, prev, rows, totalPages, loading, firstPage, } = useInfiniteQueryHelper(useWithdrawalRecordsQuery, {
-        filter: {
-            ...(searchParams.has('id') && {
-                withdrawal: {
-                    equal: searchParams.get('id')?.toString(),
-                },
-            }),
-            ...(state.type && {
-                type: {
-                    in: state.type === 'MANUAL'
-                        ? [
-                            /* "MANUAL" and friends */
-                            'MANUAL',
-                            'MANUAL_BANK',
-                            'MANUAL_UPI',
-                        ]
-                        : [state.type],
-                },
-            }),
-            ...(state.status && {
-                status: {
-                    equal: state.status,
-                },
-            }),
-            ...(state.timestamp && {
-                dateTimeCreated: {
-                    ...(state.timestamp.start && {
-                        greaterThanOrEqual: new TZDateMini(startOfDay(state.timestamp.start), localeInfo.timezone).toISOString(),
-                    }),
-                    ...(state.timestamp.end && {
-                        lesserThanOrEqual: new TZDateMini(endOfDay(state.timestamp.end), localeInfo.timezone).toISOString(),
-                    }),
-                },
-            }),
-        },
-    });
-    const classNames = isString(props.className)
-        ? { scrollbarThumb: props.className }
-        : (props.className ?? {});
-    return (_jsxs(_Fragment, { children: [_jsx(TableFilters, { value: {
-                    timestamp: state.timestamp,
-                    withdrawalType: state.type,
-                    withdrawalStatus: state.status,
-                }, onChange: (value) => {
-                    setState({
-                        type: value.withdrawalType,
-                        status: value.withdrawalStatus,
-                        timestamp: value.timestamp,
-                    });
-                    firstPage();
-                    if (searchParams.has('id')) {
-                        const newSearchParams = new URLSearchParams(searchParams);
-                        newSearchParams.delete('id');
-                        router.push(`${pathname}?${newSearchParams.toString()}`);
-                    }
-                }, enabledFilters: {
-                    withdrawalType: true,
-                    withdrawalStatus: true,
-                } }), rows.length <= 0 && (_jsx(Empty, { icon: loading ? SpinnerIcon : File02Icon, title: loading ? 'Just a moment' : 'No data', message: loading
-                    ? 'Fetching latest withdrawal records...'
-                    : 'No data is currently available.', className: "mt-5xl" })), rows.length >= 1 && (_jsxs("div", { className: twMerge('mt-xl', 'border-y', 'border-border-secondary', 'bleed', 'lg:not-bleed', 'lg:mt-3xl', 'lg:w-full', 'lg:rounded-xl', 'lg:border-x'), children: [_jsx("div", { className: twMerge('scrollbar:h-2 overflow-hidden overflow-x-auto rounded-none scrollbar-thumb:rounded-full border-border-secondary border-b scrollbar-track:bg-transparent lg:rounded-t-xl', classNames.scrollbarThumb || 'scrollbar-thumb:bg-bg-quaternary'), children: _jsxs(Table.Root, { className: "border-0", children: [_jsx(Table.Header, { children: _jsxs(Table.Row, { children: [_jsx(Table.Heading, { children: "Withdrawal No." }), _jsx(Table.Heading, { children: "Reference Number" }), _jsx(Table.Heading, { children: "Account Name" }), _jsx(Table.Heading, { children: "Withdrawal Method" }), _jsx(Table.Heading, { children: "Mobile Number" }), _jsx(Table.Heading, { children: "Withdrawal Amount" }), _jsx(Table.Heading, { children: "Net Amount" }), _jsx(Table.Heading, { children: "Transaction Fee" }), _jsx(Table.Heading, { children: "Bank Name" }), _jsx(Table.Heading, { children: "Withdrawal Time" }), _jsx(Table.Heading, { children: "Status" })] }) }), _jsx(Table.Body, { children: rows.map((data) => (_jsxs(Table.Row, { children: [_jsx(Table.Cell, { className: "!py-1", children: data.withdrawalNumber || data.serialCode }), _jsx(Table.Cell, { className: "!py-1", children: data.reference }), _jsx(Table.Cell, { className: "!py-1", children: data.type === 'INSTAPAY' ||
-                                                    data.type === 'PISO_PAY_REMITTANCE' ||
-                                                    data.type === 'VENTAJA_DISBURSEMENT'
-                                                    ? data.accountName
-                                                    : '' }), _jsx(Table.Cell, { className: "!py-1 text-right", children: capitalize(data.type, {
-                                                    delimiter: capitalize.delimiters.UNDERSCORE,
-                                                }).replace(/ventaja\s/gi, '') }), _jsx(Table.Cell, { className: "!py-1", children: data.recipientMobileNumber }), _jsx(Table.Cell, { className: "!py-1 text-right", children: formatNumber(data.amount, {
-                                                    currency: localeInfo.currency.code,
-                                                    minDecimalPlaces: 2,
-                                                }) }), _jsx(Table.Cell, { className: "!py-1 text-right", children: formatNumber(data.netAmount, {
-                                                    currency: localeInfo.currency.code,
-                                                    minDecimalPlaces: 2,
-                                                }) }), _jsx(Table.Cell, { className: "!py-1 text-right", children: formatNumber(data.fee, {
-                                                    currency: localeInfo.currency.code,
-                                                    minDecimalPlaces: 2,
-                                                }) }), _jsx(Table.Cell, { className: "!py-1", children: data?.bankName }), _jsxs(Table.Cell, { className: "!py-1", children: [_jsx("div", { className: "leading-tight", children: format(data.dateTimeCreated, 'MM/dd/yyyy', {
-                                                            in: tz(localeInfo.timezone),
-                                                        }) }), _jsx("div", { className: "text-text-tertiary-600 leading-tight", children: format(data.dateTimeCreated, 'hh:mm a', {
-                                                            in: tz(localeInfo.timezone),
-                                                        }) })] }), _jsx(Table.Cell, { className: "!py-1", children: _jsx(Badge.Root, { variant: "subtle", colorScheme: data.status === 'FAILED' ||
-                                                        data.status === 'REJECTED' ||
-                                                        data.status === 'CANCELLED'
-                                                        ? 'danger'
-                                                        : data.status === 'PENDING'
-                                                            ? 'warning'
-                                                            : 'success', children: _jsx(Badge.Label, { children: capitalize(data.status, {
-                                                            delimiter: capitalize.delimiters.UNDERSCORE,
-                                                        }) }) }) })] }, data.id))) })] }) }), _jsxs("div", { className: "flex items-center justify-between gap-lg px-4 py-3", children: [_jsx(IconButton, { size: "xs", variant: "outline", colorScheme: "gray", disabled: !hasPrevPage || loading, onClick: () => prev(), children: _jsx(ChevronLeftIcon, { className: "size-5" }) }), _jsxs("p", { className: "font-medium text-sm text-text-secondary-700", children: ["Page ", page, " of ", totalPages] }), _jsx(IconButton, { size: "xs", variant: "outline", colorScheme: "gray", disabled: !hasNextPage || loading, onClick: () => next(), children: _jsx(ChevronRightIcon, { className: "size-5" }) })] })] }))] }));
-}

package/dist/lib/components/TransactionRecords/index.d.ts

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

package/dist/lib/components/TransactionRecords/index.js

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

package/dist/lib/components/UpdateMobileNumber/UpdateMobileNumber.d.ts

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

package/dist/lib/components/UpdateMobileNumber/UpdateMobileNumber.js

@@ -1,154 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { zodResolver } from '@hookform/resolvers/zod';
-import Image from 'next/image';
-import { useEffect, useRef, useState } from 'react';
-import { Controller, useForm } from 'react-hook-form';
-import z from 'zod';
-import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
-import { useCooldown } from '../../client/hooks/useCooldown.js';
-import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
-import { useMobileNumberParser } from '../../client/hooks/useMobileNumberParser.js';
-import { useSendVerificationCodeMutation } from '../../client/hooks/useSendVerificationCodeMutation.js';
-import { useUpdateMobileNumber } from '../../client/hooks/useUpdateMobileNumber.js';
-import { toaster } from '../../client/utils/toaster.js';
-import { ArrowLeftIcon } from '../../icons/ArrowLeftIcon.js';
-import inplayLogo from '../../images/inplay-logo.png';
-import lightBg from '../../images/light-bg.png';
-import { Button } from '../../ui/Button/index.js';
-import { Dialog } from '../../ui/Dialog/index.js';
-import { Field } from '../../ui/Field/index.js';
-import { PinInput } from '../../ui/PinInput/index.js';
-import { Portal } from '../../ui/Portal/index.js';
-export function UpdateMobileNumber() {
-    const accountQuery = useAccountQuery();
-    const account = accountQuery.data;
-    const isAccountLoading = accountQuery.isLoading;
-    const hasMobileNumber = !!account?.mobileNumber;
-    const [isDialogOpen, setIsDialogOpen] = useState(false);
-    console.log('isDialogOpen', isDialogOpen);
-    // biome-ignore lint/correctness/useExhaustiveDependencies: We only want to open the dialog when the account data loads, not on every hasMobileNumber change
-    useEffect(() => {
-        if (!isAccountLoading && !!account && !hasMobileNumber) {
-            setIsDialogOpen(true);
-        }
-        else if (!isAccountLoading && !!account && hasMobileNumber) {
-            setIsDialogOpen(false);
-        }
-    }, [isAccountLoading, account?.mobileNumber]);
-    const [step, setStep] = useState(1);
-    const sendVerificationCodeMutation = useSendVerificationCodeMutation({
-        onSuccess: () => {
-            setStep(2);
-            cooldown.start();
-        },
-        onError: (err) => {
-            toaster.error({
-                title: 'Sign In Failed',
-                description: err.message,
-            });
-        },
-    });
-    const updateMobileNumberMutation = useUpdateMobileNumber({
-        onSuccess: async () => {
-            step1Form.reset();
-            step2Form.reset();
-            setStep(1);
-            toaster.success({
-                title: 'Verification Successful',
-                description: 'Your mobile number has been verified.',
-            });
-            setIsDialogOpen(false);
-            console.log('close dialog');
-        },
-        onError: (err) => {
-            console.log('err', err);
-            console.log('error updating mobile number');
-            const errorMessage = err.message === 'Internal Server Error'
-                ? `mobile number ${mobileNumberParser.format(step1Form.getValues('mobileNumber'))} is not available`
-                : err.message;
-            toaster.error({
-                title: 'Sign In Failed',
-                description: errorMessage,
-            });
-        },
-    });
-    const localeInfo = useLocaleInfo();
-    const mobileNumberParser = useMobileNumberParser();
-    const Step1Definition = z.object({
-        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',
-                });
-            }
-        }),
-    });
-    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-digit verification code.',
-                });
-            }
-        }),
-    });
-    const step1Form = useForm({
-        resolver: zodResolver(Step1Definition),
-        defaultValues: {
-            mobileNumber: '',
-        },
-    });
-    const step2Form = useForm({
-        resolver: zodResolver(Step2Definition),
-        defaultValues: {
-            verificationCode: Array.from({ length: 6 }).fill(''),
-        },
-    });
-    const cooldown = useCooldown({
-        max: 60,
-        duration: 1000 * 60,
-    });
-    const formRef = useRef(null);
-    return (_jsx(Dialog.Root, { open: isDialogOpen, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { className: "flex items-center", children: _jsxs(Dialog.Content, { className: "flex w-[375px] flex-col items-center space-y-4 rounded-xl bg-[#111827] p-6 text-center", style: {
-                            backgroundImage: `url(${lightBg.src})`,
-                        }, children: [_jsx(Image, { src: inplayLogo, alt: "inplay logo", width: 82, height: 34, className: "h-auto w-[82px]" }), _jsxs("div", { children: [step === 1 && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "font-bold text-sm", children: ["Get ", _jsx("span", { className: "text-[#F05127]", children: "\u20B150 Bonus" }), " when you verify your account and play."] }), _jsxs("form", { className: "mt-3xl", onSubmit: step1Form.handleSubmit(async (data) => {
-                                                    sendVerificationCodeMutation.mutateAsync({
-                                                        channel: 'SMS',
-                                                        recipient: mobileNumberParser.format(data.mobileNumber),
-                                                    });
-                                                }), children: [_jsxs(Field.Root, { invalid: !!step1Form.formState.errors.mobileNumber, className: "text-left", children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsx("div", { className: "-translate-y-1/2 absolute top-1/2 left-3.5 flex shrink-0 items-center gap-md", children: _jsx("span", { className: "text-text-placeholder", children: localeInfo.mobileNumber.areaCode }) }), _jsx(Field.Input, { style: {
-                                                                            paddingLeft: `calc(1.25rem + ${localeInfo.mobileNumber.areaCode.length}ch)`,
-                                                                        }, ...step1Form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.mobileNumber?.message })] }), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: step1Form.formState.isSubmitting, children: "Send Code" })] })] })), step === 2 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "mt-xl text-center font-semibold text-lg", children: "Check your Phone" }), _jsxs("p", { className: "mt-xs text-center text-sm text-text-secondary-700", children: ["We\u2019ve sent a verification code to your mobile number", ' ', _jsx("span", { className: "font-semibold text-[#F05127]", children: mobileNumberParser.format(step1Form.getValues('mobileNumber')) }), ' ', "via text"] }), _jsxs("form", { ref: formRef, className: "mt-5", onSubmit: step2Form.handleSubmit(async ({ verificationCode }) => {
-                                                    updateMobileNumberMutation.mutateAsync({
-                                                        mobileNumber: mobileNumberParser.format(step1Form.getValues('mobileNumber')),
-                                                        verificationCode: verificationCode.join(''),
-                                                    });
-                                                }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", onKeyDown: (e) => {
-                                                                        if (e.key === 'Backspace') {
-                                                                            step2Form.reset();
-                                                                        }
-                                                                    }, value: o.field.value, onValueChange: (details) => {
-                                                                        o.field.onChange(details.value);
-                                                                        o.field.onBlur();
-                                                                    }, otp: true, onValueComplete: () => {
-                                                                        formRef.current?.requestSubmit();
-                                                                    }, blurOnComplete: true, readOnly: step2Form.formState.isSubmitting, type: "numeric", 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: "font-medium text-2xl text-text-placeholder-subtle", 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.fieldState.error?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: step2Form.formState.isSubmitting, children: "Verify" }), _jsxs("div", { className: "mt-4 flex w-full items-center justify-center gap-xs text-xs", children: [_jsx("span", { className: "text-[#9CA3AF]", children: "Didn't receive the code?" }), _jsx("button", { type: "button", className: "font-semibold text-[#C084FC]", 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' })] }), _jsx("button", { type: "button", className: "absolute top-0 left-6 mx-auto mt-3xl flex h-8 w-8 items-center gap-1 rounded-full bg-[#1f2638] font-semibold text-sm text-text-tertiary-600", onClick: () => {
-                                                            setStep(1);
-                                                            step2Form.reset();
-                                                            cooldown.stop();
-                                                        }, children: _jsx(ArrowLeftIcon, { className: "mx-auto size-5" }) })] })] }))] })] }) })] }) }));
-}

package/dist/lib/components/UpdateMobileNumber/index.d.ts

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

package/dist/lib/components/UpdateMobileNumber/index.js

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

package/dist/lib/components/UpdateMobilePhoneNumber/UpdateMobilePhoneNumber.d.ts

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

package/dist/lib/components/UpdateMobilePhoneNumber/UpdateMobilePhoneNumber.js

@@ -1,152 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { zodResolver } from '@hookform/resolvers/zod';
-import Image from 'next/image';
-import { useEffect, useRef, useState } from 'react';
-import { Controller, useForm } from 'react-hook-form';
-import z from 'zod';
-import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
-import { useCooldown } from '../../client/hooks/useCooldown.js';
-import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
-import { useMobileNumberParser } from '../../client/hooks/useMobileNumberParser.js';
-import { useSendVerificationCodeMutation } from '../../client/hooks/useSendVerificationCodeMutation.js';
-import { useUpdateMobileNumber } from '../../client/hooks/useUpdateMobileNumber.js';
-import { toaster } from '../../client/utils/toaster.js';
-import { ArrowLeftIcon } from '../../icons/ArrowLeftIcon.js';
-import inplayLogo from '../../images/inplay-logo.png';
-import lightBg from '../../images/light-bg.png';
-import { Button } from '../../ui/Button/index.js';
-import { Dialog } from '../../ui/Dialog/index.js';
-import { Field } from '../../ui/Field/index.js';
-import { PinInput } from '../../ui/PinInput/index.js';
-import { Portal } from '../../ui/Portal/index.js';
-export function UpdateMobilePhoneNumber() {
-    const accountQuery = useAccountQuery();
-    const account = accountQuery.data;
-    const isAccountLoading = accountQuery.isLoading;
-    const hasMobileNumber = !!account?.mobileNumber;
-    const [isDialogOpen, setIsDialogOpen] = useState(false);
-    // biome-ignore lint/correctness/useExhaustiveDependencies: We only want to open the dialog when the account data loads, not on every hasMobileNumber change
-    useEffect(() => {
-        if (!isAccountLoading && !!account && !hasMobileNumber) {
-            setIsDialogOpen(true);
-        }
-        else if (!isAccountLoading && !!account && hasMobileNumber) {
-            setIsDialogOpen(false);
-        }
-    }, [isAccountLoading, account?.mobileNumber]);
-    const [step, setStep] = useState(1);
-    const sendVerificationCodeMutation = useSendVerificationCodeMutation({
-        onSuccess: () => {
-            setStep(2);
-            cooldown.start();
-        },
-        onError: (err) => {
-            toaster.error({
-                title: 'Sign In Failed',
-                description: err.message,
-            });
-        },
-    });
-    const updateMobileNumberMutation = useUpdateMobileNumber({
-        onSuccess: async () => {
-            step1Form.reset();
-            step2Form.reset();
-            setStep(1);
-            toaster.success({
-                title: 'Verification Successful',
-                description: 'Your mobile number has been verified.',
-            });
-            setIsDialogOpen(false);
-            console.log('mobile number updated successfully');
-        },
-        onError: (err) => {
-            const errorMessage = err.message === 'Internal Server Error'
-                ? `mobile number ${mobileNumberParser.format(step1Form.getValues('mobileNumber'))} is not available`
-                : err.message;
-            toaster.error({
-                title: 'Sign In Failed',
-                description: errorMessage,
-            });
-            console.log('error updating mobile number');
-        },
-    });
-    const localeInfo = useLocaleInfo();
-    const mobileNumberParser = useMobileNumberParser();
-    const Step1Definition = z.object({
-        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',
-                });
-            }
-        }),
-    });
-    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-digit verification code.',
-                });
-            }
-        }),
-    });
-    const step1Form = useForm({
-        resolver: zodResolver(Step1Definition),
-        defaultValues: {
-            mobileNumber: '',
-        },
-    });
-    const step2Form = useForm({
-        resolver: zodResolver(Step2Definition),
-        defaultValues: {
-            verificationCode: Array.from({ length: 6 }).fill(''),
-        },
-    });
-    const cooldown = useCooldown({
-        max: 60,
-        duration: 1000 * 60,
-    });
-    const formRef = useRef(null);
-    return (_jsx(Dialog.Root, { open: isDialogOpen, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { className: "flex items-center", children: _jsxs(Dialog.Content, { className: "flex w-[375px] flex-col items-center space-y-4 rounded-xl bg-[#111827] p-6 text-center", style: {
-                            backgroundImage: `url(${lightBg.src})`,
-                        }, children: [_jsx(Image, { src: inplayLogo, alt: "inplay logo", width: 82, height: 34, className: "h-auto w-[82px]" }), _jsxs("div", { children: [step === 1 && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "font-bold text-sm", children: ["Get ", _jsx("span", { className: "text-[#F05127]", children: "\u20B150 Bonus" }), " when you verify your account and play."] }), _jsxs("form", { className: "mt-3xl", onSubmit: step1Form.handleSubmit(async (data) => {
-                                                    sendVerificationCodeMutation.mutateAsync({
-                                                        channel: 'SMS',
-                                                        recipient: mobileNumberParser.format(data.mobileNumber),
-                                                    });
-                                                }), children: [_jsxs(Field.Root, { invalid: !!step1Form.formState.errors.mobileNumber, className: "text-left", children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsx("div", { className: "-translate-y-1/2 absolute top-1/2 left-3.5 flex shrink-0 items-center gap-md", children: _jsx("span", { className: "text-text-placeholder", children: localeInfo.mobileNumber.areaCode }) }), _jsx(Field.Input, { style: {
-                                                                            paddingLeft: `calc(1.25rem + ${localeInfo.mobileNumber.areaCode.length}ch)`,
-                                                                        }, ...step1Form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.mobileNumber?.message })] }), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: step1Form.formState.isSubmitting, children: "Send Code" })] })] })), step === 2 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "mt-xl text-center font-semibold text-lg", children: "Check your Phone" }), _jsxs("p", { className: "mt-xs text-center text-sm text-text-secondary-700", children: ["We\u2019ve sent a verification code to your mobile number", ' ', _jsx("span", { className: "font-semibold text-[#F05127]", children: mobileNumberParser.format(step1Form.getValues('mobileNumber')) }), ' ', "via text"] }), _jsxs("form", { ref: formRef, className: "mt-5", onSubmit: step2Form.handleSubmit(async ({ verificationCode }) => {
-                                                    updateMobileNumberMutation.mutateAsync({
-                                                        mobileNumber: mobileNumberParser.format(step1Form.getValues('mobileNumber')),
-                                                        verificationCode: verificationCode.join(''),
-                                                    });
-                                                }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", onKeyDown: (e) => {
-                                                                        if (e.key === 'Backspace') {
-                                                                            step2Form.reset();
-                                                                        }
-                                                                    }, value: o.field.value, onValueChange: (details) => {
-                                                                        o.field.onChange(details.value);
-                                                                        o.field.onBlur();
-                                                                    }, otp: true, onValueComplete: () => {
-                                                                        formRef.current?.requestSubmit();
-                                                                    }, blurOnComplete: true, readOnly: step2Form.formState.isSubmitting, type: "numeric", 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: "font-medium text-2xl text-text-placeholder-subtle", 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.fieldState.error?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: step2Form.formState.isSubmitting, children: "Verify" }), _jsxs("div", { className: "mt-4 flex w-full items-center justify-center gap-xs text-xs", children: [_jsx("span", { className: "text-[#9CA3AF]", children: "Didn't receive the code?" }), _jsx("button", { type: "button", className: "font-semibold text-[#C084FC]", 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' })] }), _jsx("button", { type: "button", className: "absolute top-0 left-6 mx-auto mt-3xl flex h-8 w-8 items-center gap-1 rounded-full bg-[#1f2638] font-semibold text-sm text-text-tertiary-600", onClick: () => {
-                                                            setStep(1);
-                                                            step2Form.reset();
-                                                            cooldown.stop();
-                                                        }, children: _jsx(ArrowLeftIcon, { className: "mx-auto size-5" }) })] })] }))] })] }) })] }) }));
-}

package/dist/lib/components/UpdateMobilePhoneNumber/index.d.ts

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

package/dist/lib/components/UpdateMobilePhoneNumber/index.js

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

package/dist/lib/components/shared/Empty.d.ts

@@ -1,9 +0,0 @@
-import type { ComponentProps, ComponentType } from 'react';
-export interface EmptyProps {
-    icon: ComponentType<ComponentProps<'svg'>>;
-    title: string;
-    message: string;
-    style?: React.CSSProperties;
-    className?: string;
-}
-export declare function Empty(props: EmptyProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/shared/Empty.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function Empty(props) {
-    return (_jsxs("div", { role: "alert", "aria-live": "polite", style: props.style, className: props.className, children: [_jsxs("div", { className: "relative mx-auto w-[9.5rem] pt-4", children: [_jsx("div", { className: "-translate-x-1/2 absolute top-safe-area-inset-top left-1/2 size-[6.5rem] rounded-full bg-utility-gray-200" }), _jsx(CloudIcon, { className: "relative h-auto w-full shrink-0" }), _jsx("div", { className: "-translate-x-1/2 absolute bottom-2 left-1/2 flex size-12 items-center justify-center rounded-full bg-utility-gray-200/40 backdrop-blur-sm", children: _jsx(props.icon, { className: "size-6 text-white" }) }), _jsx("div", { className: "absolute top-3.5 left-4 size-2.5 rounded-full bg-utility-gray-100" }), _jsx("div", { className: "absolute bottom-safe-area-inset-bottom.5 left-3 size-3.5 rounded-full bg-utility-gray-100" }), _jsx("div", { className: "absolute top-1 right-3.5 size-2 rounded-full bg-utility-gray-100" }), _jsx("div", { className: "absolute top-6.5 right-0 size-3.5 rounded-full bg-utility-gray-100" })] }), _jsx("h2", { className: "mt-xl text-center font-semibold", children: props.title }), _jsx("p", { className: "mx-auto mt-xs max-w-[25rem] text-center text-sm text-text-tertiary-600", children: props.message })] }));
-}
-function CloudIcon(props) {
-    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 152 104", fill: "none", ...props, children: [_jsxs("g", { filter: "url(#filter0_dd_2719_19242)", children: [_jsx("path", { d: "M77.6 0C66.8273 0 57.2978 5.32329 51.4987 13.4829C49.605 13.0363 47.6301 12.8 45.6 12.8C31.4615 12.8 20 24.2615 20 38.4C20 52.5385 31.4615 64 45.6 64L109.6 64C121.971 64 132 53.9712 132 41.6C132 29.2288 121.971 19.2 109.6 19.2C108.721 19.2 107.854 19.2506 107.002 19.349C102.098 7.9677 90.7797 0 77.6 0Z", fill: "#F9FAFB" }), _jsx("ellipse", { cx: "45.6", cy: "38.4008", rx: "25.6", ry: "25.6", fill: "url(#paint0_linear_2719_19242)" }), _jsx("circle", { cx: "77.6", cy: "32", r: "32", fill: "url(#paint1_linear_2719_19242)" }), _jsx("ellipse", { cx: "109.6", cy: "41.5992", rx: "22.4", ry: "22.4", fill: "url(#paint2_linear_2719_19242)" })] }), _jsxs("defs", { children: [_jsxs("filter", { id: "filter0_dd_2719_19242", x: "0", y: "0", width: "152", height: "104", filterUnits: "userSpaceOnUse", colorInterpolationFilters: "sRGB", children: [_jsx("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }), _jsx("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), _jsx("feMorphology", { radius: "4", operator: "erode", in: "SourceAlpha", result: "effect1_dropShadow_2719_19242" }), _jsx("feOffset", { dy: "8" }), _jsx("feGaussianBlur", { stdDeviation: "4" }), _jsx("feComposite", { in2: "hardAlpha", operator: "out" }), _jsx("feColorMatrix", { type: "matrix", values: "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0" }), _jsx("feBlend", { mode: "normal", in2: "BackgroundImageFix", result: "effect1_dropShadow_2719_19242" }), _jsx("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), _jsx("feMorphology", { radius: "4", operator: "erode", in: "SourceAlpha", result: "effect2_dropShadow_2719_19242" }), _jsx("feOffset", { dy: "20" }), _jsx("feGaussianBlur", { stdDeviation: "12" }), _jsx("feComposite", { in2: "hardAlpha", operator: "out" }), _jsx("feColorMatrix", { type: "matrix", values: "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0" }), _jsx("feBlend", { mode: "normal", in2: "effect1_dropShadow_2719_19242", result: "effect2_dropShadow_2719_19242" }), _jsx("feBlend", { mode: "normal", in: "SourceGraphic", in2: "effect2_dropShadow_2719_19242", result: "shape" })] }), _jsxs("linearGradient", { id: "paint0_linear_2719_19242", x1: "25.9429", y1: "21.4865", x2: "71.2", y2: "64.0007", gradientUnits: "userSpaceOnUse", children: [_jsx("stop", { stopColor: "#D0D5DD" }), _jsx("stop", { offset: "0.350715", stopColor: "white", stopOpacity: "0" })] }), _jsxs("linearGradient", { id: "paint1_linear_2719_19242", x1: "53.0286", y1: "10.8571", x2: "109.6", y2: "64", gradientUnits: "userSpaceOnUse", children: [_jsx("stop", { stopColor: "#D0D5DD" }), _jsx("stop", { offset: "0.350715", stopColor: "white", stopOpacity: "0" })] }), _jsxs("linearGradient", { id: "paint2_linear_2719_19242", x1: "92.4", y1: "26.7992", x2: "132", y2: "63.9992", gradientUnits: "userSpaceOnUse", children: [_jsx("stop", { stopColor: "#D0D5DD" }), _jsx("stop", { offset: "0.350715", stopColor: "white", stopOpacity: "0" })] })] })] }));
-}

package/dist/lib/components/shared/IdFrontImageField/IdFrontImageField.client.d.ts

@@ -1,15 +0,0 @@
-import { type CSSProperties, type RefObject } from 'react';
-import { type ValidateFileError } from '../../../utils/validateFile';
-import { type UseIdFrontImageFieldProps } from './useIdFrontImageField';
-export interface IdFrontImageFieldProps extends UseIdFrontImageFieldProps {
-    ref?: RefObject<HTMLDivElement | null>;
-    id?: string;
-    style?: CSSProperties;
-    className?: string;
-    invalid?: boolean;
-    readOnly?: boolean;
-    disabled?: boolean;
-    required?: boolean;
-    onError?: (error: ValidateFileError) => void;
-}
-export declare function IdFrontImageField__client(props: IdFrontImageFieldProps): import("react/jsx-runtime").JSX.Element;