From b6b1fc3073a7b03713d40d65eba1d8d9aed2bf87 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 17:42:41 +0100
Subject: [PATCH] add component nuxt-child

---
 examples/custom-routes/pages/posts.vue |  2 +-
 lib/app/components/nuxt-child.vue      | 38 ++++++++++++++++++++++++++
 lib/app/index.js                       |  3 ++
 lib/build/index.js                     |  1 +
 4 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 lib/app/components/nuxt-child.vue

diff --git a/examples/custom-routes/pages/posts.vue b/examples/custom-routes/pages/posts.vue
index 946ca2731f..2740c339b0 100644
--- a/examples/custom-routes/pages/posts.vue
+++ b/examples/custom-routes/pages/posts.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="container">
     <h1>Dynamic nested route example</h1>
-    <router-view></router-view>
+    <nuxt-child></nuxt-child>
   </div>
 </template>
diff --git a/lib/app/components/nuxt-child.vue b/lib/app/components/nuxt-child.vue
new file mode 100644
index 0000000000..8e09629e46
--- /dev/null
+++ b/lib/app/components/nuxt-child.vue
@@ -0,0 +1,38 @@
+<template>
+  <transition :name="transition.name" :mode="transition.mode">
+    <router-view></router-view>
+  </transition>
+</template>
+
+<script>
+export default {
+  name: 'nuxt-child',
+  props: {
+    transition: {
+      type: Object,
+      default: () => {
+        return {
+          mode: 'out-in', // out-in ou in-out
+          name: 'fade',
+          type: '', // animation ou transition
+          enter: null, // isFunc = js, is String = css
+          enterActive: '',
+          beforeEnter: null, // Func
+          afterEnter: null,
+          enterCancelled: null,
+          leave: null, // isFunc = js, is String = css
+          leaveActive: '',
+          beforeLeave: null, // Func
+          afterLeave: null,
+          leaveCancelled: null,
+          appear: null, // isFunc = js, is String = css
+          appearClass: '',
+          appearActiveClass: '',
+          beforeAppear: null,
+          afterAppear: null
+        }
+      }
+    }
+  }
+}
+</script>
diff --git a/lib/app/index.js b/lib/app/index.js
index 86daac5d69..91fcf7f98c 100644
--- a/lib/app/index.js
+++ b/lib/app/index.js
@@ -5,11 +5,14 @@ import Meta from 'vue-meta'
 import router from './router.js'
 <% if (store) { %>import store from '~store/index.js'<% } %>
 import NuxtContainer from './components/nuxt-container.vue'
+import NuxtChild from './components/nuxt-child.vue'
 import Nuxt from './components/nuxt.vue'
 import App from '<%= appPath %>'
 
 // Component: <nuxt-container>
 Vue.component(NuxtContainer.name, NuxtContainer)
+// Component: <nuxt-child>
+Vue.component(NuxtChild.name, NuxtChild)
 // Component: <nuxt>
 Vue.component(Nuxt.name, Nuxt)
 
diff --git a/lib/build/index.js b/lib/build/index.js
index 8fd05707de..70f41a74a8 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -150,6 +150,7 @@ function * generateRoutesAndFiles () {
     'router.js',
     'server.js',
     'utils.js',
+    'components/nuxt-child.vue',
     'components/nuxt-container.vue',
     'components/nuxt.vue',
     'components/nuxt-loading.vue'