@jswork/react-ant-form-schema 1.0.21 → 1.0.23

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 (14) hide show
  1. package/dist/main.cjs.js +1 -3
  2. package/dist/main.cjs.js.map +1 -1
  3. package/dist/main.d.mts +37 -13
  4. package/dist/main.d.ts +37 -13
  5. package/dist/main.esm.js +1 -1
  6. package/dist/main.esm.js.map +1 -1
  7. package/package.json +4 -5
  8. package/src/components/default-form.tsx +12 -0
  9. package/src/components/fieldset-groups.tsx +26 -0
  10. package/src/components/tabs-groups.tsx +31 -0
  11. package/src/index.tsx +27 -24
  12. package/src/main.tsx +2 -2
  13. package/src/types.ts +53 -0
  14. package/src/utils.ts +0 -20
package/dist/main.cjs.js CHANGED
@@ -1,4 +1,2 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var d=Object.defineProperty;var l=Object.getOwnPropertySymbols;var p=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable;var i=(e,t,o)=>t in e?d(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,a=(e,t)=>{for(var o in t||(t={}))p.call(t,o)&&i(e,o,t[o]);if(l)for(var o of l(t))h.call(t,o)&&i(e,o,t[o]);return e};var y=(e,t)=>d(e,"name",{value:t,configurable:!0});var A=(e,t)=>{var o={};for(var r in e)p.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&l)for(var r of l(e))t.indexOf(r)<0&&h.call(e,r)&&(o[r]=e[r]);return o};var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _antd = require('antd');var _niceformreact = require('@ebay/nice-form-react'); var _niceformreact2 = _interopRequireDefault(_niceformreact);function s(e,t){let o=a({},e);for(let r in t)t[r]&&typeof t[r]=="object"&&!Array.isArray(t[r])?o[r]=s(o[r]||{},t[r]):o[r]=t[r];return o}y(s,"deepMerge");var u="react-ant-form-schema",C={vertical:{labelWidth:24},horizontal:{labelWidth:4}},W={header:null,layout:"horizontal"},w=_react2.default.forwardRef((e,t)=>{let f=a(a({},W),e),{className:o,meta:r,header:F,children:b,actionsClassName:x,layout:c}=f,M=A(f,["className","meta","header","children","actionsClassName","layout"]),R=b,m=s(C[c],r),S=c==="horizontal"?m==null?void 0:m.labelWidth:0;return _react2.default.createElement(_antd.Form,a({"data-component":u,className:_classnames2.default.call(void 0, u,o),layout:c,ref:t},M),F,_react2.default.createElement(_niceformreact2.default,{meta:m}),_react2.default.createElement(_antd.Form.Item,{wrapperCol:{offset:S},className:x,style:{marginBottom:0}},R))}),E=w;var q=E;exports.default = q;
2
-
3
- module.exports = exports.default;
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var E=Object.defineProperty;var n=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,F=Object.prototype.propertyIsEnumerable;var h=(e,t,r)=>t in e?E(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,a=(e,t)=>{for(var r in t||(t={}))b.call(t,r)&&h(e,r,t[r]);if(n)for(var r of n(t))F.call(t,r)&&h(e,r,t[r]);return e};var m=(e,t)=>E(e,"name",{value:t,configurable:!0});var N=(e,t)=>{var r={};for(var o in e)b.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(e!=null&&n)for(var o of n(e))t.indexOf(o)<0&&F.call(e,o)&&(r[o]=e[o]);return r};var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _antd = require('antd');var _niceformreact = require('@ebay/nice-form-react'); var _niceformreact2 = _interopRequireDefault(_niceformreact);var k=m(({meta:e})=>_react2.default.createElement(_niceformreact2.default,{meta:e}),"DefaultForm"),g=k;var I=m(({groups:e,defaultMeta:t})=>_react2.default.createElement("div",{className:"react-ant-form-schema-groups"},e.map((r,o)=>{let s=a(a({},t),r.meta);return _react2.default.createElement("fieldset",{key:o,className:"react-ant-form-schema-fieldset"},_react2.default.createElement("legend",{className:"react-ant-form-schema-legend"},r.title),_react2.default.createElement(_niceformreact2.default,{meta:s}))})),"FieldsetGroups"),M=I;var B=m(({groups:e,defaultMeta:t,tabProps:r})=>{let o=e.map(s=>{let f=a(a({},t),s.meta);return{key:s.title,label:s.title,children:_react2.default.createElement(_niceformreact2.default,{meta:f})}});return _react2.default.createElement(_antd.Tabs,a({items:o,className:"react-ant-form-schema-tabs"},r))},"TabsGroups"),R=B;var p=(function(e){return e.Fieldset="fieldset",e.Tabs="tabs",e})({});var y="react-ant-form-schema",j={vertical:{labelWidth:24},horizontal:{labelWidth:4}},q={header:null,layout:"horizontal"},H=_react2.default.forwardRef((e,t)=>{let d=a(a({},q),e),{className:r,meta:o,header:s,children:f,actionsClassName:G,layout:u}=d,C=N(d,["className","meta","header","children","actionsClassName","layout"]),S=f,c=j[u],v=o.groups&&o.groups.length>0,z=o.groupsMode||p.Fieldset,D=m(()=>v?z===p.Tabs?_react2.default.createElement(R,{groups:o.groups,defaultMeta:c,tabProps:o.tabProps}):_react2.default.createElement(M,{groups:o.groups,defaultMeta:c}):_react2.default.createElement(g,{meta:a(a({},c),o)}),"renderContent");return _react2.default.createElement(_antd.Form,a({"data-component":y,className:_classnames2.default.call(void 0, y,r),layout:u,ref:t},C),s,D(),_react2.default.createElement(_antd.Form.Item,{wrapperCol:{offset:u==="horizontal"?c==null?void 0:c.labelWidth:0},className:G,style:{marginBottom:0}},S))}),A=H;var Ee=A;exports.GroupsMode = p; exports.default = Ee;
4
2
  //# sourceMappingURL=main.cjs.js.map
package/dist/main.cjs.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["/Users/ap7/github/react-ant-form-schema/packages/lib/dist/main.cjs.js","../src/index.tsx","../src/utils.ts","../src/main.tsx"],"names":["deepMerge","target","source","result","__spreadValues","key","Array","isArray","CLASS_NAME","DEFAULT_META","vertical","labelWidth","horizontal","defaultProps","header","layout","ReactAntdFormSchema","React","forwardRef","props","ref","_a","className","meta","children","actionsClassName","rest","footerNode","_meta","_offset","Form","data-component","cx","NiceForm","Item","wrapperCol","offset","style","marginBottom","index_default","main_default"],"mappings":"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","file":"/Users/ap7/github/react-ant-form-schema/packages/lib/dist/main.cjs.js","sourcesContent":[null,"import cx from 'classnames';\nimport React, { ReactNode } from 'react';\nimport { Form, FormInstance, FormProps } from 'antd';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\nimport { deepMerge } from './utils';\n\nconst CLASS_NAME = 'react-ant-form-schema';\nconst DEFAULT_META = {\n vertical: {\n labelWidth: 24,\n },\n // 这个是 nice-form-react 默认的 meta 数据，其它设置不生效\n // wrapperProps.labelCol.span 这个属性是 deprecated 的，请使用 labelWidth\n horizontal: {\n labelWidth: 4,\n },\n};\n\nexport type ReactAntdFormSchemaProps = {\n /**\n * The form schema meta data.\n */\n meta: NiceFormMeta;\n /**\n * The header content.\n */\n header?: ReactNode;\n /**\n * The form actions className.\n */\n actionsClassName?: string;\n} & FormProps;\n\nconst defaultProps: Partial<ReactAntdFormSchemaProps> = {\n header: null,\n layout: 'horizontal',\n};\n\nconst ReactAntdFormSchema = React.forwardRef<FormInstance, ReactAntdFormSchemaProps>(\n (props, ref) => {\n const { className, meta, header, children, actionsClassName, layout, ...rest } = {\n ...defaultProps,\n ...props,\n };\n const footerNode = children as ReactNode;\n const _meta = deepMerge(DEFAULT_META[layout!], meta) as NiceFormMeta;\n const _offset = layout === 'horizontal' ? _meta?.labelWidth : 0;\n\n return (\n <Form\n data-component={CLASS_NAME}\n className={cx(CLASS_NAME, className)}\n layout={layout}\n ref={ref}\n {...rest}>\n {header}\n <NiceForm meta={_meta} />\n <Form.Item\n wrapperCol={{ offset: _offset }}\n className={actionsClassName}\n style={{ marginBottom: 0 }}>\n {footerNode}\n </Form.Item>\n </Form>\n );\n }\n);\n\nexport default ReactAntdFormSchema;\n","/**\n * @Author: aric 1290657123@qq.com\n * @Date: 2025-10-18 21:20:55\n * @LastEditors: aric 1290657123@qq.com\n * @LastEditTime: 2025-10-22 08:55:52\n */\n\ntype AnyObject = { [key: string]: any };\n\nexport function deepMerge(target: AnyObject, source: AnyObject) {\n const result = { ...target };\n for (const key in source) {\n if (source[key] && typeof source[key] === 'object' && !Array.isArray(source[key])) {\n result[key] = deepMerge(result[key] || {}, source[key]);\n } else {\n result[key] = source[key];\n }\n }\n return result;\n}\n","import ReactAntdFormSchema from '.';\nimport { ReactAntdFormSchemaProps } from '.';\n\nexport default ReactAntdFormSchema;\nexport type { ReactAntdFormSchemaProps };\n"]}
1
+ {"version":3,"sources":["/Users/feizheng/github/react-ant-form-schema/packages/lib/dist/main.cjs.js","../src/index.tsx","../src/components/default-form.tsx","../src/components/fieldset-groups.tsx","../src/components/tabs-groups.tsx","../src/types.ts","../src/main.tsx"],"names":["DefaultForm","__name","meta","React","NiceForm","default_form_default","FieldsetGroups","groups","defaultMeta","div","className","map","group","index","groupMeta","__spreadValues","fieldset","key","legend","title","fieldset_groups_default","TabsGroups","tabProps","tabItems","label","children","Tabs","items","tabs_groups_default","GroupsMode","CLASS_NAME","DEFAULT_META","vertical","labelWidth","horizontal","defaultProps","header","layout","ReactAntdFormSchema","forwardRef","props","ref","_a","actionsClassName","rest","footerNode","isGroupsMode","length","groupsMode","Fieldset","renderContent","Form","data-component","cx","Item","wrapperCol","offset","style","marginBottom","index_default","main_default"],"mappings":"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","file":"/Users/feizheng/github/react-ant-form-schema/packages/lib/dist/main.cjs.js","sourcesContent":[null,"import cx from 'classnames';\nimport React, { type ReactNode } from 'react';\nimport { Form, type FormInstance } from 'antd';\nimport DefaultForm from './components/default-form';\nimport FieldsetGroups from './components/fieldset-groups';\nimport TabsGroups from './components/tabs-groups';\nimport { ReactAntdFormSchemaProps, GroupsMode } from './types';\n\nconst CLASS_NAME = 'react-ant-form-schema';\nconst DEFAULT_META = {\n vertical: {\n labelWidth: 24,\n },\n // 这个是 nice-form-react 默认的 meta 数据，其它设置不生效\n // wrapperProps.labelCol.span 这个属性是 deprecated 的，请使用 labelWidth\n horizontal: {\n labelWidth: 4,\n },\n};\n\nconst defaultProps: Partial<ReactAntdFormSchemaProps> = {\n header: null,\n layout: 'horizontal',\n};\n\nconst ReactAntdFormSchema = React.forwardRef<FormInstance, ReactAntdFormSchemaProps>(\n (props, ref) => {\n const { className, meta, header, children, actionsClassName, layout, ...rest } = {\n ...defaultProps,\n ...props,\n };\n const footerNode = children as ReactNode;\n const defaultMeta = DEFAULT_META[layout!];\n\n // Check if groups mode is enabled\n const isGroupsMode = meta.groups && meta.groups.length > 0;\n const groupsMode = meta.groupsMode || GroupsMode.Fieldset;\n\n // Render form content based on mode\n const renderContent = () => {\n if (isGroupsMode) {\n if (groupsMode === GroupsMode.Tabs) {\n return <TabsGroups groups={meta.groups!} defaultMeta={defaultMeta} tabProps={meta.tabProps} />;\n }\n // fieldset mode (default)\n return <FieldsetGroups groups={meta.groups!} defaultMeta={defaultMeta} />;\n }\n // standard mode\n return <DefaultForm meta={{ ...defaultMeta, ...meta }} />;\n };\n\n return (\n <Form\n data-component={CLASS_NAME}\n className={cx(CLASS_NAME, className)}\n layout={layout}\n ref={ref}\n {...rest}>\n {header}\n {renderContent()}\n <Form.Item\n wrapperCol={{ offset: layout === 'horizontal' ? defaultMeta?.labelWidth : 0 }}\n className={actionsClassName}\n style={{ marginBottom: 0 }}>\n {footerNode}\n </Form.Item>\n </Form>\n );\n },\n);\n\nexport default ReactAntdFormSchema;\n","import React from 'react';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\n\nexport type DefaultFormProps = {\n meta: NiceFormMeta;\n};\n\nconst DefaultForm = ({ meta }: DefaultFormProps) => {\n return <NiceForm meta={meta} />;\n};\n\nexport default DefaultForm;\n","import React from 'react';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\nimport { NiceFormGroup } from '../types';\n\nexport type FieldsetGroupsProps = {\n groups: NiceFormGroup[];\n defaultMeta: Record<string, any>;\n};\n\nconst FieldsetGroups = ({ groups, defaultMeta }: FieldsetGroupsProps) => {\n return (\n <div className=\"react-ant-form-schema-groups\">\n {groups.map((group, index) => {\n const groupMeta = { ...defaultMeta, ...group.meta } as NiceFormMeta;\n return (\n <fieldset key={index} className=\"react-ant-form-schema-fieldset\">\n <legend className=\"react-ant-form-schema-legend\">{group.title}</legend>\n <NiceForm meta={groupMeta} />\n </fieldset>\n );\n })}\n </div>\n );\n};\n\nexport default FieldsetGroups;\n","import React from 'react';\nimport { Tabs, TabsProps } from 'antd';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\nimport { NiceFormGroup } from '../types';\n\nexport type TabsGroupsProps = {\n groups: NiceFormGroup[];\n defaultMeta: Record<string, any>;\n tabProps?: TabsProps;\n};\n\nconst TabsGroups = ({ groups, defaultMeta, tabProps }: TabsGroupsProps) => {\n const tabItems = groups.map((group) => {\n const groupMeta = { ...defaultMeta, ...group.meta } as NiceFormMeta;\n return {\n key: group.title,\n label: group.title,\n children: <NiceForm meta={groupMeta} />,\n };\n });\n\n return (\n <Tabs\n items={tabItems}\n className=\"react-ant-form-schema-tabs\"\n {...tabProps}\n />\n );\n};\n\nexport default TabsGroups;\n","import { TabsProps } from 'antd';\nimport { NiceFormMeta } from '@ebay/nice-form-react';\nimport { ReactNode } from 'react';\nimport { FormProps } from 'antd';\n\nexport enum GroupsMode {\n Fieldset = 'fieldset',\n Tabs = 'tabs',\n}\n\nexport type NiceFormGroup = {\n /**\n * The group title displayed in legend or tab.\n */\n title: string;\n /**\n * The form meta for this group.\n */\n meta: NiceFormMeta;\n};\n\nexport type ReactAntdFormSchemaMeta = NiceFormMeta & {\n /**\n * Form groups for grouped mode.\n * When groups is provided, fields will be rendered in groups.\n */\n groups?: NiceFormGroup[];\n /**\n * Display mode for groups.\n * - 'fieldset': Render groups as fieldset/legend elements\n * - 'tabs': Render groups as tabs\n */\n groupsMode?: GroupsMode;\n /**\n * Props to pass to Tabs component when groupsMode is 'tabs'.\n */\n tabProps?: TabsProps;\n};\n\nexport type ReactAntdFormSchemaProps = {\n /**\n * The form schema meta data.\n */\n meta: ReactAntdFormSchemaMeta;\n /**\n * The header content.\n */\n header?: ReactNode;\n /**\n * The form actions className.\n */\n actionsClassName?: string;\n} & FormProps;\n","import ReactAntdFormSchema from '.';\nexport type { ReactAntdFormSchemaProps, ReactAntdFormSchemaMeta } from './types';\nexport { GroupsMode } from './types';\n\nexport default ReactAntdFormSchema;\n"]}
package/dist/main.d.mts CHANGED
@@ -1,26 +1,44 @@
1
- import React, { ReactNode } from 'react';
2
- import { FormProps, FormInstance } from 'antd';
1
+ import * as antd from 'antd';
2
+ import { TabsProps, FormProps, FormInstance } from 'antd';
3
3
  import { NiceFormMeta } from '@ebay/nice-form-react';
