@syncfusion/ej2-form-renderer 34.2.8 → 35.1.42

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 (215) hide show
  1. package/dist/ej2-form-renderer.umd.min.js +2 -2
  2. package/dist/ej2-form-renderer.umd.min.js.map +1 -1
  3. package/dist/es6/ej2-form-renderer.es2015.js +3271 -1523
  4. package/dist/es6/ej2-form-renderer.es2015.js.map +1 -1
  5. package/dist/es6/ej2-form-renderer.es5.js +3326 -1540
  6. package/dist/es6/ej2-form-renderer.es5.js.map +1 -1
  7. package/dist/global/ej2-form-renderer.min.js +2 -2
  8. package/dist/global/ej2-form-renderer.min.js.map +1 -1
  9. package/dist/global/index.d.ts +1 -1
  10. package/package.json +11 -11
  11. package/src/{common → form-renderer/common}/checkbox-group.js +1 -1
  12. package/src/{common → form-renderer/common}/conditional-rule-engine.d.ts +1 -6
  13. package/src/{common → form-renderer/common}/custom-validation-engine.d.ts +1 -1
  14. package/src/{common → form-renderer/common}/expressions/expression-engine.d.ts +1 -4
  15. package/src/{common → form-renderer/common}/expressions/expression-parser.d.ts +1 -9
  16. package/src/{common → form-renderer/common}/index.d.ts +2 -0
  17. package/src/{common → form-renderer/common}/index.js +2 -0
  18. package/src/{common → form-renderer/common}/json-converter.d.ts +6 -1
  19. package/src/{common → form-renderer/common}/json-converter.js +49 -8
  20. package/src/form-renderer/common/props-forwarder.d.ts +38 -0
  21. package/src/form-renderer/common/props-forwarder.js +123 -0
  22. package/src/{common → form-renderer/common}/utils.d.ts +6 -0
  23. package/src/form-renderer/form-renderer/custom-widget-resolver.d.ts +17 -0
  24. package/src/form-renderer/form-renderer/custom-widget-resolver.js +39 -0
  25. package/src/form-renderer/form-renderer/form-renderer-model.d.ts +125 -0
  26. package/src/form-renderer/form-renderer/form-renderer.d.ts +373 -0
  27. package/src/form-renderer/{form-renderer.js → form-renderer/form-renderer.js} +429 -298
  28. package/src/form-renderer/form-renderer/index.d.ts +7 -0
  29. package/src/form-renderer/form-renderer/index.js +6 -0
  30. package/src/form-renderer/{render-form-field.js → form-renderer/render-form-field.js} +154 -25
  31. package/src/form-renderer/index.d.ts +3 -4
  32. package/src/form-renderer/index.js +3 -3
  33. package/src/index.d.ts +1 -4
  34. package/src/index.js +1 -4
  35. package/common.d.ts +0 -4
  36. package/common.js +0 -4
  37. package/src/form-renderer/form-renderer-model.d.ts +0 -65
  38. package/src/form-renderer/form-renderer.d.ts +0 -425
  39. package/styles/bds-lite.css +0 -599
  40. package/styles/bds-lite.scss +0 -2
  41. package/styles/bds.css +0 -599
  42. package/styles/bds.scss +0 -2
  43. package/styles/bootstrap-dark-lite.css +0 -608
  44. package/styles/bootstrap-dark-lite.scss +0 -2
  45. package/styles/bootstrap-dark.css +0 -608
  46. package/styles/bootstrap-dark.scss +0 -2
  47. package/styles/bootstrap-lite.css +0 -595
  48. package/styles/bootstrap-lite.scss +0 -2
  49. package/styles/bootstrap.css +0 -595
  50. package/styles/bootstrap.scss +0 -2
  51. package/styles/bootstrap4-lite.css +0 -595
  52. package/styles/bootstrap4-lite.scss +0 -2
  53. package/styles/bootstrap4.css +0 -595
  54. package/styles/bootstrap4.scss +0 -2
  55. package/styles/bootstrap5-dark-lite.css +0 -595
  56. package/styles/bootstrap5-dark-lite.scss +0 -2
  57. package/styles/bootstrap5-dark.css +0 -595
  58. package/styles/bootstrap5-dark.scss +0 -2
  59. package/styles/bootstrap5-lite.css +0 -595
  60. package/styles/bootstrap5-lite.scss +0 -2
  61. package/styles/bootstrap5.3-lite.css +0 -679
  62. package/styles/bootstrap5.3-lite.scss +0 -2
  63. package/styles/bootstrap5.3.css +0 -679
  64. package/styles/bootstrap5.3.scss +0 -2
  65. package/styles/bootstrap5.css +0 -595
  66. package/styles/bootstrap5.scss +0 -2
  67. package/styles/fabric-dark-lite.css +0 -608
  68. package/styles/fabric-dark-lite.scss +0 -2
  69. package/styles/fabric-dark.css +0 -608
  70. package/styles/fabric-dark.scss +0 -2
  71. package/styles/fabric-lite.css +0 -595
  72. package/styles/fabric-lite.scss +0 -2
  73. package/styles/fabric.css +0 -595
  74. package/styles/fabric.scss +0 -2
  75. package/styles/fluent-dark-lite.css +0 -595
  76. package/styles/fluent-dark-lite.scss +0 -2
  77. package/styles/fluent-dark.css +0 -595
  78. package/styles/fluent-dark.scss +0 -2
  79. package/styles/fluent-lite.css +0 -595
  80. package/styles/fluent-lite.scss +0 -2
  81. package/styles/fluent.css +0 -595
  82. package/styles/fluent.scss +0 -2
  83. package/styles/fluent2-lite.css +0 -681
  84. package/styles/fluent2-lite.scss +0 -2
  85. package/styles/fluent2.css +0 -681
  86. package/styles/fluent2.scss +0 -2
  87. package/styles/form-renderer/_all.scss +0 -2
  88. package/styles/form-renderer/_bds-definition.scss +0 -8
  89. package/styles/form-renderer/_bootstrap-dark-definition.scss +0 -8
  90. package/styles/form-renderer/_bootstrap-definition.scss +0 -8
  91. package/styles/form-renderer/_bootstrap4-definition.scss +0 -8
  92. package/styles/form-renderer/_bootstrap5-dark-definition.scss +0 -8
  93. package/styles/form-renderer/_bootstrap5-definition.scss +0 -8
  94. package/styles/form-renderer/_bootstrap5.3-definition.scss +0 -8
  95. package/styles/form-renderer/_fabric-dark-definition.scss +0 -8
  96. package/styles/form-renderer/_fabric-definition.scss +0 -8
  97. package/styles/form-renderer/_fluent-dark-definition.scss +0 -8
  98. package/styles/form-renderer/_fluent-definition.scss +0 -8
  99. package/styles/form-renderer/_fluent2-definition.scss +0 -8
  100. package/styles/form-renderer/_highcontrast-definition.scss +0 -8
  101. package/styles/form-renderer/_highcontrast-light-definition.scss +0 -8
  102. package/styles/form-renderer/_layout.scss +0 -480
  103. package/styles/form-renderer/_material-dark-definition.scss +0 -8
  104. package/styles/form-renderer/_material-definition.scss +0 -8
  105. package/styles/form-renderer/_material3-dark-definition.scss +0 -8
  106. package/styles/form-renderer/_material3-definition.scss +0 -8
  107. package/styles/form-renderer/_mixin.scss +0 -26
  108. package/styles/form-renderer/_tailwind-dark-definition.scss +0 -8
  109. package/styles/form-renderer/_tailwind-definition.scss +0 -8
  110. package/styles/form-renderer/_tailwind3-definition.scss +0 -8
  111. package/styles/form-renderer/_theme.scss +0 -69
  112. package/styles/form-renderer/_variables.scss +0 -2
  113. package/styles/form-renderer/bds.css +0 -599
  114. package/styles/form-renderer/bds.scss +0 -2
  115. package/styles/form-renderer/bootstrap-dark.css +0 -608
  116. package/styles/form-renderer/bootstrap-dark.scss +0 -2
  117. package/styles/form-renderer/bootstrap.css +0 -595
  118. package/styles/form-renderer/bootstrap.scss +0 -2
  119. package/styles/form-renderer/bootstrap4.css +0 -595
  120. package/styles/form-renderer/bootstrap4.scss +0 -2
  121. package/styles/form-renderer/bootstrap5-dark.css +0 -595
  122. package/styles/form-renderer/bootstrap5-dark.scss +0 -2
  123. package/styles/form-renderer/bootstrap5.3.css +0 -679
  124. package/styles/form-renderer/bootstrap5.3.scss +0 -2
  125. package/styles/form-renderer/bootstrap5.css +0 -595
  126. package/styles/form-renderer/bootstrap5.scss +0 -2
  127. package/styles/form-renderer/fabric-dark.css +0 -608
  128. package/styles/form-renderer/fabric-dark.scss +0 -2
  129. package/styles/form-renderer/fabric.css +0 -595
  130. package/styles/form-renderer/fabric.scss +0 -2
  131. package/styles/form-renderer/fluent-dark.css +0 -595
  132. package/styles/form-renderer/fluent-dark.scss +0 -2
  133. package/styles/form-renderer/fluent.css +0 -595
  134. package/styles/form-renderer/fluent.scss +0 -2
  135. package/styles/form-renderer/fluent2.css +0 -681
  136. package/styles/form-renderer/fluent2.scss +0 -2
  137. package/styles/form-renderer/highcontrast-light.css +0 -595
  138. package/styles/form-renderer/highcontrast-light.scss +0 -2
  139. package/styles/form-renderer/highcontrast.css +0 -608
  140. package/styles/form-renderer/highcontrast.scss +0 -2
  141. package/styles/form-renderer/material-dark.css +0 -608
  142. package/styles/form-renderer/material-dark.scss +0 -2
  143. package/styles/form-renderer/material.css +0 -595
  144. package/styles/form-renderer/material.scss +0 -2
  145. package/styles/form-renderer/material3-dark.css +0 -677
  146. package/styles/form-renderer/material3-dark.scss +0 -2
  147. package/styles/form-renderer/material3.css +0 -679
  148. package/styles/form-renderer/material3.scss +0 -2
  149. package/styles/form-renderer/tailwind-dark.css +0 -595
  150. package/styles/form-renderer/tailwind-dark.scss +0 -2
  151. package/styles/form-renderer/tailwind.css +0 -595
  152. package/styles/form-renderer/tailwind.scss +0 -2
  153. package/styles/form-renderer/tailwind3.css +0 -669
  154. package/styles/form-renderer/tailwind3.scss +0 -2
  155. package/styles/highcontrast-light-lite.css +0 -595
  156. package/styles/highcontrast-light-lite.scss +0 -2
  157. package/styles/highcontrast-light.css +0 -595
  158. package/styles/highcontrast-light.scss +0 -2
  159. package/styles/highcontrast-lite.css +0 -608
  160. package/styles/highcontrast-lite.scss +0 -2
  161. package/styles/highcontrast.css +0 -608
  162. package/styles/highcontrast.scss +0 -2
  163. package/styles/material-dark-lite.css +0 -608
  164. package/styles/material-dark-lite.scss +0 -2
  165. package/styles/material-dark.css +0 -608
  166. package/styles/material-dark.scss +0 -2
  167. package/styles/material-lite.css +0 -595
  168. package/styles/material-lite.scss +0 -2
  169. package/styles/material.css +0 -595
  170. package/styles/material.scss +0 -2
  171. package/styles/material3-dark-lite.css +0 -677
  172. package/styles/material3-dark-lite.scss +0 -2
  173. package/styles/material3-dark.css +0 -677
  174. package/styles/material3-dark.scss +0 -2
  175. package/styles/material3-lite.css +0 -679
  176. package/styles/material3-lite.scss +0 -2
  177. package/styles/material3.css +0 -679
  178. package/styles/material3.scss +0 -2
  179. package/styles/tailwind-dark-lite.css +0 -595
  180. package/styles/tailwind-dark-lite.scss +0 -2
  181. package/styles/tailwind-dark.css +0 -595
  182. package/styles/tailwind-dark.scss +0 -2
  183. package/styles/tailwind-lite.css +0 -595
  184. package/styles/tailwind-lite.scss +0 -2
  185. package/styles/tailwind.css +0 -595
  186. package/styles/tailwind.scss +0 -2
  187. package/styles/tailwind3-lite.css +0 -669
  188. package/styles/tailwind3-lite.scss +0 -2
  189. package/styles/tailwind3.css +0 -669
  190. package/styles/tailwind3.scss +0 -2
  191. /package/src/{common → form-renderer/common}/checkbox-group.d.ts +0 -0
  192. /package/src/{common → form-renderer/common}/conditional-rule-engine.js +0 -0
  193. /package/src/{common → form-renderer/common}/custom-validation-engine.js +0 -0
  194. /package/src/{common → form-renderer/common}/datagrid-component.d.ts +0 -0
  195. /package/src/{common → form-renderer/common}/datagrid-component.js +0 -0
  196. /package/src/{common → form-renderer/common}/expressions/dependency-tracker.d.ts +0 -0
  197. /package/src/{common → form-renderer/common}/expressions/dependency-tracker.js +0 -0
  198. /package/src/{common → form-renderer/common}/expressions/expression-engine.js +0 -0
  199. /package/src/{common → form-renderer/common}/expressions/expression-parser.js +0 -0
  200. /package/src/{common → form-renderer/common}/expressions/grid-expressions.d.ts +0 -0
  201. /package/src/{common → form-renderer/common}/expressions/grid-expressions.js +0 -0
  202. /package/src/{common → form-renderer/common}/expressions/index.d.ts +0 -0
  203. /package/src/{common → form-renderer/common}/expressions/index.js +0 -0
  204. /package/src/{common → form-renderer/common}/minmax-rule-engine.d.ts +0 -0
  205. /package/src/{common → form-renderer/common}/minmax-rule-engine.js +0 -0
  206. /package/src/{common → form-renderer/common}/option-fetcher.d.ts +0 -0
  207. /package/src/{common → form-renderer/common}/option-fetcher.js +0 -0
  208. /package/src/{common → form-renderer/common}/parser.d.ts +0 -0
  209. /package/src/{common → form-renderer/common}/parser.js +0 -0
  210. /package/src/{common → form-renderer/common}/static-html-renderer.d.ts +0 -0
  211. /package/src/{common → form-renderer/common}/static-html-renderer.js +0 -0
  212. /package/src/{common → form-renderer/common}/utils.js +0 -0
  213. /package/src/form-renderer/{render-form-field.d.ts → form-renderer/render-form-field.d.ts} +0 -0
  214. /package/src/form-renderer/{types → form-renderer/types}/form-schema.d.ts +0 -0
  215. /package/src/form-renderer/{types → form-renderer/types}/form-schema.js +0 -0
package/styles/bds.css DELETED
@@ -1,599 +0,0 @@
1
-
2
-
3
-
4
-
5
- .form-renderer-container {
6
- padding: 2rem;
7
- }
8
-
9
- .form-renderer-container hr {
10
- border: none;
11
- height: 0.5px;
12
- margin: 0;
13
- }
14
-
15
- .form-renderer {
16
- display: -webkit-box;
17
- display: -ms-flexbox;
18
- display: flex;
19
- -webkit-box-orient: vertical;
20
- -webkit-box-direction: normal;
21
- -ms-flex-direction: column;
22
- flex-direction: column;
23
- gap: 1.5rem;
24
- /* stylelint-disable-next-line property-no-unknown */
25
- container-type: inline-size;
26
- }
27
-
28
- .form-renderer.twolayout {
29
- display: grid;
30
- grid-template-columns: repeat(2, 1fr);
31
- gap: 1.5rem;
32
- }
33
-
34
- .form-renderer.threelayout {
35
- display: grid;
36
- grid-template-columns: repeat(3, 1fr);
37
- gap: 1.5rem;
38
- }
39
-
40
- .form-renderer.fourlayout {
41
- display: grid;
42
- grid-template-columns: repeat(4, 1fr);
43
- gap: 1.5rem;
44
- }
45
-
46
- .form-renderer.twolayout > .form-group:has(.e-btn),
47
- .form-renderer.threelayout > .form-group:has(.e-btn),
48
- .form-renderer.fourlayout > .form-group:has(.e-btn) {
49
- -ms-flex-item-align: end;
50
- align-self: flex-end;
51
- }
52
-
53
- .form-renderer.twolayout > .form-group:has(.e-message),
54
- .form-renderer.threelayout > .form-group:has(.e-message),
55
- .form-renderer.fourlayout > .form-group:has(.e-message) {
56
- -ms-flex-item-align: end;
57
- align-self: flex-end;
58
- }
59
-
60
- .form-renderer.twolayout > .form-group:has(.e-checkbox),
61
- .form-renderer.threelayout > .form-group:has(.e-checkbox),
62
- .form-renderer.fourlayout > .form-group:has(.e-checkbox) {
63
- -ms-flex-item-align: end;
64
- align-self: flex-end;
65
- }
66
-
67
- .form-renderer.twolayout > .form-group:has(.e-switch),
68
- .form-renderer.threelayout > .form-group:has(.e-switch),
69
- .form-renderer.fourlayout > .form-group:has(.e-switch) {
70
- -ms-flex-item-align: end;
71
- align-self: flex-end;
72
- }
73
-
74
- .form-renderer.twolayout > .form-group:last-child:has(.form-submit-type):not(:has(.form-reset-type)),
75
- .form-renderer.threelayout > .form-group:last-child:has(.form-submit-type):not(:has(.form-reset-type)),
76
- .form-renderer.fourlayout > .form-group:last-child:has(.form-submit-type):not(:has(.form-reset-type)) {
77
- grid-column: 1/-1;
78
- }
79
-
80
- .form-renderer.twolayout > .form-group:nth-last-child(2):has(.form-reset-type),
81
- .form-renderer.twolayout > .form-group:nth-last-child(2):has(.form-reset-type) ~ .form-group:last-child:has(.form-submit-type),
82
- .form-renderer.threelayout > .form-group:nth-last-child(2):has(.form-reset-type),
83
- .form-renderer.threelayout > .form-group:nth-last-child(2):has(.form-reset-type) ~ .form-group:last-child:has(.form-submit-type),
84
- .form-renderer.fourlayout > .form-group:nth-last-child(2):has(.form-reset-type),
85
- .form-renderer.fourlayout > .form-group:nth-last-child(2):has(.form-reset-type) ~ .form-group:last-child:has(.form-submit-type) {
86
- grid-column: auto;
87
- }
88
-
89
- /* stylelint-disable-next-line at-rule-no-unknown */
90
- @container (max-width: 768px) {
91
- .form-renderer.fourlayout {
92
- grid-template-columns: repeat(2, 1fr);
93
- }
94
- .form-renderer.threelayout {
95
- grid-template-columns: repeat(2, 1fr);
96
- }
97
- }
98
- /* stylelint-disable-next-line at-rule-no-unknown */
99
- @container (max-width: 480px) {
100
- .form-renderer.twolayout,
101
- .form-renderer.threelayout,
102
- .form-renderer.fourlayout {
103
- grid-template-columns: 1fr;
104
- }
105
- }
106
- .e-form-renderer .form-group {
107
- display: -webkit-box;
108
- display: -ms-flexbox;
109
- display: flex;
110
- -webkit-box-orient: vertical;
111
- -webkit-box-direction: normal;
112
- -ms-flex-direction: column;
113
- flex-direction: column;
114
- gap: 0.5rem;
115
- }
116
-
117
- .e-form-renderer .field-wrapper {
118
- display: -webkit-box;
119
- display: -ms-flexbox;
120
- display: flex;
121
- width: 100%;
122
- }
123
-
124
- .e-form-renderer .field-wrapper.label-top {
125
- -webkit-box-orient: vertical;
126
- -webkit-box-direction: normal;
127
- -ms-flex-direction: column;
128
- flex-direction: column;
129
- gap: 0.5rem;
130
- }
131
-
132
- .e-form-renderer .field-wrapper.label-bottom {
133
- -webkit-box-orient: vertical;
134
- -webkit-box-direction: reverse;
135
- -ms-flex-direction: column-reverse;
136
- flex-direction: column-reverse;
137
- gap: 0.5rem;
138
- }
139
-
140
- .e-form-renderer .field-wrapper.label-left {
141
- -webkit-box-orient: horizontal;
142
- -webkit-box-direction: normal;
143
- -ms-flex-direction: row;
144
- flex-direction: row;
145
- -webkit-box-align: center;
146
- -ms-flex-align: center;
147
- align-items: center;
148
- gap: 1rem;
149
- }
150
-
151
- .e-form-renderer .field-wrapper.label-right {
152
- -webkit-box-orient: horizontal;
153
- -webkit-box-direction: reverse;
154
- -ms-flex-direction: row-reverse;
155
- flex-direction: row-reverse;
156
- -webkit-box-align: center;
157
- -ms-flex-align: center;
158
- align-items: center;
159
- gap: 1rem;
160
- -webkit-box-pack: end;
161
- -ms-flex-pack: end;
162
- justify-content: flex-end;
163
- }
164
-
165
- .e-form-renderer .field-wrapper.label-left .field-input,
166
- .e-form-renderer .field-wrapper.label-right .field-input {
167
- -webkit-box-flex: 1;
168
- -ms-flex: 1;
169
- flex: 1;
170
- min-width: 0;
171
- }
172
-
173
- .e-form-renderer .field-wrapper:has(.e-small) .field-label {
174
- font-size: 0.75rem;
175
- }
176
-
177
- .e-form-renderer .form-group .field-description {
178
- font-size: 0.75rem;
179
- }
180
-
181
- .e-form-renderer .form-group:has(.e-small) .field-description {
182
- font-size: 0.625rem;
183
- }
184
-
185
- .e-form-renderer .field-wrapper:has(.e-bigger) .field-label {
186
- font-size: 1rem;
187
- }
188
-
189
- .e-form-renderer .form-group:has(.e-bigger) .field-description {
190
- font-size: 0.875rem;
191
- }
192
-
193
- .e-form-renderer .field-label {
194
- font-size: 0.875rem;
195
- font-weight: 500;
196
- margin: 0;
197
- display: -webkit-box;
198
- display: -ms-flexbox;
199
- display: flex;
200
- -webkit-box-align: center;
201
- -ms-flex-align: center;
202
- align-items: center;
203
- gap: 4px;
204
- -ms-flex-negative: 0;
205
- flex-shrink: 0;
206
- }
207
-
208
- .e-form-renderer .field-label .required-asterisk {
209
- margin-left: 2px;
210
- }
211
-
212
- .e-form-renderer .field-label .tooltip-icon {
213
- cursor: help;
214
- font-size: 0.875rem;
215
- }
216
-
217
- .e-form-renderer .field-input {
218
- width: 100%;
219
- }
220
-
221
- .e-form-renderer .field-input .e-image-editor {
222
- min-height: 250px;
223
- }
224
-
225
- .e-form-renderer .field-input .e-switch-wrapper,
226
- .e-form-renderer .field-input .e-checkbox-wrapper {
227
- margin: 5px 0;
228
- }
229
-
230
- .e-form-renderer .field-error {
231
- font-size: 0.75rem;
232
- margin-top: 0.25rem;
233
- display: block;
234
- }
235
-
236
- .form-renderer-container .e-radio-group {
237
- display: -webkit-box;
238
- display: -ms-flexbox;
239
- display: flex;
240
- -webkit-box-orient: vertical;
241
- -webkit-box-direction: normal;
242
- -ms-flex-direction: column;
243
- flex-direction: column;
244
- }
245
-
246
- .form-renderer-container .e-radio-group .e-radio + label {
247
- margin-left: 0.5rem;
248
- }
249
-
250
- .e-form-renderer .form-panel-renderer {
251
- border: none;
252
- border-radius: 8px;
253
- padding: 0;
254
- }
255
-
256
- .e-form-renderer .form-panel-renderer:has(.panel-legend) {
257
- padding: 1.5rem;
258
- }
259
-
260
- .e-form-renderer .form-panel-renderer legend {
261
- font-size: 1.5rem;
262
- font-weight: 600;
263
- padding-bottom: 1.5rem;
264
- }
265
-
266
- .e-form-renderer .form-panel-renderer .panel-legend {
267
- font-size: 1.5rem;
268
- font-weight: 600;
269
- padding: 0 0.5rem;
270
- margin-bottom: 0;
271
- border-bottom: none;
272
- width: unset;
273
- }
274
-
275
- .e-form-renderer .panel-content {
276
- display: -webkit-box;
277
- display: -ms-flexbox;
278
- display: flex;
279
- -webkit-box-orient: vertical;
280
- -webkit-box-direction: normal;
281
- -ms-flex-direction: column;
282
- flex-direction: column;
283
- gap: 1rem;
284
- width: 100%;
285
- }
286
-
287
- .e-form-renderer .card-content {
288
- display: -webkit-box;
289
- display: -ms-flexbox;
290
- display: flex;
291
- -webkit-box-orient: vertical;
292
- -webkit-box-direction: normal;
293
- -ms-flex-direction: column;
294
- flex-direction: column;
295
- gap: 1rem;
296
- }
297
-
298
- .e-form-renderer .form-table-renderer {
299
- width: 100%;
300
- border-radius: 8px;
301
- overflow: hidden;
302
- }
303
-
304
- .e-form-renderer .form-table-renderer {
305
- display: table;
306
- width: 100%;
307
- border-collapse: separate;
308
- border-spacing: 0;
309
- overflow-x: auto;
310
- overflow-y: hidden;
311
- }
312
-
313
- .e-form-renderer .form-table-renderer .e-form-table-row {
314
- display: table-row;
315
- background: transparent;
316
- }
317
-
318
- .e-form-renderer .form-table-renderer .e-form-table-cell {
319
- display: table-cell;
320
- padding: 12px;
321
- vertical-align: top;
322
- }
323
-
324
- .e-form-renderer .e-form-table-cell:last-child {
325
- border-right: none;
326
- }
327
-
328
- .e-form-renderer .form-table-renderer .e-form-table-row:last-child .e-form-table-cell {
329
- border-bottom: none;
330
- }
331
-
332
- .e-form-renderer .e-form-table-cell > .form-table-renderer,
333
- .e-form-renderer .e-form-table-cell > .form-tabs-renderer,
334
- .e-form-renderer .e-form-table-cell > .form-card-renderer,
335
- .e-form-renderer .e-form-table-cell > .form-panel-renderer,
336
- .e-form-renderer .e-form-table-cell > .form-group {
337
- margin-bottom: 1.5rem;
338
- }
339
-
340
- .e-form-renderer .e-form-table-cell > .form-table-renderer:last-child,
341
- .e-form-renderer .e-form-table-cell > .form-tabs-renderer:last-child,
342
- .e-form-renderer .e-form-table-cell > .form-card-renderer:last-child,
343
- .e-form-renderer .e-form-table-cell > .form-panel-renderer:last-child,
344
- .e-form-renderer .e-form-table-cell > .form-group:last-child {
345
- margin-bottom: 0;
346
- }
347
-
348
- .e-form-renderer .form-table-renderer .col,
349
- .e-form-renderer .form-table-renderer [class^=col-] {
350
- min-height: 100%;
351
- vertical-align: top;
352
- }
353
-
354
- .e-form-renderer .form-table-renderer .col {
355
- width: auto;
356
- }
357
-
358
- .e-form-renderer .form-table-renderer .col-1 {
359
- width: 8.33333333%;
360
- }
361
-
362
- .e-form-renderer .form-table-renderer .col-2 {
363
- width: 16.66666667%;
364
- }
365
-
366
- .e-form-renderer .form-table-renderer .col-3 {
367
- width: 25%;
368
- }
369
-
370
- .e-form-renderer .form-table-renderer .col-4 {
371
- width: 33.33333333%;
372
- }
373
-
374
- .e-form-renderer .form-table-renderer .col-5 {
375
- width: 41.66666667%;
376
- }
377
-
378
- .e-form-renderer .form-table-renderer .col-6 {
379
- width: 50%;
380
- }
381
-
382
- .e-form-renderer .form-table-renderer .col-7 {
383
- width: 58.33333333%;
384
- }
385
-
386
- .e-form-renderer .form-table-renderer .col-8 {
387
- width: 66.66666667%;
388
- }
389
-
390
- .e-form-renderer .form-table-renderer .col-9 {
391
- width: 75%;
392
- }
393
-
394
- .e-form-renderer .form-table-renderer .col-10 {
395
- width: 83.33333333%;
396
- }
397
-
398
- .e-form-renderer .form-table-renderer .col-11 {
399
- width: 91.66666667%;
400
- }
401
-
402
- .e-form-renderer .form-table-renderer .col-12 {
403
- width: auto;
404
- }
405
-
406
- /* Tabs Layout */
407
- .e-form-renderer .form-tabs-renderer {
408
- width: 100%;
409
- }
410
-
411
- .e-form-renderer .tab-content-renderer {
412
- padding: 10px;
413
- display: -webkit-box;
414
- display: -ms-flexbox;
415
- display: flex;
416
- -webkit-box-orient: vertical;
417
- -webkit-box-direction: normal;
418
- -ms-flex-direction: column;
419
- flex-direction: column;
420
- gap: 1rem;
421
- }
422
-
423
- .e-form-renderer .form-submit-button {
424
- margin-top: 1.5rem;
425
- -ms-flex-item-align: start;
426
- align-self: flex-start;
427
- }
428
-
429
- .e-form-renderer .field-input .e-input-group,
430
- .e-form-renderer .field-input .e-control-wrapper {
431
- width: 100%;
432
- }
433
-
434
- .e-form-renderer .field-input .e-float-input {
435
- width: 100%;
436
- }
437
-
438
- .e-form-renderer .unsupported-component {
439
- padding: 1rem;
440
- border-radius: 4px;
441
- font-size: 0.875rem;
442
- }
443
-
444
- .form-renderer-container .e-tooltip.e-msg-icon::before {
445
- font-family: "e-icons";
446
- font-size: 16px;
447
- height: 16px;
448
- margin: 3px 4px;
449
- display: -webkit-box;
450
- display: -ms-flexbox;
451
- display: flex;
452
- line-height: 16px;
453
- }
454
-
455
- .e-form-renderer .form-title h1 {
456
- margin-top: 0;
457
- }
458
-
459
- .e-form-renderer .form-title {
460
- text-align: center;
461
- }
462
-
463
- .form-renderer-container .e-card .e-card-content {
464
- padding: 12px 18px;
465
- }
466
-
467
- /* Responsive */
468
- /* stylelint-disable-next-line at-rule-no-unknown */
469
- @container (max-width: 480px) {
470
- .e-form-renderer .form-table-renderer .table-grid {
471
- display: -webkit-box;
472
- display: -ms-flexbox;
473
- display: flex;
474
- -webkit-box-orient: vertical;
475
- -webkit-box-direction: normal;
476
- -ms-flex-direction: column;
477
- flex-direction: column;
478
- border-spacing: 0;
479
- gap: 0.75rem;
480
- }
481
- .e-form-renderer .form-table-renderer .row {
482
- display: -webkit-box;
483
- display: -ms-flexbox;
484
- display: flex;
485
- -ms-flex-wrap: wrap;
486
- flex-wrap: wrap;
487
- gap: 0.75rem;
488
- width: 100%;
489
- }
490
- .e-form-renderer .form-table-renderer .e-form-table-cell {
491
- display: block;
492
- -webkit-box-flex: 1;
493
- -ms-flex: 1 1 auto;
494
- flex: 1 1 auto;
495
- padding: 12px;
496
- }
497
- /* Override column width classes on mobile - let content flow naturally */
498
- .e-form-renderer .form-table-renderer .col,
499
- .e-form-renderer .form-table-renderer [class^=col-] {
500
- /* stylelint-disable-next-line declaration-no-important */
501
- width: auto !important;
502
- min-width: 250px;
503
- -webkit-box-flex: 1;
504
- -ms-flex: 1 1 auto;
505
- flex: 1 1 auto;
506
- }
507
- .e-form-renderer .table-border .e-form-table-cell {
508
- border-right: none;
509
- border-radius: 4px;
510
- }
511
- .e-form-renderer .form-table-renderer .row:last-child .e-form-table-cell {
512
- border-bottom: none;
513
- }
514
- }
515
- /* stylelint-disable-next-line at-rule-no-unknown */
516
- @container (max-width: 480px) {
517
- .e-form-renderer .form-table-renderer .e-form-table-row {
518
- /* stylelint-disable-next-line declaration-no-important */
519
- -webkit-box-orient: vertical !important;
520
- -webkit-box-direction: normal !important;
521
- -ms-flex-direction: column !important;
522
- flex-direction: column !important;
523
- /* stylelint-disable-next-line declaration-no-important */
524
- gap: 1rem !important;
525
- }
526
- .e-form-renderer .form-table-renderer .e-form-table-cell {
527
- /* stylelint-disable-next-line declaration-no-important */
528
- width: 100% !important;
529
- }
530
- .form-renderer-container {
531
- padding: 1rem;
532
- }
533
- }
534
- /* stylelint-disable-next-line at-rule-no-unknown */
535
- @container (max-width: 400px) {
536
- .e-form-renderer .field-wrapper.label-left,
537
- .e-form-renderer .field-wrapper.label-right {
538
- -webkit-box-orient: vertical;
539
- -webkit-box-direction: normal;
540
- -ms-flex-direction: column;
541
- flex-direction: column;
542
- -webkit-box-align: stretch;
543
- -ms-flex-align: stretch;
544
- align-items: stretch;
545
- }
546
- .e-form-renderer .field-wrapper.label-left .field-input,
547
- .e-form-renderer .field-wrapper.label-right .field-input {
548
- width: 100%;
549
- }
550
- }
551
- .form-renderer-container hr {
552
- background-color: rgb(255, 255, 255);
553
- }
554
-
555
- .e-form-renderer .field-label {
556
- color: var(--color-sf-text-primary);
557
- font-family: "Inter";
558
- }
559
-
560
- .e-form-renderer .form-panel-renderer .panel-legend {
561
- color: var(--color-sf-text-primary);
562
- font-family: "Inter";
563
- }
564
-
565
- .e-form-renderer .field-label .required-asterisk {
566
- color: var(--color-sf-utility-danger);
567
- }
568
-
569
- .e-form-renderer .field-label .tooltip-icon {
570
- color: var(--color-sf-fg-secondary);
571
- }
572
-
573
- .e-form-renderer .field-error {
574
- color: var(--color-sf-utility-danger);
575
- }
576
-
577
- .e-form-renderer .form-panel-renderer:has(.panel-legend) {
578
- border: 1px solid rgb(255, 255, 255);
579
- font-family: "Inter";
580
- }
581
-
582
- .e-form-renderer .form-table-renderer.table-border {
583
- border: 1px solid rgb(255, 255, 255);
584
- }
585
-
586
- .e-form-renderer .table-border .e-form-table-cell {
587
- border-bottom: 1px solid rgb(255, 255, 255);
588
- border-right: 1px solid rgb(255, 255, 255);
589
- }
590
-
591
- /* stylelint-disable-next-line at-rule-no-unknown */
592
- @container (max-width: 480px) {
593
- .e-form-renderer .table-border .e-form-table-cell {
594
- border-bottom: 1px solid rgb(255, 255, 255);
595
- }
596
- .e-form-renderer .form-table-renderer .e-form-table-cell:last-child {
597
- border-bottom: 1px solid rgb(255, 255, 255);
598
- }
599
- }
package/styles/bds.scss DELETED
@@ -1,2 +0,0 @@
1
- @use 'form-renderer/bds-definition' as *;
2
- @use 'form-renderer/all' as *;