@grafana/ui/dist/cjs/components/Table/TableRT/HeaderRow.cjs.map

Grafana Components Library

{"version":3,"file":"HeaderRow.cjs","sources":["../../../../../src/components/Table/TableRT/HeaderRow.tsx"],"sourcesContent":["import { type HeaderGroup, type Column } from 'react-table';\n\nimport { type Field } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { t, type TFunction } from '@grafana/i18n';\n\nimport { getFieldTypeIcon } from '../../../types/icon';\nimport { Icon } from '../../Icon/Icon';\nimport { type TableFieldOptions } from '../types';\n\nimport { Filter } from './Filter';\nimport { type TableStyles } from './styles';\n\nexport interface HeaderRowProps {\n  headerGroups: HeaderGroup[];\n  showTypeIcons?: boolean;\n  tableStyles: TableStyles;\n}\n\nexport const HeaderRow = (props: HeaderRowProps) => {\n  const { headerGroups, showTypeIcons, tableStyles } = props;\n  const e2eSelectorsTable = selectors.components.Panels.Visualization.Table;\n\n  return (\n    <div role=\"rowgroup\" className={tableStyles.headerRow}>\n      {headerGroups.map((headerGroup: HeaderGroup) => {\n        const { key, ...headerGroupProps } = headerGroup.getHeaderGroupProps();\n        return (\n          <div\n            className={tableStyles.thead}\n            {...headerGroupProps}\n            key={key}\n            aria-label={e2eSelectorsTable.header}\n            role=\"row\"\n          >\n            {headerGroup.headers.map((column: Column, index: number) =>\n              renderHeaderCell(column, tableStyles, showTypeIcons)\n            )}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n\nfunction renderHeaderCell(column: any, tableStyles: TableStyles, showTypeIcons?: boolean) {\n  const { key, ...headerProps } = column.getHeaderProps();\n  const field: Field = column.field ?? null;\n  const tableFieldOptions: TableFieldOptions | undefined = field?.config.custom;\n\n  if (column.canResize) {\n    headerProps.style.userSelect = column.isResizing ? 'none' : 'auto'; // disables selecting text while resizing\n  }\n\n  headerProps.style.position = 'absolute';\n  headerProps.style.justifyContent = column.justifyContent;\n  headerProps.style.left = column.totalLeft;\n\n  let headerContent = column.render('Header');\n\n  const ariaLabel =\n    typeof headerContent === 'string'\n      ? getAriaLabel(headerContent, column.isSortedDesc, column.isSorted, t)\n      : t('grafana-ui.table.sort-column', 'Sort column');\n\n  let sortHeaderContent = column.canSort && (\n    <>\n      <button {...column.getSortByToggleProps()} className={tableStyles.headerCellLabel} aria-label={ariaLabel}>\n        {showTypeIcons && (\n          <Icon name={getFieldTypeIcon(field)} title={field?.type} size=\"sm\" className={tableStyles.typeIcon} />\n        )}\n        <div>{headerContent}</div>\n        {column.isSorted &&\n          (column.isSortedDesc ? (\n            <Icon size=\"lg\" name=\"arrow-down\" className={tableStyles.sortIcon} />\n          ) : (\n            <Icon name=\"arrow-up\" size=\"lg\" className={tableStyles.sortIcon} />\n          ))}\n      </button>\n      {column.canFilter && <Filter column={column} tableStyles={tableStyles} field={field} />}\n    </>\n  );\n  if (sortHeaderContent && tableFieldOptions?.headerComponent) {\n    sortHeaderContent = <tableFieldOptions.headerComponent field={field} defaultContent={sortHeaderContent} />;\n  } else if (tableFieldOptions?.headerComponent) {\n    headerContent = <tableFieldOptions.headerComponent field={field} defaultContent={headerContent} />;\n  }\n\n  return (\n    <div className={tableStyles.headerCell} key={key} {...headerProps} role=\"columnheader\">\n      {column.canSort && sortHeaderContent}\n      {!column.canSort && headerContent}\n      {!column.canSort && column.canFilter && <Filter column={column} tableStyles={tableStyles} field={field} />}\n      {column.canResize && <div {...column.getResizerProps()} className={tableStyles.resizeHandle} />}\n    </div>\n  );\n}\n\nconst getAriaLabel = (column: string, isDesc: boolean, isSorted: boolean, t: TFunction) => {\n  const unsortedLabel = t('grafana-ui.table.sort-by-column', 'Sort by column {{column}}', { column });\n  return isSorted\n    ? isDesc\n      ? t('grafana-ui.table.sort-by-column-descending', 'Sort by column {{column}}, descending', { column })\n      : t('grafana-ui.table.sort-by-column-ascending', 'Sort by column {{column}}, ascending', { column })\n    : unsortedLabel;\n};\n"],"names":["selectors","jsx","createElement","t","jsxs","Fragment","Icon","getFieldTypeIcon","Filter"],"mappings":"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"}