@zohodesk/dot 1.9.15 → 1.9.17

package/es/version2/lookup/AlertHeader/css/cssJSLogic.js

@@ -1,4 +1,4 @@
-import { compileClassNames } from '@zohodesk/utils';
+import compileClassNames from '@zohodesk/utils/es/compileClassNames';
 export default function cssJSLogic({
   props,
   style
@@ -6,12 +6,17 @@ export default function cssJSLogic({
   let {
     children,
     type,
-    title
+    title,
+    customClass
   } = props;
+  let {
+    container
+  } = customClass;
   let alertHeaderContainerClass = compileClassNames({
     [style.container]: true,
     [style.headerLayout]: !!title || !!children,
-    [style[type]]: !!type
+    [style[type]]: !!type,
+    [container]: !!container
   });
   return {
     alertHeaderContainerClass

package/es/version2/lookup/AlertHeader/props/defaultProps.js

@@ -1,8 +1,11 @@
+import { DUMMY_OBJECT } from "@zohodesk/dotkit/es/utils/constants";
 export default {
   needIcon: true,
   type: 'danger',
   breakChildren: false,
   dataId: 'alertHeader',
+  isDraggable: true,
+  customClass: DUMMY_OBJECT,
   dragBoundaryLimit: {
     top: 0,
     left: 50,

package/es/version2/lookup/AlertHeader/props/propTypes.js

@@ -8,6 +8,15 @@ export default {
   onClose: PropTypes.func,
   title: PropTypes.string,
   type: PropTypes.oneOf(['success', 'error', 'danger', 'warning', 'info', 'notification']),
+  isDraggable: PropTypes.bool,
+  customClass: PropTypes.shape({
+    container: PropTypes.string,
+    title: PropTypes.string,
+    iconContainer: PropTypes.string,
+    close: PropTypes.string
+  }),
+  renderSecondaryContent: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
+  renderRightActions: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
   htmlId: PropTypes.string,
   customStyle: PropTypes.object,
   dragBoundaryLimit: PropTypes.shape({

package/es/version2/lookup/AlertLookup/__tests__/__snapshots__/AlertLookup.spec.js.snap

@@ -8,7 +8,7 @@ exports[`AlertLookup rendering isActive is true defult 1`] = `
     style="z-index: 4;"
   >
     <div
-      class="flex cover rowdir hCenter"
+      class="flex fullSize row justifyContent_center"
       data-id="reactFreezeLayer"
       data-selector-id="container"
       data-test-id="reactFreezeLayer"

package/es/version2/notification/DesktopNotification/DesktopNotification.js

@@ -118,7 +118,7 @@ export function DesktopNotificationUI(props) {
     uptoTablet
   }) => /*#__PURE__*/React.createElement(Container, _extends({
     className: `${style.container} ${isAnimate ? animateClass : animateRemoveClass}
-            ${isShrinkView ? style.globalNotify : ''} ${containerClass}  ${uptoTablet ? style.tapWidth : style[`${size}`]}`,
+            ${isShrinkView ? style.globalNotify : ''}  ${uptoTablet ? style.tapWidth : style[`${size}`]} ${containerClass} `,
     isCover: false,
     dataId: dataId,
     isInline: uiVariantTwo

package/es/version2/notification/DesktopNotification/__tests__/__snapshots__/DesktopNotification.spec.js.snap

@@ -8,20 +8,19 @@ exports[`DesktopNotification rendering the defult props 1`] = `
     style="z-index: 4;"
   >
     <div
-      class="container leftanimate
-             undefined  undefined flex coldir"
+      class="flex column container leftanimate"
       data-id="toastMessage"
       data-selector-id="container"
       data-test-id="toastMessage"
     >
       <div
-        class="shrinkOff"
+        class="noShrink"
         data-id="boxComponent"
         data-selector-id="box"
         data-test-id="boxComponent"
       >
         <div
-          class="container primary_header undefined flex rowdir wrap vCenter"
+          class="flex row wrap alignItems_center container primary_header"
           data-id="containerComponent"
           data-selector-id="container"
           data-test-id="containerComponent"
@@ -101,37 +100,37 @@ exports[`DesktopNotification rendering the defult props 1`] = `
             </div>
           </div>
           <div
-            class="grow basis shrinkOff"
+            class="flexible basis_zero noShrink"
             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"
             >
               <div
-                class="shrinkOn"
+                class="shrink"
                 data-id="boxComponent"
                 data-selector-id="box"
                 data-test-id="boxComponent"
               >
                 <h1
-                  class="reset size18 lineheight_1_2 font_bold title wordBreak_breakWord"
+                  class="reset size18 lineheight_1_2 font_bold wordBreak_breakWord title"
                 />
               </div>
             </div>
           </div>
           <div
-            class="close shrinkOff"
+            class="noShrink close"
             data-id="boxComponent"
             data-selector-id="box"
             data-test-id="boxComponent"
           >
             <div
-              class="close light  inflex rowdir both"
+              class="inlineFlex row alignItems_center justifyContent_center close light"
               data-id="toastMessage_close"
               data-selector-id="container"
               data-test-id="toastMessage_close"
@@ -139,14 +138,14 @@ exports[`DesktopNotification rendering the defult props 1`] = `
               tabindex="0"
             >
               <div
-                class="shrinkOff"
+                class="noShrink"
                 data-id="boxComponent"
                 data-selector-id="box"
                 data-test-id="boxComponent"
               >
                 <i
                   aria-hidden="true"
-                  class="zd_font_icons basic icon-Cross fbold closeIcon  "
+                  class="zd_font_icons basic icon-Cross fbold closeIcon"
                   data-id="fontIcon"
                   data-selector-id="fontIcon"
                   data-test-id="fontIcon"
@@ -158,13 +157,13 @@ exports[`DesktopNotification rendering the defult props 1`] = `
         </div>
       </div>
       <div
-        class="shrinkOff"
+        class="noShrink"
         data-id="boxComponent"
         data-selector-id="box"
         data-test-id="boxComponent"
       >
         <div
-          class="flex cover coldir"
+          class="flex fullSize column"
           data-id="containerComponent"
           data-selector-id="container"
           data-test-id="containerComponent"

package/es/version2/notification/DesktopNotificationHeader/__tests__/__snapshots__/DesktopNotificationHeader.spec.js.snap

@@ -3,7 +3,7 @@
 exports[`DesktopNotificationHeader rendering the defult props 1`] = `
 <DocumentFragment>
   <div
-    class="container primary_header undefined flex rowdir wrap vCenter"
+    class="flex row wrap alignItems_center container primary_header"
     data-id="containerComponent"
     data-selector-id="container"
     data-test-id="containerComponent"
@@ -83,51 +83,51 @@ exports[`DesktopNotificationHeader rendering the defult props 1`] = `
       </div>
     </div>
     <div
-      class="grow basis shrinkOff"
+      class="flexible basis_zero noShrink"
       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"
       >
         <div
-          class="shrinkOn"
+          class="shrink"
           data-id="boxComponent"
           data-selector-id="box"
           data-test-id="boxComponent"
         >
           <h1
-            class="reset size18 lineheight_1_2 font_bold title wordBreak_breakWord"
+            class="reset size18 lineheight_1_2 font_bold wordBreak_breakWord title"
           />
         </div>
       </div>
     </div>
     <div
-      class="close shrinkOff"
+      class="noShrink close"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
     >
       <div
-        class="close light  inflex rowdir both"
+        class="inlineFlex row alignItems_center justifyContent_center close light"
         data-id="containerComponent"
         data-selector-id="container"
         data-test-id="containerComponent"
         tabindex="0"
       >
         <div
-          class="shrinkOff"
+          class="noShrink"
           data-id="boxComponent"
           data-selector-id="box"
           data-test-id="boxComponent"
         >
           <i
             aria-hidden="true"
-            class="zd_font_icons basic icon-Cross fbold closeIcon  "
+            class="zd_font_icons basic icon-Cross fbold closeIcon"
             data-id="fontIcon"
             data-selector-id="fontIcon"
             data-test-id="fontIcon"

package/lib/ActionButton/ActionButton.js

@@ -129,7 +129,7 @@ var ActionButton = /*#__PURE__*/function (_React$Component) {
       return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
         alignBox: "row",
         isCover: false,
-        className: " ".concat(_ActionButtonModule["default"].container, " ").concat(_ActionButtonModule["default"][palette + 'Box'], " ").concat(_ActionButtonModule["default"][size], " ").concat(className, " ").concat(isDisabled ? (0, _CssProvider["default"])('isDisabled') : '', " ").concat(!onClick ? _ActionButtonModule["default"].wholeDiv : '', " "),
+        className: " ".concat(_ActionButtonModule["default"].container, " ").concat(_ActionButtonModule["default"][palette + 'Box'], " ").concat(_ActionButtonModule["default"][size], "  ").concat(isDisabled ? (0, _CssProvider["default"])('isDisabled') : '', " ").concat(!onClick ? _ActionButtonModule["default"].wholeDiv : '', " ").concat(className),
         onClick: onHover ? removeClose : !onClick ? this.handleTogglePopup : undefined,
         onMouseEnter: !onClick ? onHover && this.handleTogglePopup : undefined,
         onMouseLeave: !onClick ? onHover && this.handleTogglePopup : undefined,
@@ -150,7 +150,7 @@ var ActionButton = /*#__PURE__*/function (_React$Component) {
         flexible: true,
         onClick: onClick,
         dataId: dataId,
-        className: "".concat(_semanticButtonModule["default"].buttonReset, " ").concat(_ActionButtonModule["default"].contentBox, " ").concat(_ActionButtonModule["default"][palette + 'Btn'], " ").concat(_ActionButtonModule["default"][size + '_btnBox'], " ").concat(children ? _ActionButtonModule["default"].contentBoxBdr : _ActionButtonModule["default"].contentBoxBdrRds, " ").concat(_ActionButtonModule["default"].clickable, " ").concat(innerClassName, " "),
+        className: "".concat(_semanticButtonModule["default"].buttonReset, " ").concat(_ActionButtonModule["default"].contentBox, " ").concat(_ActionButtonModule["default"][palette + 'Btn'], " ").concat(_ActionButtonModule["default"][size + '_btnBox'], " ").concat(children ? _ActionButtonModule["default"].contentBoxBdr : _ActionButtonModule["default"].contentBoxBdrRds, " ").concat(_ActionButtonModule["default"].clickable, " ").concat(innerClassName),
         "data-title": dataTitle,
         tagName: "button"
       }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {