framer-motion 12.23.14 → 12.23.16

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 (74) hide show
  1. package/dist/cjs/client.js +1 -2
  2. package/dist/cjs/dom.js +1 -1
  3. package/dist/cjs/{feature-bundle-DUWayF3h.js → feature-bundle-DzuUB-G1.js} +0 -1
  4. package/dist/cjs/index.js +57 -3
  5. package/dist/cjs/m.js +4 -18
  6. package/dist/dom-mini.js +1 -1
  7. package/dist/dom.js +1 -1
  8. package/dist/es/animation/hooks/use-animate-style.mjs +1 -0
  9. package/dist/es/animation/hooks/use-animate.mjs +1 -0
  10. package/dist/es/animation/hooks/use-animated-state.mjs +1 -0
  11. package/dist/es/animation/hooks/use-animation.mjs +1 -0
  12. package/dist/es/client.mjs +0 -2
  13. package/dist/es/components/AnimatePresence/PopChild.mjs +3 -1
  14. package/dist/es/components/AnimatePresence/use-composed-ref.mjs +57 -0
  15. package/dist/es/components/AnimatePresence/use-presence-data.mjs +1 -0
  16. package/dist/es/components/AnimatePresence/use-presence.mjs +1 -0
  17. package/dist/es/components/AnimateSharedLayout.mjs +1 -0
  18. package/dist/es/context/DeprecatedLayoutGroupContext.mjs +1 -0
  19. package/dist/es/context/MotionContext/create.mjs +1 -0
  20. package/dist/es/events/use-dom-event.mjs +1 -0
  21. package/dist/es/index.mjs +0 -2
  22. package/dist/es/m.mjs +0 -1
  23. package/dist/es/motion/utils/use-motion-ref.mjs +1 -0
  24. package/dist/es/motion/utils/use-visual-element.mjs +1 -0
  25. package/dist/es/motion/utils/use-visual-state.mjs +1 -0
  26. package/dist/es/render/dom/features-animation.mjs +1 -0
  27. package/dist/es/render/dom/features-max.mjs +1 -0
  28. package/dist/es/render/dom/features-min.mjs +1 -0
  29. package/dist/es/render/dom/use-render.mjs +1 -0
  30. package/dist/es/render/html/use-html-visual-state.mjs +1 -0
  31. package/dist/es/render/html/use-props.mjs +1 -0
  32. package/dist/es/render/svg/use-props.mjs +1 -0
  33. package/dist/es/render/svg/use-svg-visual-state.mjs +1 -0
  34. package/dist/es/utils/reduced-motion/use-reduced-motion-config.mjs +1 -0
  35. package/dist/es/utils/reduced-motion/use-reduced-motion.mjs +1 -0
  36. package/dist/es/utils/use-animation-frame.mjs +1 -0
  37. package/dist/es/utils/use-constant.mjs +1 -0
  38. package/dist/es/utils/use-cycle.mjs +1 -0
  39. package/dist/es/utils/use-force-update.mjs +1 -0
  40. package/dist/es/utils/use-in-view.mjs +1 -0
  41. package/dist/es/utils/use-instant-transition.mjs +1 -0
  42. package/dist/es/utils/use-is-mounted.mjs +1 -0
  43. package/dist/es/utils/use-isomorphic-effect.mjs +1 -0
  44. package/dist/es/utils/use-motion-value-event.mjs +1 -0
  45. package/dist/es/utils/use-page-in-view.mjs +1 -0
  46. package/dist/es/utils/use-unmount-effect.mjs +1 -0
  47. package/dist/es/value/use-combine-values.mjs +1 -0
  48. package/dist/es/value/use-computed.mjs +1 -0
  49. package/dist/es/value/use-inverted-scale.mjs +1 -0
  50. package/dist/es/value/use-motion-template.mjs +1 -0
  51. package/dist/es/value/use-motion-value.mjs +1 -0
  52. package/dist/es/value/use-scroll.mjs +1 -0
  53. package/dist/es/value/use-spring.mjs +1 -0
  54. package/dist/es/value/use-time.mjs +1 -0
  55. package/dist/es/value/use-transform.mjs +1 -0
  56. package/dist/es/value/use-velocity.mjs +1 -0
  57. package/dist/es/value/use-will-change/index.mjs +1 -0
  58. package/dist/framer-motion.dev.js +56 -2
  59. package/dist/framer-motion.js +1 -1
  60. package/dist/mini.js +1 -1
  61. package/dist/size-rollup-animate.js +1 -1
  62. package/dist/size-rollup-dom-animation-assets.js +1 -1
  63. package/dist/size-rollup-dom-animation-m.js +1 -1
  64. package/dist/size-rollup-dom-animation.js +1 -1
  65. package/dist/size-rollup-dom-max-assets.js +1 -1
  66. package/dist/size-rollup-dom-max.js +1 -1
  67. package/dist/size-rollup-m.js +1 -1
  68. package/dist/size-rollup-motion.js +1 -1
  69. package/dist/size-rollup-scroll.js +1 -1
  70. package/dist/size-rollup-waapi-animate.js +1 -1
  71. package/dist/types/client.d.ts +2 -4
  72. package/dist/types/index.d.ts +78 -3
  73. package/dist/{types.d-CSbqhfMB.d.ts → types.d-DsEeKk6G.d.ts} +3 -79
  74. package/package.json +2 -2
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var featureBundle = require('./feature-bundle-DUWayF3h.js');
5
+ var featureBundle = require('./feature-bundle-DzuUB-G1.js');
6
6
  require('react');
