@dartech/arsenal-ui 1.3.59 → 1.3.61
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 +217 -226
- package/package.json +1 -1
- package/src/lib/Property/PropertyWidget/PropertyWidget.d.ts +3 -1
- package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/BooleanValueField.d.ts +0 -1
- package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/DateTimeValueField.d.ts +0 -1
- package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/DateValueField.d.ts +0 -1
- package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/JsonValueField.d.ts +0 -1
- package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/TimeValueField.d.ts +0 -1
- package/src/lib/Property/UpsertProperty/index.d.ts +1 -0
- package/src/lib/Property/ViewProperty/PropertyItem.d.ts +0 -1
- package/src/lib/Property/index.d.ts +0 -1
- /package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/PropertyValueField.d.ts +0 -0
- /package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/StringValueField.d.ts +0 -0
- /package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/index.d.ts +0 -0
package/index.js
CHANGED
@@ -70,7 +70,6 @@ import StepLabel from '@mui/material/StepLabel';
|
|
70
70
|
import StepContent from '@mui/material/StepContent';
|
71
71
|
import StepConnector from '@mui/material/StepConnector';
|
72
72
|
import Select from '@mui/material/Select';
|
73
|
-
import CloseIcon from '@mui/icons-material/Close';
|
74
73
|
import InputLabel from '@mui/material/InputLabel';
|
75
74
|
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
|
76
75
|
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
|
@@ -242,18 +241,15 @@ const ControlInput = _a => {
|
|
242
241
|
_d = _c.field,
|
243
242
|
{
|
244
243
|
ref,
|
245
|
-
onChange
|
244
|
+
onChange,
|
245
|
+
value
|
246
246
|
} = _d,
|
247
|
-
fieldProps = __rest(_d, ["ref", "onChange"]),
|
247
|
+
fieldProps = __rest(_d, ["ref", "onChange", "value"]),
|
248
248
|
{
|
249
249
|
fieldState: {
|
250
250
|
error
|
251
251
|
}
|
252
252
|
} = _c;
|
253
|
-
const value = useWatch({
|
254
|
-
control,
|
255
|
-
name
|
256
|
-
});
|
257
253
|
return jsx(TextField, Object.assign({}, fieldProps, {
|
258
254
|
fullWidth: true,
|
259
255
|
size: "small",
|
@@ -432,18 +428,15 @@ const ControlSelect = _a => {
|
|
432
428
|
_d = _c.field,
|
433
429
|
{
|
434
430
|
ref,
|
435
|
-
onChange
|
431
|
+
onChange,
|
432
|
+
value
|
436
433
|
} = _d,
|
437
|
-
fieldProps = __rest(_d, ["ref", "onChange"]),
|
434
|
+
fieldProps = __rest(_d, ["ref", "onChange", "value"]),
|
438
435
|
{
|
439
436
|
fieldState: {
|
440
437
|
error
|
441
438
|
}
|
442
439
|
} = _c;
|
443
|
-
const value = useWatch({
|
444
|
-
control,
|
445
|
-
name
|
446
|
-
});
|
447
440
|
const getValue = useCallback(option => {
|
448
441
|
if (typeof option === 'string') return option;
|
449
442
|
return valueKey ? option[valueKey] : option.value;
|
@@ -539,18 +532,15 @@ const ControlCheckbox = _a => {
|
|
539
532
|
_c = _b.field,
|
540
533
|
{
|
541
534
|
ref,
|
542
|
-
onChange
|
535
|
+
onChange,
|
536
|
+
value
|
543
537
|
} = _c,
|
544
|
-
fieldProps = __rest(_c, ["ref", "onChange"]),
|
538
|
+
fieldProps = __rest(_c, ["ref", "onChange", "value"]),
|
545
539
|
{
|
546
540
|
fieldState: {
|
547
541
|
error
|
548
542
|
}
|
549
543
|
} = _b;
|
550
|
-
const value = useWatch({
|
551
|
-
control,
|
552
|
-
name
|
553
|
-
});
|
554
544
|
const checked = useMemo(() => {
|
555
545
|
if (typeof value === 'boolean') {
|
556
546
|
return value;
|
@@ -618,19 +608,15 @@ const ControlRadio = ({
|
|
618
608
|
}),
|
619
609
|
_b = _a.field,
|
620
610
|
{
|
621
|
-
ref,
|
622
611
|
onChange
|
623
612
|
} = _b,
|
624
|
-
fieldProps = __rest(_b, ["
|
613
|
+
fieldProps = __rest(_b, ["onChange"]),
|
625
614
|
{
|
626
615
|
fieldState: {
|
627
616
|
error
|
628
617
|
}
|
629
618
|
} = _a;
|
630
|
-
const value = useWatch({
|
631
|
-
control,
|
632
|
-
name
|
633
|
-
});
|
619
|
+
// const value = useWatch({ control, name });
|
634
620
|
const getValue = useCallback(option => {
|
635
621
|
if (typeof option === 'string') return option;
|
636
622
|
return valueKey ? option[valueKey] : option.value;
|
@@ -650,9 +636,6 @@ const ControlRadio = ({
|
|
650
636
|
})), jsx(RadioGroup, Object.assign({}, fieldProps, {
|
651
637
|
row: row,
|
652
638
|
"aria-labelledby": "radio-buttons-group",
|
653
|
-
ref: ref,
|
654
|
-
name: name,
|
655
|
-
value: value,
|
656
639
|
onChange: customOnChange ? customOnChange : onChange
|
657
640
|
}, {
|
658
641
|
children: _values.map((item, i) => jsx(FormControlLabel, {
|
@@ -727,28 +710,26 @@ const ControlAutocomplete = _a => {
|
|
727
710
|
disableCloseOnSelect
|
728
711
|
} = _a,
|
729
712
|
autocompleteProps = __rest(_a, ["control", "validate", "name", "label", "required", "defaultValue", "disabled", "hideErrorMessage", "onChange", "labelKey", "valueKey", "options", "multiple", "textFieldProps", "disableCloseOnSelect"]);
|
730
|
-
const {
|
731
|
-
|
713
|
+
const _b = useController({
|
714
|
+
name,
|
715
|
+
control,
|
716
|
+
defaultValue: defaultValue || (multiple ? [] : null),
|
717
|
+
rules: {
|
718
|
+
required: required && 'Please, fill this field',
|
719
|
+
validate
|
720
|
+
}
|
721
|
+
}),
|
722
|
+
_c = _b.field,
|
723
|
+
{
|
732
724
|
ref,
|
733
725
|
onChange
|
734
|
-
},
|
735
|
-
|
736
|
-
|
737
|
-
|
738
|
-
|
739
|
-
|
740
|
-
|
741
|
-
defaultValue,
|
742
|
-
rules: {
|
743
|
-
required: required && 'Please, fill this field',
|
744
|
-
validate
|
745
|
-
}
|
746
|
-
});
|
747
|
-
const formValue = useWatch({
|
748
|
-
control,
|
749
|
-
name,
|
750
|
-
defaultValue: multiple ? [] : null
|
751
|
-
});
|
726
|
+
} = _c,
|
727
|
+
fieldProps = __rest(_c, ["ref", "onChange"]),
|
728
|
+
{
|
729
|
+
fieldState: {
|
730
|
+
error
|
731
|
+
}
|
732
|
+
} = _b;
|
752
733
|
const {
|
753
734
|
getOptionLabel,
|
754
735
|
isOptionEqualToValue,
|
@@ -760,7 +741,7 @@ const ControlAutocomplete = _a => {
|
|
760
741
|
const handleChange = (_, value) => {
|
761
742
|
onChange(value);
|
762
743
|
};
|
763
|
-
return jsx(Autocomplete, Object.assign({
|
744
|
+
return jsx(Autocomplete, Object.assign({}, fieldProps, {
|
764
745
|
fullWidth: true,
|
765
746
|
disablePortal: true,
|
766
747
|
size: "small",
|
@@ -771,7 +752,6 @@ const ControlAutocomplete = _a => {
|
|
771
752
|
isOptionEqualToValue: isOptionEqualToValue,
|
772
753
|
disableCloseOnSelect: disableCloseOnSelect || multiple,
|
773
754
|
filterSelectedOptions: multiple,
|
774
|
-
value: formValue,
|
775
755
|
onChange: customOnChange ? customOnChange : handleChange,
|
776
756
|
renderOption: renderOption,
|
777
757
|
renderInput: params => {
|
@@ -817,28 +797,29 @@ function ControlQueryAutocomplete(_a) {
|
|
817
797
|
itemQueryFunction
|
818
798
|
} = _a,
|
819
799
|
autocompleteProps = __rest(_a, ["name", "label", "control", "required", "searchBy", "labelKey", "multiple", "disabled", "valueKey", "sortBy", "hideErrorMessage", "disableCloseOnSelect", "textFieldProps", "onChange", "queryFunction", "validate", "itemQueryFunction"]);
|
820
|
-
const {
|
821
|
-
|
800
|
+
const _b = useController({
|
801
|
+
control,
|
802
|
+
name,
|
803
|
+
defaultValue: multiple ? [] : null,
|
804
|
+
rules: {
|
805
|
+
required: required && 'Please, fill this field',
|
806
|
+
validate
|
807
|
+
}
|
808
|
+
}),
|
809
|
+
_c = _b.field,
|
810
|
+
{
|
822
811
|
ref,
|
823
|
-
onChange: setFieldValue
|
824
|
-
|
825
|
-
|
826
|
-
|
827
|
-
|
828
|
-
|
829
|
-
|
830
|
-
|
831
|
-
|
832
|
-
|
833
|
-
|
834
|
-
validate
|
835
|
-
}
|
836
|
-
});
|
837
|
-
const formValue = useWatch({
|
838
|
-
control,
|
839
|
-
name,
|
840
|
-
defaultValue: multiple ? [] : null
|
841
|
-
});
|
812
|
+
onChange: setFieldValue,
|
813
|
+
value: formValue
|
814
|
+
} = _c,
|
815
|
+
fieldProps = __rest(_c, ["ref", "onChange", "value"]),
|
816
|
+
{
|
817
|
+
fieldState: {
|
818
|
+
error,
|
819
|
+
isDirty
|
820
|
+
}
|
821
|
+
} = _b;
|
822
|
+
// const formValue = useWatch({ control, name, defaultValue: });
|
842
823
|
const {
|
843
824
|
getOptionLabel,
|
844
825
|
isOptionEqualToValue,
|
@@ -914,7 +895,7 @@ function ControlQueryAutocomplete(_a) {
|
|
914
895
|
setTotalItems(data.totalItems);
|
915
896
|
}
|
916
897
|
}, [data]);
|
917
|
-
return jsx(Autocomplete, Object.assign({
|
898
|
+
return jsx(Autocomplete, Object.assign({}, fieldProps, {
|
918
899
|
fullWidth: true,
|
919
900
|
disablePortal: true,
|
920
901
|
size: "small",
|
@@ -1057,43 +1038,46 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
|
|
1057
1038
|
setError,
|
1058
1039
|
clearErrors
|
1059
1040
|
} = useFormContext();
|
1060
|
-
const {
|
1061
|
-
|
1041
|
+
const _b = useController({
|
1042
|
+
control,
|
1043
|
+
name,
|
1044
|
+
rules: {
|
1045
|
+
required: required && 'Please, fill this field'
|
1046
|
+
}
|
1047
|
+
}),
|
1048
|
+
_c = _b.field,
|
1049
|
+
{
|
1062
1050
|
onChange,
|
1051
|
+
value,
|
1063
1052
|
ref: formRef
|
1064
|
-
},
|
1065
|
-
|
1066
|
-
|
1067
|
-
|
1068
|
-
|
1069
|
-
|
1070
|
-
|
1071
|
-
|
1072
|
-
|
1073
|
-
}
|
1074
|
-
});
|
1075
|
-
const value = useWatch({
|
1076
|
-
control,
|
1077
|
-
name
|
1078
|
-
});
|
1053
|
+
} = _c,
|
1054
|
+
fieldProps = __rest(_c, ["onChange", "value", "ref"]),
|
1055
|
+
{
|
1056
|
+
fieldState: {
|
1057
|
+
error
|
1058
|
+
}
|
1059
|
+
} = _b;
|
1060
|
+
// console.log('validateJson', validateJson, name);
|
1061
|
+
// console.log('parseValue', parseValue, name);
|
1079
1062
|
const extensions = useMemo(() => ({
|
1080
1063
|
json: [langs.json()],
|
1081
1064
|
javascript: [langs.javascript()],
|
1082
1065
|
python: [langs.python()]
|
1083
1066
|
}), []);
|
1084
1067
|
const handleChange = useCallback(value => {
|
1085
|
-
|
1086
|
-
|
1087
|
-
|
1088
|
-
|
1089
|
-
|
1090
|
-
|
1091
|
-
}
|
1068
|
+
// console.log('handleChange', name, value);
|
1069
|
+
// if (!value && required) {
|
1070
|
+
// setError(name, { message: 'Required field' });
|
1071
|
+
// } else {
|
1072
|
+
// clearErrors(name);
|
1073
|
+
// }
|
1092
1074
|
if (validateJson) {
|
1093
1075
|
try {
|
1076
|
+
// console.log('validateJson', JSON.parse(value), name);
|
1094
1077
|
JSON.parse(value);
|
1095
1078
|
clearErrors(name);
|
1096
1079
|
} catch (error) {
|
1080
|
+
console.error(error);
|
1097
1081
|
setError(name, {
|
1098
1082
|
message: 'Invalid JSON'
|
1099
1083
|
});
|
@@ -1109,7 +1093,7 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
|
|
1109
1093
|
} else {
|
1110
1094
|
onChange(value);
|
1111
1095
|
}
|
1112
|
-
}, [setError, clearErrors, onChange,
|
1096
|
+
}, [setError, clearErrors, onChange, name, parseValue, validateJson]);
|
1113
1097
|
return jsxs(Box, Object.assign({
|
1114
1098
|
display: "flex",
|
1115
1099
|
flexDirection: "column",
|
@@ -1133,7 +1117,7 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
|
|
1133
1117
|
}) : label
|
1134
1118
|
}))
|
1135
1119
|
}), jsxs(Fragment, {
|
1136
|
-
children: [jsx(CodeMirror, Object.assign({
|
1120
|
+
children: [jsx(CodeMirror, Object.assign({}, fieldProps, {
|
1137
1121
|
ref: ref || formRef,
|
1138
1122
|
basicSetup: {
|
1139
1123
|
autocompletion: true,
|
@@ -1959,13 +1943,10 @@ const ControlSwitch = _a => {
|
|
1959
1943
|
}).field,
|
1960
1944
|
{
|
1961
1945
|
ref,
|
1962
|
-
onChange
|
1946
|
+
onChange,
|
1947
|
+
value
|
1963
1948
|
} = _b,
|
1964
|
-
fieldProps = __rest(_b, ["ref", "onChange"]);
|
1965
|
-
const value = useWatch({
|
1966
|
-
control,
|
1967
|
-
name
|
1968
|
-
});
|
1949
|
+
fieldProps = __rest(_b, ["ref", "onChange", "value"]);
|
1969
1950
|
const checked = useMemo(() => {
|
1970
1951
|
if (typeof value === 'boolean') {
|
1971
1952
|
return value;
|
@@ -2157,18 +2138,15 @@ const ControlTime = ({
|
|
2157
2138
|
_b = _a.field,
|
2158
2139
|
{
|
2159
2140
|
onChange,
|
2160
|
-
ref
|
2141
|
+
ref,
|
2142
|
+
value
|
2161
2143
|
} = _b,
|
2162
|
-
fieldProps = __rest(_b, ["onChange", "ref"]),
|
2144
|
+
fieldProps = __rest(_b, ["onChange", "ref", "value"]),
|
2163
2145
|
{
|
2164
2146
|
fieldState: {
|
2165
2147
|
error
|
2166
2148
|
}
|
2167
2149
|
} = _a;
|
2168
|
-
const value = useWatch({
|
2169
|
-
control,
|
2170
|
-
name
|
2171
|
-
});
|
2172
2150
|
const [fieldValue, setFieldValue] = useState(null);
|
2173
2151
|
const handleChange = date => {
|
2174
2152
|
setFieldValue(date);
|
@@ -3597,53 +3575,6 @@ const PropertyAdditionalFields = ({
|
|
3597
3575
|
}
|
3598
3576
|
};
|
3599
3577
|
|
3600
|
-
const JsonEditor = /*#__PURE__*/forwardRef(({
|
3601
|
-
validate: _validate = false,
|
3602
|
-
name,
|
3603
|
-
useParsedValue
|
3604
|
-
}, ref) => {
|
3605
|
-
const {
|
3606
|
-
control,
|
3607
|
-
setValue,
|
3608
|
-
setError,
|
3609
|
-
clearErrors
|
3610
|
-
} = useFormContext();
|
3611
|
-
const value = useWatch({
|
3612
|
-
control,
|
3613
|
-
name
|
3614
|
-
});
|
3615
|
-
const handleChange = value => {
|
3616
|
-
try {
|
3617
|
-
if (value) setValue(name, useParsedValue ? JSON.parse(value) : value);
|
3618
|
-
clearErrors(name);
|
3619
|
-
} catch (e) {
|
3620
|
-
if (_validate) setError(name, {
|
3621
|
-
message: 'Invalid JSON'
|
3622
|
-
});
|
3623
|
-
}
|
3624
|
-
};
|
3625
|
-
return jsx(CodeMirror, {
|
3626
|
-
ref: ref,
|
3627
|
-
basicSetup: {
|
3628
|
-
autocompletion: true,
|
3629
|
-
history: true
|
3630
|
-
},
|
3631
|
-
theme: abcdef,
|
3632
|
-
width: "100%",
|
3633
|
-
height: "200px",
|
3634
|
-
style: {
|
3635
|
-
fontSize: 14,
|
3636
|
-
lineHeight: 1.4,
|
3637
|
-
zIndex: 0,
|
3638
|
-
isolation: 'isolate'
|
3639
|
-
},
|
3640
|
-
value: typeof value !== 'string' ? value === null ? '' : JSON.stringify(value) : value,
|
3641
|
-
onChange: handleChange,
|
3642
|
-
extensions: [langs.json()]
|
3643
|
-
});
|
3644
|
-
});
|
3645
|
-
var JsonEditor$1 = JsonEditor;
|
3646
|
-
|
3647
3578
|
const StringValueField = ({
|
3648
3579
|
name,
|
3649
3580
|
label,
|
@@ -3705,21 +3636,20 @@ const StringValueField = ({
|
|
3705
3636
|
};
|
3706
3637
|
var StringValueField$1 = StringValueField;
|
3707
3638
|
|
3708
|
-
const PropertyWidget =
|
3639
|
+
const PropertyWidget = ({
|
3709
3640
|
property,
|
3710
3641
|
name,
|
3711
3642
|
label,
|
3712
|
-
useExpression
|
3713
|
-
|
3714
|
-
|
3715
|
-
control
|
3716
|
-
} = useFormContext();
|
3643
|
+
useExpression,
|
3644
|
+
control
|
3645
|
+
}) => {
|
3717
3646
|
const propertyType = useMemo(() => typeof property.propertyType === 'string' ? property.propertyType : property['propertyType']['value'], [property]);
|
3718
3647
|
switch (propertyType) {
|
3719
3648
|
case PropertyType.BIG_DECIMAL:
|
3720
3649
|
case PropertyType.FLOAT:
|
3721
3650
|
case PropertyType.DOUBLE:
|
3722
3651
|
return jsx(ControlNumberInput, {
|
3652
|
+
required: true,
|
3723
3653
|
decimal: true,
|
3724
3654
|
hideErrorMessage: true,
|
3725
3655
|
control: control,
|
@@ -3730,10 +3660,8 @@ const PropertyWidget = /*#__PURE__*/forwardRef(({
|
|
3730
3660
|
case PropertyType.INTEGER:
|
3731
3661
|
case PropertyType.BIG_INTEGER:
|
3732
3662
|
case PropertyType.LONG:
|
3733
|
-
return jsx(ControlNumberInput
|
3734
|
-
|
3735
|
-
, {
|
3736
|
-
// required
|
3663
|
+
return jsx(ControlNumberInput, {
|
3664
|
+
required: true,
|
3737
3665
|
hideErrorMessage: true,
|
3738
3666
|
control: control,
|
3739
3667
|
name: name,
|
@@ -3779,12 +3707,15 @@ const PropertyWidget = /*#__PURE__*/forwardRef(({
|
|
3779
3707
|
format: property.format
|
3780
3708
|
});
|
3781
3709
|
case PropertyType.JSON:
|
3782
|
-
return jsx(
|
3783
|
-
|
3710
|
+
return jsx(ControlAceEditor, {
|
3711
|
+
control: control,
|
3784
3712
|
name: name,
|
3785
|
-
|
3786
|
-
|
3713
|
+
label: label,
|
3714
|
+
parseValue: true,
|
3715
|
+
hideErrorMessage: true,
|
3716
|
+
validateJson: true
|
3787
3717
|
});
|
3718
|
+
// return <JsonEditor validate name={name} ref={ref} useParsedValue />;
|
3788
3719
|
case PropertyType.STRING:
|
3789
3720
|
return jsx(StringValueField$1
|
3790
3721
|
// required={!property.isRequired}
|
@@ -3803,9 +3734,11 @@ const PropertyWidget = /*#__PURE__*/forwardRef(({
|
|
3803
3734
|
control: control
|
3804
3735
|
});
|
3805
3736
|
case PropertyType.ANY:
|
3806
|
-
return jsx(
|
3737
|
+
return jsx(ControlAceEditor, {
|
3738
|
+
control: control,
|
3807
3739
|
name: name,
|
3808
|
-
|
3740
|
+
hideErrorMessage: true,
|
3741
|
+
label: label
|
3809
3742
|
});
|
3810
3743
|
case PropertyType.ENTITY:
|
3811
3744
|
return jsx(DefinitionFiller, {
|
@@ -3818,7 +3751,7 @@ const PropertyWidget = /*#__PURE__*/forwardRef(({
|
|
3818
3751
|
children: "No widget"
|
3819
3752
|
});
|
3820
3753
|
}
|
3821
|
-
}
|
3754
|
+
};
|
3822
3755
|
|
3823
3756
|
const usePropertyFiller = ({
|
3824
3757
|
value,
|
@@ -3846,31 +3779,29 @@ const usePropertyFiller = ({
|
|
3846
3779
|
useExpression: _useExpression
|
3847
3780
|
}), [_useExpression, _required, propertyType, _multipleOptions]);
|
3848
3781
|
const defaultProperyValue = useMemo(() => {
|
3849
|
-
|
3850
|
-
|
3851
|
-
|
3852
|
-
|
3853
|
-
|
3854
|
-
|
3855
|
-
|
3856
|
-
|
3857
|
-
|
3858
|
-
|
3859
|
-
|
3860
|
-
|
3861
|
-
|
3862
|
-
|
3863
|
-
|
3864
|
-
|
3865
|
-
|
3866
|
-
|
3867
|
-
|
3868
|
-
|
3869
|
-
|
3870
|
-
|
3871
|
-
|
3872
|
-
} else return null;
|
3873
|
-
}, [propertyType, property]);
|
3782
|
+
switch (propertyType) {
|
3783
|
+
case PropertyType.STRING:
|
3784
|
+
case PropertyType.DATE:
|
3785
|
+
case PropertyType.TIME:
|
3786
|
+
case PropertyType.DATE_TIME:
|
3787
|
+
case PropertyType.ENTITY_REFERENCE:
|
3788
|
+
case PropertyType.ANY:
|
3789
|
+
return '';
|
3790
|
+
case PropertyType.JSON:
|
3791
|
+
return {};
|
3792
|
+
case PropertyType.BOOLEAN:
|
3793
|
+
return true;
|
3794
|
+
case PropertyType.INTEGER:
|
3795
|
+
case PropertyType.BIG_DECIMAL:
|
3796
|
+
case PropertyType.BIG_INTEGER:
|
3797
|
+
case PropertyType.DOUBLE:
|
3798
|
+
case PropertyType.LONG:
|
3799
|
+
case PropertyType.FLOAT:
|
3800
|
+
return 0;
|
3801
|
+
default:
|
3802
|
+
return {};
|
3803
|
+
}
|
3804
|
+
}, [propertyType]);
|
3874
3805
|
useEffect(() => {
|
3875
3806
|
if (!fillOption) {
|
3876
3807
|
if (isPropertyValueEmpty(value) && (fillOptions === null || fillOptions === void 0 ? void 0 : fillOptions.length)) {
|
@@ -3924,8 +3855,6 @@ const PropertyFiller = ({
|
|
3924
3855
|
} = useFormContext();
|
3925
3856
|
const {
|
3926
3857
|
field: {
|
3927
|
-
ref,
|
3928
|
-
onChange,
|
3929
3858
|
value
|
3930
3859
|
},
|
3931
3860
|
fieldState: {
|
@@ -3967,7 +3896,7 @@ const PropertyFiller = ({
|
|
3967
3896
|
properties: propertiesArrayToObject(value.property || [])
|
3968
3897
|
});
|
3969
3898
|
try {
|
3970
|
-
|
3899
|
+
setValue(name, JSON.stringify(definitionValue, null, '\t'));
|
3971
3900
|
} catch (error) {
|
3972
3901
|
console.log('Stringify failed', error);
|
3973
3902
|
}
|
@@ -3975,7 +3904,7 @@ const PropertyFiller = ({
|
|
3975
3904
|
setValue(name, property.defaultValue || defaultProperyValue);
|
3976
3905
|
}
|
3977
3906
|
} else if (selectedType === 'expression' || selectedType === 'string') {
|
3978
|
-
|
3907
|
+
setValue(name, '');
|
3979
3908
|
} else if (selectedType === 'dem_builder') {
|
3980
3909
|
const defaultArrayValue = {
|
3981
3910
|
code: '',
|
@@ -3987,22 +3916,27 @@ const PropertyFiller = ({
|
|
3987
3916
|
try {
|
3988
3917
|
const definitionValue = JSON.parse(value);
|
3989
3918
|
definitionValue['properties'] = propertiesObjectToArray(definitionValue['properties'] || {});
|
3990
|
-
|
3919
|
+
setValue(name, definitionValue);
|
3991
3920
|
} catch (error) {
|
3992
|
-
|
3921
|
+
setValue(name, defaultArrayValue);
|
3993
3922
|
// console.log('Parse failed');
|
3994
3923
|
}
|
3995
3924
|
} else {
|
3996
|
-
|
3925
|
+
setValue(name, defaultArrayValue);
|
3997
3926
|
}
|
3998
3927
|
}
|
3999
3928
|
clearErrors();
|
4000
|
-
}, [name, defaultProperyValue, clearErrors, value, setFillOption,
|
3929
|
+
}, [name, defaultProperyValue, clearErrors, value, setFillOption, fillOption, propertyType, setValue, property]);
|
4001
3930
|
useEffect(() => {
|
4002
|
-
if (
|
4003
|
-
|
3931
|
+
if (!isDirty && property.defaultValue) {
|
3932
|
+
setValue(name, property.defaultValue);
|
4004
3933
|
}
|
4005
|
-
}, [
|
3934
|
+
}, [isDirty, property, name, setValue]);
|
3935
|
+
useEffect(() => {
|
3936
|
+
if (value === undefined || property.isRequired && value === null) {
|
3937
|
+
setValue(name, defaultProperyValue);
|
3938
|
+
}
|
3939
|
+
}, [value, setValue, defaultProperyValue, property, name, isDirty]);
|
4006
3940
|
return jsxs(Grid$1, Object.assign({
|
4007
3941
|
xs: 12
|
4008
3942
|
}, {
|
@@ -4039,10 +3973,15 @@ const PropertyFiller = ({
|
|
4039
3973
|
}), option.value))
|
4040
3974
|
}))]
|
4041
3975
|
}))
|
4042
|
-
})) : null, fillOption === 'expression' && (propertyType === PropertyType.JSON || propertyType === PropertyType.ENTITY || propertyType === PropertyType.ANY ?
|
3976
|
+
})) : null, fillOption === 'expression' && (propertyType === PropertyType.JSON || propertyType === PropertyType.ENTITY || propertyType === PropertyType.ANY ?
|
3977
|
+
// <JsonEditor validate name={name} useParsedValue />
|
3978
|
+
jsx(ControlAceEditor, {
|
4043
3979
|
name: name,
|
4044
|
-
|
4045
|
-
|
3980
|
+
control: control,
|
3981
|
+
label: valueLabel,
|
3982
|
+
parseValue: true,
|
3983
|
+
validateJson: true,
|
3984
|
+
hideErrorMessage: true
|
4046
3985
|
}) : jsx(ControlInput, {
|
4047
3986
|
control: control,
|
4048
3987
|
name: name,
|
@@ -4055,15 +3994,19 @@ const PropertyFiller = ({
|
|
4055
3994
|
label: valueLabel,
|
4056
3995
|
required: true,
|
4057
3996
|
hideErrorMessage: true
|
4058
|
-
}), fillOption === 'json_notvalid' &&
|
3997
|
+
}), fillOption === 'json_notvalid' &&
|
3998
|
+
// <JsonEditor validate name={name} />
|
3999
|
+
jsx(ControlAceEditor, {
|
4059
4000
|
name: name,
|
4060
|
-
|
4001
|
+
control: control,
|
4002
|
+
label: valueLabel,
|
4003
|
+
hideErrorMessage: true
|
4061
4004
|
}), fillOption === 'widget' && jsx(PropertyWidget, {
|
4005
|
+
control: control,
|
4062
4006
|
property: property,
|
4063
4007
|
name: name,
|
4064
4008
|
useExpression: useExpression,
|
4065
4009
|
label: valueLabel,
|
4066
|
-
ref: ref,
|
4067
4010
|
required: required
|
4068
4011
|
}), fillOption === 'dem_builder' && jsx(CreateDefinition, {
|
4069
4012
|
title: "JSON",
|
@@ -4076,6 +4019,53 @@ const PropertyFiller = ({
|
|
4076
4019
|
}));
|
4077
4020
|
};
|
4078
4021
|
|
4022
|
+
const JsonEditor = /*#__PURE__*/forwardRef(({
|
4023
|
+
validate: _validate = false,
|
4024
|
+
name,
|
4025
|
+
useParsedValue
|
4026
|
+
}, ref) => {
|
4027
|
+
const {
|
4028
|
+
control,
|
4029
|
+
setValue,
|
4030
|
+
setError,
|
4031
|
+
clearErrors
|
4032
|
+
} = useFormContext();
|
4033
|
+
const value = useWatch({
|
4034
|
+
control,
|
4035
|
+
name
|
4036
|
+
});
|
4037
|
+
const handleChange = value => {
|
4038
|
+
try {
|
4039
|
+
if (value) setValue(name, useParsedValue ? JSON.parse(value) : value);
|
4040
|
+
clearErrors(name);
|
4041
|
+
} catch (e) {
|
4042
|
+
if (_validate) setError(name, {
|
4043
|
+
message: 'Invalid JSON'
|
4044
|
+
});
|
4045
|
+
}
|
4046
|
+
};
|
4047
|
+
return jsx(CodeMirror, {
|
4048
|
+
ref: ref,
|
4049
|
+
basicSetup: {
|
4050
|
+
autocompletion: true,
|
4051
|
+
history: true
|
4052
|
+
},
|
4053
|
+
theme: abcdef,
|
4054
|
+
width: "100%",
|
4055
|
+
height: "200px",
|
4056
|
+
style: {
|
4057
|
+
fontSize: 14,
|
4058
|
+
lineHeight: 1.4,
|
4059
|
+
zIndex: 0,
|
4060
|
+
isolation: 'isolate'
|
4061
|
+
},
|
4062
|
+
value: typeof value !== 'string' ? value === null ? '' : JSON.stringify(value) : value,
|
4063
|
+
onChange: handleChange,
|
4064
|
+
extensions: [langs.json()]
|
4065
|
+
});
|
4066
|
+
});
|
4067
|
+
var JsonEditor$1 = JsonEditor;
|
4068
|
+
|
4079
4069
|
const MultiplePropertyWidget = ({
|
4080
4070
|
name,
|
4081
4071
|
property,
|
@@ -4135,9 +4125,13 @@ const MultiplePropertyWidget = ({
|
|
4135
4125
|
size: "small",
|
4136
4126
|
onClick: () => handleDeleteValue(index)
|
4137
4127
|
}, {
|
4138
|
-
children: jsx(
|
4128
|
+
children: jsx(SvgIcon, Object.assign({
|
4139
4129
|
fontSize: "small"
|
4140
|
-
}
|
4130
|
+
}, {
|
4131
|
+
children: jsx("path", {
|
4132
|
+
d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
|
4133
|
+
})
|
4134
|
+
}))
|
4141
4135
|
}))
|
4142
4136
|
}))]
|
4143
4137
|
}))
|
@@ -4171,7 +4165,8 @@ const MultiplePropertyFiller = ({
|
|
4171
4165
|
const {
|
4172
4166
|
field: {
|
4173
4167
|
ref,
|
4174
|
-
onChange
|
4168
|
+
onChange,
|
4169
|
+
value
|
4175
4170
|
},
|
4176
4171
|
fieldState: {
|
4177
4172
|
error,
|
@@ -4188,10 +4183,6 @@ const MultiplePropertyFiller = ({
|
|
4188
4183
|
}
|
4189
4184
|
}
|
4190
4185
|
});
|
4191
|
-
const value = useWatch({
|
4192
|
-
control,
|
4193
|
-
name
|
4194
|
-
});
|
4195
4186
|
const {
|
4196
4187
|
propertyType,
|
4197
4188
|
valueLabel,
|
@@ -4221,7 +4212,7 @@ const MultiplePropertyFiller = ({
|
|
4221
4212
|
clearErrors(name);
|
4222
4213
|
};
|
4223
4214
|
useEffect(() => {
|
4224
|
-
if (value
|
4215
|
+
if (!value) {
|
4225
4216
|
onChange(property.isRequired ? [] : null);
|
4226
4217
|
}
|
4227
4218
|
}, [value, property, onChange]);
|
@@ -4324,7 +4315,7 @@ const PropertyValueField = ({
|
|
4324
4315
|
const typeValue = typeof propertyType === 'string' ? propertyType : propertyType.value;
|
4325
4316
|
return {
|
4326
4317
|
name: _label,
|
4327
|
-
isRequired,
|
4318
|
+
isRequired: required !== null && required !== void 0 ? required : isRequired,
|
4328
4319
|
isMultiple,
|
4329
4320
|
format,
|
4330
4321
|
restrictedValues,
|
@@ -4337,7 +4328,7 @@ const PropertyValueField = ({
|
|
4337
4328
|
uiSettings: null,
|
4338
4329
|
validationNode: null
|
4339
4330
|
};
|
4340
|
-
}, [propertyType, format, restrictedValues, isMultiple, _label, isRequired, properties]);
|
4331
|
+
}, [propertyType, format, restrictedValues, isMultiple, _label, isRequired, properties, required]);
|
4341
4332
|
return isMultiple ? jsx(MultiplePropertyFiller, {
|
4342
4333
|
name: name,
|
4343
4334
|
property: fillerProperty,
|
package/package.json
CHANGED
@@ -1,4 +1,5 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { Control } from 'react-hook-form';
|
2
3
|
import { PropertyUnion } from '../../../interfaces';
|
3
4
|
type Props = {
|
4
5
|
property: PropertyUnion;
|
@@ -6,6 +7,7 @@ type Props = {
|
|
6
7
|
label?: string;
|
7
8
|
useExpression?: boolean;
|
8
9
|
required?: boolean;
|
10
|
+
control: Control<any>;
|
9
11
|
};
|
10
|
-
export declare const PropertyWidget:
|
12
|
+
export declare const PropertyWidget: ({ property, name, label, useExpression, control }: Props) => JSX.Element;
|
11
13
|
export default PropertyWidget;
|
File without changes
|
File without changes
|
/package/src/lib/Property/{PropertyValueField → UpsertProperty/PropertyValueField}/index.d.ts
RENAMED
File without changes
|