UNPKG

@atlaskit/dynamic-table

Version:

A dynamic table displays rows of data with built-in pagination, sorting, and re-ordering functionality.

60 lines (58 loc) 2.06 kB
/* head-cell.tsx generated by @compiled/babel-plugin v3.0.2 */ import _extends from "@babel/runtime/helpers/extends"; import "./head-cell.compiled.css"; import * as React from 'react'; import { ax, ix } from "@compiled/react/runtime"; /* eslint-disable @repo/internal/react/require-jsdoc */ import { forwardRef } from 'react'; import { getTruncationStyleVars } from './constants'; const CSS_VAR_TEXT_COLOR = '--local-dynamic-table-text-color'; const overflowTruncateStyles = null; const truncationWidthStyles = null; const fixedSizeTruncateStyles = null; const cellStyles = null; const headCellBaseStyles = null; export const HeadCell = /*#__PURE__*/forwardRef(({ width, children, isSortable, sortOrder, isFixedSize, shouldTruncate, onClick, style, testId, ...rest }, ref) => { const mergedStyles = { ...style, ...(width && getTruncationStyleVars({ width })), [CSS_VAR_TEXT_COLOR]: "var(--ds-text-subtlest, #6B6E76)" }; const isASC = sortOrder === 'ASC'; const isDESC = sortOrder === 'DESC'; const getFormattedSortOrder = () => { if (isASC) { return 'ascending'; } else if (isDESC) { return 'descending'; } return; }; // If there is no content in the cell, it should be rendered as an empty `td`, not a `th`. // https://dequeuniversity.com/rules/axe/4.7/empty-table-header const Component = children ? 'th' : 'td'; return /*#__PURE__*/React.createElement(Component, _extends({ "aria-sort": getFormattedSortOrder() // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766 , style: mergedStyles, onClick: undefined, ref: ref, "data-testid": testId }, rest, { className: ax(["_izbqglyw _h7alglyw _85i51b66 _1q511b66 _y4tiu2gc _bozgu2gc _y3gn1e5h _1s37ze3t _uupyze3t", "_11c8wadc _179r1uh4 _mqm2glyw _kqswh2mm _syazazsu _k48pwu06 _y3gn1e5h _s7n4nkob _1ygbd0i9", "_1bsb8a2a", isFixedSize && shouldTruncate && "_1bto1l2s _o5721q9c", isFixedSize && "_1reo15vq _18m915vq"]) }), children); });