How to alter the html in the react-calendar?

Question

I am designing a calendar modal, for which I have used the react-calendar npm package ( https://www.npmjs.com/package/react-calendar ), I am able to alter the CSS of the package by overwriting the calendar.css in the dist folder with a local copy, but I don't understand how can I alter the HTML of the package, I have to add a text on the very top and remove few navigational buttons from the navigation panel. Please refer to the pic below, for reference. 1st pic: what I have done so far

2nd pic: what I want to achive

Answer 1

In the documentation their are few props mentioned amongst which use navigationLabel as show below;

<Calendar
 onChange={this.smallCalenderChange}
 value={this.state.date}
 navigationLabel={() => <p>Choose Date</p>}
/>

the navigationLabel props takes a component as an argument where you can specify the header for the calendar, in my case I have given the following:- () => <p>Choose Date</p>