@terreno/ui 0.0.18 → 0.2.0

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 (95) hide show
  1. package/dist/Button.js +1 -1
  2. package/dist/Button.js.map +1 -1
  3. package/dist/Common.d.ts +45 -1
  4. package/dist/Hyperlink.js +2 -2
  5. package/dist/Hyperlink.js.map +1 -1
  6. package/dist/Page.js +2 -1
  7. package/dist/Page.js.map +1 -1
  8. package/dist/SocialLoginButton.d.ts +19 -0
  9. package/dist/SocialLoginButton.js +119 -0
  10. package/dist/SocialLoginButton.js.map +1 -0
  11. package/dist/Text.js +3 -0
  12. package/dist/Text.js.map +1 -1
  13. package/dist/Theme.js +27 -27
  14. package/dist/Theme.js.map +1 -1
  15. package/dist/Toast.js +5 -2
  16. package/dist/Toast.js.map +1 -1
  17. package/dist/index.d.ts +4 -0
  18. package/dist/index.js +3 -0
  19. package/dist/index.js.map +1 -1
  20. package/dist/login/LoginScreen.d.ts +25 -0
  21. package/dist/login/LoginScreen.js +55 -0
  22. package/dist/login/LoginScreen.js.map +1 -0
  23. package/dist/login/index.d.ts +2 -0
  24. package/dist/login/index.js +2 -0
  25. package/dist/login/index.js.map +1 -0
  26. package/dist/login/loginTypes.d.ts +48 -0
  27. package/dist/login/loginTypes.js +2 -0
  28. package/dist/login/loginTypes.js.map +1 -0
  29. package/dist/signUp/OAuthButtons.d.ts +18 -0
  30. package/dist/signUp/OAuthButtons.js +15 -0
  31. package/dist/signUp/OAuthButtons.js.map +1 -0
  32. package/dist/signUp/PasswordRequirements.d.ts +15 -0
  33. package/dist/signUp/PasswordRequirements.js +14 -0
  34. package/dist/signUp/PasswordRequirements.js.map +1 -0
  35. package/dist/signUp/SignUpScreen.d.ts +26 -0
  36. package/dist/signUp/SignUpScreen.js +64 -0
  37. package/dist/signUp/SignUpScreen.js.map +1 -0
  38. package/dist/signUp/Swiper.d.ts +13 -0
  39. package/dist/signUp/Swiper.js +16 -0
  40. package/dist/signUp/Swiper.js.map +1 -0
  41. package/dist/signUp/index.d.ts +6 -0
  42. package/dist/signUp/index.js +6 -0
  43. package/dist/signUp/index.js.map +1 -0
  44. package/dist/signUp/passwordPresets.d.ts +9 -0
  45. package/dist/signUp/passwordPresets.js +41 -0
  46. package/dist/signUp/passwordPresets.js.map +1 -0
  47. package/dist/signUp/signUpTypes.d.ts +90 -0
  48. package/dist/signUp/signUpTypes.js +2 -0
  49. package/dist/signUp/signUpTypes.js.map +1 -0
  50. package/package.json +10 -7
  51. package/src/Button.tsx +1 -1
  52. package/src/Common.ts +53 -2
  53. package/src/Hyperlink.tsx +2 -10
  54. package/src/Page.tsx +3 -2
  55. package/src/SocialLoginButton.test.tsx +158 -0
  56. package/src/SocialLoginButton.tsx +182 -0
  57. package/src/Text.tsx +3 -0
  58. package/src/Theme.tsx +33 -27
  59. package/src/Toast.tsx +5 -2
  60. package/src/__snapshots__/Button.test.tsx.snap +12 -12
  61. package/src/__snapshots__/DecimalRangeActionSheet.test.tsx.snap +2 -2
  62. package/src/__snapshots__/ErrorPage.test.tsx.snap +1 -1
  63. package/src/__snapshots__/Field.test.tsx.snap +138 -138
  64. package/src/__snapshots__/HeightActionSheet.test.tsx.snap +2 -2
  65. package/src/__snapshots__/InfoModalIcon.test.tsx.snap +4 -4
  66. package/src/__snapshots__/Modal.test.tsx.snap +3 -3
  67. package/src/__snapshots__/NumberPickerActionSheet.test.tsx.snap +2 -2
  68. package/src/__snapshots__/Page.test.tsx.snap +1 -1
  69. package/src/__snapshots__/PhoneNumberField.test.tsx.snap +17 -17
  70. package/src/__snapshots__/SocialLoginButton.test.tsx.snap +277 -0
  71. package/src/bunSetup.ts +23 -0
  72. package/src/index.tsx +6 -0
  73. package/src/login/LoginScreen.test.tsx +148 -0
  74. package/src/login/LoginScreen.tsx +159 -0
  75. package/src/login/__snapshots__/LoginScreen.test.tsx.snap +630 -0
  76. package/src/login/index.ts +2 -0
  77. package/src/login/loginTypes.ts +51 -0
  78. package/src/signUp/OAuthButtons.test.tsx +45 -0
  79. package/src/signUp/OAuthButtons.tsx +52 -0
  80. package/src/signUp/PasswordRequirements.test.tsx +41 -0
  81. package/src/signUp/PasswordRequirements.tsx +49 -0
  82. package/src/signUp/SignUpScreen.test.tsx +134 -0
  83. package/src/signUp/SignUpScreen.tsx +172 -0
  84. package/src/signUp/Swiper.test.tsx +46 -0
  85. package/src/signUp/Swiper.tsx +59 -0
  86. package/src/signUp/__snapshots__/OAuthButtons.test.tsx.snap +272 -0
  87. package/src/signUp/__snapshots__/PasswordRequirements.test.tsx.snap +427 -0
  88. package/src/signUp/__snapshots__/SignUpScreen.test.tsx.snap +851 -0
  89. package/src/signUp/__snapshots__/Swiper.test.tsx.snap +249 -0
  90. package/src/signUp/index.ts +13 -0
  91. package/src/signUp/passwordPresets.test.ts +57 -0
  92. package/src/signUp/passwordPresets.ts +43 -0
  93. package/src/signUp/signUpTypes.ts +94 -0
  94. package/src/table/__snapshots__/TableDate.test.tsx.snap +4 -4
  95. package/src/table/__snapshots__/TableRow.test.tsx.snap +64 -64
