williamho · June 29, 2018 15:02
diff --git a/README.md b/README.md
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Hello world!</title>
 </head>
 <body>
  <script src="index.tsx"></script>
 </body>
 </html>
diff --git a/index.tsx b/index.tsx
 import { h, app, ActionsType, ActionResult, View } from "hyperapp";

 interface State {
  count: number;
 };

 const state: State = {
  count: 0
 };

 interface Actions {
  down: (value: number) => (state: State) => ActionResult<State>;
  up: (value: number) => (state: State) => ActionResult<State>;
 };

 const actions: ActionsType<State, Actions> = {
  down: (value: number) => (state) => {
    return { count: state.count - value };
  },
  up: (value: number) => (state) => {
    return { count: state.count + value };
  }
 };

 const view: View<State, Actions> = (state, actions) => (
  <div>
    <h1>{state.count}</h1>
    <button onclick={() => actions.down(1)}>-</button>
    <button onclick={() => actions.up(1)}>+</button>
  </div>
 );

 app(state, actions, view, document.body);
diff --git a/package.json b/package.json
 {
  "name": "hello",
  "version": "1.0.0",
  "main": "index.html",
  "license": "MIT",
  "devDependencies": {
    "parcel": "^1.9.3",
    "typescript": "^2.9.2"
  },
  "dependencies": {
    "hyperapp": "^1.2.6"
  }
 }
diff --git a/tsconfig.json b/tsconfig.json
 {
  "compilerOptions": {
    "jsx": "react",
    "jsxFactory": "h"
  }
 }
	import { h, app, ActionsType, ActionResult, View } from "hyperapp";

	interface State {
	count: number;
	};

	const state: State = {
	count: 0
	};

	interface Actions {
	down: (value: number) => (state: State) => ActionResult<State>;
	up: (value: number) => (state: State) => ActionResult<State>;
	};

	const actions: ActionsType<State, Actions> = {
	down: (value: number) => (state) => {
	return { count: state.count - value };
	},
	up: (value: number) => (state) => {
	return { count: state.count + value };
	}
	};

	const view: View<State, Actions> = (state, actions) => (
	<div>
	<h1>{state.count}</h1>
	<button onclick={() => actions.down(1)}>-</button>
	<button onclick={() => actions.up(1)}>+</button>
	</div>
	);

	app(state, actions, view, document.body);