<!-- source-hash: 24edd509d1d4422049647e46332e05ae -->
A deprecated column-level filter dropdown component that renders a clickable label with a filter icon, wiring a `FiltersDropdown` to manage checkbox-based filter state for a single table column.

## Key Components

### `TableColumnFilterDropdownProps`
| Prop | Type | Description |
|------|------|-------------|
| `columnKey` | `string` | Key used to read/write filter state |
| `columnLabel` | `string` | Display label and accessibility text |
| `filterOptions` | `FilterOption[]` | Available checkbox options |
| `filters` | `TableFilters` | Current filter state across all columns |
| `onFilterChange` | `(filters: TableFilters) => void` | Callback fired on apply or reset |
| `placement` | `'bottom-start' \| 'bottom-end' \| 'bottom'` | Dropdown anchor position |
| `dropdownClassName` | `string` | Extra class on the dropdown panel |

### `TableColumnFilterDropdown`
Renders a trigger button (label + `Filter02Icon`) that turns accent-colored when filters are active (`activeCount > 0`). Delegates to `FiltersDropdown` with a single `checkbox` section, forwarding `onApply` and `onReset` handlers that merge or remove the column's filter entries from the shared `TableFilters` state.

## Usage Example

```typescript
import { TableColumnFilterDropdown } from './table-column-filter-dropdown'

const [filters, setFilters] = useState<TableFilters>({})

<TableColumnFilterDropdown
  columnKey="status"
  columnLabel="Status"
  filterOptions={[
    { label: 'Active', value: 'active' },
    { label: 'Inactive', value: 'inactive' },
  ]}
  filters={filters}
  onFilterChange={setFilters}
  placement="bottom-start"
/>
```

> **Deprecated:** Use `DataTableColumnFilter` from `data-table` instead.