:dart: About

React native component which renders list of dates.

:dart: Demo

:dart: Installation

npm i react-native_horizontal_calender

:dart: Example

function App(): JSX.Element {
 
  const [receivedDate, setReceivedDate] = useState<Date>(currentDate);

  const handleDataFromCalender = (date:Date) => {
    console.log('date',date)
    setReceivedDate(date);
  };

  return (
    <View>
      <HorizontalCalender
        onPressed={handleDataFromCalender}
        populateDatesOnLastDateSelect={true}
        userSelectedDate={currentDate}
        startingDate={currentDate}
        numberOfDays={10}
      />
      <Text style={styles.sectionDescription}>{receivedDate.toISOString() }</Text>
    </View>
  );
}

:dart: Platform Support

Supports both Android and iOS.

:dart: Props

| Prop | Type | Optional | Default | Description | | -------------------- | ------ | -------- | ------------ | -------------------------------------------------------------------------------------- | | userSelectedDate | Date | No | n/a | User current date or selected date | | onPressed | (date: Date) => void | No | n/a | callback which provides selected date as an argument. | | startingDate | Date | No | n/a | Starting point of the calender| | numberOfDays | number | Yes | 10 | Number of days you want to populate| | populateDatesOnLastDateSelect | boolean | Yes | true | Use this value if you want to populate dates further on last date select| | horizontal | boolean | Yes | true | Show calender horizontal or not|