@widergy/energy-ui 2.1.6 → 2.2.0

package/CHANGELOG.md

@@ -1,3 +1,26 @@
+# [2.2.0](https://github.com/widergy/energy-ui/compare/v2.1.7...v2.2.0) (2023-03-10)
+
+
+### Bug Fixes
+
+* pr fixes ([edcedda](https://github.com/widergy/energy-ui/commit/edceddafae3b4c18c79077a6962ad2c278a50628))
+
+
+### Features
+
+* added some props + handling default cases ([934659f](https://github.com/widergy/energy-ui/commit/934659f0d8b022288127c9c733408f1ea7b3004d))
+* x axis subtitle unit handled ([6a08018](https://github.com/widergy/energy-ui/commit/6a080189ee01e01b6f444d9696d843fb60bf2cd1))
+
+## [2.1.7](https://github.com/widergy/energy-ui/compare/v2.1.6...v2.1.7) (2023-03-10)
+
+
+### Bug Fixes
+
+* no newline at the end of file ([8c183bc](https://github.com/widergy/energy-ui/commit/8c183bc7628d98af62978547649f45e3434a274d))
+* removes lock ([759b0ac](https://github.com/widergy/energy-ui/commit/759b0ac4fac83a52e08b06f00515ea22a9656704))
+* updated hooks version ([d439bde](https://github.com/widergy/energy-ui/commit/d439bde289267937bcc109bd980146d06715d613))
+* updates energy hooks min version ([aee9706](https://github.com/widergy/energy-ui/commit/aee970614cf0ee84e693852f02faae184741f492))
+
 ## [2.1.6](https://github.com/widergy/energy-ui/compare/v2.1.5...v2.1.6) (2023-02-28)
 
 

package/dist/components/UTBarChart/components/Bars/index.js

@@ -59,6 +59,7 @@ var Bars = function Bars(_ref) {
   var resetSelection = function resetSelection() {
     setSelectedIndex(-1);
     setSelectedPage(-1);
+    setCurrentLabel();
   };
   (0, _react.useEffect)(function () {
     resetSelection();
@@ -70,7 +71,10 @@ var Bars = function Bars(_ref) {
       setSelectedPage(currentPage);
       setCurrentLabel(index);
     }
-    if (onBarClick) onBarClick(data);
+    if (onBarClick) {
+      onBarClick(data);
+      setCurrentLabel(index);
+    }
   };
   var barRenderer = function barRenderer(bar, index, data, stackIndex) {
     var offset = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;

package/dist/components/UTBarChart/components/Legend/index.js

@@ -18,6 +18,7 @@ var _utils = require("./utils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -32,7 +33,8 @@ var Legend = function Legend(_ref) {
     displayAs = _ref$displayAs === void 0 ? 'block' : _ref$displayAs,
     style = _ref.style,
     labels = _ref.labels,
-    classes = _ref.classes;
+    classes = _ref.classes,
+    buttonProps = _ref.buttonProps;
   var _useState = (0, _react.useState)(false),
     _useState2 = _slicedToArray(_useState, 2),
     showLegend = _useState2[0],
@@ -121,7 +123,7 @@ var Legend = function Legend(_ref) {
     style: style
   }, title && /*#__PURE__*/_react.default.createElement(_.UTLabel, {
     className: "".concat(_stylesModule.default.title, " ").concat(classes.title)
-  }, title), withButton && /*#__PURE__*/_react.default.createElement(_.UTButton, {
+  }, title), withButton && /*#__PURE__*/_react.default.createElement(_.UTButton, _extends({
     classNames: {
       icon: classes.showLegendIcon,
       root: "".concat(_stylesModule.default.button, " ").concat(classes.showLegendButton)
@@ -131,7 +133,7 @@ var Legend = function Legend(_ref) {
     onClick: function onClick() {
       return setShowLegend(true);
     }
-  }, /*#__PURE__*/_react.default.createElement(_.UTLabel, {
+  }, buttonProps), /*#__PURE__*/_react.default.createElement(_.UTLabel, {
     className: classes.showLegendLabel
   }, showReferencesLabel)), /*#__PURE__*/_react.default.createElement(Wrapper, wrapperProps, referencesToShow.map(function (row) {
     return /*#__PURE__*/_react.default.createElement("div", {
@@ -142,17 +144,18 @@ var Legend = function Legend(_ref) {
   })));
 };
 Legend.propTypes = {
-  title: _propTypes.string,
-  references: _types.referencesType,
+  buttonProps: _types.buttonPropsTypes,
+  classes: _commonTypes.classesType,
+  displayAs: _propTypes.string,
   flatData: (0, _propTypes.shape)({
     bar: (0, _propTypes.arrayOf)(_types.barType),
     linear: (0, _propTypes.arrayOf)(_types.linearType),
     levels: _types.levelsType
   }),
-  displayAs: _propTypes.string,
-  style: _propTypes.object,
   labels: (0, _propTypes.objectOf)(_propTypes.string),
-  classes: _commonTypes.classesType
+  references: _types.referencesType,
+  style: _propTypes.object,
+  title: _propTypes.string
 };
 var _default = Legend;
 exports.default = _default;

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

@@ -30,7 +30,10 @@ var YAxis = function YAxis(_ref) {
     } : _ref$valueDecorator,
     x = _ref.x,
     yAxis = _ref.yAxis,
-    yAxisTicks = _ref.yAxisTicks;
+    yAxisTicks = _ref.yAxisTicks,
+    graphXEnd = _ref.graphXEnd,
+    unitSubtitle = _ref.unitSubtitle,
+    linearData = _ref.linearData;
   var labelRef = (0, _react.useRef)();
   var height = ((_labelRef$current = labelRef.current) === null || _labelRef$current === void 0 ? void 0 : (_labelRef$current$get = _labelRef$current.getBoundingClientRect) === null || _labelRef$current$get === void 0 ? void 0 : _labelRef$current$get.call(_labelRef$current).height) || 0;
   var axis = (0, _react.useMemo)(function () {
@@ -38,14 +41,21 @@ var YAxis = function YAxis(_ref) {
       return index;
     });
   }, [yAxisTicks]);
+  var linearDataUnitXPosition = graphXEnd - graphXEnd * 0.04;
+  var unitYPosition = unitSubtitle ? (graphYEnd - _constants.UNIT_PADDING) / 2 : graphYEnd - _constants.UNIT_PADDING;
+  var unitSubtitleYPosition = graphYEnd - graphYEnd * 0.5;
   return /*#__PURE__*/_react.default.createElement("g", {
     textAnchor: textAnchor,
     ref: setRef
   }, /*#__PURE__*/_react.default.createElement("text", {
+    className: classes.yAxisUnit,
+    x: linearData ? linearDataUnitXPosition : x,
+    y: unitYPosition
+  }, unit), unitSubtitle && /*#__PURE__*/_react.default.createElement("text", {
     className: classes.yAxisUnit,
     x: x,
-    y: graphYEnd - _constants.UNIT_PADDING
-  }, unit), axis.map(function (index) {
+    y: unitSubtitleYPosition
+  }, unitSubtitle), axis.map(function (index) {
     var newMaxValue = (0, _utils.yAxisMaxValueRounder)(maxValue, yAxisTicks);
     var value = Math.round((maxValue - index * maxValue / (yAxisTicks - 1)) * 100) / 100;
     var labelValue = Math.round((newMaxValue - index * newMaxValue / (yAxisTicks - 1)) * 100) / 100;
@@ -72,7 +82,10 @@ YAxis.propTypes = {
   valueDecorator: _propTypes.func,
   x: _propTypes.number,
   yAxis: _propTypes.func,
-  yAxisTicks: _propTypes.number
+  yAxisTicks: _propTypes.number,
+  graphXEnd: _propTypes.number,
+  unitSubtitle: _propTypes.string,
+  linearData: _propTypes.bool
 };
 var _default = YAxis;
 exports.default = _default;

package/dist/components/UTBarChart/index.js

@@ -48,12 +48,14 @@ var UTBarChart = function UTBarChart(_ref) {
   var barBorderRadius = _ref.barBorderRadius,
     barData = _ref.barData,
     barPadding = _ref.barPadding,
+    buttonProps = _ref.buttonProps,
     center = _ref.center,
     theme = _ref.classes,
     className = _ref.className,
     classNames = _ref.classNames,
     decoratorRenderer = _ref.decoratorRenderer,
     displayLegendAs = _ref.displayLegendAs,
+    fitLegend = _ref.fitLegend,
     gradientGenerator = _ref.gradientGenerator,
     hideYAxis = _ref.hideYAxis,
     highlightWidth = _ref.highlightWidth,
@@ -65,12 +67,11 @@ var UTBarChart = function UTBarChart(_ref) {
     NoDataComponent = _ref.NoDataComponent,
     onBarClick = _ref.onBarClick,
     pagination = _ref.pagination,
-    selectable = _ref.selectable,
     references = _ref.references,
+    selectable = _ref.selectable,
     showGrid = _ref.showGrid,
     singleYAxis = _ref.singleYAxis,
     spacingOptions = _ref.spacingOptions,
-    fitLegend = _ref.fitLegend,
     title = _ref.title,
     transitionDuration = _ref.transitionDuration,
     units = _ref.units,
@@ -156,7 +157,9 @@ var UTBarChart = function UTBarChart(_ref) {
   var barAxisLabelFormatter = labelFormatters.bar,
     linearAxisLabelFormatter = labelFormatters.linear;
   var barUnit = units.bar,
-    linearUnit = units.linear;
+    barUnitSubtitle = units.barSubtitle,
+    linearUnit = units.linear,
+    linearUnitSubtitle = units.linearSubtitle;
   var Wrapper = pagination ? 'div' : _reactPerfectScrollbar.default;
   var wrapperProps = pagination ? {} : {
     suppressScrollX: !!pagination,
@@ -174,35 +177,35 @@ var UTBarChart = function UTBarChart(_ref) {
     width: TOTAL_WIDTH
   }, gradientGenerator === null || gradientGenerator === void 0 ? void 0 : gradientGenerator(), showGrid && /*#__PURE__*/_react.default.createElement(_Levels.default, {
     classes: classes,
-    levels: (0, _utils.getGrid)(yAxisTicks, singleYAxis ? maxAbsoluteValue : roundedMaxBarValue),
-    yAxis: yAxis,
-    graphXStart: GRAPH_X_START,
     graphXEnd: GRAPH_X_END,
-    graphYStart: GRAPH_Y_START
+    graphXStart: GRAPH_X_START,
+    graphYStart: GRAPH_Y_START,
+    levels: (0, _utils.getGrid)(yAxisTicks, singleYAxis ? maxAbsoluteValue : roundedMaxBarValue),
+    yAxis: yAxis
   }), formattedData.map(function (data, group) {
     return /*#__PURE__*/_react.default.createElement(_Bars.default, {
-      totalData: barData,
-      highlightWidth: highlightWidth,
-      selectable: selectable,
-      groupWidth: groupWidth,
-      xSubAxis: xSubAxis,
-      barData: data,
-      xAxis: xAxis,
-      classes: classes,
-      yAxis: yAxis,
       barBorderRadius: barBorderRadius,
-      onBarClick: onBarClick,
+      barData: data,
       barWidth: barWidth,
+      classes: classes,
+      currentPage: currentPage,
       graphYStart: GRAPH_Y_START,
-      maxBarValue: roundedMaxBarValue,
-      padding: barPadding,
       group: group,
       groups: groups,
+      groupWidth: groupWidth,
+      highlightWidth: highlightWidth,
+      maxBarValue: roundedMaxBarValue,
+      onBarClick: onBarClick,
+      padding: barPadding,
+      selectable: selectable,
+      setCurrentLabel: setCurrentLabel,
       spacingOptions: spacingOptions,
-      currentPage: currentPage,
-      valuesOnTop: valuesOnTop,
+      totalData: barData,
       transitionDuration: transitionDuration,
-      setCurrentLabel: setCurrentLabel
+      valuesOnTop: valuesOnTop,
+      xAxis: xAxis,
+      xSubAxis: xSubAxis,
+      yAxis: yAxis
     });
   }), formattedLinearData.map(function (_ref3) {
     var data = _ref3.data,
@@ -211,77 +214,83 @@ var UTBarChart = function UTBarChart(_ref) {
       customLineProps = _ref3.customLineProps,
       markers = _ref3.markers;
     return /*#__PURE__*/_react.default.createElement(_LinearPlot.default, {
-      data: data,
-      type: type,
-      yAxis: linearYAxis,
-      xAxis: xAxis,
-      markers: markers,
       barWidth: groupWidth,
       color: color,
+      customLineProps: customLineProps,
+      data: data,
       graphYStart: GRAPH_Y_START,
-      customLineProps: customLineProps
+      markers: markers,
+      type: type,
+      xAxis: xAxis,
+      yAxis: linearYAxis
     });
   }), /*#__PURE__*/_react.default.createElement(_Levels.default, {
-    levels: levels,
-    yAxis: yAxis,
-    graphXStart: GRAPH_X_START,
     graphXEnd: GRAPH_X_END,
-    graphYStart: GRAPH_Y_START
+    graphXStart: GRAPH_X_START,
+    graphYStart: GRAPH_Y_START,
+    levels: levels,
+    yAxis: yAxis
   }), !hideYAxis && /*#__PURE__*/_react.default.createElement(_YAxis.default, {
-    graphYEnd: GRAPH_Y_END,
     classes: classes,
-    x: marginLeft,
-    textAnchor: "end",
-    setRef: marginLeftRef,
-    yAxisTicks: yAxisTicks,
-    maxValue: singleYAxis ? maxAbsoluteValue : roundedMaxBarValue,
+    graphYEnd: GRAPH_Y_END,
     graphYStart: GRAPH_Y_START,
-    yAxis: yAxis,
+    maxValue: singleYAxis ? maxAbsoluteValue : roundedMaxBarValue,
+    setRef: marginLeftRef,
+    textAnchor: "end",
+    unit: barUnit,
     valueDecorator: barAxisLabelFormatter,
-    unit: barUnit
+    x: marginLeft,
+    yAxis: yAxis,
+    yAxisTicks: yAxisTicks,
+    unitSubtitle: barUnitSubtitle,
+    graphXEnd: GRAPH_X_END
   }), !hideYAxis && withLinearData && !singleYAxis && /*#__PURE__*/_react.default.createElement(_YAxis.default, {
-    graphYEnd: GRAPH_Y_END,
     classes: classes,
-    x: TOTAL_WIDTH - marginRight,
-    textAnchor: "start",
-    setRef: marginRightRef,
-    yAxisTicks: yAxisTicks,
-    maxValue: roundedMaxLinearValue,
+    graphYEnd: GRAPH_Y_END,
     graphYStart: GRAPH_Y_START,
-    yAxis: linearYAxis,
+    maxValue: roundedMaxLinearValue,
+    setRef: marginRightRef,
+    textAnchor: "start",
+    unit: linearUnit,
+    unitSubtitle: linearUnitSubtitle,
     valueDecorator: linearAxisLabelFormatter,
-    unit: linearUnit
-  }), /*#__PURE__*/_react.default.createElement(_XAxis.default, {
-    pagination: pagination,
-    data: formattedData,
-    graphYStart: GRAPH_Y_START,
-    graphXStart: GRAPH_X_START,
+    x: TOTAL_WIDTH - marginRight,
+    yAxis: linearYAxis,
+    yAxisTicks: yAxisTicks,
     graphXEnd: GRAPH_X_END,
-    setRef: marginBottomRef,
-    classes: classes,
+    linearData: true
+  }), /*#__PURE__*/_react.default.createElement(_XAxis.default, {
     barWidth: groupWidth,
-    xAxisDefinition: pagination ? xAxisDefinition.slice(currentPage * pagination, (currentPage + 1) * pagination) : xAxisDefinition,
-    xAxis: xAxis,
-    decoratorRenderer: decoratorRenderer,
+    classes: classes,
+    currentLabel: currentLabel,
     currentPage: currentPage,
+    data: formattedData,
+    decoratorRenderer: decoratorRenderer,
+    graphXEnd: GRAPH_X_END,
+    graphXStart: GRAPH_X_START,
+    graphYStart: GRAPH_Y_START,
     initialHeight: marginBottom,
+    pagination: pagination,
     paginationRef: paginationRef,
-    currentLabel: currentLabel
+    setRef: marginBottomRef,
+    xAxisDefinition: pagination ? xAxisDefinition.slice(currentPage * pagination, (currentPage + 1) * pagination) : xAxisDefinition,
+    xAxis: xAxis
   })), !!pagination && /*#__PURE__*/_react.default.createElement(_Pagination.default, {
-    classes: classes,
-    parentYPosition: parentYPosition,
     anchor: paginationRef,
-    setCurrentPage: setCurrentPage,
+    classes: classes,
     currentPage: currentPage,
-    totalPages: totalPages,
     graphXEnd: GRAPH_X_END,
-    graphXStart: GRAPH_X_START
+    graphXStart: GRAPH_X_START,
+    parentYPosition: parentYPosition,
+    setCurrentPage: setCurrentPage,
+    totalPages: totalPages
   }))), /*#__PURE__*/_react.default.createElement(_Legend.default, {
+    buttonProps: buttonProps,
     classes: classes,
     displayAs: displayLegendAs,
     style: {
       width: fitLegend ? containerWidth - 2 * GRAPH_X_START : containerWidth,
-      margin: fitLegend ? "0 ".concat(GRAPH_X_START, "px 0 ").concat(GRAPH_X_START, "px") : '0 auto'
+      margin: fitLegend ? '0' : '0 auto'
     },
     flatData: {
       bar: flatBarData,
@@ -295,6 +304,7 @@ var UTBarChart = function UTBarChart(_ref) {
 };
 UTBarChart.propTypes = {
   barData: _types.barDataType,
+  buttonProps: _types.buttonPropsTypes,
   linearData: _types.linearDataType,
   pagination: _propTypes.number,
   yAxisTicks: _propTypes.number,
@@ -328,6 +338,7 @@ UTBarChart.propTypes = {
   transitionDuration: _propTypes.number
 };
 UTBarChart.defaultProps = {
+  buttonProps: {},
   highlightWidth: 1,
   pagination: 0,
   yAxisTicks: 6,

package/dist/components/UTBarChart/types.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.xAxisDefinitionType = exports.referencesType = exports.linearType = exports.linearMarkersType = exports.linearDataType = exports.levelsType = exports.barType = exports.barDataType = void 0;
+exports.xAxisDefinitionType = exports.referencesType = exports.linearType = exports.linearMarkersType = exports.linearDataType = exports.levelsType = exports.buttonPropsTypes = exports.barType = exports.barDataType = void 0;
 var _propTypes = require("prop-types");
 var barType = (0, _propTypes.shape)({
   clickable: _propTypes.bool,
@@ -61,4 +61,11 @@ var xAxisDefinitionType = (0, _propTypes.arrayOf)((0, _propTypes.shape)({
   secondaryLabel: _propTypes.string,
   selectedLabelBackground: _propTypes.string
 }));
-exports.xAxisDefinitionType = xAxisDefinitionType;
+exports.xAxisDefinitionType = xAxisDefinitionType;
+var buttonPropsTypes = (0, _propTypes.shape)({
+  colorTheme: _propTypes.string,
+  iconPlacement: _propTypes.string,
+  size: _propTypes.string,
+  variant: _propTypes.string
+});
+exports.buttonPropsTypes = buttonPropsTypes;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widergy/energy-ui",
-  "version": "2.1.6",
+  "version": "2.2.0",
   "description": "Widergy Web Components",
   "author": "widergy",
   "license": "MIT",
@@ -30,7 +30,7 @@
     "@material-ui/pickers": "^3.3.10",
     "@tippy.js/react": "^3.0.0",
     "@trainline/react-skeletor": "^1.0.2",
-    "@widergy/energy-hooks": "^1.0.0",
+    "@widergy/energy-hooks": "^1.0.4",
     "@widergy/web-utils": ">=1.0.0",
     "autoprefixer": "^9.5.0",
     "babel-plugin-inline-react-svg": "^1.1.0",