@opexa/portal-components 0.0.235 → 0.0.237

package/dist/components/Promo/PromoContent.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Image from 'next/image';
+import Link from 'next/link';
+import { ChevronLeftIcon } from '../../icons/index.js';
+import { Button, Prose } from '../../ui/index.js';
+export function PromoContent(props) {
+    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"] }), _jsx(Image, { src: "https://s3.ap-east-1.amazonaws.com/opexa-assets.opexasystem.com/assets/BSxIXEsa59_zzMAR27-ALLDAYREBATE06-STATIC-WEB-HB-1920x1080.png", 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", children: "Deposit Now" }), _jsx("h1", { className: "mt-xl text-2xl font-semibold lg:mt-6 lg:text-3xl", children: "Welcome Bonus 100% up to $500 + 10 Free Spins" }), _jsx("p", { className: "text-text-secondary-700 mt-xl lg:mt-6", children: "Ends 5/26/2025, 1:59:59 AM" }), _jsxs(Prose, { className: "mt-2xl lg:mt-6", children: [_jsx("p", { children: "Mi tincidunt elit, id quisque ligula ac diam, amet. Vel etiam suspendisse morbi eleifend faucibus eget vestibulum felis. Dictum quis montes, sit sit. Tellus aliquam enim urna, etiam. Mauris posuere vulputate arcu amet, vitae nisi, tellus tincidunt. At feugiat sapien varius id." }), _jsx("p", { children: "Eget quis mi enim, leo lacinia pharetra, semper. Eget in volutpat mollis at volutpat lectus velit, sed auctor. Porttitor fames arcu quis fusce augue enim. Quis at habitant diam at. Suscipit tristique risus, at donec. In turpis vel et quam imperdiet. Ipsum molestie aliquet sodales id est ac volutpat." }), _jsx("p", { children: "Ipsum sit mattis nulla quam nulla. Gravida id gravida ac enim mauris id. Non pellentesque congue eget consectetur turpis. Sapien, dictum molestie sem tempor. Diam elit, orci, tincidunt aenean tempus. Quis velit eget ut tortor tellus. Sed vel, congue felis elit erat nam nibh orci." }), _jsx("p", { children: "Dolor enim eu tortor urna sed duis nulla. Aliquam vestibulum, nulla odio nisl vitae. In aliquet pellentesque aenean hac vestibulum turpis mi bibendum diam. Tempor integer aliquam in vitae malesuada fringilla." }), _jsx("p", { children: "Elit nisi in eleifend sed nisi. Pulvinar at orci, proin imperdiet commodo consectetur convallis risus. Sed condimentum enim dignissim adipiscing faucibus consequat, urna. Viverra purus et erat auctor aliquam. Risus, volutpat vulputate posuere purus sit congue convallis aliquet. Arcu id augue ut feugiat donec porttitor neque. Mauris, neque ultricies eu vestibulum, bibendum quam lorem id. Dolor lacus, eget nunc lectus in tellus, pharetra, porttitor." }), _jsx("p", { children: "Ipsum sit mattis nulla quam nulla. Gravida id gravida ac enim mauris id. Non pellentesque congue eget consectetur turpis. Sapien, dictum molestie sem tempor. Diam elit, orci, tincidunt aenean tempus. Quis velit eget ut tortor tellus. Sed vel, congue felis elit erat nam nibh orci." }), _jsx("h5", { children: "General Conditions:" }), _jsx("p", { children: "Mi tincidunt elit, id quisque ligula ac diam, amet. Vel etiam suspendisse morbi eleifend faucibus eget vestibulum felis. Dictum quis montes, sit sit. Tellus aliquam enim urna, etiam. Mauris posuere vulputate arcu amet, vitae nisi, tellus tincidunt. At feugiat sapien varius id." }), _jsx("p", { children: "Eget quis mi enim, leo lacinia pharetra, semper. Eget in volutpat mollis at volutpat lectus velit, sed auctor. Porttitor fames arcu quis fusce augue enim. Quis at habitant diam at. Suscipit tristique risus, at donec. In turpis vel et quam imperdiet. Ipsum molestie aliquet sodales id est ac volutpat." })] }), _jsxs(Prose, { className: "bg-bg-secondary mt-xl rounded-2xl p-2xl lg:mt-16 lg:p-4xl", children: [_jsx("h2", { children: "Conclusion" }), _jsx("p", { children: "Morbi sed imperdiet in ipsum, adipiscing elit dui lectus. Tellus id scelerisque est ultricies ultricies. Duis est sit sed leo nisl, blandit elit sagittis. Quisque tristique consequat quam sed. Nisl at scelerisque amet nulla purus habitasse." }), _jsx("p", { children: "Nunc sed faucibus bibendum feugiat sed interdum. Ipsum egestas condimentum mi massa. In tincidunt pharetra consectetur sed duis facilisis metus. Etiam egestas in nec sed et. Quis lobortis at sit dictum eget nibh tortor commodo cursus." }), _jsx("p", { children: "Odio felis sagittis, morbi feugiat tortor vitae feugiat fusce aliquet. Nam elementum urna nisi aliquet erat dolor enim. Ornare id morbi eget ipsum. Aliquam senectus neque ut id eget consectetur dictum. Donec posuere pharetra odio consequat scelerisque et, nunc tortor." })] })] }));
+}

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

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

