React UI Atoms

Atomic components for React UI styled with CSS Modules


Table Of Contents

* Usage
* Components List
* License

Usage

``sh
npm install --save @react-ui/core@latest @react-ui/atoms-css-modules
`

Supply components and their styles to initUI:

`javascript
// src/components/ui/index.js

import initUI from '@react-ui/core';
import atoms from '@react-ui/atoms-css-modules';

import Header from 'src/components/ui/header';

const UI = initUI(atoms.components, { Header })(atoms.styles);

export default UI;
`

Use atomic components where needed:

`jsx
import React, { Component } from 'react';

import UI from 'src/components/ui';
const {
Button, Label,
Grid: { Container, Row, Col },
} = UI;

class MyUberComponent extends Component {
render() {
return (





Beautiful Header






Here I am!
Press me



);
}
}
``

Components List

* Alert
* Badge
* Button
* BtnGroup
* Image
* Label
* Loading
* Media
* Panel
* Grid (12 columns)
- Container
- Row
- Col
* Form
- Container
- Group
- Select
- Input
- Label
- Static
- Textarea
- Helper
* Navbar
- Container
- Menu
- Link
- Brand
- Static
* Pager
* Table
- Container
- Row
- Heading
- Cell

License

Apache License, Version 2.0