From a5c96dae85f9d9200913fd9cbd85dd8534cba099 Mon Sep 17 00:00:00 2001
From: Anveshreddy mekala <amekala@esri.com>
Date: Fri, 29 Aug 2025 13:59:52 -0500
Subject: [PATCH 1/2] fix(block): no longer renders an empty header

---
 .../src/components/block/block.scss               | 15 ++++++++++++---
 .../src/components/block/block.stories.ts         |  9 +++++++++
 .../src/components/block/block.tsx                | 15 ++++++++++++++-
 .../src/components/block/resources.ts             |  2 +-
 4 files changed, 36 insertions(+), 5 deletions(-)

diff --git a/packages/calcite-components/src/components/block/block.scss b/packages/calcite-components/src/components/block/block.scss
index 2635bab0a57..06e055a3493 100644
--- a/packages/calcite-components/src/components/block/block.scss
+++ b/packages/calcite-components/src/components/block/block.scss
@@ -26,10 +26,13 @@
 
 :host([scale="s"]) {
   .header {
-    padding: var(--calcite-spacing-sm);
     gap: var(--calcite-spacing-sm);
   }
 
+  .header--has-content {
+    padding: var(--calcite-spacing-sm);
+  }
+
   .icon-end-container {
     gap: var(--calcite-spacing-sm);
     padding-inline-end: var(--calcite-spacing-sm);
@@ -55,10 +58,13 @@
 
 :host([scale="m"]) {
   .header {
-    padding: var(--calcite-spacing-md);
     gap: var(--calcite-spacing-md);
   }
 
+  .header--has-content {
+    padding: var(--calcite-spacing-md);
+  }
+
   .icon-end-container {
     gap: var(--calcite-spacing-md);
     padding-inline-end: var(--calcite-spacing-md);
@@ -84,10 +90,13 @@
 
 :host([scale="l"]) {
   .header {
-    padding: var(--calcite-spacing-lg);
     gap: var(--calcite-spacing-lg);
   }
 
+  .header--has-content {
+    padding: var(--calcite-spacing-lg);
+  }
+
   .icon-end-container {
     gap: var(--calcite-spacing-lg);
     padding-inline-end: var(--calcite-spacing-lg);
diff --git a/packages/calcite-components/src/components/block/block.stories.ts b/packages/calcite-components/src/components/block/block.stories.ts
index 3e48bdcc108..350387ce741 100644
--- a/packages/calcite-components/src/components/block/block.stories.ts
+++ b/packages/calcite-components/src/components/block/block.stories.ts
@@ -387,3 +387,12 @@ export const allScales = (): string =>
       }
     </style>
     <div class="container">${blockHTML("s")} ${blockHTML("m")} ${blockHTML("l")}</div>`;
+
+export const emptyHeader = (): string => html`
+  <calcite-block expanded calcite-hydrated>
+    <calcite-label layout="inline-space-between">
+      <div>Favorite vegetable</div>
+      <calcite-icon icon="information" />
+    </calcite-label>
+  </calcite-block>
+`;
diff --git a/packages/calcite-components/src/components/block/block.tsx b/packages/calcite-components/src/components/block/block.tsx
index 15892f9e27b..7b8f6404717 100644
--- a/packages/calcite-components/src/components/block/block.tsx
+++ b/packages/calcite-components/src/components/block/block.tsx
@@ -530,13 +530,26 @@ export class Block extends LitElement implements InteractiveComponent, OpenClose
       setSize,
       dragDisabled,
       sortDisabled,
+      hasContentStart,
+      iconStart,
     } = this;
 
     const toggleLabel = expanded ? messages.collapse : messages.expand;
+    const headerHasContent = !!(
+      heading ||
+      description ||
+      hasContentStart ||
+      iconStart ||
+      loading ||
+      status
+    );
 
     const headerContent = (
       <header
-        class={{ [CSS.header]: true, [CSS.headerHasText]: !!(heading || description) }}
+        class={{
+          [CSS.header]: true,
+          [CSS.headerHasContent]: headerHasContent,
+        }}
         id={IDS.header}
       >
         {this.renderIcon("start")}
diff --git a/packages/calcite-components/src/components/block/resources.ts b/packages/calcite-components/src/components/block/resources.ts
index 333229b4a0d..90df6646fb8 100644
--- a/packages/calcite-components/src/components/block/resources.ts
+++ b/packages/calcite-components/src/components/block/resources.ts
@@ -14,7 +14,7 @@ export const CSS = {
   description: "description",
   header: "header",
   headerContainer: "header-container",
-  headerHasText: "header--has-text",
+  headerHasContent: "header--has-content",
   heading: "heading",
   icon: "icon",
   iconStart: "icon--start",

From 7d60d280b2edd522bec459284302fba381aef7c3 Mon Sep 17 00:00:00 2001
From: Anveshreddy mekala <amekala@esri.com>
Date: Tue, 2 Sep 2025 12:35:18 -0500
Subject: [PATCH 2/2] fix test failures

---
 .../calcite-components/src/components/block/block.e2e.ts    | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/calcite-components/src/components/block/block.e2e.ts b/packages/calcite-components/src/components/block/block.e2e.ts
index 1a2483ae182..e25f769f8b8 100644
--- a/packages/calcite-components/src/components/block/block.e2e.ts
+++ b/packages/calcite-components/src/components/block/block.e2e.ts
@@ -427,17 +427,17 @@ describe("calcite-block", () => {
       block.setAttribute("heading", "test-heading");
       await page.waitForChanges();
 
-      expect(header).toHaveClass(CSS.headerHasText);
+      expect(header).toHaveClass(CSS.headerHasContent);
 
       block.removeAttribute("heading");
       await page.waitForChanges();
 
-      expect(header).not.toHaveClass(CSS.headerHasText);
+      expect(header).not.toHaveClass(CSS.headerHasContent);
 
       block.setAttribute("description", "test-description");
       await page.waitForChanges();
 
-      expect(header).toHaveClass(CSS.headerHasText);
+      expect(header).toHaveClass(CSS.headerHasContent);
     });
   });