@elliemae/ds-wysiwygeditor 2.3.1 → 3.0.0-alpha.3

package/dist/esm/quillOverrides/LinkFormat.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/quillOverrides/LinkFormat.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\nimport { Quill } from 'react-quill';\n\nconst sanitizeProtocol = (value) => {\n  if (typeof value === 'boolean') return value;\n  let newVal = value;\n  if (\n    !value.startsWith('http') &&\n    !value.startsWith('ftp') &&\n    !value.startsWith('mailto:') &&\n    !value.startsWith('{{')\n  ) {\n    if (!value.startsWith('www')) {\n      newVal = `https://www.${value}`;\n    } else newVal = `https://${value}`;\n  }\n  return newVal;\n};\n\nfunction getIsValidProtocol(url, protocols) {\n  const anchor = document.createElement('a');\n  anchor.href = url;\n  const protocol = anchor.href.slice(0, anchor.href.indexOf(':'));\n  return protocols.indexOf(protocol) > -1;\n}\n\nconst Link = Quill.import('formats/link');\n\nclass LinkFormat extends Link {\n  blotName = 'link';\n\n  tagName = 'A';\n\n  SANITIZED_URL = 'about:blank';\n\n  PROTOCOL_WHITELIST = ['http', 'ftp', 'https', 'mailto', 'tel'];\n\n  static create(value) {\n    const newVal = sanitizeProtocol(value);\n    const node = super.create(newVal);\n    node.setAttribute('href', newVal);\n    return node;\n  }\n\n  static formats(domNode) {\n    return domNode?.getAttribute?.('href');\n  }\n\n  static sanitize(url) {\n    return getIsValidProtocol(url, this.PROTOCOL_WHITELIST) ? url : this.SANITIZED_URL;\n  }\n\n  format(name, value) {\n    const newVal = sanitizeProtocol(value);\n    // Remove link case\n    if (name === 'link' && value === false) {\n      this.domNode.removeAttribute('href');\n    } else if (name !== this.statics.blotName || !newVal) {\n      super.format(name, newVal);\n    } else {\n      this.domNode.setAttribute('href', this.constructor.sanitize(newVal));\n    }\n  }\n}\n\nexport default LinkFormat;\n"],
+  "mappings": "AAAA;ACCA;AAEA,MAAM,mBAAmB,CAAC,UAAU;AAClC,MAAI,OAAO,UAAU;AAAW,WAAO;AACvC,MAAI,SAAS;AACb,MACE,CAAC,MAAM,WAAW,WAClB,CAAC,MAAM,WAAW,UAClB,CAAC,MAAM,WAAW,cAClB,CAAC,MAAM,WAAW,OAClB;AACA,QAAI,CAAC,MAAM,WAAW,QAAQ;AAC5B,eAAS,eAAe;AAAA;AACnB,eAAS,WAAW;AAAA;AAE7B,SAAO;AAAA;AAGT,4BAA4B,KAAK,WAAW;AAC1C,QAAM,SAAS,SAAS,cAAc;AACtC,SAAO,OAAO;AACd,QAAM,WAAW,OAAO,KAAK,MAAM,GAAG,OAAO,KAAK,QAAQ;AAC1D,SAAO,UAAU,QAAQ,YAAY;AAAA;AAGvC,MAAM,OAAO,MAAM,OAAO;AAE1B,yBAAyB,KAAK;AAAA,EAA9B,cA5BA;AA4BA;AACE,oBAAW;AAEX,mBAAU;AAEV,yBAAgB;AAEhB,8BAAqB,CAAC,QAAQ,OAAO,SAAS,UAAU;AAAA;AAAA,SAEjD,OAAO,OAAO;AACnB,UAAM,SAAS,iBAAiB;AAChC,UAAM,OAAO,MAAM,OAAO;AAC1B,SAAK,aAAa,QAAQ;AAC1B,WAAO;AAAA;AAAA,SAGF,QAAQ,SAAS;AACtB,WAAO,SAAS,eAAe;AAAA;AAAA,SAG1B,SAAS,KAAK;AACnB,WAAO,mBAAmB,KAAK,KAAK,sBAAsB,MAAM,KAAK;AAAA;AAAA,EAGvE,OAAO,MAAM,OAAO;AAClB,UAAM,SAAS,iBAAiB;AAEhC,QAAI,SAAS,UAAU,UAAU,OAAO;AACtC,WAAK,QAAQ,gBAAgB;AAAA,eACpB,SAAS,KAAK,QAAQ,YAAY,CAAC,QAAQ;AACpD,YAAM,OAAO,MAAM;AAAA,WACd;AACL,WAAK,QAAQ,aAAa,QAAQ,KAAK,YAAY,SAAS;AAAA;AAAA;AAAA;AAKlE,IAAO,qBAAQ;",
+  "names": []
+}

package/dist/esm/quillOverrides/PlainClipboard.js

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { Quill } from "react-quill";
+const Clipboard = Quill.import("modules/clipboard");
+const Delta = Quill.import("delta");
+class PlainClipboard extends Clipboard {
+  convert(html = null) {
+    if (typeof html === "string") {
+      this.container.innerHTML = html;
+    }
+    const text = this.container.innerText;
+    this.container.innerHTML = "";
+    return new Delta().insert(text);
+  }
+}
+export {
+  PlainClipboard as default
+};
+//# sourceMappingURL=PlainClipboard.js.map

package/dist/esm/quillOverrides/PlainClipboard.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/quillOverrides/PlainClipboard.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Quill } from 'react-quill';\n\nconst Clipboard = Quill.import('modules/clipboard');\nconst Delta = Quill.import('delta');\n\n/**\n * Just for the sake of an example. https://quilljs.com/docs/modules/\n */\nexport default class PlainClipboard extends Clipboard {\n  convert(html = null) {\n    if (typeof html === 'string') {\n      this.container.innerHTML = html;\n    }\n    const text = this.container.innerText;\n    this.container.innerHTML = '';\n    return new Delta().insert(text);\n  }\n}\n\n// Uncomment if adding custom clipboard, or add in the file you are importing this to\n// Quill.register('modules/clipboard', PlainClipboard)\n"],
+  "mappings": "AAAA;ACAA;AAEA,MAAM,YAAY,MAAM,OAAO;AAC/B,MAAM,QAAQ,MAAM,OAAO;AAK3B,6BAA4C,UAAU;AAAA,EACpD,QAAQ,OAAO,MAAM;AACnB,QAAI,OAAO,SAAS,UAAU;AAC5B,WAAK,UAAU,YAAY;AAAA;AAE7B,UAAM,OAAO,KAAK,UAAU;AAC5B,SAAK,UAAU,YAAY;AAC3B,WAAO,IAAI,QAAQ,OAAO;AAAA;AAAA;",
+  "names": []
+}

