Form composition·loomora/Inputs
Inputs
A lightweight field collection useful when you want the input dispatcher without the outer Form element or actions.
Interactive live playground
Tweak props, change states, and see the live component respond in real time.
How to call
Import directly from the Loomora package root. For projects without Tailwind CSS, ensure loomora/dist/index.css is imported once in your root layout.
import { Inputs } from 'loomora'
<Inputs inputs={[
{ type: 'text', label: 'First name', properties: { value, onChange } },
{ type: 'textarea', label: 'Bio', properties: { value: bio, onChange: setBio } },
]} />API reference
Important public props and how they affect rendering.
| Prop | Type | Default | Description |
|---|---|---|---|
| inputs | InputProps[] | [] | Fields rendered in order. |
| wrapper.size | WrapperSize[] | ['grid-cols-12'] | Grid column utility classes. |
| wrapper.className | string | 'items-start gap-3 w-full' | Classes applied to the grid wrapper. |
| empty | ReactNode | — | Content returned when no input definition remains. |