I found information in recharts API https://recharts.org/en-US/examples/CustomizedLabelLineChart
It is possible to create a react component as long as it returns a element, and since it's possible to add an onClick function it can behave as a button. Here's the example:
class CustomizedAxisTick extends PureComponent {
render() {
const { x, y, stroke, payload } = this.props;
return (
<g transform={`translate(${x},${y})`} onClick={()=> console.log(payload.value)}>
<text x={0} y={0} dy={16} textAnchor="end" fill="#666" transform="rotate(-35)">
{payload.value}
</text>
</g>
);
}
}
then you just need to call the component in the XAxis like this:
<XAxis tick={<CustomizedTick />} />