(feature): NepaliDatePicker component should be able to display formatted date.

[dipbazz]

As of now NepaliDatePicker component displays the date in YYYY-MM-DD format only, but if there is an option to display a formatted date it would be a great enhancement.

Current behavior.

import NepaliDatePicker from '@zener/nepali-datepicker-react';
import '@zener/nepali-datepicker-react/index.css';

const App = () => {
  const [value, setValue] = useState()
  return (
    <NepaliDatePicker
      value={value}
      onChange={(e) => {
        setValue(e);
      }}
      placeholder="Select date"
    />
  );
};

Output

Expected behavior.

import NepaliDatePicker from '@zener/nepali-datepicker-react';
import '@zener/nepali-datepicker-react/index.css';

const App = () => {
  const [value, setValue] = useState()
  return (
    <NepaliDatePicker
      value={value}
      onChange={(e) => {
        setValue(e);
      }}
      placeholder="Select date"
      format="MMMM DD, YYYY"  // add a format props that will format the date in component.
    />
  );
};

Output

[tulsiojha]

Hi @dipbazz, I can enable custom format for Datepicker component but then we will lose the ability to set date by typing in the text field.

[dipbazz]

Hi @tulsiojha, I was not aware about the ability to set date by typing. But is it required because most of the time people will use the picker options in my opinion. If you are concerned about the screen reader then may be the component should have some property to identify as screen reader where user can type the date only on the specified format. Can this be a solution? Or else based on the format the option to be able to type the date can be preserved or maybe there can be a flag specifies about the date that can be set with typing. Let me hear about your opinion.

[tulsiojha]

@dipbazz, I agree with you. Users would likely prefer selecting a date rather than typing it in manually. I will remove manual typing in and add format prop for input box.