Dinachi
  • Docs
  • Playground

Getting started

—Conventions—Installation—CLI—Skills—LLMs

Foundations

—Theming

Integrations

—JSON Render—Playground

Form19

—Autocomplete—Button—Checkbox—Checkbox Group—Combobox—Field—Fieldset—Form—Input—Label—Number Field—OTP Field—Radio—Select—Slider—Switch—Textarea—Toggle—Toggle Group

Display5

—Accordion—Avatar—Badge—Collapsible—Text

Layout4

—Card—Scroll Area—Separator—Toolbar

Navigation4

—Link—Menubar—Navigation Menu—Tabs

Overlay8

—Alert Dialog—Context Menu—Dialog—Drawer—Menu—Popover—Preview Card—Tooltip

Feedback4

—Meter—Progress—Skeleton—Toast

Motion19

—Animated IconNew—Animated ListNew—Animated TabsNew—CarouselNew—Compare SliderNew—Expandable CardNew—Hold to ConfirmNew—Load TransitionNew—MarqueeNew—Number TickerNew—Progress RingNew—Scroll ProgressNew—Scroll RevealNew—SortableNew—Stagger ListNew—Streaming TextNew—Swipeable RowNew—Text MorphNew—Text ShimmerNew

Input

A flexible input field component supporting various types and states. Designed for seamless form integration.

View Source

#Installation

npx @dinachi/cli@latest add input

#Usage

tsx
import { Input } from '@/components/ui/input'

#Examples

#API Reference

PropTypeDefaultDescription
typestring'text'The type of the input field
placeholderstring—Placeholder text displayed when the input is empty
disabledbooleanfalseWhether the input is disabled
Previous:Form
Next:Label