@bikdotai/bik-component-library 0.0.640-beta.3 → 0.0.640-beta.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/maximize.svg.js"),o=require("chart.js"),i=require("chartjs-plugin-datalabels"),a=require("react"),l=require("react-chartjs-2"),n=require("../../../icon-button/IconButton.js"),d=require("../../../modals/styledModal.js"),r=require("../../../TypographyStyle.js"),s=require("../../../../constants/Theme.js"),c=require("../utils/calcPercentage.js"),u=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js");function O(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=O(i);o.Chart.register(o.CategoryScale,o.LinearScale,o.BarElement,o.Tooltip,o.Legend,g.default);exports.StackedBarChart=o=>{var i,O,g,p,x,A,b,h,y,R,T,C,I,j,f,N,S,m,L,H,E,k,F,P,_,G,B,w,D,q,Z,z,M,V,W,Y,J,K,Q,U,X;const[$,ee]=a.useState(!1),te=[250,1e3,800,1500,300,600],oe=0===o.yAxis.data.length,ie=void 0===o.customColourScaleBrand&&void 0===o.customColourScalePastel?o.colorSchema===u.COLOR_SCHEMA.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:o.colorSchema===u.COLOR_SCHEMA.PASTEL?o.customColourScalePastel:o.customColourScaleBrand,ae=o.customHoverColour,le=a.useMemo((()=>Object.assign(Object.assign({barPercentage:(null==o?void 0:o.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:o.barWidth,borderRadius:(null==o?void 0:o.borderRadius)||void 0},"object"==typeof(null==o?void 0:o.borderRadius)?{borderSkipped:!1}:{}),(null==o?void 0:o.addBarGap)?{borderWidth:{top:5,bottom:5,right:0,left:0},borderColor:"transparent"}:{})),[o.barWidth,null==o?void 0:o.borderRadius,null==o?void 0:o.barPercentage]),ne={};o.yAxis.data.map((e=>{e.map((e=>{ne[e.name]?ne[e.name].push(e.value):ne[e.name]=[e.value]}))}));const de=Object.keys(ne).map(((e,t)=>Object.assign({label:e,data:ne[e],backgroundColor:null==ie?void 0:ie[t],hoverBackgroundColor:void 0===ae?void 0:ae[t]},le)));let re=o.xAxis.data.map((e=>"string"==typeof e?e:e.name)),se=de;if(o.truncateBars){const e=((e,t,o)=>{if(t.length<=o)return{truncatedData:e,truncatedLabels:t,originalData:e,originalLabels:t};const i=e.map((e=>e.slice(0,o))),a=e.map((e=>e.slice(o).reduce(((e,t)=>e+t),0)));i.forEach(((e,t)=>e.push(a[t])));const l=t.slice(0,o);return l.push("Others"),{truncatedData:i,truncatedLabels:l,originalData:e,originalLabels:t}})(de.map((e=>e.data)),re,o.truncateBars);de.forEach(((t,o)=>t.data=e.truncatedData[o])),re=e.truncatedLabels,se=e.originalData.map(((e,t)=>Object.assign(Object.assign({},de[t]),{data:e})))}const ce={plugins:{legend:{display:!oe&&!o.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!oe,callbacks:{label:null===(i=o.tooltipConfig)||void 0===i?void 0:i.labelCallback,footer:null===(O=o.tooltipConfig)||void 0===O?void 0:O.footerCallback},footerFont:null===(p=null===(g=o.tooltipConfig)||void 0===g?void 0:g.footerStyles)||void 0===p?void 0:p.footerFont},datalabels:{display:null!==(x=o.showTotal)&&void 0!==x&&x,anchor:"end",align:"end",clamp:!0,formatter:(e,t)=>{var o;const i=t.datasetIndex,a=t.chart.data.datasets;if(i!==a.length-1)return"";const l=t.dataIndex;let n=0;for(let e=0;e<a.length;e++)n+=null!==(o=a[e].data[l])&&void 0!==o?o:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:s.COLORS.content.secondary}},layout:{padding:{right:o.showTotal&&o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:o.showTotal&&o.orientation!=u.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!o.customLegend,labels:{usePointStyle:!0}},indexAxis:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(A=o.yAxis)||void 0===A?void 0:A.title:null===(b=o.xAxis)||void 0===b?void 0:b.title),text:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(h=o.yAxis)||void 0===h?void 0:h.title:null===(y=o.xAxis)||void 0===y?void 0:y.title,color:null!==(C=o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(R=o.yAxis)||void 0===R?void 0:R.titleColor:null===(T=o.xAxis)||void 0===T?void 0:T.titleColor)&&void 0!==C?C:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(I=null==o?void 0:o.showGridLines)||void 0===I?void 0:I.x)||(null===(j=null==o?void 0:o.showGridLines)||void 0===j?void 0:j.x)),color:s.COLORS.background.base},ticks:{fontSize:s.FONTS.caption.fontSize,color:null!==(f=o.yAxis.labelColor)&&void 0!==f?f:s.COLORS.content.secondary,callback:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?o.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0},stacked:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(N=o.yAxis)||void 0===N?void 0:N.stacked)||(null===(S=o.yAxis)||void 0===S?void 0:S.stacked):"boolean"!=typeof(null===(m=o.xAxis)||void 0===m?void 0:m.stacked)||(null===(L=o.xAxis)||void 0===L?void 0:L.stacked)},y:Object.assign(Object.assign({},(null===(H=null==o?void 0:o.equalHeight)||void 0===H?void 0:H.flag)?{suggestedMin:-(null==o?void 0:o.equalHeight.max),suggestedMax:null==o?void 0:o.equalHeight.max}:{}),{title:{display:!!(o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(E=o.xAxis)||void 0===E?void 0:E.title:null===(k=o.yAxis)||void 0===k?void 0:k.title),text:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(F=o.xAxis)||void 0===F?void 0:F.title:null===(P=o.yAxis)||void 0===P?void 0:P.title,color:null!==(B=o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(_=o.xAxis)||void 0===_?void 0:_.titleColor:null===(G=o.yAxis)||void 0===G?void 0:G.titleColor)&&void 0!==B?B:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:o.orientation!==u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(w=null==o?void 0:o.showGridLines)||void 0===w?void 0:w.y)||(null===(D=null==o?void 0:o.showGridLines)||void 0===D?void 0:D.y)),color:s.COLORS.background.base},ticks:Object.assign(Object.assign({stepSize:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(q=o.xAxis)||void 0===q?void 0:q.stepSize:null===(Z=o.yAxis)||void 0===Z?void 0:Z.stepSize,fontSize:s.FONTS.caption.fontSize,color:null!==(z=o.xAxis.labelColor)&&void 0!==z?z:s.COLORS.content.secondary},oe?{min:0,max:2e3,stepSize:200}:{}),{callback:o.orientation!==u.GRAPH_ORIENTATION.VERTICAL?o.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0}),stacked:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(M=o.xAxis)||void 0===M?void 0:M.stacked)||(null===(V=o.xAxis)||void 0===V?void 0:V.stacked):"boolean"!=typeof(null===(W=o.yAxis)||void 0===W?void 0:W.stacked)||(null===(Y=o.yAxis)||void 0===Y?void 0:Y.stacked)})},onClick:(e,t)=>{if(!o.onBarClick)return;const i=t[0].datasetIndex,a=t[0].index,l=e.chart.data.datasets[i].label,n=e.chart.data.labels[a];o.onBarClick(n,l)},onHover:(e,t)=>{o.onBarClick&&t.length&&(e.native.target.style.cursor="pointer")}};o.orientation&&o.orientation!==u.GRAPH_ORIENTATION.VERTICAL?delete ce.scales.y.ticks.callback:delete ce.scales.x.ticks.callback;const ue={labels:re,datasets:oe?[{data:te,backgroundColor:"rgba(0,0,0,0)"}]:de},ve={labels:o.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:oe?[{data:te,backgroundColor:"rgba(0,0,0,0)"}]:se},Oe=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return e.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:o.allowChartPopup&&!t?"flex-start":"flex-end"}},{children:de.map((t=>e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[e.jsx("div",{style:{backgroundColor:t.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),e.jsx(r.BodyTiny,Object.assign({color:s.COLORS.content.secondary},{children:t.label}))]}),t.label.replace(" ","_"))))}))};return e.jsxs(v.GraphContainerWrapper,Object.assign({style:null!==(J=o.wrapperStyle)&&void 0!==J?J:{},padding:o.outerPadding,customLegend:o.customLegend},{children:[o.chartHeading&&e.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:o.hideHeading?"flex-end":"space-between"}},{children:[!0!==o.hideHeading&&e.jsx(r.TitleRegular,Object.assign({color:null!==(K=o.chartHeading.color)&&void 0!==K?K:s.COLORS.content.secondary},{children:o.chartHeading.heading})),o.allowChartPopup&&e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:e.jsx("div",{children:e.jsx(n.IconButton,{Icon:t.default,onClick:()=>{ee(!0)}})})}))]})),o.customLegend&&Oe(),e.jsx("div",Object.assign({className:"graph__wrapper"},{children:e.jsx("div",Object.assign({style:{height:null!==(Q=o.graphCanvasHeight)&&void 0!==Q?Q:500,width:null!==(U=o.graphCanvasWidth)&&void 0!==U?U:"auto"}},{children:e.jsx(l.Bar,{options:ce,data:ue})}))})),$&&e.jsx(d.StyledModal,Object.assign({open:$,onClose:()=>ee(!1),closeOnOutsideClick:!0,headingTitle:null===(X=o.chartHeading)||void 0===X?void 0:X.heading,width:"85%"},{children:e.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[o.customLegend&&Oe(!0),e.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:e.jsx(l.Bar,{options:ce,data:ve})}))]}))}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/maximize.svg.js"),o=require("chart.js"),i=require("chartjs-plugin-datalabels"),a=require("react"),l=require("react-chartjs-2"),n=require("../../../icon-button/IconButton.js"),d=require("../../../modals/styledModal.js"),r=require("../../../TypographyStyle.js"),s=require("../../../../constants/Theme.js"),c=require("../utils/calcPercentage.js"),u=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js");function O(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=O(i);o.Chart.register(o.CategoryScale,o.LinearScale,o.BarElement,o.Tooltip,o.Legend,g.default);exports.StackedBarChart=o=>{var i,O,g,p,x,A,b,h,y,R,T,C,I,f,j,N,S,m,L,H,E,k,F,P,_,G,B,w,D,q,Z,z,M,W,V,Y,J,K,Q,U,X;const[$,ee]=a.useState(!1),te=[250,1e3,800,1500,300,600],oe=0===o.yAxis.data.length,ie=void 0===o.customColourScaleBrand&&void 0===o.customColourScalePastel?o.colorSchema===u.COLOR_SCHEMA.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:o.colorSchema===u.COLOR_SCHEMA.PASTEL?o.customColourScalePastel:o.customColourScaleBrand,ae=o.customHoverColour,le=a.useMemo((()=>{var e,t,i;return Object.assign(Object.assign({barPercentage:(null==o?void 0:o.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:o.barWidth,borderRadius:(null==o?void 0:o.borderRadius)||void 0},"object"==typeof(null==o?void 0:o.borderRadius)?{borderSkipped:!1}:{}),(null===(e=null==o?void 0:o.addBarGap)||void 0===e?void 0:e.flag)?{borderWidth:{top:(null===(t=null==o?void 0:o.addBarGap)||void 0===t?void 0:t.value)||2,bottom:(null===(i=null==o?void 0:o.addBarGap)||void 0===i?void 0:i.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[o.barWidth,null==o?void 0:o.borderRadius,null==o?void 0:o.barPercentage]),ne={};o.yAxis.data.map((e=>{e.map((e=>{ne[e.name]?ne[e.name].push(e.value):ne[e.name]=[e.value]}))}));const de=Object.keys(ne).map(((e,t)=>Object.assign({label:e,data:ne[e],backgroundColor:null==ie?void 0:ie[t],hoverBackgroundColor:void 0===ae?void 0:ae[t]},le)));let re=o.xAxis.data.map((e=>"string"==typeof e?e:e.name)),se=de;if(o.truncateBars){const e=((e,t,o)=>{if(t.length<=o)return{truncatedData:e,truncatedLabels:t,originalData:e,originalLabels:t};const i=e.map((e=>e.slice(0,o))),a=e.map((e=>e.slice(o).reduce(((e,t)=>e+t),0)));i.forEach(((e,t)=>e.push(a[t])));const l=t.slice(0,o);return l.push("Others"),{truncatedData:i,truncatedLabels:l,originalData:e,originalLabels:t}})(de.map((e=>e.data)),re,o.truncateBars);de.forEach(((t,o)=>t.data=e.truncatedData[o])),re=e.truncatedLabels,se=e.originalData.map(((e,t)=>Object.assign(Object.assign({},de[t]),{data:e})))}const ce={plugins:{legend:{display:!oe&&!o.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!oe,callbacks:{label:null===(i=o.tooltipConfig)||void 0===i?void 0:i.labelCallback,footer:null===(O=o.tooltipConfig)||void 0===O?void 0:O.footerCallback},footerFont:null===(p=null===(g=o.tooltipConfig)||void 0===g?void 0:g.footerStyles)||void 0===p?void 0:p.footerFont},datalabels:{display:null!==(x=o.showTotal)&&void 0!==x&&x,anchor:"end",align:"end",clamp:!0,formatter:(e,t)=>{var o;const i=t.datasetIndex,a=t.chart.data.datasets;if(i!==a.length-1)return"";const l=t.dataIndex;let n=0;for(let e=0;e<a.length;e++)n+=null!==(o=a[e].data[l])&&void 0!==o?o:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:s.COLORS.content.secondary}},layout:{padding:{right:o.showTotal&&o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:o.showTotal&&o.orientation!=u.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!o.customLegend,labels:{usePointStyle:!0}},indexAxis:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(A=o.yAxis)||void 0===A?void 0:A.title:null===(b=o.xAxis)||void 0===b?void 0:b.title),text:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(h=o.yAxis)||void 0===h?void 0:h.title:null===(y=o.xAxis)||void 0===y?void 0:y.title,color:null!==(C=o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(R=o.yAxis)||void 0===R?void 0:R.titleColor:null===(T=o.xAxis)||void 0===T?void 0:T.titleColor)&&void 0!==C?C:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(I=null==o?void 0:o.showGridLines)||void 0===I?void 0:I.x)||(null===(f=null==o?void 0:o.showGridLines)||void 0===f?void 0:f.x)),color:s.COLORS.background.base},ticks:{fontSize:s.FONTS.caption.fontSize,color:null!==(j=o.yAxis.labelColor)&&void 0!==j?j:s.COLORS.content.secondary,callback:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?o.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0},stacked:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(N=o.yAxis)||void 0===N?void 0:N.stacked)||(null===(S=o.yAxis)||void 0===S?void 0:S.stacked):"boolean"!=typeof(null===(m=o.xAxis)||void 0===m?void 0:m.stacked)||(null===(L=o.xAxis)||void 0===L?void 0:L.stacked)},y:Object.assign(Object.assign({},(null===(H=null==o?void 0:o.equalHeight)||void 0===H?void 0:H.flag)?{suggestedMin:-(null==o?void 0:o.equalHeight.max),suggestedMax:null==o?void 0:o.equalHeight.max}:{}),{title:{display:!!(o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(E=o.xAxis)||void 0===E?void 0:E.title:null===(k=o.yAxis)||void 0===k?void 0:k.title),text:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(F=o.xAxis)||void 0===F?void 0:F.title:null===(P=o.yAxis)||void 0===P?void 0:P.title,color:null!==(B=o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(_=o.xAxis)||void 0===_?void 0:_.titleColor:null===(G=o.yAxis)||void 0===G?void 0:G.titleColor)&&void 0!==B?B:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:o.orientation!==u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(w=null==o?void 0:o.showGridLines)||void 0===w?void 0:w.y)||(null===(D=null==o?void 0:o.showGridLines)||void 0===D?void 0:D.y)),color:s.COLORS.background.base},ticks:Object.assign(Object.assign({stepSize:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(q=o.xAxis)||void 0===q?void 0:q.stepSize:null===(Z=o.yAxis)||void 0===Z?void 0:Z.stepSize,fontSize:s.FONTS.caption.fontSize,color:null!==(z=o.xAxis.labelColor)&&void 0!==z?z:s.COLORS.content.secondary},oe?{min:0,max:2e3,stepSize:200}:{}),{callback:o.orientation!==u.GRAPH_ORIENTATION.VERTICAL?o.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0}),stacked:o.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(M=o.xAxis)||void 0===M?void 0:M.stacked)||(null===(W=o.xAxis)||void 0===W?void 0:W.stacked):"boolean"!=typeof(null===(V=o.yAxis)||void 0===V?void 0:V.stacked)||(null===(Y=o.yAxis)||void 0===Y?void 0:Y.stacked)})},onClick:(e,t)=>{if(!o.onBarClick)return;const i=t[0].datasetIndex,a=t[0].index,l=e.chart.data.datasets[i].label,n=e.chart.data.labels[a];o.onBarClick(n,l)},onHover:(e,t)=>{o.onBarClick&&t.length&&(e.native.target.style.cursor="pointer")}};o.orientation&&o.orientation!==u.GRAPH_ORIENTATION.VERTICAL?delete ce.scales.y.ticks.callback:delete ce.scales.x.ticks.callback;const ue={labels:re,datasets:oe?[{data:te,backgroundColor:"rgba(0,0,0,0)"}]:de},ve={labels:o.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:oe?[{data:te,backgroundColor:"rgba(0,0,0,0)"}]:se},Oe=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return e.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:o.allowChartPopup&&!t?"flex-start":"flex-end",flexWrap:"wrap"}},{children:de.map((t=>e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[e.jsx("div",{style:{backgroundColor:t.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),e.jsx(r.BodyTiny,Object.assign({color:s.COLORS.content.secondary},{children:t.label}))]}),t.label.replace(" ","_"))))}))};return e.jsxs(v.GraphContainerWrapper,Object.assign({style:null!==(J=o.wrapperStyle)&&void 0!==J?J:{},padding:o.outerPadding,customLegend:o.customLegend},{children:[o.chartHeading&&e.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:o.hideHeading?"flex-end":"space-between"}},{children:[!0!==o.hideHeading&&e.jsx(r.TitleRegular,Object.assign({color:null!==(K=o.chartHeading.color)&&void 0!==K?K:s.COLORS.content.secondary},{children:o.chartHeading.heading})),o.allowChartPopup&&e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:e.jsx("div",{children:e.jsx(n.IconButton,{Icon:t.default,onClick:()=>{ee(!0)}})})}))]})),o.customLegend&&Oe(),e.jsx("div",Object.assign({className:"graph__wrapper"},{children:e.jsx("div",Object.assign({style:{height:null!==(Q=o.graphCanvasHeight)&&void 0!==Q?Q:500,width:null!==(U=o.graphCanvasWidth)&&void 0!==U?U:"auto"}},{children:e.jsx(l.Bar,{options:ce,data:ue})}))})),$&&e.jsx(d.StyledModal,Object.assign({open:$,onClose:()=>ee(!1),closeOnOutsideClick:!0,headingTitle:null===(X=o.chartHeading)||void 0===X?void 0:X.heading,width:"85%"},{children:e.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[o.customLegend&&Oe(!0),e.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:e.jsx(l.Bar,{options:ce,data:ve})}))]}))}))]}))};
@@ -77,5 +77,8 @@ export interface StackedBarGraphI {
77
77
  max: number;
78
78
  };
