dgz-ui-shared/dist/types/components/datatable/MyTable.d.ts

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library

import { ComponentProps } from 'react';
import { UseSortableProps } from '../../hooks';
import { ColumnType } from '../../types';
/**
 * Props for the MyTable component.
 * @template TData - The type of data in the table.
 */
export interface MyTableProps<TData> extends ComponentProps<'table'> {
    /** Array of data rows to display. */
    rows?: TData[];
    /** Column definitions. */
    columns: ColumnType<TData>[];
    /** Callback when a row is clicked. */
    onRowClick?: (row: TData) => void;
    /** Whether to show row numbers. */
    hasNumbers?: boolean;
    /** Whether to show selection checkboxes. */
    hasCheckbox?: boolean;
    /** Unique key for each row. */
    rowKey: keyof TData;
    /** Current table parameters (page, limit, sort). */
    params?: Record<string, unknown>;
    /** Total number of items (optional, often used with pagination context). */
    total?: number;
    /** Array of currently selected item keys. */
    selectedItems?: TData[keyof TData][];
    /** Callback when selected items change. */
    onSelectedItemsChange?: (selectedItems?: TData[keyof TData][]) => void;
    /** Callback when sort order changes. */
    onSortOrderChange?: (params: Omit<UseSortableProps<TData>, 'onSortOrderChange'>) => void;
    /** Whether the header should stick to the top. */
    isStickyHeader?: true;
}
/**
 * MyTable renders a generic data table with optional numbering, selection checkboxes,
 * sortable columns and sticky header. It is a presentational component and delegates
 * sorting/selection state via hooks and callbacks.
 *
 * @template TData - The row data type.
 * @param rows - Array of data rows.
 * @param columns - Column definitions.
 * @param onRowClick - Callback when a row is clicked.
 * @param rowKey - Unique key for each row.
 * @param params - Current table parameters.
 * @param hasNumbers - Whether to show row numbers.
 * @param hasCheckbox - Whether to show selection checkboxes.
 * @param selectedItems - Array of currently selected item keys.
 * @param onSelectedItemsChange - Callback when selected items change.
 * @param onSortOrderChange - Callback when sort order changes.
 * @param isStickyHeader - Whether the header should stick to the top.
 * @param className - Additional CSS classes.
 * @param props - Component props.
 * @returns {JSX.Element} React element containing the table.
 */
export declare const MyTable: <TData>({ rows, columns, onRowClick, rowKey, params, hasNumbers, hasCheckbox, selectedItems, onSelectedItemsChange, onSortOrderChange, isStickyHeader, className, ...props }: MyTableProps<TData>) => import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=MyTable.d.ts.map