ghost-portal/packages/react-query
Tarik Gul c35641dbaf
Bump polkadot-js deps (#12455)
api 17.0.1, extension 0.64.1, phishing 0.25.26, vanitygen 0.63.21.

The api major renames two sets of generated lookup types - assigner_coretime
moved under scheduler:: and the vstaging candidate receipt was promoted to V9 -
so the imports for those follow. Metadata v16 also carries deprecation info, so
the deliberate compat usages of preimage.statusFor and treasury.spendLocal now
need explicit eslint-disable lines.
2026-09-24 06:11:48 +03:00
..
src Bump polkadot-js deps (#12455) 2026-09-24 06:11:48 +03:00
.skip-build
.skip-npm
index.html
package.json [CI Skip] bump/beta 0.171.2-20-x 2026-09-23 19:29:55 +00:00
README.md chore: fix spelling issues (#11656) 2025-06-27 10:15:19 +05:30
tsconfig.build.json Switch on tsconfig composite (#9465) 2023-05-19 15:11:59 +03:00

@polkadot/react-query

WARNING: This is an internal package to polkadot-js/apps so is not intended (yet) for broad use. Since these are generic components, they will move to the polkadot-js/ui repo once deemed stable and usable.

For the existing sharable components usable in external React-based projects, take a look at the polkadot-js/ui documentation

Overview

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/react-query';

...
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')
);
...