@widergy/energy-ui 3.158.1 → 3.160.0

package/dist/esm/deprecated/UTBarChart/components/XAxis/components/AxisElement/index.js

@@ -0,0 +1,90 @@
+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, { useState } from 'react';
+import { string, number, bool, object } from 'prop-types';
+const AxisElement = _ref => {
+  var _textRef$getBoundingC, _textRef$getBoundingC2, _textRef$getBoundingC3, _textRef$getBoundingC4, _textRef$getBoundingC5;
+  let {
+    barRef,
+    circle,
+    className,
+    color,
+    graphYStart,
+    labelBackgroundPadding,
+    labelYOffset,
+    mainLabel,
+    mainLabelDataTestId,
+    mainLabelStyles,
+    secondaryLabel,
+    secondaryLabelDataTestId,
+    selected,
+    selectedLabelBackground,
+    square,
+    x,
+    yOffset
+  } = _ref;
+  const y = graphYStart + yOffset;
+  const [textRef, setTextRef] = useState();
+  return /*#__PURE__*/React.createElement("g", null, secondaryLabel && /*#__PURE__*/React.createElement("text", {
+    className: className,
+    "data-testid": secondaryLabelDataTestId,
+    fill: color,
+    textAnchor: "middle",
+    x: x,
+    y: y
+  }, secondaryLabel), mainLabel && /*#__PURE__*/React.createElement("g", null, circle && /*#__PURE__*/React.createElement("circle", _extends({
+    cx: x,
+    cy: y + yOffset + (circle.yOffset || 0)
+  }, circle)), square && /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "round-corner"
+  }, /*#__PURE__*/React.createElement("rect", _extends({
+    x: barRef.current.position,
+    y: y - (square.clipYOffset || 0),
+    width: barRef.current.width,
+    height: (textRef === null || textRef === void 0 || (_textRef$getBoundingC = textRef.getBoundingClientRect()) === null || _textRef$getBoundingC === void 0 ? void 0 : _textRef$getBoundingC.height) + (square.clipHeightModifier || 0)
+  }, square)))), /*#__PURE__*/React.createElement("rect", {
+    x: barRef.current.position,
+    y: y + (square.yOffset || 0),
+    width: barRef.current.width,
+    height: (textRef === null || textRef === void 0 || (_textRef$getBoundingC2 = textRef.getBoundingClientRect()) === null || _textRef$getBoundingC2 === void 0 ? void 0 : _textRef$getBoundingC2.height) + (square.heightModifier || 0),
+    fill: square.fill,
+    clipPath: "url(#round-corner)"
+  })), selected && /*#__PURE__*/React.createElement("rect", {
+    x: x - (textRef === null || textRef === void 0 || (_textRef$getBoundingC3 = textRef.getBoundingClientRect()) === null || _textRef$getBoundingC3 === void 0 ? void 0 : _textRef$getBoundingC3.width) / 2 - labelBackgroundPadding,
+    y: y,
+    width: (textRef === null || textRef === void 0 || (_textRef$getBoundingC4 = textRef.getBoundingClientRect()) === null || _textRef$getBoundingC4 === void 0 ? void 0 : _textRef$getBoundingC4.width) + labelBackgroundPadding * 2,
+    height: (textRef === null || textRef === void 0 || (_textRef$getBoundingC5 = textRef.getBoundingClientRect()) === null || _textRef$getBoundingC5 === void 0 ? void 0 : _textRef$getBoundingC5.height) + labelBackgroundPadding,
+    fill: selectedLabelBackground,
+    rx: "14"
+  }), /*#__PURE__*/React.createElement("text", _extends({
+    className: className,
+    "data-testid": mainLabelDataTestId,
+    fill: color,
+    ref: el => setTextRef(el),
+    textAnchor: "middle",
+    x: x,
+    y: y + yOffset + labelYOffset
+  }, mainLabelStyles), mainLabel)));
+};
+AxisElement.propTypes = {
+  barRef: object,
+  borderSelector: object,
+  circle: object,
+  className: string,
+  color: string,
+  graphYEnd: number,
+  graphYStart: number,
+  isActive: bool,
+  labelBackgroundPadding: number,
+  labelYOffset: number,
+  mainLabel: string,
+  mainLabelDataTestId: string,
+  mainLabelStyles: object,
+  secondaryLabel: string,
+  secondaryLabelDataTestId: string,
+  selected: bool,
+  selectedLabelBackground: string,
+  square: object,
+  x: number,
+  yOffset: number
+};
+export default AxisElement;

