@zohodesk/components 1.6.19 → 1.6.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (140) hide show
  1. package/README.md +15 -1
  2. package/es/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  3. package/es/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  4. package/es/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  5. package/es/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  6. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +98 -121
  7. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +45 -45
  8. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +24 -24
  9. package/es/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  10. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +87 -87
  11. package/es/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  12. package/es/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +5 -5
  13. package/es/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +6 -6
  14. package/es/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  15. package/es/DateTime/__tests__/__snapshots__/Time.spec.js.snap +25 -25
  16. package/es/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  17. package/es/Layout/Box.js +1 -115
  18. package/es/Layout/Container.js +1 -132
  19. package/es/Layout/props/defaultProps.js +1 -16
  20. package/es/Layout/props/propTypes.js +1 -46
  21. package/es/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  22. package/es/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  23. package/es/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  24. package/es/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -69
  25. package/es/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  26. package/es/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +69 -69
  27. package/es/MultiSelect/AdvancedMultiSelect.js +4 -2
  28. package/es/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +3 -3
  29. package/es/MultiSelect/MultiSelect.js +11 -7
  30. package/es/MultiSelect/MultiSelectWithAvatar.js +4 -2
  31. package/es/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  32. package/es/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  33. package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +31 -31
  34. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +6 -6
  35. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  36. package/es/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  37. package/es/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  38. package/es/MultiSelect/props/defaultProps.js +3 -0
  39. package/es/MultiSelect/props/propTypes.js +1 -0
  40. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +130 -130
  41. package/es/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  42. package/es/Select/GroupSelect.js +4 -2
  43. package/es/Select/Select.js +9 -5
  44. package/es/Select/SelectWithAvatar.js +4 -2
  45. package/es/Select/SelectWithIcon.js +4 -2
  46. package/es/Select/__tests__/SelectWithIcon.spec.js +3 -1
  47. package/es/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +6 -6
  48. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +771 -749
  49. package/es/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  50. package/es/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +9 -9
  51. package/es/Select/props/defaultProps.js +4 -0
  52. package/es/Select/props/propTypes.js +3 -0
  53. package/es/Switch/__tests__/__snapshots__/Switch.spec.js.snap +44 -44
  54. package/es/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  55. package/es/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  56. package/es/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  57. package/es/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +36 -36
  58. package/es/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  59. package/es/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  60. package/es/Tag/__tests__/__snapshots__/Tag.spec.js.snap +46 -46
  61. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +164 -164
  62. package/es/css.js +0 -1
  63. package/es/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +10 -10
  64. package/es/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  65. package/lib/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  66. package/lib/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  67. package/lib/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  68. package/lib/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  69. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +98 -121
  70. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +45 -45
  71. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +24 -24
  72. package/lib/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  73. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +87 -87
  74. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  75. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +5 -5
  76. package/lib/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +6 -6
  77. package/lib/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  78. package/lib/DateTime/__tests__/__snapshots__/Time.spec.js.snap +25 -25
  79. package/lib/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  80. package/lib/Layout/Box.js +7 -120
  81. package/lib/Layout/Container.js +7 -137
  82. package/lib/Layout/props/defaultProps.js +14 -19
  83. package/lib/Layout/props/propTypes.js +13 -52
  84. package/lib/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  85. package/lib/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  86. package/lib/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  87. package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -69
  88. package/lib/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  89. package/lib/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +69 -69
  90. package/lib/MultiSelect/AdvancedMultiSelect.js +4 -2
  91. package/lib/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +3 -3
  92. package/lib/MultiSelect/MultiSelect.js +50 -45
  93. package/lib/MultiSelect/MultiSelectWithAvatar.js +4 -2
  94. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  95. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  96. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +31 -31
  97. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +6 -6
  98. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  99. package/lib/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  100. package/lib/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  101. package/lib/MultiSelect/props/defaultProps.js +3 -0
  102. package/lib/MultiSelect/props/propTypes.js +1 -0
  103. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +130 -130
  104. package/lib/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  105. package/lib/Select/GroupSelect.js +4 -2
  106. package/lib/Select/Select.js +9 -5
  107. package/lib/Select/SelectWithAvatar.js +4 -2
  108. package/lib/Select/SelectWithIcon.js +4 -2
  109. package/lib/Select/__tests__/SelectWithIcon.spec.js +3 -1
  110. package/lib/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +6 -6
  111. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +771 -749
  112. package/lib/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  113. package/lib/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +9 -9
  114. package/lib/Select/props/defaultProps.js +5 -2
  115. package/lib/Select/props/propTypes.js +3 -0
  116. package/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap +44 -44
  117. package/lib/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  118. package/lib/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  119. package/lib/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  120. package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +36 -36
  121. package/lib/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  122. package/lib/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  123. package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap +46 -46
  124. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +164 -164
  125. package/lib/css.js +0 -2
  126. package/lib/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +10 -10
  127. package/lib/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  128. package/package.json +5 -5
  129. package/es/Layout/Layout.module.css +0 -336
  130. package/es/Layout/__tests__/Box.spec.js +0 -11
  131. package/es/Layout/__tests__/Container.spec.js +0 -11
  132. package/es/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  133. package/es/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  134. package/es/Layout/utils.js +0 -29
  135. package/lib/Layout/Layout.module.css +0 -336
  136. package/lib/Layout/__tests__/Box.spec.js +0 -18
  137. package/lib/Layout/__tests__/Container.spec.js +0 -18
  138. package/lib/Layout/__tests__/__snapshots__/Box.spec.js.snap +0 -16
  139. package/lib/Layout/__tests__/__snapshots__/Container.spec.js.snap +0 -16
  140. package/lib/Layout/utils.js +0 -59
package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap CHANGED
@@ -9,13 +9,13 @@ exports[`MultiSelect Should render with renderCustomSelectedValue 1`] = `
9
9
  data-test-id="multiSelect"
10
10
  >
11
11
  <div
12
- class="container medium borderColor_default hasBorder flex cover rowdir wrap vCenter"
12
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
13
13
  data-id="containerComponent"
14
14
  data-selector-id="container"
15
15
  data-test-id="containerComponent"
16
16
  >
17
17
  <div
18
- class="wrapper grow basisAuto shrinkOn"
18
+ class="flexible basis_auto shrink wrapper"
19
19
  data-id="boxComponent"
20
20
  data-selector-id="box"
21
21
  data-test-id="boxComponent"
@@ -25,11 +25,11 @@ exports[`MultiSelect Should render with renderCustomSelectedValue 1`] = `
25
25
  "
26
26
  />
27
27
  <div
28
- class="varClass customContainer effect container custmInputWrapper flex rowdir"
28
+ class="flex row varClass customContainer effect container custmInputWrapper"
29
29
  data-selector-id="textBoxIcon"
30
30
  >
31
31
  <div
32
- class="grow basis shrinkOff"
32
+ class="flexible basis_zero noShrink"
33
33
  data-id="boxComponent"
34
34
  data-selector-id="box"
35
35
  data-test-id="boxComponent"
@@ -50,25 +50,25 @@ exports[`MultiSelect Should render with renderCustomSelectedValue 1`] = `
50
50
  />
51
51
  </div>
52
52
  <div
53
- class="iconContainer shrinkOff"
53
+ class="noShrink iconContainer"
54
54
  data-id="boxComponent"
55
55
  data-selector-id="box"
56
56
  data-test-id="boxComponent"
57
57
  >
58
58
  <div
59
- class="flex cover rowdir"
59
+ class="flex fullSize row"
60
60
  data-id="containerComponent"
61
61
  data-selector-id="container"
62
62
  data-test-id="containerComponent"
63
63
  >
64
64
  <div
65
- class="icon shrinkOff"
65
+ class="noShrink icon"
66
66
  data-id="boxComponent"
67
67
  data-selector-id="box"
68
68
  data-test-id="boxComponent"
69
69
  >
70
70
  <div
71
- class="rightPlaceholder inflex rowdir vCenter"
71
+ class="inlineFlex row alignItems_center rightPlaceholder"
72
72
  data-id="containerComponent"
73
73
  data-selector-id="container"
74
74
  data-test-id="containerComponent"
@@ -92,13 +92,13 @@ exports[`MultiSelect rendering the defult props 1`] = `
92
92
  data-test-id="multiSelect"
93
93
  >
94
94
  <div
95
- class="container medium borderColor_default hasBorder flex cover rowdir wrap vCenter"
95
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
96
96
  data-id="containerComponent"
97
97
  data-selector-id="container"
98
98
  data-test-id="containerComponent"
99
99
  >
100
100
  <div
101
- class="wrapper grow basisAuto shrinkOn"
101
+ class="flexible basis_auto shrink wrapper"
102
102
  data-id="boxComponent"
103
103
  data-selector-id="box"
104
104
  data-test-id="boxComponent"
@@ -108,11 +108,11 @@ exports[`MultiSelect rendering the defult props 1`] = `
108
108
  "
109
109
  />
110
110
  <div
111
- class="varClass customContainer effect container custmInputWrapper flex rowdir"
111
+ class="flex row varClass customContainer effect container custmInputWrapper"
112
112
  data-selector-id="textBoxIcon"
113
113
  >
114
114
  <div
115
- class="grow basis shrinkOff"
115
+ class="flexible basis_zero noShrink"
116
116
  data-id="boxComponent"
117
117
  data-selector-id="box"
118
118
  data-test-id="boxComponent"
@@ -133,25 +133,25 @@ exports[`MultiSelect rendering the defult props 1`] = `
133
133
  />
134
134
  </div>
135
135
  <div
136
- class="iconContainer shrinkOff"
136
+ class="noShrink iconContainer"
137
137
  data-id="boxComponent"
138
138
  data-selector-id="box"
139
139
  data-test-id="boxComponent"
140
140
  >
141
141
  <div
142
- class="flex cover rowdir"
142
+ class="flex fullSize row"
143
143
  data-id="containerComponent"
144
144
  data-selector-id="container"
145
145
  data-test-id="containerComponent"
146
146
  >
147
147
  <div
148
- class="icon shrinkOff"
148
+ class="noShrink icon"
149
149
  data-id="boxComponent"
150
150
  data-selector-id="box"
151
151
  data-test-id="boxComponent"
152
152
  >
153
153
  <div
154
- class="rightPlaceholder inflex rowdir vCenter"
154
+ class="inlineFlex row alignItems_center rightPlaceholder"
155
155
  data-id="containerComponent"
156
156
  data-selector-id="container"
157
157
  data-test-id="containerComponent"
@@ -175,13 +175,13 @@ exports[`MultiSelect rendering with limit feature 1`] = `
175
175
  data-test-id="multiSelect"
176
176
  >
177
177
  <div
178
- class="container medium borderColor_default hasBorder flex cover rowdir wrap vCenter"
178
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
179
179
  data-id="containerComponent"
180
180
  data-selector-id="container"
181
181
  data-test-id="containerComponent"
182
182
  >
183
183
  <div
184
- class="tag medium shrinkOff"
184
+ class="noShrink tag medium"
185
185
  data-id="multiSelect_selectedOptions"
186
186
  data-selector-id="box"
187
187
  data-test-id="multiSelect_selectedOptions"
@@ -213,7 +213,7 @@ exports[`MultiSelect rendering with limit feature 1`] = `
213
213
  value="text"
214
214
  >
215
215
  <div
216
- class="flex cover coldir both"
216
+ class="flex fullSize column alignItems_center justifyContent_center"
217
217
  data-id="containerComponent"
218
218
  data-selector-id="container"
219
219
  data-test-id="containerComponent"
@@ -231,7 +231,7 @@ exports[`MultiSelect rendering with limit feature 1`] = `
231
231
  </div>
232
232
  </div>
233
233
  <div
234
- class="tag medium shrinkOff"
234
+ class="noShrink tag medium"
235
235
  data-id="multiSelect_selectedOptions"
236
236
  data-selector-id="box"
237
237
  data-test-id="multiSelect_selectedOptions"
@@ -263,7 +263,7 @@ exports[`MultiSelect rendering with limit feature 1`] = `
263
263
  value="text"
264
264
  >
265
265
  <div
266
- class="flex cover coldir both"
266
+ class="flex fullSize column alignItems_center justifyContent_center"
267
267
  data-id="containerComponent"
268
268
  data-selector-id="container"
269
269
  data-test-id="containerComponent"
@@ -281,7 +281,7 @@ exports[`MultiSelect rendering with limit feature 1`] = `
281
281
  </div>
282
282
  </div>
283
283
  <div
284
- class="tag medium shrinkOff"
284
+ class="noShrink tag medium"
285
285
  data-id="multiSelect_selectedOptions"
286
286
  data-selector-id="box"
287
287
  data-test-id="multiSelect_selectedOptions"
@@ -313,7 +313,7 @@ exports[`MultiSelect rendering with limit feature 1`] = `
313
313
  value="text"
314
314
  >
315
315
  <div
316
- class="flex cover coldir both"
316
+ class="flex fullSize column alignItems_center justifyContent_center"
317
317
  data-id="containerComponent"
318
318
  data-selector-id="container"
319
319
  data-test-id="containerComponent"
@@ -331,7 +331,7 @@ exports[`MultiSelect rendering with limit feature 1`] = `
331
331
  </div>
332
332
  </div>
333
333
  <div
334
- class="wrapper grow basisAuto shrinkOn"
334
+ class="flexible basis_auto shrink wrapper"
335
335
  data-id="boxComponent"
336
336
  data-selector-id="box"
337
337
  data-test-id="boxComponent"
@@ -341,11 +341,11 @@ exports[`MultiSelect rendering with limit feature 1`] = `
341
341
  "
342
342
  />
343
343
  <div
344
- class="varClass customContainer effect container custmInputWrapper flex rowdir"
344
+ class="flex row varClass customContainer effect container custmInputWrapper"
345
345
  data-selector-id="textBoxIcon"
346
346
  >
347
347
  <div
348
- class="grow basis shrinkOff"
348
+ class="flexible basis_zero noShrink"
349
349
  data-id="boxComponent"
350
350
  data-selector-id="box"
351
351
  data-test-id="boxComponent"
@@ -367,31 +367,31 @@ exports[`MultiSelect rendering with limit feature 1`] = `
367
367
  />
368
368
  </div>
369
369
  <div
370
- class="iconContainer shrinkOff"
370
+ class="noShrink iconContainer"
371
371
  data-id="boxComponent"
372
372
  data-selector-id="box"
373
373
  data-test-id="boxComponent"
374
374
  >
375
375
  <div
376
- class="flex cover rowdir"
376
+ class="flex fullSize row"
377
377
  data-id="containerComponent"
378
378
  data-selector-id="container"
379
379
  data-test-id="containerComponent"
380
380
  >
381
381
  <div
382
- class="icon shrinkOff"
382
+ class="noShrink icon"
383
383
  data-id="boxComponent"
384
384
  data-selector-id="box"
385
385
  data-test-id="boxComponent"
386
386
  >
387
387
  <div
388
- class="rightPlaceholder inflex rowdir vCenter"
388
+ class="inlineFlex row alignItems_center rightPlaceholder"
389
389
  data-id="containerComponent"
390
390
  data-selector-id="container"
391
391
  data-test-id="containerComponent"
392
392
  >
393
393
  <button
394
- class="delete defaultDelete shrinkOff"
394
+ class="noShrink delete defaultDelete"
395
395
  data-id="multiSelect_clearIcon"
396
396
  data-selector-id="box"
397
397
  data-test-id="multiSelect_clearIcon"
package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap CHANGED
@@ -3,7 +3,7 @@
3
3
  exports[`MultiSelectHeader rendering the basic value 1`] = `
4
4
  <DocumentFragment>
5
5
  <li
6
- class="list medium default withBorder selectAll flex rowdir vCenter"
6
+ class="flex row alignItems_center list medium default withBorder selectAll"
7
7
  data-a11y-inset-focus="true"
8
8
  data-id="MultiSelectHeader_selectAll"
9
9
  data-selector-id="listItemWithIcon"
@@ -12,7 +12,7 @@ exports[`MultiSelectHeader rendering the basic value 1`] = `
12
12
  tabindex="0"
13
13
  >
14
14
  <div
15
- class="contentWrapper shrinkOff"
15
+ class="noShrink contentWrapper"
16
16
  data-id="boxComponent"
17
17
  data-selector-id="box"
18
18
  data-test-id="boxComponent"
@@ -24,7 +24,7 @@ exports[`MultiSelectHeader rendering the basic value 1`] = `
24
24
  data-test-id="MultiSelectHeader_selectAll_Icon"
25
25
  >
26
26
  <div
27
- class="iconWrapper shrinkOff selfStart"
27
+ class="noShrink alignSelf_start iconWrapper"
28
28
  data-id="boxComponent"
29
29
  data-selector-id="box"
30
30
  data-test-id="boxComponent"
@@ -40,19 +40,19 @@ exports[`MultiSelectHeader rendering the basic value 1`] = `
40
40
  </div>
41
41
  </div>
42
42
  <div
43
- class="leftBox selfAlign_center grow basis shrinkOff"
43
+ class="flexible basis_zero noShrink leftBox selfAlign_center"
44
44
  data-id="boxComponent"
45
45
  data-selector-id="box"
46
46
  data-test-id="boxComponent"
47
47
  >
48
48
  <div
49
- class="titleBox shrinkOff"
49
+ class="noShrink titleBox"
50
50
  data-id="boxComponent"
51
51
  data-selector-id="box"
52
52
  data-test-id="boxComponent"
53
53
  >
54
54
  <div
55
- class="value basisAuto shrinkOn"
55
+ class="basis_auto shrink value"
56
56
  data-id="MultiSelectHeader_selectAll_Text"
57
57
  data-selector-id="box"
58
58
  data-test-id="MultiSelectHeader_selectAll_Text"
package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap CHANGED
@@ -9,13 +9,13 @@ exports[`MultiSelectWithAvatar rendering the defult props 1`] = `
9
9
  data-test-id="multiSelectWithAvatar"