@@ -174,7 +174,7 @@ exports[`DecimalRangeActionSheet renders correctly 1`] = `
174
174
  "onPress": [Function: debounced],
175
175
  "style": {
176
176
  "alignItems": "center",
177
- "alignSelf": undefined,
177
+ "alignSelf": "flex-start",
178
178
  "backgroundColor": "#0E9DCD",
179
179
  "borderColor": undefined,
180
180
  "borderRadius": 360,
@@ -853,7 +853,7 @@ exports[`DecimalRangeActionSheet renders with different min/max range 1`] = `
853
853
  "onPress": [Function: debounced],
854
854
  "style": {
855
855
  "alignItems": "center",
856
- "alignSelf": undefined,
856
+ "alignSelf": "flex-start",
857
857
  "backgroundColor": "#0E9DCD",
858
858
  "borderColor": undefined,
859
859
  "borderRadius": 360,
@@ -159,7 +159,7 @@ exports[`ErrorPage renders correctly 1`] = `
159
159
  "onPress": [Function: debounced],
160
160
  "style": {
161
161
  "alignItems": "center",
162
- "alignSelf": undefined,
162
+ "alignSelf": "flex-start",
163
163
  "backgroundColor": "#0E9DCD",
164
164
  "borderColor": undefined,
165
165
  "borderRadius": 360,
@@ -553,6 +553,144 @@ exports[`Field renders textarea field 1`] = `
553
553
  }
