@kingteza/crud-component 1.0.6 → 1.0.9

package/dist/src/components/crud/ImageCrudField.js

@@ -1,19 +1,22 @@
-var O = Object.defineProperty;
-var _ = (e, a, t) => a in e ? O(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t;
-var h = (e, a, t) => _(e, typeof a != "symbol" ? a + "" : a, t);
-import { j as l } from "../../../_virtual/jsx-runtime.js";
+var A = Object.defineProperty;
+var E = (e, a, t) => a in e ? A(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t;
+var h = (e, a, t) => E(e, typeof a != "symbol" ? a + "" : a, t);
+import { j as r } from "../../../_virtual/jsx-runtime.js";
 /* empty css          */
-import { EyeOutlined as A } from "@ant-design/icons";
-import { Form as x, Input as S, Avatar as D, Image as W } from "antd";
-import N from "path-browserify";
-import { useState as F, useCallback as q, useEffect as d } from "react";
-import z from "../../util/NumberUtil.js";
-import B from "../../util/ValidationUtil.js";
-import { v4 as G } from "uuid";
-import H from "../common/picker/ImagePicker.js";
+import N from "../../../_virtual/index.js";
+import { useState as F, useCallback as O, useEffect as w } from "react";
+import S from "../../util/NumberUtil.js";
+import D from "../../util/ValidationUtil.js";
+import W from "../common/picker/ImagePicker.js";
+import x from "../../../node_modules/antd/es/form/index.js";
+import q from "../../../node_modules/antd/es/input/index.js";
+import z from "../../../node_modules/uuid/dist/esm-browser/v4.js";
+import B from "../../../node_modules/antd/es/avatar/index.js";
+import G from "../../../node_modules/antd/es/image/index.js";
+import H from "../../../node_modules/@ant-design/icons/es/icons/EyeOutlined.js";
 class J {
 }
-class te extends J {
+class re extends J {
   constructor(t = "", s = "") {
     super();
     h(this, "rootPath");
@@ -21,93 +24,93 @@ class te extends J {
     this.rootPath = t, this.subPath = s;
   }
   cloneFilePath(t) {
-    const s = N.parse(t), r = `${s.name}_cloned_${z.randInt(1e5)}`;
+    const s = N.parse(t), l = `${s.name}_cloned_${S.randInt(1e5)}`;
     return N.format({
       dir: s.dir,
       ext: s.ext,
-      name: r
+      name: l
     });
   }
   generateFileName(t) {
-    return `${t.split(".")[0]}_${G().replace("-", "")}`;
+    return `${t.split(".")[0]}_${z().replace("-", "")}`;
   }
 }
-function se({
+function le({
   name: e,
   label: a,
   required: t,
   provider: s,
-  onUploading: r,
-  aspectRatio: P,
-  onRemoved: c,
-  fieldClassName: w,
+  onUploading: l,
+  aspectRatio: p,
+  onRemoved: m,
+  fieldClassName: d,
   hideLabel: V = !1,
-  listType: y
+  listType: C
 }) {
-  const i = x.useFormInstance(), u = x.useWatch(e, i), [p, C] = F(!1), I = q(
-    async (n, $) => {
-      if ($) {
-        r == null || r(!0);
-        const m = n.name, o = m.split("."), g = o[o.length - 1], b = s.generateFileName(m), k = `${await s.getInitialPath()}/${b}.${g}`, E = await s.upload(n, k);
-        C(!0), r == null || r(!1), i.setFieldValue(e, E);
+  const n = x.useFormInstance(), u = x.useWatch(e, n), [I, $] = F(!1), P = O(
+    async (i, g) => {
+      if (g) {
+        l == null || l(!0);
+        const o = i.name, c = o.split("."), y = c[c.length - 1], b = s.generateFileName(o), k = `${await s.getInitialPath()}/${b}.${y}`, _ = await s.upload(i, k);
+        $(!0), l == null || l(!1), n.setFieldValue(e, _);
       } else {
-        console.log(n);
-        const m = i.getFieldsValue(), o = await s.delete(m[e]);
-        c == null || c(), o && i.setFieldsValue({ [e]: null });
+        console.log(i);
+        const o = n.getFieldsValue(), c = await s.delete(o[e]);
+        m == null || m(), c && n.setFieldsValue({ [e]: null });
       }
     },
-    [i, e, c, r, s]
+    [n, e, m, l, s]
   ), [f, j] = F();
-  return d(() => {
-    !p && u ? s.getRealUrl(u).then(j) : j(f);
-  }, [u, p, s, f]), /* @__PURE__ */ l.jsx(l.Fragment, { children: /* @__PURE__ */ l.jsxs(
+  return w(() => {
+    !I && u ? s.getRealUrl(u).then(j) : j(f);
+  }, [u, I, s, f]), /* @__PURE__ */ r.jsx(r.Fragment, { children: /* @__PURE__ */ r.jsxs(
     x.Item,
     {
-      rules: t ? B.required(a) : [],
+      rules: t ? D.required(a) : [],
       label: V ? null : a,
       required: t,
       name: e,
       children: [
-        /* @__PURE__ */ l.jsx(
-          H,
+        /* @__PURE__ */ r.jsx(
+          W,
           {
             noStyle: !0,
-            listType: y,
-            aspectRatio: P,
+            listType: C,
+            aspectRatio: p,
             values: f,
-            onRemove: (n) => {
-              n && I(n, !1);
+            onRemove: (i) => {
+              i && P(i, !1);
             },
-            onAdd: async (n) => {
-              n && await I(n, !0);
+            onAdd: async (i) => {
+              i && await P(i, !0);
             },
-            className: w
+            className: d
           }
         ),
-        /* @__PURE__ */ l.jsx(S, { hidden: !0 })
+        /* @__PURE__ */ r.jsx(q, { hidden: !0 })
       ]
     }
   ) });
 }
-const ae = ({ provider: e, value: a }) => {
+const ie = ({ provider: e, value: a }) => {
   const [t, s] = F();
-  return d(() => {
+  return w(() => {
     a && e.getRealUrl(a).then(s);
-  }, [e, a]), t ? /* @__PURE__ */ l.jsx(K, { url: t }) : /* @__PURE__ */ l.jsx(l.Fragment, {});
-}, K = ({ url: e }) => /* @__PURE__ */ l.jsx(D, { className: "p-0", children: /* @__PURE__ */ l.jsx(
-  W,
+  }, [e, a]), t ? /* @__PURE__ */ r.jsx(K, { url: t }) : /* @__PURE__ */ r.jsx(r.Fragment, {});
+}, K = ({ url: e }) => /* @__PURE__ */ r.jsx(B, { className: "p-0", children: /* @__PURE__ */ r.jsx(
+  G,
   {
     className: "m-0 p-0 position-relative",
     src: e,
     preview: {
-      mask: /* @__PURE__ */ l.jsx(A, {})
+      mask: /* @__PURE__ */ r.jsx(H, {})
     }
   }
 ) });
 export {
   J as FileDownloadProvider,
-  te as FileUploadProvider,
+  re as FileUploadProvider,
   K as ImageCellValue,
-  ae as ImageCrudCellValue,
-  se as default
+  ie as ImageCrudCellValue,
+  le as default
 };

package/dist/src/components/crud/import/CrudImportButton.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../../../../_virtual/jsx-runtime.cjs"),s=require("@ant-design/icons"),u=require("react"),i=require("react-i18next"),c=require("../../../locale/hooks/translation-constants.cjs"),a=require("./CrudImportComponent.cjs"),l=require("../../common/button/Button.cjs");function p(n){const{t:r}=i.useTranslation(c.TRANSLATION_NAMESPACE),[o,e]=u.useState(!1);return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(a.default,{open:o,onCloseMethod:e,...n}),t.jsxRuntimeExports.jsx(l.default,{icon:t.jsxRuntimeExports.jsx(s.ImportOutlined,{}),onClick:()=>e(!0),children:r("str.import")})]})}exports.default=p;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../../../../_virtual/jsx-runtime.cjs"),s=require("react"),u=require("react-i18next"),i=require("../../../locale/hooks/translation-constants.cjs"),c=require("./CrudImportComponent.cjs"),a=require("../../common/button/Button.cjs"),l=require("../../../../node_modules/@ant-design/icons/es/icons/ImportOutlined.cjs");function p(r){const{t:n}=u.useTranslation(i.TRANSLATION_NAMESPACE),[o,e]=s.useState(!1);return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(c.default,{open:o,onCloseMethod:e,...r}),t.jsxRuntimeExports.jsx(a.default,{icon:t.jsxRuntimeExports.jsx(l.default,{}),onClick:()=>e(!0),children:n("str.import")})]})}exports.default=p;

package/dist/src/components/crud/import/CrudImportButton.js

@@ -1,17 +1,17 @@
 import { j as o } from "../../../../_virtual/jsx-runtime.js";
-import { ImportOutlined as e } from "@ant-design/icons";
-import { useState as p } from "react";
-import { useTranslation as s } from "react-i18next";
-import { TRANSLATION_NAMESPACE as i } from "../../../locale/hooks/translation-constants.js";
-import u from "./CrudImportComponent.js";
+import { useState as e } from "react";
+import { useTranslation as p } from "react-i18next";
+import { TRANSLATION_NAMESPACE as s } from "../../../locale/hooks/translation-constants.js";
+import i from "./CrudImportComponent.js";
 import f from "../../common/button/Button.js";
+import u from "../../../../node_modules/@ant-design/icons/es/icons/ImportOutlined.js";
 function I(r) {
-  const { t: m } = s(i), [n, t] = p(!1);
+  const { t: n } = p(s), [m, t] = e(!1);
   return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
     /* @__PURE__ */ o.jsx(
-      u,
+      i,
       {
-        open: n,
+        open: m,
         onCloseMethod: t,
         ...r
       }
@@ -19,9 +19,9 @@ function I(r) {
     /* @__PURE__ */ o.jsx(
       f,
       {
-        icon: /* @__PURE__ */ o.jsx(e, {}),
+        icon: /* @__PURE__ */ o.jsx(u, {}),
         onClick: () => t(!0),
-        children: m("str.import")
+        children: n("str.import")
       }
     )
   ] });

package/dist/src/components/crud/import/CrudImportComponent.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../../../_virtual/jsx-runtime.cjs"),g=require("@ant-design/icons"),M=require("papaparse"),d=require("antd"),B=require("file-saver"),o=require("react"),O=require("react-i18next"),V=require("../../../locale/hooks/translation-constants.cjs"),W=require("../view/CrudViewer.cjs"),_=require("../../../util/DateUtil.cjs"),L=require("../../common/button/Button.cjs"),z=require("../../common/button/ImportButton.cjs");function $({onCloseMethod:b,open:C,fields:T,importProps:a}){const[u,q]=o.useState([]),[E,h]=o.useState(!1),[w,v]=o.useState(0);o.useEffect(()=>{C||(q([]),h(!1))},[C]);const f=o.useMemo(()=>new Map(T.filter(e=>{var t;return!e.hidden&&!((t=e.importProps)!=null&&t.hidden)&&!e.readonly}).map(e=>[e.name,e])),[T]),S=o.useMemo(()=>Array.from(f.values()).flatMap(e=>{var t;return[e.name,...((t=e.importProps)==null?void 0:t.extraFields)??[]]}),[f]),D=o.useCallback(async function(){const e=`${S.join(",")}
-`,t=new Blob([e],{type:"text/csv;charset=utf-8;"});B.saveAs(t,(a==null?void 0:a.name)+" - "+_.default.formatDateTimeWithSecond(new Date).replaceAll(":","-")+".csv")},[S,a==null?void 0:a.name]),{t:l}=O.useTranslation(V.TRANSLATION_NAMESPACE),I=o.useCallback(async e=>{const t=new FileReader;t.onerror=console.error,t.onload=async r=>{var n;const c=(n=r==null?void 0:r.target)==null?void 0:n.result,i=M.parse(c,{header:!0});q(i.data)},t.readAsText(e)},[]),y=o.useMemo(()=>{var t,r,c;let e=!1;for(const i of u)for(const[n,x]of f.entries()){const j=i[n],m=j||!isNaN(j);if(x.required&&!m)if((r=(t=x.importProps)==null?void 0:t.extraFields)!=null&&r.length)for(const R of((c=x.importProps)==null?void 0:c.extraFields)??[])if(i[R]||!isNaN(i[R])){e=!1;break}else return!0;else return!0}return e},[u,f]),p=o.useCallback(e=>(t,r)=>{var i,n,x;const c=t||!isNaN(t);if(e.required&&!c){let j=l("err.validation.required");if((n=(i=e.importProps)==null?void 0:i.extraFields)!=null&&n.length){const m=(x=e.importProps)==null?void 0:x.extraFields;(m==null?void 0:m.find(N=>!r[N]))&&(j="Either one of these fields is required: "+[e.name,...m].join(", "))}return s.jsxRuntimeExports.jsxs(d.Tooltip,{className:"d-flex",title:j,children:[s.jsxRuntimeExports.jsx(g.WarningTwoTone,{twoToneColor:"#ee9702"}),t]})}return t},[l]),A=o.useCallback(async e=>{v(e)},[]),k=o.useCallback(async()=>{try{h(!0),await a.onClickImport(u,A),b(!1)}finally{h(!1),v(0)}},[u,a,b,A]),F=o.useCallback(async()=>{y?d.Modal.warn({title:l("str.warning"),content:l("qus.importWithIssues"),okText:l("str.import"),onOk:k,okCancel:!0,closable:!0}):k()},[y,k,l]);return s.jsxRuntimeExports.jsxs(d.Modal,{title:[l("str.import"),a==null?void 0:a.name].filter(Boolean).join(" "),width:"100%",open:C,onOk:F,destroyOnClose:!0,onCancel:()=>b(!1),okText:l("str.import"),confirmLoading:E,okButtonProps:{disabled:!(u!=null&&u.length)},footer:(e,{OkBtn:t,CancelBtn:r})=>s.jsxRuntimeExports.jsxs(d.Space,{children:[s.jsxRuntimeExports.jsx(r,{}),s.jsxRuntimeExports.jsx(t,{}),y&&s.jsxRuntimeExports.jsx(d.Tooltip,{className:"d-flex",title:"Some fields have issue. Please review before submit.",children:s.jsxRuntimeExports.jsx(g.WarningTwoTone,{twoToneColor:"#ee9702"})})]}),children:[s.jsxRuntimeExports.jsxs(d.Space,{children:[s.jsxRuntimeExports.jsx(L.default,{onClick:D,icon:s.jsxRuntimeExports.jsx(g.DownloadOutlined,{}),children:l("str.downloadCsvTemplate")}),s.jsxRuntimeExports.jsx(z.ImportButton,{disabled:E,type:"default",onClick:I,accept:".csv",children:l("str.importCsvFile")})]}),s.jsxRuntimeExports.jsx(d.Spin,{spinning:E,indicator:w?s.jsxRuntimeExports.jsx(d.Progress,{type:"circle",percent:w*100,size:50,format:e=>`${parseInt(e)}%`}):void 0,children:s.jsxRuntimeExports.jsx(W.default,{data:u,bordered:!0,size:"small",fields:Array.from(f.values()).flatMap(e=>{var t,r,c,i;return e.type==="text"?[{...e,label:e.name,render:p(e)},...((r=(t=e.importProps)==null?void 0:t.extraFields)==null?void 0:r.map(n=>({...e,name:n,label:n,render:p(e)})))??[]]:e.type==="select"?[{...e,label:e.name,type:"text",render:p(e)},...((i=(c=e.importProps)==null?void 0:c.extraFields)==null?void 0:i.map(n=>({...e,name:n,label:n,type:"text",render:p(e)})))??[]]:[{...e,label:e.name,render:p(e)}]})})})]})}exports.default=$;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../../../_virtual/jsx-runtime.cjs"),B=require("../../../../_virtual/papaparse.min.cjs"),O=require("../../../../_virtual/FileSaver.min.cjs"),a=require("react"),$=require("react-i18next"),V=require("../../../locale/hooks/translation-constants.cjs"),L=require("../view/CrudViewer.cjs"),W=require("../../../util/DateUtil.cjs"),z=require("../../common/button/Button.cjs"),U=require("../../common/button/ImportButton.cjs"),N=require("../../../../node_modules/antd/es/tooltip/index.cjs"),S=require("../../../../node_modules/@ant-design/icons/es/icons/WarningTwoTone.cjs"),F=require("../../../../node_modules/antd/es/modal/index.cjs"),D=require("../../../../node_modules/antd/es/space/index.cjs"),G=require("../../../../node_modules/@ant-design/icons/es/icons/DownloadOutlined.cjs"),H=require("../../../../node_modules/antd/es/spin/index.cjs"),J=require("../../../../node_modules/antd/es/progress/progress.cjs");function K({onCloseMethod:j,open:b,fields:k,importProps:o}){const[c,R]=a.useState([]),[E,C]=a.useState(!1),[g,v]=a.useState(0);a.useEffect(()=>{b||(R([]),C(!1))},[b]);const f=a.useMemo(()=>new Map(k.filter(e=>{var t;return!e.hidden&&!((t=e.importProps)!=null&&t.hidden)&&!e.readonly}).map(e=>[e.name,e])),[k]),w=a.useMemo(()=>Array.from(f.values()).flatMap(e=>{var t;return[e.name,...((t=e.importProps)==null?void 0:t.extraFields)??[]]}),[f]),I=a.useCallback(async function(){const e=`${w.join(",")}
+`,t=new Blob([e],{type:"text/csv;charset=utf-8;"});O.FileSaver_minExports.saveAs(t,(o==null?void 0:o.name)+" - "+W.default.formatDateTimeWithSecond(new Date).replaceAll(":","-")+".csv")},[w,o==null?void 0:o.name]),{t:l}=$.useTranslation(V.TRANSLATION_NAMESPACE),M=a.useCallback(async e=>{const t=new FileReader;t.onerror=console.error,t.onload=async r=>{var n;const u=(n=r==null?void 0:r.target)==null?void 0:n.result,i=B.default.parse(u,{header:!0});R(i.data)},t.readAsText(e)},[]),h=a.useMemo(()=>{var t,r,u;let e=!1;for(const i of c)for(const[n,d]of f.entries()){const p=i[n],x=p||!isNaN(p);if(d.required&&!x)if((r=(t=d.importProps)==null?void 0:t.extraFields)!=null&&r.length)for(const y of((u=d.importProps)==null?void 0:u.extraFields)??[])if(i[y]||!isNaN(i[y])){e=!1;break}else return!0;else return!0}return e},[c,f]),m=a.useCallback(e=>(t,r)=>{var i,n,d;const u=t||!isNaN(t);if(e.required&&!u){let p=l("err.validation.required");if((n=(i=e.importProps)==null?void 0:i.extraFields)!=null&&n.length){const x=(d=e.importProps)==null?void 0:d.extraFields;(x==null?void 0:x.find(A=>!r[A]))&&(p="Either one of these fields is required: "+[e.name,...x].join(", "))}return s.jsxRuntimeExports.jsxs(N.default,{className:"d-flex",title:p,children:[s.jsxRuntimeExports.jsx(S.default,{twoToneColor:"#ee9702"}),t]})}return t},[l]),T=a.useCallback(async e=>{v(e)},[]),q=a.useCallback(async()=>{try{C(!0),await o.onClickImport(c,T),j(!1)}finally{C(!1),v(0)}},[c,o,j,T]),_=a.useCallback(async()=>{h?F.default.warn({title:l("str.warning"),content:l("qus.importWithIssues"),okText:l("str.import"),onOk:q,okCancel:!0,closable:!0}):q()},[h,q,l]);return s.jsxRuntimeExports.jsxs(F.default,{title:[l("str.import"),o==null?void 0:o.name].filter(Boolean).join(" "),width:"100%",open:b,onOk:_,destroyOnClose:!0,onCancel:()=>j(!1),okText:l("str.import"),confirmLoading:E,okButtonProps:{disabled:!(c!=null&&c.length)},footer:(e,{OkBtn:t,CancelBtn:r})=>s.jsxRuntimeExports.jsxs(D.default,{children:[s.jsxRuntimeExports.jsx(r,{}),s.jsxRuntimeExports.jsx(t,{}),h&&s.jsxRuntimeExports.jsx(N.default,{className:"d-flex",title:"Some fields have issue. Please review before submit.",children:s.jsxRuntimeExports.jsx(S.default,{twoToneColor:"#ee9702"})})]}),children:[s.jsxRuntimeExports.jsxs(D.default,{children:[s.jsxRuntimeExports.jsx(z.default,{onClick:I,icon:s.jsxRuntimeExports.jsx(G.default,{}),children:l("str.downloadCsvTemplate")}),s.jsxRuntimeExports.jsx(U.ImportButton,{disabled:E,type:"default",onClick:M,accept:".csv",children:l("str.importCsvFile")})]}),s.jsxRuntimeExports.jsx(H.default,{spinning:E,indicator:g?s.jsxRuntimeExports.jsx(J.default,{type:"circle",percent:g*100,size:50,format:e=>`${parseInt(e)}%`}):void 0,children:s.jsxRuntimeExports.jsx(L.default,{data:c,bordered:!0,size:"small",fields:Array.from(f.values()).flatMap(e=>{var t,r,u,i;return e.type==="text"?[{...e,label:e.name,render:m(e)},...((r=(t=e.importProps)==null?void 0:t.extraFields)==null?void 0:r.map(n=>({...e,name:n,label:n,render:m(e)})))??[]]:e.type==="select"?[{...e,label:e.name,type:"text",render:m(e)},...((i=(u=e.importProps)==null?void 0:u.extraFields)==null?void 0:i.map(n=>({...e,name:n,label:n,type:"text",render:m(e)})))??[]]:[{...e,label:e.name,render:m(e)}]})})})]})}exports.default=K;

package/dist/src/components/crud/import/CrudImportComponent.js

@@ -1,68 +1,73 @@
-import { j as r } from "../../../../_virtual/jsx-runtime.js";
-import { WarningTwoTone as S, DownloadOutlined as R } from "@ant-design/icons";
-import W from "papaparse";
-import { Tooltip as q, Modal as B, Space as O, Spin as z, Progress as _ } from "antd";
-import { saveAs as $ } from "file-saver";
-import { useState as k, useEffect as U, useMemo as T, useCallback as m } from "react";
-import { useTranslation as G } from "react-i18next";
-import { TRANSLATION_NAMESPACE as H } from "../../../locale/hooks/translation-constants.js";
-import J from "../view/CrudViewer.js";
-import K from "../../../util/DateUtil.js";
-import Q from "../../common/button/Button.js";
-import { ImportButton as X } from "../../common/button/ImportButton.js";
-function ce({
+import { j as t } from "../../../../_virtual/jsx-runtime.js";
+import L from "../../../../_virtual/papaparse.min.js";
+import { F as _ } from "../../../../_virtual/FileSaver.min.js";
+import { useState as w, useEffect as $, useMemo as v, useCallback as d } from "react";
+import { useTranslation as z } from "react-i18next";
+import { TRANSLATION_NAMESPACE as W } from "../../../locale/hooks/translation-constants.js";
+import U from "../view/CrudViewer.js";
+import G from "../../../util/DateUtil.js";
+import H from "../../common/button/Button.js";
+import { ImportButton as J } from "../../common/button/ImportButton.js";
+import S from "../../../../node_modules/antd/es/tooltip/index.js";
+import q from "../../../../node_modules/@ant-design/icons/es/icons/WarningTwoTone.js";
+import B from "../../../../node_modules/antd/es/modal/index.js";
+import R from "../../../../node_modules/antd/es/space/index.js";
+import K from "../../../../node_modules/@ant-design/icons/es/icons/DownloadOutlined.js";
+import Q from "../../../../node_modules/antd/es/spin/index.js";
+import X from "../../../../node_modules/antd/es/progress/progress.js";
+function pe({
   onCloseMethod: h,
   open: y,
-  fields: v,
-  importProps: o
+  fields: A,
+  importProps: s
 }) {
-  const [c, A] = k([]), [j, b] = k(!1), [N, D] = k(0);
-  U(() => {
-    y || (A([]), b(!1));
+  const [c, N] = w([]), [j, b] = w(!1), [T, E] = w(0);
+  $(() => {
+    y || (N([]), b(!1));
   }, [y]);
-  const u = T(
+  const u = v(
     () => new Map(
-      v.filter((e) => {
-        var t;
-        return !e.hidden && !((t = e.importProps) != null && t.hidden) && !e.readonly;
+      A.filter((e) => {
+        var r;
+        return !e.hidden && !((r = e.importProps) != null && r.hidden) && !e.readonly;
       }).map((e) => [e.name, e])
     ),
-    [v]
-  ), E = T(
+    [A]
+  ), F = v(
     () => Array.from(u.values()).flatMap((e) => {
-      var t;
+      var r;
       return [
         e.name,
-        ...((t = e.importProps) == null ? void 0 : t.extraFields) ?? []
+        ...((r = e.importProps) == null ? void 0 : r.extraFields) ?? []
       ];
     }),
     [u]
-  ), V = m(
+  ), V = d(
     async function() {
-      const e = `${E.join(",")}
-`, t = new Blob([e], { type: "text/csv;charset=utf-8;" });
-      $(
-        t,
-        (o == null ? void 0 : o.name) + " - " + K.formatDateTimeWithSecond(/* @__PURE__ */ new Date()).replaceAll(":", "-") + ".csv"
+      const e = `${F.join(",")}
+`, r = new Blob([e], { type: "text/csv;charset=utf-8;" });
+      _.saveAs(
+        r,
+        (s == null ? void 0 : s.name) + " - " + G.formatDateTimeWithSecond(/* @__PURE__ */ new Date()).replaceAll(":", "-") + ".csv"
       );
     },
-    [E, o == null ? void 0 : o.name]
-  ), { t: l } = G(H), M = m(async (e) => {
-    const t = new FileReader();
-    t.onerror = console.error, t.onload = async (n) => {
-      var s;
-      const i = (s = n == null ? void 0 : n.target) == null ? void 0 : s.result, a = W.parse(i, { header: !0 });
-      A(a.data);
-    }, t.readAsText(e);
-  }, []), C = T(() => {
-    var t, n, i;
+    [F, s == null ? void 0 : s.name]
+  ), { t: i } = z(W), M = d(async (e) => {
+    const r = new FileReader();
+    r.onerror = console.error, r.onload = async (o) => {
+      var n;
+      const l = (n = o == null ? void 0 : o.target) == null ? void 0 : n.result, a = L.parse(l, { header: !0 });
+      N(a.data);
+    }, r.readAsText(e);
+  }, []), C = v(() => {
+    var r, o, l;
     let e = !1;
     for (const a of c)
-      for (const [s, d] of u.entries()) {
-        const x = a[s], f = x || !isNaN(x);
-        if (d.required && !f)
-          if ((n = (t = d.importProps) == null ? void 0 : t.extraFields) != null && n.length)
-            for (const g of ((i = d.importProps) == null ? void 0 : i.extraFields) ?? [])
+      for (const [n, m] of u.entries()) {
+        const x = a[n], f = x || !isNaN(x);
+        if (m.required && !f)
+          if ((o = (r = m.importProps) == null ? void 0 : r.extraFields) != null && o.length)
+            for (const g of ((l = m.importProps) == null ? void 0 : l.extraFields) ?? [])
               if (a[g] || !isNaN(a[g])) {
                 e = !1;
                 break;
@@ -70,120 +75,120 @@ function ce({
           else return !0;
       }
     return e;
-  }, [c, u]), p = m(
-    (e) => (t, n) => {
-      var a, s, d;
-      const i = t || !isNaN(t);
-      if (e.required && !i) {
-        let x = l("err.validation.required");
-        if ((s = (a = e.importProps) == null ? void 0 : a.extraFields) != null && s.length) {
-          const f = (d = e.importProps) == null ? void 0 : d.extraFields;
-          (f == null ? void 0 : f.find((I) => !n[I])) && (x = "Either one of these fields is required: " + [e.name, ...f].join(", "));
+  }, [c, u]), p = d(
+    (e) => (r, o) => {
+      var a, n, m;
+      const l = r || !isNaN(r);
+      if (e.required && !l) {
+        let x = i("err.validation.required");
+        if ((n = (a = e.importProps) == null ? void 0 : a.extraFields) != null && n.length) {
+          const f = (m = e.importProps) == null ? void 0 : m.extraFields;
+          (f == null ? void 0 : f.find((D) => !o[D])) && (x = "Either one of these fields is required: " + [e.name, ...f].join(", "));
         }
-        return /* @__PURE__ */ r.jsxs(q, { className: "d-flex", title: x, children: [
-          /* @__PURE__ */ r.jsx(S, { twoToneColor: "#ee9702" }),
-          t
+        return /* @__PURE__ */ t.jsxs(S, { className: "d-flex", title: x, children: [
+          /* @__PURE__ */ t.jsx(q, { twoToneColor: "#ee9702" }),
+          r
         ] });
       }
-      return t;
+      return r;
     },
-    [l]
-  ), F = m(async (e) => {
-    D(e);
-  }, []), w = m(async () => {
+    [i]
+  ), I = d(async (e) => {
+    E(e);
+  }, []), k = d(async () => {
     try {
-      b(!0), await o.onClickImport(c, F), h(!1);
+      b(!0), await s.onClickImport(c, I), h(!1);
     } finally {
-      b(!1), D(0);
+      b(!1), E(0);
     }
-  }, [c, o, h, F]), L = m(async () => {
+  }, [c, s, h, I]), O = d(async () => {
     C ? B.warn({
-      title: l("str.warning"),
-      content: l("qus.importWithIssues"),
-      okText: l("str.import"),
-      onOk: w,
+      title: i("str.warning"),
+      content: i("qus.importWithIssues"),
+      okText: i("str.import"),
+      onOk: k,
       okCancel: !0,
       closable: !0
-    }) : w();
-  }, [C, w, l]);
-  return /* @__PURE__ */ r.jsxs(
+    }) : k();
+  }, [C, k, i]);
+  return /* @__PURE__ */ t.jsxs(
     B,
     {
-      title: [l("str.import"), o == null ? void 0 : o.name].filter(Boolean).join(" "),
+      title: [i("str.import"), s == null ? void 0 : s.name].filter(Boolean).join(" "),
       width: "100%",
       open: y,
-      onOk: L,
+      onOk: O,
       destroyOnClose: !0,
       onCancel: () => h(!1),
-      okText: l("str.import"),
+      okText: i("str.import"),
       confirmLoading: j,
       okButtonProps: {
         disabled: !(c != null && c.length)
       },
-      footer: (e, { OkBtn: t, CancelBtn: n }) => /* @__PURE__ */ r.jsxs(O, { children: [
-        /* @__PURE__ */ r.jsx(n, {}),
-        /* @__PURE__ */ r.jsx(t, {}),
-        C && /* @__PURE__ */ r.jsx(
-          q,
+      footer: (e, { OkBtn: r, CancelBtn: o }) => /* @__PURE__ */ t.jsxs(R, { children: [
+        /* @__PURE__ */ t.jsx(o, {}),
+        /* @__PURE__ */ t.jsx(r, {}),
+        C && /* @__PURE__ */ t.jsx(
+          S,
           {
             className: "d-flex",
             title: "Some fields have issue. Please review before submit.",
-            children: /* @__PURE__ */ r.jsx(S, { twoToneColor: "#ee9702" })
+            children: /* @__PURE__ */ t.jsx(q, { twoToneColor: "#ee9702" })
           }
         )
       ] }),
       children: [
-        /* @__PURE__ */ r.jsxs(O, { children: [
-          /* @__PURE__ */ r.jsx(
-            Q,
+        /* @__PURE__ */ t.jsxs(R, { children: [
+          /* @__PURE__ */ t.jsx(
+            H,
             {
               onClick: V,
-              icon: /* @__PURE__ */ r.jsx(R, {}),
-              children: l("str.downloadCsvTemplate")
+              icon: /* @__PURE__ */ t.jsx(K, {}),
+              children: i("str.downloadCsvTemplate")
             }
           ),
-          /* @__PURE__ */ r.jsx(
-            X,
+          /* @__PURE__ */ t.jsx(
+            J,
             {
               disabled: j,
               type: "default",
               onClick: M,
               accept: ".csv",
-              children: l("str.importCsvFile")
+              children: i("str.importCsvFile")
             }
           )
         ] }),
-        /* @__PURE__ */ r.jsx(
-          z,
+        /* @__PURE__ */ t.jsx(
+          Q,
           {
             spinning: j,
-            indicator: N ? /* @__PURE__ */ r.jsx(
-              _,
+            indicator: T ? /* @__PURE__ */ t.jsx(
+              X,
               {
                 type: "circle",
-                percent: N * 100,
+                percent: T * 100,
                 size: 50,
                 format: (e) => `${parseInt(e)}%`
               }
             ) : void 0,
-            children: /* @__PURE__ */ r.jsx(
-              J,
+            children: /* @__PURE__ */ t.jsx(
+              U,
               {
                 data: c,
                 bordered: !0,
                 size: "small",
                 fields: Array.from(u.values()).flatMap((e) => {
-                  var t, n, i, a;
+                  var r, o, l, a;
                   return e.type === "text" ? [
                     {
                       ...e,
                       label: e.name,
                       render: p(e)
                     },
-                    ...((n = (t = e.importProps) == null ? void 0 : t.extraFields) == null ? void 0 : n.map((s) => ({
+                    ...((o = (r = e.importProps) == null ? void 0 : r.extraFields) == null ? void 0 : o.map((n) => ({
                       ...e,
-                      name: s,
-                      label: s,
+                      name: n,
+                      label: n,
                       render: p(e)
                     }))) ?? []
                   ] : e.type === "select" ? [
@@ -193,10 +198,10 @@ function ce({
                       type: "text",
                       render: p(e)
                     },
-                    ...((a = (i = e.importProps) == null ? void 0 : i.extraFields) == null ? void 0 : a.map((s) => ({
+                    ...((a = (l = e.importProps) == null ? void 0 : l.extraFields) == null ? void 0 : a.map((n) => ({
                       ...e,
-                      name: s,
-                      label: s,
+                      name: n,
+                      label: n,
                       type: "text",
                       render: p(e)
                     }))) ?? []
@@ -217,5 +222,5 @@ function ce({
   );
 }
 export {
-  ce as default
+  pe as default
 };

package/dist/src/components/crud/view/CrudViewer.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../../../../_virtual/jsx-runtime.cjs"),D=require("antd"),k=require("../../common/button/CloneButtonTable.cjs"),H=require("../../common/button/DeleteButtonTable.cjs"),U=require("../../common/button/ExportButton.cjs"),F=require("../../common/button/HideButtonTable.cjs"),tt=require("../../common/button/RefreshButton.cjs"),et=require("../../common/button/UpdateButtonTable.cjs"),st=require("../../common/button/ViewButtonTable.cjs"),rt=require("../../common/layout/VerticalSpace.cjs"),ut=require("../../common/table/table.cjs"),l=require("react"),nt=require("react-i18next"),ot=require("../../../locale/hooks/translation-constants.cjs"),xt=require("../CrudSearchComponent.cjs"),ct=require("./CrudDecListView.cjs"),_=require("./CrudViewerUtil.cjs");function jt({idField:r="id",loadingData:L,fields:c,isDeleting:q,isHiding:d,viewable:o=!1,paginateProps:i,onDelete:a,onHide:v,onUpdate:R,data:E=[],extraAction:m,onClickUpdate:x,minusHeight:S,scroll:N,onClickClone:f,className:z,expandable:$,size:w,bordered:A,descListColumn:G,extraView:p,decListLayout:J,scrollToTop:lt,onClickRefresh:g,closeViewOnClickUpdate:b,onExport:B,confirmHiding:C,confirmDeleting:I,rowClassName:K,actionWidth:Q=190,...W}){const{t:X}=nt.useTranslation(ot.TRANSLATION_NAMESPACE),M=l.useMemo(()=>c.map(({hideInTable:e,hidden:s,width:j,name:n,label:Z,halign:P,...O})=>({title:Z,width:j,key:n,dataIndex:n,hidden:e||s,align:P??(O.type==="number"?"right":void 0),render:_.getRendererValueCrudViewer(O)})),[c]),[u,h]=l.useState(),[T,y]=l.useState();l.useEffect(()=>{E&&h(e=>{if(e)return E.find(s=>s[r]===e[r])})},[E,r,u]);const V=l.useCallback(e=>{var j;const s=m==null?void 0:m(e);return(Array.isArray(s)?(j=s==null?void 0:s.filter(Boolean))!=null&&j.length:s)||R||x||f||a?t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[s,(R||x)&&t.jsxRuntimeExports.jsx(et.default,{value:e,onClick:n=>{y(n[r]),x==null||x(e),b&&h(void 0)}}),f&&t.jsxRuntimeExports.jsx(k.default,{value:e,onClick:n=>f(n)}),B&&t.jsxRuntimeExports.jsx(U.ExportButton,{value:e,onClick:async n=>await B(n)}),v&&t.jsxRuntimeExports.jsx(F.default,{value:e,disabled:d,shouldConfirm:C,loading:d&&e[r]===T,onClick:async n=>{y(n[r]),await v({[r]:n[r]})}}),a&&t.jsxRuntimeExports.jsx(H.default,{value:e,disabled:q,shouldConfirm:I,loading:q&&e[r]===T,onClick:async n=>{y(n[r]),await a({[r]:n[r]})}})]}):void 0},[b,I,C,m,r,q,d,f,x,a,B,v,R,T]),Y=l.useMemo(()=>{let e=typeof o=="string"?u==null?void 0:u[o]:void 0;if(typeof e=="object"){const s=c.find(j=>j.name===o);e=_.getRendererValueCrudViewer(s)(e,u,0)}return e},[o,u,c]);return t.jsxRuntimeExports.jsxs("div",{children:[o&&t.jsxRuntimeExports.jsx(D.Modal,{width:"100%",open:!!u,title:Y??t.jsxRuntimeExports.jsx("div",{children:" "}),footer:t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{}),closable:!0,onCancel:()=>h(void 0),children:!!u&&t.jsxRuntimeExports.jsxs("div",{children:[t.jsxRuntimeExports.jsx(ct.CrudDecListView,{layout:J,descListColumn:G,data:u,fields:c,action:V(u)}),p==null?void 0:p(u)]},u==null?void 0:u[r])}),t.jsxRuntimeExports.jsx(xt.default,{fields:c,...W}),t.jsxRuntimeExports.jsxs(rt.default,{children:[!!g&&t.jsxRuntimeExports.jsx(tt.RefreshButton,{onClick:g}),t.jsxRuntimeExports.jsx(ut.default,{rowClassName:K,className:z,scroll:N??(S?{y:`calc(100vh - ${S})`}:void 0),id:"crud-table",dataSource:E,loading:L,bordered:A,size:w,expandable:$,pagination:i?{total:i.count,onChange:i.setPage,current:i.page,pageSize:i.pageSize}:void 0,columns:R||x||a||m||o?[...M,{title:X("str.action"),dataIndex:"",fixed:"right",width:Q,render:(e,s)=>t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[o&&t.jsxRuntimeExports.jsx(st.default,{value:s,onClick:h}),V(s)]})}]:M})]})]})}exports.default=jt;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../../../../_virtual/jsx-runtime.cjs"),D=require("../../common/button/CloneButtonTable.cjs"),k=require("../../common/button/DeleteButtonTable.cjs"),H=require("../../common/button/ExportButton.cjs"),U=require("../../common/button/HideButtonTable.cjs"),F=require("../../common/button/RefreshButton.cjs"),tt=require("../../common/button/UpdateButtonTable.cjs"),et=require("../../common/button/ViewButtonTable.cjs"),st=require("../../common/layout/VerticalSpace.cjs"),rt=require("../../common/table/table.cjs"),l=require("react"),ut=require("react-i18next"),nt=require("../../../locale/hooks/translation-constants.cjs"),ot=require("../CrudSearchComponent.cjs"),xt=require("./CrudDecListView.cjs"),_=require("./CrudViewerUtil.cjs"),ct=require("../../../../node_modules/antd/es/modal/index.cjs");function jt({idField:r="id",loadingData:L,fields:c,isDeleting:q,isHiding:d,viewable:o=!1,paginateProps:i,onDelete:a,onHide:v,onUpdate:R,data:E=[],extraAction:m,onClickUpdate:x,minusHeight:S,scroll:N,onClickClone:f,className:z,expandable:$,size:w,bordered:A,descListColumn:G,extraView:p,decListLayout:J,scrollToTop:lt,onClickRefresh:g,closeViewOnClickUpdate:b,onExport:B,confirmHiding:C,confirmDeleting:I,rowClassName:K,actionWidth:Q=190,...W}){const{t:X}=ut.useTranslation(nt.TRANSLATION_NAMESPACE),M=l.useMemo(()=>c.map(({hideInTable:e,hidden:s,width:j,name:n,label:Z,halign:P,...O})=>({title:Z,width:j,key:n,dataIndex:n,hidden:e||s,align:P??(O.type==="number"?"right":void 0),render:_.getRendererValueCrudViewer(O)})),[c]),[u,h]=l.useState(),[T,y]=l.useState();l.useEffect(()=>{E&&h(e=>{if(e)return E.find(s=>s[r]===e[r])})},[E,r,u]);const V=l.useCallback(e=>{var j;const s=m==null?void 0:m(e);return(Array.isArray(s)?(j=s==null?void 0:s.filter(Boolean))!=null&&j.length:s)||R||x||f||a?t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[s,(R||x)&&t.jsxRuntimeExports.jsx(tt.default,{value:e,onClick:n=>{y(n[r]),x==null||x(e),b&&h(void 0)}}),f&&t.jsxRuntimeExports.jsx(D.default,{value:e,onClick:n=>f(n)}),B&&t.jsxRuntimeExports.jsx(H.ExportButton,{value:e,onClick:async n=>await B(n)}),v&&t.jsxRuntimeExports.jsx(U.default,{value:e,disabled:d,shouldConfirm:C,loading:d&&e[r]===T,onClick:async n=>{y(n[r]),await v({[r]:n[r]})}}),a&&t.jsxRuntimeExports.jsx(k.default,{value:e,disabled:q,shouldConfirm:I,loading:q&&e[r]===T,onClick:async n=>{y(n[r]),await a({[r]:n[r]})}})]}):void 0},[b,I,C,m,r,q,d,f,x,a,B,v,R,T]),Y=l.useMemo(()=>{let e=typeof o=="string"?u==null?void 0:u[o]:void 0;if(typeof e=="object"){const s=c.find(j=>j.name===o);e=_.getRendererValueCrudViewer(s)(e,u,0)}return e},[o,u,c]);return t.jsxRuntimeExports.jsxs("div",{children:[o&&t.jsxRuntimeExports.jsx(ct.default,{width:"100%",open:!!u,title:Y??t.jsxRuntimeExports.jsx("div",{children:" "}),footer:t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{}),closable:!0,onCancel:()=>h(void 0),children:!!u&&t.jsxRuntimeExports.jsxs("div",{children:[t.jsxRuntimeExports.jsx(xt.CrudDecListView,{layout:J,descListColumn:G,data:u,fields:c,action:V(u)}),p==null?void 0:p(u)]},u==null?void 0:u[r])}),t.jsxRuntimeExports.jsx(ot.default,{fields:c,...W}),t.jsxRuntimeExports.jsxs(st.default,{children:[!!g&&t.jsxRuntimeExports.jsx(F.RefreshButton,{onClick:g}),t.jsxRuntimeExports.jsx(rt.default,{rowClassName:K,className:z,scroll:N??(S?{y:`calc(100vh - ${S})`}:void 0),id:"crud-table",dataSource:E,loading:L,bordered:A,size:w,expandable:$,pagination:i?{total:i.count,onChange:i.setPage,current:i.page,pageSize:i.pageSize}:void 0,columns:R||x||a||m||o?[...M,{title:X("str.action"),dataIndex:"",fixed:"right",width:Q,render:(e,s)=>t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[o&&t.jsxRuntimeExports.jsx(et.default,{value:s,onClick:h}),V(s)]})}]:M})]})]})}exports.default=jt;