Introducing Slots (new feature)
summary
Slots replace pseudo-slot utilities with real editable areas so designers can duplicate, reorder, and add items directly — checkbox groups shed hidden layers and files shrink. Components like row, button, card and action list shift from many props to composable areas, with trade-offs: decide which visuals are preferred values, when to supply default slot content is per-variant, and how deep nesting maps to code. Examples and copyable ready-made assets increase, a reset slot button helps recover mistakes, and systems move from rigid variants toward flexible composition.
AI-written summary · about
chapters (12)
- 0:00Welcome
- 1:30Slots replace pseudo-slot utilities
- 2:51Checkbox group with slots
- 3:54Design principles for slots
- 5:42Balancing props and slots
- 7:10Button composability with slots
- 9:19Card component complexity
- 11:45Slot composition examples
- 13:51Action list nesting
- 16:15Slot consistency
- 17:19Nested layouts
- 19:04Future of layout systems
related talks
22mArchitecting Subcomponents
23m6 Levels of Vue Component Reusability
32mIntroduction to Design Systems
44mWriting good components
39mRe-Compose your UI: building an atomic design library
32mA New Model for Form Components
22mSay Hello to Box, Flex and Stack: Layouts in the Component Era
24mSid Kshetrapal-Walking the line between Flexibility and Consistency in Component libraries