@rhc-shared-components/rich-text-editor 0.3.2 → 0.3.5

package/dist/index.js

@@ -204,15 +204,15 @@ var RichTextEditorFormComponent = function RichTextEditorFormComponent(_ref) {
   var _useField = formik.useField({
     name: rest.name
   }),
-      meta = _useField[1];
+      meta = _useField[1],
+      setTouched = _useField[2].setTouched;
 
   var value = meta.value;
   var editorRef = React__namespace.useRef(null);
 
   var _useFormikContext = formik.useFormikContext(),
       isSubmitting = _useFormikContext.isSubmitting,
-      setFieldValue = _useFormikContext.setFieldValue,
-      validateField = _useFormikContext.validateField;
+      setFieldValue = _useFormikContext.setFieldValue;
 
   var _React$useState = React__namespace.useState(maxLength || 0),
       numberOfCharacters = _React$useState[0],
@@ -224,7 +224,7 @@ var RichTextEditorFormComponent = function RichTextEditorFormComponent(_ref) {
     }
   }, [value, maxLength]);
   return React__namespace.createElement(FormGroupContainer, {
-    validated: meta.error ? reactCore.ValidatedOptions.error : reactCore.ValidatedOptions["default"],
+    validated: meta.touched && meta.error ? reactCore.ValidatedOptions.error : reactCore.ValidatedOptions["default"],
     onClick: function onClick() {
       if (editorRef) {
         // @ts-ignore
@@ -246,12 +246,11 @@ var RichTextEditorFormComponent = function RichTextEditorFormComponent(_ref) {
     },
     disabled: disabled || isSubmitting,
     onChange: function onChange(data) {
-      setFieldValue(rest.name, data);
-      validateField(rest.name);
+      setFieldValue(rest.name, data, true);
     },
     onBlur: function onBlur(data) {
-      setFieldValue(rest.name, data);
-      validateField(rest.name);
+      setFieldValue(rest.name, data, true);
+      setTouched(true);
     }
   }), showMaxLengthText && React__namespace.createElement("div", {
     "data-testid": 'formTextAreaMaxLengthText',

package/dist/index.modern.js

@@ -183,7 +183,9 @@ const RichTextEditorFormComponent = _ref => {
   } = _ref,
       rest = _objectWithoutPropertiesLoose$1(_ref, _excluded);
 
-  const [, meta] = useField({
+  const [, meta, {
+    setTouched
+  }] = useField({
     name: rest.name
   });
   const {
@@ -192,8 +194,7 @@ const RichTextEditorFormComponent = _ref => {
   const editorRef = React.useRef(null);
   const {
     isSubmitting,
-    setFieldValue,
-    validateField
+    setFieldValue
   } = useFormikContext();
   const [numberOfCharacters, setNoOfCharacters] = React.useState(maxLength || 0);
   React.useEffect(() => {
@@ -202,7 +203,7 @@ const RichTextEditorFormComponent = _ref => {
     }
   }, [value, maxLength]);
   return React.createElement(FormGroupContainer, {
-    validated: meta.error ? ValidatedOptions.error : ValidatedOptions.default,
+    validated: meta.touched && meta.error ? ValidatedOptions.error : ValidatedOptions.default,
     onClick: () => {
       if (editorRef) {
         // @ts-ignore
@@ -224,12 +225,11 @@ const RichTextEditorFormComponent = _ref => {
     },
     disabled: disabled || isSubmitting,
     onChange: data => {
-      setFieldValue(rest.name, data);
-      validateField(rest.name);
+      setFieldValue(rest.name, data, true);
     },
     onBlur: data => {
-      setFieldValue(rest.name, data);
-      validateField(rest.name);
+      setFieldValue(rest.name, data, true);
+      setTouched(true);
     }
   }), showMaxLengthText && React.createElement("div", {
     "data-testid": 'formTextAreaMaxLengthText',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rhc-shared-components/rich-text-editor",
-  "version": "0.3.2",
+  "version": "0.3.5",
   "description": "WYSWYG Editor for Red Hat Certified Apps",
   "author": "gautamkrishnar",
   "license": "MIT",