@bikdotai/bik-component-library 0.0.814 → 0.0.815

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackedBarDistributionChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.tsx"],"sourcesContent":["import {\n\tBarElement,\n\tCategoryScale,\n\ttype ChartData,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useCallback, useEffect, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport { GraphContainerWrapper } from './StackedBarChart.styles';\nimport {\n\tGRAPH_ORIENTATION,\n\tStackedBarDistributionGraphI,\n} from './StackedBarDistributionChart.model';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\n// Data lables are enabled globally by default, this lines disables globally and adds only when required.\n//@ts-ignore\nChartJS['defaults']['plugins']['datalabels']['display'] = false;\n\nfunction capitalizeFirstLetter(strings: string[]) {\n\treturn strings.map((string) => {\n\t\tif (string.length > 0) {\n\t\t\treturn string.charAt(0).toUpperCase() + string.slice(1);\n\t\t} else {\n\t\t\treturn string;\n\t\t}\n\t});\n}\n\nexport const StackedBarDistributionChart = (\n\tprops: StackedBarDistributionGraphI,\n) => {\n\tconst [legendMap, setLegendMap] = useState<\n\t\t{ color: string; label: string }[][]\n\t>([]);\n\tconst [mapData, setMapData] = useState<ChartData<'bar', any, string>>();\n\tconst noDataPresent = !props.data.filter((entry) => !!entry.value).length;\n\tconst dummyValues = [10, 20, 30, 40, 50, 60, 80, 100, 120];\n\n\tconst COLOR_MATRIX =\n\t\tprops.colorMatrix && props.colorMatrix.length\n\t\t\t? props.colorMatrix\n\t\t\t: [\n\t\t\t\t\t// Green Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#09A35B',\n\t\t\t\t\t\t'#33D2A1',\n\t\t\t\t\t\t'#A8E5C0',\n\t\t\t\t\t\t'#075E54',\n\t\t\t\t\t\t'#128C7E',\n\t\t\t\t\t\t'#25D366',\n\t\t\t\t\t\t'#DCF8C6',\n\t\t\t\t\t],\n\t\t\t\t\t// Pink Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#FC4183',\n\t\t\t\t\t\t'#FCA0C2',\n\t\t\t\t\t\t'#FEE3EF',\n\t\t\t\t\t\t'#F5016C',\n\t\t\t\t\t\t'#F972AD',\n\t\t\t\t\t\t'#FCAACE',\n\t\t\t\t\t\t'#FEE3EF',\n\t\t\t\t\t],\n\t\t\t\t\t// Blue Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#1B95D6',\n\t\t\t\t\t\t'#74B2E5',\n\t\t\t\t\t\t'#A0D1F1',\n\t\t\t\t\t\t'#0078D5',\n\t\t\t\t\t\t'#55A5E3',\n\t\t\t\t\t\t'#8EC3EC',\n\t\t\t\t\t\t'#C6E1F6',\n\t\t\t\t\t],\n\t\t\t\t\t// Red Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#FF4F52',\n\t\t\t\t\t\t'#FFA3A4',\n\t\t\t\t\t\t'#FFD9DA',\n\t\t\t\t\t\t'#FF0012',\n\t\t\t\t\t\t'#FF797D',\n\t\t\t\t\t\t'#FFC4C5',\n\t\t\t\t\t\t'#F9DFDF',\n\t\t\t\t\t],\n\t\t\t\t\t// Purple Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#4B2E91',\n\t\t\t\t\t\t'#7B1FA2',\n\t\t\t\t\t\t'#A77BCA',\n\t\t\t\t\t\t'#5E07BB',\n\t\t\t\t\t\t'#9E77ED',\n\t\t\t\t\t\t'#D2AEFF',\n\t\t\t\t\t\t'#EBDBFF',\n\t\t\t\t\t],\n\t\t\t  ];\n\n\tconst noDataAxisConfig = {\n\t\tmin: 0,\n\t\tmax: 200,\n\t\tstepSize: 20,\n\t};\n\tconst dataAxisConfig = {\n\t\tmin: props.minValue,\n\t\tmax: props.maxValue,\n\t\tstepSize: props.valuesStepSize,\n\t};\n\n\tconst barConfig = {\n\t\tbarPercentage: 0.4,\n\t\tcategoryPercentage: 1,\n\t\tpointStyle: 'circle',\n\t\tbarThickness: noDataPresent ? 0 : props.barThickness ?? 100,\n\t};\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\tdisplay: false,\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\tenabled: !noDataPresent,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.tooltipConfig?.labelCallback,\n\t\t\t\t\tfooter: props.tooltipConfig?.footerCallback,\n\t\t\t\t},\n\t\t\t\tfooterFont: props.tooltipConfig?.footerStyles?.footerFont,\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: (!noDataPresent && props.showTotal) ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\tformatter: (_, context) => {\n\t\t\t\t\tconst datasetIndex = context.datasetIndex;\n\t\t\t\t\tconst datasets = context.chart.data.datasets;\n\t\t\t\t\tif (datasetIndex !== datasets.length - 1) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\tconst dataIndex = context.dataIndex;\n\t\t\t\t\tlet sum = 0;\n\t\t\t\t\tfor (let i = 0; i < datasets.length; i++) {\n\t\t\t\t\t\tsum += datasets[i].data[dataIndex] ?? 0;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn props.isInternationalStore\n\t\t\t\t\t\t? truncateValueForInternationalStore(sum)\n\t\t\t\t\t\t: truncateValueForIndianStore(sum);\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: false,\n\t\t},\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' | 'x',\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\tright:\n\t\t\t\t\tprops.showTotal && props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 50\n\t\t\t\t\t\t: 0,\n\t\t\t\ttop:\n\t\t\t\t\tprops.showTotal && props.orientation != GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 25\n\t\t\t\t\t\t: 0,\n\t\t\t},\n\t\t},\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.valueTitle?.heading\n\t\t\t\t\t\t: props.labelTitle?.heading),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.valueTitle?.heading\n\t\t\t\t\t\t\t: props.labelTitle?.heading,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.valueTitle?.color\n\t\t\t\t\t\t\t: props.labelTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.bodySecondary.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: props.orientation === GRAPH_ORIENTATION.HORIZONTAL,\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize: 30,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.labelTitle?.color\n\t\t\t\t\t\t\t: props.valueTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\t...(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? noDataPresent\n\t\t\t\t\t\t\t? noDataAxisConfig\n\t\t\t\t\t\t\t: dataAxisConfig\n\t\t\t\t\t\t: {}),\n\t\t\t\t\tcallback: (value, index) => {\n\t\t\t\t\t\tif (props.orientation !== GRAPH_ORIENTATION.HORIZONTAL) {\n\t\t\t\t\t\t\treturn mapData?.labels?.[index] ?? '';\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (typeof value != 'number') {\n\t\t\t\t\t\t\treturn value;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn props.isInternationalStore\n\t\t\t\t\t\t\t? truncateValueForInternationalStore(value)\n\t\t\t\t\t\t\t: truncateValueForIndianStore(value);\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tstacked: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.labelTitle?.heading\n\t\t\t\t\t\t: props.valueTitle?.heading),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.labelTitle?.heading\n\t\t\t\t\t\t\t: props.valueTitle?.heading,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.labelTitle?.color\n\t\t\t\t\t\t\t: props.valueTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.bodySecondary.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: props.orientation !== GRAPH_ORIENTATION.HORIZONTAL,\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.valueTitle?.color\n\t\t\t\t\t\t\t: props.labelTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\t...(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? {}\n\t\t\t\t\t\t: noDataPresent\n\t\t\t\t\t\t? noDataAxisConfig\n\t\t\t\t\t\t: dataAxisConfig),\n\t\t\t\t\tcallback: (value, index) => {\n\t\t\t\t\t\tif (props.orientation === GRAPH_ORIENTATION.HORIZONTAL) {\n\t\t\t\t\t\t\treturn mapData?.labels?.[index] ?? '';\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (typeof value != 'number') {\n\t\t\t\t\t\t\treturn value;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn props.isInternationalStore\n\t\t\t\t\t\t\t? truncateValueForInternationalStore(value)\n\t\t\t\t\t\t\t: truncateValueForIndianStore(value);\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tstacked: true,\n\t\t\t},\n\t\t},\n\t\tonClick: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tconst datasetIndex = activeEls[0].datasetIndex;\n\t\t\tconst dataIndex = activeEls[0].index;\n\t\t\tconst yAxisLabel = e.chart.data.datasets[datasetIndex].label;\n\t\t\tconst xAxisLabel = e.chart.data.labels[dataIndex];\n\t\t\tprops.onBarClick(xAxisLabel, yAxisLabel);\n\t\t},\n\t\tonHover: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tif (activeEls.length) e.native.target.style.cursor = 'pointer';\n\t\t},\n\t};\n\tconst uniqueLabels = Array.from(\n\t\tnew Set(props.data.map((item) => item.label)),\n\t);\n\n\tconst data: ChartData<'bar', any, string> = {\n\t\tlabels: capitalizeFirstLetter(uniqueLabels),\n\t\tdatasets: noDataPresent\n\t\t\t? [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }]\n\t\t\t: [],\n\t};\n\n\tconst getColorForLabel = (\n\t\tlabelIndex: number,\n\t\tstackIndex: number,\n\t\tstackLength: number,\n\t) => {\n\t\tconst reducedColourRow = COLOR_MATRIX[labelIndex].slice(-stackLength);\n\t\treturn reducedColourRow[stackIndex];\n\t};\n\n\tuseEffect(() => {\n\t\tconst _legendMap: { color: string; label: string }[][] = [];\n\t\tuniqueLabels.forEach((label, labelIndex) => {\n\t\t\tconst barLegend: { color: string; label: string }[] = [];\n\t\t\tconst datasetsForLabel = props.data.filter(\n\t\t\t\t(item) => item.label === label,\n\t\t\t);\n\t\t\tif (!props.isFunnel) {\n\t\t\t\tdatasetsForLabel.sort((a, b) => b.value - a.value);\n\t\t\t}\n\t\t\tdatasetsForLabel.forEach((item, stackIndex) => {\n\t\t\t\tconst color = getColorForLabel(\n\t\t\t\t\tlabelIndex,\n\t\t\t\t\tstackIndex,\n\t\t\t\t\tdatasetsForLabel.length,\n\t\t\t\t);\n\t\t\t\tbarLegend.push({\n\t\t\t\t\tcolor: color,\n\t\t\t\t\tlabel: item.stackLabel,\n\t\t\t\t});\n\t\t\t\tconst newData = {\n\t\t\t\t\tlabel: item.stackLabel,\n\t\t\t\t\tbackgroundColor: color,\n\t\t\t\t\tdata: Array(uniqueLabels.length).fill(0),\n\t\t\t\t\t...barConfig,\n\t\t\t\t};\n\t\t\t\tnewData.data[labelIndex] = item.value;\n\t\t\t\tdata.datasets.push(newData);\n\t\t\t});\n\t\t\t_legendMap.push(barLegend);\n\t\t});\n\t\tsetLegendMap(_legendMap);\n\t\tsetMapData(data);\n\t}, [props.data]);\n\n\tconst renderLegendFunnel = useCallback(() => {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tgap: '10px',\n\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{getFunnelLegend().map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div className=\"legend__row\" key={_item.label.replace(' ', '_')}>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"legend__palette\"\n\t\t\t\t\t\t\t\tstyle={{ backgroundColor: _item.color }}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<BodyTiny color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t{_item.label}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t);\n\t}, [legendMap]);\n\n\tconst getFunnelLegend = () => {\n\t\tconst barLegend: { color: string; label: string }[] = [];\n\t\tlegendMap.forEach((stack, stackIndex) => {\n\t\t\tbarLegend.push({\n\t\t\t\tcolor: stack[0].color,\n\t\t\t\tlabel: uniqueLabels[stackIndex],\n\t\t\t});\n\t\t});\n\t\treturn barLegend;\n\t};\n\n\tif (!mapData) {\n\t\treturn <></>;\n\t}\n\n\tconst renderLegend = () => {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{legendMap.map((_category, index) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div className=\"legend__set\" key={`Legend_set_${index}`}>\n\t\t\t\t\t\t\t{_category.map((_item) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tclassName=\"legend__row\"\n\t\t\t\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"legend__palette\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ backgroundColor: _item.color }}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<BodyTiny color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t\t\t\t{_item.label}\n\t\t\t\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t);\n\t};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tchartWrapperHeight={props.chartWrapperHeight}\n\t\t\tisFunnel={props.isFunnel}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div style={{ marginBottom: 24 }}>\n\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\n\t\t\t\t{(props.showLegend ?? true) && props.isFunnel && renderLegendFunnel()}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\twidth: props.graphCanvasWidth ?? '100%',\n\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={mapData} />\n\t\t\t\t</div>\n\t\t\t\t{(props.showLegend ?? true) && !props.isFunnel && renderLegend()}\n\t\t\t</div>\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","capitalizeFirstLetter","strings","string","StackedBarDistributionChart","props","legendMap","setLegendMap","useState","mapData","setMapData","noDataPresent","entry","dummyValues","COLOR_MATRIX","noDataAxisConfig","dataAxisConfig","barConfig","options","_","context","datasetIndex","datasets","dataIndex","sum","i","truncateValueForInternationalStore","truncateValueForIndianStore","COLORS","GRAPH_ORIENTATION","FONTS","value","index","e","activeEls","yAxisLabel","xAxisLabel","uniqueLabels","item","data","getColorForLabel","labelIndex","stackIndex","stackLength","useEffect","_legendMap","label","barLegend","datasetsForLabel","a","b","color","newData","renderLegendFunnel","useCallback","jsx","getFunnelLegend","_item","jsxs","BodyTiny","stack","Fragment","renderLegend","_category","GraphContainerWrapper","TitleRegular","Bar"],"mappings":"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"}
+{"version":3,"file":"StackedBarDistributionChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.tsx"],"sourcesContent":["import {\n\tBarElement,\n\tCategoryScale,\n\ttype ChartData,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useCallback, useEffect, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport { GraphContainerWrapper } from './StackedBarChart.styles';\nimport {\n\tGRAPH_ORIENTATION,\n\tStackedBarDistributionGraphI,\n} from './StackedBarDistributionChart.model';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\n// Data lables are enabled globally by default, this lines disables globally and adds only when required.\n//@ts-ignore\nChartJS['defaults']['plugins']['datalabels']['display'] = false;\n\nfunction capitalizeFirstLetter(strings: string[]) {\n\treturn strings.map((string) => {\n\t\tif (string.length > 0) {\n\t\t\treturn string.charAt(0).toUpperCase() + string.slice(1);\n\t\t} else {\n\t\t\treturn string;\n\t\t}\n\t});\n}\n\nexport const StackedBarDistributionChart = (\n\tprops: StackedBarDistributionGraphI,\n) => {\n\tconst [legendMap, setLegendMap] = useState<\n\t\t{ color: string; label: string }[][]\n\t>([]);\n\tconst [mapData, setMapData] = useState<ChartData<'bar', any, string>>();\n\tconst noDataPresent = !props.data.filter((entry) => !!entry.value).length;\n\tconst dummyValues = [10, 20, 30, 40, 50, 60, 80, 100, 120];\n\n\tconst COLOR_MATRIX =\n\t\tprops.colorMatrix && props.colorMatrix.length\n\t\t\t? props.colorMatrix\n\t\t\t: [\n\t\t\t\t\t// Green Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#09A35B',\n\t\t\t\t\t\t'#33D2A1',\n\t\t\t\t\t\t'#A8E5C0',\n\t\t\t\t\t\t'#075E54',\n\t\t\t\t\t\t'#128C7E',\n\t\t\t\t\t\t'#25D366',\n\t\t\t\t\t\t'#DCF8C6',\n\t\t\t\t\t],\n\t\t\t\t\t// Pink Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#FC4183',\n\t\t\t\t\t\t'#FCA0C2',\n\t\t\t\t\t\t'#FEE3EF',\n\t\t\t\t\t\t'#F5016C',\n\t\t\t\t\t\t'#F972AD',\n\t\t\t\t\t\t'#FCAACE',\n\t\t\t\t\t\t'#FEE3EF',\n\t\t\t\t\t],\n\t\t\t\t\t// Blue Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#1B95D6',\n\t\t\t\t\t\t'#74B2E5',\n\t\t\t\t\t\t'#A0D1F1',\n\t\t\t\t\t\t'#0078D5',\n\t\t\t\t\t\t'#55A5E3',\n\t\t\t\t\t\t'#8EC3EC',\n\t\t\t\t\t\t'#C6E1F6',\n\t\t\t\t\t],\n\t\t\t\t\t// Red Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#FF4F52',\n\t\t\t\t\t\t'#FFA3A4',\n\t\t\t\t\t\t'#FFD9DA',\n\t\t\t\t\t\t'#FF0012',\n\t\t\t\t\t\t'#FF797D',\n\t\t\t\t\t\t'#FFC4C5',\n\t\t\t\t\t\t'#F9DFDF',\n\t\t\t\t\t],\n\t\t\t\t\t// Purple Shades\n\t\t\t\t\t[\n\t\t\t\t\t\t'#4B2E91',\n\t\t\t\t\t\t'#7B1FA2',\n\t\t\t\t\t\t'#A77BCA',\n\t\t\t\t\t\t'#5E07BB',\n\t\t\t\t\t\t'#9E77ED',\n\t\t\t\t\t\t'#D2AEFF',\n\t\t\t\t\t\t'#EBDBFF',\n\t\t\t\t\t],\n\t\t\t  ];\n\n\tconst noDataAxisConfig = {\n\t\tmin: 0,\n\t\tmax: 200,\n\t\tstepSize: 20,\n\t};\n\tconst dataAxisConfig = {\n\t\tmin: props.minValue,\n\t\tmax: props.maxValue,\n\t\tstepSize: props.valuesStepSize,\n\t};\n\n\tconst barConfig = {\n\t\tbarPercentage: 0.4,\n\t\tcategoryPercentage: 1,\n\t\tpointStyle: 'circle',\n\t\tbarThickness: noDataPresent ? 0 : props.barThickness ?? 100,\n\t};\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\tdisplay: false,\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\tenabled: !noDataPresent,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.tooltipConfig?.labelCallback,\n\t\t\t\t\tfooter: props.tooltipConfig?.footerCallback,\n\t\t\t\t},\n\t\t\t\tfooterFont: props.tooltipConfig?.footerStyles?.footerFont,\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: (!noDataPresent && props.showTotal) ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\tformatter: (_, context) => {\n\t\t\t\t\tconst datasetIndex = context.datasetIndex;\n\t\t\t\t\tconst datasets = context.chart.data.datasets;\n\t\t\t\t\tif (datasetIndex !== datasets.length - 1) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\tconst dataIndex = context.dataIndex;\n\t\t\t\t\tlet sum = 0;\n\t\t\t\t\tfor (let i = 0; i < datasets.length; i++) {\n\t\t\t\t\t\tsum += datasets[i].data[dataIndex] ?? 0;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn props.isInternationalStore\n\t\t\t\t\t\t? truncateValueForInternationalStore(sum)\n\t\t\t\t\t\t: truncateValueForIndianStore(sum);\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: false,\n\t\t},\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' | 'x',\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\tright:\n\t\t\t\t\tprops.showTotal && props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 50\n\t\t\t\t\t\t: 0,\n\t\t\t\ttop:\n\t\t\t\t\tprops.showTotal && props.orientation != GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 25\n\t\t\t\t\t\t: 0,\n\t\t\t},\n\t\t},\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.valueTitle?.heading\n\t\t\t\t\t\t: props.labelTitle?.heading),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.valueTitle?.heading\n\t\t\t\t\t\t\t: props.labelTitle?.heading,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.valueTitle?.color\n\t\t\t\t\t\t\t: props.labelTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.bodySecondary.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: props.orientation === GRAPH_ORIENTATION.HORIZONTAL,\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize: 30,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.labelTitle?.color\n\t\t\t\t\t\t\t: props.valueTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\t...(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? noDataPresent\n\t\t\t\t\t\t\t? noDataAxisConfig\n\t\t\t\t\t\t\t: dataAxisConfig\n\t\t\t\t\t\t: {}),\n\t\t\t\t\tcallback: (value, index) => {\n\t\t\t\t\t\tif (props.orientation !== GRAPH_ORIENTATION.HORIZONTAL) {\n\t\t\t\t\t\t\treturn mapData?.labels?.[index] ?? '';\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (typeof value != 'number') {\n\t\t\t\t\t\t\treturn value;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn props.isInternationalStore\n\t\t\t\t\t\t\t? truncateValueForInternationalStore(value)\n\t\t\t\t\t\t\t: truncateValueForIndianStore(value);\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tstacked: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.labelTitle?.heading\n\t\t\t\t\t\t: props.valueTitle?.heading),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.labelTitle?.heading\n\t\t\t\t\t\t\t: props.valueTitle?.heading,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.labelTitle?.color\n\t\t\t\t\t\t\t: props.valueTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.bodySecondary.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: props.orientation !== GRAPH_ORIENTATION.HORIZONTAL,\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.valueTitle?.color\n\t\t\t\t\t\t\t: props.labelTitle?.color) ?? COLORS.content.secondary,\n\t\t\t\t\t...(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? {}\n\t\t\t\t\t\t: noDataPresent\n\t\t\t\t\t\t? noDataAxisConfig\n\t\t\t\t\t\t: dataAxisConfig),\n\t\t\t\t\tcallback: (value, index) => {\n\t\t\t\t\t\tif (props.orientation === GRAPH_ORIENTATION.HORIZONTAL) {\n\t\t\t\t\t\t\treturn mapData?.labels?.[index] ?? '';\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (typeof value != 'number') {\n\t\t\t\t\t\t\treturn value;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn props.isInternationalStore\n\t\t\t\t\t\t\t? truncateValueForInternationalStore(value)\n\t\t\t\t\t\t\t: truncateValueForIndianStore(value);\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tstacked: true,\n\t\t\t},\n\t\t},\n\t\tonClick: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tconst datasetIndex = activeEls[0].datasetIndex;\n\t\t\tconst dataIndex = activeEls[0].index;\n\t\t\tconst yAxisLabel = e.chart.data.datasets[datasetIndex].label;\n\t\t\tconst xAxisLabel = e.chart.data.labels[dataIndex];\n\t\t\tprops.onBarClick(xAxisLabel, yAxisLabel);\n\t\t},\n\t\tonHover: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tif (activeEls.length) e.native.target.style.cursor = 'pointer';\n\t\t},\n\t};\n\tconst uniqueLabels = Array.from(\n\t\tnew Set(props.data.map((item) => item.label)),\n\t);\n\n\tconst data: ChartData<'bar', any, string> = {\n\t\tlabels: capitalizeFirstLetter(uniqueLabels),\n\t\tdatasets: noDataPresent\n\t\t\t? [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }]\n\t\t\t: [],\n\t};\n\n\tconst getColorForLabel = (\n\t\tlabelIndex: number,\n\t\tstackIndex: number,\n\t\tstackLength: number,\n\t) => {\n\t\tconst reducedColourRow = COLOR_MATRIX[labelIndex].slice(-stackLength);\n\t\treturn reducedColourRow[stackIndex];\n\t};\n\n\tuseEffect(() => {\n\t\tconst _legendMap: { color: string; label: string }[][] = [];\n\t\tuniqueLabels.forEach((label, labelIndex) => {\n\t\t\tconst barLegend: { color: string; label: string }[] = [];\n\t\t\tconst datasetsForLabel = props.data.filter(\n\t\t\t\t(item) => item.label === label,\n\t\t\t);\n\t\t\tif (!props.isFunnel) {\n\t\t\t\tdatasetsForLabel.sort((a, b) => b.value - a.value);\n\t\t\t}\n\t\t\tdatasetsForLabel.forEach((item, stackIndex) => {\n\t\t\t\tconst color = getColorForLabel(\n\t\t\t\t\tlabelIndex,\n\t\t\t\t\tstackIndex,\n\t\t\t\t\tdatasetsForLabel.length,\n\t\t\t\t);\n\t\t\t\tbarLegend.push({\n\t\t\t\t\tcolor: color,\n\t\t\t\t\tlabel: item.stackLabel,\n\t\t\t\t});\n\t\t\t\tconst newData = {\n\t\t\t\t\tlabel: item.stackLabel,\n\t\t\t\t\tbackgroundColor: color,\n\t\t\t\t\tdata: Array(uniqueLabels.length).fill(0),\n\t\t\t\t\t...barConfig,\n\t\t\t\t};\n\t\t\t\tnewData.data[labelIndex] = item.value;\n\t\t\t\tdata.datasets.push(newData);\n\t\t\t});\n\t\t\t_legendMap.push(barLegend);\n\t\t});\n\t\tsetLegendMap(_legendMap);\n\t\tsetMapData(data);\n\t}, [props.data]);\n\n\tconst renderLegendFunnel = useCallback(() => {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tgap: '10px',\n\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{getFunnelLegend().map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div className=\"legend__row\" key={_item.label.replace(' ', '_')}>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"legend__palette\"\n\t\t\t\t\t\t\t\tstyle={{ backgroundColor: _item.color }}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<BodyTiny color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t{_item.label}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t);\n\t}, [legendMap]);\n\n\tconst getFunnelLegend = () => {\n\t\tconst barLegend: { color: string; label: string }[] = [];\n\t\tlegendMap.forEach((stack, stackIndex) => {\n\t\t\tbarLegend.push({\n\t\t\t\tcolor: stack[0].color,\n\t\t\t\tlabel: uniqueLabels[stackIndex],\n\t\t\t});\n\t\t});\n\t\treturn barLegend;\n\t};\n\n\tif (!mapData) {\n\t\treturn <></>;\n\t}\n\n\tconst renderLegend = () => {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{legendMap.map((_category, index) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div className=\"legend__set\" key={`Legend_set_${index}`}>\n\t\t\t\t\t\t\t{_category.map((_item) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tclassName=\"legend__row\"\n\t\t\t\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"legend__palette\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ backgroundColor: _item.color }}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<BodyTiny color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t\t\t\t{_item.label}\n\t\t\t\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t);\n\t};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tchartWrapperHeight={props.chartWrapperHeight}\n\t\t\tisFunnel={props.isFunnel}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div style={{ marginBottom: 24 }}>\n\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\n\t\t\t\t{(props.showLegend ?? true) && props.isFunnel && renderLegendFunnel()}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\twidth: props.graphCanvasWidth ?? '100%',\n\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={mapData} />\n\t\t\t\t</div>\n\t\t\t\t{(props.showLegend ?? true) && !props.isFunnel && renderLegend()}\n\t\t\t</div>\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","capitalizeFirstLetter","strings","string","StackedBarDistributionChart","props","legendMap","setLegendMap","useState","mapData","setMapData","noDataPresent","entry","dummyValues","COLOR_MATRIX","noDataAxisConfig","dataAxisConfig","barConfig","options","_","context","datasetIndex","datasets","dataIndex","sum","i","truncateValueForInternationalStore","truncateValueForIndianStore","COLORS","GRAPH_ORIENTATION","FONTS","value","index","e","activeEls","yAxisLabel","xAxisLabel","uniqueLabels","item","data","getColorForLabel","labelIndex","stackIndex","stackLength","useEffect","_legendMap","label","barLegend","datasetsForLabel","a","b","color","newData","renderLegendFunnel","useCallback","jsx","getFunnelLegend","_item","jsxs","BodyTiny","stack","Fragment","renderLegend","_category","GraphContainerWrapper","TitleRegular","Bar"],"mappings":"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"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.js

