lo-tp / rmwc

A React wrapper for Material Design (Web) Components

Home Page:https://jamesmfriedman.github.io/rmwc/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

CircleCI npm npm Join the chat at https://gitter.im/react-material-web-components/Lobby

RMWC - React Material Web Components

A React (15 / 16) wrapper for Material Design (Web) Components v0.29.0 https://jamesmfriedman.github.io/rmwc/

Recent updates

MDC 0.29.0 has minimal impact on RMWC. The only breaking change is removal of the Select multiple component. If you were using the Select multiple component, guidance is to use a list with checkboxes, or manage your own component.

Goals

  • To create the thinnest, lightest, and spec compliant wrapper around Google Material Design Components for the Web https://material.io/components/web/
  • To utilize the Foundation javascript classes and expose their api for consumption
  • To be as unobtrusive and sensible as possible.

Installation

Required steps

  • npm i rmwc --save or yarn add rmwc
  • material-components-web should be installed automatically as a peer dependency. Include node_modules/material-components-web/dist/material-components-web.min.css in your project via your method of choice (using a link tag, a css-loader, etc.).

Optional steps

  • If you would like to use the default Roboto font:
    • add <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
    • add the class mdc-typography to the body <body className="mdc-typography">...</body>
  • If you would like to use the material-icons font:
    • add <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  • Add global settings by using the optional <RMWCProvider /> component at the root of your project. See the 'Provider' section for more info.

Additional information is available in the Installation Guide

Usage

Read the docs on how to Usage

Why?

Read the docs on Methodology

About Breaking Changes

Read the docs on Methodology

To run the tests

  • On MacOS Sierra and higher, install watchman to fix a filesystem issue with Jest. brew install watchman
  • npm test

To run the docs / contribute

  • git clone https://github.com/jamesmfriedman/rmwc.git
  • cd rmwc
  • npm install
  • npm start

About

A React wrapper for Material Design (Web) Components

https://jamesmfriedman.github.io/rmwc/

License:MIT License


Languages

Language:JavaScript 94.6%Language:CSS 4.3%Language:HTML 1.1%