@zohodesk/components 1.6.20 → 1.6.21

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 (116) hide show
  1. package/README.md +6 -0
  2. package/es/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  3. package/es/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  4. package/es/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  5. package/es/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  6. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +98 -121
  7. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +45 -45
  8. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +24 -24
  9. package/es/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  10. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +87 -87
  11. package/es/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  12. package/es/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +5 -5
  13. package/es/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +6 -6
  14. package/es/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  15. package/es/DateTime/__tests__/__snapshots__/Time.spec.js.snap +25 -25
  16. package/es/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  17. package/es/Layout/Box.js +1 -115
  18. package/es/Layout/Container.js +1 -132
  19. package/es/Layout/props/defaultProps.js +1 -16
  20. package/es/Layout/props/propTypes.js +1 -46
  21. package/es/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  22. package/es/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  23. package/es/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  24. package/es/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -69
  25. package/es/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  26. package/es/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +69 -69
  27. package/es/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +3 -3
  28. package/es/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  29. package/es/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  30. package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +31 -31
  31. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +6 -6
  32. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  33. package/es/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  34. package/es/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  35. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +130 -130
  36. package/es/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  37. package/es/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +6 -6
  38. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +771 -749
  39. package/es/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  40. package/es/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +9 -9
  41. package/es/Switch/__tests__/__snapshots__/Switch.spec.js.snap +44 -44
  42. package/es/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  43. package/es/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  44. package/es/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  45. package/es/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +36 -36
  46. package/es/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  47. package/es/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  48. package/es/Tag/__tests__/__snapshots__/Tag.spec.js.snap +46 -46
  49. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +164 -164
  50. package/es/css.js +0 -1
  51. package/es/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +10 -10
  52. package/es/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  53. package/lib/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  54. package/lib/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  55. package/lib/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  56. package/lib/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  57. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +98 -121
  58. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +45 -45
  59. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +24 -24
  60. package/lib/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  61. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +87 -87
  62. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  63. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +5 -5
  64. package/lib/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +6 -6
  65. package/lib/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  66. package/lib/DateTime/__tests__/__snapshots__/Time.spec.js.snap +25 -25
  67. package/lib/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  68. package/lib/Layout/Box.js +7 -120
  69. package/lib/Layout/Container.js +7 -137
  70. package/lib/Layout/props/defaultProps.js +14 -19
  71. package/lib/Layout/props/propTypes.js +13 -52
  72. package/lib/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  73. package/lib/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  74. package/lib/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  75. package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -69
  76. package/lib/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  77. package/lib/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +69 -69
  78. package/lib/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +3 -3
  79. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  80. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  81. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +31 -31
  82. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +6 -6
  83. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  84. package/lib/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  85. package/lib/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  86. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +130 -130
  87. package/lib/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  88. package/lib/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +6 -6
  89. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +771 -749
  90. package/lib/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  91. package/lib/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +9 -9
  92. package/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap +44 -44
  93. package/lib/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  94. package/lib/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  95. package/lib/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  96. package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +36 -36
  97. package/lib/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  98. package/lib/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  99. package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap +46 -46
  100. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +164 -164
  101. package/lib/css.js +0 -2
  102. package/lib/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +10 -10
  103. package/lib/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  104. package/package.json +5 -5
  105. package/es/Layout/Layout.module.css +0 -336
  106. package/es/Layout/__tests__/Box.spec.js +0 -11
  107. package/es/Layout/__tests__/Container.spec.js +0 -11
  108. package/es/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  109. package/es/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  110. package/es/Layout/utils.js +0 -29
  111. package/lib/Layout/Layout.module.css +0 -336
  112. package/lib/Layout/__tests__/Box.spec.js +0 -18
  113. package/lib/Layout/__tests__/Container.spec.js +0 -18
  114. package/lib/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  115. package/lib/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  116. package/lib/Layout/utils.js +0 -59
package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap CHANGED
@@ -15,13 +15,13 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
15
15
  data-test-id="dateTime_Calendar"
