import clsx from 'clsx';
import { PropsWithChildren, ReactNode } from 'react';
import { TableHeaderProps } from 'react-table';
import { TableHeaderSortIcons } from './TableHeaderSortIcons';
import styles from './TableHeaderCell.module.css';
interface Props {
canFilter: boolean;
canSort: boolean;
headerProps: TableHeaderProps;
isSorted: boolean;
isSortedDesc?: boolean;
onSortClick: (desc: boolean) => void;
render: () => ReactNode;
renderFilter: () => ReactNode;
}
export function TableHeaderCell({
headerProps: { className, role, style },
canSort,
render,
onSortClick,
isSorted,
isSortedDesc = true,
canFilter,
renderFilter,
}: Props) {
return (
{render()}
{canFilter ? renderFilter() : null}
|
);
}
interface SortWrapperProps {
canSort: boolean;
isSorted: boolean;
isSortedDesc?: boolean;
onClick?: (desc: boolean) => void;
}
function SortWrapper({
canSort,
children,
onClick = () => {},
isSorted,
isSortedDesc = true,
}: PropsWithChildren) {
if (!canSort) {
return <>{children}>;
}
return (
);
}
interface TableColumnHeaderAngularProps {
colTitle: string;
canSort: boolean;
isSorted?: boolean;
isSortedDesc?: boolean;
}
export function TableColumnHeaderAngular({
canSort,
isSorted,
colTitle,
isSortedDesc = true,
}: TableColumnHeaderAngularProps) {
return (
{colTitle}
);
}