diff --git a/src/Explorer/Controls/ThroughputInput/__snapshots__/ThroughputInput.test.tsx.snap b/src/Explorer/Controls/ThroughputInput/__snapshots__/ThroughputInput.test.tsx.snap
index d3a8ecf23..8ff4504d9 100644
--- a/src/Explorer/Controls/ThroughputInput/__snapshots__/ThroughputInput.test.tsx.snap
+++ b/src/Explorer/Controls/ThroughputInput/__snapshots__/ThroughputInput.test.tsx.snap
@@ -17,7 +17,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
       horizontal={true}
     >
       <div
-        className="ms-Stack css-53"
+        className="ms-Stack css-109"
       >
         <span
           className="mandatoryStar"
@@ -38,7 +38,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
         >
           <span
             aria-label="Throughput header"
-            className="css-54"
+            className="css-110"
             style={
               Object {
                 "fontWeight": 600,
@@ -335,7 +335,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
                 }
               >
                 <div
-                  className="ms-TooltipHost root-55"
+                  className="ms-TooltipHost root-111"
                   onBlurCapture={[Function]}
                   onFocusCapture={[Function]}
                   onKeyDown={[Function]}
@@ -630,7 +630,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
                     >
                       <i
                         aria-label="Info"
-                        className="panelInfoIcon root-57"
+                        className="panelInfoIcon root-114"
                         data-icon-name="Info"
                         role="img"
                         tabIndex={0}
@@ -651,7 +651,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
       verticalAlign="center"
     >
       <div
-        className="ms-Stack css-58"
+        className="ms-Stack css-115"
       >
         <input
           aria-label="Autoscale mode"
@@ -693,7 +693,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
       className="throughputInputSpacing"
     >
       <div
-        className="ms-Stack throughputInputSpacing css-59"
+        className="ms-Stack throughputInputSpacing css-116"
       >
         <Text
           aria-label="ruDescription"
@@ -702,7 +702,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
         >
           <span
             aria-label="ruDescription"
-            className="css-54"
+            className="css-110"
           >
             Estimate your required RU/s with
              
@@ -992,7 +992,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
               >
                 <a
                   aria-label="ruDescription"
-                  className="ms-Link root-60"
+                  className="ms-Link root-117"
                   href="https://cosmos.azure.com/capacitycalculator/"
                   onClick={[Function]}
                   target="_blank"
@@ -1009,7 +1009,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
           key=".0:$.1"
         >
           <div
-            className="ms-Stack css-53"
+            className="ms-Stack css-109"
           >
             <Text
               aria-label="maxRUDescription"
@@ -1024,7 +1024,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
             >
               <span
                 aria-label="maxRUDescription"
-                className="css-54"
+                className="css-110"
                 style={
                   Object {
                     "fontWeight": 600,
@@ -1322,7 +1322,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
                     }
                   >
                     <div
-                      className="ms-TooltipHost root-55"
+                      className="ms-TooltipHost root-111"
                       onBlurCapture={[Function]}
                       onFocusCapture={[Function]}
                       onKeyDown={[Function]}
@@ -1617,7 +1617,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
                         >
                           <i
                             aria-label="Info"
-                            className="panelInfoIcon root-57"
+                            className="panelInfoIcon root-114"
                             data-icon-name="Info"
                             role="img"
                             tabIndex={0}
@@ -1943,17 +1943,17 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
             value="4000"
           >
             <div
-              className="ms-TextField is-required root-62"
+              className="ms-TextField is-required root-119"
             >
               <div
                 className="ms-TextField-wrapper"
               >
                 <div
-                  className="ms-TextField-fieldGroup fieldGroup-63"
+                  className="ms-TextField-fieldGroup fieldGroup-120"
                 >
                   <input
                     aria-invalid={false}
-                    className="ms-TextField-field field-64"
+                    className="ms-TextField-field field-121"
                     id="TextField2"
                     min={4000}
                     onBlur={[Function]}
@@ -1975,7 +1975,7 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
           variant="small"
         >
           <span
-            className="css-54"
+            className="css-110"
           >
             Your 
             container
diff --git a/src/Explorer/Panes/DeleteCollectionConfirmationPane/__snapshots__/DeleteCollectionConfirmationPane.test.tsx.snap b/src/Explorer/Panes/DeleteCollectionConfirmationPane/__snapshots__/DeleteCollectionConfirmationPane.test.tsx.snap
index b31dc19d3..67f67c81c 100644
--- a/src/Explorer/Panes/DeleteCollectionConfirmationPane/__snapshots__/DeleteCollectionConfirmationPane.test.tsx.snap
+++ b/src/Explorer/Panes/DeleteCollectionConfirmationPane/__snapshots__/DeleteCollectionConfirmationPane.test.tsx.snap
@@ -32,7 +32,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
               variant="small"
             >
               <span
-                className="css-53"
+                className="css-109"
               >
                 Confirm by typing the 
                 container
@@ -338,19 +338,19 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
                 value=""
               >
                 <div
-                  className="ms-TextField root-55"
+                  className="ms-TextField root-111"
                 >
                   <div
                     className="ms-TextField-wrapper"
                   >
                     <div
-                      className="ms-TextField-fieldGroup fieldGroup-56"
+                      className="ms-TextField-fieldGroup fieldGroup-112"
                     >
                       <input
                         aria-invalid={false}
                         aria-label="Confirm by typing the container id"
                         autoFocus={true}
-                        className="ms-TextField-field field-57"
+                        className="ms-TextField-field field-113"
                         id="confirmCollectionId"
                         onBlur={[Function]}
                         onChange={[Function]}
@@ -1470,6 +1470,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
                           "overflow": "hidden",
                           "padding": 0,
                           "position": "absolute",
+                          "whiteSpace": "nowrap",
                           "width": 1,
                         },
                         "splitButtonContainer": Array [
@@ -2083,7 +2084,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
                   >
                     <button
                       aria-label="OK"
-                      className="ms-Button ms-Button--primary root-66"
+                      className="ms-Button ms-Button--primary root-122"
                       data-is-focusable={true}
                       id="sidePanelOkButton"
                       onClick={[Function]}
@@ -2095,14 +2096,14 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
                       type="submit"
                     >
                       <span
-                        className="ms-Button-flexContainer flexContainer-67"
+                        className="ms-Button-flexContainer flexContainer-123"
                         data-automationid="splitbuttonprimary"
                       >
                         <span
-                          className="ms-Button-textContainer textContainer-68"
+                          className="ms-Button-textContainer textContainer-124"
                         >
                           <span
-                            className="ms-Button-label label-70"
+                            className="ms-Button-label label-126"
                             id="id__3"
                             key="id__3"
                           >
diff --git a/src/Explorer/Panes/ExecuteSprocParamsPane/__snapshots__/ExecuteSprocParamsPane.test.tsx.snap b/src/Explorer/Panes/ExecuteSprocParamsPane/__snapshots__/ExecuteSprocParamsPane.test.tsx.snap
index e5bc2cbef..1c0593d38 100644
--- a/src/Explorer/Panes/ExecuteSprocParamsPane/__snapshots__/ExecuteSprocParamsPane.test.tsx.snap
+++ b/src/Explorer/Panes/ExecuteSprocParamsPane/__snapshots__/ExecuteSprocParamsPane.test.tsx.snap
@@ -306,7 +306,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
               }
             >
               <label
-                className="ms-Label root-53"
+                className="ms-Label root-109"
               >
                 Partition key value
               </label>
@@ -316,7 +316,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
             horizontal={true}
           >
             <div
-              className="ms-Stack css-54"
+              className="ms-Stack css-110"
             >
               <Dropdown
                 defaultSelectedKey="string"
@@ -1225,7 +1225,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                           }
                         >
                           <label
-                            className="ms-Label ms-Dropdown-label root-71"
+                            className="ms-Label ms-Dropdown-label root-127"
                             id="Dropdown0-label"
                           >
                             Key
@@ -1236,7 +1236,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                         aria-expanded="false"
                         aria-haspopup="listbox"
                         aria-labelledby="Dropdown0-label Dropdown0-option"
-                        className="ms-Dropdown dropdown-55"
+                        className="ms-Dropdown dropdown-111"
                         data-is-focusable={true}
                         data-ktp-target={true}
                         id="Dropdown0"
@@ -1254,22 +1254,22 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                           aria-atomic={true}
                           aria-invalid={false}
                           aria-live="polite"
-                          className="ms-Dropdown-title title-97"
+                          className="ms-Dropdown-title title-154"
                           id="Dropdown0-option"
                         >
                           String
                         </span>
                         <span
-                          className="ms-Dropdown-caretDownWrapper caretDownWrapper-57"
+                          className="ms-Dropdown-caretDownWrapper caretDownWrapper-113"
                         >
                           <StyledIconBase
                             aria-hidden={true}
-                            className="ms-Dropdown-caretDown caretDown-58"
+                            className="ms-Dropdown-caretDown caretDown-114"
                             iconName="ChevronDown"
                           >
                             <IconBase
                               aria-hidden={true}
-                              className="ms-Dropdown-caretDown caretDown-58"
+                              className="ms-Dropdown-caretDown caretDown-114"
                               iconName="ChevronDown"
                               styles={[Function]}
                               theme={
@@ -1548,7 +1548,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                             >
                               <i
                                 aria-hidden={true}
-                                className="ms-Dropdown-caretDown caretDown-73"
+                                className="ms-Dropdown-caretDown caretDown-130"
                                 data-icon-name="ChevronDown"
                               >
                                 
@@ -1852,7 +1852,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                   validateOnLoad={true}
                 >
                   <div
-                    className="ms-TextField root-75"
+                    className="ms-TextField root-132"
                   >
                     <div
                       className="ms-TextField-wrapper"
@@ -2141,7 +2141,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                           }
                         >
                           <label
