@zohodesk/dot 1.0.0-temp-230.3 → 1.0.0-temp-232

package/es/utils/editorUtils.js

@@ -176,11 +176,7 @@ export function loadResource(url, type, id, callback) {
   });
 } // bind
 
-export function bind() {
-  for (var _len = arguments.length, handlers = new Array(_len), _key = 0; _key < _len; _key++) {
-    handlers[_key] = arguments[_key];
-  }
-
+export function bind(...handlers) {
   handlers.forEach(handler => {
     if (__DEVELOPMENT__) {
       if (!this[handler]) {

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

@@ -2,7 +2,8 @@ import React, { useRef } from 'react'; //AlertDependencies
 
 import { Container, Box } from '@zohodesk/components/es/Layout';
 import AlertClose from "../../AlertClose/AlertClose";
-import AlertIcons from "../../alertIcons/AlertIcons"; //CSS
+import AlertIcons from "../../alertIcons/AlertIcons";
+import renderNode from '@zohodesk/utils/es/renderNode'; //CSS
 
 import style from "./css/AlertHeaderNew.module.css";
 import cssJSLogic from "./css/cssJSLogic";
@@ -24,7 +25,8 @@ export default function AlertHeader(props) {
     type,
     htmlId,
     customStyle,
-    dragBoundaryLimit
+    dragBoundaryLimit,
+    renderAlertIcon
   } = props;
   const finalStyle = mergeStyle(style, customStyle);
   const {
@@ -51,7 +53,7 @@ export default function AlertHeader(props) {
     eleRef: dragRef
   }, needIcon && /*#__PURE__*/React.createElement("div", {
     className: finalStyle.iconContainer
-  }, /*#__PURE__*/React.createElement(AlertIcons, {
+  }, renderNode(renderAlertIcon) || /*#__PURE__*/React.createElement(AlertIcons, {
     type: type
   })), (title || children) && /*#__PURE__*/React.createElement(Box, {
     flexible: true

package/es/version2/lookup/AlertHeader/__tests__/AlertHeader.spec.js

@@ -8,4 +8,28 @@ describe('AlertHeader', () => {
     } = render( /*#__PURE__*/React.createElement(AlertHeader, null));
     expect(asFragment()).toMatchSnapshot();
   });
+  test('renders custom renderAlertIcon when needIcon is true', () => {
+    const customIcon = /*#__PURE__*/React.createElement("span", {
+      "data-test-id": "custom-icon"
+    }, "icon");
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
+      needIcon: true,
+      renderAlertIcon: customIcon
+    }));
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('does not render custom renderAlertIcon when needIcon is false', () => {
+    const customIcon = /*#__PURE__*/React.createElement("span", {
+      "data-test-id": "custom-icon"
+    }, "icon");
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
+      needIcon: false,
+      renderAlertIcon: customIcon
+    }));
+    expect(asFragment()).toMatchSnapshot();
+  });
 });

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

@@ -1,5 +1,17 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`AlertHeader does not render custom renderAlertIcon when needIcon is false 1`] = `
+<DocumentFragment>
+  <div
+    class="container danger flex rowdir wrap vCenter"
+    data-drag-hook="true"
+    data-id="containerComponent"
+    data-selector-id="container"
+    data-test-id="containerComponent"
+  />
+</DocumentFragment>
+`;
+
 exports[`AlertHeader rendering the defult props 1`] = `
 <DocumentFragment>
   <div
@@ -86,3 +98,25 @@ exports[`AlertHeader rendering the defult props 1`] = `
   </div>
 </DocumentFragment>
 `;
+
+exports[`AlertHeader renders custom renderAlertIcon when needIcon is true 1`] = `
+<DocumentFragment>
+  <div
+    class="container danger flex rowdir wrap vCenter"
+    data-drag-hook="true"
+    data-id="containerComponent"
+    data-selector-id="container"
+    data-test-id="containerComponent"
+  >
+    <div
+      class="iconContainer"
+    >
+      <span
+        data-test-id="custom-icon"
+      >
+        icon
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;

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

@@ -1,9 +1,8 @@
 import { compileClassNames } from '@zohodesk/utils';
-export default function cssJSLogic(_ref) {
-  let {
-    props,
-    style
-  } = _ref;
+export default function cssJSLogic({
+  props,
+  style
+}) {
   let {
     children,
     type,

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

@@ -15,5 +15,6 @@ export default {
     left: PropTypes.number,
     right: PropTypes.number,
     bottom: PropTypes.number
-  })
+  }),
+  renderAlertIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.node])
 };

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

