@opexa/portal-components 0.0.114 → 0.0.115

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.
Files changed (63) hide show
  1. package/dist/client/hooks/useCreateDigitainGameSessionMutatio.d.ts +2 -0
  2. package/dist/client/hooks/useCreateDigitainGameSessionMutatio.js +41 -0
  3. package/dist/components/Empty.d.ts +2 -1
  4. package/dist/components/KYC/Header.js +2 -4
  5. package/dist/components/KYC/Step1.js +2 -3
  6. package/dist/components/KYC/Step2.js +2 -3
  7. package/dist/components/KYC/Step3.js +2 -4
  8. package/dist/components/KYC/Step4.js +2 -3
  9. package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuest.d.ts +1 -1
  10. package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuest.js +5 -10
  11. package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuestModal.js +3 -4
  12. package/dist/components/Quests/OnboardingQuest/OnboardingQuest.d.ts +1 -1
  13. package/dist/components/Quests/WageringQuest/WageringQuest.d.ts +1 -1
  14. package/dist/components/Quests/WageringQuest/WageringQuest.js +2 -3
  15. package/dist/components/Quests/WageringQuest/WageringQuestModal.js +3 -4
  16. package/dist/components/Search/Search.lazy.js +27 -12
  17. package/dist/constants/gameProviders.d.ts +2 -1
  18. package/dist/constants/gameProviders.js +0 -6
  19. package/dist/constants/gameTypes.d.ts +2 -1
  20. package/dist/constants/headerKeys.d.ts +0 -1
  21. package/dist/constants/headerKeys.js +0 -1
  22. package/dist/constants/secretQuestions.d.ts +1 -1
  23. package/dist/ui/AlertDialog/AlertDialog.d.ts +55 -55
  24. package/dist/ui/Badge/Badge.d.ts +12 -12
  25. package/dist/ui/Checkbox/Checkbox.d.ts +23 -23
  26. package/dist/ui/Checkbox/checkbox.recipe.d.ts +3 -3
  27. package/dist/ui/Combobox/Combobox.d.ts +42 -42
  28. package/dist/ui/Combobox/combobox.recipe.d.ts +3 -3
  29. package/dist/ui/DatePicker/DatePicker.d.ts +192 -192
  30. package/dist/ui/Dialog/Dialog.d.ts +55 -55
  31. package/dist/ui/Dialog/dialog.recipe.d.ts +5 -5
  32. package/dist/ui/Drawer/Drawer.d.ts +33 -33
  33. package/dist/ui/Menu/Menu.d.ts +306 -306
  34. package/dist/ui/Menu/menu.recipe.d.ts +8 -8
  35. package/dist/ui/Presence.d.ts +1 -1
  36. package/dist/ui/Presence.js +1 -1
  37. package/dist/ui/SegmentGroup/SegmentGroup.d.ts +18 -18
  38. package/dist/ui/Select/Select.d.ts +45 -45
  39. package/dist/ui/Select/select.recipe.d.ts +3 -3
  40. package/dist/ui/Table/Table.d.ts +21 -21
  41. package/dist/ui/Table/table.anatomy.d.ts +1 -1
  42. package/dist/ui/Table/table.recipe.d.ts +3 -3
  43. package/dist/ui/Tabs/Tabs.d.ts +15 -15
  44. package/dist/ui/Tabs/tabs.recipe.d.ts +3 -3
  45. package/dist/utils/mutationKeys.d.ts +1 -0
  46. package/dist/utils/mutationKeys.js +4 -0
  47. package/package.json +1 -1
  48. package/dist/components/CashbackBonus/CashbackBonus.client.d.ts +0 -2
  49. package/dist/components/CashbackBonus/CashbackBonus.client.js +0 -9
  50. package/dist/components/CashbackBonus/CashbackBonus.d.ts +0 -10
  51. package/dist/components/CashbackBonus/CashbackBonus.js +0 -5
  52. package/dist/components/CashbackBonus/index.d.ts +0 -1
  53. package/dist/components/CashbackBonus/index.js +0 -1
  54. package/dist/components/Promo/PromoContent.d.ts +0 -2
  55. package/dist/components/Promo/PromoContent.js +0 -9
  56. package/dist/components/Promos/PromoCarousel.d.ts +0 -2
  57. package/dist/components/Promos/PromoCarousel.js +0 -41
  58. package/dist/components/Promos/PromoGrid.d.ts +0 -2
  59. package/dist/components/Promos/PromoGrid.js +0 -12
  60. package/dist/components/Promos/PromoItem.d.ts +0 -7
  61. package/dist/components/Promos/PromoItem.js +0 -10
  62. package/dist/constants/endpoints.d.ts +0 -10
  63. package/dist/constants/endpoints.js +0 -41
