Springs

Every spring is a response, the seconds it takes to get most of the way, and a damping ratio, the same pair SwiftUI's Spring(response:dampingRatio:) takes:

import { springboard, swiftui, toLinear, uikit } from "@web-kits/springboard";

swiftui.bouncy; // { response: 0.5, dampingRatio: 0.7 }
uikit.sheet; // UISpringTimingParameters(mass: 3, stiffness: 1000, damping: 500)
springboard.open; // the card on opening an app

const { easing, duration } = toLinear(swiftui.snappy);
el.animate({ scale: [0.9, 1] }, { easing, duration });

Motion

toLinear samples a spring into a CSS linear() easing, which can't carry velocity into a new target. For motion that's interrupted, use Motion:

import { swiftui } from "@web-kits/springboard/motion";

<motion.div animate={{ x }} transition={swiftui.snappy} />;

toMotion(spring, speed) converts any other spring, and speed plays it faster or slower, like SwiftUI's .speed().