add NodePreview & NodeViewChildListGroup in Library

src/pages/library/LibraryList.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="library-list">
-    <div class="library-list-container">
+    <div class="library-list-container" @click="onContainerClick">
       <div v-for="(parents, char) in filteredNodes" :key="char">
         <h3>{{ char }}</h3>
 
@@ -9,7 +9,10 @@
             v-for="parent in parents" :key="parent.id"
             :node="parent"
             mode="card"
+            @click.native.capture="previewNode = parent"
+            :preview="previewNode === parent"
             @open-node="$emit('open-node', $event)"
+            @open-child="$emit('open-node', { parentId: parent.id, ...$event })"
           />
         </div>
       </div>
@@ -31,6 +34,12 @@ export default {
     NodeView
   },
 
+  data () {
+    return {
+      previewNode: null
+    }
+  },
+
   computed: {
     ...mapGetters(['orderedTextsDepart', 'search', 'tags']),
 
@@ -50,6 +59,14 @@ export default {
     }
   },
 
+  methods: {
+    onContainerClick (e) {
+      if (!e.target.classList.contains('node-view')) {
+        this.previewNode = null
+      }
+    }
+  },
+
   created () {
     this.$store.dispatch('INIT_LIBRARY_LIST')
   }