From 22bb1316cd1726673fdd6e34b5a3d92ec8809572 Mon Sep 17 00:00:00 2001
From: Jason Ng <jng@bitwarden.com>
Date: Mon, 29 Jul 2024 11:16:00 -0400
Subject: [PATCH] PM-10047 update name input in item details (#10294)

---
 .../item-details-v2.component.html             | 18 ++++++++++--------
 .../item-details/item-details-v2.component.ts  |  2 ++
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/libs/vault/src/cipher-view/item-details/item-details-v2.component.html b/libs/vault/src/cipher-view/item-details/item-details-v2.component.html
index 77042755f88..ee8b17e71cc 100644
--- a/libs/vault/src/cipher-view/item-details/item-details-v2.component.html
+++ b/libs/vault/src/cipher-view/item-details/item-details-v2.component.html
@@ -7,14 +7,16 @@
       <label class="tw-block tw-w-full tw-mb-1 tw-text-xs tw-text-muted tw-select-none">
         {{ "itemName" | i18n }}
       </label>
-      <input
-        readonly
-        bitInput
-        type="text"
-        [value]="cipher.name"
-        aria-readonly="true"
-        data-testid="item-name"
-      />
+      <bit-form-field>
+        <input
+          readonly
+          bitInput
+          type="text"
+          [value]="cipher.name"
+          aria-readonly="true"
+          data-testid="item-name"
+        />
+      </bit-form-field>
     </div>
 
     <ul
diff --git a/libs/vault/src/cipher-view/item-details/item-details-v2.component.ts b/libs/vault/src/cipher-view/item-details/item-details-v2.component.ts
index 0694283b04f..e490c7c00da 100644
--- a/libs/vault/src/cipher-view/item-details/item-details-v2.component.ts
+++ b/libs/vault/src/cipher-view/item-details/item-details-v2.component.ts
@@ -11,6 +11,7 @@ import {
   SectionComponent,
   SectionHeaderComponent,
   TypographyModule,
+  FormFieldModule,
 } from "@bitwarden/components";
 
 import { OrgIconDirective } from "../../components/org-icon.directive";
@@ -27,6 +28,7 @@ import { OrgIconDirective } from "../../components/org-icon.directive";
     SectionHeaderComponent,
     TypographyModule,
     OrgIconDirective,
+    FormFieldModule,
   ],
 })
 export class ItemDetailsV2Component {