Skip to content

Docs don't show how to type a dynamic component's bound variable #15988

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
anxpara opened this issue May 22, 2025 · 0 comments
Open

Docs don't show how to type a dynamic component's bound variable #15988

anxpara opened this issue May 22, 2025 · 0 comments

Comments

@anxpara
Copy link

anxpara commented May 22, 2025

Describe the bug

The typescript section of the docs shows how to make a dynamic component, but doesn't show how to bind the instance. Migrating from svelte 4 to 5 has been confusing, because my compiler keeps giving me errors and hover hints in terms of the old SvelteComponent.

I posted in the discord server, and we landed on this type:

<script lang="ts">
  import type { Component } from 'svelte';

  interface Props {
    // only components that have at most the "prop"
    // property required can be passed
    DynamicComponent: Component<{ prop: string }>;
  }

  let { DynamicComponent }: Props = $props();

  let dynamicComponent: ReturnType<DynamicComponent>;
</script>

<DynamicComponent bind:this={dynamicComponent} prop="foo" />

Is this the intended way to type a dynamic component 's bound variable? The docs should be updated with an example of whichever type is intended.

Reproduction

The svelte playground completely ignores type annotations :(

Logs

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 Intel(R) Core(TM) i7-6800K CPU @ 3.40GHz
    Memory: 16.97 GB / 31.90 GB
  Binaries:
    Node: 18.18.2 - C:\Program Files\nodejs\node.EXE      
    npm: 10.2.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 136.0.7103.114
    Edge: Chromium (127.0.2651.74)
    Internet Explorer: 11.0.19041.4355
  npmPackages:
    svelte: ^5.0.0 => 5.28.3

Severity

annoyance

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy