@springmicro/forms 0.7.0 → 0.7.2
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/.eslintrc.cjs +22 -22
- package/README.md +11 -11
- package/dist/index.d.ts +0 -0
- package/dist/index.js +4146 -4143
- package/dist/index.umd.cjs +37 -37
- package/package.json +3 -3
- package/src/builder/bottom-drawer.tsx +429 -429
- package/src/builder/form-builder.tsx +256 -256
- package/src/builder/modal.tsx +39 -39
- package/src/builder/nodes/node-base.tsx +94 -94
- package/src/builder/nodes/node-child-helpers.tsx +273 -273
- package/src/builder/nodes/node-parent.tsx +187 -187
- package/src/builder/nodes/node-types/array-node.tsx +134 -134
- package/src/builder/nodes/node-types/date-node.tsx +60 -60
- package/src/builder/nodes/node-types/file-node.tsx +67 -67
- package/src/builder/nodes/node-types/integer-node.tsx +60 -60
- package/src/builder/nodes/node-types/object-node.tsx +67 -67
- package/src/builder/nodes/node-types/text-node.tsx +66 -66
- package/src/fields/ArrayField.tsx +875 -875
- package/src/fields/BooleanField.tsx +110 -110
- package/src/fields/MultiSchemaField.tsx +236 -236
- package/src/fields/NullField.tsx +22 -22
- package/src/fields/NumberField.tsx +87 -87
- package/src/fields/ObjectField.tsx +338 -338
- package/src/fields/SchemaField.tsx +402 -402
- package/src/fields/StringField.tsx +67 -67
- package/src/fields/index.ts +24 -24
- package/src/index.tsx +26 -26
- package/src/interfaces/MessagesProps.interface.ts +5 -5
- package/src/interfaces/Option.interface.ts +4 -4
- package/src/styles/select.styles.ts +28 -28
- package/src/templates/ArrayFieldDescriptionTemplate.tsx +42 -42
- package/src/templates/ArrayFieldItemTemplate.tsx +78 -78
- package/src/templates/ArrayFieldTemplate.tsx +90 -90
- package/src/templates/ArrayFieldTitleTemplate.tsx +44 -44
- package/src/templates/BaseInputTemplate.tsx +94 -94
- package/src/templates/ButtonTemplates/AddButton.tsx +29 -29
- package/src/templates/ButtonTemplates/IconButton.tsx +49 -49
- package/src/templates/ButtonTemplates/SubmitButton.tsx +29 -29
- package/src/templates/ButtonTemplates/index.ts +16 -16
- package/src/templates/DescriptionField.tsx +29 -29
- package/src/templates/ErrorList.tsx +25 -25
- package/src/templates/FieldTemplate/FieldTemplate.tsx +39 -39
- package/src/templates/FieldTemplate/Label.tsx +29 -29
- package/src/templates/FieldTemplate/WrapIfAdditional.tsx +85 -85
- package/src/templates/FieldTemplate/index.ts +3 -3
- package/src/templates/ObjectFieldTemplate.tsx +79 -79
- package/src/templates/TitleField.tsx +20 -20
- package/src/templates/UnsupportedField.tsx +29 -29
- package/src/templates/index.ts +32 -32
- package/src/types/Message.type.ts +6 -6
- package/src/types/RawMessage.type.ts +15 -15
- package/src/types/form-builder.ts +135 -135
- package/src/types/utils.type.ts +1 -1
- package/src/utils/form-builder.ts +424 -424
- package/src/utils/processSelectValue.ts +50 -50
- package/src/widgets/AltDateTimeWidget.tsx +17 -17
- package/src/widgets/AltDateWidget.tsx +216 -216
- package/src/widgets/CheckboxWidget.tsx +80 -80
- package/src/widgets/CheckboxesWidget.tsx +74 -74
- package/src/widgets/ColorWidget.tsx +26 -26
- package/src/widgets/DateTimeWidget.tsx +28 -28
- package/src/widgets/DateWidget.tsx +36 -36
- package/src/widgets/EmailWidget.tsx +19 -19
- package/src/widgets/FileWidget.tsx +144 -144
- package/src/widgets/HiddenWidget.tsx +22 -22
- package/src/widgets/PasswordWidget.tsx +20 -20
- package/src/widgets/RadioWidget.tsx +87 -87
- package/src/widgets/RangeWidget.tsx +24 -24
- package/src/widgets/SelectWidget.tsx +99 -99
- package/src/widgets/TextWidget.tsx +19 -19
- package/src/widgets/TextareaWidget.tsx +64 -64
- package/src/widgets/URLWidget.tsx +19 -19
- package/src/widgets/UpDownWidget.tsx +20 -20
- package/src/widgets/index.ts +43 -43
- package/tsconfig.json +24 -24
- package/tsconfig.node.json +10 -10
- package/vite.config.ts +25 -25
|
@@ -1,60 +1,60 @@
|
|
|
1
|
-
import {
|
|
2
|
-
ChildNodeProps,
|
|
3
|
-
DateNode as DateNodeType,
|
|
4
|
-
FieldArrayType,
|
|
5
|
-
} from "../../../types/form-builder";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
-
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
-
|
|
10
|
-
export default function DateNode({
|
|
11
|
-
nodeState,
|
|
12
|
-
updateNode,
|
|
13
|
-
defaultFields,
|
|
14
|
-
defaultChecks,
|
|
15
|
-
}: ChildNodeProps) {
|
|
16
|
-
const [node, setNode] = nodeState;
|
|
17
|
-
|
|
18
|
-
React.useEffect(() => {
|
|
19
|
-
updateNode(node);
|
|
20
|
-
}, [node]);
|
|
21
|
-
|
|
22
|
-
function isValid(key: string, value: string) {
|
|
23
|
-
return true;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
27
|
-
|
|
28
|
-
const fields: FieldArrayType<DateNodeType> = [];
|
|
29
|
-
|
|
30
|
-
const checks: FieldArrayType<DateNodeType> = [];
|
|
31
|
-
|
|
32
|
-
return (
|
|
33
|
-
<>
|
|
34
|
-
<FieldContainer>
|
|
35
|
-
{defaultFields}
|
|
36
|
-
{fields.map((field) => (
|
|
37
|
-
<NodeField
|
|
38
|
-
key={field.prop}
|
|
39
|
-
field={field}
|
|
40
|
-
node={node}
|
|
41
|
-
update={updateNodeByKeyLocal}
|
|
42
|
-
{...field.props}
|
|
43
|
-
/>
|
|
44
|
-
))}
|
|
45
|
-
</FieldContainer>
|
|
46
|
-
<FieldContainer>
|
|
47
|
-
{defaultChecks}
|
|
48
|
-
{checks.map((check) => (
|
|
49
|
-
<NodeCheckbox
|
|
50
|
-
key={check.prop}
|
|
51
|
-
field={check}
|
|
52
|
-
node={node}
|
|
53
|
-
update={updateNodeByKeyLocal}
|
|
54
|
-
{...check.props}
|
|
55
|
-
/>
|
|
56
|
-
))}
|
|
57
|
-
</FieldContainer>
|
|
58
|
-
</>
|
|
59
|
-
);
|
|
60
|
-
}
|
|
1
|
+
import {
|
|
2
|
+
ChildNodeProps,
|
|
3
|
+
DateNode as DateNodeType,
|
|
4
|
+
FieldArrayType,
|
|
5
|
+
} from "../../../types/form-builder";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
+
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
+
|
|
10
|
+
export default function DateNode({
|
|
11
|
+
nodeState,
|
|
12
|
+
updateNode,
|
|
13
|
+
defaultFields,
|
|
14
|
+
defaultChecks,
|
|
15
|
+
}: ChildNodeProps) {
|
|
16
|
+
const [node, setNode] = nodeState;
|
|
17
|
+
|
|
18
|
+
React.useEffect(() => {
|
|
19
|
+
updateNode(node);
|
|
20
|
+
}, [node]);
|
|
21
|
+
|
|
22
|
+
function isValid(key: string, value: string) {
|
|
23
|
+
return true;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
27
|
+
|
|
28
|
+
const fields: FieldArrayType<DateNodeType> = [];
|
|
29
|
+
|
|
30
|
+
const checks: FieldArrayType<DateNodeType> = [];
|
|
31
|
+
|
|
32
|
+
return (
|
|
33
|
+
<>
|
|
34
|
+
<FieldContainer>
|
|
35
|
+
{defaultFields}
|
|
36
|
+
{fields.map((field) => (
|
|
37
|
+
<NodeField
|
|
38
|
+
key={field.prop}
|
|
39
|
+
field={field}
|
|
40
|
+
node={node}
|
|
41
|
+
update={updateNodeByKeyLocal}
|
|
42
|
+
{...field.props}
|
|
43
|
+
/>
|
|
44
|
+
))}
|
|
45
|
+
</FieldContainer>
|
|
46
|
+
<FieldContainer>
|
|
47
|
+
{defaultChecks}
|
|
48
|
+
{checks.map((check) => (
|
|
49
|
+
<NodeCheckbox
|
|
50
|
+
key={check.prop}
|
|
51
|
+
field={check}
|
|
52
|
+
node={node}
|
|
53
|
+
update={updateNodeByKeyLocal}
|
|
54
|
+
{...check.props}
|
|
55
|
+
/>
|
|
56
|
+
))}
|
|
57
|
+
</FieldContainer>
|
|
58
|
+
</>
|
|
59
|
+
);
|
|
60
|
+
}
|
|
@@ -1,67 +1,67 @@
|
|
|
1
|
-
import {
|
|
2
|
-
ChildNodeProps,
|
|
3
|
-
FieldArrayType,
|
|
4
|
-
FileNodeEmpty as FileNodeType,
|
|
5
|
-
} from "../../../types/form-builder";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
-
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
-
|
|
10
|
-
export default function FileNode({
|
|
11
|
-
nodeState,
|
|
12
|
-
updateNode,
|
|
13
|
-
defaultFields,
|
|
14
|
-
defaultChecks,
|
|
15
|
-
}: ChildNodeProps) {
|
|
16
|
-
const [node, setNode] = nodeState;
|
|
17
|
-
|
|
18
|
-
React.useEffect(() => {
|
|
19
|
-
updateNode(node);
|
|
20
|
-
}, [node]);
|
|
21
|
-
|
|
22
|
-
function isValid(key: string, value: string) {
|
|
23
|
-
return true;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
27
|
-
|
|
28
|
-
const fields: FieldArrayType<FileNodeType> = [
|
|
29
|
-
{
|
|
30
|
-
prop: "filetype",
|
|
31
|
-
tooltip: "Require a specific file type. Leave blank for any filetype.",
|
|
32
|
-
},
|
|
33
|
-
];
|
|
34
|
-
|
|
35
|
-
const checks: FieldArrayType<FileNodeType> = [
|
|
36
|
-
{ prop: "multiple", title: "Multiple Files" },
|
|
37
|
-
];
|
|
38
|
-
|
|
39
|
-
return (
|
|
40
|
-
<>
|
|
41
|
-
<FieldContainer>
|
|
42
|
-
{defaultFields}
|
|
43
|
-
{fields.map((field) => (
|
|
44
|
-
<NodeField
|
|
45
|
-
key={field.prop}
|
|
46
|
-
field={field}
|
|
47
|
-
node={node}
|
|
48
|
-
update={updateNodeByKeyLocal}
|
|
49
|
-
{...field.props}
|
|
50
|
-
/>
|
|
51
|
-
))}
|
|
52
|
-
</FieldContainer>
|
|
53
|
-
<FieldContainer>
|
|
54
|
-
{defaultChecks}
|
|
55
|
-
{checks.map((check) => (
|
|
56
|
-
<NodeCheckbox
|
|
57
|
-
key={check.prop}
|
|
58
|
-
field={check}
|
|
59
|
-
node={node}
|
|
60
|
-
update={updateNodeByKeyLocal}
|
|
61
|
-
{...check.props}
|
|
62
|
-
/>
|
|
63
|
-
))}
|
|
64
|
-
</FieldContainer>
|
|
65
|
-
</>
|
|
66
|
-
);
|
|
67
|
-
}
|
|
1
|
+
import {
|
|
2
|
+
ChildNodeProps,
|
|
3
|
+
FieldArrayType,
|
|
4
|
+
FileNodeEmpty as FileNodeType,
|
|
5
|
+
} from "../../../types/form-builder";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
+
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
+
|
|
10
|
+
export default function FileNode({
|
|
11
|
+
nodeState,
|
|
12
|
+
updateNode,
|
|
13
|
+
defaultFields,
|
|
14
|
+
defaultChecks,
|
|
15
|
+
}: ChildNodeProps) {
|
|
16
|
+
const [node, setNode] = nodeState;
|
|
17
|
+
|
|
18
|
+
React.useEffect(() => {
|
|
19
|
+
updateNode(node);
|
|
20
|
+
}, [node]);
|
|
21
|
+
|
|
22
|
+
function isValid(key: string, value: string) {
|
|
23
|
+
return true;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
27
|
+
|
|
28
|
+
const fields: FieldArrayType<FileNodeType> = [
|
|
29
|
+
{
|
|
30
|
+
prop: "filetype",
|
|
31
|
+
tooltip: "Require a specific file type. Leave blank for any filetype.",
|
|
32
|
+
},
|
|
33
|
+
];
|
|
34
|
+
|
|
35
|
+
const checks: FieldArrayType<FileNodeType> = [
|
|
36
|
+
{ prop: "multiple", title: "Multiple Files" },
|
|
37
|
+
];
|
|
38
|
+
|
|
39
|
+
return (
|
|
40
|
+
<>
|
|
41
|
+
<FieldContainer>
|
|
42
|
+
{defaultFields}
|
|
43
|
+
{fields.map((field) => (
|
|
44
|
+
<NodeField
|
|
45
|
+
key={field.prop}
|
|
46
|
+
field={field}
|
|
47
|
+
node={node}
|
|
48
|
+
update={updateNodeByKeyLocal}
|
|
49
|
+
{...field.props}
|
|
50
|
+
/>
|
|
51
|
+
))}
|
|
52
|
+
</FieldContainer>
|
|
53
|
+
<FieldContainer>
|
|
54
|
+
{defaultChecks}
|
|
55
|
+
{checks.map((check) => (
|
|
56
|
+
<NodeCheckbox
|
|
57
|
+
key={check.prop}
|
|
58
|
+
field={check}
|
|
59
|
+
node={node}
|
|
60
|
+
update={updateNodeByKeyLocal}
|
|
61
|
+
{...check.props}
|
|
62
|
+
/>
|
|
63
|
+
))}
|
|
64
|
+
</FieldContainer>
|
|
65
|
+
</>
|
|
66
|
+
);
|
|
67
|
+
}
|
|
@@ -1,60 +1,60 @@
|
|
|
1
|
-
import {
|
|
2
|
-
ChildNodeProps,
|
|
3
|
-
FieldArrayType,
|
|
4
|
-
IntegerNode as IntegerNodeType,
|
|
5
|
-
} from "../../../types/form-builder";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
-
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
-
|
|
10
|
-
export default function IntegerNode({
|
|
11
|
-
nodeState,
|
|
12
|
-
updateNode,
|
|
13
|
-
defaultFields,
|
|
14
|
-
defaultChecks,
|
|
15
|
-
}: ChildNodeProps) {
|
|
16
|
-
const [node, setNode] = nodeState;
|
|
17
|
-
|
|
18
|
-
React.useEffect(() => {
|
|
19
|
-
updateNode(node);
|
|
20
|
-
}, [node]);
|
|
21
|
-
|
|
22
|
-
function isValid(key: string, value: string) {
|
|
23
|
-
return true;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
27
|
-
|
|
28
|
-
const fields: FieldArrayType<IntegerNodeType> = [];
|
|
29
|
-
|
|
30
|
-
const checks: FieldArrayType<IntegerNodeType> = [];
|
|
31
|
-
|
|
32
|
-
return (
|
|
33
|
-
<>
|
|
34
|
-
<FieldContainer>
|
|
35
|
-
{defaultFields}
|
|
36
|
-
{fields.map((field) => (
|
|
37
|
-
<NodeField
|
|
38
|
-
key={field.prop}
|
|
39
|
-
field={field}
|
|
40
|
-
node={node}
|
|
41
|
-
update={updateNodeByKeyLocal}
|
|
42
|
-
{...field.props}
|
|
43
|
-
/>
|
|
44
|
-
))}
|
|
45
|
-
</FieldContainer>
|
|
46
|
-
<FieldContainer>
|
|
47
|
-
{defaultChecks}
|
|
48
|
-
{checks.map((check) => (
|
|
49
|
-
<NodeCheckbox
|
|
50
|
-
key={check.prop}
|
|
51
|
-
field={check}
|
|
52
|
-
node={node}
|
|
53
|
-
update={updateNodeByKeyLocal}
|
|
54
|
-
{...check.props}
|
|
55
|
-
/>
|
|
56
|
-
))}
|
|
57
|
-
</FieldContainer>
|
|
58
|
-
</>
|
|
59
|
-
);
|
|
60
|
-
}
|
|
1
|
+
import {
|
|
2
|
+
ChildNodeProps,
|
|
3
|
+
FieldArrayType,
|
|
4
|
+
IntegerNode as IntegerNodeType,
|
|
5
|
+
} from "../../../types/form-builder";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
+
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
+
|
|
10
|
+
export default function IntegerNode({
|
|
11
|
+
nodeState,
|
|
12
|
+
updateNode,
|
|
13
|
+
defaultFields,
|
|
14
|
+
defaultChecks,
|
|
15
|
+
}: ChildNodeProps) {
|
|
16
|
+
const [node, setNode] = nodeState;
|
|
17
|
+
|
|
18
|
+
React.useEffect(() => {
|
|
19
|
+
updateNode(node);
|
|
20
|
+
}, [node]);
|
|
21
|
+
|
|
22
|
+
function isValid(key: string, value: string) {
|
|
23
|
+
return true;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
27
|
+
|
|
28
|
+
const fields: FieldArrayType<IntegerNodeType> = [];
|
|
29
|
+
|
|
30
|
+
const checks: FieldArrayType<IntegerNodeType> = [];
|
|
31
|
+
|
|
32
|
+
return (
|
|
33
|
+
<>
|
|
34
|
+
<FieldContainer>
|
|
35
|
+
{defaultFields}
|
|
36
|
+
{fields.map((field) => (
|
|
37
|
+
<NodeField
|
|
38
|
+
key={field.prop}
|
|
39
|
+
field={field}
|
|
40
|
+
node={node}
|
|
41
|
+
update={updateNodeByKeyLocal}
|
|
42
|
+
{...field.props}
|
|
43
|
+
/>
|
|
44
|
+
))}
|
|
45
|
+
</FieldContainer>
|
|
46
|
+
<FieldContainer>
|
|
47
|
+
{defaultChecks}
|
|
48
|
+
{checks.map((check) => (
|
|
49
|
+
<NodeCheckbox
|
|
50
|
+
key={check.prop}
|
|
51
|
+
field={check}
|
|
52
|
+
node={node}
|
|
53
|
+
update={updateNodeByKeyLocal}
|
|
54
|
+
{...check.props}
|
|
55
|
+
/>
|
|
56
|
+
))}
|
|
57
|
+
</FieldContainer>
|
|
58
|
+
</>
|
|
59
|
+
);
|
|
60
|
+
}
|
|
@@ -1,67 +1,67 @@
|
|
|
1
|
-
import {
|
|
2
|
-
ChildNodeProps,
|
|
3
|
-
FieldArrayType,
|
|
4
|
-
ObjectNodeEmpty,
|
|
5
|
-
} from "../../../types/form-builder";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
-
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
-
import { Button } from "@mui/material";
|
|
10
|
-
|
|
11
|
-
export default function ObjectNode({
|
|
12
|
-
nodeState,
|
|
13
|
-
updateNode,
|
|
14
|
-
defaultFields,
|
|
15
|
-
defaultChecks,
|
|
16
|
-
updatePath,
|
|
17
|
-
}: ChildNodeProps) {
|
|
18
|
-
const [node, setNode] = nodeState;
|
|
19
|
-
|
|
20
|
-
React.useEffect(() => {
|
|
21
|
-
updateNode(node);
|
|
22
|
-
}, [node]);
|
|
23
|
-
|
|
24
|
-
function isValid(key: string, value: string) {
|
|
25
|
-
const n = node as ObjectNodeEmpty;
|
|
26
|
-
return true;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
30
|
-
|
|
31
|
-
const fields: FieldArrayType<ObjectNodeEmpty> = [];
|
|
32
|
-
|
|
33
|
-
const checks: FieldArrayType<ObjectNodeEmpty> = [];
|
|
34
|
-
|
|
35
|
-
return (
|
|
36
|
-
<>
|
|
37
|
-
<FieldContainer>
|
|
38
|
-
{defaultFields}
|
|
39
|
-
{fields.map((field) => (
|
|
40
|
-
<NodeField
|
|
41
|
-
key={field.prop}
|
|
42
|
-
field={field}
|
|
43
|
-
node={node}
|
|
44
|
-
update={updateNodeByKeyLocal}
|
|
45
|
-
{...field.props}
|
|
46
|
-
/>
|
|
47
|
-
))}
|
|
48
|
-
</FieldContainer>
|
|
49
|
-
<FieldContainer>
|
|
50
|
-
{defaultChecks}
|
|
51
|
-
{checks.map((check) => (
|
|
52
|
-
<NodeCheckbox
|
|
53
|
-
key={check.prop}
|
|
54
|
-
field={check}
|
|
55
|
-
node={node}
|
|
56
|
-
update={updateNodeByKeyLocal}
|
|
57
|
-
{...check.props}
|
|
58
|
-
/>
|
|
59
|
-
))}
|
|
60
|
-
</FieldContainer>
|
|
61
|
-
|
|
62
|
-
<Button onClick={updatePath} variant="contained" fullWidth>
|
|
63
|
-
Open
|
|
64
|
-
</Button>
|
|
65
|
-
</>
|
|
66
|
-
);
|
|
67
|
-
}
|
|
1
|
+
import {
|
|
2
|
+
ChildNodeProps,
|
|
3
|
+
FieldArrayType,
|
|
4
|
+
ObjectNodeEmpty,
|
|
5
|
+
} from "../../../types/form-builder";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
+
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
+
import { Button } from "@mui/material";
|
|
10
|
+
|
|
11
|
+
export default function ObjectNode({
|
|
12
|
+
nodeState,
|
|
13
|
+
updateNode,
|
|
14
|
+
defaultFields,
|
|
15
|
+
defaultChecks,
|
|
16
|
+
updatePath,
|
|
17
|
+
}: ChildNodeProps) {
|
|
18
|
+
const [node, setNode] = nodeState;
|
|
19
|
+
|
|
20
|
+
React.useEffect(() => {
|
|
21
|
+
updateNode(node);
|
|
22
|
+
}, [node]);
|
|
23
|
+
|
|
24
|
+
function isValid(key: string, value: string) {
|
|
25
|
+
const n = node as ObjectNodeEmpty;
|
|
26
|
+
return true;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
30
|
+
|
|
31
|
+
const fields: FieldArrayType<ObjectNodeEmpty> = [];
|
|
32
|
+
|
|
33
|
+
const checks: FieldArrayType<ObjectNodeEmpty> = [];
|
|
34
|
+
|
|
35
|
+
return (
|
|
36
|
+
<>
|
|
37
|
+
<FieldContainer>
|
|
38
|
+
{defaultFields}
|
|
39
|
+
{fields.map((field) => (
|
|
40
|
+
<NodeField
|
|
41
|
+
key={field.prop}
|
|
42
|
+
field={field}
|
|
43
|
+
node={node}
|
|
44
|
+
update={updateNodeByKeyLocal}
|
|
45
|
+
{...field.props}
|
|
46
|
+
/>
|
|
47
|
+
))}
|
|
48
|
+
</FieldContainer>
|
|
49
|
+
<FieldContainer>
|
|
50
|
+
{defaultChecks}
|
|
51
|
+
{checks.map((check) => (
|
|
52
|
+
<NodeCheckbox
|
|
53
|
+
key={check.prop}
|
|
54
|
+
field={check}
|
|
55
|
+
node={node}
|
|
56
|
+
update={updateNodeByKeyLocal}
|
|
57
|
+
{...check.props}
|
|
58
|
+
/>
|
|
59
|
+
))}
|
|
60
|
+
</FieldContainer>
|
|
61
|
+
|
|
62
|
+
<Button onClick={updatePath} variant="contained" fullWidth>
|
|
63
|
+
Open
|
|
64
|
+
</Button>
|
|
65
|
+
</>
|
|
66
|
+
);
|
|
67
|
+
}
|
|
@@ -1,66 +1,66 @@
|
|
|
1
|
-
import {
|
|
2
|
-
ChildNodeProps,
|
|
3
|
-
FieldArrayType,
|
|
4
|
-
TextNodeEmpty,
|
|
5
|
-
} from "../../../types/form-builder";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
-
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
-
|
|
10
|
-
export default function TextNode({
|
|
11
|
-
nodeState,
|
|
12
|
-
updateNode,
|
|
13
|
-
defaultFields,
|
|
14
|
-
defaultChecks,
|
|
15
|
-
}: ChildNodeProps) {
|
|
16
|
-
const [node, setNode] = nodeState;
|
|
17
|
-
|
|
18
|
-
React.useEffect(() => {
|
|
19
|
-
updateNode(node);
|
|
20
|
-
}, [node]);
|
|
21
|
-
|
|
22
|
-
function isValid(key: string, value: string) {
|
|
23
|
-
const n = node as TextNodeEmpty;
|
|
24
|
-
return true;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
28
|
-
|
|
29
|
-
const fields: FieldArrayType<TextNodeEmpty> = [
|
|
30
|
-
{ prop: "default" },
|
|
31
|
-
{ prop: "format" },
|
|
32
|
-
{ prop: "minLength", props: { type: "number" } },
|
|
33
|
-
{ prop: "maxLength", props: { type: "number" } },
|
|
34
|
-
];
|
|
35
|
-
|
|
36
|
-
const checks: FieldArrayType<TextNodeEmpty> = [];
|
|
37
|
-
|
|
38
|
-
return (
|
|
39
|
-
<>
|
|
40
|
-
<FieldContainer>
|
|
41
|
-
{defaultFields}
|
|
42
|
-
{fields.map((field) => (
|
|
43
|
-
<NodeField
|
|
44
|
-
key={field.prop}
|
|
45
|
-
field={field}
|
|
46
|
-
node={node}
|
|
47
|
-
update={updateNodeByKeyLocal}
|
|
48
|
-
{...field.props}
|
|
49
|
-
/>
|
|
50
|
-
))}
|
|
51
|
-
</FieldContainer>
|
|
52
|
-
<FieldContainer>
|
|
53
|
-
{defaultChecks}
|
|
54
|
-
{checks.map((check) => (
|
|
55
|
-
<NodeCheckbox
|
|
56
|
-
key={check.prop}
|
|
57
|
-
field={check}
|
|
58
|
-
node={node}
|
|
59
|
-
update={updateNodeByKeyLocal}
|
|
60
|
-
{...check.props}
|
|
61
|
-
/>
|
|
62
|
-
))}
|
|
63
|
-
</FieldContainer>
|
|
64
|
-
</>
|
|
65
|
-
);
|
|
66
|
-
}
|
|
1
|
+
import {
|
|
2
|
+
ChildNodeProps,
|
|
3
|
+
FieldArrayType,
|
|
4
|
+
TextNodeEmpty,
|
|
5
|
+
} from "../../../types/form-builder";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { FieldContainer, NodeCheckbox, NodeField } from "../node-child-helpers";
|
|
8
|
+
import { generateUpdateNodeByKeyLocal } from "../../../utils/form-builder";
|
|
9
|
+
|
|
10
|
+
export default function TextNode({
|
|
11
|
+
nodeState,
|
|
12
|
+
updateNode,
|
|
13
|
+
defaultFields,
|
|
14
|
+
defaultChecks,
|
|
15
|
+
}: ChildNodeProps) {
|
|
16
|
+
const [node, setNode] = nodeState;
|
|
17
|
+
|
|
18
|
+
React.useEffect(() => {
|
|
19
|
+
updateNode(node);
|
|
20
|
+
}, [node]);
|
|
21
|
+
|
|
22
|
+
function isValid(key: string, value: string) {
|
|
23
|
+
const n = node as TextNodeEmpty;
|
|
24
|
+
return true;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
const updateNodeByKeyLocal = generateUpdateNodeByKeyLocal(isValid, setNode);
|
|
28
|
+
|
|
29
|
+
const fields: FieldArrayType<TextNodeEmpty> = [
|
|
30
|
+
{ prop: "default" },
|
|
31
|
+
{ prop: "format" },
|
|
32
|
+
{ prop: "minLength", props: { type: "number" } },
|
|
33
|
+
{ prop: "maxLength", props: { type: "number" } },
|
|
34
|
+
];
|
|
35
|
+
|
|
36
|
+
const checks: FieldArrayType<TextNodeEmpty> = [];
|
|
37
|
+
|
|
38
|
+
return (
|
|
39
|
+
<>
|
|
40
|
+
<FieldContainer>
|
|
41
|
+
{defaultFields}
|
|
42
|
+
{fields.map((field) => (
|
|
43
|
+
<NodeField
|
|
44
|
+
key={field.prop}
|
|
45
|
+
field={field}
|
|
46
|
+
node={node}
|
|
47
|
+
update={updateNodeByKeyLocal}
|
|
48
|
+
{...field.props}
|
|
49
|
+
/>
|
|
50
|
+
))}
|
|
51
|
+
</FieldContainer>
|
|
52
|
+
<FieldContainer>
|
|
53
|
+
{defaultChecks}
|
|
54
|
+
{checks.map((check) => (
|
|
55
|
+
<NodeCheckbox
|
|
56
|
+
key={check.prop}
|
|
57
|
+
field={check}
|
|
58
|
+
node={node}
|
|
59
|
+
update={updateNodeByKeyLocal}
|
|
60
|
+
{...check.props}
|
|
61
|
+
/>
|
|
62
|
+
))}
|
|
63
|
+
</FieldContainer>
|
|
64
|
+
</>
|
|
65
|
+
);
|
|
66
|
+
}
|