Cant import static ranges

[suhailsulu]

When I try to import staticRanges
import { staticRanges} from 'react-date-range',

I am getting undefined, so I couldn't create my own static ranges

[mkg0]

You should create predefined ranges with createStaticRanges function. You can dissect here for usage: https://github.com/Adphorus/react-date-range/blob/master/src/defaultRanges.js#L51.

const predefinedRanges = createStaticRanges([
  {
    label: 'Today',
    range() {
      return {
        startDate: defineds.startOfToday,
        endDate: defineds.endOfToday,
      };
    },
  }
]);

But you shouldn't get undefined when importing staticRanges. You have installed it with next tag, right?

[suhailsulu]

Yes, I installed using next tag.
I couldn't see any staticRanges export in https://github.com/Adphorus/react-date-range/blob/master/src/defaultRanges.js,
Is that a problem??

[mkg0]

@suhailsulu you're right. It should be defaultStaticRanges and I fixed exports too. It will be fixed after next release.
Still, you can create custom defined ranges like above comment. You can reopen if have any trouble again about it.

[dsternlicht]

Just FYI, if you want to extend the default static ranges, here's a working code sample:

import { DateRangePicker, defaultStaticRanges, createStaticRanges } from 'react-date-range';

const staticRanges = [
  ...defaultStaticRanges,
  ...createStaticRanges([
    {
      label: 'Begining of Time',
      range: () => ({
        startDate: START_DATE,
        endDate: new Date()
      })
    }
  ])
];

[Sailokeshg]

Recently it is not accepting the above structure
{
label: 'Begining of Time',
range: () => ({
startDate: START_DATE,
endDate: new Date()
})
}
It is expecting to have isSelected in this structure as
{
label: 'Begining of Time',
range: () => ({
startDate: START_DATE,
endDate: new Date()
})
isSelected : (range: Range) => boolean
}

Can someone help me how to use this. When i place this the selected range is not getting highlited