{"version":3,"mappings":"2QAWA,MAAMA,EAAuBA,CAAC,CAAEC,WAAUC,cAAwC,IAAM,OAChFC,QAAmBC,UAAQ,IAAM,OACrC,OAAOH,mBAAUI,mBAAVJ,cACHK,IAAI,CAACC,EAAMC,KAAW,CAAED,OAAME,KAAMR,EAASS,iBAAiBF,CAAK,CAAI,IACxEG,KAAK,CAACC,EAAGC,IACJD,EAAEL,OAASL,EAAqB,GAChCW,EAAEN,OAASL,EAAqB,EAC7B,GAERY,MAAM,EAAG,EAAC,EACZ,CAACb,EAAUC,CAAY,CAAC,EAE3B,SACE,OAAKa,UAAU,wOAAuOC,SACnPf,mBAAUgB,gBACT,OAAKF,UAAU,yVAAwVC,SAAC,WAEnW,EAEPE,EAAA,OAAKH,UAAU,gDAA+CC,UAC5DG,EAAA,OACEC,IAAKnB,EAASoB,UAAYC,EAC1BC,IAAI,gBACJR,UAAU,0HACVS,IAAI,WACL,EACDL,EAAA,KAAGJ,UAAU,uGAAsGC,SAChHf,EAASM,KACT,CAAC,EACD,IACJN,mBAAUI,mBAAVJ,cAA4BwB,QAAS,KACpC,OAAKV,UAAU,sFAAqFC,SACjGb,EAAiBG,IAAI,CAACoB,EAAUlB,MAC9BmB,EAAI,CACHC,KAAO,eAAcF,EAASjB,IAAK,GACnCM,UAAU,iEAAgEC,WAG1E,KAAGD,UAAU,sCAAqCC,SAAEU,EAASnB,KAAQ,CAAC,EAFjEC,CAGD,CACP,EACE,EAEPW,EAAA,OAAKJ,UAAU,+JAA8JC,WAC1Ka,EAAkB,CAACC,OAAQ7B,EAAS6B,OAAQC,YAAa9B,EAAS+B,cAAgB,EAChF,EACLb,EAACc,EAAM,CACLC,QAAQ,YACRnB,UAAU,sLAAqLC,WAE9LW,EAAI,CAACC,KAAO,cAAa3B,EAASQ,IAAK,GAAGM,UAAU,cAAaC,SAAC,sBAE7D,EACA,CAAC,EACN,CAET,EAEemB,SAAKnC,CAAoB,ECnElCoC,EAASC,OAAK,IAAMC,EAAA,WAAO,qBAAyB,EAAC,6BAmBrDC,EAA0BA,CAAC,CAAE,GAAGC,CAAoC,IAAM,CAE9E,MAAMC,EAAQC,IAER,CAAEC,aAAYC,WAAcJ,IAC5B,CAACK,EAAiBC,CAAkB,EAAIC,WAASH,CAAS,EAE1D,CAACI,EAAUC,CAAW,EAAIF,EAASG,WAAOC,WAAa,GAAG,EAC1D,CAACC,EAAOC,CAAQ,EAAIN,EAASG,WAAOC,WAAa,IAAI,EAErD,CAACjD,EAAcoD,CAAe,EAAIP,WAASJ,EAAaA,EAAW,CAAC,EAAI,EAAE,EAE1EY,EAAeC,SAAO,IAAI,EAEhCC,YAAU,IAAM,CACd,MAAMC,EAAeA,IAAM,CACbR,IAAOC,WAAa,GAAG,EAC1BD,IAAOC,YAAc,IAAI,GAE7BQ,0BAAiB,SAAUD,CAAY,EACvC,IAAM,CACJE,sBAAoB,SAAUF,CAAY,EACnD,EACC,CAACR,EAAOC,UAAU,CAAC,EAEhBU,QAA4B,MAAOC,GAAQ,OAC/C,MAAMC,EAAW,MAAMC,EAAMC,IAAI,8BAA+B,CAC9DC,OAAQ,CACNxC,SAAUoC,CACZ,EACD,EACKK,GAAeJ,mBAAUK,OAAVL,cAAgBnB,UACrCE,EAAmBqB,CAAY,GAGjCV,YAAU,IAAM,CACRY,QAAaC,SAASC,cAAc,cAAc,EAEpD,IAACvB,GAAYqB,EAAY,CACrBG,QAAeF,SAASG,cAAc,OAAO,EAE/C5B,SAAgBpB,QAAU,EAC5B+C,EAAaE,UAAY,+CAEzBF,EAAaE,UAAY,GAGlBC,cAAKC,YAAYJ,CAAY,EAE/B,IAAM,CACPA,GACOG,cAAKE,YAAYL,CAAY,CACxC,CAEJ,GACC,CAAC3B,CAAe,CAAC,EAEpB,MAAMiC,EAAiB,eAEjBC,EAAW3E,UACf,KAAO,CACL4E,cAAehC,EACfiC,SAAU,GACVC,SAAUrC,EAAgBpB,OAAS,EACnC0D,KAAM,GACNC,MAAO,IACPC,aAAcrC,EAAW,EAAII,EAAQ,EAAI,EACzCkC,eAAgB,EAChBC,YAAYC,EAAS,CAACC,cAAe,6KAA+K,EACpNC,YAAYC,EAAS,CAACF,cAAe,iKAAmK,EACxMG,WAAsBzE,KAAC0E,EAAU,CAACV,OAAYM,cAAe,+EAAiF,EAC9I1E,UAAW,SACX+E,WAAY,GACZC,cAAgB/C,EAAwC,MAA5BI,EAAQ,OAAS,OAAW,GAE1D,CAACJ,EAAUI,EAAOP,EAAgBpB,MAAM,CAC1C,EAGEgB,WACE,OAAK1B,UAAU,sBAAqBC,SAAC,aAAe,EAEpDE,EAAA8E,EAAA,CAAAhF,UACEE,EAAA,OAAKH,UAAU,iGAAgGC,UAC7GG,EAAA,MAAIJ,UAAU,0GAAyGC,SAAC,kBAAmB,EAC3IG,EAAA,KAAGJ,UAAU,0FAAyFC,SAAC,iJAAiJ,EACxPE,EAAA,OAAKH,UAAU,iFAAgFC,UAC7FE,EAAA,OAAKH,UAAU,gHAA+GC,UAC5HG,EAAA,OAAKC,IAAK6E,EAAc1E,IAAI,OAAO2E,QAAQ,OAAOnF,UAAU,0FAA0FoF,QAASA,IAAM,CACnK5C,EAAa6C,QAAQC,YAAc,GACrC,EAAI,EACJnF,EAAA,OAAKH,UAAU,4DAA4DuF,IAAK/C,EAAavC,UAC3FG,EAAA,OAAKJ,UAAU,+BAAoC,EAClD4B,iBAAYrC,IAAI,CAACoB,EAAUlB,MAC1B,QAAMO,UAAY,GAAEW,IAAaxB,EAAe,yCAA2C,EAAG,mEAE9FiG,QAASA,IAAM,CACb7C,EAAgB5B,CAAQ,CAC1B,EAAEV,WACA,KAAGD,UAAY,sGAAsGoF,QAASA,IAAMtC,EAA0BnC,CAAQ,EAAEV,SAAEU,EAAY,GAJnLlB,CAKC,EACN,EACC,EACLW,EAAA,OAAKJ,UAAU,gCAAqC,EACpDI,EAAA,OAAKC,IAAK6E,EAAc1E,IAAI,OAAO2E,QAAQ,OAAOnF,UAAU,gFAAgFoF,QAASA,IAAM,CACzJ5C,EAAa6C,QAAQC,YAAc,GACrC,EAAI,CAAC,EACF,EACLnF,EAAA,OAAKH,UAAU,qFAAoFC,SAAA,CACjGG,EAACoF,EAAU,CAAC3E,KAAMkD,EAAgB/D,UAAU,oFAAmFC,SAAC,wBAAiC,EACjKG,EAAA,OAAKJ,UAAU,oFAAoFK,IAAKoF,EAAcjF,IAAI,QAAQ2E,QAAQ,OAAQ,CAAC,EAChJ,EACLhF,EAAA,OAAKH,UAAU,2EAA0EC,SAAA,CACvFG,EAACoF,EAAU,CAAC3E,KAAMkD,EAAgB/D,UAAU,wFAAuFC,SAAC,uBAAgC,EACpKG,EAAA,OAAKJ,UAAU,oFAAoFK,IAAKoF,EAAcjF,IAAI,QAAQ2E,QAAQ,OAAQ,CAAC,EAChJ,CAAC,EACH,CAAC,EACH,EACNrD,GAAmB3B,EAAA,OAAKH,UAAU,uEAAsEC,UACvGG,EAAA,OAAKJ,UAAU,gBAAqB,EACpCI,EAAA,OAAKJ,UAAU,iBAAsB,EACrCI,EAACiB,EAAM,IAAK2C,EAAQ/D,SACjB6B,EAAgBvC,IAAI,CAACL,EAAUO,MAE5B,OAAKO,UAAU,oBAAmBC,WAC/BhB,EAAoB,CACnBC,WACAC,eACD,GAJqCM,CAKnC,CAER,EAEK,CAAC,EACN,CAAC,EACN,CAEN,EAEgB2B,SAAKI,CAAuB","names":["HomepageSolutionCard","solution","activeFilter","sortedCategories","useMemo","categories_names","map","name","index","slug","categories_slugs","sort","a","b","slice","className","children","is_featured","_jsxs","_jsx","src","logo_url","SolutionPlaceHolder","alt","rel","length","category","Link","href","SolutionStarRating","rating","ratingCount","ratings_count","Button","variant","memo","Slider","lazy","__vitePreload","HomepageSolutionSection","props","isSSR","useSSR","categories","solutions","solutionsToShow","setSolutionsToShow","useState","isMobile","setIsMobile","window","innerWidth","isTab","setIsTab","setActiveFilter","containerRef","useRef","useEffect","handleResize","addEventListener","removeEventListener","filterSolutionsByCategory","cat","response","axios","get","params","responseData","data","slickTrack","document","querySelector","styleElement","createElement","innerHTML","head","appendChild","removeChild","marketplaceURL","settings","variableWidth","autoPlay","infinite","dots","speed","slidesToShow","slidesToScroll","prevArrow","PrevArrow","customClasses","nextArrow","NextArrow","appendDots","CustomDots","centerMode","centerPadding","_Fragment","chavironLeft","loading","onClick","current","scrollLeft","ref","HybridLink","chavironBlue"],"sources":["../../../app/javascript/components/molecules/solution/HomepageSolutionCard.tsx","../../../app/javascript/components/organisms/solutionsSection/HomepageSolutionSection.tsx"],"sourcesContent":["import { SolutionStarRating } from '@/components/molecules/solution/SolutionStarRating';\nimport { Link } from '@inertiajs/react';\nimport Button from '../../atoms/buttons/Button';\nimport SolutionPlaceHolder from '../../../../assets/images/solution-logo-placeholder.svg';\nimport { memo, useMemo } from 'react';\n\ntype HomepageSolutionCardProps = {\n  solution: schema.Solution;\n  activeFilter: string;\n};\n\nconst HomepageSolutionCard = ({ solution, activeFilter }: HomepageSolutionCardProps) => {\n  const sortedCategories = useMemo(() => {\n    return solution?.categories_names\n      ?.map((name, index) => ({ name, slug: solution.categories_slugs[index] }))\n      .sort((a, b) => {\n        if (a.name === activeFilter) return -1\n        if (b.name === activeFilter) return 1\n        return 0;\n      })\n      .slice(0, 3)\n  }, [solution, activeFilter])\n\n  return (\n    <div className='content relative mb-[17px] w-[234px] flex flex-col sm:w-auto xl:w-[292px] sm:max-w-[315.41px] xl:max-w-[292px] h-[331.74px] sm:h-[440px] sm:max-h-[465px] justify-center sm:px-4 sm:py-10 sm:mx-4 sm:my-4 rounded-xl shadow-card my-1'>\n      {solution?.is_featured && (\n        <div className='absolute left-[-3%] top-[2%] w-[101.58px] sm:w-[40%] rounded-t-lg rounded-r-lg bg-dark-blue py-1 text-center text-xs sm:text-sm font-bold uppercase tracking-[1px] text-white before:absolute before:top-[100%] before:left-[0%] before:z-[10] before:border-4 before:border-r-4 before:border-t-4 before:border-r-dark-blue before:border-t-dark-blue'>\n          Featured\n        </div>\n      )}\n      <div className='mt-3 sm:mt-0 flex flex-col items-center gap-6'>\n        <img\n          src={solution.logo_url || SolutionPlaceHolder}\n          alt='solution logo'\n          className='w-[74.74px] h-[73.61px] sm:w-[102px] sm:h-[102px] rounded-full border border-[#979797] border-opacity-10 shadow-lg mt-4'\n          rel='nofollow'\n        />\n        <p className='break-all text-[17px] lg:text-[16.15px] font-semibold text-center sm:leading-6 leading-4 sm:h-11 h-8'>\n          {solution.name}\n        </p>\n      </div>\n      {solution?.categories_names?.length > 0 && (\n        <div className='flex flex-wrap justify-center md:justify-center h-16 overflow-scroll scrollbar-none'>\n          {sortedCategories.map((category, index) => (\n            <Link\n              href={`/categories/${category.slug}`}\n              className='bg-blue-tint-2 p-1 h-min rounded-xl px-2 whitespace-nowrap m-1'\n              key={index}\n            >\n              <p className='text-[9px] sm:text-xs font-semibold'>{category.name}</p>\n            </Link>\n          ))}\n        </div>\n      )}\n      <div className='flex flex-wrap justify-center overflow-hidden shadow-card mx-[21px] rounded-xl mb-[19px] w-[185.9px] h-[38.24px] sm:w-auto sm:mx-0 sm:px-2 sm:py-4 sm:h-auto'>\n        <SolutionStarRating rating={solution.rating} ratingCount={solution.ratings_count} />\n      </div>\n      <Button\n        variant='secondary'\n        className='flex text-[12.54px] justify-center items-center sm:text-sm md:text-md w-[185.9px] h-[38.24px] md:h-[35] ml-[21px] sm:w-auto sm:ml-0 sm:py-4 sm:h-auto mb-[10px] sm:mb-0 !rounded-lg'\n      >\n        <Link href={`/solutions/${solution.slug}`} className='font-normal'>\n          View Vendor Profile\n        </Link>\n      </Button>\n    </div>\n  );\n};\n\nexport default memo(HomepageSolutionCard)","import { useRef, lazy, memo, useMemo } from \"react\";\nimport { useState, useEffect } from \"react\";\nconst Slider = lazy(() => import('@ant-design/react-slick'));\nimport \"slick-carousel/slick/slick.css\";\nimport \"slick-carousel/slick/slick-theme.css\";\nimport chavironLeft from '../../../../assets/images/chevron-left.svg'\nimport chavironBlue from '../../../../assets/images/chevron-blue.svg'\nimport { CustomDots, NextArrow, PrevArrow } from '@components/atoms/widgets/Carousel';\nimport HomepageSolutionCard from \"@/components/molecules/solution/HomepageSolutionCard\";\nimport HybridLink from \"@/components/atoms/widgets/HybridLink\";\nimport axios from \"axios\";\nimport window from 'global'\nimport useSSR from \"@/hooks/useSSR\";\n\nimport './styles.css'\n\ntype HomepageSolutionSectionProps = {\n  categories: schema.Category[];\n  solutions: schema.Solution[];\n}\n\nconst HomepageSolutionSection = ({ ...props }: HomepageSolutionSectionProps) => {\n\n  const isSSR = useSSR();\n\n  const { categories, solutions } = props;\n  const [solutionsToShow, setSolutionsToShow] = useState(solutions);\n\n  const [isMobile, setIsMobile] = useState(window.innerWidth < 650);\n  const [isTab, setIsTab] = useState(window.innerWidth < 1024);\n\n  const [activeFilter, setActiveFilter] = useState(categories ? categories[0] : '');\n\n  const containerRef = useRef(null);\n\n  useEffect(() => {\n    const handleResize = () => {\n      setIsMobile(window.innerWidth < 650);\n      setIsTab(window.innerWidth <= 1024);\n    };\n    window.addEventListener('resize', handleResize);\n    return () => {\n      window.removeEventListener('resize', handleResize);\n    };\n  }, [window.innerWidth]);\n\n  const filterSolutionsByCategory = async (cat) => {\n    const response = await axios.get('homepage/filter_by_category', {\n      params: {\n        category: cat\n      }\n    });\n    const responseData = response?.data?.solutions;\n    setSolutionsToShow(responseData);\n  }\n\n  useEffect(() => {\n    const slickTrack = document.querySelector('.slick-track')\n  \n    if (!isMobile && slickTrack) {\n      const styleElement = document.createElement('style')\n  \n      if (solutionsToShow.length <= 3) {\n        styleElement.innerHTML = '.slick-track { transform: none !important; }'\n      } else {\n        styleElement.innerHTML = ''\n      }\n  \n      document.head.appendChild(styleElement)\n  \n      return () => {\n        if (styleElement) {\n          document.head.removeChild(styleElement)\n        }\n      };\n    }\n  }, [solutionsToShow])\n\n  const marketplaceURL = '/marketplace';\n\n  const settings = useMemo(\n    () => ({\n      variableWidth: isMobile,\n      autoPlay: false,\n      infinite: solutionsToShow.length > 3,\n      dots: true,\n      speed: 200,\n      slidesToShow: isMobile ? 1 : isTab ? 2 : 3,\n      slidesToScroll: 1,\n      prevArrow: <PrevArrow customClasses={'mt-0 z-10 sm:z-0 absolute left-[76%] xl:left-[82.8%] lg:left-[84%] md:left-[82%] sm:left-[91%] xl:top-[100%] sm:w-[60px] sm:h-[60px] lg:top-[100%] md:top-[99%] top-[101%]'} />,\n      nextArrow: <NextArrow customClasses={'mt-0 absolute left-[84%] xl:left-[85.7%] lg:left-[88%] md:left-[87%] xl:top-[100%] sm:left-[96%] sm:w-[60px] sm:h-[60px] lg:top-[100%] md:top-[99%] top-[101%]'} />,\n      appendDots: (dots) => <CustomDots dots={dots} customClasses={'absolute left-[-26%] xl:left-[-34%] lg:left-[-39%] md:left-[-38%] top-[100%]'} />,\n      className: \"center\",\n      centerMode: true,\n      centerPadding: !isMobile ? (isTab ? '80px' : '11.5%') : '0px',\n    }),\n    [isMobile, isTab, solutionsToShow.length]\n  )\n\n  return (\n    isSSR ? (\n      <div className=\"flex justify-center\">Loading...</div>\n    ) : (\n      <>\n        <div className='w-[329px] sm:w-auto mx-auto flex flex-col xl:mx-auto max-w-[1320px] md:px-20 lg:px-44 xl:px-44'>\n          <h2 className='sm:text-[1.75rem] xl:text-[2.375rem] text-[38px] font-extrabold -tracking-[0.5px] mb-[8px] md:mb-[27px]'>The Marketplace</h2>\n          <p className='text-[18px] sm:text-[0.7rem] md:text-lg font-semibold mb-[13px] md:mb-[30px] lg:w-[80%]'>Discover leading HR technology solutions, assess ratings, compare solutions, and equip your team with the ideal tech stack for hiring success.</p>\n          <div className=\"flex w-full flex-col-reverse gap-[19px] md:flex-row flex-start justify-between\">\n            <div className='flex flex-start justify-between w-[100%] overflow-scroll scrollbar-none rounded-lg category-section-container'>\n              <img src={chavironLeft} alt=\"prev\" loading='lazy' className=\"block xl:hidden h-[15px] w-[15px] mr-4 sm:mt-[0.35rem] mt-[0.1rem]  ml-[-2.3px] sm:ml-0\" onClick={() => {\n                containerRef.current.scrollLeft -= 200;\n              }} />\n              <div className=\"flex w-full gap-0 sm:gap-4 overflow-x-auto scrollbar-none\" ref={containerRef}>\n                <div className=\"xl:hidden flex gradient-left\"></div>\n                {categories?.map((category, index) => (\n                  <span className={`${category === activeFilter ? 'bg-[#f3f3f3] rounded-lg font-extrabold' : ''} flex items-center px-3 py-1 mb-[29px] sm:md-[50px] md:mb-[46px]`} \n                  key={index}\n                  onClick={() => {\n                    setActiveFilter(category)\n                  }}>\n                    <p className={`cursor-pointer text-[12px] sm:text-[0.875rem] text-black-100 hover:font-extrabold whitespace-nowrap`} onClick={() => filterSolutionsByCategory(category)}>{category}</p>\n                  </span>\n                ))}\n              </div>\n              <div className=\"xl:hidden flex gradient-right\"></div>\n              <img src={chavironLeft} alt=\"next\" loading='lazy' className=\"block xl:hidden h-[15px] w-[15px] rotate-180 sm:mt-[0.35rem] mt-[0.1rem] ml-4\" onClick={() => {\n                containerRef.current.scrollLeft += 200;\n              }} />\n            </div>\n            <div className=\"hidden md:flex gap-1 items-center pr-[1rem] xl:pr-[9px] mt-[3px] sm:mt-0 mb-[46px]\">\n              <HybridLink href={marketplaceURL} className=\"text-xs sm:text-sm sm:font-medium cursor-pointer text-[#11D0B0] whitespace-nowrap\">Visit The Marketplace</HybridLink>\n              <img className=\"h-1.5 w-1.5 sm:h-[0.6rem] sm:w-[0.6rem] sm:mt-[0.2rem] sm:ml-[0.2rem] self-center\" src={chavironBlue} alt=\"arrow\" loading='lazy' />\n            </div>\n            <div className=\"md:hidden flex gap-1 items-center pr-[1rem] xl:pr-[9px] mt-[3px] sm:mt-0\">\n              <HybridLink href={marketplaceURL} className=\"text-[17px] sm:text-sm sm:font-medium cursor-pointer text-[#11D0B0] whitespace-nowrap\">View The Marketplace</HybridLink>\n              <img className=\"h-1.5 w-1.5 sm:h-[0.6rem] sm:w-[0.6rem] sm:mt-[0.2rem] sm:ml-[0.2rem] self-center\" src={chavironBlue} alt=\"arrow\" loading='lazy' />\n            </div>\n          </div>\n        </div>\n      {solutionsToShow && <div className=\"solution-section-container max-w-[1260px] xl:mx-auto sm:px-4 xl:mx-0\">\n        <div className=\"gradient-left\"></div>\n        <div className=\"gradient-right\"></div>\n        <Slider {...settings}>\n          {solutionsToShow.map((solution, index) => {\n            return (\n              <div className=\"mx-[14px] sm:mx-0\" key={index}>\n                <HomepageSolutionCard\n                  solution={solution}\n                  activeFilter={activeFilter}\n                />\n              </div>\n            )\n          })\n          }\n        </Slider>\n      </div>}\n    </>)\n  );\n};\n\nexport default  memo(HomepageSolutionSection);\n"],"file":"assets/HomepageSolutionSection-ap2igmWN.js"}