autoforma 1.0.65 → 1.0.67
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/README.md +211 -157
- package/dist/components/AutoForm/AutoForm.d.ts +17 -0
- package/dist/components/AutoForm/AutoForm.types.d.ts +38 -0
- package/dist/components/AutoForm/index.d.ts +0 -0
- package/dist/fields/FieldRenderer/DefaultFieldRender.d.ts +10 -0
- package/dist/fields/FieldRenderer/FieldLayoutWrapper.d.ts +9 -0
- package/dist/fields/FieldRenderer/FieldRenderer.d.ts +3 -0
- package/dist/fields/FieldRenderer/FieldRenderer.types.d.ts +7 -0
- package/dist/fields/context/RenderersContext.d.ts +7 -0
- package/dist/fields/handlers/BuiltInHandler.d.ts +9 -0
- package/dist/fields/handlers/CustomTypeRendererResolver.d.ts +10 -0
- package/dist/fields/handlers/FieldNameHandler.d.ts +10 -0
- package/dist/fields/handlers/FieldTypeHandler.d.ts +10 -0
- package/dist/fields/handlers/RendererHandler.d.ts +10 -0
- package/dist/fields/renderer.types.d.ts +12 -0
- package/dist/fields/renderers/ArrayFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/CheckBoxFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/DateFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/DateTimeFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/NumberFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/ObjectFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/RichTextEditorFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/SelectFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/SwitchFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/TagsFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/TextFieldRenderer.d.ts +4 -0
- package/dist/fields/renderers/TimeFieldRenderer.d.ts +4 -0
- package/dist/fields/resolver/FieldRendererResolver.d.ts +3 -0
- package/dist/fields/types.d.ts +58 -0
- package/dist/fields/utils/layout.utils.d.ts +5 -0
- package/dist/fields/utils/values.utils.d.ts +4 -0
- package/dist/index.cjs.js +178 -62
- package/dist/index.d.ts +8 -2
- package/dist/index.es.js +22981 -13218
- package/package.json +47 -10
- package/dist/components/AutoForm.d.ts +0 -18
- package/dist/components/FieldRender.d.ts +0 -16
- package/dist/components/fields/ArrayField.d.ts +0 -13
- package/dist/components/fields/CheckField.d.ts +0 -7
- package/dist/components/fields/DateField.d.ts +0 -6
- package/dist/components/fields/DateTimeField.d.ts +0 -6
- package/dist/components/fields/NumberField.d.ts +0 -6
- package/dist/components/fields/ObjectField.d.ts +0 -9
- package/dist/components/fields/SelectField.d.ts +0 -10
- package/dist/components/fields/TextAreaField.d.ts +0 -6
- package/dist/components/fields/TextField.d.ts +0 -6
- package/dist/components/fields/TimeField.d.ts +0 -6
- package/dist/types/custom-render.d.ts +0 -11
- package/dist/types/field.d.ts +0 -30
- package/dist/types/form.d.ts +0 -7
package/README.md
CHANGED
|
@@ -1,157 +1,211 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
-
|
|
9
|
-
-
|
|
10
|
-
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
## Installation
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
```bash
|
|
21
|
-
npm install @mantine/core
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
import
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
1
|
+
# 🚀 Introduction
|
|
2
|
+
|
|
3
|
+
**AutoForma** is a modern, dynamic, and extensible **form builder for React** — built on top of [Mantine](https://mantine.dev/) and fully written in TypeScript.
|
|
4
|
+
It allows you to create powerful forms **entirely from JSON schema definitions**, removing repetitive boilerplate code and giving you full control over field behavior and layout.
|
|
5
|
+
|
|
6
|
+
With AutoForma, you can:
|
|
7
|
+
- 🧩 Define forms using schema objects — no manual wiring.
|
|
8
|
+
- 🪄 Dynamically show, hide, or disable fields based on other values.
|
|
9
|
+
- 🎨 Customize the UI with your own field renderers.
|
|
10
|
+
- 🧠 Extend with new field types or layouts effortlessly.
|
|
11
|
+
|
|
12
|
+
> 💡 AutoForma is perfect for dashboards, admin panels, and SaaS apps where flexibility and maintainability matter.
|
|
13
|
+
|
|
14
|
+
---
|
|
15
|
+
|
|
16
|
+
## 📦 Installation
|
|
17
|
+
|
|
18
|
+
Install **AutoForma** along with its required Mantine and React peer dependencies:
|
|
19
|
+
|
|
20
|
+
```bash
|
|
21
|
+
npm install autoforma @mantine/core@^8.3.2 @mantine/hooks@^8.3.2 @mantine/form@^8.3.2 @mantine/dates@^8.3.2 @mantine/tiptap@^8.3.2 @tiptap/react@^3.6.6 react@^19.0.0 react-dom@^19.0.0
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
---
|
|
25
|
+
|
|
26
|
+
## ⚙️ Setup Requirements
|
|
27
|
+
|
|
28
|
+
Before using `AutoForma`, wrap your app with the `MantineProvider`
|
|
29
|
+
and import Mantine’s global styles and optional TipTap editor styles:
|
|
30
|
+
|
|
31
|
+
```tsx
|
|
32
|
+
import { MantineProvider } from "@mantine/core";
|
|
33
|
+
import "@mantine/core/styles.css";
|
|
34
|
+
import "@mantine/dates/styles.css";
|
|
35
|
+
import "@mantine/tiptap/styles.css";
|
|
36
|
+
|
|
37
|
+
const Root = () => (
|
|
38
|
+
<MantineProvider>
|
|
39
|
+
<App />
|
|
40
|
+
</MantineProvider>
|
|
41
|
+
);
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
> ⚠️ Without wrapping your app in `MantineProvider`,
|
|
45
|
+
> the components may not render or style correctly.
|
|
46
|
+
|
|
47
|
+
---
|
|
48
|
+
|
|
49
|
+
# 🧩 Basic Usage
|
|
50
|
+
|
|
51
|
+
Here’s a quick example of how you can generate a complete form instantly using **AutoForma**.
|
|
52
|
+
Just define your schema and pass it to the `AutoForm` component — it handles layout, validation, and submission automatically.
|
|
53
|
+
|
|
54
|
+
```tsx
|
|
55
|
+
import AutoForm from "autoforma";
|
|
56
|
+
import { userFormSchema } from "./schema";
|
|
57
|
+
|
|
58
|
+
const App = () => (
|
|
59
|
+
<AutoForm
|
|
60
|
+
schema={userFormSchema}
|
|
61
|
+
onSubmit={(values) => console.log("Submitted:", values)}
|
|
62
|
+
/>
|
|
63
|
+
);
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
> ✅ AutoForma automatically generates labels, validation, and layouts based on your schema.
|
|
67
|
+
|
|
68
|
+
---
|
|
69
|
+
|
|
70
|
+
# 🎨 Customization & Field Types
|
|
71
|
+
|
|
72
|
+
AutoForma gives you full control over how your form behaves and looks.
|
|
73
|
+
You can **dynamically update field properties** (like visibility, enabled state, or placeholder)
|
|
74
|
+
and even **inject your own custom field types** using `customFieldTypes`.
|
|
75
|
+
|
|
76
|
+
---
|
|
77
|
+
|
|
78
|
+
## 🧠 Supported Field Types
|
|
79
|
+
|
|
80
|
+
Out of the box, AutoForma supports a rich set of field types:
|
|
81
|
+
|
|
82
|
+
| Type | Description |
|
|
83
|
+
|------|--------------|
|
|
84
|
+
| `text` | Standard text input |
|
|
85
|
+
| `number` | Numeric input |
|
|
86
|
+
| `select` | Dropdown list |
|
|
87
|
+
| `checkbox` | Boolean checkbox |
|
|
88
|
+
| `date` | Date picker |
|
|
89
|
+
| `datetime` | Combined date & time picker |
|
|
90
|
+
| `time` | Time-only picker |
|
|
91
|
+
| `object` | Nested object field (grouped sub-fields) |
|
|
92
|
+
| `array` | Repeating array of fields |
|
|
93
|
+
| `switch` | Toggle switch |
|
|
94
|
+
| `texteditor` | Rich text editor (TipTap powered) |
|
|
95
|
+
| `tags` | Multi-value tag input |
|
|
96
|
+
| `TCustom` | Any custom type you define via `customFieldTypes` |
|
|
97
|
+
|
|
98
|
+
You can define your own type like this:
|
|
99
|
+
|
|
100
|
+
```tsx
|
|
101
|
+
<AutoForm
|
|
102
|
+
schema={schema}
|
|
103
|
+
customFieldTypes={{
|
|
104
|
+
colorPicker: (field, form) => (
|
|
105
|
+
<input
|
|
106
|
+
type="color"
|
|
107
|
+
{...form.getInputProps(field.name)}
|
|
108
|
+
/>
|
|
109
|
+
),
|
|
110
|
+
}}
|
|
111
|
+
/>
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
---
|
|
115
|
+
|
|
116
|
+
# ⚙️ API Reference
|
|
117
|
+
|
|
118
|
+
AutoForma exposes several TypeScript interfaces and configuration objects that make it fully type-safe and flexible.
|
|
119
|
+
Below are the main types you can use to configure and extend the library.
|
|
120
|
+
|
|
121
|
+
## 🧩 `AutoFormProps<TValues>`
|
|
122
|
+
|
|
123
|
+
The main props accepted by the `AutoForm` component.
|
|
124
|
+
|
|
125
|
+
```ts
|
|
126
|
+
export type AutoFormProps<
|
|
127
|
+
TValues extends Record<string, any> = Record<string, any>
|
|
128
|
+
> = CustomRenderersConfig<TValues> & {
|
|
129
|
+
schema: (FieldSchema<TValues> & Record<string, any>)[];
|
|
130
|
+
|
|
131
|
+
initialValues?: ValueProvider<TValues>;
|
|
132
|
+
currentValues?: ValueProvider<TValues>;
|
|
133
|
+
|
|
134
|
+
prepareValues?: (values: TValues) => TValues | Promise<TValues>;
|
|
135
|
+
onSubmit: (values: TValues) => void | Promise<void>;
|
|
136
|
+
afterSubmit?: (values: TValues) => void | Promise<void>;
|
|
137
|
+
|
|
138
|
+
validate?: FormValidateInput<TValues>;
|
|
139
|
+
readOnly?: boolean;
|
|
140
|
+
|
|
141
|
+
onFieldChange?: OnFieldChangeMap<TValues>;
|
|
142
|
+
|
|
143
|
+
layout?: "vertical" | "horizontal" | "grid";
|
|
144
|
+
|
|
145
|
+
updateFieldSchema?: UpdateFieldSchemaMap<TValues>;
|
|
146
|
+
|
|
147
|
+
submitButton?: boolean | React.ReactNode;
|
|
148
|
+
|
|
149
|
+
loading?: boolean;
|
|
150
|
+
};
|
|
151
|
+
```
|
|
152
|
+
|
|
153
|
+
### 🧠 Description of Properties
|
|
154
|
+
|
|
155
|
+
| Prop | Type | Description |
|
|
156
|
+
|------|------|--------------|
|
|
157
|
+
| `schema` | `FieldSchema[]` | The main schema defining all form fields. |
|
|
158
|
+
| `initialValues` | `ValueProvider<TValues>` | Function or object returning the **initial form values** (called once). |
|
|
159
|
+
| `currentValues` | `ValueProvider<TValues>` | Function or object providing **current values** (reactively updated). |
|
|
160
|
+
| `prepareValues` | `(values) => TValues \| Promise<TValues>` | Modify or sanitize values before submit. |
|
|
161
|
+
| `onSubmit` | `(values) => void \| Promise<void>` | Called when the form is submitted. |
|
|
162
|
+
| `afterSubmit` | `(values) => void \| Promise<void>` | Called after successful submission (for side effects). |
|
|
163
|
+
| `validate` | `FormValidateInput<TValues>` | Mantine validation config or validation schema. |
|
|
164
|
+
| `readOnly` | `boolean` | Makes the entire form read-only. |
|
|
165
|
+
| `onFieldChange` | `OnFieldChangeMap<TValues>` | Map of field-specific change handlers. |
|
|
166
|
+
| `layout` | `"vertical" \| "horizontal" \| "grid"` | Form layout type. |
|
|
167
|
+
| `updateFieldSchema` | `UpdateFieldSchemaMap<TValues>` | Dynamically modify schema based on values. |
|
|
168
|
+
| `submitButton` | `boolean \| ReactNode` | Whether to render or customize the submit button. |
|
|
169
|
+
| `loading` | `boolean` | Display a global loading state for the form. |
|
|
170
|
+
|
|
171
|
+
---
|
|
172
|
+
|
|
173
|
+
## 🧩 `CustomRenderersConfig<TValues>`
|
|
174
|
+
|
|
175
|
+
Defines all the ways you can override the default rendering logic.
|
|
176
|
+
|
|
177
|
+
```ts
|
|
178
|
+
export type CustomRenderersConfig<
|
|
179
|
+
TValues extends Record<string, any> = Record<string, any>
|
|
180
|
+
> = {
|
|
181
|
+
customFieldRenderers?: Record<
|
|
182
|
+
string,
|
|
183
|
+
(
|
|
184
|
+
field: FieldSchema<TValues>,
|
|
185
|
+
form: UseFormReturnType<TValues>
|
|
186
|
+
) => React.ReactNode
|
|
187
|
+
>;
|
|
188
|
+
customTypeRenderers?: Record<
|
|
189
|
+
string,
|
|
190
|
+
(
|
|
191
|
+
field: FieldSchema<TValues>,
|
|
192
|
+
form: UseFormReturnType<TValues>
|
|
193
|
+
) => React.ReactNode
|
|
194
|
+
>;
|
|
195
|
+
customFieldTypes?: Record<
|
|
196
|
+
string,
|
|
197
|
+
(
|
|
198
|
+
field: FieldSchema<TValues>,
|
|
199
|
+
form: UseFormReturnType<TValues>
|
|
200
|
+
) => React.ReactNode
|
|
201
|
+
>;
|
|
202
|
+
};
|
|
203
|
+
```
|
|
204
|
+
|
|
205
|
+
### 🧠 Description of Properties
|
|
206
|
+
|
|
207
|
+
| Prop | Type | Description |
|
|
208
|
+
|------|------|--------------|
|
|
209
|
+
| `customFieldRenderers` | `Record<string, (field, form) => ReactNode>` | Override rendering for specific **field names**. |
|
|
210
|
+
| `customTypeRenderers` | `Record<string, (field, form) => ReactNode>` | Override rendering for specific **field types** (like `select`, `text`, etc.). |
|
|
211
|
+
| `customFieldTypes` | `Record<string, (field, form) => ReactNode>` | Register completely new **custom field types**. |
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { AutoFormRef } from './AutoForm.types';
|
|
2
|
+
export declare const AutoForm: import('react').ForwardRefExoticComponent<import('../../fields/renderer.types').CustomRenderersConfig<Record<string, any>> & {
|
|
3
|
+
schema: (import('../..').FieldSchema<Record<string, any>> & Record<string, any>)[];
|
|
4
|
+
initialValues?: (() => Partial<Record<string, any>> | Promise<Partial<Record<string, any>>>) | undefined;
|
|
5
|
+
currentValues?: (() => Partial<Record<string, any>> | Promise<Partial<Record<string, any>>>) | undefined;
|
|
6
|
+
prepareValues?: ((values: Record<string, any>) => Record<string, any> | Promise<Record<string, any>>) | undefined;
|
|
7
|
+
onSubmit: (values: Record<string, any>) => void | Promise<void>;
|
|
8
|
+
afterSubmit?: ((values: Record<string, any>) => void | Promise<void>) | undefined;
|
|
9
|
+
validate?: import('@mantine/form').FormValidateInput<Record<string, any>> | undefined;
|
|
10
|
+
readOnly?: boolean;
|
|
11
|
+
onFieldChange?: import('./AutoForm.types').OnFieldChangeMap<Record<string, any>> | undefined;
|
|
12
|
+
layout?: "vertical" | "horizontal" | "grid";
|
|
13
|
+
updateFieldSchema?: import('./AutoForm.types').UpdateFieldSchemaMap<Record<string, any>> | undefined;
|
|
14
|
+
submitButton?: boolean | React.ReactNode;
|
|
15
|
+
loading?: boolean;
|
|
16
|
+
} & import('react').RefAttributes<AutoFormRef<Record<string, any>>>>;
|
|
17
|
+
export default AutoForm;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { CustomRenderersConfig } from '../../fields/renderer.types';
|
|
2
|
+
import { FieldSchema } from '../../fields/types';
|
|
3
|
+
import { FormValidateInput, UseFormReturnType } from '@mantine/form';
|
|
4
|
+
type ValueProvider<TValues> = () => Partial<TValues> | Promise<Partial<TValues>>;
|
|
5
|
+
export type AutoFormProps<TValues extends Record<string, any> = Record<string, any>> = CustomRenderersConfig<TValues> & {
|
|
6
|
+
schema: (FieldSchema<TValues> & Record<string, any>)[];
|
|
7
|
+
initialValues?: ValueProvider<TValues>;
|
|
8
|
+
currentValues?: ValueProvider<TValues>;
|
|
9
|
+
prepareValues?: (values: TValues) => TValues | Promise<TValues>;
|
|
10
|
+
onSubmit: (values: TValues) => void | Promise<void>;
|
|
11
|
+
afterSubmit?: (values: TValues) => void | Promise<void>;
|
|
12
|
+
validate?: FormValidateInput<TValues>;
|
|
13
|
+
readOnly?: boolean;
|
|
14
|
+
onFieldChange?: OnFieldChangeMap<TValues>;
|
|
15
|
+
layout?: "vertical" | "horizontal" | "grid";
|
|
16
|
+
updateFieldSchema?: UpdateFieldSchemaMap<TValues>;
|
|
17
|
+
submitButton?: boolean | React.ReactNode;
|
|
18
|
+
loading?: boolean;
|
|
19
|
+
};
|
|
20
|
+
export type UpdateFieldSchemaMap<TValues extends Record<string, any> = Record<string, any>> = {
|
|
21
|
+
[K in keyof TValues]?: (schema: FieldSchema<TValues>, values: TValues) => FieldSchema<TValues>;
|
|
22
|
+
};
|
|
23
|
+
export type OnFieldChangeMap<TValues extends Record<string, any> = Record<string, any>> = {
|
|
24
|
+
[K in keyof TValues]?: (path: string, value: TValues[K], form: UseFormReturnType<TValues>) => void | Promise<void>;
|
|
25
|
+
};
|
|
26
|
+
export interface AutoFormRef<TValues extends Record<string, any> = Record<string, any>> {
|
|
27
|
+
submit: () => void;
|
|
28
|
+
reset: (values?: Partial<TValues>) => void;
|
|
29
|
+
validate: () => boolean;
|
|
30
|
+
getValues: () => TValues;
|
|
31
|
+
setValues: (values: Partial<TValues>) => void;
|
|
32
|
+
getFieldValue: (path: string) => any;
|
|
33
|
+
setFieldValue: (path: string, value: any) => void;
|
|
34
|
+
isValid: () => boolean;
|
|
35
|
+
isDirty: () => boolean;
|
|
36
|
+
isLoading: () => boolean;
|
|
37
|
+
}
|
|
38
|
+
export {};
|
|
File without changes
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
3
|
+
import { FieldSchema } from '../types';
|
|
4
|
+
type DefaultFieldRenderProps<TValues extends Record<string, any>> = {
|
|
5
|
+
field: FieldSchema<TValues>;
|
|
6
|
+
form: UseFormReturnType<TValues>;
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
};
|
|
9
|
+
export declare function DefaultFieldRender<TValues extends Record<string, any>>({ field, form, children, }: DefaultFieldRenderProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export default DefaultFieldRender;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { FieldSchema } from '../types';
|
|
3
|
+
type FieldLayoutWrapperProps = {
|
|
4
|
+
field: FieldSchema;
|
|
5
|
+
layout: "vertical" | "horizontal" | "grid";
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
};
|
|
8
|
+
export declare function FieldLayoutWrapper({ field, layout, children, }: FieldLayoutWrapperProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export default FieldLayoutWrapper;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
2
|
+
import { FieldSchema } from '../types';
|
|
3
|
+
export interface FieldRendererProps<TValues extends Record<string, any> = Record<string, any>> {
|
|
4
|
+
field: FieldSchema<TValues>;
|
|
5
|
+
form: UseFormReturnType<TValues>;
|
|
6
|
+
layout?: "vertical" | "horizontal" | "grid";
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { CustomRenderersConfig } from '../renderer.types';
|
|
2
|
+
export declare const RenderersContext: import('react').Context<CustomRenderersConfig<any> | null>;
|
|
3
|
+
export declare const RenderersProvider: <TValues extends Record<string, any> = Record<string, any>>({ children, value, }: {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
value: CustomRenderersConfig<TValues>;
|
|
6
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare const useRenderers: <TValues extends Record<string, any> = Record<string, any>>() => CustomRenderersConfig<TValues>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
2
|
+
import { FieldSchema } from '../types';
|
|
3
|
+
import { RendererHandler } from './RendererHandler';
|
|
4
|
+
export declare class BuiltInHandler<TValues extends Record<string, any>> extends RendererHandler<TValues> {
|
|
5
|
+
private layout;
|
|
6
|
+
constructor(layout: "vertical" | "horizontal" | "grid");
|
|
7
|
+
canHandle(): boolean;
|
|
8
|
+
render(field: FieldSchema<TValues>, form: UseFormReturnType<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { RendererHandler } from './RendererHandler';
|
|
3
|
+
import { FieldSchema } from '../types';
|
|
4
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
5
|
+
export declare class CustomTypeRendererResolver<TValues extends Record<string, any>> extends RendererHandler<TValues> {
|
|
6
|
+
private customFieldTypes;
|
|
7
|
+
constructor(customFieldTypes: Record<string, (field: FieldSchema<TValues>, form: UseFormReturnType<TValues>) => React.ReactNode>);
|
|
8
|
+
canHandle(field: FieldSchema<TValues>): boolean;
|
|
9
|
+
render(field: FieldSchema<TValues>, form: UseFormReturnType<TValues>): React.ReactNode;
|
|
10
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { RendererHandler } from './RendererHandler';
|
|
3
|
+
import { FieldSchema } from '../types';
|
|
4
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
5
|
+
export declare class FieldNameHandler<TValues extends Record<string, any>> extends RendererHandler<TValues> {
|
|
6
|
+
private fieldRenderers;
|
|
7
|
+
constructor(fieldRenderers: Record<string, (field: any, form: any) => React.ReactNode>);
|
|
8
|
+
canHandle(field: FieldSchema<TValues>): boolean;
|
|
9
|
+
render(field: FieldSchema<TValues>, form: UseFormReturnType<TValues>): React.ReactNode;
|
|
10
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { RendererHandler } from './RendererHandler';
|
|
3
|
+
import { FieldSchema } from '../types';
|
|
4
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
5
|
+
export declare class FieldTypeHandler<TValues extends Record<string, any>> extends RendererHandler<TValues> {
|
|
6
|
+
private typeRenderers;
|
|
7
|
+
constructor(typeRenderers: Record<string, (field: any, form: any) => React.ReactNode>);
|
|
8
|
+
canHandle(field: FieldSchema<TValues>): boolean;
|
|
9
|
+
render(field: FieldSchema<TValues>, form: UseFormReturnType<TValues>): React.ReactNode;
|
|
10
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { FieldSchema } from '../types';
|
|
2
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
3
|
+
import { default as React } from 'react';
|
|
4
|
+
export declare abstract class RendererHandler<TValues extends Record<string, any>> {
|
|
5
|
+
private next?;
|
|
6
|
+
setNext(handler: RendererHandler<TValues>): RendererHandler<TValues>;
|
|
7
|
+
handle(field: FieldSchema<TValues>, form: UseFormReturnType<TValues>): React.ReactNode;
|
|
8
|
+
abstract canHandle(field: FieldSchema<TValues>): boolean;
|
|
9
|
+
abstract render(field: FieldSchema<TValues>, form: UseFormReturnType<TValues>): React.ReactNode;
|
|
10
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { UseFormReturnType } from '@mantine/form';
|
|
2
|
+
import { FieldSchema } from './types';
|
|
3
|
+
export type FieldRendererResolverProps<TValues extends Record<string, any> = Record<string, any>> = CustomRenderersConfig<TValues> & {
|
|
4
|
+
field: FieldSchema<TValues>;
|
|
5
|
+
form: UseFormReturnType<TValues>;
|
|
6
|
+
layout?: "vertical" | "horizontal" | "grid";
|
|
7
|
+
};
|
|
8
|
+
export type CustomRenderersConfig<TValues extends Record<string, any> = Record<string, any>> = {
|
|
9
|
+
customFieldRenderers?: Record<string, (field: FieldSchema<TValues>, form: UseFormReturnType<TValues>) => React.ReactNode>;
|
|
10
|
+
customTypeRenderers?: Record<string, (field: FieldSchema<TValues>, form: UseFormReturnType<TValues>) => React.ReactNode>;
|
|
11
|
+
customFieldTypes?: Record<string, (field: FieldSchema<TValues>, form: UseFormReturnType<TValues>) => React.ReactNode>;
|
|
12
|
+
};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type ArrayFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function ArrayFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form, layout }: ArrayFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default ArrayFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type CheckBoxFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function CheckBoxFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: CheckBoxFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default CheckBoxFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type DateFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function DateFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: DateFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default DateFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type DateTimeFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function DateTimeFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: DateTimeFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default DateTimeFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type NumberFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function NumberFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: NumberFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default NumberFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type ObjectFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function ObjectFieldRenderer<TValues extends Record<string, any>>({ field, form, layout, }: ObjectFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default ObjectFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type RichTextEditorFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function RichTextEditorFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: RichTextEditorFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default RichTextEditorFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type SelectFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function SelectFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: SelectFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default SelectFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type SwitchFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function SwitchFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: SwitchFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default SwitchFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type TagsInputFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function TagsInputFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: TagsInputFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default TagsInputFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type TextFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function TextFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: TextFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default TextFieldRenderer;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { FieldRendererProps } from '../FieldRenderer/FieldRenderer.types';
|
|
2
|
+
type TimeFieldRendererProps<TValues extends Record<string, any> = Record<string, any>> = FieldRendererProps<TValues>;
|
|
3
|
+
export declare function TimeFieldRenderer<TValues extends Record<string, any> = Record<string, any>>({ field, form }: TimeFieldRendererProps<TValues>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default TimeFieldRenderer;
|