@opexa/portal-components 0.0.64 → 0.0.65

package/dist/components/SignIn/NameAndPasswordSignIn.d.ts

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

package/dist/components/SignIn/NameAndPasswordSignIn.js

@@ -1,116 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useDialogContext } from '@ark-ui/react';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { Controller, useForm } from 'react-hook-form';
-import { z } from 'zod';
-import { useShallow } from 'zustand/shallow';
-import { useAuthenticateMutation, useGlobalStore, useSignInMutation, } from '../../client/hooks/index.js';
-import { toaster } from '../../client/utils/index.js';
-import { SECRET_QUESTIONS, SECRET_QUESTIONS_MAP } from '../../constants/index.js';
-import { CheckIcon, EyeIcon, EyeOffIcon, FacebookIcon, GoogleIcon, } from '../../icons/index.js';
-import { Button, Checkbox, Field, PasswordInput } from '../../ui/index.js';
-import { useSignInContext } from './SignInContext.js';
-export function NameAndPasswordSignIn() {
-    const context = useSignInContext();
-    const dialog = useDialogContext();
-    const globalStore = useGlobalStore(useShallow((popups) => ({
-        signIn: popups.signIn,
-        signUp: popups.signUp,
-    })));
-    const signInMutation = useSignInMutation({
-        onSuccess(authenticator) {
-            if (authenticator) {
-                context.setStep(2);
-            }
-            else {
-                globalStore.signIn.setOpen(false);
-                authenticateMutation.reset();
-                signInMutation.reset();
-                context.setStep(0);
-                form.reset();
-            }
-        },
-        onError() {
-            toaster.error({
-                description: 'Invalid username or password',
-            });
-        },
-    });
-    const authenticateMutation = useAuthenticateMutation({
-        onSuccess() {
-            globalStore.signIn.setOpen(false);
-            authenticateMutation.reset();
-            signInMutation.reset();
-            context.setStep(0);
-            form.reset();
-        },
-        onError() {
-            toaster.error({
-                description: 'Incorrect secret answer',
-            });
-        },
-    });
-    const Definition = z.object({
-        name: z.string().min(1, 'Username is required').trim(),
-        password: z.string().min(1, 'Password is required'),
-        secretAnswer: z.string().superRefine((val, ctx) => {
-            if (signInMutation.data && val.trim().length === 0) {
-                ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'Secret answer is required',
-                });
-            }
-        }),
-        termsAccepted: z.boolean().refine((val) => val, {
-            message: 'You must accept the terms and conditions',
-        }),
-    });
-    const form = useForm({
-        resolver: zodResolver(Definition),
-        defaultValues: {
-            name: '',
-            password: '',
-            secretAnswer: '',
-        },
-    });
-    const secretQuestion = signInMutation.data
-        ? z
-            .union([
-            z.enum(SECRET_QUESTIONS).transform((v) => {
-                return SECRET_QUESTIONS_MAP[v];
-            }),
-            z.string(),
-        ])
-            .parse(signInMutation.data.secretQuestion)
-        : null;
-    return (_jsxs(_Fragment, { children: [_jsxs("form", { className: "mt-3xl", onSubmit: form.handleSubmit((data) => {
-                    if (!signInMutation.data) {
-                        signInMutation.mutate({
-                            type: 'NAME_AND_PASSWORD',
-                            name: data.name,
-                            password: data.password,
-                        });
-                    }
-                    else {
-                        authenticateMutation.mutate({
-                            type: 'SECURITY_QUESTION',
-                            token: signInMutation.data.token,
-                            secretAnswer: data.secretAnswer,
-                        });
-                    }
-                }), children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.name, children: [_jsx(Field.Label, { children: "Name" }), _jsx(Field.Input, { placeholder: "Enter your name", ...form.register('name', {
-                                    onChange() {
-                                        signInMutation.reset();
-                                        form.setValue('secretAnswer', '');
-                                    },
-                                }) }), _jsx(Field.ErrorText, { children: form.formState.errors.name?.message })] }), _jsxs(Field.Root, { disabled: !!signInMutation.data, invalid: !!form.formState.errors.name, className: "mt-xl", children: [_jsxs(PasswordInput.Root, { children: [_jsx(PasswordInput.Label, { children: "Password" }), _jsxs(PasswordInput.Control, { children: [_jsx(PasswordInput.Input, { placeholder: "Enter your password", ...form.register('password') }), _jsx(PasswordInput.VisibilityTrigger, { children: _jsx(PasswordInput.Indicator, { fallback: _jsx(EyeOffIcon, {}), asChild: true, children: _jsx(EyeIcon, {}) }) })] }), _jsx("div", { className: "mt-2 flex justify-end", children: _jsx("button", { type: "button", tabIndex: -1, className: "text-button-tertiary-fg text-sm font-semibold", children: "Forgot Password" }) })] }), _jsx(Field.ErrorText, { children: form.formState.errors.password?.message })] }), signInMutation.data && (_jsxs(Field.Root, { invalid: !!form.formState.errors.secretAnswer, className: "mt-xl", children: [_jsx(Field.Label, { children: secretQuestion }), _jsx(Field.Input, { placeholder: "Answer the security question", ...form.register('secretAnswer') }), _jsx(Field.ErrorText, { children: form.formState.errors.secretAnswer?.message })] })), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: signInMutation.isPending || authenticateMutation.isPending, children: "Log In" }), _jsx(Controller, { control: form.control, name: "termsAccepted", render: (o) => (_jsxs(Checkbox.Root, { className: "mt-xl", invalid: o.fieldState.invalid, 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("span", { className: "text-brand-400 whitespace-nowrap underline underline-offset-2", children: "Terms and Conditions." })] }), _jsx(Checkbox.HiddenInput, {})] })) })] }), _jsxs("div", { className: "relative mt-6 text-center", children: [_jsx("hr", { className: "-translte-y-1/2 text-text-tertiary-600/50 absolute top-1/2 w-full" }), _jsx("span", { className: "text-text-tertiary-600 bg-bg-primary-alt relative px-md text-center text-sm font-semibold", children: "Log in directly with" })] }), _jsxs("div", { className: "mt-6", children: [_jsxs(Button, { variant: "outline", colorScheme: "gray", onClick: () => {
-                            dialog.setOpen(false);
-                        }, className: "border-border-primary bg-bg-primary text-text-secondary-700", children: [_jsx(GoogleIcon, { className: "size-6" }), "Continue with Google"] }), _jsxs(Button, { variant: "outline", colorScheme: "gray", onClick: () => {
-                            dialog.setOpen(false);
-                        }, className: "border-border-primary bg-bg-primary text-text-secondary-700 mt-lg", children: [_jsx(FacebookIcon, { className: "size-6" }), "Continue with Facebook"] })] }), _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: "Don't have an account?" }), _jsx("button", { type: "submit", className: "text-button-tertiary-fg font-semibold", onClick: () => {
-                            dialog.setOpen(false);
-                            globalStore.signUp.setOpen(true);
-                        }, children: "Sign up" })] })] }));
-}

