@opexa/portal-components 0.0.277 → 0.0.279

package/dist/client/hooks/useGlobalStore.d.ts

@@ -26,16 +26,12 @@ export interface GameLaunchStore {
     setDetails: (details: GameLaunchStore__Details) => void;
     '~touched': boolean;
 }
-export interface SearchStore extends PopupStore {
-}
 export type MessagesStore__Tab = 'ALL' | 'UNREAD';
 export interface MessagesStore extends PopupStore {
     tab: MessagesStore__Tab;
     setTab: (tab: MessagesStore__Tab) => void;
 }
 export interface MessageStore extends PopupStore {
-    open: boolean;
-    setOpen: (open: boolean) => void;
     data: Message | null;
     setData: (data: Message | null) => void;
 }
@@ -46,14 +42,25 @@ export interface DepositWithdrawalStore extends PopupStore {
     promo: string | null;
     setPromo: (promo: string | null) => void;
 }
-interface GlobalStore {
+type TermsAndConditionsAction = 'SIGN_IN' | 'SIGN_UP' | 'DISCLAIMER';
+export interface TermsAndConditionsStore extends PopupStore {
+    next: TermsAndConditionsAction | null;
+    setNext: (next: TermsAndConditionsAction | null) => void;
+    accepted: boolean;
+    setAccepted: (accepted: boolean) => void;
+}
+export interface TermsOfUseStore extends TermsAndConditionsStore {
+}
+export interface ResponsibleGamingStore extends TermsAndConditionsStore {
+}
+export interface GlobalStore {
     signUp: PopupStore;
     signIn: PopupStore;
     forgotPassword: PopupStore;
     disclaimer: PopupStore;
     depositWithdrawal: DepositWithdrawalStore;
     gameLaunch: GameLaunchStore;
-    search: SearchStore;
+    search: PopupStore;
     account: PopupStore;
     account__mobile: PopupStore;
     messages: MessagesStore;
@@ -63,6 +70,9 @@ interface GlobalStore {
     kyc: PopupStore;
     kycReminder: PopupStore;
     spotBonus: PopupStore;
+    termsAndConditions: TermsAndConditionsStore;
+    termsOfUse: TermsOfUseStore;
+    responsibleGaming: ResponsibleGamingStore;
 }
 export declare const useGlobalStore: import("zustand").UseBoundStore<import("zustand").StoreApi<GlobalStore>>;
 export {};

package/dist/client/hooks/useGlobalStore.js

@@ -272,4 +272,103 @@ export const useGlobalStore = create((set) => ({
         },
         '~touched': false,
     },
+    termsAndConditions: {
+        open: false,
+        setOpen(open) {
+            set((prev) => ({
+                termsAndConditions: {
+                    ...prev.termsAndConditions,
+                    open,
+                    '~touched': true,
+                },
+            }));
+        },
+        next: null,
+        setNext(next) {
+            set((prev) => ({
+                termsAndConditions: {
+                    ...prev.termsAndConditions,
+                    next,
+                    '~touched': true,
+                },
+            }));
+        },
+        accepted: false,
+        setAccepted(accepted) {
+            set((prev) => ({
+                termsAndConditions: {
+                    ...prev.termsAndConditions,
+                    accepted,
+                    '~touched': true,
+                },
+            }));
+        },
+        '~touched': false,
+    },
+    termsOfUse: {
+        open: false,
+        setOpen(open) {
+            set((prev) => ({
+                termsOfUse: {
+                    ...prev.termsOfUse,
+                    open,
+                    '~touched': true,
+                },
+            }));
+        },
+        next: null,
+        setNext(next) {
+            set((prev) => ({
+                termsOfUse: {
+                    ...prev.termsOfUse,
+                    next,
+                    '~touched': true,
+                },
+            }));
+        },
+        accepted: false,
+        setAccepted(accepted) {
+            set((prev) => ({
+                termsOfUse: {
+                    ...prev.termsOfUse,
+                    accepted,
+                    '~touched': true,
+                },
+            }));
+        },
+        '~touched': false,
+    },
+    responsibleGaming: {
+        open: false,
+        setOpen(open) {
+            set((prev) => ({
+                responsibleGaming: {
+                    ...prev.responsibleGaming,
+                    open,
+                    '~touched': true,
+                },
+            }));
+        },
+        next: null,
+        setNext(next) {
+            set((prev) => ({
+                responsibleGaming: {
+                    ...prev.responsibleGaming,
+                    next,
+                    '~touched': true,
+                },
+            }));
+        },
+        accepted: false,
+        setAccepted(accepted) {
+            set((prev) => ({
+                responsibleGaming: {
+                    ...prev.responsibleGaming,
+                    accepted,
+                    '~touched': true,
+                },
+            }));
+        },
+        '~touched': false,
+    },
 }));

