Nepali-datepicker-and-dateinput

The aim of this package is to enable user to input nepali date and also select date from nepali calendar from date 1970-01-01 BS to 2099-12-30.

Installation

``bash npm install --save nepali-datepicker-and-dateinput`

!Calendar-1 !Calendar-2

`Usage`

`js import NepaliDatepicker from 'nepali-datepicker-and-dateinput';

export Datepicker = () => {

const handleDateChange = (name, dateInMilli, bsDate, adDate) => { console.log(name); // Prints the field name of date input console.log(dateInMilli); // Prints the equivalent date millisecond console.log(bsDate); // Prints the bsDate console.log(adDate); // Prints the equivalent adDate }

return ( id="nepali-date" onChange={handleDateChange} label="नेपाली मिति" defaultDate="2077-01-01" defaultFormat /> ); }``

Props

| Props | Type | Default Value | Description |
| ----------------------- | :-------------------: | :----------------------------------------: | :-------------------------------------------------------------------------------------------------: |
| id | string | "nepali-calendar" | The identifier of date field . If there are more than one date input in form , then it is required. |
| label | string | "मिति" | Label for date input |
| showDefaultDate | Boolean | false | If true , today nepali date is shown in date input by default |
| defaultDate | String or Long | | This props takes date either in "YYYY-MM-DD" format or directly takes equivalent millisecond |
| defaultFormat | Boolean | false | If defaultDate props has value in format "YYYY-MM-DD" then this prop should be set as true |
| disabled | Boolean | false | If date input field needs to be disabled then this props should be set as true |
| locale | string ("ne" or "en") | "ne" | If "ne" then all text in calendar is shown in nepali else shown in english |
| inputContainerClassName | string | | Can send custom classname for date input field |
| maxDateErrorMessage | string | "२०९९ साल भन्दा बढी मिति समावेश हुने छैन" | Error message, shown if date is more then maximal date |
| minDateErrorMessage | string | "१९७० साल भन्दा कम मिति समावेश हुने छैन" | Error message, shown if date is less then minimal date |
| invalidFormatMessage | string | "मान्य ढाँचामा नभएको मिति समावेश हुने छैन" | Message displaying in text field if date is invalid |
| invalidDateMessage | string | "पात्रोमा नभएको मिति समावेश गरिने छैन" | Message displaying in the text field if date is not in the calendar . For example 2077-12-35 |

Usage

js
import NepaliDatepicker from 'nepali-datepicker-and-dateinput';

export Datepicker = () => {

  const handleDateChange = (name, dateInMilli, bsDate, adDate) => {
    console.log(name); // Prints the field name of date input
    console.log(dateInMilli); // Prints the equivalent date millisecond
    console.log(bsDate); // Prints the bsDate
    console.log(adDate); // Prints the equivalent adDate
  }

  return (
          id="nepali-date"
      onChange={handleDateChange}
      label="नेपाली मिति"
      defaultDate="2077-01-01"
      defaultFormat
    />
  );
}

Props