When we decide what qualifies as a component in a component library or design system, we aim for a separation of concerns: we decouple something that creates whitespace from something that creates frames from something that styles type so that each can be reused in different contexts. Consider a Card component with a title and optional description: Card title {description && {description} From the component library design point of view, this makes sense: Card is responsible for visually framing the component.
Design system components with a strict separation of concerns can easily break this#fn:whyfragments: Out of the top 100 most visited websites, https://meiert.com/en/blog/valid-html-2022/.
Enhancing the behaviour of child nodes: If a component is responsible purely for attaching attributes to its child node, why introduce a wrapper?