Permalink
Browse files

Working implementation and more

  • Loading branch information...
jamiebuilds committed Feb 1, 2018
1 parent 255b336 commit 92b836f3f7ddda00f706a1ec079bb8aa45f7e808
View
@@ -41,9 +41,9 @@ function Counter() {
<Subscribe to={[CounterContainer]}>
{counter => (
<div>
<button onClick={counter.decrement}>-</button>
<button onClick={() => counter.decrement()}>-</button>
<span>{counter.state.count}</span>
<button onClick={counter.increment}>+</button>
<button onClick={() => counter.increment()}>+</button>
</div>
)}
</Subscribe>
@@ -0,0 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`basic 1`] = `<div />`;
View
@@ -0,0 +1,80 @@
// @flow
import React from 'react';
import renderer from 'react-test-renderer';
import { Provide, Subscribe, Container } from '../src/unstated';
function render(element) {
return renderer.create(element).toJSON();
}
class CounterContainer extends Container<{ count: number }> {
state = { count: 0 };
increment(amount = 1) {
this.setState({ count: this.state.count + amount });
}
decrement(amount = 1) {
this.setState({ count: this.state.count - amount });
}
}
class AmounterContainer extends Container<{ amount: number }> {
state = { amount: 1 };
setAmount(amount) {
this.setState({ amount });
}
}
function Counter() {
return (
<Subscribe to={[CounterContainer]}>
{counter => (
<div>
<span>{counter.state.count}</span>
<button onClick={() => counter.decrement()}>-</button>
<button onClick={() => counter.increment()}>+</button>
</div>
)}
</Subscribe>
);
}
function CounterWithAmount() {
return (
<Subscribe to={[CounterContainer, AmounterContainer]}>
{(counter, amounter) => (
<div>
<span>{counter.state.count}</span>
<button onClick={() => counter.decrement(amounter.state.amount)}>
-
</button>
<button onClick={() => counter.increment(amounter.state.amount)}>
+
</button>
</div>
)}
</Subscribe>
);
}
function CounterWithAmountApp() {
return (
<Subscribe to={[AmounterContainer]}>
{amounter => (
<div>
<Counter />
<input
type="number"
value={amounter.state.amount}
onChange={event => {
amounter.setAmount(parseInt(event.currentTarget.value, 10));
}}
/>
</div>
)}
</Subscribe>
);
}
test('basic', () => {
// still too lazy
});
View

This file was deleted.

Oops, something went wrong.
View
@@ -1,7 +1,7 @@
// @flow
import React from 'react';
import { render } from 'react-dom';
import { Subscribe, Container } from '../src';
import { Subscribe, Container } from '../src/unstated';
type AppState = {
amount: number
@@ -60,7 +60,7 @@ function App() {
type="number"
value={app.state.amount}
onChange={event => {
app.setAmount(event.currentTarget.value);
app.setAmount(parseInt(event.currentTarget.value, 10));
}}
/>
</div>
@@ -69,6 +69,4 @@ function App() {
);
}
let root = document.getElementById('root');
if (!root) throw new Error('Missing #root');
render(<App />, root);
render(<App />, window.complex);
View
@@ -5,10 +5,12 @@
<title>Unstated - Examples</title>
</head>
<body>
<h1>Unstated Examples</h1>
<ul>
<li><a href="./simple.html">Simple</a></li>
<li><a href="./complex.html">Complex</a></li>
</ul>
<h3>Simple</h3>
<div id="simple"></div>
<script type="text/javascript" src="./simple.js"></script>
<h3>Complex</h3>
<div id="complex"></div>
<script type="text/javascript" src="./complex.js"></script>
</body>
</html>
View

This file was deleted.

Oops, something went wrong.
View
@@ -1,7 +1,7 @@
// @flow
import React from 'react';
import { render } from 'react-dom';
import { Subscribe, Container } from '../src';
import { Subscribe, Container } from '../src/unstated';
type CounterState = {
count: number
@@ -24,15 +24,13 @@ function Counter() {
<Subscribe to={[CounterContainer]}>
{counter => (
<div>
<button onClick={counter.decrement}>-</button>
<button onClick={() => counter.decrement()}>-</button>
<span>{counter.state.count}</span>
<button onClick={counter.increment}>+</button>
<button onClick={() => counter.increment()}>+</button>
</div>
)}
</Subscribe>
);
}
let root = document.getElementById('root');
if (!root) throw new Error('Missing #root');
render(<Counter />, root);
render(<Counter />, window.simple);
Oops, something went wrong.

0 comments on commit 92b836f

Please sign in to comment.