@bikdotai/bik-component-library 0.0.111-beta.analytics.13 → 0.0.111-beta.analytics.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("react/jsx-runtime"),t=require("chart.js"),r=require("react-chartjs-2"),i=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),a=require("./HorizontalGraph.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip);exports.HorizontalGraph=t=>{var n,s,l,d;const c=-1===t.xAxis.data.findIndex((e=>0!==e)),g={indexAxis:"y",elements:{},responsive:!0,plugins:{legend:{display:!1}},scales:{y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:o.FONTS.caption.fontSize,color:t.yAxis.titleColor},padding:{bottom:10}},grid:{display:!1,borderColor:"white"},ticks:{fontSize:o.FONTS.caption.fontSize,color:null!==(n=t.yAxis.labelColor)&&void 0!==n?n:o.COLORS.content.secondary}},x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:o.FONTS.caption.fontSize},padding:{top:10}},grid:{borderColor:"white",color:o.COLORS.background.base},ticks:Object.assign({fontSize:o.FONTS.caption.fontSize,color:null!==(s=t.xAxis.labelColor)&&void 0!==s?s:o.COLORS.content.secondary},c?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},x={labels:c?["-","-","-","-","-","-"]:t.yAxis.data.map((e=>e.toString())),datasets:[{data:c?[250,1e3,800,1500,300,600]:t.xAxis.data,backgroundColor:e=>(e=>{var r;const i=e.chart.ctx.createLinearGradient(0,0,0,200);let o="";if(c)o="rgba(0,0,0,0)";else if(t.barColorRGBA){const e=t.barColorRGBA;o=`rgba(${e.r}, ${e.g}, ${e.b}, ${null!==(r=e.a)&&void 0!==r?r:"0.3"})`}return i.addColorStop(0,o||"rgba(146, 96, 237, 0.3)"),i.addColorStop(1,o||"rgba(146, 96, 237, 0.3)"),i})(e),barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return e.jsxs(a.GraphContainerWrapper,Object.assign({padding:t.outerPadding},{children:[t.chartHeading&&e.jsx(i.TitleRegular,Object.assign({color:null!==(l=t.chartHeading.color)&&void 0!==l?l:o.COLORS.content.secondary},{children:t.chartHeading.heading})),e.jsx("div",Object.assign({style:{height:null!==(d=t.graphCanvasHeight)&&void 0!==d?d:500}},{children:e.jsx(r.Bar,{options:g,data:x})}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),r=require("react-chartjs-2"),i=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),a=require("./HorizontalGraph.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip);exports.HorizontalGraph=t=>{var n,l,s,d;const c=-1===t.xAxis.data.findIndex((e=>0!==e)),g={indexAxis:"y",elements:{},responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!c}},scales:{y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:o.FONTS.caption.fontSize,color:t.yAxis.titleColor},padding:{bottom:10}},grid:{display:!1,borderColor:"white"},ticks:{fontSize:o.FONTS.caption.fontSize,color:null!==(n=t.yAxis.labelColor)&&void 0!==n?n:o.COLORS.content.secondary}},x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:o.FONTS.caption.fontSize},padding:{top:10}},grid:{borderColor:"white",color:o.COLORS.background.base},ticks:Object.assign({fontSize:o.FONTS.caption.fontSize,color:null!==(l=t.xAxis.labelColor)&&void 0!==l?l:o.COLORS.content.secondary},c?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},p={labels:c?["-","-","-","-","-","-"]:t.yAxis.data.map((e=>e.toString())),datasets:[{data:c?[250,1e3,800,1500,300,600]:t.xAxis.data,backgroundColor:e=>(e=>{var r;const i=e.chart.ctx.createLinearGradient(0,0,0,200);let o="";if(c)o="rgba(0,0,0,0)";else if(t.barColorRGBA){const e=t.barColorRGBA;o=`rgba(${e.r}, ${e.g}, ${e.b}, ${null!==(r=e.a)&&void 0!==r?r:"0.3"})`}return i.addColorStop(0,o||"rgba(146, 96, 237, 0.3)"),i.addColorStop(1,o||"rgba(146, 96, 237, 0.3)"),i})(e),barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return e.jsxs(a.GraphContainerWrapper,Object.assign({padding:t.outerPadding},{children:[t.chartHeading&&e.jsx(i.TitleRegular,Object.assign({color:null!==(s=t.chartHeading.color)&&void 0!==s?s:o.COLORS.content.secondary},{children:t.chartHeading.heading})),e.jsx("div",Object.assign({style:{height:null!==(d=t.graphCanvasHeight)&&void 0!==d?d:500}},{children:e.jsx(r.Bar,{options:g,data:p})}))]}))};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),a=require("react-chartjs-2"),i=require("../../../TypographyStyle.js"),r=require("../../../../constants/Theme.js"),o=require("./StackedBarChart.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip,t.Legend);exports.StackedBarChart=t=>{var s,n,l,c;const d=0===t.yAxis.data.length,g=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],p={barPercentage:.4,categoryPercentage:1,borderRadius:{topLeft:4,topRight:4},pointStyle:"circle"},y={};t.yAxis.data.map((e=>{e.map((e=>{y[e.name]?y[e.name].push(e.value):y[e.name]=[e.value]}))}));const u=Object.keys(y).map(((e,t)=>Object.assign({label:e,data:y[e],backgroundColor:g[t]},p))),x={plugins:{legend:{display:!d,labels:{usePointStyle:!0,fontSize:2}}},responsive:!0,maintainAspectRatio:!1,legend:{display:!0,labels:{usePointStyle:!0}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:r.FONTS.caption.fontSize}},grid:{display:!1,borderColor:r.COLORS.background.base},ticks:{fontSize:r.FONTS.caption.fontSize,color:null!==(s=t.yAxis.labelColor)&&void 0!==s?s:r.COLORS.content.secondary},stacked:!0},y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:r.FONTS.caption.fontSize}},grid:{borderColor:"white",color:r.COLORS.background.base},ticks:Object.assign({fontSize:r.FONTS.caption.fontSize,color:null!==(n=t.xAxis.labelColor)&&void 0!==n?n:r.COLORS.content.secondary},d?{min:0,max:2e3,stepSize:200}:{}),stacked:!0}}},b={labels:d?["-","-","-","-","-","-"]:t.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:d?[{data:[250,1e3,800,1500,300,600],backgroundColor:"rgba(0,0,0,0)"}]:u};return e.jsxs(o.GraphContainerWrapper,Object.assign({padding:t.outerPadding},{children:[t.chartHeading&&e.jsx("div",Object.assign({style:{marginBottom:24}},{children:e.jsx(i.TitleRegular,Object.assign({color:null!==(l=t.chartHeading.color)&&void 0!==l?l:r.COLORS.content.secondary},{children:t.chartHeading.heading}))})),e.jsx("div",Object.assign({style:{height:null!==(c=t.graphCanvasHeight)&&void 0!==c?c:500}},{children:e.jsx(a.Bar,{options:x,data:b})}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),a=require("react-chartjs-2"),i=require("../../../TypographyStyle.js"),r=require("../../../../constants/Theme.js"),o=require("./StackedBarChart.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip,t.Legend);exports.StackedBarChart=t=>{var s,n,l,c;const d=0===t.yAxis.data.length,g=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],p={barPercentage:.4,categoryPercentage:1,borderRadius:{topLeft:4,topRight:4},pointStyle:"circle"},y={};t.yAxis.data.map((e=>{e.map((e=>{y[e.name]?y[e.name].push(e.value):y[e.name]=[e.value]}))}));const u=Object.keys(y).map(((e,t)=>Object.assign({label:e,data:y[e],backgroundColor:g[t]},p))),x={plugins:{legend:{display:!d,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!d}},responsive:!0,maintainAspectRatio:!1,legend:{display:!0,labels:{usePointStyle:!0}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:r.FONTS.caption.fontSize}},grid:{display:!1,borderColor:r.COLORS.background.base},ticks:{fontSize:r.FONTS.caption.fontSize,color:null!==(s=t.yAxis.labelColor)&&void 0!==s?s:r.COLORS.content.secondary},stacked:!0},y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:r.FONTS.caption.fontSize}},grid:{borderColor:"white",color:r.COLORS.background.base},ticks:Object.assign({fontSize:r.FONTS.caption.fontSize,color:null!==(n=t.xAxis.labelColor)&&void 0!==n?n:r.COLORS.content.secondary},d?{min:0,max:2e3,stepSize:200}:{}),stacked:!0}}},b={labels:d?["-","-","-","-","-","-"]:t.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:d?[{data:[250,1e3,800,1500,300,600],backgroundColor:"rgba(0,0,0,0)"}]:u};return e.jsxs(o.GraphContainerWrapper,Object.assign({padding:t.outerPadding},{children:[t.chartHeading&&e.jsx("div",Object.assign({style:{marginBottom:24}},{children:e.jsx(i.TitleRegular,Object.assign({color:null!==(l=t.chartHeading.color)&&void 0!==l?l:r.COLORS.content.secondary},{children:t.chartHeading.heading}))})),e.jsx("div",Object.assign({style:{height:null!==(c=t.graphCanvasHeight)&&void 0!==c?c:500}},{children:e.jsx(a.Bar,{options:x,data:b})}))]}))};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),r=require("react-chartjs-2"),i=require("../../../TypographyStyle.js"),a=require("../../../../constants/Theme.js"),o=require("./VerticalGraph.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip);exports.VerticalGraph=t=>{var s,n,l,c;const d=-1===t.yAxis.data.findIndex((e=>0!==e)),g={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},grid:{display:!1,borderColor:a.COLORS.background.base},ticks:{fontSize:a.FONTS.caption.fontSize,color:null!==(s=t.yAxis.labelColor)&&void 0!==s?s:a.COLORS.content.secondary}},y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},grid:{borderColor:"white",color:a.COLORS.background.base},ticks:Object.assign({fontSize:a.FONTS.caption.fontSize,color:null!==(n=t.xAxis.labelColor)&&void 0!==n?n:a.COLORS.content.secondary},d?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},x={labels:d?["-","-","-","-","-","-"]:t.xAxis.data.map((e=>e.toString())),datasets:[{data:d?[250,1e3,800,1500,300,600]:t.yAxis.data,backgroundColor:e=>{var r;const i=t.barColorRGBA;let a=[];const o=t.xAxis.data.length;if(d)return"rgba(0,0,0,0)";if(t.isFunnel){let e=+(o>10?.1:(1/o).toFixed(2));const t=`rgba(${i.r}, ${i.g}, ${i.b}`;for(let r=1;r<o+1;r++){let i="";r>10?i=`${t},1)`:(i=`${t},${e})`,e+=.1),a.push(i)}}else{const e=`rgba(${i.r}, ${i.g}, ${i.b}, ${null!==(r=i.a)&&void 0!==r?r:"1"})`;a=Array(o).fill(e)}return a},barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return e.jsxs(o.GraphContainerWrapper,Object.assign({padding:t.outerPadding},{children:[t.chartHeading&&e.jsx("div",Object.assign({style:{marginBottom:24}},{children:e.jsx(i.TitleMedium,Object.assign({color:null!==(l=t.chartHeading.color)&&void 0!==l?l:a.COLORS.content.secondary},{children:t.chartHeading.heading}))})),e.jsx("div",Object.assign({style:{height:null!==(c=t.graphCanvasHeight)&&void 0!==c?c:500}},{children:e.jsx(r.Bar,{options:g,data:x})}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),r=require("react-chartjs-2"),i=require("../../../TypographyStyle.js"),a=require("../../../../constants/Theme.js"),o=require("./VerticalGraph.styles.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.BarElement,t.Tooltip);exports.VerticalGraph=t=>{var s,n,l,c;const d=-1===t.yAxis.data.findIndex((e=>0!==e)),g={responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!d}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},grid:{display:!1,borderColor:a.COLORS.background.base},ticks:{fontSize:a.FONTS.caption.fontSize,color:null!==(s=t.yAxis.labelColor)&&void 0!==s?s:a.COLORS.content.secondary}},y:{title:{display:!!t.yAxis.title,text:t.yAxis.title,color:t.yAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},grid:{borderColor:"white",color:a.COLORS.background.base},ticks:Object.assign({fontSize:a.FONTS.caption.fontSize,color:null!==(n=t.xAxis.labelColor)&&void 0!==n?n:a.COLORS.content.secondary},d?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},x={labels:d?["-","-","-","-","-","-"]:t.xAxis.data.map((e=>e.toString())),datasets:[{data:d?[250,1e3,800,1500,300,600]:t.yAxis.data,backgroundColor:e=>{var r;const i=t.barColorRGBA;let a=[];const o=t.xAxis.data.length;if(d)return"rgba(0,0,0,0)";if(t.isFunnel){let e=+(o>10?.1:(1/o).toFixed(2));const t=`rgba(${i.r}, ${i.g}, ${i.b}`;for(let r=1;r<o+1;r++){let i="";r>10?i=`${t},1)`:(i=`${t},${e})`,e+=.1),a.push(i)}}else{const e=`rgba(${i.r}, ${i.g}, ${i.b}, ${null!==(r=i.a)&&void 0!==r?r:"1"})`;a=Array(o).fill(e)}return a},barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return e.jsxs(o.GraphContainerWrapper,Object.assign({padding:t.outerPadding},{children:[t.chartHeading&&e.jsx("div",Object.assign({style:{marginBottom:24}},{children:e.jsx(i.TitleMedium,Object.assign({color:null!==(l=t.chartHeading.color)&&void 0!==l?l:a.COLORS.content.secondary},{children:t.chartHeading.heading}))})),e.jsx("div",Object.assign({style:{height:null!==(c=t.graphCanvasHeight)&&void 0!==c?c:500}},{children:e.jsx(r.Bar,{options:g,data:x})}))]}))};
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const WorkingStepper: () => JSX.Element;
2
3
  export declare enum STEPENUM {
3
4
  STEP1 = "STEP1",
@@ -1 +1 @@
1
- import{jsxs as t,jsx as o}from"react/jsx-runtime";import{Chart as i,CategoryScale as e,LinearScale as r,BarElement as a,Tooltip as n}from"chart.js";import{Bar as s}from"react-chartjs-2";import{TitleRegular as l}from"../../../TypographyStyle.js";import{FONTS as d,COLORS as c}from"../../../../constants/Theme.js";import{GraphContainerWrapper as g}from"./HorizontalGraph.styles.js";i.register(e,r,a,n);const p=i=>{var e,r,a,n;const p=-1===i.xAxis.data.findIndex((t=>0!==t)),x={indexAxis:"y",elements:{},responsive:!0,plugins:{legend:{display:!1}},scales:{y:{title:{display:!!i.yAxis.title,text:i.yAxis.title,color:i.yAxis.titleColor,font:{size:d.caption.fontSize,color:i.yAxis.titleColor},padding:{bottom:10}},grid:{display:!1,borderColor:"white"},ticks:{fontSize:d.caption.fontSize,color:null!==(e=i.yAxis.labelColor)&&void 0!==e?e:c.content.secondary}},x:{title:{display:!!i.xAxis.title,text:i.xAxis.title,color:i.xAxis.titleColor,font:{size:d.caption.fontSize},padding:{top:10}},grid:{borderColor:"white",color:c.background.base},ticks:Object.assign({fontSize:d.caption.fontSize,color:null!==(r=i.xAxis.labelColor)&&void 0!==r?r:c.content.secondary},p?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},b={labels:p?["-","-","-","-","-","-"]:i.yAxis.data.map((t=>t.toString())),datasets:[{data:p?[250,1e3,800,1500,300,600]:i.xAxis.data,backgroundColor:t=>(t=>{var o;const e=t.chart.ctx.createLinearGradient(0,0,0,200);let r="";if(p)r="rgba(0,0,0,0)";else if(i.barColorRGBA){const t=i.barColorRGBA;r=`rgba(${t.r}, ${t.g}, ${t.b}, ${null!==(o=t.a)&&void 0!==o?o:"0.3"})`}return e.addColorStop(0,r||"rgba(146, 96, 237, 0.3)"),e.addColorStop(1,r||"rgba(146, 96, 237, 0.3)"),e})(t),barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return t(g,Object.assign({padding:i.outerPadding},{children:[i.chartHeading&&o(l,Object.assign({color:null!==(a=i.chartHeading.color)&&void 0!==a?a:c.content.secondary},{children:i.chartHeading.heading})),o("div",Object.assign({style:{height:null!==(n=i.graphCanvasHeight)&&void 0!==n?n:500}},{children:o(s,{options:x,data:b})}))]}))};export{p as HorizontalGraph};
1
+ import{jsxs as t,jsx as o}from"react/jsx-runtime";import{Chart as e,CategoryScale as i,LinearScale as r,BarElement as a,Tooltip as n}from"chart.js";import{Bar as l}from"react-chartjs-2";import{TitleRegular as s}from"../../../TypographyStyle.js";import{FONTS as d,COLORS as c}from"../../../../constants/Theme.js";import{GraphContainerWrapper as g}from"./HorizontalGraph.styles.js";e.register(i,r,a,n);const p=e=>{var i,r,a,n;const p=-1===e.xAxis.data.findIndex((t=>0!==t)),x={indexAxis:"y",elements:{},responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!p}},scales:{y:{title:{display:!!e.yAxis.title,text:e.yAxis.title,color:e.yAxis.titleColor,font:{size:d.caption.fontSize,color:e.yAxis.titleColor},padding:{bottom:10}},grid:{display:!1,borderColor:"white"},ticks:{fontSize:d.caption.fontSize,color:null!==(i=e.yAxis.labelColor)&&void 0!==i?i:c.content.secondary}},x:{title:{display:!!e.xAxis.title,text:e.xAxis.title,color:e.xAxis.titleColor,font:{size:d.caption.fontSize},padding:{top:10}},grid:{borderColor:"white",color:c.background.base},ticks:Object.assign({fontSize:d.caption.fontSize,color:null!==(r=e.xAxis.labelColor)&&void 0!==r?r:c.content.secondary},p?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},b={labels:p?["-","-","-","-","-","-"]:e.yAxis.data.map((t=>t.toString())),datasets:[{data:p?[250,1e3,800,1500,300,600]:e.xAxis.data,backgroundColor:t=>(t=>{var o;const i=t.chart.ctx.createLinearGradient(0,0,0,200);let r="";if(p)r="rgba(0,0,0,0)";else if(e.barColorRGBA){const t=e.barColorRGBA;r=`rgba(${t.r}, ${t.g}, ${t.b}, ${null!==(o=t.a)&&void 0!==o?o:"0.3"})`}return i.addColorStop(0,r||"rgba(146, 96, 237, 0.3)"),i.addColorStop(1,r||"rgba(146, 96, 237, 0.3)"),i})(t),barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return t(g,Object.assign({padding:e.outerPadding},{children:[e.chartHeading&&o(s,Object.assign({color:null!==(a=e.chartHeading.color)&&void 0!==a?a:c.content.secondary},{children:e.chartHeading.heading})),o("div",Object.assign({style:{height:null!==(n=e.graphCanvasHeight)&&void 0!==n?n:500}},{children:o(l,{options:x,data:b})}))]}))};export{p as HorizontalGraph};
@@ -1 +1 @@
1
- import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Chart as o,CategoryScale as a,LinearScale as i,BarElement as s,Tooltip as n,Legend as r}from"chart.js";import{Bar as l}from"react-chartjs-2";import{TitleRegular as c}from"../../../TypographyStyle.js";import{FONTS as d,COLORS as g}from"../../../../constants/Theme.js";import{GraphContainerWrapper as p}from"./StackedBarChart.styles.js";o.register(a,i,s,n,r);const m=o=>{var a,i,s,n;const r=0===o.yAxis.data.length,m=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],y={barPercentage:.4,categoryPercentage:1,borderRadius:{topLeft:4,topRight:4},pointStyle:"circle"},b={};o.yAxis.data.map((t=>{t.map((t=>{b[t.name]?b[t.name].push(t.value):b[t.name]=[t.value]}))}));const x=Object.keys(b).map(((t,e)=>Object.assign({label:t,data:b[t],backgroundColor:m[e]},y))),h={plugins:{legend:{display:!r,labels:{usePointStyle:!0,fontSize:2}}},responsive:!0,maintainAspectRatio:!1,legend:{display:!0,labels:{usePointStyle:!0}},scales:{x:{title:{display:!!o.xAxis.title,text:o.xAxis.title,color:o.xAxis.titleColor,font:{size:d.caption.fontSize}},grid:{display:!1,borderColor:g.background.base},ticks:{fontSize:d.caption.fontSize,color:null!==(a=o.yAxis.labelColor)&&void 0!==a?a:g.content.secondary},stacked:!0},y:{title:{display:!!o.yAxis.title,text:o.yAxis.title,color:o.yAxis.titleColor,font:{size:d.caption.fontSize}},grid:{borderColor:"white",color:g.background.base},ticks:Object.assign({fontSize:d.caption.fontSize,color:null!==(i=o.xAxis.labelColor)&&void 0!==i?i:g.content.secondary},r?{min:0,max:2e3,stepSize:200}:{}),stacked:!0}}},u={labels:r?["-","-","-","-","-","-"]: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)"}]:x};return t(p,Object.assign({padding:o.outerPadding},{children:[o.chartHeading&&e("div",Object.assign({style:{marginBottom:24}},{children:e(c,Object.assign({color:null!==(s=o.chartHeading.color)&&void 0!==s?s:g.content.secondary},{children:o.chartHeading.heading}))})),e("div",Object.assign({style:{height:null!==(n=o.graphCanvasHeight)&&void 0!==n?n:500}},{children:e(l,{options:h,data:u})}))]}))};export{m as StackedBarChart};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Chart as o,CategoryScale as a,LinearScale as i,BarElement as n,Tooltip as s,Legend as r}from"chart.js";import{Bar as l}from"react-chartjs-2";import{TitleRegular as c}from"../../../TypographyStyle.js";import{FONTS as d,COLORS as p}from"../../../../constants/Theme.js";import{GraphContainerWrapper as g}from"./StackedBarChart.styles.js";o.register(a,i,n,s,r);const m=o=>{var a,i,n,s;const r=0===o.yAxis.data.length,m=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],y={barPercentage:.4,categoryPercentage:1,borderRadius:{topLeft:4,topRight:4},pointStyle:"circle"},b={};o.yAxis.data.map((t=>{t.map((t=>{b[t.name]?b[t.name].push(t.value):b[t.name]=[t.value]}))}));const x=Object.keys(b).map(((t,e)=>Object.assign({label:t,data:b[t],backgroundColor:m[e]},y))),h={plugins:{legend:{display:!r,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!r}},responsive:!0,maintainAspectRatio:!1,legend:{display:!0,labels:{usePointStyle:!0}},scales:{x:{title:{display:!!o.xAxis.title,text:o.xAxis.title,color:o.xAxis.titleColor,font:{size:d.caption.fontSize}},grid:{display:!1,borderColor:p.background.base},ticks:{fontSize:d.caption.fontSize,color:null!==(a=o.yAxis.labelColor)&&void 0!==a?a:p.content.secondary},stacked:!0},y:{title:{display:!!o.yAxis.title,text:o.yAxis.title,color:o.yAxis.titleColor,font:{size:d.caption.fontSize}},grid:{borderColor:"white",color:p.background.base},ticks:Object.assign({fontSize:d.caption.fontSize,color:null!==(i=o.xAxis.labelColor)&&void 0!==i?i:p.content.secondary},r?{min:0,max:2e3,stepSize:200}:{}),stacked:!0}}},u={labels:r?["-","-","-","-","-","-"]: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)"}]:x};return t(g,Object.assign({padding:o.outerPadding},{children:[o.chartHeading&&e("div",Object.assign({style:{marginBottom:24}},{children:e(c,Object.assign({color:null!==(n=o.chartHeading.color)&&void 0!==n?n:p.content.secondary},{children:o.chartHeading.heading}))})),e("div",Object.assign({style:{height:null!==(s=o.graphCanvasHeight)&&void 0!==s?s:500}},{children:e(l,{options:h,data:u})}))]}))};export{m as StackedBarChart};
@@ -1 +1 @@
1
- import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Chart as i,CategoryScale as o,LinearScale as r,BarElement as a,Tooltip as n}from"chart.js";import{Bar as s}from"react-chartjs-2";import{TitleMedium as l}from"../../../TypographyStyle.js";import{FONTS as c,COLORS as d}from"../../../../constants/Theme.js";import{GraphContainerWrapper as g}from"./VerticalGraph.styles.js";i.register(o,r,a,n);const p=i=>{var o,r,a,n;const p=-1===i.yAxis.data.findIndex((t=>0!==t)),x={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!i.xAxis.title,text:i.xAxis.title,color:i.xAxis.titleColor,font:{size:c.caption.fontSize}},grid:{display:!1,borderColor:d.background.base},ticks:{fontSize:c.caption.fontSize,color:null!==(o=i.yAxis.labelColor)&&void 0!==o?o:d.content.secondary}},y:{title:{display:!!i.yAxis.title,text:i.yAxis.title,color:i.yAxis.titleColor,font:{size:c.caption.fontSize}},grid:{borderColor:"white",color:d.background.base},ticks:Object.assign({fontSize:c.caption.fontSize,color:null!==(r=i.xAxis.labelColor)&&void 0!==r?r:d.content.secondary},p?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},b={labels:p?["-","-","-","-","-","-"]:i.xAxis.data.map((t=>t.toString())),datasets:[{data:p?[250,1e3,800,1500,300,600]:i.yAxis.data,backgroundColor:t=>{var e;const o=i.barColorRGBA;let r=[];const a=i.xAxis.data.length;if(p)return"rgba(0,0,0,0)";if(i.isFunnel){let t=+(a>10?.1:(1/a).toFixed(2));const e=`rgba(${o.r}, ${o.g}, ${o.b}`;for(let i=1;i<a+1;i++){let o="";i>10?o=`${e},1)`:(o=`${e},${t})`,t+=.1),r.push(o)}}else{const t=`rgba(${o.r}, ${o.g}, ${o.b}, ${null!==(e=o.a)&&void 0!==e?e:"1"})`;r=Array(a).fill(t)}return r},barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return t(g,Object.assign({padding:i.outerPadding},{children:[i.chartHeading&&e("div",Object.assign({style:{marginBottom:24}},{children:e(l,Object.assign({color:null!==(a=i.chartHeading.color)&&void 0!==a?a:d.content.secondary},{children:i.chartHeading.heading}))})),e("div",Object.assign({style:{height:null!==(n=i.graphCanvasHeight)&&void 0!==n?n:500}},{children:e(s,{options:x,data:b})}))]}))};export{p as VerticalGraph};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Chart as o,CategoryScale as i,LinearScale as r,BarElement as a,Tooltip as n}from"chart.js";import{Bar as s}from"react-chartjs-2";import{TitleMedium as l}from"../../../TypographyStyle.js";import{FONTS as c,COLORS as d}from"../../../../constants/Theme.js";import{GraphContainerWrapper as g}from"./VerticalGraph.styles.js";o.register(i,r,a,n);const p=o=>{var i,r,a,n;const p=-1===o.yAxis.data.findIndex((t=>0!==t)),x={responsive:!0,plugins:{legend:{display:!1},tooltip:{enabled:!p}},scales:{x:{title:{display:!!o.xAxis.title,text:o.xAxis.title,color:o.xAxis.titleColor,font:{size:c.caption.fontSize}},grid:{display:!1,borderColor:d.background.base},ticks:{fontSize:c.caption.fontSize,color:null!==(i=o.yAxis.labelColor)&&void 0!==i?i:d.content.secondary}},y:{title:{display:!!o.yAxis.title,text:o.yAxis.title,color:o.yAxis.titleColor,font:{size:c.caption.fontSize}},grid:{borderColor:"white",color:d.background.base},ticks:Object.assign({fontSize:c.caption.fontSize,color:null!==(r=o.xAxis.labelColor)&&void 0!==r?r:d.content.secondary},p?{min:0,max:2e3,stepSize:200}:{})}},maintainAspectRatio:!1},b={labels:p?["-","-","-","-","-","-"]:o.xAxis.data.map((t=>t.toString())),datasets:[{data:p?[250,1e3,800,1500,300,600]:o.yAxis.data,backgroundColor:t=>{var e;const i=o.barColorRGBA;let r=[];const a=o.xAxis.data.length;if(p)return"rgba(0,0,0,0)";if(o.isFunnel){let t=+(a>10?.1:(1/a).toFixed(2));const e=`rgba(${i.r}, ${i.g}, ${i.b}`;for(let o=1;o<a+1;o++){let i="";o>10?i=`${e},1)`:(i=`${e},${t})`,t+=.1),r.push(i)}}else{const t=`rgba(${i.r}, ${i.g}, ${i.b}, ${null!==(e=i.a)&&void 0!==e?e:"1"})`;r=Array(a).fill(t)}return r},barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return t(g,Object.assign({padding:o.outerPadding},{children:[o.chartHeading&&e("div",Object.assign({style:{marginBottom:24}},{children:e(l,Object.assign({color:null!==(a=o.chartHeading.color)&&void 0!==a?a:d.content.secondary},{children:o.chartHeading.heading}))})),e("div",Object.assign({style:{height:null!==(n=o.graphCanvasHeight)&&void 0!==n?n:500}},{children:e(s,{options:x,data:b})}))]}))};export{p as VerticalGraph};
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const WorkingStepper: () => JSX.Element;
2
3
  export declare enum STEPENUM {
3
4
  STEP1 = "STEP1",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.111-beta.analytics.13",
3
+ "version": "0.0.111-beta.analytics.14",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",