@zohodesk/components 1.6.20 → 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 (164) hide show
  1. package/README.md +10 -0
  2. package/es/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  3. package/es/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  4. package/es/Button/css/cssJSLogic.js +6 -6
  5. package/es/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  6. package/es/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  7. package/es/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  8. package/es/CheckBox/CheckBox.js +2 -2
  9. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +130 -153
  10. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +50 -52
  11. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +30 -30
  12. package/es/DateTime/CalendarView.js +2 -2
  13. package/es/DateTime/DateWidget.js +2 -2
  14. package/es/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  15. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +93 -93
  16. package/es/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  17. package/es/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +8 -8
  18. package/es/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +8 -8
  19. package/es/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  20. package/es/DateTime/__tests__/__snapshots__/Time.spec.js.snap +28 -28
  21. package/es/DropBox/DropBoxElement/css/cssJSLogic.js +6 -6
  22. package/es/DropDown/DropDownItem.js +1 -1
  23. package/es/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  24. package/es/DropDown/__tests__/__snapshots__/DropDownItem.spec.js.snap +1 -1
  25. package/es/Label/Label.js +1 -1
  26. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -24
  27. package/es/Layout/Box.js +1 -115
  28. package/es/Layout/Container.js +1 -132
  29. package/es/Layout/props/defaultProps.js +1 -16
  30. package/es/Layout/props/propTypes.js +1 -46
  31. package/es/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  32. package/es/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  33. package/es/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  34. package/es/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -69
  35. package/es/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  36. package/es/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +69 -69
  37. package/es/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +4 -4
  38. package/es/MultiSelect/MultiSelect.js +1 -1
  39. package/es/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  40. package/es/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  41. package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +38 -41
  42. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +7 -7
  43. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  44. package/es/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  45. package/es/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  46. package/es/Radio/Radio.js +1 -1
  47. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +152 -152
  48. package/es/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  49. package/es/Ribbon/Ribbon.js +3 -16
  50. package/es/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +24 -24
  51. package/es/Select/SelectWithAvatar.js +1 -1
  52. package/es/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +7 -7
  53. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +845 -823
  54. package/es/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  55. package/es/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +10 -10
  56. package/es/Switch/Switch.js +1 -1
  57. package/es/Switch/__tests__/__snapshots__/Switch.spec.js.snap +56 -56
  58. package/es/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  59. package/es/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  60. package/es/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  61. package/es/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +40 -40
  62. package/es/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  63. package/es/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  64. package/es/Tag/Tag.js +1 -2
  65. package/es/Tag/__tests__/__snapshots__/Tag.spec.js.snap +140 -186
  66. package/es/TextBoxIcon/TextBoxIcon.js +1 -1
  67. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +167 -167
  68. package/es/Textarea/Textarea.js +1 -1
  69. package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +46 -46
  70. package/es/Tooltip/Tooltip.js +1 -1
  71. package/es/Typography/css/cssJSLogic.js +2 -2
  72. package/es/css.js +0 -1
  73. package/es/deprecated/Switch/Switch.js +1 -1
  74. package/es/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +20 -20
  75. package/es/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  76. package/es/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  77. package/lib/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  78. package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  79. package/lib/Button/css/cssJSLogic.js +3 -3
  80. package/lib/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  81. package/lib/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  82. package/lib/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  83. package/lib/CheckBox/CheckBox.js +2 -2
  84. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +130 -153
  85. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +50 -52
  86. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +30 -30
  87. package/lib/DateTime/CalendarView.js +2 -2
  88. package/lib/DateTime/DateWidget.js +2 -2
  89. package/lib/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  90. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +93 -93
  91. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  92. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +8 -8
  93. package/lib/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +8 -8
  94. package/lib/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  95. package/lib/DateTime/__tests__/__snapshots__/Time.spec.js.snap +28 -28
  96. package/lib/DropBox/DropBoxElement/css/cssJSLogic.js +2 -2
  97. package/lib/DropDown/DropDownItem.js +1 -1
  98. package/lib/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  99. package/lib/DropDown/__tests__/__snapshots__/DropDownItem.spec.js.snap +1 -1
  100. package/lib/Label/Label.js +1 -1
  101. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -24
  102. package/lib/Layout/Box.js +7 -120
  103. package/lib/Layout/Container.js +7 -137
  104. package/lib/Layout/props/defaultProps.js +14 -19
  105. package/lib/Layout/props/propTypes.js +13 -52
  106. package/lib/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  107. package/lib/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  108. package/lib/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  109. package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -69
  110. package/lib/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  111. package/lib/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +69 -69
  112. package/lib/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +4 -4
  113. package/lib/MultiSelect/MultiSelect.js +1 -1
  114. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  115. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  116. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +38 -41
  117. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +7 -7
  118. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  119. package/lib/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  120. package/lib/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  121. package/lib/Radio/Radio.js +1 -1
  122. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +152 -152
  123. package/lib/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  124. package/lib/Ribbon/Ribbon.js +2 -15
  125. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +24 -24
  126. package/lib/Select/SelectWithAvatar.js +1 -1
  127. package/lib/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +7 -7
  128. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +845 -823
  129. package/lib/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  130. package/lib/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +10 -10
  131. package/lib/Switch/Switch.js +1 -1
  132. package/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap +56 -56
  133. package/lib/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  134. package/lib/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  135. package/lib/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  136. package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +40 -40
  137. package/lib/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  138. package/lib/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  139. package/lib/Tag/Tag.js +1 -1
  140. package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap +140 -186
  141. package/lib/TextBoxIcon/TextBoxIcon.js +1 -1
  142. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +167 -167
  143. package/lib/Textarea/Textarea.js +1 -1
  144. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +46 -46
  145. package/lib/Tooltip/Tooltip.js +1 -1
  146. package/lib/Typography/css/cssJSLogic.js +1 -1
  147. package/lib/css.js +0 -2
  148. package/lib/deprecated/Switch/Switch.js +1 -1
  149. package/lib/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +20 -20
  150. package/lib/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  151. package/lib/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  152. package/package.json +7 -7
  153. package/es/Layout/Layout.module.css +0 -336
  154. package/es/Layout/__tests__/Box.spec.js +0 -11
  155. package/es/Layout/__tests__/Container.spec.js +0 -11
  156. package/es/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  157. package/es/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  158. package/es/Layout/utils.js +0 -29
  159. package/lib/Layout/Layout.module.css +0 -336
  160. package/lib/Layout/__tests__/Box.spec.js +0 -18
  161. package/lib/Layout/__tests__/Container.spec.js +0 -18
  162. package/lib/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  163. package/lib/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  164. package/lib/Layout/utils.js +0 -59
