nmm-xas-app-input-react v1.0.0

AppInput React Component

AppInput is a highly customizable and reusable input component for React applications. It supports various input types, including text, password, search, date, email, and number. This component also offers integrated validation messages and an option to include icons, making it a versatile choice for any React project.

Features

• Customizable Input Types: Supports text, password, search, date, email, and number.
• Validation Messages: Easily display error messages.
• Icon Support: Option to include icons within the input field.
• Flexible Styling: Utilizes styled-components for easy customization.

Installation

To use AppInput in your project, you will need to install the component and its peer dependencies if you haven't already.

npm install app-input-react
npm install react styled-components --save

Usage

Here's a quick guide to get you started with using AppInput in your React application.

First, import the AppInput component:

import AppInput from 'app-input-react';

Then, you can use it in your React component:

import React, { useState } from 'react';
import AppInput from 'app-input-react';

function MyComponent() {
  const [inputValue, setInputValue] = useState('');

  return (
    <div>
      <AppInput
        text="Enter your name"
        value={inputValue}
        setValue={setInputValue}
        errorMessage="This field is required"
        icon={<YourIconComponent />} // Optional: Include your icon component
      />
    </div>
  );
}

export default MyComponent;

Props