@zohodesk/dot 1.0.0-temp-197.2 → 1.0.0-temp-197.4

package/README.md

@@ -4,11 +4,11 @@ In this Library, we Provide Some Basic Components to Build Your Application
 
 # 1.5.5
 - **TextEditor (v0&v1)**
-  - `inlineImageProps={allowedFileExtensions, fileNameMaxCharacters, fileSizeMax}` props added.
+  - `inlineImageProps={allowedFileExtensions, fileNameMaxCharacters, fileSizeMaxBytes}` props added.
       - default props, 
         - `allowedFileExtensions: ["jpeg", "jpg", "png", "gif", "bmp", "ico"]`
         - `fileNameMaxCharacters: 200,`
-        - `fileSizeMax: 3 * 1024 * 1024`
+        - `fileSizeMaxBytes: 3 * 1024 * 1024`
   - `customInitOptions` prop added, using this can initialize the editor details.
   - `customCSS` prop suppported to customize the style to apply for editor, it adds css in style tag.
   - In `handleUpload` method reverted the `TicketReply` editor specific case handle.

package/es/form/fields/TextEditor/TextEditor.js

@@ -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,7 +54,7 @@ export default class TextEditor extends Component {
       editorMode = '',
       editorOptions = {},
       needEditorFocus = true,
-      handleDropUpload,
+      // handleDropUpload,
       fontFamily,
       fontSize,
       initCallback,
@@ -68,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',
@@ -126,7 +127,7 @@ export default class TextEditor extends Component {
     getRef && getRef(null);
   }
 
-  componentWillReceiveProps(np) {
+  UNSAFE_componentWillReceiveProps(np) {
     let {
       changeEditorContent
     } = this.props;
@@ -224,18 +225,6 @@ export default class TextEditor extends Component {
       global.editor[id] = editorObj;
     }
 
-    const css = `pre {white-space: pre-wrap}, ${customCSS}`,
-          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;
@@ -251,9 +240,11 @@ 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');
+      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.innerText = `${customizedCSS} ${fontCSS}`;
+      iframeHead.appendChild(customStyleTag);
     }
   }
 
@@ -274,12 +265,12 @@ export default class TextEditor extends Component {
     const {
       allowedFileExtensions,
       fileNameMaxCharacters,
-      fileSizeMax
+      fileSizeMaxBytes
     } = inlineImageProps;
 
     if (!isFileNameSizeInvalid(file.name, fileNameMaxCharacters)) {
       if (file.size != 0) {
-        if (file.size <= fileSizeMax) {
+        if (file.size <= fileSizeMaxBytes) {
           if (isImageFormat(file.name, allowedFileExtensions)) {
             progress && progress(true);
             this.handleUpload(file).then(res => {
@@ -304,23 +295,19 @@ export default class TextEditor extends Component {
     } else {
       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 {
@@ -414,7 +401,7 @@ export default class TextEditor extends Component {
     }), editorDoc && ImgLazyLoad ? /*#__PURE__*/React.createElement(ImgLazyLoad, {
       node: editorDoc
     }) : null, isReadOnly ? /*#__PURE__*/React.createElement("div", {
-      class: styles.readOnlyMask
+      className: styles.readOnlyMask
     }) : null);
   }
 

package/es/form/fields/TextEditor/props/defaultProps.js

@@ -10,9 +10,10 @@ export const defaultProps = {
   isNightMode: false,
   isReadOnly: false,
   dataSelectorId: 'textEditor',
+  customCSS: '',
   inlineImageProps: {
     allowedFileExtensions: ["jpeg", "jpg", "png", "gif", "bmp", "ico"],
     fileNameMaxCharacters: 200,
-    fileSizeMax: 3 * 1024 * 1024
+    fileSizeMaxBytes: 3 * 1024 * 1024
   }
 };

package/es/form/fields/TextEditor/props/propTypes.js

@@ -21,7 +21,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,
@@ -45,9 +45,9 @@ export const propTypes = {
   dataSelectorId: PropTypes.string,
   customInitOptions: PropTypes.object,
   customCSS: PropTypes.string,
-  inlineImageProps: {
+  inlineImageProps: PropTypes.shape({
     allowedFileExtensions: PropTypes.array,
     fileNameMaxCharacters: PropTypes.number,
-    fileSizeMax: PropTypes.number
-  }
+    fileSizeMaxBytes: PropTypes.number
+  })
 };

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

@@ -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,
+      customInitOptions
     } = 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 (!customInitOptions) {
+        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, customInitOptions);
     }
   }
 
@@ -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,11 @@ 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');
+      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.innerText = `${customizedCSS} ${fontCSS}`;
+      iframeHead.appendChild(customStyleTag);
     }
   }
 
@@ -268,12 +265,12 @@ export default class TextEditor extends Component {
     const {
       allowedFileExtensions,
       fileNameMaxCharacters,
-      fileSizeMax
+      fileSizeMaxBytes
     } = inlineImageProps;
 
     if (!isFileNameSizeInvalid(file.name, fileNameMaxCharacters)) {
       if (file.size != 0) {
-        if (file.size <= fileSizeMax) {
+        if (file.size <= fileSizeMaxBytes) {
           if (isImageFormat(file.name, allowedFileExtensions)) {
             progress && progress(true);
             this.handleUpload(file).then(res => {
@@ -298,23 +295,19 @@ export default class TextEditor extends Component {
     } else {
       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 {
@@ -340,15 +333,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();
     }
@@ -368,7 +353,6 @@ export default class TextEditor extends Component {
       let cont = value;
 
       if (typeof editor !== 'undefined') {
-        // eslint-disable-next-line
         cont = editor['addFormEditor'] && editor['addFormEditor'].getContent();
       }
 

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

@@ -10,9 +10,10 @@ export const defaultProps = {
   isNightMode: false,
   isReadOnly: false,
   dataSelectorId: 'textEditor',
+  customCSS: '',
   inlineImageProps: {
     allowedFileExtensions: ["jpeg", "jpg", "png", "gif", "bmp", "ico"],
     fileNameMaxCharacters: 200,
-    fileSizeMax: 3 * 1024 * 1024
+    fileSizeMaxBytes: 3 * 1024 * 1024
   }
 };

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

@@ -21,7 +21,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,
@@ -43,9 +43,9 @@ export const propTypes = {
   isEditorDefaultOpen: PropTypes.bool,
   toggleEdit: PropTypes.func,
   dataSelectorId: PropTypes.string,
-  inlineImageProps: {
+  inlineImageProps: PropTypes.shape({
     allowedFileExtensions: PropTypes.array,
     fileNameMaxCharacters: PropTypes.number,
-    fileSizeMax: PropTypes.number
-  }
+    fileSizeMaxBytes: PropTypes.number
+  })
 };

package/lib/form/fields/TextEditor/TextEditor.js

@@ -27,8 +27,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -70,7 +68,8 @@ var TextEditor = /*#__PURE__*/function (_Component) {
       isResourceLoaded: false,
       isEditorShow: false
     };
-    var methods = ['editorCallback', 'handleUpload', 'handleChange', 'focusCallback', 'handleInlineUpload', 'handleDropUpload', 'blurCallback', 'handleGetContent', 'initializeEditor', 'clearEditorData', 'plainTextSwitchCallback', 'onWindowClick', 'toggleEditor'];
+    var methods = ['editorCallback', 'handleUpload', 'handleChange', 'focusCallback', 'handleInlineUpload', // 'handleDropUpload',
+    'blurCallback', 'handleGetContent', 'initializeEditor', 'clearEditorData', 'plainTextSwitchCallback', 'onWindowClick', 'toggleEditor'];
 
     _editorUtils.bind.apply(_assertThisInitialized(_this), methods);
 
@@ -109,7 +108,6 @@ var TextEditor = /*#__PURE__*/function (_Component) {
           editorOptions = _this$props$editorOpt === void 0 ? {} : _this$props$editorOpt,
           _this$props$needEdito = _this$props.needEditorFocus,
           needEditorFocus = _this$props$needEdito === void 0 ? true : _this$props$needEdito,
-          handleDropUpload = _this$props.handleDropUpload,
           fontFamily = _this$props.fontFamily,
           fontSize = _this$props.fontSize,
           initCallback = _this$props.initCallback,
@@ -118,14 +116,12 @@ var TextEditor = /*#__PURE__*/function (_Component) {
           customInitOptions = _this$props.customInitOptions;
 
       if (id && global.ZohoDeskEditor) {
-        var _defaultObj;
-
-        var defaultObj = (_defaultObj = {
+        var defaultObj = {
           id: id,
           content: (0, _editorUtils.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',
@@ -138,10 +134,15 @@ var TextEditor = /*#__PURE__*/function (_Component) {
           mode: mode,
           handleAlertMessage: handleAlertMessage,
           plainTextSwitchCallback: this.plainTextSwitchCallback,
-          imgAspect: true
-        }, _defineProperty(_defaultObj, "handleInlineDropImage", needInlineAttachment ? this.handleInlineUpload : null), _defineProperty(_defaultObj, "needInlineAttachHandling", needInlineAttachment), _defineProperty(_defaultObj, "hookOnInsertHTML", _editorUtils.validateEditorContentOnInsertHtml), _defineProperty(_defaultObj, "needCustomPaste", function needCustomPaste(event, editorObj) {
-          return true; // By default reply editor needs customPaste, so returning true.
-        }), _defineProperty(_defaultObj, "htmlVersion", '<!Doctype html>'), _defaultObj);
+          imgAspect: true,
+          handleInlineDropImage: needInlineAttachment ? this.handleInlineUpload : null,
+          needInlineAttachHandling: needInlineAttachment,
+          hookOnInsertHTML: _editorUtils.validateEditorContentOnInsertHtml,
+          needCustomPaste: function needCustomPaste(event, editorObj) {
+            return true; // By default reply editor needs customPaste, so returning true.
+          },
+          htmlVersion: '<!Doctype html>'
+        };
 
         if (!customInitOptions) {
           if (!ZohoDeskEditor_Init.init) {
@@ -177,8 +178,8 @@ var TextEditor = /*#__PURE__*/function (_Component) {
       getRef && getRef(null);
     }
   }, {
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(np) {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(np) {
       var changeEditorContent = this.props.changeEditorContent;
       var id = np.id;
       var editorObj = global.editor ? global.editor[id] ? global.editor[id] : {} : {};
@@ -269,18 +270,6 @@ var TextEditor = /*#__PURE__*/function (_Component) {
         global.editor[id] = editorObj;
       }
 
-      var css = "pre {white-space: pre-wrap}, ".concat(customCSS),
-          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);
       var iframe = (0, _selectn["default"])('iframe.contentDocument.body', editorObj) || null;
       var iframeHead = (0, _selectn["default"])('iframe.contentDocument.head', editorObj) || null;
@@ -298,9 +287,11 @@ var TextEditor = /*#__PURE__*/function (_Component) {
           iframe.classList.add('scroll');
         }
 
-        var 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);
+        var customStyleTag = document.createElement('style');
+        var customizedCSS = "pre {white-space: pre-wrap} ".concat(customCSS);
+        var 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.innerText = "".concat(customizedCSS, " ").concat(fontCSS);
+        iframeHead.appendChild(customStyleTag);
       }
     }
   }, {
@@ -318,11 +309,11 @@ var TextEditor = /*#__PURE__*/function (_Component) {
           fileNameLimitExceed = i18nKeys.fileNameLimitExceed;
       var allowedFileExtensions = inlineImageProps.allowedFileExtensions,
           fileNameMaxCharacters = inlineImageProps.fileNameMaxCharacters,
-          fileSizeMax = inlineImageProps.fileSizeMax;
+          fileSizeMaxBytes = inlineImageProps.fileSizeMaxBytes;
 
       if (!(0, _editorUtils.isFileNameSizeInvalid)(file.name, fileNameMaxCharacters)) {
         if (file.size != 0) {
-          if (file.size <= fileSizeMax) {
+          if (file.size <= fileSizeMaxBytes) {
             if ((0, _editorUtils.isImageFormat)(file.name, allowedFileExtensions)) {
               progress && progress(true);
               this.handleUpload(file).then(function (res) {
@@ -347,22 +338,19 @@ var TextEditor = /*#__PURE__*/function (_Component) {
       } else {
         failureCallback(fileNameLimitExceed);
       }
-    }
-  }, {
-    key: "handleDropUpload",
-    value: function handleDropUpload(file, successCallback, failureCallback) {
-      var e = {
-        target: {
-          files: [file]
-        }
-      };
-      var handleDropUpload = this.props.handleDropUpload;
-      handleDropUpload(e).then(function (res) {
-        successCallback(res);
-      }, function () {
-        failureCallback();
-      });
-    }
+    } // handleDropUpload(file, successCallback, failureCallback) {
+    //   let e = { target: { files: [file] } };
+    //   let { handleDropUpload } = this.props;
+    //   handleDropUpload(e).then(
+    //     (res) => {
+    //       successCallback(res);
+    //     },
+    //     () => {
+    //       failureCallback();
+    //     }
+    //   );
+    // }
+
   }, {
     key: "blurCallback",
     value: function blurCallback() {
@@ -451,7 +439,7 @@ var TextEditor = /*#__PURE__*/function (_Component) {
       }), editorDoc && ImgLazyLoad ? /*#__PURE__*/_react["default"].createElement(ImgLazyLoad, {
         node: editorDoc
       }) : null, isReadOnly ? /*#__PURE__*/_react["default"].createElement("div", {
-        "class": _TextEditorModule["default"].readOnlyMask
+        className: _TextEditorModule["default"].readOnlyMask
       }) : null);
     }
   }]);

package/lib/form/fields/TextEditor/props/defaultProps.js

@@ -16,10 +16,11 @@ var defaultProps = {
   isNightMode: false,
   isReadOnly: false,
   dataSelectorId: 'textEditor',
+  customCSS: '',
   inlineImageProps: {
     allowedFileExtensions: ["jpeg", "jpg", "png", "gif", "bmp", "ico"],
     fileNameMaxCharacters: 200,
-    fileSizeMax: 3 * 1024 * 1024
+    fileSizeMaxBytes: 3 * 1024 * 1024
   }
 };
 exports.defaultProps = defaultProps;

package/lib/form/fields/TextEditor/props/propTypes.js

@@ -31,7 +31,7 @@ var propTypes = {
     fileSizeLimitExceed: _propTypes["default"].string
   }),
   id: _propTypes["default"].string,
-  initCallback: _propTypes["default"].func.isRequired,
+  initCallback: _propTypes["default"].func,
   isCustomScroll: _propTypes["default"].bool,
   loadingComponent: _propTypes["default"].node,
   mode: _propTypes["default"].string,
@@ -55,10 +55,10 @@ var propTypes = {
   dataSelectorId: _propTypes["default"].string,
   customInitOptions: _propTypes["default"].object,
   customCSS: _propTypes["default"].string,
-  inlineImageProps: {
+  inlineImageProps: _propTypes["default"].shape({
     allowedFileExtensions: _propTypes["default"].array,
     fileNameMaxCharacters: _propTypes["default"].number,
-    fileSizeMax: _propTypes["default"].number
-  }
+    fileSizeMaxBytes: _propTypes["default"].number
+  })
 };
 exports.propTypes = propTypes;