@@ -3,7 +3,7 @@
3
3
  exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode & it's custom class 1`] = `
4
4
  <DocumentFragment>
5
5
  <li
6
- class="list medium default withBorder flex rowdir vCenter"
6
+ class="flex row alignItems_center list medium default withBorder"
7
7
  data-a11y-inset-focus="true"
8
8
  data-id="list"
9
9
  data-selector-id="listItemWithIcon"
@@ -12,25 +12,25 @@ exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode
12
12
  tabindex="0"
13
13
  >
14
14
  <div
15
- class="contentWrapper shrinkOff"
15
+ class="noShrink contentWrapper"
16
16
  data-id="boxComponent"
17
17
  data-selector-id="box"
18
18
  data-test-id="boxComponent"
19
19
  >
20
20
  <div
21
- class="leftBox selfAlign_center grow basis shrinkOff"
21
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
22
22
  data-id="boxComponent"
23
23
  data-selector-id="box"
24
24
  data-test-id="boxComponent"
25
25
  >
26
26
  <div
27
- class="titleBox shrinkOff"
27
+ class="noShrink titleBox"
28
28
  data-id="boxComponent"
29
29
  data-selector-id="box"
30
30
  data-test-id="boxComponent"
31
31
  >
32
32
  <div
33
- class="value basisAuto shrinkOn"
33
+ class="basis_auto shrink value"
34
34
  data-id="list_Text"
