From 7f1c8b9bc7a6062bc6b7e580a4a51b3466be5e6f Mon Sep 17 00:00:00 2001
From: damyanpetev <damyanpetev@users.noreply.github.com>
Date: Tue, 20 Jan 2026 20:04:48 +0200
Subject: [PATCH] fix: handle declarative columns nested in wrapping element

---
 src/components/grid.ts     | 12 ++++++++++--
 test/column-config.test.ts |  7 ++++++-
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/components/grid.ts b/src/components/grid.ts
index e2af303..9df7e4e 100644
--- a/src/components/grid.ts
+++ b/src/components/grid.ts
@@ -40,6 +40,14 @@ import IgcGridLiteHeaderRow from './header-row.js';
 import IgcGridLiteRow from './row.js';
 import IgcVirtualizer from './virtualizer.js';
 
+/** Column reducer matching either direct column element or one nested in container */
+function columnReducer<T extends Element>(acc: T[], el: T): T[] {
+  const tag = IgcGridLiteColumn.tagName;
+  const column = el.matches(tag) ? el : el.querySelector(tag);
+  if (column) acc.push(column as T);
+  return acc;
+}
+
 /**
  * Event object for the filtering event of the grid.
  */
@@ -348,7 +356,7 @@ export class IgcGridLite<T extends object> extends EventEmitterBase<IgcGridLiteE
     const slot = this.renderRoot.querySelector('slot') as HTMLSlotElement;
     const assignedNodes = slot
       .assignedElements({ flatten: true })
-      .filter((element) => element.matches(IgcGridLiteColumn.tagName));
+      .reduce<Element[]>(columnReducer, []);
     return assignedNodes.length > 0;
   }
 
@@ -356,7 +364,7 @@ export class IgcGridLite<T extends object> extends EventEmitterBase<IgcGridLiteE
     const slot = event.target as HTMLSlotElement;
     const assignedNodes = slot
       .assignedElements({ flatten: true })
-      .filter((element) => element.matches(IgcGridLiteColumn.tagName));
+      .reduce<Element[]>(columnReducer, []);
 
     this._stateController.setColumnConfiguration(
       assignedNodes as unknown as ColumnConfiguration<T>[]
diff --git a/test/column-config.test.ts b/test/column-config.test.ts
index 352c596..6948f78 100644
--- a/test/column-config.test.ts
+++ b/test/column-config.test.ts
@@ -26,9 +26,14 @@ describe('Column configuration', () => {
       const newKeys: Array<Keys<TestData>> = ['id', 'name'];
 
       TDD.grid.replaceChildren(
-        ...newKeys.map((key) => {
+        ...newKeys.map((key, i) => {
           const col = document.createElement(GRID_COLUMN_TAG) as IgcGridLiteColumn<TestData>;
           col.field = key;
+          if (i % 2 === 0) {
+            const div = document.createElement('div');
+            div.appendChild(col);
+            return div;
+          }
           return col;
         })
       );