Реализация Tabs в Vue3?

Сюда выложить воспроизводимый код не получается, он здесь codesandbox.io/p/sandbox/implementation-of-tabs

Почему не работает такой простой код?:

<template>
  <Tabs>
    <Tab title="Tab A">Content A</Tab>
    <Tab title="Tab B" :active="true">Content B</Tab>
    <Tab title="Tab C">Content C</Tab>
  </Tabs>
</template>

Любая вкладка, которая назначена активной(active:true) отображает свой контент в момент первоначальной отрисовки всего блока Tabs, но последующие переключения не работают именно с первой активной вкладкой.

Сценарий воспроизведения:

1. Отрисовка компонента с активным "Tab B" - отображается "Content B".
2. Переключаемся, например, на "Tab A" - отображается "Content A".
3. Переключаемся опять на "Tab B" - отображается "Content A".
4. Вкладки "Tab A/C" работают обе, но только не "Tab B".

Какая именно вкладка будет назначена активной не имеет значения - хоть первая, хоть 256-ая, хоть через атрибут, хоть рандомно. Но именно та, которая в Tabs.vue будет установлена первой в tab.value = Tab, отказывается отобразить свой контент повторно.