@opexa/portal-components 0.0.451 → 0.0.452

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 (68) hide show
  1. package/dist/components/AccountInfo/GoogleDisconnect.d.ts +7 -0
  2. package/dist/components/AccountInfo/GoogleDisconnect.js +11 -0
  3. package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositContext.d.ts +2 -2
  4. package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/useOnlineBankDeposit.d.ts +1 -1
  5. package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositContext.d.ts +2 -2
  6. package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/useQRPHDeposit.d.ts +1 -1
  7. package/dist/components/DepositWithdrawal/Withdrawal/GCashWithdrawal/GCashWithdrawal.js +91 -83
  8. package/dist/components/DigitainLauncher/Loading.d.ts +1 -0
  9. package/dist/components/DigitainLauncher/Loading.js +5 -0
  10. package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css +184 -0
  11. package/dist/components/Jackpots/JackpotsList/JackpotsListItem.module.css +184 -0
  12. package/dist/components/KYC/BasicInformation.d.ts +1 -0
  13. package/dist/components/KYC/BasicInformation.js +101 -0
  14. package/dist/components/KYC/IdentityVerification.d.ts +1 -0
  15. package/dist/components/KYC/IdentityVerification.js +120 -0
  16. package/dist/components/KYC/Indicator.d.ts +1 -0
  17. package/dist/components/KYC/Indicator.js +8 -0
  18. package/dist/components/KYC/KYC.lazy.d.ts +6 -0
  19. package/dist/components/KYC/KYC.lazy.js +45 -0
  20. package/dist/components/KYC/KYCContext.d.ts +6 -0
  21. package/dist/components/KYC/KYCContext.js +2 -0
  22. package/dist/components/KYC/PersonalInformation.d.ts +1 -0
  23. package/dist/components/KYC/PersonalInformation.js +122 -0
  24. package/dist/components/KYC/useKYC.d.ts +25 -0
  25. package/dist/components/KYC/useKYC.js +38 -0
  26. package/dist/components/PortalProvider/CXDTokenObserver.js +11 -11
  27. package/dist/components/PortalProvider/LinkGoogleAccountObserver.d.ts +1 -0
  28. package/dist/components/PortalProvider/LinkGoogleAccountObserver.js +29 -0
  29. package/dist/components/Quests/JourneyQuest.js +9 -8
  30. package/dist/components/Quests/MultiWageringQuest.d.ts +1 -0
  31. package/dist/components/Quests/MultiWageringQuest.js +91 -0
  32. package/dist/components/Quests/Quests.client.js +7 -1
  33. package/dist/components/SessionWatcher/SessionWatcher.d.ts +1 -0
  34. package/dist/components/SessionWatcher/SessionWatcher.js +20 -0
  35. package/dist/components/SessionWatcher/index.d.ts +1 -0
  36. package/dist/components/SessionWatcher/index.js +1 -0
  37. package/dist/icons/LinkBrokenIcon.d.ts +2 -0
  38. package/dist/icons/LinkBrokenIcon.js +4 -0
  39. package/dist/images/responsible-gaming-yellow.png +0 -0
  40. package/dist/services/queries.d.ts +2 -2
  41. package/dist/services/queries.js +7 -0
  42. package/dist/styles/theme.css +3 -0
  43. package/dist/types/index.d.ts +9 -1
  44. package/dist/ui/Badge/Badge.d.ts +12 -12
  45. package/dist/ui/Badge/badge.anatomy.d.ts +1 -1
  46. package/dist/ui/Badge/badge.recipe.d.ts +3 -3
  47. package/dist/ui/Carousel/Carousel.d.ts +99 -99
  48. package/dist/ui/Carousel/carousel.recipe.d.ts +11 -11
  49. package/dist/ui/Checkbox/Checkbox.d.ts +23 -23
  50. package/dist/ui/Checkbox/checkbox.recipe.d.ts +3 -3
  51. package/dist/ui/Combobox/Combobox.d.ts +42 -42
  52. package/dist/ui/Combobox/combobox.recipe.d.ts +3 -3
  53. package/dist/ui/DatePicker/DatePicker.d.ts +72 -72
  54. package/dist/ui/DatePicker/datePicker.recipe.d.ts +3 -3
  55. package/dist/ui/Menu/Menu.d.ts +90 -90
  56. package/dist/ui/Menu/menu.recipe.d.ts +5 -5
  57. package/dist/ui/Popover/Popover.d.ts +55 -55
  58. package/dist/ui/Popover/popover.recipe.d.ts +5 -5
  59. package/dist/ui/QrCode/QrCode.d.ts +25 -25
  60. package/dist/ui/QrCode/qrCode.recipe.d.ts +5 -5
  61. package/dist/ui/SegmentGroup/SegmentGroup.d.ts +18 -18
  62. package/dist/ui/SegmentGroup/segmentGroup.recipe.d.ts +3 -3
  63. package/dist/ui/Select/Select.d.ts +45 -45
  64. package/dist/ui/Select/select.recipe.d.ts +3 -3
  65. package/dist/ui/Table/Table.d.ts +21 -21
  66. package/dist/ui/Table/table.anatomy.d.ts +1 -1
  67. package/dist/ui/Table/table.recipe.d.ts +3 -3
  68. package/package.json +1 -1
