-
Notifications
You must be signed in to change notification settings - Fork 134
Open
Labels
:legendLegend related issueLegend related issue
Description
Summary
When using Legend List layout (the LegendList path renders labels with truncationMode="px"), setting labelOptions.widthLimit is expected to truncate labels with ellipsis at the given pixel width, and to ignore maxLines. However, if labelOptions.maxLines is set to 0 (common way to represent “no line truncation”), labels wrap into multiple lines instead of ellipsizing.
Observed behavior
In List layout, with labelOptions.widthLimit = 250 and labelOptions.maxLines = 0, legend labels render as multi-line wrapped text rather than a single-line ellipsis-truncated label.
There is also a similar issue with labelOptions.maxLines = 2, since it will show multiple lines in the List Layout mode.
Expected behavior
- In List layout / truncationMode="px", widthLimit should drive truncation with ellipsis (single-line behavior), and maxLines should be irrelevant.
- In particular, maxLines = 0 should not cause wrapping when truncationMode="px" (Same for maxLines=2 and ...)
Additional technical details
Technical details / suspected cause
- LegendList renders Label with truncationMode: "px" (dist/components/legend/legend_list.js).
- Label applies clampStyles for px mode (maxWidth/overflow/textOverflow), but the CSS class echLegendItem__label--singleline (which applies white-space: nowrap via euiTextTruncate) is only added when maxLines === 1 (dist/components/legend/label.js).
- If consumers pass maxLines = 0, the label element keeps the base .echLegendItem__label styles which include wrap-enabled rules (overflow-wrap, word-break, hyphens) from the theme (theme.scss wrapText mixin), causing wrapping even though textOverflow: ellipsis is set inline.
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
:legendLegend related issueLegend related issue