@zohodesk/dot 1.3.0-temp-158 → 1.3.1

package/es/v1/Message/Message.js

@@ -1,59 +1,33 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import { defaultProps } from '../../Message/props/defaultProps';
 import { propTypes, MessageUI_propTypes, MessageNew_propTypes } from '../../Message/props/propTypes';
 import { Icon } from '@zohodesk/icons';
 import AutoClose from '../actions/AutoClose';
 import style from '../../Message/Message.module.css';
-export default class Message extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      hideMessage: false
-    };
-  }
-
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    let {
-      showMessage,
-      hideMessage
-    } = this.props;
-
-    if (showMessage !== nextProps.showMessage) {
-      if (nextProps.type != 'alert') {
-        setTimeout(() => {
-          hideMessage();
-        }, 3000);
-      }
-    }
-  }
-
-  componentDidMount() {
-    let {
-      type,
-      hideMessage
-    } = this.props;
-
+export default function Message(props) {
+  // constructor(props) {
+  //   super(props);
+  //   this.state = { hideMessage: false };
+  // }
+  // const [hideMessage,setHideMessage] = useState(false)
+  let {
+    showMessage,
+    hideMessage,
+    type
+  } = props;
+  useEffect(() => {
     if (type != 'alert') {
       setTimeout(() => {
         hideMessage();
       }, 3000);
     }
-  }
-
-  render() {
-    return /*#__PURE__*/React.createElement(MessageUI, this.props);
-  }
-
+  }, [showMessage]);
+  return /*#__PURE__*/React.createElement(MessageUI, props);
 }
 Message.propTypes = propTypes;