16
16
  >
17
17
  <div
18
- class="header flex cover rowdir both"
18
+ class="flex fullSize row alignItems_center justifyContent_center header"
19
19
  data-id="containerComponent"
20
20
  data-selector-id="container"
21
21
  data-test-id="containerComponent"
22
22
  >
23
23
  <div
24
- class="dateText shrinkOff"
24
+ class="noShrink dateText"
25
25
  data-id="selectYear"
26
26
  data-selector-id="box"
27
27
  data-test-id="selectYear"
@@ -45,14 +45,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
45
45
  </span>
46
46
  </div>
47
47
  <div
48
- class="grow basis shrinkOff"
48
+ class="flexible basis_zero noShrink"
49
49
  data-id="boxComponent"
50
50
  data-selector-id="box"
51
51
  data-test-id="boxComponent"
52
52
  />
53
53
  <div
54
54
  aria-label="prevMonth"
55
- class="thArrow grid shrinkOff"
55
+ class="noShrink thArrow grid"
56
56
  data-id="prevMonth"
57
57
  data-selector-id="box"
58
58
  data-test-id="prevMonth"
@@ -69,7 +69,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
69
69
  </div>
70
70
  <div
71
71
  aria-label="nextMonth"
72
- class="thArrow grid navigation shrinkOff"
72
+ class="noShrink thArrow grid navigation"
73
73
  data-id="nextMonth"
74
74
  data-selector-id="box"
75
75
  data-test-id="nextMonth"
@@ -89,14 +89,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
89
89
  class="subContainer"
90
90
  >
91
91
  <div
92
- class="days flex cover rowdir"
92
+ class="flex fullSize row days"
93
93
  data-id="containerComponent"
94
94
  data-selector-id="container"
95
95
  data-test-id="containerComponent"
96
96
  >
97
97
  <div
98
98
  aria-label="Sunday"
99
- class="daysStr grid holiday shrinkOff"
99
+ class="noShrink daysStr grid holiday"
100
100
  data-id="boxComponent"
101
101
  data-selector-id="box"
102
102
  data-test-id="boxComponent"
@@ -106,7 +106,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
106
106
  </div>
107
107
  <div
108
108
  aria-label="Monday"
109
- class="daysStr grid shrinkOff"
109
+ class="noShrink daysStr grid"
110
110
  data-id="boxComponent"
111
111
  data-selector-id="box"
112
112
  data-test-id="boxComponent"
@@ -116,7 +116,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
116
116
  </div>
117
117
  <div
118
118
  aria-label="Tuesday"
119
- class="daysStr grid shrinkOff"
119
+ class="noShrink daysStr grid"
120
120
  data-id="boxComponent"
121
121
  data-selector-id="box"
122
122
  data-test-id="boxComponent"
@@ -126,7 +126,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
126
126
  </div>
127
127
  <div
128
128
  aria-label="Wednesday"
129
- class="daysStr grid shrinkOff"
129
+ class="noShrink daysStr grid"
130
130
  data-id="boxComponent"
131
131
  data-selector-id="box"
132
132
  data-test-id="boxComponent"
@@ -136,7 +136,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
136
136
  </div>
137
137
  <div
138
138
  aria-label="Thursday"
139
- class="daysStr grid shrinkOff"
139
+ class="noShrink daysStr grid"
140
140
  data-id="boxComponent"
141
141
  data-selector-id="box"
142
142
  data-test-id="boxComponent"
@@ -146,7 +146,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
146
146
  </div>
147
147
  <div
148
148
  aria-label="Friday"
149
- class="daysStr grid shrinkOff"
149
+ class="noShrink daysStr grid"
150
150
  data-id="boxComponent"
151
151
  data-selector-id="box"
152
152
  data-test-id="boxComponent"
@@ -156,7 +156,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
156
156
  </div>
157
157
  <div
158
158
  aria-label="Saturday"
159
- class="daysStr grid shrinkOff"
159
+ class="noShrink daysStr grid"
160
160
  data-id="boxComponent"
