Need

Allow user to select a date.

I want the user to be able to pick a date.

What are the React date picker libraries out there?

1 hidden (1 in Graveyard)
Add library

Need

Allow user to select multiple dates.

The user should be able to select several dates in the calendar view. (Instead of having to re-open the date picker every time.)

Are there React date picker libraries covering that use case?

Need

Allow user to select a date and a time.

The user should be able to select an arbitrary date and an arbitrary time.

What are the React date pickers supporting time selection?

Need

Allow user to select a time.

I want to the user to be able to pick a time independently of a date; The user should be able to select a time without picking a date.

What is the list of libraries implementing a time picker?

Need

Display data with colums and rows.

I want to present data in tabular format.

What React table libraries are there?

Awaiting upvotes
13
1y
react-tisch
Table component for React and Bootstrap with real React components as cells.
29
1y
violet-paginator
Display, paginate, sort, filter, and update items from the server. violet-paginator is a complete list management library for react/redux applications.
1k
1y
react-table
React Table - A lightweight, fast and extendable datagrid for React.
2
1y
react-pricing-table
Fast, flexible, simple pricing tables in React.
238
1y
react-handsontable
Handsontable - Best Data Grid for React with Spreadsheet Look and Feel.
2
7m
react-collapsing-table
React-collapsing-table: a React rewrite of the jQuery table plugin from "datatables.net". Inspired by a lack of similar table behaviors, notably collapsibility and responsivity.
5
1y
react-virtualized-pivot
React Virtualized Pivot.
0
9m
react-responsive-tables
A react component for responsive tables.
10
11m
react-virtualized-sticky-tree
A React component for efficiently rendering tree like structures with support for position: sticky.
507
2y
fixed-data-table-2
A React table component designed to allow presenting millions of rows of data.
25
1y
gigatables-react
GigaTables is a ReactJS plug-in to help web-developers process table-data in applications and CMS, CRM, ERP or similar systems.
3
10m
@syncfusion/ej2-react-grids
Pure react grid component built by extending the Essential JS 2 grid component.
319
1y
@devexpress/dx-react-grid
DevExtreme Reactive Components.
10
5m
react-isometric-grid
React Isometric Grid Inspired by Codrops Isometric Grids.
128
2y
rsuite-table
A React table component.
231
10m
react-bootstrap-table-next
Next Generation of react-bootstrap-table.
1 hidden (1 in Graveyard)
Add library

Need

Display a view in a modefull popup.

I want to display a new view in a popup superposing the current view.

It should be "modefull";, i.e. blocking; The user has to close the popup before proceeding.

For example a "yes/no" dialog or a modal to temporary show more information.

Such popup is also often called overlay, modal, alert, dialog, or lightbox.

What are the React modefull overlay libraries out there?

Add library

Need

Notify the user with a little, modeless, and temporary popup.

I want to notify the user that something happend. For that I want to use a little popup (e.g. 300px X 70px) for a short period of time that then automatically closes itself.

Such little popup is also often called toaster or snackbar.

What is the list of all good notification libraries for React?

Need

Display information upon mouse hover.

My website has elements that are not 100% intuitive and they need explanation. I want to show a little popup with the explanatory text next to the element. The little popup should be displayed when the user cursor hovers the element and should disappear when the cursor moves out of the element.

What React tooltips libraries are there?

Need

Display a huge list of entries but only render entries that are visible.

I have a large list of several thousands of entries that I want to show to the user.

I want to dispaly the entire list without pagination. But rendering all thousands of entries is performance-wise unpractical.

Instead of rendering all entries at once, the entries should be rendered only when they become visible as the user scrolls up and down the list. This technique is called "virtualization" or "lazy load".

What React libraries are there to achieve that?

Need

Display a list and add entries to it as the user scrolls down.

I have a list with a large number of entries. All entries can't be loaded and shown at once because there are too many of them. Instead of using pagination I want entries to be loaded and added to the list when the user reaches the end of the list when scrolling down the list. That way the user can view the entire list just by scrolling down. This technique is called "Infinite Scroll".

What React libraries are there to help me implement infinite scroll view?

Need

Display a list of actions upon right-click.

When you right-click on a file in a desktop interface a little popup is shown with possible actions to take, like deleting the file, renaming the file, etc. I want this for my React app.

What react context menu libraries are there?

Need

Make sure that an element is always visible.

The W3C added a specification for `position: sticky` which is great but not implemented in all browsers yet.

The library doesn't need to be a polyfill and doesn't need to comply to the spec. I just want to make sure that an element is always visible. And I don't want to use `position: fixed` because the element should scroll along the rest of the content and should "detach" itself when needs be. Basically the element should switch between "position: static" and "position: fixed". See the W3C `position: sticky` for more information.

Are there libraries that help make a React element sticky?

Need

Hide header when scrolling down and show it again when scrolling up.

To save vertical space, many mobile apps implement a header that disappears when the user scrolls down and appears again when the user scrolls up. Chrome for mobile does that for example.

Need

Let the user know that something is being loaded.

I want to let the user know when something is loading. E.g. when a form is being submitted, when the page is loading, etc.

I'm open for it to be a spinner, a progress bar, or whatever.

What are the different ways to show the user a loading status and what libraries are there for that?

Need

Visualize data in charts, graphs, diagrams, etc.

