ghost-portal/packages/ui-react-rx
Jaco Greeff cb5f4f4b50
Revert Compact<Index> API until we have full support (#573)
* Rever Compact<Index> API until we have full support

* Fix requested API versions (module resolution)
2019-01-09 11:07:00 +01:00
..
src Allow networkId from settings defaults (Alex & CC spec overrides) (#569) 2019-01-09 07:31:35 +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 Revert Compact<Index> API until we have full support (#573) 2019-01-09 11:07:00 +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')
);
...