ui/calendar.tsx

slash-admin · src/ui/calendar.tsx · typescript · MIT
ui

A reusable React calendar UI component for date selection in applications.

// Source: https://github.com/dingyi214/slash-admin | License: MIT | Copyright 2023 d3george
// Provided via justclaw.it.com; keep this notice with the code.
import * as React from "react"
import { ChevronLeft, ChevronRight } from "lucide-react"
import { DayPicker } from "react-day-picker"

import { cn } from "@/utils/index"
import { buttonVariants } from "@/ui/button"

function Calendar({
  className,
  classNames,
  showOutsideDays = true,
  ...props
}: React.ComponentProps<typeof DayPicker>) {
  return (
    <DayPicker
      showOutsideDays={showOutsideDays}
      className={cn("p-3", className)}
      classNames={{
        months: "flex flex-col sm:flex-row gap-2",
        month: "flex flex-col gap-4",
        caption: "flex justify-center pt-1 relative items-center w-full",
        ca

... (truncated -- full source via MCP)

See the full source, get the GitHub permalink, and search for more like it.

Get a free API key