novixuiv0.1
Install

Components · v0.1

Input

A polished, accessible text input. Labels are always semantic, errors are announced to assistive tech, and icon affixes keep the type baseline stable.

Example

The simplest possible use.

Labels and hints

Only lowercase letters, numbers, and dashes.

Icon affixes

Errors

Setting error applies invalid styling, wires up aria-invalid, and announces the message via aria-describedby.

This handle is already taken.

API

Prop
Type
Default
Description
  • label
    string
    —
    Visible semantic label. Auto-associates with the input.
  • hint
    string
    —
    Helper text shown below the input.
  • error
    string
    —
    Error message. Applies invalid styling and aria-invalid.
  • leadingIcon
    ReactNode
    —
    Icon rendered inside the left padding.
  • trailingIcon
    ReactNode
    —
    Icon rendered inside the right padding.
  • size
    "sm" | "md" | "lg"
    "md"
    Height and typography scale.