<template>
  <sv-bar type="nav" :color="color" :text="text">
    <template slot="left">
      <slot name="left"></slot>
    </template>
    <slot>{{title}}</slot>
    <template slot="right">
      <slot name="right"></slot>
    </template>
  </sv-bar>
</template>

<script>
  import Bar from './Bar'
  export default {
    name: 'svNav',
    components: {
      svBar: Bar
    },
    props: {
      title: {
        type: String
      },
      color: {
        type: String,
        default: 'light'
      },
      text: String
    }
  }
</script>
