React with p5.js

I'm trying to use p5 library with react. everything is working fine except I can not use some of the p5s functions like: keyPressed(), keyReleased(). while functions such as mouseClicked() and mousePressed() work just fine.

const setup = (p5, canvasParentRef) => { // use parent to render the canvas in this ref // (without that p5 will render the canvas outside of your component) console.log(props.test) const cnv = p5.createCanvas(500, 500).parent(canvasParentRef); plr = new Player(p5.width / 2, p5.height / 2); food = new Food(p5); cnv.mouseClicked((event) => { console.log(event); }) cnv.keyReleased((event) => { console.log(event); }); }; 

this is what the code looks like. mouseClicked gives no errors while keyReleased and other functions which are related to keyboard input give error saying TypeError: cnv.keyReleased is not a function