@zohodesk/dot 1.0.0-temp-180 → 1.0.0-temp-175.7

package/es/v1/list/status/StatusDropdown/StatusDropdown.js

@@ -19,6 +19,7 @@ import { ResponsiveReceiver } from '@zohodesk/components/es/v1/Responsive/Custom
 import { useUniqueId } from '@zohodesk/components/es/v1/Provider/IdProvider';
 import btnStyle from '@zohodesk/components/es/semantic/Button/semanticButton.module.css';
 import style from '../../../../list/status/StatusDropdown/StatusDropdown.module.css';
+
 function StatusDropdown(props) {
   let {
     value,
@@ -88,40 +89,49 @@ function StatusDropdown(props) {
   let isPopupOpen = needExternalPopupState ? isPopupActive && isOpen : isOpen;
   let containerClass = `${className ? className : ''} ${isPopupReady ? activeStyle ? activeStyle : '' : showIconOnHover ? style.hoverIcon : ''} ${isDisabled ? commonStyle.disabled : isReadOnly ? style.readOnly : !isEditable ? style.cursorDefault : !showOnHover ? `${style.cursor} ${hoverStyle ? hoverStyle : ''}` : `${hoverStyle ? hoverStyle : ''} ${style.cursorDefault}`}`;
   let ariaTitleId = getAriaId();
+
   function emptySearchSVG() {
     return /*#__PURE__*/React.createElement(EmptySearch, {
       size: "small"
     });
   }
+
   function handleInputRef(el) {
     hiddenInput.current = el;
   }
+
   function itemRef(ele, index, id) {
     dropdown.current[`suggestion_${id}`] = ele;
   }
+
   function searchInputRef(el) {
     searchInput.current = el;
   }
+
   function handleTogglePopup(e) {
     !isPopupOpen && onSelectLabel && onSelectLabel(e);
     onTogglePopup && onTogglePopup(isPopupOpen);
     togglePopup(e, boxPosition);
   }
+
   function scrollContentRef(el) {
     if (isPopupOpen) {
       optionsContainer.current = el;
     }
   }
+
   function onSelect(element, e) {
     onClick && onClick(e, element);
     onTogglePopup && onTogglePopup(isPopupOpen);
     togglePopup(e);
   }
+
   function handleKeyDown(e) {
     let {
       keyCode
     } = e;
     let totalIndex = optionsList.length;
+
     if (isPopupReady && (keyCode === 38 || keyCode === 40) && e.preventDefault) {
       e.preventDefault(); //prevent body scroll
     }
@@ -135,21 +145,27 @@ function StatusDropdown(props) {
             if (selectedIndex === totalIndex - 3) {
               isNextOptions && getNextOptions && getNextOptions();
             }
+
             setSelectedIndex(selectedIndex + 1);
           }
+
           break;
+
         case 38:
           if (selectedIndex === 0) {
             setSelectedIndex(totalIndex - 1);
           } else {
             setSelectedIndex(selectedIndex - 1);
           }
+
           break;
+
         case 13:
           onClick && onClick(optionsList[selectedIndex].name, e);
           onTogglePopup && onTogglePopup(isPopupOpen);
           togglePopup(e, boxPosition);
           break;
+
         default:
           break;
       }
@@ -159,29 +175,35 @@ function StatusDropdown(props) {
       }
     }
   }
+
   function searchList(value) {
     let foptions = options.filter(dept => dept[keyName].toLowerCase().indexOf(value.toLowerCase()) != -1);
     return foptions;
   }
+
   function handleChange(value, e) {
     let foptions = searchList(value);
     setSearchString(value);
     setSelectedIndex(-1);
     setOptionsList(foptions);
   }
+
   function onSearchClear() {
     let foptions = searchList('');
     setSearchString('');
     setOptionsList(foptions);
   }
+
   function handleMouseEnter(id, value, index, e) {
     setSelectedIndex(index);
   }
+
   function handleScroll(e) {
     if (e.target.scrollTop + e.target.offsetHeight > e.target.scrollHeight - 1) {
       isNextOptions && getNextOptions && getNextOptions(e);
     }
   }
+
   function responsiveFunc(_ref) {
     let {
       mediaQueryOR
@@ -192,6 +214,7 @@ function StatusDropdown(props) {
       }])
     };
   }
+
   useEffectCallOnlyAfterState(() => {
     setOptionsList(options);
   }, [options.length]);
