Files
react.dev/content/community/tools-ui-components.md

77 lines
8.3 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
id: ui-components
title: UI Components
layout: community
permalink: community/ui-components.html
---
## Free Components
* **[Amaze UI React](https://github.com/amazeui/amazeui-react) (in Chinese):** [Amaze UI](https://github.com/allmobilize/amazeui) components built with React.
* **[Ant Design of React](http://github.com/ant-design/ant-design)** An enterprise-class UI design language and React-based implementation.
* **[Belle](https://github.com/nikgraf/belle/):** Configurable React Components with great UX.
* **[chartify](https://github.com/kirillstepkin/chartify)**: Ultra lightweight and customizable React.js chart component.
* **[Elemental UI](http://elemental-ui.com):** A UI toolkit for React websites and apps, themeable and composed of individually packaged components
* **[Grommet](http://grommet.io)** The most advanced open source UX framework for enterprise applications.
* **[Halogen](http://madscript.com/halogen):** A collection of highly customizable loading spinner animations with React.
* **[Khan Academy's component library](http://khan.github.io/react-components/)**
* **[markdown-to-jsx](https://www.npmjs.com/package/markdown-to-jsx)**: compiles markdown into safe React JSX without using dangerous escape hatches.
* **[material-ui](http://material-ui.com)** A set of React Components that implement Google's Material Design.
* **[Onsen UI React Components](https://onsen.io/v2/react.html):** UI components for hybrid mobile apps with both Material Design for Android and flat design for iOS.
* **[React Amazing Grid](https://github.com/Amazing-Space-Invader/react-amazing-grid)** Flex grid with inline styles.
* **[React Mdl](https://github.com/tleunen/react-mdl)** React Components for Material Design Lite.
* **[React Web](https://github.com/taobaofed/react-web)** A framework for building web apps with React.
* **[react-amiga-guru-meditation](https://github.com/gfazioli/react-amiga-guru-meditation):** React JS Class to display a Amiga Guru Meditation Tribute
* **[react-autosuggest](https://github.com/moroshko/react-autosuggest)** WAI-ARIA compliant React autosuggest component
* **[react-bootstrap](https://github.com/stevoland/react-bootstrap):** Bootstrap 3 components built with React.
* **[react-bootstrap-dialog](https://github.com/akiroom/react-bootstrap-dialog):** React Dialog component for react-bootstrap, instead of `window.alert` or `window.confirm`
* **[react-bootstrap-table](https://github.com/AllenFang/react-bootstrap-table):** It's a react table for Bootstrap.
* **[react-component](https://github.com/react-component/):** A collection of react components maintained by Alibaba/Alipay employee.
* **[react-data-menu](https://github.com/dkozar/react-data-menu):** Smart data-driven menu rendered in an overlay. Hints-based aligning with custom renderers and factories. Never clipped by other components or screen edges.
* **[react-date-picker](https://github.com/Hacker0x01/react-datepicker):** A simple and reusable datepicker component for React.
* **[react-dates](https://github.com/OpusCapita/react-dates):** Date-inputs + date-picker
* **[react-dnd](https://github.com/gaearon/react-dnd)** Flexible HTML5 drag-and-drop mixin for React with full DOM control
* **[react-document-title](https://github.com/gaearon/react-document-title)** Declarative, nested, stateful, isomorphic document.title for React
* **[react-dropzone](https://github.com/felixrieseberg/React-Dropzone):** React Dropzone for File-Uploads
* **[react-forms](http://prometheusresearch.github.io/react-forms/):** Form rendering and validation for React
* **[react-highlight](https://github.com/akiran/react-highlight):** React component for syntax highlighting
* **[react-image](https://github.com/mbrevda/react-image):** Like `<img />` and Enhanced Image Component for React.
* **[react-input-autosize](https://github.com/JedWatson/react-input-autosize):** Like `<input />` but resizes automatically to fit all its content.
* **[react-intense](https://github.com/brycedorn/react-intense):** A component for viewing large images up close
* **[react-joyride](https://github.com/gilbarbara/react-joyride):** Create walkthroughs and guided tours for your ReactJS apps.
* **[react-ladda](https://github.com/jsdir/react-ladda):** React wrapper for Ladda buttons.
* **[react-lorem-component](https://github.com/martinandert/react-lorem-component):** Lorem Ipsum placeholder component.
* **[react-notification](https://github.com/pburtchaell/react-notification):** Snackbar style notifications
* **[react-select](https://github.com/JedWatson/react-select):** Native React Select / Multiselect input field, similar to Selectize / Chosen / Select2
* **[react-selectize](https://furqanzafar.github.io/react-selectize/):** A stateless & flexible Select component, designed as a drop in replacement for React.DOM.Select, inspired by Selectize
* **[react-sigma](https://www.npmjs.com/package/react-sigma)**: Lightweight but powerful library for drawing network graphs
* **[react-slick](https://github.com/akiran/react-slick):** Carousel component built with React
* **[react-sparklines](https://borisyankov.github.io/react-sparklines/):** Beautiful and expressive sparklines component
* **[react-spreadsheet](https://github.com/felixrieseberg/React-Spreadsheet-Component):** React Spreadsheets / Editable tables with Excel-Style keyboard input and navigation
* **[react-switch-button](https://github.com/gfazioli/react-switch-button):** Beautiful React Switch button component
* **[react-tappable](https://github.com/JedWatson/react-tappable)** A Tappable React Component that provides native-feeling onTap events for mobile React apps
* **[react-textarea-autosize](https://github.com/andreypopp/react-textarea-autosize):** Like `<textarea />` but resizes automatically to fit all its content.
* **[react-toastify](https://github.com/fkhadra/react-toastify):** React notification made easy
* **[React-TimeAgo](https://www.npmjs.org/package/react-timeago)** A minimal live updating Time Ago component that smartly converts any time to a 'ago' or 'from now' format and keeps it updated.
* **[react-translate-component](https://github.com/martinandert/react-translate-component):** React component for i18n.
* **[react-treeview](https://github.com/chenglou/react-treeview):** Easy, light, flexible tree view.
* **[react-uwp](https://www.react-uwp.com)** A set of React Components that Implement Microsoft's UWP Design & Fluent Design..
* **[react-validate-framework](https://github.com/MinJieLiu/react-validate-framework)**: A lightweight and extensible React validation component.
* **[reactstrap](https://reactstrap.github.io/):** Simple Bootstrap 4 components built with [tether](http://tether.io/)
* **[recharts](https://github.com/recharts/recharts)**: A composable charting library built on React components.
* **[Selectivity](https://arendjr.github.io/selectivity/):** Modular and light-weight selection library.
* **[Semantic-ui](http://react.semantic-ui.com/)**: The official Semantic-UI-React integration, Advanced components and declarative UI.
* **[storybook-addon-material-ui](https://github.com/sm-react/storybook-addon-material-ui)** A storybook addon for material-ui.
* **[tcomb-form](https://github.com/gcanti/tcomb-form):** Automatically generate form markup, automatic labels and inline validation from a domain model.
* **[valuelink](https://github.com/Volicon/valuelink):** Full-featured two-way data binding and forms validation with extended React links.
* **[video-react](https://github.com/video-react/video-react)**: A web video player built for the HTML5 world using React library.
* **[Winterfell](https://github.com/andrewhathaway/Winterfell):** Generate complex, validated and extendable JSON-based forms in React
* **[Mobiscroll Lite for React](https://mobiscroll.com/forms/react)** A collection of 15 free UI components ranging from inputs, selects, sliders, alerts to rating.
## Fee Based Components
* **[ag-Grid](https://www.ag-grid.com)** Advanced data grid / data table for React.
* **[ExtReact components](https://www.sencha.com/products/extreact//)**: 115+ Ready-to-Use UI Components.
* **[Grapecity Wijmo UI Components for React](https://www.grapecity.com/en/react/)**: Expand your React UI options with Wijmos complete collection of JavaScript components.
* **[jQWidgets React components](http://www.jqwidgets.com/react/)**: Enterprise Ready 70+ UI Components.
* **[Mobiscroll React UI Components](https://mobiscroll.com/react)** Mobile UI Controls for the Productive React Developer.