package/dist/esm/utils.js

@@ -0,0 +1,21 @@
+import * as React from "react";
+const formatHTML = (html) => {
+  const tab = "	";
+  let result = "";
+  let indent = "";
+  html.split(/>\s*</).forEach((element) => {
+    if (element.match(/^\/\w/)) {
+      indent = indent.substring(tab.length);
+    }
+    result += `${indent}<${element}>\r
+`;
+    if (element.match(/^<?\w[^>]*[^/]$/)) {
+      indent += tab;
+    }
+  });
+  return result.substring(1, result.length - 3);
+};
+export {
+  formatHTML
+};
+//# sourceMappingURL=utils.js.map

package/dist/esm/utils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/utils.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const formatHTML = (html) => {\n  const tab = '\\t';\n  let result = '';\n  let indent = '';\n\n  html.split(/>\\s*</).forEach((element) => {\n    if (element.match(/^\\/\\w/)) {\n      indent = indent.substring(tab.length);\n    }\n\n    result += `${indent}<${element}>\\r\\n`;\n\n    if (element.match(/^<?\\w[^>]*[^/]$/)) {\n      indent += tab;\n    }\n  });\n\n  return result.substring(1, result.length - 3);\n};\n"],
+  "mappings": "AAAA;ACAO,MAAM,aAAa,CAAC,SAAS;AAClC,QAAM,MAAM;AACZ,MAAI,SAAS;AACb,MAAI,SAAS;AAEb,OAAK,MAAM,SAAS,QAAQ,CAAC,YAAY;AACvC,QAAI,QAAQ,MAAM,UAAU;AAC1B,eAAS,OAAO,UAAU,IAAI;AAAA;AAGhC,cAAU,GAAG,UAAU;AAAA;AAEvB,QAAI,QAAQ,MAAM,oBAAoB;AACpC,gBAAU;AAAA;AAAA;AAId,SAAO,OAAO,UAAU,GAAG,OAAO,SAAS;AAAA;",
+  "names": []
+}

