<script setup lang="ts">
interface NavItem {
  title?: string
  _path?: string
  children?: NavItem[]
}

defineProps<{ items: NavItem[] }>()
</script>

<template>
  <nav class="docs-sidebar">
    <ul>
      <li v-for="item in items" :key="item._path || item.title">
        <NuxtLink v-if="item._path" :to="item._path">{{ item.title }}</NuxtLink>
        <span v-else>{{ item.title }}</span>
        <DocsSidebar v-if="item.children?.length" :items="item.children" />
      </li>
    </ul>
  </nav>
</template>
