Descriptions:

• The DatePanel & DatePanel Position is disabled by default and is activated when you switch to multiple or range mode & the number of months is 1 (of course, these are the current settings that I applied, you can activate them in any cases).
• In Multiple or Range Picker modes, 'Only Time Picker' is disabled.
• On this page, the number of months is limited to a maximum of 3, but you can consider any number for it.
• First Day Of Week is disabled in Only Time Picker, Only Year Picker & Only Month Picker
• Number Of Months is disabled in Only Time Picker, Only Analog Time Picker, Only Month Picker & Only Year Picker
• Calendar position and animation are activated when the type is anything other than Calendar (input, button, ...).

Quick Access :

• Installation & Usage
  • npm
  • yarn
  • Basic Import
  • Important Notes
  • DatePicker
  • Calendar
  • DateObject
• Calendars & Locales
  • Descriptions
  • Calendars
  • Locales
  • Default Calendar
  • Default DatePicker
  • Persian calendar with Farsi locale
  • Persian DatePicker
  • Arabic calendar with Arabic locale
  • Indian calendar with Indian locale
  • Persian datepicker with English locale
  • Custom Calendar
• TypeScript
  • Usage
  • Adding Ref to Calendar & DatePicker
• React Hook Form
  • Online Example
  • Example Of Using React Hook Form
• DateObject
  • Descriptions
  • Current Moment
  • Adding / Subtracting Time From Original Moment
  • Other Calendar & Locales
  • Persian Calendar (Solar Hijri) With Farsi Locale
  • Arabic Calendar (Lunar Hijri) With Arabic Locale
  • Indian Calendar With Hindi Locale
  • Table of most used properties
  • New DateObject From String
  • New DateObject from javascript Date
  • Persian DateObject from javascript Date
  • New DateObject From Numbers
  • New DateObject from Unix Timestamp
  • Converting Calendars
  • Gregorian Calendar to Persian Calendar
  • Persian Calendar to Arabic Calendar
  • Arabic Calendar to Persian Calendar
  • Gregorian Calendar to Indian Calendar
• Props
• Formatting Tokens
• Component with Children
  • Calendar With Children
  • DatePicker With Children
• Multiple Mode
  • Multiple Mode
  • Custom Separator
  • DatePanel
  • Sorting Dates
  • Multiple Month Picker
  • Multiple Year Picker
• Range Mode
  • Range Picker
  • Custom Separator
  • Range Hover Effect
  • DatePanel
  • Displaying Each Days In Range
  • Range Week Picker
  • Range Month Picker
  • Range Year Picker
• Multiple Range Mode
  • Multiple Range Picker
  • Custom Separator
  • Multiple Range in onlyMonthPicker
  • Multiple Range in onlyYearPicker
• Other Pickers
  • Time Picker
  • Only Time Picker
  • Only Time Picker Meridiem
  • Hiding Seconds
  • Only Month Picker
  • Only Month Picker With Different Format
  • Only Year Picker
• Multiple Months
  • Single Mode
  • Multiple Mode
  • Range Mode
• Min & Max Date
  • Min & Max Date
  • String
  • Only MinDate
  • Only MaxDate
• Events
  • onChange (single mode)
  • onChange (Converting Selected Date To All Calendars)
  • onChange (multiple mode)
  • onOpen
  • onClose
  • onPositionChange
  • onPropsChange
  • onMonthChange
  • onYearChange
  • onFocusedDateChange
• Validation
  • Validating Input Value
  • Validating Range of Dates
• Animations
  • Transition
  • Customizing Transition#1
  • Customizing Transition#2
  • Opacity
  • Customizing Opacity
  • Size
  • Opacity & Transition #1
  • Opacity & Transition #2
• Custom Digits, Months & WeekDays
  • Descriptions
  • Digits
  • Week Days #1
  • Week Days #2
  • Months #1
  • Months #2
  • Format Months & WeekDays
  • Importing A Locale File From The date-object Package
  • Custom Locale
• Types & Custom Input
  • Descriptions
  • Input-Icon
  • Icon
  • Button
  • Custom (function)
  • Custom (component)
  • Custom (input)
  • Multiple & Range
  • Custom (multiple mode)
  • Custom (range mode)
