@entur-partner/rich-text-editor 6.2.3 → 6.2.4-alpha.1

package/dist/rich-text-editor.cjs.development.js

@@ -2,189 +2,76 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var expand = require('@entur/expand');
+var form = require('@entur/form');
+var common = require('@entur-partner/common');
 var React = require('react');
+var typography = require('@entur/typography');
+var cx = require('classnames');
 var draftJs = require('draft-js');
 var PropTypes = require('prop-types');
-var cx = require('classnames');
-var typography = require('@entur/typography');
-var dropdown = require('@entur/dropdown');
 var reactI18next = require('react-i18next');
-var form = require('@entur/form');
-var icons = require('@entur/icons');
-var common = require('@entur-partner/common');
 var button = require('@entur/button');
-var tooltip = require('@entur/tooltip');
+var icons = require('@entur/icons');
+var dropdown = require('@entur/dropdown');
 var menu = require('@entur/menu');
-var expand = require('@entur/expand');
+var tooltip = require('@entur/tooltip');
 var markdownDraftJs = require('markdown-draft-js');
 var showdown = require('showdown');
 var draftConvert = require('draft-convert');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
-var showdown__default = /*#__PURE__*/_interopDefaultLegacy(showdown);
-
 function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-function _inheritsLoose(subClass, superClass) {
-  subClass.prototype = Object.create(superClass.prototype);
-  subClass.prototype.constructor = subClass;
-  _setPrototypeOf(subClass, superClass);
+    return n;
+  }, _extends.apply(null, arguments);
 }
-function _setPrototypeOf(o, p) {
-  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
-    o.__proto__ = p;
-    return o;
-  };
-  return _setPrototypeOf(o, p);
+function _inheritsLoose(t, o) {
+  t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o);
 }
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (-1 !== e.indexOf(n)) continue;
+    t[n] = r[n];
   }
