gesturx 1.8.3 → 1.8.5

package/dist/index.d.ts

@@ -73,16 +73,12 @@ declare interface PinchRecognizerOptions {
 }
 
 export declare class Recognizable<T extends Recognizer<any, any>[]> implements RecognizableInterface<T> {
-    protected options: {
-        recognizers: T;
-    } & RecognizerConfig<unknown>;
+    protected options: RecognizableOptions<T>;
     events$: Observable<ObservedValueOf<T[number]["events$"]>>;
     recognizers: T;
     state$: Observable<RecognizableState>;
-    constructor(options: {
-        recognizers: T;
-    } & RecognizerConfig<unknown>);
-    update(options: RecognizerConfig<unknown>): void;
+    constructor(options: RecognizableOptions<T>);
+    update({ disableTextSelection, ...rest }: Partial<RecognizableOptions<T>>): void;
 }
 
 declare interface RecognizableInterface<T extends Recognizer<any, any>[]> {
@@ -113,6 +109,16 @@ declare interface RecognizableInterface<T extends Recognizer<any, any>[]> {
     update(options: RecognizerConfig<unknown>): void;
 }
 
+declare type RecognizableOptions<T extends Recognizer<any, any>[]> = {
+    recognizers: T;
+    /**
+     * If you don't need to have text selection, set this to true
+     * to improve dragging gesture. This will prevent accidental
+     * text selection on your component.
+     */
+    disableTextSelection?: boolean;
+} & RecognizerConfig<unknown>;
+
 declare type RecognizableState = {
     /**
      * Number of maximum simultaneous fingers currently registered

package/dist/index.js

@@ -1,7 +1,7 @@
 var ie = Object.defineProperty;
 var se = (t, n, e) => n in t ? ie(t, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[n] = e;
-var u = (t, n, e) => se(t, typeof n != "symbol" ? n + "" : n, e);
-import { filter as c, fromEvent as S, mergeMap as b, defer as pe, of as I, merge as g, takeWhile as V, scan as U, map as h, BehaviorSubject as q, switchMap as v, distinctUntilChanged as oe, startWith as re, shareReplay as E, combineLatest as j, exhaustMap as H, first as R, share as w, timer as J, withLatestFrom as z, takeUntil as T, skip as ae, tap as K, ignoreElements as le, buffer as he, debounceTime as ce, NEVER as ue, defaultIfEmpty as $e } from "rxjs";
+var $ = (t, n, e) => se(t, typeof n != "symbol" ? n + "" : n, e);
+import { filter as c, fromEvent as S, mergeMap as b, defer as pe, of as I, merge as g, takeWhile as V, scan as U, map as h, BehaviorSubject as q, switchMap as v, share as P, distinctUntilChanged as oe, startWith as re, shareReplay as M, combineLatest as j, exhaustMap as H, first as R, timer as J, withLatestFrom as z, takeUntil as T, skip as ae, tap as K, ignoreElements as le, buffer as he, debounceTime as ce, NEVER as $e, defaultIfEmpty as ue } from "rxjs";
 function de(t, n) {
   return Math.sqrt(
     Math.pow(n.x - t.x, 2) + Math.pow(n.y - t.y, 2)
@@ -40,11 +40,11 @@ function ye(t, n) {
       e,
       t[s]
     );
-    let $ = N(
+    let u = N(
       i,
       n[s]
     ) - r;
-    $ > Math.PI ? $ -= 2 * Math.PI : $ < -Math.PI && ($ += 2 * Math.PI), o += $;
+    u > Math.PI ? u -= 2 * Math.PI : u < -Math.PI && (u += 2 * Math.PI), o += u;
   }
   const p = o / t.length, a = p * (180 / Math.PI);
   return { radianDelta: p, degreesDelta: a };
@@ -107,7 +107,7 @@ const Z = (t) => t.type === "pointerleave" || t.type === "pointercancel" || t.ty
     }),
     U((r, l) => {
       if (s(l)) {
-        const { [l.pointerId]: $, ...m } = (r == null ? void 0 : r.pointers) ?? {};
+        const { [l.pointerId]: u, ...m } = (r == null ? void 0 : r.pointers) ?? {};
         return {
           event: l,
           pointers: m
@@ -138,10 +138,10 @@ const Z = (t) => t.type === "pointerleave" || t.type === "pointercancel" || t.ty
   );
   return t.pipe(
     U((e, i) => {
-      var f, P;
-      const o = n(i), p = (e == null ? void 0 : e.center) ?? o, a = (e == null ? void 0 : e.deltaX) ?? 0, s = (e == null ? void 0 : e.deltaY) ?? 0, r = ((f = e == null ? void 0 : e.latestActivePointers) == null ? void 0 : f.length) ?? 1, l = ((P = i.latestActivePointers) == null ? void 0 : P.length) ?? 1, $ = ["pointerdown", "pointercancel", "pointerleave", "pointerup"].includes(
+      var f, E;
+      const o = n(i), p = (e == null ? void 0 : e.center) ?? o, a = (e == null ? void 0 : e.deltaX) ?? 0, s = (e == null ? void 0 : e.deltaY) ?? 0, r = ((f = e == null ? void 0 : e.latestActivePointers) == null ? void 0 : f.length) ?? 1, l = ((E = i.latestActivePointers) == null ? void 0 : E.length) ?? 1, u = ["pointerdown", "pointercancel", "pointerleave", "pointerup"].includes(
         i.event.type
-      ) && r !== l, m = l > 0, { deltaX: y, deltaY: A } = $ && m ? _(o, o, a, s) : _(o, p, a, s), { degreesDelta: D } = r === l && r >= 2 && l >= 2 ? ye(
+      ) && r !== l, m = l > 0, { deltaX: y, deltaY: A } = u && m ? _(o, o, a, s) : _(o, p, a, s), { degreesDelta: D } = r === l && r >= 2 && l >= 2 ? ye(
         (e == null ? void 0 : e.latestActivePointers) ?? [],
         i.latestActivePointers ?? []
       ) : { degreesDelta: 0 };
@@ -164,7 +164,7 @@ const Z = (t) => t.type === "pointerleave" || t.type === "pointercancel" || t.ty
         center: s,
         event: r,
         deltaPointersAngle: l
-      } = e, $ = p ?? [], y = Date.now() - a, { velocityX: A, velocityY: D } = De(y, i, o), f = ve(p);
+      } = e, u = p ?? [], y = Date.now() - a, { velocityX: A, velocityY: D } = De(y, i, o), f = ve(p);
       return {
         deltaX: i,
         deltaY: o,
@@ -172,7 +172,7 @@ const Z = (t) => t.type === "pointerleave" || t.type === "pointercancel" || t.ty
         velocityY: D,
         delay: y,
         center: s,
-        pointers: $,
+        pointers: u,
         startTime: a,
         event: r,
         deltaPointersAngle: l,
@@ -184,7 +184,7 @@ const Z = (t) => t.type === "pointerleave" || t.type === "pointercancel" || t.ty
   c(
     (n) => !!n.container
   )
-), ne = (t) => t.pipe(c(Z)), we = ({
+), ne = (t) => t.pipe(c(Z)), Ee = ({
   container: t,
   afterEventReceived: n = (e) => e
 }) => {
@@ -198,43 +198,51 @@ const Z = (t) => t.type === "pointerleave" || t.type === "pointercancel" || t.ty
     t,
     "pointercancel"
   ).pipe(h(n));
-  return g(
-    e,
-    a,
-    p,
-    i,
-    o
-  );
+  return {
+    pointerEvents$: g(
+      e,
+      a,
+      p,
+      i,
+      o
+    ),
+    pointerDown$: e,
+    pointerCancel$: a,
+    pointerLeave$: p,
+    pointerUp$: i,
+    pointerMove$: o
+  };
 };
 class F {
   constructor(n, e) {
-    u(this, "configSubject", new q({}));
-    u(this, "pan$");
-    u(this, "panStart$");
-    u(this, "panMove$");
-    u(this, "panEnd$");
-    u(this, "pointerEvent$");
-    u(this, "pointerDown$");
-    u(this, "pointerUp$");
-    u(this, "pointerCancel$");
-    u(this, "pointerMove$");
-    u(this, "pointerOff$");
-    u(this, "state$");
-    u(this, "config$", this.configSubject.pipe(G));
+    $(this, "configSubject", new q({}));
+    $(this, "pan$");
+    $(this, "panStart$");
+    $(this, "panMove$");
+    $(this, "panEnd$");
+    $(this, "pointerEvent$");
+    $(this, "pointerDown$");
+    $(this, "pointerUp$");
+    $(this, "pointerCancel$");
+    $(this, "pointerMove$");
+    $(this, "pointerOff$");
+    $(this, "state$");
+    $(this, "config$", this.configSubject.pipe(G));
     /**
      * Track active running failWith recognizers
      */
-    u(this, "failWithActive$");
+    $(this, "failWithActive$");
     const i = new q({
       fingers: 0
     });
     this.pointerEvent$ = this.config$.pipe(
       v(
-        ({ container: p, afterEventReceived: a }) => we({
+        ({ container: p, afterEventReceived: a }) => Ee({
           container: p,
           afterEventReceived: a
-        })
-      )
+        }).pointerEvents$
+      ),
+      P()
     ), this.pointerDown$ = this.pointerEvent$.pipe(
       c((p) => p.type === "pointerdown")
     ), this.pointerUp$ = this.pointerEvent$.pipe(
@@ -254,13 +262,13 @@ class F {
           const r = s.start$.pipe(h(() => !0)), l = s.end$.pipe(h(() => !1));
           return g(r, l).pipe(
             re(!1),
-            E(1)
+            M(1)
           );
         });
         return a != null && a.length ? j(a) : j([I(!1)]);
       }),
       h((p) => p.some((a) => a)),
