# render-props-opener

**Repository Path**: mirrors_dsblv/render-props-opener

## Basic Information

- **Project Name**: render-props-opener
- **Description**: Render Props Callback Heaven
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-09-24
- **Last Updated**: 2026-02-22

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# render-props-opener

> Basically async/await but for render propsy React components

#### I'll keep it brief

* It's **experimental**
* There are exactly 0 tests (yet)
* Never measured, but it may be kinda slow
* I'm still not content about the name
* It can do this:

```js
import Opener from "render-props-opener";

const LightTheme = React.createContext({
  textColor: "black",
  backgroundColor: "white"
});

const DarkTheme = React.createContext({
  textColor: "white",
  backgroundColor: "black"
});

const Mode = React.createContext("dark");

<Opener>
  {open => {
    const mode = open(<Mode.Consumer />);
    const theme =
      mode === "light"
        ? open(<LightTheme.Consumer />)
        : open(<DarkTheme.Consumer />);

    return (
      <div
        style={{
          backgroundColor: theme.backgroundColor
        }}
      >
        <h1 style={{ color: theme.textColor }}>
          I sneezed on the beat and the beat got sicker
        </h1>
      </div>
    );
  }}
</Opener>;
```