motion 12.6.3-alpha.0 → 12.6.4-alpha.0

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.
Files changed (77) hide show
  1. package/dist/cjs/debug.js +18 -14
  2. package/dist/cjs/index.js +414 -359
  3. package/dist/cjs/mini.js +339 -352
  4. package/dist/cjs/react-client.js +180 -188
  5. package/dist/cjs/react-m.js +24 -24
  6. package/dist/cjs/react-mini.js +275 -336
  7. package/dist/es/framer-motion/dist/es/animation/animate/index.mjs +2 -2
  8. package/dist/es/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs +7 -4
  9. package/dist/es/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs +8 -6
  10. package/dist/es/framer-motion/dist/es/animation/animators/waapi/animate-elements.mjs +10 -8
  11. package/dist/es/framer-motion/dist/es/animation/animators/waapi/animate-sequence.mjs +2 -2
  12. package/dist/es/framer-motion/dist/es/animation/animators/waapi/animate-style.mjs +2 -2
  13. package/dist/es/framer-motion/dist/es/animation/generators/spring/index.mjs +11 -1
  14. package/dist/es/framer-motion/dist/es/animation/interfaces/motion-value.mjs +3 -3
  15. package/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs +1 -2
  16. package/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs +1 -2
  17. package/dist/es/framer-motion/dist/es/animation/optimized-appear/handoff.mjs +2 -4
  18. package/dist/es/framer-motion/dist/es/animation/optimized-appear/start.mjs +4 -6
  19. package/dist/es/framer-motion/dist/es/animation/sequence/create.mjs +3 -3
  20. package/dist/es/framer-motion/dist/es/animation/sequence/utils/calc-time.mjs +1 -2
  21. package/dist/es/framer-motion/dist/es/components/AnimatePresence/index.mjs +2 -2
  22. package/dist/es/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs +5 -10
  23. package/dist/es/framer-motion/dist/es/motion/features/animation/index.mjs +1 -2
  24. package/dist/es/framer-motion/dist/es/motion/index.mjs +2 -3
  25. package/dist/es/framer-motion/dist/es/motion/utils/use-visual-element.mjs +3 -5
  26. package/dist/es/framer-motion/dist/es/projection/node/create-projection-node.mjs +19 -27
  27. package/dist/es/framer-motion/dist/es/projection/styles/transform.mjs +1 -1
  28. package/dist/es/framer-motion/dist/es/render/VisualElement.mjs +3 -4
  29. package/dist/es/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs +1 -2
  30. package/dist/es/framer-motion/dist/es/render/dom/resize/handle-element.mjs +5 -6
  31. package/dist/es/framer-motion/dist/es/render/dom/scroll/track.mjs +1 -2
  32. package/dist/es/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs +1 -1
  33. package/dist/es/framer-motion/dist/es/render/dom/utils/filter-props.mjs +1 -1
  34. package/dist/es/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs +1 -2
  35. package/dist/es/framer-motion/dist/es/render/utils/KeyframesResolver.mjs +2 -3
  36. package/dist/es/framer-motion/dist/es/render/utils/animation-state.mjs +3 -5
  37. package/dist/es/framer-motion/dist/es/render/utils/motion-values.mjs +1 -1
  38. package/dist/es/framer-motion/dist/es/render/utils/resolve-variants.mjs +1 -1
  39. package/dist/es/framer-motion/dist/es/utils/interpolate.mjs +2 -1
  40. package/dist/es/framer-motion/dist/es/utils/mix/complex.mjs +1 -2
  41. package/dist/es/framer-motion/dist/es/value/types/complex/index.mjs +2 -3
  42. package/dist/es/framer-motion/dist/es/value/use-scroll.mjs +2 -2
  43. package/dist/es/framer-motion/dist/es/value/use-will-change/add-will-change.mjs +0 -7
  44. package/dist/es/motion/lib/index.mjs +1 -0
  45. package/dist/es/motion/lib/react.mjs +1 -1
  46. package/dist/es/motion-dom/dist/es/animation/{controls/BaseGroup.mjs → GroupAnimation.mjs} +4 -5
  47. package/dist/es/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs +9 -0
  48. package/dist/es/motion-dom/dist/es/animation/NativeAnimation.mjs +161 -0
  49. package/dist/es/motion-dom/dist/es/animation/generators/utils/is-generator.mjs +1 -1
  50. package/dist/es/motion-dom/dist/es/animation/keyframes/get-final.mjs +12 -0
  51. package/dist/es/motion-dom/dist/es/animation/keyframes/hydrate.mjs +26 -0
  52. package/dist/es/motion-dom/dist/es/animation/utils/get-value-transition.mjs +3 -5
  53. package/dist/es/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs +3 -0
  54. package/dist/es/motion-dom/dist/es/animation/waapi/easing/is-supported.mjs +14 -0
  55. package/dist/es/motion-dom/dist/es/animation/waapi/easing/map-easing.mjs +26 -0
  56. package/dist/es/motion-dom/dist/es/animation/waapi/easing/supported.mjs +15 -0
  57. package/dist/es/{framer-motion/dist/es/animation/animators/waapi/index.mjs → motion-dom/dist/es/animation/waapi/start-waapi-animation.mjs} +8 -6
  58. package/dist/es/{framer-motion/dist/es/animation/animators/waapi/utils/supports-partial-keyframes.mjs → motion-dom/dist/es/animation/waapi/supports/partial-keyframes.mjs} +2 -2
  59. package/dist/es/motion-dom/dist/es/animation/waapi/utils/apply-generator.mjs +14 -0
  60. package/dist/es/motion-dom/dist/es/animation/waapi/utils/linear.mjs +1 -4
  61. package/dist/es/motion-dom/dist/es/animation/waapi/utils/px-values.mjs +39 -0
  62. package/dist/es/motion-dom/dist/es/gestures/press/index.mjs +1 -1
  63. package/dist/es/motion-dom/dist/es/render/dom/style.mjs +15 -0
  64. package/dist/es/motion-dom/dist/es/utils/resolve-elements.mjs +2 -7
  65. package/dist/es/motion-dom/dist/es/utils/supports/flags.mjs +1 -3
  66. package/dist/es/motion-dom/dist/es/utils/supports/memo.mjs +1 -1
  67. package/dist/es/motion-dom/dist/es/value/index.mjs +1 -1
  68. package/dist/es/motion-utils/dist/es/errors.mjs +2 -4
  69. package/dist/es/motion-utils/dist/es/global-config.mjs +1 -4
  70. package/dist/motion.dev.js +414 -359
  71. package/dist/motion.js +1 -1
  72. package/package.json +3 -3
  73. package/dist/es/framer-motion/dist/es/animation/animators/waapi/NativeAnimation.mjs +0 -116
  74. package/dist/es/framer-motion/dist/es/animation/animators/waapi/utils/style.mjs +0 -8
  75. package/dist/es/motion-dom/dist/es/animation/controls/Group.mjs +0 -13
  76. package/dist/es/motion-dom/dist/es/animation/waapi/NativeAnimationControls.mjs +0 -85
  77. package/dist/es/motion-dom/dist/es/animation/waapi/utils/easing.mjs +0 -44
@@ -5,11 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var react = require('react');
7
7
 
8
- /*#__NO_SIDE_EFFECTS__*/
9
- const noop = (any) => any;
10
-
11
- let warning = noop;
12
- let invariant = noop;
8
+ let warning = () => { };
9
+ let invariant = () => { };
13
10
  if (process.env.NODE_ENV !== "production") {
14
11
  warning = (check, message) => {
15
12
  if (!check && typeof console !== "undefined") {
@@ -23,6 +20,11 @@ if (process.env.NODE_ENV !== "production") {
23
20
  };
24
21
  }
25
22
 
23
+ const MotionGlobalConfig = {};
24
+
25
+ /*#__NO_SIDE_EFFECTS__*/
26
+ const noop = (any) => any;
27
+
26
28
  const LayoutGroupContext = react.createContext({});
27
29
 
28
30
  const LazyContext = react.createContext({ strict: false });
@@ -171,6 +173,11 @@ function useMotionRef(visualState, visualElement, externalRef) {
171
173
  [visualElement]);
172
174
  }
173
175
 
176
+ const statsBuffer = {
177
+ value: null,
178
+ addProjectionMetrics: null,
179
+ };
180
+
174
181
  const stepsOrder = [
175
182
  "read", // Read
176
183
  "resolveKeyframes", // Write/Read/Write/Read
@@ -180,11 +187,6 @@ const stepsOrder = [
180
187
  "postRender", // Compute
181
188
  ];
182
189
 
183
- const statsBuffer = {
184
- value: null,
185
- addProjectionMetrics: null,
186
- };
187
-
188
190
  function createRenderStep(runNextFrame, stepName) {
189
191
  /**
190
192
  * We create and reuse two queues, one to queue jobs for the current frame
@@ -290,9 +292,11 @@ function createRenderBatcher(scheduleNextBatch, allowKeepAlive) {
290
292
  }, {});
291
293
  const { read, resolveKeyframes, update, preRender, render, postRender } = steps;
292
294
  const processBatch = () => {
293
- const timestamp = performance.now();
295
+ const timestamp = MotionGlobalConfig.useManualTiming
296
+ ? state.timestamp
297
+ : performance.now();
294
298
  runNextFrame = false;
295
- {
299
+ if (!MotionGlobalConfig.useManualTiming) {
296
300
  state.delta = useDefaultElapsed
297
301
  ? 1000 / 60
298
302
  : Math.max(Math.min(timestamp - state.timestamp, maxElapsed), 1);
@@ -363,7 +367,6 @@ const SwitchLayoutGroupContext = react.createContext({});
363
367
  const useIsomorphicLayoutEffect = isBrowser ? react.useLayoutEffect : react.useEffect;
364
368
 
365
369
  function useVisualElement(Component, visualState, props, createVisualElement, ProjectionNodeConstructor) {
366
- var _a, _b;
367
370
  const { visualElement: parent } = react.useContext(MotionContext);
368
371
  const lazyContext = react.useContext(LazyContext);
369
372
  const presenceContext = react.useContext(PresenceContext);
@@ -413,8 +416,8 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
413
416
  */
414
417
  const optimisedAppearId = props[optimizedAppearDataAttribute];
415
418
  const wantsHandoff = react.useRef(Boolean(optimisedAppearId) &&
416
- !((_a = window.MotionHandoffIsComplete) === null || _a === void 0 ? void 0 : _a.call(window, optimisedAppearId)) &&
417
- ((_b = window.MotionHasOptimisedAnimation) === null || _b === void 0 ? void 0 : _b.call(window, optimisedAppearId)));
419
+ !window.MotionHandoffIsComplete?.(optimisedAppearId) &&
420
+ window.MotionHasOptimisedAnimation?.(optimisedAppearId));
418
421
  useIsomorphicLayoutEffect(() => {
419
422
  if (!visualElement)
420
423
  return;
@@ -445,8 +448,7 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
445
448
  if (wantsHandoff.current) {
446
449
  // This ensures all future calls to animateChanges() in this component will run in useEffect
447
450
  queueMicrotask(() => {
448
- var _a;
449
- (_a = window.MotionHandoffMarkAsComplete) === null || _a === void 0 ? void 0 : _a.call(window, optimisedAppearId);
451
+ window.MotionHandoffMarkAsComplete?.(optimisedAppearId);
450
452
  });
451
453
  wantsHandoff.current = false;
452
454
  }
@@ -494,7 +496,6 @@ function getClosestProjectingNode(visualElement) {
494
496
  * component "offline", or outside the React render cycle.
495
497
  */
496
498
  function createRendererMotionComponent({ preloadedFeatures, createVisualElement, useRender, useVisualState, Component, }) {
497
- var _a, _b;
498
499
  preloadedFeatures && loadFeatures(preloadedFeatures);
499
500
  function MotionComponent(props, externalRef) {
500
501
  /**
@@ -530,7 +531,7 @@ function createRendererMotionComponent({ preloadedFeatures, createVisualElement,
530
531
  }
531
532
  MotionComponent.displayName = `motion.${typeof Component === "string"
532
533
  ? Component
533
- : `create(${(_b = (_a = Component.displayName) !== null && _a !== void 0 ? _a : Component.name) !== null && _b !== void 0 ? _b : ""})`}`;
534
+ : `create(${Component.displayName ?? Component.name ?? ""})`}`;
534
535
  const ForwardRefMotionComponent = react.forwardRef(MotionComponent);
535
536
  ForwardRefMotionComponent[motionComponentSymbol] = Component;
536
537
  return ForwardRefMotionComponent;
@@ -562,7 +563,7 @@ function getProjectionFunctionality(props) {
562
563
  return {};
563
564
  const combined = { ...drag, ...layout };
564
565
  return {
565
- MeasureLayout: (drag === null || drag === void 0 ? void 0 : drag.isEnabled(props)) || (layout === null || layout === void 0 ? void 0 : layout.isEnabled(props))
566
+ MeasureLayout: drag?.isEnabled(props) || layout?.isEnabled(props)
566
567
  ? combined.MeasureLayout
567
568
  : undefined,
568
569
  ProjectionNode: combined.ProjectionNode,
@@ -993,7 +994,7 @@ try {
993
994
  */
994
995
  loadExternalIsValidProp(require("@emotion/is-prop-valid").default);
995
996
  }
996
- catch (_a) {
997
+ catch {
997
998
  // We don't need to actually do anything here - the fallback is the existing `isPropValid`.
998
999
  }
999
1000
  function filterProps(props, isDom, forwardMotionProps) {
@@ -1222,7 +1223,7 @@ function createUseRender(forwardMotionProps = false) {
1222
1223
 
1223
1224
  function getValueState(visualElement) {
1224
1225
  const state = [{}, {}];
1225
- visualElement === null || visualElement === void 0 ? void 0 : visualElement.values.forEach((value, key) => {
1226
+ visualElement?.values.forEach((value, key) => {
1226
1227
  state[0][key] = value.get();
1227
1228
  state[1][key] = value.getVelocity();
1228
1229
  });
@@ -1365,7 +1366,6 @@ function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
1365
1366
  }
1366
1367
 
1367
1368
  function scrapeMotionValuesFromProps$1(props, prevProps, visualElement) {
1368
- var _a;
1369
1369
  const { style } = props;
1370
1370
  const newValues = {};
1371
1371
  for (const key in style) {
@@ -1373,7 +1373,7 @@ function scrapeMotionValuesFromProps$1(props, prevProps, visualElement) {
1373
1373
  (prevProps.style &&
1374
1374
  isMotionValue(prevProps.style[key])) ||
1375
1375
  isForcedMotionValue(key, props) ||
1376
- ((_a = visualElement === null || visualElement === void 0 ? void 0 : visualElement.getValue(key)) === null || _a === void 0 ? void 0 : _a.liveStyle) !== undefined) {
1376
+ visualElement?.getValue(key)?.liveStyle !== undefined) {
1377
1377
  newValues[key] = style[key];
1378
1378
  }
1379
1379
  }