@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/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap CHANGED
@@ -4,20 +4,20 @@ exports[`Switch rendering the CustomClass 1`] = `
4
4
  <DocumentFragment>
5
5
  <div
6
6
  aria-checked="false"
7
- class="container SwtichCustomSwitchWrap effect inflex rowdir vCenter"
7
+ class="inlineFlex row alignItems_center container effect SwtichCustomSwitchWrap"
8
8
  data-id="containerComponent"
9
9
  data-selector-id="switch"
10
10
  data-test-id="containerComponent"
11
11
  role="switch"
12
12
  >
13
13
  <div
14
- class="switch_medium SwtichCustomSwitchSize shrinkOff"
14
+ class="noShrink switch_medium SwtichCustomSwitchSize"
15
15
  data-id="boxComponent"
16
16
  data-selector-id="box"
17
17
  data-test-id="boxComponent"
18
18
  >
19
19
  <input
20
- class="input "
20
+ class="input"
21
21
  id="SwitchID"
22
22
  type="checkbox"
23
23
  value=""
@@ -29,8 +29,7 @@ exports[`Switch rendering the CustomClass 1`] = `
29
29
  />
30
30
  </div>
31
31
  <label
32
- class="label subtitle medium primary font_default
33
- pointer SwtichCustomLabel "
32
+ class="label subtitle medium primary font_default pointer SwtichCustomLabel"
34
33
  data-id="label"
35
34
  data-selector-id="label"
36
35
  data-test-id="label"
@@ -46,7 +45,7 @@ exports[`Switch rendering the CustomProps 1`] = `
46
45
  <DocumentFragment>
47
46
  <div
48
47
  aria-checked="false"
49
- class="container effect inflex rowdir vCenter"
48
+ class="inlineFlex row alignItems_center container effect"
50
49
  data-id="containerComponent"
51
50
  data-selector-id="switch"
52
51
  data-switch="true"
@@ -54,26 +53,25 @@ exports[`Switch rendering the CustomProps 1`] = `
54
53
  role="switch"
55
54
  >
56
55
  <div
57
- class="switch_medium shrinkOff"
56
+ class="noShrink switch_medium"
58
57
  data-id="boxComponent"
59
58
  data-selector-id="box"
60
59
  data-test-id="boxComponent"
61
60
  >
62
61
  <input
63
- class="input "
62
+ class="input"
64
63
  id="SwitchID"
65
64
  type="checkbox"
66
65
  value=""
67
66
  />
68
67
  <label
69
- class="label switch_mediumLabel "
68
+ class="label switch_mediumLabel"
70
69
  for="SwitchID"
71
70
  tabindex="0"
72
71
  />
73
72
  </div>
74
73
  <label
75
- class="label subtitle medium primary font_default
76
- pointer "
74
+ class="label subtitle medium primary font_default pointer"
77
75
  data-id="label"
78
76
  data-selector-id="label"
79
77
  data-test-id="label"
@@ -90,33 +88,32 @@ exports[`Switch rendering the ID 1`] = `
90
88
  <DocumentFragment>
91
89
  <div
92
90
  aria-checked="false"
93
- class="container effect inflex rowdir vCenter"
91
+ class="inlineFlex row alignItems_center container effect"
94
92
  data-id="containerComponent"
95
93
  data-selector-id="switch"
96
94
  data-test-id="containerComponent"
97
95
  role="switch"
98
96
  >
99
97
  <div
100
- class="switch_medium shrinkOff"
98
+ class="noShrink switch_medium"
101
99
  data-id="boxComponent"
102
100
  data-selector-id="box"
103
101
  data-test-id="boxComponent"
104
102
  >
105
103
  <input
106
- class="input "
104
+ class="input"
107
105
  id="SwitchID"
108
106
  type="checkbox"
109
107
  value=""
110
108
  />
111
109
  <label
112
- class="label switch_mediumLabel "
110
+ class="label switch_mediumLabel"
113
111
  for="SwitchID"
114
112
  tabindex="0"
115
113
  />
116
114
  </div>
117
115
  <label
118
- class="label subtitle medium primary font_default
119
- pointer "
116
+ class="label subtitle medium primary font_default pointer"
120
117
  data-id="label"
121
118
  data-selector-id="label"
122
119
  data-test-id="label"
@@ -132,27 +129,27 @@ exports[`Switch rendering the Name 1`] = `
132
129
  <DocumentFragment>
133
130
  <div
134
131
  aria-checked="false"
135
- class="container effect inflex rowdir vCenter"
132
+ class="inlineFlex row alignItems_center container effect"
136
133
  data-id="containerComponent"
137
134
  data-selector-id="switch"
138
135
  data-test-id="containerComponent"
139
136
  role="switch"
140
137
  >
141
138
  <div
142
- class="switch_medium shrinkOff"
139
+ class="noShrink switch_medium"
143
140
  data-id="boxComponent"
144
141
  data-selector-id="box"
145
142
  data-test-id="boxComponent"
146
143
  >
147
144
  <input
148
- class="input "
145
+ class="input"
149
146
  id="SwitchID"
150
147
  name="LabelName"
151
148
  type="checkbox"
152
149
  value=""
153
150
  />
154
151
  <label
155
- class="label switch_mediumLabel "
152
+ class="label switch_mediumLabel"
156
153
  for="SwitchID"
157
154
  tabindex="0"
158
155
  />
@@ -165,7 +162,7 @@ exports[`Switch rendering the Title 1`] = `
165
162
  <DocumentFragment>
166
163
  <div
167
164
  aria-checked="false"
168
- class="container effect inflex rowdir vCenter"
165
+ class="inlineFlex row alignItems_center container effect"
169
166
  data-id="containerComponent"
170
167
  data-selector-id="switch"
171
168
  data-test-id="containerComponent"
@@ -173,19 +170,19 @@ exports[`Switch rendering the Title 1`] = `
173
170
  role="switch"
174
171
  >
175
172
  <div
176
- class="switch_medium shrinkOff"
173
+ class="noShrink switch_medium"
177
174
  data-id="boxComponent"
178
175
  data-selector-id="box"
179
176
  data-test-id="boxComponent"
180
177
  >
181
178
  <input
182
- class="input "
179
+ class="input"
183
180
  id="SwitchID"
184
181
  type="checkbox"
185
182
  value=""
186
183
  />
187
184
  <label
188
- class="label switch_mediumLabel "
185
+ class="label switch_mediumLabel"
189
186
  for="SwitchID"
190
187
  tabindex="0"
191
188
  />
@@ -198,26 +195,26 @@ exports[`Switch rendering the Value 1`] = `
198
195
  <DocumentFragment>
199
196
  <div
200
197
  aria-checked="false"
201
- class="container effect inflex rowdir vCenter"
198
+ class="inlineFlex row alignItems_center container effect"
202
199
  data-id="containerComponent"
203
200
  data-selector-id="switch"
204
201
  data-test-id="containerComponent"
205
202
  role="switch"
206
203
  >
207
204
  <div
208
- class="switch_medium shrinkOff"
205
+ class="noShrink switch_medium"
209
206
  data-id="boxComponent"
210
207
  data-selector-id="box"
211
208
  data-test-id="boxComponent"
212
209
  >
213
210
  <input
214
- class="input "
211
+ class="input"
215
212
  id="SwitchID"
216
213
  type="checkbox"
217
214
  value="true"
218
215
  />
219
216
  <label
220
- class="label switch_mediumLabel "
217
+ class="label switch_mediumLabel"
221
218
  for="SwitchID"
222
219
  tabindex="0"
223
220
  />
@@ -230,14 +227,14 @@ exports[`Switch rendering the checked 1`] = `
230
227
  <DocumentFragment>
231
228
  <div
232
229
  aria-checked="true"
