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

package/es/AttachmentViewer/AttachmentViewer.module.css

@@ -1,8 +1,8 @@
 .header {
-    height: var(--zd_size48) ;
+    height: var(--zd_size40) ;
     position: relative;
     z-index: 1;
-    padding-block: 0 ;
+    padding-block:0 ;
     padding-inline: var(--zd_size15) ;
     composes: alignVertical from '~@zohodesk/components/es/common/common.module.css';
     background-color: var(--zdt_attachmentviewer_header_bg);
@@ -10,13 +10,20 @@
 }
 
 .title {
-    padding-inline-end: var(--zd_size15) ;
     max-width: 50% ;
     composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 
+[dir=ltr] .title {
+    padding-right: var(--zd_size15) ;
+}
+
+[dir=rtl] .title {
+    padding-left: var(--zd_size15) ;
+}
+
 .count {
-    padding-block: 0 ;
+    padding-block:0 ;
     padding-inline: var(--zd_size10) ;
     position: absolute;
     composes: xMiddle from '~@zohodesk/components/es/common/common.module.css';
@@ -73,7 +80,7 @@
 
 .preview {
     margin-block: var(--zd_size20) ;
-    margin-inline: 0 ;
+    margin-inline:0 ;
     composes: posrel from '~@zohodesk/components/es/common/common.module.css';
     text-align: center;
 }
@@ -129,7 +136,7 @@
 }
 
 .listContainer {
-    padding-block: 0 ;
+    padding-block:0 ;
     padding-inline: var(--zd_size18) ;
 }
 
@@ -317,7 +324,7 @@
 }
 
 .authorName {
-    margin-block: 0 ;
+    margin-block:0 ;
     margin-inline: var(--zd_size10) ;
     font-size: var(--zd_font_size15) ;
     color: var(--zdt_attachmentviewer_title_text);
@@ -357,4 +364,4 @@
     color: var(--zdt_attachmentviewer_title_text);
     padding: var(--zd_size2) ;
     margin: auto ;
-}
+}

package/es/AttachmentViewer/props/defaultProps.js

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

package/es/AttachmentViewer/props/propTypes.js

@@ -2,9 +2,6 @@ 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
@@ -32,7 +29,7 @@ export const AttachmentViewer_propTypes = {
     showText: PropTypes.string,
     previewUnsupportedText: PropTypes.string
   }),
-  needDownload: PropTypes.bool,
+  needDownload: PropTypes.string,
   previewObj: PropTypes.object,
   responsiveId: PropTypes.string,
   maintainZoom: PropTypes.bool,
@@ -45,10 +42,7 @@ export const AttachmentViewer_propTypes = {
     document: PropTypes.arrayOf(PropTypes.string)
   }),
   renderUnSupportedElement: PropTypes.func,
-  renderCustomImagePreviewElement: PropTypes.func,
   customProps: PropTypes.shape({
     avatarProps: PropTypes.exact(AvatarProps)
-  }),
-  showCount: PropTypes.bool,
-  renderCustomIcons: 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');
@@ -82,7 +81,10 @@ export default function useDownloadAssetsAndSetAttr(_ref) {
   }
 
   function setZoomSizeAttribute() {
-    if (!needZoom) {
+    const zoomLower = String(baseZoomUnit).toLowerCase();
+    const varLower = String(zoomUnitVariable).toLowerCase();
+
+    if (!needZoom || zoomLower === 'none' || zoomLower === 'unset' || varLower === 'none' || varLower === 'unset') {
       return;
     }
 
@@ -98,7 +100,10 @@ export default function useDownloadAssetsAndSetAttr(_ref) {
   }
 
   function setFontSizeAttribute() {
-    if (!needFont) {
+    const fontLower = String(baseFontUnit).toLowerCase();
+    const varLower = String(fontUnitVariable).toLowerCase();
+
+    if (!needFont || fontLower === 'none' || fontLower === 'unset' || varLower === 'none' || varLower === 'unset') {
       return;
     }
 
@@ -118,7 +123,7 @@ export default function useDownloadAssetsAndSetAttr(_ref) {
   }, [themeAppearanceAttr, themeColorAttr, themeAppearance, themeColor, getProviderElement, needTheme]);
   useLayoutEffect(() => {
     setZoomSizeAttribute();
-  }, [zoomUnitVariable, modifiedZoomUnitWithSuffix, zoomSizePromise, getProviderElement, needZoom]);
+  }, [zoomUnitVariable, modifiedZoomUnitWithSuffix, zoomSizePromise, getProviderElement, needZoom, baseZoomUnit]);
   useLayoutEffect(() => {
     setFontSizeAttribute();
   }, [fontUnitVariable, baseFontUnit, fontSizePromise, getProviderElement, needFont]);

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,8 +61,7 @@ export default class Link extends React.Component {
       rel,
       dataId,
       customProps,
-      ariaLabel,
-      downloadName
+      ariaLabel
     } = this.props;
     let {
       isLink,
@@ -72,10 +71,10 @@ export default class Link extends React.Component {
     let option = {};
 
     if (download) {
-      option.download = downloadName || true;
+      option.download = true;
     }
 
-    let ignoreKeys = ['children', 'href', 'target', 'urlData', 'urlName', 'className', 'title', 'download', 'downloadName', 'rel', 'dataId', 'hasReload', 'customProps', 'option', 'ariaLabel'];
+    let ignoreKeys = ['children', 'href', 'target', 'urlData', 'urlName', 'className', 'title', 'download', '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,7 +13,6 @@ 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);