@opexa/portal-components 0.0.62 → 0.0.64

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositContext.js

@@ -1,8 +1,2 @@
-import { createContext, useContext } from 'react';
-import invariant from 'tiny-invariant';
-export const QRPHDepositContext = createContext(null);
-export const useQRPHDepositContext = () => {
-    const context = useContext(QRPHDepositContext);
-    invariant(context);
-    return context;
-};
+import { createContext } from '../../../../client/utils/index.js';
+export const [QRPHDepositContext, useQRPHDepositContext] = createContext();

package/dist/components/Empty.d.ts

@@ -3,6 +3,7 @@ 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/components/Empty.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function Empty(props) {
-    return (_jsxs("div", { role: "alert", "aria-live": "polite", className: props.className, children: [_jsxs("div", { className: "relative mx-auto w-[9.5rem] pt-4", children: [_jsx("div", { className: "bg-utility-gray-200 absolute left-1/2 top-0 size-[6.5rem] -translate-x-1/2 rounded-full" }), _jsx(CloudIcon, { className: "relative h-auto w-full shrink-0" }), _jsx("div", { className: "bg-utility-gray-200/40 absolute bottom-2 left-1/2 flex size-12 -translate-x-1/2 items-center justify-center rounded-full backdrop-blur-sm", children: _jsx(props.icon, { className: "size-6 text-white" }) }), _jsx("div", { className: "bg-utility-gray-200 absolute left-4 top-3.5 size-2.5 rounded-full" }), _jsx("div", { className: "bg-utility-gray-200 absolute bottom-0.5 left-3 size-3.5 rounded-full" }), _jsx("div", { className: "bg-utility-gray-200 absolute right-3.5 top-1 size-2 rounded-full" }), _jsx("div", { className: "bg-utility-gray-200 absolute right-0 top-6.5 size-3.5 rounded-full" })] }), _jsx("h2", { className: "mt-xl text-center font-semibold", children: props.title }), _jsx("p", { className: "text-text-tertiary-600 mx-auto mt-xs max-w-[25rem] text-center text-sm", children: props.message })] }));
+    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: "bg-utility-gray-200 absolute left-1/2 top-0 size-[6.5rem] -translate-x-1/2 rounded-full" }), _jsx(CloudIcon, { className: "relative h-auto w-full shrink-0" }), _jsx("div", { className: "bg-utility-gray-200/40 absolute bottom-2 left-1/2 flex size-12 -translate-x-1/2 items-center justify-center rounded-full backdrop-blur-sm", children: _jsx(props.icon, { className: "size-6 text-white" }) }), _jsx("div", { className: "bg-utility-gray-200 absolute left-4 top-3.5 size-2.5 rounded-full" }), _jsx("div", { className: "bg-utility-gray-200 absolute bottom-0.5 left-3 size-3.5 rounded-full" }), _jsx("div", { className: "bg-utility-gray-200 absolute right-3.5 top-1 size-2 rounded-full" }), _jsx("div", { className: "bg-utility-gray-200 absolute right-0 top-6.5 size-3.5 rounded-full" })] }), _jsx("h2", { className: "mt-xl text-center font-semibold", children: props.title }), _jsx("p", { className: "text-text-tertiary-600 mx-auto mt-xs max-w-[25rem] text-center text-sm", 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/components/Games/GameContext.d.ts

@@ -1,3 +1,2 @@
 import type { Game } from '@opexa/portal-sdk-core';
-export declare const GameContext: import("react").Context<Game | null>;
-export declare const useGameContext: () => Game;
+export declare const GameContext: import("react").Context<Game>, useGameContext: () => Game;

package/dist/components/Games/GameContext.js

@@ -1,8 +1,2 @@
-import { createContext, useContext } from 'react';
-import invariant from 'tiny-invariant';
-export const GameContext = createContext(null);
-export const useGameContext = () => {
-    const context = useContext(GameContext);
-    invariant(context);
-    return context;
-};
+import { createContext } from '../../client/utils/index.js';
+export const [GameContext, useGameContext] = createContext();

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

@@ -1,3 +1,2 @@
 import type { UseKYCReturn } from './useKYC';
-export declare const KYCContext: import("react").Context<UseKYCReturn | null>;
-export declare const useKYCContext: () => UseKYCReturn;
+export declare const KYCContext: import("react").Context<UseKYCReturn>, useKYCContext: () => UseKYCReturn;

package/dist/components/KYC/KYCContext.js

@@ -1,8 +1,2 @@
-import { createContext, useContext } from 'react';
-import invariant from 'tiny-invariant';
-export const KYCContext = createContext(null);
-export const useKYCContext = () => {
-    const context = useContext(KYCContext);
-    invariant(context);
-    return context;
-};
+import { createContext } from '../../client/utils/index.js';
+export const [KYCContext, useKYCContext] = createContext();

package/dist/components/Messages/MessageItem.js

@@ -14,13 +14,14 @@ export function MessageItem({ message }) {
         message: ctx.message,
         messages: ctx.messages,
     })));
-    const { mutate } = useMarkMessageAsReadMutation();
+    const markMessageAsReadMutation = useMarkMessageAsReadMutation();
     const Icon = getMessageIcon(icon);
     const handleViewMessage = async () => {
-        mutate(id);
         globalStore.message.setData(message);
         globalStore.message.setOpen(true);
         globalStore.messages.setOpen(false);
+        if (!markedAsRead)
+            markMessageAsReadMutation.mutate(id);
     };
     const handleActionClick = (e) => {
         e.stopPropagation();

package/dist/components/Messages/MessagePopup.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Portal } from '@ark-ui/react';
 import Link from 'next/link';

package/dist/components/Messages/MessageTrigger.d.ts

@@ -0,0 +1,8 @@
+import type { Message } from '@opexa/portal-sdk-core';
+import type { ComponentPropsWithRef } from 'react';
+interface MessageTriggerProps extends ComponentPropsWithRef<'button'> {
+    message: Message;
+    asChild?: boolean;
+}
+export declare function MessageTrigger(props: MessageTriggerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Messages/MessageTrigger.js

@@ -0,0 +1,18 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ark } from '@ark-ui/react';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore, useMarkMessageAsReadMutation, } from '../../client/hooks/index.js';
+export function MessageTrigger(props) {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        message: ctx.message,
+    })));
+    const markMessageAsReadMutation = useMarkMessageAsReadMutation();
+    return (_jsx(ark.button, { type: "button", "aria-label": "View message", "data-state": globalStore.message.open ? 'open' : 'closed', ...props, onClick: (e) => {
+            globalStore.message.setData(props.message);
+            globalStore.message.setOpen(true);
+            if (!props.message.markedAsRead)
+                markMessageAsReadMutation.mutate(props.message.id);
+            return props.onClick?.(e);
+        } }));
+}

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

@@ -1,2 +1,4 @@
+export * from './MessagePopup';
 export * from './Messages';
 export * from './MessagesTrigger';
+export * from './MessageTrigger';

package/dist/components/Messages/index.js

@@ -1,2 +1,4 @@
+export * from './MessagePopup.js';
 export * from './Messages.js';
 export * from './MessagesTrigger.js';
+export * from './MessageTrigger.js';

package/dist/components/PortalProvider/WebVitals.js

@@ -1,8 +1,8 @@
 'use client';
 import { useReportWebVitals } from 'next/web-vitals';
 export function WebVitals() {
-    useReportWebVitals((metrics) => {
-        console.log(metrics);
+    useReportWebVitals((metric) => {
+        console.log(metric);
     });
     return null;
 }

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

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

package/dist/components/Promo/Promo.client.js

@@ -4,7 +4,6 @@ import { tz } from '@date-fns/tz';
 import { format } from 'date-fns';
 import Image from 'next/image';
 import Link from 'next/link';
-import invariant from 'tiny-invariant';
 import { useShallow } from 'zustand/shallow';
 import { useGlobalStore, useLocaleInfo, usePromoQuery, } from '../../client/hooks/index.js';
 import { ChevronLeftIcon } from '../../icons/index.js';
@@ -16,10 +15,11 @@ export function Promo__client(props) {
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         depositWithdrawal: ctx.depositWithdrawal,
     })));
