Input

The Input component allows users to enter text data. It supports standard HTML input attributes, custom labels, helper text, and integrated error states with smooth animations.

Live Preview

Installation

Usage Guide

1. Import the Component

Import the component into your React or Next.js page:

import { Input } from "@/components/ui/input";

2. Implementation Example

Render the component and customize its behavior by passing props:

import { Input } from "@/components/ui/input";

export default function Example() {
  return (
    <div className="w-full flex items-center justify-center p-8">
      <Input
        error="example"
        label="example"
        helperText="example"
      />
    </div>
  );
}