https://github.com/uppercod/kubox-preact
📦Small component to work with Kubox
https://github.com/uppercod/kubox-preact
Last synced: about 1 year ago
JSON representation
📦Small component to work with Kubox
- Host: GitHub
- URL: https://github.com/uppercod/kubox-preact
- Owner: UpperCod
- License: apache-2.0
- Created: 2018-04-19T00:55:54.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2018-08-10T20:41:39.000Z (almost 8 years ago)
- Last Synced: 2025-03-22T00:44:15.246Z (about 1 year ago)
- Language: JavaScript
- Size: 46.9 KB
- Stars: 5
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# kubox-preact
Kubox-preact allows you to integrate **[kubox](https://github.com/uppercod/kubox)** as a status handler for applications created with **preact**.
| format UMD | size |
|------------|------|
| normal |3.84kb |
| min | 1.76kb |
| gzip | 649 bytes |
Apply it is simple 🤓, **kubox-preact** has 3 types of components:
1. **Provider** : create state contexts
2. **Suscriber** : access and subscribe to the changes given by the state context shared by Provider component.
3. **Consumer** : access the state context shared by the component provider.
## Provider
The Provider component allows you to create shared contexts for the components that it hosts.
| Parameter | Type | Description |
|-----------|------|-------------|
| **store** | instanceof Kubox | context to share |
```js
import {h} from "preact";
import {Provider} from "kubox-preact";
import store from "./store";
import App from "./App";
export default
;
```
## Subscriber
The Subscriber component allows you to subscribe and access a store defined by the context of the Supplier component or by store property.
| Parameter | Type | Description |
|-----------|------|-------------|
| **select** | string , array | allows you to select the subscription to one or more namespace of the state |
| **store** | instanceof Kubox | allows you to ignore the context given by the Provider component and point to this property |
```js
import {h} from "preact";
import {Provider} from "kubox-preact";
export default
{(state, actions) => }
;
```
## Consumer
The Consumer component allows access to a store defined by the context of the Provider component or by store property.
| Parameter | Type | Description |
|-----------|------|-------------|
| **store** | instanceof Kubox | allows you to ignore the context given by the Provider component and point to this property |
```js
import {h} from "preact";
import {Provider} from "kubox-preact";
export default
{(state, actions) => }
;
```
> The Consumer component does not subscribe to the changes, as if the Subscriber component does