motion 10.3.0 → 10.5.0-alpha.1

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 (203) hide show
  1. package/README.md +0 -19
  2. package/dist/main.cjs.js +11 -13
  3. package/dist/main.es.js +7 -6
  4. package/dist/motion.min.js +1 -1
  5. package/dist/motion.umd.js +8 -1264
  6. package/dist/size-index.js +1 -0
  7. package/lib/index.js +5 -0
  8. package/lib/index.js.map +1 -0
  9. package/package.json +5 -137
  10. package/types/index.d.ts +3 -7
  11. package/types/index.d.ts.map +1 -0
  12. package/CHANGELOG.md +0 -85
  13. package/LICENSE +0 -21
  14. package/dist/react.cjs.js +0 -9
  15. package/dist/react.es.js +0 -1
  16. package/dist/size-animate-dom.js +0 -1
  17. package/dist/size-animate-style.js +0 -1
  18. package/dist/size-react.js +0 -1
  19. package/dist/size-spring.js +0 -1
  20. package/dist/size-timeline-dom.js +0 -1
  21. package/dist/size-webpack-animate.js +0 -1
  22. package/dist/targets/dom/animate-style.cjs.js +0 -182
  23. package/dist/targets/dom/animate-style.es.js +0 -178
  24. package/dist/targets/dom/animate.cjs.js +0 -42
  25. package/dist/targets/dom/animate.es.js +0 -38
  26. package/dist/targets/dom/data.cjs.js +0 -18
  27. package/dist/targets/dom/data.es.js +0 -14
  28. package/dist/targets/dom/style.cjs.js +0 -22
  29. package/dist/targets/dom/style.es.js +0 -18
  30. package/dist/targets/dom/timeline/index.cjs.js +0 -174
  31. package/dist/targets/dom/timeline/index.es.js +0 -169
  32. package/dist/targets/dom/timeline/utils/calc-time.cjs.js +0 -23
  33. package/dist/targets/dom/timeline/utils/calc-time.es.js +0 -19
  34. package/dist/targets/dom/timeline/utils/edit.cjs.js +0 -36
  35. package/dist/targets/dom/timeline/utils/edit.es.js +0 -31
  36. package/dist/targets/dom/timeline/utils/sort.cjs.js +0 -14
  37. package/dist/targets/dom/timeline/utils/sort.es.js +0 -10
  38. package/dist/targets/dom/utils/apply.cjs.js +0 -9
  39. package/dist/targets/dom/utils/apply.es.js +0 -4
  40. package/dist/targets/dom/utils/controls.cjs.js +0 -59
  41. package/dist/targets/dom/utils/controls.es.js +0 -54
  42. package/dist/targets/dom/utils/css-var.cjs.js +0 -29
  43. package/dist/targets/dom/utils/css-var.es.js +0 -23
  44. package/dist/targets/dom/utils/defaults.cjs.js +0 -13
  45. package/dist/targets/dom/utils/defaults.es.js +0 -9
  46. package/dist/targets/dom/utils/easing.cjs.js +0 -18
  47. package/dist/targets/dom/utils/easing.es.js +0 -10
  48. package/dist/targets/dom/utils/feature-detection.cjs.js +0 -31
  49. package/dist/targets/dom/utils/feature-detection.es.js +0 -27
  50. package/dist/targets/dom/utils/get-style-name.cjs.js +0 -13
  51. package/dist/targets/dom/utils/get-style-name.es.js +0 -9
  52. package/dist/targets/dom/utils/keyframes.cjs.js +0 -16
  53. package/dist/targets/dom/utils/keyframes.es.js +0 -11
  54. package/dist/targets/dom/utils/options.cjs.js +0 -7
  55. package/dist/targets/dom/utils/options.es.js +0 -3
  56. package/dist/targets/dom/utils/resolve-elements.cjs.js +0 -22
  57. package/dist/targets/dom/utils/resolve-elements.es.js +0 -18
  58. package/dist/targets/dom/utils/stop-animation.cjs.js +0 -19
  59. package/dist/targets/dom/utils/stop-animation.es.js +0 -15
  60. package/dist/targets/dom/utils/time.cjs.js +0 -7
  61. package/dist/targets/dom/utils/time.es.js +0 -3
  62. package/dist/targets/dom/utils/transforms.cjs.js +0 -85
  63. package/dist/targets/dom/utils/transforms.es.js +0 -74
  64. package/dist/targets/js/NumberAnimation.cjs.js +0 -144
  65. package/dist/targets/js/NumberAnimation.es.js +0 -140
  66. package/dist/targets/js/easing/cubic-bezier.cjs.js +0 -57
  67. package/dist/targets/js/easing/cubic-bezier.es.js +0 -53
  68. package/dist/targets/js/easing/glide/generator.cjs.js +0 -99
  69. package/dist/targets/js/easing/glide/generator.es.js +0 -95
  70. package/dist/targets/js/easing/glide/index.cjs.js +0 -10
  71. package/dist/targets/js/easing/glide/index.es.js +0 -6
  72. package/dist/targets/js/easing/spring/generator.cjs.js +0 -64
  73. package/dist/targets/js/easing/spring/generator.es.js +0 -57
  74. package/dist/targets/js/easing/spring/index.cjs.js +0 -10
  75. package/dist/targets/js/easing/spring/index.es.js +0 -6
  76. package/dist/targets/js/easing/steps.cjs.js +0 -15
  77. package/dist/targets/js/easing/steps.es.js +0 -11
  78. package/dist/targets/js/easing/utils/create-generator-easing.cjs.js +0 -71
  79. package/dist/targets/js/easing/utils/create-generator-easing.es.js +0 -67
  80. package/dist/targets/js/easing/utils/get-function.cjs.js +0 -37
  81. package/dist/targets/js/easing/utils/get-function.es.js +0 -33
  82. package/dist/targets/js/easing/utils/has-reached-target.cjs.js +0 -10
  83. package/dist/targets/js/easing/utils/has-reached-target.es.js +0 -6
  84. package/dist/targets/js/easing/utils/pregenerate-keyframes.cjs.js +0 -34
  85. package/dist/targets/js/easing/utils/pregenerate-keyframes.es.js +0 -30
  86. package/dist/targets/js/utils/get-easing.cjs.js +0 -14
  87. package/dist/targets/js/utils/get-easing.es.js +0 -10
  88. package/dist/targets/js/utils/interpolate.cjs.js +0 -35
  89. package/dist/targets/js/utils/interpolate.es.js +0 -31
  90. package/dist/targets/js/utils/offset.cjs.js +0 -22
  91. package/dist/targets/js/utils/offset.es.js +0 -17
  92. package/dist/targets/react/animated.cjs.js +0 -126
  93. package/dist/targets/react/animated.es.js +0 -101
  94. package/dist/targets/react/context.cjs.js +0 -9
  95. package/dist/targets/react/context.es.js +0 -5
  96. package/dist/targets/react/hooks/use-animation.cjs.js +0 -47
  97. package/dist/targets/react/hooks/use-animation.es.js +0 -43
  98. package/dist/targets/react/hooks/use-exit.cjs.js +0 -27
  99. package/dist/targets/react/hooks/use-exit.es.js +0 -23
  100. package/dist/targets/react/hooks/use-gesture-state.cjs.js +0 -17
  101. package/dist/targets/react/hooks/use-gesture-state.es.js +0 -13
  102. package/dist/targets/react/hooks/use-hover.cjs.js +0 -24
  103. package/dist/targets/react/hooks/use-hover.es.js +0 -20
  104. package/dist/targets/react/hooks/use-press.cjs.js +0 -25
  105. package/dist/targets/react/hooks/use-press.es.js +0 -21
  106. package/dist/targets/react/hooks/use-viewport.cjs.js +0 -37
  107. package/dist/targets/react/hooks/use-viewport.es.js +0 -33
  108. package/dist/targets/react/index.cjs.js +0 -17
  109. package/dist/targets/react/index.es.js +0 -13
  110. package/dist/targets/react/utils/has-changed.cjs.js +0 -24
  111. package/dist/targets/react/utils/has-changed.es.js +0 -19
  112. package/dist/targets/react/utils/keyframes.cjs.js +0 -38
  113. package/dist/targets/react/utils/keyframes.es.js +0 -34
  114. package/dist/targets/react/utils/poses.cjs.js +0 -14
  115. package/dist/targets/react/utils/poses.es.js +0 -10
  116. package/dist/targets/react/utils/update-target.cjs.js +0 -20
  117. package/dist/targets/react/utils/update-target.es.js +0 -16
  118. package/dist/utils/array.cjs.js +0 -14
  119. package/dist/utils/array.es.js +0 -9
  120. package/dist/utils/clamp.cjs.js +0 -7
  121. package/dist/utils/clamp.es.js +0 -3
  122. package/dist/utils/is-number.cjs.js +0 -7
  123. package/dist/utils/is-number.es.js +0 -3
  124. package/dist/utils/mix.cjs.js +0 -28
  125. package/dist/utils/mix.es.js +0 -24
  126. package/dist/utils/noop.cjs.js +0 -9
  127. package/dist/utils/noop.es.js +0 -4
  128. package/dist/utils/progress.cjs.js +0 -20
  129. package/dist/utils/progress.es.js +0 -16
  130. package/dist/utils/stagger.cjs.js +0 -38
  131. package/dist/utils/stagger.es.js +0 -32
  132. package/dist/utils/velocity-per-second.cjs.js +0 -15
  133. package/dist/utils/velocity-per-second.es.js +0 -11
  134. package/dist/utils/wrap.cjs.js +0 -10
  135. package/dist/utils/wrap.es.js +0 -6
  136. package/react/package.json +0 -6
  137. package/types/react-entry.d.ts +0 -2
  138. package/types/targets/dom/animate-style.d.ts +0 -2
  139. package/types/targets/dom/animate.d.ts +0 -2
  140. package/types/targets/dom/data.d.ts +0 -2
  141. package/types/targets/dom/style.d.ts +0 -3
  142. package/types/targets/dom/timeline/index.d.ts +0 -15
  143. package/types/targets/dom/timeline/types.d.ts +0 -13
  144. package/types/targets/dom/timeline/utils/calc-time.d.ts +0 -2
  145. package/types/targets/dom/timeline/utils/edit.d.ts +0 -4
  146. package/types/targets/dom/timeline/utils/sort.d.ts +0 -2
  147. package/types/targets/dom/types.d.ts +0 -114
  148. package/types/targets/dom/utils/apply.d.ts +0 -3
  149. package/types/targets/dom/utils/controls.d.ts +0 -12
  150. package/types/targets/dom/utils/css-var.d.ts +0 -3
  151. package/types/targets/dom/utils/defaults.d.ts +0 -8
  152. package/types/targets/dom/utils/easing.d.ts +0 -6
  153. package/types/targets/dom/utils/feature-detection.d.ts +0 -8
  154. package/types/targets/dom/utils/get-style-name.d.ts +0 -1
  155. package/types/targets/dom/utils/keyframes.d.ts +0 -3
  156. package/types/targets/dom/utils/options.d.ts +0 -2
  157. package/types/targets/dom/utils/resolve-elements.d.ts +0 -4
  158. package/types/targets/dom/utils/stop-animation.d.ts +0 -6
  159. package/types/targets/dom/utils/time.d.ts +0 -1
  160. package/types/targets/dom/utils/transforms.d.ts +0 -20
  161. package/types/targets/js/NumberAnimation.d.ts +0 -24
  162. package/types/targets/js/easing/cubic-bezier.d.ts +0 -1
  163. package/types/targets/js/easing/glide/generator.d.ts +0 -5
  164. package/types/targets/js/easing/glide/index.d.ts +0 -2
  165. package/types/targets/js/easing/glide/types.d.ts +0 -14
  166. package/types/targets/js/easing/spring/generator.d.ts +0 -6
  167. package/types/targets/js/easing/spring/index.d.ts +0 -2
  168. package/types/targets/js/easing/spring/types.d.ts +0 -10
  169. package/types/targets/js/easing/steps.d.ts +0 -3
  170. package/types/targets/js/easing/utils/create-generator-easing.d.ts +0 -3
  171. package/types/targets/js/easing/utils/get-function.d.ts +0 -3
  172. package/types/targets/js/easing/utils/has-reached-target.d.ts +0 -1
  173. package/types/targets/js/easing/utils/pregenerate-keyframes.d.ts +0 -7
  174. package/types/targets/js/types.d.ts +0 -12
  175. package/types/targets/js/utils/get-easing.d.ts +0 -1
  176. package/types/targets/js/utils/interpolate.d.ts +0 -2
  177. package/types/targets/js/utils/offset.d.ts +0 -2
  178. package/types/targets/react/animated.d.ts +0 -3
  179. package/types/targets/react/context.d.ts +0 -3
  180. package/types/targets/react/hooks/use-animation.d.ts +0 -4
  181. package/types/targets/react/hooks/use-exit.d.ts +0 -3
  182. package/types/targets/react/hooks/use-gesture-state.d.ts +0 -4
  183. package/types/targets/react/hooks/use-hover.d.ts +0 -4
  184. package/types/targets/react/hooks/use-press.d.ts +0 -4
  185. package/types/targets/react/hooks/use-viewport.d.ts +0 -4
  186. package/types/targets/react/index.d.ts +0 -2
  187. package/types/targets/react/types.d.ts +0 -108
  188. package/types/targets/react/utils/has-changed.d.ts +0 -2
  189. package/types/targets/react/utils/keyframes.d.ts +0 -3
  190. package/types/targets/react/utils/poses.d.ts +0 -2
  191. package/types/targets/react/utils/supported-elements.d.ts +0 -8
  192. package/types/targets/react/utils/update-target.d.ts +0 -3
  193. package/types/utils/array.d.ts +0 -2
  194. package/types/utils/clamp.d.ts +0 -1
  195. package/types/utils/interpolate.d.ts +0 -0
  196. package/types/utils/is-number.d.ts +0 -1
  197. package/types/utils/mix.d.ts +0 -1
  198. package/types/utils/noop.d.ts +0 -2
  199. package/types/utils/progress.d.ts +0 -1
  200. package/types/utils/stagger.d.ts +0 -12
  201. package/types/utils/value-types.d.ts +0 -0
  202. package/types/utils/velocity-per-second.d.ts +0 -1
  203. package/types/utils/wrap.d.ts +0 -1