-Message.defaultProps = defaultProps; // if (__DOCS__) {
-//   Message.docs = {
-//     componentGroup: 'Atom'
-//   };
-// }
-
+Message.defaultProps = defaultProps;
 export function MessageUI(props) {
   function onClose(e) {
     let {

package/es/v1/PlusIcon/PlusIcon.js

@@ -3,42 +3,30 @@ import { defaultProps } from '../../PlusIcon/props/defaultProps';
 import { propTypes } from '../../PlusIcon/props/propTypes';
 import style from '../../PlusIcon/PlusIcon.module.css';
 import AvatarIcon from '../avatar/AvatarIcon/AvatarIcon';
-export default class PlusIcon extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    let {
-      dataId,
-      iconName,
-      iconClass,
-      iconSize,
-      size,
-      onClick,
-      title,
-      customClass
-    } = this.props;
-    return /*#__PURE__*/React.createElement("span", {
-      className: style.container,
-      onClick: onClick,
-      "data-id": dataId,
-      "data-test-id": dataId,
-      "data-title": title
-    }, /*#__PURE__*/React.createElement(AvatarIcon, {
-      name: iconName,
-      iconClass: `${iconClass} ${style.icon}`,
-      iconSize: iconSize,
-      size: size,
-      className: `${customClass} ${style.plusIcon}`
-    }));
-  }
-
+export default function PlusIcon(props) {
+  let {
+    dataId,
+    iconName,
+    iconClass,
+    iconSize,
+    size,
+    onClick,
+    title,
+    customClass
+  } = props;
+  return /*#__PURE__*/React.createElement("span", {
+    className: style.container,
+    onClick: onClick,
+    "data-id": dataId,
+    "data-test-id": dataId,
+    "data-title": title
+  }, /*#__PURE__*/React.createElement(AvatarIcon, {
+    name: iconName,
+    iconClass: `${iconClass} ${style.icon}`,
+    iconSize: iconSize,
+    size: size,
+    className: `${customClass} ${style.plusIcon}`
+  }));
 }
 PlusIcon.defaultProps = defaultProps;
-PlusIcon.propTypes = propTypes; // if (__DOCS__) {
-//   PlusIcon.docs = {
-//     componentGroup: 'Common',
-//     folderName: 'Ticket DetailView'
-//   };
-// }
+PlusIcon.propTypes = propTypes;

package/es/v1/alert/AlertHeader/AlertHeader.js

@@ -10,8 +10,8 @@ import { mergeStyle } from '@zohodesk/utils'; //customHooks
 
 import useDragger from '../../../Hooks/Dragger/useDragger'; //Props
 
-import defaultProps from '../../../version2/lookup/AlertHeader/props/defaultProps';
-import propTypes from '../../../version2/lookup/AlertHeader/props/propTypes';
+import defaultProps from './props/defaultProps';
+import propTypes from './props/propTypes';
 export default function AlertHeader(props) {
   const {
     title,
@@ -24,7 +24,8 @@ export default function AlertHeader(props) {
     type,
     htmlId,
     customStyle,
-    dragBoundaryLimit
+    dragBoundaryLimit,
+    renderAlertIcon
   } = props;
   const finalStyle = mergeStyle(style, customStyle);
   const {
@@ -51,7 +52,7 @@ export default function AlertHeader(props) {
     eleRef: dragRef
   }, needIcon && /*#__PURE__*/React.createElement("div", {
     className: finalStyle.iconContainer
-  }, /*#__PURE__*/React.createElement(AlertIcons, {
+  }, renderAlertIcon ? renderAlertIcon() : /*#__PURE__*/React.createElement(AlertIcons, {
     type: type
   })), (title || children) && /*#__PURE__*/React.createElement(Box, {
     flexible: true

package/es/v1/alert/AlertHeader/props/defaultProps.js

@@ -0,0 +1,12 @@
+export default {
+  needIcon: true,
+  type: 'danger',
+  breakChildren: false,
+  dataId: 'alertHeader',
+  dragBoundaryLimit: {
+    top: 0,
+    left: 50,
+    right: 50,
+    bottom: 50
+  }
+};

package/es/v1/alert/AlertHeader/props/propTypes.js

@@ -0,0 +1,20 @@
+import PropTypes from 'prop-types';
+export default {
+  breakChildren: PropTypes.bool,
+  children: PropTypes.node,
+  closeTitle: PropTypes.string,
+  dataId: PropTypes.string,
+  needIcon: PropTypes.bool,
+  onClose: PropTypes.func,
+  title: PropTypes.string,
+  type: PropTypes.oneOf(['success', 'error', 'danger', 'warning', 'info', 'notification']),
+  htmlId: PropTypes.string,
+  customStyle: PropTypes.object,
+  dragBoundaryLimit: PropTypes.shape({
+    top: PropTypes.number,
+    left: PropTypes.number,
+    right: PropTypes.number,
+    bottom: PropTypes.number
+  }),
+  renderAlertIcon: PropTypes.func
+};

package/es/v1/alert/AlertLookup/AlertLookup.js

@@ -2,8 +2,8 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 /**** Libraries ****/
 import React from 'react';
-import { defaultProps } from '../../../version2/lookup/AlertLookup/props/defaultProps';
-import { propTypes } from '../../../version2/lookup/AlertLookup/props/propTypes';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** Components ****/
 
 import { useUniqueId } from '@zohodesk/components/es/v1/Provider/IdProvider';
@@ -65,7 +65,8 @@ export default function AlertLookup(props) {
     isHtmlContent,
     scroll,
     isDefaultFocus,
-    onEsc
+    onEsc,
+    renderAlertIcon
   } = props;
   const {
     LookupProps = {},
@@ -115,7 +116,8 @@ export default function AlertLookup(props) {
     type: type,
     needIcon: needIcon,
     onClose: onClose,
-    breakChildren: wrapHeader
+    breakChildren: wrapHeader,
+    renderAlertIcon: renderAlertIcon
   }, AlertHeaderProps), headerChildren ? headerChildren() : null)), /*#__PURE__*/React.createElement(Box, {
     flexible: true
   }, /*#__PURE__*/React.createElement("div", {

package/es/v1/alert/AlertLookup/props/defaultProps.js

@@ -0,0 +1,13 @@
+export const defaultProps = {
+  isActive: false,
+  size: 'small',
+  wrapHeader: false,
+  dataId: 'alertPopup',
+  isDefaultFocus: true,
+  customProps: {},
+  align: 'top',
+  childAnimationName: 'flyDown',
+  isHtmlContent: false,
+  scroll: '',
+  onEsc: 'cancel'
+};

package/es/v1/alert/AlertLookup/props/propTypes.js

@@ -0,0 +1,36 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  cancelText: PropTypes.string,
+  children: PropTypes.node,
+  confirmationMessage: PropTypes.string,
+  customClass: PropTypes.object,
+  dataId: PropTypes.string,
+  forwardRef: PropTypes.object,
+  headerChildren: PropTypes.func,
+  isActive: PropTypes.bool,
+  isDefaultFocus: PropTypes.bool,
+  message: PropTypes.node,
+  needIcon: PropTypes.bool,
+  onCancelClick: PropTypes.func,
+  onClose: PropTypes.func,
+  onLookupClick: PropTypes.func,
+  onSubmitClick: PropTypes.func,
+  size: PropTypes.oneOf(['small', 'xmedium', 'medium']),
+  submitText: PropTypes.string,
+  title: PropTypes.string,
+  type: PropTypes.oneOf(['success', 'error', 'danger', 'warning', 'info', 'notification']),
+  wrapHeader: PropTypes.bool,
+  a11y: PropTypes.object,
+  customProps: PropTypes.shape({
+    LookupProps: PropTypes.object,
+    AlertHeaderProps: PropTypes.object,
+    PrimaryButtonProps: PropTypes.object,
+    SecondaryButtonProps: PropTypes.object
+  }),
+  align: PropTypes.oneOf(['top', 'vertical']),
+  childAnimationName: PropTypes.oneOf(['expand', 'flyDown']),
+  isHtmlContent: PropTypes.bool,
+  scroll: PropTypes.oneOf(['horizontal', 'vertical', 'both']),
+  onEsc: PropTypes.oneOf(['close', 'cancel']),
+  renderAlertIcon: PropTypes.func
+};

package/es/v1/avatar/AvatarClose/AvatarClose.js

@@ -6,48 +6,37 @@ import { propTypes } from '../../../avatar/AvatarClose/props/propTypes';
 import Avatar from '@zohodesk/components/es/v1/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
 import style from '../../../avatar/AvatarClose/AvatarClose.module.css';
-export default class AvatarClose extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    let {
-      title,
-      src,
-      name,
-      size,
-      isClose,
-      onClick,
-      customProps,
-      dataSelectorId
-    } = this.props;
-    let {
-      AvatarCloseProps = {},
-      AvatarProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement("div", _extends({
-      className: style.container,
-      "data-selector-id": dataSelectorId
-    }, AvatarCloseProps), /*#__PURE__*/React.createElement(Avatar, _extends({
-      src: src,
-      name: name,
-      title: title,
-      size: size
-    }, AvatarProps)), isClose && /*#__PURE__*/React.createElement("span", {
-      className: style.pop,
-      onClick: onClick
-    }, /*#__PURE__*/React.createElement("span", {
-      className: style.icon
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "ZD-plus"
-    }))));
-  }
-
+export default function AvatarClose(props) {
+  let {
+    title,
+    src,
+    name,
+    size,
+    isClose,
+    onClick,
+    customProps,
+    dataSelectorId
+  } = props;
+  let {
+    AvatarCloseProps = {},
+    AvatarProps = {}
+  } = customProps;
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: style.container,
+    "data-selector-id": dataSelectorId
+  }, AvatarCloseProps), /*#__PURE__*/React.createElement(Avatar, _extends({
+    src: src,
+    name: name,
+    title: title,
+    size: size
+  }, AvatarProps)), isClose && /*#__PURE__*/React.createElement("span", {
+    className: style.pop,
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.icon
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "ZD-plus"
+  }))));
 }
 AvatarClose.propTypes = propTypes;
-AvatarClose.defaultProps = defaultProps; // if (__DOCS__) {
-//   AvatarClose.docs = {
-//     componentGroup: 'Avatar Group'
-//   };
-// }
+AvatarClose.defaultProps = defaultProps;

package/es/v1/avatar/AvatarCollision/AvatarCollision.js

@@ -6,57 +6,46 @@ import { propTypes } from '../../../avatar/AvatarCollision/props/propTypes';
 import Avatar from '@zohodesk/components/es/v1/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
 import style from '../../../avatar/AvatarCollision/AvatarCollision.module.css';
-export default class AvatarCollision extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    let {
-      title,
-      src,
-      name,
-      size,
-      onClick,
-      needCreateChat,
-      isLeft,
-      isIdle,
-      initial,
-      customProps,
-      dataSelectorId
-    } = this.props;
-    let {
-      AvatarCollisionProps = {},
-      AvatarProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement("div", _extends({
-      className: `${style.container} ${isLeft ? style.off : isIdle ? style.idle : style.on}`,
-      onClick: onClick,
-      "data-id": "collsionPop",
-      "data-test-id": "collsionPop",
-      "data-title": title,
-      "data-selector-id": dataSelectorId
-    }, AvatarCollisionProps), /*#__PURE__*/React.createElement(Avatar, _extends({
-      src: src,
-      name: name,
-      size: size,
-      palette: "default",
-      needTitle: false,
-      initial: initial
-    }, AvatarProps)), needCreateChat && !isLeft && /*#__PURE__*/React.createElement("span", {
-      className: style.pop,
-      "data-title": title
-    }, /*#__PURE__*/React.createElement("span", {
-      className: style.icon
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "ZD-livechat3"
-    }))));
-  }
-
+export default function AvatarCollision(props) {
+  let {
+    title,
+    src,
+    name,
+    size,
+    onClick,
+    needCreateChat,
+    isLeft,
+    isIdle,
+    initial,
+    customProps,
+    dataSelectorId
+  } = props;
+  let {
+    AvatarCollisionProps = {},
+    AvatarProps = {}
+  } = customProps;
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: `${style.container} ${isLeft ? style.off : isIdle ? style.idle : style.on}`,
+    onClick: onClick,
+    "data-id": "collsionPop",
+    "data-test-id": "collsionPop",
+    "data-title": title,
+    "data-selector-id": dataSelectorId
+  }, AvatarCollisionProps), /*#__PURE__*/React.createElement(Avatar, _extends({
+    src: src,
+    name: name,
+    size: size,
+    palette: "default",
+    needTitle: false,
+    initial: initial
+  }, AvatarProps)), needCreateChat && !isLeft && /*#__PURE__*/React.createElement("span", {
+    className: style.pop,
+    "data-title": title
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.icon
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "ZD-livechat3"
+  }))));
 }
 AvatarCollision.propTypes = propTypes;