@@ -1,26 +1,26 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),p=require("../../../../constants/Theme.js"),d=e.div`
-	background-color: ${p.COLORS.surface.standard};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("styled-components"),a=require("../../../../constants/Theme.js"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=d(p),t=r.default.div`
+	background-color: ${a.COLORS.surface.standard};
 	padding: 0;
-`,a=e.div`
+`,o=r.default.div`
 	display: flex;
 	flex-direction: row;
 	gap: 10px;
 	padding: 0px 24px 12px 24px;
 	justify-content: flex-end;
 	flex-wrap: wrap;
-`,o=e.div`
+`,n=r.default.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
 	margin-top: 4px;
-`,n=e.div`
-	background-color: ${r=>r.color};
+`,l=r.default.div`
+	background-color: ${e=>e.color};
 	width: 16px;
 	height: 16px;
 	border-radius: 2px;
-`,i=e.div`
+`,i=r.default.div`
 	display: flex;
 	flex-direction: column;
 	gap: 2px;
-`;exports.GraphContainerWrapper=d;exports.GraphWrapper=i;exports.LegendColorBox=n;exports.LegendMiddleWrapper=o;exports.LegendsWrapper=a;
+`;exports.GraphContainerWrapper=t;exports.GraphWrapper=i;exports.LegendColorBox=l;exports.LegendMiddleWrapper=n;exports.LegendsWrapper=o;
 //# sourceMappingURL=VerticalBarAndLinearGraph.styles.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalBarAndLinearGraph.styles.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const GraphContainerWrapper = styled.div`\n\tbackground-color: ${COLORS.surface.standard};\n\tpadding: 0;\n`;\n\nexport const LegendsWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 10px;\n\tpadding: 0px 24px 12px 24px;\n\tjustify-content: flex-end;\n\tflex-wrap: wrap;\n`;\n\nexport const LegendMiddleWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tmargin-top: 4px;\n`;\n\nexport const LegendColorBox = styled.div<{ color: string }>`\n\tbackground-color: ${(props) => props.color};\n\twidth: 16px;\n\theight: 16px;\n\tborder-radius: 2px;\n`;\n\nexport const GraphWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 2px;\n`;\n"],"names":["GraphContainerWrapper","styled","COLORS","LegendsWrapper","LegendMiddleWrapper","LegendColorBox","props","GraphWrapper"],"mappings":"iKAGaA,EAAwBC,EAAO;AAAA,qBACvBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA,EAI/BC,EAAiBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASxBG,EAAsBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAO7BI,EAAiBJ,EAAO;AAAA,qBACfK,GAAUA,EAAM,KAAK;AAAA;AAAA;AAAA;AAAA,EAM9BC,EAAeN,EAAO;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"VerticalBarAndLinearGraph.styles.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const GraphContainerWrapper = styled.div`\n\tbackground-color: ${COLORS.surface.standard};\n\tpadding: 0;\n`;\n\nexport const LegendsWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 10px;\n\tpadding: 0px 24px 12px 24px;\n\tjustify-content: flex-end;\n\tflex-wrap: wrap;\n`;\n\nexport const LegendMiddleWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tmargin-top: 4px;\n`;\n\nexport const LegendColorBox = styled.div<{ color: string }>`\n\tbackground-color: ${(props) => props.color};\n\twidth: 16px;\n\theight: 16px;\n\tborder-radius: 2px;\n`;\n\nexport const GraphWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 2px;\n`;\n"],"names":["GraphContainerWrapper","styled","COLORS","LegendsWrapper","LegendMiddleWrapper","LegendColorBox","props","GraphWrapper"],"mappings":"gOAGaA,EAAwBC,EAAAA,QAAO;AAAA,qBACvBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA,EAI/BC,EAAiBF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASxBG,EAAsBH,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAO7BI,EAAiBJ,EAAAA,QAAO;AAAA,qBACfK,GAAUA,EAAM,KAAK;AAAA;AAAA;AAAA;AAAA,EAM9BC,EAAeN,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),L=require("../../../../assets/icons/ChartBar.svg.js"),D=require("../../../../assets/icons/ChartPie.svg.js"),F=require("../../../../assets/icons/maximize.svg.js"),g=require("chart.js"),v=require("chartjs-plugin-datalabels"),C=require("react"),P=require("react-chartjs-2"),q=require("../../../TypographyStyle.js"),e=require("../../../../constants/Theme.js"),w=require("./VerticalGraph.styles.js"),y=require("../../../icon-button/IconButton.js"),B=require("../../../modals/styledModal.js");g.Chart.register(g.CategoryScale,g.LinearScale,g.BarElement,g.Tooltip,v);const I=t=>{const{PieChartComponent:A}=t,[O,f]=C.useState(!1),[d,b]=C.useState(!1),[p,z]=C.useState();C.useEffect(()=>{const o=[];d&&(t.popupData?.xAxis.data.forEach((a,n)=>{o.push({name:a.toString(),count:Number(t.popupData?.yAxis.data[n])||0})}),z(o))},[d,t.popupData?.xAxis.data,t.popupData?.yAxis.data]);const m=[250,1e3,800,1500,300,600],u=t.yAxis.data.findIndex(o=>o!==0)===-1,S=t.popupData?.yAxis.data.findIndex(o=>o!==0)===-1,k={min:0,max:2e3,stepSize:200},j={responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!u,callbacks:{label:t.yAxis.toolTipCallback}},datalabels:{display:t.showTotal??!1,anchor:"end",align:"end",clamp:!0,color:e.COLORS.content.secondary}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{display:!1,borderColor:e.COLORS.background.base},ticks:{fontSize:e.FONTS.caption.fontSize,color:t.yAxis.labelColor??e.COLORS.content.secondary}},y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{borderColor:"white",color:e.COLORS.background.base},ticks:{callback:t.yAxis.ticksCallback,fontSize:e.FONTS.caption.fontSize,color:t.xAxis.labelColor??e.COLORS.content.secondary,...u?k:{}}}},maintainAspectRatio:!1},T={responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!S,callbacks:{label:t.yAxis.toolTipCallback}},datalabels:{display:t.showTotal??!1,anchor:"end",align:"end",clamp:!0,color:e.COLORS.content.secondary}},scales:{x:{title:{display:!!t.popupData?.xAxis.title,text:t.popupData?.xAxis.title,color:t.popupData?.xAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{display:!1,borderColor:e.COLORS.background.base},ticks:{fontSize:e.FONTS.caption.fontSize,color:t.popupData?.yAxis.labelColor??e.COLORS.content.secondary}},y:{title:{display:!!t.popupData?.yAxis.title,text:t.popupData?.yAxis.title,color:t.popupData?.yAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{borderColor:"white",color:e.COLORS.background.base},ticks:{callback:t.popupData?.yAxis.ticksCallback,fontSize:e.FONTS.caption.fontSize,color:t.popupData?.xAxis.labelColor??e.COLORS.content.secondary,...S?k:{}}}},maintainAspectRatio:!1},R={labels:t.xAxis.data.map(o=>o.toString()),datasets:[{data:u?m:t.yAxis.data,backgroundColor:o=>{const a=t.barColorRGBA;let n=[];const l=t.xAxis.data.length;if(u)return"rgba(0,0,0,0)";if(t.isFunnel){let r=+(l>10?.1:(1/l).toFixed(2));const h=`rgba(${a.r}, ${a.g}, ${a.b}`;for(let s=1;s<l+1;s++){let c="";s>10?c=`${h},1)`:(c=`${h},${r})`,r=r+.1),n.push(c)}}else{const x=`rgba(${a.r}, ${a.g}, ${a.b}, ${a.a??"1"})`;n=Array(l).fill(x)}return n},barPercentage:.4,categoryPercentage:1,borderRadius:4}]},$={labels:t.popupData?.xAxis.data.map(o=>o.toString()),datasets:[{data:S?m:t.popupData?.yAxis.data,backgroundColor:o=>{const a=t.barColorRGBA;let n=[];const l=t.popupData?.xAxis.data.length||0;if(u)return"rgba(0,0,0,0)";if(t.isFunnel){let r=+(l>10?.1:(1/l).toFixed(2));const h=`rgba(${a.r}, ${a.g}, ${a.b}`;for(let s=1;s<l+1;s++){let c="";s>10?c=`${h},1)`:(c=`${h},${r})`,r=r+.1),n.push(c)}}else{const x=`rgba(${a.r}, ${a.g}, ${a.b}, ${a.a??"1"})`;n=Array(l).fill(x)}return n},barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return i.jsxs(w.GraphContainerWrapper,{padding:t.outerPadding,children:[t.chartHeading&&i.jsx("div",{style:{marginBottom:24},children:i.jsx(q.TitleMedium,{color:t.chartHeading.color??e.COLORS.content.secondary,children:t.chartHeading.heading})}),i.jsxs("div",{style:{display:"flex",justifyContent:"flex-end"},children:[t.showConvertToPieChart&&i.jsx(y.IconButton,{Icon:D.default,onClick:()=>{b(!0),f(!0)}}),t.allowChartPopup&&i.jsx(y.IconButton,{Icon:F.default,onClick:()=>{f(!0)}})]}),i.jsx("div",{style:{height:t.graphCanvasHeight??500},children:i.jsx(P.Bar,{options:j,data:R})}),O&&i.jsxs(B.StyledModal,{open:O,onClose:()=>{f(!1),b(!1)},closeOnOutsideClick:!0,headingTitle:t.popupData?.chartHeading,width:"75%",headerRightCustomElement:t.showConvertToPieChart?d?i.jsx(y.IconButton,{Icon:L.default,onClick:()=>{b(!1)}}):i.jsx(y.IconButton,{Icon:D.default,onClick:()=>{b(!0)}}):null,headerLeftCustomElement:t.popupData?.headerLeftCustomElement,children:[d&&p&&A&&i.jsx("div",{style:{height:t.graphCanvasHeight??500,padding:"24px"},children:i.jsx(C.Suspense,{fallback:i.jsx("div",{children:"Loading..."}),children:i.jsx(A,{slices:p,size:t.pieChartSize,hideTitle:!0,currencyProps:t.currencyProps})})}),!d&&i.jsx("div",{style:{height:t.graphCanvasHeight??500},children:i.jsx(P.Bar,{options:T,data:$})})]})]})};exports.VerticalGraph=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),L=require("../../../../assets/icons/ChartBar.svg.js"),k=require("../../../../assets/icons/ChartPie.svg.js"),F=require("../../../../assets/icons/maximize.svg.js"),g=require("chart.js"),v=require("chartjs-plugin-datalabels"),C=require("react"),P=require("react-chartjs-2"),q=require("../../../TypographyStyle.js"),e=require("../../../../constants/Theme.js"),w=require("./VerticalGraph.styles.js"),f=require("../../../icon-button/IconButton.js"),B=require("../../../modals/styledModal.js"),I=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},N=I(v);g.Chart.register(g.CategoryScale,g.LinearScale,g.BarElement,g.Tooltip,N.default);const H=t=>{const{PieChartComponent:A}=t,[p,y]=C.useState(!1),[d,b]=C.useState(!1),[O,z]=C.useState();C.useEffect(()=>{const i=[];d&&(t.popupData?.xAxis.data.forEach((a,n)=>{i.push({name:a.toString(),count:Number(t.popupData?.yAxis.data[n])||0})}),z(i))},[d,t.popupData?.xAxis.data,t.popupData?.yAxis.data]);const m=[250,1e3,800,1500,300,600],u=t.yAxis.data.findIndex(i=>i!==0)===-1,S=t.popupData?.yAxis.data.findIndex(i=>i!==0)===-1,D={min:0,max:2e3,stepSize:200},j={responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!u,callbacks:{label:t.yAxis.toolTipCallback}},datalabels:{display:t.showTotal??!1,anchor:"end",align:"end",clamp:!0,color:e.COLORS.content.secondary}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{display:!1,borderColor:e.COLORS.background.base},ticks:{fontSize:e.FONTS.caption.fontSize,color:t.yAxis.labelColor??e.COLORS.content.secondary}},y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{borderColor:"white",color:e.COLORS.background.base},ticks:{callback:t.yAxis.ticksCallback,fontSize:e.FONTS.caption.fontSize,color:t.xAxis.labelColor??e.COLORS.content.secondary,...u?D:{}}}},maintainAspectRatio:!1},T={responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!S,callbacks:{label:t.yAxis.toolTipCallback}},datalabels:{display:t.showTotal??!1,anchor:"end",align:"end",clamp:!0,color:e.COLORS.content.secondary}},scales:{x:{title:{display:!!t.popupData?.xAxis.title,text:t.popupData?.xAxis.title,color:t.popupData?.xAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{display:!1,borderColor:e.COLORS.background.base},ticks:{fontSize:e.FONTS.caption.fontSize,color:t.popupData?.yAxis.labelColor??e.COLORS.content.secondary}},y:{title:{display:!!t.popupData?.yAxis.title,text:t.popupData?.yAxis.title,color:t.popupData?.yAxis.titleColor,font:{size:e.FONTS.caption.fontSize}},grid:{borderColor:"white",color:e.COLORS.background.base},ticks:{callback:t.popupData?.yAxis.ticksCallback,fontSize:e.FONTS.caption.fontSize,color:t.popupData?.xAxis.labelColor??e.COLORS.content.secondary,...S?D:{}}}},maintainAspectRatio:!1},R={labels:t.xAxis.data.map(i=>i.toString()),datasets:[{data:u?m:t.yAxis.data,backgroundColor:i=>{const a=t.barColorRGBA;let n=[];const l=t.xAxis.data.length;if(u)return"rgba(0,0,0,0)";if(t.isFunnel){let r=+(l>10?.1:(1/l).toFixed(2));const h=`rgba(${a.r}, ${a.g}, ${a.b}`;for(let s=1;s<l+1;s++){let c="";s>10?c=`${h},1)`:(c=`${h},${r})`,r=r+.1),n.push(c)}}else{const x=`rgba(${a.r}, ${a.g}, ${a.b}, ${a.a??"1"})`;n=Array(l).fill(x)}return n},barPercentage:.4,categoryPercentage:1,borderRadius:4}]},$={labels:t.popupData?.xAxis.data.map(i=>i.toString()),datasets:[{data:S?m:t.popupData?.yAxis.data,backgroundColor:i=>{const a=t.barColorRGBA;let n=[];const l=t.popupData?.xAxis.data.length||0;if(u)return"rgba(0,0,0,0)";if(t.isFunnel){let r=+(l>10?.1:(1/l).toFixed(2));const h=`rgba(${a.r}, ${a.g}, ${a.b}`;for(let s=1;s<l+1;s++){let c="";s>10?c=`${h},1)`:(c=`${h},${r})`,r=r+.1),n.push(c)}}else{const x=`rgba(${a.r}, ${a.g}, ${a.b}, ${a.a??"1"})`;n=Array(l).fill(x)}return n},barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return o.jsxs(w.GraphContainerWrapper,{padding:t.outerPadding,children:[t.chartHeading&&o.jsx("div",{style:{marginBottom:24},children:o.jsx(q.TitleMedium,{color:t.chartHeading.color??e.COLORS.content.secondary,children:t.chartHeading.heading})}),o.jsxs("div",{style:{display:"flex",justifyContent:"flex-end"},children:[t.showConvertToPieChart&&o.jsx(f.IconButton,{Icon:k.default,onClick:()=>{b(!0),y(!0)}}),t.allowChartPopup&&o.jsx(f.IconButton,{Icon:F.default,onClick:()=>{y(!0)}})]}),o.jsx("div",{style:{height:t.graphCanvasHeight??500},children:o.jsx(P.Bar,{options:j,data:R})}),p&&o.jsxs(B.StyledModal,{open:p,onClose:()=>{y(!1),b(!1)},closeOnOutsideClick:!0,headingTitle:t.popupData?.chartHeading,width:"75%",headerRightCustomElement:t.showConvertToPieChart?d?o.jsx(f.IconButton,{Icon:L.default,onClick:()=>{b(!1)}}):o.jsx(f.IconButton,{Icon:k.default,onClick:()=>{b(!0)}}):null,headerLeftCustomElement:t.popupData?.headerLeftCustomElement,children:[d&&O&&A&&o.jsx("div",{style:{height:t.graphCanvasHeight??500,padding:"24px"},children:o.jsx(C.Suspense,{fallback:o.jsx("div",{children:"Loading..."}),children:o.jsx(A,{slices:O,size:t.pieChartSize,hideTitle:!0,currencyProps:t.currencyProps})})}),!d&&o.jsx("div",{style:{height:t.graphCanvasHeight??500},children:o.jsx(P.Bar,{options:T,data:$})})]})]})};exports.VerticalGraph=H;
 //# sourceMappingURL=VerticalGraph.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalGraph.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.tsx"],"sourcesContent":["import BarChartIcon from '@src/assets/icons/ChartBar.svg';\nimport PieChartIcon from '@src/assets/icons/ChartPie.svg';\nimport MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tColor,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport React, { Suspense, useEffect } from 'react';\nimport { useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { TitleMedium } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport { VerticalGraphI } from './VerticalGraph.d';\nimport { GraphContainerWrapper } from './VerticalGraph.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tChartDataLabels,\n);\n\nexport const VerticalGraph: React.FC<VerticalGraphI> = (props) => {\n\tconst { PieChartComponent: PieChartAnalytics } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst [showPieChart, setShowPieChart] = useState(false);\n\tconst [pieChartData, setPieChartData] = useState<\n\t\t{\n\t\t\tname: string;\n\t\t\tcount: number;\n\t\t}[]\n\t>();\n\n\tuseEffect(() => {\n\t\tconst dataForPieChart: {\n\t\t\tname: string;\n\t\t\tcount: number;\n\t\t}[] = [];\n\t\tif (!showPieChart) {\n\t\t\treturn;\n\t\t}\n\t\tprops.popupData?.xAxis.data.forEach((ele, index) => {\n\t\t\tdataForPieChart.push({\n\t\t\t\tname: ele.toString(),\n\t\t\t\tcount: Number(props.popupData?.yAxis.data[index]) || 0,\n\t\t\t});\n\t\t});\n\t\tsetPieChartData(dataForPieChart);\n\t}, [showPieChart, props.popupData?.xAxis.data, props.popupData?.yAxis.data]);\n\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.findIndex((ele) => ele !== 0) === -1;\n\tconst noDataPresentInPopup =\n\t\tprops.popupData?.yAxis.data.findIndex((ele) => ele !== 0) === -1;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\tconst options = {\n\t\tresponsive: true,\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\tdisplay: false,\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\tenabled: !noDataPresent,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.yAxis.toolTipCallback,\n\t\t\t\t},\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: props.showTotal ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.xAxis.title,\n\t\t\t\t\ttext: props.xAxis.title,\n\t\t\t\t\tcolor: props.xAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: false,\n\t\t\t\t\tborderColor: COLORS.background.base,\n\t\t\t\t},\n\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t},\n\t\t\t},\n\n\t\t\ty: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.yAxis.title,\n\t\t\t\t\ttext: props.yAxis.title,\n\t\t\t\t\tcolor: props.yAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tborderColor: 'white',\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tcallback: props.yAxis.ticksCallback,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.xAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\tmaintainAspectRatio: false,\n\t} as any;\n\tconst optionsForPopup = {\n\t\tresponsive: true,\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\tdisplay: false,\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\tenabled: !noDataPresentInPopup,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.yAxis.toolTipCallback,\n\t\t\t\t},\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: props.showTotal ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.popupData?.xAxis.title,\n\t\t\t\t\ttext: props.popupData?.xAxis.title,\n\t\t\t\t\tcolor: props.popupData?.xAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: false,\n\t\t\t\t\tborderColor: COLORS.background.base,\n\t\t\t\t},\n\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.popupData?.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t},\n\t\t\t},\n\n\t\t\ty: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.popupData?.yAxis.title,\n\t\t\t\t\ttext: props.popupData?.yAxis.title,\n\t\t\t\t\tcolor: props.popupData?.yAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tborderColor: 'white',\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tcallback: props.popupData?.yAxis.ticksCallback,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.popupData?.xAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t...(noDataPresentInPopup ? yAxisConfigForNoData : {}),\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\tmaintainAspectRatio: false,\n\t} as any;\n\n\tconst data = {\n\t\tlabels: props.xAxis.data.map((d) => d.toString()),\n\t\tdatasets: [\n\t\t\t{\n\t\t\t\tdata: noDataPresent ? dummyValues : props.yAxis.data,\n\t\t\t\tbackgroundColor: (context) => {\n\t\t\t\t\tconst rgba = props.barColorRGBA;\n\n\t\t\t\t\tlet gradientColorSet: string[] = [];\n\t\t\t\t\tconst dataSetLen = props.xAxis.data.length;\n\n\t\t\t\t\tif (noDataPresent) {\n\t\t\t\t\t\treturn 'rgba(0,0,0,0)';\n\t\t\t\t\t} else {\n\t\t\t\t\t\tif (props.isFunnel) {\n\t\t\t\t\t\t\tconst stepSize =\n\t\t\t\t\t\t\t\tdataSetLen > 10 ? 0.1 : (1 / dataSetLen).toFixed(2);\n\t\t\t\t\t\t\tlet counter = +stepSize;\n\t\t\t\t\t\t\tconst rgb = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}`;\n\t\t\t\t\t\t\tfor (let i = 1; i < dataSetLen + 1; i++) {\n\t\t\t\t\t\t\t\tlet rgba = '';\n\t\t\t\t\t\t\t\tif (i > 10) {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},1)`;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},${counter})`;\n\t\t\t\t\t\t\t\t\tcounter = counter + 0.1;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tgradientColorSet.push(rgba);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst rgbaColor = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${\n\t\t\t\t\t\t\t\trgba.a ?? '1'\n\t\t\t\t\t\t\t})`;\n\n\t\t\t\t\t\t\tgradientColorSet = Array(dataSetLen).fill(rgbaColor);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\treturn gradientColorSet as unknown as Color;\n\t\t\t\t},\n\t\t\t\tbarPercentage: 0.4,\n\t\t\t\tcategoryPercentage: 1,\n\t\t\t\tborderRadius: 4,\n\t\t\t},\n\t\t],\n\t};\n\tconst dataForPopup = {\n\t\tlabels: props.popupData?.xAxis.data.map((d) => d.toString()),\n\t\tdatasets: [\n\t\t\t{\n\t\t\t\tdata: noDataPresentInPopup ? dummyValues : props.popupData?.yAxis.data,\n\t\t\t\tbackgroundColor: (context) => {\n\t\t\t\t\tconst rgba = props.barColorRGBA;\n\n\t\t\t\t\tlet gradientColorSet: string[] = [];\n\t\t\t\t\tconst dataSetLen = props.popupData?.xAxis.data.length || 0;\n\n\t\t\t\t\tif (noDataPresent) {\n\t\t\t\t\t\treturn 'rgba(0,0,0,0)';\n\t\t\t\t\t} else {\n\t\t\t\t\t\tif (props.isFunnel) {\n\t\t\t\t\t\t\tconst stepSize =\n\t\t\t\t\t\t\t\tdataSetLen > 10 ? 0.1 : (1 / dataSetLen).toFixed(2);\n\t\t\t\t\t\t\tlet counter = +stepSize;\n\t\t\t\t\t\t\tconst rgb = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}`;\n\t\t\t\t\t\t\tfor (let i = 1; i < dataSetLen + 1; i++) {\n\t\t\t\t\t\t\t\tlet rgba = '';\n\t\t\t\t\t\t\t\tif (i > 10) {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},1)`;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},${counter})`;\n\t\t\t\t\t\t\t\t\tcounter = counter + 0.1;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tgradientColorSet.push(rgba);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst rgbaColor = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${\n\t\t\t\t\t\t\t\trgba.a ?? '1'\n\t\t\t\t\t\t\t})`;\n\n\t\t\t\t\t\t\tgradientColorSet = Array(dataSetLen).fill(rgbaColor);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\treturn gradientColorSet as unknown as Color;\n\t\t\t\t},\n\t\t\t\tbarPercentage: 0.4,\n\t\t\t\tcategoryPercentage: 1,\n\t\t\t\tborderRadius: 4,\n\t\t\t},\n\t\t],\n\t};\n\n\treturn (\n\t\t<GraphContainerWrapper padding={props.outerPadding}>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div style={{ marginBottom: 24 }}>\n\t\t\t\t\t<TitleMedium\n\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t</TitleMedium>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div style={{ display: 'flex', justifyContent: 'flex-end' }}>\n\t\t\t\t{props.showConvertToPieChart && (\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={PieChartIcon}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tsetShowPieChart(true);\n\t\t\t\t\t\t\tsetShowPopup(true);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{props.allowChartPopup && (\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tsetShowPopup(true);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<Bar options={options} data={data} />\n\t\t\t</div>\n\t\t\t{showPopup && (\n\t\t\t\t<StyledModal\n\t\t\t\t\topen={showPopup}\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetShowPopup(false);\n\t\t\t\t\t\tsetShowPieChart(false);\n\t\t\t\t\t}}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.popupData?.chartHeading}\n\t\t\t\t\twidth=\"75%\"\n\t\t\t\t\theaderRightCustomElement={\n\t\t\t\t\t\tprops.showConvertToPieChart ? (\n\t\t\t\t\t\t\t!showPieChart ? (\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={PieChartIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPieChart(true);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={BarChartIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPieChart(false);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) : null\n\t\t\t\t\t}\n\t\t\t\t\theaderLeftCustomElement={props.popupData?.headerLeftCustomElement}\n\t\t\t\t>\n\t\t\t\t\t{showPieChart && pieChartData && PieChartAnalytics && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\t\t\tpadding: '24px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Suspense fallback={<div>Loading...</div>}>\n\t\t\t\t\t\t\t\t<PieChartAnalytics\n\t\t\t\t\t\t\t\t\tslices={pieChartData}\n\t\t\t\t\t\t\t\t\tsize={props.pieChartSize}\n\t\t\t\t\t\t\t\t\thideTitle={true}\n\t\t\t\t\t\t\t\t\tcurrencyProps={props.currencyProps}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Suspense>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t{!showPieChart && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Bar options={optionsForPopup} data={dataForPopup} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","ChartDataLabels","VerticalGraph","props","PieChartAnalytics","showPopup","setShowPopup","useState","showPieChart","setShowPieChart","pieChartData","setPieChartData","useEffect","dataForPieChart","ele","index","dummyValues","noDataPresent","noDataPresentInPopup","yAxisConfigForNoData","options","COLORS","FONTS","optionsForPopup","data","d","context","rgba","gradientColorSet","dataSetLen","counter","rgb","i","rgbaColor","dataForPopup","jsxs","GraphContainerWrapper","jsx","TitleMedium","IconButton","PieChartIcon","MaximizeIcon","Bar","StyledModal","BarChartIcon","Suspense"],"mappings":"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"}
