@arudovwen/form-builder-react 1.0.6 → 1.0.7
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 +22 -23
- package/dist/form-builder.es.js +4426 -4216
- package/dist/form-builder.umd.js +27 -27
- package/dist/index.css +1 -1
- package/package.json +1 -1
- package/types/App.d.ts +3 -3
- package/types/components/editor/element-render.d.ts +3 -1
- package/types/components/elements/basic-text.d.ts +4 -0
- package/types/components/elements/divider.d.ts +3 -0
- package/types/components/elements/grid-input.d.ts +4 -2
- package/types/components/elements/header.d.ts +4 -0
- package/types/components/elements/spacer.d.ts +3 -0
- package/types/components/elements/text-input.d.ts +2 -1
- package/types/utils/contants.d.ts +5 -0
package/README.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
The **Form Builder Package** is a reusable library designed to simplify the creation and management of dynamic forms in web applications. It provides a robust API and customizable components to streamline form-building workflows.
|
|
5
5
|
|
|
6
|
-
|
|
6
|
+
**This package is still in development**
|
|
7
7
|
|
|
8
8
|
## Features
|
|
9
9
|
|
|
@@ -20,10 +20,15 @@ Install the package via npm:
|
|
|
20
20
|
```bash
|
|
21
21
|
npm install @arudovwen/form-builder-react
|
|
22
22
|
```
|
|
23
|
+
|
|
23
24
|
## Demo
|
|
24
25
|
|
|
25
|
-
Check out the live demo of the Form Builder Package: [Form Builder Demo](https://form-builder-inky-nine.vercel.app/),
|
|
26
|
-
To view after saving
|
|
26
|
+
Check out the live demo of the Form Builder Package: [Form Builder Demo](https://form-builder-inky-nine.vercel.app/),
|
|
27
|
+
To view after saving: [Form Viewer](https://form-builder-inky-nine.vercel.app/viewer)
|
|
28
|
+
|
|
29
|
+
## GitHub Repository
|
|
30
|
+
|
|
31
|
+
Find the source code and contribute to the project on GitHub: [Form Builder GitHub Repository](https://github.com/arudovwen/Form.Builder)
|
|
27
32
|
|
|
28
33
|
## Usage
|
|
29
34
|
|
|
@@ -34,7 +39,6 @@ import React, { useState, useEffect } from "react";
|
|
|
34
39
|
import { FormBuilder, FormViewer } from "@arudovwen/form-builder-react";
|
|
35
40
|
import "@arudovwen/form-builder-react/dist/index.css";
|
|
36
41
|
|
|
37
|
-
|
|
38
42
|
function App() {
|
|
39
43
|
const [formData, setFormData] = useState(null);
|
|
40
44
|
const [loading, setLoading] = useState(true);
|
|
@@ -61,28 +65,23 @@ function App() {
|
|
|
61
65
|
};
|
|
62
66
|
|
|
63
67
|
return (
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
loading={loading}
|
|
78
|
-
/>
|
|
79
|
-
</>
|
|
80
|
-
|
|
68
|
+
<>
|
|
69
|
+
<FormBuilder
|
|
70
|
+
onSubmit={(form_data: any) => console.log(form_data)}
|
|
71
|
+
config={config}
|
|
72
|
+
/>
|
|
73
|
+
<FormViewer
|
|
74
|
+
onSubmit={(e: any) => console.log(e)}
|
|
75
|
+
form_data={formData}
|
|
76
|
+
anwserData={answerData}
|
|
77
|
+
config={config}
|
|
78
|
+
loading={loading}
|
|
79
|
+
/>
|
|
80
|
+
</>
|
|
81
81
|
);
|
|
82
82
|
}
|
|
83
83
|
|
|
84
84
|
export default App;
|
|
85
|
-
|
|
86
85
|
```
|
|
87
86
|
|
|
88
87
|
### Props for `FormBuilder`
|
|
@@ -160,4 +159,4 @@ Contributions are welcome! Please fork the repository, create a feature branch,
|
|
|
160
159
|
---
|
|
161
160
|
|
|
162
161
|
Happy form building!
|
|
163
|
-
|
|
162
|
+
|