@opexa/portal-components 0.0.276 → 0.0.278

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/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/Jackpots/JackpotsCarousel/JackpotsCarouselItem.js

@@ -17,6 +17,7 @@ import closeChest from '../../../images/close-chest.png';
 import firstPlace from '../../../images/first-place.png';
 import leaderboard from '../../../images/leaderboard.png';
 import openChest from '../../../images/open-chest.png';
+import * as Tooltip from '../../../ui/Tooltip/Tooltip.js';
 import { capitalize } from '../../../utils/capitalize.js';
 import { formatNumber } from '../../../utils/formatNumber.js';
 import { getPercentage } from '../../../utils/getPercentage.js';
@@ -69,7 +70,17 @@ export function JackpotsCarouselItem({ style, className, viewAllUrl, animate = t
                                         }) }), _jsxs("div", { className: "relative flex items-center justify-end gap-1.5", children: [isPayingOut ? (_jsxs("div", { className: "flex w-6 items-center", children: [_jsx("div", { className: twMerge('absolute left-0', styles['animate-arrow-red-flash-1']), children: _jsx(ChevronLeftIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-1.5', styles['animate-arrow-red-flash-2']), children: _jsx(ChevronLeftIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-3', styles['animate-arrow-red-flash-3']), children: _jsx(ChevronLeftIcon, { className: "size-4.5" }) })] })) : (_jsxs("div", { className: "flex w-6 items-center", children: [_jsx("div", { className: twMerge('absolute left-0', styles['animate-arrow-green-flash-1']), children: _jsx(ChevronRightIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-1.5', styles['animate-arrow-green-flash-2']), children: _jsx(ChevronRightIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-3', styles['animate-arrow-green-flash-3']), children: _jsx(ChevronRightIcon, { className: "size-4.5" }) })] })), _jsx("div", { className: "text-text-primary-900 text-xs font-semibold", children: formatNumber(jackpot?.maximumJackpotPoolLimit, {
                                                     currency: localeInfo.currency.code,
                                                     compact: true,
-                                                }) })] })] }), _jsx(Progress.Root, { className: "bg-bg-primary h-2 w-full rounded-full lg:h-4", max: 100, value: getPercentage(jackpot.pool, jackpot.maximumJackpotPoolLimit), children: _jsx(Progress.Track, { className: "bg-bg-primary h-full overflow-hidden rounded-full", children: _jsx(Progress.Range, { className: "bg-brand-500 relative h-full overflow-hidden rounded-full pl-1.5", children: _jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-start pl-1.5", "aria-hidden": "true", children: arrowImages }) }) }) }), _jsx("div", { className: "mt-1 block text-start text-2xs lg:hidden", children: isPayingOut
+                                                }) })] })] }), _jsx(Progress.Root, { className: "bg-bg-primary h-2 w-full rounded-full lg:h-4", max: 100, value: getPercentage(jackpot.pool, jackpot.maximumJackpotPoolLimit), children: _jsx(Progress.Track, { className: "bg-bg-primary h-full overflow-hidden rounded-full", children: _jsxs(Progress.Range, { className: "bg-brand-500 relative h-full overflow-hidden rounded-full pl-1.5", children: [_jsxs(Tooltip.Root, { openDelay: 0, closeDelay: 100, lazyMount: true, unmountOnExit: true, positioning: { strategy: 'fixed', placement: 'top' }, children: [_jsx(Tooltip.Trigger, { asChild: true, children: _jsx("div", { className: "absolute inset-0 h-full w-full" }) }), _jsx(Tooltip.Positioner, { children: _jsxs(Tooltip.Content, { children: [_jsxs("div", { className: "text-xs", children: ["Current\uD83D\uDCB0:", ' ', formatNumber(jackpot.pool, {
+                                                                            currency: localeInfo.currency.code,
+                                                                            minDecimalPlaces: 2,
+                                                                            maxDecimalPlaces: 2,
+                                                                        })] }), _jsx(Tooltip.Arrow, { children: _jsx(Tooltip.ArrowTip, {}) })] }) })] }), _jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-start pl-1.5", "aria-hidden": "true", children: arrowImages }), _jsxs(Tooltip.Root, { openDelay: 0, closeDelay: 100, lazyMount: true, unmountOnExit: true, positioning: { strategy: 'fixed', placement: 'top' }, children: [_jsx(Tooltip.Trigger, { asChild: true, children: _jsx("div", { className: "absolute inset-0 h-full bg-black opacity-30", style: {
+                                                                width: `${getPercentage(jackpot.minimumJackpotPoolDrawingLimit, jackpot.pool)}%`,
+                                                            } }) }), _jsx(Tooltip.Positioner, { children: _jsxs(Tooltip.Content, { children: [_jsxs("div", { className: "text-xs", children: ["Minimum Payout Limit:", ' ', formatNumber(jackpot.minimumJackpotPoolDrawingLimit, {
+                                                                            currency: localeInfo.currency.code,
+                                                                            minDecimalPlaces: 2,
+                                                                            maxDecimalPlaces: 2,
+                                                                        })] }), _jsx(Tooltip.Arrow, { children: _jsx(Tooltip.ArrowTip, {}) })] }) })] })] }) }) }), _jsx("div", { className: "mt-1 block text-start text-2xs lg:hidden", children: isPayingOut
                                     ? `The pot has hit ${formatNumber(jackpot?.maximumJackpotPoolLimit, {
                                         currency: localeInfo.currency.code,
                                         compact: true,

package/dist/components/Jackpots/JackpotsList/JackpotsListItemDesktop.js

@@ -12,6 +12,7 @@ import closeChest from '../../../images/close-chest.png';
 import firstPlace from '../../../images/first-place.png';
 import leaderboard from '../../../images/leaderboard.png';
 import openChest from '../../../images/open-chest.png';
+import { Tooltip } from '../../../ui/Tooltip/index.js';
 import { capitalize } from '../../../utils/capitalize.js';
 import { formatNumber } from '../../../utils/formatNumber.js';
 import { getPercentage } from '../../../utils/getPercentage.js';
@@ -40,7 +41,17 @@ export function JackpotsListItemDesktop({ animate = true, ...props }) {
                                                 }) }), _jsxs("div", { className: "relative flex items-center justify-end gap-1.5", children: [isPayingOut ? (_jsxs("div", { className: "flex w-6 items-center", children: [_jsx("div", { className: twMerge('absolute left-0', styles['animate-arrow-red-flash-1']), children: _jsx(ChevronLeftIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-1.5', styles['animate-arrow-red-flash-2']), children: _jsx(ChevronLeftIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-3', styles['animate-arrow-red-flash-3']), children: _jsx(ChevronLeftIcon, { className: "size-4.5" }) })] })) : (_jsxs("div", { className: "flex w-6 items-center", children: [_jsx("div", { className: twMerge('absolute left-0', styles['animate-arrow-green-flash-1']), children: _jsx(ChevronRightIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-1.5', styles['animate-arrow-green-flash-2']), children: _jsx(ChevronRightIcon, { className: "size-4.5" }) }), _jsx("div", { className: twMerge('absolute left-3', styles['animate-arrow-green-flash-3']), children: _jsx(ChevronRightIcon, { className: "size-4.5" }) })] })), _jsx("div", { className: "text-text-primary-900 text-xs font-semibold", children: formatNumber(jackpot?.maximumJackpotPoolLimit, {
                                                             currency: localeInfo.currency.code,
                                                             compact: true,
-                                                        }) })] })] }), _jsx(Progress.Root, { className: "bg-bg-primary h-2 w-full rounded-full lg:h-4", max: 100, value: getPercentage(jackpot.pool, jackpot.maximumJackpotPoolLimit), children: _jsx(Progress.Track, { className: "bg-bg-primary h-full overflow-hidden rounded-full", children: _jsx(Progress.Range, { className: "bg-brand-500 relative h-full overflow-hidden rounded-full pl-1.5", children: _jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-start pl-1.5", "aria-hidden": "true", children: arrowImages }) }) }) }), _jsx("div", { className: "mt-1 block text-start text-2xs lg:hidden", children: isPayingOut
+                                                        }) })] })] }), _jsx(Progress.Root, { className: "bg-bg-primary h-2 w-full rounded-full lg:h-4", max: 100, value: getPercentage(jackpot.pool, jackpot.maximumJackpotPoolLimit), children: _jsx(Progress.Track, { className: "bg-bg-primary h-full overflow-hidden rounded-full", children: _jsxs(Progress.Range, { className: "bg-brand-500 relative h-full overflow-hidden rounded-full pl-1.5", children: [_jsxs(Tooltip.Root, { openDelay: 0, closeDelay: 100, lazyMount: true, unmountOnExit: true, positioning: { strategy: 'fixed', placement: 'top' }, children: [_jsx(Tooltip.Trigger, { asChild: true, children: _jsx("div", { className: "absolute inset-0 h-full w-full" }) }), _jsx(Tooltip.Positioner, { children: _jsxs(Tooltip.Content, { children: [_jsxs("div", { className: "text-xs", children: ["Current\uD83D\uDCB0:", ' ', formatNumber(jackpot.pool, {
+                                                                                    currency: localeInfo.currency.code,
+                                                                                    minDecimalPlaces: 2,
+                                                                                    maxDecimalPlaces: 2,
+                                                                                })] }), _jsx(Tooltip.Arrow, { children: _jsx(Tooltip.ArrowTip, {}) })] }) })] }), _jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-start pl-1.5", "aria-hidden": "true", children: arrowImages }), _jsxs(Tooltip.Root, { openDelay: 0, closeDelay: 100, lazyMount: true, unmountOnExit: true, positioning: { strategy: 'fixed', placement: 'top' }, children: [_jsx(Tooltip.Trigger, { asChild: true, children: _jsx("div", { className: "absolute inset-0 h-full bg-black opacity-30", style: {
+                                                                        width: `${getPercentage(jackpot.minimumJackpotPoolDrawingLimit, jackpot.pool)}%`,
+                                                                    } }) }), _jsx(Tooltip.Positioner, { children: _jsxs(Tooltip.Content, { children: [_jsxs("div", { className: "text-xs", children: ["Minimum Payout Limit:", ' ', formatNumber(jackpot.minimumJackpotPoolDrawingLimit, {
+                                                                                    currency: localeInfo.currency.code,
+                                                                                    minDecimalPlaces: 2,
+                                                                                    maxDecimalPlaces: 2,
+                                                                                })] }), _jsx(Tooltip.Arrow, { children: _jsx(Tooltip.ArrowTip, {}) })] }) })] })] }) }) }), _jsx("div", { className: "mt-1 block text-start text-2xs lg:hidden", children: isPayingOut
                                             ? `The pot has hit ${formatNumber(jackpot?.maximumJackpotPoolLimit, {
                                                 currency: localeInfo.currency.code,
                                                 compact: true,

package/dist/components/ResponsibleGaming/ResponsibleGaming.d.ts

@@ -0,0 +1,3 @@
+import type { ResponsibleGamingProps } from './ResponsibleGaming.lazy';
+export declare function ResponsibleGaming(props: ResponsibleGamingProps): import("react/jsx-runtime").JSX.Element | undefined;
+export type { ResponsibleGamingProps };

package/dist/components/ResponsibleGaming/ResponsibleGaming.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import dynamic from 'next/dynamic';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+const Component = dynamic(() => import('./ResponsibleGaming.lazy.js').then((m) => m.ResponsibleGaming), {
+    ssr: false,
+    loading: () => null,
+});
+export function ResponsibleGaming(props) {
+    const touched = useGlobalStore(useShallow((ctx) => ctx.responsibleGaming['~touched']));
+    if (touched)
+        return _jsx(Component, { ...props });
+}

package/dist/components/ResponsibleGaming/ResponsibleGaming.lazy.d.ts

@@ -0,0 +1,8 @@
+import { type ImageProps } from 'next/image';
+import type { ReactNode } from 'react';
+export interface ResponsibleGamingProps {
+    logo: ImageProps['src'];
+    content: string | ReactNode;
+    responsibleGamingLogo?: ImageProps['src'];
+}
+export declare function ResponsibleGaming(props: ResponsibleGamingProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ResponsibleGaming/ResponsibleGaming.lazy.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Image, {} from 'next/image';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import pagcorLogo from '../../images/pagcor.png';
+import responsibleGamingLogo from '../../images/responsible-gaming.png';
+import { Button } from '../../ui/Button/index.js';
+import { Dialog } from '../../ui/Dialog/index.js';
+import { Portal } from '../../ui/Portal/index.js';
+export function ResponsibleGaming(props) {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        signIn: ctx.signIn,
+        signUp: ctx.signUp,
+        disclaimer: ctx.disclaimer,
+        responsibleGaming: ctx.responsibleGaming,
+    })));
+    return (_jsx(Dialog.Root, { open: globalStore.responsibleGaming.open, onOpenChange: (details) => {
+            globalStore.responsibleGaming.setOpen(details.open);
+            if (!details.open)
+                globalStore.responsibleGaming.setAccepted(true);
+        }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
+            if (globalStore.responsibleGaming.next === 'SIGN_IN') {
+                globalStore.signIn.setOpen(true);
+            }
+            if (globalStore.responsibleGaming.next === 'SIGN_UP') {
+                globalStore.signUp.setOpen(true);
+            }
+            if (globalStore.responsibleGaming.next === 'DISCLAIMER') {
+                globalStore.disclaimer.setOpen(true);
+            }
+            globalStore.responsibleGaming.setNext(null);
+        }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", 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: "text-brand-400 mt-3xl text-center text-lg font-semibold", children: "Responsible Gaming" }), _jsx(Dialog.Description, { className: "leading-2xl mt-xs text-sm", children: props.content }), _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: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[62px] w-auto shrink-0", draggable: false })] })] }), _jsx(Dialog.Context, { children: (api) => (_jsx(Button, { type: "button", className: "mt-3", onClick: () => {
+                                        api.setOpen(false);
+                                    }, children: "I Agree" })) })] }) })] }) }));
+}

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

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

package/dist/components/ResponsibleGaming/index.js

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