package/dist/esm/deprecated/UTBarChart/components/XAxis/components/Decoration/constants.js

@@ -0,0 +1,2 @@
+export const LINE_PADDING_X = 5;
+export const LINE_PADDING_Y = 20;

package/dist/esm/deprecated/UTBarChart/components/XAxis/components/Decoration/index.js

@@ -0,0 +1,50 @@
+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 from 'react';
+import { shape, string, number, bool, objectOf } from 'prop-types';
+import { classesType } from '../../../../../../types/commonTypes';
+import { LINE_PADDING_X, LINE_PADDING_Y } from './constants';
+const Decoration = _ref => {
+  let {
+    decoration,
+    barWidth,
+    graphYStart,
+    offset,
+    classes
+  } = _ref;
+  const {
+    x,
+    label,
+    position,
+    textAnchor,
+    textProps = {},
+    withLine
+  } = decoration;
+  const xCoordinate = x + (position === 'center' ? barWidth / 2 : 0);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("text", _extends({
+    className: classes.decoration,
+    textAnchor: textAnchor,
+    x: xCoordinate,
+    y: graphYStart + offset
+  }, textProps), label), withLine && /*#__PURE__*/React.createElement("line", {
+    x1: xCoordinate - LINE_PADDING_X,
+    y1: graphYStart + LINE_PADDING_Y,
+    x2: xCoordinate - LINE_PADDING_X,
+    y2: graphYStart + offset,
+    className: classes.decorationLine
+  }));
+};
+Decoration.propTypes = {
+  decoration: shape({
+    x: number,
+    label: string,
+    withLine: bool,
+    position: string,
+    textAnchor: string,
+    textProps: objectOf(string)
+  }),
+  barWidth: number,
+  graphYStart: number,
+  offset: number,
+  classes: classesType
+};
+export default Decoration;

package/dist/esm/deprecated/UTBarChart/components/XAxis/constants.js

@@ -0,0 +1 @@
+export const Y_OFFSET = 20;

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

