RFC: Angular package for Formisch - architecture design and open questions

[sonukapoor]

Following our conversation about adding Angular support to Formisch, I have done a deep architectural study of Formisch's internals and Angular Signals to understand how an Angular adapter would work. This discussion documents the findings and open design questions before I go further.

How Angular maps to Formisch's signal system

Formisch's Signal<T> interface ({ value: T }) can be adapted to Angular's WritableSignal with a thin getter/setter wrapper:

Formisch concept	Angular equivalent	Adaptation
Signal<T> { value }	WritableSignal<T> (callable)	Wrapper: get value() { return s(); }, set value(v) { s.set(v); }
batch(fn)	automatic in Angular scheduler	no-op, same as Vue and Svelte
untrack(fn)	untracked(fn) from @angular/core	direct mapping

No changes to existing core code. index.angular.ts is purely additive, following the exact same pattern as the six existing framework adapters.

Proposed API

// Component class
form = injectForm({ schema: LoginSchema, validate: 'submit', revalidate: 'input' });
email = injectField(this.form, ['email'] as const);

// Template — fields return Angular Signal<T>/computed<T>, called as functions
{{ email.input() }}
{{ email.errors() }}
{{ form.isValid() }}

Fields also available declaratively:

<formisch-form [of]="form" (submit)="onSubmit($event)">
  <formisch-field [of]="form" [path]="['email']" #email="formischField">
    <input [value]="email.input()" (blur)="email.onBlur()">
    @if (email.errors()) {
      <span>{{ email.errors()![0] }}</span>
    }
  </formisch-field>
</formisch-form>

Package structure

Follows the exact monorepo layout of every existing adapter:

packages/core/src/framework/
  index.angular.ts

frameworks/angular/src/
  functions/        ← like hooks/ (React), composables/ (Vue), runes/ (Svelte)
    injectForm/
    injectField/
    injectFieldArray/
  components/
    Field/
    FieldArray/
    Form/
  types/

Why this differs from Angular Signal Forms

Angular Signal Forms (experimental in v21) treats Valibot as a validator plugin layered on top of a separately owned signal. Formisch's approach treats the Valibot schema as the single source of truth - the field tree, types, and validation all derive from it. The validated output type (v.InferOutput<TSchema>) is preserved at submission, which Angular Signal Forms does not support.

Open questions

1. Should @formisch/angular live in the main monorepo (frameworks/angular/) from the start, or begin as a separate community repo and graduate later?
2. Any constraints in @formisch/core I should be aware of before building the adapter?
3. Are there open issues where the Angular work overlaps - happy to take those on as part of this effort.

I am ready to start the prototype and happy to open a draft PR whenever you are ready.

[fabian-hiller]

This looks good to me! Thank you for your research.

1. I think it should live in the main repo and be published via @formisch/angular
2. No, the more complicated work will be in frameworks/angular and playgrounds/angular
3. No, you are welcome to get started 🔥