@bikdotai/bik-component-library 0.0.532-analytics-beta0.4 → 0.0.532-analytics-beta0.4s
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"),l=require("react"),r=require("react-chartjs-2"),n=require("../../../TypographyStyle.js"),i=require("../../../../constants/Theme.js"),o=require("../utils/calcPercentage.js"),a=require("./LineChart.styled.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.PointElement,t.BarElement,t.LineElement,t.ArcElement,t.Filler,t.Title,t.Tooltip,t.Legend);exports.LineChart=t=>{let{scaleText:s,labels:d,canvasHeight:c,datas:u,maintainAspectRatio:g=!1,stepSize:p,min:y,max:b,isZeroState:C,tension:v,isNewStyles:O,prefixCurrencyInYAxis:x,pointRadius:h,useKFormat:j,lineThickness:m,ticksLabelCallback:L,labelCallback:S,afterBodyCallBack:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),l=require("react"),r=require("react-chartjs-2"),n=require("../../../TypographyStyle.js"),i=require("../../../../constants/Theme.js"),o=require("../utils/calcPercentage.js"),a=require("./LineChart.styled.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.PointElement,t.BarElement,t.LineElement,t.ArcElement,t.Filler,t.Title,t.Tooltip,t.Legend);exports.LineChart=t=>{let{scaleText:s,labels:d,canvasHeight:c,datas:u,maintainAspectRatio:g=!1,stepSize:p,min:y,max:b,isZeroState:C,tension:v,isNewStyles:O,prefixCurrencyInYAxis:x,pointRadius:h,useKFormat:j,lineThickness:m,ticksLabelCallback:L,labelCallback:S,afterBodyCallBack:f,titleTooltipCallback:k}=t;var R,q,B;const[w,T]=l.useState(null),E=l.useRef();l.useEffect((()=>{var e,t,l,r;if(null===(r=null===(l=null===(t=null===(e=E.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===l?void 0:l.ticks)||void 0===r?void 0:r.length){const e=38*E.current.scales.y.ticks.length;T(e)}}),[E]);const F=u.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?i.COLORS.content.placeholder:i.COLORS.background.brand,square:e.squareLegends}))),z={labels:d,datasets:u.map(((e,t)=>{var l,r;return Object.assign(Object.assign({tension:null!=v?v:.4,fill:e.gradient?"start":0},((e,t)=>{const l={borderColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)};return O?Object.assign({pointStyle:"circle",pointRadius:null!=h?h:5,pointBorderColor:"transparent",pointBackgroundColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)},l):Object.assign({pointRadius:null!=h?h:1},l)})(e.lineColor,e.dotted)),{borderDash:e.dotted?[8,3]:void 0,data:e.data,borderWidth:null!==(l=e.lineWidth)&&void 0!==l?l:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,w?w-75:150);return t.addColorStop(0,"#F1EEFB"),t.addColorStop(1,"rgba(127, 86, 217, 0)"),t}:null!==(r=e.backgroundColor)&&void 0!==r?r:"transparent",legend:e.legend})}))},$={maintainAspectRatio:g,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=O&&O,titleFont:()=>({weight:"600",size:14,family:"inter"}),titleColor:()=>i.COLORS.content.primaryInverse,backgroundColor:i.COLORS.content.primary,callbacks:{labelTextColor:()=>i.COLORS.content.primaryInverse,title:k,label:S,afterBody:f},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:C?0:y,max:C?10:b,ticks:{color:i.COLORS.content.secondary,callback:e=>{var t,l;return j?`${null!==(t=null==s?void 0:s.yPrefix)&&void 0!==t?t:""}${o.truncateValueToK(e)}${null!=x?x:""}`:`${null!==(l=null==s?void 0:s.yPrefix)&&void 0!==l?l:""}${e}${null!=x?x:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:C?1:p,padding:O?24:0},title:{display:!!(null==s?void 0:s.y),text:null==s?void 0:s.y},grid:{color:i.COLORS.background.base,drawBorder:null===(R=null==s?void 0:s.yDrawBorder)||void 0===R||R}},x:{ticks:{callback:L,color:i.COLORS.content.secondary,font:{family:"inter",size:12,weight:"400"}},title:{display:!!(null==s?void 0:s.x),text:null==s?void 0:s.x},grid:{display:!1,drawBorder:null!==(q=null==s?void 0:s.xDrawBorder)&&void 0!==q&&q}}}};return e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},g?{}:{height:null!==(B=null!=c?c:w)&&void 0!==B?B:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[e.jsx(a.LegendWrapper,{children:F.map(((t,l)=>{let{text:r,color:i,square:o}=t;return r?e.jsxs(a.LegendContainer,{children:[e.jsx(a.LegendColor,{color:i,square:o,newStyle:O}),e.jsx(n.BodyTiny,Object.assign({color:"#667085"},{children:r}))]},l):e.jsx(e.Fragment,{})}))}),e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(r.Line,{ref:E,options:$,data:z})}))]}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import{Chart as o,CategoryScale as r,LinearScale as n,PointElement as i,BarElement as a,LineElement as s,ArcElement as d,Filler as c,Title as u,Tooltip as p,Legend as g}from"chart.js";import{useState as b,useRef as y,useEffect as m}from"react";import{Line as v}from"react-chartjs-2";import{BodyTiny as h}from"../../../TypographyStyle.js";import{COLORS as f}from"../../../../constants/Theme.js";import{truncateValueToK as
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import{Chart as o,CategoryScale as r,LinearScale as n,PointElement as i,BarElement as a,LineElement as s,ArcElement as d,Filler as c,Title as u,Tooltip as p,Legend as g}from"chart.js";import{useState as b,useRef as y,useEffect as m}from"react";import{Line as v}from"react-chartjs-2";import{BodyTiny as h}from"../../../TypographyStyle.js";import{COLORS as f}from"../../../../constants/Theme.js";import{truncateValueToK as x}from"../utils/calcPercentage.js";import{LegendWrapper as k,LegendContainer as C,LegendColor as j}from"./LineChart.styled.js";o.register(r,n,i,a,s,d,c,u,p,g);const w=o=>{let{scaleText:r,labels:n,canvasHeight:i,datas:a,maintainAspectRatio:s=!1,stepSize:d,min:c,max:u,isZeroState:p,tension:g,isNewStyles:w,prefixCurrencyInYAxis:B,pointRadius:O,useKFormat:S,lineThickness:z,ticksLabelCallback:T,labelCallback:$,afterBodyCallBack:F,titleTooltipCallback:R}=o;var q,A,D;const[L,I]=b(null),P=y();m((()=>{var e,t,l,o;if(null===(o=null===(l=null===(t=null===(e=P.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===l?void 0:l.ticks)||void 0===o?void 0:o.length){const e=38*P.current.scales.y.ticks.length;I(e)}}),[P]);const E=a.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?f.content.placeholder:f.background.brand,square:e.squareLegends}))),W={labels:n,datasets:a.map(((e,t)=>{var l,o;return Object.assign(Object.assign({tension:null!=g?g:.4,fill:e.gradient?"start":0},((e,t)=>{const l={borderColor:e||(t?f.content.placeholder:f.background.brand)};return w?Object.assign({pointStyle:"circle",pointRadius:null!=O?O:5,pointBorderColor:"transparent",pointBackgroundColor:e||(t?f.content.placeholder:f.background.brand)},l):Object.assign({pointRadius:null!=O?O:1},l)})(e.lineColor,e.dotted)),{borderDash:e.dotted?[8,3]:void 0,data:e.data,borderWidth:null!==(l=e.lineWidth)&&void 0!==l?l:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,L?L-75:150);return t.addColorStop(0,"#F1EEFB"),t.addColorStop(1,"rgba(127, 86, 217, 0)"),t}:null!==(o=e.backgroundColor)&&void 0!==o?o:"transparent",legend:e.legend})}))},Z={maintainAspectRatio:s,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=w&&w,titleFont:()=>({weight:"600",size:14,family:"inter"}),titleColor:()=>f.content.primaryInverse,backgroundColor:f.content.primary,callbacks:{labelTextColor:()=>f.content.primaryInverse,title:R,label:$,afterBody:F},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:p?0:c,max:p?10:u,ticks:{color:f.content.secondary,callback:e=>{var t,l;return S?`${null!==(t=null==r?void 0:r.yPrefix)&&void 0!==t?t:""}${x(e)}${null!=B?B:""}`:`${null!==(l=null==r?void 0:r.yPrefix)&&void 0!==l?l:""}${e}${null!=B?B:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:p?1:d,padding:w?24:0},title:{display:!!(null==r?void 0:r.y),text:null==r?void 0:r.y},grid:{color:f.background.base,drawBorder:null===(q=null==r?void 0:r.yDrawBorder)||void 0===q||q}},x:{ticks:{callback:T,color:f.content.secondary,font:{family:"inter",size:12,weight:"400"}},title:{display:!!(null==r?void 0:r.x),text:null==r?void 0:r.x},grid:{display:!1,drawBorder:null!==(A=null==r?void 0:r.xDrawBorder)&&void 0!==A&&A}}}};return e("div",Object.assign({style:Object.assign(Object.assign({},s?{}:{height:null!==(D=null!=i?i:L)&&void 0!==D?D:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[t(k,{children:E.map(((o,r)=>{let{text:n,color:i,square:a}=o;return n?e(C,{children:[t(j,{color:i,square:a,newStyle:w}),t(h,Object.assign({color:"#667085"},{children:n}))]},r):t(l,{})}))}),t("div",Object.assign({style:{flex:1}},{children:t(v,{ref:P,options:Z,data:W})}))]}))};export{w as LineChart};
|