Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Poll Creator CRUD Block for Solid

A poll builder and its results side by side: one form that makes and edits a poll, answers that lock once the first vote lands, a Closed switch, and a delete that asks first and leaves an Undo.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Build a team poll and watch it fill in with this poll creator for Solid with Ark UI. A hairline frame with a plus mark on each corner holds a Native Select for the poll and two panes. At the start, the builder: a question, two to six answers with a remove button each, and two Switch controls, Several answers per person and Closed. At the end, the results from typed votes: counts and percentages that add to 100 by largest remainder and a bar per answer in foreground weights, which are also a sample ballot. The same form makes and edits a poll, and Save poll is the one Shine Button. Before any vote everything edits. After the first vote the answers can be renamed but not added or removed, and the several-answers switch is locked: "Votes exist: answers are locked". Cast a vote tries the lock; a closed poll takes no votes. Delete poll opens an Alert Dialog, "This poll and its 41 votes will be removed", and the foot offers Undo. For team polls, quick surveys and any form that locks once data exists.

FAQ

How do I fill it with my polls?

Edit POLLS. A poll has a question, a several flag, a closed flag and its choices, each with an id, a text and a votes count typed as a number. Percentages are derived by sharesOf, which floors every share and gives the spare points to the largest remainders so the column always adds to 100.

What exactly locks after the first vote?

Adding and removing answers, and the Several answers per person switch. Renaming an answer stays open, and so do the question and the Closed switch. The builder says so beside the answers, and a press on a locked control answers in the polite line instead of doing nothing silently. Votes stay with their answer through a rename because they follow its id.

How does the one form create and edit?

Choosing New poll, or the last option of the select, opens the form blank and the button reads Create poll; choosing a saved poll loads it and the button reads Save poll. The form is staged: nothing changes until you save, Revert puts the saved version back, and the select refuses to switch while there are unsaved changes.

What does deleting do?

Delete poll asks first in an Alert Dialog that names the poll and its votes, with Keep poll as the first choice. Confirming removes the poll, shows the next one and leaves "Undo deleting" in the foot, which brings it back with its votes. Nothing times out.

What stays local, and how do I wire it to a real API?

Polls and votes live in React state in this tab and the vote button is a sample: a reload brings back the three polls and nothing is sent. In your app save in save, count the vote on the server in cast (one per person, from the signed-in user) and read the totals back.