+{"version":3,"file":"VerticalGraph.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.tsx"],"sourcesContent":["import BarChartIcon from '@src/assets/icons/ChartBar.svg';\nimport PieChartIcon from '@src/assets/icons/ChartPie.svg';\nimport MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tColor,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport React, { Suspense, useEffect } from 'react';\nimport { useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { TitleMedium } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport { VerticalGraphI } from './VerticalGraph.d';\nimport { GraphContainerWrapper } from './VerticalGraph.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tChartDataLabels,\n);\n\nexport const VerticalGraph: React.FC<VerticalGraphI> = (props) => {\n\tconst { PieChartComponent: PieChartAnalytics } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst [showPieChart, setShowPieChart] = useState(false);\n\tconst [pieChartData, setPieChartData] = useState<\n\t\t{\n\t\t\tname: string;\n\t\t\tcount: number;\n\t\t}[]\n\t>();\n\n\tuseEffect(() => {\n\t\tconst dataForPieChart: {\n\t\t\tname: string;\n\t\t\tcount: number;\n\t\t}[] = [];\n\t\tif (!showPieChart) {\n\t\t\treturn;\n\t\t}\n\t\tprops.popupData?.xAxis.data.forEach((ele, index) => {\n\t\t\tdataForPieChart.push({\n\t\t\t\tname: ele.toString(),\n\t\t\t\tcount: Number(props.popupData?.yAxis.data[index]) || 0,\n\t\t\t});\n\t\t});\n\t\tsetPieChartData(dataForPieChart);\n\t}, [showPieChart, props.popupData?.xAxis.data, props.popupData?.yAxis.data]);\n\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.findIndex((ele) => ele !== 0) === -1;\n\tconst noDataPresentInPopup =\n\t\tprops.popupData?.yAxis.data.findIndex((ele) => ele !== 0) === -1;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\tconst options = {\n\t\tresponsive: true,\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\tdisplay: false,\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\tenabled: !noDataPresent,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.yAxis.toolTipCallback,\n\t\t\t\t},\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: props.showTotal ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.xAxis.title,\n\t\t\t\t\ttext: props.xAxis.title,\n\t\t\t\t\tcolor: props.xAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: false,\n\t\t\t\t\tborderColor: COLORS.background.base,\n\t\t\t\t},\n\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t},\n\t\t\t},\n\n\t\t\ty: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.yAxis.title,\n\t\t\t\t\ttext: props.yAxis.title,\n\t\t\t\t\tcolor: props.yAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tborderColor: 'white',\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tcallback: props.yAxis.ticksCallback,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.xAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\tmaintainAspectRatio: false,\n\t} as any;\n\tconst optionsForPopup = {\n\t\tresponsive: true,\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\tdisplay: false,\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\tenabled: !noDataPresentInPopup,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.yAxis.toolTipCallback,\n\t\t\t\t},\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: props.showTotal ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.popupData?.xAxis.title,\n\t\t\t\t\ttext: props.popupData?.xAxis.title,\n\t\t\t\t\tcolor: props.popupData?.xAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tdisplay: false,\n\t\t\t\t\tborderColor: COLORS.background.base,\n\t\t\t\t},\n\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.popupData?.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t},\n\t\t\t},\n\n\t\t\ty: {\n\t\t\t\ttitle: {\n\t\t\t\t\tdisplay: !!props.popupData?.yAxis.title,\n\t\t\t\t\ttext: props.popupData?.yAxis.title,\n\t\t\t\t\tcolor: props.popupData?.yAxis.titleColor,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\tborderColor: 'white',\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tcallback: props.popupData?.yAxis.ticksCallback,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.popupData?.xAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t...(noDataPresentInPopup ? yAxisConfigForNoData : {}),\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\tmaintainAspectRatio: false,\n\t} as any;\n\n\tconst data = {\n\t\tlabels: props.xAxis.data.map((d) => d.toString()),\n\t\tdatasets: [\n\t\t\t{\n\t\t\t\tdata: noDataPresent ? dummyValues : props.yAxis.data,\n\t\t\t\tbackgroundColor: (context) => {\n\t\t\t\t\tconst rgba = props.barColorRGBA;\n\n\t\t\t\t\tlet gradientColorSet: string[] = [];\n\t\t\t\t\tconst dataSetLen = props.xAxis.data.length;\n\n\t\t\t\t\tif (noDataPresent) {\n\t\t\t\t\t\treturn 'rgba(0,0,0,0)';\n\t\t\t\t\t} else {\n\t\t\t\t\t\tif (props.isFunnel) {\n\t\t\t\t\t\t\tconst stepSize =\n\t\t\t\t\t\t\t\tdataSetLen > 10 ? 0.1 : (1 / dataSetLen).toFixed(2);\n\t\t\t\t\t\t\tlet counter = +stepSize;\n\t\t\t\t\t\t\tconst rgb = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}`;\n\t\t\t\t\t\t\tfor (let i = 1; i < dataSetLen + 1; i++) {\n\t\t\t\t\t\t\t\tlet rgba = '';\n\t\t\t\t\t\t\t\tif (i > 10) {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},1)`;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},${counter})`;\n\t\t\t\t\t\t\t\t\tcounter = counter + 0.1;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tgradientColorSet.push(rgba);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst rgbaColor = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${\n\t\t\t\t\t\t\t\trgba.a ?? '1'\n\t\t\t\t\t\t\t})`;\n\n\t\t\t\t\t\t\tgradientColorSet = Array(dataSetLen).fill(rgbaColor);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\treturn gradientColorSet as unknown as Color;\n\t\t\t\t},\n\t\t\t\tbarPercentage: 0.4,\n\t\t\t\tcategoryPercentage: 1,\n\t\t\t\tborderRadius: 4,\n\t\t\t},\n\t\t],\n\t};\n\tconst dataForPopup = {\n\t\tlabels: props.popupData?.xAxis.data.map((d) => d.toString()),\n\t\tdatasets: [\n\t\t\t{\n\t\t\t\tdata: noDataPresentInPopup ? dummyValues : props.popupData?.yAxis.data,\n\t\t\t\tbackgroundColor: (context) => {\n\t\t\t\t\tconst rgba = props.barColorRGBA;\n\n\t\t\t\t\tlet gradientColorSet: string[] = [];\n\t\t\t\t\tconst dataSetLen = props.popupData?.xAxis.data.length || 0;\n\n\t\t\t\t\tif (noDataPresent) {\n\t\t\t\t\t\treturn 'rgba(0,0,0,0)';\n\t\t\t\t\t} else {\n\t\t\t\t\t\tif (props.isFunnel) {\n\t\t\t\t\t\t\tconst stepSize =\n\t\t\t\t\t\t\t\tdataSetLen > 10 ? 0.1 : (1 / dataSetLen).toFixed(2);\n\t\t\t\t\t\t\tlet counter = +stepSize;\n\t\t\t\t\t\t\tconst rgb = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}`;\n\t\t\t\t\t\t\tfor (let i = 1; i < dataSetLen + 1; i++) {\n\t\t\t\t\t\t\t\tlet rgba = '';\n\t\t\t\t\t\t\t\tif (i > 10) {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},1)`;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\trgba = `${rgb},${counter})`;\n\t\t\t\t\t\t\t\t\tcounter = counter + 0.1;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tgradientColorSet.push(rgba);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst rgbaColor = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${\n\t\t\t\t\t\t\t\trgba.a ?? '1'\n\t\t\t\t\t\t\t})`;\n\n\t\t\t\t\t\t\tgradientColorSet = Array(dataSetLen).fill(rgbaColor);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\treturn gradientColorSet as unknown as Color;\n\t\t\t\t},\n\t\t\t\tbarPercentage: 0.4,\n\t\t\t\tcategoryPercentage: 1,\n\t\t\t\tborderRadius: 4,\n\t\t\t},\n\t\t],\n\t};\n\n\treturn (\n\t\t<GraphContainerWrapper padding={props.outerPadding}>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div style={{ marginBottom: 24 }}>\n\t\t\t\t\t<TitleMedium\n\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t</TitleMedium>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div style={{ display: 'flex', justifyContent: 'flex-end' }}>\n\t\t\t\t{props.showConvertToPieChart && (\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={PieChartIcon}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tsetShowPieChart(true);\n\t\t\t\t\t\t\tsetShowPopup(true);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{props.allowChartPopup && (\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tsetShowPopup(true);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<Bar options={options} data={data} />\n\t\t\t</div>\n\t\t\t{showPopup && (\n\t\t\t\t<StyledModal\n\t\t\t\t\topen={showPopup}\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetShowPopup(false);\n\t\t\t\t\t\tsetShowPieChart(false);\n\t\t\t\t\t}}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.popupData?.chartHeading}\n\t\t\t\t\twidth=\"75%\"\n\t\t\t\t\theaderRightCustomElement={\n\t\t\t\t\t\tprops.showConvertToPieChart ? (\n\t\t\t\t\t\t\t!showPieChart ? (\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={PieChartIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPieChart(true);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={BarChartIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPieChart(false);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) : null\n\t\t\t\t\t}\n\t\t\t\t\theaderLeftCustomElement={props.popupData?.headerLeftCustomElement}\n\t\t\t\t>\n\t\t\t\t\t{showPieChart && pieChartData && PieChartAnalytics && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\t\t\tpadding: '24px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Suspense fallback={<div>Loading...</div>}>\n\t\t\t\t\t\t\t\t<PieChartAnalytics\n\t\t\t\t\t\t\t\t\tslices={pieChartData}\n\t\t\t\t\t\t\t\t\tsize={props.pieChartSize}\n\t\t\t\t\t\t\t\t\thideTitle={true}\n\t\t\t\t\t\t\t\t\tcurrencyProps={props.currencyProps}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Suspense>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t{!showPieChart && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Bar options={optionsForPopup} data={dataForPopup} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","ChartDataLabels","VerticalGraph","props","PieChartAnalytics","showPopup","setShowPopup","useState","showPieChart","setShowPieChart","pieChartData","setPieChartData","useEffect","dataForPieChart","ele","index","dummyValues","noDataPresent","noDataPresentInPopup","yAxisConfigForNoData","options","COLORS","FONTS","optionsForPopup","data","d","context","rgba","gradientColorSet","dataSetLen","counter","rgb","i","rgbaColor","dataForPopup","jsxs","GraphContainerWrapper","jsx","TitleMedium","IconButton","PieChartIcon","MaximizeIcon","Bar","StyledModal","BarChartIcon","Suspense"],"mappings":"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"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.styles.js

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),a=require("../../../../constants/Theme.js"),n=e.div`
-	background-color: ${a.COLORS.surface.standard};
-	padding: ${r=>r.padding??"24px"};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),r=require("../../../../constants/Theme.js"),a=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},o=a(e),n=o.default.div`
+	background-color: ${r.COLORS.surface.standard};
+	padding: ${t=>t.padding??"24px"};
 `;exports.GraphContainerWrapper=n;
 //# sourceMappingURL=VerticalGraph.styles.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalGraph.styles.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.styles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const GraphContainerWrapper = styled.div<{ padding?: string }>`\n\tbackground-color: ${COLORS.surface.standard};\n\tpadding: ${(props) => props.padding ?? '24px'};\n`;\n"],"names":["GraphContainerWrapper","styled","COLORS","props"],"mappings":"iKAGaA,EAAwBC,EAAO;AAAA,qBACvBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,YAC/BC,GAAUA,EAAM,SAAW,MAAM;AAAA"}
+{"version":3,"file":"VerticalGraph.styles.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.styles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const GraphContainerWrapper = styled.div<{ padding?: string }>`\n\tbackground-color: ${COLORS.surface.standard};\n\tpadding: ${(props) => props.padding ?? '24px'};\n`;\n"],"names":["GraphContainerWrapper","styled","COLORS","props"],"mappings":"gOAGaA,EAAwBC,EAAAA,QAAO;AAAA,qBACvBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,YAC/BC,GAAUA,EAAM,SAAW,MAAM;AAAA"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapStyled.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("styled-components"),i=t.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("styled-components"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=i(n),o=t.default.div`
 	width: ${e=>e.isLooseFit?"100%":"fit-content"};
 	.top-container {
 		display: flex;
@@ -29,35 +29,35 @@
 		margin: 2px;
 		background-color: ${e=>e.color};
 	}
