@droid-tech/react-ts-textarea

textarea

TextArea is a customizable React functional component that renders a textarea input field. It allows for various styling and layout options through its props, making it flexible and easy to use in different UI designs.

Features

• Customizable Border: Adjust border color, width, and radius.
• Flexible Dimensions: Control the number of rows and columns.
• Margin Control: Set top and bottom margins for spacing.
• Placeholder Text: Define custom placeholder text.
• Default Values: Pre-configured rows and columns for quick setup.
• CSS Integration: Supports className and inline styles.
• Lightweight: Simple, focused functionality.
• TypeScript Support: Provides type safety and IntelliSense.

Installation

To use the textarea component in your React application, install it via npm:

npm install @droid-tech/react-ts-textarea

Usage

To use the textarea component, import it and provide the required props:

import React from "react";
import { textarea } from "@droid-tech/react-ts-textarea";

<TextArea
  bColor="red"
  bWidth={3}
  bRadius={5}
  rws={12}
  col={100}
  mTop={30}
  mBottom={10}
  pHolder="Type your message here..."
/>;

Props

The textarea component accepts the following props:

Prop	Type	Default Value	Description
bColor	string	undefined	The color of the border.
bWidth	number	undefined	The width of the border in pixels.
bRadius	number	undefined	The border radius for rounded corners in pixels.
rws	number	8	The number of rows (height) for the textarea.
col	number	60	The number of columns (width) for the textarea.
mTop	number	undefined	The top margin in pixels.
mBottom	number	undefined	The bottom margin in pixels.
pHolder	number	undefined	Font weight of the textarea text