UNPKG

pagamio-frontend-commons-lib

Version:

Pagamio library for Frontend reusable components like the form engine and table container

117 lines (116 loc) 3.77 kB
import { type TableProps } from '@mantine/core'; import type { MRT_ColumnDef, MRT_Row, MRT_TableInstance } from 'mantine-react-table'; import { type ChangeEvent } from 'react'; export type CoreTableColumnDef<T extends Record<string, any>> = MRT_ColumnDef<T> & { showHeader?: boolean; }; export type PagamioMantineTableProps<T extends Record<string, any>> = { columns: CoreTableColumnDef<T>[]; data: T[]; selectable?: boolean; sortable?: boolean; enableGlobalFilters?: boolean; enableManualSorting?: boolean; enableManualPagination?: boolean; enablePagination?: boolean; rowCount: number; onClearFilters?: () => void; showClearFilters?: boolean; showApplyFilterButton?: boolean; pagination?: { enabled: boolean; pageIndex: number; totalPages?: number; onPageChange: (page: number) => void; pageSize: number; itemsPerPage: number; itemsPerPageOptions: number[]; onPaginationChange: (index: number, itemsPerPage: number) => void; }; sorting?: { multiSorting?: boolean; sortConfig: SortConfig; onSort: (sortKey: string, sortDirection: 'asc' | 'desc') => void; setSortBy?: (sortKey: string) => void; setSortDir?: (dir: string) => void; }; filtering?: { filters: BaseFilter[]; appliedFilters: Record<string, string>; onTableFilter: (columnKey: string, value: string) => void; }; search?: { enabled: boolean; searchQuery: string; onSearch: (e: ChangeEvent<HTMLInputElement>) => void; }; exportable?: boolean; addButton?: boolean; searctInputPlaceHolder?: string; addText?: string; onAdd?: () => void; handleSearchTable: () => void; renderEmptyRowsFallback?: React.ReactNode; mantineTableProps?: TableProps; mantineTableContainerProps?: React.ComponentPropsWithoutRef<'div'>; mantinePaperProps?: React.ComponentPropsWithoutRef<'div'>; mantinePaginationProps?: React.ComponentPropsWithoutRef<'div'>; defaultColumn?: Partial<MRT_ColumnDef<T>>; manualFilters?: boolean; manualSorting?: boolean; manualPagination?: boolean; enableStickyHeader?: boolean; enableRowSelection?: boolean; enableColumnResizing?: boolean; expandable?: boolean; renderExpandableComponent?: (props: { row: MRT_Row<T>; table: MRT_TableInstance<T>; }) => React.ReactNode; }; export type TableToolbarProps<T extends Record<string, any>> = { searchable: boolean; searchQuery: string; onSearch: (e: ChangeEvent<HTMLInputElement>) => void; onClearFilters?: () => void; showClearFilters?: boolean; showApplyFilterButton?: boolean; filters?: BaseFilter[]; appliedFilters: Record<string, string>; exportable: boolean; columns: MRT_ColumnDef<T>[]; data: T[]; onTableFilter?: (columnKey: string, value: string) => void; addButton: boolean; addText?: string; isNarrow: boolean; searctInputPlaceHolder?: string; onAdd: () => void; handleSearchTable: () => void; handleApplyFilters?: () => void; }; export interface BaseEntity { id: number | string; createdById?: number; lastModifiedById?: number; createdDate?: string; lastModifiedDate?: string; state?: number; [key: string]: any; } export interface BaseFilter { columnKey: string; label?: string; type?: 'select' | 'multi-select' | 'date' | 'range' | 'boolean'; options: Array<{ label: string; value: string; }>; defaultValue?: string | string[]; placeholder?: string; } export interface SortConfig { sortBy?: string; sortDir?: 'asc' | 'desc'; multiSorting?: boolean; }