{"version":3,"file":"mobile-filters-3c076940.js","sources":["../../../../src/scripts/coveo/components/mobile-filters.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef, useId } from 'react';\nimport { FocusTrap, createFocusTrap } from 'focus-trap';\nimport {\n  disableBodyScroll,\n  clearAllBodyScrollLocks,\n  BodyScrollOptions\n} from 'body-scroll-lock';\nimport { createDataLayerString } from '../../helpers/helpers';\n\ntype MobileFiltersProps = {\n  children: React.ReactNode;\n  label: string;\n  containerRef: React.RefObject<HTMLDivElement>;\n  refinementLayer?: boolean;\n  customCloseLayer?: string;\n  customOpenLayer?: string;\n};\n\nexport const MOBILE_FILTERS_EVENTS = {\n  close: 'mobile-filters:close'\n};\n\nfunction MobileFilters({\n  children,\n  label,\n  containerRef,\n  refinementLayer,\n  customCloseLayer,\n  customOpenLayer\n}: MobileFiltersProps) {\n  const [expanded, setExpanded] = useState(false);\n  const [focusTrap, setFocusTrap] = useState<FocusTrap | null>(null);\n  const accordionRef = useRef<HTMLDivElement | null>(null);\n  const accordionId = useId();\n\n  const getDatalayer = () => {\n    if (refinementLayer) {\n      return expanded\n        ? createDataLayerString([\n            {\n              event: 'mobile_filter_panel',\n              event_category: 'refinement usage',\n              event_action: 'close mobile filter'\n            }\n          ])\n        : createDataLayerString([\n            {\n              event: 'mobile_filter_panel',\n              event_category: 'refinement usage',\n              event_action: 'open mobile filter'\n            }\n          ]);\n    }\n\n    if (customCloseLayer && expanded) {\n      return customCloseLayer;\n    }\n\n    if (customOpenLayer && !expanded) {\n      return customOpenLayer;\n    }\n\n    return undefined;\n  };\n\n  useEffect(() => {\n    if (accordionRef.current) {\n      const options = {\n        reserveScrollBarGap: true,\n        allowTouchMove: (el: HTMLElement) => {\n          return el.closest('.mobile-filters__accordion') !== null;\n        }\n      } as BodyScrollOptions;\n\n      const trap = createFocusTrap(accordionRef.current, {\n        clickOutsideDeactivates: true,\n        returnFocusOnDeactivate: true,\n        onActivate() {\n          disableBodyScroll(document.body, options);\n        },\n        onDeactivate() {\n          clearAllBodyScrollLocks();\n        }\n      });\n\n      setFocusTrap(trap);\n    }\n\n    window.addEventListener('scroll', handleContainerScrolled);\n    window.addEventListener(MOBILE_FILTERS_EVENTS.close, handleClose);\n\n    return () => {\n      window.removeEventListener('scroll', handleContainerScrolled);\n      window.removeEventListener(MOBILE_FILTERS_EVENTS.close, handleClose);\n    };\n  }, []);\n\n  const handleClose = () => {\n    setExpanded(false);\n  };\n\n  const handleAccordionClick = () => {\n    setExpanded(!expanded);\n    if (focusTrap) {\n      if (expanded) {\n        focusTrap.deactivate();\n\n        let scrollableElement: HTMLElement | null = null;\n\n        if (containerRef && containerRef.current) {\n          scrollableElement = containerRef.current;\n        } else if (accordionRef.current) {\n          const parentSection = accordionRef.current.closest('section');\n          scrollableElement = parentSection;\n        }\n\n        if (scrollableElement) {\n          setTimeout(() => {\n            scrollableElement?.scrollIntoView({ behavior: 'smooth' });\n          }, 150);\n        }\n      } else {\n        focusTrap.activate();\n      }\n    }\n    setTimeout(() => {\n      window.dispatchEvent(new Event('scroll'));\n    }, 150);\n  };\n\n  const handleContainerScrolled = () => {\n    if (containerRef.current && accordionRef.current) {\n      const elementTop = containerRef.current.getBoundingClientRect().top;\n      document.body.classList.toggle('mobile-filters', elementTop < 0);\n      accordionRef.current.classList.toggle(\n        'mobile-filters__accordion--fixed',\n        elementTop < 0\n      );\n    }\n  };\n\n  return (\n    <div\n      className={`mobile-filters__accordion ${\n        expanded ? 'mobile-filters__accordion--expanded' : ''\n      }`}\n      ref={accordionRef}\n    >\n      <button\n        data-layer={getDatalayer()}\n        className=\"accordion__item-trigger\"\n        aria-expanded={expanded}\n        id={`trigger-${accordionId}`}\n        aria-controls={`panel-${accordionId}`}\n        onClick={handleAccordionClick}\n      >\n        <span className=\"mobile-filters__filters-title\">{label}</span>\n      </button>\n      <div\n        id={`panel-${accordionId}`}\n        role=\"region\"\n        aria-labelledby={`trigger-${accordionId}`}\n        className={`accordion__item-panel ${expanded ? '' : 'hidden'}`}\n      >\n        <div className=\"mobile-filters__filters-wrapper\">{children}</div>\n      </div>\n    </div>\n  );\n}\n\nexport default MobileFilters;\n"],"names":["MOBILE_FILTERS_EVENTS","MobileFilters","children","label","containerRef","refinementLayer","customCloseLayer","customOpenLayer","expanded","setExpanded","useState","focusTrap","setFocusTrap","accordionRef","useRef","accordionId","useId","getDatalayer","createDataLayerString","useEffect","options","el","trap","createFocusTrap","disableBodyScroll","clearAllBodyScrollLocks","handleContainerScrolled","handleClose","handleAccordionClick","scrollableElement","elementTop","React"],"mappings":"2MAkBO,MAAMA,EAAwB,CACnC,MAAO,sBACT,EAEA,SAASC,EAAc,CACrB,SAAAC,EACA,MAAAC,EACA,aAAAC,EACA,gBAAAC,EACA,iBAAAC,EACA,gBAAAC,CACF,EAAuB,CACrB,KAAM,CAACC,EAAUC,CAAW,EAAIC,WAAS,EAAK,EACxC,CAACC,EAAWC,CAAY,EAAIF,WAA2B,IAAI,EAC3DG,EAAeC,SAA8B,IAAI,EACjDC,EAAcC,EAAAA,QAEdC,EAAe,IAAM,CACzB,GAAIZ,EACF,OAAOG,EACHU,EAAsB,CACpB,CACE,MAAO,sBACP,eAAgB,mBAChB,aAAc,qBAChB,CACD,CAAA,EACDA,EAAsB,CACpB,CACE,MAAO,sBACP,eAAgB,mBAChB,aAAc,oBAChB,CAAA,CACD,EAGP,GAAIZ,GAAoBE,EACf,OAAAF,EAGL,GAAAC,GAAmB,CAACC,EACf,OAAAD,CAGF,EAGTY,EAAAA,UAAU,IAAM,CACd,GAAIN,EAAa,QAAS,CACxB,MAAMO,EAAU,CACd,oBAAqB,GACrB,eAAiBC,GACRA,EAAG,QAAQ,4BAA4B,IAAM,IACtD,EAGIC,EAAOC,EAAgBV,EAAa,QAAS,CACjD,wBAAyB,GACzB,wBAAyB,GACzB,YAAa,CACOW,EAAA,SAAS,KAAMJ,CAAO,CAC1C,EACA,cAAe,CACWK,GAC1B,CAAA,CACD,EAEDb,EAAaU,CAAI,EAGZ,cAAA,iBAAiB,SAAUI,CAAuB,EAClD,OAAA,iBAAiB1B,EAAsB,MAAO2B,CAAW,EAEzD,IAAM,CACJ,OAAA,oBAAoB,SAAUD,CAAuB,EACrD,OAAA,oBAAoB1B,EAAsB,MAAO2B,CAAW,CAAA,CAEvE,EAAG,CAAE,CAAA,EAEL,MAAMA,EAAc,IAAM,CACxBlB,EAAY,EAAK,CAAA,EAGbmB,EAAuB,IAAM,CAEjC,GADAnB,EAAY,CAACD,CAAQ,EACjBG,EACF,GAAIH,EAAU,CACZG,EAAU,WAAW,EAErB,IAAIkB,EAAwC,KAExCzB,GAAgBA,EAAa,QAC/ByB,EAAoBzB,EAAa,QACxBS,EAAa,UAEFgB,EADEhB,EAAa,QAAQ,QAAQ,SAAS,GAI1DgB,GACF,WAAW,IAAM,CACfA,GAAA,MAAAA,EAAmB,eAAe,CAAE,SAAU,QAAU,IACvD,GAAG,OAGRlB,EAAU,SAAS,EAGvB,WAAW,IAAM,CACf,OAAO,cAAc,IAAI,MAAM,QAAQ,CAAC,GACvC,GAAG,CAAA,EAGFe,EAA0B,IAAM,CAChC,GAAAtB,EAAa,SAAWS,EAAa,QAAS,CAChD,MAAMiB,EAAa1B,EAAa,QAAQ,sBAAA,EAAwB,IAChE,SAAS,KAAK,UAAU,OAAO,iBAAkB0B,EAAa,CAAC,EAC/DjB,EAAa,QAAQ,UAAU,OAC7B,mCACAiB,EAAa,CAAA,EAEjB,EAIA,OAAAC,EAAA,cAAC,MAAA,CACC,UAAW,6BACTvB,EAAW,sCAAwC,KAErD,IAAKK,CAAA,EAELkB,EAAA,cAAC,SAAA,CACC,aAAYd,EAAa,EACzB,UAAU,0BACV,gBAAeT,EACf,GAAI,WAAWO,IACf,gBAAe,SAASA,IACxB,QAASa,CAAA,EAERG,EAAA,cAAA,OAAA,CAAK,UAAU,+BAAA,EAAiC5B,CAAM,CACzD,EACA4B,EAAA,cAAC,MAAA,CACC,GAAI,SAAShB,IACb,KAAK,SACL,kBAAiB,WAAWA,IAC5B,UAAW,yBAAyBP,EAAW,GAAK,UAAA,EAEnDuB,EAAA,cAAA,MAAA,CAAI,UAAU,iCAAA,EAAmC7B,CAAS,CAC7D,CAAA,CAGN"}