@zohodesk/components 1.6.20 → 1.6.22-exp-1

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 (200) hide show
  1. package/README.md +10 -0
  2. package/es/AppContainer/AppContainer.module.css +9 -3
  3. package/es/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +22 -22
  4. package/es/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +42 -42
  5. package/es/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +73 -97
  6. package/es/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  7. package/es/Button/css/cssJSLogic.js +6 -6
  8. package/es/Buttongroup/__tests__/__snapshots__/Buttongroup.spec.js.snap +8 -8
  9. package/es/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  10. package/es/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  11. package/es/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  12. package/es/CheckBox/CheckBox.js +2 -2
  13. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +153 -250
  14. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +67 -76
  15. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +45 -45
  16. package/es/ColorSelect/_shared/ColorIndicator/__tests__/__snapshots__/ColorIndicator.spec.js.snap +9 -9
  17. package/es/ColorSelect/_shared/ColoredTag/__tests__/__snapshots__/ColoredTag.spec.js.snap +5 -5
  18. package/es/DateTime/CalendarView.js +2 -2
  19. package/es/DateTime/DateWidget.js +2 -2
  20. package/es/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  21. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +102 -102
  22. package/es/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  23. package/es/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +9 -9
  24. package/es/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +9 -9
  25. package/es/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  26. package/es/DateTime/__tests__/__snapshots__/Time.spec.js.snap +34 -34
  27. package/es/DropBox/DropBoxElement/css/cssJSLogic.js +6 -6
  28. package/es/DropDown/DropDownItem.js +1 -1
  29. package/es/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  30. package/es/DropDown/__tests__/__snapshots__/DropDownHeading.spec.js.snap +1 -1
  31. package/es/DropDown/__tests__/__snapshots__/DropDownItem.spec.js.snap +1 -1
  32. package/es/DropDown/__tests__/__snapshots__/DropDownSearch.spec.js.snap +2 -2
  33. package/es/DropDown/__tests__/__snapshots__/DropDownSeparator.spec.js.snap +1 -1
  34. package/es/Heading/__tests__/__snapshots__/Heading.spec.js.snap +7 -7
  35. package/es/Label/Label.js +1 -1
  36. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -48
  37. package/es/Layout/Box.js +1 -115
  38. package/es/Layout/Container.js +1 -132
  39. package/es/Layout/props/defaultProps.js +1 -16
  40. package/es/Layout/props/propTypes.js +1 -46
  41. package/es/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  42. package/es/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  43. package/es/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  44. package/es/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +69 -76
  45. package/es/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  46. package/es/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +62 -69
  47. package/es/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +4 -4
  48. package/es/MultiSelect/MultiSelect.js +1 -1
  49. package/es/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +9 -10
  50. package/es/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +59 -62
  51. package/es/MultiSelect/__tests__/__snapshots__/EmptyState.spec.js.snap +1 -1
  52. package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +50 -59
  53. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +7 -7
  54. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +11 -12
  55. package/es/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +7 -7
  56. package/es/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  57. package/es/Radio/Radio.js +1 -1
  58. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +117 -197
  59. package/es/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  60. package/es/Ribbon/Ribbon.js +3 -16
  61. package/es/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +21 -24
  62. package/es/Select/SelectWithAvatar.js +1 -1
  63. package/es/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +9 -9
  64. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +1015 -1015
  65. package/es/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +4 -4
  66. package/es/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +12 -12
  67. package/es/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +12 -12
  68. package/es/Switch/Switch.js +1 -1
  69. package/es/Switch/__tests__/__snapshots__/Switch.spec.js.snap +98 -110
  70. package/es/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  71. package/es/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  72. package/es/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  73. package/es/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +40 -40
  74. package/es/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  75. package/es/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  76. package/es/Tag/Tag.js +1 -2
  77. package/es/Tag/__tests__/__snapshots__/Tag.spec.js.snap +242 -334
  78. package/es/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +44 -44
  79. package/es/TextBoxIcon/TextBoxIcon.js +1 -1
  80. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +206 -206
  81. package/es/Textarea/Textarea.js +1 -1
  82. package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +46 -46
  83. package/es/Tooltip/Tooltip.js +1 -1
  84. package/es/Typography/__tests__/__snapshots__/Typography.spec.js.snap +3 -3
  85. package/es/Typography/css/cssJSLogic.js +2 -2
  86. package/es/common/basic.module.css +9 -8
  87. package/es/css.js +0 -1
  88. package/es/deprecated/Switch/Switch.js +1 -1
  89. package/es/semantic/Button/__tests__/__snapshots__/Button.spec.js.snap +1 -1
  90. package/es/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +20 -20
  91. package/es/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  92. package/es/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +8 -8
  93. package/es/v1/shared/Loader/__tests__/__snapshots__/Loader.spec.js.snap +1 -1
  94. package/es/v1/shared/SuccessTick/__tests__/__snapshots__/SuccessTick.spec.js.snap +1 -1
  95. package/lib/AppContainer/AppContainer.module.css +9 -3
  96. package/lib/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +22 -22
  97. package/lib/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +42 -42
  98. package/lib/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +73 -97
  99. package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +3 -3
  100. package/lib/Button/css/cssJSLogic.js +3 -3
  101. package/lib/Buttongroup/__tests__/__snapshots__/Buttongroup.spec.js.snap +8 -8
  102. package/lib/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  103. package/lib/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  104. package/lib/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  105. package/lib/CheckBox/CheckBox.js +2 -2
  106. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +153 -250
  107. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +67 -76
  108. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +45 -45
  109. package/lib/ColorSelect/_shared/ColorIndicator/__tests__/__snapshots__/ColorIndicator.spec.js.snap +9 -9
  110. package/lib/ColorSelect/_shared/ColoredTag/__tests__/__snapshots__/ColoredTag.spec.js.snap +5 -5
  111. package/lib/DateTime/CalendarView.js +2 -2
  112. package/lib/DateTime/DateWidget.js +2 -2
  113. package/lib/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  114. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +102 -102
  115. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  116. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +9 -9
  117. package/lib/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +9 -9
  118. package/lib/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  119. package/lib/DateTime/__tests__/__snapshots__/Time.spec.js.snap +34 -34
  120. package/lib/DropBox/DropBoxElement/css/cssJSLogic.js +2 -2
  121. package/lib/DropDown/DropDownItem.js +1 -1
  122. package/lib/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  123. package/lib/DropDown/__tests__/__snapshots__/DropDownHeading.spec.js.snap +1 -1
  124. package/lib/DropDown/__tests__/__snapshots__/DropDownItem.spec.js.snap +1 -1
  125. package/lib/DropDown/__tests__/__snapshots__/DropDownSearch.spec.js.snap +2 -2
  126. package/lib/DropDown/__tests__/__snapshots__/DropDownSeparator.spec.js.snap +1 -1
  127. package/lib/Heading/__tests__/__snapshots__/Heading.spec.js.snap +7 -7
  128. package/lib/Label/Label.js +1 -1
  129. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -48
  130. package/lib/Layout/Box.js +7 -120
  131. package/lib/Layout/Container.js +7 -137
  132. package/lib/Layout/props/defaultProps.js +14 -19
  133. package/lib/Layout/props/propTypes.js +13 -52
  134. package/lib/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  135. package/lib/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  136. package/lib/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  137. package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +69 -76
  138. package/lib/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  139. package/lib/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +62 -69
  140. package/lib/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +4 -4
  141. package/lib/MultiSelect/MultiSelect.js +1 -1
  142. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +9 -10
  143. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +59 -62
  144. package/lib/MultiSelect/__tests__/__snapshots__/EmptyState.spec.js.snap +1 -1
  145. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +50 -59
  146. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +7 -7
  147. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +11 -12
  148. package/lib/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +7 -7
  149. package/lib/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  150. package/lib/Radio/Radio.js +1 -1
  151. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +117 -197
  152. package/lib/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  153. package/lib/Ribbon/Ribbon.js +2 -15
  154. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +21 -24
  155. package/lib/Select/SelectWithAvatar.js +1 -1
  156. package/lib/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +9 -9
  157. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +1015 -1015
  158. package/lib/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +4 -4
  159. package/lib/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +12 -12
  160. package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +12 -12
  161. package/lib/Switch/Switch.js +1 -1
  162. package/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap +98 -110
  163. package/lib/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  164. package/lib/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  165. package/lib/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  166. package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +40 -40
  167. package/lib/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  168. package/lib/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  169. package/lib/Tag/Tag.js +1 -1
  170. package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap +242 -334
  171. package/lib/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +44 -44
  172. package/lib/TextBoxIcon/TextBoxIcon.js +1 -1
  173. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +206 -206
  174. package/lib/Textarea/Textarea.js +1 -1
  175. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +46 -46
  176. package/lib/Tooltip/Tooltip.js +1 -1
  177. package/lib/Typography/__tests__/__snapshots__/Typography.spec.js.snap +3 -3
  178. package/lib/Typography/css/cssJSLogic.js +1 -1
  179. package/lib/common/basic.module.css +9 -8
  180. package/lib/css.js +0 -2
  181. package/lib/deprecated/Switch/Switch.js +1 -1
  182. package/lib/semantic/Button/__tests__/__snapshots__/Button.spec.js.snap +1 -1
  183. package/lib/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +20 -20
  184. package/lib/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  185. package/lib/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +8 -8
  186. package/lib/v1/shared/Loader/__tests__/__snapshots__/Loader.spec.js.snap +1 -1
  187. package/lib/v1/shared/SuccessTick/__tests__/__snapshots__/SuccessTick.spec.js.snap +1 -1
  188. package/package.json +13 -14
  189. package/es/Layout/Layout.module.css +0 -336
  190. package/es/Layout/__tests__/Box.spec.js +0 -11
  191. package/es/Layout/__tests__/Container.spec.js +0 -11
  192. package/es/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  193. package/es/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  194. package/es/Layout/utils.js +0 -29
  195. package/lib/Layout/Layout.module.css +0 -336
  196. package/lib/Layout/__tests__/Box.spec.js +0 -18
  197. package/lib/Layout/__tests__/Container.spec.js +0 -18
  198. package/lib/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  199. package/lib/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  200. package/lib/Layout/utils.js +0 -59
