preact-slots

Render Preact trees into other Preact trees, like portals.

Install

preact-slots is available on npm:

npm install --save preact-slots

Usage

Define "holes" in your appliation using <Slot name="foo" />, then fill them using <SlotContent slot="foo">some content</SlotContent>:

import { SlotProvider, Slot, SlotContent } from 'preact-slots'
 
render(
    <SlotProvider>
        <div>
            <Slot name="foo">
                Some Fallback Content
            </Slot>
            <SlotContent slot="foo">
                Replacement Content
            </SlotContent>
        </div>
    </SlotProvider>
)

The above renders <div>Replacement Content</div>.

License

MIT License © Jason Miller