@studiometa/js-toolkit 3.1.0 → 3.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/js-toolkit",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "description": "A set of useful little bits of JavaScript to boost your project! 🚀",
   "publishConfig": {
     "access": "public"

package/utils/math/smoothTo.d.ts

@@ -43,6 +43,7 @@ export declare function smoothTo(start?: number, options?: SmoothToOptions): {
      */
     unsubscribe: (fn: (value: number) => any) => boolean;
     raw(): number;
+    add(val: number): number;
     damping(val?: number): number;
     precision(val?: number): number;
     stiffness(val?: number): number;

package/utils/math/smoothTo.js

@@ -1,10 +1,7 @@
-import { useRaf } from "../../services/RafService.js";
 import { damp } from "./damp.js";
 import { spring } from "./spring.js";
 import { isFunction, isDefined } from "../is.js";
 function smoothTo(start = 0, options = {}) {
-  const { add, has, remove } = useRaf();
-  const key = Symbol();
   const fns = /* @__PURE__ */ new Set();
   let damping = options.damping ?? 0.6;
   let precision = options.precision ?? 1 / 1e8;
@@ -23,7 +20,7 @@ function smoothTo(start = 0, options = {}) {
     for (const fn of fns) {
       fn(smoothed);
     }
-    if (smoothed === value) remove(key);
+    if (smoothed !== value) requestAnimationFrame(tick);
   }
   function subscribe(fn) {
     if (isFunction(fn)) {
@@ -39,14 +36,13 @@ function smoothTo(start = 0, options = {}) {
       return smoothed;
     }
     value = newValue;
-    if (!has(key)) {
-      add(key, tick);
-    }
+    tick();
     return smoothed;
   }
   update.subscribe = subscribe;
   update.unsubscribe = unsubscribe;
   update.raw = () => value;
+  update.add = (val) => update(value + val);
   update.damping = (val) => damping = val ?? damping;
   update.precision = (val) => precision = val ?? precision;
   update.stiffness = (val) => stiffness = val ?? stiffness;

package/utils/math/smoothTo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/math/smoothTo.ts"],
-  "sourcesContent": ["import { useRaf } from '../../services/RafService.js';\nimport { damp } from './damp.js';\nimport { spring } from './spring.js';\nimport { isFunction, isDefined } from '../is.js';\n\nexport type SmoothToOptions = Partial<{\n  /**\n   * Damping factor, the smaller the smoother, defaults to 0.6.\n   */\n  damping: number;\n  /**\n   * Precision used to decide when the smoothing should end, defaults to 1 / 1e8.\n   */\n  precision: number;\n  /**\n   * Enable spring physics, defaults to `true` if one of `stiffness` or `mass` is set, defaults to `false` otherwise.\n   */\n  spring: boolean;\n  /**\n   * Stiffness factor for spring physics, the higher the stiffer, defaults to 0.1.\n   */\n  stiffness: number;\n  /**\n   * Mass factor when spring is enabled, the higher the heavier, defaults to 1.\n   */\n  mass: number;\n}>;\n\n/**\n * Create a smoothing function that will smoothly tween between two values.\n * @param {number} [start] The initial value.\n * @param {SmoothToOptions} [options] Options for the transition.\n * @see https://js-toolkit.studiometa.dev/utils/math/smoothTo.html\n * @example\n * ```js\n * const x = smoothTo(0);\n * x.subscribe((value) => console.log(value));\n * x(100); // 0.1\n * ```\n */\nexport function smoothTo(start = 0, options: SmoothToOptions = {}) {\n  const { add, has, remove } = useRaf();\n  const key = Symbol();\n  const fns = new Set<(value: number) => any>();\n\n  let damping = options.damping ?? 0.6;\n  let precision = options.precision ?? 1 / 1e8;\n  let stiffness = options.stiffness ?? 0.1;\n  let mass = options.mass ?? 1;\n  let isSpring = options.spring === true || isDefined(options.stiffness) || isDefined(options.mass);\n\n  let value = start;\n  let smoothed = start;\n  let velocity = 0;\n\n  /**\n   * Callback for the useRaf service.\n   */\n  function tick() {\n    if (isSpring) {\n      [smoothed, velocity] = spring(value, smoothed, velocity, stiffness, damping, mass, precision);\n    } else {\n      smoothed = damp(value, smoothed, damping, precision);\n    }\n\n    for (const fn of fns) {\n      fn(smoothed);\n    }\n\n    if (smoothed === value) remove(key);\n  }\n\n  /**\n   * Subscribe a callback to the value update.\n   */\n  function subscribe(fn: (value: number) => any) {\n    if (isFunction(fn)) {\n      fns.add(fn);\n    }\n\n    return () => unsubscribe(fn);\n  }\n\n  /**\n   * Unsubscribe a callback to the value update.\n   */\n  function unsubscribe(fn: (value: number) => any) {\n    return fns.delete(fn);\n  }\n\n  /**\n   * Update the value if a parameter is given, get the value if no parameter is given.\n   */\n  function update(newValue?: number): number {\n    if (!isDefined(newValue)) {\n      return smoothed;\n    }\n\n    value = newValue;\n\n    if (!has(key)) {\n      add(key, tick);\n    }\n\n    return smoothed;\n  }\n\n  /**\n   * Subscribe a callback to the value update.\n   */\n  update.subscribe = subscribe;\n\n  /**\n   * Unsubscribe a callback from the value update.\n   */\n  update.unsubscribe = unsubscribe;\n\n  /**\n   * Get the raw target value.\n   */\n  update.raw = () => value;\n  /**\n   * Get or set the damping factor.\n   */\n  update.damping = (val?: number) => (damping = val ?? damping);\n\n  /**\n   * Get or set the precision.\n   */\n  update.precision = (val?: number) => (precision = val ?? precision);\n\n  /**\n   * Get or set the stiffness factor.\n   */\n  update.stiffness = (val?: number) => (stiffness = val ?? stiffness);\n\n  /**\n   * Get or set the spring option.\n   */\n  update.spring = (val?: boolean) => (isSpring = val ?? isSpring);\n\n  update(start);\n  return update;\n}\n"],
-  "mappings": "AAAA,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,YAAY,iBAAiB;AAqC/B,SAAS,SAAS,QAAQ,GAAG,UAA2B,CAAC,GAAG;AACjE,QAAM,EAAE,KAAK,KAAK,OAAO,IAAI,OAAO;AACpC,QAAM,MAAM,OAAO;AACnB,QAAM,MAAM,oBAAI,IAA4B;AAE5C,MAAI,UAAU,QAAQ,WAAW;AACjC,MAAI,YAAY,QAAQ,aAAa,IAAI;AACzC,MAAI,YAAY,QAAQ,aAAa;AACrC,MAAI,OAAO,QAAQ,QAAQ;AAC3B,MAAI,WAAW,QAAQ,WAAW,QAAQ,UAAU,QAAQ,SAAS,KAAK,UAAU,QAAQ,IAAI;AAEhG,MAAI,QAAQ;AACZ,MAAI,WAAW;AACf,MAAI,WAAW;AAKf,WAAS,OAAO;AACd,QAAI,UAAU;AACZ,OAAC,UAAU,QAAQ,IAAI,OAAO,OAAO,UAAU,UAAU,WAAW,SAAS,MAAM,SAAS;AAAA,IAC9F,OAAO;AACL,iBAAW,KAAK,OAAO,UAAU,SAAS,SAAS;AAAA,IACrD;AAEA,eAAW,MAAM,KAAK;AACpB,SAAG,QAAQ;AAAA,IACb;AAEA,QAAI,aAAa,MAAO,QAAO,GAAG;AAAA,EACpC;AAKA,WAAS,UAAU,IAA4B;AAC7C,QAAI,WAAW,EAAE,GAAG;AAClB,UAAI,IAAI,EAAE;AAAA,IACZ;AAEA,WAAO,MAAM,YAAY,EAAE;AAAA,EAC7B;AAKA,WAAS,YAAY,IAA4B;AAC/C,WAAO,IAAI,OAAO,EAAE;AAAA,EACtB;AAKA,WAAS,OAAO,UAA2B;AACzC,QAAI,CAAC,UAAU,QAAQ,GAAG;AACxB,aAAO;AAAA,IACT;AAEA,YAAQ;AAER,QAAI,CAAC,IAAI,GAAG,GAAG;AACb,UAAI,KAAK,IAAI;AAAA,IACf;AAEA,WAAO;AAAA,EACT;AAKA,SAAO,YAAY;AAKnB,SAAO,cAAc;AAKrB,SAAO,MAAM,MAAM;AAInB,SAAO,UAAU,CAAC,QAAkB,UAAU,OAAO;AAKrD,SAAO,YAAY,CAAC,QAAkB,YAAY,OAAO;AAKzD,SAAO,YAAY,CAAC,QAAkB,YAAY,OAAO;AAKzD,SAAO,SAAS,CAAC,QAAmB,WAAW,OAAO;AAEtD,SAAO,KAAK;AACZ,SAAO;AACT;",
+  "sourcesContent": ["import { damp } from './damp.js';\nimport { spring } from './spring.js';\nimport { isFunction, isDefined } from '../is.js';\n\nexport type SmoothToOptions = Partial<{\n  /**\n   * Damping factor, the smaller the smoother, defaults to 0.6.\n   */\n  damping: number;\n  /**\n   * Precision used to decide when the smoothing should end, defaults to 1 / 1e8.\n   */\n  precision: number;\n  /**\n   * Enable spring physics, defaults to `true` if one of `stiffness` or `mass` is set, defaults to `false` otherwise.\n   */\n  spring: boolean;\n  /**\n   * Stiffness factor for spring physics, the higher the stiffer, defaults to 0.1.\n   */\n  stiffness: number;\n  /**\n   * Mass factor when spring is enabled, the higher the heavier, defaults to 1.\n   */\n  mass: number;\n}>;\n\n/**\n * Create a smoothing function that will smoothly tween between two values.\n * @param {number} [start] The initial value.\n * @param {SmoothToOptions} [options] Options for the transition.\n * @see https://js-toolkit.studiometa.dev/utils/math/smoothTo.html\n * @example\n * ```js\n * const x = smoothTo(0);\n * x.subscribe((value) => console.log(value));\n * x(100); // 0.1\n * ```\n */\nexport function smoothTo(start = 0, options: SmoothToOptions = {}) {\n  const fns = new Set<(value: number) => any>();\n\n  let damping = options.damping ?? 0.6;\n  let precision = options.precision ?? 1 / 1e8;\n  let stiffness = options.stiffness ?? 0.1;\n  let mass = options.mass ?? 1;\n  let isSpring = options.spring === true || isDefined(options.stiffness) || isDefined(options.mass);\n\n  let value = start;\n  let smoothed = start;\n  let velocity = 0;\n\n  /**\n   * Callback for the useRaf service.\n   */\n  function tick() {\n    if (isSpring) {\n      [smoothed, velocity] = spring(value, smoothed, velocity, stiffness, damping, mass, precision);\n    } else {\n      smoothed = damp(value, smoothed, damping, precision);\n    }\n\n    for (const fn of fns) {\n      fn(smoothed);\n    }\n\n    if (smoothed !== value) requestAnimationFrame(tick);\n  }\n\n  /**\n   * Subscribe a callback to the value update.\n   */\n  function subscribe(fn: (value: number) => any) {\n    if (isFunction(fn)) {\n      fns.add(fn);\n    }\n\n    return () => unsubscribe(fn);\n  }\n\n  /**\n   * Unsubscribe a callback to the value update.\n   */\n  function unsubscribe(fn: (value: number) => any) {\n    return fns.delete(fn);\n  }\n\n  /**\n   * Update the value if a parameter is given, get the value if no parameter is given.\n   */\n  function update(newValue?: number): number {\n    if (!isDefined(newValue)) {\n      return smoothed;\n    }\n\n    value = newValue;\n\n    tick();\n\n    return smoothed;\n  }\n\n  /**\n   * Subscribe a callback to the value update.\n   */\n  update.subscribe = subscribe;\n\n  /**\n   * Unsubscribe a callback from the value update.\n   */\n  update.unsubscribe = unsubscribe;\n\n  /**\n   * Get the raw target value.\n   */\n  update.raw = () => value;\n\n  /**\n   * Add the given value to the current raw value.\n   */\n  update.add = (val: number) => update(value + val);\n\n  /**\n   * Get or set the damping factor.\n   */\n  update.damping = (val?: number) => (damping = val ?? damping);\n\n  /**\n   * Get or set the precision.\n   */\n  update.precision = (val?: number) => (precision = val ?? precision);\n\n  /**\n   * Get or set the stiffness factor.\n   */\n  update.stiffness = (val?: number) => (stiffness = val ?? stiffness);\n\n  /**\n   * Get or set the spring option.\n   */\n  update.spring = (val?: boolean) => (isSpring = val ?? isSpring);\n\n  update(start);\n  return update;\n}\n"],
+  "mappings": "AAAA,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,YAAY,iBAAiB;AAqC/B,SAAS,SAAS,QAAQ,GAAG,UAA2B,CAAC,GAAG;AACjE,QAAM,MAAM,oBAAI,IAA4B;AAE5C,MAAI,UAAU,QAAQ,WAAW;AACjC,MAAI,YAAY,QAAQ,aAAa,IAAI;AACzC,MAAI,YAAY,QAAQ,aAAa;AACrC,MAAI,OAAO,QAAQ,QAAQ;AAC3B,MAAI,WAAW,QAAQ,WAAW,QAAQ,UAAU,QAAQ,SAAS,KAAK,UAAU,QAAQ,IAAI;AAEhG,MAAI,QAAQ;AACZ,MAAI,WAAW;AACf,MAAI,WAAW;AAKf,WAAS,OAAO;AACd,QAAI,UAAU;AACZ,OAAC,UAAU,QAAQ,IAAI,OAAO,OAAO,UAAU,UAAU,WAAW,SAAS,MAAM,SAAS;AAAA,IAC9F,OAAO;AACL,iBAAW,KAAK,OAAO,UAAU,SAAS,SAAS;AAAA,IACrD;AAEA,eAAW,MAAM,KAAK;AACpB,SAAG,QAAQ;AAAA,IACb;AAEA,QAAI,aAAa,MAAO,uBAAsB,IAAI;AAAA,EACpD;AAKA,WAAS,UAAU,IAA4B;AAC7C,QAAI,WAAW,EAAE,GAAG;AAClB,UAAI,IAAI,EAAE;AAAA,IACZ;AAEA,WAAO,MAAM,YAAY,EAAE;AAAA,EAC7B;AAKA,WAAS,YAAY,IAA4B;AAC/C,WAAO,IAAI,OAAO,EAAE;AAAA,EACtB;AAKA,WAAS,OAAO,UAA2B;AACzC,QAAI,CAAC,UAAU,QAAQ,GAAG;AACxB,aAAO;AAAA,IACT;AAEA,YAAQ;AAER,SAAK;AAEL,WAAO;AAAA,EACT;AAKA,SAAO,YAAY;AAKnB,SAAO,cAAc;AAKrB,SAAO,MAAM,MAAM;AAKnB,SAAO,MAAM,CAAC,QAAgB,OAAO,QAAQ,GAAG;AAKhD,SAAO,UAAU,CAAC,QAAkB,UAAU,OAAO;AAKrD,SAAO,YAAY,CAAC,QAAkB,YAAY,OAAO;AAKzD,SAAO,YAAY,CAAC,QAAkB,YAAY,OAAO;AAKzD,SAAO,SAAS,CAAC,QAAmB,WAAW,OAAO;AAEtD,SAAO,KAAK;AACZ,SAAO;AACT;",
   "names": []
 }