package/dist/client/hooks/useJackpotsQuery.js

@@ -6,7 +6,7 @@ export const useJackpotsQuery = (input, config) => {
         refetchOnMount: false,
         refetchOnReconnect: false,
         refetchOnWindowFocus: false,
-        refetchInterval: 5000, // 5 seconds
+        refetchInterval: 3000, // 3 seconds
         ...config,
         queryKey: getJackpotsQueryKey(input),
         queryFn: ({ pageParam, signal }) => {

package/dist/components/BetRecords/BetRecords.client.js

@@ -1,13 +1,16 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { createListCollection } from '@ark-ui/react/collection';
-import { parseDate } from '@ark-ui/react/date-picker';
+import { parseDate, useDatePickerContext } from '@ark-ui/react/date-picker';
 import { tz, TZDateMini } from '@date-fns/tz';
 import { endOfDay, format, startOfDay } from 'date-fns';
 import { useReducer, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
+import { useMediaQuery } from 'usehooks-ts';
 import { z } from 'zod';
 import { useBetRecordsQuery } from '../../client/hooks/useBetRecordsQuery.js';
+import { useControllableState } from '../../client/hooks/useControllableState.js';
+import { useDisclosure } from '../../client/hooks/useDisclosure.js';
 import { useInfiniteQueryHelper } from '../../client/hooks/useInfiniteQueryHelper.js';
 import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
 import { GAME_PROVIDER_DATA, GAME_TYPE_DATA, GAME_TYPES, } from '../../constants/index.js';
@@ -84,50 +87,46 @@ export function BetRecords__client(props) {
             }),
         },
     });
