Input

PreviousNext

Compact inset text input with muted, ghost, success, error, loading, and disabled states.

Used for workspace notifications.

Installation

pnpm dlx shadcn@latest add https://matos-ui.com/r/input.json

Usage

import { InputField } from "@/components/matos-ui/input"

<InputField
  label="Email"
  required
  placeholder="you@company.com"
  error={errors.email?.message}
  {...register("email")}
/>

Input is the primitive control. InputField composes label, description, status icon, and animated feedback, reserving message space by default so validation does not move adjacent fields. Pass reserveMessageSpace={false} for layouts that do not need that reservation.