35
35
  data-selector-id="box"
36
36
  data-test-id="list_Text"
@@ -38,7 +38,7 @@ exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode
38
38
  List
39
39
  </div>
40
40
  <div
41
- class="customValueRightPlaceholderClass shrinkOff"
41
+ class="noShrink customValueRightPlaceholderClass"
42
42
  data-id="boxComponent"
43
43
  data-selector-id="box"
44
44
  data-test-id="boxComponent"
@@ -57,7 +57,7 @@ exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode
57
57
  exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode 1`] = `
58
58
  <DocumentFragment>
59
59
  <li
60
- class="list medium default withBorder flex rowdir vCenter"
60
+ class="flex row alignItems_center list medium default withBorder"
61
61
  data-a11y-inset-focus="true"
62
62
  data-id="list"
63
63
  data-selector-id="listItemWithIcon"
@@ -66,25 +66,25 @@ exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode
66
66
  tabindex="0"
67
67
  >
68
68
  <div
69
- class="contentWrapper shrinkOff"
69
+ class="noShrink contentWrapper"
70
70
  data-id="boxComponent"
71
71
  data-selector-id="box"
72
72
  data-test-id="boxComponent"
73
73
  >
74
74
  <div
75
- class="leftBox selfAlign_center grow basis shrinkOff"
75
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
76
76
  data-id="boxComponent"
77
77
  data-selector-id="box"
78
78
  data-test-id="boxComponent"
79
79
  >
80
80
  <div
81
- class="titleBox shrinkOff"
81
+ class="noShrink titleBox"
82
82
  data-id="boxComponent"
83
83
  data-selector-id="box"
84
84
  data-test-id="boxComponent"
85
85
  >
86
86
  <div
87
- class="value basisAuto shrinkOn"
87
+ class="basis_auto shrink value"
88
88
  data-id="list_Text"
89
89
  data-selector-id="box"
90
90
  data-test-id="list_Text"
@@ -92,7 +92,7 @@ exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode
92
92
  List
93
93
  </div>
94
94
  <div
95
- class="shrinkOff"
95
+ class="noShrink"
96
96
  data-id="boxComponent"
97
97
  data-selector-id="box"
98
98
  data-test-id="boxComponent"
