dynamicformdjx-react 0.1.1 → 0.2.0

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 CHANGED
@@ -35,8 +35,6 @@ pnpm add dynamicformdjx-react
35
35
 
36
36
  ##### 简单表单
37
37
 
38
- > 更多render函数请等待后续更新,可直接使用下方自定义渲染
39
-
40
38
  ```tsx
41
39
  import {useRef, useState} from "react";
42
40
  import {Button, Input, Radio} from "antd";
@@ -267,6 +265,207 @@ export default CustomForm;
267
265
 
268
266
  ```
269
267
 
268
+ ##### 总表单
269
+
270
+ > 除renderDynamicTags,renderCheckbox,renderSlider,renderInputNumber等待后续更新
271
+
272
+ ```tsx
273
+ import {useRef, useState} from "react";
274
+ import {Button, Input, Radio} from "antd";
275
+ import {
276
+ AdDynamicForm,
277
+ type adDynamicFormRef, renderCheckboxGroup, renderDatePicker,
278
+ renderInput,
279
+ renderPopSelect, renderRadioButtonGroup, renderRadioGroup,
280
+ renderSelect, renderSwitch, renderTimePicker,
281
+ renderTreeSelect
282
+ } from "dynamicformdjx-react/antd";
283
+ import {useDyForm, useReactiveForm} from "dynamicformdjx-react";
284
+ import type {Rule} from "antd/es/form";
285
+
286
+ type RowProps = {
287
+ username: string
288
+ password: string
289
+ gender: number
290
+ description: string
291
+ email: string
292
+ birthday: string
293
+ desc: string
294
+ sex: number
295
+ birthdayT: number
296
+ admin: number
297
+ favorite: number[]
298
+ job: number
299
+ job2: number
300
+ job3: number
301
+ }
302
+ const AllForm = () => {
303
+ const [formItems, setFormItems] = useReactiveForm<RowProps, Rule | Rule[]>([
304
+ {
305
+ key: "username",
306
+ label: "用户名",
307
+ value: "",
308
+ allowClear: true,
309
+ render2: f => renderInput({}, f),
310
+ },
311
+ {
312
+ key: "password",
313
+ label: "密码",
314
+ required: true,
315
+ value: "",
316
+ render2: (f) => renderInput({}, {...f, type: 'password'}),
317
+ },
318
+ {
319
+ key: "gender",
320
+ label: "性别",
321
+ value: null,
322
+ placeholder: '请选择性别',
323
+ labelField: 'f',
324
+ valueField: 'v',
325
+ showSearch: true,
326
+ allowClear: true,
327
+ searchOnLabel: true,
328
+ options: [
329
+ {f: <b>男</b>, v: 0},
330
+ {f: '女', v: 1}
331
+ ],
332
+ render2: (f) => renderSelect([], {}, f)
333
+ },
334
+ {
335
+ key: "job",
336
+ label: "职业",
337
+ value: null,
338
+ placeholder: '请选择职业',
339
+ labelField: 'f',
340
+ valueField: 'v',
341
+ showSearch: true,
342
+ allowClear: true,
343
+ searchOnLabel: true,
344
+ childField: 'childOptions',
345
+ options: [
346
+ {
347
+ f: '前端', v: '1', childOptions: [
348
+ {f: '网页开发', v: '1-1'},
349
+ {f: '小程序开发', v: '1-2'},
350
+ ]
351
+ },
352
+ {
353
+ f: '后端', v: '2', childOptions: [
354
+ {f: '后台开发', v: '2-1'},
355
+ {f: '运维', v: '2-2'},
356
+ ]
357
+ }
358
+ ],
359
+ render2: (f) => renderTreeSelect([], {
360
+ treeDefaultExpandAll: true
361
+ }, f),
362
+ },
363
+ {
364
+ key: "job2",
365
+ label: "职位2",
366
+ value: null,
367
+ labelField: 'l',
368
+ valueField: 'v',
369
+ options: ['Drive My Car', 'Norwegian Wood'].map((label, index) => ({
370
+ l: label,
371
+ v: label,
372
+ children: [
373
+ {l: 'aaa' + index, v: 'aaa' + index},
374
+ {l: 'bbb' + index, v: 'bbb' + index},
375
+ ]
376
+ })),
377
+ // mode: 'multiple',
378
+ render2: f => renderPopSelect([], {}, f),
379
+ },
380
+ {
381
+ key: "sex",
382
+ label: "性别",
383
+ labelField: 'label1',
384
+ valueField: 'value1',
385
+ value: null,
386
+ options: [
387
+ {label1: '男', value1: 0}, {label1: '女', value1: 1},
388
+ ],
389
+ render2: f => renderRadioGroup([], {}, f),
390
+ },
391
+ {
392
+ key: "favorite",
393
+ label: "爱好",
394
+ labelField: 'fl',
395
+ valueField: 'fv',
396
+ sort: 1,
397
+ options: [
398
+ {fl: '吃饭', fv: 0},
399
+ {fl: '睡觉', fv: 1},
400
+ {fl: '打豆豆', fv: 2},
401
+ ],
402
+ value: [],
403
+ render2: f => renderCheckboxGroup([], {}, f),
404
+ },
405
+ {
406
+ key: "admin",
407
+ label: "管理员?",
408
+ value: null,
409
+ render2: f => renderSwitch({}, f),
410
+ },
411
+ {
412
+ key: "birthday",
413
+ label: "生日",
414
+ value: null,
415
+ render2: f => renderDatePicker({showTime: true}, f),
416
+ },
417
+ {
418
+ key: "birthdayT",
419
+ label: "时间",
420
+ value: null,
421
+ render2: f => renderTimePicker({}, f),
422
+ },
423
+ ])
424
+ const useForm = useDyForm([formItems, setFormItems])
425
+ const antdFormRef = useRef<adDynamicFormRef>(null)
426
+ const rules: Partial<Record<keyof RowProps, Rule | Rule[]>> = {
427
+ desc: [{required: true, message: '请输入详情'}]
428
+ }
429
+ return (
430
+ <div className='dynamicFormTest'>
431
+ <AdDynamicForm ref={antdFormRef} rules={rules} items={formItems}/>
432
+ <div className="footer" style={{
433
+ display: 'flex',
434
+ gap: '5px'
435
+ }}>
436
+ <Button color={'green'} variant={'outlined'} onClick={() => {
437
+ // const res=antdFormRef.current?.getResult?.()
438
+ const res = useForm.getValues()
439
+ console.log(res)
440
+ }}>getData</Button>
441
+ <Button color={'orange'} variant={'outlined'} onClick={() => {
442
+ useForm.setValues({
443
+ username: 'antd',
444
+ password: 'I love you'
445
+ })
446
+ }}>setData</Button>
447
+ <Button color={'blue'} variant={'outlined'} onClick={() => {
448
+ antdFormRef.current?.validator().then(v => {
449
+ console.log(v)
450
+ }).catch(r => {
451
+ console.log(r)
452
+ })
453
+ }}>validator</Button>
454
+ <Button color={'red'} variant={'outlined'} onClick={() => {
455
+ useForm.onReset()
456
+ }}>reset</Button>
457
+ <Button variant={'outlined'} onClick={() => {
458
+ useForm.setDisabled(true)
459
+ }}>setDisabled</Button>
460
+ </div>
461
+ </div>
462
+ );
463
+ };
464
+
465
+ export default AllForm;
466
+
467
+ ```
468
+
270
469
  ### 动态录入
271
470
 
272
471
  > 此录入无需组件库依赖
