ordering-ui-react-native 0.21.21-release → 0.21.22-release

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 (4) hide show
  1. package/package.json +1 -1
  2. package/themes/original/src/components/SignupForm/index.tsx +60 -58
  3. package/themes/original/src/components/UserFormDetails/index.tsx +71 -69
  4. package/themes/original/src/utils/index.tsx +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ordering-ui-react-native",
3
- "version": "0.21.21-release",
3
+ "version": "0.21.22-release",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
package/themes/original/src/components/SignupForm/index.tsx CHANGED
@@ -583,65 +583,67 @@ const SignupFormUI = (props: SignupParams) => {
583
583
  {sortInputFields({
584
584
  values: validationFields?.fields?.checkout,
585
585
  }).map(
586
- (field: any, i: number) =>
587
- !notValidationFields.includes(field.code) &&
588
- showField &&
589
- showField(field.code) &&
590
- (signUpTab === 'default' ||
591
- (signUpTab === 'otpEmail' && field.code === 'email')) && (
592
- <React.Fragment key={field.id}>
593
- {errors?.[`${field.code}`] && (
594
- <OText
595
- size={14}
596
- color={theme.colors.danger5}
597
- weight={'normal'}>
598
- {errors?.[`${field.code}`]?.message} {errors?.[`${field.code}`]?.type === 'required' && '*'}
599
- </OText>
600
- )}
601
- <Controller
602
- control={control}
603
- render={({ onChange, value }: any) => (
604
- <OInput
605
- placeholder={t(field.name?.replace(/\s/g, '_')?.toUpperCase(), field.name)}
606
- style={style.inputStyle}
607
- icon={
608
- field.code === 'email'
609
- ? theme.images.general.email
610
- : theme.images.general.user
611
- }
612
- value={value}
613
- onChange={(val: any) =>
614
- field.code !== 'email'
615
- ? (onChange(val))
616
- : handleChangeInputEmail(val, onChange)
617
- }
618
- autoCapitalize={
619
- field.code === 'email' ? 'none' : 'sentences'
620
- }
621
- autoCorrect={field.code === 'email' && false}
622
- type={
623
- field.code === 'email' ? 'email-address' : 'default'
624
- }
625
- autoCompleteType={
626
- field.code === 'email' ? 'email' : 'off'
627
- }
628
- returnKeyType="next"
629
- blurOnSubmit={false}
630
- forwardRef={(ref: any) => handleRefs(ref, field.code)}
631
- onSubmitEditing={() =>
632
- field.code === 'email'
633
- ? phoneRef?.current?.focus?.()
634
- : handleFocusRef(getNextFieldCode(i))
635
- }
636
- borderColor={errors?.[`${field.code}`] ? theme.colors.danger5 : theme.colors.border}
637
- />
586
+ (item: any, i: number) => {
587
+ const field = item?.validation_field || item
588
+ return (!notValidationFields.includes(field.code) &&
589
+ showField &&
590
+ showField(field.code) &&
591
+ (signUpTab === 'default' ||
592
+ (signUpTab === 'otpEmail' && field.code === 'email')) && (
593
+ <React.Fragment key={field.id}>
594
+ {errors?.[`${field.code}`] && (
595
+ <OText
596
+ size={14}
597
+ color={theme.colors.danger5}
598
+ weight={'normal'}>
599
+ {errors?.[`${field.code}`]?.message} {errors?.[`${field.code}`]?.type === 'required' && '*'}
600
+ </OText>
638
601
  )}
639
- name={field.code}
640
- rules={getInputRules(field)}
641
- defaultValue=""
642
- />
643
- </React.Fragment>
644
- ),
602
+ <Controller
603
+ control={control}
604
+ render={({ onChange, value }: any) => (
605
+ <OInput
606
+ placeholder={t(field.name?.replace(/\s/g, '_')?.toUpperCase(), field.name)}
607
+ style={style.inputStyle}
608
+ icon={
609
+ field.code === 'email'
610
+ ? theme.images.general.email
611
+ : theme.images.general.user
612
+ }
613
+ value={value}
614
+ onChange={(val: any) =>
615
+ field.code !== 'email'
616
+ ? (onChange(val))
617
+ : handleChangeInputEmail(val, onChange)
618
+ }
619
+ autoCapitalize={
620
+ field.code === 'email' ? 'none' : 'sentences'
621
+ }
622
+ autoCorrect={field.code === 'email' && false}
623
+ type={
624
+ field.code === 'email' ? 'email-address' : 'default'
625
+ }
626
+ autoCompleteType={
627
+ field.code === 'email' ? 'email' : 'off'
628
+ }
629
+ returnKeyType="next"
630
+ blurOnSubmit={false}
631
+ forwardRef={(ref: any) => handleRefs(ref, field.code)}
632
+ onSubmitEditing={() =>
633
+ field.code === 'email'
634
+ ? phoneRef?.current?.focus?.()
635
+ : handleFocusRef(getNextFieldCode(i))
636
+ }
637
+ borderColor={errors?.[`${field.code}`] ? theme.colors.danger5 : theme.colors.border}
638
+ />
639
+ )}
640
+ name={field.code}
641
+ rules={getInputRules(field)}
642
+ defaultValue=""
643
+ />
644
+ </React.Fragment>
645
+ ))
646
+ }
645
647
  )}
646
648
 
647
649
  {(!!showInputPhoneNumber && (signUpTab === 'default' || signUpTab === 'otpCellphone')) && (
package/themes/original/src/components/UserFormDetails/index.tsx CHANGED
@@ -304,80 +304,82 @@ export const UserFormDetailsUI = (props: any) => {
304
304
  {sortInputFields({
305
305
  values: validationFields.fields?.checkout,
306
306
  }).map(
307
- (field: any) =>
308
- showField &&
309
- showField(field.code) && ((requiredFields && requiredFields.includes(field.code)) || !requiredFields) && (
310
- <React.Fragment key={field.id}>
311
- <Controller
312
- key={field.id}
313
- control={control}
314
- render={() => (
315
- <>
316
- <OText size={14} lineHeight={21} color={theme.colors.textNormal} weight={'500'} style={{ textTransform: 'capitalize', alignSelf: 'flex-start' }}>
317
- {t(field?.code?.toUpperCase(), field?.name)}
318
- </OText>
319
- <OInput
320
- name={field.code}
321
- placeholder={t(
322
- field.code.toUpperCase(),
323
- field?.name,
324
- )}
325
- inputStyle={styles.inputStyle}
326
- style={{ paddingLeft: 0, paddingRight: 0, marginTop: 6, height: 44, minHeight: 44 }}
327
- autoCapitalize={
328
- field.code === 'email' ? 'none' : 'sentences'
329
- }
330
- isDisabled={false}
331
- value={
332
- formState?.changes[field.code] ??
333
- (user && user[field.code]) ??
334
- ''
335
- }
336
- onChange={(val: any) => {
337
- field.code !== 'email'
338
- ? setValue(field.code, val.target.value)
339
- : setValue(
340
- field.code,
341
- val.target.value
342
- .toLowerCase()
343
- .replace(
344
- /[&,()%";:ç?<>{}\\[\]\s]/g,
345
- '',
346
- ),
347
- );
348
- field.code !== 'email'
349
- ? handleChangeInput(val)
350
- : handleChangeInput({
351
- target: {
352
- name: 'email',
353
- value: val.target.value
307
+ (item: any) => {
308
+ const field = item?.validation_field || item
309
+ return (showField &&
310
+ showField(field.code) && ((requiredFields && requiredFields.includes(field.code)) || !requiredFields) && (
311
+ <React.Fragment key={field.id}>
312
+ <Controller
313
+ key={field.id}
314
+ control={control}
315
+ render={() => (
316
+ <>
317
+ <OText size={14} lineHeight={21} color={theme.colors.textNormal} weight={'500'} style={{ textTransform: 'capitalize', alignSelf: 'flex-start' }}>
318
+ {t(field?.code?.toUpperCase(), field?.name)}
319
+ </OText>
320
+ <OInput
321
+ name={field.code}
322
+ placeholder={t(
323
+ field.code.toUpperCase(),
324
+ field?.name,
325
+ )}
326
+ inputStyle={styles.inputStyle}
327
+ style={{ paddingLeft: 0, paddingRight: 0, marginTop: 6, height: 44, minHeight: 44 }}
328
+ autoCapitalize={
329
+ field.code === 'email' ? 'none' : 'sentences'
330
+ }
331
+ isDisabled={false}
332
+ value={
333
+ formState?.changes[field.code] ??
334
+ (user && user[field.code]) ??
335
+ ''
336
+ }
337
+ onChange={(val: any) => {
338
+ field.code !== 'email'
339
+ ? setValue(field.code, val.target.value)
340
+ : setValue(
341
+ field.code,
342
+ val.target.value
354
343
  .toLowerCase()
355
344
  .replace(
356
345
  /[&,()%";:ç?<>{}\\[\]\s]/g,
357
346
  '',
358
347
  ),
359
- },
360
- });
361
- }}
362
- autoCorrect={field.code === 'email' && false}
363
- type={
364
- field.code === 'email'
365
- ? 'email-address'
366
- : 'default'
367
- }
368
- returnKeyType="done"
369
- autoCompleteType={
370
- field.code === 'email' ? 'email' : 'off'
371
- }
372
- />
373
- </>
374
- )}
375
- name={field.code}
376
- rules={getInputRules(field)}
377
- defaultValue={user && user[field.code]}
378
- />
379
- </React.Fragment>
380
- ),
348
+ );
349
+ field.code !== 'email'
350
+ ? handleChangeInput(val)
351
+ : handleChangeInput({
352
+ target: {
353
+ name: 'email',
354
+ value: val.target.value
355
+ .toLowerCase()
356
+ .replace(
357
+ /[&,()%";:ç?<>{}\\[\]\s]/g,
358
+ '',
359
+ ),
360
+ },
361
+ });
362
+ }}
363
+ autoCorrect={field.code === 'email' && false}
364
+ type={
365
+ field.code === 'email'
366
+ ? 'email-address'
367
+ : 'default'
368
+ }
369
+ returnKeyType="done"
370
+ autoCompleteType={
371
+ field.code === 'email' ? 'email' : 'off'
372
+ }
373
+ />
374
+ </>
375
+ )}
376
+ name={field.code}
377
+ rules={getInputRules(field)}
378
+ defaultValue={user && user[field.code]}
379
+ />
380
+ </React.Fragment>
381
+ ))
382
+ },
381
383
  )}
382
384
  {showInputBirthday && (
383
385
  <>
package/themes/original/src/utils/index.tsx CHANGED
@@ -259,7 +259,7 @@ export const sortInputFields = ({ fields, values }: any) => {
259
259
 
260
260
  fieldsBase.forEach((f: any) => {
261
261
  fieldsArray && fieldsArray.forEach((field: any) => {
262
- if (f === field.code) {
262
+ if (f === (field.validation_field?.code || field?.code)) {
263
263
  fieldsSorted.push(field)
264
264
  }
265
265
  })