-      E(1)
+      M(1)
     ), this.pan$ = this.configSubject.pipe(
       G,
       v((p) => {
@@ -270,19 +278,19 @@ class F {
             pointerEvent$: this.pointerEvent$,
             trackMove: !0
           }),
-          E(1)
-        ), $ = (f) => f.pipe(
+          M(1)
+        ), u = (f) => f.pipe(
           c(
-            (P) => P.pointers.length >= a
+            (E) => E.pointers.length >= a
           )
-        ), m = (f) => f.pipe(c((P) => P.pointers.length < a));
+        ), m = (f) => f.pipe(c((E) => E.pointers.length < a));
         return l.pipe(
-          $,
+          u,
           H(({ pointers: f }) => {
-            const P = l.pipe(
+            const E = l.pipe(
               m,
               R(),
-              w()
+              P()
             ), X = J(r), C = g(
               ...f.map((d) => I(d)),
               this.pointerDown$
@@ -308,11 +316,11 @@ class F {
                 event: d,
                 latestActivePointers: x
               })),
-              E({
+              M({
                 bufferSize: 1,
                 refCount: !1
               }),
-              T(P)
+              T(E)
             ), O = C.pipe(
               b(
                 () => l.pipe(
@@ -324,10 +332,10 @@ class F {
                   }))
                 )
               ),
-              T(P)
-            ), M = C.pipe(
+              T(E)
+            ), w = C.pipe(
               b(
-                () => P.pipe(
+                () => E.pipe(
                   h(({ event: d, pointers: x }) => ({
                     type: "end",
                     event: d,
@@ -335,8 +343,8 @@ class F {
                   }))
                 )
               )
-            ), L = g(C, O, M).pipe(
-              E(1)
+            ), L = g(C, O, w).pipe(
+              M(1)
             );
             return L.pipe(
               te,
@@ -354,7 +362,7 @@ class F {
           fingers: p.pointers.length
         });
       }),
-      w()
+      P()
     ), this.panStart$ = this.pan$.pipe(
       c((p) => p.type === "start"),
       h(({ type: p, ...a }) => a)
@@ -391,9 +399,9 @@ class Se extends F {
       ...e,
       posThreshold: ((a = e == null ? void 0 : e.options) == null ? void 0 : a.posThreshold) ?? 15
     });
-    u(this, "events$");
-    u(this, "start$");
-    u(this, "end$");
+    $(this, "events$");
+    $(this, "start$");
+    $(this, "end$");
     const i = this.panStart$.pipe(
       h((s) => ({
         type: "panStart",
@@ -402,13 +410,13 @@ class Se extends F {
       z(this.failWithActive$),
       c(([, s]) => !s),
       h(([s]) => s),
-      w()
+      P()
     ), o = this.panEnd$.pipe(
       h((s) => ({
         type: "panEnd",
         ...s
       })),
-      w()
+      P()
     ), p = this.panMove$.pipe(
       h((s) => ({
         type: "panMove",
@@ -418,15 +426,15 @@ class Se extends F {
     this.events$ = i.pipe(
       v((s) => {
         let r = s;
-        const l = I(s), $ = this.failWithActive$.pipe(
+        const l = I(s), u = this.failWithActive$.pipe(
           c((A) => A),
           R()
         ), m = g(l, p, o).pipe(
           K((A) => {
             r = A;
           }),
-          T($)
-        ), y = $.pipe(
+          T(u)
+        ), y = u.pipe(
           h(() => ({
             ...r,
             type: "panEnd"
@@ -435,7 +443,7 @@ class Se extends F {
         );
         return g(m, y);
       }),
-      w()
+      P()
     ), this.start$ = this.events$.pipe(
       c((s) => s.type === "panStart")
     ), this.end$ = this.events$.pipe(c((s) => s.type === "panEnd"));
@@ -444,7 +452,7 @@ class Se extends F {
     super.update(e, e.options);
   }
 }
-const Me = (t) => (n) => n.pipe(
+const we = (t) => (n) => n.pipe(
   c((e) => Math.abs(e.velocityX) >= t || Math.abs(e.velocityY) >= t)
 );
 class be extends F {
@@ -453,13 +461,13 @@ class be extends F {
       posThreshold: 0,
       numInputs: 1
     });
-    u(this, "events$");
+    $(this, "events$");
     this.events$ = this.config$.pipe(
       v((i) => {
         const { escapeVelocity: o = 0.9 } = i.options ?? {};
         return this.panStart$.pipe(
           v((p) => this.panEnd$.pipe(
-            Me(o),
+            we(o),
             h((a) => ({
               type: "swipe",
               angle: ge(
@@ -469,7 +477,7 @@ class be extends F {
               ...a
             }))
           )),
-          w()
+          P()
         );
       })
     );
@@ -478,7 +486,7 @@ class be extends F {
     super.update(e);
   }
 }
-const Ee = ({
+const Me = ({
   timeout: t,
   pointerEvent$: n
 }) => (e) => e.pipe(
@@ -507,7 +515,7 @@ const Ee = ({
 class Ce extends F {
   constructor(e) {
     super(e);
-    u(this, "events$");
+    $(this, "events$");
     this.events$ = this.config$.pipe(
       v((i) => {
         var y, A;
@@ -516,10 +524,10 @@ class Ce extends F {
             pointerEvent$: this.pointerEvent$,
             trackMove: !0
           }),
-          E(1)
+          M(1)
         ), l = r.pipe(
           c(({ pointers: D }) => D.length > 1)
-        ), $ = (D) => D.pipe(
+        ), u = (D) => D.pipe(
           he(this.pointerUp$.pipe(ce(p))),
           R()
         );
@@ -531,39 +539,39 @@ class Ce extends F {
             const f = g(
               I(D),
               this.pointerDown$
-            ).pipe(E(1)), P = f.pipe($), X = f.pipe(
+            ).pipe(M(1)), E = f.pipe(u), X = f.pipe(
               xe({
                 initialPointerEvent: D,
                 pointerEvent$: this.pointerEvent$,
                 tolerance: s
               })
             ), B = f.pipe(
-              Ee({
+              Me({
                 pointerEvent$: this.pointerEvent$,
                 timeout: a
               })
             ), C = g(
-              this.failWithActive$.pipe(c((M) => M)),
+              this.failWithActive$.pipe(c((w) => w)),
               this.pointerCancel$,
               l,
               X,
               B
-            ), O = P.pipe(
+            ), O = E.pipe(
               Ae,
-              c((M) => M.length <= o),
-              h((M) => ({
+              c((w) => w.length <= o),
+              h((w) => ({
                 type: "tap",
-                taps: M.length,
-                latestActivePointers: M,
-                event: M[0]
+                taps: w.length,
+                latestActivePointers: w,
+                event: w[0]
               })),
-              E(1)
+              M(1)
             );
             return O.pipe(
               te,
               z(O),
-              h(([M, { type: L, taps: d }]) => ({
-                ...M,
+              h(([w, { type: L, taps: d }]) => ({
+                ...w,
                 type: L,
                 taps: d
               })),
@@ -572,7 +580,7 @@ class Ce extends F {
           })
         );
       }),
-      w()
+      P()
     );
   }
   update(e) {
@@ -586,7 +594,7 @@ class Re extends F {
       posThreshold: 15,
       ...e.options
     });
-    u(this, "events$");
+    $(this, "events$");
     this.events$ = this.config$.pipe(
       v(() => {
         const i = this.panStart$.pipe(
@@ -596,7 +604,7 @@ class Re extends F {
             angle: 0,
             deltaAngle: 0
           })),
-          E(1)
+          M(1)
         ), o = i.pipe(
           v(
             () => this.pan$.pipe(
@@ -611,7 +619,7 @@ class Re extends F {
               }, void 0)
             )
           ),
-          w()
+          P()
         ), p = o.pipe(
           c((s) => s.type === "move"),
           h((s) => ({ ...s, type: "rotateMove" }))
@@ -621,7 +629,7 @@ class Re extends F {
         );
         return g(i, p, a);
       }),
-      w()
+      P()
     );
   }
   update(e) {
@@ -633,14 +641,14 @@ const Y = ({
   initialEvent: n
 }) => (e) => e.pipe(
   U((i, o) => {
-    const a = ((i == null ? void 0 : i.pointers.length) ?? 0) !== o.pointers.length, s = (i == null ? void 0 : i.pointersAverageDistance) ?? o.pointersAverageDistance, r = a ? o.pointersAverageDistance : i && "initialPointersAverageDistance" in i ? i.initialPointersAverageDistance : o.pointersAverageDistance, l = r === 0 ? 1 : o.pointersAverageDistance / r, $ = o.pointersAverageDistance - r, m = o.pointersAverageDistance - r, y = a || s === 0 ? 1 : o.pointersAverageDistance / s;
+    const a = ((i == null ? void 0 : i.pointers.length) ?? 0) !== o.pointers.length, s = (i == null ? void 0 : i.pointersAverageDistance) ?? o.pointersAverageDistance, r = a ? o.pointersAverageDistance : i && "initialPointersAverageDistance" in i ? i.initialPointersAverageDistance : o.pointersAverageDistance, l = r === 0 ? 1 : o.pointersAverageDistance / r, u = o.pointersAverageDistance - r, m = o.pointersAverageDistance - r, y = a || s === 0 ? 1 : o.pointersAverageDistance / s;
     return {
       ...i,
       ...o,
       type: t,
       initialPointersAverageDistance: r,
       scale: l,
-      distance: $,
+      distance: u,
       deltaDistance: m,
       deltaDistanceScale: y
     };
@@ -653,9 +661,9 @@ class ze extends F {
       ...e == null ? void 0 : e.options,
       numInputs: 2
     });
-    u(this, "events$");
-    u(this, "start$");
-    u(this, "end$");
+    $(this, "events$");
+    $(this, "start$");
+    $(this, "end$");
     this.events$ = this.config$.pipe(
       v(() => {
         const i = this.panStart$.pipe(
@@ -671,7 +679,7 @@ class ze extends F {
               })
             )
           ),
-          E(1)
+          M(1)
         ), o = this.failWithActive$.pipe(
           c((s) => s),
           R()
@@ -688,9 +696,9 @@ class ze extends F {
           v((s) => {
             let r = s;
             return this.pan$.pipe(
-              v((l) => l.type === "end" ? I(l) : (r = l, ue)),
+              v((l) => l.type === "end" ? I(l) : (r = l, $e)),
               T(o),
-              $e(null),
+              ue(null),
               h(
                 (l) => l || r
               ),
@@ -698,13 +706,13 @@ class ze extends F {
                 type: "pinchEnd",
                 initialEvent: r
               }),
-              w()
+              P()
             );
           })
         );
         return g(i, p, a);
       }),
-      w()
+      P()
     ), this.start$ = this.events$.pipe(
       c((i) => i.type === "pinchStart")
     ), this.end$ = this.events$.pipe(c((i) => i.type === "pinchEnd"));
@@ -715,12 +723,12 @@ class ze extends F {
 }
 class ke {
   constructor(n) {
-    u(this, "events$");
-    u(this, "recognizers");
-    u(this, "state$");
+    $(this, "events$");
+    $(this, "recognizers");
+    $(this, "state$");
     this.options = n, this.recognizers = n.recognizers, this.events$ = g(
       ...n.recognizers.map((e) => e.events$)
-    ).pipe(w()), this.state$ = j(
+    ).pipe(P()), this.state$ = j(
       this.recognizers.map((e) => e.state$)
     ).pipe(
       h(
@@ -730,9 +738,12 @@ class ke {
       )
     ), this.update(n);
   }
-  update(n) {
-    n.container && (n.container.style.touchAction = "none", n.container.style.userSelect = "none"), this.options.recognizers.forEach((e) => {
-      e.update(n);
+  update({
+    disableTextSelection: n,
+    ...e
+  }) {
+    e.container && (e.container.style.touchAction = "none", n && (e.container.style.userSelect = "none")), this.options.recognizers.forEach((i) => {
+      i.update(e);
     });
   }
 }