Episode

Fluent UI React Insights: APIs in v9. Slots, JSX children & triggers

with Oleksandr Fediashov

Fluent UI Insights is a series that describes the design and decisions behind the Fluent UI design system. In the fourth episode, members of the Fluent UI team explain implementation details and context behind APis in Fluent UI React v9: slots, JSX children and triggers.

Chapters

  • 00:00 - Introduction
  • 00:22 - Intention and motivation for slots
  • 01:53 - Slots v1 in Semantic UI React
  • 03:33 - Slots v2 in Stardust UI React
  • 04:42 - Slots v3 in Fluent UI React v9
  • 06:04 - Component groups: collections and elements
  • 06:50 - Collections API in Semantic UI React
  • 07:45 - JSX children to define components
  • 08:11 - Issues with React Context and useContextSelector
  • 09:03 - Limitations of JSX approach
  • 10:43 - Connection between a host component and children
  • 11:33 - Why triggers API is needed?
  • 12:35 - Triggers API journey
  • 13:24 - Triggers API in Fluent UI React v9
  • 14:36 - Limitations of Triggers API
  • 14:56 - Summary of the episode
  • 15:27 - Bloopers