Request modifying accepted types to duration or speed for easier crossfade({fallback})

[cloudymeatball]

Describe the problem

The crossfade transition has a fallback which passes node and params into some callback function that executes an alternate transition.

This is an REPL from v3 that I've found: https://svelte.dev/repl/7b633681d5a849968771c4fe9b7e7536?version=3.18.1 Basically you'd have to resort to built-in getComputedStyle().

The other workaround is manual type-narrowing.

fallback(node, {duration, easing}) {
    if (duration == undefined || typeof duration === 'number')
        return fade(node, {duration, easing})
    else return fade(node, {duration: duration(1500), easing})
    // note that for (len: number) => number, it needs a number argument.
},

Describe the proposed solution

By restricting the type CrossfadeParams to a subset of all the other transition params, including restricting the CrossfadeParams['duration'] to number | undefined, it will (theoretically) be able to be passed into any fallback function other than draw, such as

const [send, receive] = crossfade({
    duration: 1500,
    easing: quintOut,
    fallback: fade
});

Importance

nice to have

[7nik]

Forbidding duration to be a function will make it nearly impossible to adjust the element moving speed depending on the distance, e.g. keep the same speed for any distance.

[cloudymeatball]

@7nik Another option is to add a speed attribute so crossfade can be controlled similarly to draw, but limiting crossfade({duration}) to a number. fallback is only called when there is only one element, so a duration is sensible and no calculation is needed.

[cloudymeatball]

And allow all Params to accept & { speed?: number } so fallback: fade could still work. They could implement speed for real or ignore it. On that note, a third option is to allow all Param duration to accept a (len: number) => number.