-`,n=t.div`
+`,d=t.default.div`
 	width: ${e=>e.heatBoxWidth?e.heatBoxWidth:24}px;
 	height: ${e=>e.heatBoxHeight?e.heatBoxHeight:24}px;
 	border-radius: 2px;
 	margin: 2px;
 	background-color: ${e=>e.color};
-`,o=t.div`
+`,a=t.default.div`
 	width: 58px;
 	height: 12px;
 	border-radius: 2px;
 	background-color: ${e=>e.color};
-`,d=t.div`
+`,l=t.default.div`
 	display: flex;
 	align-items: center;
 	gap: 4px;
-`,a=t.div`
+`,r=t.default.div`
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 	gap: 2px;
-`,l=t.div`
+`,c=t.default.div`
 	text-align: end;
 	width: 100%;
 	margin-left: 10px;
-`,r=t.div`
+`,x=t.default.div`
 	display: flex;
 	align-items: center;
 	gap: 4px;
-`,x=t.div`
+`,g=t.default.div`
 	color: #666;
-`;exports.HeatBox=n;exports.HeatBoxLegend=o;exports.HeatBoxStyled=i;exports.LegendCaption=x;exports.LegendContainer=d;exports.LegendItem=a;exports.LegendLabels=r;exports.LegendValue=l;
+`;exports.HeatBox=d;exports.HeatBoxLegend=a;exports.HeatBoxStyled=o;exports.LegendCaption=g;exports.LegendContainer=l;exports.LegendItem=r;exports.LegendLabels=x;exports.LegendValue=c;
 //# sourceMappingURL=HeatMapStyled.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapStyled.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeatMapStyled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapStyled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const HeatBoxStyled = styled.div<{ isLooseFit?: boolean }>`\n\twidth: ${(props) => (props.isLooseFit ? '100%' : 'fit-content')};\n\t.top-container {\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tjustify-content: space-between;\n\t\tmargin-bottom: 16px;\n\n\t\t&__heading {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tgap: 8px;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t}\n\n\t\t&__legend {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\tgap: 4px;\n\t\t\talign-items: center;\n\t\t}\n\t}\n\n\t.box {\n\t\twidth: 74px;\n\t\theight: 14px;\n\t\tborder-radius: 2px;\n\t\tmargin: 2px;\n\t\tbackground-color: ${(props) => props.color};\n\t}\n`;\n\nexport const HeatBox = styled.div<{\n\theatBoxHeight?: number;\n\theatBoxWidth?: number;\n}>`\n\twidth: ${(props) => (props.heatBoxWidth ? props.heatBoxWidth : 24)}px;\n\theight: ${(props) => (props.heatBoxHeight ? props.heatBoxHeight : 24)}px;\n\tborder-radius: 2px;\n\tmargin: 2px;\n\tbackground-color: ${(props) => props.color};\n`;\n\nexport const HeatBoxLegend = styled.div<{ color: string }>`\n\twidth: 58px;\n\theight: 12px;\n\tborder-radius: 2px;\n\tbackground-color: ${(props) => props.color};\n`;\n\nexport const LegendContainer = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n`;\n\nexport const LegendItem = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 2px;\n`;\n\nexport const LegendValue = styled.div`\n\ttext-align: end;\n\twidth: 100%;\n\tmargin-left: 10px;\n`;\n\nexport const LegendLabels = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n`;\n\nexport const LegendCaption = styled.div`\n\tcolor: #666;\n`;\n"],"names":["HeatBoxStyled","styled","props","HeatBox","HeatBoxLegend","LegendContainer","LegendItem","LegendValue","LegendLabels","LegendCaption"],"mappings":"qHAEaA,EAAgBC,EAAO;AAAA,UACzBC,GAAWA,EAAM,WAAa,OAAS,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBA4BzCA,GAAUA,EAAM,KAAK;AAAA;AAAA,EAI/BC,EAAUF,EAAO;AAAA,UAInBC,GAAWA,EAAM,aAAeA,EAAM,aAAe,EAAG;AAAA,WACvDA,GAAWA,EAAM,cAAgBA,EAAM,cAAgB,EAAG;AAAA;AAAA;AAAA,qBAGhDA,GAAUA,EAAM,KAAK;AAAA,EAG9BE,EAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA,qBAIdC,GAAUA,EAAM,KAAK;AAAA,EAG9BG,EAAkBJ,EAAO;AAAA;AAAA;AAAA;AAAA,EAMzBK,EAAaL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOpBM,EAAcN,EAAO;AAAA;AAAA;AAAA;AAAA,EAMrBO,EAAeP,EAAO;AAAA;AAAA;AAAA;AAAA,EAMtBQ,EAAgBR,EAAO;AAAA;AAAA"}
