@dartech/arsenal-ui 1.3.68 → 1.3.70

package/index.js

@@ -38,7 +38,7 @@ import { format, isMatch, isValid, parse } from 'date-fns';
 import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
 import { TimePicker } from '@mui/x-date-pickers/TimePicker';
 import Chip from '@mui/material/Chip';
-import Grid from '@mui/material/Unstable_Grid2/Grid2';
+import Grid from '@mui/material/Unstable_Grid2';
 import { toString, parse as parse$1 } from 'duration-fns';
 import Pagination from '@mui/material/Pagination';
 import MuiTablePagination from '@mui/material/TablePagination';
@@ -57,7 +57,6 @@ import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
 import Paper from '@mui/material/Paper';
 import Tab from '@mui/material/Tab';
 import Tabs from '@mui/material/Tabs';
-import Grid$1 from '@mui/material/Unstable_Grid2';
 import Accordion from '@mui/material/Accordion';
 import AccordionSummary from '@mui/material/AccordionSummary';
 import AccordionDetails from '@mui/material/AccordionDetails';
@@ -71,10 +70,11 @@ import StepContent from '@mui/material/StepContent';
 import StepConnector from '@mui/material/StepConnector';
 import Select from '@mui/material/Select';
 import InputLabel from '@mui/material/InputLabel';
+import { toast } from 'react-toastify';
+import axios from 'axios';
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
 import classnames from 'classnames';
-import { toast } from 'react-toastify';
 import CssBaseline from '@mui/material/CssBaseline';
 import MuiDrawer from '@mui/material/Drawer';
 import MuiList from '@mui/material/List';
