{"version":3,"sources":["webpack:///./src/templates/page.js"],"names":["AutoplaySlider","withAutoplay","AwesomeSlider","Page","data","location","page","ghostPage","leadership","ourLeadership","edges","services","ourServices","carousel","filter","node","tags","slug","type","codeinjection_styles","bodyClass","length","className","play","cancelOnInteraction","interval","map","i","key","data-src","feature_image","style","backgroundImage","title","dangerouslySetInnerHTML","__html","html","id"],"mappings":"2FAAA,8GAWMA,GAXN,UAWuBC,IAAaC,MA6GrBC,UAlGF,SAAC,GAAwB,IAAtBC,EAAqB,EAArBA,KAAMC,EAAe,EAAfA,SACZC,EAAOF,EAAKG,UACZC,EAAaJ,EAAKK,cAAcC,MAChCC,EAAWP,EAAKQ,YAAYF,MAC5BG,EAAWT,EAAKS,SAASH,MAAMI,QAAO,gBAAGC,EAAH,EAAGA,KAAH,MACxC,SAAUA,GAAQA,EAAKC,KAAK,GAAGC,OAASX,EAAKW,KAAO,eAGxD,OACI,oCACI,kBAAC,IAAD,CACIb,KAAMA,EACNC,SAAUA,EACVa,KAAK,YAET,kBAAC,IAAD,KACI,2BAAOA,KAAK,YAAZ,GAA2BZ,EAAKa,uBAEpC,kBAAC,IAAD,CAAQC,UAAS,QAAUd,EAAKW,MAExBJ,EAASQ,OAAS,EACd,yBAAKC,UAAU,eACX,kBAACtB,EAAD,CACIuB,MAAM,EACNC,qBAAqB,EACrBC,SAAU,KAEPZ,EAASa,KAAI,gBAAGX,EAAH,EAAGA,KAAMY,EAAT,EAASA,EAAT,OACZ,yBAAKC,IAAMD,EAAIE,WAAWd,EAAKe,eAAkBf,EAAKe,oBAKlExB,EAAKwB,eACD,yBAAKR,UAAU,kBAAkBS,MAAO,CAChCC,gBAAgB,OAAQ1B,EAAKwB,cAAd,OAInC,yBAAKR,UAAU,aACX,6BAASA,UAAU,wBACf,wBAAIA,UAAU,iBAAiBhB,EAAK2B,OAGpC,6BACIX,UAAU,qCACVY,wBAAyB,CAAEC,OAAQ7B,EAAK8B,QAG5B,iBAAd9B,EAAKW,MACH,yBAAKK,UAAU,0BACX,6BAASA,UAAU,aACdX,EAASe,KAAI,gBAAGX,EAAH,EAAGA,KAAH,OAEV,kBAAC,IAAD,CAAUa,IAAKb,EAAKsB,GAAI/B,KAAMS,WAQtC,eAAdT,EAAKW,MAAyB,kBAAC,IAAD,MAEhB,aAAdX,EAAKW,MACH,yBAAKK,UAAU,wBACX,yBAAKA,UAAU,mCACX,yBAAKA,UAAU,kCACf,yBAAKA,UAAU,2BAEnB,yBAAKA,UAAU,gCACX,8CACA,6BAASA,UAAU,mBACdd,EAAWkB,KAAI,gBAAGX,EAAH,EAAGA,KAAH,OAEZ,kBAAC,IAAD,CAAgBa,IAAKb,EAAKsB,GAAI/B,KAAMS","file":"component---src-templates-page-js-06432bd94b4b9f59666f.js","sourcesContent":["import React from 'react'\nimport PropTypes from 'prop-types'\nimport { graphql } from 'gatsby'\nimport { Helmet } from 'react-helmet'\n\nimport { Layout, LeadershipCard, PageCard, ContactForm } from '../components/common'\nimport { MetaData } from '../components/common/meta'\n\nimport AwesomeSlider from 'react-awesome-slider';\nimport withAutoplay from 'react-awesome-slider/dist/autoplay';\nimport 'react-awesome-slider/dist/styles.css';\nconst AutoplaySlider = withAutoplay(AwesomeSlider);\n\n\n/**\n* Single page (/:slug)\n*\n* This file renders a single page and loads all the content.\n*\n*/\n\n\nconst Page = ({ data, location }) => {\n    const page = data.ghostPage\n    const leadership = data.ourLeadership.edges\n    const services = data.ourServices.edges\n    const carousel = data.carousel.edges.filter(({ node }) => (\n        \"tags\" in node && node.tags[0].slug === page.slug + \"-carousel\" \n    ))\n\n    return (\n        <>\n            <MetaData\n                data={data}\n                location={location}\n                type=\"website\"\n            />\n            <Helmet>\n                <style type=\"text/css\">{`${page.codeinjection_styles}`}</style>\n            </Helmet>\n            <Layout bodyClass={`page-${page.slug}`} >\n                {\n                    carousel.length > 0 ? \n                        <div className=\"site-banner\">\n                            <AutoplaySlider\n                                play={true}\n                                cancelOnInteraction={false} // should stop playing on user interaction\n                                interval={6000}\n                            >\n                                {  carousel.map(({ node, i }) => (\n                                    <div key={ i } data-src={ node.feature_image }>{ node.feature_image }</div>\n                                ))}\n                            </AutoplaySlider>\n                        </div> \n                    :\n                        page.feature_image &&\n                            <div className=\"page-hero-image\" style={{\n                                    backgroundImage: `url(${page.feature_image})` ,\n                            }}></div>\n                }\n\n                <div className=\"container\">\n                    <article className=\"content page-content\">\n                        <h1 className=\"content-title\">{page.title}</h1>\n\n                        {/* The main page content */}\n                        <section\n                            className=\"content-body load-external-scripts\"\n                            dangerouslySetInnerHTML={{ __html: page.html }}\n                        />\n\n                        { page.slug === 'our-services' &&\n                            <div className=\"our-services-container\">\n                                <section className=\"page-feed\">\n                                    {services.map(({ node }) => (\n                                        // The tag below includes the markup for each post - components/common/PostCard.js\n                                        <PageCard key={node.id} page={node} />\n                                    ))}\n                                </section>\n                            </div>\n                        }\n                    </article>\n                </div>\n\n                { page.slug === 'contact-us' && <ContactForm /> }\n\n                { page.slug === 'about-us' &&\n                    <div className=\"leadership-container\">\n                        <div className=\"leadership-hero-image-container\">\n                            <div className=\"leadership-hero-image-overlay\"></div>\n                            <div className=\"leadership-hero-image\"></div>\n                        </div>\n                        <div className=\"container leadership-content\">\n                            <h1>Our Leadership</h1>\n                            <section className=\"leadership-feed\">\n                                {leadership.map(({ node }) => (\n                                    // The tag below includes the markup for each post - components/common/PostCard.js\n                                    <LeadershipCard key={node.id} page={node} />\n                                ))}\n                            </section>\n                        </div>\n                    </div>\n                }\n            </Layout>\n        </>\n    )\n}\n\nPage.propTypes = {\n    data: PropTypes.shape({\n        ghostPage: PropTypes.shape({\n            codeinjection_styles: PropTypes.object,\n            title: PropTypes.string.isRequired,\n            html: PropTypes.string.isRequired,\n            feature_image: PropTypes.string,\n        }).isRequired,\n    }).isRequired,\n    location: PropTypes.object.isRequired,\n}\n\nexport default Page\n\nexport const postQuery = graphql`\n    query($slug: String!) {\n        ghostPage: ghostPage(slug: { eq: $slug }) {\n            ...GhostPageFields\n        }\n        carousel: allGhostPost(filter: {tags: {elemMatch: {slug: {regex: \"/carousel/\"}}}}) {\n            edges {\n              node {\n                id\n                slug\n                tags {\n                  id\n                  slug\n                }\n                feature_image\n              }\n            }\n          }\n        ourLeadership: allGhostPost(sort: {order: ASC, fields: published_at}, filter: {tags: {elemMatch: {slug: {eq: \"our-leadership\"}}}}) {\n                edges {\n                node {\n                    id\n                    feature_image\n                    excerpt\n                    title\n                    slug\n                    html\n                }\n            }\n        }\n        ourServices: allGhostPost(sort: {order: DESC, fields: published_at}, filter: {tags: {elemMatch: {slug: {eq: \"our-services\"}}}}) {\n                edges {\n                node {\n                    id\n                    feature_image\n                    excerpt\n                    title\n                    slug\n                    html\n                }\n            }\n        }\n    }\n`\n"],"sourceRoot":""}