@rio-cloud/rio-uikit 0.16.1-beta.21 → 0.16.1-beta.22

package/components/bottomSheet/BottomSheet.js

@@ -10,55 +10,47 @@ import { motion } from 'framer-motion';
 import isFunction from 'lodash/fp/isFunction';
 import { getOrCreatePortalRoot } from '../../utils/portalRoot';
 var OFFSET_POSITION = -1000;
-
 var BottomSheet = function BottomSheet(props) {
   var show = props.show,
-      onClose = props.onClose,
-      width = props.width,
-      height = props.height,
-      title = props.title,
-      detatch = props.detatch,
-      useBackdrop = props.useBackdrop,
-      showCloseButton = props.showCloseButton,
-      showMaximizeButton = props.showMaximizeButton,
-      onHeightChange = props.onHeightChange,
-      bodyRef = props.bodyRef,
-      bodyClassName = props.bodyClassName,
-      className = props.className,
-      children = props.children,
-      remainigProps = _objectWithoutProperties(props, _excluded);
-
+    onClose = props.onClose,
+    width = props.width,
+    height = props.height,
+    title = props.title,
+    detatch = props.detatch,
+    useBackdrop = props.useBackdrop,
+    showCloseButton = props.showCloseButton,
+    showMaximizeButton = props.showMaximizeButton,
+    onHeightChange = props.onHeightChange,
+    bodyRef = props.bodyRef,
+    bodyClassName = props.bodyClassName,
+    className = props.className,
+    children = props.children,
+    remainigProps = _objectWithoutProperties(props, _excluded);
   var _useState = useState(show),
-      _useState2 = _slicedToArray(_useState, 2),
-      isShown = _useState2[0],
-      setIsShown = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    isShown = _useState2[0],
+    setIsShown = _useState2[1];
   var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isMaxHeight = _useState4[0],
-      setIsMaxHeight = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    isMaxHeight = _useState4[0],
+    setIsMaxHeight = _useState4[1];
   useEffect(function () {
     return setIsShown(show);
   }, [show]);
   var modalRoot = getOrCreatePortalRoot();
-
   var handleToggle = function handleToggle() {
     var newValue = !isShown;
-
     if (isFunction(onClose)) {
       onClose(newValue);
     } else {
       setIsShown(newValue);
     }
   };
-
   var handleMaximize = function handleMaximize() {
     var newValue = !isMaxHeight;
     setIsMaxHeight(newValue);
     onHeightChange();
   };
-
   var sheetClasses = classNames('bottom-sheet', 'position-fixed left-0', !width && 'width-100pct', !height && !isMaxHeight && 'height-auto', 'bg-white', 'shadow-hard', detatch ? 'margin-15 rounded' : 'rounded-top-left rounded-top-right', className && className);
   var sheetBodyCasses = classNames('bottom-sheet-body', 'height-100pct', bodyClassName && bodyClassName);
   var sheetHeight = isMaxHeight ? window.innerHeight : height;
@@ -106,7 +98,6 @@ var BottomSheet = function BottomSheet(props) {
     onClick: handleToggle
   })), modalRoot);
 };
-
 BottomSheet.defaultProps = {
   show: false,
   detatch: false,

package/components/browserWarning/BrowserWarning.js

@@ -5,35 +5,31 @@ import Dialog from '../dialog/Dialog';
 import BrowserWarningMessageDE from './BrowserWarningMessageDE';
 import BrowserWarningMessageEN from './BrowserWarningMessageEN';
 var UNSUPPORTED_BROWSER_TAG = 'ua-ie';
-
 var getLanguage = function getLanguage() {
   if (window) {
     return window.navigator.language.toLowerCase();
   }
-
   return '';
 };
-
 var BrowserWarning = function BrowserWarning(props) {
   var show = props.show,
-      onClose = props.onClose,
-      onBrowserSelect = props.onBrowserSelect;
-
+    onClose = props.onClose,
+    onBrowserSelect = props.onBrowserSelect;
   var _useState = useState(show),
-      _useState2 = _slicedToArray(_useState, 2),
-      showWarning = _useState2[0],
-      setShowWarning = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    showWarning = _useState2[0],
+    setShowWarning = _useState2[1];
   var handleClose = function handleClose() {
     setShowWarning(false);
     onClose(false);
-  }; // Force to show the dialog from outside
-
+  };
 
+  // Force to show the dialog from outside
   useEffect(function () {
     return setShowWarning(show);
-  }, [show]); // check HTML tag for browsers only on mount
+  }, [show]);
 
+  // check HTML tag for browsers only on mount
   useEffect(function () {
     if (document && document.documentElement && document.documentElement.classList.contains(UNSUPPORTED_BROWSER_TAG)) {
       setShowWarning(true);
@@ -62,7 +58,6 @@ var BrowserWarning = function BrowserWarning(props) {
     onHide: handleClose
   });
 };
-
 BrowserWarning.defaultProps = {
   onClose: function onClose() {},
   onBrowserSelect: function onBrowserSelect() {}

package/components/browserWarning/BrowserWarningMessageDE.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import { ChromeIcon, FirefoxIcon } from './BrowserIcons';
-
 var BrowserWarningMessageDE = function BrowserWarningMessageDE(_ref) {
   var onBrowserSelect = _ref.onBrowserSelect;
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
@@ -33,5 +32,4 @@ var BrowserWarningMessageDE = function BrowserWarningMessageDE(_ref) {
     }
   }, /*#__PURE__*/React.createElement(FirefoxIcon, null))));
 };
-
 export default BrowserWarningMessageDE;

package/components/browserWarning/BrowserWarningMessageEN.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import { ChromeIcon, FirefoxIcon } from './BrowserIcons';
-
 var BrowserWarningMessageEN = function BrowserWarningMessageEN(_ref) {
   var onBrowserSelect = _ref.onBrowserSelect;
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
@@ -33,5 +32,4 @@ var BrowserWarningMessageEN = function BrowserWarningMessageEN(_ref) {
     }
   }, /*#__PURE__*/React.createElement(FirefoxIcon, null))));
 };
-
 export default BrowserWarningMessageEN;

package/components/button/Button.js

@@ -6,56 +6,54 @@ import React, { useState, useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { createButtonRipple } from '../../utils/buttonEffect';
-
 var Button = function Button(props) {
   var active = props.active,
-      disabled = props.disabled,
-      asToggle = props.asToggle,
-      onClick = props.onClick,
-      bsStyle = props.bsStyle,
-      bsSize = props.bsSize,
-      variant = props.variant,
-      iconOnly = props.iconOnly,
-      multiline = props.multiline,
-      block = props.block,
-      className = props.className,
-      children = props.children,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    disabled = props.disabled,
+    asToggle = props.asToggle,
+    onClick = props.onClick,
+    bsStyle = props.bsStyle,
+    bsSize = props.bsSize,
+    variant = props.variant,
+    iconOnly = props.iconOnly,
+    multiline = props.multiline,
+    block = props.block,
+    className = props.className,
+    children = props.children,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var _useState = useState(active),
-      _useState2 = _slicedToArray(_useState, 2),
-      isToggled = _useState2[0],
-      setIsToggled = _useState2[1];
+    _useState2 = _slicedToArray(_useState, 2),
+    isToggled = _useState2[0],
+    setIsToggled = _useState2[1];
+  var btnRef = useRef();
 
-  var btnRef = useRef(); // Update internal toggle state when used as controlled component
+  // Update internal toggle state when used as controlled component
   // and outside toggle state changes
-
   useEffect(function () {
     return setIsToggled(active);
-  }, [active]); // Register a dedicated click event on the button to interrupt
-  // the actual 'onClick' callback passed into the component from outside
+  }, [active]);
 
