diff --git a/libs/components/src/form-field/form-field-control.ts b/libs/components/src/form-field/form-field-control.ts index 8fc1c5395dc..553f23f5b5f 100644 --- a/libs/components/src/form-field/form-field-control.ts +++ b/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; - spellcheck?: Signal; + type?: ModelSignal; + spellcheck?: ModelSignal; readOnly?: boolean; focus?: () => void; } diff --git a/libs/components/src/form-field/password-input-toggle.directive.ts b/libs/components/src/form-field/password-input-toggle.directive.ts index 0eeeca7362f..931928aa5cb 100644 --- a/libs/components/src/form-field/password-input-toggle.directive.ts +++ b/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); } } } diff --git a/libs/components/src/form-field/password-input-toggle.spec.ts b/libs/components/src/form-field/password-input-toggle.spec.ts index 114010c37bc..03c7507cead 100644 --- a/libs/components/src/form-field/password-input-toggle.spec.ts +++ b/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); }); }); }); diff --git a/libs/components/src/input/input.directive.ts b/libs/components/src/input/input.directive.ts index 1266559c7c6..2652a6aa034 100644 --- a/libs/components/src/input/input.directive.ts +++ b/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(); + type = model(); - readonly spellcheck = input(); + spellcheck = model(); // TODO: Skipped for migration because: // Accessor inputs cannot be migrated as they are too complex.