@opexa/portal-components 0.0.829 → 0.0.830

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__next/useQRPHDeposit.js

@@ -0,0 +1,91 @@
+import { useEffect, useRef, useState } from 'react';
+import invariant from 'tiny-invariant';
+import { useShallow } from 'zustand/shallow';
+import { useCreateQRPHDepositMutation } from '../../../../client/hooks/useCreateQRPHDepositMutation.js';
+import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
+import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
+import { useMemberVerificationQuery } from '../../../../client/hooks/useMemberVerificationQuery.js';
+export function useQRPHDeposit() {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        kycVerificationStatus: ctx.kycVerificationStatus,
+    })));
+    const inputRef = useRef(null);
+    const [deposit, setDeposit] = useState(null);
+    const [status, setStatus] = useState('idle');
+    const verificationQuery = useMemberVerificationQuery();
+    const verificationStatus = verificationQuery.data?.status ?? 'UNVERIFIED';
+    const mutation = useCreateQRPHDepositMutation({
+        onMutate() {
+            setStatus('generating-qr-code');
+        },
+        onSuccess(data) {
+            invariant(data.qrCode);
+            setStatus('qr-code-generated');
+            setDeposit(data);
+        },
+        onError() {
+            setStatus('failed');
+        },
+    });
+    const query = useDepositQuery(deposit?.id, {
+        enabled: !!deposit && status === 'qr-code-generated',
+        refetchInterval: (ctx) => {
+            if (ctx.state.data?.status === 'APPROVED' ||
+                ctx.state.data?.status === 'CONFIRMED' ||
+                ctx.state.data?.status === 'CANCELLED' ||
+                ctx.state.data?.status === 'REJECTED' ||
+                ctx.state.data?.status === 'FAILED') {
+                return false;
+            }
+            return 2000;
+        },
+    });
+    useEffect(() => {
+        if (query.data?.status === 'APPROVED' ||
+            query.data?.status === 'CONFIRMED') {
+            setStatus('confirmed');
+            return;
+        }
+        if (query.data?.status === 'CANCELLED' ||
+            query.data?.status === 'REJECTED' ||
+            query.data?.status === 'FAILED') {
+            setStatus('failed');
+            return;
+        }
+    }, [query.data?.status]);
+    const generateQRCode = async (input) => {
+        if (verificationStatus === 'PENDING' ||
+            verificationStatus === 'UNVERIFIED' ||
+            verificationStatus === 'REJECTED' ||
+            verificationStatus === 'CREATED') {
+            globalStore.kycVerificationStatus.setOpen(true);
+            return;
+        }
+        inputRef.current = input;
+        mutation.mutate({
+            amount: input.amount,
+            promo: input.promo ?? undefined,
+        });
+    };
+    const regenerateQRCode = async () => {
+        invariant(inputRef.current);
+        mutation.reset();
+        await new Promise((resolve) => setTimeout(resolve, 1));
+        mutation.mutate({
+            amount: inputRef.current.amount,
+            promo: inputRef.current.promo ?? undefined,
+        });
+    };
+    const reset = () => {
+        setStatus('idle');
+        setDeposit(null);
+        inputRef.current = null;
+    };
+    return {
+        status,
+        deposit,
+        generateQRCode,
+        regenerateQRCode,
+        reset,
+    };
+}

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

