OOO strip where days tint amber for half-days and rose with strikethrough for full out-of-office days.
The import and the props worth knowing about, in one place.
import { Calendar24 } from "@/components/beste/piece/calendar24";
<Calendar24
days={[
{
"day": "Mon",
"date": 27
},
{
"day": "Tue",
"date": 28
},
{
"day": "Wed",
"date": 29,
"blocked": true
},
{
"day": "Thu",
"date": 30,
"off": true
},
{
"day": "Fri",
"date": 1,
"off": true
},
{
"day": "Sat",
"date": 2
},
{
"day": "Sun",
"date": 3
}
]}
reason="Out of office · Apr 30 – May 1"
bordered={false}
/>