diff options
| author | joonhoekim <26rote@gmail.com> | 2025-10-10 15:41:18 +0900 |
|---|---|---|
| committer | joonhoekim <26rote@gmail.com> | 2025-10-10 15:41:18 +0900 |
| commit | 4bac8ab190787d09371691f541627a3eb5866fa6 (patch) | |
| tree | 0e2ce42ee1d7d92ba010167a3244c1388665929c /components/data-table/infinite-data-table.tsx | |
| parent | fa60be1f2ccd7cca4813092889d078cfb2ca47b9 (diff) | |
(김준회) fix: nested column 에만 table-fixed 속성 적용하도록 조건부 처리
Diffstat (limited to 'components/data-table/infinite-data-table.tsx')
| -rw-r--r-- | components/data-table/infinite-data-table.tsx | 20 |
1 files changed, 13 insertions, 7 deletions
diff --git a/components/data-table/infinite-data-table.tsx b/components/data-table/infinite-data-table.tsx index d766f35c..0242e052 100644 --- a/components/data-table/infinite-data-table.tsx +++ b/components/data-table/infinite-data-table.tsx @@ -53,6 +53,13 @@ export function InfiniteDataTable<TData>({ useAutoSizeColumns(table, autoSizeColumns) + // nested header 감지: columns 속성을 가진 헤더가 있는지 확인 + const hasNestedHeader = React.useMemo(() => { + return table.getHeaderGroups().some(headerGroup => + headerGroup.headers.some(header => 'columns' in header.column.columnDef) + ) + }, [table]) + // 🎯 스크롤 상태 감지 추가 const [isScrolled, setIsScrolled] = React.useState(false) @@ -143,13 +150,12 @@ export function InfiniteDataTable<TData>({ style={{ maxHeight: maxHeight || '35rem' }} onScroll={handleScroll} // 🎯 스크롤 이벤트 핸들러 추가 > - <Table - className="[&>thead]:sticky [&>thead]:top-0 [&>thead]:z-10" - style={{ - width: getTableWidth(), // 🎯 동적 너비 계산 - minWidth: '100%' - }} - > + <Table + className={cn( + "[&>thead]:sticky [&>thead]:top-0 [&>thead]:z-10", + !hasNestedHeader && "table-fixed" // nested header가 없으면 table-fixed 적용 + )}> + {/* nested header가 있으면 table-fixed 제거, 없으면 적용 */} {/* 테이블 헤더 */} <TableHeader> {table.getHeaderGroups().map((headerGroup) => ( |
