@kingteza/crud-component 1.0.4 → 1.0.5

package/dist/src/components/crud/CrudReportComponent.cjs

@@ -0,0 +1,4 @@
+"use strict";const t=require("../../../_virtual/jsx-runtime.cjs"),r=require("antd"),a=require("react"),y=require("./CrudField.cjs"),H=require("./view/CrudViewer.cjs"),I=require("../common/button/Button.cjs"),J=require("../common/button/PrintButton.cjs"),K=require("../common/report/SelectFieldInReport.cjs"),M=require("../common/select/SelectComponent.cjs"),v=require("./view/CrudViewerUtil.cjs"),Q=require("../../../node_modules/@ant-design/icons/es/icons/FileExcelOutlined.cjs"),V={lg:6,md:8,sm:12,xs:24},W={lg:12,md:16,sm:24,xs:24};function X({fields:u,data:d,idField:A,loadingData:p,onSubmit:S,paginateProps:L,size:G,onClickPrint:f,onClickExcelExport:R,minusHeight:O,extraSearchFields:g,searchOnMount:E,summary:U}){const{searchable:_,selectable:m,sortable:B,defaultSort:c}=a.useMemo(()=>{var j,x,C,N,T;const e=[],s=[],l=[];let n;for(const o of u.filter(D=>!D.hidden))o.type==="image"||!o.report||((j=o.report)!=null&&j.searchable&&e.push(o),(x=o.report)!=null&&x.sortable&&(s.push(o),!n&&((C=o.report)!=null&&C.defaultSort)&&(n=o)),o.hideInTable||l.push({id:o.name,label:o.label,lock:(N=o.report)==null?void 0:N.lock,alreadySelected:(T=o.report)==null?void 0:T.alreadySelected}));return{defaultSort:n,searchable:e,sortable:s,selectable:l}},[u]),[b,F]=a.useState([]),h=a.useCallback(async({sortBy:e,sortByType:s,showFields:l=[],...n})=>{const j=[];e&&j.push({field:e,sort:s??"DESC"}),F(u.filter(x=>l.includes(x.name)).map(x=>({...x,hideInTable:!1}))),S({showFields:l,sortBy:j,...n})},[u,S]),[i]=r.Form.useForm(),[w,$]=a.useState(!1),[q,z]=a.useState(!0);return a.useEffect(()=>{if(E&&q){const e=setTimeout(()=>{i.validateFields().then(s=>{h(s)}),z(!1)},200);return()=>clearTimeout(e)}},[h,i,q,E]),a.useEffect(()=>{var s,l,n;!i.getFieldValue("sortBy")&&c&&(console.log((s=c.report)==null?void 0:s.defaultSort),i.setFieldsValue({sortBy:c.name,sortByType:typeof((l=c.report)==null?void 0:l.defaultSort)=="string"?(n=c.report)==null?void 0:n.defaultSort:"ASC"}))},[c,i]),a.useEffect(()=>{if(w){const e=m.filter(s=>s.alreadySelected).map(s=>s.id);F(u.filter(s=>e.includes(s.name)).map(s=>({...s,hideInTable:!1}))),$(!1)}},[u,w,m]),t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs(r.Space,{className:"w-100",direction:"vertical",children:[t.jsxRuntimeExports.jsxs(r.Form,{form:i,layout:"vertical",onFinish:h,children:[t.jsxRuntimeExports.jsxs(r.Row,{gutter:[8,8],children:[_.map(e=>{var s,l,n;return t.jsxRuntimeExports.jsx(r.Col,{...e.grid??V,style:{alignSelf:"end"},children:(s=e.report)!=null&&s.customRender?e.report.customRender(i):e.type==="date"?t.jsxRuntimeExports.jsx(y.default,{...e,type:"date",range:(l=e.report)==null?void 0:l.range,required:!!((n=e.report)!=null&&n.required),readonly:!1,fieldClassName:"mb-0"}):e.type==="select"?t.jsxRuntimeExports.jsx(y.default,{...e,type:"select",multiple:!0,required:!1,readonly:!1,fieldClassName:"mb-0"}):t.jsxRuntimeExports.jsx(y.default,{...e,readonly:!1,required:!1,fieldClassName:"mb-0"})},e.name)}),!!(m!=null&&m.length)&&t.jsxRuntimeExports.jsx(r.Col,{...W,children:t.jsxRuntimeExports.jsx(K.SelectFieldInReport,{items:m,name:"showFields",mode:"multiple",label:"Show Fields",className:"mb-0"})}),!!B.length&&t.jsxRuntimeExports.jsx(r.Col,{...V,children:t.jsxRuntimeExports.jsx(M,{label:"Sort By",name:"sortBy",items:B.map(e=>({id:e.name,label:e.label})),nameFieldInArray:"label",fieldId:"id",className:"mb-0",dropdownRender:e=>t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[e,t.jsxRuntimeExports.jsx(r.Form.Item,{name:"sortByType",noStyle:!0,className:"mt-3",children:t.jsxRuntimeExports.jsx(r.Radio.Group,{className:"w-100",defaultValue:"DESC",optionType:"button",children:t.jsxRuntimeExports.jsxs(r.Row,{children:[t.jsxRuntimeExports.jsx(r.Col,{xs:12,children:t.jsxRuntimeExports.jsx(r.Radio,{className:"w-100",style:{borderTopRightRadius:0,borderBottomRightRadius:0},value:"ASC",children:"Ascending"})}),t.jsxRuntimeExports.jsx(r.Col,{xs:12,children:t.jsxRuntimeExports.jsx(r.Radio,{className:"w-100",style:{borderTopLeftRadius:0,borderBottomLeftRadius:0},value:"DESC",children:"Descending"})})]})})})]})})}),g?g(i):null]}),t.jsxRuntimeExports.jsx(I,{className:"mt-3",type:"primary",block:!0,htmlType:"submit",disabled:p,children:"Submit"})]}),t.jsxRuntimeExports.jsxs(r.Space,{children:[!!f&&t.jsxRuntimeExports.jsx(J.PrintButton,{disabled:p||!d.length,onClick:()=>f==null?void 0:f({tableId:"#crud-table table",data:d,fields:b.map(e=>({...e,render:v.getRendererValueCrudViewer(e)}))})}),!!R&&t.jsxRuntimeExports.jsx(I,{disabled:p||!d.length,onClick:()=>R==null?void 0:R({tableId:"#crud-table table",data:d,fields:b.map(e=>({...e,render:v.getRendererValueCrudViewer(e)}))}),icon:t.jsxRuntimeExports.jsx(Q,{}),className:`group
+                ${p||!d.length?"":"!bg-green-700 hover:!bg-green-600 !text-white !border-green-700 hover:!border-green-600"}
+                
+              `,children:"Excel"})]}),U,t.jsxRuntimeExports.jsx(H,{minusHeight:O,data:d,size:G,fields:b,idField:A,loadingData:p,paginateProps:L,viewable:!1})]})})}module.exports=X;

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

