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.
- package/dist/cjs/debug.js +18 -14
- package/dist/cjs/index.js +414 -359
- package/dist/cjs/mini.js +339 -352
- package/dist/cjs/react-client.js +180 -188
- package/dist/cjs/react-m.js +24 -24
- package/dist/cjs/react-mini.js +275 -336
- package/dist/es/framer-motion/dist/es/animation/animate/index.mjs +2 -2
- package/dist/es/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs +7 -4
- package/dist/es/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs +8 -6
- package/dist/es/framer-motion/dist/es/animation/animators/waapi/animate-elements.mjs +10 -8
- package/dist/es/framer-motion/dist/es/animation/animators/waapi/animate-sequence.mjs +2 -2
- package/dist/es/framer-motion/dist/es/animation/animators/waapi/animate-style.mjs +2 -2
- package/dist/es/framer-motion/dist/es/animation/generators/spring/index.mjs +11 -1
- package/dist/es/framer-motion/dist/es/animation/interfaces/motion-value.mjs +3 -3
- package/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs +1 -2
- package/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs +1 -2
- package/dist/es/framer-motion/dist/es/animation/optimized-appear/handoff.mjs +2 -4
- package/dist/es/framer-motion/dist/es/animation/optimized-appear/start.mjs +4 -6
- package/dist/es/framer-motion/dist/es/animation/sequence/create.mjs +3 -3
- package/dist/es/framer-motion/dist/es/animation/sequence/utils/calc-time.mjs +1 -2
- package/dist/es/framer-motion/dist/es/components/AnimatePresence/index.mjs +2 -2
- package/dist/es/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs +5 -10
- package/dist/es/framer-motion/dist/es/motion/features/animation/index.mjs +1 -2
- package/dist/es/framer-motion/dist/es/motion/index.mjs +2 -3
- package/dist/es/framer-motion/dist/es/motion/utils/use-visual-element.mjs +3 -5
- package/dist/es/framer-motion/dist/es/projection/node/create-projection-node.mjs +19 -27
- package/dist/es/framer-motion/dist/es/projection/styles/transform.mjs +1 -1
- package/dist/es/framer-motion/dist/es/render/VisualElement.mjs +3 -4
- package/dist/es/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs +1 -2
- package/dist/es/framer-motion/dist/es/render/dom/resize/handle-element.mjs +5 -6
- package/dist/es/framer-motion/dist/es/render/dom/scroll/track.mjs +1 -2
- package/dist/es/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs +1 -1
- package/dist/es/framer-motion/dist/es/render/dom/utils/filter-props.mjs +1 -1
- package/dist/es/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs +1 -2
- package/dist/es/framer-motion/dist/es/render/utils/KeyframesResolver.mjs +2 -3
- package/dist/es/framer-motion/dist/es/render/utils/animation-state.mjs +3 -5
- package/dist/es/framer-motion/dist/es/render/utils/motion-values.mjs +1 -1
- package/dist/es/framer-motion/dist/es/render/utils/resolve-variants.mjs +1 -1
- package/dist/es/framer-motion/dist/es/utils/interpolate.mjs +2 -1
- package/dist/es/framer-motion/dist/es/utils/mix/complex.mjs +1 -2
- package/dist/es/framer-motion/dist/es/value/types/complex/index.mjs +2 -3
- package/dist/es/framer-motion/dist/es/value/use-scroll.mjs +2 -2
- package/dist/es/framer-motion/dist/es/value/use-will-change/add-will-change.mjs +0 -7
- package/dist/es/motion/lib/index.mjs +1 -0
- package/dist/es/motion/lib/react.mjs +1 -1
- package/dist/es/motion-dom/dist/es/animation/{controls/BaseGroup.mjs → GroupAnimation.mjs} +4 -5
- package/dist/es/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs +9 -0
- package/dist/es/motion-dom/dist/es/animation/NativeAnimation.mjs +161 -0
- package/dist/es/motion-dom/dist/es/animation/generators/utils/is-generator.mjs +1 -1
- package/dist/es/motion-dom/dist/es/animation/keyframes/get-final.mjs +12 -0
- package/dist/es/motion-dom/dist/es/animation/keyframes/hydrate.mjs +26 -0
- package/dist/es/motion-dom/dist/es/animation/utils/get-value-transition.mjs +3 -5
- package/dist/es/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs +3 -0
- package/dist/es/motion-dom/dist/es/animation/waapi/easing/is-supported.mjs +14 -0
- package/dist/es/motion-dom/dist/es/animation/waapi/easing/map-easing.mjs +26 -0
- package/dist/es/motion-dom/dist/es/animation/waapi/easing/supported.mjs +15 -0
- package/dist/es/{framer-motion/dist/es/animation/animators/waapi/index.mjs → motion-dom/dist/es/animation/waapi/start-waapi-animation.mjs} +8 -6
- 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
- package/dist/es/motion-dom/dist/es/animation/waapi/utils/apply-generator.mjs +14 -0
- package/dist/es/motion-dom/dist/es/animation/waapi/utils/linear.mjs +1 -4
- package/dist/es/motion-dom/dist/es/animation/waapi/utils/px-values.mjs +39 -0
- package/dist/es/motion-dom/dist/es/gestures/press/index.mjs +1 -1
- package/dist/es/motion-dom/dist/es/render/dom/style.mjs +15 -0
- package/dist/es/motion-dom/dist/es/utils/resolve-elements.mjs +2 -7
- package/dist/es/motion-dom/dist/es/utils/supports/flags.mjs +1 -3
- package/dist/es/motion-dom/dist/es/utils/supports/memo.mjs +1 -1
- package/dist/es/motion-dom/dist/es/value/index.mjs +1 -1
- package/dist/es/motion-utils/dist/es/errors.mjs +2 -4
- package/dist/es/motion-utils/dist/es/global-config.mjs +1 -4
- package/dist/motion.dev.js +414 -359
- package/dist/motion.js +1 -1
- package/package.json +3 -3
- package/dist/es/framer-motion/dist/es/animation/animators/waapi/NativeAnimation.mjs +0 -116
- package/dist/es/framer-motion/dist/es/animation/animators/waapi/utils/style.mjs +0 -8
- package/dist/es/motion-dom/dist/es/animation/controls/Group.mjs +0 -13
- package/dist/es/motion-dom/dist/es/animation/waapi/NativeAnimationControls.mjs +0 -85
- package/dist/es/motion-dom/dist/es/animation/waapi/utils/easing.mjs +0 -44
package/dist/cjs/react-m.js
CHANGED
|
@@ -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
|
-
|
|
9
|
-
|
|
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 =
|
|
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
|
-
!
|
|
417
|
-
|
|
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
|
-
|
|
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(${
|
|
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:
|
|
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
|
|
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
|
|
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
|
-
|
|
1376
|
+
visualElement?.getValue(key)?.liveStyle !== undefined) {
|
|
1377
1377
|
newValues[key] = style[key];
|
|
1378
1378
|
}
|
|
1379
1379
|
}
|