KQ-349 · TURN/MODAL
Turn Modal
A card that lifts, travels to the centre, and turns over on Y into a focus-trapped dialog — the flip and the travel are one motion, so the dialog face comes around mid-flight and is never visible early. Closing reverses the same path back to the card. Where morph-dialog reshapes the trigger into the dialog, this one turns it over, which is the right device when the card and the dialog are two faces of the same object.
KQ-349 · TURN/MODAL
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/turn-modal
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| front | React.ReactNode | — | The card face at rest. |
| title | string | — | Accessible name of the dialog face. |
| open | boolean | — | Controlled open state; pair with onOpenChange. |