161
161
  data-selector-id="box"
162
162
  data-test-id="boxComponent"
@@ -171,14 +171,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
171
171
  data-test-id="dateTime_dateContainer"
172
172
  >
173
173
  <div
174
- class="dateRow flex rowdir"
174
+ class="flex row dateRow"
175
175
  data-id="containerComponent"
176
176
  data-selector-id="container"
177
177
  data-test-id="containerComponent"
178
178
  >
179
179
  <div
180
180
  aria-label="25"
181
- class="datesStr grid holiday invalidDate shrinkOff"
181
+ class="noShrink datesStr grid holiday invalidDate"
182
182
  data-id="dateTime_invalidDate"
183
183
  data-selector-id="box"
184
184
  data-test-id="dateTime_invalidDate"
@@ -187,7 +187,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
187
187
  </div>
188
188
  <div
189
189
  aria-label="26"
190
- class="datesStr grid invalidDate shrinkOff"
190
+ class="noShrink datesStr grid invalidDate"
191
191
  data-id="dateTime_invalidDate"
192
192
  data-selector-id="box"
193
193
  data-test-id="dateTime_invalidDate"
@@ -196,7 +196,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
196
196
  </div>
197
197
  <div
198
198
  aria-label="27"
199
- class="datesStr grid invalidDate shrinkOff"
199
+ class="noShrink datesStr grid invalidDate"
200
200
  data-id="dateTime_invalidDate"
201
201
  data-selector-id="box"
202
202
  data-test-id="dateTime_invalidDate"
@@ -205,7 +205,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
205
205
  </div>
206
206
  <div
207
207
  aria-label="28"
208
- class="datesStr grid invalidDate shrinkOff"
208
+ class="noShrink datesStr grid invalidDate"
209
209
  data-id="dateTime_invalidDate"
210
210
  data-selector-id="box"
211
211
  data-test-id="dateTime_invalidDate"
@@ -214,7 +214,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
214
214
  </div>
215
215
  <div
216
216
  aria-label="29"
217
- class="datesStr grid invalidDate shrinkOff"
217
+ class="noShrink datesStr grid invalidDate"
218
218
  data-id="dateTime_invalidDate"
219
219
  data-selector-id="box"
220
220
  data-test-id="dateTime_invalidDate"
@@ -223,7 +223,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
223
223
  </div>
224
224
  <div
225
225
  aria-label="30"
226
- class="datesStr grid invalidDate shrinkOff"
226
+ class="noShrink datesStr grid invalidDate"
227
227
  data-id="dateTime_invalidDate"
228
228
  data-selector-id="box"
229
229
  data-test-id="dateTime_invalidDate"
@@ -232,7 +232,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
232
232
  </div>
233
233
  <div
234
234
  aria-label="1"
235
- class="datesStr grid shrinkOff"
235
+ class="noShrink datesStr grid"
236
236
  data-id="dateTime_date"
237
237
  data-selector-id="box"
238
238
  data-test-id="dateTime_date"
@@ -241,14 +241,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
241
241
  </div>
242
242
  </div>
243
243
  <div
244
- class="dateRow flex rowdir"
244
+ class="flex row dateRow"
245
245
  data-id="containerComponent"
246
246
  data-selector-id="container"
247
247
  data-test-id="containerComponent"
248
248
  >
249
249
  <div
250
250
  aria-label="2"
251
- class="datesStr grid holiday shrinkOff"
251
+ class="noShrink datesStr grid holiday"
252
252
  data-id="dateTime_date"
253
253
  data-selector-id="box"
254
254
  data-test-id="dateTime_date"
@@ -257,7 +257,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
257
257
  </div>
258
258
  <div
259
259
  aria-label="3"
260
- class="datesStr grid shrinkOff"
260
+ class="noShrink datesStr grid"
261
261
  data-id="dateTime_date"
262
262
  data-selector-id="box"
263
263
  data-test-id="dateTime_date"
