shadcn.io is not affiliated with official shadcn/ui
Feedback Votes Changelog Block for Ark UI
Four release notes you can vote on: Yes and No toggles that move a count by one and back, a share bar, and a No that opens a reason field with an honest local Send.
Installation
Overview
A release-note feedback changelog for React with Ark UI, written for Thumbwick, a fictional docs-feedback widget. A header whose sentence is counted from the votes sits over a band of four releases, newest first, each with its version, day, title and a line on what changed. Beside each (under it on a phone) "Was this useful?" has a Yes and a No toggle. A vote moves the count by one, pressing the same toggle again takes it back and the other one swaps the vote. The share that said yes is a foreground bar and a number that follow the counts. Choosing No opens a note field, "What was missing?", and a Send button; sending folds it away and a status line says "Thanks, sent." and that the note stays on this page. It's built from Guides, Toggle Group, Collapsible, Textarea and Button, with CSS transitions for the bar. For docs and release notes that ask readers whether they helped. The votes are example data.
FAQ
How do I change the notes and the votes?
Edit NOTES at the top of the file. A note has a version, an ISO date, a title, a summary and the up and down votes from everyone but the visitor. The share, the bar and the header's total are computed from those and from the visitor's own vote.
Does Send send anything?
No. The reason stays in this page's state and the status line says so. The send handler has a comment where your own endpoint goes. The note is optional, so a No can be sent without one.
Why can I take a vote back?
Each row is a multiple-select toggle group that keeps at most one pressed: pressing the other one swaps, pressing the same one clears. The counts move by one and back, so a mis-click costs nothing.