@opexa/portal-components 0.0.271 → 0.0.274
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client/hooks/useCamera.d.ts +1 -1
- package/dist/client/hooks/useCamera.js +51 -43
- package/dist/client/hooks/usePxToRemConverter.d.ts +2 -0
- package/dist/client/hooks/usePxToRemConverter.js +18 -0
- package/dist/client/hooks/useRect.d.ts +5 -0
- package/dist/client/hooks/useRect.js +45 -0
- package/dist/components/Bonus/Bonus.client.js +1 -1
- package/dist/components/Cashback/Cashback.client.js +1 -1
- package/dist/components/CustomPromo/CustomPromo.js +1 -1
- package/dist/components/GameLaunch/GameLaunch.lazy.js +1 -1
- package/dist/components/GamesSearch/GamesSearch.js +1 -1
- package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css +184 -184
- package/dist/components/Jackpots/JackpotsList/JackpotsListItem.module.css +184 -184
- package/dist/components/KYC/AutoOpen.js +3 -8
- package/dist/components/KYC/KYCReminder.lazy.js +2 -0
- package/dist/components/KYC/utils.js +18 -18
- package/dist/components/Messages/Message.js +3 -2
- package/dist/components/Messages/MessagePopup.js +3 -2
- package/dist/components/Messages/MessagesPopup.js +4 -2
- package/dist/components/News/News.js +1 -1
- package/dist/components/PortalProvider/FeatureFlag.js +1 -1
- package/dist/components/Promo/Promo.client.js +1 -1
- package/dist/components/Search/Search.lazy.js +1 -1
- package/dist/components/SignUp/SignUpForm.js +0 -4
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/IdFrontImageField.client.d.ts +15 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/IdFrontImageField.client.js +100 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/IdFrontImageField.d.ts +2 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/IdFrontImageField.js +11 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/IdFrontImageFieldContext.d.ts +6 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/IdFrontImageFieldContext.js +2 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/index.d.ts +1 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/index.js +1 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/useIdFrontImageField.d.ts +18 -0
- package/dist/components/SignUp/SignUpKYC/IdFrontImageField/useIdFrontImageField.js +88 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/SelfieImageField.client.d.ts +15 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/SelfieImageField.client.js +113 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/SelfieImageField.d.ts +2 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/SelfieImageField.js +11 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/SelfieImageFieldContext.d.ts +6 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/SelfieImageFieldContext.js +2 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/index.d.ts +1 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/index.js +1 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/useSelfieImageField.d.ts +19 -0
- package/dist/components/SignUp/SignUpKYC/SelfieImageField/useSelfieImageField.js +186 -0
- package/dist/components/SignUp/SignUpKYC/SignUpKYC.lazy.js +3 -12
- package/dist/components/SignUp/SignUpKYC/SignUpKYCContext.d.ts +2 -3
- package/dist/components/SignUp/SignUpKYC/SignUpKYCForm.d.ts +1 -0
- package/dist/components/SignUp/SignUpKYC/SignUpKYCForm.js +464 -0
- package/dist/components/SignUp/SignUpKYC/utils.js +18 -18
- package/dist/components/SignUp/SignUpPagcor/CaptureIdDocument.d.ts +1 -0
- package/dist/components/SignUp/SignUpPagcor/CaptureIdDocument.js +198 -0
- package/dist/components/SignUp/SignUpPagcor/CaptureSelfie.d.ts +1 -0
- package/dist/components/SignUp/SignUpPagcor/CaptureSelfie.js +251 -0
- package/dist/components/SignUp/SignUpPagcor/ImageUploader.d.ts +10 -0
- package/dist/components/SignUp/SignUpPagcor/ImageUploader.js +41 -0
- package/dist/components/SignUp/SignUpPagcor/SignUpFormPagcor.d.ts +1 -0
- package/dist/components/SignUp/SignUpPagcor/SignUpFormPagcor.js +429 -0
- package/dist/components/SignUp/SignUpPagcor/SignUpPagcor.lazy.d.ts +13 -0
- package/dist/components/SignUp/SignUpPagcor/SignUpPagcor.lazy.js +26 -0
- package/dist/components/SignUp/SignUpPagcor/SignUpPagcorContext.d.ts +7 -0
- package/dist/components/SignUp/SignUpPagcor/SignUpPagcorContext.js +2 -0
- package/dist/components/SignUp/SignUpPagcor/useImageUploader.d.ts +11 -0
- package/dist/components/SignUp/SignUpPagcor/useImageUploader.js +20 -0
- package/dist/components/Tournaments/TournamentsCarousel/TournamentsCarouselItem.module.css +184 -184
- package/dist/components/Tournaments/TournamentsList/TournamentItem.module.css +184 -184
- package/dist/components/shared/IdFrontImageField/IdFrontImageField.client.js +11 -46
- package/dist/components/shared/SelfieImageField/SelfieImageField.client.js +20 -72
- package/dist/constants/EnvVar.d.ts +1 -1
- package/dist/handlers/postTransformIdFrontImage.d.ts +3 -0
- package/dist/handlers/postTransformIdFrontImage.js +67 -0
- package/dist/handlers/postTransformSelfieImage.d.ts +3 -0
- package/dist/handlers/postTransformSelfieImage.js +71 -0
- package/dist/next.config.js +0 -8
- package/dist/services/queries.js +2570 -2570
- package/dist/styles/theme.css +695 -695
- package/dist/ui/AlertDialog/AlertDialog.d.ts +88 -88
- package/dist/ui/AlertDialog/alertDialog.recipe.d.ts +8 -8
- package/dist/ui/Badge/Badge.d.ts +12 -12
- package/dist/ui/Badge/badge.anatomy.d.ts +1 -1
- package/dist/ui/Badge/badge.recipe.d.ts +3 -3
- package/dist/ui/Carousel/Carousel.d.ts +72 -72
- package/dist/ui/Carousel/carousel.recipe.d.ts +8 -8
- package/dist/ui/Checkbox/Checkbox.d.ts +23 -23
- package/dist/ui/Checkbox/checkbox.recipe.d.ts +3 -3
- package/dist/ui/Clipboard/Clipboard.d.ts +18 -18
- package/dist/ui/Clipboard/clipboard.recipe.d.ts +3 -3
- package/dist/ui/Collapsible/Collapsible.d.ts +32 -32
- package/dist/ui/Collapsible/collapsible.recipe.d.ts +8 -8
- package/dist/ui/Combobox/Combobox.d.ts +42 -42
- package/dist/ui/Combobox/combobox.recipe.d.ts +3 -3
- package/dist/ui/DatePicker/DatePicker.d.ts +72 -72
- package/dist/ui/DatePicker/datePicker.recipe.d.ts +3 -3
- package/dist/ui/Dialog/Dialog.d.ts +88 -88
- package/dist/ui/Dialog/dialog.recipe.d.ts +8 -8
- package/dist/ui/Drawer/Drawer.d.ts +33 -33
- package/dist/ui/Drawer/drawer.recipe.d.ts +3 -3
- package/dist/ui/Field/Field.d.ts +21 -21
- package/dist/ui/Field/field.recipe.d.ts +3 -3
- package/dist/ui/Menu/Menu.d.ts +306 -306
- package/dist/ui/Menu/menu.recipe.d.ts +17 -17
- package/dist/ui/PasswordInput/PasswordInput.d.ts +18 -18
- package/dist/ui/PasswordInput/passwordInput.recipe.d.ts +3 -3
- package/dist/ui/Popover/Popover.d.ts +88 -88
- package/dist/ui/Popover/popover.recipe.d.ts +8 -8
- package/dist/ui/Progress/Progress.d.ts +27 -27
- package/dist/ui/Progress/progress.recipe.d.ts +3 -3
- package/dist/ui/SegmentGroup/SegmentGroup.d.ts +18 -18
- package/dist/ui/SegmentGroup/segmentGroup.recipe.d.ts +3 -3
- package/dist/ui/Select/Select.d.ts +45 -45
- package/dist/ui/Select/select.recipe.d.ts +3 -3
- package/dist/ui/Table/Table.d.ts +21 -21
- package/dist/ui/Table/table.anatomy.d.ts +1 -1
- package/dist/ui/Table/table.recipe.d.ts +3 -3
- package/dist/ui/Tabs/Tabs.d.ts +15 -15
- package/dist/ui/Tabs/tabs.recipe.d.ts +3 -3
- package/dist/utils/resizeImageSize.d.ts +1 -0
- package/dist/utils/resizeImageSize.js +5 -0
- package/package.json +163 -165
- package/dist/client/hooks/index.d.ts +0 -65
- package/dist/client/hooks/index.js +0 -65
- package/dist/client/services/index.d.ts +0 -4
- package/dist/client/services/index.js +0 -4
- package/dist/client/utils/index.d.ts +0 -3
- package/dist/client/utils/index.js +0 -3
- package/dist/components/CashbackBonus/CashbackBonus.client.d.ts +0 -2
- package/dist/components/CashbackBonus/CashbackBonus.client.js +0 -9
- package/dist/components/CashbackBonus/CashbackBonus.d.ts +0 -10
- package/dist/components/CashbackBonus/CashbackBonus.js +0 -5
- package/dist/components/CashbackBonus/index.d.ts +0 -1
- package/dist/components/CashbackBonus/index.js +0 -1
- package/dist/components/Empty.d.ts +0 -9
- package/dist/components/Empty.js +0 -7
- package/dist/components/Games/GameContext.d.ts +0 -2
- package/dist/components/Games/GameContext.js +0 -2
- package/dist/components/InfiniteScroll.d.ts +0 -10
- package/dist/components/InfiniteScroll.js +0 -25
- package/dist/components/JackpotCounter/JackpotCounter.client.d.ts +0 -2
- package/dist/components/JackpotCounter/JackpotCounter.client.js +0 -66
- package/dist/components/JackpotCounter/JackpotCounter.d.ts +0 -17
- package/dist/components/JackpotCounter/JackpotCounter.js +0 -21
- package/dist/components/JackpotCounter/JackpotCounterItem.d.ts +0 -18
- package/dist/components/JackpotCounter/JackpotCounterItem.js +0 -109
- package/dist/components/JackpotCounter/JackpotCounterItem.module.css +0 -184
- package/dist/components/JackpotCounter/index.d.ts +0 -1
- package/dist/components/JackpotCounter/index.js +0 -1
- package/dist/components/Jackpots/JackpotDesktop.d.ts +0 -1
- package/dist/components/Jackpots/JackpotDesktop.js +0 -45
- package/dist/components/Jackpots/JackpotGameProviders.d.ts +0 -5
- package/dist/components/Jackpots/JackpotGameProviders.js +0 -41
- package/dist/components/Jackpots/JackpotItemDesktop.d.ts +0 -9
- package/dist/components/Jackpots/JackpotItemDesktop.js +0 -43
- package/dist/components/Jackpots/JackpotItemMobile.d.ts +0 -9
- package/dist/components/Jackpots/JackpotItemMobile.js +0 -44
- package/dist/components/Jackpots/JackpotMobile.d.ts +0 -1
- package/dist/components/Jackpots/JackpotMobile.js +0 -46
- package/dist/components/Jackpots/JackpotRules.d.ts +0 -5
- package/dist/components/Jackpots/JackpotRules.js +0 -11
- package/dist/components/Jackpots/Jackpots.client.d.ts +0 -2
- package/dist/components/Jackpots/Jackpots.client.js +0 -29
- package/dist/components/Jackpots/JackpotsContext.d.ts +0 -4
- package/dist/components/Jackpots/JackpotsContext.js +0 -3
- package/dist/components/Jackpots/useJackpotData.d.ts +0 -14
- package/dist/components/Jackpots/useJackpotData.js +0 -93
- package/dist/components/Jackpots/useJackpotItemData.d.ts +0 -20
- package/dist/components/Jackpots/useJackpotItemData.js +0 -87
- package/dist/components/KYC/Header.d.ts +0 -1
- package/dist/components/KYC/Header.js +0 -8
- package/dist/components/KYC/Step1.d.ts +0 -1
- package/dist/components/KYC/Step1.js +0 -13
- package/dist/components/KYC/Step2.d.ts +0 -1
- package/dist/components/KYC/Step2.js +0 -13
- package/dist/components/KYC/Step3.d.ts +0 -1
- package/dist/components/KYC/Step3.js +0 -13
- package/dist/components/KYC/Step4.d.ts +0 -1
- package/dist/components/KYC/Step4.js +0 -7
- package/dist/components/Messages/MessageItem.d.ts +0 -4
- package/dist/components/Messages/MessageItem.js +0 -34
- package/dist/components/Promo/PromoContent.d.ts +0 -2
- package/dist/components/Promo/PromoContent.js +0 -9
- package/dist/components/Promos/PromoCarousel.d.ts +0 -2
- package/dist/components/Promos/PromoCarousel.js +0 -41
- package/dist/components/Promos/PromoGrid.d.ts +0 -2
- package/dist/components/Promos/PromoGrid.js +0 -12
- package/dist/components/Promos/PromoItem.d.ts +0 -7
- package/dist/components/Promos/PromoItem.js +0 -10
- package/dist/components/TournamentCounter/TournamentCounter.client.d.ts +0 -2
- package/dist/components/TournamentCounter/TournamentCounter.client.js +0 -50
- package/dist/components/TournamentCounter/TournamentCounter.d.ts +0 -8
- package/dist/components/TournamentCounter/TournamentCounter.js +0 -21
- package/dist/components/TournamentCounter/TournamentCounterItem.d.ts +0 -8
- package/dist/components/TournamentCounter/TournamentCounterItem.js +0 -106
- package/dist/components/TournamentCounter/index.d.ts +0 -1
- package/dist/components/TournamentCounter/index.js +0 -1
- package/dist/components/Tournaments/TournamentDesktop.d.ts +0 -1
- package/dist/components/Tournaments/TournamentDesktop.js +0 -57
- package/dist/components/Tournaments/TournamentGameProviders.d.ts +0 -5
- package/dist/components/Tournaments/TournamentGameProviders.js +0 -38
- package/dist/components/Tournaments/TournamentItemDesktop.d.ts +0 -7
- package/dist/components/Tournaments/TournamentItemDesktop.js +0 -56
- package/dist/components/Tournaments/TournamentItemMobile.d.ts +0 -7
- package/dist/components/Tournaments/TournamentItemMobile.js +0 -54
- package/dist/components/Tournaments/TournamentMobile.d.ts +0 -1
- package/dist/components/Tournaments/TournamentMobile.js +0 -55
- package/dist/components/Tournaments/TournamentRules.d.ts +0 -5
- package/dist/components/Tournaments/TournamentRules.js +0 -11
- package/dist/components/Tournaments/Tournaments.client.d.ts +0 -2
- package/dist/components/Tournaments/Tournaments.client.js +0 -20
- package/dist/components/Tournaments/TournamentsContext.d.ts +0 -4
- package/dist/components/Tournaments/TournamentsContext.js +0 -3
- package/dist/components/Tournaments/useTournamentData.d.ts +0 -10
- package/dist/components/Tournaments/useTournamentData.js +0 -72
- package/dist/components/Tournaments/useTournamentItemData.d.ts +0 -16
- package/dist/components/Tournaments/useTournamentItemData.js +0 -64
- package/dist/components/index.d.ts +0 -33
- package/dist/components/index.js +0 -33
- package/dist/constants/endpoints.d.ts +0 -10
- package/dist/constants/endpoints.js +0 -41
- package/dist/constants/envVars.d.ts +0 -5
- package/dist/constants/envVars.js +0 -28
- package/dist/constants/gameProviders.d.ts +0 -76
- package/dist/constants/gameProviders.js +0 -361
- package/dist/constants/gameTypes.d.ts +0 -3
- package/dist/constants/gameTypes.js +0 -64
- package/dist/constants/headerKeys.d.ts +0 -2
- package/dist/constants/headerKeys.js +0 -2
- package/dist/constants/secretQuestions.d.ts +0 -3
- package/dist/constants/secretQuestions.js +0 -24
- package/dist/constants/storageKeys.d.ts +0 -2
- package/dist/constants/storageKeys.js +0 -2
- package/dist/icons/index.d.ts +0 -65
- package/dist/icons/index.js +0 -65
- package/dist/images/hacksaw-gaming.png +0 -0
- package/dist/server/services/index.d.ts +0 -4
- package/dist/server/services/index.js +0 -4
- package/dist/server/utils/index.d.ts +0 -29
- package/dist/server/utils/index.js +0 -29
- package/dist/ui/Presence.d.ts +0 -2
- package/dist/ui/Presence.js +0 -7
- package/dist/ui/Prose.d.ts +0 -2
- package/dist/ui/Prose.js +0 -5
- package/dist/ui/index.d.ts +0 -26
- package/dist/ui/index.js +0 -26
- package/dist/utils/createErrorFromCode.d.ts +0 -2
- package/dist/utils/createErrorFromCode.js +0 -11
- package/dist/utils/index.d.ts +0 -17
- package/dist/utils/index.js +0 -17
- package/dist/utils/isMobile.d.ts +0 -5
- package/dist/utils/isMobile.js +0 -9
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import type { Jackpot } from '@opexa/portal-sdk-core';
|
|
2
|
-
import type { GameProviderData } from '../../types';
|
|
3
|
-
export interface JackpotItemMobileProps {
|
|
4
|
-
jackpot: Jackpot;
|
|
5
|
-
/** @default "/jackpots" */
|
|
6
|
-
viewAllUrl?: string;
|
|
7
|
-
gameProviders: GameProviderData[];
|
|
8
|
-
}
|
|
9
|
-
export declare function JackpotItemMobile({ jackpot, gameProviders, }: JackpotItemMobileProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
-
import { Progress } from '@ark-ui/react';
|
|
4
|
-
import Image from 'next/image';
|
|
5
|
-
import { useState } from 'react';
|
|
6
|
-
import { twMerge } from 'tailwind-merge';
|
|
7
|
-
import { ArrowNarrowDownIcon, ArrowNarrowUpIcon, ArrowNarrowUpRightIcon, ChevronLeftIcon, ChevronRightIcon, StarIcon, Trophy01Icon, User01Icon, } from '../../icons/index.js';
|
|
8
|
-
import closeChest from '../../images/close-chest.png';
|
|
9
|
-
import firstPlace from '../../images/first-place.png';
|
|
10
|
-
import openChest from '../../images/open-chest.png';
|
|
11
|
-
import { Button } from '../../ui/index.js';
|
|
12
|
-
import { formatNumber, getPercentage, mask } from '../../utils/index.js';
|
|
13
|
-
import styles from '../JackpotCounter/JackpotCounterItem.module.css';
|
|
14
|
-
import { JackpotGameProviders } from './JackpotGameProviders.js';
|
|
15
|
-
import { JackpotRules } from './JackpotRules.js';
|
|
16
|
-
import { useJackpotItemData } from './useJackpotItemData.js';
|
|
17
|
-
export function JackpotItemMobile({ jackpot, gameProviders, }) {
|
|
18
|
-
const { jackpotPayouts, topJackpotPayout, filteredGameProviders, localeInfo, isPayingOut, jackpotAmount, arrowImages, getAccumulatingJackpotDescription, starTierStyles, } = useJackpotItemData({ jackpot, gameProviders });
|
|
19
|
-
const [isDetailsVisible, setIsDetailsVisible] = useState(false);
|
|
20
|
-
return (_jsxs("div", { className: "bg-bg-primary border-border-primary rounded-2xl border", children: [_jsxs("div", { className: twMerge('bg-bg-tertiary relative flex shrink-0 rounded-2xl p-3 text-center lg:gap-4 lg:p-5'), children: [_jsxs("div", { className: "z-1 relative flex flex-1 flex-col", children: [_jsx("div", { className: "flex h-full flex-col justify-between", children: _jsx("div", { className: "flex w-full justify-between", children: _jsx("div", { className: "flex w-full flex-col", children: _jsxs("div", { className: "relative flex w-full justify-between", children: [_jsxs("div", { children: [isPayingOut ? (_jsxs("div", { className: "border-utility-success-200 bg-utility-success-50 text-utility-success-700 flex w-fit items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium", children: [_jsx("span", { className: "full bg-utility-success-500 size-1.5 animate-pulse rounded" }), "Paying Out"] })) : (_jsxs("div", { className: "border-utility-blue-200 bg-utility-blue-50 text-utility-blue-700 flex w-fit items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium", children: [_jsx(ArrowNarrowUpRightIcon, { className: "text-utility-blue-500 size-3.5" }), "Accumulating"] })), _jsx("div", { className: "text-text-primary-900 mt-1 text-left text-lg font-medium lg:mt-5 lg:text-2xl", children: jackpot.name }), _jsx("div", { className: "bg-bg-primary text-brand-400 mt-1.5 w-fit rounded-md px-2 py-1 text-2xl font-bold lg:mt-2 lg:text-4xl", children: formatNumber(jackpotAmount, {
|
|
21
|
-
currency: localeInfo.currency.code,
|
|
22
|
-
minDecimalPlaces: 2,
|
|
23
|
-
maxDecimalPlaces: 2,
|
|
24
|
-
}) })] }), _jsx("div", { className: "z-1 bottom-[-60] right-0 block lg:absolute", children: _jsx(Image, { width: 100, height: 100, src: isPayingOut ? openChest : closeChest, alt: "closeChest", quality: 100, className: "size-full h-auto w-[100px]" }) })] }) }) }) }), _jsxs("div", { className: "mt-3 lg:mt-4", children: [_jsxs("div", { className: "mb-1 flex justify-between", children: [_jsx("div", { className: "text-text-primary-900 text-xs font-semibold", children: formatNumber(0, {
|
|
25
|
-
currency: localeInfo.currency.code,
|
|
26
|
-
compact: true,
|
|
27
|
-
}) }), _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, {
|
|
28
|
-
currency: localeInfo.currency.code,
|
|
29
|
-
compact: true,
|
|
30
|
-
}) })] })] }), _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
|
|
31
|
-
? `The pot has hit ${formatNumber(jackpot?.maximumJackpotPoolLimit, {
|
|
32
|
-
currency: localeInfo.currency.code,
|
|
33
|
-
compact: true,
|
|
34
|
-
})} Play now for your chance to win big! 🔥`
|
|
35
|
-
: getAccumulatingJackpotDescription(Number(jackpot?.pool) ?? 0, Number(jackpot?.maximumJackpotPoolLimit) ?? 0) })] }), topJackpotPayout.amount ? (_jsx("div", { children: _jsxs("div", { className: "bg-bg-primary relative mt-4 flex w-full gap-4 rounded-lg p-4", children: [_jsxs("div", { className: "bg-bg-tertiary relative flex h-18 w-18 items-center justify-center rounded-full", children: [_jsx(User01Icon, { className: "text-text-quarterary-500 size-9" }), _jsx("div", { className: "bg-yellow-400 text-brand-950 border-bg-primary absolute bottom-0 right-0 flex h-6 w-6 items-center justify-center rounded-full border-[1.5px] text-xs font-bold", children: "1st" })] }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsxs("div", { className: "border-utility-brand-200 bg-utility-brand-50 text-utility-brand-700 flex h-fit w-fit items-center gap-1 rounded-sm border px-2 py-0.5 text-xs font-medium", children: [_jsx(Trophy01Icon, { className: "text-utility-brand-600 size-3.5" }), "Top Payout"] }), _jsx("div", { className: "font-semibold", children: mask(topJackpotPayout.member.name) }), _jsx("div", { className: "text-brand-400 text-2xl", children: formatNumber(topJackpotPayout.amount, {
|
|
36
|
-
currency: localeInfo.currency.code,
|
|
37
|
-
minDecimalPlaces: 2,
|
|
38
|
-
maxDecimalPlaces: 2,
|
|
39
|
-
}) })] })] }) })) : (_jsxs("div", { className: "bg-bg-primary relative mt-4 flex w-full gap-4 rounded-lg p-4", children: [_jsx(Image, { width: 66, height: 87, src: firstPlace, alt: "closeChest", className: "size-full h-auto w-[66px] mix-blend-luminosity" }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsxs("div", { className: "border-utility-brand-200 bg-utility-brand-50 text-utility-brand-700 flex h-fit w-fit items-center gap-1 rounded-sm border px-2 py-0.5 text-xs font-medium", children: [_jsx(Trophy01Icon, { className: "text-utility-brand-600 size-3.5" }), "Top Payout"] }), _jsx("div", { className: "font-semibold", children: "No winners yet" }), _jsx("div", { className: "text-text-secondary-700 text-xs", children: "You could be the first to win the tournament!" })] })] })), _jsx(Button, { variant: "outline", className: twMerge('mt-5.5 px-3.5 py-2.5 text-sm', isDetailsVisible ? 'hidden' : 'flex'), onClick: () => setIsDetailsVisible(!isDetailsVisible), children: _jsxs("div", { className: "flex gap-1.5", children: ["See Details", _jsx(ArrowNarrowDownIcon, { className: "size-5" })] }) })] }), isPayingOut && (_jsx("div", { className: twMerge(styles['light-rays'], 'absolute right-0 top-0 rounded-2xl [--light-rays-top:15%] lg:[--light-rays-top:150px]') }))] }), isDetailsVisible && (_jsxs("div", { children: [_jsxs("div", { className: "z-1 flex-1", children: [_jsxs("div", { className: "flex items-center justify-between p-3", children: [_jsx("div", { className: "flex gap-2", children: _jsx("div", { className: "text-text-primary-900 text-lg font-semibold", children: jackpotPayouts.length ? 'Leaderboard' : 'Starting soon!' }) }), _jsx(JackpotRules, { jackpotRules: jackpot.description })] }), _jsx("div", { children: _jsx("div", { className: "border-gray-200 overflow-hidden", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-bg-secondary text-text-tertiary-600 h-8 text-center text-xs font-medium", children: [_jsx("th", { className: "w-[52px]", children: "#" }), _jsx("th", { children: "Player" }), _jsx("th", { children: "Multiplier" }), _jsx("th", { children: "Prize" })] }) }), _jsx("tbody", { children: jackpotPayouts.length ? (_jsx(_Fragment, { children: jackpotPayouts.map((jackpotPayout, i) => (_jsxs("tr", { className: "bg-bg-primary text-text-secondary-700 text-center text-sm", children: [_jsx("td", { className: "border-border-secondary h-12 w-[52px] border-t-2", children: i + 1 < 6 ? (_jsxs("div", { className: "relative", children: [_jsx(StarIcon, { className: twMerge('mx-auto size-6.5', starTierStyles[i].starColor) }), _jsx("span", { className: twMerge('absolute inset-0 mt-0.5 flex items-center justify-center text-2xs font-bold', starTierStyles[i].numberColor), children: i + 1 })] })) : (i + 1) }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: mask(jackpotPayout.member.name) }), _jsxs("td", { className: "border-border-secondary h-12 border-t-2", children: [jackpotPayout.multiplier, "x"] }), _jsx("td", { className: "border-border-secondary text-brand-400 h-12 border-t-2", children: formatNumber(jackpotPayout.amount, {
|
|
40
|
-
currency: localeInfo.currency.code,
|
|
41
|
-
minDecimalPlaces: 2,
|
|
42
|
-
maxDecimalPlaces: 2,
|
|
43
|
-
}) })] }, i))) })) : (_jsx(_Fragment, { children: Array.from({ length: 10 }).map((_, i) => (_jsxs("tr", { className: "bg-bg-primary text-text-secondary-700 text-center text-sm", children: [_jsx("td", { className: "border-border-secondary h-12 w-[52px] border-t-2", children: i + 1 < 6 ? (_jsxs("div", { className: "relative", children: [_jsx(StarIcon, { className: twMerge('mx-auto size-6.5', starTierStyles[i].starColor) }), _jsx("span", { className: twMerge('absolute inset-0 mt-0.5 flex items-center justify-center text-2xs font-bold', starTierStyles[i].numberColor), children: i + 1 })] })) : (i + 1) }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" })] }, i))) })) })] }) }) })] }), Boolean(filteredGameProviders.length) && (_jsx(JackpotGameProviders, { gameProviders: filteredGameProviders })), _jsx("div", { className: "m-3", children: _jsx(Button, { variant: "outline", className: twMerge('px-3.5 py-2.5 text-sm', !isDetailsVisible ? 'hidden' : 'flex'), onClick: () => setIsDetailsVisible(!isDetailsVisible), children: _jsxs("div", { className: "flex gap-1.5", children: ["Hide", _jsx(ArrowNarrowUpIcon, { className: "size-5" })] }) }) })] }))] }));
|
|
44
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function JackpotMobile(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
-
import { Progress } from '@ark-ui/react';
|
|
4
|
-
import Image from 'next/image';
|
|
5
|
-
import { useState } from 'react';
|
|
6
|
-
import { twMerge } from 'tailwind-merge';
|
|
7
|
-
import { ArrowNarrowDownIcon, ArrowNarrowUpIcon, ArrowNarrowUpRightIcon, ChevronLeftIcon, ChevronRightIcon, StarIcon, Trophy01Icon, User01Icon, } from '../../icons/index.js';
|
|
8
|
-
import closeChest from '../../images/close-chest.png';
|
|
9
|
-
import firstPlace from '../../images/first-place.png';
|
|
10
|
-
import openChest from '../../images/open-chest.png';
|
|
11
|
-
import { Button } from '../../ui/index.js';
|
|
12
|
-
import { formatNumber, getPercentage, mask } from '../../utils/index.js';
|
|
13
|
-
import styles from '../JackpotCounter/JackpotCounterItem.module.css';
|
|
14
|
-
import { JackpotGameProviders } from './JackpotGameProviders.js';
|
|
15
|
-
import { JackpotRules } from './JackpotRules.js';
|
|
16
|
-
import { useJackpotContext } from './JackpotsContext.js';
|
|
17
|
-
import { useJackpotData } from './useJackpotData.js';
|
|
18
|
-
export function JackpotMobile() {
|
|
19
|
-
const jackpot = useJackpotContext();
|
|
20
|
-
const { jackpotPayouts, topJackpotPayout, filteredGameProviders, localeInfo, isPayingOut, jackpotAmount, arrowImages, getAccumulatingJackpotDescription, starTierStyles, } = useJackpotData();
|
|
21
|
-
const [isDetailsVisible, setIsDetailsVisible] = useState(false);
|
|
22
|
-
return (_jsxs("div", { className: "bg-bg-primary border-border-primary rounded-2xl border", children: [_jsxs("div", { className: twMerge('bg-bg-tertiary relative flex shrink-0 rounded-2xl p-3 text-center lg:gap-4 lg:p-5'), children: [_jsxs("div", { className: "z-1 relative flex flex-1 flex-col", children: [_jsx("div", { className: "flex h-full flex-col justify-between", children: _jsx("div", { className: "flex w-full justify-between", children: _jsx("div", { className: "flex w-full flex-col", children: _jsxs("div", { className: "relative flex w-full justify-between", children: [_jsxs("div", { children: [isPayingOut ? (_jsxs("div", { className: "border-utility-success-200 bg-utility-success-50 text-utility-success-700 flex w-fit items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium", children: [_jsx("span", { className: "full bg-utility-success-500 size-1.5 animate-pulse rounded" }), "Paying Out"] })) : (_jsxs("div", { className: "border-utility-blue-200 bg-utility-blue-50 text-utility-blue-700 flex w-fit items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium", children: [_jsx(ArrowNarrowUpRightIcon, { className: "text-utility-blue-500 size-3.5" }), "Accumulating"] })), _jsx("div", { className: "text-text-primary-900 mt-1 text-left text-lg font-medium lg:mt-5 lg:text-2xl", children: jackpot.name }), _jsx("div", { className: "bg-bg-primary text-brand-400 mt-1.5 w-fit rounded-md px-2 py-1 text-2xl font-bold lg:mt-2 lg:text-4xl", children: formatNumber(jackpotAmount, {
|
|
23
|
-
currency: localeInfo.currency.code,
|
|
24
|
-
minDecimalPlaces: 2,
|
|
25
|
-
maxDecimalPlaces: 2,
|
|
26
|
-
}) })] }), _jsx("div", { className: "z-1 bottom-[-60] right-0 block lg:absolute", children: _jsx(Image, { width: 100, height: 100, src: isPayingOut ? openChest : closeChest, alt: "closeChest", quality: 100, className: "size-full h-auto w-[100px]" }) })] }) }) }) }), _jsxs("div", { className: "mt-3 lg:mt-4", children: [_jsxs("div", { className: "mb-1 flex justify-between", children: [_jsx("div", { className: "text-text-primary-900 text-xs font-semibold", children: formatNumber(0, {
|
|
27
|
-
currency: localeInfo.currency.code,
|
|
28
|
-
compact: true,
|
|
29
|
-
}) }), _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, {
|
|
30
|
-
currency: localeInfo.currency.code,
|
|
31
|
-
compact: true,
|
|
32
|
-
}) })] })] }), _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
|
|
33
|
-
? `The pot has hit ${formatNumber(jackpot?.maximumJackpotPoolLimit, {
|
|
34
|
-
currency: localeInfo.currency.code,
|
|
35
|
-
compact: true,
|
|
36
|
-
})} Play now for your chance to win big! 🔥`
|
|
37
|
-
: getAccumulatingJackpotDescription(Number(jackpot?.pool) ?? 0, Number(jackpot?.maximumJackpotPoolLimit) ?? 0) })] }), topJackpotPayout.amount ? (_jsx("div", { children: _jsxs("div", { className: "bg-bg-primary relative mt-4 flex w-full gap-4 rounded-lg p-4", children: [_jsxs("div", { className: "bg-bg-tertiary relative flex h-18 w-18 items-center justify-center rounded-full", children: [_jsx(User01Icon, { className: "text-text-quarterary-500 size-9" }), _jsx("div", { className: "bg-yellow-400 text-brand-950 border-bg-primary absolute bottom-0 right-0 flex h-6 w-6 items-center justify-center rounded-full border-[1.5px] text-xs font-bold", children: "1st" })] }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsxs("div", { className: "border-utility-brand-200 bg-utility-brand-50 text-utility-brand-700 flex h-fit w-fit items-center gap-1 rounded-sm border px-2 py-0.5 text-xs font-medium", children: [_jsx(Trophy01Icon, { className: "text-utility-brand-600 size-3.5" }), "Top Payout"] }), _jsx("div", { className: "font-semibold", children: mask(topJackpotPayout.member.name) }), _jsx("div", { className: "text-brand-400 text-2xl", children: formatNumber(topJackpotPayout.amount, {
|
|
38
|
-
currency: localeInfo.currency.code,
|
|
39
|
-
minDecimalPlaces: 2,
|
|
40
|
-
maxDecimalPlaces: 2,
|
|
41
|
-
}) })] })] }) })) : (_jsxs("div", { className: "bg-bg-primary relative mt-4 flex w-full gap-4 rounded-lg p-4", children: [_jsx(Image, { width: 66, height: 87, src: firstPlace, alt: "closeChest", className: "size-full h-auto w-[66px] mix-blend-luminosity" }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsxs("div", { className: "border-utility-brand-200 bg-utility-brand-50 text-utility-brand-700 flex h-fit w-fit items-center gap-1 rounded-sm border px-2 py-0.5 text-xs font-medium", children: [_jsx(Trophy01Icon, { className: "text-utility-brand-600 size-3.5" }), "Top Payout"] }), _jsx("div", { className: "font-semibold", children: "No winners yet" }), _jsx("div", { className: "text-text-secondary-700 text-xs", children: "You could be the first to win the tournament!" })] })] })), _jsx(Button, { variant: "outline", className: twMerge('mt-5.5 px-3.5 py-2.5 text-sm', isDetailsVisible ? 'hidden' : 'flex'), onClick: () => setIsDetailsVisible(!isDetailsVisible), children: _jsxs("div", { className: "flex gap-1.5", children: ["See Details", _jsx(ArrowNarrowDownIcon, { className: "size-5" })] }) })] }), isPayingOut && (_jsx("div", { className: twMerge(styles['light-rays'], 'absolute right-0 top-0 rounded-2xl [--light-rays-top:15%] lg:[--light-rays-top:150px]') }))] }), isDetailsVisible && (_jsxs("div", { children: [_jsxs("div", { className: "z-1 flex-1", children: [_jsxs("div", { className: "flex items-center justify-between p-3", children: [_jsx("div", { className: "flex gap-2", children: _jsx("div", { className: "text-text-primary-900 text-lg font-semibold", children: jackpotPayouts.length ? 'Leaderboard' : 'Starting soon!' }) }), _jsx(JackpotRules, {})] }), _jsx("div", { children: _jsx("div", { className: "border-gray-200 overflow-hidden", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-bg-secondary text-text-tertiary-600 h-8 text-center text-xs font-medium", children: [_jsx("th", { className: "w-[52px]", children: "#" }), _jsx("th", { children: "Player" }), _jsx("th", { children: "Multiplier" }), _jsx("th", { children: "Prize" })] }) }), _jsx("tbody", { children: jackpotPayouts.length ? (_jsx(_Fragment, { children: jackpotPayouts.map((jackpotPayout, i) => (_jsxs("tr", { className: "bg-bg-primary text-text-secondary-700 text-center text-sm", children: [_jsx("td", { className: "border-border-secondary h-12 w-[52px] border-t-2", children: i + 1 < 6 ? (_jsxs("div", { className: "relative", children: [_jsx(StarIcon, { className: twMerge('mx-auto size-6.5', starTierStyles[i].starColor) }), _jsx("span", { className: twMerge('absolute inset-0 mt-0.5 flex items-center justify-center text-2xs font-bold', starTierStyles[i].numberColor), children: i + 1 })] })) : (i + 1) }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: mask(jackpotPayout.member.name) }), _jsxs("td", { className: "border-border-secondary h-12 border-t-2", children: [jackpotPayout.multiplier, "x"] }), _jsx("td", { className: "border-border-secondary text-brand-400 h-12 border-t-2", children: formatNumber(jackpotPayout.amount, {
|
|
42
|
-
currency: localeInfo.currency.code,
|
|
43
|
-
minDecimalPlaces: 2,
|
|
44
|
-
maxDecimalPlaces: 2,
|
|
45
|
-
}) })] }, i))) })) : (_jsx(_Fragment, { children: Array.from({ length: 10 }).map((_, i) => (_jsxs("tr", { className: "bg-bg-primary text-text-secondary-700 text-center text-sm", children: [_jsx("td", { className: "border-border-secondary h-12 w-[52px] border-t-2", children: i + 1 < 6 ? (_jsxs("div", { className: "relative", children: [_jsx(StarIcon, { className: twMerge('mx-auto size-6.5', starTierStyles[i].starColor) }), _jsx("span", { className: twMerge('absolute inset-0 mt-0.5 flex items-center justify-center text-2xs font-bold', starTierStyles[i].numberColor), children: i + 1 })] })) : (i + 1) }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" })] }, i))) })) })] }) }) })] }), Boolean(filteredGameProviders.length) && (_jsx(JackpotGameProviders, { gameProviders: filteredGameProviders })), _jsx("div", { className: "m-3", children: _jsx(Button, { variant: "outline", className: twMerge('px-3.5 py-2.5 text-sm', !isDetailsVisible ? 'hidden' : 'flex'), onClick: () => setIsDetailsVisible(!isDetailsVisible), children: _jsxs("div", { className: "flex gap-1.5", children: ["Hide", _jsx(ArrowNarrowUpIcon, { className: "size-5" })] }) }) })] }))] }));
|
|
46
|
-
}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { Portal } from '@ark-ui/react';
|
|
4
|
-
import { XIcon } from '../../icons/index.js';
|
|
5
|
-
import { Flag06Icon } from '../../icons/Flag06Icon.js';
|
|
6
|
-
import { Dialog } from '../../ui/index.js';
|
|
7
|
-
import { useJackpotContext } from './JackpotsContext.js';
|
|
8
|
-
export function JackpotRules(props) {
|
|
9
|
-
const jackpot = useJackpotContext();
|
|
10
|
-
return (_jsxs(Dialog.Root, { lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: [_jsx(Dialog.Trigger, { asChild: true, children: props.children ?? (_jsx("button", { type: "button", className: "text-button-tertiary-fg flex text-sm font-semibold", children: "Jackpot Rules" })) }), _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "bg-bg-primary-alt mx-auto h-full w-full items-start lg:h-auto lg:w-[640px] lg:rounded-xl", children: [_jsxs("div", { className: "p-3xl", children: [_jsxs("div", { className: "mb-3 flex justify-between", children: [_jsx("div", { className: "bg-bg-tertiary border-border-primary flex h-12 w-12 items-center justify-center rounded-lg border", children: _jsx(Flag06Icon, { className: "text-text-tertiary-600 size-full p-3" }) }), _jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) })] }), _jsx("div", { className: "text-text-primary-900 text-lg font-semibold", children: "Jackpot Rules" }), _jsx("div", { className: "text-text-tertiary-600 mt-1 text-sm", children: "Terms and Conditions" })] }), _jsx("div", { className: "border-gray-800 border-t-1 pb-3", children: _jsx("div", { dangerouslySetInnerHTML: { __html: jackpot.description }, className: "px-3xl py-3" }) })] }) })] })] }));
|
|
11
|
-
}
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import Image from 'next/image';
|
|
4
|
-
import { useJackpotsQuery } from '../../client/hooks/index.js';
|
|
5
|
-
import closeChest from '../../images/close-chest.png';
|
|
6
|
-
import { JackpotDesktop } from './JackpotDesktop.js';
|
|
7
|
-
import { JackpotMobile } from './JackpotMobile.js';
|
|
8
|
-
import { JackpotContext, JackpotsPropsContext } from './JackpotsContext.js';
|
|
9
|
-
export function Jackpots__client(props) {
|
|
10
|
-
const jackpotsQuery = useJackpotsQuery({
|
|
11
|
-
first: 100,
|
|
12
|
-
filter: {
|
|
13
|
-
status: {
|
|
14
|
-
equal: 'ACTIVE',
|
|
15
|
-
},
|
|
16
|
-
deleted: {
|
|
17
|
-
equal: false,
|
|
18
|
-
},
|
|
19
|
-
},
|
|
20
|
-
sort: {
|
|
21
|
-
cursor: 'POOL',
|
|
22
|
-
order: 'DESC',
|
|
23
|
-
},
|
|
24
|
-
});
|
|
25
|
-
const jackpots = jackpotsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
|
|
26
|
-
if (jackpots.length <= 0)
|
|
27
|
-
return null;
|
|
28
|
-
return (_jsx(JackpotsPropsContext, { value: props, children: _jsxs("div", { className: props.className, children: [_jsx("div", { className: "mb-3 text-lg font-semibold lg:mb-4.5", children: props.heading ?? 'Jackpots' }), jackpots.length > 0 ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "hidden flex-col gap-6 lg:flex", children: jackpots.map((jackpot) => (_jsx(JackpotContext, { value: jackpot, children: _jsx(JackpotDesktop, {}) }, jackpot.id))) }), _jsx("div", { className: "flex flex-col gap-6 lg:hidden", children: jackpots.map((jackpot) => (_jsx(JackpotContext, { value: jackpot, children: _jsx(JackpotMobile, {}) }, jackpot.id))) })] })) : (_jsxs("div", { className: "mt-11 flex flex-col items-center justify-center", children: [_jsx(Image, { width: 100, height: 100, src: closeChest, alt: "closeChest", quality: 100, className: "h-29.5 w-29.5 lg:h-25 lg:w-25 size-full mix-blend-luminosity" }), _jsx("div", { className: "text-text-primary-900 mt-4 text-base font-semibold", children: props.heading ?? 'Jackpots' }), _jsxs("div", { className: "text-text-tertiary-600 mt-1 text-center text-sm", children: ["No ", props.heading?.toLocaleLowerCase() ?? 'jackpots', " are running at the moment. ", _jsx("br", {}), "Please check back later!"] })] }))] }) }));
|
|
29
|
-
}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import type { Jackpot } from '@opexa/portal-sdk-core';
|
|
2
|
-
import type { JackpotsProps } from './Jackpots';
|
|
3
|
-
export declare const JackpotsPropsContext: import("react").Context<JackpotsProps>, useJackpotsPropsContext: () => JackpotsProps;
|
|
4
|
-
export declare const JackpotContext: import("react").Context<Jackpot>, useJackpotContext: () => Jackpot;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
export declare function useJackpotData(): {
|
|
2
|
-
jackpotPayouts: import("@opexa/portal-sdk-core").JackpotPayout[];
|
|
3
|
-
topJackpotPayout: import("@opexa/portal-sdk-core").JackpotPayout;
|
|
4
|
-
filteredGameProviders: import("../../types").GameProviderData[];
|
|
5
|
-
localeInfo: import("../../utils").LocaleInfo;
|
|
6
|
-
isPayingOut: boolean;
|
|
7
|
-
jackpotAmount: string;
|
|
8
|
-
arrowImages: import("react/jsx-runtime").JSX.Element[];
|
|
9
|
-
getAccumulatingJackpotDescription: (part: number, total: number) => string;
|
|
10
|
-
starTierStyles: {
|
|
11
|
-
starColor: string;
|
|
12
|
-
numberColor: string;
|
|
13
|
-
}[];
|
|
14
|
-
};
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
// useJackpotItemData.ts
|
|
3
|
-
import { useCallback, useMemo } from 'react';
|
|
4
|
-
import { twMerge } from 'tailwind-merge';
|
|
5
|
-
import { useLocaleInfo } from '../../client/hooks/index.js';
|
|
6
|
-
import { useJackpotPayoutsQuery } from '../../client/hooks/useJackpotPayoutsQuery.js';
|
|
7
|
-
import { GAME_PROVIDER_DATA } from '../../constants/index.js';
|
|
8
|
-
import { ChevronLeftIcon, ChevronRightIcon } from '../../icons/index.js';
|
|
9
|
-
import styles from '../JackpotCounter/JackpotCounterItem.module.css';
|
|
10
|
-
import { useJackpotContext, useJackpotsPropsContext } from './JackpotsContext.js';
|
|
11
|
-
export function useJackpotData() {
|
|
12
|
-
const jackpotsProps = useJackpotsPropsContext();
|
|
13
|
-
const jackpot = useJackpotContext();
|
|
14
|
-
const gameProviders = jackpotsProps.gameProviders.map((provider) => GAME_PROVIDER_DATA[provider]);
|
|
15
|
-
const jackpotPayoutsQuery = useJackpotPayoutsQuery({
|
|
16
|
-
first: 30,
|
|
17
|
-
filter: {
|
|
18
|
-
jackpot: {
|
|
19
|
-
equal: jackpot.id,
|
|
20
|
-
},
|
|
21
|
-
},
|
|
22
|
-
sort: {
|
|
23
|
-
cursor: 'AMOUNT',
|
|
24
|
-
order: 'DESC',
|
|
25
|
-
},
|
|
26
|
-
}, {
|
|
27
|
-
enabled: typeof window !== 'undefined',
|
|
28
|
-
});
|
|
29
|
-
const jackpotPayouts = jackpotPayoutsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
|
|
30
|
-
const topJackpotPayout = jackpotPayouts[0] ?? [];
|
|
31
|
-
const enabledJackpotGameProviders = useMemo(() => {
|
|
32
|
-
const gameProvider = Object.entries(jackpot?.jackpotTurnoverContributionPercentagePerGameProvider ?? {})
|
|
33
|
-
.filter(([, value]) => Number(value) > 0)
|
|
34
|
-
.map(([key]) => key);
|
|
35
|
-
return gameProvider;
|
|
36
|
-
}, [jackpot]);
|
|
37
|
-
const filteredGameProviders = gameProviders.filter((provider) => enabledJackpotGameProviders.includes(provider.id));
|
|
38
|
-
const localeInfo = useLocaleInfo();
|
|
39
|
-
const isPayingOut = jackpot.drawing;
|
|
40
|
-
const jackpotAmount = isPayingOut
|
|
41
|
-
? jackpot.maximumJackpotPoolLimit
|
|
42
|
-
: jackpot.pool;
|
|
43
|
-
const Arrow = useCallback(({ index }) => {
|
|
44
|
-
const Icon = isPayingOut ? ChevronLeftIcon : ChevronRightIcon;
|
|
45
|
-
return (_jsx(Icon, { className: twMerge('scale-400 lg:scale-250 text-brand-300 min-w-2.5 lg:min-w-4', isPayingOut
|
|
46
|
-
? styles['animate-wave-color-error']
|
|
47
|
-
: styles['animate-wave-color-success']), style: {
|
|
48
|
-
animationDelay: isPayingOut
|
|
49
|
-
? `${(40 - index - 1) * 0.1}s`
|
|
50
|
-
: `${index * 0.1}s`,
|
|
51
|
-
} }));
|
|
52
|
-
}, [isPayingOut]);
|
|
53
|
-
const arrowImages = useMemo(() => Array.from({ length: 40 }, (_, i) => (_jsx(Arrow, { isFirst: i === 0, index: i }, i))), [Arrow]);
|
|
54
|
-
const getAccumulatingJackpotDescription = (part, total) => {
|
|
55
|
-
const percentage = total === 0 ? 0 : (part / total) * 100;
|
|
56
|
-
return percentage <= 90
|
|
57
|
-
? 'The jackpot is heating up! Keep playing to stay in the action and watch it grow!'
|
|
58
|
-
: '🔥 It’s about to pop! Stay in the game for your shot at the prize!';
|
|
59
|
-
};
|
|
60
|
-
const starTierStyles = [
|
|
61
|
-
{
|
|
62
|
-
starColor: 'text-yellow-400',
|
|
63
|
-
numberColor: 'text-bg-primary',
|
|
64
|
-
},
|
|
65
|
-
{
|
|
66
|
-
starColor: 'text-utility-gray-700',
|
|
67
|
-
numberColor: 'text-bg-primary',
|
|
68
|
-
},
|
|
69
|
-
{
|
|
70
|
-
starColor: 'text-yellow-700',
|
|
71
|
-
numberColor: 'text-bg-primary',
|
|
72
|
-
},
|
|
73
|
-
{
|
|
74
|
-
starColor: 'text-bg-quaternary',
|
|
75
|
-
numberColor: 'text-text-primary-900',
|
|
76
|
-
},
|
|
77
|
-
{
|
|
78
|
-
starColor: 'text-bg-quaternary',
|
|
79
|
-
numberColor: 'text-text-primary-900',
|
|
80
|
-
},
|
|
81
|
-
];
|
|
82
|
-
return {
|
|
83
|
-
jackpotPayouts,
|
|
84
|
-
topJackpotPayout,
|
|
85
|
-
filteredGameProviders,
|
|
86
|
-
localeInfo,
|
|
87
|
-
isPayingOut,
|
|
88
|
-
jackpotAmount,
|
|
89
|
-
arrowImages,
|
|
90
|
-
getAccumulatingJackpotDescription,
|
|
91
|
-
starTierStyles,
|
|
92
|
-
};
|
|
93
|
-
}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type { Jackpot } from '@opexa/portal-sdk-core';
|
|
2
|
-
import type { GameProviderData } from '../../types';
|
|
3
|
-
export interface JackpotItemProps {
|
|
4
|
-
jackpot: Jackpot;
|
|
5
|
-
gameProviders: GameProviderData[];
|
|
6
|
-
}
|
|
7
|
-
export declare function useJackpotItemData({ jackpot, gameProviders, }: JackpotItemProps): {
|
|
8
|
-
jackpotPayouts: import("@opexa/portal-sdk-core").JackpotPayout[];
|
|
9
|
-
topJackpotPayout: import("@opexa/portal-sdk-core").JackpotPayout;
|
|
10
|
-
filteredGameProviders: GameProviderData[];
|
|
11
|
-
localeInfo: import("../../utils").LocaleInfo;
|
|
12
|
-
isPayingOut: boolean;
|
|
13
|
-
jackpotAmount: string;
|
|
14
|
-
arrowImages: import("react/jsx-runtime").JSX.Element[];
|
|
15
|
-
getAccumulatingJackpotDescription: (part: number, total: number) => string;
|
|
16
|
-
starTierStyles: {
|
|
17
|
-
starColor: string;
|
|
18
|
-
numberColor: string;
|
|
19
|
-
}[];
|
|
20
|
-
};
|
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useCallback, useMemo } from 'react';
|
|
3
|
-
import { twMerge } from 'tailwind-merge';
|
|
4
|
-
import { useLocaleInfo } from '../../client/hooks/index.js';
|
|
5
|
-
import { useJackpotPayoutsQuery } from '../../client/hooks/useJackpotPayoutsQuery.js';
|
|
6
|
-
import { ChevronLeftIcon, ChevronRightIcon } from '../../icons/index.js';
|
|
7
|
-
import styles from '../JackpotCounter/JackpotCounterItem.module.css';
|
|
8
|
-
export function useJackpotItemData({ jackpot, gameProviders, }) {
|
|
9
|
-
const jackpotPayoutsQuery = useJackpotPayoutsQuery({
|
|
10
|
-
first: 30,
|
|
11
|
-
filter: {
|
|
12
|
-
jackpot: {
|
|
13
|
-
equal: jackpot.id,
|
|
14
|
-
},
|
|
15
|
-
},
|
|
16
|
-
sort: {
|
|
17
|
-
cursor: 'AMOUNT',
|
|
18
|
-
order: 'DESC',
|
|
19
|
-
},
|
|
20
|
-
}, {
|
|
21
|
-
enabled: typeof window !== 'undefined',
|
|
22
|
-
});
|
|
23
|
-
const jackpotPayouts = jackpotPayoutsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
|
|
24
|
-
const topJackpotPayout = jackpotPayouts[0] ?? [];
|
|
25
|
-
const enabledJackpotGameProviders = useMemo(() => {
|
|
26
|
-
const gameProvider = Object.entries(jackpot?.jackpotTurnoverContributionPercentagePerGameProvider ?? {})
|
|
27
|
-
.filter(([, value]) => Number(value) > 0)
|
|
28
|
-
.map(([key]) => key);
|
|
29
|
-
return gameProvider;
|
|
30
|
-
}, [jackpot]);
|
|
31
|
-
const filteredGameProviders = gameProviders.filter((provider) => enabledJackpotGameProviders.includes(provider.id));
|
|
32
|
-
const localeInfo = useLocaleInfo();
|
|
33
|
-
const isPayingOut = jackpot.drawing;
|
|
34
|
-
const jackpotAmount = isPayingOut
|
|
35
|
-
? jackpot.maximumJackpotPoolLimit
|
|
36
|
-
: jackpot.pool;
|
|
37
|
-
const Arrow = useCallback(({ index }) => {
|
|
38
|
-
const Icon = isPayingOut ? ChevronLeftIcon : ChevronRightIcon;
|
|
39
|
-
return (_jsx(Icon, { className: twMerge('scale-400 lg:scale-250 text-brand-300 min-w-2.5 lg:min-w-4', isPayingOut
|
|
40
|
-
? styles['animate-wave-color-error']
|
|
41
|
-
: styles['animate-wave-color-success']), style: {
|
|
42
|
-
animationDelay: isPayingOut
|
|
43
|
-
? `${(40 - index - 1) * 0.1}s`
|
|
44
|
-
: `${index * 0.1}s`,
|
|
45
|
-
} }));
|
|
46
|
-
}, [isPayingOut]);
|
|
47
|
-
const arrowImages = useMemo(() => Array.from({ length: 40 }, (_, i) => (_jsx(Arrow, { isFirst: i === 0, index: i }, i))), [Arrow]);
|
|
48
|
-
const getAccumulatingJackpotDescription = (part, total) => {
|
|
49
|
-
const percentage = total === 0 ? 0 : (part / total) * 100;
|
|
50
|
-
return percentage <= 90
|
|
51
|
-
? 'The jackpot is heating up! Keep playing to stay in the action and watch it grow!'
|
|
52
|
-
: '🔥 It’s about to pop! Stay in the game for your shot at the prize!';
|
|
53
|
-
};
|
|
54
|
-
const starTierStyles = [
|
|
55
|
-
{
|
|
56
|
-
starColor: 'text-yellow-400',
|
|
57
|
-
numberColor: 'text-bg-primary',
|
|
58
|
-
},
|
|
59
|
-
{
|
|
60
|
-
starColor: 'text-utility-gray-700',
|
|
61
|
-
numberColor: 'text-bg-primary',
|
|
62
|
-
},
|
|
63
|
-
{
|
|
64
|
-
starColor: 'text-yellow-700',
|
|
65
|
-
numberColor: 'text-bg-primary',
|
|
66
|
-
},
|
|
67
|
-
{
|
|
68
|
-
starColor: 'text-bg-quaternary',
|
|
69
|
-
numberColor: 'text-text-primary-900',
|
|
70
|
-
},
|
|
71
|
-
{
|
|
72
|
-
starColor: 'text-bg-quaternary',
|
|
73
|
-
numberColor: 'text-text-primary-900',
|
|
74
|
-
},
|
|
75
|
-
];
|
|
76
|
-
return {
|
|
77
|
-
jackpotPayouts,
|
|
78
|
-
topJackpotPayout,
|
|
79
|
-
filteredGameProviders,
|
|
80
|
-
localeInfo,
|
|
81
|
-
isPayingOut,
|
|
82
|
-
jackpotAmount,
|
|
83
|
-
arrowImages,
|
|
84
|
-
getAccumulatingJackpotDescription,
|
|
85
|
-
starTierStyles,
|
|
86
|
-
};
|
|
87
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function Header(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { ChevronLeftIcon } from '../../icons/ChevronLeftIcon.js';
|
|
3
|
-
import { XIcon } from '../../icons/XIcon.js';
|
|
4
|
-
import { Dialog } from '../../ui/Dialog/index.js';
|
|
5
|
-
import { IconButton } from '../../ui/IconButton/index.js';
|
|
6
|
-
export function Header() {
|
|
7
|
-
return (_jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "bg-bg-primary-alt relative flex items-center gap-xl px-xl py-md lg:justify-center lg:bg-transparent lg:p-0", children: [_jsx(IconButton, { size: "2xs", variant: "outline", colorScheme: "gray", className: "lg:hidden", onClick: () => api.setOpen(false), children: _jsx(ChevronLeftIcon, {}) }), _jsx(Dialog.Title, { className: "text-lg font-semibold", children: "Personal Verification" }), _jsx("button", { type: "button", className: "text-text-quinary absolute right-0 top-1/2 hidden -translate-y-1/2 lg:block", onClick: () => api.setOpen(false), children: _jsx(XIcon, { className: "size-6" }) })] })) }));
|
|
8
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function Step1(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import Image from 'next/image';
|
|
3
|
-
import { CheckIcon } from '../../icons/CheckIcon.js';
|
|
4
|
-
import { XIcon } from '../../icons/XIcon.js';
|
|
5
|
-
import uploadId from '../../images/capture-id-banner.png';
|
|
6
|
-
import { Button } from '../../ui/Button/index.js';
|
|
7
|
-
import { useKYCContext } from './KYCContext.js';
|
|
8
|
-
export function Step1() {
|
|
9
|
-
const context = useKYCContext();
|
|
10
|
-
return (_jsxs("div", { className: "mt-2xl px-xl lg:mt-3xl lg:px-0", children: [_jsx("p", { className: "lg:text-text-secondary-700 text-center text-2xl font-semibold lg:text-base", children: "Prepare to upload your ID" }), _jsxs("div", { className: "border-border-secondary bg-bg-primary-alt mt-6 rounded-xl border p-4 lg:mt-2xl lg:border-0 lg:bg-transparent lg:p-0", children: [_jsx(Image, { src: uploadId, alt: "", className: "h-auto w-full", width: 600, height: 352 }), _jsxs("ul", { className: "mt-2xl space-y-3", children: [_jsxs("li", { className: "text-text-secondary-700 flex items-center gap-lg", children: [_jsx(CheckIcon, { className: "text-text-featured-icon-light-success size-6" }), "Upload front side of your ID"] }), _jsxs("li", { className: "text-text-secondary-700 flex items-center gap-lg", children: [_jsx(CheckIcon, { className: "text-text-featured-icon-light-success size-6" }), "Take a photo in a well lit room"] }), _jsxs("li", { className: "text-text-secondary-700 flex items-center gap-lg", children: [_jsx(XIcon, { className: "text-text-featured-icon-light-error size-6" }), "Don't edit image of your ID"] })] }), _jsxs("div", { className: "mt-4xl space-y-lg", children: [_jsx(Button, { onClick: () => {
|
|
11
|
-
context.setStep(2);
|
|
12
|
-
}, children: "Continue" }), _jsx(Button, { variant: "outline", children: "Continue on phone" })] })] })] }));
|
|
13
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function Step2(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import Image from 'next/image';
|
|
3
|
-
import { CheckIcon } from '../../icons/CheckIcon.js';
|
|
4
|
-
import { XIcon } from '../../icons/XIcon.js';
|
|
5
|
-
import selfie from '../../images/capture-selfie-banner.png';
|
|
6
|
-
import { Button } from '../../ui/Button/index.js';
|
|
7
|
-
import { useKYCContext } from './KYCContext.js';
|
|
8
|
-
export function Step2() {
|
|
9
|
-
const context = useKYCContext();
|
|
10
|
-
return (_jsxs("div", { className: "mt-2xl px-xl lg:mt-3xl lg:px-0", children: [_jsx("p", { className: "lg:text-text-secondary-700 text-center text-2xl font-semibold lg:text-base", children: "Take a selfie holding your ID" }), _jsxs("div", { className: "border-border-secondary bg-bg-primary-alt mt-6 rounded-xl border p-4 lg:mt-2xl lg:border-0 lg:bg-transparent lg:p-0", children: [_jsx(Image, { src: selfie, alt: "", className: "h-auto w-full", width: 600, height: 352 }), _jsxs("ul", { className: "mt-2xl space-y-3", children: [_jsxs("li", { className: "text-text-secondary-700 flex items-center gap-lg", children: [_jsx(CheckIcon, { className: "text-text-featured-icon-light-success size-6" }), "Face and ID must be clearly visible"] }), _jsxs("li", { className: "text-text-secondary-700 flex items-center gap-lg", children: [_jsx(CheckIcon, { className: "text-text-featured-icon-light-success size-6" }), "Take a photo in a well lit room"] }), _jsxs("li", { className: "text-text-secondary-700 flex items-center gap-lg", children: [_jsx(XIcon, { className: "text-text-featured-icon-light-error size-6" }), "No hats, sunglasses, or masks"] })] }), _jsxs("div", { className: "mt-4xl space-y-lg", children: [_jsx(Button, { size: "sm", onClick: () => {
|
|
11
|
-
context.setStep(3);
|
|
12
|
-
}, children: "Continue" }), _jsx(Button, { variant: "outline", children: "Continue on phone" })] })] })] }));
|
|
13
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function Step3(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { CheckIcon } from '../../icons/CheckIcon.js';
|
|
3
|
-
import { Button } from '../../ui/Button/index.js';
|
|
4
|
-
import { Checkbox } from '../../ui/Checkbox/index.js';
|
|
5
|
-
import { Field } from '../../ui/Field/index.js';
|
|
6
|
-
import { useKYCContext } from './KYCContext.js';
|
|
7
|
-
export function Step3() {
|
|
8
|
-
const context = useKYCContext();
|
|
9
|
-
return (_jsxs("div", { className: "mt-2xl px-xl lg:mt-3xl lg:px-0", children: [_jsx("p", { className: "lg:text-text-secondary-700 text-center text-2xl font-semibold lg:text-base", children: "Enter your basic and work-related information" }), _jsxs("form", { className: "border-border-secondary bg-bg-primary-alt mt-6 rounded-xl border p-4 lg:mt-2xl lg:border-0 lg:bg-transparent lg:p-0", onSubmit: (e) => {
|
|
10
|
-
e.preventDefault();
|
|
11
|
-
context.setStep(4);
|
|
12
|
-
}, children: [_jsxs(Field.Root, { children: [_jsx(Field.Label, { children: "Permanent address" }), _jsx(Field.Input, { placeholder: "Enter your permanent address" })] }), _jsxs(Checkbox.Root, { className: "mt-2xl", children: [_jsx(Checkbox.Control, { children: _jsx(Checkbox.Indicator, { asChild: true, children: _jsx(CheckIcon, {}) }) }), _jsx(Checkbox.Label, { children: "Same as permanent address" }), _jsx(Checkbox.HiddenInput, {})] }), _jsxs(Field.Root, { className: "mt-sm", children: [_jsx(Field.Label, { children: "Current address" }), _jsx(Field.Input, { placeholder: "Enter your current address" })] }), _jsxs(Field.Root, { className: "mt-2xl", children: [_jsx(Field.Label, { children: "Source of income" }), _jsx(Field.Input, { placeholder: "Enter your source of income" })] }), _jsxs(Field.Root, { className: "mt-2xl", children: [_jsx(Field.Label, { children: "Work Description" }), _jsx(Field.Input, { placeholder: "Enter your work description" })] }), _jsxs(Field.Root, { className: "mt-2xl", children: [_jsx(Field.Label, { children: "Place of birth" }), _jsx(Field.Input, { placeholder: "Enter your place of birth" })] }), _jsxs(Field.Root, { className: "mt-2xl", children: [_jsx(Field.Label, { children: "Nationality" }), _jsx(Field.Input, { placeholder: "Enter your nationality" })] }), _jsx(Button, { type: "submit", className: "mt-4xl", children: "Submit" })] })] }));
|
|
13
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function Step4(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { CheckCircleIcon } from '../../icons/CheckCircleIcon.js';
|
|
3
|
-
import { Button } from '../../ui/Button/index.js';
|
|
4
|
-
import { Dialog } from '../../ui/Dialog/index.js';
|
|
5
|
-
export function Step4() {
|
|
6
|
-
return (_jsxs("div", { children: [_jsx("div", { className: "bg-bg-success-secondary text-text-featured-icon-light-success mx-auto flex size-12 items-center justify-center rounded-full", children: _jsx(CheckCircleIcon, {}) }), _jsx("h2", { className: "mt-3 text-center", children: "Submission Successful" }), _jsx("p", { className: "text-text-tertiary-600 text-center", children: "Your documents have been submitted successfully. They\u2019re now under review, and you\u2019ll receive a notification as soon as your account is verified." }), _jsx(Dialog.Context, { children: (api) => (_jsx(Button, { className: "mt-3xl", onClick: () => api.setOpen(false), children: "Ok" })) })] }));
|
|
7
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { tz } from '@date-fns/tz';
|
|
3
|
-
import { format } from 'date-fns';
|
|
4
|
-
import Link from 'next/link';
|
|
5
|
-
import { useShallow } from 'zustand/shallow';
|
|
6
|
-
import { useGlobalStore, useLocaleInfo, useMarkMessageAsReadMutation, } from '../../client/hooks/index.js';
|
|
7
|
-
import { getMessageIcon } from '../../components/Messages/utils.js';
|
|
8
|
-
export function MessageItem({ message }) {
|
|
9
|
-
const {
|
|
10
|
-
/**/
|
|
11
|
-
id, icon, title, content, actions, markedAsRead, dateTimeCreated, } = message;
|
|
12
|
-
const localeInfo = useLocaleInfo();
|
|
13
|
-
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
14
|
-
message: ctx.message,
|
|
15
|
-
messages: ctx.messages,
|
|
16
|
-
})));
|
|
17
|
-
const markMessageAsReadMutation = useMarkMessageAsReadMutation();
|
|
18
|
-
const Icon = getMessageIcon(icon);
|
|
19
|
-
const handleViewMessage = async () => {
|
|
20
|
-
globalStore.message.setData(message);
|
|
21
|
-
globalStore.message.setOpen(true);
|
|
22
|
-
globalStore.messages.setOpen(false);
|
|
23
|
-
if (!markedAsRead)
|
|
24
|
-
markMessageAsReadMutation.mutate(id);
|
|
25
|
-
};
|
|
26
|
-
const handleActionClick = (e) => {
|
|
27
|
-
e.stopPropagation();
|
|
28
|
-
globalStore.messages.setOpen(false);
|
|
29
|
-
globalStore.messages.setTab('ALL');
|
|
30
|
-
};
|
|
31
|
-
return (_jsxs("div", { role: "button", tabIndex: 0, className: "border-border-secondary rounded-xs bg-bg-secondary flex h-auto flex-shrink-0 cursor-pointer flex-col border px-3.5 py-2.5", onClick: handleViewMessage, "aria-pressed": "false", children: [_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("p", { className: "text-text-tertiary-600 text-xs font-normal", children: format(new Date(dateTimeCreated), 'M/d/yyyy - h:mma', {
|
|
32
|
-
in: tz(localeInfo.timezone),
|
|
33
|
-
}) }), !markedAsRead && (_jsx("div", { className: "bg-utility-success-500 h-2.5 w-2.5 rounded-full" }))] }), _jsxs("div", { className: "mb-2 flex items-center space-x-2", children: [_jsx(Icon, { className: "text-brand-400" }), _jsx("p", { className: "text-text-primary-brand text-sm font-semibold", children: title })] }), _jsx("p", { className: "line-clamp-3 text-wrap text-sm font-normal", dangerouslySetInnerHTML: { __html: content } }), actions.length > 0 && (_jsx("div", { className: "mt-2 flex flex-wrap items-center justify-end gap-2", children: actions.map((action, index) => (_jsx(Link, { className: "border-button-secondary-border text-button-secondary-fg rounded-md border px-3 py-2 text-sm", href: action.url, onClick: handleActionClick, children: action.name }, index))) }))] }));
|
|
34
|
-
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import Image from 'next/image';
|
|
4
|
-
import Link from 'next/link';
|
|
5
|
-
import { ChevronLeftIcon } from '../../icons/index.js';
|
|
6
|
-
import { Button, Prose } from '../../ui/index.js';
|
|
7
|
-
export function PromoContent(props) {
|
|
8
|
-
return (_jsxs("div", { className: props.className, children: [_jsxs(Link, { href: props.viewAllPromosUrl ?? '/promos', className: "text-button-tertiary-fg flex w-fit items-center gap-lg text-lg font-semibold", children: [_jsx(ChevronLeftIcon, { className: "size-6" }), "Back to all Promotions"] }), _jsx(Image, { src: "https://s3.ap-east-1.amazonaws.com/opexa-assets.opexasystem.com/assets/BSxIXEsa59_zzMAR27-ALLDAYREBATE06-STATIC-WEB-HB-1920x1080.png", alt: "", width: 1024, height: 600, className: "mt-xl h-auto w-full rounded-xl lg:mt-6" }), _jsx(Button, { className: "mt-xl lg:mt-6", children: "Deposit Now" }), _jsx("h1", { className: "mt-xl text-2xl font-semibold lg:mt-6 lg:text-3xl", children: "Welcome Bonus 100% up to $500 + 10 Free Spins" }), _jsx("p", { className: "text-text-secondary-700 mt-xl lg:mt-6", children: "Ends 5/26/2025, 1:59:59 AM" }), _jsxs(Prose, { className: "mt-2xl lg:mt-6", children: [_jsx("p", { children: "Mi tincidunt elit, id quisque ligula ac diam, amet. Vel etiam suspendisse morbi eleifend faucibus eget vestibulum felis. Dictum quis montes, sit sit. Tellus aliquam enim urna, etiam. Mauris posuere vulputate arcu amet, vitae nisi, tellus tincidunt. At feugiat sapien varius id." }), _jsx("p", { children: "Eget quis mi enim, leo lacinia pharetra, semper. Eget in volutpat mollis at volutpat lectus velit, sed auctor. Porttitor fames arcu quis fusce augue enim. Quis at habitant diam at. Suscipit tristique risus, at donec. In turpis vel et quam imperdiet. Ipsum molestie aliquet sodales id est ac volutpat." }), _jsx("p", { children: "Ipsum sit mattis nulla quam nulla. Gravida id gravida ac enim mauris id. Non pellentesque congue eget consectetur turpis. Sapien, dictum molestie sem tempor. Diam elit, orci, tincidunt aenean tempus. Quis velit eget ut tortor tellus. Sed vel, congue felis elit erat nam nibh orci." }), _jsx("p", { children: "Dolor enim eu tortor urna sed duis nulla. Aliquam vestibulum, nulla odio nisl vitae. In aliquet pellentesque aenean hac vestibulum turpis mi bibendum diam. Tempor integer aliquam in vitae malesuada fringilla." }), _jsx("p", { children: "Elit nisi in eleifend sed nisi. Pulvinar at orci, proin imperdiet commodo consectetur convallis risus. Sed condimentum enim dignissim adipiscing faucibus consequat, urna. Viverra purus et erat auctor aliquam. Risus, volutpat vulputate posuere purus sit congue convallis aliquet. Arcu id augue ut feugiat donec porttitor neque. Mauris, neque ultricies eu vestibulum, bibendum quam lorem id. Dolor lacus, eget nunc lectus in tellus, pharetra, porttitor." }), _jsx("p", { children: "Ipsum sit mattis nulla quam nulla. Gravida id gravida ac enim mauris id. Non pellentesque congue eget consectetur turpis. Sapien, dictum molestie sem tempor. Diam elit, orci, tincidunt aenean tempus. Quis velit eget ut tortor tellus. Sed vel, congue felis elit erat nam nibh orci." }), _jsx("h5", { children: "General Conditions:" }), _jsx("p", { children: "Mi tincidunt elit, id quisque ligula ac diam, amet. Vel etiam suspendisse morbi eleifend faucibus eget vestibulum felis. Dictum quis montes, sit sit. Tellus aliquam enim urna, etiam. Mauris posuere vulputate arcu amet, vitae nisi, tellus tincidunt. At feugiat sapien varius id." }), _jsx("p", { children: "Eget quis mi enim, leo lacinia pharetra, semper. Eget in volutpat mollis at volutpat lectus velit, sed auctor. Porttitor fames arcu quis fusce augue enim. Quis at habitant diam at. Suscipit tristique risus, at donec. In turpis vel et quam imperdiet. Ipsum molestie aliquet sodales id est ac volutpat." })] }), _jsxs(Prose, { className: "bg-bg-secondary mt-xl rounded-2xl p-2xl lg:mt-16 lg:p-4xl", children: [_jsx("h2", { children: "Conclusion" }), _jsx("p", { children: "Morbi sed imperdiet in ipsum, adipiscing elit dui lectus. Tellus id scelerisque est ultricies ultricies. Duis est sit sed leo nisl, blandit elit sagittis. Quisque tristique consequat quam sed. Nisl at scelerisque amet nulla purus habitasse." }), _jsx("p", { children: "Nunc sed faucibus bibendum feugiat sed interdum. Ipsum egestas condimentum mi massa. In tincidunt pharetra consectetur sed duis facilisis metus. Etiam egestas in nec sed et. Quis lobortis at sit dictum eget nibh tortor commodo cursus." }), _jsx("p", { children: "Odio felis sagittis, morbi feugiat tortor vitae feugiat fusce aliquet. Nam elementum urna nisi aliquet erat dolor enim. Ornare id morbi eget ipsum. Aliquam senectus neque ut id eget consectetur dictum. Donec posuere pharetra odio consequat scelerisque et, nunc tortor." })] })] }));
|
|
9
|
-
}
|