React Selectable Fast screenshot

React Selectable Fast

Author Avatar Theme by Valerybugakov
Updated: 28 Oct 2020
266 Stars

Enable React components to be selectable via mouse/touch.

Overview

React-selectable-fast is an innovative solution designed to enhance the interactivity of React components by enabling selection capabilities via mouse or touch. This package is built upon the original react-selectable library but significantly improves the performance, especially when handling large lists of selectable items. By minimizing unnecessary re-renders during selection, it creates a seamless user experience, making it an ideal choice for applications that require robust selection features.

The package introduces additional functionalities that allow for a more dynamic selection process, including support for scrolling during selections. With its user-friendly API and customizable options, React-selectable-fast offers developers a powerful tool in creating efficient and responsive interfaces.

Features

  • Efficient Rendering: Only the items within the select box will re-render during selection, optimizing performance for large lists.

  • Scroll Support: Allows for scrolling through items while selecting, relative to the window and specified scroll container, enhancing usability.

  • Customizable SelectableGroup: The <SelectableGroup /> component can be configured with various props for tailored functionality.

  • Selection Callbacks: Supports multiple callbacks such as duringSelection, onSelectionFinish, and onSelectionClear for better control of the selection process.

  • Deselect Options: Provides options for deselecting items, allowing for flexible selection scenarios, including mixed selections.

  • CSS Class Names: Custom class names can be assigned to various elements (like select box and selectable group) for consistent styling across the application.

  • Compatibility with ES5: The package is built for broad browser compatibility while still requiring modern JavaScript features, making it suitable for most environments.

  • Accessibility Features: Options like allowClickWithoutSelected enhance usability by defining how selections can be made based on user interactions.