@opexa/portal-components 0.0.826 → 0.0.827

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

@@ -5,7 +5,9 @@ import { useCreateQRPHDepositMutation } from '../../../../client/hooks/useCreate
 import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
 import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
 import { useMemberVerificationQuery } from '../../../../client/hooks/useMemberVerificationQuery.js';
+import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
 export function useQRPHDeposit() {
+    const depositWithdrawalProps = useDepositWithdrawalPropsContext();
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         kycVerificationStatus: ctx.kycVerificationStatus,
     })));
@@ -54,10 +56,11 @@ export function useQRPHDeposit() {
         }
     }, [query.data?.status]);
     const generateQRCode = async (input) => {
-        if (verificationStatus === 'PENDING' ||
-            verificationStatus === 'UNVERIFIED' ||
-            verificationStatus === 'REJECTED' ||
-            verificationStatus === 'CREATED') {
+        if (!depositWithdrawalProps.bypassDepositKycCheck &&
+            (verificationStatus === 'PENDING' ||
+                verificationStatus === 'UNVERIFIED' ||
+                verificationStatus === 'REJECTED' ||
+                verificationStatus === 'CREATED')) {
             globalStore.kycVerificationStatus.setOpen(true);
             return;
         }

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositContext.d.ts

@@ -1,7 +1,7 @@
 export declare const QRPHDepositContext: (props: {
     value: {
         view: "form" | "qrCode";
-        status: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+        status: "waiting" | "processing" | "failed" | "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: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: import("../../../../types").Deposit | null;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/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: "failed" | "waiting" | "processing" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
+    status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;
     deposit: Deposit | null;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__next/QRPHDepositContext.d.ts

@@ -1,6 +1,6 @@
 export declare const QRPHDepositContext: (props: {
     value: {
-        status: "idle" | "confirmed" | "failed" | "generating-qr-code" | "qr-code-generated";
+        status: "idle" | "generating-qr-code" | "qr-code-generated" | "failed" | "confirmed";
         deposit: import("../../../../types").Deposit | null;
         generateQRCode: (input: import("./useQRPHDeposit").GenerateQRCodeInput) => Promise<void>;
         regenerateQRCode: () => Promise<void>;
@@ -9,7 +9,7 @@ export declare const QRPHDepositContext: (props: {
 } & {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useQRPHDepositContext: () => {
-    status: "idle" | "confirmed" | "failed" | "generating-qr-code" | "qr-code-generated";
+    status: "idle" | "generating-qr-code" | "qr-code-generated" | "failed" | "confirmed";
     deposit: import("../../../../types").Deposit | null;
     generateQRCode: (input: import("./useQRPHDeposit").GenerateQRCodeInput) => Promise<void>;
     regenerateQRCode: () => Promise<void>;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__next/useQRPHDeposit.d.ts

@@ -5,7 +5,7 @@ export interface GenerateQRCodeInput {
     promo?: string | null;
 }
 export declare function useQRPHDeposit(): {
-    status: "idle" | "confirmed" | "failed" | "generating-qr-code" | "qr-code-generated";
+    status: "idle" | "generating-qr-code" | "qr-code-generated" | "failed" | "confirmed";
     deposit: Deposit | null;
     generateQRCode: (input: GenerateQRCodeInput) => Promise<void>;
     regenerateQRCode: () => Promise<void>;

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

@@ -8,5 +8,6 @@ export interface DepositWithdrawalProps {
     allowUnverifiedAccounts?: boolean;
     libanganRedirectionUrl?: string;
     hasPrivacyPolicyAndTermsOfUse?: boolean;
+    bypassDepositKycCheck?: boolean;
 }
 export declare function DepositWithdrawal(props: DepositWithdrawalProps): import("react/jsx-runtime").JSX.Element;

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/DigitainLauncher/Loading.d.ts

@@ -0,0 +1 @@
+export declare function Loading(): import("react/jsx-runtime").JSX.Element;

package/dist/components/DigitainLauncher/Loading.js

@@ -0,0 +1,5 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function Loading() {
+    return (_jsx("div", { className: "flex h-[calc(100vh-400px)] w-full items-center justify-center px-4", children: _jsxs("div", { className: "flex flex-col items-center space-y-4", children: [_jsx("div", { className: "h-10 w-10 animate-spin rounded-full border-4 border-blue-500 border-t-transparent" }), _jsx("p", { className: "font-medium text-gray-700 text-lg", children: "Loading Sports Book\u2026" })] }) }));
+}

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

@@ -8,6 +8,7 @@ export interface FavoriteGamesProps {
     className?: string | ClassNameEntries;
     /** @default 'Favorite Games' */
     heading?: string | ReactNode;
+    bypassKycCheck?: boolean;
 }
 export declare function FavoriteGames__client(props: FavoriteGamesProps): import("react/jsx-runtime").JSX.Element | null;
 export {};

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

@@ -50,12 +50,12 @@ 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, { 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: props.bypassKycCheck, game: game, className: {
                             thumbnailRoot: classNames.thumbnailRoot,
                             thumbnailTitle: classNames.thumbnailTitle,
                         } }, game.id))) }) })] }));
 }