package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap CHANGED
@@ -4,8 +4,7 @@ exports[`CheckBox component Should be disable 1`] = `
4
4
  <DocumentFragment>
5
5
  <div
6
6
  aria-checked="true"
7
- class="container disabled
8
- checkedprimary flex rowdir vCenter"
7
+ class="flex row alignItems_center container disabled checkedprimary"
9
8
  data-id="checkBox"
10
9
  data-selector-id="container"
11
10
  data-test-id="checkBox"
@@ -13,7 +12,7 @@ exports[`CheckBox component Should be disable 1`] = `
13
12
  tabindex="-1"
14
13
  >
15
14
  <div
16
- class="boxContainer medium filled disabled shrinkOff"
15
+ class="noShrink boxContainer medium filled disabled"
17
16
  data-id="boxComponent"
18
17
  data-selector-id="box"
19
18
  data-test-id="boxComponent"
@@ -22,7 +21,7 @@ exports[`CheckBox component Should be disable 1`] = `
22
21
  type="hidden"
23
22
  />
24
23
  <label
25
- class="checkbox disabled medium "
24
+ class="checkbox disabled medium"
26
25
  >
27
26
  <svg
28
27
  viewBox="0 0 40 40"
@@ -35,7 +34,7 @@ exports[`CheckBox component Should be disable 1`] = `
35
34
  />
36
35
  </svg>
37
36
  <svg
38
- class="tick mediumtick disabled"
37
+ class="tick mediumtick disabled"
39
38
  viewBox="0 0 44 44"
40
39
  xmlns="http://www.w3.org/2000/svg"
41
40
  >
@@ -47,16 +46,13 @@ exports[`CheckBox component Should be disable 1`] = `
47
46
  </label>
48
47
  </div>
49
48
  <div
50
- class="labelContainer grow basis shrinkOff"
49
+ class="flexible basis_zero noShrink labelContainer"
51
50
  data-id="boxComponent"
52
51
  data-selector-id="box"
53
52
  data-test-id="boxComponent"
54
53
  >
55
54
  <label
56
- class="label title medium disable font_default
57
- dotted cursor
58
-
59
- disabled "
55
+ class="label title medium disable font_default dotted cursor disabled"
60
56
  data-id="label"
61
57
  data-selector-id="label"
62
58
  data-test-id="label"
@@ -73,8 +69,7 @@ exports[`CheckBox component Should be isReadOnly 1`] = `
73
69
  <DocumentFragment>
74
70
  <div
75
71
  aria-checked="false"
76
- class="container readonly
77
- inflex rowdir vCenter"
72
+ class="inlineFlex row alignItems_center container readonly"
78
73
  data-id="checkBox"
79
74
  data-selector-id="container"
80
75
  data-test-id="checkBox"
@@ -82,7 +77,7 @@ exports[`CheckBox component Should be isReadOnly 1`] = `
82
77
  tabindex="-1"
83
78
  >
84
79
  <div
85
- class="boxContainer medium filled disabled shrinkOff"
80
+ class="noShrink boxContainer medium filled disabled"
86
81
  data-id="boxComponent"
87
82
  data-selector-id="box"
88
83
  data-test-id="boxComponent"
@@ -91,7 +86,7 @@ exports[`CheckBox component Should be isReadOnly 1`] = `
91
86
  type="hidden"
92
87
  />
93
88
  <label
94
- class="checkbox readonly medium "
89
+ class="checkbox readonly medium"
95
90
  >
96
91
  <svg
97
92
  viewBox="0 0 40 40"
@@ -117,8 +112,7 @@ exports[`CheckBox component Should be render ID 1`] = `
117
112
  <DocumentFragment>
118
113
  <div
119
114
  aria-checked="false"
120
- class="container pointer primary
121
- flex rowdir vCenter"
115
+ class="flex row alignItems_center container pointer primary"
122
116
  data-id="checkBox"
123
117
  data-selector-id="checkBoxId"
124
118
  data-test-id="checkBox"
@@ -126,7 +120,7 @@ exports[`CheckBox component Should be render ID 1`] = `
126
120
  tabindex="0"
127
121
  >
128
122
  <div
129
- class="boxContainer medium filled shrinkOff"
123
+ class="noShrink boxContainer medium filled"
130
124
  data-id="boxComponent"
131
125
  data-selector-id="box"
132
126
  data-test-id="boxComponent"
@@ -136,7 +130,7 @@ exports[`CheckBox component Should be render ID 1`] = `
136
130
  type="hidden"
137
131
  />
138
132
  <label
139
- class="checkbox pointer medium "
133
+ class="checkbox pointer medium"
140
134
  >
141
135
  <svg
142
136
  viewBox="0 0 40 40"
@@ -155,16 +149,13 @@ exports[`CheckBox component Should be render ID 1`] = `
155
149
  </label>
156
150
  </div>
157
151
  <div
158
- class="labelContainer grow basis shrinkOff"
152
+ class="flexible basis_zero noShrink labelContainer"
159
153
  data-id="boxComponent"
160
154
  data-selector-id="box"
161
155
  data-test-id="boxComponent"
162
156
  >
163
157
  <label
164
- class="label title medium default font_default
165
- dotted cursor
166
-
167
- pointer "
158
+ class="label title medium default font_default dotted cursor pointer"
168
159
  data-id="label"
169
160
  data-selector-id="label"
170
161
  data-test-id="label"
@@ -182,8 +173,7 @@ exports[`CheckBox component Should be render activeStyle is minus 1`] = `
182
173
  <DocumentFragment>
183
174
  <div
184
175
  aria-checked="false"
185
- class="container pointer primary
186
- inflex rowdir vCenter"
176
+ class="inlineFlex row alignItems_center container pointer primary"
187
177
  data-id="checkBox"
188
178
  data-selector-id="container"
189
179
  data-test-id="checkBox"
@@ -191,7 +181,7 @@ exports[`CheckBox component Should be render activeStyle is minus 1`] = `
191
181
  tabindex="0"
192
182
  >
193
183
  <div
194
- class="boxContainer medium filled shrinkOff"
184
+ class="noShrink boxContainer medium filled"
195
185
  data-id="boxComponent"
196
186
  data-selector-id="box"
197
187
  data-test-id="boxComponent"
@@ -200,7 +190,7 @@ exports[`CheckBox component Should be render activeStyle is minus 1`] = `
200
190
  type="hidden"
201
191
  />
202
192
  <label
203
- class="checkbox pointer medium "
193
+ class="checkbox pointer medium"
204
194
  >
205
195
  <svg
206
196
  viewBox="0 0 40 40"
@@ -226,8 +216,7 @@ exports[`CheckBox component Should be render dataSelectorId 1`] = `
226
216
  <DocumentFragment>
227
217
  <div
228
218
  aria-checked="false"
229
- class="container pointer primary
230
- inflex rowdir vCenter"
219
+ class="inlineFlex row alignItems_center container pointer primary"
231
220
  data-id="checkBox"
232
221
  data-selector-id="dataSelectorIdCheck"
233
222
  data-test-id="checkBox"
@@ -235,7 +224,7 @@ exports[`CheckBox component Should be render dataSelectorId 1`] = `
235
224
  tabindex="0"
236
225
  >
237
226
  <div
238
- class="boxContainer medium filled shrinkOff"
227
+ class="noShrink boxContainer medium filled"
239
228
  data-id="boxComponent"
240
229
  data-selector-id="box"
241
230
  data-test-id="boxComponent"
@@ -244,7 +233,7 @@ exports[`CheckBox component Should be render dataSelectorId 1`] = `
244
233
  type="hidden"
