Skip to content

Latest commit

 

History

History
42 lines (32 loc) · 902 Bytes

README.md

File metadata and controls

42 lines (32 loc) · 902 Bytes

React JSS

This mixin makes JSS easy to use from React components. Classes are always namespaced so use this.sheet.classes to access their names. Stylesheet is only attached until last instance is unmounted.

This mixin is compatible with live reloading via React Hot Loader.

Example

// buttonStyle.js
module.exports = {
  'button': {
    'background-color': 'yellow'
  }
};

// Button.jsx
var React = require('react'),
    useSheet = require('react-jss'),
    buttonStyle = require('./buttonStyle');

var Button = React.createClass({
  mixins: [useSheet(buttonStyle)],

  render() {
    // JSS sheet is available as this.sheet:
    return (
      <button className={this.sheet.classes.button}>
        {this.props.children}
      </button>
    );
  }
});

module.exports = Button;

License

MIT