Persist validation state in Form controls when Form gets re-rendered

Author: panichevoleg

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Precise UI Changelog
 
+## 2.1.3
+
+ - Persist validation state in Form controls when Form gets re-rendered
+
 ## 2.1.2
 
 - Fix Flyout container styles, add an example

package.json

@@ -1,6 +1,6 @@
 {
   "name": "precise-ui",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "description": "Precise UI React component library powered by Styled Components.",
   "keywords": [
     "react",

src/components/Autocomplete/index.tsx

@@ -151,7 +151,9 @@ class AutocompleteInt<T> extends React.Component<SupportedAutocompleteProps<T> &
     if (this.state.controlled) {
       this.setState({ value });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   componentDidMount() {

src/components/Checkbox/index.tsx

@@ -100,7 +100,9 @@ export class CheckboxInt extends React.PureComponent<CheckboxProps, CheckboxStat
     if (this.state.controlled) {
       this.setState({ value });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   componentDidMount() {

src/components/ColorPicker/index.tsx

@@ -228,7 +228,9 @@ class ColorPickerInt extends React.PureComponent<ColorPickerProps & FormContextP
         base,
       });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   componentDidMount() {

src/components/DateField/DateFieldInt.part.tsx

@@ -203,7 +203,9 @@ class DateFieldInt extends React.Component<DateFieldProps, DateFieldState> {
       this.setState({ value, date: this.parseDate(value) });
     }
 
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   componentDidMount() {

src/components/DropdownField/DropdownFieldInt.tsx

@@ -245,7 +245,9 @@ export class DropdownFieldInt extends React.Component<DropdownFieldProps & FormC
       });
     }
 
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   private show = () =>

src/components/FileSelect/index.tsx

@@ -93,7 +93,9 @@ class FileSelectInt extends React.Component<FileSelectProps & FormContextProps,
         previews: [],
       });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   private addFileEntries = (ev: React.ChangeEvent<HTMLInputElement>) => {

src/components/RadioButton/index.tsx

@@ -156,7 +156,9 @@ export class RadioButtonInt extends React.PureComponent<RadioButtonIntProps & Fo
     if (this.state.controlled) {
       this.setState({ value });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   componentDidMount() {

src/components/RadioButtonGroup/index.tsx

@@ -83,7 +83,9 @@ class RadioButtonGroupInt extends React.PureComponent<RadioButtonGroupProps & Fo
         value,
       });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   private getNextValue = (groupItemName?: string) => {

src/components/TagBuilder/TagBuilderInt.part.tsx

@@ -142,7 +142,9 @@ export class TagBuilderInt extends React.Component<TagBuilderProps & FormContext
         inputValue: inputValue,
       });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   componentDidMount() {

src/components/TextField/index.tsx

@@ -140,7 +140,9 @@ class TextFieldInt extends React.Component<TextFieldProps & FormContextProps, Te
     if (this.state.controlled) {
       this.setState({ value });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   componentDidMount() {

src/components/Toggle/index.tsx

@@ -121,7 +121,9 @@ class ToggleInt extends React.PureComponent<ToggleProps & FormContextProps, Togg
     if (this.state.controlled) {
       this.setState({ value });
     }
-    this.setState({ error });
+    if ('error' in this.props) {
+      this.setState({ error });
+    }
   }
 
   private changeValue() {