PricingCalendar
1.0.0Two-month booking calendar that shows a nightly rate on each day and highlights lower-priced nights.
npx jabkit add pricing-calendarComponent Data
- ID
- pricing-calendar
- Category
- marketing
- Version
- 1.0.0
- Added
- 2026-09-15
- Type
- block
- Keyboard nav
- Yes
- Reduced motion
- Yes
pricingcalendarbookingmarketinglodgingratestravel
Dependencies
- lucide-react
- clsx
- tailwind-merge
Examples
Default
<div className="bg-background text-foreground">
<PricingCalendar {...pricingCalendarMocks.default} />
</div>Variants
<div className="bg-background text-foreground">
<PricingCalendar {...pricingCalendarMocks.alternate} />
</div>