{"version":3,"file":"component---gatsby-theme-husky-src-templates-recipe-recipe-tsx-1448de07b73da1efafee.js","mappings":"uPA2UA,UAzT0C,SAAH,GAmBhC,IAKDA,EALA,IAlBJC,KAAI,IACFC,OACEC,EAAQ,EAARA,SACAC,EAAc,EAAdA,eACAC,EAAY,EAAZA,aACAC,EAAO,EAAPA,QACAC,EAAa,EAAbA,cACAC,EAAY,EAAZA,aACAC,EAAI,EAAJA,KACAC,EAAG,EAAHA,IACAC,EAAQ,EAARA,SAEWC,EAAK,EAAlBC,UAAaD,MAAK,IAClBE,WAAcC,EAAO,EAAPA,QAASC,EAAc,EAAdA,eAAgBC,EAAQ,EAARA,SACvCC,EAAM,EAANA,OACAC,EAAM,EAANA,OACAC,EAAY,EAAZA,aAGaC,EAAiEX,EAAxEY,MAA2BC,EAA6Cb,EAAvDc,SAAoCC,EAAmBf,EAAhCgB,YAE1CC,EAAY,CAAEC,UAAW,YAAaC,QAAS,CAAEC,cADtCC,EAAAA,EAAAA,eAC6DC,WAQ9E,OAJI1B,IACFN,GAAUiC,EAAAA,EAAAA,IAAa3B,IAIvB,gBAAC,IAAM,CAAC4B,mBAAiB,EAACC,UAAWhC,GAAY,MAC9CgB,GAAU,gBAAC,IAAM,CAAClB,KAAMkB,EAAQiB,SAAUhB,IAC3C,gBAAC,IAAG,CAAOX,KAAAA,EAAMC,IAAAA,IACjB,gBAAC,IAAU,CACT2B,KAAK,SACLC,KAAMjB,EACNpB,KAAM,CACJsC,UAAWlB,EACXmB,gBAAiBf,EACjBgB,aAAclB,GAEhBmB,SAAU/B,EAASgC,gBAAgBC,SAASC,IAC5CC,aAAcnB,IAEhB,uBAAKoB,UAAU,oCACb,uBAAKA,UAAU,wBACb,uBAAKA,UAAU,2BACb,uBAAKA,UAAU,YACb,gBAAC,IAAK,CACJC,UAAWzC,EACX0C,IAAK1C,EAAc2C,QACnBH,UAAU,sBAEZ,gBAAC,IAAK,CACJC,UAAWxC,EACXyC,IAAKzC,EAAa0C,QAClBH,UAAU,uCAIhB,uBAAKA,UAAU,YACb,uBAAKA,UAAU,YACb,uBAAKA,UAAU,qBACb,2BAASA,UAAU,aACjB,gBAAC,IAAuB,CACtBI,KAAM/C,EACNgD,QAAQ,KACRL,UAAU,6BAEZ,gBAAC,IAAuB,CAACI,KAAM9C,EAAc+C,QAAQ,MAAML,UAAU,SACrE,uBAAKA,UAAU,QACb,gBAAC,IAAuB,CACtBI,KAAMlC,EACNmC,QAAQ,MACRL,UAAU,wCAOtB,uBAAKA,UAAU,0BACb,uBAAKA,UAAU,YACZ/C,GAAW,gBAAC,IAAiB,CAACA,QAASA,EAASqD,YAAa9C,MAGlE,uBAAKwC,UAAU,YACb,uBAAKA,UAAU,YACb,uBAAKA,UAAU,wBACb,sBAAIA,UAAU,kBAAkB/B,GAChC,uBAAK+B,UAAU,gDACb,uBAAKA,UAAU,OACZnC,EAAM0C,KACL,gBACEC,EAAE,EAAFA,GACOjB,EAAI,EAAXhB,MACOkC,EAAY,EAAnBC,MACcC,EAAW,EAAzBrD,aACAsD,EAAG,EAAHA,IAAG,OAEH,uBAAKZ,UAAU,kBAAkBa,IAAKL,GACpC,uBAAKR,UAAU,6CACb,uBAAKA,UAAU,mCACb,gBAAC,IAAK,CACJA,UAAU,gBACVC,UAAWQ,EACXP,IAAKO,EAAaN,UAEpB,qBAAGH,UAAU,wBAEf,uBAAKA,UAAU,aACb,sBAAIA,UAAU,oBAAoBT,GAClC,gBAAC,IAAuB,CACtBa,MAAMU,EAAAA,EAAAA,IAAUH,GAAaI,UAAU,EAAG,IAC1CV,QAAQ,MACRL,UAAU,mCAEZ,uBAAKA,UAAU,oBACb,gBAAC,EAAAgB,KAAI,CAACC,GAAIL,EAAKZ,UAAU,mBACtBhC,MAKL,WAUvBG,EAAS,gBAAC,IAAM,CAACjB,KAAMiB,IAAa,iCAG3C,C","sources":["webpack://husky-site/../gatsby-theme-husky/src/templates/Recipe/Recipe.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { graphql, Link } from 'gatsby';\nimport { useLocation } from '@reach/router';\n\nimport DangerouslySetInnerHtml from 'layout/DangerouslySetInnerHtml';\nimport Layout from 'layout/Layout';\nimport Image from 'common/Image';\nimport PageSchema from 'common/PageSchema';\nimport Seo from 'common/Seo';\nimport Footer from 'components/Footer';\nimport Header from 'components/Header';\nimport YouTubeLazyLoaded from 'components/YouTubeLazyLoaded';\n\nimport { getYoutubeId, stripHTML } from '../../utils/functions';\nimport { RecipeProps } from './models';\n\nimport './Recipe.scss';\n\nconst Recipe: FC<{ data: RecipeProps }> = ({\n  data: {\n    recipe: {\n      pageLogo,\n      principalTitle,\n      instructions,\n      youtube,\n      bannerDesktop,\n      bannerMobile,\n      urls,\n      seo,\n      imageseo,\n    },\n    allRecipe: { nodes },\n    recipeList: { seeMore, relatedRecipes, activate },\n    footer,\n    header,\n    siteSettings,\n  },\n}) => {\n  const { title: seoTitle, keywords: seoKeywords, description: seoDescription } = seo;\n  const location = useLocation();\n  const eventData = { eventType: 'page_view', tagData: { pageTemplate: location.pathname } };\n\n  let videoId;\n\n  if (youtube) {\n    videoId = getYoutubeId(youtube);\n  }\n\n  return (\n    <Layout headerTransparent alterLogo={pageLogo || null}>\n      {header && <Header data={header} settings={siteSettings} />}\n      <Seo {...{ urls, seo }} />\n      <PageSchema\n        type=\"Recipe\"\n        name={seoTitle}\n        data={{\n          metaTitle: seoTitle,\n          metaDescription: seoDescription,\n          metaKeywords: seoKeywords,\n        }}\n        imageurl={imageseo.childImageSharp.original.src}\n        tagEventData={eventData}\n      />\n      <div className=\"mx-auto section-container recipe\">\n        <div className=\"container-fluid px-0\">\n          <div className=\"row recipe__banner mx-0\">\n            <div className=\"col px-0\">\n              <Image\n                imageData={bannerDesktop}\n                alt={bannerDesktop.altText}\n                className=\"d-none d-md-block\"\n              />\n              <Image\n                imageData={bannerMobile}\n                alt={bannerMobile.altText}\n                className=\"d-block d-md-none recipe-img-mob\"\n              />\n            </div>\n          </div>\n          <div className=\"row mx-0\">\n            <div className=\"col px-0\">\n              <div className=\"recipe__text pb-3\">\n                <section className=\"px-3 py-4\">\n                  <DangerouslySetInnerHtml\n                    html={principalTitle}\n                    element=\"h1\"\n                    className=\"mb-0 text-uppercase pt-4\"\n                  />\n                  <DangerouslySetInnerHtml html={instructions} element=\"div\" className=\"pt-2\" />\n                  <div className=\"pt-3\">\n                    <DangerouslySetInnerHtml\n                      html={activate}\n                      element=\"div\"\n                      className=\"pt-2 recipe__related-item-text\"\n                    />\n                  </div>\n                </section>\n              </div>\n            </div>\n          </div>\n          <div className=\"row recipe__video mx-0\">\n            <div className=\"col px-0\">\n              {videoId && <YouTubeLazyLoaded videoId={videoId} videoPoster={bannerDesktop} />}\n            </div>\n          </div>\n          <div className=\"row mx-0\">\n            <div className=\"col px-0\">\n              <div className=\"recipe__related pt-3\">\n                <h4 className=\"py-2 ms-4 ps-4\">{relatedRecipes}</h4>\n                <div className=\"container-fluid recipe__related-wrapper py-4\">\n                  <div className=\"row\">\n                    {nodes.map(\n                      ({\n                        id,\n                        title: name,\n                        image: imageRecipes,\n                        instructions: instruction,\n                        url,\n                      }) => (\n                        <div className=\"col-12 col-md-4\" key={id}>\n                          <div className=\"mx-auto recipe__related-item mb-4 mb-md-0\">\n                            <div className=\"recipe__related-item-image pb-3\">\n                              <Image\n                                className=\"recipe-border\"\n                                imageData={imageRecipes}\n                                alt={imageRecipes.altText}\n                              />\n                              <i className=\"far fa-play-circle\" />\n                            </div>\n                            <div className=\"px-3 pb-3\">\n                              <h3 className=\"py-2 text-center\">{name}</h3>\n                              <DangerouslySetInnerHtml\n                                html={stripHTML(instruction).substring(0, 70)}\n                                element=\"div\"\n                                className=\"pt-2 recipe__related-item-text\"\n                              />\n                              <div className=\"text-center pt-3\">\n                                <Link to={url} className=\"btn btn-primary\">\n                                  {seeMore}\n                                </Link>\n                              </div>\n                            </div>\n                          </div>\n                        </div>\n                      )\n                    )}\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      {footer ? <Footer data={footer} /> : <></>}\n    </Layout>\n  );\n};\n\nexport const query = graphql`\n  query ($url: String, $lang: String) {\n    recipe(url: { eq: $url }) {\n      pageLogo {\n        childImageSharp {\n          gatsbyImageData(placeholder: BLURRED)\n        }\n      }\n      principalTitle\n      title\n      instructions\n      youtube\n      urls {\n        lang\n        href\n      }\n      seo {\n        ...SEOStructureFragment\n      }\n      imageseo: image {\n        childImageSharp {\n          original {\n            src\n          }\n        }\n      }\n      bannerDesktop {\n        childImageSharp {\n          gatsbyImageData(quality: 100)\n        }\n      }\n      bannerMobile {\n        childImageSharp {\n          gatsbyImageData(quality: 100)\n        }\n      }\n    }\n    recipeList {\n      seeMore\n      relatedRecipes\n      activate\n    }\n    allRecipe(limit: 3) {\n      nodes {\n        id\n        title\n        principalTitle\n        instructions\n        url\n        image {\n          childImageSharp {\n            gatsbyImageData\n          }\n        }\n      }\n    }\n    header(lang: { eq: $lang }) {\n      logo {\n        childImageSharp {\n          gatsbyImageData(placeholder: BLURRED, quality: 100)\n        }\n      }\n      socialMedia {\n        name\n        url\n        queryString\n      }\n      socialMediaLogo {\n        image {\n          childImageSharp {\n            gatsbyImageData(quality: 100)\n          }\n        }\n        url {\n          name\n          url\n        }\n      }\n      navs {\n        label\n        url {\n          url\n        }\n        navigationWithSubMenu {\n          label\n          url {\n            name\n            url\n          }\n        }\n      }\n      sidebar {\n        url {\n          url\n        }\n        image {\n          desktop {\n            childImageSharp {\n              gatsbyImageData(placeholder: BLURRED, width: 60)\n            }\n          }\n          mobile {\n            childImageSharp {\n              gatsbyImageData(placeholder: BLURRED, width: 60)\n            }\n          }\n          tablet {\n            childImageSharp {\n              gatsbyImageData(placeholder: BLURRED, width: 60)\n            }\n          }\n        }\n        url {\n          url\n        }\n      }\n    }\n    siteSettings {\n      siteName\n      defaultLang\n      popupLanguage\n      avaliableLanguages {\n        url\n        code\n        title\n        longTitle\n      }\n    }\n    footer(lang: { eq: $lang }) {\n      logo {\n        desktop {\n          childImageSharp {\n            gatsbyImageData(placeholder: BLURRED, width: 150)\n          }\n        }\n        mobile {\n          childImageSharp {\n            gatsbyImageData(placeholder: BLURRED, width: 150)\n          }\n        }\n        tablet {\n          childImageSharp {\n            gatsbyImageData(placeholder: BLURRED, width: 150)\n          }\n        }\n      }\n      extraLogo {\n        childImageSharp {\n          gatsbyImageData(quality: 100)\n        }\n      }\n      navs {\n        name\n        url\n      }\n      contact\n      copyright\n      socialMedia {\n        iconImage {\n          url\n          altText\n          fallbackUrl\n        }\n        iconLink {\n          url\n          name\n          icon\n        }\n      }\n    }\n  }\n`;\n\nexport default Recipe;\n"],"names":["videoId","data","recipe","pageLogo","principalTitle","instructions","youtube","bannerDesktop","bannerMobile","urls","seo","imageseo","nodes","allRecipe","recipeList","seeMore","relatedRecipes","activate","footer","header","siteSettings","seoTitle","title","seoKeywords","keywords","seoDescription","description","eventData","eventType","tagData","pageTemplate","useLocation","pathname","getYoutubeId","headerTransparent","alterLogo","settings","type","name","metaTitle","metaDescription","metaKeywords","imageurl","childImageSharp","original","src","tagEventData","className","imageData","alt","altText","html","element","videoPoster","map","id","imageRecipes","image","instruction","url","key","stripHTML","substring","Link","to"],"sourceRoot":""}