package/package.json

@@ -1,79 +1,82 @@
 {
   "name": "@elliemae/ds-wysiwygeditor",
-  "version": "2.3.1",
+  "version": "3.0.0-alpha.3",
   "license": "MIT",
   "description": "ICE MT - Dimsum - WYSIWYG Editor",
-  "module": "./esm/index.js",
-  "main": "./cjs/index.js",
-  "types": "./types/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "module": "./dist/esm/index.js",
+  "main": "./dist/cjs/index.js",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     ".": {
-      "import": "./esm/index.js",
-      "require": "./cjs/index.js"
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
     },
     "./utils": {
-      "import": "./esm/utils.js",
-      "require": "./cjs/utils.js"
+      "import": "./dist/esm/utils.js",
+      "require": "./dist/cjs/utils.js"
     },
     "./quillOverrides/PlainClipboard": {
-      "import": "./esm/quillOverrides/PlainClipboard.js",
-      "require": "./cjs/quillOverrides/PlainClipboard.js"
+      "import": "./dist/esm/quillOverrides/PlainClipboard.js",
+      "require": "./dist/cjs/quillOverrides/PlainClipboard.js"
     },
     "./quillOverrides/LinkFormat": {
-      "import": "./esm/quillOverrides/LinkFormat.js",
-      "require": "./cjs/quillOverrides/LinkFormat.js"
+      "import": "./dist/esm/quillOverrides/LinkFormat.js",
+      "require": "./dist/cjs/quillOverrides/LinkFormat.js"
     },
     "./quillOverrides/IndentStyle": {
-      "import": "./esm/quillOverrides/IndentStyle.js",
-      "require": "./cjs/quillOverrides/IndentStyle.js"
+      "import": "./dist/esm/quillOverrides/IndentStyle.js",
+      "require": "./dist/cjs/quillOverrides/IndentStyle.js"
     },
     "./quillMatchers/clipboardLinkWithTagMatcher": {
-      "import": "./esm/quillMatchers/clipboardLinkWithTagMatcher.js",
-      "require": "./cjs/quillMatchers/clipboardLinkWithTagMatcher.js"
+      "import": "./dist/esm/quillMatchers/clipboardLinkWithTagMatcher.js",
+      "require": "./dist/cjs/quillMatchers/clipboardLinkWithTagMatcher.js"
     },
     "./DSWYSIWYGEditor": {
-      "import": "./esm/DSWYSIWYGEditor.js",
-      "require": "./cjs/DSWYSIWYGEditor.js"
+      "import": "./dist/esm/DSWYSIWYGEditor.js",
+      "require": "./dist/cjs/DSWYSIWYGEditor.js"
     },
     "./constants": {
-      "import": "./esm/constants.js",
-      "require": "./cjs/constants.js"
+      "import": "./dist/esm/constants.js",
+      "require": "./dist/cjs/constants.js"
     },
     "./components/TippedSelect": {
-      "import": "./esm/components/TippedSelect.js",
-      "require": "./cjs/components/TippedSelect.js"
+      "import": "./dist/esm/components/TippedSelect.js",
+      "require": "./dist/cjs/components/TippedSelect.js"
     },
     "./components/TippedButton": {
-      "import": "./esm/components/TippedButton.js",
-      "require": "./cjs/components/TippedButton.js"
+      "import": "./dist/esm/components/TippedButton.js",
+      "require": "./dist/cjs/components/TippedButton.js"
     },
     "./components/InsertFieldModal": {
-      "import": "./esm/components/InsertFieldModal.js",
-      "require": "./cjs/components/InsertFieldModal.js"
+      "import": "./dist/esm/components/InsertFieldModal.js",
+      "require": "./dist/cjs/components/InsertFieldModal.js"
     },
     "./components/ImageLibraryModal": {
-      "import": "./esm/components/ImageLibraryModal.js",
-      "require": "./cjs/components/ImageLibraryModal.js"
+      "import": "./dist/esm/components/ImageLibraryModal.js",
+      "require": "./dist/cjs/components/ImageLibraryModal.js"
     },
     "./components/DSWYSIWYGEditorImpl": {
-      "import": "./esm/components/DSWYSIWYGEditorImpl.js",
-      "require": "./cjs/components/DSWYSIWYGEditorImpl.js"
+      "import": "./dist/esm/components/DSWYSIWYGEditorImpl.js",
+      "require": "./dist/cjs/components/DSWYSIWYGEditorImpl.js"
     },
     "./components/CustomToolbar": {
-      "import": "./esm/components/CustomToolbar.js",
-      "require": "./cjs/components/CustomToolbar.js"
+      "import": "./dist/esm/components/CustomToolbar.js",
+      "require": "./dist/cjs/components/CustomToolbar.js"
     },
     "./components/CustomImageUploader": {
-      "import": "./esm/components/CustomImageUploader.js",
-      "require": "./cjs/components/CustomImageUploader.js"
+      "import": "./dist/esm/components/CustomImageUploader.js",
+      "require": "./dist/cjs/components/CustomImageUploader.js"
     },
     "./components/customFields": {
-      "import": "./esm/components/customFields.js",
-      "require": "./cjs/components/customFields.js"
+      "import": "./dist/esm/components/customFields.js",
+      "require": "./dist/cjs/components/customFields.js"
     },
     "./components/colors": {
-      "import": "./esm/components/colors.js",
-      "require": "./cjs/components/colors.js"
+      "import": "./dist/esm/components/colors.js",
+      "require": "./dist/cjs/components/colors.js"
     }
   },
   "sideEffects": [
@@ -85,25 +88,25 @@
     "url": "https://git.elliemae.io/platform-ui/dimsum.git"
   },
   "engines": {
-    "npm": ">=7",
-    "node": ">=14"
+    "pnpm": ">=6",
+    "node": ">=16"
   },
   "author": "ICE MT",
