Skip to content

docs(ui5-li): clarify usage and limitations of default slot #11492

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

docs(ui5-li): clarify usage and limitations of default slot #11492

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 6 additions & 4 deletions packages/main/src/ListItemStandard.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,11 +42,13 @@ type ExpandableTextTemplate = (this: ListItemStandard, params: ExpandableTextTem
* @csspart delete-button - Used to style the button rendered when the list item is in delete mode
* @csspart radio - Used to style the radio button rendered when the list item is in single selection mode
* @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode
* @slot {Node[]} default - Defines the text of the component.
* @slot {Node[]} default - Defines the custom formatted text of the component.
*
* **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design. <br/>
* **Note:** Deprecated since version `2.10.0`. Use the `text` property instead. <br/>
* Only use the default slot if you need to apply custom text formatting with HTML elements (like `<b>`, `<i>`, etc.).
* **Note:** Strongly recommended to use the `text` property for optimal wrapping and consistent layout. <br/>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @kgogov
slight changes in wording for more polished version, suggested by editing tools : D

Note: For optimal text wrapping and a consistent layout, it is strongly recommended to use the text property.

Use the default slot only when custom formatting with HTML elements (e.g., <b>, <i>) is required.
Be aware that wrapping (via wrappingType="Normal") may not function correctly with custom HTML content in the default slot.

* Use the `default` slot **only** when you need to apply custom formatting using HTML elements (e.g. `<b>`, `<i>`, etc.).
* Keep in mind that when using custom formatted content via the `default` slot, the wrapping functionality (enabled via `wrappingType="Normal"`) may not work as expected.
*
* If both `text` and `default` slot are used, the `text` property takes precedence.
* @constructor
* @extends ListItem
* @public
Expand Down
Loading