@@ -1,3 +1,4 @@
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 export interface DepositWithdrawalProps {
     /** @default "/terms-of-use" */
     termsOfUseUrl?: string;
@@ -8,6 +9,9 @@ export interface DepositWithdrawalProps {
     allowUnverifiedAccounts?: boolean;
     libanganRedirectionUrl?: string;
     hasPrivacyPolicyAndTermsOfUse?: boolean;
-    bypassDepositKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
+}
+export interface ExtendedDepositWithdrawalProps extends DepositWithdrawalProps {
+    bypassDepositKycCheck: boolean;
 }
 export declare function DepositWithdrawal(props: DepositWithdrawalProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/DepositWithdrawal/DepositWithdrawal.lazy.js

@@ -4,6 +4,7 @@ import { useEffect } from 'react';
 import { z } from 'zod';
 import { useShallow } from 'zustand/shallow';
 import { useBonusesQuery } from '../../client/hooks/useBonusesQuery.js';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
 import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
 import { useWalletQuery } from '../../client/hooks/useWalletQuery.js';
@@ -19,10 +20,12 @@ import { DepositWithdrawalPropsProvider } from './DepositWithdrawalContext.js';
 import { HasPendingBonuses } from './HasPendingBonuses.js';
 import { Withdrawal } from './Withdrawal/Withdrawal.js';
 export function DepositWithdrawal(props) {
+    const bypassDepositKycCheck = useBypassKycChecker(props.bypassDomains);
     const { hasPrivacyPolicyAndTermsOfUse = true, ...restProps } = props;
     const mergedProps = {
         ...restProps,
         hasPrivacyPolicyAndTermsOfUse,
+        bypassDepositKycCheck,
     };
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         depositWithdrawal: ctx.depositWithdrawal,

package/dist/components/DepositWithdrawal/DepositWithdrawalContext.d.ts

@@ -1,6 +1,6 @@
-import type { DepositWithdrawalProps } from './DepositWithdrawal.lazy';
+import type { ExtendedDepositWithdrawalProps } from './DepositWithdrawal.lazy';
 export declare const DepositWithdrawalPropsProvider: (props: {
-    value: DepositWithdrawalProps;
+    value: ExtendedDepositWithdrawalProps;
 } & {
     children?: import("react").ReactNode | undefined;
-}) => React.ReactNode, useDepositWithdrawalPropsContext: () => DepositWithdrawalProps;
+}) => React.ReactNode, useDepositWithdrawalPropsContext: () => ExtendedDepositWithdrawalProps;

package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositContext.d.ts

@@ -1,7 +1,7 @@
 export declare const OnlineBankDepositContext: (props: {
     value: {
         view: "form" | "vca";
-        status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+        status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
         deposit: import("../../../../types").Deposit | null;
@@ -14,7 +14,7 @@ export declare const OnlineBankDepositContext: (props: {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useOnlineBankDepositContext: () => {
     view: "form" | "vca";
-    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: import("../../../../types").Deposit | null;

package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/useOnlineBankDeposit.d.ts

@@ -2,7 +2,7 @@ import type { Deposit } from '../../../../types';
 export type UseOnlineBankDepositReturn = ReturnType<typeof useOnlineBankDeposit>;
 export declare function useOnlineBankDeposit(): {
     view: "form" | "vca";
-    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: Deposit | null;

package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositContext.d.ts

@@ -1,7 +1,7 @@
 export declare const QRPHDepositContext: (props: {
     value: {
         view: "form" | "qrCode";
-        status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+        status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
         deposit: import("../../../../types").Deposit | null;
@@ -14,7 +14,7 @@ export declare const QRPHDepositContext: (props: {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useQRPHDepositContext: () => {
     view: "form" | "qrCode";
-    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: import("../../../../types").Deposit | null;

package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/useQRPHDeposit.d.ts

@@ -2,7 +2,7 @@ import type { Deposit } from '../../../../types';
 export type UseQRPHDepositReturn = ReturnType<typeof useQRPHDeposit>;
 export declare function useQRPHDeposit(): {
     view: "form" | "qrCode";
-    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: Deposit | null;

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

@@ -1,4 +1,5 @@
 import { type ReactNode } from 'react';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 interface ClassNameEntries {
     root?: string;
     thumbnailRoot?: string;
@@ -8,7 +9,7 @@ export interface FavoriteGamesProps {
     className?: string | ClassNameEntries;
     /** @default 'Favorite Games' */
     heading?: string | ReactNode;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function FavoriteGames__client(props: FavoriteGamesProps): import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/FavoriteGames/FavoriteGames.client.js

@@ -6,6 +6,7 @@ import Image from 'next/image';
 import { useCallback, useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useFavoriteGamesQuery } from '../../client/hooks/useFavoriteGamesQuery.js';
 import { useFeatureFlag } from '../../client/hooks/useFeatureFlag.js';
 import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
@@ -18,6 +19,7 @@ import { Button } from '../../ui/Button/index.js';
 import { getGameImageUrl } from '../../utils/getGameImageUrl.js';
 import { GameLaunchTrigger } from '../GameLaunch/index.js';
 export function FavoriteGames__client(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const [emblaRef, emblaApi] = useEmblaCarousel({
         align: 'start',
         slidesToScroll: 3,
@@ -50,7 +52,7 @@ export function FavoriteGames__client(props) {
     const classNames = isString(props.className)
         ? { root: props.className }
         : (props.className ?? {});
-    return (_jsxs("div", { className: classNames.root, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "font-semibold text-lg", children: props.heading ?? 'Favorite Games' }), _jsx("div", { className: "grow" }), _jsx("div", { className: "flex items-center justify-center gap-xl", children: _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" }) })] }) })] }), _jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid auto-cols-[calc((100%-(0.375rem*2))/3)] grid-flow-col grid-rows-1 gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/6)] lg:gap-md'), children: games.map((game) => (_jsx(Item, { bypassKycCheck: props.bypassKycCheck, game: game, className: {
+    return (_jsxs("div", { className: classNames.root, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "font-semibold text-lg", children: props.heading ?? 'Favorite Games' }), _jsx("div", { className: "grow" }), _jsx("div", { className: "flex items-center justify-center gap-xl", children: _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" }) })] }) })] }), _jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid auto-cols-[calc((100%-(0.375rem*2))/3)] grid-flow-col grid-rows-1 gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/6)] lg:gap-md'), children: games.map((game) => (_jsx(Item, { bypassKycCheck: isBypass, game: game, className: {
                             thumbnailRoot: classNames.thumbnailRoot,
                             thumbnailTitle: classNames.thumbnailTitle,
                         } }, game.id))) }) })] }));

package/dist/components/Games/GamesCarousel.client.d.ts

@@ -1,5 +1,6 @@
 import type { ImageProps } from 'next/image';
 import { type ReactNode } from 'react';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GamesInput__Next } from '../../services/cmsPortal';
 import type { GameProvider } from '../../types';
 interface ClassNameEntries {
@@ -24,7 +25,7 @@ export interface GamesCarouselProps {
     sort?: GamesInput__Next['sort'];
     className?: string | ClassNameEntries;
     fallbackThumbnails?: Partial<Record<GameProvider, ImageProps['src']>>;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function GamesCarousel__client(props: GamesCarouselProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Games/GamesCarousel.client.js

@@ -5,6 +5,7 @@ import { isString } from 'lodash-es';
 import Link from 'next/link';
 import { useCallback, useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { ArrowLeftIcon } from '../../icons/ArrowLeftIcon.js';
 import { ArrowRightIcon } from '../../icons/ArrowRightIcon.js';
@@ -16,6 +17,7 @@ import { Empty } from '../shared/Empty.js';
 import { Game } from './Game.js';
 import { GameContext, GamesPropsContext } from './GamesContext.js';
 export function GamesCarousel__client(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const numOfRows = props.numOfRows ?? 1;
     const gamesQuery = useGamesQuery({
         first: (numOfRows + 1) * 6,
@@ -63,7 +65,7 @@ export function GamesCarousel__client(props) {
                             ? 'grid-rows-3'
                             : numOfRows === 2
                                 ? 'grid-rows-2'
-                                : 'grid-rows-1'), children: games.map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: props.bypassKycCheck, badge: props.badge, className: {
+                                : 'grid-rows-1'), children: games.map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: isBypass, badge: props.badge, className: {
                                     root: classNames.thumbnailRoot,
                                     title: classNames.thumbnailTitle,
                                 } }) }, game.id))) }) }))] }) }));

package/dist/components/Games/GamesList.client.d.ts

@@ -1,5 +1,6 @@
 import type { ImageProps } from 'next/image';
 import type { ReactNode } from 'react';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GamesInput__Next } from '../../services/cmsPortal';
 import type { GameProvider } from '../../types';
 interface ClassNameEntries {
@@ -24,7 +25,7 @@ export interface GamesListProps {
     className?: string | ClassNameEntries;
     pagination?: 'lazy-load' | 'paginated';
     fallbackThumbnails?: Partial<Record<GameProvider, ImageProps['src']>>;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function GamesList__client(props: GamesListProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Games/GamesList.client.js

@@ -4,6 +4,7 @@ import { isString, noop } from 'lodash-es';
 import Link from 'next/link';
 import { useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { useInfiniteQueryHelper } from '../../client/hooks/useInfiniteQueryHelper.js';
 import { ChevronLeftIcon } from '../../icons/ChevronLeftIcon.js';
@@ -16,6 +17,7 @@ import { Game } from './Game.js';
 import { GameContext, GamesPropsContext } from './GamesContext.js';
 import { GamesPagination } from './GamesPagination.js';
 export function GamesList__client(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const { pagination = 'lazy-load' } = props;
     const perPage = props.first ?? 24;
     const { loading, availableRows, totalRows, totalAvailableRows, hasNextPage, next, } = useInfiniteQueryHelper(useGamesQuery, {
@@ -50,7 +52,7 @@ export function GamesList__client(props) {
                                 ? props.heading.replaceAll('OneAPI', '')
                                 : (props.heading ?? 'Games') }), props.viewGameProvidersUrl && (_jsxs(Link, { href: props.viewGameProvidersUrl, className: "order-1 flex items-center gap-sm font-semibold text-button-tertiary-fg text-lg lg:order-none lg:text-sm", children: [_jsx(ChevronLeftIcon, { className: "size-5" }), "Back to all Providers"] }))] }), totalRows <= 0 && (_jsx(Empty, { icon: loading ? SpinnerIcon : GamingPad01Icon, title: loading ? 'Just a moment' : 'No games', message: loading
                         ? 'Fetching latest games...'
-                        : 'No game is currently available. Please check back later', className: "mt-lg" })), totalRows >= 1 && (_jsxs(_Fragment, { children: [_jsx("div", { className: "mt-lg grid grid-cols-3 gap-1.5 lg:grid-cols-6 lg:gap-2.5", children: (pagination === 'paginated' ? paginatedRows : availableRows).map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: props.bypassKycCheck, badge: props.badge, className: {
+                        : 'No game is currently available. Please check back later', className: "mt-lg" })), totalRows >= 1 && (_jsxs(_Fragment, { children: [_jsx("div", { className: "mt-lg grid grid-cols-3 gap-1.5 lg:grid-cols-6 lg:gap-2.5", children: (pagination === 'paginated' ? paginatedRows : availableRows).map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: isBypass, badge: props.badge, className: {
                                         root: classNames.thumbnailRoot,
                                         title: classNames.thumbnailTitle,
                                     } }) }, game.id))) }), _jsx("div", { className: "mt-2xl flex flex-col items-center lg:mt-3xl", children: pagination === 'paginated' && totalRows > 0 ? (_jsx(GamesPagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (page) => {

package/dist/components/GamesSearch/GamesSearch.d.ts

@@ -1,3 +1,4 @@
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GamesInput__Next } from '../../services/cmsPortal';
 export interface ClassNameEntries {
     root?: string;
@@ -11,7 +12,7 @@ interface GamesSearchProps {
     sort?: GamesInput__Next['sort'];
     className?: string | ClassNameEntries;
     placeholder?: string;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function GamesSearch(props: GamesSearchProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/GamesSearch/GamesSearch.js

@@ -5,6 +5,7 @@ import { isString } from 'lodash-es';
 import Image from 'next/image';
 import { useState } from 'react';
 import { twMerge } from 'tailwind-merge';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { SearchLgIcon } from '../../icons/SearchLgIcon.js';
 import { Button } from '../../ui/Button/index.js';
@@ -14,6 +15,7 @@ import { Presence } from '../../ui/Presence/index.js';
 import { getGameImageUrl } from '../../utils/getGameImageUrl.js';
 import { GameLaunchTrigger } from '../GameLaunch/index.js';
 export function GamesSearch(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const [search, setSearch] = useState('');
     const gamesQuery = useGamesQuery({
         first: props.first ?? 18,
@@ -44,7 +46,7 @@ export function GamesSearch(props) {
                                         api.setInputValue('');
                                         api.focus();
                                     }, children: "Clear" }));
-                            } })] }), _jsx(Portal, { children: _jsx(Combobox.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsx(Presence, { present: api.open, children: _jsx("div", { className: "fixed inset-0 z-40 bg-black/50 backdrop-blur-sm", onClick: () => api.setOpen(false) }) }), _jsx(Combobox.Positioner, { children: search.trim().length > 0 && (_jsx(Combobox.Content, { className: "z-50 max-h-[33.25rem] overflow-y-auto p-0", children: search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [games.length <= 0 && (_jsx(Alert, { message: "No results found" })), games.length > 0 && (_jsxs("div", { className: "p-xl", children: [_jsx(Combobox.Context, { children: (api) => (_jsx("div", { className: "grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: props.bypassKycCheck, game: game, onClick: () => {
+                            } })] }), _jsx(Portal, { children: _jsx(Combobox.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsx(Presence, { present: api.open, children: _jsx("div", { className: "fixed inset-0 z-40 bg-black/50 backdrop-blur-sm", onClick: () => api.setOpen(false) }) }), _jsx(Combobox.Positioner, { children: search.trim().length > 0 && (_jsx(Combobox.Content, { className: "z-50 max-h-[33.25rem] overflow-y-auto p-0", children: search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [games.length <= 0 && (_jsx(Alert, { message: "No results found" })), games.length > 0 && (_jsxs("div", { className: "p-xl", children: [_jsx(Combobox.Context, { children: (api) => (_jsx("div", { className: "grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: isBypass, game: game, onClick: () => {
                                                                         api.setOpen(false);
                                                                     }, className: twMerge('block w-full shadow-sm', classNames.thumbnailRoot), children: [_jsx(Image, { src: getGameImageUrl({
                                                                                 reference: game.reference,

package/dist/components/KYC/KYCVerificationStatus.lazy.js

@@ -19,18 +19,15 @@ export function KYCVerificationStatus() {
     const icons = status === 'PENDING' ? bellIcon : alertIcon;
     return (_jsx(Dialog.Root, { open: globalStore.kycVerificationStatus.open, onOpenChange: (details) => {
             globalStore.kycVerificationStatus.setOpen(details.open);
-        }, closeOnEscape: false, closeOnInteractOutside: false, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsx(Dialog.Content, { className: "mx-auto h-fit w-[450px] overflow-y-auto rounded-lg bg-bg-primary", children: _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mb-3xl grid h-[200px] w-full place-items-center rounded-xl bg-radial from-40% from-button-primary-bg to-bg-brand-solid", children: _jsx(Image, { src: icons, alt: "icon", className: "w-60 object-contain", draggable: false, width: 120, height: 120 }) }), _jsxs("h1", { className: "font-semibold text-lg text-white", children: [status === 'PENDING' && 'Verification in Progress', status === 'REJECTED' && 'Verification Rejected', status === 'UNVERIFIED' ||
-                                            (status === 'CREATED' && 'Verification Required')] }), _jsxs("p", { className: "mb-4xl text-[#94969C] text-base", children: [status === 'PENDING' &&
+        }, closeOnEscape: false, closeOnInteractOutside: false, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsx(Dialog.Content, { className: "mx-auto h-fit w-[450px] overflow-y-auto rounded-lg bg-bg-primary", children: _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mb-3xl grid h-[200px] w-full place-items-center rounded-xl bg-radial from-40% from-button-primary-bg to-bg-brand-solid", children: _jsx(Image, { src: icons, alt: "icon", className: "w-60 object-contain", draggable: false, width: 120, height: 120 }) }), _jsxs("h1", { className: "font-semibold text-lg text-white", children: [status === 'PENDING' && 'Verification in Progress', status === 'REJECTED' && 'Verification Rejected', status === 'UNVERIFIED' && 'Verification Required'] }), _jsxs("p", { className: "mb-4xl text-[#94969C] text-base", children: [status === 'PENDING' &&
                                             `Your account verification is still under review. Please wait
 								until it's approved before you can continue playing or
 								depositing.`, status === 'REJECTED' &&
-                                            'Your account verification was not approved. Please resubmit your verification to regain full access.', status === 'UNVERIFIED' ||
-                                            (status === 'CREATED' &&
-                                                'Your account is not yet verified. Please complete the verification process to continue playing or depositing.')] }), _jsxs(Button, { variant: "solid", className: twMerge('mb-2 w-full', status === 'PENDING' && 'hidden'), onClick: () => {
+                                            'Your account verification was not approved. Please resubmit your verification to regain full access.', status === 'UNVERIFIED' &&
+                                            'Your account is not yet verified. Please complete the verification process to continue playing or depositing.'] }), _jsxs(Button, { variant: "solid", className: twMerge('mb-2 w-full', status === 'PENDING' && 'hidden'), onClick: () => {
                                         globalStore.kycVerificationStatus.setOpen(false);
                                         globalStore.kyc.setOpen(true);
-                                    }, children: [status === 'REJECTED' && 'Resubmit Verification', status === 'UNVERIFIED' ||
-                                            (status === 'CREATED' && 'Verify Now')] }), _jsx(Button, { type: "button", variant: "outline", onClick: () => {
+                                    }, children: [status === 'REJECTED' && 'Resubmit Verification', status === 'UNVERIFIED' && 'Verify Now'] }), _jsx(Button, { type: "button", variant: "outline", onClick: () => {
                                         globalStore.kycVerificationStatus.setOpen(false);
                                     }, children: "Close" })] }) }) })] }) }));
 }

package/dist/components/PortalProvider/CXDTokenObserver.js

@@ -1,30 +1,30 @@
 'use client';
 import { addHours } from 'date-fns';
 import { clamp } from 'lodash-es';
+import { useSearchParams } from 'next/navigation';
 import { useLocalStorage, useTimeout } from 'usehooks-ts';
 import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
 export function CXDTokenObserver() {
-    const { data: account } = useAccountQuery();
-    const accountCxd = {
-        cxd: account?.cellxpertDetails?.cxd,
-    };
-    const [cxd, setCxd, removeCxd] = useLocalStorage('cxd', null);
+    const searchParams = useSearchParams();
+    const cxdToken = searchParams.get('cxd');
+    const accountQuery = useAccountQuery();
+    const account = accountQuery.data;
+    const [cxd, setCxd, removeCxd] = useLocalStorage('WebPortalCellxpertCxd', null);
     const now = new Date();
+    const shouldTimeoutRun = cxdToken && account;
     const removeCxdUntilInMs = cxd?.timestamp
         ? clamp(cxd.timestamp - now.getTime(), 0, Infinity)
         : 0;
     useTimeout(() => {
-        const isSame = cxd?.cxd === accountCxd.cxd;
+        const isSame = cxd?.cxd === cxdToken;
         if (!isSame) {
             const extendedTimestamp = addHours(new Date(), 6).getTime();
             setCxd({
-                cxd: accountCxd.cxd,
+                cxd: cxdToken,
                 timestamp: extendedTimestamp,
             });
         }
-    }, account ? 100 : null);
-    useTimeout(() => {
-        removeCxd();
-    }, account ? removeCxdUntilInMs : null);
+    }, shouldTimeoutRun ? 100 : null);
+    useTimeout(() => removeCxd(), shouldTimeoutRun ? removeCxdUntilInMs : null);
     return null;
 }

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

@@ -1,4 +1,5 @@
 import { type ImageProps } from 'next/image';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GameProvider, GameProviderData, GameType } from '../../types';
 export interface ClassNameEntries {
     root?: string;
@@ -26,6 +27,6 @@ export interface SearchProps {
     viewGamesUrl?: string | ((gameProvider: GameProviderData) => string);
     gameProviderImages?: Partial<Record<GameProvider, ImageProps['src']>>;
     placeholder?: string;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function Search(props: SearchProps): import("react/jsx-runtime").JSX.Element;

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

@@ -7,6 +7,7 @@ import { useEffect, useRef, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useDebounceCallback } from 'usehooks-ts';
 import { useShallow } from 'zustand/shallow';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useControllableState } from '../../client/hooks/useControllableState.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
@@ -29,6 +30,7 @@ function lookup(value, compare) {
         .includes(compare.toLowerCase().replace(/\s+/g, ''));
 }
 export function Search(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         search: ctx.search,
     })));
@@ -77,7 +79,7 @@ export function Search(props) {
                                                 }, children: "Clear" }) })] }) }), _jsx("div", { className: "flex max-h-[85dvh] min-h-0 flex-1 flex-col", children: _jsx("div", { className: "mt-2xl p-xl pb-3xl lg:mt-2 lg:max-h-[41rem] lg:overflow-y-auto lg:rounded-xl lg:border lg:border-border-primary lg:bg-bg-primary", children: search.length <= 0 ? (_jsx(Alert, { message: "Search for your favorite game or provider." })) : search.length === 1 ? (_jsx(Alert, { message: "Search requires at least 2 characters." })) : (_jsxs(_Fragment, { children: [empty && _jsx(Alert, { message: "No results found" }), !empty && (_jsxs(_Fragment, { children: [gameProviders.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "font-semibold text-lg", children: "Providers" }), _jsx("div", { className: "mt-3.5 mb-3xl 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('flex h-14 w-full items-center rounded-md bg-brand-800', classNames.providerThumbnailRoot), onClick: () => {
                                                                         globalStore.search.setOpen(false);
                                                                     }, children: _jsx(Image, { src: props.gameProviderImages?.[provider.id] ??
-                                                                            provider.logo, alt: "", width: 100, height: 50, className: twMerge('mx-auto h-auto w-full', classNames.providerThumbnailImage) }) }, provider.id))) })] })), games.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "font-semibold text-lg", children: "Games" }), _jsx("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: props.bypassKycCheck, game: game, className: twMerge('block w-full shadow-sm', classNames.gameThumbnailRoot), onClick: () => {
+                                                                            provider.logo, alt: "", width: 100, height: 50, className: twMerge('mx-auto h-auto w-full', classNames.providerThumbnailImage) }) }, provider.id))) })] })), games.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "font-semibold text-lg", children: "Games" }), _jsx("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: isBypass, game: game, className: twMerge('block w-full shadow-sm', classNames.gameThumbnailRoot), onClick: () => {
                                                                         globalStore.search.setOpen(false);
                                                                     }, children: [_jsx(Image, { src: getGameImageUrl({
                                                                                 reference: game.reference,

package/dist/icons/LinkBrokenIcon.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentPropsWithRef } from 'react';
+export declare function LinkBrokenIcon(props: ComponentPropsWithRef<'svg'>): import("react/jsx-runtime").JSX.Element;

package/dist/icons/LinkBrokenIcon.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function LinkBrokenIcon(props) {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", ...props, children: _jsx("path", { d: "M8.5 15.5L15.5 8.49998M9 4V2M15 20V22M4 9H2M20 15H22M4.91421 4.91421L3.5 3.5M19.0858 19.0857L20.5 20.4999M12 17.6568L9.87871 19.7781C8.31662 21.3402 5.78396 21.3402 4.22186 19.7781C2.65976 18.216 2.65976 15.6833 4.22186 14.1212L6.34318 11.9999M17.6569 11.9999L19.7782 9.87859C21.3403 8.31649 21.3403 5.78383 19.7782 4.22174C18.2161 2.65964 15.6835 2.65964 14.1214 4.22174L12 6.34306", stroke: "#FEDF89", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
+}

package/dist/ui/Avatar/Avatar.d.ts

@@ -6,21 +6,21 @@ export declare const Root: import("react").ComponentType<import("@ark-ui/react")
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, {
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, {
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, import("tailwind-variants").TVReturnType<{
+}, Record<"image" | "root" | "fallback", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
 export declare const Image: import("react").ComponentType<import("@ark-ui/react").Assign<Avatar.ImageProps & import("react").RefAttributes<HTMLImageElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
@@ -28,21 +28,21 @@ export declare const Image: import("react").ComponentType<import("@ark-ui/react"
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, {
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, {
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, import("tailwind-variants").TVReturnType<{
+}, Record<"image" | "root" | "fallback", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
 export declare const Fallback: import("react").ComponentType<import("@ark-ui/react").Assign<Avatar.FallbackProps & import("react").RefAttributes<HTMLSpanElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
@@ -50,19 +50,19 @@ export declare const Fallback: import("react").ComponentType<import("@ark-ui/rea
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, {
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, {
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, import("tailwind-variants").TVReturnType<{
+}, Record<"image" | "root" | "fallback", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
 export declare const Context: (props: Avatar.ContextProps) => import("react").ReactNode;

package/dist/ui/Avatar/avatar.recipe.d.ts

@@ -5,18 +5,18 @@ export declare const avatarRecipe: import("tailwind-variants").TVReturnType<{
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, {
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, {
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, import("tailwind-variants").TVReturnType<{
+}, Record<"image" | "root" | "fallback", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             root: string;
             fallback: string;
         };
     };
-}, Record<"image" | "fallback" | "root", string | string[]>, undefined, unknown, unknown, undefined>>;
+}, Record<"image" | "root" | "fallback", string | string[]>, undefined, unknown, unknown, undefined>>;