@kingteza/crud-component 1.0.64 → 1.0.65

package/crud/view/CrudDecListView.d.ts

@@ -1,14 +1,15 @@
 import { Breakpoint } from 'antd';
-import { default as React } from 'react';
 import { CrudFieldProps } from '../CrudComponent';
+import { CrudActionsProps } from '../actions';
+import { CrudModalProps } from '../modal';
 export type DescListColumn = number | Partial<Record<Breakpoint, number>> | undefined;
-export interface CrudDecListViewProps<T> {
+export interface CrudDecListViewProps<T, FormType = T> extends CrudActionsProps<T, FormType> {
     fields: CrudFieldProps<T>[];
     data: T | undefined;
     className?: string;
     descListColumn?: DescListColumn;
     layout?: "horizontal" | "vertical";
-    action?: React.JSX.Element;
     keepEmptyValues?: boolean;
+    inBuiltModalProps?: CrudModalProps<T, FormType>;
 }
-export declare function CrudDecListView<T>({ className, fields, data, descListColumn, layout, action, keepEmptyValues, }: Readonly<CrudDecListViewProps<T>>): import("react/jsx-runtime").JSX.Element;
+export declare function CrudDecListView<T, FormType = T>({ className, fields, data, descListColumn, layout, keepEmptyValues, inBuiltModalProps, ...crudActionsProps }: Readonly<CrudDecListViewProps<T, FormType>>): import("react/jsx-runtime").JSX.Element;

package/crud/view/CrudDecListView.es.js

@@ -1,45 +1,57 @@
-import { jsx as s, Fragment as g } from "react/jsx-runtime";
+import { jsx as t, Fragment as v } from "react/jsx-runtime";
 import x from "../../common/description/DescList.es.js";
-import { useMemo as C } from "react";
-import { useTranslationLib as F } from "../../locale/index.es.js";
-import { getRendererValueCrudViewer as L } from "./CrudViewerUtil.es.js";
-import V from "../../util/CrudUtil.es.js";
-function h({
+import { useMemo as F } from "react";
+import { useTranslationLib as L } from "../../locale/index.es.js";
+import { getRendererValueCrudViewer as V } from "./CrudViewerUtil.es.js";
+import w from "../../util/CrudUtil.es.js";
+import D from "../actions/index.es.js";
+function _({
   className: u,
-  fields: m,
+  fields: i,
   data: r,
-  descListColumn: n = { xs: 1, md: 3, sm: 2, lg: 4 },
-  layout: f,
-  action: t,
-  keepEmptyValues: p
+  descListColumn: f = { xs: 1, md: 3, sm: 2, lg: 4 },
+  layout: p,
+  keepEmptyValues: c,
+  inBuiltModalProps: b,
+  ...m
 }) {
-  const { t: i } = F(), c = C(() => {
-    const l = m.filter(({ hidden: e, hideInDescList: o }) => !e && !o).map((e, o) => {
-      const b = V.getRealName(e.name);
+  const { t: n } = L(), g = F(() => {
+    const l = i.filter(({ hidden: e, hideInDescList: o }) => !e && !o).map((e, o) => {
+      const C = w.getRealName(e.name);
       return {
         label: e.label,
         noFormatting: !0,
-        value: L(e)(
-          r == null ? void 0 : r[b],
+        value: V(e)(
+          r == null ? void 0 : r[C],
           r,
           o
         )
       };
-    });
-    return t && l.push({ label: i("str.action"), value: t }), l;
-  }, [t, r, m, i]);
-  return r ? /* @__PURE__ */ s(
+    }), s = r ? /* @__PURE__ */ t(
+      D,
+      {
+        data: r,
+        ...m,
+        inBuiltModalProps: b
+      }
+    ) : void 0;
+    return s && l.push({
+      label: n("str.action"),
+      value: s
+    }), l;
+  }, [r, i, n, m]);
+  return r ? /* @__PURE__ */ t(
     x,
     {
-      keepEmptyValues: p,
+      keepEmptyValues: c,
       bordered: !0,
-      column: n,
+      column: f,
       className: u,
-      layout: f,
-      list: c
+      layout: p,
+      list: g
     }
-  ) : /* @__PURE__ */ s(g, {});
+  ) : /* @__PURE__ */ t(v, {});
 }
 export {
-  h as CrudDecListView
+  _ as CrudDecListView
 };

package/crud/view/CrudViewer.cjs.js

@@ -1 +1 @@
-"use strict";const n=require("react/jsx-runtime"),xt=require("antd"),jt=require("@dnd-kit/core"),yt=require("@dnd-kit/modifiers"),ht=require("@dnd-kit/utilities"),V=require("@dnd-kit/sortable"),qt=require("../../common/button/Button.cjs.js"),lt=require("../../common/button/CloneButtonTable.cjs.js"),Ct=require("../../common/button/DeleteButtonTable.cjs.js"),St=require("../../common/button/ExportButton.cjs.js"),Bt=require("../../common/button/HideButtonTable.cjs.js"),It=require("../../common/button/RefreshButton.cjs.js"),Tt=require("../../common/button/UpdateButtonTable.cjs.js"),Rt=require("../../common/button/ViewButtonTable.cjs.js"),Mt=require("../../common/table/table.cjs.js"),u=require("react"),vt=require("../../locale/index.cjs.js"),Vt=require("../CrudSearchComponent.cjs.js"),Et=require("./CrudDecListView.cjs.js"),et=require("./CrudViewerUtil.cjs.js"),Nt=require("@ant-design/icons"),nt=require("../../util/CrudUtil.cjs.js"),Dt=require("../../common/layout/VerticalSpace.cjs.js"),Lt=u.memo(Mt);function Ot({idField:e="id",loadingData:C,fields:f,isDeleting:R,isHiding:S,viewable:i=!1,paginateProps:j,onDelete:y,onHide:M,onUpdate:l,data:B=[],extraAction:I,onClickUpdate:h,minusHeight:L,scroll:J,onClickClone:E,className:K,expandable:Q,size:X,bordered:Y,descListColumn:ot,extraView:O,decListLayout:rt,scrollToTop:_t,onClickRefresh:Z,closeViewOnClickUpdate:A,onExport:z,confirmHiding:P,confirmDeleting:W,rowClassName:w,actionWidth:p=190,draggable:o,...ut}){const{t:H}=vt.useTranslationLib(),U=u.useMemo(()=>f.map(({hideInTable:t,hidden:s,width:c,label:r,halign:T,...v})=>{const D=nt.getRealName(v.name);return{title:r,width:c,key:D,dataIndex:D,hidden:t||s,align:T??(v.type==="number"?"right":void 0),render:et.getRendererValueCrudViewer(v)}}),[f]),[m,N]=u.useState(),[k,_]=u.useState(),[q,a]=u.useState([]);u.useEffect(()=>{B&&a(B)},[B]),u.useEffect(()=>{B&&N(t=>{if(t)return B.find(s=>s[e]===t[e])})},[B,e,m]);const $=u.useCallback(t=>{var c;const s=I==null?void 0:I(t);return(Array.isArray(s)?(c=s==null?void 0:s.filter(Boolean))!=null&&c.length:s)||l||h||E||y?n.jsxs(n.Fragment,{children:[s,(l||h)&&n.jsx(Tt,{value:t,onClick:r=>{_(r[e]),h==null||h(t),A&&N(void 0)}}),E&&n.jsx(lt,{value:t,onClick:r=>E(r)}),z&&n.jsx(St.ExportButton,{value:t,onClick:async r=>await z(r)}),M&&n.jsx(Bt,{value:t,disabled:S,shouldConfirm:P,loading:S&&t[e]===k,onClick:async r=>{_(r[e]),await M({[e]:r[e]})}}),y&&n.jsx(Ct,{value:t,disabled:R,shouldConfirm:W,loading:R&&t[e]===k,onClick:async r=>{_(r[e]),await y({[e]:r[e]})}})]}):void 0},[A,W,P,I,e,R,S,E,h,y,z,M,l,k]),d=u.useCallback(t=>{var r;const{active:s,over:c}=t;if(o!=null&&o.onDragEnd&&(o==null||o.onDragEnd(t)),s.id!==(c==null?void 0:c.id)){const T=q.findIndex(x=>x[e]===s.id),v=q.findIndex(x=>x[e]===(c==null?void 0:c.id)),D=V.arrayMove(q,T,v);a(x=>{const mt=x.findIndex(G=>G[e]===(s==null?void 0:s.id)),ft=x.findIndex(G=>G[e]===(c==null?void 0:c.id));return V.arrayMove(x,mt,ft)}),(r=o==null?void 0:o.onDrag)==null||r.call(o,{newOrder:D.map(x=>x[e])})}},[q,e,o]),ct=u.useMemo(()=>{let t=typeof i=="string"?m==null?void 0:m[i]:void 0;if(typeof t=="object"){const s=f.find(c=>nt.getRealName(c.name)===i);t=et.getRendererValueCrudViewer(s)(t,m,0)}return t},[i,m,f]),b=u.useMemo(()=>({rowClassName:w,className:K,scroll:J??(L?{y:`calc(100vh - ${L})`}:void 0),id:"crud-table",bordered:Y,size:X,expandable:Q}),[w,K,J,L,Y,X,Q]),F=u.useMemo(()=>j?{total:j.count,onChange:j.setPage,current:j.page,pageSize:j.pageSize}:void 0,[j]),g=u.useMemo(()=>{const t=l||h||y||I||i,s=[];return o&&s.push({key:"key",align:"center",width:5,title:o==null?void 0:o.columnLabel,render:()=>n.jsx(zt,{tooltip:o==null?void 0:o.tooltip})}),s.push(...U),t&&t&&s.push({title:H("str.action"),fixed:"right",width:p,render:(c,r)=>n.jsxs(n.Fragment,{children:[i&&n.jsx(Rt,{value:r,onClick:typeof i=="object"?()=>{var T;return(T=i.onClick)==null?void 0:T.call(i,r)}:N}),$(r)]})}),s},[U,l,h,y,I,i,H,p,$]),tt=u.useMemo(()=>q.map(t=>t[e]),[q,e]),it=u.useCallback(()=>{const t=n.jsx(Lt,{...b,dataSource:q,loading:C,components:o?{body:{row:kt}}:void 0,pagination:F,columns:g});return o?n.jsx(jt.DndContext,{modifiers:[yt.restrictToVerticalAxis],onDragEnd:d,children:n.jsx(V.SortableContext,{items:tt,strategy:V.verticalListSortingStrategy,children:t})}):t},[b,q,C,F,g,o,tt,d]);return n.jsxs("div",{children:[typeof i=="boolean"||typeof i=="string"&&n.jsx(xt.Modal,{width:"100%",open:!!m,title:ct??n.jsx("div",{children:" "}),footer:n.jsx(n.Fragment,{}),closable:!0,onCancel:()=>N(void 0),children:!!m&&n.jsxs("div",{children:[n.jsx(Et.CrudDecListView,{layout:rt,descListColumn:ot,data:m,fields:f,action:$(m)}),O==null?void 0:O(m)]},m==null?void 0:m[e])}),n.jsx(Vt,{fields:f,...ut}),n.jsxs(Dt,{children:[!!Z&&n.jsx(It.RefreshButton,{onClick:Z}),it()]})]})}const st=u.createContext({}),zt=({tooltip:e})=>{const{setActivatorNodeRef:C,listeners:f}=u.useContext(st);return n.jsx(qt,{type:"text",size:"small",tooltip:e,icon:n.jsx(Nt.HolderOutlined,{}),style:{cursor:"move",border:"none"},ref:C,...f})},kt=e=>{const{attributes:C,listeners:f,setNodeRef:R,setActivatorNodeRef:S,transform:i,transition:j,isDragging:y}=V.useSortable({id:e["data-row-key"]}),M={...e.style,transform:ht.CSS.Translate.toString(i),transition:j,...y?{position:"relative",zIndex:9999}:{}},l=u.useMemo(()=>({setActivatorNodeRef:S,listeners:f}),[S,f]);return n.jsx(st.Provider,{value:l,children:n.jsx("tr",{...e,ref:R,style:M,...C})})};module.exports=Ot;
+"use strict";const e=require("react/jsx-runtime"),xt=require("antd"),ft=require("@dnd-kit/core"),jt=require("@dnd-kit/modifiers"),yt=require("@dnd-kit/utilities"),d=require("@dnd-kit/sortable"),ht=require("../../common/button/Button.cjs.js"),qt=require("../../common/button/RefreshButton.cjs.js"),Ct=require("../../common/button/ViewButtonTable.cjs.js"),St=require("../actions/index.cjs.js"),It=require("../../common/table/table.cjs.js"),r=require("react"),lt=require("../../locale/index.cjs.js"),Rt=require("../CrudSearchComponent.cjs.js"),Mt=require("./CrudDecListView.cjs.js"),tt=require("./CrudViewerUtil.cjs.js"),dt=require("@ant-design/icons"),et=require("../../util/CrudUtil.cjs.js"),Tt=require("../../common/layout/VerticalSpace.cjs.js"),Bt=r.memo(It);function Dt({idField:n="id",loadingData:h,fields:m,isDeleting:T,isHiding:l,viewable:c=!1,paginateProps:j,onDelete:q,onHide:B,onUpdate:C,data:S=[],extraAction:D,onClickUpdate:V,minusHeight:E,scroll:k,onClickClone:v,className:z,expandable:$,size:p,bordered:A,descListColumn:ot,extraView:L,decListLayout:st,scrollToTop:Et,onClickRefresh:_,closeViewOnClickUpdate:G,onExport:J,confirmHiding:K,confirmDeleting:Q,rowClassName:X,actionWidth:Y=190,draggable:t,...rt}){const{t:Z}=lt.useTranslationLib(),P=r.useMemo(()=>m.map(({hideInTable:o,hidden:s,width:u,label:x,halign:I,...M})=>{const N=et.getRealName(M.name);return{title:x,width:u,key:N,dataIndex:N,hidden:o||s,align:I??(M.type==="number"?"right":void 0),render:tt.getRendererValueCrudViewer(M)}}),[m]),[i,R]=r.useState(),[W,H]=r.useState(),[y,U]=r.useState([]);r.useEffect(()=>{S&&U(S)},[S]),r.useEffect(()=>{S&&R(o=>{if(o)return S.find(s=>s[n]===o[n])})},[S,n,i]);const w=r.useCallback(o=>{var x;const{active:s,over:u}=o;if(t!=null&&t.onDragEnd&&(t==null||t.onDragEnd(o)),s.id!==(u==null?void 0:u.id)){const I=y.findIndex(f=>f[n]===s.id),M=y.findIndex(f=>f[n]===(u==null?void 0:u.id)),N=d.arrayMove(y,I,M);U(f=>{const it=f.findIndex(O=>O[n]===(s==null?void 0:s.id)),mt=f.findIndex(O=>O[n]===(u==null?void 0:u.id));return d.arrayMove(f,it,mt)}),(x=t==null?void 0:t.onDrag)==null||x.call(t,{newOrder:N.map(f=>f[n])})}},[y,n,t]),ct=r.useMemo(()=>{let o=typeof c=="string"?i==null?void 0:i[c]:void 0;if(typeof o=="object"){const s=m.find(u=>et.getRealName(u.name)===c);o=tt.getRendererValueCrudViewer(s)(o,i,0)}return o},[c,i,m]),a=r.useMemo(()=>({rowClassName:X,className:z,scroll:k??(E?{y:`calc(100vh - ${E})`}:void 0),id:"crud-table",bordered:A,size:p,expandable:$}),[X,z,k,E,A,p,$]),F=r.useMemo(()=>j?{total:j.count,onChange:j.setPage,current:j.page,pageSize:j.pageSize}:void 0,[j]),b=r.useMemo(()=>{const o=C||V||q||D||c,s=[];return t&&s.push({key:"key",align:"center",width:5,title:t==null?void 0:t.columnLabel,render:()=>e.jsx(Vt,{tooltip:t==null?void 0:t.tooltip})}),s.push(...P),o&&o&&s.push({title:Z("str.action"),fixed:"right",width:Y,render:(u,x)=>e.jsxs(e.Fragment,{children:[c&&e.jsx(Ct,{value:x,onClick:typeof c=="object"?()=>{var I;return(I=c.onClick)==null?void 0:I.call(c,x)}:R}),e.jsx(St,{data:x,idField:n,extraAction:D,onUpdate:C,onClickUpdate:V,onClickClone:v,onDelete:q,onHide:B,onExport:J,isHiding:l,isDeleting:T,confirmHiding:K,confirmDeleting:Q,closeViewOnClickUpdate:G,recentUpdateOrDeleteId:W,setRecentUpdateOrDeleteId:H,setOpenView:R})]})}),s},[P,C,V,q,D,c,Z,Y]),g=r.useMemo(()=>y.map(o=>o[n]),[y,n]),ut=r.useCallback(()=>{const o=e.jsx(Bt,{...a,dataSource:y,loading:h,components:t?{body:{row:Nt}}:void 0,pagination:F,columns:b});return t?e.jsx(ft.DndContext,{modifiers:[jt.restrictToVerticalAxis],onDragEnd:w,children:e.jsx(d.SortableContext,{items:g,strategy:d.verticalListSortingStrategy,children:o})}):o},[a,y,h,F,b,t,g,w]);return e.jsxs("div",{children:[typeof c=="boolean"||typeof c=="string"&&e.jsx(xt.Modal,{width:"100%",open:!!i,title:ct??e.jsx("div",{children:" "}),footer:e.jsx(e.Fragment,{}),closable:!0,onCancel:()=>R(void 0),children:!!i&&e.jsxs("div",{children:[e.jsx(Mt.CrudDecListView,{layout:st,descListColumn:ot,data:i,fields:m,idField:n,extraAction:D,onUpdate:C,onClickUpdate:V,onClickClone:v,onDelete:q,onHide:B,onExport:J,isHiding:l,isDeleting:T,confirmHiding:K,confirmDeleting:Q,closeViewOnClickUpdate:G,recentUpdateOrDeleteId:W,setRecentUpdateOrDeleteId:H,setOpenView:R}),L==null?void 0:L(i)]},i==null?void 0:i[n])}),e.jsx(Rt,{fields:m,...rt}),e.jsxs(Tt,{children:[!!_&&e.jsx(qt.RefreshButton,{onClick:_}),ut()]})]})}const nt=r.createContext({}),Vt=({tooltip:n})=>{const{setActivatorNodeRef:h,listeners:m}=r.useContext(nt);return e.jsx(ht,{type:"text",size:"small",tooltip:n,icon:e.jsx(dt.HolderOutlined,{}),style:{cursor:"move",border:"none"},ref:h,...m})},Nt=n=>{const{attributes:h,listeners:m,setNodeRef:T,setActivatorNodeRef:l,transform:c,transition:j,isDragging:q}=d.useSortable({id:n["data-row-key"]}),B={...n.style,transform:yt.CSS.Translate.toString(c),transition:j,...q?{position:"relative",zIndex:9999}:{}},C=r.useMemo(()=>({setActivatorNodeRef:l,listeners:m}),[l,m]);return e.jsx(nt.Provider,{value:C,children:e.jsx("tr",{...n,ref:T,style:B,...h})})};module.exports=Dt;

package/crud/view/CrudViewer.d.ts

@@ -2,8 +2,8 @@ import { SizeType } from 'antd/es/config-provider/SizeContext';
 import { ExpandableConfig } from 'antd/es/table/interface';
 import { DragEndEvent } from '@dnd-kit/core';
 import { TableProps } from 'antd/lib';
-import { default as React, ReactElement } from 'react';
-import { default as IdProps } from '../../types/Id';
+import { CrudActionsProps } from '../actions';
+import { default as React } from 'react';
 import { CrudFieldProps, CrudPaginateProps } from '../CrudComponent';
 import { CrudSearchComponentProps } from '../CrudSearchComponent';
 import { DescListColumn } from './CrudDecListView';
@@ -23,26 +23,13 @@ export type CrudViewerProps<T, FormType> = {
     decListLayout?: "horizontal" | "vertical";
     viewable?: CrudViewableProps<T>;
     paginateProps?: CrudPaginateProps;
-    onDelete?: (id: any) => Promise<any>;
-    confirmDeleting?: boolean;
-    confirmHiding?: boolean;
-    onHide?: (id: any) => Promise<any>;
-    onUpdate?: (t: FormType & IdProps) => Promise<any>;
-    onExport?: (t: T) => Promise<any>;
     data: T[] | undefined;
-    extraAction?: (t: T) => ReactElement | undefined | ReactElement[];
-    onClickUpdate?: (t: T) => void;
-    closeViewOnClickUpdate?: boolean;
-    isHiding?: boolean;
-    isDeleting?: boolean;
-    idField?: string;
     loadingData?: boolean;
     minusHeight?: string;
     scroll?: TableProps<T>["scroll"];
     className?: string;
     bordered?: boolean;
     size?: SizeType;
-    onClickClone?: (t: T) => Promise<any>;
     onClickRefresh?: () => void;
     expandable?: ExpandableConfig<T>;
     descListColumn?: DescListColumn;
@@ -51,6 +38,6 @@ export type CrudViewerProps<T, FormType> = {
     rowClassName?: TableProps<T>["rowClassName"];
     actionWidth?: string | number;
     draggable?: CrudDragableProps<T>;
-} & CrudSearchComponentProps<T, FormType>;
+} & CrudActionsProps<T, FormType> & CrudSearchComponentProps<T, FormType>;
 declare function CrudViewer<T, FormType = T>({ idField, loadingData, fields, isDeleting, isHiding, viewable, paginateProps, onDelete, onHide, onUpdate, data, extraAction, onClickUpdate, minusHeight, scroll, onClickClone, className, expandable, size, bordered, descListColumn, extraView, decListLayout, scrollToTop, onClickRefresh, closeViewOnClickUpdate, onExport, confirmHiding, confirmDeleting, rowClassName, actionWidth, draggable, ...props }: CrudViewerProps<T, FormType>): import("react/jsx-runtime").JSX.Element;
 export default CrudViewer;