npm - @zohodesk/dot - Versions diffs - 1.5.5 → 1.6.0 - Mend

@zohodesk/dot 1.5.5 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (785) hide show

package/es/v1/form/fields/TextEditor/TextEditor.js CHANGED Viewed

@@ -25,7 +25,8 @@ export default class TextEditor extends Component {
       isResourceLoaded: false,
       isEditorShow: false
     };
-    let methods = ['editorCallback', 'handleUpload', 'handleChange', 'focusCallback', 'handleInlineUpload', 'handleDropUpload', 'blurCallback', 'handleGetContent', 'initializeEditor', 'clearEditorData', 'plainTextSwitchCallback', 'onWindowClick', 'toggleEditor'];
+    let methods = ['editorCallback', 'handleUpload', 'handleChange', 'focusCallback', 'handleInlineUpload', // 'handleDropUpload',
+    'blurCallback', 'handleGetContent', 'initializeEditor', 'clearEditorData', 'plainTextSwitchCallback', 'onWindowClick', 'toggleEditor'];
     bind.apply(this, methods);
   }
@@ -53,12 +54,13 @@ export default class TextEditor extends Component {
       editorMode = '',
       editorOptions = {},
       needEditorFocus = true,
-      handleDropUpload,
+      // handleDropUpload,
       fontFamily,
       fontSize,
       initCallback,
       handleAlertMessage,
-      needInlineAttachment
+      needInlineAttachment,
+      customInitOption
     } = this.props;
     if (id && global.ZohoDeskEditor) {
@@ -67,7 +69,7 @@ export default class TextEditor extends Component {
         content: fixEncoding(value),
         callback: this.editorCallback,
         imageuploadcallback: this.handleInlineUpload,
-        handleInlineDropImage: handleDropUpload ? this.handleDropUpload : undefined,
+        // handleInlineDropImage: handleDropUpload ? this.handleDropUpload : undefined,
         contentChanged: this.handleChange,
         focusCallback: this.focusCallback,
         lineHeight: 'Normal',
@@ -90,13 +92,17 @@ export default class TextEditor extends Component {
         htmlVersion: '<!Doctype html>'
       };
-      if (!ZohoDeskEditor_Init.init) {
-        global.editorInitialize && global.editorInitialize();
+      if (!customInitOption) {
+        if (!ZohoDeskEditor_Init.init) {
+          global.editorInitialize && global.editorInitialize();
+        }
+        ZohoDeskEditor_Init.init(editorMode, fontFamily, initCallback, fontSize);
       }
       defaultObj = Object.assign(defaultObj, editorOptions);
-      ZohoDeskEditor_Init.init(editorMode, fontFamily, initCallback, fontSize);
-      ZohoDeskEditor.create && ZohoDeskEditor.create(defaultObj);
+      const globalEditor = global.ZohoDeskEditor;
+      globalEditor && typeof globalEditor.create == 'function' && globalEditor.create(defaultObj, customInitOption);
     }
   }
@@ -121,7 +127,7 @@ export default class TextEditor extends Component {
     getRef && getRef(null);
   }
-  componentWillReceiveProps(np) {
+  UNSAFE_componentWillReceiveProps(np) {
     let {
       changeEditorContent
     } = this.props;
@@ -203,7 +209,8 @@ export default class TextEditor extends Component {
     let {
       editorCallback,
       getRef,
-      isCustomScroll
+      isCustomScroll,
+      customCSS
     } = this.props;
     this.setState({
       isEditorLoad: true,
@@ -218,18 +225,6 @@ export default class TextEditor extends Component {
       global.editor[id] = editorObj;
     }
-    const css = 'pre {white-space: pre-wrap}',
-          head = editorObj.doc.head || editorObj.doc.getElementsByTagName('head')[0],
-          style = document.createElement('style');
-    style.type = 'text/css';
-    if (style.styleSheet) {
-      style.styleSheet.cssText = css;
-    } else {
-      style.appendChild(editorObj.doc.createTextNode(css));
-    }
-    head.appendChild(style);
     editorCallback && editorCallback(editorObj);
     const iframe = selectn('iframe.contentDocument.body', editorObj) || null;
     const iframeHead = selectn('iframe.contentDocument.head', editorObj) || null;
@@ -245,9 +240,12 @@ export default class TextEditor extends Component {
         iframe.classList.add('scroll');
       }
-      let customFonts = document.createElement('style');
-      customFonts.innerText = `@font-face {font-family: 'ZohoPuviRegular';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: normal;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: Regular;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'RobotoRegular';font-weight: 400;font-style: normal;font-display: swa;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}`;
-      iframeHead.appendChild(customFonts);
+      let customStyleTag = document.createElement('style');
+      customStyleTag.type = 'text/css';
+      const customizedCSS = `pre {white-space: pre-wrap} ${customCSS}`;
+      const fontCSS = `@font-face {font-family: 'ZohoPuviRegular';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: normal;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: Regular;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'RobotoRegular';font-weight: 400;font-style: normal;font-display: swa;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}`;
+      customStyleTag.textContent = `${customizedCSS} ${fontCSS}`;
+      iframeHead.appendChild(customStyleTag);
     }
   }
@@ -255,13 +253,26 @@ export default class TextEditor extends Component {
     let {
       id,
       setInlineAttachmentInProgress: progress,
-      i18nKeys
+      i18nKeys,
+      inlineImageProps
     } = this.props;
-    if (!isFileNameSizeInvalid(file.name)) {
+    const {
+      fileUploadError,
+      fileNotSupported,
+      fileSizeLimitExceed,
+      fileEmptyError,
+      fileNameLimitExceed
+    } = i18nKeys;
+    const {
+      allowedFileExtensions = ["jpeg", "jpg", "png", "gif", "bmp", "ico"],
+      fileNameMaxCharacters = 200,
+      fileSizeMaxBytes = 3 * 1024 * 1024
+    } = inlineImageProps;
+    if (!isFileNameSizeInvalid(file.name, fileNameMaxCharacters)) {
       if (file.size != 0) {
-        if (file.size <= 3 * 1024 * 1024) {
-          if (isImageFormat(file.name)) {
+        if (file.size <= fileSizeMaxBytes) {
+          if (isImageFormat(file.name, allowedFileExtensions)) {
             progress && progress(true);
             this.handleUpload(file).then(res => {
               successCallback(res);
@@ -271,37 +282,33 @@ export default class TextEditor extends Component {
                 triggerKeyup(editorObj.doc);
               }
             }, () => {
-              failureCallback(i18nKeys.fileUploadError);
+              failureCallback(fileUploadError);
             });
           } else {
-            failureCallback(i18nKeys.fileNotSupported);
+            failureCallback(fileNotSupported);
           }
         } else {
-          failureCallback(i18nKeys.fileSizeLimitExceed);
+          failureCallback(fileSizeLimitExceed);
         }
       } else {
-        failureCallback(i18nKeys.fileEmptyError);
+        failureCallback(fileEmptyError);
       }
     } else {
-      failureCallback(i18nKeys.fileNameLimitExceed);
+      failureCallback(fileNameLimitExceed);
     }
-  }
+  } // handleDropUpload(file, successCallback, failureCallback) {
+  //   let e = { target: { files: [file] } };
+  //   let { handleDropUpload } = this.props;
+  //   handleDropUpload(e).then(
+  //     (res) => {
+  //       successCallback(res);
+  //     },
+  //     () => {
+  //       failureCallback();
+  //     }
+  //   );
+  // }
-  handleDropUpload(file, successCallback, failureCallback) {
-    let e = {
-      target: {
-        files: [file]
-      }
-    };
-    let {
-      handleDropUpload
-    } = this.props;
-    handleDropUpload(e).then(res => {
-      successCallback(res);
-    }, () => {
-      failureCallback();
-    });
-  }
   blurCallback() {
     let {
@@ -327,15 +334,7 @@ export default class TextEditor extends Component {
         formData.append(getCSRFCookieName(), getCSRFCookie());
       }
-      return onUpload(formData, file).then(res => {
-        if (editorMode === 'TicketReply') {
-          return `${res.data}&from=r`;
-        }
-        return res.data;
-      }, err => {
-        throw err;
-      });
+      return onUpload(formData, file);
     } catch (err) {
       return Promise.reject();
     }
@@ -355,7 +354,6 @@ export default class TextEditor extends Component {
       let cont = value;
       if (typeof editor !== 'undefined') {
-        // eslint-disable-next-line
         cont = editor['addFormEditor'] && editor['addFormEditor'].getContent();
       }
@@ -384,7 +382,8 @@ export default class TextEditor extends Component {
       loadingComponent,
       isNightMode,
       isReadOnly,
-      dataSelectorId
+      dataSelectorId,
+      isDisabled
     } = this.props;
     let {
       isEditorLoad,
@@ -393,7 +392,7 @@ export default class TextEditor extends Component {
     let editorDoc = ImgLazyLoad && global.editor && global.editor[id] ? global.editor[id].doc : null;
     return /*#__PURE__*/React.createElement(Container, {
       className: `${styles.textEditor} ${styles[type]} ${styles[border]}
-        ${isNightMode ? styles.night : styles.light} ${isReadOnly ? styles.readOnly : ''} ${!isEditorShow ? styles.editorHide : ''}`,
+        ${isNightMode ? styles.night : styles.light} ${isReadOnly ? styles.readOnly : ''} ${isReadOnly || isDisabled ? styles.disable : ''} ${!isEditorShow ? styles.editorHide : ''}`,
       dataId: dataId,
       "data-isEditor": true,
       dataSelectorId: dataSelectorId
@@ -403,7 +402,7 @@ export default class TextEditor extends Component {
       dataId: dataId
     }), editorDoc && ImgLazyLoad ? /*#__PURE__*/React.createElement(ImgLazyLoad, {
       node: editorDoc
-    }) : null, isReadOnly ? /*#__PURE__*/React.createElement("div", {
+    }) : null, isReadOnly || isDisabled ? /*#__PURE__*/React.createElement("div", {
       className: styles.readOnlyMask
     }) : null);
   }

package/es/v1/form/fields/TextEditor/props/defaultProps.js CHANGED Viewed

@@ -9,5 +9,8 @@ export const defaultProps = {
   needInlineAttachment: false,
   isNightMode: false,
   isReadOnly: false,
-  dataSelectorId: 'textEditor'
+  dataSelectorId: 'textEditor',
+  customCSS: '',
+  isDisabled: false,
+  inlineImageProps: {}
 };

package/es/v1/form/fields/TextEditor/props/propTypes.js CHANGED Viewed

@@ -12,7 +12,6 @@ export const propTypes = {
   fontSize: PropTypes.string,
   getRef: PropTypes.func,
   handleAlertMessage: PropTypes.func,
-  handleDropUpload: PropTypes.func,
   i18nKeys: PropTypes.shape({
     fileUploadError: PropTypes.string,
     fileNotSupported: PropTypes.string,
@@ -21,7 +20,7 @@ export const propTypes = {
     fileSizeLimitExceed: PropTypes.string
   }),
   id: PropTypes.string,
-  initCallback: PropTypes.func.isRequired,
+  initCallback: PropTypes.func,
   isCustomScroll: PropTypes.bool,
   loadingComponent: PropTypes.node,
   mode: PropTypes.string,
@@ -42,5 +41,13 @@ export const propTypes = {
   getCSRFCookie: PropTypes.string,
   isEditorDefaultOpen: PropTypes.bool,
   toggleEdit: PropTypes.func,
-  dataSelectorId: PropTypes.string
+  dataSelectorId: PropTypes.string,
+  customInitOption: PropTypes.object,
+  customCSS: PropTypes.string,
+  isDisabled: PropTypes.bool,
+  inlineImageProps: PropTypes.shape({
+    allowedFileExtensions: PropTypes.array,
+    fileNameMaxCharacters: PropTypes.number,
+    fileSizeMaxBytes: PropTypes.number
+  })
 };

package/es/v1/utils/editorUtils.js CHANGED Viewed

@@ -1,5 +1,4 @@
-const ATTACHMENT_FILE_NAME_SIZE_LIMIT = 200; // editorUtils
+// editorUtils
 export function editorContentValidate(editorObj) {
   let content = editorObj && editorObj.getContent && editorObj.getContent() || '';
@@ -48,12 +47,13 @@ export function encodeForHtml(str) {
   return str;
 } // attachment
-export function isFileNameSizeInvalid(fileName) {
-  return fileName.length > ATTACHMENT_FILE_NAME_SIZE_LIMIT;
+export function isFileNameSizeInvalid(fileName, fileNameMaxCharacters) {
+  return fileName.length > fileNameMaxCharacters;
 }
-export function isImageFormat(fileName) {
+export function isImageFormat(fileName, allowedFileExtensions) {
   let extension = getExtensionFromFileName(fileName);
-  return /jpeg|jpg|png|gif|bmp|ico/i.test(extension);
+  const isValidExtension = allowedFileExtensions.includes(extension);
+  return isValidExtension;
 }
 export function getExtensionFromFileName(fileName) {
   if (fileName && fileName.indexOf('.') != -1) {

package/lib/ImportantNotes/__tests__/ImportantNotes.spec.js CHANGED Viewed

@@ -15,4 +15,100 @@ describe('ImportantNotes', function () {
     expect(asFragment()).toMatchSnapshot();
   });
+  test('rendering the text prop', function () {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      text: "sample text for notes"
+    })),
+        asFragment = _render2.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the iconName prop', function () {
+    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      iconName: "ZD-GN-info",
+      text: "sample text for notes"
+    })),
+        asFragment = _render3.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the iconName prop and text and children are empty', function () {
+    var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      iconName: ""
+    })),
+        asFragment = _render4.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the iconName prop is null and given text value', function () {
+    var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      iconName: "",
+      text: "sample text for notes"
+    })),
+        asFragment = _render5.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the iconSize', function () {
+    var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      iconName: "ZD-GN-info",
+      iconSize: "15"
+    })),
+        asFragment = _render6.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the children', function () {
+    var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], null, "children")),
+        asFragment = _render7.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the text and children prop', function () {
+    var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      text: "sample text for notes"
+    }, "Sample text for children")),
+        asFragment = _render8.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the text and children prop is empty', function () {
+    var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      text: ""
+    })),
+        asFragment = _render9.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the iconClass', function () {
+    var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      iconName: "ZD-GN-info",
+      iconClass: "customIconClass"
+    })),
+        asFragment = _render10.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the isCover prop is true', function () {
+    var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], null)),
+        asFragment = _render11.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the isCover prop is false', function () {
+    var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      isCover: false
+    })),
+        asFragment = _render12.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the className prop', function () {
+    var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ImportantNotes["default"], {
+      className: "customClass"
+    })),
+        asFragment = _render13.asFragment;
+    expect(asFragment()).toMatchSnapshot();
+  });
 });