• Customizing Calendar Days
  • Descriptions
  • Styling Days
  • Styling Weekends
  • Custom Highlight
  • Disabling Days
  • Hiding Days
  • Multiple Day-Numbers With Different Calendars & Locales
  • Adding Tiltle to Days
  • Custom Tooltip
• Customizing Header
  • Order of Header Components
  • Separator Between Month & Year
  • Disabling Navigate Buttons
  • Custom (function)
  • Custom (component)
• Calendar Position
  • Descriptions
  • Calendar Position
  • Important Points
  • Example
  • Another Examples
• DatePicker & Calendar Ref
  • Descriptions
  • Open & Close Calendar By DatePicker Ref
  • Refresh Position
  • Manually Set Year And Month In Calendar
• Appearance
  • Prime
  • Mobile
  • Changing The Text Of The Action Buttons In Mobile Mode
• Colors & Backgrounds
  • Green
  • Red
  • Yellow
  • Purple
  • Teal
  • Background Dark
  • Background Gray
  • Background Brown
• ClassNames & Styles
  • Adding ClassName To Refrence Element (input)
  • Adding Style To Refrence Element (input)
  • Adding ClassName To Popper Element (calendar)
  • Adding Style To Arrow
  • Adding ClassName To Arrow
  • Adding Style To DatePicker Container
  • Adding ClassName To DatePicker Container
• Custom Arrow
  • Descriptions
  • Disable Arrow
  • Custom Arrow
• Portal
  • Portal Mode
  • Dynamic Portal Target
• Other Examples
  • Opening Calendar On The Specified Date
  • Manually Set Year And Month In DatePicker
  • Changing Start Day Of The Week
  • Other Days
  • Custom Month Year Separator
  • Custom Month & Year In Header
  • Disabling Today Highlight
  • Displaying Week Numbers
  • Disabling Scroll Sensitivity
  • Full Year View
  • Hide On Scroll
  • Ignore Formatting
  • Disable Virtual Keyboard
  • Disable Editing
  • Placeholder
  • Disable Year Picker
  • Disable Month Picker
  • Hiding Year From Header
  • Hiding Month From Header
  • Hiding Week Days
  • Read Only DatePicker
  • Read Only Calendar
  • Disabled Calendar
  • Disabled Input
• Plugins
  • Usage
    • Availble Plugins
    • Positions
  • Date Picker Header
    • Props
    • Sizes
    • Header Right
    • Header Left
    • English Calendar with Indian Header
    • Styling Header
  • Date Panel
    • Props
    • Sort
    • Sort By Date
    • Position Left
    • Without Remove Button
    • Date Click Listener
    • Custom Header Name
    • Customizing Focused Date
  • Multi Colors
    • Props
    • Default Color
    • With DatePanel
  • Settings
    • Props
    • Settings Bottom
    • Custom Settings
    • Other Pickers
  • Weekends
    • Props
    • Default Weekends
    • Weekends: gregorian
    • Weekends: persian
    • Weekends: custom
  • Toolbar
    • Props
    • Default Toolbar
    • Sorting Buttons
    • Custom Names
  • Time Picker
    • Descriptions
    • Utilizing Step for Arrow Icons
    • Using TimePicker in Multiple Mode
    • Position Left
    • Using TimePicker in Range Mode
    • Styling TimePicker
  • Analog Time Picker
    • Default Analog Time Picker
    • Utilizing Step for Arrow Icons
    • Color & Background
    • Hiding Seconds
    • Position Bottom
    • Only Analog Time Picker
  • Range Picker Footer
    • Descriptions
    • Props
    • Default Range Picker Footer
    • Custom Names
  • Build Your Own Plugin
    • Descriptions
    • Step 1: Write Your First Plugin
    • Step 2: Detecting The Position Of The Plugin
    • Step 3: Detecting If Another Plugin Is Before Or After The Current Plugin
    • Default Props
      • Default Props Table
      • Calendar & DatePicker
      • calendarProps & datePickerProps
      • State Prop