@@ -0,0 +1,255 @@
+import { j as r } from "../../../_virtual/jsx-runtime.js";
+import { Form as j, Space as L, Row as G, Col as f, Radio as S } from "antd";
+import { useMemo as X, useState as x, useCallback as Y, useEffect as B } from "react";
+import R from "./CrudField.js";
+import Z from "./view/CrudViewer.js";
+import _ from "../common/button/Button.js";
+import { PrintButton as k } from "../common/button/PrintButton.js";
+import { SelectFieldInReport as E } from "../common/report/SelectFieldInReport.js";
+import P from "../common/select/SelectComponent.js";
+import { getRendererValueCrudViewer as $ } from "./view/CrudViewerUtil.js";
+import ee from "../../../node_modules/@ant-design/icons/es/icons/FileExcelOutlined.js";
+const z = { lg: 6, md: 8, sm: 12, xs: 24 }, re = { lg: 12, md: 16, sm: 24, xs: 24 };
+function pe({
+  fields: n,
+  data: d,
+  idField: D,
+  loadingData: c,
+  onSubmit: w,
+  paginateProps: H,
+  size: J,
+  onClickPrint: b,
+  onClickExcelExport: h,
+  minusHeight: K,
+  extraSearchFields: F,
+  searchOnMount: N,
+  summary: M
+}) {
+  const { searchable: O, selectable: i, sortable: T, defaultSort: m } = X(() => {
+    var p, u, V, q, A;
+    const e = [], t = [], l = [];
+    let o;
+    for (const s of n.filter((W) => !W.hidden))
+      s.type === "image" || !s.report || ((p = s.report) != null && p.searchable && e.push(s), (u = s.report) != null && u.sortable && (t.push(s), !o && ((V = s.report) != null && V.defaultSort) && (o = s)), s.hideInTable || l.push({
+        id: s.name,
+        label: s.label,
+        lock: (q = s.report) == null ? void 0 : q.lock,
+        alreadySelected: (A = s.report) == null ? void 0 : A.alreadySelected
+      }));
+    return {
+      defaultSort: o,
+      searchable: e,
+      sortable: t,
+      selectable: l
+    };
+  }, [n]), [y, I] = x(
+    []
+  ), g = Y(
+    async ({
+      sortBy: e,
+      sortByType: t,
+      showFields: l = [],
+      ...o
+    }) => {
+      const p = [];
+      e && p.push({
+        field: e,
+        sort: t ?? "DESC"
+      }), I(
+        n.filter((u) => l.includes(u.name)).map((u) => ({ ...u, hideInTable: !1 }))
+      ), w({ showFields: l, sortBy: p, ...o });
+    },
+    [n, w]
+  ), [a] = j.useForm(), [v, Q] = x(!1), [C, U] = x(!0);
+  return B(() => {
+    if (N && C) {
+      const e = setTimeout(() => {
+        a.validateFields().then((t) => {
+          g(t);
+        }), U(!1);
+      }, 200);
+      return () => clearTimeout(e);
+    }
+  }, [g, a, C, N]), B(() => {
+    var t, l, o;
+    !a.getFieldValue("sortBy") && m && (console.log((t = m.report) == null ? void 0 : t.defaultSort), a.setFieldsValue({
+      sortBy: m.name,
+      sortByType: typeof ((l = m.report) == null ? void 0 : l.defaultSort) == "string" ? (o = m.report) == null ? void 0 : o.defaultSort : "ASC"
+    }));
+  }, [m, a]), B(() => {
+    if (v) {
+      const e = i.filter((t) => t.alreadySelected).map((t) => t.id);
+      I(
+        n.filter((t) => e.includes(t.name)).map((t) => ({ ...t, hideInTable: !1 }))
+      ), Q(!1);
+    }
+  }, [n, v, i]), /* @__PURE__ */ r.jsx(r.Fragment, { children: /* @__PURE__ */ r.jsxs(L, { className: "w-100", direction: "vertical", children: [
+    /* @__PURE__ */ r.jsxs(j, { form: a, layout: "vertical", onFinish: g, children: [
+      /* @__PURE__ */ r.jsxs(G, { gutter: [8, 8], children: [
+        O.map((e) => {
+          var t, l, o;
+          return /* @__PURE__ */ r.jsx(
+            f,
+            {
+              ...e.grid ?? z,
+              style: { alignSelf: "end" },
+              children: (t = e.report) != null && t.customRender ? e.report.customRender(a) : e.type === "date" ? /* @__PURE__ */ r.jsx(
+                R,
+                {
+                  ...e,
+                  type: "date",
+                  range: (l = e.report) == null ? void 0 : l.range,
+                  required: !!((o = e.report) != null && o.required),
+                  readonly: !1,
+                  fieldClassName: "mb-0"
+                }
+              ) : e.type === "select" ? /* @__PURE__ */ r.jsx(
+                R,
+                {
+                  ...e,
+                  type: "select",
+                  multiple: !0,
+                  required: !1,
+                  readonly: !1,
+                  fieldClassName: "mb-0"
+                }
+              ) : /* @__PURE__ */ r.jsx(
+                R,
+                {
+                  ...e,
+                  readonly: !1,
+                  required: !1,
+                  fieldClassName: "mb-0"
+                }
+              )
+            },
+            e.name
+          );
+        }),
+        !!(i != null && i.length) && /* @__PURE__ */ r.jsx(f, { ...re, children: /* @__PURE__ */ r.jsx(
+          E,
+          {
+            items: i,
+            name: "showFields",
+            mode: "multiple",
+            label: "Show Fields",
+            className: "mb-0"
+          }
+        ) }),
+        !!T.length && /* @__PURE__ */ r.jsx(f, { ...z, children: /* @__PURE__ */ r.jsx(
+          P,
+          {
+            label: "Sort By",
+            name: "sortBy",
+            items: T.map((e) => ({ id: e.name, label: e.label })),
+            nameFieldInArray: "label",
+            fieldId: "id",
+            className: "mb-0",
+            dropdownRender: (e) => /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+              e,
+              /* @__PURE__ */ r.jsx(j.Item, { name: "sortByType", noStyle: !0, className: "mt-3", children: /* @__PURE__ */ r.jsx(
+                S.Group,
+                {
+                  className: "w-100",
+                  defaultValue: "DESC",
+                  optionType: "button",
+                  children: /* @__PURE__ */ r.jsxs(G, { children: [
+                    /* @__PURE__ */ r.jsx(f, { xs: 12, children: /* @__PURE__ */ r.jsx(
+                      S,
+                      {
+                        className: "w-100",
+                        style: {
+                          borderTopRightRadius: 0,
+                          borderBottomRightRadius: 0
+                        },
+                        value: "ASC",
+                        children: "Ascending"
+                      }
+                    ) }),
+                    /* @__PURE__ */ r.jsx(f, { xs: 12, children: /* @__PURE__ */ r.jsx(
+                      S,
+                      {
+                        className: "w-100",
+                        style: {
+                          borderTopLeftRadius: 0,
+                          borderBottomLeftRadius: 0
+                        },
+                        value: "DESC",
+                        children: "Descending"
+                      }
+                    ) })
+                  ] })
+                }
+              ) })
+            ] })
+          }
+        ) }),
+        F ? F(a) : null
+      ] }),
+      /* @__PURE__ */ r.jsx(
+        _,
+        {
+          className: "mt-3",
+          type: "primary",
+          block: !0,
+          htmlType: "submit",
+          disabled: c,
+          children: "Submit"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ r.jsxs(L, { children: [
+      !!b && /* @__PURE__ */ r.jsx(
+        k,
+        {
+          disabled: c || !d.length,
+          onClick: () => b == null ? void 0 : b({
+            tableId: "#crud-table table",
+            data: d,
+            fields: y.map((e) => ({
+              ...e,
+              render: $(e)
+            }))
+          })
+        }
+      ),
+      !!h && /* @__PURE__ */ r.jsx(
+        _,
+        {
+          disabled: c || !d.length,
+          onClick: () => h == null ? void 0 : h({
+            tableId: "#crud-table table",
+            data: d,
+            fields: y.map((e) => ({
+              ...e,
+              render: $(e)
+            }))
+          }),
+          icon: /* @__PURE__ */ r.jsx(ee, {}),
+          className: `group
+                ${c || !d.length ? "" : "!bg-green-700 hover:!bg-green-600 !text-white !border-green-700 hover:!border-green-600"}
+                
+              `,
+          children: "Excel"
+        }
+      )
+    ] }),
+    M,
+    /* @__PURE__ */ r.jsx(
+      Z,
+      {
+        minusHeight: K,
+        data: d,
+        size: J,
+        fields: y,
+        idField: D,
+        loadingData: c,
+        paginateProps: H,
+        viewable: !1
+      }
+    )
+  ] }) });
+}
+export {
+  pe as default
+};

package/dist/src/components/crud/CrudSearchComponent.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("../../../_virtual/jsx-runtime.cjs"),o=require("react"),i=require("antd"),y=require("./CrudField.cjs"),q=require("../common/button/Button.cjs"),w=require("../../../node_modules/@ant-design/icons/es/icons/SearchOutlined.cjs");function M({searchFields:t=[],fields:m,searchOnChange:j,onSearch:x,searchDefaultValues:b,searchFieldsCustomColumnProps:g}){const R=o.useMemo(()=>t.map(n=>typeof n=="string"?{...m.find(E=>n===E.name),required:!1}:{...m.find(l=>(n==null?void 0:n.name)===l.name),...n}).filter(n=>n&&!(n!=null&&n.hidden)),[t,m]),p=o.useMemo(()=>t.length===1?{field:22,button:2}:t.length===2?{field:11,button:2}:t.length===3?{field:6,button:6}:t.length===4?{field:5,button:4}:t.length===5?{field:4,button:4}:{field:4,button:4},[t.length]),d=o.useMemo(()=>t.length===1?{field:22,button:2}:t.length===2?{field:11,button:2}:t.length===3?{field:6,button:6}:t.length===4?{field:5,button:4}:t.length===5?{field:4,button:4}:{field:4,button:4},[t.length]),s=o.useMemo(()=>t.length===1?{field:21,button:3}:t.length===2?{field:11,button:2}:t.length===3?{field:24,button:24}:t.length===4?{field:5,button:4}:t.length===5?{field:4,button:4}:{field:4,button:4},[t.length]),[u]=i.Form.useForm(),r=o.useCallback(async n=>{if((n||j)&&x){const f=await u.validateFields();x(f)}},[u,x,j]);return o.useEffect(()=>{b&&(u.setFieldsValue(b),r(!0))},[u,b]),t!=null&&t.length?e.jsxRuntimeExports.jsx(i.Form,{form:u,onFinish:()=>r(!0),layout:"vertical",className:"mb-2",onChange:()=>r(!1),children:e.jsxRuntimeExports.jsxs(i.Row,{gutter:[4,8],className:"w-100",children:[R.map((n,f)=>{const l=(g==null?void 0:g[f])??{md:p.field,sm:d.field,xs:s.field};return o.createElement(i.Col,{...l,key:`search_field_${String(n.name)}`,className:"align-self-end"},e.jsxRuntimeExports.jsx(y.default,{...n,readonly:!1,fieldClassName:"mb-0"}))}),e.jsxRuntimeExports.jsx(i.Col,{md:p.button,sm:d.button,xs:s.button,style:{alignSelf:"end"},children:e.jsxRuntimeExports.jsx(q,{type:"primary",htmlType:"submit",block:!0,icon:e.jsxRuntimeExports.jsx(w,{})})})]})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})}module.exports=M;

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

@@ -0,0 +1,95 @@
+import { j as o } from "../../../_virtual/jsx-runtime.js";
+import { useMemo as l, useCallback as E, useEffect as R, createElement as a } from "react";
+import { Form as y, Row as v, Col as w } from "antd";
+import _ from "./CrudField.js";
+import q from "../common/button/Button.js";
+import B from "../../../node_modules/@ant-design/icons/es/icons/SearchOutlined.js";
+function A({
+  searchFields: t = [],
+  fields: e,
+  searchOnChange: r,
+  onSearch: b,
+  searchDefaultValues: g,
+  searchFieldsCustomColumnProps: i
+}) {
+  const N = l(
+    () => t.map((n) => typeof n == "string" ? {
+      ...e.find((k) => n === k.name),
+      required: !1
+    } : {
+      ...e.find(
+        (u) => (n == null ? void 0 : n.name) === u.name
+      ),
+      ...n
+    }).filter((n) => n && !(n != null && n.hidden)),
+    [t, e]
+  ), x = l(
+    () => t.length === 1 ? { field: 22, button: 2 } : t.length === 2 ? { field: 11, button: 2 } : t.length === 3 ? { field: 6, button: 6 } : t.length === 4 ? { field: 5, button: 4 } : t.length === 5 ? { field: 4, button: 4 } : { field: 4, button: 4 },
+    [t.length]
+  ), d = l(
+    () => t.length === 1 ? { field: 22, button: 2 } : t.length === 2 ? { field: 11, button: 2 } : t.length === 3 ? { field: 6, button: 6 } : t.length === 4 ? { field: 5, button: 4 } : t.length === 5 ? { field: 4, button: 4 } : { field: 4, button: 4 },
+    [t.length]
+  ), j = l(
+    () => t.length === 1 ? { field: 21, button: 3 } : t.length === 2 ? { field: 11, button: 2 } : t.length === 3 ? { field: 24, button: 24 } : t.length === 4 ? { field: 5, button: 4 } : t.length === 5 ? { field: 4, button: 4 } : { field: 4, button: 4 },
+    [t.length]
+  ), [f] = y.useForm(), p = E(
+    async (n) => {
+      if ((n || r) && b) {
+        const m = await f.validateFields();
+        b(m);
+      }
+    },
+    [f, b, r]
+  );
+  return R(() => {
+    g && (f.setFieldsValue(g), p(!0));
+  }, [f, g]), t != null && t.length ? /* @__PURE__ */ o.jsx(
+    y,
+    {
+      form: f,
+      onFinish: () => p(!0),
+      layout: "vertical",
+      className: "mb-2",
+      onChange: () => p(!1),
+      children: /* @__PURE__ */ o.jsxs(v, { gutter: [4, 8], className: "w-100", children: [
+        N.map((n, m) => {
+          const u = (i == null ? void 0 : i[m]) ?? {
+            md: x.field,
+            sm: d.field,
+            xs: j.field
+          };
+          return /* @__PURE__ */ a(
+            w,
+            {
+              ...u,
+              key: `search_field_${String(n.name)}`,
+              className: "align-self-end"
+            },
+            /* @__PURE__ */ o.jsx(_, { ...n, readonly: !1, fieldClassName: "mb-0" })
+          );
+        }),
+        /* @__PURE__ */ o.jsx(
+          w,
+          {
+            md: x.button,
+            sm: d.button,
+            xs: j.button,
+            style: { alignSelf: "end" },
+            children: /* @__PURE__ */ o.jsx(
+              q,
+              {
+                type: "primary",
+                htmlType: "submit",
+                block: !0,
+                icon: /* @__PURE__ */ o.jsx(B, {})
+              }
+            )
+          }
+        )
+      ] })
+    }
+  ) : /* @__PURE__ */ o.jsx(o.Fragment, {});
+}
+export {
+  A as default
+};

package/dist/src/components/crud/FileCrudField.cjs

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

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

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

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

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