# preact-context

> React's new Context Api for preact

Latest version **1.1.4** (published 2019-10-01) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install preact-context
pnpm add preact-context
yarn add preact-context
bun add preact-context
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.4 |
| Published | 2019-10-01 |
| First published | 2018-04-29 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 30.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 150 |
| Author | Georgios Valotasios |
| Maintainers | valotas |
| Keywords | preact, context |

## Links

- npm: https://www.npmjs.com/package/preact-context
- Repository: https://github.com/valotas/preact-context
- Issues: https://github.com/valotas/preact-context/issues
- npm.io page: https://npm.io/package/preact-context

## Recent versions

- 1.1.4 (latest) — 2019-10-01
- 1.1.3 — 2019-02-09
- 1.1.2 — 2018-10-15
- 1.1.1 — 2018-09-13
- 1.1.0 — 2018-09-02
- 1.0.3 — 2018-08-19
- 1.0.2 — 2018-06-03
- 1.0.1 — 2018-05-25
- 1.0.0 — 2018-05-19
- 0.1.1 — 2018-05-12
- 0.1.0 — 2018-05-05
- 0.0.4 — 2018-05-01
- 0.0.3 — 2018-04-29
- 0.0.2 — 2018-04-29
- 0.0.1 — 2018-04-29
- … 1 more at https://npm.io/package/preact-context/versions

## README

# React's `createContext` for preact

[![Build Status](https://travis-ci.org/valotas/preact-context.svg?branch=master)](https://travis-ci.org/valotas/preact-context)
[![npm](https://img.shields.io/npm/v/preact-context.svg)](https://www.npmjs.com/package/preact-context)

[![Sauce Test Status](https://saucelabs.com/browser-matrix/valotas.svg)](https://saucelabs.com/u/valotas)

This is an implementation of react's [new context api][rfcs]. You can read more
about it on [react's documentation][react-context-doc] page.

This package provides the `createContext` factory function that can be used
in order to create a context:

```js
import { h } from "preact";
import { createContext } from "preact-context";

const Theme = createContext("dark");
```

The returned object contains two components: a `Provider` and a `Consumer`.

## The `Consumer`

It can be used in order to consume the provided object:

```jsx
<Theme.Consumer>{theme => <p>Selected theme: {theme}</p>}</Theme.Consumer>
```

Alternatively, it can also be used with a render property:

```jsx
<Theme.Consumer render={theme => <p>Selected theme: {theme}</p>} />
```

## The `Provider`

can be used in order to update the value of a context:

```jsx
<Theme.Provider value="sunny">
```

will change "dark" to "sunny" and notify all it's consumers of the change.

# Development

This project has been written with [typescript][typescript].
The `watch` script will watch for changes, compile and run the tests.

```
$ npm i
$ npm run watch
```

# License

Licensed under the [Apache License, Version 2.0](LICENSE)

# Big Thanks

Cross-browser Testing Platform and Open Source <3 Provided by [Sauce Labs][saucelabs]

[rfcs]: https://github.com/acdlite/rfcs/blob/new-version-of-context/text/0000-new-version-of-context.md
[react-context-doc]: https://reactjs.org/docs/context.html
[typescript]: https://www.typescriptlang.org/
[saucelabs]: https://saucelabs.com

---
_Source: https://npm.io/package/preact-context · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._