@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.77 kB
JavaScript
"use strict";var e=require("react/jsx-runtime"),a=require("react"),r=require("./_partials/SliderGraphBar/SliderGraphBar.js"),i=require("./_partials/SliderGraphYAxis/SliderGraphYAxis.js"),t=require("./_partials/StyledComponents.js");module.exports=({rounding:o,tickInterval:n=10,data:l,loading:s,disabled:d,onChangeHandler:p,animateBars:h,slotProps:c,hideYAxis:u=!1,hideTopValueSection:g=!1,hideTopAmountValueSection:b=!1,hideTopPercentageValueSection:x=!1,showGraphLines:m=!1,hidePercentageSymbol:S=!1,hideLabels:v=!1,hideCheckboxes:P=!1,disableTooltips:k=!1,maxHeight:C=465,responsive:j=!1})=>{const G=a.useMemo(()=>Math.ceil(l.reduce((e,{percentage:a})=>a>e?a:e,0)),[l]);return e.jsxs(t.SliderGraphWrapper,{...c?.root,maxHeight:C,responsive:j,children:[!u&&e.jsx(i,{graphMaxHeight:C,loading:s,yAxisMax:G,rounding:o,tickInterval:n,disabled:d,showGraphLines:m,hideLabel:v,hideCheckbox:P,responsive:j,slotProps:{root:c?.yAxis}}),e.jsx(t.SliderGraphBarWrapper,{...c?.barsWrapper,maxHeight:C,responsive:j,children:l.map((a,i)=>{if(i>=11)return;const{percentage:t,label:o,value:u,checked:m,id:T,amount:A,hidePercentageSymbol:V,relativePercentage:y,onChange:B,tooltipContent:H}=a,q=V??S;return e.jsx(r,{totalBars:l.length,barIndex:i,graphMaxHeight:C,loading:s,label:o,value:u,amount:A,percentage:t,maxDataValue:G,hidePercentageSymbol:q,hideTopPercentageValueSection:x,hideTopAmountValueSection:b,checked:m,tickInterval:n,disabled:d||s,animateBar:h,hideTopValueSection:g,responsive:j,onChange:p?(e,a)=>p(e,a):B?(e,a)=>B({amount:A,percentage:t,name:o,relativePercentage:y},a):void 0,hideLabel:v,hideCheckbox:P,tooltipContent:H,disableTooltip:k,id:T,className:`slider-graph-bar-${i+1}`,slotProps:{barWrapper:{},checkbox:{},value:{},label:{},tooltip:{}},...c?.bar},i)})})]})};