diff options
Diffstat (limited to 'components/data-table/expandable-data-table.tsx')
| -rw-r--r-- | components/data-table/expandable-data-table.tsx | 20 |
1 files changed, 13 insertions, 7 deletions
diff --git a/components/data-table/expandable-data-table.tsx b/components/data-table/expandable-data-table.tsx index d36f0251..165ebd34 100644 --- a/components/data-table/expandable-data-table.tsx +++ b/components/data-table/expandable-data-table.tsx @@ -59,6 +59,13 @@ export function ExpandableDataTable<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 containerRef = React.useRef<HTMLDivElement>(null) const scrollRef = React.useRef<HTMLDivElement>(null) const [expandedHeights, setExpandedHeights] = React.useState<Map<string, number>>(new Map()) @@ -499,13 +506,12 @@ export function ExpandableDataTable<TData>({ style={{ maxHeight: maxHeight || '34rem' }} 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 className="bg-background"> {table.getHeaderGroups().map((headerGroup) => ( <TableRow key={headerGroup.id} className={compactStyles.headerRow}> |