@@ -266,7 +266,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
266
266
  </div>
267
267
  <div
268
268
  aria-label="4"
269
- class="datesStr grid shrinkOff"
269
+ class="noShrink datesStr grid"
270
270
  data-id="dateTime_date"
271
271
  data-selector-id="box"
272
272
  data-test-id="dateTime_date"
@@ -275,7 +275,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
275
275
  </div>
276
276
  <div
277
277
  aria-label="5"
278
- class="datesStr grid shrinkOff"
278
+ class="noShrink datesStr grid"
279
279
  data-id="dateTime_date"
280
280
  data-selector-id="box"
281
281
  data-test-id="dateTime_date"
@@ -284,7 +284,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
284
284
  </div>
285
285
  <div
286
286
  aria-label="6"
287
- class="datesStr grid shrinkOff"
287
+ class="noShrink datesStr grid"
288
288
  data-id="dateTime_date"
289
289
  data-selector-id="box"
290
290
  data-test-id="dateTime_date"
@@ -293,7 +293,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
293
293
  </div>
294
294
  <div
295
295
  aria-label="7"
296
- class="datesStr grid shrinkOff"
296
+ class="noShrink datesStr grid"
297
297
  data-id="dateTime_date"
298
298
  data-selector-id="box"
299
299
  data-test-id="dateTime_date"
@@ -302,7 +302,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
302
302
  </div>
303
303
  <div
304
304
  aria-label="8"
305
- class="datesStr grid shrinkOff"
305
+ class="noShrink datesStr grid"
306
306
  data-id="dateTime_date"
307
307
  data-selector-id="box"
308
308
  data-test-id="dateTime_date"
@@ -311,14 +311,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
311
311
  </div>
312
312
  </div>
313
313
  <div
314
- class="dateRow flex rowdir"
314
+ class="flex row dateRow"
315
315
  data-id="containerComponent"
316
316
  data-selector-id="container"
317
317
  data-test-id="containerComponent"
318
318
  >
319
319
  <div
320
320
  aria-label="9"
321
- class="datesStr grid holiday shrinkOff"
321
+ class="noShrink datesStr grid holiday"
322
322
  data-id="dateTime_date"
323
323
  data-selector-id="box"
324
324
  data-test-id="dateTime_date"
@@ -327,7 +327,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
327
327
  </div>
328
328
  <div
329
329
  aria-label="10"
330
- class="datesStr grid shrinkOff"
330
+ class="noShrink datesStr grid"
331
331
  data-id="dateTime_date"
332
332
  data-selector-id="box"
333
333
  data-test-id="dateTime_date"
@@ -336,7 +336,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
336
336
  </div>
337
337
  <div
338
338
  aria-label="11"
339
- class="datesStr grid shrinkOff"
339
+ class="noShrink datesStr grid"
340
340
  data-id="dateTime_date"
341
341
  data-selector-id="box"
342
342
  data-test-id="dateTime_date"
@@ -345,7 +345,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
345
345
  </div>
346
346
  <div
347
347
  aria-label="12"
348
- class="datesStr grid shrinkOff"
348
+ class="noShrink datesStr grid"
349
349
  data-id="dateTime_date"
350
350
  data-selector-id="box"
351
351
  data-test-id="dateTime_date"
@@ -354,7 +354,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
354
354
  </div>
355
355
  <div
356
356
  aria-label="13"
357
- class="datesStr grid shrinkOff"
357
+ class="noShrink datesStr grid"
358
358
  data-id="dateTime_date"
359
359
  data-selector-id="box"
360
360
  data-test-id="dateTime_date"
@@ -363,7 +363,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
363
363
  </div>
364
364
  <div
365
365
  aria-label="14"
366
- class="datesStr grid shrinkOff"
366
+ class="noShrink datesStr grid"
367
367
  data-id="dateTime_date"
368
368
  data-selector-id="box"
369
369
  data-test-id="dateTime_date"
@@ -372,7 +372,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
372
372
  </div>
