ExpandableText: allow setting `white-space`
@olannyv is already working on this.
Since Jan 9, 2025.
- Dominant language
- TypeScript
- Stars
- 1.8k
- Forks
- 285
- Avg merge
- 3d 2h
- Merged PRs (30d)
- 59
Description
Feature Request Description
Currently it's not easily possible customizing white-space for the text in the ExpandableText component.
Before the ui5-expandable-text web component was available, we implemented our own React component in UI5 Web Components for React. There we offered a renderWhiteSpace prop, which only set white-space: pre-wrap; when active.
Now we replaced our React only component with the web component and, because of backwards compatibility, we decided to add renderWhiteSpace (i.a.) to our wrapped component. (Storybook)
Since there's no part attribute available and setting it on the ui5-expandable-text element has no effect (because ui5-text sets white-space on its own and therefore it has precedence over the inherited value), we had to rely on addCustomCSS.
But also in general, I think that setting white-space is typical for a text component and therefore should be supported.
Proposed Solution
Imo one of these two solutions would be sufficient, although I'd prefer the first one ;)
- Make the
ui5-textinside the shadow root usewhite-spaceof theui5-expandable-text(if possible) - Offer a part attribute for the
ui5-textelement so it can easily be accessed via CSS
Proposed Alternatives
No response
Organization
UI5WCR
Additional Context
No response
Priority
None
Privacy Policy
- I’m not disclosing any internal or sensitive information.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.