[Feature] scroll easing - ease target to scroll location

[kauaicreative]

Is your feature request related to a problem? Please describe.
scroll animate is not smooth when using a mouse or scrolling quickly.

Describe the solution you'd like
Is there a way to add an easing to the scroll target? We see this a lot with gsap. for example https://codepen.io/creativeocean/pen/qBbBLyB

[vnphanquang]

There is a smooth option for ScrollOptions but that doesn't seem to do anything as of 2775786.

motionone/packages/dom/src/gestures/scroll/types.ts

Line 54 in 2775786

smooth?: number

---

For what it's worth, here is what I did to achieve "scroll easing" in the context of Svelte:

import { scroll, animate } from 'motion';
import { cubicOut } from 'svelte/easing';
import { tweened } from 'svelte/motion';

/**
 * @param {number} from
 * @param {number} to
 * @param {number} progress
 */
function interpolate(from, to, progress) {
	return from + (to - from) * progress;
}

// animation business logics
const FROM = 0;
const TO = 360;
const rotate = tweened(FROM, {
	duration: 500,
	easing: cubicOut,
});

const el = document.querySelector('.element');

rotate.subscribe((value) => {
	el.style.transform = `rotate(${value}deg)`;
})

scroll(
	animate((progress) => {
		rotate.set(interpolate(FROM, TO, progress));
	}),
	{
		offset: ['-100px center', 'end center'],
		target: el,
	},
);