Swipe row
A list row with a swipe-to-reveal action rail, a full-swipe primary action, and a keyboard action toggle.
Quarterly research notesEdited 2 hours ago
Field interview transcriptEdited yesterday
Last action: Swipe or open actions
Implementation
1"use client";2 3import {4 useRef,5 useState,6 type PointerEvent as ReactPointerEvent,7} from "react";8import { MoreHorizontal } from "lucide-react";9 10export type SwipeRowAction = {11 id: string;12 label: string;13 danger?: boolean;14};15 16export type SwipeRowProps = {17 label: string;18 detail?: string;19 actions: SwipeRowAction[];20 onAction?: (action: SwipeRowAction) => void;21 disabled?: boolean;22 className?: string;23};24 25const ACTION_WIDTH = 92;26 27/**28 * A list row with a swipe-to-reveal action rail. Pointer users can swipe;