@@ -111,7 +111,7 @@ exports[`ListItemWithIcon ListItemWithIcon with renderValueRightPlaceholderNode
111
111
  exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS align center 1`] = `
112
112
  <DocumentFragment>
113
113
  <li
114
- class="list medium default withBorder flex rowdir vCenter"
114
+ class="flex row alignItems_center list medium default withBorder"
115
115
  data-a11y-inset-focus="true"
116
116
  data-id="list"
117
117
  data-selector-id="listItemWithIcon"
@@ -120,25 +120,25 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS ali
120
120
  tabindex="0"
121
121
  >
122
122
  <div
123
- class="contentWrapper alignLhsBox_center shrinkOff"
123
+ class="noShrink contentWrapper alignLhsBox_center"
124
124
  data-id="boxComponent"
125
125
  data-selector-id="box"
126
126
  data-test-id="boxComponent"
127
127
  >
128
128
  <div
129
- class="leftBox selfAlign_center grow basis shrinkOff"
129
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
130
130
  data-id="boxComponent"
131
131
  data-selector-id="box"
132
132
  data-test-id="boxComponent"
133
133
  >
134
134
  <div
135
- class="titleBox shrinkOff"
135
+ class="noShrink titleBox"
136
136
  data-id="boxComponent"
137
137
  data-selector-id="box"
138
138
  data-test-id="boxComponent"
139
139
  >
140
140
  <div
141
- class="value basisAuto shrinkOn"
141
+ class="basis_auto shrink value"
142
142
  data-id="list_Text"
143
143
  data-selector-id="box"
144
144
  data-test-id="list_Text"
@@ -147,7 +147,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS ali
147
147
  </div>
148
148
  </div>
149
149
  <div
150
- class="secondaryField secondaryValue shrinkOff"
150
+ class="noShrink secondaryField secondaryValue"
151
151
  data-id="boxComponent"
152
152
  data-selector-id="box"
153
153
  data-test-id="boxComponent"
@@ -164,7 +164,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS ali
164
164
  exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS align end 1`] = `
165
165
  <DocumentFragment>
166
166
  <li
167
- class="list medium default withBorder flex rowdir vCenter"
167
+ class="flex row alignItems_center list medium default withBorder"
168
168
  data-a11y-inset-focus="true"
169
169
  data-id="list"
170
170
  data-selector-id="listItemWithIcon"
@@ -173,25 +173,25 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS ali
173
173
  tabindex="0"
174
174
  >
175
175
  <div
176
- class="contentWrapper alignLhsBox_end shrinkOff"
176
+ class="noShrink contentWrapper alignLhsBox_end"
177
177
  data-id="boxComponent"
178
178
  data-selector-id="box"
179
179
  data-test-id="boxComponent"
180
180
  >
181
181
  <div
182
- class="leftBox selfAlign_center grow basis shrinkOff"
182
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
183
183
  data-id="boxComponent"
184
184
  data-selector-id="box"
185
185
  data-test-id="boxComponent"
186
186
  >
187
187
  <div
188
- class="titleBox shrinkOff"
188
+ class="noShrink titleBox"
189
189
  data-id="boxComponent"
190
190
  data-selector-id="box"
191
191
  data-test-id="boxComponent"
192
192
  >
193
193
  <div
194
- class="value basisAuto shrinkOn"
194
+ class="basis_auto shrink value"
195
195
  data-id="list_Text"
196
196
  data-selector-id="box"
197
197
  data-test-id="list_Text"
@@ -200,7 +200,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS ali
200
200
  </div>
201
201
  </div>
202
202
  <div
203
- class="secondaryField secondaryValue shrinkOff"
203
+ class="noShrink secondaryField secondaryValue"
204
204
  data-id="boxComponent"
205
205
  data-selector-id="box"
206
206
  data-test-id="boxComponent"
@@ -217,7 +217,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS ali
217
217
  exports[`ListItemWithIcon ListItemWithIcon with secondaryValue 1`] = `
218
218
  <DocumentFragment>
219
219
  <li
220
- class="list medium default withBorder flex rowdir vCenter"
220
+ class="flex row alignItems_center list medium default withBorder"
221
221
  data-a11y-inset-focus="true"
222
222
  data-id="list"
223
223
  data-selector-id="listItemWithIcon"
@@ -226,25 +226,25 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue 1`] = `
226
226
  tabindex="0"
227
227
  >
228
228
  <div
229
- class="contentWrapper shrinkOff"
229
+ class="noShrink contentWrapper"
230
230
  data-id="boxComponent"
231
231
  data-selector-id="box"
232
232
  data-test-id="boxComponent"
233
233
  >
234
234
  <div
235
- class="leftBox selfAlign_center grow basis shrinkOff"
235
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
236
236
  data-id="boxComponent"
237
237
  data-selector-id="box"
238
238
  data-test-id="boxComponent"
239
239
  >
240
240
  <div
241
- class="titleBox shrinkOff"
241
+ class="noShrink titleBox"
242
242
  data-id="boxComponent"
243
243
  data-selector-id="box"
244
244
  data-test-id="boxComponent"
245
245
  >
246
246
  <div
247
- class="value basisAuto shrinkOn"
247
+ class="basis_auto shrink value"
248
248
  data-id="list_Text"
