Prevent onClick firing from overlapping components without preventDefault?

Question

I have a file chooser input that is placed over another element (the green square). The green square has an onClick function that launches a modal. When I click on