autoforma 1.0.35 → 1.0.36

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.
Files changed (59) hide show
  1. package/dist/{src/components → components}/AutoForm.d.ts +0 -1
  2. package/dist/{src/components → components}/FieldRender.d.ts +0 -1
  3. package/dist/{src/components → components}/fields/ArrayField.d.ts +0 -1
  4. package/dist/{src/components → components}/fields/CheckField.d.ts +0 -1
  5. package/dist/{src/components → components}/fields/DateField.d.ts +0 -1
  6. package/dist/{src/components → components}/fields/DateTimeField.d.ts +0 -1
  7. package/dist/{src/components → components}/fields/NumberField.d.ts +0 -1
  8. package/dist/{src/components → components}/fields/ObjectField.d.ts +0 -1
  9. package/dist/{src/components → components}/fields/SelectField.d.ts +0 -1
  10. package/dist/{src/components → components}/fields/TextAreaField.d.ts +0 -1
  11. package/dist/{src/components → components}/fields/TextField.d.ts +0 -1
  12. package/dist/{src/components → components}/fields/TimeField.d.ts +0 -1
  13. package/dist/{src/index.d.ts → index.d.ts} +0 -1
  14. package/dist/{src/stories → stories}/AutoForm.stories.d.ts +0 -1
  15. package/dist/{src/stories → stories}/Fields.stories.d.ts +0 -1
  16. package/dist/{src/theme.d.ts → theme.d.ts} +0 -1
  17. package/dist/{src/types → types}/custom-render.d.ts +0 -1
  18. package/dist/{src/types → types}/field.d.ts +0 -1
  19. package/dist/{src/types → types}/form.d.ts +0 -1
  20. package/package.json +22 -65
  21. package/dist/index.es.d.ts +0 -2
  22. package/dist/src/components/AutoForm.d.ts.map +0 -1
  23. package/dist/src/components/FieldRender.d.ts.map +0 -1
  24. package/dist/src/components/fields/ArrayField.d.ts.map +0 -1
  25. package/dist/src/components/fields/CheckField.d.ts.map +0 -1
  26. package/dist/src/components/fields/DateField.d.ts.map +0 -1
  27. package/dist/src/components/fields/DateTimeField.d.ts.map +0 -1
  28. package/dist/src/components/fields/NumberField.d.ts.map +0 -1
  29. package/dist/src/components/fields/ObjectField.d.ts.map +0 -1
  30. package/dist/src/components/fields/SelectField.d.ts.map +0 -1
  31. package/dist/src/components/fields/TextAreaField.d.ts.map +0 -1
  32. package/dist/src/components/fields/TextField.d.ts.map +0 -1
  33. package/dist/src/components/fields/TimeField.d.ts.map +0 -1
  34. package/dist/src/index.d.ts.map +0 -1
  35. package/dist/src/stories/AutoForm.stories.d.ts.map +0 -1
  36. package/dist/src/stories/Fields.stories.d.ts.map +0 -1
  37. package/dist/src/theme.d.ts.map +0 -1
  38. package/dist/src/types/custom-render.d.ts.map +0 -1
  39. package/dist/src/types/field.d.ts.map +0 -1
  40. package/dist/src/types/form.d.ts.map +0 -1
  41. package/dist/test-utils/index.d.ts +0 -5
  42. package/dist/test-utils/index.d.ts.map +0 -1
  43. package/dist/test-utils/render.d.ts +0 -2
  44. package/dist/test-utils/render.d.ts.map +0 -1
  45. package/src/components/AutoForm.tsx +0 -201
  46. package/src/components/FieldRender.tsx +0 -217
  47. package/src/components/fields/ArrayField.tsx +0 -59
  48. package/src/components/fields/CheckField.tsx +0 -23
  49. package/src/components/fields/DateField.tsx +0 -26
  50. package/src/components/fields/DateTimeField.tsx +0 -26
  51. package/src/components/fields/NumberField.tsx +0 -20
  52. package/src/components/fields/ObjectField.tsx +0 -41
  53. package/src/components/fields/SelectField.tsx +0 -23
  54. package/src/components/fields/TextAreaField.tsx +0 -25
  55. package/src/components/fields/TextField.tsx +0 -20
  56. package/src/components/fields/TimeField.tsx +0 -32
  57. package/src/types/custom-render.ts +0 -22
  58. package/src/types/field.ts +0 -32
  59. package/src/types/form.ts +0 -8