@@ -0,0 +1,133 @@
+import React, { useEffect, useState, useMemo } from 'react';
+import { number, func, object, bool } from 'prop-types';
+import { getFormattedDecorators } from '../../utils';
+import { barDataType, xAxisDefinitionType } from '../../types';
+import { classesType, refType } from '../../../../types/commonTypes';
+import { TEST_IDS } from '../../../../constants/testIds';
+import AxisElement from './components/AxisElement';
+import Decoration from './components/Decoration';
+import { Y_OFFSET } from './constants';
+const {
+  barChart
+} = TEST_IDS;
+const XAxis = _ref => {
+  let {
+    data,
+    setRef,
+    classes,
+    barWidth,
+    xAxisDefinition,
+    xAxis,
+    fullSizeBars,
+    graphYStart,
+    graphXStart,
+    graphXEnd,
+    decoratorRenderer,
+    pagination,
+    currentPage,
+    initialHeight,
+    paginationRef,
+    currentLabel,
+    barRef
+  } = _ref;
+  const xOffset = barWidth / 2;
+  const decorations = useMemo(() => decoratorRenderer === null || decoratorRenderer === void 0 ? void 0 : decoratorRenderer({
+    data,
+    currentPage,
+    pagination
+  }), [data, currentPage, pagination, decoratorRenderer]) || [];
+  const [offset, setOffset] = useState(0);
+  const formattedDecorators = useMemo(() => getFormattedDecorators(xAxis, decorations, currentPage, pagination), [decorations]);
+  useEffect(() => {
+    if (!offset && initialHeight > 0) {
+      setOffset(initialHeight);
+    }
+  }, [initialHeight]);
+  return /*#__PURE__*/React.createElement("g", {
+    ref: offset ? setRef : null
+  }, /*#__PURE__*/React.createElement("g", {
+    ref: !offset ? setRef : null
+  }, /*#__PURE__*/React.createElement("line", {
+    x1: graphXStart,
+    y1: graphYStart,
+    x2: graphXEnd,
+    y2: graphYStart,
+    className: classes.xAxis
+  }), /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", {
+    ref: paginationRef
+  }, xAxisDefinition.map((_ref2, index) => {
+    let {
+      mainLabel,
+      color,
+      mainLabelStyles,
+      circle,
+      selectedLabelBackground,
+      labelBackgroundPadding,
+      square,
+      customXOffset = 0,
+      labelYOffset = 0
+    } = _ref2;
+    const selected = index === currentLabel;
+    return mainLabel ? /*#__PURE__*/React.createElement(AxisElement, {
+      barRef: barRef,
+      barWidth: barWidth,
+      circle: circle,
+      className: "".concat(classes.xAxisMainLabel, " ").concat(selected && classes.xAxisSelectedLabel),
+      color: color || '',
+      graphYStart: graphYStart,
+      labelBackgroundPadding: labelBackgroundPadding,
+      labelYOffset: labelYOffset,
+      mainLabel: mainLabel,
+      mainLabelDataTestId: "".concat(barChart.xAxis.mainLabel).concat(index),
+      mainLabelStyles: mainLabelStyles,
+      selected: selected,
+      selectedLabelBackground: selectedLabelBackground,
+      square: square,
+      x: fullSizeBars ? graphXEnd / 2 + customXOffset : xAxis(index) + xOffset,
+      yOffset: Y_OFFSET
+    }) : null;
+  })), /*#__PURE__*/React.createElement("g", null, xAxisDefinition.map((_ref3, index) => {
+    let {
+      secondaryLabel,
+      color
+    } = _ref3;
+    return secondaryLabel ? /*#__PURE__*/React.createElement(AxisElement, {
+      barWidth: barWidth,
+      className: classes.xAxisSecondaryLabel,
+      color: color || '',
+      graphYStart: graphYStart,
+      secondaryLabel: secondaryLabel,
+      secondaryLabelDataTestId: "".concat(barChart.xAxis.secondaryLabel).concat(index),
+      x: xAxis(index) + xOffset,
+      yOffset: Y_OFFSET
+    }) : null;
+  })))), /*#__PURE__*/React.createElement("g", null, formattedDecorators.map(decoration => /*#__PURE__*/React.createElement(Decoration, {
+    classes: classes,
+    barWidth: barWidth,
+    xAxis: xAxis,
+    decoration: decoration,
+    offset: offset + Y_OFFSET,
+    graphYStart: graphYStart,
+    yOffset: Y_OFFSET
+  }))));
+};
+XAxis.propTypes = {
+  classes: classesType,
+  data: barDataType,
+  setRef: refType,
+  barWidth: number,
+  xAxisDefinition: xAxisDefinitionType,
+  xAxis: func,
+  fullSizeBars: bool,
+  graphYStart: number,
+  graphXStart: number,
+  graphXEnd: number,
+  decoratorRenderer: func,
+  pagination: number,
+  currentPage: number,
+  initialHeight: number,
+  paginationRef: refType,
+  currentLabel: number,
+  barRef: object
+};
+export default XAxis;

package/dist/esm/deprecated/UTBarChart/components/YAxis/AxisElement/index.js

