@talend/react-containers
Version:
Provide connected components aka containers for @talend/react-cmf based on @talend/react-components.
70 lines (49 loc) • 2.43 kB
Markdown
# React Talend Containers
This library provide a set of widgets to be ready to start with [react-cmf](https://github.com/Talend/ui/blob/master/packages/cmf/README.md)
[![NPM][npm-icon] ][npm-url]
[![Travis CI][travis-ci-image] ][travis-ci-url]
[![dependencies][dependencies-image] ][dependencies-url]
[![devdependencies][devdependencies-image] ][devdependencies-url]
[![peerdependencies][peerdependencies-image] ][peerdependencies-url]
[npm-icon]: https://nodei.co/npm/@talend/react-containers.png?downloads=true
[npm-url]: https://npmjs.org/package/@talend/react-containers
[travis-ci-image]: https://travis-ci.org/Talend/ui.svg?branch=master
[travis-ci-url]: https://travis-ci.org/Talend/ui
[dependencies-image]: https://david-dm.org/Talend/ui/status.svg?path=packages/containers
[dependencies-url]: https://david-dm.org/Talend/ui?path=packages/containers
[devdependencies-image]: https://david-dm.org/Talend/ui/dev-status.png?path=packages/containers
[devdependencies-url]: https://david-dm.org/Talend/ui?path=packages/containers&type=dev
[peerdependencies-image]: https://david-dm.org/Talend/ui/peer-status.svg?path=packages/containers
[peerdependencies-url]: https://david-dm.org/Talend/ui?path=packages/containers&type=peer
## Dependencies
- react
- @talend/react-cmf
- @talend/react-components
- classnames
## How to use
in your app index.js file
```javascript
import containersModule from '@talend/react-containers';
import cmf from '@talend/react-cmf';
import components from './components';
import expressions from './expressions';
const myApp = {
components,
expressions,
settingsURL: '/settings.json',
modules: [ containersModule ],
};
cmf.bootstrap(myApp));
```
## Architecture
This library is architectured around one concept:
Connect components provided by @talend/react-components which implement our [style guide](http://guidelines.talend.com)
A component here should never embed HTML or CSS.
Only connection to the store and behavior should be done.
All the state should be synchronised with redux using react-cmf API.
Every component do not change the API of the stateless componet which is behind. They add some APIs to let you use react-cmf's actions.
## How to contribute
First please take a look at our contributing guildelines.
# List of containers
You can find full demo at http://talend.github.io/ui/main/containers
- [SubHeaderBar](src/SubHeaderBar/SubHeaderBar.md)