INPUT

Single-line text field with optional label, prefix symbol, and inline error message. Green caret, amber error states.

PREVIEW

CALLSIGN

COORDINATES

ACCESS CODE

⚠ Invalid authorization token.

INSTALLATION

BASH

npx shadcn@latest add @scificn/input

USAGE

TSX

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

export function Example() {
  return (
    <Input
      label="TARGET DESIGNATION"
      placeholder="ENTER TARGET ID..."
      onChange={(e) => console.log(e.target.value)}
    />
  )
}

STATES

SECTOR

DEFAULT

COMMAND

PREFIX

AUTH TOKEN

⚠ Authorization failed.

ERROR

SYSTEM ID

DISABLED

PROPS

PROP	TYPE	DEFAULT	DESCRIPTION
label	string	—	Label text displayed above the input. Auto-generates the id/htmlFor binding.
error	string	—	Inline error message shown below. Turns border and label amber.
prefix	string	—	Symbol rendered inside the left edge of the input.
disabled	boolean	false	Disables the field and reduces opacity.
placeholder	string	—	Placeholder text (inherits --text-muted color).
id	string	—	Override the auto-generated id.