@@ -203,6 +226,7 @@ function StatusDropdown(props) {
     let option = mergeOptions[selectedIndex];
     let id = option && option[idName] || {};
     let selSuggestion = dropdown.current[`suggestion_${id}`];
+
     if (isPopupOpen) {
       optionsContainer.current && scrollTo(optionsContainer.current, selSuggestion);
       onSearchClear();
@@ -341,6 +365,7 @@ function StatusDropdown(props) {
     }, /*#__PURE__*/React.createElement(Loader, null)))));
   }) : null);
 }
+
 StatusDropdown.defaultProps = defaultProps;
 StatusDropdown.propTypes = propTypes;
 const StatusDropdown_Component = Popup(StatusDropdown);

package/es/v1/list/status/StatusListItem/StatusListItem.js

@@ -1,13 +1,16 @@
 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); }
+
 /**** Libraries ****/
 import React, { useRef } from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
 /**** Components ****/
+
 import { Icon } from '@zohodesk/icons';
 import CssProvider from '@zohodesk/components/es/v1/Provider/CssProvider';
 /**** CSS ****/
+
 import style from '../../../../list/status/StatusListItem/StatusListItem.module.css';
 export default function StatusListItem(props) {
   let {
@@ -40,21 +43,27 @@ export default function StatusListItem(props) {
     ariaSelected,
     ariaHidden = true
   } = a11y;
+
   if (isLink) {
     options.href = href;
     options.target = `_${target}`;
   }
+
   const element = useRef(null);
+
   function getReference(ele) {
     element.current = ele;
     getRef && getRef(element.current, index, id);
   }
+
   function handleClick(e) {
     onClick && onClick(id, value, index, e);
   }
+
   function handleMouseEnter(e) {
     onMouseEnter && onMouseEnter(id, value, index, e);
   }
+
   return /*#__PURE__*/React.createElement(Container, _extends({
     role: role,
     "aria-selected": ariaSelected,

package/es/v1/lookup/EmptyPage/EmptyPage.js

@@ -7,34 +7,41 @@ import EmptyAccounts from '@zohodesk/svg/lib/emptystate/version3/EmptyAccounts';
 import EmptyContact from '@zohodesk/svg/lib/emptystate/version3/EmptyContact';
 import EmptyProducts from '@zohodesk/svg/lib/emptystate/version3/EmptyProducts';
 /*** CSS ***/
+
 import style from '../../../lookup/EmptyPage/LookupEmptyPage.module.css';
 export default function EmptyPage(props) {
   let {
     type,
     title
   } = props;
+
   function renderEmptyState(type) {
     switch (type) {
       case 'search':
         return /*#__PURE__*/React.createElement(EmptySearch, {
           className: style.image
         });
+
       case 'account':
         return /*#__PURE__*/React.createElement(EmptyAccounts, {
           className: style.image
         });
+
       case 'contact':
         return /*#__PURE__*/React.createElement(EmptyContact, {
           className: style.image
         });
+
       case 'product':
         return /*#__PURE__*/React.createElement(EmptyProducts, {
           className: style.image
         });
+
       default:
         return null;
     }
   }
+
   return /*#__PURE__*/React.createElement("div", {
     className: style.container,
     "data-id": `empty_${type}`,

package/es/v1/lookup/Lookup/Lookup.js

@@ -3,15 +3,16 @@ import React, { useRef, useCallback, useEffect } from 'react';
 import { useEffectCallOnlyAfterState } from '@zohodesk/hooks';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
-
 /*** Components ***/
+
 import FreezeLayer from '../../../FreezeLayer/FreezeLayer';
 import { Container } from '@zohodesk/components/es/v1/Layout';
 import FocusScope from '@zohodesk/a11y/es/FocusScope/FocusScope';
-
 /*** CSS ***/
+
 import style from '../../../lookup/Lookup/Lookup.module.css';
 /*eslint-disable react/forbid-component-props */
+
 export default function Lookup(props) {
   const {
     isActive,
@@ -105,9 +106,7 @@ export default function Lookup(props) {
   }, content) : content));
 }
 Lookup.propTypes = propTypes;
-Lookup.defaultProps = defaultProps;
-
-// if (__DOCS__) {
+Lookup.defaultProps = defaultProps; // if (__DOCS__) {
 //   Lookup.docs = {
 //     componentGroup: 'Lookup'
 //   };

package/es/v1/lookup/header/Close/Close.js

@@ -2,9 +2,10 @@
 import React, { memo } from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
-
 /*** FontIcons ***/
+
 import IconButton from './../../../IconButton/IconButton';
+
 function Close(props) {
   let {
     onClose,
@@ -19,6 +20,7 @@ function Close(props) {
     title: title
   });
 }
+
 Close.propTypes = propTypes;
 Close.defaultProps = defaultProps;
 const MemoizedClose = /*#__PURE__*/memo(Close);

package/es/v1/lookup/header/ModuleHeader/ModuleHeader.js

@@ -2,18 +2,17 @@
 import React, { memo, useRef } from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
-
 /*** Components ***/
+
 import Title from '../Title/Title';
 import Close from '../Close/Close';
 import Search from '../Search/Search';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
-
 /*** CSS ***/
+
 import commonStyle from '../../../../lookup/header/lookupHeaderCommon.module.css';
 import commonResponsive from '../../../../lookup/header/lookupHeaderCommonResponsive.module.css';
 import useDragger from '../../../../Hooks/Dragger/useDragger';
-
 /*eslint-disable react/forbid-component-props */
 
 function ModuleHeader(props) {
@@ -37,6 +36,7 @@ function ModuleHeader(props) {
     childNearTitle
   } = props;
   const dragRef = useRef(null); //dragRef
+
   useDragger({
     isActive: true,
     ChildRef: dragRef,
@@ -79,6 +79,7 @@ function ModuleHeader(props) {
     title: closeTitle
   })) : null);
 }
+
 ModuleHeader.propTypes = propTypes;
 ModuleHeader.defaultProps = defaultProps;
 const MemoizedModuleHeader = /*#__PURE__*/memo(ModuleHeader);

package/es/v1/lookup/header/Search/Search.js

@@ -1,22 +1,23 @@
 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); }
+
 /* eslint-disable react/forbid-component-props */
 
 /*** Libraries ***/
 import React, { useState } from 'react';
 import { SearchUI_defaultProps } from './props/defaultProps';
 import { Search_propTypes, SearchUI_propTypes } from './props/propTypes';
-
 /** * Components ** */
+
 import TextBoxIcon from '@zohodesk/components/es/v1/TextBoxIcon/TextBoxIcon';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
 import { Icon } from '@zohodesk/icons';
 import ToggleDropDown from '../../../../dropdown/ToggleDropDown/ToggleDropDown';
-
 /** * Methods ** */
+
 import { debounce } from '@zohodesk/components/es/utils/debounce';
 import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
-
 /** * CSS ** */
+
 import style from '../../../../lookup/header/Search/LookupSearch.module.css';
 export default function Search(props) {
   const {
@@ -30,24 +31,30 @@ export default function Search(props) {
   } = props;
   const [isFocus, setFocus] = useState(false);
   const [isDropDownOpen, setDropDownOpen] = useState(false);
+
   const handleDropDownOpen = () => {
     setDropDownOpen(true);
   };
+
   const handleDropDownClose = () => {
     setDropDownOpen(false);
   };
+
   const handleTextBoxFocus = e => {
     setFocus(true);
     onFocus && onFocus(e);
   };
+
   const handleTextBoxBlur = e => {
     setFocus(false);
     onBlur && onBlur(e);
   };
+
   const handleGetTextBoxRef = el => {
     // textBox = el;
     getRef && getRef(el);
   };
+
   const searchUIExtraProps = {
     isFocus: isFocus || isDropDownOpen,
     onFocus: handleTextBoxFocus,
@@ -67,6 +74,7 @@ export default function Search(props) {
   }, /*#__PURE__*/React.createElement(SearchUI, _extends({}, props, searchUIExtraProps))) : /*#__PURE__*/React.createElement(SearchUI, _extends({}, props, searchUIExtraProps));
 }
 Search.propTypes = Search_propTypes;
+
 function SearchUI(props) {
   const {
     dataId,
@@ -86,28 +94,35 @@ function SearchUI(props) {
     onKeyDown,
     onChange
   } = props;
+
   const handleSearch = () => {
     onSearch && onSearch();
   };
+
   const debounceHandleSearch = debounce(handleSearch, 500);
+
   const handleKeyDown = e => {
     const {
       keyCode
     } = e;
     onKeyDown && onKeyDown(e);
+
     if (keyCode === 13) {
       !needOnTypeSearch && onSearch && onSearch();
     }
   };
+
   const handleChange = value => {
     onChange && onChange(value);
     needOnTypeSearch && debounceHandleSearch();
   };
+
   const handleClear = e => {
     cancelBubblingEffect(e);
     onChange && onChange('');
     debounceHandleSearch();
   };
+
   return /*#__PURE__*/React.createElement(Container, {
     isCover: false,
     alignBox: "row",
@@ -157,5 +172,6 @@ function SearchUI(props) {
     onClearMouseDown: cancelBubblingEffect
   })));
 }
+
 SearchUI.defaultProps = SearchUI_defaultProps;
 SearchUI.propTypes = SearchUI_propTypes;

package/es/v1/lookup/header/TicketHeader/TicketHeader.js

@@ -2,19 +2,18 @@
 import React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
-
 /*** Components ***/
+
 import Title from '../Title/Title';
 import Close from '../Close/Close';
 import Search from '../Search/Search';
 import ViewDropDown from '../../../../lookup/header/ViewDropDown/ViewDropDown';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
-
 /*** CSS ***/
+
 import commonStyle from '../../../../lookup/header/lookupHeaderCommon.module.css';
 import commonResponsive from '../../../../lookup/header/lookupHeaderCommonResponsive.module.css';
 import style from '../../../../lookup/header/TicketHeader/TicketHeader.module.css';
-
 /* eslint-disable react/forbid-component-props */
 
 export default function TicketHeader(props) {

package/es/v1/lookup/header/Title/Title.js

@@ -2,9 +2,10 @@
 import React, { memo } from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
-
 /*** CSS ***/
+
 import style from '../../../../lookup/header/Title/LookupTitle.module.css';
+
 function Title(props) {
   let {
     text,
@@ -16,6 +17,7 @@ function Title(props) {
     "data-title": text
   }, text);
 }
+
 Title.propTypes = propTypes;
 Title.defaultProps = defaultProps;
 const MemoizedTitle = /*#__PURE__*/memo(Title);

package/es/v1/lookup/header/ViewDropDown/ViewDropDown.js

@@ -2,8 +2,8 @@
 import React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
-
 /**** Components ****/
+
 import { SelectComponent } from '@zohodesk/components/es/v1/Select/Select';
 import Popup from '@zohodesk/components/es/v1/Popup/Popup';
 import ListItem from '@zohodesk/components/es/v1/ListItem/ListItem';
@@ -11,14 +11,14 @@ import DropDownSearch from '@zohodesk/components/es/v1/DropDown/DropDownSearch';
 import { Card, CardHeader, CardContent } from '@zohodesk/components/es/v1/Card';
 import ResponsiveDropBox from '@zohodesk/components/es/v1/ResponsiveDropBox/ResponsiveDropBox';
 import { ResponsiveReceiver } from '@zohodesk/components/es/v1/Responsive/CustomResponsive';
-
 /**** Icons ****/
+
 import { Icon } from '@zohodesk/icons';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
 import Loader from '@zohodesk/svg/lib/Loader/Loader';
 import style from '../../../../lookup/header/ViewDropDown/ViewDropDown.module.css';
-
 /* eslint-disable react/forbid-component-props */
+
 /*eslint-disable  react/sort-prop-types*/
 
 class DropDown extends SelectComponent {
@@ -26,16 +26,19 @@ class DropDown extends SelectComponent {
     super(props);
     this.onSearchKeyDown = this.onSearchKeyDown.bind(this);
   }
+
   onSearchKeyDown(e) {
     const {
       closePopupOnly
     } = this.props;
+
     if (e.keyCode === 27) {
       closePopupOnly && closePopupOnly(e);
     } else {
       this.handleKeyDown(e);
     }
   }
+
   responsiveFunc(_ref) {
     let {
       mediaQueryOR
@@ -46,8 +49,10 @@ class DropDown extends SelectComponent {
       }])
     };
   }
+
   render() {
     var _this = this;
+
     const {
       needSearch,
       dropBoxSize,
@@ -154,18 +159,19 @@ class DropDown extends SelectComponent {
       }, emptyMessage)))));
     }) : null);
   }