+  // Register a dedicated click event on the button to interrupt
+  // the actual 'onClick' callback passed into the component from outside
   useEffect(function () {
     if (!btnRef.current) {
       return;
     }
-
     var mouseListener = btnRef.current.addEventListener('mousedown', createButtonRipple, false);
     var touchListener = btnRef.current.addEventListener('touchstart', createButtonRipple, false);
     return function () {
       mouseListener && btnRef.current.removeEventListener('mousedown', createButtonRipple, false);
       touchListener && btnRef.current.removeEventListener('touchstart', createButtonRipple, false);
     };
-  }, [btnRef.current]); // Intercept click handler only for toggle button to update
-  // internal state and blur after click
+  }, [btnRef.current]);
 
+  // Intercept click handler only for toggle button to update
+  // internal state and blur after click
   var handleClick = function handleClick() {
     var newIsToggled = !isToggled;
     setIsToggled(newIsToggled);
     btnRef.current && newIsToggled && btnRef.current.blur();
     onClick(isToggled);
   };
-
   var buttonClassNames = classNames('btn', "btn-".concat(bsStyle), variant === Button.VARIANT_LINK && 'btn-link', variant === Button.VARIANT_LINK_INLINE && 'btn-link btn-link-inline', variant === Button.VARIANT_OUTLINE && 'btn-outline', variant === Button.VARIANT_ACTION && 'btn-action', bsSize && "btn-".concat(bsSize), asToggle && 'btn-toggle', isToggled && 'active', iconOnly && 'btn-icon-only', disabled && 'disabled', multiline && 'btn-multiline', block && 'btn-block', 'btn-component', className);
   return /*#__PURE__*/React.createElement("button", _extends({
     ref: btnRef,
@@ -64,9 +62,9 @@ var Button = function Button(props) {
     className: buttonClassNames,
     onClick: asToggle ? handleClick : onClick
   }), children);
-}; // Button styles
-
+};
 
+// Button styles
 Button.DEFAULT = 'default';
 Button.PRIMARY = 'primary';
 Button.SECONDARY = 'secondary';
@@ -74,13 +72,15 @@ Button.INFO = 'info';
 Button.WARNING = 'warning';
 Button.DANGER = 'danger';
 Button.SUCCESS = 'success';
-Button.MUTED = 'muted'; // Button Type
+Button.MUTED = 'muted';
 
+// Button Type
 Button.VARIANT_LINK = 'link';
 Button.VARIANT_LINK_INLINE = 'link-inline';
 Button.VARIANT_OUTLINE = 'outline';
-Button.VARIANT_ACTION = 'action'; // Button Size
+Button.VARIANT_ACTION = 'action';
 
+// Button Size
 Button.XS = 'xs';
 Button.SM = 'sm';
 Button.MD = 'md';

package/components/button/ToggleButton.js

@@ -1,13 +1,11 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import Button from './Button';
-
 var ToggleButton = function ToggleButton(props) {
   return /*#__PURE__*/React.createElement(Button, _extends({}, props, {
     asToggle: true
   }));
 };
-
 ToggleButton.defaultProps = Button.defaultProps;
 ToggleButton.propTypes = Button.propTypes;
 export default ToggleButton;

package/components/carousel/Carousel.js

@@ -1,8 +1,11 @@
-import React from 'react'; // import { default as BSCarousel } from 'react-bootstrap/Carousel';
+import React from 'react';
+// import { default as BSCarousel } from 'react-bootstrap/Carousel';
 // import { default as _Carousel } from 'react-bootstrap/Carousel';
+
 // const Carousel = props => {
 //     return <_Carousel {...props} />;
 // };
+
 // export default Carousel;
 
 import { default as _Carousel } from 'react-bootstrap/Carousel';

package/components/carousel/CarouselCaption.js

@@ -6,46 +6,37 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 var _excluded = ["componentClass", "className"];
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 // https://github.com/react-bootstrap/react-bootstrap/blob/v0.32.0/src/CarouselCaption.js
+
 import classNames from 'classnames';
 import React from 'react';