@@ -0,0 +1,36 @@
+import { number, string, func } from 'prop-types';
+import React from 'react';
+import { refType } from '../../../../../types/commonTypes';
+const AxisElement = _ref => {
+  let {
+    x,
+    value,
+    label,
+    textAnchor,
+    yAxis,
+    height,
+    setRef,
+    className
+  } = _ref;
+  return /*#__PURE__*/React.createElement("text", {
+    className: className,
+    ref: setRef,
+    x: x,
+    y: yAxis(value) + height / 4,
+    textAnchor: textAnchor
+  }, label);
+};
+AxisElement.defaultProps = {
+  textAnchor: string
+};
+AxisElement.propTypes = {
+  label: string,
+  yAxis: func,
+  className: string,
+  x: number,
+  value: number,
+  textAnchor: string,
+  height: number,
+  setRef: refType
+};
+export default AxisElement;

package/dist/esm/deprecated/UTBarChart/components/YAxis/constants.js

@@ -0,0 +1,3 @@
+export const UNIT_PADDING = 40;
+export const DEFAULT_FORMAT = '0,0';
+export const ZERO_FORMAT = '0,0.00';

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

@@ -0,0 +1,74 @@
+import React, { useMemo, useRef } from 'react';
+import { string, number, func, bool } from 'prop-types';
+import numeral from 'numeral';
+import { classesType, refType } from '../../../../types/commonTypes';
+import { applyToIndex } from './utils';
+import AxisElement from './AxisElement';
+import { DEFAULT_FORMAT, ZERO_FORMAT, UNIT_PADDING } from './constants';
+const YAxis = _ref => {
+  var _labelRef$current, _labelRef$current$get;
+  let {
+    classes,
+    graphXEnd,
+    graphYEnd,
+    graphYStart,
+    linearData,
+    maxValue,
+    setRef,
+    textAnchor,
+    unit,
+    unitSubtitle,
+    valueDecorator = value => value,
+    x,
+    yAxis,
+    yAxisTicks
+  } = _ref;
+  const yAxisTotal = yAxisTicks - 1;
+  const labelRef = useRef();
+  const height = ((_labelRef$current = labelRef.current) === null || _labelRef$current === void 0 || (_labelRef$current$get = _labelRef$current.getBoundingClientRect) === null || _labelRef$current$get === void 0 ? void 0 : _labelRef$current$get.call(_labelRef$current).height) || 0;
+  const axis = useMemo(() => new Array(yAxisTicks).fill(0).map((_, index) => index), [yAxisTicks]);
+  const linearDataUnitXPosition = graphXEnd - graphXEnd * 0.04;
+  const unitYPosition = unitSubtitle ? (graphYEnd - UNIT_PADDING) / 2 : graphYEnd - UNIT_PADDING;
+  const unitSubtitleYPosition = graphYEnd - graphYEnd * 0.5;
+  return /*#__PURE__*/React.createElement("g", {
+    textAnchor: textAnchor,
+    ref: setRef
+  }, /*#__PURE__*/React.createElement("text", {
+    className: classes.yAxisUnit,
+    x: linearData ? linearDataUnitXPosition : x,
+    y: unitYPosition
+  }, unit), unitSubtitle && /*#__PURE__*/React.createElement("text", {
+    className: classes.yAxisUnit,
+    x: x,
+    y: unitSubtitleYPosition
+  }, unitSubtitle), axis.map(index => {
+    const value = maxValue * (1 - index / yAxisTotal);
+    return /*#__PURE__*/React.createElement(AxisElement, {
+      className: classes.yAxisLabel,
+      graphYStart: graphYStart,
+      height: height,
+      label: valueDecorator(numeral(value > 10 ? Math.round(value) : Math.fround(value)).format(value < 1 && value > 0 ? ZERO_FORMAT : DEFAULT_FORMAT)),
+      setRef: applyToIndex(0, index, labelRef),
+      value: value,
+      x: x,
+      yAxis: yAxis
+    });
+  }));
+};
+YAxis.propTypes = {
+  classes: classesType,
+  graphXEnd: number,
+  graphYEnd: number,
+  graphYStart: number,
+  linearData: bool,
+  maxValue: number,
+  setRef: refType,
+  textAnchor: string,
+  unit: string,
+  unitSubtitle: string,
+  valueDecorator: func,
+  x: number,
+  yAxis: func,
+  yAxisTicks: number
+};
+export default YAxis;

