You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Typescript types don't seem to be generated for use when binding a component instance via bind:this - but only when the bound component is in runes mode.
Edit to add: this is a tooling issue only. The component instance binding and use of exported functions works great in both cases.
Create two components, exporting a function. Use runes in one.
<script lang="ts">
export function saySimpleComponent() {
alert('Simple Component');
}
</script>
<script lang="ts">
let message = $state('Runes Mode Component');
export function sayRunesModeComponent() {
alert(message);
}
</script>
Import and bind to the components from a parent component/page.
<script lang="ts">
import SimpleComponent from '$lib/Simple.svelte';
import RunesModeComponent from '$lib/RunesMode.svelte';
let simpleComponent: SimpleComponent;
let runesModeComponent: RunesModeComponent;
</script>
<SimpleComponent bind:this={simpleComponent}></SimpleComponent>
<RunesModeComponent bind:this={runesModeComponent}></RunesModeComponent>
<button
onclick={() => {
simpleComponent.saySimpleComponent();
}}>Simple Component</button
>
<button
onclick={() => {
runesModeComponent.sayRunesModeComponent();
}}>Runes Mode Component</button
>
Result:
SimpleComponent is identified as a SvelteComponent type, providing intellisense etc.
let runesModeComponent: RunesModeComponent throws "'RunesModeComponent' refers to a value, but is being used as a type here. Did you mean 'typeof RunesModeComponent'? ts(2749)". No intellisense for the exports on runesModeComponent.
Describe the bug
Typescript types don't seem to be generated for use when binding a component instance via bind:this - but only when the bound component is in runes mode.
Edit to add: this is a tooling issue only. The component instance binding and use of exported functions works great in both cases.
Reproduction
Simple repro here - https://github.com/sbmw/bind-component - but details also listed below for ease.
Create two components, exporting a function. Use runes in one.
Import and bind to the components from a parent component/page.
Result:
SimpleComponent is identified as a SvelteComponent type, providing intellisense etc.
let runesModeComponent: RunesModeComponent
throws "'RunesModeComponent' refers to a value, but is being used as a type here. Did you mean 'typeof RunesModeComponent'? ts(2749)". No intellisense for the exports onrunesModeComponent
.Logs
No response
System Info
Severity
annoyance
The text was updated successfully, but these errors were encountered: