Learning iTwin.js UI


AppUi is a framework for writing iTwin.js apps. For details, see this overview.

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 17.0 and later.

Library Organization

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

Package Name Description
appui-abstract Abstractions for UI controls and items, such as Toolbar, Button, Menu, Backstage, StatusBar and Widget.
core-react General purpose React components that can be used outside AppUi apps.
components-react React components that are data-oriented, such as PropertyGrid, Table and Tree.
imodel-components-react React components that depend on the imodeljs-frontend, imodeljs-common or imodeljs-quantity packages. The components pertain to Color, Cube, LineWeight, Navigation Aids, Quantity Inputs, Timeline and Viewport.
appui-react Classes and components for specifying the application UI consisting of the Backstage, Frontstages, Content Views, Tool Bars, Status Bars, Widgets and Panels.

See also:

Last Updated: 20 June, 2023