package/dist/components/Promos/PromoCarousel.js

@@ -0,0 +1,41 @@
+'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 { twMerge } from 'tailwind-merge';
+import { 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) {
+    const promosQuery = usePromosQuery({});
+    const promos = promosQuery.data || [];
+    const [emblaRef, emblaApi] = useEmblaCarousel({
+        align: 'start',
+        slidesToScroll: 1,
+        breakpoints: {
+            '(min-width: 1024px)': {
+                slidesToScroll: 3,
+            },
+        },
+    });
+    const [prevBtnDisabled, setPrevBtnDisabled] = useState(true);
+    const [nextBtnDisabled, setNextBtnDisabled] = useState(true);
+    const onPrevButtonClick = useCallback(() => emblaApi?.scrollPrev(), [emblaApi]);
+    const onNextButtonClick = useCallback(async () => {
+        emblaApi?.scrollNext();
+    }, [emblaApi]);
+    const onSelect = useCallback((emblaApi) => {
+        setPrevBtnDisabled(!emblaApi?.canScrollPrev());
+        setNextBtnDisabled(!emblaApi?.canScrollNext());
+    }, []);
+    useEffect(() => {
+        if (!emblaApi)
+            return;
+        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-[calc((100%-(0.375rem*2))/1)] grid-flow-col gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/3)] lg:gap-md'), children: promos.map((promo) => (_jsx(PromosItem, { promo: promo, shouldShowDescription: props.shouldShowDescription }, promo.id))) }) }))] }));
+}

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

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

package/dist/components/Promos/PromoGrid.js

@@ -0,0 +1,12 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { twMerge } from 'tailwind-merge';
+import { usePromosQuery } from '../../client/hooks/index.js';
+import { Gift01Icon } from '../../icons/index.js';
+import { Empty } from '../Empty.js';
+import { PromosItem } from './PromoItem.js';
+export function PromoGrid(props) {
+    const promosQuery = usePromosQuery({});
+    const promos = promosQuery.data || [];
+    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" })] }), promos.length <= 0 && (_jsx(Empty, { icon: Gift01Icon, title: "No Promos", message: "No promo is currently available.", className: "mt-lg" })), promos.length >= 1 && (_jsx("div", { className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid grid-cols-1 gap-sm lg:grid-cols-3 lg:gap-md'), children: promos.map((promo) => (_jsx(PromosItem, { promo: promo, shouldShowDescription: props.shouldShowDescription }, promo.id))) }) }))] }));
+}

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