-  "scripts": {
-    "dev": "cross-env NODE_ENV=development && node ../../scripts/build/build.js -w",
-    "prebuild": "exit 0",
-    "predev": "exit 0",
-    "build": "node ../../scripts/build/build.js"
+  "jestSonar": {
+    "sonar56x": true,
+    "reportPath": "reports",
+    "reportFile": "tests.xml",
+    "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.3.1",
-    "@elliemae/ds-dropdownmenu": "2.3.1",
-    "@elliemae/ds-icons": "2.3.1",
-    "@elliemae/ds-imagelibrarymodal": "2.3.1",
-    "@elliemae/ds-modal": "2.3.1",
-    "@elliemae/ds-shared": "2.3.1",
-    "@elliemae/ds-tooltip": "2.3.1",
-    "@elliemae/ds-uploader": "2.3.1",
+    "@elliemae/ds-button": "3.0.0-alpha.3",
+    "@elliemae/ds-dropdownmenu": "3.0.0-alpha.3",
+    "@elliemae/ds-icons": "3.0.0-alpha.3",
+    "@elliemae/ds-imagelibrarymodal": "3.0.0-alpha.3",
+    "@elliemae/ds-modal": "3.0.0-alpha.3",
+    "@elliemae/ds-shared": "3.0.0-alpha.3",
+    "@elliemae/ds-tooltip": "3.0.0-alpha.3",
+    "@elliemae/ds-uploader": "3.0.0-alpha.3",
     "prop-types": "~15.7.2",
     "quill-blot-formatter": "~1.0.5",
     "quill-delta": "4.2.2",
@@ -112,12 +115,18 @@
   },
   "publishConfig": {
     "access": "public",
-    "directory": "dist",
-    "generateSubmodules": true
+    "typeSafety": false
   },
   "peerDependencies": {
     "lodash": "^4.17.21",
     "react": "~17.0.2",
     "react-dom": "^17.0.2"
+  },
+  "scripts": {
+    "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
+    "test": "node ../../scripts/testing/test.mjs",
+    "lint": "node ../../scripts/lint.mjs",
+    "dts": "node ../../scripts/dts.mjs",
+    "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs"
   }
 }

