@martpet/react-slot v1.0.0

react-slot

Pass React elements between components via Context.

Usage

import { ContentFor, Slot, SlotProvider } from '@martpet/react-slot';

function App() {
  return (
    <SlotProvider>
      <Component1 />
      <Component2 />
      <Component3 />
    </SlotProvider>
  );
}

function Component1() {
  return (
    <div>
      <Slot name="demo" />
    </div>
  );
}

function Component2() {
  return (
    <ContentFor slot="demo">
      <p>Demo</p>
    </ContentFor>
  );
}

function Component3() {
  return (
    <ContentFor slot="demo" order={-1}>
      First
    </ContentFor>
  );
}