# @workshack/form-builder

Workshack Form Builder Library provides typed FormGroup helpers and utilities for Angular reactive forms. This library integrates seamlessly with `@workshack/ui` and `@workshack/input` to provide a complete form building solution with strong TypeScript typing.

## Features

- 🔧 **Typed FormGroup Helpers** - Strongly typed reactive forms with IntelliSense support
- 🎮 **Gaming UI Integration** - Works seamlessly with @workshack/ui components
- 🎯 **Input Navigation** - Integrates with @workshack/input for gamepad/keyboard navigation
- 📝 **Form Validation** - Enhanced validation helpers with typed error messages
- 🚀 **Angular 20+** - Built for modern Angular applications
- 💡 **TypeScript First** - Full TypeScript support with strict typing

## Installation

```bash
npm install @workshack/form-builder @workshack/ui @workshack/input
```

## Quick Start

```typescript
import { FormBuilderModule } from '@workshack/form-builder';

@NgModule({
  imports: [
    FormBuilderModule,
    // ... other imports
  ],
})
export class AppModule { }
```

## Dependencies

This library requires the following peer dependencies:

- `@angular/core`: ^20.1.3
- `@angular/common`: ^20.1.3
- `@angular/forms`: ^20.1.3
- `@workshack/ui`: ^1.0.0
- `@workshack/input`: ^1.0.0

## Documentation

> 📚 **Coming Soon**: Detailed documentation and examples will be added when the typed FormGroup helpers are implemented.

### Planned Features

- **TypedFormGroup<T>** - Strongly typed FormGroup with IntelliSense
- **FormBuilderService** - Service for creating typed forms
- **ValidationHelpers** - Typed validation functions
- **FormFieldComponents** - Pre-built form field components
- **FormLayoutComponents** - Layout components for forms

## Example Usage (Planned)

```typescript
// Example of planned API - will be implemented soon
interface UserForm {
  name: string;
  email: string;
  age: number;
}

const form = this.typedFormBuilder.group<UserForm>({
  name: ['', [Validators.required]],
  email: ['', [Validators.required, Validators.email]],
  age: [0, [Validators.required, Validators.min(18)]]
});

// Full TypeScript support
form.get('name')?.value; // string | null
form.value; // Partial<UserForm>
```

## Integration with Workshack Libraries

This library is designed to work seamlessly with:

- **@workshack/ui** - Gaming-inspired UI components
- **@workshack/input** - Gamepad and keyboard navigation support

## License

This library is licensed under a custom license. See [LICENSE](./LICENSE) for details.

### Commercial Use

For commercial applications, attribution is required. Include the following in your application:

```
This application uses Workshack Form Builder Library (https://www.npmjs.com/package/@workshack/form-builder) © 2025 Workshack Team
```

## Contributing

This library is part of the Workshack ecosystem. For contributions and issues, please refer to the main repository.

## Changelog

### 1.0.0
- Initial release with basic module structure
- Ready for typed FormGroup helpers implementation
- Integration foundation for @workshack/ui and @workshack/input