@@ -0,0 +1,2 @@
1
+ import type { FavoriteGame, Game, GameSession, Mutation } from '../../types';
2
+ export declare const useCreateDigitainGameSessionMutatio: Mutation<GameSession | null, Game | FavoriteGame>;
@@ -0,0 +1,41 @@
1
+ import { ObjectId } from '@opexa/object-id';
2
+ import { useMutation } from '@tanstack/react-query';
3
+ import invariant from 'tiny-invariant';
4
+ import { ObjectType } from '../../services/ObjectType.js';
5
+ import { createGameSession, getGameSession } from '../../services/wallet.js';
6
+ import { createPoll } from '../../utils/createPoll.js';
7
+ import { getCreateDigitainGameSessionMutationKey } from '../../utils/mutationKeys.js';
8
+ import { getSession } from '../services/getSession.js';
9
+ export const useCreateDigitainGameSessionMutatio = (config) => {
10
+ return useMutation({
11
+ ...config,
12
+ mutationKey: getCreateDigitainGameSessionMutationKey(),
13
+ mutationFn: async (game) => {
14
+ const id = ObjectId.generate(ObjectType.GameSession).toString();
15
+ const session = await getSession();
16
+ invariant(session.status === 'authenticated');
17
+ await createGameSession({
18
+ id,
19
+ game: 'reference' in game ? game.reference : game.id,
20
+ }, {
21
+ headers: {
22
+ Authorization: `Bearer ${session.token}`,
23
+ },
24
+ });
25
+ const data = await createPoll(async () => {
26
+ const session = await getSession();
27
+ invariant(session.status === 'authenticated');
28
+ return await getGameSession(id, {
29
+ headers: {
30
+ Authorization: `Bearer ${session.token}`,
31
+ },
32
+ });
33
+ }, {
34
+ until: (r) => !!r?.launchUrl,
35
+ interval: 1000,
36
+ maxAttempt: 5,
37
+ })();
38
+ return data;
39
+ },
40
+ });
41
+ };
@@ -1,5 +1,5 @@
1
1
  import type { ComponentProps, ComponentType } from 'react';