554
554
  `;
555
555
 
556
+ exports[`Field renders boolean field 1`] = `
557
+ {
558
+ "$$typeof": Symbol(react.test.json),
559
+ "children": [
560
+ {
561
+ "$$typeof": Symbol(react.test.json),
562
+ "children": [
563
+ {
564
+ "$$typeof": Symbol(react.test.json),
565
+ "children": [
566
+ {
567
+ "$$typeof": Symbol(react.test.json),
568
+ "children": [
569
+ {
570
+ "$$typeof": Symbol(react.test.json),
571
+ "children": [
572
+ {
573
+ "$$typeof": Symbol(react.test.json),
574
+ "children": [
575
+ {
576
+ "$$typeof": Symbol(react.test.json),
577
+ "children": null,
578
+ "props": {
579
+ "style": {
580
+ "alignItems": "center",
581
+ "backgroundColor": "#FFFFFF",
582
+ "borderColor": "#2B6072",
583
+ "borderRadius": 10,
584
+ "borderWidth": 1,
585
+ "height": 20,
586
+ "justifyContent": "center",
587
+ "width": 20,
588
+ },
589
+ "testID": undefined,
590
+ },
591
+ "type": "View",
592
+ },
593
+ ],
594
+ "props": {
595
+ "style": {
596
+ "alignItems": "center",
597
+ "flex": 1,
598
+ "flexDirection": "row",
599
+ "justifyContent": "center",
600
+ "left": Value {
601
+ "_value": -10,
602
+ "addListener": [class Function],
603
+ "animate": [class Function],
604
+ "extractOffset": [class Function],
605
+ "flattenOffset": [class Function],
606
+ "interpolate": [class Function],
607
+ "removeAllListeners": [class Function],
608
+ "removeListener": [class Function],
609
+ "resetAnimation": [class Function],
610
+ "setOffset": [class Function],
611
+ "setValue": [class Function],
612
+ "stopAnimation": [class Function],
613
+ "stopTracking": [class Function],
614
+ "track": [class Function],
615
+ },
616
+ "width": 36,
617
+ },
618
+ "testID": undefined,
619
+ },
620
+ "type": "View",
621
+ },
622
+ ],
623
+ "props": {
624
+ "style": {
625
+ "backgroundColor": Value {
626
+ "_value": 0,
627
+ "addListener": [class Function],
628
+ "animate": [class Function],
629
+ "extractOffset": [class Function],
630
+ "flattenOffset": [class Function],
631
+ "interpolate": [class Function],
632
+ "removeAllListeners": [class Function],
633
+ "removeListener": [class Function],
634
+ "resetAnimation": [class Function],
635
+ "setOffset": [class Function],
636
+ "setValue": [class Function],
637
+ "stopAnimation": [class Function],
638
+ "stopTracking": [class Function],
639
+ "track": [class Function],
640
+ },
641
+ "borderColor": "#2B6072",
642
+ "borderRadius": 20,
643
+ "borderWidth": 1,
644
+ "height": 20,
645
+ "marginHorizontal": 10,
646
+ "marginRight": undefined,
647
+ "width": 36,
648
+ },
649
+ "testID": undefined,
650
+ },
651
+ "type": "View",
652
+ },
653
+ ],
654
+ "props": {
655
+ "style": {
656
+ "alignItems": "center",
657
+ "flexDirection": "row",
658
+ "justifyContent": "center",
659
+ },
660
+ "testID": undefined,
661
+ },
662
+ "type": "View",
663
+ },
664
+ ],
665
+ "props": {
666
+ "aria-role": "button",
667
+ "onPress": [Function],
668
+ },
669
+ "type": "TouchableWithoutFeedback",
670
+ },
671
+ ],
672
+ "props": {
673
+ "style": {
674
+ "alignItems": "center",
675
+ "flexDirection": "row",
676
+ "justifyContent": "center",
677
+ },
678
+ "testID": undefined,
679
+ },
680
+ "type": "View",
681
+ },
682
+ ],
683
+ "props": {
684
+ "style": {
685
+ "alignItems": "flex-start",
686
+ "flexDirection": "column",
687
+ },
688
+ "testID": undefined,
689
+ },
690
+ "type": "View",
691
+ }
692
+ `;
693
+
556
694
  exports[`Field renders date field 1`] = `
