It's more preferable to use lens.js or squirrel.js
Hyperapp#v2 doesn't have slices/namespaces anymore,
so whenever you are working with deeply nested state you have to merge all parents
each time:
'use strict' // Strict mode to throw mutation errors | |
import { h, app } from 'hyperapp' | |
import { immutable } from 'helpers' | |
// action that is trying to mutate the state | |
// will throw error for any mutation | |
const onclick = state => { | |
++state.counter | |
return state | |
} |
const {h, app} = hyperapp // @jsx h | |
// Effect for element side-effects | |
const fx = a => (...b) => [a, b] | |
const withElement = fx((dispatch, [element, props], action) => { | |
Object.keys(props).map(k => props[k] && element[k]()) | |
action && dispatch(action) | |
}) | |
// Decoder to get 'event.detail' |
import { h, app } from 'hyperapp' | |
import { logger } from 'helpers/logger' | |
const init = () => ({ initalized: true }) | |
app({ init }, logger(process.env.NODE_ENV==='development')) |
/* | |
This is variation of `squirrel` and `namespace` approaches | |
https://gist.github.com/zaceno/0d7c62be81a845857e755c1378b7dbff | |
https://gist.github.com/sergey-shpak/5817bf146cb970bc4e259aef71b89ef4 | |
Simplifies Hyperapp#v2 actions work with deeply nested state | |
(updated to support returned actions, parameterized actions) | |
Usage examples: |
import { h } from 'hyperapp'; | |
export default (props) => { | |
const { | |
src: { | |
icon: [ | |
iconWidth, | |
iconHeight, | |
, , | |
iconPath, |
import { h } from 'hyperapp' | |
/* | |
This is implementation of Hyperapp#v2 Context | |
Helpful when you want to pass properties to internal components | |
without multiple components compositions | |
*/ |
import { h } from "hyperapp"; | |
/* | |
This is implementation of Hyperapp#v2 Portal component | |
Portal component renders children into a DOM node | |
that exists outside the DOM hierarchy of the parent component | |
IMPORTANT! It's not recommended approach to use | |
unless you really know what you're doing | |
*/ |
It's more preferable to use lens.js or squirrel.js
Hyperapp#v2 doesn't have slices/namespaces anymore,
so whenever you are working with deeply nested state you have to merge all parents
each time: