@zohodesk/components 1.5.8 → 1.5.9

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 (52) hide show
  1. package/README.md +13 -0
  2. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +5 -5
  3. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +6 -6
  4. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +3 -3
  5. package/es/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +1 -1
  6. package/es/DateTime/__tests__/__snapshots__/Time.spec.js.snap +3 -3
  7. package/es/ListItem/ListItem.js +0 -1
  8. package/es/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +1 -1
  9. package/es/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +1 -1
  10. package/es/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +3 -3
  11. package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +3 -3
  12. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +1 -1
  13. package/es/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +1 -1
  14. package/es/Select/Select.js +5 -3
  15. package/es/Select/__tests__/Select.spec.js +5 -0
  16. package/es/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +1 -1
  17. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +105 -115
  18. package/es/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +1 -1
  19. package/es/Select/props/propTypes.js +2 -1
  20. package/es/TextBoxIcon/TextBoxIcon.js +0 -1
  21. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +39 -39
  22. package/es/shared/InputFieldLine/InputFieldLine.js +2 -1
  23. package/es/shared/InputFieldLine/InputFieldLine.module.css +13 -7
  24. package/es/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  25. package/es/shared/InputFieldLine/props/defaultProps.js +2 -2
  26. package/es/shared/InputFieldLine/props/propTypes.js +1 -1
  27. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +5 -5
  28. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +6 -6
  29. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +3 -3
  30. package/lib/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +1 -1
  31. package/lib/DateTime/__tests__/__snapshots__/Time.spec.js.snap +3 -3
  32. package/lib/ListItem/ListItem.js +0 -1
  33. package/lib/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +1 -1
  34. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +1 -1
  35. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +3 -3
  36. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +3 -3
  37. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +1 -1
  38. package/lib/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +1 -1
  39. package/lib/Select/Select.js +8 -5
  40. package/lib/Select/__tests__/Select.spec.js +5 -0
  41. package/lib/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +1 -1
  42. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +105 -115
  43. package/lib/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +1 -1
  44. package/lib/Select/props/propTypes.js +2 -1
  45. package/lib/TextBoxIcon/TextBoxIcon.js +0 -1
  46. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +39 -39
  47. package/lib/shared/InputFieldLine/InputFieldLine.js +2 -1
  48. package/lib/shared/InputFieldLine/InputFieldLine.module.css +13 -7
  49. package/lib/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  50. package/lib/shared/InputFieldLine/props/defaultProps.js +2 -2
  51. package/lib/shared/InputFieldLine/props/propTypes.js +1 -1
  52. package/package.json +5 -5
package/es/Select/__tests__/__snapshots__/Select.spec.js.snap CHANGED
@@ -12,7 +12,7 @@ exports[`Select - Should close the dropdown when clicking outside 1`] = `
12
12
  data-test-id="selectComponent"
13
13
  >
14
14
  <div
15
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
15
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
16
16
  data-selector-id="textBoxIcon"
17
17
  >
18
18
  <div
@@ -105,7 +105,7 @@ exports[`Select - Should highlight the next list-items, when arrow keys pressed
105
105
  data-test-id="selectComponent"
106
106
  >
107
107
  <div
108
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
108
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
109
109
  data-selector-id="textBoxIcon"
110
110
  >
111
111
  <div
