@kingteza/crud-component 1.18.0 → 1.20.0

package/dist/common/rich/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var O=Object.create;var j=Object.defineProperty;var U=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,K=Object.prototype.hasOwnProperty;var L=(r,n,s,u)=>{if(n&&typeof n=="object"||typeof n=="function")for(let c of W(n))!K.call(r,c)&&c!==s&&j(r,c,{get:()=>n[c],enumerable:!(u=U(n,c))||u.enumerable});return r};var A=(r,n,s)=>(s=r!=null?O(z(r)):{},L(n||!r||!r.__esModule?j(s,"default",{value:r,enumerable:!0}):s,r));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),k=require("antd"),o=require("react"),D=require("../../util/ValidationUtil.cjs.js"),G=o.lazy(async()=>{const{default:r}=await import("react-quill"),{Quill:n}=r,s=n.import("blots/block");return s.tagName="div",n.register(s),{default:u=>g.jsx(r,{...u})}}),J=({formLayout:r,name:n,label:s,required:u,rules:c=[],disabled:v,help:F})=>{const d=k.Form.useFormInstance(),[m,x]=o.useState(""),T=o.useRef(!1),i="    ",f=t=>{if(!t)return"";if(typeof t=="string")return t;try{return String(t)}catch{return""}},H=()=>function(t){const e=this.quill,a=e.getSelection(!0);if(a){const b=a.index,S=a.index+a.length,Q=e.getText(),h=[];for(let l=b;l<=S;l++)(l===0||Q[l-1]===`
-`)&&h.push(l);if(h.length===0&&h.push(b),t>0){let l=0;h.forEach(p=>{e.insertText(p+l,i),l+=i.length}),e.setSelection(b+i.length,S+h.length*i.length)}else{let l=0;h.forEach(N=>{const R=N-l;e.getText(R,i.length)===i&&(e.deleteText(R,i.length),l+=i.length)});const p=Math.max(0,b-i.length),B=Math.max(p,S-l);e.setSelection(p,B)}}},w=()=>function(){const t=this.quill,e=t.getSelection(!0);return e?(t.insertText(e.index,i),t.setSelection(e.index+i.length),!1):!0},C=()=>function(){const t=this.quill,e=t.getSelection(!0);return e&&e.index>=i.length&&t.getText(e.index-i.length,i.length)===i?(t.deleteText(e.index-i.length,i.length),t.setSelection(e.index-i.length),!1):!0},V=o.useMemo(()=>{const t=H(),e=w(),a=C();return{toolbar:{container:[["bold","italic","underline","strike","blockquote"],[{list:"ordered"},{list:"bullet"}],[{indent:"-1"},{indent:"+1"}],["link"],["clean"]],handlers:{indent:t}},keyboard:{bindings:{tab:{key:"Tab",handler:e},"shift-tab":{key:"Tab",shiftKey:!0,handler:a}}}}},[]),q=o.useMemo(()=>["bold","italic","underline","strike","blockquote","list","bullet","link"],[]);o.useEffect(()=>{const t=d.getFieldValue(n),e=f(t);e&&e!=="<p></p>"&&e!=="<p><br></p>"&&e!=="<div></div>"&&x(e)},[d,n]);const y=k.Form.useWatch(n,d);o.useEffect(()=>{if(T.current)return;const t=f(y),e=f(m);t!==e&&x(!t||t==="<p></p>"||t==="<p><br></p>"||t==="<div></div>"?"":t)},[y]);const E=o.useCallback(t=>{const e=f(t);T.current=!0,x(e);const a=!e||e==="<p></p>"||e.trim()==="<p><br></p>"||e==="<div></div>"||e.trim()==="<div></div>"?void 0:e;d.setFieldValue(n,a),setTimeout(()=>{T.current=!1},0),d.validateFields([n]).catch(()=>{})},[d,n]),I=o.useMemo(()=>u?[...c,...D.required(s??"")]:c,[u,c,s]),M=o.useMemo(()=>f(m)||"",[m]),P=o.useMemo(()=>({readOnly:!!v,value:String(M||""),onChange:E,theme:"snow",className:"rich-text-editor",modules:V,formats:q}),[v,M,E,V,q]);return g.jsx(k.Form.Item,{help:F,name:n,label:s,rules:I,layout:r,children:g.jsx(o.Suspense,{fallback:g.jsx("div",{children:"Loading editor..."}),children:g.jsx(G,{...P})})})};exports.RichTextEditor=J;
+"use strict";var O=Object.create;var j=Object.defineProperty;var U=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,K=Object.prototype.hasOwnProperty;var L=(r,n,s,u)=>{if(n&&typeof n=="object"||typeof n=="function")for(let c of W(n))!K.call(r,c)&&c!==s&&j(r,c,{get:()=>n[c],enumerable:!(u=U(n,c))||u.enumerable});return r};var A=(r,n,s)=>(s=r!=null?O(z(r)):{},L(n||!r||!r.__esModule?j(s,"default",{value:r,enumerable:!0}):s,r));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),k=require("antd"),o=require("react"),D=require("../../util/ValidationUtil.cjs.js"),G=o.lazy(async()=>{const{default:r}=await import("react-quill"),{Quill:n}=r,s=n.import("blots/block");return s.tagName="div",n.register(s),{default:u=>g.jsx(r,{...u})}}),J=({formLayoutProps:r,name:n,label:s,required:u,rules:c=[],disabled:v,help:F})=>{const d=k.Form.useFormInstance(),[m,x]=o.useState(""),T=o.useRef(!1),i="    ",f=t=>{if(!t)return"";if(typeof t=="string")return t;try{return String(t)}catch{return""}},H=()=>function(t){const e=this.quill,a=e.getSelection(!0);if(a){const b=a.index,S=a.index+a.length,Q=e.getText(),h=[];for(let l=b;l<=S;l++)(l===0||Q[l-1]===`
+`)&&h.push(l);if(h.length===0&&h.push(b),t>0){let l=0;h.forEach(p=>{e.insertText(p+l,i),l+=i.length}),e.setSelection(b+i.length,S+h.length*i.length)}else{let l=0;h.forEach(N=>{const R=N-l;e.getText(R,i.length)===i&&(e.deleteText(R,i.length),l+=i.length)});const p=Math.max(0,b-i.length),B=Math.max(p,S-l);e.setSelection(p,B)}}},w=()=>function(){const t=this.quill,e=t.getSelection(!0);return e?(t.insertText(e.index,i),t.setSelection(e.index+i.length),!1):!0},C=()=>function(){const t=this.quill,e=t.getSelection(!0);return e&&e.index>=i.length&&t.getText(e.index-i.length,i.length)===i?(t.deleteText(e.index-i.length,i.length),t.setSelection(e.index-i.length),!1):!0},V=o.useMemo(()=>{const t=H(),e=w(),a=C();return{toolbar:{container:[["bold","italic","underline","strike","blockquote"],[{list:"ordered"},{list:"bullet"}],[{indent:"-1"},{indent:"+1"}],["link"],["clean"]],handlers:{indent:t}},keyboard:{bindings:{tab:{key:"Tab",handler:e},"shift-tab":{key:"Tab",shiftKey:!0,handler:a}}}}},[]),q=o.useMemo(()=>["bold","italic","underline","strike","blockquote","list","bullet","link"],[]);o.useEffect(()=>{const t=d.getFieldValue(n),e=f(t);e&&e!=="<p></p>"&&e!=="<p><br></p>"&&e!=="<div></div>"&&x(e)},[d,n]);const y=k.Form.useWatch(n,d);o.useEffect(()=>{if(T.current)return;const t=f(y),e=f(m);t!==e&&x(!t||t==="<p></p>"||t==="<p><br></p>"||t==="<div></div>"?"":t)},[y]);const E=o.useCallback(t=>{const e=f(t);T.current=!0,x(e);const a=!e||e==="<p></p>"||e.trim()==="<p><br></p>"||e==="<div></div>"||e.trim()==="<div></div>"?void 0:e;d.setFieldValue(n,a),setTimeout(()=>{T.current=!1},0),d.validateFields([n]).catch(()=>{})},[d,n]),I=o.useMemo(()=>u?[...c,...D.required(s??"")]:c,[u,c,s]),M=o.useMemo(()=>f(m)||"",[m]),P=o.useMemo(()=>({readOnly:!!v,value:String(M||""),onChange:E,theme:"snow",className:"rich-text-editor",modules:V,formats:q}),[v,M,E,V,q]);return g.jsx(k.Form.Item,{help:F,name:n,label:s,rules:I,...r,children:g.jsx(o.Suspense,{fallback:g.jsx("div",{children:"Loading editor..."}),children:g.jsx(G,{...P})})})};exports.RichTextEditor=J;

package/dist/common/rich/index.d.ts

@@ -1,5 +1,5 @@
 import { Rule } from 'antd/es/form';
