@startlibs/form 1.0.5 → 1.0.7

package/lib/index.js

@@ -37,6 +37,7 @@ import _possibleConstructorReturn from '@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
 import _inherits from '@babel/runtime/helpers/inherits';
 import _concat from 'lodash/fp/concat';
+import _last from 'lodash/fp/last';
 import _without from 'lodash/fp/without';
 import _isEqual from 'lodash/fp/isEqual';
 import ContentEditable from 'react-contenteditable';
@@ -51,7 +52,6 @@ import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _isBoolean from 'lodash/fp/isBoolean';
 import _negate from 'lodash/fp/negate';
 import _zipObject from 'lodash/fp/zipObject';
-import _last from 'lodash/fp/last';
 import _flatten from 'lodash/fp/flatten';
 import _fromPairs from 'lodash/fp/fromPairs';
 import _pick from 'lodash/fp/pick';
@@ -650,8 +650,9 @@ var formInput = function formInput(_ref) {
       return;
     }
 
-    setFormValue(transform(value, opts));
-    callIfFunction(onChange, callIfFunction(value, formValue), opts);
+    var transformedValue = transform(callIfFunction(value, formValue), opts);
+    setFormValue(transformedValue);
+    callIfFunction(onChange, transformedValue, opts);
   };
 
   var setValueFromEventTarget = function setValueFromEventTarget(e) {
@@ -951,6 +952,7 @@ var ConfirmDialog = function ConfirmDialog(_ref2) {
       skipDom = _ref2.skipDom,
       className = _ref2.className,
       closeDialog = _ref2.closeDialog,
+      onClose = _ref2.onClose,
       skipCloseIcon = _ref2.skipCloseIcon,
       _ref2$cancelLabel = _ref2.cancelLabel,
       cancelLabel = _ref2$cancelLabel === void 0 ? "Cancelar" : _ref2$cancelLabel,
@@ -983,6 +985,33 @@ var ConfirmDialog = function ConfirmDialog(_ref2) {
       skipErrors = _ref2.skipErrors,
       hidden = _ref2.hidden,
       skipCheckFocus = _ref2.skipCheckFocus;
+  var handleClose = React.useCallback(
+  /*#__PURE__*/
+  _asyncToGenerator(
+  /*#__PURE__*/
+  _regeneratorRuntime.mark(function _callee() {
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            if (!onClose) {
+              _context.next = 3;
+              break;
+            }
+
+            _context.next = 3;
+            return onClose().catch(console.error);
+
+          case 3:
+            if (closeDialog) closeDialog();
+
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee, this);
+  })), [onClose, closeDialog]);
   return React.createElement(WithForm$1, {
     alwaysSave: alwaysSave,
     ref: formRef,
@@ -1001,7 +1030,7 @@ var ConfirmDialog = function ConfirmDialog(_ref2) {
 
       return Promise.resolve(callIfFunction.apply(void 0, [_onSuccess].concat(props))).then(function (v) {
         if (!keepOnSuccess) {
-          closeDialog();
+          handleClose();
         }
 
         if (notify) {
@@ -1019,15 +1048,15 @@ var ConfirmDialog = function ConfirmDialog(_ref2) {
       skipCloseIcon: skipCloseIcon,
       confirmChanges: confirmChanges,
       isLoading: isLoading,
-      closeDialog: closeDialog,
+      closeDialog: handleClose,
       form: form,
       stickyFooter: stickyFooter,
       auxiliarActions: auxiliarActions,
       fullscreen: fullscreen,
       fullscreenOnMobile: fullscreenOnMobile,
-      footer: (cancelButton || alternativeButton || confirm) && React.createElement(React.Fragment, null, cancelButton && addExtraProp(callIfFunction(cancelButton, closeDialog), {
-        onClick: closeDialog
-      }, false), callIfFunction(alternativeButton, closeDialog), confirm && using(callIfFunction(confirm, {
+      footer: (cancelButton || alternativeButton || confirm) && React.createElement(React.Fragment, null, cancelButton && addExtraProp(callIfFunction(cancelButton, handleClose), {
+        onClick: handleClose
+      }, false), callIfFunction(alternativeButton, handleClose), confirm && using(callIfFunction(confirm, {
         form: form,
         isLoading: isLoading
       }))(function (c) {
@@ -1136,6 +1165,7 @@ var useTextInput = function useTextInput(_ref, ref) {
   var onFocus = _ref.onFocus,
       onBlur = _ref.onBlur,
       autoResize = _ref.autoResize,
+      autoSelectOnFocus = _ref.autoSelectOnFocus,
       constraint = _ref.constraint,
       pattern = _ref.pattern,
       path = _ref.path,
@@ -1146,7 +1176,7 @@ var useTextInput = function useTextInput(_ref, ref) {
       raw = _ref.raw,
       showValue = _ref.showValue,
       deleteTrailing = _ref.deleteTrailing,
-      rest = _objectWithoutProperties(_ref, ["onFocus", "onBlur", "autoResize", "constraint", "pattern", "path", "rawValue", "rawSetValue", "rawHasErrors", "transformOnBlur", "raw", "showValue", "deleteTrailing"]);
+      rest = _objectWithoutProperties(_ref, ["onFocus", "onBlur", "autoResize", "autoSelectOnFocus", "constraint", "pattern", "path", "rawValue", "rawSetValue", "rawHasErrors", "transformOnBlur", "raw", "showValue", "deleteTrailing"]);
 
   var _useInput = useInput$1(_objectSpread({
     path: path,
@@ -1168,6 +1198,15 @@ var useTextInput = function useTextInput(_ref, ref) {
 
   var handleOnFocus = function handleOnFocus(e) {
     setFocused(true);
+
+    if (!!autoSelectOnFocus && !!ref.current) {
+      setTimeout(function () {
+        var _ref$current;
+
+        return (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.select();
+      }, 0);
+    }
+
     callIfFunction(onFocus, e);
   };
 
@@ -1190,6 +1229,15 @@ var useTextInput = function useTextInput(_ref, ref) {
       doAutoResize(ref.current);
     }
   }, []);
+  useEffect(function () {
+    if (!!autoSelectOnFocus && !!ref.current && document.activeElement === ref.current) {
+      setTimeout(function () {
+        var _ref$current2;
+
+        return (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.select();
+      }, 0);
+    }
+  }, [autoSelectOnFocus]);
 
   var handleChange = function handleChange(e) {
     if (autoResize) {
@@ -1312,6 +1360,7 @@ var TextInput = styled(forwardRef(function (_ref2, forwardedRef) {
       onImage = _ref2$onImage === void 0 ? false : _ref2$onImage,
       autoFocus = _ref2.autoFocus,
       noFocus = _ref2.noFocus,
+      autoSelectOnFocus = _ref2.autoSelectOnFocus,
       onFocus = _ref2.onFocus,
       onBlur = _ref2.onBlur,
       pattern = _ref2.pattern,
@@ -1321,7 +1370,7 @@ var TextInput = styled(forwardRef(function (_ref2, forwardedRef) {
       raw = _ref2.raw,
       _ref2$tabIndex = _ref2.tabIndex,
       tabIndex = _ref2$tabIndex === void 0 ? 1 : _ref2$tabIndex,
-      rest = _objectWithoutProperties(_ref2, ["showValue", "label", "type", "helpText", "descText", "bellowDescText", "mandatory", "isLoading", "locked", "textBoxBefore", "textBoxAfter", "className", "fieldClassName", "FieldType", "margin", "value", "setValue", "hasErrors", "textarea", "onImage", "autoFocus", "noFocus", "onFocus", "onBlur", "pattern", "autoResize", "constraint", "path", "raw", "tabIndex"]);
+      rest = _objectWithoutProperties(_ref2, ["showValue", "label", "type", "helpText", "descText", "bellowDescText", "mandatory", "isLoading", "locked", "textBoxBefore", "textBoxAfter", "className", "fieldClassName", "FieldType", "margin", "value", "setValue", "hasErrors", "textarea", "onImage", "autoFocus", "noFocus", "autoSelectOnFocus", "onFocus", "onBlur", "pattern", "autoResize", "constraint", "path", "raw", "tabIndex"]);
 
   var ref = useEnsureRef(forwardedRef);
 
@@ -1330,6 +1379,7 @@ var TextInput = styled(forwardRef(function (_ref2, forwardedRef) {
     onFocus: onFocus,
     onBlur: onBlur,
     autoResize: autoResize,
+    autoSelectOnFocus: autoSelectOnFocus,
     constraint: constraint,
     pattern: pattern,
     rawValue: rawValue,
@@ -2948,6 +2998,7 @@ var DropdownIconContainer = styled(Icon).withConfig({
 var focusBeforeLast = function focusBeforeLast(e) {
   if (e.target && e.target !== e.currentTarget) return;
   var el = [].slice.call(e.currentTarget.querySelectorAll('div[contenteditable]')).slice(-1)[0];
+  if (!el) return;
   el.focus();
 
   if (!el.firstChild) {
@@ -3089,7 +3140,7 @@ var AutoComplete = React.forwardRef(function (_ref, outerRef) {
   };
 
   var shouldFocusInput = useToggle();
-  var recentlyAdded = useRefState();
+  var recentlyAdded = useRefState(false);
   useEffect(function () {
     if (autoFocus) {
       focusInput();
@@ -3196,7 +3247,12 @@ var AutoComplete = React.forwardRef(function (_ref, outerRef) {
 
   useEffect(function () {
     if (!lastIsEditable) {
-      setFormValue(_without([_cancelEditable.current], formValue).concat(""));
+      if (recentlyAdded.get() !== _cancelEditable.current) {
+        setFormValue(_without([_cancelEditable.current], formValue).concat(""));
+      } else {
+        setLocalFormValue(_last(formValue) === "" ? formValue : formValue.concat(""));
+      }
+
       _cancelEditable.current = null;
     }
   }, [lastIsEditable]);
@@ -3259,8 +3315,8 @@ var AutoComplete = React.forwardRef(function (_ref, outerRef) {
 
   var addValue = function addValue(value, fromBlur) {
     var index = Math.max(lastIsEditable ? getValue().length - 1 : getValue().length, 0);
+    recentlyAdded.set((formValue === null || formValue === void 0 ? void 0 : formValue[index]) || "");
     setFormValue(_flow(_set([index], value), _concat(_concat.placeholder, "")));
-    recentlyAdded.set(true);
 
     if (!fromBlur) {
       focusInput();
@@ -3516,7 +3572,7 @@ function (_React$Component) {
     };
 
     _this.onChange = function (evt) {
-      _this.props.onChange(_this.props.index, cleanText(evt.target.value));
+      _this.props.onChange(_this.props.index, cleanText(evt.currentTarget.isContentEditable ? evt.currentTarget.innerText : evt.target.value));
     };
 
     _this.onPaste = function (ev) {
@@ -4210,7 +4266,7 @@ var EditableBox = function EditableBox(_ref17) {
   var internalBox = React.useRef();
 
   var resetField = function resetField() {
-    return path ? form.resetField([].concat(path)) : form.resetForm();
+    return path ? form.resetField(_s.toPath(path)) : form.resetForm();
   };
 
   var _onClose = function _onClose(skipReset) {
@@ -4783,7 +4839,7 @@ var DatePicker = forwardRef(function (_ref, maybeInputRef) {
       }, 1);
     }
   }, [textValue]);
-  var isShortcutsEnabled = daysFromNowShortcuts && daysFromNowShortcuts.length > 0 || monthsFromNowShortcuts && monthsFromNowShortcuts.length > 0;
+  var isShortcutsEnabled = !!daysFromNowShortcuts && daysFromNowShortcuts.length > 0 || !!monthsFromNowShortcuts && monthsFromNowShortcuts.length > 0;
 
   var setDateToNDaysFromNow = function setDateToNDaysFromNow(daysFromNow) {
     var date = new Date(now());
@@ -4937,7 +4993,7 @@ var DatePicker = forwardRef(function (_ref, maybeInputRef) {
     onClick: iconClick,
     icon: "calendar",
     className: isShortcutsEnabled ? "hasShortcuts" : ""
-  })), (daysFromNowShortcuts === null || daysFromNowShortcuts === void 0 ? void 0 : daysFromNowShortcuts.length) > 0 || (monthsFromNowShortcuts === null || monthsFromNowShortcuts === void 0 ? void 0 : monthsFromNowShortcuts.length) > 0 ? React.createElement(ShortcutsWrapper, null, React.createElement("span", null, "Em:"), daysFromNowShortcuts.map(function (daysFromNow) {
+  })), (daysFromNowShortcuts === null || daysFromNowShortcuts === void 0 ? void 0 : daysFromNowShortcuts.length) > 0 || (monthsFromNowShortcuts === null || monthsFromNowShortcuts === void 0 ? void 0 : monthsFromNowShortcuts.length) > 0 ? React.createElement(ShortcutsWrapper, null, React.createElement("span", null, "Em:"), daysFromNowShortcuts === null || daysFromNowShortcuts === void 0 ? void 0 : daysFromNowShortcuts.map(function (daysFromNow) {
     return React.createElement("span", {
       class: "link",
       key: "days-from-now-".concat(daysFromNow),
@@ -4946,7 +5002,7 @@ var DatePicker = forwardRef(function (_ref, maybeInputRef) {
       },
       disabled: disabled
     }, daysFromNow, " dia", daysFromNow > 1 ? 's' : '');
-  }), monthsFromNowShortcuts.map(function (monthsFromNow) {
+  }), monthsFromNowShortcuts === null || monthsFromNowShortcuts === void 0 ? void 0 : monthsFromNowShortcuts.map(function (monthsFromNow) {
     return React.createElement("span", {
       class: "link",
       key: "months-from-now".concat(monthsFromNow),
@@ -5709,7 +5765,7 @@ var RichTextContainer = styled.div.withConfig({
 var RichTextInput = styled.div.withConfig({
   displayName: "RichText__RichTextInput",
   componentId: "x8c1ig-2"
-})(["width:100%;font-size:14px;outline:0;outline:none;color:", ";background:white;min-height:", "px;outline:0;padding:0.7rem;overflow:auto;border-radius:5px;b,strong{font-weight:600;}&[contenteditable=true]:empty:before{content:attr(placeholder);color:rgba(0,0,0,0.3);}", ""], getColor('gray60'), function (props) {
+})(["font-size:14px;color:", ";background:white;border-radius:5px;> div{overflow:auto;width:100%;outline:none;min-height:", "px;padding:0.7rem;}b,strong{font-weight:600;}&[contenteditable=true]:empty:before{content:attr(placeholder);color:rgba(0,0,0,0.3);}", ""], getColor('gray60'), function (props) {
   return props.minHeight || 78;
 }, function (props) {
   return props.disabled && "\n    &[disabled] {\n      background: rgba(0, 0, 0, 0.075) !important;\n      opacity: 0.75 !important;\n    }\n  ";
@@ -5749,14 +5805,6 @@ var addHttp = function addHttp(s) {
   }
 };
 
-var getRightMostElement = function getRightMostElement(node) {
-  if (node.childNodes.length) {
-    return getRightMostElement(node.childNodes[node.childNodes.length - 1]);
-  } else {
-    return node;
-  }
-};
-
 var setSelectionRange$1 = function setSelectionRange(input, selectionStart) {
   var selectionEnd = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
   if (!input) return;
@@ -5873,45 +5921,6 @@ var cleanEditor = function cleanEditor(editor, acceptedTags) {
   clean(editor.childNodes);
 };
 
-var insertToken = function insertToken(node, offset) {
-  var parent = node.parentNode;
-  var token = document.createElement("span");
-
-  if (node.nodeType === Node.TEXT_NODE) {
-    var splitted = node.splitText(offset);
-    parent.insertBefore(token, splitted);
-  } else {
-    parent.insertBefore(token, node);
-  }
-
-  return token;
-};
-/*
-* pagely reformat
- .replace(/^[a-z]/, function (e) {
-      return e.toUpperCase()
-    })
-* */
-
-
-var parseAndExecCommand = function parseAndExecCommand(c) {
-  if (c === "strikethrough" || c === "underline") {
-    document.execCommand('styleWithCSS', false, false);
-  } else {
-    document.execCommand('styleWithCSS', false, true);
-  }
-
-  if (c.indexOf('fontSize') === 0) {
-    var direction = c.indexOf('Up') > 0 ? 1 : -1;
-    var newValue = Math.min(7, Math.max(1, parseInt(document.queryCommandValue('fontSize') || 3) + direction));
-    document.execCommand('fontSize', false, newValue);
-  } else {
-    var sanitizedCommand = c.indexOf("List") >= 0 && document.queryCommandState(c) ? 'outdent' : c; // FIX CHROME HANGS when list is called and already active
-
-    document.execCommand(sanitizedCommand);
-  }
-};
-
 var RichText = function RichText(_ref5) {
   var path = _ref5.path,
       inputRef = _ref5.inputRef,
@@ -5955,25 +5964,28 @@ var RichText = function RichText(_ref5) {
   }, raw),
       _useInput2 = _slicedToArray(_useInput, 3),
       formValue = _useInput2[0],
-      setFormValue = _useInput2[1],
+      _setFormValue = _useInput2[1],
       hasErrors = _useInput2[2].hasErrors; // const tempValue = useConstant(formValue)
 
 
-  var _useState = useState(formValue),
-      _useState2 = _slicedToArray(_useState, 2),
-      tempValue = _useState2[0],
-      setTempValue = _useState2[1];
+  var tempValue = useRef(formValue);
+
+  var setFormValue = function setFormValue(v) {
+    tempValue.current = v;
+
+    _setFormValue(v);
+  };
 
   useEffect(function () {
     if (value === formValue && formValue !== tempValue) {
-      setTempValue(formValue);
+      tempValue.current = formValue;
     }
   }, [path]);
 
-  var _useState3 = useState({}),
-      _useState4 = _slicedToArray(_useState3, 2),
-      activatedTools = _useState4[0],
-      setActivatedTools = _useState4[1];
+  var _useState = useState({}),
+      _useState2 = _slicedToArray(_useState, 2),
+      activatedTools = _useState2[0],
+      setActivatedTools = _useState2[1];
 
   var validElements = useLazyConstant(function () {
     return ['br', 'div', 'p', 'span'].concat(_flatten(formatTools.map(function (tool) {
@@ -6097,6 +6109,7 @@ var RichText = function RichText(_ref5) {
         }
       }
 
+      tempValue.current = input.current.innerHTML;
       openDialog(nodeEl);
     } else {
       if (!isSelectionInsideRichTextEditor()) {
@@ -6114,63 +6127,11 @@ var RichText = function RichText(_ref5) {
         sel.addRange(_range);
       }
 
-      if (window.getSelection().rangeCount) {
-        commands.set(window.getSelection().getRangeAt(0).collapsed ? commands.get().concat(command) : [command]);
-
-        if (window.getSelection().getRangeAt(0).startContainer === input.current) {
-          // firefox ctrl+a bug
-          startSelectionToken.set(insertToken(input.current.firstChild, 0));
-          endSelectionToken.set(insertToken(input.current.lastChild, input.current.lastChild.length));
-        } else {
-          // ORDER MATTERS HERE splitText creates new text on the right https://developer.mozilla.org/en-US/docs/Web/API/Text/splitText
-          endSelectionToken.set(insertToken(window.getSelection().getRangeAt(0).endContainer, window.getSelection().getRangeAt(0).endOffset));
-          startSelectionToken.set(insertToken(window.getSelection().getRangeAt(0).startContainer, window.getSelection().getRangeAt(0).startOffset));
-        }
-      }
-
-      containerFocused.openWith(1);
+      document.execCommand(command);
+      setFormValue(input.current.innerHTML);
+      toggleButtonsState();
       focus();
     }
-
-    if (command === 'insertUnorderedList' || command === 'insertOrderedList') {
-      var _range2 = document.createRange();
-
-      _range2.setStart(startSelectionToken.get().nextSibling, 0);
-
-      var _end = endSelectionToken.get().nextSibling;
-      startSelectionToken.get().remove();
-      endSelectionToken.get().remove();
-      startSelectionToken.set(null);
-      endSelectionToken.set(null);
-
-      _range2.setEnd(_end, 0);
-    }
-  };
-
-  var execCommandMouseUp = function execCommandMouseUp() {
-    if (startSelectionToken.get()) {
-      // window.getSelection().removeAllRanges()
-      var range = document.createRange();
-      range.setStart(startSelectionToken.get().nextSibling, 0);
-      var end = endSelectionToken.get().nextSibling;
-      startSelectionToken.get().remove();
-      endSelectionToken.get().remove();
-      startSelectionToken.set(null);
-      endSelectionToken.set(null);
-      range.setEnd(end, 0);
-      window.getSelection().addRange(range);
-    } else {
-      input.current.focus();
-    }
-
-    commands.get().forEach(function (c) {
-      return parseAndExecCommand(c);
-    }); // commands.set(_.without(['insertUnorderedList','insertOrderedList','outdent','indent']))
-
-    commands.set([]);
-    setFormValue(input.current.innerHTML);
-    containerFocused.openWith(2);
-    toggleButtonsState();
   };
 
   var isSelectionInsideRichTextEditor = function isSelectionInsideRichTextEditor() {
@@ -6225,72 +6186,28 @@ var RichText = function RichText(_ref5) {
 
   var handleKeyUp = function handleKeyUp(e) {
     toggleButtonsState();
-    commands.set([]);
     setFormValue(reformatText(input.current.innerHTML));
   };
 
   var handleKeyDown = function handleKeyDown(e) {
-    if (linkJustCreated.current && e.which === 8) {
-      linkJustCreated.current.outerHTML = linkJustCreated.current.innerHTML;
-      input.current.normalize();
-      return;
-    }
-
-    commands.set([]);
-    linkJustCreated.set(null);
-    var selectedRange = window.getSelection().getRangeAt(0);
-    if (!selectedRange) return;
-    var possibleTextNode = selectedRange.startContainer;
-    var node = possibleTextNode.nodeType === Node.TEXT_NODE ? possibleTextNode.parentNode : possibleTextNode;
-    var parent = node.closest('a,.' + JS_CLASS);
-
-    if ((e.key === 'Enter' || e.which === 32) && parent && parent.matches('.' + JS_CLASS)) {
-      var range = document.createRange();
-      range.setEnd(selectedRange.startContainer, selectedRange.startOffset);
-      range.setStart(selectedRange.startContainer, 0);
-      traverseAndAddLink(range);
-    }
-  };
-
-  var traverseAndAddLink = function traverseAndAddLink(range) {
-    var match = range.toString().match(/[\s\t\n\r]([^\s\t\n\r]*)$/);
-
-    if (match) {
-      if (/^(https?:\/\/|www\.)/.test(match[1]) && linkRegex.test(match[1])) {
-        range.setStart(range.startContainer, match.index + 1);
-        range.endContainer.splitText(range.endContainer.textContent.length - 1);
-        var newNode = document.createElement('a');
-        newNode.href = match[1];
-        newNode.appendChild(range.extractContents());
-        range.insertNode(newNode);
-        window.getSelection().getRangeAt(0).setEndAfter(newNode);
-        window.getSelection().getRangeAt(0).setStartAfter(newNode);
-        linkJustCreated.set(newNode);
-      }
-    } else {
-      var previous = getPreviousElement(range.startContainer);
-
-      if (previous) {
-        range.setStart(previous, 0);
-        traverseAndAddLink(range);
-      }
-    }
-  };
-
-  var getPreviousElement = function getPreviousElement(node) {
-    if (node.previousSibling) {
-      var rightMost = getRightMostElement(node.previousSibling);
-
-      if (rightMost.nodeType === Node.TEXT_NODE) {
-        return rightMost;
-      } else {
-        return getPreviousElement(rightMost);
-      }
-    } else if (node.parentNode && node !== input.current) {
-      return getPreviousElement(node.parentNode);
-    } else {
-      return null;
-    }
+    /*if (linkJustCreated.current && e.which === 8) {
+       linkJustCreated.current.outerHTML = linkJustCreated.current.innerHTML
+       input.current.normalize()
+       return
+     }
+    commands.set([])
+     linkJustCreated.set(null)
+     const selectedRange = window.getSelection().getRangeAt(0)
+     if (!selectedRange) return
+     const possibleTextNode = selectedRange.startContainer
+     const node = possibleTextNode.nodeType === Node.TEXT_NODE ? possibleTextNode.parentNode : possibleTextNode
+    const parent = node.closest('a,.'+JS_CLASS)
+    if ((e.key === 'Enter' || e.which === 32) && parent && parent.matches('.'+JS_CLASS)) {
+       const range = document.createRange()
+       range.setEnd(selectedRange.startContainer, selectedRange.startOffset)
+       range.setStart(selectedRange.startContainer, 0)
+       traverseAndAddLink(range)
+    }*/
   };
 
   var handlePasteDrop = function handlePasteDrop(e) {
@@ -6347,12 +6264,9 @@ var RichText = function RichText(_ref5) {
     return React.createElement(ToolButton, {
       key: tool,
       tabIndex: -1,
-      onMouseDown: function onMouseDown(e) {
+      onClick: function onClick(e) {
         return execCommand(e, tool);
       },
-      onMouseUp: function onMouseUp(e) {
-        return execCommandMouseUp();
-      },
       className: 'button exec-command rich-text-button only-icon ' + (activatedTools[tool] ? 'activated' : ''),
       type: "button"
     }, React.createElement("span", {
@@ -6363,7 +6277,6 @@ var RichText = function RichText(_ref5) {
   var richTextElement = React.createElement(RichTextContainer, {
     linkColor: linkColor,
     ref: container,
-    onClick: stopPropagation(),
     onFocus: containerFocus,
     onBlur: containerBlur,
     focus: containerFocused.isOpen,
@@ -6376,9 +6289,10 @@ var RichText = function RichText(_ref5) {
       className: "separator",
       key: "separator-" + i
     }) : toolButton(t);
-  })), React.createElement(RichTextInput, {
-    contentEditable: !disabled,
-    ref: input,
+  })), React.createElement(RichTextInput, null, React.createElement(ContentEditable, {
+    className: JS_CLASS,
+    innerRef: input,
+    html: tempValue.current || "",
     onBlur: onBlur,
     onClick: handleClick,
     onKeyUp: handleKeyUp,
@@ -6386,14 +6300,10 @@ var RichText = function RichText(_ref5) {
     onPaste: handlePasteDrop,
     onDrop: handlePasteDrop,
     tabIndex: tabIndex,
-    dangerouslySetInnerHTML: {
-      __html: tempValue
-    },
     disabled: disabled,
-    className: JS_CLASS,
     minHeight: minHeight,
     placeholder: placeholder
-  }), locked && React.createElement(InputIcon, {
+  })), locked && React.createElement(InputIcon, {
     icon: "lock"
   }), linkPopup.isOpen && React.createElement(EditLinkPopup, {
     input: input,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startlibs/form",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "Startlibs Form",
   "main": "lib/index.js",
   "sideEffects": false,