Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Event RSVP Calendar Block for Solid

A community supper reply with Going, Maybe and Can't go, plus-ones that need a seat, a note for the hosts, a live headcount by group, a bar of 24 seats and a waitlist when the party does not fit.

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

Collect replies for a community supper with this event RSVP calendar for Solid with Ark UI. A hairline frame with a plus mark on each corner opens on a reply band for a Saturday supper: three native radio cards (Going, Maybe, Can't go), a NumberInput for plus-ones from 0 to 3 that only works when you are going, a Textarea for the hosts that opens once you have chosen, and "Reply by Fri 16 Oct, in 2 days", worked out from a fixed 14 October 2026. Below it a headcount band shows the 24 seats on a Progress bar and four groups (Going in seats, Maybe, Can't go and Waitlist) with each person's initials, and it moves as you choose. If your party does not fit in the seats that remain, you move to the waitlist and the sentence under the groups says which place you hold. The primary ShineButton, "Send reply", says "Saved in this demo. Nothing was sent." The bands are ruled by Guides. For community events, clubs and any invitation that needs a headcount.

FAQ

How do I use my own guests?

Edit GOING, MAYBE, DECLINED and WAITING: each person has a name, initials and the number of guests they bring. CAPACITY is the number of seats, and the seats already held are the sum of the going people and their guests. The bar, the groups and the waitlist rule come from those.

Why is today always 14 October?

Nothing in the block reads the clock. AS_OF is the one moment it treats as now, and every day count, derived date and ring comes from it, so the block looks the same on any day and in a screenshot. To follow the real date, set AS_OF from your own clock or server and keep the rest as it is.

How does the block decide who fits?

Your party is you plus your plus-ones. If the seats already held plus your party are 24 or fewer, you are in the Going group; otherwise you join the waitlist behind the people already there, and the sentence says your place. Lowering the plus-ones can move you back in.

Why are plus-ones disabled until I say I am going?

Guests come when you do, so the field is part of the Going reply. It stays in place, disabled, so the layout never moves, and it shows zero while you are not going, so no guest is counted. Arabic-Indic digits typed into it are read as numbers.

How do people appear in the groups?

As initials in small circles, with the full name and any plus-ones in text that only screen readers hear. At most nine show per group, and the count beside the group's name gives the total (seats for Going).

What stays local, and how do I wire it up?

Everything. Send reply only marks the reply as saved in the page and resets on reload; nothing goes to the hosts. To make it real, post the reply, plus-ones and note from send to your own API and start the groups from what it returns.