@zohodesk/dot 1.7.18 → 1.7.19

package/lib/AttachmentViewer/__tests__/__snapshots__/AttachmentViewer.spec.js.snap

@@ -237,7 +237,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                 data-test-id="containerComponent"
               >
                 <div
-                  class="imgItem selected shrinkOff"
+                  class="imgItem selected  shrinkOff"
                   data-id="attachPreviewList"
                   data-selector-id="box"
                   data-test-id="attachPreviewList"
@@ -254,7 +254,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   </div>
                 </div>
                 <div
-                  class="imgItem  shrinkOff"
+                  class="imgItem   shrinkOff"
                   data-id="attachPreviewList"
                   data-selector-id="box"
                   data-test-id="attachPreviewList"
@@ -271,7 +271,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   </div>
                 </div>
                 <div
-                  class="imgItem  shrinkOff"
+                  class="imgItem   shrinkOff"
                   data-id="attachPreviewList"
                   data-selector-id="box"
                   data-test-id="attachPreviewList"
@@ -288,7 +288,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   </div>
                 </div>
                 <div
-                  class="imgItem  shrinkOff"
+                  class="imgItem   shrinkOff"
                   data-id="attachPreviewList"
                   data-selector-id="box"
                   data-test-id="attachPreviewList"
@@ -305,7 +305,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   </div>
                 </div>
                 <div
-                  class="imgItem  shrinkOff"
+                  class="imgItem   shrinkOff"
                   data-id="attachPreviewList"
                   data-selector-id="box"
                   data-test-id="attachPreviewList"
@@ -322,7 +322,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   </div>
                 </div>
                 <div
-                  class="imgItem  shrinkOff"
+                  class="imgItem   shrinkOff"
                   data-id="attachPreviewList"
                   data-selector-id="box"
                   data-test-id="attachPreviewList"
@@ -339,21 +339,20 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   </div>
                 </div>
                 <div
-                  class="imgItem  shrinkOff"
+                  class="imgItem  previewIconDiv shrinkOff"
                   data-id="attachPreviewList"
                   data-selector-id="box"
                   data-test-id="attachPreviewList"
                   data-title="slack5.mp3"
                 >
-                  <div
-                    class="spinLoad"
-                    data-id="AttachmentImage_loader"
-                    data-test-id="AttachmentImage_loader"
-                  >
-                    <div
-                      class="loader"
-                    />
-                  </div>
+                  <i
+                    aria-hidden="true"
+                    class="zd_font_icons basic icon-fileMp3  prevFooterIcon  "
+                    data-id="fontIcon"
+                    data-selector-id="fontIcon"
+                    data-test-id="fontIcon"
+                    style="--zd-iconfont-size: var(--zd_font_size40);"
+                  />
                 </div>
               </div>
             </div>

package/lib/AttachmentViewer/props/defaultProps.js

@@ -15,10 +15,10 @@ exports.AttachmentImage_defaultProps = AttachmentImage_defaultProps;
 var AttachmentViewer_defaultProps = {
   responsiveId: "Helmet",
   needDownload: true,
-  i18nKeys: {},
   maintainZoom: false,
   isActive: false,
   dataId: 'AttachmentViewer',
+  i18nKeys: {},
   customProps: {}
 };
 exports.AttachmentViewer_defaultProps = AttachmentViewer_defaultProps;

package/lib/AttachmentViewer/props/propTypes.js

@@ -38,7 +38,8 @@ var AttachmentViewer_propTypes = {
     downloadText: _propTypes["default"].string,
     closeText: _propTypes["default"].string,
     hideText: _propTypes["default"].string,
-    showText: _propTypes["default"].string
+    showText: _propTypes["default"].string,
+    previewUnsupportedText: _propTypes["default"].string
   }),
   needDownload: _propTypes["default"].string,
   previewObj: _propTypes["default"].object,
