Element <slot>
Mechanizm web components pozwalający „wstrzykiwać” zewnętrzną treść w wyznaczone miejsca wewnątrz Shadow DOM komponentu. <slot> to zastępnik, w którym lądują własne elementy potomne użytkownika — podstawa kompozycji komponentów.
Problem: komponent z Shadow DOM ma własne, zamknięte wnętrze, ale często chcemy wstawić do niego własną treść (jak children w Reakcie albo tekst w <button>). Sloty to rozwiązują: komponent definiuje miejsca <slot> w swoim shadow DOM, a treść, którą użytkownik napisze między znacznikami komponentu, jest tam „projektowana”. Nazwane sloty (<slot name="header"> + slot="header" na elemencie potomnym) pozwalają umieścić różną treść w różnych miejscach (nagłówek, treść, stopka). Ważny szczegół: projektowana treść pozostaje w zwykłym (light) DOM i jest stylowana stamtąd, a nie przez CSS shadow komponentu. Zysk: elastyczne, składalne komponenty (karta, którą użytkownik wypełnia treścią). Rdzeń kompozycji w web components. Powiązane z web components i deklaratywnym shadow DOM.