{"version":3,"file":"static/js/5007.0c926b0a.chunk.js","mappings":"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","sources":["shared/area-cards-container/area-cards-container-component.jsx"],"sourcesContent":["import React, { useState } from \"react\"\nimport Svg from \"../../shared/_svgs/svg\"\nimport ReactHtmlParser from \"react-html-parser\"\nimport Slider from \"react-slick\"\nimport useWindowWidth from \"../../hooks/useWindowWidth\"\n\nexport default function AreaCardsContainer({ areaCards, headline, richTextField, enableCarousel }) {\n  const windowWidth = useWindowWidth()\n\n  const htmlAreaCards =\n    areaCards.length > 0\n      ? areaCards.map((card) => {\n          return enableCarousel ? (\n            <AreaCardAsCarouselItem\n              key={card.linkLabel}\n              image={card.image}\n              linkLabel={card.linkLabel}\n              //Epi mixup, URL = linkTarget, Link target = target\n              link={card.linkTarget}\n              target={card.target}\n              description={card.description}\n            />\n          ) : (\n            <AreaCard\n              key={card.linkLabel}\n              image={card.image}\n              linkLabel={card.linkLabel}\n              //Epi mixup, URL = linkTarget, Link target = target\n              link={card.linkTarget}\n              target={card.target}\n              description={card.description}\n            />\n          )\n        })\n      : undefined\n\n  var settings = {\n    dots: windowWidth < 768 ? true : false,\n    arrows: windowWidth < 768 ? false : true,\n    infinite: false,\n    slidesToShow: 3,\n    slidesToScroll: 1,\n    swipe: false,\n    variableWidth: false,\n    responsive: [\n      {\n        breakpoint: 991,\n        settings: {\n          slidesToShow: 2,\n          swipe: false,\n        },\n      },\n      {\n        breakpoint: 640,\n        settings: {\n          slidesToShow: 1,\n          swipe: true,\n          variableWidth: true,\n        },\n      },\n    ],\n  }\n\n  return (\n    <section className={\"area-cards-container\"}>\n      <div className=\"w--normal\">\n        <h2 className=\"rich-text\">{richTextField ? ReactHtmlParser(richTextField) : headline}</h2>\n        {enableCarousel ? (\n          <div className=\"show-as-carousel\">\n            <Slider {...settings}>{htmlAreaCards}</Slider>\n          </div>\n        ) : (\n          <div className=\"grid\">{htmlAreaCards}</div>\n        )}\n      </div>\n    </section>\n  )\n}\n\nfunction AreaCard({ link, target, image, linkLabel, description }) {\n  const [isHovered, setIsHovered] = useState(false)\n  const [isFocused, setIsFocused] = useState(false)\n\n  function handleMouseEvent() {\n    if (!isFocused) setIsHovered(!isHovered)\n  }\n\n  function handleFocusEvent() {\n    setIsFocused(!isFocused)\n    if (isHovered) setIsHovered(!isHovered)\n  }\n\n  return (\n    <div className=\"grid-item\">\n      <a\n        onMouseEnter={() => handleMouseEvent()}\n        onMouseLeave={() => handleMouseEvent()}\n        onFocus={() => handleFocusEvent()}\n        onBlur={() => handleFocusEvent()}\n        href={link}\n        target={target[0]?.value || \"_blank\"}\n      >\n        <img src={image} alt=\"\" />\n        <div className=\"textarea\">\n          <div className=\"flex-container\">\n            <div className=\"textarea-header\">\n              <h3 className={isHovered || isFocused ? \"is-hovered\" : \"\"}>{linkLabel}</h3>\n              <Svg iconName=\"arrowright-slim\" fillColor={\"transparent\"} stroke={isHovered || isFocused ? \"#3a70cc\" : \"#071143\"} />\n            </div>\n            <div className=\"maintext\">{description}</div>\n          </div>\n        </div>\n      </a>\n    </div>\n  )\n}\n\nfunction AreaCardAsCarouselItem({ link, target, image, linkLabel, description }) {\n  const [isHovered, setIsHovered] = useState(false)\n  const [isFocused, setIsFocused] = useState(false)\n\n  function handleMouseEvent() {\n    if (!isFocused) setIsHovered(!isHovered)\n  }\n\n  function handleFocusEvent() {\n    setIsFocused(!isFocused)\n    if (isHovered) setIsHovered(!isHovered)\n  }\n\n  return (\n    <a\n      onMouseEnter={() => handleMouseEvent()}\n      onMouseLeave={() => handleMouseEvent()}\n      onFocus={() => handleFocusEvent()}\n      onBlur={() => handleFocusEvent()}\n      className=\"grid-item\"\n      href={link}\n      target={target[0]?.value || \"_blank\"}\n    >\n      <div className=\"image-wrapper\">\n        <img src={image} alt=\"\" />\n      </div>\n      <div className=\"textarea\">\n        <div className=\"flex-container\">\n          <div className=\"textarea-header\">\n            <h3 className={isHovered || isFocused ? \"is-hovered\" : \"\"}>{linkLabel}</h3>\n            <Svg iconName=\"arrowright-slim\" fillColor={\"transparent\"} stroke={isHovered || isFocused ? \"#3a70cc\" : \"#071143\"} />\n          </div>\n          <div className=\"maintext\">{description}</div>\n        </div>\n      </div>\n    </a>\n  )\n}\n"],"names":["AreaCardsContainer","_ref","areaCards","headline","richTextField","enableCarousel","windowWidth","useWindowWidth","htmlAreaCards","length","map","card","_jsx","AreaCardAsCarouselItem","image","linkLabel","link","linkTarget","target","description","AreaCard","undefined","settings","dots","arrows","infinite","slidesToShow","slidesToScroll","swipe","variableWidth","responsive","breakpoint","className","children","_jsxs","ReactHtmlParser","Slider","_objectSpread","_ref2","_target$","_useState","useState","_useState2","_slicedToArray","isHovered","setIsHovered","_useState3","_useState4","isFocused","setIsFocused","handleMouseEvent","handleFocusEvent","onMouseEnter","onMouseLeave","onFocus","onBlur","href","value","src","alt","Svg","iconName","fillColor","stroke","_ref3","_target$2","_useState5","_useState6","_useState7","_useState8"],"sourceRoot":""}