fix form field control, input, and password-input-toggle errors

libs/components/src/form-field/form-field-control.ts

@@ -1,6 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 
-import { Signal } from "@angular/core";
+import { ModelSignal, Signal } from "@angular/core";
 
 // @ts-strict-ignore
 export type InputTypes =
@@ -22,8 +22,8 @@ export abstract class BitFormFieldControl {
   required: boolean;
   hasError: boolean;
   error: [string, any];
-  type?: Signal<InputTypes>;
-  spellcheck?: Signal<boolean>;
+  type?: ModelSignal<InputTypes>;
+  spellcheck?: ModelSignal<boolean | undefined>;
   readOnly?: boolean;
   focus?: () => void;
 }

libs/components/src/form-field/password-input-toggle.directive.ts

@@ -58,7 +58,7 @@ export class BitPasswordInputToggleDirective implements AfterContentInit, OnChan
 
   ngAfterContentInit(): void {
     if (this.formField.input?.type) {
-      this.toggled.set(this.formField.input.type !== "password");
+      this.toggled.set(this.formField.input.type() !== "password");
     }
     this.button.icon = this.icon;
   }
@@ -66,8 +66,8 @@ export class BitPasswordInputToggleDirective implements AfterContentInit, OnChan
   private update() {
     this.button.icon = this.icon;
     if (this.formField.input?.type != null) {
-      this.formField.input.type = this.toggled() ? "text" : "password";
-      this.formField.input.spellcheck = this.toggled() ? false : undefined;
+      this.formField.input.type.set(this.toggled() ? "text" : "password");
+      this.formField?.input?.spellcheck?.set(this.toggled() ? false : undefined);
     }
   }
 }

libs/components/src/form-field/password-input-toggle.spec.ts

@@ -64,11 +64,11 @@ describe("PasswordInputToggle", () => {
     });
 
     it("input is type password", () => {
-      expect(input.type).toBe("password");
+      expect(input.type!()).toBe("password");
     });
 
     it("spellcheck is disabled", () => {
-      expect(input.spellcheck).toBe(undefined);
+      expect(input.spellcheck!()).toBe(undefined);
     });
   });
 
@@ -82,11 +82,11 @@ describe("PasswordInputToggle", () => {
     });
 
     it("input is type text", () => {
-      expect(input.type).toBe("text");
+      expect(input.type!()).toBe("text");
     });
 
     it("spellcheck is disabled", () => {
-      expect(input.spellcheck).toBe(false);
+      expect(input.spellcheck!()).toBe(false);
     });
   });
 
@@ -101,11 +101,11 @@ describe("PasswordInputToggle", () => {
     });
 
     it("input is type password", () => {
-      expect(input.type).toBe("password");
+      expect(input.type!()).toBe("password");
     });
 
     it("spellcheck is disabled", () => {
-      expect(input.spellcheck).toBe(undefined);
+      expect(input.spellcheck!()).toBe(undefined);
     });
   });
 });

libs/components/src/input/input.directive.ts

@@ -10,6 +10,7 @@ import {
   Optional,
   Self,
   input,
+  model,
 } from "@angular/core";
 import { NgControl, Validators } from "@angular/forms";
 
@@ -67,9 +68,9 @@ export class BitInputDirective implements BitFormFieldControl {
     return this.hasError ? true : undefined;
   }
 
-  readonly type = input<InputTypes>();
+  type = model<InputTypes>();
 
-  readonly spellcheck = input<boolean>();
+  spellcheck = model<boolean>();
 
   // TODO: Skipped for migration because:
   //  Accessor inputs cannot be migrated as they are too complex.