SortDropdown

Sort-by column dropdown with direction toggle and optional filter input

Demo

Sorting by created_at desc

With filter input

Props

Prop	Type	Default	Description
`options`	`SortOption[]`	-	Available sort columns (required)
`sortBy`	`string`	-	Current sort key
`sortDir`	`"asc" \| "desc"`	-	Current sort direction
`showFilter`	`boolean`	`false`	Show a search input in the dropdown
`filterValue`	`string`	`""`	Current filter text
`filterPlaceholder`	`string`	`"Filter…"`	Filter input placeholder
`size`	`"xs" \| "sm" \| "md"`	`"xs"`	Button size
`onSortChange`	`(value, dir) => void`	-	Called when sort changes
`onFilterChange`	`(value) => void`	-	Called when filter text changes

SortOption type

interface SortOption {
  value: string;
  label: string;
  icon: string;          // emoji or icon character shown in trigger
  defaultDir?: 'asc' | 'desc';  // default direction when first selected
}