-                            className="ms-Label root-53"
+                            className="ms-Label root-109"
                             htmlFor="confirmCollectionId"
                             id="TextFieldLabel3"
                           >
@@ -2150,12 +2150,12 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                         </LabelBase>
                       </StyledLabelBase>
                       <div
-                        className="ms-TextField-fieldGroup fieldGroup-76"
+                        className="ms-TextField-fieldGroup fieldGroup-133"
                       >
                         <input
                           aria-invalid={false}
                           aria-labelledby="TextFieldLabel3"
-                          className="ms-TextField-field field-77"
+                          className="ms-TextField-field field-134"
                           id="confirmCollectionId"
                           onBlur={[Function]}
                           onChange={[Function]}
@@ -2464,7 +2464,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
               }
             >
               <label
-                className="ms-Label root-53"
+                className="ms-Label root-109"
               >
                 Enter input parameters (if any)
               </label>
@@ -2474,7 +2474,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
             horizontal={true}
           >
             <div
-              className="ms-Stack css-54"
+              className="ms-Stack css-110"
             >
               <Dropdown
                 defaultSelectedKey="string"
@@ -3383,7 +3383,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                           }
                         >
                           <label
-                            className="ms-Label ms-Dropdown-label root-71"
+                            className="ms-Label ms-Dropdown-label root-127"
                             id="Dropdown4-label"
                           >
                             Key
@@ -3394,7 +3394,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                         aria-expanded="false"
                         aria-haspopup="listbox"
                         aria-labelledby="Dropdown4-label Dropdown4-option"
-                        className="ms-Dropdown dropdown-55"
+                        className="ms-Dropdown dropdown-111"
                         data-is-focusable={true}
                         data-ktp-target={true}
                         id="Dropdown4"
@@ -3412,22 +3412,22 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                           aria-atomic={true}
                           aria-invalid={false}
                           aria-live="polite"
-                          className="ms-Dropdown-title title-97"
+                          className="ms-Dropdown-title title-154"
                           id="Dropdown4-option"
                         >
                           String
                         </span>
                         <span
-                          className="ms-Dropdown-caretDownWrapper caretDownWrapper-57"
+                          className="ms-Dropdown-caretDownWrapper caretDownWrapper-113"
                         >
                           <StyledIconBase
                             aria-hidden={true}
-                            className="ms-Dropdown-caretDown caretDown-58"
+                            className="ms-Dropdown-caretDown caretDown-114"
                             iconName="ChevronDown"
                           >
                             <IconBase
                               aria-hidden={true}
-                              className="ms-Dropdown-caretDown caretDown-58"
+                              className="ms-Dropdown-caretDown caretDown-114"
                               iconName="ChevronDown"
                               styles={[Function]}
                               theme={
@@ -3706,7 +3706,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                             >
                               <i
                                 aria-hidden={true}
-                                className="ms-Dropdown-caretDown caretDown-73"
+                                className="ms-Dropdown-caretDown caretDown-130"
                                 data-icon-name="ChevronDown"
                               >
                                 
@@ -4012,7 +4012,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                   validateOnLoad={true}
                 >
                   <div
-                    className="ms-TextField root-75"
+                    className="ms-TextField root-132"
                   >
                     <div
                       className="ms-TextField-wrapper"
@@ -4301,7 +4301,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                           }
                         >
                           <label
-                            className="ms-Label root-53"
+                            className="ms-Label root-109"
                             htmlFor="confirmCollectionId"
                             id="TextFieldLabel7"
                           >
@@ -4310,12 +4310,12 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                         </LabelBase>
                       </StyledLabelBase>
                       <div
-                        className="ms-TextField-fieldGroup fieldGroup-76"
+                        className="ms-TextField-fieldGroup fieldGroup-133"
                       >
                         <input
                           aria-invalid={false}
                           aria-labelledby="TextFieldLabel7"
-                          className="ms-TextField-field field-77"
+                          className="ms-TextField-field field-134"
                           id="confirmCollectionId"
                           onBlur={[Function]}
                           onChange={[Function]}
@@ -4628,7 +4628,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                     width={20}
                   >
                     <div
-                      className="ms-Image addRemoveIconLabel root-86"
+                      className="ms-Image addRemoveIconLabel root-143"
                       style={
                         Object {
                           "height": 30,
@@ -4638,7 +4638,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                     >
                       <img
                         alt="Delete param"
-                        className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-87"
+                        className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-144"
                         id="deleteparam"
                         key="fabricImage"
                         onClick={[Function]}
@@ -4949,7 +4949,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                     width={20}
                   >
                     <div
-                      className="ms-Image addRemoveIconLabel root-86"
+                      className="ms-Image addRemoveIconLabel root-143"
                       style={
                         Object {
                           "height": 30,
@@ -4959,7 +4959,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                     >
                       <img
                         alt="Add param"
-                        className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-87"
+                        className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-144"
                         id="addparam"
                         key="fabricImage"
                         onClick={[Function]}
@@ -4981,7 +4981,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
           tabIndex={0}
         >
           <div
-            className="ms-Stack css-54"
+            className="ms-Stack css-110"
             onClick={[Function]}
             tabIndex={0}
           >
@@ -5273,7 +5273,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                 width={20}
               >
                 <div
-                  className="ms-Image root-86"
+                  className="ms-Image root-143"
                   style={
                     Object {
                       "height": 30,
@@ -5283,7 +5283,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                 >
                   <img
                     alt="Add param"
-                    className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-87"
+                    className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-144"
                     key="fabricImage"
                     onError={[Function]}
                     onLoad={[Function]}
@@ -5297,7 +5297,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
               key=".0:$.1"
             >
               <span
-                className="addNewParamStyle css-88"
+                className="addNewParamStyle css-145"
               >
                 Add New Param
               </span>
@@ -6408,6 +6408,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                           "overflow": "hidden",
                           "padding": 0,
                           "position": "absolute",
+                          "whiteSpace": "nowrap",
                           "width": 1,
                         },
                         "splitButtonContainer": Array [
@@ -7021,7 +7022,7 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                   >
                     <button
                       aria-label="Execute"
-                      className="ms-Button ms-Button--primary root-89"
+                      className="ms-Button ms-Button--primary root-146"
                       data-is-focusable={true}
                       id="sidePanelOkButton"
                       onClick={[Function]}
@@ -7033,14 +7034,14 @@ exports[`Excute Sproc Param Pane should render Default properly 1`] = `
                       type="submit"
                     >
                       <span
-                        className="ms-Button-flexContainer flexContainer-90"
+                        className="ms-Button-flexContainer flexContainer-147"
                         data-automationid="splitbuttonprimary"
                       >
                         <span
-                          className="ms-Button-textContainer textContainer-91"
+                          className="ms-Button-textContainer textContainer-148"
                         >
                           <span
-                            className="ms-Button-label label-93"
+                            className="ms-Button-label label-150"
                             id="id__8"
                             key="id__8"
                           >
diff --git a/src/Explorer/Panes/RightPaneForm/__snapshots__/RightPaneForm.test.tsx.snap b/src/Explorer/Panes/RightPaneForm/__snapshots__/RightPaneForm.test.tsx.snap
index bafc521fc..87140e0f6 100644
--- a/src/Explorer/Panes/RightPaneForm/__snapshots__/RightPaneForm.test.tsx.snap
+++ b/src/Explorer/Panes/RightPaneForm/__snapshots__/RightPaneForm.test.tsx.snap
@@ -1115,6 +1115,7 @@ exports[`Right Pane Form should render Default properly 1`] = `
                         "overflow": "hidden",
                         "padding": 0,
                         "position": "absolute",
+                        "whiteSpace": "nowrap",
                         "width": 1,
                       },
                       "splitButtonContainer": Array [
@@ -1728,7 +1729,7 @@ exports[`Right Pane Form should render Default properly 1`] = `
                 >
                   <button
                     aria-label="Load"
-                    className="ms-Button ms-Button--primary root-53"
+                    className="ms-Button ms-Button--primary root-109"
                     data-is-focusable={true}
                     id="sidePanelOkButton"
                     onClick={[Function]}
@@ -1740,14 +1741,14 @@ exports[`Right Pane Form should render Default properly 1`] = `
                     type="submit"
                   >
                     <span
-                      className="ms-Button-flexContainer flexContainer-54"
+                      className="ms-Button-flexContainer flexContainer-110"
                       data-automationid="splitbuttonprimary"
                     >
                       <span
-                        className="ms-Button-textContainer textContainer-55"
+                        className="ms-Button-textContainer textContainer-111"
                       >
                         <span
-                          className="ms-Button-label label-57"
+                          className="ms-Button-label label-113"
                           id="id__0"
                           key="id__0"
                         >
diff --git a/src/Explorer/Panes/SetupNotebooksPanel/__snapshots__/SetupNotebooksPanel.test.tsx.snap b/src/Explorer/Panes/SetupNotebooksPanel/__snapshots__/SetupNotebooksPanel.test.tsx.snap
index 25914ed75..d07ac234d 100644
--- a/src/Explorer/Panes/SetupNotebooksPanel/__snapshots__/SetupNotebooksPanel.test.tsx.snap
+++ b/src/Explorer/Panes/SetupNotebooksPanel/__snapshots__/SetupNotebooksPanel.test.tsx.snap
@@ -1120,6 +1120,7 @@ exports[`Setup Notebooks Panel should render Default properly 1`] = `
                         "overflow": "hidden",
                         "padding": 0,
                         "position": "absolute",
+                        "whiteSpace": "nowrap",
                         "width": 1,
                       },
                       "splitButtonContainer": Array [
@@ -1732,7 +1733,7 @@ exports[`Setup Notebooks Panel should render Default properly 1`] = `
                 >
                   <button
                     aria-label="Complete setup"
-                    className="ms-Button ms-Button--primary btncreatecoll1 btnSetupQueries root-53"
+                    className="ms-Button ms-Button--primary btncreatecoll1 btnSetupQueries root-109"
                     data-is-focusable={true}
                     id="completeSetupBtn"
                     onClick={[Function]}
@@ -1744,14 +1745,14 @@ exports[`Setup Notebooks Panel should render Default properly 1`] = `
                     type="button"
                   >
                     <span
-                      className="ms-Button-flexContainer flexContainer-54"
+                      className="ms-Button-flexContainer flexContainer-110"
                       data-automationid="splitbuttonprimary"
                     >
                       <span
-                        className="ms-Button-textContainer textContainer-55"
+                        className="ms-Button-textContainer textContainer-111"
                       >
                         <span
-                          className="ms-Button-label label-57"
+                          className="ms-Button-label label-113"
                           id="id__0"
                           key="id__0"
                         >
diff --git a/src/Explorer/Panes/StringInputPane/__snapshots__/StringInputPane.test.tsx.snap b/src/Explorer/Panes/StringInputPane/__snapshots__/StringInputPane.test.tsx.snap
index e77d8c74d..3133fe336 100644
--- a/src/Explorer/Panes/StringInputPane/__snapshots__/StringInputPane.test.tsx.snap
+++ b/src/Explorer/Panes/StringInputPane/__snapshots__/StringInputPane.test.tsx.snap
@@ -356,7 +356,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
             value=""
           >
             <div
-              className="ms-TextField is-required root-54"
+              className="ms-TextField is-required root-110"
             >
               <div
                 className="ms-TextField-wrapper"
@@ -647,7 +647,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
                     }
                   >
                     <label
-                      className="ms-Label root-65"
+                      className="ms-Label root-121"
                       htmlFor="TextField0"
                       id="TextFieldLabel2"
                     >
@@ -656,13 +656,13 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
                   </LabelBase>
                 </StyledLabelBase>
                 <div
-                  className="ms-TextField-fieldGroup fieldGroup-55"
+                  className="ms-TextField-fieldGroup fieldGroup-111"
                 >
                   <input
                     aria-invalid={false}
                     aria-labelledby="TextFieldLabel2"
                     autoFocus={true}
-                    className="ms-TextField-field field-56"
+                    className="ms-TextField-field field-112"
                     id="TextField0"
                     name="collectionIdConfirmation"
                     onBlur={[Function]}
@@ -1782,6 +1782,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
                           "overflow": "hidden",
                           "padding": 0,
                           "position": "absolute",
+                          "whiteSpace": "nowrap",
                           "width": 1,
                         },
                         "splitButtonContainer": Array [
@@ -2395,7 +2396,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
                   >
                     <button
                       aria-label="Create"
-                      className="ms-Button ms-Button--primary root-66"
+                      className="ms-Button ms-Button--primary root-122"
                       data-is-focusable={true}
                       id="sidePanelOkButton"
                       onClick={[Function]}
@@ -2407,14 +2408,14 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
                       type="submit"
                     >
                       <span
-                        className="ms-Button-flexContainer flexContainer-67"
+                        className="ms-Button-flexContainer flexContainer-123"
                         data-automationid="splitbuttonprimary"
                       >
                         <span
-                          className="ms-Button-textContainer textContainer-68"
+                          className="ms-Button-textContainer textContainer-124"
                         >
                           <span
-                            className="ms-Button-label label-70"
+                            className="ms-Button-label label-126"
                             id="id__3"
                             key="id__3"
                           >
diff --git a/src/Explorer/Panes/Tables/TableQuerySelectPanel/__snapshots__/TableQuerySelectPanel.test.tsx.snap b/src/Explorer/Panes/Tables/TableQuerySelectPanel/__snapshots__/TableQuerySelectPanel.test.tsx.snap
index ad7c2346c..b831488d3 100644
--- a/src/Explorer/Panes/Tables/TableQuerySelectPanel/__snapshots__/TableQuerySelectPanel.test.tsx.snap
+++ b/src/Explorer/Panes/Tables/TableQuerySelectPanel/__snapshots__/TableQuerySelectPanel.test.tsx.snap
@@ -28,7 +28,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
         >
           <Text>
             <span
-              className="css-53"
+              className="css-109"
             >
               Select the columns that you want to query.
             </span>
@@ -325,33 +325,33 @@ exports[`Table query select Panel should render Default properly 1`] = `
                 }
               >
                 <div
-                  className="ms-Checkbox is-checked is-enabled root-54"
+                  className="ms-Checkbox is-checked is-enabled root-110"
                 >
                   <input
                     aria-checked="true"
                     aria-label="Available Columns"
                     aria-posinset={0}
                     checked={true}
-                    className="input-55"
+                    className="input-111"
                     data-ktp-execute-target={true}
                     id="availableCheckbox"
                     onChange={[Function]}
                     type="checkbox"
                   />
                   <label
-                    className="ms-Checkbox-label label-56"
+                    className="ms-Checkbox-label label-112"
                     htmlFor="availableCheckbox"
                   >
                     <div
-                      className="ms-Checkbox-checkbox checkbox-57"
+                      className="ms-Checkbox-checkbox checkbox-113"
                       data-ktp-target={true}
                     >
                       <StyledIconBase
-                        className="ms-Checkbox-checkmark checkmark-58"
+                        className="ms-Checkbox-checkmark checkmark-114"
                         iconName="CheckMark"
                       >
                         <IconBase
-                          className="ms-Checkbox-checkmark checkmark-58"
+                          className="ms-Checkbox-checkmark checkmark-114"
                           iconName="CheckMark"
                           styles={[Function]}
                           theme={
@@ -630,7 +630,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
                         >
                           <i
                             aria-hidden={true}
-                            className="ms-Checkbox-checkmark checkmark-61"
+                            className="ms-Checkbox-checkmark checkmark-118"
                             data-icon-name="CheckMark"
                           >
                             
@@ -640,7 +640,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
                     </div>
                     <span
                       aria-hidden="true"
-                      className="ms-Checkbox-text text-59"
+                      className="ms-Checkbox-text text-115"
                     >
                       Available Columns
                     </span>
@@ -938,7 +938,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
                 }
               >
                 <div
-                  className="ms-Checkbox is-checked is-enabled root-54"
+                  className="ms-Checkbox is-checked is-enabled root-110"
                 >
                   <input
                     aria-checked="true"
@@ -946,7 +946,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
                     aria-label=""
                     aria-posinset={1}
                     checked={true}
-                    className="input-55"
+                    className="input-111"
                     data-ktp-execute-target={true}
                     disabled={false}
                     id="checkbox-0"
@@ -954,19 +954,19 @@ exports[`Table query select Panel should render Default properly 1`] = `
                     type="checkbox"
                   />
                   <label
-                    className="ms-Checkbox-label label-56"
+                    className="ms-Checkbox-label label-112"
                     htmlFor="checkbox-0"
                   >
                     <div
-                      className="ms-Checkbox-checkbox checkbox-57"
+                      className="ms-Checkbox-checkbox checkbox-113"
                       data-ktp-target={true}
                     >
                       <StyledIconBase
-                        className="ms-Checkbox-checkmark checkmark-58"
+                        className="ms-Checkbox-checkmark checkmark-114"
                         iconName="CheckMark"
                       >
                         <IconBase
-                          className="ms-Checkbox-checkmark checkmark-58"
+                          className="ms-Checkbox-checkmark checkmark-114"
                           iconName="CheckMark"
                           styles={[Function]}
                           theme={
@@ -1245,7 +1245,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
                         >
                           <i
                             aria-hidden={true}
-                            className="ms-Checkbox-checkmark checkmark-61"
+                            className="ms-Checkbox-checkmark checkmark-118"
                             data-icon-name="CheckMark"
                           >
                             
@@ -2363,6 +2363,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
                           "overflow": "hidden",
                           "padding": 0,
                           "position": "absolute",
+                          "whiteSpace": "nowrap",
                           "width": 1,
                         },
                         "splitButtonContainer": Array [
@@ -2976,7 +2977,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
                   >
                     <button
                       aria-label="OK"
-                      className="ms-Button ms-Button--primary root-68"
+                      className="ms-Button ms-Button--primary root-125"
                       data-is-focusable={true}
                       id="sidePanelOkButton"
                       onClick={[Function]}
@@ -2988,14 +2989,14 @@ exports[`Table query select Panel should render Default properly 1`] = `
                       type="submit"
                     >
                       <span
-                        className="ms-Button-flexContainer flexContainer-69"
+                        className="ms-Button-flexContainer flexContainer-126"
                         data-automationid="splitbuttonprimary"
                       >
                         <span
-                          className="ms-Button-textContainer textContainer-70"
+                          className="ms-Button-textContainer textContainer-127"
                         >
                           <span
-                            className="ms-Button-label label-72"
+                            className="ms-Button-label label-129"
                             id="id__1"
                             key="id__1"
                           >
diff --git a/src/Explorer/Panes/Tables/__snapshots__/AddTableEntityPanel.test.tsx.snap b/src/Explorer/Panes/Tables/__snapshots__/AddTableEntityPanel.test.tsx.snap
index 2714a4cd6..28d277239 100644
--- a/src/Explorer/Panes/Tables/__snapshots__/AddTableEntityPanel.test.tsx.snap
+++ b/src/Explorer/Panes/Tables/__snapshots__/AddTableEntityPanel.test.tsx.snap
@@ -31,7 +31,7 @@ exports[`Excute Add Table Entity Pane should render Default properly 1`] = `
           onClick={[Function]}
         >
           <div
-            className="ms-Stack addButtonEntiy css-53"
+            className="ms-Stack addButtonEntiy css-109"
             onClick={[Function]}
           >
             <StyledImageBase
@@ -322,7 +322,7 @@ exports[`Excute Add Table Entity Pane should render Default properly 1`] = `
                 width={16}
               >
                 <div
-                  className="ms-Image root-54"
+                  className="ms-Image root-110"
                   style={
                     Object {
                       "height": 30,
@@ -332,7 +332,7 @@ exports[`Excute Add Table Entity Pane should render Default properly 1`] = `
                 >
                   <img
                     alt="Add Entity"
-                    className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-55"
+                    className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-111"
                     key="fabricImage"
                     onError={[Function]}
                     onLoad={[Function]}
@@ -346,7 +346,7 @@ exports[`Excute Add Table Entity Pane should render Default properly 1`] = `
               key=".0:$.1"
             >
               <span
-                className="addNewParamStyle css-56"
+                className="addNewParamStyle css-112"
               >
                 Add Property
               </span>
@@ -1457,6 +1457,7 @@ exports[`Excute Add Table Entity Pane should render Default properly 1`] = `
                           "overflow": "hidden",
                           "padding": 0,
                           "position": "absolute",
+                          "whiteSpace": "nowrap",
                           "width": 1,
                         },
                         "splitButtonContainer": Array [
@@ -2070,7 +2071,7 @@ exports[`Excute Add Table Entity Pane should render Default properly 1`] = `
                   >
                     <button
                       aria-label="Add Entity"
-                      className="ms-Button ms-Button--primary root-57"
+                      className="ms-Button ms-Button--primary root-113"
                       data-is-focusable={true}
                       id="sidePanelOkButton"
                       onClick={[Function]}
@@ -2082,14 +2083,14 @@ exports[`Excute Add Table Entity Pane should render Default properly 1`] = `
                       type="submit"
                     >
                       <span
-                        className="ms-Button-flexContainer flexContainer-58"
+                        className="ms-Button-flexContainer flexContainer-114"
                         data-automationid="splitbuttonprimary"
                       >
                         <span
-                          className="ms-Button-textContainer textContainer-59"
+                          className="ms-Button-textContainer textContainer-115"
                         >
                           <span
-                            className="ms-Button-label label-61"
+                            className="ms-Button-label label-117"
                             id="id__0"
                             key="id__0"
                           >
diff --git a/src/Explorer/Panes/Tables/__snapshots__/EditTableEntityPanel.test.tsx.snap b/src/Explorer/Panes/Tables/__snapshots__/EditTableEntityPanel.test.tsx.snap
index ff6bc9ef3..31e076e92 100644
--- a/src/Explorer/Panes/Tables/__snapshots__/EditTableEntityPanel.test.tsx.snap
+++ b/src/Explorer/Panes/Tables/__snapshots__/EditTableEntityPanel.test.tsx.snap
@@ -32,7 +32,7 @@ exports[`Excute Edit Table Entity Pane should render Default properly 1`] = `
           onClick={[Function]}
         >
           <div
-            className="ms-Stack addButtonEntiy css-53"
+            className="ms-Stack addButtonEntiy css-109"
             onClick={[Function]}
           >
             <StyledImageBase
@@ -323,7 +323,7 @@ exports[`Excute Edit Table Entity Pane should render Default properly 1`] = `
                 width={16}
               >
                 <div
-                  className="ms-Image root-54"
+                  className="ms-Image root-110"
                   style={
                     Object {
                       "height": 30,
@@ -333,7 +333,7 @@ exports[`Excute Edit Table Entity Pane should render Default properly 1`] = `
                 >
                   <img
                     alt="Add Entity"
-                    className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-55"
+                    className="ms-Image-image ms-Image-image--portrait is-notLoaded is-fadeIn image-111"
                     key="fabricImage"
                     onError={[Function]}
                     onLoad={[Function]}
@@ -347,7 +347,7 @@ exports[`Excute Edit Table Entity Pane should render Default properly 1`] = `
               key=".0:$.1"
             >
               <span
-                className="addNewParamStyle css-56"
+                className="addNewParamStyle css-112"
               >
                 Add Property
               </span>
@@ -1458,6 +1458,7 @@ exports[`Excute Edit Table Entity Pane should render Default properly 1`] = `
                           "overflow": "hidden",
                           "padding": 0,
                           "position": "absolute",
+                          "whiteSpace": "nowrap",
                           "width": 1,
                         },
                         "splitButtonContainer": Array [
@@ -2071,7 +2072,7 @@ exports[`Excute Edit Table Entity Pane should render Default properly 1`] = `
                   >
                     <button
                       aria-label="Update"
-                      className="ms-Button ms-Button--primary root-57"
+                      className="ms-Button ms-Button--primary root-113"
                       data-is-focusable={true}
                       id="sidePanelOkButton"
                       onClick={[Function]}
@@ -2083,14 +2084,14 @@ exports[`Excute Edit Table Entity Pane should render Default properly 1`] = `
                       type="submit"
                     >
                       <span
-                        className="ms-Button-flexContainer flexContainer-58"
+                        className="ms-Button-flexContainer flexContainer-114"
                         data-automationid="splitbuttonprimary"
                       >
                         <span
-                          className="ms-Button-textContainer textContainer-59"
+                          className="ms-Button-textContainer textContainer-115"
                         >
                           <span
-                            className="ms-Button-label label-61"
+                            className="ms-Button-label label-117"
                             id="id__0"
                             key="id__0"
                           >
diff --git a/src/Explorer/Panes/__snapshots__/DeleteDatabaseConfirmationPanel.test.tsx.snap b/src/Explorer/Panes/__snapshots__/DeleteDatabaseConfirmationPanel.test.tsx.snap
index ac2eef412..7869ae6f1 100644
--- a/src/Explorer/Panes/__snapshots__/DeleteDatabaseConfirmationPanel.test.tsx.snap
+++ b/src/Explorer/Panes/__snapshots__/DeleteDatabaseConfirmationPanel.test.tsx.snap
@@ -25,7 +25,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
           verticalAlign="center"
         >
           <div
-            className="ms-Stack panelInfoErrorContainer css-53"
+            className="ms-Stack panelInfoErrorContainer css-109"
           >
             <StyledIconBase
               aria-label="warning"
@@ -314,7 +314,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
               >
                 <i
                   aria-label="warning"
-                  className="panelWarningIcon root-55"
+                  className="panelWarningIcon root-112"
                   data-icon-name="WarningSolid"
                   role="img"
                 >
@@ -336,7 +336,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
                 <span
                   aria-label="Warning! The action you are about to take cannot be undone. Continuing will permanently delete this resource and all of its children resources."
                   aria-live="assertive"
-                  className="panelWarningErrorMessage css-56"
+                  className="panelWarningErrorMessage css-113"
                   role="alert"
                 >
                   Warning! The action you are about to take cannot be undone. Continuing will permanently delete this resource and all of its children resources.
@@ -361,7 +361,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
             variant="small"
           >
             <span
-              className="css-56"
+              className="css-113"
             >
               Confirm by typing the database id
             </span>
@@ -663,19 +663,19 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
               validateOnLoad={true}
             >
               <div
-                className="ms-TextField root-58"
+                className="ms-TextField root-115"
               >
                 <div
                   className="ms-TextField-wrapper"
                 >
                   <div
-                    className="ms-TextField-fieldGroup fieldGroup-59"
+                    className="ms-TextField-fieldGroup fieldGroup-116"
                   >
                     <input
                       aria-invalid={false}
                       aria-label="Confirm by typing the database id"
                       autoFocus={true}
-                      className="ms-TextField-field field-60"
+                      className="ms-TextField-field field-117"
                       id="confirmDatabaseId"
                       onBlur={[Function]}
                       onChange={[Function]}
@@ -698,7 +698,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
             variant="small"
           >
             <span
-              className="css-69"
+              className="css-126"
             >
               Help us improve Azure Cosmos DB!
             </span>
@@ -708,7 +708,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
             variant="small"
           >
             <span
-              className="css-69"
+              className="css-126"
             >
               What is the reason why you are deleting this database?
             </span>
@@ -1012,18 +1012,18 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
               validateOnLoad={true}
             >
               <div
-                className="ms-TextField ms-TextField--multiline root-58"
+                className="ms-TextField ms-TextField--multiline root-115"
               >
                 <div
                   className="ms-TextField-wrapper"
                 >
                   <div
-                    className="ms-TextField-fieldGroup fieldGroup-70"
+                    className="ms-TextField-fieldGroup fieldGroup-127"
                   >
                     <textarea
                       aria-invalid={false}
                       aria-label="Help us improve Azure Cosmos DB! What is the reason why you are deleting this database?"
-                      className="ms-TextField-field field-71"
+                      className="ms-TextField-field field-128"
                       id="deleteDatabaseFeedbackInput"
                       onBlur={[Function]}
                       onChange={[Function]}
@@ -2142,6 +2142,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
                           "overflow": "hidden",
                           "padding": 0,
                           "position": "absolute",
+                          "whiteSpace": "nowrap",
                           "width": 1,
                         },
                         "splitButtonContainer": Array [
@@ -2755,7 +2756,7 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
                   >
                     <button
                       aria-label="OK"
-                      className="ms-Button ms-Button--primary root-73"
+                      className="ms-Button ms-Button--primary root-130"
                       data-is-focusable={true}
                       id="sidePanelOkButton"
                       onClick={[Function]}
@@ -2767,14 +2768,14 @@ exports[`Delete Database Confirmation Pane Should call delete database 1`] = `
                       type="submit"
                     >
                       <span
-                        className="ms-Button-flexContainer flexContainer-74"
+                        className="ms-Button-flexContainer flexContainer-131"
                         data-automationid="splitbuttonprimary"
                       >
                         <span
-                          className="ms-Button-textContainer textContainer-75"
+                          className="ms-Button-textContainer textContainer-132"
                         >
                           <span
-                            className="ms-Button-label label-77"
+                            className="ms-Button-label label-134"
                             id="id__6"
                             key="id__6"
                           >