IconButton - Problem with rendering <Link> as containerElement

[mairh]

We have recently fixed the way to render react router <Link> element inside a button component. Issue - #850

However, I am having trouble wrapping containerElement inside IconButton component. I am not exctly sure where am I going wrong and there seems to be some style issues : I am not able to render the link if I click on the icon. However, it does work if I click outside the icon boundary.

Here is the screencast link:

http://screencast-o-matic.com/watch/co13IKfYZk

The way I am implementing containerElement is as follows:

<IconButton
    containerElement={<Link to="signin" />}
    tooltip="Sign in"
    linkButton={true}>
        <i className="material-icons">face</i>
</IconButton>

[mairh]

@hai-cea - Any suggestions?

[hai-cea]

@mairh Could be some extra styles on that className? I tried this on the docs site and it worked fine:

<IconButton
  containerElement={<Link to="home" />}
  tooltip="home"
  linkButton={true}>
  <ActionFace />
</IconButton>

This is using SvgIcons which you might consider using since we have all the icons in the project now. Here's the one you need: https://github.com/callemall/material-ui/blob/master/src/svg-icons/action/face.jsx

[mairh]

It could be the style problem from google material icons hosted stylesheet. I guess I will end up using SvgIcons for <IconButton>. Since the icons has been recently added I should wait for another release.

[mairh]

Closing the issue since it has been fixed in last release.

[hai-cea]

Thanks @mairh