@springmicro/forms 0.7.5 → 0.7.6
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/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/index.tsx +26 -26
- 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/index.tsx
CHANGED
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
import widgets from "./widgets";
|
|
2
|
-
import templates from "./templates";
|
|
3
|
-
import fields from "./fields";
|
|
4
|
-
import { ThemeProps, withTheme } from "@rjsf/core";
|
|
5
|
-
import type { IChangeEvent } from "@rjsf/core";
|
|
6
|
-
import type { RJSFSchema } from "@rjsf/utils";
|
|
7
|
-
import validator from "@rjsf/validator-ajv8";
|
|
8
|
-
import { emailOnlySG, emailOnlySGJSON } from "@springmicro/utils/forms";
|
|
9
|
-
|
|
10
|
-
const rjsfDaisyUiTheme: ThemeProps = {
|
|
11
|
-
fields,
|
|
12
|
-
templates,
|
|
13
|
-
widgets,
|
|
14
|
-
};
|
|
15
|
-
|
|
16
|
-
const BaseForm = withTheme(rjsfDaisyUiTheme);
|
|
17
|
-
|
|
18
|
-
export {
|
|
19
|
-
rjsfDaisyUiTheme,
|
|
20
|
-
IChangeEvent,
|
|
21
|
-
RJSFSchema,
|
|
22
|
-
validator,
|
|
23
|
-
BaseForm,
|
|
24
|
-
emailOnlySG,
|
|
25
|
-
emailOnlySGJSON,
|
|
26
|
-
};
|
|
1
|
+
import widgets from "./widgets";
|
|
2
|
+
import templates from "./templates";
|
|
3
|
+
import fields from "./fields";
|
|
4
|
+
import { ThemeProps, withTheme } from "@rjsf/core";
|
|
5
|
+
import type { IChangeEvent } from "@rjsf/core";
|
|
6
|
+
import type { RJSFSchema } from "@rjsf/utils";
|
|
7
|
+
import validator from "@rjsf/validator-ajv8";
|
|
8
|
+
import { emailOnlySG, emailOnlySGJSON } from "@springmicro/utils/forms";
|
|
9
|
+
|
|
10
|
+
const rjsfDaisyUiTheme: ThemeProps = {
|
|
11
|
+
fields,
|
|
12
|
+
templates,
|
|
13
|
+
widgets,
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
const BaseForm = withTheme(rjsfDaisyUiTheme);
|
|
17
|
+
|
|
18
|
+
export {
|
|
19
|
+
rjsfDaisyUiTheme,
|
|
20
|
+
IChangeEvent,
|
|
21
|
+
RJSFSchema,
|
|
22
|
+
validator,
|
|
23
|
+
BaseForm,
|
|
24
|
+
emailOnlySG,
|
|
25
|
+
emailOnlySGJSON,
|
|
26
|
+
};
|
|
@@ -1,135 +1,135 @@
|
|
|
1
|
-
import { UseStateType } from "./utils.type";
|
|
2
|
-
|
|
3
|
-
export type FullFormType = {
|
|
4
|
-
form: FormType;
|
|
5
|
-
nodes: FormNodeType[];
|
|
6
|
-
};
|
|
7
|
-
|
|
8
|
-
export type FormType = {
|
|
9
|
-
title?: string;
|
|
10
|
-
description?: string;
|
|
11
|
-
};
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Extracts each key from @type {FormNodeTypes} exctracting the string from @param {T["type"]}
|
|
15
|
-
* which is then mapped to @type {FormNodeKeys}
|
|
16
|
-
*/
|
|
17
|
-
type ExtractTypes<T extends { type: string }> = T["type"];
|
|
18
|
-
export type FormNodeKeys = ExtractTypes<FormNodeType>;
|
|
19
|
-
|
|
20
|
-
export type SearchNodeTypeByKey = {
|
|
21
|
-
[key in FormNodeKeys]: FormNodeType extends { type: infer T }
|
|
22
|
-
? T extends key
|
|
23
|
-
? FormNodeType
|
|
24
|
-
: never
|
|
25
|
-
: never;
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
export interface BaseNode {
|
|
29
|
-
nodeId: string;
|
|
30
|
-
propertyName?: string;
|
|
31
|
-
title?: string;
|
|
32
|
-
description?: string;
|
|
33
|
-
required?: boolean;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
/**
|
|
37
|
-
* =================== NODES ===================
|
|
38
|
-
*/
|
|
39
|
-
|
|
40
|
-
export type FormNodeType =
|
|
41
|
-
| FileNode
|
|
42
|
-
| TextNode
|
|
43
|
-
| IntegerNode
|
|
44
|
-
| DateNode
|
|
45
|
-
| ArrayNode
|
|
46
|
-
| ObjectNode;
|
|
47
|
-
|
|
48
|
-
export type TextNode = BaseNode & TextNodeEmpty;
|
|
49
|
-
|
|
50
|
-
export type FileNode = BaseNode & FileNodeEmpty;
|
|
51
|
-
|
|
52
|
-
export type IntegerNode = BaseNode & IntegerNodeEmpty;
|
|
53
|
-
|
|
54
|
-
export type DateNode = BaseNode & DateNodeEmpty;
|
|
55
|
-
|
|
56
|
-
export type ArrayNode = BaseNode & ArrayNodeEmpty;
|
|
57
|
-
|
|
58
|
-
export type ObjectNode = BaseNode & ObjectNodeEmpty;
|
|
59
|
-
|
|
60
|
-
/**
|
|
61
|
-
* =================== NODES ===================
|
|
62
|
-
*/
|
|
63
|
-
|
|
64
|
-
export type EmptyFormNodeType =
|
|
65
|
-
| FileNodeEmpty
|
|
66
|
-
| TextNodeEmpty
|
|
67
|
-
| IntegerNodeEmpty
|
|
68
|
-
| DateNodeEmpty
|
|
69
|
-
| ArrayNodeEmpty
|
|
70
|
-
| ObjectNodeEmpty;
|
|
71
|
-
|
|
72
|
-
export interface TextNodeEmpty {
|
|
73
|
-
type: "string";
|
|
74
|
-
default?: string;
|
|
75
|
-
minLength?: number;
|
|
76
|
-
maxLength?: number;
|
|
77
|
-
format?: string;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
export interface FileNodeEmpty {
|
|
81
|
-
type: "file";
|
|
82
|
-
multiple?: boolean;
|
|
83
|
-
filetype?: string;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
export interface IntegerNodeEmpty {
|
|
87
|
-
type: "integer";
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
export interface DateNodeEmpty {
|
|
91
|
-
type: "date";
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
export interface ArrayNodeEmpty {
|
|
95
|
-
type: "array";
|
|
96
|
-
child: EmptyFormNodeType;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
export interface ObjectNodeEmpty {
|
|
100
|
-
type: "object";
|
|
101
|
-
children: FormNodeType[]; // a list of nodes
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
/**
|
|
105
|
-
* ================== UTILS ==================
|
|
106
|
-
*/
|
|
107
|
-
|
|
108
|
-
export type CountdownType =
|
|
109
|
-
| undefined
|
|
110
|
-
| number
|
|
111
|
-
| "Saved."
|
|
112
|
-
| "Saving..."
|
|
113
|
-
| "Save failed.";
|
|
114
|
-
|
|
115
|
-
export type EditingStateType = false | string;
|
|
116
|
-
|
|
117
|
-
// The format for creating a field or checkmark inside a node.
|
|
118
|
-
export type FieldArrayType<T> = Array<{
|
|
119
|
-
prop: keyof T;
|
|
120
|
-
tooltip?: string;
|
|
121
|
-
title?: string;
|
|
122
|
-
props?: any;
|
|
123
|
-
}>;
|
|
124
|
-
|
|
125
|
-
/**
|
|
126
|
-
* ================== SHARED PROPS ==================
|
|
127
|
-
*/
|
|
128
|
-
|
|
129
|
-
export type ChildNodeProps = {
|
|
130
|
-
nodeState: UseStateType<FormNodeType>;
|
|
131
|
-
updateNode: (nodeData: FormNodeType) => void;
|
|
132
|
-
defaultFields: React.JSX.Element[];
|
|
133
|
-
defaultChecks: React.JSX.Element[];
|
|
134
|
-
updatePath: () => void;
|
|
135
|
-
};
|
|
1
|
+
import { UseStateType } from "./utils.type";
|
|
2
|
+
|
|
3
|
+
export type FullFormType = {
|
|
4
|
+
form: FormType;
|
|
5
|
+
nodes: FormNodeType[];
|
|
6
|
+
};
|
|
7
|
+
|
|
8
|
+
export type FormType = {
|
|
9
|
+
title?: string;
|
|
10
|
+
description?: string;
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* Extracts each key from @type {FormNodeTypes} exctracting the string from @param {T["type"]}
|
|
15
|
+
* which is then mapped to @type {FormNodeKeys}
|
|
16
|
+
*/
|
|
17
|
+
type ExtractTypes<T extends { type: string }> = T["type"];
|
|
18
|
+
export type FormNodeKeys = ExtractTypes<FormNodeType>;
|
|
19
|
+
|
|
20
|
+
export type SearchNodeTypeByKey = {
|
|
21
|
+
[key in FormNodeKeys]: FormNodeType extends { type: infer T }
|
|
22
|
+
? T extends key
|
|
23
|
+
? FormNodeType
|
|
24
|
+
: never
|
|
25
|
+
: never;
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
export interface BaseNode {
|
|
29
|
+
nodeId: string;
|
|
30
|
+
propertyName?: string;
|
|
31
|
+
title?: string;
|
|
32
|
+
description?: string;
|
|
33
|
+
required?: boolean;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
/**
|
|
37
|
+
* =================== NODES ===================
|
|
38
|
+
*/
|
|
39
|
+
|
|
40
|
+
export type FormNodeType =
|
|
41
|
+
| FileNode
|
|
42
|
+
| TextNode
|
|
43
|
+
| IntegerNode
|
|
44
|
+
| DateNode
|
|
45
|
+
| ArrayNode
|
|
46
|
+
| ObjectNode;
|
|
47
|
+
|
|
48
|
+
export type TextNode = BaseNode & TextNodeEmpty;
|
|
49
|
+
|
|
50
|
+
export type FileNode = BaseNode & FileNodeEmpty;
|
|
51
|
+
|
|
52
|
+
export type IntegerNode = BaseNode & IntegerNodeEmpty;
|
|
53
|
+
|
|
54
|
+
export type DateNode = BaseNode & DateNodeEmpty;
|
|
55
|
+
|
|
56
|
+
export type ArrayNode = BaseNode & ArrayNodeEmpty;
|
|
57
|
+
|
|
58
|
+
export type ObjectNode = BaseNode & ObjectNodeEmpty;
|
|
59
|
+
|
|
60
|
+
/**
|
|
61
|
+
* =================== NODES ===================
|
|
62
|
+
*/
|
|
63
|
+
|
|
64
|
+
export type EmptyFormNodeType =
|
|
65
|
+
| FileNodeEmpty
|
|
66
|
+
| TextNodeEmpty
|
|
67
|
+
| IntegerNodeEmpty
|
|
68
|
+
| DateNodeEmpty
|
|
69
|
+
| ArrayNodeEmpty
|
|
70
|
+
| ObjectNodeEmpty;
|
|
71
|
+
|
|
72
|
+
export interface TextNodeEmpty {
|
|
73
|
+
type: "string";
|
|
74
|
+
default?: string;
|
|
75
|
+
minLength?: number;
|
|
76
|
+
maxLength?: number;
|
|
77
|
+
format?: string;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
export interface FileNodeEmpty {
|
|
81
|
+
type: "file";
|
|
82
|
+
multiple?: boolean;
|
|
83
|
+
filetype?: string;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
export interface IntegerNodeEmpty {
|
|
87
|
+
type: "integer";
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
export interface DateNodeEmpty {
|
|
91
|
+
type: "date";
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
export interface ArrayNodeEmpty {
|
|
95
|
+
type: "array";
|
|
96
|
+
child: EmptyFormNodeType;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
export interface ObjectNodeEmpty {
|
|
100
|
+
type: "object";
|
|
101
|
+
children: FormNodeType[]; // a list of nodes
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
/**
|
|
105
|
+
* ================== UTILS ==================
|
|
106
|
+
*/
|
|
107
|
+
|
|
108
|
+
export type CountdownType =
|
|
109
|
+
| undefined
|
|
110
|
+
| number
|
|
111
|
+
| "Saved."
|
|
112
|
+
| "Saving..."
|
|
113
|
+
| "Save failed.";
|
|
114
|
+
|
|
115
|
+
export type EditingStateType = false | string;
|
|
116
|
+
|
|
117
|
+
// The format for creating a field or checkmark inside a node.
|
|
118
|
+
export type FieldArrayType<T> = Array<{
|
|
119
|
+
prop: keyof T;
|
|
120
|
+
tooltip?: string;
|
|
121
|
+
title?: string;
|
|
122
|
+
props?: any;
|
|
123
|
+
}>;
|
|
124
|
+
|
|
125
|
+
/**
|
|
126
|
+
* ================== SHARED PROPS ==================
|
|
127
|
+
*/
|
|
128
|
+
|
|
129
|
+
export type ChildNodeProps = {
|
|
130
|
+
nodeState: UseStateType<FormNodeType>;
|
|
131
|
+
updateNode: (nodeData: FormNodeType) => void;
|
|
132
|
+
defaultFields: React.JSX.Element[];
|
|
133
|
+
defaultChecks: React.JSX.Element[];
|
|
134
|
+
updatePath: () => void;
|
|
135
|
+
};
|
package/src/types/utils.type.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export type UseStateType<T> = [T, React.Dispatch<React.SetStateAction<T>>];
|
|
1
|
+
export type UseStateType<T> = [T, React.Dispatch<React.SetStateAction<T>>];
|