Load component within Tabs Routable

Questions
1

The Tabs Routable (svelte) sample from kitchensink works fine, awesome! :+1:

In TAB3 I tried to change templating content to component, it worked fine for 1st click, but error on 2nd click

Question: Can Tabs load component (as Views can) ?

Thanks

Here’s the code (tab3.svelte)

<script>
  import { Navbar, Page, Tabs, Tab, Link, Toolbar } from 'framework7-svelte';
</script>

<Page pageContent={false}>
  <Navbar title="Tabs Routable" backLink="Back" />
  <Toolbar bottom tabbar>
    <Link tabLink href="./" routeTabId="tab1">Tab 1</Link>
    <Link tabLink href="tab2/" routeTabId="tab2">Tab 2</Link>
    <Link tabLink href="tab3/" routeTabId="tab3">Tab 3</Link>
  </Toolbar>
  <Tabs routable>
    <Tab class="page-content" id="tab1" />
    <Tab class="page-content" id="tab2" />
    <Tab class="page-content" id="tab3" />
  </Tabs>
</Page>

And here’s the route (routes.ts)

import Tab3 from './tab3.svelte'

{
  path: '/tabs-routable/',
  component: TabsRoutable,
  tabs: [
    {
      path: '/',
      id: 'tab1',
      content: `
      <div class="block">
        <p>Tab 1 content</p>
      </div>
      `
    },
    {
      path: '/tab2/',
      id: 'tab2',
      content: `
      <div class="block">
        <p>Tab 2 content</p>
      </div>
      `
    },
    {
      path: '/tab3/',
      id: 'tab3'
      component: Tab3
    }
  ]
}

and here’s the error screenshot
2023-02-28 11-03-22

2

oops sorry, forgot to include packages infos (redacted)

{
  "dependencies": {
    "dom7": "^4.0.4",
    "framework7": "7.0.9",
    "framework7-icons": ">=5.0.5",
    "framework7-svelte": "7.0.9",
    "svelte": "^3.55.0",
    "swiper": "^8.4.5"
  },
  "devDependencies": {
    "@sveltejs/vite-plugin-svelte": "^2.0.2",
    "@tsconfig/svelte": "^3.0.0",
    "less": "^4.1.3",
    "rollup-plugin-svelte": "^7.1.0",
    "svelte-preprocess": "^5.0.0",
    "tslib": "^2.4.1",
    "typescript": "^4.9.4",
    "vite": "^4.0.1"
  }
}