1. preact-context
React's new Context Api for preact
preact-context
Package: preact-context
Created by: valotas
Last modified: Fri, 13 May 2022 08:29:17 GMT
Version: 1.1.4
License: Apache-2.0
Downloads: 217,551
Repository: https://github.com/valotas/preact-context

Install

npm install preact-context
yarn add preact-context

React's createContext for preact

Build Status
npm

Sauce Test Status

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

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

 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:

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

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

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

The Provider

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

 <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.
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

Big Thanks

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

Dependencies

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code