Note
Please go to darkroomengineering/lenis for official documentation. This repository only documents patches made for some specific features that I think would help while developing with it.
npm i git+https://github.com/vertiscape/stellar.git
This will replaces lenis dependency source, so you don't have to make any further changes to the codebase to use this fork.
"dependencies": {
"lenis": "github:vertiscape/stellar", // Replaces official version.
}- If the scrollTo
targetequals the current scroll offset,changedwould befalse, otherwisechangedwould betrue. - Reason:
changedallows developers to handle asynchronous tasks differently whenscrollTodoes nothing and executesonComplete.
lenis.scrollTo(target, {
duration: 2,
onComplete(lenis, changed) {
if (changed) {
console.log("It did scroll, so I'm executed after 2 seconds.");
} else {
console.log("The target is the same as the scroll offset, so I'm executed immediately.");
}
}
});- Using
cubicBezierfunction from framer-motion,easetakes 4 elements in an array and use that to create bezier curve function. easewill overrideseasingif provided.- Just like
easing,easeis useless iflerpdefined, anddurationis required to make both works. - Reason:
easingfunction is nice to have, but usually, bezier curve is enough.
Programmatically scroll with ease:
lenis.scrollTo(target, {
duration: 2,
ease: [0, 1, 1, 0],
});Set default scroll behavior with ease:
// Enable bezier curve easing.
lenis.options.lerp = undefined;
lenis.options.duration = 1;
lenis.options.ease = [0, 1, 1, 0];
// Reset to default.
lenis.options.lerp = 0.1;
lenis.options.ease = undefined;