+{"version":3,"file":"HeatMapStyled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapStyled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const HeatBoxStyled = styled.div<{ isLooseFit?: boolean }>`\n\twidth: ${(props) => (props.isLooseFit ? '100%' : 'fit-content')};\n\t.top-container {\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tjustify-content: space-between;\n\t\tmargin-bottom: 16px;\n\n\t\t&__heading {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tgap: 8px;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t}\n\n\t\t&__legend {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\tgap: 4px;\n\t\t\talign-items: center;\n\t\t}\n\t}\n\n\t.box {\n\t\twidth: 74px;\n\t\theight: 14px;\n\t\tborder-radius: 2px;\n\t\tmargin: 2px;\n\t\tbackground-color: ${(props) => props.color};\n\t}\n`;\n\nexport const HeatBox = styled.div<{\n\theatBoxHeight?: number;\n\theatBoxWidth?: number;\n}>`\n\twidth: ${(props) => (props.heatBoxWidth ? props.heatBoxWidth : 24)}px;\n\theight: ${(props) => (props.heatBoxHeight ? props.heatBoxHeight : 24)}px;\n\tborder-radius: 2px;\n\tmargin: 2px;\n\tbackground-color: ${(props) => props.color};\n`;\n\nexport const HeatBoxLegend = styled.div<{ color: string }>`\n\twidth: 58px;\n\theight: 12px;\n\tborder-radius: 2px;\n\tbackground-color: ${(props) => props.color};\n`;\n\nexport const LegendContainer = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n`;\n\nexport const LegendItem = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 2px;\n`;\n\nexport const LegendValue = styled.div`\n\ttext-align: end;\n\twidth: 100%;\n\tmargin-left: 10px;\n`;\n\nexport const LegendLabels = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n`;\n\nexport const LegendCaption = styled.div`\n\tcolor: #666;\n`;\n"],"names":["HeatBoxStyled","styled","props","HeatBox","HeatBoxLegend","LegendContainer","LegendItem","LegendValue","LegendLabels","LegendCaption"],"mappings":"oLAEaA,EAAgBC,EAAAA,QAAO;AAAA,UACzBC,GAAWA,EAAM,WAAa,OAAS,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBA4BzCA,GAAUA,EAAM,KAAK;AAAA;AAAA,EAI/BC,EAAUF,EAAAA,QAAO;AAAA,UAInBC,GAAWA,EAAM,aAAeA,EAAM,aAAe,EAAG;AAAA,WACvDA,GAAWA,EAAM,cAAgBA,EAAM,cAAgB,EAAG;AAAA;AAAA;AAAA,qBAGhDA,GAAUA,EAAM,KAAK;AAAA,EAG9BE,EAAgBH,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,qBAIdC,GAAUA,EAAM,KAAK;AAAA,EAG9BG,EAAkBJ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMzBK,EAAaL,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOpBM,EAAcN,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMrBO,EAAeP,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMtBQ,EAAgBR,EAAAA,QAAO;AAAA;AAAA"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),y=require("styled-components"),r=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),l=require("./HeatMapStyled.js"),f=require("../../../tooltips/Tooltip.js"),s={0:"#EBDBFF",1:"#D2AEFF",2:"#9E77ED",3:"#5E07BB"},B=(t,c)=>t<=c[0]?0:t<=c[1]?1:t<=c[2]?2:3,O=({xLabels:t,yLabels:c,values:x,absolutHeatValues:i})=>{const[a,j]=g.useState();return g.useEffect(()=>{j(x.map(n=>n.map(d=>B(d,i||[]))))},[x,i]),a?e.jsxs(p,{children:[e.jsx("div",{className:"top-container",children:e.jsxs("div",{children:[e.jsxs("div",{className:"top-container__legend",children:[e.jsx(l.HeatBoxLegend,{color:s[0]}),e.jsx(l.HeatBoxLegend,{color:s[1]}),e.jsx(l.HeatBoxLegend,{color:s[2]}),e.jsx(l.HeatBoxLegend,{color:s[3]})]}),e.jsxs("div",{className:"top-container__legend",children:[e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:i[0]}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:i[1]}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:i[2]}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:`${i[2]}+`})]})]})}),e.jsxs("div",{style:{width:"100%"},children:[c.map((n,d)=>e.jsxs("div",{className:"heat-row",children:[e.jsx("div",{style:{flex:.5},children:e.jsx(r.BodyTiny,{style:{color:o.COLORS.content.secondary,textAlign:"right",marginRight:8},children:n})}),t.map((m,h)=>e.jsx("div",{style:{flex:1},children:e.jsx(f.Tooltip,{body:x[d][h].toString(),placement:"bottom",children:e.jsx(S,{color:s[a[d][h]]})})},m))]},n)),e.jsxs("div",{className:"heat-row",style:{marginTop:12},children:[e.jsx("div",{style:{flex:.5}}),t.map(n=>e.jsx("div",{style:{flex:1},children:e.jsx(r.BodyTiny,{style:{color:o.COLORS.content.secondary,textAlign:"center"},children:n})},n))]})]})]}):e.jsx(e.Fragment,{})},S=y.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("react"),f=require("styled-components"),r=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),l=require("./HeatMapStyled.js"),B=require("../../../tooltips/Tooltip.js"),O=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},g=O(f),d={0:"#EBDBFF",1:"#D2AEFF",2:"#9E77ED",3:"#5E07BB"},S=(t,c)=>t<=c[0]?0:t<=c[1]?1:t<=c[2]?2:3,u=({xLabels:t,yLabels:c,values:a,absolutHeatValues:i})=>{const[x,j]=h.useState();return h.useEffect(()=>{j(a.map(n=>n.map(s=>S(s,i||[]))))},[a,i]),x?e.jsxs(p,{children:[e.jsx("div",{className:"top-container",children:e.jsxs("div",{children:[e.jsxs("div",{className:"top-container__legend",children:[e.jsx(l.HeatBoxLegend,{color:d[0]}),e.jsx(l.HeatBoxLegend,{color:d[1]}),e.jsx(l.HeatBoxLegend,{color:d[2]}),e.jsx(l.HeatBoxLegend,{color:d[3]})]}),e.jsxs("div",{className:"top-container__legend",children:[e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:i[0]}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:i[1]}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:i[2]}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,style:{width:56,margin:3,textAlign:"right"},children:`${i[2]}+`})]})]})}),e.jsxs("div",{style:{width:"100%"},children:[c.map((n,s)=>e.jsxs("div",{className:"heat-row",children:[e.jsx("div",{style:{flex:.5},children:e.jsx(r.BodyTiny,{style:{color:o.COLORS.content.secondary,textAlign:"right",marginRight:8},children:n})}),t.map((m,y)=>e.jsx("div",{style:{flex:1},children:e.jsx(B.Tooltip,{body:a[s][y].toString(),placement:"bottom",children:e.jsx(C,{color:d[x[s][y]]})})},m))]},n)),e.jsxs("div",{className:"heat-row",style:{marginTop:12},children:[e.jsx("div",{style:{flex:.5}}),t.map(n=>e.jsx("div",{style:{flex:1},children:e.jsx(r.BodyTiny,{style:{color:o.COLORS.content.secondary,textAlign:"center"},children:n})},n))]})]})]}):e.jsx(e.Fragment,{})},C=g.default.div`
 	height: 7px;
 	border-radius: 1px;
 	background-color: ${t=>t.color};
-`,p=y.div`
+`,p=g.default.div`
 	width: 100%;
 	.top-container {
 		display: flex;
@@ -24,5 +24,5 @@
 		gap: 4px;
 		align-items: center;
 	}
-`;exports.HeatBoxStyled=p;exports.HeatMapVertical=O;
+`;exports.HeatBoxStyled=p;exports.HeatMapVertical=u;
 //# sourceMappingURL=HeatMapVertical.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeatMapVertical.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodyCaption, BodyTiny } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { HeatBoxLegend } from './HeatMapStyled';\n\nexport interface HeatMapVerticalInputInterface {\n\ttitle: string;\n\txLabels: string[];\n\tyLabels: string[];\n\tvalues: number[][];\n\tabsolutHeatValues: number[];\n\thideXLabels?: boolean;\n}\n\nenum HEAT {\n\tLOW,\n\tMEDIUM,\n\tHIGH,\n\tHIGHEST,\n}\n\nconst HEAT_COLORS = {\n\t[HEAT.LOW]: '#EBDBFF',\n\t[HEAT.MEDIUM]: '#D2AEFF',\n\t[HEAT.HIGH]: '#9E77ED',\n\t[HEAT.HIGHEST]: '#5E07BB',\n};\n\nconst getHeat = (value: number, absolutHeatValues: number[]) => {\n\tif (value <= absolutHeatValues[0]) return HEAT.LOW;\n\tif (value <= absolutHeatValues[1]) return HEAT.MEDIUM;\n\tif (value <= absolutHeatValues[2]) return HEAT.HIGH;\n\treturn HEAT.HIGHEST;\n};\n\nexport const HeatMapVertical: React.FC<HeatMapVerticalInputInterface> = ({\n\txLabels,\n\tyLabels,\n\tvalues,\n\tabsolutHeatValues,\n}) => {\n\tconst [heatValues, setHeatValues] = useState<HEAT[][]>();\n\n\tuseEffect(() => {\n\t\tsetHeatValues(\n\t\t\tvalues.map((row) =>\n\t\t\t\trow.map((value) => getHeat(value, absolutHeatValues || [])),\n\t\t\t),\n\t\t);\n\t}, [values, absolutHeatValues]);\n\n\tif (!heatValues) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<HeatBoxStyled>\n\t\t\t<div className=\"top-container\">\n\t\t\t\t<div>\n\t\t\t\t\t<div className=\"top-container__legend\">\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.LOW]} />\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.MEDIUM]} />\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.HIGH]} />\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.HIGHEST]} />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className=\"top-container__legend\">\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{absolutHeatValues[0]}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{absolutHeatValues[1]}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{absolutHeatValues[2]}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>{`${absolutHeatValues[2]}+`}</BodyCaption>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div style={{ width: '100%' }}>\n\t\t\t\t{yLabels.map((yLabel, rowIndex) => (\n\t\t\t\t\t<div key={yLabel} className=\"heat-row\">\n\t\t\t\t\t\t<div style={{ flex: 0.5 }}>\n\t\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t\t\ttextAlign: 'right',\n\t\t\t\t\t\t\t\t\tmarginRight: 8,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{yLabel}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{xLabels.map((xLabel, colIndex) => (\n\t\t\t\t\t\t\t<div key={xLabel} style={{ flex: 1 }}>\n\t\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\t\tbody={values[rowIndex][colIndex].toString()}\n\t\t\t\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<HeatBox\n\t\t\t\t\t\t\t\t\t\tcolor={HEAT_COLORS[heatValues[rowIndex][colIndex]]}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t\t<div className=\"heat-row\" style={{ marginTop: 12 }}>\n\t\t\t\t\t<div style={{ flex: 0.5 }} />\n\t\t\t\t\t{xLabels.map((xLabel) => (\n\t\t\t\t\t\t<div key={xLabel} style={{ flex: 1 }}>\n\t\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{xLabel}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</HeatBoxStyled>\n\t);\n};\n\nconst HeatBox = styled.div`\n\theight: 7px;\n\tborder-radius: 1px;\n\tbackground-color: ${(props) => props.color};\n`;\n\nexport const HeatBoxStyled = styled.div`\n\twidth: 100%;\n\t.top-container {\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tjustify-content: end;\n\t\tmargin-bottom: 16px;\n\n\t\t&__legend {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tgap: 4px;\n\t\t\talign-items: center;\n\t\t}\n\t}\n\n\t.heat-row {\n\t\tdisplay: flex;\n\t\theight: 9px;\n\t\tgap: 4px;\n\t\talign-items: center;\n\t}\n`;\n"],"names":["HEAT_COLORS","getHeat","value","absolutHeatValues","HeatMapVertical","xLabels","yLabels","values","heatValues","setHeatValues","useState","useEffect","row","HeatBoxStyled","jsx","jsxs","HeatBoxLegend","BodyCaption","COLORS","yLabel","rowIndex","BodyTiny","xLabel","colIndex","Tooltip","HeatBox","Fragment","styled","props"],"mappings":"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"}
+{"version":3,"file":"HeatMapVertical.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodyCaption, BodyTiny } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { HeatBoxLegend } from './HeatMapStyled';\n\nexport interface HeatMapVerticalInputInterface {\n\ttitle: string;\n\txLabels: string[];\n\tyLabels: string[];\n\tvalues: number[][];\n\tabsolutHeatValues: number[];\n\thideXLabels?: boolean;\n}\n\nenum HEAT {\n\tLOW,\n\tMEDIUM,\n\tHIGH,\n\tHIGHEST,\n}\n\nconst HEAT_COLORS = {\n\t[HEAT.LOW]: '#EBDBFF',\n\t[HEAT.MEDIUM]: '#D2AEFF',\n\t[HEAT.HIGH]: '#9E77ED',\n\t[HEAT.HIGHEST]: '#5E07BB',\n};\n\nconst getHeat = (value: number, absolutHeatValues: number[]) => {\n\tif (value <= absolutHeatValues[0]) return HEAT.LOW;\n\tif (value <= absolutHeatValues[1]) return HEAT.MEDIUM;\n\tif (value <= absolutHeatValues[2]) return HEAT.HIGH;\n\treturn HEAT.HIGHEST;\n};\n\nexport const HeatMapVertical: React.FC<HeatMapVerticalInputInterface> = ({\n\txLabels,\n\tyLabels,\n\tvalues,\n\tabsolutHeatValues,\n}) => {\n\tconst [heatValues, setHeatValues] = useState<HEAT[][]>();\n\n\tuseEffect(() => {\n\t\tsetHeatValues(\n\t\t\tvalues.map((row) =>\n\t\t\t\trow.map((value) => getHeat(value, absolutHeatValues || [])),\n\t\t\t),\n\t\t);\n\t}, [values, absolutHeatValues]);\n\n\tif (!heatValues) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<HeatBoxStyled>\n\t\t\t<div className=\"top-container\">\n\t\t\t\t<div>\n\t\t\t\t\t<div className=\"top-container__legend\">\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.LOW]} />\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.MEDIUM]} />\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.HIGH]} />\n\t\t\t\t\t\t<HeatBoxLegend color={HEAT_COLORS[HEAT.HIGHEST]} />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className=\"top-container__legend\">\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{absolutHeatValues[0]}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{absolutHeatValues[1]}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{absolutHeatValues[2]}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ width: 56, margin: 3, textAlign: 'right' }}\n\t\t\t\t\t\t>{`${absolutHeatValues[2]}+`}</BodyCaption>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div style={{ width: '100%' }}>\n\t\t\t\t{yLabels.map((yLabel, rowIndex) => (\n\t\t\t\t\t<div key={yLabel} className=\"heat-row\">\n\t\t\t\t\t\t<div style={{ flex: 0.5 }}>\n\t\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t\t\ttextAlign: 'right',\n\t\t\t\t\t\t\t\t\tmarginRight: 8,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{yLabel}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{xLabels.map((xLabel, colIndex) => (\n\t\t\t\t\t\t\t<div key={xLabel} style={{ flex: 1 }}>\n\t\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\t\tbody={values[rowIndex][colIndex].toString()}\n\t\t\t\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<HeatBox\n\t\t\t\t\t\t\t\t\t\tcolor={HEAT_COLORS[heatValues[rowIndex][colIndex]]}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t\t<div className=\"heat-row\" style={{ marginTop: 12 }}>\n\t\t\t\t\t<div style={{ flex: 0.5 }} />\n\t\t\t\t\t{xLabels.map((xLabel) => (\n\t\t\t\t\t\t<div key={xLabel} style={{ flex: 1 }}>\n\t\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{xLabel}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</HeatBoxStyled>\n\t);\n};\n\nconst HeatBox = styled.div`\n\theight: 7px;\n\tborder-radius: 1px;\n\tbackground-color: ${(props) => props.color};\n`;\n\nexport const HeatBoxStyled = styled.div`\n\twidth: 100%;\n\t.top-container {\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tjustify-content: end;\n\t\tmargin-bottom: 16px;\n\n\t\t&__legend {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tgap: 4px;\n\t\t\talign-items: center;\n\t\t}\n\t}\n\n\t.heat-row {\n\t\tdisplay: flex;\n\t\theight: 9px;\n\t\tgap: 4px;\n\t\talign-items: center;\n\t}\n`;\n"],"names":["HEAT_COLORS","getHeat","value","absolutHeatValues","HeatMapVertical","xLabels","yLabels","values","heatValues","setHeatValues","useState","useEffect","row","HeatBoxStyled","jsx","jsxs","HeatBoxLegend","BodyCaption","COLORS","yLabel","rowIndex","BodyTiny","xLabel","colIndex","Tooltip","HeatBox","Fragment","styled","props"],"mappings":"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"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),e=require("../../../../constants/Theme.js"),d=i.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),t=require("../../../../constants/Theme.js"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=d(o),l=i.default.div`
 	width: 100%;
 	display: flex;
 	flex-direction: column;
 	padding: 16px 24px;
-	border-right: ${o=>o.separator?1:0}px solid
-		${e.COLORS.stroke.primary};
-`,t=i.div`
+	border-right: ${e=>e.separator?1:0}px solid
+		${t.COLORS.stroke.primary};
+`,r=i.default.div`
 	display: flex;
 	flex-direction: row;
-`,r=i.div`
+`,n=i.default.div`
 	display: flex;
 	flex-direction: column;
-`,n=i.div`
+`,a=i.default.div`
 	padding-top: 8px;
 	padding-bottom: 8px;
 	border-radius: 4px;
@@ -19,14 +19,14 @@
 	flex-direction: column;
 	align-items: center;
 	flex: 1;
-	background: ${o=>o.type==="positive"?e.COLORS.background.positive.light:o.type==="negative"?e.COLORS.background.negative.light:e.COLORS.background.warning.light};
-`;i.div`
+	background: ${e=>e.type==="positive"?t.COLORS.background.positive.light:e.type==="negative"?t.COLORS.background.negative.light:t.COLORS.background.warning.light};
+`;i.default.div`
 	border-radius: 4px;
 	width: 100%;
 	height: 8px;
-	background-color: ${e.COLORS.surface.hovered};
+	background-color: ${t.COLORS.surface.hovered};
 	display: flex;
 	flex-direction: row;
 	overflow: hidden;
