@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
npm install @bentley/ui-ninezone
Basic Usage
import BackButton from "@bentley/ui-ninezone/lib/ui-ninezone/components/buttons/Back";
<BackButton />
Components
- Buttons
- App
- Back
- Button
- Close
- ...
Local Demo
cd imodeljs
rush install
rush build
cd ui/ninezone
npm 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
andstyle?: 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.