@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/esm/deprecated/UTBarChart/index.js

@@ -1 +1,371 @@
-function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}import React,{useMemo,useState,useEffect,useRef}from"react";import*as d3 from"d3";import Scroll from"react-perfect-scrollbar";import{isEmpty}from"@widergy/web-utils/lib/array";import{func,bool,string,number,objectOf,shape}from"prop-types";import{useComponentDimensions,useComponentPosition}from"@widergy/energy-hooks";import{mergeClasses}from"../../utils/classesUtils";import{classesType}from"../../types/commonTypes";import WithTheme from"../../components/WithTheme";import{retrieveStyle}from"./theme";import{getPages,getFormattedData,getFormattedLinearData,getGraphAttributes,getGrid,flattenData,flattenAndReduceBarData,getMaxValues,getBounds}from"./utils";import useDynamicMargins from"./hooks/use-dynamic-margins";import styles from"./styles.module.scss";import YAxis from"./components/YAxis";import XAxis from"./components/XAxis";import Bars from"./components/Bars";import LinearPlot from"./components/LinearPlot";import Levels from"./components/Levels";import Pagination from"./components/Pagination";import Legend from"./components/Legend";import{barDataType,linearDataType,levelsType,referencesType,xAxisDefinitionType,buttonPropsTypes}from"./types";const UTBarChart=_ref=>{var _xAxisDefinition$filt,_formattedData$,_formattedData$2;let{barBorderRadius:barBorderRadius,barData:barData,barPadding:barPadding,barPaddingOuter:barPaddingOuter,buttonProps:buttonProps,center:center,classes:theme,className:className,classNames:classNames,decoratorRenderer:decoratorRenderer,displayLegendAs:displayLegendAs,fitLegend:fitLegend,fullSizeBars:fullSizeBars,gradientGenerator:gradientGenerator,gridType:gridType="grid",hideYAxis:hideYAxis,highlightWidth:highlightWidth,labelFormatters:labelFormatters,labels:labels,levels:levels,linearData:linearData,minBarWidth:minBarWidth,NoDataComponent:NoDataComponent,onBarClick:onBarClick,pagination:pagination,references:references,selectable:selectable,showEmptyGraphic:showEmptyGraphic,showGrid:showGrid,singleYAxis:singleYAxis,spacingOptions:spacingOptions,title:title,transitionDuration:transitionDuration,units:units,valuesOnTop:valuesOnTop,xAxisDefinition:xAxisDefinition,yAxisProps:yAxisProps={},yAxisTicks:yAxisTicks}=_ref;const classes=mergeClasses(theme,classNames),{useMaxBarValue:useMaxBarValue=!1}=yAxisProps||{},[currentPage,setCurrentPage]=useState(0),[currentLabel,setCurrentLabel]=useState(),{marginLeftRef:marginLeftRef,marginRightRef:marginRightRef,marginBottomRef:marginBottomRef,marginBottom:marginBottom,marginRight:marginRight,marginLeft:marginLeft}=useDynamicMargins(center,spacingOptions),{ref:containerRef,width:containerWidth,height:containerHeight}=useComponentDimensions(),{y:parentYPosition}=useComponentPosition({externalRef:containerRef}),paginationRef=useRef(),barRef=useRef({}),groups=barData.length,totalPages=useMemo(()=>getPages(barData[0],pagination),[barData,pagination]),formattedData=useMemo(()=>pagination?null==barData?void 0:barData.map(data=>getFormattedData(data,pagination,currentPage)):barData,[pagination,barData,currentPage]),formattedLinearData=useMemo(()=>null==linearData?void 0:linearData.map(_ref2=>{let{data:data,...config}=_ref2;const filteredData=xAxisDefinition&&xAxisDefinition.length>0?data.filter(point=>{const maxIndex=xAxisDefinition.length-1;return point.xCoordinate>=0&&point.xCoordinate<=maxIndex}):data;return{data:pagination?getFormattedLinearData(filteredData,currentPage,pagination):filteredData,...config}}),[pagination,linearData,currentPage,xAxisDefinition]),flattenedAndReducedBarData=flattenAndReduceBarData(barData),{flatBarData:flatBarData,flatLinearData:flatLinearData}=flattenData(formattedData,linearData),{flatBarData:fullFlatBarData}=flattenData(barData,linearData),{maxBarValue:maxBarValue,maxLinearValue:maxLinearValue}=getMaxValues(flattenedAndReducedBarData,flatLinearData,levels),withLinearData=!isEmpty(flatLinearData),withBarData=!isEmpty(fullFlatBarData),visibleLabelsCount=(null==xAxisDefinition||null===(_xAxisDefinition$filt=xAxisDefinition.filter(item=>item.mainLabel||item.secondaryLabel))||void 0===_xAxisDefinition$filt?void 0:_xAxisDefinition$filt.length)||0,{TOTAL_HEIGHT:TOTAL_HEIGHT,TOTAL_WIDTH:TOTAL_WIDTH,GRAPH_X_END:GRAPH_X_END,GRAPH_X_START:GRAPH_X_START,GRAPH_Y_END:GRAPH_Y_END,GRAPH_Y_START:GRAPH_Y_START}=getGraphAttributes(containerWidth,containerHeight,marginLeft,marginRight,marginBottom,pagination?0:minBarWidth,(null===(_formattedData$=formattedData[0])||void 0===_formattedData$?void 0:_formattedData$.length)||visibleLabelsCount,barPadding,groups,spacingOptions),[linearLowerBound,linearUpperBound]=getBounds(maxLinearValue,yAxisTicks),[barLowerBound,barUpperBound]=getBounds(maxBarValue,yAxisTicks,useMaxBarValue),maxAbsoluteValue=Math.max(linearUpperBound,barUpperBound),barMaxValue=singleYAxis?maxAbsoluteValue:barUpperBound,yAxis=d3.scaleLinear().domain([barLowerBound,barMaxValue]).range([GRAPH_Y_START,GRAPH_Y_END]),xAxis=d3.scaleBand().domain(d3.range((null===(_formattedData$2=formattedData[0])||void 0===_formattedData$2?void 0:_formattedData$2.length)||(null==xAxisDefinition?void 0:xAxisDefinition.length)||0)).range([GRAPH_X_START,GRAPH_X_END]).paddingInner(barPadding).paddingOuter(null!=barPaddingOuter?barPaddingOuter:barPadding),groupWidth=fullSizeBars?GRAPH_X_END:xAxis.bandwidth(),xSubAxis=d3.scaleBand().domain(d3.range(groups)).range([0,groupWidth]).padding(barPadding),barWidth=xSubAxis.bandwidth(),linearYAxis=singleYAxis?yAxis:d3.scaleLinear().domain([linearLowerBound,linearUpperBound]).range([GRAPH_Y_START,GRAPH_Y_END]);useEffect(()=>{setCurrentPage(0)},[barData]),useEffect(()=>{setCurrentLabel(null)},[currentPage]);const{bar:barAxisLabelFormatter,linear:linearAxisLabelFormatter}=labelFormatters,{bar:barUnit,barSubtitle:barUnitSubtitle,linear:linearUnit,linearSubtitle:linearUnitSubtitle}=units,Wrapper=pagination?"div":Scroll,wrapperProps=pagination?{}:{suppressScrollX:!!pagination,suppressScrollY:!0};return withBarData||showEmptyGraphic?React.createElement("div",{className:styles.container},React.createElement("div",{ref:containerRef,className:className},React.createElement(Wrapper,_extends({},wrapperProps,{className:styles.scroll}),React.createElement("svg",{height:TOTAL_HEIGHT,width:TOTAL_WIDTH},null==gradientGenerator?void 0:gradientGenerator(),showGrid&&React.createElement(Levels,{classes:classes,graphXEnd:GRAPH_X_END,graphXStart:GRAPH_X_START,graphYStart:GRAPH_Y_START,levels:getGrid(yAxisTicks,barMaxValue,gridType),yAxis:yAxis}),formattedData.map((data,group)=>React.createElement(Bars,{barBorderRadius:barBorderRadius,barData:data,barWidth:barWidth,classes:classes,currentPage:currentPage,fullSizeBars:fullSizeBars,graphXStart:GRAPH_X_START,graphYStart:GRAPH_Y_START,graphYEnd:GRAPH_Y_END,group:group,groups:groups,groupWidth:groupWidth,highlightWidth:highlightWidth,maxBarValue:barUpperBound,onBarClick:onBarClick,padding:barPadding,selectable:selectable,setCurrentLabel:setCurrentLabel,spacingOptions:spacingOptions,totalData:barData,transitionDuration:transitionDuration,valuesOnTop:valuesOnTop,xAxis:xAxis,xSubAxis:xSubAxis,yAxis:yAxis,barRef:barRef})),formattedLinearData.map(_ref3=>{let{data:data,type:type,color:color,customLineProps:customLineProps,markers:markers}=_ref3;return React.createElement(LinearPlot,{barWidth:groupWidth,color:color,customLineProps:customLineProps,data:data,graphYStart:GRAPH_Y_START,markers:markers,type:type,xAxis:xAxis,yAxis:linearYAxis,classes:classes})}),React.createElement(Levels,{classes:classes,graphXEnd:GRAPH_X_END,graphXStart:GRAPH_X_START,graphYStart:GRAPH_Y_START,levels:levels,yAxis:yAxis}),!hideYAxis&&React.createElement(YAxis,{classes:classes,graphYEnd:GRAPH_Y_END,graphYStart:GRAPH_Y_START,maxValue:barMaxValue,setRef:marginLeftRef,textAnchor:"end",unit:barUnit,valueDecorator:barAxisLabelFormatter,x:marginLeft,yAxis:yAxis,yAxisTicks:yAxisTicks,unitSubtitle:barUnitSubtitle,graphXEnd:GRAPH_X_END}),!hideYAxis&&withLinearData&&!singleYAxis&&React.createElement(YAxis,{classes:classes,graphYEnd:GRAPH_Y_END,graphYStart:GRAPH_Y_START,maxValue:linearUpperBound,setRef:marginRightRef,textAnchor:"start",unit:linearUnit,unitSubtitle:linearUnitSubtitle,valueDecorator:linearAxisLabelFormatter,x:TOTAL_WIDTH-marginRight,yAxis:linearYAxis,yAxisTicks:yAxisTicks,graphXEnd:GRAPH_X_END,linearData:!0}),React.createElement(XAxis,{barWidth:groupWidth,classes:classes,currentLabel:currentLabel,currentPage:currentPage,data:formattedData,decoratorRenderer:decoratorRenderer,fullSizeBars:fullSizeBars,graphXEnd:GRAPH_X_END,graphXStart:GRAPH_X_START,graphYStart:GRAPH_Y_START,initialHeight:marginBottom,pagination:pagination,paginationRef:paginationRef,setRef:marginBottomRef,xAxisDefinition:pagination?xAxisDefinition.slice(currentPage*pagination,(currentPage+1)*pagination):xAxisDefinition,xAxis:xAxis,barRef:barRef})),!!pagination&&React.createElement(Pagination,{anchor:paginationRef,classes:classes,currentPage:currentPage,graphXEnd:GRAPH_X_END,graphXStart:GRAPH_X_START,parentYPosition:parentYPosition,setCurrentPage:setCurrentPage,totalPages:totalPages}))),React.createElement(Legend,{buttonProps:buttonProps,classes:classes,displayAs:displayLegendAs,style:{width:fitLegend?containerWidth-2*GRAPH_X_START:containerWidth,margin:fitLegend?"0":"0 auto"},flatData:{bar:flatBarData,linear:flatLinearData,levels:levels},references:references,title:title,labels:labels})):NoDataComponent?React.createElement(NoDataComponent,null):null};UTBarChart.propTypes={barBorderRadius:number,barData:barDataType,barPadding:number,barPaddingOuter:number,buttonProps:buttonPropsTypes,center:bool,classes:classesType,className:string,classNames:classesType,decoratorRenderer:func,displayLegendAs:string,fitLegend:bool,fullSizeBars:bool,gradientGenerator:func,gridType:string,hideYAxis:bool,highlightWidth:number,labelFormatters:objectOf(func),labels:objectOf(string),levels:levelsType,linearData:linearDataType,minBarWidth:number,NoDataComponent:func,onBarClick:func,pagination:number,references:referencesType,selectable:bool,showEmptyGraphic:bool,showGrid:bool,singleYAxis:bool,spacingOptions:objectOf(number),title:string,transitionDuration:number,units:objectOf(string),valuesOnTop:bool,xAxisDefinition:xAxisDefinitionType,yAxisProps:objectOf(shape({useMaxBarValue:bool})),yAxisTicks:number},UTBarChart.defaultProps={barBorderRadius:5,barData:[],barPadding:.15,buttonProps:{},center:!0,classes:{},classNames:{},highlightWidth:1,labelFormatters:{},labels:{},levels:[],linearData:[],minBarWidth:35,NoDataComponent:null,pagination:0,showEmptyGraphic:!1,spacingOptions:{},transitionDuration:0,units:{},yAxisTicks:6};export default WithTheme(retrieveStyle)(UTBarChart);
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { useMemo, useState, useEffect, useRef } from 'react';
+import * as d3 from 'd3';
+import Scroll from 'react-perfect-scrollbar';
+import { isEmpty } from '@widergy/web-utils/lib/array';
+import { func, bool, string, number, objectOf, shape } from 'prop-types';
+import { useComponentDimensions, useComponentPosition } from '@widergy/energy-hooks';
+import { mergeClasses } from '../../utils/classesUtils';
+import { classesType } from '../../types/commonTypes';
+import WithTheme from '../../components/WithTheme';
+import { retrieveStyle } from './theme';
+import { getPages, getFormattedData, getFormattedLinearData, getGraphAttributes, getGrid, flattenData, flattenAndReduceBarData, getMaxValues, getBounds } from './utils';
+import useDynamicMargins from './hooks/use-dynamic-margins';
+import styles from './styles.module.scss';
+import YAxis from './components/YAxis';
+import XAxis from './components/XAxis';
+import Bars from './components/Bars';
+import LinearPlot from './components/LinearPlot';
+import Levels from './components/Levels';
+import Pagination from './components/Pagination';
+import Legend from './components/Legend';
+import { barDataType, linearDataType, levelsType, referencesType, xAxisDefinitionType, buttonPropsTypes } from './types';
+const UTBarChart = _ref => {
+  var _xAxisDefinition$filt, _formattedData$, _formattedData$2;
+  let {
+    barBorderRadius,
+    barData,
+    barPadding,
+    barPaddingOuter,
+    buttonProps,
+    center,
+    classes: theme,
+    className,
+    classNames,
+    decoratorRenderer,
+    displayLegendAs,
+    fitLegend,
+    fullSizeBars,
+    gradientGenerator,
+    gridType = 'grid',
+    hideYAxis,
+    highlightWidth,
+    labelFormatters,
+    labels,
+    levels,
+    linearData,
+    minBarWidth,
+    NoDataComponent,
+    onBarClick,
+    pagination,
+    references,
+    selectable,
+    showEmptyGraphic,
+    showGrid,
+    singleYAxis,
+    spacingOptions,
+    title,
+    transitionDuration,
+    units,
+    valuesOnTop,
+    xAxisDefinition,
+    yAxisProps = {},
+    yAxisTicks
+  } = _ref;
+  const classes = mergeClasses(theme, classNames);
+  const {
+    useMaxBarValue = false
+  } = yAxisProps || {};
+  const [currentPage, setCurrentPage] = useState(0);
+  const [currentLabel, setCurrentLabel] = useState();
+  const {
+    marginLeftRef,
+    marginRightRef,
+    marginBottomRef,
+    marginBottom,
+    marginRight,
+    marginLeft
+  } = useDynamicMargins(center, spacingOptions);
+  const {
+    ref: containerRef,
+    width: containerWidth,
+    height: containerHeight
+  } = useComponentDimensions();
+  const {
+    y: parentYPosition
+  } = useComponentPosition({
+    externalRef: containerRef
+  });
+  const paginationRef = useRef();
+  const barRef = useRef({});
+  const groups = barData.length;
+  const totalPages = useMemo(() => getPages(barData[0], pagination), [barData, pagination]);
+  const formattedData = useMemo(() => pagination ? barData === null || barData === void 0 ? void 0 : barData.map(data => getFormattedData(data, pagination, currentPage)) : barData, [pagination, barData, currentPage]);
+  const formattedLinearData = useMemo(() => linearData === null || linearData === void 0 ? void 0 : linearData.map(_ref2 => {
+    let {
+      data,
+      ...config
+    } = _ref2;
+    const filteredData = xAxisDefinition && xAxisDefinition.length > 0 ? data.filter(point => {
+      const maxIndex = xAxisDefinition.length - 1;
+      return point.xCoordinate >= 0 && point.xCoordinate <= maxIndex;
+    }) : data;
+    return {
+      data: pagination ? getFormattedLinearData(filteredData, currentPage, pagination) : filteredData,
+      ...config
+    };
+  }), [pagination, linearData, currentPage, xAxisDefinition]);
+  const flattenedAndReducedBarData = flattenAndReduceBarData(barData);
+  const {
+    flatBarData,
+    flatLinearData
+  } = flattenData(formattedData, linearData);
+  const {
+    flatBarData: fullFlatBarData
+  } = flattenData(barData, linearData);
+  const {
+    maxBarValue,
+    maxLinearValue
+  } = getMaxValues(flattenedAndReducedBarData, flatLinearData, levels);
+  const withLinearData = !isEmpty(flatLinearData);
+  const withBarData = !isEmpty(fullFlatBarData);
+  const visibleLabelsCount = (xAxisDefinition === null || xAxisDefinition === void 0 || (_xAxisDefinition$filt = xAxisDefinition.filter(item => item.mainLabel || item.secondaryLabel)) === null || _xAxisDefinition$filt === void 0 ? void 0 : _xAxisDefinition$filt.length) || 0;
+  const {
+    TOTAL_HEIGHT,
+    TOTAL_WIDTH,
+    GRAPH_X_END,
+    GRAPH_X_START,
+    GRAPH_Y_END,
+    GRAPH_Y_START
+  } = getGraphAttributes(containerWidth, containerHeight, marginLeft, marginRight, marginBottom, pagination ? 0 : minBarWidth, ((_formattedData$ = formattedData[0]) === null || _formattedData$ === void 0 ? void 0 : _formattedData$.length) || visibleLabelsCount, barPadding, groups, spacingOptions);
+  const [linearLowerBound, linearUpperBound] = getBounds(maxLinearValue, yAxisTicks);
+  const [barLowerBound, barUpperBound] = getBounds(maxBarValue, yAxisTicks, useMaxBarValue);
+  const maxAbsoluteValue = Math.max(linearUpperBound, barUpperBound);
+  const barMaxValue = singleYAxis ? maxAbsoluteValue : barUpperBound;
+  const yAxis = d3.scaleLinear().domain([barLowerBound, barMaxValue]).range([GRAPH_Y_START, GRAPH_Y_END]);
+  const xAxis = d3.scaleBand().domain(d3.range(((_formattedData$2 = formattedData[0]) === null || _formattedData$2 === void 0 ? void 0 : _formattedData$2.length) || (xAxisDefinition === null || xAxisDefinition === void 0 ? void 0 : xAxisDefinition.length) || 0)).range([GRAPH_X_START, GRAPH_X_END]).paddingInner(barPadding).paddingOuter(barPaddingOuter !== null && barPaddingOuter !== void 0 ? barPaddingOuter : barPadding);
+  const groupWidth = fullSizeBars ? GRAPH_X_END : xAxis.bandwidth();
+  const xSubAxis = d3.scaleBand().domain(d3.range(groups)).range([0, groupWidth]).padding(barPadding);
+  const barWidth = xSubAxis.bandwidth();
+  const linearYAxis = singleYAxis ? yAxis : d3.scaleLinear().domain([linearLowerBound, linearUpperBound]).range([GRAPH_Y_START, GRAPH_Y_END]);
+  useEffect(() => {
+    setCurrentPage(0);
+  }, [barData]);
+  useEffect(() => {
+    setCurrentLabel(null);
+  }, [currentPage]);
+  const {
+    bar: barAxisLabelFormatter,
+    linear: linearAxisLabelFormatter
+  } = labelFormatters;
+  const {
+    bar: barUnit,
+    barSubtitle: barUnitSubtitle,
+    linear: linearUnit,
+    linearSubtitle: linearUnitSubtitle
+  } = units;
+  const Wrapper = pagination ? 'div' : Scroll;
+  const wrapperProps = pagination ? {} : {
+    suppressScrollX: !!pagination,
+    suppressScrollY: true
+  };
+  return !withBarData && !showEmptyGraphic ? NoDataComponent ? /*#__PURE__*/React.createElement(NoDataComponent, null) : null : /*#__PURE__*/React.createElement("div", {
+    className: styles.container
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: containerRef,
+    className: className
+  }, /*#__PURE__*/React.createElement(Wrapper, _extends({}, wrapperProps, {
+    className: styles.scroll
+  }), /*#__PURE__*/React.createElement("svg", {
+    height: TOTAL_HEIGHT,
+    width: TOTAL_WIDTH
+  }, gradientGenerator === null || gradientGenerator === void 0 ? void 0 : gradientGenerator(), showGrid && /*#__PURE__*/React.createElement(Levels, {
+    classes: classes,
+    graphXEnd: GRAPH_X_END,
+    graphXStart: GRAPH_X_START,
+    graphYStart: GRAPH_Y_START,
+    levels: getGrid(yAxisTicks, barMaxValue, gridType),
+    yAxis: yAxis
+  }), formattedData.map((data, group) => /*#__PURE__*/React.createElement(Bars, {
+    barBorderRadius: barBorderRadius,
+    barData: data,
+    barWidth: barWidth,
+    classes: classes,
+    currentPage: currentPage,
+    fullSizeBars: fullSizeBars,
+    graphXStart: GRAPH_X_START,
+    graphYStart: GRAPH_Y_START,
+    graphYEnd: GRAPH_Y_END,
+    group: group,
+    groups: groups,
+    groupWidth: groupWidth,
+    highlightWidth: highlightWidth,
+    maxBarValue: barUpperBound,
+    onBarClick: onBarClick,
+    padding: barPadding,
+    selectable: selectable,
+    setCurrentLabel: setCurrentLabel,
+    spacingOptions: spacingOptions,
+    totalData: barData,
+    transitionDuration: transitionDuration,
+    valuesOnTop: valuesOnTop,
+    xAxis: xAxis,
+    xSubAxis: xSubAxis,
+    yAxis: yAxis,
+    barRef: barRef
+  })), formattedLinearData.map(_ref3 => {
+    let {
+      data,
+      type,
+      color,
+      customLineProps,
+      markers
+    } = _ref3;
+    return /*#__PURE__*/React.createElement(LinearPlot, {
+      barWidth: groupWidth,
+      color: color,
+      customLineProps: customLineProps,
+      data: data,
+      graphYStart: GRAPH_Y_START,
+      markers: markers,
+      type: type,
+      xAxis: xAxis,
+      yAxis: linearYAxis,
+      classes: classes
+    });
+  }), /*#__PURE__*/React.createElement(Levels, {
+    classes: classes,
+    graphXEnd: GRAPH_X_END,
+    graphXStart: GRAPH_X_START,
+    graphYStart: GRAPH_Y_START,
+    levels: levels,
+    yAxis: yAxis
+  }), !hideYAxis && /*#__PURE__*/React.createElement(YAxis, {
+    classes: classes,
+    graphYEnd: GRAPH_Y_END,
+    graphYStart: GRAPH_Y_START,
+    maxValue: barMaxValue,
+    setRef: marginLeftRef,
+    textAnchor: "end",
+    unit: barUnit,
+    valueDecorator: barAxisLabelFormatter,
+    x: marginLeft,
+    yAxis: yAxis,
+    yAxisTicks: yAxisTicks,
+    unitSubtitle: barUnitSubtitle,
+    graphXEnd: GRAPH_X_END
+  }), !hideYAxis && withLinearData && !singleYAxis && /*#__PURE__*/React.createElement(YAxis, {
+    classes: classes,
+    graphYEnd: GRAPH_Y_END,
+    graphYStart: GRAPH_Y_START,
+    maxValue: linearUpperBound,
+    setRef: marginRightRef,
+    textAnchor: "start",
+    unit: linearUnit,
+    unitSubtitle: linearUnitSubtitle,
+    valueDecorator: linearAxisLabelFormatter,
+    x: TOTAL_WIDTH - marginRight,
+    yAxis: linearYAxis,
+    yAxisTicks: yAxisTicks,
+    graphXEnd: GRAPH_X_END,
+    linearData: true
+  }), /*#__PURE__*/React.createElement(XAxis, {
+    barWidth: groupWidth,
+    classes: classes,
+    currentLabel: currentLabel,
+    currentPage: currentPage,
+    data: formattedData,
+    decoratorRenderer: decoratorRenderer,
+    fullSizeBars: fullSizeBars,
+    graphXEnd: GRAPH_X_END,
+    graphXStart: GRAPH_X_START,
+    graphYStart: GRAPH_Y_START,
+    initialHeight: marginBottom,
+    pagination: pagination,
+    paginationRef: paginationRef,
+    setRef: marginBottomRef,
+    xAxisDefinition: pagination ? xAxisDefinition.slice(currentPage * pagination, (currentPage + 1) * pagination) : xAxisDefinition,
+    xAxis: xAxis,
+    barRef: barRef
+  })), !!pagination && /*#__PURE__*/React.createElement(Pagination, {
+    anchor: paginationRef,
+    classes: classes,
+    currentPage: currentPage,
+    graphXEnd: GRAPH_X_END,
+    graphXStart: GRAPH_X_START,
+    parentYPosition: parentYPosition,
+    setCurrentPage: setCurrentPage,
+    totalPages: totalPages
+  }))), /*#__PURE__*/React.createElement(Legend, {
+    buttonProps: buttonProps,
+    classes: classes,
+    displayAs: displayLegendAs,
+    style: {
+      width: fitLegend ? containerWidth - 2 * GRAPH_X_START : containerWidth,
+      margin: fitLegend ? '0' : '0 auto'
+    },
+    flatData: {
+      bar: flatBarData,
+      linear: flatLinearData,
+      levels
+    },
+    references: references,
+    title: title,
+    labels: labels
+  }));
+};
+UTBarChart.propTypes = {
+  barBorderRadius: number,
+  barData: barDataType,
+  barPadding: number,
+  barPaddingOuter: number,
+  buttonProps: buttonPropsTypes,
+  center: bool,
+  classes: classesType,
+  className: string,
+  classNames: classesType,
+  decoratorRenderer: func,
+  displayLegendAs: string,
+  fitLegend: bool,
+  fullSizeBars: bool,
+  gradientGenerator: func,
+  gridType: string,
+  hideYAxis: bool,
+  highlightWidth: number,
+  labelFormatters: objectOf(func),
+  labels: objectOf(string),
+  levels: levelsType,
+  linearData: linearDataType,
+  minBarWidth: number,
+  NoDataComponent: func,
+  onBarClick: func,
+  pagination: number,
+  references: referencesType,
+  selectable: bool,
+  showEmptyGraphic: bool,
+  showGrid: bool,
+  singleYAxis: bool,
+  spacingOptions: objectOf(number),
+  title: string,
+  transitionDuration: number,
+  units: objectOf(string),
+  valuesOnTop: bool,
+  xAxisDefinition: xAxisDefinitionType,
+  yAxisProps: objectOf(shape({
+    useMaxBarValue: bool
+  })),
+  yAxisTicks: number
+};
+UTBarChart.defaultProps = {
+  barBorderRadius: 5,
+  barData: [],
+  barPadding: 0.15,
+  buttonProps: {},
+  center: true,
+  classes: {},
+  classNames: {},
+  highlightWidth: 1,
+  labelFormatters: {},
+  labels: {},
+  levels: [],
+  linearData: [],
+  minBarWidth: 35,
+  NoDataComponent: null,
+  pagination: 0,
+  showEmptyGraphic: false,
+  spacingOptions: {},
+  transitionDuration: 0,
+  units: {},
+  yAxisTicks: 6
+};
+export default WithTheme(retrieveStyle)(UTBarChart);