-`;exports.Column=r;exports.Container=d;exports.Row=t;exports.StyledChip=n;
+`;exports.Column=n;exports.Container=l;exports.Row=r;exports.StyledChip=a;
 //# sourceMappingURL=LinearChipGroupedChart.styled.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinearChipGroupedChart.styled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div<{\n\tseparator?: boolean;\n}>`\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tpadding: 16px 24px;\n\tborder-right: ${(props) => (props.separator ? 1 : 0)}px solid\n\t\t${COLORS.stroke.primary};\n`;\n\nexport const Row = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n`;\n\nexport const Column = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const StyledChip = styled.div<{\n\ttype: 'positive' | 'neutral' | 'negative';\n}>`\n\tpadding-top: 8px;\n\tpadding-bottom: 8px;\n\tborder-radius: 4px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tflex: 1;\n\tbackground: ${(props) =>\n\t\tprops.type === 'positive'\n\t\t\t? COLORS.background.positive.light\n\t\t\t: props.type === 'negative'\n\t\t\t? COLORS.background.negative.light\n\t\t\t: COLORS.background.warning.light};\n`;\n\nexport const StyledBarContainer = styled.div`\n\tborder-radius: 4px;\n\twidth: 100%;\n\theight: 8px;\n\tbackground-color: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\tflex-direction: row;\n\toverflow: hidden;\n`;\n"],"names":["Container","styled","props","COLORS","Row","Column","StyledChip"],"mappings":"iKAGaA,EAAYC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,iBAOdC,GAAWA,EAAM,UAAY,EAAI,CAAE;AAAA,IACjDC,EAAAA,OAAO,OAAO,OAAO;AAAA,EAGZC,EAAMH,EAAO;AAAA;AAAA;AAAA,EAKbI,EAASJ,EAAO;AAAA;AAAA;AAAA,EAKhBK,EAAaL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAUjBC,GACdA,EAAM,OAAS,WACZC,SAAO,WAAW,SAAS,MAC3BD,EAAM,OAAS,WACfC,SAAO,WAAW,SAAS,MAC3BA,SAAO,WAAW,QAAQ,KAAK;AAAA,EAGFF,EAAO;AAAA;AAAA;AAAA;AAAA,qBAIpBE,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"LinearChipGroupedChart.styled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div<{\n\tseparator?: boolean;\n}>`\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tpadding: 16px 24px;\n\tborder-right: ${(props) => (props.separator ? 1 : 0)}px solid\n\t\t${COLORS.stroke.primary};\n`;\n\nexport const Row = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n`;\n\nexport const Column = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const StyledChip = styled.div<{\n\ttype: 'positive' | 'neutral' | 'negative';\n}>`\n\tpadding-top: 8px;\n\tpadding-bottom: 8px;\n\tborder-radius: 4px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tflex: 1;\n\tbackground: ${(props) =>\n\t\tprops.type === 'positive'\n\t\t\t? COLORS.background.positive.light\n\t\t\t: props.type === 'negative'\n\t\t\t? COLORS.background.negative.light\n\t\t\t: COLORS.background.warning.light};\n`;\n\nexport const StyledBarContainer = styled.div`\n\tborder-radius: 4px;\n\twidth: 100%;\n\theight: 8px;\n\tbackground-color: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\tflex-direction: row;\n\toverflow: hidden;\n`;\n"],"names":["Container","styled","props","COLORS","Row","Column","StyledChip"],"mappings":"gOAGaA,EAAYC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,iBAOdC,GAAWA,EAAM,UAAY,EAAI,CAAE;AAAA,IACjDC,EAAAA,OAAO,OAAO,OAAO;AAAA,EAGZC,EAAMH,EAAAA,QAAO;AAAA;AAAA;AAAA,EAKbI,EAASJ,EAAAA,QAAO;AAAA;AAAA;AAAA,EAKhBK,EAAaL,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAUjBC,GACdA,EAAM,OAAS,WACZC,SAAO,WAAW,SAAS,MAC3BD,EAAM,OAAS,WACfC,SAAO,WAAW,SAAS,MAC3BA,SAAO,WAAW,QAAQ,KAAK;AAAA,EAGFF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,qBAIpBE,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/scoreBlock/ScoreBlock.styled.js

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),e=require("../../../../constants/Theme.js"),t=i.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("styled-components"),t=require("../../../../constants/Theme.js"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=o(d),r=i.default.div`
 	width: 100%;
 	display: flex;
 	flex-direction: column;
 	padding: 16px 24px;
-	border-right: ${d=>d.separator?1:0}px solid
-		${e.COLORS.stroke.primary};
-`,o=i.div`
+	border-right: ${e=>e.separator?1:0}px solid
+		${t.COLORS.stroke.primary};
+`,l=i.default.div`
 	display: flex;
 	flex-direction: row;
-`;i.div`
+`;i.default.div`
 	display: flex;
 	flex-direction: column;
-`;const r=i.div`
+`;const n=i.default.div`
 	padding-top: 12px;
 	padding-right: 8px;
 	padding-bottom: 12px;
@@ -22,14 +22,14 @@
 	align-items: center;
 	flex: 1;
 	gap: 8px;
-	background: ${d=>d.type==="positive"?e.COLORS.background.positive.light:d.type==="negative"?e.COLORS.background.negative.light:e.COLORS.background.warning.light};
-`,n=i.div`
+	background: ${e=>e.type==="positive"?t.COLORS.background.positive.light:e.type==="negative"?t.COLORS.background.negative.light:t.COLORS.background.warning.light};
+`,a=i.default.div`
 	border-radius: 4px;
 	width: 100%;
 	height: 8px;
-	background-color: ${e.COLORS.surface.hovered};
+	background-color: ${t.COLORS.surface.hovered};
 	display: flex;
 	flex-direction: row;
 	overflow: hidden;
-`;exports.Container=t;exports.Row=o;exports.StyledBarContainer=n;exports.StyledChip=r;
+`;exports.Container=r;exports.Row=l;exports.StyledBarContainer=a;exports.StyledChip=n;
 //# sourceMappingURL=ScoreBlock.styled.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/scoreBlock/ScoreBlock.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScoreBlock.styled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/scoreBlock/ScoreBlock.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div<{\n\tseparator?: boolean;\n}>`\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tpadding: 16px 24px;\n\tborder-right: ${(props) => (props.separator ? 1 : 0)}px solid\n\t\t${COLORS.stroke.primary};\n`;\n\nexport const Row = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n`;\n\nexport const Column = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const StyledChip = styled.div<{\n\ttype: 'positive' | 'neutral' | 'negative';\n}>`\n\tpadding-top: 12px;\n\tpadding-right: 8px;\n\tpadding-bottom: 12px;\n\tpadding-left: 8px;\n\tborder-radius: 4px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tflex: 1;\n\tgap: 8px;\n\tbackground: ${(props) =>\n\t\tprops.type === 'positive'\n\t\t\t? COLORS.background.positive.light\n\t\t\t: props.type === 'negative'\n\t\t\t? COLORS.background.negative.light\n\t\t\t: COLORS.background.warning.light};\n`;\n\nexport const StyledBarContainer = styled.div`\n\tborder-radius: 4px;\n\twidth: 100%;\n\theight: 8px;\n\tbackground-color: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\tflex-direction: row;\n\toverflow: hidden;\n`;\n"],"names":["Container","styled","props","COLORS","Row","StyledChip","StyledBarContainer"],"mappings":"iKAGaA,EAAYC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,iBAOdC,GAAWA,EAAM,UAAY,EAAI,CAAE;AAAA,IACjDC,EAAAA,OAAO,OAAO,OAAO;AAAA,EAGZC,EAAMH,EAAO;AAAA;AAAA;AAAA,EAKJA,EAAO;AAAA;AAAA;AAAA,EAKtB,MAAMI,EAAaJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAajBC,GACdA,EAAM,OAAS,WACZC,SAAO,WAAW,SAAS,MAC3BD,EAAM,OAAS,WACfC,SAAO,WAAW,SAAS,MAC3BA,SAAO,WAAW,QAAQ,KAAK;AAAA,EAGvBG,EAAqBL,EAAO;AAAA;AAAA;AAAA;AAAA,qBAIpBE,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"ScoreBlock.styled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/scoreBlock/ScoreBlock.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div<{\n\tseparator?: boolean;\n}>`\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tpadding: 16px 24px;\n\tborder-right: ${(props) => (props.separator ? 1 : 0)}px solid\n\t\t${COLORS.stroke.primary};\n`;\n\nexport const Row = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n`;\n\nexport const Column = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const StyledChip = styled.div<{\n\ttype: 'positive' | 'neutral' | 'negative';\n}>`\n\tpadding-top: 12px;\n\tpadding-right: 8px;\n\tpadding-bottom: 12px;\n\tpadding-left: 8px;\n\tborder-radius: 4px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tflex: 1;\n\tgap: 8px;\n\tbackground: ${(props) =>\n\t\tprops.type === 'positive'\n\t\t\t? COLORS.background.positive.light\n\t\t\t: props.type === 'negative'\n\t\t\t? COLORS.background.negative.light\n\t\t\t: COLORS.background.warning.light};\n`;\n\nexport const StyledBarContainer = styled.div`\n\tborder-radius: 4px;\n\twidth: 100%;\n\theight: 8px;\n\tbackground-color: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\tflex-direction: row;\n\toverflow: hidden;\n`;\n"],"names":["Container","styled","props","COLORS","Row","StyledChip","StyledBarContainer"],"mappings":"gOAGaA,EAAYC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,iBAOdC,GAAWA,EAAM,UAAY,EAAI,CAAE;AAAA,IACjDC,EAAAA,OAAO,OAAO,OAAO;AAAA,EAGZC,EAAMH,EAAAA,QAAO;AAAA;AAAA;AAAA,EAKJA,EAAAA,QAAO;AAAA;AAAA;AAAA,EAKtB,MAAMI,EAAaJ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAajBC,GACdA,EAAM,OAAS,WACZC,SAAO,WAAW,SAAS,MAC3BD,EAAM,OAAS,WACfC,SAAO,WAAW,SAAS,MAC3BA,SAAO,WAAW,QAAQ,KAAK;AAAA,EAGvBG,EAAqBL,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,qBAIpBE,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/avatar/Avatar.styled.js

