Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including @gooddata/react-components with all npm packages installed. Try it out:

require("react/package.json"); // react is a peer dependency. require("react-dom/package.json"); // react-dom is a peer dependency. var reactComponents = require("@gooddata/react-components")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@gooddata/react-components v7.7.0

GoodData.UI - A powerful JavaScript library for building analytical applications

npm version

GoodData.UI React components

A React-based JavaScript library for building data-driven applications

Getting started


With yarn installed, go to your project directory and run

$ yarn add @gooddata/react-components

If you prefer npm run

$ npm install --save @gooddata/react-components

The public API is exposed via global index.js. Except for the styles, do not import any other file directly because they are not intended to be part of the public API.


We welcome any contribution in form of issues or pull requests.

Install Node.js (node 12.16.1, npm v6.13.4) and Yarn (1.22.4).

Install dependencies:

yarn install --frozen-lockfile

These commands may come in handy while developing:

yarn install --pure-lockfilefirst step
yarn devbuild react-components to /dist in watch mode
yarn testrun all unit tests
yarn prettier-writeformat the source code to match the valid codestyle
yarn validatevalidate codestyle
yarn storybookrun storybook from /stories on http://localhost:9001
yarn build-storybookbuild storybook to /dist-storybook
yarn test-storybookrun storybook and screenshot tests
yarn examplesrun Live Examples dev-server from /examples on https://localhost:8999
yarn examples-buildbuild Live Examples to /examples/dist
yarn examples-serverserve built Live Examples - see /examples/server/src
yarn examples-testcaferun testcafe tests against localhost:8999

Deploy to

When you deploy this repo to heroku, it serves GoodData.UI Live Examples. Relevant tasks are in Procfile and package.json.

# run in the project directory
heroku login
heroku create <your-app-name>
heroku config:set DOMAIN_ADMIN_PASSWORD=xy PROJECT_ID_TO_ASSIGN=xms7ga4tf3g3nzucd8380o2bev8oeknp
git push heroku HEAD:master
heroku open

Enable Geo Chart for Storybook and Live Examples

Geo chart uses Mapbox to render map which requires a Mapbox access token.

  • Register an account and create Mapbox access token at guide
  • Store the created token at .env:
echo -e "EXAMPLE_MAPBOX_ACCESS_TOKEN=token" >> .env # only need to run once
echo -e "STORYBOOK_MAPBOX_ACCESS_TOKEN=token" >> .env # only need to run once

Run Live Examples Locally

To run GoodData.UI Live Examples locally:

git clone <this-repository>
cd  <repository-folder>
yarn install --pure-lockfile
yarn examples

Then open https://localhost:8999 and login using Live Examples account (you can create one here).

Run Storybook locally

  • Run storybook with token stored in .env for more secure
yarn storybook
  • Or run storybook with token env param exposed to cli (not suggested)
  • Apply either above way to yarn build-storybook or yarn test-storybook

Source code formatting

The source code in the repository is formatted by Prettier. The format of the code is validated by our Continuous Integration server and is one of the requirements of successful merge.

Prettier is supported by every major IDE. You can find the list of supported editors and how to configure them here.

In the case, when your editor is not supported or you don't want to setup the integration, you can run the yarn prettier-write command to reformat the code before commit.


Supported versions

In order to make the user experience with integrating GoodData UI SDK as smooth and secure as possible and to ensure that the SDK is using the latest features of the platform, we will only provide support to two most recent major versions of UI SDK.

The most recent majors will be supported in the following modes:

  • The latest major version will receive all new functionality and all bug fixes
  • The previous major version will only receive fixes to critical issues and security fixes. These fixes will be applied on top of last released version of the previous major

The customers are encouraged to always use the latest version of the UI SDK.

In case of using older versions, the user might face API incompatibility, performance or security issues.

Please follow the installation instructions to update to the newest version.


(C) 2007-2020 GoodData Corporation

This project is dual licensed:

  • The ATTRIBUTION-NONCOMMERCIAL 4.0 INTERNATIONAL (CC BY-NC 4.0) is used for purpose of the trial experience and evaluation of GoodData.UI library.

For more information, please see LICENSE


RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free