feat: make render options optional

[Rich-Harris]

no need to make people do render(Thing, { props: {} }) instead of render(Thing)

Before submitting the PR, please make sure you do the following

• It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
• Prefix your PR title with feat:, fix:, chore:, or docs:.
• This message body should clearly illustrate what problems it solves.
• Ideally, include a test that fails without this PR but passes with it.

Tests and linting

• Run the tests with pnpm test and lint the project with pnpm lint

[changeset-bot]

🦋 Changeset detected

Latest commit: 8ce0a54

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
svelte	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[dummdidumm]

We need to take into account the "there are required properties" case, at which point they are required. Probably needs a function overload to make that happen. Possibly same for mount/hydrate

[Conduitry]

Can we tell TypeScript that omitting the argument is equivalent to passing { props: {} }, and then have that throw a type error when it skips required props? Or is TS not that smart?

[paoloricciuti]

Can we tell TypeScript that omitting the argument is equivalent to passing { props: {} }, and then have that throw a type error when it skips required props? Or is TS not that smart?

I think it's doable with something like this (it's also already used for the actions if i'm not mistaken.

Dunno if it's doable checking if all the properties are optional tho.

EDIT:

i think i got it https://tsplay.dev/wQBZjN scratch that using the right types from svelte it doesn't work. trying other stuff

EDIT AGAIN:

this time for real

[paoloricciuti]

I took a shot at implementing it but feel free to either steal and close or change whatever you want

#12115

[dummdidumm]

I think something along the lines of this should do the trick:

declare function render<
  T extends SvelteComponent<any> | Component<any>,
  Props extends ComponentProps<T> = ComponentProps<T>,
>(
  component: T extends SvelteComponent<any> ? ComponentType<T> : T,
  options: { props: Props }
): void;
declare function render<
  T extends SvelteComponent<any> | Component<any>,
  Props extends ComponentProps<T> = ComponentProps<T>,
>(
  component: {} extends Props ? T extends SvelteComponent<any> ? ComponentType<T> : T : "second argument to render function is required",
  options?: { props: Props }
): void;

[paoloricciuti]

I think something along the lines of this should do the trick:

declare function render<
  T extends SvelteComponent<any> | Component<any>,
  Props extends ComponentProps<T> = ComponentProps<T>,
>(
  component: T extends SvelteComponent<any> ? ComponentType<T> : T,
  options: { props: Props }
): void;
declare function render<
  T extends SvelteComponent<any> | Component<any>,
  Props extends ComponentProps<T> = ComponentProps<T>,
>(
  component: {} extends Props ? T extends SvelteComponent<any> ? ComponentType<T> : T : "second argument to render function is required",
  options?: { props: Props }
): void;

{} extends Props will not work since in TS {} is just not null or undefined. But I have an IsEmpty utility type in my PR that should work and you can steal

[dummdidumm]

Your playground says otherwise

[paoloricciuti]

Your playground says otherwise

Oh wow...I spent a bunch of time for nothing yesterday lol. I guess is because {} comes first

[dummdidumm]

Yeah {} is really weird - it means "any non-null value" in some places and the empty object in others.

[dummdidumm]

had to move this into a d.ts file - JSDoc was too limiting to properly type this without type errors