I have lot's and all kinds of data and I want to show them to the user in a nice way.

I'm up for all kinds of visualization.

2 hidden (2 in Graveyard)
Add library

Need

Scroll to different sections.

I have a page with many sections. I want to display a menu listing all these sections. When the user clicks on a section in the menu then the page should scroll to the corresponding section.

Need

Format time / date / age to be human readable.

Our app is a social news site and we are using React. We are showing lot's of dates and we want to display them a nice human readable format. E.g. "Posted 9 minutes ago.".

All kinds of ways to print times, dates, and time-agos in a readable fashion are interessting to us.

Need

Show a single image/photo.

I'm interested in libraries that help display a single image to the user.

With features like pan, zoom, etc.

I'm not interessted in image manipulation libraries but only in libraries that help show an image to the user.

Need

Generate QR codes.

I'm looking for a React component to generate QR codes.

Need

Display a control element to paginate.

I'm looking for a small component allowing the user to select what page should be shown. E.g. by showing page number buttons, a "next page" button, and a "previous page" button.

Need

Parse and render markdown source.

I'm looking for a library that parses markdown source to a React element.

Need

Allow users to view and edit events in a calendar view.

Events are crucial to my app and the user should be able to view, edit and create new events.

He should be able to do all that with the help of a calendar view.

Is there a React library implementing such event calendar?

Need

Custom text input types.

I want to be able to arbitrary limit what the user can enter in a text input.

E.g. I want to be able to enforce the three first characters to be non-digit letters and the following three characters to be digits.

Need

Let the user select among a list of options by typing text.

I have a list of many options and I want the user to be able to choose one. A dropdown showing all options is not suitable since there can be hundreds of options. Instead the user should be able to type text and then only options matching the text are shown to him in a dropdown. I believe this technique to be called typeahead.

What are the typeahead libraries for React out there?

Need

Allow user to toggle a binary switch.

I basically want something like `<input type="checkbox">` where the user is able to switch between on/off, yes/no, true/false, i.e. between two states. I'm also interested in libraries implementing a third "neutral"/"unselected" state.

What are the React libraries implementing such toggle?

Need

Allow user to choose from a range of values.

I want the user to be able to choose a value between a minimum and a maximum by visually moving a handle towards the minimum value to decrease the chosen value or towards the maximum value to increase the chosen value.

What are the slider libraries for React out there?

Need

Display a set of options and let the user choose one.

The user has to choose among a couple of choices and I want to show him all choices without a dropdown and in general without having him interact with the app.

So basically something like a `<form>` with several `<input type="radio">`.

What are the React libraries out there implementing such radio group?

Need

Allow user to insert references in text.

I want the user to be able to insert inline references in a text he is writing. On Facebook for example, a user can write a comment that includes a mention of a friend.

Are there React libraries that help me achieve that?

Need

Automatically resize text input.

I want a text input / textarea that automatically resizes itself as the user adds / removes text so that the entire text is always visible.

Is there a React library that adds auto-resize functionality to a React input / textarea?

Need

Allow user to rate something with stars.

For example our app is showing entries that the user should be able to rate by "giving" between 0 and 5 stars.

Are there libraries that allow the user to "star-rate" something?

Need

Allow the user to drop a file from disk to the app.

Instead of using the standard file select input `<input type="file">` we want the user to be able to drag & drop a file to our application.

Need

Allow user to edit source code.

My React app shows several code snippets and I want the user to be able to edit them.

I'm looking for a text editor specialized on source code editing, that is with features like highlighting, auto-indenting, etc.

Need

Allow user to edit markdown source.

Right now my app lets the user edit markdown source in a `<textarea>`. But I want the editing to be a nicer experience.

For example by changing the style of the source text depending on the markdown interpretation; a `**an emphasis**` should be shown in bold and a `# A Header` shown with an increased font-size. Or for example by showing control elements to insert new links, headers, quotes, etc.

Are there markdown libraries for React that implement such features?

Need

Set of components + reponsive layout system.

Instead of having to implement common components myself I want to use a UI framework with a coherent design.

The framework should include a system to have responsive views that adapt to the screen size.

3-5 years old
26k
3y
material-ui
React Components that Implement Google's Material Design.
14k
3y
antd
A UI Design Language.
10k
4y
react-bootstrap
Bootstrap 3 components built with React.
6k
3y
react-toolbox
A set of React components implementing Google's Material Design specification with the power of CSS Modules.
3k
3y
elemental
A flexible and beautiful UI framework for React.js.
3k
3y
semantic-ui-react
The official Semantic-UI-React integration.
2k
3y
rebass
Configurable React Stateless Functional UI Components.
1k
3y
grommet
The most advanced UX framework for enterprise applications.
1k
3y
belle
Configurable React Components with great UX.
1k
3y
rctui
A collection of components for React, base on bootstrap 4.0.
540
3y
react-materialize
Material design for react, powered by materializecss.
446
4y
pivotal-ui-react
React components based on a custom version of the Bootstrap library.
401
3y
react-essence
Essence - The Essential Material Design Framework.
394
3y
react-material
Material design components written with React.js and React Style.
299
3y
react-foundation-apps
Foundation Apps components built with React.
1 hidden (1 in Graveyard)
Add library

Need

Bootstrap implemented with React.

I like Bootstrap, is there a React version of Boostrap?