@kingteza/crud-component 1.0.62 → 1.0.64

package/crud/CrudComponent.d.ts

@@ -2,12 +2,12 @@ import { ColorPickerProps } from 'antd';
 import { Rule } from 'antd/es/form';
 import { FormInstance } from 'antd/lib';
 import { Dayjs } from 'dayjs';
-import { default as React, ReactElement } from 'react';
+import { default as React, ReactElement, ReactNode } from 'react';
 import { CrudSearchComponentProps } from './CrudSearchComponent';
 import { FileCrudField } from './FileCrudField';
 import { ImageCrudField } from './ImageCrudField';
 import { CrudImportProps } from './import/CrudImportComponent';
-import { CrudDragableProps } from './view/CrudViewer';
+import { CrudDragableProps, CrudViewableProps } from './view/CrudViewer';
 import { SelectTagRenderProps } from '../common/select/SelectComponent';
 import { default as IdProps } from '../types/Id';
 import { TextAreaBasedFieldProps } from './CrudTextAreaComponent';
@@ -60,7 +60,7 @@ export type CrudFieldGrid = {
     xl?: number;
     xxl?: number;
 };
-export interface SelectCrudField<T, ItemType extends SelectFieldItem = SelectFieldItem> extends Omit<InitialCrudField<T>, "name"> {
+export interface SelectCrudField<T, ItemType extends SelectFieldItem = SelectFieldItem> extends Omit<InitialCrudField<T>, "name">, AddonFieldProps {
     name: InitialCrudField<T>["name"] | {
         name: keyof T | (string | number)[];
         upsertFieldName: keyof T | (string | number)[];
@@ -118,12 +118,16 @@ export interface EnumCrudField<T> extends InitialCrudField<T> {
     onChange?: (value: T[keyof T], form: FormInstance<T>) => void;
     onSearch?: (keyword: string, form: FormInstance<T>) => void;
 }
+export type AddonFieldProps = {
+    addonAfter?: ReactNode;
+    addonBefore?: ReactNode;
+};
 export interface ObjectCrudField<T> extends InitialCrudField<T> {
     type: "object";
     render: (value: any, obj: T, index: number) => any;
     translation?: object;
 }
-export interface TextBasedFieldProps<T> extends InitialCrudField<T> {
+export interface TextBasedFieldProps<T> extends InitialCrudField<T>, AddonFieldProps {
     placeholder?: string;
     type: "text" | "time" | "email" | "password";
     onChange?: (value: string, form: FormInstance<T>) => void;
@@ -136,10 +140,12 @@ export interface CheckboxBasedFieldProps<T> extends InitialCrudField<T> {
     type: "checkbox";
     onChange?: (value: boolean, form: FormInstance<T>) => void;
 }
-export interface NumberBasedFieldProps<T> extends InitialCrudField<T> {
+export interface NumberBasedFieldProps<T> extends InitialCrudField<T>, AddonFieldProps {
     type: "number";
     placeholder?: string;
     allowMinus?: boolean;
+    min?: number;
+    max?: number;
     /**
      * If it is number field making this true will convert the value to comma separated number field
      */
@@ -188,6 +194,7 @@ export type FormBuilderFunc0<T> = (name: keyof T, options?: GetFormFieldOptions)
 export type FormBuilderFunc<T> = (i: FormBuilderFunc0<T>, otherUtils: {
     isAnyFieldHidden: (...name: Array<keyof T>) => boolean;
     isAllFieldsHidden: (...name: Array<keyof T>) => boolean;
+    purpose?: CrudPurpose;
 }) => ReactElement;
 export type CrudFieldProps<T> = SelectCrudField<T> | TextBasedFieldProps<T> | TextAreaBasedFieldProps<T> | ImageCrudField<T> | EnumCrudField<T> | DateBasedFieldProps<T> | TimeBasedFieldProps<T> | ObjectCrudField<T> | NumberBasedFieldProps<T> | CheckboxBasedFieldProps<T> | ColorPickerFieldProps<T> | FileCrudField<T>;
 export type CrudPaginateProps = false | {
@@ -219,7 +226,7 @@ export type CrudComponentProps<T, FormType = T> = {
     isHiding?: boolean;
     isDeleting?: boolean;
     isUpdating?: boolean;
-    viewable?: boolean | keyof T;
+    viewable?: CrudViewableProps<T>;
     extraAction?: (t: T) => ReactElement;
     paginateProps?: CrudPaginateProps;
     formBuilder?: FormBuilderFunc<T>;

package/crud/CrudField.cjs.js

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