package/dist/components/SignIn/SignIn.d.ts

@@ -1,7 +0,0 @@
-import { type ImageProps } from 'next/image';
-import type { ReactNode } from 'react';
-export interface SignInProps {
-    logo: ImageProps['src'];
-    children?: ReactNode;
-}
-export declare function SignIn(props: SignInProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/SignIn/SignIn.js

@@ -1,18 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Portal } from '@ark-ui/react';
-import Image, {} from 'next/image';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../client/hooks/index.js';
-import { XIcon } from '../../icons/index.js';
-import { Dialog } from '../../ui/index.js';
-import { SignInContext } from './SignInContext.js';
-import { SignInForm } from './SignInForm.js';
-import { useSignIn } from './useSignIn.js';
-export function SignIn(props) {
-    const signIn = useSignIn();
-    const signInStore = useGlobalStore(useShallow((popups) => popups.signIn));
-    return (_jsx(SignInContext, { value: signIn, children: _jsx(Dialog.Root, { open: signInStore.open, onOpenChange: (details) => {
-                signInStore.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: "bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-[400px] lg:rounded-xl", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-7.5 w-auto", draggable: false }), _jsx(SignInForm, {})] }) })] }) }) }));
-}

package/dist/components/SignIn/SignInContext.d.ts

@@ -1,2 +0,0 @@
-import type { UseSignInReturn } from './useSignIn';
-export declare const SignInContext: import("react").Context<UseSignInReturn>, useSignInContext: () => UseSignInReturn;

package/dist/components/SignIn/SignInContext.js

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

package/dist/components/SignIn/SignInForm.d.ts

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

package/dist/components/SignIn/SignInForm.js

@@ -1,10 +0,0 @@
-'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { MobileNumberSignIn } from './MobileNumberSignIn.js';
-import { NameAndPasswordSignIn } from './NameAndPasswordSignIn.js';
-import { useSignInContext } from './SignInContext.js';
-import { SignInMethod } from './SignInMethod.js';
-export function SignInForm() {
-    const context = useSignInContext();
-    return (_jsxs(_Fragment, { children: [context.step === 1 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "mt-xl text-center text-lg font-semibold", children: "Log in to your account" }), _jsx("p", { className: "text-text-secondary-700 mt-xs text-center text-sm", children: "Welcome back! Please enter your details." })] })), _jsx(SignInMethod, {}), context.type === 'MOBILE_NUMBER' && _jsx(MobileNumberSignIn, {}), context.type === 'NAME_AND_PASSWORD' && _jsx(NameAndPasswordSignIn, {})] }));
-}

