sm-ui

Shimo UI Library

Usage no npm install needed!

<script type="module">
  import smUi from 'https://cdn.skypack.dev/sm-ui';
</script>

README

sm-ui

Shimo React Components Library

Install

To install the latest release:

npm install sm-ui

After npm install, you'll find all the source code in the src/ folder and their compiled results in the /lib folder. And some basic styles of components in scss/ folder.

Usage

Once sm-ui is installed in your project, you can use like this:

/** MyFirstReactComponent.jsx */

var React = require('react');
var Components = require('sm-ui');
var SimpleButton = Components.SimpleButton;
var LinkButton = Components.LinkButton;

module.exports = React.createClass({
  render: function(){
    return (
      <div className="btn-demo">
        <SimpleButton
          customClass="default-btn"
          label="A button element" >
        </SimpleButton>

        <SimpleButton
          customClass="submit-btn"
          label="A submit element"
          onTap={this._onTap} >
        </SimpleButton>

        <LinkButton
          customClass="anchor-btn"
          label="A anchor"
          href="http://www.baidu.com/" >
        </LinkButton>
      </div>
    );
  },

  _onTap: function(e){
    alert('Clicked...')
  }
});

/** app.jsx */
var React = require('react');
var injectTapEventPlugin = require('react-tap-event-plugin');
var Buttons = require('./MyFirstReactComponent.jsx');

React.render(<Buttons />, document.getElementById('main'))

Examples

To help you get started, you can find complete example in /examples folder or visit the website

Demo

Develop

You need NPM 3 >= 3.8.0 and Node 4.x or Node 6.x

npm i
npm start

open the demo with http://localhost:8999 and make your magics.

FAQ