[PM-8397] Make vault timeout input standalone (#9366)

* Move vault-timeout-input to @bitwarden/auth/angular

Move vault-timeout-input.component.ts to @bitwarden/auth/angular/vault-timeout-input
Expose via barrel file
Fix imports on clients

* Add dependencies to package.json

Not necessary right now, but good practice for once we move to building each package independently

* Make VaultTimeoutInputComponent a standalone component

* Update selector to present team ownership

* Use new standalone on web

Move vault-timeout-input.component.html to @bitwarden/auth/angular/vault-timeout-input/
Delete old vault-timeout-input.component on web
Register new component on loose-components-module
Update used selector in preferences.component

* Remove unneeded export of VaultTimeoutInputComponent

---------

Co-authored-by: Daniel James Smith <djsmith85@users.noreply.github.com>

apps/web/src/app/settings/preferences.component.html

@@ -17,12 +17,12 @@
         {{ "vaultTimeoutActionPolicyInEffect" | i18n: (policy.action | i18n) }}
       </span>
     </bit-callout>
-    <app-vault-timeout-input
+    <auth-vault-timeout-input
       [vaultTimeoutOptions]="vaultTimeoutOptions"
       [formControl]="form.controls.vaultTimeout"
       ngDefaultControl
     >
-    </app-vault-timeout-input>
+    </auth-vault-timeout-input>
     <ng-container *ngIf="availableVaultTimeoutActions$ | async as availableVaultTimeoutActions">
       <bit-radio-group
         formControlName="vaultTimeoutAction"

apps/web/src/app/settings/vault-timeout-input.component.html

@@ -1,29 +0,0 @@
-<div [formGroup]="form">
-  <bit-form-field>
-    <bit-label>{{ "vaultTimeout" | i18n }}</bit-label>
-    <bit-select formControlName="vaultTimeout">
-      <bit-option
-        *ngFor="let o of vaultTimeoutOptions"
-        [value]="o.value"
-        [label]="o.name"
-      ></bit-option>
-    </bit-select>
-    <bit-hint class="tw-text-sm">{{
-      ((canLockVault$ | async) ? "vaultTimeoutDesc" : "vaultTimeoutLogoutDesc") | i18n
-    }}</bit-hint>
-  </bit-form-field>
-  <div class="tw-grid tw-grid-cols-12 tw-gap-4" *ngIf="showCustom" formGroupName="custom">
-    <bit-form-field class="tw-col-span-6">
-      <bit-label>{{ "customVaultTimeout" | i18n }}</bit-label>
-      <input bitInput type="number" min="0" formControlName="hours" />
-      <bit-hint>{{ "hours" | i18n }}</bit-hint>
-    </bit-form-field>
-    <bit-form-field class="tw-col-span-6 tw-self-end">
-      <input bitInput type="number" min="0" name="minutes" formControlName="minutes" />
-      <bit-hint>{{ "minutes" | i18n }}</bit-hint>
-    </bit-form-field>
-  </div>
-  <small *ngIf="!exceedsMinimumTimout" class="tw-text-danger">
-    <i class="bwi bwi-error" aria-hidden="true"></i> {{ "vaultCustomTimeoutMinimum" | i18n }}
-  </small>
-</div>

apps/web/src/app/settings/vault-timeout-input.component.ts

@@ -1,22 +0,0 @@
-import { Component } from "@angular/core";
-import { NG_VALIDATORS, NG_VALUE_ACCESSOR } from "@angular/forms";
-
-import { VaultTimeoutInputComponent as VaultTimeoutInputComponentBase } from "@bitwarden/angular/components/settings/vault-timeout-input.component";
-
-@Component({
-  selector: "app-vault-timeout-input",
-  templateUrl: "vault-timeout-input.component.html",
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      multi: true,
-      useExisting: VaultTimeoutInputComponent,
-    },
-    {
-      provide: NG_VALIDATORS,
-      multi: true,
-      useExisting: VaultTimeoutInputComponent,
-    },
-  ],
-})
-export class VaultTimeoutInputComponent extends VaultTimeoutInputComponentBase {}

apps/web/src/app/shared/loose-components.module.ts

@@ -3,6 +3,7 @@ import { NgModule } from "@angular/core";
 import {
   PasswordCalloutComponent,
   UserVerificationFormInputComponent,
+  VaultTimeoutInputComponent,
 } from "@bitwarden/auth/angular";
 import { LayoutComponent, NavigationModule } from "@bitwarden/components";
 
@@ -70,7 +71,6 @@ import { ProductSwitcherModule } from "../layouts/product-switcher/product-switc
 import { UserLayoutComponent } from "../layouts/user-layout.component";
 import { DomainRulesComponent } from "../settings/domain-rules.component";
 import { PreferencesComponent } from "../settings/preferences.component";
-import { VaultTimeoutInputComponent } from "../settings/vault-timeout-input.component";
 import { GeneratorComponent } from "../tools/generator.component";
 import { PasswordGeneratorHistoryComponent } from "../tools/password-generator-history.component";
 import { AddEditComponent as SendAddEditComponent } from "../tools/send/add-edit.component";
@@ -116,6 +116,7 @@ import { SharedModule } from "./shared.module";
     UserLayoutComponent,
     PaymentMethodWarningsModule,
     VerifyRecoverDeleteOrgComponent,
+    VaultTimeoutInputComponent,
   ],
   declarations: [
     AcceptFamilySponsorshipComponent,
@@ -183,7 +184,6 @@ import { SharedModule } from "./shared.module";
     TwoFactorYubiKeyComponent,
     UpdatePasswordComponent,
     UpdateTempPasswordComponent,
-    VaultTimeoutInputComponent,
     VerifyEmailTokenComponent,
     VerifyRecoverDeleteComponent,
     VerifyRecoverDeleteProviderComponent,
@@ -258,7 +258,6 @@ import { SharedModule } from "./shared.module";
     UpdatePasswordComponent,
     UpdateTempPasswordComponent,
     UserLayoutComponent,
-    VaultTimeoutInputComponent,
     VerifyEmailTokenComponent,
     VerifyRecoverDeleteComponent,
     VerifyRecoverDeleteProviderComponent,