# Time slots

Time slots: a free component, built on your design tokens, to use when someone wants to book or move an appointment and needs to pick one of the free times. Free times grouped by day, one button per time, with the time zone stated and a plain line for a day with nothing free.

Prompt: Add the OpenDesigner component time-slots to this project: https://opendesigner.dev/library/time-slots.html. Keep its markup and states; map its --ds-* variables to my tokens.

States: picked, almost full, no times that day, hover, focus, disabled, wraps on a phone.

Accessibility: Each day is a labelled group; each time is a button named with its time and day ("11:00, Tue 18 Nov"), and the picked one is marked with aria-pressed.

File: https://opendesigner.dev/library/time-slots.html

Catalog entry (parts, data limits, states, tokens): https://opendesigner.dev/library/time-slots.json

Download: `curl -fsSLo time-slots.html https://opendesigner.dev/library/time-slots.html`