@react-shamsi-salmanfood/calendar

Jalali calendar

Let's start by displaying a very simple Jalali calendar using react-shamsi. We do it by import the styles and the component itself like so:

import { Calendar } from "@react-shamsi/calendar";
import "@react-shamsi/calendar/dist/styles.css";

export default function Example() {
  return <Calendar />;
}

Configuration

Now we are going to explore every single prop that could be passed to Calendar.

Prop name	Description	Default value
highlightToday	Highlights the current day that is displayed in the calendar.	true
onChange	Function that is called when the user selects a date	n/a
activeDate	Controls the active date in the calendar	n/a
defaultActiveDate	Sets the default date in the calendar without explicitly controlling it.	n/a
theme	Customizes how the calendar looks. Has 3 pre-built themes that are dark, darkRed and light and also could have a completely customized theme. For more information on how to customize the calendar's appearance, please visit the following section.	light
showGoToToday	When enabled, it shows the go to today button which is written as: برو به امروز	true
minDate	When you pass a date to this prop, the user can't select any date older than the minDate.	n/a
maxDate	When you pass a date to this prop, the user can't select any date newer than the maxDate.	n/a
disabledDates	When a list of dates is passed to this prop, those dates will become unselectable	[]
showFooter	Controls whether or not the footer should be shown	true
disableTransitions	When set to true, it disables all the transitions across the calendar.	false
bodyTransition	Can be set to either of these options: zoomIn, zoomOut and fade	zoomIn
showFridaysAsRed	When set to true, any friday appearing on the calendar will appear as red/selected color in the theme.	true
months	Names of the 12 months as an array.	["فروردین","اردیبهشت","خرداد","تیر","مرداد","شهریور","مهر","آبان","آذر","دی","بهمن","اسفند",]
onConfirm	Function that gets called when the user clicks the confirm button	n/a
onCancel	Function that gets called when the user clicks the cancel button	n/a