@ceale/util 1.8.0 → 1.9.0

package/README.md

@@ -1,3 +1,41 @@
 # @ceale/util
 
-小工具集
+小工具集
+
+提供了
+- String.prototype
+    - removePrefix()
+    - removeSuffix()
+    - removeAllPrefixes()
+    - removeAllSuffixes()
+    - toCamelCase()
+    - toKebabCase()
+- Function.prototype
+    - isDirectSubclass()
+    - isSubclass()
+    - isDirectInstance()
+    - isInstance()
+- namespace: `uri`
+    - join()
+- namespace: `css`
+    - rule()
+    - selector()
+    - at()
+    - join()
+- `time.ts`
+    - wait() `# Alias: sleepAsync()`
+    - sleep() `# Alias: waitSync()`
+- `task.ts`
+    - debounce()
+    - throttle()
+- `bezier.ts`
+    - namespace `quadraticCurve`
+        - solveX()
+        - solveY()
+        - solveTForX()
+    - namespace `cubicCurve`
+        - solveX()
+        - solveY()
+        - solveTForX()
+    - class `QuadraticBezier`
+    - class `CubicBezier`

package/dist/cjs/index.js

@@ -35,8 +35,12 @@ __export(exports_src, {
   throttle: () => throttle,
   sleepAsync: () => sleepAsync,
   sleep: () => sleep,
+  quadraticCurve: () => quadraticCurve,
   debounce: () => debounce,
-  css: () => css
+  cubicCurve: () => cubicCurve,
+  css: () => css,
+  QuadraticBezier: () => QuadraticBezier,
+  CubicBezier: () => CubicBezier
 });
 module.exports = __toCommonJS(exports_src);
 
@@ -249,3 +253,115 @@ var throttle = (func, delay) => {
     }, delay);
   };
 };
+// src/bezier.ts
+class BezierError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = "BezierError";
+  }
+}
+var quadraticCurve;
+((quadraticCurve) => {
+  quadraticCurve.solveX = (p1, t) => {
+    const [p1x, p1y] = p1;
+    const oneMinusT = 1 - t;
+    return 2 * oneMinusT * t * p1x + t * t;
+  };
+  quadraticCurve.solveY = (p1, t) => {
+    const [p1x, p1y] = p1;
+    const oneMinusT = 1 - t;
+    return 2 * oneMinusT * t * p1y + t * t;
+  };
+  quadraticCurve.solveTForX = (p1, x, iterations = 8) => {
+    let tMin = 0;
+    let tMax = 1;
+    let tGuess;
+    for (let i = 0;i < iterations; i++) {
+      tGuess = (tMin + tMax) / 2;
+      const xGuess = quadraticCurve.solveX(p1, tGuess);
+      if (xGuess < x) {
+        tMin = tGuess;
+      } else {
+        tMax = tGuess;
+      }
+    }
+    return (tMin + tMax) / 2;
+  };
+})(quadraticCurve ||= {});
+var cubicCurve;
+((cubicCurve) => {
+  cubicCurve.solveX = ([p1, p2], t) => {
+    const [p1x, p1y] = p1;
+    const [p2x, p2y] = p2;
+    const oneMinusT = 1 - t;
+    const t2 = t * t;
+    return 3 * oneMinusT * oneMinusT * t * p1x + 3 * oneMinusT * t2 * p2x + t2 * t;
+  };
+  cubicCurve.solveY = ([p1, p2], t) => {
+    const [p1x, p1y] = p1;
+    const [p2x, p2y] = p2;
+    const oneMinusT = 1 - t;
+    const t2 = t * t;
+    return 3 * oneMinusT * oneMinusT * t * p1y + 3 * oneMinusT * t2 * p2y + t2 * t;
+  };
+  cubicCurve.solveTForX = ([p1, p2], x, iterations = 12) => {
+    let tMin = 0;
+    let tMax = 1;
+    let tGuess;
+    for (let i = 0;i < iterations; i++) {
+      tGuess = (tMin + tMax) / 2;
+      const xGuess = cubicCurve.solveX([p1, p2], tGuess);
+      if (xGuess < x) {
+        tMin = tGuess;
+      } else {
+        tMax = tGuess;
+      }
+    }
+    return (tMin + tMax) / 2;
+  };
+})(cubicCurve ||= {});
+
+class QuadraticBezier {
+  p1;
+  constructor(p1) {
+    this.p1 = p1;
+    if (this.p1[0] < 0 || this.p1[0] > 1) {
+      throw new BezierError("控制点P1的x坐标必须在[0, 1]之间");
+    }
+  }
+  solveX(t) {
+    return quadraticCurve.solveX(this.p1, t);
+  }
+  solveY(t) {
+    return quadraticCurve.solveY(this.p1, t);
+  }
+  solveYForX(x) {
+    const t = quadraticCurve.solveTForX(this.p1, x);
+    return this.solveY(t);
+  }
+}
+
+class CubicBezier {
+  p1;
+  p2;
+  constructor(p1, p2) {
+    this.p1 = p1;
+    this.p2 = p2;
+    if (this.p1[0] < 0 || this.p1[0] > 1) {
+      throw new BezierError("控制点P1的x坐标必须在[0, 1]之间");
+    }
+    if (this.p2[0] < 0 || this.p2[0] > 1) {
+      throw new BezierError("控制点P2的x坐标必须在[0, 1]之间");
+    }
+  }
+  solveX(t) {
+    return cubicCurve.solveX([this.p1, this.p2], t);
+  }
+  solveY(t) {
+    return cubicCurve.solveY([this.p1, this.p2], t);
+  }
+  solveYForX(x) {
+    const t = cubicCurve.solveTForX([this.p1, this.p2], x);
+    return this.solveY(t);
+  }
+}

package/dist/esm/index.js

@@ -207,6 +207,118 @@ var throttle = (func, delay) => {
     }, delay);
   };
 };
+// src/bezier.ts
+class BezierError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = "BezierError";
+  }
+}
+var quadraticCurve;
+((quadraticCurve) => {
+  quadraticCurve.solveX = (p1, t) => {
+    const [p1x, p1y] = p1;
+    const oneMinusT = 1 - t;
+    return 2 * oneMinusT * t * p1x + t * t;
+  };
+  quadraticCurve.solveY = (p1, t) => {
+    const [p1x, p1y] = p1;
+    const oneMinusT = 1 - t;
+    return 2 * oneMinusT * t * p1y + t * t;
+  };
+  quadraticCurve.solveTForX = (p1, x, iterations = 8) => {
+    let tMin = 0;
+    let tMax = 1;
+    let tGuess;
+    for (let i = 0;i < iterations; i++) {
+      tGuess = (tMin + tMax) / 2;
+      const xGuess = quadraticCurve.solveX(p1, tGuess);
+      if (xGuess < x) {
+        tMin = tGuess;
+      } else {
+        tMax = tGuess;
+      }
+    }
+    return (tMin + tMax) / 2;
+  };
+})(quadraticCurve ||= {});
+var cubicCurve;
+((cubicCurve) => {
+  cubicCurve.solveX = ([p1, p2], t) => {
+    const [p1x, p1y] = p1;
+    const [p2x, p2y] = p2;
+    const oneMinusT = 1 - t;
+    const t2 = t * t;
+    return 3 * oneMinusT * oneMinusT * t * p1x + 3 * oneMinusT * t2 * p2x + t2 * t;
+  };
+  cubicCurve.solveY = ([p1, p2], t) => {
+    const [p1x, p1y] = p1;
+    const [p2x, p2y] = p2;
+    const oneMinusT = 1 - t;
+    const t2 = t * t;
+    return 3 * oneMinusT * oneMinusT * t * p1y + 3 * oneMinusT * t2 * p2y + t2 * t;
+  };
+  cubicCurve.solveTForX = ([p1, p2], x, iterations = 12) => {
+    let tMin = 0;
+    let tMax = 1;
+    let tGuess;
+    for (let i = 0;i < iterations; i++) {
+      tGuess = (tMin + tMax) / 2;
+      const xGuess = cubicCurve.solveX([p1, p2], tGuess);
+      if (xGuess < x) {
+        tMin = tGuess;
+      } else {
+        tMax = tGuess;
+      }
+    }
+    return (tMin + tMax) / 2;
+  };
+})(cubicCurve ||= {});
+
+class QuadraticBezier {
+  p1;
+  constructor(p1) {
+    this.p1 = p1;
+    if (this.p1[0] < 0 || this.p1[0] > 1) {
+      throw new BezierError("控制点P1的x坐标必须在[0, 1]之间");
+    }
+  }
+  solveX(t) {
+    return quadraticCurve.solveX(this.p1, t);
+  }
+  solveY(t) {
+    return quadraticCurve.solveY(this.p1, t);
+  }
+  solveYForX(x) {
+    const t = quadraticCurve.solveTForX(this.p1, x);
+    return this.solveY(t);
+  }
+}
+
+class CubicBezier {
+  p1;
+  p2;
+  constructor(p1, p2) {
+    this.p1 = p1;
+    this.p2 = p2;
+    if (this.p1[0] < 0 || this.p1[0] > 1) {
+      throw new BezierError("控制点P1的x坐标必须在[0, 1]之间");
+    }
+    if (this.p2[0] < 0 || this.p2[0] > 1) {
+      throw new BezierError("控制点P2的x坐标必须在[0, 1]之间");
+    }
+  }
+  solveX(t) {
+    return cubicCurve.solveX([this.p1, this.p2], t);
+  }
+  solveY(t) {
+    return cubicCurve.solveY([this.p1, this.p2], t);
+  }
+  solveYForX(x) {
+    const t = cubicCurve.solveTForX([this.p1, this.p2], x);
+    return this.solveY(t);
+  }
+}
 export {
   waitSync,
   wait,
@@ -214,6 +326,10 @@ export {
   throttle,
   sleepAsync,
   sleep,
+  quadraticCurve,
   debounce,
-  css
+  cubicCurve,
+  css,
+  QuadraticBezier,
+  CubicBezier
 };

package/dist/types/bezier.d.ts

@@ -0,0 +1,96 @@
+type Point = [number, number];
+export declare namespace quadraticCurve {
+    /**
+     * [二次] 给定控制点 P1 和 t (时间)，计算 x 坐标
+     * @param p1 控制点1 的坐标
+     * @param t 时间比例 [0, 1]
+     * @returns x 坐标
+     */
+    const solveX: (p1: Point, t: number) => number;
+    /**
+     * [二次] 给定控制点 P1 和 t (时间)，计算 y 坐标
+     * @param p1 控制点1 坐标
+     * @param t 时间比例 [0, 1]
+     * @returns y 坐标
+     */
+    const solveY: (p1: Point, t: number) => number;
+    /**
+     * [二次] 给定控制点 P1 和 x (坐标)，反向求解 t (时间)
+     * 使用二分查找法
+     * @param p1 控制点1 坐标
+     * @param x 目标 x 坐标 [0, 1]
+     * @returns 对应的时间 t
+     */
+    const solveTForX: (p1: Point, x: number, iterations?: number) => number;
+}
+export declare namespace cubicCurve {
+    /**
+     * [三次] 给定控制点 P1, P2 和 t (时间)，计算 x 坐标
+     * @param \[p1, p2] 控制点1 控制点2 的坐标
+     * @param t 时间比例 [0, 1]
+     * @returns x 坐标
+     */
+    const solveX: ([p1, p2]: [Point, Point], t: number) => number;
+    /**
+     * [三次] 给定控制点 P1, P2 和 t (时间)，计算 y 坐标
+     * @param \[p1, p2] 控制点1 控制点2 的坐标
+     * @param t 时间比例 [0, 1]
+     * @returns y 坐标
+     */
+    const solveY: ([p1, p2]: [Point, Point], t: number) => number;
+    /**
+     * [三次] 给定控制点 P1, P2 和 x (坐标)，反向求解 t (时间)
+     * 使用二分查找法
+     * @param \[p1, p2] 控制点1 控制点2 的坐标
+     * @param x 目标 x 坐标 [0, 1]
+     * @returns 对应的时间 t
+     */
+    const solveTForX: ([p1, p2]: [Point, Point], x: number, iterations?: number) => number;
+}
+/**
+ * 代表一个二次贝塞尔缓动曲线
+ */
+export declare class QuadraticBezier {
+    private readonly p1;
+    /**
+     * @param p1 控制点 P1
+     */
+    constructor(p1: Point);
+    /**
+     * 根据时间 t [0, 1]，计算 x 坐标
+     */
+    solveX(t: number): number;
+    /**
+     * 根据时间 t [0, 1]，计算 y 坐标
+     */
+    solveY(t: number): number;
+    /**
+     * 根据 x 坐标 [0, 1]，计算 y 坐标
+     */
+    solveYForX(x: number): number;
+}
+/**
+ * 代表一个三次贝塞尔缓动曲线
+ */
+export declare class CubicBezier {
+    private readonly p1;
+    private readonly p2;
+    /**
+     * @param p1 控制点 P1
+     * @param p2 控制点 P2
+     */
+    constructor(p1: Point, p2: Point);
+    /**
+     * 根据时间 t [0, 1]，计算 x 坐标
+     */
+    solveX(t: number): number;
+    /**
+     * 根据时间 t [0, 1]，计算 y 坐标
+     */
+    solveY(t: number): number;
+    /**
+     * 根据 x 坐标 [0, 1]，计算 y 坐标
+     */
+    solveYForX(x: number): number;
+}
+export {};

package/dist/types/index.d.ts

@@ -4,3 +4,4 @@ export * from "./class";
 export * from "./css";
 export * from "./time";
 export * from "./task";
+export * from "./bezier";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ceale/util",
   "author": "Ceale",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "module": "index.ts",
   "type": "module",
   "main": "dist/esm/index.js",
@@ -31,7 +31,7 @@
     "typescript": "^5"
   },
   "dependencies": {
-    "@types/vue": "^2.0.0",
-    "csstype": "^3.1.3"
+    "csstype": "^3.1.3",
+    "vue": "^3.5.21"
   }
 }