preact-statenano

is a small library that allows to synchronize state events created on the basis of StateNano with components created with preact all thanks to the high order components.

yarn

yarn add -D preact-statenano

npm

npm install -D preact-statenano

Provider Example

you can enter codesandbox.io to see an example of preact-statenano and statenano

import { h, Component, render } from "preact";
import {Provider} from 'preact-statenano';
import App   from './components/App';
import Todo  from './states/Todo';
 
render(
   <Provider todo={new Todo({tasks:[]})}>
       <App/>
   <Provider/>
)

Connect example

connect allows to generate a component that has 2 static properties:

• with: allows you to assign a component to the new component generated by connect
• map: it allows to map the new state, it must return an object

 
import { h, Component, render } from "preact";
import {connect} from 'preact-statenano';
 
function Todo({state}){
   return <h1>Todo!</h1>
}
 
return connect('todo').with(Todo).map(({todo},props)=>todo)