@dartech/arsenal-ui 1.3.57 → 1.3.59

package/index.js

@@ -230,28 +230,31 @@ const ControlInput = _a => {
       onChange: customOnChange
     } = _a,
     textFieldProps = __rest(_a, ["control", "validate", "name", "label", "required", "defaultValue", "disabled", "textarea", "hideErrorMessage", "onChange"]);
-  const {
-    field: {
+  const _c = useController({
+      name,
+      control,
+      defaultValue,
+      rules: {
+        required: required && 'Please, fill this field',
+        validate
+      }
+    }),
+    _d = _c.field,
+    {
       ref,
       onChange
-    },
-    fieldState: {
-      error
-    }
-  } = useController({
-    name,
-    control,
-    defaultValue,
-    rules: {
-      required: required && 'Please, fill this field',
-      validate
-    }
-  });
+    } = _d,
+    fieldProps = __rest(_d, ["ref", "onChange"]),
+    {
+      fieldState: {
+        error
+      }
+    } = _c;
   const value = useWatch({
     control,
     name
   });
-  return jsx(TextField, Object.assign({
+  return jsx(TextField, Object.assign({}, fieldProps, {
     fullWidth: true,
     size: "small",
     variant: "outlined",
@@ -274,12 +277,11 @@ const ControlInput = _a => {
     multiline: textarea,
     minRows: textarea ? 3 : 1,
     value: value !== null && value !== void 0 ? value : '',
-    onChange: customOnChange ? customOnChange : onChange
-  }, textFieldProps, {
+    onChange: customOnChange ? customOnChange : onChange,
     inputProps: Object.assign(Object.assign({}, (_b = textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.inputProps) !== null && _b !== void 0 ? _b : {}), {
       value: value !== null && value !== void 0 ? value : ''
     })
-  }));
+  }, textFieldProps));
 };
 
 function useDebounce(func, delay) {
@@ -418,23 +420,26 @@ const ControlSelect = _a => {
       options = []
     } = _a,
     textFieldProps = __rest(_a, ["control", "validate", "name", "label", "required", "defaultValue", "disabled", "hideErrorMessage", "onChange", "labelKey", "valueKey", "options"]);
-  const {
-    field: {
+  const _c = useController({
+      name,
+      control,
+      defaultValue,
+      rules: {
+        required: required && 'Please, fill this field',
+        validate
+      }
+    }),
+    _d = _c.field,
+    {
       ref,
       onChange
-    },
-    fieldState: {
-      error
-    }
-  } = useController({
-    name,
-    control,
-    defaultValue,
-    rules: {
-      required: required && 'Please, fill this field',
-      validate
-    }
-  });
+    } = _d,
+    fieldProps = __rest(_d, ["ref", "onChange"]),
+    {
+      fieldState: {
+        error
+      }
+    } = _c;
   const value = useWatch({
     control,
     name
@@ -452,7 +457,7 @@ const ControlSelect = _a => {
       customOnChange(null);
     } else onChange(null);
   }, [onChange, customOnChange]);
-  return jsx(TextField, Object.assign({
+  return jsx(TextField, Object.assign({}, fieldProps, {
     select: true,
     fullWidth: true,
     size: "small",
@@ -526,19 +531,22 @@ const ControlCheckbox = _a => {
       onChange: customOnChange
     } = _a,
     checkboxProps = __rest(_a, ["control", "validate", "name", "label", "required", "defaultValue", "disabled", "hideErrorMessage", "onChange"]);
-  const {
-    field: {
+  const _b = useController({
+      name,
+      control,
+      defaultValue: false
+    }),
+    _c = _b.field,
+    {
       ref,
       onChange
-    },
-    fieldState: {
-      error
-    }
-  } = useController({
-    name,
-    control,
-    defaultValue: false
-  });
+    } = _c,
+    fieldProps = __rest(_c, ["ref", "onChange"]),
+    {
+      fieldState: {
+        error
+      }
+    } = _b;
   const value = useWatch({
     control,
     name
@@ -564,7 +572,7 @@ const ControlCheckbox = _a => {
     disabled: disabled
   }, {
     children: [jsx(FormControlLabel, {
-      control: jsx(Checkbox, Object.assign({
+      control: jsx(Checkbox, Object.assign({}, fieldProps, {
         checked: checked,
         onChange: customOnChange ? customOnChange : onChange,
         name: name,
@@ -599,23 +607,26 @@ const ControlRadio = ({
   row,
   radioProps
 }) => {
-  const {
-    field: {
+  const _a = useController({
+      name,
+      control,
+      defaultValue,
+      rules: {
+        required: required && 'Please, fill this field',
+        validate
+      }
+    }),
+    _b = _a.field,
+    {
       ref,
       onChange
-    },
-    fieldState: {
-      error
-    }
-  } = useController({
-    name,
-    control,
-    defaultValue,
-    rules: {
-      required: required && 'Please, fill this field',
-      validate
-    }
-  });
+    } = _b,
+    fieldProps = __rest(_b, ["ref", "onChange"]),
+    {
+      fieldState: {
+        error
+      }
+    } = _a;
   const value = useWatch({
     control,
     name
@@ -636,7 +647,7 @@ const ControlRadio = ({
       id: "radio-buttons-group"
     }, {
       children: label
-    })), jsx(RadioGroup, Object.assign({
+    })), jsx(RadioGroup, Object.assign({}, fieldProps, {
       row: row,
       "aria-labelledby": "radio-buttons-group",
       ref: ref,
@@ -1036,25 +1047,30 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
       readOnly,
       required = false,
       validateJson = false,
+      hideErrorMessage = false,
       fontSize = 16,
       validate = true,
       parseValue
     } = _a,
-    otherProps = __rest(_a, ["control", "name", "mode", "label", "width", "height", "readOnly", "required", "validateJson", "fontSize", "validate", "parseValue"]);
+    otherProps = __rest(_a, ["control", "name", "mode", "label", "width", "height", "readOnly", "required", "validateJson", "hideErrorMessage", "fontSize", "validate", "parseValue"]);
   const {
     setError,
     clearErrors
   } = useFormContext();
   const {
     field: {
-      onChange
+      onChange,
+      ref: formRef
     },
     fieldState: {
       error
     }
   } = useController({
     control,
-    name
+    name,
+    rules: {
+      required: required && 'Please, fill this field'
+    }
   });
   const value = useWatch({
     control,
@@ -1118,7 +1134,7 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
       }))
     }), jsxs(Fragment, {
       children: [jsx(CodeMirror, Object.assign({
-        ref: ref,
+        ref: ref || formRef,
         basicSetup: {
           autocompletion: true,
           history: true
@@ -1136,7 +1152,7 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
         value: mode === 'json' && typeof value !== 'string' ? value === null ? '' : JSON.stringify(value, null, 2) : value,
         onChange: handleChange,
         extensions: extensions[mode]
-      }, otherProps)), error && jsx(FormHelperText, Object.assign({
+      }, otherProps)), error && !hideErrorMessage && jsx(FormHelperText, Object.assign({
         error: true
       }, {
         children: error.message
@@ -1841,7 +1857,7 @@ const ControlNumberInput = _a => {
       name = '',
       label = '',
       required = false,
-      defaultValue,
+      defaultValue = null,
       disabled = false,
       hideErrorMessage = false,
       onChange: customOnChange,
@@ -1849,35 +1865,35 @@ const ControlNumberInput = _a => {
       valueAsNumber = true
     } = _a,
     textFieldProps = __rest(_a, ["control", "validate", "name", "label", "required", "defaultValue", "disabled", "hideErrorMessage", "onChange", "decimal", "valueAsNumber"]);
-  const {
-    field: {
-      ref,
-      onChange
-    },
-    fieldState: {
-      error
-    }
-  } = useController({
-    name,
-    control,
-    defaultValue,
-    rules: {
-      required: required && 'Please, fill this field',
-      validate: val => {
-        if (val === null || val === 0) return true;
-        if (decimal && !floatsOnly.test(val) || /^-*0+$/.test(val)) {
-          return 'Not valid number';
-        } else if (!decimal && !digitsOnly.test(val)) {
-          return 'Not valid integer';
+  const _c = useController({
+      name,
+      control,
+      defaultValue,
+      rules: {
+        required: required && 'Please, fill this field',
+        validate: val => {
+          if (val === null || val === 0) return true;
+          if (decimal && !floatsOnly.test(val) || /^-*0+$/.test(val)) {
+            return 'Not valid number';
+          } else if (!decimal && !digitsOnly.test(val)) {
+            return 'Not valid integer';
+          }
+          return true;
         }
-        return true;
       }
-    }
-  });
-  const value = useWatch({
-    control,
-    name
-  });
+    }),
+    _d = _c.field,
+    {
+      ref,
+      onChange,
+      value
+    } = _d,
+    fieldProps = __rest(_d, ["ref", "onChange", "value"]),
+    {
+      fieldState: {
+        error
+      }
+    } = _c;
   const handleChange = event => {
     var _a;
     const lastData = event.nativeEvent['data'] || event.target.value;
@@ -1902,7 +1918,7 @@ const ControlNumberInput = _a => {
       onChange(event.target.value);
     }
   };
-  return jsx(TextField, Object.assign({
+  return jsx(TextField, Object.assign({}, fieldProps, {
     fullWidth: true,
     size: "small",
     variant: "outlined",
@@ -1922,13 +1938,12 @@ const ControlNumberInput = _a => {
     error: !!error,
     helperText: !hideErrorMessage && (error === null || error === void 0 ? void 0 : error.message),
     disabled: disabled,
-    value: value !== null && value !== void 0 ? value : ''
-  }, textFieldProps, {
+    value: value !== null && value !== void 0 ? value : '',
     onChange: handleChange,
     inputProps: Object.assign(Object.assign({}, (_b = textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.inputProps) !== null && _b !== void 0 ? _b : {}), {
       value: value !== null && value !== void 0 ? value : ''
     })
-  }));
+  }, textFieldProps));
 };
 
 const ControlSwitch = _a => {
@@ -1938,15 +1953,15 @@ const ControlSwitch = _a => {
       label
     } = _a,
     switchProps = __rest(_a, ["control", "name", "label"]);
-  const {
-    field: {
+  const _b = useController({
+      control,
+      name
+    }).field,
+    {
       ref,
       onChange
-    }
-  } = useController({
-    control,
-    name
-  });
+    } = _b,
+    fieldProps = __rest(_b, ["ref", "onChange"]);
   const value = useWatch({
     control,
     name
@@ -1979,7 +1994,7 @@ const ControlSwitch = _a => {
   return jsx(FormControlLabel, {
     label: label,
     name: name,
-    control: jsx(Switch, Object.assign({
+    control: jsx(Switch, Object.assign({}, fieldProps, {
       color: "primary",
       size: "small",
       inputRef: ref,
@@ -2126,27 +2141,30 @@ const ControlTime = ({
   format: _format = TIME_DEFAULT_FORMAT,
   hideErrorMessage: _hideErrorMessage = false
 }) => {
-  const {
-    field: {
+  const _a = useController({
+      control,
+      name,
+      rules: {
+        required: required && 'Please, fill this field',
+        validate: val => {
+          if (isMatch(val, _format)) {
+            return true;
+          }
+          return 'Incorrect date format';
+        }
+      }
+    }),
+    _b = _a.field,
+    {
       onChange,
       ref
-    },
-    fieldState: {
-      error
-    }
-  } = useController({
-    control,
-    name,
-    rules: {
-      required: required && 'Please, fill this field',
-      validate: val => {
-        if (isMatch(val, _format)) {
-          return true;
-        }
-        return 'Incorrect date format';
+    } = _b,
+    fieldProps = __rest(_b, ["onChange", "ref"]),
+    {
+      fieldState: {
+        error
       }
-    }
-  });
+    } = _a;
   const value = useWatch({
     control,
     name
@@ -2165,7 +2183,7 @@ const ControlTime = ({
       setFieldValue(parsedValue);
     }
   }, [value, _format]);
-  return jsx(TimePicker, {
+  return jsx(TimePicker, Object.assign({}, fieldProps, {
     mask: "",
     inputRef: ref,
     label: required ? jsxs(Fragment, {
@@ -2190,7 +2208,7 @@ const ControlTime = ({
       error: !!error,
       helperText: !_hideErrorMessage && (error === null || error === void 0 ? void 0 : error.message)
     }))
-  });
+  }));
 };
 
 const ControlArrayInput = ({
@@ -3579,12 +3597,11 @@ const PropertyAdditionalFields = ({
   }
 };
 
-const JsonEditor = ({
+const JsonEditor = /*#__PURE__*/forwardRef(({
   validate: _validate = false,
   name,
-  inputRef,
   useParsedValue
-}) => {
+}, ref) => {
   const {
     control,
     setValue,
@@ -3606,7 +3623,7 @@ const JsonEditor = ({
     }
   };
   return jsx(CodeMirror, {
-    ref: inputRef,
+    ref: ref,
     basicSetup: {
       autocompletion: true,
       history: true
@@ -3620,11 +3637,11 @@ const JsonEditor = ({
       zIndex: 0,
       isolation: 'isolate'
     },
-    value: typeof value !== 'string' ? value === null ? '' : JSON.stringify(value, null, 2) : value,
+    value: typeof value !== 'string' ? value === null ? '' : JSON.stringify(value) : value,
     onChange: handleChange,
     extensions: [langs.json()]
   });
-};
+});
 var JsonEditor$1 = JsonEditor;
 
 const StringValueField = ({
@@ -3688,13 +3705,12 @@ const StringValueField = ({
 };
 var StringValueField$1 = StringValueField;
 
-const PropertyWidget = ({
+const PropertyWidget = /*#__PURE__*/forwardRef(({
   property,
   name,
   label,
-  useExpression,
-  inputRef
-}) => {
+  useExpression
+}, ref) => {
   const {
     control
   } = useFormContext();
@@ -3705,7 +3721,6 @@ const PropertyWidget = ({
     case PropertyType.DOUBLE:
       return jsx(ControlNumberInput, {
         decimal: true,
-        required: true,
         hideErrorMessage: true,
         control: control,
         name: name,
@@ -3715,8 +3730,10 @@ const PropertyWidget = ({
     case PropertyType.INTEGER:
     case PropertyType.BIG_INTEGER:
     case PropertyType.LONG:
-      return jsx(ControlNumberInput, {
-        required: true,
+      return jsx(ControlNumberInput
+      // required
+      , {
+        // required
         hideErrorMessage: true,
         control: control,
         name: name,
@@ -3729,8 +3746,10 @@ const PropertyWidget = ({
         name: name
       });
     case PropertyType.DATE:
-      return jsx(ControlDate, {
-        required: true,
+      return jsx(ControlDate
+      // required
+      , {
+        // required
         hideErrorMessage: true,
         control: control,
         name: name,
@@ -3738,8 +3757,10 @@ const PropertyWidget = ({
         format: property.format
       });
     case PropertyType.TIME:
-      return jsx(ControlTime, {
-        required: true,
+      return jsx(ControlTime
+      // required
+      , {
+        // required
         hideErrorMessage: true,
         control: control,
         name: name,
@@ -3747,8 +3768,10 @@ const PropertyWidget = ({
         format: property.format
       });
     case PropertyType.DATE_TIME:
-      return jsx(ControlDateTime, {
-        required: true,
+      return jsx(ControlDateTime
+      // required
+      , {
+        // required
         hideErrorMessage: true,
         control: control,
         name: name,
@@ -3759,12 +3782,14 @@ const PropertyWidget = ({
       return jsx(JsonEditor$1, {
         validate: true,
         name: name,
-        inputRef: inputRef,
+        ref: ref,
         useParsedValue: true
       });
     case PropertyType.STRING:
-      return jsx(StringValueField$1, {
-        required: true,
+      return jsx(StringValueField$1
+      // required={!property.isRequired}
+      , {
+        // required={!property.isRequired}
         name: name,
         label: label,
         restrictedValues: property.restrictedValues
@@ -3780,7 +3805,7 @@ const PropertyWidget = ({
     case PropertyType.ANY:
       return jsx(JsonEditor$1, {
         name: name,
-        inputRef: inputRef
+        ref: ref
       });
     case PropertyType.ENTITY:
       return jsx(DefinitionFiller, {
@@ -3793,7 +3818,7 @@ const PropertyWidget = ({
         children: "No widget"
       });
   }
-};
+});
 
 const usePropertyFiller = ({
   value,
@@ -3806,7 +3831,10 @@ const usePropertyFiller = ({
 }) => {
   const valueLabel = useMemo(() => label ? `${label} (value)` : `${property.name} (value)`, [label, property]);
   const fillOptionLabel = useMemo(() => label ? `${label} (widget)` : `${property.name} (widget)`, [label, property]);
-  const propertyType = useMemo(() => typeof property.propertyType === 'string' ? property.propertyType : property['propertyType']['value'], [property]);
+  const propertyType = useMemo(() => {
+    var _a;
+    return typeof property.propertyType === 'string' ? property.propertyType : (_a = property['propertyType']) === null || _a === void 0 ? void 0 : _a['value'];
+  }, [property]);
   const [fillOption, setFillOption] = useState(null);
   const fillOptions = useMemo(() => _multipleOptions ? getMultiplePropertyFillOptions({
     propertyType,
@@ -3817,6 +3845,32 @@ const usePropertyFiller = ({
     required: _required,
     useExpression: _useExpression
   }), [_useExpression, _required, propertyType, _multipleOptions]);
+  const defaultProperyValue = useMemo(() => {
+    if (property.isRequired) {
+      switch (propertyType) {
+        case PropertyType.STRING:
+        case PropertyType.DATE:
+        case PropertyType.TIME:
+        case PropertyType.DATE_TIME:
+        case PropertyType.ENTITY_REFERENCE:
+        case PropertyType.ANY:
+          return '';
+        case PropertyType.JSON:
+          return {};
+        case PropertyType.BOOLEAN:
+          return true;
+        case PropertyType.INTEGER:
+        case PropertyType.BIG_DECIMAL:
+        case PropertyType.BIG_INTEGER:
+        case PropertyType.DOUBLE:
+        case PropertyType.LONG:
+        case PropertyType.FLOAT:
+          return 0;
+        default:
+          return {};
+      }
+    } else return null;
+  }, [propertyType, property]);
   useEffect(() => {
     if (!fillOption) {
       if (isPropertyValueEmpty(value) && (fillOptions === null || fillOptions === void 0 ? void 0 : fillOptions.length)) {
@@ -3840,7 +3894,8 @@ const usePropertyFiller = ({
     fillOptionLabel,
     fillOption,
     fillOptions,
-    setFillOption
+    setFillOption,
+    defaultProperyValue
   };
 };
 var usePropertyFiller$1 = usePropertyFiller;
@@ -3870,7 +3925,8 @@ const PropertyFiller = ({
   const {
     field: {
       ref,
-      onChange
+      onChange,
+      value
     },
     fieldState: {
       error,
@@ -3879,21 +3935,19 @@ const PropertyFiller = ({
   } = useController({
     name,
     control,
+    defaultValue: property.defaultValue,
     rules: {
       required
     }
   });
-  const value = useWatch({
-    control,
-    name
-  });
   const {
     propertyType,
     valueLabel,
     fillOptionLabel,
     fillOption,
     fillOptions,
-    setFillOption
+    setFillOption,
+    defaultProperyValue
   } = usePropertyFiller$1({
     value,
     property,
@@ -3915,10 +3969,10 @@ const PropertyFiller = ({
         try {
           onChange(JSON.stringify(definitionValue, null, '\t'));
         } catch (error) {
-          console.log('Stringify failed');
+          console.log('Stringify failed', error);
         }
       } else {
-        setValue(name, null);
+        setValue(name, property.defaultValue || defaultProperyValue);
       }
     } else if (selectedType === 'expression' || selectedType === 'string') {
       onChange('');
@@ -3936,19 +3990,19 @@ const PropertyFiller = ({
           onChange(definitionValue);
         } catch (error) {
           onChange(defaultArrayValue);
-          console.log('Parse failed');
+          // console.log('Parse failed');
         }
       } else {
         onChange(defaultArrayValue);
       }
     }
     clearErrors();
-  }, [name, clearErrors, value, setFillOption, onChange, fillOption, propertyType, setValue]);
+  }, [name, defaultProperyValue, clearErrors, value, setFillOption, onChange, fillOption, propertyType, setValue, property]);
   useEffect(() => {
     if (value === undefined) {
-      onChange(null);
+      onChange(property.defaultValue || defaultProperyValue);
     }
-  }, [value, onChange]);
+  }, [value, onChange, defaultProperyValue, property]);
   return jsxs(Grid$1, Object.assign({
     xs: 12
   }, {
@@ -3987,7 +4041,8 @@ const PropertyFiller = ({
       }))
     })) : null, fillOption === 'expression' && (propertyType === PropertyType.JSON || propertyType === PropertyType.ENTITY || propertyType === PropertyType.ANY ? jsx(JsonEditor$1, {
       name: name,
-      inputRef: ref
+      ref: ref,
+      useParsedValue: true
     }) : jsx(ControlInput, {
       control: control,
       name: name,
@@ -4002,19 +4057,19 @@ const PropertyFiller = ({
       hideErrorMessage: true
     }), fillOption === 'json_notvalid' && jsx(JsonEditor$1, {
       name: name,
-      inputRef: ref
+      ref: ref
     }), fillOption === 'widget' && jsx(PropertyWidget, {
       property: property,
       name: name,
       useExpression: useExpression,
       label: valueLabel,
-      inputRef: ref,
+      ref: ref,
       required: required
     }), fillOption === 'dem_builder' && jsx(CreateDefinition, {
       title: "JSON",
       definitionFieldName: name
-    }), error && jsx(Typography, Object.assign({
-      color: "secondary"
+    }), error && jsx(FormHelperText, Object.assign({
+      error: true
     }, {
       children: error.message
     }))]
@@ -4033,18 +4088,6 @@ const MultiplePropertyWidget = ({
     setValue,
     clearErrors
   } = useFormContext();
-  // const controller = useController({
-  //   control,
-  //   name,
-  // rules: {
-  //   validate: (val) => {
-  //     if (!val || (Array.isArray(val) && !val.length)) {
-  //       return 'Please, fill array';
-  //     }
-  //     return true;
-  //   },
-  // },
-  // });
   const values = useWatch({
     control,
     name
@@ -4053,7 +4096,7 @@ const MultiplePropertyWidget = ({
     if (values && Array.isArray(values)) {
       setValue(`${name}.${values.length}`, null);
     } else {
-      setValue(name, [null]);
+      setValue(name, []);
     }
     clearErrors(name);
   }, [name, values, setValue, clearErrors]);
@@ -4066,7 +4109,7 @@ const MultiplePropertyWidget = ({
     direction: "column",
     xs: 12
   }, {
-    children: [values && Array.isArray(values) ? values.map((value, index) => jsx(Grid$1, Object.assign({
+    children: [Array.isArray(values) && values.length ? values.map((value, index) => jsx(Grid$1, Object.assign({
       xs: 12
     }, {
       children: jsxs(Box, Object.assign({
@@ -4122,7 +4165,8 @@ const MultiplePropertyFiller = ({
 }) => {
   const {
     control,
-    clearErrors
+    clearErrors,
+    setValue
   } = useFormContext();
   const {
     field: {
@@ -4136,11 +4180,10 @@ const MultiplePropertyFiller = ({
   } = useController({
     control,
     name,
+    defaultValue: property.defaultValue,
     rules: {
       validate: val => {
-        if (required && !val) {
-          return 'Please, fill this field';
-        }
+        if (required && !val) return 'Please, fill this field';
         return true;
       }
     }
@@ -4168,7 +4211,7 @@ const MultiplePropertyFiller = ({
   const handleFillOptionChange = event => {
     const selectedType = event.target.value;
     if (selectedType === 'null') {
-      onChange(null);
+      setValue(name, null);
     } else if (selectedType === 'expression' || selectedType === 'json_valid' || selectedType === 'json_notvalid') {
       onChange('');
     } else if (selectedType === 'widget') {
@@ -4179,9 +4222,9 @@ const MultiplePropertyFiller = ({
   };
   useEffect(() => {
     if (value === undefined) {
-      onChange(null);
+      onChange(property.isRequired ? [] : null);
     }
-  }, [value, onChange]);
+  }, [value, property, onChange]);
   return jsxs(Grid$1, {
     children: [title && jsx(Box, Object.assign({
       mb: 2
@@ -4218,7 +4261,7 @@ const MultiplePropertyFiller = ({
       }))
     })) : null, fillOption === 'expression' && (propertyType === PropertyType.JSON || propertyType === PropertyType.ENTITY || propertyType === PropertyType.ANY ? jsx(JsonEditor$1, {
       name: name,
-      inputRef: ref
+      ref: ref
     }) : jsx(ControlInput, {
       required: true,
       hideErrorMessage: true,
@@ -4228,7 +4271,7 @@ const MultiplePropertyFiller = ({
     })), fillOption === 'json_valid' && jsx(JsonEditor$1, {
       validate: true,
       name: name,
-      inputRef: ref,
+      ref: ref,
       useParsedValue: true
     }), fillOption === 'widget' && jsx(MultiplePropertyWidget$1, {
       property: property,
@@ -4236,8 +4279,8 @@ const MultiplePropertyFiller = ({
       useExpression: useExpression,
       required: required,
       label: label
-    }), error && jsx(Typography, Object.assign({
-      color: "secondary"
+    }), error && jsx(FormHelperText, Object.assign({
+      error: true
     }, {
       children: error.message
     }))]
@@ -4546,7 +4589,7 @@ const ValidationNodeSelector = ({
       content: jsxs(Fragment, {
         children: [jsxs(Box, Object.assign({
           display: "flex",
-          alignItems: "center"
+          alignItems: "flex-end"
         }, {
           children: [jsx(ControlSelect, {
             required: true,
@@ -5306,7 +5349,8 @@ const DefinitionFiller = ({
   const stepperData = useMemo(() => {
     if (properties) {
       return properties.map(property => {
-        const propertyType = typeof property.propertyType === 'string' ? property.propertyType : property['propertyType']['value'];
+        var _a;
+        const propertyType = typeof property.propertyType === 'string' ? property.propertyType : (_a = property['propertyType']) === null || _a === void 0 ? void 0 : _a['value'];
         return {
           label: jsxs(Box, Object.assign({
             display: "flex",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dartech/arsenal-ui",
-  "version": "1.3.57",
+  "version": "1.3.59",
   "author": "DAR",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/src/lib/Forms/ControlAceEditor.d.ts

@@ -13,6 +13,7 @@ export interface ControlAceEditorProps {
     validateJson?: boolean;
     fontSize?: number;
     validate?: boolean;
+    hideErrorMessage?: boolean;
     parseValue?: boolean;
     [key: string]: unknown;
 }

package/src/lib/Property/PropertyFiller/JsonEditor.d.ts

@@ -1,10 +1,9 @@
 /// <reference types="react" />
-import { RefCallBack } from 'react-hook-form';
+import { ReactCodeMirrorRef } from '@uiw/react-codemirror';
 type Props = {
     useParsedValue?: boolean;
     validate?: boolean;
     name: string;
-    inputRef: RefCallBack;
 };
-declare const JsonEditor: ({ validate, name, inputRef, useParsedValue }: Props) => JSX.Element;
+declare const JsonEditor: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<ReactCodeMirrorRef>>;
 export default JsonEditor;

package/src/lib/Property/PropertyFiller/usePropertyFiller.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PropertyFillType, PropertyUnion } from '../../../interfaces';
+import { PropertyFillType, PropertyUnion, PropertyType } from '../../../interfaces';
 type Props = {
     value: unknown;
     property: PropertyUnion;
@@ -10,7 +10,7 @@ type Props = {
     multipleOptions?: boolean;
 };
 declare const usePropertyFiller: ({ value, property, label, isDirty, required, useExpression, multipleOptions, }: Props) => {
-    propertyType: import("../../../interfaces").PropertyType;
+    propertyType: PropertyType;
     valueLabel: string;
     fillOptionLabel: string;
     fillOption: PropertyFillType;
@@ -20,5 +20,6 @@ declare const usePropertyFiller: ({ value, property, label, isDirty, required, u
         sortOrder: number;
     }[];
     setFillOption: import("react").Dispatch<import("react").SetStateAction<PropertyFillType>>;
+    defaultProperyValue: {};
 };
 export default usePropertyFiller;

package/src/lib/Property/PropertyWidget/PropertyWidget.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import { RefCallBack } from 'react-hook-form';
 import { PropertyUnion } from '../../../interfaces';
 type Props = {
     property: PropertyUnion;
@@ -7,7 +6,6 @@ type Props = {
     label?: string;
     useExpression?: boolean;
     required?: boolean;
-    inputRef: RefCallBack;
 };
-export declare const PropertyWidget: ({ property, name, label, useExpression, inputRef }: Props) => JSX.Element;
+export declare const PropertyWidget: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<any>>;
 export default PropertyWidget;