package/dist/esm/deprecated/UTBarChart/components/YAxis/utils.js

@@ -0,0 +1,4 @@
+export const applyToIndex = function (targetIndex, currentIndex, prop) {
+  let defaultValue = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+  return currentIndex === targetIndex ? prop : defaultValue;
+};

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

@@ -0,0 +1,7 @@
+export const DEFAULT_AXIS_PADDING = 10;
+export const DEFAULT_SCROLL_PADDING = 20;
+export const DEFAULT_MARGIN_TOP = 40;
+export const DEFAULT_MAX_VALUE = 100;
+export const TICKS_MULTIPLIER_DISTANCE = 5;
+export const LOWER_BOUND_DEFAULT = 0;
+export const LIMIT_MAX_VALUE_ROUNDER = 25;

package/dist/esm/deprecated/UTBarChart/hooks/use-dynamic-margins.js

@@ -0,0 +1,36 @@
+import { useEffect, useState, useRef } from 'react';
+const LATERAL_DEFAULT_MARGIN = 30;
+const VERTICAL_DEFAULT_MARGIN = 0;
+const useDynamicMargins = (center, options) => {
+  const [marginLeft, setMarginLeft] = useState(0);
+  const [marginRight, setMarginRight] = useState(0);
+  const [marginBottom, setMarginBottom] = useState(0);
+  const [marginTop, setMarginTop] = useState(0);
+  const {
+    lateralMargin = 0,
+    verticalMargin,
+    withoutLateralMargin
+  } = options;
+  const marginLeftRef = useRef();
+  const marginRightRef = useRef();
+  const marginBottomRef = useRef();
+  const marginTopRef = useRef();
+  useEffect(() => {
+    var _marginLeftRef$curren, _marginRightRef$curre, _marginBottomRef$curr, _marginTopRef$current;
+    setMarginLeft(Math.ceil(Math.max(lateralMargin, (_marginLeftRef$curren = marginLeftRef.current) === null || _marginLeftRef$curren === void 0 ? void 0 : _marginLeftRef$curren.getBoundingClientRect().width)) || (withoutLateralMargin ? 0 : LATERAL_DEFAULT_MARGIN));
+    setMarginRight(Math.ceil(lateralMargin || ((_marginRightRef$curre = marginRightRef.current) === null || _marginRightRef$curre === void 0 ? void 0 : _marginRightRef$curre.getBoundingClientRect().width)) || (withoutLateralMargin ? 0 : LATERAL_DEFAULT_MARGIN));
+    setMarginBottom(Math.ceil(verticalMargin || ((_marginBottomRef$curr = marginBottomRef.current) === null || _marginBottomRef$curr === void 0 ? void 0 : _marginBottomRef$curr.getBoundingClientRect().height)) || VERTICAL_DEFAULT_MARGIN);
+    setMarginTop(Math.ceil(verticalMargin || ((_marginTopRef$current = marginTopRef.current) === null || _marginTopRef$current === void 0 ? void 0 : _marginTopRef$current.getBoundingClientRect().height)) || VERTICAL_DEFAULT_MARGIN);
+  }, [marginLeftRef.current, marginRightRef.current, marginBottomRef.current, marginTopRef.current]);
+  return {
+    marginLeftRef,
+    marginRightRef,
+    marginBottomRef,
+    marginTopRef,
+    marginBottom,
+    marginTop,
+    marginLeft: center ? Math.max(marginLeft, marginRight) : marginLeft,
+    marginRight: center ? Math.max(marginLeft, marginRight) : marginRight
+  };
+};
+export default useDynamicMargins;