2
- export interface EmptyProps {
2
+ interface EmptyProps {
3
3
  icon: ComponentType<ComponentProps<'svg'>>;
4
4
  title: string;
5
5
  message: string;
@@ -7,3 +7,4 @@ export interface EmptyProps {
7
7
  className?: string;
8
8
  }
9
9
  export declare function Empty(props: EmptyProps): import("react/jsx-runtime").JSX.Element;
10
+ export {};
@@ -1,8 +1,6 @@
1
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';
2
+ import { ChevronLeftIcon, XIcon } from '../../icons/index.js';
3
+ import { Dialog, IconButton } from '../../ui/index.js';
6
4
  export function Header() {
7
5
  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
6
  }
@@ -1,9 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import Image from 'next/image';
3
- import { CheckIcon } from '../../icons/CheckIcon.js';
4
- import { XIcon } from '../../icons/XIcon.js';
3
+ import { CheckIcon, XIcon } from '../../icons/index.js';
5
4
  import uploadId from '../../images/capture-id-banner.png';
6
- import { Button } from '../../ui/Button/index.js';
5
+ import { Button } from '../../ui/index.js';
7
6
  import { useKYCContext } from './KYCContext.js';
8
7
  export function Step1() {
9
8
  const context = useKYCContext();
@@ -1,9 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import Image from 'next/image';
3
- import { CheckIcon } from '../../icons/CheckIcon.js';
4
- import { XIcon } from '../../icons/XIcon.js';
3
+ import { CheckIcon, XIcon } from '../../icons/index.js';
5
4
  import selfie from '../../images/capture-selfie-banner.png';
6
- import { Button } from '../../ui/Button/index.js';
5
+ import { Button } from '../../ui/index.js';
7
6
  import { useKYCContext } from './KYCContext.js';
8
7
  export function Step2() {
9
8
  const context = useKYCContext();
@@ -1,8 +1,6 @@
1
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';
2
+ import { CheckIcon } from '../../icons/index.js';
3
+ import { Button, Checkbox, Field } from '../../ui/index.js';
6
4
  import { useKYCContext } from './KYCContext.js';
7
5
  export function Step3() {
8
6
  const context = useKYCContext();
@@ -1,7 +1,6 @@
1
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';
2
+ import { CheckCircleIcon } from '../../icons/index.js';
3
+ import { Button, Dialog } from '../../ui/index.js';
5
4
  export function Step4() {
6
5
  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
6
  }
@@ -1,4 +1,4 @@
1
- import type { Quest } from '../../../types';
1
+ import type { Quest } from '@opexa/portal-sdk-core';
2
2
  export declare function DailyCheckInQuest({ quest }: {
3
3
  quest: Quest;
4
4
  }): import("react/jsx-runtime").JSX.Element;
@@ -3,16 +3,11 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
3
3
  import { addDays, isEqual, startOfDay } from 'date-fns';
4
4
  import { useState } from 'react';
5
5
  import { twMerge } from 'tailwind-merge';
6
- import { useCheckInDailyCheckInQuestMutation } from '../../../client/hooks/useCheckInDailyCheckInQuestMutation.js';
7
- import { toaster } from '../../../client/utils/toaster.js';
8
- import { CalendarIcon } from '../../../icons/CalendarIcon.js';
9
- import { CheckIcon } from '../../../icons/CheckIcon.js';
10
- import { ClockStopWatchIcon } from '../../../icons/ClockStopWatchIcon.js';
11
- import { InfoCircleIcon } from '../../../icons/InfoCircleIcon.js';
12
- import { Badge } from '../../../ui/Badge/index.js';
13
- import { Button } from '../../../ui/Button/index.js';
14
- import { getQueryClient } from '../../../utils/getQueryClient.js';
15
- import { getAvailableQuestsQueryKey } from '../../../utils/queryKeys.js';
6
+ import { useCheckInDailyCheckInQuestMutation } from '../../../client/hooks/index.js';
7
+ import { toaster } from '../../../client/utils/index.js';
8
+ import { CalendarIcon, CheckIcon, ClockStopWatchIcon, InfoCircleIcon, } from '../../../icons/index.js';
9
+ import { Badge, Button } from '../../../ui/index.js';
10
+ import { getAvailableQuestsQueryKey, getQueryClient } from '../../../utils/index.js';
16
11
  import CountdownTimer from '../CountdownTimer.js';
17
12
  import { DailyCheckInQuestModal } from './DailyCheckInQuestModal.js';
18
13
  export function DailyCheckInQuest({ quest }) {
@@ -1,9 +1,8 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { XIcon } from '../../../icons/XIcon.js';
4
- import { Button } from '../../../ui/Button/index.js';
5
- import { Dialog } from '../../../ui/Dialog/index.js';
6
- import { Portal } from '../../../ui/Portal/index.js';
3
+ import { Portal } from '@ark-ui/react';
4
+ import { XIcon } from '../../../icons/index.js';
5
+ import { Button, Dialog } from '../../../ui/index.js';
7
6
  export function DailyCheckInQuestModal(props) {
8
7
  return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: props.modalState.isOpen, onOpenChange: ({ open }) => props.modalState.setIsOpen(open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("p", { className: "text-text-primary-900 text-lg font-semibold", children: "Daily Check-In Rules" }), _jsxs("ul", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn rewards just for checking in each day!" }), _jsx("li", { children: "Stay consistent to unlock special rewards on the 3rd, 5th, and 7th day." }), _jsx("li", { children: "Missing a day will reset your streak, starting again from Day 1." }), _jsx("li", { children: "Each check-in unlocks the next one on the following day." }), _jsx("li", { children: "Successfully check in for 7 consecutive days to complete the quest and reset the cycle." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => props.modalState.setIsOpen(false), children: "Ok" }) })] }) })] }) }));
9
8
  }
@@ -1,4 +1,4 @@
1
- import type { Quest } from '../../../types';
1
+ import type { Quest } from '@opexa/portal-sdk-core';
2
2
  export declare function OnboardingQuest(props: {
3
3
  quest: Quest;
4
4
  }): null;
@@ -1,4 +1,4 @@
1
- import type { Quest } from '../../../types';
1
+ import type { Quest } from '@opexa/portal-sdk-core';
2
2
  export declare function WageringQuest({ quest }: {
3
3
  quest: Quest;
4
4
  }): import("react/jsx-runtime").JSX.Element;
@@ -2,9 +2,8 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
3
  import { useState } from 'react';
4
4
  import { twMerge } from 'tailwind-merge';
5
- import { ClockStopWatchIcon } from '../../../icons/ClockStopWatchIcon.js';
6
- import { InfoCircleIcon } from '../../../icons/InfoCircleIcon.js';
7
- import { Badge } from '../../../ui/Badge/index.js';
5
+ import { ClockStopWatchIcon, InfoCircleIcon } from '../../../icons/index.js';
6
+ import { Badge } from '../../../ui/index.js';
8
7
  import CountdownTimer from '../CountdownTimer.js';
9
8
  import { WageringQuestModal } from './WageringQuestModal.js';
10
9
  export function WageringQuest({ quest }) {
@@ -1,9 +1,8 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { XIcon } from '../../../icons/XIcon.js';
4
- import { Button } from '../../../ui/Button/index.js';
5
- import { Dialog } from '../../../ui/Dialog/index.js';
6
- import { Portal } from '../../../ui/Portal/index.js';
3
+ import { Portal } from '@ark-ui/react';
4
+ import { XIcon } from '../../../icons/index.js';
5
+ import { Button, Dialog } from '../../../ui/index.js';
7
6
  export function WageringQuestModal(props) {
8
7
  return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: props.modalState.isOpen, onOpenChange: ({ open }) => props.modalState.setIsOpen(open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("p", { className: "text-text-primary-900 text-lg font-semibold", children: props.questName }), _jsxs("ul", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn extra rewards just by playing Slots, every bet counts, win or lose!" }), _jsx("li", { children: "Reach the wagering requirement in bets to complete the quest and claim your reward." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => props.modalState.setIsOpen(false), children: "Ok" }) })] }) })] }) }));
9
8
  }
@@ -5,7 +5,9 @@ import Image, {} from 'next/image';
5
5
  import Link from 'next/link';
6
6
  import { useRef, useState } from 'react';
7
7
  import { twMerge } from 'tailwind-merge';
8
+ import { useDebounceCallback } from 'usehooks-ts';
8
9
  import { useShallow } from 'zustand/shallow';
10
+ import { useControllableState } from '../../client/hooks/useControllableState.js';
9
11
  import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
10
12
  import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
11
13
  import { GAME_PROVIDER_DATA } from '../../constants/index.js';
@@ -26,15 +28,23 @@ export function Search(props) {
26
28
  })));
27
29
  const inputRef = useRef(null);
28
30
  const [search, setSearch] = useState('');
31
+ const gameProviders = props.gameProviders
32
+ .map((provider) => GAME_PROVIDER_DATA[provider])
33
+ .filter((provider) => provider.name
34
+ .toLowerCase()
35
+ .replace(/\s+/g, '')
36
+ .includes(search.toLowerCase().replace(/\s+/g, '')));
29
37
  const gamesQuery = useGamesQuery({
30
38
  first: 18,
31
- search,
39
+ search: gameProviders.length > 0 ? undefined : search,
32
40
  filter: {
33
41
  type: {
34
42
  in: props.gameTypes,
35
43
  },
36
44
  provider: {
37
- in: props.gameProviders,
45
+ in: gameProviders.length > 0
46
+ ? gameProviders.map((p) => p.id)
47
+ : props.gameProviders,
38
48
  },
39
49
  },
40
50
  }, {
@@ -43,12 +53,6 @@ export function Search(props) {
43
53
  const games = gamesQuery.data?.pages
44
54
  .map((page) => page.edges.map((edge) => edge.node))
45
55
  .flat() ?? [];
46
- const gameProviders = props.gameProviders
47
- .map((provider) => GAME_PROVIDER_DATA[provider])
48
- .filter((provider) => provider.name
49
- .toLowerCase()
50
- .replace(/\s+/g, '')
51
- .includes(search.toLowerCase().replace(/\s+/g, '')));
52
56
  const empty = games.length <= 0 && gameProviders.length <= 0;
53
57
  const viewGamesUrl = (data) => {
54
58
  return props.viewGamesUrl
@@ -63,12 +67,10 @@ export function Search(props) {
63
67
  return (_jsx(Dialog.Root, { open: globalStore.search.open, onOpenChange: (details) => {
64
68
  globalStore.search.setOpen(details.open);
65
69
  setSearch('');
66
- }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "bg-bg-primary lg:min-h-auto mx-auto min-h-full w-full pt-xl lg:mt-[132px] lg:max-w-[1136px] lg:bg-unset lg:pt-0", children: [_jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "flex items-center justify-between px-4 lg:hidden", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 40, className: "h-8 w-auto" }), _jsx(IconButton, { size: "sm", colorScheme: "gray", onClick: () => api.setOpen(false), children: _jsx(XIcon, { className: "text-text-quinary size-6" }) })] })) }), _jsx("div", { className: "flex justify-end", children: _jsx(Dialog.Context, { children: (api) => (_jsx("button", { type: "button", onClick: () => api.setOpen(false), className: "hidden size-9 items-center justify-center rounded-md bg-white/20 lg:flex", children: _jsx(XIcon, { className: "size-5 text-white" }) })) }) }), _jsx("div", { className: "mt-2xl px-4 lg:mt-xl lg:px-0", children: _jsxs("div", { className: "relative", children: [_jsx(SearchLgIcon, { className: "text-text-quinary pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2" }), _jsx(Field.Input, { ref: inputRef, type: "search", value: search, onChange: (e) => {
67
- setSearch(e.target.value);
68
- }, className: "pl-10 pr-16", placeholder: "Search", autoComplete: "off" }), _jsx(Presence, { present: search.length > 0, asChild: true, lazyMount: true, children: _jsx("button", { type: "button", className: "text-text-secondary-700 absolute right-3.5 top-1/2 -translate-y-1/2 font-semibold", onClick: () => {
70
+ }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "bg-bg-primary lg:min-h-auto mx-auto min-h-full w-full pt-xl lg:mt-[132px] lg:max-w-[1136px] lg:bg-unset lg:pt-0", children: [_jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "flex items-center justify-between px-4 lg:hidden", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 40, className: "h-8 w-auto" }), _jsx(IconButton, { size: "sm", colorScheme: "gray", onClick: () => api.setOpen(false), children: _jsx(XIcon, { className: "text-text-quinary size-6" }) })] })) }), _jsx("div", { className: "flex justify-end", children: _jsx(Dialog.Context, { children: (api) => (_jsx("button", { type: "button", onClick: () => api.setOpen(false), className: "hidden size-9 items-center justify-center rounded-md bg-white/20 lg:flex", children: _jsx(XIcon, { className: "size-5 text-white" }) })) }) }), _jsx("div", { className: "mt-2xl px-4 lg:mt-xl lg:px-0", children: _jsxs("div", { className: "relative", children: [_jsx(SearchLgIcon, { className: "text-text-quinary pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2" }), _jsx(DebouncedInput, { ref: inputRef, value: search, onChange: setSearch }), _jsx(Presence, { present: search.length > 0, asChild: true, lazyMount: true, children: _jsx("button", { type: "button", className: "text-text-secondary-700 absolute right-3.5 top-1/2 -translate-y-1/2 font-semibold", onClick: () => {
69
71
  setSearch('');
70
72
  inputRef.current?.focus();
71
- }, children: "Clear" }) })] }) }), _jsx("div", { className: "lg:bg-bg-primary lg:border-border-primary mt-2xl p-xl pb-3xl lg:mt-2 lg:rounded-xl lg:border", children: search.length <= 0 ? (_jsx(Alert, { message: "Search for your favorite game or provider." })) : search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [empty && _jsx(Alert, { message: "No results found" }), !empty && (_jsxs(_Fragment, { children: [gameProviders.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "text-lg font-semibold", children: "Providers" }), _jsx("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: gameProviders.map((provider) => (_jsx(Link, { href: viewGamesUrl(provider), "aria-label": `View ${provider.name} games`, className: twMerge('bg-gray-800 flex h-14 w-full items-center rounded-md', classNames.providerThumbnailRoot), onClick: () => {
73
+ }, children: "Clear" }) })] }) }), _jsx("div", { className: "lg:bg-bg-primary lg:border-border-primary mt-2xl p-xl pb-3xl lg:mt-2 lg:max-h-[41rem] lg:overflow-y-auto lg:rounded-xl lg:border", children: search.length <= 0 ? (_jsx(Alert, { message: "Search for your favorite game or provider." })) : search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [empty && _jsx(Alert, { message: "No results found" }), !empty && (_jsxs(_Fragment, { children: [gameProviders.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "text-lg font-semibold", children: "Providers" }), _jsx("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: gameProviders.map((provider) => (_jsx(Link, { href: viewGamesUrl(provider), "aria-label": `View ${provider.name} games`, className: twMerge('bg-gray-800 flex h-14 w-full items-center rounded-md', classNames.providerThumbnailRoot), onClick: () => {
72
74
  globalStore.search.setOpen(false);
73
75
  }, children: _jsx(Image, { src: props.gameProviderImages?.[provider.id] ??
74
76
  provider.logo, alt: "", width: 100, height: 50, className: twMerge('mx-auto h-auto w-full', classNames.providerThumbnailImage) }) }, provider.id))) })] })), games.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "mt-3xl text-lg font-semibold", children: "Games" }), _jsx("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { game: game, className: twMerge('block w-full shadow-sm', classNames.gameThumbnailRoot), onClick: () => {
@@ -78,6 +80,19 @@ export function Search(props) {
78
80
  provider: game.provider,
79
81
  }), alt: "", width: 200, height: 200, priority: true, className: "aspect-square w-full rounded-t-md object-cover" }), _jsx("span", { className: twMerge('bg-bg-tertiary text-text-primary-brand block w-full truncate rounded-b-md px-2 py-2.5 text-center text-xs font-semibold', classNames.gameThumbnailTitle), children: game.name })] }, game.id))) })] })), _jsx(Presence, { present: gamesQuery.hasNextPage, children: _jsx(Button, { variant: "outline", className: "mx-auto mt-12 w-fit", onClick: () => gamesQuery.fetchNextPage(), children: "Load More" }) })] }))] })) })] }) })] }) }));
