From 9178fde00c504e0ce939e95beda22b7f84c28522 Mon Sep 17 00:00:00 2001
From: Miklos Bertalan <miklos.bertalan@risingstack.com>
Date: Tue, 7 Feb 2017 17:33:10 +0100
Subject: [PATCH] feat: add props middleware, display component and control
 component

---
 src/components/control.js | 11 +++++++++++
 src/components/display.js | 11 +++++++++++
 src/components/index.js   |  4 +++-
 src/components/page.js    |  8 +++-----
 src/middlewares.js        |  1 +
 5 files changed, 29 insertions(+), 6 deletions(-)
 create mode 100644 src/components/control.js
 create mode 100644 src/components/display.js

diff --git a/src/components/control.js b/src/components/control.js
new file mode 100644
index 0000000..36b4284
--- /dev/null
+++ b/src/components/control.js
@@ -0,0 +1,11 @@
+'use strict'
+
+const display = require('./display')
+const middlewares = require('../middlewares')
+
+module.exports = function control (config) {
+  config = config || {}
+
+  return display(config)
+    .use(middlewares.params(config.params || {}))
+}
diff --git a/src/components/display.js b/src/components/display.js
new file mode 100644
index 0000000..91a7f3e
--- /dev/null
+++ b/src/components/display.js
@@ -0,0 +1,11 @@
+'use strict'
+
+const rendered = require('./rendered')
+const middlewares = require('../middlewares')
+
+module.exports = function display (config) {
+  config = config || {}
+
+  return rendered(config)
+    .use(middlewares.props.apply(null, config.props || []))
+}
diff --git a/src/components/index.js b/src/components/index.js
index 18ad8b8..5334cba 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -4,5 +4,7 @@ module.exports = {
   app: require('./app'),
   page: require('./page'),
   rendered: require('./rendered'),
-  router: require('./router')
+  router: require('./router'),
+  display: require('./display'),
+  control: require('./control')
 }
diff --git a/src/components/page.js b/src/components/page.js
index b9a08a2..4d74f66 100644
--- a/src/components/page.js
+++ b/src/components/page.js
@@ -1,14 +1,12 @@
 'use strict'
 
-const component = require('@nx-js/core')
+const rendered = require('./rendered')
 const middlewares = require('../middlewares')
 
 module.exports = function page (config) {
   config = config || {}
-  config.params = config.params || {}
 
-  return component(config)
-    .use(middlewares.render(config))
+  return rendered(config)
     .use(middlewares.meta(config))
-    .use(middlewares.params(config.params))
+    .use(middlewares.params(config.params || {}))
 }
diff --git a/src/middlewares.js b/src/middlewares.js
index 55b2313..79b9024 100644
--- a/src/middlewares.js
+++ b/src/middlewares.js
@@ -2,6 +2,7 @@
 
 module.exports = {
   attributes: require('@nx-js/attributes-middleware'),
+  props: require('@nx-js/props-middleware'),
   events: require('@nx-js/events-middleware'),
   interpolate: require('@nx-js/interpolate-middleware'),
   render: require('@nx-js/render-middleware'),