Learning iTwin.js UI

For a quick-start approach to creating an iTwin.js app with App UI, see Quick Start to an App UI user interface.

React version requirements

iTwin.js UI bases its controls on the React JavaScript library and is compatible with React 16.8 and later.

Library Organization

The iTwin.js UI library is divided into these NPM packages in the @bentley scope:

Package Name Description
ui‑abstract Abstractions for UI controls and items, such as Toolbar, Button, Menu, Backstage, StatusBar and Widget.
ui‑core General purpose React components, such as Input, Button, Dialog, MessageBox, SearchBox, RadialMenu and SplitButton.
ui‑components React components that are data-oriented, such as PropertyGrid, Table, Tree and Breadcrumb.
ui‑ninezone React components for application user interface layouts following the Bentley 9‑Zone pattern.
ui‑framework Application fragments for Login, Project, iModel and View selection, and configuration of the application UI including the Backstage, Frontstages, Zones, Widgets, etc.

See also:

Last Updated: 29 November, 2022