Input

Free

Enhanced input component with built-in variants, validation states, loading indicators, icons, and Material Design floating labels.

Installation

Install via CLI

npx @moontra/moonui-cli add input

Usage

Examples

Basic Usage

Simple text inputs with different types

Variants

Four built-in visual styles via the variant prop

Sizes

Small, medium, and large inputs via the size prop

With Icons

Built-in leftIcon and rightIcon props

Validation States

Built-in success, error, and loading states via props

This looks good!

This field is required

Floating Label

Built-in Material Design floating label via the floatingLabel prop

Password Toggle

Password visibility toggle using the built-in rightButton prop

Click the eye icon to toggle visibility

Disabled State

With Label