+    const disclosure = useDisclosure({
+        onOpenChange(open) {
+            if (!open && !state.timestamp)
+                setTab('all');
+        },
+    });
     return (_jsxs("div", { className: props.className, children: [_jsx("h2", { className: "text-sm font-semibold leading-tight lg:text-lg", children: "Bet Records" }), _jsx("p", { className: "text-text-tertiary-600 mt-xs text-sm leading-tight", children: "Review your betting history" }), _jsx("div", { className: "mt-lg lg:mt-2xl", children: _jsxs(SegmentGroup.Root, { value: state.type ?? 'all', onValueChange: (details) => {
                         firstPage();
                         setState({
                             type: z.enum(GAME_TYPES).safeParse(details.value).data ?? null,
                             provider: null,
                         });
-                    }, className: "w-full overflow-x-auto lg:w-fit", children: [_jsxs(SegmentGroup.Item, { value: "all", children: [_jsx(SegmentGroup.ItemText, { children: "All" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), gameTypes.map((type) => (_jsxs(SegmentGroup.Item, { value: type.id, children: [_jsx(SegmentGroup.ItemText, { children: type.name }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }, type.id))), _jsx(SegmentGroup.Indicator, {})] }) }), _jsx("div", { className: "border-border-secondary mt-2xl hidden border-t lg:block" }), _jsx("h3", { className: "text-text-secondary-700 mt-3xl text-sm font-semibold", children: "Table" }), _jsxs("div", { className: "mt-xl flex flex-col gap-lg lg:flex-row lg:items-center", children: [_jsxs(DatePicker.Root, { lazyMount: true, unmountOnExit: true, value: [state.timestamp?.start, state.timestamp?.end]
-                            .filter(Boolean)
-                            .map((d) => parseDate(d)), onValueChange: (details) => {
+                    }, className: "w-full overflow-x-auto lg:w-fit", children: [_jsxs(SegmentGroup.Item, { value: "all", children: [_jsx(SegmentGroup.ItemText, { children: "All" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), gameTypes.map((type) => (_jsxs(SegmentGroup.Item, { value: type.id, children: [_jsx(SegmentGroup.ItemText, { children: type.name }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }, type.id))), _jsx(SegmentGroup.Indicator, {})] }) }), _jsx("div", { className: "border-border-secondary mt-2xl hidden border-t lg:block" }), _jsx("h3", { className: "text-text-secondary-700 mt-3xl text-sm font-semibold", children: "Table" }), _jsxs("div", { className: "mt-xl flex flex-col gap-lg lg:flex-row lg:items-center", children: [_jsxs(SegmentGroup.Root, { value: tab, onValueChange: (details) => {
+                            const value = TabDefinition.parse(details.value);
+                            if (value === 'today') {
+                                const now = new Date();
+                                setState({
+                                    timestamp: {
+                                        start: startOfDay(now),
+                                        end: endOfDay(now),
+                                    },
+                                });
+                            }
+                            else {
+                                setState({
+                                    timestamp: null,
+                                });
+                            }
                             firstPage();
-                            setState({
-                                timestamp: {
-                                    start: details.value.at(0)?.toDate(DEVICE_TIMEZONE),
-                                    end: details.value.at(1)?.toDate(DEVICE_TIMEZONE),
-                                },
-                            });
-                        }, onOpenChange: (details) => {
-                            if (details.open)
-                                return;
-                            if (state.timestamp)
-                                return;
-                            setTab('all');
-                        }, selectionMode: "range", closeOnSelect: false, positioning: {
-                            gutter: 20,
-                            placement: 'bottom',
-                        }, children: [_jsxs(SegmentGroup.Root, { value: tab, onValueChange: (details) => {
-                                    const value = TabDefinition.parse(details.value);
-                                    if (value === 'today') {
-                                        const now = new Date();
-                                        setState({
-                                            timestamp: {
-                                                start: startOfDay(now),
-                                                end: endOfDay(now),
-                                            },
-                                        });
-                                    }
-                                    else {
-                                        setState({
-                                            timestamp: null,
-                                        });
-                                    }
-                                    firstPage();
-                                    setTab(value);
-                                }, className: "w-full lg:w-fit", children: [_jsxs(SegmentGroup.Item, { value: "all", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "All" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "today", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "Today" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsx(DatePicker.Context, { children: (api) => (_jsx(SegmentGroup.Item, { value: "custom", onClick: () => api.setOpen(true), className: "w-full lg:w-auto", children: _jsxs(DatePicker.Control, { children: [_jsx(SegmentGroup.ItemText, { children: "Custom" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }) })) }), _jsx(SegmentGroup.Indicator, {})] }), _jsx(Portal, { children: _jsx(DatePicker.Positioner, { children: _jsx(DatePicker.Content, { children: _jsx(DatePicker.View, { view: "day", children: _jsx(DatePicker.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: api.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.substring(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: api.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] })) }) }) }) }) })] }), _jsx("div", { className: "hidden grow lg:block" }), _jsxs(Select.Root, { collection: providerCollection, value: state.provider ? [state.provider] : [], onValueChange: (details) => {
+                            setTab(value);
+                        }, ids: {
+                            item(value) {
+                                return `segment-group:item:${value}`;
+                            },
+                        }, className: "w-full lg:w-fit", children: [_jsxs(SegmentGroup.Item, { value: "all", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "All" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "today", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "Today" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "custom", onClick: () => disclosure.setOpen(true), className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "Custom" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsx(SegmentGroup.Indicator, {})] }), _jsx(RangeDatePicker, { value: {
+                            start: state.timestamp?.start,
+                            end: state.timestamp?.end,
+                        }, onValueChange: (timestamp) => {
+                            setState({ timestamp });
+                        }, open: disclosure.open, onOpenChange: disclosure.setOpen }), _jsx("div", { className: "hidden grow lg:block" }), _jsxs(Select.Root, { collection: providerCollection, value: state.provider ? [state.provider] : [], onValueChange: (details) => {
                             const value = z
                                 .enum((props.gameProviders ?? []))
                                 .safeParse(details.value.at(0)).data;
@@ -200,3 +199,42 @@ const statusCollection = createListCollection({
 });
 const TabDefinition = z.enum(['all', 'today', 'custom']);
 const DEVICE_TIMEZONE = Intl.DateTimeFormat().resolvedOptions().timeZone;
+function RangeDatePicker(props) {
+    const [value, setValue] = useControllableState({
+        value: props.value,
+        defaultValue: props.defaultValue ?? null,
+        onChange: (value) => {
+            props.onValueChange?.(value);
+        },
+    });
+    const [open, setOpen] = useControllableState({
+        value: props.open,
+        defaultValue: props.defaultOpen ?? false,
+        onChange: (open) => {
+            props.onOpenChange?.(open);
+        },
+    });
+    const desktop = useMediaQuery('(min-width: 1024px)');
+    return (_jsx(DatePicker.Root, { lazyMount: true, unmountOnExit: true, value: [value?.start, value?.end]
+            .filter(Boolean)
+            .map((d) => parseDate(d)), onValueChange: (details) => {
+            setValue({
+                start: details.value.at(0)?.toDate(DEVICE_TIMEZONE),
+                end: details.value.at(1)?.toDate(DEVICE_TIMEZONE),
+            });
+        }, open: open, onOpenChange: (details) => {
+            setOpen(details.open);
+        }, selectionMode: "range", closeOnSelect: false, fixedWeeks: true, numOfMonths: desktop ? 2 : 1, positioning: {
+            gutter: 16,
+            placement: 'bottom',
+        }, ids: {
+            control: 'segment-group:item:custom',
+        }, children: _jsx(Portal, { children: _jsx(DatePicker.Positioner, { children: _jsx(DatePicker.Content, { className: "p-0", children: _jsxs("div", { className: "flex", children: [_jsx(RangeDatePickerCalendar, { monthOffset: 0 }), desktop && _jsx(RangeDatePickerCalendar, { monthOffset: 1 })] }) }) }) }) }));
+}
+function RangeDatePickerCalendar({ monthOffset }) {
+    const datePicker = useDatePickerContext();
+    const offset = datePicker.getOffset({
+        months: monthOffset,
+    });
+    return (_jsxs(DatePicker.View, { view: "day", className: "border-border-secondary px-6 py-5 lg:first:border-r", children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx("span", { className: "text-text-secondary-700 text-base font-semibold", children: offset.visibleRangeText.start }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: datePicker.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.slice(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: offset.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, visibleRange: offset.visibleRange, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] }));
+}

package/dist/components/Bonus/Bonus.client.js

@@ -13,7 +13,7 @@ import piggyBank from '../../images/piggy-bank.png';
 import { Badge } from '../../ui/Badge/index.js';
 import { Collapsible } from '../../ui/Collapsible/index.js';
 import { Progress } from '../../ui/Progress/index.js';
-import { Prose } from '../../ui/Prose.js';
+import { Prose } from '../../ui/Prose/index.js';
 import { capitalize } from '../../utils/capitalize.js';
 import { formatNumber } from '../../utils/formatNumber.js';
 import { parseDecimal } from '../../utils/parseDecimal.js';

package/dist/components/Bonuses/ClaimSpotBonus.lazy.js

@@ -13,7 +13,11 @@ import { Dialog } from '../../ui/Dialog/index.js';
 import { Field } from '../../ui/Field/index.js';
 import { Portal } from '../../ui/Portal/index.js';
 const definition = z.object({
-    code: z.string().min(1, 'Code is required').trim(),
+    code: z
+        .string()
+        .min(1, 'Code is required')
+        .max(10, 'Promo code is too long (max 10 characters)')
+        .trim(),
 });
 export function ClaimSpotBonus() {
     const globalStore = useGlobalStore(useShallow((ctx) => ({
@@ -39,7 +43,7 @@ export function ClaimSpotBonus() {
             code: '',
         },
     });
-    return (_jsx(Dialog.Root, { open: globalStore.spotBonus.open, onOpenChange: (details) => globalStore.spotBonus.setOpen(details.open), lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { className: "flex items-center lg:items-start", children: _jsxs(Dialog.Content, { className: "mx-auto w-[25rem] max-w-full rounded-xl p-3xl overflow-y-auto", children: [_jsx("div", { className: "overflow-hidden rounded-md", style: {
+    return (_jsx(Dialog.Root, { open: globalStore.spotBonus.open, onOpenChange: (details) => globalStore.spotBonus.setOpen(details.open), lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { className: "flex items-center lg:items-start", children: _jsxs(Dialog.Content, { className: "mx-auto w-[25rem] max-w-full overflow-y-auto rounded-xl p-3xl", children: [_jsx("div", { className: "overflow-hidden rounded-md", style: {
                                     background: 'radial-gradient(75.21% 75.21% at 50% 50%, rgba(249, 163, 8, 0.3) 0%, rgba(0, 0, 0, 0) 100%), var(--color-bg-primary-alt)',
                                 }, children: _jsx(Image, { src: ribbonEnvelope, alt: "", className: "mx-auto h-[12.5rem] w-[80%] object-cover", draggable: false, width: 600, height: 341 }) }), _jsxs("form", { className: "mt-3xl", onSubmit: form.handleSubmit((data) => {
                                     claimSpotBonusMutation.mutate(data.code);

package/dist/components/Cashback/Cashback.client.js

@@ -11,7 +11,7 @@ import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
 import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
 import { ChevronLeftIcon } from '../../icons/ChevronLeftIcon.js';
 import { Button } from '../../ui/Button/index.js';
-import { Prose } from '../../ui/Prose.js';
+import { Prose } from '../../ui/Prose/index.js';
 export function Cashback__client(props) {
     const availablePromosQuery = useAvailablePromosQuery();
     const cashbackQuery = useCashbackQuery(props.id);

package/dist/components/CustomPromo/CustomPromo.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import Image from 'next/image';
 import Link from 'next/link';
 import { ChevronLeftIcon } from '../../icons/ChevronLeftIcon.js';
-import { Prose } from '../../ui/Prose.js';
+import { Prose } from '../../ui/Prose/index.js';
 import { stripTags } from '../../utils/stripTags.js';
 export function CustomPromo(props) {
     return (_jsxs(_Fragment, { children: [_jsx("meta", { name: "description", content: stripTags(props.promo.description) }), _jsx("meta", { name: "og:title", content: props.promo.name }), _jsx("meta", { name: "og:description", content: stripTags(props.promo.description) }), _jsx("meta", { name: "og:image", content: props.promo.banner }), _jsx("meta", { name: "twitter:title", content: props.promo.name }), _jsx("meta", { name: "twitter:description", content: stripTags(props.promo.description) }), _jsx("meta", { name: "twitter:image", content: props.promo.banner }), _jsx("meta", { name: "twitter:card", content: "summary_large_image" }), _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: props.promo.banner, alt: "", width: 1024, height: 600, priority: true, unoptimized: true, className: "mt-xl h-auto w-full rounded-xl lg:mt-6" }), _jsx("h1", { className: "mt-xl text-2xl font-semibold lg:mt-6 lg:text-3xl", children: props.promo.name }), _jsx(Prose, { className: "mt-2xl lg:mt-6", dangerouslySetInnerHTML: {

package/dist/components/Disclaimer/Disclaimer.d.ts

@@ -1,15 +1,4 @@
-import type { ImageProps } from 'next/image';
-import type { ReactNode } from 'react';
-import { type DisclaimerV1Props } from './DisclaimerV1';
-type DisclaimerProps = DisclaimerV1Props | {
-    version: 'v2';
-    logo: ImageProps['src'];
-    siteName: string;
-    responsibleGamingContent: string | ReactNode;
-    termsOfUseContent: string | ReactNode;
-    responsibleGamingLogo?: ImageProps['src'];
-    redirectUrlOnNoConsent?: string;
-    hasNoCheckbox?: boolean;
-};
+import type { DisclaimerV1Props } from './DisclaimerV1';
+import type { DisclaimerV2Props } from './DisclaimerV2';
+export type DisclaimerProps = DisclaimerV1Props | DisclaimerV2Props;
 export declare function Disclaimer(props: DisclaimerProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/Disclaimer/Disclaimer.js

@@ -1,10 +1,19 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { DisclaimerV1 } from './DisclaimerV1.js';
-import { DisclaimerV2 } from './DisclaimerV2.js';
+import dynamic from 'next/dynamic';
+const DisclaimerV1 = dynamic(() => import('./DisclaimerV1.js').then((mod) => mod.DisclaimerV1), {
+    ssr: false,
+    loading: () => null,
+});
+const DisclaimerV2 = dynamic(() => import('./DisclaimerV2.js').then((mod) => mod.DisclaimerV2), {
+    ssr: false,
+    loading: () => null,
+});
 export function Disclaimer(props) {
-    if (props.version === 'v2') {
-        return (_jsx(DisclaimerV2, { logo: props.logo, siteName: props.siteName, responsibleGamingContent: props.responsibleGamingContent, termsOfUseContent: props.termsOfUseContent, responsibleGamingLogo: props.responsibleGamingLogo, redirectUrlOnNoConsent: props.redirectUrlOnNoConsent, hasNoCheckbox: props.hasNoCheckbox }));
+    if (props.version === '2') {
+        return _jsx(DisclaimerV2, { ...props });
+    }
+    else {
+        return _jsx(DisclaimerV1, { ...props });
     }
-    return _jsx(DisclaimerV1, { ...props });
 }

package/dist/components/Disclaimer/DisclaimerV1.d.ts

@@ -1,6 +1,6 @@
 import type { ImageProps } from 'next/image';
 export interface DisclaimerV1Props {
-    version?: 'v1';
+    version: '1';
     logo: ImageProps['src'];
     termsAndConditionsUrl?: string;
 }

package/dist/components/Disclaimer/DisclaimerV1.js

@@ -12,5 +12,5 @@ import { useDisclaimer } from './useDisclaimer.js';
 export function DisclaimerV1(props) {
     const disclaimer = useDisclaimer();
     const acceptTriggerRef = useRef(null);
-    return (_jsx(Dialog.Root, { open: disclaimer.open, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, initialFocusEl: () => acceptTriggerRef.current, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)]", children: _jsxs(Dialog.Content, { className: "flex h-full w-full flex-col items-start p-3xl lg:mx-auto lg:h-auto lg:w-[400px] lg:rounded-xl overflow-y-auto", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsxs("div", { className: "w-full grow", children: [_jsx(Dialog.Title, { className: "mt-3xl text-center text-lg font-semibold", children: "Age Verification" }), _jsxs(Dialog.Description, { className: "text-text-tertiary-600 mt-xs text-center text-sm", children: ["By entering this website I acknowledge and confirm I am 21 years of age and I agree with the", ' ', _jsx(Link, { href: props.termsAndConditionsUrl ?? '/terms-and-conditions', target: "_blank", rel: "noopener noreferrer", className: "text-brand-400 whitespace-nowrap underline underline-offset-2", prefetch: false, children: "Terms and Conditions." })] }), _jsxs("div", { className: "mt-5 flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[88px] w-auto shrink-0", draggable: false }), _jsx(Image, { src: responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[62px] w-auto shrink-0", draggable: false })] })] }), _jsx(Button, { ref: acceptTriggerRef, type: "button", className: "mt-4xl", onClick: disclaimer.close, children: "Accept" })] }) })] }) }));
+    return (_jsx(Dialog.Root, { open: disclaimer.open, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, initialFocusEl: () => acceptTriggerRef.current, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)]", children: _jsxs(Dialog.Content, { className: "flex h-full w-full flex-col items-start overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:w-[400px] lg:rounded-xl", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsxs("div", { className: "w-full grow", children: [_jsx(Dialog.Title, { className: "mt-3xl text-center text-lg font-semibold", children: "Age Verification" }), _jsxs(Dialog.Description, { className: "text-text-tertiary-600 mt-xs text-center text-sm", children: ["By entering this website I acknowledge and confirm I am 21 years of age and I agree with the", ' ', _jsx(Link, { href: props.termsAndConditionsUrl ?? '/terms-and-conditions', target: "_blank", rel: "noopener noreferrer", className: "text-brand-400 whitespace-nowrap underline underline-offset-2", prefetch: false, children: "Terms and Conditions." })] }), _jsxs("div", { className: "mt-5 flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[88px] w-auto shrink-0", draggable: false }), _jsx(Image, { src: responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[62px] w-auto shrink-0", draggable: false })] })] }), _jsx(Button, { ref: acceptTriggerRef, type: "button", className: "mt-4xl", onClick: disclaimer.close, children: "Accept" })] }) })] }) }));
 }

package/dist/components/Disclaimer/DisclaimerV2.d.ts

@@ -1,12 +1,8 @@
 import type { ImageProps } from 'next/image';
-import { type ReactNode } from 'react';
-export interface DisclaimerProps {
+export interface DisclaimerV2Props {
+    version: '2';
     logo: ImageProps['src'];
     siteName: string;
-    responsibleGamingContent: ReactNode;
-    termsOfUseContent: ReactNode;
     responsibleGamingLogo?: ImageProps['src'];
-    redirectUrlOnNoConsent?: string;
-    hasNoCheckbox?: boolean;
 }
-export declare function DisclaimerV2(props: DisclaimerProps): import("react/jsx-runtime").JSX.Element;
+export declare function DisclaimerV2(props: DisclaimerV2Props): import("react/jsx-runtime").JSX.Element;

package/dist/components/Disclaimer/DisclaimerV2.js

@@ -1,7 +1,8 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Image from 'next/image';
-import { useEffect, useRef, useState } from 'react';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
 import { CheckIcon } from '../../icons/CheckIcon.js';
 import pagcorLogo from '../../images/pagcor2.png';
 import responsibleGamingLogo from '../../images/responsible-gaming.png';
@@ -9,58 +10,29 @@ import { Button } from '../../ui/Button/index.js';
 import { Checkbox } from '../../ui/Checkbox/index.js';
 import { Dialog } from '../../ui/Dialog/index.js';
 import { Portal } from '../../ui/Portal/index.js';
-import { ResponsibleGaming } from './ResponsibleGaming.js';
-import { TermsOfUse } from './TermsOfUse.js';
 import { useDisclaimer } from './useDisclaimer.js';
 export function DisclaimerV2(props) {
     const disclaimer = useDisclaimer();
-    const acceptTriggerRef = useRef(null);
-    const [isResponsibleGamingOpen, setResponsibleGamingOpen] = useState(false);
-    const [isTermsOfUseOpen, setTermsOfUseOpen] = useState(false);
-    const [isChecked, setIsChecked] = useState(false);
-    const [isTermsOfUseAccepted, setIsTermsOfUseAccepted] = useState(false);
-    const [isResponsibleGamingAccepted, setIsResponsibleGamingAccepted] = useState(false);
-    useEffect(() => {
-        if (isTermsOfUseAccepted && isResponsibleGamingAccepted) {
-            setIsChecked(true);
-        }
-    }, [isTermsOfUseAccepted, isResponsibleGamingAccepted]);
-    return (_jsxs(_Fragment, { children: [_jsx(ResponsibleGaming, { responsibleGamingContent: props.responsibleGamingContent, logo: props.logo, open: isResponsibleGamingOpen, onCloseAction: () => {
-                    setIsResponsibleGamingAccepted(true);
-                    setResponsibleGamingOpen(false);
-                }, responsibleGamingLogo: props.responsibleGamingLogo }), _jsx(TermsOfUse, { termsOfUseContent: props.termsOfUseContent, siteName: props.siteName, logo: props.logo, open: isTermsOfUseOpen, onCloseAction: () => {
-                    setIsTermsOfUseAccepted(true);
-                    setTermsOfUseOpen(false);
-                }, responsibleGamingLogo: props.responsibleGamingLogo }), _jsx(Dialog.Root, { open: disclaimer.open, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, initialFocusEl: () => acceptTriggerRef.current, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "flex h-full w-full flex-col items-start gap-y-4 overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:w-[400px] lg:rounded-xl", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsxs("div", { className: "flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false })] }), _jsx("div", { className: "text-sm", children: "The following individuals are prohibited from registering or participating in this online gaming platform." }), _jsx("div", { className: "w-full grow", children: _jsxs(Dialog.Description, { className: "space-y-4 text-sm", children: [_jsxs("ul", { className: "space-y-1.5 text-left", children: [_jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Persons below the legal gambling age of 21."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Any government official or employee directly involved in the operations of the government or its agencies."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Member of the Armed Forces of the Philippines, including the Army, Navy, Air Force and the Philippine National Police."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Individuals listed in PAGCOR's National Database of Restricted Persons (NDRP)"] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Holders of a valid Gaming Employment License (GEL)"] })] }), !props.hasNoCheckbox ? (_jsxs(Checkbox.Root, { checked: isChecked, onCheckedChange: (e) => {
-                                                        setIsChecked(!!e.checked);
-                                                        if (!e.checked) {
-                                                            setIsTermsOfUseAccepted(false);
-                                                            setIsResponsibleGamingAccepted(false);
-                                                        }
-                                                    }, children: [_jsx(Checkbox.Control, { children: _jsx(Checkbox.Indicator, { asChild: true, children: _jsx(CheckIcon, {}) }) }), _jsxs(Checkbox.Label, { children: ["I have read and agreed to ", props.siteName, ' ', _jsx("button", { type: "button", className: "text-brand-400 underline underline-offset-2", onClick: () => {
-                                                                        setTermsOfUseOpen(true);
-                                                                    }, children: "Terms of Use" }), ' ', "and", ' ', _jsx("button", { type: "button", className: "text-brand-400 underline underline-offset-2", onClick: () => {
-                                                                        setResponsibleGamingOpen(true);
-                                                                    }, children: "Responsible Gaming" })] }), _jsx(Checkbox.HiddenInput, {})] })) : (_jsxs("div", { children: ["I have read and agreed to ", props.siteName, ' ', _jsx("button", { type: "button", className: "text-brand-400 underline underline-offset-2", onClick: () => {
-                                                                setTermsOfUseOpen(true);
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        termsOfUse: ctx.termsOfUse,
+        responsibleGaming: ctx.responsibleGaming,
+    })));
+    const checked = globalStore.termsOfUse.accepted && globalStore.responsibleGaming.accepted;
+    return (_jsx(Dialog.Root, { open: disclaimer.open, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "flex h-full w-full flex-col items-start gap-y-4 overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:w-[400px] lg:rounded-xl", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsxs("div", { className: "flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false })] }), _jsx("div", { className: "text-sm", children: "The following individuals are prohibited from registering or participating in this online gaming platform." }), _jsx("div", { className: "w-full grow", children: _jsxs(Dialog.Description, { className: "space-y-4 text-sm", children: [_jsxs("ul", { className: "space-y-1.5 text-left", children: [_jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Persons below the legal gambling age of 21."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Any government official or employee directly involved in the operations of the government or its agencies."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Member of the Armed Forces of the Philippines, including the Army, Navy, Air Force and the Philippine National Police."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Individuals listed in PAGCOR's National Database of Restricted Persons (NDRP)"] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Holders of a valid Gaming Employment License (GEL)"] })] }), _jsxs(Checkbox.Root, { checked: checked, onCheckedChange: (e) => {
+                                                if (e.checked === 'indeterminate')
+                                                    return;
+                                                globalStore.termsOfUse.setAccepted(e.checked);
+                                                globalStore.responsibleGaming.setAccepted(e.checked);
+                                            }, children: [_jsx(Checkbox.Control, { children: _jsx(Checkbox.Indicator, { asChild: true, children: _jsx(CheckIcon, {}) }) }), _jsxs(Checkbox.Label, { children: ["I have read and agreed to ", props.siteName, ' ', _jsx("button", { type: "button", className: "text-brand-400 underline underline-offset-2", onClick: () => {
+                                                                globalStore.termsOfUse.setOpen(true);
+                                                                globalStore.termsOfUse.setNext('DISCLAIMER');
+                                                                disclaimer.close();
                                                             }, children: "Terms of Use" }), ' ', "and", ' ', _jsx("button", { type: "button", className: "text-brand-400 underline underline-offset-2", onClick: () => {
-                                                                setResponsibleGamingOpen(true);
-                                                            }, children: "Responsible Gaming" })] })), _jsx("div", { children: "Funds or credits in the account of any individual found ineligible to participate will be forfeited and turned over to the government as required by law" })] }) }), _jsxs("div", { className: "mt-4 flex w-full gap-3", children: [_jsx(Button, { type: "button", onClick: () => {
-                                                    if (props.redirectUrlOnNoConsent) {
-                                                        window.location.href = props.redirectUrlOnNoConsent;
-                                                    }
-                                                    else {
-                                                        disclaimer.close();
-                                                    }
-                                                }, variant: "outline", children: "Exit" }), _jsx(Button, { ref: acceptTriggerRef, type: "button", disabled: !isChecked, "aria-disabled": !isChecked, onClick: () => {
-                                                    if (isChecked) {
-                                                        disclaimer.close();
-                                                    }
-                                                    else {
-                                                        if (props.redirectUrlOnNoConsent) {
-                                                            window.location.href = props.redirectUrlOnNoConsent;
-                                                        }
-                                                    }
-                                                }, children: "Accept" })] })] }) })] }) })] }));
+                                                                globalStore.responsibleGaming.setOpen(true);
+                                                                globalStore.responsibleGaming.setNext('DISCLAIMER');
+                                                                disclaimer.close();
+                                                            }, children: "Responsible Gaming" })] }), _jsx(Checkbox.HiddenInput, {})] }), _jsx("div", { children: "Funds or credits in the account of any individual found ineligible to participate will be forfeited and turned over to the government as required by law" })] }) }), _jsx("div", { className: "mt-4 flex w-full gap-3", children: _jsx(Button, { type: "button", onClick: () => {
+                                        disclaimer.close();
+                                    }, disabled: !checked, className: "mt-4", children: "Accept" }) })] }) })] }) }));
 }
 const Circle = () => (_jsx("div", { children: _jsx("div", { className: "border-brand-400 flex h-4.5 w-4.5 items-center justify-center rounded-full border", children: _jsx("div", { className: "bg-brand-400 h-3 w-3 rounded-full" }) }) }));

