@ng-forge/dynamic-forms-bootstrap

@ng-forge/dynamic-forms-bootstrap

Bootstrap 5 field components for @ng-forge/dynamic-forms.

Stability: This library is built on Angular Signal Forms, which is stable as of Angular v22. Check the compatibility matrix below for supported Angular versions.

Compatibility

Angular	@ng-forge/dynamic-forms-bootstrap
22.x	1.x
21.x	0.x (experimental)

Versioned in lockstep with @ng-forge/dynamic-forms. The 0.x line targets Angular 21 (experimental Signal Forms). Each release pins its Angular requirement via peerDependencies; npm warns on a mismatch.

Installation

npm install @ng-forge/dynamic-forms @ng-forge/dynamic-forms-bootstrap bootstrap

Setup

// styles.scss
@import 'bootstrap/dist/css/bootstrap.min.css';

// app.config.ts
import { provideDynamicForm } from '@ng-forge/dynamic-forms';
import { withBootstrapFields } from '@ng-forge/dynamic-forms-bootstrap';

export const appConfig: ApplicationConfig = {
  providers: [provideDynamicForm(...withBootstrapFields())],
};

Usage

import { DynamicForm, type FormConfig, type InferFormValue } from '@ng-forge/dynamic-forms';

@Component({
  imports: [DynamicForm],
  template: `<form [dynamic-form]="config" (submitted)="onSubmit($event)"></form>`,
})
export class MyFormComponent {
  config = {
    fields: [
      { key: 'email', type: 'input', value: '', label: 'Email', required: true, email: true, props: { floatingLabel: true } },
      { type: 'submit', key: 'submit', label: 'Submit', props: { variant: 'primary' } },
    ],
  } as const satisfies FormConfig;

  onSubmit(value: InferFormValue<typeof this.config.fields>) {
    console.log('Form submitted:', value);
  }
}

Global Configuration

provideDynamicForm(
  ...withBootstrapFields({
    floatingLabel: true,
    size: 'lg',
    variant: 'primary',
  }),
);

Field Types

Input, Select, Checkbox, Toggle, Button, Submit, Next, Previous, Textarea, Radio, Multi-Checkbox, Datepicker, Slider

Documentation

• Feature overview
• Bootstrap Integration
• Field Types
• Validation
• Conditional Logic

Changelog

See GitHub Releases.

Contributing

Contributions are welcome! Please read our Contributing Guide.

License

MIT © ng-forge