Documentation / @jalali-js/ui-react / InlineCalendar

Function: InlineCalendar()

InlineCalendar(__namedParameters): Element

Defined in: react/src/Calendar.tsx:100

A headless month grid: it renders plain markup with data attributes (data-selected, data-today, data-outside-month, data-disabled, data-holiday) and no required CSS, so a consumer can restyle it completely. DatePicker is this same component with a default stylesheet and a popover wrapped around it.

Days blocked by rules use aria-disabled and data-disabled: clicks do nothing and the Tab order skips them, so keyboard navigation skips blocked days. Holiday tips still work on hover and focus for those days. With showHolidays, holiday days get data-holiday. With blockHolidays, those days also become unselectable.

With quickNav (default on), clicking the month or year in the header opens a month grid or a year grid, so a person can jump years ahead without paging one month at a time. Picking a year moves to the month grid; picking a month moves to the day grid.

Parameters

__namedParameters

InlineCalendarProps

Returns

Element