"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),e=require("react"),d=require("../../utils/cn/cn.cjs.js"),r=require("../../src/pageComponents/Bubbles/bubbles.module.css"),v=["xs","lg","md","md","xl","sm","sm","md","lg","md","xl","xl","xl"],w=({className:b})=>{const[n,f]=e.useState(!1),[c,m]=e.useState("forward"),[l,u]=e.useState(!1),i=e.useRef(null),a=e.useRef(0);return e.useEffect(()=>{const s=()=>{const t=window.scrollY;m(t>a.current?"forward":"reverse"),a.current=t};return window.addEventListener("scroll",s,{passive:!0}),()=>window.removeEventListener("scroll",s)},[]),e.useEffect(()=>{const s=new window.IntersectionObserver(([t])=>{f(t.isIntersecting)},{rootMargin:"0px 0px -20% 0px",threshold:.2});return i.current&&s.observe(i.current),()=>s.disconnect()},[]),e.useEffect(()=>{n&&c==="forward"&&u(!0),n&&c==="reverse"&&u(!1)},[n,c]),o.jsx("section",{ref:i,className:d.cn(r.root,b),children:o.jsx("div",{className:r.container,children:v.map((s,t)=>o.jsx("div",{className:d.cn(r.bubble,l&&r.bubbleFinished,!l&&r.bubbleReverse),"data-size":s,"data-index":t},t))})})};exports.Bubbles=w;