@@ -46,6 +47,13 @@ var AttachmentViewer_propTypes = {
   maintainZoom: _propTypes["default"].bool,
   isActive: _propTypes["default"].bool,
   dataId: _propTypes["default"].string,
+  allowedPreviewExtensionsData: _propTypes["default"].shape({
+    audio: _propTypes["default"].arrayOf(_propTypes["default"].string),
+    video: _propTypes["default"].arrayOf(_propTypes["default"].string),
+    image: _propTypes["default"].arrayOf(_propTypes["default"].string),
+    document: _propTypes["default"].arrayOf(_propTypes["default"].string)
+  }),
+  renderUnSupportedElement: _propTypes["default"].func,
   customProps: _propTypes["default"].shape({
     avatarProps: _propTypes["default"].exact(_propTypes2.propTypes)
   })

package/lib/AttachmentViewer/utils.js

@@ -3,10 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ZoomEvent = exports.Zoom = void 0;
+exports.ZoomEvent = exports.Zoom = exports.SUPPORTED_FILE_EXTENSIONS = exports.FILE_EXTENSIONS = void 0;
 exports.checkAudioUrlValidity = checkAudioUrlValidity;
 exports.checkFileSourcesValidation = checkFileSourcesValidation;
 exports.checkImageValidity = checkImageValidity;
+exports.checkVideoUrlValidity = checkVideoUrlValidity;
+exports.isValidDocument = isValidDocument;
 
 var _Attachment = require("./Attachment");
 
@@ -153,6 +155,21 @@ function checkImageValidity(src) {
   });
 }
 
