SGDS Input Component Skill

<sgds-input> is a single-line form text input supporting all standard HTML input types, with built-in label, hint text, validation feedback, prefix/suffix addons, loading state, and an action slot.

Prerequisites

See sgds-components-setup for installation and framework integration (React 19+ vs React ≤18, Vue, Angular).

No CSS styling modifications — custom properties and CSS parts are not exposed on this component.

Quick Decision Guide

Standard text input? → type="text" (default)

Email validation? → type="email" required

Number with min/max? → type="number" with min, max, step

Password field? → type="password"