373
373
  <div
374
374
  aria-label="15"
375
- class="datesStr grid shrinkOff"
375
+ class="noShrink datesStr grid"
376
376
  data-id="dateTime_date"
377
377
  data-selector-id="box"
378
378
  data-test-id="dateTime_date"
@@ -381,14 +381,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
381
381
  </div>
382
382
  </div>
383
383
  <div
384
- class="dateRow flex rowdir"
384
+ class="flex row dateRow"
385
385
  data-id="containerComponent"
386
386
  data-selector-id="container"
387
387
  data-test-id="containerComponent"
388
388
  >
389
389
  <div
390
390
  aria-label="16"
391
- class="datesStr grid holiday shrinkOff"
391
+ class="noShrink datesStr grid holiday"
392
392
  data-id="dateTime_date"
393
393
  data-selector-id="box"
394
394
  data-test-id="dateTime_date"
@@ -397,7 +397,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
397
397
  </div>
398
398
  <div
399
399
  aria-label="17"
400
- class="datesStr grid shrinkOff"
400
+ class="noShrink datesStr grid"
401
401
  data-id="dateTime_date"
402
402
  data-selector-id="box"
403
403
  data-test-id="dateTime_date"
@@ -406,7 +406,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
406
406
  </div>
407
407
  <div
408
408
  aria-label="18"
409
- class="datesStr grid shrinkOff"
409
+ class="noShrink datesStr grid"
410
410
  data-id="dateTime_date"
411
411
  data-selector-id="box"
412
412
  data-test-id="dateTime_date"
@@ -415,7 +415,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
415
415
  </div>
416
416
  <div
417
417
  aria-label="19"
418
- class="datesStr grid shrinkOff"
418
+ class="noShrink datesStr grid"
419
419
  data-id="dateTime_date"
420
420
  data-selector-id="box"
421
421
  data-test-id="dateTime_date"
@@ -424,7 +424,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
424
424
  </div>
425
425
  <div
426
426
  aria-label="20"
427
- class="datesStr grid shrinkOff"
427
+ class="noShrink datesStr grid"
428
428
  data-id="dateTime_date"
429
429
  data-selector-id="box"
430
430
  data-test-id="dateTime_date"
@@ -433,7 +433,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
433
433
  </div>
434
434
  <div
435
435
  aria-label="21"
436
- class="datesStr grid shrinkOff"
436
+ class="noShrink datesStr grid"
437
437
  data-id="dateTime_date"
438
438
  data-selector-id="box"
439
439
  data-test-id="dateTime_date"
@@ -442,7 +442,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
442
442
  </div>
443
443
  <div
444
444
  aria-label="22"
445
- class="datesStr grid shrinkOff"
445
+ class="noShrink datesStr grid"
446
446
  data-id="dateTime_date"
447
447
  data-selector-id="box"
448
448
  data-test-id="dateTime_date"
@@ -451,14 +451,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
451
451
  </div>
452
452
  </div>
453
453
  <div
454
- class="dateRow flex rowdir"
454
+ class="flex row dateRow"
455
455
  data-id="containerComponent"
456
456
  data-selector-id="container"
457
457
  data-test-id="containerComponent"
458
458
  >
459
459
  <div
460
460
  aria-label="23"
461
- class="datesStr grid holiday shrinkOff"
461
+ class="noShrink datesStr grid holiday"
462
462
  data-id="dateTime_date"
463
463
  data-selector-id="box"
464
464
  data-test-id="dateTime_date"
@@ -467,7 +467,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
467
467
  </div>
468
468
  <div
469
469
  aria-label="24"
470
- class="datesStr grid shrinkOff"
470
+ class="noShrink datesStr grid"
471
471
  data-id="dateTime_date"
472
472
  data-selector-id="box"
473
473
  data-test-id="dateTime_date"
@@ -476,7 +476,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
476
476
  </div>
477
477
  <div
478
478
  aria-label="25"
479
- class="datesStr grid shrinkOff"
479
+ class="noShrink datesStr grid"
480
480
  data-id="dateTime_date"
481
481
  data-selector-id="box"
482
482
  data-test-id="dateTime_date"
@@ -485,7 +485,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
485
485
  </div>
486
486
  <div
487
487
  aria-label="26"
488
- class="datesStr grid shrinkOff"
488
+ class="noShrink datesStr grid"
489
489
  data-id="dateTime_date"
490
490
  data-selector-id="box"
491
491
  data-test-id="dateTime_date"
@@ -494,7 +494,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
494
494
  </div>
495
495
  <div
496
496
  aria-label="27"
497
- class="datesStr grid shrinkOff"
497
+ class="noShrink datesStr grid"
498
498
  data-id="dateTime_date"
499
499
  data-selector-id="box"
500
500
  data-test-id="dateTime_date"
@@ -503,7 +503,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
503
503
  </div>
504
504
  <div
505
505
  aria-label="28"
506
- class="datesStr grid shrinkOff"
506
+ class="noShrink datesStr grid"
507
507
  data-id="dateTime_date"
508
508
  data-selector-id="box"
509
509
  data-test-id="dateTime_date"
@@ -512,7 +512,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
512
512
  </div>
513
513
  <div
514
514
  aria-label="29"
515
- class="datesStr grid active shrinkOff"
515
+ class="noShrink datesStr grid active"
516
516
  data-id="dateTime_dateSelected"
517
517
  data-selector-id="box"
518
518
  data-test-id="dateTime_dateSelected"
@@ -521,14 +521,14 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
521
521
  </div>
522
522
  </div>
523
523
  <div
524
- class="dateRow flex rowdir"
524
+ class="flex row dateRow"
525
525
  data-id="containerComponent"
526
526
  data-selector-id="container"
527
527
  data-test-id="containerComponent"
528
528
  >
529
529
  <div
530
530
  aria-label="30"
531
- class="datesStr grid holiday shrinkOff"
531
+ class="noShrink datesStr grid holiday"
532
532
  data-id="dateTime_date"
533
533
  data-selector-id="box"
534
534
  data-test-id="dateTime_date"
@@ -537,7 +537,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
537
537
  </div>
538
538
  <div
539
539
  aria-label="31"
540
- class="datesStr grid shrinkOff"
540
+ class="noShrink datesStr grid"
541
541
  data-id="dateTime_date"
542
542
  data-selector-id="box"
543
543
  data-test-id="dateTime_date"
@@ -546,7 +546,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
546
546
  </div>
547
547
  <div
548
548
  aria-label="1"
549
- class="datesStr grid invalidDate shrinkOff"
549
+ class="noShrink datesStr grid invalidDate"
550
550
  data-id="dateTime_invalidDate"
551
551
  data-selector-id="box"
552
552
  data-test-id="dateTime_invalidDate"
@@ -555,7 +555,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
555
555
  </div>
556
556
  <div
557
557
  aria-label="2"
558
- class="datesStr grid invalidDate shrinkOff"
558
+ class="noShrink datesStr grid invalidDate"
559
559
  data-id="dateTime_invalidDate"
560
560
  data-selector-id="box"
561
561
  data-test-id="dateTime_invalidDate"
@@ -564,7 +564,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
564
564
  </div>
565
565
  <div
566
566
  aria-label="3"
567
- class="datesStr grid invalidDate shrinkOff"
567
+ class="noShrink datesStr grid invalidDate"
568
568
  data-id="dateTime_invalidDate"
569
569
  data-selector-id="box"
570
570
  data-test-id="dateTime_invalidDate"
@@ -573,7 +573,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
573
573
  </div>
574
574
  <div
575
575
  aria-label="4"
576
- class="datesStr grid invalidDate shrinkOff"
576
+ class="noShrink datesStr grid invalidDate"
577
577
  data-id="dateTime_invalidDate"
578
578
  data-selector-id="box"
579
579
  data-test-id="dateTime_invalidDate"
