reactive-react
diff --git a/‎examples/frp-counter/bin/compiler.jar
6.09 MB b/‎examples/frp-counter/bin/compiler.jar
6.09 MB
diff --git a/‎examples/frp-counter/package.json
Lines changed: 71 additions & 0 deletions b/‎examples/frp-counter/package.json
Lines changed: 71 additions & 0 deletions
diff --git a/‎examples/frp-counter/public/index.html
Lines changed: 28 additions & 0 deletions b/‎examples/frp-counter/public/index.html
Lines changed: 28 additions & 0 deletions
diff --git a/‎examples/frp-counter/src/app.jsx
Lines changed: 61 additions & 0 deletions b/‎examples/frp-counter/src/app.jsx
Lines changed: 61 additions & 0 deletions
@@ -0,0 +1,71 @@
+{
+  "name": "mostux-todomvc",
+  "version": "0.0.1",
+  "description": "",
+  "browserify": {
+    "transform": [
+      [
+        "babelify",
+        {
+          "extensions": [
+            ".es6",
+            ".jsx",
+            ".js"
+          ]
+        }
+      ]
+    ]
+  },
+  "scripts": {
+    "build": "NODE_ENV=production browserify src/app.jsx --extension=.jsx --extension=.es6 | java -jar bin/compiler.jar > public/app.js",
+    "start": "ecstatic -p 8000 public",
+    "watch": "watchify -d src/app.jsx --extension=.jsx --extension=.es6 -o public/app.js -dv",
+    "test": "jest"
+  },
+  "jest": {
+    "scriptPreprocessor": "<rootDir>/node_modules/babel-jest",
+    "testFileExtensions": [
+      "es6",
+      "js",
+      "jsx"
+    ],
+    "moduleFileExtensions": [
+      "js",
+      "json",
+      "es6",
+      "jsx"
+    ]
+  },
+  "dependencies": {
+    "ramda": "^0.22.1",
+    "react": "^15.3.2",
+    "react-dom": "^15.3.2",
+    "react-most": "^0.6.5",
+    "union-type": "^0.3.3"
+  },
+  "devDependencies": {
+    "babel": "^6.5.2",
+    "babel-jest": "^16.0.0",
+    "babel-plugin-ramda": "^1.1.6",
+    "babel-plugin-transform-react-jsx": "^6.1.18",
+    "babel-preset-es2015": "^6.1.18",
+    "babelify": "^7.2.0",
+    "browserify": "^12.0.1",
+    "ecstatic": "^1.3.1",
+    "envify": "^3.4.1",
+    "jest-cli": "^0.7.0",
+    "react-addons-test-utils": "^15.3.2",
+    "watchify": "^3.6.1"
+  },
+  "author": "Jichao Ouyang",
+  "license": "ISC",
+  "babel": {
+    "presets": [
+      "es2015"
+    ],
+    "plugins": [
+      "transform-react-jsx",
+      "ramda"
+    ]
+  }
+}
@@ -0,0 +1,28 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<title>Type N Search</title>
+    <style>
+      .display {
+        display: block;
+      }
+      .hidden {
+        display: none;
+      }
+      .red {
+        color: red;
+      }
+    </style>
+	</head>
+	<body>
+    <h1>Github Reactive Repo Search</h1>
+      <div id="app"></div>
+		<footer class="info">
+			<p>Created by <a href="https://github.com/jcouyang">Jichao Ouyang</a></p>
+			<p>a <a href="http://github.com/jcouyang/react-most">React Most</a> Example</p>
+		</footer>
+		<script src="app.js"></script>
+	</body>
+</html>
@@ -0,0 +1,61 @@
+import React from 'react';
+import { render } from 'react-dom';
+import Most, { connect } from '../../../lib/react-most'
+import {from, lensProp, over, set, inc, dec, identity, compose} from 'ramda'
+import Type from 'union-type'
+export default Type({
+    Inc: [Number],
+    Dec: [Number],
+    Double: [],
+    Half: []
+})
+
+const CounterView = props => (
+    <div>
+        <button onClick={props.actions.half}>/2</button>
+        <button onClick={()=>props.actions.dec(1)}>-</button>
+        <span>{props.count}</span>
+        <button onClick={()=>props.actions.inc(1)}>+</button>
+        <button onClick={props.actions.double}>*2</button>
+    </div>
+)
+
+CounterView.defaultProps = { count: 0 };
+
+const lensCount = lensProp('count')
+
+const doublable = connect(intent$ => {
+    return {
+        sink$: intent$.map(Intent.case({
+            Double: () => over(lensCount, x=>x*2),
+            Half: () => over(lensCount, x=>x/2),
+            _: () => identity
+        })),
+        actions: {
+            double: Intent.Double,
+            half: Intent.Half,
+        }
+    }
+})
+
+const increasable = connect(intent$ => {
+    return {
+        sink$: intent$.map(Intent.case({
+            Inc: (v) => over(lensCount, inc(v)),
+            Dec: (v) => over(lensCount, dec(v)),
+            _: () => identity
+        })),
+        actions: {
+            inc: Intent.Inc,
+            dec: Intent.Dec,
+        }
+    }
+})
+
+const Counter = doublable(increasable(CounterView))
+
+render(
+  <Most>
+    <Counter />
+  </Most>
+  , document.getElementById('app'));