SwipeDismiss

Interruptible drag-to-dismiss row with a threshold, explicit dismiss action, restore state, touch support, and reduced-motion fallback.

InterfaceSource ready5 props documentedLive preview
Add with shadcnnpx shadcn@latest add https://www.uigrids.com/r/swipe-dismiss.json
Interactive preview
Interface

Release notes ready

Drag sideways or use the dismiss control.

Install with the CLI

# adds SwipeDismiss to components/ui with the shadcn CLI
npx shadcn@latest add https://www.uigrids.com/r/swipe-dismiss.json

Or install the package

// npm install @uigrids/react-ui
import { SwipeDismiss } from '@uigrids/react-ui'

export default function App() {
  return <SwipeDismiss />
}

Props

PropTypeDefaultDescription
titlestring'Release notes ready'Configures the title option.
descriptionstring'Drag sideways or use the dismiss contr...Configures the description option.
thresholdnumber80Configures the threshold option.
onDismissunknown-Configures the on dismiss option.
classNamestring''Additional CSS classes for the outer element.