@@ -0,0 +1,7 @@
+import type { Promo } from '@opexa/portal-sdk-core';
+interface PromosItemProps {
+    promo: Promo;
+    shouldShowDescription?: boolean;
+}
+export declare function PromosItem(props: PromosItemProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Promos/PromoItem.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Image from 'next/image';
+import { useRouter } from 'next/navigation';
+import { twJoin } from 'tailwind-merge';
+import { Button } from '../../ui/index.js';
+export function PromosItem(props) {
+    const { promo } = props;
+    const router = useRouter();
+    return (_jsxs("div", { className: "border-border-primary bg-accent-50 relative flex h-full flex-col rounded-md border", children: [promo.banner.url && (_jsx(Image, { src: promo.banner.url, alt: promo.name, width: 1200, height: 500, priority: true, className: "aspect-[1200/500] w-full rounded-t-md object-cover" })), _jsxs("div", { className: "flex flex-grow flex-col p-4", children: [_jsx("p", { className: twJoin('w-full text-xl font-bold', props.shouldShowDescription ? 'text-start' : 'text-center'), children: promo.name }), props.shouldShowDescription && promo.description && (_jsx("p", { className: "text-gray-600 mb-2 line-clamp-2 w-full overflow-hidden text-start text-sm", dangerouslySetInnerHTML: { __html: promo.description } })), _jsx("div", { className: "mt-auto pt-4", children: _jsx(Button, { className: "w-full text-sm font-semibold", onClick: () => router.push(`/promos/${promo.id}`), children: "Get Bonus" }) })] })] }, promo.id));
+}

package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuest.d.ts

@@ -1,4 +1,4 @@
-import type { Quest } from '@opexa/portal-sdk-core';
+import type { Quest } from '../../../types';
 export declare function DailyCheckInQuest({ quest }: {
     quest: Quest;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuest.js

@@ -3,11 +3,16 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { addDays, isEqual, startOfDay } from 'date-fns';
 import { useState } from 'react';
 import { twMerge } from 'tailwind-merge';
-import { useCheckInDailyCheckInQuestMutation } from '../../../client/hooks/index.js';
-import { toaster } from '../../../client/utils/index.js';
-import { CalendarIcon, CheckIcon, ClockStopWatchIcon, InfoCircleIcon, } from '../../../icons/index.js';
-import { Badge, Button } from '../../../ui/index.js';
-import { getAvailableQuestsQueryKey, getQueryClient } from '../../../utils/index.js';
+import { useCheckInDailyCheckInQuestMutation } from '../../../client/hooks/useCheckInDailyCheckInQuestMutation.js';
+import { toaster } from '../../../client/utils/toaster.js';
+import { CalendarIcon } from '../../../icons/CalendarIcon.js';
+import { CheckIcon } from '../../../icons/CheckIcon.js';
+import { ClockStopWatchIcon } from '../../../icons/ClockStopWatchIcon.js';
+import { InfoCircleIcon } from '../../../icons/InfoCircleIcon.js';
+import { Badge } from '../../../ui/Badge/index.js';
+import { Button } from '../../../ui/Button/index.js';
+import { getQueryClient } from '../../../utils/getQueryClient.js';
+import { getAvailableQuestsQueryKey } from '../../../utils/queryKeys.js';
 import CountdownTimer from '../CountdownTimer.js';
 import { DailyCheckInQuestModal } from './DailyCheckInQuestModal.js';
 export function DailyCheckInQuest({ quest }) {

package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuestModal.js

@@ -1,8 +1,9 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Portal } from '@ark-ui/react';
-import { XIcon } from '../../../icons/index.js';
-import { Button, Dialog } from '../../../ui/index.js';
+import { XIcon } from '../../../icons/XIcon.js';
+import { Button } from '../../../ui/Button/index.js';
+import { Dialog } from '../../../ui/Dialog/index.js';
+import { Portal } from '../../../ui/Portal/index.js';
 export function DailyCheckInQuestModal(props) {
     return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: props.modalState.isOpen, onOpenChange: ({ open }) => props.modalState.setIsOpen(open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("p", { className: "text-text-primary-900 text-lg font-semibold", children: "Daily Check-In Rules" }), _jsxs("ul", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn rewards just for checking in each day!" }), _jsx("li", { children: "Stay consistent to unlock special rewards on the 3rd, 5th, and 7th day." }), _jsx("li", { children: "Missing a day will reset your streak, starting again from Day 1." }), _jsx("li", { children: "Each check-in unlocks the next one on the following day." }), _jsx("li", { children: "Successfully check in for 7 consecutive days to complete the quest and reset the cycle." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => props.modalState.setIsOpen(false), children: "Ok" }) })] }) })] }) }));
 }

package/dist/components/Quests/DailyCheckInQuest.js

@@ -91,5 +91,5 @@ function Rules(props) {
         defaultValue: props.defaultOpen ?? false,
         onChange: props.onOpenChange,
     });
-    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("h2", { className: "text-text-primary-900 text-lg font-semibold", children: "Daily Check-In Rules" }), _jsxs("ol", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn rewards just for checking in each day!" }), _jsx("li", { children: "Stay consistent to unlock special rewards on the 3rd, 5th, and 7th day." }), _jsx("li", { children: "Missing a day will reset your streak, starting again from Day 1." }), _jsx("li", { children: "Each check-in unlocks the next one on the following day." }), _jsx("li", { children: "Successfully check in for 7 consecutive days to complete the quest and reset the cycle." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => setOpen(false), children: "Ok" }) })] }) })] }) }));
+    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5 overflow-y-auto", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("h2", { className: "text-text-primary-900 text-lg font-semibold", children: "Daily Check-In Rules" }), _jsxs("ol", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn rewards just for checking in each day!" }), _jsx("li", { children: "Stay consistent to unlock special rewards on the 3rd, 5th, and 7th day." }), _jsx("li", { children: "Missing a day will reset your streak, starting again from Day 1." }), _jsx("li", { children: "Each check-in unlocks the next one on the following day." }), _jsx("li", { children: "Successfully check in for 7 consecutive days to complete the quest and reset the cycle." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => setOpen(false), children: "Ok" }) })] }) })] }) }));
 }

package/dist/components/Quests/OnboardingQuest/OnboardingQuest.d.ts

@@ -1,4 +1,4 @@
-import type { Quest } from '@opexa/portal-sdk-core';
+import type { Quest } from '../../../types';
 export declare function OnboardingQuest(props: {
     quest: Quest;
 }): null;

package/dist/components/Quests/OnboardingQuest.js

@@ -47,5 +47,5 @@ function Rules(props) {
         defaultValue: props.defaultOpen ?? false,
         onChange: props.onOpenChange,
     });
-    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("h2", { className: "text-text-primary-900 text-lg font-semibold", children: "Welcome Quest Rules" }), _jsxs("ol", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Begin your quest whenever you're ready" }), _jsx("li", { children: "Tackle the tasks in any order you like" }), _jsx("li", { children: "Finish all tasks and we'll credit your reward automatically!" })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => setOpen(false), children: "Ok" }) })] }) })] }) }));
+    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5 overflow-y-auto", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("h2", { className: "text-text-primary-900 text-lg font-semibold", children: "Welcome Quest Rules" }), _jsxs("ol", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Begin your quest whenever you're ready" }), _jsx("li", { children: "Tackle the tasks in any order you like" }), _jsx("li", { children: "Finish all tasks and we'll credit your reward automatically!" })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => setOpen(false), children: "Ok" }) })] }) })] }) }));
 }

