@zohodesk/dot 1.9.16 → 1.9.17

package/lib/lookup/header/ModuleHeader/__tests__/__snapshots__/ModuleHeader.spec.js.snap

@@ -3,7 +3,7 @@
 exports[`ModuleHeader snapshot -  Render with childNearTitle 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
@@ -13,19 +13,19 @@ exports[`ModuleHeader snapshot -  Render with childNearTitle 1`] = `
       Near title
     </span>
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -39,26 +39,26 @@ exports[`ModuleHeader snapshot -  Render with childNearTitle 1`] = `
 exports[`ModuleHeader snapshot -  Render with children 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -75,26 +75,26 @@ exports[`ModuleHeader snapshot -  Render with children 1`] = `
 exports[`ModuleHeader snapshot -  Render with customClass 1`] = `
 <DocumentFragment>
   <div
-    class="container default custom-container flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default custom-container"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title custom-title flex rowdir vCenter"
+        class="flex row alignItems_center title custom-title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -106,7 +106,7 @@ exports[`ModuleHeader snapshot -  Render with customClass 1`] = `
     >
       <button
         aria-pressed="false"
-        class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+        class="inlineFlex column alignItems_center justifyContent_center buttonReset large wrapper effect default border defaultHover hoverEffect"
         data-id="close"
         data-ishtml="false"
         data-selector-id="iconButton"
@@ -114,7 +114,7 @@ exports[`ModuleHeader snapshot -  Render with customClass 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons basic icon-cross   icon_button_center  "
+          class="zd_font_icons basic icon-cross icon_button_center"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -129,20 +129,20 @@ exports[`ModuleHeader snapshot -  Render with customClass 1`] = `
 exports[`ModuleHeader snapshot -  Render with customProps for sub-components 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir vCenter"
+    class="flex row alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="custom-titleWrapper"
         data-selector-id="container"
         data-test-id="custom-titleWrapper"
@@ -159,46 +159,43 @@ exports[`ModuleHeader snapshot -  Render with customProps for sub-components 1`]
       </div>
     </div>
     <div
-      class="searchContainer searchContainer shrinkOff"
+      class="noShrink searchContainer searchContainer"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="wrapper boxType 
-          
-          
-         flex rowdir vCenter"
+        class="flex row alignItems_center wrapper boxType"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons basic icon-search  searchIcon searchIconBox  "
+          class="zd_font_icons basic icon-search searchIcon searchIconBox"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
           style="--zd-iconfont-size: var(--zd_font_size11);"
         />
         <div
-          class="grow basis shrinkOff"
+          class="flexible basis_zero noShrink"
           data-id="boxComponent"
           data-selector-id="box"
           data-test-id="boxComponent"
         >
           <div
-            class="varClass customContainer    effect     container   flex rowdir"
+            class="flex row varClass customContainer effect container"
             data-selector-id="textBoxIcon"
           >
             <div
-              class="grow basis shrinkOff"
+              class="flexible basis_zero noShrink"
               data-id="boxComponent"
               data-selector-id="box"
               data-test-id="boxComponent"
             >
               <input
-                class="  container small  default  effect  borderColor_default  "
+                class="container small default effect borderColor_default"
                 data-a11y-autofocus="true"
                 data-id="search"
                 data-selector-id="textBoxIcon"
@@ -209,13 +206,13 @@ exports[`ModuleHeader snapshot -  Render with customProps for sub-components 1`]
               />
             </div>
             <div
-              class="iconContainer  shrinkOff"
+              class="noShrink iconContainer"
               data-id="boxComponent"
               data-selector-id="box"
               data-test-id="boxComponent"
             >
               <div
-                class="flex cover rowdir"
+                class="flex fullSize row"
                 data-id="containerComponent"
                 data-selector-id="container"
                 data-test-id="containerComponent"
@@ -226,11 +223,11 @@ exports[`ModuleHeader snapshot -  Render with customProps for sub-components 1`]
       </div>
     </div>
     <div
-      class="closeContainer "
+      class="closeContainer"
     >
       <button
         aria-pressed="false"
-        class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+        class="inlineFlex column alignItems_center justifyContent_center buttonReset large wrapper effect default border defaultHover hoverEffect"
         data-id="custom-close"
         data-ishtml="false"
         data-selector-id="iconButton"
@@ -238,7 +235,7 @@ exports[`ModuleHeader snapshot -  Render with customProps for sub-components 1`]
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons basic icon-cross   icon_button_center  "
+          class="zd_font_icons basic icon-cross icon_button_center"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -253,26 +250,26 @@ exports[`ModuleHeader snapshot -  Render with customProps for sub-components 1`]
 exports[`ModuleHeader snapshot -  Render with dataId 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="module-header-dataId"
     data-selector-id="container"
     data-test-id="module-header-dataId"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -286,26 +283,26 @@ exports[`ModuleHeader snapshot -  Render with dataId 1`] = `
 exports[`ModuleHeader snapshot -  Render with default props 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title=""
         />
       </div>
@@ -317,26 +314,26 @@ exports[`ModuleHeader snapshot -  Render with default props 1`] = `
 exports[`ModuleHeader snapshot -  Render with htmlId 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
           id="module-header-htmlId"
         >
@@ -351,26 +348,26 @@ exports[`ModuleHeader snapshot -  Render with htmlId 1`] = `
 exports[`ModuleHeader snapshot -  Render with isDraggable=false 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="false"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title=""
         />
       </div>
@@ -382,26 +379,26 @@ exports[`ModuleHeader snapshot -  Render with isDraggable=false 1`] = `
 exports[`ModuleHeader snapshot -  Render with miniDescription 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title=""
         />
       </div>
@@ -418,63 +415,60 @@ exports[`ModuleHeader snapshot -  Render with miniDescription 1`] = `
 exports[`ModuleHeader snapshot -  Render with needSearch=true 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title=""
         />
       </div>
     </div>
     <div
-      class="searchContainer searchContainer shrinkOff"
+      class="noShrink searchContainer searchContainer"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="wrapper borderType 
-          
-          
-         flex rowdir vCenter"
+        class="flex row alignItems_center wrapper borderType"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <div
-          class="grow basis shrinkOff"
+          class="flexible basis_zero noShrink"
           data-id="boxComponent"
           data-selector-id="box"
           data-test-id="boxComponent"
         >
           <div
-            class="varClass customContainer    effect     container   flex rowdir"
+            class="flex row varClass customContainer effect container"
             data-selector-id="textBoxIcon"
           >
             <div
-              class="grow basis shrinkOff"
+              class="flexible basis_zero noShrink"
               data-id="boxComponent"
               data-selector-id="box"
               data-test-id="boxComponent"
             >
               <input
-                class="  container small  default  effect  borderColor_default  "
+                class="container small default effect borderColor_default"
                 data-a11y-autofocus="true"
                 data-id="search"
                 data-selector-id="textBoxIcon"
@@ -485,13 +479,13 @@ exports[`ModuleHeader snapshot -  Render with needSearch=true 1`] = `
               />
             </div>
             <div
-              class="iconContainer  shrinkOff"
+              class="noShrink iconContainer"
               data-id="boxComponent"
               data-selector-id="box"
               data-test-id="boxComponent"
             >
               <div
-                class="flex cover rowdir"
+                class="flex fullSize row"
                 data-id="containerComponent"
                 data-selector-id="container"
                 data-test-id="containerComponent"
@@ -508,36 +502,36 @@ exports[`ModuleHeader snapshot -  Render with needSearch=true 1`] = `
 exports[`ModuleHeader snapshot -  Render with onLookupClose 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title=""
         />
       </div>
     </div>
     <div
-      class="closeContainer "
+      class="closeContainer"
     >
       <button
         aria-pressed="false"
-        class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+        class="inlineFlex column alignItems_center justifyContent_center buttonReset large wrapper effect default border defaultHover hoverEffect"
         data-id="close"
         data-ishtml="false"
         data-selector-id="iconButton"
@@ -545,7 +539,7 @@ exports[`ModuleHeader snapshot -  Render with onLookupClose 1`] = `
       >
         <i
           aria-hidden="true"
-          class="zd_font_icons basic icon-cross   icon_button_center  "
+          class="zd_font_icons basic icon-cross icon_button_center"
           data-id="fontIcon"
           data-selector-id="fontIcon"
           data-test-id="fontIcon"
@@ -560,26 +554,26 @@ exports[`ModuleHeader snapshot -  Render with onLookupClose 1`] = `
 exports[`ModuleHeader snapshot -  Render with palette=default 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title=""
         />
       </div>
@@ -591,26 +585,26 @@ exports[`ModuleHeader snapshot -  Render with palette=default 1`] = `
 exports[`ModuleHeader snapshot -  Render with palette=white 1`] = `
 <DocumentFragment>
   <div
-    class="container white  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container white"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title=""
         />
       </div>
@@ -622,26 +616,26 @@ exports[`ModuleHeader snapshot -  Render with palette=white 1`] = `
 exports[`ModuleHeader snapshot -  Render with renderSecondaryContent as element 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -658,26 +652,26 @@ exports[`ModuleHeader snapshot -  Render with renderSecondaryContent as element
 exports[`ModuleHeader snapshot -  Render with renderSecondaryContent as function 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -694,26 +688,26 @@ exports[`ModuleHeader snapshot -  Render with renderSecondaryContent as function
 exports[`ModuleHeader snapshot -  Render with renderSecondaryContent should not override miniDescription 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -735,26 +729,26 @@ exports[`ModuleHeader snapshot -  Render with renderSecondaryContent should not
 exports[`ModuleHeader snapshot -  Render with renderTitleChildren as element 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title
@@ -771,26 +765,26 @@ exports[`ModuleHeader snapshot -  Render with renderTitleChildren as element 1`]
 exports[`ModuleHeader snapshot -  Render with renderTitleChildren as function 1`] = `
 <DocumentFragment>
   <div
-    class="container default  flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container default"
     data-drag-hook="true"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
   >
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="title  flex rowdir vCenter"
+        class="flex row alignItems_center title"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
       >
         <span
-          class="title default "
+          class="title default"
           data-title="Header Title"
         >
           Header Title