From a9fd6cf9ab64b39ed9e90950ddc552e7b48d43a3 Mon Sep 17 00:00:00 2001
From: axolotle <nchesnais@mailoo.org>
Date: Thu, 24 Jun 2021 16:14:07 +0200
Subject: [PATCH] add NodeViewChildListGroup component

---
 .../nodes/NodeViewChildListGroup.vue          | 41 +++++++++++++++++++
 src/components/nodes/index.js                 |  1 +
 2 files changed, 42 insertions(+)
 create mode 100644 src/components/nodes/NodeViewChildListGroup.vue

diff --git a/src/components/nodes/NodeViewChildListGroup.vue b/src/components/nodes/NodeViewChildListGroup.vue
new file mode 100644
index 0000000..147a086
--- /dev/null
+++ b/src/components/nodes/NodeViewChildListGroup.vue
@@ -0,0 +1,41 @@
+<template>
+  <nav class="node-view-child-list-group">
+    <b-list-group>
+      <b-list-group-item
+        v-for="child in children" :key="child.id"
+        :variant="child.variant"
+        href="javascript:;"
+        @click="$parent.$emit('open-child', { childId: child.id })"
+      >
+        {{ $t('variants.' + child.variant) }}
+      </b-list-group-item>
+    </b-list-group>
+  </nav>
+</template>
+
+<script>
+export default {
+  name: 'NodeViewChildListGroup',
+
+  props: {
+    children: { type: Array, required: true }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.node-view-child-list-group {
+  .list-group {
+    font-family: $font-family-base;
+    font-weight: $font-weight-bold;
+
+    @include media-breakpoint-up(sm) {
+      font-size: 1.75rem;
+    }
+
+    &-item {
+
+    }
+  }
+}
+</style>
diff --git a/src/components/nodes/index.js b/src/components/nodes/index.js
index 7e1593c..485a6e0 100644
--- a/src/components/nodes/index.js
+++ b/src/components/nodes/index.js
@@ -1,4 +1,5 @@
 export { default as NodeViewChildList } from './NodeViewChildList'
+export { default as NodeViewChildListGroup } from './NodeViewChildListGroup'
 export { default as NodeViewTitle } from './NodeViewTitle'
 export { default as NodeViewHeaderRef } from './NodeViewHeaderRef'
 export { default as NodeViewHeaderProd } from './NodeViewHeaderProd'