@ahmadmubarak98/namozaj 1.1.15 → 1.1.17
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 +72 -1
- package/dist/namozaj.js +22 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
[](https://github.com/ahmadmubarak98/use-fetch)
|
|
2
|
+
|
|
3
|
+
[](https://www.buymeacoffee.com/ahmadmubarak98)
|
|
4
|
+
|
|
5
|
+
|
|
1
6
|
# @ahmadmubarak98/namozaj
|
|
2
7
|
|
|
3
8
|
`@ahmadmubarak/namozaj` is a dynamic form component for React that allows you to create flexible and customizable forms with ease using JSON only.
|
|
@@ -16,8 +21,74 @@ or
|
|
|
16
21
|
yarn add @ahmadmubarak98/namozaj
|
|
17
22
|
```
|
|
18
23
|
|
|
24
|
+
Make sure you also install the required peer dependencies:
|
|
25
|
+
|
|
26
|
+
```
|
|
27
|
+
npm install @mui/material @emotion/react @emotion/styled
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
## Documentation
|
|
31
|
+
Soon
|
|
32
|
+
|
|
33
|
+
## Fields
|
|
34
|
+
- text
|
|
35
|
+
- phone
|
|
36
|
+
- number
|
|
37
|
+
- slider
|
|
38
|
+
- select
|
|
39
|
+
- checkbox
|
|
40
|
+
- checkbox-group
|
|
41
|
+
- radio-group
|
|
42
|
+
- switch
|
|
43
|
+
- date
|
|
44
|
+
- time
|
|
45
|
+
- datetime
|
|
46
|
+
- file
|
|
47
|
+
- field-array
|
|
48
|
+
- repeater
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
## Usage
|
|
52
|
+
|
|
53
|
+
```javascript
|
|
54
|
+
import { Namozaj } from '@ahmadmubarak98/namozaj';
|
|
55
|
+
|
|
56
|
+
<Namozaj
|
|
57
|
+
fields={[
|
|
58
|
+
{
|
|
59
|
+
name: 'name',
|
|
60
|
+
type: 'text',
|
|
61
|
+
meta: {
|
|
62
|
+
label: 'Name',
|
|
63
|
+
grid: { xs: 12, sm: 6 },
|
|
64
|
+
validations: [
|
|
65
|
+
{
|
|
66
|
+
type: 'required',
|
|
67
|
+
errorMessage: 'Name is required',
|
|
68
|
+
}
|
|
69
|
+
],
|
|
70
|
+
},
|
|
71
|
+
}
|
|
72
|
+
]}
|
|
73
|
+
onSubmit={(data) => {
|
|
74
|
+
console.log('Form submitted with data:', data);
|
|
75
|
+
}}
|
|
76
|
+
/>
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
## References
|
|
80
|
+
|
|
81
|
+
The following libraries are utilized in the creation this library.
|
|
82
|
+
|
|
83
|
+
[MUI](https://mui.com/)
|
|
84
|
+
|
|
85
|
+
[React Hook Form](https://react-hook-form.com/).
|
|
86
|
+
|
|
87
|
+
[react-international-phone](https://www.npmjs.com/package/react-international-phone).
|
|
88
|
+
|
|
89
|
+
|
|
19
90
|
## License
|
|
20
|
-
This project is licensed under the MIT License.
|
|
91
|
+
This project is licensed under the MIT License. [](https://choosealicense.com/licenses/mit/)
|
|
21
92
|
|
|
22
93
|
## Attribution
|
|
23
94
|
When using @ahmadmubarak98/namozaj in your project, please make sure to give credit to the author by mentioning @ahmadmubarak98 in your documentation or project credits.
|
package/dist/namozaj.js
CHANGED
|
@@ -47643,9 +47643,28 @@ const FileField = ({
|
|
|
47643
47643
|
"fieldset",
|
|
47644
47644
|
{
|
|
47645
47645
|
id: e,
|
|
47646
|
-
className:
|
|
47646
|
+
className: a,
|
|
47647
|
+
style: {
|
|
47648
|
+
paddingRight: "12px",
|
|
47649
|
+
paddingLeft: "12px",
|
|
47650
|
+
paddingTop: "8px",
|
|
47651
|
+
paddingBottom: "8px",
|
|
47652
|
+
borderRadius: "0.375rem",
|
|
47653
|
+
borderWidth: "1px",
|
|
47654
|
+
borderStyle: "solid",
|
|
47655
|
+
borderColor: "#9ca3af"
|
|
47656
|
+
},
|
|
47647
47657
|
children: [
|
|
47648
|
-
t && /* @__PURE__ */ jsx(
|
|
47658
|
+
t && /* @__PURE__ */ jsx(
|
|
47659
|
+
"legend",
|
|
47660
|
+
{
|
|
47661
|
+
style: {
|
|
47662
|
+
paddingRight: "4px",
|
|
47663
|
+
paddingLeft: "4px"
|
|
47664
|
+
},
|
|
47665
|
+
children: t
|
|
47666
|
+
}
|
|
47667
|
+
),
|
|
47649
47668
|
/* @__PURE__ */ jsx("div", { className: "", children: l })
|
|
47650
47669
|
]
|
|
47651
47670
|
}
|
|
@@ -82470,7 +82489,7 @@ const Form = React__default.forwardRef(
|
|
|
82470
82489
|
},
|
|
82471
82490
|
y
|
|
82472
82491
|
)) }),
|
|
82473
|
-
!((h = e.defaultSubmitButtonProps) != null && h.hidden) && /* @__PURE__ */ jsx(
|
|
82492
|
+
!((h = e.defaultSubmitButtonProps) != null && h.hidden) && /* @__PURE__ */ jsx(Box, { mt: 2, children: /* @__PURE__ */ jsx(Button$1, { variant: "contained", color: "primary", type: "submit", children: ((f = e.defaultSubmitButtonProps) == null ? void 0 : f.label) || "Submit" }) })
|
|
82474
82493
|
] }) });
|
|
82475
82494
|
}
|
|
82476
82495
|
), Namozaj = forwardRef(
|