@drauu/core - npm Package Compare versions

Comparing version 0.3.2 to 0.3.3

dist/index.d.ts

@@ -1,3 +0,1 @@
-import { StrokeOptions } from 'perfect-freehand';
-
 interface Unsubscribe {
@@ -7,3 +5,36 @@ (): void
 
-declare type DrawingMode = 'draw' | 'stylus' | 'line' | 'rectangle' | 'ellipse' | 'eraseLine';
+/**
+ * The options object for `getStroke` or `getStrokePoints`.
+ * @param points An array of points (as `[x, y, pressure]` or `{x, y, pressure}`). Pressure is optional in both cases.
+ * @param options (optional) An object with options.
+ * @param options.size	The base size (diameter) of the stroke.
+ * @param options.thinning The effect of pressure on the stroke's size.
+ * @param options.smoothing	How much to soften the stroke's edges.
+ * @param options.easing	An easing function to apply to each point's pressure.
+ * @param options.simulatePressure Whether to simulate pressure based on velocity.
+ * @param options.start Cap, taper and easing for the start of the line.
+ * @param options.end Cap, taper and easing for the end of the line.
+ * @param options.last Whether to handle the points as a completed stroke.
+ */
+interface StrokeOptions {
+    size?: number;
+    thinning?: number;
+    smoothing?: number;
+    streamline?: number;
+    easing?: (pressure: number) => number;
+    simulatePressure?: boolean;
+    start?: {
+        cap?: boolean;
+        taper?: number | boolean;
+        easing?: (distance: number) => number;
+    };
+    end?: {
+        cap?: boolean;
+        taper?: number | boolean;
+        easing?: (distance: number) => number;
+    };
+    last?: boolean;
+}
+
+type DrawingMode = 'draw' | 'stylus' | 'line' | 'rectangle' | 'ellipse' | 'eraseLine';
 interface Brush {
@@ -10,0 +41,0 @@ /**

dist/index.global.js

 "use strict";
 (() => {
-  // ../../node_modules/.pnpm/nanoevents@7.0.1/node_modules/nanoevents/index.js
+  var __defProp = Object.defineProperty;
+  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __propIsEnum = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues = (a2, b2) => {
+    for (var prop in b2 || (b2 = {}))
+      if (__hasOwnProp.call(b2, prop))
+        __defNormalProp(a2, prop, b2[prop]);
+    if (__getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(b2)) {
+        if (__propIsEnum.call(b2, prop))
+          __defNormalProp(a2, prop, b2[prop]);
+      }
+    return a2;
+  };
+
+  // ../../node_modules/.pnpm/nanoevents@8.0.0/node_modules/nanoevents/index.js
   var createNanoEvents = () => ({
-    events: {},
     emit(event, ...args) {
@@ -12,2 +28,3 @@ let callbacks = this.events[event] || [];
     },
+    events: {},
     on(event, cb) {
@@ -239,5 +256,5 @@ var _a;
     getMousePosition(event) {
-      var _a;
+      var _a, _b;
       const el = this.drauu.el;
-      const scale = this.drauu.options.coordinateScale ?? 1;
+      const scale = (_a = this.drauu.options.coordinateScale) != null ? _a : 1;
       if (this.drauu.options.coordinateTransform === false) {
@@ -254,3 +271,3 @@ const rect = this.drauu.el.getBoundingClientRect();
         point.y = event.clientY;
-        const loc = point.matrixTransform((_a = el.getScreenCTM()) == null ? void 0 : _a.inverse());
+        const loc = point.matrixTransform((_b = el.getScreenCTM()) == null ? void 0 : _b.inverse());
         return {
@@ -264,8 +281,6 @@ x: loc.x * scale,
     createElement(name, overrides) {
+      var _a;
       const el = document.createElementNS("http://www.w3.org/2000/svg", name);
-      const brush = overrides ? {
-        ...this.brush,
-        ...overrides
-      } : this.brush;
-      el.setAttribute("fill", brush.fill ?? "transparent");
+      const brush = overrides ? __spreadValues(__spreadValues({}, this.brush), overrides) : this.brush;
+      el.setAttribute("fill", (_a = brush.fill) != null ? _a : "transparent");
       el.setAttribute("stroke", brush.color);
@@ -285,2 +300,5 @@ el.setAttribute("stroke-width", brush.size.toString());
     }
+    /**
+     * @internal
+     */
     _eventDown(event) {
@@ -291,2 +309,5 @@ this._setEvent(event);
     }
+    /**
+     * @internal
+     */
     _eventMove(event) {
@@ -296,2 +317,5 @@ this._setEvent(event);
     }
+    /**
+     * @internal
+     */
     _eventUp(event) {
@@ -332,3 +356,3 @@ this._setEvent(event);
     getSvgData(points) {
-      const stroke = ae(points, {
+      const stroke = ae(points, __spreadValues({
         size: this.brush.size * 2,
@@ -342,5 +366,4 @@ thinning: 0.9,
           taper: 5
-        },
-        ...this.brush.stylusOptions
-      });
+        }
+      }, this.brush.stylusOptions));
       if (!stroke.length)
@@ -347,0 +370,0 @@ return "";

dist/index.js

 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a2, b2) => {
+  for (var prop in b2 || (b2 = {}))
+    if (__hasOwnProp.call(b2, prop))
+      __defNormalProp(a2, prop, b2[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b2)) {
+      if (__propIsEnum.call(b2, prop))
+        __defNormalProp(a2, prop, b2[prop]);
+    }
+  return a2;
+};
 var __export = (target, all) => {
@@ -20,6 +32,2 @@ for (var name in all)
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
@@ -35,5 +43,4 @@
 
-// ../../node_modules/.pnpm/nanoevents@7.0.1/node_modules/nanoevents/index.js
+// ../../node_modules/.pnpm/nanoevents@8.0.0/node_modules/nanoevents/index.js
 var createNanoEvents = () => ({
-  events: {},
   emit(event, ...args) {
@@ -45,2 +52,3 @@ let callbacks = this.events[event] || [];
   },
+  events: {},
   on(event, cb) {
@@ -56,16 +64,175 @@ var _a;
 
-// src/models/stylus.ts
-var pf = __toESM(require("perfect-freehand"));
+// ../../node_modules/.pnpm/perfect-freehand@1.2.0/node_modules/perfect-freehand/dist/esm/index.js
+function $(e, t, u, x = (h) => h) {
+  return e * x(0.5 - t * (0.5 - u));
+}
+function se(e) {
+  return [-e[0], -e[1]];
+}
+function l(e, t) {
+  return [e[0] + t[0], e[1] + t[1]];
+}
+function a(e, t) {
+  return [e[0] - t[0], e[1] - t[1]];
+}
+function b(e, t) {
+  return [e[0] * t, e[1] * t];
+}
+function he(e, t) {
+  return [e[0] / t, e[1] / t];
+}
+function R(e) {
+  return [e[1], -e[0]];
+}
+function B(e, t) {
+  return e[0] * t[0] + e[1] * t[1];
+}
+function ue(e, t) {
+  return e[0] === t[0] && e[1] === t[1];
+}
+function ge(e) {
+  return Math.hypot(e[0], e[1]);
+}
+function de(e) {
+  return e[0] * e[0] + e[1] * e[1];
+}
+function A(e, t) {
+  return de(a(e, t));
+}
+function G(e) {
+  return he(e, ge(e));
+}
+function ie(e, t) {
+  return Math.hypot(e[1] - t[1], e[0] - t[0]);
+}
+function L(e, t, u) {
+  let x = Math.sin(u), h = Math.cos(u), y = e[0] - t[0], n = e[1] - t[1], f = y * h - n * x, d = y * x + n * h;
+  return [f + t[0], d + t[1]];
+}
+function K(e, t, u) {
+  return l(e, b(a(t, e), u));
+}
+function ee(e, t, u) {
+  return l(e, b(t, u));
+}
+var { min: C, PI: xe } = Math;
+var pe = 0.275;
+var V = xe + 1e-4;
+function ce(e, t = {}) {
+  let { size: u = 16, smoothing: x = 0.5, thinning: h = 0.5, simulatePressure: y = true, easing: n = (r) => r, start: f = {}, end: d = {}, last: D2 = false } = t, { cap: S = true, easing: j = (r) => r * (2 - r) } = f, { cap: q = true, easing: c = (r) => --r * r * r + 1 } = d;
+  if (e.length === 0 || u <= 0)
+    return [];
+  let p = e[e.length - 1].runningLength, g = f.taper === false ? 0 : f.taper === true ? Math.max(u, p) : f.taper, T = d.taper === false ? 0 : d.taper === true ? Math.max(u, p) : d.taper, te = Math.pow(u * x, 2), _ = [], M = [], H = e.slice(0, 10).reduce((r, i) => {
+    let o = i.pressure;
+    if (y) {
+      let s = C(1, i.distance / u), W = C(1, 1 - s);
+      o = C(1, r + (W - r) * (s * pe));
+    }
+    return (r + o) / 2;
+  }, e[0].pressure), m = $(u, h, e[e.length - 1].pressure, n), U, X = e[0].vector, z = e[0].point, F = z, O = z, E = F, J = false;
+  for (let r = 0; r < e.length; r++) {
+    let { pressure: i } = e[r], { point: o, vector: s, distance: W, runningLength: I } = e[r];
+    if (r < e.length - 1 && p - I < 3)
+      continue;
+    if (h) {
+      if (y) {
+        let v = C(1, W / u), Z = C(1, 1 - v);
+        i = C(1, H + (Z - H) * (v * pe));
+      }
+      m = $(u, h, i, n);
+    } else
+      m = u / 2;
+    U === void 0 && (U = m);
+    let le = I < g ? j(I / g) : 1, fe = p - I < T ? c((p - I) / T) : 1;
+    m = Math.max(0.01, m * Math.min(le, fe));
+    let re = (r < e.length - 1 ? e[r + 1] : e[r]).vector, Y = r < e.length - 1 ? B(s, re) : 1, be = B(s, X) < 0 && !J, ne = Y !== null && Y < 0;
+    if (be || ne) {
+      let v = b(R(X), m);
+      for (let Z = 1 / 13, w = 0; w <= 1; w += Z)
+        O = L(a(o, v), o, V * w), _.push(O), E = L(l(o, v), o, V * -w), M.push(E);
+      z = O, F = E, ne && (J = true);
+      continue;
+    }
+    if (J = false, r === e.length - 1) {
+      let v = b(R(s), m);
+      _.push(a(o, v)), M.push(l(o, v));
+      continue;
+    }
+    let oe = b(R(K(re, s, Y)), m);
+    O = a(o, oe), (r <= 1 || A(z, O) > te) && (_.push(O), z = O), E = l(o, oe), (r <= 1 || A(F, E) > te) && (M.push(E), F = E), H = i, X = s;
+  }
+  let P = e[0].point.slice(0, 2), k = e.length > 1 ? e[e.length - 1].point.slice(0, 2) : l(e[0].point, [1, 1]), Q = [], N = [];
+  if (e.length === 1) {
+    if (!(g || T) || D2) {
+      let r = ee(P, G(R(a(P, k))), -(U || m)), i = [];
+      for (let o = 1 / 13, s = o; s <= 1; s += o)
+        i.push(L(r, P, V * 2 * s));
+      return i;
+    }
+  } else {
+    if (!(g || T && e.length === 1))
+      if (S)
+        for (let i = 1 / 13, o = i; o <= 1; o += i) {
+          let s = L(M[0], P, V * o);
+          Q.push(s);
+        }
+      else {
+        let i = a(_[0], M[0]), o = b(i, 0.5), s = b(i, 0.51);
+        Q.push(a(P, o), a(P, s), l(P, s), l(P, o));
+      }
+    let r = R(se(e[e.length - 1].vector));
+    if (T || g && e.length === 1)
+      N.push(k);
+    else if (q) {
+      let i = ee(k, r, m);
+      for (let o = 1 / 29, s = o; s < 1; s += o)
+        N.push(L(i, k, V * 3 * s));
+    } else
+      N.push(l(k, b(r, m)), l(k, b(r, m * 0.99)), a(k, b(r, m * 0.99)), a(k, b(r, m)));
+  }
+  return _.concat(N, M.reverse(), Q);
+}
+function me(e, t = {}) {
+  var q;
+  let { streamline: u = 0.5, size: x = 16, last: h = false } = t;
+  if (e.length === 0)
+    return [];
+  let y = 0.15 + (1 - u) * 0.85, n = Array.isArray(e[0]) ? e : e.map(({ x: c, y: p, pressure: g = 0.5 }) => [c, p, g]);
+  if (n.length === 2) {
+    let c = n[1];
+    n = n.slice(0, -1);
+    for (let p = 1; p < 5; p++)
+      n.push(K(n[0], c, p / 4));
+  }
+  n.length === 1 && (n = [...n, [...l(n[0], [1, 1]), ...n[0].slice(2)]]);
+  let f = [{ point: [n[0][0], n[0][1]], pressure: n[0][2] >= 0 ? n[0][2] : 0.25, vector: [1, 1], distance: 0, runningLength: 0 }], d = false, D2 = 0, S = f[0], j = n.length - 1;
+  for (let c = 1; c < n.length; c++) {
+    let p = h && c === j ? n[c].slice(0, 2) : K(S.point, n[c], y);
+    if (ue(S.point, p))
+      continue;
+    let g = ie(p, S.point);
+    if (D2 += g, c < j && !d) {
+      if (D2 < x)
+        continue;
+      d = true;
+    }
+    S = { point: p, pressure: n[c][2] >= 0 ? n[c][2] : 0.5, vector: G(a(S.point, p)), distance: g, runningLength: D2 }, f.push(S);
+  }
+  return f[0].vector = ((q = f[1]) == null ? void 0 : q.vector) || [0, 0], f;
+}
+function ae(e, t = {}) {
+  return ce(me(e, t), t);
+}
 
 // src/utils/index.ts
-function numSort(a, b) {
-  return a - b;
+function numSort(a2, b2) {
+  return a2 - b2;
 }
-function getSymbol(a) {
-  if (a < 0)
+function getSymbol(a2) {
+  if (a2 < 0)
     return -1;
   return 1;
 }
-function splitNum(a) {
-  return [Math.abs(a), getSymbol(a)];
+function splitNum(a2) {
+  return [Math.abs(a2), getSymbol(a2)];
 }
@@ -114,5 +281,5 @@ function guid() {
   getMousePosition(event) {
-    var _a;
+    var _a, _b;
     const el = this.drauu.el;
-    const scale = this.drauu.options.coordinateScale ?? 1;
+    const scale = (_a = this.drauu.options.coordinateScale) != null ? _a : 1;
     if (this.drauu.options.coordinateTransform === false) {
@@ -129,3 +296,3 @@ const rect = this.drauu.el.getBoundingClientRect();
       point.y = event.clientY;
-      const loc = point.matrixTransform((_a = el.getScreenCTM()) == null ? void 0 : _a.inverse());
+      const loc = point.matrixTransform((_b = el.getScreenCTM()) == null ? void 0 : _b.inverse());
       return {
@@ -139,8 +306,6 @@ x: loc.x * scale,
   createElement(name, overrides) {
+    var _a;
     const el = document.createElementNS("http://www.w3.org/2000/svg", name);
-    const brush = overrides ? {
-      ...this.brush,
-      ...overrides
-    } : this.brush;
-    el.setAttribute("fill", brush.fill ?? "transparent");
+    const brush = overrides ? __spreadValues(__spreadValues({}, this.brush), overrides) : this.brush;
+    el.setAttribute("fill", (_a = brush.fill) != null ? _a : "transparent");
     el.setAttribute("stroke", brush.color);
@@ -160,2 +325,5 @@ el.setAttribute("stroke-width", brush.size.toString());
   }
+  /**
+   * @internal
+   */
   _eventDown(event) {
@@ -166,2 +334,5 @@ this._setEvent(event);
   }
+  /**
+   * @internal
+   */
   _eventMove(event) {
@@ -171,2 +342,5 @@ this._setEvent(event);
   }
+  /**
+   * @internal
+   */
   _eventUp(event) {
@@ -207,3 +381,3 @@ this._setEvent(event);
   getSvgData(points) {
-    const stroke = pf.getStroke(points, {
+    const stroke = ae(points, __spreadValues({
       size: this.brush.size * 2,
@@ -217,5 +391,4 @@ thinning: 0.9,
         taper: 5
-      },
-      ...this.brush.stylusOptions
-    });
+      }
+    }, this.brush.stylusOptions));
     if (!stroke.length)
@@ -524,5 +697,5 @@ return "";
 };
-function line(a, b) {
-  const lengthX = b.x - a.x;
-  const lengthY = b.y - a.y;
+function line(a2, b2) {
+  const lengthX = b2.x - a2.x;
+  const lengthY = b2.y - a2.y;
   return {
@@ -551,3 +724,3 @@ length: Math.sqrt(lengthX ** 2 + lengthY ** 2),
   return points.reduce(
-    (acc, point, i, a) => i === 0 ? `M ${point.x.toFixed(D)},${point.y.toFixed(D)}` : `${acc} ${bezierCommand(point, i, a)}`,
+    (acc, point, i, a2) => i === 0 ? `M ${point.x.toFixed(D)},${point.y.toFixed(D)}` : `${acc} ${bezierCommand(point, i, a2)}`,
     ""
@@ -648,6 +821,6 @@ );
     const pt_y_num = (x1 * y2 - y1 * x2) * (y3 - y4) - (y1 - y2) * (x3 * y4 - y3 * x4);
-    const btwn = (a, b1, b2) => {
-      if (a >= b1 && a <= b2)
+    const btwn = (a2, b1, b2) => {
+      if (a2 >= b1 && a2 <= b2)
         return true;
-      return a >= b2 && a <= b1;
+      return a2 >= b2 && a2 <= b1;
     };
@@ -654,0 +827,0 @@ if (pt_denom === 0) {

package.json

 {
   "name": "@drauu/core",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "author": "Anthony Fu <[e-mail]>",
@@ -31,3 +31,3 @@ "license": "MIT",
   ],
-  "dependencies": {
+  "devDependencies": {
     "perfect-freehand": "^1.2.0"
@@ -34,0 +34,0 @@ },

No alert changes

Improved metrics

Total package byte prevSize

104518

increased by23.74%

Dependency count

0

decreased by-100%

Number of package files

7

increased by16.67%

Lines of code

3194

increased by14.6%

Worsened metrics

Dev dependency count

1

increased byInfinity%

Dependency changes

• - Removedperfect-freehand@^1.2.0

• - Removedperfect-freehand@1.2.2(transitive)