@bentley/ui-ninezone

Copyright © Bentley Systems, Incorporated. All rights reserved. See LICENSE.md for license terms and full copyright notice.

Description

The @bentley/ui-ninezone package contains React components for 9-Zone UI and other purposes.

Documentation

See the iTwin.js documentation for more information.

Usage

Installation

1npm install @bentley/ui-ninezone

Basic Usage

1import BackButton from "@bentley/ui-ninezone/lib/ui-ninezone/components/buttons/Back";
2
3<BackButton />

Components

• Buttons
  • App
  • Back
  • Button
  • Close
• ...

Local Demo

1cd imodeljs
2rush install
3rush build
4cd ui/ninezone
5npm start

Coding Guidelines

Look at the existing code and try to keep your code similar.

• Every component class name should follow nz-path-to-component-componentName naming style.

• Every inner class name should have nz- prefix.

• Import the Sass classnames with: import "./YourComponent.scss";

• Every component should accept className?: string and style?: React.CSSProperties props.

• Components that accept one or a list of children should use the children?: React.ReactNode prop.

Advice

• Use classnames function to create className strings for the elements.

• Use const className inside render for the root element className value.