Feature Request Description
The ExpandableText component’s expanded view uses a ResponsivePopover whose width cannot be constrained, which can lead to overly wide popovers on large screens and negatively affect readability. Additionally, the component does not offer a way to preserve whitespace and newline characters, causing multi-line content (such as descriptions, logs, etc.) to be rendered as a single flow of text.
Proposed Solution
Enhance ExpandableText with:
- Support for limiting the expanded
ResponsivePopover width via a dedicated property (e.g., popoverMaxWidth or maxWidth), accepting CSS size values (e.g., 480px, 40rem).
- A property to preserve whitespace and line breaks (e.g.,
preserveWhitespace: boolean or whiteSpaceMode: "normal" | "pre-wrap"), applying white-space: pre-wrap in the expanded view (and optionally in the collapsed view) so that spaces and newline characters are retained.
Thank you.
Proposed Alternatives
- Use other components (e.g.,
TextArea in read-only mode or a custom ResponsivePopover) to display multi-line content, but this forfeits the built-in truncation/expansion behavior of ExpandableText.
- Attempt styling via global CSS is limited due to Shadow DOM encapsulation and does not reliably control the internal
Text and ResponsivePopover.
Organization
SAP
Additional Context
Environment: UI5 Web Components 2.16.2
Typical use cases include displaying multi-line log entries, formatted descriptions where line breaks and spacing carry meaning. Controlling max width improves readability and prevents the popover from spanning too wide on large viewports.
Priority
Medium
Privacy Policy
Feature Request Description
The
ExpandableTextcomponent’s expanded view uses aResponsivePopoverwhose width cannot be constrained, which can lead to overly wide popovers on large screens and negatively affect readability. Additionally, the component does not offer a way to preserve whitespace and newline characters, causing multi-line content (such as descriptions, logs, etc.) to be rendered as a single flow of text.Proposed Solution
Enhance
ExpandableTextwith:ResponsivePopoverwidth via a dedicated property (e.g.,popoverMaxWidthormaxWidth), accepting CSS size values (e.g.,480px,40rem).preserveWhitespace: booleanorwhiteSpaceMode: "normal" | "pre-wrap"), applyingwhite-space: pre-wrapin the expanded view (and optionally in the collapsed view) so that spaces and newline characters are retained.Thank you.
Proposed Alternatives
TextAreain read-only mode or a customResponsivePopover) to display multi-line content, but this forfeits the built-in truncation/expansion behavior ofExpandableText.TextandResponsivePopover.Organization
SAP
Additional Context
Environment:
UI5 Web Components 2.16.2Typical use cases include displaying multi-line log entries, formatted descriptions where line breaks and spacing carry meaning. Controlling max width improves readability and prevents the popover from spanning too wide on large viewports.
Priority
Medium
Privacy Policy