package/dist/components/SignIn/SignInMethod.d.ts

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

package/dist/components/SignIn/SignInMethod.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { z } from 'zod';
-import { SegmentGroup } from '../../ui/index.js';
-import { useSignInContext } from './SignInContext.js';
-const METHODS = [
-    'MOBILE_NUMBER',
-    'NAME_AND_PASSWORD',
-];
-const METHOD_LABEL_MAP = {
-    MOBILE_NUMBER: 'Mobile',
-    NAME_AND_PASSWORD: 'Username',
-};
-export function SignInMethod() {
-    const context = useSignInContext();
-    return (_jsxs(SegmentGroup.Root, { value: context.type, onValueChange: (details) => {
-            context.setStep(1);
-            context.setType(z.enum(METHODS).parse(details.value));
-        }, className: "mt-5 w-full", children: [_jsx(SegmentGroup.Indicator, {}), METHODS.map((method) => (_jsxs(SegmentGroup.Item, { value: method, className: "w-full", children: [_jsx(SegmentGroup.ItemText, { children: METHOD_LABEL_MAP[method] }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }, method)))] }));
-}

package/dist/components/SignIn/SignInTrigger.d.ts

@@ -1,6 +0,0 @@
-import type { ComponentPropsWithRef } from 'react';
-interface SignInTriggerProps extends ComponentPropsWithRef<'button'> {
-    asChild?: boolean;
-}
-export declare function SignInTrigger(props: SignInTriggerProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/SignIn/SignInTrigger.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ark } from '@ark-ui/react';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../client/hooks/index.js';
-export function SignInTrigger(props) {
-    const globalStore = useGlobalStore(useShallow((ctx) => ({
-        signIn: ctx.signIn,
-    })));
-    return (_jsx(ark.button, { type: "button", "aria-label": "Sign in", "data-state": globalStore.signIn.open ? 'open' : 'closed', ...props, onClick: (e) => {
-            globalStore.signIn.setOpen(!globalStore.signIn.open);
-            return props.onClick?.(e);
-        } }));
-}

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

@@ -1,2 +0,0 @@
-export * from './SignIn';
-export * from './SignInTrigger';

package/dist/components/SignIn/index.js

@@ -1,2 +0,0 @@
-export * from './SignIn.js';
-export * from './SignInTrigger.js';

package/dist/components/SignIn/useSignIn.d.ts

@@ -1,10 +0,0 @@
-type SignInStep = 1 | 2 | (number & {});
-type SignInType = 'NAME_AND_PASSWORD' | 'MOBILE_NUMBER';
-export interface UseSignInReturn {
-    step: SignInStep;
-    setStep: (step: SignInStep) => void;
-    type: SignInType;
-    setType: (type: SignInType) => void;
-}
-export declare function useSignIn(): UseSignInReturn;
-export {};

package/dist/components/SignIn/useSignIn.js

@@ -1,11 +0,0 @@
-import { useState } from 'react';
-export function useSignIn() {
-    const [step, setStep] = useState(1);
-    const [type, setType] = useState('MOBILE_NUMBER');
-    return {
-        step,
-        setStep,
-        type,
-        setType,
-    };
-}

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

@@ -1,7 +0,0 @@
-import { type ImageProps } from 'next/image';
-import { type ReactNode } from 'react';
-export interface SignUpProps {
-    logo: ImageProps['src'];
-    children?: ReactNode;
-}
-export declare function SignUp(props: SignUpProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/SignUp/SignUp.js

@@ -1,16 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Portal } from '@ark-ui/react';
-import Image, {} from 'next/image';
-import { Suspense } from 'react';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../client/hooks/index.js';
-import { XIcon } from '../../icons/index.js';
-import { Dialog } from '../../ui/index.js';
-import { SignUpForm } from './SignUpForm.js';
-export function SignUp(props) {
-    const signUpStore = useGlobalStore(useShallow((popups) => popups.signUp));
-    return (_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: "bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-[400px] lg:rounded-xl", 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(SignUpForm, {}) })] }) })] }) }));
-}

