Skip to content
Launch GitLab Knowledge Graph

Build Input component with validation support

Component Specification

Accessible Input component with built-in validation.

Input Types

  • text, password, email, tel, url, search
  • number (with min/max/step)
  • textarea (auto-resize option)

Features

  • Label + helper text
  • Error message display
  • Success state
  • Character counter
  • Prefix/suffix icons
  • Clear button
  • Password toggle visibility

Validation

  • Built-in HTML5 validation
  • Custom validation functions
  • Async validation support
  • Real-time vs on-blur validation

Accessibility

  • Proper label association
  • aria-invalid on errors
  • aria-describedby for helper text
  • Error announcements

Related Epic

&4 (closed)

Edited by Administrator