package/dist/esm/deprecated/UTBarChart/theme.js

@@ -1 +1,113 @@
-import{getIn}from"seamless-immutable";import{withImportant}from"../../utils/classesUtils";export const retrieveStyle=_ref=>{var _theme$UTBarChart,_theme$UTBarChart2,_theme$UTBarChart3,_theme$UTBarChart4,_theme$UTBarChart5,_theme$UTBarChart6;let{theme:theme}=_ref;return{solidLevel:{strokeWidth:getIn(theme,["UTBarChart","solidLevel","strokeWidth"],1),stroke:getIn(theme,["UTBarChart","solidLevel","stroke"])},dashedLevel:{strokeWidth:getIn(theme,["UTBarChart","dashedLevel","strokeWidth"],1),strokeDasharray:getIn(theme,["UTBarChart","dashedLevel","strokeDasharray"],2.2),stroke:getIn(theme,["UTBarChart","dashedLevel","stroke"])},dottedLevel:{strokeWidth:getIn(theme,["UTBarChart","dottedLevel","strokeWidth"],2),strokeDasharray:getIn(theme,["UTBarChart","dottedLevel","strokeDasharray"],4),stroke:getIn(theme,["UTBarChart","dottedLevel","stroke"])},gridLine:{strokeWidth:getIn(theme,["UTBarChart","gridLine","strokeWidth"],1),strokeDasharray:getIn(theme,["UTBarChart","gridLine","strokeDasharray"],5.5),stroke:getIn(theme,["UTBarChart","gridLine","stroke"])},legendItemLabel:{fontSize:getIn(theme,["UTBarChart","legendItemLabel","fontSize"]),fontWeight:getIn(theme,["UTBarChart","legendItemLabel","fontWeight"]),fontFamily:getIn(theme,["UTBarChart","Fonts","fontFamily"]),color:getIn(theme,["UTBarChart","legendItemLabel","color"]),userSelect:"none"},showLegendButton:{backgroundColor:withImportant(null==theme||null===(_theme$UTBarChart=theme.UTBarChart)||void 0===_theme$UTBarChart||null===(_theme$UTBarChart=_theme$UTBarChart.showLegendButton)||void 0===_theme$UTBarChart?void 0:_theme$UTBarChart.backgroundColor),padding:withImportant(null==theme||null===(_theme$UTBarChart2=theme.UTBarChart)||void 0===_theme$UTBarChart2||null===(_theme$UTBarChart2=_theme$UTBarChart2.showLegendButton)||void 0===_theme$UTBarChart2?void 0:_theme$UTBarChart2.padding),borderRadius:"0 !important"},showLegendIcon:{color:getIn(theme,["UTBarChart","showLegendIcon","color"]),marginRight:getIn(theme,["UTBarChart","showLegendIcon","marginRight"],10)},showLegendLabel:{color:withImportant(null==theme||null===(_theme$UTBarChart3=theme.UTBarChart)||void 0===_theme$UTBarChart3||null===(_theme$UTBarChart3=_theme$UTBarChart3.showLegendLabel)||void 0===_theme$UTBarChart3?void 0:_theme$UTBarChart3.color),fontFamily:null==theme||null===(_theme$UTBarChart4=theme.UTBarChart)||void 0===_theme$UTBarChart4||null===(_theme$UTBarChart4=_theme$UTBarChart4.Fonts)||void 0===_theme$UTBarChart4?void 0:_theme$UTBarChart4.fontFamily,fontSize:withImportant(null==theme||null===(_theme$UTBarChart5=theme.UTBarChart)||void 0===_theme$UTBarChart5||null===(_theme$UTBarChart5=_theme$UTBarChart5.showLegendLabel)||void 0===_theme$UTBarChart5?void 0:_theme$UTBarChart5.fontSize),fontWeight:withImportant(null==theme||null===(_theme$UTBarChart6=theme.UTBarChart)||void 0===_theme$UTBarChart6||null===(_theme$UTBarChart6=_theme$UTBarChart6.showLegendLabel)||void 0===_theme$UTBarChart6?void 0:_theme$UTBarChart6.fontWeight),userSelect:"none"},paginationButton:{color:getIn(theme,["UTBarChart","paginationButton","color"])},paginationButtonDisabled:{color:getIn(theme,["UTBarChart","paginationButtonDisabled","color"])},xAxis:{strokeWidth:getIn(theme,["UTBarChart","xAxis","strokeWidth"],1),stroke:getIn(theme,["UTBarChart","xAxis","stroke"])},xAxisMainLabel:{fontSize:getIn(theme,["UTBarChart","xAxisMainLabel","fontSize"]),fontWeight:getIn(theme,["UTBarChart","xAxisMainLabel","fontWeight"]),fontFamily:getIn(theme,["UTBarChart","Fonts","fontFamily"]),fill:getIn(theme,["UTBarChart","xAxisMainLabel","fill"]),userSelect:"none"},xAxisSelectedLabel:{fill:getIn(theme,["UTBarChart","xAxisSelectedLabel","fill"])},xAxisSecondaryLabel:{fontSize:getIn(theme,["UTBarChart","xAxisSecondaryLabel","fontSize"]),fontWeight:getIn(theme,["UTBarChart","xAxisSecondaryLabel","fontWeight"]),fontFamily:getIn(theme,["UTBarChart","Fonts","fontFamily"]),color:getIn(theme,["UTBarChart","xAxisSecondaryLabel","color"]),userSelect:"none"},decoration:{fontSize:getIn(theme,["UTBarChart","decoration","fontSize"]),fontWeight:getIn(theme,["UTBarChart","decoration","fontWeight"]),color:getIn(theme,["UTBarChart","decoration","color"]),userSelect:"none"},decorationLine:{strokeWidth:getIn(theme,["UTBarChart","decorationLine","strokeWidth"],1),strokeDasharray:getIn(theme,["UTBarChart","decorationLine","strokeDasharray"],0),stroke:getIn(theme,["UTBarChart","decorationLine","stroke"])},yAxisUnit:{fontSize:getIn(theme,["UTBarChart","yAxisUnit","fontSize"]),fontWeight:getIn(theme,["UTBarChart","yAxisUnit","fontWeight"]),fill:getIn(theme,["UTBarChart","yAxisUnit","fill"]),userSelect:"none"},yAxisLabel:{fontSize:getIn(theme,["UTBarChart","yAxisLabel","fontSize"]),fontWeight:getIn(theme,["UTBarChart","yAxisLabel","fontWeight"]),fontFamily:getIn(theme,["UTBarChart","Fonts","fontFamily"]),fill:getIn(theme,["UTBarChart","yAxisLabel","fill"]),userSelect:"none"},onTopBarLabel:{fontSize:getIn(theme,["UTBarChart","onTopBarLabel","fontSize"]),fontWeight:getIn(theme,["UTBarChart","onTopBarLabel","fontWeight"]),fontFamily:getIn(theme,["UTBarChart","Fonts","fontFamily"]),color:getIn(theme,["UTBarChart","onTopBarLabel","color"]),userSelect:"none"},tooltip:{backgroundColor:getIn(theme,["UTBarChart","tooltip","width"])}}};
+import { getIn } from 'seamless-immutable';
+import { withImportant } from '../../utils/classesUtils';
+export const retrieveStyle = _ref => {
+  var _theme$UTBarChart, _theme$UTBarChart2, _theme$UTBarChart3, _theme$UTBarChart4, _theme$UTBarChart5, _theme$UTBarChart6;
+  let {
+    theme
+  } = _ref;
+  return {
+    solidLevel: {
+      strokeWidth: getIn(theme, ['UTBarChart', 'solidLevel', 'strokeWidth'], 1),
+      stroke: getIn(theme, ['UTBarChart', 'solidLevel', 'stroke'])
+    },
+    dashedLevel: {
+      strokeWidth: getIn(theme, ['UTBarChart', 'dashedLevel', 'strokeWidth'], 1),
+      strokeDasharray: getIn(theme, ['UTBarChart', 'dashedLevel', 'strokeDasharray'], 2.2),
+      stroke: getIn(theme, ['UTBarChart', 'dashedLevel', 'stroke'])
+    },
+    dottedLevel: {
+      strokeWidth: getIn(theme, ['UTBarChart', 'dottedLevel', 'strokeWidth'], 2),
+      strokeDasharray: getIn(theme, ['UTBarChart', 'dottedLevel', 'strokeDasharray'], 4),
+      stroke: getIn(theme, ['UTBarChart', 'dottedLevel', 'stroke'])
+    },
+    gridLine: {
+      strokeWidth: getIn(theme, ['UTBarChart', 'gridLine', 'strokeWidth'], 1),
+      strokeDasharray: getIn(theme, ['UTBarChart', 'gridLine', 'strokeDasharray'], 5.5),
+      stroke: getIn(theme, ['UTBarChart', 'gridLine', 'stroke'])
+    },
+    legendItemLabel: {
+      fontSize: getIn(theme, ['UTBarChart', 'legendItemLabel', 'fontSize']),
+      fontWeight: getIn(theme, ['UTBarChart', 'legendItemLabel', 'fontWeight']),
+      fontFamily: getIn(theme, ['UTBarChart', 'Fonts', 'fontFamily']),
+      color: getIn(theme, ['UTBarChart', 'legendItemLabel', 'color']),
+      userSelect: 'none'
+    },
+    showLegendButton: {
+      backgroundColor: withImportant(theme === null || theme === void 0 || (_theme$UTBarChart = theme.UTBarChart) === null || _theme$UTBarChart === void 0 || (_theme$UTBarChart = _theme$UTBarChart.showLegendButton) === null || _theme$UTBarChart === void 0 ? void 0 : _theme$UTBarChart.backgroundColor),
+      padding: withImportant(theme === null || theme === void 0 || (_theme$UTBarChart2 = theme.UTBarChart) === null || _theme$UTBarChart2 === void 0 || (_theme$UTBarChart2 = _theme$UTBarChart2.showLegendButton) === null || _theme$UTBarChart2 === void 0 ? void 0 : _theme$UTBarChart2.padding),
+      borderRadius: '0 !important'
+    },
+    showLegendIcon: {
+      color: getIn(theme, ['UTBarChart', 'showLegendIcon', 'color']),
+      marginRight: getIn(theme, ['UTBarChart', 'showLegendIcon', 'marginRight'], 10)
+    },
+    showLegendLabel: {
+      color: withImportant(theme === null || theme === void 0 || (_theme$UTBarChart3 = theme.UTBarChart) === null || _theme$UTBarChart3 === void 0 || (_theme$UTBarChart3 = _theme$UTBarChart3.showLegendLabel) === null || _theme$UTBarChart3 === void 0 ? void 0 : _theme$UTBarChart3.color),
+      fontFamily: theme === null || theme === void 0 || (_theme$UTBarChart4 = theme.UTBarChart) === null || _theme$UTBarChart4 === void 0 || (_theme$UTBarChart4 = _theme$UTBarChart4.Fonts) === null || _theme$UTBarChart4 === void 0 ? void 0 : _theme$UTBarChart4.fontFamily,
+      fontSize: withImportant(theme === null || theme === void 0 || (_theme$UTBarChart5 = theme.UTBarChart) === null || _theme$UTBarChart5 === void 0 || (_theme$UTBarChart5 = _theme$UTBarChart5.showLegendLabel) === null || _theme$UTBarChart5 === void 0 ? void 0 : _theme$UTBarChart5.fontSize),
+      fontWeight: withImportant(theme === null || theme === void 0 || (_theme$UTBarChart6 = theme.UTBarChart) === null || _theme$UTBarChart6 === void 0 || (_theme$UTBarChart6 = _theme$UTBarChart6.showLegendLabel) === null || _theme$UTBarChart6 === void 0 ? void 0 : _theme$UTBarChart6.fontWeight),
+      userSelect: 'none'
+    },
+    paginationButton: {
+      color: getIn(theme, ['UTBarChart', 'paginationButton', 'color'])
+    },
+    paginationButtonDisabled: {
+      color: getIn(theme, ['UTBarChart', 'paginationButtonDisabled', 'color'])
+    },
+    xAxis: {
+      strokeWidth: getIn(theme, ['UTBarChart', 'xAxis', 'strokeWidth'], 1),
+      stroke: getIn(theme, ['UTBarChart', 'xAxis', 'stroke'])
+    },
+    xAxisMainLabel: {
+      fontSize: getIn(theme, ['UTBarChart', 'xAxisMainLabel', 'fontSize']),
+      fontWeight: getIn(theme, ['UTBarChart', 'xAxisMainLabel', 'fontWeight']),
+      fontFamily: getIn(theme, ['UTBarChart', 'Fonts', 'fontFamily']),
+      fill: getIn(theme, ['UTBarChart', 'xAxisMainLabel', 'fill']),
+      userSelect: 'none'
+    },
+    xAxisSelectedLabel: {
+      fill: getIn(theme, ['UTBarChart', 'xAxisSelectedLabel', 'fill'])
+    },
+    xAxisSecondaryLabel: {
+      fontSize: getIn(theme, ['UTBarChart', 'xAxisSecondaryLabel', 'fontSize']),
+      fontWeight: getIn(theme, ['UTBarChart', 'xAxisSecondaryLabel', 'fontWeight']),
+      fontFamily: getIn(theme, ['UTBarChart', 'Fonts', 'fontFamily']),
+      color: getIn(theme, ['UTBarChart', 'xAxisSecondaryLabel', 'color']),
+      userSelect: 'none'
+    },
+    decoration: {
+      fontSize: getIn(theme, ['UTBarChart', 'decoration', 'fontSize']),
+      fontWeight: getIn(theme, ['UTBarChart', 'decoration', 'fontWeight']),
+      color: getIn(theme, ['UTBarChart', 'decoration', 'color']),
+      userSelect: 'none'
+    },
+    decorationLine: {
+      strokeWidth: getIn(theme, ['UTBarChart', 'decorationLine', 'strokeWidth'], 1),
+      strokeDasharray: getIn(theme, ['UTBarChart', 'decorationLine', 'strokeDasharray'], 0),
+      stroke: getIn(theme, ['UTBarChart', 'decorationLine', 'stroke'])
+    },
+    yAxisUnit: {
+      fontSize: getIn(theme, ['UTBarChart', 'yAxisUnit', 'fontSize']),
+      fontWeight: getIn(theme, ['UTBarChart', 'yAxisUnit', 'fontWeight']),
+      fill: getIn(theme, ['UTBarChart', 'yAxisUnit', 'fill']),
+      userSelect: 'none'
+    },
+    yAxisLabel: {
+      fontSize: getIn(theme, ['UTBarChart', 'yAxisLabel', 'fontSize']),
+      fontWeight: getIn(theme, ['UTBarChart', 'yAxisLabel', 'fontWeight']),
+      fontFamily: getIn(theme, ['UTBarChart', 'Fonts', 'fontFamily']),
+      fill: getIn(theme, ['UTBarChart', 'yAxisLabel', 'fill']),
+      userSelect: 'none'
+    },
+    onTopBarLabel: {
+      fontSize: getIn(theme, ['UTBarChart', 'onTopBarLabel', 'fontSize']),
+      fontWeight: getIn(theme, ['UTBarChart', 'onTopBarLabel', 'fontWeight']),
+      fontFamily: getIn(theme, ['UTBarChart', 'Fonts', 'fontFamily']),
+      color: getIn(theme, ['UTBarChart', 'onTopBarLabel', 'color']),
+      userSelect: 'none'
+    },
+    tooltip: {
+      backgroundColor: getIn(theme, ['UTBarChart', 'tooltip', 'width'])
+    }
+  };
+};

package/dist/esm/deprecated/UTBarChart/types.js

@@ -1 +1,56 @@
-import{elementType,bool,string,number,arrayOf,shape,func,oneOfType}from"prop-types";export const barType=shape({clickable:bool,color:string,highlightColor:string,highlighted:string,tooltipContent:string,value:number,values:arrayOf(shape({clickable:bool,color:string,highlightColor:string,highlighted:string,tooltipContent:string,value:number}))});export const barDataType=arrayOf(oneOfType([arrayOf(barType),barType]));export const linearMarkersType=shape({type:string});export const linearType=shape({color:string,data:arrayOf({xCoodrinate:number,value:number}),marker:linearMarkersType,type:string});export const linearDataType=arrayOf(linearType);export const levelsType=arrayOf(shape({value:number,color:string,id:string}));export const referencesType=shape({check:func,className:string,CustomIcon:elementType,id:string,label:string,orderFunction:func});export const xAxisDefinitionType=arrayOf(shape({labelBackgroundPadding:number,mainLabel:string,secondaryLabel:string,selectedLabelBackground:string}));export const buttonPropsTypes=shape({colorTheme:string,iconPlacement:string,size:string,variant:string});
+import { elementType, bool, string, number, arrayOf, shape, func, oneOfType } from 'prop-types';
+export const barType = shape({
+  clickable: bool,
+  color: string,
+  highlightColor: string,
+  highlighted: string,
+  tooltipContent: string,
+  value: number,
+  values: arrayOf(shape({
+    clickable: bool,
+    color: string,
+    highlightColor: string,
+    highlighted: string,
+    tooltipContent: string,
+    value: number
+  }))
+});
+export const barDataType = arrayOf(oneOfType([arrayOf(barType), barType]));
+export const linearMarkersType = shape({
+  type: string
+});
+export const linearType = shape({
+  color: string,
+  data: arrayOf({
+    xCoodrinate: number,
+    value: number
+  }),
+  marker: linearMarkersType,
+  type: string
+});
+export const linearDataType = arrayOf(linearType);
+export const levelsType = arrayOf(shape({
+  value: number,
+  color: string,
+  id: string
+}));
+export const referencesType = shape({
+  check: func,
+  className: string,
+  CustomIcon: elementType,
+  id: string,
+  label: string,
+  orderFunction: func
+});
+export const xAxisDefinitionType = arrayOf(shape({
+  labelBackgroundPadding: number,
+  mainLabel: string,
+  secondaryLabel: string,
+  selectedLabelBackground: string
+}));
+export const buttonPropsTypes = shape({
+  colorTheme: string,
+  iconPlacement: string,
+  size: string,
+  variant: string
+});