[CL-135] Migrate component library to standalone components (#12389)

* Migrate component library to standalone components

* Fix tests

libs/components/src/form-field/error-summary.component.ts

@@ -1,8 +1,11 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
+import { NgIf } from "@angular/common";
 import { Component, Input } from "@angular/core";
 import { AbstractControl, UntypedFormGroup } from "@angular/forms";
 
+import { I18nPipe } from "../shared/i18n.pipe";
+
 @Component({
   selector: "bit-error-summary",
   template: ` <ng-container *ngIf="errorCount > 0">
@@ -12,6 +15,8 @@ import { AbstractControl, UntypedFormGroup } from "@angular/forms";
     class: "tw-block tw-text-danger tw-mt-2",
     "aria-live": "assertive",
   },
+  standalone: true,
+  imports: [NgIf, I18nPipe],
 })
 export class BitErrorSummary {
   @Input()

libs/components/src/form-field/error.component.ts

@@ -14,6 +14,7 @@ let nextId = 0;
     class: "tw-block tw-mt-1 tw-text-danger tw-text-xs",
     "aria-live": "assertive",
   },
+  standalone: true,
 })
 export class BitErrorComponent {
   @HostBinding() id = `bit-error-${nextId++}`;

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

@@ -1,5 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
+import { CommonModule } from "@angular/common";
 import {
   AfterContentChecked,
   booleanAttribute,
@@ -16,6 +17,7 @@ import {
 import { BitHintComponent } from "../form-control/hint.component";
 import { BitLabel } from "../form-control/label.component";
 import { inputBorderClasses } from "../input/input.directive";
+import { I18nPipe } from "../shared/i18n.pipe";
 
 import { BitErrorComponent } from "./error.component";
 import { BitFormFieldControl } from "./form-field-control";
@@ -23,6 +25,8 @@ import { BitFormFieldControl } from "./form-field-control";
 @Component({
   selector: "bit-form-field",
   templateUrl: "./form-field.component.html",
+  standalone: true,
+  imports: [CommonModule, BitErrorComponent, I18nPipe],
 })
 export class BitFormFieldComponent implements AfterContentChecked {
   @ContentChild(BitFormFieldControl) input: BitFormFieldControl;

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

@@ -1,11 +1,8 @@
 import { NgModule } from "@angular/core";
 
 import { FormControlModule } from "../form-control";
-import { BitInputDirective } from "../input/input.directive";
 import { InputModule } from "../input/input.module";
-import { MultiSelectComponent } from "../multi-select/multi-select.component";
 import { MultiSelectModule } from "../multi-select/multi-select.module";
-import { SharedModule } from "../shared";
 
 import { BitErrorSummary } from "./error-summary.component";
 import { BitErrorComponent } from "./error.component";
@@ -15,8 +12,11 @@ import { BitPrefixDirective } from "./prefix.directive";
 import { BitSuffixDirective } from "./suffix.directive";
 
 @NgModule({
-  imports: [SharedModule, FormControlModule, InputModule, MultiSelectModule],
-  declarations: [
+  imports: [
+    FormControlModule,
+    InputModule,
+    MultiSelectModule,
+
     BitErrorComponent,
     BitErrorSummary,
     BitFormFieldComponent,
@@ -25,15 +25,16 @@ import { BitSuffixDirective } from "./suffix.directive";
     BitSuffixDirective,
   ],
   exports: [
+    FormControlModule,
+    InputModule,
+    MultiSelectModule,
+
     BitErrorComponent,
     BitErrorSummary,
     BitFormFieldComponent,
-    BitInputDirective,
     BitPasswordInputToggleDirective,
     BitPrefixDirective,
     BitSuffixDirective,
-    MultiSelectComponent,
-    FormControlModule,
   ],
 })
 export class FormFieldModule {}

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

@@ -18,6 +18,7 @@ import { BitFormFieldComponent } from "./form-field.component";
 
 @Directive({
   selector: "[bitPasswordInputToggle]",
+  standalone: true,
 })
 export class BitPasswordInputToggleDirective implements AfterContentInit, OnChanges {
   /**

libs/components/src/form-field/prefix.directive.ts

@@ -4,6 +4,7 @@ import { BitIconButtonComponent } from "../icon-button/icon-button.component";
 
 @Directive({
   selector: "[bitPrefix]",
+  standalone: true,
 })
 export class BitPrefixDirective implements OnInit {
   @HostBinding("class") @Input() get classList() {

libs/components/src/form-field/suffix.directive.ts

@@ -4,6 +4,7 @@ import { BitIconButtonComponent } from "../icon-button/icon-button.component";
 
 @Directive({
   selector: "[bitSuffix]",
+  standalone: true,
 })
 export class BitSuffixDirective implements OnInit {
   @HostBinding("class") @Input() get classList() {