package/cjs/DSWYSIWYGEditor.js

@@ -1,82 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-require('core-js/modules/web.dom-collections.iterator.js');
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var React = require('react');
-var reactDesc = require('react-desc');
-var DSWYSIWYGEditorImpl = require('./components/DSWYSIWYGEditorImpl.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-
-const _excluded = ["value", "onChange", "getQuillRef", "quillModules", "customToolbar", "toolbarHandlers", "showRawHTML", "height", "hideItems"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-const DSWYSIWYGEditor = _ref => {
-  let {
-    value = '',
-    onChange = () => null,
-    getQuillRef = () => null,
-    quillModules = {},
-    customToolbar,
-    toolbarHandlers,
-    showRawHTML = false,
-    height,
-    hideItems
-  } = _ref,
-      rest = _objectWithoutProperties__default["default"](_ref, _excluded);
-
-  const emptyAction = () => {};
-
-  const [showHTML, setShowHTML] = React.useState(showRawHTML);
-  React.useEffect(() => setShowHTML(showRawHTML), [showRawHTML]);
-  return /*#__PURE__*/jsxRuntime.jsx(DSWYSIWYGEditorImpl, _objectSpread({
-    forceHttpLink: true,
-    handleCustomFieldClick: emptyAction,
-    handleImageClick: emptyAction,
-    quillOverrides: [],
-    value: value,
-    onChange: onChange,
-    getQuillRef: getQuillRef,
-    quillModules: quillModules,
-    customToolbar: customToolbar,
-    toolbarHandlers: toolbarHandlers,
-    showRawHTML: showHTML,
-    onShowHTML: () => setShowHTML(!showHTML),
-    height: height,
-    hideItems: hideItems
-  }, rest));
-};
-
-const wysiwygEditorProps = {
-  value: reactDesc.PropTypes.string.description('editors value').isRequired,
-  onChange: reactDesc.PropTypes.func.description("(content, delta, source, editor) : Called back with the new contents of the editor after change. \n    It will be passed the HTML contents of the editor, a delta object expressing the change, the source of the change, and finally a read-only proxy to editor accessors such as getHTML(). \n    \u26A0\uFE0F Do not use this delta object as value, as it will cause a loop. \n    Use editor.getContents() instead. See Using Deltas for details. \n    Read more: https://github.com/zenoamaro/react-quill#props").isRequired,
-  getQuillRef: reactDesc.PropTypes.func.description('function to use quill.js ref'),
-  quillModules: reactDesc.PropTypes.object.description('object to override quill modules'),
-  customToolbar: reactDesc.PropTypes.element.description('custom toolbar'),
-  toolbarHandlers: reactDesc.PropTypes.object.description('object with toolbar handlers'),
-  showRawHTML: reactDesc.PropTypes.bool.description('whether to display html view or not').defaultValue(false),
-  height: reactDesc.PropTypes.string.description('heigth of the editors text area'),
-  readOnly: reactDesc.PropTypes.string.description("If true, the editor won't allow changing its contents. Wraps the Quill disable API."),
-  hideItems: reactDesc.PropTypes.object.description('object of defaultItems to be removed from toolbar').defaultValue({}),
-  zIndex: reactDesc.PropTypes.number.description('zIndex to be used (required when used in a modal for correct tooltips displaying)')
-};
-const WYSIWYWithSchema = reactDesc.describe(DSWYSIWYGEditor);
-WYSIWYWithSchema.propTypes = wysiwygEditorProps;
-
-exports.WYSIWYWithSchema = WYSIWYWithSchema;
-exports["default"] = DSWYSIWYGEditor;

package/cjs/components/CustomImageUploader.js

@@ -1,125 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('core-js/modules/web.dom-collections.iterator.js');
-var React = require('react');
-var dsIcons = require('@elliemae/ds-icons');
-var DSUploader = require('@elliemae/ds-uploader');
-var DSModal = require('@elliemae/ds-modal');
-var TippedButton = require('./TippedButton.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var DSUploader__default = /*#__PURE__*/_interopDefaultLegacy(DSUploader);
-var DSModal__default = /*#__PURE__*/_interopDefaultLegacy(DSModal);
-
-const ALLOWED_TYPES_TEXT = 'JPG, JPEG, PNG, GIF, BMP, TIFF';
-const ALLOWED_TYPES = /image\/(jpeg|jpg|png|gif|bmp|tiff)/;
-const DEFAULT_MAX_SIZE = 1024 * 1024; // 1 MB
-
-const CustomImageUploader = _ref => {
-  let {
-    quillRef,
-    editorFieldName,
-    allowedImageTypes = ALLOWED_TYPES_TEXT,
-    uploadAsset = () => null,
-    zIndex = 1
-  } = _ref;
-  const [isOpen, setIsOpen] = React.useState(false);
-  const [error, setError] = React.useState(null);
-  const [inProgress, setInProgress] = React.useState(false);
-  const [lastSelection, setLastSelection] = React.useState({
-    index: 0,
-    length: 0
-  });
-  const elementId = "uploadImage".concat(editorFieldName); // eslint-disable-next-line consistent-return
-
-  const handleFileChange = async files => {
-    if (!inProgress) {
-      setError(null);
-      const selectedFile = files[0];
-
-      if (!selectedFile) {
-        setError('Please select a file.');
-        return false;
-      }
-
-      if (!selectedFile.type.match(ALLOWED_TYPES)) {
-        setError('File must be an image.');
-      } else if (selectedFile.size > DEFAULT_MAX_SIZE) {
-        setError('File is too large.');
-      } else {
-        const fr = new FileReader();
-
-        fr.onload = async () => {
-          setInProgress(true);
-
-          try {
-            const url = await uploadAsset({
-              name: selectedFile.name,
-              type: selectedFile.type,
-              description: selectedFile.name,
-              isSystemAsset: false,
-              file: fr.result
-            });
-            setIsOpen(false);
-            quillRef === null || quillRef === void 0 ? void 0 : quillRef.getEditor().insertEmbed((lastSelection === null || lastSelection === void 0 ? void 0 : lastSelection.index) || 0, 'image', url);
-          } catch (e) {
-            setError('An error has occurred, try again');
-          }
-
-          setInProgress(false);
-        };
-
-        fr.readAsArrayBuffer(selectedFile);
-      }
-    }
-  };
-
-  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/_jsx__default["default"](TippedButton.TippedButton, {
-      zIndex: zIndex,
-      tip: "Insert Image",
-      onClick: () => {
-        setLastSelection(quillRef === null || quillRef === void 0 ? void 0 : quillRef.getEditor().getSelection());
-        setIsOpen(true);
-      }
-    }, void 0, /*#__PURE__*/_jsx__default["default"](dsIcons.Image, {
-      color: ['neutral', 500],
-      size: "s"
-    })), /*#__PURE__*/_jsx__default["default"](DSModal__default["default"], {
-      isOpen: isOpen,
-      title: "",
-      onConfirm: () => {
-        setIsOpen(false);
-      },
-      onClose: () => {
-        setIsOpen(false);
-      },
-      showClose: true,
-      version: 2,
-      size: "xsmall",
-      modalType: DSModal.MODAL_TYPE_V2.DECISION,
-      confirmLabel: "Cancel",
-      message: ""
-    }, void 0, !inProgress && /*#__PURE__*/_jsx__default["default"](DSUploader__default["default"], {
-      containerProps: {
-        id: elementId
-      },
-      showAltAction: false,
-      acceptedTypesText: allowedImageTypes,
-      onDrop: handleFileChange
-    }), inProgress && 'Upload in progress...', error && /*#__PURE__*/_jsx__default["default"]("div", {
-      style: {
-        color: 'red',
-        marginTop: '10px'
-      }
-    }, void 0, error))]
-  });
-};
-
-exports.CustomImageUploader = CustomImageUploader;