rn-react-native-calendar

This is a calendar package for react native

Installation

npm install rn-react-native-calendar

Note

Week Calendar Usage

import {WeekCalendar} from "rn-react-native-calendar"


const App =()=>{
    const items = {
        '2022-04-28':{},
        '2022-05-03':{}
    }
    return(
        <View>
            <WeekCalendar items={items} itemsOnThisDate={(items)=>console.log(items)} />
        </View>
    )
}

Week Calendar Props

| Prop | description | type |defualt value | | ------- | --- | --- | ----| | items | items which you want to be marked on calendar | object | {} | | buttonColor | color on left and right button background | string |'#FFEADF' | | selectedDateColor | selected date background Color | string |'#ff5a3d' | | todayDateColor | today's date backgroundColor | string |'gray' | | itemsOnThisDate | callback which triggers when you click on date with items data | function | (item)=>{ } |

CalendarModal Usage

import {CalendarModal} from "rn-react-native-calendar"

const App =()=>{
    const [showCalendar,setShowCalendar] = useState(false)
     const [date,setDate] = useState(new Date())
    const items = {
        '2022-04-28':{},
        '2022-05-03':{}
    }
    const onDayPressChanges = (date)=>{
    
    return(
        <View>
            <CalendarModal 
            items={items}
             currentDate={date} 
            visible={showCalendar} 
            onDayPress={(date)=>onDayPressChanges(date)} 
            onDismiss={()=>setShowCalendar(false)} 
            selectedDateColor={'#ff5a3d'}
            
            />
        </View>
    )
}

CalendarModal Props

| Prop | description | type |defualt value | | ------- | --- | --- | ----| | items | items which you want to be marked on calendar | object | {} | | visible | should show calendar modal or not | boolean | false | | selectedDateColor | selected date background Color | string |'#ff5a3d' | | onDayPress | callback triggered when a day is pressed | function | (data)=>{ } | | onDismiss | callback which triggers when calendar modal closes | function | ()=>{ }|

Contributing

feel free to contribute

License

MIT