-AvatarCollision.defaultProps = defaultProps; // if (__DOCS__) {
-//   AvatarCollision.docs = {
-//     componentGroup: 'Avatar Group'
-//   };
-// }
+AvatarCollision.defaultProps = defaultProps;

package/es/v1/avatar/AvatarIcon/AvatarIcon.js

@@ -7,48 +7,43 @@ import { Icon } from '@zohodesk/icons';
 import { Container } from '@zohodesk/components/es/v1/Layout';
 import AvatarSize from '@zohodesk/components/es/v1/Provider/AvatarSize';
 import style from '../../../avatar/AvatarIcon/AvatarIcon.module.css';
-export default class AvatarIcon extends React.Component {
-  render() {
-    let {
-      name,
-      size,
-      iconSize,
-      iconClass,
-      iconColor,
-      onClick,
-      palette,
-      dataId,
-      className,
-      isIconBold,
-      title,
-      borderOnActive,
-      borderOnHover,
-      customProps,
-      dataSelectorId
-    } = this.props;
-    let {
-      AvatarIconProps = {}
-    } = customProps;
-    let border = borderOnHover || onClick;
-    return /*#__PURE__*/React.createElement(Container, _extends({
-      className: `${style.container} ${borderOnActive ? style.borderOnActive : border ? style.borderOnHover : ''} ${AvatarSize(size)} ${style[palette]} ${className}`,
-      onClick: onClick,
-      dataId: dataId,
-      "data-title": title,
-      isInline: true,
-      align: "both",
-      isCover: false,
-      dataSelectorId: dataSelectorId
-    }, AvatarIconProps), /*#__PURE__*/React.createElement(Icon, {
-      name: name,
-      size: iconSize,
-      iconClass: ` ${iconClass} ${style.iconColor} ${iconColor ? ` ${style[`icon_${iconColor}`]}` : ''} `,
-      isBold: isIconBold
-    }));
-  }
-
+export default function AvatarIcon(props) {
+  let {
+    name,
+    size,
+    iconSize,
+    iconClass,
+    iconColor,
+    onClick,
+    palette,
+    dataId,
+    className,
+    isIconBold,
+    title,
+    borderOnActive,
+    borderOnHover,
+    customProps,
+    dataSelectorId
+  } = props;
+  let {
+    AvatarIconProps = {}
+  } = customProps;
+  let border = borderOnHover || onClick;
+  return /*#__PURE__*/React.createElement(Container, _extends({
+    className: `${style.container} ${borderOnActive ? style.borderOnActive : border ? style.borderOnHover : ''} ${AvatarSize(size)} ${style[palette]} ${className}`,
+    onClick: onClick,
+    dataId: dataId,
+    "data-title": title,
+    isInline: true,
+    align: "both",
+    isCover: false,
+    dataSelectorId: dataSelectorId
+  }, AvatarIconProps), /*#__PURE__*/React.createElement(Icon, {
+    name: name,
+    size: iconSize,
+    iconClass: ` ${iconClass} ${style.iconColor} ${iconColor ? ` ${style[`icon_${iconColor}`]}` : ''} `,
+    isBold: isIconBold
+  }));
 }
 AvatarIcon.defaultProps = defaultProps;
-AvatarIcon.propTypes = propTypes; // if (__DOCS__) {
-//   AvatarIcon.docs = { componentGroup: 'Avatar Group' };
-// }
+AvatarIcon.propTypes = propTypes;