Error with using ToggleStar (and other child elements from examples like: ActionGrade)

[TrySpace]

When using from the example:

  <FloatingActionButton>
    <ToggleStar />
  </FloatingActionButton>

Gives:

• Warning: React.createElement: type should not be null or undefined. It should be a string (for DOM elements) or a ReactClass (for composite components).
• Warning: Only functions or strings can be mounted as React components.
• Uncaught TypeError: Cannot read property 'toUpperCase' of undefined (ReactDefaultInjection.js:54 )

Or:

   <IconButton tooltip="Star" touch={true}>
      <ActionGrade/>
   </IconButton>

Gives the same error

[oliviertassinari]

Have you imported the ToggleStar and FloatingActionButton component?

[TrySpace]

@oliviertassinari Yes, definitely

I think it would be best reproducible by requiring material-ui and react in a fresh project, as opposed to working in this repo directly.

[hai-cea]

@TrySpace Please make sure your require is:

const ActionGrade = require('material-ui/lib/svg-icons/action/grade');

[TrySpace]

I will try this later, but note that this is nowhere in the documentation: http://material-ui.com/#/components/buttons ( I assume it is in the demo-code somewhere, but that's a 63000 line source-file ;) and I wouldn't know where else to extrapolate the information you just gave me )

I've encountered other cases where Importing MenuItem gave the same problem, where one needed the mui.MenuItem, and the other MenuItem = require('material-ui/lib/menus/menu-item') ( I ended up making two seperate modules, although renaming the MenuItem would've sufficed, but is just confusing )

How will this change and be unified in future releases?

[oliviertassinari]

That's an issue with the documentation. We can close it as soons as #2433 is closed.

[mbrookes]

#2433 is closed. 👍

[alitaheri]

🎉 🎈