WIP

packages/svelte/src/internal/client/dom/elements/transitions.js

@@ -1,4 +1,4 @@
-/** @import { AnimateFn, Animation, AnimationConfig, EachItem, Effect, TransitionFn, TransitionManager } from '#client' */
+/** @import { AnimateFn, Animation, AnimationConfig, EachItem, Effect, EffectNodes, TransitionFn, TransitionManager } from '#client' */
 import { noop, is_function } from '../../../shared/utils.js';
 import { effect } from '../../reactivity/effects.js';
 import { active_effect, untrack } from '../../runtime.js';
@@ -265,9 +265,9 @@ export function transition(flags, element, get_fn, get_params) {
 		}
 	};
 
-	var e = /** @type {Effect} */ (active_effect);
+	var e = /** @type {Effect & { nodes: EffectNodes }} */ (active_effect);
 
-	(e.transitions ??= []).push(transition);
+	(e.nodes.t ??= []).push(transition);
 
 	// if this is a local transition, we only want to run it if the parent (branch) effect's
 	// parent (block) effect is where the state change happened. we can determine that by

packages/svelte/src/internal/client/dom/template.js

@@ -29,7 +29,7 @@ import { COMMENT_NODE, DOCUMENT_FRAGMENT_NODE, EFFECT_RAN, TEXT_NODE } from '#cl
 export function assign_nodes(start, end) {
 	var effect = /** @type {Effect} */ (active_effect);
 	if (effect.nodes === null) {
-		effect.nodes = { start, end };
+		effect.nodes = { start, end, a: null, t: null };
 	}
 }
 

packages/svelte/src/internal/client/reactivity/effects.js

@@ -111,7 +111,6 @@ function create_effect(type, fn, sync) {
 		b: parent && parent.b,
 		prev: null,
 		teardown: null,
-		transitions: null,
 		wv: 0,
 		ac: null
 	};
@@ -507,7 +506,7 @@ export function destroy_effect(effect, remove_dom = true) {
 	remove_reactions(effect, 0);
 	set_signal_status(effect, DESTROYED);
 
-	var transitions = effect.transitions;
+	var transitions = effect.nodes && effect.nodes.t;
 
 	if (transitions !== null) {
 		for (const transition of transitions) {
@@ -622,8 +621,10 @@ export function pause_children(effect, transitions, local) {
 	if ((effect.f & INERT) !== 0) return;
 	effect.f ^= INERT;
 
-	if (effect.transitions !== null) {
-		for (const transition of effect.transitions) {
+	var t = effect.nodes && effect.nodes.t;
+
+	if (t !== null) {
+		for (const transition of t) {
 			if (transition.is_global || local) {
 				transitions.push(transition);
 			}
@@ -686,8 +687,10 @@ function resume_children(effect, local) {
 		child = sibling;
 	}
 
-	if (effect.transitions !== null) {
-		for (const transition of effect.transitions) {
+	var t = effect.nodes && effect.nodes.t;
+
+	if (t !== null) {
+		for (const transition of t) {
 			if (transition.is_global || local) {
 				transition.in();
 			}

packages/svelte/src/internal/client/reactivity/types.d.ts

@@ -1,4 +1,5 @@
 import type {
+	AnimationManager,
 	ComponentContext,
 	DevStackEntry,
 	Equals,
@@ -63,6 +64,10 @@ export interface Derived<V = unknown> extends Value<V>, Reaction {
 export interface EffectNodes {
 	start: TemplateNode;
 	end: TemplateNode | null;
+	/** $.animation */
+	a: AnimationManager | null;
+	/** $.transition */
+	t: TransitionManager[] | null;
 }
 
 export interface Effect extends Reaction {
@@ -77,8 +82,6 @@ export interface Effect extends Reaction {
 	fn: null | (() => void | (() => void));
 	/** The teardown function returned from the effect function */
 	teardown: null | (() => void);
-	/** Transition managers created with `$.transition` */
-	transitions: null | TransitionManager[];
 	/** Next sibling child effect created inside the parent signal */
 	prev: null | Effect;
 	/** Next sibling child effect created inside the parent signal */