Skip to content

Latest commit

 

History

History
103 lines (82 loc) · 3.68 KB

README.md

File metadata and controls

103 lines (82 loc) · 3.68 KB

meteor add izzilab:material-ui

Version 0.2.X, MUI imported SvgIcons

	let {SvgIcons} = MUI.Libs;
	...
	render() {
			let RightIcon = <SvgIcons.NavigationClose />
            return (
                <AppCanvas>
                    <AppBar title="izziLab" iconElementRight={RightIcon} />
                </AppCanvas>
            );
        }

From version 0.1.9, we upgrade to MUI 0.13.1 and react to 0.14.X it have breaking changes

Introduction

This package ported from Material-UI (a React Component) using the official Meteor React package.

Install

  1. Install the official React package meteor add react
  2. Install this package meteor add izzilab:material-ui

Using

Some clicks (like DatePicker) only work when you have run injectTapEventPlugin() first. It is the official temporary fix, will be removed with React v1.0.

Here's some example code to get you started:

//app.jsx
injectTapEventPlugin();

var {
    AppCanvas,
    AppBar,
    Styles,
    RaisedButton,
    DatePicker
    } = MUI;
var { ThemeManager, LightRawTheme } = Styles;

var App = React.createClass({
    childContextTypes: {
        muiTheme: React.PropTypes.object
    },

    getChildContext() {
        return {
            muiTheme: ThemeManager.getMuiTheme(LightRawTheme)
        };
    },

    render: function () {
        return (
            <AppCanvas>
                <AppBar title="izziLab"/>

                <div style={{padding: '80px',}}>
                    <RaisedButton primary={true} label="Tap"/>
                    <br/>
                    <DatePicker hintText="Portrait Dialog"/>
                    <br/>
                    <DatePicker
                        hintText="Landscape Dialog"
                        mode="landscape"/>
                </div>
            </AppCanvas>
        );
    }
});

if (Meteor.isClient) {
    Meteor.startup(() => {
        ReactDOM.render(<App/>, document.getElementById('react-root'));
    });
}

CHANGELOG

Note: This is an old demo with bugs and performance problems. The code is also not updated to use the official react package yet. A new version will follow soon.