Calendar14() — ui Function Reference

Architecture documentation for the Calendar14() function in calendar-14.tsx from the ui codebase.

Function tsx ComponentRegistry ChartRegistry

Entity Profile

ComponentRegistry→ ChartRegistry→ Calendar14() — ui Function Reference

Dependency Diagram

graph TD
  a280b962_4559_7f03_1bee_f595e765cb2a["Calendar14()"]
  81618cd2_4022_b1ef_c52e_fb417c7e238c["calendar-14.tsx"]
  a280b962_4559_7f03_1bee_f595e765cb2a -->|defined in| 81618cd2_4022_b1ef_c52e_fb417c7e238c
  style a280b962_4559_7f03_1bee_f595e765cb2a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

deprecated/www/__registry__/default/blocks/calendar-14.tsx lines 7–32

export default function Calendar14() {
  const [date, setDate] = React.useState<Date | undefined>(
    new Date(2025, 5, 12)
  )
  const bookedDates = Array.from(
    { length: 12 },
    (_, i) => new Date(2025, 5, 15 + i)
  )

  return (
    <Calendar
      mode="single"
      defaultMonth={date}
      selected={date}
      onSelect={setDate}
      disabled={bookedDates}
      modifiers={{
        booked: bookedDates,
      }}
      modifiersClassNames={{
        booked: "[&>button]:line-through opacity-100",
      }}
      className="rounded-lg border shadow-sm"
    />
  )
}