From bd6e09e5fbf474a04e3b79db99a28ec3ee1f8f86 Mon Sep 17 00:00:00 2001
From: William Martin <contact@willmartian.com>
Date: Tue, 12 Nov 2024 17:12:41 -0500
Subject: [PATCH] remove gap in favor of margin due to virtual scroll height
 calculation

---
 libs/components/src/item/item-group.component.ts | 2 +-
 libs/components/src/item/item.component.ts       | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/libs/components/src/item/item-group.component.ts b/libs/components/src/item/item-group.component.ts
index 756009e4efe..2a9a8275cc6 100644
--- a/libs/components/src/item/item-group.component.ts
+++ b/libs/components/src/item/item-group.component.ts
@@ -7,7 +7,7 @@ import { ChangeDetectionStrategy, Component } from "@angular/core";
   template: `<ng-content></ng-content>`,
   changeDetection: ChangeDetectionStrategy.OnPush,
   host: {
-    class: "tw-block tw-flex tw-flex-col tw-gap-1.5 bit-compact:tw-gap-0",
+    class: "tw-block",
   },
 })
 export class ItemGroupComponent {}
diff --git a/libs/components/src/item/item.component.ts b/libs/components/src/item/item.component.ts
index 1c44964ef97..de35a100283 100644
--- a/libs/components/src/item/item.component.ts
+++ b/libs/components/src/item/item.component.ts
@@ -21,9 +21,9 @@ export const BitItemHeightClass = `tw-h-[52px]`;
  * to estimate how many items can be displayed at once and how large the virtual container should be.
  * Needs to be updated if the item height or spacing changes.
  *
- * 52px + 1px border = 53px
+ * 52px + 6px bottom margin + 1px border = 53px
  */
-export const BitItemHeight = 53;
+export const BitItemHeight = 59;
 
 @Component({
   selector: "bit-item",
@@ -34,7 +34,7 @@ export const BitItemHeight = 53;
   providers: [{ provide: A11yRowDirective, useExisting: ItemComponent }],
   host: {
     class:
-      "tw-block tw-box-border tw-overflow-auto tw-flex tw-bg-background [&:has(.item-main-content_button:hover,.item-main-content_a:hover)]:tw-cursor-pointer [&:has(.item-main-content_button:hover,.item-main-content_a:hover)]:tw-bg-primary-100 tw-text-main tw-border-solid tw-border-b tw-border-0 [&:not(bit-layout_*)]:tw-rounded-lg bit-compact:[&:not(bit-layout_*)]:tw-rounded-none bit-compact:[&:not(bit-layout_*)]:last-of-type:tw-rounded-b-lg bit-compact:[&:not(bit-layout_*)]:first-of-type:tw-rounded-t-lg tw-min-h-9",
+      "tw-block tw-box-border tw-overflow-auto tw-flex tw-bg-background [&:has(.item-main-content_button:hover,.item-main-content_a:hover)]:tw-cursor-pointer [&:has(.item-main-content_button:hover,.item-main-content_a:hover)]:tw-bg-primary-100 tw-text-main tw-border-solid tw-border-b tw-border-0 [&:not(bit-layout_*)]:tw-rounded-lg bit-compact:[&:not(bit-layout_*)]:tw-rounded-none bit-compact:[&:not(bit-layout_*)]:last-of-type:tw-rounded-b-lg bit-compact:[&:not(bit-layout_*)]:first-of-type:tw-rounded-t-lg tw-min-h-9 tw-mb-1.5 bit-compact:tw-mb-0",
   },
 })
 export class ItemComponent extends A11yRowDirective {