10
10
  >
11
11
  <div
12
- class="container medium borderColor_default undefined hasBorder flex cover rowdir wrap vCenter"
12
+ class="flex fullSize row wrap alignItems_center container medium borderColor_default undefined hasBorder"
13
13
  data-id="containerComponent"
14
14
  data-selector-id="container"
15
15
  data-test-id="containerComponent"
16
16
  >
17
17
  <div
18
- class="wrapper grow basisAuto shrinkOn"
18
+ class="flexible basis_auto shrink wrapper"
19
19
  data-id="boxComponent"
20
20
  data-selector-id="box"
21
21
  data-test-id="boxComponent"
@@ -25,11 +25,11 @@ exports[`MultiSelectWithAvatar rendering the defult props 1`] = `
25
25
  "
26
26
  />
27
27
  <div
28
- class="varClass customContainer effect container custmInputWrapper flex rowdir"
28
+ class="flex row varClass customContainer effect container custmInputWrapper"
29
29
  data-selector-id="textBoxIcon"
30
30
  >
31
31
  <div
32
- class="grow basis shrinkOff"
32
+ class="flexible basis_zero noShrink"
33
33
  data-id="boxComponent"
34
34
  data-selector-id="box"
35
35
  data-test-id="boxComponent"
@@ -49,25 +49,25 @@ exports[`MultiSelectWithAvatar rendering the defult props 1`] = `
49
49
  />
50
50
  </div>
51
51
  <div
52
- class="iconContainer shrinkOff"
52
+ class="noShrink iconContainer"
53
53
  data-id="boxComponent"
54
54
  data-selector-id="box"
55
55
  data-test-id="boxComponent"
56
56
  >
57
57
  <div
58
- class="flex cover rowdir"
58
+ class="flex fullSize row"
59
59
  data-id="containerComponent"
60
60
  data-selector-id="container"
61
61
  data-test-id="containerComponent"
62
62
  >
63
63
  <div
64
- class="icon shrinkOff"
64
+ class="noShrink icon"
65
65
  data-id="boxComponent"
66
66
  data-selector-id="box"
67
67
  data-test-id="boxComponent"
68
68
  >
69
69
  <div
70
- class="rightPlaceholder inflex rowdir vCenter"
70
+ class="inlineFlex row alignItems_center rightPlaceholder"
71
71
  data-id="containerComponent"
72
72
  data-selector-id="container"
73
73
  data-test-id="containerComponent"
package/es/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap CHANGED
@@ -3,7 +3,7 @@
3
3
  exports[`SelectedOptions Should render with renderCustomSelectedValue 1`] = `
4
4
  <DocumentFragment>
5
5
  <div
6
- class="tag medium shrinkOff"
6
+ class="noShrink tag medium"
7
7
  data-id="selectedOptions"
8
8
  data-selector-id="box"
9
9
  data-test-id="selectedOptions"
@@ -18,7 +18,7 @@ exports[`SelectedOptions Should render with renderCustomSelectedValue 1`] = `
18
18
  exports[`SelectedOptions rendering the basic select options 1`] = `
19
19
  <DocumentFragment>
20
20
  <div
21
- class="tag medium shrinkOff"
21
+ class="noShrink tag medium"
22
22
  data-id="selectedOptions"
23
23
  data-selector-id="box"
24
24
  data-test-id="selectedOptions"
@@ -42,7 +42,7 @@ exports[`SelectedOptions rendering the basic select options 1`] = `
42
42
  </div>
43
43
  </div>
44
44
  <div
45
- class="tag medium shrinkOff"
45
+ class="noShrink tag medium"
46
46
  data-id="selectedOptions"
47
47
  data-selector-id="box"
48
48
  data-test-id="selectedOptions"
@@ -66,7 +66,7 @@ exports[`SelectedOptions rendering the basic select options 1`] = `
66
66
  </div>
67
67
  </div>
68
68
  <div
69
- class="tag medium shrinkOff"
69
+ class="noShrink tag medium"
70
70
  data-id="selectedOptions"
71
71
  data-selector-id="box"
72
72
  data-test-id="selectedOptions"