79
79
  barPercentage?: number;
80
- addBarGap?: boolean;
80
+ addBarGap?: {
81
+ flag: boolean;
82
+ value: number;
83
+ };
81
84
  }
@@ -1 +1 @@
1
- import{jsxs as o,jsx as t}from"react/jsx-runtime";import i from"../../../../assets/icons/maximize.svg.js";import{Chart as e,CategoryScale as a,LinearScale as l,BarElement as n,Tooltip as d,Legend as s}from"chart.js";import r from"chartjs-plugin-datalabels";import{useState as c,useMemo as u}from"react";import{Bar as v}from"react-chartjs-2";import{IconButton as p}from"../../../icon-button/IconButton.js";import{StyledModal as g}from"../../../modals/styledModal.js";import{TitleRegular as b,BodyTiny as x}from"../../../TypographyStyle.js";import{COLORS as h,FONTS as m}from"../../../../constants/Theme.js";import{truncateValueForInternationalStore as y,truncateValueForIndianStore as f}from"../utils/calcPercentage.js";import{COLOR_SCHEMA as O,GRAPH_ORIENTATION as A}from"./StackedBarChart.model.js";import{GraphContainerWrapper as C}from"./StackedBarChart.styles.js";e.register(a,l,n,d,s,r);const k=e=>{var a,l,n,d,s,r,k,j,L,F,S,H,T,I,R,E,w,D,N,B,Z,z,P,G,W,_,q,M,V,Y,J,K,Q,U,X,$,oo,to,io,eo,ao;const[lo,no]=c(!1),so=[250,1e3,800,1500,300,600],ro=0===e.yAxis.data.length,co=void 0===e.customColourScaleBrand&&void 0===e.customColourScalePastel?e.colorSchema===O.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:e.colorSchema===O.PASTEL?e.customColourScalePastel:e.customColourScaleBrand,uo=e.customHoverColour,vo=u((()=>Object.assign(Object.assign({barPercentage:(null==e?void 0:e.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:e.barWidth,borderRadius:(null==e?void 0:e.borderRadius)||void 0},"object"==typeof(null==e?void 0:e.borderRadius)?{borderSkipped:!1}:{}),(null==e?void 0:e.addBarGap)?{borderWidth:{top:5,bottom:5,right:0,left:0},borderColor:"transparent"}:{})),[e.barWidth,null==e?void 0:e.borderRadius,null==e?void 0:e.barPercentage]),po={};e.yAxis.data.map((o=>{o.map((o=>{po[o.name]?po[o.name].push(o.value):po[o.name]=[o.value]}))}));const go=Object.keys(po).map(((o,t)=>Object.assign({label:o,data:po[o],backgroundColor:null==co?void 0:co[t],hoverBackgroundColor:void 0===uo?void 0:uo[t]},vo)));let bo=e.xAxis.data.map((o=>"string"==typeof o?o:o.name)),xo=go;if(e.truncateBars){const o=((o,t,i)=>{if(t.length<=i)return{truncatedData:o,truncatedLabels:t,originalData:o,originalLabels:t};const e=o.map((o=>o.slice(0,i))),a=o.map((o=>o.slice(i).reduce(((o,t)=>o+t),0)));e.forEach(((o,t)=>o.push(a[t])));const l=t.slice(0,i);return l.push("Others"),{truncatedData:e,truncatedLabels:l,originalData:o,originalLabels:t}})(go.map((o=>o.data)),bo,e.truncateBars);go.forEach(((t,i)=>t.data=o.truncatedData[i])),bo=o.truncatedLabels,xo=o.originalData.map(((o,t)=>Object.assign(Object.assign({},go[t]),{data:o})))}const ho={plugins:{legend:{display:!ro&&!e.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!ro,callbacks:{label:null===(a=e.tooltipConfig)||void 0===a?void 0:a.labelCallback,footer:null===(l=e.tooltipConfig)||void 0===l?void 0:l.footerCallback},footerFont:null===(d=null===(n=e.tooltipConfig)||void 0===n?void 0:n.footerStyles)||void 0===d?void 0:d.footerFont},datalabels:{display:null!==(s=e.showTotal)&&void 0!==s&&s,anchor:"end",align:"end",clamp:!0,formatter:(o,t)=>{var i;const e=t.datasetIndex,a=t.chart.data.datasets;if(e!==a.length-1)return"";const l=t.dataIndex;let n=0;for(let o=0;o<a.length;o++)n+=null!==(i=a[o].data[l])&&void 0!==i?i:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:h.content.secondary}},layout:{padding:{right:e.showTotal&&e.orientation===A.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=A.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!e.customLegend,labels:{usePointStyle:!0}},indexAxis:e.orientation===A.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(e.orientation===A.HORIZONTAL?null===(r=e.yAxis)||void 0===r?void 0:r.title:null===(k=e.xAxis)||void 0===k?void 0:k.title),text:e.orientation===A.HORIZONTAL?null===(j=e.yAxis)||void 0===j?void 0:j.title:null===(L=e.xAxis)||void 0===L?void 0:L.title,color:null!==(H=e.orientation===A.HORIZONTAL?null===(F=e.yAxis)||void 0===F?void 0:F.titleColor:null===(S=e.xAxis)||void 0===S?void 0:S.titleColor)&&void 0!==H?H:h.content.secondary,font:{size:m.caption.fontSize}},grid:{display:e.orientation===A.HORIZONTAL&&(void 0===(null===(T=null==e?void 0:e.showGridLines)||void 0===T?void 0:T.x)||(null===(I=null==e?void 0:e.showGridLines)||void 0===I?void 0:I.x)),color:h.background.base},ticks:{fontSize:m.caption.fontSize,color:null!==(R=e.yAxis.labelColor)&&void 0!==R?R:h.content.secondary,callback:e.orientation===A.HORIZONTAL?e.isInternationalStore?y:f:void 0},stacked:e.orientation===A.HORIZONTAL?"boolean"!=typeof(null===(E=e.yAxis)||void 0===E?void 0:E.stacked)||(null===(w=e.yAxis)||void 0===w?void 0:w.stacked):"boolean"!=typeof(null===(D=e.xAxis)||void 0===D?void 0:D.stacked)||(null===(N=e.xAxis)||void 0===N?void 0:N.stacked)},y:Object.assign(Object.assign({},(null===(B=null==e?void 0:e.equalHeight)||void 0===B?void 0:B.flag)?{suggestedMin:-(null==e?void 0:e.equalHeight.max),suggestedMax:null==e?void 0:e.equalHeight.max}:{}),{title:{display:!!(e.orientation===A.HORIZONTAL?null===(Z=e.xAxis)||void 0===Z?void 0:Z.title:null===(z=e.yAxis)||void 0===z?void 0:z.title),text:e.orientation===A.HORIZONTAL?null===(P=e.xAxis)||void 0===P?void 0:P.title:null===(G=e.yAxis)||void 0===G?void 0:G.title,color:null!==(q=e.orientation===A.HORIZONTAL?null===(W=e.xAxis)||void 0===W?void 0:W.titleColor:null===(_=e.yAxis)||void 0===_?void 0:_.titleColor)&&void 0!==q?q:h.content.secondary,font:{size:m.caption.fontSize}},grid:{display:e.orientation!==A.HORIZONTAL&&(void 0===(null===(M=null==e?void 0:e.showGridLines)||void 0===M?void 0:M.y)||(null===(V=null==e?void 0:e.showGridLines)||void 0===V?void 0:V.y)),color:h.background.base},ticks:Object.assign(Object.assign({stepSize:e.orientation===A.HORIZONTAL?null===(Y=e.xAxis)||void 0===Y?void 0:Y.stepSize:null===(J=e.yAxis)||void 0===J?void 0:J.stepSize,fontSize:m.caption.fontSize,color:null!==(K=e.xAxis.labelColor)&&void 0!==K?K:h.content.secondary},ro?{min:0,max:2e3,stepSize:200}:{}),{callback:e.orientation!==A.VERTICAL?e.isInternationalStore?y:f:void 0}),stacked:e.orientation===A.HORIZONTAL?"boolean"!=typeof(null===(Q=e.xAxis)||void 0===Q?void 0:Q.stacked)||(null===(U=e.xAxis)||void 0===U?void 0:U.stacked):"boolean"!=typeof(null===(X=e.yAxis)||void 0===X?void 0:X.stacked)||(null===($=e.yAxis)||void 0===$?void 0:$.stacked)})},onClick:(o,t)=>{if(!e.onBarClick)return;const i=t[0].datasetIndex,a=t[0].index,l=o.chart.data.datasets[i].label,n=o.chart.data.labels[a];e.onBarClick(n,l)},onHover:(o,t)=>{e.onBarClick&&t.length&&(o.native.target.style.cursor="pointer")}};e.orientation&&e.orientation!==A.VERTICAL?delete ho.scales.y.ticks.callback:delete ho.scales.x.ticks.callback;const mo={labels:bo,datasets:ro?[{data:so,backgroundColor:"rgba(0,0,0,0)"}]:go},yo={labels:e.xAxis.data.map((o=>"string"==typeof o?o:o.name)),datasets:ro?[{data:so,backgroundColor:"rgba(0,0,0,0)"}]:xo},fo=function(){let i=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return t("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:e.allowChartPopup&&!i?"flex-start":"flex-end"}},{children:go.map((i=>o("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[t("div",{style:{backgroundColor:i.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),t(x,Object.assign({color:h.content.secondary},{children:i.label}))]}),i.label.replace(" ","_"))))}))};return o(C,Object.assign({style:null!==(oo=e.wrapperStyle)&&void 0!==oo?oo:{},padding:e.outerPadding,customLegend:e.customLegend},{children:[e.chartHeading&&o("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:e.hideHeading?"flex-end":"space-between"}},{children:[!0!==e.hideHeading&&t(b,Object.assign({color:null!==(to=e.chartHeading.color)&&void 0!==to?to:h.content.secondary},{children:e.chartHeading.heading})),e.allowChartPopup&&t("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:t("div",{children:t(p,{Icon:i,onClick:()=>{no(!0)}})})}))]})),e.customLegend&&fo(),t("div",Object.assign({className:"graph__wrapper"},{children:t("div",Object.assign({style:{height:null!==(io=e.graphCanvasHeight)&&void 0!==io?io:500,width:null!==(eo=e.graphCanvasWidth)&&void 0!==eo?eo:"auto"}},{children:t(v,{options:ho,data:mo})}))})),lo&&t(g,Object.assign({open:lo,onClose:()=>no(!1),closeOnOutsideClick:!0,headingTitle:null===(ao=e.chartHeading)||void 0===ao?void 0:ao.heading,width:"85%"},{children:o("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[e.customLegend&&fo(!0),t("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:t(v,{options:ho,data:yo})}))]}))}))]}))};export{k as StackedBarChart};
1
+ import{jsxs as o,jsx as i}from"react/jsx-runtime";import t from"../../../../assets/icons/maximize.svg.js";import{Chart as e,CategoryScale as a,LinearScale as l,BarElement as n,Tooltip as d,Legend as s}from"chart.js";import r from"chartjs-plugin-datalabels";import{useState as c,useMemo as u}from"react";import{Bar as v}from"react-chartjs-2";import{IconButton as p}from"../../../icon-button/IconButton.js";import{StyledModal as g}from"../../../modals/styledModal.js";import{TitleRegular as b,BodyTiny as x}from"../../../TypographyStyle.js";import{COLORS as h,FONTS as m}from"../../../../constants/Theme.js";import{truncateValueForInternationalStore as y,truncateValueForIndianStore as f}from"../utils/calcPercentage.js";import{COLOR_SCHEMA as O,GRAPH_ORIENTATION as A}from"./StackedBarChart.model.js";import{GraphContainerWrapper as C}from"./StackedBarChart.styles.js";e.register(a,l,n,d,s,r);const k=e=>{var a,l,n,d,s,r,k,j,L,F,S,H,T,I,R,E,w,B,D,N,Z,z,P,G,W,_,q,M,V,Y,J,K,Q,U,X,$,oo,io,to,eo,ao;const[lo,no]=c(!1),so=[250,1e3,800,1500,300,600],ro=0===e.yAxis.data.length,co=void 0===e.customColourScaleBrand&&void 0===e.customColourScalePastel?e.colorSchema===O.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:e.colorSchema===O.PASTEL?e.customColourScalePastel:e.customColourScaleBrand,uo=e.customHoverColour,vo=u((()=>{var o,i,t;return Object.assign(Object.assign({barPercentage:(null==e?void 0:e.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:e.barWidth,borderRadius:(null==e?void 0:e.borderRadius)||void 0},"object"==typeof(null==e?void 0:e.borderRadius)?{borderSkipped:!1}:{}),(null===(o=null==e?void 0:e.addBarGap)||void 0===o?void 0:o.flag)?{borderWidth:{top:(null===(i=null==e?void 0:e.addBarGap)||void 0===i?void 0:i.value)||2,bottom:(null===(t=null==e?void 0:e.addBarGap)||void 0===t?void 0:t.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[e.barWidth,null==e?void 0:e.borderRadius,null==e?void 0:e.barPercentage]),po={};e.yAxis.data.map((o=>{o.map((o=>{po[o.name]?po[o.name].push(o.value):po[o.name]=[o.value]}))}));const go=Object.keys(po).map(((o,i)=>Object.assign({label:o,data:po[o],backgroundColor:null==co?void 0:co[i],hoverBackgroundColor:void 0===uo?void 0:uo[i]},vo)));let bo=e.xAxis.data.map((o=>"string"==typeof o?o:o.name)),xo=go;if(e.truncateBars){const o=((o,i,t)=>{if(i.length<=t)return{truncatedData:o,truncatedLabels:i,originalData:o,originalLabels:i};const e=o.map((o=>o.slice(0,t))),a=o.map((o=>o.slice(t).reduce(((o,i)=>o+i),0)));e.forEach(((o,i)=>o.push(a[i])));const l=i.slice(0,t);return l.push("Others"),{truncatedData:e,truncatedLabels:l,originalData:o,originalLabels:i}})(go.map((o=>o.data)),bo,e.truncateBars);go.forEach(((i,t)=>i.data=o.truncatedData[t])),bo=o.truncatedLabels,xo=o.originalData.map(((o,i)=>Object.assign(Object.assign({},go[i]),{data:o})))}const ho={plugins:{legend:{display:!ro&&!e.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!ro,callbacks:{label:null===(a=e.tooltipConfig)||void 0===a?void 0:a.labelCallback,footer:null===(l=e.tooltipConfig)||void 0===l?void 0:l.footerCallback},footerFont:null===(d=null===(n=e.tooltipConfig)||void 0===n?void 0:n.footerStyles)||void 0===d?void 0:d.footerFont},datalabels:{display:null!==(s=e.showTotal)&&void 0!==s&&s,anchor:"end",align:"end",clamp:!0,formatter:(o,i)=>{var t;const e=i.datasetIndex,a=i.chart.data.datasets;if(e!==a.length-1)return"";const l=i.dataIndex;let n=0;for(let o=0;o<a.length;o++)n+=null!==(t=a[o].data[l])&&void 0!==t?t:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:h.content.secondary}},layout:{padding:{right:e.showTotal&&e.orientation===A.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=A.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!e.customLegend,labels:{usePointStyle:!0}},indexAxis:e.orientation===A.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(e.orientation===A.HORIZONTAL?null===(r=e.yAxis)||void 0===r?void 0:r.title:null===(k=e.xAxis)||void 0===k?void 0:k.title),text:e.orientation===A.HORIZONTAL?null===(j=e.yAxis)||void 0===j?void 0:j.title:null===(L=e.xAxis)||void 0===L?void 0:L.title,color:null!==(H=e.orientation===A.HORIZONTAL?null===(F=e.yAxis)||void 0===F?void 0:F.titleColor:null===(S=e.xAxis)||void 0===S?void 0:S.titleColor)&&void 0!==H?H:h.content.secondary,font:{size:m.caption.fontSize}},grid:{display:e.orientation===A.HORIZONTAL&&(void 0===(null===(T=null==e?void 0:e.showGridLines)||void 0===T?void 0:T.x)||(null===(I=null==e?void 0:e.showGridLines)||void 0===I?void 0:I.x)),color:h.background.base},ticks:{fontSize:m.caption.fontSize,color:null!==(R=e.yAxis.labelColor)&&void 0!==R?R:h.content.secondary,callback:e.orientation===A.HORIZONTAL?e.isInternationalStore?y:f:void 0},stacked:e.orientation===A.HORIZONTAL?"boolean"!=typeof(null===(E=e.yAxis)||void 0===E?void 0:E.stacked)||(null===(w=e.yAxis)||void 0===w?void 0:w.stacked):"boolean"!=typeof(null===(B=e.xAxis)||void 0===B?void 0:B.stacked)||(null===(D=e.xAxis)||void 0===D?void 0:D.stacked)},y:Object.assign(Object.assign({},(null===(N=null==e?void 0:e.equalHeight)||void 0===N?void 0:N.flag)?{suggestedMin:-(null==e?void 0:e.equalHeight.max),suggestedMax:null==e?void 0:e.equalHeight.max}:{}),{title:{display:!!(e.orientation===A.HORIZONTAL?null===(Z=e.xAxis)||void 0===Z?void 0:Z.title:null===(z=e.yAxis)||void 0===z?void 0:z.title),text:e.orientation===A.HORIZONTAL?null===(P=e.xAxis)||void 0===P?void 0:P.title:null===(G=e.yAxis)||void 0===G?void 0:G.title,color:null!==(q=e.orientation===A.HORIZONTAL?null===(W=e.xAxis)||void 0===W?void 0:W.titleColor:null===(_=e.yAxis)||void 0===_?void 0:_.titleColor)&&void 0!==q?q:h.content.secondary,font:{size:m.caption.fontSize}},grid:{display:e.orientation!==A.HORIZONTAL&&(void 0===(null===(M=null==e?void 0:e.showGridLines)||void 0===M?void 0:M.y)||(null===(V=null==e?void 0:e.showGridLines)||void 0===V?void 0:V.y)),color:h.background.base},ticks:Object.assign(Object.assign({stepSize:e.orientation===A.HORIZONTAL?null===(Y=e.xAxis)||void 0===Y?void 0:Y.stepSize:null===(J=e.yAxis)||void 0===J?void 0:J.stepSize,fontSize:m.caption.fontSize,color:null!==(K=e.xAxis.labelColor)&&void 0!==K?K:h.content.secondary},ro?{min:0,max:2e3,stepSize:200}:{}),{callback:e.orientation!==A.VERTICAL?e.isInternationalStore?y:f:void 0}),stacked:e.orientation===A.HORIZONTAL?"boolean"!=typeof(null===(Q=e.xAxis)||void 0===Q?void 0:Q.stacked)||(null===(U=e.xAxis)||void 0===U?void 0:U.stacked):"boolean"!=typeof(null===(X=e.yAxis)||void 0===X?void 0:X.stacked)||(null===($=e.yAxis)||void 0===$?void 0:$.stacked)})},onClick:(o,i)=>{if(!e.onBarClick)return;const t=i[0].datasetIndex,a=i[0].index,l=o.chart.data.datasets[t].label,n=o.chart.data.labels[a];e.onBarClick(n,l)},onHover:(o,i)=>{e.onBarClick&&i.length&&(o.native.target.style.cursor="pointer")}};e.orientation&&e.orientation!==A.VERTICAL?delete ho.scales.y.ticks.callback:delete ho.scales.x.ticks.callback;const mo={labels:bo,datasets:ro?[{data:so,backgroundColor:"rgba(0,0,0,0)"}]:go},yo={labels:e.xAxis.data.map((o=>"string"==typeof o?o:o.name)),datasets:ro?[{data:so,backgroundColor:"rgba(0,0,0,0)"}]:xo},fo=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return i("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:e.allowChartPopup&&!t?"flex-start":"flex-end",flexWrap:"wrap"}},{children:go.map((t=>o("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[i("div",{style:{backgroundColor:t.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),i(x,Object.assign({color:h.content.secondary},{children:t.label}))]}),t.label.replace(" ","_"))))}))};return o(C,Object.assign({style:null!==(oo=e.wrapperStyle)&&void 0!==oo?oo:{},padding:e.outerPadding,customLegend:e.customLegend},{children:[e.chartHeading&&o("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:e.hideHeading?"flex-end":"space-between"}},{children:[!0!==e.hideHeading&&i(b,Object.assign({color:null!==(io=e.chartHeading.color)&&void 0!==io?io:h.content.secondary},{children:e.chartHeading.heading})),e.allowChartPopup&&i("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:i("div",{children:i(p,{Icon:t,onClick:()=>{no(!0)}})})}))]})),e.customLegend&&fo(),i("div",Object.assign({className:"graph__wrapper"},{children:i("div",Object.assign({style:{height:null!==(to=e.graphCanvasHeight)&&void 0!==to?to:500,width:null!==(eo=e.graphCanvasWidth)&&void 0!==eo?eo:"auto"}},{children:i(v,{options:ho,data:mo})}))})),lo&&i(g,Object.assign({open:lo,onClose:()=>no(!1),closeOnOutsideClick:!0,headingTitle:null===(ao=e.chartHeading)||void 0===ao?void 0:ao.heading,width:"85%"},{children:o("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[e.customLegend&&fo(!0),i("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:i(v,{options:ho,data:yo})}))]}))}))]}))};export{k as StackedBarChart};
@@ -77,5 +77,8 @@ export interface StackedBarGraphI {
77
77
  max: number;
78
78
  };
79
79
  barPercentage?: number;
80
- addBarGap?: boolean;
80
+ addBarGap?: {
81
+ flag: boolean;
82
+ value: number;
83
+ };
81
84
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.640-beta.3",
3
+ "version": "0.0.640-beta.5",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",