lenis 1.1.13 → 1.1.14-dev.1

package/README.md

@@ -56,18 +56,22 @@ using scripts:
 ### Basic:
 
 ```js
-const lenis = new Lenis()
+// Initialize Lenis
+const lenis = new Lenis();
 
+// Listen for the scroll event and log the event data
 lenis.on('scroll', (e) => {
-  console.log(e)
-})
+  console.log(e);
+});
 
+// Use requestAnimationFrame to continuously update the scroll
 function raf(time) {
-  lenis.raf(time)
-  requestAnimationFrame(raf)
+  lenis.raf(time);
+  requestAnimationFrame(raf);
 }
 
-requestAnimationFrame(raf)
+requestAnimationFrame(raf);
+
 ```
 
 #### Recommended CSS:
@@ -108,19 +112,26 @@ import 'lenis/dist/lenis.css'
 
 ### GSAP ScrollTrigger:
 ```js
-const lenis = new Lenis()
+// Initialize a new Lenis instance for smooth scrolling
+const lenis = new Lenis();
 
+// Listen for the 'scroll' event and log the event data to the console
 lenis.on('scroll', (e) => {
-  console.log(e)
-})
+  console.log(e);
+});
 
-lenis.on('scroll', ScrollTrigger.update)
+// Synchronize Lenis scrolling with GSAP's ScrollTrigger plugin
+lenis.on('scroll', ScrollTrigger.update);
 
-gsap.ticker.add((time)=>{
-  lenis.raf(time * 1000)
-})
+// Add Lenis's requestAnimationFrame (raf) method to GSAP's ticker
+// This ensures Lenis's smooth scroll animation updates on each GSAP tick
+gsap.ticker.add((time) => {
+  lenis.raf(time * 1000); // Convert time from seconds to milliseconds
+});
+
+// Disable lag smoothing in GSAP to prevent any delay in scroll animations
+gsap.ticker.lagSmoothing(0);
 
-gsap.ticker.lagSmoothing(0)
 ```
 
 ### React:
@@ -147,7 +158,7 @@ See documentation for [lenis/react](https://github.com/darkroomengineering/lenis
 | `gestureOrientation`     | `string`              | `vertical`                                         | The orientation of the gestures. Can be `vertical`, `horizontal` or `both`                                                                                                                                                                                                       |
 | `syncTouch`              | `boolean`             | `false`                                            | Mimic touch device scroll while allowing scroll sync (can be unstable on iOS<16)                                                                                                                                                                                                 |
 | `syncTouchLerp`          | `number`              | `0.075`                                            | Lerp applied during `syncTouch` inertia                                                                                                                                                                                                                                          |
-| `touchInertiaMultiplier` | `number`              | `35`                                               | Manage the the strength of `syncTouch` inertia                                                                                                                                                                                                                                   |
+| `touchInertiaMultiplier` | `number`              | `35`                                               | Manage the strength of syncTouch inertia                                                                                                                                                                                                                                   |
 | `wheelMultiplier`        | `number`              | `1`                                                | The multiplier to use for mouse wheel events                                                                                                                                                                                                                                     |
 | `touchMultiplier`        | `number`              | `1`                                                | The multiplier to use for touch events                                                                                                                                                                                                                                           |
 | `infinite`               | `boolean`             | `false`                                            | Enable infinite scrolling! `syncTouch: true` is required on touch devices. ([See example](https://codepen.io/ClementRoche/pen/OJqBLod))                                                                                                                                          |
@@ -317,6 +328,8 @@ This set of hooks is curated and maintained by the darkroom.engineering team:
 - Clément Roche ([@clementroche\_](https://twitter.com/clementroche_)) – [darkroom.engineering](https://darkroom.engineering)
 - Guido Fier ([@uido15](https://twitter.com/uido15)) – [darkroom.engineering](https://darkroom.engineering)
 - Leandro Soengas ([@lsoengas](https://twitter.com/lsoengas)) - [darkroom.engineering](https://darkroom.engineering)
+- Fermin Fernandez ([@Fermin_FerBridd](https://twitter.com/Fermin_FerBridd)) - [darkroom.engineering](https://darkroom.engineering)
+- Felix Mayr ([@feledori](https://twitter.com/feledori)) - [darkroom.engineering](https://darkroom.engineering)
 - Franco Arza ([@arzafran](https://twitter.com/arzafran)) - [darkroom.engineering](https://darkroom.engineering)
 
 <br/>

package/dist/lenis-react.d.ts

@@ -1,10 +1,10 @@
-/// <reference types="react" />
 import * as react from 'react';
 import { ReactNode, ComponentPropsWithoutRef } from 'react';
-import Lenis, { ScrollCallback, LenisOptions } from 'lenis';
+import * as Lenis from 'lenis';
+import Lenis__default, { ScrollCallback, LenisOptions } from 'lenis';
 
 type LenisContextValue = {
-    lenis: Lenis;
+    lenis: Lenis__default;
     addCallback: (callback: ScrollCallback, priority: number) => void;
     removeCallback: (callback: ScrollCallback) => void;
 };
@@ -61,10 +61,14 @@ type LenisRef = {
     /**
      * The lenis instance
      */
-    lenis?: Lenis;
+    lenis?: Lenis__default;
 };
 
-declare const LenisContext: react.Context<LenisContextValue | null>;
+/**
+ * React component to setup a Lenis instance
+ */
+declare const ReactLenis: react.ForwardRefExoticComponent<LenisProps & react.RefAttributes<LenisRef>>;
+
 /**
  * Hook to access the Lenis instance and its methods
  *
@@ -105,10 +109,6 @@ declare const LenisContext: react.Context<LenisContextValue | null>;
  *            })
  *          }
  */
-declare function useLenis(callback?: ScrollCallback, deps?: any[], priority?: number): Lenis | undefined;
-/**
- * React component to setup a Lenis instance
- */
-declare const ReactLenis: react.ForwardRefExoticComponent<LenisProps & react.RefAttributes<LenisRef>>;
+declare function useLenis(callback?: ScrollCallback, deps?: any[], priority?: number): Lenis.default | undefined;
 
-export { ReactLenis as Lenis, LenisContext, type LenisContextValue, type LenisProps, type LenisRef, ReactLenis, ReactLenis as default, useLenis };
+export { ReactLenis as Lenis, type LenisContextValue, type LenisProps, type LenisRef, ReactLenis, ReactLenis as default, useLenis };

package/dist/lenis-react.mjs

@@ -1,2 +1,159 @@
-import{jsx as r}from"react/jsx-runtime";import e from"@darkroom.engineering/tempus";import t from"lenis";import{useState as s,useEffect as n,createContext as i,forwardRef as l,useRef as o,useImperativeHandle as c,useCallback as a,useContext as u}from"react";const f=i(null),d=new class Store{constructor(r){this.state=r,this.listeners=[]}set(r){this.state=r;for(let r of this.listeners)r(this.state)}subscribe(r){return this.listeners=[...this.listeners,r],()=>{this.listeners=this.listeners.filter((e=>e!==r))}}get(){return this.state}}(null),p={};function useLenis(r,e=[],t=0){var i;const l=u(f),o=function useStore(r){const[e,t]=s(r.get());return n((()=>r.subscribe((r=>t(r)))),[r]),e}(d),c=null!==(i=null!=l?l:o)&&void 0!==i?i:p,{lenis:a,addCallback:b,removeCallback:h}=c;return n((()=>{if(r&&b&&h&&a)return b(r,t),r(a),()=>{h(r)}}),[a,b,h,t,...e]),a}const b=l((({children:i,root:l=!1,options:u={},autoRaf:p=!0,rafPriority:b=0,className:h,props:m},v)=>{const k=o(null),g=o(null),[y,C]=s(void 0);c(v,(()=>({wrapper:k.current,content:g.current,lenis:y})),[y]),n((()=>{const r=new t(Object.assign(Object.assign({},u),!l&&{wrapper:k.current,content:g.current}));return C(r),()=>{r.destroy(),C(void 0)}}),[l,JSON.stringify(u)]),n((()=>{if(y&&p)return e.add((r=>y.raf(r)),b)}),[y,p,b]);const j=o([]),w=a(((r,e)=>{j.current.push({callback:r,priority:e}),j.current.sort(((r,e)=>r.priority-e.priority))}),[]),O=a((r=>{j.current=j.current.filter((e=>e.callback!==r))}),[]);return n((()=>{if(l&&y)return d.set({lenis:y,addCallback:w,removeCallback:O}),()=>d.set(null)}),[l,y,w,O]),n((()=>{if(!y)return;const onScroll=r=>{for(let e=0;e<j.current.length;e++)j.current[e].callback(r)};return y.on("scroll",onScroll),()=>{y.off("scroll",onScroll)}}),[y]),r(f.Provider,{value:{lenis:y,addCallback:w,removeCallback:O},children:l?i:r("div",Object.assign({ref:k,className:h},m,{children:r("div",{ref:g,children:i})}))})}));export{b as Lenis,f as LenisContext,b as ReactLenis,b as default,useLenis};
-//# sourceMappingURL=lenis-react.mjs.map
+"use client";
+
+// packages/react/src/provider.tsx
+import Tempus from "@darkroom.engineering/tempus";
+import Lenis from "lenis";
+import {
+  createContext,
+  forwardRef,
+  useCallback,
+  useEffect as useEffect2,
+  useImperativeHandle,
+  useRef,
+  useState as useState2
+} from "react";
+
+// packages/react/src/store.ts
+import { useEffect, useState } from "react";
+var Store = class {
+  constructor(state) {
+    this.state = state;
+  }
+  listeners = [];
+  set(state) {
+    this.state = state;
+    for (let listener of this.listeners) {
+      listener(this.state);
+    }
+  }
+  subscribe(listener) {
+    this.listeners = [...this.listeners, listener];
+    return () => {
+      this.listeners = this.listeners.filter((l) => l !== listener);
+    };
+  }
+  get() {
+    return this.state;
+  }
+};
+function useStore(store) {
+  const [state, setState] = useState(store.get());
+  useEffect(() => {
+    return store.subscribe((state2) => setState(state2));
+  }, [store]);
+  return state;
+}
+
+// packages/react/src/provider.tsx
+import { jsx } from "react/jsx-runtime";
+var LenisContext = createContext(null);
+var rootLenisContextStore = new Store(null);
+var ReactLenis = forwardRef(
+  ({
+    children,
+    root = false,
+    options = {},
+    autoRaf = true,
+    rafPriority = 0,
+    className,
+    props
+  }, ref) => {
+    const wrapperRef = useRef(null);
+    const contentRef = useRef(null);
+    const [lenis, setLenis] = useState2(void 0);
+    useImperativeHandle(
+      ref,
+      () => ({
+        wrapper: wrapperRef.current,
+        content: contentRef.current,
+        lenis
+      }),
+      [lenis]
+    );
+    useEffect2(() => {
+      const lenis2 = new Lenis({
+        ...options,
+        ...!root && {
+          wrapper: wrapperRef.current,
+          content: contentRef.current
+        }
+      });
+      setLenis(lenis2);
+      return () => {
+        lenis2.destroy();
+        setLenis(void 0);
+      };
+    }, [root, JSON.stringify(options)]);
+    useEffect2(() => {
+      if (!lenis || !autoRaf) return;
+      return Tempus.add((time) => lenis.raf(time), rafPriority);
+    }, [lenis, autoRaf, rafPriority]);
+    const callbacksRefs = useRef([]);
+    const addCallback = useCallback(
+      (callback, priority) => {
+        callbacksRefs.current.push({ callback, priority });
+        callbacksRefs.current.sort((a, b) => a.priority - b.priority);
+      },
+      []
+    );
+    const removeCallback = useCallback(
+      (callback) => {
+        callbacksRefs.current = callbacksRefs.current.filter(
+          (cb) => cb.callback !== callback
+        );
+      },
+      []
+    );
+    useEffect2(() => {
+      if (root && lenis) {
+        rootLenisContextStore.set({ lenis, addCallback, removeCallback });
+        return () => rootLenisContextStore.set(null);
+      }
+    }, [root, lenis, addCallback, removeCallback]);
+    useEffect2(() => {
+      if (!lenis) return;
+      const onScroll = (data) => {
+        for (let i = 0; i < callbacksRefs.current.length; i++) {
+          callbacksRefs.current[i]?.callback(data);
+        }
+      };
+      lenis.on("scroll", onScroll);
+      return () => {
+        lenis.off("scroll", onScroll);
+      };
+    }, [lenis]);
+    return /* @__PURE__ */ jsx(
+      LenisContext.Provider,
+      {
+        value: { lenis, addCallback, removeCallback },
+        children: root ? children : /* @__PURE__ */ jsx("div", { ref: wrapperRef, className, ...props, children: /* @__PURE__ */ jsx("div", { ref: contentRef, children }) })
+      }
+    );
+  }
+);
+
+// packages/react/src/use-lenis.ts
+import { useContext, useEffect as useEffect3 } from "react";
+var fallbackContext = {};
+function useLenis(callback, deps = [], priority = 0) {
+  const localContext = useContext(LenisContext);
+  const rootContext = useStore(rootLenisContextStore);
+  const currentContext = localContext ?? rootContext ?? fallbackContext;
+  const { lenis, addCallback, removeCallback } = currentContext;
+  useEffect3(() => {
+    if (!callback || !addCallback || !removeCallback || !lenis) return;
+    addCallback(callback, priority);
+    callback(lenis);
+    return () => {
+      removeCallback(callback);
+    };
+  }, [lenis, addCallback, removeCallback, priority, ...deps]);
+  return lenis;
+}
+export {
+  ReactLenis as Lenis,
+  ReactLenis,
+  ReactLenis as default,
+  useLenis
+};
+//# sourceMappingURL=lenis-react.mjs.map

package/dist/lenis-react.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lenis-react.mjs","sources":["../../src/index.tsx","../../src/store.ts"],"sourcesContent":["'use client'\r\n\r\nimport Tempus from '@darkroom.engineering/tempus'\r\nimport Lenis, { type ScrollCallback } from 'lenis'\r\nimport {\r\n  createContext,\r\n  forwardRef,\r\n  useCallback,\r\n  useContext,\r\n  useEffect,\r\n  useImperativeHandle,\r\n  useRef,\r\n  useState,\r\n} from 'react'\r\nimport { Store, useStore } from './store'\r\nimport type { LenisContextValue, LenisProps, LenisRef } from './types'\r\n\r\nexport const LenisContext = createContext<LenisContextValue | null>(null)\r\n\r\nconst rootLenisContextStore = new Store<LenisContextValue | null>(null)\r\n\r\n// Fall back to an empty object if both context and store are not available\r\nconst fallbackContext: Partial<LenisContextValue> = {}\r\n\r\n/**\r\n * Hook to access the Lenis instance and its methods\r\n *\r\n * @example <caption>Scroll callback</caption>\r\n *          useLenis((lenis) => {\r\n *            if (lenis.isScrolling) {\r\n *              console.log('Scrolling...')\r\n *            }\r\n *\r\n *            if (lenis.progress === 1) {\r\n *              console.log('At the end!')\r\n *            }\r\n *          })\r\n *\r\n * @example <caption>Scroll callback with dependencies</caption>\r\n *          useLenis((lenis) => {\r\n *            if (lenis.isScrolling) {\r\n *              console.log('Scrolling...', someDependency)\r\n *            }\r\n *          }, [someDependency])\r\n * @example <caption>Scroll callback with priority</caption>\r\n *          useLenis((lenis) => {\r\n *            if (lenis.isScrolling) {\r\n *              console.log('Scrolling...')\r\n *            }\r\n *          }, [], 1)\r\n * @example <caption>Instance access</caption>\r\n *          const lenis = useLenis()\r\n *\r\n *          handleClick() {\r\n *            lenis.scrollTo(100, {\r\n *              lerp: 0.1,\r\n *              duration: 1,\r\n *              easing: (t) => t,\r\n *              onComplete: () => {\r\n *                console.log('Complete!')\r\n *              }\r\n *            })\r\n *          }\r\n */\r\nexport function useLenis(\r\n  callback?: ScrollCallback,\r\n  deps: any[] = [],\r\n  priority = 0\r\n) {\r\n  // Try to get the lenis instance from the context first\r\n  const localContext = useContext(LenisContext)\r\n  // Fall back to the root store if the context is not available\r\n  const rootContext = useStore(rootLenisContextStore)\r\n  // Fall back to the fallback context if all else fails\r\n  const currentContext = localContext ?? rootContext ?? fallbackContext\r\n\r\n  const { lenis, addCallback, removeCallback } = currentContext\r\n\r\n  useEffect(() => {\r\n    if (!callback || !addCallback || !removeCallback || !lenis) return\r\n\r\n    addCallback(callback, priority)\r\n    callback(lenis)\r\n\r\n    return () => {\r\n      removeCallback(callback)\r\n    }\r\n  }, [lenis, addCallback, removeCallback, priority, ...deps])\r\n\r\n  return lenis\r\n}\r\n\r\n/**\r\n * React component to setup a Lenis instance\r\n */\r\nconst ReactLenis = forwardRef<LenisRef, LenisProps>(\r\n  (\r\n    {\r\n      children,\r\n      root = false,\r\n      options = {},\r\n      autoRaf = true,\r\n      rafPriority = 0,\r\n      className,\r\n      props,\r\n    }: LenisProps,\r\n    ref\r\n  ) => {\r\n    const wrapperRef = useRef<HTMLDivElement | null>(null)\r\n    const contentRef = useRef<HTMLDivElement | null>(null)\r\n\r\n    const [lenis, setLenis] = useState<Lenis | undefined>(undefined)\r\n\r\n    // Setup ref\r\n    useImperativeHandle(\r\n      ref,\r\n      () => ({\r\n        wrapper: wrapperRef.current,\r\n        content: contentRef.current,\r\n        lenis,\r\n      }),\r\n      [lenis]\r\n    )\r\n\r\n    // Setup lenis instance\r\n    useEffect(() => {\r\n      const lenis = new Lenis({\r\n        ...options,\r\n        ...(!root && {\r\n          wrapper: wrapperRef.current!,\r\n          content: contentRef.current!,\r\n        }),\r\n      })\r\n\r\n      setLenis(lenis)\r\n\r\n      return () => {\r\n        lenis.destroy()\r\n        setLenis(undefined)\r\n      }\r\n    }, [root, JSON.stringify(options)])\r\n\r\n    // Setup raf\r\n    useEffect(() => {\r\n      if (!lenis || !autoRaf) return\r\n\r\n      return Tempus.add((time: number) => lenis.raf(time), rafPriority)\r\n    }, [lenis, autoRaf, rafPriority])\r\n\r\n    // Handle callbacks\r\n    const callbacksRefs = useRef<\r\n      {\r\n        callback: ScrollCallback\r\n        priority: number\r\n      }[]\r\n    >([])\r\n\r\n    const addCallback: LenisContextValue['addCallback'] = useCallback(\r\n      (callback, priority) => {\r\n        callbacksRefs.current.push({ callback, priority })\r\n        callbacksRefs.current.sort((a, b) => a.priority - b.priority)\r\n      },\r\n      []\r\n    )\r\n\r\n    const removeCallback: LenisContextValue['removeCallback'] = useCallback(\r\n      (callback) => {\r\n        callbacksRefs.current = callbacksRefs.current.filter(\r\n          (cb) => cb.callback !== callback\r\n        )\r\n      },\r\n      []\r\n    )\r\n\r\n    // This makes sure to set the global context if the root is true\r\n    useEffect(() => {\r\n      if (root && lenis) {\r\n        rootLenisContextStore.set({ lenis, addCallback, removeCallback })\r\n\r\n        return () => rootLenisContextStore.set(null)\r\n      }\r\n    }, [root, lenis, addCallback, removeCallback])\r\n\r\n    // Setup callback listeners\r\n    useEffect(() => {\r\n      if (!lenis) return\r\n\r\n      const onScroll: ScrollCallback = (data) => {\r\n        for (let i = 0; i < callbacksRefs.current.length; i++) {\r\n          callbacksRefs.current[i].callback(data)\r\n        }\r\n      }\r\n\r\n      lenis.on('scroll', onScroll)\r\n\r\n      return () => {\r\n        lenis.off('scroll', onScroll)\r\n      }\r\n    }, [lenis])\r\n\r\n    return (\r\n      <LenisContext.Provider\r\n        value={{ lenis: lenis!, addCallback, removeCallback }}\r\n      >\r\n        {root ? (\r\n          children\r\n        ) : (\r\n          <div ref={wrapperRef} className={className} {...props}>\r\n            <div ref={contentRef}>{children}</div>\r\n          </div>\r\n        )}\r\n      </LenisContext.Provider>\r\n    )\r\n  }\r\n)\r\n\r\nexport * from './types'\r\nexport { ReactLenis as Lenis, ReactLenis }\r\nexport default ReactLenis\r\n","import { useEffect, useState } from 'react'\r\n\r\ntype Listener<S> = (state: S) => void\r\n\r\nexport class Store<S> {\r\n  private listeners: Listener<S>[] = []\r\n\r\n  constructor(private state: S) {}\r\n\r\n  set(state: S) {\r\n    this.state = state\r\n\r\n    for (let listener of this.listeners) {\r\n      listener(this.state)\r\n    }\r\n  }\r\n\r\n  subscribe(listener: Listener<S>) {\r\n    this.listeners = [...this.listeners, listener]\r\n    return () => {\r\n      this.listeners = this.listeners.filter((l) => l !== listener)\r\n    }\r\n  }\r\n\r\n  get() {\r\n    return this.state\r\n  }\r\n}\r\n\r\nexport function useStore<S>(store: Store<S>) {\r\n  const [state, setState] = useState(store.get())\r\n\r\n  useEffect(() => {\r\n    return store.subscribe((state) => setState(state))\r\n  }, [store])\r\n\r\n  return state\r\n}\r\n"],"names":["LenisContext","createContext","rootLenisContextStore","Store","constructor","state","this","listeners","set","listener","subscribe","filter","l","get","fallbackContext","useLenis","callback","deps","priority","localContext","useContext","rootContext","useStore","store","setState","useState","useEffect","currentContext","_a","lenis","addCallback","removeCallback","ReactLenis","forwardRef","children","root","options","autoRaf","rafPriority","className","props","ref","wrapperRef","useRef","contentRef","setLenis","undefined","useImperativeHandle","wrapper","current","content","Lenis","Object","assign","destroy","JSON","stringify","Tempus","add","time","raf","callbacksRefs","useCallback","push","sort","a","b","cb","onScroll","data","i","length","on","off","_jsx","Provider","value"],"mappings":"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"}
+{"version":3,"sources":["../packages/react/src/provider.tsx","../packages/react/src/store.ts","../packages/react/src/use-lenis.ts"],"sourcesContent":["import Tempus from '@darkroom.engineering/tempus'\r\nimport Lenis, { type ScrollCallback } from 'lenis'\r\nimport {\r\n  createContext,\r\n  forwardRef,\r\n  useCallback,\r\n  useEffect,\r\n  useImperativeHandle,\r\n  useRef,\r\n  useState,\r\n} from 'react'\r\nimport { Store } from './store'\r\nimport type { LenisContextValue, LenisProps, LenisRef } from './types'\r\n\r\nexport const LenisContext = createContext<LenisContextValue | null>(null)\r\n\r\n/**\r\n * The root store for the lenis context\r\n *\r\n * This store serves as a fallback for the context if it is not available\r\n * and allows us to use the global lenis instance above a provider\r\n */\r\nexport const rootLenisContextStore = new Store<LenisContextValue | null>(null)\r\n\r\n/**\r\n * React component to setup a Lenis instance\r\n */\r\nexport const ReactLenis = forwardRef<LenisRef, LenisProps>(\r\n  (\r\n    {\r\n      children,\r\n      root = false,\r\n      options = {},\r\n      autoRaf = true,\r\n      rafPriority = 0,\r\n      className,\r\n      props,\r\n    }: LenisProps,\r\n    ref\r\n  ) => {\r\n    const wrapperRef = useRef<HTMLDivElement | null>(null)\r\n    const contentRef = useRef<HTMLDivElement | null>(null)\r\n\r\n    const [lenis, setLenis] = useState<Lenis | undefined>(undefined)\r\n\r\n    // Setup ref\r\n    useImperativeHandle(\r\n      ref,\r\n      () => ({\r\n        wrapper: wrapperRef.current,\r\n        content: contentRef.current,\r\n        lenis,\r\n      }),\r\n      [lenis]\r\n    )\r\n\r\n    // Setup lenis instance\r\n    useEffect(() => {\r\n      const lenis = new Lenis({\r\n        ...options,\r\n        ...(!root && {\r\n          wrapper: wrapperRef.current!,\r\n          content: contentRef.current!,\r\n        }),\r\n      })\r\n\r\n      setLenis(lenis)\r\n\r\n      return () => {\r\n        lenis.destroy()\r\n        setLenis(undefined)\r\n      }\r\n    }, [root, JSON.stringify(options)])\r\n\r\n    // Setup raf\r\n    useEffect(() => {\r\n      if (!lenis || !autoRaf) return\r\n\r\n      return Tempus.add((time: number) => lenis.raf(time), rafPriority)\r\n    }, [lenis, autoRaf, rafPriority])\r\n\r\n    // Handle callbacks\r\n    const callbacksRefs = useRef<\r\n      {\r\n        callback: ScrollCallback\r\n        priority: number\r\n      }[]\r\n    >([])\r\n\r\n    const addCallback: LenisContextValue['addCallback'] = useCallback(\r\n      (callback, priority) => {\r\n        callbacksRefs.current.push({ callback, priority })\r\n        callbacksRefs.current.sort((a, b) => a.priority - b.priority)\r\n      },\r\n      []\r\n    )\r\n\r\n    const removeCallback: LenisContextValue['removeCallback'] = useCallback(\r\n      (callback) => {\r\n        callbacksRefs.current = callbacksRefs.current.filter(\r\n          (cb) => cb.callback !== callback\r\n        )\r\n      },\r\n      []\r\n    )\r\n\r\n    // This makes sure to set the global context if the root is true\r\n    useEffect(() => {\r\n      if (root && lenis) {\r\n        rootLenisContextStore.set({ lenis, addCallback, removeCallback })\r\n\r\n        return () => rootLenisContextStore.set(null)\r\n      }\r\n    }, [root, lenis, addCallback, removeCallback])\r\n\r\n    // Setup callback listeners\r\n    useEffect(() => {\r\n      if (!lenis) return\r\n\r\n      const onScroll: ScrollCallback = (data) => {\r\n        for (let i = 0; i < callbacksRefs.current.length; i++) {\r\n          callbacksRefs.current[i]?.callback(data)\r\n        }\r\n      }\r\n\r\n      lenis.on('scroll', onScroll)\r\n\r\n      return () => {\r\n        lenis.off('scroll', onScroll)\r\n      }\r\n    }, [lenis])\r\n\r\n    return (\r\n      <LenisContext.Provider\r\n        value={{ lenis: lenis!, addCallback, removeCallback }}\r\n      >\r\n        {root ? (\r\n          children\r\n        ) : (\r\n          <div ref={wrapperRef} className={className} {...props}>\r\n            <div ref={contentRef}>{children}</div>\r\n          </div>\r\n        )}\r\n      </LenisContext.Provider>\r\n    )\r\n  }\r\n)\r\n","import { useEffect, useState } from 'react'\r\n\r\ntype Listener<S> = (state: S) => void\r\n\r\nexport class Store<S> {\r\n  private listeners: Listener<S>[] = []\r\n\r\n  constructor(private state: S) {}\r\n\r\n  set(state: S) {\r\n    this.state = state\r\n\r\n    for (let listener of this.listeners) {\r\n      listener(this.state)\r\n    }\r\n  }\r\n\r\n  subscribe(listener: Listener<S>) {\r\n    this.listeners = [...this.listeners, listener]\r\n    return () => {\r\n      this.listeners = this.listeners.filter((l) => l !== listener)\r\n    }\r\n  }\r\n\r\n  get() {\r\n    return this.state\r\n  }\r\n}\r\n\r\nexport function useStore<S>(store: Store<S>) {\r\n  const [state, setState] = useState(store.get())\r\n\r\n  useEffect(() => {\r\n    return store.subscribe((state) => setState(state))\r\n  }, [store])\r\n\r\n  return state\r\n}\r\n","import type { ScrollCallback } from 'lenis'\r\nimport { useContext, useEffect } from 'react'\r\nimport { LenisContext, rootLenisContextStore } from './provider'\r\nimport { useStore } from './store'\r\nimport type { LenisContextValue } from './types'\r\n\r\n// Fall back to an empty object if both context and store are not available\r\nconst fallbackContext: Partial<LenisContextValue> = {}\r\n\r\n/**\r\n * Hook to access the Lenis instance and its methods\r\n *\r\n * @example <caption>Scroll callback</caption>\r\n *          useLenis((lenis) => {\r\n *            if (lenis.isScrolling) {\r\n *              console.log('Scrolling...')\r\n *            }\r\n *\r\n *            if (lenis.progress === 1) {\r\n *              console.log('At the end!')\r\n *            }\r\n *          })\r\n *\r\n * @example <caption>Scroll callback with dependencies</caption>\r\n *          useLenis((lenis) => {\r\n *            if (lenis.isScrolling) {\r\n *              console.log('Scrolling...', someDependency)\r\n *            }\r\n *          }, [someDependency])\r\n * @example <caption>Scroll callback with priority</caption>\r\n *          useLenis((lenis) => {\r\n *            if (lenis.isScrolling) {\r\n *              console.log('Scrolling...')\r\n *            }\r\n *          }, [], 1)\r\n * @example <caption>Instance access</caption>\r\n *          const lenis = useLenis()\r\n *\r\n *          handleClick() {\r\n *            lenis.scrollTo(100, {\r\n *              lerp: 0.1,\r\n *              duration: 1,\r\n *              easing: (t) => t,\r\n *              onComplete: () => {\r\n *                console.log('Complete!')\r\n *              }\r\n *            })\r\n *          }\r\n */\r\nexport function useLenis(\r\n  callback?: ScrollCallback,\r\n  deps: any[] = [],\r\n  priority = 0\r\n) {\r\n  // Try to get the lenis instance from the context first\r\n  const localContext = useContext(LenisContext)\r\n  // Fall back to the root store if the context is not available\r\n  const rootContext = useStore(rootLenisContextStore)\r\n  // Fall back to the fallback context if all else fails\r\n  const currentContext = localContext ?? rootContext ?? fallbackContext\r\n\r\n  const { lenis, addCallback, removeCallback } = currentContext\r\n\r\n  useEffect(() => {\r\n    if (!callback || !addCallback || !removeCallback || !lenis) return\r\n\r\n    addCallback(callback, priority)\r\n    callback(lenis)\r\n\r\n    return () => {\r\n      removeCallback(callback)\r\n    }\r\n  }, [lenis, addCallback, removeCallback, priority, ...deps])\r\n\r\n  return lenis\r\n}\r\n"],"mappings":"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","names":["useEffect","useState","state","useState","useEffect","lenis","useEffect","useEffect"]}