80
82
  }
83
+ function DebouncedInput(props) {
84
+ const [value, setValue] = useControllableState({
85
+ value: props.value,
86
+ defaultValue: props.defaultValue ?? '',
87
+ onChange: props.onChange,
88
+ });
89
+ const setValueDebounced = useDebounceCallback(setValue, 300);
90
+ const [internalValue, setInternalValue] = useState(value);
91
+ return (_jsx(Field.Input, { ref: props.ref, type: "search", value: internalValue, onChange: (e) => {
92
+ setInternalValue(e.target.value);
93
+ setValueDebounced(e.target.value);
94
+ }, className: "pl-10 pr-16", placeholder: "Search", autoComplete: "off" }));
95
+ }
81
96
  function Alert({ message }) {
82
97
  return (_jsxs("div", { className: "py-lg", role: "alert", "aria-live": "polite", children: [_jsx("div", { className: "bg-bg-secondary shadow-xs border-border-primary mx-auto flex size-12 items-center justify-center rounded-lg border", children: _jsx(SearchLgIcon, { className: "text-text-secondary-700 size-6" }) }), _jsx("p", { className: "text-text-secondary-700 mt-4 text-center", children: message })] }));
83
98
  }
@@ -1,4 +1,5 @@
1
- import type { GameProvider, GameProviderData } from '../types';
1
+ import type { GameProvider } from '@opexa/portal-sdk-core';
2
+ import type { GameProviderData } from '../types';
2
3
  export declare const GAME_PROVIDER_DATA: Record<GameProvider, GameProviderData>;
