{"version":3,"file":"static/chunks/7277.01ec0a3165183ffa.js","mappings":"gMAOMA,EAAY,CAAC,YAAa,OAAQ,QA+BlCC,EAAsC,SAACC,GAC3C,IAAQC,EAA+BD,EAA/BC,aAAcC,EAAiBF,EAAjBE,aAEtB,OAAM,SACHC,MAAG,CAACC,UAAWC,IAAAA,a,SACbP,EAAUQ,KAAI,SAACC,EAAMC,GACpB,OACN,SADOL,MAAG,CAEFC,UAAY,GACVH,OADYI,IAAAA,YAAoB,KAEjC,OADCJ,IAAiBO,GAASH,IAAAA,uBAE5BI,QAAS,WAAMP,OAAAA,EAAaM,I,mBAE3BE,EAAAA,EAAI,CAACC,SAAUJ,KANXA,SAaTK,EAAsC,SACvC,G,IAAHC,EAAI,EAAJA,KACAC,EAAM,EAANA,OACAb,EAAY,EAAZA,aAEA,OAAMc,EAAAA,EAAAA,KAALC,EAAAA,EAAI,CAACD,KAAO,GAAqB,OAAnBF,EAAKZ,I,mBACjBgB,IAAC,C,mBACCC,EAAAA,EAAK,CACJd,UAAWC,IAAAA,YACXc,IAAM,GAA2B,OAAzBL,EAAOb,GAAcmB,IAAI,0BACjCC,IAAKP,EAAOb,GAAcqB,OAAS,GACnCC,MAAO,IACPC,OAAQ,IACRC,UAAU,eA+BlB,UAzBqB,SAAQ,G,IAGtBC,EAWQA,EACEA,EAfOA,EAAQ,EAARA,SACkBC,GAAAA,EAAAA,EAAAA,UAAS,GAA1C1B,EAAiC0B,EAAW,GAA9BC,EAAmBD,EAAW,GAEnD,KAAa,OAARD,QAAAA,IAAAA,GAAe,QAAfA,EAAAA,EAAUG,aAAVH,IAAAA,OAAAA,EAAAA,EAAiBI,QAAQ,OAAO,KACrC,IAAMhB,EAAiB,OAARY,QAAAA,IAAAA,OAAAA,EAAAA,EAAUG,MAAMvB,KAAI,SAACyB,GAASA,OAAAA,EAAKC,SAC5CnB,EAAe,OAARa,QAAAA,IAAAA,OAAAA,EAAAA,EAAUG,MAAMvB,KAAI,SAACyB,GAASA,OAAAA,EAAKE,iBAKhD,OAAM,SACHC,EAAAA,EAAY,CACX9B,UAAWC,IAAAA,QACX8B,uBAAwB9B,IAAAA,gBACxB+B,QAAoC,QAA3BV,EAAAA,EAASG,MAAM5B,UAAfyB,IAAAA,OAAAA,EAAAA,EAA8BJ,MACvCe,UAAsC,QAA3BX,EAAAA,EAASG,MAAM5B,UAAfyB,IAAAA,OAAAA,EAAAA,EAA8BY,YACzCC,QAAM,SACHxC,EAAY,CAACE,aAAcA,EAAcC,aAX3B,SAACK,GACpBqB,EAAgBrB,M,mBAabK,EAAY,CAACE,OAAQA,EAAQD,KAAMA,EAAMZ,aAAcA,Q,iBChG9DuC,EAAOC,QAAU,CAAC,YAAY,gCAAgC,WAAW,+BAA+B,qBAAqB,yCAAyC,WAAW,+BAA+B,cAAc,kCAAkC,QAAU,8BAA8B,gBAAkB","sources":["webpack://_N_E/./components/contentful-components/know-your-cuts/KnowYourCuts.tsx","webpack://_N_E/./components/contentful-components/know-your-cuts/KnowYourCuts.module.scss"],"sourcesContent":["import { FC, useState } from \"react\";\nimport Image from \"@Components/Image\";\nimport Icon from \"@Components/ui/icon\";\nimport { SectionBasic } from \"@Components/ui/section\";\nimport Link from \"@wff/components/Link\";\nimport classes from \"./KnowYourCuts.module.scss\";\n\nconst KYC_ICONS = [\"cow-black\", \"lamb\", \"pork\"];\n\ntype CMSImageType = {\n  url: string;\n  width: number;\n  height: number;\n  title?: string;\n};\n\ninterface IconsContentProps {\n  onIconChange: (x: number) => void;\n  selectedIcon: number;\n}\n\ninterface ImageContentProps {\n  urls: string[];\n  images: CMSImageType[];\n  selectedIcon: number;\n}\n\nexport interface KnowYourCutsProps {\n  sections: {\n    items: {\n      title: string;\n      description: string;\n      image: CMSImageType;\n      collectionUrl: string;\n    }[];\n  };\n}\n\nconst IconsContent: FC<IconsContentProps> = (props) => {\n  const { selectedIcon, onIconChange } = props;\n\n  return (\n    <div className={classes[\"kyc-icons\"]}>\n      {KYC_ICONS.map((icon, index) => (\n        <div\n          key={icon}\n          className={`${classes[\"kyc-icon\"]} ${\n            selectedIcon === index && classes[\"kyc-icon--selected\"]\n          }`}\n          onClick={() => onIconChange(index)}\n        >\n          <Icon iconName={icon} />\n        </div>\n      ))}\n    </div>\n  );\n};\n\nconst ImageContent: FC<ImageContentProps> = ({\n  urls,\n  images,\n  selectedIcon,\n}) => (\n  <Link href={`${urls[selectedIcon]}`}>\n    <a>\n      <Image\n        className={classes[\"kyc-cuts\"]}\n        src={`${images[selectedIcon].url}?fm=webp&w=1920&h=1080`}\n        alt={images[selectedIcon].title || \"\"}\n        width={600}\n        height={350}\n        objectFit=\"cover\"\n      />\n    </a>\n  </Link>\n);\n\nconst KnowYourCuts = ({ sections }: KnowYourCutsProps) => {\n  const [selectedIcon, setSelectedIcon] = useState(0);\n\n  if (!sections?.items?.length) return null;\n  const images = sections?.items.map((item) => item.image);\n  const urls = sections?.items.map((item) => item.collectionUrl);\n  const onIconChange = (icon: number) => {\n    setSelectedIcon(icon);\n  };\n\n  return (\n    <SectionBasic\n      className={classes.section}\n      sectionButtonClassName={classes[\"section__button\"]}\n      heading={sections.items[selectedIcon]?.title}\n      paragraph={sections.items[selectedIcon]?.description}\n      button={\n        <IconsContent selectedIcon={selectedIcon} onIconChange={onIconChange} />\n      }\n    >\n      <ImageContent images={images} urls={urls} selectedIcon={selectedIcon} />\n    </SectionBasic>\n  );\n};\n\nexport default KnowYourCuts;\n","// extracted by mini-css-extract-plugin\nmodule.exports = {\"kyc-icons\":\"KnowYourCuts_kyc-icons__dfIT0\",\"kyc-icon\":\"KnowYourCuts_kyc-icon__Pooct\",\"kyc-icon--selected\":\"KnowYourCuts_kyc-icon--selected__Tz5zz\",\"kyc-cuts\":\"KnowYourCuts_kyc-cuts__F6zck\",\"inner-image\":\"KnowYourCuts_inner-image___3QYu\",\"section\":\"KnowYourCuts_section__YnpPO\",\"section__button\":\"KnowYourCuts_section__button__KMaQ2\"};"],"names":["KYC_ICONS","IconsContent","props","selectedIcon","onIconChange","div","className","classes","map","icon","index","onClick","Icon","iconName","ImageContent","urls","images","href","Link","a","Image","src","url","alt","title","width","height","objectFit","sections","useState","setSelectedIcon","items","length","item","image","collectionUrl","SectionBasic","sectionButtonClassName","heading","paragraph","description","button","module","exports"],"sourceRoot":""}