Open hyunbinseo opened 3 weeks ago
I am not sure if this issue belongs in the language-tools repo.
I cannot get $props().children
to be typed, and it was raised over there.
<script>
// let children: unknown
let { children } = $props();
</script>
<!-- 'children' is of type 'unknown'.js(18046) -->
{@render children()}
To type the prop you need to type the props object and not individual props.
https://svelte-5-preview.vercel.app/docs/runes#$props
The unknown
part is generated by language-tools. But without that, it will still be inferred as any
. Not sure if it makes sense to allow it since it isn't how typescript inferred the type for destructuring.
So I guess there is no special return type for $bindable
? Is this good?
<script lang="ts">
type Props = { b: boolean };
let { b = $bindable<boolean>() }: Props = $props();
</script>
Wished this was documented in the $bindable
preview documentation.
I know TypeScript object must be typed as a whole, but still:
<script lang="ts">
let {
// Only this prop needs typing,
// but the whole Props should be typed.
showModal = $bindable<boolean>(),
closeWithBackdropClick = false,
onclose = (() => {}) as () => unknown
} = $props();
</script>
<!-- src/lib/Component.svelte -->
<script lang="ts">
// Even-though the fallback value has been provided,
let { b = $bindable(false) }: Props = $props();
// Since it is not a optional key in the Props type:
type Props = { b: boolean };
</script>
<!-- src/routes/+page.svelte -->
<script>
import Component from '$lib/Component.svelte';
</script>
<!-- Property 'b' is missing in type '{}' but required in type 'Props'. -->
<Component></Component>
Describe the bug
Cannot get
$bindable
return values to be typed.Am I missing something?
Reproduction
Same as above.
Logs
No response
System Info
Severity
annoyance