package/dist/components/Quests/WageringQuest/WageringQuest.d.ts

@@ -1,4 +1,4 @@
-import type { Quest } from '@opexa/portal-sdk-core';
+import type { Quest } from '../../../types';
 export declare function WageringQuest({ quest }: {
     quest: Quest;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/Quests/WageringQuest/WageringQuest.js

@@ -2,8 +2,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
 import { twMerge } from 'tailwind-merge';
-import { ClockStopWatchIcon, InfoCircleIcon } from '../../../icons/index.js';
-import { Badge } from '../../../ui/index.js';
+import { ClockStopWatchIcon } from '../../../icons/ClockStopWatchIcon.js';
+import { InfoCircleIcon } from '../../../icons/InfoCircleIcon.js';
+import { Badge } from '../../../ui/Badge/index.js';
 import CountdownTimer from '../CountdownTimer.js';
 import { WageringQuestModal } from './WageringQuestModal.js';
 export function WageringQuest({ quest }) {

package/dist/components/Quests/WageringQuest/WageringQuestModal.js

@@ -1,8 +1,9 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Portal } from '@ark-ui/react';
-import { XIcon } from '../../../icons/index.js';
-import { Button, Dialog } from '../../../ui/index.js';
+import { XIcon } from '../../../icons/XIcon.js';
+import { Button } from '../../../ui/Button/index.js';
+import { Dialog } from '../../../ui/Dialog/index.js';
+import { Portal } from '../../../ui/Portal/index.js';
 export function WageringQuestModal(props) {
     return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: props.modalState.isOpen, onOpenChange: ({ open }) => props.modalState.setIsOpen(open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("p", { className: "text-text-primary-900 text-lg font-semibold", children: props.questName }), _jsxs("ul", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn extra rewards just by playing Slots, every bet counts, win or lose!" }), _jsx("li", { children: "Reach the wagering requirement in bets to complete the quest and claim your reward." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => props.modalState.setIsOpen(false), children: "Ok" }) })] }) })] }) }));
 }

package/dist/components/Quests/WageringQuest.js

@@ -32,5 +32,5 @@ function Rules(props) {
         defaultValue: props.defaultOpen ?? false,
         onChange: props.onOpenChange,
     });
-    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("h2", { className: "text-text-primary-900 text-lg font-semibold", children: quest.name }), _jsxs("ol", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn extra rewards just by playing Slots, every bet counts, win or lose!" }), _jsx("li", { children: "Reach the wagering requirement in bets to complete the quest and claim your reward." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => setOpen(false), children: "Ok" }) })] }) })] }) }));
+    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5 overflow-y-auto", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("h2", { className: "text-text-primary-900 text-lg font-semibold", children: quest.name }), _jsxs("ol", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn extra rewards just by playing Slots, every bet counts, win or lose!" }), _jsx("li", { children: "Reach the wagering requirement in bets to complete the quest and claim your reward." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => setOpen(false), children: "Ok" }) })] }) })] }) }));
 }

package/dist/components/Search/Search.lazy.js