7
7
  require('motion-dom');
8
8
  require('motion-utils');
@@ -202,7 +202,6 @@ const MotionRadialGradient =
202
202
  /*@__PURE__*/ createMotionComponentWithFeatures("radialGradient");
203
203
  const MotionTextPath = /*@__PURE__*/ createMotionComponentWithFeatures("textPath");
204
204
 
205
- exports.create = featureBundle.createMotionComponent;
206
205
  exports.a = MotionA;
207
206
  exports.abbr = MotionAbbr;
208
207
  exports.address = MotionAddress;
package/dist/cjs/dom.js CHANGED
@@ -383,7 +383,7 @@ function resolveVariantFromProps(props, definition, custom, visualElement) {
383
383
 
384
384
  function resolveVariant(visualElement, definition, custom) {
385
385
  const props = visualElement.getProps();
386
- return resolveVariantFromProps(props, definition, custom !== undefined ? custom : props.custom, visualElement);
386
+ return resolveVariantFromProps(props, definition, props.custom, visualElement);
387
387
  }
388
388
 
389
389
  /**
@@ -6226,7 +6226,6 @@ const featureBundle = {
6226
6226
  ...layout,
6227
6227
  };
6228
6228
 
6229
- exports.FlatTree = FlatTree;
6230
6229
  exports.HTMLVisualElement = HTMLVisualElement;
6231
6230
  exports.LayoutGroupContext = LayoutGroupContext;
6232
6231
  exports.LazyContext = LazyContext;
package/dist/cjs/index.js CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var React = require('react');
7
- var featureBundle = require('./feature-bundle-DUWayF3h.js');
7
+ var featureBundle = require('./feature-bundle-DzuUB-G1.js');
8
8
  var motionDom = require('motion-dom');
9
9
  var motionUtils = require('motion-utils');
10
10
 
@@ -27,6 +27,60 @@ function _interopNamespaceDefault(e) {
27
27
 
28
28
  var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
29
29
 
30
+ /**
31
+ * Set a given ref to a given value
32
+ * This utility takes care of different types of refs: callback refs and RefObject(s)
33
+ */
34
+ function setRef(ref, value) {
35
+ if (typeof ref === "function") {
36
+ return ref(value);
37
+ }
38
+ else if (ref !== null && ref !== undefined) {
39
+ ref.current = value;
40
+ }
41
+ }
42
+ /**
43
+ * A utility to compose multiple refs together
44
+ * Accepts callback refs and RefObject(s)
45
+ */
46
+ function composeRefs(...refs) {
47
+ return (node) => {
48
+ let hasCleanup = false;
49
+ const cleanups = refs.map((ref) => {
50
+ const cleanup = setRef(ref, node);
51
+ if (!hasCleanup && typeof cleanup === "function") {
52
+ hasCleanup = true;
53
+ }
54
+ return cleanup;
55
+ });
56
+ // React <19 will log an error to the console if a callback ref returns a
57
+ // value. We don't use ref cleanups internally so this will only happen if a
58
+ // user's ref callback returns a value, which we only expect if they are
59
+ // using the cleanup functionality added in React 19.
60
+ if (hasCleanup) {
61
+ return () => {
62
+ for (let i = 0; i < cleanups.length; i++) {
63
+ const cleanup = cleanups[i];
64
+ if (typeof cleanup === "function") {
65
+ cleanup();
66
+ }
67
+ else {
68
+ setRef(refs[i], null);
69
+ }
70
+ }
71
+ };
72
+ }
73
+ };
74
+ }
75
+ /**
76
+ * A custom hook that composes multiple refs
77
+ * Accepts callback refs and RefObject(s)
78
+ */
79
+ function useComposedRefs(...refs) {
80
+ // eslint-disable-next-line react-hooks/exhaustive-deps
81
+ return React__namespace.useCallback(composeRefs(...refs), refs);
82
+ }
83
+
30
84
  /**
31
85
  * Measurement functionality has to be within a separate component
32
86
  * to leverage snapshot lifecycle.
@@ -67,6 +121,7 @@ function PopChild({ children, isPresent, anchorX, root }) {
67
121
  right: 0,
68
122
  });
69
123
  const { nonce } = React.useContext(featureBundle.MotionConfigContext);
124
+ const composedRef = useComposedRefs(ref, children?.ref);
70
125
  /**
71
126
  * We create and inject a style block so we can apply this explicit
72
127
  * sizing in a non-destructive manner by just deleting the style block.
@@ -104,7 +159,7 @@ function PopChild({ children, isPresent, anchorX, root }) {
104
159
  }
105
160
  };
106
161
  }, [isPresent]);
107
- return (jsxRuntime.jsx(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size, children: React__namespace.cloneElement(children, { ref }) }));
162
+ return (jsxRuntime.jsx(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size, children: React__namespace.cloneElement(children, { ref: composedRef }) }));
108
163
  }
109
164
 
110
165
  const PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, anchorX, root }) => {
@@ -2861,7 +2916,6 @@ function useInvertedScale(scale) {
2861
2916
  return { scaleX, scaleY };
2862
2917
  }
2863
2918
 
2864
- exports.FlatTree = featureBundle.FlatTree;
2865
2919
  exports.LayoutGroupContext = featureBundle.LayoutGroupContext;
2866
2920
  exports.MotionConfigContext = featureBundle.MotionConfigContext;
2867
2921
  exports.MotionContext = featureBundle.MotionContext;
package/dist/cjs/m.js CHANGED
@@ -561,10 +561,6 @@ const PresenceContext =
561
561
 
562
562
  function getValueState(visualElement) {
563
563
  const state = [{}, {}];
564
- visualElement?.values.forEach((value, key) => {
565
- state[0][key] = value.get();
566
- state[1][key] = value.getVelocity();
567
- });
568
564
  return state;
569
565
  }
570
566
  function resolveVariantFromProps(props, definition, custom, visualElement) {
@@ -572,8 +568,8 @@ function resolveVariantFromProps(props, definition, custom, visualElement) {
572
568
  * If the variant definition is a function, resolve.
573
569
  */
574
570
  if (typeof definition === "function") {
575
- const [current, velocity] = getValueState(visualElement);
576
- definition = definition(custom !== undefined ? custom : props.custom, current, velocity);
571
+ const [current, velocity] = getValueState();
572
+ definition = definition(props.custom, current, velocity);
577
573
  }
578
574
  /**
579
575
  * If the variant definition is a variant label, or
@@ -588,8 +584,8 @@ function resolveVariantFromProps(props, definition, custom, visualElement) {
588
584
  * If so, resolve. This can only have returned a valid target object.
589
585
  */
590
586
  if (typeof definition === "function") {
591
- const [current, velocity] = getValueState(visualElement);
592
- definition = definition(custom !== undefined ? custom : props.custom, current, velocity);
587
+ const [current, velocity] = getValueState();
588
+ definition = definition(props.custom, current, velocity);
593
589
  }
594
590
  return definition;
595
591
  }
@@ -755,15 +751,6 @@ for (const key in featureProps) {
755
751
  };
756
752
  }
757
753
 
758
- function loadFeatures(features) {
759
- for (const key in features) {
760
- featureDefinitions[key] = {
761
- ...featureDefinitions[key],
762
- ...features[key],
763
- };
764
- }
765
- }
766
-
767
754
  const motionComponentSymbol = Symbol.for("motionComponentSymbol");
768
755
 
769
756
  function isRefObject(ref) {
@@ -958,7 +945,6 @@ function getClosestProjectingNode(visualElement) {
958
945
  * component "offline", or outside the React render cycle.
959
946
  */
960
947
  function createMotionComponent(Component, { forwardMotionProps = false } = {}, preloadedFeatures, createVisualElement) {
961
- preloadedFeatures && loadFeatures(preloadedFeatures);
962
948
  const useVisualState = isSVGComponent(Component)
963
949
  ? useSVGVisualState
964
950
  : useHTMLVisualState;
package/dist/dom-mini.js CHANGED
@@ -1 +1 @@
1
- !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).Motion={})}(this,function(t){"use strict";function e(t,e){const n=t.indexOf(e);n>-1&&t.splice(n,1)}function n(t){let e;return()=>(void 0===e&&(e=t()),e)}const i=t=>t,s=(t,e,n)=>{const i=e-t;return 0===i?1:(n-t)/i},o=t=>1e3*t,a=t=>t/1e3;function r(t,e){return n=t,Array.isArray(n)&&"number"!=typeof n[0]?t[((t,e,n)=>{const i=e-t;return((n-t)%i+i)%i+t})(0,t.length,e)]:t;var n}const l=(t,e,n)=>t+(e-t)*n,u=2e4;function h(t,e=100,n){const i=n({...t,keyframes:[0,e]}),s=Math.min(function(t){let e=0,n=t.next(e);for(;!n.done&&e<u;)e+=50,n=t.next(e);return e>=u?1/0:e}(i),u);return{type:"keyframes",ease:t=>i.next(s*t).value/e,duration:a(s)}}function c(t,e){const n=t[t.length-1];for(let i=1;i<=e;i++){const o=s(0,e,i);t.push(l(n,1,o))}}function f(t){const e=[0];return c(e,t.length-1),e}const m=t=>null!==t;class d{constructor(){this.updateFinished()}get finished(){return this._finished}updateFinished(){this._finished=new Promise(t=>{this.resolve=t})}notifyFinished(){this.resolve()}then(t,e){return this.finished.then(t,e)}}function p(t){for(let e=1;e<t.length;e++)t[e]??(t[e]=t[e-1])}const y=t=>t.startsWith("--");const g=n(()=>void 0!==window.ScrollTimeline),A={};function b(t,e){const i=n(t);return()=>A[e]??i()}const T=b(()=>{try{document.createElement("div").animate({opacity:0},{easing:"linear(0, 1)"})}catch(t){return!1}return!0},"linearEasing"),v=([t,e,n,i])=>`cubic-bezier(${t}, ${e}, ${n}, ${i})`,M={linear:"linear",ease:"ease",easeIn:"ease-in",easeOut:"ease-out",easeInOut:"ease-in-out",circIn:v([0,.65,.55,1]),circOut:v([.55,0,1,.45]),backIn:v([.31,.01,.66,-.59]),backOut:v([.33,1.53,.69,.99])};function w(t,e){return t?"function"==typeof t?T()?((t,e,n=10)=>{let i="";const s=Math.max(Math.round(e/n),2);for(let e=0;e<s;e++)i+=Math.round(1e4*t(e/(s-1)))/1e4+", ";return`linear(${i.substring(0,i.length-2)})`})(t,e):"ease-out":(t=>Array.isArray(t)&&"number"==typeof t[0])(t)?v(t):Array.isArray(t)?t.map(t=>w(t,e)||M.easeOut):M[t]:void 0}function k(t){return"function"==typeof t&&"applyToOptions"in t}class x extends d{constructor(t){if(super(),this.finishedTime=null,this.isStopped=!1,!t)return;const{element:e,name:n,keyframes:i,pseudoElement:s,allowFlatten:o=!1,finalKeyframe:a,onComplete:r}=t;this.isPseudoElement=Boolean(s),this.allowFlatten=o,this.options=t,t.type;const l=function({type:t,...e}){return k(t)&&T()?t.applyToOptions(e):(e.duration??(e.duration=300),e.ease??(e.ease="easeOut"),e)}(t);this.animation=function(t,e,n,{delay:i=0,duration:s=300,repeat:o=0,repeatType:a="loop",ease:r="easeOut",times:l}={},u){const h={[e]:n};l&&(h.offset=l);const c=w(r,s);Array.isArray(c)&&(h.easing=c);const f={delay:i,duration:s,easing:Array.isArray(c)?"linear":c,fill:"both",iterations:o+1,direction:"reverse"===a?"alternate":"normal"};return u&&(f.pseudoElement=u),t.animate(h,f)}(e,n,i,l,s),!1===l.autoplay&&this.animation.pause(),this.animation.onfinish=()=>{if(this.finishedTime=this.time,!s){const t=function(t,{repeat:e,repeatType:n="loop"},i,s=1){const o=t.filter(m),a=s<0||e&&"loop"!==n&&e%2==1?0:o.length-1;return a&&void 0!==i?i:o[a]}(i,this.options,a,this.speed);this.updateMotionValue?this.updateMotionValue(t):function(t,e,n){y(e)?t.style.setProperty(e,n):t.style[e]=n}(e,n,t),this.animation.cancel()}r?.(),this.notifyFinished()}}play(){this.isStopped||(this.animation.play(),"finished"===this.state&&this.updateFinished())}pause(){this.animation.pause()}complete(){this.animation.finish?.()}cancel(){try{this.animation.cancel()}catch(t){}}stop(){if(this.isStopped)return;this.isStopped=!0;const{state:t}=this;"idle"!==t&&"finished"!==t&&(this.updateMotionValue?this.updateMotionValue():this.commitStyles(),this.isPseudoElement||this.cancel())}commitStyles(){this.isPseudoElement||this.animation.commitStyles?.()}get duration(){const t=this.animation.effect?.getComputedTiming?.().duration||0;return a(Number(t))}get time(){return a(Number(this.animation.currentTime)||0)}set time(t){this.finishedTime=null,this.animation.currentTime=o(t)}get speed(){return this.animation.playbackRate}set speed(t){t<0&&(this.finishedTime=null),this.animation.playbackRate=t}get state(){return null!==this.finishedTime?"finished":this.animation.playState}get startTime(){return Number(this.animation.startTime)}set startTime(t){this.animation.startTime=t}attachTimeline({timeline:t,observe:e}){return this.allowFlatten&&this.animation.effect?.updateTiming({easing:"linear"}),this.animation.onfinish=null,t&&g()?(this.animation.timeline=t,i):e(this)}}class E{constructor(t){this.stop=()=>this.runAll("stop"),this.animations=t.filter(Boolean)}get finished(){return Promise.all(this.animations.map(t=>t.finished))}getAll(t){return this.animations[0][t]}setAll(t,e){for(let n=0;n<this.animations.length;n++)this.animations[n][t]=e}attachTimeline(t){const e=this.animations.map(e=>e.attachTimeline(t));return()=>{e.forEach((t,e)=>{t&&t(),this.animations[e].stop()})}}get time(){return this.getAll("time")}set time(t){this.setAll("time",t)}get speed(){return this.getAll("speed")}set speed(t){this.setAll("speed",t)}get state(){return this.getAll("state")}get startTime(){return this.getAll("startTime")}get duration(){let t=0;for(let e=0;e<this.animations.length;e++)t=Math.max(t,this.animations[e].duration);return t}runAll(t){this.animations.forEach(e=>e[t]())}play(){this.runAll("play")}pause(){this.runAll("pause")}cancel(){this.runAll("cancel")}complete(){this.runAll("complete")}}class O extends E{then(t,e){return this.finished.finally(t).then(()=>{})}}const S=new WeakMap,R=(t,e="")=>`${t}:${e}`;function F(t){const e=S.get(t)||new Map;return S.set(t,e),e}function W(t,e){return t?.[e]??t?.default??t}const P=new Set(["borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderRadius","radius","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","width","maxWidth","height","maxHeight","top","right","bottom","left","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginTop","marginRight","marginBottom","marginLeft","backgroundPositionX","backgroundPositionY"]);function B(t,e){for(let n=0;n<t.length;n++)"number"==typeof t[n]&&P.has(e)&&(t[n]=t[n]+"px")}function $(t,e,n){if(t instanceof EventTarget)return[t];if("string"==typeof t){let i=document;e&&(i=e.current);const s=n?.[t]??i.querySelectorAll(t);return s?Array.from(s):[]}return Array.from(t)}function L(t,e){const n=window.getComputedStyle(t);return y(e)?n.getPropertyValue(e):n[e]}const V=t=>Boolean(t&&t.getVelocity);function I(t,e,n,i){return"string"==typeof t&&function(t){return"object"==typeof t&&!Array.isArray(t)}(e)?$(t,n,i):t instanceof NodeList?Array.from(t):Array.isArray(t)?t:[t]}function N(t,e,n){return t*(e+1)}function C(t,e,n,i){return"number"==typeof e?e:e.startsWith("-")||e.startsWith("+")?Math.max(0,t+parseFloat(e)):"<"===e?n:e.startsWith("<")?Math.max(0,n+parseFloat(e.slice(1))):i.get(e)??t}function K(t,n,i,s,o,a){!function(t,n,i){for(let s=0;s<t.length;s++){const o=t[s];o.at>n&&o.at<i&&(e(t,o),s--)}}(t,o,a);for(let e=0;e<n.length;e++)t.push({value:n[e],at:l(o,a,s[e]),easing:r(i,e)})}function j(t,e){for(let n=0;n<t.length;n++)t[n]=t[n]/(e+1)}function q(t,e){return t.at===e.at?null===t.value?1:null===e.value?-1:0:t.at-e.at}function _(t,e){return!e.has(t)&&e.set(t,{}),e.get(t)}function z(t,e){return e[t]||(e[t]=[]),e[t]}function D(t){return Array.isArray(t)?t:[t]}function H(t,e){return t&&t[e]?{...t,...t[e]}:{...t}}const X=t=>"number"==typeof t,Y=t=>t.every(X);function G(t,e,n,i){const s=$(t,i),a=s.length,r=[];for(let t=0;t<a;t++){const i=s[t],l={...n};"function"==typeof l.delay&&(l.delay=l.delay(t,a));for(const t in e){let n=e[t];Array.isArray(n)||(n=[n]);const s={...W(l,t)};s.duration&&(s.duration=o(s.duration)),s.delay&&(s.delay=o(s.delay));const a=F(i),u=R(t,s.pseudoElement||""),h=a.get(u);h&&h.stop(),r.push({map:a,key:u,unresolvedKeyframes:n,options:{...s,element:i,name:t,allowFlatten:!l.type&&!l.ease}})}}for(let t=0;t<r.length;t++){const{unresolvedKeyframes:e,options:n}=r[t],{element:i,name:s,pseudoElement:o}=n;o||null!==e[0]||(e[0]=L(i,s)),p(e),B(e,s),!o&&e.length<2&&e.unshift(L(i,s)),n.keyframes=e}const l=[];for(let t=0;t<r.length;t++){const{map:e,key:n,options:i}=r[t],s=new x(i);e.set(n,s),s.finished.finally(()=>e.delete(n)),l.push(s)}return l}const J=(t=>function(e,n,i){return new O(G(e,n,i,t))})();t.animate=J,t.animateSequence=function(t,e){const n=[];return function(t,{defaultTransition:e={},...n}={},i,a){const l=e.duration||.3,u=new Map,m=new Map,d={},p=new Map;let y=0,g=0,A=0;for(let n=0;n<t.length;n++){const s=t[n];if("string"==typeof s){p.set(s,g);continue}if(!Array.isArray(s)){p.set(s.name,C(g,s.at,y,p));continue}let[u,b,T={}]=s;void 0!==T.at&&(g=C(g,T.at,y,p));let v=0;const M=(t,n,i,s=0,u=0)=>{const m=D(t),{delay:d=0,times:p=f(m),type:y="keyframes",repeat:b,repeatType:T,repeatDelay:M=0,...w}=n;let{ease:x=e.ease||"easeOut",duration:E}=n;const O="function"==typeof d?d(s,u):d,S=m.length,R=k(y)?y:a?.[y||"keyframes"];if(S<=2&&R){let t=100;if(2===S&&Y(m)){const e=m[1]-m[0];t=Math.abs(e)}const e={...w};void 0!==E&&(e.duration=o(E));const n=h(e,t,R);x=n.ease,E=n.duration}E??(E=l);const F=g+O;1===p.length&&0===p[0]&&(p[1]=1);const W=p.length-m.length;if(W>0&&c(p,W),1===m.length&&m.unshift(null),b){E=N(E,b);const t=[...m],e=[...p];x=Array.isArray(x)?[...x]:[x];const n=[...x];for(let i=0;i<b;i++){m.push(...t);for(let s=0;s<t.length;s++)p.push(e[s]+(i+1)),x.push(0===s?"linear":r(n,s-1))}j(p,b)}const P=F+E;K(i,m,x,p,F,P),v=Math.max(O+E,v),A=Math.max(P,A)};if(V(u))M(b,T,z("default",_(u,m)));else{const t=I(u,b,i,d),e=t.length;for(let n=0;n<e;n++){const i=_(t[n],m);for(const t in b)M(b[t],H(T,t),z(t,i),n,e)}}y=g,g+=v}return m.forEach((t,i)=>{for(const o in t){const a=t[o];a.sort(q);const r=[],l=[],h=[];for(let t=0;t<a.length;t++){const{at:e,value:n,easing:i}=a[t];r.push(n),l.push(s(0,A,e)),h.push(i||"easeOut")}0!==l[0]&&(l.unshift(0),r.unshift(r[0]),h.unshift("easeInOut")),1!==l[l.length-1]&&(l.push(1),r.push(null)),u.has(i)||u.set(i,{keyframes:{},transition:{}});const c=u.get(i);c.keyframes[o]=r,c.transition[o]={...e,duration:A,ease:h,times:l,...n}}}),u}(t,e).forEach(({keyframes:t,transition:e},i)=>{n.push(...G(i,t,e))}),new O(n)}});
1
+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).Motion={})}(this,function(t){"use strict";function e(t,e){const n=t.indexOf(e);n>-1&&t.splice(n,1)}function n(t){let e;return()=>(void 0===e&&(e=t()),e)}const i=t=>t,s=(t,e,n)=>{const i=e-t;return 0===i?1:(n-t)/i},o=t=>1e3*t,a=t=>t/1e3;function r(t,e){return n=t,Array.isArray(n)&&"number"!=typeof n[0]?t[((t,e,n)=>{const i=e-t;return((n-t)%i+i)%i+t})(0,t.length,e)]:t;var n}const l=(t,e,n)=>t+(e-t)*n,u=2e4;function h(t,e=100,n){const i=n({...t,keyframes:[0,e]}),s=Math.min(function(t){let e=0,n=t.next(e);for(;!n.done&&e<u;)e+=50,n=t.next(e);return e>=u?1/0:e}(i),u);return{type:"keyframes",ease:t=>i.next(s*t).value/e,duration:a(s)}}function c(t,e){const n=t[t.length-1];for(let i=1;i<=e;i++){const o=s(0,e,i);t.push(l(n,1,o))}}function f(t){const e=[0];return c(e,t.length-1),e}const m=t=>null!==t;class d{constructor(){this.updateFinished()}get finished(){return this._finished}updateFinished(){this._finished=new Promise(t=>{this.resolve=t})}notifyFinished(){this.resolve()}then(t,e){return this.finished.then(t,e)}}function p(t){for(let e=1;e<t.length;e++)t[e]??(t[e]=t[e-1])}const y=t=>t.startsWith("--");const g=n(()=>void 0!==window.ScrollTimeline),A={};function b(t,e){const i=n(t);return()=>A[e]??i()}const T=b(()=>{try{document.createElement("div").animate({opacity:0},{easing:"linear(0, 1)"})}catch(t){return!1}return!0},"linearEasing"),v=([t,e,n,i])=>`cubic-bezier(${t}, ${e}, ${n}, ${i})`,M={linear:"linear",ease:"ease",easeIn:"ease-in",easeOut:"ease-out",easeInOut:"ease-in-out",circIn:v([0,.65,.55,1]),circOut:v([.55,0,1,.45]),backIn:v([.31,.01,.66,-.59]),backOut:v([.33,1.53,.69,.99])};function w(t,e){return t?"function"==typeof t?T()?((t,e,n=10)=>{let i="";const s=Math.max(Math.round(e/n),2);for(let e=0;e<s;e++)i+=Math.round(1e4*t(e/(s-1)))/1e4+", ";return`linear(${i.substring(0,i.length-2)})`})(t,e):"ease-out":(t=>Array.isArray(t)&&"number"==typeof t[0])(t)?v(t):Array.isArray(t)?t.map(t=>w(t,e)||M.easeOut):M[t]:void 0}function k(t){return"function"==typeof t&&"applyToOptions"in t}class x extends d{constructor(t){if(super(),this.finishedTime=null,this.isStopped=!1,!t)return;const{element:e,name:n,keyframes:i,pseudoElement:s,allowFlatten:o=!1,finalKeyframe:a,onComplete:r}=t;this.isPseudoElement=Boolean(s),this.allowFlatten=o,this.options=t,t.type;const l=function({type:t,...e}){return k(t)&&T()?t.applyToOptions(e):(e.duration??(e.duration=300),e.ease??(e.ease="easeOut"),e)}(t);this.animation=function(t,e,n,{delay:i=0,duration:s=300,repeat:o=0,repeatType:a="loop",ease:r="easeOut",times:l}={},u){const h={[e]:n};l&&(h.offset=l);const c=w(r,s);Array.isArray(c)&&(h.easing=c);const f={delay:i,duration:s,easing:Array.isArray(c)?"linear":c,fill:"both",iterations:o+1,direction:"reverse"===a?"alternate":"normal"};return u&&(f.pseudoElement=u),t.animate(h,f)}(e,n,i,l,s),!1===l.autoplay&&this.animation.pause(),this.animation.onfinish=()=>{if(this.finishedTime=this.time,!s){const t=function(t,{repeat:e,repeatType:n="loop"},i,s=1){const o=t.filter(m),a=s<0||e&&"loop"!==n&&e%2==1?0:o.length-1;return a&&void 0!==i?i:o[a]}(i,this.options,a,this.speed);this.updateMotionValue?this.updateMotionValue(t):function(t,e,n){y(e)?t.style.setProperty(e,n):t.style[e]=n}(e,n,t),this.animation.cancel()}r?.(),this.notifyFinished()}}play(){this.isStopped||(this.animation.play(),"finished"===this.state&&this.updateFinished())}pause(){this.animation.pause()}complete(){this.animation.finish?.()}cancel(){try{this.animation.cancel()}catch(t){}}stop(){if(this.isStopped)return;this.isStopped=!0;const{state:t}=this;"idle"!==t&&"finished"!==t&&(this.updateMotionValue?this.updateMotionValue():this.commitStyles(),this.isPseudoElement||this.cancel())}commitStyles(){this.isPseudoElement||this.animation.commitStyles?.()}get duration(){const t=this.animation.effect?.getComputedTiming?.().duration||0;return a(Number(t))}get time(){return a(Number(this.animation.currentTime)||0)}set time(t){this.finishedTime=null,this.animation.currentTime=o(t)}get speed(){return this.animation.playbackRate}set speed(t){t<0&&(this.finishedTime=null),this.animation.playbackRate=t}get state(){return null!==this.finishedTime?"finished":this.animation.playState}get startTime(){return Number(this.animation.startTime)}set startTime(t){this.animation.startTime=t}attachTimeline({timeline:t,observe:e}){return this.allowFlatten&&this.animation.effect?.updateTiming({easing:"linear"}),this.animation.onfinish=null,t&&g()?(this.animation.timeline=t,i):e(this)}}class E{constructor(t){this.stop=()=>this.runAll("stop"),this.animations=t.filter(Boolean)}get finished(){return Promise.all(this.animations.map(t=>t.finished))}getAll(t){return this.animations[0][t]}setAll(t,e){for(let n=0;n<this.animations.length;n++)this.animations[n][t]=e}attachTimeline(t){const e=this.animations.map(e=>e.attachTimeline(t));return()=>{e.forEach((t,e)=>{t&&t(),this.animations[e].stop()})}}get time(){return this.getAll("time")}set time(t){this.setAll("time",t)}get speed(){return this.getAll("speed")}set speed(t){this.setAll("speed",t)}get state(){return this.getAll("state")}get startTime(){return this.getAll("startTime")}get duration(){let t=0;for(let e=0;e<this.animations.length;e++)t=Math.max(t,this.animations[e].duration);return t}runAll(t){this.animations.forEach(e=>e[t]())}play(){this.runAll("play")}pause(){this.runAll("pause")}cancel(){this.runAll("cancel")}complete(){this.runAll("complete")}}class O extends E{then(t,e){return this.finished.finally(t).then(()=>{})}}const S=new WeakMap,R=(t,e="")=>`${t}:${e}`;function F(t){const e=S.get(t)||new Map;return S.set(t,e),e}function W(t,e){return t?.[e]??t?.default??t}const P=new Set(["borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderRadius","radius","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","width","maxWidth","height","maxHeight","top","right","bottom","left","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginTop","marginRight","marginBottom","marginLeft","backgroundPositionX","backgroundPositionY"]);function B(t,e){for(let n=0;n<t.length;n++)"number"==typeof t[n]&&P.has(e)&&(t[n]=t[n]+"px")}function $(t,e,n){if(t instanceof EventTarget)return[t];if("string"==typeof t){let e=document;const i=n?.[t]??e.querySelectorAll(t);return i?Array.from(i):[]}return Array.from(t)}function L(t,e){const n=window.getComputedStyle(t);return y(e)?n.getPropertyValue(e):n[e]}const V=t=>Boolean(t&&t.getVelocity);function I(t,e,n,i){return"string"==typeof t&&function(t){return"object"==typeof t&&!Array.isArray(t)}(e)?$(t,0,i):t instanceof NodeList?Array.from(t):Array.isArray(t)?t:[t]}function N(t,e,n){return t*(e+1)}function C(t,e,n,i){return"number"==typeof e?e:e.startsWith("-")||e.startsWith("+")?Math.max(0,t+parseFloat(e)):"<"===e?n:e.startsWith("<")?Math.max(0,n+parseFloat(e.slice(1))):i.get(e)??t}function K(t,n,i,s,o,a){!function(t,n,i){for(let s=0;s<t.length;s++){const o=t[s];o.at>n&&o.at<i&&(e(t,o),s--)}}(t,o,a);for(let e=0;e<n.length;e++)t.push({value:n[e],at:l(o,a,s[e]),easing:r(i,e)})}function j(t,e){for(let n=0;n<t.length;n++)t[n]=t[n]/(e+1)}function q(t,e){return t.at===e.at?null===t.value?1:null===e.value?-1:0:t.at-e.at}function _(t,e){return!e.has(t)&&e.set(t,{}),e.get(t)}function z(t,e){return e[t]||(e[t]=[]),e[t]}function D(t){return Array.isArray(t)?t:[t]}function H(t,e){return t&&t[e]?{...t,...t[e]}:{...t}}const X=t=>"number"==typeof t,Y=t=>t.every(X);function G(t,e,n,i){const s=$(t),a=s.length,r=[];for(let t=0;t<a;t++){const i=s[t],l={...n};"function"==typeof l.delay&&(l.delay=l.delay(t,a));for(const t in e){let n=e[t];Array.isArray(n)||(n=[n]);const s={...W(l,t)};s.duration&&(s.duration=o(s.duration)),s.delay&&(s.delay=o(s.delay));const a=F(i),u=R(t,s.pseudoElement||""),h=a.get(u);h&&h.stop(),r.push({map:a,key:u,unresolvedKeyframes:n,options:{...s,element:i,name:t,allowFlatten:!l.type&&!l.ease}})}}for(let t=0;t<r.length;t++){const{unresolvedKeyframes:e,options:n}=r[t],{element:i,name:s,pseudoElement:o}=n;o||null!==e[0]||(e[0]=L(i,s)),p(e),B(e,s),!o&&e.length<2&&e.unshift(L(i,s)),n.keyframes=e}const l=[];for(let t=0;t<r.length;t++){const{map:e,key:n,options:i}=r[t],s=new x(i);e.set(n,s),s.finished.finally(()=>e.delete(n)),l.push(s)}return l}const J=(()=>function(t,e,n){return new O(G(t,e,n))})();t.animate=J,t.animateSequence=function(t,e){const n=[];return function(t,{defaultTransition:e={},...n}={},i,a){const l=e.duration||.3,u=new Map,m=new Map,d={},p=new Map;let y=0,g=0,A=0;for(let n=0;n<t.length;n++){const i=t[n];if("string"==typeof i){p.set(i,g);continue}if(!Array.isArray(i)){p.set(i.name,C(g,i.at,y,p));continue}let[s,u,b={}]=i;void 0!==b.at&&(g=C(g,b.at,y,p));let T=0;const v=(t,n,i,s=0,u=0)=>{const m=D(t),{delay:d=0,times:p=f(m),type:y="keyframes",repeat:b,repeatType:v,repeatDelay:M=0,...w}=n;let{ease:x=e.ease||"easeOut",duration:E}=n;const O="function"==typeof d?d(s,u):d,S=m.length,R=k(y)?y:a?.[y||"keyframes"];if(S<=2&&R){let t=100;if(2===S&&Y(m)){const e=m[1]-m[0];t=Math.abs(e)}const e={...w};void 0!==E&&(e.duration=o(E));const n=h(e,t,R);x=n.ease,E=n.duration}E??(E=l);const F=g+O;1===p.length&&0===p[0]&&(p[1]=1);const W=p.length-m.length;if(W>0&&c(p,W),1===m.length&&m.unshift(null),b){E=N(E,b);const t=[...m],e=[...p];x=Array.isArray(x)?[...x]:[x];const n=[...x];for(let i=0;i<b;i++){m.push(...t);for(let s=0;s<t.length;s++)p.push(e[s]+(i+1)),x.push(0===s?"linear":r(n,s-1))}j(p,b)}const P=F+E;K(i,m,x,p,F,P),T=Math.max(O+E,T),A=Math.max(P,A)};if(V(s))v(u,b,z("default",_(s,m)));else{const t=I(s,u,0,d),e=t.length;for(let n=0;n<e;n++){const i=_(t[n],m);for(const t in u)v(u[t],H(b,t),z(t,i),n,e)}}y=g,g+=T}return m.forEach((t,i)=>{for(const o in t){const a=t[o];a.sort(q);const r=[],l=[],h=[];for(let t=0;t<a.length;t++){const{at:e,value:n,easing:i}=a[t];r.push(n),l.push(s(0,A,e)),h.push(i||"easeOut")}0!==l[0]&&(l.unshift(0),r.unshift(r[0]),h.unshift("easeInOut")),1!==l[l.length-1]&&(l.push(1),r.push(null)),u.has(i)||u.set(i,{keyframes:{},transition:{}});const c=u.get(i);c.keyframes[o]=r,c.transition[o]={...e,duration:A,ease:h,times:l,...n}}}),u}(t,e).forEach(({keyframes:t,transition:e},i)=>{n.push(...G(i,t,e))}),new O(n)}});