@zohodesk/dot 1.9.11 → 1.9.13

package/es/AttachmentViewer/props/defaultProps.js

@@ -1,3 +1,4 @@
+import { DUMMY_OBJECT } from "../../utils/General";
 export const AttachmentImage_defaultProps = {
   dataId: 'AttachmentImage',
   customClass: {
@@ -11,6 +12,7 @@ export const AttachmentViewer_defaultProps = {
   maintainZoom: false,
   isActive: false,
   dataId: 'AttachmentViewer',
-  i18nKeys: {},
-  customProps: {}
+  i18nKeys: DUMMY_OBJECT,
+  customProps: DUMMY_OBJECT,
+  hasCount: true
 };

package/es/AttachmentViewer/props/propTypes.js

@@ -2,6 +2,9 @@ import PropTypes from 'prop-types';
 import { propTypes as AvatarProps } from '@zohodesk/components/es/Avatar/props/propTypes';
 export const AttachmentImage_propTypes = {
   alt: PropTypes.string,
+  imageRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.any
+  })]),
   customClass: PropTypes.shape({
     customImageClass: PropTypes.string,
     customChildrenClass: PropTypes.string
@@ -29,7 +32,7 @@ export const AttachmentViewer_propTypes = {
     showText: PropTypes.string,
     previewUnsupportedText: PropTypes.string
   }),
-  needDownload: PropTypes.string,
+  needDownload: PropTypes.bool,
   previewObj: PropTypes.object,
   responsiveId: PropTypes.string,
   maintainZoom: PropTypes.bool,
@@ -42,7 +45,11 @@ export const AttachmentViewer_propTypes = {
     document: PropTypes.arrayOf(PropTypes.string)
   }),
   renderUnSupportedElement: PropTypes.func,
+  renderCustomImagePreviewElement: PropTypes.func,
   customProps: PropTypes.shape({
     avatarProps: PropTypes.exact(AvatarProps)
-  })
+  }),
+  hasCount: PropTypes.bool,
+  renderCustomIcons: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
+  onSelectedAttachmentChange: PropTypes.func
 };

package/es/AttachmentViewer/utils.js

@@ -175,13 +175,12 @@ export const SUPPORTED_FILE_EXTENSIONS = {
   exe: ['exe'],
   event: ['ics']
 };