@@ -67,7 +67,7 @@ export function Search(props) {
     return (_jsx(Dialog.Root, { open: globalStore.search.open, onOpenChange: (details) => {
             globalStore.search.setOpen(details.open);
             setSearch('');
-        }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "bg-bg-primary lg:min-h-auto mx-auto min-h-full w-full pt-xl lg:mt-[132px] lg:max-w-[1136px] lg:bg-unset lg:pt-0", children: [_jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "flex items-center justify-between px-4 lg:hidden", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 40, className: "h-8 w-auto" }), _jsx(IconButton, { size: "sm", colorScheme: "gray", onClick: () => api.setOpen(false), children: _jsx(XIcon, { className: "text-text-quinary size-6" }) })] })) }), _jsx("div", { className: "flex justify-end", children: _jsx(Dialog.Context, { children: (api) => (_jsx("button", { type: "button", onClick: () => api.setOpen(false), className: "hidden size-9 items-center justify-center rounded-md bg-white/20 lg:flex", children: _jsx(XIcon, { className: "size-5 text-white" }) })) }) }), _jsx("div", { className: "mt-2xl px-4 lg:mt-xl lg:px-0", children: _jsxs("div", { className: "relative", children: [_jsx(SearchLgIcon, { className: "text-text-quinary pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2" }), _jsx(DebouncedInput, { ref: inputRef, value: search, placeholder: props.placeholder ?? 'Search', onChange: setSearch }), _jsx(Presence, { present: search.length > 0, asChild: true, lazyMount: true, children: _jsx("button", { type: "button", className: "text-text-secondary-700 absolute right-3.5 top-1/2 -translate-y-1/2 font-semibold", onClick: () => {
+        }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "bg-bg-primary lg:min-h-auto mx-auto min-h-full w-full pt-xl lg:mt-[132px] lg:max-w-[1136px] lg:bg-unset lg:pt-0 overflow-y-auto", children: [_jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "flex items-center justify-between px-4 lg:hidden", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 40, className: "h-8 w-auto" }), _jsx(IconButton, { size: "sm", colorScheme: "gray", onClick: () => api.setOpen(false), children: _jsx(XIcon, { className: "text-text-quinary size-6" }) })] })) }), _jsx("div", { className: "flex justify-end", children: _jsx(Dialog.Context, { children: (api) => (_jsx("button", { type: "button", onClick: () => api.setOpen(false), className: "hidden size-9 items-center justify-center rounded-md bg-white/20 lg:flex", children: _jsx(XIcon, { className: "size-5 text-white" }) })) }) }), _jsx("div", { className: "mt-2xl px-4 lg:mt-xl lg:px-0", children: _jsxs("div", { className: "relative", children: [_jsx(SearchLgIcon, { className: "text-text-quinary pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2" }), _jsx(DebouncedInput, { ref: inputRef, value: search, placeholder: props.placeholder ?? 'Search', onChange: setSearch }), _jsx(Presence, { present: search.length > 0, asChild: true, lazyMount: true, children: _jsx("button", { type: "button", className: "text-text-secondary-700 absolute right-3.5 top-1/2 -translate-y-1/2 font-semibold", onClick: () => {
                                                     setSearch('');
                                                     inputRef.current?.focus();
                                                 }, children: "Clear" }) })] }) }), _jsx("div", { className: "lg:bg-bg-primary lg:border-border-primary mt-2xl p-xl pb-3xl lg:mt-2 lg:max-h-[41rem] lg:overflow-y-auto lg:rounded-xl lg:border", children: search.length <= 0 ? (_jsx(Alert, { message: "Search for your favorite game or provider." })) : search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [empty && _jsx(Alert, { message: "No results found" }), !empty && (_jsxs(_Fragment, { children: [gameProviders.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "text-lg font-semibold", children: "Providers" }), _jsx("div", { className: "mb-3xl mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: gameProviders.map((provider) => (_jsx(Link, { href: viewGamesUrl(provider), "aria-label": `View ${provider.name} games`, className: twMerge('bg-brand-800 flex h-14 w-full items-center rounded-md', classNames.providerThumbnailRoot), onClick: () => {

package/dist/components/SignIn/SignIn.lazy.js

@@ -15,5 +15,5 @@ export function SignIn(props) {
     const signInStore = useGlobalStore(useShallow((ctx) => ctx.signIn));
     return (_jsx(SignInPropsProvider, { value: props, children: _jsx(SignInProvider, { 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: twMerge('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', props.className), 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, {})] }) })] }) }) }) }));
+                }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-[400px] lg:rounded-xl overflow-y-auto', props.className), 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/SignUp/SignUpDefault/SignUp.lazy.js

@@ -14,5 +14,5 @@ export function SignUp(props) {
     const signUpStore = useGlobalStore(useShallow((ctx) => ctx.signUp));
     return (_jsx(SignUpPropsProvider, { value: props, children: _jsx(Dialog.Root, { open: signUpStore.open, onOpenChange: (details) => {
                 signUpStore.setOpen(details.open);
-            }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-[400px] lg:rounded-xl', props.className), 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, {}) })] }) })] }) }) }));
+            }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-[400px] lg:rounded-xl overflow-y-auto', props.className), 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.js

@@ -46,6 +46,9 @@ export function SignUpForm() {
         itemToValue: (item) => item.code,
         itemToString: (item) => `${item.code} - ${item.name}`,
     });
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        kyc: ctx.kyc,
+    })));
     const [step, setStep] = useState(1);
     const dialog = useDialogContext();
     const search = useSearchParams();
@@ -192,6 +195,7 @@ export function SignUpForm() {
                                     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);
