Browse components
Sling Button
Pull the button back on rubber bands and let go: past the threshold it fires and whips home with overshoot. A normal click works too.
Installation
npx shadcn@latest add @glint-ui/sling-buttonFirst time using @glint-ui? Add the registry to components.json once, or install by URL: npx shadcn@latest add https://glint-ui-seven.vercel.app/r/sling-button.json
Usage
import { SlingButton } from "@/components/ui/sling-button";
<SlingButton threshold={50} onClick={() => fire()}>Launch</SlingButton>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | — | Button label. |
| threshold | number | 50 | Px the button must be pulled back to fire on release. |
| elasticity | number | 0.5 | How far the button follows the pointer while pulled. |
| className | string | — | Extra classes for the root element. |