[BUG] - DateRangePicker throws an error when I clear any time data

[uigywnkiub]

NextUI Version

2.4.2

Describe the bug

DateRangePicker throws an error when I clear any time data. Select any field value and delete numbers to zero.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Select any number field in DateRangePicker. 2. Clear the field.

Expected behavior

I guess it must be 0 or an empty field without throwing an error.

Screenshots or Videos

My code

type TProps = {
  selectedDate: RangeValue<DateValue>
  onDateSelection: (dateRange: RangeValue<DateValue>) => void
}

function MonthPicker({ selectedDate, onDateSelection }: TProps) {
  return (
    <div className='mb-6 flex justify-between'>
      <div>
        <DateRangePicker
          label='Select a date range'
          labelPlacement='outside'
          value={selectedDate}
          onChange={onDateSelection}
        />
      </div>
    </div>
  )
}

export default memo(MonthPicker)

Video

https://github.com/nextui-org/nextui/assets/29861553/b6919b58-85c2-452d-b3ef-d77bd1526ac0

On your site also error.

Operating System Version

• OS: macOS

Browser

Chrome

[linear[bot]]

ENG-1090 [BUG] - DateRangePicker throws an error when I clear any time data

[ShrinidhiUpadhyaya]

When you clear the field the value becomes null. You could make this change const startYear = startDate && format(startDate, "y")

[ShrinidhiUpadhyaya]

I could reproduce the error in stories and in docs (https://nextui.org/docs/components/date-range-picker#presets).

@wingkwong can i work on this and create a PR?

[wingkwong]

@ShrinidhiUpadhyaya Assigned. Feel free to ping me if you have any questions.