@@ -238,6 +242,7 @@ export function SignUpForm() {
                                 dialog.setOpen(false);
                                 step1Form.reset();
                                 step2Form.reset();
+                                globalStore.kyc.setOpen(true);
                                 setStep(1);
                             }
                             catch (error) {
@@ -251,7 +256,7 @@ export function SignUpForm() {
                                                 o.field.onChange(details.value);
                                             }, onValueComplete: () => {
                                                 form2Ref.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: "text-text-placeholder-subtle text-2xl font-medium", children: "\u2013" }), _jsx(PinInput.Input, { index: 3 }), _jsx(PinInput.Input, { index: 4 }), _jsx(PinInput.Input, { index: 5 })] }), _jsx(PinInput.HiddenInput, {})] }), _jsx(Field.ErrorText, { children: o.formState.errors.verificationCode?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: step2Form.formState.isSubmitting, children: "Verify" }), _jsxs("div", { className: "mt-3 flex w-full items-center justify-center gap-xs text-sm", children: [_jsx("span", { className: "text-text-secondary-700", children: "Didn't recieve the code?" }), _jsx("button", { type: "button", className: "text-button-secondary-fg font-semibold disabled:cursor-not-allowed disabled:opacity-75", disabled: cooldown.cooling, onClick: async () => {
+                                            }, children: [_jsxs(PinInput.Control, { className: "grid-cols-[1fr_1fr_1fr_auto_1fr_1fr_1fr] items-center gap-md", children: [_jsx(PinInput.Input, { index: 0 }), _jsx(PinInput.Input, { index: 1 }), _jsx(PinInput.Input, { index: 2 }), _jsx("span", { className: "text-text-placeholder-subtle text-2xl font-medium", children: "\u2013" }), _jsx(PinInput.Input, { index: 3 }), _jsx(PinInput.Input, { index: 4 }), _jsx(PinInput.Input, { index: 5 })] }), _jsx(PinInput.HiddenInput, {})] }), _jsx(Field.ErrorText, { children: o.formState.errors.verificationCode?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: step2Form.formState.isSubmitting, children: "Verify" }), _jsxs("div", { className: "mt-3 flex w-full items-center justify-center gap-xs text-sm", children: [_jsx("span", { className: "text-text-secondary-700", children: "Didn't recieve the code?" }), _jsx("button", { type: "button", className: "text-button-secondary-fg font-semibold disabled:cursor-not-allowed disabled:opacity-75", disabled: cooldown.cooling, onClick: async () => {
                                             await sendVerificationCodeMutation.mutateAsync({
                                                 channel: 'SMS',
                                                 recipient: mobileNumberParser.format(step1Form.getValues('mobileNumber')),

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

@@ -188,7 +188,7 @@ export function CaptureIdDocument() {
         }
         startCamera();
     }
-    return (_jsx(Dialog.Root, { open: props.capturing === 'ID_DOCUMENT', lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-fit lg:rounded-xl', props.className), children: _jsxs("div", { className: "w-full p-4 lg:w-[640px] lg:px-12 lg:py-4xl", children: [_jsxs("button", { type: "button", className: "flex items-center gap-lg lg:absolute lg:right-5 lg:top-5 lg:p-md", onClick: () => {
+    return (_jsx(Dialog.Root, { open: props.capturing === 'ID_DOCUMENT', lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-fit lg:rounded-xl overflow-y-auto', props.className), children: _jsxs("div", { className: "w-full p-4 lg:w-[640px] lg:px-12 lg:py-4xl", children: [_jsxs("button", { type: "button", className: "flex items-center gap-lg lg:absolute lg:right-5 lg:top-5 lg:p-md", onClick: () => {
                                         stopCamera();
                                         props.setCapturing(null);
                                     }, children: [_jsx(XIcon, { className: "text-text-senary-300 hidden size-5 lg:block" }), _jsx(ArrowLeftIcon, { className: "text-text-senary-300 size-5 lg:hidden" }), _jsx("span", { className: "text-lg font-semibold lg:hidden", children: "Back" })] }), _jsx(Dialog.Title, { className: "mt-6 text-center text-lg font-semibold lg:mt-0", children: "Take a Picture of Your Front ID" }), _jsxs(Dialog.Description, { className: "lg:max-w-auto text-text-tertiary-600 mx-auto mt-sm max-w-[19rem] text-center text-sm lg:max-w-full", children: ["Make sure your ID is clearly visible, well-lit, and not blurry.", _jsx("br", { className: "hidden lg:block" }), " Avoid glare or reflections, and ensure all corners are within the frame."] }), _jsx("div", { id: "parent", className: "border-border-disabled mt-6 aspect-video rounded-xl border bg-black lg:mt-8", children: cameraError ? (_jsx("div", { className: "flex h-full items-center justify-center p-4", children: _jsxs("div", { className: "text-center", children: [_jsx("p", { className: "text-red-500 mb-2 text-sm", children: "Camera Error" }), _jsx("p", { className: "text-gray-400 text-xs", children: cameraError })] }) })) : captureInProgress ? (_jsxs("div", { className: "relative flex h-fit w-full flex-col items-center justify-center", children: [_jsx("video", { ref: videoElement, autoPlay: true, muted: true, playsInline: true, className: "relative h-[60vh] w-full rounded-lg object-cover md:aspect-video md:max-h-[333px]", width: "100%", height: "100%" }), _jsxs("div", { className: "pointer-events-none absolute inset-0 z-50", children: [_jsx("div", { className: twMerge('absolute inset-0 w-full bg-black/60 backdrop-blur-sm [clip-path:polygon(0%_0%,0%_100%,calc(50%-158px)_100%,calc(50%-158px)_calc(50%-100px),calc(50%+158px)_calc(50%-100px),calc(50%+158px)_calc(50%+100px),calc(50%-158px)_calc(50%+100px),calc(50%-158px)_100%,100%_100%,100%_0%)] md:[clip-path:polygon(0%_0%,0%_100%,calc(50%-225px)_100%,calc(50%-225px)_calc(50%-142px),calc(50%+225px)_calc(50%-142px),calc(50%+225px)_calc(50%+142px),calc(50%-225px)_calc(50%+142px),calc(50%-225px)_100%,100%_100%,100%_0%)]') }), _jsx("div", { className: "absolute inset-0 z-[60] mx-auto flex items-center justify-center", children: _jsx("div", { className: "relative aspect-[1011/638] h-[200px] md:h-[295px] md:w-[450px]", children: _jsx("div", { className: "h-full w-full rounded-lg border-4 border-dashed border-[#B54708]" }) }) })] })] })) : (_jsx("div", { ref: containerRef, className: "relative grid h-full w-full place-items-center rounded-lg object-contain md:max-h-[333px]" })) }), cameraError ? (_jsx("div", { className: "mt-4 text-center", children: _jsx(Button, { className: "mx-auto px-xl lg:w-fit", onClick: () => {

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

@@ -244,7 +244,7 @@ export function CaptureSelfie() {
             }
         };
     }, []);
-    return (_jsx(Dialog.Root, { open: props.capturing === 'SELFIE', lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-fit lg:rounded-xl', props.className), children: _jsxs("div", { className: "w-full p-4 lg:w-[640px] lg:px-12 lg:py-4xl", children: [_jsxs("button", { type: "button", className: "flex items-center gap-lg lg:absolute lg:right-5 lg:top-5 lg:p-md", onClick: () => {
+    return (_jsx(Dialog.Root, { open: props.capturing === 'SELFIE', lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('bg-bg-primary-alt mx-auto h-full w-full items-start p-3xl pb-4xl lg:h-auto lg:w-fit lg:rounded-xl overflow-y-auto', props.className), children: _jsxs("div", { className: "w-full p-4 lg:w-[640px] lg:px-12 lg:py-4xl", children: [_jsxs("button", { type: "button", className: "flex items-center gap-lg lg:absolute lg:right-5 lg:top-5 lg:p-md", onClick: () => {
                                         stopCamera();
                                         props.setCapturing(null);
                                     }, children: [_jsx(XIcon, { className: "text-text-senary-300 hidden size-5 lg:block" }), _jsx(ArrowLeftIcon, { className: "text-text-senary-300 size-5 lg:hidden" }), _jsx("span", { className: "text-lg font-semibold lg:hidden", children: "Back" })] }), _jsx(Dialog.Title, { className: "mt-6 text-center text-lg font-semibold lg:mt-0", children: "Take a Selfie Holding Your ID" }), _jsx(Dialog.Description, { className: "text-text-tertiary-600 mx-auto mt-sm max-w-[19rem] text-center text-sm lg:max-w-full", children: "Make sure your face and ID are clearly visible, with no glare or blur." }), _jsx("div", { id: "parent", className: "border-border-disabled mt-6 aspect-video rounded-xl border bg-black lg:mt-8", children: captureInProgress ? (_jsxs("div", { className: "relative flex h-fit w-full flex-col items-center justify-center", children: [_jsx("video", { ref: videoRef, autoPlay: true, muted: true, className: "h-[60vh] w-full rounded-lg object-cover md:aspect-video md:h-[333px]", width: "100%", height: "100%" }), _jsx("canvas", { ref: faceCanvasRef, className: "absolute inset-0 h-[60vh] w-full object-cover md:aspect-video md:h-[333px] md:object-contain", width: "100%", height: "100%" }), isCapturing && (_jsx("span", { className: "absolute inset-x-0 bottom-8 flex items-center justify-center text-5xl font-bold text-[#713B12CC] md:bottom-4", children: countdown })), !isFaceCentered && (_jsx("span", { className: "absolute inset-x-0 bottom-12 mx-auto w-1/2 text-center text-xs text-white md:bottom-3", children: "Please center your face in the camera view. Make sure your ID is clearly visible next to your face." })), _jsx(PersonOverlayDesktop, { isFaceCentered: isFaceCentered, width: videoRef.current?.clientWidth || 543, height: videoRef.current?.clientHeight || 333 })] })) : (selectedImage && (_jsx("img", { src: selectedImage, alt: "Captured Photo", className: "h-full w-full rounded-lg object-cover md:aspect-video md:h-[333px]" }))) }), selectedImage && (_jsxs("div", { className: "flex flex-col items-center justify-center gap-2 md:flex-row", children: [_jsxs(Button, { className: "disabled:bg-bg-disabled disabled:text-text-disabled mx-auto mt-4 px-xl disabled:opacity-100", size: "sm", onClick: retakePhoto, type: "button", children: ["Retake Photo", _jsx(Camera01Icon, { className: "size-5" })] }), _jsxs(Button, { className: "disabled:bg-bg-disabled disabled:text-text-disabled mx-auto mt-4 px-xl disabled:opacity-100", size: "sm", onClick: usePhoto, type: "button", children: ["Use Photo", _jsx(Camera01Icon, { className: "size-5" })] })] })), !captureInProgress && (_jsxs(Button, { className: twMerge('mx-auto mt-6 px-xl lg:mt-8', selectedImage && 'hidden'), onClick: startCamera, disabled: !modelsLoaded, type: "button", children: ["Start Camera", _jsx(Camera01Icon, { className: "size-5" })] }))] }) }) })] }) }));

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

@@ -22,5 +22,5 @@ export function SignUpKYC(props) {
     };
     return (_jsx(SignUpKYCPropsProvider, { value: value, children: _jsx(Dialog.Root, { open: signUpStore.open, onOpenChange: (details) => {
                 signUpStore.setOpen(details.open);
-            }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('bg-bg-primary-alt z-banner mx-auto flex h-full w-full flex-col items-start overflow-y-auto p-3xl pb-4xl lg:h-auto lg:w-fit lg:rounded-xl', props.className), children: _jsxs("div", { className: "h-full w-full lg:w-[400px]", children: [_jsx(CaptureIdDocument, {}), _jsx(CaptureSelfie, {}), _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(SignUpFormKYC, {}) })] }) }) })] }) }) }));
+            }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('bg-bg-primary-alt z-banner mx-auto flex h-full w-full flex-col items-start overflow-y-auto p-3xl pb-4xl lg:h-auto lg:w-fit lg:rounded-xl ', props.className), children: _jsxs("div", { className: "h-full w-full lg:w-[400px]", children: [_jsx(CaptureIdDocument, {}), _jsx(CaptureSelfie, {}), _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(SignUpFormKYC, {}) })] }) }) })] }) }) }));
 }

