unom/style
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

modernize

Browse Source 
- replace vite with tsdown
- update registry
- update deps
This commit is contained in:
Enrico Bühler
2026-02-03 07:47:48 +01:00
parent 1115053fcd
commit 1217cf56f5
15 changed files with 930 additions and 1861 deletions
Download Patch File Download Diff File Expand all files Collapse all files

222
src/easings/easings.ts
View File

@@ -1,100 +1,150 @@
type CubicBezierEase = [number, number, number, number];
type TransitionConfig = {
type: string;
duration: number;
ease: CubicBezierEase;
delay?: number;
};
type EasingCollection = {
out: any;
in: any;
inOut: any;
out: TransitionConfig;
in: TransitionConfig;
inOut: TransitionConfig;
};
type EasingFunction = (duration: number, delay?: number) => EasingCollection;
const Easings: { [key: string]: EasingFunction } = {
quart: (duration, delay) =>
easing(
[0.895, 0.03, 0.685, 0.22],
[0.165, 0.84, 0.44, 1],
[0.77, 0, 0.175, 1],
duration,
delay
),
circ: (duration, delay) =>
easing(
[0.6, 0.04, 0.98, 0.335],
[0.075, 0.82, 0.165, 1],
[0.785, 0.135, 0.15, 0.86],
duration,
delay
),
quint: (duration, delay) =>
easing(
[0.755, 0.05, 0.855, 0.06],
[0.23, 1, 0.32, 1],
[0.86, 0, 0.07, 1],
duration,
delay
),
sine: (duration, delay) =>
easing(
[0.47, 0, 0.745, 0.715],
[0.39, 0.575, 0.565, 1],
[0.445, 0.05, 0.55, 0.95],
duration,
delay
),
expo: (duration, delay) =>
easing(
[0.95, 0.05, 0.795, 0.035],
[0.19, 1, 0.22, 1],
[1, 0, 0, 1],
duration,
delay
),
cubic: (duration, delay) =>
easing(
[0.55, 0.055, 0.675, 0.19],
[0.215, 0.61, 0.355, 1],
[0.645, 0.045, 0.355, 1],
duration,
delay
),
type EasingName =
| "sine"
| "quad"
| "cubic"
| "quart"
| "quint"
| "expo"
| "circ"
| "back"
| "elastic"
| "bounce";
const Easings: Record<EasingName, EasingFunction> = {
sine: (duration, delay) =>
easing(
[0.47, 0, 0.745, 0.715],
[0.39, 0.575, 0.565, 1],
[0.445, 0.05, 0.55, 0.95],
duration,
delay,
),
quad: (duration, delay) =>
easing(
[0.55, 0.085, 0.68, 0.19],
[0.25, 0.46, 0.45, 1],
[0.455, 0.03, 0.515, 0.955],
duration,
delay,
),
cubic: (duration, delay) =>
easing(
[0.55, 0.055, 0.675, 0.19],
[0.215, 0.61, 0.355, 1],
[0.645, 0.045, 0.355, 1],
duration,
delay,
),
quart: (duration, delay) =>
easing(
[0.895, 0.03, 0.685, 0.22],
[0.165, 0.84, 0.44, 1],
[0.77, 0, 0.175, 1],
duration,
delay,
),
quint: (duration, delay) =>
easing(
[0.755, 0.05, 0.855, 0.06],
[0.23, 1, 0.32, 1],
[0.86, 0, 0.07, 1],
duration,
delay,
),
expo: (duration, delay) =>
easing(
[0.95, 0.05, 0.795, 0.035],
[0.19, 1, 0.22, 1],
[1, 0, 0, 1],
duration,
delay,
),
circ: (duration, delay) =>
easing(
[0.6, 0.04, 0.98, 0.335],
[0.075, 0.82, 0.165, 1],
[0.785, 0.135, 0.15, 0.86],
duration,
delay,
),
back: (duration, delay) =>
easing(
[0.55, 0.055, 0.675, 0.19],
[0.175, 0.885, 0.32, 1.275],
[0.68, -0.55, 0.265, 1.585],
duration,
delay,
),
elastic: (duration, delay) =>
easing(
[0.95, 0, 0.7, 0.01],
[0.37, 0, 0.63, 1],
[0.37, 0, 0.63, 1],
duration,
delay,
),
bounce: (duration, delay) =>
easing(
[0.55, 0.06, 0.67, 0.19],
[0.215, 0.61, 0.355, 1],
[0.215, 0.61, 0.355, 1],
duration,
delay,
),
};
const defaultCubicTransition = {
type: "tween",
duration: 0.7,
};
type CubicBezierEase = [number, number, number, number];
type: "tween",
duration: 0.7,
} as const;
const easing = (
easeIn: CubicBezierEase,
easeOut: CubicBezierEase,
easeInOut: CubicBezierEase,
duration: number,
delay?: number
) => {
const durationObj = duration ? { duration: duration } : {};
easeIn: CubicBezierEase,
easeOut: CubicBezierEase,
easeInOut: CubicBezierEase,
duration: number,
delay?: number,
): EasingCollection => {
const durationObj = duration ? { duration } : {};
const delayObj = delay ? { delay } : {};
const delayObj = delay ? { delay: delay } : {};
return {
in: {
...defaultCubicTransition,
ease: easeIn,
...durationObj,
...delayObj,
},
out: {
...defaultCubicTransition,
ease: easeOut,
...durationObj,
...delayObj,
},
inOut: {
...defaultCubicTransition,
ease: easeInOut,
...durationObj,
...delayObj,
},
};
return {
in: {
...defaultCubicTransition,
ease: easeIn,
...durationObj,
...delayObj,
},
out: {
...defaultCubicTransition,
ease: easeOut,
...durationObj,
...delayObj,
},
inOut: {
...defaultCubicTransition,
ease: easeInOut,
...durationObj,
...delayObj,
},
};
};
export default Easings;