svelte/documentation/docs/99-legacy/04-legacy-$$props-and-$$restProps.md

title
$$props and $$restProps

In runes mode, getting an object containing all the props that were passed in is easy, using the $props rune.

In legacy mode, we use $$props and $$restProps:

• $$props contains all the props that were passed in, including ones that are not individually declared with the export keyword
• $$restProps contains all the props that were passed in except the ones that were individually declared

For example, a <Button> component might need to pass along all its props to its own <button> element, except the variant prop:

<script>
	export let variant;
</script>

<button {...$$restProps} class="variant-{variant} {$$props.class ?? ''}">
	click me
</button>

<style>
	.variant-danger {
		background: red;
	}
</style>

In Svelte 3/4 using $$props and $$restProps creates a modest performance penalty, so they should only be used when needed.