245
234
  />
246
235
  <label
247
- class="checkbox pointer medium "
236
+ class="checkbox pointer medium"
248
237
  >
249
238
  <svg
250
239
  viewBox="0 0 40 40"
@@ -270,8 +259,7 @@ exports[`CheckBox component Should be render disabledTitle and title 1`] = `
270
259
  <DocumentFragment>
271
260
  <div
272
261
  aria-checked="false"
273
- class="container disabled
274
- flex rowdir vCenter"
262
+ class="flex row alignItems_center container disabled"
275
263
  data-id="checkBox"
276
264
  data-selector-id="container"
277
265
  data-test-id="checkBox"
@@ -280,7 +268,7 @@ exports[`CheckBox component Should be render disabledTitle and title 1`] = `
280
268
  tabindex="-1"
281
269
  >
282
270
  <div
283
- class="boxContainer medium filled disabled shrinkOff"
271
+ class="noShrink boxContainer medium filled disabled"
284
272
  data-id="boxComponent"
285
273
  data-selector-id="box"
286
274
  data-test-id="boxComponent"
@@ -289,7 +277,7 @@ exports[`CheckBox component Should be render disabledTitle and title 1`] = `
289
277
  type="hidden"
290
278
  />
291
279
  <label
292
- class="checkbox disabled medium "
280
+ class="checkbox disabled medium"
293
281
  >
294
282
  <svg
295
283
  viewBox="0 0 40 40"
@@ -308,16 +296,13 @@ exports[`CheckBox component Should be render disabledTitle and title 1`] = `
308
296
  </label>
309
297
  </div>
310
298
  <div
311
- class="labelContainer grow basis shrinkOff"
299
+ class="flexible basis_zero noShrink labelContainer"
312
300
  data-id="boxComponent"
313
301
  data-selector-id="box"
314
302
  data-test-id="boxComponent"
315
303
  >
316
304
  <label
317
- class="label title medium disable font_default
318
- dotted cursor
319
-
320
- disabled "
305
+ class="label title medium disable font_default dotted cursor disabled"
321
306
  data-id="label"
322
307
  data-selector-id="label"
323
308
  data-test-id="label"
@@ -334,8 +319,7 @@ exports[`CheckBox component Should be render isClipped is false 1`] = `
334
319
  <DocumentFragment>
335
320
  <div
336
321
  aria-checked="false"
337
- class="container pointer primary
338
- inflex rowdir vCenter"
322
+ class="inlineFlex row alignItems_center container pointer primary"
339
323
  data-id="checkBox"
340
324
  data-selector-id="container"
341
325
  data-test-id="checkBox"
@@ -343,7 +327,7 @@ exports[`CheckBox component Should be render isClipped is false 1`] = `
343
327
  tabindex="0"
344
328
  >
345
329
  <div
346
- class="boxContainer medium filled shrinkOff"
330
+ class="noShrink boxContainer medium filled"
347
331
  data-id="boxComponent"
348
332
  data-selector-id="box"
349
333
  data-test-id="boxComponent"
@@ -352,7 +336,7 @@ exports[`CheckBox component Should be render isClipped is false 1`] = `
352
336
  type="hidden"
353
337
  />
354
338
  <label
355
- class="checkbox pointer medium "
339
+ class="checkbox pointer medium"
356
340
  >
357
341
  <svg
358
342
  viewBox="0 0 40 40"
@@ -378,8 +362,7 @@ exports[`CheckBox component Should be render isFilled 1`] = `
378
362
  <DocumentFragment>
379
363
  <div
380
364
  aria-checked="false"
381
- class="container pointer primary
382
- inflex rowdir vCenter"
365
+ class="inlineFlex row alignItems_center container pointer primary"
383
366
  data-id="checkBox"
384
367
  data-selector-id="container"
385
368
  data-test-id="checkBox"
@@ -387,7 +370,7 @@ exports[`CheckBox component Should be render isFilled 1`] = `
387
370
  tabindex="0"
388
371
  >
389
372
  <div
390
- class="boxContainer medium filled shrinkOff"
373
+ class="noShrink boxContainer medium filled"
391
374
  data-id="boxComponent"
392
375
  data-selector-id="box"
393
376
  data-test-id="boxComponent"
@@ -396,7 +379,7 @@ exports[`CheckBox component Should be render isFilled 1`] = `
396
379
  type="hidden"
397
380
  />
398
381
  <label
399
- class="checkbox pointer medium "
382
+ class="checkbox pointer medium"
400
383
  >
401
384
  <svg
402
385
  viewBox="0 0 40 40"
@@ -422,8 +405,7 @@ exports[`CheckBox component Should be render name 1`] = `
422
405
  <DocumentFragment>
423
406
  <div
424
407
  aria-checked="false"
425
- class="container pointer primary
426
- inflex rowdir vCenter"
408
+ class="inlineFlex row alignItems_center container pointer primary"
427
409
  data-id="checkBox"
428
410
  data-selector-id="container"
429
411
  data-test-id="checkBox"
@@ -431,7 +413,7 @@ exports[`CheckBox component Should be render name 1`] = `
431
413
  tabindex="0"
432
414
  >
433
415
  <div
434
- class="boxContainer medium filled shrinkOff"
416
+ class="noShrink boxContainer medium filled"
435
417
  data-id="boxComponent"
436
418
  data-selector-id="box"
437
419
  data-test-id="boxComponent"
@@ -441,7 +423,7 @@ exports[`CheckBox component Should be render name 1`] = `
441
423
  type="hidden"
442
424
  />
443
425
  <label
444
- class="checkbox pointer medium "
426
+ class="checkbox pointer medium"
445
427
  >
446
428
  <svg
447
429
  viewBox="0 0 40 40"
@@ -467,8 +449,7 @@ exports[`CheckBox component Should be render text 1`] = `
467
449
  <DocumentFragment>
468
450
  <div
469
451
  aria-checked="false"
470
- class="container pointer primary
471
- flex rowdir vCenter"
452
+ class="flex row alignItems_center container pointer primary"
472
453
  data-id="checkBox"
473
454
  data-selector-id="container"
474
455
  data-test-id="checkBox"
@@ -476,7 +457,7 @@ exports[`CheckBox component Should be render text 1`] = `
476
457
  tabindex="0"
477
458
  >
478
459
  <div
479
- class="boxContainer medium filled shrinkOff"
460
+ class="noShrink boxContainer medium filled"
480
461
  data-id="boxComponent"
481
462
  data-selector-id="box"
482
463
  data-test-id="boxComponent"
@@ -485,7 +466,7 @@ exports[`CheckBox component Should be render text 1`] = `
485
466
  type="hidden"
486
467
  />
487
468
  <label
488
- class="checkbox pointer medium "
469
+ class="checkbox pointer medium"
489
470
  >
490
471
  <svg
491
472
  viewBox="0 0 40 40"
@@ -504,16 +485,13 @@ exports[`CheckBox component Should be render text 1`] = `
504
485
  </label>
505
486
  </div>
506
487
  <div
507
- class="labelContainer grow basis shrinkOff"
488
+ class="flexible basis_zero noShrink labelContainer"
508
489
  data-id="boxComponent"
509
490
  data-selector-id="box"
510
491
  data-test-id="boxComponent"
511
492
  >
512
493
  <label
513
- class="label title medium default font_default
514
- dotted cursor
515
-
516
- pointer "
494
+ class="label title medium default font_default dotted cursor pointer"
517
495
  data-id="label"
518
496
  data-selector-id="label"
519
497
  data-test-id="label"
@@ -530,8 +508,7 @@ exports[`CheckBox component Should be render title 1`] = `
530
508
  <DocumentFragment>
531
509
  <div
532
510
  aria-checked="false"
533
- class="container pointer primary
534
- flex rowdir vCenter"
511
+ class="flex row alignItems_center container pointer primary"
535
512
  data-id="checkBox"
536
513
  data-selector-id="container"
537
514
  data-test-id="checkBox"
@@ -540,7 +517,7 @@ exports[`CheckBox component Should be render title 1`] = `
540
517
  tabindex="0"
541
518
  >
542
519
  <div
543
- class="boxContainer medium filled shrinkOff"
520
+ class="noShrink boxContainer medium filled"
544
521
  data-id="boxComponent"
545
522
  data-selector-id="box"
546
523
  data-test-id="boxComponent"
@@ -549,7 +526,7 @@ exports[`CheckBox component Should be render title 1`] = `
549
526
  type="hidden"
550
527
  />
551
528
  <label
552
- class="checkbox pointer medium "
529
+ class="checkbox pointer medium"
553
530
  >
554
531
  <svg
555
532
  viewBox="0 0 40 40"