233
- class="container effect inflex rowdir vCenter"
230
+ class="inlineFlex row alignItems_center container effect"
234
231
  data-id="containerComponent"
235
232
  data-selector-id="switch"
236
233
  data-test-id="containerComponent"
237
234
  role="switch"
238
235
  >
239
236
  <div
240
- class="switch_medium shrinkOff"
237
+ class="noShrink switch_medium"
241
238
  data-id="boxComponent"
242
239
  data-selector-id="box"
243
240
  data-test-id="boxComponent"
@@ -250,7 +247,7 @@ exports[`Switch rendering the checked 1`] = `
250
247
  value=""
251
248
  />
252
249
  <label
253
- class="label switch_mediumLabel "
250
+ class="label switch_mediumLabel"
254
251
  for="SwitchID"
255
252
  tabindex="0"
256
253
  />
@@ -263,26 +260,26 @@ exports[`Switch rendering the dataId 1`] = `
263
260
  <DocumentFragment>
264
261
  <div
265
262
  aria-checked="false"
266
- class="container effect inflex rowdir vCenter"
263
+ class="inlineFlex row alignItems_center container effect"
267
264
  data-id="containerComponent"
268
265
  data-selector-id="switch"
269
266
  data-test-id="containerComponent"
270
267
  role="switch"
271
268
  >
272
269
  <div
273
- class="switch_medium shrinkOff"
270
+ class="noShrink switch_medium"
274
271
  data-id="boxComponent"
275
272
  data-selector-id="box"
276
273
  data-test-id="boxComponent"
277
274
  >
278
275
  <input
279
- class="input "
276
+ class="input"
280
277
  id="SwitchID"
281
278
  type="checkbox"
282
279
  value=""
283
280
  />
284
281
  <label
285
- class="label switch_mediumLabel "
282
+ class="label switch_mediumLabel"
286
283
  data-id="data-Switch"
287
284
  data-test-id="data-Switch"
288
285
  for="SwitchID"
@@ -297,25 +294,25 @@ exports[`Switch rendering the defult props 1`] = `
297
294
  <DocumentFragment>
298
295
  <div
299
296
  aria-checked="false"
300
- class="container effect inflex rowdir vCenter"
297
+ class="inlineFlex row alignItems_center container effect"
301
298
  data-id="containerComponent"
302
299
  data-selector-id="switch"
303
300
  data-test-id="containerComponent"
304
301
  role="switch"
305
302
  >
306
303
  <div
307
- class="switch_medium shrinkOff"
304
+ class="noShrink switch_medium"
308
305
  data-id="boxComponent"
309
306
  data-selector-id="box"
310
307
  data-test-id="boxComponent"
311
308
  >
312
309
  <input
313
- class="input "
310
+ class="input"
314
311
  type="checkbox"
315
312
  value=""
316
313
  />
317
314
  <label
318
- class="label switch_mediumLabel "
315
+ class="label switch_mediumLabel"
319
316
  tabindex="0"
320
317
  />
321
318
  </div>
@@ -327,7 +324,7 @@ exports[`Switch rendering the disabled and disableTitle 1`] = `
327
324
  <DocumentFragment>
328
325
  <div
329
326
  aria-checked="false"
330
- class="container disabled inflex rowdir vCenter"
327
+ class="inlineFlex row alignItems_center container disabled"
331
328
  data-id="containerComponent"
332
329
  data-selector-id="switch"
333
330
  data-test-id="containerComponent"
@@ -335,20 +332,20 @@ exports[`Switch rendering the disabled and disableTitle 1`] = `
335
332
  role="switch"
336
333
  >
337
334
  <div
338
- class="switch_medium shrinkOff"
335
+ class="noShrink switch_medium"
339
336
  data-id="boxComponent"
340
337
  data-selector-id="box"
341
338
  data-test-id="boxComponent"
342
339
  >
343
340
  <input
344
- class="input "
341
+ class="input"
345
342
  disabled=""
346
343
  id="SwitchID"
347
344
  type="checkbox"
348
345
  value=""
349
346
  />
350
347
  <label
351
- class="label switch_mediumLabel "
348
+ class="label switch_mediumLabel"
352
349
  for="SwitchID"
353
350
  tabindex="-1"
354
351
  />
@@ -361,26 +358,26 @@ exports[`Switch rendering the isReadOnly 1`] = `
361
358
  <DocumentFragment>
