@dynatrace/strato-components 3.10.4 → 3.11.1

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

@@ -1,5 +1,6 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createElement } from "react";
+import { useSelector } from "@tanstack/react-store";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import clsx from "clsx";
 import {
@@ -58,9 +59,10 @@ function getHeaderAriaLabel({
   canSort,
   columnDragAndDropMode,
   isCustomHeader,
-  role
+  role,
+  isBuiltinColumn
 }) {
-  if (role === "presentation") {
+  if (role === "presentation" || isBuiltinColumn) {
     return void 0;
   }
   if (canSort && columnDragAndDropMode === "none") {
@@ -164,8 +166,14 @@ function DataTableHeaderCell(props) {
   });
   const divRef = useRef(null);
   const mergedRef = useMergeRefs([setNodeRef, divRef]);
-  const floatingMenuInfo = table.atoms.floatingMenuInfo?.get();
-  const isActiveFloatingMenu = floatingMenuInfo?.rowId === null && floatingMenuInfo?.headerId === props.header.id;
+  const isActiveFloatingMenu = useSelector(
+    table.atoms.floatingMenuInfo,
+    (floatingMenuInfo) => floatingMenuInfo?.rowId === null && floatingMenuInfo?.headerId === props.header.id
+  );
+  const isColumnDragActive = useSelector(
+    table.atoms.draggedHeaderColumn,
+    (draggedHeaderColumn) => draggedHeaderColumn !== null
+  );
   const visualVariantConfig = table.atoms.visualVariantConfig?.get();
   const {
     handleCellMouseEnter,
@@ -197,8 +205,6 @@ function DataTableHeaderCell(props) {
     (sort) => sort.id === column.id
   );
   const multiSortPriority = sortedColumnsCount > 1 && columnSortIndex >= 0 ? columnSortIndex + 1 : void 0;
-  const draggedHeaderColumn = table.atoms.draggedHeaderColumn?.get() ?? null;
-  const isColumnDragActive = draggedHeaderColumn !== null;
   const isRightAligned = columnDef.alignment === "right";
   const renderVerticalDividers = visualVariantConfig?.verticalDividers || table.getHeaderGroups().length > 1 || table.options.enableColumnResizing && (canResize || // when resizing is enabled we need to render the vertical dividers for the spacer column as well
   column.id === DATA_TABLE_SPACER_COLUMN_ID);
@@ -231,7 +237,8 @@ function DataTableHeaderCell(props) {
     canSort,
     columnDragAndDropMode,
     isCustomHeader: !hasDefaultHeaderRenderer,
-    role
+    role,
+    isBuiltinColumn: columnDef.meta?.builtin === true
   });
   const ariaSortDescription = getHeaderAriaSortDescription({
     intl,
@@ -330,7 +337,7 @@ function DataTableHeaderCell(props) {
           [headerCellStyles.subRowIndicatorColumn]: isSubRowIndicatorColumn,
           // add grab cursor styling only if column drag and drop is enabled but sorting is not
           [columnOrderStyles.headerDragAndDrop.enabled]: !isDragging && columnDragAndDropMode !== "none" && !props.header.getCanSortByHeaderClick(),
-          [columnOrderStyles.headerDragAndDrop.inactive]: draggedHeaderColumn !== null
+          [columnOrderStyles.headerDragAndDrop.inactive]: isColumnDragActive
         }
       ),
       "aria-sort": props.header.getAriaSortAttribute(),
@@ -371,7 +378,12 @@ function DataTableHeaderCell(props) {
             headerGroupOrRowId: headerGroupId,
             columnId,
             type: "header",
-            "aria-label": intl.formatMessage(dataTableMessages.columnActionLabel),
+            "aria-label": intl.formatMessage(
+              dataTableMessages.columnActionLabel,
+              {
+                column: columnLabel
+              }
+            ),
             "data-header-row": rowIndex,
             "data-column": columnIndex,
             onClose: handleCellActionsClose

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/tables/DataTable/components/DataTableHeaderCell.tsx"],
-  "sourcesContent": ["import {\n  type Column,\n  type Header,\n  type RowData,\n  type SortDirection,\n} 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 { useMergeRefs } from '../../../core/hooks/useMergeRefs.js';\nimport { Tooltip } from '../../../overlays/tooltip/Tooltip.js';\nimport { Text } from '../../../typography/text/Text.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 { DataTablePinningShadowHeaderCells } from './ColumnPinning/DataTablePinningShadowHeaderCells.js';\nimport * as columnOrderStyles from '../features/ColumnOrder/ColumnOrder.sty.js';\nimport { SortingArrowIndicators } from '../features/Sorting/SortingArrowIndicators.js';\nimport { SubRowsHeaderExpander } from '../features/SubRows/components/SubRowExpanders.js';\nimport { SubRowsHeaderWidthCorrection } from '../features/SubRows/components/SubRowsHeaderWidthCorrection.js';\nimport { InlineUserActionsMenu } from '../features/UserActions/InlineUserActionsMenu.js';\nimport { useHeaderCellInteractions } from '../hooks/useHeaderCellInteractions.js';\nimport { useHeaderCellDragAndDrop } from '../hooks/useHeaderDragAndDrop.js';\nimport { dataTableMessages } from '../messages.js';\nimport * as headerCellStyles from './DataTableHeaderCell.sty.js';\nimport type { TDataTableFeatures } from '../features/types/features.types.js';\n\ninterface DataTableHeaderCellProps<TData extends RowData>\n  extends PropsWithChildren {\n  /**\n   * Header to be rendered with this header cell.\n   */\n  header: Header<TDataTableFeatures, TData>;\n\n  /**\n   * All headers in the same group (row).\n   */\n  headers: Header<TDataTableFeatures, TData>[];\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  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<TData extends RowData>(\n  props: Readonly<DataTableHeaderCellProps<TData>>,\n): JSX.Element | null {\n  const {\n    headers,\n    headerGroupId,\n    rowIndex,\n    columnIndex: virtualColumnIndex,\n    lastRowIndex,\n  } = props;\n\n  const intl = useIntl();\n  const table = useDataTable();\n  const columnDragAndDropMode = props.header.getColumnDragAndDropMode();\n  const gridPosition = props.header.getGridPosition(headers);\n  const column = props.header.column;\n\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: props.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 floatingMenuInfo = table.atoms.floatingMenuInfo?.get();\n  const isActiveFloatingMenu =\n    floatingMenuInfo?.rowId === null &&\n    floatingMenuInfo?.headerId === props.header.id;\n\n  const visualVariantConfig = table.atoms.visualVariantConfig?.get();\n\n  const {\n    handleCellMouseEnter,\n    handleCellMouseLeave,\n    handleCellActionsClose,\n    handleCellClick,\n  } = useHeaderCellInteractions({\n    headerCell: divRef.current,\n    canSort,\n    canColumnActions,\n    isActiveFloatingMenu,\n    rowDensity: visualVariantConfig?.rowDensity,\n    toggleSortingHandler: column.getToggleSortingHandler(),\n  });\n\n  // Early exit if the header is a placeholder to not render any content.\n  if (props.header.isPlaceholder) {\n    return null;\n  }\n  const headerGroupsLength = table.getHeaderGroups().length;\n\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    table.atoms.sorting?.get().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 draggedHeaderColumn = table.atoms.draggedHeaderColumn?.get() ?? null;\n  const isColumnDragActive = draggedHeaderColumn !== null;\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    visualVariantConfig?.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 hasCustomHeaderRenderer = columnDef.meta?.hasCustomHeaderRenderer;\n  const children = hasCustomHeaderRenderer ? (\n    <DataTableColumnContextProvider\n      value={props.header.column as Column<TDataTableFeatures, RowData>}\n    >\n      <table.FlexRender\n        header={props.header as Header<TDataTableFeatures, RowData>}\n      />\n    </DataTableColumnContextProvider>\n  ) : (\n    <table.FlexRender\n      header={props.header as Header<TDataTableFeatures, RowData>}\n    />\n  );\n\n  // A default header renderer is used when the header content is a simple string or when\n  // no header is defined (in which case the column id is used as the header and is also a string).\n  // In both cases, we can apply text overflow handling and tooltips. If the header is a React node,\n  // we assume that it's a custom header renderer and that the user will handle text overflow\n  // and tooltips within that custom renderer, so we don't apply text overflow handling on our side.\n  const hasDefaultHeaderRenderer =\n    typeof props.header.column.columnDef.header === 'string' ||\n    (props.header.column.columnDef.header === undefined &&\n      props.header.column.columnDef.id === undefined);\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: !hasDefaultHeaderRenderer,\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 = props.header.getIsPinned();\n  const isPinnedLeft = pinningPosition === 'left';\n  const isPinnedRight = pinningPosition === 'right';\n  const leftPinnedPosition = isPinnedLeft\n    ? props.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    ? props.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    ? props.header.getIsLastVisibleLeftPinnedHeader()\n    : false;\n  const isFirstVisibleRightPinnedHeader = isPinnedRight\n    ? props.header.getIsFirstVisibleRightPinnedHeader()\n    : false;\n  const isFirstVisibleUnpinnedHeader =\n    pinningPosition === false\n      ? props.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={props.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            : visualVariantConfig?.rowDensity,\n          pinnedColumn: pinningPosition,\n          verticalDividers: renderVerticalDividers,\n          isDragAndDropDisabled: props.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]: isActiveFloatingMenu,\n          [headerCellStyles.customHeaderDensity[\n            visualVariantConfig?.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            !props.header.getCanSortByHeaderClick(),\n          [columnOrderStyles.headerDragAndDrop.inactive]:\n            draggedHeaderColumn !== null,\n        },\n      )}\n      aria-sort={props.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      {hasDefaultHeaderRenderer ? (\n        <HeaderTextEllipsis onTextOverflow={handleTextOverflow}>\n          {/* Avoid the flex rendered children here, as they produce react fibre nodes. */}\n          {props.header.column.columnDef.header as string}\n        </HeaderTextEllipsis>\n      ) : (\n        children\n      )}\n\n      {canSort && (\n        <SortingArrowIndicators\n          isSorted={isSorted}\n          nextSortingOrder={nextSortingOrder}\n          multiSortPriority={multiSortPriority}\n          rowDensity={visualVariantConfig?.rowDensity}\n        />\n      )}\n\n      {canColumnActions && !isColumnDragActive && (\n        <DataTableHeaderContextProvider\n          value={props.header as Header<TDataTableFeatures, RowData>}\n        >\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={props.header.getResizeHandler()}\n          onTouchStart={props.header.getResizeHandler()}\n          onKeyUp={props.header.getKeyboardResizeHandler()}\n          onDoubleClick={props.header.getResizeExpandHandler()}\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 (hasDefaultHeaderRenderer) {\n    // Need to reapply the tooltip small styling content as the children are now always a\n    // react node after the v9 tanstack upgrade, which switches the `flexRender` function to `<table.FlexRender />` component\n    const tooltipContent = (\n      <Text textStyle=\"small\" as=\"p\">\n        {children}\n      </Text>\n    );\n    headerContent = (\n      <Tooltip disabled={!textOverflowRef.current} text={tooltipContent}>\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 { useSelector } from '@tanstack/react-store';\nimport {\n  type Column,\n  type Header,\n  type RowData,\n  type SortDirection,\n} 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 { useMergeRefs } from '../../../core/hooks/useMergeRefs.js';\nimport { Tooltip } from '../../../overlays/tooltip/Tooltip.js';\nimport { Text } from '../../../typography/text/Text.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 { DataTablePinningShadowHeaderCells } from './ColumnPinning/DataTablePinningShadowHeaderCells.js';\nimport * as columnOrderStyles from '../features/ColumnOrder/ColumnOrder.sty.js';\nimport { SortingArrowIndicators } from '../features/Sorting/SortingArrowIndicators.js';\nimport { SubRowsHeaderExpander } from '../features/SubRows/components/SubRowExpanders.js';\nimport { SubRowsHeaderWidthCorrection } from '../features/SubRows/components/SubRowsHeaderWidthCorrection.js';\nimport { InlineUserActionsMenu } from '../features/UserActions/InlineUserActionsMenu.js';\nimport { useHeaderCellInteractions } from '../hooks/useHeaderCellInteractions.js';\nimport { useHeaderCellDragAndDrop } from '../hooks/useHeaderDragAndDrop.js';\nimport { dataTableMessages } from '../messages.js';\nimport * as headerCellStyles from './DataTableHeaderCell.sty.js';\nimport type { TDataTableFeatures } from '../features/types/features.types.js';\n\ninterface DataTableHeaderCellProps<TData extends RowData>\n  extends PropsWithChildren {\n  /**\n   * Header to be rendered with this header cell.\n   */\n  header: Header<TDataTableFeatures, TData>;\n\n  /**\n   * All headers in the same group (row).\n   */\n  headers: Header<TDataTableFeatures, TData>[];\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  isBuiltinColumn,\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  isBuiltinColumn?: boolean;\n}): string | undefined {\n  // Don't set an aria-label on elements with role=\"presentation\"\n  // and built-in columns as they provide their own visually-hidden accessible name.\n  if (role === 'presentation' || isBuiltinColumn) {\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<TData extends RowData>(\n  props: Readonly<DataTableHeaderCellProps<TData>>,\n): JSX.Element | null {\n  const {\n    headers,\n    headerGroupId,\n    rowIndex,\n    columnIndex: virtualColumnIndex,\n    lastRowIndex,\n  } = props;\n\n  const intl = useIntl();\n  const table = useDataTable();\n  const columnDragAndDropMode = props.header.getColumnDragAndDropMode();\n  const gridPosition = props.header.getGridPosition(headers);\n  const column = props.header.column;\n\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: props.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  // Subscribe only to whether this header owns the active floating menu.\n  const isActiveFloatingMenu = useSelector(\n    table.atoms.floatingMenuInfo,\n    (floatingMenuInfo) =>\n      floatingMenuInfo?.rowId === null &&\n      floatingMenuInfo?.headerId === props.header.id,\n  );\n  // Subscribe to the global column drag activity state.\n  const isColumnDragActive = useSelector(\n    table.atoms.draggedHeaderColumn,\n    (draggedHeaderColumn) => draggedHeaderColumn !== null,\n  );\n\n  const visualVariantConfig = table.atoms.visualVariantConfig?.get();\n\n  const {\n    handleCellMouseEnter,\n    handleCellMouseLeave,\n    handleCellActionsClose,\n    handleCellClick,\n  } = useHeaderCellInteractions({\n    headerCell: divRef.current,\n    canSort,\n    canColumnActions,\n    isActiveFloatingMenu,\n    rowDensity: visualVariantConfig?.rowDensity,\n    toggleSortingHandler: column.getToggleSortingHandler(),\n  });\n\n  // Early exit if the header is a placeholder to not render any content.\n  if (props.header.isPlaceholder) {\n    return null;\n  }\n  const headerGroupsLength = table.getHeaderGroups().length;\n\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    table.atoms.sorting?.get().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 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    visualVariantConfig?.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 hasCustomHeaderRenderer = columnDef.meta?.hasCustomHeaderRenderer;\n  const children = hasCustomHeaderRenderer ? (\n    <DataTableColumnContextProvider\n      value={props.header.column as Column<TDataTableFeatures, RowData>}\n    >\n      <table.FlexRender\n        header={props.header as Header<TDataTableFeatures, RowData>}\n      />\n    </DataTableColumnContextProvider>\n  ) : (\n    <table.FlexRender\n      header={props.header as Header<TDataTableFeatures, RowData>}\n    />\n  );\n\n  // A default header renderer is used when the header content is a simple string or when\n  // no header is defined (in which case the column id is used as the header and is also a string).\n  // In both cases, we can apply text overflow handling and tooltips. If the header is a React node,\n  // we assume that it's a custom header renderer and that the user will handle text overflow\n  // and tooltips within that custom renderer, so we don't apply text overflow handling on our side.\n  const hasDefaultHeaderRenderer =\n    typeof props.header.column.columnDef.header === 'string' ||\n    (props.header.column.columnDef.header === undefined &&\n      props.header.column.columnDef.id === undefined);\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: !hasDefaultHeaderRenderer,\n    role,\n    isBuiltinColumn: columnDef.meta?.builtin === true,\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 = props.header.getIsPinned();\n  const isPinnedLeft = pinningPosition === 'left';\n  const isPinnedRight = pinningPosition === 'right';\n  const leftPinnedPosition = isPinnedLeft\n    ? props.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    ? props.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    ? props.header.getIsLastVisibleLeftPinnedHeader()\n    : false;\n  const isFirstVisibleRightPinnedHeader = isPinnedRight\n    ? props.header.getIsFirstVisibleRightPinnedHeader()\n    : false;\n  const isFirstVisibleUnpinnedHeader =\n    pinningPosition === false\n      ? props.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={props.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            : visualVariantConfig?.rowDensity,\n          pinnedColumn: pinningPosition,\n          verticalDividers: renderVerticalDividers,\n          isDragAndDropDisabled: props.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]: isActiveFloatingMenu,\n          [headerCellStyles.customHeaderDensity[\n            visualVariantConfig?.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            !props.header.getCanSortByHeaderClick(),\n          [columnOrderStyles.headerDragAndDrop.inactive]: isColumnDragActive,\n        },\n      )}\n      aria-sort={props.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      {hasDefaultHeaderRenderer ? (\n        <HeaderTextEllipsis onTextOverflow={handleTextOverflow}>\n          {/* Avoid the flex rendered children here, as they produce react fibre nodes. */}\n          {props.header.column.columnDef.header as string}\n        </HeaderTextEllipsis>\n      ) : (\n        children\n      )}\n\n      {canSort && (\n        <SortingArrowIndicators\n          isSorted={isSorted}\n          nextSortingOrder={nextSortingOrder}\n          multiSortPriority={multiSortPriority}\n          rowDensity={visualVariantConfig?.rowDensity}\n        />\n      )}\n\n      {canColumnActions && !isColumnDragActive && (\n        <DataTableHeaderContextProvider\n          value={props.header as Header<TDataTableFeatures, RowData>}\n        >\n          <InlineUserActionsMenu\n            headerGroupOrRowId={headerGroupId}\n            columnId={columnId}\n            type=\"header\"\n            aria-label={intl.formatMessage(\n              dataTableMessages.columnActionLabel,\n              {\n                column: columnLabel,\n              },\n            )}\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={props.header.getResizeHandler()}\n          onTouchStart={props.header.getResizeHandler()}\n          onKeyUp={props.header.getKeyboardResizeHandler()}\n          onDoubleClick={props.header.getResizeExpandHandler()}\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 (hasDefaultHeaderRenderer) {\n    // Need to reapply the tooltip small styling content as the children are now always a\n    // react node after the v9 tanstack upgrade, which switches the `flexRender` function to `<table.FlexRender />` component\n    const tooltipContent = (\n      <Text textStyle=\"small\" as=\"p\">\n        {children}\n      </Text>\n    );\n    headerContent = (\n      <Tooltip disabled={!textOverflowRef.current} text={tooltipContent}>\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

@@ -5,29 +5,29 @@ import "../features/ColumnOrder/ColumnOrder.css";
 import "../features/Thresholds/Thresholds.css";
 import "./DataTableHeaderCell.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var childHeader = "_11pvd3zc-3-10-4";
-var columnSizingHandle = _7a468({ defaultClassName: "_11pvd3zl-3-10-4", variantClassNames: { active: { true: "_11pvd3zm-3-10-4", false: "_11pvd3zn-3-10-4" }, last: { true: "_11pvd3zo-3-10-4", false: "_11pvd3zp-3-10-4" }, pinnedColumn: { false: "_11pvd3zq-3-10-4", left: "_11pvd3zr-3-10-4", right: "_11pvd3zs-3-10-4" } }, defaultVariants: {}, compoundVariants: [] });
-var customHeaderDensity = { "default": "_11pvd3z6-3-10-4", condensed: "_11pvd3z7-3-10-4", comfortable: "_11pvd3z8-3-10-4" };
-var firstColumn = "_11pvd3zd-3-10-4";
-var firstHeaderRow = "_11pvd3z9-3-10-4";
-var firstRightPinnedColumn = "_11pvd3zg-3-10-4";
-var firstUnpinnedColumn = "_11pvd3zf-3-10-4";
-var headerCell = _7a468({ defaultClassName: "_11pvd3zt-3-10-4", variantClassNames: { pinnedColumn: { false: "_11pvd3zu-3-10-4", left: "_11pvd3zv-3-10-4", right: "_11pvd3zw-3-10-4" }, rowDensity: { customHeaderRenderer: "_11pvd3zx-3-10-4", "default": "_11pvd3zy-3-10-4", condensed: "_11pvd3zz-3-10-4", comfortable: "_11pvd3z10-3-10-4" }, verticalDividers: { true: "_11pvd3z11-3-10-4", false: "_11pvd3z12-3-10-4" }, isDragAndDropDisabled: { true: "_11pvd3z13-3-10-4", false: "_11pvd3z14-3-10-4" } }, defaultVariants: { rowDensity: "default", verticalDividers: false }, compoundVariants: [] });
-var headerCellActiveInteraction = "_11pvd3z16-3-10-4";
-var headerCellEllipsis = "_11pvd3z15-3-10-4";
-var headerWidthVar = "var(--_11pvd3zj-3-10-4)";
-var hovered = "_11pvd3z0-3-10-4";
-var isMultiSortedHeader = "_11pvd3z4-3-10-4";
-var isSortedHeader = "_11pvd3z3-3-10-4";
-var lastHeaderRow = "_11pvd3za-3-10-4";
-var lastLeftPinnedColumn = "_11pvd3ze-3-10-4";
-var leftAdditionalElevationVar = "var(--_11pvd3zk-3-10-4)";
-var leftPositionVar = "var(--_11pvd3zh-3-10-4)";
-var narrow = "_11pvd3z1-3-10-4";
-var parentHeader = "_11pvd3zb-3-10-4";
-var rightPositionVar = "var(--_11pvd3zi-3-10-4)";
-var sortableHeader = "_11pvd3z2-3-10-4";
-var subRowIndicatorColumn = "_11pvd3z5-3-10-4";
+var childHeader = "_11pvd3zc-3-11-1";
+var columnSizingHandle = _7a468({ defaultClassName: "_11pvd3zl-3-11-1", variantClassNames: { active: { true: "_11pvd3zm-3-11-1", false: "_11pvd3zn-3-11-1" }, last: { true: "_11pvd3zo-3-11-1", false: "_11pvd3zp-3-11-1" }, pinnedColumn: { false: "_11pvd3zq-3-11-1", left: "_11pvd3zr-3-11-1", right: "_11pvd3zs-3-11-1" } }, defaultVariants: {}, compoundVariants: [] });
+var customHeaderDensity = { "default": "_11pvd3z6-3-11-1", condensed: "_11pvd3z7-3-11-1", comfortable: "_11pvd3z8-3-11-1" };
+var firstColumn = "_11pvd3zd-3-11-1";
+var firstHeaderRow = "_11pvd3z9-3-11-1";
+var firstRightPinnedColumn = "_11pvd3zg-3-11-1";
+var firstUnpinnedColumn = "_11pvd3zf-3-11-1";
+var headerCell = _7a468({ defaultClassName: "_11pvd3zt-3-11-1", variantClassNames: { pinnedColumn: { false: "_11pvd3zu-3-11-1", left: "_11pvd3zv-3-11-1", right: "_11pvd3zw-3-11-1" }, rowDensity: { customHeaderRenderer: "_11pvd3zx-3-11-1", "default": "_11pvd3zy-3-11-1", condensed: "_11pvd3zz-3-11-1", comfortable: "_11pvd3z10-3-11-1" }, verticalDividers: { true: "_11pvd3z11-3-11-1", false: "_11pvd3z12-3-11-1" }, isDragAndDropDisabled: { true: "_11pvd3z13-3-11-1", false: "_11pvd3z14-3-11-1" } }, defaultVariants: { rowDensity: "default", verticalDividers: false }, compoundVariants: [] });
+var headerCellActiveInteraction = "_11pvd3z16-3-11-1";
+var headerCellEllipsis = "_11pvd3z15-3-11-1";
+var headerWidthVar = "var(--_11pvd3zj-3-11-1)";
+var hovered = "_11pvd3z0-3-11-1";
+var isMultiSortedHeader = "_11pvd3z4-3-11-1";
+var isSortedHeader = "_11pvd3z3-3-11-1";
+var lastHeaderRow = "_11pvd3za-3-11-1";
+var lastLeftPinnedColumn = "_11pvd3ze-3-11-1";
+var leftAdditionalElevationVar = "var(--_11pvd3zk-3-11-1)";
+var leftPositionVar = "var(--_11pvd3zh-3-11-1)";
+var narrow = "_11pvd3z1-3-11-1";
+var parentHeader = "_11pvd3zb-3-11-1";
+var rightPositionVar = "var(--_11pvd3zi-3-11-1)";
+var sortableHeader = "_11pvd3z2-3-11-1";
+var subRowIndicatorColumn = "_11pvd3z5-3-11-1";
 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 '../../../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 = '_11pvd3zc-3-10-4';\nexport var columnSizingHandle = _7a468({defaultClassName:'_11pvd3zl-3-10-4',variantClassNames:{active:{true:'_11pvd3zm-3-10-4',false:'_11pvd3zn-3-10-4'},last:{true:'_11pvd3zo-3-10-4',false:'_11pvd3zp-3-10-4'},pinnedColumn:{false:'_11pvd3zq-3-10-4',left:'_11pvd3zr-3-10-4',right:'_11pvd3zs-3-10-4'}},defaultVariants:{},compoundVariants:[]});\nexport var customHeaderDensity = {'default':'_11pvd3z6-3-10-4',condensed:'_11pvd3z7-3-10-4',comfortable:'_11pvd3z8-3-10-4'};\nexport var firstColumn = '_11pvd3zd-3-10-4';\nexport var firstHeaderRow = '_11pvd3z9-3-10-4';\nexport var firstRightPinnedColumn = '_11pvd3zg-3-10-4';\nexport var firstUnpinnedColumn = '_11pvd3zf-3-10-4';\nexport var headerCell = _7a468({defaultClassName:'_11pvd3zt-3-10-4',variantClassNames:{pinnedColumn:{false:'_11pvd3zu-3-10-4',left:'_11pvd3zv-3-10-4',right:'_11pvd3zw-3-10-4'},rowDensity:{customHeaderRenderer:'_11pvd3zx-3-10-4','default':'_11pvd3zy-3-10-4',condensed:'_11pvd3zz-3-10-4',comfortable:'_11pvd3z10-3-10-4'},verticalDividers:{true:'_11pvd3z11-3-10-4',false:'_11pvd3z12-3-10-4'},isDragAndDropDisabled:{true:'_11pvd3z13-3-10-4',false:'_11pvd3z14-3-10-4'}},defaultVariants:{rowDensity:'default',verticalDividers:false},compoundVariants:[]});\nexport var headerCellActiveInteraction = '_11pvd3z16-3-10-4';\nexport var headerCellEllipsis = '_11pvd3z15-3-10-4';\nexport var headerWidthVar = 'var(--_11pvd3zj-3-10-4)';\nexport var hovered = '_11pvd3z0-3-10-4';\nexport var isMultiSortedHeader = '_11pvd3z4-3-10-4';\nexport var isSortedHeader = '_11pvd3z3-3-10-4';\nexport var lastHeaderRow = '_11pvd3za-3-10-4';\nexport var lastLeftPinnedColumn = '_11pvd3ze-3-10-4';\nexport var leftAdditionalElevationVar = 'var(--_11pvd3zk-3-10-4)';\nexport var leftPositionVar = 'var(--_11pvd3zh-3-10-4)';\nexport var narrow = '_11pvd3z1-3-10-4';\nexport var parentHeader = '_11pvd3zb-3-10-4';\nexport var rightPositionVar = 'var(--_11pvd3zi-3-10-4)';\nexport var sortableHeader = '_11pvd3z2-3-10-4';\nexport var subRowIndicatorColumn = '_11pvd3z5-3-10-4';"],
+  "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 = '_11pvd3zc-3-11-1';\nexport var columnSizingHandle = _7a468({defaultClassName:'_11pvd3zl-3-11-1',variantClassNames:{active:{true:'_11pvd3zm-3-11-1',false:'_11pvd3zn-3-11-1'},last:{true:'_11pvd3zo-3-11-1',false:'_11pvd3zp-3-11-1'},pinnedColumn:{false:'_11pvd3zq-3-11-1',left:'_11pvd3zr-3-11-1',right:'_11pvd3zs-3-11-1'}},defaultVariants:{},compoundVariants:[]});\nexport var customHeaderDensity = {'default':'_11pvd3z6-3-11-1',condensed:'_11pvd3z7-3-11-1',comfortable:'_11pvd3z8-3-11-1'};\nexport var firstColumn = '_11pvd3zd-3-11-1';\nexport var firstHeaderRow = '_11pvd3z9-3-11-1';\nexport var firstRightPinnedColumn = '_11pvd3zg-3-11-1';\nexport var firstUnpinnedColumn = '_11pvd3zf-3-11-1';\nexport var headerCell = _7a468({defaultClassName:'_11pvd3zt-3-11-1',variantClassNames:{pinnedColumn:{false:'_11pvd3zu-3-11-1',left:'_11pvd3zv-3-11-1',right:'_11pvd3zw-3-11-1'},rowDensity:{customHeaderRenderer:'_11pvd3zx-3-11-1','default':'_11pvd3zy-3-11-1',condensed:'_11pvd3zz-3-11-1',comfortable:'_11pvd3z10-3-11-1'},verticalDividers:{true:'_11pvd3z11-3-11-1',false:'_11pvd3z12-3-11-1'},isDragAndDropDisabled:{true:'_11pvd3z13-3-11-1',false:'_11pvd3z14-3-11-1'}},defaultVariants:{rowDensity:'default',verticalDividers:false},compoundVariants:[]});\nexport var headerCellActiveInteraction = '_11pvd3z16-3-11-1';\nexport var headerCellEllipsis = '_11pvd3z15-3-11-1';\nexport var headerWidthVar = 'var(--_11pvd3zj-3-11-1)';\nexport var hovered = '_11pvd3z0-3-11-1';\nexport var isMultiSortedHeader = '_11pvd3z4-3-11-1';\nexport var isSortedHeader = '_11pvd3z3-3-11-1';\nexport var lastHeaderRow = '_11pvd3za-3-11-1';\nexport var lastLeftPinnedColumn = '_11pvd3ze-3-11-1';\nexport var leftAdditionalElevationVar = 'var(--_11pvd3zk-3-11-1)';\nexport var leftPositionVar = 'var(--_11pvd3zh-3-11-1)';\nexport var narrow = '_11pvd3z1-3-11-1';\nexport var parentHeader = '_11pvd3zb-3-11-1';\nexport var rightPositionVar = 'var(--_11pvd3zi-3-11-1)';\nexport var sortableHeader = '_11pvd3z2-3-11-1';\nexport var subRowIndicatorColumn = '_11pvd3z5-3-11-1';"],
   "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,oBAAmB,mBAAkB,EAAC,QAAO,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,MAAK,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,cAAa,EAAC,OAAM,oBAAmB,MAAK,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC3U,IAAI,sBAAsB,EAAC,WAAU,oBAAmB,WAAU,oBAAmB,aAAY,mBAAkB;AACnH,IAAI,cAAc;AAClB,IAAI,iBAAiB;AACrB,IAAI,yBAAyB;AAC7B,IAAI,sBAAsB;AAC1B,IAAI,aAAa,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,cAAa,EAAC,OAAM,oBAAmB,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,YAAW,EAAC,sBAAqB,oBAAmB,WAAU,oBAAmB,WAAU,oBAAmB,aAAY,oBAAmB,GAAE,kBAAiB,EAAC,MAAK,qBAAoB,OAAM,oBAAmB,GAAE,uBAAsB,EAAC,MAAK,qBAAoB,OAAM,oBAAmB,EAAC,GAAE,iBAAgB,EAAC,YAAW,WAAU,kBAAiB,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC5hB,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-10-4 {
+._1y5fzv0-3-11-1 {
   display: grid;
   grid-template-columns: subgrid;
   position: relative;
   grid-template-rows: inherit;
 }
-._or8s40-3-10-4:not(:has([aria-expanded="true"][aria-controls])) ._1y5fzv0-3-10-4 {
+._or8s40-3-11-1:not(:has([aria-expanded="true"][aria-controls])) ._1y5fzv0-3-11-1 {
   border-bottom-width: 0;
 }
-._1y5fzv2-3-10-4 {
+._1y5fzv2-3-11-1 {
   border-bottom: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._ytdpsw0-3-10-4 ._14sp6az6-3-10-4._1y5fzv2-3-10-4,
-          ._ytdpswc-3-10-4 ._14sp6az6-3-10-4._1y5fzv2-3-10-4,
-          ._ytdpswe-3-10-4 ._14sp6az6-3-10-4._1y5fzv2-3-10-4,
-          ._2twyod0-3-10-4._1y5fzv2-3-10-4 {
+._ytdpsw0-3-11-1 ._14sp6az6-3-11-1._1y5fzv2-3-11-1,
+          ._ytdpswc-3-11-1 ._14sp6az6-3-11-1._1y5fzv2-3-11-1,
+          ._ytdpswe-3-11-1 ._14sp6az6-3-11-1._1y5fzv2-3-11-1,
+          ._2twyod0-3-11-1._1y5fzv2-3-11-1 {
   border-bottom-width: 0;
 }
-._1y5fzv3-3-10-4 {
+._1y5fzv3-3-11-1 {
   border-bottom: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._ytdpsw0-3-10-4 ._14sp6az6-3-10-4._1y5fzv3-3-10-4,
-          ._2twyod0-3-10-4._1y5fzv3-3-10-4 {
+._ytdpsw0-3-11-1 ._14sp6az6-3-11-1._1y5fzv3-3-11-1,
+          ._2twyod0-3-11-1._1y5fzv3-3-11-1 {
   border-bottom-width: 0;
 }
-._1y5fzv6-3-10-4 {
+._1y5fzv6-3-11-1 {
   visibility: hidden;
 }
-._1y5fzv8-3-10-4:not(._15silbj3-3-10-4, ._15silbj4-3-10-4, ._15silbj0-3-10-4:hover) {
+._1y5fzv8-3-11-1:not(._15silbj3-3-11-1, ._15silbj4-3-11-1, ._15silbj0-3-11-1:hover) {
   background-color: var(--dt-colors-background-surface-default, #fff);
 }
-._1y5fzv9-3-10-4:not(._15silbj3-3-10-4, ._15silbj4-3-10-4, ._15silbj0-3-10-4:hover) {
+._1y5fzv9-3-11-1:not(._15silbj3-3-11-1, ._15silbj4-3-11-1, ._15silbj0-3-11-1:hover) {
   background-color: var(--dt-colors-background-container-neutral-subdued, #f9f9fa);
 }

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

@@ -34,9 +34,6 @@ function DataTableRow(props) {
   const subRowIndicatorColumnId = hasSubRows ? table.getSubRowIndicatorColumnId() : null;
   const subRowDepth = hasSubRows ? props.row.getSubRowDepth() : 0;
   const thresholdPill = props.row.getThresholdPill();
-  const floatingMenuState = table.atoms.floatingMenuInfo?.get();
-  const floatingMenuInfoRowId = floatingMenuState?.rowId;
-  const floatingMenuInfoColumnId = floatingMenuState?.columnId;
   const scrollToIndex = scrollToIndexProp ?? (() => void 0);
   const { rowInteractivityClassName, rowInteractivityProps } = useRowInteractivityProps(props.row, scrollToIndex);
   const rowLink = props.row.getLinkForRow();
@@ -139,26 +136,32 @@ function DataTableRow(props) {
             const virtualCellIndex = virtualCell.index;
             const cell = visibleCells[virtualCellIndex];
             const column = cell.column;
-            const hasActiveFloatingMenu = floatingMenuInfoRowId === props.row.id && floatingMenuInfoColumnId === column.id;
             return /* @__PURE__ */ jsx(
               SubRowCellContextProvider,
               {
                 isSubRowIndicatorColumn: hasSubRows && subRowIndicatorColumnId === column.id,
                 cell,
                 children: /* @__PURE__ */ jsx(
-                  DataTableCell,
+                  table.Subscribe,
                   {
-                    cell,
-                    virtualColumnIndex: virtualCellIndex,
-                    virtualRowIndex,
-                    isInDragOverlay,
-                    hasActiveFloatingMenu,
-                    columnMeasure,
-                    dragAndDropRef: setNodeRef,
-                    subRowDepth,
-                    thresholdPill,
-                    rowData: props.row.original,
-                    cellDeps: column.columnDef?.meta?.cellDeps?.(cell).toString()
+                    source: table.atoms.floatingMenuInfo,
+                    selector: (floatingMenuInfo) => floatingMenuInfo?.rowId === props.row.id && floatingMenuInfo?.columnId === column.id,
+                    children: (hasActiveFloatingMenu) => /* @__PURE__ */ jsx(
+                      DataTableCell,
+                      {
+                        cell,
+                        virtualColumnIndex: virtualCellIndex,
+                        virtualRowIndex,
+                        isInDragOverlay,
+                        hasActiveFloatingMenu,
+                        columnMeasure,
+                        dragAndDropRef: setNodeRef,
+                        subRowDepth,
+                        thresholdPill,
+                        rowData: props.row.original,
+                        cellDeps: column.columnDef?.meta?.cellDeps?.(cell).toString()
+                      }
+                    )
                   }
                 )
               },

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/tables/DataTable/components/DataTableRow.tsx"],
-  "sourcesContent": ["import { useSortable } from '@dnd-kit/sortable';\nimport type { Row, RowData, TableFeatures } from '@tanstack/react-table';\nimport type { ScrollToOptions, VirtualItem } from '@tanstack/react-virtual';\nimport clsx from 'clsx';\nimport { type KeyboardEvent, type PointerEvent, type JSX, useRef } from 'react';\n\nimport { StylingProps } from '../../../core/types/styling-props.js';\nimport { isTargetInteractive } from '../../utils/is-target-interactive.js';\nimport {\n  DataTableRowContextProvider,\n  useDataTable,\n} from '../contexts/DataTableContext.js';\nimport * as tableStyles from '../DataTable.sty.js';\nimport { DataTablePinningShadowCells } from './ColumnPinning/DataTablePinningShadowCells.js';\nimport { DataTableCell } from './DataTableCell.js';\nimport * as styles from './DataTableRow.sty.js';\nimport { rowDetailsExpandedRowCell } from '../features/RowDetails/RowDetails.sty.js';\nimport { useRowInteractivityProps } from '../features/RowInteractivity/hooks/useRowInteractivityProps.js';\nimport { SubRowCellContextProvider } from '../features/SubRows/components/SubRowCellContext.js';\n\n/** Duration (ms) for long press on touch devices. */\nconst ROW_LONG_PRESS_TIMEOUT_DURATION = 500;\n\ninterface DataTableRowProps extends StylingProps {\n  /**\n   * DataTable row object.\n   */\n  row: Row<TableFeatures, RowData>;\n  /**\n   * The virtual item in the row virtualizer.\n   */\n  virtualRow: VirtualItem;\n  /**\n   * The index of the row in the virtual items array, representing the currently rendered rows.\n   */\n  virtualItemIndex: number;\n  /**\n   * Total number of rows currently rendered in the table.\n   */\n  rowCount: number;\n  /**\n   * The virtual items in the column virtualizer.\n   */\n  virtualColumns: VirtualItem[];\n  /**\n   * Whether the row is currently being reordered via drag and drop.\n   * The dragged row is the original row that is rendered in the table.\n   */\n  isDraggedRow: boolean;\n  /**\n   * Whether the row is currently in the drag overlay.\n   * The row that is in the overlay is a copy of the row being dragged.\n   */\n  isInDragOverlay: boolean;\n  /**\n   * Parity of the row to keep track of the zebra stripe patterns.\n   */\n  rowParity?: 'even' | 'odd';\n  /**\n   * Measure function for row sizing that is called when the row is rendered to the dom.\n   */\n  rowMeasure?: (node: Element | null) => void;\n  /**\n   * Measure function for column sizing that is called when the column cells are rendered to the dom.\n   */\n  columnMeasure?: (node: Element | null) => void;\n  /**\n   * rowVirtualizer function for scrolling to the row with the specified index.\n   */\n  scrollToIndex?: (index: number, options?: ScrollToOptions) => void;\n}\n\n/**\n * Wrapper around all cells in a props.row.\n * @internal\n */\nexport function DataTableRow(props: Readonly<DataTableRowProps>): JSX.Element {\n  const {\n    virtualRow,\n    rowCount,\n    virtualColumns,\n    isDraggedRow,\n    isInDragOverlay,\n    virtualItemIndex,\n    rowParity,\n    rowMeasure,\n    columnMeasure,\n    scrollToIndex: scrollToIndexProp,\n  } = props;\n\n  const table = useDataTable();\n  const virtualRowIndex = virtualRow.index;\n  const hasSubRows = table.options.enableExpanding === true;\n  const subRowIndicatorColumnId = hasSubRows\n    ? table.getSubRowIndicatorColumnId()\n    : null;\n  const subRowDepth = hasSubRows ? props.row.getSubRowDepth() : 0;\n  const thresholdPill = props.row.getThresholdPill();\n\n  const floatingMenuState = table.atoms.floatingMenuInfo?.get();\n  const floatingMenuInfoRowId = floatingMenuState?.rowId;\n  const floatingMenuInfoColumnId = floatingMenuState?.columnId;\n\n  const scrollToIndex = scrollToIndexProp ?? (() => undefined);\n  const { rowInteractivityClassName, rowInteractivityProps } =\n    useRowInteractivityProps(props.row, scrollToIndex);\n\n  const rowLink = props.row.getLinkForRow();\n  const rowLinkRef = useRef<HTMLAnchorElement>(null);\n\n  const { setNodeRef } = useSortable({\n    id: props.row.id,\n    data: {\n      row: props.row,\n      rowIndex: virtualRowIndex,\n      virtualRow,\n    },\n  });\n\n  const isLongPress = useRef(false);\n  // after some researching it looks like the average duration for recognizing long press is ~400-500ms\n  // however, this may differ depending on the device\n  // Sources:\n  // - https://developer.apple.com/documentation/uikit/uilongpressgesturerecognizer/minimumpressduration\n  // - https://android.googlesource.com/platform/frameworks/base/+/master/core/java/android/view/ViewConfiguration.java\n  const longPressTimeout = useRef<NodeJS.Timeout | null>(null);\n\n  const handleOpenRowLinkOnEnter = (event: KeyboardEvent): void => {\n    if (!rowLink) {\n      return;\n    }\n\n    const isRowEnter =\n      (event.target as HTMLElement).getAttribute('role') === 'row' &&\n      event.key === 'Enter';\n\n    if (isRowEnter) {\n      rowLinkRef.current?.click();\n    }\n  };\n\n  const handleClickOnRowLink = (event: PointerEvent<HTMLElement>): void => {\n    const { target } = event;\n\n    // early exit if a cell actions menu was opened on long press or right-click,\n    // or if the target is not a valid element\n    if (\n      isLongPress.current ||\n      (!(target instanceof HTMLElement) && !(target instanceof SVGElement))\n    ) {\n      return;\n    }\n\n    const row = target.closest('[role=\"row\"]');\n    // early exit if an element outside or an interactive element inside the row was clicked\n    if (row === null || isTargetInteractive(row, target)) {\n      return;\n    }\n\n    const nativeEvent = event.nativeEvent;\n    const newEvent = new MouseEvent('click', {\n      ...event.nativeEvent,\n      // For some reason the Ctrl and Meta key as well as the button key have to be manually set,\n      // even though the native event already contains the correct values\n      ctrlKey: nativeEvent.ctrlKey === true,\n      metaKey: nativeEvent.metaKey === true,\n      button: nativeEvent.button,\n    });\n\n    // Dispatching a synthetic event allows to open the link in a new tab in the background\n    // when clicking on an cell for which cell actions are defined, for instance.\n    rowLinkRef.current?.dispatchEvent(newEvent);\n  };\n\n  // get the last left pinned and first right pinned column to be able to display a shadow to indicate overflow\n  const leftPinnedColumns = table.getLeftVisibleLeafColumns();\n  const lastLeftPinnedColumn = leftPinnedColumns.at(-1);\n  const lastLeftPinnedVirtualColumnIndex = leftPinnedColumns.length - 1;\n  const rightPinnedColumns = table.getRightVisibleLeafColumns();\n  const firstRightPinnedColumn = rightPinnedColumns.at(0);\n  const firstRightPinnedVirtualColumnIndex =\n    virtualColumns[virtualColumns.length - rightPinnedColumns.length]?.index;\n\n  const gridRowPosition = props.row.getGridRowPosition(virtualItemIndex);\n  const visibleCells = props.row.getVisibleCells();\n\n  let linkHandlingEvents = {};\n  if (rowLink) {\n    linkHandlingEvents = {\n      onPointerUp: handleClickOnRowLink,\n      onKeyUp: handleOpenRowLinkOnEnter,\n    };\n  }\n\n  return (\n    <>\n      <div\n        role=\"row\"\n        ref={rowMeasure}\n        data-rowid={props.row.id}\n        data-row={virtualRowIndex}\n        className={clsx(\n          styles.row({\n            rowSeparation: table.atoms.visualVariantConfig?.get().rowSeparation,\n            rowParity,\n            isDraggedRow,\n          }),\n          {\n            [tableStyles.firstBodyRow]: virtualRowIndex === 0,\n            [tableStyles.lastBodyRow]: virtualRowIndex === rowCount - 1,\n            [`${rowDetailsExpandedRowCell}`]: props.row.getIsDetailsOpen(),\n            [rowInteractivityClassName]: !isInDragOverlay,\n          },\n        )}\n        style={{\n          ...gridRowPosition,\n        }}\n        onTouchStart={() => {\n          // we need to set this timeout to detect if the user performed a long press on the row\n          longPressTimeout.current = setTimeout(() => {\n            isLongPress.current = true;\n          }, ROW_LONG_PRESS_TIMEOUT_DURATION);\n        }}\n        onTouchEnd={() => {\n          // clear the long press timer on touch release\n          if (longPressTimeout.current !== null) {\n            clearTimeout(longPressTimeout.current);\n          }\n          isLongPress.current = false;\n        }}\n        // DEPRECATION: [APPDEV-15075] BREAKING-CHANGE: Remove rowInteractivity link\n        {...(!isInDragOverlay && {\n          ...rowInteractivityProps,\n          ...linkHandlingEvents,\n        })}\n      >\n        <DataTableRowContextProvider value={props.row}>\n          {virtualColumns.map((virtualCell) => {\n            const virtualCellIndex = virtualCell.index;\n            const cell = visibleCells[virtualCellIndex];\n            const column = cell.column;\n            const hasActiveFloatingMenu =\n              floatingMenuInfoRowId === props.row.id &&\n              floatingMenuInfoColumnId === column.id;\n\n            return (\n              <SubRowCellContextProvider\n                key={`${virtualRow.key}-${virtualCell.key}`}\n                isSubRowIndicatorColumn={\n                  hasSubRows && subRowIndicatorColumnId === column.id\n                }\n                cell={cell}\n              >\n                <DataTableCell\n                  cell={cell}\n                  virtualColumnIndex={virtualCellIndex}\n                  virtualRowIndex={virtualRowIndex}\n                  isInDragOverlay={isInDragOverlay}\n                  hasActiveFloatingMenu={hasActiveFloatingMenu}\n                  columnMeasure={columnMeasure}\n                  dragAndDropRef={setNodeRef}\n                  subRowDepth={subRowDepth}\n                  thresholdPill={thresholdPill}\n                  rowData={props.row.original}\n                  cellDeps={column.columnDef?.meta?.cellDeps?.(cell).toString()}\n                />\n              </SubRowCellContextProvider>\n            );\n          })}\n        </DataTableRowContextProvider>\n        {rowLink && (\n          // this link element solely holds the link for interactive rows and is not visible to the user\n          // it's not directly clickable; instead, the link is opened by interactions with the row (click, enter)\n          // eslint-disable-next-line jsx-a11y/anchor-has-content\n          <a\n            ref={rowLinkRef}\n            href={rowLink}\n            onPointerDown={(event: PointerEvent) => event.stopPropagation()}\n            style={{ display: 'none' }}\n          />\n        )}\n      </div>\n      {!isDraggedRow && (\n        <DataTablePinningShadowCells\n          lastLeftPinnedColumn={{\n            column: lastLeftPinnedColumn,\n            index: lastLeftPinnedVirtualColumnIndex,\n          }}\n          firstRightPinnedColumn={{\n            column: firstRightPinnedColumn,\n            index: firstRightPinnedVirtualColumnIndex,\n          }}\n          gridRowPosition={gridRowPosition}\n          rowId={props.row.id}\n        />\n      )}\n    </>\n  );\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { useSortable } from '@dnd-kit/sortable';\nimport type { Row, RowData, TableFeatures } from '@tanstack/react-table';\nimport type { ScrollToOptions, VirtualItem } from '@tanstack/react-virtual';\nimport clsx from 'clsx';\nimport { type KeyboardEvent, type PointerEvent, type JSX, useRef } from 'react';\n\nimport { StylingProps } from '../../../core/types/styling-props.js';\nimport { isTargetInteractive } from '../../utils/is-target-interactive.js';\nimport {\n  DataTableRowContextProvider,\n  useDataTable,\n} from '../contexts/DataTableContext.js';\nimport * as tableStyles from '../DataTable.sty.js';\nimport { DataTablePinningShadowCells } from './ColumnPinning/DataTablePinningShadowCells.js';\nimport { DataTableCell } from './DataTableCell.js';\nimport * as styles from './DataTableRow.sty.js';\nimport { rowDetailsExpandedRowCell } from '../features/RowDetails/RowDetails.sty.js';\nimport { useRowInteractivityProps } from '../features/RowInteractivity/hooks/useRowInteractivityProps.js';\nimport { SubRowCellContextProvider } from '../features/SubRows/components/SubRowCellContext.js';\n\n/** Duration (ms) for long press on touch devices. */\nconst ROW_LONG_PRESS_TIMEOUT_DURATION = 500;\n\ninterface DataTableRowProps extends StylingProps {\n  /**\n   * DataTable row object.\n   */\n  row: Row<TableFeatures, RowData>;\n  /**\n   * The virtual item in the row virtualizer.\n   */\n  virtualRow: VirtualItem;\n  /**\n   * The index of the row in the virtual items array, representing the currently rendered rows.\n   */\n  virtualItemIndex: number;\n  /**\n   * Total number of rows currently rendered in the table.\n   */\n  rowCount: number;\n  /**\n   * The virtual items in the column virtualizer.\n   */\n  virtualColumns: VirtualItem[];\n  /**\n   * Whether the row is currently being reordered via drag and drop.\n   * The dragged row is the original row that is rendered in the table.\n   */\n  isDraggedRow: boolean;\n  /**\n   * Whether the row is currently in the drag overlay.\n   * The row that is in the overlay is a copy of the row being dragged.\n   */\n  isInDragOverlay: boolean;\n  /**\n   * Parity of the row to keep track of the zebra stripe patterns.\n   */\n  rowParity?: 'even' | 'odd';\n  /**\n   * Measure function for row sizing that is called when the row is rendered to the dom.\n   */\n  rowMeasure?: (node: Element | null) => void;\n  /**\n   * Measure function for column sizing that is called when the column cells are rendered to the dom.\n   */\n  columnMeasure?: (node: Element | null) => void;\n  /**\n   * rowVirtualizer function for scrolling to the row with the specified index.\n   */\n  scrollToIndex?: (index: number, options?: ScrollToOptions) => void;\n}\n\n/**\n * Wrapper around all cells in a props.row.\n * @internal\n */\nexport function DataTableRow(props: Readonly<DataTableRowProps>): JSX.Element {\n  const {\n    virtualRow,\n    rowCount,\n    virtualColumns,\n    isDraggedRow,\n    isInDragOverlay,\n    virtualItemIndex,\n    rowParity,\n    rowMeasure,\n    columnMeasure,\n    scrollToIndex: scrollToIndexProp,\n  } = props;\n\n  const table = useDataTable();\n  const virtualRowIndex = virtualRow.index;\n  const hasSubRows = table.options.enableExpanding === true;\n  const subRowIndicatorColumnId = hasSubRows\n    ? table.getSubRowIndicatorColumnId()\n    : null;\n  const subRowDepth = hasSubRows ? props.row.getSubRowDepth() : 0;\n  const thresholdPill = props.row.getThresholdPill();\n\n  const scrollToIndex = scrollToIndexProp ?? (() => undefined);\n  const { rowInteractivityClassName, rowInteractivityProps } =\n    useRowInteractivityProps(props.row, scrollToIndex);\n\n  const rowLink = props.row.getLinkForRow();\n  const rowLinkRef = useRef<HTMLAnchorElement>(null);\n\n  const { setNodeRef } = useSortable({\n    id: props.row.id,\n    data: {\n      row: props.row,\n      rowIndex: virtualRowIndex,\n      virtualRow,\n    },\n  });\n\n  const isLongPress = useRef(false);\n  // after some researching it looks like the average duration for recognizing long press is ~400-500ms\n  // however, this may differ depending on the device\n  // Sources:\n  // - https://developer.apple.com/documentation/uikit/uilongpressgesturerecognizer/minimumpressduration\n  // - https://android.googlesource.com/platform/frameworks/base/+/master/core/java/android/view/ViewConfiguration.java\n  const longPressTimeout = useRef<NodeJS.Timeout | null>(null);\n\n  const handleOpenRowLinkOnEnter = (event: KeyboardEvent): void => {\n    if (!rowLink) {\n      return;\n    }\n\n    const isRowEnter =\n      (event.target as HTMLElement).getAttribute('role') === 'row' &&\n      event.key === 'Enter';\n\n    if (isRowEnter) {\n      rowLinkRef.current?.click();\n    }\n  };\n\n  const handleClickOnRowLink = (event: PointerEvent<HTMLElement>): void => {\n    const { target } = event;\n\n    // early exit if a cell actions menu was opened on long press or right-click,\n    // or if the target is not a valid element\n    if (\n      isLongPress.current ||\n      (!(target instanceof HTMLElement) && !(target instanceof SVGElement))\n    ) {\n      return;\n    }\n\n    const row = target.closest('[role=\"row\"]');\n    // early exit if an element outside or an interactive element inside the row was clicked\n    if (row === null || isTargetInteractive(row, target)) {\n      return;\n    }\n\n    const nativeEvent = event.nativeEvent;\n    const newEvent = new MouseEvent('click', {\n      ...event.nativeEvent,\n      // For some reason the Ctrl and Meta key as well as the button key have to be manually set,\n      // even though the native event already contains the correct values\n      ctrlKey: nativeEvent.ctrlKey === true,\n      metaKey: nativeEvent.metaKey === true,\n      button: nativeEvent.button,\n    });\n\n    // Dispatching a synthetic event allows to open the link in a new tab in the background\n    // when clicking on an cell for which cell actions are defined, for instance.\n    rowLinkRef.current?.dispatchEvent(newEvent);\n  };\n\n  // get the last left pinned and first right pinned column to be able to display a shadow to indicate overflow\n  const leftPinnedColumns = table.getLeftVisibleLeafColumns();\n  const lastLeftPinnedColumn = leftPinnedColumns.at(-1);\n  const lastLeftPinnedVirtualColumnIndex = leftPinnedColumns.length - 1;\n  const rightPinnedColumns = table.getRightVisibleLeafColumns();\n  const firstRightPinnedColumn = rightPinnedColumns.at(0);\n  const firstRightPinnedVirtualColumnIndex =\n    virtualColumns[virtualColumns.length - rightPinnedColumns.length]?.index;\n\n  const gridRowPosition = props.row.getGridRowPosition(virtualItemIndex);\n  const visibleCells = props.row.getVisibleCells();\n\n  let linkHandlingEvents = {};\n  if (rowLink) {\n    linkHandlingEvents = {\n      onPointerUp: handleClickOnRowLink,\n      onKeyUp: handleOpenRowLinkOnEnter,\n    };\n  }\n\n  return (\n    <>\n      <div\n        role=\"row\"\n        ref={rowMeasure}\n        data-rowid={props.row.id}\n        data-row={virtualRowIndex}\n        className={clsx(\n          styles.row({\n            rowSeparation: table.atoms.visualVariantConfig?.get().rowSeparation,\n            rowParity,\n            isDraggedRow,\n          }),\n          {\n            [tableStyles.firstBodyRow]: virtualRowIndex === 0,\n            [tableStyles.lastBodyRow]: virtualRowIndex === rowCount - 1,\n            [`${rowDetailsExpandedRowCell}`]: props.row.getIsDetailsOpen(),\n            [rowInteractivityClassName]: !isInDragOverlay,\n          },\n        )}\n        style={{\n          ...gridRowPosition,\n        }}\n        onTouchStart={() => {\n          // we need to set this timeout to detect if the user performed a long press on the row\n          longPressTimeout.current = setTimeout(() => {\n            isLongPress.current = true;\n          }, ROW_LONG_PRESS_TIMEOUT_DURATION);\n        }}\n        onTouchEnd={() => {\n          // clear the long press timer on touch release\n          if (longPressTimeout.current !== null) {\n            clearTimeout(longPressTimeout.current);\n          }\n          isLongPress.current = false;\n        }}\n        // DEPRECATION: [APPDEV-15075] BREAKING-CHANGE: Remove rowInteractivity link\n        {...(!isInDragOverlay && {\n          ...rowInteractivityProps,\n          ...linkHandlingEvents,\n        })}\n      >\n        <DataTableRowContextProvider value={props.row}>\n          {virtualColumns.map((virtualCell) => {\n            const virtualCellIndex = virtualCell.index;\n            const cell = visibleCells[virtualCellIndex];\n            const column = cell.column;\n\n            return (\n              <SubRowCellContextProvider\n                key={`${virtualRow.key}-${virtualCell.key}`}\n                isSubRowIndicatorColumn={\n                  hasSubRows && subRowIndicatorColumnId === column.id\n                }\n                cell={cell}\n              >\n                {/* Subscribe per cell so opening a context menu only re-renders\n                    the affected cell, not the whole row. */}\n                <table.Subscribe\n                  source={table.atoms.floatingMenuInfo}\n                  selector={(floatingMenuInfo) =>\n                    floatingMenuInfo?.rowId === props.row.id &&\n                    floatingMenuInfo?.columnId === column.id\n                  }\n                >\n                  {(hasActiveFloatingMenu) => (\n                    <DataTableCell\n                      cell={cell}\n                      virtualColumnIndex={virtualCellIndex}\n                      virtualRowIndex={virtualRowIndex}\n                      isInDragOverlay={isInDragOverlay}\n                      hasActiveFloatingMenu={hasActiveFloatingMenu}\n                      columnMeasure={columnMeasure}\n                      dragAndDropRef={setNodeRef}\n                      subRowDepth={subRowDepth}\n                      thresholdPill={thresholdPill}\n                      rowData={props.row.original}\n                      cellDeps={column.columnDef?.meta\n                        ?.cellDeps?.(cell)\n                        .toString()}\n                    />\n                  )}\n                </table.Subscribe>\n              </SubRowCellContextProvider>\n            );\n          })}\n        </DataTableRowContextProvider>\n        {rowLink && (\n          // this link element solely holds the link for interactive rows and is not visible to the user\n          // it's not directly clickable; instead, the link is opened by interactions with the row (click, enter)\n          // eslint-disable-next-line jsx-a11y/anchor-has-content\n          <a\n            ref={rowLinkRef}\n            href={rowLink}\n            onPointerDown={(event: PointerEvent) => event.stopPropagation()}\n            style={{ display: 'none' }}\n          />\n        )}\n      </div>\n      {!isDraggedRow && (\n        <DataTablePinningShadowCells\n          lastLeftPinnedColumn={{\n            column: lastLeftPinnedColumn,\n            index: lastLeftPinnedVirtualColumnIndex,\n          }}\n          firstRightPinnedColumn={{\n            column: firstRightPinnedColumn,\n            index: firstRightPinnedVirtualColumnIndex,\n          }}\n          gridRowPosition={gridRowPosition}\n          rowId={props.row.id}\n        />\n      )}\n    </>\n  );\n}\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -6,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-10-4", variantClassNames: { rowSeparation: { none: "_1y5fzv1-3-10-4", horizontalDividers: "_1y5fzv2-3-10-4", zebraStripes: "_1y5fzv3-3-10-4" }, rowParity: { even: "_1y5fzv4-3-10-4", odd: "_1y5fzv5-3-10-4" }, isDraggedRow: { true: "_1y5fzv6-3-10-4", false: "_1y5fzv7-3-10-4" } }, defaultVariants: {}, compoundVariants: [[{ rowSeparation: "zebraStripes", rowParity: "even" }, "_1y5fzv8-3-10-4"], [{ rowSeparation: "zebraStripes", rowParity: "odd" }, "_1y5fzv9-3-10-4"]] });
+var row = _7a468({ defaultClassName: "_1y5fzv0-3-11-1", variantClassNames: { rowSeparation: { none: "_1y5fzv1-3-11-1", horizontalDividers: "_1y5fzv2-3-11-1", zebraStripes: "_1y5fzv3-3-11-1" }, rowParity: { even: "_1y5fzv4-3-11-1", odd: "_1y5fzv5-3-11-1" }, isDraggedRow: { true: "_1y5fzv6-3-11-1", false: "_1y5fzv7-3-11-1" } }, defaultVariants: {}, compoundVariants: [[{ rowSeparation: "zebraStripes", rowParity: "even" }, "_1y5fzv8-3-11-1"], [{ rowSeparation: "zebraStripes", rowParity: "odd" }, "_1y5fzv9-3-11-1"]] });
 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 '../../../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-10-4',variantClassNames:{rowSeparation:{none:'_1y5fzv1-3-10-4',horizontalDividers:'_1y5fzv2-3-10-4',zebraStripes:'_1y5fzv3-3-10-4'},rowParity:{even:'_1y5fzv4-3-10-4',odd:'_1y5fzv5-3-10-4'},isDraggedRow:{true:'_1y5fzv6-3-10-4',false:'_1y5fzv7-3-10-4'}},defaultVariants:{},compoundVariants:[[{rowSeparation:'zebraStripes',rowParity:'even'},'_1y5fzv8-3-10-4'],[{rowSeparation:'zebraStripes',rowParity:'odd'},'_1y5fzv9-3-10-4']]});"],
+  "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-11-1',variantClassNames:{rowSeparation:{none:'_1y5fzv1-3-11-1',horizontalDividers:'_1y5fzv2-3-11-1',zebraStripes:'_1y5fzv3-3-11-1'},rowParity:{even:'_1y5fzv4-3-11-1',odd:'_1y5fzv5-3-11-1'},isDraggedRow:{true:'_1y5fzv6-3-11-1',false:'_1y5fzv7-3-11-1'}},defaultVariants:{},compoundVariants:[[{rowSeparation:'zebraStripes',rowParity:'even'},'_1y5fzv8-3-11-1'],[{rowSeparation:'zebraStripes',rowParity:'odd'},'_1y5fzv9-3-11-1']]});"],
   "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,mBAAkB,mBAAkB,EAAC,eAAc,EAAC,MAAK,mBAAkB,oBAAmB,mBAAkB,cAAa,kBAAiB,GAAE,WAAU,EAAC,MAAK,mBAAkB,KAAI,kBAAiB,GAAE,cAAa,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,eAAc,gBAAe,WAAU,OAAM,GAAE,iBAAiB,GAAE,CAAC,EAAC,eAAc,gBAAe,WAAU,MAAK,GAAE,iBAAiB,CAAC,EAAC,CAAC;",
   "names": []
 }