Add smooth scroll globally

src/components/SmoothScroll.svelte

@@ -0,0 +1,36 @@
+<script lang="ts">
+    import { browser } from '$app/env'
+    import { onMount } from 'svelte'
+    import Lenis from '@studio-freight/lenis'
+    import { smoothScroll } from '$utils/stores'
+
+    let smoothScrollRAF = 0
+
+
+    // Setup smooth scroll
+    if (browser) {
+        $smoothScroll = new Lenis({
+            lerp: 0.1,
+            smooth: true,
+            direction: 'vertical',
+        })
+    }
+
+    // Lenis RAF
+    const update = () => {
+        $smoothScroll.raf()
+        smoothScrollRAF = requestAnimationFrame(update)
+    }
+
+
+    onMount(() => {
+        // Enable smooth scroll
+        requestAnimationFrame(update)
+
+        // Destroy
+        return () => {
+            cancelAnimationFrame(smoothScrollRAF)
+            $smoothScroll.destroy()
+        }
+    })
+</script>

src/routes/__layout.svelte

@@ -10,6 +10,7 @@
     import '$utils/polyfills'
     // Components
     import SVGSprite from '$components/SVGSprite.svelte'
+    import SmoothScroll from '$components/SmoothScroll.svelte'
     import Analytics from '$components/Analytics.svelte'
     import Switcher from '$components/molecules/Switcher.svelte'
     import Footer from '$components/organisms/Footer.svelte'
@@ -80,6 +81,7 @@
 {/if}
 
 <SVGSprite />
+<SmoothScroll />
 
 {#if browser}
     <Analytics

src/utils/stores/index.ts

@@ -1,4 +1,5 @@
 import { writable, type Writable } from 'svelte/store'
 
 export const pageLoading: Writable<boolean> = writable(false)
-export const previousPage: Writable<string> = writable('')
+export const previousPage: Writable<string> = writable('')
+export const smoothScroll: Writable<any> = writable(null)