@zohodesk/dot 1.0.0-temp-198.2 → 1.0.0-temp-197.6

package/es/form/fields/DateField/__tests__/DateField.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import DateField from "../DateField";
+import DateField from '../DateField';
 describe('DateField', () => {
   test('rendering the defult props', () => {
     const {

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

@@ -1,4 +1,4 @@
-import { FieldCommonDefaultProps } from "../../props/FieldCommonDefaultProps";
+import { FieldCommonDefaultProps } from '../../props/FieldCommonDefaultProps';
 export const defaultProps = {
   errorType: 'primary',
   openPopupOnMount: false,

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

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { FieldCommonPropTypes } from "../../props/FieldCommonPropTypes";
+import { FieldCommonPropTypes } from '../../props/FieldCommonPropTypes';
 export const propTypes = {
   borderColor: PropTypes.oneOf(['transparent', 'default']),
   datePattern: PropTypes.string,

package/es/form/fields/FieldContainer/FieldContainer.js

@@ -1,7 +1,7 @@
 /**** Libraries ****/
 import React, { PureComponent } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** Components ****/
 
 import { Container } from '@zohodesk/components/lib/Layout';
@@ -10,7 +10,7 @@ import { Container } from '@zohodesk/components/lib/Layout';
 import { Icon } from '@zohodesk/icons';
 /**** CSS ****/
 
-import style from "../Fields.module.css";
+import style from '../Fields.module.css';
 export default class FieldContainer extends PureComponent {
   constructor(props) {
     super(props);

package/es/form/fields/FieldContainer/__tests__/FieldContainer.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import FieldContainer from "../FieldContainer";
+import FieldContainer from '../FieldContainer';
 describe('FieldContainer', () => {
   test('rendering the defult props', () => {
     const {

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

@@ -1,4 +1,4 @@
-import { FieldCommonDefaultProps } from "../../props/FieldCommonDefaultProps";
+import { FieldCommonDefaultProps } from '../../props/FieldCommonDefaultProps';
 export const defaultProps = { ...FieldCommonDefaultProps(),
   renderProps: {},
   alignContainer: 'vertical',

package/es/form/fields/MultiSelectField/MultiSelectField.js

@@ -1,17 +1,17 @@
 /**** Libraries ****/
 import React, { PureComponent } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** Components ****/
 
 import Label from '@zohodesk/components/lib/Label/Label';
 import MultiSelect from '@zohodesk/components/lib/MultiSelect/MultiSelect';
-import ValidationMessage from "../ValidationMessage/ValidationMessage";
+import ValidationMessage from '../ValidationMessage/ValidationMessage';
 import { getUniqueId } from '@zohodesk/components/lib/Provider/IdProvider';
-import FieldContainer from "../FieldContainer/FieldContainer";
+import FieldContainer from '../FieldContainer/FieldContainer';
 /** CSS */
 
-import style from "../Fields.module.css";
+import style from '../Fields.module.css';
 export default class MultiSelectField extends PureComponent {
   constructor(props) {
     super(props);

package/es/form/fields/MultiSelectField/__tests__/MultiSelectField.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import MultiSelectField from "../MultiSelectField";
+import MultiSelectField from '../MultiSelectField';
 describe('MultiSelectField', () => {
   test('rendering the defult props', () => {
     const {

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

@@ -1,4 +1,4 @@
-import { FieldCommonDefaultProps } from "../../props/FieldCommonDefaultProps";
+import { FieldCommonDefaultProps } from '../../props/FieldCommonDefaultProps';
 export const defaultProps = {
   errorType: 'primary',
   isAnimate: false,

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

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { FieldCommonPropTypes } from "../../props/FieldCommonPropTypes";
+import { FieldCommonPropTypes } from '../../props/FieldCommonPropTypes';
 export const propTypes = {
   animationStyle: PropTypes.string,
   borderColor: PropTypes.oneOf(['transparent', 'default', 'dark']),

package/es/form/fields/PhoneField/PhoneField.js

@@ -1,17 +1,17 @@
 /**** Libraries ****/
 import React, { PureComponent } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** Components ****/
 
 import { Icon } from '@zohodesk/icons';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
-import TextBoxField from "../TextBoxField/TextBoxField";
-import Link from "../../../Link/Link";
+import TextBoxField from '../TextBoxField/TextBoxField';
+import Link from '../../../Link/Link';
 /**** CSS ****/
 
-import style from "../Fields.module.css";
-import { formatPhoneUrl } from "../../../utils/General";
+import style from '../Fields.module.css';
+import { formatPhoneUrl } from '../../../utils/General';
 export default class PhoneField extends PureComponent {
   constructor(props) {
     super(props);

package/es/form/fields/PhoneField/__tests__/PhoneField.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import PhoneField from "../PhoneField";
+import PhoneField from '../PhoneField';
 describe('PhoneField', () => {
   test('rendering the defult props', () => {
     const {

package/es/form/fields/RadioField/RadioField.js

@@ -1,16 +1,16 @@
 /**** Libraries ****/
 import React, { PureComponent } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** Components ****/
 
 import Icon from '@zohodesk/icons/es/Icon';
 import Label from '@zohodesk/components/lib/Label/Label';
 import Radio from '@zohodesk/components/lib/Radio/Radio';
-import ValidationMessage from "../ValidationMessage/ValidationMessage";
+import ValidationMessage from '../ValidationMessage/ValidationMessage';
 /** Css */
 
-import style from "../Fields.module.css";
+import style from '../Fields.module.css';
 export default class RadioField extends PureComponent {
   constructor(props) {
     super(props);

package/es/form/fields/RadioField/__tests__/RadioField.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import RadioField from "../RadioField";
+import RadioField from '../RadioField';
 describe('RadioField', () => {
   test('rendering the defult props', () => {
     const {

package/es/form/fields/SelectField/SelectField.js

@@ -1,19 +1,19 @@
 /**** Libraries ****/
 import React, { PureComponent } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** Components ****/
 
 import Label from '@zohodesk/components/lib/Label/Label';
 import Select from '@zohodesk/components/lib/Select/Select';
-import ValidationMessage from "../ValidationMessage/ValidationMessage";
+import ValidationMessage from '../ValidationMessage/ValidationMessage';
 import { getUniqueId } from '@zohodesk/components/lib/Provider/IdProvider';
-import FieldContainer from "../FieldContainer/FieldContainer";
+import FieldContainer from '../FieldContainer/FieldContainer';
 /**** props ****/
 
 /** CSS */
 
-import style from "../Fields.module.css";
+import style from '../Fields.module.css';
 export default class SelectField extends PureComponent {
   constructor(props) {
     super(props);

package/es/form/fields/SelectField/__tests__/SelectField.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import SelectField from "../SelectField";
+import SelectField from '../SelectField';
 describe('SelectField', () => {
   test('rendering the defult props', () => {
     const {

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

@@ -1,4 +1,4 @@
-import { FieldCommonDefaultProps } from "../../props/FieldCommonDefaultProps";
+import { FieldCommonDefaultProps } from '../../props/FieldCommonDefaultProps';
 export const defaultProps = {
   errorType: 'primary',
   needSearch: false,

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

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { FieldCommonPropTypes } from "../../props/FieldCommonPropTypes";
+import { FieldCommonPropTypes } from '../../props/FieldCommonPropTypes';
 export const propTypes = {
   animationStyle: PropTypes.string,
   borderColor: PropTypes.oneOf(['transparent', 'default']),

package/es/form/fields/TagsMultiSelect/TagsMultiSelect.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
 import Tag from '@zohodesk/components/lib/Tag/Tag';
 import TextBoxIcon from '@zohodesk/components/lib/TextBoxIcon/TextBoxIcon';
@@ -8,13 +8,13 @@ import EmptySearch from '@zohodesk/svg/lib/emptystate/version3/EmptySearch';
 import ListItem from '@zohodesk/components/lib/ListItem/ListItem';
 import Loader from '@zohodesk/svg/lib/Loader/Loader';
 import DropDownSeparator from '@zohodesk/components/lib/DropDown/DropDownSeparator';
-import CommonEmptyState from "../../../emptystate/CommonEmptyState/CommonEmptyState";
+import CommonEmptyState from '../../../emptystate/CommonEmptyState/CommonEmptyState';
 import ResponsiveDropBox from '@zohodesk/components/lib/ResponsiveDropBox/ResponsiveDropBox';
 import { ResponsiveReceiver } from '@zohodesk/components/lib/Responsive/CustomResponsive';
 import MultiSelectHeader from '@zohodesk/components/lib/MultiSelect/MultiSelectHeader';
-import { stopBubbling } from "../../../utils/General";
+import { stopBubbling } from '../../../utils/General';
 import { scrollTo, findScrollEnd } from '@zohodesk/components/lib/utils/Common.js';
-import style from "./TagsMultiSelect.module.css";
+import style from './TagsMultiSelect.module.css';
 export default class TagsMultiSelect extends React.Component {
   constructor(props) {
     super(props);

package/es/form/fields/TagsMultiSelect/__tests__/TagsMultiSelect.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import TagsMultiSelect from "../TagsMultiSelect";
+import TagsMultiSelect from '../TagsMultiSelect';
 describe('TagsMultiSelect', () => {
   test('rendering the defult props', () => {
     const {

package/es/form/fields/TagsMultiSelectField/TagsMultiSelectField.js

@@ -1,16 +1,16 @@
 import React, { useState, useEffect } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import { Box } from '@zohodesk/components/lib/Layout';
 import Label from '@zohodesk/components/lib/Label/Label';
 import Popup from '@zohodesk/components/lib/Popup/Popup';
-import ValidationMessage from "../ValidationMessage/ValidationMessage";
-import TagsMultiSelect from "../TagsMultiSelect/TagsMultiSelect";
-import FieldContainer from "../FieldContainer/FieldContainer";
+import ValidationMessage from '../ValidationMessage/ValidationMessage';
+import TagsMultiSelect from '../TagsMultiSelect/TagsMultiSelect';
+import FieldContainer from '../FieldContainer/FieldContainer';
 /**** css ****/
 
-import fieldStyle from "../Fields.module.css";
-import style from "./TagsMultiSelectField.module.css";
+import fieldStyle from '../Fields.module.css';
+import style from './TagsMultiSelectField.module.css';
 
 const TagsMultiSelectField = props => {
   const [selectedSuggestionIndex, updateSelectedSuggestionIndex] = useState(0);

package/es/form/fields/TagsMultiSelectField/__tests__/TagsMultiSelectField.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import TagsMultiSelectField from "../TagsMultiSelectField";
+import TagsMultiSelectField from '../TagsMultiSelectField';
 describe('TagsMultiSelectField', () => {
   test('rendering the defult props', () => {
     const {

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

@@ -1,4 +1,4 @@
-import { FieldCommonDefaultProps } from "../../props/FieldCommonDefaultProps";
+import { FieldCommonDefaultProps } from '../../props/FieldCommonDefaultProps';
 export const defaultProps = {
   fieldProperties: {
     isDisabled: false,

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

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { FieldCommonPropTypes } from "../../props/FieldCommonPropTypes";
+import { FieldCommonPropTypes } from '../../props/FieldCommonPropTypes';
 export const propTypes = {
   fieldProperties: PropTypes.shape({
     id: PropTypes.string.isRequired,

package/es/form/fields/TextBoxField/TextBoxField.js

@@ -1,17 +1,17 @@
 /**** Libraries ****/
 import React, { PureComponent } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** Components ****/
 
 import Label from '@zohodesk/components/lib/Label/Label';
 import TextBoxIcon from '@zohodesk/components/lib/TextBoxIcon/TextBoxIcon';
-import ValidationMessage from "../ValidationMessage/ValidationMessage";
+import ValidationMessage from '../ValidationMessage/ValidationMessage';
 import { getUniqueId } from '@zohodesk/components/lib/Provider/IdProvider';
-import FieldContainer from "../FieldContainer/FieldContainer";
+import FieldContainer from '../FieldContainer/FieldContainer';
 /**** CSS ****/
 
-import style from "../Fields.module.css";
+import style from '../Fields.module.css';
 export default class TextBoxField extends PureComponent {
   constructor(props) {
     super(props);

package/es/form/fields/TextBoxField/__tests__/TextBoxField.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import TextBoxField from "../TextBoxField";
+import TextBoxField from '../TextBoxField';
 describe('TextBoxField', () => {
   test('rendering the defult props', () => {
     const {

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

@@ -1,4 +1,4 @@
-import { FieldCommonDefaultProps } from "../../props/FieldCommonDefaultProps";
+import { FieldCommonDefaultProps } from '../../props/FieldCommonDefaultProps';
 export const defaultProps = {
   errorType: 'primary',
   textBoxSize: 'xmedium',

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

@@ -1,4 +1,4 @@
-import { FieldCommonPropTypes } from "../../props/FieldCommonPropTypes";
+import { FieldCommonPropTypes } from '../../props/FieldCommonPropTypes';
 import PropTypes from 'prop-types';
 export const propTypes = {
   borderColor: PropTypes.oneOf(['transparent', 'default']),

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

@@ -1,16 +1,16 @@
 /***** Libraries *****/
 import React, { Component } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import selectn from 'selectn';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
 /***** Methods *****/
 
-import { bind, editorContentValidate, fixEncoding, isFileNameSizeInvalid, isImageFormat, triggerKeyup, getRichEditorContent, changeContent, validateEditorContentOnInsertHtml, loadResource } from "../../../utils/editorUtils"; //import './ZohoDeskEditor_Init';
+import { bind, editorContentValidate, fixEncoding, isFileNameSizeInvalid, isImageFormat, triggerKeyup, getRichEditorContent, changeContent, validateEditorContentOnInsertHtml, loadResource } from '../../../utils/editorUtils'; //import './ZohoDeskEditor_Init';
 
 /***** components *****/
 
-import styles from "./TextEditor.module.css";
+import styles from './TextEditor.module.css';
 /* eslint-disable camelcase */
 
 /* eslint-disable no-undef */
@@ -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();
     }
@@ -383,7 +382,8 @@ export default class TextEditor extends Component {
       loadingComponent,
       isNightMode,
       isReadOnly,
-      dataSelectorId
+      dataSelectorId,
+      isDisabled
     } = this.props;
     let {
       isEditorLoad,
@@ -392,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 : ''} ${isDisabled ? styles.disable : ''} ${!isEditorShow ? styles.editorHide : ''}`,
       dataId: dataId,
       "data-isEditor": true,
       dataSelectorId: dataSelectorId
@@ -402,8 +402,8 @@ export default class TextEditor extends Component {
       dataId: dataId
     }), editorDoc && ImgLazyLoad ? /*#__PURE__*/React.createElement(ImgLazyLoad, {
       node: editorDoc
-    }) : null, isReadOnly ? /*#__PURE__*/React.createElement("div", {
-      class: styles.readOnlyMask
+    }) : null, isReadOnly || isDisabled ? /*#__PURE__*/React.createElement("div", {
+      className: styles.readOnlyMask
     }) : null);
   }