IPLD Explorer Components

React components for https://explore.ipld.io (https://github.com/ipfs/explore.ipld.io) and ipfs-webui

Background

This module was extracted from the explore.ipld.io so it could be reused from the IPFS Web UI.

Usage

WARNING: This module is not intended to be re-used in it's current form by other projects. It's just enough to work with a create-react-app set up, as long as you follow the steps below. There is much more work to do to make this a nice set of generic components.

Install it from npm:

npm install ipld-explorer-components

The ES5 friendly version of the src dir is generated to the dist dir and the page components are all provided as named exports so you can import them like so:

import {ExplorePage, StartExploringPage} from `ipld-explorer-components`

The following Components are available:

export {
  StartExploringPage,
  ExplorePage,
  IpldExploreForm,
  IpldCarExploreForm,
  CidInfo,
  IpldGraph
  ObjectInfo,
  exploreBundle
}

There are peerDependencies so that the parent app can pick the versions of common deps. You'll need to add relevant deps to your project.

And, assuming you are using create-react-app or a similar webpack set up, you'll need the following CSS imports:

import 'tachyons'
import 'ipfs-css'
import 'react-virtualized/styles.css'
import 'ipld-explorer-lib/dist/components/object-info/LinksTable.css'
import 'ipld-explorer-lib/dist/components/loader/Loader.css'

Contribute

Feel free to dive in! Open an issue or submit PRs.

To contribute to IPFS in general, see the contributing guide.

Releasing

• Run tx pull -a to pull the latest translations from Transifex (i18n#transifex-101))
• Update the version (npm version major/minor/patch)
• Push the changes (git push && git push --follow-tags)
• Update the changelog
• Add release notes to https://github.com/ipfs-shipyard/ipld-explorer-components/releases, use the tag and copy changelog changes
• Publish to npm (npm publish)

License

MIT © Protocol Labs