362
359
  <div
363
360
  aria-checked="false"
364
- class="container readonly inflex rowdir vCenter"
361
+ class="inlineFlex row alignItems_center container readonly"
365
362
  data-id="containerComponent"
366
363
  data-selector-id="switch"
367
364
  data-test-id="containerComponent"
368
365
  role="switch"
369
366
  >
370
367
  <div
371
- class="switch_medium shrinkOff"
368
+ class="noShrink switch_medium"
372
369
  data-id="boxComponent"
373
370
  data-selector-id="box"
374
371
  data-test-id="boxComponent"
375
372
  >
376
373
  <input
377
- class="input "
374
+ class="input"
378
375
  readonly=""
379
376
  type="checkbox"
380
377
  value=""
381
378
  />
382
379
  <label
383
- class="label switch_mediumLabel "
380
+ class="label switch_mediumLabel"
384
381
  tabindex="-1"
385
382
  />
386
383
  </div>
@@ -392,33 +389,32 @@ exports[`Switch rendering the labelSize of- danger 1`] = `
392
389
  <DocumentFragment>
393
390
  <div
394
391
  aria-checked="false"
395
- class="container effect inflex rowdir vCenter"
392
+ class="inlineFlex row alignItems_center container effect"
396
393
  data-id="containerComponent"
397
394
  data-selector-id="switch"
398
395
  data-test-id="containerComponent"
399
396
  role="switch"
400
397
  >
401
398
  <div
402
- class="switch_medium shrinkOff"
399
+ class="noShrink switch_medium"
403
400
  data-id="boxComponent"
404
401
  data-selector-id="box"
405
402
  data-test-id="boxComponent"
406
403
  >
407
404
  <input
408
- class="input "
405
+ class="input"
409
406
  id="SwitchID"
410
407
  type="checkbox"
411
408
  value=""
412
409
  />
413
410
  <label
414
- class="label switch_mediumLabel "
411
+ class="label switch_mediumLabel"
415
412
  for="SwitchID"
416
413
  tabindex="0"
417
414
  />
418
415
  </div>
419
416
  <label
420
- class="label subtitle medium danger font_default
421
- pointer "
417
+ class="label subtitle medium danger font_default pointer"
422
418
  data-id="label"
423
419
  data-selector-id="label"
424
420
  data-test-id="label"
@@ -434,33 +430,32 @@ exports[`Switch rendering the labelSize of- default 1`] = `
434
430
  <DocumentFragment>
435
431
  <div
436
432
  aria-checked="false"
437
- class="container effect inflex rowdir vCenter"
433
+ class="inlineFlex row alignItems_center container effect"
438
434
  data-id="containerComponent"
439
435
  data-selector-id="switch"
440
436
  data-test-id="containerComponent"
441
437
  role="switch"
442
438
  >
443
439
  <div
444
- class="switch_medium shrinkOff"
440
+ class="noShrink switch_medium"
445
441
  data-id="boxComponent"
446
442
  data-selector-id="box"
447
443
  data-test-id="boxComponent"
448
444
  >
449
445
  <input
450
- class="input "
446
+ class="input"
451
447
  id="SwitchID"
452
448
  type="checkbox"
453
449
  value=""
454
450
  />
455
451
  <label
456
- class="label switch_mediumLabel "
452
+ class="label switch_mediumLabel"
457
453
  for="SwitchID"
458
454
  tabindex="0"
459
455
  />
460
456
  </div>
461
457
  <label
462
- class="label subtitle medium default font_default
463
- pointer "
458
+ class="label subtitle medium default font_default pointer"
464
459
  data-id="label"
