@bikdotai/bik-component-library 0.0.718-beta.12 → 0.0.718-beta.14

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("../../../../node_modules/react/jsx-runtime.js"),i=require("chart.js"),t=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),s=require("../LineChart/LineChart.styled.js"),a=require("./VerticalBarAndLinearGraph.styles.js");i.Chart.register(i.CategoryScale,i.LinearScale,i.BarElement,i.Tooltip);exports.VerticalBarAndLinearGraph=i=>{var n,l,x,c,d;const p=[0,0,0,0,0,0],g=-1===i.barAxis.data.findIndex((e=>0!==e)),b=-1===i.lineAxis.data.findIndex((e=>0!==e)),u={min:0,max:2e3,stepSize:200},j=[{legend:i.barAxis.title,color:i.barAxis.graphColor},{legend:i.lineAxis.title,color:i.lineAxis.graphColor}],h={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!i.xAxis.title,text:i.xAxis.title,color:i.xAxis.titleColor,font:{size:o.FONTS.caption.fontSize}},grid:{display:!1,borderColor:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:null!==(n=i.xAxis.labelColor)&&void 0!==n?n:o.COLORS.content.secondary}},bar:{position:"left",title:{display:!!i.barAxis.title,text:i.barAxis.title,color:i.barAxis.titleColor,font:{size:o.FONTS.caption.fontSize}},grid:{borderColor:"white",color:o.COLORS.background.base},ticks:Object.assign({fontSize:o.FONTS.caption.fontSize,color:null!==(l=i.barAxis.labelColor)&&void 0!==l?l:o.COLORS.content.secondary},g?u:{})},line:{position:"right",title:{display:!!i.lineAxis.title,text:i.lineAxis.title,color:i.lineAxis.titleColor,font:{size:o.FONTS.caption.fontSize}},grid:{display:!1,borderColor:"white",color:o.COLORS.background.base},ticks:Object.assign({fontSize:o.FONTS.caption.fontSize,color:null!==(x=i.lineAxis.labelColor)&&void 0!==x?x:o.COLORS.content.secondary},b?u:{}),display:!0}},maintainAspectRatio:!1},A={labels:i.xAxis.forceShowXAxis?i.xAxis.data.map((e=>e.toString())):g&&b?["-","-","-","-","-","-"]:i.xAxis.data.map((e=>e.toString())),datasets:[{yAxisID:"line",type:"line",data:b?p:i.lineAxis.data,borderColor:i.lineAxis.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1},{yAxisID:"bar",type:"bar",data:g?p: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:[e.jsxRuntimeExports.jsx(s.LegendWrapper,Object.assign({position:"center"},{children:j.map(((i,t)=>{let{legend:o,color:a}=i;return o?e.jsxRuntimeExports.jsxs(s.LegendContainer,{children:[e.jsxRuntimeExports.jsx(s.LegendColor,{color:a}),e.jsxRuntimeExports.jsx(r.SmallRegular,Object.assign({color:"#667085"},{children:o}))]},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!==(c=i.chartHeading.color)&&void 0!==c?c:o.COLORS.content.secondary},{children:i.chartHeading.heading}))})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:null!==(d=i.graphCanvasHeight)&&void 0!==d?d:500}},{children:e.jsxRuntimeExports.jsx(t.Chart,{type:"bar",data:A,options:h})}))]})]}))};
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"),a=require("../../../../constants/Theme.js"),o=require("../LineChart/LineChart.styled.js"),n=require("../utils/calcPercentage.js"),s=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)),A=-1===i.lineAxis.data.findIndex((e=>0!==e)),j=!i.lineAxis2||-1===i.lineAxis2.data.findIndex((e=>0!==e)),S={min:0,max:2e3,stepSize:200},h=[{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}]:[]],C={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!i.xAxis.title,text:i.xAxis.title,color:i.xAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},grid:{display:!1,borderColor:a.COLORS.background.base},ticks:{fontSize:a.FONTS.caption.fontSize,color:null!==(l=i.xAxis.labelColor)&&void 0!==l?l:a.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:a.FONTS.caption.fontSize}},grid:{borderColor:"white",color:a.COLORS.background.base},ticks:Object.assign(Object.assign({fontSize:a.FONTS.caption.fontSize,color:null!==(d=i.barAxis.labelColor)&&void 0!==d?d:a.COLORS.content.secondary},b?S:{}),{callback:e=>{var t;return`${i.isInternationalStore?n.truncateValueForInternationalStore(e):n.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:a.FONTS.caption.fontSize}},grid:{display:!1,borderColor:"white",color:a.COLORS.background.base},ticks:Object.assign(Object.assign({fontSize:a.FONTS.caption.fontSize,color:null!==(c=i.lineAxis.labelColor)&&void 0!==c?c:a.COLORS.content.secondary},A?S:{}),{callback:e=>{var t;return`${i.isInternationalStore?n.truncateValueForInternationalStore(e):n.truncateValueForIndianStore(e)}${(null===(t=i.lineAxis)||void 0===t?void 0:t.axisSuffix)||""}`}}),display:!0}},maintainAspectRatio:!1},O={labels:i.xAxis.forceShowXAxis?i.xAxis.data.map((e=>e.toString())):b&&A&&j?["-","-","-","-","-","-"]:i.xAxis.data.map((e=>e.toString())),datasets:[{yAxisID:"line",type:"line",data:A?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:j?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:[e.jsxRuntimeExports.jsx(o.LegendWrapper,Object.assign({position:"center"},{children:h.map(((i,t)=>{let{legend:a,color:n}=i;return a?e.jsxRuntimeExports.jsxs(o.LegendContainer,{children:[e.jsxRuntimeExports.jsx(o.LegendColor,{color:n}),e.jsxRuntimeExports.jsx(r.SmallRegular,Object.assign({color:"#667085"},{children:a}))]},t):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})}))})),e.jsxRuntimeExports.jsxs(s.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:a.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:O,options:C})}))]})]}))};
@@ -4,6 +4,7 @@ export interface AxisDetailsI {
4
4
  data: number[] | string[];
5
5
  labelColor?: string;
6
6
  graphColor?: string;
7
+ axisSuffix?: string;
7
8
  }
8
9
  export interface ChartHeadingI {
9
10
  heading: string;
@@ -18,5 +19,7 @@ export interface VerticalBarAndLinearGraphI {
18
19
  forceShowXAxis?: boolean;
19
20
  };
20
21
  lineAxis: AxisDetailsI;
22
+ lineAxis2?: AxisDetailsI;
21
23
  barAxis: AxisDetailsI;
24
+ isInternationalStore?: boolean;
22
25
  }
@@ -1 +1 @@
1
- import{j as i}from"../../../../node_modules/react/jsx-runtime.js";import{Chart as t,CategoryScale as e,LinearScale as o,BarElement as r,Tooltip as a}from"chart.js";import{Chart as s}from"react-chartjs-2";import{SmallRegular as l,TitleRegular as n}from"../../../TypographyStyle.js";import{FONTS as c,COLORS as d}from"../../../../constants/Theme.js";import{LegendWrapper as x,LegendContainer as p,LegendColor as g}from"../LineChart/LineChart.styled.js";import{GraphContainerWrapper as b}from"./VerticalBarAndLinearGraph.styles.js";t.register(e,o,r,a);const h=t=>{var e,o,r,a,h;const A=[0,0,0,0,0,0],j=-1===t.barAxis.data.findIndex((i=>0!==i)),m=-1===t.lineAxis.data.findIndex((i=>0!==i)),f={min:0,max:2e3,stepSize:200},y=[{legend:t.barAxis.title,color:t.barAxis.graphColor},{legend:t.lineAxis.title,color:t.lineAxis.graphColor}],C={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:c.caption.fontSize}},grid:{display:!1,borderColor:d.background.base},ticks:{fontSize:c.caption.fontSize,color:null!==(e=t.xAxis.labelColor)&&void 0!==e?e:d.content.secondary}},bar:{position:"left",title:{display:!!t.barAxis.title,text:t.barAxis.title,color:t.barAxis.titleColor,font:{size:c.caption.fontSize}},grid:{borderColor:"white",color:d.background.base},ticks:Object.assign({fontSize:c.caption.fontSize,color:null!==(o=t.barAxis.labelColor)&&void 0!==o?o:d.content.secondary},j?f:{})},line:{position:"right",title:{display:!!t.lineAxis.title,text:t.lineAxis.title,color:t.lineAxis.titleColor,font:{size:c.caption.fontSize}},grid:{display:!1,borderColor:"white",color:d.background.base},ticks:Object.assign({fontSize:c.caption.fontSize,color:null!==(r=t.lineAxis.labelColor)&&void 0!==r?r:d.content.secondary},m?f:{}),display:!0}},maintainAspectRatio:!1},u={labels:t.xAxis.forceShowXAxis?t.xAxis.data.map((i=>i.toString())):j&&m?["-","-","-","-","-","-"]:t.xAxis.data.map((i=>i.toString())),datasets:[{yAxisID:"line",type:"line",data:m?A:t.lineAxis.data,borderColor:t.lineAxis.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1},{yAxisID:"bar",type:"bar",data:j?A:t.barAxis.data,backgroundColor:t.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:[i.jsx(x,Object.assign({position:"center"},{children:y.map(((t,e)=>{let{legend:o,color:r}=t;return o?i.jsxs(p,{children:[i.jsx(g,{color:r}),i.jsx(l,Object.assign({color:"#667085"},{children:o}))]},e):i.jsx(i.Fragment,{})}))})),i.jsxs(b,{children:[t.chartHeading&&i.jsx("div",Object.assign({style:{marginBottom:24}},{children:i.jsx(n,Object.assign({color:null!==(a=t.chartHeading.color)&&void 0!==a?a:d.content.secondary},{children:t.chartHeading.heading}))})),i.jsx("div",Object.assign({style:{height:null!==(h=t.graphCanvasHeight)&&void 0!==h?h:500}},{children:i.jsx(s,{type:"bar",data:u,options:C})}))]})]}))};export{h as VerticalBarAndLinearGraph};
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 a}from"chart.js";import{Chart as l}from"react-chartjs-2";import{SmallRegular as s,TitleRegular as n}from"../../../TypographyStyle.js";import{FONTS as d,COLORS as c}from"../../../../constants/Theme.js";import{LegendWrapper as x,LegendContainer as g,LegendColor as p}from"../LineChart/LineChart.styled.js";import{truncateValueForInternationalStore as b,truncateValueForIndianStore as A}from"../utils/calcPercentage.js";import{GraphContainerWrapper as f}from"./VerticalBarAndLinearGraph.styles.js";e.register(t,o,r,a);const h=e=>{var t,o,r,a,h,j;const m=[0,0,0,0,0,0],u=-1===e.barAxis.data.findIndex((i=>0!==i)),y=-1===e.lineAxis.data.findIndex((i=>0!==i)),C=!e.lineAxis2||-1===e.lineAxis2.data.findIndex((i=>0!==i)),v={min:0,max:2e3,stepSize:200},S=[{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}]:[]],z={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!e.xAxis.title,text:e.xAxis.title,color:e.xAxis.titleColor,font:{size:d.caption.fontSize}},grid:{display:!1,borderColor:c.background.base},ticks:{fontSize:d.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:d.caption.fontSize}},grid:{borderColor:"white",color:c.background.base},ticks:Object.assign(Object.assign({fontSize:d.caption.fontSize,color:null!==(r=e.barAxis.labelColor)&&void 0!==r?r:c.content.secondary},u?v:{}),{callback:i=>{var t;return`${e.isInternationalStore?b(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:d.caption.fontSize}},grid:{display:!1,borderColor:"white",color:c.background.base},ticks:Object.assign(Object.assign({fontSize:d.caption.fontSize,color:null!==(a=e.lineAxis.labelColor)&&void 0!==a?a:c.content.secondary},y?v:{}),{callback:i=>{var t;return`${e.isInternationalStore?b(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())):u&&y&&C?["-","-","-","-","-","-"]:e.xAxis.data.map((i=>i.toString())),datasets:[{yAxisID:"line",type:"line",data:y?m: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:C?m:e.lineAxis2.data,borderColor:e.lineAxis2.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1}]:[],{yAxisID:"bar",type:"bar",data:u?m: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:[i.jsx(x,Object.assign({position:"center"},{children:S.map(((e,t)=>{let{legend:o,color:r}=e;return o?i.jsxs(g,{children:[i.jsx(p,{color:r}),i.jsx(s,Object.assign({color:"#667085"},{children:o}))]},t):i.jsx(i.Fragment,{})}))})),i.jsxs(f,{children:[e.chartHeading&&i.jsx("div",Object.assign({style:{marginBottom:24}},{children:i.jsx(n,Object.assign({color:null!==(h=e.chartHeading.color)&&void 0!==h?h:c.content.secondary},{children:e.chartHeading.heading}))})),i.jsx("div",Object.assign({style:{height:null!==(j=e.graphCanvasHeight)&&void 0!==j?j:500}},{children:i.jsx(l,{type:"bar",data:k,options:z})}))]})]}))};export{h as VerticalBarAndLinearGraph};
@@ -4,6 +4,7 @@ export interface AxisDetailsI {
4
4
  data: number[] | string[];
5
5
  labelColor?: string;
6
6
  graphColor?: string;
7
+ axisSuffix?: string;
7
8
  }
8
9
  export interface ChartHeadingI {
9
10
  heading: string;
@@ -18,5 +19,7 @@ export interface VerticalBarAndLinearGraphI {
18
19
  forceShowXAxis?: boolean;
19
20
  };
20
21
  lineAxis: AxisDetailsI;
22
+ lineAxis2?: AxisDetailsI;
21
23
  barAxis: AxisDetailsI;
24
+ isInternationalStore?: boolean;
22
25
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.718-beta.12",
3
+ "version": "0.0.718-beta.14",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",