ghost-portal/packages/ui-react-rx
Jaco Greeff 43a4da151a
Bump API, Compact<Index> support (#563)
* Bump API, Compact<Index> support

* Bump for 0.38

* Allow numberFormat to format Compact

* Re-instate new compact API

* Update static Vector display
2019-01-08 19:39:47 +01:00
..
src Bump API, Compact<Index> support (#563) 2019-01-08 19:39:47 +01:00
test Use ApiPromise instance, replace ApiObservable (#540) 2019-01-07 17:54:01 +01:00
index.html Include ui-* packages in repo (development speed) (#65) 2018-05-29 17:33:29 +02:00
LICENSE Merge next into master (#529) 2018-12-21 17:17:26 +01:00
package.json Bump API, Compact<Index> support (#563) 2019-01-08 19:39:47 +01:00
README.md Merge next into master (#529) 2018-12-21 17:17:26 +01:00
webpack.config.js Use ApiPromise instance, replace ApiObservable (#540) 2019-01-07 17:54:01 +01:00

@polkadot/ui-react-rx

A collection of RxJS enabled React components that operate with the @polkadot/api-rx library. It automatically manages subscriptions on behalf of the developer, providing a number of unstyled components that can be used to construct UIs.

usage

Basic usage entails creating a ContextProvider and just using the components. For instance, to display the current node time,

import React from 'react';
import ReactDOM from 'react-dom';

import { Api, NodeTime } from '@polkadot/ui-react-rx';

...
ReactDOM.render(
  <Api>
    <NodeTime />
  </Api>,
  document.querySelector('#container')
);
...

All components are provided unstyled making no assumptions on the actual use, however they all support (optionally) the label, className and style attributes, that can be used to style to component.

...
ReactDOM.render(
  <Api>
    <NodeTime className='rx-time' label='current node time:' />
  </Api>,
  document.querySelector('#container')
);
...