From d9548444d7da9c9635fb3bd01bebb1ce00c33798 Mon Sep 17 00:00:00 2001 From: Matt Perry Date: Thu, 13 Jul 2023 16:47:26 +0200 Subject: [PATCH 1/2] Updating --- .../framer-motion/src/render/dom/DOMVisualElement.ts | 12 +++++++++++- packages/framer-motion/src/render/utils/setters.ts | 4 +++- 2 files changed, 14 insertions(+), 2 deletions(-) diff --git a/packages/framer-motion/src/render/dom/DOMVisualElement.ts b/packages/framer-motion/src/render/dom/DOMVisualElement.ts index 61932f9c21..fef09717af 100644 --- a/packages/framer-motion/src/render/dom/DOMVisualElement.ts +++ b/packages/framer-motion/src/render/dom/DOMVisualElement.ts @@ -54,7 +54,17 @@ export abstract class DOMVisualElement< } if (isMounted) { - checkTargetForNewValues(this, target, origin as any) + const newValues = checkTargetForNewValues( + this, + target, + origin as any + ) + + // If new values have been added, for instance named color values, transform these + if (transformValues && newValues) { + origin = transformValues(origin as any) + } + const parsed = parseDomVariant(this, target, origin, transitionEnd) transitionEnd = parsed.transitionEnd target = parsed.target diff --git a/packages/framer-motion/src/render/utils/setters.ts b/packages/framer-motion/src/render/utils/setters.ts index 74f58c2543..09df834a38 100644 --- a/packages/framer-motion/src/render/utils/setters.ts +++ b/packages/framer-motion/src/render/utils/setters.ts @@ -91,7 +91,7 @@ export function checkTargetForNewValues( const numNewValues = newValueKeys.length - if (!numNewValues) return + if (!numNewValues) return false for (let i = 0; i < numNewValues; i++) { const key = newValueKeys[i] @@ -140,6 +140,8 @@ export function checkTargetForNewValues( } if (value !== null) visualElement.setBaseTarget(key, value) } + + return true } export function getOriginFromTransition(key: string, transition: Transition) { From 48aa31b522084452129002ed4563df1af1003f78 Mon Sep 17 00:00:00 2001 From: Matt Perry Date: Thu, 13 Jul 2023 16:49:11 +0200 Subject: [PATCH 2/2] Explicit return type --- packages/framer-motion/src/render/utils/setters.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/framer-motion/src/render/utils/setters.ts b/packages/framer-motion/src/render/utils/setters.ts index 09df834a38..c1f6cf0e33 100644 --- a/packages/framer-motion/src/render/utils/setters.ts +++ b/packages/framer-motion/src/render/utils/setters.ts @@ -84,7 +84,7 @@ export function checkTargetForNewValues( visualElement: VisualElement, target: TargetWithKeyframes, origin: ResolvedValues -) { +): boolean { const newValueKeys = Object.keys(target).filter( (key) => !visualElement.hasValue(key) )