package/dist/components/Disclaimer/useDisclaimer.js

@@ -22,7 +22,7 @@ export function useDisclaimer() {
         : /* set to zero to trigger timeout function */ 0;
     useTimeout(() => {
         disclaimerStore.setOpen(true);
-    }, refetchPausedUntilInMs);
+    }, disclaimerStore.open ? null : refetchPausedUntilInMs);
     return {
         open: sessionQuery.isLoading
             ? false

package/dist/components/GameLaunch/GameLaunch.lazy.js

@@ -22,7 +22,7 @@ import { AlertDialog } from '../../ui/AlertDialog/index.js';
 import { Button } from '../../ui/Button/index.js';
 import { IconButton } from '../../ui/IconButton/index.js';
 import { Portal } from '../../ui/Portal/index.js';
-import { Presence } from '../../ui/Presence.js';
+import { Presence } from '../../ui/Presence/index.js';
 export function GameLaunch() {
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         gameLaunch: ctx.gameLaunch,

package/dist/components/GamesSearch/GamesSearch.js

@@ -10,7 +10,7 @@ import { SearchLgIcon } from '../../icons/SearchLgIcon.js';
 import { Button } from '../../ui/Button/index.js';
 import { Combobox } from '../../ui/Combobox/index.js';
 import { Portal } from '../../ui/Portal/index.js';
-import { Presence } from '../../ui/Presence.js';
+import { Presence } from '../../ui/Presence/index.js';
 import { getGameImageUrl } from '../../utils/getGameImageUrl.js';
 import { GameLaunchTrigger } from '../GameLaunch/index.js';
 export function GamesSearch(props) {