Positioning elements in the DOM.
|Last Tended||Jul 2021|
The Braid Design System believes that components (such as React components) should not provide surrounding white space. Instead, spacing between elements should be the responsibility of a category of components known as Layout components. Components whose only function is to position their child elements.
A layout component would commonly control:
A simple example would be a layout component would be a <ul> for a list of text items. The styling of the text would be the responsbility of the <li> component. The <ul> could set the direction to go from top-to-bottom & add 16px of space between each list item.
Layout components can also be more complex, such as parent component of a data dashboard.Source