@@ -1218,7 +1218,6 @@ const JsonView = /*#__PURE__*/forwardRef(({
   const [loading, setLoading] = useState(true);
   const onCreateEditor = useCallback(view => {
     const onScroll = e => {
-      console.log();
       if (view.scrollDOM.scrollHeight - view.scrollDOM.offsetHeight - e.target.scrollTop < 10) {
         setTimeout(() => view.scrollDOM.scrollTo(0, 0), 200);
       }
@@ -3132,7 +3131,7 @@ const BigDecimalPropertyFields = ({
     control
   } = useFormContext();
   return jsxs(Fragment, {
-    children: [jsx(Grid$1, {
+    children: [jsx(Grid, {
       children: jsx(ControlNumberInput, {
         required: true,
         control: control,
@@ -3140,7 +3139,7 @@ const BigDecimalPropertyFields = ({
         name: `${propertyFieldName}.precisionScale`,
         label: "Precision Scale"
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlSelect, {
         required: true,
         control: control,
@@ -3161,7 +3160,7 @@ const DateAdditionalFields = ({
   const {
     control
   } = useFormContext();
-  return jsx(Grid$1, {
+  return jsx(Grid, {
     children: jsx(ControlInput, {
       required: true,
       control: control,
@@ -3306,17 +3305,17 @@ const EntityAdditionalFields = ({
     }
   });
   return jsxs(Fragment, {
-    children: [jsx(Grid$1, {
+    children: [jsx(Grid, {
       children: jsx(Typography, Object.assign({
         variant: "h6"
       }, {
         children: "Properties"
       }))
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(EntityPropertiesShortView$1, {
         properties: properties
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(Button, Object.assign({
         variant: "contained",
         color: "primary",
@@ -3339,7 +3338,7 @@ const EntityAdditionalFields = ({
           overflow: 'hidden'
         }
       }, {
-        children: jsxs(Grid$1, Object.assign({
+        children: jsxs(Grid, Object.assign({
           container: true,
           direction: "row",
           spacing: 2,
@@ -3347,7 +3346,7 @@ const EntityAdditionalFields = ({
             height: '100%'
           }
         }, {
-          children: [jsxs(Grid$1, Object.assign({
+          children: [jsxs(Grid, Object.assign({
             xs: 3,
             style: {
               backgroundColor: '#f9f9f9',
@@ -3388,7 +3387,7 @@ const EntityAdditionalFields = ({
             }, {
               children: "Add property"
             }))]
-          })), jsx(Grid$1, Object.assign({
+          })), jsx(Grid, Object.assign({
             container: true,
             wrap: "nowrap",
             direction: "column",
@@ -3422,35 +3421,72 @@ const EntityAdditionalFields = ({
 };
 var EntityAdditionalFields$1 = EntityAdditionalFields;
 
+const sources = [{
+  label: 'Arsenal',
+  value: 'ARSENAL'
+}, {
+  label: 'Scalend',
+  value: 'SCALEND'
+}];
+const modules = [{
+  label: 'Customers',
+  value: 'CUSTOMERS'
+}, {
+  label: 'Products',
+  value: 'PRODUCTS'
+}, {
+  label: 'Pledges',
+  value: 'PLEDGES'
+}];
 const EntityReferencePropertyFields = ({
   propertyFieldName
 }) => {
   const {
     control
   } = useFormContext();
+  const source = useWatch({
+    control,
+    name: `${propertyFieldName}.source`
+  });
   return jsxs(Fragment, {
-    children: [jsx(Grid$1, {
-      children: jsx(ControlInput, {
+    children: [jsx(Grid, {
+      children: jsx(ControlSelect, {
+        required: true,
+        control: control,
+        name: `${propertyFieldName}.source`,
+        label: "Source",
+        options: sources
+      })
+    }), source && jsx(Grid, {
+      children: source === 'ARSENAL' ? jsx(ControlInput, {
         required: true,
         control: control,
         name: `${propertyFieldName}.definitionCode`,
         label: "Definition Code"
+      }) : jsx(ControlSelect, {
+        required: true,
+        control: control,
+        name: `${propertyFieldName}.definitionCode`,
+        label: "Definition Code",
+        valueKey: "value",
+        options: modules
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlInput, {
         required: true,
         control: control,
         name: `${propertyFieldName}.definitionVersion`,
-        label: "Definition Version"
+        label: "Definition Version",
+        defaultValue: 1
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlInput, {
         required: true,
         control: control,
         name: `${propertyFieldName}.labelPropertyCode`,
         label: "Label Property Code"
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlInput, {
         required: true,
         control: control,
@@ -3504,13 +3540,13 @@ const StringPropertyFields = ({
     }
   };
   return jsxs(Fragment, {
-    children: [jsx(Grid$1, {
+    children: [jsx(Grid, {
       children: jsx(Typography, Object.assign({
         variant: "h6"
       }, {
         children: "Restricted Values"
       }))
-    }), !!(restrictedValues === null || restrictedValues === void 0 ? void 0 : restrictedValues.length) && jsx(Grid$1, {
+    }), !!(restrictedValues === null || restrictedValues === void 0 ? void 0 : restrictedValues.length) && jsx(Grid, {
       children: jsx(Box, Object.assign({
         display: "flex",
         flexWrap: "wrap"
@@ -3524,7 +3560,7 @@ const StringPropertyFields = ({
           onDelete: () => handleDelete(index)
         }, index))
       }))
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(TextField, {
         fullWidth: true,
         variant: "outlined",
@@ -3663,12 +3699,138 @@ const StringValueField = ({
 };
 var StringValueField$1 = StringValueField;
 
+function useEntitiesService({
+  baseURL
+}) {
+  const entitiesInstance = axios.create({
+    baseURL: baseURL
+  });
+  const getEntitiesByCodeAndVersion = ({
+    definitionCode,
+    definitionVersion
+  }) => __awaiter(this, void 0, void 0, function* () {
+    const response = yield entitiesInstance.get(`/entities/code/${definitionCode}/version/${definitionVersion}`);
+    console.log(response);
+    return response.data;
+  });
+  const getCustomerApplications = params => __awaiter(this, void 0, void 0, function* () {
+    const response = yield entitiesInstance.get('/customer-application-instances', {
+      params
+    });
+    return response.data['collection'];
+  });
+  const getProducts = params => __awaiter(this, void 0, void 0, function* () {
+    const response = yield entitiesInstance.get('/products', {
+      params
+    });
+    return response.data['collection'];
+  });
+  const getPledgeInstances = params => __awaiter(this, void 0, void 0, function* () {
+    const response = yield entitiesInstance.get('/pledge-instances', {
+      params
+    });
+    return response.data['collection'];
+  });
+  return {
+    getEntitiesByCodeAndVersion,
+    getCustomerApplications,
+    getProducts,
+    getPledgeInstances
+  };
+}
+
+const EntityReferenceValueField = ({
+  name,
+  required: _required = false,
+  definitionProperty,
+  baseURL: _baseURL = 'https://dev-sl-api.dar-dev.zone/api/v1'
+}) => {
+  const {
+    control
+  } = useFormContext();
+  const {
+    source,
+    definitionCode,
+    definitionVersion,
+    valuePropertyCode,
+    labelPropertyCode
+  } = definitionProperty;
+  const {
+    getCustomerApplications,
+    getEntitiesByCodeAndVersion,
+    getPledgeInstances,
+    getProducts
+  } = useEntitiesService({
+    baseURL: _baseURL
+  });
+  const [loading, setLoading] = useState(false);
+  const [referredInstancesValues, setReferredInstancesValues] = useState([]);
+  const scalendCallback = useMemo(() => {
+    if (source === 'SCALEND') {
+      switch (definitionCode) {
+        case 'CUSTOMERS':
+          return getCustomerApplications;
+        case 'PLEDGES':
+          return getPledgeInstances;
+        case 'PRODUCTS':
+          return getProducts;
+        default:
+          return null;
+      }
+    }
+    return null;
+  }, [definitionCode, source]);
+  useEffect(() => {
+    if (definitionCode && definitionVersion) {
+      setLoading(true);
+      if (source === 'ARSENAL') {
+        getEntitiesByCodeAndVersion({
+          definitionCode,
+          definitionVersion
+        }).then(instances => {
+          const instanceValues = instances.map(instance => instance['data'][`${valuePropertyCode}`]);
+          setReferredInstancesValues(instanceValues);
+        }).catch(error => {
+          setReferredInstancesValues([]);
+          toast.error(error);
+        }).finally(() => {
+          setLoading(false);
+        });
+      } else if (source === 'SCALEND') {
+        scalendCallback().then(instances => {
+          const instanceValues = instances.map(instance => instance.id);
+          setReferredInstancesValues(instanceValues);
+        }).catch(error => {
+          setReferredInstancesValues([]);
+          toast.error(error);
+        }).finally(() => {
+          setLoading(false);
+        });
+      }
+    }
+  }, [definitionCode, definitionVersion, valuePropertyCode, source, labelPropertyCode, scalendCallback]);
+  return jsx(Grid, {
+    children: jsx(ControlAutocomplete, {
+      required: _required,
+      control: control,
+      name: source === 'SCALEND' ? name : `${name}.${labelPropertyCode}`,
+      label: labelPropertyCode,
+      labelKey: labelPropertyCode,
+      valueKey: valuePropertyCode,
+      loading: loading,
+      options: referredInstancesValues
+    })
+  });
+};
+var EntityReferenceValueField$1 = EntityReferenceValueField;
+
 const PropertyWidget = ({
   property,
   name,
   label,
   useExpression,
-  control
+  control,
+  baseURL
 }) => {
   const propertyType = useMemo(() => typeof property.propertyType === 'string' ? property.propertyType : property['propertyType']['value'], [property]);
   switch (propertyType) {
@@ -3750,14 +3912,13 @@ const PropertyWidget = ({
         restrictedValues: property.restrictedValues
       });
     case PropertyType.ENTITY_REFERENCE:
-      return jsx(ControlInput
+      return jsx(EntityReferenceValueField$1
       // required
       , {
         // required
-        hideErrorMessage: true,
         name: name,
-        label: label,
-        control: control
+        definitionProperty: property,
+        baseURL: baseURL
       });
     case PropertyType.ANY:
       return jsx(ControlAceEditor, {
@@ -3876,17 +4037,17 @@ const PropertyFiller = ({
   useExpression,
   label,
   required,
-  title
+  title,
+  baseURL
 }) => {
   const {
     control,
     clearErrors,
-    setValue
+    setValue,
+    watch
   } = useFormContext();
   const {
-    field: {
-      value
-    },
+    // field: { value },
     fieldState: {
       error,
       isDirty
@@ -3897,11 +4058,13 @@ const PropertyFiller = ({
     defaultValue: property.defaultValue,
     rules: {
       validate: val => {
-        if (required && val === null) return 'Please, fill this field555';
+        if (required && val === null) return 'Please, fill this field';
         return true;
       }
     }
   });
+  const value = watch(name);
+  const prevValueRef = useRef({});
   const {
     propertyType,
     valueLabel,
@@ -3920,24 +4083,32 @@ const PropertyFiller = ({
   });
   const handleFillOptionChange = useCallback(event => {
     const selectedType = event.target.value;
+    prevValueRef.current = Object.assign(Object.assign({}, prevValueRef.current), {
+      [fillOption]: value
+    });
     setFillOption(selectedType);
+    const prevValue = prevValueRef.current[selectedType];
     if (selectedType === 'null') {
-      setValue(name, null);
+      setValue(name, null, {
+        shouldDirty: true
+      });
     } else if (selectedType === 'widget') {
       if (propertyType === PropertyType.JSON && value && typeof value !== 'string' && fillOption === 'dem_builder' && 'properties' in value) {
         const definitionValue = Object.assign(Object.assign({}, value), {
           properties: propertiesArrayToObject(value.property || [])
         });
         try {
-          setValue(name, JSON.stringify(definitionValue, null, '\t'));
+          setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : JSON.stringify(definitionValue, null, '\t'));
         } catch (error) {
           console.log('Stringify failed', error);
         }
       } else {
-        setValue(name, property.defaultValue || defaultProperyValue);
+        setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : property.defaultValue || defaultProperyValue);
       }
     } else if (selectedType === 'expression' || selectedType === 'string') {
-      setValue(name, '');
+      setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : '', {
+        shouldDirty: true
+      });
     } else if (selectedType === 'dem_builder') {
       const defaultArrayValue = {
         code: '',
@@ -3949,12 +4120,18 @@ const PropertyFiller = ({
         try {
           const definitionValue = JSON.parse(value);
           definitionValue['properties'] = propertiesObjectToArray(definitionValue['properties'] || {});
-          setValue(name, definitionValue);
+          setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : definitionValue, {
+            shouldDirty: true
+          });
         } catch (error) {
-          setValue(name, defaultArrayValue);
+          setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : defaultArrayValue, {
+            shouldDirty: true
+          });
         }
       } else {
-        setValue(name, defaultArrayValue);
+        setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : defaultArrayValue, {
+          shouldDirty: true
+        });
       }
     }
     clearErrors();
@@ -3965,11 +4142,12 @@ const PropertyFiller = ({
     }
   }, [isDirty, property, name, setValue]);
   useEffect(() => {
+    var _a;
     if (value === undefined || property.isRequired && value === null && !property.defaultValue) {
-      setValue(name, defaultProperyValue);
+      setValue(name, (_a = prevValueRef.current[fillOption]) !== null && _a !== void 0 ? _a : defaultProperyValue);
     }
-  }, [value, setValue, defaultProperyValue, property, name]);
-  return jsxs(Grid$1, Object.assign({
+  }, [value, setValue, defaultProperyValue, property, name, fillOption]);
+  return jsxs(Grid, Object.assign({
     xs: 12
   }, {
     children: [title && jsx(Box, Object.assign({
@@ -4032,7 +4210,8 @@ const PropertyFiller = ({
       property: property,
       name: name,
       useExpression: useExpression,
-      label: valueLabel
+      label: valueLabel,
+      baseURL: baseURL
     }), fillOption === 'dem_builder' && jsx(CreateDefinition, {
       title: "JSON",
       definitionFieldName: name
@@ -4096,7 +4275,8 @@ const MultiplePropertyWidget = ({
   property,
   useExpression,
   required,
-  label
+  label,
+  baseURL
 }) => {
   const {
     control,
@@ -4118,13 +4298,13 @@ const MultiplePropertyWidget = ({
   const handleDeleteValue = useCallback(index => {
     setValue(name, removeArrayItem(values, index));
   }, [name, values, setValue]);
-  return jsxs(Grid$1, Object.assign({
+  return jsxs(Grid, Object.assign({
     container: true,
     spacing: 2,
     direction: "column",
     xs: 12
   }, {
-    children: [Array.isArray(values) && values.length ? values.map((value, index) => jsx(Grid$1, Object.assign({
+    children: [Array.isArray(values) && values.length ? values.map((value, index) => jsx(Grid, Object.assign({
       xs: 12
     }, {
       children: jsxs(Box, Object.assign({
@@ -4141,12 +4321,14 @@ const MultiplePropertyWidget = ({
           property: property,
           useExpression: useExpression,
           name: `${name}.${index}`,
-          label: `${label || property.name} (${index + 1})`
+          label: `${label || property.name} (${index + 1})`,
+          baseURL: baseURL
         }), jsx(Box, Object.assign({
           mt: "8px",
           ml: "4px"
         }, {
           children: jsx(IconButton, Object.assign({
+            id: "close-button",
             size: "small",
             onClick: () => handleDeleteValue(index)
           }, {
@@ -4160,7 +4342,7 @@ const MultiplePropertyWidget = ({
           }))
         }))]
       }))
-    }), index)) : null, jsx(Grid$1, {
+    }), index)) : null, jsx(Grid, {
       children: jsx(Button, Object.assign({
         variant: "contained",
         size: "small",
@@ -4180,20 +4362,21 @@ const MultiplePropertyFiller = ({
   useExpression,
   required,
   label,
-  title
+  title,
+  baseURL
 }) => {
   var _a;
   const [selectTouched, setSelectTouched] = useState(false);
   const {
     control,
     clearErrors,
-    setValue
+    setValue,
+    watch
   } = useFormContext();
   const {
     field: {
       ref,
-      onChange,
-      value
+      onChange
     },
     fieldState: {
       error,
@@ -4210,6 +4393,8 @@ const MultiplePropertyFiller = ({
       }
     }
   });
+  const value = watch(name);
+  const prevValueRef = useRef({});
   const {
     propertyType,
     valueLabel,
@@ -4229,13 +4414,21 @@ const MultiplePropertyFiller = ({
   });
   const handleFillOptionChange = event => {
     setSelectTouched(true);
+    prevValueRef.current = Object.assign(Object.assign({}, prevValueRef.current), {
+      [fillOption]: value
+    });
     const selectedType = event.target.value;
+    const prevValue = prevValueRef.current[selectedType];
     if (selectedType === 'null') {
       setValue(name, null);
     } else if (selectedType === 'expression' || selectedType === 'json_valid' || selectedType === 'json_notvalid') {
-      onChange('');
+      setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : '', {
+        shouldDirty: true
+      });
     } else if (selectedType === 'widget') {
-      onChange([]);
+      setValue(name, prevValue !== null && prevValue !== void 0 ? prevValue : [], {
+        shouldDirty: true
+      });
     }
     setFillOption(selectedType);
     clearErrors(name);
@@ -4251,7 +4444,7 @@ const MultiplePropertyFiller = ({
       checkFillOption();
     }
   }, [checkFillOption, selectTouched, value]);
-  return jsxs(Grid$1, {
+  return jsxs(Grid, {
     children: [title && jsx(Box, Object.assign({
       mb: 2
     }, {
@@ -4304,7 +4497,8 @@ const MultiplePropertyFiller = ({
       name: name,
       useExpression: useExpression,
       required: required,
-      label: label
+      label: label,
+      baseURL: baseURL
     }), error && jsx(FormHelperText, Object.assign({
       error: true
     }, {
@@ -4815,26 +5009,26 @@ const CreatePropertyFormFields = ({
       setValue(`${propertyFieldName}.propertyType`, propertyTypes.find(el => el.value === propertyType));
     }
   }, [propertyType, setValue, propertyFieldName]);
-  return jsxs(Grid$1, Object.assign({
+  return jsxs(Grid, Object.assign({
     container: true,
     direction: "column",
     spacing: 2
   }, {
-    children: [jsx(Grid$1, {
+    children: [jsx(Grid, {
       children: jsx(ControlInput, {
         required: true,
         control: control,
         name: `${propertyFieldName}.key`,
         label: "Key"
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlInput, {
         required: true,
         control: control,
         name: `${propertyFieldName}.name`,
         label: "Name"
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlAutocomplete, {
         required: true,
         control: control,
@@ -4843,21 +5037,21 @@ const CreatePropertyFormFields = ({
         options: propertyTypes,
         onChange: handlePropertyTypeChange
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlNumberInput, {
         required: true,
         control: control,
         name: `${propertyFieldName}.sortOrder`,
         label: "Sort Order"
       })
-    }), jsx(Grid$1, {
+    }), jsx(Grid, {
       children: jsx(ControlAceEditor, {
         control: control,
         name: `${propertyFieldName}.uiSettings`,
         label: "UI Settings",
         validateJson: true
       })
-    }), jsxs(Grid$1, {
+    }), jsxs(Grid, {
       children: [jsx(ControlCheckbox, {
         control: control,
         name: `${propertyFieldName}.isMultiple`,
@@ -4884,7 +5078,7 @@ const CreatePropertyFormFields = ({
         }, index))
       }) : null]
     }), propertyType && jsxs(Fragment, {
-      children: [jsx(Grid$1, {
+      children: [jsx(Grid, {
         children: jsx(PropertyValidatorContext.Provider, Object.assign({
           value: (_a = propertyType.value) !== null && _a !== void 0 ? _a : propertyType
         }, {
@@ -4904,7 +5098,7 @@ const CreatePropertyFormFields = ({
         required: _globalParameter ? isRequired : false
       })]
     }), customFields.length ? jsx(Fragment, {
-      children: customFields.map((field, index) => jsx(Grid$1, {
+      children: customFields.map((field, index) => jsx(Grid, {
         children: jsx(CustomPropertyField$1, Object.assign({}, field, {
           propertyFieldName: propertyFieldName
         }))
@@ -4977,7 +5171,7 @@ const CreatePropertiesList = ({
     setValue(`${fieldName}`, removeArrayItem(properties, index));
   }, [properties, fieldName, setValue]);
   return jsxs(Fragment, {
-    children: [error && error.message && jsx(Grid$1, Object.assign({
+    children: [error && error.message && jsx(Grid, Object.assign({
       sm: 12
     }, {
       children: jsx(Typography, Object.assign({
@@ -4985,7 +5179,7 @@ const CreatePropertiesList = ({
       }, {
         children: error.message
       }))
-    })), Array.isArray(properties) && properties.map((property, index) => jsx(Grid$1, Object.assign({
+    })), Array.isArray(properties) && properties.map((property, index) => jsx(Grid, Object.assign({
       sm: 12,
       ref: ref => refs.current[index] = ref
     }, {
@@ -5022,7 +5216,7 @@ const CreatePropertiesList = ({
           }))
         })]
       }))
-    }), index)), !hideAddButton && jsx(Grid$1, Object.assign({
+    }), index)), !hideAddButton && jsx(Grid, Object.assign({
       xs: 12
     }, {
       children: jsx(Button, Object.assign({
@@ -5048,12 +5242,12 @@ const CreateDefinition = ({
   const {
     control
   } = useFormContext();
-  return jsxs(Grid$1, Object.assign({
+  return jsxs(Grid, Object.assign({
     container: true,
     direction: "column",
     spacing: 2
   }, {
-    children: [title && jsx(Grid$1, Object.assign({
+    children: [title && jsx(Grid, Object.assign({
       sm: 12
     }, {
       children: jsx(Box, Object.assign({
@@ -5065,7 +5259,7 @@ const CreateDefinition = ({
           children: title
         }))
       }))
-    })), !hideNameField && jsx(Grid$1, Object.assign({
+    })), !hideNameField && jsx(Grid, Object.assign({
       sm: 12
     }, {
       children: jsx(ControlInput, {
@@ -5074,7 +5268,7 @@ const CreateDefinition = ({
         name: definitionFieldName ? `${definitionFieldName}.name` : `name`,
         label: "Name"
       })
-    })), !hideCodeField && jsx(Grid$1, Object.assign({
+    })), !hideCodeField && jsx(Grid, Object.assign({
       sm: 12
     }, {
       children: jsx(ControlInput, {
@@ -5083,7 +5277,7 @@ const CreateDefinition = ({
         name: definitionFieldName ? `${definitionFieldName}.code` : `code`,
         label: "Code"
       })
-    })), !hideVersionField && jsx(Grid$1, Object.assign({
+    })), !hideVersionField && jsx(Grid, Object.assign({
       sm: 12
     }, {
       children: jsx(ControlNumberInput, {
@@ -5370,7 +5564,8 @@ const DefinitionFiller = ({
   properties,
   dataFieldName,
   useExpression: _useExpression = false,
-  title
+  title,
+  baseURL
 }) => {
   const stepperData = useMemo(() => {
     if (properties) {
@@ -5385,7 +5580,7 @@ const DefinitionFiller = ({
             children: [jsxs("b", {
               children: [property.name, property.isRequired ? '*' : '']
             }), jsxs("span", {
-              children: [property.key, " | ", property.isMultiple ? 'multiple' : 'single', " | ", propertyType]
+              children: [property.key, " | ", property.isMultiple ? 'multiple' : 'single', " |", ' ', propertyType]
             })]
           })),
           content: property.isMultiple ? jsx(MultiplePropertyFiller, {
@@ -5393,28 +5588,30 @@ const DefinitionFiller = ({
             name: `${dataFieldName}.${property.key}`,
             useExpression: _useExpression,
             label: property.name,
-            required: property.isRequired
+            required: property.isRequired,
+            baseURL: baseURL
           }) : jsx(PropertyFiller, {
             property: property,
             name: `${dataFieldName}.${property.key}`,
             useExpression: _useExpression,
             label: property.name,
-            required: property.isRequired
+            required: property.isRequired,
+            baseURL: baseURL
           })
         };
       });
     }
     return [];
-  }, [properties, dataFieldName, _useExpression]);
+  }, [properties, dataFieldName, _useExpression, baseURL]);
   return jsx(LocalizationProvider, Object.assign({
     dateAdapter: AdapterDateFns
   }, {
-    children: jsxs(Grid$1, Object.assign({
+    children: jsxs(Grid, Object.assign({
       container: true,
       direction: "column",
       spacing: 2
     }, {
-      children: [title && jsx(Grid$1, Object.assign({
+      children: [title && jsx(Grid, Object.assign({
         xs: 12
       }, {
         children: jsx("div", Object.assign({
@@ -5541,7 +5738,7 @@ const DefinitionValueView = ({
     }
     return [];
   }, [properties, data]);
-  return jsx(Grid$1, Object.assign({
+  return jsx(Grid, Object.assign({
     container: true,
     direction: "column",
     spacing: 2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dartech/arsenal-ui",
-  "version": "1.3.68",
+  "version": "1.3.70",
   "author": "DAR",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -27,6 +27,7 @@
     "classnames": "^2.3.1",
     "@tanstack/react-query": "^4.24.10",
     "@rollup/plugin-node-resolve": "13.3.0",
+    "axios": "1.4.0",
     "qs": "6.11.0"
   },
   "module": "./index.js",

package/src/interfaces/definition.d.ts

@@ -76,6 +76,7 @@ export interface EntityTypeProperty<T = Record<string, never>> extends Property
 }
 export interface EntityReferenceProperty extends Property {
     propertyType: PropertyType.ENTITY_REFERENCE;
+    source: string;
     definitionCode: string;
     definitionVersion: string;
     labelPropertyCode: string;
@@ -104,7 +105,7 @@ export interface TimeProperty extends Property {
 export interface AnyProperty extends Property {
     propertyType: PropertyType.ANY;
 }
-export type PropertyUnion<T = Record<string, never>> = BigDecimalProperty | BigIntegerProperty | BooleanProperty | DateProperty | DateTimeProperty | DoubleProperty | EntityTypeProperty<T> | EntityReferenceProperty | FloatProperty | StringProperty | IntegerProperty | JsonProperty | LongProperty | TimeProperty | AnyProperty;
+export type PropertyUnion<T = Record<string, never>> = BigDecimalProperty | BigIntegerProperty | BooleanProperty | DateProperty | DateTimeProperty | DoubleProperty | EntityTypeProperty<T> | EntityReferenceProperty | FloatProperty | StringProperty | IntegerProperty | JsonProperty | LongProperty | TimeProperty | AnyProperty | EntityReferenceProperty;
 export declare const DATE_DEFAULT_FORMAT = "yyyy-MM-dd";
 export declare const TIME_DEFAULT_FORMAT = "HH:mm:ss";
 export declare const DATE_TIME_DEFAULT_FORMAT = "yyyy-MM-dd'T'HH:mm:ss.SSSXXX";

package/src/interfaces/index.d.ts

@@ -1,3 +1,4 @@
 export * from './definition';
 export * from './ui';
 export * from './common';
+export * from './instances';

package/src/interfaces/instances.d.ts

@@ -0,0 +1,71 @@
+export interface Entity {
+    id: string;
+    definitionCode: string;
+    definitionVersion: number;
+    data: Record<string, unknown>;
+    createdAt: Date;
+    updatedAt: Date;
+}
+export interface CustomerApplication {
+    id: string;
+    customerId: string;
+    definitionCode: string;
+    definitionVersion: number | string;
+    data: Record<string, any>;
+    createdAt: string;
+    updatedAt: string;
+}
+export interface PledgeInstance {
+    id: string;
+    definitionCode: string;
+    definitionVersion: number | string;
+    data: Record<string, any>;
+    createdAt: string;
+    updatedAt: string;
+    definition?: {
+        id: string;
+        name: string;
+    };
+}
+export interface Product {
+    id: string;
+    definitionCode: string;
+    definitionVersion: number;
+    data: {
+        [key: string]: unknown;
+    };
+    customerApplicationDefinitionRef: {
+        code: string;
+        version: number | string;
+    }[];
+    minAmount: number;
+    maxAmount: number;
+    periodType: string;
+    minTerm: number;
+    maxTerm: number;
+    interestRate: number;
+    currency: string;
+    overpaymentCoefficient: number;
+    minPartialRepaymentAmount: number;
+    principalOverdueRate: number;
+    interestOverdueRate: number;
+    carteBlanchePeriod: number;
+    gracePeriod: number;
+    maxOverdueCoefficient: number;
+    maxOverdueDays: number;
+    maxNumberOfProlongations: number;
+    prolongationAvailableOverdueDay: number;
+    prolongationSettings: {
+        days: number[] | string;
+        rate: number;
+        availableFromGap: number;
+    }[];
+    maxProlongationDays: number;
+    createdAt: Date;
+    updatedAt: Date;
+    privateMetadata: Record<string, unknown>;
+    isActive: boolean;
+    isOverpaymentAllowed: boolean;
+    isPartialPaymentAllowed: boolean;
+    isProlongationAllowed: boolean;
+}

package/src/lib/Definition/DefinitionFiller/DefinitionFiller.d.ts

@@ -5,6 +5,7 @@ type Props = {
     dataFieldName: string;
     useExpression?: boolean;
     title?: string;
+    baseURL?: string;
 };
-export declare const DefinitionFiller: ({ properties, dataFieldName, useExpression, title }: Props) => JSX.Element;
+export declare const DefinitionFiller: ({ properties, dataFieldName, useExpression, title, baseURL, }: Props) => JSX.Element;
 export default DefinitionFiller;

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

@@ -7,6 +7,7 @@ type Props = {
     required?: boolean;
     label?: string;
     title?: string;
+    baseURL?: string;
 };
-export declare const MultiplePropertyFiller: ({ property, name, useExpression, required, label, title, }: Props) => JSX.Element;
+export declare const MultiplePropertyFiller: ({ property, name, useExpression, required, label, title, baseURL, }: Props) => JSX.Element;
 export default MultiplePropertyFiller;

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

@@ -6,6 +6,7 @@ type Props = {
     useExpression?: boolean;
     required?: boolean;
     label?: string;
+    baseURL?: string;
 };
-declare const MultiplePropertyWidget: ({ name, property, useExpression, required, label, }: Props) => JSX.Element;
+export declare const MultiplePropertyWidget: ({ name, property, useExpression, required, label, baseURL, }: Props) => JSX.Element;
 export default MultiplePropertyWidget;

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

@@ -1,12 +1,13 @@
 /// <reference types="react" />
 import { PropertyUnion } from '../../../interfaces';
-type Props = {
+export type PropertyFillerProps = {
     property: PropertyUnion;
     name: string;
     useExpression?: boolean;
     label?: string;
     required?: boolean;
     title?: string;
+    baseURL?: string;
 };
-export declare const PropertyFiller: ({ property, name, useExpression, label, required, title, }: Props) => JSX.Element;
+export declare const PropertyFiller: ({ property, name, useExpression, label, required, title, baseURL, }: PropertyFillerProps) => JSX.Element;
 export default PropertyFiller;

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

@@ -7,6 +7,7 @@ type Props = {
     label?: string;
     useExpression?: boolean;
     control: Control<any>;
+    baseURL?: string;
 };
-export declare const PropertyWidget: ({ property, name, label, useExpression, control }: Props) => JSX.Element;
+export declare const PropertyWidget: ({ property, name, label, useExpression, control, baseURL, }: Props) => JSX.Element;
 export default PropertyWidget;

package/src/lib/Property/UpsertProperty/PropertyValueField/EntityReferenceValueField.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { EntityReferenceProperty } from '../../../../interfaces/definition';
+type Props = {
+    name: string;
+    required?: boolean;
+    definitionProperty: EntityReferenceProperty;
+    baseURL?: string;
+};
+declare const EntityReferenceValueField: ({ name, required, definitionProperty, baseURL, }: Props) => JSX.Element;
+export default EntityReferenceValueField;

package/src/utils/services.d.ts

@@ -0,0 +1,23 @@
+import { CustomerApplication, Entity, PledgeInstance, Product } from '../interfaces';
+type Props = {
+    baseURL: string;
+};
+export declare function useEntitiesService({ baseURL }: Props): {
+    getEntitiesByCodeAndVersion: ({ definitionCode, definitionVersion, }: {
+        definitionCode: any;
+        definitionVersion: any;
+    }) => Promise<Entity[]>;
+    getCustomerApplications: (params?: {
+        definitionCode;
+        definitionVersion;
+    }) => Promise<CustomerApplication[]>;
+    getProducts: (params?: {
+        definitionCode;
+        definitionVersion;
+    }) => Promise<Product[]>;
+    getPledgeInstances: (params?: {
+        definitionCode;
+        definitionVersion;
+    }) => Promise<PledgeInstance[]>;
+};
+export {};

package/src/utils/test-mocks.d.ts

@@ -0,0 +1,166 @@
+import { PropertiesArrayType } from '../interfaces';
+export declare const mockProperties: PropertiesArrayType<Record<string, never>>;
+export declare const mockPropsArray: ({
+    key: string;
+    propertyType: string;
+    name: string;
+    isRequired: boolean;
+    isMultiple: boolean;
+    sortOrder: number;
+    isEnabled: boolean;
+    uiSettings: any;
+    validationNode: any;
+    isViewableInList: boolean;
+    restrictedValues: any;
+    defaultValue: string;
+    defaultValues: any;
+    precisionScale?: undefined;
+    roundingMode?: undefined;
+    definitionCode?: undefined;
+    definitionVersion?: undefined;
+    labelPropertyCode?: undefined;
+    valuePropertyCode?: undefined;
+} | {
+    key: string;
+    propertyType: string;
+    name: string;
+    isRequired: boolean;
+    isMultiple: boolean;
+    sortOrder: number;
+    isEnabled: boolean;
+    uiSettings: any;
+    validationNode: any;
+    isViewableInList: boolean;
+    defaultValue: number;
+    defaultValues: any;
+    precisionScale: number;
+    roundingMode: string;
+    restrictedValues?: undefined;
+    definitionCode?: undefined;
+    definitionVersion?: undefined;
+    labelPropertyCode?: undefined;
+    valuePropertyCode?: undefined;
+} | {
+    key: string;
+    propertyType: string;
+    name: string;
+    isRequired: boolean;
+    isMultiple: boolean;
+    sortOrder: number;
+    isEnabled: boolean;
+    uiSettings: any;
+    validationNode: any;
+    isViewableInList: boolean;
+    definitionCode: string;
+    definitionVersion: string;
+    labelPropertyCode: string;
+    valuePropertyCode: string;
+    defaultValue: string;
+    defaultValues: any;
+    restrictedValues?: undefined;
+    precisionScale?: undefined;
+    roundingMode?: undefined;
+})[];
+export declare const mockPropsObject: {
+    any: {
+        propertyType: string;
+        name: string;
+        isRequired: boolean;
+        isMultiple: boolean;
+        sortOrder: number;
+        isEnabled: boolean;
+        uiSettings: any;
+        validationNode: any;
+        isViewableInList: boolean;
+        restrictedValues: any;
+        defaultValue: any;
+        defaultValues: any;
+    };
+    int: {
+        propertyType: string;
+        name: string;
+        isRequired: boolean;
+        isMultiple: boolean;
+        sortOrder: number;
+        isEnabled: boolean;
+        uiSettings: any;
+        validationNode: any;
+        isViewableInList: boolean;
+        restrictedValues: any;
+        defaultValue: any;
+        defaultValues: any;
+    };
+    string: {
+        propertyType: string;
+        name: string;
+        isRequired: boolean;
+        isMultiple: boolean;
+        sortOrder: number;
+        isEnabled: boolean;
+        uiSettings: any;
+        validationNode: any;
+        isViewableInList: boolean;
+        restrictedValues: any;
+        defaultValue: any;
+        defaultValues: any;
+    };
+    entity: {
+        propertyType: string;
+        name: string;
+        isRequired: boolean;
+        isMultiple: boolean;
+        sortOrder: number;
+        isEnabled: boolean;
+        uiSettings: any;
+        validationNode: any;
+        isViewableInList: boolean;
+        properties: {
+            foo: {
+                propertyType: string;
+                name: string;
+                isRequired: boolean;
+                isMultiple: boolean;
+                sortOrder: number;
+                isEnabled: boolean;
+                uiSettings: any;
+                validationNode: any;
+                isViewableInList: boolean;
+                restrictedValues: string[];
+                defaultValue: string;
+                defaultValues: any;
+            };
+        };
+        defaultValue: {
+            asd: string;
+        };
+        defaultValues: any;
+    };
+    b_decimal: {
+        propertyType: string;
+        name: string;
+        isRequired: boolean;
+        isMultiple: boolean;
+        sortOrder: number;
+        isEnabled: boolean;
+        uiSettings: any;
+        validationNode: any;
+        isViewableInList: boolean;
+        defaultValue: any;
+        defaultValues: any;
+        precisionScale: number;
+        roundingMode: string;
+    };
+    json: {
+        propertyType: string;
+        name: string;
+        isRequired: boolean;
+        isMultiple: boolean;
+        sortOrder: number;
+        isEnabled: boolean;
+        uiSettings: any;
+        validationNode: any;
+        isViewableInList: boolean;
+        defaultValue: any;
+        defaultValues: any;
+    };
+};