-  return target;
+  return t;
+}
+function _setPrototypeOf(t, e) {
+  return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
+    return t.__proto__ = e, t;
+  }, _setPrototypeOf(t, e);
+}
+
+var Key = /*#__PURE__*/Object.freeze({
+  ENTER: 13
+});
+function getKey(event) {
+  return event.keyCode || event.which;
 }
 
 function useI18N() {
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t,
     language = _useTranslation.i18n.language;
-  if (language !== 'nb' && language !== 'en' && language !== 'nb-NO' && language !== 'en-GB') {
-    throw Error('Language must be either nb or en.');
+  if (language !== "nb" && language !== "en" && language !== "nb-NO" && language !== "en-GB") {
+    throw Error("Language must be either nb or en.");
   }
   return t;
 }
 function withI18n(Component) {
   return function WrappedComponent(props) {
     var t = useI18N();
-    return /*#__PURE__*/React__default["default"].createElement(Component, _extends({}, props, {
+    return /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       i18n: t
     }));
   };
 }
 
-var BlockTypeDropdown = /*#__PURE__*/function (_Component) {
-  function BlockTypeDropdown() {
-    var _this;
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _Component.call.apply(_Component, [this].concat(args)) || this;
-    _this.handleOnClick = function (selectedOption) {
-      var onChange = _this.props.onChange;
-      onChange(selectedOption);
-    };
-    return _this;
-  }
-  _inheritsLoose(BlockTypeDropdown, _Component);
-  var _proto = BlockTypeDropdown.prototype;
-  _proto.toItem = function toItem(option) {
-    return {
-      value: option.style,
-      label: this.renderFormattedLabel(option.label)
-    };
-  };
-  _proto.renderFormattedLabel = function renderFormattedLabel(label) {
-    var formattedLabelText = this.props.i18n(label);
-    switch (label) {
-      case 'styles.p':
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "default-p"
-        }, formattedLabelText);
-      case 'styles.h1':
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "default-h1"
-        }, formattedLabelText);
-      case 'styles.h2':
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "default-h2"
-        }, formattedLabelText);
-      case 'styles.h3':
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "default-h3"
-        }, formattedLabelText);
-      case 'styles.h4':
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "default-h4"
-        }, formattedLabelText);
-      case 'styles.h5':
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "default-h5"
-        }, formattedLabelText);
-      case 'styles.h6':
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "default-h6"
-        }, formattedLabelText);
-      default:
-        return /*#__PURE__*/React__default["default"].createElement("p", null, formattedLabelText);
-    }
-  };
-  _proto.render = function render() {
-    var _this2 = this;
-    var _this$props = this.props,
-      options = _this$props.options,
-      selected = _this$props.selected,
-      i18n = _this$props.i18n;
-    return /*#__PURE__*/React__default["default"].createElement(dropdown.Dropdown, {
-      className: "block-type-dropdown",
-      items: options.map(function (option) {
-        return _this2.toItem(option);
-      }),
-      selectedItem: this.toItem(selected),
-      label: i18n('styles.style'),
-      onChange: function onChange(selectedItem) {
-        return _this2.handleOnClick(selectedItem.value);
-      }
-    });
-  };
-  return BlockTypeDropdown;
-}(React.Component);
-var BlockTypeDropdown$1 = /*#__PURE__*/withI18n(BlockTypeDropdown);
-
-var BlockTypeControls = function BlockTypeControls(_ref) {
-  var editorState = _ref.editorState,
-    blockTypes = _ref.blockTypes,
-    onToggle = _ref.onToggle;
-  var selection = editorState.getSelection();
-  var blockTypeStyle = editorState.getCurrentContent().getBlockForKey(selection.getStartKey()).getType();
-  var selectedOption = blockTypes.find(function (option) {
-    return option.style === blockTypeStyle;
-  }) || blockTypes[0];
-  return /*#__PURE__*/React__default["default"].createElement(BlockTypeDropdown$1, {
-    options: blockTypes,
-    selected: selectedOption,
-    onChange: onToggle
-  });
-};
-
-var Key = /*#__PURE__*/Object.freeze({
-  ENTER: 13
-});
-function getKey(event) {
-  return event.keyCode || event.which;
-}
-
 var StyleButton = /*#__PURE__*/function (_Component) {
   function StyleButton() {
     var _this;
@@ -217,20 +104,26 @@ var StyleButton = /*#__PURE__*/function (_Component) {
       label = _this$props3.label,
       title = _this$props3.title,
       hotKey = _this$props3.hotKey;
-    var classNames = cx__default["default"]('editor-stylebutton', {
+    var classNames = cx("editor-stylebutton", {
       active: active
     });
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: classNames,
-      onMouseDown: this.onToggle,
-      title: i18n(title) + hotKey,
-      tabIndex: 0,
-      onKeyPress: function onKeyPress(event) {
-        if (getKey(event) === Key.ENTER) {
-          _this2.onToggleNoEvent();
+    return (
+      /*#__PURE__*/
+      // biome-ignore lint/a11y/noStaticElementInteractions: Ignore for now.
+      React.createElement("div", {
+        className: classNames,
+        onMouseDown: this.onToggle,
+        title: i18n(title) + hotKey
+        // biome-ignore lint/a11y/noNoninteractiveTabindex: Ignore for now.
+        ,
+        tabIndex: 0,
+        onKeyPress: function onKeyPress(event) {
+          if (getKey(event) === Key.ENTER) {
+            _this2.onToggleNoEvent();
+          }
         }
-      }
-    }, label);
+      }, label)
+    );
   };
   return StyleButton;
 }(React.Component);
@@ -242,11 +135,11 @@ var BlockTypeButtonControls = function BlockTypeButtonControls(props) {
     onToggle = props.onToggle;
   var selection = editorState.getSelection();
   var blockTypeStyle = editorState.getCurrentContent().getBlockForKey(selection.getStartKey()).getType();
-  return /*#__PURE__*/React__default["default"].createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: "controls-group block-editor-controls"
-  }, blockTypes.map(function (type, i) {
-    return /*#__PURE__*/React__default["default"].createElement(StyleButton$1, {
-      key: i,
+  }, blockTypes.map(function (type) {
+    return /*#__PURE__*/React.createElement(StyleButton$1, {
+      key: type.style + type.label,
       active: type.style === blockTypeStyle,
       label: type.label,
       onToggle: onToggle,
@@ -264,7 +157,7 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
     }
     _this = _Component.call.apply(_Component, [this].concat(args)) || this;
     _this.state = {
-      urlValue: '',
+      urlValue: "",
       showUrlInput: false,
       hasLink: false
     };
@@ -283,7 +176,7 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
         var startOffset = selection.getStartOffset();
         var blockWithLinkAtBeginning = currentContent.getBlockForKey(startKey);
         var linkKey = blockWithLinkAtBeginning.getEntityAt(startOffset);
-        var url = '';
+        var url = "";
         if (linkKey) {
           var linkInstance = currentContent.getEntity(linkKey);
           url = linkInstance.getData().url;
@@ -302,7 +195,7 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
         editorState = _this$props.editorState,
         onToggle = _this$props.onToggle;
       var contentState = editorState.getCurrentContent();
-      var contentStateWithEntity = contentState.createEntity('LINK', 'MUTABLE', {
+      var contentStateWithEntity = contentState.createEntity("LINK", "MUTABLE", {
         url: urlValue
       });
       var entityKey = contentStateWithEntity.getLastCreatedEntityKey();
@@ -312,14 +205,14 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
       onToggle(newEditorState, entityKey);
       _this.setState({
         showUrlInput: false,
-        urlValue: ''
+        urlValue: ""
       });
     };
     _this.cancelLink = function (e) {
       e.preventDefault();
       _this.setState({
         showUrlInput: false,
-        urlValue: ''
+        urlValue: ""
       });
     };
     _this.onLinkInputKeyDown = function (e) {
@@ -350,23 +243,23 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
     var _this$state = this.state,
       showUrlInput = _this$state.showUrlInput,
       hasLink = _this$state.hasLink;
-    return /*#__PURE__*/React__default["default"].createElement("div", {
+    return /*#__PURE__*/React.createElement("div", {
       className: "controls-group block-editor-controls link-controls"
-    }, /*#__PURE__*/React__default["default"].createElement("div", {
+    }, /*#__PURE__*/React.createElement("div", {
       className: "editor-stylebutton",
-      title: i18n('styles.link'),
+      title: i18n("styles.link"),
       onClick: this.addLink,
       tabIndex: 0
-    }, /*#__PURE__*/React__default["default"].createElement(icons.LinkIcon, null)), showUrlInput && /*#__PURE__*/React__default["default"].createElement("div", {
+    }, /*#__PURE__*/React.createElement(icons.LinkIcon, null)), showUrlInput && /*#__PURE__*/React.createElement("div", {
       className: "url-input-container"
-    }, /*#__PURE__*/React__default["default"].createElement("span", {
+    }, /*#__PURE__*/React.createElement("span", {
       className: "exit-button",
       onMouseDown: this.cancelLink
-    }, /*#__PURE__*/React__default["default"].createElement(icons.CloseIcon, null)), /*#__PURE__*/React__default["default"].createElement("div", {
+    }, /*#__PURE__*/React.createElement(icons.CloseIcon, null)), /*#__PURE__*/React.createElement("div", {
       className: "link-label"
-    }, i18n('common.from')), /*#__PURE__*/React__default["default"].createElement("div", {
+    }, i18n("common.from")), /*#__PURE__*/React.createElement("div", {
       className: "url-input-form"
-    }, /*#__PURE__*/React__default["default"].createElement(form.TextField, {
+    }, /*#__PURE__*/React.createElement(form.TextField, {
       style: {
         width: 250,
         margin: 5
@@ -375,35 +268,129 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
       value: this.state.urlValue,
       onKeyDown: this.onLinkInputKeyDown,
       placeholder: "https://example.com"
-    }), /*#__PURE__*/React__default["default"].createElement(button.SecondarySquareButton, {
+    }), /*#__PURE__*/React.createElement(button.SecondarySquareButton, {
       onMouseDown: this.confirmLink
-    }, /*#__PURE__*/React__default["default"].createElement(icons.CheckIcon, {
+    }, /*#__PURE__*/React.createElement(icons.CheckIcon, {
       width: 15,
       height: 15
-    }))), hasLink && /*#__PURE__*/React__default["default"].createElement("div", {
+    }))), hasLink && /*#__PURE__*/React.createElement("div", {
       className: "remove-link"
-    }, /*#__PURE__*/React__default["default"].createElement(common.Unbutton, {
+    }, /*#__PURE__*/React.createElement(common.Unbutton, {
       onClick: this.removeLink,
-      title: i18n('styles.unlink')
-    }, /*#__PURE__*/React__default["default"].createElement(icons.UnlinkIcon, null), i18n('styles.unlink')))));
+      title: i18n("styles.unlink")
+    }, /*#__PURE__*/React.createElement(icons.UnlinkIcon, null), i18n("styles.unlink")))));
   };
   return BlockTypeLinkControls;
 }(React.Component);
 BlockTypeLinkControls.propTypes = {
-  editorState: PropTypes__default["default"].object,
-  onToggle: PropTypes__default["default"].func
+  editorState: PropTypes.object,
+  onToggle: PropTypes.func
 };
 var BlockTypeLinkControls$1 = /*#__PURE__*/withI18n(BlockTypeLinkControls);
 
+var BlockTypeDropdown = /*#__PURE__*/function (_Component) {
+  function BlockTypeDropdown() {
+    var _this;
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _Component.call.apply(_Component, [this].concat(args)) || this;
+    _this.handleOnClick = function (selectedOption) {
+      var onChange = _this.props.onChange;
+      onChange(selectedOption);
+    };
+    return _this;
+  }
+  _inheritsLoose(BlockTypeDropdown, _Component);
+  var _proto = BlockTypeDropdown.prototype;
+  _proto.toItem = function toItem(option) {
+    return {
+      value: option.style,
+      label: this.renderFormattedLabel(option.label)
+    };
+  };
+  _proto.renderFormattedLabel = function renderFormattedLabel(label) {
+    var formattedLabelText = this.props.i18n(label);
+    switch (label) {
+      case "styles.p":
+        return /*#__PURE__*/React.createElement("div", {
+          className: "default-p"
+        }, formattedLabelText);
+      case "styles.h1":
+        return /*#__PURE__*/React.createElement("div", {
+          className: "default-h1"
+        }, formattedLabelText);
+      case "styles.h2":
+        return /*#__PURE__*/React.createElement("div", {
+          className: "default-h2"
+        }, formattedLabelText);
+      case "styles.h3":
+        return /*#__PURE__*/React.createElement("div", {
+          className: "default-h3"
+        }, formattedLabelText);
+      case "styles.h4":
+        return /*#__PURE__*/React.createElement("div", {
+          className: "default-h4"
+        }, formattedLabelText);
+      case "styles.h5":
+        return /*#__PURE__*/React.createElement("div", {
+          className: "default-h5"
+        }, formattedLabelText);
+      case "styles.h6":
+        return /*#__PURE__*/React.createElement("div", {
+          className: "default-h6"
+        }, formattedLabelText);
+      default:
+        return /*#__PURE__*/React.createElement("p", null, formattedLabelText);
+    }
+  };
+  _proto.render = function render() {
+    var _this2 = this;
+    var _this$props = this.props,
+      options = _this$props.options,
+      selected = _this$props.selected,
+      i18n = _this$props.i18n;
+    return /*#__PURE__*/React.createElement(dropdown.Dropdown, {
+      className: "block-type-dropdown",
+      items: options.map(function (option) {
+        return _this2.toItem(option);
+      }),
+      selectedItem: this.toItem(selected),
+      label: i18n("styles.style"),
+      onChange: function onChange(selectedItem) {
+        return _this2.handleOnClick(selectedItem.value);
+      }
+    });
+  };
+  return BlockTypeDropdown;
+}(React.Component);
+var BlockTypeDropdown$1 = /*#__PURE__*/withI18n(BlockTypeDropdown);
+
+var BlockTypeControls = function BlockTypeControls(_ref) {
+  var editorState = _ref.editorState,
+    blockTypes = _ref.blockTypes,
+    onToggle = _ref.onToggle;
+  var selection = editorState.getSelection();
+  var blockTypeStyle = editorState.getCurrentContent().getBlockForKey(selection.getStartKey()).getType();
+  var selectedOption = blockTypes.find(function (option) {
+    return option.style === blockTypeStyle;
+  }) || blockTypes[0];
+  return /*#__PURE__*/React.createElement(BlockTypeDropdown$1, {
+    options: blockTypes,
+    selected: selectedOption,
+    onChange: onToggle
+  });
+};
+
 var InlineStyleControls = function InlineStyleControls(props) {
   var editorState = props.editorState,
     inlineStyles = props.inlineStyles;
   var currentStyle = editorState.getCurrentInlineStyle();
-  return /*#__PURE__*/React__default["default"].createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: "controls-group inline-editor-controls"
-  }, inlineStyles.map(function (type, i) {
-    return /*#__PURE__*/React__default["default"].createElement(StyleButton$1, {
-      key: i,
+  }, inlineStyles.map(function (type) {
+    return /*#__PURE__*/React.createElement(StyleButton$1, {
+      key: type.style + type.label,
       active: currentStyle.has(type.style),
       label: type.label,
       onToggle: props.onToggle,
@@ -426,7 +413,7 @@ var TagControls = /*#__PURE__*/function (_Component) {
       isOpen: false
     };
     _this.handleClickOutside = function (e) {
-      if (_this.tagControlRef && _this.tagControlRef.current && !_this.tagControlRef.current.contains(e.target)) {
+      if (_this.tagControlRef.current && !_this.tagControlRef.current.contains(e.target)) {
         _this.setState({
           isOpen: false
         });
@@ -446,10 +433,10 @@ var TagControls = /*#__PURE__*/function (_Component) {
   _inheritsLoose(TagControls, _Component);
   var _proto = TagControls.prototype;
   _proto.componentDidMount = function componentDidMount() {
-    document.addEventListener('mousedown', this.handleClickOutside);
+    document.addEventListener("mousedown", this.handleClickOutside);
   };
   _proto.componentWillUnmount = function componentWillUnmount() {
-    document.removeEventListener('mousedown', this.handleClickOutside);
+    document.removeEventListener("mousedown", this.handleClickOutside);
   };
   _proto.render = function render() {
     var _this2 = this;
@@ -457,23 +444,23 @@ var TagControls = /*#__PURE__*/function (_Component) {
       i18n = _this$props2.i18n,
       tags = _this$props2.tags;
     var isOpen = this.state.isOpen;
-    var menuItems = tags.map(function (tag, i) {
-      var delimiter = tag.delimiter || '{}';
-      return /*#__PURE__*/React__default["default"].createElement(menu.OverflowMenuItem, {
-        key: i,
+    var menuItems = tags.map(function (tag) {
+      var delimiter = tag.delimiter || "{}";
+      return /*#__PURE__*/React.createElement(menu.OverflowMenuItem, {
+        key: tag.tag,
         className: "tag-control",
-        id: 'tag-control-' + tag.tag,
+        id: "tag-control-" + tag.tag,
         onClick: function onClick() {
           return _this2.handleTagClick(tag.tag, delimiter);
         }
-      }, tag.icon, /*#__PURE__*/React__default["default"].createElement("span", {
+      }, tag.icon, /*#__PURE__*/React.createElement("span", {
         className: "tag-control-text"
       }, tag.label));
     });
-    return /*#__PURE__*/React__default["default"].createElement("div", {
+    return /*#__PURE__*/React.createElement("div", {
       className: "tag-control-dropdown",
       ref: this.tagControlRef
-    }, /*#__PURE__*/React__default["default"].createElement("div", {
+    }, /*#__PURE__*/React.createElement("div", {
       className: "tag-control-header",
       onClick: function onClick() {
         return _this2.setState(function (_ref) {
@@ -483,137 +470,137 @@ var TagControls = /*#__PURE__*/function (_Component) {
           };
         });
       }
-    }, i18n('common.insert'), /*#__PURE__*/React__default["default"].createElement(icons.DownArrowIcon, {
+    }, i18n("common.insert"), /*#__PURE__*/React.createElement(icons.DownArrowIcon, {
       className: "tag-control-chevron",
       inline: true
-    })), /*#__PURE__*/React__default["default"].createElement(tooltip.Popover, {
+    })), /*#__PURE__*/React.createElement(tooltip.Popover, {
       open: isOpen,
       className: "tag-control-content"
-    }, /*#__PURE__*/React__default["default"].createElement(menu.OverflowMenu, {
+    }, /*#__PURE__*/React.createElement(menu.OverflowMenu, {
       className: "action-menu"
     }, menuItems)));
   };
   return TagControls;
 }(React.Component);
 TagControls.propTypes = {
-  editorState: PropTypes__default["default"].object,
-  tags: PropTypes__default["default"].arrayOf(PropTypes__default["default"].object).isRequired,
-  onInsertTag: PropTypes__default["default"].func.isRequired
+  editorState: PropTypes.object,
+  tags: PropTypes.arrayOf(PropTypes.object).isRequired,
+  onInsertTag: PropTypes.func.isRequired
 };
 var TagControls$1 = /*#__PURE__*/withI18n(TagControls);
 
 var HtmlLink = function HtmlLink(_ref) {
   var url = _ref.url,
     children = _ref.children;
-  return /*#__PURE__*/React__default["default"].createElement("a", {
+  return /*#__PURE__*/React.createElement("a", {
     href: url
   }, children);
 };
 var Link = function Link(props) {
   var _props$contentState$g = props.contentState.getEntity(props.entityKey).getData(),
     url = _props$contentState$g.url;
-  return /*#__PURE__*/React__default["default"].createElement(HtmlLink, {
+  return /*#__PURE__*/React.createElement(HtmlLink, {
     url: url
   }, props.children);
 };
 function findLinkEntities(contentBlock, callback, contentState) {
   contentBlock.findEntityRanges(function (character) {
     var entityKey = character.getEntity();
-    return entityKey !== null && contentState.getEntity(entityKey).getType() === 'LINK';
+    return entityKey !== null && contentState.getEntity(entityKey).getType() === "LINK";
   }, callback);
 }
 
 var EditorConfigTypes = /*#__PURE__*/Object.freeze({
   FONT_LIST: {
-    UNSTYLED: 'unstyled',
-    HEADER_ONE: 'header-one',
-    HEADER_TWO: 'header-two',
-    HEADER_THREE: 'header-three',
-    HEADER_FOUR: 'header-four',
-    HEADER_FIVE: 'header-five',
-    HEADER_SIX: 'header-six'
+    UNSTYLED: "unstyled",
+    HEADER_ONE: "header-one",
+    HEADER_TWO: "header-two",
+    HEADER_THREE: "header-three",
+    HEADER_FOUR: "header-four",
+    HEADER_FIVE: "header-five",
+    HEADER_SIX: "header-six"
   },
   BLOCK_TYPES: {
-    UNORDERED_LIST: 'unordered-list',
-    ORDERED_LIST: 'ordered-list'
+    UNORDERED_LIST: "unordered-list",
+    ORDERED_LIST: "ordered-list"
   },
   INLINE_STYLES: {
-    BOLD: 'bold',
-    ITALIC: 'italic',
-    UNDERLINE: 'underline'
+    BOLD: "bold",
+    ITALIC: "italic",
+    UNDERLINE: "underline"
   }
 });
 var FontList = /*#__PURE__*/Object.freeze({
   unstyled: {
-    label: 'styles.p',
-    style: 'unstyled'
+    label: "styles.p",
+    style: "unstyled"
   },
-  'header-one': {
-    label: 'styles.h1',
-    style: 'header-one'
+  "header-one": {
+    label: "styles.h1",
+    style: "header-one"
   },
-  'header-two': {
-    label: 'styles.h2',
-    style: 'header-two'
+  "header-two": {
+    label: "styles.h2",
+    style: "header-two"
   },
-  'header-three': {
-    label: 'styles.h3',
-    style: 'header-three'
+  "header-three": {
+    label: "styles.h3",
+    style: "header-three"
   },
-  'header-four': {
-    label: 'styles.h4',
-    style: 'header-four'
+  "header-four": {
+    label: "styles.h4",
+    style: "header-four"
   },
-  'header-five': {
-    label: 'styles.h5',
-    style: 'header-five'
+  "header-five": {
+    label: "styles.h5",
+    style: "header-five"
   },
-  'header-six': {
-    label: 'styles.h6',
-    style: 'header-six'
+  "header-six": {
+    label: "styles.h6",
+    style: "header-six"
   }
 });
 var BlockTypeList = /*#__PURE__*/Object.freeze({
-  'unordered-list': {
-    label: /*#__PURE__*/React__default["default"].createElement(icons.BulletListIcon, null),
-    style: 'unordered-list-item',
-    tooltip: 'styles.unordered_list_item'
+  "unordered-list": {
+    label: /*#__PURE__*/React.createElement(icons.BulletListIcon, null),
+    style: "unordered-list-item",
+    tooltip: "styles.unordered_list_item"
   },
-  'ordered-list': {
-    label: /*#__PURE__*/React__default["default"].createElement(icons.NumberListIcon, null),
-    style: 'ordered-list-item',
-    tooltip: 'styles.ordered_list_item'
+  "ordered-list": {
+    label: /*#__PURE__*/React.createElement(icons.NumberListIcon, null),
+    style: "ordered-list-item",
+    tooltip: "styles.ordered_list_item"
   }
 });
 var InlineStylesList = /*#__PURE__*/Object.freeze({
   bold: {
-    label: /*#__PURE__*/React__default["default"].createElement(icons.BoldIcon, null),
-    style: 'BOLD',
-    tooltip: 'styles.bold',
-    hotKey: '(Ctrl+B)'
+    label: /*#__PURE__*/React.createElement(icons.BoldIcon, null),
+    style: "BOLD",
+    tooltip: "styles.bold",
+    hotKey: "(Ctrl+B)"
   },
   italic: {
-    label: /*#__PURE__*/React__default["default"].createElement(icons.ItalicIcon, null),
-    style: 'ITALIC',
-    tooltip: 'styles.italic',
-    hotKey: '(Ctrl+I)'
+    label: /*#__PURE__*/React.createElement(icons.ItalicIcon, null),
+    style: "ITALIC",
+    tooltip: "styles.italic",
+    hotKey: "(Ctrl+I)"
   },
   underline: {
-    label: /*#__PURE__*/React__default["default"].createElement(icons.UnderlineIcon, null),
-    style: 'UNDERLINE',
-    tooltip: 'styles.underline',
-    hotKey: '(Ctrl+U)'
+    label: /*#__PURE__*/React.createElement(icons.UnderlineIcon, null),
+    style: "UNDERLINE",
+    tooltip: "styles.underline",
+    hotKey: "(Ctrl+U)"
   }
 });
 var MinifiedConfigTypes = /*#__PURE__*/Object.freeze({
   fontList: [{
-    type: 'unstyled',
-    label: 'styles.p',
-    style: 'unstyled'
+    type: "unstyled",
+    label: "styles.p",
+    style: "unstyled"
   }, {
-    type: 'header-two',
-    label: 'styles.h1',
-    style: 'header-two'
+    type: "header-two",
+    label: "styles.h1",
+    style: "header-two"
   }],
   blockTypes: /*#__PURE__*/Object.values(EditorConfigTypes.BLOCK_TYPES),
   inlineStyles: [EditorConfigTypes.INLINE_STYLES.BOLD, EditorConfigTypes.INLINE_STYLES.ITALIC]
@@ -679,7 +666,7 @@ var RichTextEditor = /*#__PURE__*/function (_Component) {
     };
     _this.insertText = function (editorState, text) {
       var newContent = draftJs.Modifier.insertText(editorState.getCurrentContent(), editorState.getSelection(), text);
-      _this.props.onChange(draftJs.EditorState.push(editorState, newContent, 'insert-characters'), function () {
+      _this.props.onChange(draftJs.EditorState.push(editorState, newContent, "insert-characters"), function () {
         return _this.focusEditor();
       });
     };
@@ -688,18 +675,18 @@ var RichTextEditor = /*#__PURE__*/function (_Component) {
       return controlConfig[panelType];
     };
     _this.getControlConfigBySet = function (config) {
-      var fontList = (config && config.fontList || Object.keys(FontList)).filter(function (f) {
-        return typeof f === 'object' ? FontList[f.type] : FontList[f];
+      var fontList = ((config == null ? void 0 : config.fontList) || Object.keys(FontList)).filter(function (f) {
+        return typeof f === "object" ? FontList[f.type] : FontList[f];
       }).map(function (f) {
         return f.label && f.style ? f : FontList[f];
       });
-      var blockTypes = (config && config.blockTypes || Object.keys(BlockTypeList)).filter(function (f) {
-        return typeof f === 'object' ? BlockTypeList[f.type] : BlockTypeList[f];
+      var blockTypes = ((config == null ? void 0 : config.blockTypes) || Object.keys(BlockTypeList)).filter(function (f) {
+        return typeof f === "object" ? BlockTypeList[f.type] : BlockTypeList[f];
       }).map(function (f) {
         return f.label && f.style ? f : BlockTypeList[f];
       });
-      var inlineStyles = (config && config.inlineStyles || Object.keys(InlineStylesList)).filter(function (f) {
-        return typeof f === 'object' ? InlineStylesList[f.type] : InlineStylesList[f];
+      var inlineStyles = ((config == null ? void 0 : config.inlineStyles) || Object.keys(InlineStylesList)).filter(function (f) {
+        return typeof f === "object" ? InlineStylesList[f.type] : InlineStylesList[f];
       }).map(function (f) {
         return f.label && f.style ? f : InlineStylesList[f];
       });
@@ -714,7 +701,8 @@ var RichTextEditor = /*#__PURE__*/function (_Component) {
   _inheritsLoose(RichTextEditor, _Component);
   var _proto = RichTextEditor.prototype;
   _proto.focusEditor = function focusEditor() {
-    this.editor.current && this.editor.current.focus();
+    var _this$editor$current;
+    (_this$editor$current = this.editor.current) == null || _this$editor$current.focus();
   };
   _proto.render = function render() {
     var _this$props5 = this.props,
@@ -728,35 +716,35 @@ var RichTextEditor = /*#__PURE__*/function (_Component) {
       editorState = _this$props5.editorState,
       onChange = _this$props5.onChange,
       handleBeforeInput = _this$props5.handleBeforeInput;
-    var classNames = cx__default["default"]('editor-root', className);
-    return /*#__PURE__*/React__default["default"].createElement("div", {
+    var classNames = cx("editor-root", className);
+    return /*#__PURE__*/React.createElement("div", {
       ref: this.wrapperRef
-    }, label && /*#__PURE__*/React__default["default"].createElement(typography.Label, null, label), /*#__PURE__*/React__default["default"].createElement("div", {
+    }, label && /*#__PURE__*/React.createElement(typography.Label, null, label), /*#__PURE__*/React.createElement("div", {
       className: classNames
-    }, /*#__PURE__*/React__default["default"].createElement("div", {
+    }, /*#__PURE__*/React.createElement("div", {
       className: "controls-wrapper"
-    }, showFontMenu && /*#__PURE__*/React__default["default"].createElement(BlockTypeControls, {
+    }, showFontMenu && /*#__PURE__*/React.createElement(BlockTypeControls, {
       editorState: editorState,
       onToggle: this.toggleSelectBlockType,
-      blockTypes: this.getFontListConfigForPanelType('fontList')
-    }), showInlineStyleMenu && /*#__PURE__*/React__default["default"].createElement(InlineStyleControls, {
+      blockTypes: this.getFontListConfigForPanelType("fontList")
+    }), showInlineStyleMenu && /*#__PURE__*/React.createElement(InlineStyleControls, {
       editorState: editorState,
       onToggle: this.toggleInlineStyle,
-      inlineStyles: this.getFontListConfigForPanelType('inlineStyles')
-    }), showTextFormatMenu && /*#__PURE__*/React__default["default"].createElement(BlockTypeButtonControls, {
+      inlineStyles: this.getFontListConfigForPanelType("inlineStyles")
+    }), showTextFormatMenu && /*#__PURE__*/React.createElement(BlockTypeButtonControls, {
       editorState: editorState,
       onToggle: this.toggleButtonBlockType,
-      blockTypes: this.getFontListConfigForPanelType('blockTypes')
-    }), showLinkMenu && /*#__PURE__*/React__default["default"].createElement(BlockTypeLinkControls$1, {
+      blockTypes: this.getFontListConfigForPanelType("blockTypes")
+    }), showLinkMenu && /*#__PURE__*/React.createElement(BlockTypeLinkControls$1, {
       editorState: editorState,
       onToggle: this.toggleLink
-    }), tags && tags.length > 0 && /*#__PURE__*/React__default["default"].createElement(TagControls$1, {
+    }), tags && tags.length > 0 && /*#__PURE__*/React.createElement(TagControls$1, {
       editorState: editorState,
       tags: tags,
       onInsertTag: this.insertText
-    })), /*#__PURE__*/React__default["default"].createElement("div", {
+    })), /*#__PURE__*/React.createElement("div", {
       className: "editor-wrapper"
-    }, /*#__PURE__*/React__default["default"].createElement(draftJs.Editor, {
+    }, /*#__PURE__*/React.createElement(draftJs.Editor, {
       ref: this.editor,
       editorState: editorState,
       handleKeyCommand: this.handleKeyCommand,
@@ -770,25 +758,25 @@ var RichTextEditor = /*#__PURE__*/function (_Component) {
 }(React.Component);
 RichTextEditor.decorator = decorator;
 var styleShape = function styleShape(configList) {
-  return PropTypes__default["default"].oneOfType([PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOf([].concat(Object.values(configList)))), PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
-    type: PropTypes__default["default"].oneOf([].concat(Object.values(configList))),
-    label: PropTypes__default["default"].string,
-    style: PropTypes__default["default"].string,
-    tooltip: PropTypes__default["default"].string,
-    hotKey: PropTypes__default["default"].string
+  return PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOf([].concat(Object.values(configList)))), PropTypes.arrayOf(PropTypes.shape({
+    type: PropTypes.oneOf([].concat(Object.values(configList))),
+    label: PropTypes.string,
+    style: PropTypes.string,
+    tooltip: PropTypes.string,
+    hotKey: PropTypes.string
   }))]);
 };
 RichTextEditor.propTypes = {
-  editorState: PropTypes__default["default"].object.isRequired,
-  onChange: PropTypes__default["default"].func.isRequired,
-  maxTabDepth: PropTypes__default["default"].number,
-  showFontMenu: PropTypes__default["default"].bool,
-  showInlineStyleMenu: PropTypes__default["default"].bool,
-  showTextFormatMenu: PropTypes__default["default"].bool,
-  showLinkMenu: PropTypes__default["default"].bool,
-  label: PropTypes__default["default"].string,
-  tags: /*#__PURE__*/PropTypes__default["default"].arrayOf(PropTypes__default["default"].object),
-  controlConfigSet: /*#__PURE__*/PropTypes__default["default"].shape({
+  editorState: PropTypes.object.isRequired,
+  onChange: PropTypes.func.isRequired,
+  maxTabDepth: PropTypes.number,
+  showFontMenu: PropTypes.bool,
+  showInlineStyleMenu: PropTypes.bool,
+  showTextFormatMenu: PropTypes.bool,
+  showLinkMenu: PropTypes.bool,
+  label: PropTypes.string,
+  tags: /*#__PURE__*/PropTypes.arrayOf(PropTypes.object),
+  controlConfigSet: /*#__PURE__*/PropTypes.shape({
     fontList: /*#__PURE__*/styleShape(EditorConfigTypes.FONT_LIST),
     blockTypes: /*#__PURE__*/styleShape(EditorConfigTypes.BLOCK_TYPES),
     inlineStyles: /*#__PURE__*/styleShape(EditorConfigTypes.INLINE_STYLES)
@@ -800,7 +788,7 @@ RichTextEditor.defaultProps = {
   showInlineStyleMenu: true,
   showTextFormatMenu: true,
   showLinkMenu: true,
-  label: ''
+  label: ""
 };
 
 var editorStateToMarkdown = function editorStateToMarkdown(editorState) {
@@ -819,7 +807,7 @@ var markdownToEditorState = function markdownToEditorState(markdown) {
   var contentState = draftJs.convertFromRaw(rawState);
   return draftJs.EditorState.createWithContent(contentState, decorator);
 };
-var converter = /*#__PURE__*/new showdown__default["default"].Converter({
+var converter = /*#__PURE__*/new showdown.Converter({
   underline: true
 });
 var markdownToHtml = function markdownToHtml(markdown) {
@@ -843,7 +831,7 @@ var RichTextEditorForLanguage = function RichTextEditorForLanguage(_ref) {
   var handleOnChange = function handleOnChange(changedState) {
     var newValues = _extends({}, values);
     var content = editorStateToMarkdown(changedState);
-    if (values[langKey] && content === '\n') {
+    if (values[langKey] && content === "\n") {
       delete newValues[langKey];
     } else {
       newValues[langKey] = content;
@@ -851,16 +839,16 @@ var RichTextEditorForLanguage = function RichTextEditorForLanguage(_ref) {
     setEditorState(changedState);
     onChange(newValues);
   };
-  var feedbackText = feedback && feedback(langKey);
-  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(RichTextEditor, {
-    label: required ? label + '*' : label,
+  var feedbackText = feedback == null ? void 0 : feedback(langKey);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(RichTextEditor, {
+    label: required ? label + "*" : label,
     editorState: editorState,
     onChange: function onChange(changedState) {
       return handleOnChange(changedState);
     },
     controlConfigSet: MinifiedConfigTypes,
     tags: tags
-  }), variant && (feedbackText == null ? void 0 : feedbackText.length) > 0 && ( /*#__PURE__*/React__default["default"].createElement(form.FeedbackText, {
+  }), variant && feedbackText && feedbackText.length > 0 && (/*#__PURE__*/React.createElement(form.FeedbackText, {
     variant: variant(langKey)
   }, feedbackText)));
 };
@@ -869,32 +857,30 @@ var ExpandableMultiLanguageRichTextEditor = function ExpandableMultiLanguageRich
     title = _ref2.title,
     languages = _ref2.languages,
     rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
-  return /*#__PURE__*/React__default["default"].createElement(expand.ExpandablePanel, {
+  return /*#__PURE__*/React.createElement(expand.ExpandablePanel, {
     title: title,
     defaultOpen: true,
     contentStyle: {
-      padding: '4px 4px 4px 4px',
-      marginTop: '16px',
-      marginBottom: '16px'
+      padding: "4px 4px 4px 4px",
+      marginTop: "16px",
+      marginBottom: "16px"
     }
-  }, /*#__PURE__*/React__default["default"].createElement(common.Stack, {
+  }, /*#__PURE__*/React.createElement(common.Stack, {
     space: "medium"
   }, languages.map(function (lang) {
-    return /*#__PURE__*/React__default["default"].createElement("div", {
+    return /*#__PURE__*/React.createElement("div", {
       key: name + lang.value,
       "data-testid": "multi-lang-rich-text-" + name + "-" + lang.value
-    }, /*#__PURE__*/React__default["default"].createElement(RichTextEditorForLanguage, _extends({
+    }, /*#__PURE__*/React.createElement(RichTextEditorForLanguage, _extends({
       language: lang
     }, rest)));
   })));
 };
 
-/* eslint-disable react/display-name */
-
 var entityToHtml = {
   entityToHTML: function entityToHTML(entity, originalText) {
-    if (entity.type === 'LINK') {
-      return /*#__PURE__*/React__default["default"].createElement(HtmlLink, {
+    if (entity.type === "LINK") {
+      return /*#__PURE__*/React.createElement(HtmlLink, {
         url: entity.data.url
       }, originalText);
     }
@@ -903,16 +889,13 @@ var entityToHtml = {
 };
 var htmlToEntity = {
   htmlToEntity: function htmlToEntity(nodeName, node, createEntity) {
-    if (nodeName === 'a') {
-      return createEntity('LINK', 'MUTABLE', {
+    if (nodeName === "a") {
+      return createEntity("LINK", "MUTABLE", {
         url: node.href
       });
     }
   }
 };
-
-/* eslint-disable react/display-name */
-
 var htmlToEditorState = function htmlToEditorState(html) {
   if (!html) {
     return draftJs.EditorState.createEmpty(decorator);