465
460
  data-selector-id="label"
466
461
  data-test-id="label"
@@ -476,33 +471,32 @@ exports[`Switch rendering the labelSize of- large 1`] = `
476
471
  <DocumentFragment>
477
472
  <div
478
473
  aria-checked="false"
479
- class="container effect inflex rowdir vCenter"
474
+ class="inlineFlex row alignItems_center container effect"
480
475
  data-id="containerComponent"
481
476
  data-selector-id="switch"
482
477
  data-test-id="containerComponent"
483
478
  role="switch"
484
479
  >
485
480
  <div
486
- class="switch_medium shrinkOff"
481
+ class="noShrink switch_medium"
487
482
  data-id="boxComponent"
488
483
  data-selector-id="box"
489
484
  data-test-id="boxComponent"
490
485
  >
491
486
  <input
492
- class="input "
487
+ class="input"
493
488
  id="SwitchID"
494
489
  type="checkbox"
495
490
  value=""
496
491
  />
497
492
  <label
498
- class="label switch_mediumLabel "
493
+ class="label switch_mediumLabel"
499
494
  for="SwitchID"
500
495
  tabindex="0"
501
496
  />
502
497
  </div>
503
498
  <label
504
- class="label subtitle large primary font_default
505
- pointer "
499
+ class="label subtitle large primary font_default pointer"
506
500
  data-id="label"
507
501
  data-selector-id="label"
508
502
  data-test-id="label"
@@ -518,33 +512,32 @@ exports[`Switch rendering the labelSize of- mandatory 1`] = `
518
512
  <DocumentFragment>
519
513
  <div
520
514
  aria-checked="false"
521
- class="container effect inflex rowdir vCenter"
515
+ class="inlineFlex row alignItems_center container effect"
522
516
  data-id="containerComponent"
523
517
  data-selector-id="switch"
524
518
  data-test-id="containerComponent"
525
519
  role="switch"
526
520
  >
527
521
  <div
528
- class="switch_medium shrinkOff"
522
+ class="noShrink switch_medium"
529
523
  data-id="boxComponent"
530
524
  data-selector-id="box"
531
525
  data-test-id="boxComponent"
532
526
  >
533
527
  <input
534
- class="input "
528
+ class="input"
535
529
  id="SwitchID"
536
530
  type="checkbox"
537
531
  value=""
538
532
  />
539
533
  <label
540
- class="label switch_mediumLabel "
534
+ class="label switch_mediumLabel"
541
535
  for="SwitchID"
542
536
  tabindex="0"
543
537
  />
544
538
  </div>
545
539
  <label
546
- class="label subtitle medium mandatory font_default
547
- pointer "
540
+ class="label subtitle medium mandatory font_default pointer"
548
541
  data-id="label"
549
542
  data-selector-id="label"
550
543
  data-test-id="label"
@@ -560,33 +553,32 @@ exports[`Switch rendering the labelSize of- medium 1`] = `
560
553
  <DocumentFragment>
561
554
  <div
562
555
  aria-checked="false"
563
- class="container effect inflex rowdir vCenter"
556
+ class="inlineFlex row alignItems_center container effect"
564
557
  data-id="containerComponent"
565
558
  data-selector-id="switch"
566
559
  data-test-id="containerComponent"
567
560
  role="switch"
568
561
  >
569
562
  <div
570
- class="switch_medium shrinkOff"
563
+ class="noShrink switch_medium"
571
564
  data-id="boxComponent"
572
565
  data-selector-id="box"
573
566
  data-test-id="boxComponent"
574
567
  >
575
568
  <input
576
- class="input "
569
+ class="input"
577
570
  id="SwitchID"
578
571
  type="checkbox"
579
572
  value=""
580
573
  />
581
574
  <label
582
- class="label switch_mediumLabel "
575
+ class="label switch_mediumLabel"
583
576
  for="SwitchID"
584
577
  tabindex="0"
585
578
  />
586
579
  </div>
587
580
  <label
588
- class="label subtitle medium primary font_default
589
- pointer "
581
+ class="label subtitle medium primary font_default pointer"
590
582
  data-id="label"
591
583
  data-selector-id="label"
592
584
  data-test-id="label"
@@ -602,33 +594,32 @@ exports[`Switch rendering the labelSize of- primary 1`] = `
602
594
  <DocumentFragment>
