Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA party size stepper, a date field and lunch and dinner time slots in which large parties only see the seatings the kitchen accepts them at. Use this when a table booking depends on how many people are coming.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it when a table booking depends on how many people are coming.
Do not use it for fixed-length appointments (appointment-booker); here the party size changes which times exist.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
| onValueChange | (booking: { date; time; party } ) => void | - | Called when date, time and party are all chosen. |
| largePartyFrom | number | 7 | Party size at which only largePartyTimes are offered. |
| largePartyTimes | string[] | 18:00, 18:30, 19:00 | Seatings for large parties. |
| fullyBooked | string[] | [] | Slots already taken. |
| maxParty | number | 12 | Largest party. |
The pattern ships with a Testing Library test (restaurant-table-time.test.tsx) that covers the party stepper limits, large-party seatings and clearing a time that no longer exists.