@terreno/ui 0.14.2 → 0.15.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 (43) hide show
  1. package/dist/Badge.js +1 -0
  2. package/dist/Badge.js.map +1 -1
  3. package/dist/Banner.d.ts +8 -0
  4. package/dist/Banner.js +2 -2
  5. package/dist/Banner.js.map +1 -1
  6. package/dist/PickerSelect.js +6 -2
  7. package/dist/PickerSelect.js.map +1 -1
  8. package/dist/Signature.d.ts +8 -1
  9. package/dist/Signature.js +93 -18
  10. package/dist/Signature.js.map +1 -1
  11. package/dist/Signature.native.d.ts +15 -0
  12. package/dist/Signature.native.js +116 -21
  13. package/dist/Signature.native.js.map +1 -1
  14. package/dist/TapToEdit.js +1 -1
  15. package/dist/TapToEdit.js.map +1 -1
  16. package/dist/index.d.ts +1 -1
  17. package/dist/index.js +1 -1
  18. package/dist/index.js.map +1 -1
  19. package/package.json +2 -4
  20. package/src/Badge.test.tsx +7 -0
  21. package/src/Badge.tsx +1 -0
  22. package/src/Banner.test.tsx +23 -3
  23. package/src/Banner.tsx +3 -3
  24. package/src/DateTimeField.test.tsx +226 -0
  25. package/src/Field.test.tsx +23 -0
  26. package/src/PickerSelect.test.tsx +22 -0
  27. package/src/PickerSelect.tsx +24 -8
  28. package/src/Signature.native.tsx +147 -30
  29. package/src/Signature.test.tsx +2 -49
  30. package/src/Signature.tsx +128 -22
  31. package/src/SignatureField.test.tsx +0 -9
  32. package/src/TapToEdit.test.tsx +33 -0
  33. package/src/TapToEdit.tsx +1 -1
  34. package/src/ToastNotifications.test.tsx +74 -1
  35. package/src/__snapshots__/CustomSelectField.test.tsx.snap +5 -4
  36. package/src/__snapshots__/Field.test.tsx.snap +377 -0
  37. package/src/__snapshots__/PickerSelect.test.tsx.snap +5 -4
  38. package/src/__snapshots__/SegmentedControl.test.tsx.snap +9 -0
  39. package/src/__snapshots__/SelectField.test.tsx.snap +5 -4
  40. package/src/__snapshots__/Signature.test.tsx.snap +13 -3
  41. package/src/__snapshots__/SignatureField.test.tsx.snap +10 -3
  42. package/src/bunSetup.ts +0 -15
  43. package/src/index.tsx +1 -1
@@ -4666,3 +4666,380 @@ exports[`Field renders phoneNumber field 1`] = `
4666
4666
  "type": "View",
4667
4667
  }
4668
4668
  `;
