react-native-reanimated 3.19.4 → 3.19.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Common/cpp/reanimated/LayoutAnimations/LayoutAnimationsProxy.cpp +34 -8
- package/Common/cpp/reanimated/LayoutAnimations/LayoutAnimationsProxy.h +26 -2
- package/Common/cpp/reanimated/NativeModules/ReanimatedModuleProxy.cpp +1 -1
- package/Common/cpp/reanimated/Tools/ReanimatedSystraceSection.h +1 -1
- package/apple/reanimated/apple/LayoutReanimation/REASharedTransitionManager.m +1 -2
- package/apple/reanimated/apple/LayoutReanimation/REASwizzledUIManager.mm +10 -9
- package/lib/module/layoutReanimation/web/animationsManager.js +2 -2
- package/lib/module/layoutReanimation/web/animationsManager.js.map +1 -1
- package/lib/module/layoutReanimation/web/componentUtils.js +42 -2
- package/lib/module/layoutReanimation/web/componentUtils.js.map +1 -1
- package/lib/module/layoutReanimation/web/createAnimation.js +45 -36
- package/lib/module/layoutReanimation/web/createAnimation.js.map +1 -1
- package/lib/module/platform-specific/jsVersion.js +1 -1
- package/lib/typescript/layoutReanimation/web/animationsManager.d.ts.map +1 -1
- package/lib/typescript/layoutReanimation/web/componentUtils.d.ts.map +1 -1
- package/lib/typescript/layoutReanimation/web/createAnimation.d.ts +3 -2
- package/lib/typescript/layoutReanimation/web/createAnimation.d.ts.map +1 -1
- package/lib/typescript/platform-specific/jsVersion.d.ts +1 -1
- package/package.json +2 -2
- package/src/layoutReanimation/web/animationsManager.ts +4 -2
- package/src/layoutReanimation/web/componentUtils.ts +54 -2
- package/src/layoutReanimation/web/createAnimation.ts +60 -38
- package/src/platform-specific/jsVersion.ts +1 -1
|
@@ -31,6 +31,7 @@ std::optional<MountingTransaction> LayoutAnimationsProxy::pullTransaction(
|
|
|
31
31
|
auto lock = std::unique_lock<std::recursive_mutex>(mutex);
|
|
32
32
|
PropsParserContext propsParserContext{surfaceId, *contextContainer_};
|
|
33
33
|
ShadowViewMutationList filteredMutations;
|
|
34
|
+
auto &[deadNodes] = surfaceContext_[surfaceId];
|
|
34
35
|
|
|
35
36
|
std::vector<std::shared_ptr<MutationNode>> roots;
|
|
36
37
|
std::unordered_map<Tag, Tag> movedViews;
|
|
@@ -49,7 +50,9 @@ std::optional<MountingTransaction> LayoutAnimationsProxy::pullTransaction(
|
|
|
49
50
|
|
|
50
51
|
parseRemoveMutations(movedViews, mutations, roots);
|
|
51
52
|
|
|
52
|
-
|
|
53
|
+
auto shouldAnimate = !surfacesToRemove_.contains(surfaceId);
|
|
54
|
+
surfacesToRemove_.erase(surfaceId);
|
|
55
|
+
handleRemovals(filteredMutations, roots, deadNodes, shouldAnimate);
|
|
53
56
|
|
|
54
57
|
handleUpdatesAndEnterings(
|
|
55
58
|
filteredMutations, movedViews, mutations, propsParserContext, surfaceId);
|
|
@@ -134,6 +137,7 @@ std::optional<SurfaceId> LayoutAnimationsProxy::endLayoutAnimation(
|
|
|
134
137
|
auto node = nodeForTag_[tag];
|
|
135
138
|
auto mutationNode = std::static_pointer_cast<MutationNode>(node);
|
|
136
139
|
mutationNode->state = DEAD;
|
|
140
|
+
auto &[deadNodes] = surfaceContext_[surfaceId];
|
|
137
141
|
deadNodes.insert(mutationNode);
|
|
138
142
|
|
|
139
143
|
return surfaceId;
|
|
@@ -253,13 +257,15 @@ void LayoutAnimationsProxy::parseRemoveMutations(
|
|
|
253
257
|
|
|
254
258
|
void LayoutAnimationsProxy::handleRemovals(
|
|
255
259
|
ShadowViewMutationList &filteredMutations,
|
|
256
|
-
std::vector<std::shared_ptr<MutationNode>> &roots
|
|
260
|
+
std::vector<std::shared_ptr<MutationNode>> &roots,
|
|
261
|
+
std::unordered_set<std::shared_ptr<MutationNode>> &deadNodes,
|
|
262
|
+
bool shouldAnimate) const {
|
|
257
263
|
// iterate from the end, so that children
|
|
258
264
|
// with higher indices appear first in the mutations list
|
|
259
265
|
for (auto it = roots.rbegin(); it != roots.rend(); it++) {
|
|
260
266
|
auto &node = *it;
|
|
261
267
|
if (!startAnimationsRecursively(
|
|
262
|
-
node, true,
|
|
268
|
+
node, true, shouldAnimate, false, filteredMutations)) {
|
|
263
269
|
filteredMutations.push_back(node->mutation);
|
|
264
270
|
node->unflattenedParent->removeChildFromUnflattenedTree(node); //???
|
|
265
271
|
if (node->state != MOVED) {
|
|
@@ -725,15 +731,16 @@ void LayoutAnimationsProxy::startEnteringAnimation(
|
|
|
725
731
|
auto &mutex = strongThis->mutex;
|
|
726
732
|
auto lock = std::unique_lock<std::recursive_mutex>(mutex);
|
|
727
733
|
strongThis->layoutAnimations_.insert_or_assign(
|
|
728
|
-
tag,
|
|
729
|
-
|
|
734
|
+
tag,
|
|
735
|
+
LayoutAnimation{
|
|
736
|
+
finalView,
|
|
737
|
+
current,
|
|
730
738
|
#if REACT_NATIVE_MINOR_VERSION >= 78
|
|
731
|
-
|
|
739
|
+
mutation.parentTag,
|
|
732
740
|
#else
|
|
733
741
|
parent,
|
|
734
742
|
#endif // REACT_NATIVE_MINOR_VERSION >= 78
|
|
735
|
-
|
|
736
|
-
});
|
|
743
|
+
opacity});
|
|
737
744
|
window = strongThis->surfaceManager.getWindow(
|
|
738
745
|
mutation.newChildShadowView.surfaceId);
|
|
739
746
|
}
|
|
@@ -998,6 +1005,25 @@ const ShadowNode *LayoutAnimationsProxy::findInShadowTreeByTag(
|
|
|
998
1005
|
}
|
|
999
1006
|
#endif // ANDROID
|
|
1000
1007
|
|
|
1008
|
+
// UIManagerAnimationDelegate
|
|
1009
|
+
|
|
1010
|
+
void LayoutAnimationsProxy::uiManagerDidConfigureNextLayoutAnimation(
|
|
1011
|
+
jsi::Runtime &runtime,
|
|
1012
|
+
const RawValue &config,
|
|
1013
|
+
const jsi::Value &successCallbackValue,
|
|
1014
|
+
const jsi::Value &failureCallbackValue) const {}
|
|
1015
|
+
|
|
1016
|
+
void LayoutAnimationsProxy::setComponentDescriptorRegistry(
|
|
1017
|
+
const SharedComponentDescriptorRegistry &componentDescriptorRegistry) {}
|
|
1018
|
+
|
|
1019
|
+
bool LayoutAnimationsProxy::shouldAnimateFrame() const {
|
|
1020
|
+
return false;
|
|
1021
|
+
}
|
|
1022
|
+
|
|
1023
|
+
void LayoutAnimationsProxy::stopSurface(SurfaceId surfaceId) {
|
|
1024
|
+
surfacesToRemove_.insert(surfaceId);
|
|
1025
|
+
}
|
|
1026
|
+
|
|
1001
1027
|
} // namespace reanimated
|
|
1002
1028
|
|
|
1003
1029
|
#endif // RCT_NEW_ARCH_ENABLED
|
|
@@ -12,6 +12,7 @@
|
|
|
12
12
|
#include <react/renderer/mounting/MountingOverrideDelegate.h>
|
|
13
13
|
#include <react/renderer/mounting/ShadowView.h>
|
|
14
14
|
#include <react/renderer/scheduler/Scheduler.h>
|
|
15
|
+
#include <react/renderer/uimanager/UIManagerAnimationDelegate.h>
|
|
15
16
|
#include <react/renderer/uimanager/UIManagerBinding.h>
|
|
16
17
|
|
|
17
18
|
#include <memory>
|
|
@@ -39,15 +40,21 @@ struct LayoutAnimation {
|
|
|
39
40
|
LayoutAnimation &operator=(const LayoutAnimation &other) = default;
|
|
40
41
|
};
|
|
41
42
|
|
|
43
|
+
struct SurfaceContext {
|
|
44
|
+
mutable std::unordered_set<std::shared_ptr<MutationNode>> deadNodes;
|
|
45
|
+
};
|
|
46
|
+
|
|
42
47
|
struct LayoutAnimationsProxy
|
|
43
48
|
: public MountingOverrideDelegate,
|
|
49
|
+
public UIManagerAnimationDelegate,
|
|
44
50
|
public std::enable_shared_from_this<LayoutAnimationsProxy> {
|
|
45
51
|
mutable std::unordered_map<Tag, std::shared_ptr<Node>> nodeForTag_;
|
|
46
52
|
mutable std::unordered_map<Tag, LayoutAnimation> layoutAnimations_;
|
|
47
53
|
mutable std::recursive_mutex mutex;
|
|
48
54
|
mutable SurfaceManager surfaceManager;
|
|
49
|
-
mutable std::
|
|
55
|
+
mutable std::unordered_map<SurfaceId, SurfaceContext> surfaceContext_;
|
|
50
56
|
mutable std::unordered_map<Tag, int> leastRemoved;
|
|
57
|
+
mutable std::unordered_set<SurfaceId> surfacesToRemove_;
|
|
51
58
|
mutable std::vector<Tag> finishedAnimationTags_;
|
|
52
59
|
std::shared_ptr<LayoutAnimationsManager> layoutAnimationsManager_;
|
|
53
60
|
ContextContainer::Shared contextContainer_;
|
|
@@ -107,7 +114,9 @@ struct LayoutAnimationsProxy
|
|
|
107
114
|
std::vector<std::shared_ptr<MutationNode>> &roots) const;
|
|
108
115
|
void handleRemovals(
|
|
109
116
|
ShadowViewMutationList &filteredMutations,
|
|
110
|
-
std::vector<std::shared_ptr<MutationNode>> &roots
|
|
117
|
+
std::vector<std::shared_ptr<MutationNode>> &roots,
|
|
118
|
+
std::unordered_set<std::shared_ptr<MutationNode>> &deadNodes,
|
|
119
|
+
bool shouldAnimate) const;
|
|
111
120
|
|
|
112
121
|
void handleUpdatesAndEnterings(
|
|
113
122
|
ShadowViewMutationList &filteredMutations,
|
|
@@ -170,6 +179,21 @@ struct LayoutAnimationsProxy
|
|
|
170
179
|
MountingTransaction::Number number,
|
|
171
180
|
const TransactionTelemetry &telemetry,
|
|
172
181
|
ShadowViewMutationList mutations) const override;
|
|
182
|
+
|
|
183
|
+
// UIManagerAnimationDelegate
|
|
184
|
+
|
|
185
|
+
void uiManagerDidConfigureNextLayoutAnimation(
|
|
186
|
+
jsi::Runtime &runtime,
|
|
187
|
+
const RawValue &config,
|
|
188
|
+
const jsi::Value &successCallbackValue,
|
|
189
|
+
const jsi::Value &failureCallbackValue) const override;
|
|
190
|
+
|
|
191
|
+
void setComponentDescriptorRegistry(const SharedComponentDescriptorRegistry &
|
|
192
|
+
componentDescriptorRegistry) override;
|
|
193
|
+
|
|
194
|
+
bool shouldAnimateFrame() const override;
|
|
195
|
+
|
|
196
|
+
void stopSurface(SurfaceId surfaceId) override;
|
|
173
197
|
};
|
|
174
198
|
|
|
175
199
|
} // namespace reanimated
|
|
@@ -933,7 +933,6 @@ void ReanimatedModuleProxy::initializeFabric(
|
|
|
933
933
|
}
|
|
934
934
|
|
|
935
935
|
void ReanimatedModuleProxy::initializeLayoutAnimationsProxy() {
|
|
936
|
-
uiManager_->setAnimationDelegate(nullptr);
|
|
937
936
|
auto scheduler = reinterpret_cast<Scheduler *>(uiManager_->getDelegate());
|
|
938
937
|
auto componentDescriptorRegistry =
|
|
939
938
|
scheduler->getContextContainer()
|
|
@@ -955,6 +954,7 @@ void ReanimatedModuleProxy::initializeLayoutAnimationsProxy() {
|
|
|
955
954
|
jsInvoker_
|
|
956
955
|
#endif
|
|
957
956
|
);
|
|
957
|
+
uiManager_->setAnimationDelegate(layoutAnimationsProxy_.get());
|
|
958
958
|
}
|
|
959
959
|
}
|
|
960
960
|
|
|
@@ -72,8 +72,7 @@ static BOOL _isConfigured = NO;
|
|
|
72
72
|
_isConfigured = NO;
|
|
73
73
|
_disappearingScreens = [NSMutableArray new];
|
|
74
74
|
_isTabNavigator = NO;
|
|
75
|
-
_findPrecedingViewTagForTransition = ^NSNumber *(NSNumber *tag)
|
|
76
|
-
{
|
|
75
|
+
_findPrecedingViewTagForTransition = ^NSNumber *(NSNumber *tag) {
|
|
77
76
|
// default implementation, this block will be replaced by a setter
|
|
78
77
|
return nil;
|
|
79
78
|
};
|
|
@@ -60,9 +60,11 @@ std::atomic<bool> hasPendingBlocks;
|
|
|
60
60
|
fromClass:[self class]];
|
|
61
61
|
SEL manageChildrenOriginal = @selector
|
|
62
62
|
(_manageChildren:moveFromIndices:moveToIndices:addChildReactTags:addAtIndices:removeAtIndices:registry:);
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
63
|
+
// clang-format off
|
|
64
|
+
SEL manageChildrenReanimated = @selector
|
|
65
|
+
(reanimated_manageChildren:
|
|
66
|
+
moveFromIndices:moveToIndices:addChildReactTags:addAtIndices:removeAtIndices:registry:);
|
|
67
|
+
// clang-format on
|
|
66
68
|
[REAUtils swizzleMethod:manageChildrenOriginal
|
|
67
69
|
forClass:[RCTUIManager class]
|
|
68
70
|
with:manageChildrenReanimated
|
|
@@ -185,12 +187,11 @@ std::atomic<bool> hasPendingBlocks;
|
|
|
185
187
|
for (RCTShadowView *shadowView in affectedShadowViews) {
|
|
186
188
|
reactTags[index] = shadowView.reactTag;
|
|
187
189
|
RCTLayoutMetrics layoutMetrics = shadowView.layoutMetrics;
|
|
188
|
-
frameDataArray[index++] = (RCTFrameData){
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
layoutMetrics.displayType};
|
|
190
|
+
frameDataArray[index++] = (RCTFrameData){layoutMetrics.frame,
|
|
191
|
+
layoutMetrics.layoutDirection,
|
|
192
|
+
shadowView.isNewView,
|
|
193
|
+
shadowView.superview.isNewView,
|
|
194
|
+
layoutMetrics.displayType};
|
|
194
195
|
}
|
|
195
196
|
}
|
|
196
197
|
|
|
@@ -58,14 +58,14 @@ function tryGetAnimationConfig(props, animationType) {
|
|
|
58
58
|
const hasInitialValues = config.initialValues !== undefined;
|
|
59
59
|
let animationName;
|
|
60
60
|
if (isCustomKeyframe) {
|
|
61
|
-
animationName = createCustomKeyFrameAnimation(config.definitions);
|
|
61
|
+
animationName = createCustomKeyFrameAnimation(config.definitions, animationType);
|
|
62
62
|
} else if (typeof config === 'function') {
|
|
63
63
|
animationName = config.presetName;
|
|
64
64
|
} else {
|
|
65
65
|
animationName = config.constructor.presetName;
|
|
66
66
|
}
|
|
67
67
|
if (hasInitialValues) {
|
|
68
|
-
animationName = createAnimationWithInitialValues(animationName, config.initialValues);
|
|
68
|
+
animationName = createAnimationWithInitialValues(animationName, config.initialValues, animationType);
|
|
69
69
|
}
|
|
70
70
|
const shouldFail = checkUndefinedAnimationFail(animationName, isLayoutTransition || isCustomKeyframe || hasInitialValues);
|
|
71
71
|
if (shouldFail) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["LayoutAnimationType","EasingNameSymbol","logger","Keyframe","makeElementVisible","getProcessedConfig","handleExitingAnimation","handleLayoutTransition","maybeModifyStyleForKeyframe","setElementAnimation","Animations","createAnimationWithInitialValues","createCustomKeyFrameAnimation","areDOMRectsEqual","chooseConfig","animationType","props","config","ENTERING","entering","EXITING","exiting","LAYOUT","layout","checkUndefinedAnimationFail","initialAnimationName","needsCustomization","warn","maybeReportOverwrittenProperties","keyframe","styles","propertyRegex","animationProperties","Set","match","matchAll","add","commonProperties","Array","from","filter","style","has","length","join","chooseAction","animationConfig","element","transitionData","reversed","tryGetAnimationConfig","isLayoutTransition","isCustomKeyframe","hasInitialValues","initialValues","undefined","animationName","definitions","presetName","constructor","shouldFail","keyframeTimestamps","Object","keys","includes","startWebLayoutAnimation","tryActivateLayoutTransition","snapshot","rect","getBoundingClientRect","enteringAnimation","enteringV","exitingAnimation","exitingV","deltaX","width","deltaY","height","translateX","x","translateY","y","scaleX","scaleY","easingX","easingXV","easingY","easingYV"],"sourceRoot":"../../../../src","sources":["layoutReanimation/web/animationsManager.ts"],"mappings":"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
|
|
1
|
+
{"version":3,"names":["LayoutAnimationType","EasingNameSymbol","logger","Keyframe","makeElementVisible","getProcessedConfig","handleExitingAnimation","handleLayoutTransition","maybeModifyStyleForKeyframe","setElementAnimation","Animations","createAnimationWithInitialValues","createCustomKeyFrameAnimation","areDOMRectsEqual","chooseConfig","animationType","props","config","ENTERING","entering","EXITING","exiting","LAYOUT","layout","checkUndefinedAnimationFail","initialAnimationName","needsCustomization","warn","maybeReportOverwrittenProperties","keyframe","styles","propertyRegex","animationProperties","Set","match","matchAll","add","commonProperties","Array","from","filter","style","has","length","join","chooseAction","animationConfig","element","transitionData","reversed","tryGetAnimationConfig","isLayoutTransition","isCustomKeyframe","hasInitialValues","initialValues","undefined","animationName","definitions","presetName","constructor","shouldFail","keyframeTimestamps","Object","keys","includes","startWebLayoutAnimation","tryActivateLayoutTransition","snapshot","rect","getBoundingClientRect","enteringAnimation","enteringV","exitingAnimation","exitingV","deltaX","width","deltaY","height","translateX","x","translateY","y","scaleX","scaleY","easingX","easingXV","easingY","easingYV"],"sourceRoot":"../../../../src","sources":["layoutReanimation/web/animationsManager.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -12,6 +12,22 @@ import { TransitionGenerator } from "./createAnimation.js";
|
|
|
12
12
|
import { scheduleAnimationCleanup } from "./domUtils.js";
|
|
13
13
|
import { getEasingByName, maybeGetBezierEasing, WebEasings } from "./Easing.web.js";
|
|
14
14
|
import { prepareCurvedTransition } from "./transition/Curved.web.js";
|
|
15
|
+
function getSnapshotForElement(element) {
|
|
16
|
+
const existingSnapshot = snapshots.get(element);
|
|
17
|
+
if (existingSnapshot) {
|
|
18
|
+
return existingSnapshot;
|
|
19
|
+
}
|
|
20
|
+
const rect = element.getBoundingClientRect();
|
|
21
|
+
const fallbackSnapshot = {
|
|
22
|
+
top: rect.top,
|
|
23
|
+
left: rect.left,
|
|
24
|
+
width: rect.width,
|
|
25
|
+
height: rect.height,
|
|
26
|
+
scrollOffsets: getElementScrollValue(element)
|
|
27
|
+
};
|
|
28
|
+
snapshots.set(element, fallbackSnapshot);
|
|
29
|
+
return fallbackSnapshot;
|
|
30
|
+
}
|
|
15
31
|
function getEasingFromConfig(config) {
|
|
16
32
|
if (!config.easingV) {
|
|
17
33
|
return getEasingByName('linear');
|
|
@@ -113,6 +129,9 @@ export function setElementAnimation(element, animationConfig, shouldSavePosition
|
|
|
113
129
|
element.style.animationDuration = `${duration}s`;
|
|
114
130
|
element.style.animationDelay = `${delay}s`;
|
|
115
131
|
element.style.animationTimingFunction = easing;
|
|
132
|
+
if (animationConfig.animationType === LayoutAnimationType.ENTERING && delay > 0) {
|
|
133
|
+
element.style.animationFillMode = 'backwards';
|
|
134
|
+
}
|
|
116
135
|
};
|
|
117
136
|
if (animationConfig.animationType === LayoutAnimationType.ENTERING) {
|
|
118
137
|
// On chrome sometimes entering animations flicker. This is most likely caused by animation being interrupted
|
|
@@ -160,7 +179,7 @@ export function setElementAnimation(element, animationConfig, shouldSavePosition
|
|
|
160
179
|
if (!(animationName in Animations)) {
|
|
161
180
|
scheduleAnimationCleanup(animationName, duration + delay, () => {
|
|
162
181
|
if (shouldSavePosition) {
|
|
163
|
-
setElementPosition(element,
|
|
182
|
+
setElementPosition(element, getSnapshotForElement(element));
|
|
164
183
|
}
|
|
165
184
|
maybeRemoveElement();
|
|
166
185
|
maybeCallCallback(false);
|
|
@@ -227,6 +246,23 @@ function getElementScrollValue(element) {
|
|
|
227
246
|
}
|
|
228
247
|
return scrollOffsets;
|
|
229
248
|
}
|
|
249
|
+
function cleanupEnteringAnimations(element) {
|
|
250
|
+
const animationName = element.style.animationName;
|
|
251
|
+
|
|
252
|
+
// Check if the animation name indicates it's an entering animation
|
|
253
|
+
if (animationName && animationName.startsWith('REA-ENTERING-')) {
|
|
254
|
+
element.style.animationName = '';
|
|
255
|
+
element.style.animationDuration = '';
|
|
256
|
+
element.style.animationDelay = '';
|
|
257
|
+
element.style.animationFillMode = '';
|
|
258
|
+
element.style.animationTimingFunction = '';
|
|
259
|
+
}
|
|
260
|
+
for (const child of Array.from(element.children)) {
|
|
261
|
+
if (child instanceof HTMLElement) {
|
|
262
|
+
cleanupEnteringAnimations(child);
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
}
|
|
230
266
|
export function handleExitingAnimation(element, animationConfig) {
|
|
231
267
|
const parent = element.offsetParent;
|
|
232
268
|
const dummy = element.cloneNode();
|
|
@@ -249,6 +285,10 @@ export function handleExitingAnimation(element, animationConfig) {
|
|
|
249
285
|
};
|
|
250
286
|
saveScrollPosition(element);
|
|
251
287
|
|
|
288
|
+
// Clean up entering animations on all descendants before moving them to the dummy.
|
|
289
|
+
// This prevents entering animations from restarting when elements are moved to a new parent.
|
|
290
|
+
cleanupEnteringAnimations(element);
|
|
291
|
+
|
|
252
292
|
// After cloning the element, we want to move all children from original element to its clone. This is because original element
|
|
253
293
|
// will be unmounted, therefore when this code executes in child component, parent will be either empty or removed soon.
|
|
254
294
|
// Using element.cloneNode(true) doesn't solve the problem, because it creates copy of children and we won't be able to set their animations
|
|
@@ -269,7 +309,7 @@ export function handleExitingAnimation(element, animationConfig) {
|
|
|
269
309
|
}
|
|
270
310
|
};
|
|
271
311
|
restoreScrollPosition(dummy);
|
|
272
|
-
const snapshot =
|
|
312
|
+
const snapshot = getSnapshotForElement(element);
|
|
273
313
|
const scrollOffsets = getElementScrollValue(element);
|
|
274
314
|
|
|
275
315
|
// Scroll does not trigger snapshotting, therefore if we start exiting animation after
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["LayoutAnimationType","ReduceMotion","EasingNameSymbol","logger","_updatePropsJS","ReducedMotionManager","Keyframe","setElementPosition","snapshots","Animations","TransitionType","TransitionGenerator","scheduleAnimationCleanup","getEasingByName","maybeGetBezierEasing","WebEasings","prepareCurvedTransition","getEasingFromConfig","config","easingV","easingName","bezierEasing","warn","getRandomDelay","maxDelay","Math","floor","random","getDelayFromConfig","shouldRandomizeDelay","randomizeDelay","delay","delayV","getReducedMotionFromConfig","reduceMotionV","jsValue","Never","Always","getDurationFromConfig","animationName","defaultDuration","duration","durationV","undefined","getCallbackFromConfig","callbackV","getReversedFromConfig","reversed","getProcessedConfig","animationType","easing","callback","maybeModifyStyleForKeyframe","element","style","animationFillMode","timestampRules","Object","values","definitions","position","saveSnapshot","rect","getBoundingClientRect","snapshot","top","left","width","height","scrollOffsets","getElementScrollValue","set","setElementAnimation","animationConfig","shouldSavePosition","parent","configureAnimation","animationDuration","animationDelay","animationTimingFunction","ENTERING","requestAnimationFrame","maybeRemoveElement","isDummy","contains","removedAfterAnimation","removeChild","wasCallbackCalled","maybeCallCallback","finished","onanimationend","removeEventListener","animationCancelHandler","onanimationstart","visibility","addEventListener","get","handleLayoutTransition","transitionData","LINEAR","SEQUENCED","FADING","JUMPING","CURVED","ENTRY_EXIT","transitionKeyframeName","dummyTransitionKeyframeName","dummy","dummyAnimationConfig","current","scrollTopOffset","scrollLeftOffset","scrollTop","scrollLeft","parentElement","handleExitingAnimation","offsetParent","cloneNode","dummyClone","scrollPositions","Map","saveScrollPosition","node","child","Array","from","children","firstChild","appendChild","restoreScrollPosition","scrollPosition","currentScrollTopOffset","lastScrollTopOffset","currentScrollLeftOffset","lastScrollLeftOffset"],"sourceRoot":"../../../../src","sources":["layoutReanimation/web/componentUtils.ts"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["LayoutAnimationType","ReduceMotion","EasingNameSymbol","logger","_updatePropsJS","ReducedMotionManager","Keyframe","setElementPosition","snapshots","Animations","TransitionType","TransitionGenerator","scheduleAnimationCleanup","getEasingByName","maybeGetBezierEasing","WebEasings","prepareCurvedTransition","getSnapshotForElement","element","existingSnapshot","get","rect","getBoundingClientRect","fallbackSnapshot","top","left","width","height","scrollOffsets","getElementScrollValue","set","getEasingFromConfig","config","easingV","easingName","bezierEasing","warn","getRandomDelay","maxDelay","Math","floor","random","getDelayFromConfig","shouldRandomizeDelay","randomizeDelay","delay","delayV","getReducedMotionFromConfig","reduceMotionV","jsValue","Never","Always","getDurationFromConfig","animationName","defaultDuration","duration","durationV","undefined","getCallbackFromConfig","callbackV","getReversedFromConfig","reversed","getProcessedConfig","animationType","easing","callback","maybeModifyStyleForKeyframe","style","animationFillMode","timestampRules","Object","values","definitions","position","saveSnapshot","snapshot","setElementAnimation","animationConfig","shouldSavePosition","parent","configureAnimation","animationDuration","animationDelay","animationTimingFunction","ENTERING","requestAnimationFrame","maybeRemoveElement","isDummy","contains","removedAfterAnimation","removeChild","wasCallbackCalled","maybeCallCallback","finished","onanimationend","removeEventListener","animationCancelHandler","onanimationstart","visibility","addEventListener","handleLayoutTransition","transitionData","LINEAR","SEQUENCED","FADING","JUMPING","CURVED","ENTRY_EXIT","transitionKeyframeName","dummyTransitionKeyframeName","dummy","dummyAnimationConfig","current","scrollTopOffset","scrollLeftOffset","scrollTop","scrollLeft","parentElement","cleanupEnteringAnimations","startsWith","child","Array","from","children","HTMLElement","handleExitingAnimation","offsetParent","cloneNode","dummyClone","scrollPositions","Map","saveScrollPosition","node","firstChild","appendChild","restoreScrollPosition","scrollPosition","currentScrollTopOffset","lastScrollTopOffset","currentScrollLeftOffset","lastScrollLeftOffset"],"sourceRoot":"../../../../src","sources":["layoutReanimation/web/componentUtils.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
import { LayoutAnimationType } from "../../commonTypes.js";
|
|
3
4
|
import { convertAnimationObjectToKeyframes } from "./animationParser.js";
|
|
4
5
|
import { AnimationsData, TransitionType } from "./config.js";
|
|
5
6
|
import { insertWebAnimation } from "./domUtils.js";
|
|
@@ -9,6 +10,20 @@ import { FadingTransition } from "./transition/Fading.web.js";
|
|
|
9
10
|
import { JumpingTransition } from "./transition/Jumping.web.js";
|
|
10
11
|
import { LinearTransition } from "./transition/Linear.web.js";
|
|
11
12
|
import { SequencedTransition } from "./transition/Sequenced.web.js";
|
|
13
|
+
function maybeAddPx(value) {
|
|
14
|
+
return typeof value === 'number' ? `${value}px` : value;
|
|
15
|
+
}
|
|
16
|
+
function assignTransformRules(map, transform) {
|
|
17
|
+
if (!transform) {
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
for (const rule of transform) {
|
|
21
|
+
for (const [property, value] of Object.entries(rule)) {
|
|
22
|
+
map.set(property, value);
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
12
27
|
// Translate values are passed as numbers. However, if `translate` property receives number, it will not automatically
|
|
13
28
|
// convert it to `px`. Therefore if we want to keep transform we have to add 'px' suffix to each of translate values
|
|
14
29
|
// that are present inside transform.
|
|
@@ -33,7 +48,7 @@ function addPxToTransform(transform) {
|
|
|
33
48
|
});
|
|
34
49
|
return newTransform;
|
|
35
50
|
}
|
|
36
|
-
export function createCustomKeyFrameAnimation(keyframeDefinitions) {
|
|
51
|
+
export function createCustomKeyFrameAnimation(keyframeDefinitions, animationType) {
|
|
37
52
|
for (const value of Object.values(keyframeDefinitions)) {
|
|
38
53
|
if (value.transform) {
|
|
39
54
|
value.transform = addPxToTransform(value.transform);
|
|
@@ -44,7 +59,7 @@ export function createCustomKeyFrameAnimation(keyframeDefinitions) {
|
|
|
44
59
|
style: keyframeDefinitions,
|
|
45
60
|
duration: -1
|
|
46
61
|
};
|
|
47
|
-
animationData.name = generateNextCustomKeyframeName();
|
|
62
|
+
animationData.name = generateNextCustomKeyframeName(animationType);
|
|
48
63
|
|
|
49
64
|
// Move keyframe easings one keyframe up (our LA Keyframe definition is different
|
|
50
65
|
// from the CSS keyframes and expects easing to be present in the keyframe to which
|
|
@@ -61,43 +76,32 @@ export function createCustomKeyFrameAnimation(keyframeDefinitions) {
|
|
|
61
76
|
insertWebAnimation(animationData.name, parsedKeyframe);
|
|
62
77
|
return animationData.name;
|
|
63
78
|
}
|
|
64
|
-
export function createAnimationWithInitialValues(animationName, initialValues) {
|
|
79
|
+
export function createAnimationWithInitialValues(animationName, initialValues, animationType) {
|
|
65
80
|
const animationStyle = structuredClone(AnimationsData[animationName].style);
|
|
66
81
|
const firstAnimationStep = animationStyle['0'];
|
|
67
82
|
const {
|
|
68
83
|
transform,
|
|
84
|
+
originX,
|
|
85
|
+
originY,
|
|
69
86
|
...rest
|
|
70
87
|
} = initialValues;
|
|
88
|
+
const transformStyle = new Map();
|
|
89
|
+
assignTransformRules(transformStyle, firstAnimationStep.transform);
|
|
71
90
|
if (transform) {
|
|
72
91
|
const transformWithPx = addPxToTransform(transform);
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
// Then we either add new rule, or override one that already exists.
|
|
90
|
-
for (const rule of transformWithPx) {
|
|
91
|
-
for (const [property, value] of Object.entries(rule)) {
|
|
92
|
-
transformStyle.set(property, value);
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
// Finally, we convert `Map` with final transform back into array of objects.
|
|
97
|
-
firstAnimationStep.transform = Array.from(transformStyle, ([property, value]) => ({
|
|
98
|
-
[property]: value
|
|
99
|
-
}));
|
|
100
|
-
}
|
|
92
|
+
assignTransformRules(transformStyle, transformWithPx);
|
|
93
|
+
}
|
|
94
|
+
if (originX !== undefined) {
|
|
95
|
+
transformStyle.set('translateX', maybeAddPx(originX));
|
|
96
|
+
}
|
|
97
|
+
if (originY !== undefined) {
|
|
98
|
+
transformStyle.set('translateY', maybeAddPx(originY));
|
|
99
|
+
}
|
|
100
|
+
const mergedTransform = Array.from(transformStyle, ([property, value]) => ({
|
|
101
|
+
[property]: value
|
|
102
|
+
}));
|
|
103
|
+
if (transformStyle.size) {
|
|
104
|
+
firstAnimationStep.transform = mergedTransform;
|
|
101
105
|
}
|
|
102
106
|
animationStyle['0'] = {
|
|
103
107
|
...animationStyle['0'],
|
|
@@ -105,7 +109,7 @@ export function createAnimationWithInitialValues(animationName, initialValues) {
|
|
|
105
109
|
};
|
|
106
110
|
|
|
107
111
|
// TODO: Maybe we can extract the logic below into separate function
|
|
108
|
-
const keyframeName = generateNextCustomKeyframeName();
|
|
112
|
+
const keyframeName = generateNextCustomKeyframeName(animationType);
|
|
109
113
|
const animationObject = {
|
|
110
114
|
name: keyframeName,
|
|
111
115
|
style: animationStyle,
|
|
@@ -116,8 +120,13 @@ export function createAnimationWithInitialValues(animationName, initialValues) {
|
|
|
116
120
|
return keyframeName;
|
|
117
121
|
}
|
|
118
122
|
let customKeyframeCounter = 0;
|
|
119
|
-
|
|
120
|
-
|
|
123
|
+
const ANIMATION_TYPE_STRINGS = {
|
|
124
|
+
[LayoutAnimationType.ENTERING]: 'ENTERING',
|
|
125
|
+
[LayoutAnimationType.EXITING]: 'EXITING',
|
|
126
|
+
[LayoutAnimationType.LAYOUT]: 'LAYOUT'
|
|
127
|
+
};
|
|
128
|
+
function generateNextCustomKeyframeName(animationType) {
|
|
129
|
+
return `REA-${ANIMATION_TYPE_STRINGS[animationType] ?? ''}-${customKeyframeCounter++}`;
|
|
121
130
|
}
|
|
122
131
|
|
|
123
132
|
/**
|
|
@@ -130,7 +139,7 @@ function generateNextCustomKeyframeName() {
|
|
|
130
139
|
* @returns Keyframe name that represents transition.
|
|
131
140
|
*/
|
|
132
141
|
export function TransitionGenerator(transitionType, transitionData) {
|
|
133
|
-
const transitionKeyframeName = generateNextCustomKeyframeName();
|
|
142
|
+
const transitionKeyframeName = generateNextCustomKeyframeName(LayoutAnimationType.LAYOUT);
|
|
134
143
|
let dummyTransitionKeyframeName;
|
|
135
144
|
let transitionObject;
|
|
136
145
|
switch (transitionType) {
|
|
@@ -150,7 +159,7 @@ export function TransitionGenerator(transitionType, transitionData) {
|
|
|
150
159
|
// Here code block with {} is necessary because of eslint
|
|
151
160
|
case TransitionType.CURVED:
|
|
152
161
|
{
|
|
153
|
-
dummyTransitionKeyframeName = generateNextCustomKeyframeName();
|
|
162
|
+
dummyTransitionKeyframeName = generateNextCustomKeyframeName(LayoutAnimationType.LAYOUT);
|
|
154
163
|
const {
|
|
155
164
|
firstKeyframeObj,
|
|
156
165
|
secondKeyframeObj
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["convertAnimationObjectToKeyframes","AnimationsData","TransitionType","insertWebAnimation","CurvedTransition","EntryExitTransition","FadingTransition","JumpingTransition","LinearTransition","SequencedTransition","
|
|
1
|
+
{"version":3,"names":["LayoutAnimationType","convertAnimationObjectToKeyframes","AnimationsData","TransitionType","insertWebAnimation","CurvedTransition","EntryExitTransition","FadingTransition","JumpingTransition","LinearTransition","SequencedTransition","maybeAddPx","value","assignTransformRules","map","transform","rule","property","Object","entries","set","addPxToTransform","newTransform","transformProp","newTransformProp","key","includes","createCustomKeyFrameAnimation","keyframeDefinitions","animationType","values","animationData","name","style","duration","generateNextCustomKeyframeName","offsets","keys","i","length","easing","parsedKeyframe","createAnimationWithInitialValues","animationName","initialValues","animationStyle","structuredClone","firstAnimationStep","originX","originY","rest","transformStyle","Map","transformWithPx","undefined","mergedTransform","Array","from","size","keyframeName","animationObject","keyframe","customKeyframeCounter","ANIMATION_TYPE_STRINGS","ENTERING","EXITING","LAYOUT","TransitionGenerator","transitionType","transitionData","transitionKeyframeName","dummyTransitionKeyframeName","transitionObject","LINEAR","SEQUENCED","FADING","JUMPING","CURVED","firstKeyframeObj","secondKeyframeObj","dummyKeyframe","ENTRY_EXIT","transitionKeyframe"],"sourceRoot":"../../../../src","sources":["layoutReanimation/web/createAnimation.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"animationsManager.d.ts","sourceRoot":"","sources":["../../../../src/layoutReanimation/web/animationsManager.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,KAAK,EACV,sBAAsB,EAEvB,MAAM,2CAA2C,CAAC;AAGnD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"animationsManager.d.ts","sourceRoot":"","sources":["../../../../src/layoutReanimation/web/animationsManager.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,KAAK,EACV,sBAAsB,EAEvB,MAAM,2CAA2C,CAAC;AAGnD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AA8KxD,wBAAgB,uBAAuB,CACrC,cAAc,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAE9C,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,cAAc,CAAC,CAAC,EACvD,OAAO,EAAE,qBAAqB,EAC9B,aAAa,EAAE,mBAAmB,EAClC,cAAc,CAAC,EAAE,cAAc,QAuBhC;AAED,wBAAgB,2BAA2B,CACzC,cAAc,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAE9C,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,cAAc,CAAC,CAAC,EACvD,OAAO,EAAE,qBAAqB,EAC9B,QAAQ,EAAE,OAAO,QAsClB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"componentUtils.d.ts","sourceRoot":"","sources":["../../../../src/layoutReanimation/web/componentUtils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAgB,MAAM,mBAAmB,CAAC;AAItE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGxD,OAAO,KAAK,EAEV,eAAe,EAEf,YAAY,EAGb,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"componentUtils.d.ts","sourceRoot":"","sources":["../../../../src/layoutReanimation/web/componentUtils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAgB,MAAM,mBAAmB,CAAC;AAItE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGxD,OAAO,KAAK,EAEV,eAAe,EAEf,YAAY,EAGb,MAAM,UAAU,CAAC;AA8ElB,wBAAgB,0BAA0B,CAAC,MAAM,EAAE,YAAY,WAa9D;AA2BD,wBAAgB,kBAAkB,CAChC,aAAa,EAAE,MAAM,EACrB,aAAa,EAAE,mBAAmB,EAClC,MAAM,EAAE,YAAY,GACnB,eAAe,CAUjB;AAED,wBAAgB,2BAA2B,CACzC,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,YAAY,QAkBrB;AAED,wBAAgB,YAAY,CAAC,OAAO,EAAE,WAAW,QAYhD;AAED,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,qBAAqB,EAC9B,eAAe,EAAE,eAAe,EAChC,kBAAkB,UAAQ,EAC1B,MAAM,GAAE,OAAO,GAAG,IAAW,QA8E9B;AAED,wBAAgB,sBAAsB,CACpC,OAAO,EAAE,qBAAqB,EAC9B,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,cAAc,QA8C/B;AA4CD,wBAAgB,sBAAsB,CACpC,OAAO,EAAE,qBAAqB,EAC9B,eAAe,EAAE,eAAe,QAgFjC"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
import { LayoutAnimationType } from '../../commonTypes';
|
|
1
2
|
import type { TransitionData } from './animationParser';
|
|
2
3
|
import type { InitialValuesStyleProps, KeyframeDefinitions } from './config';
|
|
3
4
|
import { TransitionType } from './config';
|
|
4
|
-
export declare function createCustomKeyFrameAnimation(keyframeDefinitions: KeyframeDefinitions): string;
|
|
5
|
-
export declare function createAnimationWithInitialValues(animationName: string, initialValues: InitialValuesStyleProps): string;
|
|
5
|
+
export declare function createCustomKeyFrameAnimation(keyframeDefinitions: KeyframeDefinitions, animationType: LayoutAnimationType): string;
|
|
6
|
+
export declare function createAnimationWithInitialValues(animationName: string, initialValues: InitialValuesStyleProps, animationType: LayoutAnimationType): string;
|
|
6
7
|
/**
|
|
7
8
|
* Creates transition of given type, appends it to stylesheet and returns
|
|
8
9
|
* keyframe name.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createAnimation.d.ts","sourceRoot":"","sources":["../../../../src/layoutReanimation/web/createAnimation.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAGV,cAAc,EACf,MAAM,mBAAmB,CAAC;AAE3B,OAAO,KAAK,EAAE,uBAAuB,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAC7E,OAAO,EAAkB,cAAc,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"createAnimation.d.ts","sourceRoot":"","sources":["../../../../src/layoutReanimation/web/createAnimation.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,KAAK,EAGV,cAAc,EACf,MAAM,mBAAmB,CAAC;AAE3B,OAAO,KAAK,EAAE,uBAAuB,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAC7E,OAAO,EAAkB,cAAc,EAAE,MAAM,UAAU,CAAC;AA8D1D,wBAAgB,6BAA6B,CAC3C,mBAAmB,EAAE,mBAAmB,EACxC,aAAa,EAAE,mBAAmB,UAoCnC;AAED,wBAAgB,gCAAgC,CAC9C,aAAa,EAAE,MAAM,EACrB,aAAa,EAAE,uBAAuB,EACtC,aAAa,EAAE,mBAAmB,UAkDnC;AAcD;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CACjC,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc;;;EAsE/B"}
|
|
@@ -3,5 +3,5 @@
|
|
|
3
3
|
* version used to build the native part of the library in runtime. Remember to
|
|
4
4
|
* keep this in sync with the version declared in `package.json`
|
|
5
5
|
*/
|
|
6
|
-
export declare const jsVersion = "3.19.
|
|
6
|
+
export declare const jsVersion = "3.19.5";
|
|
7
7
|
//# sourceMappingURL=jsVersion.d.ts.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-reanimated",
|
|
3
|
-
"version": "3.19.
|
|
3
|
+
"version": "3.19.5",
|
|
4
4
|
"description": "More powerful alternative to Animated library for React Native.",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"test": "jest",
|
|
@@ -124,7 +124,7 @@
|
|
|
124
124
|
"axios": "^1.7.4",
|
|
125
125
|
"babel-eslint": "^10.1.0",
|
|
126
126
|
"babel-plugin-module-resolver": "^5.0.0",
|
|
127
|
-
"clang-format": "
|
|
127
|
+
"clang-format-node": "1.3.5",
|
|
128
128
|
"code-tag": "^1.1.0",
|
|
129
129
|
"cspell": "^8.8.0",
|
|
130
130
|
"eslint": "^8.57.0",
|
|
@@ -133,7 +133,8 @@ function tryGetAnimationConfig<ComponentProps extends Record<string, unknown>>(
|
|
|
133
133
|
|
|
134
134
|
if (isCustomKeyframe) {
|
|
135
135
|
animationName = createCustomKeyFrameAnimation(
|
|
136
|
-
(config as CustomConfig).definitions as KeyframeDefinitions
|
|
136
|
+
(config as CustomConfig).definitions as KeyframeDefinitions,
|
|
137
|
+
animationType
|
|
137
138
|
);
|
|
138
139
|
} else if (typeof config === 'function') {
|
|
139
140
|
animationName = config.presetName;
|
|
@@ -145,7 +146,8 @@ function tryGetAnimationConfig<ComponentProps extends Record<string, unknown>>(
|
|
|
145
146
|
if (hasInitialValues) {
|
|
146
147
|
animationName = createAnimationWithInitialValues(
|
|
147
148
|
animationName,
|
|
148
|
-
(config as CustomConfig).initialValues as InitialValuesStyleProps
|
|
149
|
+
(config as CustomConfig).initialValues as InitialValuesStyleProps,
|
|
150
|
+
animationType
|
|
149
151
|
);
|
|
150
152
|
}
|
|
151
153
|
|
|
@@ -30,6 +30,28 @@ import {
|
|
|
30
30
|
} from './Easing.web';
|
|
31
31
|
import { prepareCurvedTransition } from './transition/Curved.web';
|
|
32
32
|
|
|
33
|
+
function getSnapshotForElement(element: HTMLElement): ReanimatedSnapshot {
|
|
34
|
+
const existingSnapshot = snapshots.get(element);
|
|
35
|
+
|
|
36
|
+
if (existingSnapshot) {
|
|
37
|
+
return existingSnapshot;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
const rect = element.getBoundingClientRect();
|
|
41
|
+
|
|
42
|
+
const fallbackSnapshot: ReanimatedSnapshot = {
|
|
43
|
+
top: rect.top,
|
|
44
|
+
left: rect.left,
|
|
45
|
+
width: rect.width,
|
|
46
|
+
height: rect.height,
|
|
47
|
+
scrollOffsets: getElementScrollValue(element),
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
snapshots.set(element, fallbackSnapshot);
|
|
51
|
+
|
|
52
|
+
return fallbackSnapshot;
|
|
53
|
+
}
|
|
54
|
+
|
|
33
55
|
function getEasingFromConfig(config: CustomConfig): string {
|
|
34
56
|
if (!config.easingV) {
|
|
35
57
|
return getEasingByName('linear');
|
|
@@ -179,6 +201,13 @@ export function setElementAnimation(
|
|
|
179
201
|
element.style.animationDuration = `${duration}s`;
|
|
180
202
|
element.style.animationDelay = `${delay}s`;
|
|
181
203
|
element.style.animationTimingFunction = easing;
|
|
204
|
+
|
|
205
|
+
if (
|
|
206
|
+
animationConfig.animationType === LayoutAnimationType.ENTERING &&
|
|
207
|
+
delay > 0
|
|
208
|
+
) {
|
|
209
|
+
element.style.animationFillMode = 'backwards';
|
|
210
|
+
}
|
|
182
211
|
};
|
|
183
212
|
|
|
184
213
|
if (animationConfig.animationType === LayoutAnimationType.ENTERING) {
|
|
@@ -234,7 +263,7 @@ export function setElementAnimation(
|
|
|
234
263
|
if (!(animationName in Animations)) {
|
|
235
264
|
scheduleAnimationCleanup(animationName, duration + delay, () => {
|
|
236
265
|
if (shouldSavePosition) {
|
|
237
|
-
setElementPosition(element,
|
|
266
|
+
setElementPosition(element, getSnapshotForElement(element));
|
|
238
267
|
}
|
|
239
268
|
|
|
240
269
|
maybeRemoveElement();
|
|
@@ -317,6 +346,25 @@ function getElementScrollValue(element: HTMLElement): ScrollOffsets {
|
|
|
317
346
|
return scrollOffsets;
|
|
318
347
|
}
|
|
319
348
|
|
|
349
|
+
function cleanupEnteringAnimations(element: HTMLElement) {
|
|
350
|
+
const animationName = element.style.animationName;
|
|
351
|
+
|
|
352
|
+
// Check if the animation name indicates it's an entering animation
|
|
353
|
+
if (animationName && animationName.startsWith('REA-ENTERING-')) {
|
|
354
|
+
element.style.animationName = '';
|
|
355
|
+
element.style.animationDuration = '';
|
|
356
|
+
element.style.animationDelay = '';
|
|
357
|
+
element.style.animationFillMode = '';
|
|
358
|
+
element.style.animationTimingFunction = '';
|
|
359
|
+
}
|
|
360
|
+
|
|
361
|
+
for (const child of Array.from(element.children)) {
|
|
362
|
+
if (child instanceof HTMLElement) {
|
|
363
|
+
cleanupEnteringAnimations(child);
|
|
364
|
+
}
|
|
365
|
+
}
|
|
366
|
+
}
|
|
367
|
+
|
|
320
368
|
export function handleExitingAnimation(
|
|
321
369
|
element: ReanimatedHTMLElement,
|
|
322
370
|
animationConfig: AnimationConfig
|
|
@@ -344,6 +392,10 @@ export function handleExitingAnimation(
|
|
|
344
392
|
};
|
|
345
393
|
saveScrollPosition(element);
|
|
346
394
|
|
|
395
|
+
// Clean up entering animations on all descendants before moving them to the dummy.
|
|
396
|
+
// This prevents entering animations from restarting when elements are moved to a new parent.
|
|
397
|
+
cleanupEnteringAnimations(element);
|
|
398
|
+
|
|
347
399
|
// After cloning the element, we want to move all children from original element to its clone. This is because original element
|
|
348
400
|
// will be unmounted, therefore when this code executes in child component, parent will be either empty or removed soon.
|
|
349
401
|
// Using element.cloneNode(true) doesn't solve the problem, because it creates copy of children and we won't be able to set their animations
|
|
@@ -367,7 +419,7 @@ export function handleExitingAnimation(
|
|
|
367
419
|
};
|
|
368
420
|
restoreScrollPosition(dummy);
|
|
369
421
|
|
|
370
|
-
const snapshot =
|
|
422
|
+
const snapshot = getSnapshotForElement(element);
|
|
371
423
|
|
|
372
424
|
const scrollOffsets = getElementScrollValue(element);
|
|
373
425
|
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import type { TransformsStyle } from 'react-native';
|
|
4
4
|
|
|
5
|
+
import { LayoutAnimationType } from '../../commonTypes';
|
|
5
6
|
import type {
|
|
6
7
|
AnimationData,
|
|
7
8
|
ReanimatedWebTransformProperties,
|
|
@@ -19,6 +20,26 @@ import { LinearTransition } from './transition/Linear.web';
|
|
|
19
20
|
import { SequencedTransition } from './transition/Sequenced.web';
|
|
20
21
|
|
|
21
22
|
type TransformType = NonNullable<TransformsStyle['transform']>;
|
|
23
|
+
type TransformValue = string | number;
|
|
24
|
+
|
|
25
|
+
function maybeAddPx(value: string | number) {
|
|
26
|
+
return typeof value === 'number' ? `${value}px` : value;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
function assignTransformRules(
|
|
30
|
+
map: Map<string, TransformValue>,
|
|
31
|
+
transform?: ReanimatedWebTransformProperties[]
|
|
32
|
+
) {
|
|
33
|
+
if (!transform) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
for (const rule of transform) {
|
|
38
|
+
for (const [property, value] of Object.entries(rule)) {
|
|
39
|
+
map.set(property, value as TransformValue);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
}
|
|
22
43
|
|
|
23
44
|
// Translate values are passed as numbers. However, if `translate` property receives number, it will not automatically
|
|
24
45
|
// convert it to `px`. Therefore if we want to keep transform we have to add 'px' suffix to each of translate values
|
|
@@ -52,7 +73,8 @@ function addPxToTransform(transform: TransformType) {
|
|
|
52
73
|
}
|
|
53
74
|
|
|
54
75
|
export function createCustomKeyFrameAnimation(
|
|
55
|
-
keyframeDefinitions: KeyframeDefinitions
|
|
76
|
+
keyframeDefinitions: KeyframeDefinitions,
|
|
77
|
+
animationType: LayoutAnimationType
|
|
56
78
|
) {
|
|
57
79
|
for (const value of Object.values(keyframeDefinitions)) {
|
|
58
80
|
if (value.transform) {
|
|
@@ -66,7 +88,7 @@ export function createCustomKeyFrameAnimation(
|
|
|
66
88
|
duration: -1,
|
|
67
89
|
};
|
|
68
90
|
|
|
69
|
-
animationData.name = generateNextCustomKeyframeName();
|
|
91
|
+
animationData.name = generateNextCustomKeyframeName(animationType);
|
|
70
92
|
|
|
71
93
|
// Move keyframe easings one keyframe up (our LA Keyframe definition is different
|
|
72
94
|
// from the CSS keyframes and expects easing to be present in the keyframe to which
|
|
@@ -92,46 +114,36 @@ export function createCustomKeyFrameAnimation(
|
|
|
92
114
|
|
|
93
115
|
export function createAnimationWithInitialValues(
|
|
94
116
|
animationName: string,
|
|
95
|
-
initialValues: InitialValuesStyleProps
|
|
117
|
+
initialValues: InitialValuesStyleProps,
|
|
118
|
+
animationType: LayoutAnimationType
|
|
96
119
|
) {
|
|
97
120
|
const animationStyle = structuredClone(AnimationsData[animationName].style);
|
|
98
121
|
const firstAnimationStep = animationStyle['0'];
|
|
99
122
|
|
|
100
|
-
const { transform, ...rest } = initialValues;
|
|
123
|
+
const { transform, originX, originY, ...rest } = initialValues;
|
|
124
|
+
|
|
125
|
+
const transformStyle = new Map<string, TransformValue>();
|
|
126
|
+
assignTransformRules(transformStyle, firstAnimationStep.transform);
|
|
101
127
|
|
|
102
128
|
if (transform) {
|
|
103
129
|
const transformWithPx = addPxToTransform(transform as TransformType);
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
firstAnimationStep.transform = transformWithPx;
|
|
107
|
-
} else {
|
|
108
|
-
// Othwerwise we have to merge predefined transform with the one provided in `initialValues`.
|
|
109
|
-
// To do that, we create `Map` that will contain final transform.
|
|
110
|
-
const transformStyle = new Map<string, any>();
|
|
111
|
-
|
|
112
|
-
// First we assign all of the predefined rules
|
|
113
|
-
for (const rule of firstAnimationStep.transform) {
|
|
114
|
-
// In most cases there will be just one iteration
|
|
115
|
-
for (const [property, value] of Object.entries(rule)) {
|
|
116
|
-
transformStyle.set(property, value);
|
|
117
|
-
}
|
|
118
|
-
}
|
|
130
|
+
assignTransformRules(transformStyle, transformWithPx);
|
|
131
|
+
}
|
|
119
132
|
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
transformStyle.set(property, value);
|
|
124
|
-
}
|
|
125
|
-
}
|
|
133
|
+
if (originX !== undefined) {
|
|
134
|
+
transformStyle.set('translateX', maybeAddPx(originX));
|
|
135
|
+
}
|
|
126
136
|
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
137
|
+
if (originY !== undefined) {
|
|
138
|
+
transformStyle.set('translateY', maybeAddPx(originY));
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
const mergedTransform = Array.from(transformStyle, ([property, value]) => ({
|
|
142
|
+
[property]: value,
|
|
143
|
+
}));
|
|
144
|
+
|
|
145
|
+
if (transformStyle.size) {
|
|
146
|
+
firstAnimationStep.transform = mergedTransform;
|
|
135
147
|
}
|
|
136
148
|
|
|
137
149
|
animationStyle['0'] = {
|
|
@@ -140,7 +152,7 @@ export function createAnimationWithInitialValues(
|
|
|
140
152
|
};
|
|
141
153
|
|
|
142
154
|
// TODO: Maybe we can extract the logic below into separate function
|
|
143
|
-
const keyframeName = generateNextCustomKeyframeName();
|
|
155
|
+
const keyframeName = generateNextCustomKeyframeName(animationType);
|
|
144
156
|
|
|
145
157
|
const animationObject: AnimationData = {
|
|
146
158
|
name: keyframeName,
|
|
@@ -157,8 +169,14 @@ export function createAnimationWithInitialValues(
|
|
|
157
169
|
|
|
158
170
|
let customKeyframeCounter = 0;
|
|
159
171
|
|
|
160
|
-
|
|
161
|
-
|
|
172
|
+
const ANIMATION_TYPE_STRINGS: Partial<Record<LayoutAnimationType, string>> = {
|
|
173
|
+
[LayoutAnimationType.ENTERING]: 'ENTERING',
|
|
174
|
+
[LayoutAnimationType.EXITING]: 'EXITING',
|
|
175
|
+
[LayoutAnimationType.LAYOUT]: 'LAYOUT',
|
|
176
|
+
};
|
|
177
|
+
|
|
178
|
+
function generateNextCustomKeyframeName(animationType: LayoutAnimationType) {
|
|
179
|
+
return `REA-${ANIMATION_TYPE_STRINGS[animationType] ?? ''}-${customKeyframeCounter++}`;
|
|
162
180
|
}
|
|
163
181
|
|
|
164
182
|
/**
|
|
@@ -174,7 +192,9 @@ export function TransitionGenerator(
|
|
|
174
192
|
transitionType: TransitionType,
|
|
175
193
|
transitionData: TransitionData
|
|
176
194
|
) {
|
|
177
|
-
const transitionKeyframeName = generateNextCustomKeyframeName(
|
|
195
|
+
const transitionKeyframeName = generateNextCustomKeyframeName(
|
|
196
|
+
LayoutAnimationType.LAYOUT
|
|
197
|
+
);
|
|
178
198
|
let dummyTransitionKeyframeName;
|
|
179
199
|
|
|
180
200
|
let transitionObject;
|
|
@@ -207,7 +227,9 @@ export function TransitionGenerator(
|
|
|
207
227
|
|
|
208
228
|
// Here code block with {} is necessary because of eslint
|
|
209
229
|
case TransitionType.CURVED: {
|
|
210
|
-
dummyTransitionKeyframeName = generateNextCustomKeyframeName(
|
|
230
|
+
dummyTransitionKeyframeName = generateNextCustomKeyframeName(
|
|
231
|
+
LayoutAnimationType.LAYOUT
|
|
232
|
+
);
|
|
211
233
|
|
|
212
234
|
const { firstKeyframeObj, secondKeyframeObj } = CurvedTransition(
|
|
213
235
|
transitionKeyframeName,
|