Direct component props injection

[inZaCz]

It would be nice if we can put into route something like componentProps which will be then usable directly in <RenderedComponent {route} {...componentProps} /> in router.svelte

Also adding componentProps to route definition alongside compo.
Then we will able to use it correct svelte way:
let { prop1, prop2, } = $props();

Because now it is only accessible inside the {route} property and rendered components needs to find it inside the structure. This limits reusability of components.

using
component: () =>mount(Compo, {target, ...props}) in route declaration does not work well because of target and the Router rendering

[mateothegreat]

Brilliant, implemented!

npm install @mateothegreat/svelte5-router@latest

❤

See: f6d56a0

[inZaCz]

This is awesome, i have already find usage for this, but it is not what I meant. I was thinking more like to be
router.svelte

<RenderableComponent
  {route}
  {...{...rest, ...route.route?.props}}
 />

because the description in the export class Route of the props is

/**
   * The props to pass to the component.
   *
   * @optional If a value is provided, the component will receive this value in $props().
   */

[mateothegreat]

I think I get it now 😁

I've bubbled down both the <Router foo="bar" /> and routes=[{ ... baz: "kewl" ... }] to the component passed on the route directly.

See: f821ff2

Update with:

npm install @mateothegreat/svelte5-router@2.15.3

Let me know if that helps!