Input

Form

Trường nhập liệu hỗ trợ label, icon, validation và auto-toggle password. Xây dựng trên Base UI Field.

Cài đặt

Import

TSX

3 kiểu hiển thị khác nhau.

Default

Filled

Flushed

Icon ở đầu hoặc cuối input.

Username

Tự động hiện toggle hiển thị mật khẩu.

Mật khẩu

Xác nhận

Hiển thị lỗi và mô tả bổ sung.

Email không hợp lệ

Username

Tên hiển thị công khai

Prop	Type	Default	Mô tả
`variant`	`"default" \| "filled" \| "flushed"`	`"default"`	Kiểu hiển thị input
`label`	`string`	—	Label hiển thị phía trên input
`placeholder`	`string`	—	Placeholder text
`type`	`string`	`"text"`	Loại input HTML. Khi type="password" tự động hiện toggle ẩn/hiện mật khẩu
`icon`	`ReactNode`	—	Icon hiển thị bên trái input
`endIcon`	`ReactNode`	—	Icon hiển thị bên phải (bị bỏ qua khi type="password")
`required`	`boolean`	—	Đánh dấu trường bắt buộc, hiển thị dấu * đỏ sau label
`disabled`	`boolean`	—	Vô hiệu hóa input
`error`	`string`	—	Thông báo lỗi, áp dụng màu danger cho border và text
`description`	`string`	—	Mô tả bổ sung bên dưới input (ẩn khi có error)
`className`	`string`	—	Class CSS tuỳ chỉnh cho thẻ input