@zohodesk/dot 1.9.1 → 1.9.3

package/es/v1/ToastMessage/ToastMessage.js

@@ -1,201 +0,0 @@
-import React, { useState } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes"; //components
-
-import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
-import { Icon } from '@zohodesk/icons';
-import { Container, Box } from '@zohodesk/components/es/v1/Layout';
-import { useZIndex } from '@zohodesk/components/es/Provider/ZindexProvider';
-import { useUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
-import AutoClose from "../actions/AutoClose";
-import a11yStyle from '@zohodesk/components/es/semantic/Button/semanticButton.module.css'; //style
-
-import style from "../../ToastMessage/ToastMessage.module.css";
-
-function ToastMessageUI(props) {
-  let [messageState, setMessageState] = useState(props.messageState);
-  let {
-    type,
-    subject,
-    info,
-    submitText,
-    cancelText,
-    iconName,
-    iconSize,
-    submitType,
-    isIconMid,
-    needClose,
-    iconPalette,
-    isMore,
-    message,
-    isAnimate,
-    getLeftContainer,
-    getInnerBottomContainer,
-    getBottomContainer,
-    getSubmitContainer,
-    onSubmit,
-    onCancel,
-    dataId,
-    dataSelectorId,
-    isClose,
-    onClose,
-    needAutoZindex,
-    a11y
-  } = props;
-
-  function onClickSubmit(e) {
-    onSubmit && onSubmit();
-    onClose && onClose();
-  }
-
-  function onClickCancel(e) {
-    onCancel && onCancel();
-    onClose && onClose();
-  }
-
-  function changeMessageState(e) {
-    cancelBubblingEffect(e);
-    setMessageState(!messageState);
-  }
-
-  let animateClass = isClose ? style.rightanimate : style.leftanimate;
-  let animateRemoveClass = isClose ? style.rightanimate : style.leftnoanimate;
-  let channelIcon = /*#__PURE__*/React.createElement(Icon, {
-    iconClass: style[iconPalette],
-    name: iconName,
-    size: iconSize
-  });
-  let getNextIndex = useZIndex();
-  let Zindex = isAnimate ? getNextIndex() : null,
-      getNextId = useUniqueId(),
-      titleId = getNextId(),
-      infoId = getNextId();
-  let {
-    role = 'alert',
-    ariaLive = 'assertive',
-    ariaAtomic = true,
-    ariaDescribedby = infoId,
-    ariaLabelledby = titleId
-  } = a11y;
-  return /*#__PURE__*/React.createElement(Container, {
-    className: `${style.container} ${isAnimate ? animateClass : animateRemoveClass} ${style[`alert${type}`] ? style[`alert${type}`] : ''}`,
-    isCover: false,
-    dataId: dataId,
-    style: needAutoZindex && isAnimate ? {
-      zIndex: `${Zindex}`
-    } : {},
-    role: role,
-    "aria-live": ariaLive,
-    "aria-atomic": ariaAtomic,
-    "aria-describedby": ariaDescribedby,
-    "aria-labelledby": ariaLabelledby,
-    dataSelectorId: dataSelectorId
-  }, type !== 'custom' ? /*#__PURE__*/React.createElement(Box, {
-    className: style.alertifychild,
-    flexible: true
-  }, /*#__PURE__*/React.createElement(Container, {
-    alignBox: "row",
-    className: style.alertifybanner
-  }, /*#__PURE__*/React.createElement(Box, {
-    className: style.alertleft,
-    flexible: true
-  }, /*#__PURE__*/React.createElement(Container, {
-    align: isIconMid ? 'vertical' : '',
-    alignBox: "row"
-  }, type != 'success' && !getLeftContainer ? /*#__PURE__*/React.createElement(Box, {
-    className: `${style.alertico}`
-  }, /*#__PURE__*/React.createElement("span", null, channelIcon)) : getLeftContainer ? /*#__PURE__*/React.createElement(Box, {
-    className: `${style.alertico}`
-  }, getLeftContainer()) : null, /*#__PURE__*/React.createElement(Box, {
-    flexible: true
-  }, /*#__PURE__*/React.createElement(Container, {
-    align: "vertical",
-    alignBox: "row",
-    isCover: false
-  }, type == 'success' ? /*#__PURE__*/React.createElement(Box, {
-    className: style.alertTitleLeft
-  }, channelIcon) : null, /*#__PURE__*/React.createElement(Box, {
-    className: style.alertTitle,
-    flexible: true,
-    "data-title": subject,
-    id: titleId
-  }, subject)), info ? /*#__PURE__*/React.createElement("p", {
-    className: style.alertMessage,
-    "data-title": info,
-    id: infoId
-  }, info) : null, getInnerBottomContainer ? /*#__PURE__*/React.createElement("div", null, getInnerBottomContainer()) : null), type == 'information' && needClose ? /*#__PURE__*/React.createElement(Box, {
-    className: `${a11yStyle.buttonReset} ${style.closeIconPrimary}`,
-    onClick: onClose,
-    dataId: `${dataId}_close`,
-    tagName: "button"
-  }, /*#__PURE__*/React.createElement(Icon, {
-    isBold: true,
-    name: "ZD-close",
-    size: "18"
-  })) : null)), type != 'information' ? /*#__PURE__*/React.createElement(Box, {
-    className: style.alertright
-  }, /*#__PURE__*/React.createElement(Container, {
-    className: style.alerttab
-  }, needClose ? /*#__PURE__*/React.createElement("button", {
-    className: `${a11yStyle.buttonReset} ${style.closeIcon}`,
-    onClick: onClose,
-    "data-id": `${dataId}_closeRight`,
-    "data-test-id": `${dataId}_closeRight`
-  }, /*#__PURE__*/React.createElement(Icon, {
-    name: "ZD-close",
-    size: "18"
-  })) : null, submitText ? /*#__PURE__*/React.createElement(Box, {
-    className: `${getSubmitContainer ? style.sumbitBorder : cancelText ? style.notSolo : style.mainbutton} ${getSubmitContainer ? '' : style[submitType]} `,
-    flexible: true,
-    onClick: onClickSubmit,
-    dataId: `${dataId}_submitButton`
-  }, /*#__PURE__*/React.createElement(Container, {
-    align: "vertical",
-    alignBox: "row"
-  }, getSubmitContainer ? /*#__PURE__*/React.createElement(Box, {
-    flexible: true
-  }, getSubmitContainer()) : /*#__PURE__*/React.createElement(Box, {
-    className: `${a11yStyle.buttonReset} ${style.buttonText}`,
-    flexible: true,
-    tagName: "button"
-  }, submitText))) : null, cancelText ? /*#__PURE__*/React.createElement(Box, {
-    className: `${style.cancelButton}`,
-    flexible: true,
-    onClick: onClose,
-    dataId: `${dataId}_cancelButton`
-  }, /*#__PURE__*/React.createElement(Container, {
-    align: "vertical",
-    alignBox: "row"
-  }, /*#__PURE__*/React.createElement(Box, {
-    className: `${a11yStyle.buttonReset} ${style.buttonText}`,
-    flexible: true,
-    onClick: onClickCancel,
-    dataId: `${dataId}_cancelButtonInner`,
-    tagName: "button"
-  }, cancelText), isMore ? /*#__PURE__*/React.createElement(Box, {
-    className: `${a11yStyle.buttonReset} ${style.dropdown}`,
-    onClick: changeMessageState,
-    dataId: `${dataId}_moreIcon`,
-    tagName: "button",
-    "aria-expanded": messageState ? true : false,
-    "aria-haspopup": true
-  }, /*#__PURE__*/React.createElement(Icon, {
-    name: "ZD-down",
-    size: "7"
-  })) : null)) : null)) : null)) : null, isMore ? /*#__PURE__*/React.createElement(Box, {
-    className: `${style.message} ${messageState ? '' : style.messageOff}`,
-    tagName: "p"
-  }, message) : null, getBottomContainer ? /*#__PURE__*/React.createElement(Box, null, getBottomContainer()) : null);
-}
-
-export default function ToastMessage(props) {
-  return /*#__PURE__*/React.createElement(AutoClose, { ...props,
-    Element: ToastMessageUI
-  });
-}
-ToastMessage.propTypes = propTypes;
-ToastMessage.defaultProps = defaultProps; // if (__DOCS__) {
-//   ToastMessage.docs = {
-//     componentGroup: 'Atom'
-//   };
-// }

package/es/v1/ToastMessage/props/defaultProps.js

@@ -1,18 +0,0 @@
-export const defaultProps = {
-  iconName: 'bell',
-  iconSize: '30',
-  submitType: 'primary',
-  isIconMid: false,
-  needClose: false,
-  type: 'primary',
-  isMore: false,
-  messageState: false,
-  isAnimate: true,
-  isClose: false,
-  autoClose: false,
-  hideTime: '3000',
-  dataId: 'toastMessage',
-  needAutoZindex: true,
-  a11y: {},
-  dataSelectorId: 'toastMessage'
-};

package/es/v1/ToastMessage/props/propTypes.js

@@ -1,40 +0,0 @@
-import PropTypes from 'prop-types';
-export const propTypes = {
-  autoClose: PropTypes.bool,
-  cancelText: PropTypes.string,
-  dataId: PropTypes.string,
-  dataSelectorId: PropTypes.string,
-  getBottomContainer: PropTypes.func,
-  getInnerBottomContainer: PropTypes.func,
-  getLeftContainer: PropTypes.func,
-  getSubmitContainer: PropTypes.func,
-  hideTime: PropTypes.string,
-  iconName: PropTypes.string,
-  iconPalette: PropTypes.oneOf(['successFill', 'dangerFill', 'dangerShadow', 'successPlain', 'dangerPlain', 'primaryPlain']),
-  iconSize: PropTypes.string,
-  info: PropTypes.string,
-  isAnimate: PropTypes.bool,
-  isClose: PropTypes.bool,
-  isIconMid: PropTypes.bool,
-  isMore: PropTypes.bool,
-  message: PropTypes.string,
-  messageState: PropTypes.bool,
-  needClose: PropTypes.bool,
-  onCancel: PropTypes.func,
-  onSubmit: PropTypes.func,
-  subject: PropTypes.string,
-  submitText: PropTypes.string,
-  submitType: PropTypes.oneOf(['primary', 'danger', 'success']),
-  type: PropTypes.oneOf(['primary', 'information', 'secondary', 'success', 'custom']),
-  needAutoZindex: PropTypes.bool,
-  a11y: PropTypes.shape({
-    role: PropTypes.string,
-    ariaLive: PropTypes.oneOf(['polite', 'assertive', 'off']),
-    ariaAtomic: PropTypes.bool,
-    ariaDescribedby: PropTypes.string,
-    ariaLabelledby: PropTypes.string
-  }),
-  Element: PropTypes.element,
-  onPortalClose: PropTypes.func,
-  onClose: PropTypes.func
-};

package/es/v1/Upload/Upload.js

@@ -1,69 +0,0 @@
-import React from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-import { Icon } from '@zohodesk/icons';
-import { Container, Box } from '@zohodesk/components/es/v1/Layout';
-import Image from "../Image/Image";
-import style from "../../Upload/Upload.module.css";
-export default function Upload(props) {
-  let {
-    isPreview,
-    tooltip,
-    dataId,
-    dataSelectorId,
-    progressValue,
-    onClick,
-    iconName,
-    fileSize,
-    imgSrc,
-    isPreviewType,
-    onRemove,
-    size,
-    getRef,
-    palette
-  } = props;
-  return /*#__PURE__*/React.createElement(Container, {
-    isInline: true,
-    className: `${style.container} ${style[palette]} ${style[size]} ${isPreview ? style.preview : ''}
-`,
-    dataId: dataId,
-    "data-title": tooltip,
-    isCover: false,
-    eleRef: getRef,
-    dataSelectorId: dataSelectorId
-  }, /*#__PURE__*/React.createElement(React.Fragment, null, isPreview ? /*#__PURE__*/React.createElement("div", {
-    "data-id": `${dataId}_attachLoading`,
-    "data-test-id": `${dataId}_attachLoading`,
-    className: style.loader,
-    style: {
-      width: `${progressValue}%`
-    }
-  }) : null, isPreviewType ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Image, {
-    src: imgSrc,
-    className: `${style.uploadimage} `,
-    alt: "Uploaded Image",
-    dataId: `${dataId}_fileName`
-  }), /*#__PURE__*/React.createElement("div", {
-    className: style.overlay,
-    onClick: onClick
-  })) : /*#__PURE__*/React.createElement(Box, {
-    className: style.attachInfo,
-    onClick: onClick,
-    dataId: `${dataId}_openNewTab`
-  }, /*#__PURE__*/React.createElement(Icon, {
-    name: iconName,
-    iconClass: style.fileIcon
-  }), /*#__PURE__*/React.createElement("div", {
-    className: style.attachsize
-  }, fileSize))), typeof onRemove !== 'undefined' && onRemove != null ? /*#__PURE__*/React.createElement("span", {
-    className: style.uploadclose,
-    onClick: onRemove,
-    "data-id": `${dataId}_deleteUpload`,
-    "data-test-id": `${dataId}_deleteUpload`
-  }, /*#__PURE__*/React.createElement(Icon, {
-    name: "ZD-close",
-    isBold: true
-  })) : null);
-}
-Upload.propTypes = propTypes;
-Upload.defaultProps = defaultProps;

package/es/v1/Upload/props/defaultProps.js

@@ -1,7 +0,0 @@
-export const defaultProps = {
-  size: 'medium',
-  dataId: 'upload',
-  isPreview: false,
-  palette: 'light',
-  dataSelectorId: 'upload'
-};

package/es/v1/Upload/props/propTypes.js

@@ -1,17 +0,0 @@
-import PropTypes from 'prop-types';
-export const propTypes = {
-  dataId: PropTypes.string,
-  dataSelectorId: PropTypes.string,
-  fileSize: PropTypes.string,
-  getRef: PropTypes.func,
-  iconName: PropTypes.string,
-  imgSrc: PropTypes.string,
-  isPreview: PropTypes.bool,
-  isPreviewType: PropTypes.bool,
-  onClick: PropTypes.func,
-  onRemove: PropTypes.func,
-  progressValue: PropTypes.string,
-  size: PropTypes.oneOf(['small', 'medium']),
-  tooltip: PropTypes.string,
-  palette: PropTypes.oneOf(['light', 'night'])
-};

package/es/v1/actions/AutoClose.js

@@ -1,44 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-export default function AutoClose(props) {
-  let {
-    Element,
-    isClose: givenClose,
-    onPortalClose,
-    autoClose,
-    hideTime
-  } = props;
-  let [isClose, setClose] = useState(givenClose);
-
-  function onClose(e) {
-    cancelBubblingEffect(e);
-    onPortalClose && onPortalClose();
-  }
-
-  useEffect(() => {
-    let id;
-
-    if (autoClose) {
-      id = setTimeout(() => {
-        setClose(true);
-        setTimeout(onClose, 300); // For animation
-      }, hideTime);
-    }
-
-    return () => {
-      if (autoClose) {
-        clearTimeout(id);
-      }
-    };
-  }, []);
-  let newProps = Object.assign({}, props, {
-    isClose,
-    onClose
-  });
-  return /*#__PURE__*/React.createElement(Element, { ...newProps
-  });
-}
-AutoClose.propTypes = propTypes;
-AutoClose.defaultProps = defaultProps;

