diff --git a/examples/todo/components/Form.jsx b/examples/todo/components/Form.jsx new file mode 100644 index 0000000..f72740b --- /dev/null +++ b/examples/todo/components/Form.jsx @@ -0,0 +1,56 @@ +import * as React from 'react' +import { View, LocalState } from '../../../src' + +const { + state, + setState +} = LocalState({ + schema: { + name: "", + age: 0, + }, + + setter: (mutation) => { + return { + name: mutation.name ? mutation.name.toLowerCase() : "", + age: mutation.age + ? mutation.age > 0 + ? mutation.age * 2 + : mutation.age * 10 + : mutation.age + 1, + } + }, + + getter: (state) => { + const [ + firstName, lastName + ] = state.name.split(" ") + + return { + firstName, + lastName, + } + } +}) + +export default View( + () => +
+
+      {
+        

+ name: { state.name } + age: { state.age } +

+ } +
+
  • + + setState("name")(value)}/> +
  • +
  • + + setState("age")(value)}/> +
  • +
    +) diff --git a/examples/todo/components/TodoList.jsx b/examples/todo/components/TodoList.jsx index 7d8aad4..f818e45 100644 --- a/examples/todo/components/TodoList.jsx +++ b/examples/todo/components/TodoList.jsx @@ -4,10 +4,18 @@ import { createTodo, login, logout } from '../actions.jsx' import { userState, todoState } from '../state.jsx' import ListItem from './ListItem.jsx' +import Form from "./Form" + +console.log({ + todoState, userState +}) export default View(() => { return (
    +
    +
    +
    Hi, we have {todoState.size} total todos. Pending: