@opexa/portal-components 0.0.534 → 0.0.536

package/dist/components/AccountInfo/AccountInfo.d.ts

@@ -2,5 +2,6 @@ export interface AccountInfoProps {
     className?: string;
     googleSso?: boolean;
     facebookSso?: boolean;
+    shouldShowBranchCode?: boolean;
 }
 export declare function AccountInfo(props: AccountInfoProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/AccountInfo/AccountInfo.js

@@ -41,7 +41,7 @@ const accountSchema = z.object({
         .regex(/^[a-zA-Z0-9]+$/, 'Username can only contain letters and numbers'),
 });
 export function AccountInfo(props) {
-    return (_jsxs("div", { className: twMerge('space-y-3xl', props.className), children: [_jsx(ProfileInfo, {}), _jsx(ContactInfo, {}), _jsx(PersonalInfo, {}), _jsx(SSO, { google: props.googleSso, facebook: props.facebookSso })] }));
+    return (_jsxs("div", { className: twMerge('space-y-3xl', props.className), children: [_jsx(ProfileInfo, {}), _jsx(ContactInfo, {}), _jsx(PersonalInfo, { shouldShowBranchCode: props.shouldShowBranchCode }), _jsx(SSO, { google: props.googleSso, facebook: props.facebookSso })] }));
 }
 function ProfileInfo() {
     const [edit, setEdit] = useState(false);
@@ -84,7 +84,7 @@ function ProfileInfo() {
                                                     form.reset();
                                                 }, children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || isPending, children: "Save Changes" })] })] })) : (_jsxs("div", { className: "mt-2", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("h3", { className: "font-semibold text-lg text-text-secondary-700 leading-tight", children: account?.name }), _jsx("button", { type: "button", onClick: () => setEdit(true), children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", fill: "none", viewBox: "0 0 24 24", stroke: "#cecfd2", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M11 4H6.8c-1.68 0-2.52 0-3.162.327a3 3 0 0 0-1.311 1.311C2 6.28 2 7.12 2 8.8v8.4c0 1.68 0 2.52.327 3.162a3 3 0 0 0 1.311 1.311C4.28 22 5.12 22 6.8 22h8.4c1.68 0 2.52 0 3.162-.327a3 3 0 0 0 1.311-1.311C20 19.72 20 18.88 20 17.2V13M8 16h1.675c.489 0 .733 0 .963-.055.204-.05.4-.13.579-.24.201-.123.374-.296.72-.642L21.5 5.5a2.121 2.121 0 0 0-3-3l-9.563 9.563c-.346.346-.519.519-.642.72a2 2 0 0 0-.24.579c-.055.23-.055.474-.055.963z" }) }) })] }), _jsx("p", { className: "text-text-tertiary-600 leading-tight", children: account?.id })] }))] }) }) })] }));
 }
-function PersonalInfo() {
+function PersonalInfo({ shouldShowBranchCode, }) {
     const accountQuery = useAccountQuery();
     const account = accountQuery.data;
     const updateAccountMutation = useUpdateAccountMutation({
@@ -145,7 +145,7 @@ function PersonalInfo() {
                             ? data.birthDay
                             : undefined,
                     });
-                }), children: [_jsxs("div", { className: "px-4 py-5 lg:px-3xl lg:py-5", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.realName, readOnly: !!account?.realName, children: [_jsx(Field.Label, { children: "Full name" }), _jsx(Field.Input, { ...form.register('realName') }), _jsx(Field.ErrorText, { children: form.formState.errors.realName?.message })] }), _jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Date of birth" }), _jsx(Field.Input, { type: "date", ...form.register('birthDay') }), _jsx(Field.ErrorText, { children: form.formState.errors.birthDay?.message })] })] }), form.formState.isDirty && (_jsxs("div", { className: "flex justify-end gap-lg border-border-secondary border-t px-xl py-lg lg:px-3xl lg:py-xl", children: [_jsx(Button, { size: "sm", variant: "outline", fullWidth: false, disabled: updateAccountMutation.isPending, onClick: () => form.reset(), children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || updateAccountMutation.isPending, children: "Save Changes" })] }))] })] }));
+                }), children: [_jsxs("div", { className: "px-4 py-5 lg:px-3xl lg:py-5", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.realName, readOnly: !!account?.realName, children: [_jsx(Field.Label, { children: "Full name" }), _jsx(Field.Input, { ...form.register('realName') }), _jsx(Field.ErrorText, { children: form.formState.errors.realName?.message })] }), _jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Date of birth" }), _jsx(Field.Input, { type: "date", ...form.register('birthDay') }), _jsx(Field.ErrorText, { children: form.formState.errors.birthDay?.message })] }), shouldShowBranchCode && (_jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Branch Code" }), _jsx(Field.Input, { type: "text", disabled: true, value: account?.branchCode ?? '' })] }))] }), form.formState.isDirty && (_jsxs("div", { className: "flex justify-end gap-lg border-border-secondary border-t px-xl py-lg lg:px-3xl lg:py-xl", children: [_jsx(Button, { size: "sm", variant: "outline", fullWidth: false, disabled: updateAccountMutation.isPending, onClick: () => form.reset(), children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || updateAccountMutation.isPending, children: "Save Changes" })] }))] })] }));
 }
 function ContactInfo() {
     const localeInfo = useLocaleInfo();

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, {

package/dist/services/queries.d.ts

@@ -68,7 +68,7 @@ export declare const MEMBER = "\n  query Member {\n    member {\n      dateTimeL
 /**
  * _aka_ `Query.self`
  */
-export declare const MEMBER_ACCOUNT = "\n  query MemberAccount {\n    memberAccount: self {\n      ... on MemberAccount {\n        id\n        name\n        status\n        realName\n        emailAddress\n        mobileNumber\n        birthDay\n        verified\n        verificationStatus\n        nickName\n        validId\n        mobileNumberVerified\n        mobileNumberVerificationRequired\n        transactionPassword\n        secretAnswerSubmitted\n        dateTimeCreated\n        dateTimeLastUpdated\n        googleId\n        facebookId\n        cellxpertDetails {\n          cxd\n          dateTimeLastUpdated\n        }\n      }\n    }\n  }\n";
+export declare const MEMBER_ACCOUNT = "\n  query MemberAccount {\n    memberAccount: self {\n      ... on MemberAccount {\n        id\n        name\n        status\n        realName\n        emailAddress\n        mobileNumber\n        birthDay\n        verified\n        verificationStatus\n        nickName\n        validId\n        mobileNumberVerified\n        mobileNumberVerificationRequired\n        transactionPassword\n        secretAnswerSubmitted\n        dateTimeCreated\n        dateTimeLastUpdated\n        googleId\n        facebookId\n        branchCode\n        cellxpertDetails {\n          cxd\n          dateTimeLastUpdated\n        }\n      }\n    }\n  }\n";
 export declare const MEMBER_VERIFICATION = "\n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  query MemberVerification {\n    memberAccount: self {\n      ... on MemberAccount {\n        verification {\n          id\n          status\n          address\n          permanentAddress\n          sourceOfIncome\n          natureOfWork\n          nationality\n          placeOfBirth\n          idFrontImage {\n            ...FileFragment\n          }\n          selfieImage {\n            ...FileFragment\n          }\n          sumsubVerified\n        }\n      }\n    }\n  }\n";
 export declare const REGISTER_MEMBER_ACCOUNT = "\n  mutation RegisterMemberAccount(\n    $input: RegisterMemberAccountInput!\n    $referralCode: String\n    $verificationCode: String\n    $reCAPTCHAResponse: String\n  ) {\n    registerMemberAccount(\n      input: $input\n      referralCode: $referralCode\n      verificationCode: $verificationCode\n      reCAPTCHAResponse: $reCAPTCHAResponse\n    ) {\n      ... on AccountNameNotAvailableError {\n        name: __typename\n        message\n      }\n      ... on InvalidPlatformError {\n        name: __typename\n        message\n      }\n      ... on InvalidPlatformError {\n        name: __typename\n        message\n      }\n      ... on InvalidReCAPTCHAResponseError {\n        name: __typename\n        message\n      }\n      ... on InvalidSMSVerificationCodeError {\n        name: __typename\n        message\n      }\n      ... on MinimumAgeRequirementError {\n        name: __typename\n        message\n      }\n      ... on MobileNumberNotAvailableError {\n        name: __typename\n        message\n      }\n      ... on ReCAPTCHAVerificationFailedError {\n        name: __typename\n        message\n      }\n    }\n  }\n";
 export declare const REGISTER_MEMBER_ACCOUNT_BY_NAME = "\n  mutation RegisterMemberAccountByName(\n    $input: RegisterMemberAccountByNameInput!\n    $reCAPTCHAResponse: String!\n  ) {\n    registerMemberAccountByName(\n      input: $input\n      reCAPTCHAResponse: $reCAPTCHAResponse\n    ) {\n      ... on AccountNameNotAvailableError {\n        name: __typename\n        message\n      }\n      ... on InvalidPlatformError {\n        name: __typename\n        message\n      }\n      ... on InvalidReCAPTCHAResponseError {\n        name: __typename\n        message\n      }\n    }\n  }\n";

package/dist/services/queries.js

@@ -1613,6 +1613,7 @@ export const MEMBER_ACCOUNT = /* GraphQL */ `
         dateTimeLastUpdated
         googleId
         facebookId
+        branchCode
         cellxpertDetails {
           cxd
           dateTimeLastUpdated

package/dist/types/index.d.ts

@@ -457,6 +457,7 @@ export interface MemberAccount {
     secretAnswerSubmitted?: boolean | null;
     dateTimeCreated: string;
     dateTimeLastUpdated: string;
+    branchCode?: string | null;
     googleId?: string | null;
     facebookId?: string | null;
     cellxpertDetails?: {