package/es/v1/actions/props/defaultProps.js

@@ -1,3 +0,0 @@
-export const defaultProps = {
-  hideTime: '3000'
-};

package/es/v1/actions/props/propTypes.js

@@ -1,8 +0,0 @@
-import PropTypes from 'prop-types';
-export const propTypes = {
-  Element: PropTypes.element,
-  autoClose: PropTypes.bool,
-  hideTime: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  onPortalClose: PropTypes.func,
-  isClose: PropTypes.bool
-};

package/es/v1/alert/AlertClose/AlertClose.js

@@ -1,43 +0,0 @@
-/*** Libraries ***/
-import React, { memo } from 'react';
-import { propTypes } from "./props/propTypes";
-import { Icon } from '@zohodesk/icons';
-import { Container, Box } from '@zohodesk/components/es/v1/Layout';
-import style from "../../../version2/AlertClose/AlertClose.module.css";
-
-function AlertClose(props) {
-  let {
-    onClose,
-    dataId,
-    dataTitle,
-    type,
-    customClass
-  } = props;
-  return /*#__PURE__*/React.createElement(Container, {
-    className: `${style.close} ${type ? style[type] : ''} ${customClass ? customClass : ''}`,
-    "data-title": dataTitle,
-    onClick: onClose,
-    dataId: dataId,
-    align: "both",
-    isInline: true,
-    alignBox: "row",
-    isCover: false,
-    tabIndex: "0"
-  }, /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Icon, {
-    name: "GC-cross",
-    isBold: true,
-    size: "12",
-    iconClass: style.closeIcon
-  })));
-}
-
-AlertClose.propTypes = propTypes;
-const MemoizedAlertClose = /*#__PURE__*/memo(AlertClose);
-MemoizedAlertClose.propTypes = propTypes;
-MemoizedAlertClose.displayName = 'AlertClose';
-export default MemoizedAlertClose; // if (__DOCS__) {
-//   AlertClose.docs = {
-//     componentGroup: 'AlertClose',
-//     folderName: 'Alert'
-//   };
-// }

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

