LobeChatLobeHub
UI
Components
Chat
Mobile
Awesome
Brand
Mdx
Icons
Color
Changelog
Ctrl
K
General
ActionIcon
ActionIconGroup
Block
Button
Icon
Data Display
Avatar
Collapse
FileTypeIcon
FluentEmoji
GuideCard
Highlighter
Hotkey
Image
List
Markdown
MaterialFileTypeIcon
Mermaid
Segmented
Snippet
SortableList
Tag
Tooltip
Video
Data Entry
AutoComplete
CodeEditor
ColorSwatches
CopyButton
DatePicker
EditableText
EmojiPicker
Form
FormModal
HotkeyInput
ImageSelect
Input
SearchBar
Select
SliderWithInput
ThemeSwitch
Feedback
Alert
Drawer
Modal
Layout
DraggablePanel
Footer
Grid
Header
Layout
MaskShadow
ScrollShadow
Navigation
Burger
Dropdown
Menu
SideNav
Tabs
Toc
Theme
ConfigProvider
FontLoader
ThemeProvider

Input

A basic widget for getting the user input is a text field. Keyboard and mouse can be used for providing or changing data.

import { Input } from '@lobehub/ui';
NPM
UNPKG
BundlePhobia
PackagePhobia
Anvaka Graph
Source
Edit
Previous
ImageSelect
Next
SearchBar

Resources

Lobe UI-AIGC Components
Lobe Icon-AI / LLM Icon Collection
Lobe Charts-Modern Charts
Lobe TTS-TTS / STT Library

Community

Report Bug
Request Feature

Help

GitHub
Changelog

More Products

🤯 Lobe Chat-AI / LLM Chat Framework
🧸 Lobe Vidol-Virtual Idols for EveryOne
🅰️ Lobe Theme-Stable Diffusion Extension
🌐 Lobe i18n-AI i18next CLI
Copyright © 2022-2025
Made with 🤯 by LobeHub
LobeHub

Default

The rest of the props of Input are exactly the same as the original input.

TextArea

InputNumber

InputPassword

InputOPT

APIs

Input

PropertyDescriptionTypeDefault
shadowEnable shadow effect for the inputbooleanfalse
variantStyle variant of the input'filled' | 'outlined' | 'borderless'Dark mode: 'filled'
Light mode: 'outlined'

Input inherits all properties from Ant Design's Input component.

Input.TextArea

PropertyDescriptionTypeDefault
shadowEnable shadow effect for the textareabooleanfalse
variantStyle variant of the textarea'filled' | 'outlined' | 'borderless'Dark mode: 'filled'
Light mode: 'outlined'
resizeWhether textarea is resizablebooleanfalse

TextArea inherits all properties from Ant Design's Input.TextArea component.

Input.Number

PropertyDescriptionTypeDefault
shadowEnable shadow effect for the inputbooleanfalse
variantStyle variant of the input'filled' | 'outlined' | 'borderless'Dark mode: 'filled'
Light mode: 'outlined'

InputNumber inherits all properties from Ant Design's InputNumber component.

Input.Password

PropertyDescriptionTypeDefault
shadowEnable shadow effect for the inputbooleanfalse
variantStyle variant of the input'filled' | 'outlined' | 'borderless'Dark mode: 'filled'
Light mode: 'outlined'

InputPassword inherits all properties from Ant Design's Input.Password component.

Input.OPT

PropertyDescriptionTypeDefault
shadowEnable shadow effect for the inputbooleanfalse
variantStyle variant of the input'filled' | 'outlined' | 'borderless'Dark mode: 'filled'
Light mode: 'outlined'

InputOPT inherits all properties from Ant Design's Input.OTP component.