@@ -123,7 +123,7 @@ exports[`Select - Should highlight the next list-items, when arrow keys pressed
123
123
  aria-owns="1"
124
124
  aria-readonly="true"
125
125
  autocomplete="off"
126
- class=" pointer container medium default effect focus borderColor_default inputDotted "
126
+ class=" pointer container medium default effect borderColor_default inputDotted "
127
127
  data-id="selectComponent_textBox"
128
128
  data-selector-id="textBoxIcon"
129
129
  data-test-id="selectComponent_textBox"
@@ -183,7 +183,7 @@ exports[`Select - Should highlight the next list-items, when arrow keys pressed
183
183
  </div>
184
184
  </div>
185
185
  <div
186
- class="main container bottomMid default"
186
+ class="main hidden container bottomMid default"
187
187
  data-a11y-focus-main-area="true"
188
188
  data-arrow-position="mid"
189
189
  data-box-direction="bottom"
@@ -192,10 +192,9 @@ exports[`Select - Should highlight the next list-items, when arrow keys pressed
192
192
  data-selector-id="dropBox"
193
193
  data-test-id="selectComponent_suggestions"
194
194
  dot-ui-element="dropbox"
195
- style="z-index: 4;"
196
195
  >
197
196
  <div
198
- class="subContainer shadow radius bounce defaultPalette"
197
+ class="subContainer shadow radius defaultPalette"
199
198
  data-id="selectComponent_suggestions_subcontainer"
200
199
  data-selector-id="dropBox_subcontainer"
201
200
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -392,7 +391,7 @@ exports[`Select - Should not open the dropdown when disabled 1`] = `
392
391
  data-test-id="selectComponent_disabled"
393
392
  >
394
393
  <div
395
- class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
394
+ class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
396
395
  data-selector-id="textBoxIcon"
397
396
  data-title=""
398
397
  >
@@ -487,7 +486,7 @@ exports[`Select - Should not open the dropdown when readonly 1`] = `
487
486
  data-test-id="selectComponent_readOnly"
488
487
  >
489
488
  <div
490
- class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
489
+ class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
491
490
  data-selector-id="textBoxIcon"
492
491
  >
493
492
  <div
@@ -580,7 +579,7 @@ exports[`Select - Should open the dropdown, when click on the input 1`] = `
580
579
  data-test-id="selectComponent"
581
580
  >
582
581
  <div
583
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
582
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
584
583
  data-selector-id="textBoxIcon"
585
584
  >
586
585
  <div
@@ -727,7 +726,7 @@ exports[`Select - Should render all the options when search value is cleared 1`]
727
726
  data-test-id="selectComponent"
728
727
  >
729
728
  <div
730
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
729
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
731
730
  data-selector-id="textBoxIcon"
732
731
  >
733
732
  <div
@@ -745,7 +744,7 @@ exports[`Select - Should render all the options when search value is cleared 1`]
745
744
  aria-owns="1"
746
745
  aria-readonly="true"
747
746
  autocomplete="off"
748
- class=" pointer container medium default effect focus borderColor_default inputDotted "
747
+ class=" pointer container medium default effect borderColor_default inputDotted "
749
748
  data-id="selectComponent_textBox"
750
749
  data-selector-id="textBoxIcon"
751
750
  data-test-id="selectComponent_textBox"
@@ -805,7 +804,7 @@ exports[`Select - Should render all the options when search value is cleared 1`]
805
804
  </div>
806
805
  </div>
807
806
  <div
808
- class="main container bottomMid default"
807
+ class="main hidden container bottomMid default"
809
808
  data-a11y-focus-main-area="true"
810
809
  data-arrow-position="mid"
811
810
  data-box-direction="bottom"
@@ -814,10 +813,9 @@ exports[`Select - Should render all the options when search value is cleared 1`]
814
813
  data-selector-id="dropBox"
815
814
  data-test-id="selectComponent_suggestions"
816
815
  dot-ui-element="dropbox"
817
- style="z-index: 4;"
818
816
  >
819
817
  <div
820
- class="subContainer shadow radius bounce defaultPalette"
818
+ class="subContainer shadow radius defaultPalette"
821
819
  data-id="selectComponent_suggestions_subcontainer"
822
820
  data-selector-id="dropBox_subcontainer"
823
821
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -851,7 +849,7 @@ exports[`Select - Should render all the options when search value is cleared 1`]
851
849
  class="search medium"
852
850
  >
853
851
  <div
854
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
852
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
855
853
  data-selector-id="textBoxIcon"
856
854
  >
857
855
  <div
@@ -1064,7 +1062,7 @@ exports[`Select - Should render given the options 1`] = `
1064
1062
  data-test-id="selectComponent"
1065
1063
  >
1066
1064
  <div
1067
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
1065
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
1068
1066
  data-selector-id="textBoxIcon"
1069
1067
  >
1070
1068
  <div
@@ -1351,7 +1349,7 @@ exports[`Select - Should render the Select component 1`] = `
1351
1349
  data-test-id="selectComponent"
1352
1350
  >
1353
1351
  <div
1354
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1352
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1355
1353
  data-selector-id="textBoxIcon"
1356
1354
  >
1357
1355
  <div
@@ -1442,7 +1440,7 @@ exports[`Select - Should render the default selected value 1`] = `
1442
1440
  data-test-id="selectComponent"
1443
1441
  >
1444
1442
  <div
1445
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1443
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1446
1444
  data-selector-id="textBoxIcon"
1447
1445
  >
1448
1446
  <div
@@ -1535,7 +1533,7 @@ exports[`Select - Should render the given selected value 1`] = `
1535
1533
  data-test-id="selectComponent"
1536
1534
  >
1537
1535
  <div
1538
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1536
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1539
1537
  data-selector-id="textBoxIcon"
1540
1538
  >
1541
1539
  <div
@@ -1628,7 +1626,7 @@ exports[`Select - Should render the only options matching search value 1`] = `
1628
1626
  data-test-id="selectComponent"
1629
1627
  >
1630
1628
  <div
1631
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
1629
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1632
1630
  data-selector-id="textBoxIcon"
1633
1631
  >
1634
1632
  <div
@@ -1646,7 +1644,7 @@ exports[`Select - Should render the only options matching search value 1`] = `
1646
1644
  aria-owns="1"
1647
1645
  aria-readonly="true"
1648
1646
  autocomplete="off"
1649
- class=" pointer container medium default effect focus borderColor_default inputDotted "
1647
+ class=" pointer container medium default effect borderColor_default inputDotted "
1650
1648
  data-id="selectComponent_textBox"
1651
1649
  data-selector-id="textBoxIcon"
1652
1650
  data-test-id="selectComponent_textBox"
@@ -1706,7 +1704,7 @@ exports[`Select - Should render the only options matching search value 1`] = `
1706
1704
  </div>
1707
1705
  </div>
1708
1706
  <div
1709
- class="main container bottomMid default"
1707
+ class="main hidden container bottomMid default"
1710
1708
  data-a11y-focus-main-area="true"
1711
1709
  data-arrow-position="mid"
1712
1710
  data-box-direction="bottom"
@@ -1715,10 +1713,9 @@ exports[`Select - Should render the only options matching search value 1`] = `
1715
1713
  data-selector-id="dropBox"
1716
1714
  data-test-id="selectComponent_suggestions"
1717
1715
  dot-ui-element="dropbox"
1718
- style="z-index: 4;"
1719
1716
  >
1720
1717
  <div
1721
- class="subContainer shadow radius bounce defaultPalette"
1718
+ class="subContainer shadow radius defaultPalette"
1722
1719
  data-id="selectComponent_suggestions_subcontainer"
1723
1720
  data-selector-id="dropBox_subcontainer"
1724
1721
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -1752,7 +1749,7 @@ exports[`Select - Should render the only options matching search value 1`] = `
1752
1749
  class="search medium"
1753
1750
  >
1754
1751
  <div
1755
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
1752
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
1756
1753
  data-selector-id="textBoxIcon"
1757
1754
  >
1758
1755
  <div
@@ -1874,7 +1871,7 @@ exports[`Select - Should render the only options matching search value even with
1874
1871
  data-test-id="selectComponent"
1875
1872
  >
1876
1873
  <div
1877
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
1874
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
1878
1875
  data-selector-id="textBoxIcon"
1879
1876
  >
1880
1877
  <div
@@ -1892,7 +1889,7 @@ exports[`Select - Should render the only options matching search value even with
1892
1889
  aria-owns="1"
1893
1890
  aria-readonly="true"
1894
1891
  autocomplete="off"
1895
- class=" pointer container medium default effect focus borderColor_default inputDotted "
1892
+ class=" pointer container medium default effect borderColor_default inputDotted "
1896
1893
  data-id="selectComponent_textBox"
1897
1894
  data-selector-id="textBoxIcon"
1898
1895
  data-test-id="selectComponent_textBox"
@@ -1952,7 +1949,7 @@ exports[`Select - Should render the only options matching search value even with
1952
1949
  </div>
1953
1950
  </div>
1954
1951
  <div
1955
- class="main container bottomMid default"
1952
+ class="main hidden container bottomMid default"
1956
1953
  data-a11y-focus-main-area="true"
1957
1954
  data-arrow-position="mid"
1958
1955
  data-box-direction="bottom"
@@ -1961,10 +1958,9 @@ exports[`Select - Should render the only options matching search value even with
1961
1958
  data-selector-id="dropBox"
1962
1959
  data-test-id="selectComponent_suggestions"
1963
1960
  dot-ui-element="dropbox"
1964
- style="z-index: 4;"
1965
1961
  >
1966
1962
  <div
1967
- class="subContainer shadow radius bounce defaultPalette"
1963
+ class="subContainer shadow radius defaultPalette"
1968
1964
  data-id="selectComponent_suggestions_subcontainer"
1969
1965
  data-selector-id="dropBox_subcontainer"
1970
1966
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -1998,7 +1994,7 @@ exports[`Select - Should render the only options matching search value even with
1998
1994
  class="search medium"
1999
1995
  >
2000
1996
  <div
2001
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
1997
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
2002
1998
  data-selector-id="textBoxIcon"
2003
1999
  >
2004
2000
  <div
@@ -2145,7 +2141,7 @@ exports[`Select - Should render the placeholder when there is no default value 1
2145
2141
  data-test-id="selectComponent"
2146
2142
  >
2147
2143
  <div
2148
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
2144
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
2149
2145
  data-selector-id="textBoxIcon"
2150
2146
  >
2151
2147
  <div
@@ -2238,7 +2234,7 @@ exports[`Select - Should show the custom empty state using getCustomEmptyState p
2238
2234
  data-test-id="selectComponent"
2239
2235
  >
2240
2236
  <div
2241
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
2237
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
2242
2238
  data-selector-id="textBoxIcon"
2243
2239
  >
2244
2240
  <div
@@ -2256,7 +2252,7 @@ exports[`Select - Should show the custom empty state using getCustomEmptyState p
2256
2252
  aria-owns="1"
2257
2253
  aria-readonly="true"
2258
2254
  autocomplete="off"
2259
- class=" pointer container medium default effect focus borderColor_default inputDotted "
2255
+ class=" pointer container medium default effect borderColor_default inputDotted "
2260
2256
  data-id="selectComponent_textBox"
2261
2257
  data-selector-id="textBoxIcon"
2262
2258
  data-test-id="selectComponent_textBox"
@@ -2316,7 +2312,7 @@ exports[`Select - Should show the custom empty state using getCustomEmptyState p
2316
2312
  </div>
2317
2313
  </div>
2318
2314
  <div
2319
- class="main container bottomMid default"
2315
+ class="main hidden container bottomMid default"
2320
2316
  data-a11y-focus-main-area="true"
2321
2317
  data-arrow-position="mid"
2322
2318
  data-box-direction="bottom"
@@ -2325,10 +2321,9 @@ exports[`Select - Should show the custom empty state using getCustomEmptyState p
2325
2321
  data-selector-id="dropBox"
2326
2322
  data-test-id="selectComponent_suggestions"
2327
2323
  dot-ui-element="dropbox"
2328
- style="z-index: 4;"
2329
2324
  >
2330
2325
  <div
2331
- class="subContainer shadow radius bounce defaultPalette"
2326
+ class="subContainer shadow radius defaultPalette"
2332
2327
  data-id="selectComponent_suggestions_subcontainer"
2333
2328
  data-selector-id="dropBox_subcontainer"
2334
2329
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -2362,7 +2357,7 @@ exports[`Select - Should show the custom empty state using getCustomEmptyState p
2362
2357
  class="search medium"
2363
2358
  >
2364
2359
  <div
2365
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
2360
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
2366
2361
  data-selector-id="textBoxIcon"
2367
2362
  >
2368
2363
  <div
@@ -2433,7 +2428,7 @@ exports[`Select - Should show the empty message when open the dropdown with no o
2433
2428
  data-test-id="selectComponent"
2434
2429
  >
2435
2430
  <div
2436
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
2431
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
2437
2432
  data-selector-id="textBoxIcon"
2438
2433
  >
2439
2434
  <div
@@ -2582,7 +2577,7 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
2582
2577
  data-test-id="selectComponent"
2583
2578
  >
2584
2579
  <div
2585
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
2580
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
2586
2581
  data-selector-id="textBoxIcon"
2587
2582
  >
2588
2583
  <div
@@ -2600,7 +2595,7 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
2600
2595
  aria-owns="1"
2601
2596
  aria-readonly="true"
2602
2597
  autocomplete="off"
2603
- class=" pointer container medium default effect focus borderColor_default inputDotted "
2598
+ class=" pointer container medium default effect borderColor_default inputDotted "
2604
2599
  data-id="selectComponent_textBox"
2605
2600
  data-selector-id="textBoxIcon"
2606
2601
  data-test-id="selectComponent_textBox"
@@ -2660,7 +2655,7 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
2660
2655
  </div>
2661
2656
  </div>
2662
2657
  <div
2663
- class="main container bottomMid default"
2658
+ class="main hidden container bottomMid default"
2664
2659
  data-a11y-focus-main-area="true"
2665
2660
  data-arrow-position="mid"
2666
2661
  data-box-direction="bottom"
@@ -2669,10 +2664,9 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
2669
2664
  data-selector-id="dropBox"
2670
2665
  data-test-id="selectComponent_suggestions"
2671
2666
  dot-ui-element="dropbox"
2672
- style="z-index: 4;"
2673
2667
  >
2674
2668
  <div
2675
- class="subContainer shadow radius bounce defaultPalette"
2669
+ class="subContainer shadow radius defaultPalette"
2676
2670
  data-id="selectComponent_suggestions_subcontainer"
2677
2671
  data-selector-id="dropBox_subcontainer"
2678
2672
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -3177,7 +3171,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
3177
3171
  data-test-id="selectComponent"
3178
3172
  >
3179
3173
  <div
3180
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
3174
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
3181
3175
  data-selector-id="textBoxIcon"
3182
3176
  >
3183
3177
  <div
@@ -3195,7 +3189,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
3195
3189
  aria-owns="1"
3196
3190
  aria-readonly="true"
3197
3191
  autocomplete="off"
3198
- class=" pointer container medium default effect focus borderColor_default inputDotted "
3192
+ class=" pointer container medium default effect borderColor_default inputDotted "
3199
3193
  data-id="selectComponent_textBox"
3200
3194
  data-selector-id="textBoxIcon"
3201
3195
  data-test-id="selectComponent_textBox"
@@ -3255,7 +3249,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
3255
3249
  </div>
3256
3250
  </div>
3257
3251
  <div
3258
- class="main container bottomMid default"
3252
+ class="main hidden container bottomMid default"
3259
3253
  data-a11y-focus-main-area="true"
3260
3254
  data-arrow-position="mid"
3261
3255
  data-box-direction="bottom"
@@ -3264,10 +3258,9 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
3264
3258
  data-selector-id="dropBox"
3265
3259
  data-test-id="selectComponent_suggestions"
3266
3260
  dot-ui-element="dropbox"
3267
- style="z-index: 4;"
3268
3261
  >
3269
3262
  <div
3270
- class="subContainer shadow radius bounce defaultPalette"
3263
+ class="subContainer shadow radius defaultPalette"
3271
3264
  data-id="selectComponent_suggestions_subcontainer"
3272
3265
  data-selector-id="dropBox_subcontainer"
3273
3266
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -3301,7 +3294,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
3301
3294
  class="search medium"
3302
3295
  >
3303
3296
  <div
3304
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
3297
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
3305
3298
  data-selector-id="textBoxIcon"
3306
3299
  >
3307
3300
  <div
@@ -3563,7 +3556,7 @@ exports[`Select - Should trigger onAddNewOption, when click on the custom search
3563
3556
  data-test-id="selectComponent"
3564
3557
  >
3565
3558
  <div
3566
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
3559
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
3567
3560
  data-selector-id="textBoxIcon"
3568
3561
  >
3569
3562
  <div
@@ -3581,7 +3574,7 @@ exports[`Select - Should trigger onAddNewOption, when click on the custom search
3581
3574
  aria-owns="1"
3582
3575
  aria-readonly="true"
3583
3576
  autocomplete="off"
3584
- class=" pointer container medium default effect focus borderColor_default inputDotted "
3577
+ class=" pointer container medium default effect borderColor_default inputDotted "
3585
3578
  data-id="selectComponent_textBox"
3586
3579
  data-selector-id="textBoxIcon"
3587
3580
  data-test-id="selectComponent_textBox"
@@ -3641,7 +3634,7 @@ exports[`Select - Should trigger onAddNewOption, when click on the custom search
3641
3634
  </div>
3642
3635
  </div>
3643
3636
  <div
3644
- class="main container bottomMid default"
3637
+ class="main hidden container bottomMid default"
3645
3638
  data-a11y-focus-main-area="true"
3646
3639
  data-arrow-position="mid"
3647
3640
  data-box-direction="bottom"
@@ -3650,10 +3643,9 @@ exports[`Select - Should trigger onAddNewOption, when click on the custom search
3650
3643
  data-selector-id="dropBox"
3651
3644
  data-test-id="selectComponent_suggestions"
3652
3645
  dot-ui-element="dropbox"
3653
- style="z-index: 4;"
3654
3646
  >
3655
3647
  <div
3656
- class="subContainer shadow radius bounce defaultPalette"
3648
+ class="subContainer shadow radius defaultPalette"
3657
3649
  data-id="selectComponent_suggestions_subcontainer"
3658
3650
  data-selector-id="dropBox_subcontainer"
3659
3651
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -3687,7 +3679,7 @@ exports[`Select - Should trigger onAddNewOption, when click on the custom search
3687
3679
  class="search medium"
3688
3680
  >
3689
3681
  <div
3690
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
3682
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container flex rowdir"
3691
3683
  data-selector-id="textBoxIcon"
3692
3684
  >
3693
3685
  <div
@@ -3758,7 +3750,7 @@ exports[`Select - Should update the value when select the option 1`] = `
3758
3750
  data-test-id="selectComponent"
3759
3751
  >
3760
3752
  <div
3761
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
3753
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
3762
3754
  data-selector-id="textBoxIcon"
3763
3755
  >
3764
3756
  <div
@@ -4045,7 +4037,7 @@ exports[`Select - Should update the value when select the option 2`] = `
4045
4037
  data-test-id="selectComponent"
4046
4038
  >
4047
4039
  <div
4048
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
4040
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
4049
4041
  data-selector-id="textBoxIcon"
4050
4042
  >
4051
4043
  <div
@@ -4138,7 +4130,7 @@ exports[`Select - Should update the value, when select the option using keyboard
4138
4130
  data-test-id="selectComponent"
4139
4131
  >
4140
4132
  <div
4141
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
4133
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
4142
4134
  data-selector-id="textBoxIcon"
4143
4135
  >
4144
4136
  <div
@@ -4268,7 +4260,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with aria prope
4268
4260
  data-test-id="selectComponent"
4269
4261
  >
4270
4262
  <div
4271
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4263
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4272
4264
  data-selector-id="textBoxIcon"
4273
4265
  >
4274
4266
  <div
@@ -4395,7 +4387,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with autoComple
4395
4387
  data-test-id="selectComponent"
4396
4388
  >
4397
4389
  <div
4398
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4390
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4399
4391
  data-selector-id="textBoxIcon"
4400
4392
  >
4401
4393
  <div
@@ -4519,7 +4511,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with borderColo
4519
4511
  data-test-id="selectComponent"
4520
4512
  >
4521
4513
  <div
4522
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4514
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4523
4515
  data-selector-id="textBoxIcon"
4524
4516
  >
4525
4517
  <div
@@ -4644,7 +4636,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with borderColo
4644
4636
  data-test-id="selectComponent"
4645
4637
  >
4646
4638
  <div
4647
- class="varClass customContainer border_bottom effect borderColor_transparent hasBorder container input flex rowdir"
4639
+ class="varClass customContainer border_bottom effect borderColor_transparent hasBorder container input flex rowdir"
4648
4640
  data-selector-id="textBoxIcon"
4649
4641
  >
4650
4642
  <div
@@ -4770,7 +4762,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with customProp
4770
4762
  data-test-id="selectComponent"
4771
4763
  >
4772
4764
  <div
4773
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4765
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4774
4766
  data-selector-id="textBoxIcon"
4775
4767
  >
4776
4768
  <div
@@ -4897,7 +4889,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with htmlId - n
4897
4889
  data-test-id="selectComponent"
4898
4890
  >
4899
4891
  <div
4900
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4892
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
4901
4893
  data-selector-id="textBoxIcon"
4902
4894
  >
4903
4895
  <div
@@ -5024,7 +5016,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with isDisabled
5024
5016
  data-test-id="selectComponent_disabled"
5025
5017
  >
5026
5018
  <div
5027
- class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
5019
+ class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
5028
5020
  data-selector-id="textBoxIcon"
5029
5021
  data-title=""
5030
5022
  >
@@ -5207,7 +5199,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with isPopupOpe
5207
5199
  data-test-id="selectComponent"
5208
5200
  >
5209
5201
  <div
5210
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
5202
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
5211
5203
  data-selector-id="textBoxIcon"
5212
5204
  >
5213
5205
  <div
@@ -5388,7 +5380,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with isReadOnly
5388
5380
  data-test-id="selectComponent_readOnly"
5389
5381
  >
5390
5382
  <div
5391
- class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
5383
+ class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
5392
5384
  data-selector-id="textBoxIcon"
5393
5385
  >
5394
5386
  <div
@@ -5514,7 +5506,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with maxLength
5514
5506
  data-test-id="selectComponent"
5515
5507
  >
5516
5508
  <div
5517
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
5509
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
5518
5510
  data-selector-id="textBoxIcon"
5519
5511
  >
5520
5512
  <div
@@ -5639,7 +5631,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with needBorder
5639
5631
  data-test-id="selectComponent"
5640
5632
  >
5641
5633
  <div
5642
- class="varClass customContainer effect container input flex rowdir"
5634
+ class="varClass customContainer effect container input flex rowdir"
5643
5635
  data-selector-id="textBoxIcon"
5644
5636
  >
5645
5637
  <div
@@ -5764,7 +5756,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with placeHolde
5764
5756
  data-test-id="selectComponent"
5765
5757
  >
5766
5758
  <div
5767
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
5759
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
5768
5760
  data-selector-id="textBoxIcon"
5769
5761
  >
5770
5762
  <div
@@ -5889,7 +5881,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxSiz
5889
5881
  data-test-id="selectComponent"
5890
5882
  >
5891
5883
  <div
5892
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
5884
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
5893
5885
  data-selector-id="textBoxIcon"
5894
5886
  >
5895
5887
  <div
@@ -6014,7 +6006,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxSiz
6014
6006
  data-test-id="selectComponent"
6015
6007
  >
6016
6008
  <div
6017
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6009
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6018
6010
  data-selector-id="textBoxIcon"
6019
6011
  >
6020
6012
  <div
@@ -6139,7 +6131,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxSiz
6139
6131
  data-test-id="selectComponent"
6140
6132
  >
6141
6133
  <div
6142
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6134
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6143
6135
  data-selector-id="textBoxIcon"
6144
6136
  >
6145
6137
  <div
@@ -6264,7 +6256,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxSiz
6264
6256
  data-test-id="selectComponent"
6265
6257
  >
6266
6258
  <div
6267
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6259
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6268
6260
  data-selector-id="textBoxIcon"
6269
6261
  >
6270
6262
  <div
@@ -6389,7 +6381,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxVar
6389
6381
  data-test-id="selectComponent"
6390
6382
  >
6391
6383
  <div
6392
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6384
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6393
6385
  data-selector-id="textBoxIcon"
6394
6386
  >
6395
6387
  <div
@@ -6514,7 +6506,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxVar
6514
6506
  data-test-id="selectComponent"
6515
6507
  >
6516
6508
  <div
6517
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6509
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6518
6510
  data-selector-id="textBoxIcon"
6519
6511
  >
6520
6512
  <div
@@ -6639,7 +6631,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxVar
6639
6631
  data-test-id="selectComponent"
6640
6632
  >
6641
6633
  <div
6642
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6634
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6643
6635
  data-selector-id="textBoxIcon"
6644
6636
  >
6645
6637
  <div
@@ -6764,7 +6756,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with textBoxVar
6764
6756
  data-test-id="selectComponent"
6765
6757
  >
6766
6758
  <div
6767
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6759
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6768
6760
  data-selector-id="textBoxIcon"
6769
6761
  >
6770
6762
  <div
@@ -6890,7 +6882,7 @@ exports[`Select box needSelectDownIcon snapshot - Should render with title - ne
6890
6882
  data-test-id="selectComponent"
6891
6883
  >
6892
6884
  <div
6893
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6885
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
6894
6886
  data-selector-id="textBoxIcon"
6895
6887
  >
6896
6888
  <div
@@ -6982,7 +6974,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - dropbox open
6982
6974
  data-test-id="customDataId"
6983
6975
  >
6984
6976
  <div
6985
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
6977
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
6986
6978
  data-selector-id="textBoxIcon"
6987
6979
  >
6988
6980
  <div
@@ -7000,7 +6992,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - dropbox open
7000
6992
  aria-owns="1"
7001
6993
  aria-readonly="true"
7002
6994
  autocomplete="off"
7003
- class=" pointer container medium default effect focus borderColor_default inputDotted "
6995
+ class=" pointer container medium default effect borderColor_default inputDotted "
7004
6996
  data-id="customDataId_textBox"
7005
6997
  data-selector-id="textBoxIcon"
7006
6998
  data-test-id="customDataId_textBox"
@@ -7060,7 +7052,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - dropbox open
7060
7052
  </div>
7061
7053
  </div>
7062
7054
  <div
7063
- class="main container bottomMid default"
7055
+ class="main hidden container bottomMid default"
7064
7056
  data-a11y-focus-main-area="true"
7065
7057
  data-arrow-position="mid"
7066
7058
  data-box-direction="bottom"
@@ -7069,10 +7061,9 @@ exports[`Select dataId snapshot - Should render with dataId prop - dropbox open
7069
7061
  data-selector-id="dropBox"
7070
7062
  data-test-id="customDataId_suggestions"
7071
7063
  dot-ui-element="dropbox"
7072
- style="z-index: 4;"
7073
7064
  >
7074
7065
  <div
7075
- class="subContainer shadow radius bounce defaultPalette"
7066
+ class="subContainer shadow radius defaultPalette"
7076
7067
  data-id="customDataId_suggestions_subcontainer"
7077
7068
  data-selector-id="dropBox_subcontainer"
7078
7069
  data-test-id="customDataId_suggestions_subcontainer"
@@ -7106,7 +7097,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - dropbox open
7106
7097
  class="search medium"
7107
7098
  >
7108
7099
  <div
7109
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
7100
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
7110
7101
  data-selector-id="textBoxIcon"
7111
7102
  >
7112
7103
  <div
@@ -7326,7 +7317,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - empty state
7326
7317
  aria-owns="1"
7327
7318
  aria-readonly="true"
7328
7319
  autocomplete="off"
7329
- class=" pointer container medium default border effect focus borderColor_default inputDotted "
7320
+ class=" pointer container medium default border effect borderColor_default inputDotted "
7330
7321
  data-id="selectComponent_textBox"
7331
7322
  data-selector-id="textBox"
7332
7323
  data-test-id="selectComponent_textBox"
@@ -7338,7 +7329,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - empty state
7338
7329
  />
7339
7330
  </div>
7340
7331
  <div
7341
- class="main container bottomMid default"
7332
+ class="main hidden container bottomMid default"
7342
7333
  data-a11y-focus-main-area="true"
7343
7334
  data-arrow-position="mid"
7344
7335
  data-box-direction="bottom"
@@ -7347,10 +7338,9 @@ exports[`Select dataId snapshot - Should render with dataId prop - empty state
7347
7338
  data-selector-id="dropBox"
7348
7339
  data-test-id="selectComponent_suggestions"
7349
7340
  dot-ui-element="dropbox"
7350
- style="z-index: 4;"
7351
7341
  >
7352
7342
  <div
7353
- class="subContainer shadow radius bounce defaultPalette"
7343
+ class="subContainer shadow radius defaultPalette"
7354
7344
  data-id="selectComponent_suggestions_subcontainer"
7355
7345
  data-selector-id="dropBox_subcontainer"
7356
7346
  data-test-id="selectComponent_suggestions_subcontainer"
@@ -7409,7 +7399,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - isDisabled a
7409
7399
  data-test-id="customDataId_disabled"
7410
7400
  >
7411
7401
  <div
7412
- class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
7402
+ class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
7413
7403
  data-selector-id="textBoxIcon"
7414
7404
  data-title=""
7415
7405
  >
@@ -7502,7 +7492,7 @@ exports[`Select dataId snapshot - Should render with dataId prop - isReadOnly a
7502
7492
  data-test-id="customDataId_readOnly"
7503
7493
  >
7504
7494
  <div
7505
- class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
7495
+ class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
7506
7496
  data-selector-id="textBoxIcon"
7507
7497
  >
7508
7498
  <div
@@ -7599,7 +7589,7 @@ exports[`Select dataId snapshot - Should render with renderCustomSelectedValue
7599
7589
  aria-haspopup="listbox"
7600
7590
  aria-owns="1"
7601
7591
  aria-readonly="false"
7602
- class="varClass customContainer medium border_bottom effect borderColor_default hasBorder flex rowdir"
7592
+ class="varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder flex rowdir scrolly"
7603
7593
  data-selector-id="container"
7604
7594
  data-title=""
7605
7595
  role="button"
@@ -7626,7 +7616,7 @@ exports[`Select snapshot - Should render with children 1`] = `
7626
7616
  data-test-id="selectComponent"
7627
7617
  >
7628
7618
  <div
7629
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
7619
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
7630
7620
  data-selector-id="textBoxIcon"
7631
7621
  >
7632
7622
  <div
@@ -7727,7 +7717,7 @@ exports[`Select snapshot - Should render with children and dropdown open 1`] =
7727
7717
  data-test-id="selectComponent"
7728
7718
  >
7729
7719
  <div
7730
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
7720
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
7731
7721
  data-selector-id="textBoxIcon"
7732
7722
  >
7733
7723
  <div
@@ -7884,7 +7874,7 @@ exports[`Select snapshot - Should render with className prop 1`] = `
7884
7874
  data-test-id="selectComponent"
7885
7875
  >
7886
7876
  <div
7887
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
7877
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
7888
7878
  data-selector-id="textBoxIcon"
7889
7879
  >
7890
7880
  <div
@@ -7975,7 +7965,7 @@ exports[`Select snapshot - Should render with customProps 1`] = `
7975
7965
  data-test-id="selectComponent"
7976
7966
  >
7977
7967
  <div
7978
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
7968
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
7979
7969
  data-selector-id="textBoxIcon"
7980
7970
  >
7981
7971
  <div
@@ -8100,7 +8090,7 @@ exports[`Select snapshot - Should render with customProps 1`] = `
8100
8090
  class="search medium"
8101
8091
  >
8102
8092
  <div
8103
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8093
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8104
8094
  data-selector-id="textBoxIcon"
8105
8095
  >
8106
8096
  <div
@@ -8317,7 +8307,7 @@ exports[`Select snapshot - Should render with dataSelectorId prop 1`] = `
8317
8307
  data-test-id="selectComponent"
8318
8308
  >
8319
8309
  <div
8320
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
8310
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
8321
8311
  data-selector-id="textBoxIcon"
8322
8312
  >
8323
8313
  <div
@@ -8408,7 +8398,7 @@ exports[`Select snapshot - Should render with dropBoxSize as large 1`] = `
8408
8398
  data-test-id="selectComponent"
8409
8399
  >
8410
8400
  <div
8411
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
8401
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
8412
8402
  data-selector-id="textBoxIcon"
8413
8403
  >
8414
8404
  <div
@@ -8530,7 +8520,7 @@ exports[`Select snapshot - Should render with dropBoxSize as large 1`] = `
8530
8520
  class="search medium"
8531
8521
  >
8532
8522
  <div
8533
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8523
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8534
8524
  data-selector-id="textBoxIcon"
8535
8525
  >
8536
8526
  <div
@@ -8605,7 +8595,7 @@ exports[`Select snapshot - Should render with dropBoxSize as medium 1`] = `
8605
8595
  data-test-id="selectComponent"
8606
8596
  >
8607
8597
  <div
8608
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
8598
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
8609
8599
  data-selector-id="textBoxIcon"
8610
8600
  >
8611
8601
  <div
@@ -8727,7 +8717,7 @@ exports[`Select snapshot - Should render with dropBoxSize as medium 1`] = `
8727
8717
  class="search medium"
8728
8718
  >
8729
8719
  <div
8730
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8720
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8731
8721
  data-selector-id="textBoxIcon"
8732
8722
  >
8733
8723
  <div
@@ -8802,7 +8792,7 @@ exports[`Select snapshot - Should render with dropBoxSize as small 1`] = `
8802
8792
  data-test-id="selectComponent"
8803
8793
  >
8804
8794
  <div
8805
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
8795
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
8806
8796
  data-selector-id="textBoxIcon"
8807
8797
  >
8808
8798
  <div
@@ -8924,7 +8914,7 @@ exports[`Select snapshot - Should render with dropBoxSize as small 1`] = `
8924
8914
  class="search medium"
8925
8915
  >
8926
8916
  <div
8927
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8917
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container flex rowdir"
8928
8918
  data-selector-id="textBoxIcon"
8929
8919
  >
8930
8920
  <div
@@ -8999,7 +8989,7 @@ exports[`Select snapshot - Should render with getChildren 1`] = `
8999
8989
  data-test-id="selectComponent"
9000
8990
  >
9001
8991
  <div
9002
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
8992
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
9003
8993
  data-selector-id="textBoxIcon"
9004
8994
  >
9005
8995
  <div
@@ -9128,7 +9118,7 @@ exports[`Select snapshot - Should render with getFooter 1`] = `
9128
9118
  data-test-id="selectComponent"
9129
9119
  >
9130
9120
  <div
9131
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
9121
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
9132
9122
  data-selector-id="textBoxIcon"
9133
9123
  >
9134
9124
  <div
@@ -9285,7 +9275,7 @@ exports[`Select snapshot - Should render with iconOnHover as true 1`] = `
9285
9275
  data-test-id="selectComponent"
9286
9276
  >
9287
9277
  <div
9288
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9278
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9289
9279
  data-selector-id="textBoxIcon"
9290
9280
  >
9291
9281
  <div
@@ -9376,7 +9366,7 @@ exports[`Select snapshot - Should render with iconOnHover as true and isDisable
9376
9366
  data-test-id="selectComponent_disabled"
9377
9367
  >
9378
9368
  <div
9379
- class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
9369
+ class="varClass customContainer border_bottom disabled borderColor_default hasBorder container flex rowdir"
9380
9370
  data-selector-id="textBoxIcon"
9381
9371
  data-title=""
9382
9372
  >
@@ -9469,7 +9459,7 @@ exports[`Select snapshot - Should render with iconOnHover as true and isReadOnl
9469
9459
  data-test-id="selectComponent_readOnly"
9470
9460
  >
9471
9461
  <div
9472
- class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
9462
+ class="varClass customContainer border_bottom readonly borderColor_default hasBorder container flex rowdir"
9473
9463
  data-selector-id="textBoxIcon"
9474
9464
  >
9475
9465
  <div
@@ -9560,7 +9550,7 @@ exports[`Select snapshot - Should render with isLoading 1`] = `
9560
9550
  data-test-id="selectComponent"
9561
9551
  >
9562
9552
  <div
9563
- class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
9553
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder active container input flex rowdir"
9564
9554
  data-selector-id="textBoxIcon"
9565
9555
  >
9566
9556
  <div
@@ -9728,7 +9718,7 @@ exports[`Select snapshot - Should render with isParentBased as false 1`] = `
9728
9718
  data-test-id="selectComponent"
9729
9719
  >
9730
9720
  <div
9731
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9721
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9732
9722
  data-selector-id="textBoxIcon"
9733
9723
  >
9734
9724
  <div
@@ -9853,7 +9843,7 @@ exports[`Select snapshot - Should render with size as medium 1`] = `
9853
9843
  data-test-id="selectComponent"
9854
9844
  >
9855
9845
  <div
9856
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9846
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9857
9847
  data-selector-id="textBoxIcon"
9858
9848
  >
9859
9849
  <div
@@ -9944,7 +9934,7 @@ exports[`Select snapshot - Should render with size as small 1`] = `
9944
9934
  data-test-id="selectComponent"
9945
9935
  >
9946
9936
  <div
9947
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9937
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
9948
9938
  data-selector-id="textBoxIcon"
9949
9939
  >
9950
9940
  <div
@@ -10035,7 +10025,7 @@ exports[`Select snapshot - Should render with title prop 1`] = `
10035
10025
  data-test-id="selectComponent"
10036
10026
  >
10037
10027
  <div
10038
- class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
10028
+ class="varClass customContainer border_bottom effect borderColor_default hasBorder container input flex rowdir"
10039
10029
  data-selector-id="textBoxIcon"
10040
10030
  >
10041
10031
  <div