diff --git a/js/components/toggler.js b/js/components/toggler.js
new file mode 100644
index 00000000..248de40a
--- /dev/null
+++ b/js/components/toggler.js
@@ -0,0 +1,28 @@
+export default {
+  name: 'toggler',
+
+  data: function () {
+    return {
+      isVisible: false
+    }
+  },
+
+  render: function (createElement) {
+    return createElement( this.$vnode.data.tag, [
+      this.$scopedSlots.default({
+        isVisible: this.isVisible,
+        toggle: this.toggle
+      })
+    ])
+  },
+
+  methods: {
+    toggle: function (e) {
+      this.isVisible = !this.isVisible
+    }
+  },
+
+  mounted: function () {
+    console.log(this)
+  }
+}
diff --git a/js/index.js b/js/index.js
index 4ecd6aa7..64184bc1 100644
--- a/js/index.js
+++ b/js/index.js
@@ -8,13 +8,14 @@ import checkboxinput from './components/checkbox_input'
 import DetailsOfUse from './components/forms/details_of_use'
 import poc from './components/forms/poc'
 import financial from './components/forms/financial'
+import toggler from './components/toggler'
 
 Vue.use(VTooltip)
 
-
 const app = new Vue({
   el: '#app-root',
   components: {
+    toggler,
     optionsinput,
     textinput,
     checkboxinput,