);
}
function HowSwiper({ units }) {
const ref = React.useRef(null);
const [idx, setIdx] = React.useState(0);
const N = units.length;
const slides = [units[N - 1], ...units, units[0]];
React.useLayoutEffect(() => {
const el = ref.current;
if (el) el.scrollLeft = el.clientWidth;
}, []);
React.useEffect(() => {
const el = ref.current;
if (!el) return;
let t;
const onScroll = () => {
clearTimeout(t);
t = setTimeout(() => {
const w = el.clientWidth;
if (!w) return;
let near = Math.round(el.scrollLeft / w);
if (near === 0) { el.scrollLeft = w * N; near = N; }
else if (near === N + 1) { el.scrollLeft = w; near = 1; }
setIdx(near - 1);
}, 110);
};
el.addEventListener('scroll', onScroll, { passive: true });
return () => { el.removeEventListener('scroll', onScroll); clearTimeout(t); };
}, [N]);
const go = (i) => {
const el = ref.current;
if (el) el.scrollTo({ left: el.clientWidth * (i + 1), behavior: 'smooth' });
};
return (
{slides.map((u, i) =>
{u}
)}
{units.map((_, i) =>
)}
);
}
function HowItWorks() {
const steps = [
['layers', 'Select your calendars', 'Wipe Away finds every calendar on your Google account. Tick the ones you want to clean — leave the rest untouched.', ],
['clock', 'Set a date', 'Choose how far back to go. Delete everything before a specific date, or wipe your entire history in one go.', ],
['trash', 'Sit back', 'Hit delete and watch the progress. Wipe Away handles everything — including recurring series — automatically.', ]];
return (