Never Punch Manticores

    @itwin/itwinui-react
    TypeScript icon, indicating that this package has built-in type declarations

    1.46.0 • Public • Published

    iTwinUI logo

    iTwinUI-react

    itwinui-react on npm Build status

    What is iTwinUI-react?

    iTwinUI-react is a library built on top of the iTwinUI library. The goal of this project is to provide React components for using the styles and components from the core iTwinUI project. Check out the demo website to see the components in action.


    Installation

    npm install @itwin/itwinui-react
    
    yarn add @itwin/itwinui-react
    

    Usage

    Import the component you want and start using it!

    import { Button } from '@itwin/itwinui-react';
    
    const App = () => (
      <Button>Hello!</Button>
    );

    Yes, that's really all you need as you can see in this live interactive demo:

    Edit Button


    Theming

    By default, all components use the light theme but we also provide support for switching to dark theme in two different ways:

    • Use ThemeProvider in your root component where you can pass one of the following values:
      • light (default)
      • dark
      • os (which respects the color scheme of the operating system)
    import { ThemeProvider } from '@itwin/itwinui-react';
    
    const App = () => (
      <>
        <ThemeProvider theme='dark' />
        // Your code goes here.
      </>
    );
    • The useTheme hook also provides the same functionality as ThemeProvider.
    import { useTheme } from '@itwin/itwinui-react';
    
    const App = () => {
      useTheme('dark');
      return (
        <>
          // Your code goes here.
        </>
      );
    };

    Note: You only need to use one of these methods, and it only needs to be done once.


    FAQ

    For a list of frequently asked questions, visit the wiki.


    Contributing

    We welcome you to contribute and make this UI design system better. You can submit feature requests or bugs by creating an issue. Please read our CONTRIBUTING.md for more information.


    Changelog

    Read our CHANGELOG.md to find recent changes.

    Install

    npm i @itwin/itwinui-react

    DownloadsWeekly Downloads

    4,107

    Version

    1.46.0

    License

    MIT

    Unpacked Size

    2.27 MB

    Total Files

    1076

    Last publish

    Collaborators

    • imodeljs
    • colinkerr