Blueprint is a React-based UI toolkit for the web.
It is optimized for building complex, data-dense web interfaces for desktop applications. If you rely heavily on mobile interactions and are looking for a mobile-first UI toolkit, this may not be for you.
Read the introductory blog post ▸
3.0 Changelog and migration guide ▸
Blueprint 3.0 supports multiple major versions of Blueprint on the same page through removing global styles and deconflicting selectors by changing the namespace. It also restores support for React 15 in most packages.
Check out the 2.0 changelog on the wiki, and make sure to review the 2.0 migration guide, in addition to the 3.0 content above.
This repository contains multiple projects in the packages/
directory that fall into 3 categories:
These are the component libraries we publish to NPM.
- – Core styles & components.
- – Components for interacting with dates and times.
- – Components for generating and displaying icons.
- – Components for selecting items from a list.
- – Scalable interactive table component.
- – Components for picking timezones.
- – Incubator and staging area for new components still under initial development.
These are hosted on GitHub Pages as static web applications:
docs-app
– Documentation site at blueprintjs.com/docslanding-app
– Landing page at blueprintjs.com
These are used as development playground environments:
table-dev-app
– demo page that supports manual testing of all table features
These packages define development dependencies and contain build configuration. They adhere to the standard NPM package layout, which allows us to keep clear API boundaries for build configuration and isolate groups of devDependencies
. They are published to NPM in order to allow other Blueprint-related projects to use this infrastructure outside this monorepo.
- – Documentation theme for Documentalist data.
Looking for places to contribute to the codebase? First read the contribution guidelines, then check out the "help wanted" label.
Lerna manages inter-package dependencies in this monorepo.
Builds are orchestrated via lerna run
and NPM scripts.
Prerequisites: Node.js v8+, Yarn v1.0+
After cloning this repo, run:
yarn
to install all dependencies.yarn verify
to ensure you have all the build tooling working properly.
If you were previously in a working state and have just pulled new code from develop
:
- If there were package dependency changes, run
yarn
at the root.- This command is very quick if there are no new things to install.
- Run
yarn compile
to get the latest built versions of the library packages in this repo.- This command is quicker than
yarn verify
since it doesn't build the application packages (docs-app
,landing-app
, etc.) or run tests
- This command is quicker than
Run yarn dev
from the root directory to watch changes across all packages and run the docs application with webpack-dev-server.
Alternately, each library has its own dev script to run the docs app and watch changes to just that package (and its dependencies): yarn dev:core
, yarn dev:datetime
, etc.
One exception is table
: since it has its own dev application, the dev:table
script runs table-dev-app
instead of the docs.
Much of Blueprint's documentation lives inside source code as JSDoc comments in .tsx
files and KSS markup in .scss
files. This documentation is extracted and converted into static JSON data using documentalist.
If you are updating documentation sources (not the docs UI code which lives in packages/docs-app
or the docs theme in packages/docs-theme
), you'll need to run yarn compile
from packages/docs-data
to see changes reflected in the application. For simplicity, an alias script yarn docs-data
exists in the root to minimize directory hopping.
The One-time setup and Incorporating upstream changes steps should produce the generated source code in this repo used to build the icons documentation. This is sufficient for most development workflows.
If you are updating icons or adding new ones, you'll need to run yarn compile
in packages/icons
to see those changes reflected before
running any of the dev scripts.
This project is made available under its own Blueprint License, based on Apache 2.0 License.
The only modification is an additional section (paragraph 10) in which we ask that you do not pass off any derivative products as Palantir’s products, given that Blueprint is a design toolkit.