UNPKG

@demark-pro/react-booking-calendar

Version:

A responsive customizable React Booking calendar with overbooking protection

55 lines (40 loc) 1.42 kB
# React Booking Calendar <img width="394" alt="React Booking Calendar screenshot" src="https://github.com/demark-pro/react-booking-calendar/assets/87781788/44d84296-c404-4a40-8f5f-1c4f3530bbe4"> React Booking Calendar is a React library for monthly and scrollable booking calendars with built-in overbooking protection. Documentation and examples: [https://demark-pro.github.io/react-booking-calendar/](https://demark-pro.github.io/react-booking-calendar/) ## Installation ```bash npm install @demark-pro/react-booking-calendar ``` `react` and `react-dom` are peer dependencies. ## Quick Start ```tsx import { useState } from "react"; import { Calendar } from "@demark-pro/react-booking-calendar"; import "@demark-pro/react-booking-calendar/dist/react-booking-calendar.css"; export function BookingCalendar() { const [selected, setSelected] = useState([null, null]); return ( <Calendar selected={selected} reserved={[ { startDate: new Date(2030, 4, 12, 14, 0), endDate: new Date(2030, 4, 14, 10, 0), }, ]} onChange={setSelected} /> ); } ``` ## Exports - `Calendar` - `ScrollableCalendar` - `getProtectedTime` - `getProtectedInterval` For styling, custom components, and full API reference, use the documentation site: [https://demark-pro.github.io/react-booking-calendar/](https://demark-pro.github.io/react-booking-calendar/)