package/dist/components/Tournaments/TournamentsList/TournamentsListItemRules.js

@@ -6,5 +6,5 @@ import { Portal } from '../../../ui/Portal/index.js';
 import { useTournamentsListItemContext } from './TournamentsListContext.js';
 export function TournamentsListItemRules(props) {
     const tournament = useTournamentsListItemContext();
-    return (_jsxs(Dialog.Root, { lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: [_jsx(Dialog.Trigger, { asChild: true, children: props.children ?? (_jsx("button", { type: "button", className: "text-button-tertiary-fg flex text-sm font-semibold", children: "Tournament Rules" })) }), _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "mx-auto h-full w-full items-start lg:h-auto lg:w-[640px] lg:rounded-xl", children: [_jsxs("div", { className: "p-3xl", children: [_jsxs("div", { className: "mb-3 flex justify-between", children: [_jsx("div", { className: "bg-bg-tertiary border-border-primary flex h-12 w-12 items-center justify-center rounded-lg border", children: _jsx(Flag06Icon, { className: "text-text-tertiary-600 size-full p-3" }) }), _jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) })] }), _jsx("div", { className: "text-text-primary-900 text-lg font-semibold", children: "Tournament Rules" }), _jsx("div", { className: "text-text-tertiary-600 mt-1 text-sm", children: "Terms and Conditions" })] }), _jsx("div", { className: "border-gray-800 border-t-1 pb-3", children: _jsx("div", { dangerouslySetInnerHTML: { __html: tournament.description }, className: "px-3xl py-3" }) })] }) })] })] }));
+    return (_jsxs(Dialog.Root, { lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: [_jsx(Dialog.Trigger, { asChild: true, children: props.children ?? (_jsx("button", { type: "button", className: "text-button-tertiary-fg flex text-sm font-semibold", children: "Tournament Rules" })) }), _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "mx-auto h-full w-full items-start lg:h-auto lg:w-[640px] lg:rounded-xl overflow-y-auto", children: [_jsxs("div", { className: "p-3xl", children: [_jsxs("div", { className: "mb-3 flex justify-between", children: [_jsx("div", { className: "bg-bg-tertiary border-border-primary flex h-12 w-12 items-center justify-center rounded-lg border", children: _jsx(Flag06Icon, { className: "text-text-tertiary-600 size-full p-3" }) }), _jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) })] }), _jsx("div", { className: "text-text-primary-900 text-lg font-semibold", children: "Tournament Rules" }), _jsx("div", { className: "text-text-tertiary-600 mt-1 text-sm", children: "Terms and Conditions" })] }), _jsx("div", { className: "border-gray-800 border-t-1 pb-3", children: _jsx("div", { dangerouslySetInnerHTML: { __html: tournament.description }, className: "px-3xl py-3" }) })] }) })] })] }));
 }

package/dist/components/shared/IdDocumentField.d.ts

@@ -1,13 +1,10 @@
-import { type CSSProperties, type Ref } from 'react';
+import { type CSSProperties, type RefObject } from 'react';
 import { type ValidateFileError } from '../../utils/validateFile';
-export interface IdDocumentFieldProps {
-    ref?: Ref<HTMLDivElement>;
+export interface IdDocumentFieldProps extends UseIdDocumentFieldProps {
+    ref?: RefObject<HTMLDivElement | null>;
     id?: string;
     style?: CSSProperties;
     className?: string;
-    value?: string;
-    onChange?: (value: string) => void;
-    defaultValue?: string;
     invalid?: boolean;
     readOnly?: boolean;
     disabled?: boolean;
@@ -15,3 +12,14 @@ export interface IdDocumentFieldProps {
     onError?: (error: ValidateFileError) => void;
 }
 export declare function IdDocumentField(props: IdDocumentFieldProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * -------------------------------------
+ *  Context
+ * -------------------------------------
+ */
+interface UseIdDocumentFieldProps {
+    value?: string;
+    onChange?: (value: string) => void;
+    defaultValue?: string;
+}
+export {};