BUG : Using customized Axis labels does not work

I have the following code in my chart :

<XAxis label={<Hello />} />

My customized label is this :

var Hello = React.createClass({
  render: function() {
    return <div>Hello!</div>;
  }
});

When I run this code the x-axis shows with the ticks and tick values, but there is no x-axis label.

If I instead use a plain string :

<XAxis label="Hello" />

the x-axis label shows but it overlaps the tick values.

I just want an x-axis label that does not overlap the ticks.

[xenovon]

Same Issues here

[xile611]

The component <Hello /> has been rendered, but the div is rendered is svg, so the Hello is not visible.

Please use svg elements instead, or just use label="hello".