@vtex/styleguide
Version:
> VTEX Styleguide React components ([Docs](https://vtex.github.io/styleguide))
62 lines (61 loc) • 2.35 kB
TypeScript
import React, { FC, PropsWithChildren, ComponentProps } from 'react';
import { PaginationProps } from './Pagination';
import { FilterBarProps } from './FilterBar';
import useTableMeasures from './hooks/useTableMeasures';
import { TotalizerProps } from './Totalizer';
import { ActionBarProps } from './ActionBar';
import { ComposableSections } from './Sections';
import { Column, Items, RFC, ComposableWithRef } from './types';
import useTableSort from './hooks/useTableSort';
import { LoadingProvider } from './context/loading';
declare type Props = PropsWithChildren<SpecificProps>;
interface SpecificProps {
/** Return of the useTableMeasures hook */
measures: ReturnType<typeof useTableMeasures>;
/** Array of columns */
columns: Column[];
/** Array of items */
items: Items;
/** Function that generates row keys */
rowKey?: (data: {
rowData: unknown;
}) => string;
/** If the table is empty or not */
empty?: boolean;
/** If the Table is loading or not */
loading?: {
renderAs: () => React.ReactNode;
} | boolean;
/** Function trigged on a row click */
onRowClick?: (data: {
rowData: unknown;
}) => void;
/** Function that defines if a row is active or not */
isRowActive?: (data: unknown) => boolean;
/** Table EmptyState component */
emptyState?: ComponentProps<typeof LoadingProvider>['emptyState'];
/** Sorting properties */
sorting?: ReturnType<typeof useTableSort>;
/** Base testId */
testId?: string;
/** If the rows should be highlighted on :hover */
highlightOnHover?: boolean;
/** If the header is sticky or not */
stickyHeader?: boolean;
/** Exposes table sections to be composable */
composableSections?: boolean;
/** Disable scroll in table sections when not using composable sections */
disableScroll?: boolean;
}
interface Composites {
Toolbar?: FC;
FilterBar?: RFC<HTMLElement, FilterBarProps>;
Pagination?: RFC<HTMLElement, PaginationProps>;
Bulk?: FC;
Totalizer?: RFC<HTMLElement, TotalizerProps>;
ActionBar?: RFC<HTMLElement, ActionBarProps>;
Sections?: ComposableSections;
}
export declare type ComposableTable = ComposableWithRef<HTMLTableElement, Props, Composites>;
declare const FowardedTable: ComposableTable;
export default FowardedTable;