declare const filterSource = "\nimport { useMemo, useState } from 'react';\nimport { DataTable, FilterHandler, FilterState, FilterPreset, FilterConditionOperator } from '@jtl-software/platform-ui-react';\n\nconst App = () => {\n  const data = useMemo(() => getMockData(10), []);\n  const [presets, setPresets] = useState<FilterPreset<Person>[]>([{ label: 'All', value: {} }]);\n\n  // State for tracking filters\n  const [filters, setFilter] = useState<Partial<FilterState<Person>>>();\n\n  // Controls which filter columns are shown in the toolbar.\n  // Only columns listed here will render a filter input.\n  // Providing this state together with onSelectedFilterableColumnKeysChange\n  // enables the \"Weitere Filter\" button.\n  const [selectedFilterableColumnKeys, setSelectedFilterableColumnKeys] = useState<(keyof Person)[]>(['name']);\n\n  const handleFilterChange = (newFilter?: Partial<FilterState<Person>>) => {\n    setFilter(newFilter);\n  };\n\n  const filteredData = useMemo(() => {\n    // Handle filtering logic by yourself - apply the filters to the data\n\n  }, [data, filters]);\n\n  const filterInputConfig: FilterHandler<Person> = {\n    enabled: true,\n    filterableColumns: [\n      {\n        columnKey: 'name',\n        options: [\n          { label: 'John', value: 'John' },\n          { label: 'Jane', value: 'Jane' },\n          { label: 'Bob', value: 'Bob' },\n        ],\n        mode: 'multi',\n      },\n      {\n        columnKey: 'age',\n        mode: 'single',\n      },\n      {\n        columnKey: 'status',\n        mode: 'single',\n      },\n    ],\n    // Pass selectedFilterableColumnKeys + onSelectedFilterableColumnKeysChange\n    // to enable the \"Weitere Filter\" button. Only the selected columns render\n    // a filter input; deselecting a column also clears its active condition.\n    selectedFilterableColumnKeys,\n    onSelectedFilterableColumnKeysChange: setSelectedFilterableColumnKeys,\n    onChange: handleFilterChange,\n    hasFilterSaving: true,\n    presets,\n    onSavePreset: setPresets,\n  };\n\n  return (\n    <DataTable\n      toolbar={{\n        title: 'Table with Filters Input',\n        subtitle: 'This is a table with filters input',\n      }}\n      tableHeight={500}\n      dataSource={filteredData}\n      columns={columns}\n      filter={filterInputConfig}\n    />\n  );\n};  \n\nexport default App;\n";
export default filterSource;