@@ -0,0 +1,7 @@
1
+ import { type UseDisclosureReturn } from '../../client/hooks/useDisclosure';
2
+ interface GoogleDisconnectProps {
3
+ onConfirmAction?: (ctx: UseDisclosureReturn) => React.ReactNode;
4
+ children?: (ctx: UseDisclosureReturn) => React.ReactNode;
5
+ }
6
+ export declare function GoogleDisconnect(props: GoogleDisconnectProps): import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,11 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
+ import { useDisclosure, } from '../../client/hooks/useDisclosure.js';
4
+ import { LinkBrokenIcon } from '../../icons/LinkBrokenIcon.js';
5
+ import { XIcon } from '../../icons/XIcon.js';
6
+ import { Dialog } from '../../ui/Dialog/index.js';
7
+ import { Portal } from '../../ui/Portal/index.js';
8
+ export function GoogleDisconnect(props) {
9
+ const disclosure = useDisclosure();
10
+ return (_jsxs(_Fragment, { children: [props.children?.(disclosure), _jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: disclosure.open, onOpenChange: (details) => disclosure.setOpen(details.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: "mx-auto min-h-auto max-w-[25rem] overflow-y-auto rounded-xl p-6", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col ", children: [_jsx("div", { className: "mx-auto flex size-12 items-center justify-center rounded-full bg-bg-brand-secondary text-text-brand", children: _jsx(LinkBrokenIcon, {}) }), _jsx("h2", { className: "mb-1 text-center font-semibold text-lg xl:mt-xl", children: "Disconnect Google Account" }), _jsx("p", { className: "text-center text-sm text-text-tertiary-600 leading-2xl", children: "Are you sure you want to disconnect your Google account? This may affect your ability to log in or sync data." })] }), _jsx("div", { className: "pt-6", children: props.onConfirmAction?.(disclosure) })] }) })] }) })] }));
11
+ }
@@ -1,6 +1,6 @@
1
1
  export declare const OnlineBankDepositContext: (props: {
2
2
  value: {
3
- view: "vca" | "form";
3
+ view: "form" | "vca";
4
4
  status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
5
5
  verify: () => void;
6
6
  reset: () => void;
@@ -13,7 +13,7 @@ export declare const OnlineBankDepositContext: (props: {
13
13
  } & {
14
14
  children?: import("react").ReactNode | undefined;
15
15
  }) => React.ReactNode, useOnlineBankDepositContext: () => {
16
- view: "vca" | "form";
16
+ view: "form" | "vca";
17
17
  status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
18
18
  verify: () => void;
19
19
  reset: () => void;
@@ -1,7 +1,7 @@
1
1
  import type { Deposit } from '../../../../types';
2
2
  export type UseOnlineBankDepositReturn = ReturnType<typeof useOnlineBankDeposit>;
3
3
  export declare function useOnlineBankDeposit(): {
4
- view: "vca" | "form";
4
+ view: "form" | "vca";
5
5
  status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
6
6
  verify: () => void;
7
7
  reset: () => void;
@@ -1,6 +1,6 @@
1
1
  export declare const QRPHDepositContext: (props: {
2
2
  value: {
3
- view: "qrCode" | "form";
3
+ view: "form" | "qrCode";
4
4
  status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
5
5
  verify: () => void;
6
6
  reset: () => void;
@@ -13,7 +13,7 @@ export declare const QRPHDepositContext: (props: {
13
13
  } & {
14
14
  children?: import("react").ReactNode | undefined;
15
15
  }) => React.ReactNode, useQRPHDepositContext: () => {
16
- view: "qrCode" | "form";
16
+ view: "form" | "qrCode";
17
17
  status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
18
18
  verify: () => void;
19
19
  reset: () => void;
@@ -1,7 +1,7 @@
1
1
  import type { Deposit } from '../../../../types';
2
2
  export type UseQRPHDepositReturn = ReturnType<typeof useQRPHDeposit>;
3
3
  export declare function useQRPHDeposit(): {
4
- view: "qrCode" | "form";
4
+ view: "form" | "qrCode";
5
5
  status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
6
6
  verify: () => void;
7
7
  reset: () => void;
@@ -1,35 +1,35 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { zodResolver } from "@hookform/resolvers/zod";
3
- import Link from "next/link";
4
- import { useEffect, useState } from "react";
5
- import { Controller, useForm } from "react-hook-form";
6
- import { z } from "zod";
7
- import { useShallow } from "zustand/shallow";
8
- import { useCreateGCashWithdrawalMutation } from "../../../../client/hooks/useCreateGCashWithdrawalMutation.js";
9
- import { useCreateGCashStandardCashInWithdrawalMutation } from "../../../../client/hooks/useCreateGCashStandardCashInWithdrawal.js";
10
- import { useGlobalStore } from "../../../../client/hooks/useGlobalStore.js";
11
- import { useLocaleInfo } from "../../../../client/hooks/useLocaleInfo.js";
12
- import { useMobileNumberParser } from "../../../../client/hooks/useMobileNumberParser.js";
13
- import { usePaymentSettingsQuery } from "../../../../client/hooks/usePaymentSettingsQuery.js";
14
- import { AlertCircleIcon } from "../../../../icons/AlertCircleIcon.js";
15
- import { ChevronDownIcon } from "../../../../icons/ChevronDownIcon.js";
16
- import { ChevronUpIcon } from "../../../../icons/ChevronUpIcon.js";
17
- import { EyeIcon } from "../../../../icons/EyeIcon.js";
18
- import { EyeOffIcon } from "../../../../icons/EyeOffIcon.js";
19
- import { SpinnerIcon } from "../../../../icons/SpinnerIcon.js";
20
- import { XIcon } from "../../../../icons/XIcon.js";
21
- import { AlertDialog } from "../../../../ui/AlertDialog/index.js";
22
- import { Button } from "../../../../ui/Button/index.js";
23
- import { Field } from "../../../../ui/Field/index.js";
24
- import { NumberInput } from "../../../../ui/NumberInput/index.js";
25
- import { PasswordInput } from "../../../../ui/PasswordInput/index.js";
26
- import { Portal } from "../../../../ui/Portal/index.js";
27
- import { parseDecimal } from "../../../../utils/parseDecimal.js";
28
- import { AmountChoices } from "../../AmountChoices.js";
29
- import { useDepositWithdrawalPropsContext } from "../../DepositWithdrawalContext.js";
30
- import { explainError } from "../../utils.js";
31
- import { TransactionPasswordNotSet } from "../TransactionPasswordNotSet.js";
32
- import { useFeatureFlag } from "../../../../client/hooks/useFeatureFlag.js";
2
+ import { zodResolver } from '@hookform/resolvers/zod';
3
+ import Link from 'next/link';
4
+ import { useEffect, useState } from 'react';
5
+ import { Controller, useForm } from 'react-hook-form';
6
+ import { z } from 'zod';
7
+ import { useShallow } from 'zustand/shallow';
8
+ import { useCreateGCashStandardCashInWithdrawalMutation } from '../../../../client/hooks/useCreateGCashStandardCashInWithdrawal.js';
9
+ import { useCreateGCashWithdrawalMutation } from '../../../../client/hooks/useCreateGCashWithdrawalMutation.js';
10
+ import { useFeatureFlag } from '../../../../client/hooks/useFeatureFlag.js';
11
+ import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
12
+ import { useLocaleInfo } from '../../../../client/hooks/useLocaleInfo.js';
13
+ import { useMobileNumberParser } from '../../../../client/hooks/useMobileNumberParser.js';
14
+ import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSettingsQuery.js';
15
+ import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
16
+ import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
17
+ import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
18
+ import { EyeIcon } from '../../../../icons/EyeIcon.js';
19
+ import { EyeOffIcon } from '../../../../icons/EyeOffIcon.js';
20
+ import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
21
+ import { XIcon } from '../../../../icons/XIcon.js';
22
+ import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
23
+ import { Button } from '../../../../ui/Button/index.js';
24
+ import { Field } from '../../../../ui/Field/index.js';
25
+ import { NumberInput } from '../../../../ui/NumberInput/index.js';
26
+ import { PasswordInput } from '../../../../ui/PasswordInput/index.js';
27
+ import { Portal } from '../../../../ui/Portal/index.js';
28
+ import { parseDecimal } from '../../../../utils/parseDecimal.js';
29
+ import { AmountChoices } from '../../AmountChoices.js';
30
+ import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
31
+ import { explainError } from '../../utils.js';
32
+ import { TransactionPasswordNotSet } from '../TransactionPasswordNotSet.js';
33
33
  export function GCashWithdrawal() {
34
34
  const depositWithdrawalProps = useDepositWithdrawalPropsContext();
35
35
  const featureFlag = useFeatureFlag();
@@ -37,34 +37,33 @@ export function GCashWithdrawal() {
37
37
  depositWithdrawal: ctx.depositWithdrawal,
38
38
  hasPendingBonus: ctx.pendingBonus,
39
39
  })));
40
- const [status, setStatus] = useState("waiting");
40
+ const [status, setStatus] = useState('waiting');
41
41
  const localeInfo = useLocaleInfo();
42
42
  const mobileNumberParser = useMobileNumberParser();
43
- const createWithdrawalMutation = featureFlag.enabled
44
- ? useCreateGCashStandardCashInWithdrawalMutation({
45
- onMutate() {
46
- setStatus("processing");
47
- },
48
- onSuccess() {
49
- setStatus("success");
50
- form.reset();
51
- },
52
- onError() {
53
- setStatus("failed");
54
- },
55
- })
56
- : useCreateGCashWithdrawalMutation({
57
- onMutate() {
58
- setStatus("processing");
59
- },
60
- onSuccess() {
61
- setStatus("success");
62
- form.reset();
63
- },
64
- onError() {
65
- setStatus("failed");
66
- },
67
- });
43
+ const createWithdrawalMutationNext = useCreateGCashStandardCashInWithdrawalMutation({
44
+ onMutate() {
45
+ setStatus('processing');
46
+ },
47
+ onSuccess() {
48
+ setStatus('success');
49
+ form.reset();
50
+ },
51
+ onError() {
52
+ setStatus('failed');
53
+ },
54
+ });
55
+ const createWithdrawalMutation = useCreateGCashWithdrawalMutation({
56
+ onMutate() {
57
+ setStatus('processing');
58
+ },
59
+ onSuccess() {
60
+ setStatus('success');
61
+ form.reset();
62
+ },
63
+ onError() {
64
+ setStatus('failed');
65
+ },
66
+ });
68
67
  const paymentSettingsQuery = usePaymentSettingsQuery();
69
68
  const paymentSettings = paymentSettingsQuery.data;
70
69
  const gatewaySettings = paymentSettings?.gcashWithdrawalGatewaySettings;
@@ -75,7 +74,7 @@ export function GCashWithdrawal() {
75
74
  const n = parseDecimal(val, 0);
76
75
  if (n < minimumAmount) {
77
76
  ctx.addIssue({
78
- type: "number",
77
+ type: 'number',
79
78
  code: z.ZodIssueCode.too_small,
80
79
  inclusive: true,
81
80
  minimum: minimumAmount,
@@ -84,7 +83,7 @@ export function GCashWithdrawal() {
84
83
  }
85
84
  if (n > maximumAmount) {
86
85
  ctx.addIssue({
87
- type: "number",
86
+ type: 'number',
88
87
  code: z.ZodIssueCode.too_big,
89
88
  inclusive: true,
90
89
  maximum: maximumAmount,
@@ -94,27 +93,27 @@ export function GCashWithdrawal() {
94
93
  }),
95
94
  password: z
96
95
  .string()
97
- .min(8, "Password must be 8 or more characters")
98
- .max(64, "Password must be not be more than 64 characters"),
96
+ .min(8, 'Password must be 8 or more characters')
97
+ .max(64, 'Password must be not be more than 64 characters'),
99
98
  mobileNumber: z
100
99
  .string()
101
- .regex(localeInfo.mobileNumber.pattern, "Invalid mobile number"),
100
+ .regex(localeInfo.mobileNumber.pattern, 'Invalid mobile number'),
102
101
  });
103
102
  const form = useForm({
104
- mode: "all",
103
+ mode: 'all',
105
104
  resolver: zodResolver(definition),
106
105
  defaultValues: {
107
- amount: "0",
108
- password: "",
109
- mobileNumber: "",
106
+ amount: '0',
107
+ password: '',
108
+ mobileNumber: '',
110
109
  },
111
110
  });
112
111
  useEffect(() => {
113
112
  if (minimumAmount) {
114
113
  form.reset({
115
114
  amount: minimumAmount.toString(),
116
- password: "",
117
- mobileNumber: "",
115
+ password: '',
116
+ mobileNumber: '',
118
117
  });
119
118
  }
120
119
  }, [form, minimumAmount]);
@@ -123,31 +122,40 @@ export function GCashWithdrawal() {
123
122
  globalStore.hasPendingBonus.setOpen(true);
124
123
  return;
125
124
  }
126
- createWithdrawalMutation.mutate({
127
- amount: data.amount,
128
- recipientMobileNumber: mobileNumberParser.format(data.mobileNumber),
129
- transactionPassword: data.password,
130
- });
125
+ if (featureFlag.enabled) {
126
+ createWithdrawalMutationNext.mutate({
127
+ amount: data.amount,
128
+ recipientMobileNumber: mobileNumberParser.format(data.mobileNumber),
129
+ transactionPassword: data.password,
130
+ });
131
+ }
132
+ if (!featureFlag.enabled) {
133
+ createWithdrawalMutation.mutate({
134
+ amount: data.amount,
135
+ recipientMobileNumber: mobileNumberParser.format(data.mobileNumber),
136
+ transactionPassword: data.password,
137
+ });
138
+ }
131
139
  });
132
- return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.mobileNumber, children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsx(localeInfo.country.flag, { className: "-translate-y-1/2 pointer-events-none absolute top-1/2 left-3.5 size-5" }), _jsx(Field.Input, { className: "pl-10.5", ...form.register("mobileNumber") })] }), _jsx(Field.ErrorText, { children: form.formState.errors.mobileNumber?.message })] }), _jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
140
+ return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.mobileNumber, children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsx(localeInfo.country.flag, { className: "-translate-y-1/2 pointer-events-none absolute top-1/2 left-3.5 size-5" }), _jsx(Field.Input, { className: "pl-10.5", ...form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: form.formState.errors.mobileNumber?.message })] }), _jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
133
141
  o.field.onChange(details.value);
134
142
  }, formatOptions: {
135
143
  maximumFractionDigits: 2,
136
144
  minimumFractionDigits: 0,
137
- }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to withdraw" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch("amount"), 0), onChange: (value) => {
138
- form.setValue("amount", value.toString(), {
145
+ }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to withdraw" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
146
+ form.setValue('amount', value.toString(), {
139
147
  shouldTouch: true,
140
148
  shouldDirty: true,
141
149
  shouldValidate: true,
142
150
  });
143
- }, min: minimumAmount, max: maximumAmount, className: "mt-xl" }), _jsxs(Field.Root, { className: "mt-3xl", invalid: !!form.formState.errors.password, children: [_jsxs(PasswordInput.Root, { children: [_jsx(PasswordInput.Label, { children: "Transaction Password" }), _jsxs(PasswordInput.Control, { children: [_jsx(PasswordInput.Input, { placeholder: "Enter password", ...form.register("password") }), _jsx(PasswordInput.VisibilityTrigger, { children: _jsx(PasswordInput.Indicator, { fallback: _jsx(EyeOffIcon, {}), asChild: true, children: _jsx(EyeIcon, {}) }) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.password?.message })] }), _jsx(TransactionPasswordNotSet, {}), _jsx(Button, { type: "submit", className: "mt-6", disabled: createWithdrawalMutation.isPending, children: "Withdraw" }), _jsxs("p", { className: "mt-lg text-text-tertiary-600 text-xs", children: ["Upon withdrawing, you agree to our", " ", _jsx(Link, { href: depositWithdrawalProps.termsOfUseUrl ?? "/terms-of-use", onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Terms of Use" }), " ", "and", " ", _jsx(Link, { href: depositWithdrawalProps.privacyPolicyUrl ?? "/privacy-policy", onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Privacy Policy" }), "."] }), _jsx(AlertDialog.Root, { open: status !== "waiting", onOpenChange: (details) => {
151
+ }, min: minimumAmount, max: maximumAmount, className: "mt-xl" }), _jsxs(Field.Root, { className: "mt-3xl", invalid: !!form.formState.errors.password, children: [_jsxs(PasswordInput.Root, { children: [_jsx(PasswordInput.Label, { children: "Transaction Password" }), _jsxs(PasswordInput.Control, { children: [_jsx(PasswordInput.Input, { placeholder: "Enter password", ...form.register('password') }), _jsx(PasswordInput.VisibilityTrigger, { children: _jsx(PasswordInput.Indicator, { fallback: _jsx(EyeOffIcon, {}), asChild: true, children: _jsx(EyeIcon, {}) }) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.password?.message })] }), _jsx(TransactionPasswordNotSet, {}), _jsx(Button, { type: "submit", className: "mt-6", disabled: createWithdrawalMutation.isPending, children: "Withdraw" }), _jsxs("p", { className: "mt-lg text-text-tertiary-600 text-xs", children: ["Upon withdrawing, you agree to our", ' ', _jsx(Link, { href: depositWithdrawalProps.termsOfUseUrl ?? '/terms-of-use', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Terms of Use" }), ' ', "and", ' ', _jsx(Link, { href: depositWithdrawalProps.privacyPolicyUrl ?? '/privacy-policy', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Privacy Policy" }), "."] }), _jsx(AlertDialog.Root, { open: status !== 'waiting', onOpenChange: (details) => {
144
152
  if (!details.open) {
145
- setStatus("waiting");
153
+ setStatus('waiting');
146
154
  }
147
- }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(AlertDialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+2)]" }), _jsx(AlertDialog.Positioner, { className: "!z-[calc(var(--z-dialog)+3)]", children: _jsxs(AlertDialog.Content, { children: [_jsx(AlertDialog.CloseTrigger, { disabled: status === "processing", children: _jsx(XIcon, {}) }), _jsxs(AlertDialog.Header, { children: [status === "processing" && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === "success" && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-success-secondary text-text-featured-icon-light-success", children: _jsx(AlertCircleIcon, {}) })), status === "failed" && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-error-secondary text-text-featured-icon-light-error", children: _jsx(AlertCircleIcon, {}) }))] }), _jsxs(AlertDialog.Body, { children: [_jsxs(AlertDialog.Title, { children: [status === "processing" && "Processing Withdraw", status === "success" && "Withdrawal Submitted", status === "failed" && "Withdraw Failed"] }), _jsxs(AlertDialog.Description, { children: [status === "processing" &&
148
- "We're verifying your account and amount. Please hold a moment.", status === "success" &&
149
- "Your withdrawal request has been submitted successfully and is awaiting confirmation. You won’t have to wait long — once approved, the funds will be credited to your account.", status === "failed" &&
150
- explainError(createWithdrawalMutation.error?.name)] })] }), (status === "failed" || status === "success") && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
155
+ }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(AlertDialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+2)]" }), _jsx(AlertDialog.Positioner, { className: "!z-[calc(var(--z-dialog)+3)]", children: _jsxs(AlertDialog.Content, { children: [_jsx(AlertDialog.CloseTrigger, { disabled: status === 'processing', children: _jsx(XIcon, {}) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-success-secondary text-text-featured-icon-light-success", children: _jsx(AlertCircleIcon, {}) })), status === 'failed' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-error-secondary text-text-featured-icon-light-error", children: _jsx(AlertCircleIcon, {}) }))] }), _jsxs(AlertDialog.Body, { children: [_jsxs(AlertDialog.Title, { children: [status === 'processing' && 'Processing Withdraw', status === 'success' && 'Withdrawal Submitted', status === 'failed' && 'Withdraw Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
156
+ "We're verifying your account and amount. Please hold a moment.", status === 'success' &&
157
+ 'Your withdrawal request has been submitted successfully and is awaiting confirmation. You won’t have to wait long — once approved, the funds will be credited to your account.', status === 'failed' &&
158
+ explainError(createWithdrawalMutation.error?.name)] })] }), (status === 'failed' || status === 'success') && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
151
159
  api.setOpen(false);
