@opexa/portal-components 0.0.745 → 0.0.746
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/components/DepositWithdrawal/AiOPaymentMethods.d.ts +11 -0
- package/dist/components/DepositWithdrawal/AiOPaymentMethods.js +55 -0
- package/dist/components/DepositWithdrawal/Deposit/AiOGCashDeposit/AiOGCashDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/AiOGrabPayDeposit/AiOGrabPayDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/AiOPayMayaDeposit/AiOPayMayaDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/GCashDeposit/GCashDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit/GCashWebpayDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/LibanganDeposit/LibanganDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/MayaAppDeposit/MayaAppDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/MayaDeposit/MayaDeposit.js +0 -3
- package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositForm.js +0 -3
- package/dist/components/DepositWithdrawal/Withdrawal/GCashStandardCashInWithdrawal/GCashStandardCashInWithdrawal.js +0 -3
- package/dist/components/DepositWithdrawal/Withdrawal/GCashWithdrawal/GCashWithdrawal.js +0 -3
- package/dist/components/DepositWithdrawal/Withdrawal/MayaAppWithdrawal/MayaAppWithdrawal.js +0 -3
- package/dist/components/DepositWithdrawal/Withdrawal/MayaWithdrawal/MayaWithdrawal.js +0 -3
- package/dist/components/DepositWithdrawal/Withdrawal/PisoPayWithdrawal/PisoPayWithdrawal.js +0 -3
- package/dist/components/DepositWithdrawal/Withdrawal/VentajaWithdrawal/VentajaWithdrawal.js +0 -3
- package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css +184 -0
- package/dist/components/Jackpots/JackpotsList/JackpotsListItem.module.css +184 -0
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.d.ts +1 -0
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.js +29 -0
- package/dist/components/SessionWatcher/SessionWatcher.d.ts +1 -0
- package/dist/components/SessionWatcher/SessionWatcher.js +20 -0
- package/dist/components/SessionWatcher/index.d.ts +1 -0
- package/dist/components/SessionWatcher/index.js +1 -0
- package/dist/constants/EnvVar.d.ts +1 -1
- package/dist/ui/AlertDialog/AlertDialog.d.ts +121 -121
- package/dist/ui/AlertDialog/alertDialog.recipe.d.ts +11 -11
- 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/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 +33 -33
- package/dist/ui/Dialog/dialog.recipe.d.ts +3 -3
- 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 +144 -144
- package/dist/ui/Menu/menu.recipe.d.ts +8 -8
- package/dist/ui/NumberInput/NumberInput.d.ts +24 -24
- package/dist/ui/NumberInput/numberInput.recipe.d.ts +3 -3
- package/dist/ui/PasswordInput/PasswordInput.d.ts +18 -18
- package/dist/ui/PasswordInput/passwordInput.recipe.d.ts +3 -3
- package/dist/ui/PinInput/PinInput.d.ts +12 -12
- package/dist/ui/PinInput/pinInput.recipe.d.ts +3 -3
- package/dist/ui/Progress/Progress.d.ts +27 -27
- package/dist/ui/Progress/progress.recipe.d.ts +3 -3
- package/dist/ui/QrCode/QrCode.d.ts +25 -25
- package/dist/ui/QrCode/qrCode.recipe.d.ts +5 -5
- 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/package.json +1 -1
- package/dist/components/PortalProvider/AndroidOnlyComponents.d.ts +0 -1
- package/dist/components/PortalProvider/AndroidOnlyComponents.js +0 -12
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { type AiOeWalletPaymentMethod } from './utils';
|
|
2
|
+
interface AiOPaymentMethodsProps {
|
|
3
|
+
value?: AiOeWalletPaymentMethod;
|
|
4
|
+
onChange?: (value: AiOeWalletPaymentMethod) => void;
|
|
5
|
+
defaultValue?: AiOeWalletPaymentMethod;
|
|
6
|
+
options?: AiOeWalletPaymentMethod[];
|
|
7
|
+
className?: string;
|
|
8
|
+
label?: string;
|
|
9
|
+
}
|
|
10
|
+
export declare function AiOPaymentMethods(props: AiOPaymentMethodsProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export {};
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import Image from 'next/image';
|
|
3
|
+
import { twMerge } from 'tailwind-merge';
|
|
4
|
+
import { useControllableState } from '../../client/hooks/useControllableState.js';
|
|
5
|
+
import { CheckIcon } from '../../icons/CheckIcon.js';
|
|
6
|
+
import gcash from '../../images/gcash.png';
|
|
7
|
+
import grabPay from '../../images/grabpay.png';
|
|
8
|
+
import maya from '../../images/maya.png';
|
|
9
|
+
import palawanPay from '../../images/palawanpay.png';
|
|
10
|
+
import { Checkbox } from '../../ui/Checkbox/index.js';
|
|
11
|
+
import { Field } from '../../ui/Field/index.js';
|
|
12
|
+
import { AiOeWalletPaymentMethodDefinition, } from './utils.js';
|
|
13
|
+
const AIO_EWALLET_OPTIONS = [
|
|
14
|
+
{
|
|
15
|
+
value: 'AIO_GCASH',
|
|
16
|
+
label: 'GCash',
|
|
17
|
+
image: gcash,
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
value: 'AIO_PAY_MAYA',
|
|
21
|
+
label: 'Maya',
|
|
22
|
+
image: maya,
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
value: 'AIO_GRAB_PAY',
|
|
26
|
+
label: 'GrabPay',
|
|
27
|
+
image: grabPay,
|
|
28
|
+
},
|
|
29
|
+
{
|
|
30
|
+
value: 'AIO_PALAWAN_PAY',
|
|
31
|
+
label: 'Palawan Pay',
|
|
32
|
+
image: palawanPay,
|
|
33
|
+
},
|
|
34
|
+
];
|
|
35
|
+
export function AiOPaymentMethods(props) {
|
|
36
|
+
const options = props.options && props.options.length > 0
|
|
37
|
+
? AIO_EWALLET_OPTIONS.filter((option) => props.options?.includes(option.value))
|
|
38
|
+
: AIO_EWALLET_OPTIONS;
|
|
39
|
+
const [value, setValue] = useControllableState({
|
|
40
|
+
value: props.value,
|
|
41
|
+
defaultValue: props.defaultValue ?? options[0]?.value,
|
|
42
|
+
onChange: props.onChange,
|
|
43
|
+
});
|
|
44
|
+
const parseValue = (val) => {
|
|
45
|
+
return AiOeWalletPaymentMethodDefinition.parse(val);
|
|
46
|
+
};
|
|
47
|
+
return (_jsxs("div", { className: props.className, children: [_jsx(Field.Label, { asChild: true, children: _jsx("div", { children: props.label || 'AIO eWallet payment methods' }) }), _jsx(Checkbox.Group, { value: [value], onValueChange: (newValue) => {
|
|
48
|
+
const lastValue = newValue.at(-1);
|
|
49
|
+
if (!lastValue)
|
|
50
|
+
return;
|
|
51
|
+
setValue(parseValue(lastValue));
|
|
52
|
+
}, className: "grid grid-cols-2 gap-x-4 gap-y-3", children: options.map((option) => (_jsxs(Checkbox.Root, { value: option.value, className: "flex cursor-pointer items-center justify-between rounded-xl border border-border-secondary ui-checked:border-border-brand-solid p-lg", children: [_jsx("div", { className: twMerge('rounded-xs', option.value === 'AIO_GRAB_PAY'
|
|
53
|
+
? 'bg-transparent px-0 py-0'
|
|
54
|
+
: 'bg-white px-sm py-[0.688rem]', option.value === 'AIO_GCASH' && 'bg-[#017EFF]', option.value === 'AIO_PALAWAN_PAY' && 'bg-[#026308]', option.value === 'AIO_PAY_MAYA' && 'bg-black'), children: _jsx(Image, { src: option.image, alt: "", width: 200, height: 40, className: twMerge('h-[1.063rem] w-auto', option.value === 'AIO_GRAB_PAY' && 'h-[3rem] rounded-[4px]', option.value === 'AIO_PALAWAN_PAY' && 'h-[2rem]'), draggable: false }) }), _jsx(Checkbox.Control, { className: "shrink-0", children: _jsx(Checkbox.Indicator, { asChild: true, children: _jsx(CheckIcon, {}) }) }), _jsx(Checkbox.HiddenInput, {})] }, option.value))) })] }));
|
|
55
|
+
}
|
|
@@ -143,9 +143,6 @@ export function AiOGCashDeposit() {
|
|
|
143
143
|
}
|
|
144
144
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
145
145
|
o.field.onChange(details.value);
|
|
146
|
-
}, formatOptions: {
|
|
147
|
-
maximumFractionDigits: 2,
|
|
148
|
-
minimumFractionDigits: 0,
|
|
149
146
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
150
147
|
form.setValue('amount', value.toString(), {
|
|
151
148
|
shouldTouch: true,
|
|
@@ -143,9 +143,6 @@ export function AiOGrabPayDeposit() {
|
|
|
143
143
|
}
|
|
144
144
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
145
145
|
o.field.onChange(details.value);
|
|
146
|
-
}, formatOptions: {
|
|
147
|
-
maximumFractionDigits: 2,
|
|
148
|
-
minimumFractionDigits: 0,
|
|
149
146
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
150
147
|
form.setValue('amount', value.toString(), {
|
|
151
148
|
shouldTouch: true,
|
package/dist/components/DepositWithdrawal/Deposit/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js
CHANGED
|
@@ -143,9 +143,6 @@ export function AiOPalawanPayDeposit() {
|
|
|
143
143
|
}
|
|
144
144
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
145
145
|
o.field.onChange(details.value);
|
|
146
|
-
}, formatOptions: {
|
|
147
|
-
maximumFractionDigits: 2,
|
|
148
|
-
minimumFractionDigits: 0,
|
|
149
146
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
150
147
|
form.setValue('amount', value.toString(), {
|
|
151
148
|
shouldTouch: true,
|
|
@@ -143,9 +143,6 @@ export function AiOPayMayaDeposit() {
|
|
|
143
143
|
}
|
|
144
144
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
145
145
|
o.field.onChange(details.value);
|
|
146
|
-
}, formatOptions: {
|
|
147
|
-
maximumFractionDigits: 2,
|
|
148
|
-
minimumFractionDigits: 0,
|
|
149
146
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
150
147
|
form.setValue('amount', value.toString(), {
|
|
151
148
|
shouldTouch: true,
|
|
@@ -166,9 +166,6 @@ export function GCashDeposit() {
|
|
|
166
166
|
}
|
|
167
167
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
168
168
|
o.field.onChange(details.value);
|
|
169
|
-
}, formatOptions: {
|
|
170
|
-
maximumFractionDigits: 2,
|
|
171
|
-
minimumFractionDigits: 0,
|
|
172
169
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
173
170
|
form.setValue('amount', value.toString(), {
|
|
174
171
|
shouldTouch: true,
|
|
@@ -168,9 +168,6 @@ export function GCashWebpayDeposit() {
|
|
|
168
168
|
}
|
|
169
169
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
170
170
|
o.field.onChange(details.value);
|
|
171
|
-
}, formatOptions: {
|
|
172
|
-
maximumFractionDigits: 2,
|
|
173
|
-
minimumFractionDigits: 0,
|
|
174
171
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
175
172
|
form.setValue('amount', value.toString(), {
|
|
176
173
|
shouldTouch: true,
|
|
@@ -167,9 +167,6 @@ export function LibanganDeposit() {
|
|
|
167
167
|
}
|
|
168
168
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
169
169
|
o.field.onChange(details.value);
|
|
170
|
-
}, formatOptions: {
|
|
171
|
-
maximumFractionDigits: 2,
|
|
172
|
-
minimumFractionDigits: 0,
|
|
173
170
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
174
171
|
form.setValue('amount', value.toString(), {
|
|
175
172
|
shouldTouch: true,
|
|
@@ -136,9 +136,6 @@ export function MayaAppDeposit() {
|
|
|
136
136
|
});
|
|
137
137
|
return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
138
138
|
o.field.onChange(details.value);
|
|
139
|
-
}, formatOptions: {
|
|
140
|
-
maximumFractionDigits: 2,
|
|
141
|
-
minimumFractionDigits: 0,
|
|
142
139
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
143
140
|
form.setValue('amount', value.toString(), {
|
|
144
141
|
shouldTouch: true,
|
|
@@ -166,9 +166,6 @@ export function MayaDeposit() {
|
|
|
166
166
|
}
|
|
167
167
|
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
168
168
|
o.field.onChange(details.value);
|
|
169
|
-
}, formatOptions: {
|
|
170
|
-
maximumFractionDigits: 2,
|
|
171
|
-
minimumFractionDigits: 0,
|
|
172
169
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
173
170
|
form.setValue('amount', value.toString(), {
|
|
174
171
|
shouldTouch: true,
|
package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositForm.js
CHANGED
|
@@ -102,9 +102,6 @@ export function OnlineBankDepositForm() {
|
|
|
102
102
|
return null;
|
|
103
103
|
return (_jsxs("form", { onSubmit: form.handleSubmit(context.generateVCA), noValidate: true, children: [_jsxs(Field.Root, { children: [_jsx(Field.Label, { children: "Bank" }), _jsx(Field.Input, { value: "BANKNET", onChange: noop, readOnly: true })] }), _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) => {
|
|
104
104
|
o.field.onChange(details.value);
|
|
105
|
-
}, formatOptions: {
|
|
106
|
-
maximumFractionDigits: 2,
|
|
107
|
-
minimumFractionDigits: 0,
|
|
108
105
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
109
106
|
form.setValue('amount', value.toString(), {
|
|
110
107
|
shouldTouch: true,
|
|
@@ -119,9 +119,6 @@ export function GCashStandardCashInWithdrawal() {
|
|
|
119
119
|
});
|
|
120
120
|
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) => {
|
|
121
121
|
o.field.onChange(details.value);
|
|
122
|
-
}, formatOptions: {
|
|
123
|
-
maximumFractionDigits: 2,
|
|
124
|
-
minimumFractionDigits: 0,
|
|
125
122
|
}, 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) => {
|
|
126
123
|
form.setValue('amount', value.toString(), {
|
|
127
124
|
shouldTouch: true,
|
|
@@ -119,9 +119,6 @@ export function GCashWithdrawal() {
|
|
|
119
119
|
});
|
|
120
120
|
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) => {
|
|
121
121
|
o.field.onChange(details.value);
|
|
122
|
-
}, formatOptions: {
|
|
123
|
-
maximumFractionDigits: 2,
|
|
124
|
-
minimumFractionDigits: 0,
|
|
125
122
|
}, 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) => {
|
|
126
123
|
form.setValue('amount', value.toString(), {
|
|
127
124
|
shouldTouch: true,
|
|
@@ -109,9 +109,6 @@ export function MayaAppWithdrawal() {
|
|
|
109
109
|
});
|
|
110
110
|
return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
111
111
|
o.field.onChange(details.value);
|
|
112
|
-
}, formatOptions: {
|
|
113
|
-
maximumFractionDigits: 2,
|
|
114
|
-
minimumFractionDigits: 0,
|
|
115
112
|
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _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) => {
|
|
116
113
|
form.setValue('amount', value.toString(), {
|
|
117
114
|
shouldTouch: true,
|
|
@@ -119,9 +119,6 @@ export function MayaWithdrawal() {
|
|
|
119
119
|
});
|
|
120
120
|
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) => {
|
|
121
121
|
o.field.onChange(details.value);
|
|
122
|
-
}, formatOptions: {
|
|
123
|
-
maximumFractionDigits: 2,
|
|
124
|
-
minimumFractionDigits: 0,
|
|
125
122
|
}, 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) => {
|
|
126
123
|
form.setValue('amount', value.toString(), {
|
|
127
124
|
shouldTouch: true,
|
|
@@ -143,9 +143,6 @@ export function PisoPayWithdrawal() {
|
|
|
143
143
|
o.field.onChange(details.value.at(0) ?? '');
|
|
144
144
|
}, children: [_jsx(Select.Label, { children: "Bank" }), _jsx(Select.Control, { children: _jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, {}), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }) }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: bankCollection.items.map((item, index) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: item.name }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, index))) }) }) })] }), _jsx(Field.ErrorText, { children: form.formState.errors.bankCode?.message })] })) }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountNumber, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Bank account number" }), _jsx(Field.Input, { ...form.register('accountNumber') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.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) => {
|
|
145
145
|
o.field.onChange(details.value);
|
|
146
|
-
}, formatOptions: {
|
|
147
|
-
maximumFractionDigits: 2,
|
|
148
|
-
minimumFractionDigits: 0,
|
|
149
146
|
}, 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) => {
|
|
150
147
|
form.setValue('amount', value.toString(), {
|
|
151
148
|
shouldTouch: true,
|
|
@@ -145,9 +145,6 @@ export function VentajaWithdrawal() {
|
|
|
145
145
|
o.field.onChange(details.value.at(0) ?? '');
|
|
146
146
|
}, children: [_jsx(Select.Label, { children: "Bank" }), _jsx(Select.Control, { children: _jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, {}), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }) }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: bankCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: item.name }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item.id))) }) }) })] }), _jsx(Field.ErrorText, { children: form.formState.errors.bankCode?.message })] })) }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountNumber, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Bank account number" }), _jsx(Field.Input, { ...form.register('accountNumber') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.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) => {
|
|
147
147
|
o.field.onChange(details.value);
|
|
148
|
-
}, formatOptions: {
|
|
149
|
-
maximumFractionDigits: 2,
|
|
150
|
-
minimumFractionDigits: 0,
|
|
151
148
|
}, 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) => {
|
|
152
149
|
form.setValue('amount', value.toString(), {
|
|
153
150
|
shouldTouch: true,
|
|
@@ -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
|
+
}
|
|
@@ -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
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function LinkGoogleAccountObserver(): null;
|