{"version":3,"file":"component---src-pages-who-we-are-imf-organization-chart-js-b95d5c02159be7e2fb63.js","mappings":"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","sources":["webpack://imf-2021/./src/components/hero.js","webpack://imf-2021/./src/components/read-next.js","webpack://imf-2021/./src/components/org-chart.js","webpack://imf-2021/./src/pages/who-we-are/imf-organization-chart.js"],"sourcesContent":["import React, { useState } from \"react\"\nimport Image from \"../components/image\"\nimport VisibilitySensor from \"react-visibility-sensor\"\n\n/* Notes: \nVideos should placed in the `public > video` folder and referenced like '/video/covid-19/example.mp4'\n*/\n\nexport default function Hero({ video, image, title, text }) {\n  const [loaded, setLoaded] = useState(false)\n  const prefersReducedMotion =\n    typeof window !== \"undefined\"\n      ? window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches\n      : false\n\n  // Only play the animation once based on the 'loaded' state\n  const onChange = isVisible => {\n    isVisible ? setLoaded(true) : setLoaded(false)\n  }\n  return (\n    <section className={video ? `hero hero--video` : `hero`}>\n      {title ? (\n        <header>\n          <h1 className=\"hero__title\">{title}</h1>{\" \"}\n          {text ? <p className=\"hero__subtitle\">{text}</p> : null}\n        </header>\n      ) : null}\n      {video || image ? (\n        <VisibilitySensor\n          onChange={onChange}\n          active={!loaded}\n          partialVisibility={true}\n          offset={{ bottom: 200 }}\n        >\n          <div\n            className={`hero__media ${\n              loaded ? \"hero__media--show\" : \"hero__media--hidden\"\n            }`}\n          >\n            {video && prefersReducedMotion && <Image path={image} />}\n            {video && !prefersReducedMotion ? (\n              <>\n                <video\n                  src={video}\n                  muted\n                  autoPlay\n                  loop\n                  playsInline\n                  controls\n                  className=\"util__desktop-only\"\n                  controlsList=\"nofullscreen nodownload\"\n                ></video>\n                <Image className=\"util__mobile-only\" path={image} />\n              </>\n            ) : image ? (\n              <Image path={image} />\n            ) : null}\n          </div>\n        </VisibilitySensor>\n      ) : null}\n    </section>\n  )\n}\n","import React, { useState } from \"react\"\nimport Image from \"../components/image\"\nimport menuData from \"../data/menu.json\"\nimport findObject from \"../helpers/find-object\"\nimport { Link } from \"gatsby\"\nimport VisibilitySensor from \"react-visibility-sensor\"\n\nexport default function ReadNext({ sectionID, pageID }) {\n  const [loaded, setLoaded] = useState(false)\n  const onChange = isVisible => {\n    isVisible ? setLoaded(true) : setLoaded(false)\n  }\n\n  const menu = findObject(menuData, \"id\", sectionID)\n  const content =\n    menu && pageID ? findObject(menu.children, \"id\", pageID) : menu\n\n  return (\n    <div className=\"container container--max\">\n      <VisibilitySensor\n        onChange={onChange}\n        partialVisibility={true}\n        offset={{ bottom: 75 }}\n      >\n        <Link\n          className={`read-next ${\n            loaded ? \"read-next--show\" : \"read-next--hidden\"\n          }`}\n          to={content.href}\n        >\n          <header>Read Next</header>\n          <div className=\"read-next__inner\">\n            {content.thumbnail && (\n              <Image\n                path={content.thumbnail}\n                alt={`Read next: ${content.name}`}\n                className=\"read-next__image\"\n              />\n            )}\n            <div className=\"read-next__inner__content\">\n              <h4>{content.name}</h4>\n              {content.deck && (\n                <p className=\"read-next__deck\">{content.deck}</p>\n              )}\n            </div>\n          </div>\n        </Link>\n      </VisibilitySensor>\n    </div>\n  )\n}\n","import React from \"react\"\nimport orgChartData from \"../data/org-chart.json\"\n\nexport default function OrgChart() {\n  const Section = ({ children, section }) => {\n    return (\n      <section className={`org-chart__section org-chart--${section.slug}`}>\n        {section.id !== \"\" && (\n          <header>\n            <h3 className=\"title--m md:title--l\">{section.id}</h3>\n          </header>\n        )}\n        <div className=\"org-chart__section__grid\">{children}</div>\n      </section>\n    )\n  }\n\n  const renderOrgChart = () => {\n    const renderPeople = people => {\n      let items = people.map((person, index) => {\n        return (\n          <div\n            key={index}\n            className={`org-chart__section__department__person ${\n              person.sub ? \"org-chart__section__department__person--sub\" : \"\"\n            }`}\n          >\n            <h6 className=\"org-chart__section__department__person__name\">\n              {person.name}\n            </h6>\n            <p className=\"org-chart__section__department__person__title\">\n              {person.title}\n            </p>\n            {person.notes && (\n              <span className=\"org-chart__section__department__person__notes\">\n                {person.notes}\n              </span>\n            )}\n          </div>\n        )\n      })\n      return items\n    }\n\n    const renderDepartments = children => {\n      let items = children.map((item, index) => {\n        return (\n          <div key={index} className=\"org-chart__section__department\">\n            <h4 className=\"org-chart__section__department__title\">{item.id}</h4>\n            {renderPeople(item.people)}\n          </div>\n        )\n      })\n      return items\n    }\n\n    const sections = orgChartData.map((section, index) => {\n      return (\n        <Section key={index} section={section}>\n          {renderDepartments(section.departments)}\n        </Section>\n      )\n    })\n    return sections\n  }\n\n  return renderOrgChart()\n}\n","import React from \"react\"\nimport Layout from \"../../components/layout\"\nimport Hero from \"../../components/hero\"\nimport OrgChart from \"../../components/org-chart\"\nimport ReadNext from \"../../components/read-next\"\n\nexport default function IMFOrganizationChart() {\n  return (\n    <Layout>\n      <section className=\"page page--pullBottom page--margin-medium\">\n        <Hero\n          title=\"Who We Are\"\n          text=\"The International Monetary Fund (IMF) is a global organization of 190 member countries set up to promote the health of the world economy.\"\n          image=\"who-we-are/imf-organization-chart/hero.jpg\"\n        />\n\n        <section className=\"org-chart\">\n          <header>\n            <h2 className=\"title--l md:title--xl\">IMF Organization Chart</h2>\n          </header>\n          <OrgChart />\n        </section>\n\n        <ol className=\"text-block__footnotes\">\n          <li>\n            Known formally as the Joint Ministerial Committee of the Boards of\n            Governors of the Bank and the Fund on the Transfer of Real Resources\n            to Developing Countries.\n          </li>\n        </ol>\n      </section>\n\n      <ReadNext\n        sectionID=\"who-we-are\"\n        pageID=\"executive-directors-management-team\"\n      />\n    </Layout>\n  )\n}\n"],"names":["Hero","video","image","title","text","useState","loaded","setLoaded","prefersReducedMotion","window","matchMedia","matches","className","onChange","isVisible","active","partialVisibility","offset","bottom","path","src","muted","autoPlay","loop","playsInline","controls","controlsList","ReadNext","sectionID","pageID","menu","findObject","menuData","content","children","Link","to","href","thumbnail","alt","name","deck","OrgChart","renderDepartments","Section","section","slug","id","map","item","index","key","people","person","sub","notes","orgChartData","departments","IMFOrganizationChart"],"sourceRoot":""}