+
 }
+
 DropDown.propTypes = propTypes;
 DropDown.defaultProps = defaultProps;
 const ViewDropDown = Popup(DropDown);
 ViewDropDown.defaultProps = DropDown.defaultProps;
-ViewDropDown.propTypes = DropDown.propTypes;
-
-// if (__DOCS__) {
+ViewDropDown.propTypes = DropDown.propTypes; // if (__DOCS__) {
 //   DropDown.docs = {
 //     componentGroup: 'Lookup'
 //   };
 //   // eslint-disable-next-line react/forbid-foreign-prop-types
 //   ViewDropDown.propTypes = DropDown.propTypes;
 // }
+
 export default ViewDropDown;

package/es/v1/lookup/header/ViewDropDown/props/propTypes.js

@@ -5,6 +5,7 @@ export const propTypes = {
   searchBoxPlaceHolder: PropTypes.string,
   searchEmptyMessage: PropTypes.string,
   dropBoxSize: PropTypes.oneOf(['small', 'medium', 'large']),
+
   /**** Popup props ****/
   isPopupOpen: PropTypes.bool,
   isPopupReady: PropTypes.bool,

package/es/v1/notification/DesktopNotification/DesktopNotification.js

@@ -1,4 +1,5 @@
 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 defaultProps from './props/defaultProps';
 import { propTypes, DesktopNotificationUI_propTypes } from './props/propTypes';
@@ -76,18 +77,22 @@ export function DesktopNotificationUI(props) {
   let {
     ExtraProps = {}
   } = customProps;
+
   function onClickSubmit(e) {
     onSubmit && onSubmit();
   }
+
   function onClickCancel(e) {
     onCancel && onCancel();
   }
+
   let animateClass = isClose ? style.rightanimate : style.leftanimate;
   let animateRemoveClass = isClose ? style.rightanimate : style.leftnoanimate;
   let getNextIndex = useZIndex();
   let Zindex = isAnimate ? getNextIndex() : null;
   let uiVariantOne = title && (info || secondaryInfo);
   let uiVariantTwo = title && !(info || secondaryInfo) && !getSectionContainer;
+
   function responsiveFunc(_ref) {
     let {
       mediaQueryOR
@@ -98,6 +103,7 @@ export function DesktopNotificationUI(props) {
       }])
     };
   }
