@bikdotai/bik-component-library 0.0.718-beta.14 → 0.0.718-beta.15
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/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js +1 -1
- package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.d.ts +1 -0
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js +1 -1
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../node_modules/react/jsx-runtime.js"),i=require("chart.js"),t=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../node_modules/react/jsx-runtime.js"),i=require("chart.js"),t=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),n=require("../../../../constants/Theme.js"),o=require("../LineChart/LineChart.styled.js"),s=require("../utils/calcPercentage.js"),a=require("./VerticalBarAndLinearGraph.styles.js");i.Chart.register(i.CategoryScale,i.LinearScale,i.BarElement,i.Tooltip);exports.VerticalBarAndLinearGraph=i=>{var l,x,d,c,p,u;const g=[0,0,0,0,0,0],b=-1===i.barAxis.data.findIndex((e=>0!==e)),j=-1===i.lineAxis.data.findIndex((e=>0!==e)),h=!i.lineAxis2||-1===i.lineAxis2.data.findIndex((e=>0!==e)),A={min:0,max:2e3,stepSize:200},S=[{legend:i.barAxis.title,color:i.barAxis.graphColor},{legend:i.lineAxis.title,color:i.lineAxis.graphColor},...i.lineAxis2?[{legend:i.lineAxis2.title,color:i.lineAxis2.graphColor}]:[]],y={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!i.xAxis.title,text:i.xAxis.title,color:i.xAxis.titleColor,font:{size:n.FONTS.caption.fontSize}},grid:{display:!1,borderColor:n.COLORS.background.base},ticks:{fontSize:n.FONTS.caption.fontSize,color:null!==(l=i.xAxis.labelColor)&&void 0!==l?l:n.COLORS.content.secondary,callback:(null===(x=i.xAxis)||void 0===x?void 0:x.axisSuffix)?e=>`${e}${i.xAxis.axisSuffix}`:void 0}},bar:{position:"left",title:{display:!!i.barAxis.title,text:i.barAxis.title,color:i.barAxis.titleColor,font:{size:n.FONTS.caption.fontSize}},grid:{borderColor:"white",color:n.COLORS.background.base},ticks:Object.assign(Object.assign({fontSize:n.FONTS.caption.fontSize,color:null!==(d=i.barAxis.labelColor)&&void 0!==d?d:n.COLORS.content.secondary},b?A:{}),{callback:e=>{var t;return`${i.isInternationalStore?s.truncateValueForInternationalStore(e):s.truncateValueForIndianStore(e)}${(null===(t=i.barAxis)||void 0===t?void 0:t.axisSuffix)||""}`}})},line:{position:"right",title:{display:!!i.lineAxis.title,text:i.lineAxis.title,color:i.lineAxis.titleColor,font:{size:n.FONTS.caption.fontSize}},grid:{display:!1,borderColor:"white",color:n.COLORS.background.base},ticks:Object.assign(Object.assign({fontSize:n.FONTS.caption.fontSize,color:null!==(c=i.lineAxis.labelColor)&&void 0!==c?c:n.COLORS.content.secondary},j?A:{}),{callback:e=>{var t;return`${i.isInternationalStore?s.truncateValueForInternationalStore(e):s.truncateValueForIndianStore(e)}${(null===(t=i.lineAxis)||void 0===t?void 0:t.axisSuffix)||""}`}}),display:!0}},maintainAspectRatio:!1},C={labels:i.xAxis.forceShowXAxis?i.xAxis.data.map((e=>e.toString())):b&&j&&h?["-","-","-","-","-","-"]:i.xAxis.data.map((e=>e.toString())),datasets:[{yAxisID:"line",type:"line",data:j?g:i.lineAxis.data,borderColor:i.lineAxis.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1},...i.lineAxis2?[{yAxisID:"line",type:"line",data:h?g:i.lineAxis2.data,borderColor:i.lineAxis2.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1}]:[],{yAxisID:"bar",type:"bar",data:b?g:i.barAxis.data,backgroundColor:i.barAxis.graphColor||"rgba(0,0,0,0)",barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:2}},{children:[i.customLegend?e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:"flex-end",flexWrap:"wrap"}},{children:S.map(((i,t)=>{let{legend:o,color:s}=i;return o?e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[e.jsxRuntimeExports.jsx("div",{style:{backgroundColor:s,width:"16px",height:"16px",borderRadius:"2px"}}),e.jsxRuntimeExports.jsx(r.BodyTiny,Object.assign({color:n.COLORS.content.secondary},{children:o}))]}),t):null}))})):e.jsxRuntimeExports.jsx(o.LegendWrapper,Object.assign({position:"center"},{children:S.map(((i,t)=>{let{legend:n,color:s}=i;return n?e.jsxRuntimeExports.jsxs(o.LegendContainer,{children:[e.jsxRuntimeExports.jsx(o.LegendColor,{color:s}),e.jsxRuntimeExports.jsx(r.SmallRegular,Object.assign({color:"#667085"},{children:n}))]},t):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})}))})),e.jsxRuntimeExports.jsxs(a.GraphContainerWrapper,{children:[i.chartHeading&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:24}},{children:e.jsxRuntimeExports.jsx(r.TitleRegular,Object.assign({color:null!==(p=i.chartHeading.color)&&void 0!==p?p:n.COLORS.content.secondary},{children:i.chartHeading.heading}))})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:null!==(u=i.graphCanvasHeight)&&void 0!==u?u:500}},{children:e.jsxRuntimeExports.jsx(t.Chart,{type:"bar",data:C,options:y})}))]})]}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as i}from"../../../../node_modules/react/jsx-runtime.js";import{Chart as e,CategoryScale as t,LinearScale as o,BarElement as r,Tooltip as
|
|
1
|
+
import{j as i}from"../../../../node_modules/react/jsx-runtime.js";import{Chart as e,CategoryScale as t,LinearScale as o,BarElement as r,Tooltip as l}from"chart.js";import{Chart as a}from"react-chartjs-2";import{SmallRegular as s,TitleRegular as n,BodyTiny as d}from"../../../TypographyStyle.js";import{FONTS as x,COLORS as c}from"../../../../constants/Theme.js";import{LegendWrapper as p,LegendContainer as g,LegendColor as b}from"../LineChart/LineChart.styled.js";import{truncateValueForInternationalStore as f,truncateValueForIndianStore as A}from"../utils/calcPercentage.js";import{GraphContainerWrapper as h}from"./VerticalBarAndLinearGraph.styles.js";e.register(t,o,r,l);const j=e=>{var t,o,r,l,j,y;const u=[0,0,0,0,0,0],m=-1===e.barAxis.data.findIndex((i=>0!==i)),C=-1===e.lineAxis.data.findIndex((i=>0!==i)),v=!e.lineAxis2||-1===e.lineAxis2.data.findIndex((i=>0!==i)),S={min:0,max:2e3,stepSize:200},z=[{legend:e.barAxis.title,color:e.barAxis.graphColor},{legend:e.lineAxis.title,color:e.lineAxis.graphColor},...e.lineAxis2?[{legend:e.lineAxis2.title,color:e.lineAxis2.graphColor}]:[]],O={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!e.xAxis.title,text:e.xAxis.title,color:e.xAxis.titleColor,font:{size:x.caption.fontSize}},grid:{display:!1,borderColor:c.background.base},ticks:{fontSize:x.caption.fontSize,color:null!==(t=e.xAxis.labelColor)&&void 0!==t?t:c.content.secondary,callback:(null===(o=e.xAxis)||void 0===o?void 0:o.axisSuffix)?i=>`${i}${e.xAxis.axisSuffix}`:void 0}},bar:{position:"left",title:{display:!!e.barAxis.title,text:e.barAxis.title,color:e.barAxis.titleColor,font:{size:x.caption.fontSize}},grid:{borderColor:"white",color:c.background.base},ticks:Object.assign(Object.assign({fontSize:x.caption.fontSize,color:null!==(r=e.barAxis.labelColor)&&void 0!==r?r:c.content.secondary},m?S:{}),{callback:i=>{var t;return`${e.isInternationalStore?f(i):A(i)}${(null===(t=e.barAxis)||void 0===t?void 0:t.axisSuffix)||""}`}})},line:{position:"right",title:{display:!!e.lineAxis.title,text:e.lineAxis.title,color:e.lineAxis.titleColor,font:{size:x.caption.fontSize}},grid:{display:!1,borderColor:"white",color:c.background.base},ticks:Object.assign(Object.assign({fontSize:x.caption.fontSize,color:null!==(l=e.lineAxis.labelColor)&&void 0!==l?l:c.content.secondary},C?S:{}),{callback:i=>{var t;return`${e.isInternationalStore?f(i):A(i)}${(null===(t=e.lineAxis)||void 0===t?void 0:t.axisSuffix)||""}`}}),display:!0}},maintainAspectRatio:!1},k={labels:e.xAxis.forceShowXAxis?e.xAxis.data.map((i=>i.toString())):m&&C&&v?["-","-","-","-","-","-"]:e.xAxis.data.map((i=>i.toString())),datasets:[{yAxisID:"line",type:"line",data:C?u:e.lineAxis.data,borderColor:e.lineAxis.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1},...e.lineAxis2?[{yAxisID:"line",type:"line",data:v?u:e.lineAxis2.data,borderColor:e.lineAxis2.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1}]:[],{yAxisID:"bar",type:"bar",data:m?u:e.barAxis.data,backgroundColor:e.barAxis.graphColor||"rgba(0,0,0,0)",barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return i.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:2}},{children:[e.customLegend?i.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:"flex-end",flexWrap:"wrap"}},{children:z.map(((e,t)=>{let{legend:o,color:r}=e;return o?i.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[i.jsx("div",{style:{backgroundColor:r,width:"16px",height:"16px",borderRadius:"2px"}}),i.jsx(d,Object.assign({color:c.content.secondary},{children:o}))]}),t):null}))})):i.jsx(p,Object.assign({position:"center"},{children:z.map(((e,t)=>{let{legend:o,color:r}=e;return o?i.jsxs(g,{children:[i.jsx(b,{color:r}),i.jsx(s,Object.assign({color:"#667085"},{children:o}))]},t):i.jsx(i.Fragment,{})}))})),i.jsxs(h,{children:[e.chartHeading&&i.jsx("div",Object.assign({style:{marginBottom:24}},{children:i.jsx(n,Object.assign({color:null!==(j=e.chartHeading.color)&&void 0!==j?j:c.content.secondary},{children:e.chartHeading.heading}))})),i.jsx("div",Object.assign({style:{height:null!==(y=e.graphCanvasHeight)&&void 0!==y?y:500}},{children:i.jsx(a,{type:"bar",data:k,options:O})}))]})]}))};export{j as VerticalBarAndLinearGraph};
|