-    invariant(promo);
+    if (!promo)
+        return null;
     return (_jsxs("div", { className: props.className, children: [_jsxs(Link, { href: props.viewAllPromosUrl ?? '/promos', className: "text-button-tertiary-fg flex w-fit items-center gap-lg text-lg font-semibold", children: [_jsx(ChevronLeftIcon, { className: "size-6" }), "Back to all Promotions"] }), promo.banner.url && (_jsx(Image, { src: promo.banner.url, alt: "", width: 1024, height: 600, className: "mt-xl h-auto w-full rounded-xl lg:mt-6" })), _jsx(Button, { className: "mt-xl lg:mt-6", onClick: () => {
                     globalStore.depositWithdrawal.setOpen(true);
-                }, children: "Deposit Now" }), _jsx("h1", { className: "mt-xl text-2xl font-semibold lg:mt-6 lg:text-3xl", children: promo.name }), _jsxs("p", { className: "text-text-secondary-700 mt-xl lg:mt-6", children: ["Ends", ' ', format(promo.activationEndDateTime, 'MM/dd/yyy hh:mm:ss A', {
+                }, children: "Deposit Now" }), _jsx("h1", { className: "mt-xl text-2xl font-semibold lg:mt-6 lg:text-3xl", children: promo.name }), _jsxs("p", { className: "text-text-secondary-700 mt-xl lg:mt-6", children: ["Ends", ' ', format(promo.activationEndDateTime, 'MM/dd/yyy hh:mm:ss', {
                         in: tz(localeInfo.timezone),
                     })] }), _jsx(Prose, { className: "mt-2xl lg:mt-6", dangerouslySetInnerHTML: {
                     __html: promo.description,

package/dist/components/Promos/Cashback.d.ts

@@ -0,0 +1,7 @@
+import type { Cashback as TCashback } from '@opexa/portal-sdk-core';
+interface CashbackProps {
+    data: TCashback;
+    viewDetailsUrl: string;
+}
+export declare function Cashback({ data, viewDetailsUrl, }: CashbackProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Promos/Cashback.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Image from 'next/image';
+import Link from 'next/link';
+import { useShallow } from 'zustand/shallow';
+import { useAvailablePromosQuery, useGlobalStore } from '../../client/hooks/index.js';
+import { Button } from '../../ui/index.js';
+export function Cashback({ data, viewDetailsUrl = '/promos/cashback', }) {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        depositWithdrawal: ctx.depositWithdrawal,
+    })));
+    const claimablePromos = useAvailablePromosQuery().data ?? [];
+    const claimable = claimablePromos.find((availablePromo) => availablePromo.id === data.id);
+    return (_jsxs("div", { className: "border-border-secondary bg-accent-50 bg-bg-primary-alt relative flex h-full flex-col overflow-hidden rounded-2xl border", children: [data.banner.url && (_jsx(Image, { src: data.banner.url, alt: data.name, width: 1200, height: 500, priority: true, className: "block aspect-[365/180] w-full object-cover" })), _jsxs("div", { className: "flex flex-grow flex-col px-4 pb-3xl pt-2xl", children: [_jsx("div", { className: "w-full grow text-center text-xl font-semibold", children: data.name }), _jsxs("div", { className: "mt-auto flex flex-col gap-3 pt-4 lg:flex-row", children: [claimable && (_jsx(Button, { size: "sm", onClick: () => {
+                                    globalStore.depositWithdrawal.setOpen(true);
+                                    globalStore.depositWithdrawal.setPromo(data.id);
+                                }, children: "Get bonus" })), _jsx(Button, { size: "sm", variant: "outline", asChild: true, children: _jsx(Link, { href: `${viewDetailsUrl}/${data.id}`, children: "Read more" }) })] })] })] }));
+}

package/dist/components/Promos/Promo.d.ts

@@ -0,0 +1,7 @@
+import type { Promo as TPromo } from '@opexa/portal-sdk-core';
+interface PromoProps {
+    data: TPromo;
+    viewDetailsUrl: string;
+}
+export declare function Promo({ data, viewDetailsUrl }: PromoProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Promos/Promo.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Image from 'next/image';
+import Link from 'next/link';
+import { useShallow } from 'zustand/shallow';
+import { useAvailablePromosQuery, useGlobalStore } from '../../client/hooks/index.js';
+import { Button } from '../../ui/index.js';
+export function Promo({ data, viewDetailsUrl = '/promos' }) {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        depositWithdrawal: ctx.depositWithdrawal,
+    })));
+    const claimablePromos = useAvailablePromosQuery().data ?? [];
+    const claimable = claimablePromos.find((availablePromo) => availablePromo.id === data.id);
+    return (_jsxs("div", { className: "border-border-secondary bg-accent-50 bg-bg-primary-alt relative flex h-full flex-col overflow-hidden rounded-2xl border", children: [data.banner.url && (_jsx(Image, { src: data.banner.url, alt: data.name, width: 1200, height: 500, priority: true, className: "block aspect-[365/180] w-full object-cover" })), _jsxs("div", { className: "flex flex-grow flex-col px-4 pb-3xl pt-2xl", children: [_jsx("div", { className: "w-full grow text-center text-xl font-semibold", children: data.name }), _jsxs("div", { className: "mt-auto flex flex-col gap-3 pt-4 lg:flex-row", children: [claimable && (_jsx(Button, { size: "sm", onClick: () => {
+                                    globalStore.depositWithdrawal.setOpen(true);
+                                    globalStore.depositWithdrawal.setPromo(data.id);
+                                }, children: "Get bonus" })), _jsx(Button, { size: "sm", variant: "outline", asChild: true, children: _jsx(Link, { href: `${viewDetailsUrl}/${data.id}`, children: "Read more" }) })] })] })] }));
+}

package/dist/components/Promos/Promos.d.ts

@@ -3,6 +3,10 @@ export interface PromosProps {
     heading?: string;
     /** @default "/promos" */
     viewAllUrl?: string;
+    /** @default "/promos" */
+    viewPromoDetailsUrl?: string;
+    /** @default "/promos/cashback" */
+    viewCashbackDetailsUrl?: string;
     /** @default 1 */
     className?: string;
     /** @default 'carousel' */

package/dist/components/Promos/Promos.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { prefetchPromosQuery } from '../../server/utils/index.js';
-import { PromoCarousel } from './PromoCarousel.js';
-import { PromoGrid } from './PromoGrid.js';
+import { prefetchCashbacksQuery, prefetchPromosQuery, } from '../../server/utils/index.js';
+import { PromosCarousel } from './PromosCarousel.js';
+import { PromosGrid } from './PromosGrid.js';
 export async function Promos(props) {
-    await prefetchPromosQuery();
+    await Promise.all([prefetchPromosQuery(), prefetchCashbacksQuery()]);
     if (props.layout === 'grid') {
-        return _jsx(PromoGrid, { ...props });
+        return _jsx(PromosGrid, { ...props });
     }
     else {
-        return _jsx(PromoCarousel, { ...props });
+        return _jsx(PromosCarousel, { ...props });
     }
 }

package/dist/components/Promos/PromosCarousel.d.ts

@@ -0,0 +1,2 @@
+import type { PromosProps } from './Promos';
+export declare function PromosCarousel(props: PromosProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Promos/{PromoCarousel.js → PromosCarousel.js}

@@ -1,17 +1,21 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import useEmblaCarousel, {} from 'embla-carousel-react';
 import Link from 'next/link';
 import { useCallback, useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
-import { usePromosQuery } from '../../client/hooks/index.js';
+import { useCashbacksQuery, usePromosQuery } from '../../client/hooks/index.js';
 import { ArrowLeftIcon, ArrowRightIcon, ChevronRightIcon, Gift01Icon, } from '../../icons/index.js';
 import { Button } from '../../ui/index.js';
 import { Empty } from '../Empty.js';
-import { PromosItem } from './PromoItem.js';
-export function PromoCarousel(props) {
+import { Cashback } from './Cashback.js';
+import { Promo } from './Promo.js';
+export function PromosCarousel(props) {
     const promosQuery = usePromosQuery();
+    const cashbacksQuery = useCashbacksQuery();
     const promos = promosQuery.data ?? [];
+    const cashbacks = cashbacksQuery.data ?? [];
+    const empty = promos.length <= 0 && cashbacks.length <= 0;
     const [emblaRef, emblaApi] = useEmblaCarousel({
         align: 'start',
         slidesToScroll: 1,
@@ -37,5 +41,5 @@ export function PromoCarousel(props) {
         onSelect(emblaApi);
         emblaApi.on('reInit', onSelect).on('select', onSelect);
     }, [emblaApi, onSelect]);
-    return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "text-lg font-semibold", children: props.heading ?? 'Promotions' }), _jsx("div", { className: "grow" }), _jsxs("div", { className: "flex items-center justify-center gap-xl", children: [_jsxs(Link, { href: props.viewAllUrl ?? '/promos', 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, { variant: "outline", colorScheme: "gray", className: "rounded-r-none border-r-0", onClick: onPrevButtonClick, disabled: prevBtnDisabled, "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsx(Button, { variant: "outline", colorScheme: "gray", className: "rounded-l-none", onClick: onNextButtonClick, disabled: nextBtnDisabled, "aria-label": "Next", children: _jsx(ArrowRightIcon, { className: "size-5" }) })] })] })] }), promos.length <= 0 && (_jsx(Empty, { icon: Gift01Icon, title: "No Promos", message: "No promo is currently available.", className: "mt-8" })), promos.length >= 1 && (_jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid auto-cols-[100%] grid-flow-col gap-1.5 lg:auto-cols-[calc((100%-(1.25rem*2))/3)] lg:gap-2xl'), children: promos.map((promo) => (_jsx(PromosItem, { promo: promo, redirectUrl: props.viewAllUrl }, promo.id))) }) }))] }));
+    return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "text-lg font-semibold", children: props.heading ?? 'Promotions' }), _jsx("div", { className: "grow" }), _jsxs("div", { className: "flex items-center justify-center gap-xl", children: [_jsxs(Link, { href: props.viewAllUrl ?? '/promos', 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, { variant: "outline", colorScheme: "gray", className: "rounded-r-none border-r-0", onClick: onPrevButtonClick, disabled: prevBtnDisabled, "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsx(Button, { variant: "outline", colorScheme: "gray", className: "rounded-l-none", onClick: onNextButtonClick, disabled: nextBtnDisabled, "aria-label": "Next", children: _jsx(ArrowRightIcon, { className: "size-5" }) })] })] })] }), empty && (_jsx(Empty, { icon: Gift01Icon, title: "No Promos", message: "No promo is currently available.", className: "mt-8" })), !empty && (_jsx(_Fragment, { children: _jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsxs("div", { className: twMerge('grid auto-cols-[100%] grid-flow-col gap-1.5 lg:auto-cols-[calc((100%-(1.25rem*2))/3)] lg:gap-2xl'), children: [promos.map((promo) => (_jsx(Promo, { data: promo, viewDetailsUrl: props.viewPromoDetailsUrl ?? '/promos' }, promo.id))), cashbacks.map((cashback) => (_jsx(Cashback, { data: cashback, viewDetailsUrl: props.viewCashbackDetailsUrl ?? '/promos/cashback' }, cashback.id)))] }) }) }))] }));
 }

package/dist/components/Promos/PromosGrid.d.ts

@@ -0,0 +1,2 @@
+import type { PromosProps } from './Promos';
+export declare function PromosGrid(props: PromosProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Promos/PromosGrid.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCashbacksQuery, usePromosQuery } from '../../client/hooks/index.js';
+import { Cashback } from './Cashback.js';
+import { Promo } from './Promo.js';
+export function PromosGrid(props) {
+    const promosQuery = usePromosQuery();
+    const cashbacksQuery = useCashbacksQuery();
+    const promos = promosQuery.data ?? [];
+    const cashbacks = cashbacksQuery.data ?? [];
+    const empty = promos.length <= 0 && cashbacks.length <= 0;
+    if (empty) {
+        return (_jsx("div", { className: props.className, children: _jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "text-lg font-semibold", children: props.heading ?? 'Promos' }), _jsx("div", { className: "grow" })] }) }));
+    }
+    return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "text-lg font-semibold", children: props.heading ?? 'Promos' }), _jsx("div", { className: "grow" })] }), _jsx("div", { className: "relative mt-lg lg:overflow-hidden", children: _jsxs("div", { className: "grid gap-3xl lg:grid-cols-3 lg:gap-2xl", children: [promos.map((promo) => (_jsx(Promo, { data: promo, viewDetailsUrl: props.viewPromoDetailsUrl ?? '/promos' }, promo.id))), cashbacks.map((cashback) => (_jsx(Cashback, { data: cashback, viewDetailsUrl: props.viewCashbackDetailsUrl ?? '/promos/cashback' }, cashback.id)))] }) })] }));
+}

package/dist/components/SignIn/MobileNumberSignIn.js

@@ -1,6 +1,7 @@
 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 { useRef } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { useShallow } from 'zustand/shallow';
@@ -55,6 +56,7 @@ export function MobileNumberSignIn() {
         max: 60,
         duration: 1000 * 60,
     });
+    const form2Ref = useRef(null);
     return (_jsxs(_Fragment, { children: [context.step === 1 && (_jsxs(_Fragment, { children: [_jsxs("form", { className: "mt-3xl", onSubmit: step1Form.handleSubmit(async (data) => {
                             try {
                                 await sendVerificationCodeMutation.mutateAsync({
@@ -81,7 +83,7 @@ export function MobileNumberSignIn() {
                                 }, 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);
                                     signUpStore.setOpen(true);
-                                }, children: "Sign up" })] })] })), context.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 }) => {
+                                }, children: "Sign up" })] })] })), context.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 { mobileNumber } = step1Form.getValues();
                             try {
                                 await signInMutation.mutateAsync({
@@ -101,6 +103,8 @@ export function MobileNumberSignIn() {
                             }
                         }), 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);