-function Item({ game, className, }) {
+function Item({ game, bypassKycCheck, className, }) {
     const featureFlag = useFeatureFlag();
     const sessionQuery = useSessionQuery();
     const session = sessionQuery.data;
@@ -78,7 +78,7 @@ function Item({ game, className, }) {
         : featureFlag.enabled
             ? account?.status !== 'VERIFICATION_LOCKED'
             : true;
-    return (_jsxs(GameLaunchTrigger, { game: game, className: twMerge('hover:-translate-y-1 relative block w-full animate-scale-in shadow-sm transition-transform duration-200', className?.thumbnailRoot), children: [markUnmarkGameAsFavoriteEnabled && (_jsx("div", { role: "button", tabIndex: 0, onClick: (e) => {
+    return (_jsxs(GameLaunchTrigger, { bypassKycCheck: bypassKycCheck, game: game, className: twMerge('hover:-translate-y-1 relative block w-full animate-scale-in shadow-sm transition-transform duration-200', className?.thumbnailRoot), children: [markUnmarkGameAsFavoriteEnabled && (_jsx("div", { role: "button", tabIndex: 0, onClick: (e) => {
                     e.preventDefault();
                     e.stopPropagation();
                     if (unmarkGameAsFavoriteMutation.isPending)

package/dist/components/GameLaunch/GameLaunchTrigger.d.ts

@@ -3,5 +3,6 @@ import type { FavoriteGame, Game } from '../../types';
 export interface GameLaunchTriggerProps extends HTMLArkProps<'button'> {
     game: Game | FavoriteGame;
     asChild?: boolean;
+    bypassKycCheck?: boolean;
 }
 export declare function GameLaunchTrigger(props: GameLaunchTriggerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/GameLaunch/GameLaunchTrigger.js

@@ -18,6 +18,7 @@ import { getQueryClient } from '../../utils/getQueryClient.js';
 import { getSessionQueryKey } from '../../utils/queryKeys.js';
 import { LOCALSTORAGE_PUSH_NOTIFICATION_TOKEN_KEY } from '../PortalProvider/PushNotifications.js';
 export function GameLaunchTrigger(props) {
+    console.log('props', props.bypassKycCheck);
     const sessionQuery = useSessionQuery();
     const verificationQuery = useMemberVerificationQuery();
     const createGameSessionMutation = useCreateGameSessionMutation();
@@ -142,10 +143,11 @@ export function GameLaunchTrigger(props) {
                 return props.onClick?.(e);
             }
             //handle new kyc process to play only on verified members only
-            if (verificationStatus === 'PENDING' ||
-                verificationStatus === 'REJECTED' ||
-                verificationStatus === 'UNVERIFIED' ||
-                verificationStatus === 'CREATED') {
+            if (!props.bypassKycCheck &&
+                (verificationStatus === 'PENDING' ||
+                    verificationStatus === 'REJECTED' ||
+                    verificationStatus === 'UNVERIFIED' ||
+                    verificationStatus === 'CREATED')) {
                 globalStore.kycVerificationStatus.setOpen(true);
                 return;
             }

package/dist/components/Games/Game.d.ts

@@ -5,6 +5,7 @@ interface ClassNameEntries {
 export interface GameProps {
     badge?: 'top' | 'new' | 'popular';
     className?: string | ClassNameEntries;
+    bypassKycCheck?: boolean;
 }
 export declare function Game(props: GameProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Games/Game.js

@@ -59,7 +59,7 @@ export function Game(props) {
         : featureFlag.enabled
             ? account?.status !== 'VERIFICATION_LOCKED'
             : true;
-    return (_jsxs(GameLaunchTrigger, { game: game, className: twMerge('group md:hover:-translate-y-1 relative block w-full animate-scale-in shadow-sm transition-transform duration-200', classNames.root), "aria-label": `Play ${game.name} game`, children: [props.badge === 'new' && (_jsx(BadgeNew, { className: "absolute top-0 left-0 size-[3.75rem]" })), props.badge === 'top' && (_jsx(BadgeTop, { className: "absolute top-0 left-0 size-[3.75rem]" })), props.badge === 'popular' && (_jsx(BadgePopular, { className: "absolute top-0 left-0 size-[3.75rem]" })), markUnmarkGameAsFavoriteEnabled && (_jsx("div", { role: "button", tabIndex: 0, onClick: (e) => {
+    return (_jsxs(GameLaunchTrigger, { bypassKycCheck: props.bypassKycCheck, game: game, className: twMerge('group md:hover:-translate-y-1 relative block w-full animate-scale-in shadow-sm transition-transform duration-200', classNames.root), "aria-label": `Play ${game.name} game`, children: [props.badge === 'new' && (_jsx(BadgeNew, { className: "absolute top-0 left-0 size-[3.75rem]" })), props.badge === 'top' && (_jsx(BadgeTop, { className: "absolute top-0 left-0 size-[3.75rem]" })), props.badge === 'popular' && (_jsx(BadgePopular, { className: "absolute top-0 left-0 size-[3.75rem]" })), markUnmarkGameAsFavoriteEnabled && (_jsx("div", { role: "button", tabIndex: 0, onClick: (e) => {
                     e.preventDefault();
                     e.stopPropagation();
                     if (markGameAsFavoriteMutation.isPending)

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

@@ -24,6 +24,7 @@ export interface GamesCarouselProps {
     sort?: GamesInput__Next['sort'];
     className?: string | ClassNameEntries;
     fallbackThumbnails?: Partial<Record<GameProvider, ImageProps['src']>>;
+    bypassKycCheck?: boolean;
 }
 export declare function GamesCarousel__client(props: GamesCarouselProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -63,7 +63,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, { badge: props.badge, className: {
+                                : 'grid-rows-1'), children: games.map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: props.bypassKycCheck, badge: props.badge, className: {
                                     root: classNames.thumbnailRoot,
                                     title: classNames.thumbnailTitle,
                                 } }) }, game.id))) }) }))] }) }));

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

@@ -24,6 +24,7 @@ export interface GamesListProps {
     className?: string | ClassNameEntries;
     pagination?: 'lazy-load' | 'paginated';
     fallbackThumbnails?: Partial<Record<GameProvider, ImageProps['src']>>;
+    bypassKycCheck?: boolean;
 }
 export declare function GamesList__client(props: GamesListProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -50,7 +50,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, { 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: props.bypassKycCheck, 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

@@ -11,6 +11,7 @@ interface GamesSearchProps {
     sort?: GamesInput__Next['sort'];
     className?: string | ClassNameEntries;
     placeholder?: string;
+    bypassKycCheck?: boolean;
 }
 export declare function GamesSearch(props: GamesSearchProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/GamesSearch/GamesSearch.js

@@ -44,7 +44,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, { 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: props.bypassKycCheck, 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/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css

@@ -0,0 +1,184 @@
+@keyframes arrow-green-flash {
+  0% {
+    color: #abefc6;
+  }
+  100% {
+    color: #079455;
+  }
+}
+
+.animate-arrow-green-flash-1 {
+  animation: arrow-green-flash 0.4s infinite;
+  animation-delay: -0.2s;
+}
+
+.animate-arrow-green-flash-2 {
+  animation: arrow-green-flash 0.4s infinite;
+  animation-delay: -0.1s;
+}
+
+.animate-arrow-green-flash-3 {
+  animation: arrow-green-flash 0.4s infinite;
+}
+
+@keyframes arrow-red-flash {
+  0%,
+  100% {
+    color: #f97066;
+  }
+  50% {
+    color: #fecdca;
+  }
+}
+
+.animate-arrow-red-flash-1 {
+  animation: arrow-red-flash 0.4s infinite;
+}
+
+.animate-arrow-red-flash-2 {
+  animation: arrow-red-flash 0.4s infinite;
+  animation-delay: -0.1s;
+}
+
+.animate-arrow-red-flash-3 {
+  animation: arrow-red-flash 0.4s infinite;
+  animation-delay: -0.2s;
+}
+
+/* Animated BG */
+@keyframes rotate {
+  to {
+    transform: rotate(1turn);
+  }
+}
+
+.light-rays {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+
+  --first: var(--color-bg-tertiary);
+  --second: var(--color-bg-quaternary);
+}
+
+.light-rays::before,
+.light-rays::after {
+  content: '';
+  position: absolute;
+  top: var(--light-rays-top, 150px);
+  left: calc(50% - 90px);
+  margin: -100vmax;
+  width: 200vmax;
+  height: 200vmax;
+  opacity: 0.6;
+  transform-origin: center;
+}
+
+.light-rays::before {
+  background: conic-gradient(
+    var(--first) 0deg 7.2deg,
+    var(--second) 7.2deg 14.4deg,
+    var(--first) 14.4deg 21.6deg,
+    var(--second) 21.6deg 28.8deg,
+    var(--first) 28.8deg 36deg,
+    var(--second) 36deg 43.2deg,
+    var(--first) 43.2deg 50.4deg,
+    var(--second) 50.4deg 57.6deg,
+    var(--first) 57.6deg 64.8deg,
+    var(--second) 64.8deg 72deg,
+    var(--first) 72deg 79.2deg,
+    var(--second) 79.2deg 86.4deg,
+    var(--first) 86.4deg 93.6deg,
+    var(--second) 93.6deg 100.8deg,
+    var(--first) 100.8deg 108deg,
+    var(--second) 108deg 115.2deg,
+    var(--first) 115.2deg 122.4deg,
+    var(--second) 122.4deg 129.6deg,
+    var(--first) 129.6deg 136.8deg,
+    var(--second) 136.8deg 144deg,
+    var(--first) 144deg 151.2deg,
+    var(--second) 151.2deg 158.4deg,
+    var(--first) 158.4deg 165.6deg,
+    var(--second) 165.6deg 172.8deg,
+    var(--first) 172.8deg 180deg,
+    var(--second) 180deg 187.2deg,
+    var(--first) 187.2deg 194.4deg,
+    var(--second) 194.4deg 201.6deg,
+    var(--first) 201.6deg 208.8deg,
+    var(--second) 208.8deg 216deg,
+    var(--first) 216deg 223.2deg,
+    var(--second) 223.2deg 230.4deg,
+    var(--first) 230.4deg 237.6deg,
+    var(--second) 237.6deg 244.8deg,
+    var(--first) 244.8deg 252deg,
+    var(--second) 252deg 259.2deg,
+    var(--first) 259.2deg 266.4deg,
+    var(--second) 266.4deg 273.6deg,
+    var(--first) 273.6deg 280.8deg,
+    var(--second) 280.8deg 288deg,
+    var(--first) 288deg 295.2deg,
+    var(--second) 295.2deg 302.4deg,
+    var(--first) 302.4deg 309.6deg,
+    var(--second) 309.6deg 316.8deg,
+    var(--first) 316.8deg 324deg,
+    var(--second) 324deg 331.2deg,
+    var(--first) 331.2deg 338.4deg,
+    var(--second) 338.4deg 345.6deg,
+    var(--first) 345.6deg 352.8deg,
+    var(--second) 352.8deg 360deg
+  );
+  animation: rotate 20s linear infinite;
+}
+
+@media (max-width: 1024px) {
+  .light-rays::before,
+  .light-rays::after {
+    left: auto;
+    right: 11%;
+  }
+}
+
+/* ScrollArea.module.css */
+.scrollArea {
+  overflow-y: scroll;
+  padding-right: 4px;
+}
+
+/* WebKit-based browsers */
+.scrollArea::-webkit-scrollbar {
+  width: 8px;
+}
+
+.scrollArea::-webkit-scrollbar-track {
+  background: var(--color-bg-primary-alt);
+  border-radius: 9999px;
+}
+
+.scrollArea::-webkit-scrollbar-thumb {
+  background-color: var(--color-bg-quaternary);
+  border-radius: 9999px;
+}
+
+@keyframes waveColor {
+  0%,
+  2.5% {
+    color: var(--wave-highlight-color);
+  }
+  2.51%,
+  100% {
+    color: var(--color-brand-300);
+  }
+}
+
+.animate-wave-color-success {
+  --wave-highlight-color: var(--color-success-800);
+  animation: waveColor 4s ease-in-out infinite;
+}
+
+.animate-wave-color-error {
+  --wave-highlight-color: var(--color-error-600);
+  animation: waveColor 4s ease-in-out infinite;
+}