@bikdotai/bik-component-library 0.0.455-analyticsv3-05 → 0.0.455-analyticsv3-06
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -1
- package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts +1 -0
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -1
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts +1 -0
- package/package.json +1 -1
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),i=require("react-chartjs-2"),o=require("../../../TypographyStyle.js"),a=require("../../../../constants/Theme.js"),n=require("./StackedBarChart.model.js"),l=require("./StackedBarChart.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip,t.Legend);exports.StackedBarChart=t=>{var r,s,d,c,O,A,u,v,x,R,g,p,T,y,C,N,S,F,I
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),i=require("react-chartjs-2"),o=require("../../../TypographyStyle.js"),a=require("../../../../constants/Theme.js"),n=require("./StackedBarChart.model.js"),l=require("./StackedBarChart.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip,t.Legend);exports.StackedBarChart=t=>{var r,s,d,c,O,A,u,v,x,R,g,p,T,y,C,N,S,F,h,I;const b=0===t.yAxis.data.length,E=t.colorSchema===n.COLOR_SCHEMA.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],H={barPercentage:.4,categoryPercentage:1,borderRadius:{topLeft:4,topRight:4,bottomLeft:4,bottomRight:4},pointStyle:"circle",barWidth:t.barWidth},L={};t.yAxis.data.map((e=>{e.map((e=>{L[e.name]?L[e.name].push(e.value):L[e.name]=[e.value]}))}));const j=Object.keys(L).map(((e,t)=>Object.assign({label:e,data:L[e],backgroundColor:E[t]},H))),m={plugins:{legend:{display:!b,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!b}},responsive:!0,maintainAspectRatio:!1,legend:{display:!0,labels:{usePointStyle:!0}},indexAxis:t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?null===(r=t.yAxis)||void 0===r?void 0:r.title:null===(s=t.xAxis)||void 0===s?void 0:s.title),text:t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?null===(d=t.yAxis)||void 0===d?void 0:d.title:null===(c=t.xAxis)||void 0===c?void 0:c.title,color:null!==(u=t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?null===(O=t.yAxis)||void 0===O?void 0:O.titleColor:null===(A=t.xAxis)||void 0===A?void 0:A.titleColor)&&void 0!==u?u:a.COLORS.content.secondary,font:{size:a.FONTS.caption.fontSize}},grid:{display:t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL,color:a.COLORS.background.base},ticks:{fontSize:a.FONTS.caption.fontSize,color:null!==(v=t.yAxis.labelColor)&&void 0!==v?v:a.COLORS.content.secondary},stacked:!0},y:{title:{display:!!(t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?null===(x=t.xAxis)||void 0===x?void 0:x.title:null===(R=t.yAxis)||void 0===R?void 0:R.title),text:t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?null===(g=t.xAxis)||void 0===g?void 0:g.title:null===(p=t.yAxis)||void 0===p?void 0:p.title,color:null!==(C=t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?null===(T=t.xAxis)||void 0===T?void 0:T.titleColor:null===(y=t.yAxis)||void 0===y?void 0:y.titleColor)&&void 0!==C?C:a.COLORS.content.secondary,font:{size:a.FONTS.caption.fontSize}},grid:{display:t.orientation!==n.GRAPH_ORIENTATION.HORIZONTAL,color:a.COLORS.background.base},ticks:Object.assign({stepSize:t.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?null===(N=t.xAxis)||void 0===N?void 0:N.stepSize:null===(S=t.yAxis)||void 0===S?void 0:S.stepSize,fontSize:a.FONTS.caption.fontSize,color:null!==(F=t.xAxis.labelColor)&&void 0!==F?F:a.COLORS.content.secondary},b?{min:0,max:2e3,stepSize:200}:{}),stacked:!0}},onClick:(e,i)=>{if(!t.onBarClick)return;const o=i[0].datasetIndex,a=i[0].index,n=e.chart.data.datasets[o].label,l=e.chart.data.labels[a];t.onBarClick(l,n)},onHover:(e,i)=>{t.onBarClick&&i.length&&(e.native.target.style.cursor="pointer")}},P={labels:t.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:b?[{data:[250,1e3,800,1500,300,600],backgroundColor:"rgba(0,0,0,0)"}]:j};return e.jsxs(l.GraphContainerWrapper,Object.assign({padding:t.outerPadding},{children:[t.chartHeading&&e.jsx("div",Object.assign({style:{marginBottom:24}},{children:e.jsx(o.TitleRegular,Object.assign({color:null!==(h=t.chartHeading.color)&&void 0!==h?h:a.COLORS.content.secondary},{children:t.chartHeading.heading}))})),e.jsx("div",Object.assign({style:{height:null!==(I=t.graphCanvasHeight)&&void 0!==I?I:500}},{children:e.jsx(i.Bar,{options:m,data:P})}))]}))};
|
package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as t,jsx as i}from"react/jsx-runtime";import{Chart as o,CategoryScale as e,LinearScale as n,BarElement as a,Tooltip as l,Legend as r}from"chart.js";import{Bar as s}from"react-chartjs-2";import{TitleRegular as d}from"../../../TypographyStyle.js";import{COLORS as c,FONTS as v}from"../../../../constants/Theme.js";import{COLOR_SCHEMA as p,GRAPH_ORIENTATION as x}from"./StackedBarChart.model.js";import{GraphContainerWrapper as g}from"./StackedBarChart.styles.js";o.register(e,n,a,l,r);const u=o=>{var e,n,a,l,r,u,y,A,m,F,
|
|
1
|
+
import{jsxs as t,jsx as i}from"react/jsx-runtime";import{Chart as o,CategoryScale as e,LinearScale as n,BarElement as a,Tooltip as l,Legend as r}from"chart.js";import{Bar as s}from"react-chartjs-2";import{TitleRegular as d}from"../../../TypographyStyle.js";import{COLORS as c,FONTS as v}from"../../../../constants/Theme.js";import{COLOR_SCHEMA as p,GRAPH_ORIENTATION as x}from"./StackedBarChart.model.js";import{GraphContainerWrapper as g}from"./StackedBarChart.styles.js";o.register(e,n,a,l,r);const u=o=>{var e,n,a,l,r,u,y,A,m,b,F,h,O,C,f,S,E,k,H,j;const R=0===o.yAxis.data.length,z=o.colorSchema===p.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],L={barPercentage:.4,categoryPercentage:1,borderRadius:{topLeft:4,topRight:4,bottomLeft:4,bottomRight:4},pointStyle:"circle",barWidth:o.barWidth},T={};o.yAxis.data.map((t=>{t.map((t=>{T[t.name]?T[t.name].push(t.value):T[t.name]=[t.value]}))}));const I=Object.keys(T).map(((t,i)=>Object.assign({label:t,data:T[t],backgroundColor:z[i]},L))),D={plugins:{legend:{display:!R,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!R}},responsive:!0,maintainAspectRatio:!1,legend:{display:!0,labels:{usePointStyle:!0}},indexAxis:o.orientation===x.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(o.orientation===x.HORIZONTAL?null===(e=o.yAxis)||void 0===e?void 0:e.title:null===(n=o.xAxis)||void 0===n?void 0:n.title),text:o.orientation===x.HORIZONTAL?null===(a=o.yAxis)||void 0===a?void 0:a.title:null===(l=o.xAxis)||void 0===l?void 0:l.title,color:null!==(y=o.orientation===x.HORIZONTAL?null===(r=o.yAxis)||void 0===r?void 0:r.titleColor:null===(u=o.xAxis)||void 0===u?void 0:u.titleColor)&&void 0!==y?y:c.content.secondary,font:{size:v.caption.fontSize}},grid:{display:o.orientation===x.HORIZONTAL,color:c.background.base},ticks:{fontSize:v.caption.fontSize,color:null!==(A=o.yAxis.labelColor)&&void 0!==A?A:c.content.secondary},stacked:!0},y:{title:{display:!!(o.orientation===x.HORIZONTAL?null===(m=o.xAxis)||void 0===m?void 0:m.title:null===(b=o.yAxis)||void 0===b?void 0:b.title),text:o.orientation===x.HORIZONTAL?null===(F=o.xAxis)||void 0===F?void 0:F.title:null===(h=o.yAxis)||void 0===h?void 0:h.title,color:null!==(f=o.orientation===x.HORIZONTAL?null===(O=o.xAxis)||void 0===O?void 0:O.titleColor:null===(C=o.yAxis)||void 0===C?void 0:C.titleColor)&&void 0!==f?f:c.content.secondary,font:{size:v.caption.fontSize}},grid:{display:o.orientation!==x.HORIZONTAL,color:c.background.base},ticks:Object.assign({stepSize:o.orientation===x.HORIZONTAL?null===(S=o.xAxis)||void 0===S?void 0:S.stepSize:null===(E=o.yAxis)||void 0===E?void 0:E.stepSize,fontSize:v.caption.fontSize,color:null!==(k=o.xAxis.labelColor)&&void 0!==k?k:c.content.secondary},R?{min:0,max:2e3,stepSize:200}:{}),stacked:!0}},onClick:(t,i)=>{if(!o.onBarClick)return;const e=i[0].datasetIndex,n=i[0].index,a=t.chart.data.datasets[e].label,l=t.chart.data.labels[n];o.onBarClick(l,a)},onHover:(t,i)=>{o.onBarClick&&i.length&&(t.native.target.style.cursor="pointer")}},N={labels:o.xAxis.data.map((t=>"string"==typeof t?t:t.name)),datasets:R?[{data:[250,1e3,800,1500,300,600],backgroundColor:"rgba(0,0,0,0)"}]:I};return t(g,Object.assign({padding:o.outerPadding},{children:[o.chartHeading&&i("div",Object.assign({style:{marginBottom:24}},{children:i(d,Object.assign({color:null!==(H=o.chartHeading.color)&&void 0!==H?H:c.content.secondary},{children:o.chartHeading.heading}))})),i("div",Object.assign({style:{height:null!==(j=o.graphCanvasHeight)&&void 0!==j?j:500}},{children:i(s,{options:D,data:N})}))]}))};export{u as StackedBarChart};
|