# Events & bookings app UI for React Time and places people book: calendars, crews, desks, tickets and visitors. 14 live React screens in [Beamline](https://beamline.io/), in working order, each in nine looks. ## Screens 1. [Team calendar](https://beamline.io/components/team-calendar.md): A team's schedule: the people and shared calendars to show (each its colour), a month to jump by, who is out this week, and the week, day or month of… 2. [Day agenda](https://beamline.io/components/day-agenda.md): One person's days with notes, tasks and calendar events side by side, each kept as what it is. A task's scheduled day, deadline, reminder and repeat are… 3. [Crew booking](https://beamline.io/components/crew-booking.md): Booking crew for a project: each person with a strip of the project's days, days in the same state joined into one run said once (booked solid, available… 4. [Resource booking](https://beamline.io/components/resource-booking.md): Booking something shared (a room, a van, a camera kit). Choose what, then either a free hour on a day: a grid of starts the app says are free (a taken… 5. [Resource rules](https://beamline.io/components/resource-rules.md): Each person's scheduling rules beside their day, the day board leading: role, available (an unavailable day filled in the danger tint and said, a job… 6. [Desk booking](https://beamline.io/components/desk-booking.md): Desks in an office for the people who book them and the admin who sets how far ahead. Your days over the next weeks: booked with a desk, free to book… 7. [Linked appointments](https://beamline.io/components/linked-appointments.md): A drop-off and a pickup kept as one linked pair on the week's calendar (the shared event calendar, day view on a phone), with the car's stay drawn… 8. [Waitlist desk](https://beamline.io/components/waitlist-desk.md): A front desk's waitlist beside the day's book: who is waiting (filters as chips, the queue's count apart from the day's), the day's bookings and the… 9. [Visitor desk](https://beamline.io/components/visitor-desk.md): An office front desk's visitors. Invite a meeting's guests from the calendar: colleagues are shown but never invited, guests without an email are said… 10. [Issued ticket](https://beamline.io/components/issued-ticket.md): One issued event ticket at the door, led by the ticket itself: what it admits to (event and venue), when, the section, seat and who it admits, and its… 11. [Itinerary](https://beamline.io/components/itinerary.md): A trip's days where every event says who sees it, in words: everyone, only Ana and Ben, or hidden from Leo. The same rules give each traveller their own… 12. [Trip budget](https://beamline.io/components/trip-budget.md): A trip's money against its plan, in the trip's own currency. The budget (set or changed in place; a refused save keeps what was typed), what's spent and… 13. [Proposal payments](https://beamline.io/components/proposal-payments.md): A travel proposal's money from the agent's side to the client's. Pricing: the price rule (markup on supplier cost, a fixed price, or net), what the… 14. [Project periods](https://beamline.io/components/project-periods.md): A project's time periods (build, show, teardown) on one time scale, the thing being planned: each period a bar across its days with the crew and gear… ## The parts they're built from - [Button](https://beamline.io/components/button.md) (free): in 14 of these screens - [Label](https://beamline.io/components/label.md) (free): in 14 of these screens - [Spinner](https://beamline.io/components/spinner.md) (free): in 14 of these screens - [Select](https://beamline.io/components/select.md) (free): in 12 of these screens - [Tooltip](https://beamline.io/components/tooltip.md) (free): in 11 of these screens - [Avatar](https://beamline.io/components/avatar.md) (free): in 10 of these screens - [Segmented control](https://beamline.io/components/segmented-control.md) (free): in 10 of these screens - [Text morph](https://beamline.io/components/text-morph.md) (free): in 10 of these screens - [Checkbox](https://beamline.io/components/checkbox.md) (free): in 7 of these screens - [Input](https://beamline.io/components/input.md) (free): in 7 of these screens - [Badge](https://beamline.io/components/badge.md) (free): in 6 of these screens - [Bottom sheet](https://beamline.io/components/bottom-sheet.md) (free): in 6 of these screens - [Calendar](https://beamline.io/components/calendar.md) (free): in 5 of these screens - [Number field](https://beamline.io/components/number-field.md) (free): in 5 of these screens - [Popover](https://beamline.io/components/popover.md) (free): in 5 of these screens - [Switch](https://beamline.io/components/switch.md) (free): in 5 of these screens - [Date picker](https://beamline.io/components/date-picker.md) (free): in 4 of these screens - [Empty state](https://beamline.io/components/empty-state.md) (free): in 4 of these screens - [Skeleton](https://beamline.io/components/skeleton.md) (free): in 4 of these screens - [Textarea](https://beamline.io/components/textarea.md) (free): in 4 of these screens - [Dropdown menu](https://beamline.io/components/dropdown-menu.md) (free): in 3 of these screens - [Sheet](https://beamline.io/components/sheet.md) (free): in 3 of these screens - [Time picker](https://beamline.io/components/time-picker.md) (free): in 3 of these screens - [Alert](https://beamline.io/components/alert.md) (free): in 2 of these screens - [Event calendar](https://beamline.io/components/event-calendar.md): in 2 of these screens - [Multi-select](https://beamline.io/components/multi-select.md) (free): in 2 of these screens - [Radio cards](https://beamline.io/components/radio-cards.md) (free): in 2 of these screens - [Radio group](https://beamline.io/components/radio-group.md) (free): in 2 of these screens - [Recurrence editor](https://beamline.io/components/recurrence-editor.md) (free): in 2 of these screens - [Tabs](https://beamline.io/components/tabs.md) (free): in 2 of these screens Install the parts you need in your React app as compiled packages or editable source. [Get Beamline](https://beamline.io/checkout?pack=complete) · [Connect your agent](https://beamline.io/connect) Next: [Salon & fitness](https://beamline.io/components/apps/salon-fitness.md) · [All apps](https://beamline.io/components/apps.md) Part of [Beamline UI: polished, editable React components and complete screens for custom applications](https://beamline.io/). [Build your own style from any look; tokens, fonts, radii, motion; not only colours](https://beamline.io/docs/customize).