@@ -568,16 +545,13 @@ exports[`CheckBox component Should be render title 1`] = `
568
545
  </label>
569
546
  </div>
570
547
  <div
571
- class="labelContainer grow basis shrinkOff"
548
+ class="flexible basis_zero noShrink labelContainer"
572
549
  data-id="boxComponent"
573
550
  data-selector-id="box"
574
551
  data-test-id="boxComponent"
575
552
  >
576
553
  <label
577
- class="label title medium default font_default
578
- dotted cursor
579
-
580
- pointer "
554
+ class="label title medium default font_default dotted cursor pointer"
581
555
  data-id="label"
582
556
  data-selector-id="label"
583
557
  data-test-id="label"
@@ -594,8 +568,7 @@ exports[`CheckBox component Should be render with the basic set of default props
594
568
  <DocumentFragment>
595
569
  <div
596
570
  aria-checked="false"
597
- class="container pointer primary
598
- inflex rowdir vCenter"
571
+ class="inlineFlex row alignItems_center container pointer primary"
599
572
  data-id="checkBox"
600
573
  data-selector-id="container"
601
574
  data-test-id="checkBox"
@@ -603,7 +576,7 @@ exports[`CheckBox component Should be render with the basic set of default props
603
576
  tabindex="0"
604
577
  >
605
578
  <div
606
- class="boxContainer medium filled shrinkOff"
579
+ class="noShrink boxContainer medium filled"
607
580
  data-id="boxComponent"
608
581
  data-selector-id="box"
609
582
  data-test-id="boxComponent"
@@ -612,7 +585,7 @@ exports[`CheckBox component Should be render with the basic set of default props
612
585
  type="hidden"
613
586
  />
614
587
  <label
615
- class="checkbox pointer medium "
588
+ class="checkbox pointer medium"
616
589
  >
617
590
  <svg
618
591
  viewBox="0 0 40 40"
@@ -638,8 +611,7 @@ exports[`CheckBox component Should render active - danger 1`] = `
638
611
  <DocumentFragment>
639
612
  <div
640
613
  aria-checked="true"
641
- class="container pointer danger
642
- checkeddanger flex rowdir vCenter"
614
+ class="flex row alignItems_center container pointer danger checkeddanger"
643
615
  data-id="checkBox"
644
616
  data-selector-id="container"
645
617
  data-test-id="checkBox"
@@ -647,7 +619,7 @@ exports[`CheckBox component Should render active - danger 1`] = `
647
619
  tabindex="0"
648
620
  >
649
621
  <div
650
- class="boxContainer medium filled shrinkOff"
622
+ class="noShrink boxContainer medium filled"
651
623
  data-id="boxComponent"
652
624
  data-selector-id="box"
653
625
  data-test-id="boxComponent"
@@ -656,7 +628,7 @@ exports[`CheckBox component Should render active - danger 1`] = `
656
628
  type="hidden"
657
629
  />
658
630
  <label
659
- class="checkbox pointer medium "
631
+ class="checkbox pointer medium"
660
632
  >
661
633
  <svg
662
634
  viewBox="0 0 40 40"
@@ -669,7 +641,7 @@ exports[`CheckBox component Should render active - danger 1`] = `
669
641
  />
670
642
  </svg>
671
643
  <svg
672
- class="tick mediumtick "
644
+ class="tick mediumtick"
673
645
  viewBox="0 0 44 44"
674
646
  xmlns="http://www.w3.org/2000/svg"
675
647
  >
@@ -681,16 +653,13 @@ exports[`CheckBox component Should render active - danger 1`] = `
681
653
  </label>
682
654
  </div>
683
655
  <div
684
- class="labelContainer grow basis shrinkOff"
656
+ class="flexible basis_zero noShrink labelContainer"
685
657
  data-id="boxComponent"
686
658
  data-selector-id="box"
687
659
  data-test-id="boxComponent"
688
660
  >
689
661
  <label
690
- class="label title medium default font_default
691
- dotted cursor activedangerLabel
692
- checkeddangerLabel
693
- pointer "
662
+ class="label title medium default font_default dotted cursor activedangerLabel checkeddangerLabel pointer"
694
663
  data-id="label"
695
664
  data-selector-id="label"
696
665
  data-test-id="label"
@@ -707,8 +676,7 @@ exports[`CheckBox component Should render active - primary 1`] = `
707
676
  <DocumentFragment>
708
677
  <div
709
678
  aria-checked="true"
710
- class="container pointer primary
711
- checkedprimary flex rowdir vCenter"
679
+ class="flex row alignItems_center container pointer primary checkedprimary"
712
680
  data-id="checkBox"
713
681
  data-selector-id="container"
714
682
  data-test-id="checkBox"
@@ -716,7 +684,7 @@ exports[`CheckBox component Should render active - primary 1`] = `
716
684
  tabindex="0"
717
685
  >
718
686
  <div
719
- class="boxContainer medium filled shrinkOff"
687
+ class="noShrink boxContainer medium filled"
720
688
  data-id="boxComponent"
721
689
  data-selector-id="box"
722
690
  data-test-id="boxComponent"
@@ -725,7 +693,7 @@ exports[`CheckBox component Should render active - primary 1`] = `
725
693
  type="hidden"
726
694
  />
727
695
  <label
728
- class="checkbox pointer medium "
696
+ class="checkbox pointer medium"
729
697
  >
730
698
  <svg
731
699
  viewBox="0 0 40 40"
@@ -738,7 +706,7 @@ exports[`CheckBox component Should render active - primary 1`] = `
738
706
  />
739
707
  </svg>
740
708
  <svg
741
- class="tick mediumtick "
709
+ class="tick mediumtick"
742
710
  viewBox="0 0 44 44"
743
711
  xmlns="http://www.w3.org/2000/svg"
744
712
  >
@@ -750,16 +718,13 @@ exports[`CheckBox component Should render active - primary 1`] = `
750
718
  </label>
751
719
  </div>
752
720
  <div
753
- class="labelContainer grow basis shrinkOff"
721
+ class="flexible basis_zero noShrink labelContainer"
754
722
  data-id="boxComponent"
755
723
  data-selector-id="box"
756
724
  data-test-id="boxComponent"
757
725
  >
758
726
  <label
759
- class="label title medium default font_default
760
- dotted cursor activeprimaryLabel
761
- checkedprimaryLabel
762
- pointer "
727
+ class="label title medium default font_default dotted cursor activeprimaryLabel checkedprimaryLabel pointer"
763
728
  data-id="label"
764
729
  data-selector-id="label"
765
730
  data-test-id="label"
@@ -776,8 +741,7 @@ exports[`CheckBox component Should render labelSize - default 1`] = `
776
741
  <DocumentFragment>
777
742
  <div
778
743
  aria-checked="false"
779
- class="container pointer primary
780
- flex rowdir vCenter"
744
+ class="flex row alignItems_center container pointer primary"
781
745
  data-id="checkBox"
782
746
  data-selector-id="container"
783
747
  data-test-id="checkBox"
@@ -785,7 +749,7 @@ exports[`CheckBox component Should render labelSize - default 1`] = `
785
749
  tabindex="0"
786
750
  >
787
751
  <div
788
- class="boxContainer medium filled shrinkOff"
752
+ class="noShrink boxContainer medium filled"
789
753
  data-id="boxComponent"
790
754
  data-selector-id="box"
791
755
  data-test-id="boxComponent"
@@ -794,7 +758,7 @@ exports[`CheckBox component Should render labelSize - default 1`] = `
794
758
  type="hidden"
795
759
  />
796
760
  <label
797
- class="checkbox pointer medium "
761
+ class="checkbox pointer medium"
798
762
  >
799
763
  <svg
800
764
  viewBox="0 0 40 40"
@@ -813,16 +777,13 @@ exports[`CheckBox component Should render labelSize - default 1`] = `
813
777
  </label>
814
778
  </div>
815
779
  <div
816
- class="labelContainer grow basis shrinkOff"
780
+ class="flexible basis_zero noShrink labelContainer"
817
781
  data-id="boxComponent"
818
782
  data-selector-id="box"
819
783
  data-test-id="boxComponent"
820
784
  >
821
785
  <label
822
- class="label title medium default font_default
823
- dotted cursor
824
-
825
- pointer "
786
+ class="label title medium default font_default dotted cursor pointer"
826
787
  data-id="label"
827
788
  data-selector-id="label"
828
789
  data-test-id="label"
@@ -839,8 +800,7 @@ exports[`CheckBox component Should render labelSize - large 1`] = `
839
800
  <DocumentFragment>
840
801
  <div
841
802
  aria-checked="false"
842
- class="container pointer primary
843
- flex rowdir vCenter"
803
+ class="flex row alignItems_center container pointer primary"
844
804
  data-id="checkBox"
845
805
  data-selector-id="container"
846
806
  data-test-id="checkBox"
@@ -848,7 +808,7 @@ exports[`CheckBox component Should render labelSize - large 1`] = `
848
808
  tabindex="0"
849
809
  >
850
810
  <div
851
- class="boxContainer medium filled shrinkOff"
811
+ class="noShrink boxContainer medium filled"
852
812
  data-id="boxComponent"
853
813
  data-selector-id="box"
854
814
  data-test-id="boxComponent"
@@ -857,7 +817,7 @@ exports[`CheckBox component Should render labelSize - large 1`] = `
857
817
  type="hidden"
858
818
  />
859
819
  <label
860
- class="checkbox pointer medium "
820
+ class="checkbox pointer medium"
861
821
  >
862
822
  <svg
863
823
  viewBox="0 0 40 40"
@@ -876,16 +836,13 @@ exports[`CheckBox component Should render labelSize - large 1`] = `
876
836
  </label>
877
837
  </div>
878
838
  <div
879
- class="labelContainer grow basis shrinkOff"
839
+ class="flexible basis_zero noShrink labelContainer"
880
840
  data-id="boxComponent"
881
841
  data-selector-id="box"
882
842
  data-test-id="boxComponent"
883
843
  >
884
844
  <label
885
- class="label title large default font_default
886
- dotted cursor
887
-
888
- pointer "
845
+ class="label title large default font_default dotted cursor pointer"
889
846
  data-id="label"
890
847
  data-selector-id="label"
891
848
  data-test-id="label"
@@ -902,8 +859,7 @@ exports[`CheckBox component Should render labelSize - medium 1`] = `
902
859
  <DocumentFragment>
903
860
  <div
904
861
  aria-checked="false"
905
- class="container pointer primary
906
- flex rowdir vCenter"
862
+ class="flex row alignItems_center container pointer primary"
907
863
  data-id="checkBox"
908
864
  data-selector-id="container"
909
865
  data-test-id="checkBox"
@@ -911,7 +867,7 @@ exports[`CheckBox component Should render labelSize - medium 1`] = `
911
867
  tabindex="0"
912
868
  >
913
869
  <div
914
- class="boxContainer medium filled shrinkOff"
870
+ class="noShrink boxContainer medium filled"
915
871
  data-id="boxComponent"
916
872
  data-selector-id="box"
917
873
  data-test-id="boxComponent"
@@ -920,7 +876,7 @@ exports[`CheckBox component Should render labelSize - medium 1`] = `
920
876
  type="hidden"
921
877
  />
922
878
  <label
923
- class="checkbox pointer medium "
879
+ class="checkbox pointer medium"
924
880
  >
925
881
  <svg
926
882
  viewBox="0 0 40 40"
@@ -939,16 +895,13 @@ exports[`CheckBox component Should render labelSize - medium 1`] = `
939
895
  </label>
940
896
  </div>
941
897
  <div
942
- class="labelContainer grow basis shrinkOff"
898
+ class="flexible basis_zero noShrink labelContainer"
943
899
  data-id="boxComponent"
944
900
  data-selector-id="box"
945
901
  data-test-id="boxComponent"
946
902
  >
947
903
  <label
948
- class="label title medium default font_default
949
- dotted cursor
950
-
951
- pointer "
904
+ class="label title medium default font_default dotted cursor pointer"
952
905
  data-id="label"
953
906
  data-selector-id="label"
954
907
  data-test-id="label"
@@ -965,8 +918,7 @@ exports[`CheckBox component Should render labelSize - primary 1`] = `
965
918
  <DocumentFragment>
966
919
  <div
967
920
  aria-checked="false"
968
- class="container pointer primary
969
- flex rowdir vCenter"
921
+ class="flex row alignItems_center container pointer primary"
970
922
  data-id="checkBox"
971
923
  data-selector-id="container"
972
924
  data-test-id="checkBox"
@@ -974,7 +926,7 @@ exports[`CheckBox component Should render labelSize - primary 1`] = `
974
926
  tabindex="0"
975
927
  >
976
928
  <div
977
- class="boxContainer medium filled shrinkOff"
929
+ class="noShrink boxContainer medium filled"
978
930
  data-id="boxComponent"
979
931
  data-selector-id="box"
980
932
  data-test-id="boxComponent"
@@ -983,7 +935,7 @@ exports[`CheckBox component Should render labelSize - primary 1`] = `
983
935
  type="hidden"
984
936
  />
985
937
  <label
986
- class="checkbox pointer medium "
938
+ class="checkbox pointer medium"
987
939
  >
988
940
  <svg
989
941
  viewBox="0 0 40 40"
@@ -1002,16 +954,13 @@ exports[`CheckBox component Should render labelSize - primary 1`] = `
1002
954
  </label>
1003
955
  </div>
1004
956
  <div
1005
- class="labelContainer grow basis shrinkOff"
957
+ class="flexible basis_zero noShrink labelContainer"
1006
958
  data-id="boxComponent"
1007
959
  data-selector-id="box"
1008
960
  data-test-id="boxComponent"
1009
961
  >
1010
962
  <label
1011
- class="label title medium default font_primary
1012
- dotted cursor
1013
-
1014
- pointer "
963
+ class="label title medium default font_primary dotted cursor pointer"
1015
964
  data-id="label"
1016
965
  data-selector-id="label"
1017
966
  data-test-id="label"
@@ -1028,8 +977,7 @@ exports[`CheckBox component Should render labelSize - small 1`] = `
1028
977
  <DocumentFragment>
1029
978
  <div
1030
979
  aria-checked="false"
1031
- class="container pointer primary
1032
- flex rowdir vCenter"
980
+ class="flex row alignItems_center container pointer primary"
1033
981
  data-id="checkBox"
1034
982
  data-selector-id="container"
1035
983
  data-test-id="checkBox"
@@ -1037,7 +985,7 @@ exports[`CheckBox component Should render labelSize - small 1`] = `
1037
985
  tabindex="0"
1038
986
  >
1039
987
  <div
1040
- class="boxContainer medium filled shrinkOff"
988
+ class="noShrink boxContainer medium filled"
1041
989
  data-id="boxComponent"
1042
990
  data-selector-id="box"
1043
991
  data-test-id="boxComponent"
@@ -1046,7 +994,7 @@ exports[`CheckBox component Should render labelSize - small 1`] = `
1046
994
  type="hidden"
1047
995
  />
1048
996
  <label
1049
- class="checkbox pointer medium "
997
+ class="checkbox pointer medium"
1050
998
  >
1051
999
  <svg
1052
1000
  viewBox="0 0 40 40"
@@ -1065,16 +1013,13 @@ exports[`CheckBox component Should render labelSize - small 1`] = `
1065
1013
  </label>
1066
1014
  </div>
1067
1015
  <div
1068
- class="labelContainer grow basis shrinkOff"
1016
+ class="flexible basis_zero noShrink labelContainer"
1069
1017
  data-id="boxComponent"
1070
1018
  data-selector-id="box"
1071
1019
  data-test-id="boxComponent"
1072
1020
  >
1073
1021
  <label
1074
- class="label title small default font_default
1075
- dotted cursor
1076
-
1077
- pointer "
1022
+ class="label title small default font_default dotted cursor pointer"
1078
1023
  data-id="label"
1079
1024
  data-selector-id="label"
1080
1025
  data-test-id="label"
@@ -1091,8 +1036,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - da
1091
1036
  <DocumentFragment>
1092
1037
  <div
1093
1038
  aria-checked="true"
1094
- class="container pointer danger
1095
- checkeddanger flex rowdir vCenter"
1039
+ class="flex row alignItems_center container pointer danger checkeddanger"
1096
1040
  data-id="checkBox"
1097
1041
  data-selector-id="container"
1098
1042
  data-test-id="checkBox"
@@ -1100,7 +1044,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - da
1100
1044
  tabindex="0"
1101
1045
  >
1102
1046
  <div
1103
- class="boxContainer medium filled shrinkOff"
1047
+ class="noShrink boxContainer medium filled"
1104
1048
  data-id="boxComponent"
1105
1049
  data-selector-id="box"
1106
1050
  data-test-id="boxComponent"
@@ -1109,7 +1053,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - da
1109
1053
  type="hidden"
1110
1054
  />
1111
1055
  <label
1112
- class="checkbox pointer medium "
1056
+ class="checkbox pointer medium"
1113
1057
  >
1114
1058
  <svg
1115
1059
  viewBox="0 0 40 40"
@@ -1122,7 +1066,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - da
1122
1066
  />
1123
1067
  </svg>
1124
1068
  <svg
1125
- class="tick mediumtick "
1069
+ class="tick mediumtick"
1126
1070
  viewBox="0 0 44 44"
1127
1071
  xmlns="http://www.w3.org/2000/svg"
1128
1072
  >
@@ -1134,16 +1078,13 @@ exports[`CheckBox component Should render palette and checkbox with checked - da
1134
1078
  </label>
1135
1079
  </div>
1136
1080
  <div
1137
- class="labelContainer grow basis shrinkOff"
1081
+ class="flexible basis_zero noShrink labelContainer"
1138
1082
  data-id="boxComponent"
1139
1083
  data-selector-id="box"
1140
1084
  data-test-id="boxComponent"
1141
1085
  >
1142
1086
  <label
1143
- class="label title medium default font_default
1144
- dotted cursor activedangerLabel
1145
- checkeddangerLabel
1146
- pointer "
1087
+ class="label title medium default font_default dotted cursor activedangerLabel checkeddangerLabel pointer"
1147
1088
  data-id="label"
1148
1089
  data-selector-id="label"
1149
1090
  data-test-id="label"
@@ -1160,8 +1101,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - pr
1160
1101
  <DocumentFragment>
1161
1102
  <div
1162
1103
  aria-checked="true"
1163
- class="container pointer primary
1164
- checkedprimary flex rowdir vCenter"
1104
+ class="flex row alignItems_center container pointer primary checkedprimary"
1165
1105
  data-id="checkBox"
1166
1106
  data-selector-id="container"
1167
1107
  data-test-id="checkBox"
@@ -1169,7 +1109,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - pr
1169
1109
  tabindex="0"
1170
1110
  >
1171
1111
  <div
1172
- class="boxContainer medium filled shrinkOff"
1112
+ class="noShrink boxContainer medium filled"
1173
1113
  data-id="boxComponent"
1174
1114
  data-selector-id="box"
1175
1115
  data-test-id="boxComponent"
@@ -1178,7 +1118,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - pr
1178
1118
  type="hidden"
1179
1119
  />
1180
1120
  <label
1181
- class="checkbox pointer medium "
1121
+ class="checkbox pointer medium"
1182
1122
  >
1183
1123
  <svg
1184
1124
  viewBox="0 0 40 40"
@@ -1191,7 +1131,7 @@ exports[`CheckBox component Should render palette and checkbox with checked - pr
1191
1131
  />
1192
1132
  </svg>
1193
1133
  <svg
1194
- class="tick mediumtick "
1134
+ class="tick mediumtick"
1195
1135
  viewBox="0 0 44 44"
1196
1136
  xmlns="http://www.w3.org/2000/svg"
1197
1137
  >
@@ -1203,16 +1143,13 @@ exports[`CheckBox component Should render palette and checkbox with checked - pr
1203
1143
  </label>
1204
1144
  </div>
1205
1145
  <div
1206
- class="labelContainer grow basis shrinkOff"
1146
+ class="flexible basis_zero noShrink labelContainer"
1207
1147
  data-id="boxComponent"
1208
1148
  data-selector-id="box"
1209
1149
  data-test-id="boxComponent"
1210
1150
  >
1211
1151
  <label
1212
- class="label title medium default font_default
1213
- dotted cursor activeprimaryLabel
1214
- checkedprimaryLabel
1215
- pointer "
1152
+ class="label title medium default font_default dotted cursor activeprimaryLabel checkedprimaryLabel pointer"
1216
1153
  data-id="label"
1217
1154
  data-selector-id="label"
1218
1155
  data-test-id="label"
@@ -1229,8 +1166,7 @@ exports[`CheckBox component Should render secondaryText 1`] = `
1229
1166
  <DocumentFragment>
1230
1167
  <div
1231
1168
  aria-checked="false"
1232
- class="container pointer primary
1233
- flex rowdir vCenter"
1169
+ class="flex row alignItems_center container pointer primary"
1234
1170
  data-id="checkBox"
1235
1171
  data-selector-id="container"
1236
1172
  data-test-id="checkBox"
@@ -1238,7 +1174,7 @@ exports[`CheckBox component Should render secondaryText 1`] = `
1238
1174
  tabindex="0"
1239
1175
  >
1240
1176
  <div
1241
- class="boxContainer withSecondaryText medium filled shrinkOff selfStart"
1177
+ class="noShrink alignSelf_start boxContainer withSecondaryText medium filled"
1242
1178
  data-id="boxComponent"
1243
1179
  data-selector-id="box"
1244
1180
  data-test-id="boxComponent"
@@ -1247,7 +1183,7 @@ exports[`CheckBox component Should render secondaryText 1`] = `
1247
1183
  type="hidden"
1248
1184
  />
1249
1185
  <label
1250
- class="checkbox pointer medium "
1186
+ class="checkbox pointer medium"
1251
1187
  >
1252
1188
  <svg
1253
1189
  viewBox="0 0 40 40"
@@ -1266,16 +1202,13 @@ exports[`CheckBox component Should render secondaryText 1`] = `
1266
1202
  </label>
1267
1203
  </div>
1268
1204
  <div
1269
- class="labelContainer grow basis shrinkOff"
1205
+ class="flexible basis_zero noShrink labelContainer"
1270
1206
  data-id="boxComponent"
1271
1207
  data-selector-id="box"
1272
1208
  data-test-id="boxComponent"
1273
1209
  >
1274
1210
  <label
1275
- class="label title medium default font_default
1276
- dotted cursor
1277
-
1278
- pointer "
1211
+ class="label title medium default font_default dotted cursor pointer"
1279
1212
  data-id="label"
1280
1213
  data-selector-id="label"
1281
1214
  data-test-id="label"
@@ -1284,7 +1217,7 @@ exports[`CheckBox component Should render secondaryText 1`] = `
1284
1217
  checkboxText
1285
1218
  </label>
1286
1219
  <div
1287
- class="size12 lineheight_1_2 secondaryText "
1220
+ class="size12 lineheight_1_2 secondaryText"
1288
1221
  data-title="secondaryText"
1289
1222
  >
1290
1223
  secondaryText
@@ -1298,8 +1231,7 @@ exports[`CheckBox component Should render size - danger 1`] = `
1298
1231
  <DocumentFragment>
1299
1232
  <div
1300
1233
  aria-checked="false"
1301
- class="container pointer primary
1302
- flex rowdir vCenter"
1234
+ class="flex row alignItems_center container pointer primary"
1303
1235
  data-id="checkBox"
1304
1236
  data-selector-id="container"
1305
1237
  data-test-id="checkBox"
@@ -1307,7 +1239,7 @@ exports[`CheckBox component Should render size - danger 1`] = `
1307
1239
  tabindex="0"
1308
1240
  >
1309
1241
  <div
1310
- class="boxContainer medium filled shrinkOff"
1242
+ class="noShrink boxContainer medium filled"
1311
1243
  data-id="boxComponent"
1312
1244
  data-selector-id="box"
1313
1245
  data-test-id="boxComponent"
@@ -1316,7 +1248,7 @@ exports[`CheckBox component Should render size - danger 1`] = `
1316
1248
  type="hidden"
1317
1249
  />
1318
1250
  <label
1319
- class="checkbox pointer medium "
1251
+ class="checkbox pointer medium"
1320
1252
  >
1321
1253
  <svg
1322
1254
  viewBox="0 0 40 40"
@@ -1335,16 +1267,13 @@ exports[`CheckBox component Should render size - danger 1`] = `
1335
1267
  </label>
1336
1268
  </div>
1337
1269
  <div
1338
- class="labelContainer grow basis shrinkOff"
1270
+ class="flexible basis_zero noShrink labelContainer"
1339
1271
  data-id="boxComponent"
1340
1272
  data-selector-id="box"
1341
1273
  data-test-id="boxComponent"
1342
1274
  >
1343
1275
  <label
1344
- class="label title medium danger font_default
1345
- dotted cursor
1346
-
1347
- pointer "
1276
+ class="label title medium danger font_default dotted cursor pointer"
1348
1277
  data-id="label"
1349
1278
  data-selector-id="label"
1350
1279
  data-test-id="label"
@@ -1361,8 +1290,7 @@ exports[`CheckBox component Should render size - default 1`] = `
1361
1290
  <DocumentFragment>
1362
1291
  <div
1363
1292
  aria-checked="false"
1364
- class="container pointer primary
1365
- flex rowdir vCenter"
1293
+ class="flex row alignItems_center container pointer primary"
1366
1294
  data-id="checkBox"
1367
1295
  data-selector-id="container"
1368
1296
  data-test-id="checkBox"
@@ -1370,7 +1298,7 @@ exports[`CheckBox component Should render size - default 1`] = `
1370
1298
  tabindex="0"
1371
1299
  >
1372
1300
  <div
1373
- class="boxContainer medium filled shrinkOff"
1301
+ class="noShrink boxContainer medium filled"
1374
1302
  data-id="boxComponent"
1375
1303
  data-selector-id="box"
1376
1304
  data-test-id="boxComponent"
@@ -1379,7 +1307,7 @@ exports[`CheckBox component Should render size - default 1`] = `
1379
1307
  type="hidden"
1380
1308
  />
1381
1309
  <label
1382
- class="checkbox pointer medium "
1310
+ class="checkbox pointer medium"
1383
1311
  >
1384
1312
  <svg
1385
1313
  viewBox="0 0 40 40"
@@ -1398,16 +1326,13 @@ exports[`CheckBox component Should render size - default 1`] = `
1398
1326
  </label>
1399
1327
  </div>
1400
1328
  <div
1401
- class="labelContainer grow basis shrinkOff"
1329
+ class="flexible basis_zero noShrink labelContainer"
1402
1330
  data-id="boxComponent"
1403
1331
  data-selector-id="box"
1404
1332
  data-test-id="boxComponent"
1405
1333
  >
1406
1334
  <label
1407
- class="label title medium default font_default
1408
- dotted cursor
1409
-
1410
- pointer "
1335
+ class="label title medium default font_default dotted cursor pointer"
1411
1336
  data-id="label"
1412
1337
  data-selector-id="label"
1413
1338
  data-test-id="label"
@@ -1424,8 +1349,7 @@ exports[`CheckBox component Should render size - mandatory 1`] = `
1424
1349
  <DocumentFragment>
1425
1350
  <div
1426
1351
  aria-checked="false"
1427
- class="container pointer primary
1428
- flex rowdir vCenter"
1352
+ class="flex row alignItems_center container pointer primary"
1429
1353
  data-id="checkBox"
1430
1354
  data-selector-id="container"
1431
1355
  data-test-id="checkBox"
@@ -1433,7 +1357,7 @@ exports[`CheckBox component Should render size - mandatory 1`] = `
1433
1357
  tabindex="0"
1434
1358
  >
1435
1359
  <div
1436
- class="boxContainer medium filled shrinkOff"
1360
+ class="noShrink boxContainer medium filled"
1437
1361
  data-id="boxComponent"
1438
1362
  data-selector-id="box"
1439
1363
  data-test-id="boxComponent"
@@ -1442,7 +1366,7 @@ exports[`CheckBox component Should render size - mandatory 1`] = `
1442
1366
  type="hidden"
1443
1367
  />
1444
1368
  <label
1445
- class="checkbox pointer medium "
1369
+ class="checkbox pointer medium"
1446
1370
  >
1447
1371
  <svg
1448
1372
  viewBox="0 0 40 40"
@@ -1461,16 +1385,13 @@ exports[`CheckBox component Should render size - mandatory 1`] = `
1461
1385
  </label>
1462
1386
  </div>
1463
1387
  <div
1464
- class="labelContainer grow basis shrinkOff"
1388
+ class="flexible basis_zero noShrink labelContainer"
1465
1389
  data-id="boxComponent"
1466
1390
  data-selector-id="box"
1467
1391
  data-test-id="boxComponent"
1468
1392
  >
1469
1393
  <label
1470
- class="label title medium mandatory font_default
1471
- dotted cursor
1472
-
1473
- pointer "
1394
+ class="label title medium mandatory font_default dotted cursor pointer"
1474
1395
  data-id="label"
1475
1396
  data-selector-id="label"
1476
1397
  data-test-id="label"
@@ -1487,8 +1408,7 @@ exports[`CheckBox component Should render size - medium 1`] = `
1487
1408
  <DocumentFragment>
1488
1409
  <div
1489
1410
  aria-checked="true"
1490
- class="container pointer primary
1491
- checkedprimary inflex rowdir vCenter"
1411
+ class="inlineFlex row alignItems_center container pointer primary checkedprimary"
1492
1412
  data-id="checkBox"
1493
1413
  data-selector-id="container"
1494
1414
  data-test-id="checkBox"
@@ -1496,7 +1416,7 @@ exports[`CheckBox component Should render size - medium 1`] = `
1496
1416
  tabindex="0"
1497
1417
  >
1498
1418
  <div
1499
- class="boxContainer medium filled shrinkOff"
1419
+ class="noShrink boxContainer medium filled"
1500
1420
  data-id="boxComponent"
1501
1421
  data-selector-id="box"
1502
1422
  data-test-id="boxComponent"
@@ -1505,7 +1425,7 @@ exports[`CheckBox component Should render size - medium 1`] = `
1505
1425
  type="hidden"
1506
1426
  />
1507
1427
  <label
1508
- class="checkbox pointer medium "
1428
+ class="checkbox pointer medium"
1509
1429
  >
1510
1430
  <svg
1511
1431
  viewBox="0 0 40 40"
@@ -1518,7 +1438,7 @@ exports[`CheckBox component Should render size - medium 1`] = `
1518
1438
  />
1519
1439
  </svg>
1520
1440
  <svg
1521
- class="tick mediumtick "
1441
+ class="tick mediumtick"
1522
1442
  viewBox="0 0 44 44"
1523
1443
  xmlns="http://www.w3.org/2000/svg"
1524
1444
  >
@@ -1537,8 +1457,7 @@ exports[`CheckBox component Should render size - primary 1`] = `
1537
1457
  <DocumentFragment>
1538
1458
  <div
1539
1459
  aria-checked="false"
1540
- class="container pointer primary
1541
- flex rowdir vCenter"
1460
+ class="flex row alignItems_center container pointer primary"
1542
1461
  data-id="checkBox"
1543
1462
  data-selector-id="container"
1544
1463
  data-test-id="checkBox"
@@ -1546,7 +1465,7 @@ exports[`CheckBox component Should render size - primary 1`] = `
1546
1465
  tabindex="0"
1547
1466
  >
1548
1467
  <div
1549
- class="boxContainer medium filled shrinkOff"
1468
+ class="noShrink boxContainer medium filled"
1550
1469
  data-id="boxComponent"
1551
1470
  data-selector-id="box"
1552
1471
  data-test-id="boxComponent"
@@ -1555,7 +1474,7 @@ exports[`CheckBox component Should render size - primary 1`] = `
1555
1474
  type="hidden"
1556
1475
  />
1557
1476
  <label
1558
- class="checkbox pointer medium "
1477
+ class="checkbox pointer medium"
1559
1478
  >
1560
1479
  <svg
1561
1480
  viewBox="0 0 40 40"
@@ -1574,16 +1493,13 @@ exports[`CheckBox component Should render size - primary 1`] = `
1574
1493
  </label>
1575
1494
  </div>
1576
1495
  <div
1577
- class="labelContainer grow basis shrinkOff"
1496
+ class="flexible basis_zero noShrink labelContainer"
1578
1497
  data-id="boxComponent"
1579
1498
  data-selector-id="box"
1580
1499
  data-test-id="boxComponent"
1581
1500
  >
1582
1501
  <label
1583
- class="label title medium primary font_default
1584
- dotted cursor
1585
-
1586
- pointer "
1502
+ class="label title medium primary font_default dotted cursor pointer"
1587
1503
  data-id="label"
1588
1504
  data-selector-id="label"
1589
1505
  data-test-id="label"
@@ -1600,8 +1516,7 @@ exports[`CheckBox component Should render size - secondary 1`] = `
1600
1516
  <DocumentFragment>
1601
1517
  <div
1602
1518
  aria-checked="false"
1603
- class="container pointer primary
1604
- flex rowdir vCenter"
1519
+ class="flex row alignItems_center container pointer primary"
1605
1520
  data-id="checkBox"
1606
1521
  data-selector-id="container"
1607
1522
  data-test-id="checkBox"
@@ -1609,7 +1524,7 @@ exports[`CheckBox component Should render size - secondary 1`] = `
1609
1524
  tabindex="0"
1610
1525
  >
1611
1526
  <div
1612
- class="boxContainer medium filled shrinkOff"
1527
+ class="noShrink boxContainer medium filled"
1613
1528
  data-id="boxComponent"
1614
1529
  data-selector-id="box"
1615
1530
  data-test-id="boxComponent"
@@ -1618,7 +1533,7 @@ exports[`CheckBox component Should render size - secondary 1`] = `
1618
1533
  type="hidden"
1619
1534
  />
1620
1535
  <label
1621
- class="checkbox pointer medium "
1536
+ class="checkbox pointer medium"
1622
1537
  >
1623
1538
  <svg
1624
1539
  viewBox="0 0 40 40"
@@ -1637,16 +1552,13 @@ exports[`CheckBox component Should render size - secondary 1`] = `
1637
1552
  </label>
1638
1553
  </div>
1639
1554
  <div
1640
- class="labelContainer grow basis shrinkOff"
1555
+ class="flexible basis_zero noShrink labelContainer"
1641
1556
  data-id="boxComponent"
1642
1557
  data-selector-id="box"
1643
1558
  data-test-id="boxComponent"
1644
1559
  >
1645
1560
  <label
1646
- class="label title medium secondary font_default
1647
- dotted cursor
1648
-
1649
- pointer "
1561
+ class="label title medium secondary font_default dotted cursor pointer"
1650
1562
  data-id="label"
1651
1563
  data-selector-id="label"
1652
1564
  data-test-id="label"
@@ -1663,8 +1575,7 @@ exports[`CheckBox component Should render size - small 1`] = `
1663
1575
  <DocumentFragment>
1664
1576
  <div
1665
1577
  aria-checked="true"
1666
- class="container pointer primary
1667
- checkedprimary inflex rowdir vCenter"
1578
+ class="inlineFlex row alignItems_center container pointer primary checkedprimary"
1668
1579
  data-id="checkBox"
1669
1580
  data-selector-id="container"
1670
1581
  data-test-id="checkBox"
@@ -1672,7 +1583,7 @@ exports[`CheckBox component Should render size - small 1`] = `
1672
1583
  tabindex="0"
1673
1584
  >
1674
1585
  <div
1675
- class="boxContainer small filled shrinkOff"
1586
+ class="noShrink boxContainer small filled"
1676
1587
  data-id="boxComponent"
1677
1588
  data-selector-id="box"
1678
1589
  data-test-id="boxComponent"
@@ -1681,7 +1592,7 @@ exports[`CheckBox component Should render size - small 1`] = `
1681
1592
  type="hidden"
1682
1593
  />
1683
1594
  <label
1684
- class="checkbox pointer small "
1595
+ class="checkbox pointer small"
1685
1596
  >
1686
1597
  <svg
1687
1598
  viewBox="0 0 40 40"
@@ -1694,7 +1605,7 @@ exports[`CheckBox component Should render size - small 1`] = `
1694
1605
  />
1695
1606
  </svg>
1696
1607
  <svg
1697
- class="tick smalltick "
1608
+ class="tick smalltick"
1698
1609
  viewBox="0 0 44 44"
1699
1610
  xmlns="http://www.w3.org/2000/svg"
1700
1611
  >
@@ -1716,8 +1627,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1716
1627
  aria-hidden="false"
1717
1628
  aria-label="ariaLabelCheckBox"
1718
1629
  aria-labelledby="ariaLabelledbyCheckBox"
1719
- class="container pointer primary
1720
- checkedprimary inflex rowdir vCenter"
1630
+ class="inlineFlex row alignItems_center container pointer primary checkedprimary"
1721
1631
  data-id="checkBox"
1722
1632
  data-selector-id="container"
1723
1633
  data-test-id="checkBox"
@@ -1725,7 +1635,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1725
1635
  tabindex="0"
1726
1636
  >
1727
1637
  <div
1728
- class="boxContainer medium filled shrinkOff"
1638
+ class="noShrink boxContainer medium filled"
1729
1639
  data-id="boxComponent"
1730
1640
  data-selector-id="box"
1731
1641
  data-test-id="boxComponent"
@@ -1734,7 +1644,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1734
1644
  type="hidden"
1735
1645
  />
1736
1646
  <label
1737
- class="checkbox pointer medium "
1647
+ class="checkbox pointer medium"
1738
1648
  >
1739
1649
  <svg
1740
1650
  viewBox="0 0 40 40"
@@ -1747,7 +1657,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1747
1657
  />
1748
1658
  </svg>
1749
1659
  <svg
1750
- class="tick mediumtick "
1660
+ class="tick mediumtick"
1751
1661
  viewBox="0 0 44 44"
1752
1662
  xmlns="http://www.w3.org/2000/svg"
1753
1663
  >
@@ -1769,8 +1679,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1769
1679
  aria-hidden="true"
1770
1680
  aria-label="ariaLabelCheckBox"
1771
1681
  aria-labelledby="ariaLabelledbyCheckBox"
1772
- class="container pointer primary
1773
- checkedprimary inflex rowdir vCenter"
1682
+ class="inlineFlex row alignItems_center container pointer primary checkedprimary"
1774
1683
  data-id="checkBox"
1775
1684
  data-selector-id="container"
1776
1685
  data-test-id="checkBox"
@@ -1778,7 +1687,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1778
1687
  tabindex="-1"
1779
1688
  >
1780
1689
  <div
1781
- class="boxContainer medium filled shrinkOff"
1690
+ class="noShrink boxContainer medium filled"
1782
1691
  data-id="boxComponent"
1783
1692
  data-selector-id="box"
1784
1693
  data-test-id="boxComponent"
@@ -1787,7 +1696,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1787
1696
  type="hidden"
1788
1697
  />
1789
1698
  <label
1790
- class="checkbox pointer medium "
1699
+ class="checkbox pointer medium"
1791
1700
  >
1792
1701
  <svg
1793
1702
  viewBox="0 0 40 40"
@@ -1800,7 +1709,7 @@ exports[`CheckBox component rendering ally ariaLabel , ariaLabelledby, ariaHidde
1800
1709
  />
1801
1710
  </svg>
1802
1711
  <svg
1803
- class="tick mediumtick "
1712
+ class="tick mediumtick"
1804
1713
  viewBox="0 0 44 44"
1805
1714
  xmlns="http://www.w3.org/2000/svg"
1806
1715
  >
@@ -1819,8 +1728,7 @@ exports[`CheckBox component rendering the Custom Props 1`] = `
1819
1728
  <DocumentFragment>
1820
1729
  <div
1821
1730
  aria-checked="false"
1822
- class="container pointer primary
1823
- flex rowdir vCenter"
1731
+ class="flex row alignItems_center container pointer primary"
1824
1732
  data-id="checkBox"
1825
1733
  data-props="true"
1826
1734
  data-selector-id="container"
@@ -1829,7 +1737,7 @@ exports[`CheckBox component rendering the Custom Props 1`] = `
1829
1737
  tabindex="0"
1830
1738
  >
1831
1739
  <div
1832
- class="boxContainer medium filled shrinkOff"
1740
+ class="noShrink boxContainer medium filled"
1833
1741
  data-id="boxComponent"
1834
1742
  data-selector-id="box"
1835
1743
  data-test-id="boxComponent"
@@ -1838,7 +1746,7 @@ exports[`CheckBox component rendering the Custom Props 1`] = `
1838
1746
  type="hidden"
1839
1747
  />
1840
1748
  <label
1841
- class="checkbox pointer medium "
1749
+ class="checkbox pointer medium"
1842
1750
  >
1843
1751
  <svg
1844
1752
  viewBox="0 0 40 40"
@@ -1857,14 +1765,13 @@ exports[`CheckBox component rendering the Custom Props 1`] = `
1857
1765
  </label>
1858
1766
  </div>
1859
1767
  <div
1860
- class="labelContainer grow basis shrinkOff"
1768
+ class="flexible basis_zero noShrink labelContainer"
1861
1769
  data-id="boxComponent"
1862
1770
  data-selector-id="box"
1863
1771
  data-test-id="boxComponent"
1864
1772
  >
1865
1773
  <label
1866
- class="label title medium default font_default
1867
- dotted cursor checkBoxCustomClass "
1774
+ class="label title medium default font_default dotted cursor checkBoxCustomClass"
1868
1775
  data-id="label"
1869
1776
  data-selector-id="label"
1870
1777
  data-test-id="label"
@@ -1881,8 +1788,7 @@ exports[`CheckBox component rendering the Custom class 1`] = `
1881
1788
  <DocumentFragment>
1882
1789
  <div
1883
1790
  aria-checked="true"
1884
- class="container pointer primary
1885
- checkedprimary customCheckBoxClass flex rowdir vCenter"
1791
+ class="flex row alignItems_center container pointer primary checkedprimary customCheckBoxClass"
1886
1792
  data-id="checkBox"
1887
1793
  data-selector-id="container"
1888
1794
  data-test-id="checkBox"
@@ -1890,7 +1796,7 @@ exports[`CheckBox component rendering the Custom class 1`] = `
1890
1796
  tabindex="0"
1891
1797
  >
1892
1798
  <div
1893
- class="boxContainer medium customCBoxSizeClass filled shrinkOff"
1799
+ class="noShrink boxContainer medium filled customCBoxSizeClass"
1894
1800
  data-id="boxComponent"
1895
1801
  data-selector-id="box"
1896
1802
  data-test-id="boxComponent"
@@ -1912,7 +1818,7 @@ exports[`CheckBox component rendering the Custom class 1`] = `
1912
1818
  />
1913
1819
  </svg>
1914
1820
  <svg
1915
- class="tick mediumtick customTickSizeClass "
1821
+ class="tick mediumtick customTickSizeClass"
1916
1822
  viewBox="0 0 44 44"
1917
1823
  xmlns="http://www.w3.org/2000/svg"
1918
1824
  >
@@ -1924,16 +1830,13 @@ exports[`CheckBox component rendering the Custom class 1`] = `
1924
1830
  </label>
1925
1831
  </div>
1926
1832
  <div
1927
- class="labelContainer grow basis shrinkOff"
1833
+ class="flexible basis_zero noShrink labelContainer"
1928
1834
  data-id="boxComponent"
1929
1835
  data-selector-id="box"
1930
1836
  data-test-id="boxComponent"
1931
1837
  >
1932
1838
  <label
1933
- class="label title medium default font_default
1934
- dotted cursor
1935
-
1936
- pointer customLabelClass "
1839
+ class="label title medium default font_default dotted cursor pointer customLabelClass"
1937
1840
  data-id="label"
1938
1841
  data-selector-id="label"
1939
1842
  data-test-id="label"