@zohodesk/components 1.6.21 → 1.6.22

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 (96) hide show
  1. package/README.md +4 -0
  2. package/es/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  3. package/es/Button/css/cssJSLogic.js +6 -6
  4. package/es/CheckBox/CheckBox.js +2 -2
  5. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +65 -65
  6. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +15 -17
  7. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +6 -6
  8. package/es/DateTime/CalendarView.js +2 -2
  9. package/es/DateTime/DateWidget.js +2 -2
  10. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +51 -51
  11. package/es/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +3 -3
  12. package/es/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +3 -3
  13. package/es/DateTime/__tests__/__snapshots__/Time.spec.js.snap +6 -6
  14. package/es/DropBox/DropBoxElement/css/cssJSLogic.js +6 -6
  15. package/es/DropDown/DropDownItem.js +1 -1
  16. package/es/DropDown/__tests__/__snapshots__/DropDownItem.spec.js.snap +1 -1
  17. package/es/Label/Label.js +1 -1
  18. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -24
  19. package/es/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +7 -7
  20. package/es/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +1 -1
  21. package/es/MultiSelect/MultiSelect.js +1 -1
  22. package/es/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +1 -1
  23. package/es/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +3 -3
  24. package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +13 -16
  25. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +1 -1
  26. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +2 -2
  27. package/es/Radio/Radio.js +1 -1
  28. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +31 -31
  29. package/es/Ribbon/Ribbon.js +3 -16
  30. package/es/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +24 -24
  31. package/es/Select/SelectWithAvatar.js +1 -1
  32. package/es/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +1 -1
  33. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +128 -128
  34. package/es/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +2 -2
  35. package/es/Switch/Switch.js +1 -1
  36. package/es/Switch/__tests__/__snapshots__/Switch.spec.js.snap +34 -34
  37. package/es/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +4 -4
  38. package/es/Tag/Tag.js +1 -2
  39. package/es/Tag/__tests__/__snapshots__/Tag.spec.js.snap +94 -140
  40. package/es/TextBoxIcon/TextBoxIcon.js +1 -1
  41. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +6 -6
  42. package/es/Textarea/Textarea.js +1 -1
  43. package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +46 -46
  44. package/es/Tooltip/Tooltip.js +1 -1
  45. package/es/Typography/css/cssJSLogic.js +2 -2
  46. package/es/deprecated/Switch/Switch.js +1 -1
  47. package/es/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +10 -10
  48. package/es/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  49. package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  50. package/lib/Button/css/cssJSLogic.js +3 -3
  51. package/lib/CheckBox/CheckBox.js +2 -2
  52. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +65 -65
  53. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +15 -17
  54. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +6 -6
  55. package/lib/DateTime/CalendarView.js +2 -2
  56. package/lib/DateTime/DateWidget.js +2 -2
  57. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +51 -51
  58. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +3 -3
  59. package/lib/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +3 -3
  60. package/lib/DateTime/__tests__/__snapshots__/Time.spec.js.snap +6 -6
  61. package/lib/DropBox/DropBoxElement/css/cssJSLogic.js +2 -2
  62. package/lib/DropDown/DropDownItem.js +1 -1
  63. package/lib/DropDown/__tests__/__snapshots__/DropDownItem.spec.js.snap +1 -1
  64. package/lib/Label/Label.js +1 -1
  65. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -24
  66. package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +7 -7
  67. package/lib/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +1 -1
  68. package/lib/MultiSelect/MultiSelect.js +1 -1
  69. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +1 -1
  70. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +3 -3
  71. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +13 -16
  72. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +1 -1
  73. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +2 -2
  74. package/lib/Radio/Radio.js +1 -1
  75. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +31 -31
  76. package/lib/Ribbon/Ribbon.js +2 -15
  77. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +24 -24
  78. package/lib/Select/SelectWithAvatar.js +1 -1
  79. package/lib/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +1 -1
  80. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +128 -128
  81. package/lib/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +2 -2
  82. package/lib/Switch/Switch.js +1 -1
  83. package/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap +34 -34
  84. package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +4 -4
  85. package/lib/Tag/Tag.js +1 -1
  86. package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap +94 -140
  87. package/lib/TextBoxIcon/TextBoxIcon.js +1 -1
  88. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +6 -6
  89. package/lib/Textarea/Textarea.js +1 -1
  90. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +46 -46
  91. package/lib/Tooltip/Tooltip.js +1 -1
  92. package/lib/Typography/css/cssJSLogic.js +1 -1
  93. package/lib/deprecated/Switch/Switch.js +1 -1
  94. package/lib/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +10 -10
  95. package/lib/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  96. package/package.json +5 -5
