@buun_group/brutalist-ui/dist/react/table/Table.d.ts

A brutalist-styled component library

/**
 * @module Table
 * @description A comprehensive table component with support for sorting, alignment, and various styling options. Includes compound components for building complex data tables with accessibility features.
 */
import { HTMLAttributes, ThHTMLAttributes, TdHTMLAttributes, CSSProperties } from 'react';
/**
 * Props for the main Table component
 */
export interface TableProps extends HTMLAttributes<HTMLTableElement> {
    /**
     * Visual style variant of the table
     * @default 'default'
     */
    variant?: 'default' | 'striped' | 'bordered';
    /**
     * Size of the table affecting padding and font size
     * @default 'md'
     */
    size?: 'sm' | 'md' | 'lg';
    /**
     * Whether table rows should highlight on hover
     * @default false
     */
    hoverable?: boolean;
    /**
     * Whether the table should take full width of its container
     * @default true
     */
    fullWidth?: boolean;
    /**
     * Additional CSS classes to apply to the table
     */
    className?: string;
    /**
     * Custom styles to apply to the table
     */
    style?: CSSProperties;
}
/**
 * Props for the TableHead component
 */
export interface TableHeadProps extends HTMLAttributes<HTMLTableSectionElement> {
    /**
     * Whether the table header should stick to the top on scroll
     * @default false
     */
    sticky?: boolean;
    /**
     * Additional CSS classes to apply to the table head
     */
    className?: string;
    /**
     * Custom styles to apply to the table head
     */
    style?: CSSProperties;
}
/**
 * Props for the TableHeader component (th elements)
 */
export interface TableHeaderProps extends ThHTMLAttributes<HTMLTableCellElement> {
    /**
     * Text alignment for the header content
     * @default 'left'
     */
    align?: 'left' | 'center' | 'right';
    /**
     * Whether this column supports sorting
     * @default false
     */
    sortable?: boolean;
    /**
     * Current sort direction for this column
     * @default 'none'
     */
    sortDirection?: 'asc' | 'desc' | 'none';
    /**
     * Callback function triggered when the sort button is clicked
     */
    onSort?: () => void;
    /**
     * Additional CSS classes to apply to the header cell
     */
    className?: string;
    /**
     * Custom styles to apply to the header cell
     */
    style?: CSSProperties;
}
/**
 * Props for the TableCell component (td elements)
 */
export interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {
    /**
     * Text alignment for the cell content
     * @default 'left'
     */
    align?: 'left' | 'center' | 'right';
    /**
     * Whether this cell contains numeric data (affects styling)
     * @default false
     */
    numeric?: boolean;
    /**
     * Additional CSS classes to apply to the cell
     */
    className?: string;
    /**
     * Custom styles to apply to the cell
     */
    style?: CSSProperties;
}
export declare const Table: import("react").ForwardRefExoticComponent<TableProps & import("react").RefAttributes<HTMLTableElement>>;
export declare const TableHead: import("react").ForwardRefExoticComponent<TableHeadProps & import("react").RefAttributes<HTMLTableSectionElement>>;
export declare const TableBody: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
    style?: CSSProperties;
} & import("react").RefAttributes<HTMLTableSectionElement>>;
export declare const TableRow: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableRowElement> & {
    style?: CSSProperties;
} & import("react").RefAttributes<HTMLTableRowElement>>;
export declare const TableHeader: import("react").ForwardRefExoticComponent<TableHeaderProps & import("react").RefAttributes<HTMLTableCellElement>>;
export declare const TableCell: import("react").ForwardRefExoticComponent<TableCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
declare const TableNamespace: import("react").ForwardRefExoticComponent<TableProps & import("react").RefAttributes<HTMLTableElement>> & {
    Head: import("react").ForwardRefExoticComponent<TableHeadProps & import("react").RefAttributes<HTMLTableSectionElement>>;
    Body: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
        style?: CSSProperties;
    } & import("react").RefAttributes<HTMLTableSectionElement>>;
    Row: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableRowElement> & {
        style?: CSSProperties;
    } & import("react").RefAttributes<HTMLTableRowElement>>;
    Header: import("react").ForwardRefExoticComponent<TableHeaderProps & import("react").RefAttributes<HTMLTableCellElement>>;
    Cell: import("react").ForwardRefExoticComponent<TableCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
};
export default TableNamespace;