diff --git a/examples/patois.web/src/App.js b/examples/patois.web/src/App.js
index e4ff973..7d3c977 100644
--- a/examples/patois.web/src/App.js
+++ b/examples/patois.web/src/App.js
@@ -1,23 +1,22 @@
import React, { Component } from 'react';
import TAO from '@tao.js/core';
+import { Provider } from '@tao.js/react';
import logo from './logo.svg';
import './App.css';
-import Space from './components/Space';
-
-const TAOContext = React.createContext({ TAO });
+import Space, { SpaceAltContainer } from './components/Space';
class App extends Component {
render() {
return (
-
+
Welcome to React
-
+
-
+
);
}
}
diff --git a/examples/patois.web/src/components/Space/Form.js b/examples/patois.web/src/components/Space/Form.js
index 7006737..32447f9 100644
--- a/examples/patois.web/src/components/Space/Form.js
+++ b/examples/patois.web/src/components/Space/Form.js
@@ -63,11 +63,9 @@ class SpaceForm extends Component {
onChange={this.handleChange}
/>
-
+
+
+
);
diff --git a/examples/patois.web/src/components/Space/index.js b/examples/patois.web/src/components/Space/index.js
index 2cf79c1..40ecdd6 100644
--- a/examples/patois.web/src/components/Space/index.js
+++ b/examples/patois.web/src/components/Space/index.js
@@ -1,6 +1,6 @@
-import React from 'react';
+import React, { Fragment } from 'react';
import TAO, { AppCtx } from '@tao.js/core';
-import { Adapter, Reactor } from '@tao.js/react';
+import { Adapter, Reactor, SwitchHandler, RenderHandler } from '@tao.js/react';
import List from './List';
import View from './View';
import Form from './Form';
@@ -50,3 +50,24 @@ const SpaceContainer = () => (
// };
export default SpaceContainer;
+
+const SpaceAltContainer = () => (
+
+
+ {(tao, data) => }
+
+ {/**/}
+
+ {(tao, data) =>
}
+
+
+ {(tao, data) => }
+
+
+ {(tao, data) => }
+
+ {/**/}
+
+);
+
+export { SpaceAltContainer };
diff --git a/packages/react-tao/src/Provider.js b/packages/react-tao/src/Provider.js
index 0c94500..f2e931f 100644
--- a/packages/react-tao/src/Provider.js
+++ b/packages/react-tao/src/Provider.js
@@ -32,7 +32,7 @@ export default class Provider extends Component {
}
render() {
- const { TAO } = this.props;
+ const { TAO, children } = this.props;
const dataContextFunctions = this.state;
return (
diff --git a/packages/react-tao/src/RenderHandler.js b/packages/react-tao/src/RenderHandler.js
index a01addb..a1bb664 100644
--- a/packages/react-tao/src/RenderHandler.js
+++ b/packages/react-tao/src/RenderHandler.js
@@ -1,5 +1,7 @@
-import React, { Component } from 'react';
+import React, { Fragment, Component } from 'react';
+import PropTypes from 'prop-types';
import { Context } from './Provider';
+import cartesian from 'cartesian';
function recursiveContextGenerator(
ctxList,
@@ -43,6 +45,13 @@ function recursiveContextGenerator(
export default class RenderHandler extends Component {
static contextType = Context;
+ static propTypes = {
+ term: PropTypes.any,
+ action: PropTypes.any,
+ orient: PropTypes.any,
+ children: PropTypes.func.isRequired
+ };
+
constructor(props) {
super(props);
let { shouldRender } = props;
@@ -51,15 +60,27 @@ export default class RenderHandler extends Component {
}
componentWillMount() {
+ console.log('RenderHandler::props:', this.props);
const { term, action, orient } = this.props;
+ console.log('RenderHandler::context:', this.context);
const { TAO } = this.context;
- TAO.addInlineHandler({ term, action, orient }, this.handleRender);
+ const permutations = cartesian({ term, action, orient });
+ if (permutations.length) {
+ permutations.forEach(({ term, action, orient }) =>
+ TAO.addInlineHandler({ term, action, orient }, this.handleRender)
+ );
+ }
}
componentWillUnmount() {
const { term, action, orient } = this.props;
const { TAO } = this.context;
- TAO.removeInlineHandler({ term, action, orient }, this.handleRender);
+ const permutations = cartesian({ term, action, orient });
+ if (permutations.length) {
+ permutations.forEach(({ term, action, orient }) =>
+ TAO.removeInlineHandler({ term, action, orient }, this.handleRender)
+ );
+ }
}
handleRender = (tao, data) => {
@@ -74,6 +95,9 @@ export default class RenderHandler extends Component {
if (!shouldRender) {
return null;
}
+ if (!context) {
+ return {children(tao, data)};
+ }
const ctxList = Array.isArray(context) ? context : [context];
return recursiveContextGenerator(
ctxList,