+                                    }, otp: true, 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(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: cooldown.cooling, onClick: async () => {
                                             await sendVerificationCodeMutation.mutateAsync({
                                                 channel: 'SMS',

package/dist/components/SignIn/NameAndPasswordSignIn.js

@@ -4,24 +4,67 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { Controller, useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { useShallow } from 'zustand/shallow';
-import { useGlobalStore, useSignInMutation } from '../../client/hooks/index.js';
+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';
-const Definition = z.object({
-    name: z.string(),
-    password: z.string(),
-    secretAnswer: z.string(),
-    termsAccepted: z.boolean().refine((val) => val, {
-        message: 'You must accept the terms and conditions',
-    }),
-});
 export function NameAndPasswordSignIn() {
     const context = useSignInContext();
     const dialog = useDialogContext();
-    const signUpStore = useGlobalStore(useShallow((popups) => popups.signUp));
-    const signInMutation = useSignInMutation();
+    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: {
@@ -30,17 +73,37 @@ export function NameAndPasswordSignIn() {
             secretAnswer: '',
         },
     });
-    return (_jsxs(_Fragment, { children: [_jsxs("form", { className: "mt-3xl", onSubmit: form.handleSubmit(async (data) => {
-                    try {
+    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,
+                        });
                     }
-                    catch (e) {
-                        toaster.error({
-                            description: e instanceof Error
-                                ? e.message
-                                : 'Failed to send verification code',
+                    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') }), _jsx(Field.ErrorText, { children: form.formState.errors.name?.message })] }), _jsxs(Field.Root, { 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 })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.secretAnswer, className: "mt-xl", children: [_jsx(Field.Label, { children: "What was the name of your first pet?" }), _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: form.formState.isSubmitting, 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) => {
+                }), 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);
@@ -48,6 +111,6 @@ export function NameAndPasswordSignIn() {
                             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);
-                            signUpStore.setOpen(true);
+                            globalStore.signUp.setOpen(true);
                         }, children: "Sign up" })] })] }));
 }

package/dist/components/SignIn/SignIn.js

@@ -6,10 +6,13 @@ 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(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, {})] }) })] }) }));
+    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,12 +1,2 @@
-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 declare const SignInContext: import("react").Context<UseSignInReturn | null>;
-export declare const useSignInContext: () => UseSignInReturn;
-export {};
+import type { UseSignInReturn } from './useSignIn';
+export declare const SignInContext: import("react").Context<UseSignInReturn>, useSignInContext: () => UseSignInReturn;

package/dist/components/SignIn/SignInContext.js

@@ -1,18 +1,2 @@
-import { createContext, useContext, useState } from 'react';
-import invariant from 'tiny-invariant';
-export function useSignIn() {
-    const [step, setStep] = useState(1);
-    const [type, setType] = useState('MOBILE_NUMBER');
-    return {
-        step,
-        setStep,
-        type,
-        setType,
-    };
-}
-export const SignInContext = createContext(null);
-export const useSignInContext = () => {
-    const context = useContext(SignInContext);
-    invariant(context);
-    return context;
-};
+import { createContext } from '../../client/utils/index.js';
+export const [SignInContext, useSignInContext] = createContext();

package/dist/components/SignIn/SignInForm.js

@@ -2,9 +2,9 @@
 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 { SignInContext, useSignIn } from './SignInContext.js';
+import { useSignInContext } from './SignInContext.js';
 import { SignInMethod } from './SignInMethod.js';
 export function SignInForm() {
-    const context = useSignIn();
-    return (_jsxs(SignInContext, { value: context, 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, {})] }));
+    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/useSignIn.d.ts

@@ -0,0 +1,10 @@
+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 {};