Home

Awesome

<p align="center"> <a href="//react-devui.com" rel="noopener" target="_blank"><img width="150" src="/packages/site/src/assets/logo.svg" alt="DevUI logo"></a> </p> <h1 align="center">React DevUI</h1> <div align="center"> <!-- prettier-ignore-start -->

npm latest package npm bundle size gitHub workflow status

<!-- prettier-ignore-end --> </div> <div align="center">

English | 简体中文

</div>

Installation

yarn add @react-devui/ui @react-devui/icons @react-devui/hooks @react-devui/utils

Getting Started

import type { DRootProps } from '@react-devui/ui';

import { useMemo } from 'react';

import { DRoot } from '@react-devui/ui';

export default function App() {
  const rootContext = useMemo<DRootProps['context']>(
    () => ({
      layout: { pageScrollEl: '#app-main', contentResizeEl: '#app-content' },
    }),
    []
  );

  return (
    <DRoot context={rootContext}>
      <main id="app-main" style={{ overflow: 'auto' }}>
        <section id="app-content" style={{ height: '200vh' }}>
          Some content...
        </section>
      </main>
    </DRoot>
  );
}

Links

Contributing

Please read our contributing guide first.

Need unit test support (Jest) 🤝.

License

gitHub license