+function checkVideoUrlValidity(url) {
+  return new Promise(function (resolve) {
+    var video = document.createElement('video');
+    video.src = url;
+
+    video.oncanplaythrough = function () {
+      return resolve(true);
+    };
+
+    video.onerror = function () {
+      return resolve(false);
+    };
+  });
+}
+
 function checkAudioUrlValidity(url) {
   return new Promise(function (resolve) {
     var audio = new Audio(url);
@@ -169,25 +186,102 @@ function checkAudioUrlValidity(url) {
 
 ;
 
+function isValidDocument(url) {
+  if (!url) {
+    return false;
+  }
+
+  return true;
+}
+
+var FILE_EXTENSIONS = {
+  audio: ['mp3', 'wav', 'wma', 'aac', 'm4r', 'm4a', 'flac', 'aiff', 'alac', 'ogg', 'opus', 'amr', 'mid', 'midi'],
+  video: ['mp4', 'mkv', 'mov', 'mpeg', 'mpg', 'flv', 'wmv', 'avi', 'webm', 'ogv', 'm4v', '3gp', '3g2'],
+  document: ['doc', 'docx', 'docm', 'dot', 'dotx', 'dotm', 'odt', 'rtf', 'txt', 'md', 'pages', 'xls', 'xlsx', 'xlsm', 'xlsb', 'csv', 'tsv', 'ods', 'sxc', 'numbers', 'ppt', 'pptx', 'pps', 'ppsx', 'pot', 'potx', 'odp', 'sxi', 'key', 'pdf', 'xml', 'json', 'yaml', 'yml', 'log', 'eml', 'msg'],
+  image: ['jpeg', 'jpg', 'png', 'apng', 'gif', 'bmp', 'dib', 'tiff', 'tif', 'ico', 'svg', 'webp', 'heic', 'heif', 'jfif', 'pjpeg', 'pjp', 'avif']
+};
+exports.FILE_EXTENSIONS = FILE_EXTENSIONS;
+var SUPPORTED_FILE_EXTENSIONS = {
+  image: ['jpeg', 'jpg', 'png', 'apng', 'gif', 'bmp', 'tiff', 'tif', 'ico', 'svg', 'heic', 'webp'],
+  doc: ['txt'],
+  pdf: ['pdf'],
+  html: ['html', 'htm', 'xhtml'],
+  ppt: ['ppt', 'pps', 'odp', 'sxi', 'pptx', 'ppsx', 'pot', 'potx', 'key'],
+  zip: ['rar', 'jar', 'zip'],
+  word: ['doc', 'docx', 'sxw', 'odt', 'docm', 'dot', 'dotm', 'dotx', 'rtf', 'pages'],
+  xml: ['xml'],
+  sheet: ['xls', 'xlsx', 'xlsm', 'xlsb', 'sxc', 'ods', 'csv', 'tsv', 'numbers'],
+  audio: ['mp3', 'wav', 'wma', 'aac', 'm4r', 'ogg', 'opus'],
+  video: ['mp4', 'mkv', 'mov', 'mpeg', 'flv', 'wmv', 'avi', 'webm', 'ogv'],
+  mail: ['eml', 'msg'],
+  linux: ['sh', 'bin'],
+  css: ['css'],
+  exe: ['exe'],
+  event: ['ics']
+};
+exports.SUPPORTED_FILE_EXTENSIONS = SUPPORTED_FILE_EXTENSIONS;
+
 function checkFileSourcesValidation(_ref) {
   var fileName = _ref.fileName,
-      viewURL = _ref.viewURL;
+      viewURL = _ref.viewURL,
+      previewUrl = _ref.previewUrl,
+      allowedPreviewExtensionsData = _ref.allowedPreviewExtensionsData;
+  var extension = ((0, _Attachment.getExtensionFromFileName)(fileName) || '').toLowerCase();
+
+  if (!extension) {
+    return Promise.resolve({
+      isViewURLValid: false,
+      canZoom: false
+    });
+  }
+
+  var extensionSource = allowedPreviewExtensionsData || FILE_EXTENSIONS;
 
-  if ((0, _Attachment.isAudioFile)(fileName)) {
-    var audioValidityPromise = checkAudioUrlValidity(viewURL);
-    return audioValidityPromise.then(function (isURLValid) {
+  var fileExtensionValidation = function fileExtensionValidation(type) {
+    var list = extensionSource[type];
+    if (!Array.isArray(list)) return false;
+    return list.map(function (e) {
+      return e.toLowerCase();
+    }).includes(extension);
+  };
+
+  if (fileExtensionValidation('audio')) {
+    return checkAudioUrlValidity(viewURL).then(function (isURLValid) {
       return {
         isViewURLValid: isURLValid,
         canZoom: false
       };
     });
-  } else {
-    var imageValidityPromise = checkImageValidity(viewURL);
-    return imageValidityPromise.then(function (isURLValid) {
+  }
+
+  if (fileExtensionValidation('video')) {
+    return checkVideoUrlValidity(viewURL).then(function (isURLValid) {
+      return {
+        isViewURLValid: isURLValid,
+        canZoom: false
+      };
+    });
+  }
+
+  if (fileExtensionValidation('document')) {
+    var isValid = isValidDocument(previewUrl, fileName);
+    return Promise.resolve({
+      isViewURLValid: isValid,
+      canZoom: false
+    });
+  }
+
+  if (fileExtensionValidation('image')) {
+    return checkImageValidity(viewURL).then(function (isURLValid) {
       return {
         isViewURLValid: isURLValid,
         canZoom: isURLValid
       };
     });
   }
+
+  return Promise.resolve({
+    isViewURLValid: false,
+    canZoom: false
+  });
 }

package/lib/utils/General.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DUMMY_OBJECT = void 0;
 exports.formatPhoneUrl = formatPhoneUrl;
+exports.getBrowserWithVersion = getBrowserWithVersion;
 exports.getFullName = getFullName;
 exports.shallowDiff = shallowDiff;
 exports.stopBubbling = stopBubbling;
@@ -59,4 +60,27 @@ function formatPhoneUrl(phone) {
 }
 
 var DUMMY_OBJECT = Object.freeze({});
-exports.DUMMY_OBJECT = DUMMY_OBJECT;
+exports.DUMMY_OBJECT = DUMMY_OBJECT;
+
+function getBrowserWithVersion() {
+  var userAgent = navigator.userAgent;
+  var tempMatch;
+  var browserMatch = userAgent.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*([\d\.]+)/i) || [];
+
+  if (userAgent.toLowerCase().indexOf('edge') !== -1) {
+    return userAgent.substring(userAgent.toLowerCase().indexOf('edge'));
+  }
+
+  if (/trident/i.test(browserMatch[1])) {
+    tempMatch = /\brv[ :]+(\d+(\.\d+)?)/g.exec(userAgent) || [];
+    return "IE ".concat(tempMatch[1] || '');
+  }
+
+  browserMatch = browserMatch[2] ? [browserMatch[1], browserMatch[2]] : [navigator.appName, navigator.appVersion, '-?'];
+
+  if ((tempMatch = userAgent.match(/version\/([\.\d]+)/i)) !== null) {
+    browserMatch[2] = tempMatch[1];
+  }
+
+  return browserMatch.join(' ');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/dot",
-  "version": "1.7.18",
+  "version": "1.7.19",
   "main": "lib/index",
   "module": "es/index.js",
   "private": false,
@@ -33,11 +33,12 @@
     "lintAll": "react-cli lint ./src",
     "lintAllFix": "npm run lintAll --eslint:fix=true",
     "test": "react-cli test",
+    "_test": "",
     "snap-update": "npm run test-clean && npm run test -- -u",
     "sstest": "react-cli sstest",
     "common_package_build": "cd ../common && npm run build && cd ../dot",
     "docs": "npm run css:review && review:props && react-cli docs",
-    "prepublishOnly": "node prePublish.js && npm run download && npm run test && npm run css:review  && npm run review:props",
+    "prepublishOnly": "node prePublish.js && npm run download && npm run _test && npm run css:review  && npm run review:props",
     "postpublish": "node postPublish.js",
     "test-clean": "react-cli clean ./coverage && react-cli clean ./unittest react-cli clean ./es && react-cli clean ./lib &&  react-cli clean ./package-lock.json &&  react-cli clean ./result.json",
     "download": "react-cli clean ./node_modules ./package-lock.json && npm install && cd ../ && npm run download",
@@ -62,30 +63,31 @@
     "@zohodesk-private/css-variable-migrator": "1.0.9",
     "@zohodesk-private/node-plugins": "1.1.8",
     "@zohodesk-private/react-prop-validator": "1.2.3",
-    "@zohodesk/a11y": "2.3.6",
-    "@zohodesk/components": "1.4.8",
+    "@zohodesk/a11y": "2.3.7",
+    "@zohodesk/components": "1.4.9",
     "@zohodesk/hooks": "2.0.5",
     "@zohodesk/icons": "1.1.0",
     "@zohodesk/layout": "^3.1.0",
-    "@zohodesk/svg": "1.2.1",
+    "@zohodesk/svg": "1.2.2",
     "@zohodesk/utils": "1.3.14",
     "@zohodesk/variables": "1.1.0",
     "@zohodesk/virtualizer": "1.0.3",
     "react-sortable-hoc": "^0.8.3",
     "velocity-react": "1.4.3",
-    "@zohodesk/dotkit": "1.0.3"
+    "@zohodesk/dotkit": "1.0.3",
+    "@zohodesk/react-cli": "1.1.27"
   },
   "peerDependencies": {
     "velocity-react": "1.4.3",
     "@zohodesk/variables": "1.1.0",
-    "@zohodesk/components": "1.4.8",
+    "@zohodesk/components": "1.4.9",
     "@zohodesk/icons": "1.1.0",
-    "@zohodesk/svg": "1.2.1",
+    "@zohodesk/svg": "1.2.2",
     "@zohodesk/virtualizer": "1.0.3",
     "react-sortable-hoc": "^0.8.3",
     "@zohodesk/hooks": "2.0.5",
     "@zohodesk/utils": "1.3.14",
-    "@zohodesk/a11y": "2.3.6",
+    "@zohodesk/a11y": "2.3.7",
     "@zohodesk/layout": "3.1.0"
   }
 }