@@ -582,7 +582,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
582
582
  </div>
583
583
  <div
584
584
  aria-label="5"
585
- class="datesStr grid invalidDate shrinkOff"
585
+ class="noShrink datesStr grid invalidDate"
586
586
  data-id="dateTime_invalidDate"
587
587
  data-selector-id="box"
588
588
  data-test-id="dateTime_invalidDate"
@@ -597,13 +597,13 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
597
597
  Time
598
598
  </span>
599
599
  <div
600
- class="timesection flex rowdir vCenter"
600
+ class="flex row alignItems_center timesection"
601
601
  data-id="dateTime_timeContainer"
602
602
  data-selector-id="container"
603
603
  data-test-id="dateTime_timeContainer"
604
604
  >
605
605
  <div
606
- class="dropDownContainer grow basis shrinkOff"
606
+ class="flexible basis_zero noShrink dropDownContainer"
607
607
  data-id="boxComponent"
608
608
  data-selector-id="box"
609
609
  data-test-id="boxComponent"
@@ -618,11 +618,11 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
618
618
  data-test-id="hourField"
619
619
  >
620
620
  <div
621
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
621
+ class="flex row varClass customContainer border_bottom effect borderColor_default hasBorder container input"
622
622
  data-selector-id="textBoxIcon"
623
623
  >
624
624
  <div
625
- class="grow basis shrinkOff"
625
+ class="flexible basis_zero noShrink"
626
626
  data-id="boxComponent"
627
627
  data-selector-id="box"
628
628
  data-test-id="boxComponent"
@@ -650,32 +650,32 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
650
650
  />
651
651
  </div>
652
652
  <div
653
- class="iconContainer shrinkOff"
653
+ class="noShrink iconContainer"
654
654
  data-id="boxComponent"
655
655
  data-selector-id="box"
656
656
  data-test-id="boxComponent"
657
657
  >
658
658
  <div
659
- class="flex cover rowdir"
659
+ class="flex fullSize row"
660
660
  data-id="containerComponent"
661
661
  data-selector-id="container"
662
662
  data-test-id="containerComponent"
663
663
  >
664
664
  <div
665
- class="icon shrinkOff"
665
+ class="noShrink icon"
666
666
  data-id="boxComponent"
667
667
  data-selector-id="box"
668
668
  data-test-id="boxComponent"
669
669
  >
670
670
  <div
671
- class="rightPlaceholder inflex rowdir both"
671
+ class="inlineFlex row alignItems_center justifyContent_center rightPlaceholder"
672
672
  data-id="containerComponent"
673
673
  data-selector-id="container"
674
674
  data-test-id="containerComponent"
675
675
  >
676
676
  <div
677
677
  aria-hidden="true"
678
- class="arrowIcon flex cover coldir both"
678
+ class="flex fullSize column alignItems_center justifyContent_center arrowIcon"
679
679
  data-id="hourField_downIcon"
680
680
  data-selector-id="container"
681
681
  data-test-id="hourField_downIcon"
@@ -698,7 +698,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
698
698
  </div>
699
699
  </div>
700
700
  <div
701
- class="dropDownContainer grow basis shrinkOff"
701
+ class="flexible basis_zero noShrink dropDownContainer"
702
702
  data-id="boxComponent"
703
703
  data-selector-id="box"
704
704
  data-test-id="boxComponent"
@@ -713,11 +713,11 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
713
713
  data-test-id="minuteField"
714
714
  >
715
715
  <div
716
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
716
+ class="flex row varClass customContainer border_bottom effect borderColor_default hasBorder container input"
717
717
  data-selector-id="textBoxIcon"
718
718
  >
719
719
  <div
720
- class="grow basis shrinkOff"
720
+ class="flexible basis_zero noShrink"
721
721
  data-id="boxComponent"
722
722
  data-selector-id="box"
723
723
  data-test-id="boxComponent"
@@ -745,32 +745,32 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
745
745
  />
746
746
  </div>
747
747
  <div
