A client-side React button component that renders a chevron icon (up or down) with configurable size, direction, and expand/collapse state. ## Key Components ### `ChevronButton` A `forwardRef` button component built on native `` with the following props: | Prop | Type | Default | Description | |---|---|---|---| | `direction` | `'up' \| 'down'` | `'down'` | Static chevron direction | | `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Icon size (`h-4`, `h-5`, `h-6`) | | `isExpanded` | `boolean` | — | When provided, overrides `direction` — `true` → up, `false` → down | | `backgroundColor` | `string` | — | Inline background color | | `borderColor` | `string` | — | Inline border color | | `className` | `string` | — | Additional Tailwind classes via `cn()` | > **Note:** `isExpanded` takes priority over `direction` when determining the rendered icon. ## Usage Example ```typescript import { ChevronButton } from "@/components/ui/chevron-button" // Static direction // Controlled expand/collapse toggle const [open, setOpen] = React.useState(false) setOpen(prev => !prev)} /> ``` ## Source [`chevron-button.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/src/components/ui/chevron-button.tsx)