In my Svelte project, I am working on a portal system where a component is passed using a store to display at a higher level in the component tree.
My current struggle lies in typing the store correctly. I attempted to declare it like this:
const modalComponent = writable<SvelteComponent>(null)
However, this approach is not successful. When importing a component, VS Code displays a type of
typeof <componentName>__SvelteComponent_
, which does not align with the SvelteComponent
type (an alias of SvelteComponentDev
):
Type 'typeof <component>__SvelteComponent_' is missing the following properties from type 'SvelteComponentDev': $set, $on, $destroy, $capture_state, and 2 more.
How should I properly type this without resorting to using any
?
Update: Check out this codesandbox that demonstrates the issue. Unfortunately, I haven't been able to make it work with TypeScript yet. Still sharing in case it can provide some insight.