import type { Action } from 'svelte/action';

interface RevealOptions {
	/** Fraction of the element that must be visible before revealing (0–1). */
	amount?: number;
}

/**
 * Reveal-on-scroll action. Adds the `reveal` class immediately so the element
 * starts hidden, then adds `is-visible` once it scrolls into view (fires once).
 * Mirrors the template's Framer Motion `whileInView={{ once: true, amount }}`.
 */
export const reveal: Action<HTMLElement, RevealOptions | undefined> = (node, options) => {
	const amount = options?.amount ?? 0.25;

	node.classList.add('reveal');

	const observer = new IntersectionObserver(
		(entries) => {
			for (const entry of entries) {
				if (entry.isIntersecting) {
					node.classList.add('is-visible');
					observer.unobserve(node);
				}
			}
		},
		{ threshold: amount }
	);

	observer.observe(node);

	return {
		destroy() {
			observer.disconnect();
		}
	};
};