package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap CHANGED
@@ -9,7 +9,7 @@ exports[`ColorMultiSelect Should render the default selected value 1`] = `
9
9
  data-test-id="multiSelect"
10
10
  >
11
11
  <div
12
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
12
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
13
13
  data-id="containerComponent"
14
14
  data-selector-id="container"
15
15
  data-test-id="containerComponent"
@@ -25,7 +25,7 @@ exports[`ColorMultiSelect Should render the default selected value 1`] = `
25
25
  "
26
26
  />
27
27
  <div
28
- class="flex row varClass customContainer effect container custmInputWrapper"
28
+ class="flex row varClass customContainer effect container custmInputWrapper"
29
29
  data-selector-id="textBoxIcon"
30
30
  >
31
31
  <div
@@ -92,7 +92,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
92
92
  data-test-id="multiSelect"
93
93
  >
94
94
  <div
95
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
95
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
96
96
  data-id="containerComponent"
97
97
  data-selector-id="container"
98
98
  data-test-id="containerComponent"
@@ -123,8 +123,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
123
123
  <button
124
124
  aria-label="Delete"
125
125
  class="buttonReset close
126
- lgRadiusClose
127
- closedanger"
126
+ lgRadiusClose closedanger "
128
127
  data-id="tag_RemoveTag"
129
128
  data-test-id="tag_RemoveTag"
130
129
  type="button"
@@ -138,7 +137,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
138
137
  >
139
138
  <i
140
139
  aria-hidden="true"
141
- class="zd_font_icons basic icon-close2 fbold "
140
+ class="zd_font_icons basic icon-close2 fbold "
142
141
  data-id="fontIcon"
143
142
  data-selector-id="fontIcon"
144
143
  data-test-id="fontIcon"
@@ -174,8 +173,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
174
173
  <button
175
174
  aria-label="Delete"
176
175
  class="buttonReset close
177
- lgRadiusClose
178
- closedanger"
176
+ lgRadiusClose closedanger "
179
177
  data-id="tag_RemoveTag"
180
178
  data-test-id="tag_RemoveTag"
181
179
  type="button"
@@ -189,7 +187,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
189
187
  >
190
188
  <i
191
189
  aria-hidden="true"
192
- class="zd_font_icons basic icon-close2 fbold "
190
+ class="zd_font_icons basic icon-close2 fbold "
193
191
  data-id="fontIcon"
194
192
  data-selector-id="fontIcon"
195
193
  data-test-id="fontIcon"
@@ -210,7 +208,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
210
208
  "
211
209
  />
212
210
  <div
213
- class="flex row varClass customContainer effect container custmInputWrapper"
211
+ class="flex row varClass customContainer effect container custmInputWrapper"
214
212
  data-selector-id="textBoxIcon"
215
213
  >
216
214
  <div
@@ -268,7 +266,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
268
266
  >
269
267
  <i
270
268
  aria-hidden="true"
271
- class="zd_font_icons basic icon-delete rtl "
269
+ class="zd_font_icons rtl basic icon-delete "
272
270
  data-id="fontIcon"
273
271
  data-selector-id="fontIcon"
274
272
  data-test-id="fontIcon"
@@ -295,7 +293,7 @@ exports[`ColorMultiSelect rendering the defult props 1`] = `
295
293
  data-test-id="multiSelect"
296
294
  >
297
295
  <div
298
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
296
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
299
297
  data-id="containerComponent"
300
298
  data-selector-id="container"
301
299
  data-test-id="containerComponent"
@@ -311,7 +309,7 @@ exports[`ColorMultiSelect rendering the defult props 1`] = `
311
309
  "
312
310
  />
313
311
  <div
314
- class="flex row varClass customContainer effect container custmInputWrapper"
312
+ class="flex row varClass customContainer effect container custmInputWrapper"
315
313
  data-selector-id="textBoxIcon"
