react-crud-mui 0.1.0 → 0.2.1

package/dist/components/detail-page/hooks/useDetailPageModal.d.ts

@@ -25,6 +25,7 @@ declare function useDetailPageModal<TModel extends FieldValues>({ models, unique
     readonly form?: import('../../form/hooks/useForm').UseFormReturn<TModel> | undefined;
     readonly schema?: import('zod').ZodType<TModel, import('zod').ZodTypeDef, TModel> | undefined;
     readonly validationOptions?: import('../../form/hooks/useForm').ValidationOptions<TModel> | undefined;
+    readonly defaultValues?: import('../pages/DetailPageForm').DefaultData<TModel> | undefined;
     readonly className?: string;
     readonly style?: React.CSSProperties;
     readonly classes?: Partial<import('@mui/material').ClassNameMap<never>> | undefined;
@@ -410,7 +411,6 @@ declare function useDetailPageModal<TModel extends FieldValues>({ models, unique
     readonly useHeaderIconWrapper?: boolean;
     readonly tabs?: import('../../page/components/DefaultTabs').TabPane[];
     readonly error?: import('../../utils').ServerError;
-    readonly defaultValues?: import('../pages/DetailPageData').DefaultData<TModel> | undefined;
     readonly footerContent?: import('react').ReactNode;
     readonly moreContent?: import('react').ReactNode;
     readonly panels?: import('../../page/components/DefaultPanels').PanelPane[];

package/dist/components/detail-page/pages/DetailPageData.d.ts

@@ -1,13 +1,10 @@
 import { FieldValues } from 'react-hook-form';
 import { UseFormReturn } from '../../form/hooks/useForm';
-import { DeepNullable } from '../../utils';
 import { DetailPageContentProps, NeedDataReason } from './DetailPageContent';
 export type DataResult<TModel> = TModel | Promise<TModel | void | undefined> | undefined | void;
 export interface DataEvent<TModel extends FieldValues, TVariables> {
     (variables: TVariables, form: UseFormReturn<TModel>): DataResult<TModel>;
 }
-export type DefaultDataFn<TModel extends FieldValues> = (reason: NeedDataReason, data?: TModel) => DeepNullable<TModel> | Promise<DeepNullable<TModel>>;
-export type DefaultData<TModel extends FieldValues> = DeepNullable<TModel> | DefaultDataFn<TModel>;
 export type SaveMode = 'save' | 'save-close' | 'save-create';
 export interface BasePayload {
     reason: NeedDataReason;
@@ -23,10 +20,6 @@ export interface DeletePayload<TModel extends FieldValues = FieldValues> extends
 }
 export interface DetailPageDataProps<TModel extends FieldValues> extends Omit<DetailPageContentProps<TModel>, 'onSave' | 'onDelete' | 'onDiscardChanges' | 'onCopy' | 'onSaveCreate' | 'onSaveClose'> {
     form: UseFormReturn<TModel>;
-    /**
-     * Get default form values for each particular reason
-     */
-    defaultValues?: DefaultData<TModel>;
     /**
      * Save event
      * @returns if returns data,either in promise or object will bind to form data
@@ -61,5 +54,5 @@ export interface DetailPageDataProps<TModel extends FieldValues> extends Omit<De
 /**
  * Page component that all data manupulation is handled
  */
-declare function DetailPageData<TModel extends FieldValues>({ alerts, autoSave, data, defaultValues, error, form, loading, onAfterDelete, onAfterSave, onClose, onDelete, onDiscardChanges, onReasonChange, onSave, reason, showSuccessMessages, ...dpProps }: DetailPageDataProps<TModel>): import("react/jsx-runtime").JSX.Element;
+declare function DetailPageData<TModel extends FieldValues>({ alerts, autoSave, data, error, form, loading, onAfterDelete, onAfterSave, onClose, onDelete, onDiscardChanges, onReasonChange, onSave, reason, showSuccessMessages, ...dpProps }: DetailPageDataProps<TModel>): import("react/jsx-runtime").JSX.Element;
 export default DetailPageData;

package/dist/components/detail-page/pages/DetailPageForm.d.ts

@@ -1,11 +1,16 @@
 import { FieldValues } from 'react-hook-form';
 import { z } from 'zod';
 import { UseFormReturn, ValidationOptions } from '../../form/hooks/useForm';
+import { DeepNullable } from '../../utils';
+import { NeedDataReason } from './DetailPageContent';
 import { DetailPageDataProps } from './DetailPageData';
+export type DefaultDataFn<TModel extends FieldValues> = (reason: NeedDataReason, data?: TModel) => DeepNullable<TModel> | Promise<DeepNullable<TModel>>;
+export type DefaultData<TModel extends FieldValues> = DeepNullable<TModel> | DefaultDataFn<TModel>;
 export interface DetailPageFormProps<TModel extends FieldValues> extends Omit<DetailPageDataProps<TModel>, 'form'> {
     form?: UseFormReturn<TModel>;
     schema?: z.ZodType<TModel>;
     validationOptions?: ValidationOptions<TModel>;
+    defaultValues?: DefaultData<TModel>;
 }
 declare function DetailPageForm<TModel extends FieldValues>({ activeSegmentIndex, schema, defaultValues, validationOptions, data, reason, ...dpProps }: DetailPageFormProps<TModel>): import("react/jsx-runtime").JSX.Element;
 export default DetailPageForm;

package/dist/components/form/controls/FormComboBox.d.ts

@@ -3,5 +3,5 @@ import { ComboBoxProps, CreatableModel } from '../../combobox/ComboBox';
 import { ControlCommonProps } from '../Field';
 export interface FormComboBoxProps<T extends CreatableModel, Creatable extends boolean = false, TFieldValues extends FieldValues = FieldValues> extends Omit<ComboBoxProps<T, Creatable>, 'name'>, ControlCommonProps<TFieldValues> {
 }
-declare function FormComboBox<T extends CreatableModel = CreatableModel, Creatable extends boolean = false, TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, ...comboBoxProps }: FormComboBoxProps<T, Creatable, TFieldValues>): import("react/jsx-runtime").JSX.Element;
+declare function FormComboBox<T extends CreatableModel = CreatableModel, Creatable extends boolean = false, TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, formControlProps, ...comboBoxProps }: FormComboBoxProps<T, Creatable, TFieldValues>): import("react/jsx-runtime").JSX.Element;
 export default FormComboBox;

package/dist/components/form/controls/FormDatePicker.d.ts

@@ -4,5 +4,5 @@ import { DatePickerProps } from '@mui/x-date-pickers/DatePicker';
 import { Dayjs } from 'dayjs';
 import { ControlCommonProps } from '../Field';
 export type FormDatePickerProps<TFieldValues extends FieldValues = FieldValues> = Partial<DatePickerProps<Dayjs>> & Pick<StandardTextFieldProps, 'size'> & ControlCommonProps<TFieldValues>;
-declare function FormDatePicker<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, slotProps, autoFocus, size, disabled, ...dateProps }: FormDatePickerProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+declare function FormDatePicker<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, slotProps, autoFocus, size, disabled, formControlProps, ...dateProps }: FormDatePickerProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
 export default FormDatePicker;

