@wavemaker-ai/rn-codegen 1.0.0-rc.647469 → 1.0.0-rc.647502

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 (36) hide show
  1. package/npm-shrinkwrap.json +37 -37
  2. package/package-lock.json +37 -37
  3. package/package.json +3 -3
  4. package/src/templates/foundation-theme/build/android/wavemaker/design-tokens/basic/button.less +0 -1
  5. package/src/templates/foundation-theme/build/android/wavemaker/design-tokens/basic/search.less +33 -13
  6. package/src/templates/foundation-theme/build/android/wavemaker/design-tokens/studio/basic/search.less +8 -1
  7. package/src/templates/foundation-theme/build/android/wavemaker/design-tokens/tokens.light.css +9 -5
  8. package/src/templates/foundation-theme/build/android/wavemaker/design-tokens/variables/form-controls.variant.less +5 -5
  9. package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/basic/button.less +0 -1
  10. package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/basic/search.less +33 -13
  11. package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/studio/basic/search.less +8 -1
  12. package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/tokens.light.css +9 -5
  13. package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/variables/form-controls.variant.less +5 -5
  14. package/src/templates/foundation-theme/dist/android/style.css +11 -7
  15. package/src/templates/foundation-theme/dist/android/style.js +33 -16
  16. package/src/templates/foundation-theme/dist/android/tokens.js +9 -5
  17. package/src/templates/foundation-theme/dist/ios/style.css +11 -7
  18. package/src/templates/foundation-theme/dist/ios/style.js +33 -16
  19. package/src/templates/foundation-theme/dist/ios/tokens.js +9 -5
  20. package/src/templates/foundation-theme/wavemaker/design-tokens/basic/button.less +0 -1
  21. package/src/templates/foundation-theme/wavemaker/design-tokens/basic/search.less +33 -13
  22. package/src/templates/foundation-theme/wavemaker/design-tokens/studio/basic/search.less +8 -1
  23. package/src/templates/foundation-theme/wavemaker/design-tokens/tokens.light.css +9 -5
  24. package/src/templates/foundation-theme/wavemaker/design-tokens/variables/form-controls.variant.less +5 -5
  25. package/src/templates/package.web.json +3 -3
  26. package/src/templates/project/package.json +3 -3
  27. package/src/transpile/components/basic/search.transformer.js +13 -6
  28. package/src/transpile/components/basic/search.transformer.js.map +1 -1
  29. package/src/transpile/components/container/accordion/accordionpane.transformer.js +0 -4
  30. package/src/transpile/components/container/accordion/accordionpane.transformer.js.map +1 -1
  31. package/src/transpile/components/container/tabs/tabpane.transformer.js +0 -4
  32. package/src/transpile/components/container/tabs/tabpane.transformer.js.map +1 -1
  33. package/src/transpile/components/container/wizard/wizardstep.transformer.js +0 -4
  34. package/src/transpile/components/container/wizard/wizardstep.transformer.js.map +1 -1
  35. package/src/transpile/components/data/form/form-field.transformer.js +21 -12
  36. package/src/transpile/components/data/form/form-field.transformer.js.map +1 -1
package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/basic/search.less CHANGED
@@ -1,22 +1,34 @@
1
1
 
2
2
  .app-search {
3
3
  border-radius: var(--wm-search-border-radius);
4
+ width: var(--wm-search-width);
5
+ background-color: var(--wm-search-text-background-color);
4
6
  }
5
7
 
6
8
  .app-search-text {
7
9
  height: var(--wm-search-height);
8
10
  min-height: var(--wm-search-height);
9
- border-color: var(--wm-search-border-color);
10
11
  color: var(--wm-search-text-color);
11
12
  background-color: var(--wm-search-text-background-color);
12
13
  font-size: var(--wm-search-text-font-size);
13
14
  font-family: var(--wm-search-text-font-family);
14
15
  font-weight: var(--wm-search-text-font-weight);
15
- border-top-left-radius: var(--wm-search-border-radius);
16
- border-bottom-left-radius: var(--wm-search-border-radius);
17
16
  padding: var(--wm-search-text-padding);
18
- border-width: var(--wm-search-border-width);
19
- border-right-width: 0;
17
+ border-width: 0;
18
+ outline: none;
19
+ box-shadow: none;
20
+ }
21
+
22
+ .app-search-text:focus {
23
+ outline: none;
24
+ box-shadow: none;
25
+ }
26
+ .app-search-modal-content{
27
+ background-color: var(--wm-search-text-background-color);
28
+ border-bottom-width: var(--wm-search-border-width);
29
+ border-left-width: var(--wm-search-border-width);
30
+ border-right-width: var(--wm-search-border-width);
31
+ border-color: var(--wm-search-border-color);
20
32
  }
21
33
 
22
34
  .app-search-invalid {
@@ -33,15 +45,15 @@
33
45
  width: var(--wm-search-clear-btn-width);
34
46
  }
35
47
 
36
- .app-search-clear-btn .app-button-icon .app-icon-shape{
48
+ .app-search-clear-btn .app-button-icon .app-icon-shape {
37
49
  background-color: transparent;
38
- color:var(--wm-search-clear-btn-icon-color);
50
+ color: var(--wm-search-clear-btn-icon-color);
39
51
  font-size: var(--wm-search-clear-btn-icon-size);
40
52
  }
41
53
 
42
54
  .app-search-btn .app-button-icon .app-icon-shape {
43
55
  background-color: transparent;
44
- color:var(--wm-search-btn-icon-color);
56
+ color: var(--wm-search-btn-icon-color);
45
57
  font-size: var(--wm-search-btn-icon-size);
46
58
  }
47
59
 
@@ -57,7 +69,7 @@
57
69
  color: var(--wm-search-data-complete-text-color);
58
70
  }
59
71
 
60
- .app-search-item{
72
+ .app-search-item {
61
73
  padding: var(--wm-search-item-padding);
62
74
  margin-bottom: var(--wm-search-item-margin-bottom);
63
75
  border-bottom-color: var(--wm-search-item-separator-color);
@@ -65,7 +77,7 @@
65
77
  border-bottom-style: solid;
66
78
  }
67
79
 
68
- .app-search-item-text{
80
+ .app-search-item-text {
69
81
  font-size: var(--wm-search-item-text-font-size);
70
82
  font-family: var(--wm-search-item-text-font-family);
71
83
  font-weight: var(--wm-search-item-text-font-weight);
@@ -80,11 +92,19 @@
80
92
  width: var(--wm-search-dropdown-width);
81
93
  border-style: solid;
82
94
  border-width: var(--wm-search-dropdown-border-width);
83
- background-color: var(--wm-search-dropdown-background-color);
84
- border-radius: var(--wm-search-dropdown-border-radius);
85
95
  border-color: var(--wm-search-dropdown-border-color);
96
+ border-top-left-radius: 0;
97
+ border-top-right-radius: 0;
98
+ border-bottom-left-radius: var(--wm-search-dropdown-border-radius);
99
+ border-bottom-right-radius: var(--wm-search-dropdown-border-radius);
100
+ }
101
+
102
+ .app-search-divider {
103
+ width: 100%;
104
+ border-bottom-color: var(--wm-search-dropdown-divider-color);
86
105
  }
87
- .app-search-text-wrapper{
106
+
107
+ .app-search-text-wrapper {
88
108
  border-color: transparent;
89
109
  }
90
110
 
package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/studio/basic/search.less CHANGED
@@ -35,5 +35,12 @@
35
35
  width: var(--wm-form-controls-min-width);
36
36
  }
37
37
  .app-search>input.app-textbox{
38
- width: 100%;
38
+ width: 100%;
39
+ border-color: var(--wm-search-border-color);
40
+ border-width: var(--wm-search-border-width);
41
+ border-top-left-radius: var(--wm-search-border-radius);;
42
+ border-bottom-left-radius: var(--wm-search-border-radius);
43
+ border-top-right-radius: 0px;
44
+ border-bottom-right-radius: 0px;
45
+ border-right-width: 0px;
39
46
  }
package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/tokens.light.css CHANGED
@@ -204,13 +204,18 @@
204
204
  --wm-scroll-bar-height: 6px;
205
205
  --wm-scroll-bar-track-radius: 6px;
206
206
  --wm-scroll-bar-thumb-radius: 6px;
207
- --wm-search-dropdown-width: 90%;
207
+ --wm-search-height: 56px;
208
+ --wm-search-width: 360px;
209
+ --wm-search-dropdown-width: 100%;
210
+ --wm-search-dropdown-offset-top: 56px;
211
+ --wm-search-dropdown-max-height: 200px;
208
212
  --wm-search-dropdown-border-color: transparent;
209
213
  --wm-search-dropdown-border-width: 0;
210
214
  --wm-search-btn-ripple-color: rgba(255, 255, 255, 0.08);
211
215
  --wm-search-btn-width: auto;
212
216
  --wm-search-data-complete-background: transparent;
213
217
  --wm-search-item-separator-width: 0;
218
+ --wm-select-arrow-button-background-color: transparent;
214
219
  --wm-select-arrow-button-icon-height: 24px;
215
220
  --wm-slider-tooltip-background: #000;
216
221
  --wm-spinner-background: transparent;
@@ -536,7 +541,7 @@
536
541
  --wm-btn-letter-spacing: var(--wm-label-large-letter-spacing);
537
542
  --wm-btn-border-color: var(--wm-color-surface-container-highest);
538
543
  --wm-btn-radius: var(--wm-radius-pill);
539
- --wm-btn-padding: var(--wm-space-0) var(--wm-space-6);
544
+ --wm-btn-padding: var(--wm-space-3) var(--wm-space-6);
540
545
  --wm-btn-min-height: var(--wm-space-10);
541
546
  --wm-btn-gap: var(--wm-space-2);
542
547
  --wm-btn-icon-size: var(--wm-icon-size-md);
@@ -996,15 +1001,15 @@
996
1001
  --wm-scroll-bar-track-bg: var(--wm-color-surface);
997
1002
  --wm-scroll-bar-thumb-bg: var(--wm-color-surface-container-high);
998
1003
  --wm-scroll-bar-thumb-hover: var(--wm-color-surface-container-highest);
999
- --wm-search-height: var(--wm-space-12);
1000
1004
  --wm-search-border-radius: var(--wm-space-7);
1001
1005
  --wm-search-border-width: var(--wm-border-width-1);
1002
1006
  --wm-search-border-color: var(--wm-color-outline);
1003
1007
  --wm-search-text-color: var(--wm-color-on-surface);
1004
1008
  --wm-search-text-background-color: var(--wm-color-surface);
1005
1009
  --wm-search-text-font-size: var(--wm-body-medium-font-size);
1006
- --wm-search-text-padding: var(--wm-space-2) var(--wm-space-3) var(--wm-space-2) var(--wm-space-6);
1010
+ --wm-search-text-padding: var(--wm-space-0) var(--wm-space-4);
1007
1011
  --wm-search-dropdown-background-color: var(--wm-color-surface);
1012
+ --wm-search-dropdown-divider-color: var(--wm-color-on-surface);
1008
1013
  --wm-search-dropdown-border-radius: var(--wm-radius-md);
1009
1014
  --wm-search-invalid-color: var(--wm-color-error);
1010
1015
  --wm-search-btn-background-color: var(--wm-color-surface);
@@ -1027,7 +1032,6 @@
1027
1032
  --wm-search-clear-btn-background-color: var(--wm-color-transparent);
1028
1033
  --wm-search-clear-btn-width: var(--wm-space-9);
1029
1034
  --wm-select-arrow-button-padding: var(--wm-space-1);
1030
- --wm-select-arrow-button-background-color: var(--wm-color-outline-variant);
1031
1035
  --wm-select-arrow-button-icon-color: var(--wm-color-on-background);
1032
1036
  --wm-select-arrow-button-icon-padding: var(--wm-space-1);
1033
1037
  --wm-select-arrow-button-icon-border-radius: var(--wm-radius-none);
package/src/templates/foundation-theme/build/ios/wavemaker/design-tokens/variables/form-controls.variant.less CHANGED
@@ -24,7 +24,7 @@
24
24
  --wm-form-controls-opacity: var(--wm-border-width-1);
25
25
  --wm-form-controls-min-height: 56px;
26
26
  --wm-form-controls-min-width: 210px;
27
- --wm-form-controls-padding: var(--wm-space-4);
27
+ --wm-form-controls-padding: var(--wm-space-4) var(--wm-space-4) 0 var(--wm-space-4);
28
28
  --wm-form-controls-border-color: var(--wm-color-outline);
29
29
  --wm-form-controls-border-radius: var(--wm-radius-sm) var(--wm-radius-sm) 0 0;
30
30
  --wm-form-controls-border-style: var(--wm-border-style-base);
@@ -54,7 +54,7 @@
54
54
  --wm-form-controls-floating-top: var(--wm-space-5);
55
55
  --wm-form-controls-floating-left: var(--wm-space-3);
56
56
  --wm-form-controls-label-color: var(--wm-color-outline);
57
- --wm-form-controls-padding: var(--wm-space-4);
57
+ --wm-form-controls-padding: var(--wm-space-4) var(--wm-space-4) 0 var(--wm-space-4);
58
58
  }
59
59
 
60
60
  .form-controls-filled.app-input-disabled {
@@ -75,7 +75,7 @@
75
75
  --wm-form-controls-padding: var(--wm-space-4);
76
76
  --wm-form-controls-border: var(--wm-border-width-1);
77
77
  --wm-form-controls-placeholder-color: var(--wm-color-on-surface);
78
- --wm-form-controls-background: transparent;
78
+ --wm-form-controls-background: var(--wm-color-white);
79
79
  --wm-form-controls-color: var(--wm-color-black);
80
80
  --wm-form-controls-label-color: var(--wm-color-on-surface);
81
81
  --wm-form-controls-label-background: var(--wm-color-transparent);
@@ -90,7 +90,7 @@
90
90
  --wm-form-controls-border-color: var(--wm-color-secondary);
91
91
  --wm-form-controls-border-width: var(--wm-border-width-1);
92
92
  --wm-form-controls-padding: var(--wm-space-4);
93
- --wm-form-controls-background: transparent;
93
+ --wm-form-controls-background: var(--wm-color-white);
94
94
  --wm-form-controls-color: var(--wm-color-black);
95
95
  --wm-form-controls-floating-color: var(--wm-color-primary);
96
96
  --wm-form-controls-floating-top: var(--wm-space-5);
@@ -99,7 +99,7 @@
99
99
 
100
100
  .form-controls-outlined.app-input-disabled {
101
101
  --wm-form-controls-border: 1px solid var(--wm-color-shadow);
102
- --wm-form-controls-background: transparent;
102
+ --wm-form-controls-background: var(--wm-color-white);
103
103
  --wm-form-controls-color: var(--wm-color-scrim);
104
104
  --wm-form-controls-opacity: 0.67;
105
105
  }