3
4
  export declare const GAME_PROVIDERS: ["ALIZE", "BGAMING", "BOOONGO", "EVOPLAY", "BTI", "CQ9", "DARWIN", "DG", "DRBINGO", "E2E", "ETENGJUE", "EVOLUTION", "EVOLUTION_REDTIGER", "EZUGI", "FACHAI", "HABANERO", "HACKSAW", "HOLLYWOODTV", "JDB", "JILI", "JDBGTF", "JOKER", "JDBSPRIBE", "JILI_BINGO", "KINGMAKER", "KINGMIDAS", "MEGA2SPIN", "MICROGAMING", "MEGABALL", "ONEAPI_EVOLUTION", "PGSOFT", "PLAYTECH", "PRAGMATICPLAY", "RELAXGAMING", "RTG", "SABA", "SPINIX", "SPRIBE", "YELLOWBAT", "EVOLUTIONNETENT", "EVOLUTION_NETENT"];
4
5
  export declare const LEGACY_GAME_PROVIDERS: ["JILI", "PGSOFT", "FACHAI", "BTI", "DG", "PLAYTECH", "E2E", "ONEAPI_EVOLUTION", "CQ9", "JDB", "HABANERO", "SPINIX", "JOKER", "HACKSAW", "EVOLUTIONNETENT", "JDBGTF", "JDBSPRIBE", "MICROGAMING", "RELAXGAMING", "EVOPLAY", "BOOONGO", "BGAMING", "KINGMAKER", "KINGMIDAS", "YELLOWBAT", "ETENGJUE", "SABA", "PRAGMATICPLAY", "SPRIBE", "EZUGI", "ALIZE"];
@@ -283,12 +283,6 @@ export const GAME_PROVIDER_DATA = {
283
283
  slug: 'evolution-netent',
284
284
  logo: evolutionNetent,
285
285
  },
286
- DIGITAIN: {
287
- id: 'DIGITAIN',
288
- name: 'Digitain',
289
- slug: 'digitain',
290
- logo: '',
291
- },
292
286
  };
293
287
  export const GAME_PROVIDERS = [
294
288
  'ALIZE',
@@ -1,3 +1,4 @@
1
- import type { GameType, GameTypeData } from '../types';
1
+ import type { GameType } from '@opexa/portal-sdk-core';
2
+ import type { GameTypeData } from '../types';
2
3
  export declare const GAME_TYPE_DATA: Record<GameType, GameTypeData>;
3
4
  export declare const GAME_TYPES: ["ARCADE", "BINGO", "FISHING", "GAMES", "LIVE", "NUMERICAL", "SLOTS", "SPECIALTY", "SPORTS", "TABLE"];
@@ -1,2 +1 @@
1
1
  export declare const RECAPTCHA_HEADER_KEY: string;
2
- export declare const TEST_PASS_HEADER_KEY: string;
@@ -1,2 +1 @@
1
1
  export const RECAPTCHA_HEADER_KEY = 'Google-Recaptcha-Response';
2
- export const TEST_PASS_HEADER_KEY = 'Test-Pass';
@@ -1,3 +1,3 @@
1
- import type { SecretQuestion } from '../types';
1
+ import type { SecretQuestion } from '@opexa/portal-sdk-core';
2
2
  export declare const SECRET_QUESTIONS: ["BEST_CHILDHOOD_FRIEND", "BIRTH_PLACE", "FAVORITE_BOOK", "FAVORITE_MOVIE", "FAVORITE_TEACHER", "FIRST_CAR", "FIRST_PET", "FIRST_SCHOOL", "MOTHERS_MAIDEN_NAME", "PARENTS_MET_CITY"];
3
3
  export declare const SECRET_QUESTIONS_MAP: Record<SecretQuestion, string>;