603
595
  <div
604
596
  aria-checked="false"
605
- class="container effect inflex rowdir vCenter"
597
+ class="inlineFlex row alignItems_center container effect"
606
598
  data-id="containerComponent"
607
599
  data-selector-id="switch"
608
600
  data-test-id="containerComponent"
609
601
  role="switch"
610
602
  >
611
603
  <div
612
- class="switch_medium shrinkOff"
604
+ class="noShrink switch_medium"
613
605
  data-id="boxComponent"
614
606
  data-selector-id="box"
615
607
  data-test-id="boxComponent"
616
608
  >
617
609
  <input
618
- class="input "
610
+ class="input"
619
611
  id="SwitchID"
620
612
  type="checkbox"
621
613
  value=""
622
614
  />
623
615
  <label
624
- class="label switch_mediumLabel "
616
+ class="label switch_mediumLabel"
625
617
  for="SwitchID"
626
618
  tabindex="0"
627
619
  />
628
620
  </div>
629
621
  <label
630
- class="label subtitle medium primary font_default
631
- pointer "
622
+ class="label subtitle medium primary font_default pointer"
632
623
  data-id="label"
633
624
  data-selector-id="label"
634
625
  data-test-id="label"
@@ -644,33 +635,32 @@ exports[`Switch rendering the labelSize of- secondary 1`] = `
644
635
  <DocumentFragment>
645
636
  <div
646
637
  aria-checked="false"
647
- class="container effect inflex rowdir vCenter"
638
+ class="inlineFlex row alignItems_center container effect"
648
639
  data-id="containerComponent"
649
640
  data-selector-id="switch"
650
641
  data-test-id="containerComponent"
651
642
  role="switch"
652
643
  >
653
644
  <div
654
- class="switch_medium shrinkOff"
645
+ class="noShrink switch_medium"
655
646
  data-id="boxComponent"
656
647
  data-selector-id="box"
657
648
  data-test-id="boxComponent"
658
649
  >
659
650
  <input
660
- class="input "
651
+ class="input"
661
652
  id="SwitchID"
662
653
  type="checkbox"
663
654
  value=""
664
655
  />
665
656
  <label
666
- class="label switch_mediumLabel "
657
+ class="label switch_mediumLabel"
667
658
  for="SwitchID"
668
659
  tabindex="0"
669
660
  />
670
661
  </div>
671
662
  <label
672
- class="label subtitle medium secondary font_default
673
- pointer "
663
+ class="label subtitle medium secondary font_default pointer"
674
664
  data-id="label"
675
665
  data-selector-id="label"
676
666
  data-test-id="label"
@@ -686,33 +676,32 @@ exports[`Switch rendering the labelSize of- small 1`] = `
686
676
  <DocumentFragment>
687
677
  <div
688
678
  aria-checked="false"
689
- class="container effect inflex rowdir vCenter"
679
+ class="inlineFlex row alignItems_center container effect"
690
680
  data-id="containerComponent"
691
681
  data-selector-id="switch"
692
682
  data-test-id="containerComponent"
693
683
  role="switch"
694
684
  >
695
685
  <div
696
- class="switch_medium shrinkOff"
686
+ class="noShrink switch_medium"
697
687
  data-id="boxComponent"
698
688
  data-selector-id="box"
699
689
  data-test-id="boxComponent"
700
690
  >
701
691
  <input
702
- class="input "
692
+ class="input"
703
693
  id="SwitchID"
704
694
  type="checkbox"
705
695
  value=""
706
696
  />
707
697
  <label
708
- class="label switch_mediumLabel "
698
+ class="label switch_mediumLabel"
709
699
  for="SwitchID"
710
700
  tabindex="0"
711
701
  />
712
702
  </div>
713
703
  <label
714
- class="label subtitle small primary font_default
715
- pointer "
704
+ class="label subtitle small primary font_default pointer"
716
705
  data-id="label"
717
706
  data-selector-id="label"
718
707
  data-test-id="label"
@@ -728,26 +717,26 @@ exports[`Switch rendering the size of- medium 1`] = `
728
717
  <DocumentFragment>
729
718
  <div
730
719
  aria-checked="false"
731
- class="container effect inflex rowdir vCenter"
720
+ class="inlineFlex row alignItems_center container effect"
732
721
  data-id="containerComponent"
733
722
  data-selector-id="switch"
734
723
  data-test-id="containerComponent"
735
724
  role="switch"
736
725
  >
737
726
  <div
738
- class="switch_medium shrinkOff"
727
+ class="noShrink switch_medium"
739
728
  data-id="boxComponent"
740
729
  data-selector-id="box"
741
730
  data-test-id="boxComponent"
742
731
  >
743
732
  <input
744
- class="input "
733
+ class="input"
745
734
  id="SwitchID"
746
735
  type="checkbox"
747
736
  value=""
748
737
  />
749
738
  <label
750
- class="label switch_mediumLabel "
739
+ class="label switch_mediumLabel"
751
740
  for="SwitchID"
752
741
  tabindex="0"
753
742
  />
@@ -760,26 +749,26 @@ exports[`Switch rendering the size of- small 1`] = `
760
749
  <DocumentFragment>
761
750
  <div
762
751
  aria-checked="false"
763
- class="container effect inflex rowdir vCenter"
752
+ class="inlineFlex row alignItems_center container effect"
764
753
  data-id="containerComponent"
765
754
  data-selector-id="switch"
766
755
  data-test-id="containerComponent"
767
756
  role="switch"
768
757
  >
769
758
  <div
770
- class="switch_small shrinkOff"
759
+ class="noShrink switch_small"
771
760
  data-id="boxComponent"
772
761
  data-selector-id="box"
773
762
  data-test-id="boxComponent"
774
763
  >
775
764
  <input
776
- class="input "
765
+ class="input"
777
766
  id="SwitchID"
778
767
  type="checkbox"
779
768
  value=""
780
769
  />
781
770
  <label
782
- class="label switch_smallLabel "
771
+ class="label switch_smallLabel"
783
772
  for="SwitchID"
784
773
  tabindex="0"
785
774
  />
@@ -792,33 +781,32 @@ exports[`Switch rendering the text 1`] = `
792
781
  <DocumentFragment>
793
782
  <div
794
783
  aria-checked="false"
795
- class="container effect inflex rowdir vCenter"
784
+ class="inlineFlex row alignItems_center container effect"
796
785
  data-id="containerComponent"
797
786
  data-selector-id="switch"
798
787
  data-test-id="containerComponent"
799
788
  role="switch"
800
789
  >
801
790
  <div
802
- class="switch_medium shrinkOff"
791
+ class="noShrink switch_medium"
803
792
  data-id="boxComponent"
804
793
  data-selector-id="box"
805
794
  data-test-id="boxComponent"
806
795
  >
807
796
  <input
808
- class="input "
797
+ class="input"
809
798
  id="SwitchID"
810
799
  type="checkbox"
811
800
  value=""
812
801
  />
813
802
  <label
814
- class="label switch_mediumLabel "
803
+ class="label switch_mediumLabel"
815
804
  for="SwitchID"
816
805
  tabindex="0"
817
806
  />
818
807
  </div>
819
808
  <label
820
- class="label subtitle medium primary font_default
821
- pointer "
809
+ class="label subtitle medium primary font_default pointer"
822
810
  data-id="label"
823
811
  data-selector-id="label"
824
812
  data-test-id="label"