557
695
  {
558
696
  "$$typeof": Symbol(react.test.json),
@@ -4370,141 +4508,3 @@ exports[`Field renders phoneNumber field 1`] = `
4370
4508
  "type": "View",
4371
4509
  }
4372
4510
  `;
4373
-
4374
- exports[`Field renders boolean field 1`] = `
4375
- {
4376
- "$$typeof": Symbol(react.test.json),
4377
- "children": [
4378
- {
4379
- "$$typeof": Symbol(react.test.json),
4380
- "children": [
4381
- {
4382
- "$$typeof": Symbol(react.test.json),
4383
- "children": [
4384
- {
4385
- "$$typeof": Symbol(react.test.json),
4386
- "children": [
4387
- {
4388
- "$$typeof": Symbol(react.test.json),
4389
- "children": [
4390
- {
4391
- "$$typeof": Symbol(react.test.json),
4392
- "children": [
4393
- {
4394
- "$$typeof": Symbol(react.test.json),
4395
- "children": null,
4396
- "props": {
4397
- "style": {
4398
- "alignItems": "center",
4399
- "backgroundColor": "#FFFFFF",
4400
- "borderColor": "#2B6072",
4401
- "borderRadius": 10,
4402
- "borderWidth": 1,
4403
- "height": 20,
4404
- "justifyContent": "center",
4405
- "width": 20,
4406
- },
4407
- "testID": undefined,
4408
- },
4409
- "type": "View",
4410
- },
4411
- ],
4412
- "props": {
4413
- "style": {
4414
- "alignItems": "center",
4415
- "flex": 1,
4416
- "flexDirection": "row",
4417
- "justifyContent": "center",
4418
- "left": Value {
4419
- "_value": -10,
4420
- "addListener": [class Function],
4421
- "animate": [class Function],
4422
- "extractOffset": [class Function],
4423
- "flattenOffset": [class Function],
4424
- "interpolate": [class Function],
4425
- "removeAllListeners": [class Function],
4426
- "removeListener": [class Function],
4427
- "resetAnimation": [class Function],
4428
- "setOffset": [class Function],
4429
- "setValue": [class Function],
4430
- "stopAnimation": [class Function],
4431
- "stopTracking": [class Function],
4432
- "track": [class Function],
4433
- },
4434
- "width": 36,
4435
- },
4436
- "testID": undefined,
4437
- },
4438
- "type": "View",
4439
- },
4440
- ],
4441
- "props": {
4442
- "style": {
4443
- "backgroundColor": Value {
4444
- "_value": 0,
4445
- "addListener": [class Function],
4446
- "animate": [class Function],
4447
- "extractOffset": [class Function],
4448
- "flattenOffset": [class Function],
4449
- "interpolate": [class Function],
4450
- "removeAllListeners": [class Function],
4451
- "removeListener": [class Function],
4452
- "resetAnimation": [class Function],
4453
- "setOffset": [class Function],
4454
- "setValue": [class Function],
4455
- "stopAnimation": [class Function],
4456
- "stopTracking": [class Function],
4457
- "track": [class Function],
4458
- },
4459
- "borderColor": "#2B6072",
4460
- "borderRadius": 20,
4461
- "borderWidth": 1,
4462
- "height": 20,
4463
- "marginHorizontal": 10,
4464
- "marginRight": undefined,
4465
- "width": 36,
4466
- },
4467
- "testID": undefined,
4468
- },
4469
- "type": "View",
4470
- },
4471
- ],
4472
- "props": {
4473
- "style": {
4474
- "alignItems": "center",
4475
- "flexDirection": "row",
4476
- "justifyContent": "center",
4477
- },
4478
- "testID": undefined,
4479
- },
4480
- "type": "View",
4481
- },
4482
- ],
4483
- "props": {
4484
- "aria-role": "button",
4485
- "onPress": [Function],
4486
- },
4487
- "type": "TouchableWithoutFeedback",
4488
- },
4489
- ],
4490
- "props": {
4491
- "style": {
4492
- "alignItems": "center",
4493
- "flexDirection": "row",
4494
- "justifyContent": "center",
4495
- },
4496
- "testID": undefined,
4497
- },
4498
- "type": "View",
4499
- },
4500
- ],
4501
- "props": {
4502
- "style": {
4503
- "alignItems": "flex-start",
4504
- "flexDirection": "column",
4505
- },
4506
- "testID": undefined,
4507
- },
4508
- "type": "View",
4509
- }
4510
- `;
@@ -174,7 +174,7 @@ exports[`HeightActionSheet renders correctly 1`] = `
174
174
  "onPress": [Function: debounced],
175
175
  "style": {
176
176
  "alignItems": "center",
177
- "alignSelf": undefined,
177
+ "alignSelf": "flex-start",
178
178
  "backgroundColor": "#0E9DCD",
179
179
  "borderColor": undefined,
180
180
  "borderRadius": 360,
@@ -808,7 +808,7 @@ exports[`HeightActionSheet renders with different height value 1`] = `
808
808
  "onPress": [Function: debounced],
809
809
  "style": {
810
810
  "alignItems": "center",
811
- "alignSelf": undefined,
811
+ "alignSelf": "flex-start",
812
812
  "backgroundColor": "#0E9DCD",
813
813
  "borderColor": undefined,
814
814
  "borderRadius": 360,
@@ -173,7 +173,7 @@ exports[`InfoModalIcon renders correctly with required props 1`] = `
173
173
  "onPress": [Function: debounced],
174
174
  "style": {
175
175
  "alignItems": "center",
176
- "alignSelf": undefined,
176
+ "alignSelf": "flex-start",
177
177
  "backgroundColor": "#0E9DCD",
178
178
  "borderColor": undefined,
179
179
  "borderRadius": 360,
@@ -501,7 +501,7 @@ exports[`InfoModalIcon renders with subtitle 1`] = `
501
501
  "onPress": [Function: debounced],
502
502
  "style": {
503
503
  "alignItems": "center",
504
- "alignSelf": undefined,
504
+ "alignSelf": "flex-start",
505
505
  "backgroundColor": "#0E9DCD",
506
506
  "borderColor": undefined,
507
507
  "borderRadius": 360,
@@ -827,7 +827,7 @@ exports[`InfoModalIcon renders with children content 1`] = `
827
827
  "onPress": [Function: debounced],
828
828
  "style": {
829
829
  "alignItems": "center",
830
- "alignSelf": undefined,
830
+ "alignSelf": "flex-start",
831
831
  "backgroundColor": "#0E9DCD",
832
832
  "borderColor": undefined,
833
833
  "borderRadius": 360,
@@ -1114,7 +1114,7 @@ exports[`InfoModalIcon opens modal when pressed 1`] = `
1114
1114
  "onPress": [Function: debounced],
1115
1115
  "style": {
1116
1116
  "alignItems": "center",
1117
- "alignSelf": undefined,
1117
+ "alignSelf": "flex-start",
1118
1118
  "backgroundColor": "#0E9DCD",
1119
1119
  "borderColor": undefined,
1120
1120
  "borderRadius": 360,
@@ -535,7 +535,7 @@ exports[`Modal renders with both buttons 1`] = `
535
535
  "onPress": [Function: debounced],
536
536
  "style": {
537
537
  "alignItems": "center",
538
- "alignSelf": undefined,
538
+ "alignSelf": "flex-start",
539
539
  "backgroundColor": "#B6CDD5",
540
540
  "borderColor": undefined,
541
541
  "borderRadius": 360,
@@ -609,7 +609,7 @@ exports[`Modal renders with both buttons 1`] = `
609
609
  "onPress": [Function: debounced],
610
610
  "style": {
611
611
  "alignItems": "center",
612
- "alignSelf": undefined,
612
+ "alignSelf": "flex-start",
613
613
  "backgroundColor": "#0E9DCD",
614
614
  "borderColor": undefined,
615
615
  "borderRadius": 360,
@@ -856,7 +856,7 @@ exports[`Modal renders with disabled primary button 1`] = `
856
856
  "onPress": [Function: debounced],
857
857
  "style": {
858
858
  "alignItems": "center",
859
- "alignSelf": undefined,
859
+ "alignSelf": "flex-start",
860
860
  "backgroundColor": "#9A9A9A",
861
861
  "borderColor": undefined,
862
862
  "borderRadius": 360,
@@ -174,7 +174,7 @@ exports[`NumberPickerActionSheet renders correctly 1`] = `
174
174
  "onPress": [Function: debounced],
175
175
  "style": {
176
176
  "alignItems": "center",
177
- "alignSelf": undefined,
177
+ "alignSelf": "flex-start",
178
178
  "backgroundColor": "#0E9DCD",
179
179
  "borderColor": undefined,
180
180
  "borderRadius": 360,
@@ -1503,7 +1503,7 @@ exports[`NumberPickerActionSheet renders with different range 1`] = `
1503
1503
  "onPress": [Function: debounced],
1504
1504
  "style": {
1505
1505
  "alignItems": "center",
1506
- "alignSelf": undefined,
1506
+ "alignSelf": "flex-start",
1507
1507
  "backgroundColor": "#0E9DCD",
1508
1508
  "borderColor": undefined,
1509
1509
  "borderRadius": 360,
@@ -772,7 +772,7 @@ exports[`Page renders with right button 1`] = `
772
772
  "onPress": [Function: debounced],
773
773
  "style": {
774
774
  "alignItems": "center",
775
- "alignSelf": undefined,
775
+ "alignSelf": "flex-start",
776
776
  "backgroundColor": "#B6CDD5",
777
777
  "borderColor": undefined,
778
778
  "borderRadius": 360,
@@ -79,7 +79,7 @@ exports[`PhoneNumberField renders correctly with default props 1`] = `
79
79
  }
80
80
  `;
81
81
 
82
- exports[`PhoneNumberField renders with icon 1`] = `
82
+ exports[`PhoneNumberField formats phone number as user types 1`] = `
83
83
  {
84
84
  "$$typeof": Symbol(react.test.json),
85
85
  "children": [
@@ -125,19 +125,10 @@ exports[`PhoneNumberField renders with icon 1`] = `
125
125
  "testID": undefined,
126
126
  "textContentType": undefined,
127
127
  "underlineColorAndroid": "transparent",
128
- "value": "",
128
+ "value": "5551234567",
129
129
  },
130
130
  "type": "TextInput",
131
131
  },
132
- {
133
- "$$typeof": Symbol(react.test.json),
134
- "children": null,
135
- "props": {
136
- "aria-role": "button",
137
- "onPress": undefined,
138
- },
139
- "type": "Pressable",
140
- },
141
132
  ],
142
133
  "props": {
143
134
  "style": {
@@ -167,7 +158,7 @@ exports[`PhoneNumberField renders with icon 1`] = `
167
158
  }
168
159
  `;
169
160
 
170
- exports[`PhoneNumberField uses US as default country code 1`] = `
161
+ exports[`PhoneNumberField renders with icon 1`] = `
171
162
  {
172
163
  "$$typeof": Symbol(react.test.json),
173
164
  "children": [
@@ -213,10 +204,19 @@ exports[`PhoneNumberField uses US as default country code 1`] = `
213
204
  "testID": undefined,
214
205
  "textContentType": undefined,
215
206
  "underlineColorAndroid": "transparent",
216
- "value": "5551234567",
207
+ "value": "",
217
208
  },
218
209
  "type": "TextInput",
219
210
  },
211
+ {
212
+ "$$typeof": Symbol(react.test.json),
213
+ "children": null,
214
+ "props": {
215
+ "aria-role": "button",
216
+ "onPress": undefined,
217
+ },
218
+ "type": "Pressable",
219
+ },
220
220
  ],
221
221
  "props": {
222
222
  "style": {
@@ -246,7 +246,7 @@ exports[`PhoneNumberField uses US as default country code 1`] = `
246
246
  }
247
247
  `;
248
248
 
249
- exports[`PhoneNumberField accepts custom country code 1`] = `
249
+ exports[`PhoneNumberField uses US as default country code 1`] = `
250
250
  {
251
251
  "$$typeof": Symbol(react.test.json),
252
252
  "children": [
@@ -292,7 +292,7 @@ exports[`PhoneNumberField accepts custom country code 1`] = `
292
292
  "testID": undefined,
293
293
  "textContentType": undefined,
294
294
  "underlineColorAndroid": "transparent",
295
- "value": "7911123456",
295
+ "value": "5551234567",
296
296
  },
297
297
  "type": "TextInput",
298
298
  },
@@ -325,7 +325,7 @@ exports[`PhoneNumberField accepts custom country code 1`] = `
325
325
  }
326
326
  `;
327
327
 
328
- exports[`PhoneNumberField formats phone number as user types 1`] = `
328
+ exports[`PhoneNumberField accepts custom country code 1`] = `
329
329
  {
330
330
  "$$typeof": Symbol(react.test.json),
331
331
  "children": [
@@ -371,7 +371,7 @@ exports[`PhoneNumberField formats phone number as user types 1`] = `
371
371
  "testID": undefined,
372
372
  "textContentType": undefined,
373
373
  "underlineColorAndroid": "transparent",
374
- "value": "5551234567",
374
+ "value": "7911123456",
375
375
  },
376
376
  "type": "TextInput",
377
377
  },