@dartech/arsenal-ui 1.3.94 → 1.3.95
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.js +136 -208
- package/package.json +1 -1
- package/src/lib/Definition/CreateDefinition/CreateDefinition.d.ts +1 -1
- package/src/lib/Forms/ControlInput.d.ts +1 -1
- package/src/lib/Property/UpsertProperty/CreatePropertiesList.d.ts +3 -2
- package/src/lib/Property/UpsertProperty/CreatePropertyFormFields.d.ts +4 -1
- package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/BigDecimalPropertyFields.d.ts +3 -1
- package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/DateAdditionalFields.d.ts +3 -1
- package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/EntityAdditionalFields.d.ts +3 -1
- package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/EntityReferencePropertyFields.d.ts +3 -1
- package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/PropertyAdditionalFields.d.ts +3 -1
- package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/StringPropertyFields.d.ts +3 -1
- package/src/lib/Property/UpsertProperty/PropertyValueField/BooleanValueField.d.ts +1 -0
- package/src/lib/Property/UpsertProperty/PropertyValueField/DateTimeValueField.d.ts +1 -0
- package/src/lib/Property/UpsertProperty/PropertyValueField/DateValueField.d.ts +1 -0
- package/src/lib/Property/UpsertProperty/PropertyValueField/JsonValueField.d.ts +1 -0
- package/src/lib/Property/UpsertProperty/PropertyValueField/PropertyValueField.d.ts +3 -1
- package/src/lib/Property/UpsertProperty/PropertyValueField/TimeValueField.d.ts +1 -0
- package/src/lib/Property/ViewProperty/PropertyItem.d.ts +1 -0
package/index.js
CHANGED
@@ -9,9 +9,9 @@ import DialogTitle from '@mui/material/DialogTitle';
|
|
9
9
|
import Box from '@mui/material/Box';
|
10
10
|
import CircularProgress from '@mui/material/CircularProgress';
|
11
11
|
import { __rest, __awaiter } from 'tslib';
|
12
|
-
import { useController, useWatch, useFormContext, Controller, useFieldArray } from 'react-hook-form';
|
12
|
+
import { useController, useWatch, useFormContext, Controller, useFieldArray, useForm } from 'react-hook-form';
|
13
13
|
import TextField from '@mui/material/TextField';
|
14
|
-
import React, { useRef, useEffect, useState, useCallback, useMemo, createElement, forwardRef, createContext, useContext, memo, Suspense } from 'react';
|
14
|
+
import React, { useRef, useEffect, useState, useCallback, useMemo, createElement, forwardRef, createContext, useContext, memo, useImperativeHandle, Suspense } from 'react';
|
15
15
|
import MenuItem from '@mui/material/MenuItem';
|
16
16
|
import SvgIcon from '@mui/material/SvgIcon';
|
17
17
|
import IconButton from '@mui/material/IconButton';
|
@@ -1518,6 +1518,7 @@ const formatPropertyValue = (propertyType, value, params) => {
|
|
1518
1518
|
return null;
|
1519
1519
|
}
|
1520
1520
|
let parsedValue = value;
|
1521
|
+
// console.log(value);
|
1521
1522
|
switch (propertyType) {
|
1522
1523
|
case PropertyType.BOOLEAN:
|
1523
1524
|
if (value) {
|
@@ -1537,8 +1538,10 @@ const formatPropertyValue = (propertyType, value, params) => {
|
|
1537
1538
|
case PropertyType.DATE:
|
1538
1539
|
case PropertyType.DATE_TIME:
|
1539
1540
|
case PropertyType.TIME:
|
1540
|
-
|
1541
|
-
|
1541
|
+
{
|
1542
|
+
if (value) parsedValue = format(new Date(value.toString()), params.formatText);
|
1543
|
+
break;
|
1544
|
+
}
|
1542
1545
|
case PropertyType.JSON:
|
1543
1546
|
case PropertyType.ANY:
|
1544
1547
|
try {
|
@@ -2281,15 +2284,15 @@ const ControlArrayInput = ({
|
|
2281
2284
|
var _a, _b, _c;
|
2282
2285
|
const [localValue, setLoacalValue] = useState('');
|
2283
2286
|
const {
|
2284
|
-
|
2285
|
-
|
2286
|
-
|
2287
|
-
|
2287
|
+
field: {
|
2288
|
+
onChange,
|
2289
|
+
value: values
|
2290
|
+
},
|
2291
|
+
// fieldState: { error },
|
2288
2292
|
formState: {
|
2289
2293
|
errors
|
2290
2294
|
}
|
2291
|
-
} =
|
2292
|
-
const values = useWatch({
|
2295
|
+
} = useController({
|
2293
2296
|
control,
|
2294
2297
|
name
|
2295
2298
|
});
|
@@ -2298,25 +2301,18 @@ const ControlArrayInput = ({
|
|
2298
2301
|
value
|
2299
2302
|
} = e.target;
|
2300
2303
|
setLoacalValue(value);
|
2301
|
-
if (values.includes(value))
|
2302
|
-
|
2303
|
-
type: 'custom',
|
2304
|
-
message: 'This value already exists'
|
2305
|
-
});
|
2306
|
-
} else {
|
2307
|
-
clearErrors(name);
|
2308
|
-
}
|
2309
|
-
}, [values, name, setError, clearErrors]);
|
2304
|
+
if (Array.isArray(values) && values.includes(value)) ;
|
2305
|
+
}, [values]);
|
2310
2306
|
const handleAdd = useCallback(() => {
|
2311
2307
|
var _a;
|
2312
2308
|
if (localValue && !((_a = errors[name]) === null || _a === void 0 ? void 0 : _a.message)) {
|
2313
|
-
|
2309
|
+
onChange([...(values !== null && values !== void 0 ? values : []), localValue]);
|
2314
2310
|
setLoacalValue('');
|
2315
2311
|
}
|
2316
|
-
}, [localValue,
|
2312
|
+
}, [localValue, onChange, values, name, errors]);
|
2317
2313
|
const handleDelete = useCallback(value => {
|
2318
|
-
|
2319
|
-
}, [values,
|
2314
|
+
onChange(values.filter(code => code !== value));
|
2315
|
+
}, [values, onChange]);
|
2320
2316
|
const handleKeyDown = useCallback(e => {
|
2321
2317
|
if (e.key === 'Enter' || e.keyCode === 13) {
|
2322
2318
|
e.stopPropagation();
|
@@ -2340,7 +2336,7 @@ const ControlArrayInput = ({
|
|
2340
2336
|
display: "flex",
|
2341
2337
|
flexWrap: "wrap"
|
2342
2338
|
}, {
|
2343
|
-
children: values.map((value, index) => jsx(Chip, {
|
2339
|
+
children: values === null || values === void 0 ? void 0 : values.map((value, index) => jsx(Chip, {
|
2344
2340
|
sx: {
|
2345
2341
|
mr: 1,
|
2346
2342
|
mb: 1
|
@@ -2351,7 +2347,7 @@ const ControlArrayInput = ({
|
|
2351
2347
|
}, index))
|
2352
2348
|
})), jsx("input", Object.assign({
|
2353
2349
|
type: "hidden"
|
2354
|
-
}, register(name, {
|
2350
|
+
}, control.register(name, {
|
2355
2351
|
required: required && 'Please, add a value'
|
2356
2352
|
}))), jsx(TextField, {
|
2357
2353
|
fullWidth: true,
|
@@ -3251,11 +3247,10 @@ const InfoItem = ({
|
|
3251
3247
|
|
3252
3248
|
const roundingModes = Object.values(RoundingMode).sort((a, b) => a.localeCompare(b));
|
3253
3249
|
const BigDecimalPropertyFields = ({
|
3254
|
-
propertyFieldName
|
3250
|
+
propertyFieldName,
|
3251
|
+
control
|
3255
3252
|
}) => {
|
3256
|
-
const {
|
3257
|
-
control
|
3258
|
-
} = useFormContext();
|
3253
|
+
// const { control } = useFormContext();
|
3259
3254
|
return jsxs(Fragment, {
|
3260
3255
|
children: [jsx(Grid, {
|
3261
3256
|
children: jsx(ControlNumberInput, {
|
@@ -3281,11 +3276,9 @@ var BigDecimalPropertyFields$1 = BigDecimalPropertyFields;
|
|
3281
3276
|
|
3282
3277
|
const DateAdditionalFields = ({
|
3283
3278
|
propertyFieldName,
|
3279
|
+
control,
|
3284
3280
|
defaultValue: _defaultValue = ''
|
3285
3281
|
}) => {
|
3286
|
-
const {
|
3287
|
-
control
|
3288
|
-
} = useFormContext();
|
3289
3282
|
return jsx(Grid, {
|
3290
3283
|
children: jsx(ControlInput, {
|
3291
3284
|
required: true,
|
@@ -3397,6 +3390,7 @@ const defaultPropertyValues$1 = {
|
|
3397
3390
|
uiSettings: ''
|
3398
3391
|
};
|
3399
3392
|
const EntityAdditionalFields = ({
|
3393
|
+
control,
|
3400
3394
|
parentPropertyFieldName,
|
3401
3395
|
entityDefinition: _entityDefinition = false,
|
3402
3396
|
globalParameter: _globalParameter = false,
|
@@ -3404,15 +3398,19 @@ const EntityAdditionalFields = ({
|
|
3404
3398
|
entityReferenceValueComponent,
|
3405
3399
|
fileReferenceValueComponent
|
3406
3400
|
}) => {
|
3401
|
+
const propsRef = useRef(null);
|
3407
3402
|
const {
|
3403
|
+
field: {
|
3404
|
+
onChange
|
3405
|
+
}
|
3406
|
+
} = useController({
|
3408
3407
|
control,
|
3409
|
-
|
3410
|
-
|
3411
|
-
} = useFormContext();
|
3408
|
+
name: `${parentPropertyFieldName}.properties`
|
3409
|
+
});
|
3412
3410
|
const properties = useWatch({
|
3413
3411
|
control,
|
3414
3412
|
name: `${parentPropertyFieldName}.properties`,
|
3415
|
-
defaultValue:
|
3413
|
+
defaultValue: []
|
3416
3414
|
});
|
3417
3415
|
const parentPropertyName = useWatch({
|
3418
3416
|
control,
|
@@ -3429,21 +3427,26 @@ const EntityAdditionalFields = ({
|
|
3429
3427
|
const parametersModal = useToggle();
|
3430
3428
|
const [focusedProperty, setFocusedProperty] = useState(0);
|
3431
3429
|
const handleAddParameter = useCallback(() => {
|
3432
|
-
if (
|
3430
|
+
if ((properties === null || properties === void 0 ? void 0 : properties.length) > 0) {
|
3433
3431
|
append(defaultPropertyValues$1);
|
3434
|
-
const propertyIndex =
|
3432
|
+
const propertyIndex = properties.length;
|
3435
3433
|
setFocusedProperty(propertyIndex);
|
3436
3434
|
} else {
|
3437
3435
|
append(defaultPropertyValues$1);
|
3438
3436
|
}
|
3439
|
-
|
3437
|
+
propsRef.current.addProperty();
|
3438
|
+
}, [properties, append]);
|
3440
3439
|
const handleStepperClick = index => setFocusedProperty(index);
|
3441
3440
|
const handleSubmitClick = () => __awaiter(void 0, void 0, void 0, function* () {
|
3442
|
-
|
3443
|
-
|
3444
|
-
|
3445
|
-
|
3441
|
+
// console.log(propsRef.current.getProperties());
|
3442
|
+
onChange(propsRef.current.getProperties());
|
3443
|
+
// const isValid = await trigger(`${parentPropertyFieldName}.properties`);
|
3444
|
+
parametersModal.onClose();
|
3445
|
+
// if (isValid) {
|
3446
|
+
// parametersModal.onClose();
|
3447
|
+
// }
|
3446
3448
|
});
|
3449
|
+
|
3447
3450
|
return jsxs(Fragment, {
|
3448
3451
|
children: [jsx(Grid, {
|
3449
3452
|
children: jsx(Typography, Object.assign({
|
@@ -3502,7 +3505,7 @@ const EntityAdditionalFields = ({
|
|
3502
3505
|
paddingLeft: '4px'
|
3503
3506
|
}
|
3504
3507
|
}, {
|
3505
|
-
children:
|
3508
|
+
children: fields.map((property, index) => jsxs(Step, Object.assign({
|
3506
3509
|
onClick: () => handleStepperClick(index),
|
3507
3510
|
style: {
|
3508
3511
|
cursor: 'pointer'
|
@@ -3516,7 +3519,7 @@ const EntityAdditionalFields = ({
|
|
3516
3519
|
wordBreak: 'break-word'
|
3517
3520
|
}
|
3518
3521
|
}, {
|
3519
|
-
children: property
|
3522
|
+
children: property['name'] || '(no name)'
|
3520
3523
|
})), jsx(StepContent, {})]
|
3521
3524
|
}), index))
|
3522
3525
|
})), jsx(Button, Object.assign({
|
@@ -3539,10 +3542,12 @@ const EntityAdditionalFields = ({
|
|
3539
3542
|
}
|
3540
3543
|
}, {
|
3541
3544
|
children: jsx(CreatePropertiesList, {
|
3545
|
+
ref: propsRef,
|
3546
|
+
properties: fields,
|
3542
3547
|
hideAddButton: true,
|
3543
|
-
entityPropFields
|
3548
|
+
// entityPropFields={properties as any}
|
3544
3549
|
parentRemove: remove,
|
3545
|
-
parentFieldName
|
3550
|
+
// parentFieldName={parentPropertyFieldName}
|
3546
3551
|
focusOnIndex: focusedProperty,
|
3547
3552
|
entityDefinition: _entityDefinition,
|
3548
3553
|
globalParameter: _globalParameter,
|
@@ -3568,14 +3573,12 @@ var EntityAdditionalFields$1 = EntityAdditionalFields;
|
|
3568
3573
|
|
3569
3574
|
const EntityReferencePropertyFields = ({
|
3570
3575
|
propertyFieldName,
|
3576
|
+
control,
|
3571
3577
|
sources: _sources = [{
|
3572
3578
|
label: 'Arsenal Entities',
|
3573
3579
|
value: 'ARSENAL_ENTITIES'
|
3574
3580
|
}]
|
3575
3581
|
}) => {
|
3576
|
-
const {
|
3577
|
-
control
|
3578
|
-
} = useFormContext();
|
3579
3582
|
return jsxs(Fragment, {
|
3580
3583
|
children: [jsx(Grid, {
|
3581
3584
|
children: jsx(ControlSelect, {
|
@@ -3619,102 +3622,8 @@ const EntityReferencePropertyFields = ({
|
|
3619
3622
|
};
|
3620
3623
|
var EntityReferencePropertyFields$1 = EntityReferencePropertyFields;
|
3621
3624
|
|
3622
|
-
const StringPropertyFields = ({
|
3623
|
-
propertyFieldName
|
3624
|
-
}) => {
|
3625
|
-
const fieldName = useMemo(() => `${propertyFieldName}.restrictedValues`, [propertyFieldName]);
|
3626
|
-
const {
|
3627
|
-
control,
|
3628
|
-
setValue,
|
3629
|
-
getValues
|
3630
|
-
} = useFormContext();
|
3631
|
-
const restrictedValues = useWatch({
|
3632
|
-
control,
|
3633
|
-
name: fieldName,
|
3634
|
-
defaultValue: getValues(`${propertyFieldName}.restrictedValues`) || []
|
3635
|
-
});
|
3636
|
-
const [inputValue, setInputValue] = useState('');
|
3637
|
-
const [error, setError] = useState('');
|
3638
|
-
const handleDelete = useCallback(index => {
|
3639
|
-
setValue(fieldName, removeArrayItem(restrictedValues, index));
|
3640
|
-
}, [restrictedValues, fieldName, setValue]);
|
3641
|
-
const handleAddValue = () => {
|
3642
|
-
if (inputValue) {
|
3643
|
-
setValue(fieldName, [...restrictedValues, inputValue]);
|
3644
|
-
setInputValue('');
|
3645
|
-
}
|
3646
|
-
};
|
3647
|
-
const handleInputChange = e => {
|
3648
|
-
const {
|
3649
|
-
value
|
3650
|
-
} = e.target;
|
3651
|
-
setInputValue(value);
|
3652
|
-
if (restrictedValues.includes(value)) {
|
3653
|
-
setError('This value already exists');
|
3654
|
-
} else {
|
3655
|
-
setError('');
|
3656
|
-
}
|
3657
|
-
};
|
3658
|
-
const handleKeyDown = e => {
|
3659
|
-
if (e.key === 'Enter') {
|
3660
|
-
handleAddValue();
|
3661
|
-
}
|
3662
|
-
};
|
3663
|
-
return jsxs(Fragment, {
|
3664
|
-
children: [jsx(Grid, {
|
3665
|
-
children: jsx(Typography, Object.assign({
|
3666
|
-
variant: "h6"
|
3667
|
-
}, {
|
3668
|
-
children: "Restricted Values"
|
3669
|
-
}))
|
3670
|
-
}), !!(restrictedValues === null || restrictedValues === void 0 ? void 0 : restrictedValues.length) && jsx(Grid, {
|
3671
|
-
children: jsx(Box, Object.assign({
|
3672
|
-
display: "flex",
|
3673
|
-
flexWrap: "wrap"
|
3674
|
-
}, {
|
3675
|
-
children: restrictedValues.map((value, index) => jsx(Chip, {
|
3676
|
-
sx: {
|
3677
|
-
mr: 1
|
3678
|
-
},
|
3679
|
-
variant: "outlined",
|
3680
|
-
label: value,
|
3681
|
-
onDelete: () => handleDelete(index)
|
3682
|
-
}, index))
|
3683
|
-
}))
|
3684
|
-
}), jsx(Grid, {
|
3685
|
-
children: jsx(TextField, {
|
3686
|
-
fullWidth: true,
|
3687
|
-
variant: "outlined",
|
3688
|
-
size: "small",
|
3689
|
-
label: "Add restricted value",
|
3690
|
-
value: inputValue,
|
3691
|
-
onChange: handleInputChange,
|
3692
|
-
error: !!error,
|
3693
|
-
helperText: error,
|
3694
|
-
name: "restrictedValues",
|
3695
|
-
inputProps: {
|
3696
|
-
onKeyDown: handleKeyDown
|
3697
|
-
},
|
3698
|
-
InputProps: {
|
3699
|
-
endAdornment: jsx(IconButton, Object.assign({
|
3700
|
-
size: "small",
|
3701
|
-
onClick: handleAddValue,
|
3702
|
-
disabled: !!error
|
3703
|
-
}, {
|
3704
|
-
children: jsx(SvgIcon, {
|
3705
|
-
children: jsx("path", {
|
3706
|
-
d: "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"
|
3707
|
-
})
|
3708
|
-
})
|
3709
|
-
}))
|
3710
|
-
}
|
3711
|
-
})
|
3712
|
-
})]
|
3713
|
-
});
|
3714
|
-
};
|
3715
|
-
var StringPropertyFields$1 = StringPropertyFields;
|
3716
|
-
|
3717
3625
|
const PropertyAdditionalFields = ({
|
3626
|
+
control,
|
3718
3627
|
propertyType,
|
3719
3628
|
propertyFieldName,
|
3720
3629
|
entityDefinition: _entityDefinition = false,
|
@@ -3725,35 +3634,43 @@ const PropertyAdditionalFields = ({
|
|
3725
3634
|
}) => {
|
3726
3635
|
switch (propertyType) {
|
3727
3636
|
case PropertyType.STRING:
|
3728
|
-
return jsx(
|
3729
|
-
|
3637
|
+
return jsx(ControlArrayInput, {
|
3638
|
+
name: `${propertyFieldName}.restrictedValues`,
|
3639
|
+
control: control,
|
3640
|
+
label: "Restricted Values"
|
3730
3641
|
});
|
3731
3642
|
case PropertyType.BIG_DECIMAL:
|
3732
3643
|
return jsx(BigDecimalPropertyFields$1, {
|
3733
|
-
propertyFieldName: propertyFieldName
|
3644
|
+
propertyFieldName: propertyFieldName,
|
3645
|
+
control: control
|
3734
3646
|
});
|
3735
3647
|
case PropertyType.DATE:
|
3736
3648
|
return jsx(DateAdditionalFields$1, {
|
3649
|
+
control: control,
|
3737
3650
|
propertyFieldName: propertyFieldName,
|
3738
3651
|
defaultValue: DATE_DEFAULT_FORMAT
|
3739
3652
|
});
|
3740
3653
|
case PropertyType.TIME:
|
3741
3654
|
return jsx(DateAdditionalFields$1, {
|
3655
|
+
control: control,
|
3742
3656
|
propertyFieldName: propertyFieldName,
|
3743
3657
|
defaultValue: TIME_DEFAULT_FORMAT
|
3744
3658
|
});
|
3745
3659
|
case PropertyType.DATE_TIME:
|
3746
3660
|
return jsx(DateAdditionalFields$1, {
|
3661
|
+
control: control,
|
3747
3662
|
propertyFieldName: propertyFieldName,
|
3748
3663
|
defaultValue: DATE_TIME_DEFAULT_FORMAT
|
3749
3664
|
});
|
3750
3665
|
case PropertyType.ENTITY_REFERENCE:
|
3751
3666
|
return jsx(EntityReferencePropertyFields$1, {
|
3667
|
+
control: control,
|
3752
3668
|
propertyFieldName: propertyFieldName,
|
3753
3669
|
sources: entityReferenceDefinitionSources
|
3754
3670
|
});
|
3755
3671
|
case PropertyType.ENTITY:
|
3756
3672
|
return jsx(EntityAdditionalFields$1, {
|
3673
|
+
control: control,
|
3757
3674
|
parentPropertyFieldName: propertyFieldName,
|
3758
3675
|
globalParameter: _globalParameter,
|
3759
3676
|
entityDefinition: _entityDefinition,
|
@@ -4326,12 +4243,6 @@ const PropertyFiller = ({
|
|
4326
4243
|
entityReferenceDefinitionSources: entityReferenceDefinitionSources,
|
4327
4244
|
entityReferenceValueComponent: entityReferenceValueComponent,
|
4328
4245
|
fileReferenceValueComponent: fileReferenceValueComponent
|
4329
|
-
}), fillOption === 'dem_builder' && jsx(CreateDefinition, {
|
4330
|
-
title: "JSON",
|
4331
|
-
definitionFieldName: name,
|
4332
|
-
entityReferenceDefinitionSources: entityReferenceDefinitionSources,
|
4333
|
-
entityReferenceValueComponent: entityReferenceValueComponent,
|
4334
|
-
fileReferenceValueComponent: fileReferenceValueComponent
|
4335
4246
|
}), error && jsx(FormHelperText, Object.assign({
|
4336
4247
|
error: true
|
4337
4248
|
}, {
|
@@ -4594,6 +4505,7 @@ const MultiplePropertyFiller = ({
|
|
4594
4505
|
};
|
4595
4506
|
|
4596
4507
|
const PropertyValueField = ({
|
4508
|
+
control,
|
4597
4509
|
propertyFieldName,
|
4598
4510
|
name,
|
4599
4511
|
label: _label = '',
|
@@ -4602,9 +4514,7 @@ const PropertyValueField = ({
|
|
4602
4514
|
entityReferenceValueComponent,
|
4603
4515
|
fileReferenceValueComponent
|
4604
4516
|
}) => {
|
4605
|
-
const {
|
4606
|
-
control
|
4607
|
-
} = useFormContext();
|
4517
|
+
// const { control } = useFormContext();
|
4608
4518
|
const propertyType = useWatch({
|
4609
4519
|
control,
|
4610
4520
|
name: `${propertyFieldName}.propertyType`
|
@@ -5060,7 +4970,10 @@ const propertyTypes = Object.values(PropertyType).sort((a, b) => a.localeCompare
|
|
5060
4970
|
value: propType,
|
5061
4971
|
label: propType.replace('_', ' ').toLowerCase().replace(/(^\w)|([-\s]\w)/g, c => c.toUpperCase())
|
5062
4972
|
}));
|
5063
|
-
const CreatePropertyFormFields = ({
|
4973
|
+
const CreatePropertyFormFields = /*#__PURE__*/memo(({
|
4974
|
+
setValue,
|
4975
|
+
control,
|
4976
|
+
// watch,
|
5064
4977
|
propertyFieldName,
|
5065
4978
|
entityDefinition: _entityDefinition = false,
|
5066
4979
|
globalParameter: _globalParameter = false,
|
@@ -5070,11 +4983,8 @@ const CreatePropertyFormFields = ({
|
|
5070
4983
|
fileReferenceValueComponent
|
5071
4984
|
}) => {
|
5072
4985
|
var _a;
|
5073
|
-
const {
|
5074
|
-
|
5075
|
-
setValue,
|
5076
|
-
watch
|
5077
|
-
} = useFormContext();
|
4986
|
+
// const { control, setValue, watch } = useFormContext();
|
4987
|
+
// console.log(propertyFieldName);
|
5078
4988
|
const propertyType = useWatch({
|
5079
4989
|
control,
|
5080
4990
|
name: `${propertyFieldName}.propertyType`
|
@@ -5087,6 +4997,7 @@ const CreatePropertyFormFields = ({
|
|
5087
4997
|
control,
|
5088
4998
|
name: `${propertyFieldName}.isRequired`
|
5089
4999
|
});
|
5000
|
+
// console.log('render - ', propertyFieldName);
|
5090
5001
|
const {
|
5091
5002
|
customCheckboxes,
|
5092
5003
|
customFields
|
@@ -5191,6 +5102,7 @@ const CreatePropertyFormFields = ({
|
|
5191
5102
|
})
|
5192
5103
|
}))
|
5193
5104
|
}), jsx(PropertyAdditionalFields, {
|
5105
|
+
control: control,
|
5194
5106
|
propertyType: typeof propertyType === 'string' ? propertyType : propertyType.value,
|
5195
5107
|
propertyFieldName: propertyFieldName,
|
5196
5108
|
globalParameter: _globalParameter,
|
@@ -5199,6 +5111,7 @@ const CreatePropertyFormFields = ({
|
|
5199
5111
|
entityReferenceValueComponent: entityReferenceValueComponent,
|
5200
5112
|
fileReferenceValueComponent: fileReferenceValueComponent
|
5201
5113
|
}), jsx(PropertyValueField, {
|
5114
|
+
control: control,
|
5202
5115
|
propertyFieldName: propertyFieldName,
|
5203
5116
|
name: `${propertyFieldName}.${_globalParameter ? 'value' : 'defaultValue'}`,
|
5204
5117
|
// name=
|
@@ -5216,7 +5129,7 @@ const CreatePropertyFormFields = ({
|
|
5216
5129
|
}, index))
|
5217
5130
|
}) : null]
|
5218
5131
|
}));
|
5219
|
-
};
|
5132
|
+
});
|
5220
5133
|
|
5221
5134
|
const defaultPropertyValues = {
|
5222
5135
|
key: '',
|
@@ -5231,34 +5144,43 @@ const defaultPropertyValues = {
|
|
5231
5144
|
executeValue: '',
|
5232
5145
|
uiSettings: ''
|
5233
5146
|
};
|
5234
|
-
const CreatePropertiesList = ({
|
5235
|
-
|
5147
|
+
const CreatePropertiesList = /*#__PURE__*/forwardRef(({
|
5148
|
+
properties,
|
5149
|
+
// parentFieldName,
|
5236
5150
|
hideAddButton,
|
5237
5151
|
focusOnIndex,
|
5238
5152
|
required,
|
5239
5153
|
entityDefinition: _entityDefinition = false,
|
5240
5154
|
globalParameter: _globalParameter = false,
|
5241
5155
|
customPropertyFields: _customPropertyFields = [],
|
5242
|
-
entityPropFields,
|
5243
5156
|
parentRemove,
|
5244
5157
|
entityReferenceDefinitionSources,
|
5245
5158
|
entityReferenceValueComponent,
|
5246
5159
|
fileReferenceValueComponent
|
5247
|
-
}) => {
|
5248
|
-
|
5249
|
-
|
5160
|
+
}, ref) => {
|
5161
|
+
// const fieldName = useMemo(
|
5162
|
+
// () => (parentFieldName ? `${parentFieldName}.properties` : `properties`),
|
5163
|
+
// [parentFieldName]
|
5164
|
+
// );
|
5165
|
+
var _a;
|
5250
5166
|
const {
|
5251
5167
|
clearErrors,
|
5252
5168
|
control,
|
5253
|
-
|
5254
|
-
|
5169
|
+
setValue,
|
5170
|
+
getValues,
|
5171
|
+
reset
|
5172
|
+
} = useForm({
|
5173
|
+
defaultValues: {
|
5174
|
+
properties
|
5175
|
+
}
|
5176
|
+
});
|
5255
5177
|
const {
|
5256
5178
|
fields,
|
5257
5179
|
append,
|
5258
5180
|
remove
|
5259
5181
|
} = useFieldArray({
|
5260
5182
|
control,
|
5261
|
-
name:
|
5183
|
+
name: 'properties'
|
5262
5184
|
});
|
5263
5185
|
const {
|
5264
5186
|
fieldState: {
|
@@ -5266,7 +5188,7 @@ const CreatePropertiesList = ({
|
|
5266
5188
|
}
|
5267
5189
|
} = useController({
|
5268
5190
|
control,
|
5269
|
-
name:
|
5191
|
+
name: 'properties',
|
5270
5192
|
rules: {
|
5271
5193
|
validate: val => {
|
5272
5194
|
if (required && Array.isArray(val) && val.length === 0) return 'Please, fill the properties';
|
@@ -5274,11 +5196,17 @@ const CreatePropertiesList = ({
|
|
5274
5196
|
}
|
5275
5197
|
}
|
5276
5198
|
});
|
5277
|
-
|
5278
|
-
|
5279
|
-
name: fieldName
|
5280
|
-
});
|
5199
|
+
// console.log(watch());
|
5200
|
+
// const properties = useWatch({ control, name: fieldName });
|
5281
5201
|
const refs = useRef([]);
|
5202
|
+
const handleAddParameter = useCallback(() => {
|
5203
|
+
append(defaultPropertyValues);
|
5204
|
+
clearErrors('properties');
|
5205
|
+
}, [append, clearErrors]);
|
5206
|
+
const handleRemoveParameter = useCallback(index => {
|
5207
|
+
if (parentRemove) parentRemove(index);
|
5208
|
+
remove(index);
|
5209
|
+
}, [parentRemove, remove]);
|
5282
5210
|
useEffect(() => {
|
5283
5211
|
if (typeof focusOnIndex === 'number' && refs.current[focusOnIndex]) {
|
5284
5212
|
refs.current[focusOnIndex].scrollIntoView({
|
@@ -5287,27 +5215,21 @@ const CreatePropertiesList = ({
|
|
5287
5215
|
});
|
5288
5216
|
}
|
5289
5217
|
}, [focusOnIndex, refs]);
|
5290
|
-
|
5291
|
-
|
5292
|
-
|
5293
|
-
|
5294
|
-
|
5295
|
-
|
5296
|
-
return parentRemove;
|
5297
|
-
} else {
|
5298
|
-
return remove;
|
5299
|
-
}
|
5300
|
-
}, [entityPropFields, remove, parentRemove]);
|
5301
|
-
const handleRemoveParameter = useCallback(index => {
|
5302
|
-
removeFields(index);
|
5303
|
-
}, [removeFields]);
|
5304
|
-
const propFields = useMemo(() => {
|
5305
|
-
if (entityPropFields) {
|
5306
|
-
return entityPropFields;
|
5307
|
-
} else {
|
5308
|
-
return fields;
|
5218
|
+
useEffect(() => {
|
5219
|
+
var _a;
|
5220
|
+
if (properties.length && !((_a = getValues('properties')) === null || _a === void 0 ? void 0 : _a.length)) {
|
5221
|
+
reset({
|
5222
|
+
properties
|
5223
|
+
});
|
5309
5224
|
}
|
5310
|
-
}, [
|
5225
|
+
}, [properties, getValues, reset]);
|
5226
|
+
useImperativeHandle(ref, () => {
|
5227
|
+
return {
|
5228
|
+
getProperties: () => getValues('properties'),
|
5229
|
+
addProperty: handleAddParameter,
|
5230
|
+
removeProperty: handleRemoveParameter
|
5231
|
+
};
|
5232
|
+
}, [getValues, handleAddParameter, handleRemoveParameter]);
|
5311
5233
|
return jsxs(Fragment, {
|
5312
5234
|
children: [error && error.message && jsx(Grid, Object.assign({
|
5313
5235
|
sm: 12
|
@@ -5315,9 +5237,9 @@ const CreatePropertiesList = ({
|
|
5315
5237
|
children: jsx(Typography, Object.assign({
|
5316
5238
|
color: "secondary"
|
5317
5239
|
}, {
|
5318
|
-
children:
|
5240
|
+
children: error.message
|
5319
5241
|
}))
|
5320
|
-
})), Array.isArray(
|
5242
|
+
})), Array.isArray(fields) && fields.map((item, index) => jsx(Grid, Object.assign({
|
5321
5243
|
sm: 12,
|
5322
5244
|
ref: ref => refs.current[index] = ref
|
5323
5245
|
}, {
|
@@ -5334,11 +5256,13 @@ const CreatePropertiesList = ({
|
|
5334
5256
|
wordBreak: 'break-word'
|
5335
5257
|
}
|
5336
5258
|
}, {
|
5337
|
-
children:
|
5259
|
+
children: item.name || `Property ${index + 1}`
|
5338
5260
|
}))
|
5339
5261
|
})), jsx(AccordionDetails, {
|
5340
5262
|
children: jsx(CreatePropertyFormFields, {
|
5341
|
-
|
5263
|
+
control: control,
|
5264
|
+
setValue: setValue,
|
5265
|
+
propertyFieldName: `properties.${index}`,
|
5342
5266
|
entityDefinition: _entityDefinition,
|
5343
5267
|
globalParameter: _globalParameter,
|
5344
5268
|
customPropertyFields: _customPropertyFields,
|
@@ -5370,13 +5294,13 @@ const CreatePropertiesList = ({
|
|
5370
5294
|
})), error && jsx(FormHelperText, Object.assign({
|
5371
5295
|
error: true
|
5372
5296
|
}, {
|
5373
|
-
children: (
|
5297
|
+
children: (_a = error.root) === null || _a === void 0 ? void 0 : _a.message
|
5374
5298
|
}))]
|
5375
5299
|
}))]
|
5376
5300
|
});
|
5377
|
-
};
|
5301
|
+
});
|
5378
5302
|
|
5379
|
-
const CreateDefinition = ({
|
5303
|
+
const CreateDefinition = /*#__PURE__*/forwardRef(({
|
5380
5304
|
definitionFieldName,
|
5381
5305
|
title,
|
5382
5306
|
hideCodeField,
|
@@ -5386,10 +5310,12 @@ const CreateDefinition = ({
|
|
5386
5310
|
entityReferenceDefinitionSources,
|
5387
5311
|
entityReferenceValueComponent,
|
5388
5312
|
fileReferenceValueComponent
|
5389
|
-
}) => {
|
5313
|
+
}, ref) => {
|
5390
5314
|
const {
|
5391
|
-
control
|
5315
|
+
control,
|
5316
|
+
getValues
|
5392
5317
|
} = useFormContext();
|
5318
|
+
const properties = getValues(`${definitionFieldName}.properties`);
|
5393
5319
|
return jsxs(Grid, Object.assign({
|
5394
5320
|
container: true,
|
5395
5321
|
direction: "column",
|
@@ -5435,6 +5361,8 @@ const CreateDefinition = ({
|
|
5435
5361
|
label: "Version"
|
5436
5362
|
})
|
5437
5363
|
})), jsx(CreatePropertiesList, {
|
5364
|
+
ref: ref,
|
5365
|
+
properties: properties,
|
5438
5366
|
required: _required,
|
5439
5367
|
parentFieldName: definitionFieldName,
|
5440
5368
|
entityReferenceDefinitionSources: entityReferenceDefinitionSources,
|
@@ -5442,7 +5370,7 @@ const CreateDefinition = ({
|
|
5442
5370
|
fileReferenceValueComponent: fileReferenceValueComponent
|
5443
5371
|
})]
|
5444
5372
|
}));
|
5445
|
-
};
|
5373
|
+
});
|
5446
5374
|
|
5447
5375
|
const labels = {
|
5448
5376
|
name: 'Name',
|
package/package.json
CHANGED
@@ -19,5 +19,5 @@ type Props = {
|
|
19
19
|
name: string;
|
20
20
|
}>;
|
21
21
|
};
|
22
|
-
export declare const CreateDefinition: (
|
22
|
+
export declare const CreateDefinition: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<unknown>>;
|
23
23
|
export default CreateDefinition;
|
@@ -1,6 +1,7 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { CustomPropertyFieldProps, EntityReferenceProperty } from '../../../interfaces';
|
2
|
+
import { CustomPropertyFieldProps, EntityReferenceProperty, PropertiesArrayType } from '../../../interfaces';
|
3
3
|
type Props = {
|
4
|
+
properties: PropertiesArrayType<any>;
|
4
5
|
parentFieldName?: string;
|
5
6
|
hideAddButton?: boolean;
|
6
7
|
focusOnIndex?: number;
|
@@ -24,5 +25,5 @@ type Props = {
|
|
24
25
|
name: string;
|
25
26
|
}>;
|
26
27
|
};
|
27
|
-
export declare const CreatePropertiesList: (
|
28
|
+
export declare const CreatePropertiesList: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<unknown>>;
|
28
29
|
export default CreatePropertiesList;
|
@@ -1,6 +1,9 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { CustomPropertyFieldProps, EntityReferenceProperty } from '../../../interfaces';
|
3
3
|
type Props = {
|
4
|
+
setValue: any;
|
5
|
+
control: any;
|
6
|
+
watch?: any;
|
4
7
|
propertyFieldName: string;
|
5
8
|
entityDefinition?: boolean;
|
6
9
|
globalParameter?: boolean;
|
@@ -17,5 +20,5 @@ type Props = {
|
|
17
20
|
name: string;
|
18
21
|
}>;
|
19
22
|
};
|
20
|
-
export declare const CreatePropertyFormFields: ({ propertyFieldName, entityDefinition, globalParameter, customPropertyFields, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element
|
23
|
+
export declare const CreatePropertyFormFields: import("react").MemoExoticComponent<({ setValue, control, propertyFieldName, entityDefinition, globalParameter, customPropertyFields, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element>;
|
21
24
|
export default CreatePropertyFormFields;
|
package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/BigDecimalPropertyFields.d.ts
CHANGED
@@ -1,6 +1,8 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { Control } from 'react-hook-form';
|
2
3
|
type Props = {
|
3
4
|
propertyFieldName: string;
|
5
|
+
control: Control<any>;
|
4
6
|
};
|
5
|
-
declare const BigDecimalPropertyFields: ({ propertyFieldName }: Props) => JSX.Element;
|
7
|
+
declare const BigDecimalPropertyFields: ({ propertyFieldName, control }: Props) => JSX.Element;
|
6
8
|
export default BigDecimalPropertyFields;
|
@@ -1,7 +1,9 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { Control } from 'react-hook-form';
|
2
3
|
type Props = {
|
3
4
|
propertyFieldName: string;
|
4
5
|
defaultValue?: string;
|
6
|
+
control: Control<any>;
|
5
7
|
};
|
6
|
-
declare const DateAdditionalFields: ({ propertyFieldName, defaultValue }: Props) => JSX.Element;
|
8
|
+
declare const DateAdditionalFields: ({ propertyFieldName, control, defaultValue }: Props) => JSX.Element;
|
7
9
|
export default DateAdditionalFields;
|
package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/EntityAdditionalFields.d.ts
CHANGED
@@ -1,6 +1,8 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { Control } from 'react-hook-form';
|
2
3
|
import { EntityReferenceProperty } from '../../../../interfaces';
|
3
4
|
type Props = {
|
5
|
+
control: Control<any>;
|
4
6
|
parentPropertyFieldName: string;
|
5
7
|
entityDefinition?: boolean;
|
6
8
|
globalParameter?: boolean;
|
@@ -16,5 +18,5 @@ type Props = {
|
|
16
18
|
name: string;
|
17
19
|
}>;
|
18
20
|
};
|
19
|
-
declare const EntityAdditionalFields: ({ parentPropertyFieldName, entityDefinition, globalParameter, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element;
|
21
|
+
declare const EntityAdditionalFields: ({ control, parentPropertyFieldName, entityDefinition, globalParameter, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element;
|
20
22
|
export default EntityAdditionalFields;
|
package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/EntityReferencePropertyFields.d.ts
CHANGED
@@ -1,10 +1,12 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { Control } from 'react-hook-form';
|
2
3
|
type Props = {
|
3
4
|
propertyFieldName: string;
|
4
5
|
sources?: {
|
5
6
|
label: string;
|
6
7
|
value: string;
|
7
8
|
}[];
|
9
|
+
control: Control<any>;
|
8
10
|
};
|
9
|
-
declare const EntityReferencePropertyFields: ({ propertyFieldName, sources, }: Props) => JSX.Element;
|
11
|
+
declare const EntityReferencePropertyFields: ({ propertyFieldName, control, sources, }: Props) => JSX.Element;
|
10
12
|
export default EntityReferencePropertyFields;
|
package/src/lib/Property/UpsertProperty/PropertyAdditionalFields/PropertyAdditionalFields.d.ts
CHANGED
@@ -1,6 +1,8 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { PropertyType, EntityReferenceProperty } from '../../../../interfaces';
|
3
|
+
import { Control } from 'react-hook-form';
|
3
4
|
type Props = {
|
5
|
+
control: Control<any>;
|
4
6
|
propertyType: PropertyType;
|
5
7
|
propertyFieldName: string;
|
6
8
|
entityDefinition?: boolean;
|
@@ -17,5 +19,5 @@ type Props = {
|
|
17
19
|
name: string;
|
18
20
|
}>;
|
19
21
|
};
|
20
|
-
export declare const PropertyAdditionalFields: ({ propertyType, propertyFieldName, entityDefinition, globalParameter, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element;
|
22
|
+
export declare const PropertyAdditionalFields: ({ control, propertyType, propertyFieldName, entityDefinition, globalParameter, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element;
|
21
23
|
export default PropertyAdditionalFields;
|
@@ -1,6 +1,8 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { Control } from 'react-hook-form';
|
2
3
|
type Props = {
|
3
4
|
propertyFieldName: string;
|
5
|
+
control: Control<any>;
|
4
6
|
};
|
5
|
-
declare const StringPropertyFields: ({ propertyFieldName }: Props) => JSX.Element;
|
7
|
+
declare const StringPropertyFields: ({ propertyFieldName, control }: Props) => JSX.Element;
|
6
8
|
export default StringPropertyFields;
|
@@ -1,6 +1,8 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { Control } from 'react-hook-form';
|
2
3
|
import { EntityReferenceProperty } from '../../../../interfaces';
|
3
4
|
type Props = {
|
5
|
+
control: Control<any>;
|
4
6
|
propertyFieldName: string;
|
5
7
|
name: string;
|
6
8
|
label?: string;
|
@@ -17,5 +19,5 @@ type Props = {
|
|
17
19
|
name: string;
|
18
20
|
}>;
|
19
21
|
};
|
20
|
-
export declare const PropertyValueField: ({ propertyFieldName, name, label, required, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element;
|
22
|
+
export declare const PropertyValueField: ({ control, propertyFieldName, name, label, required, entityReferenceDefinitionSources, entityReferenceValueComponent, fileReferenceValueComponent, }: Props) => JSX.Element;
|
21
23
|
export default PropertyValueField;
|