Closed
Description
Problem
SvelteHTMLElements
type used to be set of typed HTML elements, so it was possible to get the union of literals by simply getting all its keys using keyof SvelteHTMLElements
.
Now that it can be any key, autocompletion no longer works because 'a' | ''div' | string
will always be of type string
.
Use case
Auto completion for svelte:element
tag.
<script lang="ts">
import type { SvelteHTMLElements } from 'svelte/elements';
type Props = {
as: keyof SvelteHTMLElements;
};
let { as }: Props = $props();
</script>
<svelte:element this={as}></svelte:element>
Describe the proposed solution
Autocompletion is possible thanks to the & {}
trick in TS, so in this case add it to name
key. Preserves that the key can be any string, and adds autocompletion.
# packages/svelte/elements.d.ts
- [name: string]: { [name: string]: any };
+ [name: string & {}]: { [name: string]: any };
If it makes sense to you, I have a branch ready with changes.
Importance
would make my life easier
Metadata
Metadata
Assignees
Labels
No labels