-import { FormItemLayout } from 'antd/es/form/Form';
+import { FormItemProps } from 'antd/lib';
 import { FC, ReactNode } from 'react';
 export interface RichTextEditorProps {
     help?: ReactNode;
@@ -8,6 +8,6 @@ export interface RichTextEditorProps {
     required?: boolean;
     rules?: Rule[];
     disabled?: boolean;
-    formLayout?: FormItemLayout;
+    formLayoutProps?: Pick<FormItemProps, "layout" | 'labelCol' | 'wrapperCol'>;
 }
 export declare const RichTextEditor: FC<RichTextEditorProps>;

package/dist/common/rich/index.es.js

@@ -6,7 +6,7 @@ const A = W.lazy(async () => {
   const { default: h } = await import("react-quill"), { Quill: r } = h, o = r.import("blots/block");
   return o.tagName = "div", r.register(o), { default: (f) => /* @__PURE__ */ d(h, { ...f }) };
 }), Z = ({
-  formLayout: h,
+  formLayoutProps: h,
   name: r,
   label: o,
   required: f,
@@ -79,7 +79,7 @@ const A = W.lazy(async () => {
         }
       }
     };
-  }, []), y = u(() => [
+  }, []), q = u(() => [
     "bold",
     "italic",
     "underline",
@@ -93,13 +93,13 @@ const A = W.lazy(async () => {
     const e = s.getFieldValue(r), t = a(e);
     t && t !== "<p></p>" && t !== "<p><br></p>" && t !== "<div></div>" && g(t);
   }, [s, r]);
-  const q = S.useWatch(r, s);
+  const y = S.useWatch(r, s);
   w(() => {
     if (T.current)
       return;
-    const e = a(q), t = a(m);
+    const e = a(y), t = a(m);
     e !== t && g(!e || e === "<p></p>" || e === "<p><br></p>" || e === "<div></div>" ? "" : e);
-  }, [q]);
+  }, [y]);
   const E = K((e) => {
     const t = a(e);
     T.current = !0, g(t);
@@ -118,9 +118,9 @@ const A = W.lazy(async () => {
     theme: "snow",
     className: "rich-text-editor",
     modules: v,
-    formats: y
-  }), [V, H, E, v, y]);
-  return /* @__PURE__ */ d(S.Item, { help: C, name: r, label: o, rules: Q, layout: h, children: /* @__PURE__ */ d(L, { fallback: /* @__PURE__ */ d("div", { children: "Loading editor..." }), children: /* @__PURE__ */ d(A, { ...B }) }) });
+    formats: q
+  }), [V, H, E, v, q]);
+  return /* @__PURE__ */ d(S.Item, { help: C, name: r, label: o, rules: Q, ...h, children: /* @__PURE__ */ d(L, { fallback: /* @__PURE__ */ d("div", { children: "Loading editor..." }), children: /* @__PURE__ */ d(A, { ...B }) }) });
 };
 export {
   Z as RichTextEditor

package/dist/crud/CrudComponent.cjs.js

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

package/dist/crud/CrudComponent.d.ts

@@ -1,6 +1,6 @@
 import { ButtonProps, ColorPickerProps } from 'antd';
 import { Rule } from 'antd/es/form';
-import { FormInstance, TablePaginationConfig } from 'antd/lib';
+import { FormInstance, FormItemProps, TablePaginationConfig, TableProps } from 'antd/lib';
 import { Dayjs } from 'dayjs';
 import { default as React, ReactElement, ReactNode } from 'react';
 import { CrudSearchComponentProps } from './CrudSearchComponent';
@@ -14,14 +14,13 @@ import { TextAreaBasedFieldProps } from '.';
 import { SizeType } from 'antd/es/config-provider/SizeContext';
 import { Copyable } from 'src/util/CopyUtilComponent';
 import { ColumnType } from 'antd/es/table';
-import { FormItemLayout } from 'antd/es/form/Form';
 export type SelectFieldItem = {
     key?: string | number;
     value: string | number;
     disabled?: boolean;
 };
 export interface InitialCrudField<T> {
-    formLayout?: FormItemLayout;
+    formLayoutProps?: Pick<FormItemProps, "layout" | 'labelCol' | 'wrapperCol'>;
     label: string;
     fieldHelper?: ReactNode;
     updatingValue?: T;
@@ -259,6 +258,7 @@ export type CrudComponentProps<T, FormType = T> = {
     paginateProps?: CrudPaginateProps;
     formBuilder?: FormBuilderFunc<T>;
     minusHeight?: string;
+    scroll?: TableProps<T>["scroll"];
     cloneable?: boolean;
     fullWidthModal?: boolean;
     wizard?: CrudWizardProp<T>[];
@@ -275,5 +275,5 @@ export type CrudComponentProps<T, FormType = T> = {
         newButton: JSX.Element;
     }) => React.ReactElement;
 } & 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, cloneable, fullWidthModal, wizard, extraView, importable, onClickNew, newButtonProps, size, headerRender, ...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, ...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 e, jsxs as l, Fragment as X } from "react/jsx-runtime";
+import { jsx as e, jsxs as l, Fragment as Y } from "react/jsx-runtime";
 import { Space as x } from "antd";