@@ -1,95 +0,0 @@
1
- import { calcVelocity, createSpringGenerator } from '../spring/generator.es.js';
2
- import { ms } from '../../../dom/utils/time.es.js';
3
-
4
- const createGlideGenerator = ({ from = 0, velocity = 0.0, power = 0.8, decay = 0.325, bounceDamping, bounceStiffness, changeTarget, min, max, restDistance = 0.5, restSpeed, }) => {
5
- decay = ms(decay);
6
- const state = {
7
- value: from,
8
- target: from,
9
- velocity,
10
- hasReachedTarget: false,
11
- done: false,
12
- };
13
- const isOutOfBounds = (v) => (min !== undefined && v < min) || (max !== undefined && v > max);
14
- const nearestBoundary = (v) => {
15
- if (min === undefined)
16
- return max;
17
- if (max === undefined)
18
- return min;
19
- return Math.abs(min - v) < Math.abs(max - v) ? min : max;
20
- };
21
- let amplitude = power * velocity;
22
- const ideal = from + amplitude;
23
- const target = changeTarget === undefined ? ideal : changeTarget(ideal);
24
- state.target = target;
25
- /**
26
- * If the target has changed we need to re-calculate the amplitude, otherwise
27
- * the animation will start from the wrong position.
28
- */
29
- if (target !== ideal)
30
- amplitude = target - from;
31
- const calcDelta = (t) => -amplitude * Math.exp(-t / decay);
32
- const calcLatest = (t) => target + calcDelta(t);
33
- const applyFriction = (t) => {
34
- const delta = calcDelta(t);
35
- const latest = calcLatest(t);
36
- state.done = Math.abs(delta) <= restDistance;
37
- state.value = state.done ? target : latest;
38
- state.velocity =
39
- t === 0 ? velocity : calcVelocity(calcLatest, t, state.value);
40
- };
41
- /**
42
- * Ideally this would resolve for t in a stateless way, we could
43
- * do that by always precalculating the animation but as we know
44
- * this will be done anyway we can assume that spring will
45
- * be discovered during that.
46
- */
47
- let timeReachedBoundary;
48
- let spring;
49
- const checkCatchBoundary = (t) => {
50
- if (!isOutOfBounds(state.value))
51
- return;
52
- timeReachedBoundary = t;
53
- spring = createSpringGenerator({
54
- from: state.value,
55
- to: nearestBoundary(state.value),
56
- velocity: state.velocity,
57
- damping: bounceDamping,
58
- stiffness: bounceStiffness,
59
- restDistance,
60
- restSpeed,
61
- });
62
- };
63
- checkCatchBoundary(0);
64
- return {
65
- next: (t) => {
66
- /**
67
- * We need to resolve the friction to figure out if we need a
68
- * spring but we don't want to do this twice per frame. So here
69
- * we flag if we updated for this frame and later if we did
70
- * we can skip doing it again.
71
- */
72
- let hasUpdatedFrame = false;
73
- if (!spring && timeReachedBoundary === undefined) {
74
- hasUpdatedFrame = true;
75
- applyFriction(t);
76
- checkCatchBoundary(t);
77
- }
78
- /**
79
- * If we have a spring and the provided t is beyond the moment the friction
80
- * animation crossed the min/max boundary, use the spring.
81
- */
82
- if (timeReachedBoundary !== undefined && t > timeReachedBoundary) {
83
- state.hasReachedTarget = true;
84
- return spring.next(t - timeReachedBoundary);
85
- }
86
- else {
87
- state.hasReachedTarget = false;
88
- !hasUpdatedFrame && applyFriction(t);
89
- return state;
90
- }
91
- },
92
- };
93
- };
94
-
95
- export { createGlideGenerator };
@@ -1,10 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var generator = require('./generator.cjs.js');
6
- var createGeneratorEasing = require('../utils/create-generator-easing.cjs.js');
7
-
8
- const glide = createGeneratorEasing.createGeneratorEasing(generator.createGlideGenerator);
9
-
10
- exports.glide = glide;
@@ -1,6 +0,0 @@
1
- import { createGlideGenerator } from './generator.es.js';
2
- import { createGeneratorEasing } from '../utils/create-generator-easing.es.js';
3
-
4
- const glide = createGeneratorEasing(createGlideGenerator);
5
-
6
- export { glide };
@@ -1,64 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var velocityPerSecond = require('../../../../utils/velocity-per-second.cjs.js');
6
- var hasReachedTarget = require('../utils/has-reached-target.cjs.js');
7
-
8
- const defaultStiffness = 100.0;
9
- const defaultDamping = 10.0;
10
- const defaultMass = 1.0;
11
- const calcDampingRatio = (stiffness = defaultStiffness, damping = defaultDamping, mass = defaultMass) => damping / (2 * Math.sqrt(stiffness * mass));
12
- const calcAngularFreq = (undampedFreq, dampingRatio) => undampedFreq * Math.sqrt(1 - dampingRatio * dampingRatio);
13
- const createSpringGenerator = ({ stiffness = defaultStiffness, damping = defaultDamping, mass = defaultMass, from = 0, to = 1, velocity = 0.0, restSpeed = 2, restDistance = 0.5, } = {}) => {
14
- velocity = velocity ? velocity / 1000 : 0.0;
15
- const state = {
16
- done: false,
17
- value: from,
18
- target: to,
19
- velocity,
20
- hasReachedTarget: false,
21
- };
22
- const dampingRatio = calcDampingRatio(stiffness, damping, mass);
23
- const initialDelta = to - from;
24
- const undampedAngularFreq = Math.sqrt(stiffness / mass) / 1000;
25
- const angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
26
- let resolveSpring;
27
- if (dampingRatio < 1) {
28
- // Underdamped spring (bouncy)
29
- resolveSpring = (t) => to -
30
- Math.exp(-dampingRatio * undampedAngularFreq * t) *
31
- (((-velocity + dampingRatio * undampedAngularFreq * initialDelta) /
32
- angularFreq) *
33
- Math.sin(angularFreq * t) +
34
- initialDelta * Math.cos(angularFreq * t));
35
- }
36
- else {
37
- // Critically damped spring
38
- resolveSpring = (t) => to -
39
- Math.exp(-undampedAngularFreq * t) *
40
- (initialDelta + (velocity + undampedAngularFreq * initialDelta) * t);
41
- }
42
- return {
43
- next: (t) => {
44
- state.value = resolveSpring(t);
45
- state.velocity =
46
- t === 0 ? velocity : calcVelocity(resolveSpring, t, state.value);
47
- const isBelowVelocityThreshold = Math.abs(state.velocity) <= restSpeed;
48
- const isBelowDisplacementThreshold = Math.abs(to - state.value) <= restDistance;
49
- state.done = isBelowVelocityThreshold && isBelowDisplacementThreshold;
50
- state.hasReachedTarget = hasReachedTarget.hasReachedTarget(from, to, state.value);
51
- return state;
52
- },
53
- };
54
- };
55
- const sampleT = 5; // ms
56
- function calcVelocity(resolveValue, t, current) {
57
- const prevT = Math.max(t - sampleT, 0);
58
- return velocityPerSecond.velocityPerSecond(current - resolveValue(prevT), 5);
59
- }
60
-
61
- exports.calcAngularFreq = calcAngularFreq;
62
- exports.calcDampingRatio = calcDampingRatio;
63
- exports.calcVelocity = calcVelocity;
64
- exports.createSpringGenerator = createSpringGenerator;
@@ -1,57 +0,0 @@
1
- import { velocityPerSecond } from '../../../../utils/velocity-per-second.es.js';
2
- import { hasReachedTarget } from '../utils/has-reached-target.es.js';
3
-
4
- const defaultStiffness = 100.0;
5
- const defaultDamping = 10.0;
6
- const defaultMass = 1.0;
7
- const calcDampingRatio = (stiffness = defaultStiffness, damping = defaultDamping, mass = defaultMass) => damping / (2 * Math.sqrt(stiffness * mass));
8
- const calcAngularFreq = (undampedFreq, dampingRatio) => undampedFreq * Math.sqrt(1 - dampingRatio * dampingRatio);
9
- const createSpringGenerator = ({ stiffness = defaultStiffness, damping = defaultDamping, mass = defaultMass, from = 0, to = 1, velocity = 0.0, restSpeed = 2, restDistance = 0.5, } = {}) => {
10
- velocity = velocity ? velocity / 1000 : 0.0;
11
- const state = {
12
- done: false,
13
- value: from,
14
- target: to,
15
- velocity,
16
- hasReachedTarget: false,
17
- };
18
- const dampingRatio = calcDampingRatio(stiffness, damping, mass);
19
- const initialDelta = to - from;
20
- const undampedAngularFreq = Math.sqrt(stiffness / mass) / 1000;
21
- const angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
22
- let resolveSpring;
23
- if (dampingRatio < 1) {
24
- // Underdamped spring (bouncy)
25
- resolveSpring = (t) => to -
26
- Math.exp(-dampingRatio * undampedAngularFreq * t) *
27
- (((-velocity + dampingRatio * undampedAngularFreq * initialDelta) /
28
- angularFreq) *
29
- Math.sin(angularFreq * t) +
30
- initialDelta * Math.cos(angularFreq * t));
31
- }
32
- else {
33
- // Critically damped spring
34
- resolveSpring = (t) => to -
35
- Math.exp(-undampedAngularFreq * t) *
36
- (initialDelta + (velocity + undampedAngularFreq * initialDelta) * t);
37
- }
38
- return {
39
- next: (t) => {
40
- state.value = resolveSpring(t);
41
- state.velocity =
42
- t === 0 ? velocity : calcVelocity(resolveSpring, t, state.value);
43
- const isBelowVelocityThreshold = Math.abs(state.velocity) <= restSpeed;
44
- const isBelowDisplacementThreshold = Math.abs(to - state.value) <= restDistance;
45
- state.done = isBelowVelocityThreshold && isBelowDisplacementThreshold;
46
- state.hasReachedTarget = hasReachedTarget(from, to, state.value);
47
- return state;
48
- },
49
- };
50
- };
51
- const sampleT = 5; // ms
52
- function calcVelocity(resolveValue, t, current) {
53
- const prevT = Math.max(t - sampleT, 0);
54
- return velocityPerSecond(current - resolveValue(prevT), 5);
55
- }
56
-
57
- export { calcAngularFreq, calcDampingRatio, calcVelocity, createSpringGenerator };
@@ -1,10 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var generator = require('./generator.cjs.js');
6
- var createGeneratorEasing = require('../utils/create-generator-easing.cjs.js');
7
-
8
- const spring = createGeneratorEasing.createGeneratorEasing(generator.createSpringGenerator);
9
-
10
- exports.spring = spring;
@@ -1,6 +0,0 @@
1
- import { createSpringGenerator } from './generator.es.js';
2
- import { createGeneratorEasing } from '../utils/create-generator-easing.es.js';
3
-
4
- const spring = createGeneratorEasing(createSpringGenerator);
5
-
6
- export { spring };
@@ -1,15 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var clamp = require('../../../utils/clamp.cjs.js');
6
-
7
- const steps = (steps, direction = "end") => (progress) => {
8
- progress =
9
- direction === "end" ? Math.min(progress, 0.999) : Math.max(progress, 0.001);
10
- const expanded = progress * steps;
11
- const rounded = direction === "end" ? Math.floor(expanded) : Math.ceil(expanded);
12
- return clamp.clamp(0, 1, rounded / steps);
13
- };
14
-
15
- exports.steps = steps;
@@ -1,11 +0,0 @@
1
- import { clamp } from '../../../utils/clamp.es.js';
2
-
3
- const steps = (steps, direction = "end") => (progress) => {
4
- progress =
5
- direction === "end" ? Math.min(progress, 0.999) : Math.max(progress, 0.001);
6
- const expanded = progress * steps;
7
- const rounded = direction === "end" ? Math.floor(expanded) : Math.ceil(expanded);
8
- return clamp(0, 1, rounded / steps);
9
- };
10
-
11
- export { steps };
@@ -1,71 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var pregenerateKeyframes = require('./pregenerate-keyframes.cjs.js');
6
-
7
- function createGeneratorEasing(createGenerator) {
8
- const keyframesCache = new WeakMap();
9
- return (options = {}) => {
10
- const generatorCache = new Map();
11
- const getGenerator = (from = 0, to = 100, velocity = 0, isScale = false) => {
12
- const key = `${from}-${to}-${velocity}-${isScale}`;
13
- if (!generatorCache.has(key)) {
14
- generatorCache.set(key, createGenerator(Object.assign({ from,
15
- to,
16
- velocity, restSpeed: isScale ? 0.05 : 2, restDistance: isScale ? 0.01 : 0.5 }, options)));
17
- }
18
- return generatorCache.get(key);
19
- };
20
- const getKeyframes = (generator) => {
21
- if (!keyframesCache.has(generator)) {
22
- keyframesCache.set(generator, pregenerateKeyframes.pregenerateKeyframes(generator));
23
- }
24
- return keyframesCache.get(generator);
25
- };
26
- return {
27
- createAnimation: (keyframes, getOrigin, canUseGenerator, name, data) => {
28
- let settings;
29
- let generator;
30
- const numKeyframes = keyframes.length;
31
- let shouldUseGenerator = canUseGenerator &&
32
- numKeyframes <= 2 &&
33
- keyframes.every(isNumberOrNull);
34
- if (shouldUseGenerator) {
35
- const prevAnimationState = name && data && data.prevGeneratorState[name];
36
- const velocity = prevAnimationState &&
37
- (numKeyframes === 1 ||
38
- (numKeyframes === 2 && keyframes[0] === null))
39
- ? prevAnimationState.velocity
40
- : 0;
41
- const target = keyframes[numKeyframes - 1];
42
- const unresolvedOrigin = numKeyframes === 1 ? null : keyframes[0];
43
- const origin = unresolvedOrigin === null
44
- ? prevAnimationState
45
- ? prevAnimationState.value
46
- : parseFloat(getOrigin())
47
- : unresolvedOrigin;
48
- generator = getGenerator(origin, target, velocity, name === null || name === void 0 ? void 0 : name.includes("scale"));
49
- const keyframesMetadata = getKeyframes(generator);
50
- settings = Object.assign(Object.assign({}, keyframesMetadata), { easing: "linear" });
51
- }
52
- else {
53
- generator = getGenerator(0, 100);
54
- const keyframesMetadata = getKeyframes(generator);
55
- settings = {
56
- easing: "ease",
57
- duration: keyframesMetadata.overshootDuration,
58
- };
59
- }
60
- // TODO Add test for this
61
- if (generator && data && name) {
62
- data.generators[name] = generator;
63
- }
64
- return settings;
65
- },
66
- };
67
- };
68
- }
69
- const isNumberOrNull = (value) => typeof value !== "string";
70
-
71
- exports.createGeneratorEasing = createGeneratorEasing;
@@ -1,67 +0,0 @@
1
- import { pregenerateKeyframes } from './pregenerate-keyframes.es.js';
2
-
3
- function createGeneratorEasing(createGenerator) {
4
- const keyframesCache = new WeakMap();
5
- return (options = {}) => {
6
- const generatorCache = new Map();
7
- const getGenerator = (from = 0, to = 100, velocity = 0, isScale = false) => {
8
- const key = `${from}-${to}-${velocity}-${isScale}`;
9
- if (!generatorCache.has(key)) {
10
- generatorCache.set(key, createGenerator(Object.assign({ from,
11
- to,
12
- velocity, restSpeed: isScale ? 0.05 : 2, restDistance: isScale ? 0.01 : 0.5 }, options)));
13
- }
14
- return generatorCache.get(key);
15
- };
16
- const getKeyframes = (generator) => {
17
- if (!keyframesCache.has(generator)) {
18
- keyframesCache.set(generator, pregenerateKeyframes(generator));
19
- }
20
- return keyframesCache.get(generator);
21
- };
22
- return {
23
- createAnimation: (keyframes, getOrigin, canUseGenerator, name, data) => {
24
- let settings;
25
- let generator;
26
- const numKeyframes = keyframes.length;
27
- let shouldUseGenerator = canUseGenerator &&
28
- numKeyframes <= 2 &&
29
- keyframes.every(isNumberOrNull);
30
- if (shouldUseGenerator) {
31
- const prevAnimationState = name && data && data.prevGeneratorState[name];
32
- const velocity = prevAnimationState &&
33
- (numKeyframes === 1 ||
34
- (numKeyframes === 2 && keyframes[0] === null))
35
- ? prevAnimationState.velocity
36
- : 0;
37
- const target = keyframes[numKeyframes - 1];
38
- const unresolvedOrigin = numKeyframes === 1 ? null : keyframes[0];
39
- const origin = unresolvedOrigin === null
40
- ? prevAnimationState
41
- ? prevAnimationState.value
42
- : parseFloat(getOrigin())
43
- : unresolvedOrigin;
44
- generator = getGenerator(origin, target, velocity, name === null || name === void 0 ? void 0 : name.includes("scale"));
45
- const keyframesMetadata = getKeyframes(generator);
46
- settings = Object.assign(Object.assign({}, keyframesMetadata), { easing: "linear" });
47
- }
48
- else {
49
- generator = getGenerator(0, 100);
50
- const keyframesMetadata = getKeyframes(generator);
51
- settings = {
52
- easing: "ease",
53
- duration: keyframesMetadata.overshootDuration,
54
- };
55
- }
56
- // TODO Add test for this
57
- if (generator && data && name) {
58
- data.generators[name] = generator;
59
- }
60
- return settings;
61
- },
62
- };
63
- };
64
- }
65
- const isNumberOrNull = (value) => typeof value !== "string";
66
-
67
- export { createGeneratorEasing };
@@ -1,37 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var cubicBezier = require('../cubic-bezier.cjs.js');
6
- var steps = require('../steps.cjs.js');
7
- var noop = require('../../../../utils/noop.cjs.js');
8
-
9
- const namedEasings = {
10
- ease: cubicBezier.cubicBezier(0.25, 0.1, 0.25, 1.0),
11
- "ease-in": cubicBezier.cubicBezier(0.42, 0.0, 1.0, 1.0),
12
- "ease-in-out": cubicBezier.cubicBezier(0.42, 0.0, 0.58, 1.0),
13
- "ease-out": cubicBezier.cubicBezier(0.0, 0.0, 0.58, 1.0),
14
- };
15
- const functionArgsRegex = /\((.*?)\)/;
16
- function getEasingFunction(definition) {
17
- // If already an easing function, return
18
- if (typeof definition === "function")
19
- return definition;
20
- // If an easing curve definition, return bezier function
21
- if (Array.isArray(definition))
22
- return cubicBezier.cubicBezier(...definition);
23
- // If we have a predefined easing function, return
24
- if (namedEasings[definition])
25
- return namedEasings[definition];
26
- // If this is a steps function, attempt to create easing curve
27
- if (definition.startsWith("steps")) {
28
- const args = functionArgsRegex.exec(definition);
29
- if (args) {
30
- const argsArray = args[1].split(",");
31
- return steps.steps(parseFloat(argsArray[0]), argsArray[1].trim());
32
- }
33
- }
34
- return noop.noopReturn;
35
- }
36
-
37
- exports.getEasingFunction = getEasingFunction;
@@ -1,33 +0,0 @@
1
- import { cubicBezier } from '../cubic-bezier.es.js';
2
- import { steps } from '../steps.es.js';
3
- import { noopReturn } from '../../../../utils/noop.es.js';
4
-
5
- const namedEasings = {
6
- ease: cubicBezier(0.25, 0.1, 0.25, 1.0),
7
- "ease-in": cubicBezier(0.42, 0.0, 1.0, 1.0),
8
- "ease-in-out": cubicBezier(0.42, 0.0, 0.58, 1.0),
9
- "ease-out": cubicBezier(0.0, 0.0, 0.58, 1.0),
10
- };
11
- const functionArgsRegex = /\((.*?)\)/;
12
- function getEasingFunction(definition) {
13
- // If already an easing function, return
14
- if (typeof definition === "function")
15
- return definition;
16
- // If an easing curve definition, return bezier function
17
- if (Array.isArray(definition))
18
- return cubicBezier(...definition);
19
- // If we have a predefined easing function, return
20
- if (namedEasings[definition])
21
- return namedEasings[definition];
22
- // If this is a steps function, attempt to create easing curve
23
- if (definition.startsWith("steps")) {
24
- const args = functionArgsRegex.exec(definition);
25
- if (args) {
26
- const argsArray = args[1].split(",");
27
- return steps(parseFloat(argsArray[0]), argsArray[1].trim());
28
- }
29
- }
30
- return noopReturn;
31
- }
32
-
33
- export { getEasingFunction };
@@ -1,10 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- function hasReachedTarget(origin, target, current) {
6
- return ((origin < target && current >= target) ||
7
- (origin > target && current <= target));
8
- }
9
-
10
- exports.hasReachedTarget = hasReachedTarget;
@@ -1,6 +0,0 @@
1
- function hasReachedTarget(origin, target, current) {
2
- return ((origin < target && current >= target) ||
3
- (origin > target && current <= target));
4
- }
5
-
6
- export { hasReachedTarget };
@@ -1,34 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const timeStep = 10;
6
- const maxDuration = 10000;
7
- function pregenerateKeyframes(generator) {
8
- let overshootDuration = undefined;
9
- let timestamp = timeStep;
10
- let state = generator.next(0);
11
- const keyframes = [state.value];
12
- while (!state.done && timestamp < maxDuration) {
13
- state = generator.next(timestamp);
14
- keyframes.push(state.done ? state.target : state.value);
15
- if (overshootDuration === undefined && state.hasReachedTarget) {
16
- overshootDuration = timestamp;
17
- }
18
- timestamp += timeStep;
19
- }
20
- const duration = timestamp - timeStep;
21
- /**
22
- * If generating an animation that didn't actually move,
23
- * generate a second keyframe so we have an origin and target.
24
- */
25
- if (keyframes.length === 1)
26
- keyframes.push(state.value);
27
- return {
28
- keyframes,
29
- duration: duration / 1000,
30
- overshootDuration: (overshootDuration !== null && overshootDuration !== void 0 ? overshootDuration : duration) / 1000,
31
- };
32
- }
33
-
34
- exports.pregenerateKeyframes = pregenerateKeyframes;
@@ -1,30 +0,0 @@
1
- const timeStep = 10;
2
- const maxDuration = 10000;
3
- function pregenerateKeyframes(generator) {
4
- let overshootDuration = undefined;
5
- let timestamp = timeStep;
6
- let state = generator.next(0);
7
- const keyframes = [state.value];
8
- while (!state.done && timestamp < maxDuration) {
9
- state = generator.next(timestamp);
10
- keyframes.push(state.done ? state.target : state.value);
11
- if (overshootDuration === undefined && state.hasReachedTarget) {
12
- overshootDuration = timestamp;
13
- }
14
- timestamp += timeStep;
15
- }
16
- const duration = timestamp - timeStep;
17
- /**
18
- * If generating an animation that didn't actually move,
19
- * generate a second keyframe so we have an origin and target.
20
- */
21
- if (keyframes.length === 1)
22
- keyframes.push(state.value);
23
- return {
24
- keyframes,
25
- duration: duration / 1000,
26
- overshootDuration: (overshootDuration !== null && overshootDuration !== void 0 ? overshootDuration : duration) / 1000,
27
- };
28
- }
29
-
30
- export { pregenerateKeyframes };
@@ -1,14 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var wrap = require('../../../utils/wrap.cjs.js');
6
- var easing = require('../../dom/utils/easing.cjs.js');
7
-
8
- function getEasingForSegment(easing$1, i) {
9
- return easing.isEasingList(easing$1)
10
- ? easing$1[wrap.wrap(0, easing$1.length, i)]
11
- : easing$1;
12
- }
13
-
14
- exports.getEasingForSegment = getEasingForSegment;
@@ -1,10 +0,0 @@
1
- import { wrap } from '../../../utils/wrap.es.js';
2
- import { isEasingList } from '../../dom/utils/easing.es.js';
3
-
4
- function getEasingForSegment(easing, i) {
5
- return isEasingList(easing)
6
- ? easing[wrap(0, easing.length, i)]
7
- : easing;
8
- }
9
-
10
- export { getEasingForSegment };
@@ -1,35 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var mix = require('../../../utils/mix.cjs.js');
6
- var noop = require('../../../utils/noop.cjs.js');
7
- var progress = require('../../../utils/progress.cjs.js');
8
- var getEasing = require('./get-easing.cjs.js');
9
- var offset = require('./offset.cjs.js');
10
-
11
- const clampProgress = (p) => Math.min(1, Math.max(p, 0));
12
- function slowInterpolateNumbers(output, input = offset.defaultOffset(output.length), easing = noop.noopReturn) {
13
- const length = output.length;
14
- /**
15
- * If the input length is lower than the output we
16
- * fill the input to match. This currently assumes the input
17
- * is an animation progress value so is a good candidate for
18
- * moving outside the function.
19
- */
20
- const remainder = length - input.length;
21
- remainder > 0 && offset.fillOffset(input, remainder);
22
- return (t) => {
23
- let i = 0;
24
- for (; i < length - 2; i++) {
25
- if (t < input[i + 1])
26
- break;
27
- }
28
- let progressInRange = clampProgress(progress.progress(input[i], input[i + 1], t));
29
- const segmentEasing = getEasing.getEasingForSegment(easing, i);
30
- progressInRange = segmentEasing(progressInRange);
31
- return mix.mix(output[i], output[i + 1], progressInRange);
32
- };
33
- }
34
-
35
- exports.slowInterpolateNumbers = slowInterpolateNumbers;