What to build
Implement the core slot primitives that templates use to declare insertion points and pages use to fill them.
Three pieces:
SlotContext — React context holding a SlotMap (Record<string, ReactNode>)
SlotProvider — wraps the template tree, provides the slot map from the page
<Slot id="name" fallback={...} /> — reads from SlotContext, renders the matching slot content or falls back
Templates use <Slot> to declare where page content goes:
export default function MarketingTemplate({ head }) {
return (
<html><head>{head}</head><body>
<Slot id="header" />
<main><Slot id="content" /></main>
<Slot id="footer" fallback={<DefaultFooter />} />
</body></html>
);
}
Acceptance criteria
Blocked by
What to build
Implement the core slot primitives that templates use to declare insertion points and pages use to fill them.
Three pieces:
SlotContext— React context holding aSlotMap(Record<string, ReactNode>)SlotProvider— wraps the template tree, provides the slot map from the page<Slot id="name" fallback={...} />— reads from SlotContext, renders the matching slot content or falls backTemplates use
<Slot>to declare where page content goes:Acceptance criteria
SlotContextcreated with empty defaultSlotProvideracceptsslots: SlotMapandchildren<Slot>renders matching content from context<Slot>rendersfallbackwhen slot is not provided<Slot>renders nothing when slot is not provided and no fallback@sundayceo/frameworkBlocked by