-import { useRef as Y, useCallback as c, useMemo as N } from "react";
-import Z from "./modal/index.es.js";
-import $ from "./import/CrudImportButton.es.js";
-import w from "./view/CrudViewer.es.js";
-import { NewButton as U } from "../common/button/NewButton.es.js";
-import { PrintButton as P } from "../common/button/PrintButton.es.js";
-function mo({
+import { useRef as Z, useCallback as c, useMemo as N } from "react";
+import $ from "./modal/index.es.js";
+import w from "./import/CrudImportButton.es.js";
+import U from "./view/CrudViewer.es.js";
+import { NewButton as P } from "../common/button/NewButton.es.js";
+import { PrintButton as oo } from "../common/button/PrintButton.es.js";
+function so({
   idField: C = "id",
   onCreate: g,
   onDelete: j,
@@ -28,67 +28,69 @@ function mo({
   formBuilder: z,
   extraAction: A,
   minusHeight: B,
-  cloneable: D,
-  fullWidthModal: E = !0,
-  wizard: F,
-  extraView: G,
+  scroll: D,
+  cloneable: E,
+  fullWidthModal: F = !0,
+  wizard: G,
+  extraView: H,
   importable: h,
   onClickNew: n,
   newButtonProps: o,
-  size: H,
+  size: J,
   headerRender: a,
-  ...J
+  ...K
 }) {
-  const m = Y(null), K = c(() => {
+  const m = Z(null), L = c(() => {
     var r;
     (r = m.current) == null || r.create();
   }, []), s = c(
-    async (r, u = !0, T = !1) => {
+    async (r, u = !0, X = !1) => {
       var v;
-      await ((v = m.current) == null ? void 0 : v.update(r, u, T));
+      await ((v = m.current) == null ? void 0 : v.update(r, u, X));
     },
     []
-  ), L = c(
+  ), Q = c(
     async (r) => {
       s(r, !1, !0);
     },
     [s]
-  ), { onClick: oo, ...p } = N(() => o || {}, [o]), f = N(
+  ), { onClick: ro, ...p } = N(() => o || {}, [o]), f = N(
     () => /* @__PURE__ */ e(
-      U,
+      P,
       {
         onClick: (r, u) => {
-          n ? n() : o != null && o.onClick ? o.onClick(u) : K();
+          n ? n() : o != null && o.onClick ? o.onClick(u) : L();
         },
         className: "flex-1",
         ...p
       }
     ),
     [n, o, p]
-  ), Q = c(() => a ? a({ newButton: f }) : f, [f, a]);
-  return /* @__PURE__ */ l(X, { children: [
+  ), T = c(() => a ? a({ newButton: f }) : f, [f, a]);
+  return /* @__PURE__ */ l(Y, { children: [
     /* @__PURE__ */ l(x, { direction: "vertical", className: "w-100", children: [
       /* @__PURE__ */ l("div", { className: "w-100 d-flex", children: [
-        /* @__PURE__ */ e("div", { children: Q() }),
+        /* @__PURE__ */ e("div", { children: T() }),
         /* @__PURE__ */ l(x, { children: [
           !!k && /* @__PURE__ */ e(
-            P,
+            oo,
             {
               className: "float-right",
               loading: _,
               onClick: k
             }
           ),
-          !!h && /* @__PURE__ */ e($, { fields: t, importProps: h })
+          !!h && /* @__PURE__ */ e(w, { fields: t, importProps: h })
         ] })
       ] }),
       /* @__PURE__ */ e(
-        w,
+        U,
         {
-          ...J,
+          ...K,
           minusHeight: B,
+          scroll: D,
           data: M,
-          size: H,
+          size: J,
           fields: t,
           extraAction: A,
           idField: C,
@@ -99,21 +101,21 @@ function mo({
           isHiding: O,
           onDelete: j,
           onUpdate: i,
-          onClickClone: D ? L : void 0,
+          onClickClone: E ? Q : void 0,
           paginateProps: W,
           viewable: b,
-          extraView: G
+          extraView: H
         }
       )
     ] }),
     /* @__PURE__ */ e(
-      Z,
+      $,
       {
         ref: m,
         fields: t,
-        wizard: F,
+        wizard: G,
         grid: I,
-        fullWidthModal: E,
+        fullWidthModal: F,
         isCreating: R,
         isUpdating: V,
         onCreate: g,
@@ -125,5 +127,5 @@ function mo({
   ] });
 }
 export {
-  mo as default
+  so as default
 };

package/dist/crud/CrudField.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),j=require("antd"),q=require("react"),K=require("react-highlight-words"),Q=require("../locale/index.cjs.js"),V=require("./FileCrudField.cjs.js"),X=require("./ImageCrudField.cjs.js"),Y=require("../common/check-box/CheckBox.cjs.js"),Z=require("../common/date-picker/DatePicker.cjs.js"),ee=require("../common/date-picker/TimePicker.cjs.js"),_=require("../common/select/SelectComponent.cjs.js"),te=require("../common/text-field/NumberField.cjs.js"),re=require("../common/text-field/TextField.cjs.js"),le=require("../common/tooltip/TooltipComponent.cjs.js"),ae=require("./CrudTextAreaComponent.cjs.js"),U=require("../util/CrudUtil.cjs.js");function ne(N){const{label:n,name:c,type:b,required:s,hidden:O,rules:f=[],updatable:g=!0,readonly:S=!1,fieldClassName:m,customFormFieldRender:w,fieldTooltip:v,fieldHelper:p,formLayout:T,...e}=N,x=j.Form.useFormInstance();q.useEffect(()=>{if(b==="select"){const{items:l=[],onSearch:i,searchOnType:o}=e;!(l!=null&&l.length)&&!o&&(i==null||i(void 0,x,e==null?void 0:e.updatingValue))}},[x,e,b,e==null?void 0:e.updatingValue]);const{t:H}=Q.useTranslationLibNoNS();if(S||O)return t.jsx(t.Fragment,{});if(w)return w(x,N);switch(b){case"text":case"email":case"password":{const{onChange:l,placeholder:i,addonAfter:o,addonBefore:u}=e;return t.jsx(re.default,{layout:T,placeholder:i,disabled:!g,rules:f,required:s,onChange:l?C=>l(C,x):void 0,type:b,name:c,tooltip:v,label:n,className:m,autoComplete:"new-password",addonAfter:o,addonBefore:u,help:p})}case"number":{const{onChange:l,placeholder:i,allowMinus:o,min:u,max:C,addonAfter:h,addonBefore:y}=e;return t.jsx(te,{layout:T,placeholder:i,disabled:!g,moneyField:!!e.formatted,type:b,onChange:l?F=>l(F,x):void 0,rules:f,autoComplete:"false",required:s,tooltip:v,className:m,min:o?null:u,max:C,addonAfter:h,addonBefore:y,name:c,label:n,help:p})}case"date":{const{range:l,disableToday:i,disabledFutureDays:o,disabledPastDays:u,onChange:C,placeholder:h,format:y}=e;return t.jsx(Z,{layout:T,placeholder:h,required:s,disabled:!g,type:b,format:y,tooltip:v,range:l,name:c,label:n,onChange:C?F=>C(F,x):void 0,className:m,disableToday:i,disabledFutureDays:o,disabledPastDays:u,help:p})}case"time":{const{range:l=!1,disableCurrent:i,disabledFuture:o,disabledPast:u,onChange:C,use12Hours:h,format:y,placeholder:F}=e;return t.jsx(ee,{layout:T,placeholder:F,required:s,format:y,disabled:!g,type:b,tooltip:v,range:l,use12Hours:h,name:c,label:n,onChange:C?a=>C(a,x):void 0,className:m,disableCurrent:i,disabledFuture:o,disabledPast:u,help:p})}case"textarea":return t.jsx(ae,{...N});case"image":return t.jsx(X.default,{...e,required:s,name:c,label:n,rules:f,fieldHelper:p,fieldClassName:m,onRemoved:e.onRemoved,onUploading:e.onUploading,provider:e.provider});case"file":return t.jsx(V.default,{...e,required:s,name:c,label:n,rules:f,fieldHelper:p,fieldClassName:m,onRemoved:e.onRemoved,onUploading:e.onUploading,provider:e.provider});case"select":return t.jsx(D,{...e,required:s,name:c,label:n,rules:f,fieldClassName:m,form:x,help:p,updatable:g,readonly:S,fieldTooltip:v,fieldHelper:p});case"enum":{const{enum:l,radio:i=!1,translation:o,onChange:u,onSearch:C,multiple:h,tagRender:y}=e,F=Array.isArray(l)?l:Object.keys(l);return i?t.jsx(j.Form.Item,{...e,layout:T,name:c,required:s,tooltip:v,rules:f,label:n,className:["w-100",m].join(" "),help:p,children:t.jsx(j.Radio.Group,{...e,onChange:u?a=>{var k;return u((k=a==null?void 0:a.target)==null?void 0:k.value,x)}:void 0,children:F.map(a=>t.jsx(j.Radio,{disabled:!g,value:a,children:o?H(o[a]):a},a))})}):t.jsx(_,{...e,layout:T,tagRender:typeof y=="function"?y:y?a=>{const{value:k,label:R}=a,P=y[k];return P?t.jsx(j.Tag,{color:P.color,children:R}):t.jsx(j.Tag,{children:R})}:void 0,onChange:u?a=>u(a,x):void 0,className:["w-100",m].join(" "),name:c,items:F,required:s,tooltip:v,rules:f,label:n,help:p,disabled:!g,onSearch:C?a=>C(a,x):void 0,allowClear:!0,mode:h?"multiple":void 0,itemBuilder:a=>t.jsx(j.Select.Option,{value:a,children:o?H(o[a]):a},a)})}case"checkbox":{const{onChange:l,switch:i}=e;return t.jsx(Y,{layout:T,className:m,rules:f,onChange:l?o=>l(o,x):void 0,label:n,tooltip:v,disabled:!g,name:c,help:p,switch:i})}case"color":return t.jsx(W,{...e,type:"color",required:s,name:c,label:n,rules:f,fieldClassName:m,updatable:g,readonly:S,fieldTooltip:v,fieldHelper:p});default:return t.jsx(t.Fragment,{children:`${b} Not Implemented`})}}function D(N){const{items:n=[],loading:c,searchOnType:b,onSearch:s,multiple:O,onChange:f,highlightSearch:g,required:S,fieldClassName:m,rules:w,fieldTooltip:v,updatable:p,label:T,name:e,tagRender:x,updatingValue:H,onSet:l,placeholder:i,allowClear:o=!0,selectOptionRender:u,formLayout:C}=N,h=N.form,[y,F]=q.useState(""),a=q.useMemo(()=>U.getRealName(e),[e]),k=q.useMemo(()=>U.getRealName(e,"upsertFieldName"),[e]),R=j.Form.useWatch(a,h),[P,L]=q.useState(!0);q.useEffect(()=>{l&&P&&R&&(l==null||l(R,n,h),L(!1))},[P,h,n,a,l,R]),q.useEffect(()=>{R&&L(!0)},[R]);const G=q.useCallback(async r=>{F(r),b&&(s==null||s(r,h,H))},[h,s,b,H]),$=q.useCallback(r=>u?u(r):r.value,[u]);return t.jsx(_,{...N,layout:C,maxTagCount:"responsive",maxTagPlaceholder:r=>t.jsxs(le,{title:t.jsx(t.Fragment,{children:r.map(d=>t.jsxs(t.Fragment,{children:[d.label," ",t.jsx("br",{})]}))}),children:["+",r==null?void 0:r.length]}),placeholder:i,onSelect:r=>{l==null||l(r==null?void 0:r.key,n,h)},onChange:f?r=>{F(""),f(r,h)}:void 0,mode:O?"multiple":void 0,className:["w-100",m].join(" "),name:k,items:n,required:S,tooltip:v,tagRender:x,rules:w,disabled:!p,label:T,allowClear:o,onSearch:G,loading:c,filterOption:g?(r,d)=>{var A,B,E;try{const I=r.toLowerCase().split(/\s+/),z=((typeof(d==null?void 0:d.children)=="string"?d==null?void 0:d.children:(B=(A=d==null?void 0:d.children)==null?void 0:A.props)==null?void 0:B.textToHighlight)??"").toLowerCase(),J=(((E=d==null?void 0:d.value)==null?void 0:E.toString())??"").toLowerCase();return I.every(M=>z.indexOf(M)>=0||J.indexOf(M)>=0)}catch{return!0}}:void 0,itemBuilder:g?r=>{const d=r.value?String(r.value):void 0;return t.jsx(j.Select.Option,{value:r.key,title:d,disabled:r.disabled,children:t.jsx(K,{highlightClassName:"highlight-text",searchWords:(y??"").split(" "),autoEscape:!0,textToHighlight:d??""})},r.key)}:r=>t.jsx(j.Select.Option,{value:r.key,title:r.value,disabled:r.disabled,children:$(r)},r.key)})}function W(N){const{formLayout:n,required:c,fieldClassName:b,rules:s,fieldTooltip:O,updatable:f,label:g,name:S,fieldHelper:m}=N;return t.jsx(j.Form.Item,{layout:n,label:g,name:S,required:c,rules:s,tooltip:O,help:m,getValueFromEvent:w=>typeof w=="object"?w.toHexString():w,children:t.jsx(j.ColorPicker,{disabledAlpha:!0,format:"hex",defaultFormat:"hex",showText:!0,trigger:"click",className:b,disabled:!f,...N.innerProps})})}exports.ColorCrudFieldComponent=W;exports.SelectCrudFieldComponent=D;exports.default=ne;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),v=require("antd"),q=require("react"),K=require("react-highlight-words"),Q=require("../locale/index.cjs.js"),V=require("./FileCrudField.cjs.js"),X=require("./ImageCrudField.cjs.js"),Y=require("../common/check-box/CheckBox.cjs.js"),Z=require("../common/date-picker/DatePicker.cjs.js"),ee=require("../common/date-picker/TimePicker.cjs.js"),_=require("../common/select/SelectComponent.cjs.js"),re=require("../common/text-field/NumberField.cjs.js"),te=require("../common/text-field/TextField.cjs.js"),le=require("../common/tooltip/TooltipComponent.cjs.js"),ae=require("./CrudTextAreaComponent.cjs.js"),U=require("../util/CrudUtil.cjs.js");function ne(N){const{label:n,name:c,type:b,required:o,hidden:O,rules:f=[],updatable:g=!0,readonly:S=!1,fieldClassName:m,customFormFieldRender:w,fieldTooltip:F,fieldHelper:p,formLayoutProps:T,...e}=N,x=v.Form.useFormInstance();q.useEffect(()=>{if(b==="select"){const{items:l=[],onSearch:i,searchOnType:s}=e;!(l!=null&&l.length)&&!s&&(i==null||i(void 0,x,e==null?void 0:e.updatingValue))}},[x,e,b,e==null?void 0:e.updatingValue]);const{t:P}=Q.useTranslationLibNoNS();if(S||O)return r.jsx(r.Fragment,{});if(w)return w(x,N);switch(b){case"text":case"email":case"password":{const{onChange:l,placeholder:i,addonAfter:s,addonBefore:u}=e;return r.jsx(te.default,{...T,placeholder:i,disabled:!g,rules:f,required:o,onChange:l?C=>l(C,x):void 0,type:b,name:c,tooltip:F,label:n,className:m,autoComplete:"new-password",addonAfter:s,addonBefore:u,help:p})}case"number":{const{onChange:l,placeholder:i,allowMinus:s,min:u,max:C,addonAfter:h,addonBefore:j}=e;return r.jsx(re,{...T,placeholder:i,disabled:!g,moneyField:!!e.formatted,type:b,onChange:l?y=>l(y,x):void 0,rules:f,autoComplete:"false",required:o,tooltip:F,className:m,min:s?null:u,max:C,addonAfter:h,addonBefore:j,name:c,label:n,help:p})}case"date":{const{range:l,disableToday:i,disabledFutureDays:s,disabledPastDays:u,onChange:C,placeholder:h,format:j}=e;return r.jsx(Z,{...T,placeholder:h,required:o,disabled:!g,type:b,format:j,tooltip:F,range:l,name:c,label:n,onChange:C?y=>C(y,x):void 0,className:m,disableToday:i,disabledFutureDays:s,disabledPastDays:u,help:p})}case"time":{const{range:l=!1,disableCurrent:i,disabledFuture:s,disabledPast:u,onChange:C,use12Hours:h,format:j,placeholder:y}=e;return r.jsx(ee,{...T,placeholder:y,required:o,format:j,disabled:!g,type:b,tooltip:F,range:l,use12Hours:h,name:c,label:n,onChange:C?a=>C(a,x):void 0,className:m,disableCurrent:i,disabledFuture:s,disabledPast:u,help:p})}case"textarea":return r.jsx(ae,{...N});case"image":return r.jsx(X.default,{...e,required:o,name:c,label:n,rules:f,fieldHelper:p,fieldClassName:m,onRemoved:e.onRemoved,onUploading:e.onUploading,provider:e.provider});case"file":return r.jsx(V.default,{...e,required:o,name:c,label:n,rules:f,fieldHelper:p,fieldClassName:m,onRemoved:e.onRemoved,onUploading:e.onUploading,provider:e.provider});case"select":return r.jsx(D,{...e,required:o,name:c,label:n,rules:f,fieldClassName:m,form:x,help:p,updatable:g,readonly:S,fieldTooltip:F,fieldHelper:p});case"enum":{const{enum:l,radio:i=!1,translation:s,onChange:u,onSearch:C,multiple:h,tagRender:j}=e,y=Array.isArray(l)?l:Object.keys(l);return i?r.jsx(v.Form.Item,{...e,...T,name:c,required:o,tooltip:F,rules:f,label:n,className:["w-100",m].join(" "),help:p,children:r.jsx(v.Radio.Group,{...e,onChange:u?a=>{var k;return u((k=a==null?void 0:a.target)==null?void 0:k.value,x)}:void 0,children:y.map(a=>r.jsx(v.Radio,{disabled:!g,value:a,children:s?P(s[a]):a},a))})}):r.jsx(_,{...e,...T,tagRender:typeof j=="function"?j:j?a=>{const{value:k,label:R}=a,H=j[k];return H?r.jsx(v.Tag,{color:H.color,children:R}):r.jsx(v.Tag,{children:R})}:void 0,onChange:u?a=>u(a,x):void 0,className:["w-100",m].join(" "),name:c,items:y,required:o,tooltip:F,rules:f,label:n,help:p,disabled:!g,onSearch:C?a=>C(a,x):void 0,allowClear:!0,mode:h?"multiple":void 0,itemBuilder:a=>r.jsx(v.Select.Option,{value:a,children:s?P(s[a]):a},a)})}case"checkbox":{const{onChange:l,switch:i}=e;return r.jsx(Y,{...T,className:m,rules:f,onChange:l?s=>l(s,x):void 0,label:n,tooltip:F,disabled:!g,name:c,help:p,switch:i})}case"color":return r.jsx(W,{...e,type:"color",required:o,name:c,label:n,rules:f,fieldClassName:m,updatable:g,readonly:S,fieldTooltip:F,fieldHelper:p});default:return r.jsx(r.Fragment,{children:`${b} Not Implemented`})}}function D(N){const{items:n=[],loading:c,searchOnType:b,onSearch:o,multiple:O,onChange:f,highlightSearch:g,required:S,fieldClassName:m,rules:w,fieldTooltip:F,updatable:p,label:T,name:e,tagRender:x,updatingValue:P,onSet:l,placeholder:i,allowClear:s=!0,selectOptionRender:u,formLayoutProps:C}=N,h=N.form,[j,y]=q.useState(""),a=q.useMemo(()=>U.getRealName(e),[e]),k=q.useMemo(()=>U.getRealName(e,"upsertFieldName"),[e]),R=v.Form.useWatch(a,h),[H,L]=q.useState(!0);q.useEffect(()=>{l&&H&&R&&(l==null||l(R,n,h),L(!1))},[H,h,n,a,l,R]),q.useEffect(()=>{R&&L(!0)},[R]);const G=q.useCallback(async t=>{y(t),b&&(o==null||o(t,h,P))},[h,o,b,P]),$=q.useCallback(t=>u?u(t):t.value,[u]);return r.jsx(_,{...N,...C,maxTagCount:"responsive",maxTagPlaceholder:t=>r.jsxs(le,{title:r.jsx(r.Fragment,{children:t.map(d=>r.jsxs(r.Fragment,{children:[d.label," ",r.jsx("br",{})]}))}),children:["+",t==null?void 0:t.length]}),placeholder:i,onSelect:t=>{l==null||l(t==null?void 0:t.key,n,h)},onChange:f?t=>{y(""),f(t,h)}:void 0,mode:O?"multiple":void 0,className:["w-100",m].join(" "),name:k,items:n,required:S,tooltip:F,tagRender:x,rules:w,disabled:!p,label:T,allowClear:s,onSearch:G,loading:c,filterOption:g?(t,d)=>{var A,B,E;try{const I=t.toLowerCase().split(/\s+/),z=((typeof(d==null?void 0:d.children)=="string"?d==null?void 0:d.children:(B=(A=d==null?void 0:d.children)==null?void 0:A.props)==null?void 0:B.textToHighlight)??"").toLowerCase(),J=(((E=d==null?void 0:d.value)==null?void 0:E.toString())??"").toLowerCase();return I.every(M=>z.indexOf(M)>=0||J.indexOf(M)>=0)}catch{return!0}}:void 0,itemBuilder:g?t=>{const d=t.value?String(t.value):void 0;return r.jsx(v.Select.Option,{value:t.key,title:d,disabled:t.disabled,children:r.jsx(K,{highlightClassName:"highlight-text",searchWords:(j??"").split(" "),autoEscape:!0,textToHighlight:d??""})},t.key)}:t=>r.jsx(v.Select.Option,{value:t.key,title:t.value,disabled:t.disabled,children:$(t)},t.key)})}function W(N){const{formLayoutProps:n,required:c,fieldClassName:b,rules:o,fieldTooltip:O,updatable:f,label:g,name:S,fieldHelper:m}=N;return r.jsx(v.Form.Item,{...n,label:g,name:S,required:c,rules:o,tooltip:O,help:m,getValueFromEvent:w=>typeof w=="object"?w.toHexString():w,children:r.jsx(v.ColorPicker,{disabledAlpha:!0,format:"hex",defaultFormat:"hex",showText:!0,trigger:"click",className:b,disabled:!f,...N.innerProps})})}exports.ColorCrudFieldComponent=W;exports.SelectCrudFieldComponent=D;exports.default=ne;

package/dist/crud/CrudField.es.js

@@ -1,220 +1,220 @@
-import { jsx as a, Fragment as P, jsxs as W } from "react/jsx-runtime";
+import { jsx as o, Fragment as L, jsxs as W } from "react/jsx-runtime";
 import { Form as j, Radio as _, Select as A, Tag as G, ColorPicker as ee } from "antd";
 import { useEffect as B, useState as $, useMemo as z, useCallback as J } from "react";
-import te from "react-highlight-words";
-import { useTranslationLibNoNS as re } from "../locale/index.es.js";
-import ae from "./FileCrudField.es.js";
-import le from "./ImageCrudField.es.js";
-import oe from "../common/check-box/CheckBox.es.js";
+import re from "react-highlight-words";
+import { useTranslationLibNoNS as te } from "../locale/index.es.js";
+import oe from "./FileCrudField.es.js";
+import ae from "./ImageCrudField.es.js";
+import le from "../common/check-box/CheckBox.es.js";
 import ne from "../common/date-picker/DatePicker.es.js";
 import ie from "../common/date-picker/TimePicker.es.js";
 import Q from "../common/select/SelectComponent.es.js";
 import de from "../common/text-field/NumberField.es.js";
 import se from "../common/text-field/TextField.es.js";
-import ue from "../common/tooltip/TooltipComponent.es.js";
-import ce from "./CrudTextAreaComponent.es.js";
+import ce from "../common/tooltip/TooltipComponent.es.js";
+import me from "./CrudTextAreaComponent.es.js";
 import K from "../util/CrudUtil.es.js";
-function Se(F) {
+function Pe(F) {
   const {
-    label: o,
-    name: c,
-    type: y,
+    label: l,
+    name: m,
+    type: v,
     required: i,
     hidden: O,
     rules: h = [],
     updatable: p = !0,
     readonly: k = !1,
-    fieldClassName: m,
+    fieldClassName: u,
     customFormFieldRender: w,
     fieldTooltip: x,
     fieldHelper: g,
-    formLayout: T,
+    formLayoutProps: T,
     ...e
   } = F, C = j.useFormInstance();
   B(() => {
-    if (y === "select") {
+    if (v === "select") {
       const {
-        items: r = [],
+        items: t = [],
         onSearch: d,
         searchOnType: n
       } = e;
-      !(r != null && r.length) && !n && (d == null || d(void 0, C, e == null ? void 0 : e.updatingValue));
+      !(t != null && t.length) && !n && (d == null || d(void 0, C, e == null ? void 0 : e.updatingValue));
     }
-  }, [C, e, y, e == null ? void 0 : e.updatingValue]);
-  const { t: S } = re();
-  if (k || O) return /* @__PURE__ */ a(P, {});
+  }, [C, e, v, e == null ? void 0 : e.updatingValue]);
+  const { t: P } = te();
+  if (k || O) return /* @__PURE__ */ o(L, {});
   if (w)
     return w(C, F);
-  switch (y) {
+  switch (v) {
     case "text":
     case "email":
     case "password": {
-      const { onChange: r, placeholder: d, addonAfter: n, addonBefore: u } = e;
-      return /* @__PURE__ */ a(
+      const { onChange: t, placeholder: d, addonAfter: n, addonBefore: c } = e;
+      return /* @__PURE__ */ o(
         se,
         {
-          layout: T,
+          ...T,
           placeholder: d,
           disabled: !p,
           rules: h,
           required: i,
-          onChange: r ? (b) => r(b, C) : void 0,
-          type: y,
-          name: c,
+          onChange: t ? (b) => t(b, C) : void 0,
+          type: v,
+          name: m,
           tooltip: x,
-          label: o,
-          className: m,
+          label: l,
+          className: u,
           autoComplete: "new-password",
           addonAfter: n,
-          addonBefore: u,
+          addonBefore: c,
           help: g
         }
       );
     }
     case "number": {
       const {
-        onChange: r,
+        onChange: t,
         placeholder: d,
         allowMinus: n,
-        min: u,
+        min: c,
         max: b,
         addonAfter: f,
-        addonBefore: v
+        addonBefore: y
       } = e;
-      return /* @__PURE__ */ a(
+      return /* @__PURE__ */ o(
         de,
         {
-          layout: T,
+          ...T,
           placeholder: d,
           disabled: !p,
           moneyField: !!e.formatted,
-          type: y,
-          onChange: r ? (N) => r(N, C) : void 0,
+          type: v,
+          onChange: t ? (N) => t(N, C) : void 0,
           rules: h,
           autoComplete: "false",
           required: i,
           tooltip: x,
-          className: m,
-          min: n ? null : u,
+          className: u,
+          min: n ? null : c,
           max: b,
           addonAfter: f,
-          addonBefore: v,
-          name: c,
-          label: o,
+          addonBefore: y,
+          name: m,
+          label: l,
           help: g
         }
       );
     }
     case "date": {
       const {
-        range: r,
+        range: t,
         disableToday: d,
         disabledFutureDays: n,
-        disabledPastDays: u,
+        disabledPastDays: c,
         onChange: b,
         placeholder: f,
-        format: v
+        format: y
       } = e;
-      return /* @__PURE__ */ a(
+      return /* @__PURE__ */ o(
         ne,
         {
-          layout: T,
+          ...T,
           placeholder: f,
           required: i,
           disabled: !p,
-          type: y,
-          format: v,
+          type: v,
+          format: y,
           tooltip: x,
-          range: r,
-          name: c,
-          label: o,
+          range: t,
+          name: m,
+          label: l,
           onChange: b ? (N) => b(N, C) : void 0,
-          className: m,
+          className: u,
           disableToday: d,
           disabledFutureDays: n,
-          disabledPastDays: u,
+          disabledPastDays: c,
           help: g
         }
       );
     }
     case "time": {
       const {
-        range: r = !1,
+        range: t = !1,
         disableCurrent: d,
         disabledFuture: n,
-        disabledPast: u,
+        disabledPast: c,
         onChange: b,
         use12Hours: f,
-        format: v,
+        format: y,
         placeholder: N
       } = e;
-      return /* @__PURE__ */ a(
+      return /* @__PURE__ */ o(
         ie,
         {
-          layout: T,
+          ...T,
           placeholder: N,
           required: i,
-          format: v,
+          format: y,
           disabled: !p,
-          type: y,
+          type: v,
           tooltip: x,
-          range: r,
+          range: t,
           use12Hours: f,
-          name: c,
-          label: o,
-          onChange: b ? (l) => b(l, C) : void 0,
-          className: m,
+          name: m,
+          label: l,
+          onChange: b ? (a) => b(a, C) : void 0,
+          className: u,
           disableCurrent: d,
           disabledFuture: n,
-          disabledPast: u,
+          disabledPast: c,
           help: g
         }
       );
     }
     case "textarea":
-      return /* @__PURE__ */ a(ce, { ...F });
+      return /* @__PURE__ */ o(me, { ...F });
     case "image":
-      return /* @__PURE__ */ a(
-        le,
+      return /* @__PURE__ */ o(
+        ae,
         {
           ...e,
           required: i,
-          name: c,
-          label: o,
+          name: m,
+          label: l,
           rules: h,
           fieldHelper: g,
-          fieldClassName: m,
+          fieldClassName: u,
           onRemoved: e.onRemoved,
           onUploading: e.onUploading,
           provider: e.provider
         }
       );
     case "file":
-      return /* @__PURE__ */ a(
-        ae,
+      return /* @__PURE__ */ o(
+        oe,
         {
           ...e,
           required: i,
-          name: c,
-          label: o,
+          name: m,
+          label: l,
           rules: h,
           fieldHelper: g,
-          fieldClassName: m,
+          fieldClassName: u,
           onRemoved: e.onRemoved,
           onUploading: e.onUploading,
           provider: e.provider
         }
       );
     case "select":
-      return /* @__PURE__ */ a(
-        me,
+      return /* @__PURE__ */ o(
+        ue,
         {
           ...e,
           required: i,
-          name: c,
-          label: o,
+          name: m,
+          label: l,
           rules: h,
-          fieldClassName: m,
+          fieldClassName: u,
           form: C,
           help: g,
           updatable: p,
@@ -225,93 +225,93 @@ function Se(F) {
       );
     case "enum": {
       const {
-        enum: r,
+        enum: t,
         radio: d = !1,
         translation: n,
-        onChange: u,
+        onChange: c,
         onSearch: b,
         multiple: f,
-        tagRender: v
-      } = e, N = Array.isArray(r) ? r : Object.keys(r);
-      return d ? /* @__PURE__ */ a(
+        tagRender: y
+      } = e, N = Array.isArray(t) ? t : Object.keys(t);
+      return d ? /* @__PURE__ */ o(
         j.Item,
         {
           ...e,
-          layout: T,
-          name: c,
+          ...T,
+          name: m,
           required: i,
           tooltip: x,
           rules: h,
-          label: o,
-          className: ["w-100", m].join(" "),
+          label: l,
+          className: ["w-100", u].join(" "),
           help: g,
-          children: /* @__PURE__ */ a(
+          children: /* @__PURE__ */ o(
             _.Group,
             {
               ...e,
-              onChange: u ? (l) => {
+              onChange: c ? (a) => {
                 var H;
-                return u((H = l == null ? void 0 : l.target) == null ? void 0 : H.value, C);
+                return c((H = a == null ? void 0 : a.target) == null ? void 0 : H.value, C);
               } : void 0,
-              children: N.map((l) => /* @__PURE__ */ a(_, { disabled: !p, value: l, children: n ? S(n[l]) : l }, l))
+              children: N.map((a) => /* @__PURE__ */ o(_, { disabled: !p, value: a, children: n ? P(n[a]) : a }, a))
             }
           )
         }
-      ) : /* @__PURE__ */ a(
+      ) : /* @__PURE__ */ o(
         Q,
         {
           ...e,
-          layout: T,
-          tagRender: typeof v == "function" ? v : v ? (l) => {
-            const { value: H, label: R } = l, L = v[H];
-            return L ? /* @__PURE__ */ a(G, { color: L.color, children: R }) : /* @__PURE__ */ a(G, { children: R });
+          ...T,
+          tagRender: typeof y == "function" ? y : y ? (a) => {
+            const { value: H, label: R } = a, S = y[H];
+            return S ? /* @__PURE__ */ o(G, { color: S.color, children: R }) : /* @__PURE__ */ o(G, { children: R });
           } : void 0,
-          onChange: u ? (l) => u(l, C) : void 0,
-          className: ["w-100", m].join(" "),
-          name: c,
+          onChange: c ? (a) => c(a, C) : void 0,
+          className: ["w-100", u].join(" "),
+          name: m,
           items: N,
           required: i,
           tooltip: x,
           rules: h,
-          label: o,
+          label: l,
           help: g,
           disabled: !p,
-          onSearch: b ? (l) => b(l, C) : void 0,
+          onSearch: b ? (a) => b(a, C) : void 0,
           allowClear: !0,
           mode: f ? "multiple" : void 0,
-          itemBuilder: (l) => /* @__PURE__ */ a(A.Option, { value: l, children: n ? S(n[l]) : l }, l)
+          itemBuilder: (a) => /* @__PURE__ */ o(A.Option, { value: a, children: n ? P(n[a]) : a }, a)
         }
       );
     }
     case "checkbox": {
-      const { onChange: r, switch: d } = e;
-      return /* @__PURE__ */ a(
-        oe,
+      const { onChange: t, switch: d } = e;
+      return /* @__PURE__ */ o(
+        le,
         {
-          layout: T,
-          className: m,
+          ...T,
+          className: u,
           rules: h,
-          onChange: r ? (n) => r(n, C) : void 0,
-          label: o,
+          onChange: t ? (n) => t(n, C) : void 0,
+          label: l,
           tooltip: x,
           disabled: !p,
-          name: c,
+          name: m,
           help: g,
           switch: d
         }
       );
     }
     case "color":
-      return /* @__PURE__ */ a(
+      return /* @__PURE__ */ o(
         fe,
         {
           ...e,
           type: "color",
           required: i,
-          name: c,
-          label: o,
+          name: m,
+          label: l,
           rules: h,
-          fieldClassName: m,
+          fieldClassName: u,
           updatable: p,
           readonly: k,
           fieldTooltip: x,
@@ -319,81 +319,81 @@ function Se(F) {
         }
       );
     default:
-      return /* @__PURE__ */ a(P, { children: `${y} Not Implemented` });
+      return /* @__PURE__ */ o(L, { children: `${v} Not Implemented` });
   }
 }
-function me(F) {
+function ue(F) {
   const {
-    items: o = [],
-    loading: c,
-    searchOnType: y,
+    items: l = [],
+    loading: m,
+    searchOnType: v,
     onSearch: i,
     multiple: O,
     onChange: h,
     highlightSearch: p,
     required: k,
-    fieldClassName: m,
+    fieldClassName: u,
     rules: w,
     fieldTooltip: x,
     updatable: g,
     label: T,
     name: e,
     tagRender: C,
-    updatingValue: S,
-    onSet: r,
+    updatingValue: P,
+    onSet: t,
     placeholder: d,
     allowClear: n = !0,
-    selectOptionRender: u,
-    formLayout: b
-  } = F, f = F.form, [v, N] = $(""), l = z(() => K.getRealName(e), [e]), H = z(
+    selectOptionRender: c,
+    formLayoutProps: b
+  } = F, f = F.form, [y, N] = $(""), a = z(() => K.getRealName(e), [e]), H = z(
     () => K.getRealName(e, "upsertFieldName"),
     [e]
-  ), R = j.useWatch(l, f), [L, I] = $(!0);
+  ), R = j.useWatch(a, f), [S, I] = $(!0);
   B(() => {
-    r && L && R && (r == null || r(R, o, f), I(!1));
-  }, [L, f, o, l, r, R]), B(() => {
+    t && S && R && (t == null || t(R, l, f), I(!1));
+  }, [S, f, l, a, t, R]), B(() => {
     R && I(!0);
   }, [R]);
   const V = J(
-    async (t) => {
-      N(t), y && (i == null || i(t, f, S));
+    async (r) => {
+      N(r), v && (i == null || i(r, f, P));
     },
-    [f, i, y, S]
+    [f, i, v, P]
   ), X = J(
-    (t) => u ? u(t) : t.value,
-    [u]
+    (r) => c ? c(r) : r.value,
+    [c]
   );
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ o(
     Q,
     {
       ...F,
-      layout: b,
+      ...b,
       maxTagCount: "responsive",
-      maxTagPlaceholder: (t) => /* @__PURE__ */ W(
-        ue,
+      maxTagPlaceholder: (r) => /* @__PURE__ */ W(
+        ce,
         {
-          title: /* @__PURE__ */ a(P, { children: t.map((s) => /* @__PURE__ */ W(P, { children: [
+          title: /* @__PURE__ */ o(L, { children: r.map((s) => /* @__PURE__ */ W(L, { children: [
             s.label,
             " ",
-            /* @__PURE__ */ a("br", {})
+            /* @__PURE__ */ o("br", {})
           ] })) }),
           children: [
             "+",
-            t == null ? void 0 : t.length
+            r == null ? void 0 : r.length
           ]
         }
       ),
       placeholder: d,
-      onSelect: (t) => {
-        r == null || r(t == null ? void 0 : t.key, o, f);
+      onSelect: (r) => {
+        t == null || t(r == null ? void 0 : r.key, l, f);
       },
-      onChange: h ? (t) => {
-        N(""), h(t, f);
+      onChange: h ? (r) => {
+        N(""), h(r, f);
       } : void 0,
       mode: O ? "multiple" : void 0,
-      className: ["w-100", m].join(" "),
+      className: ["w-100", u].join(" "),
       name: H,
-      items: o,
+      items: l,
       required: k,
       tooltip: x,
       tagRender: C,
@@ -402,11 +402,11 @@ function me(F) {
       label: T,
       allowClear: n,
       onSearch: V,
-      loading: c,
-      filterOption: p ? (t, s) => {
+      loading: m,
+      filterOption: p ? (r, s) => {
         var U, q, D;
         try {
-          const E = t.toLowerCase().split(/\s+/), Y = ((typeof (s == null ? void 0 : s.children) == "string" ? s == null ? void 0 : s.children : (q = (U = s == null ? void 0 : s.children) == null ? void 0 : U.props) == null ? void 0 : q.textToHighlight) ?? "").toLowerCase(), Z = (((D = s == null ? void 0 : s.value) == null ? void 0 : D.toString()) ?? "").toLowerCase();
+          const E = r.toLowerCase().split(/\s+/), Y = ((typeof (s == null ? void 0 : s.children) == "string" ? s == null ? void 0 : s.children : (q = (U = s == null ? void 0 : s.children) == null ? void 0 : U.props) == null ? void 0 : q.textToHighlight) ?? "").toLowerCase(), Z = (((D = s == null ? void 0 : s.value) == null ? void 0 : D.toString()) ?? "").toLowerCase();
           return E.every(
             (M) => Y.indexOf(M) >= 0 || Z.indexOf(M) >= 0
           );
@@ -414,63 +414,63 @@ function me(F) {
           return !0;
         }
       } : void 0,
-      itemBuilder: p ? (t) => {
-        const s = t.value ? String(t.value) : void 0;
-        return /* @__PURE__ */ a(
+      itemBuilder: p ? (r) => {
+        const s = r.value ? String(r.value) : void 0;
+        return /* @__PURE__ */ o(
           A.Option,
           {
-            value: t.key,
+            value: r.key,
             title: s,
-            disabled: t.disabled,
-            children: /* @__PURE__ */ a(
-              te,
+            disabled: r.disabled,
+            children: /* @__PURE__ */ o(
+              re,
               {
                 highlightClassName: "highlight-text",
-                searchWords: (v ?? "").split(" "),
+                searchWords: (y ?? "").split(" "),
                 autoEscape: !0,
                 textToHighlight: s ?? ""
               }
             )
           },
-          t.key
+          r.key
         );
-      } : (t) => /* @__PURE__ */ a(
+      } : (r) => /* @__PURE__ */ o(
         A.Option,
         {
-          value: t.key,
-          title: t.value,
-          disabled: t.disabled,
-          children: X(t)
+          value: r.key,
+          title: r.value,
+          disabled: r.disabled,
+          children: X(r)
         },
-        t.key
+        r.key
       )
     }
   );
 }
 function fe(F) {
   const {
-    formLayout: o,
-    required: c,
-    fieldClassName: y,
+    formLayoutProps: l,
+    required: m,
+    fieldClassName: v,
     rules: i,
     fieldTooltip: O,
     updatable: h,
     label: p,
     name: k,
-    fieldHelper: m
+    fieldHelper: u
   } = F;
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ o(
     j.Item,
     {
-      layout: o,
+      ...l,
       label: p,
       name: k,
-      required: c,
+      required: m,
       rules: i,
       tooltip: O,
-      help: m,
+      help: u,
       getValueFromEvent: (w) => typeof w == "object" ? w.toHexString() : w,
-      children: /* @__PURE__ */ a(
+      children: /* @__PURE__ */ o(
         ee,
         {
           disabledAlpha: !0,
@@ -478,7 +478,7 @@ function fe(F) {
           defaultFormat: "hex",
           showText: !0,
           trigger: "click",
-          className: y,
+          className: v,
           disabled: !h,
           ...F.innerProps
         }
@@ -488,6 +488,6 @@ function fe(F) {
 }
 export {
   fe as ColorCrudFieldComponent,
-  me as SelectCrudFieldComponent,
-  Se as default
+  ue as SelectCrudFieldComponent,
+  Pe as default
 };

package/dist/crud/CrudTextAreaComponent.cjs.js

@@ -1 +1 @@
-"use strict";const u=require("react/jsx-runtime"),C=require("../common/text-field/TextArea.cjs.js"),T=require("../common/rich/index.cjs.js"),j=require("antd"),p=require("../util/CrudUtil.cjs.js"),F=({onChange:r,label:s,required:i,rules:o,name:n,updatable:l=!0,formLayout:c,...e})=>{const a=j.Form.useFormInstance(),m=p.getRealName(n,"upsertFieldName");if(e.rich)return u.jsx(T.RichTextEditor,{name:m,label:s,required:i,rules:o,disabled:!l,help:e.fieldHelper,formLayout:c});{const{placeholder:x,rows:f,cols:h,fieldClassName:N,fieldTooltip:q}=e;return u.jsx(C.default,{layout:c,rules:o,placeholder:x,onChange:r?t=>{var d;return r((d=t==null?void 0:t.target)==null?void 0:d.value,a)}:void 0,tooltip:q,required:i,disabled:!l,name:n,label:s,className:N,rows:f,cols:h,help:e.fieldHelper})}};module.exports=F;
+"use strict";const u=require("react/jsx-runtime"),C=require("../common/text-field/TextArea.cjs.js"),T=require("../common/rich/index.cjs.js"),j=require("antd"),F=require("../util/CrudUtil.cjs.js"),R=({onChange:r,label:i,required:s,rules:n,name:o,updatable:c=!0,formLayoutProps:l,...e})=>{const a=j.Form.useFormInstance(),m=F.getRealName(o,"upsertFieldName");if(e.rich)return u.jsx(T.RichTextEditor,{name:m,label:i,required:s,rules:n,disabled:!c,help:e.fieldHelper,formLayoutProps:l});{const{placeholder:x,rows:f,cols:h,fieldClassName:N,fieldTooltip:q}=e;return u.jsx(C.default,{...l,rules:n,placeholder:x,onChange:r?t=>{var d;return r((d=t==null?void 0:t.target)==null?void 0:d.value,a)}:void 0,tooltip:q,required:s,disabled:!c,name:o,label:i,className:N,rows:f,cols:h,help:e.fieldHelper})}};module.exports=R;

package/dist/crud/CrudTextAreaComponent.d.ts

@@ -19,5 +19,5 @@ interface RichTextAreaProps<T> extends InitialTextAreaProps<T> {
     rich?: true;
 }
 export type TextAreaBasedFieldProps<T> = TextAreaProps<T> & RichTextAreaProps<T> & Copyable<false>;
-declare const CrudTextAreaComponent: <T>({ onChange, label, required, rules, name, updatable, formLayout, ...props }: TextAreaBasedFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
+declare const CrudTextAreaComponent: <T>({ onChange, label, required, rules, name, updatable, formLayoutProps, ...props }: TextAreaBasedFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default CrudTextAreaComponent;

package/dist/crud/CrudTextAreaComponent.es.js

@@ -1,4 +1,4 @@
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import N from "../common/text-field/TextArea.es.js";
 import { RichTextEditor as T } from "../common/rich/index.es.js";
 import { Form as F } from "antd";
@@ -9,44 +9,44 @@ const E = ({
   required: i,
   rules: m,
   name: l,
-  updatable: s = !0,
-  formLayout: d,
+  updatable: d = !0,
+  formLayoutProps: s,
   ...e
 }) => {
   const f = F.useFormInstance(), c = g.getRealName(l, "upsertFieldName");
   if (e.rich)
-    return /* @__PURE__ */ n(
+    return /* @__PURE__ */ a(
       T,
       {
         name: c,
         label: r,
         required: i,
         rules: m,
-        disabled: !s,
+        disabled: !d,
         help: e.fieldHelper,
-        formLayout: d
+        formLayoutProps: s
       }
     );
   {
-    const { placeholder: p, rows: u, cols: h, fieldClassName: x, fieldTooltip: C } = e;
-    return /* @__PURE__ */ n(
+    const { placeholder: p, rows: h, cols: u, fieldClassName: x, fieldTooltip: C } = e;
+    return /* @__PURE__ */ a(
       N,
       {
-        layout: d,
+        ...s,
         rules: m,
         placeholder: p,
         onChange: o ? (t) => {
-          var a;
-          return o((a = t == null ? void 0 : t.target) == null ? void 0 : a.value, f);
+          var n;
+          return o((n = t == null ? void 0 : t.target) == null ? void 0 : n.value, f);
         } : void 0,
         tooltip: C,
         required: i,
-        disabled: !s,
+        disabled: !d,
         name: l,
         label: r,
         className: x,
-        rows: u,
-        cols: h,
+        rows: h,
+        cols: u,
         help: e.fieldHelper
       }
     );

package/dist/crud/FileCrudField.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),d=require("@ant-design/icons"),F=require("antd"),D=require("mime"),c=require("react"),G=require("../locale/index.cjs.js"),J=require("../util/ValidationUtil.cjs.js"),p=require("../common/button/Button.cjs.js"),K=require("../common/layout/VerticalSpace.cjs.js"),Q=require("../util/CrudUtil.cjs.js");function X({name:n,label:e,required:l,provider:s,onUploading:a,onRemoved:h,fieldClassName:j,accept:P,rules:U,maxCount:O=1,block:k,fieldHelper:E,formLayout:_,...$}){const f=F.Form.useFormInstance(),H=Q.getRealName(n,"upsertFieldName"),x=F.Form.useWatch(H,f),[b,q]=c.useState(!1),[V,R]=c.useState(!1),A=c.useCallback(async r=>{var o,i;try{const{file:u}=r,g=u.name;q(!0),R(!0),a==null||a(!0);const C=g??"",S=C.split("."),W=S[S.length-1],B=s.generateFileName(C),z=`${await s.getInitialPath()}/${B}.${W}`,M=await s.upload({...u,originFileObj:u},z);a==null||a(!1),f.setFieldValue(n,M),(o=r.onSuccess)==null||o.call(r,M)}catch(u){(i=r.onError)==null||i.call(r,u)}finally{q(!1)}},[f,n,a,s]),[w,I]=c.useState([]);c.useEffect(()=>{!V&&x&&Promise.all((Array.isArray(x)?x:[x]).map(async r=>{const o=D.getType(r),i=r.split("/").pop(),u=await s.getRealUrl(r);return{uid:r,url:u,type:o,name:i}})).then(r=>I(()=>r.map(({url:i,type:u,uid:g,name:C})=>({uid:g,url:i,type:u,response:g,thumbUrl:i,name:C}))))},[x,V,b,s]);const L=c.useCallback(async r=>{const o=r.response,i=o||f.getFieldValue(n);await s.delete(i),h==null||h(),r&&f.setFieldsValue({[n]:null})},[f,n,h,s]);return t.jsxs(F.Form.Item,{label:e,required:l,name:n,layout:_,className:j,rules:[...l?J.required(e):[],...U??[]],help:E,children:[t.jsx("input",{hidden:!0}),t.jsx(F.Upload,{...$,fileList:w,className:((w==null?void 0:w.length)??0)>=O?"hide-upload":"",maxCount:O,customRequest:A,onRemove:L,listType:"picture",onChange:({fileList:r})=>{I(r)},style:k?{width:"100%"}:void 0,children:t.jsx(p,{loading:b,children:"Upload File"})})]})}const Y=({provider:n,value:e})=>{const[l,s]=c.useState();return c.useEffect(()=>{e&&n.getRealUrl(e).then(a=>{s({mimeType:D.getType(e),url:a,fileName:e.split("/").pop()??e})})},[n,e]),l?t.jsx(N,{fileName:l.fileName,url:l==null?void 0:l.url,mimeType:l==null?void 0:l.mimeType}):t.jsx(t.Fragment,{})},N=({url:n,mimeType:e="",fileName:l})=>{const s=c.useMemo(()=>e!=null&&e.includes("image")?"image":e!=null&&e.includes("pdf")?"pdf":e!=null&&e.includes("word")?"word":e!=null&&e.includes("text")?"text":e!=null&&e.includes("presentation")?"presentation":e!=null&&e.includes("excel")||e!=null&&e.includes("spreadsheet")?"excel":"file",[e]),a=c.useMemo(()=>{switch(s){case"image":return t.jsx(d.FileImageOutlined,{});case"pdf":return t.jsx(d.FilePdfOutlined,{});case"word":return t.jsx(d.FileWordOutlined,{});case"text":return t.jsx(d.FileTextOutlined,{});case"excel":return t.jsx(d.FileExcelOutlined,{});case"presentation":return t.jsx(d.FilePptOutlined,{});default:return t.jsx(d.FileOutlined,{})}},[s]),[h,j]=c.useState(!1),{t:P}=G.useTranslationLib();return s!=="file"&&s!=="text"?t.jsxs(t.Fragment,{children:[t.jsx(F.Modal,{open:h,title:l,onCancel:()=>j(!1),footer:t.jsx(t.Fragment,{}),width:"100%",style:{top:"8px",minHeight:"700px"},destroyOnHidden:!0,children:t.jsxs(K,{children:[t.jsx(p,{tooltip:l,icon:t.jsx(d.ExportOutlined,{}),target:"_blank",href:n,style:{textDecoration:"none"},children:P("str.openInNewTab")}),s==="image"?t.jsx("img",{src:n,alt:l,style:{width:"100%"}}):s==="pdf"?t.jsxs("iframe",{title:l,src:n,width:"100%",height:"700px",children:["This browser does not support PDFs. Please download the PDF to view it:",t.jsx("a",{href:n,children:"Download PDF"})]}):t.jsxs("iframe",{title:l,src:`https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(n)}`,width:"100%",height:"700px",children:["This browser does not support open ",s.toUpperCase(),". Please download the",s.toUpperCase()," to view it:",t.jsxs("a",{href:n,children:["Download ",s.toUpperCase()]}),"."]})]})}),t.jsx(p,{tooltip:l,icon:a,shape:"circle",onClick:()=>j(!0)})]}):t.jsx(p,{tooltip:l,icon:a,target:"_blank",href:n,shape:"circle"})};exports.FileCellValue=N;exports.FileCrudCellValue=Y;exports.default=X;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),d=require("@ant-design/icons"),F=require("antd"),D=require("mime"),c=require("react"),G=require("../locale/index.cjs.js"),J=require("../util/ValidationUtil.cjs.js"),p=require("../common/button/Button.cjs.js"),K=require("../common/layout/VerticalSpace.cjs.js"),Q=require("../util/CrudUtil.cjs.js");function X({name:n,label:e,required:l,provider:s,onUploading:a,onRemoved:h,fieldClassName:j,accept:P,rules:U,maxCount:O=1,block:k,fieldHelper:E,formLayoutProps:_,...$}){const f=F.Form.useFormInstance(),H=Q.getRealName(n,"upsertFieldName"),x=F.Form.useWatch(H,f),[b,q]=c.useState(!1),[V,R]=c.useState(!1),A=c.useCallback(async r=>{var o,i;try{const{file:u}=r,g=u.name;q(!0),R(!0),a==null||a(!0);const C=g??"",S=C.split("."),W=S[S.length-1],B=s.generateFileName(C),z=`${await s.getInitialPath()}/${B}.${W}`,M=await s.upload({...u,originFileObj:u},z);a==null||a(!1),f.setFieldValue(n,M),(o=r.onSuccess)==null||o.call(r,M)}catch(u){(i=r.onError)==null||i.call(r,u)}finally{q(!1)}},[f,n,a,s]),[w,I]=c.useState([]);c.useEffect(()=>{!V&&x&&Promise.all((Array.isArray(x)?x:[x]).map(async r=>{const o=D.getType(r),i=r.split("/").pop(),u=await s.getRealUrl(r);return{uid:r,url:u,type:o,name:i}})).then(r=>I(()=>r.map(({url:i,type:u,uid:g,name:C})=>({uid:g,url:i,type:u,response:g,thumbUrl:i,name:C}))))},[x,V,b,s]);const L=c.useCallback(async r=>{const o=r.response,i=o||f.getFieldValue(n);await s.delete(i),h==null||h(),r&&f.setFieldsValue({[n]:null})},[f,n,h,s]);return t.jsxs(F.Form.Item,{label:e,required:l,name:n,..._,className:j,rules:[...l?J.required(e):[],...U??[]],help:E,children:[t.jsx("input",{hidden:!0}),t.jsx(F.Upload,{...$,fileList:w,className:((w==null?void 0:w.length)??0)>=O?"hide-upload":"",maxCount:O,customRequest:A,onRemove:L,listType:"picture",onChange:({fileList:r})=>{I(r)},style:k?{width:"100%"}:void 0,children:t.jsx(p,{loading:b,children:"Upload File"})})]})}const Y=({provider:n,value:e})=>{const[l,s]=c.useState();return c.useEffect(()=>{e&&n.getRealUrl(e).then(a=>{s({mimeType:D.getType(e),url:a,fileName:e.split("/").pop()??e})})},[n,e]),l?t.jsx(N,{fileName:l.fileName,url:l==null?void 0:l.url,mimeType:l==null?void 0:l.mimeType}):t.jsx(t.Fragment,{})},N=({url:n,mimeType:e="",fileName:l})=>{const s=c.useMemo(()=>e!=null&&e.includes("image")?"image":e!=null&&e.includes("pdf")?"pdf":e!=null&&e.includes("word")?"word":e!=null&&e.includes("text")?"text":e!=null&&e.includes("presentation")?"presentation":e!=null&&e.includes("excel")||e!=null&&e.includes("spreadsheet")?"excel":"file",[e]),a=c.useMemo(()=>{switch(s){case"image":return t.jsx(d.FileImageOutlined,{});case"pdf":return t.jsx(d.FilePdfOutlined,{});case"word":return t.jsx(d.FileWordOutlined,{});case"text":return t.jsx(d.FileTextOutlined,{});case"excel":return t.jsx(d.FileExcelOutlined,{});case"presentation":return t.jsx(d.FilePptOutlined,{});default:return t.jsx(d.FileOutlined,{})}},[s]),[h,j]=c.useState(!1),{t:P}=G.useTranslationLib();return s!=="file"&&s!=="text"?t.jsxs(t.Fragment,{children:[t.jsx(F.Modal,{open:h,title:l,onCancel:()=>j(!1),footer:t.jsx(t.Fragment,{}),width:"100%",style:{top:"8px",minHeight:"700px"},destroyOnHidden:!0,children:t.jsxs(K,{children:[t.jsx(p,{tooltip:l,icon:t.jsx(d.ExportOutlined,{}),target:"_blank",href:n,style:{textDecoration:"none"},children:P("str.openInNewTab")}),s==="image"?t.jsx("img",{src:n,alt:l,style:{width:"100%"}}):s==="pdf"?t.jsxs("iframe",{title:l,src:n,width:"100%",height:"700px",children:["This browser does not support PDFs. Please download the PDF to view it:",t.jsx("a",{href:n,children:"Download PDF"})]}):t.jsxs("iframe",{title:l,src:`https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(n)}`,width:"100%",height:"700px",children:["This browser does not support open ",s.toUpperCase(),". Please download the",s.toUpperCase()," to view it:",t.jsxs("a",{href:n,children:["Download ",s.toUpperCase()]}),"."]})]})}),t.jsx(p,{tooltip:l,icon:a,shape:"circle",onClick:()=>j(!0)})]}):t.jsx(p,{tooltip:l,icon:a,target:"_blank",href:n,shape:"circle"})};exports.FileCellValue=N;exports.FileCrudCellValue=Y;exports.default=X;

package/dist/crud/FileCrudField.d.ts

@@ -14,7 +14,7 @@ export interface _FileCrudField<T> extends InitialCrudField<T> {
     block?: boolean;
     help?: ReactNode;
 }
-export default function FileCrudFieldComponent<T>({ name, label, required, provider, onUploading, onRemoved, fieldClassName, accept, rules, maxCount, block, fieldHelper: help, formLayout, ...props }: Readonly<_FileCrudField<T>>): import("react/jsx-runtime").JSX.Element;
+export default function FileCrudFieldComponent<T>({ name, label, required, provider, onUploading, onRemoved, fieldClassName, accept, rules, maxCount, block, fieldHelper: help, formLayoutProps, ...props }: Readonly<_FileCrudField<T>>): import("react/jsx-runtime").JSX.Element;
 export declare const FileCrudCellValue: FC<{
     value: string;
     provider: FileDownloadProvider;

package/dist/crud/FileCrudField.es.js

@@ -21,7 +21,7 @@ function xt({
   maxCount: I = 1,
   block: A,
   fieldHelper: L,
-  formLayout: W,
+  formLayoutProps: W,
   ..._
 }) {
   const d = P.useFormInstance(), q = nt.getRealName(n, "upsertFieldName"), h = P.useWatch(q, d), [V, D] = p(!1), [N, B] = p(!1), R = M(
@@ -71,7 +71,7 @@ function xt({
       label: t,
       required: r,
       name: n,
-      layout: W,
+      ...W,
       className: F,
       rules: [
         ...r ? rt.required(t) : [],

package/dist/crud/ImageCrudField.cjs.js

@@ -1 +1 @@
-"use strict";var D=Object.defineProperty;var H=(s,e,t)=>e in s?D(s,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[e]=t;var g=(s,e,t)=>H(s,typeof e!="symbol"?e+"":e,t);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),R=require("@ant-design/icons"),f=require("antd"),q=require("path-browserify"),i=require("react"),T=require("../util/NumberUtil.cjs.js"),W=require("../util/ValidationUtil.cjs.js"),v=require("uuid"),z=require("../common/picker/ImagePicker.cjs.js"),G=require("../util/ImageUtil.cjs.js");class y{}class J extends y{constructor(t="",a=""){super();g(this,"rootPath");g(this,"subPath");this.rootPath=t,this.subPath=a}cloneFilePath(t){const a=q.parse(t),r=`${a.name}_cloned_${T.default.randInt(1e5)}`;return q.format({dir:a.dir,ext:a.ext,name:r})}generateFileName(t){return`${t.split(".")[0]}_${v.v4().replace("-","")}`}}function K({formLayout:s,name:e,label:t,required:a,provider:r,onUploading:u,aspectRatio:C,onRemoved:d,fieldClassName:x,hideLabel:N=!1,listType:b,fieldHelper:S,showSkipCropButton:$=!1,skipResize:p=!1,asyncUpload:O=!1},_){const m=f.Form.useFormInstance(),I=f.Form.useWatch(e,m),[w,k]=i.useState(!1),h=i.useCallback(async(l,F)=>{if(F){u==null||u(!0);const c=l.name,o=c.split("."),E=o[o.length-1],M=r.generateFileName(c),A=`${await r.getInitialPath()}/${M}.${E}`,B=await r.upload(l,A);k(!0),u==null||u(!1),m.setFieldValue(e,B)}else{const c=m.getFieldsValue(),o=await r.delete(c[e]);d==null||d(),o&&m.setFieldsValue({[e]:null})}},[m,e,d,u,r]),[P,j]=i.useState();return i.useEffect(()=>{!w&&I?r.getRealUrl(I).then(j):j(P)},[I,w,r,P]),i.useImperativeHandle(_,()=>({async uploadBlob(l,F){const c=await G.getBase64(l),o={name:F,uid:F+Math.random().toString(36).substring(2,15),url:c,originFileObj:l};return h(o,!0)}}),[h]),n.jsxs(f.Form.Item,{rules:a?W.required(t):[],label:N?null:t,required:a,name:e,help:S,layout:s,className:x,children:[n.jsx(z.default,{noStyle:!0,asyncUpload:O,listType:b,aspectRatio:C,values:P,onRemove:l=>{l&&h(l,!1)},onAdd:async l=>{l&&await h(l,!0)},className:x,showSkipCropButton:$,skipResize:p}),n.jsx(f.Input,{hidden:!0})]})}const L=i.forwardRef(K),Q=({provider:s,value:e})=>{const[t,a]=i.useState();return i.useEffect(()=>{e&&s.getRealUrl(e).then(a)},[s,e]),t?n.jsx(V,{url:t}):n.jsx(n.Fragment,{})},V=({url:s})=>n.jsx(f.Avatar,{className:"p-0",children:n.jsx(f.Image,{className:"m-0 p-0 position-relative",src:s,preview:{mask:n.jsx(R.EyeOutlined,{})}})});exports.FileDownloadProvider=y;exports.FileUploadProvider=J;exports.ImageCellValue=V;exports.ImageCrudCellValue=Q;exports.default=L;
+"use strict";var D=Object.defineProperty;var H=(s,e,t)=>e in s?D(s,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[e]=t;var g=(s,e,t)=>H(s,typeof e!="symbol"?e+"":e,t);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),R=require("@ant-design/icons"),f=require("antd"),q=require("path-browserify"),i=require("react"),T=require("../util/NumberUtil.cjs.js"),W=require("../util/ValidationUtil.cjs.js"),v=require("uuid"),z=require("../common/picker/ImagePicker.cjs.js"),G=require("../util/ImageUtil.cjs.js");class V{}class J extends V{constructor(t="",a=""){super();g(this,"rootPath");g(this,"subPath");this.rootPath=t,this.subPath=a}cloneFilePath(t){const a=q.parse(t),r=`${a.name}_cloned_${T.default.randInt(1e5)}`;return q.format({dir:a.dir,ext:a.ext,name:r})}generateFileName(t){return`${t.split(".")[0]}_${v.v4().replace("-","")}`}}function K({formLayoutProps:s,name:e,label:t,required:a,provider:r,onUploading:u,aspectRatio:C,onRemoved:d,fieldClassName:x,hideLabel:N=!1,listType:b,fieldHelper:S,showSkipCropButton:$=!1,skipResize:p=!1,asyncUpload:O=!1},_){const m=f.Form.useFormInstance(),I=f.Form.useWatch(e,m),[w,k]=i.useState(!1),h=i.useCallback(async(l,F)=>{if(F){u==null||u(!0);const c=l.name,o=c.split("."),E=o[o.length-1],M=r.generateFileName(c),A=`${await r.getInitialPath()}/${M}.${E}`,B=await r.upload(l,A);k(!0),u==null||u(!1),m.setFieldValue(e,B)}else{const c=m.getFieldsValue(),o=await r.delete(c[e]);d==null||d(),o&&m.setFieldsValue({[e]:null})}},[m,e,d,u,r]),[P,j]=i.useState();return i.useEffect(()=>{!w&&I?r.getRealUrl(I).then(j):j(P)},[I,w,r,P]),i.useImperativeHandle(_,()=>({async uploadBlob(l,F){const c=await G.getBase64(l),o={name:F,uid:F+Math.random().toString(36).substring(2,15),url:c,originFileObj:l};return h(o,!0)}}),[h]),n.jsxs(f.Form.Item,{rules:a?W.required(t):[],label:N?null:t,required:a,name:e,help:S,...s,className:x,children:[n.jsx(z.default,{noStyle:!0,asyncUpload:O,listType:b,aspectRatio:C,values:P,onRemove:l=>{l&&h(l,!1)},onAdd:async l=>{l&&await h(l,!0)},className:x,showSkipCropButton:$,skipResize:p}),n.jsx(f.Input,{hidden:!0})]})}const L=i.forwardRef(K),Q=({provider:s,value:e})=>{const[t,a]=i.useState();return i.useEffect(()=>{e&&s.getRealUrl(e).then(a)},[s,e]),t?n.jsx(y,{url:t}):n.jsx(n.Fragment,{})},y=({url:s})=>n.jsx(f.Avatar,{className:"p-0",children:n.jsx(f.Image,{className:"m-0 p-0 position-relative",src:s,preview:{mask:n.jsx(R.EyeOutlined,{})}})});exports.FileDownloadProvider=V;exports.FileUploadProvider=J;exports.ImageCellValue=y;exports.ImageCrudCellValue=Q;exports.default=L;

package/dist/crud/ImageCrudField.es.js

@@ -4,7 +4,7 @@ var I = (a, e, t) => M(a, typeof e != "symbol" ? e + "" : e, t);
 import { jsx as i, Fragment as W, jsxs as q } from "react/jsx-runtime";
 import { EyeOutlined as z } from "@ant-design/icons";
 import { Avatar as G, Image as J, Form as d, Input as K } from "antd";
-import N from "path-browserify";
+import y from "path-browserify";
 import L, { useState as P, useEffect as V, useCallback as Q, useImperativeHandle as R } from "react";
 import T from "../util/NumberUtil.es.js";
 import X from "../util/ValidationUtil.es.js";
@@ -21,11 +21,11 @@ class he extends v {
     this.rootPath = t, this.subPath = s;
   }
   cloneFilePath(t) {
-    const s = N.parse(t), r = `${s.name}_cloned_${T.randInt(1e5)}`;
-    return N.format({
+    const s = y.parse(t), l = `${s.name}_cloned_${T.randInt(1e5)}`;
+    return y.format({
       dir: s.dir,
       ext: s.ext,
-      name: r
+      name: l
     });
   }
   generateFileName(t) {
@@ -33,11 +33,11 @@ class he extends v {
   }
 }
 function ee({
-  formLayout: a,
+  formLayoutProps: a,
   name: e,
   label: t,
   required: s,
-  provider: r,
+  provider: l,
   onUploading: n,
   aspectRatio: x,
   onRemoved: m,
@@ -50,29 +50,29 @@ function ee({
   asyncUpload: k = !1
 }, S) {
   const o = d.useFormInstance(), F = d.useWatch(e, o), [g, _] = P(!1), f = Q(
-    async (l, h) => {
+    async (r, h) => {
       if (h) {
         n == null || n(!0);
-        const c = l.name, u = c.split("."), A = u[u.length - 1], B = r.generateFileName(c), E = `${await r.getInitialPath()}/${B}.${A}`, H = await r.upload(l, E);
+        const c = r.name, u = c.split("."), A = u[u.length - 1], B = l.generateFileName(c), E = `${await l.getInitialPath()}/${B}.${A}`, H = await l.upload(r, E);
         _(!0), n == null || n(!1), o.setFieldValue(e, H);
       } else {
-        const c = o.getFieldsValue(), u = await r.delete(c[e]);
+        const c = o.getFieldsValue(), u = await l.delete(c[e]);
         m == null || m(), u && o.setFieldsValue({ [e]: null });
       }
     },
-    [o, e, m, n, r]
-  ), [p, y] = P();
+    [o, e, m, n, l]
+  ), [p, N] = P();
   return V(() => {
-    !g && F ? r.getRealUrl(F).then(y) : y(p);
-  }, [F, g, r, p]), R(
+    !g && F ? l.getRealUrl(F).then(N) : N(p);
+  }, [F, g, l, p]), R(
     S,
     () => ({
-      async uploadBlob(l, h) {
-        const c = await U.getBase64(l), u = {
+      async uploadBlob(r, h) {
+        const c = await U.getBase64(r), u = {
           name: h,
           uid: h + Math.random().toString(36).substring(2, 15),
           url: c,
-          originFileObj: l
+          originFileObj: r
         };
         return f(u, !0);
       }
@@ -86,7 +86,7 @@ function ee({
       required: s,
       name: e,
       help: b,
-      layout: a,
+      ...a,
       className: w,
       children: [
         /* @__PURE__ */ i(
@@ -97,11 +97,11 @@ function ee({
             listType: C,
             aspectRatio: x,
             values: p,
-            onRemove: (l) => {
-              l && f(l, !1);
+            onRemove: (r) => {
+              r && f(r, !1);
             },
-            onAdd: async (l) => {
-              l && await f(l, !0);
+            onAdd: async (r) => {
+              r && await f(r, !0);
             },
             className: w,
             showSkipCropButton: O,

package/package.json

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