748
- class="iconContainer shrinkOff"
748
+ class="noShrink iconContainer"
749
749
  data-id="boxComponent"
750
750
  data-selector-id="box"
751
751
  data-test-id="boxComponent"
752
752
  >
753
753
  <div
754
- class="flex cover rowdir"
754
+ class="flex fullSize row"
755
755
  data-id="containerComponent"
756
756
  data-selector-id="container"
757
757
  data-test-id="containerComponent"
758
758
  >
759
759
  <div
760
- class="icon shrinkOff"
760
+ class="noShrink icon"
761
761
  data-id="boxComponent"
762
762
  data-selector-id="box"
763
763
  data-test-id="boxComponent"
764
764
  >
765
765
  <div
766
- class="rightPlaceholder inflex rowdir both"
766
+ class="inlineFlex row alignItems_center justifyContent_center rightPlaceholder"
767
767
  data-id="containerComponent"
768
768
  data-selector-id="container"
769
769
  data-test-id="containerComponent"
770
770
  >
771
771
  <div
772
772
  aria-hidden="true"
773
- class="arrowIcon flex cover coldir both"
773
+ class="flex fullSize column alignItems_center justifyContent_center arrowIcon"
774
774
  data-id="minuteField_downIcon"
775
775
  data-selector-id="container"
776
776
  data-test-id="minuteField_downIcon"
@@ -793,7 +793,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
793
793
  </div>
794
794
  </div>
795
795
  <div
796
- class="dropDownContainer grow basis shrinkOff"
796
+ class="flexible basis_zero noShrink dropDownContainer"
797
797
  data-id="boxComponent"
798
798
  data-selector-id="box"
799
799
  data-test-id="boxComponent"
@@ -808,11 +808,11 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
808
808
  data-test-id="ampmField"
809
809
  >
810
810
  <div
811
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
811
+ class="flex row varClass customContainer border_bottom effect borderColor_default hasBorder container input"
812
812
  data-selector-id="textBoxIcon"
813
813
  >
814
814
  <div
815
- class="grow basis shrinkOff"
815
+ class="flexible basis_zero noShrink"
816
816
  data-id="boxComponent"
817
817
  data-selector-id="box"
818
818
  data-test-id="boxComponent"
@@ -840,32 +840,32 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
840
840
  />
841
841
  </div>
842
842
  <div
843
- class="iconContainer shrinkOff"
843
+ class="noShrink iconContainer"
844
844
  data-id="boxComponent"
845
845
  data-selector-id="box"
846
846
  data-test-id="boxComponent"
847
847
  >
848
848
  <div
849
- class="flex cover rowdir"
849
+ class="flex fullSize row"
850
850
  data-id="containerComponent"
851
851
  data-selector-id="container"
852
852
  data-test-id="containerComponent"
853
853
  >
854
854
  <div
855
- class="icon shrinkOff"
855
+ class="noShrink icon"
856
856
  data-id="boxComponent"
857
857
  data-selector-id="box"
858
858
  data-test-id="boxComponent"
859
859
  >
860
860
  <div
861
- class="rightPlaceholder inflex rowdir both"
861
+ class="inlineFlex row alignItems_center justifyContent_center rightPlaceholder"
862
862
  data-id="containerComponent"
863
863
  data-selector-id="container"
864
864
  data-test-id="containerComponent"
865
865
  >
866
866
  <div
867
867
  aria-hidden="true"
868
- class="arrowIcon flex cover coldir both"
868
+ class="flex fullSize column alignItems_center justifyContent_center arrowIcon"
869
869
  data-id="ampmField_downIcon"
870
870
  data-selector-id="container"
871
871
  data-test-id="ampmField_downIcon"
@@ -889,7 +889,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
889
889
  </div>
890
890
  </div>
891
891
  <div
892
- class="footer flex rowdir vCenter"
892
+ class="flex row alignItems_center footer"
893
893
  data-id="containerComponent"
894
894
  data-selector-id="container"
895
895
  data-test-id="containerComponent"