{"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/piechart/YRCustomLabel.jsx","components/year-review/components/piechart/YRCustomPieLegend.jsx","components/year-review/components/piechart/YRPieChart.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","YRCustomLabel","cx","cy","midAngle","innerRadius","outerRadius","value","colors","RADIAN","Math","PI","radius","x","cos","y","sin","fill","textAnchor","dominantBaseline","fontSize","fontWeight","YRCustomPieLegend","style","unit","payloadObj","viewBox","version","transform","d","YRPieChart","pieDiameter","isReady","pieSize","legendValue","label","legend","color","tooltipSuffix","width","height","top","bottom","left","right","focusable","content","dataKey","element","stroke","type"],"mappings":"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","file":"js/35.a6b6ace9.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';\n\nimport FormatGraphDataService from 'components/year-review/services/FormatGraphDataService';\n\nconst YRCustomLabel = ({\n    cx,\n    cy,\n    midAngle,\n    innerRadius,\n    outerRadius,\n    value,\n    data,\n    index,\n    colors,\n}) => {\n    const RADIAN = Math.PI / 180;\n    const radius = 32 + innerRadius + (outerRadius - innerRadius);\n    const x = cx + (radius * Math.cos(-midAngle * RADIAN));\n    const y = cy + (radius * Math.sin(-midAngle * RADIAN));\n\n    return (\n        <text\n            x={x}\n            y={y}\n            fill=\"#8884d8\"\n            textAnchor={x > cx ? 'start' : 'end'}\n            dominantBaseline=\"central\"\n        >\n            <tspan\n                y={y - 20}\n                x={x}\n                fontSize=\"1.5rem\"\n                fill={colors[index]}\n            >\n                {data[index].name}\n            </tspan>\n            <tspan\n                x={x}\n                y={y}\n                fill=\"#000000\"\n                fontWeight={100}\n                fontSize={12}\n            >\n                {Number.isInteger(value)\n                    ? FormatGraphDataService.addCommas(value)\n                    : FormatGraphDataService.twoDecimalPlaces(value)}%\n            </tspan>\n        </text>\n    );\n};\n\nYRCustomLabel.defaultProps = {\n    index: 0,\n    cx: 0,\n    cy: 0,\n    midAngle: 0,\n    innerRadius: 0,\n    outerRadius: 0,\n    value: 0,\n    colors: ['#000000'],\n};\n\nYRCustomLabel.propTypes = {\n    data: PropTypes.arrayOf(PropTypes.object).isRequired,\n    index: PropTypes.number,\n    cx: PropTypes.number,\n    cy: PropTypes.number,\n    midAngle: PropTypes.number,\n    innerRadius: PropTypes.number,\n    outerRadius: PropTypes.number,\n    value: PropTypes.number,\n    colors: PropTypes.arrayOf(PropTypes.string),\n};\n\nexport default YRCustomLabel;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport FormatGraphDataService from 'components/year-review/services/FormatGraphDataService';\n\nconst YRCustomPieLegend = ({ payload, style }) => {\n    const unit = style && style.unit;\n\n    return (\n        <div className=\"yr-custom-pie-legend\">\n            <ul>\n                {\n                    payload.map((payloadObj) => {\n                        const { name, values, fill } = payloadObj.payload.payload;\n\n                        return (\n                            <li className=\"yr-custom-pie-legend__item\" key={name}>\n                                <svg className=\"yr-custom-pie-legend__circle\" viewBox=\"0 0 32 32\" version=\"1.1\">\n                                    <path fill={fill} transform=\"translate(16, 16)\" d=\"M16,0A16,16,0,1,1,-16,0A16,16,0,1,1,16,0\" />\n                                </svg>\n                                <b>{name}</b>&nbsp;\n                                {FormatGraphDataService.twoDecimalPlaces(values)}\n                                {unit}\n                            </li>\n                        );\n                    })\n                }\n            </ul>\n        </div>\n    );\n};\n\nYRCustomPieLegend.defaultProps = {\n    payload: [],\n    style: {},\n};\n\nYRCustomPieLegend.propTypes = {\n    payload: PropTypes.arrayOf(PropTypes.object),\n    style: PropTypes.objectOf(PropTypes.any),\n};\n\nexport default YRCustomPieLegend;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { PieChart, Pie, ResponsiveContainer, Cell, Legend, Tooltip } from 'recharts';\n\nimport YRTooltip from 'components/year-review/components/tooltip/YRTooltip';\nimport YRCustomLabel from 'components/year-review/components/piechart/YRCustomLabel';\nimport YRCustomPieLegend from 'components/year-review/components/piechart/YRCustomPieLegend';\n\nimport Config from 'components/year-review/constants/config';\nimport Colors from 'components/year-review/constants/colors';\n\nconst YRPieChart = ({\n    data, style, isReady,\n}) => {\n    const {\n        pieSize,\n        legendValue,\n        label,\n        legend,\n        color,\n        tooltipSuffix,\n    } = style;\n\n    let pieDiameter;\n    if (pieSize) {\n        switch (pieSize) {\n            case 'MEDIUM':\n                pieDiameter = 200;\n                break;\n            case 'SMALL':\n                pieDiameter = 140;\n                break;\n            default:\n                pieDiameter = 350;\n        }\n    }\n\n    return (\n        <ResponsiveContainer width=\"100%\" height={Config.chartHeight}>\n            <PieChart\n                width={pieDiameter}\n                height={pieDiameter}\n                margin={{\n                    top: Config.margin,\n                    bottom: Config.margin,\n                    left: Config.pieChartMargin,\n                    right: Config.pieChartMargin,\n                }}\n                focusable=\"false\"\n            >\n                <Tooltip\n                    content={\n                        <YRTooltip suffix={tooltipSuffix} />}\n                />\n                <Pie\n                    data={data}\n                    cx=\"50%\"\n                    cy=\"50%\"\n                    fill=\"#8884d8\"\n                    dataKey=\"values\"\n                    label={label ? <YRCustomLabel\n                        data={data}\n                        colors={color || Colors.dnsColorsArray}\n                    /> : null}\n                    animationBegin={Config.animationBegin}\n                    animationDuration={Config.animationDuration}\n                    animationEasing={Config.animationEasing}\n                    key={isReady ? 0 : 1}\n                >\n                    {\n                        data.map((element, index) => (\n                            <Cell\n                                fill={color ? color[index] : Colors.dnsColorsArray[index]}\n                                stroke={color ? color[index] : Colors.dnsColorsArray[index]}\n                                key={`cell-${element.name}`}\n                            />\n                        ))\n                    }\n                </Pie>\n                {legend && (legendValue ?\n                    <Legend\n                        content={<YRCustomPieLegend style={style} />}\n                    />\n                    :\n                    <Legend\n                        payload={\n                            data.map((element, index) => (\n                                {\n                                    value: element.name, type: 'circle', color: color ? color[index] : Colors.dnsColorsArray[index],\n                                }\n                            ))\n                        }\n                    />)}\n            </PieChart>\n        </ResponsiveContainer>\n    );\n};\n\nYRPieChart.defaultProps = {\n    style: {},\n};\n\nYRPieChart.propTypes = {\n    data: PropTypes.arrayOf(PropTypes.any).isRequired,\n    isReady: PropTypes.bool.isRequired,\n    style: PropTypes.objectOf(PropTypes.any),\n};\n\nexport default YRPieChart;\n"],"sourceRoot":""}