feat(List): create List component

README.md

@@ -1,6 +1,5 @@
-[![npm version](https://img.shields.io/npm/v/react-mdc-web.svg?style=flat-square)](https://www.npmjs.com/package/react-mdc-web)
-[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/kradio3/react-mdc-web/master/LICENSE)
 # Material components for React
+[![Maintenance Status][status-image]][status-url] [![NPM version][npm-image]][npm-url] [![License][license-image]][license-url] 
 
 React components based on styles from [Material Design Components Web project][mdc-web]. Components are written in React.js. Doesn not use MDC JS sources.
 
@@ -16,5 +15,12 @@ import Card from 'react-mdc-web/lib/Card'
 ```
 
 ## License
-MIT
+MIT, see [LICENSE](/LICENSE) for details
+[status-image]: https://img.shields.io/badge/status-maintained-brightgreen.svg
+[status-url]: https://github.com/kradio3/react-mdc-web
 
+[npm-image]: https://img.shields.io/npm/v/react-mdc-web.svg
+[npm-url]: https://www.npmjs.com/package/react-mdc-web
+
+[license-image]: https://img.shields.io/badge/license-MIT-blue.svg
+[license-url]: https://raw.githubusercontent.com/kradio3/react-mdc-web/master/LICENSE

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-mdc-web",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "description": "React web components for Material Design",
   "main": "lib/index.js",
   "jsnext:main": "src/index.js",

src/List/List.js

@@ -0,0 +1,20 @@
+import React, { PropTypes } from 'react';
+import classnames from 'classnames';
+
+const propTypes = {
+  className: PropTypes.string,
+  children: PropTypes.node,
+  dense: PropTypes.bool,
+};
+
+const List = ({ className, children, dense }) => (
+  <ul
+    className={classnames('mdc-list', {
+      'mdc-list--dense': dense,
+    }, className)}
+  >
+    {children}
+  </ul>
+  );
+List.propTypes = propTypes;
+export default List;

src/List/ListItem.js

@@ -0,0 +1,17 @@
+import React, { PropTypes } from 'react';
+import classnames from 'classnames';
+
+const propTypes = {
+  className: PropTypes.string,
+  children: PropTypes.node,
+};
+
+const ListItem = ({ className, children }) => (
+  <li
+    className={classnames('mdc-list-item', className)}
+  >
+    {children}
+  </li>
+  );
+ListItem.propTypes = propTypes;
+export default ListItem;

src/List/index.js

@@ -0,0 +1,4 @@
+import '@material/list/dist/mdc.list.min.css';
+
+export { default } from './List';
+export { ListItem } from './ListItem';