package/dist/components/form/controls/FormInput.d.ts

@@ -3,5 +3,5 @@ import { InputProps } from '../../input/Input';
 import { ControlCommonProps } from '../Field';
 export interface FormInputProps<TFieldValues extends FieldValues = FieldValues> extends Omit<InputProps, 'name'>, ControlCommonProps<TFieldValues> {
 }
-declare function FormInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, ...inputProps }: FormInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+declare function FormInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, formControlProps, disabled, ...inputProps }: FormInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
 export default FormInput;

package/dist/components/form/controls/FormMoneyInput.d.ts

@@ -3,5 +3,5 @@ import { MoneyInputProps } from '../../money-input/MoneyInput';
 import { ControlCommonProps } from '../Field';
 export interface FormMoneyInputProps<TFieldValues extends FieldValues = FieldValues> extends Omit<MoneyInputProps, 'name'>, ControlCommonProps<TFieldValues> {
 }
-declare function FormMoneyInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, ...inputProps }: FormMoneyInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+declare function FormMoneyInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, formControlProps, ...inputProps }: FormMoneyInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
 export default FormMoneyInput;

package/dist/components/form/controls/FormNumberInput.d.ts

@@ -3,5 +3,5 @@ import { NumberInputProps } from '../../number-input/NumberInput';
 import { ControlCommonProps } from '../Field';
 export interface FormNumberInputProps<TFieldValues extends FieldValues = FieldValues> extends Omit<NumberInputProps, 'name'>, ControlCommonProps<TFieldValues> {
 }