@@ -16,4 +16,3 @@ export interface AutoFormProps {
16
16
  export declare const validateRequiredFields: (schema: FieldSchema[], values: Record<string, any>, parentPath?: string) => Record<string, string>;
17
17
  declare const AutoForm: React.FC<AutoFormProps>;
18
18
  export default AutoForm;
19
- //# sourceMappingURL=AutoForm.d.ts.map
@@ -14,4 +14,3 @@ interface FieldRenderProps {
14
14
  export declare function getArrayOptions(name: string, onChange: (name: string, value: any) => void, value: Record<string, any>[]): ArrayFieldOptions;
15
15
  declare const FieldRender: React.FC<FieldRenderProps>;
16
16
  export default FieldRender;
17
- //# sourceMappingURL=FieldRender.d.ts.map
@@ -11,4 +11,3 @@ interface ArrayFieldProps extends BaseFieldProps<Record<string, any>[]> {
11
11
  }
12
12
  declare const ArrayField: React.FC<ArrayFieldProps>;
13
13
  export default ArrayField;
14
- //# sourceMappingURL=ArrayField.d.ts.map
@@ -5,4 +5,3 @@ interface CheckFieldProps extends BaseFieldProps<boolean> {
5
5
  }
6
6
  declare const CheckField: React.FC<CheckFieldProps>;
7
7
  export default CheckField;
8
- //# sourceMappingURL=CheckField.d.ts.map
@@ -4,4 +4,3 @@ interface DateFieldProps extends BaseFieldProps<Date> {
4
4
  }
5
5
  declare const DateField: React.FC<DateFieldProps>;
6
6
  export default DateField;
7
- //# sourceMappingURL=DateField.d.ts.map
@@ -4,4 +4,3 @@ interface DateTimeFieldProps extends BaseFieldProps<Date> {
4
4
  }
5
5
  declare const DateTimeField: React.FC<DateTimeFieldProps>;
6
6
  export default DateTimeField;
7
- //# sourceMappingURL=DateTimeField.d.ts.map
@@ -4,4 +4,3 @@ interface NumberFieldProps extends BaseFieldProps<number> {
4
4
  }
5
5
  declare const NumberField: React.FC<NumberFieldProps>;
6
6
  export default NumberField;
7
- //# sourceMappingURL=NumberField.d.ts.map
@@ -7,4 +7,3 @@ interface ObjectFieldProps extends BaseFieldProps<Record<string, any>> {
7
7
  }
8
8
  declare const ObjectField: React.FC<ObjectFieldProps>;
9
9
  export default ObjectField;
10
- //# sourceMappingURL=ObjectField.d.ts.map
@@ -8,4 +8,3 @@ interface SelectFieldProps extends BaseFieldProps<string> {
8
8
  }
9
9
  declare const SelectField: React.FC<SelectFieldProps>;
10
10
  export default SelectField;
11
- //# sourceMappingURL=SelectField.d.ts.map
@@ -4,4 +4,3 @@ interface TextAreaFieldProps extends BaseFieldProps<string> {
4
4
  }
5
5
  declare const TextAreaField: React.FC<TextAreaFieldProps>;
6
6
  export default TextAreaField;
7
- //# sourceMappingURL=TextAreaField.d.ts.map
@@ -4,4 +4,3 @@ interface TextFieldProps extends BaseFieldProps<string> {
4
4
  }
5
5
  declare const TextField: React.FC<TextFieldProps>;
6
6
  export default TextField;
7
- //# sourceMappingURL=TextField.d.ts.map
@@ -4,4 +4,3 @@ interface TimeFieldProps extends BaseFieldProps<string> {
4
4
  }
5
5
  declare const TimeField: React.FC<TimeFieldProps>;
6
6
  export default TimeField;
7
- //# sourceMappingURL=TimeField.d.ts.map
@@ -1,3 +1,2 @@
1
1
  export { default as AutoForm } from './components/AutoForm';
2
2
  export type { AutoFormProps } from './components/AutoForm';
3
- //# sourceMappingURL=index.d.ts.map
@@ -7,4 +7,3 @@ export declare const Standard: Story;
7
7
  export declare const ReadOnly: Story;
8
8
  export declare const FormValidation: Story;
9
9
  export declare const CustomizedForm: Story;
10
- //# sourceMappingURL=AutoForm.stories.d.ts.map
@@ -10,4 +10,3 @@ export declare const CheckField: Story;
10
10
  export declare const DateField: Story;
11
11
  export declare const ArrayField: Story;
12
12
  export declare const ObjectField: Story;
13
- //# sourceMappingURL=Fields.stories.d.ts.map
@@ -139,4 +139,3 @@ export declare const theme: {
139
139
  [x: string]: any;
140
140
  } | undefined;
141
141
  };
142
- //# sourceMappingURL=theme.d.ts.map
@@ -9,4 +9,3 @@ export interface CustomFieldRender {
9
9
  options?: ArrayFieldOptions;
10
10
  readOnly?: true;
11
11
  }
12
- //# sourceMappingURL=custom-render.d.ts.map
@@ -28,4 +28,3 @@ export type ArrayFieldOptions = {
28
28
  replaceElement: (index: number, val: Record<string, any>) => void;
29
29
  removeElement: (index: number) => void;
30
30
  };
31
- //# sourceMappingURL=field.d.ts.map
@@ -5,4 +5,3 @@ export interface FormSchema {
5
5
  formData?: Record<string, any>;
6
6
  initialValues?: Record<string, any>;
7
7
  }
8
- //# sourceMappingURL=form.d.ts.map
package/package.json CHANGED
@@ -1,7 +1,21 @@
1
1
  {
2
2
  "name": "autoforma",
3
+ "version": "1.0.36",
4
+ "description": "AutoForma is a dynamic form builder based on Mantine and React",
5
+ "main": "./dist/index.cjs.js",
6
+ "module": "./dist/index.es.js",
7
+ "types": "./dist/index.d.ts",
8
+ "exports": {
9
+ ".": {
10
+ "import": "./dist/index.es.js",
11
+ "require": "./dist/index.cjs.js",
12
+ "types": "./dist/index.d.ts"
13
+ }
14
+ },
15
+ "files": [
16
+ "dist"
17
+ ],
3
18
  "type": "module",
4
- "version": "1.0.35",
5
19
  "homepage": "http://sajinael98.github.io/AutoForma",
6
20
  "scripts": {
7
21
  "dev": "vite",
@@ -19,8 +33,7 @@
19
33
  "storybook": "storybook dev -p 6006",
20
34
  "storybook:build": "storybook build",
21
35
  "predeploy": "npm run build-storybook",
22
- "deploy-storybook": "gh-pages -d storybook-static",
23
- "build-storybook": "build-storybook"
36
+ "deploy-storybook": "gh-pages -d storybook-static"
24
37
  },
25
38
  "dependencies": {
26
39
  "@mantine/core": "7.17.5",
@@ -30,72 +43,16 @@
30
43
  "dayjs": "^1.11.13",
31
44
  "react": "^19.1.0",
32
45
  "react-dom": "^19.1.0",
33
- "react-router-dom": "^7.4.0",
34
- "vite-plugin-dts": "^4.5.3"
46
+ "react-router-dom": "^7.4.0"
35
47
  },
36
48
  "devDependencies": {
37
- "@chromatic-com/storybook": "^3.2.6",
38
- "@eslint/js": "^9.23.0",
39
- "@ianvs/prettier-plugin-sort-imports": "^4.4.1",
40
- "@storybook/addon-essentials": "^8.6.12",
41
- "@storybook/addon-onboarding": "^8.6.12",
42
- "@storybook/blocks": "^8.6.12",
43
- "@storybook/experimental-addon-test": "^8.6.12",
44
- "@storybook/react": "^8.6.8",
45
- "@storybook/react-vite": "^8.6.8",
46
- "@storybook/test": "^8.6.12",
47
- "@testing-library/dom": "^10.4.0",
48
- "@testing-library/jest-dom": "^6.6.3",
49
- "@testing-library/react": "^16.2.0",
50
- "@testing-library/user-event": "^14.6.1",
51
- "@types/node": "^22.13.11",
52
- "@types/react": "^19.0.12",
53
- "@types/react-dom": "^19.0.4",
54
49
  "@vitejs/plugin-react": "^4.3.4",
55
- "@vitest/browser": "^3.1.2",
56
- "@vitest/coverage-v8": "^3.1.2",
57
- "eslint": "^9.23.0",
58
- "eslint-config-mantine": "^4.0.3",
59
- "eslint-plugin-jsx-a11y": "^6.10.2",
60
- "eslint-plugin-react": "^7.37.4",
61
- "eslint-plugin-storybook": "^0.12.0",
62
- "gh-pages": "^6.3.0",
63
- "identity-obj-proxy": "^3.0.0",
64
- "jsdom": "^26.0.0",
65
- "playwright": "^1.52.0",
66
- "postcss": "^8.5.3",
67
- "postcss-preset-mantine": "1.17.0",
68
- "postcss-simple-vars": "^7.0.1",
69
- "prettier": "^3.5.3",
70
- "prop-types": "^15.8.1",
71
- "storybook": "^8.6.8",
72
- "storybook-dark-mode": "^4.0.2",
73
- "stylelint": "^16.16.0",
74
- "stylelint-config-standard-scss": "^14.0.0",
75
- "typescript": "^5.8.2",
76
- "typescript-eslint": "^8.27.0",
77
50
  "vite": "^6.2.2",
51
+ "vite-plugin-dts": "^4.5.3",
52
+ "typescript": "^5.8.2",
78
53
  "vite-tsconfig-paths": "^5.1.4",
79
- "vitest": "^3.0.9"
80
- },
81
- "packageManager": "yarn@4.9.1",
82
- "eslintConfig": {
83
- "extends": [
84
- "plugin:storybook/recommended"
85
- ]
54
+ "@types/react": "^19.0.12",
55
+ "@types/react-dom": "^19.0.4"
86
56
  },
87
- "files": [
88
- "dist",
89
- "src/components",
90
- "src/types",
91
- "README.md"
92
- ],
93
- "main": "dist/index.js",
94
- "module": "dist/index.mjs",
95
- "exports": {
96
- ".": {
97
- "import": "./dist/index.mjs",
98
- "require": "./dist/index.js"
99
- }
100
- }
57
+ "packageManager": "yarn@4.9.1"
101
58
  }
@@ -1,2 +0,0 @@
1
- export * from './src/index'
2
- export {}
@@ -1 +0,0 @@
1
- {"version":3,"file":"AutoForm.d.ts","sourceRoot":"","sources":["../../../src/components/AutoForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAqB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAErE,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,WAAW,EAAa,MAAM,eAAe,CAAC;AAIvD,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC7B,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAChD,SAAS,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,CAAC,EAAE,IAAI,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/F,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,EAAE,WAAW,EAAE,WAAW,KAAK,KAAK,CAAC,SAAS,CAAC;IACvF,YAAY,CAAC,EAAE,uBAAuB,CAAC;IACvC,QAAQ,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC;IAClD,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAChG;AA8CD,eAAO,MAAM,sBAAsB,GACjC,QAAQ,WAAW,EAAE,EACrB,QAAQ,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC3B,mBAAe,KACd,MAAM,CAAC,MAAM,EAAE,MAAM,CA0BvB,CAAC;AA2BF,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA6ErC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"FieldRender.d.ts","sourceRoot":"","sources":["../../../src/components/FieldRender.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAY/D,UAAU,gBAAgB;IACxB,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC1D,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC7C,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAChC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,EAAE,WAAW,EAAE,WAAW,KAAK,KAAK,CAAC,SAAS,CAAC;IACvF,YAAY,CAAC,EAAE,uBAAuB,CAAC;IACvC,QAAQ,CAAC,EAAE,IAAI,CAAC;CACjB;AAED,wBAAgB,eAAe,CAC7B,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,EAC5C,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,GAC3B,iBAAiB,CAgBnB;AAED,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAsK3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"ArrayField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/ArrayField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5D,UAAU,eAAgB,SAAQ,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAAC;IACrE,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,OAAO,EAAE;QACP,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;QAC/C,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;QAClE,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;KACxC,CAAC;IACF,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;CACzC;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAwCzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"CheckField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/CheckField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,eAAgB,SAAQ,cAAc,CAAC,OAAO,CAAC;IACvD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAYzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"DateField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/DateField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAI/C,UAAU,cAAe,SAAQ,cAAc,CAAC,IAAI,CAAC;CAAG;AAExD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAavC,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"DateTimeField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/DateTimeField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAI/C,UAAU,kBAAmB,SAAQ,cAAc,CAAC,IAAI,CAAC;CAAG;AAE5D,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAa/C,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"NumberField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/NumberField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,gBAAiB,SAAQ,cAAc,CAAC,MAAM,CAAC;CAAG;AAE5D,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAW3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"ObjectField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/ObjectField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5D,UAAU,gBAAiB,SAAQ,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACpE,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;CACzC;AAED,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA2B3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/SelectField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,gBAAiB,SAAQ,cAAc,CAAC,MAAM,CAAC;IACvD,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAC1C;AAED,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAY3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TextAreaField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/TextAreaField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,kBAAmB,SAAQ,cAAc,CAAC,MAAM,CAAC;CAAG;AAE9D,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAgB/C,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/TextField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,cAAe,SAAQ,cAAc,CAAC,MAAM,CAAC;CAAG;AAE1D,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAWvC,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TimeField.d.ts","sourceRoot":"","sources":["../../../../src/components/fields/TimeField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAGtC,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,cAAe,SAAQ,cAAc,CAAC,MAAM,CAAC;CAAG;AAE1D,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAsBvC,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,YAAY,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"AutoForm.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/AutoForm.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,uBAAuB,CAAC;AAM7C,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAyGvD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAsL/B,CAAC;AAEF,eAAe,IAAI,CAAC;AAMpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAC;AAEvC,eAAO,MAAM,QAAQ,EAAE,KAAU,CAAC;AAElC,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAgB5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KA2D5B,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"Fields.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/Fields.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,QAAQ,MAAM,uBAAuB,CAAC;AA+F7C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CA0C/B,CAAC;AAEF,eAAe,IAAI,CAAC;AAMpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAC;AAEvC,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAIzB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAIzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAIxB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAIxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAIzB,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/theme.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEhB,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"custom-render.d.ts","sourceRoot":"","sources":["../../../src/types/custom-render.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEzD,MAAM,MAAM,uBAAuB,GAAG,CACpC,KAAK,EAAE,WAAW,EAClB,KAAK,EAAE,GAAG,EACV,KAAK,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,EACxD,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,EAC5C,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC/B,OAAO,CAAC,EAAE,iBAAiB,EAC3B,QAAQ,CAAC,EAAE,IAAI,KACZ,KAAK,CAAC,SAAS,CAAC;AAErB,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IACzD,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC7C,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,CAAC,EAAE,IAAI,CAAC;CACjB"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../../src/types/field.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CAAC;AAEhI,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,OAAO,GAAG,OAAO,CAAC;IAC9D,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,OAAO,GAAG,OAAO,CAAC;IAC7D,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB,QAAQ,CAAC,EAAE,IAAI,CAAC;IAEhB,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC;IAEvB,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAC3C;AAED,MAAM,WAAW,cAAc,CAAC,CAAC;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;IAClD,QAAQ,CAAC,EAAE,IAAI,CAAC;CACjB;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACjD,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAClE,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/types/form.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,MAAM,WAAW,UAAU;IACzB,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACrC"}
@@ -1,5 +0,0 @@
1
- import { default as userEvent } from '@testing-library/user-event';
2
- export * from '@testing-library/react';
3
- export { render } from './render';
4
- export { userEvent };
5
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../test-utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,6BAA6B,CAAC;AAEpD,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,CAAC"}
@@ -1,2 +0,0 @@
1
- export declare function render(ui: React.ReactNode): import('@testing-library/react').RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>;
2
- //# sourceMappingURL=render.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../test-utils/render.tsx"],"names":[],"mappings":"AAIA,wBAAgB,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,SAAS,gIAMzC"}
@@ -1,201 +0,0 @@
1
- import React, { useCallback, useEffect, useMemo } from 'react';
2
- import { createFormContext, FormValidateInput } from '@mantine/form';
3
- import { useDebouncedCallback } from '@mantine/hooks';
4
- import { FieldRenderCustomRender } from '@/types/custom-render';
5
- import { FieldSchema, FieldType } from '@/types/field';
6
- import FieldRender from './FieldRender';
7
-
8
-
9
- export interface AutoFormProps {
10
- values?: Record<string, any>;
11
- schema: FieldSchema[];
12
- onSubmit: (values: Record<string, any>) => void;
13
- container: (Form: React.ReactNode, onSubmit: VoidFunction, readOnly?: true) => React.ReactNode;
14
- fieldContainer?: (field: React.ReactNode, fieldSchema: FieldSchema) => React.ReactNode;
15
- customRender?: FieldRenderCustomRender;
16
- validate?: FormValidateInput<Record<string, any>>;
17
- readOnly?: true;
18
- onFieldChange?: (name: string, value: any, values: Record<string, any>) => Record<string, any>;
19
- }
20
-
21
- const [FormProvider, _, useForm] = createFormContext<Record<string, any>>();
22
-
23
- const getDefaultValueForField = (type: FieldType): any => {
24
- switch (type) {
25
- case 'number':
26
- return 0;
27
- case 'array':
28
- return [];
29
- case 'check':
30
- return false;
31
- case 'object':
32
- return {};
33
- case 'select':
34
- case 'date':
35
- case 'datetime':
36
- return null;
37
- default:
38
- return '';
39
- }
40
- };
41
-
42
- const generateInitialValues = (schema: FieldSchema[]): Record<string, any> => {
43
- const result: Record<string, any> = {};
44
-
45
- for (const field of schema) {
46
- if (field.type === 'object' && field.fields) {
47
- result[field.name] = generateInitialValues(field.fields);
48
- } else {
49
- result[field.name] = field.initialValue ?? getDefaultValueForField(field.type);
50
- }
51
- }
52
-
53
- return result;
54
- };
55
-
56
- const isValueEmpty = (value: any): boolean => {
57
- return (
58
- value === null ||
59
- value === undefined ||
60
- (typeof value === 'string' && value.trim() === '') ||
61
- (Array.isArray(value) && value.length === 0)
62
- );
63
- };
64
-
65
- export const validateRequiredFields = (
66
- schema: FieldSchema[],
67
- values: Record<string, any>,
68
- parentPath = ''
69
- ): Record<string, string> => {
70
- const errors: Record<string, string> = {};
71
-
72
- for (const field of schema) {
73
- const fullName = parentPath ? `${parentPath}.${field.name}` : field.name;
74
- const fieldValue = values?.[field.name];
75
-
76
- if (field.type === 'object') {
77
- Object.assign(errors, validateRequiredFields(field.fields, fieldValue || {}, fullName));
78
- } else if (field.type === 'array') {
79
- if (field.required && (!Array.isArray(fieldValue) || fieldValue.length === 0)) {
80
- errors[fullName] = field.name + ' is required';
81
- continue;
82
- }
83
-
84
- if (Array.isArray(fieldValue)) {
85
- fieldValue.forEach((item, index) => {
86
- Object.assign(errors, validateRequiredFields(field.fields, item, `${fullName}.${index}`));
87
- });
88
- }
89
- } else if (field.required && isValueEmpty(fieldValue)) {
90
- errors[fullName] = field.name + ' is required';
91
- }
92
- }
93
-
94
- return errors;
95
- };
96
-
97
- function buildErrorObject(flatErrors) {
98
- const error = {};
99
-
100
- Object.entries(flatErrors).forEach(([key, value]) => {
101
- const keys = key.split('.');
102
- let curr: Record<string, string> = error;
103
-
104
- keys.forEach((subKey, index) => {
105
- const isLast = index === keys.length - 1;
106
- const nextKey = keys[index + 1];
107
-
108
- if (isLast) {
109
- curr[subKey] = value;
110
- } else {
111
- if (!(subKey in curr)) {
112
- curr[subKey] = {};
113
- }
114
- curr = curr[subKey];
115
- }
116
- });
117
- });
118
-
119
- return error;
120
- }
121
-
122
- const AutoForm: React.FC<AutoFormProps> = ({
123
- onSubmit,
124
- schema,
125
- container,
126
- fieldContainer,
127
- customRender,
128
- validate,
129
- readOnly,
130
- values,
131
- onFieldChange,
132
- }) => {
133
- const form = useForm({
134
- mode: 'uncontrolled',
135
- initialValues: generateInitialValues(schema),
136
- validate,
137
- });
138
-
139
- const formValues = useMemo(() => form.getValues(), [form.getValues()]);
140
-
141
- const onChange = useDebouncedCallback((name: string, value: any) => {
142
- form.setFieldValue(name, value);
143
- if (onFieldChange) {
144
- const updates = onFieldChange(name, value, formValues);
145
- form.setValues(updates);
146
- }
147
- }, 0);
148
-
149
- const getFieldError = useCallback(
150
- (type: FieldType, name: string) => {
151
- const errors = form.errors;
152
-
153
- if (type === 'object' || type === 'array') {
154
- return buildErrorObject(errors)[name];
155
- }
156
-
157
- return errors[name];
158
- },
159
- [form.errors]
160
- );
161
-
162
- const handleSubmit = useCallback(() => {
163
- const currentValues = form.getValues();
164
- const errors = validateRequiredFields(schema, currentValues);
165
-
166
- if (Object.keys(errors).length > 0) {
167
- form.setErrors(errors);
168
- return;
169
- }
170
-
171
- form.onSubmit(onSubmit)();
172
- }, [form, onSubmit, schema]);
173
-
174
- useEffect(() => {
175
- if (values) {
176
- form.initialize(values);
177
- }
178
- }, [values]);
179
-
180
- const content = (
181
- <FormProvider form={form}>
182
- {schema.map((field, index) => (
183
- <FieldRender
184
- key={index}
185
- field={field}
186
- formValues={formValues}
187
- value={formValues[field.name]}
188
- error={getFieldError(field.type, field.name)}
189
- onChange={onChange}
190
- fieldContainer={fieldContainer}
191
- customRender={customRender}
192
- readOnly={field.readOnly || readOnly}
193
- />
194
- ))}
195
- </FormProvider>
196
- );
197
-
198
- return container(content, handleSubmit, readOnly);
199
- };
200
-
201
- export default AutoForm;
@@ -1,217 +0,0 @@
1
- import React, { useMemo } from 'react';
2
- import { Fieldset, Text } from '@mantine/core';
3
- import { FieldRenderCustomRender } from '@/types/custom-render';
4
- import { ArrayFieldOptions, FieldSchema } from '@/types/field';
5
- import ArrayField from './fields/ArrayField';
6
- import CheckField from './fields/CheckField';
7
- import DateField from './fields/DateField';
8
- import DateTimeField from './fields/DateTimeField';
9
- import NumberField from './fields/NumberField';
10
- import ObjectField from './fields/ObjectField';
11
- import SelectField from './fields/SelectField';
12
- import TextAreaField from './fields/TextAreaField';
13
- import TextField from './fields/TextField';
14
- import TimeField from './fields/TimeField';
15
-
16
- interface FieldRenderProps {
17
- field: FieldSchema;
18
- value: any;
19
- error?: React.ReactNode | Record<string, React.ReactNode>;
20
- onChange: (name: string, value: any) => void;
21
- formValues: Record<string, any>;
22
- fieldContainer?: (field: React.ReactNode, fieldSchema: FieldSchema) => React.ReactNode;
23
- customRender?: FieldRenderCustomRender;
24
- readOnly?: true;
25
- }
26
-
27
- export function getArrayOptions(
28
- name: string,
29
- onChange: (name: string, value: any) => void,
30
- value: Record<string, any>[]
31
- ): ArrayFieldOptions {
32
- return {
33
- addElement: (val) => {
34
- onChange(name, [...value, val]);
35
- },
36
- replaceElement: (index, val) => {
37
- const newValue = value.map((row, i) => (i === index ? val : row));
38
- onChange(name, newValue);
39
- },
40
- removeElement: (index) => {
41
- onChange(
42
- name,
43
- value.filter((_, i) => i !== index)
44
- );
45
- },
46
- };
47
- }
48
-
49
- const FieldRender: React.FC<FieldRenderProps> = ({
50
- field,
51
- value,
52
- error,
53
- onChange,
54
- formValues,
55
- fieldContainer = (field) => <>{field}</>,
56
- customRender,
57
- readOnly,
58
- }) => {
59
- const isVisible = useMemo(() => {
60
- return typeof field.visible === 'function'
61
- ? field.visible(formValues)
62
- : field.visible !== false;
63
- }, [field.visible, formValues]);
64
-
65
- const isDisabled = useMemo(() => {
66
- return typeof field.disabled === 'function'
67
- ? field.disabled(formValues)
68
- : field.disabled === true;
69
- }, [field.disabled, formValues]);
70
-
71
- const arrayOptions = useMemo(() => {
72
- if (field.type !== 'array') {
73
- return undefined;
74
- }
75
- return getArrayOptions(field.name, onChange, value);
76
- }, [field.type, field.name, onChange, value]);
77
-
78
- const customField = useMemo(() => {
79
- return customRender?.(
80
- field,
81
- value,
82
- error,
83
- onChange,
84
- formValues,
85
- arrayOptions,
86
- readOnly || field.readOnly
87
- );
88
- }, [
89
- customRender,
90
- field,
91
- value,
92
- error,
93
- onChange,
94
- formValues,
95
- arrayOptions,
96
- readOnly,
97
- field.readOnly,
98
- ]);
99
-
100
- if (!isVisible) {
101
- return null;
102
- }
103
-
104
- if (customField) {
105
- return customField;
106
- }
107
-
108
- const renderField = () => {
109
- switch (field.type) {
110
- case 'text':
111
- return (
112
- <TextField
113
- name={field.name}
114
- value={value as string}
115
- onChange={onChange}
116
- readOnly={readOnly}
117
- />
118
- );
119
- case 'number':
120
- return (
121
- <NumberField
122
- name={field.name}
123
- value={value as number}
124
- onChange={onChange}
125
- readOnly={readOnly}
126
- />
127
- );
128
- case 'object':
129
- return (
130
- <ObjectField
131
- name={field.name}
132
- onChange={onChange}
133
- value={value}
134
- fields={field.fields ?? []}
135
- formValues={formValues}
136
- error={error as Record<string, React.ReactNode>}
137
- readOnly={readOnly}
138
- />
139
- );
140
- case 'array':
141
- return (
142
- <ArrayField
143
- name={field.name}
144
- onChange={onChange}
145
- value={value}
146
- fields={field.fields as FieldSchema[]}
147
- options={arrayOptions!}
148
- error={error as Record<string, React.ReactNode>}
149
- readOnly={readOnly}
150
- />
151
- );
152
- case 'check':
153
- return (
154
- <CheckField
155
- name={field.name}
156
- value={value as boolean}
157
- onChange={onChange}
158
- readOnly={readOnly}
159
- label={field.label}
160
- />
161
- );
162
- case 'select':
163
- return (
164
- <SelectField
165
- name={field.name}
166
- value={value}
167
- onChange={onChange}
168
- readOnly={readOnly}
169
- data={field.data as { label: string; value: string }[]}
170
- />
171
- );
172
- case 'textarea':
173
- return (
174
- <TextAreaField name={field.name} value={value} onChange={onChange} readOnly={readOnly} />
175
- );
176
- case 'date':
177
- return (
178
- <DateField name={field.name} value={value} onChange={onChange} readOnly={readOnly} />
179
- );
180
- case 'datetime':
181
- return (
182
- <DateTimeField name={field.name} value={value} onChange={onChange} readOnly={readOnly} />
183
- );
184
- case 'time':
185
- return (
186
- <TimeField name={field.name} value={value} onChange={onChange} readOnly={readOnly} />
187
- );
188
-
189
- default:
190
- return null;
191
- }
192
- };
193
-
194
- const content = (
195
- <Fieldset
196
- legend={field.type === 'check' ? undefined : field.label}
197
- variant="unstyled"
198
- disabled={isDisabled || readOnly}
199
- styles={{
200
- legend: {
201
- fontWeight: 500,
202
- },
203
- }}
204
- >
205
- {renderField()}
206
- {!['object', 'array'].includes(field.type) && typeof error === 'string' && (
207
- <Text c="red" fz="sm" fw={500}>
208
- {error}
209
- </Text>
210
- )}
211
- </Fieldset>
212
- );
213
-
214
- return fieldContainer(content, field);
215
- };
216
-
217
- export default FieldRender;
@@ -1,59 +0,0 @@
1
- import React, { Fragment } from 'react';
2
- import { Button, Text } from '@mantine/core';
3
- import { BaseFieldProps, FieldSchema } from '@/types/field';
4
- import FieldRender from '../FieldRender';
5
-
6
-
7
- interface ArrayFieldProps extends BaseFieldProps<Record<string, any>[]> {
8
- fields: FieldSchema[];
9
- options: {
10
- addElement: (val: Record<string, any>) => void;
11
- replaceElement: (index: number, val: Record<string, any>) => void;
12
- removeElement: (index: number) => void;
13
- };
14
- error?: Record<string, React.ReactNode>;
15
- }
16
-
17
- const ArrayField: React.FC<ArrayFieldProps> = (props) => {
18
- const { fields, options, value, error = {}, name: parentName, readOnly } = props;
19
-
20
- const content = value.map((row, rowIndex) => {
21
- const onChange = (name: string, value: any) => {
22
- row[name] = value;
23
- options.replaceElement(rowIndex, row);
24
- };
25
- return fields.map((field, index) => {
26
- return (
27
- <Fragment key={index}>
28
- <FieldRender
29
- field={field}
30
- formValues={row}
31
- onChange={onChange}
32
- value={row[field.name]}
33
- error={field.name in (error[rowIndex] ?? {}) ? error[rowIndex][field.name] : undefined}
34
- readOnly={readOnly}
35
- />
36
- {!readOnly && <Button onClick={() => options.removeElement(rowIndex)}>Remove</Button>}
37
- </Fragment>
38
- );
39
- });
40
- });
41
-
42
- return (
43
- <>
44
- {typeof error === 'string' && (
45
- <Text c="red" fz="sm" fw={500}>
46
- {error}
47
- </Text>
48
- )}
49
- {content}
50
- {!readOnly && (
51
- <Button display="block" onClick={() => options.addElement({})}>
52
- Add
53
- </Button>
54
- )}
55
- </>
56
- );
57
- };
58
-
59
- export default ArrayField;
@@ -1,23 +0,0 @@
1
- import React from 'react';
2
- import { Checkbox } from '@mantine/core';
3
- import { BaseFieldProps } from '@/types/field';
4
-
5
- interface CheckFieldProps extends BaseFieldProps<boolean> {
6
- label: string;
7
- }
8
-
9
- const CheckField: React.FC<CheckFieldProps> = (props) => {
10
- const { name, onChange, value, readOnly, label } = props;
11
-
12
- return (
13
- <Checkbox
14
- name={name}
15
- checked={value}
16
- readOnly={readOnly}
17
- onChange={(e) => onChange(name, e.target.checked)}
18
- label={label}
19
- />
20
- );
21
- };
22
-
23
- export default CheckField;
@@ -1,26 +0,0 @@
1
- import dayjs from 'dayjs';
2
- import customParseFormat from 'dayjs/plugin/customParseFormat';
3
- import React from 'react';
4
- import { DateInput } from '@mantine/dates';
5
- import { BaseFieldProps } from '@/types/field';
6
-
7
- dayjs.extend(customParseFormat);
8
-
9
- interface DateFieldProps extends BaseFieldProps<Date> {}
10
-
11
- const DateField: React.FC<DateFieldProps> = (props) => {
12
- const { name, onChange, value, readOnly } = props;
13
-
14
- return (
15
- <DateInput
16
- name={name}
17
- onChange={(value) => onChange(name, value)}
18
- value={value}
19
- readOnly={readOnly}
20
- valueFormat="YYYY-MM-DD"
21
- clearable
22
- />
23
- );
24
- };
25
-
26
- export default DateField;
@@ -1,26 +0,0 @@
1
- import dayjs from 'dayjs';
2
- import customParseFormat from 'dayjs/plugin/customParseFormat';
3
- import React from 'react';
4
- import { DateTimePicker } from '@mantine/dates';
5
- import { BaseFieldProps } from '@/types/field';
6
-
7
- dayjs.extend(customParseFormat);
8
-
9
- interface DateTimeFieldProps extends BaseFieldProps<Date> {}
10
-
11
- const DateTimeField: React.FC<DateTimeFieldProps> = (props) => {
12
- const { name, onChange, value, readOnly } = props;
13
-
14
- return (
15
- <DateTimePicker
16
- name={name}
17
- onChange={(value) => onChange(name, value)}
18
- value={value}
19
- readOnly={readOnly}
20
- valueFormat="YYYY-MM-DD HH:mm:ss"
21
- clearable
22
- />
23
- );
24
- };
25
-
26
- export default DateTimeField;
@@ -1,20 +0,0 @@
1
- import React from 'react';
2
- import { NumberInput } from '@mantine/core';
3
- import { BaseFieldProps } from '@/types/field';
4
-
5
- interface NumberFieldProps extends BaseFieldProps<number> {}
6
-
7
- const NumberField: React.FC<NumberFieldProps> = (props) => {
8
- const { name, onChange, value, readOnly } = props;
9
-
10
- return (
11
- <NumberInput
12
- name={name}
13
- onChange={(value) => onChange(name, value as number)}
14
- value={value}
15
- readOnly={readOnly}
16
- />
17
- );
18
- };
19
-
20
- export default NumberField;
@@ -1,41 +0,0 @@
1
- import React from 'react';
2
- import { BaseFieldProps, FieldSchema } from '@/types/field';
3
- import FieldRender from '../FieldRender';
4
-
5
-
6
- interface ObjectFieldProps extends BaseFieldProps<Record<string, any>> {
7
- fields: FieldSchema[];
8
- formValues: Record<string, any>;
9
- error?: Record<string, React.ReactNode>;
10
- }
11
-
12
- const ObjectField: React.FC<ObjectFieldProps> = (props) => {
13
- const {
14
- fields,
15
- name: parentName,
16
- onChange: onParentChange,
17
- value,
18
- formValues,
19
- error = {},
20
- readOnly,
21
- } = props;
22
-
23
- const onChange = (name: string, value: any) => {
24
- onParentChange(`${parentName}.${name}`, value);
25
- };
26
-
27
- const content = fields.map((field, index) => (
28
- <FieldRender
29
- key={index}
30
- field={field}
31
- formValues={formValues}
32
- onChange={onChange}
33
- value={value[field.name]}
34
- error={error[field.name]}
35
- readOnly={readOnly}
36
- />
37
- ));
38
- return content;
39
- };
40
-
41
- export default ObjectField;
@@ -1,23 +0,0 @@
1
- import React from 'react';
2
- import { Select } from '@mantine/core';
3
- import { BaseFieldProps } from '@/types/field';
4
-
5
- interface SelectFieldProps extends BaseFieldProps<string> {
6
- data: { label: string; value: string }[];
7
- }
8
-
9
- const SelectField: React.FC<SelectFieldProps> = (props) => {
10
- const { data, name, onChange, value, readOnly } = props;
11
- return (
12
- <Select
13
- name={name}
14
- data={data}
15
- value={value}
16
- onChange={(value) => onChange(name, value)}
17
- readOnly={readOnly}
18
- clearable
19
- />
20
- );
21
- };
22
-
23
- export default SelectField;
@@ -1,25 +0,0 @@
1
- import React from 'react';
2
- import { Textarea } from '@mantine/core';
3
- import { BaseFieldProps } from '@/types/field';
4
-
5
- interface TextAreaFieldProps extends BaseFieldProps<string> {}
6
-
7
- const TextAreaField: React.FC<TextAreaFieldProps> = (props) => {
8
- const { name, onChange, value, readOnly } = props;
9
-
10
- return (
11
- <Textarea
12
- name={name}
13
- onChange={(e) => onChange(name, e.target.value)}
14
- value={value}
15
- readOnly={readOnly}
16
- styles={{
17
- input: {
18
- height: 200
19
- }
20
- }}
21
- />
22
- );
23
- };
24
-
25
- export default TextAreaField;
@@ -1,20 +0,0 @@
1
- import React from 'react';
2
- import { TextInput } from '@mantine/core';
3
- import { BaseFieldProps } from '@/types/field';
4
-
5
- interface TextFieldProps extends BaseFieldProps<string> {}
6
-
7
- const TextField: React.FC<TextFieldProps> = (props) => {
8
- const { name, onChange, value, readOnly } = props;
9
-
10
- return (
11
- <TextInput
12
- name={name}
13
- onChange={(value) => onChange(name, value.target.value)}
14
- value={value}
15
- readOnly={readOnly}
16
- />
17
- );
18
- };
19
-
20
- export default TextField;
@@ -1,32 +0,0 @@
1
- import React, { useRef } from 'react';
2
- import { ActionIcon } from '@mantine/core';
3
- import { TimeInput } from '@mantine/dates';
4
- import { BaseFieldProps } from '@/types/field';
5
-
6
- interface TimeFieldProps extends BaseFieldProps<string> {}
7
-
8
- const TimeField: React.FC<TimeFieldProps> = (props) => {
9
- const { name, onChange, value, readOnly } = props;
10
-
11
- const ref = useRef<HTMLInputElement>(null);
12
-
13
- const pickerControl = (
14
- <ActionIcon variant="subtle" color="gray" onClick={() => ref.current?.showPicker()}>
15
- &#x1F55B;
16
- </ActionIcon>
17
- );
18
-
19
- return (
20
- <TimeInput
21
- name={name}
22
- onChange={(e) => onChange(name, e.target.value)}
23
- value={value}
24
- readOnly={readOnly}
25
- ref={ref}
26
- rightSection={pickerControl}
27
- withSeconds
28
- />
29
- );
30
- };
31
-
32
- export default TimeField;
@@ -1,22 +0,0 @@
1
- // types/custom-render.ts
2
- import { ArrayFieldOptions, FieldSchema } from './field';
3
-
4
- export type FieldRenderCustomRender = (
5
- field: FieldSchema,
6
- value: any,
7
- error: React.ReactNode | Record<string, React.ReactNode>,
8
- onChange: (name: string, value: any) => void,
9
- formValues: Record<string, any>,
10
- options?: ArrayFieldOptions,
11
- readOnly?: true
12
- ) => React.ReactNode;
13
-
14
- export interface CustomFieldRender {
15
- field: FieldSchema;
16
- value: any;
17
- error: React.ReactNode | Record<string, React.ReactNode>;
18
- onChange: (name: string, value: any) => void;
19
- formValues: Record<string, any>;
20
- options?: ArrayFieldOptions;
21
- readOnly?: true;
22
- }
@@ -1,32 +0,0 @@
1
- export type FieldType = 'text' | 'number' | 'object' | 'array' | 'check' | 'select' | 'textarea' | 'date' | 'datetime' | 'time';
2
-
3
- export interface FieldSchema {
4
- name: string;
5
- type: FieldType;
6
- label: string;
7
- description?: string;
8
- placeholder?: string;
9
- extra?: Record<string, any>;
10
- disabled?: (values: Record<string, any>) => boolean | boolean;
11
- visible?: (values: Record<string, any>) => boolean | boolean;
12
- initialValue?: any;
13
- required?: true;
14
- readOnly?: true;
15
- // for object type only
16
- fields?: FieldSchema[];
17
- // for select type only
18
- data?: { label: string; value: string }[];
19
- }
20
-
21
- export interface BaseFieldProps<T> {
22
- name: string;
23
- value: T;
24
- onChange: (name: string, value: T | null) => void;
25
- readOnly?: true;
26
- }
27
-
28
- export type ArrayFieldOptions = {
29
- addElement: (value: Record<string, any>) => void;
30
- replaceElement: (index: number, val: Record<string, any>) => void;
31
- removeElement: (index: number) => void;
32
- };
package/src/types/form.ts DELETED
@@ -1,8 +0,0 @@
1
- import { FieldSchema } from './field';
2
-
3
- export interface FormSchema {
4
- fields: FieldSchema[];
5
- onSubmit?: (values: Record<string, any>) => void;
6
- formData?: Record<string, any>;
7
- initialValues?: Record<string, any>;
8
- }