{"version":3,"sources":["components/year-review/constants/colors.js","components/year-review/components/tooltip/YRTooltip.jsx","components/year-review/constants/config.js","components/year-review/components/barchart/YRBarChart.jsx"],"names":["dnsBlue","dnsDarkBlue","dnsLightGrey","dnsGreen","dnsBlack","dnsVlaanderenColor","dnsBrusselsColor","Colors","dnsColorsArray","dnsBeColorArray","YRTooltip","active","payload","prefix","suffix","dataNames","data","className","length","map","dataName","index","Number","isInteger","FormatGraphDataService","addCommas","twoDecimalPlaces","values","name","defaultProps","isMobile","window","innerWidth","document","documentElement","clientWidth","Config","chartHeight","margin","pieChartMargin","animationBegin","animationDuration","animationEasing","YRBarChart","style","isReady","color","tooltipSuffix","tooltipPrefix","unit","width","height","top","left","right","bottom","focusable","vertical","stroke","dataKey","tickLine","minTickGap","interval","tickFormatter","label","content","barSize","fill"],"mappings":"+FAAA,IAAMA,EAAU,UAEVC,EAAc,UACdC,EAAe,UACfC,EAAW,UACXC,EAAW,UACXC,EAAqB,UACrBC,EAAmB,UAEnBC,EAAS,CACXC,eAAgB,CACZP,EACAD,EACAI,EACAD,EAba,UAebD,GAEJO,gBAAiB,CACbL,EACAE,EACAD,GAEJL,UACAC,cACAC,eACAC,WACAC,WACAE,mBACAD,sBAGWE,O,iCChCf,wBAKMG,EAAY,SAAC,GAEZ,IADHC,EACE,EADFA,OAAQC,EACN,EADMA,QAASC,EACf,EADeA,OAAQC,EACvB,EADuBA,OAAQC,EAC/B,EAD+BA,UAEjC,GAAIJ,EAAQ,CACR,IAAMK,EAAOJ,EAAQ,GAAGA,QAExB,OACI,sBAAKK,UAAU,aAAf,UACI,8BAEQF,EAAUG,OACNH,EAAUI,KAAI,SAACC,EAAUC,GAAX,OACV,iCACI,mCAASD,EAAT,QACCE,OAAOC,UAAUP,EAAK,SAAD,OAAUK,KAC1BG,IAAuBC,UAAUT,EAAK,SAAD,OAAUK,KAC/CG,IAAuBE,iBAAiBV,EAAK,SAAD,OAAUK,KAE3DP,EACD,yBAPOM,MAWX,mCACKE,OAAOC,UAAUP,EAAKW,QACjBH,IAAuBC,UAAUT,EAAKW,QACtCH,IAAuBE,iBAAiBV,EAAKW,QAHvD,WAISb,QAKzB,gCAAMD,EAAN,IAAeG,EAAKY,WAIhC,OAAO,MAIXlB,EAAUmB,aAAe,CACrBjB,QAAS,GACTC,OAAQ,GACRC,OAAQ,GACRH,QAAQ,EACRI,UAAW,IAWAL,O,iCC7Df,IACMoB,GADgBC,OAAOC,YAAcC,SAASC,gBAAgBC,aACnC,IAE3BC,EAAS,CACXC,YAAaP,EAAW,IAAM,IAC9BQ,OAAQ,GACRC,eAAgBT,EAAW,GAAK,GAChCU,eAAgB,IAChBC,kBAAmB,KACnBC,gBAAiB,eAGNN,O,iCCZf,mEAUMO,EAAa,SAAC,GAA8B,IAA5B3B,EAA2B,EAA3BA,KAAM4B,EAAqB,EAArBA,MAAOC,EAAc,EAAdA,QAE3BC,EAIAF,EAJAE,MACAC,EAGAH,EAHAG,cACAC,EAEAJ,EAFAI,cACAC,EACAL,EADAK,KAGJ,OACI,cAAC,IAAD,CAAqBC,MAAM,OAAOC,OAAQf,IAAOC,YAAjD,SACI,eAAC,IAAD,CACIrB,KAAMA,EACNsB,OAAQ,CACJc,IAAKhB,IAAOE,OACZe,KAAMjB,IAAOE,OACbgB,MAAOlB,IAAOE,OACdiB,OAAQnB,IAAOE,QAEnBkB,UAAU,QARd,UAWI,cAAC,IAAD,CACIC,UAAU,EACVC,OAAQnD,IAAOL,aACfiD,OAAQ,KAEZ,cAAC,IAAD,CACIQ,QAAQ,OACRC,UAAU,EACVF,OAAQnD,IAAOL,eAEnB,cAAC,IAAD,CACIyD,QAAQ,SACRE,WAAY,EACZC,SAAU,EACVF,UAAU,EACVF,OAAQnD,IAAOL,aACf+C,KAAMA,EACNc,cAAe,SAAAC,GAAK,OAAIxC,IAAuBC,UAAUuC,MAE7D,cAAC,IAAD,CACIC,QACI,cAAC,IAAD,CAAWnD,OAAQiC,EAAelC,OAAQmC,MAElD,cAAC,IAAD,CACIW,QAAQ,SACRO,QAAS,GACTC,KAAMrB,EAAQF,EAAME,MAAQvC,IAAOP,QACnCwC,eAAgBJ,IAAOI,eACvBC,kBAA8C,GAA3BL,IAAOK,kBAC1BC,gBAAiBN,IAAOM,oBA/BvBG,EAAU,EAAI,MAsCnCF,EAAWd,aAAe,CACtBe,MAAO,IASID","file":"js/32.9e7bcc6a.chunk.js","sourcesContent":["const dnsBlue = '#049ee0';\nconst dnsLightBlue = '#5ED0FF';\nconst dnsDarkBlue = '#1e5fa6';\nconst dnsLightGrey = '#ededed';\nconst dnsGreen = '#008389';\nconst dnsBlack = '#1a1a1a';\nconst dnsVlaanderenColor = '#7a7a29';\nconst dnsBrusselsColor = '#55083f';\n\nconst Colors = {\n    dnsColorsArray: [\n        dnsDarkBlue,\n        dnsBlue,\n        dnsBlack,\n        dnsGreen,\n        dnsLightBlue,\n        dnsLightGrey,\n    ],\n    dnsBeColorArray: [\n        dnsBlack,\n        dnsBrusselsColor,\n        dnsVlaanderenColor,\n    ],\n    dnsBlue,\n    dnsDarkBlue,\n    dnsLightGrey,\n    dnsGreen,\n    dnsBlack,\n    dnsBrusselsColor,\n    dnsVlaanderenColor,\n};\n\nexport default Colors;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport FormatGraphDataService from 'components/year-review/services/FormatGraphDataService';\n\nconst YRTooltip = ({\n    active, payload, prefix, suffix, dataNames,\n}) => {\n    if (active) {\n        const data = payload[0].payload;\n\n        return (\n            <div className=\"yr-tooltip\">\n                <div>\n                    {\n                        dataNames.length ?\n                            dataNames.map((dataName, index) => (\n                                <span key={dataName}>\n                                    <strong>{dataName}: </strong>\n                                    {Number.isInteger(data[`values${index}`])\n                                        ? FormatGraphDataService.addCommas(data[`values${index}`])\n                                        : FormatGraphDataService.twoDecimalPlaces(data[`values${index}`])\n                                    }\n                                    {suffix}\n                                    <br />\n                                </span>))\n                            :\n                            (\n                                <strong>\n                                    {Number.isInteger(data.values)\n                                        ? FormatGraphDataService.addCommas(data.values)\n                                        : FormatGraphDataService.twoDecimalPlaces(data.values)}\n                                    {` ${suffix}`}\n                                </strong>\n                            )\n                    }\n                </div>\n                <div>{prefix} {data.name}</div>\n            </div>\n        );\n    }\n    return null;\n};\n\n\nYRTooltip.defaultProps = {\n    payload: [],\n    prefix: '',\n    suffix: '',\n    active: false,\n    dataNames: [],\n};\n\nYRTooltip.propTypes = {\n    active: PropTypes.bool,\n    payload: PropTypes.arrayOf(PropTypes.object),\n    prefix: PropTypes.string,\n    suffix: PropTypes.string,\n    dataNames: PropTypes.arrayOf(PropTypes.string),\n};\n\nexport default YRTooltip;\n","const viewportWidth = window.innerWidth || document.documentElement.clientWidth;\nconst isMobile = viewportWidth < 768;\n\nconst Config = {\n    chartHeight: isMobile ? 320 : 400,\n    margin: 10,\n    pieChartMargin: isMobile ? 90 : 20,\n    animationBegin: 500,\n    animationDuration: 1250,\n    animationEasing: 'ease-in-out',\n};\n\nexport default Config;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { BarChart, Bar, XAxis, YAxis, CartesianGrid, ResponsiveContainer, Tooltip } from 'recharts';\n\nimport YRTooltip from 'components/year-review/components/tooltip/YRTooltip';\n\nimport FormatGraphDataService from 'components/year-review/services/FormatGraphDataService';\nimport Colors from 'components/year-review/constants/colors';\nimport Config from 'components/year-review/constants/config';\n\nconst YRBarChart = ({ data, style, isReady }) => {\n    const {\n        color,\n        tooltipSuffix,\n        tooltipPrefix,\n        unit,\n    } = style;\n\n    return (\n        <ResponsiveContainer width=\"100%\" height={Config.chartHeight}>\n            <BarChart\n                data={data}\n                margin={{\n                    top: Config.margin,\n                    left: Config.margin,\n                    right: Config.margin,\n                    bottom: Config.margin,\n                }}\n                focusable=\"false\"\n                key={isReady ? 0 : 1}\n            >\n                <CartesianGrid\n                    vertical={false}\n                    stroke={Colors.dnsLightGrey}\n                    height={10}\n                />\n                <XAxis\n                    dataKey=\"name\"\n                    tickLine={false}\n                    stroke={Colors.dnsLightGrey}\n                />\n                <YAxis\n                    dataKey=\"values\"\n                    minTickGap={5}\n                    interval={0}\n                    tickLine={false}\n                    stroke={Colors.dnsLightGrey}\n                    unit={unit}\n                    tickFormatter={label => FormatGraphDataService.addCommas(label)}\n                />\n                <Tooltip\n                    content={\n                        <YRTooltip suffix={tooltipSuffix} prefix={tooltipPrefix} />}\n                />\n                <Bar\n                    dataKey=\"values\"\n                    barSize={50}\n                    fill={color ? style.color : Colors.dnsBlue}\n                    animationBegin={Config.animationBegin}\n                    animationDuration={Config.animationDuration * 0.7}\n                    animationEasing={Config.animationEasing}\n                />\n            </BarChart>\n        </ResponsiveContainer>\n    );\n};\n\nYRBarChart.defaultProps = {\n    style: {},\n};\n\nYRBarChart.propTypes = {\n    data: PropTypes.arrayOf(PropTypes.any).isRequired,\n    isReady: PropTypes.bool.isRequired,\n    style: PropTypes.objectOf(PropTypes.any),\n};\n\nexport default YRBarChart;\n"],"sourceRoot":""}