@@ -1,11 +1,11 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("styled-components"),r=require("./AvatarHelper.js"),A=require("../../constants/Theme.js"),a=t.div`
-	width: ${e=>r.AVATAR_SIZE_MAP[e.size]+"px"};
-	height: ${e=>r.AVATAR_SIZE_MAP[e.size]+"px"};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("styled-components"),t=require("./AvatarHelper.js"),r=require("../../constants/Theme.js"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=a(A),o=n.default.div`
+	width: ${e=>t.AVATAR_SIZE_MAP[e.size]+"px"};
+	height: ${e=>t.AVATAR_SIZE_MAP[e.size]+"px"};
 	display: flex;
 	justify-content: center;
 	align-items: center;
-	background-color: ${e=>e.type===r.AVATAR_TYPES.IMAGE?"null":e.background===r.AVATAR_BACKGROUND.LIGHT?A.COLORS.background.base:e.background===r.AVATAR_BACKGROUND.WHITE?A.COLORS.surface.standard:A.COLORS.background.inverse};
-	border: ${e=>e.background===r.AVATAR_BACKGROUND.LIGHT||e.background===r.AVATAR_BACKGROUND.WHITE?"1px solid "+A.COLORS.stroke.primary:0};
+	background-color: ${e=>e.type===t.AVATAR_TYPES.IMAGE?"null":e.background===t.AVATAR_BACKGROUND.LIGHT?r.COLORS.background.base:e.background===t.AVATAR_BACKGROUND.WHITE?r.COLORS.surface.standard:r.COLORS.background.inverse};
+	border: ${e=>e.background===t.AVATAR_BACKGROUND.LIGHT||e.background===t.AVATAR_BACKGROUND.WHITE?"1px solid "+r.COLORS.stroke.primary:0};
 	border-radius: 50%;
-`;exports.AvatarStyle=a;
+`;exports.AvatarStyle=o;
 //# sourceMappingURL=Avatar.styled.js.map

package/dist/cjs/components/avatar/Avatar.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT ||\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n"],"names":["AvatarStyle","styled","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS"],"mappings":"0LASaA,EAAcC,EAAO;AAAA,UAKvBC,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA,WAC3CA,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAIlCA,GACpBA,EAAM,OAASE,EAAAA,aAAa,MACzB,OACAF,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,KAClBJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,SAAO,QAAQ,SACfA,SAAO,WAAW,OAAO;AAAA,WAClBJ,GACVA,EAAM,aAAeG,EAAAA,kBAAkB,OACvCH,EAAM,aAAeG,EAAAA,kBAAkB,MACpC,aAAeC,EAAAA,OAAO,OAAO,QAC7B,CAAC;AAAA;AAAA"}
+{"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT ||\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n"],"names":["AvatarStyle","styled","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS"],"mappings":"yPASaA,EAAcC,EAAAA,QAAO;AAAA,UAKvBC,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA,WAC3CA,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAIlCA,GACpBA,EAAM,OAASE,EAAAA,aAAa,MACzB,OACAF,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,KAClBJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,SAAO,QAAQ,SACfA,SAAO,WAAW,OAAO;AAAA,WAClBJ,GACVA,EAAM,aAAeG,EAAAA,kBAAkB,OACvCH,EAAM,aAAeG,EAAAA,kBAAkB,MACpC,aAAeC,EAAAA,OAAO,OAAO,QAC7B,CAAC;AAAA;AAAA"}