license import React from 'react' ; import { styled , StyledComponentProps , } from '../../theme' ; import { BaseCalendarComponent , BaseCalendarProps , } from './baseCalendar.component' ; import { CalendarPickerCellProps } from './components/picker/calendarPickerCell.component' ; import { DateBatch } from './service/calendarData.service' ; import { RangeDateService } from './service/rangeDate.service' ; import { CalendarRange } from './type' ; export interface RangeCalendarProps < D = Date > extends StyledComponentProps , BaseCalendarProps < D > { range ? : CalendarRange < D > ; onSelect ? : ( range : CalendarRange < D > ) => void ; } export type RangeCalendarElement < D = Date > = React . ReactElement < RangeCalendarProps < D > > ; extends React . Component property property property property property property property property property property property property property property property overview-example overview-example @ styled ( 'Calendar' ) export class RangeCalendar < D = Date > extends BaseCalendarComponent < RangeCalendarProps < D > , D > { static defaultProps : Partial < RangeCalendarProps > = { ... BaseCalendarComponent . defaultProps , range : { } , } ; private rangeDateService : RangeDateService < D > = new RangeDateService ( this . dateService ) ; constructor ( props ) { super ( props ) ; this . createDates = this . createDates . bind ( this ) ; this . selectedDate = this . selectedDate . bind ( this ) ; this . onDateSelect = this . onDateSelect . bind ( this ) ; this . isDateSelected = this . isDateSelected . bind ( this ) ; this . shouldUpdateDate = this . shouldUpdateDate . bind ( this ) ; } protected createDates ( date ) { return this . dataService . createDayPickerData ( date , this . props . range ) ; } protected selectedDate ( ) { return this . dateService . today ( ) ; } protected onDateSelect ( date ) { if ( this . props . onSelect ) { const range = this . rangeDateService . createRange ( this . props . range , date ) ; this . props . onSelect ( range ) ; } } protected isDateSelected ( date ) { return false ; } protected shouldUpdateDate ( props , nextProps ) { const dateChanged = this . dateService . compareDatesSafe ( props . date . date , nextProps . date . date ) !== 0 ; if ( dateChanged ) { return true ; } const selectionChanged = props . selected !== nextProps . selected ; const disablingChanged = props . disabled !== nextProps . disabled ; const rangeChanged = props . range !== nextProps . range ; const rangeStartPlaceChanged = props . firstRangeItem !== nextProps . firstRangeItem ; const rangeEndPlaceChanged = props . lastRangeItem !== nextProps . lastRangeItem ; const shouldUpdate = selectionChanged || disablingChanged || rangeChanged || rangeStartPlaceChanged || rangeEndPlaceChanged ; if ( shouldUpdate ) { return true ; } return props . eva . theme !== nextProps . eva . theme ; } }