About this block

Room Booking Timeline is the room picker for a requested slot: Thursday, June 18 from 1:00 pm to 2:00 pm for 4 people. Each of the four rooms is a horizontal day track from 9a to 5p with its existing bookings drawn as filled blocks and the requested window outlined in a dashed border across every row, so a free room reads at a glance. Huddle 2 carries a Best fit badge on a highlighted row, two rooms show a Book button, and Boardroom A clashes with the slot and reads as Busy.

Rooms are one const array with seats, location, and a busy array of start and end hours; two small helpers turn those hours into left and width percentages against the nine hour day. A legend up top labels the booked blocks and the requested slot, and a footer notes rooms release automatically when a meeting is cancelled early.

When to use

Reach for this block when a person has a time locked and needs to attach a room without opening each calendar in turn. Wire the room list to your resource directory and each busy array to that room bookings for the day.

A natural flow around it on an Application Pro page:

Before

• Availability grid
• Event detail panel

After

• Booking confirmation card
• Maps location

What you can display

One strong use is the meeting room picker in a scheduling tool. Other timeline uses:

• Desk booking. Swap rooms for hot desks with a floor and zone in the meta line.
• Equipment reservation. Cameras or vehicles as rows with their current checkout blocks on the track.
• Studio slots. Recording rooms with a capacity and a gear note in place of the seat count.

Tip: sort the best fit room to the top and badge it; a picker that decides for the common case still leaves the full grid open for the exceptions.