249
249
  data-selector-id="box"
250
250
  data-test-id="list_Text"
@@ -253,7 +253,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue 1`] = `
253
253
  </div>
254
254
  </div>
255
255
  <div
256
- class="secondaryField secondaryValue shrinkOff"
256
+ class="noShrink secondaryField secondaryValue"
257
257
  data-id="boxComponent"
258
258
  data-selector-id="box"
259
259
  data-test-id="boxComponent"
@@ -270,7 +270,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue 1`] = `
270
270
  exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS align start 1`] = `
271
271
  <DocumentFragment>
272
272
  <li
273
- class="list medium default withBorder flex rowdir vCenter"
273
+ class="flex row alignItems_center list medium default withBorder"
274
274
  data-a11y-inset-focus="true"
275
275
  data-id="list"
276
276
  data-selector-id="listItemWithIcon"
@@ -279,25 +279,25 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS alig
279
279
  tabindex="0"
280
280
  >
281
281
  <div
282
- class="contentWrapper shrinkOff"
282
+ class="noShrink contentWrapper"
283
283
  data-id="boxComponent"
284
284
  data-selector-id="box"
285
285
  data-test-id="boxComponent"
286
286
  >
287
287
  <div
288
- class="leftBox selfAlign_center grow basis shrinkOff"
288
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
289
289
  data-id="boxComponent"
290
290
  data-selector-id="box"
291
291
  data-test-id="boxComponent"
292
292
  >
293
293
  <div
294
- class="titleBox shrinkOff"
294
+ class="noShrink titleBox"
295
295
  data-id="boxComponent"
296
296
  data-selector-id="box"
297
297
  data-test-id="boxComponent"
298
298
  >
299
299
  <div
300
- class="value basisAuto shrinkOn"
300
+ class="basis_auto shrink value"
301
301
  data-id="list_Text"
302
302
  data-selector-id="box"
303
303
  data-test-id="list_Text"
@@ -306,7 +306,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS alig
306
306
  </div>
307
307
  </div>
308
308
  <div
309
- class="secondaryField secondaryValue shrinkOff"
309
+ class="noShrink secondaryField secondaryValue"
310
310
  data-id="boxComponent"
311
311
  data-selector-id="box"
312
312
  data-test-id="boxComponent"
@@ -323,7 +323,7 @@ exports[`ListItemWithIcon ListItemWithIcon with secondaryValue text and LHS alig
323
323
  exports[`ListItemWithIcon rendering the defult props 1`] = `
324
324
  <DocumentFragment>
325
325
  <li
326
- class="list medium default withBorder flex rowdir vCenter"
326
+ class="flex row alignItems_center list medium default withBorder"
327
327
  data-a11y-inset-focus="true"
328
328
  data-id="list"
329
329
  data-selector-id="listItemWithIcon"
@@ -332,25 +332,25 @@ exports[`ListItemWithIcon rendering the defult props 1`] = `
332
332
  tabindex="0"
333
333
  >
334
334
  <div
335
- class="contentWrapper shrinkOff"
335
+ class="noShrink contentWrapper"
336
336
  data-id="boxComponent"
337
337
  data-selector-id="box"
338
338
  data-test-id="boxComponent"
339
339
  >
340
340
  <div
341
- class="leftBox selfAlign_center grow basis shrinkOff"
341
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
342
342
  data-id="boxComponent"
343
343
  data-selector-id="box"
344
344
  data-test-id="boxComponent"
345
345
  >
346
346
  <div
347
- class="titleBox shrinkOff"
347
+ class="noShrink titleBox"
348
348
  data-id="boxComponent"
349
349
  data-selector-id="box"
350
350
  data-test-id="boxComponent"
351
351
  >
352
352
  <div
353
- class="value basisAuto shrinkOn"
353
+ class="basis_auto shrink value"
354
354
  data-id="list_Text"
355
355
  data-selector-id="box"
356
356
  data-test-id="list_Text"