Debug: VitePress Sidebar Logic

✅ CORRECT: Item with children should use <details>

hasChildren = true → should render as <details>

Introduction (has children)
What is VitePress?
Getting Started
Routing

✅ CORRECT: Item without children should use <div>

hasChildren = false → should render as <div>

Simple Link (no children)

❌ INCORRECT: If this is what you're seeing...

hasChildren = false → but wrongly renders as <details>

Simple Link (should NOT be details)

❌ INCORRECT: If this is what you're seeing...

hasChildren = true → but wrongly renders as <div>

Introduction (should be details but isn't)
What is VitePress?
Getting Started
Routing

Current Logic in VPSidebarItem.vue:

const sectionTag = computed(() => (hasChildren.value ? 'details' : 'div'))

<template>
  <component :is="sectionTag" class="VPSidebarItem" :class="classes" :open="!collapsed">
    <!-- Non-collapsible items (no children) - use regular div -->
    <div
      v-if="props.item.text && !hasChildren"
      class="item"
    >
      <!-- content -->
    </div>

    <!-- Collapsible items (has children) - use summary -->
    <summary
      v-else-if="props.item.text && hasChildren"
      class="item"
    >
      <!-- content -->
    </summary>
  </component>
</template>

Expected behavior: