Skills
.Work. You
Rest

form-components

Community

Ship accessible forms faster.

Software Engineering#consistency#accessibility#React#validation#components#UI#form
Authorvassovass
Version1.0.0
Installs0

System Documentation

What problem does it solve?

StepLeague UI currently requires developers to recreate basic form handling behavior across screens. This skill provides a library of accessible, standardized form components to reduce boilerplate and ensure consistent UX.

Core Features & Use Cases

  • Auto-generates id/name and ties labels to inputs
  • Provides FormInput, FormSelect, FormCheckbox, FormTextarea, FormFileInput
  • Ensures accessibility attributes (aria-describedby, aria-invalid) and consistent styling
  • Use in any screen requiring user input, settings, or data-entry forms
  • Example: standardizing a signup form or a settings page

Quick Start

To begin, use the form components from the shared UI library when building forms. Import FormInput, FormSelect, FormCheckbox, FormTextarea, and FormFileInput from the shared UI library form-fields and replace raw HTML inputs with these components. Ensure each field has a unique fieldName, a descriptive label, and proper error/description handling.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: form-components
Download link: https://github.com/vassovass/scl-v3/archive/main.zip#form-components

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.