@dynatrace/strato-components 3.4.0 → 3.5.0

package/esm/tables/DataTable/components/DataTableHeaderCell.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/tables/DataTable/components/DataTableHeaderCell.tsx"],
-  "sourcesContent": ["import { flexRender, type SortDirection } from '@tanstack/react-table';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport clsx from 'clsx';\nimport {\n  type JSX,\n  memo,\n  type PropsWithChildren,\n  useCallback,\n  useRef,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIntl, type IntlShape } from 'react-intl';\n\nimport * as alignmentStyles from './Alignment.sty.js';\nimport { DataTablePinningShadowHeaderCells } from './ColumnPinning/DataTablePinningShadowHeaderCells.js';\nimport * as headerCellStyles from './DataTableHeaderCell.sty.js';\nimport { useMergeRefs } from '../../../core/hooks/useMergeRefs.js';\nimport { Tooltip } from '../../../overlays/tooltip/Tooltip.js';\nimport { TextEllipsis } from '../../../typography/text-ellipsis/TextEllipsis.js';\nimport { getColumnLabel } from '../../utils/get-column-label.js';\nimport {\n  DATA_TABLE_BORDER_WIDTH,\n  DATA_TABLE_DEFAULT_HORIZONTAL_ALIGNMENT,\n  DATA_TABLE_SPACER_COLUMN_ID,\n} from '../constants.js';\nimport {\n  DataTableColumnContextProvider,\n  DataTableHeaderContextProvider,\n  useDataTable,\n} from '../contexts/DataTableContext.js';\nimport * as tableStyles from '../DataTable.sty.js';\nimport * as columnOrderStyles from '../features/ColumnOrder/ColumnOrder.sty.js';\nimport { SortingArrowIndicators } from '../features/Sorting/SortingArrowIndicators.js';\nimport { SubRowsHeaderExpander } from '../features/SubRows/SubRowExpanders.js';\nimport { SubRowsHeaderWidthCorrection } from '../features/SubRows/SubRows.js';\nimport { InlineUserActionsMenu } from '../features/UserActions/InlineUserActionsMenu.js';\nimport { useHeaderCellInteractions } from '../hooks/useHeaderCellInteractions.js';\nimport { useHeaderCellDragAndDrop } from '../hooks/useHeaderDragAndDrop.js';\nimport type { Header } from '../hooks/useTable/types.js';\nimport { dataTableMessages } from '../messages.js';\n\ninterface DataTableHeaderCellProps extends PropsWithChildren {\n  /**\n   * Header to be rendered with this header cell.\n   */\n  header: Header<unknown, unknown>;\n\n  /**\n   * All headers in the same group (row).\n   */\n  headers: Header<unknown, unknown>[];\n\n  /**\n   * Header group id from the TanStack/table header object.\n   */\n  headerGroupId: string;\n\n  /**\n   * RowIndex based on the virtualization index.\n   */\n  rowIndex: number;\n\n  /**\n   * ColumnIndex based on the virtualization index.\n   */\n  columnIndex: number;\n\n  /**\n   * The index of the last header row.\n   */\n  lastRowIndex: number;\n}\n\n/**\n * Memoized wrapper for TextEllipsis in header cells to avoid unnecessary re-calculations.\n */\nconst HeaderTextEllipsis = memo(\n  ({\n    children,\n    onTextOverflow,\n  }: {\n    children: string;\n    onTextOverflow: (ellipsized: boolean) => void;\n  }) => {\n    return (\n      <TextEllipsis\n        onTextOverflow={onTextOverflow}\n        className={headerCellStyles.headerCellEllipsis}\n      >\n        {children}\n      </TextEllipsis>\n    );\n  },\n);\n\n/**\n * Hook that gets the aria-label for the header according to the different table configurations.\n *\n * @param param0 - object containing everything to create the labels\n * according to the current table configuration.\n * @returns the aria label for the header cell.\n * @internal\n */\nexport function getHeaderAriaLabel({\n  intl,\n  columnLabel,\n  nextSortingOrder,\n  canSort,\n  columnDragAndDropMode,\n  isCustomHeader,\n  role,\n}: {\n  intl: IntlShape;\n  columnLabel: string;\n  nextSortingOrder: false | SortDirection | undefined;\n  canSort?: boolean;\n  columnDragAndDropMode: 'none' | 'enabled' | 'only';\n  isCustomHeader: boolean;\n  role: 'columnheader' | 'presentation';\n}): string | undefined {\n  // Don't set an aria-label on elements with role=\"presentation\"\n  if (role === 'presentation') {\n    return undefined;\n  }\n\n  if (canSort && columnDragAndDropMode === 'none') {\n    return intl.formatMessage(dataTableMessages.sortingLabel, {\n      column: columnLabel,\n      direction: nextSortingOrder,\n    });\n  }\n  if (canSort && columnDragAndDropMode === 'enabled') {\n    return intl.formatMessage(dataTableMessages.sortingDragAndDropLabel, {\n      column: columnLabel,\n      direction: nextSortingOrder,\n    });\n  }\n  if (columnDragAndDropMode !== 'none') {\n    return intl.formatMessage(dataTableMessages.dragAndDropLabel, {\n      column: columnLabel,\n    });\n  }\n  return isCustomHeader ? columnLabel : undefined;\n}\n\n/**\n * Gets the aria-description for the header according to the different sorting states.\n *\n * @returns the aria description for the header cell, or undefined if no description should be set.\n * @internal\n */\nfunction getHeaderAriaSortDescription({\n  intl,\n  role,\n  isSorted,\n  multiSortPriority,\n  sortedColumnsCount,\n}: {\n  intl: IntlShape;\n  role: 'columnheader' | 'presentation';\n  isSorted: false | SortDirection;\n  multiSortPriority: number | undefined;\n  sortedColumnsCount: number;\n}): string | undefined {\n  if (role === 'presentation' || !isSorted) {\n    return undefined;\n  }\n\n  if (multiSortPriority !== undefined) {\n    return intl.formatMessage(dataTableMessages.sortingStateWithPriorityLabel, {\n      direction: isSorted,\n      priority: multiSortPriority,\n      total: sortedColumnsCount,\n    });\n  }\n\n  return intl.formatMessage(dataTableMessages.sortingStateLabel, {\n    direction: isSorted,\n  });\n}\n\n/**\n * Returns the `data-dt-name` value for a header cell based on which interactions are enabled.\n *\n * @param param0 - object containing the necessary information to determine the correct `data-dt-name` value.\n * @returns the `data-dt-name` value for the header cell, or undefined if no interaction is enabled.\n * @internal\n */\nfunction getInteractionDtName({\n  columnDragAndDropMode,\n  canSort,\n}: {\n  columnDragAndDropMode: 'none' | 'enabled' | 'only';\n  canSort: boolean;\n}): string | undefined {\n  // only ordering is enabled, but not sorting\n  if (\n    columnDragAndDropMode === 'only' ||\n    (columnDragAndDropMode === 'enabled' && !canSort)\n  ) {\n    return 'ColumnHeaderOrder';\n  }\n  // sorting and ordering are enabled together\n  if (canSort && columnDragAndDropMode === 'enabled') {\n    return 'ColumnHeaderOrderAndSort';\n  }\n  // only sorting is enabled, but not ordering\n  return 'ColumnHeaderSort';\n}\n\n/**\n * Returns the `data-dt-properties` value for a header cell, reflecting the next sorting action\n * that will be performed when the user clicks the header.\n *\n * @param nextSortingOrder - the next sorting order.\n * @returns the `data-dt-properties` value, or undefined if sorting is not applicable.\n * @internal\n */\nfunction getInteractionDtProperties(\n  canSort: boolean,\n  nextSortingOrder: false | SortDirection | undefined,\n): string | undefined {\n  if (!canSort || nextSortingOrder === undefined) {\n    return undefined;\n  }\n\n  switch (nextSortingOrder) {\n    case 'asc':\n      return 'state:ascending';\n    case 'desc':\n      return 'state:descending';\n    case false:\n      return 'state:clearSort';\n  }\n}\n\n/**\n * Returns the additional z-index elevation for a left-pinned column so that its\n * resize handle renders above the next pinned column to the right.\n * Returns 0 for non-left-pinned columns and parent headers without resize handles.\n * @internal\n */\nfunction getLeftAdditionalElevation(\n  isPinnedLeft: boolean,\n  canResize: boolean,\n  columnId: string,\n  leftPinnedColumns: { id: string }[],\n): string {\n  if (!isPinnedLeft || !canResize) {\n    return '0';\n  }\n  const idx = leftPinnedColumns.findIndex((c) => c.id === columnId);\n  return `${leftPinnedColumns.length - 1 - idx}`;\n}\n\nexport function DataTableHeaderCell(\n  props: Readonly<DataTableHeaderCellProps>,\n): JSX.Element | null {\n  const {\n    header,\n    headers,\n    headerGroupId,\n    rowIndex,\n    columnIndex: virtualColumnIndex,\n    lastRowIndex,\n  } = props;\n\n  const intl = useIntl();\n  const table = useDataTable();\n  const { rowDensity, verticalDividers } = table.getVisualVariantOptions();\n  const columnDragAndDropMode = header.getColumnDragAndDropMode();\n\n  const gridPosition = header.getGridPosition(headers);\n  const column = header.column;\n  const { id: columnId, parent, columns: childColumns, columnDef } = column;\n  const columnIndex =\n    rowIndex === 0 ? gridPosition.gridColumnStart - 1 : virtualColumnIndex;\n\n  const canSort = column.getCanSort();\n  const canColumnActions = column.getCanColumnActions();\n\n  const textOverflowRef = useRef(false);\n  const handleTextOverflow = useCallback((ellipsized: boolean) => {\n    textOverflowRef.current = ellipsized;\n  }, []);\n\n  const { setNodeRef, isDragging, portalRef, dragAndDropProps } =\n    useHeaderCellDragAndDrop({\n      headerId: header.id,\n      column,\n      columnIndex,\n      columnDragAndDropMode,\n    });\n  const divRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs<HTMLElement | null>([setNodeRef, divRef]);\n\n  const {\n    handleCellMouseEnter,\n    handleCellMouseLeave,\n    handleCellActionsClose,\n    handleCellClick,\n  } = useHeaderCellInteractions({\n    headerCell: divRef.current,\n    canSort,\n    canColumnActions,\n    rowDensity,\n    getToggleSortingHandler: column.getToggleSortingHandler,\n  });\n\n  // Early exit if the header is a placeholder to not render any content.\n  if (header.isPlaceholder) {\n    return null;\n  }\n  const headerGroupsLength = table.getHeaderGroups().length;\n  const tableState = table.getState();\n  // Only count columns that are actually sortable to avoid gaps in priority numbers\n  // when a column is in the sorting state but has sorting disabled.\n  const activeSortEntries =\n    tableState.sorting?.filter((sort) => {\n      const col = table.getColumn(sort.id);\n      return col?.getCanSort() ?? false;\n    }) ?? [];\n  const sortedColumnsCount = activeSortEntries.length;\n\n  const enableExpanding = table.options.enableExpanding;\n  const canResize = column.getCanResize();\n  const isResizing = column.getIsResizing();\n  const isSorted = column.getIsSorted();\n  const columnSortIndex = activeSortEntries.findIndex(\n    (sort) => sort.id === column.id,\n  );\n  const multiSortPriority =\n    sortedColumnsCount > 1 && columnSortIndex >= 0\n      ? columnSortIndex + 1\n      : undefined;\n  const isColumnDragActive = tableState.draggedHeaderColumn !== undefined;\n\n  const isRightAligned = columnDef.alignment === 'right';\n  // even if vertical dividers are not set, they should be rendered for nested headers and when resizing is enabled\n  const renderVerticalDividers =\n    verticalDividers ||\n    table.getHeaderGroups().length > 1 ||\n    (table.options.enableColumnResizing &&\n      (canResize ||\n        // when resizing is enabled we need to render the vertical dividers for the spacer column as well\n        column.id === DATA_TABLE_SPACER_COLUMN_ID));\n\n  const floatingMenuHeaderColumnId =\n    (tableState.floatingMenuInfo?.rowId === null &&\n      tableState.floatingMenuInfo?.headerId) ||\n    undefined;\n\n  const hasCustomHeaderRenderer = columnDef.meta?.hasCustomHeaderRenderer;\n  const children = hasCustomHeaderRenderer ? (\n    <DataTableColumnContextProvider value={header.column}>\n      {flexRender(columnDef.header, header.getContext())}\n    </DataTableColumnContextProvider>\n  ) : (\n    flexRender(columnDef.header, header.getContext())\n  );\n  const isStringHeader = typeof children === 'string';\n\n  const role =\n    columnDef.meta?.spacer === true ? 'presentation' : 'columnheader';\n  const columnLabel = getColumnLabel(column);\n  const nextSortingOrder = column.getNextSortingOrder();\n  const ariaLabel = getHeaderAriaLabel({\n    intl,\n    columnLabel,\n    nextSortingOrder,\n    canSort,\n    columnDragAndDropMode,\n    isCustomHeader: !isStringHeader,\n    role,\n  });\n  const ariaSortDescription = getHeaderAriaSortDescription({\n    intl,\n    role,\n    isSorted,\n    multiSortPriority,\n    sortedColumnsCount,\n  });\n\n  // subrows\n  const isSubRowIndicatorColumn =\n    enableExpanding === true &&\n    table.getSubRowIndicatorColumnId() === column.id;\n  const subRowsWidthCorrection =\n    // only render the subrow width correction in the subrow indicator column\n    enableExpanding === true && isSubRowIndicatorColumn ? (\n      <SubRowsHeaderWidthCorrection\n        subRowOpenDepth={table.getSubRowOpenDepth()}\n      />\n    ) : null;\n\n  // column pinning\n  const pinningPosition = header.getIsPinned();\n  const isPinnedLeft = pinningPosition === 'left';\n  const isPinnedRight = pinningPosition === 'right';\n  const leftPinnedPosition = isPinnedLeft\n    ? header.getLeftPinnedPosition()\n    : undefined;\n  const leftPinnedPositionPx =\n    leftPinnedPosition === undefined ? undefined : `${leftPinnedPosition}px`;\n\n  // Calculate additional z-index elevation for left-pinned columns so that the resize handle\n  // of each column is rendered above the following pinned column to the right.\n  const leftAdditionalElevation = getLeftAdditionalElevation(\n    isPinnedLeft,\n    canResize,\n    columnId,\n    table.getLeftVisibleLeafColumns(),\n  );\n\n  const rightPinnedPosition = isPinnedRight\n    ? header.getRightPinnedPosition()\n    : undefined;\n  const rightPinnedPositionPx =\n    rightPinnedPosition === undefined ? undefined : `${rightPinnedPosition}px`;\n\n  const hasChildren = childColumns.length > 0;\n  const isEdgeColumnInGroup =\n    parent?.getCenterVisibleLeafColumns().at(-1) === column ||\n    parent?.getLeftVisibleLeafColumns().at(-1) === column ||\n    parent?.getRightVisibleLeafColumns().at(0) === column;\n\n  const isLastVisibleLeftPinnedHeader = isPinnedLeft\n    ? header.getIsLastVisibleLeftPinnedHeader()\n    : false;\n  const isFirstVisibleRightPinnedHeader = isPinnedRight\n    ? header.getIsFirstVisibleRightPinnedHeader()\n    : false;\n  const isFirstVisibleUnpinnedHeader =\n    pinningPosition === false\n      ? header.getIsFirstVisibleUnpinnedHeader()\n      : false;\n  const isLastUnpinnedColumnWithoutSpacer =\n    columnId === table.getCenterVisibleLeafColumns().at(-2)?.id;\n\n  const edgeAdjustedGridPosition: {\n    gridColumnStart: number;\n    gridColumnEnd: number | `span ${number}`;\n    gridRowStart: number;\n    gridRowEnd: number | `span ${number}`;\n  } = {\n    gridColumnStart: gridPosition.gridColumnStart,\n    gridColumnEnd: gridPosition.gridColumnEnd,\n    gridRowStart: isEdgeColumnInGroup ? 1 : gridPosition.gridRowStart,\n    gridRowEnd: isEdgeColumnInGroup\n      ? `span ${headerGroupsLength}`\n      : gridPosition.gridRowEnd,\n  };\n\n  const interactionDtName = getInteractionDtName({\n    columnDragAndDropMode,\n    canSort,\n  });\n  const interactionDtProperties = getInteractionDtProperties(\n    canSort,\n    nextSortingOrder,\n  );\n\n  /**\n   * Only renders the subrow expander in the subrow indicator column\n   * and if no custom header renderer is exposed.\n   */\n  const renderSubRowHeaderExpander = (): JSX.Element | null => {\n    if (\n      !enableExpanding ||\n      !isSubRowIndicatorColumn ||\n      hasCustomHeaderRenderer\n    ) {\n      return null;\n    }\n\n    return (\n      <SubRowsHeaderExpander isAllRowsExpanded={table.getIsAllRowsExpanded()} />\n    );\n  };\n\n  let headerContent = (\n    <div\n      {...dragAndDropProps}\n      key={`Header-${columnId}`}\n      ref={mergedRef}\n      role={role}\n      data-headerid={header?.id}\n      data-header-row={rowIndex}\n      data-column={columnIndex}\n      data-columnid={columnId}\n      data-columntype={columnDef.columnType}\n      data-dt-name={interactionDtName}\n      data-dt-properties={interactionDtProperties}\n      className={clsx(\n        headerCellStyles.headerCell({\n          rowDensity: hasCustomHeaderRenderer\n            ? 'customHeaderRenderer'\n            : rowDensity,\n          pinnedColumn: pinningPosition,\n          verticalDividers: renderVerticalDividers,\n          isDragAndDropDisabled: header.getIsDragAndDropDisabled(),\n        }),\n        alignmentStyles.horizontalAlignment[\n          columnDef.alignment ?? DATA_TABLE_DEFAULT_HORIZONTAL_ALIGNMENT\n        ],\n        alignmentStyles.verticalAlignment[table.getHeaderVerticalAlignment()],\n        {\n          [headerCellStyles.firstColumn]: columnIndex === 0,\n          [headerCellStyles.firstHeaderRow]: rowIndex === 0,\n          [headerCellStyles.lastLeftPinnedColumn]:\n            isLastVisibleLeftPinnedHeader,\n          [headerCellStyles.firstUnpinnedColumn]: isFirstVisibleUnpinnedHeader,\n          [headerCellStyles.firstRightPinnedColumn]:\n            isFirstVisibleRightPinnedHeader,\n          [headerCellStyles.lastHeaderRow]: rowIndex === lastRowIndex,\n          [headerCellStyles.parentHeader]: hasChildren,\n          [headerCellStyles.childHeader]: !!parent,\n          [headerCellStyles.sortableHeader]: canSort,\n          [headerCellStyles.isSortedHeader]: isSorted,\n          [headerCellStyles.isMultiSortedHeader]:\n            multiSortPriority !== undefined,\n          [tableStyles.prefixColumn]:\n            columnDef.meta?.builtinPlacement === 'prefix',\n          [headerCellStyles.headerCellActiveInteraction]:\n            floatingMenuHeaderColumnId === header.id,\n          [headerCellStyles.customHeaderDensity[rowDensity]]:\n            hasCustomHeaderRenderer,\n          [headerCellStyles.subRowIndicatorColumn]: isSubRowIndicatorColumn,\n          // add grab cursor styling only if column drag and drop is enabled but sorting is not\n          [columnOrderStyles.headerDragAndDrop.enabled]:\n            !isDragging &&\n            columnDragAndDropMode !== 'none' &&\n            !header.getCanSortByHeaderClick(),\n          [columnOrderStyles.headerDragAndDrop.inactive]:\n            tableState.draggedHeaderColumn !== undefined,\n        },\n      )}\n      aria-sort={header.getAriaSortAttribute()}\n      aria-description={ariaSortDescription}\n      data-sort-desc-first={columnDef.sortDescFirst ?? false}\n      aria-label={ariaLabel}\n      style={{\n        ...assignInlineVars({\n          [headerCellStyles.leftPositionVar]: leftPinnedPositionPx,\n          [headerCellStyles.rightPositionVar]: rightPinnedPositionPx,\n          [headerCellStyles.leftAdditionalElevationVar]:\n            leftAdditionalElevation,\n        }),\n        ...gridPosition,\n      }}\n      onMouseEnter={handleCellMouseEnter}\n      onMouseLeave={handleCellMouseLeave}\n      onClick={handleCellClick}\n    >\n      {renderSubRowHeaderExpander()}\n\n      {isRightAligned && subRowsWidthCorrection}\n\n      {isStringHeader ? (\n        <HeaderTextEllipsis onTextOverflow={handleTextOverflow}>\n          {children}\n        </HeaderTextEllipsis>\n      ) : (\n        children\n      )}\n\n      {canSort && (\n        <SortingArrowIndicators\n          isSorted={isSorted}\n          nextSortingOrder={nextSortingOrder}\n          multiSortPriority={multiSortPriority}\n          rowDensity={rowDensity}\n        />\n      )}\n\n      {canColumnActions && !isColumnDragActive && (\n        <DataTableHeaderContextProvider value={header}>\n          <InlineUserActionsMenu\n            headerGroupOrRowId={headerGroupId}\n            columnId={columnId}\n            type=\"header\"\n            aria-label={intl.formatMessage(dataTableMessages.columnActionLabel)}\n            data-header-row={rowIndex}\n            data-column={columnIndex}\n            onClose={handleCellActionsClose}\n          />\n        </DataTableHeaderContextProvider>\n      )}\n\n      {!isRightAligned && subRowsWidthCorrection}\n\n      {canResize && !isColumnDragActive && (\n        <button\n          type=\"button\"\n          key={`Header-${columnId}-resize-handler`}\n          aria-label={intl.formatMessage(dataTableMessages.resizeColumnLabel, {\n            column: columnLabel,\n          })}\n          data-header-row={rowIndex}\n          data-column={columnIndex}\n          data-trigger=\"resize\"\n          className={clsx(\n            headerCellStyles.columnSizingHandle({\n              active: isResizing,\n              last: isLastUnpinnedColumnWithoutSpacer,\n              pinnedColumn: pinningPosition,\n            }),\n            {\n              [headerCellStyles.firstRightPinnedColumn]:\n                isFirstVisibleRightPinnedHeader,\n            },\n          )}\n          {...(isEdgeColumnInGroup && {\n            style: {\n              // if this is the last column of a header group, the resize handle should stretch the full header height\n              height: table.getTotalHeaderHeight() - DATA_TABLE_BORDER_WIDTH,\n            },\n          })}\n          onMouseDown={header.handleResize}\n          onTouchStart={header.handleResize}\n          onKeyUp={header.handleKeyboardResize}\n          onDoubleClick={header.handleResizeExpand}\n          data-dt-name=\"ColumnHeaderResize\"\n        />\n      )}\n    </div>\n  );\n\n  // when dragging, the header is portaled out and rendered into the drag overlay\n  if (isDragging) {\n    headerContent = createPortal(\n      headerContent,\n      portalRef.current || document.body,\n    );\n  }\n\n  // for text headers a tooltip should be rendered when the text overflows\n  if (isStringHeader) {\n    headerContent = (\n      <Tooltip disabled={!textOverflowRef.current} text={children}>\n        {headerContent}\n      </Tooltip>\n    );\n  }\n\n  return (\n    <>\n      {headerContent}\n      <DataTablePinningShadowHeaderCells\n        isLeftShadow={isLastVisibleLeftPinnedHeader && !hasChildren}\n        isRightShadow={isFirstVisibleRightPinnedHeader && !hasChildren}\n        leftPosition={leftPinnedPosition}\n        rightPosition={rightPinnedPosition}\n        gridPosition={edgeAdjustedGridPosition}\n      />\n    </>\n  );\n}\n\nDataTableHeaderCell.displayName = 'DataTableHeaderCell';\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { flexRender, type SortDirection } from '@tanstack/react-table';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport clsx from 'clsx';\nimport {\n  type JSX,\n  memo,\n  type PropsWithChildren,\n  useCallback,\n  useRef,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { type IntlShape, useIntl } from 'react-intl';\n\nimport * as alignmentStyles from './Alignment.sty.js';\nimport { DataTablePinningShadowHeaderCells } from './ColumnPinning/DataTablePinningShadowHeaderCells.js';\nimport * as headerCellStyles from './DataTableHeaderCell.sty.js';\nimport { useMergeRefs } from '../../../core/hooks/useMergeRefs.js';\nimport { Tooltip } from '../../../overlays/tooltip/Tooltip.js';\nimport { TextEllipsis } from '../../../typography/text-ellipsis/TextEllipsis.js';\nimport { getDataTableBorderWidth } from '../../utils/data-table-border-width.js';\nimport { getColumnLabel } from '../../utils/get-column-label.js';\nimport {\n  DATA_TABLE_DEFAULT_HORIZONTAL_ALIGNMENT,\n  DATA_TABLE_SPACER_COLUMN_ID,\n} from '../constants.js';\nimport {\n  DataTableColumnContextProvider,\n  DataTableHeaderContextProvider,\n  useDataTable,\n} from '../contexts/DataTableContext.js';\nimport * as tableStyles from '../DataTable.sty.js';\nimport * as columnOrderStyles from '../features/ColumnOrder/ColumnOrder.sty.js';\nimport { SortingArrowIndicators } from '../features/Sorting/SortingArrowIndicators.js';\nimport { SubRowsHeaderExpander } from '../features/SubRows/SubRowExpanders.js';\nimport { SubRowsHeaderWidthCorrection } from '../features/SubRows/SubRows.js';\nimport { InlineUserActionsMenu } from '../features/UserActions/InlineUserActionsMenu.js';\nimport { useHeaderCellInteractions } from '../hooks/useHeaderCellInteractions.js';\nimport { useHeaderCellDragAndDrop } from '../hooks/useHeaderDragAndDrop.js';\nimport type { Header } from '../hooks/useTable/types.js';\nimport { dataTableMessages } from '../messages.js';\n\ninterface DataTableHeaderCellProps extends PropsWithChildren {\n  /**\n   * Header to be rendered with this header cell.\n   */\n  header: Header<unknown, unknown>;\n\n  /**\n   * All headers in the same group (row).\n   */\n  headers: Header<unknown, unknown>[];\n\n  /**\n   * Header group id from the TanStack/table header object.\n   */\n  headerGroupId: string;\n\n  /**\n   * RowIndex based on the virtualization index.\n   */\n  rowIndex: number;\n\n  /**\n   * ColumnIndex based on the virtualization index.\n   */\n  columnIndex: number;\n\n  /**\n   * The index of the last header row.\n   */\n  lastRowIndex: number;\n}\n\n/**\n * Memoized wrapper for TextEllipsis in header cells to avoid unnecessary re-calculations.\n */\nconst HeaderTextEllipsis = memo(\n  ({\n    children,\n    onTextOverflow,\n  }: {\n    children: string;\n    onTextOverflow: (ellipsized: boolean) => void;\n  }) => {\n    return (\n      <TextEllipsis\n        onTextOverflow={onTextOverflow}\n        className={headerCellStyles.headerCellEllipsis}\n      >\n        {children}\n      </TextEllipsis>\n    );\n  },\n);\n\n/**\n * Hook that gets the aria-label for the header according to the different table configurations.\n *\n * @param param0 - object containing everything to create the labels\n * according to the current table configuration.\n * @returns the aria label for the header cell.\n * @internal\n */\nexport function getHeaderAriaLabel({\n  intl,\n  columnLabel,\n  nextSortingOrder,\n  canSort,\n  columnDragAndDropMode,\n  isCustomHeader,\n  role,\n}: {\n  intl: IntlShape;\n  columnLabel: string;\n  nextSortingOrder: false | SortDirection | undefined;\n  canSort?: boolean;\n  columnDragAndDropMode: 'none' | 'enabled' | 'only';\n  isCustomHeader: boolean;\n  role: 'columnheader' | 'presentation';\n}): string | undefined {\n  // Don't set an aria-label on elements with role=\"presentation\"\n  if (role === 'presentation') {\n    return undefined;\n  }\n\n  if (canSort && columnDragAndDropMode === 'none') {\n    return intl.formatMessage(dataTableMessages.sortingLabel, {\n      column: columnLabel,\n      direction: nextSortingOrder,\n    });\n  }\n  if (canSort && columnDragAndDropMode === 'enabled') {\n    return intl.formatMessage(dataTableMessages.sortingDragAndDropLabel, {\n      column: columnLabel,\n      direction: nextSortingOrder,\n    });\n  }\n  if (columnDragAndDropMode !== 'none') {\n    return intl.formatMessage(dataTableMessages.dragAndDropLabel, {\n      column: columnLabel,\n    });\n  }\n  return isCustomHeader ? columnLabel : undefined;\n}\n\n/**\n * Gets the aria-description for the header according to the different sorting states.\n *\n * @returns the aria description for the header cell, or undefined if no description should be set.\n * @internal\n */\nfunction getHeaderAriaSortDescription({\n  intl,\n  role,\n  isSorted,\n  multiSortPriority,\n  sortedColumnsCount,\n}: {\n  intl: IntlShape;\n  role: 'columnheader' | 'presentation';\n  isSorted: false | SortDirection;\n  multiSortPriority: number | undefined;\n  sortedColumnsCount: number;\n}): string | undefined {\n  if (role === 'presentation' || !isSorted) {\n    return undefined;\n  }\n\n  if (multiSortPriority !== undefined) {\n    return intl.formatMessage(dataTableMessages.sortingStateWithPriorityLabel, {\n      direction: isSorted,\n      priority: multiSortPriority,\n      total: sortedColumnsCount,\n    });\n  }\n\n  return intl.formatMessage(dataTableMessages.sortingStateLabel, {\n    direction: isSorted,\n  });\n}\n\n/**\n * Returns the `data-dt-name` value for a header cell based on which interactions are enabled.\n *\n * @param param0 - object containing the necessary information to determine the correct `data-dt-name` value.\n * @returns the `data-dt-name` value for the header cell, or undefined if no interaction is enabled.\n * @internal\n */\nfunction getInteractionDtName({\n  columnDragAndDropMode,\n  canSort,\n}: {\n  columnDragAndDropMode: 'none' | 'enabled' | 'only';\n  canSort: boolean;\n}): string | undefined {\n  // only ordering is enabled, but not sorting\n  if (\n    columnDragAndDropMode === 'only' ||\n    (columnDragAndDropMode === 'enabled' && !canSort)\n  ) {\n    return 'ColumnHeaderOrder';\n  }\n  // sorting and ordering are enabled together\n  if (canSort && columnDragAndDropMode === 'enabled') {\n    return 'ColumnHeaderOrderAndSort';\n  }\n  // only sorting is enabled, but not ordering\n  return 'ColumnHeaderSort';\n}\n\n/**\n * Returns the `data-dt-properties` value for a header cell, reflecting the next sorting action\n * that will be performed when the user clicks the header.\n *\n * @param nextSortingOrder - the next sorting order.\n * @returns the `data-dt-properties` value, or undefined if sorting is not applicable.\n * @internal\n */\nfunction getInteractionDtProperties(\n  canSort: boolean,\n  nextSortingOrder: false | SortDirection | undefined,\n): string | undefined {\n  if (!canSort || nextSortingOrder === undefined) {\n    return undefined;\n  }\n\n  switch (nextSortingOrder) {\n    case 'asc':\n      return 'state:ascending';\n    case 'desc':\n      return 'state:descending';\n    case false:\n      return 'state:clearSort';\n  }\n}\n\n/**\n * Returns the additional z-index elevation for a left-pinned column so that its\n * resize handle renders above the next pinned column to the right.\n * Returns 0 for non-left-pinned columns and parent headers without resize handles.\n * @internal\n */\nfunction getLeftAdditionalElevation(\n  isPinnedLeft: boolean,\n  canResize: boolean,\n  columnId: string,\n  leftPinnedColumns: { id: string }[],\n): string {\n  if (!isPinnedLeft || !canResize) {\n    return '0';\n  }\n  const idx = leftPinnedColumns.findIndex((c) => c.id === columnId);\n  return `${leftPinnedColumns.length - 1 - idx}`;\n}\n\nexport function DataTableHeaderCell(\n  props: Readonly<DataTableHeaderCellProps>,\n): JSX.Element | null {\n  const {\n    header,\n    headers,\n    headerGroupId,\n    rowIndex,\n    columnIndex: virtualColumnIndex,\n    lastRowIndex,\n  } = props;\n\n  const intl = useIntl();\n  const table = useDataTable();\n  const { rowDensity, verticalDividers } = table.getVisualVariantOptions();\n  const columnDragAndDropMode = header.getColumnDragAndDropMode();\n\n  const gridPosition = header.getGridPosition(headers);\n  const column = header.column;\n  const { id: columnId, parent, columns: childColumns, columnDef } = column;\n  const columnIndex =\n    rowIndex === 0 ? gridPosition.gridColumnStart - 1 : virtualColumnIndex;\n\n  const canSort = column.getCanSort();\n  const canColumnActions = column.getCanColumnActions();\n\n  const textOverflowRef = useRef(false);\n  const handleTextOverflow = useCallback((ellipsized: boolean) => {\n    textOverflowRef.current = ellipsized;\n  }, []);\n\n  const { setNodeRef, isDragging, portalRef, dragAndDropProps } =\n    useHeaderCellDragAndDrop({\n      headerId: header.id,\n      column,\n      columnIndex,\n      columnDragAndDropMode,\n    });\n  const divRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs<HTMLElement | null>([setNodeRef, divRef]);\n\n  const {\n    handleCellMouseEnter,\n    handleCellMouseLeave,\n    handleCellActionsClose,\n    handleCellClick,\n  } = useHeaderCellInteractions({\n    headerCell: divRef.current,\n    canSort,\n    canColumnActions,\n    rowDensity,\n    getToggleSortingHandler: column.getToggleSortingHandler,\n  });\n\n  // Early exit if the header is a placeholder to not render any content.\n  if (header.isPlaceholder) {\n    return null;\n  }\n  const headerGroupsLength = table.getHeaderGroups().length;\n  const tableState = table.getState();\n  // Only count columns that are actually sortable to avoid gaps in priority numbers\n  // when a column is in the sorting state but has sorting disabled.\n  const activeSortEntries =\n    tableState.sorting?.filter((sort) => {\n      const col = table.getColumn(sort.id);\n      return col?.getCanSort() ?? false;\n    }) ?? [];\n  const sortedColumnsCount = activeSortEntries.length;\n\n  const enableExpanding = table.options.enableExpanding;\n  const canResize = column.getCanResize();\n  const isResizing = column.getIsResizing();\n  const isSorted = column.getIsSorted();\n  const columnSortIndex = activeSortEntries.findIndex(\n    (sort) => sort.id === column.id,\n  );\n  const multiSortPriority =\n    sortedColumnsCount > 1 && columnSortIndex >= 0\n      ? columnSortIndex + 1\n      : undefined;\n  const isColumnDragActive = tableState.draggedHeaderColumn !== undefined;\n\n  const isRightAligned = columnDef.alignment === 'right';\n  // even if vertical dividers are not set, they should be rendered for nested headers and when resizing is enabled\n  const renderVerticalDividers =\n    verticalDividers ||\n    table.getHeaderGroups().length > 1 ||\n    (table.options.enableColumnResizing &&\n      (canResize ||\n        // when resizing is enabled we need to render the vertical dividers for the spacer column as well\n        column.id === DATA_TABLE_SPACER_COLUMN_ID));\n\n  const floatingMenuHeaderColumnId =\n    (tableState.floatingMenuInfo?.rowId === null &&\n      tableState.floatingMenuInfo?.headerId) ||\n    undefined;\n\n  const hasCustomHeaderRenderer = columnDef.meta?.hasCustomHeaderRenderer;\n  const children = hasCustomHeaderRenderer ? (\n    <DataTableColumnContextProvider value={header.column}>\n      {flexRender(columnDef.header, header.getContext())}\n    </DataTableColumnContextProvider>\n  ) : (\n    flexRender(columnDef.header, header.getContext())\n  );\n  const isStringHeader = typeof children === 'string';\n\n  const role =\n    columnDef.meta?.spacer === true ? 'presentation' : 'columnheader';\n  const columnLabel = getColumnLabel(column);\n  const nextSortingOrder = column.getNextSortingOrder();\n  const ariaLabel = getHeaderAriaLabel({\n    intl,\n    columnLabel,\n    nextSortingOrder,\n    canSort,\n    columnDragAndDropMode,\n    isCustomHeader: !isStringHeader,\n    role,\n  });\n  const ariaSortDescription = getHeaderAriaSortDescription({\n    intl,\n    role,\n    isSorted,\n    multiSortPriority,\n    sortedColumnsCount,\n  });\n\n  // subrows\n  const isSubRowIndicatorColumn =\n    enableExpanding === true &&\n    table.getSubRowIndicatorColumnId() === column.id;\n  const subRowsWidthCorrection =\n    // only render the subrow width correction in the subrow indicator column\n    enableExpanding === true && isSubRowIndicatorColumn ? (\n      <SubRowsHeaderWidthCorrection\n        subRowOpenDepth={table.getSubRowOpenDepth()}\n      />\n    ) : null;\n\n  // column pinning\n  const pinningPosition = header.getIsPinned();\n  const isPinnedLeft = pinningPosition === 'left';\n  const isPinnedRight = pinningPosition === 'right';\n  const leftPinnedPosition = isPinnedLeft\n    ? header.getLeftPinnedPosition()\n    : undefined;\n  const leftPinnedPositionPx =\n    leftPinnedPosition === undefined ? undefined : `${leftPinnedPosition}px`;\n\n  // Calculate additional z-index elevation for left-pinned columns so that the resize handle\n  // of each column is rendered above the following pinned column to the right.\n  const leftAdditionalElevation = getLeftAdditionalElevation(\n    isPinnedLeft,\n    canResize,\n    columnId,\n    table.getLeftVisibleLeafColumns(),\n  );\n\n  const rightPinnedPosition = isPinnedRight\n    ? header.getRightPinnedPosition()\n    : undefined;\n  const rightPinnedPositionPx =\n    rightPinnedPosition === undefined ? undefined : `${rightPinnedPosition}px`;\n\n  const hasChildren = childColumns.length > 0;\n  const isEdgeColumnInGroup =\n    parent?.getCenterVisibleLeafColumns().at(-1) === column ||\n    parent?.getLeftVisibleLeafColumns().at(-1) === column ||\n    parent?.getRightVisibleLeafColumns().at(0) === column;\n\n  const isLastVisibleLeftPinnedHeader = isPinnedLeft\n    ? header.getIsLastVisibleLeftPinnedHeader()\n    : false;\n  const isFirstVisibleRightPinnedHeader = isPinnedRight\n    ? header.getIsFirstVisibleRightPinnedHeader()\n    : false;\n  const isFirstVisibleUnpinnedHeader =\n    pinningPosition === false\n      ? header.getIsFirstVisibleUnpinnedHeader()\n      : false;\n  const isLastUnpinnedColumnWithoutSpacer =\n    columnId === table.getCenterVisibleLeafColumns().at(-2)?.id;\n\n  const edgeAdjustedGridPosition: {\n    gridColumnStart: number;\n    gridColumnEnd: number | `span ${number}`;\n    gridRowStart: number;\n    gridRowEnd: number | `span ${number}`;\n  } = {\n    gridColumnStart: gridPosition.gridColumnStart,\n    gridColumnEnd: gridPosition.gridColumnEnd,\n    gridRowStart: isEdgeColumnInGroup ? 1 : gridPosition.gridRowStart,\n    gridRowEnd: isEdgeColumnInGroup\n      ? `span ${headerGroupsLength}`\n      : gridPosition.gridRowEnd,\n  };\n\n  const interactionDtName = getInteractionDtName({\n    columnDragAndDropMode,\n    canSort,\n  });\n  const interactionDtProperties = getInteractionDtProperties(\n    canSort,\n    nextSortingOrder,\n  );\n\n  /**\n   * Only renders the subrow expander in the subrow indicator column\n   * and if no custom header renderer is exposed.\n   */\n  const renderSubRowHeaderExpander = (): JSX.Element | null => {\n    if (\n      !enableExpanding ||\n      !isSubRowIndicatorColumn ||\n      hasCustomHeaderRenderer\n    ) {\n      return null;\n    }\n\n    return (\n      <SubRowsHeaderExpander isAllRowsExpanded={table.getIsAllRowsExpanded()} />\n    );\n  };\n\n  let headerContent = (\n    <div\n      {...dragAndDropProps}\n      key={`Header-${columnId}`}\n      ref={mergedRef}\n      role={role}\n      data-headerid={header?.id}\n      data-header-row={rowIndex}\n      data-column={columnIndex}\n      data-columnid={columnId}\n      data-columntype={columnDef.columnType}\n      data-dt-name={interactionDtName}\n      data-dt-properties={interactionDtProperties}\n      className={clsx(\n        headerCellStyles.headerCell({\n          rowDensity: hasCustomHeaderRenderer\n            ? 'customHeaderRenderer'\n            : rowDensity,\n          pinnedColumn: pinningPosition,\n          verticalDividers: renderVerticalDividers,\n          isDragAndDropDisabled: header.getIsDragAndDropDisabled(),\n        }),\n        alignmentStyles.horizontalAlignment[\n          columnDef.alignment ?? DATA_TABLE_DEFAULT_HORIZONTAL_ALIGNMENT\n        ],\n        alignmentStyles.verticalAlignment[table.getHeaderVerticalAlignment()],\n        {\n          [headerCellStyles.firstColumn]: columnIndex === 0,\n          [headerCellStyles.firstHeaderRow]: rowIndex === 0,\n          [headerCellStyles.lastLeftPinnedColumn]:\n            isLastVisibleLeftPinnedHeader,\n          [headerCellStyles.firstUnpinnedColumn]: isFirstVisibleUnpinnedHeader,\n          [headerCellStyles.firstRightPinnedColumn]:\n            isFirstVisibleRightPinnedHeader,\n          [headerCellStyles.lastHeaderRow]: rowIndex === lastRowIndex,\n          [headerCellStyles.parentHeader]: hasChildren,\n          [headerCellStyles.childHeader]: !!parent,\n          [headerCellStyles.sortableHeader]: canSort,\n          [headerCellStyles.isSortedHeader]: isSorted,\n          [headerCellStyles.isMultiSortedHeader]:\n            multiSortPriority !== undefined,\n          [tableStyles.prefixColumn]:\n            columnDef.meta?.builtinPlacement === 'prefix',\n          [headerCellStyles.headerCellActiveInteraction]:\n            floatingMenuHeaderColumnId === header.id,\n          [headerCellStyles.customHeaderDensity[rowDensity]]:\n            hasCustomHeaderRenderer,\n          [headerCellStyles.subRowIndicatorColumn]: isSubRowIndicatorColumn,\n          // add grab cursor styling only if column drag and drop is enabled but sorting is not\n          [columnOrderStyles.headerDragAndDrop.enabled]:\n            !isDragging &&\n            columnDragAndDropMode !== 'none' &&\n            !header.getCanSortByHeaderClick(),\n          [columnOrderStyles.headerDragAndDrop.inactive]:\n            tableState.draggedHeaderColumn !== undefined,\n        },\n      )}\n      aria-sort={header.getAriaSortAttribute()}\n      aria-description={ariaSortDescription}\n      data-sort-desc-first={columnDef.sortDescFirst ?? false}\n      aria-label={ariaLabel}\n      style={{\n        ...assignInlineVars({\n          [headerCellStyles.leftPositionVar]: leftPinnedPositionPx,\n          [headerCellStyles.rightPositionVar]: rightPinnedPositionPx,\n          [headerCellStyles.leftAdditionalElevationVar]:\n            leftAdditionalElevation,\n        }),\n        ...gridPosition,\n      }}\n      onMouseEnter={handleCellMouseEnter}\n      onMouseLeave={handleCellMouseLeave}\n      onClick={handleCellClick}\n    >\n      {renderSubRowHeaderExpander()}\n\n      {isRightAligned && subRowsWidthCorrection}\n\n      {isStringHeader ? (\n        <HeaderTextEllipsis onTextOverflow={handleTextOverflow}>\n          {children}\n        </HeaderTextEllipsis>\n      ) : (\n        children\n      )}\n\n      {canSort && (\n        <SortingArrowIndicators\n          isSorted={isSorted}\n          nextSortingOrder={nextSortingOrder}\n          multiSortPriority={multiSortPriority}\n          rowDensity={rowDensity}\n        />\n      )}\n\n      {canColumnActions && !isColumnDragActive && (\n        <DataTableHeaderContextProvider value={header}>\n          <InlineUserActionsMenu\n            headerGroupOrRowId={headerGroupId}\n            columnId={columnId}\n            type=\"header\"\n            aria-label={intl.formatMessage(dataTableMessages.columnActionLabel)}\n            data-header-row={rowIndex}\n            data-column={columnIndex}\n            onClose={handleCellActionsClose}\n          />\n        </DataTableHeaderContextProvider>\n      )}\n\n      {!isRightAligned && subRowsWidthCorrection}\n\n      {canResize && !isColumnDragActive && (\n        <button\n          type=\"button\"\n          key={`Header-${columnId}-resize-handler`}\n          aria-label={intl.formatMessage(dataTableMessages.resizeColumnLabel, {\n            column: columnLabel,\n          })}\n          data-header-row={rowIndex}\n          data-column={columnIndex}\n          data-trigger=\"resize\"\n          className={clsx(\n            headerCellStyles.columnSizingHandle({\n              active: isResizing,\n              last: isLastUnpinnedColumnWithoutSpacer,\n              pinnedColumn: pinningPosition,\n            }),\n            {\n              [headerCellStyles.firstRightPinnedColumn]:\n                isFirstVisibleRightPinnedHeader,\n            },\n          )}\n          {...(isEdgeColumnInGroup && {\n            style: {\n              // if this is the last column of a header group, the resize handle should stretch the full header height\n              height: table.getTotalHeaderHeight() - getDataTableBorderWidth(),\n            },\n          })}\n          onMouseDown={header.handleResize}\n          onTouchStart={header.handleResize}\n          onKeyUp={header.handleKeyboardResize}\n          onDoubleClick={header.handleResizeExpand}\n          data-dt-name=\"ColumnHeaderResize\"\n        />\n      )}\n    </div>\n  );\n\n  // when dragging, the header is portaled out and rendered into the drag overlay\n  if (isDragging) {\n    headerContent = createPortal(\n      headerContent,\n      portalRef.current || document.body,\n    );\n  }\n\n  // for text headers a tooltip should be rendered when the text overflows\n  if (isStringHeader) {\n    headerContent = (\n      <Tooltip disabled={!textOverflowRef.current} text={children}>\n        {headerContent}\n      </Tooltip>\n    );\n  }\n\n  return (\n    <>\n      {headerContent}\n      <DataTablePinningShadowHeaderCells\n        isLeftShadow={isLastVisibleLeftPinnedHeader && !hasChildren}\n        isRightShadow={isFirstVisibleRightPinnedHeader && !hasChildren}\n        leftPosition={leftPinnedPosition}\n        rightPosition={rightPinnedPosition}\n        gridPosition={edgeAdjustedGridPosition}\n      />\n    </>\n  );\n}\n\nDataTableHeaderCell.displayName = 'DataTableHeaderCell';\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/tables/DataTable/components/DataTableHeaderCell.sty.js

@@ -1,32 +1,33 @@
+import "../../../core/components/app-root/AppRoot.css";
 import "../DataTable.css";
 import "./Alignment.css";
 import "../features/ColumnOrder/ColumnOrder.css";
 import "../features/Thresholds/Thresholds.css";
 import "./DataTableHeaderCell.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var childHeader = "_11pvd3z3-3-4-0";
-var columnSizingHandle = _7a468({ defaultClassName: "_11pvd3zl-3-4-0", variantClassNames: { active: { true: "_11pvd3zm-3-4-0", false: "_11pvd3zn-3-4-0" }, last: { true: "_11pvd3zo-3-4-0", false: "_11pvd3zp-3-4-0" }, pinnedColumn: { false: "_11pvd3zq-3-4-0", left: "_11pvd3zr-3-4-0", right: "_11pvd3zs-3-4-0" } }, defaultVariants: {}, compoundVariants: [] });
-var customHeaderDensity = { "default": "_11pvd3za-3-4-0", condensed: "_11pvd3zb-3-4-0", comfortable: "_11pvd3zc-3-4-0" };
-var firstColumn = "_11pvd3zd-3-4-0";
-var firstHeaderRow = "_11pvd3z0-3-4-0";
-var firstRightPinnedColumn = "_11pvd3zg-3-4-0";
-var firstUnpinnedColumn = "_11pvd3zf-3-4-0";
-var headerCell = _7a468({ defaultClassName: "_11pvd3zt-3-4-0", variantClassNames: { pinnedColumn: { false: "_11pvd3zu-3-4-0", left: "_11pvd3zv-3-4-0", right: "_11pvd3zw-3-4-0" }, rowDensity: { customHeaderRenderer: "_11pvd3zx-3-4-0", "default": "_11pvd3zy-3-4-0", condensed: "_11pvd3zz-3-4-0", comfortable: "_11pvd3z10-3-4-0" }, verticalDividers: { true: "_11pvd3z11-3-4-0", false: "_11pvd3z12-3-4-0" }, isDragAndDropDisabled: { true: "_11pvd3z13-3-4-0", false: "_11pvd3z14-3-4-0" } }, defaultVariants: { rowDensity: "default", verticalDividers: false }, compoundVariants: [] });
-var headerCellActiveInteraction = "_11pvd3z16-3-4-0";
-var headerCellEllipsis = "_11pvd3z15-3-4-0";
-var headerWidthVar = "var(--_11pvd3zj-3-4-0)";
-var hovered = "_11pvd3z4-3-4-0";
-var isMultiSortedHeader = "_11pvd3z8-3-4-0";
-var isSortedHeader = "_11pvd3z7-3-4-0";
-var lastHeaderRow = "_11pvd3z1-3-4-0";
-var lastLeftPinnedColumn = "_11pvd3ze-3-4-0";
-var leftAdditionalElevationVar = "var(--_11pvd3zk-3-4-0)";
-var leftPositionVar = "var(--_11pvd3zh-3-4-0)";
-var narrow = "_11pvd3z5-3-4-0";
-var parentHeader = "_11pvd3z2-3-4-0";
-var rightPositionVar = "var(--_11pvd3zi-3-4-0)";
-var sortableHeader = "_11pvd3z6-3-4-0";
-var subRowIndicatorColumn = "_11pvd3z9-3-4-0";
+var childHeader = "_11pvd3z3-3-5-0";
+var columnSizingHandle = _7a468({ defaultClassName: "_11pvd3zl-3-5-0", variantClassNames: { active: { true: "_11pvd3zm-3-5-0", false: "_11pvd3zn-3-5-0" }, last: { true: "_11pvd3zo-3-5-0", false: "_11pvd3zp-3-5-0" }, pinnedColumn: { false: "_11pvd3zq-3-5-0", left: "_11pvd3zr-3-5-0", right: "_11pvd3zs-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });
+var customHeaderDensity = { "default": "_11pvd3za-3-5-0", condensed: "_11pvd3zb-3-5-0", comfortable: "_11pvd3zc-3-5-0" };
+var firstColumn = "_11pvd3zd-3-5-0";
+var firstHeaderRow = "_11pvd3z0-3-5-0";
+var firstRightPinnedColumn = "_11pvd3zg-3-5-0";
+var firstUnpinnedColumn = "_11pvd3zf-3-5-0";
+var headerCell = _7a468({ defaultClassName: "_11pvd3zt-3-5-0", variantClassNames: { pinnedColumn: { false: "_11pvd3zu-3-5-0", left: "_11pvd3zv-3-5-0", right: "_11pvd3zw-3-5-0" }, rowDensity: { customHeaderRenderer: "_11pvd3zx-3-5-0", "default": "_11pvd3zy-3-5-0", condensed: "_11pvd3zz-3-5-0", comfortable: "_11pvd3z10-3-5-0" }, verticalDividers: { true: "_11pvd3z11-3-5-0", false: "_11pvd3z12-3-5-0" }, isDragAndDropDisabled: { true: "_11pvd3z13-3-5-0", false: "_11pvd3z14-3-5-0" } }, defaultVariants: { rowDensity: "default", verticalDividers: false }, compoundVariants: [] });
+var headerCellActiveInteraction = "_11pvd3z16-3-5-0";
+var headerCellEllipsis = "_11pvd3z15-3-5-0";
+var headerWidthVar = "var(--_11pvd3zj-3-5-0)";
+var hovered = "_11pvd3z4-3-5-0";
+var isMultiSortedHeader = "_11pvd3z8-3-5-0";
+var isSortedHeader = "_11pvd3z7-3-5-0";
+var lastHeaderRow = "_11pvd3z1-3-5-0";
+var lastLeftPinnedColumn = "_11pvd3ze-3-5-0";
+var leftAdditionalElevationVar = "var(--_11pvd3zk-3-5-0)";
+var leftPositionVar = "var(--_11pvd3zh-3-5-0)";
+var narrow = "_11pvd3z5-3-5-0";
+var parentHeader = "_11pvd3z2-3-5-0";
+var rightPositionVar = "var(--_11pvd3zi-3-5-0)";
+var sortableHeader = "_11pvd3z6-3-5-0";
+var subRowIndicatorColumn = "_11pvd3z9-3-5-0";
 export {
   childHeader,
   columnSizingHandle,

package/esm/tables/DataTable/components/DataTableHeaderCell.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/tables/DataTable/components/DataTableHeaderCell.css.ts"],
-  "sourcesContent": ["import '../DataTable.css';\nimport './Alignment.css';\nimport '../features/ColumnOrder/ColumnOrder.css';\nimport '../features/Thresholds/Thresholds.css';\nimport './DataTableHeaderCell.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var childHeader = '_11pvd3z3-3-4-0';\nexport var columnSizingHandle = _7a468({defaultClassName:'_11pvd3zl-3-4-0',variantClassNames:{active:{true:'_11pvd3zm-3-4-0',false:'_11pvd3zn-3-4-0'},last:{true:'_11pvd3zo-3-4-0',false:'_11pvd3zp-3-4-0'},pinnedColumn:{false:'_11pvd3zq-3-4-0',left:'_11pvd3zr-3-4-0',right:'_11pvd3zs-3-4-0'}},defaultVariants:{},compoundVariants:[]});\nexport var customHeaderDensity = {'default':'_11pvd3za-3-4-0',condensed:'_11pvd3zb-3-4-0',comfortable:'_11pvd3zc-3-4-0'};\nexport var firstColumn = '_11pvd3zd-3-4-0';\nexport var firstHeaderRow = '_11pvd3z0-3-4-0';\nexport var firstRightPinnedColumn = '_11pvd3zg-3-4-0';\nexport var firstUnpinnedColumn = '_11pvd3zf-3-4-0';\nexport var headerCell = _7a468({defaultClassName:'_11pvd3zt-3-4-0',variantClassNames:{pinnedColumn:{false:'_11pvd3zu-3-4-0',left:'_11pvd3zv-3-4-0',right:'_11pvd3zw-3-4-0'},rowDensity:{customHeaderRenderer:'_11pvd3zx-3-4-0','default':'_11pvd3zy-3-4-0',condensed:'_11pvd3zz-3-4-0',comfortable:'_11pvd3z10-3-4-0'},verticalDividers:{true:'_11pvd3z11-3-4-0',false:'_11pvd3z12-3-4-0'},isDragAndDropDisabled:{true:'_11pvd3z13-3-4-0',false:'_11pvd3z14-3-4-0'}},defaultVariants:{rowDensity:'default',verticalDividers:false},compoundVariants:[]});\nexport var headerCellActiveInteraction = '_11pvd3z16-3-4-0';\nexport var headerCellEllipsis = '_11pvd3z15-3-4-0';\nexport var headerWidthVar = 'var(--_11pvd3zj-3-4-0)';\nexport var hovered = '_11pvd3z4-3-4-0';\nexport var isMultiSortedHeader = '_11pvd3z8-3-4-0';\nexport var isSortedHeader = '_11pvd3z7-3-4-0';\nexport var lastHeaderRow = '_11pvd3z1-3-4-0';\nexport var lastLeftPinnedColumn = '_11pvd3ze-3-4-0';\nexport var leftAdditionalElevationVar = 'var(--_11pvd3zk-3-4-0)';\nexport var leftPositionVar = 'var(--_11pvd3zh-3-4-0)';\nexport var narrow = '_11pvd3z5-3-4-0';\nexport var parentHeader = '_11pvd3z2-3-4-0';\nexport var rightPositionVar = 'var(--_11pvd3zi-3-4-0)';\nexport var sortableHeader = '_11pvd3z6-3-4-0';\nexport var subRowIndicatorColumn = '_11pvd3z9-3-4-0';"],
-  "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,cAAc;AAClB,IAAI,qBAAqB,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,QAAO,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,GAAE,MAAK,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,GAAE,cAAa,EAAC,OAAM,mBAAkB,MAAK,mBAAkB,OAAM,kBAAiB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACnU,IAAI,sBAAsB,EAAC,WAAU,mBAAkB,WAAU,mBAAkB,aAAY,kBAAiB;AAChH,IAAI,cAAc;AAClB,IAAI,iBAAiB;AACrB,IAAI,yBAAyB;AAC7B,IAAI,sBAAsB;AAC1B,IAAI,aAAa,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,cAAa,EAAC,OAAM,mBAAkB,MAAK,mBAAkB,OAAM,kBAAiB,GAAE,YAAW,EAAC,sBAAqB,mBAAkB,WAAU,mBAAkB,WAAU,mBAAkB,aAAY,mBAAkB,GAAE,kBAAiB,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,uBAAsB,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,YAAW,WAAU,kBAAiB,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAChhB,IAAI,8BAA8B;AAClC,IAAI,qBAAqB;AACzB,IAAI,iBAAiB;AACrB,IAAI,UAAU;AACd,IAAI,sBAAsB;AAC1B,IAAI,iBAAiB;AACrB,IAAI,gBAAgB;AACpB,IAAI,uBAAuB;AAC3B,IAAI,6BAA6B;AACjC,IAAI,kBAAkB;AACtB,IAAI,SAAS;AACb,IAAI,eAAe;AACnB,IAAI,mBAAmB;AACvB,IAAI,iBAAiB;AACrB,IAAI,wBAAwB;",
+  "sourcesContent": ["import '../../../core/components/app-root/AppRoot.css';\nimport '../DataTable.css';\nimport './Alignment.css';\nimport '../features/ColumnOrder/ColumnOrder.css';\nimport '../features/Thresholds/Thresholds.css';\nimport './DataTableHeaderCell.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var childHeader = '_11pvd3z3-3-5-0';\nexport var columnSizingHandle = _7a468({defaultClassName:'_11pvd3zl-3-5-0',variantClassNames:{active:{true:'_11pvd3zm-3-5-0',false:'_11pvd3zn-3-5-0'},last:{true:'_11pvd3zo-3-5-0',false:'_11pvd3zp-3-5-0'},pinnedColumn:{false:'_11pvd3zq-3-5-0',left:'_11pvd3zr-3-5-0',right:'_11pvd3zs-3-5-0'}},defaultVariants:{},compoundVariants:[]});\nexport var customHeaderDensity = {'default':'_11pvd3za-3-5-0',condensed:'_11pvd3zb-3-5-0',comfortable:'_11pvd3zc-3-5-0'};\nexport var firstColumn = '_11pvd3zd-3-5-0';\nexport var firstHeaderRow = '_11pvd3z0-3-5-0';\nexport var firstRightPinnedColumn = '_11pvd3zg-3-5-0';\nexport var firstUnpinnedColumn = '_11pvd3zf-3-5-0';\nexport var headerCell = _7a468({defaultClassName:'_11pvd3zt-3-5-0',variantClassNames:{pinnedColumn:{false:'_11pvd3zu-3-5-0',left:'_11pvd3zv-3-5-0',right:'_11pvd3zw-3-5-0'},rowDensity:{customHeaderRenderer:'_11pvd3zx-3-5-0','default':'_11pvd3zy-3-5-0',condensed:'_11pvd3zz-3-5-0',comfortable:'_11pvd3z10-3-5-0'},verticalDividers:{true:'_11pvd3z11-3-5-0',false:'_11pvd3z12-3-5-0'},isDragAndDropDisabled:{true:'_11pvd3z13-3-5-0',false:'_11pvd3z14-3-5-0'}},defaultVariants:{rowDensity:'default',verticalDividers:false},compoundVariants:[]});\nexport var headerCellActiveInteraction = '_11pvd3z16-3-5-0';\nexport var headerCellEllipsis = '_11pvd3z15-3-5-0';\nexport var headerWidthVar = 'var(--_11pvd3zj-3-5-0)';\nexport var hovered = '_11pvd3z4-3-5-0';\nexport var isMultiSortedHeader = '_11pvd3z8-3-5-0';\nexport var isSortedHeader = '_11pvd3z7-3-5-0';\nexport var lastHeaderRow = '_11pvd3z1-3-5-0';\nexport var lastLeftPinnedColumn = '_11pvd3ze-3-5-0';\nexport var leftAdditionalElevationVar = 'var(--_11pvd3zk-3-5-0)';\nexport var leftPositionVar = 'var(--_11pvd3zh-3-5-0)';\nexport var narrow = '_11pvd3z5-3-5-0';\nexport var parentHeader = '_11pvd3z2-3-5-0';\nexport var rightPositionVar = 'var(--_11pvd3zi-3-5-0)';\nexport var sortableHeader = '_11pvd3z6-3-5-0';\nexport var subRowIndicatorColumn = '_11pvd3z9-3-5-0';"],
+  "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,cAAc;AAClB,IAAI,qBAAqB,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,QAAO,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,GAAE,MAAK,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,GAAE,cAAa,EAAC,OAAM,mBAAkB,MAAK,mBAAkB,OAAM,kBAAiB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACnU,IAAI,sBAAsB,EAAC,WAAU,mBAAkB,WAAU,mBAAkB,aAAY,kBAAiB;AAChH,IAAI,cAAc;AAClB,IAAI,iBAAiB;AACrB,IAAI,yBAAyB;AAC7B,IAAI,sBAAsB;AAC1B,IAAI,aAAa,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,cAAa,EAAC,OAAM,mBAAkB,MAAK,mBAAkB,OAAM,kBAAiB,GAAE,YAAW,EAAC,sBAAqB,mBAAkB,WAAU,mBAAkB,WAAU,mBAAkB,aAAY,mBAAkB,GAAE,kBAAiB,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,uBAAsB,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,YAAW,WAAU,kBAAiB,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAChhB,IAAI,8BAA8B;AAClC,IAAI,qBAAqB;AACzB,IAAI,iBAAiB;AACrB,IAAI,UAAU;AACd,IAAI,sBAAsB;AAC1B,IAAI,iBAAiB;AACrB,IAAI,gBAAgB;AACpB,IAAI,uBAAuB;AAC3B,IAAI,6BAA6B;AACjC,IAAI,kBAAkB;AACtB,IAAI,SAAS;AACb,IAAI,eAAe;AACnB,IAAI,mBAAmB;AACvB,IAAI,iBAAiB;AACrB,IAAI,wBAAwB;",
   "names": []
 }

package/esm/tables/DataTable/components/DataTableRow.css

@@ -1,34 +1,34 @@
-._1y5fzv0-3-4-0 {
+._1y5fzv0-3-5-0 {
   display: grid;
   grid-template-columns: subgrid;
   position: relative;
   grid-template-rows: inherit;
 }
-._or8s40-3-4-0:not(:has([aria-expanded="true"][aria-controls])) ._1y5fzv0-3-4-0 {
+._or8s40-3-5-0:not(:has([aria-expanded="true"][aria-controls])) ._1y5fzv0-3-5-0 {
   border-bottom-width: 0;
 }
-._1y5fzv2-3-4-0 {
+._1y5fzv2-3-5-0 {
   border-bottom: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._ytdpsw0-3-4-0 ._14sp6az6-3-4-0._1y5fzv2-3-4-0,
-          ._ytdpswc-3-4-0 ._14sp6az6-3-4-0._1y5fzv2-3-4-0,
-          ._ytdpswe-3-4-0 ._14sp6az6-3-4-0._1y5fzv2-3-4-0,
-          ._2twyod0-3-4-0._1y5fzv2-3-4-0 {
+._ytdpsw0-3-5-0 ._14sp6az6-3-5-0._1y5fzv2-3-5-0,
+          ._ytdpswc-3-5-0 ._14sp6az6-3-5-0._1y5fzv2-3-5-0,
+          ._ytdpswe-3-5-0 ._14sp6az6-3-5-0._1y5fzv2-3-5-0,
+          ._2twyod0-3-5-0._1y5fzv2-3-5-0 {
   border-bottom-width: 0;
 }
-._1y5fzv3-3-4-0 {
+._1y5fzv3-3-5-0 {
   border-bottom: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._ytdpsw0-3-4-0 ._14sp6az6-3-4-0._1y5fzv3-3-4-0,
-          ._2twyod0-3-4-0._1y5fzv3-3-4-0 {
+._ytdpsw0-3-5-0 ._14sp6az6-3-5-0._1y5fzv3-3-5-0,
+          ._2twyod0-3-5-0._1y5fzv3-3-5-0 {
   border-bottom-width: 0;
 }
-._1y5fzv6-3-4-0 {
+._1y5fzv6-3-5-0 {
   visibility: hidden;
 }
-._1y5fzv8-3-4-0:not(._15silbj3-3-4-0, ._15silbj4-3-4-0, ._15silbj0-3-4-0:hover) {
+._1y5fzv8-3-5-0:not(._15silbj3-3-5-0, ._15silbj4-3-5-0, ._15silbj0-3-5-0:hover) {
   background-color: var(--dt-colors-background-surface-default, #fff);
 }
-._1y5fzv9-3-4-0:not(._15silbj3-3-4-0, ._15silbj4-3-4-0, ._15silbj0-3-4-0:hover) {
+._1y5fzv9-3-5-0:not(._15silbj3-3-5-0, ._15silbj4-3-5-0, ._15silbj0-3-5-0:hover) {
   background-color: var(--dt-colors-background-container-neutral-subdued, #f9f9fa);
 }

package/esm/tables/DataTable/components/DataTableRow.sty.js

@@ -1,3 +1,4 @@
+import "../../../core/components/app-root/AppRoot.css";
 import "./DataTableVirtualizationContainer.css";
 import "../DataTable.css";
 import "../features/RowOrder/RowOrder.css";
@@ -5,7 +6,7 @@ import "../features/RowDetails/RowDetails.css";
 import "../features/RowInteractivity/RowInteractivity.css";
 import "./DataTableRow.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var row = _7a468({ defaultClassName: "_1y5fzv0-3-4-0", variantClassNames: { rowSeparation: { none: "_1y5fzv1-3-4-0", horizontalDividers: "_1y5fzv2-3-4-0", zebraStripes: "_1y5fzv3-3-4-0" }, rowParity: { even: "_1y5fzv4-3-4-0", odd: "_1y5fzv5-3-4-0" }, isDraggedRow: { true: "_1y5fzv6-3-4-0", false: "_1y5fzv7-3-4-0" } }, defaultVariants: {}, compoundVariants: [[{ rowSeparation: "zebraStripes", rowParity: "even" }, "_1y5fzv8-3-4-0"], [{ rowSeparation: "zebraStripes", rowParity: "odd" }, "_1y5fzv9-3-4-0"]] });
+var row = _7a468({ defaultClassName: "_1y5fzv0-3-5-0", variantClassNames: { rowSeparation: { none: "_1y5fzv1-3-5-0", horizontalDividers: "_1y5fzv2-3-5-0", zebraStripes: "_1y5fzv3-3-5-0" }, rowParity: { even: "_1y5fzv4-3-5-0", odd: "_1y5fzv5-3-5-0" }, isDraggedRow: { true: "_1y5fzv6-3-5-0", false: "_1y5fzv7-3-5-0" } }, defaultVariants: {}, compoundVariants: [[{ rowSeparation: "zebraStripes", rowParity: "even" }, "_1y5fzv8-3-5-0"], [{ rowSeparation: "zebraStripes", rowParity: "odd" }, "_1y5fzv9-3-5-0"]] });
 export {
   row
 };

package/esm/tables/DataTable/components/DataTableRow.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/tables/DataTable/components/DataTableRow.css.ts"],
-  "sourcesContent": ["import './DataTableVirtualizationContainer.css';\nimport '../DataTable.css';\nimport '../features/RowOrder/RowOrder.css';\nimport '../features/RowDetails/RowDetails.css';\nimport '../features/RowInteractivity/RowInteractivity.css';\nimport './DataTableRow.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var row = _7a468({defaultClassName:'_1y5fzv0-3-4-0',variantClassNames:{rowSeparation:{none:'_1y5fzv1-3-4-0',horizontalDividers:'_1y5fzv2-3-4-0',zebraStripes:'_1y5fzv3-3-4-0'},rowParity:{even:'_1y5fzv4-3-4-0',odd:'_1y5fzv5-3-4-0'},isDraggedRow:{true:'_1y5fzv6-3-4-0',false:'_1y5fzv7-3-4-0'}},defaultVariants:{},compoundVariants:[[{rowSeparation:'zebraStripes',rowParity:'even'},'_1y5fzv8-3-4-0'],[{rowSeparation:'zebraStripes',rowParity:'odd'},'_1y5fzv9-3-4-0']]});"],
-  "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,MAAM,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,eAAc,EAAC,MAAK,kBAAiB,oBAAmB,kBAAiB,cAAa,iBAAgB,GAAE,WAAU,EAAC,MAAK,kBAAiB,KAAI,iBAAgB,GAAE,cAAa,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,eAAc,gBAAe,WAAU,OAAM,GAAE,gBAAgB,GAAE,CAAC,EAAC,eAAc,gBAAe,WAAU,MAAK,GAAE,gBAAgB,CAAC,EAAC,CAAC;",
+  "sourcesContent": ["import '../../../core/components/app-root/AppRoot.css';\nimport './DataTableVirtualizationContainer.css';\nimport '../DataTable.css';\nimport '../features/RowOrder/RowOrder.css';\nimport '../features/RowDetails/RowDetails.css';\nimport '../features/RowInteractivity/RowInteractivity.css';\nimport './DataTableRow.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var row = _7a468({defaultClassName:'_1y5fzv0-3-5-0',variantClassNames:{rowSeparation:{none:'_1y5fzv1-3-5-0',horizontalDividers:'_1y5fzv2-3-5-0',zebraStripes:'_1y5fzv3-3-5-0'},rowParity:{even:'_1y5fzv4-3-5-0',odd:'_1y5fzv5-3-5-0'},isDraggedRow:{true:'_1y5fzv6-3-5-0',false:'_1y5fzv7-3-5-0'}},defaultVariants:{},compoundVariants:[[{rowSeparation:'zebraStripes',rowParity:'even'},'_1y5fzv8-3-5-0'],[{rowSeparation:'zebraStripes',rowParity:'odd'},'_1y5fzv9-3-5-0']]});"],
+  "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,MAAM,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,eAAc,EAAC,MAAK,kBAAiB,oBAAmB,kBAAiB,cAAa,iBAAgB,GAAE,WAAU,EAAC,MAAK,kBAAiB,KAAI,iBAAgB,GAAE,cAAa,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,eAAc,gBAAe,WAAU,OAAM,GAAE,gBAAgB,GAAE,CAAC,EAAC,eAAc,gBAAe,WAAU,MAAK,GAAE,gBAAgB,CAAC,EAAC,CAAC;",
   "names": []
 }

package/esm/tables/DataTable/components/DataTableScrollShadow.css

@@ -1,8 +1,8 @@
-._1al677r0-3-4-0 {
+._1al677r0-3-5-0 {
   position: sticky;
   pointer-events: none;
 }
-._1al677r0-3-4-0::after {
+._1al677r0-3-5-0::after {
   content: "";
   position: absolute;
   top: 0;
@@ -10,19 +10,19 @@
   width: 50px;
   pointer-events: none;
 }
-[data-theme="light"] ._1al677r1-3-4-0::after {
+[data-theme="light"] ._1al677r1-3-5-0::after {
   box-shadow: inset 12px 0px 12px -32px var(--dt-colors-theme-foreground-10, #2d2e4e), inset 18px 0px 18px -32px var(--dt-colors-theme-foreground-10, #2d2e4e);
 }
-[data-theme="dark"] ._1al677r1-3-4-0::after {
+[data-theme="dark"] ._1al677r1-3-5-0::after {
   box-shadow: inset 12px 0px 12px -16px var(--dt-colors-theme-foreground-20, #fff), inset 16px 0px 16px -16px var(--dt-colors-theme-foreground-20, #fff);
 }
-[data-theme="light"] ._1al677r2-3-4-0::after {
+[data-theme="light"] ._1al677r2-3-5-0::after {
   box-shadow: inset -12px 0px 12px -32px var(--dt-colors-theme-foreground-10, #2d2e4e), inset -18px 0px 18px -32px var(--dt-colors-theme-foreground-10, #2d2e4e);
 }
-[data-theme="dark"] ._1al677r2-3-4-0::after {
+[data-theme="dark"] ._1al677r2-3-5-0::after {
   box-shadow: inset -12px 0px 12px -16px var(--dt-colors-theme-foreground-20, #fff), inset -16px 0px 16px -16px var(--dt-colors-theme-foreground-20, #fff);
 }
-._1al677r3-3-4-0 {
+._1al677r3-3-5-0 {
   top: 0;
   bottom: 0;
   height: 100%;
@@ -33,10 +33,10 @@
   grid-row-end: body-end;
   z-index: 6;
 }
-._1al677r3-3-4-0::after {
+._1al677r3-3-5-0::after {
   left: 0;
 }
-._1al677r4-3-4-0 {
+._1al677r4-3-5-0 {
   top: 0;
   bottom: 0;
   height: 100%;
@@ -46,6 +46,6 @@
   grid-row-end: body-end;
   z-index: 6;
 }
-._1al677r4-3-4-0::after {
+._1al677r4-3-5-0::after {
   right: 0;
 }

package/esm/tables/DataTable/components/DataTableScrollShadow.sty.js

@@ -1,6 +1,6 @@
 import "./DataTableScrollShadow.css";
-var scrollShadow = { left: "_1al677r1-3-4-0 _1al677r0-3-4-0", right: "_1al677r2-3-4-0 _1al677r0-3-4-0" };
-var tableEdgeShadow = { left: "_1al677r3-3-4-0 _1al677r1-3-4-0 _1al677r0-3-4-0", right: "_1al677r4-3-4-0 _1al677r2-3-4-0 _1al677r0-3-4-0" };
+var scrollShadow = { left: "_1al677r1-3-5-0 _1al677r0-3-5-0", right: "_1al677r2-3-5-0 _1al677r0-3-5-0" };
+var tableEdgeShadow = { left: "_1al677r3-3-5-0 _1al677r1-3-5-0 _1al677r0-3-5-0", right: "_1al677r4-3-5-0 _1al677r2-3-5-0 _1al677r0-3-5-0" };
 export {
   scrollShadow,
   tableEdgeShadow

package/esm/tables/DataTable/components/DataTableScrollShadow.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/tables/DataTable/components/DataTableScrollShadow.css.ts"],
-  "sourcesContent": ["import './DataTableScrollShadow.css';\nexport var scrollShadow = {left:'_1al677r1-3-4-0 _1al677r0-3-4-0',right:'_1al677r2-3-4-0 _1al677r0-3-4-0'};\nexport var tableEdgeShadow = {left:'_1al677r3-3-4-0 _1al677r1-3-4-0 _1al677r0-3-4-0',right:'_1al677r4-3-4-0 _1al677r2-3-4-0 _1al677r0-3-4-0'};"],
+  "sourcesContent": ["import './DataTableScrollShadow.css';\nexport var scrollShadow = {left:'_1al677r1-3-5-0 _1al677r0-3-5-0',right:'_1al677r2-3-5-0 _1al677r0-3-5-0'};\nexport var tableEdgeShadow = {left:'_1al677r3-3-5-0 _1al677r1-3-5-0 _1al677r0-3-5-0',right:'_1al677r4-3-5-0 _1al677r2-3-5-0 _1al677r0-3-5-0'};"],
   "mappings": "AAAA,OAAO;AACA,IAAI,eAAe,EAAC,MAAK,mCAAkC,OAAM,kCAAiC;AAClG,IAAI,kBAAkB,EAAC,MAAK,mDAAkD,OAAM,kDAAiD;",
   "names": []
 }

package/esm/tables/DataTable/components/DataTableVirtualizationContainer.css

@@ -1,4 +1,4 @@
-._ytdpsw0-3-4-0 {
+._ytdpsw0-3-5-0 {
   position: relative;
   width: 100%;
   max-width: 100%;
@@ -6,50 +6,76 @@
   overflow: auto;
   box-sizing: border-box;
 }
-._ytdpsw1-3-4-0 {
+._ytdpsw1-3-5-0 {
   display: grid;
   grid-template-rows: auto 1fr;
   grid-template-areas: 'header' 'body';
 }
-._ytdpsw2-3-4-0 {
+._ytdpsw2-3-5-0 {
   display: flex;
   flex-direction: column;
   justify-content: center;
 }
-._ytdpsw3-3-4-0 {
+._ytdpsw3-3-5-0 {
   overflow: hidden;
 }
-._ytdpsw4-3-4-0 {
+._ytdpsw4-3-5-0 {
   background-color: var(--dt-colors-background-surface-default, #fff);
   border-color: var(--dt-colors-border-neutral-default, #dadbe4);
   border-style: var(--dt-borders-style-default, solid);
   border-width: var(--dt-borders-width-emphasized, 2px);
   border-radius: var(--dt-borders-radius-field-default, 6px);
 }
-._ytdpsw4-3-4-0::-webkit-scrollbar-track {
+._ytdpsw4-3-5-0::-webkit-scrollbar-track {
   background-color: var(--dt-colors-background-container-neutral-subdued, #f9f9fa);
   border-bottom-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
 }
-._ytdpsw4-3-4-0::-webkit-scrollbar-track:horizontal {
+._ytdpsw4-3-5-0::-webkit-scrollbar-track:horizontal {
   border-top: solid var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-default, #dadbe4);
   border-bottom-left-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
 }
-._ytdpsw4-3-4-0::-webkit-scrollbar-track:vertical {
+._ytdpsw4-3-5-0::-webkit-scrollbar-track:vertical {
   border-left: solid var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-default, #dadbe4);
   border-top-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
 }
-._ytdpsw5-3-4-0::-webkit-scrollbar-track:horizontal {
+._1jgl8s50-3-5-0 ._ytdpsw4-3-5-0 {
+  border-width: var(--dt-borders-width-default, 1px);
+}
+._1jgl8s50-3-5-0 ._ytdpsw4-3-5-0::-webkit-scrollbar-track {
+  border-bottom-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-default, 1px));
+}
+._1jgl8s50-3-5-0 ._ytdpsw4-3-5-0::-webkit-scrollbar-track:horizontal {
+  border-top: solid var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-default, #dadbe4);
+  border-bottom-left-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-default, 1px));
+}
+._1jgl8s50-3-5-0 ._ytdpsw4-3-5-0::-webkit-scrollbar-track:vertical {
+  border-left: solid var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-default, #dadbe4);
+  border-top-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-default, 1px));
+}
+._ytdpsw5-3-5-0::-webkit-scrollbar-track:horizontal {
   border-top: solid var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._ytdpswf-3-4-0::-webkit-scrollbar-track:horizontal {
+._1jgl8s50-3-5-0 ._ytdpsw5-3-5-0::-webkit-scrollbar-track:horizontal {
+  border-top: solid var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-default, #dadbe4);
+}
+._ytdpswf-3-5-0::-webkit-scrollbar-track:horizontal {
   border-top: solid var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-default, #dadbe4);
   border-bottom-right-radius: 0;
 }
-._ytdpswf-3-4-0::-webkit-scrollbar-track:vertical {
+._ytdpswf-3-5-0::-webkit-scrollbar-track:vertical {
   border-left: solid var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-default, #dadbe4);
   border-bottom-right-radius: 0;
 }
-._ytdpswf-3-4-0::-webkit-scrollbar-corner {
+._ytdpswf-3-5-0::-webkit-scrollbar-corner {
   background-color: var(--dt-colors-background-container-neutral-subdued, #f9f9fa);
   border-bottom-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
+}
+._1jgl8s50-3-5-0 ._ytdpswf-3-5-0::-webkit-scrollbar-track:horizontal {
+  border-top: solid var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-default, #dadbe4);
+}
+._1jgl8s50-3-5-0 ._ytdpswf-3-5-0::-webkit-scrollbar-track:vertical {
+  border-left: solid var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-default, #dadbe4);
+}
+._1jgl8s50-3-5-0 ._ytdpswf-3-5-0::-webkit-scrollbar-corner {
+  border-bottom-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-default, 1px));
 }

package/esm/tables/DataTable/components/DataTableVirtualizationContainer.js

@@ -13,8 +13,8 @@ import { DataTableStatePlaceholder } from "./DataTableStatePlaceholder.js";
 import * as styles from "./DataTableVirtualizationContainer.sty.js";
 import { useFontsUpdated } from "../../../core/hooks/useFontsUpdated.js";
 import { devLog } from "../../../core/utils/logging.js";
+import { getDataTableBorderWidth } from "../../utils/data-table-border-width.js";
 import {
-  DATA_TABLE_BORDER_WIDTH,
   DATA_TABLE_DEFAULT_COLUMN_WIDTH,
   DATA_TABLE_DEFAULT_MIN_COLUMN_WIDTH,
   DATA_TABLE_VIRTUALIZER_COLUMN_OVERSCAN,
@@ -157,12 +157,12 @@ function DataTableVirtualizationContainer(props) {
   const containerStyle = useMemo(() => {
     let minHeight = void 0;
     if (totalHeaderHeight === 0) {
-      minHeight = headers === "hidden" ? estimatedRowHeight : estimatedRowHeight * 2 + DATA_TABLE_BORDER_WIDTH;
+      minHeight = headers === "hidden" ? estimatedRowHeight : estimatedRowHeight * 2 + getDataTableBorderWidth();
     } else {
       minHeight = totalHeaderHeight + estimatedRowHeight;
     }
     if (contained) {
-      minHeight += 2 * DATA_TABLE_BORDER_WIDTH;
+      minHeight += 2 * getDataTableBorderWidth();
     }
     const baseStyle = {
       minHeight