# Swipe Rows

A list whose rows swipe open to reveal actions, with iOS physics: buttons fan out from under the row, a full swipe runs the edge action and the list closes the gap.

- Page and source: https://uibrik.com/components/swipe-rows
- Install (Pro, needs a license key, see https://uibrik.com/docs/pro): `npx shadcn@latest add @uibrik-pro/swipe-rows`
- Packages: none beyond React
- Import: `import { SwipeRows } from "@/components/uibrik/swipe-rows/swipe-rows"`

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| fullSwipe | `boolean` | `true` | Swiping far enough runs the edge action without lifting to tap it. |
| threshold | `number` | `0.55` | Share of the row's width a swipe must pass to arm the full swipe. |
| haptics | `boolean` | `true` | A short vibration when a full swipe arms, on devices that support it. |
| hoverActions | `boolean` | `true` | Small action buttons on hover and keyboard focus. |
| variant | `"inset" \| "plain"` | `"inset"` | Inset is a rounded group; Plain runs edge to edge. |
| radius | `number` | `24` | Corner radius of the inset group. |
| items | `{ id: string; title: string; meta?: string; subtitle?: string; description?: string; avatar?: ReactNode; unread?: boolean; flagged?: boolean }[]` |  | Rows, in order. Remove an item to collapse its row. |
| leadingActions / trailingActions | `SwipeAction[] \| (item) => SwipeAction[]` |  | Actions revealed by swiping right / left. Each is { id, label, icon, color?, destructive? }. The first sits at the edge and runs on a full swipe. Pass a function to vary them per row. |
| onAction | `(actionId, item) => void` |  | Runs after a destructive action's row has slid away, or at once for the others. |
| onSelect | `(item) => void` |  | Tap or Enter on a closed row. |
| renderItem | `(item) => ReactNode` |  | Custom row content in place of the built-in layout. |
| openId / onOpenChange | `string \| null / (id) => void` |  | Controlled open row. Only one row is open at a time. |
| className | `string` |  | Classes for the list. |