4
+ import React, { ReactNode } from 'react';
4
5
 
5
- type ReactAntdFormSchemaProps = {
6
+ declare enum GroupsMode {
7
+ Fieldset = "fieldset",
8
+ Tabs = "tabs"
9
+ }
10
+ type NiceFormGroup = {
6
11
  /**
7
- * The form schema meta data.
12
+ * The group title displayed in legend or tab.
13
+ */
14
+ title: string;
15
+ /**
16
+ * The form meta for this group.
8
17
  */
9
18
  meta: NiceFormMeta;
19
+ };
20
+ type ReactAntdFormSchemaMeta = NiceFormMeta & {
10
21
  /**
11
- * The header content.
22
+ * Form groups for grouped mode.
23
+ * When groups is provided, fields will be rendered in groups.
12
24
  */
13
- header?: ReactNode;
25
+ groups?: NiceFormGroup[];
14
26
  /**
15
- * The form actions className.
27
+ * Display mode for groups.
28
+ * - 'fieldset': Render groups as fieldset/legend elements
29
+ * - 'tabs': Render groups as tabs
16
30
  */
17
- actionsClassName?: string;
18
- } & FormProps;
19
- declare const ReactAntdFormSchema: React.ForwardRefExoticComponent<{
31
+ groupsMode?: GroupsMode;
32
+ /**
33
+ * Props to pass to Tabs component when groupsMode is 'tabs'.
34
+ */
35
+ tabProps?: TabsProps;
36
+ };
37
+ type ReactAntdFormSchemaProps = {
20
38
  /**
21
39
  * The form schema meta data.
22
40
  */
23
- meta: NiceFormMeta;
41
+ meta: ReactAntdFormSchemaMeta;
24
42
  /**
25
43
  * The header content.
26
44
  */
@@ -29,6 +47,12 @@ declare const ReactAntdFormSchema: React.ForwardRefExoticComponent<{
29
47
  * The form actions className.
30
48
  */
31
49
  actionsClassName?: string;
32
- } & FormProps<any> & React.RefAttributes<FormInstance<any>>>;
50
+ } & FormProps;
51
+
52
+ declare const ReactAntdFormSchema: React.ForwardRefExoticComponent<{
53
+ meta: ReactAntdFormSchemaMeta;
54
+ header?: ReactNode;
55
+ actionsClassName?: string;
56
+ } & antd.FormProps<any> & React.RefAttributes<FormInstance<any>>>;
33
57
 
34
- export { type ReactAntdFormSchemaProps, ReactAntdFormSchema as default };
58
+ export { GroupsMode, type ReactAntdFormSchemaMeta, type ReactAntdFormSchemaProps, ReactAntdFormSchema as default };
package/dist/main.d.ts CHANGED
@@ -1,26 +1,44 @@
1
- import React, { ReactNode } from 'react';
2
- import { FormProps, FormInstance } from 'antd';
1
+ import * as antd from 'antd';
2
+ import { TabsProps, FormProps, FormInstance } from 'antd';
3
3
  import { NiceFormMeta } from '@ebay/nice-form-react';
4
+ import React, { ReactNode } from 'react';
4
5
 
5
- type ReactAntdFormSchemaProps = {
6
+ declare enum GroupsMode {
7
+ Fieldset = "fieldset",
8
+ Tabs = "tabs"
9
+ }
10
+ type NiceFormGroup = {
6
11
  /**
7
- * The form schema meta data.
12
+ * The group title displayed in legend or tab.
13
+ */
14
+ title: string;
15
+ /**
16
+ * The form meta for this group.
8
17
  */
9
18
  meta: NiceFormMeta;
19
+ };
20
+ type ReactAntdFormSchemaMeta = NiceFormMeta & {
10
21
  /**
11
- * The header content.
22
+ * Form groups for grouped mode.
23
+ * When groups is provided, fields will be rendered in groups.
12
24
  */
13
- header?: ReactNode;
25
+ groups?: NiceFormGroup[];
14
26
  /**
15
- * The form actions className.
27
+ * Display mode for groups.
28
+ * - 'fieldset': Render groups as fieldset/legend elements
29
+ * - 'tabs': Render groups as tabs
16
30
  */
17
- actionsClassName?: string;
18
- } & FormProps;
19
- declare const ReactAntdFormSchema: React.ForwardRefExoticComponent<{
31
+ groupsMode?: GroupsMode;
32
+ /**
33
+ * Props to pass to Tabs component when groupsMode is 'tabs'.
34
+ */
35
+ tabProps?: TabsProps;
36
+ };
37
+ type ReactAntdFormSchemaProps = {
20
38
  /**
21
39
  * The form schema meta data.
22
40
  */
23
- meta: NiceFormMeta;
41
+ meta: ReactAntdFormSchemaMeta;
24
42
  /**
25
43
  * The header content.
26
44
  */
@@ -29,8 +47,14 @@ declare const ReactAntdFormSchema: React.ForwardRefExoticComponent<{
29
47
  * The form actions className.
30
48
  */
31
49
  actionsClassName?: string;
32
- } & FormProps<any> & React.RefAttributes<FormInstance<any>>>;
50
+ } & FormProps;
51
+
52
+ declare const ReactAntdFormSchema: React.ForwardRefExoticComponent<{
53
+ meta: ReactAntdFormSchemaMeta;
54
+ header?: ReactNode;
55
+ actionsClassName?: string;
56
+ } & antd.FormProps<any> & React.RefAttributes<FormInstance<any>>>;
33
57
 
34
58
  // @ts-ignore
35
59
  export = ReactAntdFormSchema;
36
- export type { ReactAntdFormSchemaProps };
60
+ export { GroupsMode, type ReactAntdFormSchemaMeta, type ReactAntdFormSchemaProps };
package/dist/main.esm.js CHANGED
@@ -1,2 +1,2 @@
1
- var d=Object.defineProperty;var l=Object.getOwnPropertySymbols;var p=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable;var i=(e,t,o)=>t in e?d(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,a=(e,t)=>{for(var o in t||(t={}))p.call(t,o)&&i(e,o,t[o]);if(l)for(var o of l(t))h.call(t,o)&&i(e,o,t[o]);return e};var y=(e,t)=>d(e,"name",{value:t,configurable:!0});var A=(e,t)=>{var o={};for(var r in e)p.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&l)for(var r of l(e))t.indexOf(r)<0&&h.call(e,r)&&(o[r]=e[r]);return o};import g from"classnames";import n from"react";import{Form as N}from"antd";import z from"@ebay/nice-form-react";function s(e,t){let o=a({},e);for(let r in t)t[r]&&typeof t[r]=="object"&&!Array.isArray(t[r])?o[r]=s(o[r]||{},t[r]):o[r]=t[r];return o}y(s,"deepMerge");var u="react-ant-form-schema",C={vertical:{labelWidth:24},horizontal:{labelWidth:4}},W={header:null,layout:"horizontal"},w=n.forwardRef((e,t)=>{let f=a(a({},W),e),{className:o,meta:r,header:F,children:b,actionsClassName:x,layout:c}=f,M=A(f,["className","meta","header","children","actionsClassName","layout"]),R=b,m=s(C[c],r),S=c==="horizontal"?m==null?void 0:m.labelWidth:0;return n.createElement(N,a({"data-component":u,className:g(u,o),layout:c,ref:t},M),F,n.createElement(z,{meta:m}),n.createElement(N.Item,{wrapperCol:{offset:S},className:x,style:{marginBottom:0}},R))}),E=w;var q=E;export{q as default};
1
+ var E=Object.defineProperty;var n=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,F=Object.prototype.propertyIsEnumerable;var h=(e,t,r)=>t in e?E(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,a=(e,t)=>{for(var r in t||(t={}))b.call(t,r)&&h(e,r,t[r]);if(n)for(var r of n(t))F.call(t,r)&&h(e,r,t[r]);return e};var m=(e,t)=>E(e,"name",{value:t,configurable:!0});var N=(e,t)=>{var r={};for(var o in e)b.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(e!=null&&n)for(var o of n(e))t.indexOf(o)<0&&F.call(e,o)&&(r[o]=e[o]);return r};import U from"classnames";import l from"react";import{Form as T}from"antd";import P from"react";import W from"@ebay/nice-form-react";var k=m(({meta:e})=>P.createElement(W,{meta:e}),"DefaultForm"),g=k;import i from"react";import w from"@ebay/nice-form-react";var I=m(({groups:e,defaultMeta:t})=>i.createElement("div",{className:"react-ant-form-schema-groups"},e.map((r,o)=>{let s=a(a({},t),r.meta);return i.createElement("fieldset",{key:o,className:"react-ant-form-schema-fieldset"},i.createElement("legend",{className:"react-ant-form-schema-legend"},r.title),i.createElement(w,{meta:s}))})),"FieldsetGroups"),M=I;import x from"react";import{Tabs as L}from"antd";import _ from"@ebay/nice-form-react";var B=m(({groups:e,defaultMeta:t,tabProps:r})=>{let o=e.map(s=>{let f=a(a({},t),s.meta);return{key:s.title,label:s.title,children:x.createElement(_,{meta:f})}});return x.createElement(L,a({items:o,className:"react-ant-form-schema-tabs"},r))},"TabsGroups"),R=B;var p=(function(e){return e.Fieldset="fieldset",e.Tabs="tabs",e})({});var y="react-ant-form-schema",j={vertical:{labelWidth:24},horizontal:{labelWidth:4}},q={header:null,layout:"horizontal"},H=l.forwardRef((e,t)=>{let d=a(a({},q),e),{className:r,meta:o,header:s,children:f,actionsClassName:G,layout:u}=d,C=N(d,["className","meta","header","children","actionsClassName","layout"]),S=f,c=j[u],v=o.groups&&o.groups.length>0,z=o.groupsMode||p.Fieldset,D=m(()=>v?z===p.Tabs?l.createElement(R,{groups:o.groups,defaultMeta:c,tabProps:o.tabProps}):l.createElement(M,{groups:o.groups,defaultMeta:c}):l.createElement(g,{meta:a(a({},c),o)}),"renderContent");return l.createElement(T,a({"data-component":y,className:U(y,r),layout:u,ref:t},C),s,D(),l.createElement(T.Item,{wrapperCol:{offset:u==="horizontal"?c==null?void 0:c.labelWidth:0},className:G,style:{marginBottom:0}},S))}),A=H;var Ee=A;export{p as GroupsMode,Ee as default};
2
2
  //# sourceMappingURL=main.esm.js.map
package/dist/main.esm.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.tsx","../src/utils.ts","../src/main.tsx"],"sourcesContent":["import cx from 'classnames';\nimport React, { ReactNode } from 'react';\nimport { Form, FormInstance, FormProps } from 'antd';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\nimport { deepMerge } from './utils';\n\nconst CLASS_NAME = 'react-ant-form-schema';\nconst DEFAULT_META = {\n vertical: {\n labelWidth: 24,\n },\n // 这个是 nice-form-react 默认的 meta 数据，其它设置不生效\n // wrapperProps.labelCol.span 这个属性是 deprecated 的，请使用 labelWidth\n horizontal: {\n labelWidth: 4,\n },\n};\n\nexport type ReactAntdFormSchemaProps = {\n /**\n * The form schema meta data.\n */\n meta: NiceFormMeta;\n /**\n * The header content.\n */\n header?: ReactNode;\n /**\n * The form actions className.\n */\n actionsClassName?: string;\n} & FormProps;\n\nconst defaultProps: Partial<ReactAntdFormSchemaProps> = {\n header: null,\n layout: 'horizontal',\n};\n\nconst ReactAntdFormSchema = React.forwardRef<FormInstance, ReactAntdFormSchemaProps>(\n (props, ref) => {\n const { className, meta, header, children, actionsClassName, layout, ...rest } = {\n ...defaultProps,\n ...props,\n };\n const footerNode = children as ReactNode;\n const _meta = deepMerge(DEFAULT_META[layout!], meta) as NiceFormMeta;\n const _offset = layout === 'horizontal' ? _meta?.labelWidth : 0;\n\n return (\n <Form\n data-component={CLASS_NAME}\n className={cx(CLASS_NAME, className)}\n layout={layout}\n ref={ref}\n {...rest}>\n {header}\n <NiceForm meta={_meta} />\n <Form.Item\n wrapperCol={{ offset: _offset }}\n className={actionsClassName}\n style={{ marginBottom: 0 }}>\n {footerNode}\n </Form.Item>\n </Form>\n );\n }\n);\n\nexport default ReactAntdFormSchema;\n","/**\n * @Author: aric 1290657123@qq.com\n * @Date: 2025-10-18 21:20:55\n * @LastEditors: aric 1290657123@qq.com\n * @LastEditTime: 2025-10-22 08:55:52\n */\n\ntype AnyObject = { [key: string]: any };\n\nexport function deepMerge(target: AnyObject, source: AnyObject) {\n const result = { ...target };\n for (const key in source) {\n if (source[key] && typeof source[key] === 'object' && !Array.isArray(source[key])) {\n result[key] = deepMerge(result[key] || {}, source[key]);\n } else {\n result[key] = source[key];\n }\n }\n return result;\n}\n","import ReactAntdFormSchema from '.';\nimport { ReactAntdFormSchemaProps } from '.';\n\nexport default ReactAntdFormSchema;\nexport type { ReactAntdFormSchemaProps };\n"],"mappings":"8iBAAA,OAAOA,MAAQ,aACf,OAAOC,MAA0B,QACjC,OAASC,QAAAA,MAAqC,OAC9C,OAAOC,MAAgC,wBCMhC,SAASC,EAAUC,EAAmBC,EAAiB,CAC5D,IAAMC,EAASC,EAAA,GAAKH,GACpB,QAAWI,KAAOH,EACZA,EAAOG,CAAAA,GAAQ,OAAOH,EAAOG,CAAAA,GAAS,UAAY,CAACC,MAAMC,QAAQL,EAAOG,CAAAA,CAAI,EAC9EF,EAAOE,CAAAA,EAAOL,EAAUG,EAAOE,CAAAA,GAAQ,CAAC,EAAGH,EAAOG,CAAAA,CAAI,EAEtDF,EAAOE,CAAAA,EAAOH,EAAOG,CAAAA,EAGzB,OAAOF,CACT,CAVgBH,EAAAA,EAAAA,aDHhB,IAAMQ,EAAa,wBACbC,EAAe,CACnBC,SAAU,CACRC,WAAY,EACd,EAGAC,WAAY,CACVD,WAAY,CACd,CACF,EAiBME,EAAkD,CACtDC,OAAQ,KACRC,OAAQ,YACV,EAEMC,EAAsBC,EAAMC,WAChC,CAACC,EAAOC,IAAAA,CACN,IAAiFC,EAAAC,IAAA,GAC5ET,GACAM,GAFGI,WAAAA,EAAWC,KAAAA,EAAMV,OAAAA,EAAQW,SAAAA,EAAUC,iBAAAA,EAAkBX,OAAAA,CAxCjE,EAwCqFM,EAATM,EAAAA,EAASN,EAATM,CAAhEJ,YAAWC,OAAMV,SAAQW,WAAUC,mBAAkBX,WAIvDa,EAAaH,EACbI,EAAQC,EAAUrB,EAAaM,CAAAA,EAAUS,CAAAA,EACzCO,EAAUhB,IAAW,aAAec,GAAAA,YAAAA,EAAOlB,WAAa,EAE9D,OACEM,EAAA,cAACe,EAAAA,EAAAA,CACCC,iBAAgBzB,EAChBe,UAAWW,EAAG1B,EAAYe,CAAAA,EAC1BR,OAAQA,EACRK,IAAKA,GACDO,GACHb,EACDG,EAAA,cAACkB,EAAAA,CAASX,KAAMK,IAChBZ,EAAA,cAACe,EAAKI,KAAI,CACRC,WAAY,CAAEC,OAAQP,CAAQ,EAC9BR,UAAWG,EACXa,MAAO,CAAEC,aAAc,CAAE,GACxBZ,CAAAA,CAAAA,CAIT,CAAA,EAGFa,EAAezB,EEjEf,IAAA0B,EAAeC","names":["cx","React","Form","NiceForm","deepMerge","target","source","result","__spreadValues","key","Array","isArray","CLASS_NAME","DEFAULT_META","vertical","labelWidth","horizontal","defaultProps","header","layout","ReactAntdFormSchema","React","forwardRef","props","ref","_a","__spreadValues","className","meta","children","actionsClassName","rest","footerNode","_meta","deepMerge","_offset","Form","data-component","cx","NiceForm","Item","wrapperCol","offset","style","marginBottom","index_default","main_default","ReactAntdFormSchema"]}
1
+ {"version":3,"sources":["../src/index.tsx","../src/components/default-form.tsx","../src/components/fieldset-groups.tsx","../src/components/tabs-groups.tsx","../src/types.ts","../src/main.tsx"],"sourcesContent":["import cx from 'classnames';\nimport React, { type ReactNode } from 'react';\nimport { Form, type FormInstance } from 'antd';\nimport DefaultForm from './components/default-form';\nimport FieldsetGroups from './components/fieldset-groups';\nimport TabsGroups from './components/tabs-groups';\nimport { ReactAntdFormSchemaProps, GroupsMode } from './types';\n\nconst CLASS_NAME = 'react-ant-form-schema';\nconst DEFAULT_META = {\n vertical: {\n labelWidth: 24,\n },\n // 这个是 nice-form-react 默认的 meta 数据，其它设置不生效\n // wrapperProps.labelCol.span 这个属性是 deprecated 的，请使用 labelWidth\n horizontal: {\n labelWidth: 4,\n },\n};\n\nconst defaultProps: Partial<ReactAntdFormSchemaProps> = {\n header: null,\n layout: 'horizontal',\n};\n\nconst ReactAntdFormSchema = React.forwardRef<FormInstance, ReactAntdFormSchemaProps>(\n (props, ref) => {\n const { className, meta, header, children, actionsClassName, layout, ...rest } = {\n ...defaultProps,\n ...props,\n };\n const footerNode = children as ReactNode;\n const defaultMeta = DEFAULT_META[layout!];\n\n // Check if groups mode is enabled\n const isGroupsMode = meta.groups && meta.groups.length > 0;\n const groupsMode = meta.groupsMode || GroupsMode.Fieldset;\n\n // Render form content based on mode\n const renderContent = () => {\n if (isGroupsMode) {\n if (groupsMode === GroupsMode.Tabs) {\n return <TabsGroups groups={meta.groups!} defaultMeta={defaultMeta} tabProps={meta.tabProps} />;\n }\n // fieldset mode (default)\n return <FieldsetGroups groups={meta.groups!} defaultMeta={defaultMeta} />;\n }\n // standard mode\n return <DefaultForm meta={{ ...defaultMeta, ...meta }} />;\n };\n\n return (\n <Form\n data-component={CLASS_NAME}\n className={cx(CLASS_NAME, className)}\n layout={layout}\n ref={ref}\n {...rest}>\n {header}\n {renderContent()}\n <Form.Item\n wrapperCol={{ offset: layout === 'horizontal' ? defaultMeta?.labelWidth : 0 }}\n className={actionsClassName}\n style={{ marginBottom: 0 }}>\n {footerNode}\n </Form.Item>\n </Form>\n );\n },\n);\n\nexport default ReactAntdFormSchema;\n","import React from 'react';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\n\nexport type DefaultFormProps = {\n meta: NiceFormMeta;\n};\n\nconst DefaultForm = ({ meta }: DefaultFormProps) => {\n return <NiceForm meta={meta} />;\n};\n\nexport default DefaultForm;\n","import React from 'react';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\nimport { NiceFormGroup } from '../types';\n\nexport type FieldsetGroupsProps = {\n groups: NiceFormGroup[];\n defaultMeta: Record<string, any>;\n};\n\nconst FieldsetGroups = ({ groups, defaultMeta }: FieldsetGroupsProps) => {\n return (\n <div className=\"react-ant-form-schema-groups\">\n {groups.map((group, index) => {\n const groupMeta = { ...defaultMeta, ...group.meta } as NiceFormMeta;\n return (\n <fieldset key={index} className=\"react-ant-form-schema-fieldset\">\n <legend className=\"react-ant-form-schema-legend\">{group.title}</legend>\n <NiceForm meta={groupMeta} />\n </fieldset>\n );\n })}\n </div>\n );\n};\n\nexport default FieldsetGroups;\n","import React from 'react';\nimport { Tabs, TabsProps } from 'antd';\nimport NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';\nimport { NiceFormGroup } from '../types';\n\nexport type TabsGroupsProps = {\n groups: NiceFormGroup[];\n defaultMeta: Record<string, any>;\n tabProps?: TabsProps;\n};\n\nconst TabsGroups = ({ groups, defaultMeta, tabProps }: TabsGroupsProps) => {\n const tabItems = groups.map((group) => {\n const groupMeta = { ...defaultMeta, ...group.meta } as NiceFormMeta;\n return {\n key: group.title,\n label: group.title,\n children: <NiceForm meta={groupMeta} />,\n };\n });\n\n return (\n <Tabs\n items={tabItems}\n className=\"react-ant-form-schema-tabs\"\n {...tabProps}\n />\n );\n};\n\nexport default TabsGroups;\n","import { TabsProps } from 'antd';\nimport { NiceFormMeta } from '@ebay/nice-form-react';\nimport { ReactNode } from 'react';\nimport { FormProps } from 'antd';\n\nexport enum GroupsMode {\n Fieldset = 'fieldset',\n Tabs = 'tabs',\n}\n\nexport type NiceFormGroup = {\n /**\n * The group title displayed in legend or tab.\n */\n title: string;\n /**\n * The form meta for this group.\n */\n meta: NiceFormMeta;\n};\n\nexport type ReactAntdFormSchemaMeta = NiceFormMeta & {\n /**\n * Form groups for grouped mode.\n * When groups is provided, fields will be rendered in groups.\n */\n groups?: NiceFormGroup[];\n /**\n * Display mode for groups.\n * - 'fieldset': Render groups as fieldset/legend elements\n * - 'tabs': Render groups as tabs\n */\n groupsMode?: GroupsMode;\n /**\n * Props to pass to Tabs component when groupsMode is 'tabs'.\n */\n tabProps?: TabsProps;\n};\n\nexport type ReactAntdFormSchemaProps = {\n /**\n * The form schema meta data.\n */\n meta: ReactAntdFormSchemaMeta;\n /**\n * The header content.\n */\n header?: ReactNode;\n /**\n * The form actions className.\n */\n actionsClassName?: string;\n} & FormProps;\n","import ReactAntdFormSchema from '.';\nexport type { ReactAntdFormSchemaProps, ReactAntdFormSchemaMeta } from './types';\nexport { GroupsMode } from './types';\n\nexport default ReactAntdFormSchema;\n"],"mappings":"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","names":["cx","React","Form","React","NiceForm","DefaultForm","__name","meta","React","NiceForm","default_form_default","React","NiceForm","FieldsetGroups","__name","groups","defaultMeta","React","div","className","map","group","index","groupMeta","__spreadValues","meta","fieldset","key","legend","title","NiceForm","fieldset_groups_default","React","Tabs","NiceForm","TabsGroups","__name","groups","defaultMeta","tabProps","tabItems","map","group","groupMeta","__spreadValues","meta","key","title","label","children","React","NiceForm","Tabs","items","className","tabs_groups_default","GroupsMode","CLASS_NAME","DEFAULT_META","vertical","labelWidth","horizontal","defaultProps","header","layout","ReactAntdFormSchema","React","forwardRef","props","ref","_a","__spreadValues","className","meta","children","actionsClassName","rest","footerNode","defaultMeta","isGroupsMode","groups","length","groupsMode","GroupsMode","Fieldset","renderContent","__name","Tabs","TabsGroups","tabProps","FieldsetGroups","DefaultForm","Form","data-component","cx","Item","wrapperCol","offset","style","marginBottom","index_default","main_default","ReactAntdFormSchema"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jswork/react-ant-form-schema",
3
- "version": "1.0.21",
3
+ "version": "1.0.23",
4
4
  "main": "dist/main.cjs.js",
5
5
  "module": "dist/main.esm.js",
6
6
  "types": "dist/main.d.ts",
@@ -26,11 +26,13 @@
26
26
  "react": "^18.2.0",
27
27
  "react-dom": "^18.2.0",
28
28
  "tsup": "^8.2.4",
29
- "typescript": "^5.2.2"
29
+ "typescript": "^5.2.2",
30
+ "@ebay/nice-form-react": "^2.0.3"
30
31
  },
31
32
  "peerDependencies": {
32
33
  "classnames": "*",
33
34
  "react": "*",
35
+ "@ebay/nice-form-react": "*",
34
36
  "react-dom": "*",
35
37
  "antd": "^5.27.5"
36
38
  },
@@ -38,9 +40,6 @@
38
40
  "access": "public",
39
41
  "registry": "https://registry.npmjs.org"
40
42
  },
41
- "dependencies": {
42
- "@ebay/nice-form-react": "^2.0.3"
43
- },
44
43
  "keywords": [
45
44
  "form",
46
45
  "schema",
package/src/components/default-form.tsx ADDED
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';
3
+
4
+ export type DefaultFormProps = {
5
+ meta: NiceFormMeta;
6
+ };
7
+
8
+ const DefaultForm = ({ meta }: DefaultFormProps) => {
9
+ return <NiceForm meta={meta} />;
10
+ };
11
+
12
+ export default DefaultForm;
package/src/components/fieldset-groups.tsx ADDED
@@ -0,0 +1,26 @@
1
+ import React from 'react';
2
+ import NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';
3
+ import { NiceFormGroup } from '../types';
4
+
5
+ export type FieldsetGroupsProps = {
6
+ groups: NiceFormGroup[];
7
+ defaultMeta: Record<string, any>;
8
+ };
9
+
10
+ const FieldsetGroups = ({ groups, defaultMeta }: FieldsetGroupsProps) => {
11
+ return (
12
+ <div className="react-ant-form-schema-groups">
13
+ {groups.map((group, index) => {
14
+ const groupMeta = { ...defaultMeta, ...group.meta } as NiceFormMeta;
15
+ return (
16
+ <fieldset key={index} className="react-ant-form-schema-fieldset">
17
+ <legend className="react-ant-form-schema-legend">{group.title}</legend>
18
+ <NiceForm meta={groupMeta} />
19
+ </fieldset>
20
+ );
21
+ })}
22
+ </div>
23
+ );
24
+ };
25
+
26
+ export default FieldsetGroups;
package/src/components/tabs-groups.tsx ADDED
@@ -0,0 +1,31 @@
1
+ import React from 'react';
2
+ import { Tabs, TabsProps } from 'antd';
3
+ import NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';
4
+ import { NiceFormGroup } from '../types';
5
+
6
+ export type TabsGroupsProps = {
7
+ groups: NiceFormGroup[];
8
+ defaultMeta: Record<string, any>;
9
+ tabProps?: TabsProps;
10
+ };
11
+
12
+ const TabsGroups = ({ groups, defaultMeta, tabProps }: TabsGroupsProps) => {
13
+ const tabItems = groups.map((group) => {
14
+ const groupMeta = { ...defaultMeta, ...group.meta } as NiceFormMeta;
15
+ return {
16
+ key: group.title,
17
+ label: group.title,
18
+ children: <NiceForm meta={groupMeta} />,
19
+ };
20
+ });
21
+
22
+ return (
23
+ <Tabs
24
+ items={tabItems}
25
+ className="react-ant-form-schema-tabs"
26
+ {...tabProps}
27
+ />
28
+ );
29
+ };
30
+
31
+ export default TabsGroups;
package/src/index.tsx CHANGED
@@ -1,8 +1,10 @@
1
1
  import cx from 'classnames';
2
- import React, { ReactNode } from 'react';
3
- import { Form, FormInstance, FormProps } from 'antd';
4
- import NiceForm, { NiceFormMeta } from '@ebay/nice-form-react';
5
- import { deepMerge } from './utils';
2
+ import React, { type ReactNode } from 'react';
3
+ import { Form, type FormInstance } from 'antd';
4
+ import DefaultForm from './components/default-form';
5
+ import FieldsetGroups from './components/fieldset-groups';
6
+ import TabsGroups from './components/tabs-groups';
7
+ import { ReactAntdFormSchemaProps, GroupsMode } from './types';
6
8
 
7
9
  const CLASS_NAME = 'react-ant-form-schema';
8
10
  const DEFAULT_META = {
@@ -16,21 +18,6 @@ const DEFAULT_META = {
16
18
  },
17
19
  };
18
20
 
19
- export type ReactAntdFormSchemaProps = {
20
- /**
21
- * The form schema meta data.
22
- */
23
- meta: NiceFormMeta;
24
- /**
25
- * The header content.
26
- */
27
- header?: ReactNode;
28
- /**
29
- * The form actions className.
30
- */
31
- actionsClassName?: string;
32
- } & FormProps;
33
-
34
21
  const defaultProps: Partial<ReactAntdFormSchemaProps> = {
35
22
  header: null,
36
23
  layout: 'horizontal',
@@ -43,8 +30,24 @@ const ReactAntdFormSchema = React.forwardRef<FormInstance, ReactAntdFormSchemaPr
43
30
  ...props,
44
31
  };
45
32
  const footerNode = children as ReactNode;
46
- const _meta = deepMerge(DEFAULT_META[layout!], meta) as NiceFormMeta;
47
- const _offset = layout === 'horizontal' ? _meta?.labelWidth : 0;
33
+ const defaultMeta = DEFAULT_META[layout!];
34
+
35
+ // Check if groups mode is enabled
36
+ const isGroupsMode = meta.groups && meta.groups.length > 0;
37
+ const groupsMode = meta.groupsMode || GroupsMode.Fieldset;
38
+
39
+ // Render form content based on mode
40
+ const renderContent = () => {
41
+ if (isGroupsMode) {
42
+ if (groupsMode === GroupsMode.Tabs) {
43
+ return <TabsGroups groups={meta.groups!} defaultMeta={defaultMeta} tabProps={meta.tabProps} />;
44
+ }
45
+ // fieldset mode (default)
46
+ return <FieldsetGroups groups={meta.groups!} defaultMeta={defaultMeta} />;
47
+ }
48
+ // standard mode
49
+ return <DefaultForm meta={{ ...defaultMeta, ...meta }} />;
50
+ };
48
51
 
49
52
  return (
50
53
  <Form
@@ -54,16 +57,16 @@ const ReactAntdFormSchema = React.forwardRef<FormInstance, ReactAntdFormSchemaPr
54
57
  ref={ref}
55
58
  {...rest}>
56
59
  {header}
57
- <NiceForm meta={_meta} />
60
+ {renderContent()}
58
61
  <Form.Item
59
- wrapperCol={{ offset: _offset }}
62
+ wrapperCol={{ offset: layout === 'horizontal' ? defaultMeta?.labelWidth : 0 }}
60
63
  className={actionsClassName}
61
64
  style={{ marginBottom: 0 }}>
62
65
  {footerNode}
63
66
  </Form.Item>
64
67
  </Form>
65
68
  );
66
- }
69
+ },
67
70
  );
68
71
 
69
72
  export default ReactAntdFormSchema;
package/src/main.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import ReactAntdFormSchema from '.';
2
- import { ReactAntdFormSchemaProps } from '.';
2
+ export type { ReactAntdFormSchemaProps, ReactAntdFormSchemaMeta } from './types';
3
+ export { GroupsMode } from './types';
3
4
 
4
5
  export default ReactAntdFormSchema;
5
- export type { ReactAntdFormSchemaProps };
package/src/types.ts ADDED
@@ -0,0 +1,53 @@
1
+ import { TabsProps } from 'antd';
2
+ import { NiceFormMeta } from '@ebay/nice-form-react';
3
+ import { ReactNode } from 'react';
4
+ import { FormProps } from 'antd';
5
+
6
+ export enum GroupsMode {
7
+ Fieldset = 'fieldset',
8
+ Tabs = 'tabs',
9
+ }
10
+
11
+ export type NiceFormGroup = {
12
+ /**
13
+ * The group title displayed in legend or tab.
14
+ */
15
+ title: string;
16
+ /**
17
+ * The form meta for this group.
18
+ */
19
+ meta: NiceFormMeta;
20
+ };
21
+
22
+ export type ReactAntdFormSchemaMeta = NiceFormMeta & {
23
+ /**
24
+ * Form groups for grouped mode.
25
+ * When groups is provided, fields will be rendered in groups.
26
+ */
27
+ groups?: NiceFormGroup[];
28
+ /**
29
+ * Display mode for groups.
30
+ * - 'fieldset': Render groups as fieldset/legend elements
31
+ * - 'tabs': Render groups as tabs
32
+ */
33
+ groupsMode?: GroupsMode;
34
+ /**
35
+ * Props to pass to Tabs component when groupsMode is 'tabs'.
36
+ */
37
+ tabProps?: TabsProps;
38
+ };
39
+
40
+ export type ReactAntdFormSchemaProps = {
41
+ /**
42
+ * The form schema meta data.
43
+ */
44
+ meta: ReactAntdFormSchemaMeta;
45
+ /**
46
+ * The header content.
47
+ */
48
+ header?: ReactNode;
49
+ /**
50
+ * The form actions className.
51
+ */
52
+ actionsClassName?: string;
53
+ } & FormProps;
package/src/utils.ts DELETED
@@ -1,20 +0,0 @@
1
- /**
2
- * @Author: aric 1290657123@qq.com
3
- * @Date: 2025-10-18 21:20:55
4
- * @LastEditors: aric 1290657123@qq.com
5
- * @LastEditTime: 2025-10-22 08:55:52
6
- */
7
-
8
- type AnyObject = { [key: string]: any };
9
-
10
- export function deepMerge(target: AnyObject, source: AnyObject) {
11
- const result = { ...target };
12
- for (const key in source) {
13
- if (source[key] && typeof source[key] === 'object' && !Array.isArray(source[key])) {
14
- result[key] = deepMerge(result[key] || {}, source[key]);
15
- } else {
16
- result[key] = source[key];
17
- }
18
- }
19
- return result;
20
- }