"use client";
import { jsxs, jsx } from 'react/jsx-runtime';
import { Chip } from '../../chip/chip.js';
import { Flex } from '../../flex/flex.js';
import { Text } from '../../text/text.js';

function DisplayProperties({ columns }) {
    const hidableColumns = columns?.filter(col => col.columnDef.enableHiding);
    return (jsxs(Flex, { direction: 'column', gap: 3, children: [jsx(Text, { children: "Display Properties" }), jsx(Flex, { gap: 3, wrap: 'wrap', children: hidableColumns.map(column => (jsx(Chip, { variant: 'outline', size: 'small', color: column.getIsVisible() ? 'accent' : 'neutral', onClick: () => column.toggleVisibility(), children: column.columnDef.header || column.id }, column.id))) })] }));
}

export { DisplayProperties };
//# sourceMappingURL=display-properties.js.map
