@zohodesk/dot 1.0.0-temp-200.8 → 1.0.0-temp-213

package/README.md

@@ -2,6 +2,10 @@
 
 In this Library, we Provide Some Basic Components to Build Your Application
 
+# 1.7.18
+
+- Added UNSAFE_ prefix to deprecated lifecycle methods: componentWillMount, componentWillReceiveProps, and componentWillUpdate.
+
 # 1.7.17
 
 - **ToggleDropDown** - SecondaryValue supported for listitems and searchFields prop supported

package/assets/Appearance/dark/mode/Dot_DarkMode.module.css

@@ -221,7 +221,7 @@
 	--zdt_gridstencils_default_border: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
 	--zdt_gridstencils_after_bg: hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	--zdt_gridstencils_listbar_bg: hsla(217, 23.23%, calc(19.41% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
-	--zdt_gridstencils_listbar_gradient_bg: linear-gradient(to left, #383f55 0, #414961 20%, #414961 40%, #383f55 100%);
+	--zdt_gridstencils_listbar_gradient_bg /* rtl:as:background-image */: linear-gradient(to left, #383f55 0, #414961 20%, #414961 40%, #383f55 100%);
 	
 	/* icons */
 	--zdt_icons_default: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));

package/assets/Appearance/light/mode/Dot_LightMode.module.css

@@ -221,7 +221,7 @@
 	--zdt_gridstencils_default_border: hsla(0, 0.00%, calc(94.51% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
 	--zdt_gridstencils_after_bg: hsla(0, 0.00%, calc(92.16% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	--zdt_gridstencils_listbar_bg: hsla(210, 12.50%, calc(96.86% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
-	--zdt_gridstencils_listbar_gradient_bg: linear-gradient(to left, var(--zd_smoke78) 0, #edeef1 20%, var(--zd_smoke78) 40%, var(--zd_smoke78) 100%);
+	--zdt_gridstencils_listbar_gradient_bg /* rtl:as:background-image */: linear-gradient(to left, var(--zd_smoke78) 0, #edeef1 20%, var(--zd_smoke78) 40%, var(--zd_smoke78) 100%);
 	
 	/* icons */
 	--zdt_icons_default: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));

package/assets/Appearance/pureDark/mode/Dot_PureDarkMode.module.css

@@ -221,7 +221,7 @@
 	--zdt_gridstencils_default_border: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
 	--zdt_gridstencils_after_bg: hsla(0, 0.00%, calc(16.86% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	--zdt_gridstencils_listbar_bg: hsla(0, 0.00%, calc(16.86% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
-	--zdt_gridstencils_listbar_gradient_bg: linear-gradient(to left, #212121 0, #262626 20%, #262626 40%, #212121 100%);
+	--zdt_gridstencils_listbar_gradient_bg /* rtl:as:background-image */: linear-gradient(to left, #212121 0, #262626 20%, #262626 40%, #212121 100%);
 	
 	/* icons */
 	--zdt_icons_default: hsla(0, 0.00%, calc(60.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));

package/es/ActionButton/ActionButton.module.css

@@ -114,14 +114,14 @@
 
 .txt,
 .subTxt {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
   /* css:theme-validation:ignore */
   color: var(--buttonText);
 }
 
 .arrowWrapper {
   position: relative;
-  composes: offSelection from '~@zohodesk/components/lib/common/common.module.css';
+  composes: offSelection from '~@zohodesk/components/es/common/common.module.css';
   cursor: pointer;
 }
 

package/es/AlphabeticList/AlphabeticList.module.css

@@ -5,7 +5,7 @@
 }
 .container {
   composes: varClass;
-  composes: h100 from '~@zohodesk/components/lib/common/common.module.css';
+  composes: h100 from '~@zohodesk/components/es/common/common.module.css';
   list-style: none;
   pointer-events: initial;
   margin: 0 ;
@@ -27,7 +27,7 @@
   padding: var(--zd_size3) 0 ;
 }
 .heading {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
   max-width: 100% ;
 }
 .list {

package/es/Attachment/Attachment.module.css

@@ -14,15 +14,15 @@
   height: 100% ;
   width: 100% ;
   position: absolute;
-  top: 0 
+  top:0 
 }
 
 [dir=ltr] .disableLayer {
-  left: 0 
+  left:0 
 }
 
 [dir=rtl] .disableLayer {
-  right: 0 
+  right:0 
 }
 
 .attachmentHover {
@@ -66,10 +66,6 @@
   height: var(--zd_size40) ;
 }
 
-.attachleft {
-  padding: var(--zd_size3) ;
-}
-
 [dir=ltr] .attachleft {
   border-right: 1px solid var(--zdt_attachment_default_border);
 }
@@ -119,7 +115,7 @@
 
 .atatchName,
 .attachSize {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .medium .attachSize {

package/es/AttachmentViewer/Attachment.js

@@ -1,4 +1,3 @@
-import { getBrowserWithVersion } from "../utils/General";
 const UNASSIGNED = 'Unassigned';
 const BROWSER_SUPPORTED_FILES = ['pdf', 'text', 'txt', 'css', 'jpg', 'jpeg', 'gif', 'png', 'bmp', 'ico', 'sh', 'mp3', 'wav', 'ogg'];
 export function isAudioFile(fileName) {
@@ -15,53 +14,4 @@ export function getExtensionFromFileName(fileName) {
 export function isBrowserSupportedFile(fileName) {
   const extension = getExtensionFromFileName(fileName);
   return BROWSER_SUPPORTED_FILES.indexOf(extension) !== -1;
-}
-export function getAttachmentIconDetails(fileName) {
-  const extension = getExtensionFromFileName(fileName)?.toLowerCase();
-  if (!extension) return 'ZD-GN-fileUnknown';
-  const imageExtensions = ['jpeg', 'jpg', 'png', 'apng', 'gif', 'bmp', 'tiff', 'tif', 'ico', 'svg', 'heic', 'webp'];
-  const docExtensions = ['txt'];
-  const pdfExtensions = ['pdf'];
-  const htmlExtensions = ['html', 'htm', 'xhtml'];
-  const pptExtensions = ['ppt', 'pps', 'odp', 'sxi', 'pptx', 'ppsx', 'pot', 'potx', 'key'];
-  const zipExtensions = ['rar', 'jar', 'zip'];
-  const wordExtensions = ['doc', 'docx', 'sxw', 'odt', 'docm', 'dot', 'dotm', 'dotx', 'rtf', 'pages'];
-  const xmlExtensions = ['xml'];
-  const sheetExtensions = ['xls', 'xlsx', 'xlsm', 'xlsb', 'sxc', 'ods', 'csv', 'tsv', 'numbers'];
-  const audioExtensions = ['mp3', 'wav', 'wma', 'aac', 'm4r', 'ogg', 'opus'];
-  const videoExtensions = ['mp4', 'mkv', 'mov', 'mpeg', 'flv', 'wmv', 'avi', 'webm', 'ogv'];
-  const mailExtensions = ['eml', 'msg'];
-  const linuxExtensions = ['sh', 'bin'];
-  const cssExtensions = ['css'];
-  const exeExtensions = ['exe'];
-  const eventExtensions = ['ics'];
-  if (imageExtensions.includes(extension)) return 'ZD-EF-fileImage';
-  if (docExtensions.includes(extension)) return 'ZD-GN-fileDoc';
-  if (pdfExtensions.includes(extension)) return 'ZD-EF-filePdf';
-  if (pptExtensions.includes(extension)) return 'ZD-GN-filePpt';
-  if (zipExtensions.includes(extension)) return 'ZD-EF-fileZip';
-
-  if (wordExtensions.includes(extension)) {
-    const OSName = navigator.platform?.toLowerCase() || '';
-    return OSName.includes('mac') || OSName.includes('linux') ? 'ZD-EF-fileOffice' : 'ZD-EF-fileWord';
-  }
-
-  if (xmlExtensions.includes(extension)) return 'ZD-EF-fileXml';
-  if (sheetExtensions.includes(extension)) return 'ZD-GN-fileSheet';
-  if (audioExtensions.includes(extension)) return 'ZD-EF-fileMp3';
-  if (videoExtensions.includes(extension)) return 'ZD-EF-fileMp4';
-  if (mailExtensions.includes(extension)) return 'ZD-GN-fileMail';
-  if (linuxExtensions.includes(extension)) return 'ZD-EF-linux';
-  if (cssExtensions.includes(extension)) return 'ZD-EF-clrCss';
-  if (exeExtensions.includes(extension)) return 'ZD-EF-exe';
-  if (eventExtensions.includes(extension)) return 'ZD-TK-event';
-
-  if (htmlExtensions.includes(extension)) {
-    const browser = getBrowserWithVersion()?.toLowerCase() || '';
-    if (browser.includes('chrome') || browser.includes('safari')) return 'ZD-EF-fileXml';
-    if (browser.includes('ie') || browser.includes('edge')) return 'ZD-EF-explorer';
-    return 'ZD-EF-firebox';
-  }
-
-  return 'ZD-GN-fileUnknown';
 }

package/es/AttachmentViewer/AttachmentViewer.js

@@ -5,17 +5,16 @@ import { Container, Box } from '@zohodesk/components/lib/Layout';
 import { Icon } from '@zohodesk/icons';
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
 import { ResponsiveReceiver } from '@zohodesk/components/lib/Responsive/CustomResponsive';
-import Typography from '@zohodesk/components/lib/Typography/Typography';
 import { getUniqueId } from '@zohodesk/components/lib/Provider/IdProvider';
-import Button from '@zohodesk/components/es/Button/Button';
 import AttachmentImage from "./AttachmentImage";
 import Link from "../Link/Link";
 import IconButton from "../IconButton/IconButton";
 import FreezeLayer from "../FreezeLayer/FreezeLayer";
-import { getExtensionFromFileName, getAttachmentIconDetails } from "./Attachment";
+import { isAudioFile, getExtensionFromFileName } from "./Attachment";
 import { shallowDiff } from "../utils/General";
-import { checkFileSourcesValidation, FILE_EXTENSIONS } from "./utils";
 import style from "./AttachmentViewer.module.css";
+import { checkFileSourcesValidation } from "./utils";
+import audioThumbNail from "../../images/audio_thumbnail.png";
 export default class AttachmentViewer extends Component {
   constructor(props) {
     super(props);
@@ -44,26 +43,6 @@ export default class AttachmentViewer extends Component {
     this.getUpdateDataList = this.getUpdateDataList.bind(this);
     this.zoomMaintain = this.zoomMaintain.bind(this);
     this.handleMenuValidation = this.handleMenuValidation.bind(this);
-    this.getPreviewIconData = this.getPreviewIconData.bind(this);
-    this.renderIframe = this.renderIframe.bind(this);
-  }
-
-  isImageFileType(fileName) {
-    const extension = getExtensionFromFileName(fileName)?.toLowerCase();
-    if (!extension) return false;
-    return FILE_EXTENSIONS.image.map(ext => ext.toLowerCase()).includes(extension);
-  }
-
-  isVideoFileType(fileName) {
-    const extension = getExtensionFromFileName(fileName)?.toLowerCase();
-    if (!extension) return false;
-    return FILE_EXTENSIONS.video.map(ext => ext.toLowerCase()).includes(extension);
-  }
-
-  isAudioFileType(fileName) {
-    const extension = getExtensionFromFileName(fileName)?.toLowerCase();
-    if (!extension) return false;
-    return FILE_EXTENSIONS.audio.map(ext => ext.toLowerCase()).includes(extension);
   }
 
   componentDidMount() {
@@ -108,19 +87,13 @@ export default class AttachmentViewer extends Component {
       data,
       selectedIndex
     } = this.state;
-    const {
-      allowedPreviewExtensionsData
-    } = this.props;
     const selectedAttachment = data[selectedIndex] || {};
     const selectedAttachmentViewUrl = selectedAttachment.viewUrl;
     const selectedAttachmentDownloadUrl = selectedAttachment.downloadUrl;
     const selectedAttachmentName = selectedAttachment.name;
-    const selectedAttachmentPreviewUrl = selectedAttachment.previewurl;
     checkFileSourcesValidation({
       fileName: selectedAttachmentName,
-      viewURL: selectedAttachmentViewUrl,
-      previewUrl: selectedAttachmentPreviewUrl,
-      allowedPreviewExtensionsData
+      viewURL: selectedAttachmentViewUrl
     }).then(fileSourceValidation => {
       const {
         isViewURLValid,
@@ -277,37 +250,7 @@ export default class AttachmentViewer extends Component {
     };
   }
 
-  getPreviewIconData(name, size, dataId) {
-    const fileUnknown = {
-      iconName: 'ZD-GN-fileUnknown',
-      iconSize: '40'
-    };
-    const fileIconName = getAttachmentIconDetails(name);
-    const fileDetails = name ? {
-      iconName: fileIconName,
-      iconSize: size
-    } : fileUnknown;
-    const {
-      iconName,
-      iconSize
-    } = fileDetails;
-    return /*#__PURE__*/React.createElement(Icon, {
-      iconClass: style.prevFooterIcon,
-      name: iconName,
-      size: iconSize,
-      "data-id": dataId
-    });
-  }
-
-  renderIframe(previewurl) {
-    return /*#__PURE__*/React.createElement("iframe", {
-      src: previewurl,
-      className: style.previewFrame,
-      ...this.props.customProps.iframeProps
-    });
-  }
-
-  imgPreviewView(downloadUrl) {
+  imgPreviewView() {
     var _this = this;
 
     const {
@@ -319,9 +262,7 @@ export default class AttachmentViewer extends Component {
     } = this.state;
     const {
       maintainZoom,
-      dataId,
-      i18nKeys,
-      renderUnSupportedElement
+      dataId
     } = this.props;
 
     const getImgStyle = i => {
@@ -358,25 +299,17 @@ export default class AttachmentViewer extends Component {
         children,
         dataId = 'attachViewer',
         customClass = {},
-        customProps = {},
-        previewurl,
-        type
+        customProps = {}
       } = data;
       const {
         audioProps = {},
-        imageProps = {},
-        videoProps = {}
+        imageProps = {}
       } = customProps;
       const {
         customImageClass = '',
         customChildrenClass = ''
       } = customClass;
       const retainZoom = canZoom && selectedIndex == i && maintainZoom;
-      const extension = getExtensionFromFileName(name);
-      const {
-        previewUnsupportedText = "Preview not available for the selected file type.",
-        downloadText = "Download"
-      } = i18nKeys;
       return /*#__PURE__*/React.createElement(Container, {
         className: style.imgBox,
         id: `imgBox${i}`,
@@ -387,52 +320,32 @@ export default class AttachmentViewer extends Component {
       }, /*#__PURE__*/React.createElement(Box, {
         className: style.imgRef,
         id: `imgPreviewRef${i}`
-      }, selectedIndex == i && /*#__PURE__*/React.createElement(React.Fragment, null, _this.isAudioFileType(name) ? /*#__PURE__*/React.createElement("audio", {
-        controls: true,
-        className: style.zoomIn,
-        "data-id": `${dataId}_audioPreview`,
-        "data-test-id": `${dataId}_audioPreview`,
-        ...audioProps
-      }, /*#__PURE__*/React.createElement("source", {
-        src: previewurl,
-        type: `audio/${extension}`
-      })) : _this.isVideoFileType(name) ? /*#__PURE__*/React.createElement("video", {
+      }, isAudioFile(name) ? selectedIndex == i ? /*#__PURE__*/React.createElement("video", {
+        autoPlay: true,
         controls: true,
         className: style.zoomIn,
         "data-id": `${dataId}_videoPreview`,
         "data-test-id": `${dataId}_videoPreview`,
-        ...videoProps
+        ...audioProps
       }, /*#__PURE__*/React.createElement("source", {
         src: viewUrl,
-        type: `video/${extension}`
-      })) : _this.isImageFileType(name) || children ? /*#__PURE__*/React.createElement(AttachmentImage, {
+        type: `audio/${getExtensionFromFileName(name)}`
+      })) : null : /*#__PURE__*/React.createElement(AttachmentImage, {
         customClass: {
-          customImageClass: `${style.img} ${style.altText} ${canZoom || retainZoom ? isZoomed ? `${style.zoomedImg} ${style.zoomOutCursor}` : `${style.normalImg} ${style.zoomInCursor}` : ''} ${customImageClass}`,
+          customImageClass: `${style.img} ${style.altText}
+                    ${canZoom || retainZoom ? isZoomed ? `${style.zoomedImg} ${style.zoomOutCursor}` : `${style.normalImg} ${style.zoomInCursor}` : ''} ${customImageClass}`,
           customChildrenClass
         },
         src: viewUrl,
-        onClick: isPreviewAttachmentValid ? isZoomed ? _this.zoomOut.bind(_this, i) : e => _this.zoomIn(e, i, true) : undefined,
+        onClick: isPreviewAttachmentValid ? isZoomed ? _this.zoomOut.bind(_this, i) : e => {
+          _this.zoomIn(e, i, true);
+        } : undefined,
         alt: name,
         dataId: dataId,
         id: `img${i}`,
         isCover: false,
         ...imageProps
-      }, children) : type === "document" && previewurl != null ? _this.renderIframe(previewurl) : typeof renderUnSupportedElement === 'function' ? renderUnSupportedElement(data) : /*#__PURE__*/React.createElement("div", {
-        className: style.previewNone
-      }, /*#__PURE__*/React.createElement("div", {
-        className: style.fileTypeImg
-      }, _this.getPreviewIconData(name, '70')), /*#__PURE__*/React.createElement(Typography, {
-        $ui_size: "20",
-        $ui_weight: "semibold"
-      }, previewUnsupportedText), /*#__PURE__*/React.createElement(Link, {
-        href: downloadUrl,
-        className: style.downloadLink,
-        hasReload: true,
-        download: true
-      }, /*#__PURE__*/React.createElement(Button, {
-        palette: "primaryFilled",
-        text: downloadText
-      }))))));
+      }, children)));
     });
   }
 
@@ -458,7 +371,7 @@ export default class AttachmentViewer extends Component {
     } = customProps;
     const totalLen = data.length;
     const selectedAttachment = data[selectedIndex] || {};
-    const selectedImgUrl = selectedAttachment.previewurl || selectedAttachment.viewUrl;
+    const selectedImgUrl = selectedAttachment.viewUrl;
     const downloadUrl = selectedAttachment.downloadUrl;
     let authorHref;
     let authorName;
@@ -613,7 +526,7 @@ export default class AttachmentViewer extends Component {
         eleRef: this.setImgBoxRef,
         scroll: "both",
         flexible: true
-      }, this.imgPreviewView(downloadUrl)), /*#__PURE__*/React.createElement(Box, {
+      }, this.imgPreviewView()), /*#__PURE__*/React.createElement(Box, {
         className: `${style.arrowBox}  ${uptoTablet ? style.mbleArrowBox : style.nrmlArrowBox} ${totalLen === selectedIndex + 1 ? style.hidden : ''}`,
         onClick: this.changeSelectedIndex.bind(this, selectedIndex + 1),
         "data-title": i18nKeys.nextText,
@@ -669,19 +582,20 @@ export default class AttachmentViewer extends Component {
         let {
           thumbnail
         } = item;
-        const isImageFileType = this.isImageFileType(name) || thumbnail;
         const {
           customImageClass = '',
           customChildrenClass = ''
         } = customClass;
+        thumbnail = isAudioFile(name) ? thumbnail || audioThumbNail : thumbnail; //fallback thumbnail for audio
+
         return /*#__PURE__*/React.createElement(Box, {
-          className: `${style.imgItem} ${index === selectedIndex ? style.selected : ''} ${isImageFileType ? '' : style.previewIconDiv}`,
+          className: `${style.imgItem} ${index === selectedIndex ? style.selected : ''}`,
           key: index,
           onClick: this.changeSelectedIndex.bind(this, index),
           eleRef: el => this[`img_${index}`] = el,
           dataId: "attachPreviewList",
           "data-title": name
-        }, isImageFileType || children ? /*#__PURE__*/React.createElement(AttachmentImage, {
+        }, /*#__PURE__*/React.createElement(AttachmentImage, {
           src: thumbnail || viewUrl,
           size: "small",
           alt: name,
@@ -691,7 +605,7 @@ export default class AttachmentViewer extends Component {
           },
           dataId: dataId,
           ...customProps
-        }, children) : this.getPreviewIconData(name, '40'));
+        }, children));
       }))))), totalLen !== 1 && /*#__PURE__*/React.createElement(IconButton, {
         dataId: "attachToggle",
         onClick: this.togglePViewList,

package/es/AttachmentViewer/AttachmentViewer.module.css

@@ -2,7 +2,7 @@
     height: var(--zd_size40) ;
     position: relative;
     z-index: 1;
-    composes: alignVertical from '~@zohodesk/components/lib/common/common.module.css';
+    composes: alignVertical from '~@zohodesk/components/es/common/common.module.css';
     background-color: var(--zdt_attachmentviewer_header_bg);
     padding: 0 var(--zd_size15) ;
     border-bottom: 1px solid var(--zdt_attachmentviewer_header_border);
@@ -10,7 +10,7 @@
 
 .title {
     max-width: 50% ;
-    composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+    composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 
 [dir=ltr] .title {
@@ -23,7 +23,7 @@
 
 .count {
     position: absolute;
-    composes: xMiddle from '~@zohodesk/components/lib/common/common.module.css';
+    composes: xMiddle from '~@zohodesk/components/es/common/common.module.css';
     padding: 0 var(--zd_size10) ;
 }
 
@@ -79,13 +79,13 @@
     font-size: var(--zd_font_size22) ;
     height: var(--zd_size38) ;
     width: var(--zd_size38) ;
-    line-height: 1.6;
+    line-height: 1.6364;
     border-radius: 50%;
     cursor: pointer;
 }
 
 .preview {
-    composes: posrel from '~@zohodesk/components/lib/common/common.module.css';
+    composes: posrel from '~@zohodesk/components/es/common/common.module.css';
     text-align: center;
     margin: var(--zd_size20) 0 ;
 }
@@ -94,7 +94,7 @@
     max-height: 100% ;
     max-width: 90% ;
     position: absolute;
-    composes: middleBoth from '~@zohodesk/components/lib/common/common.module.css';
+    composes: middleBoth from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .zoomOut {
@@ -230,10 +230,14 @@
     transform: rotateX(0deg);
 }
 
-.previewFrame {
-    height: 100% ;
-    width: 100% ;
-    border: 0;
+.isAudio {
+    composes: audioImage from '../common/dot_common.module.css';
+    width: var(--zd_size100) ;
+    background-size: 100% 100%;
+}
+
+.isAudio .image {
+    opacity: 0;
 }
 
 .video {
@@ -269,7 +273,7 @@
     height: 100% ;
     max-width: 100% ;
     max-height: 100% ;
-    composes: dflex from '~@zohodesk/components/lib/common/common.module.css';
+    composes: dflex from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .img {
@@ -302,7 +306,7 @@
 
 .spinLoad {
     position: absolute;
-    composes: middleBoth from '~@zohodesk/components/lib/common/common.module.css';
+    composes: middleBoth from '~@zohodesk/components/es/common/common.module.css';
     height: var(--zd_size18) ;
     width: var(--zd_size18) ;
     cursor: progress
@@ -312,7 +316,7 @@
     height: 100% ;
     width: 100% ;
     composes: rotate from '../common/dot_animation.module.css';
-    composes: infinite from '~@zohodesk/components/lib/common/animation.module.css';
+    composes: infinite from '~@zohodesk/components/es/common/animation.module.css';
     border: 2px solid var(--zdt_attachmentviewer_loader_border);
     border-top-color: var(--zdt_attachmentviewer_loader_border_top);
     border-radius: 50%;
@@ -348,7 +352,7 @@
 .authorName {
     font-size: var(--zd_font_size15) ;
     color: var(--zdt_attachmentviewer_title_text);
-    composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+    composes: dotted from '~@zohodesk/components/es/common/common.module.css';
     margin: 0 var(--zd_size10) ;
 }
 
@@ -358,31 +362,4 @@
     background-color: var(--dot_mirror);
     border: 0;
     cursor: pointer;
-}
-
-.fileTypeImg {
-    margin-bottom: var(--zd_size30) ;
-}
-
-.previewNone {
-    color: var(--zdt_attachmentviewer_title_text);
-    max-width: 70% ;
-    text-align: center;
-    margin: auto ;
-}
-
-.downloadLink {
-    display: inline-block;
-    padding-top: var(--zd_size15) ;
-}
-
-.previewIconDiv {
-    width: var(--zd_size60) ;
-    composes: dflex from '~@zohodesk/components/lib/common/common.module.css';
-}
-
-.prevFooterIcon {
-    color: var(--zdt_attachmentviewer_title_text);
-    padding: var(--zd_size2) ;
-    margin: auto ;
 }

package/es/AttachmentViewer/props/defaultProps.js

@@ -8,9 +8,9 @@ export const AttachmentImage_defaultProps = {
 export const AttachmentViewer_defaultProps = {
   responsiveId: "Helmet",
   needDownload: true,
+  i18nKeys: {},
   maintainZoom: false,
   isActive: false,
   dataId: 'AttachmentViewer',
-  i18nKeys: {},
   customProps: {}
 };

package/es/AttachmentViewer/props/propTypes.js

@@ -26,8 +26,7 @@ export const AttachmentViewer_propTypes = {
     downloadText: PropTypes.string,
     closeText: PropTypes.string,
     hideText: PropTypes.string,
-    showText: PropTypes.string,
-    previewUnsupportedText: PropTypes.string
+    showText: PropTypes.string
   }),
   needDownload: PropTypes.string,
   previewObj: PropTypes.object,
@@ -35,13 +34,6 @@ export const AttachmentViewer_propTypes = {
   maintainZoom: PropTypes.bool,
   isActive: PropTypes.bool,
   dataId: PropTypes.string,
-  allowedPreviewExtensionsData: PropTypes.shape({
-    audio: PropTypes.arrayOf(PropTypes.string),
-    video: PropTypes.arrayOf(PropTypes.string),
-    image: PropTypes.arrayOf(PropTypes.string),
-    document: PropTypes.arrayOf(PropTypes.string)
-  }),
-  renderUnSupportedElement: PropTypes.func,
   customProps: PropTypes.shape({
     avatarProps: PropTypes.exact(AvatarProps)
   })