mirror of
https://github.com/Kaelio/ktx.git
synced 2026-07-13 11:22:11 +02:00
chore: move docs site workspace
This commit is contained in:
parent
0ae9b6effd
commit
a46563bb01
52 changed files with 3 additions and 3 deletions
|
|
@ -1,58 +0,0 @@
|
|||
"use client";
|
||||
|
||||
import { useEffect, useRef, type ReactNode } from "react";
|
||||
|
||||
type Props = {
|
||||
children: ReactNode;
|
||||
className?: string;
|
||||
stagger?: boolean;
|
||||
threshold?: number;
|
||||
};
|
||||
|
||||
export function ScrollReveal({
|
||||
children,
|
||||
className = "",
|
||||
stagger = false,
|
||||
threshold = 0.1,
|
||||
}: Props) {
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const node = ref.current;
|
||||
if (!node) return;
|
||||
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
for (const entry of entries) {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.classList.add("visible");
|
||||
if (stagger) {
|
||||
entry.target.querySelectorAll(".rv").forEach((el) => {
|
||||
el.classList.add("visible");
|
||||
});
|
||||
}
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
}
|
||||
},
|
||||
{ threshold, rootMargin: "0px 0px -40px 0px" }
|
||||
);
|
||||
|
||||
if (stagger) {
|
||||
observer.observe(node);
|
||||
} else {
|
||||
node.querySelectorAll(".rv").forEach((el) => observer.observe(el));
|
||||
}
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, [stagger, threshold]);
|
||||
|
||||
return (
|
||||
<div
|
||||
ref={ref}
|
||||
className={`${stagger ? "rv rv-stagger" : ""} ${className}`}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue