form-system
CommunityBuild robust forms with ease and confidence.
AuthorJasonPaff
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill standardizes form development using a custom TanStack Form integration, ensuring consistent patterns for validation, focus management, server action integration, and accessibility, reducing boilerplate and improving user experience.
Core Features & Use Cases
- Standardized Form Setup: Enforces
useAppFormwith Zod validation,revalidateLogic, andwithFocusManagementfor consistent form behavior. - Rich Field Components: Guides the use of pre-built field components (
TextField,SelectField,SwitchField, etc.) for consistent UI and functionality. - Integrated Server Action Submission: Ensures forms seamlessly integrate with
useServerActionfor submission, handling loading states and toast notifications automatically. - Use Case: When creating a new user registration form, this Skill ensures it uses
useAppFormwithTextFieldandCheckboxFieldcomponents, integrates Zod for validation, handles invalid submissions by focusing the first error, and usesuseServerActionfor submission.
Quick Start
Create a new user registration form using useAppForm with TextField and CheckboxField components, integrating Zod for validation and useServerAction for submission.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 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-system Download link: https://github.com/JasonPaff/head-shakers/archive/main.zip#form-system Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.