fix: Parameters with default values are optional

Author: bfanger

src/runtime/animate/index.ts

@@ -11,9 +11,9 @@ export interface AnimationConfig {
 }
 
 interface FlipParams {
-	delay: number;
-	duration: number | ((len: number) => number);
-	easing: (t: number) => number;
+	delay?: number;
+	duration?: number | ((len: number) => number);
+	easing?: (t: number) => number;
 }
 
 export function flip(node: Element, animation: { from: DOMRect; to: DOMRect }, params: FlipParams): AnimationConfig {

src/runtime/transition/index.ts

@@ -12,11 +12,11 @@ export interface TransitionConfig {
 }
 
 interface BlurParams {
-	delay: number;
-	duration: number;
+	delay?: number;
+	duration?: number;
 	easing?: EasingFunction;
-	amount: number;
-	opacity: number;
+	amount?: number;
+	opacity?: number;
 }
 
 export function blur(node: Element, {
@@ -25,7 +25,7 @@ export function blur(node: Element, {
 	easing = cubicInOut,
 	amount = 5,
 	opacity = 0
-}: BlurParams): TransitionConfig {
+}: BlurParams = {}): TransitionConfig {
 	const style = getComputedStyle(node);
 	const target_opacity = +style.opacity;
 	const f = style.filter === 'none' ? '' : style.filter;
@@ -41,16 +41,16 @@ export function blur(node: Element, {
 }
 
 interface FadeParams {
-	delay: number;
-	duration: number;
-	easing: EasingFunction;
+	delay?: number;
+	duration?: number;
+	easing?: EasingFunction;
 }
 
 export function fade(node: Element, {
 	delay = 0,
 	duration = 400,
 	easing = linear
-}: FadeParams): TransitionConfig {
+}: FadeParams = {}): TransitionConfig {
 	const o = +getComputedStyle(node).opacity;
 
 	return {
@@ -62,12 +62,12 @@ export function fade(node: Element, {
 }
 
 interface FlyParams {
-	delay: number;
-	duration: number;
-	easing: EasingFunction;
-	x: number;
-	y: number;
-	opacity: number;
+	delay?: number;
+	duration?: number;
+	easing?: EasingFunction;
+	x?: number;
+	y?: number;
+	opacity?: number;
 }
 
 export function fly(node: Element, {
@@ -77,7 +77,7 @@ export function fly(node: Element, {
 	x = 0,
 	y = 0,
 	opacity = 0
-}: FlyParams): TransitionConfig {
+}: FlyParams = {}): TransitionConfig {
 	const style = getComputedStyle(node);
 	const target_opacity = +style.opacity;
 	const transform = style.transform === 'none' ? '' : style.transform;
@@ -95,16 +95,16 @@ export function fly(node: Element, {
 }
 
 interface SlideParams {
-	delay: number;
-	duration: number;
-	easing: EasingFunction;
+	delay?: number;
+	duration?: number;
+	easing?: EasingFunction;
 }
 
 export function slide(node: Element, {
 	delay = 0,
 	duration = 400,
 	easing = cubicOut
-}: SlideParams): TransitionConfig {
+}: SlideParams = {}): TransitionConfig {
 	const style = getComputedStyle(node);
 	const opacity = +style.opacity;
 	const height = parseFloat(style.height);
@@ -133,11 +133,11 @@ export function slide(node: Element, {
 }
 
 interface ScaleParams {
-	delay: number;
-	duration: number;
-	easing: EasingFunction;
-	start: number;
-	opacity: number;
+	delay?: number;
+	duration?: number;
+	easing?: EasingFunction;
+	start?: number;
+	opacity?: number;
 }
 
 export function scale(node: Element, {
@@ -146,7 +146,7 @@ export function scale(node: Element, {
 	easing = cubicOut,
 	start = 0,
 	opacity = 0
-}: ScaleParams): TransitionConfig {
+}: ScaleParams = {}): TransitionConfig {
 	const style = getComputedStyle(node);
 	const target_opacity = +style.opacity;
 	const transform = style.transform === 'none' ? '' : style.transform;
@@ -166,18 +166,18 @@ export function scale(node: Element, {
 }
 
 interface DrawParams {
-	delay: number;
-	speed: number;
-	duration: number | ((len: number) => number);
-	easing: EasingFunction;
+	delay?: number;
+	speed?: number;
+	duration?: number | ((len: number) => number);
+	easing?: EasingFunction;
 }
 
 export function draw(node: SVGElement & { getTotalLength(): number }, {
 	delay = 0,
 	speed,
 	duration,
 	easing = cubicInOut
-}: DrawParams): TransitionConfig {
+}: DrawParams = {}): TransitionConfig {
 	const len = node.getTotalLength();
 
 	if (duration === undefined) {
@@ -199,9 +199,9 @@ export function draw(node: SVGElement & { getTotalLength(): number }, {
 }
 
 interface CrossfadeParams {
-	delay: number;
-	duration: number | ((len: number) => number);
-	easing: EasingFunction;
+	delay?: number;
+	duration?: number | ((len: number) => number);
+	easing?: EasingFunction;
 }
 
 type ClientRectMap = Map<any, { rect: ClientRect }>;
@@ -212,7 +212,7 @@ export function crossfade({ fallback, ...defaults }: CrossfadeParams & {
 	const to_receive: ClientRectMap = new Map();
 	const to_send: ClientRectMap = new Map();
 
-	function crossfade(from: ClientRect, node: Element, params: CrossfadeParams): TransitionConfig {
+	function crossfade(from: ClientRect, node: Element, params: CrossfadeParams = {}): TransitionConfig {
 		const {
 			delay = 0,
 			duration = d => Math.sqrt(d) * 30,