@studiometa/js-toolkit 2.6.4 → 2.6.5
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/package.json +1 -1
- package/utils/tween.cjs +1 -1
- package/utils/tween.cjs.map +1 -1
- package/utils/tween.js +1 -1
- package/utils/tween.js.map +1 -1
package/package.json
CHANGED
package/utils/tween.cjs
CHANGED
|
@@ -35,7 +35,7 @@ var import_is = require("./is.cjs");
|
|
|
35
35
|
var import_noop = require("./noop.cjs");
|
|
36
36
|
var import_raf = __toESM(require("../services/raf.cjs"), 1);
|
|
37
37
|
var id = 0;
|
|
38
|
-
var PROGRESS_PRECISION =
|
|
38
|
+
var PROGRESS_PRECISION = 0.01;
|
|
39
39
|
function normalizeEase(ease) {
|
|
40
40
|
if (!(0, import_is.isDefined)(ease)) {
|
|
41
41
|
return import_noop.noopValue;
|
package/utils/tween.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/utils/tween.js"],
|
|
4
|
-
"sourcesContent": ["import { cubicBezier } from '@motionone/easing';\nimport { lerp, map, clamp01 } from './math/index.js';\nimport { isDefined, isArray } from './is.js';\nimport { noop, noopValue as linear } from './noop.js';\nimport useRaf from '../services/raf.js';\n\nlet id = 0;\nconst PROGRESS_PRECISION = 0.
|
|
4
|
+
"sourcesContent": ["import { cubicBezier } from '@motionone/easing';\nimport { lerp, map, clamp01 } from './math/index.js';\nimport { isDefined, isArray } from './is.js';\nimport { noop, noopValue as linear } from './noop.js';\nimport useRaf from '../services/raf.js';\n\nlet id = 0;\nconst PROGRESS_PRECISION = 0.01;\n\n/**\n * @typedef {[number, number, number, number]} BezierCurve\n * @typedef {{\n * duration?: number;\n * easing?: import('./math/createEases.js').EasingFunction|BezierCurve;\n * onStart?: () => void;\n * onProgress?: (progress: number, easedProgress: number) => void;\n * onFinish?: (progress: number, easedProgress: number) => void;\n * }} TweenOptions\n */\n\n/**\n * Normalize a easing function with default fallbacks.\n * @param {((p:number) => number)|[number,number,number,number]} ease\n * @returns {(p:number) => number}\n */\nexport function normalizeEase(ease) {\n if (!isDefined(ease)) {\n return linear;\n }\n\n if (isArray(ease)) {\n return cubicBezier(...ease);\n }\n\n return ease;\n}\n\n/**\n * Tween from 0 to 1.\n * @param {(progress:number)=>any} callback\n * @param {TweenOptions} [options]\n * @returns {any}\n */\nexport function tween(callback, options = {}) {\n const raf = useRaf();\n\n let progressValue = 0;\n let easedProgress = 0;\n\n const ease = normalizeEase(options.easing);\n let duration = options.duration ?? 1;\n duration *= 1000;\n\n let startTime = performance.now();\n let endTime = startTime + duration;\n\n const key = `tw-${id}`;\n id += 1;\n\n const { onStart = noop, onProgress = noop, onFinish = noop } = options;\n let isRunning = false;\n\n /**\n * Pause the animation.\n *\n * @returns {void}\n */\n function pause() {\n isRunning = false;\n raf.remove(key);\n }\n\n /**\n * Set the progress value.\n *\n * @param {number} newProgress The new progress value.\n * @returns {number}\n */\n function progress(newProgress) {\n if (typeof newProgress === 'undefined') {\n return easedProgress;\n }\n\n progressValue = newProgress;\n easedProgress = ease(progressValue);\n\n // Stop when reaching precision\n if (Math.abs(1 - easedProgress) < PROGRESS_PRECISION) {\n progressValue = 1;\n easedProgress = 1;\n }\n\n callback(easedProgress);\n onProgress(progressValue, easedProgress);\n\n if (easedProgress === 1) {\n pause();\n requestAnimationFrame(() => onFinish(progressValue, easedProgress));\n }\n\n return progressValue;\n }\n\n /**\n * Loop for rendering the animation.\n *\n * @param {Object} props\n * @param {number} props.time\n * @returns {void}\n */\n function tick(props) {\n if (!isRunning) {\n raf.remove(key);\n return;\n }\n\n progress(clamp01(map(props.time, startTime, endTime, 0, 1)));\n }\n\n /**\n * Play the animation.\n *\n * @returns {void}\n */\n function start() {\n onStart();\n startTime = performance.now();\n endTime = startTime + duration;\n progressValue = 0;\n easedProgress = 0;\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n /**\n * Play a paused animation.\n * @returns {void}\n */\n function play() {\n if (isRunning) {\n return;\n }\n\n startTime = performance.now() - lerp(0, duration, progressValue);\n endTime = startTime + duration;\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n return {\n start,\n finish: () => progress(1),\n pause,\n play,\n progress,\n };\n}\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA4B;AAC5B,kBAAmC;AACnC,gBAAmC;AACnC,kBAA0C;AAC1C,iBAAmB;AAEnB,IAAI,KAAK;AACT,IAAM,qBAAqB;AAkBpB,SAAS,cAAc,MAAM;AAClC,MAAI,KAAC,qBAAU,IAAI,GAAG;AACpB,WAAO,YAAAA;AAAA,EACT;AAEA,UAAI,mBAAQ,IAAI,GAAG;AACjB,eAAO,2BAAY,GAAG,IAAI;AAAA,EAC5B;AAEA,SAAO;AACT;AAQO,SAAS,MAAM,UAAU,UAAU,CAAC,GAAG;AAC5C,QAAM,UAAM,WAAAC,SAAO;AAEnB,MAAI,gBAAgB;AACpB,MAAI,gBAAgB;AAEpB,QAAM,OAAO,cAAc,QAAQ,MAAM;AACzC,MAAI,WAAW,QAAQ,YAAY;AACnC,cAAY;AAEZ,MAAI,YAAY,YAAY,IAAI;AAChC,MAAI,UAAU,YAAY;AAE1B,QAAM,MAAM,MAAM;AAClB,QAAM;AAEN,QAAM,EAAE,UAAU,kBAAM,aAAa,kBAAM,WAAW,iBAAK,IAAI;AAC/D,MAAI,YAAY;AAOhB,WAAS,QAAQ;AACf,gBAAY;AACZ,QAAI,OAAO,GAAG;AAAA,EAChB;AAQA,WAAS,SAAS,aAAa;AAC7B,QAAI,OAAO,gBAAgB,aAAa;AACtC,aAAO;AAAA,IACT;AAEA,oBAAgB;AAChB,oBAAgB,KAAK,aAAa;AAGlC,QAAI,KAAK,IAAI,IAAI,aAAa,IAAI,oBAAoB;AACpD,sBAAgB;AAChB,sBAAgB;AAAA,IAClB;AAEA,aAAS,aAAa;AACtB,eAAW,eAAe,aAAa;AAEvC,QAAI,kBAAkB,GAAG;AACvB,YAAM;AACN,4BAAsB,MAAM,SAAS,eAAe,aAAa,CAAC;AAAA,IACpE;AAEA,WAAO;AAAA,EACT;AASA,WAAS,KAAK,OAAO;AACnB,QAAI,CAAC,WAAW;AACd,UAAI,OAAO,GAAG;AACd;AAAA,IACF;AAEA,iBAAS,yBAAQ,iBAAI,MAAM,MAAM,WAAW,SAAS,GAAG,CAAC,CAAC,CAAC;AAAA,EAC7D;AAOA,WAAS,QAAQ;AACf,YAAQ;AACR,gBAAY,YAAY,IAAI;AAC5B,cAAU,YAAY;AACtB,oBAAgB;AAChB,oBAAgB;AAChB,gBAAY;AAEZ,QAAI,IAAI,KAAK,IAAI;AAAA,EACnB;AAMA,WAAS,OAAO;AACd,QAAI,WAAW;AACb;AAAA,IACF;AAEA,gBAAY,YAAY,IAAI,QAAI,kBAAK,GAAG,UAAU,aAAa;AAC/D,cAAU,YAAY;AACtB,gBAAY;AAEZ,QAAI,IAAI,KAAK,IAAI;AAAA,EACnB;AAEA,SAAO;AAAA,IACL;AAAA,IACA,QAAQ,MAAM,SAAS,CAAC;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["linear", "useRaf"]
|
|
7
7
|
}
|
package/utils/tween.js
CHANGED
|
@@ -4,7 +4,7 @@ import { isDefined, isArray } from "./is.js";
|
|
|
4
4
|
import { noop, noopValue as linear } from "./noop.js";
|
|
5
5
|
import useRaf from "../services/raf.js";
|
|
6
6
|
let id = 0;
|
|
7
|
-
const PROGRESS_PRECISION =
|
|
7
|
+
const PROGRESS_PRECISION = 0.01;
|
|
8
8
|
function normalizeEase(ease) {
|
|
9
9
|
if (!isDefined(ease)) {
|
|
10
10
|
return linear;
|
package/utils/tween.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/utils/tween.js"],
|
|
4
|
-
"sourcesContent": ["import { cubicBezier } from '@motionone/easing';\nimport { lerp, map, clamp01 } from './math/index.js';\nimport { isDefined, isArray } from './is.js';\nimport { noop, noopValue as linear } from './noop.js';\nimport useRaf from '../services/raf.js';\n\nlet id = 0;\nconst PROGRESS_PRECISION = 0.
|
|
4
|
+
"sourcesContent": ["import { cubicBezier } from '@motionone/easing';\nimport { lerp, map, clamp01 } from './math/index.js';\nimport { isDefined, isArray } from './is.js';\nimport { noop, noopValue as linear } from './noop.js';\nimport useRaf from '../services/raf.js';\n\nlet id = 0;\nconst PROGRESS_PRECISION = 0.01;\n\n/**\n * @typedef {[number, number, number, number]} BezierCurve\n * @typedef {{\n * duration?: number;\n * easing?: import('./math/createEases.js').EasingFunction|BezierCurve;\n * onStart?: () => void;\n * onProgress?: (progress: number, easedProgress: number) => void;\n * onFinish?: (progress: number, easedProgress: number) => void;\n * }} TweenOptions\n */\n\n/**\n * Normalize a easing function with default fallbacks.\n * @param {((p:number) => number)|[number,number,number,number]} ease\n * @returns {(p:number) => number}\n */\nexport function normalizeEase(ease) {\n if (!isDefined(ease)) {\n return linear;\n }\n\n if (isArray(ease)) {\n return cubicBezier(...ease);\n }\n\n return ease;\n}\n\n/**\n * Tween from 0 to 1.\n * @param {(progress:number)=>any} callback\n * @param {TweenOptions} [options]\n * @returns {any}\n */\nexport function tween(callback, options = {}) {\n const raf = useRaf();\n\n let progressValue = 0;\n let easedProgress = 0;\n\n const ease = normalizeEase(options.easing);\n let duration = options.duration ?? 1;\n duration *= 1000;\n\n let startTime = performance.now();\n let endTime = startTime + duration;\n\n const key = `tw-${id}`;\n id += 1;\n\n const { onStart = noop, onProgress = noop, onFinish = noop } = options;\n let isRunning = false;\n\n /**\n * Pause the animation.\n *\n * @returns {void}\n */\n function pause() {\n isRunning = false;\n raf.remove(key);\n }\n\n /**\n * Set the progress value.\n *\n * @param {number} newProgress The new progress value.\n * @returns {number}\n */\n function progress(newProgress) {\n if (typeof newProgress === 'undefined') {\n return easedProgress;\n }\n\n progressValue = newProgress;\n easedProgress = ease(progressValue);\n\n // Stop when reaching precision\n if (Math.abs(1 - easedProgress) < PROGRESS_PRECISION) {\n progressValue = 1;\n easedProgress = 1;\n }\n\n callback(easedProgress);\n onProgress(progressValue, easedProgress);\n\n if (easedProgress === 1) {\n pause();\n requestAnimationFrame(() => onFinish(progressValue, easedProgress));\n }\n\n return progressValue;\n }\n\n /**\n * Loop for rendering the animation.\n *\n * @param {Object} props\n * @param {number} props.time\n * @returns {void}\n */\n function tick(props) {\n if (!isRunning) {\n raf.remove(key);\n return;\n }\n\n progress(clamp01(map(props.time, startTime, endTime, 0, 1)));\n }\n\n /**\n * Play the animation.\n *\n * @returns {void}\n */\n function start() {\n onStart();\n startTime = performance.now();\n endTime = startTime + duration;\n progressValue = 0;\n easedProgress = 0;\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n /**\n * Play a paused animation.\n * @returns {void}\n */\n function play() {\n if (isRunning) {\n return;\n }\n\n startTime = performance.now() - lerp(0, duration, progressValue);\n endTime = startTime + duration;\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n return {\n start,\n finish: () => progress(1),\n pause,\n play,\n progress,\n };\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAAS,MAAM,KAAK,eAAe;AACnC,SAAS,WAAW,eAAe;AACnC,SAAS,MAAM,aAAa,cAAc;AAC1C,OAAO,YAAY;AAEnB,IAAI,KAAK;AACT,MAAM,qBAAqB;AAkBpB,SAAS,cAAc,MAAM;AAClC,MAAI,CAAC,UAAU,IAAI,GAAG;AACpB,WAAO;AAAA,EACT;AAEA,MAAI,QAAQ,IAAI,GAAG;AACjB,WAAO,YAAY,GAAG,IAAI;AAAA,EAC5B;AAEA,SAAO;AACT;AAQO,SAAS,MAAM,UAAU,UAAU,CAAC,GAAG;AAC5C,QAAM,MAAM,OAAO;AAEnB,MAAI,gBAAgB;AACpB,MAAI,gBAAgB;AAEpB,QAAM,OAAO,cAAc,QAAQ,MAAM;AACzC,MAAI,WAAW,QAAQ,YAAY;AACnC,cAAY;AAEZ,MAAI,YAAY,YAAY,IAAI;AAChC,MAAI,UAAU,YAAY;AAE1B,QAAM,MAAM,MAAM;AAClB,QAAM;AAEN,QAAM,EAAE,UAAU,MAAM,aAAa,MAAM,WAAW,KAAK,IAAI;AAC/D,MAAI,YAAY;AAOhB,WAAS,QAAQ;AACf,gBAAY;AACZ,QAAI,OAAO,GAAG;AAAA,EAChB;AAQA,WAAS,SAAS,aAAa;AAC7B,QAAI,OAAO,gBAAgB,aAAa;AACtC,aAAO;AAAA,IACT;AAEA,oBAAgB;AAChB,oBAAgB,KAAK,aAAa;AAGlC,QAAI,KAAK,IAAI,IAAI,aAAa,IAAI,oBAAoB;AACpD,sBAAgB;AAChB,sBAAgB;AAAA,IAClB;AAEA,aAAS,aAAa;AACtB,eAAW,eAAe,aAAa;AAEvC,QAAI,kBAAkB,GAAG;AACvB,YAAM;AACN,4BAAsB,MAAM,SAAS,eAAe,aAAa,CAAC;AAAA,IACpE;AAEA,WAAO;AAAA,EACT;AASA,WAAS,KAAK,OAAO;AACnB,QAAI,CAAC,WAAW;AACd,UAAI,OAAO,GAAG;AACd;AAAA,IACF;AAEA,aAAS,QAAQ,IAAI,MAAM,MAAM,WAAW,SAAS,GAAG,CAAC,CAAC,CAAC;AAAA,EAC7D;AAOA,WAAS,QAAQ;AACf,YAAQ;AACR,gBAAY,YAAY,IAAI;AAC5B,cAAU,YAAY;AACtB,oBAAgB;AAChB,oBAAgB;AAChB,gBAAY;AAEZ,QAAI,IAAI,KAAK,IAAI;AAAA,EACnB;AAMA,WAAS,OAAO;AACd,QAAI,WAAW;AACb;AAAA,IACF;AAEA,gBAAY,YAAY,IAAI,IAAI,KAAK,GAAG,UAAU,aAAa;AAC/D,cAAU,YAAY;AACtB,gBAAY;AAEZ,QAAI,IAAI,KAAK,IAAI;AAAA,EACnB;AAEA,SAAO;AAAA,IACL;AAAA,IACA,QAAQ,MAAM,SAAS,CAAC;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|