ns-appointment-pickeris used to select a date and time slot for an appointment.
ns-appointment-picker is used to select a date and time slot for an appointment. The component is comprised of an
ns-calendar to pick the date, and an
ns-slot-picker to show the available time slots.
|💚 Do's||💔 Don'ts|
|Use this when the customer needs to select a date and a time slot for an appointment||Use to select an appointment slot on a single date. Use |
|Use ||Don't force customers to use the appointment picker first if there is very poor appointment availability. Present the next available appointments in a slot picker first.|
|Use multiple appointment pickers in ns-tabs so users can easily access different types of bookings.|
The main property/attribute of
slotData. This would typically be set by setting the property through code as it is a fairly complex object.
|Array of objects representing dates.|
|Dispatched when a specific slot is selected|
The slotData array should consist of objects containing a date property and a slots property.
date: String - eg. 2020-01-28 (28th January 2020) slots: Array of objects with a name and value property
The ns-appointment-picker component can be used in the following components:
- Do you have insights or concerns to share? You can raise an issue via Github bugs.
- See all the issues already raised via Github issues.
💩 🎉 🦄 If you have any questions, contact us on Microsoft Teams in the Nucleus Design System channels.