316
314
  >
317
315
  <div
@@ -378,7 +376,7 @@ exports[`ColorMultiSelect renders with renderCustomColorIndicator 1`] = `
378
376
  data-test-id="multiSelect"
379
377
  >
380
378
  <div
381
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
379
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
382
380
  data-id="containerComponent"
383
381
  data-selector-id="container"
384
382
  data-test-id="containerComponent"
@@ -394,7 +392,7 @@ exports[`ColorMultiSelect renders with renderCustomColorIndicator 1`] = `
394
392
  "
395
393
  />
396
394
  <div
397
- class="flex row varClass customContainer effect container custmInputWrapper"
395
+ class="flex row varClass customContainer effect container custmInputWrapper"
398
396
  data-selector-id="textBoxIcon"
399
397
  >
400
398
  <div
@@ -461,7 +459,7 @@ exports[`ColorMultiSelect renders with renderCustomSelectedValue 1`] = `
461
459
  data-test-id="multiSelect"
462
460
  >
463
461
  <div
464
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
462
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
465
463
  data-id="containerComponent"
466
464
  data-selector-id="container"
467
465
  data-test-id="containerComponent"
@@ -477,7 +475,7 @@ exports[`ColorMultiSelect renders with renderCustomSelectedValue 1`] = `
477
475
  "
478
476
  />
479
477
  <div
480
- class="flex row varClass customContainer effect container custmInputWrapper"
478
+ class="flex row varClass customContainer effect container custmInputWrapper"
481
479
  data-selector-id="textBoxIcon"
482
480
  >
483
481
  <div
package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap CHANGED
@@ -64,7 +64,7 @@ exports[`ColorSingleSelect Should render the default selected value 1`] = `
64
64
  >
65
65
  <i
66
66
  aria-hidden="true"
67
- class="zd_font_icons basic icon-down "
67
+ class="zd_font_icons basic icon-down "
68
68
  data-id="fontIcon"
69
69
  data-selector-id="fontIcon"
70
70
  data-test-id="fontIcon"
@@ -138,7 +138,7 @@ exports[`ColorSingleSelect Should render the selected value 1`] = `
138
138
  >
139
139
  <i
140
140
  aria-hidden="true"
141
- class="zd_font_icons basic icon-down "
141
+ class="zd_font_icons basic icon-down "
142
142
  data-id="fontIcon"
143
143
  data-selector-id="fontIcon"
144
144
  data-test-id="fontIcon"
@@ -201,7 +201,7 @@ exports[`ColorSingleSelect rendering the defult props 1`] = `
201
201
  >
202
202
  <i
203
203
  aria-hidden="true"
204
- class="zd_font_icons basic icon-down "
204
+ class="zd_font_icons basic icon-down "
205
205
  data-id="fontIcon"
206
206
  data-selector-id="fontIcon"
207
207
  data-test-id="fontIcon"
@@ -266,7 +266,7 @@ exports[`ColorSingleSelect rendering with isDefaultSelectValue is false 1`] = `
266
266
  >
267
267
  <i
268
268
  aria-hidden="true"
269
- class="zd_font_icons basic icon-down "
269
+ class="zd_font_icons basic icon-down "
270
270
  data-id="fontIcon"
271
271
  data-selector-id="fontIcon"
272
272
  data-test-id="fontIcon"
@@ -344,7 +344,7 @@ exports[`ColorSingleSelect renders with renderCustomColorIndicator 1`] = `
344
344
  >
345
345
  <i
346
346
  aria-hidden="true"
347
- class="zd_font_icons basic icon-down "
347
+ class="zd_font_icons basic icon-down "
348
348
  data-id="fontIcon"
349
349
  data-selector-id="fontIcon"
350
350
  data-test-id="fontIcon"
@@ -407,7 +407,7 @@ exports[`ColorSingleSelect renders with renderCustomSelectedValue 1`] = `
407
407
  >
408
408
  <i
409
409
  aria-hidden="true"
410
- class="zd_font_icons basic icon-down "
410
+ class="zd_font_icons basic icon-down "
411
411
  data-id="fontIcon"
412
412
  data-selector-id="fontIcon"
413
413
  data-test-id="fontIcon"
