@kingteza/crud-component 1.27.0 → 1.27.1

package/dist/crud/CrudComponent.cjs.js

@@ -1 +1 @@
-"use strict";const e=require("react/jsx-runtime"),q=require("antd"),n=require("react"),X=require("./modal/index.cjs.js"),Y=require("./import/CrudImportButton.cjs.js"),Z=require("./view/CrudViewer.cjs.js"),$=require("../common/button/NewButton.cjs.js"),p=require("../common/button/PrintButton.cjs.js");function U({idField:x="id",onCreate:h,onDelete:N,onHide:v,onUpdate:t,onClickUpdate:d,fields:l,data:b,grid:g,isHiding:R,isCreating:y,isDeleting:B,isUpdating:M,paginateProps:S,onPrint:k,printing:I,viewable:O,loadingData:V,formBuilder:W,extraAction:_,minusHeight:w,scroll:z,cloneable:A,fullWidthModal:D=!0,wizard:E,extraView:F,importable:m,onClickNew:r,newButtonProps:c,size:G,headerRender:i,actionWidth:H,...J}){const a=n.useRef(null),K=n.useCallback(()=>{var s;(s=a.current)==null||s.create()},[]),o=n.useCallback(async(s,C=!0,T=!1)=>{var j;await((j=a.current)==null?void 0:j.update(s,C,T))},[]),L=n.useCallback(async s=>{o(s,!1,!0)},[o]),{onClick:P,...f}=n.useMemo(()=>c||{},[c]),u=n.useMemo(()=>e.jsx($.NewButton,{onClick:(s,C)=>{r?r():c!=null&&c.onClick?c.onClick(C):K()},className:"flex-1",...f}),[r,c,f]),Q=n.useCallback(()=>i?i({newButton:u}):u,[u,i]);return e.jsxs(e.Fragment,{children:[e.jsxs(q.Space,{direction:"vertical",className:"w-100",children:[e.jsxs("div",{className:"w-100 d-flex",children:[e.jsx("div",{className:"flex-1",children:Q()}),e.jsxs(q.Space,{children:[!!k&&e.jsx(p.PrintButton,{className:"float-right",loading:I,onClick:k}),!!m&&e.jsx(Y,{fields:l,importProps:m})]})]}),e.jsx(Z,{...J,minusHeight:w,scroll:z,data:b,size:G,fields:l,extraAction:_,actionWidth:H,idField:x,isDeleting:B,loadingData:V,onClickUpdate:d||(t?o:void 0),onHide:v,isHiding:R,onDelete:N,onUpdate:t,onClickClone:A?L:void 0,paginateProps:S,viewable:O,extraView:F})]}),e.jsx(X,{ref:a,fields:l,wizard:E,grid:g,fullWidthModal:D,isCreating:y,isUpdating:M,onCreate:h,onUpdate:t,idField:x,formBuilder:W})]})}module.exports=U;
+"use strict";const e=require("react/jsx-runtime"),q=require("antd"),n=require("react"),Y=require("./modal/index.cjs.js"),Z=require("./import/CrudImportButton.cjs.js"),$=require("./view/CrudViewer.cjs.js"),p=require("../common/button/NewButton.cjs.js"),U=require("../common/button/PrintButton.cjs.js");function P({idField:x="id",onCreate:h,onDelete:N,onHide:v,onUpdate:t,onClickUpdate:d,fields:l,data:b,grid:g,isHiding:R,isCreating:y,isDeleting:B,isUpdating:M,paginateProps:S,onPrint:k,printing:I,viewable:O,loadingData:V,formBuilder:W,extraAction:_,minusHeight:w,scroll:z,cloneable:A,fullWidthModal:D=!0,wizard:E,extraView:F,importable:m,onClickNew:r,newButtonProps:c,size:G,headerRender:i,actionWidth:H,onValuesChange:J,...K}){const a=n.useRef(null),L=n.useCallback(()=>{var s;(s=a.current)==null||s.create()},[]),o=n.useCallback(async(s,C=!0,X=!1)=>{var j;await((j=a.current)==null?void 0:j.update(s,C,X))},[]),Q=n.useCallback(async s=>{o(s,!1,!0)},[o]),{onClick:ee,...f}=n.useMemo(()=>c||{},[c]),u=n.useMemo(()=>e.jsx(p.NewButton,{onClick:(s,C)=>{r?r():c!=null&&c.onClick?c.onClick(C):L()},className:"flex-1",...f}),[r,c,f]),T=n.useCallback(()=>i?i({newButton:u}):u,[u,i]);return e.jsxs(e.Fragment,{children:[e.jsxs(q.Space,{direction:"vertical",className:"w-100",children:[e.jsxs("div",{className:"w-100 d-flex",children:[e.jsx("div",{className:"flex-1",children:T()}),e.jsxs(q.Space,{children:[!!k&&e.jsx(U.PrintButton,{className:"float-right",loading:I,onClick:k}),!!m&&e.jsx(Z,{fields:l,importProps:m})]})]}),e.jsx($,{...K,minusHeight:w,scroll:z,data:b,size:G,fields:l,extraAction:_,actionWidth:H,idField:x,isDeleting:B,loadingData:V,onClickUpdate:d||(t?o:void 0),onHide:v,isHiding:R,onDelete:N,onUpdate:t,onClickClone:A?Q:void 0,paginateProps:S,viewable:O,extraView:F})]}),e.jsx(Y,{ref:a,fields:l,wizard:E,grid:g,fullWidthModal:D,isCreating:y,isUpdating:M,onCreate:h,onUpdate:t,idField:x,formBuilder:W,onValuesChange:J})]})}module.exports=P;

package/dist/crud/CrudComponent.d.ts

@@ -1,4 +1,4 @@
-import { ButtonProps, ColorPickerProps } from 'antd';
+import { ButtonProps, ColorPickerProps, FormProps } from 'antd';
 import { Rule } from 'antd/es/form';
 import { FormInstance, FormItemProps, TablePaginationConfig, TableProps } from 'antd/lib';
 import { Dayjs } from 'dayjs';
@@ -21,7 +21,7 @@ export type SelectFieldItem = {
     disabled?: boolean;
 };
 export interface InitialCrudField<T> {
-    formLayoutProps?: Pick<FormItemProps, "layout" | 'labelCol' | 'wrapperCol'>;
+    formLayoutProps?: Pick<FormItemProps, "layout" | "labelCol" | "wrapperCol">;
     label: string;
     fieldHelper?: ReactNode;
     updatingValue?: T;
@@ -281,6 +281,7 @@ export type CrudComponentProps<T, FormType = T> = {
     headerRender?: (props: {
         newButton: JSX.Element;
     }) => React.ReactElement;
+    onValuesChange?: FormProps<T>["onValuesChange"];
 } & CrudSearchComponentProps<T, FormType>;
-declare function CrudComponent<T, FormType = T>({ idField, onCreate, onDelete, onHide, onUpdate, onClickUpdate, fields, data, grid, isHiding, isCreating, isDeleting, isUpdating, paginateProps, onPrint, printing, viewable, loadingData, formBuilder, extraAction, minusHeight, scroll, cloneable, fullWidthModal, wizard, extraView, importable, onClickNew, newButtonProps, size, headerRender, actionWidth, ...props }: CrudComponentProps<T, FormType>): import("react/jsx-runtime").JSX.Element;
+declare function CrudComponent<T, FormType = T>({ idField, onCreate, onDelete, onHide, onUpdate, onClickUpdate, fields, data, grid, isHiding, isCreating, isDeleting, isUpdating, paginateProps, onPrint, printing, viewable, loadingData, formBuilder, extraAction, minusHeight, scroll, cloneable, fullWidthModal, wizard, extraView, importable, onClickNew, newButtonProps, size, headerRender, actionWidth, onValuesChange, ...props }: CrudComponentProps<T, FormType>): import("react/jsx-runtime").JSX.Element;
 export default CrudComponent;

package/dist/crud/CrudComponent.es.js

@@ -1,12 +1,12 @@
-import { jsx as r, jsxs as l, Fragment as Z } from "react/jsx-runtime";
+import { jsx as r, jsxs as l, Fragment as $ } from "react/jsx-runtime";
 import { Space as N } from "antd";
-import { useRef as $, useCallback as c, useMemo as v } from "react";
-import w from "./modal/index.es.js";
-import U from "./import/CrudImportButton.es.js";
-import P from "./view/CrudViewer.es.js";
-import { NewButton as ee } from "../common/button/NewButton.es.js";
-import { PrintButton as oe } from "../common/button/PrintButton.es.js";
-function fe({
+import { useRef as w, useCallback as c, useMemo as v } from "react";
+import U from "./modal/index.es.js";
+import P from "./import/CrudImportButton.es.js";
+import ee from "./view/CrudViewer.es.js";
+import { NewButton as oe } from "../common/button/NewButton.es.js";
+import { PrintButton as re } from "../common/button/PrintButton.es.js";
+function ue({
   idField: C = "id",
   onCreate: g,
   onDelete: j,
@@ -39,55 +39,56 @@ function fe({
   size: J,
   headerRender: n,
   actionWidth: K,
-  ...L
+  onValuesChange: L,
+  ...Q
 }) {
-  const m = $(null), Q = c(() => {
+  const m = w(null), T = c(() => {
     var o;
     (o = m.current) == null || o.create();
   }, []), s = c(
-    async (o, u = !0, Y = !1) => {
+    async (o, u = !0, Z = !1) => {
       var x;
-      await ((x = m.current) == null ? void 0 : x.update(o, u, Y));
+      await ((x = m.current) == null ? void 0 : x.update(o, u, Z));
     },
     []
-  ), T = c(
+  ), X = c(
     async (o) => {
       s(o, !1, !0);
     },
     [s]
-  ), { onClick: re, ...p } = v(() => e || {}, [e]), f = v(
+  ), { onClick: le, ...p } = v(() => e || {}, [e]), f = v(
     () => /* @__PURE__ */ r(
-      ee,
+      oe,
       {
         onClick: (o, u) => {
-          a ? a() : e != null && e.onClick ? e.onClick(u) : Q();
+          a ? a() : e != null && e.onClick ? e.onClick(u) : T();
         },
         className: "flex-1",
         ...p
       }
     ),
     [a, e, p]
-  ), X = c(() => n ? n({ newButton: f }) : f, [f, n]);
-  return /* @__PURE__ */ l(Z, { children: [
+  ), Y = c(() => n ? n({ newButton: f }) : f, [f, n]);
+  return /* @__PURE__ */ l($, { children: [
     /* @__PURE__ */ l(N, { direction: "vertical", className: "w-100", children: [
       /* @__PURE__ */ l("div", { className: "w-100 d-flex", children: [
-        /* @__PURE__ */ r("div", { className: "flex-1", children: X() }),
+        /* @__PURE__ */ r("div", { className: "flex-1", children: Y() }),
         /* @__PURE__ */ l(N, { children: [
           !!k && /* @__PURE__ */ r(
-            oe,
+            re,
             {
               className: "float-right",
               loading: _,
               onClick: k
             }
           ),
-          !!h && /* @__PURE__ */ r(U, { fields: t, importProps: h })
+          !!h && /* @__PURE__ */ r(P, { fields: t, importProps: h })
         ] })
       ] }),
       /* @__PURE__ */ r(
-        P,
+        ee,
         {
-          ...L,
+          ...Q,
           minusHeight: B,
           scroll: D,
           data: M,
@@ -103,7 +104,7 @@ function fe({
           isHiding: O,
           onDelete: j,
           onUpdate: i,
-          onClickClone: E ? T : void 0,
+          onClickClone: E ? X : void 0,
           paginateProps: W,
           viewable: b,
           extraView: H
@@ -111,7 +112,7 @@ function fe({
       )
     ] }),
     /* @__PURE__ */ r(
-      w,
+      U,
       {
         ref: m,
         fields: t,
@@ -123,11 +124,12 @@ function fe({
         onCreate: g,
         onUpdate: i,
         idField: C,
-        formBuilder: z
+        formBuilder: z,
+        onValuesChange: L
       }
     )
   ] });
 }
 export {
-  fe as default
+  ue as default
 };

package/dist/crud/CrudForm.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),m=require("antd"),j=require("./CrudField.cjs.js"),b=require("../util/CrudUtil.cjs.js");function v({form:i,purpose:y="new",...o}){return e.jsx(m.Form,{form:i,layout:"vertical",children:e.jsx(x,{...o,purpose:y})})}function x({fields:i,formBuilder:y,grid:o,onDeleteFile:d,onUploadFile:u,purpose:c}){const p=s.useMemo(()=>i.filter(t=>!t.readonly&&(t.type!=="object"||typeof t.customFormFieldRender=="function")).map(t=>{const a={onUploading:t.type==="image"||t.type==="file"?r=>{var n;t.onUploading&&((n=t.onUploading)==null||n.call(t,r)),u==null||u(r)}:void 0,onDelete:t.type==="image"||t.type==="file"?r=>{var n;t.onUploading&&((n=t.onDelete)==null||n.call(t,r)),d==null||d(r)}:void 0};return e.jsx(s.Fragment,{children:t.grid&&o?e.jsx(m.Col,{...t.grid,children:s.createElement(j.default,{...t,...a,key:typeof t.name=="string"?t.name:String(t.name),updatable:c!=="update"?!0:t.updatable})}):s.createElement(j.default,{...t,...a,key:typeof t.name=="string"?t.name:String(t.name),updatable:c!=="update"?!0:t.updatable})},t.name)}),[i,o,d,u,c]),C=s.useCallback((t,a={})=>{const r=i.find(n=>b.getRealName(n.name)===t);if(r!=null&&r.hidden)return e.jsx(e.Fragment,{});if(r){const n={onUploading:r.type==="image"||r.type==="file"?g=>{var f;r.onUploading&&((f=r.onUploading)==null||f.call(r,g)),u==null||u(g)}:void 0,onDelete:r.type==="image"||r.type==="file"?g=>{var f;r.onUploading&&((f=r.onDelete)==null||f.call(r,g)),d==null||d(g)}:void 0},l=b.getRealName(r.name),h=s.createElement(j.default,{...r,...a,...n,key:typeof l=="string"?l:String(l),updatable:c!=="update"?!0:r.updatable});return a.render?a.render(h):h}return e.jsx(e.Fragment,{})},[i,c]);return e.jsx(e.Fragment,{children:y?e.jsxs(e.Fragment,{children:[y(C,{isAnyFieldHidden(...t){const a=Array.isArray(t)?t:[t];return i.filter(n=>a.includes(n.name)).some(n=>n.hidden)},isAllFieldsHidden(...t){const a=Array.isArray(t)?t:[t];return i.filter(n=>a.includes(n.name)).every(n=>n.hidden)},purpose:c}),e.jsxs(m.Form.Item,{hidden:!0,noStyle:!0,children:[e.jsx(m.Input,{name:"id"}),e.jsx(m.Input,{})]})]}):o?e.jsx(m.Row,{gutter:[8,8],children:p}):p})}exports.CrudForm=v;exports.CrudFormFields=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),m=require("antd"),j=require("./CrudField.cjs.js"),b=require("../util/CrudUtil.cjs.js");function v({form:d,purpose:y="new",onValuesChange:o,...i}){return e.jsx(m.Form,{form:d,layout:"vertical",onValuesChange:o,children:e.jsx(x,{...i,purpose:y})})}function x({fields:d,formBuilder:y,grid:o,onDeleteFile:i,onUploadFile:u,purpose:c}){const p=s.useMemo(()=>d.filter(t=>!t.readonly&&(t.type!=="object"||typeof t.customFormFieldRender=="function")).map(t=>{const a={onUploading:t.type==="image"||t.type==="file"?r=>{var n;t.onUploading&&((n=t.onUploading)==null||n.call(t,r)),u==null||u(r)}:void 0,onDelete:t.type==="image"||t.type==="file"?r=>{var n;t.onUploading&&((n=t.onDelete)==null||n.call(t,r)),i==null||i(r)}:void 0};return e.jsx(s.Fragment,{children:t.grid&&o?e.jsx(m.Col,{...t.grid,children:s.createElement(j.default,{...t,...a,key:typeof t.name=="string"?t.name:String(t.name),updatable:c!=="update"?!0:t.updatable})}):s.createElement(j.default,{...t,...a,key:typeof t.name=="string"?t.name:String(t.name),updatable:c!=="update"?!0:t.updatable})},t.name)}),[d,o,i,u,c]),C=s.useCallback((t,a={})=>{const r=d.find(n=>b.getRealName(n.name)===t);if(r!=null&&r.hidden)return e.jsx(e.Fragment,{});if(r){const n={onUploading:r.type==="image"||r.type==="file"?g=>{var f;r.onUploading&&((f=r.onUploading)==null||f.call(r,g)),u==null||u(g)}:void 0,onDelete:r.type==="image"||r.type==="file"?g=>{var f;r.onUploading&&((f=r.onDelete)==null||f.call(r,g)),i==null||i(g)}:void 0},l=b.getRealName(r.name),h=s.createElement(j.default,{...r,...a,...n,key:typeof l=="string"?l:String(l),updatable:c!=="update"?!0:r.updatable});return a.render?a.render(h):h}return e.jsx(e.Fragment,{})},[d,c]);return e.jsx(e.Fragment,{children:y?e.jsxs(e.Fragment,{children:[y(C,{isAnyFieldHidden(...t){const a=Array.isArray(t)?t:[t];return d.filter(n=>a.includes(n.name)).some(n=>n.hidden)},isAllFieldsHidden(...t){const a=Array.isArray(t)?t:[t];return d.filter(n=>a.includes(n.name)).every(n=>n.hidden)},purpose:c}),e.jsxs(m.Form.Item,{hidden:!0,noStyle:!0,children:[e.jsx(m.Input,{name:"id"}),e.jsx(m.Input,{})]})]}):o?e.jsx(m.Row,{gutter:[8,8],children:p}):p})}exports.CrudForm=v;exports.CrudFormFields=x;

package/dist/crud/CrudForm.d.ts

@@ -1,4 +1,4 @@
-import { FormInstance } from 'antd';
+import { FormInstance, FormProps } from 'antd';
 import { CrudFieldProps, CrudPurpose, FormBuilderFunc } from './CrudComponent';
 export interface CurdFormFieldsProps<T> {
     onDeleteFile?: (e: any) => void;
@@ -7,8 +7,9 @@ export interface CurdFormFieldsProps<T> {
     formBuilder?: FormBuilderFunc<T>;
     fields: CrudFieldProps<T>[];
     purpose?: CrudPurpose;
+    onValuesChange?: FormProps<T>["onValuesChange"];
 }
-export declare function CrudForm<T>({ form, purpose, ...props }: Readonly<CurdFormFieldsProps<T> & {
+export declare function CrudForm<T>({ form, purpose, onValuesChange, ...props }: Readonly<CurdFormFieldsProps<T> & {
     form: FormInstance;
 }>): import("react/jsx-runtime").JSX.Element;
 export declare function CrudFormFields<T>({ fields, formBuilder, grid, onDeleteFile, onUploadFile, purpose, }: Readonly<CurdFormFieldsProps<T>>): import("react/jsx-runtime").JSX.Element;

package/dist/crud/CrudForm.es.js

@@ -4,22 +4,23 @@ import { Form as R, Col as w, Input as A, Row as H } from "antd";
 import l from "./CrudField.es.js";
 import C from "../util/CrudUtil.es.js";
 function z({
-  form: d,
+  form: m,
   purpose: y = "new",
-  ...o
+  onValuesChange: o,
+  ...d
 }) {
-  return /* @__PURE__ */ a(R, { form: d, layout: "vertical", children: /* @__PURE__ */ a(I, { ...o, purpose: y }) });
+  return /* @__PURE__ */ a(R, { form: m, layout: "vertical", onValuesChange: o, children: /* @__PURE__ */ a(I, { ...d, purpose: y }) });
 }
 function I({
-  fields: d,
+  fields: m,
   formBuilder: y,
   grid: o,
-  onDeleteFile: m,
+  onDeleteFile: d,
   onUploadFile: e,
   purpose: u
 }) {
   const h = j(
-    () => d.filter(
+    () => m.filter(
       (t) => !t.readonly && (t.type !== "object" || typeof t.customFormFieldRender == "function")
     ).map((t) => {
       const i = {
@@ -29,7 +30,7 @@ function I({
         } : void 0,
         onDelete: t.type === "image" || t.type === "file" ? (r) => {
           var n;
-          t.onUploading && ((n = t.onDelete) == null || n.call(t, r)), m == null || m(r);
+          t.onUploading && ((n = t.onDelete) == null || n.call(t, r)), d == null || d(r);
         } : void 0
       };
       return /* @__PURE__ */ a(S.Fragment, { children: t.grid && o ? /* @__PURE__ */ a(w, { ...t.grid, children: /* @__PURE__ */ p(
@@ -50,10 +51,10 @@ function I({
         }
       ) }, t.name);
     }),
-    [d, o, m, e, u]
+    [m, o, d, e, u]
   ), k = N(
     (t, i = {}) => {
-      const r = d.find(
+      const r = m.find(
         (n) => C.getRealName(n.name) === t
       );
       if (r != null && r.hidden) return /* @__PURE__ */ a(g, {});
@@ -65,7 +66,7 @@ function I({
           } : void 0,
           onDelete: r.type === "image" || r.type === "file" ? (c) => {
             var f;
-            r.onUploading && ((f = r.onDelete) == null || f.call(r, c)), m == null || m(c);
+            r.onUploading && ((f = r.onDelete) == null || f.call(r, c)), d == null || d(c);
           } : void 0
         }, s = C.getRealName(r.name), b = /* @__PURE__ */ p(
           l,
@@ -81,17 +82,17 @@ function I({
       }
       return /* @__PURE__ */ a(g, {});
     },
-    [d, u]
+    [m, u]
   );
   return /* @__PURE__ */ a(g, { children: y ? /* @__PURE__ */ v(g, { children: [
     y(k, {
       isAnyFieldHidden(...t) {
         const i = Array.isArray(t) ? t : [t];
-        return d.filter((n) => i.includes(n.name)).some((n) => n.hidden);
+        return m.filter((n) => i.includes(n.name)).some((n) => n.hidden);
       },
       isAllFieldsHidden(...t) {
         const i = Array.isArray(t) ? t : [t];
-        return d.filter((n) => i.includes(n.name)).every((n) => n.hidden);
+        return m.filter((n) => i.includes(n.name)).every((n) => n.hidden);
       },
       purpose: u
     }),

package/dist/crud/CrudFormWizard.cjs.js

@@ -1 +1 @@
-"use strict";const e=require("react/jsx-runtime"),j=require("@ant-design/icons"),u=require("antd"),F=require("react"),y=require("../locale/index.cjs.js"),R=require("./CrudForm.cjs.js"),S=require("../common/wizard/WizardViewForm.cjs.js"),b=require("../util/CrudUtil.cjs.js"),C=require("../common/button/Button.cjs.js");function v({fields:d,className:m,onDeleteFile:h,onUploadFile:s,purpose:l,wizard:t=[],updatingValue:f,onSave:x,submitting:g}){const c=F.useMemo(()=>t.map(r=>{let n=!0;const o=d.filter(i=>r.fields.includes(b.getRealName(i.name)));return o.forEach(i=>n&&(n=i.hidden??!1)),{...r,hidden:n,fieldThatShouldShowing:o}}),[d,t]),a=F.useMemo(()=>c.filter(r=>!r.hidden),[c]);return e.jsx(S,{onSubmit:(r,n)=>{x(n)},className:m,pages:a.map(({title:r,icon:n,fieldThatShouldShowing:o,hidden:i},q)=>({title:r,icon:n,hidden:i,component:k=>e.jsx(N,{fields:o,onDeleteFile:h,onUploadFile:s,purpose:l,i:q,updatingValue:f,backward:k.backward,forward:k.forward,wizard:a,submitting:g},q)}))})}function N({fields:d,onDeleteFile:m,onUploadFile:h,purpose:s,wizard:l=[],i:t,forward:f,backward:x,submitting:g,updatingValue:c}){const a=l[t],{t:r}=y.useTranslationLib(),[n]=u.Form.useForm();return F.useEffect(()=>{if(c&&(s==="update"||s==="clone")){const o={};for(const i of d)o[b.getRealName(i.name,"upsertFieldName")]=c[b.getRealName(i.name,"upsertFieldName")];n.setFieldsValue(o)}},[d,n,s,c]),e.jsxs(u.Form,{name:String(t),form:n,layout:"vertical",children:[e.jsx(R.CrudFormFields,{fields:d,formBuilder:a.formBuilder,grid:a.grid,onDeleteFile:m,onUploadFile:h,purpose:s}),e.jsx(u.Divider,{}),e.jsxs(u.Row,{gutter:[8,8],children:[t>0&&e.jsx(u.Col,{md:12,children:e.jsx(C,{block:!0,icon:e.jsx(j.LeftOutlined,{}),htmlType:"button",type:"default",size:"large",onClick:()=>x(),children:r("str.back")})}),e.jsx(u.Col,{md:t>0?12:24,children:e.jsx(C,{block:!0,icon:l.length-1===t?e.jsx(j.SaveOutlined,{}):e.jsx(j.RightOutlined,{}),htmlType:"submit",type:"primary",loading:g,size:"large",onClick:()=>{n.validateFields().then(o=>{f(o,l.length-1===t,l.length-1===t)})},children:l.length-1===t?r("str."+(s==="update"?"update":"save")):r("str.next")})})]})]})}module.exports=v;
+"use strict";const e=require("react/jsx-runtime"),F=require("@ant-design/icons"),c=require("antd"),b=require("react"),R=require("../locale/index.cjs.js"),S=require("./CrudForm.cjs.js"),v=require("../common/wizard/WizardViewForm.cjs.js"),q=require("../util/CrudUtil.cjs.js"),y=require("../common/button/Button.cjs.js");function N({fields:d,className:h,onDeleteFile:f,onUploadFile:s,purpose:l,wizard:t=[],updatingValue:x,onSave:g,submitting:j,onValuesChange:u}){const m=b.useMemo(()=>t.map(r=>{let n=!0;const o=d.filter(i=>r.fields.includes(q.getRealName(i.name)));return o.forEach(i=>n&&(n=i.hidden??!1)),{...r,hidden:n,fieldThatShouldShowing:o}}),[d,t]),a=b.useMemo(()=>m.filter(r=>!r.hidden),[m]);return e.jsx(v,{onSubmit:(r,n)=>{g(n)},className:h,pages:a.map(({title:r,icon:n,fieldThatShouldShowing:o,hidden:i},k)=>({title:r,icon:n,hidden:i,component:C=>e.jsx(w,{fields:o,onDeleteFile:f,onUploadFile:s,purpose:l,i:k,updatingValue:x,backward:C.backward,forward:C.forward,wizard:a,submitting:j,onValuesChange:u},k)}))})}function w({fields:d,onDeleteFile:h,onUploadFile:f,purpose:s,wizard:l=[],i:t,forward:x,backward:g,submitting:j,updatingValue:u,onValuesChange:m}){const a=l[t],{t:r}=R.useTranslationLib(),[n]=c.Form.useForm();return b.useEffect(()=>{if(u&&(s==="update"||s==="clone")){const o={};for(const i of d)o[q.getRealName(i.name,"upsertFieldName")]=u[q.getRealName(i.name,"upsertFieldName")];n.setFieldsValue(o)}},[d,n,s,u]),e.jsxs(c.Form,{name:String(t),form:n,layout:"vertical",onValuesChange:m,children:[e.jsx(S.CrudFormFields,{fields:d,formBuilder:a.formBuilder,grid:a.grid,onDeleteFile:h,onUploadFile:f,purpose:s}),e.jsx(c.Divider,{}),e.jsxs(c.Row,{gutter:[8,8],children:[t>0&&e.jsx(c.Col,{md:12,children:e.jsx(y,{block:!0,icon:e.jsx(F.LeftOutlined,{}),htmlType:"button",type:"default",size:"large",onClick:()=>g(),children:r("str.back")})}),e.jsx(c.Col,{md:t>0?12:24,children:e.jsx(y,{block:!0,icon:l.length-1===t?e.jsx(F.SaveOutlined,{}):e.jsx(F.RightOutlined,{}),htmlType:"submit",type:"primary",loading:j,size:"large",onClick:()=>{n.validateFields().then(o=>{x(o,l.length-1===t,l.length-1===t)})},children:l.length-1===t?r("str."+(s==="update"?"update":"save")):r("str.next")})})]})]})}module.exports=N;

package/dist/crud/CrudFormWizard.d.ts

@@ -1,3 +1,4 @@
+import { FormProps } from 'antd';
 import { CrudFieldProps, CrudPurpose, CrudWizardProp } from './CrudComponent';
 export interface CrudFormWizardProps<T> {
     onDeleteFile?: (e: any) => void;
@@ -9,6 +10,7 @@ export interface CrudFormWizardProps<T> {
     onSave: (e: T) => void;
     updatingValue?: T;
     submitting?: boolean;
+    onValuesChange?: FormProps<T>["onValuesChange"];
 }
-declare function CrudFormWizard<T>({ fields, className, onDeleteFile, onUploadFile, purpose, wizard, updatingValue, onSave, submitting, }: Readonly<CrudFormWizardProps<T>>): import("react/jsx-runtime").JSX.Element;
+declare function CrudFormWizard<T>({ fields, className, onDeleteFile, onUploadFile, purpose, wizard, updatingValue, onSave, submitting, onValuesChange, }: Readonly<CrudFormWizardProps<T>>): import("react/jsx-runtime").JSX.Element;
 export default CrudFormWizard;

package/dist/crud/CrudFormWizard.es.js

@@ -1,140 +1,152 @@
-import { jsx as o, jsxs as k } from "react/jsx-runtime";
-import { LeftOutlined as N, SaveOutlined as R, RightOutlined as w } from "@ant-design/icons";
-import { Form as y, Divider as x, Row as T, Col as C } from "antd";
-import { useMemo as S, useEffect as W } from "react";
-import { useTranslationLib as j } from "../locale/index.es.js";
-import { CrudFormFields as z } from "./CrudForm.es.js";
-import B from "../common/wizard/WizardViewForm.es.js";
-import p from "../util/CrudUtil.es.js";
-import v from "../common/button/Button.es.js";
-function H({
+import { jsx as o, jsxs as y } from "react/jsx-runtime";
+import { LeftOutlined as R, SaveOutlined as w, RightOutlined as x } from "@ant-design/icons";
+import { Form as C, Divider as T, Row as W, Col as S } from "antd";
+import { useMemo as v, useEffect as j } from "react";
+import { useTranslationLib as z } from "../locale/index.es.js";
+import { CrudFormFields as B } from "./CrudForm.es.js";
+import O from "../common/wizard/WizardViewForm.es.js";
+import b from "../util/CrudUtil.es.js";
+import N from "../common/button/Button.es.js";
+function I({
   fields: d,
-  className: u,
-  onDeleteFile: f,
+  className: f,
+  onDeleteFile: s,
   onUploadFile: m,
   purpose: l,
   wizard: e = [],
-  updatingValue: s,
-  onSave: h,
-  submitting: g
+  updatingValue: h,
+  onSave: g,
+  submitting: p,
+  onValuesChange: a
 }) {
-  const a = S(() => e.map((t) => {
+  const u = v(() => e.map((t) => {
     let r = !0;
     const n = d.filter(
-      (i) => t.fields.includes(p.getRealName(i.name))
+      (i) => t.fields.includes(b.getRealName(i.name))
     );
     return n.forEach((i) => r && (r = i.hidden ?? !1)), {
       ...t,
       hidden: r,
       fieldThatShouldShowing: n
     };
-  }), [d, e]), c = S(
-    () => a.filter((t) => !t.hidden),
-    [a]
+  }), [d, e]), c = v(
+    () => u.filter((t) => !t.hidden),
+    [u]
   );
   return /* @__PURE__ */ o(
-    B,
+    O,
     {
       onSubmit: (t, r) => {
-        h(r);
+        g(r);
       },
-      className: u,
+      className: f,
       pages: c.map(
-        ({ title: t, icon: r, fieldThatShouldShowing: n, hidden: i }, b) => ({
+        ({ title: t, icon: r, fieldThatShouldShowing: n, hidden: i }, F) => ({
           title: t,
           icon: r,
           hidden: i,
-          component: (F) => /* @__PURE__ */ o(
-            O,
+          component: (k) => /* @__PURE__ */ o(
+            E,
             {
               fields: n,
-              onDeleteFile: f,
+              onDeleteFile: s,
               onUploadFile: m,
               purpose: l,
-              i: b,
-              updatingValue: s,
-              backward: F.backward,
-              forward: F.forward,
+              i: F,
+              updatingValue: h,
+              backward: k.backward,
+              forward: k.forward,
               wizard: c,
-              submitting: g
+              submitting: p,
+              onValuesChange: a
             },
-            b
+            F
           )
         })
       )
     }
   );
 }
-function O({
+function E({
   fields: d,
-  onDeleteFile: u,
-  onUploadFile: f,
+  onDeleteFile: f,
+  onUploadFile: s,
   purpose: m,
   wizard: l = [],
   i: e,
-  forward: s,
-  backward: h,
-  submitting: g,
-  updatingValue: a
+  forward: h,
+  backward: g,
+  submitting: p,
+  updatingValue: a,
+  onValuesChange: u
 }) {
-  const c = l[e], { t } = j(), [r] = y.useForm();
-  return W(() => {
+  const c = l[e], { t } = z(), [r] = C.useForm();
+  return j(() => {
     if (a && (m === "update" || m === "clone")) {
       const n = {};
       for (const i of d)
-        n[p.getRealName(i.name, "upsertFieldName")] = a[p.getRealName(i.name, "upsertFieldName")];
+        n[b.getRealName(i.name, "upsertFieldName")] = a[b.getRealName(i.name, "upsertFieldName")];
       r.setFieldsValue(n);
     }
-  }, [d, r, m, a]), /* @__PURE__ */ k(y, { name: String(e), form: r, layout: "vertical", children: [
-    /* @__PURE__ */ o(
-      z,
-      {
-        fields: d,
-        formBuilder: c.formBuilder,
-        grid: c.grid,
-        onDeleteFile: u,
-        onUploadFile: f,
-        purpose: m
-      }
-    ),
-    /* @__PURE__ */ o(x, {}),
-    /* @__PURE__ */ k(T, { gutter: [8, 8], children: [
-      e > 0 && /* @__PURE__ */ o(C, { md: 12, children: /* @__PURE__ */ o(
-        v,
-        {
-          block: !0,
-          icon: /* @__PURE__ */ o(N, {}),
-          htmlType: "button",
-          type: "default",
-          size: "large",
-          onClick: () => h(),
-          children: t("str.back")
-        }
-      ) }),
-      /* @__PURE__ */ o(C, { md: e > 0 ? 12 : 24, children: /* @__PURE__ */ o(
-        v,
-        {
-          block: !0,
-          icon: l.length - 1 === e ? /* @__PURE__ */ o(R, {}) : /* @__PURE__ */ o(w, {}),
-          htmlType: "submit",
-          type: "primary",
-          loading: g,
-          size: "large",
-          onClick: () => {
-            r.validateFields().then((n) => {
-              s(
-                n,
-                l.length - 1 === e,
-                l.length - 1 === e
-              );
-            });
-          },
-          children: l.length - 1 === e ? t("str." + (m === "update" ? "update" : "save")) : t("str.next")
-        }
-      ) })
-    ] })
-  ] });
+  }, [d, r, m, a]), /* @__PURE__ */ y(
+    C,
+    {
+      name: String(e),
+      form: r,
+      layout: "vertical",
+      onValuesChange: u,
+      children: [
+        /* @__PURE__ */ o(
+          B,
+          {
+            fields: d,
+            formBuilder: c.formBuilder,
+            grid: c.grid,
+            onDeleteFile: f,
+            onUploadFile: s,
+            purpose: m
+          }
+        ),
+        /* @__PURE__ */ o(T, {}),
+        /* @__PURE__ */ y(W, { gutter: [8, 8], children: [
+          e > 0 && /* @__PURE__ */ o(S, { md: 12, children: /* @__PURE__ */ o(
+            N,
+            {
+              block: !0,
+              icon: /* @__PURE__ */ o(R, {}),
+              htmlType: "button",
+              type: "default",
+              size: "large",
+              onClick: () => g(),
+              children: t("str.back")
+            }
+          ) }),
+          /* @__PURE__ */ o(S, { md: e > 0 ? 12 : 24, children: /* @__PURE__ */ o(
+            N,
+            {
+              block: !0,
+              icon: l.length - 1 === e ? /* @__PURE__ */ o(w, {}) : /* @__PURE__ */ o(x, {}),
+              htmlType: "submit",
+              type: "primary",
+              loading: p,
+              size: "large",
+              onClick: () => {
+                r.validateFields().then((n) => {
+                  h(
+                    n,
+                    l.length - 1 === e,
+                    l.length - 1 === e
+                  );
+                });
+              },
+              children: l.length - 1 === e ? t("str." + (m === "update" ? "update" : "save")) : t("str.next")
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
 }
 export {
-  H as default
+  I as default
 };

package/dist/crud/modal/index.cjs.js

@@ -1 +1 @@
-"use strict";const g=require("react/jsx-runtime"),B=require("antd"),t=require("react"),G=require("../CrudForm.cjs.js"),J=require("../CrudFormWizard.cjs.js"),K=require("../../locale/index.cjs.js"),H=require("../../util/CrudUtil.cjs.js"),Q=require("dayjs"),X=({fields:u,wizard:l,grid:I,fullWidthModal:M,isCreating:h,isUpdating:j,onCreate:b,onUpdate:v,idField:k="id",formBuilder:T},W)=>{const[s]=B.Form.useForm(),{t:C}=K.useTranslationLib(),[S,m]=t.useState(!1),[p,q]=t.useState("new"),[f,F]=t.useState(),[_,y]=t.useState(),[A,N]=t.useState(!1),[L,x]=t.useState(!1),[E,V]=t.useState(!1),P=t.useCallback(async c=>{var n;const d=l?c:await s.validateFields(),i=u.filter(a=>a.type==="color"),o={};for(const a of i){const e=H.getRealName(a.name,"upsertFieldName"),r=s.getFieldValue(e);o[e]=typeof r=="string"?r:(n=r==null?void 0:r.toHexString())==null?void 0:n.toUpperCase()}Object.assign(d,o),f&&v?(await v({...d,[k]:f[k]}),F(void 0)):!f&&b&&await b(d),y(void 0),s.resetFields(),m(!1)},[u,s,k,b,v,f,l]),R=t.useCallback(async c=>{N(c),x(!0)},[]),U=t.useCallback(async()=>{x(!0)},[]),O=t.useCallback(()=>{m(!0),q("new"),s.resetFields(),F(void 0),y(void 0)},[s]),D=t.useCallback(async(c,d=!0,i=!1)=>{try{V(!0),m(!0),q(i?"clone":"update");const o={};for(const n of u){const a=H.getRealName(n.name,"upsertFieldName"),e=c[a];if(i&&n.type==="image"){const r=e;try{const w=await n.provider.clone(r);o[a]=w;continue}catch{continue}}n.type==="date"||n.type==="time"?e&&(o[a]=Q(e)):n.type==="select"?n.multiple&&Array.isArray(e)?o[a]=e.map(r=>r[n.innerFieldId??"id"]):e&&typeof e=="object"?o[a]=e[n.innerFieldId??"id"]:(e&&typeof e=="string"||typeof e=="number")&&(o[a]=e):o[a]=e}s.setFieldsValue(o),y(o),d&&F(c)}finally{V(!1)}},[u,s]);t.useImperativeHandle(W,()=>({create:O,update:D}),[O,D]),t.useEffect(()=>{S&&(N(!1),x(!1))},[S]);const $=t.useCallback(async()=>{try{if(p==="clone"){const c=l?f:s.getFieldsValue(),d=u.filter(i=>i.type==="image");for(const i of d)c[i.name]&&i.provider.delete(c[i.name])}}finally{}l||s.resetFields(),y(void 0),F(void 0),m(!1)},[p,l,s,f,u]);return g.jsx(B.Modal,{width:M?"100%":void 0,title:C(p??"new"),open:S,confirmLoading:h||j,okText:C("str."+(p==="update"?"update":"save")),cancelText:C("str.cancel"),cancelButtonProps:{disabled:L,hidden:!!l},okButtonProps:{disabled:A,hidden:!!l},onCancel:$,onOk:()=>P(),destroyOnHidden:!0,children:g.jsxs(B.Spin,{spinning:E,children:[l?null:g.jsx(G.CrudForm,{purpose:p,fields:u,form:s,formBuilder:T,grid:I,onDeleteFile:U,onUploadFile:R}),l&&g.jsx(J,{submitting:h||j,className:"mt-2",onSave:P,updatingValue:_,fields:u,onDeleteFile:U,onUploadFile:R,purpose:p,wizard:l})]})})},Y=t.forwardRef(X);module.exports=Y;
+"use strict";const g=require("react/jsx-runtime"),B=require("antd"),t=require("react"),J=require("../CrudForm.cjs.js"),K=require("../CrudFormWizard.cjs.js"),Q=require("../../locale/index.cjs.js"),I=require("../../util/CrudUtil.cjs.js"),X=require("dayjs"),Y=({fields:u,wizard:l,grid:M,fullWidthModal:T,isCreating:h,isUpdating:j,onCreate:b,onUpdate:v,idField:k="id",formBuilder:W,onValuesChange:q},_)=>{const[s]=B.Form.useForm(),{t:S}=Q.useTranslationLib(),[C,m]=t.useState(!1),[p,N]=t.useState("new"),[f,F]=t.useState(),[A,y]=t.useState(),[L,V]=t.useState(!1),[E,x]=t.useState(!1),[$,P]=t.useState(!1),R=t.useCallback(async c=>{var n;const d=l?c:await s.validateFields(),i=u.filter(a=>a.type==="color"),o={};for(const a of i){const e=I.getRealName(a.name,"upsertFieldName"),r=s.getFieldValue(e);o[e]=typeof r=="string"?r:(n=r==null?void 0:r.toHexString())==null?void 0:n.toUpperCase()}Object.assign(d,o),f&&v?(await v({...d,[k]:f[k]}),F(void 0)):!f&&b&&await b(d),y(void 0),s.resetFields(),m(!1)},[u,s,k,b,v,f,l]),U=t.useCallback(async c=>{V(c),x(!0)},[]),O=t.useCallback(async()=>{x(!0)},[]),D=t.useCallback(()=>{m(!0),N("new"),s.resetFields(),F(void 0),y(void 0)},[s]),H=t.useCallback(async(c,d=!0,i=!1)=>{try{P(!0),m(!0),N(i?"clone":"update");const o={};for(const n of u){const a=I.getRealName(n.name,"upsertFieldName"),e=c[a];if(i&&n.type==="image"){const r=e;try{const G=await n.provider.clone(r);o[a]=G;continue}catch{continue}}n.type==="date"||n.type==="time"?e&&(o[a]=X(e)):n.type==="select"?n.multiple&&Array.isArray(e)?o[a]=e.map(r=>r[n.innerFieldId??"id"]):e&&typeof e=="object"?o[a]=e[n.innerFieldId??"id"]:(e&&typeof e=="string"||typeof e=="number")&&(o[a]=e):o[a]=e}s.setFieldsValue(o),y(o),d&&F(c)}finally{P(!1)}},[u,s]);t.useImperativeHandle(_,()=>({create:D,update:H}),[D,H]),t.useEffect(()=>{C&&(V(!1),x(!1))},[C]);const w=t.useCallback(async()=>{try{if(p==="clone"){const c=l?f:s.getFieldsValue(),d=u.filter(i=>i.type==="image");for(const i of d)c[i.name]&&i.provider.delete(c[i.name])}}finally{}l||s.resetFields(),y(void 0),F(void 0),m(!1)},[p,l,s,f,u]);return g.jsx(B.Modal,{width:T?"100%":void 0,title:S(p??"new"),open:C,confirmLoading:h||j,okText:S("str."+(p==="update"?"update":"save")),cancelText:S("str.cancel"),cancelButtonProps:{disabled:E,hidden:!!l},okButtonProps:{disabled:L,hidden:!!l},onCancel:w,onOk:()=>R(),destroyOnHidden:!0,children:g.jsxs(B.Spin,{spinning:$,children:[l?null:g.jsx(J.CrudForm,{purpose:p,fields:u,form:s,formBuilder:W,grid:M,onDeleteFile:O,onUploadFile:U,onValuesChange:q}),l&&g.jsx(K,{submitting:h||j,className:"mt-2",onSave:R,updatingValue:A,fields:u,onDeleteFile:O,onUploadFile:U,purpose:p,wizard:l,onValuesChange:q})]})})},Z=t.forwardRef(Y);module.exports=Z;

package/dist/crud/modal/index.d.ts

@@ -1,3 +1,4 @@
+import { FormProps } from 'antd';
 import { Ref } from 'react';
 import { CrudFieldProps, CrudWizardProp, FormBuilderFunc } from '../CrudComponent';
 import { default as IdProps } from '../../types/Id';
@@ -12,12 +13,13 @@ export interface CrudModalProps<T, FormType> {
     onUpdate?: (data: FormType & IdProps) => Promise<any>;
     idField?: string;
     formBuilder?: FormBuilderFunc<T>;
+    onValuesChange?: FormProps<T>["onValuesChange"];
 }
 export interface CrudModalRef<T> {
     create: () => void;
     update: (data: T, shouldSetUpdatingField?: boolean, isClone?: boolean) => Promise<void>;
 }
-declare const CrudModal: <T, FormType = T>({ fields, wizard, grid, fullWidthModal, isCreating, isUpdating, onCreate, onUpdate, idField, formBuilder, }: CrudModalProps<T, FormType>, ref: Ref<CrudModalRef<T>>) => import("react/jsx-runtime").JSX.Element;
+declare const CrudModal: <T, FormType = T>({ fields, wizard, grid, fullWidthModal, isCreating, isUpdating, onCreate, onUpdate, idField, formBuilder, onValuesChange, }: CrudModalProps<T, FormType>, ref: Ref<CrudModalRef<T>>) => import("react/jsx-runtime").JSX.Element;
 declare const _default: <T, FormType = T>(props: CrudModalProps<T, FormType> & {
     ref?: Ref<CrudModalRef<T>>;
 }) => ReturnType<typeof CrudModal>;

package/dist/crud/modal/index.es.js

@@ -1,29 +1,30 @@
-import { jsx as N, jsxs as G } from "react/jsx-runtime";
-import { Form as J, Modal as K, Spin as Q } from "antd";
-import { forwardRef as X, useState as u, useCallback as m, useImperativeHandle as Y, useEffect as Z } from "react";
-import { CrudForm as z } from "../CrudForm.es.js";
-import ee from "../CrudFormWizard.es.js";
-import { useTranslationLib as te } from "../../locale/index.es.js";
-import M from "../../util/CrudUtil.es.js";
-import oe from "dayjs";
-const ne = ({
+import { jsx as S, jsxs as J } from "react/jsx-runtime";
+import { Form as K, Modal as Q, Spin as X } from "antd";
+import { forwardRef as Y, useState as u, useCallback as m, useImperativeHandle as Z, useEffect as z } from "react";
+import { CrudForm as ee } from "../CrudForm.es.js";
+import te from "../CrudFormWizard.es.js";
+import { useTranslationLib as oe } from "../../locale/index.es.js";
+import R from "../../util/CrudUtil.es.js";
+import ne from "dayjs";
+const se = ({
   fields: c,
   wizard: l,
-  grid: R,
-  fullWidthModal: T,
-  isCreating: S,
-  isUpdating: V,
+  grid: T,
+  fullWidthModal: W,
+  isCreating: x,
+  isUpdating: C,
   onCreate: v,
   onUpdate: b,
   idField: B = "id",
-  formBuilder: W
-}, _) => {
-  const [t] = J.useForm(), { t: h } = te(), [k, F] = u(!1), [p, x] = u("new"), [f, y] = u(), [A, g] = u(), [L, j] = u(!1), [E, C] = u(!1), [$, P] = u(!1), U = m(
+  formBuilder: _,
+  onValuesChange: V
+}, A) => {
+  const [t] = K.useForm(), { t: h } = oe(), [k, F] = u(!1), [p, j] = u("new"), [f, y] = u(), [L, g] = u(), [E, P] = u(!1), [$, N] = u(!1), [q, U] = u(!1), O = m(
     async (i) => {
       var o;
       const d = l ? i : await t.validateFields(), a = c.filter((s) => s.type === "color"), n = {};
       for (const s of a) {
-        const e = M.getRealName(s.name, "upsertFieldName"), r = t.getFieldValue(e);
+        const e = R.getRealName(s.name, "upsertFieldName"), r = t.getFieldValue(e);
         n[e] = typeof r == "string" ? r : (o = r == null ? void 0 : r.toHexString()) == null ? void 0 : o.toUpperCase();
       }
       Object.assign(d, n), f && b ? (await b({
@@ -32,54 +33,54 @@ const ne = ({
       }), y(void 0)) : !f && v && await v(d), g(void 0), t.resetFields(), F(!1);
     },
     [c, t, B, v, b, f, l]
-  ), O = m(async (i) => {
-    j(i), C(!0);
-  }, []), D = m(async () => {
-    C(!0);
-  }, []), H = m(() => {
-    F(!0), x("new"), t.resetFields(), y(void 0), g(void 0);
-  }, [t]), I = m(
+  ), D = m(async (i) => {
+    P(i), N(!0);
+  }, []), H = m(async () => {
+    N(!0);
+  }, []), I = m(() => {
+    F(!0), j("new"), t.resetFields(), y(void 0), g(void 0);
+  }, [t]), M = m(
     async (i, d = !0, a = !1) => {
       try {
-        P(!0), F(!0), x(a ? "clone" : "update");
+        U(!0), F(!0), j(a ? "clone" : "update");
         const n = {};
         for (const o of c) {
-          const s = M.getRealName(
+          const s = R.getRealName(
             o.name,
             "upsertFieldName"
           ), e = i[s];
           if (a && o.type === "image") {
             const r = e;
             try {
-              const w = await o.provider.clone(r);
-              n[s] = w;
+              const G = await o.provider.clone(r);
+              n[s] = G;
               continue;
             } catch {
               continue;
             }
           }
-          o.type === "date" || o.type === "time" ? e && (n[s] = oe(e)) : o.type === "select" ? o.multiple && Array.isArray(e) ? n[s] = e.map(
+          o.type === "date" || o.type === "time" ? e && (n[s] = ne(e)) : o.type === "select" ? o.multiple && Array.isArray(e) ? n[s] = e.map(
             (r) => r[o.innerFieldId ?? "id"]
           ) : e && typeof e == "object" ? n[s] = e[o.innerFieldId ?? "id"] : (e && typeof e == "string" || typeof e == "number") && (n[s] = e) : n[s] = e;
         }
         t.setFieldsValue(n), g(n), d && y(i);
       } finally {
-        P(!1);
+        U(!1);
       }
     },
     [c, t]
   );
-  Y(
-    _,
+  Z(
+    A,
     () => ({
-      create: H,
-      update: I
+      create: I,
+      update: M
     }),
-    [H, I]
-  ), Z(() => {
-    k && (j(!1), C(!1));
+    [I, M]
+  ), z(() => {
+    k && (P(!1), N(!1));
   }, [k]);
-  const q = m(async () => {
+  const w = m(async () => {
     try {
       if (p === "clone") {
         const i = l ? f : t.getFieldsValue(), d = c.filter((a) => a.type === "image");
@@ -90,57 +91,59 @@ const ne = ({
     }
     l || t.resetFields(), g(void 0), y(void 0), F(!1);
   }, [p, l, t, f, c]);
-  return /* @__PURE__ */ N(
-    K,
+  return /* @__PURE__ */ S(
+    Q,
     {
-      width: T ? "100%" : void 0,
+      width: W ? "100%" : void 0,
       title: h(p ?? "new"),
       open: k,
-      confirmLoading: S || V,
+      confirmLoading: x || C,
       okText: h("str." + (p === "update" ? "update" : "save")),
       cancelText: h("str.cancel"),
       cancelButtonProps: {
-        disabled: E,
+        disabled: $,
         hidden: !!l
       },
       okButtonProps: {
-        disabled: L,
+        disabled: E,
         hidden: !!l
       },
-      onCancel: q,
-      onOk: () => U(),
+      onCancel: w,
+      onOk: () => O(),
       destroyOnHidden: !0,
-      children: /* @__PURE__ */ G(Q, { spinning: $, children: [
-        l ? null : /* @__PURE__ */ N(
-          z,
+      children: /* @__PURE__ */ J(X, { spinning: q, children: [
+        l ? null : /* @__PURE__ */ S(
+          ee,
           {
             purpose: p,
             fields: c,
             form: t,
-            formBuilder: W,
-            grid: R,
-            onDeleteFile: D,
-            onUploadFile: O
+            formBuilder: _,
+            grid: T,
+            onDeleteFile: H,
+            onUploadFile: D,
+            onValuesChange: V
           }
         ),
-        l && /* @__PURE__ */ N(
-          ee,
+        l && /* @__PURE__ */ S(
+          te,
           {
-            submitting: S || V,
+            submitting: x || C,
             className: "mt-2",
-            onSave: U,
-            updatingValue: A,
+            onSave: O,
+            updatingValue: L,
             fields: c,
-            onDeleteFile: D,
-            onUploadFile: O,
+            onDeleteFile: H,
+            onUploadFile: D,
             purpose: p,
-            wizard: l
+            wizard: l,
+            onValuesChange: V
           }
         )
       ] })
     }
   );
-}, pe = X(ne);
+}, fe = Y(se);
 export {
-  pe as default
+  fe as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kingteza/crud-component",
   "private": false,
-  "version": "1.27.0",
+  "version": "1.27.1",
   "description": "React CRUD component library with Ant Design",
   "keywords": [
     "react",