@opexa/portal-components 0.0.535 → 0.0.536

package/dist/components/SignIn/SignInMethod.d.ts

@@ -1 +1 @@
-export declare function SignInMethod(): import("react/jsx-runtime").JSX.Element;
+export declare function SignInMethod(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/SignIn/SignInMethod.js

@@ -12,6 +12,8 @@ const METHOD_LABEL_MAP = {
 };
 export function SignInMethod() {
     const context = useSignInContext();
+    if (context.types.length <= 1)
+        return null;
     return (_jsxs(SegmentGroup.Root, { value: context.type, onValueChange: (details) => {
             context.setStep(1);
             context.setType(z.enum(METHODS).parse(details.value));

package/dist/components/SignIn/useSignIn.d.ts

@@ -1,6 +1,7 @@
 export type SignInStep = 1 | 2 | (number & {});
 export type SignInType = 'NAME_AND_PASSWORD' | 'MOBILE_NUMBER';
 export interface UseSignInProps {
+    types?: SignInType[];
     defaultType?: SignInType;
 }
 export interface UseSignInReturn {
@@ -8,5 +9,6 @@ export interface UseSignInReturn {
     setStep: (step: SignInStep) => void;
     type: SignInType;
     setType: (type: SignInType) => void;
+    types: SignInType[];
 }
 export declare function useSignIn(props?: UseSignInProps): UseSignInReturn;

package/dist/components/SignIn/useSignIn.js

@@ -1,11 +1,15 @@
 import { useState } from 'react';
 export function useSignIn(props) {
+    const types = !props?.types?.length
+        ? ['MOBILE_NUMBER', 'NAME_AND_PASSWORD']
+        : props.types;
     const [step, setStep] = useState(1);
-    const [type, setType] = useState(props?.defaultType ?? 'MOBILE_NUMBER');
+    const [type, setType] = useState(props?.defaultType ?? types[0]);
     return {
         step,
         setStep,
         type,
         setType,
+        types,
     };
 }

package/dist/components/SignUp/SignUpNameAndPassword/SignUpNameAndPasswordForm.js

@@ -20,6 +20,8 @@ import { CheckIcon } from '../../../icons/CheckIcon.js';
 import { ChevronDownIcon } from '../../../icons/ChevronDownIcon.js';
 import { ChevronLeftIcon } from '../../../icons/ChevronLeftIcon.js';
 import { ChevronRightIcon } from '../../../icons/ChevronRightIcon.js';
+import { EyeIcon } from '../../../icons/EyeIcon.js';
+import { EyeOffIcon } from '../../../icons/EyeOffIcon.js';
 import { HelpCircleIcon } from '../../../icons/HelpCircleIcon.js';
 import pagcorLogo from '../../../images/pagcor-round-icon.png';
 import responsibleGamingLogo from '../../../images/responsible-gaming-gold.png';
@@ -28,6 +30,7 @@ import { Button } from '../../../ui/Button/index.js';
 import { Checkbox } from '../../../ui/Checkbox/index.js';
 import { DatePicker } from '../../../ui/DatePicker/index.js';
 import { Field } from '../../../ui/Field/index.js';
+import { PasswordInput } from '../../../ui/PasswordInput/index.js';
 import { Select } from '../../../ui/Select/index.js';
 import { Tooltip } from '../../../ui/Tooltip/index.js';
 import { createPoll } from '../../../utils/createPoll.js';
@@ -54,13 +57,14 @@ export function SignUpNameAndPasswordForm() {
         name: z
             .string()
             .trim()
-            .min(5, 'Name must be 5 or more characters')
-            .max(100, 'Name must not be more that 100 characters'),
+            .regex(/^[0-9a-z]*$/, 'Name must be alphanumeric')
+            .min(6, 'Name must be 6 or more characters')
+            .max(20, 'Name must not be more that 20 characters'),
         password: z
             .string()
             .trim()
             .min(8, 'Password must be 8 or more characters')
-            .max(100, 'Password must not be more that 100 characters'),
+            .max(32, 'Password must not be more that 32 characters'),
         termsAccepted: z.boolean().superRefine((v, ctx) => {
             if (!v) {
                 ctx.addIssue({
@@ -168,7 +172,7 @@ export function SignUpNameAndPasswordForm() {
                             description: error instanceof Error ? error.message : 'Something went wrong',
                         });
                     }
-                }), children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.name, className: "mt-xl", children: [_jsx(Field.Label, { children: "Name" }), _jsx(Field.Input, { placeholder: "Enter your name", ...form.register('name') }), _jsx(Field.ErrorText, { children: form.formState.errors.name?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.password, className: "mt-xl", children: [_jsx(Field.Label, { children: "Password" }), _jsx(Field.Input, { type: "password", placeholder: "Enter your password", ...form.register('password') }), _jsx(Field.ErrorText, { children: form.formState.errors.password?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.firstName, className: "mt-xl", children: [_jsx(Field.Label, { children: "First Name" }), _jsx(Field.Input, { placeholder: "Enter your first name", ...form.register('firstName') }), _jsx(Field.ErrorText, { children: form.formState.errors.firstName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.lastName, className: "mt-xl", children: [_jsx(Field.Label, { children: "Last Name" }), _jsx(Field.Input, { placeholder: "Enter your last name", ...form.register('lastName') }), _jsx(Field.ErrorText, { children: form.formState.errors.lastName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.birthDay, className: "mt-xl", children: [_jsx(DateOfBirthField, { value: form.watch('birthDay'), onChange: (value) => {
+                }), children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.name, className: "mt-xl", children: [_jsx(Field.Label, { children: "Name" }), _jsx(Field.Input, { placeholder: "Enter your name", ...form.register('name') }), _jsx(Field.ErrorText, { children: form.formState.errors.name?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.password, className: "mt-xl", children: [_jsxs(PasswordInput.Root, { children: [_jsx(PasswordInput.Label, { children: "Password" }), _jsxs(PasswordInput.Control, { children: [_jsx(PasswordInput.Input, { placeholder: "Enter your 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 })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.firstName, className: "mt-xl", children: [_jsx(Field.Label, { children: "First Name" }), _jsx(Field.Input, { placeholder: "Enter your first name", ...form.register('firstName') }), _jsx(Field.ErrorText, { children: form.formState.errors.firstName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.lastName, className: "mt-xl", children: [_jsx(Field.Label, { children: "Last Name" }), _jsx(Field.Input, { placeholder: "Enter your last name", ...form.register('lastName') }), _jsx(Field.ErrorText, { children: form.formState.errors.lastName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.birthDay, className: "mt-xl", children: [_jsx(DateOfBirthField, { value: form.watch('birthDay'), onChange: (value) => {
                                     if (!value)
                                         return;
                                     form.setValue('birthDay', value, {