@bikdotai/bik-component-library 0.0.860-beta.2 → 0.0.860
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -1
- package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js.map +1 -1
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -0
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js.map +1 -1
- package/package.json +1 -1
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),q=require("../../../../assets/icons/maximize.svg.js"),f=require("chart.js"),Z=require("chartjs-plugin-datalabels"),F=require("react"),P=require("react-chartjs-2"),D=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),I=require("../utils/calcPercentage.js"),n=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js"),z=require("../../../icon-button/IconButton.js"),M=require("../../../modals/styledModal.js"),W=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},V=W(Z);f.Chart.register(f.CategoryScale,f.LinearScale,f.BarElement,f.Tooltip,f.Legend,V.default);const $=(e,c,x)=>{if(c.length<=x)return{truncatedData:e,truncatedLabels:c,originalData:e,originalLabels:c};const g=e.map(r=>r.slice(0,x)),y=e.map(r=>r.slice(x).reduce((h,S)=>h+S,0));g.forEach((r,h)=>r.push(y[h]));const A=c.slice(0,x);return A.push("Others"),{truncatedData:g,truncatedLabels:A,originalData:e,originalLabels:c}},Y=e=>{const{headerIcons:c=[],legendsAndIconDirection:x="row"}=e,[g,y]=F.useState(!1),A=[250,1e3,800,1500,300,600],r=e.yAxis.data.length===0,h={min:0,max:2e3,stepSize:200},S=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],B=["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"],j=e.customBarColors?e.customBarColors:e.customColourScaleBrand||e.customColourScalePastel?e.colorSchema===n.COLOR_SCHEMA.PASTEL?e.customColourScalePastel:e.customColourScaleBrand:e.colorSchema===n.COLOR_SCHEMA.PASTEL?B:S,H=e.customHoverColour,_=F.useMemo(()=>({barPercentage:e?.barPercentage||.4,categoryPercentage:e?.categoryPercentage??1,pointStyle:"circle",barWidth:e.barWidth,borderRadius:e?.borderRadius||void 0,...typeof e?.borderRadius=="object"?{borderSkipped:!1}:{},...e?.addBarGap?.flag?{borderWidth:{top:e?.addBarGap?.value||2,bottom:e?.addBarGap?.value||2,right:0,left:0},borderColor:"transparent"}:{}}),[e.barWidth,e?.borderRadius,e?.barPercentage,e?.addBarGap]),O={};e.yAxis.data.map(t=>{t.map(a=>{O[a.name]?O[a.name].push(a.value):O[a.name]=[a.value]})});const R=Object.keys(O).map((t,a)=>({label:t,data:O[t],backgroundColor:j?.[a],hoverBackgroundColor:H===void 0?void 0:H[a],..._}));let d;e.renderInHeightWiseManner?d=R.map((t,a)=>({...t,order:t.data.reduce((l,s)=>l+(s||0),0)})).sort((t,a)=>a.order-t.order):d=R;let T=e.xAxis.data.map(t=>typeof t=="string"?t:t.name),k=d;if(e.truncateBars){const t=$(d.map(a=>a.data),T,e.truncateBars);d.forEach((a,l)=>a.data=t.truncatedData[l]),T=t.truncatedLabels,k=t.originalData.map((a,l)=>({...d[l],data:a}))}const C={plugins:{legend:{display:!r&&!e.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!r,callbacks:{label:e.tooltipConfig?.labelCallback,title:e.tooltipConfig?.titleCallback,footer:e.tooltipConfig?.footerCallback},footerFont:e.tooltipConfig?.footerStyles?.footerFont},datalabels:{display:e.showTotal??!1,anchor:"end",align:"end",clamp:!0,formatter:(t,a)=>{const l=a.datasetIndex,s=a.chart.data.datasets;if(l!==s.length-1)return"";const N=a.dataIndex;let u=0;for(let L=0;L<s.length;L++)u+=s[L].data[N]??0;return u?u<1e3?u:(u/1e3).toString().substring(0,4)+"k":""},color:o.COLORS.content.secondary}},layout:{padding:{right:e.showTotal&&e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=n.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!e.customLegend,labels:{usePointStyle:!0}},indexAxis:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.titleColor:e.xAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.x>"u"?!0:e?.showGridLines?.x),color:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:e.yAxis.labelColor??o.COLORS.content.secondary,callback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.yAxis?.axisSuffix||"";return`${a}${l}`}:e.xAxis?.axisSuffix?t=>`${t}${e.xAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0:typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0},y:{...e?.equalHeight?.flag?{suggestedMin:-e?.equalHeight.max,suggestedMax:e?.equalHeight.max}:{},max:e?.yAxis?.max,title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.titleColor:e.yAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation!==n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.y>"u"?!0:e?.showGridLines?.y),color:o.COLORS.background.base},ticks:{stepSize:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.stepSize:e.yAxis?.stepSize,fontSize:o.FONTS.caption.fontSize,color:e.xAxis.labelColor??o.COLORS.content.secondary,...r?h:{},callback:e?.ticksCallback?e?.ticksCallback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.xAxis?.axisSuffix||"";return`${a}${l}`}:e.yAxis?.axisSuffix?t=>`${t}${e.yAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0:typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0}},onClick:(t,a)=>{if(!e.onBarClick)return;const l=a[0].datasetIndex,s=a[0].index,N=t.chart.data.datasets[l].label,u=t.chart.data.labels[s];e.onBarClick(u,N)},onHover:(t,a)=>{e.onBarClick&&a.length&&(t.native.target.style.cursor="pointer")}};!e.orientation||e.orientation===n.GRAPH_ORIENTATION.VERTICAL?delete C.scales.x.ticks.callback:delete C.scales.y.ticks.callback;let b;r?b=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:b=d;const G={labels:T,datasets:b};let m;r?m=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:m=k;const w={labels:e.xAxis.data.map(t=>typeof t=="string"?t:t.name),datasets:m},E=(t=!1)=>{let a;return e.allowChartPopup&&!t?a="flex-start":a="flex-end",i.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:a,flexWrap:"wrap"},children:R.map(l=>i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"},children:[i.jsx("div",{style:{backgroundColor:l.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),i.jsx(D.BodyTiny,{color:o.COLORS.content.secondary,children:l.label})]},l.label.replace(" ","_")))})};return i.jsxs(v.GraphContainerWrapper,{style:e.wrapperStyle??{},padding:e.outerPadding,customLegend:e.customLegend,children:[e.chartHeading&&i.jsxs("div",{style:{marginBottom:24,display:"flex",justifyContent:e.hideHeading?"flex-end":"space-between"},children:[e.hideHeading!==!0&&i.jsx(D.TitleRegular,{color:e.chartHeading.color??o.COLORS.content.secondary,children:e.chartHeading.heading}),e.allowChartPopup&&i.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:i.jsx("div",{children:i.jsx(z.IconButton,{Icon:q.default,onClick:()=>{y(!0)}})})})]}),e.customLegend&&i.jsxs("div",{style:{display:"flex",flexDirection:x,justifyContent:"space-between"},children:[i.jsx(v.HeaderIconWrapper,{children:c.map((t,a)=>i.jsx("div",{children:i.jsx("div",{children:t})},a))}),E()]}),i.jsx("div",{className:"graph__wrapper",children:i.jsx("div",{style:{height:e.graphCanvasHeight??500,width:e.graphCanvasWidth??"auto"},children:i.jsx(P.Bar,{options:C,data:G})})}),g&&i.jsx(M.StyledModal,{open:g,onClose:()=>y(!1),closeOnOutsideClick:!0,headingTitle:e.chartHeading?.heading,width:"85%",children:i.jsxs("div",{className:"graph__wrapper",style:{padding:"8px"},children:[e.customLegend&&E(!0),i.jsx("div",{style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"},children:i.jsx(P.Bar,{options:C,data:w})})]})})]})};exports.StackedBarChart=Y;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),q=require("../../../../assets/icons/maximize.svg.js"),f=require("chart.js"),Z=require("chartjs-plugin-datalabels"),F=require("react"),P=require("react-chartjs-2"),D=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),I=require("../utils/calcPercentage.js"),n=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js"),z=require("../../../icon-button/IconButton.js"),M=require("../../../modals/styledModal.js"),W=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},V=W(Z);f.Chart.register(f.CategoryScale,f.LinearScale,f.BarElement,f.Tooltip,f.Legend,V.default);const $=(e,c,x)=>{if(c.length<=x)return{truncatedData:e,truncatedLabels:c,originalData:e,originalLabels:c};const g=e.map(r=>r.slice(0,x)),y=e.map(r=>r.slice(x).reduce((h,S)=>h+S,0));g.forEach((r,h)=>r.push(y[h]));const A=c.slice(0,x);return A.push("Others"),{truncatedData:g,truncatedLabels:A,originalData:e,originalLabels:c}},Y=e=>{const{headerIcons:c=[],legendsAndIconDirection:x="row"}=e,[g,y]=F.useState(!1),A=[250,1e3,800,1500,300,600],r=e.yAxis.data.length===0,h={min:0,max:2e3,stepSize:200},S=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],B=["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"],j=e.customBarColors?e.customBarColors:e.customColourScaleBrand||e.customColourScalePastel?e.colorSchema===n.COLOR_SCHEMA.PASTEL?e.customColourScalePastel:e.customColourScaleBrand:e.colorSchema===n.COLOR_SCHEMA.PASTEL?B:S,H=e.customHoverColour,_=F.useMemo(()=>({barPercentage:e?.barPercentage||.4,categoryPercentage:e?.categoryPercentage??1,pointStyle:"circle",barWidth:e.barWidth,borderRadius:e?.borderRadius||void 0,...typeof e?.borderRadius=="object"?{borderSkipped:!1}:{},...e?.addBarGap?.flag?{borderWidth:{top:e?.addBarGap?.value||2,bottom:e?.addBarGap?.value||2,right:0,left:0},borderColor:"transparent"}:{}}),[e.barWidth,e?.borderRadius,e?.barPercentage,e?.categoryPercentage,e?.addBarGap]),O={};e.yAxis.data.map(t=>{t.map(a=>{O[a.name]?O[a.name].push(a.value):O[a.name]=[a.value]})});const R=Object.keys(O).map((t,a)=>({label:t,data:O[t],backgroundColor:j?.[a],hoverBackgroundColor:H===void 0?void 0:H[a],..._}));let d;e.renderInHeightWiseManner?d=R.map((t,a)=>({...t,order:t.data.reduce((l,s)=>l+(s||0),0)})).sort((t,a)=>a.order-t.order):d=R;let T=e.xAxis.data.map(t=>typeof t=="string"?t:t.name),k=d;if(e.truncateBars){const t=$(d.map(a=>a.data),T,e.truncateBars);d.forEach((a,l)=>a.data=t.truncatedData[l]),T=t.truncatedLabels,k=t.originalData.map((a,l)=>({...d[l],data:a}))}const C={plugins:{legend:{display:!r&&!e.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!r,callbacks:{label:e.tooltipConfig?.labelCallback,title:e.tooltipConfig?.titleCallback,footer:e.tooltipConfig?.footerCallback},footerFont:e.tooltipConfig?.footerStyles?.footerFont},datalabels:{display:e.showTotal??!1,anchor:"end",align:"end",clamp:!0,formatter:(t,a)=>{const l=a.datasetIndex,s=a.chart.data.datasets;if(l!==s.length-1)return"";const N=a.dataIndex;let u=0;for(let L=0;L<s.length;L++)u+=s[L].data[N]??0;return u?u<1e3?u:(u/1e3).toString().substring(0,4)+"k":""},color:o.COLORS.content.secondary}},layout:{padding:{right:e.showTotal&&e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=n.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!e.customLegend,labels:{usePointStyle:!0}},indexAxis:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.titleColor:e.xAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.x>"u"?!0:e?.showGridLines?.x),color:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:e.yAxis.labelColor??o.COLORS.content.secondary,callback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.yAxis?.axisSuffix||"";return`${a}${l}`}:e.xAxis?.axisSuffix?t=>`${t}${e.xAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0:typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0},y:{...e?.equalHeight?.flag?{suggestedMin:-e?.equalHeight.max,suggestedMax:e?.equalHeight.max}:{},max:e?.yAxis?.max,title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.titleColor:e.yAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation!==n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.y>"u"?!0:e?.showGridLines?.y),color:o.COLORS.background.base},ticks:{stepSize:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.stepSize:e.yAxis?.stepSize,fontSize:o.FONTS.caption.fontSize,color:e.xAxis.labelColor??o.COLORS.content.secondary,...r?h:{},callback:e?.ticksCallback?e?.ticksCallback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.xAxis?.axisSuffix||"";return`${a}${l}`}:e.yAxis?.axisSuffix?t=>`${t}${e.yAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0:typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0}},onClick:(t,a)=>{if(!e.onBarClick)return;const l=a[0].datasetIndex,s=a[0].index,N=t.chart.data.datasets[l].label,u=t.chart.data.labels[s];e.onBarClick(u,N)},onHover:(t,a)=>{e.onBarClick&&a.length&&(t.native.target.style.cursor="pointer")}};!e.orientation||e.orientation===n.GRAPH_ORIENTATION.VERTICAL?delete C.scales.x.ticks.callback:delete C.scales.y.ticks.callback;let b;r?b=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:b=d;const G={labels:T,datasets:b};let m;r?m=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:m=k;const w={labels:e.xAxis.data.map(t=>typeof t=="string"?t:t.name),datasets:m},E=(t=!1)=>{let a;return e.allowChartPopup&&!t?a="flex-start":a="flex-end",i.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:a,flexWrap:"wrap"},children:R.map(l=>i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"},children:[i.jsx("div",{style:{backgroundColor:l.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),i.jsx(D.BodyTiny,{color:o.COLORS.content.secondary,children:l.label})]},l.label.replace(" ","_")))})};return i.jsxs(v.GraphContainerWrapper,{style:e.wrapperStyle??{},padding:e.outerPadding,customLegend:e.customLegend,children:[e.chartHeading&&i.jsxs("div",{style:{marginBottom:24,display:"flex",justifyContent:e.hideHeading?"flex-end":"space-between"},children:[e.hideHeading!==!0&&i.jsx(D.TitleRegular,{color:e.chartHeading.color??o.COLORS.content.secondary,children:e.chartHeading.heading}),e.allowChartPopup&&i.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:i.jsx("div",{children:i.jsx(z.IconButton,{Icon:q.default,onClick:()=>{y(!0)}})})})]}),e.customLegend&&i.jsxs("div",{style:{display:"flex",flexDirection:x,justifyContent:"space-between"},children:[i.jsx(v.HeaderIconWrapper,{children:c.map((t,a)=>i.jsx("div",{children:i.jsx("div",{children:t})},a))}),E()]}),i.jsx("div",{className:"graph__wrapper",children:i.jsx("div",{style:{height:e.graphCanvasHeight??500,width:e.graphCanvasWidth??"auto"},children:i.jsx(P.Bar,{options:C,data:G})})}),g&&i.jsx(M.StyledModal,{open:g,onClose:()=>y(!1),closeOnOutsideClick:!0,headingTitle:e.chartHeading?.heading,width:"85%",children:i.jsxs("div",{className:"graph__wrapper",style:{padding:"8px"},children:[e.customLegend&&E(!0),i.jsx("div",{style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"},children:i.jsx(P.Bar,{options:C,data:w})})]})})]})};exports.StackedBarChart=Y;
|
|
2
2
|
//# sourceMappingURL=StackedBarChart.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StackedBarChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.tsx"],"sourcesContent":["import MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useMemo, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport {\n\tCOLOR_SCHEMA,\n\tGRAPH_ORIENTATION,\n\tStackedBarGraphI,\n} from './StackedBarChart.model';\nimport {\n\tGraphContainerWrapper,\n\tHeaderIconWrapper,\n} from './StackedBarChart.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\nconst truncateBars = (data, labels, limit) => {\n\tif (labels.length <= limit)\n\t\treturn {\n\t\t\ttruncatedData: data,\n\t\t\ttruncatedLabels: labels,\n\t\t\toriginalData: data,\n\t\t\toriginalLabels: labels,\n\t\t};\n\tconst truncatedData = data.map((d) => d.slice(0, limit));\n\tconst othersData = data.map((d) =>\n\t\td.slice(limit).reduce((acc, curr) => acc + curr, 0),\n\t);\n\ttruncatedData.forEach((d, i) => d.push(othersData[i]));\n\tconst truncatedLabels = labels.slice(0, limit);\n\ttruncatedLabels.push('Others');\n\treturn {\n\t\ttruncatedData,\n\t\ttruncatedLabels,\n\t\toriginalData: data,\n\t\toriginalLabels: labels,\n\t};\n};\n\nexport const StackedBarChart = (props: StackedBarGraphI) => {\n\tconst { headerIcons = [], legendsAndIconDirection = 'row' } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.length === 0;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\n\tconst colorScaleBrand = [\n\t\t'#5E07BB',\n\t\t'#9E77ED',\n\t\t'#D2AEFF',\n\t\t'#F7D7FF',\n\t\t'#CDE1FF',\n\t\t'#92AFFA',\n\t\t'#3935E1',\n\t];\n\n\tconst colourScalePastel = [\n\t\t'#E6C7FF',\n\t\t'#FEC6C6',\n\t\t'#FEDEF3',\n\t\t'#DEEFFF',\n\t\t'#FFD8B1',\n\t\t'#C7E5FF',\n\t\t'#FFD3E6',\n\t\t'#C9FFE5',\n\t\t'#FFE3C7',\n\t\t'#D9D9FF',\n\t];\n\n\t// Determine which color scale to use based on props\n\tconst getColorScale = () => {\n\t\t// If custom bar colors are provided, use them\n\t\tif (props.customBarColors) return props.customBarColors;\n\n\t\t// If custom brand or pastel colors are provided\n\t\tif (props.customColourScaleBrand || props.customColourScalePastel) {\n\t\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\t\treturn props.customColourScalePastel;\n\t\t\t} else {\n\t\t\t\treturn props.customColourScaleBrand;\n\t\t\t}\n\t\t}\n\n\t\t// Use default color scales based on schema\n\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\treturn colourScalePastel;\n\t\t} else {\n\t\t\treturn colorScaleBrand;\n\t\t}\n\t};\n\n\tconst colourScale = getColorScale();\n\tconst hoverColourScale = props.customHoverColour;\n\n\t// Memoized bar configuration settings\n\tconst barConfig = useMemo(\n\t\t() => ({\n\t\t\tbarPercentage: props?.barPercentage || 0.4,\n\t\t\tcategoryPercentage: props?.categoryPercentage ?? 1,\n\t\t\tpointStyle: 'circle',\n\t\t\tbarWidth: props.barWidth,\n\t\t\tborderRadius: props?.borderRadius || undefined,\n\t\t\t// If borderRadius is an object, disable border skipping\n\t\t\t...(typeof props?.borderRadius === 'object'\n\t\t\t\t? { borderSkipped: false }\n\t\t\t\t: {}),\n\t\t\t// If bar gap is enabled, add transparent borders for spacing\n\t\t\t...(props?.addBarGap?.flag\n\t\t\t\t? {\n\t\t\t\t\t\tborderWidth: {\n\t\t\t\t\t\t\ttop: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tbottom: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tborderColor: 'transparent',\n\t\t\t\t }\n\t\t\t\t: {}),\n\t\t}),\n\t\t[\n\t\t\tprops.barWidth,\n\t\t\tprops?.borderRadius,\n\t\t\tprops?.barPercentage,\n\t\t\tprops?.addBarGap,\n\t\t],\n\t);\n\n\t// Transform y-axis data into a map grouped by dataset name\n\tconst dataSetMap = {};\n\tprops.yAxis.data.map((ele) => {\n\t\tele.map((obj) => {\n\t\t\tif (dataSetMap[obj.name]) {\n\t\t\t\tdataSetMap[obj.name].push(obj.value);\n\t\t\t} else {\n\t\t\t\tdataSetMap[obj.name] = [obj.value];\n\t\t\t}\n\t\t});\n\t});\n\n\t// Create datasets for chart with colors and bar configuration\n\tconst yAxisStackedData = Object.keys(dataSetMap).map((key, ind) => {\n\t\treturn {\n\t\t\tlabel: key,\n\t\t\tdata: dataSetMap[key],\n\t\t\tbackgroundColor: colourScale?.[ind],\n\t\t\thoverBackgroundColor:\n\t\t\t\thoverColourScale === undefined ? undefined : hoverColourScale[ind],\n\t\t\t...barConfig,\n\t\t};\n\t});\n\n\t// Conditionally reorder datasets so smaller values are drawn on top (for overlapping bars)\n\tlet reorderedYAxisData;\n\tif (props.renderInHeightWiseManner) {\n\t\treorderedYAxisData = yAxisStackedData\n\t\t\t.map((dataset, datasetIndex) => {\n\t\t\t\treturn {\n\t\t\t\t\t...dataset,\n\t\t\t\t\t// Add order property: higher values = drawn first (behind)\n\t\t\t\t\torder: dataset.data.reduce((sum, val) => sum + (val || 0), 0),\n\t\t\t\t};\n\t\t\t})\n\t\t\t.sort((a, b) => b.order - a.order);\n\t} else {\n\t\treorderedYAxisData = yAxisStackedData;\n\t}\n\n\t// Extract labels from x-axis data (either string or object with name property)\n\tlet labels = props.xAxis.data.map((data) =>\n\t\ttypeof data === 'string' ? data : data.name,\n\t);\n\n\t// Keep track of original data before any truncation\n\tlet originalData = reorderedYAxisData;\n\t// Truncate bars if limit is specified\n\tif (props.truncateBars) {\n\t\tconst truncated = truncateBars(\n\t\t\treorderedYAxisData.map((d) => d.data),\n\t\t\tlabels,\n\t\t\tprops.truncateBars,\n\t\t);\n\t\treorderedYAxisData.forEach((d, i) => (d.data = truncated.truncatedData[i]));\n\t\tlabels = truncated.truncatedLabels;\n\t\toriginalData = truncated.originalData.map((data, i) => ({\n\t\t\t...reorderedYAxisData[i],\n\t\t\tdata,\n\t\t}));\n\t}\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\t// Show legend only if data exists and custom legend is not used\n\t\t\t\tdisplay: !noDataPresent && !props.customLegend,\n\t\t\t\tlabels: {\n\t\t\t\t\tusePointStyle: true,\n\t\t\t\t\tfontSize: 2,\n\t\t\t\t},\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\t// Enable tooltip only when data is present\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\ttitle: props.tooltipConfig?.titleCallback,\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: 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\t// Format total value label for stacked bars\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\t// Only show label on the last dataset (top of stack)\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\t// Calculate sum across all datasets for this data point\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\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\t// Format values under 1000 as-is, others as 'k' format\n\t\t\t\t\tif (sum < 1000) {\n\t\t\t\t\t\treturn sum;\n\t\t\t\t\t}\n\t\t\t\t\treturn (sum / 1000).toString().substring(0, 4) + 'k';\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\t// Add right padding for horizontal orientation when showing totals\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\t// Add top padding for non-horizontal orientation when showing totals\n\t\t\t\ttop:\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},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: !props.customLegend,\n\t\t\tlabels: {\n\t\t\t\tusePointStyle: true,\n\t\t\t},\n\t\t},\n\t\t// Set index axis based on orientation (y for horizontal, x for vertical)\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' | 'x',\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, x-axis shows y-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t: props.xAxis?.title),\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.yAxis?.title\n\t\t\t\t\t\t\t: props.xAxis?.title,\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.yAxis?.titleColor\n\t\t\t\t\t\t\t: props.xAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.x === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.x),\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: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Format tick labels based on orientation\n\t\t\t\t\tcallback:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst suffix = props.yAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: props.xAxis?.axisSuffix\n\t\t\t\t\t\t\t? (value) => `${value}${props.xAxis.axisSuffix}`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if x-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\t// Set equal height if flag is enabled (for symmetric charts)\n\t\t\t\t...(props?.equalHeight?.flag\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tsuggestedMin: -props?.equalHeight.max, // Set negative side\n\t\t\t\t\t\t\tsuggestedMax: props?.equalHeight.max, // Set positive side\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\tmax: props?.yAxis?.max,\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, y-axis shows x-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t: props.yAxis?.title),\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.xAxis?.title\n\t\t\t\t\t\t\t: props.yAxis?.title,\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.xAxis?.titleColor\n\t\t\t\t\t\t\t: props.yAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for non-horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation !== GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.y === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.y),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.stepSize\n\t\t\t\t\t\t\t: props.yAxis?.stepSize,\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// Apply no-data config if no data exists\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t\t// Use custom callback if provided, otherwise format based on orientation\n\t\t\t\t\tcallback: props?.ticksCallback\n\t\t\t\t\t\t? props?.ticksCallback\n\t\t\t\t\t\t: props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst suffix = props.xAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: props.yAxis?.axisSuffix\n\t\t\t\t\t\t? (value) => `${value}${props.yAxis.axisSuffix}`\n\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if y-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t},\n\t\t// Handle bar click events\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\t// Change cursor to pointer on hover when bar is clickable\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\n\t// Clean up tick callbacks based on orientation\n\tif (!props.orientation || props.orientation === GRAPH_ORIENTATION.VERTICAL) {\n\t\tdelete options.scales.x.ticks['callback'];\n\t} else {\n\t\tdelete options.scales.y.ticks['callback'];\n\t}\n\n\t// Prepare data for the chart\n\tlet chartDatasets;\n\tif (noDataPresent) {\n\t\tchartDatasets = [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }];\n\t} else {\n\t\tchartDatasets = reorderedYAxisData;\n\t}\n\n\tconst data = {\n\t\tlabels: labels,\n\t\tdatasets: chartDatasets,\n\t};\n\n\t// Prepare original chart data (used for popup modal)\n\tlet originalChartDatasets;\n\tif (noDataPresent) {\n\t\toriginalChartDatasets = [\n\t\t\t{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' },\n\t\t];\n\t} else {\n\t\toriginalChartDatasets = originalData;\n\t}\n\n\tconst originalChartData = {\n\t\tlabels: props.xAxis.data.map((data) =>\n\t\t\ttypeof data === 'string' ? data : data.name,\n\t\t),\n\t\tdatasets: originalChartDatasets,\n\t};\n\n\t// Render custom legend with color boxes\n\tconst renderLegend = (isPopup = false) => {\n\t\t// Determine justification based on whether popup is allowed and current context\n\t\tlet justification;\n\t\tif (props.allowChartPopup && !isPopup) {\n\t\t\tjustification = 'flex-start';\n\t\t} else {\n\t\t\tjustification = 'flex-end';\n\t\t}\n\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\tpadding: '0px 24px 12px 24px',\n\t\t\t\t\tjustifyContent: justification,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{yAxisStackedData.map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\t\tmarginTop: '4px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tbackgroundColor: _item.backgroundColor,\n\t\t\t\t\t\t\t\t\twidth: '16px',\n\t\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\t\tborderRadius: '2px',\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<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};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tcustomLegend={props.customLegend}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: props.hideHeading ? 'flex-end' : 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{props.hideHeading !== true && (\n\t\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t)}\n\t\t\t\t\t{props.allowChartPopup && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPopup(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</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.customLegend && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: legendsAndIconDirection,\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<HeaderIconWrapper>\n\t\t\t\t\t\t{headerIcons.map((icon, index) => (\n\t\t\t\t\t\t\t<div key={index}>\n\t\t\t\t\t\t\t\t<div>{icon}</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</HeaderIconWrapper>\n\t\t\t\t\t{renderLegend()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\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 ?? 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={data} />\n\t\t\t\t</div>\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={() => setShowPopup(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.chartHeading?.heading}\n\t\t\t\t\twidth=\"85%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"graph__wrapper\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '8px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.customLegend && renderLegend(true)}\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: '70vh',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tpadding: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '8px',\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={options} data={originalChartData} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","truncateBars","data","labels","limit","truncatedData","d","othersData","acc","curr","i","truncatedLabels","StackedBarChart","props","headerIcons","legendsAndIconDirection","showPopup","setShowPopup","useState","dummyValues","noDataPresent","yAxisConfigForNoData","colorScaleBrand","colourScalePastel","colourScale","COLOR_SCHEMA","hoverColourScale","barConfig","useMemo","dataSetMap","ele","obj","yAxisStackedData","key","ind","reorderedYAxisData","dataset","datasetIndex","sum","val","a","b","originalData","truncated","options","_","context","datasets","dataIndex","COLORS","GRAPH_ORIENTATION","FONTS","value","formattedValue","truncateValueForInternationalStore","truncateValueForIndianStore","suffix","e","activeEls","yAxisLabel","xAxisLabel","chartDatasets","originalChartDatasets","originalChartData","renderLegend","isPopup","justification","jsx","_item","jsxs","BodyTiny","GraphContainerWrapper","TitleRegular","IconButton","MaximizeIcon","HeaderIconWrapper","icon","index","Bar","StyledModal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"StackedBarChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.tsx"],"sourcesContent":["import MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useMemo, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport {\n\tCOLOR_SCHEMA,\n\tGRAPH_ORIENTATION,\n\tStackedBarGraphI,\n} from './StackedBarChart.model';\nimport {\n\tGraphContainerWrapper,\n\tHeaderIconWrapper,\n} from './StackedBarChart.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\nconst truncateBars = (data, labels, limit) => {\n\tif (labels.length <= limit)\n\t\treturn {\n\t\t\ttruncatedData: data,\n\t\t\ttruncatedLabels: labels,\n\t\t\toriginalData: data,\n\t\t\toriginalLabels: labels,\n\t\t};\n\tconst truncatedData = data.map((d) => d.slice(0, limit));\n\tconst othersData = data.map((d) =>\n\t\td.slice(limit).reduce((acc, curr) => acc + curr, 0),\n\t);\n\ttruncatedData.forEach((d, i) => d.push(othersData[i]));\n\tconst truncatedLabels = labels.slice(0, limit);\n\ttruncatedLabels.push('Others');\n\treturn {\n\t\ttruncatedData,\n\t\ttruncatedLabels,\n\t\toriginalData: data,\n\t\toriginalLabels: labels,\n\t};\n};\n\nexport const StackedBarChart = (props: StackedBarGraphI) => {\n\tconst { headerIcons = [], legendsAndIconDirection = 'row' } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.length === 0;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\n\tconst colorScaleBrand = [\n\t\t'#5E07BB',\n\t\t'#9E77ED',\n\t\t'#D2AEFF',\n\t\t'#F7D7FF',\n\t\t'#CDE1FF',\n\t\t'#92AFFA',\n\t\t'#3935E1',\n\t];\n\n\tconst colourScalePastel = [\n\t\t'#E6C7FF',\n\t\t'#FEC6C6',\n\t\t'#FEDEF3',\n\t\t'#DEEFFF',\n\t\t'#FFD8B1',\n\t\t'#C7E5FF',\n\t\t'#FFD3E6',\n\t\t'#C9FFE5',\n\t\t'#FFE3C7',\n\t\t'#D9D9FF',\n\t];\n\n\t// Determine which color scale to use based on props\n\tconst getColorScale = () => {\n\t\t// If custom bar colors are provided, use them\n\t\tif (props.customBarColors) return props.customBarColors;\n\n\t\t// If custom brand or pastel colors are provided\n\t\tif (props.customColourScaleBrand || props.customColourScalePastel) {\n\t\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\t\treturn props.customColourScalePastel;\n\t\t\t} else {\n\t\t\t\treturn props.customColourScaleBrand;\n\t\t\t}\n\t\t}\n\n\t\t// Use default color scales based on schema\n\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\treturn colourScalePastel;\n\t\t} else {\n\t\t\treturn colorScaleBrand;\n\t\t}\n\t};\n\n\tconst colourScale = getColorScale();\n\tconst hoverColourScale = props.customHoverColour;\n\n\t// Memoized bar configuration settings\n\tconst barConfig = useMemo(\n\t\t() => ({\n\t\t\tbarPercentage: props?.barPercentage || 0.4,\n\t\t\tcategoryPercentage: props?.categoryPercentage ?? 1,\n\t\t\tpointStyle: 'circle',\n\t\t\tbarWidth: props.barWidth,\n\t\t\tborderRadius: props?.borderRadius || undefined,\n\t\t\t// If borderRadius is an object, disable border skipping\n\t\t\t...(typeof props?.borderRadius === 'object'\n\t\t\t\t? { borderSkipped: false }\n\t\t\t\t: {}),\n\t\t\t// If bar gap is enabled, add transparent borders for spacing\n\t\t\t...(props?.addBarGap?.flag\n\t\t\t\t? {\n\t\t\t\t\t\tborderWidth: {\n\t\t\t\t\t\t\ttop: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tbottom: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tborderColor: 'transparent',\n\t\t\t\t }\n\t\t\t\t: {}),\n\t\t}),\n\t\t[\n\t\t\tprops.barWidth,\n\t\t\tprops?.borderRadius,\n\t\t\tprops?.barPercentage,\n\t\t\tprops?.categoryPercentage,\n\t\t\tprops?.addBarGap,\n\t\t],\n\t);\n\n\t// Transform y-axis data into a map grouped by dataset name\n\tconst dataSetMap = {};\n\tprops.yAxis.data.map((ele) => {\n\t\tele.map((obj) => {\n\t\t\tif (dataSetMap[obj.name]) {\n\t\t\t\tdataSetMap[obj.name].push(obj.value);\n\t\t\t} else {\n\t\t\t\tdataSetMap[obj.name] = [obj.value];\n\t\t\t}\n\t\t});\n\t});\n\n\t// Create datasets for chart with colors and bar configuration\n\tconst yAxisStackedData = Object.keys(dataSetMap).map((key, ind) => {\n\t\treturn {\n\t\t\tlabel: key,\n\t\t\tdata: dataSetMap[key],\n\t\t\tbackgroundColor: colourScale?.[ind],\n\t\t\thoverBackgroundColor:\n\t\t\t\thoverColourScale === undefined ? undefined : hoverColourScale[ind],\n\t\t\t...barConfig,\n\t\t};\n\t});\n\n\t// Conditionally reorder datasets so smaller values are drawn on top (for overlapping bars)\n\tlet reorderedYAxisData;\n\tif (props.renderInHeightWiseManner) {\n\t\treorderedYAxisData = yAxisStackedData\n\t\t\t.map((dataset, datasetIndex) => {\n\t\t\t\treturn {\n\t\t\t\t\t...dataset,\n\t\t\t\t\t// Add order property: higher values = drawn first (behind)\n\t\t\t\t\torder: dataset.data.reduce((sum, val) => sum + (val || 0), 0),\n\t\t\t\t};\n\t\t\t})\n\t\t\t.sort((a, b) => b.order - a.order);\n\t} else {\n\t\treorderedYAxisData = yAxisStackedData;\n\t}\n\n\t// Extract labels from x-axis data (either string or object with name property)\n\tlet labels = props.xAxis.data.map((data) =>\n\t\ttypeof data === 'string' ? data : data.name,\n\t);\n\n\t// Keep track of original data before any truncation\n\tlet originalData = reorderedYAxisData;\n\t// Truncate bars if limit is specified\n\tif (props.truncateBars) {\n\t\tconst truncated = truncateBars(\n\t\t\treorderedYAxisData.map((d) => d.data),\n\t\t\tlabels,\n\t\t\tprops.truncateBars,\n\t\t);\n\t\treorderedYAxisData.forEach((d, i) => (d.data = truncated.truncatedData[i]));\n\t\tlabels = truncated.truncatedLabels;\n\t\toriginalData = truncated.originalData.map((data, i) => ({\n\t\t\t...reorderedYAxisData[i],\n\t\t\tdata,\n\t\t}));\n\t}\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\t// Show legend only if data exists and custom legend is not used\n\t\t\t\tdisplay: !noDataPresent && !props.customLegend,\n\t\t\t\tlabels: {\n\t\t\t\t\tusePointStyle: true,\n\t\t\t\t\tfontSize: 2,\n\t\t\t\t},\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\t// Enable tooltip only when data is present\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\ttitle: props.tooltipConfig?.titleCallback,\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: 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\t// Format total value label for stacked bars\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\t// Only show label on the last dataset (top of stack)\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\t// Calculate sum across all datasets for this data point\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\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\t// Format values under 1000 as-is, others as 'k' format\n\t\t\t\t\tif (sum < 1000) {\n\t\t\t\t\t\treturn sum;\n\t\t\t\t\t}\n\t\t\t\t\treturn (sum / 1000).toString().substring(0, 4) + 'k';\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\t// Add right padding for horizontal orientation when showing totals\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\t// Add top padding for non-horizontal orientation when showing totals\n\t\t\t\ttop:\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},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: !props.customLegend,\n\t\t\tlabels: {\n\t\t\t\tusePointStyle: true,\n\t\t\t},\n\t\t},\n\t\t// Set index axis based on orientation (y for horizontal, x for vertical)\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' | 'x',\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, x-axis shows y-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t: props.xAxis?.title),\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.yAxis?.title\n\t\t\t\t\t\t\t: props.xAxis?.title,\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.yAxis?.titleColor\n\t\t\t\t\t\t\t: props.xAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.x === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.x),\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: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Format tick labels based on orientation\n\t\t\t\t\tcallback:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst suffix = props.yAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: props.xAxis?.axisSuffix\n\t\t\t\t\t\t\t? (value) => `${value}${props.xAxis.axisSuffix}`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if x-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\t// Set equal height if flag is enabled (for symmetric charts)\n\t\t\t\t...(props?.equalHeight?.flag\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tsuggestedMin: -props?.equalHeight.max, // Set negative side\n\t\t\t\t\t\t\tsuggestedMax: props?.equalHeight.max, // Set positive side\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\tmax: props?.yAxis?.max,\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, y-axis shows x-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t: props.yAxis?.title),\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.xAxis?.title\n\t\t\t\t\t\t\t: props.yAxis?.title,\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.xAxis?.titleColor\n\t\t\t\t\t\t\t: props.yAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for non-horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation !== GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.y === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.y),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.stepSize\n\t\t\t\t\t\t\t: props.yAxis?.stepSize,\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// Apply no-data config if no data exists\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t\t// Use custom callback if provided, otherwise format based on orientation\n\t\t\t\t\tcallback: props?.ticksCallback\n\t\t\t\t\t\t? props?.ticksCallback\n\t\t\t\t\t\t: props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst suffix = props.xAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: props.yAxis?.axisSuffix\n\t\t\t\t\t\t? (value) => `${value}${props.yAxis.axisSuffix}`\n\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if y-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t},\n\t\t// Handle bar click events\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\t// Change cursor to pointer on hover when bar is clickable\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\n\t// Clean up tick callbacks based on orientation\n\tif (!props.orientation || props.orientation === GRAPH_ORIENTATION.VERTICAL) {\n\t\tdelete options.scales.x.ticks['callback'];\n\t} else {\n\t\tdelete options.scales.y.ticks['callback'];\n\t}\n\n\t// Prepare data for the chart\n\tlet chartDatasets;\n\tif (noDataPresent) {\n\t\tchartDatasets = [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }];\n\t} else {\n\t\tchartDatasets = reorderedYAxisData;\n\t}\n\n\tconst data = {\n\t\tlabels: labels,\n\t\tdatasets: chartDatasets,\n\t};\n\n\t// Prepare original chart data (used for popup modal)\n\tlet originalChartDatasets;\n\tif (noDataPresent) {\n\t\toriginalChartDatasets = [\n\t\t\t{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' },\n\t\t];\n\t} else {\n\t\toriginalChartDatasets = originalData;\n\t}\n\n\tconst originalChartData = {\n\t\tlabels: props.xAxis.data.map((data) =>\n\t\t\ttypeof data === 'string' ? data : data.name,\n\t\t),\n\t\tdatasets: originalChartDatasets,\n\t};\n\n\t// Render custom legend with color boxes\n\tconst renderLegend = (isPopup = false) => {\n\t\t// Determine justification based on whether popup is allowed and current context\n\t\tlet justification;\n\t\tif (props.allowChartPopup && !isPopup) {\n\t\t\tjustification = 'flex-start';\n\t\t} else {\n\t\t\tjustification = 'flex-end';\n\t\t}\n\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\tpadding: '0px 24px 12px 24px',\n\t\t\t\t\tjustifyContent: justification,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{yAxisStackedData.map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\t\tmarginTop: '4px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tbackgroundColor: _item.backgroundColor,\n\t\t\t\t\t\t\t\t\twidth: '16px',\n\t\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\t\tborderRadius: '2px',\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<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};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tcustomLegend={props.customLegend}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: props.hideHeading ? 'flex-end' : 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{props.hideHeading !== true && (\n\t\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t)}\n\t\t\t\t\t{props.allowChartPopup && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPopup(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</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.customLegend && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: legendsAndIconDirection,\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<HeaderIconWrapper>\n\t\t\t\t\t\t{headerIcons.map((icon, index) => (\n\t\t\t\t\t\t\t<div key={index}>\n\t\t\t\t\t\t\t\t<div>{icon}</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</HeaderIconWrapper>\n\t\t\t\t\t{renderLegend()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\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 ?? 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={data} />\n\t\t\t\t</div>\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={() => setShowPopup(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.chartHeading?.heading}\n\t\t\t\t\twidth=\"85%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"graph__wrapper\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '8px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.customLegend && renderLegend(true)}\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: '70vh',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tpadding: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '8px',\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={options} data={originalChartData} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","truncateBars","data","labels","limit","truncatedData","d","othersData","acc","curr","i","truncatedLabels","StackedBarChart","props","headerIcons","legendsAndIconDirection","showPopup","setShowPopup","useState","dummyValues","noDataPresent","yAxisConfigForNoData","colorScaleBrand","colourScalePastel","colourScale","COLOR_SCHEMA","hoverColourScale","barConfig","useMemo","dataSetMap","ele","obj","yAxisStackedData","key","ind","reorderedYAxisData","dataset","datasetIndex","sum","val","a","b","originalData","truncated","options","_","context","datasets","dataIndex","COLORS","GRAPH_ORIENTATION","FONTS","value","formattedValue","truncateValueForInternationalStore","truncateValueForIndianStore","suffix","e","activeEls","yAxisLabel","xAxisLabel","chartDatasets","originalChartDatasets","originalChartData","renderLegend","isPopup","justification","jsx","_item","jsxs","BodyTiny","GraphContainerWrapper","TitleRegular","IconButton","MaximizeIcon","HeaderIconWrapper","icon","index","Bar","StyledModal"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StackedBarChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.tsx"],"sourcesContent":["import MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useMemo, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport {\n\tCOLOR_SCHEMA,\n\tGRAPH_ORIENTATION,\n\tStackedBarGraphI,\n} from './StackedBarChart.model';\nimport {\n\tGraphContainerWrapper,\n\tHeaderIconWrapper,\n} from './StackedBarChart.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\nconst truncateBars = (data, labels, limit) => {\n\tif (labels.length <= limit)\n\t\treturn {\n\t\t\ttruncatedData: data,\n\t\t\ttruncatedLabels: labels,\n\t\t\toriginalData: data,\n\t\t\toriginalLabels: labels,\n\t\t};\n\tconst truncatedData = data.map((d) => d.slice(0, limit));\n\tconst othersData = data.map((d) =>\n\t\td.slice(limit).reduce((acc, curr) => acc + curr, 0),\n\t);\n\ttruncatedData.forEach((d, i) => d.push(othersData[i]));\n\tconst truncatedLabels = labels.slice(0, limit);\n\ttruncatedLabels.push('Others');\n\treturn {\n\t\ttruncatedData,\n\t\ttruncatedLabels,\n\t\toriginalData: data,\n\t\toriginalLabels: labels,\n\t};\n};\n\nexport const StackedBarChart = (props: StackedBarGraphI) => {\n\tconst { headerIcons = [], legendsAndIconDirection = 'row' } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.length === 0;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\n\tconst colorScaleBrand = [\n\t\t'#5E07BB',\n\t\t'#9E77ED',\n\t\t'#D2AEFF',\n\t\t'#F7D7FF',\n\t\t'#CDE1FF',\n\t\t'#92AFFA',\n\t\t'#3935E1',\n\t];\n\n\tconst colourScalePastel = [\n\t\t'#E6C7FF',\n\t\t'#FEC6C6',\n\t\t'#FEDEF3',\n\t\t'#DEEFFF',\n\t\t'#FFD8B1',\n\t\t'#C7E5FF',\n\t\t'#FFD3E6',\n\t\t'#C9FFE5',\n\t\t'#FFE3C7',\n\t\t'#D9D9FF',\n\t];\n\n\t// Determine which color scale to use based on props\n\tconst getColorScale = () => {\n\t\t// If custom bar colors are provided, use them\n\t\tif (props.customBarColors) return props.customBarColors;\n\n\t\t// If custom brand or pastel colors are provided\n\t\tif (props.customColourScaleBrand || props.customColourScalePastel) {\n\t\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\t\treturn props.customColourScalePastel;\n\t\t\t} else {\n\t\t\t\treturn props.customColourScaleBrand;\n\t\t\t}\n\t\t}\n\n\t\t// Use default color scales based on schema\n\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\treturn colourScalePastel;\n\t\t} else {\n\t\t\treturn colorScaleBrand;\n\t\t}\n\t};\n\n\tconst colourScale = getColorScale();\n\tconst hoverColourScale = props.customHoverColour;\n\n\t// Memoized bar configuration settings\n\tconst barConfig = useMemo(\n\t\t() => ({\n\t\t\tbarPercentage: props?.barPercentage || 0.4,\n\t\t\tcategoryPercentage: props?.categoryPercentage ?? 1,\n\t\t\tpointStyle: 'circle',\n\t\t\tbarWidth: props.barWidth,\n\t\t\tborderRadius: props?.borderRadius || undefined,\n\t\t\t// If borderRadius is an object, disable border skipping\n\t\t\t...(typeof props?.borderRadius === 'object'\n\t\t\t\t? { borderSkipped: false }\n\t\t\t\t: {}),\n\t\t\t// If bar gap is enabled, add transparent borders for spacing\n\t\t\t...(props?.addBarGap?.flag\n\t\t\t\t? {\n\t\t\t\t\t\tborderWidth: {\n\t\t\t\t\t\t\ttop: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tbottom: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tborderColor: 'transparent',\n\t\t\t\t }\n\t\t\t\t: {}),\n\t\t}),\n\t\t[\n\t\t\tprops.barWidth,\n\t\t\tprops?.borderRadius,\n\t\t\tprops?.barPercentage,\n\t\t\tprops?.addBarGap,\n\t\t],\n\t);\n\n\t// Transform y-axis data into a map grouped by dataset name\n\tconst dataSetMap = {};\n\tprops.yAxis.data.map((ele) => {\n\t\tele.map((obj) => {\n\t\t\tif (dataSetMap[obj.name]) {\n\t\t\t\tdataSetMap[obj.name].push(obj.value);\n\t\t\t} else {\n\t\t\t\tdataSetMap[obj.name] = [obj.value];\n\t\t\t}\n\t\t});\n\t});\n\n\t// Create datasets for chart with colors and bar configuration\n\tconst yAxisStackedData = Object.keys(dataSetMap).map((key, ind) => {\n\t\treturn {\n\t\t\tlabel: key,\n\t\t\tdata: dataSetMap[key],\n\t\t\tbackgroundColor: colourScale?.[ind],\n\t\t\thoverBackgroundColor:\n\t\t\t\thoverColourScale === undefined ? undefined : hoverColourScale[ind],\n\t\t\t...barConfig,\n\t\t};\n\t});\n\n\t// Conditionally reorder datasets so smaller values are drawn on top (for overlapping bars)\n\tlet reorderedYAxisData;\n\tif (props.renderInHeightWiseManner) {\n\t\treorderedYAxisData = yAxisStackedData\n\t\t\t.map((dataset, datasetIndex) => {\n\t\t\t\treturn {\n\t\t\t\t\t...dataset,\n\t\t\t\t\t// Add order property: higher values = drawn first (behind)\n\t\t\t\t\torder: dataset.data.reduce((sum, val) => sum + (val || 0), 0),\n\t\t\t\t};\n\t\t\t})\n\t\t\t.sort((a, b) => b.order - a.order);\n\t} else {\n\t\treorderedYAxisData = yAxisStackedData;\n\t}\n\n\t// Extract labels from x-axis data (either string or object with name property)\n\tlet labels = props.xAxis.data.map((data) =>\n\t\ttypeof data === 'string' ? data : data.name,\n\t);\n\n\t// Keep track of original data before any truncation\n\tlet originalData = reorderedYAxisData;\n\t// Truncate bars if limit is specified\n\tif (props.truncateBars) {\n\t\tconst truncated = truncateBars(\n\t\t\treorderedYAxisData.map((d) => d.data),\n\t\t\tlabels,\n\t\t\tprops.truncateBars,\n\t\t);\n\t\treorderedYAxisData.forEach((d, i) => (d.data = truncated.truncatedData[i]));\n\t\tlabels = truncated.truncatedLabels;\n\t\toriginalData = truncated.originalData.map((data, i) => ({\n\t\t\t...reorderedYAxisData[i],\n\t\t\tdata,\n\t\t}));\n\t}\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\t// Show legend only if data exists and custom legend is not used\n\t\t\t\tdisplay: !noDataPresent && !props.customLegend,\n\t\t\t\tlabels: {\n\t\t\t\t\tusePointStyle: true,\n\t\t\t\t\tfontSize: 2,\n\t\t\t\t},\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\t// Enable tooltip only when data is present\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\ttitle: props.tooltipConfig?.titleCallback,\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: 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\t// Format total value label for stacked bars\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\t// Only show label on the last dataset (top of stack)\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\t// Calculate sum across all datasets for this data point\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\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\t// Format values under 1000 as-is, others as 'k' format\n\t\t\t\t\tif (sum < 1000) {\n\t\t\t\t\t\treturn sum;\n\t\t\t\t\t}\n\t\t\t\t\treturn (sum / 1000).toString().substring(0, 4) + 'k';\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\t// Add right padding for horizontal orientation when showing totals\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\t// Add top padding for non-horizontal orientation when showing totals\n\t\t\t\ttop:\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},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: !props.customLegend,\n\t\t\tlabels: {\n\t\t\t\tusePointStyle: true,\n\t\t\t},\n\t\t},\n\t\t// Set index axis based on orientation (y for horizontal, x for vertical)\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' | 'x',\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, x-axis shows y-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t: props.xAxis?.title),\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.yAxis?.title\n\t\t\t\t\t\t\t: props.xAxis?.title,\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.yAxis?.titleColor\n\t\t\t\t\t\t\t: props.xAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.x === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.x),\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: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Format tick labels based on orientation\n\t\t\t\t\tcallback:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst suffix = props.yAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: props.xAxis?.axisSuffix\n\t\t\t\t\t\t\t? (value) => `${value}${props.xAxis.axisSuffix}`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if x-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\t// Set equal height if flag is enabled (for symmetric charts)\n\t\t\t\t...(props?.equalHeight?.flag\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tsuggestedMin: -props?.equalHeight.max, // Set negative side\n\t\t\t\t\t\t\tsuggestedMax: props?.equalHeight.max, // Set positive side\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\tmax: props?.yAxis?.max,\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, y-axis shows x-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t: props.yAxis?.title),\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.xAxis?.title\n\t\t\t\t\t\t\t: props.yAxis?.title,\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.xAxis?.titleColor\n\t\t\t\t\t\t\t: props.yAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for non-horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation !== GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.y === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.y),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.stepSize\n\t\t\t\t\t\t\t: props.yAxis?.stepSize,\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// Apply no-data config if no data exists\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t\t// Use custom callback if provided, otherwise format based on orientation\n\t\t\t\t\tcallback: props?.ticksCallback\n\t\t\t\t\t\t? props?.ticksCallback\n\t\t\t\t\t\t: props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst suffix = props.xAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: props.yAxis?.axisSuffix\n\t\t\t\t\t\t? (value) => `${value}${props.yAxis.axisSuffix}`\n\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if y-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t},\n\t\t// Handle bar click events\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\t// Change cursor to pointer on hover when bar is clickable\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\n\t// Clean up tick callbacks based on orientation\n\tif (!props.orientation || props.orientation === GRAPH_ORIENTATION.VERTICAL) {\n\t\tdelete options.scales.x.ticks['callback'];\n\t} else {\n\t\tdelete options.scales.y.ticks['callback'];\n\t}\n\n\t// Prepare data for the chart\n\tlet chartDatasets;\n\tif (noDataPresent) {\n\t\tchartDatasets = [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }];\n\t} else {\n\t\tchartDatasets = reorderedYAxisData;\n\t}\n\n\tconst data = {\n\t\tlabels: labels,\n\t\tdatasets: chartDatasets,\n\t};\n\n\t// Prepare original chart data (used for popup modal)\n\tlet originalChartDatasets;\n\tif (noDataPresent) {\n\t\toriginalChartDatasets = [\n\t\t\t{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' },\n\t\t];\n\t} else {\n\t\toriginalChartDatasets = originalData;\n\t}\n\n\tconst originalChartData = {\n\t\tlabels: props.xAxis.data.map((data) =>\n\t\t\ttypeof data === 'string' ? data : data.name,\n\t\t),\n\t\tdatasets: originalChartDatasets,\n\t};\n\n\t// Render custom legend with color boxes\n\tconst renderLegend = (isPopup = false) => {\n\t\t// Determine justification based on whether popup is allowed and current context\n\t\tlet justification;\n\t\tif (props.allowChartPopup && !isPopup) {\n\t\t\tjustification = 'flex-start';\n\t\t} else {\n\t\t\tjustification = 'flex-end';\n\t\t}\n\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\tpadding: '0px 24px 12px 24px',\n\t\t\t\t\tjustifyContent: justification,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{yAxisStackedData.map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\t\tmarginTop: '4px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tbackgroundColor: _item.backgroundColor,\n\t\t\t\t\t\t\t\t\twidth: '16px',\n\t\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\t\tborderRadius: '2px',\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<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};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tcustomLegend={props.customLegend}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: props.hideHeading ? 'flex-end' : 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{props.hideHeading !== true && (\n\t\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t)}\n\t\t\t\t\t{props.allowChartPopup && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPopup(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</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.customLegend && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: legendsAndIconDirection,\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<HeaderIconWrapper>\n\t\t\t\t\t\t{headerIcons.map((icon, index) => (\n\t\t\t\t\t\t\t<div key={index}>\n\t\t\t\t\t\t\t\t<div>{icon}</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</HeaderIconWrapper>\n\t\t\t\t\t{renderLegend()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\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 ?? 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={data} />\n\t\t\t\t</div>\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={() => setShowPopup(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.chartHeading?.heading}\n\t\t\t\t\twidth=\"85%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"graph__wrapper\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '8px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.customLegend && renderLegend(true)}\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: '70vh',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tpadding: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '8px',\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={options} data={originalChartData} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","truncateBars","data","labels","limit","truncatedData","d","othersData","acc","curr","i","truncatedLabels","StackedBarChart","props","headerIcons","legendsAndIconDirection","showPopup","setShowPopup","useState","dummyValues","noDataPresent","yAxisConfigForNoData","colorScaleBrand","colourScalePastel","colourScale","COLOR_SCHEMA","hoverColourScale","barConfig","useMemo","dataSetMap","ele","obj","yAxisStackedData","key","ind","reorderedYAxisData","dataset","datasetIndex","sum","val","a","b","originalData","truncated","options","_","context","datasets","dataIndex","COLORS","GRAPH_ORIENTATION","FONTS","value","formattedValue","truncateValueForInternationalStore","truncateValueForIndianStore","suffix","e","activeEls","yAxisLabel","xAxisLabel","chartDatasets","originalChartDatasets","originalChartData","renderLegend","isPopup","justification","jsx","_item","jsxs","BodyTiny","GraphContainerWrapper","TitleRegular","IconButton","MaximizeIcon","HeaderIconWrapper","icon","index","Bar","StyledModal"],"mappings":";;;;;;;;;;;;;AA8BAA,EAAQ;AAAA,EACPC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AACD;AAEA,MAAMC,KAAe,CAACC,GAAMC,GAAQC,MAAU;AAC7C,MAAID,EAAO,UAAUC;AACpB,WAAO;AAAA,MACN,eAAeF;AAAA,MACf,iBAAiBC;AAAA,MACjB,cAAcD;AAAA,MACd,gBAAgBC;AAAA,IAAA;AAElB,QAAME,IAAgBH,EAAK,IAAI,CAACI,MAAMA,EAAE,MAAM,GAAGF,CAAK,CAAC,GACjDG,IAAaL,EAAK;AAAA,IAAI,CAACI,MAC5BA,EAAE,MAAMF,CAAK,EAAE,OAAO,CAACI,GAAKC,MAASD,IAAMC,GAAM,CAAC;AAAA,EAAA;AAEnD,EAAAJ,EAAc,QAAQ,CAACC,GAAGI,MAAMJ,EAAE,KAAKC,EAAWG,CAAC,CAAC,CAAC;AACrD,QAAMC,IAAkBR,EAAO,MAAM,GAAGC,CAAK;AAC7C,SAAAO,EAAgB,KAAK,QAAQ,GACtB;AAAA,IACN,eAAAN;AAAA,IACA,iBAAAM;AAAA,IACA,cAAcT;AAAA,IACd,gBAAgBC;AAAA,EAAA;AAElB,GAEaS,KAAkB,CAACC,MAA4B;AAC3D,QAAM,EAAE,aAAAC,IAAc,CAAA,GAAI,yBAAAC,IAA0B,UAAUF,GACxD,CAACG,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1CC,IAAc,CAAC,KAAK,KAAM,KAAK,MAAM,KAAK,GAAG,GAC7CC,IAAgBP,EAAM,MAAM,KAAK,WAAW,GAC5CQ,IAAuB;AAAA,IAC5B,KAAK;AAAA,IACL,KAAK;AAAA,IACL,UAAU;AAAA,EAAA,GAGLC,IAAkB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAGKC,IAAoB;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAyBKC,IAnBDX,EAAM,kBAAwBA,EAAM,kBAGpCA,EAAM,0BAA0BA,EAAM,0BACrCA,EAAM,gBAAgBY,EAAa,SAC/BZ,EAAM,0BAENA,EAAM,yBAKXA,EAAM,gBAAgBY,EAAa,SAC/BF,IAEAD,GAKHI,IAAmBb,EAAM,mBAGzBc,IAAYC;AAAA,IACjB,OAAO;AAAA,MACN,eAAef,GAAO,iBAAiB;AAAA,MACvC,oBAAoBA,GAAO,sBAAsB;AAAA,MACjD,YAAY;AAAA,MACZ,UAAUA,EAAM;AAAA,MAChB,cAAcA,GAAO,gBAAgB;AAAA;AAAA,MAErC,GAAI,OAAOA,GAAO,gBAAiB,WAChC,EAAE,eAAe,GAAA,IACjB,CAAA;AAAA;AAAA,MAEH,GAAIA,GAAO,WAAW,OACnB;AAAA,QACA,aAAa;AAAA,UACZ,KAAKA,GAAO,WAAW,SAAS;AAAA,UAChC,QAAQA,GAAO,WAAW,SAAS;AAAA,UACnC,OAAO;AAAA,UACP,MAAM;AAAA,QAAA;AAAA,QAEP,aAAa;AAAA,MAAA,IAEb,CAAA;AAAA,IAAC;AAAA,IAEL;AAAA,MACCA,EAAM;AAAA,MACNA,GAAO;AAAA,MACPA,GAAO;AAAA,MACPA,GAAO;AAAA,IAAA;AAAA,EACR,GAIKgB,IAAa,CAAA;AACnB,EAAAhB,EAAM,MAAM,KAAK,IAAI,CAACiB,MAAQ;AAC7B,IAAAA,EAAI,IAAI,CAACC,MAAQ;AAChB,MAAIF,EAAWE,EAAI,IAAI,IACtBF,EAAWE,EAAI,IAAI,EAAE,KAAKA,EAAI,KAAK,IAEnCF,EAAWE,EAAI,IAAI,IAAI,CAACA,EAAI,KAAK;AAAA,IAEnC,CAAC;AAAA,EACF,CAAC;AAGD,QAAMC,IAAmB,OAAO,KAAKH,CAAU,EAAE,IAAI,CAACI,GAAKC,OACnD;AAAA,IACN,OAAOD;AAAA,IACP,MAAMJ,EAAWI,CAAG;AAAA,IACpB,iBAAiBT,IAAcU,CAAG;AAAA,IAClC,sBACCR,MAAqB,SAAY,SAAYA,EAAiBQ,CAAG;AAAA,IAClE,GAAGP;AAAA,EAAA,EAEJ;AAGD,MAAIQ;AACJ,EAAItB,EAAM,2BACTsB,IAAqBH,EACnB,IAAI,CAACI,GAASC,OACP;AAAA,IACN,GAAGD;AAAA;AAAA,IAEH,OAAOA,EAAQ,KAAK,OAAO,CAACE,GAAKC,MAAQD,KAAOC,KAAO,IAAI,CAAC;AAAA,EAAA,EAE7D,EACA,KAAK,CAACC,GAAGC,MAAMA,EAAE,QAAQD,EAAE,KAAK,IAElCL,IAAqBH;AAItB,MAAI7B,IAASU,EAAM,MAAM,KAAK;AAAA,IAAI,CAACX,MAClC,OAAOA,KAAS,WAAWA,IAAOA,EAAK;AAAA,EAAA,GAIpCwC,IAAeP;AAEnB,MAAItB,EAAM,cAAc;AACvB,UAAM8B,IAAY1C;AAAA,MACjBkC,EAAmB,IAAI,CAAC7B,MAAMA,EAAE,IAAI;AAAA,MACpCH;AAAA,MACAU,EAAM;AAAA,IAAA;AAEP,IAAAsB,EAAmB,QAAQ,CAAC7B,GAAG,MAAOA,EAAE,OAAOqC,EAAU,cAAc,CAAC,CAAE,GAC1ExC,IAASwC,EAAU,iBACnBD,IAAeC,EAAU,aAAa,IAAI,CAACzC,GAAM,OAAO;AAAA,MACvD,GAAGiC,EAAmB,CAAC;AAAA,MACvB,MAAAjC;AAAAA,IAAA,EACC;AAAA,EACH;AAEA,QAAM0C,IAAU;AAAA,IACf,SAAS;AAAA,MACR,QAAQ;AAAA;AAAA,QAEP,SAAS,CAACxB,KAAiB,CAACP,EAAM;AAAA,QAClC,QAAQ;AAAA,UACP,eAAe;AAAA,UACf,UAAU;AAAA,QAAA;AAAA,MACX;AAAA,MAED,SAAS;AAAA;AAAA,QAER,SAAS,CAACO;AAAA,QACV,WAAW;AAAA,UACV,OAAOP,EAAM,eAAe;AAAA,UAC5B,OAAOA,EAAM,eAAe;AAAA,UAC5B,QAAQA,EAAM,eAAe;AAAA,QAAA;AAAA,QAE9B,YAAYA,EAAM,eAAe,cAAc;AAAA,MAAA;AAAA,MAEhD,YAAY;AAAA,QACX,SAASA,EAAM,aAAa;AAAA,QAC5B,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,OAAO;AAAA;AAAA,QAEP,WAAW,CAACgC,GAAGC,MAAY;AAC1B,gBAAMT,IAAeS,EAAQ,cACvBC,IAAWD,EAAQ,MAAM,KAAK;AAEpC,cAAIT,MAAiBU,EAAS,SAAS;AACtC,mBAAO;AAER,gBAAMC,IAAYF,EAAQ;AAE1B,cAAIR,IAAM;AACV,mBAAS5B,IAAI,GAAGA,IAAIqC,EAAS,QAAQrC;AACpC,YAAA4B,KAAOS,EAASrC,CAAC,EAAE,KAAKsC,CAAS,KAAK;AAEvC,iBAAKV,IAIDA,IAAM,MACFA,KAEAA,IAAM,KAAM,SAAA,EAAW,UAAU,GAAG,CAAC,IAAI,MANzC;AAAA,QAOT;AAAA,QACA,OAAOW,EAAO,QAAQ;AAAA,MAAA;AAAA,IACvB;AAAA,IAED,QAAQ;AAAA,MACP,SAAS;AAAA;AAAA,QAER,OACCpC,EAAM,aAAaA,EAAM,gBAAgBqC,EAAkB,aACxD,KACA;AAAA;AAAA,QAEJ,KACCrC,EAAM,aAAaA,EAAM,eAAeqC,EAAkB,aACvD,KACA;AAAA,MAAA;AAAA,IACL;AAAA,IAED,YAAY;AAAA,IACZ,qBAAqB;AAAA,IACrB,QAAQ;AAAA,MACP,SAAS,CAACrC,EAAM;AAAA,MAChB,QAAQ;AAAA,QACP,eAAe;AAAA,MAAA;AAAA,IAChB;AAAA;AAAA,IAGD,WAAYA,EAAM,gBAAgBqC,EAAkB,aACjD,MACA;AAAA,IACH,QAAQ;AAAA,MACP,GAAG;AAAA,QACF,OAAO;AAAA;AAAA,UAEN,SAAS,CAAC,EAAErC,EAAM,gBAAgBqC,EAAkB,aACjDrC,EAAM,OAAO,QACbA,EAAM,OAAO;AAAA,UAChB,MACCA,EAAM,gBAAgBqC,EAAkB,aACrCrC,EAAM,OAAO,QACbA,EAAM,OAAO;AAAA,UACjB,QACEA,EAAM,gBAAgBqC,EAAkB,aACtCrC,EAAM,OAAO,aACbA,EAAM,OAAO,eAAeoC,EAAO,QAAQ;AAAA,UAC/C,MAAM,EAAE,MAAME,EAAM,QAAQ,SAAA;AAAA,QAAS;AAAA,QAEtC,MAAM;AAAA;AAAA,UAEL,SACCtC,EAAM,gBAAgBqC,EAAkB,eACvC,OAAOrC,GAAO,eAAe,IAAM,MACjC,KACAA,GAAO,eAAe;AAAA,UAC1B,OAAOoC,EAAO,WAAW;AAAA,QAAA;AAAA,QAE1B,OAAO;AAAA,UACN,UAAUE,EAAM,QAAQ;AAAA,UACxB,OAAOtC,EAAM,MAAM,cAAcoC,EAAO,QAAQ;AAAA;AAAA,UAEhD,UACCpC,EAAM,gBAAgBqC,EAAkB,aACrC,CAACE,MAAU;AAEX,gBAAIC;AACJ,YAAIxC,EAAM,uBACTwC,IAAiBC,EAAmCF,CAAK,IAEzDC,IAAiBE,EAA4BH,CAAK;AAEnD,kBAAMI,IAAS3C,EAAM,OAAO,cAAc;AAC1C,mBAAO,GAAGwC,CAAc,GAAGG,CAAM;AAAA,UACjC,IACA3C,EAAM,OAAO,aACb,CAACuC,MAAU,GAAGA,CAAK,GAAGvC,EAAM,MAAM,UAAU,KAC5C;AAAA,QAAA;AAAA;AAAA,QAGL,SACCA,EAAM,gBAAgBqC,EAAkB,aACrC,OAAOrC,EAAM,OAAO,WAAY,YAC/BA,EAAM,OAAO,UACb,KACD,OAAOA,EAAM,OAAO,WAAY,YAChCA,EAAM,OAAO,UACb;AAAA,MAAA;AAAA,MAEL,GAAG;AAAA;AAAA,QAEF,GAAIA,GAAO,aAAa,OACrB;AAAA,UACA,cAAc,CAACA,GAAO,YAAY;AAAA;AAAA,UAClC,cAAcA,GAAO,YAAY;AAAA;AAAA,QAAA,IAEjC,CAAA;AAAA,QACH,KAAKA,GAAO,OAAO;AAAA,QACnB,OAAO;AAAA;AAAA,UAEN,SAAS,CAAC,EAAEA,EAAM,gBAAgBqC,EAAkB,aACjDrC,EAAM,OAAO,QACbA,EAAM,OAAO;AAAA,UAChB,MACCA,EAAM,gBAAgBqC,EAAkB,aACrCrC,EAAM,OAAO,QACbA,EAAM,OAAO;AAAA,UACjB,QACEA,EAAM,gBAAgBqC,EAAkB,aACtCrC,EAAM,OAAO,aACbA,EAAM,OAAO,eAAeoC,EAAO,QAAQ;AAAA,UAC/C,MAAM,EAAE,MAAME,EAAM,QAAQ,SAAA;AAAA,QAAS;AAAA,QAEtC,MAAM;AAAA;AAAA,UAEL,SACCtC,EAAM,gBAAgBqC,EAAkB,eACvC,OAAOrC,GAAO,eAAe,IAAM,MACjC,KACAA,GAAO,eAAe;AAAA,UAC1B,OAAOoC,EAAO,WAAW;AAAA,QAAA;AAAA,QAE1B,OAAO;AAAA,UACN,UACCpC,EAAM,gBAAgBqC,EAAkB,aACrCrC,EAAM,OAAO,WACbA,EAAM,OAAO;AAAA,UACjB,UAAUsC,EAAM,QAAQ;AAAA,UACxB,OAAOtC,EAAM,MAAM,cAAcoC,EAAO,QAAQ;AAAA;AAAA,UAEhD,GAAI7B,IAAgBC,IAAuB,CAAA;AAAA;AAAA,UAE3C,UAAUR,GAAO,gBACdA,GAAO,gBACPA,EAAM,gBAAgBqC,EAAkB,aACxC,CAACE,MAAU;AAEX,gBAAIC;AACJ,YAAIxC,EAAM,uBACTwC,IAAiBC,EAAmCF,CAAK,IAEzDC,IAAiBE,EAA4BH,CAAK;AAEnD,kBAAMI,IAAS3C,EAAM,OAAO,cAAc;AAC1C,mBAAO,GAAGwC,CAAc,GAAGG,CAAM;AAAA,UACjC,IACA3C,EAAM,OAAO,aACb,CAACuC,MAAU,GAAGA,CAAK,GAAGvC,EAAM,MAAM,UAAU,KAC5C;AAAA,QAAA;AAAA;AAAA,QAGJ,SACCA,EAAM,gBAAgBqC,EAAkB,aACrC,OAAOrC,EAAM,OAAO,WAAY,YAC/BA,EAAM,OAAO,UACb,KACD,OAAOA,EAAM,OAAO,WAAY,YAChCA,EAAM,OAAO,UACb;AAAA,MAAA;AAAA,IACL;AAAA;AAAA,IAGD,SAAS,CAAC4C,GAAGC,MAAc;AAC1B,UAAI,CAAC7C,EAAM,WAAY;AACvB,YAAMwB,IAAeqB,EAAU,CAAC,EAAE,cAC5BV,IAAYU,EAAU,CAAC,EAAE,OACzBC,IAAaF,EAAE,MAAM,KAAK,SAASpB,CAAY,EAAE,OACjDuB,IAAaH,EAAE,MAAM,KAAK,OAAOT,CAAS;AAChD,MAAAnC,EAAM,WAAW+C,GAAYD,CAAU;AAAA,IACxC;AAAA;AAAA,IAEA,SAAS,CAACF,GAAGC,MAAc;AAC1B,MAAK7C,EAAM,cACP6C,EAAU,WAAQD,EAAE,OAAO,OAAO,MAAM,SAAS;AAAA,IACtD;AAAA,EAAA;AAID,EAAI,CAAC5C,EAAM,eAAeA,EAAM,gBAAgBqC,EAAkB,WACjE,OAAON,EAAQ,OAAO,EAAE,MAAM,WAE9B,OAAOA,EAAQ,OAAO,EAAE,MAAM;AAI/B,MAAIiB;AACJ,EAAIzC,IACHyC,IAAgB,CAAC,EAAE,MAAM1C,GAAa,iBAAiB,iBAAiB,IAExE0C,IAAgB1B;AAGjB,QAAMjC,IAAO;AAAA,IACZ,QAAAC;AAAA,IACA,UAAU0D;AAAA,EAAA;AAIX,MAAIC;AACJ,EAAI1C,IACH0C,IAAwB;AAAA,IACvB,EAAE,MAAM3C,GAAa,iBAAiB,gBAAA;AAAA,EAAgB,IAGvD2C,IAAwBpB;AAGzB,QAAMqB,IAAoB;AAAA,IACzB,QAAQlD,EAAM,MAAM,KAAK;AAAA,MAAI,CAACX,MAC7B,OAAOA,KAAS,WAAWA,IAAOA,EAAK;AAAA,IAAA;AAAA,IAExC,UAAU4D;AAAA,EAAA,GAILE,IAAe,CAACC,IAAU,OAAU;AAEzC,QAAIC;AACJ,WAAIrD,EAAM,mBAAmB,CAACoD,IAC7BC,IAAgB,eAEhBA,IAAgB,YAIhB,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,OAAO;AAAA,UACN,WAAW;AAAA,UACX,SAAS;AAAA,UACT,eAAe;AAAA,UACf,KAAK;AAAA,UACL,SAAS;AAAA,UACT,gBAAgBD;AAAA,UAChB,UAAU;AAAA,QAAA;AAAA,QAGV,UAAAlC,EAAiB,IAAI,CAACoC,MAErB,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YAEA,OAAO;AAAA,cACN,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,KAAK;AAAA,cACL,WAAW;AAAA,YAAA;AAAA,YAGZ,UAAA;AAAA,cAAA,gBAAAF;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACA,OAAO;AAAA,oBACN,iBAAiBC,EAAM;AAAA,oBACvB,OAAO;AAAA,oBACP,QAAQ;AAAA,oBACR,cAAc;AAAA,kBAAA;AAAA,gBACf;AAAA,cAAA;AAAA,gCAEAE,GAAA,EAAS,OAAOrB,EAAO,QAAQ,WAC9B,YAAM,MAAA,CACR;AAAA,YAAA;AAAA,UAAA;AAAA,UAlBKmB,EAAM,MAAM,QAAQ,KAAK,GAAG;AAAA,QAAA,CAqBnC;AAAA,MAAA;AAAA,IAAA;AAAA,EAGJ;AAEA,SACC,gBAAAC;AAAA,IAACE;AAAA,IAAA;AAAA,MACA,OAAO1D,EAAM,gBAAgB,CAAA;AAAA,MAC7B,SAASA,EAAM;AAAA,MACf,cAAcA,EAAM;AAAA,MAEnB,UAAA;AAAA,QAAAA,EAAM,gBACN,gBAAAwD;AAAA,UAAC;AAAA,UAAA;AAAA,YACA,OAAO;AAAA,cACN,cAAc;AAAA,cACd,SAAS;AAAA,cACT,gBAAgBxD,EAAM,cAAc,aAAa;AAAA,YAAA;AAAA,YAGjD,UAAA;AAAA,cAAAA,EAAM,gBAAgB,MACtB,gBAAAsD;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACA,OAAO3D,EAAM,aAAa,SAASoC,EAAO,QAAQ;AAAA,kBAEjD,YAAM,aAAa;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGrBpC,EAAM,mBACN,gBAAAsD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACA,OAAO;AAAA,oBACN,SAAS;AAAA,oBACT,gBAAgB;AAAA,kBAAA;AAAA,kBAGjB,4BAAC,OAAA,EACA,UAAA,gBAAAA;AAAA,oBAACM;AAAA,oBAAA;AAAA,sBACA,MAAMC;AAAAA,sBACN,SAAS,MAAM;AACd,wBAAAzD,EAAa,EAAI;AAAA,sBAClB;AAAA,oBAAA;AAAA,kBAAA,EACD,CACD;AAAA,gBAAA;AAAA,cAAA;AAAA,YACD;AAAA,UAAA;AAAA,QAAA;AAAA,QAIFJ,EAAM,gBACN,gBAAAwD;AAAA,UAAC;AAAA,UAAA;AAAA,YACA,OAAO;AAAA,cACN,SAAS;AAAA,cACT,eAAetD;AAAA,cACf,gBAAgB;AAAA,YAAA;AAAA,YAGjB,UAAA;AAAA,cAAA,gBAAAoD,EAACQ,GAAA,EACC,UAAA7D,EAAY,IAAI,CAAC8D,GAAMC,MACvB,gBAAAV,EAAC,OAAA,EACA,UAAA,gBAAAA,EAAC,OAAA,EAAK,UAAAS,EAAA,CAAK,EAAA,GADFC,CAEV,CACA,GACF;AAAA,cACCb,EAAA;AAAA,YAAa;AAAA,UAAA;AAAA,QAAA;AAAA,QAGhB,gBAAAG,EAAC,OAAA,EAAI,WAAU,kBACd,UAAA,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACA,OAAO;AAAA,cACN,QAAQtD,EAAM,qBAAqB;AAAA,cACnC,OAAOA,EAAM,oBAAoB;AAAA,YAAA;AAAA,YAGlC,UAAA,gBAAAsD,EAACW,GAAA,EAAI,SAAAlC,GAAkB,MAAA1C,EAAA,CAAY;AAAA,UAAA;AAAA,QAAA,GAErC;AAAA,QACCc,KACA,gBAAAmD;AAAA,UAACY;AAAA,UAAA;AAAA,YACA,MAAM/D;AAAA,YACN,SAAS,MAAMC,EAAa,EAAK;AAAA,YACjC,qBAAmB;AAAA,YACnB,cAAcJ,EAAM,cAAc;AAAA,YAClC,OAAM;AAAA,YAEN,UAAA,gBAAAwD;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,WAAU;AAAA,gBACV,OAAO;AAAA,kBACN,SAAS;AAAA,gBAAA;AAAA,gBAGT,UAAA;AAAA,kBAAAxD,EAAM,gBAAgBmD,EAAa,EAAI;AAAA,kBACxC,gBAAAG;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACA,OAAO;AAAA,wBACN,QAAQ;AAAA,wBACR,OAAO;AAAA,wBACP,SAAS;AAAA,wBACT,cAAc;AAAA,sBAAA;AAAA,sBAGf,UAAA,gBAAAA,EAACW,GAAA,EAAI,SAAAlC,GAAkB,MAAMmB,EAAA,CAAmB;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACjD;AAAA,cAAA;AAAA,YAAA;AAAA,UACD;AAAA,QAAA;AAAA,MACD;AAAA,IAAA;AAAA,EAAA;AAIJ;"}
|
|
1
|
+
{"version":3,"file":"StackedBarChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.tsx"],"sourcesContent":["import MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useMemo, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport {\n\tCOLOR_SCHEMA,\n\tGRAPH_ORIENTATION,\n\tStackedBarGraphI,\n} from './StackedBarChart.model';\nimport {\n\tGraphContainerWrapper,\n\tHeaderIconWrapper,\n} from './StackedBarChart.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\nconst truncateBars = (data, labels, limit) => {\n\tif (labels.length <= limit)\n\t\treturn {\n\t\t\ttruncatedData: data,\n\t\t\ttruncatedLabels: labels,\n\t\t\toriginalData: data,\n\t\t\toriginalLabels: labels,\n\t\t};\n\tconst truncatedData = data.map((d) => d.slice(0, limit));\n\tconst othersData = data.map((d) =>\n\t\td.slice(limit).reduce((acc, curr) => acc + curr, 0),\n\t);\n\ttruncatedData.forEach((d, i) => d.push(othersData[i]));\n\tconst truncatedLabels = labels.slice(0, limit);\n\ttruncatedLabels.push('Others');\n\treturn {\n\t\ttruncatedData,\n\t\ttruncatedLabels,\n\t\toriginalData: data,\n\t\toriginalLabels: labels,\n\t};\n};\n\nexport const StackedBarChart = (props: StackedBarGraphI) => {\n\tconst { headerIcons = [], legendsAndIconDirection = 'row' } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.length === 0;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\n\tconst colorScaleBrand = [\n\t\t'#5E07BB',\n\t\t'#9E77ED',\n\t\t'#D2AEFF',\n\t\t'#F7D7FF',\n\t\t'#CDE1FF',\n\t\t'#92AFFA',\n\t\t'#3935E1',\n\t];\n\n\tconst colourScalePastel = [\n\t\t'#E6C7FF',\n\t\t'#FEC6C6',\n\t\t'#FEDEF3',\n\t\t'#DEEFFF',\n\t\t'#FFD8B1',\n\t\t'#C7E5FF',\n\t\t'#FFD3E6',\n\t\t'#C9FFE5',\n\t\t'#FFE3C7',\n\t\t'#D9D9FF',\n\t];\n\n\t// Determine which color scale to use based on props\n\tconst getColorScale = () => {\n\t\t// If custom bar colors are provided, use them\n\t\tif (props.customBarColors) return props.customBarColors;\n\n\t\t// If custom brand or pastel colors are provided\n\t\tif (props.customColourScaleBrand || props.customColourScalePastel) {\n\t\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\t\treturn props.customColourScalePastel;\n\t\t\t} else {\n\t\t\t\treturn props.customColourScaleBrand;\n\t\t\t}\n\t\t}\n\n\t\t// Use default color scales based on schema\n\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\treturn colourScalePastel;\n\t\t} else {\n\t\t\treturn colorScaleBrand;\n\t\t}\n\t};\n\n\tconst colourScale = getColorScale();\n\tconst hoverColourScale = props.customHoverColour;\n\n\t// Memoized bar configuration settings\n\tconst barConfig = useMemo(\n\t\t() => ({\n\t\t\tbarPercentage: props?.barPercentage || 0.4,\n\t\t\tcategoryPercentage: props?.categoryPercentage ?? 1,\n\t\t\tpointStyle: 'circle',\n\t\t\tbarWidth: props.barWidth,\n\t\t\tborderRadius: props?.borderRadius || undefined,\n\t\t\t// If borderRadius is an object, disable border skipping\n\t\t\t...(typeof props?.borderRadius === 'object'\n\t\t\t\t? { borderSkipped: false }\n\t\t\t\t: {}),\n\t\t\t// If bar gap is enabled, add transparent borders for spacing\n\t\t\t...(props?.addBarGap?.flag\n\t\t\t\t? {\n\t\t\t\t\t\tborderWidth: {\n\t\t\t\t\t\t\ttop: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tbottom: props?.addBarGap?.value || 2,\n\t\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tborderColor: 'transparent',\n\t\t\t\t }\n\t\t\t\t: {}),\n\t\t}),\n\t\t[\n\t\t\tprops.barWidth,\n\t\t\tprops?.borderRadius,\n\t\t\tprops?.barPercentage,\n\t\t\tprops?.categoryPercentage,\n\t\t\tprops?.addBarGap,\n\t\t],\n\t);\n\n\t// Transform y-axis data into a map grouped by dataset name\n\tconst dataSetMap = {};\n\tprops.yAxis.data.map((ele) => {\n\t\tele.map((obj) => {\n\t\t\tif (dataSetMap[obj.name]) {\n\t\t\t\tdataSetMap[obj.name].push(obj.value);\n\t\t\t} else {\n\t\t\t\tdataSetMap[obj.name] = [obj.value];\n\t\t\t}\n\t\t});\n\t});\n\n\t// Create datasets for chart with colors and bar configuration\n\tconst yAxisStackedData = Object.keys(dataSetMap).map((key, ind) => {\n\t\treturn {\n\t\t\tlabel: key,\n\t\t\tdata: dataSetMap[key],\n\t\t\tbackgroundColor: colourScale?.[ind],\n\t\t\thoverBackgroundColor:\n\t\t\t\thoverColourScale === undefined ? undefined : hoverColourScale[ind],\n\t\t\t...barConfig,\n\t\t};\n\t});\n\n\t// Conditionally reorder datasets so smaller values are drawn on top (for overlapping bars)\n\tlet reorderedYAxisData;\n\tif (props.renderInHeightWiseManner) {\n\t\treorderedYAxisData = yAxisStackedData\n\t\t\t.map((dataset, datasetIndex) => {\n\t\t\t\treturn {\n\t\t\t\t\t...dataset,\n\t\t\t\t\t// Add order property: higher values = drawn first (behind)\n\t\t\t\t\torder: dataset.data.reduce((sum, val) => sum + (val || 0), 0),\n\t\t\t\t};\n\t\t\t})\n\t\t\t.sort((a, b) => b.order - a.order);\n\t} else {\n\t\treorderedYAxisData = yAxisStackedData;\n\t}\n\n\t// Extract labels from x-axis data (either string or object with name property)\n\tlet labels = props.xAxis.data.map((data) =>\n\t\ttypeof data === 'string' ? data : data.name,\n\t);\n\n\t// Keep track of original data before any truncation\n\tlet originalData = reorderedYAxisData;\n\t// Truncate bars if limit is specified\n\tif (props.truncateBars) {\n\t\tconst truncated = truncateBars(\n\t\t\treorderedYAxisData.map((d) => d.data),\n\t\t\tlabels,\n\t\t\tprops.truncateBars,\n\t\t);\n\t\treorderedYAxisData.forEach((d, i) => (d.data = truncated.truncatedData[i]));\n\t\tlabels = truncated.truncatedLabels;\n\t\toriginalData = truncated.originalData.map((data, i) => ({\n\t\t\t...reorderedYAxisData[i],\n\t\t\tdata,\n\t\t}));\n\t}\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\t// Show legend only if data exists and custom legend is not used\n\t\t\t\tdisplay: !noDataPresent && !props.customLegend,\n\t\t\t\tlabels: {\n\t\t\t\t\tusePointStyle: true,\n\t\t\t\t\tfontSize: 2,\n\t\t\t\t},\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\t// Enable tooltip only when data is present\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\ttitle: props.tooltipConfig?.titleCallback,\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: 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\t// Format total value label for stacked bars\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\t// Only show label on the last dataset (top of stack)\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\t// Calculate sum across all datasets for this data point\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\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\t// Format values under 1000 as-is, others as 'k' format\n\t\t\t\t\tif (sum < 1000) {\n\t\t\t\t\t\treturn sum;\n\t\t\t\t\t}\n\t\t\t\t\treturn (sum / 1000).toString().substring(0, 4) + 'k';\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\t// Add right padding for horizontal orientation when showing totals\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\t// Add top padding for non-horizontal orientation when showing totals\n\t\t\t\ttop:\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},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: !props.customLegend,\n\t\t\tlabels: {\n\t\t\t\tusePointStyle: true,\n\t\t\t},\n\t\t},\n\t\t// Set index axis based on orientation (y for horizontal, x for vertical)\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' | 'x',\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, x-axis shows y-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t: props.xAxis?.title),\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.yAxis?.title\n\t\t\t\t\t\t\t: props.xAxis?.title,\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.yAxis?.titleColor\n\t\t\t\t\t\t\t: props.xAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.x === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.x),\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: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Format tick labels based on orientation\n\t\t\t\t\tcallback:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst suffix = props.yAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: props.xAxis?.axisSuffix\n\t\t\t\t\t\t\t? (value) => `${value}${props.xAxis.axisSuffix}`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if x-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\t// Set equal height if flag is enabled (for symmetric charts)\n\t\t\t\t...(props?.equalHeight?.flag\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tsuggestedMin: -props?.equalHeight.max, // Set negative side\n\t\t\t\t\t\t\tsuggestedMax: props?.equalHeight.max, // Set positive side\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\tmax: props?.yAxis?.max,\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, y-axis shows x-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t: props.yAxis?.title),\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.xAxis?.title\n\t\t\t\t\t\t\t: props.yAxis?.title,\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.xAxis?.titleColor\n\t\t\t\t\t\t\t: props.yAxis?.titleColor) ?? COLORS.content.secondary,\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\t// Show grid lines for non-horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation !== GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.y === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.y),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.stepSize\n\t\t\t\t\t\t\t: props.yAxis?.stepSize,\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// Apply no-data config if no data exists\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t\t// Use custom callback if provided, otherwise format based on orientation\n\t\t\t\t\tcallback: props?.ticksCallback\n\t\t\t\t\t\t? props?.ticksCallback\n\t\t\t\t\t\t: props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst suffix = props.xAxis?.axisSuffix || '';\n\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: props.yAxis?.axisSuffix\n\t\t\t\t\t\t? (value) => `${value}${props.yAxis.axisSuffix}`\n\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if y-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t},\n\t\t// Handle bar click events\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\t// Change cursor to pointer on hover when bar is clickable\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\n\t// Clean up tick callbacks based on orientation\n\tif (!props.orientation || props.orientation === GRAPH_ORIENTATION.VERTICAL) {\n\t\tdelete options.scales.x.ticks['callback'];\n\t} else {\n\t\tdelete options.scales.y.ticks['callback'];\n\t}\n\n\t// Prepare data for the chart\n\tlet chartDatasets;\n\tif (noDataPresent) {\n\t\tchartDatasets = [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }];\n\t} else {\n\t\tchartDatasets = reorderedYAxisData;\n\t}\n\n\tconst data = {\n\t\tlabels: labels,\n\t\tdatasets: chartDatasets,\n\t};\n\n\t// Prepare original chart data (used for popup modal)\n\tlet originalChartDatasets;\n\tif (noDataPresent) {\n\t\toriginalChartDatasets = [\n\t\t\t{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' },\n\t\t];\n\t} else {\n\t\toriginalChartDatasets = originalData;\n\t}\n\n\tconst originalChartData = {\n\t\tlabels: props.xAxis.data.map((data) =>\n\t\t\ttypeof data === 'string' ? data : data.name,\n\t\t),\n\t\tdatasets: originalChartDatasets,\n\t};\n\n\t// Render custom legend with color boxes\n\tconst renderLegend = (isPopup = false) => {\n\t\t// Determine justification based on whether popup is allowed and current context\n\t\tlet justification;\n\t\tif (props.allowChartPopup && !isPopup) {\n\t\t\tjustification = 'flex-start';\n\t\t} else {\n\t\t\tjustification = 'flex-end';\n\t\t}\n\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\tpadding: '0px 24px 12px 24px',\n\t\t\t\t\tjustifyContent: justification,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{yAxisStackedData.map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\t\tmarginTop: '4px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tbackgroundColor: _item.backgroundColor,\n\t\t\t\t\t\t\t\t\twidth: '16px',\n\t\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\t\tborderRadius: '2px',\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<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};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tcustomLegend={props.customLegend}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: props.hideHeading ? 'flex-end' : 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{props.hideHeading !== true && (\n\t\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t)}\n\t\t\t\t\t{props.allowChartPopup && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPopup(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</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.customLegend && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: legendsAndIconDirection,\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<HeaderIconWrapper>\n\t\t\t\t\t\t{headerIcons.map((icon, index) => (\n\t\t\t\t\t\t\t<div key={index}>\n\t\t\t\t\t\t\t\t<div>{icon}</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</HeaderIconWrapper>\n\t\t\t\t\t{renderLegend()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\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 ?? 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={data} />\n\t\t\t\t</div>\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={() => setShowPopup(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.chartHeading?.heading}\n\t\t\t\t\twidth=\"85%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"graph__wrapper\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '8px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.customLegend && renderLegend(true)}\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: '70vh',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tpadding: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '8px',\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={options} data={originalChartData} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","truncateBars","data","labels","limit","truncatedData","d","othersData","acc","curr","i","truncatedLabels","StackedBarChart","props","headerIcons","legendsAndIconDirection","showPopup","setShowPopup","useState","dummyValues","noDataPresent","yAxisConfigForNoData","colorScaleBrand","colourScalePastel","colourScale","COLOR_SCHEMA","hoverColourScale","barConfig","useMemo","dataSetMap","ele","obj","yAxisStackedData","key","ind","reorderedYAxisData","dataset","datasetIndex","sum","val","a","b","originalData","truncated","options","_","context","datasets","dataIndex","COLORS","GRAPH_ORIENTATION","FONTS","value","formattedValue","truncateValueForInternationalStore","truncateValueForIndianStore","suffix","e","activeEls","yAxisLabel","xAxisLabel","chartDatasets","originalChartDatasets","originalChartData","renderLegend","isPopup","justification","jsx","_item","jsxs","BodyTiny","GraphContainerWrapper","TitleRegular","IconButton","MaximizeIcon","HeaderIconWrapper","icon","index","Bar","StyledModal"],"mappings":"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"}
|