-export function checkFileSourcesValidation(_ref) {
-  let {
-    fileName,
-    viewURL,
-    previewUrl,
-    allowedPreviewExtensionsData
-  } = _ref;
+export function checkFileSourcesValidation({
+  fileName,
+  viewURL,
+  previewUrl,
+  allowedPreviewExtensionsData
+}) {
   const extension = (getExtensionFromFileName(fileName) || '').toLowerCase();
 
   if (!extension) {

package/es/AudioPlayer/utils/utils.js

@@ -1,14 +1,11 @@
-export function openInNewTabWithNoopener(url) {
-  let targetnName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '_blank';
+export function openInNewTabWithNoopener(url, targetnName = '_blank') {
   const aTag = document.createElement('a');
   aTag.rel = 'noopener noreferrer';
   aTag.target = targetnName;
   aTag.href = url;
   aTag.click();
 }
-export function addLeadingZeros(number) {
-  let desiredLength = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '2';
-
+export function addLeadingZeros(number, desiredLength = '2') {
   if (typeof number !== 'undefined') {
     number = `${number}`;
     desiredLength = Number(desiredLength);

package/es/DotProvider/hooks/useDotProvider.js

@@ -11,21 +11,20 @@ import '@zohodesk/variables/es/fontWeightVariables.module.css';
 import '@zohodesk/components/es/common/boxShadow.module.css';
 import "../../common/dot_boxShadow.module.css";
 
-function useDotProvider(_ref) {
-  let {
-    themeAppearance,
-    themeColor,
-    baseZoomUnit,
-    baseFontUnit,
-    getProviderElement,
-    zoomUnitVariable,
-    fontUnitVariable,
-    excludeFeatures,
-    themeAppearanceAttr,
-    themeColorAttr,
-    onAssetsDownloadSuccess,
-    getAssetsPromises
-  } = _ref;
+function useDotProvider({
+  themeAppearance,
+  themeColor,
+  baseZoomUnit,
+  baseFontUnit,
+  getProviderElement,
+  zoomUnitVariable,
+  fontUnitVariable,
+  excludeFeatures,
+  themeAppearanceAttr,
+  themeColorAttr,
+  onAssetsDownloadSuccess,
+  getAssetsPromises
+}) {
   const assetsPromises = useDownloadAssetsAndSetAttr({
     themeAppearance,
     themeColor,

package/es/DotProvider/hooks/useDownloadAssetsAndSetAttr.js

@@ -3,19 +3,18 @@ import { getThemeAppearanceAssetPromise } from "../utils/assetPromiseHandlers/th
 import { getThemeColorAssetPromise } from "../utils/assetPromiseHandlers/themeColorAssetPromise.js";
 import { getFontSizeAssetPromise } from "../utils/assetPromiseHandlers/fontSizeAssetPromise.js";
 import { getZoomSizeAssetPromise } from "../utils/assetPromiseHandlers/zoomSizeAssetPromise.js";
-export default function useDownloadAssetsAndSetAttr(_ref) {
-  let {
-    themeAppearance,
-    themeColor,
-    baseZoomUnit,
-    baseFontUnit,
-    getProviderElement,
-    zoomUnitVariable,
-    fontUnitVariable,
-    excludeFeatures,
-    themeAppearanceAttr,
-    themeColorAttr
-  } = _ref;
+export default function useDownloadAssetsAndSetAttr({
+  themeAppearance,
+  themeColor,
+  baseZoomUnit,
+  baseFontUnit,
+  getProviderElement,
+  zoomUnitVariable,
+  fontUnitVariable,
+  excludeFeatures,
+  themeAppearanceAttr,
+  themeColorAttr
+}) {
   const excluded = useMemo(() => new Set(excludeFeatures), [excludeFeatures]);
   const needTheme = !excluded.has('theme');
   const needZoom = !excluded.has('zoom');

package/es/DotProvider/props/defaultProps.js

@@ -1,5 +1,5 @@
 import { THEME_APPEARANCE_LIGHT, THEME_COLOR_BLUE } from "../utils/constants";
-import { DUMMY_ARRAY } from '@zohodesk/utils';
+import { DUMMY_ARRAY } from '@zohodesk/utils/es/constantProps/constant';
 export const defaultProps = {
   themeAppearance: THEME_APPEARANCE_LIGHT,
   themeColor: THEME_COLOR_BLUE,

package/es/DotProvider/utils/assetPromiseHandlers/themeAppearanceAssetPromise.js

@@ -2,10 +2,9 @@ import { getAssetsImportPromises } from "../getAssetsImportPromises";
 import { themeAppearanceImports, themeAppearanceMapping } from "../themeAppearanceAssetsConfig";
 import { validateAndLogError } from "../errorValidation";
 import { LIBRARIES, THEME_APPEARANCES } from "../constants";
-export function getThemeAppearanceAssetPromise(_ref) {
-  let {
-    themeAppearance
-  } = _ref;
+export function getThemeAppearanceAssetPromise({
+  themeAppearance
+}) {
   const isError = validateAndLogError({
     options: THEME_APPEARANCES,
     value: themeAppearance,

package/es/DotProvider/utils/assetPromiseHandlers/themeColorAssetPromise.js

@@ -2,11 +2,10 @@ import { getAssetsImportPromises } from "../getAssetsImportPromises";
 import { themeColorImports, themeColorMapping } from "../themeColorAssetsConfig";
 import { validateAndLogError } from "../errorValidation";
 import { LIBRARIES, THEME_COLORS } from "../constants";
-export function getThemeColorAssetPromise(_ref) {
-  let {
-    themeAppearance,
-    themeColor
-  } = _ref;
+export function getThemeColorAssetPromise({
+  themeAppearance,
+  themeColor
+}) {
   const isError = validateAndLogError({
     options: THEME_COLORS,
     value: themeColor,

package/es/DotProvider/utils/errorValidation.js

@@ -1,10 +1,9 @@
 import { THEME_APPEARANCES, THEME_COLORS } from "./constants";
-export function validateAndLogError(_ref) {
-  let {
-    options,
-    value,
-    type
-  } = _ref;
+export function validateAndLogError({
+  options,
+  value,
+  type
+}) {
   let isError = !options.includes(value);
 
   if (isError) {

package/es/DotProvider/utils/getAssetsImportPromises.js

@@ -1,8 +1,7 @@
-export function getAssetsImportPromises(_ref) {
-  let {
-    assetImportKeys,
-    assetImports
-  } = _ref;
+export function getAssetsImportPromises({
+  assetImportKeys,
+  assetImports
+}) {
   const promises = [];
   assetImportKeys.forEach(importKey => {
     const assetURL = assetImports[importKey];

package/es/Drawer/Drawer.js

@@ -210,10 +210,9 @@ export default class Drawer extends React.Component {
     }, content) : content);
   }
 
-  responsiveFunc(_ref) {
-    let {
-      mediaQueryOR
-    } = _ref;
+  responsiveFunc({
+    mediaQueryOR
+  }) {
     return {
       uptoTablet: mediaQueryOR([{
         maxWidth: 768
@@ -243,10 +242,9 @@ export default class Drawer extends React.Component {
     return /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: this.responsiveFunc,
       responsiveId: responsiveId
-    }, _ref2 => {
-      let {
-        uptoTablet
-      } = _ref2;
+    }, ({
+      uptoTablet
+    }) => {
       let styleByResolutions = `${subDrawerClass} ${style.secondDrawer} ${uptoTablet ? `${style.secondMobDrawer} ${style.mbleSize}` : `${style[subDrawerSize]}`} `;
       return needFreeze ? /*#__PURE__*/React.createElement(FreezeLayer, {
         onClick: onClose,

package/es/FreezeLayer/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 {
     zIndex,
     palette,

package/es/Hooks/Dragger/useDragger.js

@@ -9,12 +9,11 @@ import defaultProps from "./props/defaultProps";
 import propTypes from "./props/propTypes"; //CSS
 
 import style from "./css/Dragger.module.css";
-export default function useDragger(_ref) {
-  let {
-    isActive,
-    ChildRef,
-    boundaryLimit = getDotLibraryConfig('boundaryLimit')
-  } = _ref;
+export default function useDragger({
+  isActive,
+  ChildRef,
+  boundaryLimit = getDotLibraryConfig('boundaryLimit')
+}) {
   const draggableEle = useRef(null);
   const parentEle = useRef(null);
   const offset = useRef({

package/es/Hooks/Dragger/utils/DraggerUtil.js

@@ -1,11 +1,10 @@
-export function DragPosCalc(_ref) {
-  let {
-    x,
-    y,
-    element,
-    dragWrapper,
-    boundaryLimit
-  } = _ref;
+export function DragPosCalc({
+  x,
+  y,
+  element,
+  dragWrapper,
+  boundaryLimit
+}) {
   let {
     top,
     left,

package/es/Hooks/useFreezeLayer.js

@@ -1,11 +1,10 @@
 import React, { useRef, useState, useEffect } from 'react';
 import { isTextSelected, cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
 import { getDotLibraryConfig } from "../Provider/Config";
-export default function useFreezeLayer(_ref) {
-  let {
-    isActive: propsActive,
-    onClick
-  } = _ref;
+export default function useFreezeLayer({
+  isActive: propsActive,
+  onClick
+}) {
   const [isActive, setActive] = useState(propsActive);
   const [isChildActive, setChildActive] = useState(false);
   let isFreezeLayerEnabled = useRef(false);

package/es/Link/Link.js

@@ -61,7 +61,8 @@ export default class Link extends React.Component {
       rel,
       dataId,
       customProps,
-      ariaLabel
+      ariaLabel,
+      downloadName
     } = this.props;
     let {
       isLink,
@@ -71,10 +72,10 @@ export default class Link extends React.Component {
     let option = {};
 
     if (download) {
-      option.download = true;
+      option.download = downloadName || true;
     }
 
-    let ignoreKeys = ['children', 'href', 'target', 'urlData', 'urlName', 'className', 'title', 'download', 'rel', 'dataId', 'hasReload', 'customProps', 'option', 'ariaLabel'];
+    let ignoreKeys = ['children', 'href', 'target', 'urlData', 'urlName', 'className', 'title', 'download', 'downloadName', 'rel', 'dataId', 'hasReload', 'customProps', 'option', 'ariaLabel'];
     let others = Object.keys(this.props).filter(key => ignoreKeys.indexOf(key) == -1).reduce((res, key) => {
       res[key] = this.props[key];
       return res;

package/es/Link/props/propTypes.js

@@ -13,6 +13,7 @@ export const propTypes = {
   customProps: PropTypes.object,
   onClick: PropTypes.func,
   download: PropTypes.bool,
+  downloadName: PropTypes.string,
   ariaLabel: PropTypes.string,
   key: PropTypes.string
 };

package/es/Onboarding/CarouselDots/CarouselDots.js

@@ -5,38 +5,35 @@ import { defaultProps } from "./props/defaultProps";
 import CarouselDot from "./CarouselDot/CarouselDot";
 import style from "./css/CarouselDots.module.css";
 
-const CarouselDots = _ref => {
-  let {
-    sliderDetails,
-    currentSliderIndex,
-    isAnimationPaused,
-    onClick,
-    onMouseEnter,
-    onMouseLeave,
-    testId,
-    customId
-  } = _ref;
-  return /*#__PURE__*/React.createElement(Flex, {
-    $ui_displayMode: "flex",
-    $ui_alignItems: "center",
-    $ui_className: style.btnCnt,
-    $ui_justifyContent: "center",
-    $tagAttributes_container: {
-      onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave
-    },
-    customId: customId,
-    testId: testId
-  }, sliderDetails.map((data, index) => /*#__PURE__*/React.createElement(CarouselDot, {
-    key: data.tabName,
-    isActive: index === currentSliderIndex,
-    isAnimationPaused: isAnimationPaused,
-    onClick: onClick,
-    index: index,
-    customId: customId + '_' + index,
-    testId: testId + '_' + index
-  })));
-};
+const CarouselDots = ({
+  sliderDetails,
+  currentSliderIndex,
+  isAnimationPaused,
+  onClick,
+  onMouseEnter,
+  onMouseLeave,
+  testId,
+  customId
+}) => /*#__PURE__*/React.createElement(Flex, {
+  $ui_displayMode: "flex",
+  $ui_alignItems: "center",
+  $ui_className: style.btnCnt,
+  $ui_justifyContent: "center",
+  $tagAttributes_container: {
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave
+  },
+  customId: customId,
+  testId: testId
+}, sliderDetails.map((data, index) => /*#__PURE__*/React.createElement(CarouselDot, {
+  key: data.tabName,
+  isActive: index === currentSliderIndex,
+  isAnimationPaused: isAnimationPaused,
+  onClick: onClick,
+  index: index,
+  customId: customId + '_' + index,
+  testId: testId + '_' + index
+})));
 
 CarouselDots.propTypes = propTypes;
 CarouselDots.defaultProps = defaultProps;

package/es/Onboarding/Onboarding.js

@@ -33,30 +33,29 @@ import { DUMMY_OBJECT } from "../utils/General";
 
 import defaultStyle from "./css/Onboarding.module.css";
 
-const Onboarding = _ref => {
-  let {
-    hasCloseIcon,
-    onClose,
-    ribbonText,
-    hasRibbon,
-    videoLookupCloseText,
-    customStyle,
-    sliderData,
-    isAutoPlayAnimation,
-    hasBouncAnimationOnMount,
-    customId,
-    testId,
-    hasExpandedButton,
-    onPrimaryButtonClick,
-    onSecondaryButtonClick,
-    customProps,
-    tagAttributes,
-    a11yAttributes,
-    closeIconTooltip,
-    dragBoundaryLimit,
-    isDraggable,
-    position
-  } = _ref;
+const Onboarding = ({
+  hasCloseIcon,
+  onClose,
+  ribbonText,
+  hasRibbon,
+  videoLookupCloseText,
+  customStyle,
+  sliderData,
+  isAutoPlayAnimation,
+  hasBouncAnimationOnMount,
+  customId,
+  testId,
+  hasExpandedButton,
+  onPrimaryButtonClick,
+  onSecondaryButtonClick,
+  customProps,
+  tagAttributes,
+  a11yAttributes,
+  closeIconTooltip,
+  dragBoundaryLimit,
+  isDraggable,
+  position
+}) => {
   const getNextIndex = useZIndex();
   const style = useMergeStyle(defaultStyle, customStyle);
   const {

package/es/Onboarding/hooks/useOnboarding.js

@@ -2,11 +2,10 @@ import { useRef } from 'react';
 import useMergeState from '@zohodesk/hooks/es/utils/useMergeState';
 import useDragger from "../../Hooks/Dragger/useDragger";
 
-const useOnboarding = _ref => {
-  let {
-    dragBoundaryLimit,
-    isDraggable
-  } = _ref;
+const useOnboarding = ({
+  dragBoundaryLimit,
+  isDraggable
+}) => {
   const dragRef = useRef(null);
   useDragger({
     isActive: isDraggable,

package/es/Onboarding/hooks/useOnboardingSlider.js

@@ -1,12 +1,11 @@
 import { useState, useEffect, useCallback, useRef } from 'react';
 const autoplayDelay = 50; // 5000ms divided by 100 for smoother animation
 
-const useOnboardingSlider = _ref => {
-  let {
-    isAutoPlayAnimation,
-    sliderData,
-    animationClass
-  } = _ref;
+const useOnboardingSlider = ({
+  isAutoPlayAnimation,
+  sliderData,
+  animationClass
+}) => {
   const [currentSlide, setCurrentSlide] = useState(0);
   const [autoplay, setAutoplay] = useState(true);
   const progressRef = useRef(0);

package/es/deprecated/SelectDropdown/SelectDropdown.js

@@ -33,10 +33,9 @@ class SelectDropdown extends React.Component {
     togglePopup(e, 'bottomRight');
   }
 
-  responsiveFunc(_ref) {
-    let {
-      mediaQueryOR
-    } = _ref;
+  responsiveFunc({
+    mediaQueryOR
+  }) {
     return {
       tabletMode: mediaQueryOR([{
         maxWidth: 700
@@ -78,49 +77,46 @@ class SelectDropdown extends React.Component {
     })), /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: this.responsiveFunc,
       responsiveId: "Helmet"
-    }, _ref2 => {
-      let {
-        tabletMode
-      } = _ref2;
-      return /*#__PURE__*/React.createElement(ResponsiveDropBox, {
-        size: "medium",
-        boxPosition: "bottomRight",
-        isArrow: true,
-        isAnimate: true,
-        right: "-25",
-        isActive: isPopupOpen && isPopupReady,
-        getRef: getContainerRef,
-        isResponsivePadding: true,
-        alignBox: "row"
-      }, /*#__PURE__*/React.createElement(Box, {
-        flexible: true
-      }, /*#__PURE__*/React.createElement(Container, {
-        alignBox: "column",
-        className: `${tabletMode ? '' : style.rulesPopup}`
-      }, /*#__PURE__*/React.createElement(Box, {
-        className: style.rulesDepart
-      }, /*#__PURE__*/React.createElement(DropDownHeading, {
-        text: title
-      })), isSearchRequired ? /*#__PURE__*/React.createElement(Box, {
-        className: style.searchDepart
-      }, /*#__PURE__*/React.createElement(TextBox, {
-        name: "Test",
-        id: "Test",
-        maxLength: "150",
-        placeHolder: "Search Department"
-      })) : null, /*#__PURE__*/React.createElement(Box, {
-        scroll: "vertical",
-        flexible: true,
-        shrink: true
-      }, options && options.length && options.map((obj, index) => /*#__PURE__*/React.createElement(ListItem, {
-        key: index,
-        autoHover: true,
-        value: obj[valueKey],
-        active: selectedId == obj[idKey],
-        id: obj[idKey],
-        onClick: this.handleClick
-      }))))));
-    }));
+    }, ({
+      tabletMode
+    }) => /*#__PURE__*/React.createElement(ResponsiveDropBox, {
+      size: "medium",
+      boxPosition: "bottomRight",
+      isArrow: true,
+      isAnimate: true,
+      right: "-25",
+      isActive: isPopupOpen && isPopupReady,
+      getRef: getContainerRef,
+      isResponsivePadding: true,
+      alignBox: "row"
+    }, /*#__PURE__*/React.createElement(Box, {
+      flexible: true
+    }, /*#__PURE__*/React.createElement(Container, {
+      alignBox: "column",
+      className: `${tabletMode ? '' : style.rulesPopup}`
+    }, /*#__PURE__*/React.createElement(Box, {
+      className: style.rulesDepart
+    }, /*#__PURE__*/React.createElement(DropDownHeading, {
+      text: title
+    })), isSearchRequired ? /*#__PURE__*/React.createElement(Box, {
+      className: style.searchDepart
+    }, /*#__PURE__*/React.createElement(TextBox, {
+      name: "Test",
+      id: "Test",
+      maxLength: "150",
+      placeHolder: "Search Department"
+    })) : null, /*#__PURE__*/React.createElement(Box, {
+      scroll: "vertical",
+      flexible: true,
+      shrink: true
+    }, options && options.length && options.map((obj, index) => /*#__PURE__*/React.createElement(ListItem, {
+      key: index,
+      autoHover: true,
+      value: obj[valueKey],
+      active: selectedId == obj[idKey],
+      id: obj[idKey],
+      onClick: this.handleClick
+    }))))))));
   }
 
 }