@tamagui/animations-reanimated 3.0.7 → 3.0.8

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.
@@ -9,7 +9,7 @@ import React, { useMemo, useRef } from "react";
9
9
  import Animated_, { Easing, cancelAnimation, runOnJS, runOnUI, useAnimatedReaction, useAnimatedStyle, useDerivedValue, useSharedValue, withDelay, withSpring, withTiming } from "react-native-reanimated";
10
10
 
11
11
  var NON_ANIMATABLE_VALUE = /^(auto|min-content|max-content|fit-content|stretch|inherit|initial|unset)\b|^calc\(/;
12
- var getDefaultExport = function(module) {
12
+ var getDefaultExport = function getDefaultExport2(module) {
13
13
  var mod = module;
14
14
  if (mod.__esModule || mod[Symbol.toStringTag] === "Module") {
15
15
  return mod.default || mod;
@@ -17,7 +17,7 @@ var getDefaultExport = function(module) {
17
17
  return mod;
18
18
  };
19
19
  var Animated = getDefaultExport(Animated_);
20
- var silenceAnimatedComponentDevCheck = function(style) {
20
+ var silenceAnimatedComponentDevCheck = function silenceAnimatedComponentDevCheck2(style) {
21
21
  if (process.env.NODE_ENV !== "development" || isWeb || !style || typeof style !== "object") {
22
22
  return;
23
23
  }
@@ -27,7 +27,7 @@ var silenceAnimatedComponentDevCheck = function(style) {
27
27
  value: true
28
28
  });
29
29
  };
30
- var resolveDynamicValue = function(value, isDark) {
30
+ var resolveDynamicValue = function resolveDynamicValue2(value, isDark) {
31
31
  if (value !== null && typeof value === "object" && "dynamic" in value && typeof value.dynamic === "object") {
32
32
  var dynamic = value.dynamic;
33
33
  return isDark ? dynamic.dark : dynamic.light;
@@ -46,7 +46,7 @@ var updateMapperState = isWeb ? function(state, emitted, ownedStatics) {
46
46
  return current;
47
47
  }, false);
48
48
  };
49
- var cloneAnimationValue = function(value) {
49
+ var cloneAnimationValue = function cloneAnimationValue1(value) {
50
50
  if (Array.isArray(value)) {
51
51
  return value.map(cloneAnimationValue);
52
52
  }
@@ -59,23 +59,23 @@ var cloneAnimationValue = function(value) {
59
59
  }
60
60
  return value;
61
61
  };
62
- var cloneStyleRecord = function(style) {
62
+ var cloneStyleRecord = function cloneStyleRecord2(style) {
63
63
  var next = {};
64
64
  for (var key in style) {
65
65
  next[key] = cloneAnimationValue(style[key]);
66
66
  }
67
67
  return next;
68
68
  };
69
- var cloneTransitionConfig = function(config) {
69
+ var cloneTransitionConfig = function cloneTransitionConfig2(config) {
70
70
  return cloneAnimationValue(config);
71
71
  };
72
- var getAnimatedTransforms = function(value) {
72
+ var getAnimatedTransforms = function getAnimatedTransforms2(value) {
73
73
  if (!Array.isArray(value)) return [];
74
74
  return value.filter(function(item) {
75
75
  return item !== null && typeof item === "object" && !Array.isArray(item);
76
76
  });
77
77
  };
78
- var getRemovedAnimatedKeys = function(current, previous) {
78
+ var getRemovedAnimatedKeys = function getRemovedAnimatedKeys2(current, previous) {
79
79
  var removedKeys = {};
80
80
  var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
81
81
  try {
@@ -99,7 +99,7 @@ var getRemovedAnimatedKeys = function(current, previous) {
99
99
  }
100
100
  return removedKeys;
101
101
  };
102
- var getImplicitDefault = function(key, targetValue) {
102
+ var getImplicitDefault = function getImplicitDefault2(key, targetValue) {
103
103
  "worklet";
104
104
  var value = key === "opacity" || key === "scale" || key === "scaleX" || key === "scaleY" ? 1 : 0;
105
105
  if (typeof targetValue !== "string") return value;
@@ -115,11 +115,11 @@ var getImplicitDefault = function(key, targetValue) {
115
115
  }
116
116
  return suffixIndex > 0 ? `${value}${targetValue.slice(suffixIndex)}` : value;
117
117
  };
118
- var getLeadingRatio = function(metrics) {
118
+ var getLeadingRatio = function getLeadingRatio2(metrics) {
119
119
  var ratio = metrics === null || metrics === void 0 ? void 0 : metrics.lineHeight;
120
120
  return typeof ratio === "number" && Number.isFinite(ratio) && ratio >= 0 ? ratio : void 0;
121
121
  };
122
- var derivesLeadingProduct = function(style, ratio, inheritsFontSize, resolved) {
122
+ var derivesLeadingProduct = function derivesLeadingProduct2(style, ratio, inheritsFontSize, resolved) {
123
123
  return ratio !== void 0 && (inheritsFontSize || typeof style.lineHeight === "number" && typeof style.fontSize === "number" && (!!getTransitionForKey(resolved, "fontSize") || !!getTransitionForKey(resolved, "lineHeight")));
124
124
  };
125
125
  var COLOR_STYLE_KEYS = {
@@ -131,7 +131,7 @@ var COLOR_STYLE_KEYS = {
131
131
  borderBottomColor: true,
132
132
  color: true
133
133
  };
134
- var toReanimatedColor = function(value) {
134
+ var toReanimatedColor = function toReanimatedColor2(value) {
135
135
  "worklet";
136
136
  if (typeof value === "number") {
137
137
  var color = value >>> 0;
@@ -146,12 +146,12 @@ var toReanimatedColor = function(value) {
146
146
  if (trimmed === "transparent") return "rgba(0, 0, 0, 0)";
147
147
  return trimmed;
148
148
  };
149
- var isReanimatedColorHistory = function(value) {
149
+ var isReanimatedColorHistory = function isReanimatedColorHistory2(value) {
150
150
  "worklet";
151
151
  var normalized = toReanimatedColor(value);
152
152
  return typeof normalized === "string" && normalized.startsWith("rgba(");
153
153
  };
154
- var normalizeAnimationColor = function(value) {
154
+ var normalizeAnimationColor = function normalizeAnimationColor2(value) {
155
155
  if (typeof value === "number") {
156
156
  return toReanimatedColor(value);
157
157
  }
@@ -164,7 +164,7 @@ var normalizeAnimationColor = function(value) {
164
164
  var alpha = (color & 255) / 255;
165
165
  return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
166
166
  };
167
- var buildSnapshot = function(animated, statics, transforms, previousKeys, lastPainted) {
167
+ var buildSnapshot = function buildSnapshot2(animated, statics, transforms, previousKeys, lastPainted) {
168
168
  var derivesLeading = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : false;
169
169
  var snapshotAnimated = {};
170
170
  var snapshotStatics = cloneStyleRecord(statics);
@@ -241,7 +241,7 @@ var buildSnapshot = function(animated, statics, transforms, previousKeys, lastPa
241
241
  try {
242
242
  for (var _iterator2 = keys[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
243
243
  var key4 = _step2.value;
244
- var _seeds_key, _ref;
244
+ var _ref, _seeds_key;
245
245
  var value2 = previousKeys.has(key4) ? (_ref = (_seeds_key = seeds[key4]) !== null && _seeds_key !== void 0 ? _seeds_key : snapshotStatics[key4]) !== null && _ref !== void 0 ? _ref : lastPainted[key4] : lastPainted[key4];
246
246
  if (typeof value2 !== "number" && typeof value2 !== "string") {
247
247
  delete seeds[key4];
@@ -356,10 +356,10 @@ var buildSnapshot = function(animated, statics, transforms, previousKeys, lastPa
356
356
  keys
357
357
  };
358
358
  };
359
- var getGatedKeys = function(snapshot) {
359
+ var getGatedKeys = function getGatedKeys2(snapshot) {
360
360
  return Object.keys(snapshot.gatedKeys);
361
361
  };
362
- var createReanimatedConfig = function(config) {
362
+ var createReanimatedConfig = function createReanimatedConfig2(config) {
363
363
  "worklet";
364
364
  var next = {};
365
365
  var source = config;
@@ -372,7 +372,7 @@ var createReanimatedConfig = function(config) {
372
372
  }
373
373
  return next;
374
374
  };
375
- var applyAnimation = function(targetValue, config, callback, seedValue) {
375
+ var applyAnimation = function applyAnimation2(targetValue, config, callback, seedValue) {
376
376
  "worklet";
377
377
  var validateStartAsColor = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : false, publishTo = arguments.length > 5 ? arguments[5] : void 0;
378
378
  var delay = config.delay;
@@ -417,7 +417,7 @@ var applyAnimation = function(targetValue, config, callback, seedValue) {
417
417
  }
418
418
  return animatedValue;
419
419
  };
420
- var animateSnapshotValue = function(key, implicitKey, targetValue, config, previouslyEmitted, seedValue, gated, currentlyExiting, exitCycleId, currentlyCompletingEnter, enterCycleId, currentlyCompletingUpdate, updateCycleId, markExitKeyDone, markEnterKeyDone, markUpdateKeyDone) {
420
+ var animateSnapshotValue = function animateSnapshotValue2(key, implicitKey, targetValue, config, previouslyEmitted, seedValue, gated, currentlyExiting, exitCycleId, currentlyCompletingEnter, enterCycleId, currentlyCompletingUpdate, updateCycleId, markExitKeyDone, markEnterKeyDone, markUpdateKeyDone) {
421
421
  "worklet";
422
422
  var validateStartAsColor = arguments.length > 16 && arguments[16] !== void 0 ? arguments[16] : false, publishTo = arguments.length > 17 ? arguments[17] : void 0;
423
423
  var cycleGated = gated && (currentlyExiting || currentlyCompletingEnter || currentlyCompletingUpdate);
@@ -427,17 +427,17 @@ var animateSnapshotValue = function(key, implicitKey, targetValue, config, previ
427
427
  }
428
428
  var callback;
429
429
  if (gated && currentlyExiting) {
430
- callback = function(finished) {
430
+ callback = function callback2(finished) {
431
431
  "worklet";
432
432
  runOnJS(markExitKeyDone)(key, exitCycleId, finished !== null && finished !== void 0 ? finished : false);
433
433
  };
434
434
  } else if (gated && currentlyCompletingEnter) {
435
- callback = function() {
435
+ callback = function callback2() {
436
436
  "worklet";
437
437
  runOnJS(markEnterKeyDone)(key, enterCycleId);
438
438
  };
439
439
  } else if (gated && currentlyCompletingUpdate) {
440
- callback = function(finished) {
440
+ callback = function callback2(finished) {
441
441
  "worklet";
442
442
  runOnJS(markUpdateKeyDone)(key, updateCycleId, finished !== null && finished !== void 0 ? finished : false);
443
443
  };
@@ -499,12 +499,12 @@ var ANIMATABLE_PROPERTIES = {
499
499
  flexGrow: true,
500
500
  flexShrink: true
501
501
  };
502
- var canAnimateProperty = function(key, value) {
502
+ var canAnimateProperty = function canAnimateProperty2(key, value) {
503
503
  if (!ANIMATABLE_PROPERTIES[key]) return false;
504
504
  if (typeof value === "string" && NON_ANIMATABLE_VALUE.test(value)) return false;
505
505
  return true;
506
506
  };
507
- var splitAnimationStyles = function(style, isDark, disableAnimation) {
507
+ var splitAnimationStyles = function splitAnimationStyles2(style, isDark, disableAnimation) {
508
508
  var animated = {};
509
509
  var statics = {};
510
510
  for (var key in style) {
@@ -524,6 +524,7 @@ var splitAnimationStyles = function(style, isDark, disableAnimation) {
524
524
  function createWebAnimatedComponent(defaultTag) {
525
525
  var isText = defaultTag === "span";
526
526
  var Component = Animated.createAnimatedComponent(createRefComponent(function(propsIn, ref) {
527
+ var _ref, _ref1, _ref2;
527
528
  var _hooks_usePropsTransform;
528
529
  var { forwardedRef, render = defaultTag, ...rest } = propsIn;
529
530
  var hostRef = useRef(null);
@@ -532,13 +533,11 @@ function createWebAnimatedComponent(defaultTag) {
532
533
  return hostRef.current;
533
534
  } });
534
535
  var [, themeState] = useThemeWithState({});
535
- var _themeState_theme, _themeState_name;
536
- var result = getSplitStyles(rest, isText ? Text.staticConfig : View.staticConfig, (_themeState_theme = themeState === null || themeState === void 0 ? void 0 : themeState.theme) !== null && _themeState_theme !== void 0 ? _themeState_theme : {}, (_themeState_name = themeState === null || themeState === void 0 ? void 0 : themeState.name) !== null && _themeState_name !== void 0 ? _themeState_name : "", { unmounted: false }, {
536
+ var result = getSplitStyles(rest, isText ? Text.staticConfig : View.staticConfig, (_ref = themeState === null || themeState === void 0 ? void 0 : themeState.theme) !== null && _ref !== void 0 ? _ref : {}, (_ref1 = themeState === null || themeState === void 0 ? void 0 : themeState.name) !== null && _ref1 !== void 0 ? _ref1 : "", { unmounted: false }, {
537
537
  isAnimated: false,
538
538
  noClass: true
539
539
  });
540
- var _result_viewProps;
541
- var viewProps = (_result_viewProps = result === null || result === void 0 ? void 0 : result.viewProps) !== null && _result_viewProps !== void 0 ? _result_viewProps : {};
540
+ var viewProps = (_ref2 = result === null || result === void 0 ? void 0 : result.viewProps) !== null && _ref2 !== void 0 ? _ref2 : {};
542
541
  var Element = render;
543
542
  var transformedProps = (_hooks_usePropsTransform = hooks.usePropsTransform) === null || _hooks_usePropsTransform === void 0 ? void 0 : _hooks_usePropsTransform.call(hooks, render, viewProps, stateRef, false);
544
543
  var { nativeID, ...webProps } = transformedProps !== null && transformedProps !== void 0 ? transformedProps : viewProps;
@@ -610,7 +609,7 @@ function buildTransitionConfig(transition, animations, animationState, styleKeys
610
609
  resolved
611
610
  };
612
611
  }
613
- var instantConfig = function() {
612
+ var instantConfig = function instantConfig2() {
614
613
  return {
615
614
  type: "timing",
616
615
  duration: 0
@@ -710,7 +709,7 @@ function createAnimations(animations) {
710
709
  animations,
711
710
  usePresence,
712
711
  ResetPresence,
713
- useTextMetrics: function(param) {
712
+ useTextMetrics: function useTextMetrics(param) {
714
713
  var { inheritedText, lineHeight } = param;
715
714
  var node = (inheritedText === null || inheritedText === void 0 ? void 0 : inheritedText.driver) === "reanimated" ? inheritedText.fontSize : null;
716
715
  var ratio = typeof lineHeight === "number" ? lineHeight : null;
@@ -822,6 +821,7 @@ function createAnimations(animations) {
822
821
  return animatedStyle;
823
822
  },
824
823
  useAnimations(animationProps) {
824
+ var _ref, _exitSeedRef_current;
825
825
  var { props, presence, style, componentState, useStyleEmitter, themeName, stateRef, styleState, onTransition, inheritedText } = animationProps;
826
826
  var isHydrating = componentState.unmounted === true;
827
827
  var isMounting = componentState.unmounted === "should-enter";
@@ -832,8 +832,7 @@ function createAnimations(animations) {
832
832
  React.useEffect(function() {
833
833
  wasEnteringRef.current = isEntering;
834
834
  });
835
- var _styleState_effectiveTransition;
836
- var effectiveTransition = (_styleState_effectiveTransition = styleState === null || styleState === void 0 ? void 0 : styleState.effectiveTransition) !== null && _styleState_effectiveTransition !== void 0 ? _styleState_effectiveTransition : props.transition;
835
+ var effectiveTransition = (_ref = styleState === null || styleState === void 0 ? void 0 : styleState.effectiveTransition) !== null && _ref !== void 0 ? _ref : props.transition;
837
836
  var leadingRatio = getLeadingRatio(styleState === null || styleState === void 0 ? void 0 : styleState.nativeTextMetrics);
838
837
  var animationState = isExiting ? "exit" : isMounting || justFinishedEntering ? "enter" : "default";
839
838
  var resolvedTransition = forAnimationState(resolveTransition(effectiveTransition, { animations }), animationState);
@@ -850,7 +849,7 @@ function createAnimations(animations) {
850
849
  var leadingFontSize = inheritedFontSize !== null && inheritedFontSize !== void 0 ? inheritedFontSize : fontSizeShared;
851
850
  var leadingRatioShared = useSharedValue(leadingRatio !== null && leadingRatio !== void 0 ? leadingRatio : 0);
852
851
  var paintedRatioRef = useRef(leadingRatio);
853
- var applyLeadingRatio = function(ratio, config) {
852
+ var applyLeadingRatio = function applyLeadingRatio2(ratio, config) {
854
853
  var previous = paintedRatioRef.current;
855
854
  if (previous === ratio) return;
856
855
  paintedRatioRef.current = ratio;
@@ -861,7 +860,7 @@ function createAnimations(animations) {
861
860
  var sendExitComplete = presence === null || presence === void 0 ? void 0 : presence[1];
862
861
  var onTransitionRef = useRef(onTransition);
863
862
  onTransitionRef.current = onTransition;
864
- var emit = function(phase, cause, finished) {
863
+ var emit = function emit2(phase, cause, finished) {
865
864
  var _onTransitionRef_current;
866
865
  (_onTransitionRef_current = onTransitionRef.current) === null || _onTransitionRef_current === void 0 ? void 0 : _onTransitionRef_current.call(onTransitionRef, phase === "end" ? {
867
866
  phase,
@@ -979,7 +978,6 @@ function createAnimations(animations) {
979
978
  var lastPaintedRef = useRef({});
980
979
  var carryRef = useRef({});
981
980
  var exitSeedRef = useRef(null);
982
- var _exitSeedRef_current;
983
981
  var paintedPredecessor = isExiting ? (_exitSeedRef_current = exitSeedRef.current) !== null && _exitSeedRef_current !== void 0 ? _exitSeedRef_current : lastPaintedRef.current : lastPaintedRef.current;
984
982
  useIsomorphicLayoutEffect(function() {
985
983
  exitSeedRef.current = isExiting ? paintedPredecessor : null;
@@ -1114,7 +1112,7 @@ function createAnimations(animations) {
1114
1112
  };
1115
1113
  var configRef = useSharedValue(renderConfig);
1116
1114
  var writtenConfigRef = useRef(renderConfig);
1117
- var writeConfig = function(next) {
1115
+ var writeConfig = function writeConfig2(next) {
1118
1116
  if (sameDriverConfig(writtenConfigRef.current, next)) return;
1119
1117
  writtenConfigRef.current = next;
1120
1118
  configRef.value = next;
@@ -1128,11 +1126,12 @@ function createAnimations(animations) {
1128
1126
  isHydrating
1129
1127
  ]);
1130
1128
  useIsomorphicLayoutEffect(function() {
1131
- if (emitterSnapshotRef.value !== null) return;
1132
1129
  var _propertyConfigs_lineHeight;
1130
+ if (emitterSnapshotRef.value !== null) return;
1133
1131
  applyLeadingRatio(leadingRatio, (_propertyConfigs_lineHeight = propertyConfigs.lineHeight) !== null && _propertyConfigs_lineHeight !== void 0 ? _propertyConfigs_lineHeight : baseConfig);
1134
1132
  });
1135
- var onEmittedStyle = function(nextStyle, effectiveTransition2, pseudoActive, nextMetrics) {
1133
+ var onEmittedStyle = function onEmittedStyle2(nextStyle, effectiveTransition2, pseudoActive, nextMetrics) {
1134
+ var _emitterKeysRef_current, _newPropertyConfigs_lineHeight;
1136
1135
  if (isExitingJSRef.current) return;
1137
1136
  pseudoActiveRef.current = pseudoActive === true;
1138
1137
  var transitionToUse = effectiveTransition2 !== null && effectiveTransition2 !== void 0 ? effectiveTransition2 : props.transition;
@@ -1145,11 +1144,9 @@ function createAnimations(animations) {
1145
1144
  disableAnimation: written.disableAnimation,
1146
1145
  isHydrating: written.isHydrating
1147
1146
  });
1148
- var _emitterKeysRef_current;
1149
1147
  var previousKeys = (_emitterKeysRef_current = emitterKeysRef.current) !== null && _emitterKeysRef_current !== void 0 ? _emitterKeysRef_current : committedRenderKeysRef.current;
1150
1148
  var { animated, statics } = splitAnimationStyles(nextStyle, isDark, written.disableAnimation);
1151
1149
  var emittedDerivesLeading = derivesLeadingProduct(animated, emittedLeadingRatio, !!inheritedFontSize, emittedResolved);
1152
- var _newPropertyConfigs_lineHeight;
1153
1150
  applyLeadingRatio(emittedLeadingRatio, (_newPropertyConfigs_lineHeight = newPropertyConfigs.lineHeight) !== null && _newPropertyConfigs_lineHeight !== void 0 ? _newPropertyConfigs_lineHeight : newBase);
1154
1151
  var snapshot = buildSnapshot(animated, statics, getAnimatedTransforms(animated.transform), previousKeys, lastPaintedRef.current, emittedDerivesLeading);
1155
1152
  emitterSnapshotRef.value = snapshot.value;
@@ -1291,6 +1288,7 @@ function createAnimations(animations) {
1291
1288
  }
1292
1289
  }
1293
1290
  for (var key2 in animatedValues) {
1291
+ var _config_propertyConfigs_key;
1294
1292
  if (key2 === "transform") continue;
1295
1293
  var targetValue = animatedValues[key2];
1296
1294
  emitted[key2] = true;
@@ -1299,7 +1297,6 @@ function createAnimations(animations) {
1299
1297
  result[key2] = targetValue;
1300
1298
  continue;
1301
1299
  }
1302
- var _config_propertyConfigs_key;
1303
1300
  result[key2] = animateSnapshotValue(key2, key2, targetValue, (_config_propertyConfigs_key = config.propertyConfigs[key2]) !== null && _config_propertyConfigs_key !== void 0 ? _config_propertyConfigs_key : config.baseConfig, !!previouslyEmitted[key2], snapshot.seeds[key2], !!snapshot.gatedKeys[key2], currentlyExiting, currentCycleId, currentlyCompletingEnter, currentEnterCycleId, currentlyCompletingUpdate, currentUpdateCycleId, markExitKeyDone, markEnterKeyDone, markUpdateKeyDone, !!COLOR_STYLE_KEYS[key2], key2 === "fontSize" ? fontSizeShared : void 0);
1304
1301
  }
1305
1302
  if (snapshot.derivesLeading) {