npm - @zohodesk/components - Versions diffs - 1.6.21 → 1.6.22 - Mend

@zohodesk/components 1.6.21 → 1.6.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (96) hide show

package/es/Select/__tests__/__snapshots__/Select.spec.js.snap CHANGED Viewed

@@ -12,7 +12,7 @@ exports[`Select - Should close the dropdown when clicking outside 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -76,7 +76,7 @@ exports[`Select - Should close the dropdown when clicking outside 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -105,7 +105,7 @@ exports[`Select - Should highlight the next list-items, when arrow keys pressed
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -169,7 +169,7 @@ exports[`Select - Should highlight the next list-items, when arrow keys pressed
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -286,7 +286,7 @@ exports[`Select - Should highlight the next list-items, when arrow keys pressed
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -458,7 +458,7 @@ exports[`Select - Should not open the dropdown when disabled 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -551,7 +551,7 @@ exports[`Select - Should not open the dropdown when readonly 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -580,7 +580,7 @@ exports[`Select - Should open the dropdown, when click on the input 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -642,7 +642,7 @@ exports[`Select - Should open the dropdown, when click on the input 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -728,7 +728,7 @@ exports[`Select - Should render all the options when search value is cleared 1`]
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -792,7 +792,7 @@ exports[`Select - Should render all the options when search value is cleared 1`]
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -959,7 +959,7 @@ exports[`Select - Should render all the options when search value is cleared 1`]
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -1065,7 +1065,7 @@ exports[`Select - Should render given the options 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -1129,7 +1129,7 @@ exports[`Select - Should render given the options 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -1247,7 +1247,7 @@ exports[`Select - Should render given the options 1`] = `
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -1353,7 +1353,7 @@ exports[`Select - Should render the Select component 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -1415,7 +1415,7 @@ exports[`Select - Should render the Select component 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -1444,7 +1444,7 @@ exports[`Select - Should render the default selected value 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -1508,7 +1508,7 @@ exports[`Select - Should render the default selected value 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -1537,7 +1537,7 @@ exports[`Select - Should render the given selected value 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -1601,7 +1601,7 @@ exports[`Select - Should render the given selected value 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -1630,7 +1630,7 @@ exports[`Select - Should render the only options matching search value 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -1694,7 +1694,7 @@ exports[`Select - Should render the only options matching search value 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -1876,7 +1876,7 @@ exports[`Select - Should render the only options matching search value even with
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -1940,7 +1940,7 @@ exports[`Select - Should render the only options matching search value even with
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -2051,7 +2051,7 @@ exports[`Select - Should render the only options matching search value even with
                           >
                             <i
                               aria-hidden="true"
-                              class="zd_font_icons basic icon-delete    rtl "
+                              class="zd_font_icons  rtl basic icon-delete   "
                               data-id="fontIcon"
                               data-selector-id="fontIcon"
                               data-test-id="fontIcon"
@@ -2147,7 +2147,7 @@ exports[`Select - Should render the placeholder when there is no default value 1
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -2211,7 +2211,7 @@ exports[`Select - Should render the placeholder when there is no default value 1
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -2240,7 +2240,7 @@ exports[`Select - Should show the custom empty state using getCustomEmptyState p
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -2304,7 +2304,7 @@ exports[`Select - Should show the custom empty state using getCustomEmptyState p
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -2435,7 +2435,7 @@ exports[`Select - Should show the empty message when open the dropdown with no o
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -2497,7 +2497,7 @@ exports[`Select - Should show the empty message when open the dropdown with no o
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -2585,7 +2585,7 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -2649,7 +2649,7 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -2766,7 +2766,7 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -3120,7 +3120,7 @@ exports[`Select - Should trigger getNextOptions, when scroll to the end of the d
                   >
                     <div
                       aria-hidden="true"
-                      class=" loaderWrapper container default svgCenter "
+                      class=" default svgCenter  loaderWrapper container"
                     >
                       <svg
                         data-id="loader"
@@ -3180,7 +3180,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -3244,7 +3244,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -3411,7 +3411,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -3506,7 +3506,7 @@ exports[`Select - Should trigger getNextOptions, when search with needLocalSearc
                   >
                     <div
                       aria-hidden="true"
-                      class=" loaderWrapper container default svgCenter "
+                      class=" default svgCenter  loaderWrapper container"
                     >
                       <svg
                         data-id="loader"
@@ -3566,7 +3566,7 @@ exports[`Select - Should trigger onAddNewOption, when click on the custom search
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -3630,7 +3630,7 @@ exports[`Select - Should trigger onAddNewOption, when click on the custom search
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -3761,7 +3761,7 @@ exports[`Select - Should update the value when select the option 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -3825,7 +3825,7 @@ exports[`Select - Should update the value when select the option 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -3943,7 +3943,7 @@ exports[`Select - Should update the value when select the option 1`] = `
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -4049,7 +4049,7 @@ exports[`Select - Should update the value when select the option 2`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -4113,7 +4113,7 @@ exports[`Select - Should update the value when select the option 2`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -4272,7 +4272,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with aria prope
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -4337,7 +4337,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with aria prope
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -4399,7 +4399,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with autoComple
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -4460,7 +4460,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with autoComple
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -4523,7 +4523,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with borderColo
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -4585,7 +4585,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with borderColo
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -4648,7 +4648,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with borderColo
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_transparent hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_transparent hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -4710,7 +4710,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with borderColo
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -4774,7 +4774,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with customProp
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -4837,7 +4837,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with customProp
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -4901,7 +4901,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with htmlId - n
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -4964,7 +4964,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with htmlId - n
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -5092,7 +5092,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with isDisabled
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -5212,7 +5212,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with isPopupOpe
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -5274,7 +5274,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with isPopupOpe
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -5456,7 +5456,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with isReadOnly
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -5520,7 +5520,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with maxLength
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -5582,7 +5582,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with maxLength
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -5645,7 +5645,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with needBorder
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer    effect     container input"
+        class="flex row varClass customContainer    effect     container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -5707,7 +5707,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with needBorder
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -5770,7 +5770,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with placeHolde
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -5832,7 +5832,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with placeHolde
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -5895,7 +5895,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -5957,7 +5957,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6020,7 +6020,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6082,7 +6082,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6145,7 +6145,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6207,7 +6207,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6270,7 +6270,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6332,7 +6332,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxSiz
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6395,7 +6395,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6457,7 +6457,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6520,7 +6520,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6582,7 +6582,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6645,7 +6645,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6707,7 +6707,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6770,7 +6770,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6832,7 +6832,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with textBoxVar
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6896,7 +6896,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with title - ne
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -6959,7 +6959,7 @@ exports[`Select box needSelectDownIcon snapshot -  Should render with title - ne
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -6988,7 +6988,7 @@ exports[`Select dataId snapshot -  Should render with dataId prop - dropbox open
       data-test-id="customDataId"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -7052,7 +7052,7 @@ exports[`Select dataId snapshot -  Should render with dataId prop - dropbox open
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -7219,7 +7219,7 @@ exports[`Select dataId snapshot -  Should render with dataId prop - dropbox open
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -7479,7 +7479,7 @@ exports[`Select dataId snapshot -  Should render with dataId prop - isDisabled a
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -7570,7 +7570,7 @@ exports[`Select dataId snapshot -  Should render with dataId prop - isReadOnly a
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -7632,7 +7632,7 @@ exports[`Select snapshot -  Should render with children 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -7694,7 +7694,7 @@ exports[`Select snapshot -  Should render with children 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -7733,7 +7733,7 @@ exports[`Select snapshot -  Should render with children and dropdown open 1`] =
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -7795,7 +7795,7 @@ exports[`Select snapshot -  Should render with children and dropdown open 1`] =
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -7891,7 +7891,7 @@ exports[`Select snapshot -  Should render with className prop 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -7953,7 +7953,7 @@ exports[`Select snapshot -  Should render with className prop 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -7982,7 +7982,7 @@ exports[`Select snapshot -  Should render with customProps 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -8047,7 +8047,7 @@ exports[`Select snapshot -  Should render with customProps 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -8217,7 +8217,7 @@ exports[`Select snapshot -  Should render with customProps 1`] = `
                       >
                         <i
                           aria-hidden="true"
-                          class="zd_font_icons basic icon-ticknew    "
+                          class="zd_font_icons  basic icon-ticknew   "
                           data-id="fontIcon"
                           data-selector-id="fontIcon"
                           data-test-id="fontIcon"
@@ -8325,7 +8325,7 @@ exports[`Select snapshot -  Should render with dataSelectorId prop 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -8387,7 +8387,7 @@ exports[`Select snapshot -  Should render with dataSelectorId prop 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -8416,7 +8416,7 @@ exports[`Select snapshot -  Should render with dropBoxSize as large 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -8478,7 +8478,7 @@ exports[`Select snapshot -  Should render with dropBoxSize as large 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -8614,7 +8614,7 @@ exports[`Select snapshot -  Should render with dropBoxSize as medium 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -8676,7 +8676,7 @@ exports[`Select snapshot -  Should render with dropBoxSize as medium 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -8812,7 +8812,7 @@ exports[`Select snapshot -  Should render with dropBoxSize as small 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -8874,7 +8874,7 @@ exports[`Select snapshot -  Should render with dropBoxSize as small 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9010,7 +9010,7 @@ exports[`Select snapshot -  Should render with getChildren 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -9072,7 +9072,7 @@ exports[`Select snapshot -  Should render with getChildren 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9139,7 +9139,7 @@ exports[`Select snapshot -  Should render with getFooter 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -9201,7 +9201,7 @@ exports[`Select snapshot -  Should render with getFooter 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9297,7 +9297,7 @@ exports[`Select snapshot -  Should render with iconOnHover as true 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -9359,7 +9359,7 @@ exports[`Select snapshot -  Should render with iconOnHover as true 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9452,7 +9452,7 @@ exports[`Select snapshot -  Should render with iconOnHover as true and isDisable
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9543,7 +9543,7 @@ exports[`Select snapshot -  Should render with iconOnHover as true and isReadOnl
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9572,7 +9572,7 @@ exports[`Select snapshot -  Should render with isLoading 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder active   container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -9634,7 +9634,7 @@ exports[`Select snapshot -  Should render with isLoading 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9683,7 +9683,7 @@ exports[`Select snapshot -  Should render with isLoading 1`] = `
             >
               <div
                 aria-hidden="true"
-                class=" loaderWrapper container default svgCenter "
+                class=" default svgCenter  loaderWrapper container"
               >
                 <svg
                   data-id="loader"
@@ -9740,7 +9740,7 @@ exports[`Select snapshot -  Should render with isParentBased as false 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -9802,7 +9802,7 @@ exports[`Select snapshot -  Should render with isParentBased as false 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9865,7 +9865,7 @@ exports[`Select snapshot -  Should render with size as medium 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -9927,7 +9927,7 @@ exports[`Select snapshot -  Should render with size as medium 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -9956,7 +9956,7 @@ exports[`Select snapshot -  Should render with size as small 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -10018,7 +10018,7 @@ exports[`Select snapshot -  Should render with size as small 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"
@@ -10047,7 +10047,7 @@ exports[`Select snapshot -  Should render with title prop 1`] = `
       data-test-id="selectComponent"
     >
       <div
-        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container input"
+        class="flex row varClass customContainer   border_bottom effect borderColor_default hasBorder    container  input"
         data-selector-id="textBoxIcon"
       >
         <div
@@ -10110,7 +10110,7 @@ exports[`Select snapshot -  Should render with title prop 1`] = `
                 >
                   <i
                     aria-hidden="true"
-                    class="zd_font_icons basic icon-down    "
+                    class="zd_font_icons  basic icon-down   "
                     data-id="fontIcon"
                     data-selector-id="fontIcon"
                     data-test-id="fontIcon"