-declare function FormNumberInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, ...inputProps }: FormNumberInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+declare function FormNumberInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, formControlProps, disabled, ...inputProps }: FormNumberInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
 export default FormNumberInput;

package/dist/components/form/controls/FormPhoneInput.d.ts

@@ -3,5 +3,5 @@ import { PhoneInputProps } from '../../phone-input/PhoneInput';
 import { ControlCommonProps } from '../Field';
 export interface FormPhoneInputProps<TFieldValues extends FieldValues = FieldValues> extends Omit<PhoneInputProps, 'name'>, ControlCommonProps<TFieldValues> {
 }
-declare function FormPhoneInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, ...inputProps }: FormPhoneInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+declare function FormPhoneInput<TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, formControlProps, ...inputProps }: FormPhoneInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
 export default FormPhoneInput;

package/dist/components/form/controls/FormSelect.d.ts

@@ -3,5 +3,5 @@ import { SelectProps } from '../../select/Select';
 import { ControlCommonProps } from '../Field';
 export interface FormSelectProps<T extends FieldValues = FieldValues, TFieldValues extends FieldValues = FieldValues> extends Omit<SelectProps<T>, 'name'>, ControlCommonProps<TFieldValues> {
 }
-declare function FormSelect<T extends FieldValues, TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, ...selectProps }: FormSelectProps<T, TFieldValues>): import("react/jsx-runtime").JSX.Element;
+declare function FormSelect<T extends FieldValues, TFieldValues extends FieldValues = FieldValues>({ name, fieldProps, disabled, formControlProps, ...selectProps }: FormSelectProps<T, TFieldValues>): import("react/jsx-runtime").JSX.Element;
 export default FormSelect;

package/dist/components/list-page/components/CardList.d.ts

@@ -0,0 +1,18 @@
+import { default as React, ReactNode } from 'react';
+import { FieldValues } from 'react-hook-form';
+import { Grid2Props, PaginationProps } from '@mui/material';
+import { ActionCommandsProps } from '../../action-commands/ActionCommands';
+import { EmptyTextProps } from '../../table/components/EmptyText';
+export interface CardListProps<TModel extends FieldValues> {
+    data?: TModel[];
+    onCardMeta: (model: TModel, actions: React.ReactNode, actionProps: ActionCommandsProps<TModel>) => ReactNode;
+    onActionCommandProps: (model: TModel, index: number) => ActionCommandsProps<TModel>;
+    cardColProps?: Grid2Props;
+    cardRowProps?: Grid2Props;
+    enablePagination?: boolean;
+    paginationProps?: PaginationProps;
+    emptyTextProps?: EmptyTextProps;
+    enableActionCommands?: boolean;
+}
+declare function CardList<TModel extends FieldValues>({ enableActionCommands, cardColProps, cardRowProps, data, enablePagination, onCardMeta, paginationProps, onActionCommandProps, emptyTextProps, }: CardListProps<TModel>): import("react/jsx-runtime").JSX.Element;
+export default CardList;

