Merge branch 'main' into autofill/pm-5189-fix-issues-present-with-inline-menu-rendering-in-iframes

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

@@ -1,47 +1,29 @@
 <div [formGroup]="form">
-  <div class="form-group">
-    <label for="vaultTimeout">{{ "vaultTimeout" | i18n }}</label>
-    <select
-      id="vaultTimeout"
-      name="VaultTimeout"
-      formControlName="vaultTimeout"
-      class="form-control"
-    >
-      <option *ngFor="let o of vaultTimeoutOptions" [ngValue]="o.value">{{ o.name }}</option>
-    </select>
-    <small class="form-text text-muted">{{
+  <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
-    }}</small>
-  </div>
-  <div class="form-group" *ngIf="showCustom" formGroupName="custom">
-    <label for="customVaultTimeout">{{ "customVaultTimeout" | i18n }}</label>
-    <div class="row">
-      <div class="col-6">
-        <input
-          id="hours"
-          class="form-control"
-          type="number"
-          min="0"
-          name="hours"
-          formControlName="hours"
-        />
-        <small>{{ "hours" | i18n }}</small>
-      </div>
-      <div class="col-6">
-        <input
-          id="minutes"
-          class="form-control"
-          type="number"
-          min="0"
-          name="minutes"
-          formControlName="minutes"
-        />
-        <small>{{ "minutes" | i18n }}</small>
-      </div>
-    </div>
-
-    <small *ngIf="!exceedsMinimumTimout" class="tw-text-danger">
-      <i class="bwi bwi-error" aria-hidden="true"></i> {{ "vaultCustomTimeoutMinimum" | i18n }}
-    </small>
+    }}</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>

package-lock.json

@@ -99,7 +99,7 @@
         "@types/firefox-webext-browser": "111.0.5",
         "@types/inquirer": "8.2.10",
         "@types/jest": "29.5.12",
-        "@types/jquery": "3.5.29",
+        "@types/jquery": "3.5.30",
         "@types/jsdom": "21.1.6",
         "@types/koa": "2.14.0",
         "@types/koa__multer": "2.0.7",
@@ -10340,9 +10340,9 @@
       "dev": true
     },
     "node_modules/@types/jquery": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.29.tgz",
-      "integrity": "sha512-oXQQC9X9MOPRrMhPHHOsXqeQDnWeCDT3PelUIg/Oy8FAbzSZtFHRjc7IpbfFVmpLtJ+UOoywpRsuO5Jxjybyeg==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.30.tgz",
+      "integrity": "sha512-nbWKkkyb919DOUxjmRVk8vwtDb0/k8FKncmUKFi+NY+QXqWltooxTrswvz4LspQwxvLdvzBN1TImr6cw3aQx2A==",
       "dev": true,
       "dependencies": {
         "@types/sizzle": "*"

package.json

@@ -60,7 +60,7 @@
     "@types/firefox-webext-browser": "111.0.5",
     "@types/inquirer": "8.2.10",
     "@types/jest": "29.5.12",
-    "@types/jquery": "3.5.29",
+    "@types/jquery": "3.5.30",
     "@types/jsdom": "21.1.6",
     "@types/koa": "2.14.0",
     "@types/koa__multer": "2.0.7",