diff options
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) => ( |