package/dist/components/list-page/hooks/useListPage.d.ts

@@ -1,5 +1,6 @@
 import { default as React } from 'react';
 import { FieldValues } from 'react-hook-form';
+import { NeedDataReason } from '../../detail-page/pages/DetailPageContent';
 import { ListPageProps } from '../pages/ListPage';
 export type ListPageContextType<TModel extends FieldValues> = {
     data?: TModel[];
@@ -14,7 +15,7 @@ export type ListPageContextType<TModel extends FieldValues> = {
     /**
      * Used for built in detailpage opener
      */
-    onShowDetailPage: (model?: any) => void;
+    triggerAction: (reason: NeedDataReason, data?: TModel) => void;
 } & Pick<ListPageProps<TModel>, 'loading' | 'enableClear' | 'enableCreateItem' | 'enableExport' | 'enableSearch'>;
 export declare const ListPageContext: React.Context<ListPageContextType<any> | null>;
 declare const useListPage: <TModel extends FieldValues>() => ListPageContextType<TModel>;

package/dist/components/list-page/hooks/useURLSearchFilter.d.ts

@@ -1,9 +1,13 @@
 import { FieldValues } from 'react-hook-form';
 import { ListPageMeta } from '../pages/ListPageFilter';
-type UseURLSearchFilterOptions = {
+export type MatchFields<TFilter extends FieldValues> = {
+    [k in keyof TFilter]?: true;
+};
+type UseURLSearchFilterOptions<TFilter extends FieldValues> = {
     defaultValues?: Record<string, unknown>;
+    matcher?: MatchFields<TFilter>;
 };
-declare function useURLSearchFilter<TFilter extends FieldValues>({ defaultValues, }: UseURLSearchFilterOptions): {
+declare function useURLSearchFilter<TFilter extends FieldValues>({ defaultValues, matcher, }: UseURLSearchFilterOptions<TFilter>): {
     getFiltersInQS: () => {
         filter: {
             [key: string]: unknown;

package/dist/components/list-page/pages/ListPageContent.d.ts

@@ -9,8 +9,10 @@ import { Message } from '../../page/hooks/useNormalizeMessages';
 import { PageProps } from '../../page/Page';
 import { TableColumn, TableProps } from '../../table/Table';
 import { ServerError } from '../../utils';
+import { CardListProps } from '../components/CardList';
 import { ListPageCommandsProps } from '../components/ListPageCommands';
 import { ListPageHeaderProps } from '../components/ListPageHeader';
+export type ListType = 'table' | 'card';
 export type ListPageWrapperLayoutProps = {
     content: ReactNode;
     pageContent: ReactNode;
@@ -56,7 +58,7 @@ export interface ListPageContentProps<TModel extends FieldValues> extends Omit<P
     /**
      * ListPage columns
      */
-    columns: TableColumn<TModel>[];
+    columns?: TableColumn<TModel>[];
     /**
      * Enable searching thru commands and shortcuts
      */
@@ -100,7 +102,7 @@ export interface ListPageContentProps<TModel extends FieldValues> extends Omit<P
     /**
      * Custom list region component
      */
-    list?: React.ComponentType<TableProps<TModel>>;
+    onCustomTable?: (props: TableProps<TModel>) => ReactNode;
     /**
      * Custom header function
      */
@@ -130,6 +132,18 @@ export interface ListPageContentProps<TModel extends FieldValues> extends Omit<P
      * Open detailPage in view mode as default or in which reason provided
      */
     enableRowClickToDetails?: boolean | NeedDataReason;
+    /**
+     * Call search after save & delete actions of detailpage,default true
+     */
+    enableRefetch?: boolean;
+    /**
+     * Card Col props
+     */
+    cardProps?: CardListProps<TModel>;
+    /**
+     * List type @default table
+     */
+    listType?: ListType;
 }
-declare function ListPageContent<TModel extends FieldValues>({ activeSegmentIndex, alerts, autoSearch, children, columns, createCommandLabel, data, dataCount, disabled, disableShortCuts, enableActionCommands, enableRowClickToDetails, enableClear, enableCreateItem, enableExport, enableSearch, error, filterContent, hotkeyScopes, list: ListComponent, loading, onActionClick, onActionCommands, onClear, onClose, onCommands, onDetailPage, onExcelExport, onExtraCommands, onHeader, onSearch, onTabChanged, tableProps, onWrapperLayout, showHeader, ...pageProps }: ListPageContentProps<TModel>): import("react/jsx-runtime").JSX.Element;
+declare function ListPageContent<TModel extends FieldValues>({ activeSegmentIndex, alerts, autoSearch, cardProps, children, columns, createCommandLabel, data, dataCount, disabled, disableShortCuts, enableActionCommands, enableRowClickToDetails, enableClear, enableCreateItem, enableRefetch, enableExport, enableSearch, error, filterContent, hotkeyScopes, listType, loading, onActionClick, onActionCommands, onClear, onClose, onCommands, onCustomTable, onDetailPage, onExcelExport, onExtraCommands, onHeader, onSearch, onTabChanged, tableProps, onWrapperLayout, showHeader, ...pageProps }: ListPageContentProps<TModel>): import("react/jsx-runtime").JSX.Element;
 export default ListPageContent;

package/dist/components/list-page/pages/ListPageFilter.d.ts

@@ -3,13 +3,14 @@ import { TableState } from '@tanstack/react-table';
 import { UseFormReturn } from '../../form/hooks/useForm';
 import { TabChangedPayload } from '../../page/components/DefaultTabs';
 import { TableProps } from '../../table/Table';
+import { CardListProps } from '../components/CardList';
 import { ListPageContentProps } from './ListPageContent';
 export type TableMode = 'server' | 'client';
 export type ListPageMeta = Pick<TableState, 'pagination' | 'sorting' | 'columnFilters'> & TabChangedPayload & {
     reason: SearchReason;
 };
 export type SearchReason = 'search' | 'sorting' | 'pagination' | 'init' | 'clear' | 'export' | 'tabChanged' | 'columnfilter';
-export interface ListPageFilterProps<TModel extends FieldValues, TFilter extends FieldValues = FieldValues> extends Omit<ListPageContentProps<TModel>, 'onSearch' | 'onExcelExport' | 'tableProps' | 'onTabChanged'> {
+export interface ListPageFilterProps<TModel extends FieldValues, TFilter extends FieldValues = FieldValues> extends Omit<ListPageContentProps<TModel>, 'onSearch' | 'onExcelExport' | 'tableProps' | 'onTabChanged' | 'cardProps'> {
     /**
      * Table states as partial for providing extra props to table
      */
@@ -38,6 +39,10 @@ export interface ListPageFilterProps<TModel extends FieldValues, TFilter extends
      * Make search on mount,default true
      */
     searchOnLoad?: boolean;
+    /**
+     * Table sorting and
+     */
+    tableMode?: TableMode;
     /**
      * Enable table pagination default true
      */
@@ -46,13 +51,10 @@ export interface ListPageFilterProps<TModel extends FieldValues, TFilter extends
      * Enable table sorting default true
      */
     enableSorting?: boolean;
-    /**
-     * Table sorting and
-     */
-    tableMode?: TableMode;
+    cardProps?: Pick<CardListProps<TModel>, 'cardColProps' | 'cardRowProps' | 'onCardMeta' | 'emptyTextProps'>;
 }
 /**
  * ListPage with filtering features
  */
-declare function ListPageFilter<TModel extends FieldValues, TFilter extends FieldValues = FieldValues>({ defaultMeta, defaultSegmentIndex, enablePagination, enableSorting, form, meta, onChange, onClear, searchOnLoad, tableMode, tableProps: extableProps, ...lpProps }: ListPageFilterProps<TModel, TFilter>): import("react/jsx-runtime").JSX.Element;
+declare function ListPageFilter<TModel extends FieldValues, TFilter extends FieldValues = FieldValues>({ cardProps, data, dataCount, defaultMeta, defaultSegmentIndex, enablePagination, enableSorting, form, meta, onChange, onClear, searchOnLoad, tableMode, tableProps: extableProps, ...lpProps }: ListPageFilterProps<TModel, TFilter>): import("react/jsx-runtime").JSX.Element;
 export default ListPageFilter;

package/dist/components/list-page/pages/ListPageForm.d.ts

@@ -1,9 +1,9 @@
 import { FieldValues } from 'react-hook-form';
 import { z } from 'zod';
-import { UseFormOptions, UseFormReturn, ValidationOptions } from '../../form/hooks/useForm';
+import { UseFormReturn, ValidationOptions } from '../../form/hooks/useForm';
 import { DeepNullable } from '../../utils';
 import { ListPageFilterProps } from './ListPageFilter';
-export interface ListPageFormProps<TModel extends FieldValues, TFilter extends FieldValues = FieldValues> extends Omit<ListPageFilterProps<TModel, TFilter>, 'form'>, Partial<Pick<UseFormOptions<TFilter>, 'schema'>> {
+export interface ListPageFormProps<TModel extends FieldValues, TFilter extends FieldValues = FieldValues> extends Omit<ListPageFilterProps<TModel, TFilter>, 'form'> {
     form?: UseFormReturn<TFilter>;
     schema?: z.ZodType<TFilter>;
     /**

package/dist/components/list-page/pages/ListPageRoute.d.ts

@@ -1,8 +1,9 @@
 import { FieldValues } from 'react-hook-form';
 import { UseSegmentParamsOptions } from '../../detail-page/hooks/useSegmentParams';
+import { MatchFields } from '../hooks/useURLSearchFilter';
 import { ListPageProps } from './ListPage';
 export interface ListPageRouteProps<TModel extends FieldValues, TFilter extends FieldValues = FieldValues> extends ListPageProps<TModel, TFilter>, Omit<UseSegmentParamsOptions, 'paths'> {
-    enableQueryStringFilter?: boolean;
+    enableQueryStringFilter?: boolean | MatchFields<TFilter>;
 }
 /**
  * ListPage with routing based on react-router

package/dist/components/misc/index.d.ts

@@ -6,3 +6,4 @@ export { default as moneyFormat } from './moneyFormat';
 export { default as nullableZodSchema } from './nullableSchema';
 export { default as parseDate } from './parseDate';
 export { default as toNull } from './toNull';
+export { default as isEmpty } from './isEmpty';

package/dist/components/misc/isEmpty.d.ts

@@ -0,0 +1,2 @@
+declare const isEmpty: <T extends Record<string, unknown>>(value?: T | null) => boolean;
+export default isEmpty;

package/dist/components/table/components/EmptyText.d.ts

@@ -1,9 +1,9 @@
-import { default as React, PropsWithChildren } from 'react';
+import { default as React } from 'react';
 import { FlexBoxProps } from '../../flexbox/FlexBox';
 export interface EmptyTextProps extends FlexBoxProps {
     emptyText: React.ReactNode;
     showEmptyImage?: boolean;
     emptyImageUrl?: string;
 }
-declare function EmptyText({ emptyText, showEmptyImage, children, emptyImageUrl, ...boxProps }: PropsWithChildren<EmptyTextProps>): import("react/jsx-runtime").JSX.Element;
+declare function EmptyText({ emptyText, showEmptyImage, children, emptyImageUrl, ...boxProps }: EmptyTextProps): import("react/jsx-runtime").JSX.Element;
 export default EmptyText;