@bikdotai/bik-component-library 0.0.814 → 0.0.815

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

@@ -1 +1 @@
-{"version":3,"file":"LazyCharts.js","sources":["../../../../../src/components/analytics-chips-and-dropdowns/chart/LazyCharts.tsx"],"sourcesContent":["import React from 'react';\n\nexport const LazyVerticalGraph = React.lazy(() =>\n\timport('./VerticalBarGraph/VerticalGraph').then((module) => ({\n\t\tdefault: module.VerticalGraph,\n\t})),\n);\n"],"names":["LazyVerticalGraph","React","module"],"mappings":"yGAEaA,EAAoBC,EAAM,KAAK,IAC3C,mCAAO,qCAAkC,CAAA,EAAE,KAAMC,IAAY,CAC5D,QAASA,EAAO,aAAA,EACf,CACH"}
+{"version":3,"file":"LazyCharts.js","sources":["../../../../../src/components/analytics-chips-and-dropdowns/chart/LazyCharts.tsx"],"sourcesContent":["import React from 'react';\n\nexport const LazyVerticalGraph = React.lazy(() =>\n\timport('./VerticalBarGraph/VerticalGraph').then((module) => ({\n\t\tdefault: module.VerticalGraph,\n\t})),\n);\n"],"names":["LazyVerticalGraph","React","module"],"mappings":"wKAEaA,EAAoBC,EAAAA,QAAM,KAAK,IAC3C,mCAAO,qCAAkC,CAAA,EAAE,KAAMC,IAAY,CAC5D,QAASA,EAAO,aAAA,EACf,CACH"}

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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("styled-components"),s=require("../../../TypographyStyle.js"),n=l.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("styled-components"),s=require("../../../TypographyStyle.js"),n=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=n(i),d=c.default.div`
 	display: flex;
 	align-items: center;
 	flex-direction: row;
@@ -16,5 +16,5 @@
 		margin-right: 12px;
 		flex: 1;
 	}
-`,c=({color:t,text:i})=>{const o=r=>r.charAt(0).toUpperCase()+r.slice(1);return e.jsxs(n,{children:[e.jsx("div",{className:"color",style:{backgroundColor:t}}),e.jsx(s.BodyPrimary,{className:"title",children:o(i)})]})};exports.Legend=c;
+`,a=({color:e,text:o})=>{const l=r=>r.charAt(0).toUpperCase()+r.slice(1);return t.jsxs(d,{children:[t.jsx("div",{className:"color",style:{backgroundColor:e}}),t.jsx(s.BodyPrimary,{className:"title",children:l(o)})]})};exports.Legend=a;
 //# sourceMappingURL=Legend.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Legend.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/Legend/Legend.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { BodyPrimary } from '@src/components/TypographyStyle';\n\nexport interface LegendData {\n\tcolor: string;\n\ttext: string;\n}\n\nconst LegendStyled = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: row;\n\tflex: 1;\n\n\t.color {\n\t\twidth: 12px;\n\t\theight: 12px;\n\t\tborder-radius: 20px;\n\t}\n\n\t.title {\n\t\tcolor: #474747;\n\t\tmargin-left: 12px;\n\t\tmargin-right: 12px;\n\t\tflex: 1;\n\t}\n`;\n\nexport const Legend: React.FC<LegendData> = ({ color, text }) => {\n\tconst toUpperCase = (name: string) => {\n\t\treturn name.charAt(0).toUpperCase() + name.slice(1);\n\t};\n\n\treturn (\n\t\t<LegendStyled>\n\t\t\t<div className={'color'} style={{ backgroundColor: color }}></div>\n\t\t\t<BodyPrimary className={'title'}>{toUpperCase(text)}</BodyPrimary>\n\t\t</LegendStyled>\n\t);\n};\n"],"names":["LegendStyled","styled","Legend","color","text","toUpperCase","name","jsx","BodyPrimary"],"mappings":"6LASMA,EAAeC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBfC,EAA+B,CAAC,CAAE,MAAAC,EAAO,KAAAC,KAAW,CAChE,MAAMC,EAAeC,GACbA,EAAK,OAAO,CAAC,EAAE,cAAgBA,EAAK,MAAM,CAAC,EAGnD,cACEN,EAAA,CACA,SAAA,CAAAO,MAAC,OAAI,UAAW,QAAS,MAAO,CAAE,gBAAiBJ,GAAS,QAC3DK,EAAAA,YAAA,CAAY,UAAW,QAAU,SAAAH,EAAYD,CAAI,CAAA,CAAE,CAAA,EACrD,CAEF"}
+{"version":3,"file":"Legend.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/Legend/Legend.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { BodyPrimary } from '@src/components/TypographyStyle';\n\nexport interface LegendData {\n\tcolor: string;\n\ttext: string;\n}\n\nconst LegendStyled = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: row;\n\tflex: 1;\n\n\t.color {\n\t\twidth: 12px;\n\t\theight: 12px;\n\t\tborder-radius: 20px;\n\t}\n\n\t.title {\n\t\tcolor: #474747;\n\t\tmargin-left: 12px;\n\t\tmargin-right: 12px;\n\t\tflex: 1;\n\t}\n`;\n\nexport const Legend: React.FC<LegendData> = ({ color, text }) => {\n\tconst toUpperCase = (name: string) => {\n\t\treturn name.charAt(0).toUpperCase() + name.slice(1);\n\t};\n\n\treturn (\n\t\t<LegendStyled>\n\t\t\t<div className={'color'} style={{ backgroundColor: color }}></div>\n\t\t\t<BodyPrimary className={'title'}>{toUpperCase(text)}</BodyPrimary>\n\t\t</LegendStyled>\n\t);\n};\n"],"names":["LegendStyled","styled","Legend","color","text","toUpperCase","name","jsx","BodyPrimary"],"mappings":"4PASMA,EAAeC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBfC,EAA+B,CAAC,CAAE,MAAAC,EAAO,KAAAC,KAAW,CAChE,MAAMC,EAAeC,GACbA,EAAK,OAAO,CAAC,EAAE,cAAgBA,EAAK,MAAM,CAAC,EAGnD,cACEN,EAAA,CACA,SAAA,CAAAO,MAAC,OAAI,UAAW,QAAS,MAAO,CAAE,gBAAiBJ,GAAS,QAC3DK,EAAAA,YAAA,CAAY,UAAW,QAAU,SAAAH,EAAYD,CAAI,CAAA,CAAE,CAAA,EACrD,CAEF"}

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

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("styled-components"),t=n.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("styled-components"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=o(n),d=t.default.div`
 	display: flex;
 	flex-direction: row;
 	gap: 8px;
 	align-items: center;
-`,i=n.div`
+`,i=t.default.div`
 	width: ${e=>e.newStyle||e.square?"16px":"8px"};
 	height: ${e=>e.newStyle||e.square?"16px":"8px"};
 	border-radius: 4px;
 	background: ${e=>e.color};
-`,o=n.div`
+`,l=t.default.div`
 	display: flex;
 	flex-direction: row;
 	gap: 12px;
 	justify-content: ${e=>e.position?e.position:"end"};
-`;exports.LegendColor=i;exports.LegendContainer=t;exports.LegendWrapper=o;
+`;exports.LegendColor=i;exports.LegendContainer=d;exports.LegendWrapper=l;
 //# sourceMappingURL=LineChart.styled.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"LineChart.styled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const LegendContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 8px;\n\talign-items: center;\n`;\n\nexport const LegendColor = styled.div<{\n\tcolor: string;\n\tnewStyle?: boolean;\n\tsquare?: boolean;\n}>`\n\twidth: ${(props) => (props.newStyle || props.square ? '16px' : '8px')};\n\theight: ${(props) => (props.newStyle || props.square ? '16px' : '8px')};\n\tborder-radius: 4px;\n\tbackground: ${(props) => props.color};\n`;\n\nexport const LegendWrapper = styled.div<{ position?: string }>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n\tjustify-content: ${(props) => (props.position ? props.position : 'end')};\n`;\n"],"names":["LegendContainer","styled","LegendColor","props","LegendWrapper"],"mappings":"qHAEaA,EAAkBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOzBC,EAAcD,EAAO;AAAA,UAKvBE,GAAWA,EAAM,UAAYA,EAAM,OAAS,OAAS,KAAM;AAAA,WAC1DA,GAAWA,EAAM,UAAYA,EAAM,OAAS,OAAS,KAAM;AAAA;AAAA,eAEvDA,GAAUA,EAAM,KAAK;AAAA,EAGxBC,EAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA,oBAIfE,GAAWA,EAAM,SAAWA,EAAM,SAAW,KAAM;AAAA"}
+{"version":3,"file":"LineChart.styled.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const LegendContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 8px;\n\talign-items: center;\n`;\n\nexport const LegendColor = styled.div<{\n\tcolor: string;\n\tnewStyle?: boolean;\n\tsquare?: boolean;\n}>`\n\twidth: ${(props) => (props.newStyle || props.square ? '16px' : '8px')};\n\theight: ${(props) => (props.newStyle || props.square ? '16px' : '8px')};\n\tborder-radius: 4px;\n\tbackground: ${(props) => props.color};\n`;\n\nexport const LegendWrapper = styled.div<{ position?: string }>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n\tjustify-content: ${(props) => (props.position ? props.position : 'end')};\n`;\n"],"names":["LegendContainer","styled","LegendColor","props","LegendWrapper"],"mappings":"oLAEaA,EAAkBC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOzBC,EAAcD,EAAAA,QAAO;AAAA,UAKvBE,GAAWA,EAAM,UAAYA,EAAM,OAAS,OAAS,KAAM;AAAA,WAC1DA,GAAWA,EAAM,UAAYA,EAAM,OAAS,OAAS,KAAM;AAAA;AAAA,eAEvDA,GAAUA,EAAM,KAAK;AAAA,EAGxBC,EAAgBH,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,oBAIfE,GAAWA,EAAM,SAAWA,EAAM,SAAW,KAAM;AAAA"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/Pie/PieChart.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("react"),y=require("styled-components"),p=require("../Legend/Legend.js"),c=require("../../../TypographyStyle.js"),h=y.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),n=require("react"),f=require("styled-components"),p=require("../Legend/Legend.js"),c=require("../../../TypographyStyle.js"),x=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},h=x(f),g=h.default.div`
 	width: 100%;
 	display: flex;
 	flex-direction: column;
@@ -25,5 +25,5 @@
 		display: block;
 		width: 8px;
 	}
-`,f=({slices:n,size:l})=>{const[o,i]=a.useState(0),[u,s]=a.useState(l?{height:`${l}px`}:{});a.useEffect(()=>{let e=0;n.forEach(t=>{e+=t.count}),i(e),n.reduce((t,x)=>t+x.count,0)===0&&n.length===1?s(t=>({...t,justifyContent:"center"})):s(t=>({...t,justifyContent:"flex-start"}))},[n]);const d=e=>o===0?0:parseFloat((e/o*100).toFixed(1));return r.jsx(h,{style:u,children:n.map(e=>r.jsxs("div",{className:"slice-row",style:{justifyContent:"space-between",gap:"8px",padding:"0 8px",maxWidth:"400px"},children:[r.jsx("div",{style:{width:"fit-content"},children:r.jsx(p.Legend,{color:e.color,text:e.name},e.name)}),r.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column"},children:[r.jsxs(c.BodySecondary,{className:"percentage",children:[d(e.count),"%"]}),e.rawValue&&r.jsxs(c.BodyTiny,{className:"raw-value",children:["(",e.rawValue,")"]})]})]},e.name))})};exports.PieChart=f;
+`,j=({slices:t,size:l})=>{const[o,i]=n.useState(0),[u,s]=n.useState(l?{height:`${l}px`}:{});n.useEffect(()=>{let e=0;t.forEach(r=>{e+=r.count}),i(e),t.reduce((r,y)=>r+y.count,0)===0&&t.length===1?s(r=>({...r,justifyContent:"center"})):s(r=>({...r,justifyContent:"flex-start"}))},[t]);const d=e=>o===0?0:parseFloat((e/o*100).toFixed(1));return a.jsx(g,{style:u,children:t.map(e=>a.jsxs("div",{className:"slice-row",style:{justifyContent:"space-between",gap:"8px",padding:"0 8px",maxWidth:"400px"},children:[a.jsx("div",{style:{width:"fit-content"},children:a.jsx(p.Legend,{color:e.color,text:e.name},e.name)}),a.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column"},children:[a.jsxs(c.BodySecondary,{className:"percentage",children:[d(e.count),"%"]}),e.rawValue&&a.jsxs(c.BodyTiny,{className:"raw-value",children:["(",e.rawValue,")"]})]})]},e.name))})};exports.PieChart=j;
 //# sourceMappingURL=PieChart.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/Pie/PieChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"PieChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/Pie/PieChart.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Legend } from '@src/components/analytics-chips-and-dropdowns/chart/Legend/Legend';\nimport { PieChartInputData } from '@src/components/analytics-chips-and-dropdowns/chart/Pie/PieChartInputData';\nimport { BodySecondary, BodyTiny } from '@src/components/TypographyStyle';\n\nconst PieChartStyled = styled.div`\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\tgap: 24px;\n\n\t.slice-row {\n\t\twidth: 100%;\n\t\tdisplay: flex;\n\t\t.percentage,\n\t\t.raw-value {\n\t\t\tmargin-left: auto;\n\t\t}\n\t}\n\n\toverflow-y: scroll;\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: #e0e0e0;\n\t\tborder-radius: 8px;\n\t}\n\t&::-webkit-scrollbar {\n\t\theight: 5px;\n\t\tdisplay: block;\n\t\twidth: 8px;\n\t}\n`;\n\nexport const PieChart: React.FC<PieChartInputData> = ({ slices, size }) => {\n\tconst [total, setTotal] = useState(0);\n\tconst [styleObj, setStyleObj] = useState(size ? { height: `${size}px` } : {});\n\tuseEffect(() => {\n\t\tlet localTotal = 0;\n\t\tslices.forEach((slice) => {\n\t\t\tlocalTotal += slice.count;\n\t\t});\n\t\tsetTotal(localTotal);\n\n\t\tif (\n\t\t\tslices.reduce((sum, slice) => sum + slice.count, 0) === 0 &&\n\t\t\tslices.length === 1\n\t\t) {\n\t\t\tsetStyleObj((prev) => {\n\t\t\t\treturn {\n\t\t\t\t\t...prev,\n\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t};\n\t\t\t});\n\t\t} else {\n\t\t\tsetStyleObj((prev) => {\n\t\t\t\treturn {\n\t\t\t\t\t...prev,\n\t\t\t\t\tjustifyContent: 'flex-start',\n\t\t\t\t};\n\t\t\t});\n\t\t}\n\t}, [slices]);\n\n\tconst calculatePercentage = (count: number) => {\n\t\tif (total === 0) {\n\t\t\treturn 0;\n\t\t}\n\t\treturn parseFloat(((count / total) * 100).toFixed(1));\n\t};\n\n\treturn (\n\t\t<PieChartStyled style={styleObj}>\n\t\t\t{slices.map((slice) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={'slice-row'}\n\t\t\t\t\t\tkey={slice.name}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\tpadding: '0 8px',\n\t\t\t\t\t\t\tmaxWidth: '400px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div style={{ width: 'fit-content' }}>\n\t\t\t\t\t\t\t<Legend key={slice.name} color={slice.color!} text={slice.name} />\n\t\t\t\t\t\t</div>\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\talignItems: 'center',\n\t\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BodySecondary className={'percentage'}>\n\t\t\t\t\t\t\t\t{calculatePercentage(slice.count)}%\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t{slice.rawValue && (\n\t\t\t\t\t\t\t\t<BodyTiny className={'raw-value'}>({slice.rawValue})</BodyTiny>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t})}\n\t\t</PieChartStyled>\n\t);\n};\n"],"names":["PieChartStyled","styled","PieChart","slices","size","total","setTotal","useState","styleObj","setStyleObj","useEffect","localTotal","slice","sum","prev","calculatePercentage","count","jsxs","jsx","Legend","BodySecondary","BodyTiny"],"mappings":"iPAMMA,EAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA6BjBC,EAAwC,CAAC,CAAE,OAAAC,EAAQ,KAAAC,KAAW,CAC1E,KAAM,CAACC,EAAOC,CAAQ,EAAIC,EAAAA,SAAS,CAAC,EAC9B,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAASH,EAAO,CAAE,OAAQ,GAAGA,CAAI,IAAA,EAAS,CAAA,CAAE,EAC5EM,EAAAA,UAAU,IAAM,CACf,IAAIC,EAAa,EACjBR,EAAO,QAASS,GAAU,CACzBD,GAAcC,EAAM,KACrB,CAAC,EACDN,EAASK,CAAU,EAGlBR,EAAO,OAAO,CAACU,EAAKD,IAAUC,EAAMD,EAAM,MAAO,CAAC,IAAM,GACxDT,EAAO,SAAW,EAElBM,EAAaK,IACL,CACN,GAAGA,EACH,eAAgB,QAAA,EAEjB,EAEDL,EAAaK,IACL,CACN,GAAGA,EACH,eAAgB,YAAA,EAEjB,CAEH,EAAG,CAACX,CAAM,CAAC,EAEX,MAAMY,EAAuBC,GACxBX,IAAU,EACN,EAED,YAAaW,EAAQX,EAAS,KAAK,QAAQ,CAAC,CAAC,EAGrD,aACEL,EAAA,CAAe,MAAOQ,EACrB,SAAAL,EAAO,IAAKS,GAEXK,EAAAA,KAAC,MAAA,CACA,UAAW,YAEX,MAAO,CACN,eAAgB,gBAChB,IAAK,MACL,QAAS,QACT,SAAU,OAAA,EAGX,SAAA,CAAAC,MAAC,OAAI,MAAO,CAAE,MAAO,aAAA,EACpB,SAAAA,EAAAA,IAACC,EAAAA,OAAA,CAAwB,MAAOP,EAAM,MAAQ,KAAMA,EAAM,MAA7CA,EAAM,IAA6C,EACjE,EACAK,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,WAAY,SACZ,cAAe,QAAA,EAGhB,SAAA,CAAAA,EAAAA,KAACG,EAAAA,cAAA,CAAc,UAAW,aACxB,SAAA,CAAAL,EAAoBH,EAAM,KAAK,EAAE,GAAA,EACnC,EACCA,EAAM,UACNK,OAACI,EAAAA,SAAA,CAAS,UAAW,YAAa,SAAA,CAAA,IAAET,EAAM,SAAS,GAAA,CAAA,CAAC,CAAA,CAAA,CAAA,CAEtD,CAAA,EAxBKA,EAAM,IAAA,CA2Bb,CAAA,CACF,CAEF"}
+{"version":3,"file":"PieChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/Pie/PieChart.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Legend } from '@src/components/analytics-chips-and-dropdowns/chart/Legend/Legend';\nimport { PieChartInputData } from '@src/components/analytics-chips-and-dropdowns/chart/Pie/PieChartInputData';\nimport { BodySecondary, BodyTiny } from '@src/components/TypographyStyle';\n\nconst PieChartStyled = styled.div`\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\tgap: 24px;\n\n\t.slice-row {\n\t\twidth: 100%;\n\t\tdisplay: flex;\n\t\t.percentage,\n\t\t.raw-value {\n\t\t\tmargin-left: auto;\n\t\t}\n\t}\n\n\toverflow-y: scroll;\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: #e0e0e0;\n\t\tborder-radius: 8px;\n\t}\n\t&::-webkit-scrollbar {\n\t\theight: 5px;\n\t\tdisplay: block;\n\t\twidth: 8px;\n\t}\n`;\n\nexport const PieChart: React.FC<PieChartInputData> = ({ slices, size }) => {\n\tconst [total, setTotal] = useState(0);\n\tconst [styleObj, setStyleObj] = useState(size ? { height: `${size}px` } : {});\n\tuseEffect(() => {\n\t\tlet localTotal = 0;\n\t\tslices.forEach((slice) => {\n\t\t\tlocalTotal += slice.count;\n\t\t});\n\t\tsetTotal(localTotal);\n\n\t\tif (\n\t\t\tslices.reduce((sum, slice) => sum + slice.count, 0) === 0 &&\n\t\t\tslices.length === 1\n\t\t) {\n\t\t\tsetStyleObj((prev) => {\n\t\t\t\treturn {\n\t\t\t\t\t...prev,\n\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t};\n\t\t\t});\n\t\t} else {\n\t\t\tsetStyleObj((prev) => {\n\t\t\t\treturn {\n\t\t\t\t\t...prev,\n\t\t\t\t\tjustifyContent: 'flex-start',\n\t\t\t\t};\n\t\t\t});\n\t\t}\n\t}, [slices]);\n\n\tconst calculatePercentage = (count: number) => {\n\t\tif (total === 0) {\n\t\t\treturn 0;\n\t\t}\n\t\treturn parseFloat(((count / total) * 100).toFixed(1));\n\t};\n\n\treturn (\n\t\t<PieChartStyled style={styleObj}>\n\t\t\t{slices.map((slice) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={'slice-row'}\n\t\t\t\t\t\tkey={slice.name}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\tpadding: '0 8px',\n\t\t\t\t\t\t\tmaxWidth: '400px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div style={{ width: 'fit-content' }}>\n\t\t\t\t\t\t\t<Legend key={slice.name} color={slice.color!} text={slice.name} />\n\t\t\t\t\t\t</div>\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\talignItems: 'center',\n\t\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BodySecondary className={'percentage'}>\n\t\t\t\t\t\t\t\t{calculatePercentage(slice.count)}%\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t{slice.rawValue && (\n\t\t\t\t\t\t\t\t<BodyTiny className={'raw-value'}>({slice.rawValue})</BodyTiny>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t})}\n\t\t</PieChartStyled>\n\t);\n};\n"],"names":["PieChartStyled","styled","PieChart","slices","size","total","setTotal","useState","styleObj","setStyleObj","useEffect","localTotal","slice","sum","prev","calculatePercentage","count","jsxs","jsx","Legend","BodySecondary","BodyTiny"],"mappings":"gTAMMA,EAAiBC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA6BjBC,EAAwC,CAAC,CAAE,OAAAC,EAAQ,KAAAC,KAAW,CAC1E,KAAM,CAACC,EAAOC,CAAQ,EAAIC,EAAAA,SAAS,CAAC,EAC9B,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAASH,EAAO,CAAE,OAAQ,GAAGA,CAAI,IAAA,EAAS,CAAA,CAAE,EAC5EM,EAAAA,UAAU,IAAM,CACf,IAAIC,EAAa,EACjBR,EAAO,QAASS,GAAU,CACzBD,GAAcC,EAAM,KACrB,CAAC,EACDN,EAASK,CAAU,EAGlBR,EAAO,OAAO,CAACU,EAAKD,IAAUC,EAAMD,EAAM,MAAO,CAAC,IAAM,GACxDT,EAAO,SAAW,EAElBM,EAAaK,IACL,CACN,GAAGA,EACH,eAAgB,QAAA,EAEjB,EAEDL,EAAaK,IACL,CACN,GAAGA,EACH,eAAgB,YAAA,EAEjB,CAEH,EAAG,CAACX,CAAM,CAAC,EAEX,MAAMY,EAAuBC,GACxBX,IAAU,EACN,EAED,YAAaW,EAAQX,EAAS,KAAK,QAAQ,CAAC,CAAC,EAGrD,aACEL,EAAA,CAAe,MAAOQ,EACrB,SAAAL,EAAO,IAAKS,GAEXK,EAAAA,KAAC,MAAA,CACA,UAAW,YAEX,MAAO,CACN,eAAgB,gBAChB,IAAK,MACL,QAAS,QACT,SAAU,OAAA,EAGX,SAAA,CAAAC,MAAC,OAAI,MAAO,CAAE,MAAO,aAAA,EACpB,SAAAA,EAAAA,IAACC,EAAAA,OAAA,CAAwB,MAAOP,EAAM,MAAQ,KAAMA,EAAM,MAA7CA,EAAM,IAA6C,EACjE,EACAK,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,WAAY,SACZ,cAAe,QAAA,EAGhB,SAAA,CAAAA,EAAAA,KAACG,EAAAA,cAAA,CAAc,UAAW,aACxB,SAAA,CAAAL,EAAoBH,EAAM,KAAK,EAAE,GAAA,EACnC,EACCA,EAAM,UACNK,OAACI,EAAAA,SAAA,CAAS,UAAW,YAAa,SAAA,CAAA,IAAET,EAAM,SAAS,GAAA,CAAA,CAAC,CAAA,CAAA,CAAA,CAEtD,CAAA,EAxBKA,EAAM,IAAA,CA2Bb,CAAA,CACF,CAEF"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),H=require("../../../../assets/icons/ChartBar.svg.js"),U=require("../../../../assets/icons/maximize.svg.js"),w=require("chart.js"),l=require("react"),B=require("react-chartjs-2"),Y=require("styled-components"),J=require("../../../TypographyStyle.js"),O=require("../../../../utils/StringUtils.js"),R=require("../../../../constants/Theme.js"),K=require("../LazyCharts.js"),j=require("../utils/calcPercentage.js"),k=require("./PieChart.js"),I=require("../../../icon-button/IconButton.js"),W=require("../../../modals/styledModal.js");w.Chart.register(w.ArcElement,w.Legend);const Q=(a,e,r)=>{const x=a.map(c=>c.name),h=a.map(c=>c.count);return{xAxis:{data:x,title:e??""},yAxis:{data:h,title:r??""},barColorRGBA:{r:210,g:174,b:255,a:1}}},E=a=>({plugins:{legend:{display:!1},tooltip:{enabled:!0,callbacks:{label:e=>{if(!e.label)return" 0%";const r=e.dataset.data.reduce((g,f)=>g+f,0),x=parseFloat((e.raw/r*100).toFixed(1)),{label:h,raw:o}=e,p=a?.symbol??"",u=a?.isInternationalStore,c=u!==void 0?u?j.truncateValueForInternationalStore(o):j.truncateValueForIndianStore(o):o,y=u!==void 0?u?j.truncateValueForInternationalStore(r):j.truncateValueForIndianStore(r):r;return[` ${h}`,` ${p}${c} (${x}% of ${p}${y})`]}}}}}),d=["#5E07BB","#9E77ED","#D2AEFF","#CDE1FF","#92AFFA","#3935E1"],X=Y.div`
-	background: ${a=>R.COLORS.surface.standard};
-	border: 1px solid ${a=>R.COLORS.stroke.primary};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),H=require("../../../../assets/icons/ChartBar.svg.js"),U=require("../../../../assets/icons/maximize.svg.js"),w=require("chart.js"),l=require("react"),B=require("react-chartjs-2"),Y=require("styled-components"),J=require("../../../TypographyStyle.js"),O=require("../../../../utils/StringUtils.js"),R=require("../../../../constants/Theme.js"),K=require("../LazyCharts.js"),j=require("../utils/calcPercentage.js"),k=require("./PieChart.js"),I=require("../../../icon-button/IconButton.js"),W=require("../../../modals/styledModal.js"),Q=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},X=Q(Y);w.Chart.register(w.ArcElement,w.Legend);const Z=(e,a,r)=>{const x=e.map(d=>d.name),h=e.map(d=>d.count);return{xAxis:{data:x,title:a??""},yAxis:{data:h,title:r??""},barColorRGBA:{r:210,g:174,b:255,a:1}}},E=e=>({plugins:{legend:{display:!1},tooltip:{enabled:!0,callbacks:{label:a=>{if(!a.label)return" 0%";const r=a.dataset.data.reduce((y,g)=>y+g,0),x=parseFloat((a.raw/r*100).toFixed(1)),{label:h,raw:o}=a,p=e?.symbol??"",u=e?.isInternationalStore,d=u!==void 0?u?j.truncateValueForInternationalStore(o):j.truncateValueForIndianStore(o):o,f=u!==void 0?u?j.truncateValueForInternationalStore(r):j.truncateValueForIndianStore(r):r;return[` ${h}`,` ${p}${d} (${x}% of ${p}${f})`]}}}}}),c=["#5E07BB","#9E77ED","#D2AEFF","#CDE1FF","#92AFFA","#3935E1"],tt=X.default.div`
+	background: ${e=>R.COLORS.surface.standard};
+	border: 1px solid ${e=>R.COLORS.stroke.primary};
 	border-radius: 4px;
-`,Z=a=>t.jsx(X,{style:{padding:24},children:a.children}),L=({title:a,slices:e,size:r,allowChartPopup:x,showConvertToBarChart:h,truncateSlices:o,barChartXAxisTitle:p,barChartYAxisTitle:u,hideTitle:c=!1,currencyProps:y})=>{const[g,f]=l.useState(!1),[A,v]=l.useState(!1),[D,P]=l.useState([]),[m,F]=l.useState(),[$,T]=l.useState(),[V,G]=l.useState([]),[b,M]=l.useState(null);return l.useEffect(()=>{const N=e.reduce((n,s)=>n+s.count,0);let q=[];if(q=Object.keys(e).map((n,s)=>({color:d[s%d.length],...e[n]})),P([...q]),N===0)F({datasets:[{data:[100],backgroundColor:["#F0F0F0"],borderWidth:0}],labels:[]});else{const n={labels:e.map(s=>O.default.capitalizeEachWord(s.name)),datasets:[{data:e.map(s=>s.count),backgroundColor:e.map((s,S)=>s.color??d[S%d.length]),borderColor:["white","white","white","white","white","white"],borderWidth:4,borderRadius:8}]};F(n)}if(o&&e.length>o){const n=e.slice(0,o),S=e.slice(o).reduce((i,C)=>i+C.count,0);n.push({name:"Other",count:S});const _={labels:n.map(i=>O.default.capitalize(i.name)),datasets:[{data:n.map(i=>i.count),backgroundColor:n.map((i,C)=>i.color??d[C%d.length]),borderColor:["white","white","white","white","white","white"],borderWidth:4,borderRadius:8}]};T(_);const z=n.map((i,C)=>({color:d[C%d.length],...i}));G(z)}h&&M(Q(e,p,u))},[e,o]),m?t.jsxs(t.Fragment,{children:[t.jsxs("div",{style:{display:"flex",justifyContent:c||a?.length===0?"flex-end":"space-between"},children:[!c&&a&&t.jsx(J.TitleMedium,{style:{marginBottom:16},children:a}),t.jsxs("div",{children:[h&&t.jsx(I.IconButton,{Icon:H.default,onClick:()=>{v(!0)}}),x&&t.jsx(I.IconButton,{Icon:U.default,onClick:()=>{f(!0)}})]})]}),t.jsxs("div",{className:"row",children:[t.jsx("div",{className:"col-6 ",style:{display:"flex",alignItems:"center",justifyContent:"center"},children:t.jsx("div",{style:{width:r,height:r},children:t.jsx(B.Doughnut,{data:o?$:m,options:{...E(y),maintainAspectRatio:!r}})})}),t.jsx("div",{className:"col-6",style:{paddingLeft:48,display:"flex",flexDirection:"column",justifyContent:"flex-start"},children:t.jsx(k.PieChart,{slices:o?V:D,size:r})})]}),g&&t.jsx(W.StyledModal,{open:g,onClose:()=>f(!1),closeOnOutsideClick:!0,headingTitle:a,width:"75%",children:t.jsxs("div",{style:{padding:24,display:"flex",justifyContent:"space-between",height:"80vh"},children:[t.jsx("div",{style:{width:"55%",marginLeft:"4%"},children:t.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center"},children:t.jsx(B.Doughnut,{data:m,options:{...E(y),maintainAspectRatio:!r}})})}),t.jsx("div",{style:{width:"30%",height:"100%",overflowY:"auto"},children:t.jsx(k.PieChart,{slices:D})})]})}),A&&b&&t.jsx(W.StyledModal,{open:A,onClose:()=>v(!1),closeOnOutsideClick:!0,headingTitle:a,width:"85%",children:t.jsx("div",{style:{padding:"24px 0"},children:t.jsx(l.Suspense,{fallback:t.jsx("div",{children:"Loading..."}),children:t.jsx(K.LazyVerticalGraph,{xAxis:b.xAxis,yAxis:b.yAxis,barColorRGBA:b?.barColorRGBA,PieChartComponent:L})})})})]}):t.jsx(t.Fragment,{})};exports.Card=Z;exports.PieChartAnalytics=L;
+`,et=e=>t.jsx(tt,{style:{padding:24},children:e.children}),L=({title:e,slices:a,size:r,allowChartPopup:x,showConvertToBarChart:h,truncateSlices:o,barChartXAxisTitle:p,barChartYAxisTitle:u,hideTitle:d=!1,currencyProps:f})=>{const[y,g]=l.useState(!1),[A,v]=l.useState(!1),[D,P]=l.useState([]),[m,F]=l.useState(),[$,T]=l.useState(),[V,G]=l.useState([]),[b,M]=l.useState(null);return l.useEffect(()=>{const _=a.reduce((n,s)=>n+s.count,0);let q=[];if(q=Object.keys(a).map((n,s)=>({color:c[s%c.length],...a[n]})),P([...q]),_===0)F({datasets:[{data:[100],backgroundColor:["#F0F0F0"],borderWidth:0}],labels:[]});else{const n={labels:a.map(s=>O.default.capitalizeEachWord(s.name)),datasets:[{data:a.map(s=>s.count),backgroundColor:a.map((s,S)=>s.color??c[S%c.length]),borderColor:["white","white","white","white","white","white"],borderWidth:4,borderRadius:8}]};F(n)}if(o&&a.length>o){const n=a.slice(0,o),S=a.slice(o).reduce((i,C)=>i+C.count,0);n.push({name:"Other",count:S});const N={labels:n.map(i=>O.default.capitalize(i.name)),datasets:[{data:n.map(i=>i.count),backgroundColor:n.map((i,C)=>i.color??c[C%c.length]),borderColor:["white","white","white","white","white","white"],borderWidth:4,borderRadius:8}]};T(N);const z=n.map((i,C)=>({color:c[C%c.length],...i}));G(z)}h&&M(Z(a,p,u))},[a,o]),m?t.jsxs(t.Fragment,{children:[t.jsxs("div",{style:{display:"flex",justifyContent:d||e?.length===0?"flex-end":"space-between"},children:[!d&&e&&t.jsx(J.TitleMedium,{style:{marginBottom:16},children:e}),t.jsxs("div",{children:[h&&t.jsx(I.IconButton,{Icon:H.default,onClick:()=>{v(!0)}}),x&&t.jsx(I.IconButton,{Icon:U.default,onClick:()=>{g(!0)}})]})]}),t.jsxs("div",{className:"row",children:[t.jsx("div",{className:"col-6 ",style:{display:"flex",alignItems:"center",justifyContent:"center"},children:t.jsx("div",{style:{width:r,height:r},children:t.jsx(B.Doughnut,{data:o?$:m,options:{...E(f),maintainAspectRatio:!r}})})}),t.jsx("div",{className:"col-6",style:{paddingLeft:48,display:"flex",flexDirection:"column",justifyContent:"flex-start"},children:t.jsx(k.PieChart,{slices:o?V:D,size:r})})]}),y&&t.jsx(W.StyledModal,{open:y,onClose:()=>g(!1),closeOnOutsideClick:!0,headingTitle:e,width:"75%",children:t.jsxs("div",{style:{padding:24,display:"flex",justifyContent:"space-between",height:"80vh"},children:[t.jsx("div",{style:{width:"55%",marginLeft:"4%"},children:t.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center"},children:t.jsx(B.Doughnut,{data:m,options:{...E(f),maintainAspectRatio:!r}})})}),t.jsx("div",{style:{width:"30%",height:"100%",overflowY:"auto"},children:t.jsx(k.PieChart,{slices:D})})]})}),A&&b&&t.jsx(W.StyledModal,{open:A,onClose:()=>v(!1),closeOnOutsideClick:!0,headingTitle:e,width:"85%",children:t.jsx("div",{style:{padding:"24px 0"},children:t.jsx(l.Suspense,{fallback:t.jsx("div",{children:"Loading..."}),children:t.jsx(K.LazyVerticalGraph,{xAxis:b.xAxis,yAxis:b.yAxis,barColorRGBA:b?.barColorRGBA,PieChartComponent:L})})})})]}):t.jsx(t.Fragment,{})};exports.Card=et;exports.PieChartAnalytics=L;
 //# sourceMappingURL=PieChartAnalytics.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js.map

@@ -1 +1 @@
-{"version":3,"file":"PieChartAnalytics.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.tsx"],"sourcesContent":["import BarChartIcon from '@src/assets/icons/ChartBar.svg';\nimport MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport { ArcElement, ChartData, Chart as ChartJS, Legend } from 'chart.js';\nimport React, { Suspense, useEffect, useState } from 'react';\nimport { Doughnut } from 'react-chartjs-2';\nimport styled from 'styled-components';\nimport {\n\tPieChartInput,\n\tPieChartInputData,\n} from '@src/components/analytics-chips-and-dropdowns/chart/Pie/PieChartInputData';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { TitleMedium } from '@src/components/TypographyStyle';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { LazyVerticalGraph as VerticalGraph } from '../LazyCharts';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport { PieChart } from './PieChart';\n\nChartJS.register(ArcElement, Legend);\n\nconst convertToBarChartData = (data, xAxisTitle, yAxisTitle) => {\n\tconst xAxisData = data.map((item) => item.name);\n\tconst yAxisData = data.map((item) => item.count);\n\tconst xAxis = {\n\t\tdata: xAxisData,\n\t\ttitle: xAxisTitle ?? '',\n\t};\n\tconst yAxis = {\n\t\tdata: yAxisData,\n\t\ttitle: yAxisTitle ?? '',\n\t};\n\n\tconst barChartData = {\n\t\txAxis,\n\t\tyAxis,\n\t\tbarColorRGBA: { r: 210, g: 174, b: 255, a: 1 },\n\t};\n\treturn barChartData;\n};\n\nconst options = (currencyProps?: {\n\tsymbol?: string;\n\tisInternationalStore?: boolean;\n}) => ({\n\tplugins: {\n\t\tlegend: {\n\t\t\tdisplay: false,\n\t\t},\n\t\ttooltip: {\n\t\t\tenabled: true,\n\t\t\tcallbacks: {\n\t\t\t\tlabel: (tooltipItem) => {\n\t\t\t\t\tif (!tooltipItem.label) {\n\t\t\t\t\t\treturn ` 0%`;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst total = tooltipItem.dataset.data.reduce(\n\t\t\t\t\t\t(acc, cur) => acc + cur,\n\t\t\t\t\t\t0,\n\t\t\t\t\t);\n\t\t\t\t\tconst percentage = parseFloat(\n\t\t\t\t\t\t((tooltipItem.raw / total) * 100).toFixed(1),\n\t\t\t\t\t);\n\n\t\t\t\t\tconst { label, raw } = tooltipItem;\n\t\t\t\t\tconst symbol = currencyProps?.symbol ?? '';\n\t\t\t\t\tconst isIntl = currencyProps?.isInternationalStore;\n\n\t\t\t\t\tconst value =\n\t\t\t\t\t\tisIntl !== undefined\n\t\t\t\t\t\t\t? isIntl\n\t\t\t\t\t\t\t\t? truncateValueForInternationalStore(raw)\n\t\t\t\t\t\t\t\t: truncateValueForIndianStore(raw)\n\t\t\t\t\t\t\t: raw;\n\n\t\t\t\t\tconst totalValue =\n\t\t\t\t\t\tisIntl !== undefined\n\t\t\t\t\t\t\t? isIntl\n\t\t\t\t\t\t\t\t? truncateValueForInternationalStore(total)\n\t\t\t\t\t\t\t\t: truncateValueForIndianStore(total)\n\t\t\t\t\t\t\t: total;\n\n\t\t\t\t\treturn [\n\t\t\t\t\t\t` ${label}`,\n\t\t\t\t\t\t` ${symbol}${value} (${percentage}% of ${symbol}${totalValue})`,\n\t\t\t\t\t];\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n});\n\nconst GRAPH_COLORS = [\n\t'#5E07BB',\n\t'#9E77ED',\n\t'#D2AEFF',\n\t'#CDE1FF',\n\t'#92AFFA',\n\t'#3935E1',\n];\n\nconst CartStyled = styled.div`\n\tbackground: ${(props) => COLORS.surface.standard};\n\tborder: 1px solid ${(props) => COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\nexport const Card = (props: any) => {\n\treturn <CartStyled style={{ padding: 24 }}>{props.children}</CartStyled>;\n};\n\nexport const PieChartAnalytics: React.FC<PieChartInputData> = ({\n\ttitle,\n\tslices,\n\tsize,\n\tallowChartPopup,\n\tshowConvertToBarChart,\n\ttruncateSlices,\n\tbarChartXAxisTitle,\n\tbarChartYAxisTitle,\n\thideTitle = false,\n\tcurrencyProps,\n}) => {\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst [showBarChart, setShowBarChart] = useState(false);\n\tconst [slicesWithColor, setSlicesWithColor] = useState<PieChartInput[]>([]);\n\tconst [data, setData] = useState<ChartData>();\n\tconst [truncatedData, setTruncatedData] = useState<ChartData>();\n\tconst [truncatedSlicesWithColor, setTruncatedSlicesWithColor] = useState<\n\t\tPieChartInput[]\n\t>([]);\n\tconst [barChartData, setBarChartData] = useState<{\n\t\txAxis: { data: []; title: string };\n\t\tyAxis: { data: []; title: string };\n\t\tbarColorRGBA: { r: number; g: number; b: number; a: number };\n\t} | null>(null);\n\n\tuseEffect(() => {\n\t\tconst totalSum = slices.reduce((sum, slice) => sum + slice.count, 0);\n\t\tlet updatedSlicesWithColor: PieChartInput[] = [];\n\n\t\tupdatedSlicesWithColor = Object.keys(slices).map((key, index) => ({\n\t\t\tcolor: GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t...slices[key],\n\t\t}));\n\n\t\tsetSlicesWithColor([...updatedSlicesWithColor]);\n\n\t\tif (totalSum === 0) {\n\t\t\tconst dataSet = {\n\t\t\t\tdatasets: [\n\t\t\t\t\t{\n\t\t\t\t\t\tdata: [100],\n\t\t\t\t\t\tbackgroundColor: ['#F0F0F0'],\n\t\t\t\t\t\tborderWidth: 0,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t\tlabels: [],\n\t\t\t};\n\t\t\tsetData(dataSet);\n\t\t} else {\n\t\t\tconst dataSet = {\n\t\t\t\tlabels: slices.map((slice) =>\n\t\t\t\t\tStringUtils.capitalizeEachWord(slice.name),\n\t\t\t\t),\n\t\t\t\tdatasets: [\n\t\t\t\t\t{\n\t\t\t\t\t\tdata: slices.map((slice) => slice.count),\n\t\t\t\t\t\tbackgroundColor: slices.map(\n\t\t\t\t\t\t\t(slice, index) =>\n\t\t\t\t\t\t\t\tslice.color ?? GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t\t\t\t),\n\t\t\t\t\t\tborderColor: ['white', 'white', 'white', 'white', 'white', 'white'],\n\t\t\t\t\t\tborderWidth: 4,\n\t\t\t\t\t\tborderRadius: 8,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t};\n\t\t\tsetData(dataSet);\n\t\t}\n\n\t\tif (truncateSlices && slices.length > truncateSlices) {\n\t\t\tconst truncatedSlices = slices.slice(0, truncateSlices);\n\t\t\tconst otherSlices = slices.slice(truncateSlices);\n\t\t\tconst otherCount = otherSlices.reduce(\n\t\t\t\t(sum, slice) => sum + slice.count,\n\t\t\t\t0,\n\t\t\t);\n\t\t\ttruncatedSlices.push({ name: 'Other', count: otherCount });\n\n\t\t\tconst truncatedDataSet = {\n\t\t\t\tlabels: truncatedSlices.map((slice) =>\n\t\t\t\t\tStringUtils.capitalize(slice.name),\n\t\t\t\t),\n\t\t\t\tdatasets: [\n\t\t\t\t\t{\n\t\t\t\t\t\tdata: truncatedSlices.map((slice) => slice.count),\n\t\t\t\t\t\tbackgroundColor: truncatedSlices.map(\n\t\t\t\t\t\t\t(slice, index) =>\n\t\t\t\t\t\t\t\tslice.color ?? GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t\t\t\t),\n\t\t\t\t\t\tborderColor: ['white', 'white', 'white', 'white', 'white', 'white'],\n\t\t\t\t\t\tborderWidth: 4,\n\t\t\t\t\t\tborderRadius: 8,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t};\n\t\t\tsetTruncatedData(truncatedDataSet);\n\n\t\t\tconst truncatedSlicesWithColor = truncatedSlices.map((slice, index) => ({\n\t\t\t\tcolor: GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t\t...slice,\n\t\t\t}));\n\t\t\tsetTruncatedSlicesWithColor(truncatedSlicesWithColor);\n\t\t}\n\n\t\tif (showConvertToBarChart) {\n\t\t\tsetBarChartData(\n\t\t\t\tconvertToBarChartData(slices, barChartXAxisTitle, barChartYAxisTitle),\n\t\t\t);\n\t\t}\n\t}, [slices, truncateSlices]);\n\n\tif (!data) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tjustifyContent:\n\t\t\t\t\t\thideTitle || title?.length === 0 ? 'flex-end' : 'space-between',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!hideTitle && title && (\n\t\t\t\t\t<TitleMedium\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginBottom: 16,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</TitleMedium>\n\t\t\t\t)}\n\n\t\t\t\t<div>\n\t\t\t\t\t{showConvertToBarChart && (\n\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\tIcon={BarChartIcon}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetShowBarChart(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{allowChartPopup && (\n\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetShowPopup(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div className={'row'}>\n\t\t\t\t<div\n\t\t\t\t\tclassName={'col-6 '}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twidth: size,\n\t\t\t\t\t\t\theight: size,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Doughnut\n\t\t\t\t\t\t\tdata={(truncateSlices ? truncatedData : data) as any}\n\t\t\t\t\t\t\toptions={{\n\t\t\t\t\t\t\t\t...options(currencyProps),\n\t\t\t\t\t\t\t\tmaintainAspectRatio: size ? false : true,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div\n\t\t\t\t\tclassName={'col-6'}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tpaddingLeft: 48,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tjustifyContent: 'flex-start',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<PieChart\n\t\t\t\t\t\tslices={truncateSlices ? truncatedSlicesWithColor : slicesWithColor}\n\t\t\t\t\t\tsize={size}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\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={title}\n\t\t\t\t\twidth=\"75%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: 24,\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\theight: '80vh',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div style={{ width: '55%', marginLeft: '4%' }}>\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\twidth: '100%',\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Doughnut\n\t\t\t\t\t\t\t\t\tdata={data as any}\n\t\t\t\t\t\t\t\t\toptions={{\n\t\t\t\t\t\t\t\t\t\t...options(currencyProps),\n\t\t\t\t\t\t\t\t\t\tmaintainAspectRatio: size ? false : 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\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '30%',\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\toverflowY: 'auto',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<PieChart slices={slicesWithColor} />\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\n\t\t\t{showBarChart && barChartData && (\n\t\t\t\t<StyledModal\n\t\t\t\t\topen={showBarChart}\n\t\t\t\t\tonClose={() => setShowBarChart(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={title}\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\tstyle={{\n\t\t\t\t\t\t\tpadding: '24px 0',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Suspense fallback={<div>Loading...</div>}>\n\t\t\t\t\t\t\t<VerticalGraph\n\t\t\t\t\t\t\t\txAxis={barChartData.xAxis}\n\t\t\t\t\t\t\t\tyAxis={barChartData.yAxis}\n\t\t\t\t\t\t\t\tbarColorRGBA={barChartData?.barColorRGBA}\n\t\t\t\t\t\t\t\tPieChartComponent={PieChartAnalytics}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Suspense>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["ChartJS","ArcElement","Legend","convertToBarChartData","data","xAxisTitle","yAxisTitle","xAxisData","item","yAxisData","options","currencyProps","tooltipItem","total","acc","cur","percentage","label","raw","symbol","isIntl","value","truncateValueForInternationalStore","truncateValueForIndianStore","totalValue","GRAPH_COLORS","CartStyled","styled","props","COLORS","Card","jsx","PieChartAnalytics","title","slices","size","allowChartPopup","showConvertToBarChart","truncateSlices","barChartXAxisTitle","barChartYAxisTitle","hideTitle","showPopup","setShowPopup","useState","showBarChart","setShowBarChart","slicesWithColor","setSlicesWithColor","setData","truncatedData","setTruncatedData","truncatedSlicesWithColor","setTruncatedSlicesWithColor","barChartData","setBarChartData","useEffect","totalSum","sum","slice","updatedSlicesWithColor","key","index","dataSet","StringUtils","truncatedSlices","otherCount","truncatedDataSet","jsxs","Fragment","TitleMedium","IconButton","BarChartIcon","MaximizeIcon","Doughnut","PieChart","StyledModal","Suspense","VerticalGraph"],"mappings":"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"}
+{"version":3,"file":"PieChartAnalytics.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.tsx"],"sourcesContent":["import BarChartIcon from '@src/assets/icons/ChartBar.svg';\nimport MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport { ArcElement, ChartData, Chart as ChartJS, Legend } from 'chart.js';\nimport React, { Suspense, useEffect, useState } from 'react';\nimport { Doughnut } from 'react-chartjs-2';\nimport styled from 'styled-components';\nimport {\n\tPieChartInput,\n\tPieChartInputData,\n} from '@src/components/analytics-chips-and-dropdowns/chart/Pie/PieChartInputData';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { TitleMedium } from '@src/components/TypographyStyle';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { LazyVerticalGraph as VerticalGraph } from '../LazyCharts';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport { PieChart } from './PieChart';\n\nChartJS.register(ArcElement, Legend);\n\nconst convertToBarChartData = (data, xAxisTitle, yAxisTitle) => {\n\tconst xAxisData = data.map((item) => item.name);\n\tconst yAxisData = data.map((item) => item.count);\n\tconst xAxis = {\n\t\tdata: xAxisData,\n\t\ttitle: xAxisTitle ?? '',\n\t};\n\tconst yAxis = {\n\t\tdata: yAxisData,\n\t\ttitle: yAxisTitle ?? '',\n\t};\n\n\tconst barChartData = {\n\t\txAxis,\n\t\tyAxis,\n\t\tbarColorRGBA: { r: 210, g: 174, b: 255, a: 1 },\n\t};\n\treturn barChartData;\n};\n\nconst options = (currencyProps?: {\n\tsymbol?: string;\n\tisInternationalStore?: boolean;\n}) => ({\n\tplugins: {\n\t\tlegend: {\n\t\t\tdisplay: false,\n\t\t},\n\t\ttooltip: {\n\t\t\tenabled: true,\n\t\t\tcallbacks: {\n\t\t\t\tlabel: (tooltipItem) => {\n\t\t\t\t\tif (!tooltipItem.label) {\n\t\t\t\t\t\treturn ` 0%`;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst total = tooltipItem.dataset.data.reduce(\n\t\t\t\t\t\t(acc, cur) => acc + cur,\n\t\t\t\t\t\t0,\n\t\t\t\t\t);\n\t\t\t\t\tconst percentage = parseFloat(\n\t\t\t\t\t\t((tooltipItem.raw / total) * 100).toFixed(1),\n\t\t\t\t\t);\n\n\t\t\t\t\tconst { label, raw } = tooltipItem;\n\t\t\t\t\tconst symbol = currencyProps?.symbol ?? '';\n\t\t\t\t\tconst isIntl = currencyProps?.isInternationalStore;\n\n\t\t\t\t\tconst value =\n\t\t\t\t\t\tisIntl !== undefined\n\t\t\t\t\t\t\t? isIntl\n\t\t\t\t\t\t\t\t? truncateValueForInternationalStore(raw)\n\t\t\t\t\t\t\t\t: truncateValueForIndianStore(raw)\n\t\t\t\t\t\t\t: raw;\n\n\t\t\t\t\tconst totalValue =\n\t\t\t\t\t\tisIntl !== undefined\n\t\t\t\t\t\t\t? isIntl\n\t\t\t\t\t\t\t\t? truncateValueForInternationalStore(total)\n\t\t\t\t\t\t\t\t: truncateValueForIndianStore(total)\n\t\t\t\t\t\t\t: total;\n\n\t\t\t\t\treturn [\n\t\t\t\t\t\t` ${label}`,\n\t\t\t\t\t\t` ${symbol}${value} (${percentage}% of ${symbol}${totalValue})`,\n\t\t\t\t\t];\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n});\n\nconst GRAPH_COLORS = [\n\t'#5E07BB',\n\t'#9E77ED',\n\t'#D2AEFF',\n\t'#CDE1FF',\n\t'#92AFFA',\n\t'#3935E1',\n];\n\nconst CartStyled = styled.div`\n\tbackground: ${(props) => COLORS.surface.standard};\n\tborder: 1px solid ${(props) => COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\nexport const Card = (props: any) => {\n\treturn <CartStyled style={{ padding: 24 }}>{props.children}</CartStyled>;\n};\n\nexport const PieChartAnalytics: React.FC<PieChartInputData> = ({\n\ttitle,\n\tslices,\n\tsize,\n\tallowChartPopup,\n\tshowConvertToBarChart,\n\ttruncateSlices,\n\tbarChartXAxisTitle,\n\tbarChartYAxisTitle,\n\thideTitle = false,\n\tcurrencyProps,\n}) => {\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst [showBarChart, setShowBarChart] = useState(false);\n\tconst [slicesWithColor, setSlicesWithColor] = useState<PieChartInput[]>([]);\n\tconst [data, setData] = useState<ChartData>();\n\tconst [truncatedData, setTruncatedData] = useState<ChartData>();\n\tconst [truncatedSlicesWithColor, setTruncatedSlicesWithColor] = useState<\n\t\tPieChartInput[]\n\t>([]);\n\tconst [barChartData, setBarChartData] = useState<{\n\t\txAxis: { data: []; title: string };\n\t\tyAxis: { data: []; title: string };\n\t\tbarColorRGBA: { r: number; g: number; b: number; a: number };\n\t} | null>(null);\n\n\tuseEffect(() => {\n\t\tconst totalSum = slices.reduce((sum, slice) => sum + slice.count, 0);\n\t\tlet updatedSlicesWithColor: PieChartInput[] = [];\n\n\t\tupdatedSlicesWithColor = Object.keys(slices).map((key, index) => ({\n\t\t\tcolor: GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t...slices[key],\n\t\t}));\n\n\t\tsetSlicesWithColor([...updatedSlicesWithColor]);\n\n\t\tif (totalSum === 0) {\n\t\t\tconst dataSet = {\n\t\t\t\tdatasets: [\n\t\t\t\t\t{\n\t\t\t\t\t\tdata: [100],\n\t\t\t\t\t\tbackgroundColor: ['#F0F0F0'],\n\t\t\t\t\t\tborderWidth: 0,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t\tlabels: [],\n\t\t\t};\n\t\t\tsetData(dataSet);\n\t\t} else {\n\t\t\tconst dataSet = {\n\t\t\t\tlabels: slices.map((slice) =>\n\t\t\t\t\tStringUtils.capitalizeEachWord(slice.name),\n\t\t\t\t),\n\t\t\t\tdatasets: [\n\t\t\t\t\t{\n\t\t\t\t\t\tdata: slices.map((slice) => slice.count),\n\t\t\t\t\t\tbackgroundColor: slices.map(\n\t\t\t\t\t\t\t(slice, index) =>\n\t\t\t\t\t\t\t\tslice.color ?? GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t\t\t\t),\n\t\t\t\t\t\tborderColor: ['white', 'white', 'white', 'white', 'white', 'white'],\n\t\t\t\t\t\tborderWidth: 4,\n\t\t\t\t\t\tborderRadius: 8,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t};\n\t\t\tsetData(dataSet);\n\t\t}\n\n\t\tif (truncateSlices && slices.length > truncateSlices) {\n\t\t\tconst truncatedSlices = slices.slice(0, truncateSlices);\n\t\t\tconst otherSlices = slices.slice(truncateSlices);\n\t\t\tconst otherCount = otherSlices.reduce(\n\t\t\t\t(sum, slice) => sum + slice.count,\n\t\t\t\t0,\n\t\t\t);\n\t\t\ttruncatedSlices.push({ name: 'Other', count: otherCount });\n\n\t\t\tconst truncatedDataSet = {\n\t\t\t\tlabels: truncatedSlices.map((slice) =>\n\t\t\t\t\tStringUtils.capitalize(slice.name),\n\t\t\t\t),\n\t\t\t\tdatasets: [\n\t\t\t\t\t{\n\t\t\t\t\t\tdata: truncatedSlices.map((slice) => slice.count),\n\t\t\t\t\t\tbackgroundColor: truncatedSlices.map(\n\t\t\t\t\t\t\t(slice, index) =>\n\t\t\t\t\t\t\t\tslice.color ?? GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t\t\t\t),\n\t\t\t\t\t\tborderColor: ['white', 'white', 'white', 'white', 'white', 'white'],\n\t\t\t\t\t\tborderWidth: 4,\n\t\t\t\t\t\tborderRadius: 8,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t};\n\t\t\tsetTruncatedData(truncatedDataSet);\n\n\t\t\tconst truncatedSlicesWithColor = truncatedSlices.map((slice, index) => ({\n\t\t\t\tcolor: GRAPH_COLORS[index % GRAPH_COLORS.length],\n\t\t\t\t...slice,\n\t\t\t}));\n\t\t\tsetTruncatedSlicesWithColor(truncatedSlicesWithColor);\n\t\t}\n\n\t\tif (showConvertToBarChart) {\n\t\t\tsetBarChartData(\n\t\t\t\tconvertToBarChartData(slices, barChartXAxisTitle, barChartYAxisTitle),\n\t\t\t);\n\t\t}\n\t}, [slices, truncateSlices]);\n\n\tif (!data) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tjustifyContent:\n\t\t\t\t\t\thideTitle || title?.length === 0 ? 'flex-end' : 'space-between',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!hideTitle && title && (\n\t\t\t\t\t<TitleMedium\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginBottom: 16,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</TitleMedium>\n\t\t\t\t)}\n\n\t\t\t\t<div>\n\t\t\t\t\t{showConvertToBarChart && (\n\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\tIcon={BarChartIcon}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetShowBarChart(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{allowChartPopup && (\n\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetShowPopup(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div className={'row'}>\n\t\t\t\t<div\n\t\t\t\t\tclassName={'col-6 '}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twidth: size,\n\t\t\t\t\t\t\theight: size,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Doughnut\n\t\t\t\t\t\t\tdata={(truncateSlices ? truncatedData : data) as any}\n\t\t\t\t\t\t\toptions={{\n\t\t\t\t\t\t\t\t...options(currencyProps),\n\t\t\t\t\t\t\t\tmaintainAspectRatio: size ? false : true,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div\n\t\t\t\t\tclassName={'col-6'}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tpaddingLeft: 48,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tjustifyContent: 'flex-start',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<PieChart\n\t\t\t\t\t\tslices={truncateSlices ? truncatedSlicesWithColor : slicesWithColor}\n\t\t\t\t\t\tsize={size}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\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={title}\n\t\t\t\t\twidth=\"75%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: 24,\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\theight: '80vh',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div style={{ width: '55%', marginLeft: '4%' }}>\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\twidth: '100%',\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Doughnut\n\t\t\t\t\t\t\t\t\tdata={data as any}\n\t\t\t\t\t\t\t\t\toptions={{\n\t\t\t\t\t\t\t\t\t\t...options(currencyProps),\n\t\t\t\t\t\t\t\t\t\tmaintainAspectRatio: size ? false : 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\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '30%',\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\toverflowY: 'auto',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<PieChart slices={slicesWithColor} />\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\n\t\t\t{showBarChart && barChartData && (\n\t\t\t\t<StyledModal\n\t\t\t\t\topen={showBarChart}\n\t\t\t\t\tonClose={() => setShowBarChart(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={title}\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\tstyle={{\n\t\t\t\t\t\t\tpadding: '24px 0',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Suspense fallback={<div>Loading...</div>}>\n\t\t\t\t\t\t\t<VerticalGraph\n\t\t\t\t\t\t\t\txAxis={barChartData.xAxis}\n\t\t\t\t\t\t\t\tyAxis={barChartData.yAxis}\n\t\t\t\t\t\t\t\tbarColorRGBA={barChartData?.barColorRGBA}\n\t\t\t\t\t\t\t\tPieChartComponent={PieChartAnalytics}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Suspense>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["ChartJS","ArcElement","Legend","convertToBarChartData","data","xAxisTitle","yAxisTitle","xAxisData","item","yAxisData","options","currencyProps","tooltipItem","total","acc","cur","percentage","label","raw","symbol","isIntl","value","truncateValueForInternationalStore","truncateValueForIndianStore","totalValue","GRAPH_COLORS","CartStyled","styled","props","COLORS","Card","jsx","PieChartAnalytics","title","slices","size","allowChartPopup","showConvertToBarChart","truncateSlices","barChartXAxisTitle","barChartYAxisTitle","hideTitle","showPopup","setShowPopup","useState","showBarChart","setShowBarChart","slicesWithColor","setSlicesWithColor","setData","truncatedData","setTruncatedData","truncatedSlicesWithColor","setTruncatedSlicesWithColor","barChartData","setBarChartData","useEffect","totalSum","sum","slice","updatedSlicesWithColor","key","index","dataSet","StringUtils","truncatedSlices","otherCount","truncatedDataSet","jsxs","Fragment","TitleMedium","IconButton","BarChartIcon","MaximizeIcon","Doughnut","PieChart","StyledModal","Suspense","VerticalGraph"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),q=require("../../../../assets/icons/maximize.svg.js"),g=require("chart.js"),Z=require("chartjs-plugin-datalabels"),F=require("react"),P=require("react-chartjs-2"),v=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),I=require("../utils/calcPercentage.js"),n=require("./StackedBarChart.model.js"),B=require("./StackedBarChart.styles.js"),z=require("../../../icon-button/IconButton.js"),M=require("../../../modals/styledModal.js");g.Chart.register(g.CategoryScale,g.LinearScale,g.BarElement,g.Tooltip,g.Legend,Z);const W=(e,c,x)=>{if(c.length<=x)return{truncatedData:e,truncatedLabels:c,originalData:e,originalLabels:c};const f=e.map(r=>r.slice(0,x)),y=e.map(r=>r.slice(x).reduce((h,S)=>h+S,0));f.forEach((r,h)=>r.push(y[h]));const A=c.slice(0,x);return A.push("Others"),{truncatedData:f,truncatedLabels:A,originalData:e,originalLabels:c}},V=e=>{const{headerIcons:c=[],legendsAndIconDirection:x="row"}=e,[f,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"],D=["#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?D:S,H=e.customHoverColour,G=F.useMemo(()=>({barPercentage:e?.barPercentage||.4,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],...G}));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=W(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 m=a.dataIndex;let u=0;for(let L=0;L<s.length;L++)u+=s[L].data[m]??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,m=t.chart.data.datasets[l].label,u=t.chart.data.labels[s];e.onBarClick(u,m)},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 _={labels:T,datasets:b};let N;r?N=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:N=k;const w={labels:e.xAxis.data.map(t=>typeof t=="string"?t:t.name),datasets:N},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(v.BodyTiny,{color:o.COLORS.content.secondary,children:l.label})]},l.label.replace(" ","_")))})};return i.jsxs(B.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(v.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(B.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:_})})}),f&&i.jsx(M.StyledModal,{open:f,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=V;
+"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: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;
 //# sourceMappingURL=StackedBarChart.js.map

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

@@ -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: 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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"}
+{"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: 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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"}

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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),a=require("../../../../constants/Theme.js"),p=r.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),a=require("../../../../constants/Theme.js"),p=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=p(r),n=t.default.div`
 	background-color: ${a.COLORS.surface.standard};
 	padding: ${e=>e.padding??"24px"};
 	border: none;
@@ -28,9 +28,9 @@
 	.legend__set {
 		margin-top: 16px;
 	}
-`,n=r.div`
+`,d=t.default.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
-`;exports.GraphContainerWrapper=p;exports.HeaderIconWrapper=n;
+`;exports.GraphContainerWrapper=n;exports.HeaderIconWrapper=d;
 //# sourceMappingURL=StackedBarChart.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"StackedBarChart.styles.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.styles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const GraphContainerWrapper = styled.div<{\n\tpadding?: string;\n\tchartWrapperHeight?: string;\n\tisFunnel?: boolean;\n\tcustomLegend?: boolean;\n}>`\n\tbackground-color: ${COLORS.surface.standard};\n\tpadding: ${(props) => props.padding ?? '24px'};\n\tborder: none;\n\twidth: 100%;\n\n\t.graph__wrapper {\n\t\twidth: 100%;\n\t\tdisplay: flex;\n\t\tgap: 24px;\n\t\theight: ${(props) => props.chartWrapperHeight ?? '100%'};\n\t\tflex-direction: ${(props) =>\n\t\t\tprops.isFunnel || props.customLegend ? 'column' : 'row'};\n\t}\n\n\t.legend__palette {\n\t\theight: 16px;\n\t\twidth: 16px;\n\t\tborder-radius: 2px;\n\t}\n\n\t.legend__row {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t\tmargin-top: 4px;\n\t}\n\n\t.legend__set {\n\t\tmargin-top: 16px;\n\t}\n`;\n\nexport const HeaderIconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n"],"names":["GraphContainerWrapper","styled","COLORS","props","HeaderIconWrapper"],"mappings":"iKAGaA,EAAwBC,EAAO;AAAA,qBAMvBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,YAC/BC,GAAUA,EAAM,SAAW,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQjCA,GAAUA,EAAM,oBAAsB,MAAM;AAAA,oBACpCA,GAClBA,EAAM,UAAYA,EAAM,aAAe,SAAW,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqB7CC,EAAoBH,EAAO;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"StackedBarChart.styles.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.styles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const GraphContainerWrapper = styled.div<{\n\tpadding?: string;\n\tchartWrapperHeight?: string;\n\tisFunnel?: boolean;\n\tcustomLegend?: boolean;\n}>`\n\tbackground-color: ${COLORS.surface.standard};\n\tpadding: ${(props) => props.padding ?? '24px'};\n\tborder: none;\n\twidth: 100%;\n\n\t.graph__wrapper {\n\t\twidth: 100%;\n\t\tdisplay: flex;\n\t\tgap: 24px;\n\t\theight: ${(props) => props.chartWrapperHeight ?? '100%'};\n\t\tflex-direction: ${(props) =>\n\t\t\tprops.isFunnel || props.customLegend ? 'column' : 'row'};\n\t}\n\n\t.legend__palette {\n\t\theight: 16px;\n\t\twidth: 16px;\n\t\tborder-radius: 2px;\n\t}\n\n\t.legend__row {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t\tmargin-top: 4px;\n\t}\n\n\t.legend__set {\n\t\tmargin-top: 16px;\n\t}\n`;\n\nexport const HeaderIconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n"],"names":["GraphContainerWrapper","styled","COLORS","props","HeaderIconWrapper"],"mappings":"gOAGaA,EAAwBC,EAAAA,QAAO;AAAA,qBAMvBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,YAC/BC,GAAUA,EAAM,SAAW,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQjCA,GAAUA,EAAM,oBAAsB,MAAM;AAAA,oBACpCA,GAClBA,EAAM,UAAYA,EAAM,aAAe,SAAW,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqB7CC,EAAoBH,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),O=require("chart.js"),v=require("chartjs-plugin-datalabels"),R=require("react"),P=require("react-chartjs-2"),I=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),g=require("../utils/calcPercentage.js"),B=require("./StackedBarChart.styles.js"),l=require("./StackedBarDistributionChart.model.js");O.Chart.register(O.CategoryScale,O.LinearScale,O.BarElement,O.Tooltip,O.Legend,v);O.Chart.defaults.plugins.datalabels.display=!1;function j(e){return e.map(d=>d.length>0?d.charAt(0).toUpperCase()+d.slice(1):d)}const G=e=>{const[d,y]=R.useState([]),[A,S]=R.useState(),T=!e.data.filter(t=>!!t.value).length,L=[10,20,30,40,50,60,80,100,120],x=e.colorMatrix&&e.colorMatrix.length?e.colorMatrix:[["#09A35B","#33D2A1","#A8E5C0","#075E54","#128C7E","#25D366","#DCF8C6"],["#FC4183","#FCA0C2","#FEE3EF","#F5016C","#F972AD","#FCAACE","#FEE3EF"],["#1B95D6","#74B2E5","#A0D1F1","#0078D5","#55A5E3","#8EC3EC","#C6E1F6"],["#FF4F52","#FFA3A4","#FFD9DA","#FF0012","#FF797D","#FFC4C5","#F9DFDF"],["#4B2E91","#7B1FA2","#A77BCA","#5E07BB","#9E77ED","#D2AEFF","#EBDBFF"]],b={min:0,max:200,stepSize:20},f={min:e.minValue,max:e.maxValue,stepSize:e.valuesStepSize},E={barPercentage:.4,categoryPercentage:1,pointStyle:"circle",barThickness:T?0:e.barThickness??100},H={plugins:{legend:{display:!1},tooltip:{enabled:!T,callbacks:{label:e.tooltipConfig?.labelCallback,footer:e.tooltipConfig?.footerCallback},footerFont:e.tooltipConfig?.footerStyles?.footerFont},datalabels:{display:(!T&&e.showTotal)??!1,anchor:"end",align:"end",clamp:!0,formatter:(t,a)=>{const r=a.datasetIndex,c=a.chart.data.datasets;if(r!==c.length-1)return"";const s=a.dataIndex;let i=0;for(let u=0;u<c.length;u++)i+=c[u].data[s]??0;return i?e.isInternationalStore?g.truncateValueForInternationalStore(i):g.truncateValueForIndianStore(i):""},color:o.COLORS.content.secondary}},responsive:!0,maintainAspectRatio:!1,legend:{display:!1},indexAxis:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",layout:{padding:{right:e.showTotal&&e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=l.GRAPH_ORIENTATION.HORIZONTAL?25:0}},scales:{x:{title:{display:!!(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.heading:e.labelTitle?.heading),text:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.heading:e.labelTitle?.heading,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.color:e.labelTitle?.color)??o.COLORS.content.secondary,font:{size:o.FONTS.bodySecondary.fontSize}},grid:{display:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL,color:o.COLORS.background.base},ticks:{stepSize:30,fontSize:o.FONTS.caption.fontSize,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.color:e.valueTitle?.color)??o.COLORS.content.secondary,...e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?T?b:f:{},callback:(t,a)=>e.orientation!==l.GRAPH_ORIENTATION.HORIZONTAL?A?.labels?.[a]??"":typeof t!="number"?t:e.isInternationalStore?g.truncateValueForInternationalStore(t):g.truncateValueForIndianStore(t)},stacked:!0},y:{title:{display:!!(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.heading:e.valueTitle?.heading),text:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.heading:e.valueTitle?.heading,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.color:e.valueTitle?.color)??o.COLORS.content.secondary,font:{size:o.FONTS.bodySecondary.fontSize}},grid:{display:e.orientation!==l.GRAPH_ORIENTATION.HORIZONTAL,color:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.color:e.labelTitle?.color)??o.COLORS.content.secondary,...e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?{}:T?b:f,callback:(t,a)=>e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?A?.labels?.[a]??"":typeof t!="number"?t:e.isInternationalStore?g.truncateValueForInternationalStore(t):g.truncateValueForIndianStore(t)},stacked:!0}},onClick:(t,a)=>{if(!e.onBarClick)return;const r=a[0].datasetIndex,c=a[0].index,s=t.chart.data.datasets[r].label,i=t.chart.data.labels[c];e.onBarClick(i,s)},onHover:(t,a)=>{e.onBarClick&&a.length&&(t.native.target.style.cursor="pointer")}},h=Array.from(new Set(e.data.map(t=>t.label))),C={labels:j(h),datasets:T?[{data:L,backgroundColor:"rgba(0,0,0,0)"}]:[]},_=(t,a,r)=>x[t].slice(-r)[a];R.useEffect(()=>{const t=[];h.forEach((a,r)=>{const c=[],s=e.data.filter(i=>i.label===a);e.isFunnel||s.sort((i,u)=>u.value-i.value),s.forEach((i,u)=>{const N=_(r,u,s.length);c.push({color:N,label:i.stackLabel});const F={label:i.stackLabel,backgroundColor:N,data:Array(h.length).fill(0),...E};F.data[r]=i.value,C.datasets.push(F)}),t.push(c)}),y(t),S(C)},[e.data]);const m=R.useCallback(()=>n.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",justifyContent:"flex-end"},children:k().map(t=>n.jsxs("div",{className:"legend__row",children:[n.jsx("div",{className:"legend__palette",style:{backgroundColor:t.color}}),n.jsx(I.BodyTiny,{color:o.COLORS.content.secondary,children:t.label})]},t.label.replace(" ","_")))}),[d]),k=()=>{const t=[];return d.forEach((a,r)=>{t.push({color:a[0].color,label:h[r]})}),t};if(!A)return n.jsx(n.Fragment,{});const D=()=>n.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"column"},children:d.map((t,a)=>n.jsx("div",{className:"legend__set",children:t.map(r=>n.jsxs("div",{className:"legend__row",children:[n.jsx("div",{className:"legend__palette",style:{backgroundColor:r.color}}),n.jsx(I.BodyTiny,{color:o.COLORS.content.secondary,children:r.label})]},r.label.replace(" ","_")))},`Legend_set_${a}`))});return n.jsxs(B.GraphContainerWrapper,{style:e.wrapperStyle??{},padding:e.outerPadding,chartWrapperHeight:e.chartWrapperHeight,isFunnel:e.isFunnel,children:[e.chartHeading&&n.jsx("div",{style:{marginBottom:24},children:n.jsx(I.TitleRegular,{color:e.chartHeading.color??o.COLORS.content.secondary,children:e.chartHeading.heading})}),n.jsxs("div",{className:"graph__wrapper",children:[(e.showLegend??!0)&&e.isFunnel&&m(),n.jsx("div",{style:{height:e.graphCanvasHeight??500,width:e.graphCanvasWidth??"100%",flex:1},children:n.jsx(P.Bar,{options:H,data:A})}),(e.showLegend??!0)&&!e.isFunnel&&D()]})]})};exports.StackedBarDistributionChart=G;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),O=require("chart.js"),v=require("chartjs-plugin-datalabels"),R=require("react"),P=require("react-chartjs-2"),f=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),g=require("../utils/calcPercentage.js"),j=require("./StackedBarChart.styles.js"),l=require("./StackedBarDistributionChart.model.js"),B=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},G=B(v);O.Chart.register(O.CategoryScale,O.LinearScale,O.BarElement,O.Tooltip,O.Legend,G.default);O.Chart.defaults.plugins.datalabels.display=!1;function w(e){return e.map(d=>d.length>0?d.charAt(0).toUpperCase()+d.slice(1):d)}const Z=e=>{const[d,F]=R.useState([]),[h,S]=R.useState(),T=!e.data.filter(t=>!!t.value).length,L=[10,20,30,40,50,60,80,100,120],x=e.colorMatrix&&e.colorMatrix.length?e.colorMatrix:[["#09A35B","#33D2A1","#A8E5C0","#075E54","#128C7E","#25D366","#DCF8C6"],["#FC4183","#FCA0C2","#FEE3EF","#F5016C","#F972AD","#FCAACE","#FEE3EF"],["#1B95D6","#74B2E5","#A0D1F1","#0078D5","#55A5E3","#8EC3EC","#C6E1F6"],["#FF4F52","#FFA3A4","#FFD9DA","#FF0012","#FF797D","#FFC4C5","#F9DFDF"],["#4B2E91","#7B1FA2","#A77BCA","#5E07BB","#9E77ED","#D2AEFF","#EBDBFF"]],I={min:0,max:200,stepSize:20},b={min:e.minValue,max:e.maxValue,stepSize:e.valuesStepSize},E={barPercentage:.4,categoryPercentage:1,pointStyle:"circle",barThickness:T?0:e.barThickness??100},H={plugins:{legend:{display:!1},tooltip:{enabled:!T,callbacks:{label:e.tooltipConfig?.labelCallback,footer:e.tooltipConfig?.footerCallback},footerFont:e.tooltipConfig?.footerStyles?.footerFont},datalabels:{display:(!T&&e.showTotal)??!1,anchor:"end",align:"end",clamp:!0,formatter:(t,a)=>{const r=a.datasetIndex,c=a.chart.data.datasets;if(r!==c.length-1)return"";const s=a.dataIndex;let i=0;for(let u=0;u<c.length;u++)i+=c[u].data[s]??0;return i?e.isInternationalStore?g.truncateValueForInternationalStore(i):g.truncateValueForIndianStore(i):""},color:o.COLORS.content.secondary}},responsive:!0,maintainAspectRatio:!1,legend:{display:!1},indexAxis:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",layout:{padding:{right:e.showTotal&&e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=l.GRAPH_ORIENTATION.HORIZONTAL?25:0}},scales:{x:{title:{display:!!(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.heading:e.labelTitle?.heading),text:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.heading:e.labelTitle?.heading,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.color:e.labelTitle?.color)??o.COLORS.content.secondary,font:{size:o.FONTS.bodySecondary.fontSize}},grid:{display:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL,color:o.COLORS.background.base},ticks:{stepSize:30,fontSize:o.FONTS.caption.fontSize,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.color:e.valueTitle?.color)??o.COLORS.content.secondary,...e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?T?I:b:{},callback:(t,a)=>e.orientation!==l.GRAPH_ORIENTATION.HORIZONTAL?h?.labels?.[a]??"":typeof t!="number"?t:e.isInternationalStore?g.truncateValueForInternationalStore(t):g.truncateValueForIndianStore(t)},stacked:!0},y:{title:{display:!!(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.heading:e.valueTitle?.heading),text:e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.heading:e.valueTitle?.heading,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.labelTitle?.color:e.valueTitle?.color)??o.COLORS.content.secondary,font:{size:o.FONTS.bodySecondary.fontSize}},grid:{display:e.orientation!==l.GRAPH_ORIENTATION.HORIZONTAL,color:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:(e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?e.valueTitle?.color:e.labelTitle?.color)??o.COLORS.content.secondary,...e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?{}:T?I:b,callback:(t,a)=>e.orientation===l.GRAPH_ORIENTATION.HORIZONTAL?h?.labels?.[a]??"":typeof t!="number"?t:e.isInternationalStore?g.truncateValueForInternationalStore(t):g.truncateValueForIndianStore(t)},stacked:!0}},onClick:(t,a)=>{if(!e.onBarClick)return;const r=a[0].datasetIndex,c=a[0].index,s=t.chart.data.datasets[r].label,i=t.chart.data.labels[c];e.onBarClick(i,s)},onHover:(t,a)=>{e.onBarClick&&a.length&&(t.native.target.style.cursor="pointer")}},A=Array.from(new Set(e.data.map(t=>t.label))),C={labels:w(A),datasets:T?[{data:L,backgroundColor:"rgba(0,0,0,0)"}]:[]},_=(t,a,r)=>x[t].slice(-r)[a];R.useEffect(()=>{const t=[];A.forEach((a,r)=>{const c=[],s=e.data.filter(i=>i.label===a);e.isFunnel||s.sort((i,u)=>u.value-i.value),s.forEach((i,u)=>{const N=_(r,u,s.length);c.push({color:N,label:i.stackLabel});const y={label:i.stackLabel,backgroundColor:N,data:Array(A.length).fill(0),...E};y.data[r]=i.value,C.datasets.push(y)}),t.push(c)}),F(t),S(C)},[e.data]);const m=R.useCallback(()=>n.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",justifyContent:"flex-end"},children:k().map(t=>n.jsxs("div",{className:"legend__row",children:[n.jsx("div",{className:"legend__palette",style:{backgroundColor:t.color}}),n.jsx(f.BodyTiny,{color:o.COLORS.content.secondary,children:t.label})]},t.label.replace(" ","_")))}),[d]),k=()=>{const t=[];return d.forEach((a,r)=>{t.push({color:a[0].color,label:A[r]})}),t};if(!h)return n.jsx(n.Fragment,{});const D=()=>n.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"column"},children:d.map((t,a)=>n.jsx("div",{className:"legend__set",children:t.map(r=>n.jsxs("div",{className:"legend__row",children:[n.jsx("div",{className:"legend__palette",style:{backgroundColor:r.color}}),n.jsx(f.BodyTiny,{color:o.COLORS.content.secondary,children:r.label})]},r.label.replace(" ","_")))},`Legend_set_${a}`))});return n.jsxs(j.GraphContainerWrapper,{style:e.wrapperStyle??{},padding:e.outerPadding,chartWrapperHeight:e.chartWrapperHeight,isFunnel:e.isFunnel,children:[e.chartHeading&&n.jsx("div",{style:{marginBottom:24},children:n.jsx(f.TitleRegular,{color:e.chartHeading.color??o.COLORS.content.secondary,children:e.chartHeading.heading})}),n.jsxs("div",{className:"graph__wrapper",children:[(e.showLegend??!0)&&e.isFunnel&&m(),n.jsx("div",{style:{height:e.graphCanvasHeight??500,width:e.graphCanvasWidth??"100%",flex:1},children:n.jsx(P.Bar,{options:H,data:h})}),(e.showLegend??!0)&&!e.isFunnel&&D()]})]})};exports.StackedBarDistributionChart=Z;
 //# sourceMappingURL=StackedBarDistributionChart.js.map