interpolate() — svelte Function Reference

Architecture documentation for the interpolate() function in animation-helpers.js from the svelte codebase.

Function javascript BuildSystem QualityControl called by 1

Entity Profile

BuildSystem→ QualityControl→ interpolate() — svelte Function Reference

Dependency Diagram

graph TD
  53810586_8a4b_fcb0_de2b_1a8dcbf51d4a["interpolate()"]
  e34c4197_0d2d_5f9c_9313_0d10c3cf054c["animation-helpers.js"]
  53810586_8a4b_fcb0_de2b_1a8dcbf51d4a -->|defined in| e34c4197_0d2d_5f9c_9313_0d10c3cf054c
  1178bca5_bbb4_558b_494c_889a96fd3acc["t()"]
  1178bca5_bbb4_558b_494c_889a96fd3acc -->|calls| 53810586_8a4b_fcb0_de2b_1a8dcbf51d4a
  style 53810586_8a4b_fcb0_de2b_1a8dcbf51d4a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/tests/animation-helpers.js lines 170–197

function interpolate(a, b, p) {
	if (a === b) return a;

	const fallback = p < 0.5 ? a : b;

	const a_match = a.match(/[\d.]+|[^\d.]+/g);
	const b_match = b.match(/[\d.]+|[^\d.]+/g);

	if (!a_match || !b_match) return fallback;
	if (a_match.length !== b_match.length) return fallback;

	let result = '';

	for (let i = 0; i < a_match.length; i += 2) {
		const a_num = parseFloat(a_match[i]);
		const b_num = parseFloat(b_match[i]);
		result += a_num + (b_num - a_num) * p;

		if (a_match[i + 1] !== b_match[i + 1]) {
			// bail
			return fallback;
		}

		result += a_match[i + 1] ?? '';
	}

	return result;
}