152
- }, children: status === "failed" ? "Try Again" : "Ok" })) }) }))] }) })] }) })] }));
160
+ }, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
153
161
  }
@@ -0,0 +1 @@
1
+ export declare function Loading(): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,5 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ export function Loading() {
4
+ return (_jsx("div", { className: "flex h-[calc(100vh-400px)] w-full items-center justify-center px-4", children: _jsxs("div", { className: "flex flex-col items-center space-y-4", children: [_jsx("div", { className: "h-10 w-10 animate-spin rounded-full border-4 border-blue-500 border-t-transparent" }), _jsx("p", { className: "font-medium text-gray-700 text-lg", children: "Loading Sports Book\u2026" })] }) }));
5
+ }
@@ -0,0 +1,184 @@
1
+ @keyframes arrow-green-flash {
2
+ 0% {
3
+ color: #abefc6;
4
+ }
5
+ 100% {
6
+ color: #079455;
7
+ }
8
+ }
9
+
10
+ .animate-arrow-green-flash-1 {
11
+ animation: arrow-green-flash 0.4s infinite;
12
+ animation-delay: -0.2s;
13
+ }
14
+
15
+ .animate-arrow-green-flash-2 {
16
+ animation: arrow-green-flash 0.4s infinite;
17
+ animation-delay: -0.1s;
18
+ }
19
+
20
+ .animate-arrow-green-flash-3 {
21
+ animation: arrow-green-flash 0.4s infinite;
22
+ }
23
+
24
+ @keyframes arrow-red-flash {
25
+ 0%,
26
+ 100% {
27
+ color: #f97066;
28
+ }
29
+ 50% {
30
+ color: #fecdca;
31
+ }
32
+ }
33
+
34
+ .animate-arrow-red-flash-1 {
35
+ animation: arrow-red-flash 0.4s infinite;
36
+ }
37
+
38
+ .animate-arrow-red-flash-2 {
39
+ animation: arrow-red-flash 0.4s infinite;
40
+ animation-delay: -0.1s;
41
+ }
42
+
43
+ .animate-arrow-red-flash-3 {
44
+ animation: arrow-red-flash 0.4s infinite;
45
+ animation-delay: -0.2s;
46
+ }
47
+
48
+ /* Animated BG */
49
+ @keyframes rotate {
50
+ to {
51
+ transform: rotate(1turn);
52
+ }
53
+ }
54
+
55
+ .light-rays {
56
+ position: absolute;
57
+ top: 0;
58
+ left: 0;
59
+ right: 0;
60
+ bottom: 0;
61
+ overflow: hidden;
62
+
63
+ --first: var(--color-bg-tertiary);
64
+ --second: var(--color-bg-quaternary);
65
+ }
66
+
67
+ .light-rays::before,
68
+ .light-rays::after {
69
+ content: '';
70
+ position: absolute;
71
+ top: var(--light-rays-top, 150px);
72
+ left: calc(50% - 90px);
73
+ margin: -100vmax;
74
+ width: 200vmax;
75
+ height: 200vmax;
76
+ opacity: 0.6;
77
+ transform-origin: center;
78
+ }
79
+
80
+ .light-rays::before {
81
+ background: conic-gradient(
82
+ var(--first) 0deg 7.2deg,
83
+ var(--second) 7.2deg 14.4deg,
84
+ var(--first) 14.4deg 21.6deg,
85
+ var(--second) 21.6deg 28.8deg,
86
+ var(--first) 28.8deg 36deg,
87
+ var(--second) 36deg 43.2deg,
88
+ var(--first) 43.2deg 50.4deg,
89
+ var(--second) 50.4deg 57.6deg,
90
+ var(--first) 57.6deg 64.8deg,
91
+ var(--second) 64.8deg 72deg,
92
+ var(--first) 72deg 79.2deg,
93
+ var(--second) 79.2deg 86.4deg,
94
+ var(--first) 86.4deg 93.6deg,
95
+ var(--second) 93.6deg 100.8deg,
96
+ var(--first) 100.8deg 108deg,
97
+ var(--second) 108deg 115.2deg,
98
+ var(--first) 115.2deg 122.4deg,
99
+ var(--second) 122.4deg 129.6deg,
100
+ var(--first) 129.6deg 136.8deg,
101
+ var(--second) 136.8deg 144deg,
102
+ var(--first) 144deg 151.2deg,
103
+ var(--second) 151.2deg 158.4deg,
104
+ var(--first) 158.4deg 165.6deg,
105
+ var(--second) 165.6deg 172.8deg,
106
+ var(--first) 172.8deg 180deg,
107
+ var(--second) 180deg 187.2deg,
108
+ var(--first) 187.2deg 194.4deg,
109
+ var(--second) 194.4deg 201.6deg,
110
+ var(--first) 201.6deg 208.8deg,
111
+ var(--second) 208.8deg 216deg,
112
+ var(--first) 216deg 223.2deg,
113
+ var(--second) 223.2deg 230.4deg,
114
+ var(--first) 230.4deg 237.6deg,
115
+ var(--second) 237.6deg 244.8deg,
116
+ var(--first) 244.8deg 252deg,
117
+ var(--second) 252deg 259.2deg,
118
+ var(--first) 259.2deg 266.4deg,
119
+ var(--second) 266.4deg 273.6deg,
120
+ var(--first) 273.6deg 280.8deg,
121
+ var(--second) 280.8deg 288deg,
122
+ var(--first) 288deg 295.2deg,
123
+ var(--second) 295.2deg 302.4deg,
124
+ var(--first) 302.4deg 309.6deg,
125
+ var(--second) 309.6deg 316.8deg,
126
+ var(--first) 316.8deg 324deg,
127
+ var(--second) 324deg 331.2deg,
128
+ var(--first) 331.2deg 338.4deg,
129
+ var(--second) 338.4deg 345.6deg,
130
+ var(--first) 345.6deg 352.8deg,
131
+ var(--second) 352.8deg 360deg
132
+ );
133
+ animation: rotate 20s linear infinite;
134
+ }
135
+
136
+ @media (max-width: 1024px) {
137
+ .light-rays::before,
138
+ .light-rays::after {
139
+ left: auto;
140
+ right: 11%;
141
+ }
142
+ }
143
+
144
+ /* ScrollArea.module.css */
145
+ .scrollArea {
146
+ overflow-y: scroll;
147
+ padding-right: 4px;
148
+ }
149
+
150
+ /* WebKit-based browsers */
151
+ .scrollArea::-webkit-scrollbar {
152
+ width: 8px;
153
+ }
154
+
155
+ .scrollArea::-webkit-scrollbar-track {
156
+ background: var(--color-bg-primary-alt);
157
+ border-radius: 9999px;
158
+ }
159
+
160
+ .scrollArea::-webkit-scrollbar-thumb {
161
+ background-color: var(--color-bg-quaternary);
162
+ border-radius: 9999px;
163
+ }
164
+
165
+ @keyframes waveColor {
166
+ 0%,
167
+ 2.5% {
168
+ color: var(--wave-highlight-color);
169
+ }
170
+ 2.51%,
171
+ 100% {
172
+ color: var(--color-brand-300);
173
+ }
174
+ }
175
+
176
+ .animate-wave-color-success {
177
+ --wave-highlight-color: var(--color-success-800);
178
+ animation: waveColor 4s ease-in-out infinite;
179
+ }
180
+
181
+ .animate-wave-color-error {
182
+ --wave-highlight-color: var(--color-error-600);
183
+ animation: waveColor 4s ease-in-out infinite;
184
+ }