@dartech/arsenal-ui 1.4.4 → 1.4.6

package/index.js

@@ -1054,8 +1054,7 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
       rules: {
         required: required && 'Please, fill this field',
         validate: val => {
-          console.log('_____', val);
-          if (val && validateJson) {
+          if (val && validateJson && typeof val === 'string') {
             try {
               JSON.parse(val);
               return true;
@@ -1112,7 +1111,7 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
         }
       }, {
         children: required ? jsxs(Fragment, {
-          children: [label, " ", jsx(Box, Object.assign({
+          children: [label, ' ', jsx(Box, Object.assign({
             component: "span",
             color: "#D6331F"
           }, {
@@ -2548,33 +2547,23 @@ var img$2 = "data:image/svg+xml,%3csvg width='32' height='24' viewBox='0 0 32 24
 
 const ControlPhoneInput = _a => {
   var {
+      control,
       name,
       label,
       required,
       mask = '+7 (799) 999 99 99'
     } = _a,
-    textFieldProps = __rest(_a, ["name", "label", "required", "mask"]);
-  const {
-    control,
-    watch,
-    trigger
-  } = useFormContext();
-  const phoneNumber = watch(name);
-  useEffect(() => {
-    if (/(\+7\s\(\d{3}\)\s)(\d{3}\s\d{2})(\s\d{2})/.test(phoneNumber)) {
-      trigger(name);
-    }
-  }, [phoneNumber, trigger, name]);
+    textFieldProps = __rest(_a, ["control", "name", "label", "required", "mask"]);
   return jsx(Controller, {
     control: control,
     name: name,
     rules: {
       required: required && 'Please, fill this field',
       validate: val => {
-        if (/(\+7\s\(\d{3}\)\s)(\d{3}\s\d{2})(\s\d{2})/.test(val)) {
-          return true;
+        if (!/(\+7\s\(\d{3}\)\s)(\d{3}\s\d{2})(\s\d{2})/.test(val)) {
+          return 'Incorrect phone number format';
         }
-        return 'Incorrect phone number format';
+        return true;
       }
     },
     render: ({
@@ -2585,7 +2574,7 @@ const ControlPhoneInput = _a => {
     }) => jsx(InputMask, Object.assign({
       mask: mask
     }, field, {
-      children: () => jsx(TextField, Object.assign({
+      children: jsx(TextField, Object.assign({
         fullWidth: true,
         size: "small",
         label: required && label ? jsxs(Fragment, {
@@ -5826,11 +5815,12 @@ const PropertyFiller = ({
   const {
     control,
     clearErrors,
-    setValue,
-    watch
+    setValue
   } = useFormContext();
   const {
-    // field: { value },
+    field: {
+      value
+    },
     fieldState: {
       error,
       isDirty
@@ -5845,11 +5835,6 @@ const PropertyFiller = ({
       }
     }
   });
-  // const value = watch(name);
-  const value = useWatch({
-    control,
-    name
-  });
   const prevValueRef = useRef({});
   const {
     propertyType,
@@ -5923,26 +5908,22 @@ const PropertyFiller = ({
     clearErrors();
   }, [name, defaultProperyValue, clearErrors, value, setFillOption, fillOption, propertyType, setValue, property]);
   useEffect(() => {
-    if (!isDirty && (property.defaultValue || property.value) && isPropertyValueEmpty(value)) {
-      setValue(name, property.defaultValue || property.value, {
-        shouldDirty: true
-      });
+    var _a;
+    if (!isDirty && isPropertyValueEmpty(value)) {
+      if (property.isRequired && (property.defaultValue === null || property.value === null)) {
+        setValue(name, (_a = prevValueRef.current[fillOption]) !== null && _a !== void 0 ? _a : defaultProperyValue);
+      } else if (!property.isRequired && (property.defaultValue === null || property.value === null)) {
+        setValue(name, null);
+      } else if (!(isPropertyValueEmpty(property.defaultValue) || isPropertyValueEmpty(property.value))) {
+        setValue(name, property.defaultValue || property.value);
+      }
     }
-  }, [isDirty, property, name, setValue, value, required]);
+  }, [value, setValue, defaultProperyValue, property, name, fillOption, isDirty]);
   useEffect(() => {
-    var _a;
-    if (
-    // value === undefined ||
-    property.isRequired && isPropertyValueEmpty(value) && (property.defaultValue === null || property.value === null)) {
-      setValue(name, (_a = prevValueRef.current[fillOption]) !== null && _a !== void 0 ? _a : defaultProperyValue, {
-        shouldDirty: true
-      });
-    } else if ((value === undefined || value === null) && !property.isRequired && (property.defaultValue === null || property.value === null)) {
-      setValue(name, null, {
-        shouldDirty: true
-      });
+    if (!isPropertyValueEmpty(value) && property.propertyType !== PropertyType.JSON) {
+      setValue(name, value);
     }
-  }, [value, setValue, defaultProperyValue, property, name, fillOption]);
+  }, [name, setValue, value, property]);
   return jsxs(Grid, Object.assign({
     xs: 12
   }, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dartech/arsenal-ui",
-  "version": "1.4.4",
+  "version": "1.4.6",
   "author": "DAR",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
     "@rollup/plugin-node-resolve": "13.3.0",
     "lodash": "4.17.21",
     "qs": "6.11.0",
-    "react-input-mask": "2.0.4"
+    "react-input-mask": "3.0.0-alpha.2"
   },
   "module": "./index.js",
   "main": "./index.js",

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

@@ -1,10 +1,12 @@
 import { ReactNode } from 'react';
 import { TextFieldProps } from '@mui/material/TextField';
+import { Control } from 'react-hook-form';
 type Props = TextFieldProps & {
+    control: Control<any>;
     name: string;
     required?: boolean;
     mask?: string;
     label?: ReactNode;
 };
-export declare const ControlPhoneInput: ({ name, label, required, mask, ...textFieldProps }: Props) => JSX.Element;
+export declare const ControlPhoneInput: ({ control, name, label, required, mask, ...textFieldProps }: Props) => JSX.Element;
 export default ControlPhoneInput;