PatternFly

Truncate

A truncate is a tool used to shorten numeric and non-numeric character strings, typically when the string overflows its container.

Examples

Default

Vestibulum interdum risus et enim faucibus, sit amet molestie est accumsan.

Middle

redhat_logo_black_and_white_reversed_simple_with_fedora_container.zip

Start

Vestibulum interdum risus et enim faucibus, sit amet molestie est accumsan.‎

Default with tooltip at the bottom

Vestibulum interdum risus et enim faucibus, sit amet molestie est accumsan.

Props

Truncate

*required
NameTypeDefaultDescription
contentrequiredstringText to truncate
classNamestringClass to add to outer span
position'start' | 'middle' | 'end''end'Where the text will be truncated
tooltipPosition| TooltipPosition | 'auto' | 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end''top'Tooltip position
trailingNumCharsnumber7The number of characters displayed in the second half of the truncation

View source on GitHub