Nocturnally Psychologizing Millipede

    @material/react-material-icon
    TypeScript icon, indicating that this package has built-in type declarations

    0.15.0 • Public • Published

    React Material Icon

    A React wrapper for Material Icons.

    Installation

    npm install @material/react-material-icon
    

    Usage

    Styles

    with Sass:

    import '@material/react-material-icon/index.scss';

    with CSS:

    import '@material/react-material-icon/dist/material-icon.css';

    Importing Icons

    The React material icon package does not come packaged with Google Font's Material Icons. If it was included in the Sass package this would block rendering of the page until the icons download.

    There are two different ways to add Material Icons to your website, both of which are documented in Material Icons Documentation. We recommend "Method 1: via Google Web Fonts", because it renders faster, but there can be Flash Of Unstyled Content (FOUC). The code to load Material Icons via Google Web Fonts is pasted here for your convenience.

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
          rel="stylesheet">
    
    Preventing FOUC and Troubleshooting Ripple

    There is a known issue if you turn on the ripple on the Material Icon component. If FOUC occurs, the ripple size will be calculated off of the text width/height. To get around this, give the component a predetermined width/height in your CSS (or inline styles). Original issue documented here.

    Javascript Instantiation

    import MaterialIcon from '@material/react-material-icon';
     
    const MyComponent = () => {
      return (
        <MaterialIcon icon='menu' />
      );
    }

    Props

    Prop Name Type Description
    icon string Type of icon to be displayed.
    className string Classes to pass on to the root <i> element.
    hasRipple n/a If present on element, it will enable the ripple on the icon.

    Usage with Icons

    Please see our Best Practices doc for further reading.

    Install

    npm i @material/react-material-icon

    DownloadsWeekly Downloads

    3,574

    Version

    0.15.0

    License

    MIT

    Unpacked Size

    65.6 kB

    Total Files

    15

    Last publish

    Collaborators

    • yefim
    • abhiomkar
    • azakus
    • bicknellr
    • material-admin
    • aprigogin
    • patrickrodee
    • aomarks
    • emarquez
    • allanchen
    • esgonzalez
    • asyncliz
    • candysonya
    • ssuarez
    • taylorv