@opexa/portal-components 0.0.400 → 0.0.401

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.
@@ -125,6 +125,10 @@ export function ForgotPasswordForm() {
125
125
  });
126
126
  }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", value: o.field.value, onValueChange: (details) => {
127
127
  o.field.onChange(details.value);
128
+ }, onKeyDown: (e) => {
129
+ if (e.key === 'Backspace') {
130
+ step2Form.reset();
131
+ }
128
132
  }, onValueComplete: () => {
129
133
  form2Ref.current?.requestSubmit();
130
134
  }, blurOnComplete: true, readOnly: step2Form.formState.isSubmitting, type: "numeric", children: [_jsxs(PinInput.Control, { className: "grid-cols-[1fr_1fr_1fr_auto_1fr_1fr_1fr] items-center gap-md", children: [_jsx(PinInput.Input, { index: 0 }), _jsx(PinInput.Input, { index: 1 }), _jsx(PinInput.Input, { index: 2 }), _jsx("span", { className: "font-medium text-2xl text-text-placeholder-subtle", children: "\u2013" }), _jsx(PinInput.Input, { index: 3 }), _jsx(PinInput.Input, { index: 4 }), _jsx(PinInput.Input, { index: 5 })] }), _jsx(PinInput.HiddenInput, {})] }), _jsx(Field.ErrorText, { children: o.formState.errors.verificationCode?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: resetPasswordMutation.isPending, children: "Verify" }), _jsxs("div", { className: "mt-3 flex w-full items-center justify-center gap-xs text-sm", children: [_jsx("span", { className: "text-text-secondary-700", children: "Didn't recieve the code?" }), _jsx("button", { type: "button", className: "font-semibold text-button-secondary-fg disabled:cursor-not-allowed disabled:opacity-75", disabled: cooldown.cooling, onClick: async () => {
@@ -2,8 +2,12 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { QueryClientProvider } from '@tanstack/react-query';
4
4
  import { ReCaptchaProvider } from 'next-recaptcha-v3';
5
+ import dynamic from 'next/dynamic';
5
6
  import { getQueryClient } from '../../utils/getQueryClient.js';
6
- import { CXDTokenObserver } from './CXDTokenObserver.js';
7
+ const CXDTokenObserver = dynamic(() => import('./CXDTokenObserver.js').then((m) => m.CXDTokenObserver), {
8
+ ssr: false,
9
+ loading: () => null,
10
+ });
7
11
  export function Providers({ recaptchaSiteKey, children, }) {
8
12
  const queryClient = getQueryClient();
9
13
  return (_jsxs(QueryClientProvider, { client: queryClient, children: [_jsx(CXDTokenObserver, {}), _jsx(ReCaptchaProvider, { reCaptchaKey: recaptchaSiteKey, children: children })] }));
@@ -165,7 +165,11 @@ export function MobileNumberSignIn() {
165
165
  mobileNumber: mobileNumberParser.format(mobileNumber),
166
166
  verificationCode: verificationCode.join(''),
167
167
  });
168
- }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", value: o.field.value, onValueChange: (details) => {
168
+ }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", onKeyDown: (e) => {
169
+ if (e.key === 'Backspace') {
170
+ step2Form.reset();
171
+ }
172
+ }, value: o.field.value, onValueChange: (details) => {
169
173
  o.field.onChange(details.value);
170
174
  o.field.onBlur();
171
175
  }, otp: true, onValueComplete: () => {
@@ -13,7 +13,15 @@ import { useSignIn } from './useSignIn.js';
13
13
  export function SignIn(props) {
14
14
  const signIn = useSignIn();
15
15
  const signInStore = useGlobalStore(useShallow((ctx) => ctx.signIn));
16
+ const globalStore = useGlobalStore(useShallow((ctx) => ({
17
+ termsAndConditions: ctx.termsAndConditions,
18
+ responsibleGaming: ctx.responsibleGaming,
19
+ })));
16
20
  return (_jsx(SignInPropsProvider, { value: props, children: _jsx(SignInProvider, { value: signIn, children: _jsx(Dialog.Root, { open: signInStore.open, onOpenChange: (details) => {
17
21
  signInStore.setOpen(details.open);
18
- }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('mx-auto h-full w-full items-start overflow-y-auto bg-bg-primary-alt p-3xl pb-4xl lg:h-auto lg:w-[400px] lg:rounded-xl', props.className?.root), children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-7.5 w-auto", draggable: false }), _jsx(SignInForm, {})] }) })] }) }) }) }));
22
+ }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
23
+ // Reset checkbox state when dialog closes
24
+ globalStore.termsAndConditions.setAccepted(false);
25
+ globalStore.responsibleGaming.setAccepted(false);
26
+ }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('mx-auto h-full w-full items-start overflow-y-auto bg-bg-primary-alt p-3xl pb-4xl lg:h-auto lg:w-[400px] lg:rounded-xl', props.className?.root), children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-7.5 w-auto", draggable: false }), _jsx(SignInForm, {})] }) })] }) }) }) }));
19
27
  }
@@ -12,7 +12,15 @@ import { SignUpDefaultPropsProvider } from './SignUpDefaultContext.js';
12
12
  import { SignUpDefaultForm } from './SignUpDefaultForm.js';
13
13
  export function SignUpDefault(props) {
14
14
  const signUpStore = useGlobalStore(useShallow((ctx) => ctx.signUp));
15
+ const globalStore = useGlobalStore(useShallow((ctx) => ({
16
+ termsAndConditions: ctx.termsAndConditions,
17
+ responsibleGaming: ctx.responsibleGaming,
18
+ })));
15
19
  return (_jsx(SignUpDefaultPropsProvider, { value: props, children: _jsx(Dialog.Root, { open: signUpStore.open, onOpenChange: (details) => {
16
20
  signUpStore.setOpen(details.open);
17
- }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('mx-auto h-full w-full items-start overflow-y-auto bg-bg-primary-alt p-3xl pb-4xl lg:h-fit lg:w-[400px] lg:rounded-xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent', props.className?.root), children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsx(Suspense, { children: _jsx(SignUpDefaultForm, {}) })] }) })] }) }) }));
21
+ }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
22
+ // Reset checkbox state when dialog closes
23
+ globalStore.termsAndConditions.setAccepted(false);
24
+ globalStore.responsibleGaming.setAccepted(false);
25
+ }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: twMerge('mx-auto h-full w-full items-start overflow-y-auto bg-bg-primary-alt p-3xl pb-4xl lg:h-fit lg:w-[400px] lg:rounded-xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent', props.className?.root), children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsx(Suspense, { children: _jsx(SignUpDefaultForm, {}) })] }) })] }) }) }));
18
26
  }
@@ -289,6 +289,10 @@ export function SignUpDefaultForm() {
289
289
  }
290
290
  }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", value: o.field.value, onValueChange: (details) => {
291
291
  o.field.onChange(details.value);
292
+ }, onKeyDown: (e) => {
293
+ if (e.key === 'Backspace') {
294
+ step2Form.reset();
295
+ }
292
296
  }, onValueComplete: () => {
293
297
  form2Ref.current?.requestSubmit();
294
298
  }, blurOnComplete: true, readOnly: step2Form.formState.isSubmitting, type: "numeric", children: [_jsxs(PinInput.Control, { className: "grid-cols-[1fr_1fr_1fr_auto_1fr_1fr_1fr] items-center gap-md", children: [_jsx(PinInput.Input, { index: 0 }), _jsx(PinInput.Input, { index: 1 }), _jsx(PinInput.Input, { index: 2 }), _jsx("span", { className: "font-medium text-2xl text-text-placeholder-subtle", children: "\u2013" }), _jsx(PinInput.Input, { index: 3 }), _jsx(PinInput.Input, { index: 4 }), _jsx(PinInput.Input, { index: 5 })] }), _jsx(PinInput.HiddenInput, {})] }), _jsx(Field.ErrorText, { children: o.formState.errors.verificationCode?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: step2Form.formState.isSubmitting, children: "Verify" }), _jsxs("div", { className: "mt-3 flex w-full items-center justify-center gap-xs text-sm", children: [_jsx("span", { className: "text-text-secondary-700", children: "Didn't recieve the code?" }), _jsx("button", { type: "button", className: "font-semibold text-button-secondary-fg disabled:cursor-not-allowed disabled:opacity-75", disabled: cooldown.cooling, onClick: async () => {
@@ -12,7 +12,15 @@ import { SignUpKYCPropsProvider } from './SignUpKYCContext.js';
12
12
  import { SignUpKYCForm } from './SignUpKYCForm.js';
13
13
  export function SignUpKYC(props) {
14
14
  const signUpStore = useGlobalStore(useShallow((ctx) => ctx.signUp));
15
+ const globalStore = useGlobalStore(useShallow((ctx) => ({
16
+ termsAndConditions: ctx.termsAndConditions,
17
+ responsibleGaming: ctx.responsibleGaming,
18
+ })));
15
19
  return (_jsx(SignUpKYCPropsProvider, { value: props, children: _jsx(Dialog.Root, { open: signUpStore.open, onOpenChange: (details) => {
16
20
  signUpStore.setOpen(details.open);
17
- }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('z-banner mx-auto flex size-full flex-col items-start overflow-y-auto bg-bg-primary-alt p-3xl pb-4xl lg:max-h-[80vh] lg:w-fit lg:rounded-xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent', props.className?.root), children: _jsxs("div", { className: "size-full lg:w-[400px]", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[7.5rem]", draggable: false }), _jsx(Suspense, { children: _jsx(SignUpKYCForm, {}) })] }) }) })] }) }) }));
21
+ }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
22
+ // Reset checkbox state when dialog closes
23
+ globalStore.termsAndConditions.setAccepted(false);
24
+ globalStore.responsibleGaming.setAccepted(false);
25
+ }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: twMerge('z-banner mx-auto flex size-full flex-col items-start overflow-y-auto bg-bg-primary-alt p-3xl pb-4xl lg:max-h-[80vh] lg:w-fit lg:rounded-xl', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent', props.className?.root), children: _jsxs("div", { className: "size-full lg:w-[400px]", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[7.5rem]", draggable: false }), _jsx(Suspense, { children: _jsx(SignUpKYCForm, {}) })] }) }) })] }) }) }));
18
26
  }
@@ -436,6 +436,10 @@ export function SignUpKYCForm() {
436
436
  }
437
437
  }), children: [_jsx(Controller, { name: "verificationCode", control: step2Form.control, render: (o) => (_jsxs(Field.Root, { invalid: o.fieldState.invalid, children: [_jsxs(PinInput.Root, { placeholder: "0", value: o.field.value, onValueChange: (details) => {
438
438
  o.field.onChange(details.value);
439
+ }, onKeyDown: (e) => {
440
+ if (e.key === 'Backspace') {
441
+ step2Form.reset();
442
+ }
439
443
  }, onValueComplete: () => {
440
444
  form2Ref.current?.requestSubmit();
441
445
  }, children: [_jsxs(PinInput.Control, { className: "grid-cols-[1fr_1fr_1fr_auto_1fr_1fr_1fr] items-center gap-md", children: [_jsx(PinInput.Input, { index: 0 }), _jsx(PinInput.Input, { index: 1 }), _jsx(PinInput.Input, { index: 2 }), _jsx("span", { className: "font-medium text-2xl text-text-placeholder-subtle", children: "\u2013" }), _jsx(PinInput.Input, { index: 3 }), _jsx(PinInput.Input, { index: 4 }), _jsx(PinInput.Input, { index: 5 })] }), _jsx(PinInput.HiddenInput, {})] }), _jsx(Field.ErrorText, { children: o.formState.errors.verificationCode?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: step2Form.formState.isSubmitting, children: "Verify" }), _jsxs("div", { className: "mt-3 flex w-full items-center justify-center gap-xs text-sm", children: [_jsx("span", { className: "text-text-secondary-700", children: "Didn't recieve the code?" }), _jsx("button", { type: "button", className: "font-semibold text-button-secondary-fg disabled:cursor-not-allowed disabled:opacity-75", disabled: cooldown.cooling, onClick: async () => {
@@ -90,7 +90,7 @@ const KnownErrorSchema = z
90
90
  function getErrorMessage(code) {
91
91
  switch (code) {
92
92
  case 'MEMBER_ACCOUNT_BLACKLISTED':
93
- return 'Your account has been blacklisted due to a serious violation of our policies. For more information or to appeal, please contac Chat Support team.';
93
+ return 'Your account has been blacklisted due to a serious violation of our policies. For more information or to appeal, please contact Chat Support team.';
94
94
  case 'MEMBER_ACCOUNT_SUSPENDED':
95
95
  return 'Your account has been temporarily suspended. Please reach out to the Chat Support team to learn more and get help with resolving the issue.';
96
96
  case 'INVALID_RECAPTCHA_RESPONSE':
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.400",
3
+ "version": "0.0.401",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",