4669
+
4670
+ exports[`Field renders customSelect field 1`] = `
4671
+ {
4672
+ "$$typeof": Symbol(react.test.json),
4673
+ "children": [
4674
+ {
4675
+ "$$typeof": Symbol(react.test.json),
4676
+ "children": [
4677
+ {
4678
+ "$$typeof": Symbol(react.test.json),
4679
+ "children": [
4680
+ {
4681
+ "$$typeof": Symbol(react.test.json),
4682
+ "children": [
4683
+ {
4684
+ "$$typeof": Symbol(react.test.json),
4685
+ "children": [
4686
+ {
4687
+ "$$typeof": Symbol(react.test.json),
4688
+ "children": [
4689
+ {
4690
+ "$$typeof": Symbol(react.test.json),
4691
+ "children": null,
4692
+ "props": {
4693
+ "readOnly": true,
4694
+ "style": {
4695
+ "color": "#1C1C1C",
4696
+ },
4697
+ "testID": "text_input",
4698
+ "value": "Option A",
4699
+ },
4700
+ "type": "TextInput",
4701
+ },
4702
+ {
4703
+ "$$typeof": Symbol(react.test.json),
4704
+ "children": null,
4705
+ "props": {
4706
+ "style": {
4707
+ "pointerEvents": "none",
4708
+ },
4709
+ "testID": "icon_container",
4710
+ },
4711
+ "type": "View",
4712
+ },
4713
+ ],
4714
+ "props": {
4715
+ "style": {
4716
+ "flexDirection": "row",
4717
+ "justifyContent": "space-between",
4718
+ "pointerEvents": "box-only",
4719
+ "width": "100%",
4720
+ },
4721
+ "testID": undefined,
4722
+ },
4723
+ "type": "View",
4724
+ },
4725
+ ],
4726
+ "props": {
4727
+ "onPress": [Function],
4728
+ "style": {
4729
+ "alignItems": "center",
4730
+ "flexDirection": "row",
4731
+ "justifyContent": "center",
4732
+ "minHeight": 40,
4733
+ "width": "95%",
4734
+ },
4735
+ "testID": "ios_touchable_wrapper",
4736
+ },
4737
+ "type": "Pressable",
4738
+ },
4739
+ {
4740
+ "$$typeof": Symbol(react.test.json),
4741
+ "children": [
4742
+ {
4743
+ "$$typeof": Symbol(react.test.json),
4744
+ "children": null,
4745
+ "props": {
4746
+ "aria-role": "button",
4747
+ "onPress": [Function],
4748
+ "style": {
4749
+ "flex": 1,
4750
+ },
4751
+ "testID": "ios_modal_top",
4752
+ },
4753
+ "type": "Pressable",
4754
+ },
4755
+ {
4756
+ "$$typeof": Symbol(react.test.json),
4757
+ "children": [
4758
+ {
4759
+ "$$typeof": Symbol(react.test.json),
4760
+ "children": null,
4761
+ "props": {
4762
+ "style": {
4763
+ "flexDirection": "row",
4764
+ },
4765
+ "testID": undefined,
4766
+ },
4767
+ "type": "View",
4768
+ },
4769
+ {
4770
+ "$$typeof": Symbol(react.test.json),
4771
+ "children": [
4772
+ {
4773
+ "$$typeof": Symbol(react.test.json),
4774
+ "children": [
4775
+ {
4776
+ "$$typeof": Symbol(react.test.json),
4777
+ "children": [
4778
+ "Done",
4779
+ ],
4780
+ "props": {
4781
+ "allowFontScaling": false,
4782
+ "style": [
4783
+ {
4784
+ "color": "#007aff",
4785
+ "fontSize": 17,
4786
+ "fontWeight": "600",
4787
+ "paddingRight": 11,
4788
+ "paddingTop": 1,
4789
+ },
4790
+ {},
4791
+ ],
4792
+ "testID": "done_text",
4793
+ },
4794
+ "type": "Text",
4795
+ },
4796
+ ],
4797
+ "props": {
4798
+ "style": undefined,
4799
+ "testID": "needed_for_touchable",
4800
+ },
4801
+ "type": "View",
4802
+ },
4803
+ ],
4804
+ "props": {
4805
+ "hitSlop": {
4806
+ "bottom": 4,
4807
+ "left": 4,
4808
+ "right": 4,
4809
+ "top": 4,
4810
+ },
4811
+ "onPress": [Function],
4812
+ "onPressIn": [Function],
4813
+ "onPressOut": [Function],
4814
+ "testID": "done_button",
4815
+ },
4816
+ "type": "Pressable",
4817
+ },
4818
+ ],
4819
+ "props": {
4820
+ "style": {
4821
+ "alignItems": "center",
4822
+ "backgroundColor": "#f8f8f8",
4823
+ "borderTopColor": "#dedede",
4824
+ "borderTopWidth": 1,
4825
+ "flexDirection": "row",
4826
+ "height": 45,
4827
+ "justifyContent": "space-between",
4828
+ "paddingHorizontal": 10,
4829
+ "zIndex": 2,
4830
+ },
4831
+ "testID": "input_accessory_view",
4832
+ },
4833
+ "type": "View",
4834
+ },
4835
+ {
4836
+ "$$typeof": Symbol(react.test.json),
4837
+ "children": [
4838
+ {
4839
+ "$$typeof": Symbol(react.test.json),
4840
+ "children": [
4841
+ {
4842
+ "$$typeof": Symbol(react.test.json),
4843
+ "children": null,
4844
+ "props": {
4845
+ "color": undefined,
4846
+ "label": "Please select an option.",
4847
+ "value": "",
4848
+ },
4849
+ "type": "Picker.Item",
4850
+ },
4851
+ {
4852
+ "$$typeof": Symbol(react.test.json),
4853
+ "children": null,
4854
+ "props": {
4855
+ "color": undefined,
4856
+ "label": "Option A",
4857
+ "value": "a",
4858
+ },
4859
+ "type": "Picker.Item",
4860
+ },
4861
+ {
4862
+ "$$typeof": Symbol(react.test.json),
4863
+ "children": null,
4864
+ "props": {
4865
+ "color": undefined,
4866
+ "label": "Option B",
4867
+ "value": "b",
4868
+ },
4869
+ "type": "Picker.Item",
4870
+ },
4871
+ {
4872
+ "$$typeof": Symbol(react.test.json),
4873
+ "children": null,
4874
+ "props": {
4875
+ "color": undefined,
4876
+ "label": "Custom",
4877
+ "value": "custom",
4878
+ },
4879
+ "type": "Picker.Item",
4880
+ },
4881
+ ],
4882
+ "props": {
4883
+ "onValueChange": [Function],
4884
+ "selectedValue": "a",
4885
+ "testID": "ios_picker",
4886
+ },
4887
+ "type": "Picker",
4888
+ },
4889
+ ],
4890
+ "props": {
4891
+ "style": [
4892
+ {
4893
+ "backgroundColor": "#d0d4da",
4894
+ "justifyContent": "center",
4895
+ },
4896
+ {
4897
+ "height": 215,
4898
+ },
4899
+ ],
4900
+ "testID": undefined,
4901
+ },
4902
+ "type": "View",
4903
+ },
4904
+ ],
4905
+ "props": {
4906
+ "animationType": undefined,
4907
+ "onOrientationChange": [Function],
4908
+ "supportedOrientations": [
4909
+ "portrait",
4910
+ "landscape",
4911
+ ],
4912
+ "testID": "ios_modal",
4913
+ "transparent": true,
4914
+ "visible": false,
4915
+ },
4916
+ "type": "Modal",
4917
+ },
4918
+ ],
4919
+ "props": {
4920
+ "style": [
4921
+ {
4922
+ "alignItems": "center",
4923
+ "alignSelf": "stretch",
4924
+ "borderRadius": 4,
4925
+ "borderWidth": 1,
4926
+ "flexDirection": "row",
4927
+ "justifyContent": "center",
4928
+ "minHeight": 40,
4929
+ "width": "100%",
4930
+ },
4931
+ {
4932
+ "backgroundColor": "#FFFFFF",
4933
+ "borderColor": "#9A9A9A",
4934
+ },
4935
+ false,
4936
+ ],
4937
+ "testID": undefined,
4938
+ },
4939
+ "type": "View",
4940
+ },
4941
+ ],
4942
+ "props": {
4943
+ "style": {
4944
+ "width": "100%",
4945
+ },
4946
+ "testID": undefined,
4947
+ },
4948
+ "type": "View",
4949
+ },
4950
+ ],
4951
+ "props": {
4952
+ "accessibilityHint": "Opens a dropdown menu. Select an option, or select custom to trigger popup to input a custom value",
4953
+ "aria-label": "Select dropdown",
4954
+ "aria-role": "button",
4955
+ "style": undefined,
4956
+ "testID": undefined,
4957
+ },
4958
+ "type": "View",
4959
+ },
4960
+ ],
4961
+ "props": {
4962
+ "accessibilityHint": "Select an option or input a custom value",
4963
+ "aria-label": "Select dropdown with popup text input field",
4964
+ "aria-role": "combobox",
4965
+ "style": {
4966
+ "width": "100%",
4967
+ },
4968
+ "testID": undefined,
4969
+ },
4970
+ "type": "View",
4971
+ }
4972
+ `;
4973
+
4974
+ exports[`Field renders signature field 1`] = `
4975
+ {
4976
+ "$$typeof": Symbol(react.test.json),
4977
+ "children": [
4978
+ {
4979
+ "$$typeof": Symbol(react.test.json),
4980
+ "children": [
4981
+ {
4982
+ "$$typeof": Symbol(react.test.json),
4983
+ "children": null,
4984
+ "props": {
4985
+ "height": 180,
4986
+ "onPointerDown": [Function],
4987
+ "onPointerLeave": [Function],
4988
+ "onPointerMove": [Function],
4989
+ "onPointerUp": [Function],
4990
+ "ref": {
4991
+ "current": null,
4992
+ },
4993
+ "style": {
4994
+ "height": 180,
4995
+ "touchAction": "none",
4996
+ "width": 300,
4997
+ },
4998
+ "width": 300,
4999
+ },
5000
+ "type": "canvas",
5001
+ },
5002
+ ],
5003
+ "props": {
5004
+ "style": {
5005
+ "borderColor": "#9A9A9A",
5006
+ "borderWidth": 1,
5007
+ "maxWidth": 300,
5008
+ "width": "100%",
5009
+ },
5010
+ "testID": undefined,
5011
+ },
5012
+ "type": "View",
5013
+ },
5014
+ {
5015
+ "$$typeof": Symbol(react.test.json),
5016
+ "children": [
5017
+ {
5018
+ "$$typeof": Symbol(react.test.json),
5019
+ "children": [
5020
+ "Clear",
5021
+ ],
5022
+ "props": {
5023
+ "onPress": [Function],
5024
+ "style": {
5025
+ "color": "#0A7092",
5026
+ "textDecorationLine": "underline",
5027
+ },
5028
+ },
5029
+ "type": "Text",
5030
+ },
5031
+ ],
5032
+ "props": {
5033
+ "style": undefined,
5034
+ "testID": undefined,
5035
+ },
5036
+ "type": "View",
5037
+ },
5038
+ ],
5039
+ "props": {
5040
+ "style": undefined,
5041
+ "testID": undefined,
5042
+ },
5043
+ "type": "View",
5044
+ }
5045
+ `;
@@ -540,16 +540,17 @@ exports[`PickerSelect renders disabled state 1`] = `
540
540
  "children": [
541
541
  {
542
542
  "$$typeof": Symbol(react.test.json),
543
- "children": null,
543
+ "children": [
544
+ "Select an option",
545
+ ],
544
546
  "props": {
545
- "readOnly": true,
546
547
  "style": {
547
548
  "color": "#686868",
549
+ "flex": 1,
548
550
  },
549
551
  "testID": "text_input",
550
- "value": "Select an option",
551
552
  },
552
- "type": "TextInput",
553
+ "type": "Text",
553
554
  },
554
555
  {
555
556
  "$$typeof": Symbol(react.test.json),
@@ -768,6 +768,9 @@ exports[`SegmentedControl renders with badges 1`] = `
768
768
  "paddingVertical": 4,
769
769
  "width": "auto",
770
770
  },
771
+ {
772
+ "minWidth": 20,
773
+ },
771
774
  false,
772
775
  false,
773
776
  ],
@@ -859,6 +862,9 @@ exports[`SegmentedControl renders with badges 1`] = `
859
862
  "paddingVertical": 4,
860
863
  "width": "auto",
861
864
  },
865
+ {
866
+ "minWidth": 20,
867
+ },
862
868
  false,
863
869
  false,
864
870
  ],
@@ -950,6 +956,9 @@ exports[`SegmentedControl renders with badges 1`] = `
950
956
  "paddingVertical": 4,
951
957
  "width": "auto",
952
958
  },
959
+ {
960
+ "minWidth": 20,
961
+ },
953
962
  false,
954
963
  false,
955
964
  ],
@@ -1134,16 +1134,17 @@ exports[`SelectField renders disabled state 1`] = `
1134
1134
  "children": [
1135
1135
  {
1136
1136
  "$$typeof": Symbol(react.test.json),
1137
- "children": null,
1137
+ "children": [
1138
+ "Please select an option.",
1139
+ ],
1138
1140
  "props": {
1139
- "readOnly": true,
1140
1141
  "style": {
1141
1142
  "color": "#686868",
1143
+ "flex": 1,
1142
1144
  },
1143
1145
  "testID": "text_input",
1144
- "value": "Please select an option.",
1145
1146
  },
1146
- "type": "TextInput",
1147
+ "type": "Text",
1147
1148
  },
1148
1149
  {
1149
1150
  "$$typeof": Symbol(react.test.json),
@@ -11,12 +11,22 @@ exports[`Signature renders correctly 1`] = `
11
11
  "$$typeof": Symbol(react.test.json),
