import { j as jsxRuntimeExports } from '../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
import { PlusIcon } from '../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
import { Flex } from '../flex/flex.js';
import { DataTableFilterOptions } from './DataTableFilterOptions.js';
import { FilteredChip } from './FilteredChip.js';
import styles from './datatable.module.css.js';
import { useTable } from './hooks/useTable.js';

function DataTableFilterChips(props) {
    const { filteredColumns, table, updateColumnCustomFilter } = useTable();
    const tableColumns = table
        .getAllColumns()
        .filter((column) => typeof column.accessorFn !== "undefined" &&
        column.getCanHide() &&
        column.getCanFilter());
    if (!filteredColumns.length)
        return null;
    return (jsxRuntimeExports.jsxs(Flex, { gap: "small", align: "center", className: styles.chipWrapper, ...props, children: [filteredColumns.map((filter, index) => {
                const filteredColumn = table.getColumn(filter);
                return (jsxRuntimeExports.jsx(FilteredChip, { column: filteredColumn, updateColumnCustomFilter: updateColumnCustomFilter }, index));
            }), filteredColumns.length < tableColumns.length && (jsxRuntimeExports.jsx(DataTableFilterOptions, { variant: "ghost", style: { border: "none", background: "none" }, children: jsxRuntimeExports.jsx(PlusIcon, { width: 16, height: 16 }) }))] }));
}

export { DataTableFilterChips };
//# sourceMappingURL=DataTableFilterChips.js.map
