shadcn.io is not affiliated with official shadcn/ui
Workflow Templates Carousel Block for React Aria
Six automation templates in four team groups on a one-up track, each drawn as its steps with icon tiles and arrows, a label that follows the group in view and a Use template button that marks it added.
Installation
Overview
Offer starting points for automations, with this workflow templates carousel for React with React Aria. Cogwright, a workflow builder, lists six templates ordered by team (Sales, Support, Marketing, Operations). A slide has the group and a Popular word, the name, the sentence that starts it, a drawn diagram of its steps (an icon tile, a label and a detail for each, joined by arrows; stacked on a phone), and the hours it saves a week as example data. Use template is the one primary on the template in view and marks it added; the same button takes it back. A band above the track reads "Support, 2 templates" and follows the group in view. It uses Badge, Button and Guides. The product and its templates are made up.
FAQ
How do I use my own templates?
Edit TEMPLATES: keep them ordered by group, give each a title, a short name, a trigger, hours in tenths and its steps (a kind of trigger, wait, check, send, record or notify).
How does it work with a keyboard?
Tab reaches the controls in the open slide, the dots, Previous and Next. With focus inside the track, the arrow keys move between slides (mirrored in a right-to-left layout) and Home and End jump to the first and last. Previous and Next stay in the tab order at the ends and are marked unavailable instead of disabled. Slides out of view are hidden from the tab order and from screen readers.
What is announced when I use a template?
The foot reads "Added Lead alert in this demo", or "Removed Lead alert".