From 991155d3a5b91f1ca56eb8dfc1b1443ee5dae095 Mon Sep 17 00:00:00 2001
From: Victoria League <vleague@bitwarden.com>
Date: Mon, 26 Aug 2024 11:43:03 -0400
Subject: [PATCH] [CL-318] Ensure item content truncates when the 'start' slot
 is populated (#10727)

---
 libs/components/src/item/item-content.component.html | 2 +-
 libs/components/src/item/item.stories.ts             | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/libs/components/src/item/item-content.component.html b/libs/components/src/item/item-content.component.html
index da69c79c1eb..da45c8b3b61 100644
--- a/libs/components/src/item/item-content.component.html
+++ b/libs/components/src/item/item-content.component.html
@@ -1,7 +1,7 @@
 <div class="tw-flex tw-gap-2 tw-items-center tw-w-full">
   <ng-content select="[slot=start]"></ng-content>
 
-  <div class="tw-flex tw-flex-col tw-items-start tw-text-start tw-w-full [&_p]:tw-mb-0">
+  <div class="tw-flex tw-flex-col tw-items-start tw-text-start tw-w-full tw-truncate [&_p]:tw-mb-0">
     <div class="tw-text-main tw-text-base tw-w-full tw-truncate">
       <ng-content></ng-content>
     </div>
diff --git a/libs/components/src/item/item.stories.ts b/libs/components/src/item/item.stories.ts
index 5198d7efa62..e8accfd6933 100644
--- a/libs/components/src/item/item.stories.ts
+++ b/libs/components/src/item/item.stories.ts
@@ -115,6 +115,7 @@ export const TextOverflow: Story = {
     template: /*html*/ `
       <bit-item>
         <bit-item-content>
+          <i slot="start" class="bwi bwi-globe tw-text-3xl tw-text-muted" aria-hidden="true"></i>
           Helloooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo!
           <ng-container slot="secondary">Worlddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd!</ng-container>
         </bit-item-content>