Hold To Confirm

Below is a hold to confirm button, long press it to confirm a particular task maybe form submission, payment confirmation etc.

HoldToConfirm

Installation

$ pnpm dlx shadcn@latest add https://pulseui-henna.vercel.app/registry/HoldToConfirm.json

Props

PropTypeisCompulsoryDescription
children
React.ReactNode
true

The children that is wrapped inside the component's opening and closing tags

confirmationMessage
string
true

The message to be shown when the confirmation is over

className
string
false

Tailwind classes to be passed to style the button

onConfirmation
(val: boolean) => void
true

Sets the confirmed state to be true or false

Usage