react-modulr

Modulr.css React UI

Currently under heavy development.

Built on top of the fast and modular Modulr.css framework.

Install

To install react-modulr type in the followin command in your project folder.

npm install react-modulr --save

Usage

react-modulr can be imported multiple ways.
Grouping of components is ment to mimic that of the css framework iteself.

import {Form} from 'react-modulr';

or 

import {Button, ButtonGroup} from 'react-modulr/lib/Button';

or

import Button from 'react-modulr/lib/Button/Button';
import ButtonGroup from 'react-modulr/lib/Button/ButtonGroup';

Components

The following is an outline of the components provided thus far.
For a better understanding it is always recommended to take a look at the source code.

Button

Button

Buttons as outlined https://decorator.io/modulr/docs/button.

import Button from 'react-modulr/lib/Button/Button';
import React from 'react';

export default class extends React.Component {
  render() {
    return (
      <Button
        data={true}
        onClick={val => {
          alert(`Addon clicked: ${val}`);
        }}
        size="l"
        type="info">
        Large Info Button
      </Button>
    );
  }
}

...to be continued...

Contribute

Any help is welcome: development, testing, documentation, website, hosting.
Use .editorconfig config file for tab spacing, etc. There are plugins for most popular IDEs.

Testing

Testing is done using Jest and Enzyme.
Test files are 1-to-1 and are in the src/__tests__ directory.

To run the tests npm test will --watch files.

TODO

• Comments
• Tests (~55% current basic coverage)
• Animations
• Modifiers
• Typography
• Etc.