@@ -0,0 +1,24 @@
1
+ import { default as React, ReactNode } from 'react';
2
+ import { Dropdown, Popover, DropdownProps, PopoverProps, ButtonProps } from 'antd';
3
+ type PropsOf<C> = C extends React.ComponentType<infer P> ? P : never;
4
+ export type PopSelectSingleProps = PropsOf<typeof Dropdown>;
5
+ export type PopSelectMultipleProps = PropsOf<typeof Popover>;
6
+ export type PopSelectOptionProps = PopSelectSingleProps | PopSelectMultipleProps;
7
+ type BasicOption = Record<string, any>;
8
+ export type SelectOption = BasicOption;
9
+ type PopSelectCoreProps = {
10
+ value?: string | number | null | Array<string | number>;
11
+ onChange?: (next: any) => void;
12
+ options: Array<SelectOption>;
13
+ labelField?: string;
14
+ valueField?: string;
15
+ multiple?: boolean;
16
+ onChangeEx?: (val: any, opt: any) => void;
17
+ /** props */
18
+ dropdownProps?: Omit<DropdownProps, "menu" | "children">;
19
+ popoverProps?: Omit<PopoverProps, "content" | "children">;
20
+ buttonProps?: ButtonProps;
21
+ defaultRender?: ReactNode;
22
+ };
23
+ export declare function PopSelect(props: PopSelectCoreProps): import("react/jsx-runtime").JSX.Element;
24
+ export {};
@@ -1,5 +1,24 @@
1
- import { DyFormItem } from '../../types/form';
2
- import { PasswordProps, TextAreaProps, InputProps } from 'antd/es/input';
1
+ import { default as React, ReactNode } from 'react';
2
+ import { PopSelectMultipleProps, PopSelectSingleProps, SelectOption } from './PopSelect.tsx';
3
+ import { TreeSelectProps, SelectProps, TimePickerProps, DatePickerProps, SwitchProps } from 'antd';
4
+ import { DyFormItem, SelectOptionItem, TreeSelectOption } from '../../types/form';
5
+ import { InputProps, PasswordProps, TextAreaProps } from 'antd/es/input';
6
+ import { RadioGroupProps } from 'antd/es/radio/interface';
7
+ import { CheckboxGroupProps } from 'antd/es/checkbox';
3
8
  export declare function renderInput(optionProps: PasswordProps, rf?: DyFormItem): JSX.Element;
4
9
  export declare function renderInput(optionProps: TextAreaProps, rf?: DyFormItem): JSX.Element;
5
10
  export declare function renderInput(optionProps?: InputProps, rf?: DyFormItem): JSX.Element;
11
+ export declare function renderSelect(options?: SelectOptionItem[], optionProps?: SelectProps, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
12
+ export declare function renderTreeSelect(options: TreeSelectOption[], optionProps?: TreeSelectProps, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
13
+ export declare function renderPopSelect(options: Array<SelectOption>, optionProps?: PopSelectMultipleProps, rf?: DyFormItem, defaultRender?: ReactNode): React.ReactElement;
14
+ export declare function renderPopSelect(options: Array<SelectOption>, optionProps?: PopSelectSingleProps, rf?: DyFormItem, defaultRender?: ReactNode): React.ReactElement;
15
+ export declare function renderRadioGroup(options?: SelectOptionItem[], optionProps?: RadioGroupProps, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
16
+ export declare function renderRadioButtonGroup(options?: SelectOptionItem[], optionProps?: RadioGroupProps, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
17
+ export declare function renderCheckboxGroup(options?: SelectOptionItem[], optionProps?: CheckboxGroupProps, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
18
+ export declare function renderSwitch(optionProps?: SwitchProps, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
19
+ export declare function renderDatePicker(optionProps?: DatePickerProps & {
20
+ isRange?: boolean;
21
+ }, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
22
+ export declare function renderTimePicker(optionProps?: TimePickerProps & {
23
+ isRange?: boolean;
24
+ }, rf?: DyFormItem): import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),b=require("react"),y=require("antd");function I(e){return Array.isArray(e)?e:typeof e=="string"&&e.includes(".")?e.split("."):e}function p(e){return Array.isArray(e)?e.join("."):String(e)}function E(e,l){return(Array.isArray(l)?l:[l]).reduce((a,c)=>a==null?a:a[c],e)}function B(e,l,s){const a=Array.isArray(l)?l:[l];let c=e;for(let m=0;m<a.length;m++){const d=a[m];m===a.length-1?c[d]=s:((c[d]==null||typeof c[d]!="object")&&(c[d]={}),c=c[d])}}function w(e){const l={};return e.forEach(s=>{const a=I(s?.path??s?.key);B(l,a,s?.value)}),l}const S=b.forwardRef((e,l)=>{const[s]=y.Form.useForm(),a=e.validateTrigger??"onBlur",c=e.validateTrigger===null?void 0:a,m=e.preset??"fullRow",[d,A]=b.useState({}),u=b.useMemo(()=>(e.items??[]).filter(r=>!r?.hidden),[e.items]),q=b.useMemo(()=>[...u].sort((r,t)=>{const o=r?.sort??1/0,f=t?.sort??1/0;return Number(o)-Number(f)}),[u]),P=b.useMemo(()=>{const r={};return u.forEach(t=>{const o=I(t?.path??t?.key),f=p(o);let i=t?.rule;if(t?.required&&!t?.rule){const n=typeof t?.label=="string"?t.label:"";i={required:!0,message:t?.requiredHint?.(n)??`${n||t?.key}不能为空`,validateTrigger:c}}if(i&&(r[f]=i,t.isCustom)){const n=Array.isArray(i)?i:[i];A(C=>({...C,[o]:{status:!1,help:n.map(h=>h.message).filter(Boolean).join(",")}}))}}),{...r,...e.rules??{}}},[u,e.rules]);b.useEffect(()=>{s.setFieldsValue(w(u))},[s,u]);const R=(r,t)=>{u.forEach(o=>{const f=I(o?.path??o?.key);o.value=E(t,f)})};b.useImperativeHandle(l,()=>({reset:(r=null)=>{u.forEach(t=>t.value=r),s.setFieldsValue(w(u))},validator:async()=>{const r=u.filter(n=>!n.isCustom).map(n=>I(n?.path??n?.key)),t=await s.validateFields(r);let o={};const f=u.filter(n=>n.isCustom),i=[];for(const n of f){const C=I(n?.path??n?.key),h=p(C),j=P[h],F=Array.isArray(j)?j:j?[j]:[];A(v=>({...v,[h]:{status:"validating",help:""}})),o={...o,[h]:n.value};try{await M(n.value,F),A(v=>({...v,[h]:{status:"success",help:""}}))}catch(v){const x=v?.message||F.map(k=>k.message).filter(Boolean).join(",");A(k=>({...k,[h]:{status:"error",help:x}})),i.push({name:h,errors:[x]})}}return i.length?Promise.reject({errorFields:i,outOfDate:!1}):{...t,...o}},getResult:(r="res")=>r==="ori"?u:w(u),form:s}));const T=(r,t)=>typeof r?.render2=="function"?r.render2.length>=2?r.render2(r,t):r.render2(r):null,N=r=>{const t=I(r?.path??r?.key),o=p(t),f=P[o],i=Array.isArray(f)?f:f?[f]:void 0;let n=i?.map(x=>x.validateTrigger)?.filter(Boolean)??[];c&&(n=n.concat(a));const C=r?.colProps??{span:r?.span??24,offset:r?.offset??0},h=r?.formItemProps??{},{status:j,help:F}=d[o]??{status:void 0,help:void 0},v=r.isCustom?g.jsx(y.Form.Item,{name:void 0,label:r?.label,required:!!r?.required||d[o],validateStatus:j,help:j==="error"?F:void 0,...h,children:T(r,s)},o):g.jsx(y.Form.Item,{name:t,label:r?.label,rules:i,validateTrigger:n,...h,children:T(r,s)},o);return m==="grid"?g.jsx(y.Col,{...C,children:v},o):v};return g.jsxs("div",{className:"dynamicForm",children:[e.header&&g.jsx("div",{className:"header",children:e.header()}),g.jsx(y.Form,{form:s,onValuesChange:R,...e.formConfig,children:m==="grid"?g.jsx(y.Row,{gutter:e.gridConfig?.gutter??10,...e.gridConfig,children:q.map(N)}):q.map(N)}),e.footer&&g.jsx("div",{className:"footer",children:e.footer()})]})});function V(e){return!!(e==null||e===""||Array.isArray(e)&&e.length===0||typeof e=="object"&&!Array.isArray(e)&&Object.keys(e).length===0)}async function M(e,l){for(const s of l){const a=s;if(a?.required&&V(e))throw new Error(a?.message||"必填");typeof a?.validator=="function"&&await a.validator(a,e)}}function O(e={},l){const{type:s="text",key:a,render2:c,...m}=l??{},d=A=>{l?.onChange?.(A.target.value,l),e?.onChange?.(A)};switch(s){case"password":return g.jsx(y.Input.Password,{...m,...e,onChange:d});case"textarea":return g.jsx(y.Input.TextArea,{...m,...e,onChange:d});default:return g.jsx(y.Input,{...m,...e,onChange:d})}}exports.AdDynamicForm=S;exports.renderInput=O;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),T=require("react"),b=require("antd");function O(e){return Array.isArray(e)?e:typeof e=="string"&&e.includes(".")?e.split("."):e}function I(e){return Array.isArray(e)?e.join("."):String(e)}function z(e,r){return(Array.isArray(r)?r:[r]).reduce((l,i)=>l==null?l:l[i],e)}function H(e,r,n){const l=Array.isArray(r)?r:[r];let i=e;for(let c=0;c<l.length;c++){const s=l[c];c===l.length-1?i[s]=n:((i[s]==null||typeof i[s]!="object")&&(i[s]={}),i=i[s])}}function G(e){const r={};return e.forEach(n=>{const l=O(n?.path??n?.key);H(r,l,n?.value)}),r}const W=T.forwardRef((e,r)=>{const[n]=b.Form.useForm(),l=e.validateTrigger??"onBlur",i=e.validateTrigger===null?void 0:l,c=e.preset??"fullRow",[s,d]=T.useState({}),y=T.useMemo(()=>(e.items??[]).filter(t=>!t?.hidden),[e.items]),x=T.useMemo(()=>[...y].sort((t,o)=>{const a=t?.sort??1/0,m=o?.sort??1/0;return Number(a)-Number(m)}),[y]),v=T.useMemo(()=>{const t={};return y.forEach(o=>{const a=O(o?.path??o?.key),m=I(a);let C=o?.rule;if(o?.required&&!o?.rule){const p=typeof o?.label=="string"?o.label:"";C={required:!0,message:o?.requiredHint?.(p)??`${p||o?.key}不能为空`,validateTrigger:i}}if(C&&(t[m]=C,o.isCustom)){const p=Array.isArray(C)?C:[C];d(P=>({...P,[a]:{status:!1,help:p.map(F=>F.message).filter(Boolean).join(",")}}))}}),{...t,...e.rules??{}}},[y,e.rules]);T.useEffect(()=>{n.setFieldsValue(G(y))},[n,y]);const f=(t,o)=>{y.forEach(a=>{const m=O(a?.path??a?.key);a.value=z(o,m)})};T.useImperativeHandle(r,()=>({reset:(t=null)=>{y.forEach(o=>o.value=t),n.setFieldsValue(G(y))},validator:async()=>{const t=y.filter(p=>!p.isCustom).map(p=>O(p?.path??p?.key)),o=await n.validateFields(t);let a={};const m=y.filter(p=>p.isCustom),C=[];for(const p of m){const P=O(p?.path??p?.key),F=I(P),S=v[F],k=Array.isArray(S)?S:S?[S]:[];d(A=>({...A,[F]:{status:"validating",help:""}})),a={...a,[F]:p.value};try{await Q(p.value,k),d(A=>({...A,[F]:{status:"success",help:""}}))}catch(A){const R=A?.message||k.map(_=>_.message).filter(Boolean).join(",");d(_=>({..._,[F]:{status:"error",help:R}})),C.push({name:F,errors:[R]})}}return C.length?Promise.reject({errorFields:C,outOfDate:!1}):{...o,...a}},getResult:(t="res")=>t==="ori"?y:G(y),form:n}));const h=(t,o)=>typeof t?.render2=="function"?t.render2.length>=2?t.render2(t,o):t.render2(t):null,g=t=>{const o=O(t?.path??t?.key),a=I(o),m=v[a],C=Array.isArray(m)?m:m?[m]:void 0;let p=C?.map(R=>R.validateTrigger)?.filter(Boolean)??[];i&&(p=p.concat(l));const P=t?.colProps??{span:t?.span??24,offset:t?.offset??0},F=t?.formItemProps??{},{status:S,help:k}=s[a]??{status:void 0,help:void 0},A=t.isCustom?u.jsx(b.Form.Item,{name:void 0,label:t?.label,required:!!t?.required||s[a],validateStatus:S,help:S==="error"?k:void 0,...F,children:h(t,n)},a):u.jsx(b.Form.Item,{name:o,label:t?.label,rules:C,validateTrigger:p,...F,children:h(t,n)},a);return c==="grid"?u.jsx(b.Col,{...P,children:A},a):A};return u.jsxs("div",{className:"dynamicForm",children:[e.header&&u.jsx("div",{className:"header",children:e.header()}),u.jsx(b.Form,{form:n,onValuesChange:f,...e.formConfig,children:c==="grid"?u.jsx(b.Row,{gutter:e.gridConfig?.gutter??10,...e.gridConfig,children:x.map(g)}):x.map(g)}),e.footer&&u.jsx("div",{className:"footer",children:e.footer()})]})});function J(e){return!!(e==null||e===""||Array.isArray(e)&&e.length===0||typeof e=="object"&&!Array.isArray(e)&&Object.keys(e).length===0)}async function Q(e,r){for(const n of r){const l=n;if(l?.required&&J(e))throw new Error(l?.message||"必填");typeof l?.validator=="function"&&await l.validator(l,e)}}function j(e,r,n){return e?.[r]??n}function U(e){return!!e&&(e.type==="group"||Array.isArray(e.children)||Array.isArray(e.options))}function N(e){return(e??[]).map(r=>{if(U(r)){const n=r.children??r.options??[];return{...r,__isGroup:!0,__children:n}}return{...r,__isGroup:!1}})}function X(e,r,n="label",l="value"){const i=N(r);for(const c of i)if(c.__isGroup){for(const s of c.__children)if(j(s,l,s.value)===e)return j(s,n,s.label)}else if(j(c,l,c.value)===e)return j(c,n,c.label);return""}function Y(e,r,n){const l=N(e),i=new Map;return{items:l.map((s,d)=>{if(s.__isGroup){const f=j(s,r,s.label),h=(s.__children??[]).map((g,t)=>{const o=j(g,r,g.label),a=j(g,n,g.value),m=`opt-${d}-${t}`;return i.set(m,{value:a,option:g}),{key:m,label:o,disabled:!!g.disabled}});return{key:`group-${d}`,type:"group",label:f,children:h}}const y=j(s,r,s.label),x=j(s,n,s.value),v=`opt-${d}`;return i.set(v,{value:x,option:s}),{key:v,label:y,disabled:!!s.disabled}}),keyMap:i,opts:l}}function Z(e){const{value:r,onChange:n,options:l,labelField:i="label",valueField:c="value",multiple:s,onChangeEx:d,dropdownProps:y,popoverProps:x,buttonProps:v,defaultRender:f}=e,h=l??[],g=s??Array.isArray(r),{items:t,keyMap:o,opts:a}=T.useMemo(()=>Y(h,i,c),[h,i,c]),m=T.useMemo(()=>{if(f)return f;const P=g?Array.isArray(r)&&r.length?`已选 ${r.length} 项`:"请选择":r!=null?X(r,h,i,c)||String(r):"请选择";return u.jsx(b.Button,{...v,children:P})},[f,g,r,h,i,c,v]);if(g){const P=a.flatMap(k=>k.__isGroup?k.__children??[]:[k]),F=Array.isArray(r)?r:[],S=u.jsx("div",{style:{maxWidth:360},children:u.jsx(b.Checkbox.Group,{value:F,onChange:k=>{n?.(k);const A=P.filter(R=>k.includes(j(R,c,R.value)));d?.(k,A)},children:u.jsx(b.Space,{direction:"vertical",size:8,style:{width:"100%"},children:a.map((k,A)=>{if(k.__isGroup){const E=j(k,i,k.label),$=k.__children??[];return u.jsxs("div",{children:[u.jsx(b.Typography.Text,{strong:!0,children:E}),u.jsx("div",{style:{marginTop:8},children:u.jsx(b.Space,{wrap:!0,children:$.map((w,q)=>{const V=j(w,i,w.label),K=j(w,c,w.value);return u.jsx(b.Checkbox,{value:K,disabled:!!w.disabled,children:V},w.key??`${A}-${q}`)})})}),u.jsx(b.Divider,{style:{margin:"12px 0"}})]},`g-${A}`)}const R=j(k,i,k.label),_=j(k,c,k.value);return u.jsx(b.Checkbox,{value:_,disabled:!!k.disabled,children:R},k.key??`o-${A}`)})})})});return u.jsx(b.Popover,{trigger:"click",placement:"bottom",content:S,...x,children:u.jsx("span",{style:{display:"inline-block"},children:m})})}const C=T.useMemo(()=>{if(r!=null){for(const[P,F]of o.entries())if(F.value===r)return P}},[r,o]),p={items:t,onClick:({key:P})=>{const F=o.get(String(P));F&&(n?.(F.value),d?.(F.value,F.option))},selectedKeys:C};return u.jsx(b.Dropdown,{trigger:["click"],menu:p,...y,children:u.jsx("span",{style:{display:"inline-block"},children:m})})}function L(e){return e==null||e===!1||e===!0?"":typeof e=="string"||typeof e=="number"?String(e):Array.isArray(e)?e.map(L).join(""):T.isValidElement(e)?L(e.props?.children):""}function ee(e={},r){const{type:n="text",key:l,render2:i,...c}=r??{},s=d=>{r?.onChange?.(d.target.value,r),e?.onChange?.(d)};switch(n){case"password":return u.jsx(b.Input.Password,{...c,...e,onChange:s});case"textarea":return u.jsx(b.Input.TextArea,{...c,...e,onChange:s});default:return u.jsx(b.Input,{...c,...e,onChange:s})}}function M(e,r,n="label"){const{labelField:l,valueField:i,childField:c,options:s=[]}=r,d=e.length?e:s,y=l??"label",x=i??"value",v=c??"children";return d.map(f=>{const h=f[y],g={...f,[n]:h,value:f[x],searchText:L(h)};return Array.isArray(f[v])&&(g.children=M(f[v],r,n)),g})}function B(e,r,n="label"){const{labelField:l,valueField:i,options:c=[]}=r,s=e.length?e:c,d=l??"label",y=i??"value";return s.map(x=>{const v=x[d];return{[n]:v,value:x[y]}})}function re(e=[],r={},n){const{type:l,key:i,render2:c,searchOnLabel:s,...d}=n??{},{labelField:y,valueField:x,childField:v,...f}=d,h=M(e,d),g=o=>{r?.onSearch?.(o);const a=o.trim().toLowerCase(),m=h.filter(p=>(p.searchText??"").toLowerCase().includes(a)),C=m.find(p=>(p.searchText??"").toLowerCase()===a);if(C)return t(C.value,C);if(m.length===1)return t(m[0].value,m[0])},t=(o,a)=>{n?.onChange?.(o,n,a),r?.onChange?.(o,a)};return u.jsx(b.Select,{...f,options:h,onSearch:s?g:void 0,optionFilterProp:s?"searchText":void 0,...r,onChange:t})}function ne(e,r={},n){const{type:l,key:i,render2:c,searchOnLabel:s,...d}=n??{},{labelField:y,valueField:x,childField:v,...f}=d,h=M(e,d,"title"),g=o=>{r?.onSearch?.(o);const a=o.trim().toLowerCase(),m=h.filter(p=>(p.searchText??"").toLowerCase().includes(a)),C=m.find(p=>(p.searchText??"").toLowerCase()===a);if(C)return t(C.value,n,C);if(m.length===1)return t(m[0].value,n,m[0])},t=(o,a,m)=>{n?.onChange?.(o,n,a),r?.onChange?.(o,a,m)};return u.jsx(b.TreeSelect,{...f,treeData:h,onSearch:s?g:void 0,treeNodeFilterProp:s?"searchText":void 0,...r,onChange:t})}function te(e=[],r={},n,l){const{labelField:i,valueField:c,onChange:s,mode:d,key:y,...x}=n??{},v=(g,t)=>{s?.(g,n,t)},f=d==="multiple",h=e.length?e:n?.options;return u.jsx(Z,{...x,options:h,labelField:i,valueField:c,multiple:f,defaultRender:l,onChangeEx:v,dropdownProps:f?void 0:r,popoverProps:f?r:void 0})}function D(e=[],r={},n){const{type:l,key:i,render2:c,searchOnLabel:s,...d}=n??{},{labelField:y,valueField:x,childField:v,...f}=d,h=B(e,d),g=t=>{n?.onChange?.(t.target.value,n,h),r?.onChange?.(t)};return u.jsx(b.Radio.Group,{...f,options:h,onChange:g,...r})}function se(e=[],r={},n){return D(e,{optionType:"button",...r},n)}function oe(e=[],r={},n){const{type:l,key:i,render2:c,searchOnLabel:s,...d}=n??{},{labelField:y,valueField:x,childField:v,...f}=d,h=B(e,d),g=t=>{n?.onChange?.(t,n,h),r?.onChange?.(t)};return u.jsx(b.Checkbox.Group,{...f,options:h,onChange:g,...r})}function ae(e={},r){const{type:n,key:l,render2:i,searchOnLabel:c,...s}=r??{},{labelField:d,valueField:y,childField:x,...v}=s,f=(h,g)=>{r?.onChange?.(h,r),e?.onChange?.(h,g)};return u.jsx(b.Switch,{...v,onChange:f,...e})}function le(e={},r){const{type:n,key:l,render2:i,searchOnLabel:c,...s}=r??{},{labelField:d,valueField:y,childField:x,...v}=s,f=(o,a)=>{r?.onChange?.(a,r),e?.onChange?.(o,a)},{isRange:h,...g}=e,t={...v,onChange:f,...g};return h?u.jsx(b.DatePicker.RangePicker,{...t}):u.jsx(b.DatePicker,{...t})}function ce(e={},r){const{type:n,key:l,render2:i,searchOnLabel:c,...s}=r??{},{labelField:d,valueField:y,childField:x,...v}=s,f=(o,a)=>{r?.onChange?.(a,r),e?.onChange?.(o,a)},{isRange:h,...g}=e,t={...v,onChange:f,...g};return h?u.jsx(b.TimePicker.RangePicker,{...t}):u.jsx(b.TimePicker,{...t})}exports.AdDynamicForm=W;exports.renderCheckboxGroup=oe;exports.renderDatePicker=le;exports.renderInput=ee;exports.renderPopSelect=te;exports.renderRadioButtonGroup=se;exports.renderRadioGroup=D;exports.renderSelect=re;exports.renderSwitch=ae;exports.renderTimePicker=ce;exports.renderTreeSelect=ne;
@@ -1,155 +1,398 @@
1
- import { jsxs as B, jsx as g } from "react/jsx-runtime";
2
- import { forwardRef as V, useState as O, useMemo as p, useEffect as S, useImperativeHandle as D } from "react";
3
- import { Form as F, Row as H, Col as M, Input as w } from "antd";
4
- function b(e) {
1
+ import { jsxs as V, jsx as d } from "react/jsx-runtime";
2
+ import U, { forwardRef as X, useState as Y, useMemo as S, useEffect as Z, useImperativeHandle as ee } from "react";
3
+ import { Form as L, Row as ne, Col as re, Button as te, Checkbox as G, Space as $, Typography as ae, Divider as oe, Popover as le, Dropdown as se, Input as N, Select as ce, TreeSelect as ie, Radio as ue, Switch as de, DatePicker as M, TimePicker as D } from "antd";
4
+ function _(e) {
5
5
  return Array.isArray(e) ? e : typeof e == "string" && e.includes(".") ? e.split(".") : e;
6
6
  }
7
- function N(e) {
7
+ function j(e) {
8
8
  return Array.isArray(e) ? e.join(".") : String(e);
9
9
  }
10
- function K(e, l) {
11
- return (Array.isArray(l) ? l : [l]).reduce((a, c) => a == null ? a : a[c], e);
10
+ function he(e, n) {
11
+ return (Array.isArray(n) ? n : [n]).reduce((s, i) => s == null ? s : s[i], e);
12
12
  }
13
- function _(e, l, s) {
14
- const a = Array.isArray(l) ? l : [l];
15
- let c = e;
16
- for (let m = 0; m < a.length; m++) {
17
- const d = a[m];
18
- m === a.length - 1 ? c[d] = s : ((c[d] == null || typeof c[d] != "object") && (c[d] = {}), c = c[d]);
13
+ function fe(e, n, r) {
14
+ const s = Array.isArray(n) ? n : [n];
15
+ let i = e;
16
+ for (let c = 0; c < s.length; c++) {
17
+ const a = s[c];
18
+ c === s.length - 1 ? i[a] = r : ((i[a] == null || typeof i[a] != "object") && (i[a] = {}), i = i[a]);
19
19
  }
20
20
  }
21
- function P(e) {
22
- const l = {};
23
- return e.forEach((s) => {
24
- const a = b(s?.path ?? s?.key);
25
- _(l, a, s?.value);
26
- }), l;
21
+ function x(e) {
22
+ const n = {};
23
+ return e.forEach((r) => {
24
+ const s = _(r?.path ?? r?.key);
25
+ fe(n, s, r?.value);
26
+ }), n;
27
27
  }
28
- const Q = V((e, l) => {
29
- const [s] = F.useForm(), a = e.validateTrigger ?? "onBlur", c = e.validateTrigger === null ? void 0 : a, m = e.preset ?? "fullRow", [d, v] = O({}), u = p(
30
- () => (e.items ?? []).filter((r) => !r?.hidden),
28
+ const Te = X((e, n) => {
29
+ const [r] = L.useForm(), s = e.validateTrigger ?? "onBlur", i = e.validateTrigger === null ? void 0 : s, c = e.preset ?? "fullRow", [a, u] = Y({}), y = S(
30
+ () => (e.items ?? []).filter((t) => !t?.hidden),
31
31
  [e.items]
32
- ), T = p(() => [...u].sort((r, t) => {
33
- const o = r?.sort ?? 1 / 0, f = t?.sort ?? 1 / 0;
34
- return Number(o) - Number(f);
35
- }), [u]), E = p(() => {
36
- const r = {};
37
- return u.forEach((t) => {
38
- const o = b(t?.path ?? t?.key), f = N(o);
39
- let i = t?.rule;
40
- if (t?.required && !t?.rule) {
41
- const n = typeof t?.label == "string" ? t.label : "";
42
- i = {
32
+ ), k = S(() => [...y].sort((t, o) => {
33
+ const l = t?.sort ?? 1 / 0, m = o?.sort ?? 1 / 0;
34
+ return Number(l) - Number(m);
35
+ }), [y]), v = S(() => {
36
+ const t = {};
37
+ return y.forEach((o) => {
38
+ const l = _(o?.path ?? o?.key), m = j(l);
39
+ let b = o?.rule;
40
+ if (o?.required && !o?.rule) {
41
+ const p = typeof o?.label == "string" ? o.label : "";
42
+ b = {
43
43
  required: !0,
44
- message: t?.requiredHint?.(n) ?? `${n || t?.key}不能为空`,
45
- validateTrigger: c
44
+ message: o?.requiredHint?.(p) ?? `${p || o?.key}不能为空`,
45
+ validateTrigger: i
46
46
  };
47
47
  }
48
- if (i && (r[f] = i, t.isCustom)) {
49
- const n = Array.isArray(i) ? i : [i];
50
- v((C) => ({
51
- ...C,
52
- [o]: {
48
+ if (b && (t[m] = b, o.isCustom)) {
49
+ const p = Array.isArray(b) ? b : [b];
50
+ u((R) => ({
51
+ ...R,
52
+ [l]: {
53
53
  status: !1,
54
- help: n.map((h) => h.message).filter(Boolean).join(",")
54
+ help: p.map((F) => F.message).filter(Boolean).join(",")
55
55
  }
56
56
  }));
57
57
  }
58
- }), { ...r, ...e.rules ?? {} };
59
- }, [u, e.rules]);
60
- S(() => {
61
- s.setFieldsValue(P(u));
62
- }, [s, u]);
63
- const x = (r, t) => {
64
- u.forEach((o) => {
65
- const f = b(o?.path ?? o?.key);
66
- o.value = K(t, f);
58
+ }), { ...t, ...e.rules ?? {} };
59
+ }, [y, e.rules]);
60
+ Z(() => {
61
+ r.setFieldsValue(x(y));
62
+ }, [r, y]);
63
+ const g = (t, o) => {
64
+ y.forEach((l) => {
65
+ const m = _(l?.path ?? l?.key);
66
+ l.value = he(o, m);
67
67
  });
68
68
  };
69
- D(l, () => ({
70
- reset: (r = null) => {
71
- u.forEach((t) => t.value = r), s.setFieldsValue(P(u));
69
+ ee(n, () => ({
70
+ reset: (t = null) => {
71
+ y.forEach((o) => o.value = t), r.setFieldsValue(x(y));
72
72
  },
73
73
  validator: async () => {
74
- const r = u.filter((n) => !n.isCustom).map((n) => b(n?.path ?? n?.key)), t = await s.validateFields(r);
75
- let o = {};
76
- const f = u.filter((n) => n.isCustom), i = [];
77
- for (const n of f) {
78
- const C = b(n?.path ?? n?.key), h = N(C), A = E[h], I = Array.isArray(A) ? A : A ? [A] : [];
79
- v((y) => ({ ...y, [h]: { status: "validating", help: "" } })), o = { ...o, [h]: n.value };
74
+ const t = y.filter((p) => !p.isCustom).map((p) => _(p?.path ?? p?.key)), o = await r.validateFields(t);
75
+ let l = {};
76
+ const m = y.filter((p) => p.isCustom), b = [];
77
+ for (const p of m) {
78
+ const R = _(p?.path ?? p?.key), F = j(R), w = v[F], C = Array.isArray(w) ? w : w ? [w] : [];
79
+ u((T) => ({ ...T, [F]: { status: "validating", help: "" } })), l = { ...l, [F]: p.value };
80
80
  try {
81
- await z(n.value, I), v((y) => ({ ...y, [h]: { status: "success", help: "" } }));
82
- } catch (y) {
83
- const k = y?.message || I.map((j) => j.message).filter(Boolean).join(",");
84
- v((j) => ({ ...j, [h]: { status: "error", help: k } })), i.push({ name: h, errors: [k] });
81
+ await me(p.value, C), u((T) => ({ ...T, [F]: { status: "success", help: "" } }));
82
+ } catch (T) {
83
+ const O = T?.message || C.map((I) => I.message).filter(Boolean).join(",");
84
+ u((I) => ({ ...I, [F]: { status: "error", help: O } })), b.push({ name: F, errors: [O] });
85
85
  }
86
86
  }
87
- return i.length ? Promise.reject({ errorFields: i, outOfDate: !1 }) : { ...t, ...o };
87
+ return b.length ? Promise.reject({ errorFields: b, outOfDate: !1 }) : { ...o, ...l };
88
88
  },
89
- getResult: (r = "res") => r === "ori" ? u : P(u),
90
- form: s
89
+ getResult: (t = "res") => t === "ori" ? y : x(y),
90
+ form: r
91
91
  }));
92
- const R = (r, t) => typeof r?.render2 == "function" ? r.render2.length >= 2 ? r.render2(r, t) : r.render2(r) : null, q = (r) => {
93
- const t = b(r?.path ?? r?.key), o = N(t), f = E[o], i = Array.isArray(f) ? f : f ? [f] : void 0;
94
- let n = i?.map((k) => k.validateTrigger)?.filter(Boolean) ?? [];
95
- c && (n = n.concat(a));
96
- const C = r?.colProps ?? { span: r?.span ?? 24, offset: r?.offset ?? 0 }, h = r?.formItemProps ?? {}, { status: A, help: I } = d[o] ?? { status: void 0, help: void 0 }, y = r.isCustom ? /* @__PURE__ */ g(
97
- F.Item,
92
+ const h = (t, o) => typeof t?.render2 == "function" ? t.render2.length >= 2 ? t.render2(t, o) : t.render2(t) : null, f = (t) => {
93
+ const o = _(t?.path ?? t?.key), l = j(o), m = v[l], b = Array.isArray(m) ? m : m ? [m] : void 0;
94
+ let p = b?.map((O) => O.validateTrigger)?.filter(Boolean) ?? [];
95
+ i && (p = p.concat(s));
96
+ const R = t?.colProps ?? { span: t?.span ?? 24, offset: t?.offset ?? 0 }, F = t?.formItemProps ?? {}, { status: w, help: C } = a[l] ?? { status: void 0, help: void 0 }, T = t.isCustom ? /* @__PURE__ */ d(
97
+ L.Item,
98
98
  {
99
99
  name: void 0,
100
- label: r?.label,
101
- required: !!r?.required || d[o],
102
- validateStatus: A,
103
- help: A === "error" ? I : void 0,
104
- ...h,
105
- children: R(r, s)
100
+ label: t?.label,
101
+ required: !!t?.required || a[l],
102
+ validateStatus: w,
103
+ help: w === "error" ? C : void 0,
104
+ ...F,
105
+ children: h(t, r)
106
106
  },
107
- o
108
- ) : /* @__PURE__ */ g(
109
- F.Item,
107
+ l
108
+ ) : /* @__PURE__ */ d(
109
+ L.Item,
110
110
  {
111
- name: t,
112
- label: r?.label,
113
- rules: i,
114
- validateTrigger: n,
115
- ...h,
116
- children: R(r, s)
111
+ name: o,
112
+ label: t?.label,
113
+ rules: b,
114
+ validateTrigger: p,
115
+ ...F,
116
+ children: h(t, r)
117
117
  },
118
- o
118
+ l
119
119
  );
120
- return m === "grid" ? /* @__PURE__ */ g(M, { ...C, children: y }, o) : y;
120
+ return c === "grid" ? /* @__PURE__ */ d(re, { ...R, children: T }, l) : T;
121
121
  };
122
- return /* @__PURE__ */ B("div", { className: "dynamicForm", children: [
123
- e.header && /* @__PURE__ */ g("div", { className: "header", children: e.header() }),
124
- /* @__PURE__ */ g(F, { form: s, onValuesChange: x, ...e.formConfig, children: m === "grid" ? /* @__PURE__ */ g(H, { gutter: e.gridConfig?.gutter ?? 10, ...e.gridConfig, children: T.map(q) }) : T.map(q) }),
125
- e.footer && /* @__PURE__ */ g("div", { className: "footer", children: e.footer() })
122
+ return /* @__PURE__ */ V("div", { className: "dynamicForm", children: [
123
+ e.header && /* @__PURE__ */ d("div", { className: "header", children: e.header() }),
124
+ /* @__PURE__ */ d(L, { form: r, onValuesChange: g, ...e.formConfig, children: c === "grid" ? /* @__PURE__ */ d(ne, { gutter: e.gridConfig?.gutter ?? 10, ...e.gridConfig, children: k.map(f) }) : k.map(f) }),
125
+ e.footer && /* @__PURE__ */ d("div", { className: "footer", children: e.footer() })
126
126
  ] });
127
127
  });
128
- function $(e) {
128
+ function ge(e) {
129
129
  return !!(e == null || e === "" || Array.isArray(e) && e.length === 0 || typeof e == "object" && !Array.isArray(e) && Object.keys(e).length === 0);
130
130
  }
131
- async function z(e, l) {
132
- for (const s of l) {
133
- const a = s;
134
- if (a?.required && $(e))
135
- throw new Error(a?.message || "必填");
136
- typeof a?.validator == "function" && await a.validator(a, e);
131
+ async function me(e, n) {
132
+ for (const r of n) {
133
+ const s = r;
134
+ if (s?.required && ge(e))
135
+ throw new Error(s?.message || "必填");
136
+ typeof s?.validator == "function" && await s.validator(s, e);
137
137
  }
138
138
  }
139
- function U(e = {}, l) {
140
- const { type: s = "text", key: a, render2: c, ...m } = l ?? {}, d = (v) => {
141
- l?.onChange?.(v.target.value, l), e?.onChange?.(v);
139
+ function A(e, n, r) {
140
+ return e?.[n] ?? r;
141
+ }
142
+ function ye(e) {
143
+ return !!e && (e.type === "group" || Array.isArray(e.children) || Array.isArray(e.options));
144
+ }
145
+ function q(e) {
146
+ return (e ?? []).map((n) => {
147
+ if (ye(n)) {
148
+ const r = n.children ?? n.options ?? [];
149
+ return { ...n, __isGroup: !0, __children: r };
150
+ }
151
+ return { ...n, __isGroup: !1 };
152
+ });
153
+ }
154
+ function pe(e, n, r = "label", s = "value") {
155
+ const i = q(n);
156
+ for (const c of i)
157
+ if (c.__isGroup) {
158
+ for (const a of c.__children)
159
+ if (A(a, s, a.value) === e) return A(a, r, a.label);
160
+ } else if (A(c, s, c.value) === e) return A(c, r, c.label);
161
+ return "";
162
+ }
163
+ function ve(e, n, r) {
164
+ const s = q(e), i = /* @__PURE__ */ new Map();
165
+ return { items: s.map((a, u) => {
166
+ if (a.__isGroup) {
167
+ const g = A(a, n, a.label), h = (a.__children ?? []).map((f, t) => {
168
+ const o = A(f, n, f.label), l = A(f, r, f.value), m = `opt-${u}-${t}`;
169
+ return i.set(m, { value: l, option: f }), { key: m, label: o, disabled: !!f.disabled };
170
+ });
171
+ return { key: `group-${u}`, type: "group", label: g, children: h };
172
+ }
173
+ const y = A(a, n, a.label), k = A(a, r, a.value), v = `opt-${u}`;
174
+ return i.set(v, { value: k, option: a }), { key: v, label: y, disabled: !!a.disabled };
175
+ }), keyMap: i, opts: s };
176
+ }
177
+ function be(e) {
178
+ const {
179
+ value: n,
180
+ onChange: r,
181
+ options: s,
182
+ labelField: i = "label",
183
+ valueField: c = "value",
184
+ multiple: a,
185
+ onChangeEx: u,
186
+ dropdownProps: y,
187
+ popoverProps: k,
188
+ buttonProps: v,
189
+ defaultRender: g
190
+ } = e, h = s ?? [], f = a ?? Array.isArray(n), { items: t, keyMap: o, opts: l } = S(
191
+ () => ve(h, i, c),
192
+ [h, i, c]
193
+ ), m = S(() => {
194
+ if (g) return g;
195
+ const R = f ? Array.isArray(n) && n.length ? `已选 ${n.length} 项` : "请选择" : n != null ? pe(n, h, i, c) || String(n) : "请选择";
196
+ return /* @__PURE__ */ d(te, { ...v, children: R });
197
+ }, [g, f, n, h, i, c, v]);
198
+ if (f) {
199
+ const R = l.flatMap((C) => C.__isGroup ? C.__children ?? [] : [C]), F = Array.isArray(n) ? n : [], w = /* @__PURE__ */ d("div", { style: { maxWidth: 360 }, children: /* @__PURE__ */ d(
200
+ G.Group,
201
+ {
202
+ value: F,
203
+ onChange: (C) => {
204
+ r?.(C);
205
+ const T = R.filter((O) => C.includes(A(O, c, O.value)));
206
+ u?.(C, T);
207
+ },
208
+ children: /* @__PURE__ */ d($, { direction: "vertical", size: 8, style: { width: "100%" }, children: l.map((C, T) => {
209
+ if (C.__isGroup) {
210
+ const z = A(C, i, C.label), H = C.__children ?? [];
211
+ return /* @__PURE__ */ V("div", { children: [
212
+ /* @__PURE__ */ d(ae.Text, { strong: !0, children: z }),
213
+ /* @__PURE__ */ d("div", { style: { marginTop: 8 }, children: /* @__PURE__ */ d($, { wrap: !0, children: H.map((P, W) => {
214
+ const J = A(P, i, P.label), Q = A(P, c, P.value);
215
+ return /* @__PURE__ */ d(
216
+ G,
217
+ {
218
+ value: Q,
219
+ disabled: !!P.disabled,
220
+ children: J
221
+ },
222
+ P.key ?? `${T}-${W}`
223
+ );
224
+ }) }) }),
225
+ /* @__PURE__ */ d(oe, { style: { margin: "12px 0" } })
226
+ ] }, `g-${T}`);
227
+ }
228
+ const O = A(C, i, C.label), I = A(C, c, C.value);
229
+ return /* @__PURE__ */ d(G, { value: I, disabled: !!C.disabled, children: O }, C.key ?? `o-${T}`);
230
+ }) })
231
+ }
232
+ ) });
233
+ return /* @__PURE__ */ d(le, { trigger: "click", placement: "bottom", content: w, ...k, children: /* @__PURE__ */ d("span", { style: { display: "inline-block" }, children: m }) });
234
+ }
235
+ const b = S(() => {
236
+ if (n != null) {
237
+ for (const [R, F] of o.entries())
238
+ if (F.value === n) return R;
239
+ }
240
+ }, [n, o]);
241
+ return /* @__PURE__ */ d(se, { trigger: ["click"], menu: {
242
+ items: t,
243
+ onClick: ({ key: R }) => {
244
+ const F = o.get(String(R));
245
+ F && (r?.(F.value), u?.(F.value, F.option));
246
+ },
247
+ selectedKeys: b
248
+ }, ...y, children: /* @__PURE__ */ d("span", { style: { display: "inline-block" }, children: m }) });
249
+ }
250
+ function B(e) {
251
+ return e == null || e === !1 || e === !0 ? "" : typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(B).join("") : U.isValidElement(e) ? B(e.props?.children) : "";
252
+ }
253
+ function Re(e = {}, n) {
254
+ const { type: r = "text", key: s, render2: i, ...c } = n ?? {}, a = (u) => {
255
+ n?.onChange?.(u.target.value, n), e?.onChange?.(u);
142
256
  };
143
- switch (s) {
257
+ switch (r) {
144
258
  case "password":
145
- return /* @__PURE__ */ g(w.Password, { ...m, ...e, onChange: d });
259
+ return /* @__PURE__ */ d(N.Password, { ...c, ...e, onChange: a });
146
260
  case "textarea":
147
- return /* @__PURE__ */ g(w.TextArea, { ...m, ...e, onChange: d });
261
+ return /* @__PURE__ */ d(N.TextArea, { ...c, ...e, onChange: a });
148
262
  default:
149
- return /* @__PURE__ */ g(w, { ...m, ...e, onChange: d });
263
+ return /* @__PURE__ */ d(N, { ...c, ...e, onChange: a });
150
264
  }
151
265
  }
266
+ function E(e, n, r = "label") {
267
+ const { labelField: s, valueField: i, childField: c, options: a = [] } = n, u = e.length ? e : a, y = s ?? "label", k = i ?? "value", v = c ?? "children";
268
+ return u.map((g) => {
269
+ const h = g[y], f = {
270
+ ...g,
271
+ [r]: h,
272
+ value: g[k],
273
+ searchText: B(h)
274
+ };
275
+ return Array.isArray(g[v]) && (f.children = E(g[v], n, r)), f;
276
+ });
277
+ }
278
+ function K(e, n, r = "label") {
279
+ const { labelField: s, valueField: i, options: c = [] } = n, a = e.length ? e : c, u = s ?? "label", y = i ?? "value";
280
+ return a.map((k) => {
281
+ const v = k[u];
282
+ return {
283
+ [r]: v,
284
+ value: k[y]
285
+ };
286
+ });
287
+ }
288
+ function we(e = [], n = {}, r) {
289
+ const { type: s, key: i, render2: c, searchOnLabel: a, ...u } = r ?? {}, { labelField: y, valueField: k, childField: v, ...g } = u, h = E(e, u), f = (o) => {
290
+ n?.onSearch?.(o);
291
+ const l = o.trim().toLowerCase(), m = h.filter(
292
+ (p) => (p.searchText ?? "").toLowerCase().includes(l)
293
+ ), b = m.find((p) => (p.searchText ?? "").toLowerCase() === l);
294
+ if (b) return t(b.value, b);
295
+ if (m.length === 1) return t(m[0].value, m[0]);
296
+ }, t = (o, l) => {
297
+ r?.onChange?.(o, r, l), n?.onChange?.(o, l);
298
+ };
299
+ return /* @__PURE__ */ d(
300
+ ce,
301
+ {
302
+ ...g,
303
+ options: h,
304
+ onSearch: a ? f : void 0,
305
+ optionFilterProp: a ? "searchText" : void 0,
306
+ ...n,
307
+ onChange: t
308
+ }
309
+ );
310
+ }
311
+ function Oe(e, n = {}, r) {
312
+ const { type: s, key: i, render2: c, searchOnLabel: a, ...u } = r ?? {}, { labelField: y, valueField: k, childField: v, ...g } = u, h = E(e, u, "title"), f = (o) => {
313
+ n?.onSearch?.(o);
314
+ const l = o.trim().toLowerCase(), m = h.filter(
315
+ (p) => (p.searchText ?? "").toLowerCase().includes(l)
316
+ ), b = m.find((p) => (p.searchText ?? "").toLowerCase() === l);
317
+ if (b) return t(b.value, r, b);
318
+ if (m.length === 1) return t(m[0].value, r, m[0]);
319
+ }, t = (o, l, m) => {
320
+ r?.onChange?.(o, r, l), n?.onChange?.(o, l, m);
321
+ };
322
+ return /* @__PURE__ */ d(
323
+ ie,
324
+ {
325
+ ...g,
326
+ treeData: h,
327
+ onSearch: a ? f : void 0,
328
+ treeNodeFilterProp: a ? "searchText" : void 0,
329
+ ...n,
330
+ onChange: t
331
+ }
332
+ );
333
+ }
334
+ function Pe(e = [], n = {}, r, s) {
335
+ const { labelField: i, valueField: c, onChange: a, mode: u, key: y, ...k } = r ?? {}, v = (f, t) => {
336
+ a?.(f, r, t);
337
+ }, g = u === "multiple", h = e.length ? e : r?.options;
338
+ return /* @__PURE__ */ d(
339
+ be,
340
+ {
341
+ ...k,
342
+ options: h,
343
+ labelField: i,
344
+ valueField: c,
345
+ multiple: g,
346
+ defaultRender: s,
347
+ onChangeEx: v,
348
+ dropdownProps: g ? void 0 : n,
349
+ popoverProps: g ? n : void 0
350
+ }
351
+ );
352
+ }
353
+ function Ce(e = [], n = {}, r) {
354
+ const { type: s, key: i, render2: c, searchOnLabel: a, ...u } = r ?? {}, { labelField: y, valueField: k, childField: v, ...g } = u, h = K(e, u), f = (t) => {
355
+ r?.onChange?.(t.target.value, r, h), n?.onChange?.(t);
356
+ };
357
+ return /* @__PURE__ */ d(ue.Group, { ...g, options: h, onChange: f, ...n });
358
+ }
359
+ function _e(e = [], n = {}, r) {
360
+ return Ce(e, { optionType: "button", ...n }, r);
361
+ }
362
+ function Se(e = [], n = {}, r) {
363
+ const { type: s, key: i, render2: c, searchOnLabel: a, ...u } = r ?? {}, { labelField: y, valueField: k, childField: v, ...g } = u, h = K(e, u), f = (t) => {
364
+ r?.onChange?.(t, r, h), n?.onChange?.(t);
365
+ };
366
+ return /* @__PURE__ */ d(G.Group, { ...g, options: h, onChange: f, ...n });
367
+ }
368
+ function Ie(e = {}, n) {
369
+ const { type: r, key: s, render2: i, searchOnLabel: c, ...a } = n ?? {}, { labelField: u, valueField: y, childField: k, ...v } = a;
370
+ return /* @__PURE__ */ d(de, { ...v, onChange: (h, f) => {
371
+ n?.onChange?.(h, n), e?.onChange?.(h, f);
372
+ }, ...e });
373
+ }
374
+ function Le(e = {}, n) {
375
+ const { type: r, key: s, render2: i, searchOnLabel: c, ...a } = n ?? {}, { labelField: u, valueField: y, childField: k, ...v } = a, g = (o, l) => {
376
+ n?.onChange?.(l, n), e?.onChange?.(o, l);
377
+ }, { isRange: h, ...f } = e, t = { ...v, onChange: g, ...f };
378
+ return h ? /* @__PURE__ */ d(M.RangePicker, { ...t }) : /* @__PURE__ */ d(M, { ...t });
379
+ }
380
+ function Ge(e = {}, n) {
381
+ const { type: r, key: s, render2: i, searchOnLabel: c, ...a } = n ?? {}, { labelField: u, valueField: y, childField: k, ...v } = a, g = (o, l) => {
382
+ n?.onChange?.(l, n), e?.onChange?.(o, l);
383
+ }, { isRange: h, ...f } = e, t = { ...v, onChange: g, ...f };
384
+ return h ? /* @__PURE__ */ d(D.RangePicker, { ...t }) : /* @__PURE__ */ d(D, { ...t });
385
+ }
152
386
  export {
153
- Q as AdDynamicForm,
154
- U as renderInput
387
+ Te as AdDynamicForm,
388
+ Se as renderCheckboxGroup,
389
+ Le as renderDatePicker,
390
+ Re as renderInput,
391
+ Pe as renderPopSelect,
392
+ _e as renderRadioButtonGroup,
393
+ Ce as renderRadioGroup,
394
+ we as renderSelect,
395
+ Ie as renderSwitch,
396
+ Ge as renderTimePicker,
397
+ Oe as renderTreeSelect
155
398
  };
@@ -0,0 +1,2 @@
1
+ declare const AntdIndex: () => import("react/jsx-runtime").JSX.Element;
2
+ export default AntdIndex;
@@ -0,0 +1,2 @@
1
+ declare const AllForm: () => import("react/jsx-runtime").JSX.Element;
2
+ export default AllForm;
@@ -0,0 +1,2 @@
1
+ declare const CustomForm: () => import("react/jsx-runtime").JSX.Element;
2
+ export default CustomForm;
@@ -0,0 +1,2 @@
1
+ declare const SimpleForm: () => import("react/jsx-runtime").JSX.Element;
2
+ export default SimpleForm;
@@ -0,0 +1,2 @@
1
+ declare const App: () => import("react/jsx-runtime").JSX.Element;
2
+ export default App;
@@ -0,0 +1,2 @@
1
+ declare function App(): import("react/jsx-runtime").JSX.Element;
2
+ export default App;
@@ -1,9 +1,17 @@
1
- import { ReactNode } from 'react';
1
+ import { CSSProperties, ReactNode } from 'react';
2
2
  export interface SelectOptionItem {
3
- label?: string;
3
+ label?: string | ReactNode;
4
4
  value: any;
5
+ className?: string;
6
+ style?: string | CSSProperties;
5
7
  disabled?: boolean;
6
8
  }
9
+ export type TreeSelectOption = {
10
+ label?: string | ReactNode;
11
+ value: any;
12
+ disabled?: boolean;
13
+ children?: TreeSelectOption[];
14
+ } | Record<string, any>;
7
15
  export interface BaseDyFormItem<T = any> {
8
16
  key: keyof T;
9
17
  label?: string;
@@ -28,7 +36,9 @@ export interface DyFormItem<K = any, RuleT = any> extends BaseDyFormItem<K> {
28
36
  rows?: number;
29
37
  labelField?: string;
30
38
  valueField?: string;
39
+ childField?: string;
31
40
  showSearch?: boolean | object;
41
+ searchOnLabel?: boolean;
32
42
  showCount?: boolean;
33
43
  mode?: 'multiple' | 'tags';
34
44
  isCustom?: boolean;
@@ -62,4 +72,5 @@ export type ZealColumn<T extends Record<string, any>> = {
62
72
  resizable?: boolean;
63
73
  render2?: (row: T, $index: number) => ReactNode;
64
74
  slot?: string;
75
+ formItemProps?: Record<string, any>;
65
76
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dynamicformdjx-react",
3
- "version": "0.1.1",
3
+ "version": "0.2.0",
4
4
  "type": "module",
5
5
  "author": "xczcdjx",
6
6
  "license": "MIT",