• /
  • Log in

TableRowCell

Wraps the content of a table cell located in the body of the table. This component is only expected to be used as a children of <TableRow>. Cells take care automatically of ellipsifying the content that does not fit and vertically centering it.

This component is the base cell. For common cases, the SDK also provides a set of additional cells so that they always painted consistently across the UI (e.g. entity name with a status, or a user).

Usage

import { TableRowCell } from 'nr1'

Examples

Props

alignmentTypeenum
DEFAULT
TableRowCell.ALIGNMENT_TYPE.LEFT

Defines the text alignment inside the cell.

<One of
TableRowCell.ALIGNMENT_TYPE.CENTER,
TableRowCell.ALIGNMENT_TYPE.LEFT,
TableRowCell.ALIGNMENT_TYPE.RIGHT,
>
childrennode
DEFAULT
null

Contents of the table cell.

classNamestring

Appends class names to the component.

Should be used only for positioning and spacing purposes.

ellipsisTypeenum
DEFAULT
TableRowCell.ELLIPSIS_TYPE.RIGHT

Defines how values are ellipsified within the cells; i.e. where the ellipsis is placed:

  • RIGHT: at the end of the text, preserving its beginning.
  • LEFT: at the beginning of the text, preserving its end.
<One of
TableRowCell.ELLIPSIS_TYPE.LEFT,
TableRowCell.ELLIPSIS_TYPE.RIGHT,
>
onClickfunction

Callback fired any time the user clicks on the table cell.

function (
event: React.MouseEvent
)
styleobject

Inline style for custom styling.

Should be used only for positioning and spacing purposes.

testIdstring

Adds a data-test-id attribute.

Use it to target the component in unit and e2e tests.

toshape|string

Location object or url string to link to.

Linked TableRowCells are unstyled and will not show icons for external links. If the same styling as the Link component is what is desired, then use a Link instead as a child component within the cell.

shape

pathnamerequiredstring
searchstring
hashstring
Create issueEdit page
Copyright © 2021 New Relic Inc.