From 1f3032a54785441bd74fced9af5a4abc62a19315 Mon Sep 17 00:00:00 2001
From: Valmisson Grizorte <missongrizorte@gmail.com>
Date: Sat, 21 Oct 2023 16:19:04 -0300
Subject: [PATCH] feat: add flag passive as a global option (#13)

---
 README.md               | 1 +
 src/actions/ScrollTo.ts | 8 ++++----
 src/store/index.ts      | 1 +
 src/types/options.ts    | 1 +
 4 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index d01ac23..98703c3 100644
--- a/README.md
+++ b/README.md
@@ -75,6 +75,7 @@ Scroll to a position on the page
 | `duration` | `500` | Duration (in milliseconds) of the animation. |
 | `offset` | `0` | Offset that should be applied when scrolling. |
 | `easing` | `cubicInOut` | Easing function to be used when animating. Use any easing from [`svelte/easing`][svelte-easing] or a custom easing function. |
+| `passive` | `true` | A boolean value that, if true, indicates that the function specified by listener will never call preventDefault(). |
 | `onStart` | `noop` | A callback function that should be called when scrolling has started. Receives the element, offset, duration and endPosition as a parameter. |
 | `onDone` | `noop` | A callback function that should be called when scrolling has started. Receives the element, offset, duration and endPosition as a parameter. |
 
diff --git a/src/actions/ScrollTo.ts b/src/actions/ScrollTo.ts
index 3ffe640..c2af5f7 100644
--- a/src/actions/ScrollTo.ts
+++ b/src/actions/ScrollTo.ts
@@ -9,7 +9,7 @@ const elementsList = get(elements)
 
 // handle with scrolling
 const handle = async (event: Event, options: ScrollToOptions): Promise<void> => {
-  event.preventDefault()
+  if (!options.passive) event.preventDefault()
 
   const { ref, onDone, onStart } = options
 
@@ -70,10 +70,10 @@ const scrollTo = ( // eslint-disable-line @typescript-eslint/explicit-module-bou
     node.style.cursor = 'pointer'
   }
 
-  const _handler = (event) => handle(event, opts)
+  const _handler = (event: MouseEvent | TouchEvent) => handle(event, opts)
 
-  node.addEventListener('click', _handler)
-  node.addEventListener('touchstart', _handler)
+  node.addEventListener('click', _handler, { passive: opts.passive })
+  node.addEventListener('touchstart', _handler, { passive: opts.passive })
 
   return {
     destroy () {
diff --git a/src/store/index.ts b/src/store/index.ts
index fe713cf..8333f17 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -7,6 +7,7 @@ export const elements = writable<Array<ElementReference>>([])
 export const globalOptions = writable<GlobalOptions>({
   offset: 0,
   duration: 500,
+  passive: true,
   easing: cubicInOut,
   onStart: () => { },
   onDone: () => { }
diff --git a/src/types/options.ts b/src/types/options.ts
index 2084d0d..6f738e5 100644
--- a/src/types/options.ts
+++ b/src/types/options.ts
@@ -8,6 +8,7 @@ export interface HooksOptions {
 export interface GlobalOptions {
   offset: number
   duration: number
+  passive?: boolean
   easing: (t: number) => number
   onStart?: (options: HooksOptions) => void
   onDone?: (options: HooksOptions) => void