Language-tools: Autocompletar código confuso / incorreto

Descreva o bug
Estou tendo um autocompletar de código confuso com JS e TS simples. Não tenho certeza se configurei algo errado.

Reproduzir
veja a configuração simples com um Parent.svelte e um componente Child.svelte :

// Parent.svelte
<script>
    import {onMount} from "svelte"
    import Child from "./Child.svelte"

    let child

    onMount(()=> {

    })

</script>

<Child bind:this={child} />`

// Child.svelte
<script>
    export let foo
    export let bar = undefined

    export const baz = () => {
        console.log("executed function 'baz'!")
    }    
</script>

<div>
    foo is: <em>{foo}</em><br/>
    bar is: <em>{bar}</em>
</div>

JS com <script></script> :

• O auto-completar de código no componente filho mostra bar , baz , foo , ref etc.
  esperado: apenas foo e bar

  • por que ref lá, o que ele faz?
  • Acho que $$ prop_def, $$ slot_def, __sveltets_ensureType, __sveltets_partial estão relacionados a svelte2tsx (?)
  • Criança / criança?
  • onMount?

• bar , baz , foo estão todos listados como opcionais (? :)
  esperado: bar opcional, baz não listado, foo obrigatório (veja o aviso do console).

• O preenchimento de código em child -reference também está me confundindo, além de outras coisas relacionadas ao svelte2tsx, etc .:
  foo está listado, embora não esteja acessível (consulte o erro do console), baz não está listado.
  esperado: foo não está listado, baz está listado

• Embora baz não esteja listado, posso chamá-lo e funciona como esperado (consulte o log do console)

Versão TS com <script lang="typescript"></script> :

// Parent.svelte
<script lang="typescript">
    import {onMount} from "svelte"
    import Child from "./Child.svelte"

    let child:Child

    onMount(()=> {

    })

</script>

<Child bind:this={child} />`

// Child.svelte
<script lang="typescript">
    export let foo: number
    export let bar: number = undefined

    export const baz = (): void => {
        console.log("executed function 'baz'!")
    }    
</script>

<div>
    foo is: <em>{foo}</em><br/>
    bar is: <em>{bar}</em>
</div>

• O auto-completar de código no componente filho mostra bar , baz , foo , ref etc.
  esperado: apenas foo e bar + etc.

• bar , baz , foo estão todos listados como opcionais (? :)
  esperado: bar opcional, baz não listado, foo obrigatório (veja o aviso do console).

• O preenchimento de código em child -reference mostra apenas $$prop_def e $$slot_def

  • Depois de acessar $$prop_def a lista contém bar , baz , foo (esperaria apenas baz )
  • Ao tentar definir foo , recebo "Cannot read ..." -error, mas esperaria "Props cannot be read directly from the component ..."
  • Chamar $$prop_def.baz() não funciona (consulte o erro do console)
  • Chamar child.baz() funciona conforme o esperado (consulte console.log), embora não esteja listado, mas é marcado como um erro no código do VS: "Property 'baz' does not exist on type 'Child__SvelteComponent_'. (ts2339)

Conclusão:

O preenchimento de código realmente parece tão confuso / errado que não tenho certeza se configurei algo errado. 🤔 Agradeceria muito qualquer sugestão se presumir!

Sistema (preencha as seguintes informações):

• SO: Windows 10
• IDE: VSCode 1.47.2
• Plugin / pacote: Svelte para VSCode 101.2.0

package.json relevante

"rollup": "^2.21.0",
"rollup-plugin-svelte": "^5.2.3",
"@rollup/plugin-commonjs": "^14.0.0",
"@rollup/plugin-node-resolve": "^8.4.0",
"@rollup/plugin-typescript": "^5.0.2",
"svelte": "^3.24.0",
"svelte-preprocess": "^4.0.8",
"tslib": "^2.0.0",
"typescript": "^3.9.7"

tsconfig.json

"compilerOptions": {
        "target": "es2017",
        "strict": false, 
        "moduleResolution": "node",
        "allowJs": false,
        "lib": [
            "es2017", "DOM"
        ],
        "types": [
            "svelte"
        ],
        "baseUrl": "."
    },
    "include": [
        "./src"
      ]
}

Obrigada!