{"version":3,"file":"component---src-templates-home-js-7f6abae3333264589070.js","mappings":"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","sources":["webpack://morrisons-help/./src/components/HeaderButton.jsx","webpack://morrisons-help/./src/components/CategoryBrowser.jsx","webpack://morrisons-help/./src/components/ContactForm/forms/utils/Form/index.jsx","webpack://morrisons-help/./src/components/AnchorChevron.jsx","webpack://morrisons-help/./src/components/FAQList.jsx","webpack://morrisons-help/./src/components/Layout.jsx","webpack://morrisons-help/./src/components/PrimaryButton.jsx","webpack://morrisons-help/./src/components/SubHeading.jsx","webpack://morrisons-help/./src/components/PopularFAQs.jsx","webpack://morrisons-help/./src/components/Trending.jsx","webpack://morrisons-help/./src/components/FlipCard.jsx","webpack://morrisons-help/./src/components/Search.jsx","webpack://morrisons-help/./src/components/Header.jsx","webpack://morrisons-help/./src/components/GeneralEnquiries.jsx","webpack://morrisons-help/./src/components/Card.jsx","webpack://morrisons-help/./src/components/ReasonsGetInTouch.jsx","webpack://morrisons-help/./src/templates/home.js"],"sourcesContent":["import React from 'react'\nimport BaseButton from './BaseButton'\n\nfunction HeaderButton(props) {\n  const { opaque, ...rest } = props\n  return (\n    <BaseButton\n      {...rest}\n      className={`${\n        props.opaque\n          ? 'text-secondary bg-white-85 hover:bg-white-50 border-transparent hover:text-primary'\n          : ''\n      }`}\n    />\n  )\n}\n\nexport default HeaderButton\n","import React from 'react'\nimport { navigate } from 'gatsby'\nimport PropTypes from 'prop-types'\nimport Icon from './Icon'\nimport HeaderButton from './HeaderButton'\nimport { useCategoryMetaData, formatUrl } from 'src/core'\nimport Select from './Select'\nimport { Form } from './ContactForm/forms/utils/Form'\n\nconst CategoryBrowser = () => {\n  const categoryMeta = useCategoryMetaData()\n  return (\n    <section className=\"w-full lg:w-2/3\">\n      <div className=\"mb-4\">\n        <h2 className=\"text-xl font-semibold text-white md:text-2xl\">\n          What topic do you need help with?\n        </h2>\n      </div>\n      <div className=\"flex -mx-2 md:mx-0\">\n        <div className=\"flex flex-wrap w-full px-0 mb-2 sm:-mb-2 md:hidden\">\n          <Form.Item width={1}>\n            <Select\n              name=\"category\"\n              options={categoryMeta\n                ?.filter(\n                  meta =>\n                    meta.category !== 'Coronavirus' &&\n                    meta.category !== 'Morrisons Alexa Skill'\n                )\n                .map(meta => ({\n                  value: meta.category,\n                  label: meta.category,\n                }))}\n              onChange={category => {\n                navigate(`/${formatUrl(category.value)}/`)\n              }}\n            />\n          </Form.Item>\n        </div>\n        <div className=\"flex-wrap hidden -mx-2 -mb-2 md:flex\">\n          {categoryMeta\n            .filter(\n              meta =>\n                meta.category !== 'Coronavirus' &&\n                meta.category !== 'Morrisons Alexa Skill'\n            )\n            .map(meta => {\n              return (\n                <div className=\"mx-1 mb-2\" key={meta.category}>\n                  <HeaderButton\n                    rounded\n                    opaque\n                    href={`/${formatUrl(meta.category)}/`}\n                  >\n                    <div className=\"flex\">\n                      <span className=\"block font-semibold whitespace-no-wrap\">\n                        {meta.category}\n                      </span>\n                      <Icon\n                        icon=\"forwardArrow\"\n                        className=\"hidden w-3 h-3 my-auto ml-3 fill-current sm:inline-block\"\n                      />\n                    </div>\n                  </HeaderButton>\n                </div>\n              )\n            })}\n        </div>\n      </div>\n    </section>\n  )\n}\n\nCategoryBrowser.propTypes = {\n  categoryMeta: PropTypes.array,\n}\n\nexport default CategoryBrowser\n","import React from 'react'\n\nconst Fieldset = props => {\n  const { legend, children } = props\n  return (\n    <fieldset className=\"w-full mb-8\">\n      <legend className=\"block w-full mb-4 text-xl font-semibold\">\n        {legend}\n      </legend>\n      <div className=\"flex flex-wrap -mx-2\">{children}</div>\n    </fieldset>\n  )\n}\n\nconst Item = props => {\n  const { children, width } = props\n  return (\n    <div\n      className={`px-2 w-full ${width === 2 ? 'sm:w-1/2' : ''} ${\n        width === 3 ? 'sm:w-1/3' : ''\n      }`}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport const Form = {\n  Fieldset,\n  Item,\n}\n","import React from 'react'\nimport { Link } from 'gatsby'\nimport Icon from './Icon'\n\nconst AnchorChevron = ({ href, copy }) => {\n  return (\n    <Link\n      className={`flex text-lg text-secondary justify-between items-start w-full hover:underline hover:text-primary`}\n      to={href}\n    >\n      <span className=\"flex-1 pr-4\">{copy}</span>\n      <Icon icon=\"forwardArrow\" className=\"w-2 h-5 opacity-50 fill-current\" />\n    </Link>\n  )\n}\n\nexport default AnchorChevron\n","import React from 'react'\nimport AnchorChevron from './AnchorChevron'\nimport { createSlug } from '../core/urls'\n\nconst FAQList = ({ faqs, halvedLayout }) => {\n  return (\n    <>\n      {(faqs || []).map((faq, index) => (\n        <div\n          className={`flex justify-between w-full px-3 mb-3 md:mb-4 last:mb-0 ${\n            halvedLayout ? 'md:w-1/2' : ''\n          }`}\n          key={faq.QuestionText}\n        >\n          <AnchorChevron\n            href={`${faq.ParentPageURL}#${createSlug(faq.QuestionText)}`}\n            copy={faq.QuestionText}\n            key={`faq-${index}`}\n          />\n        </div>\n      ))}\n    </>\n  )\n}\n\nexport default FAQList\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nconst propTypes = {\n  children: PropTypes.node,\n  className: PropTypes.string,\n}\n\nconst Layout = ({ children, className }) => {\n  return (\n    <section\n      className={`mb-12 xxl:mb-16 block w-full ${className ? className : ''}`}\n    >\n      {children}\n    </section>\n  )\n}\n\nLayout.propTypes = propTypes\n\nexport default Layout\n","import React from 'react'\nimport BaseButton from './BaseButton'\n\nfunction PrimaryButton(props) {\n  const { light, outline, ...rest } = props\n  return outline ? (\n    <BaseButton\n      {...rest}\n      className={`${\n        props.light\n          ? 'text-primary bg-transparent border-primary-light hover:border-primary'\n          : 'text-primary bg-transparent border-primary hover:bg-primary-lighter hover:border-primary-dark'\n      }`}\n    />\n  ) : (\n    <BaseButton\n      {...rest}\n      className={`${\n        props.light\n          ? 'text-primary-dark bg-primary-lighter border-primary-lighter hover:bg-primary-lightest hover:border-primary-lightest'\n          : 'text-white bg-primary border-primary hover:bg-primary-dark hover:border-primary-dark'\n      }`}\n    />\n  )\n}\n\nexport default PrimaryButton\n","import React from 'react'\n\nconst SubHeading = props => {\n  const { heading, copy } = props\n  return (\n    <div className=\"mb-6\">\n      <h2 className=\"text-2xl font-semibold\">{heading}</h2>\n      {copy && copy ? (\n        <div className=\"mt-2\">\n          <p className=\"text-lg\">{copy}</p>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n\nexport default SubHeading\n","import React from 'react'\nimport { useStaticQuery, graphql } from 'gatsby'\nimport SubHeading from './SubHeading'\nimport FAQList from './FAQList'\n\nconst PopularFAQs = () => {\n  const faqs = useStaticQuery(graphql`\n    query MyQuery {\n      allPopularFaqs {\n        nodes {\n          QuestionText\n          ParentPageURL\n        }\n      }\n    }\n  `)\n  return (\n    <>\n      <SubHeading heading=\"Popular questions\" />\n      <div className=\"flex flex-wrap mb-16 -mx-3\">\n        <FAQList faqs={faqs.allPopularFaqs.nodes} halvedLayout />\n      </div>\n    </>\n  )\n}\n\nexport default PopularFAQs\n","import React from 'react'\nimport Layout from './Layout'\nimport Container from './Container'\nimport PopularFAQs from './PopularFAQs'\n\nconst Trending = () => {\n  return (\n    <Layout>\n      <Container>\n        <PopularFAQs />\n      </Container>\n    </Layout>\n  )\n}\n\nexport default Trending\n","import React, { useState } from 'react'\nimport { Link } from 'gatsby'\nimport parse from 'html-react-parser'\nimport Icon from './Icon'\nimport PrimaryButton from './PrimaryButton'\n\nlet dataLayer\n\nif (typeof window !== `undefined`) {\n  dataLayer = window.dataLayer\n}\n\nconst FlipCard = ({ item }) => {\n  const [active, setActive] = useState(false)\n  const { gtmTag } = item\n\n  const handleInteraction = () => {\n    if (dataLayer && dataLayer.push) {\n      dataLayer.push({ event: 'enquiry', content: gtmTag })\n    }\n    setActive(!active)\n  }\n\n  if (item.href) {\n    return (\n      <Link to={item.href} tabIndex=\"0\" className={`flex w-full`}>\n        <Faces active={active} item={item} />\n      </Link>\n    )\n  }\n\n  return (\n    <div\n      onClick={() => {\n        handleInteraction()\n      }}\n      onKeyPress={() => {\n        handleInteraction()\n      }}\n      role=\"button\"\n      tabIndex=\"0\"\n      className={`flip-card flex w-full outline-none ${active ? 'active' : ''}`}\n    >\n      <Faces active={active} item={item} />\n    </div>\n  )\n}\n\nconst Faces = ({ active, item }) => {\n  return (\n    <div className=\"relative flex items-stretch w-full flip-card__container\">\n      <FlipCardFront item={item} active={active} />\n      <FlipCardBack item={item} />\n    </div>\n  )\n}\n\nconst FlipCardFront = ({ item }) => {\n  return (\n    <div className=\"flex flex-col items-start justify-between w-full p-6 rounded-lg flip-card__side flip-card__side--front bg-secondary bg-gradient-br-primary\">\n      <div className=\"z-10 flex items-center justify-center w-10 h-10 mb-2 rounded-full bg-secondary\">\n        <Icon icon={item.icon} className=\"w-2/3 text-white fill-current\" />\n      </div>\n      <div className=\"flex-auto w-full mb-3 text-white\">\n        <div className=\"mb-1\">\n          <h4 className=\"text-2xl font-semibold\">{item.title}</h4>\n        </div>\n        <p className=\"text-base\">{item.text}</p>\n        <p className=\"text-base\">{item.info}</p>\n      </div>\n      <div className=\"pt-12\">\n        <PrimaryButton light>\n          <span className=\"text-secondary\">{item.button}</span>\n        </PrimaryButton>\n      </div>\n    </div>\n  )\n}\n\nconst FlipCardBack = ({ item }) => {\n  return (\n    <div className=\"absolute top-0 bottom-0 left-0 flex flex-col items-start w-full p-6 bg-white rounded-lg shadow-md flip-card__side flip-card__side--back\">\n      <div className=\"z-10 flex items-center justify-center w-10 h-10 mb-2 rounded-full bg-secondary\">\n        <Icon icon={item.icon} className=\"w-2/3\" />\n      </div>\n      <div className=\"flex flex-col items-start flex-1 \">\n        {item.contactList ? (\n          item.contactList.map(contact => {\n            return (\n              <div\n                className=\"flex flex-col items-start flex-1\"\n                key={contact.name}\n              >\n                <span className=\"block mb-1 text-2xl font-semibold\">\n                  {contact.name}\n                </span>\n                <div className=\"flex-1 mb-2\">\n                  <p className=\"text-base\">{contact.text}</p>\n                </div>\n                <div className=\"flex\">\n                  <div className=\"mr-2\">\n                    <PrimaryButton outline href={contact.href}>\n                      <span className=\"text-secondary\">\n                        {contact.buttonOne}\n                      </span>\n                    </PrimaryButton>\n                  </div>\n                  <div className=\"\">\n                    <PrimaryButton outline href={contact.href}>\n                      <span className=\"text-secondary\">\n                        {contact.buttonTwo}\n                      </span>\n                    </PrimaryButton>\n                  </div>\n                </div>\n              </div>\n            )\n          })\n        ) : (\n          <span className=\"text-lg font-semibold markdown\">\n            {parse(item.contact)}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default FlipCard\n","import React from 'react'\nimport { navigate } from 'gatsby'\nimport Icon from './Icon'\nimport ModalOverlay from './ModalOverlay'\nimport SearchResults from './SearchResults'\nimport { useSearchArticlesDebounce } from 'src/core/customHooks'\n\nconst Search = () => {\n  const {\n    inputText,\n    setInputText,\n    search,\n    typing,\n  } = useSearchArticlesDebounce()\n  const { loading, error, result } = search\n\n  function handleKeyDown(event) {\n    if (event.keyCode === 13) {\n      navigate(`/search?q=${inputText}`)\n    }\n    if (event.keyCode === 27) {\n      setInputText('')\n    }\n  }\n\n  function handleClose() {\n    setInputText('')\n  }\n\n  function renderSearchResults() {\n    let component\n    switch (true) {\n      case error && true:\n        component = (\n          <div className=\"p-0 mb-5 text-lg\">\n            Search is not available at this time. Please try again later.\n          </div>\n        )\n        break\n      case result && result.data && result.data.length > 0:\n        component = <SearchResults results={result.data} />\n        break\n      default:\n        component = (\n          <div className=\"p-0 mb-5 text-lg font-semibold\">\n            Sorry, we have no matching questions\n          </div>\n        )\n        break\n    }\n    return component\n  }\n\n  return (\n    <>\n      <div className=\"relative z-30 w-full lg:w-2/3 search\">\n        <div className=\"flex items-center justify-between pl-2 pr-8 mb-4 bg-white rounded-lg shadow-2xl text-secondary\">\n          <Icon\n            icon={loading && !typing ? 'searchIconLoading' : 'searchIcon'}\n            className=\"w-6 h-6 mx-2 fill-current md:w-10 md:h-10\"\n          />\n          <input\n            name=\"faq-search\"\n            value={inputText}\n            autoComplete=\"off\"\n            data-cy=\"search-input\"\n            aria-label=\"faq search box\"\n            onKeyDown={handleKeyDown}\n            onChange={e => setInputText(e.target.value)}\n            placeholder=\"Start typing a question to search\"\n            className=\"flex-auto py-6 text-xl font-light truncate bg-transparent outline-none text-body md:text-3xl placeholder-body caret-tertiary\"\n          ></input>\n          <label htmlFor=\"faq-search\" className=\"hidden\" aria-hidden=\"true\">\n            Search Faq\n          </label>\n        </div>\n        {inputText.length > 0 && !loading ? (\n          <div\n            className=\"absolute left-0 right-0 z-10 w-full px-6 pt-6 pb-0 overflow-hidden text-left bg-white rounded-lg shadow-md\"\n            data-cy=\"search-container\"\n          >\n            {renderSearchResults()}\n          </div>\n        ) : null}\n      </div>\n      <ModalOverlay\n        isShowing={inputText.length > 0 && !loading}\n        onClick={handleClose}\n      />\n    </>\n  )\n}\n\nexport default Search\n","import React from 'react'\nimport Layout from './Layout'\nimport Search from './Search'\nimport Container from './Container'\nimport Icon from './Icon'\nimport CategoryBrowser from './CategoryBrowser'\n\nconst Header = () => {\n  return (\n    <Layout className=\"relative bg-gradient-r-primary\">\n      <div className=\"absolute w-full h-full overflow-hidden\">\n        <div className=\"absolute top-0 bottom-0 left-0 right-0 w-full\">\n          <Icon\n            icon=\"flower\"\n            className=\"h-full ml-0 mr-auto opacity-25 sm:ml-auto sm:mr-0 lg:opacity-100\"\n          />\n        </div>\n      </div>\n      <div className=\"relative w-full py-8 sm:py-16 lg:py-20\">\n        <Container>\n          <div className=\"mb-6\">\n            <h1 className=\"text-2xl font-semibold text-white md:text-3xl\">\n              Welcome to your Morrisons Help Hub\n            </h1>\n            <p className=\"text-lg text-white\">\n              Got a question? Ask away. Your Morrisons Help Hub is here to\n              answer any questions. Select your help topic or search for your\n              questions below.\n            </p>\n          </div>\n          <div className=\"mb-8 sm:mb-12\">\n            <Search />\n          </div>\n          <CategoryBrowser />\n        </Container>\n      </div>\n    </Layout>\n  )\n}\n\nexport default Header\n","import React from 'react'\nimport Layout from './Layout'\nimport Container from './Container'\nimport SubHeading from './SubHeading'\nimport FlipCard from './FlipCard'\n\nconst data = {\n  main: [\n    {\n      icon: 'mail',\n      title: 'Email Enquiries',\n      text:\n        'Copy regarding the use and purpose of contacting using the online email form. Please use our contact form:',\n      button: 'Contact form',\n    },\n    {\n      icon: 'card',\n      title: 'More Card',\n      text:\n        'Reporting your More Card lost, stolen or damaged or to change any of your personal details? You will need to action this yourself online.',\n      button: 'login',\n    },\n  ],\n  contacts: [\n    {\n      icon: 'mail',\n      title: 'Email us',\n      gtmTag: 'email us',\n      contact: '',\n      text:\n        'For feedback and questions about our services, please email us using our online forms.',\n      href: '/form/contact-us',\n      button: 'Email us',\n    },\n    {\n      icon: 'phone',\n      title: 'By Telephone',\n      gtmTag: 'call us',\n      contactList: [\n        {\n          name: 'Just before you call',\n          text: \"If you still need to contact us, we're happy to help.\",\n          number: '0345 611 6111',\n          buttonOne: \"FAQ's\",\n          buttonTwo: 'Call us',\n          href: '/call-us/',\n        },\n      ],\n      text:\n        'Please check our FAQs first as you may be able to find the answer to your query.',\n      button: 'Call us',\n    },\n    {\n      icon: 'pencil',\n      gtmTag: 'write to us',\n      title: 'By Post',\n      contact:\n        '<address>Customer Service Department<br> Wm Morrison Supermarkets Limited<br> Hilmore House, Gain Lane<br> Bradford, BD3 7DL</address>',\n      text: 'If you prefer to contact us by post, please click below.',\n      button: 'Write to us',\n    },\n  ],\n}\n\nconst GeneralEnquiries = () => {\n  return (\n    <Layout className=\"pt-8 pb-8 bg-primary-white md:pt-12 lg:py-12\">\n      <Container>\n        <SubHeading heading=\"General enquiries\" />\n        <div className=\"flex pb-6 -mx-6 overflow-x-scroll overflow-y-hidden scrolling-touch lg:overflow-x-visible lg:-mx-3\">\n          {data.contacts.map((item, index) => (\n            <div\n              className=\"flex px-6 -mx-3 lg:px-3 lg:mx-0 first:ml-0 min-w-11/12 sm:w-1/2 sm:min-w-1/2 md:min-w-5/12 lg:min-w-1/3 lg:w-1/3 md:w-5/12\"\n              key={`flip-${index}`}\n            >\n              <FlipCard item={item} index={index} />\n            </div>\n          ))}\n        </div>\n      </Container>\n    </Layout>\n  )\n}\n\nexport default GeneralEnquiries\n","import React from 'react'\nimport Img from 'gatsby-image'\nimport PropTypes from 'prop-types'\nimport Icon from './Icon'\n\nconst propTypes = {\n  img: PropTypes.object,\n  title: PropTypes.string,\n  copy: PropTypes.string,\n  href: PropTypes.string,\n  hrefCopy: PropTypes.string,\n}\n\nconst Card = props => {\n  const { img, title, copy, href, hrefCopy } = props\n  return (\n    <a href={href} className=\"w-full flex\">\n      <article className=\"w-full\">\n        <div className=\"flex flex-col h-full bg-white rounded-b-lg shadow-md transition-fast hover:shadow-lg\">\n          <Img fluid={img.childImageSharp.fluid} className=\"rounded-t-lg\" />\n          <div className=\"px-4 py-5 flex flex-col justify-between flex-auto\">\n            <div className=\"mb-4\">\n              <div className=\"mb-1\">\n                <h2 className=\"font-semibold text-2xl\">{title}</h2>\n              </div>\n              <p className=\"text-lg text-body-light\">{copy}</p>\n            </div>\n            <div className=\"text-lg inline-block\">\n              <span className=\"flex text-secondary font-semibold\">\n                <span>{hrefCopy}</span>\n                <Icon\n                  icon=\"forwardArrow\"\n                  className=\"h-4 w-4 fill-current my-auto ml-3\"\n                />\n              </span>\n            </div>\n          </div>\n        </div>\n      </article>\n    </a>\n  )\n}\n\nCard.propTypes = propTypes\n\nexport default Card\n","import React from 'react'\nimport Card from './Card'\nimport Container from './Container'\nimport SubHeading from './SubHeading'\n\nconst ReasonsGetInTouch = props => {\n  const cards = [\n    {\n      img: props.data.imageTwo,\n      title: 'Morrisons Doorstep Delivery Service',\n      copy:\n        'Find out more about our doorstep delivery service or call us on 0345 611 6111 to place an order.',\n      href:\n        'https://www.morrisons-corporate.com/media-centre/corporate-news/morrisons-introduces-new-measures-aimed-at-helping-vulnerable-and-elderly-during-crisis/',\n      hrefCopy: 'Find out more',\n    },\n    {\n      img: props.data.imageOne,\n      title: 'Careers',\n      copy: 'Find out more about a career at Morrisons.',\n      href: 'https://www.morrisons.jobs/',\n      hrefCopy: 'Explore careers',\n    },\n    {\n      img: props.data.imageThree,\n      title: 'Complaint not resolved?',\n      copy:\n        \"If you have raised a complaint with us and we haven't been able to resolve it, please let us know.\",\n      href: 'email-complaint/',\n      hrefCopy: 'Find out more',\n    },\n  ]\n  return (\n    <section className=\"block w-full pt-8 pb-20 bg-primary-lighter md:pt-12 lg:pb-24\">\n      <Container>\n        <SubHeading\n          heading=\"Other reasons to get in touch\"\n          copy=\"Find out more about working with us, plus how to get in touch if\n            you’ve got a complaint.\"\n        />\n        <div className=\"flex pb-6 -mx-6 overflow-x-scroll overflow-y-hidden scrolling-touch lg:overflow-x-visible lg:-mx-3\">\n          {cards.map((cardProps, index) => {\n            return (\n              <div\n                key={`card-${index}`}\n                className=\"flex px-6 -mx-3 lg:px-3 lg:mx-0 first:ml-0 min-w-11/12 sm:w-1/2 sm:min-w-1/2 md:min-w-5/12 lg:min-w-1/3 lg:w-1/3 md:w-5/12\"\n              >\n                <Card {...cardProps} />\n              </div>\n            )\n          })}\n        </div>\n      </Container>\n    </section>\n  )\n}\n\nexport default ReasonsGetInTouch\n","import React from 'react'\nimport { graphql } from 'gatsby'\nimport PropTypes from 'prop-types'\nimport SiteHeader from '../components/SiteHeader'\nimport Header from '../components/Header'\nimport Trending from '../components/Trending'\nimport GeneralEnquiries from '../components/GeneralEnquiries'\nimport ReasonsGetInTouch from '../components/ReasonsGetInTouch'\nimport NotificationBanner from '../components/NotificationBanner'\nimport { usePageViewTracking } from '../core'\nimport { SEO } from '../components/SEO'\n\nconst propTypes = {\n  pageContext: PropTypes.object,\n}\n\nconst Home = props => {\n  usePageViewTracking()\n  return (\n    <main>\n      <SiteHeader />\n      <NotificationBanner />\n      <Header />\n      <Trending />\n      <GeneralEnquiries />\n      <ReasonsGetInTouch {...props} />\n    </main>\n  )\n}\n\nHome.propTypes = propTypes\n\nexport default Home\n\nexport const query = graphql`\n  query {\n    imageOne: file(relativePath: { eq: \"jobs.jpg\" }) {\n      childImageSharp {\n        fluid(maxWidth: 600) {\n          ...GatsbyImageSharpFluid\n        }\n      }\n    }\n    imageTwo: file(relativePath: { eq: \"doorstep-delivery.webp\" }) {\n      childImageSharp {\n        fluid(maxWidth: 600) {\n          ...GatsbyImageSharpFluid\n        }\n      }\n    }\n    imageThree: file(relativePath: { eq: \"email-for-help.png\" }) {\n      childImageSharp {\n        fluid(maxWidth: 600) {\n          ...GatsbyImageSharpFluid\n        }\n      }\n    }\n  }\n`\n\nexport const Head = () => {\n  return (\n    <SEO\n      title=\"Help Hub - Morrisons\"\n      description=\"We’re always pleased to hear what our customers think of our stores and services, so please feel free to contact us.\"\n    />\n  )\n}\n"],"names":["props","opaque","rest","BaseButton","className","categoryMeta","useCategoryMetaData","Form","width","Select","name","options","filter","meta","category","map","value","label","onChange","navigate","formatUrl","key","rounded","href","Icon","icon","Fieldset","legend","children","Item","copy","Link","to","faqs","halvedLayout","faq","index","QuestionText","ParentPageURL","createSlug","light","outline","heading","useStaticQuery","SubHeading","FAQList","allPopularFaqs","nodes","Layout","Container","dataLayer","useSearchArticlesDebounce","inputText","setInputText","search","typing","loading","error","result","autoComplete","onKeyDown","event","keyCode","e","target","placeholder","htmlFor","length","component","data","SearchResults","results","renderSearchResults","ModalOverlay","isShowing","onClick","CategoryBrowser","window","Faces","active","item","FlipCardFront","FlipCardBack","title","text","info","PrimaryButton","button","contactList","contact","buttonOne","buttonTwo","parse","useState","setActive","gtmTag","handleInteraction","push","content","tabIndex","onKeyPress","role","main","contacts","number","img","hrefCopy","fluid","childImageSharp","cards","imageTwo","imageOne","imageThree","cardProps","usePageViewTracking","SiteHeader","NotificationBanner","Trending","Head","SEO","description"],"sourceRoot":""}