package/dist/components/SignUp/SignUpForm.d.ts

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

package/dist/components/SignUp/SignUpForm.js

@@ -1,133 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useDialogContext } from '@ark-ui/react';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { ObjectId, ObjectType } from '@opexa/portal-sdk-core/object-id';
-import { useSearchParams } from 'next/navigation';
-import { useState } from 'react';
-import { Controller, useForm } from 'react-hook-form';
-import { z } from 'zod';
-import { useShallow } from 'zustand/shallow';
-import { useCooldown, useGlobalStore, useLocaleInfo, useMobileNumberParser, useSendVerificationCodeMutation, useSignInMutation, useSignUpMutation, } from '../../client/hooks/index.js';
-import { toaster } from '../../client/utils/index.js';
-import { ArrowLeftIcon, CheckIcon } from '../../icons/index.js';
-import { Button, Checkbox, Field, PinInput } from '../../ui/index.js';
-export function SignUpForm() {
-    const [step, setStep] = useState(1);
-    const dialog = useDialogContext();
-    const search = useSearchParams();
-    const signInStore = useGlobalStore(useShallow((popups) => popups.signIn));
-    const signUpMutation = useSignUpMutation();
-    const signInMutation = useSignInMutation();
-    const sendVerificationCodeMutation = useSendVerificationCodeMutation();
-    const localeInfo = useLocaleInfo();
-    const mobileNumberParser = useMobileNumberParser();
-    const Step1Definition = z.object({
-        mobileNumber: z.string().superRefine((v, ctx) => {
-            if (!mobileNumberParser.validate(v)) {
-                ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'Invalid mobile number',
-                });
-            }
-        }),
-        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().min(1).max(1).trim()).min(6).max(6),
-    });
-    const step1Form = useForm({
-        resolver: zodResolver(Step1Definition),
-        defaultValues: {
-            mobileNumber: '',
-            termsAccepted: false,
-        },
-    });
-    const step2Form = useForm({
-        resolver: zodResolver(Step2Definition),
-        defaultValues: {
-            verificationCode: Array.from({ length: 6 }).fill(''),
-        },
-    });
-    const cooldown = useCooldown({
-        max: 60,
-        duration: 1000 * 60,
-    });
-    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", 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.mobileNumber, children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsx(localeInfo.country.flag, { className: "absolute left-3.5 top-1/2 size-5 shrink-0 -translate-y-1/2" }), _jsx(Field.Input, { className: "pl-11", placeholder: `${localeInfo.mobileNumber.areaCode}${localeInfo.mobileNumber.example}`, ...step1Form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.mobileNumber?.message })] }), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: step1Form.formState.isSubmitting, children: "Create Account" }), _jsx(Controller, { control: step1Form.control, name: "termsAccepted", render: (o) => (_jsxs(Checkbox.Root, { className: "mt-xl", invalid: o.fieldState.invalid, 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("span", { className: "text-brand-400 whitespace-nowrap underline underline-offset-2", children: "Terms and Conditions." })] }), _jsx(Checkbox.HiddenInput, {})] })) })] }), _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: "Don't 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", { 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,
-                                    domain: search.get('domain') ?? undefined,
-                                    btag: search.get('btag') ?? undefined,
-                                });
-                                const name = mobileNumberParser.format(mobileNumber);
-                                const password = `${name}${id}`;
-                                try {
-                                    await signInMutation.mutateAsync({
-                                        type: 'NAME_AND_PASSWORD',
-                                        name: mobileNumberParser.format(mobileNumber),
-                                        password,
-                                    });
-                                }
-                                catch {
-                                    signInStore.setOpen(true);
-                                }
-                                dialog.setOpen(false);
-                                step1Form.reset();
-                                step2Form.reset();
-                                setStep(1);
-                            }
-                            catch {
-                                toaster.error({
-                                    title: 'Invalid Verification Code',
-                                });
-                            }
-                        }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(PinInput.Root, { placeholder: "0", invalid: o.fieldState.invalid, value: o.field.value, onValueChange: (details) => {
-                                        o.field.onChange(details.value);
-                                    }, 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(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"] })] })] }))] }));
-}

package/dist/components/SignUp/SignUpTrigger.d.ts

@@ -1,6 +0,0 @@
-import type { ComponentPropsWithRef } from 'react';
-interface SignUpTriggerProps extends ComponentPropsWithRef<'button'> {
-    asChild?: boolean;
-}
-export declare function SignUpTrigger(props: SignUpTriggerProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/SignUp/SignUpTrigger.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ark } from '@ark-ui/react';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../client/hooks/index.js';
-export function SignUpTrigger(props) {
-    const globalStore = useGlobalStore(useShallow((ctx) => ({
-        signUp: ctx.signUp,
-    })));
-    return (_jsx(ark.button, { type: "button", "aria-label": "Sign up", "data-state": globalStore.signUp.open ? 'open' : 'closed', ...props, onClick: (e) => {
-            globalStore.signUp.setOpen(!globalStore.signUp.open);
-            return props.onClick?.(e);
-        } }));
-}

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

@@ -1,2 +0,0 @@
-export * from './SignUp';
-export * from './SignUpTrigger';

package/dist/components/SignUp/index.js

@@ -1,2 +0,0 @@
-export * from './SignUp.js';
-export * from './SignUpTrigger.js';

package/dist/components/TopWins/TopWins.client.d.ts

@@ -1,2 +0,0 @@
-import type { TopWinsProps } from './TopWins';
-export declare function TopWins__client(props: TopWinsProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/TopWins/TopWins.client.js

@@ -1,23 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import useEmblaCarousel from 'embla-carousel-react';
-import Image from 'next/image';
-import { useLocaleInfo, useTopWinsQuery } from '../../client/hooks/index.js';
-import { formatNumber, getGameImageUrl } from '../../utils/index.js';
-export function TopWins__client(props) {
-    const localeInfo = useLocaleInfo();
-    const topWinsQuery = useTopWinsQuery();
-    const topWins = topWinsQuery.data ?? [];
-    const [emblaRef] = useEmblaCarousel({
-        align: 'start',
-        slidesToScroll: 1,
-    });
-    if (!topWins?.length)
-        return null;
-    return (_jsxs("div", { className: props.className, children: [_jsx("div", { className: "mb-3 text-lg font-semibold md:mb-4", children: props.heading ?? 'Recent Big Wins' }), _jsx("div", { ref: emblaRef, className: "relative lg:overflow-hidden", children: _jsx("div", { className: "flex gap-sm lg:gap-md", children: topWins.map((topWin) => (_jsxs("div", { className: "bg-bg-tertiary border-border-primary flex w-[calc((100%-(0.375rem*2))/3)] shrink-0 flex-col space-y-2 rounded-sm border p-2 text-center lg:w-[calc((100%-(0.5rem*5))/6)] xl:w-[calc((100%-(0.5rem*9))/10)]", children: [_jsx("div", { className: "mx-auto aspect-square w-full", children: topWin.game && (_jsx(Image, { width: 100, height: 100, src: getGameImageUrl(topWin.game), alt: "", className: "size-full rounded-sm object-cover" })) }), _jsxs("div", { className: "space-y-0.5", children: [_jsx("div", { className: "text-text-secondary-700 text-xs", children: topWin.member.name }), _jsx("div", { className: "text-text-primary-brand text-sm font-semibold", children: formatNumber(topWin.payout, {
-                                            currency: localeInfo.currency.code,
-                                            minDecimalPlaces: 2,
-                                        }) }), _jsx("div", { className: "text-text-secondary-700 text-xs", children: formatNumber(topWin.multiplier, {
-                                            minDecimalPlaces: 2,
-                                        }) })] })] }, topWin.id))) }) })] }));
-}

package/dist/components/TopWins/TopWins.d.ts

@@ -1,6 +0,0 @@
-export interface TopWinsProps {
-    /** @default "Recent Big Wins" */
-    heading?: string;
-    className?: string;
-}
-export declare function TopWins(props: TopWinsProps): Promise<import("react/jsx-runtime").JSX.Element>;

package/dist/components/TopWins/TopWins.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { prefetchTopWinsQuery } from '../../server/utils/index.js';
-import { TopWins__client } from './TopWins.client.js';
-export async function TopWins(props) {
-    await prefetchTopWinsQuery();
-    return _jsx(TopWins__client, { ...props });
-}

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

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

package/dist/components/TopWins/index.js

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

package/dist/components/TournamentCounter/TournamentCounter.client.d.ts

@@ -1,2 +0,0 @@
-import type { TournamentCounterProps } from './TournamentCounter';
-export declare function TournamentCounter__client(props: TournamentCounterProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/TournamentCounter/TournamentCounter.client.js

@@ -1,50 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import useEmblaCarousel from 'embla-carousel-react';
-import Link from 'next/link';
-import { useCallback, useEffect, useState } from 'react';
-import { useTournamentsQuery } from '../../client/hooks/index.js';
-import { ArrowLeftIcon, ArrowRightIcon, ChevronRightIcon } from '../../icons/index.js';
-import { Button } from '../../ui/index.js';
-import { TournamentCounterItem } from './TournamentCounterItem.js';
-export function TournamentCounter__client(props) {
-    const [emblaRef, emblaApi] = useEmblaCarousel({
-        align: 'start',
-        slidesToScroll: 1,
-    });
-    const scrollPrev = useCallback(() => {
-        if (emblaApi)
-            emblaApi.scrollPrev();
-    }, [emblaApi]);
-    const scrollNext = useCallback(() => {
-        if (emblaApi)
-            emblaApi.scrollNext();
-    }, [emblaApi]);
-    const [canScrollPrev, setCanScrollPrev] = useState(false);
-    const [canScrollNext, setCanScrollNext] = useState(false);
-    const onSelect = useCallback(() => {
-        if (!emblaApi)
-            return;
-        setCanScrollPrev(emblaApi.canScrollPrev());
-        setCanScrollNext(emblaApi.canScrollNext());
-    }, [emblaApi]);
-    useEffect(() => {
-        if (!emblaApi)
-            return;
-        onSelect();
-        emblaApi.on('select', onSelect);
-        emblaApi.on('reInit', onSelect);
-    }, [emblaApi, onSelect]);
-    const tournamentsQuery = useTournamentsQuery({
-        first: 100,
-        filter: {
-            status: {
-                equal: 'ACTIVE',
-            },
-        },
-    });
-    const tournaments = tournamentsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
-    if (tournaments.length <= 0)
-        return null;
-    return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-lg font-semibold", children: props.heading ?? 'Tournaments' }), _jsxs("div", { className: "flex items-center md:gap-3xl", children: [_jsxs(Link, { href: props.viewAllUrl ?? '/tournaments', className: "text-button-tertiary-fg flex gap-sm text-sm font-semibold", children: ["See All", _jsx(ChevronRightIcon, { className: "size-5 lg:hidden" })] }), _jsxs("div", { className: "hidden lg:flex", children: [_jsx(Button, { disabled: !canScrollPrev, onClick: scrollPrev, variant: "outline", colorScheme: "gray", className: "rounded-r-none border-r-0", "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsxs(Button, { disabled: !canScrollNext, onClick: scrollNext, variant: "outline", colorScheme: "gray", className: "rounded-l-none", "aria-label": "Next", children: [_jsx("span", { className: "sr-only", children: "Next" }), _jsx(ArrowRightIcon, { className: "size-5" })] })] })] })] }), _jsx("div", { className: "relative mt-lg lg:overflow-hidden", ref: emblaRef, children: _jsx("div", { className: "flex gap-2.5", children: tournaments.map((tournament, i) => (_jsx(TournamentCounterItem, { tournament: tournament, viewAllUrl: props.viewAllUrl, className: "w-full" }, i))) }) })] }));
-}

package/dist/components/TournamentCounter/TournamentCounter.d.ts

@@ -1,8 +0,0 @@
-export interface TournamentCounterProps {
-    /** @default "Tournaments" */
-    heading?: string;
-    /** @default "/tournaments" */
-    viewAllUrl?: string;
-    className?: string;
-}
-export declare function TournamentCounter(props: TournamentCounterProps): Promise<import("react/jsx-runtime").JSX.Element>;

package/dist/components/TournamentCounter/TournamentCounter.js

@@ -1,21 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { prefetchJackpotsQuery } from '../../server/utils/index.js';
-import { TournamentCounter__client } from './TournamentCounter.client.js';
-export async function TournamentCounter(props) {
-    await prefetchJackpotsQuery({
-        first: 100,
-        filter: {
-            status: {
-                equal: 'ACTIVE',
-            },
-            deleted: {
-                equal: false,
-            },
-        },
-        sort: {
-            cursor: 'POOL',
-            order: 'DESC',
-        },
-    });
-    return _jsx(TournamentCounter__client, { ...props });
-}

package/dist/components/TournamentCounter/TournamentCounterItem.d.ts

@@ -1,8 +0,0 @@
-import type { Tournament } from '@opexa/portal-sdk-core';
-export interface TournamentCounterItemProps {
-    tournament: Tournament;
-    className?: string;
-    /** @default "/tournaments" */
-    viewAllUrl?: string;
-}
-export declare function TournamentCounterItem({ tournament, className, viewAllUrl, }: TournamentCounterItemProps): import("react/jsx-runtime").JSX.Element;