@@ -95,10 +95,9 @@ export function DesktopNotificationUI(props) {
   let uiVariantOne = title && (info || secondaryInfo);
   let uiVariantTwo = title && !(info || secondaryInfo) && !getSectionContainer;
 
-  function responsiveFunc(_ref) {
-    let {
-      mediaQueryOR
-    } = _ref;
+  function responsiveFunc({
+    mediaQueryOR
+  }) {
     return {
       uptoTablet: mediaQueryOR([{
         maxWidth: 760
@@ -115,66 +114,63 @@ export function DesktopNotificationUI(props) {
   }, /*#__PURE__*/React.createElement(ResponsiveReceiver, {
     query: responsiveFunc,
     responsiveId: responsiveId
-  }, _ref2 => {
-    let {
-      uptoTablet
-    } = _ref2;
-    return /*#__PURE__*/React.createElement(Container, _extends({
-      className: `${style.container} ${isAnimate ? animateClass : animateRemoveClass}
+  }, ({
+    uptoTablet
+  }) => /*#__PURE__*/React.createElement(Container, _extends({
+    className: `${style.container} ${isAnimate ? animateClass : animateRemoveClass}
             ${isShrinkView ? style.globalNotify : ''} ${containerClass}  ${uptoTablet ? style.tapWidth : style[`${size}`]}`,
-      isCover: false,
-      dataId: dataId,
-      isInline: uiVariantTwo
-    }, ExtraProps), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(DesktopNotificationHeader, {
-      type: type,
-      title: title,
-      variant: titleVariant,
-      needIcon: needIcon,
-      onClose: onClose,
-      closeTitle: closeTitle,
-      dataId: `${dataId}_close`,
-      needClose: needClose
-    })), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Container, {
-      alignBox: "column"
-    }, uiVariantOne && /*#__PURE__*/React.createElement(Box, {
-      flexible: true
-    }, /*#__PURE__*/React.createElement("div", {
-      className: `${style.section} ${style.infoText}`
-    }, subTitle && /*#__PURE__*/React.createElement("div", {
-      className: `${style.subTitle} ${info || secondaryInfo ? style.subTitleMargin : ''}`
-    }, subTitle), info && /*#__PURE__*/React.createElement("div", null, info), secondaryInfo && /*#__PURE__*/React.createElement("div", {
-      className: `${info ? style.secondaryInfo : ''}`
-    }, secondaryInfo))), getSectionContainer && /*#__PURE__*/React.createElement(Box, {
-      flexible: true
-    }, getSectionContainer()), submitText || cancelText ? /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement("div", {
-      className: style.footer
-    }, isMore ? /*#__PURE__*/React.createElement("div", {
-      className: `${style.message}`,
-      tagName: "p"
-    }, message) : null, /*#__PURE__*/React.createElement(FormAction, {
-      size: "small",
-      paddingLeftSize: "xmedium"
-    }, submitText ? /*#__PURE__*/React.createElement("div", {
-      onClick: onClickSubmit,
-      "data-id": `${dataId}_submitButton`,
-      "data-test-id": `${dataId}_submitButton`
-    }, /*#__PURE__*/React.createElement(Container, {
-      align: "vertical",
-      alignBox: "row"
-    }, getSubmitContainer ? /*#__PURE__*/React.createElement(Box, {
-      flexible: true
-    }, getSubmitContainer()) : /*#__PURE__*/React.createElement(Box, {
-      flexible: true
-    }, /*#__PURE__*/React.createElement(Button, {
-      text: submitText,
-      palette: submitType ? submitType : buttonPalette
-    })))) : null, cancelText ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
-      text: cancelText,
-      palette: "secondary",
-      dataId: `${dataId}_cancelButton`,
-      onClick: onClickCancel
-    })) : null))) : null)), getBottomContainer ? /*#__PURE__*/React.createElement(Box, null, getBottomContainer()) : null);
-  }));
+    isCover: false,
+    dataId: dataId,
+    isInline: uiVariantTwo
+  }, ExtraProps), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(DesktopNotificationHeader, {
+    type: type,
+    title: title,
+    variant: titleVariant,
+    needIcon: needIcon,
+    onClose: onClose,
+    closeTitle: closeTitle,
+    dataId: `${dataId}_close`,
+    needClose: needClose
+  })), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Container, {
+    alignBox: "column"
+  }, uiVariantOne && /*#__PURE__*/React.createElement(Box, {
+    flexible: true
+  }, /*#__PURE__*/React.createElement("div", {
+    className: `${style.section} ${style.infoText}`
+  }, subTitle && /*#__PURE__*/React.createElement("div", {
+    className: `${style.subTitle} ${info || secondaryInfo ? style.subTitleMargin : ''}`
+  }, subTitle), info && /*#__PURE__*/React.createElement("div", null, info), secondaryInfo && /*#__PURE__*/React.createElement("div", {
+    className: `${info ? style.secondaryInfo : ''}`
+  }, secondaryInfo))), getSectionContainer && /*#__PURE__*/React.createElement(Box, {
+    flexible: true
+  }, getSectionContainer()), submitText || cancelText ? /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement("div", {
+    className: style.footer
+  }, isMore ? /*#__PURE__*/React.createElement("div", {
+    className: `${style.message}`,
+    tagName: "p"
+  }, message) : null, /*#__PURE__*/React.createElement(FormAction, {
+    size: "small",
+    paddingLeftSize: "xmedium"
+  }, submitText ? /*#__PURE__*/React.createElement("div", {
+    onClick: onClickSubmit,
+    "data-id": `${dataId}_submitButton`,
+    "data-test-id": `${dataId}_submitButton`
+  }, /*#__PURE__*/React.createElement(Container, {
+    align: "vertical",
+    alignBox: "row"
+  }, getSubmitContainer ? /*#__PURE__*/React.createElement(Box, {
+    flexible: true
+  }, getSubmitContainer()) : /*#__PURE__*/React.createElement(Box, {
+    flexible: true
+  }, /*#__PURE__*/React.createElement(Button, {
+    text: submitText,
+    palette: submitType ? submitType : buttonPalette
+  })))) : null, cancelText ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
+    text: cancelText,
+    palette: "secondary",
+    dataId: `${dataId}_cancelButton`,
+    onClick: onClickCancel
+  })) : null))) : null)), getBottomContainer ? /*#__PURE__*/React.createElement(Box, null, getBottomContainer()) : null)));
 }
 DesktopNotificationUI.propTypes = DesktopNotificationUI_propTypes;
 export default function DesktopNotification(props) {

package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.js

@@ -25,10 +25,9 @@ export default class DesktopNotificationHeader extends Component {
       responsiveId
     } = this.props;
 
-    function responsiveFunc(_ref) {
-      let {
-        mediaQueryOR
-      } = _ref;
+    function responsiveFunc({
+      mediaQueryOR
+    }) {
       return {
         uptoTablet: mediaQueryOR([{
           maxWidth: 760
@@ -45,46 +44,43 @@ export default class DesktopNotificationHeader extends Component {
     }, /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: responsiveFunc,
       responsiveId: responsiveId
-    }, _ref2 => {
-      let {
-        uptoTablet
-      } = _ref2;
-      return /*#__PURE__*/React.createElement(React.Fragment, null, needIcon ? /*#__PURE__*/React.createElement("div", {
-        className: style.iconContainer
-      }, /*#__PURE__*/React.createElement(AlertIcons, {
-        type: type
-      })) : null, /*#__PURE__*/React.createElement(Box, {
-        flexible: true
-      }, /*#__PURE__*/React.createElement(Container, {
-        alignBox: "row",
-        align: "center"
-      }, variant === 'primary' ? /*#__PURE__*/React.createElement(Box, {
-        shrink: true
-      }, /*#__PURE__*/React.createElement(Typography, {
-        $i18n_dataTitle: title,
-        $ui_className: style.title,
-        $ui_tagName: "h1",
-        $ui_size: uptoTablet ? '16' : '18',
-        $ui_lineHeight: "1.2",
-        $ui_weight: "bold",
-        $flag_reset: true,
-        $ui_wordBreak: "breakWord"
-      }, title)) : /*#__PURE__*/React.createElement(Box, {
-        className: `${style.infoText}`
-      }, /*#__PURE__*/React.createElement(Typography, {
-        $i18n_dataTitle: title,
-        $ui_className: style.title,
-        $ui_size: "14",
-        $ui_wordBreak: "breakWord"
-      }, title)))), needClose ? /*#__PURE__*/React.createElement(Box, {
-        className: style.close
-      }, /*#__PURE__*/React.createElement(AlertClose, {
-        onClose: onClose,
-        dataTitle: closeTitle,
-        dataId: dataId,
-        type: "light"
-      })) : null);
-    }));
+    }, ({
+      uptoTablet
+    }) => /*#__PURE__*/React.createElement(React.Fragment, null, needIcon ? /*#__PURE__*/React.createElement("div", {
+      className: style.iconContainer
+    }, /*#__PURE__*/React.createElement(AlertIcons, {
+      type: type
+    })) : null, /*#__PURE__*/React.createElement(Box, {
+      flexible: true
+    }, /*#__PURE__*/React.createElement(Container, {
+      alignBox: "row",
+      align: "center"
+    }, variant === 'primary' ? /*#__PURE__*/React.createElement(Box, {
+      shrink: true
+    }, /*#__PURE__*/React.createElement(Typography, {
+      $i18n_dataTitle: title,
+      $ui_className: style.title,
+      $ui_tagName: "h1",
+      $ui_size: uptoTablet ? '16' : '18',
+      $ui_lineHeight: "1.2",
+      $ui_weight: "bold",
+      $flag_reset: true,
+      $ui_wordBreak: "breakWord"
+    }, title)) : /*#__PURE__*/React.createElement(Box, {
+      className: `${style.infoText}`
+    }, /*#__PURE__*/React.createElement(Typography, {
+      $i18n_dataTitle: title,
+      $ui_className: style.title,
+      $ui_size: "14",
+      $ui_wordBreak: "breakWord"
+    }, title)))), needClose ? /*#__PURE__*/React.createElement(Box, {
+      className: style.close
+    }, /*#__PURE__*/React.createElement(AlertClose, {
+      onClose: onClose,
+      dataTitle: closeTitle,
+      dataId: dataId,
+      type: "light"
+    })) : null)));
   }
 
 }

package/lib/AttachmentViewer/AttachmentImage.js

@@ -92,8 +92,7 @@ var AttachmentImage = /*#__PURE__*/function (_Component) {
           isCover = _this$props.isCover,
           customClass = _this$props.customClass,
           onLoad = _this$props.onLoad,
-          onError = _this$props.onError,
-          imageRef = _this$props.imageRef;
+          onError = _this$props.onError;
       var isImageValid = this.state.isImageValid;
       var _customClass$customIm = customClass.customImageClass,
           customImageClass = _customClass$customIm === void 0 ? '' : _customClass$customIm;
@@ -105,7 +104,6 @@ var AttachmentImage = /*#__PURE__*/function (_Component) {
         className: customImageClass,
         alt: alt,
         isCover: isCover,
-        eleRef: imageRef,
         onLoad: onLoad,
         onError: onError
       });