Slide to deploy
Executed
Slide to Confirm
A high-precision tactile slider with physical drag constraints, 75% magnetic gravity latch pocket, and spring recoil return. Engineered for irreversible production triggers.
Dependencies
motionlucide-reactclsxtailwind-merge
Interaction
Constrained linear drag track with 75% magnetic latch detent. If released below the 75% gravity threshold, high-stiffness spring recoil returns puck to origin. Reaching 75% snaps puck to lock position and triggers irreversible execution.
Props
| Prop | Type | Description |
|---|---|---|
| label | string | Label displayed inside track during idle or sliding state. |
| confirmedLabel | string | Label displayed upon successful confirmation. |
| onConfirm | () => void | Callback fired when slide passes 75% magnetic latch. |
| onReset | () => void | Callback fired when puck resets back to idle position. |
| autoResetTimeout | number | Milliseconds before auto-resetting back to idle (0 to disable). |
| disabled | boolean | Disables dragging and keyboard interaction. |
| className | string | Additional classes applied to outer wrapper. |
MIT License. Free to use in personal and commercial projects. Built for Peel UI.