{"version":3,"sources":["Slider.js","App.js","reportWebVitals.js","index.js"],"names":["ChartSlider","cards","startChart","setChartSliderShow","useState","current","setCurrent","className","onClick","e","stopPropagation","title","description","chartTitle","src","slideImage","alt","length","class","Card","card","index","setCurrentChart","handleCardClick","cardImage","Grid","props","currentChart","chartSliderShow","map","items","App","reportWebVitals","onPerfEntry","Function","then","getCLS","getFID","getFCP","getLCP","getTTFB","ReactDOM","render","StrictMode","document","getElementById"],"mappings":"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","file":"static/js/main.8107f71b.chunk.js","sourcesContent":["import React from 'react'\r\nimport { useState } from 'react';\r\n\r\nfunction ChartSlider({cards, startChart, setChartSliderShow}) {\r\n  const [current, setCurrent] = useState(startChart);\r\n  const handleNext = e => setCurrent((current + 1) % cards.length);\r\n  const handlePrev = e => {\r\n    if(current > 0)\r\n      setCurrent(current - 1);\r\n    else \r\n      setCurrent(cards.length - 1);\r\n  }\r\n  return (\r\n    <div className=\"ChartSlider\" onClick={e => {setChartSliderShow(false);}}>\r\n      <div className=\"Content\" onClick={ e => {e.stopPropagation();} }>\r\n        <div>\r\n        <div className=\"valign-wrapper\">\r\n        <div className=\"slide-key\">{current+1}</div>\r\n        <div>\r\n        <h4 className=\"title\">{cards[current].title}</h4>\r\n        <div className=\"description\">{cards[current].description}</div>\r\n        <div className=\"chart-title\">{cards[current].chartTitle}</div>\r\n        </div>\r\n        </div>\r\n        <img src={cards[current].slideImage} alt={`chart${current}`}/>\r\n        </div>\r\n        <div className=\"pager\">{current+1} of {cards.length}</div>\r\n        <div className=\"next\" onClick={handleNext}><i class=\"mck-arrow-right-icon\"/></div>\r\n        <div className=\"prev\" onClick={handlePrev}><i class=\"mck-arrow-left-icon\"/></div>\r\n        <div className=\"close\" onClick={e => setChartSliderShow(false)}><span class=\"mck-close-icon\"></span></div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\n\r\nfunction Card({card, index, setCurrentChart, setChartSliderShow}) {\r\n  const handleCardClick = (card,index) => (e) => {\r\n    setCurrentChart(index);\r\n    setChartSliderShow(true);\r\n  }\r\n\r\n  return (\r\n    <div className=\"card\"  key={index} onClick={handleCardClick(card, index)}>\r\n      <img src={card.cardImage} alt={index}/>\r\n    </div>\r\n  );\r\n\r\n}\r\n\r\nfunction Grid (props) {\r\n  const [currentChart, setCurrentChart] = useState(null);\r\n  const [chartSliderShow, setChartSliderShow] = useState(false);\r\n  return (\r\n    <div className=\"App\">\r\n      <h2 className=\"title\">12 highlights from McKinsey Global <br/>Institute 2021 research</h2>\r\n      <div className=\"info\">Click each card to learn more</div>\r\n      <div className=\"cards\">\r\n      {props.cards.map((card, index) => \r\n        <Card key={index} card={card} index={index} setCurrentChart={setCurrentChart} setChartSliderShow={setChartSliderShow}/>\r\n      )}\r\n      </div>\r\n      {\r\n        chartSliderShow && <ChartSlider cards={props.cards} startChart={currentChart} setChartSliderShow={setChartSliderShow} />\r\n      }\r\n    </div>\r\n  );\r\n\r\n}\r\n\r\nexport default Grid;\r\n","import { useState } from 'react';\r\nimport './App.css';\r\nimport Grid from './Slider.js';\r\n\r\n\r\nconst items = [\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/01.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-01.svg', 'description' : 'Acceleration of digitization and automation and other operational adjustments that businesses made to address changes imposed by the pandemic could enhance productivity and economic growth.','title' : 'Business shifts made during the pandemic could yield greater productivity','chartTitle':'Productivity has the potential to increase by roughly one percentage point annually through 2024.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/02.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-02.svg', 'description' : 'Online healthcare and grocery shopping have seen a persistent digital boom, while dining in restaurants and leisure travel are returning to prepandemic norms.','title' : 'COVID-19 has altered consumer preferences','chartTitle':'Depending on sector and geography, some new behaviors will stick while others will not.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/03.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-03.svg', 'description' : 'By 2030, 70 percent of Asia’s population may have joined the consuming class, up from 45 percent in 2020. New pockets of growth are emerging.','title' : 'Asia’s consumption is rising—and growing more complex','chartTitle':'In the next decade, 80 percent of consumption growth may come from the top two tiers of the income pyramid in Asia.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/04.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-04.svg', 'description' : 'Poor health currently costs the European economy about 15 percent of GDP, or about $2.7 trillion annually.','title' : 'Prioritizing health can deliver economic benefits','chartTitle':'Proven interventions already at hand could extend healthy, productive life spans across Europe.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/05.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-05.svg', 'description' : 'MGI delved into the balance sheets of the corporate, public, household, and financial sectors across countries and found that net worth has grown rapidly over the past two decades even as GDP growth has been sluggish. Perhaps even more striking, at a time when the economy has become more digital and intangible, the biggest driver of rising net worth is real estate.','title' : 'The world is wealthier than ever—but much of that wealth is stored in bricks and mortar','chartTitle':'Real estate accounts for two-thirds of real assets.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/06.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-06.svg', 'description' : 'Shifts in the corporate landscape over the past quarter century have altered the pathways by which the economic benefits generated by corporations flow to households.','title' : 'The contribution of business activity to GDP per capita has tripled since 1960','chartTitle':'The changing mix of company archetypes within economies has impact on capital and labor income.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/07.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-07.svg', 'description' : 'Investing more in intangibles such as intellectual property, research, technology, software, and human capital offers the potential for increased productivity—and growth.','title' : 'Intangibles drive productivity and growth ','chartTitle':'Top growers invest 2.6 times more in intangibles than low growers across sectors.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/08.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-08.svg', 'description' : 'As COVID-19 recedes, world leaders have an opportunity to focus on improving lives and livelihoods by pursuing three enormous goals: growth, sustainability, and inclusion. At times these goals reinforce and enhance each other, while at other times they counteract each other. So while many agree on the aspiration, trade-offs often become the focus—sustainability or growth, inclusion or sustainability.','title' : 'Sustainable, inclusive growth can deliver big benefits for the environment, society, and the global economy','chartTitle':'Sustainable and inclusive growth can be dynamic and self-reinforcing, but only if counteracting forces are addressed.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/09.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-09.svg', 'description' : 'Thanks to accelerating automation, remote work, and the boom in e-commerce, the future of work is arriving faster than expected. We estimate that 100 million more workers across eight major economies will need to find new roles by 2030.','title' : 'COVID-19 imposed major changes in the workplace','chartTitle':'More people may need to transition to new jobs in the post-COVID-19 scenario.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/10.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-10.svg', 'description' : 'Manufacturers have new opportunities stemming from changing global cost structures and the introduction of new technologies, materials, and processes.','title' : 'Rejuvenating traditional sectors can be an engine of growth','chartTitle':'An effective transformation of the US manufacturing sector could boost GDP by $275 billion to $460 billion while adding up to 1.5 million jobs.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/11.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-11.svg', 'description' : 'The opportunity for workforce transformation looms especially large in China. As consumption, services, and innovation replace capital investment and manufacturing as key drivers of the economy, China is rapidly moving to build its workers’ skills.','title' : 'China’s evolving economy requires a different mix of workforce skills','chartTitle':'Four levers could have a significant impact on education and skills development in China by 2030.'},\r\n  {'cardImage' : `/spContent/bespoke/2021-mgi-year-end/images/12.png`, 'slideImage' : '/spContent/bespoke/2021-mgi-year-end/images/slide-12.svg', 'description' : 'In 2021, our research documented the gaps facing Black Americans as workers, business owners, consumers, savers, and residents—and considered the economic and human potential that could be unleashed by closing them.','title' : 'Inclusion matters','chartTitle':'In the United States, achieving occupational parity would boost wages for Black workers by 30 percent annually.'},\r\n];\r\n\r\n\r\nfunction App() {\r\n  return (\r\n    <Grid cards={items}/>\r\n  );\r\n}\r\n\r\nexport default App;\r\n\r\n","const reportWebVitals = onPerfEntry => {\r\n  if (onPerfEntry && onPerfEntry instanceof Function) {\r\n    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\r\n      getCLS(onPerfEntry);\r\n      getFID(onPerfEntry);\r\n      getFCP(onPerfEntry);\r\n      getLCP(onPerfEntry);\r\n      getTTFB(onPerfEntry);\r\n    });\r\n  }\r\n};\r\n\r\nexport default reportWebVitals;\r\n","import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport './index.css';\r\nimport App from './App';\r\nimport reportWebVitals from './reportWebVitals';\r\n\r\nReactDOM.render(\r\n  <React.StrictMode>\r\n    <App />\r\n  </React.StrictMode>,\r\n  document.getElementById('root')\r\n);\r\n\r\n// If you want to start measuring performance in your app, pass a function\r\n// to log results (for example: reportWebVitals(console.log))\r\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\r\nreportWebVitals();\r\n"],"sourceRoot":""}