12
12
  "children": null,
13
13
  "props": {
14
+ "height": 180,
15
+ "onPointerDown": [Function],
16
+ "onPointerLeave": [Function],
17
+ "onPointerMove": [Function],
18
+ "onPointerUp": [Function],
19
+ "ref": {
20
+ "current": null,
21
+ },
14
22
  "style": {
15
- "backgroundColor": "#FFFFFF",
23
+ "height": 180,
24
+ "touchAction": "none",
25
+ "width": 300,
16
26
  },
17
- "testID": "signature-canvas",
27
+ "width": 300,
18
28
  },
19
- "type": "View",
29
+ "type": "canvas",
20
30
  },
21
31
  ],
22
32
  "props": {
@@ -33,15 +33,22 @@ exports[`SignatureField renders correctly with default props 1`] = `
33
33
  "$$typeof": Symbol(react.test.json),
34
34
  "children": null,
35
35
  "props": {
36
+ "height": 180,
37
+ "onPointerDown": [Function],
38
+ "onPointerLeave": [Function],
39
+ "onPointerMove": [Function],
40
+ "onPointerUp": [Function],
36
41
  "ref": {
37
42
  "current": null,
38
43
  },
39
44
  "style": {
40
- "backgroundColor": "#FFFFFF",
45
+ "height": 180,
46
+ "touchAction": "none",
47
+ "width": 300,
41
48
  },
42
- "testID": "signature-canvas",
49
+ "width": 300,
43
50
  },
44
- "type": "View",
51
+ "type": "canvas",
45
52
  },
46
53
  ],
47
54
  "props": {
package/src/bunSetup.ts CHANGED
@@ -548,21 +548,6 @@ mock.module("@react-native-async-storage/async-storage", () => ({
548
548
  setItem: mock(() => Promise.resolve()),
549
549
  }));
550
550
 
551
- // Mock react-native-signature-canvas
552
- mock.module("react-native-signature-canvas", () => ({
553
- Signature: mock(() => null),
554
- }));
555
-
556
- // Mock react-signature-canvas (web). The real module references `window` at
557
- // import time, which doesn't exist under bun test.
558
- mock.module("react-signature-canvas", () => {
559
- const SignatureCanvasMock = React.forwardRef(
560
- ({backgroundColor}: {backgroundColor?: string}, _ref) =>
561
- React.createElement("View", {style: {backgroundColor}, testID: "signature-canvas"})
562
- );
563
- return {__esModule: true, default: SignatureCanvasMock};
564
- });
565
-
566
551
  // Mock react-native-portalize. The real `Host` wraps children in an extra View
567
552
  // whose presence makes snapshots brittle, and individual tests already mock
568
553
  // this to render inline; hoisting the mock to setup keeps test ordering from
package/src/index.tsx CHANGED
@@ -8,7 +8,7 @@ export * from "./AiSuggestionBox";
8
8
  export * from "./AttachmentPreview";
9
9
  export * from "./Avatar";
10
10
  export * from "./Badge";
11
- export * from "./Banner";
11
+ export {Banner, hideBanner} from "./Banner";
12
12
  export * from "./Body";
13
13
  export * from "./BooleanField";
14
14
  export * from "./Box";