package/es/DateTime/CalendarView.js CHANGED
@@ -136,7 +136,7 @@ export default class CalendarView extends React.PureComponent {
136
136
  output = /*#__PURE__*/React.createElement(Span, {
137
137
  i: i // isActive={isSelectedDay}
138
138
  ,
139
- tdclass: `${tdclass} ${style.invalidDate}`,
139
+ tdclass: `${style.invalidDate} ${tdclass}`,
140
140
  handleSelect: this.handleSelect,
141
141
  incremday: nextDate,
142
142
  userSeeMonth: nextMonth,
@@ -211,7 +211,7 @@ export class Span extends React.PureComponent {
211
211
  } = this.props;
212
212
  return /*#__PURE__*/React.createElement(Box, {
213
213
  dataId: dataId,
214
- className: `${tdclass} ${isActive ? style.active : ''} ${isToday ? style.today : ''}`,
214
+ className: `${isActive ? style.active : ''} ${isToday ? style.today : ''} ${tdclass} `,
215
215
  key: i,
216
216
  onClick: this.handleSelectChild,
217
217
  "aria-label": incremday
package/es/DateTime/DateWidget.js CHANGED
@@ -1060,11 +1060,11 @@ class DateWidgetComponent extends React.Component {
1060
1060
  "data-test-id": `${isDisabled ? `${dataId}_disabled` : isReadOnly ? `${dataId}_readOnly` : `${dataId}_widget`}`,
1061
1061
  onClick: isDisabled || isReadOnly ? null : this.handleTogglePopup,
1062
1062
  ref: getTargetRef,
1063
- className: `${className ? className : ''} ${isDisabled ? style.disabled : style.enabled}`
1063
+ className: `${isDisabled ? style.disabled : style.enabled} ${className ? className : ''}`
1064
1064
  }, children) : /*#__PURE__*/React.createElement("div", {
1065
1065
  "data-id": `${isDisabled ? `${dataId}_disabled` : isReadOnly ? `${dataId}_readOnly` : `${dataId}_widget`}`,
1066
1066
  "data-test-id": `${isDisabled ? `${dataId}_disabled` : isReadOnly ? `${dataId}_readOnly` : `${dataId}_widget`}`,
1067
- className: `${className ? className : ''} ${style.textBox} ${isPopupOpen && !isDisabled ? style.textBoxFocus : ''} ${isDisabled ? style.disabled : isReadOnly ? style.readOnly : style.enabled}`,
1067
+ className: ` ${style.textBox} ${isPopupOpen && !isDisabled ? style.textBoxFocus : ''} ${isDisabled ? style.disabled : isReadOnly ? style.readOnly : style.enabled} ${className ? className : ''}`,
1068
1068
  onClick: !isAllowedDateType ? isDisabled || isReadOnly ? null : this.handleTogglePopup : null,
1069
1069
  ref: getTargetRef
1070
1070
  }, /*#__PURE__*/React.createElement(TextBoxIcon, _extends({
package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap CHANGED
@@ -36,7 +36,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
36
36
  <span>
37
37
  <i
38
38
  aria-hidden="true"
39
- class="zd_font_icons basic icon-dropdown downArrow "
39
+ class="zd_font_icons basic icon-dropdown downArrow"
40
40
  data-id="fontIcon"
41
41
  data-selector-id="fontIcon"
42
42
  data-test-id="fontIcon"
@@ -61,7 +61,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
61
61
  >
62
62
  <i
63
63
  aria-hidden="true"
64
- class="zd_font_icons basic icon-arrow-left3 fbold rtl "
64
+ class="zd_font_icons rtl basic icon-arrow-left3 fbold "
65
65
  data-id="fontIcon"
66
66
  data-selector-id="fontIcon"
67
67
  data-test-id="fontIcon"
@@ -78,7 +78,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
78
78
  >
79
79
  <i
80
80
  aria-hidden="true"
81
- class="zd_font_icons basic icon-arrow-right3 fbold rtl "
81
+ class="zd_font_icons rtl basic icon-arrow-right3 fbold "
82
82
  data-id="fontIcon"
83
83
  data-selector-id="fontIcon"
84
84
  data-test-id="fontIcon"
@@ -178,7 +178,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
178
178
  >
179
179
  <div
180
180
  aria-label="25"
181
- class="noShrink datesStr grid holiday invalidDate"
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="noShrink datesStr grid invalidDate"
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="noShrink datesStr grid invalidDate"
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="noShrink datesStr grid invalidDate"
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="noShrink datesStr grid invalidDate"
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="noShrink datesStr grid invalidDate"
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="noShrink datesStr grid"
235
+ class="noShrink datesStr grid"
236
236
  data-id="dateTime_date"
237
237
  data-selector-id="box"
238
238
  data-test-id="dateTime_date"
@@ -248,7 +248,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
248
248
  >
249
249
  <div
250
250
  aria-label="2"
251
- class="noShrink datesStr grid holiday"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
305
+ class="noShrink datesStr grid"
306
306
  data-id="dateTime_date"
307
307
  data-selector-id="box"
308
308
  data-test-id="dateTime_date"
@@ -318,7 +318,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
318
318
  >
319
319
  <div
320
320
  aria-label="9"
321
- class="noShrink datesStr grid holiday"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
375
+ class="noShrink datesStr grid"
376
376
  data-id="dateTime_date"
377
377
  data-selector-id="box"
378
378
  data-test-id="dateTime_date"
@@ -388,7 +388,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
388
388
  >
389
389
  <div
390
390
  aria-label="16"
391
- class="noShrink datesStr grid holiday"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
445
+ class="noShrink datesStr grid"
446
446
  data-id="dateTime_date"
447
447
  data-selector-id="box"
448
448
  data-test-id="dateTime_date"
@@ -458,7 +458,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
458
458
  >
459
459
  <div
460
460
  aria-label="23"
461
- class="noShrink datesStr grid holiday"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid"
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="noShrink datesStr grid active"
515
+ class="noShrink active datesStr grid"
516
516
  data-id="dateTime_dateSelected"
517
517
  data-selector-id="box"
518
518
  data-test-id="dateTime_dateSelected"
@@ -528,7 +528,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
528
528
  >
529
529
  <div
530
530
  aria-label="30"
531
- class="noShrink datesStr grid holiday"
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="noShrink datesStr grid"
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="noShrink datesStr grid invalidDate"
549
+ class="noShrink invalidDate datesStr grid"
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="noShrink datesStr grid invalidDate"
558
+ class="noShrink invalidDate datesStr grid"
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="noShrink datesStr grid invalidDate"
567
+ class="noShrink invalidDate datesStr grid"
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="noShrink datesStr grid invalidDate"
576
+ class="noShrink invalidDate datesStr grid"
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="noShrink datesStr grid invalidDate"
585
+ class="noShrink invalidDate datesStr grid"
586
586
  data-id="dateTime_invalidDate"
587
587
  data-selector-id="box"
588
588
  data-test-id="dateTime_invalidDate"
@@ -618,7 +618,7 @@ 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="flex row varClass customContainer border_bottom effect borderColor_default hasBorder container input"
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
@@ -682,7 +682,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
682
682
  >
683
683
  <i
684
684
  aria-hidden="true"
685
- class="zd_font_icons basic icon-down "
685
+ class="zd_font_icons basic icon-down "
686
686
  data-id="fontIcon"
687
687
  data-selector-id="fontIcon"
688
688
  data-test-id="fontIcon"
@@ -713,7 +713,7 @@ 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="flex row varClass customContainer border_bottom effect borderColor_default hasBorder container input"
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
@@ -777,7 +777,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
777
777
  >
778
778
  <i
779
779
  aria-hidden="true"
780
- class="zd_font_icons basic icon-down "
780
+ class="zd_font_icons basic icon-down "
781
781
  data-id="fontIcon"
782
782
  data-selector-id="fontIcon"
783
783
  data-test-id="fontIcon"
@@ -808,7 +808,7 @@ 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="flex row varClass customContainer border_bottom effect borderColor_default hasBorder container input"
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
@@ -872,7 +872,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
872
872
  >
873
873
  <i
874
874
  aria-hidden="true"
875
- class="zd_font_icons basic icon-down "
875
+ class="zd_font_icons basic icon-down "
876
876
  data-id="fontIcon"
877
877
  data-selector-id="fontIcon"
878
878
  data-test-id="fontIcon"