Somay ChauhanandGitHub
024913592b
* feat: Add `handleSlotSelect` prop for custom timeslot selection/reservation handling * Update custom-slot-select-flow.mdx * Update custom-slot-select-flow.mdx * refactor: rename handleSlotSelect to handleSlotReservation for clearer intent * docs: add API reference link for slot reservation api
21 lines
980 B
Plaintext
21 lines
980 B
Plaintext
## Using `handleSlotReservation` for Custom Slot Selection Flows
|
|
|
|
If you want to trigger a custom action immediately when a user selects a timeslot (before the booking form appears), you can use the `handleSlotReservation` prop. This prop allows you to intercept the slot selection event, enabling you to run custom logic—such as calling the reserve slot api's https://cal.com/docs/api-reference/v2/slots/reserve-a-slot.
|
|
|
|
**Example usage:**
|
|
|
|
```tsx
|
|
<Booker
|
|
handleSlotReservation={(timeslot) => {
|
|
// Your custom logic here
|
|
console.log("User selected timeslot:", timeslot);
|
|
// For example, call the reserve slot api's etc.
|
|
}}
|
|
// ...other props
|
|
/>
|
|
```
|
|
|
|
- When a user selects a slot, the `handleSlotReservation` function will be called with the selected timeslot as its argument.
|
|
- If you provide this prop, the default slot reservation flow will be interrupted until your custom logic is complete.
|
|
- This is useful for introducing custom slot reservation flows.
|