index.tsx 625 B

12345678910111213141516171819202122232425262728
  1. import type { FC } from 'react'
  2. import type { CalendarProps } from '../types'
  3. import { DaysOfWeek } from './days-of-week'
  4. import CalendarItem from './item'
  5. const Calendar: FC<CalendarProps> = ({
  6. days,
  7. selectedDate,
  8. onDateClick,
  9. wrapperClassName,
  10. }) => {
  11. return <div className={wrapperClassName}>
  12. <DaysOfWeek/>
  13. <div className='grid grid-cols-7 gap-0.5 p-2'>
  14. {
  15. days.map(day => <CalendarItem
  16. key={day.date.format('YYYY-MM-DD')}
  17. day={day}
  18. selectedDate={selectedDate}
  19. onClick={onDateClick}
  20. />)
  21. }
  22. </div>
  23. </div>
  24. }
  25. export default Calendar