+
   return /*#__PURE__*/React.createElement("div", {
     className: style.parentElement,
     style: needAutoZindex && isAnimate ? {
@@ -177,9 +183,7 @@ export default function DesktopNotification(props) {
   }));
 }
 DesktopNotification.propTypes = propTypes;
-DesktopNotification.defaultProps = defaultProps;
-
-// if (__DOCS__) {
+DesktopNotification.defaultProps = defaultProps; // if (__DOCS__) {
 //   DesktopNotification.docs = {
 //     componentGroup: 'DesktopNotification',
 //     folderName: 'Alert'

package/es/v1/notification/DesktopNotificationHeader/DesktopNotificationHeader.js

@@ -20,6 +20,7 @@ export default function DesktopNotificationHeader(props) {
     needClose,
     responsiveId
   } = props;
+
   function responsiveFunc(_ref) {
     let {
       mediaQueryOR
@@ -30,6 +31,7 @@ export default function DesktopNotificationHeader(props) {
       }])
     };
   }
+
   return /*#__PURE__*/React.createElement(Container, {
     align: "vertical",
     alignBox: "row",
@@ -81,9 +83,7 @@ export default function DesktopNotificationHeader(props) {
   }));
 }
 DesktopNotificationHeader.propTypes = propTypes;
-DesktopNotificationHeader.defaultProps = defaultProps;
-
-// if (__DOCS__) {
+DesktopNotificationHeader.defaultProps = defaultProps; // if (__DOCS__) {
 //   DesktopNotificationHeader.docs = {
 //     componentGroup: 'DesktopNotificationHeader',
 //     folderName: 'Alert'

package/es/v1/setup/header/Search/Search.js

@@ -17,16 +17,20 @@ export default function Search(props) {
   } = props;
   let [isFocus, setIsFocus] = useState(false);
   let [resetValue] = useState(value || '');
+
   const handleFocus = (id, name, value) => {
     setIsFocus(true);
     onFocus && onFocus(id, name, value);
   };
+
   const handleBlur = (id, name, value) => {
     if (resetValue == '') {
       setIsFocus(false);
     }
+
     onBlur && onBlur(id, name, value);
   };
+
   return /*#__PURE__*/React.createElement("div", {
     className: `${style.container} ${isFocus ? style.active : ''} ${customClass}`
   }, /*#__PURE__*/React.createElement(TextBox, {

package/es/v1/setup/helptips/Link/Link.js

@@ -9,6 +9,7 @@ export default function Link(props) {
     onClick,
     isDangerous = false
   } = props;
+
   if (isDangerous) {
     return /*#__PURE__*/React.createElement("div", {
       className: style.container,
@@ -18,6 +19,7 @@ export default function Link(props) {
       }
     });
   }
+
   return /*#__PURE__*/React.createElement(ExternalLink, {
     href: url,
     onClick: onClick,