@@ -1,8 +0,0 @@
-import PropTypes from 'prop-types';
-export const propTypes = {
-  customClass: PropTypes.string,
-  dataId: PropTypes.string,
-  dataTitle: PropTypes.string,
-  onClose: PropTypes.func,
-  type: PropTypes.oneOf(['success', 'danger', 'info', 'warning', 'error', 'light'])
-};

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

@@ -1,82 +0,0 @@
-import React, { useRef } from 'react'; //AlertDependencies
-
-import { Container, Box } from '@zohodesk/components/es/v1/Layout';
-import AlertClose from "../AlertClose/AlertClose";
-import AlertIcons from "../alertIcons/AlertIcons"; //CSS
-
-import style from "../../../version2/lookup/AlertHeader/css/AlertHeaderNew.module.css";
-import cssJSLogic from "../../../version2/lookup/AlertHeader/css/cssJSLogic";
-import { mergeStyle } from '@zohodesk/utils'; //customHooks
-
-import useDragger from "../../../Hooks/Dragger/useDragger"; //Props
-
-import defaultProps from "./props/defaultProps";
-import propTypes from "./props/propTypes";
-export default function AlertHeader(props) {
-  const {
-    title,
-    needIcon,
-    onClose,
-    closeTitle,
-    children,
-    breakChildren,
-    dataId,
-    type,
-    htmlId,
-    customStyle,
-    dragBoundaryLimit,
-    renderAlertIcon
-  } = props;
-  const finalStyle = mergeStyle(style, customStyle);
-  const {
-    alertHeaderContainerClass
-  } = cssJSLogic({
-    props,
-    style: finalStyle
-  });
-  const dragRef = useRef(null); //dragRef
-
-  useDragger({
-    isActive: true,
-    ChildRef: dragRef,
-    boundaryLimit: dragBoundaryLimit
-  }); //custom Hook
-
-  return /*#__PURE__*/React.createElement(Container, {
-    align: "vertical",
-    alignBox: "row",
-    className: `${alertHeaderContainerClass}`,
-    isCover: false,
-    wrap: "wrap",
-    "data-drag-hook": "true",
-    eleRef: dragRef,
-    dataId: `${dataId}_alertHeader`
-  }, needIcon && /*#__PURE__*/React.createElement("div", {
-    className: finalStyle.iconContainer
-  }, renderAlertIcon ? renderAlertIcon() : /*#__PURE__*/React.createElement(AlertIcons, {
-    type: type
-  })), (title || children) && /*#__PURE__*/React.createElement(Box, {
-    flexible: true
-  }, /*#__PURE__*/React.createElement(Container, {
-    alignBox: "row",
-    wrap: breakChildren ? 'wrap' : null
-  }, title && /*#__PURE__*/React.createElement(Box, {
-    className: finalStyle.title,
-    shrink: true,
-    id: htmlId
-  }, title), children && /*#__PURE__*/React.createElement(Box, {
-    shrink: true,
-    adjust: true,
-    flexible: true
-  }, children))), onClose && /*#__PURE__*/React.createElement(Box, {
-    className: finalStyle.close
-  }, /*#__PURE__*/React.createElement(AlertClose, {
-    onClose: onClose,
-    dataTitle: closeTitle,
-    dataId: `${dataId}_close`,
-    type: "light"
-  })));
-} //Props
-
-AlertHeader.propTypes = propTypes;
-AlertHeader.defaultProps = defaultProps;

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

@@ -1,12 +0,0 @@
-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

@@ -1,20 +0,0 @@
-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
-};