From ac3c7bbdd7a5afc11e9181d1cf78c3dc76a87c70 Mon Sep 17 00:00:00 2001
From: Breno Lira <brenoliradev@gmail.com>
Date: Tue, 29 Oct 2024 23:26:27 -0300
Subject: [PATCH] feat: adds rotation property

---
 packages/svelte/src/animate/index.js    | 5 +++--
 packages/svelte/src/animate/public.d.ts | 1 +
 packages/svelte/types/index.d.ts        | 1 +
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/svelte/src/animate/index.js b/packages/svelte/src/animate/index.js
index fbf2ac83e2a7..d102e04a19bd 100644
--- a/packages/svelte/src/animate/index.js
+++ b/packages/svelte/src/animate/index.js
@@ -21,7 +21,7 @@ export function flip(node, { from, to }, params = {}) {
 
 	var dx = (from.left + dsx * ox - (to.left + ox)) / zoom;
 	var dy = (from.top + dsy * oy - (to.top + oy)) / zoom;
-	var { delay = 0, duration = (d) => Math.sqrt(d) * 120, easing = cubicOut } = params;
+	var { delay = 0, duration = (d) => Math.sqrt(d) * 120, easing = cubicOut, rotation = 0 } = params;
 
 	return {
 		delay,
@@ -30,9 +30,10 @@ export function flip(node, { from, to }, params = {}) {
 		css: (t, u) => {
 			var x = u * dx;
 			var y = u * dy;
+			var r = u * rotation;
 			var sx = t + u * dsx;
 			var sy = t + u * dsy;
-			return `transform: ${transform} scale(${sx}, ${sy}) translate(${x}px, ${y}px);`;
+			return `transform: ${transform} scale(${sx}, ${sy}) translate(${x}px, ${y}px) rotate(${r}deg);`;
 		}
 	};
 }
diff --git a/packages/svelte/src/animate/public.d.ts b/packages/svelte/src/animate/public.d.ts
index 8a6cf5ebf659..f0609756401f 100644
--- a/packages/svelte/src/animate/public.d.ts
+++ b/packages/svelte/src/animate/public.d.ts
@@ -11,6 +11,7 @@ export interface FlipParams {
 	delay?: number;
 	duration?: number | ((len: number) => number);
 	easing?: (t: number) => number;
+	rotation?: number;
 }
 
 export * from './index.js';
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index ebf17db6e2ff..bff1f61c19b8 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -581,6 +581,7 @@ declare module 'svelte/animate' {
 		delay?: number;
 		duration?: number | ((len: number) => number);
 		easing?: (t: number) => number;
+		rotation?: number;
 	}
 	/**
 	 * The flip function calculates the start and end position of an element and animates between them, translating the x and y values.