0.1.0 • Published 5 years ago
callbag-component v0.1.0
callbag-component
callbag-component is wrapper of Custom element 1.0 API.
Provides reactive custom element via callbag
API
Component
component(intent$, model$, view$)
| Arguments | Description |
|---|---|
| intent$ | takes DOM element(connected component). returns source of intent |
| model$ | takes source of intent. returns source of model |
| view$ | takes source of model. returns source of DOM Node, which will replace custom element's children |
Example:
import { component, fromIntent } from 'callbag-component';
import fromEvent from 'callbag-from-event';
import map from 'callbag-map';
const Counter = component(
element => fromEvent(element, 'click'),
fromIntent(prev => prev + 1, 0),
map(count => document.createTextNode(`count: ${count}`)),
);fromIntent(reducer, preloadedModel)
| Arguments | Description |
|---|---|
| reducer | takes lastly calculated model and lastly produced intent, returns new model |
| preloadedModel | initial model |
import { component, fromIntent } from 'callbag-component';
import fromEvent from 'callbag-from-event';
import map from 'callbag-map';
const Counter = component(
element => fromEvent(element, 'click'),
fromIntent(prev => prev + 1, 0),
map(count => document.createTextNode(`count: ${count}`)),
);