@kingteza/crud-component 1.10.0 → 1.10.2

package/dist/crud/CrudField.cjs.js

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

package/dist/crud/CrudField.es.js

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

package/dist/crud/ImageCrudField.d.ts

@@ -1,6 +1,6 @@
 import { UploadListType } from 'antd/es/upload/interface';
 import { UploadFile } from 'antd/lib';
-import { default as React, FC, ForwardedRef } from 'react';
+import { FC, ReactElement, Ref } from 'react';
 import { InitialCrudField } from './CrudComponent';
 export interface _ImageCrudField<T> extends InitialCrudField<T> {
     provider: FileUploadProvider;
@@ -31,9 +31,10 @@ export declare abstract class FileUploadProvider extends FileDownloadProvider {
 export interface ImageCrudFieldRef {
     uploadBlob: (blob: Blob, fileName: string) => Promise<void>;
 }
-declare function Component<T>({ name, label, required, provider, onUploading, aspectRatio, onRemoved, fieldClassName, hideLabel, listType, fieldHelper: help, }: Readonly<_ImageCrudField<T>>, ref: ForwardedRef<ImageCrudFieldRef>): import("react/jsx-runtime").JSX.Element;
-declare const ImageCrudFieldComponent: <T>(props: React.ComponentProps<typeof Component<T>>, ref: React.Ref<any>) => React.ReactElement | null;
-export default ImageCrudFieldComponent;
+declare const ImageCrudField: <T>(p: Readonly<_ImageCrudField<T>> & {
+    ref?: Ref<ImageCrudFieldRef>;
+}) => ReactElement;
+export default ImageCrudField;
 export declare const ImageCrudCellValue: FC<{
     value: string;
     provider: FileDownloadProvider;

package/dist/crud/ImageCrudField.es.js

@@ -1,6 +1,6 @@
 var A = Object.defineProperty;
 var B = (e, s, t) => s in e ? A(e, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[s] = t;
-var F = (e, s, t) => B(e, typeof s != "symbol" ? s + "" : s, t);
+var p = (e, s, t) => B(e, typeof s != "symbol" ? s + "" : s, t);
 import { jsx as n, Fragment as E, jsxs as H } from "react/jsx-runtime";
 /* empty css             */
 import { EyeOutlined as D } from "@ant-design/icons";
@@ -14,11 +14,11 @@ import R from "../common/picker/ImagePicker.es.js";
 import T from "../util/ImageUtil.es.js";
 class X {
 }
-class me extends X {
+class ue extends X {
   constructor(t = "", a = "") {
     super();
-    F(this, "rootPath");
-    F(this, "subPath");
+    p(this, "rootPath");
+    p(this, "subPath");
     this.rootPath = t, this.subPath = a;
   }
   cloneFilePath(t) {
@@ -40,46 +40,46 @@ function Y({
   provider: a,
   onUploading: l,
   aspectRatio: P,
-  onRemoved: m,
-  fieldClassName: C,
-  hideLabel: V = !1,
-  listType: x,
+  onRemoved: u,
+  fieldClassName: V,
+  hideLabel: x = !1,
+  listType: C,
   fieldHelper: $
 }, b) {
-  const c = d.useFormInstance(), h = d.useWatch(e, c), [w, O] = I(!1), u = G(
+  const o = d.useFormInstance(), h = d.useWatch(e, o), [w, O] = I(!1), m = G(
     async (r, f) => {
       if (f) {
         l == null || l(!0);
-        const i = r.name, o = i.split("."), j = o[o.length - 1], k = a.generateFileName(i), S = `${await a.getInitialPath()}/${k}.${j}`, _ = await a.upload(r, S);
-        O(!0), l == null || l(!1), c.setFieldValue(e, _);
+        const i = r.name, c = i.split("."), j = c[c.length - 1], k = a.generateFileName(i), S = `${await a.getInitialPath()}/${k}.${j}`, _ = await a.upload(r, S);
+        O(!0), l == null || l(!1), o.setFieldValue(e, _);
       } else {
-        const i = c.getFieldsValue(), o = await a.delete(i[e]);
-        m == null || m(), o && c.setFieldsValue({ [e]: null });
+        const i = o.getFieldsValue(), c = await a.delete(i[e]);
+        u == null || u(), c && o.setFieldsValue({ [e]: null });
       }
     },
-    [c, e, m, l, a]
-  ), [p, g] = I();
+    [o, e, u, l, a]
+  ), [F, g] = I();
   return y(() => {
-    !w && h ? a.getRealUrl(h).then(g) : g(p);
-  }, [h, w, a, p]), J(
+    !w && h ? a.getRealUrl(h).then(g) : g(F);
+  }, [h, w, a, F]), J(
     b,
     () => ({
       async uploadBlob(r, f) {
-        const i = await T.getBase64(r), o = {
+        const i = await T.getBase64(r), c = {
           name: f,
           uid: f + Math.random().toString(36).substring(2, 15),
           url: i,
           originFileObj: r
         };
-        return u(o, !0);
+        return m(c, !0);
       }
     }),
-    [u]
+    [m]
   ), /* @__PURE__ */ H(
     d.Item,
     {
       rules: t ? L.required(s) : [],
-      label: V ? null : s,
+      label: x ? null : s,
       required: t,
       name: e,
       help: $,
@@ -88,16 +88,16 @@ function Y({
           R,
           {
             noStyle: !0,
-            listType: x,
+            listType: C,
             aspectRatio: P,
-            values: p,
+            values: F,
             onRemove: (r) => {
-              r && u(r, !1);
+              r && m(r, !1);
             },
             onAdd: async (r) => {
-              r && await u(r, !0);
+              r && await m(r, !0);
             },
-            className: C
+            className: V
           }
         ),
         /* @__PURE__ */ n(q, { hidden: !0 })
@@ -105,7 +105,7 @@ function Y({
     }
   );
 }
-const ue = z.forwardRef(Y), fe = ({ provider: e, value: s }) => {
+const me = z.forwardRef(Y), fe = ({ provider: e, value: s }) => {
   const [t, a] = I();
   return y(() => {
     s && e.getRealUrl(s).then(a);
@@ -122,8 +122,8 @@ const ue = z.forwardRef(Y), fe = ({ provider: e, value: s }) => {
 ) });
 export {
   X as FileDownloadProvider,
-  me as FileUploadProvider,
+  ue as FileUploadProvider,
   Z as ImageCellValue,
   fe as ImageCrudCellValue,
-  ue as default
+  me as default
 };

package/package.json

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