refactor: split animation helpers by domain

2 files changed, 27 insertions, 4 deletions

diff --git a/apps/web/src/graphics/components/graphic-tab.tsx b/apps/web/src/graphics/components/graphic-tab.tsx
index 549ef4b6..13cd7b84 100644
--- a/apps/web/src/graphics/components/graphic-tab.tsx
+++ b/apps/web/src/graphics/components/graphic-tab.tsx
@@ -6,10 +6,9 @@ import {
 	useKeyframedParamProperty,

 	type KeyframedParamPropertyResult,

 } from "@/components/editor/panels/properties/hooks/use-keyframed-param-property";

-import { resolveGraphicParamsAtTime } from "@/animation";

 import type { ParamDefinition, ParamValues } from "@/params";

 import type { GraphicElement } from "@/timeline";

-import { graphicsRegistry, registerDefaultGraphics } from "@/graphics";

+import { graphicsRegistry, registerDefaultGraphics, resolveGraphicElementParamsAtTime } from "@/graphics";

 import { useElementPreview } from "@/timeline/hooks/use-element-preview";

 import { useEditor } from "@/editor/use-editor";

 import {

@@ -49,7 +48,7 @@ export function GraphicTab({
 	});

 

 	const liveElement = renderElement as GraphicElement;

-	const resolvedParams = resolveGraphicParamsAtTime({

+	const resolvedParams = resolveGraphicElementParamsAtTime({

 		element: liveElement,

 		localTime,

 	});

@@ -104,7 +103,7 @@ function StrokeSection({
 	});

 

 	const liveElement = renderElement as GraphicElement;

-	const resolvedParams = resolveGraphicParamsAtTime({

+	const resolvedParams = resolveGraphicElementParamsAtTime({

 		element: liveElement,

 		localTime,

 	});

diff --git a/apps/web/src/graphics/index.ts b/apps/web/src/graphics/index.ts
index c69a4ab0..3f277d40 100644
--- a/apps/web/src/graphics/index.ts
+++ b/apps/web/src/graphics/index.ts
@@ -1,3 +1,5 @@
+import { resolveGraphicParamsAtTime } from "@/animation";

+import type { ElementAnimations } from "@/animation/types";

 import { buildDefaultParamValues } from "@/params/registry";

 import type { ParamValues } from "@/params";

 import { graphicsRegistry } from "./registry";

@@ -68,6 +70,28 @@ export function resolveGraphicParams(
 	};

 }

 

+export function resolveGraphicElementParamsAtTime({

+	element,

+	localTime,

+}: {

+	element: {

+		definitionId: string;

+		params: ParamValues;

+		animations?: ElementAnimations;

+	};

+	localTime: number;

+}): ParamValues {

+	const definition = getGraphicDefinition({

+		definitionId: element.definitionId,

+	});

+	return resolveGraphicParamsAtTime({

+		params: resolveGraphicParams(definition, element.params),

+		definitions: definition.params,

+		animations: element.animations,

+		localTime,

+	});

+}

+

 export function buildGraphicPreviewUrl({

 	definitionId,

 	params,