@syncfusion/react-inputs

React Inputs Components

What's Included in the React Inputs Package

The React Inputs package includes the following list of components.

React Numeric TextBox

The NumericTextBox component provides a specialized input field for numeric values with validation, formatting, and increment/decrement capabilities. It offers precise control over numeric input with support for various number formats, validation rules, and user interaction patterns.

Explore the demo here.

Key features

• Value constraints: Set minimum and maximum allowed values to restrict user input within specific numeric ranges.

• Step configuration: Define increment/decrement step size for precise value adjustments using spin buttons or keyboard controls.

• Spin buttons: Optional increment and decrement buttons that allow users to adjust values without typing.

• Number formatting: Comprehensive formatting options including decimal places, currency symbols, and percentage formatting.

• LabelMode Implements floating label functionality with configurable behavior modes to enhance form usability.

• Keyboard navigation: Enhanced keyboard support for incrementing/decrementing values using arrow keys.

React TextArea

The TextArea component provides a multi-line text input field with enhanced functionality for collecting longer text content from users. It offers various customization options to adapt to different application requirements and design systems.

Explore the demo here.

Key features

• Resizing options: Supports multiple resize modes including Both, Horizontal, and Vertical to control how users can resize the input area.

• LabelMode: Implements floating label functionality with configurable behavior modes to enhance form usability.

• Variants: Offers multiple visual styles including Standard, Outlined, and Filled variants to match your application's design language.

• Customizable dimensions: Supports setting specific dimensions through rows and cols properties or through width styling.

• Controlled and uncontrolled modes: Supports both controlled mode (using the value prop) and uncontrolled mode (using the defaultValue prop) to accommodate different state management approaches.

React TextBox

The TextBox component provides a feature-rich input field for collecting user text input with enhanced styling options and validation states. It supports both controlled and uncontrolled input modes to fit various application requirements.

Explore the demo here.

Key features

• Variants: Offers multiple visual styles including Standard, Outlined, and Filled variants to match your application's design language.

• Sizes: Provides size options (Small and Medium) to control the component's dimensions for different UI contexts.

• Color: Supports different color schemes including Success, Warning, and Error to visually communicate validation states.

• LabelMode: Implements floating label functionality with configurable behavior modes to enhance form usability.

• Prefix and suffix: Supports adding custom icons at the beginning or end of the input field for enhanced visual cues.

• Controlled and uncontrolled modes: Supports both controlled mode (using the value prop) and uncontrolled mode (using the defaultValue prop) to accommodate different state management approaches.

Trusted by the world's leading companies

Setup

To install inputs and its dependent packages, use the following command,

npm install @syncfusion/react-inputs

Support

Product support is available through following mediums.

• Support ticket - Guaranteed Response in 24 hours | Unlimited tickets | Holiday support
• Live chat

Changelog

Check the changelog here. Get minor improvements and bug fixes every week to stay up to date with frequent updates.

License and copyright

This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's EULA. To acquire a license for React UI components, you can purchase or start a free 30-day trial.

A free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.

See LICENSE FILE for more info.

© Copyright 2025 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.