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