UNPKG

652 BTypeScriptView Raw
1import React from "react";
2
3import { addDays } from "date-fns";
4import { DayPicker } from "react-day-picker";
5
6import customStyles from "./styles/styling-modifiers.module.css";
7
8const today = new Date();
9const beforeYesterday = addDays(today, -2);
10
11export function StylingModifiers() {
12 return (
13 <DayPicker
14 mode="single"
15 selected={new Date()}
16 disabled={beforeYesterday}
17 modifiersClassNames={{
18 selected: customStyles.purpleToday
19 }}
20 modifiersStyles={{
21 disabled: {
22 // Add a line-through style to the disabled days
23 textDecoration: "line-through"
24 }
25 }}
26 />
27 );
28}