Slots Pattern with Clearly Named Children
Implement slot-like APIs with named props or child parts (Header, Actions, Footer). Provide defaults and keep placement predictable.
Slots overview
Goal: Give users places to insert UI.
- Named props: header, actions, footer
- Child parts: Card.Header, Card.Body, Card.Footer
- Defaults for missing slots
Design rules for slots
- Clear names reflect layout areas
- Predictable placement inside parent
- Fallbacks if a slot is not provided
All lessons in this course
- Parent–Child Coordination via Context
- API Ergonomics with Composition
- Slots Pattern with Clearly Named Children