fix(carbon): add support for submitErrors

Author: rvsia

packages/carbon-component-mapper/src/files/checkbox.js

@@ -31,7 +31,7 @@ Wrapper.propTypes = {
 const SingleCheckbox = (props) => {
   const { input, meta, validateOnMount, helperText, WrapperProps, ...rest } = useFieldApi(prepareProps({ ...props, type: 'checkbox' }));
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
 
   const warnText = (meta.touched || validateOnMount) && meta.warning;
 

packages/carbon-component-mapper/src/files/date-picker.js

@@ -10,7 +10,7 @@ import HelperTextBlock from '../common/helper-text-block';
 const DatePicker = (props) => {
   const { input, datePickerType, meta, DatePickerProps, validateOnMount, helperText, WrapperProps, ...rest } = useFieldApi(prepareProps(props));
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
   const warnText = (meta.touched || validateOnMount) && meta.warning;
 
   return (

packages/carbon-component-mapper/src/files/field-array.js

@@ -79,7 +79,7 @@ const FieldArray = (props) => {
     ...buttonLabels
   };
 
-  const invalid = (meta.touched || validateOnMount) && !Array.isArray(meta.error) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && !Array.isArray(meta.error) && (meta.error || meta.submitError);
 
   return (
     <FormGroup

packages/carbon-component-mapper/src/files/radio.js

@@ -12,7 +12,7 @@ const Radio = (props) => {
     prepareProps({ type: 'radio', ...props })
   );
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
   const warnText = (meta.touched || validateOnMount) && meta.warning;
 
   return (

packages/carbon-component-mapper/src/files/select.js

@@ -236,7 +236,7 @@ const Select = (props) => {
   const Component =
     isMulti && isSearchClear ? ClearedMultiSelectFilterable : isMulti ? ClearedMultiSelect : isSearchClear ? ClearedSelectSearchable : ClearedSelect;
 
-  const invalidText = ((meta.touched || validateOnMount) && meta.error) || '';
+  const invalidText = ((meta.touched || validateOnMount) && (meta.error || meta.submitError)) || '';
   const text = ((meta.touched || validateOnMount) && meta.warning) || helperText;
 
   return (

packages/carbon-component-mapper/src/files/slider.js

@@ -10,7 +10,7 @@ import HelperTextBlock from '../common/helper-text-block';
 const Slider = (props) => {
   const { input, meta, isRequired, validateOnMount, helperText, WrapperProps, ...rest } = useFieldApi(prepareProps(props));
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
   const warnText = (meta.touched || validateOnMount) && meta.warning;
 
   return (

packages/carbon-component-mapper/src/files/switch.js

@@ -10,7 +10,7 @@ import HelperTextBlock from '../common/helper-text-block';
 const Switch = (props) => {
   const { input, meta, onText, offText, validateOnMount, helperText, WrapperProps, ...rest } = useFieldApi(prepareProps(props));
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
   const warnText = (meta.touched || validateOnMount) && meta.warning;
 
   return (

packages/carbon-component-mapper/src/files/text-field.js

@@ -9,7 +9,7 @@ import prepareProps from './prepare-props';
 const TextField = (props) => {
   const { input, meta, validateOnMount, ...rest } = useFieldApi(prepareProps(props));
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
   const warn = (meta.touched || validateOnMount) && meta.warning;
 
   return (

packages/carbon-component-mapper/src/files/textarea.js

@@ -9,7 +9,7 @@ import prepareProps from './prepare-props';
 const Textarea = (props) => {
   const { input, meta, validateOnMount, helperText, ...rest } = useFieldApi(prepareProps(props));
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
   const text = ((meta.touched || validateOnMount) && meta.warning) || helperText;
 
   return <TextArea {...input} key={input.name} id={input.name} invalid={Boolean(invalid)} invalidText={invalid || ''} helperText={text} {...rest} />;

packages/carbon-component-mapper/src/files/time-picker.js

@@ -14,7 +14,7 @@ const TimePicker = (props) => {
   const [format, selectFormat] = useState('AM');
   const isMounted = useRef(false);
 
-  const invalid = (meta.touched || validateOnMount) && meta.error;
+  const invalid = (meta.touched || validateOnMount) && (meta.error || meta.submitError);
   const warnText = (meta.touched || validateOnMount) && meta.warning;
 
   let finalValue = input.value;