-
 var CarouselCaption = /*#__PURE__*/function (_React$Component) {
   _inherits(CarouselCaption, _React$Component);
-
   var _super = _createSuper(CarouselCaption);
-
   function CarouselCaption() {
     _classCallCheck(this, CarouselCaption);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(CarouselCaption, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          Component = _this$props.componentClass,
-          className = _this$props.className,
-          remainingProps = _objectWithoutProperties(_this$props, _excluded);
-
+        Component = _this$props.componentClass,
+        className = _this$props.className,
+        remainingProps = _objectWithoutProperties(_this$props, _excluded);
       return /*#__PURE__*/React.createElement(Component, _extends({}, remainingProps, {
         className: classNames('carousel-caption', className)
       }));
     }
   }]);
-
   return CarouselCaption;
 }(React.Component);
-
 CarouselCaption.defaultProps = {
   componentClass: 'div'
 };
-CarouselCaption.propTypes = {// componentClass: elementType,
+CarouselCaption.propTypes = {
+  // componentClass: elementType,
 };
 export default CarouselCaption;

package/components/carousel/CarouselItem.js

@@ -7,12 +7,10 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 var _excluded = ["direction", "active", "animateIn", "animateOut", "className"];
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 // https://github.com/react-bootstrap/react-bootstrap/blob/v0.32.0/src/CarouselItem.js
+
 import classNames from 'classnames';
 import React from 'react';
 import PropTypes from 'prop-types';
@@ -31,17 +29,12 @@ var defaultProps = {
   animateIn: false,
   animateOut: false
 };
-
 var CarouselItem = /*#__PURE__*/function (_React$Component) {
   _inherits(CarouselItem, _React$Component);
-
   var _super = _createSuper(CarouselItem);
-
   function CarouselItem(props, context) {
     var _this;
-
     _classCallCheck(this, CarouselItem);
-
     _this = _super.call(this, props, context);
     _this.handleAnimateOutEnd = _this.handleAnimateOutEnd.bind(_assertThisInitialized(_this));
     _this.state = {
@@ -49,9 +42,9 @@ var CarouselItem = /*#__PURE__*/function (_React$Component) {
     };
     _this.isUnmounted = false;
     return _this;
-  } // eslint-disable-next-line camelcase
-
+  }
 
+  // eslint-disable-next-line camelcase
   _createClass(CarouselItem, [{
     key: "UNSAFE_componentWillReceiveProps",
     value: function UNSAFE_componentWillReceiveProps(nextProps) {
@@ -65,14 +58,11 @@ var CarouselItem = /*#__PURE__*/function (_React$Component) {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
       var _this2 = this;
-
       var active = this.props.active;
       var prevActive = prevProps.active;
-
       if (!active && prevActive) {
         transitionEnd(ReactDOM.findDOMNode(this), this.handleAnimateOutEnd);
       }
-
       if (active !== prevActive) {
         setTimeout(function () {
           return _this2.startAnimation();
@@ -90,7 +80,6 @@ var CarouselItem = /*#__PURE__*/function (_React$Component) {
       if (this.isUnmounted) {
         return;
       }
-
       if (this.props.onAnimateOutEnd) {
         this.props.onAnimateOutEnd(this.props.index);
       }
@@ -101,7 +90,6 @@ var CarouselItem = /*#__PURE__*/function (_React$Component) {
       if (this.isUnmounted) {
         return;
       }
-
       this.setState({
         direction: this.props.direction === 'prev' ? 'right' : 'left'
       });
@@ -110,37 +98,31 @@ var CarouselItem = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          direction = _this$props.direction,
-          active = _this$props.active,
-          animateIn = _this$props.animateIn,
-          animateOut = _this$props.animateOut,
-          className = _this$props.className,
-          props = _objectWithoutProperties(_this$props, _excluded);
-
+        direction = _this$props.direction,
+        active = _this$props.active,
+        animateIn = _this$props.animateIn,
+        animateOut = _this$props.animateOut,
+        className = _this$props.className,
+        props = _objectWithoutProperties(_this$props, _excluded);
       delete props.onAnimateOutEnd;
       delete props.index;
       var classes = {
         item: true,
         active: active && !animateIn || animateOut
       };
-
       if (direction && active && animateIn) {
         classes[direction] = true;
       }
-
       if (this.state.direction && (animateIn || animateOut)) {
         classes[this.state.direction] = true;
       }
-
       return /*#__PURE__*/React.createElement("div", _extends({}, props, {
         className: classNames(className, classes)
       }));
     }
   }]);
-
   return CarouselItem;
 }(React.Component);
-
 CarouselItem.propTypes = propTypes;
 CarouselItem.defaultProps = defaultProps;
 export default CarouselItem;

package/components/charts/Area.js

@@ -1,7 +1,6 @@
 var Area = function Area() {
   return null;
 };
-
 Area.defaultProps = {
   dataKey: 'value',
   dataUnit: '',

package/components/charts/AreaChart.js

@@ -1,37 +1,34 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["width", "height", "data", "dataUnit", "dataKey", "gradients", "areas", "xAxisOptions", "yAxisOptions", "gridOptions", "showXAxis", "showYAxis", "showGrid", "legend", "brush", "tooltip"],
-    _excluded2 = ["strokeColor"];
+  _excluded2 = ["strokeColor"];
 import React from 'react';
 import { AreaChart as RechartsAreaChart, Area as RechartsArea, Legend as RechartsLegend, XAxis, YAxis, Brush, Tooltip as RechartsTooltip, CartesianGrid, ResponsiveContainer } from 'recharts';
 import { getColor, mapGridOptions } from './chartHelper';
 import AreaGradient from './AreaGradient';
 import ChartTooltip from './ChartTooltip';
-
 var AreaChart = function AreaChart(props) {
   var width = props.width,
-      height = props.height,
-      data = props.data,
-      dataUnit = props.dataUnit,
-      dataKey = props.dataKey,
-      gradients = props.gradients,
-      areas = props.areas,
-      xAxisOptions = props.xAxisOptions,
-      yAxisOptions = props.yAxisOptions,
-      gridOptions = props.gridOptions,
-      showXAxis = props.showXAxis,
-      showYAxis = props.showYAxis,
-      showGrid = props.showGrid,
-      legend = props.legend,
-      brush = props.brush,
-      tooltip = props.tooltip,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    height = props.height,
+    data = props.data,
+    dataUnit = props.dataUnit,
+    dataKey = props.dataKey,
+    gradients = props.gradients,
+    areas = props.areas,
+    xAxisOptions = props.xAxisOptions,
+    yAxisOptions = props.yAxisOptions,
+    gridOptions = props.gridOptions,
+    showXAxis = props.showXAxis,
+    showYAxis = props.showYAxis,
+    showGrid = props.showGrid,
+    legend = props.legend,
+    brush = props.brush,
+    tooltip = props.tooltip,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var areasWithGradient = areas.map(function (area) {
     var _area$props = area.props,
-        strokeColor = _area$props.strokeColor,
-        remainingAreaProps = _objectWithoutProperties(_area$props, _excluded2);
-
+      strokeColor = _area$props.strokeColor,
+      remainingAreaProps = _objectWithoutProperties(_area$props, _excluded2);
     var gradientId = area.key;
     var stroke = getColor(strokeColor);
     return {
@@ -80,7 +77,6 @@ var AreaChart = function AreaChart(props) {
     stroke: getColor('gray')
   })));
 };
-
 AreaChart.defaultProps = {
   width: 480,
   height: 200,

package/components/charts/AreaGradient.js

@@ -1,9 +1,8 @@
 import React from 'react';
 import { getColor } from './chartHelper';
-
 var AreaGradient = function AreaGradient(_ref) {
   var id = _ref.id,
-      color = _ref.color;
+    color = _ref.color;
   return /*#__PURE__*/React.createElement("linearGradient", {
     key: id,
     id: id,
@@ -21,7 +20,6 @@ var AreaGradient = function AreaGradient(_ref) {
     stopOpacity: 0
   }));
 };
-
 AreaGradient.defaultProps = {
   id: 'areaGradient',
   color: 'color-coldplay-fountain'

package/components/charts/Bar.js

@@ -1,7 +1,6 @@
 var Bar = function Bar() {
   return null;
 };
-
 Bar.defaultProps = {
   isAnimationActive: true,
   dataKey: 'value',

package/components/charts/BarChart.js

@@ -2,37 +2,32 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["width", "height", "data", "dataUnit", "dataKey", "layout", "legend", "bars", "xAxisOptions", "yAxisOptions", "gridOptions", "showGrid", "showXAxis", "showYAxis", "useDataColors", "brush", "tooltip"],
-    _excluded2 = ["dataUnit", "color"];
-
+  _excluded2 = ["dataUnit", "color"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 import React from 'react';
 import { BarChart as RechartsBarChart, XAxis, YAxis, Legend as RechartsLegend, Bar as RechartsBar, Brush, Cell, Tooltip as RechartsTooltip, CartesianGrid, ResponsiveContainer } from 'recharts';
 import { getFromDefaultColors, getColor, mapGridOptions, CURSOR_BACKGROUND_COLOR } from './chartHelper';
 import ChartTooltip from './ChartTooltip';
-
 var BarChart = function BarChart(props) {
   var width = props.width,
-      height = props.height,
-      data = props.data,
-      dataUnit = props.dataUnit,
-      dataKey = props.dataKey,
-      layout = props.layout,
-      legend = props.legend,
-      bars = props.bars,
-      xAxisOptions = props.xAxisOptions,
-      yAxisOptions = props.yAxisOptions,
-      gridOptions = props.gridOptions,
-      showGrid = props.showGrid,
-      showXAxis = props.showXAxis,
-      showYAxis = props.showYAxis,
-      useDataColors = props.useDataColors,
-      brush = props.brush,
-      tooltip = props.tooltip,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    height = props.height,
+    data = props.data,
+    dataUnit = props.dataUnit,
+    dataKey = props.dataKey,
+    layout = props.layout,
+    legend = props.legend,
+    bars = props.bars,
+    xAxisOptions = props.xAxisOptions,
+    yAxisOptions = props.yAxisOptions,
+    gridOptions = props.gridOptions,
+    showGrid = props.showGrid,
+    showXAxis = props.showXAxis,
+    showYAxis = props.showYAxis,
+    useDataColors = props.useDataColors,
+    brush = props.brush,
+    tooltip = props.tooltip,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   return /*#__PURE__*/React.createElement(ResponsiveContainer, null, /*#__PURE__*/React.createElement(RechartsBarChart, _extends({
     layout: layout,
     width: width,
@@ -60,10 +55,9 @@ var BarChart = function BarChart(props) {
     }
   }, tooltip.props)), bars.map(function (bar) {
     var _bar$props = bar.props,
-        dataUnit = _bar$props.dataUnit,
-        color = _bar$props.color,
-        remainingBarProps = _objectWithoutProperties(_bar$props, _excluded2);
-
+      dataUnit = _bar$props.dataUnit,
+      color = _bar$props.color,
+      remainingBarProps = _objectWithoutProperties(_bar$props, _excluded2);
     var cellColor = color && getColor(color);
     return /*#__PURE__*/React.createElement(RechartsBar, _extends({
       key: bar.key,
@@ -81,7 +75,6 @@ var BarChart = function BarChart(props) {
     stroke: getColor('gray')
   })));
 };
-
 BarChart.defaultProps = {
   width: 480,
   height: 200,