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

package/components/charts/ChartNeedle.js

@@ -1,20 +1,15 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 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';
-
 var ChartNeedle = function ChartNeedle(props) {
   var width = props.width,
-      height = props.height,
-      x = props.x,
-      y = props.y,
-      rotation = props.rotation,
-      className = props.className,
-      style = props.style;
-
+    height = props.height,
+    x = props.x,
+    y = props.y,
+    rotation = props.rotation,
+    className = props.className,
+    style = props.style;
   var needleStyle = _objectSpread({
     width: width,
     height: height,
@@ -26,7 +21,6 @@ var ChartNeedle = function ChartNeedle(props) {
     borderTopRightRadius: '100%',
     display: 'inline-block'
   }, style);
-
   return /*#__PURE__*/React.createElement("div", {
     className: 'position-relative'
   }, /*#__PURE__*/React.createElement("div", {
@@ -34,14 +28,14 @@ var ChartNeedle = function ChartNeedle(props) {
     style: needleStyle
   }));
 };
-
 ChartNeedle.defaultProps = {
   width: '5px',
   height: '65px',
   x: '-50%',
   y: '-100%',
   rotation: 0,
-  className: '' // style
-
+  className: ''
+  // style
 };
+
 export default ChartNeedle;

package/components/charts/ChartTooltip.js

@@ -1,6 +1,5 @@
 var ChartTooltip = function ChartTooltip() {
   return null;
 };
-
 ChartTooltip.defaultProps = {};
 export default ChartTooltip;

package/components/charts/Legend.js

@@ -1,7 +1,6 @@
 var Legend = function Legend() {
   return null;
 };
-
 Legend.defaultProps = {
   iconType: 'square',
   iconSize: '12',

package/components/charts/Line.js

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

package/components/charts/LineChart.js

@@ -1,30 +1,28 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["width", "height", "data", "dataUnit", "dataKey", "lines", "xAxisOptions", "yAxisOptions", "gridOptions", "showXAxis", "showYAxis", "showGrid", "legend", "tooltip", "brush"],
-    _excluded2 = ["strokeColor"];
+  _excluded2 = ["strokeColor"];
 import React from 'react';
 import { LineChart as RechartsLineChart, Line as RechartsLine, Legend as RechartsLegend, XAxis, YAxis, Brush, Tooltip as RechartsTooltip, CartesianGrid, ResponsiveContainer } from 'recharts';
 import { getColor, mapGridOptions } from './chartHelper';
 import ChartTooltip from './ChartTooltip';
-
 var LineChart = function LineChart(props) {
   var width = props.width,
-      height = props.height,
-      data = props.data,
-      dataUnit = props.dataUnit,
-      dataKey = props.dataKey,
-      lines = props.lines,
-      xAxisOptions = props.xAxisOptions,
-      yAxisOptions = props.yAxisOptions,
-      gridOptions = props.gridOptions,
-      showXAxis = props.showXAxis,
-      showYAxis = props.showYAxis,
-      showGrid = props.showGrid,
-      legend = props.legend,
-      tooltip = props.tooltip,
-      brush = props.brush,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    height = props.height,
+    data = props.data,
+    dataUnit = props.dataUnit,
+    dataKey = props.dataKey,
+    lines = props.lines,
+    xAxisOptions = props.xAxisOptions,
+    yAxisOptions = props.yAxisOptions,
+    gridOptions = props.gridOptions,
+    showXAxis = props.showXAxis,
+    showYAxis = props.showYAxis,
+    showGrid = props.showGrid,
+    legend = props.legend,
+    tooltip = props.tooltip,
+    brush = props.brush,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   return /*#__PURE__*/React.createElement(ResponsiveContainer, {
     width: "100%",
     height: "100%"
@@ -52,9 +50,8 @@ var LineChart = function LineChart(props) {
     } : legend.props.wrapperStyle
   }, legend.props)), lines.map(function (line) {
     var _line$props = line.props,
-        strokeColor = _line$props.strokeColor,
-        remainingLineProps = _objectWithoutProperties(_line$props, _excluded2);
-
+      strokeColor = _line$props.strokeColor,
+      remainingLineProps = _objectWithoutProperties(_line$props, _excluded2);
     return /*#__PURE__*/React.createElement(RechartsLine, _extends({
       key: line.key,
       stroke: getColor(strokeColor)
@@ -63,7 +60,6 @@ var LineChart = function LineChart(props) {
     stroke: getColor('gray')
   })));
 };
-
 LineChart.defaultProps = {
   width: 480,
   height: 200,
@@ -78,7 +74,8 @@ LineChart.defaultProps = {
   showYAxis: false,
   showGrid: false,
   brush: false,
-  tooltip: /*#__PURE__*/React.createElement(ChartTooltip, null) // legend,
-
+  tooltip: /*#__PURE__*/React.createElement(ChartTooltip, null)
+  // legend,
 };
+
 export default LineChart;

package/components/charts/PieChart.js

@@ -8,35 +8,33 @@ import { getFromDefaultColors, getColor } from './chartHelper';
 import Legend from './Legend';
 import ChartTooltip from './ChartTooltip';
 var RADIAN = Math.PI / 180;
-
 var PieChart = function PieChart(props) {
   var width = props.width,
-      height = props.height,
-      innerRadius = props.innerRadius,
-      outerRadius = props.outerRadius,
-      data = props.data,
-      dataKey = props.dataKey,
-      dataUnit = props.dataUnit,
-      nameKey = props.nameKey,
-      color = props.color,
-      filled = props.filled,
-      labels = props.labels,
-      innerLabels = props.innerLabels,
-      paddingAngle = props.paddingAngle,
-      legend = props.legend,
-      tooltip = props.tooltip,
-      pieOptions = props.pieOptions,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    height = props.height,
+    innerRadius = props.innerRadius,
+    outerRadius = props.outerRadius,
+    data = props.data,
+    dataKey = props.dataKey,
+    dataUnit = props.dataUnit,
+    nameKey = props.nameKey,
+    color = props.color,
+    filled = props.filled,
+    labels = props.labels,
+    innerLabels = props.innerLabels,
+    paddingAngle = props.paddingAngle,
+    legend = props.legend,
+    tooltip = props.tooltip,
+    pieOptions = props.pieOptions,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var renderInnerLabel = function renderInnerLabel(_ref) {
     var cx = _ref.cx,
-        cy = _ref.cy,
-        midAngle = _ref.midAngle,
-        innerRadius = _ref.innerRadius,
-        outerRadius = _ref.outerRadius,
-        percent = _ref.percent,
-        index = _ref.index,
-        value = _ref.value;
+      cy = _ref.cy,
+      midAngle = _ref.midAngle,
+      innerRadius = _ref.innerRadius,
+      outerRadius = _ref.outerRadius,
+      percent = _ref.percent,
+      index = _ref.index,
+      value = _ref.value;
     var radius = innerRadius + (outerRadius - innerRadius) * 0.5;
     var x = cx + radius * Math.cos(-midAngle * RADIAN);
     var y = cy + radius * Math.sin(-midAngle * RADIAN);
@@ -48,11 +46,9 @@ var PieChart = function PieChart(props) {
       dominantBaseline: "central"
     }, "".concat(value, " ").concat(dataUnit));
   };
-
   var renderLabels = function renderLabels(entry) {
     return "".concat(isFunction(dataKey) ? dataKey(entry) : entry[dataKey], " ").concat(dataUnit);
   };
-
   var pieLabel = labels && (innerLabels ? renderInnerLabel : renderLabels);
   return /*#__PURE__*/React.createElement(ResponsiveContainer, {
     width: width,
@@ -68,7 +64,8 @@ var PieChart = function PieChart(props) {
     isAnimationActive: true,
     nameKey: nameKey,
     dataKey: dataKey,
-    label: pieLabel // cx={Math.max(outerRadius, width / 3)}
+    label: pieLabel
+    // cx={Math.max(outerRadius, width / 3)}
     // cy={height / 2}
     ,
     innerRadius: filled ? 0 : innerRadius,
@@ -87,7 +84,6 @@ var PieChart = function PieChart(props) {
     }
   }, tooltip.props))));
 };
-
 PieChart.defaultProps = {
   width: '100%',
   height: 250,

package/components/charts/RadialBarChart.js

@@ -1,43 +1,40 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["width", "height", "data", "dataKey", "startAngle", "endAngle", "innerRadius", "outerRadius", "clockWise", "legend", "textOptions", "radialBarOptions", "showBarLabel", "cornerRadius", "background", "range", "tooltip"],
-    _excluded2 = ["text", "size", "weight", "color"];
+  _excluded2 = ["text", "size", "weight", "color"];
 import React from 'react';
 import { RadialBarChart as RechartsRadialBarChart, RadialBar as RechartsRadialBar, Legend as RechartsLegend, PolarAngleAxis, Cell, Tooltip as RechartsTooltip, ResponsiveContainer } from 'recharts';
 import isFunction from 'lodash/fp/isFunction';
 import { getColor, getFromDefaultColors, CURSOR_BACKGROUND_COLOR } from './chartHelper';
 import Legend from './Legend';
-
 var RadialBarChart = function RadialBarChart(props) {
   var width = props.width,
-      height = props.height,
-      data = props.data,
-      dataKey = props.dataKey,
-      startAngle = props.startAngle,
-      endAngle = props.endAngle,
-      innerRadius = props.innerRadius,
-      outerRadius = props.outerRadius,
-      clockWise = props.clockWise,
-      legend = props.legend,
-      textOptions = props.textOptions,
-      radialBarOptions = props.radialBarOptions,
-      showBarLabel = props.showBarLabel,
-      cornerRadius = props.cornerRadius,
-      background = props.background,
-      range = props.range,
-      tooltip = props.tooltip,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    height = props.height,
+    data = props.data,
+    dataKey = props.dataKey,
+    startAngle = props.startAngle,
+    endAngle = props.endAngle,
+    innerRadius = props.innerRadius,
+    outerRadius = props.outerRadius,
+    clockWise = props.clockWise,
+    legend = props.legend,
+    textOptions = props.textOptions,
+    radialBarOptions = props.radialBarOptions,
+    showBarLabel = props.showBarLabel,
+    cornerRadius = props.cornerRadius,
+    background = props.background,
+    range = props.range,
+    tooltip = props.tooltip,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var _ref = textOptions || {},
-      text = _ref.text,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? '500%' : _ref$size,
-      _ref$weight = _ref.weight,
-      weight = _ref$weight === void 0 ? 'normal' : _ref$weight,
-      _ref$color = _ref.color,
-      color = _ref$color === void 0 ? 'gray-darkest' : _ref$color,
-      remainingTextOptions = _objectWithoutProperties(_ref, _excluded2);
-
+    text = _ref.text,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? '500%' : _ref$size,
+    _ref$weight = _ref.weight,
+    weight = _ref$weight === void 0 ? 'normal' : _ref$weight,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? 'gray-darkest' : _ref$color,
+    remainingTextOptions = _objectWithoutProperties(_ref, _excluded2);
   var textStyle = {
     fontSize: size,
     fontWeight: weight,
@@ -93,7 +90,6 @@ var RadialBarChart = function RadialBarChart(props) {
     }
   }, tooltip.props))));
 };
-
 RadialBarChart.defaultProps = {
   width: 400,
   height: 200,

package/components/charts/chartHelper.js

@@ -1,9 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 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 colors from '../../styles/shared/colors.json';
 var brightColors = ['color-warmup-corn', 'color-coldplay-khaki'];
 export var defaultChartColors = Object.keys(colors).reverse().filter(function (key) {
@@ -22,9 +19,7 @@ export var mapGridOptions = function mapGridOptions(gridOptions) {
   if (!gridOptions) {
     return;
   }
-
   var mappedGridOptions = _objectSpread({}, gridOptions);
-
   var stroke = mappedGridOptions.stroke;
   mappedGridOptions.stroke = stroke && !stroke.startsWith('#') ? getColor(stroke) : stroke;
   return mappedGridOptions;

package/components/checkbox/Checkbox.js

@@ -4,12 +4,11 @@ var _excluded = ["checked", "children", "className", "custom", "defaultChecked",
 import React, { useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import classname from 'classnames';
-
 var CheckboxIcon = function CheckboxIcon(props) {
   var icon = props.icon,
-      iconSize = props.iconSize,
-      iconLabelPosition = props.iconLabelPosition,
-      text = props.text;
+    iconSize = props.iconSize,
+    iconLabelPosition = props.iconLabelPosition,
+    text = props.text;
   var iconStyles = {
     width: "".concat(iconSize, "px"),
     height: "".concat(iconSize, "px"),
@@ -25,79 +24,66 @@ var CheckboxIcon = function CheckboxIcon(props) {
     className: "checkbox-label"
   }, text));
 };
-
 var Checkbox = function Checkbox(props) {
   var checked = props.checked,
-      children = props.children,
-      className = props.className,
-      custom = props.custom,
-      defaultChecked = props.defaultChecked,
-      disabled = props.disabled,
-      error = props.error,
-      icon = props.icon,
-      iconLabelPosition = props.iconLabelPosition,
-      iconSize = props.iconSize,
-      _props$id = props.id,
-      id = _props$id === void 0 ? props.name : _props$id,
-      indeterminate = props.indeterminate,
-      inline = props.inline,
-      inputRef = props.inputRef,
-      label = props.label,
-      name = props.name,
-      onChange = props.onChange,
-      onClick = props.onClick,
-      required = props.required,
-      right = props.right,
-      size = props.size,
-      tabIndex = props.tabIndex,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    children = props.children,
+    className = props.className,
+    custom = props.custom,
+    defaultChecked = props.defaultChecked,
+    disabled = props.disabled,
+    error = props.error,
+    icon = props.icon,
+    iconLabelPosition = props.iconLabelPosition,
+    iconSize = props.iconSize,
+    _props$id = props.id,
+    id = _props$id === void 0 ? props.name : _props$id,
+    indeterminate = props.indeterminate,
+    inline = props.inline,
+    inputRef = props.inputRef,
+    label = props.label,
+    name = props.name,
+    onChange = props.onChange,
+    onClick = props.onClick,
+    required = props.required,
+    right = props.right,
+    size = props.size,
+    tabIndex = props.tabIndex,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var labelRef = useRef();
-
   var getInput = function getInput() {
     return labelRef.current.firstChild;
   };
-
   useEffect(function () {
     var input = getInput();
     input.indeterminate = indeterminate;
   }, [indeterminate]);
-
   var handleToggleKeyDown = function handleToggleKeyDown(event) {
     switch (event.keyCode) {
       case 32:
         // toggle on space
         toggle(event);
         break;
-
       case 13:
         // open on enter
         toggle(event);
         break;
-
       default:
         break;
     }
   };
-
   var toggle = function toggle(event) {
     event.preventDefault();
-
     if (disabled) {
       return;
     }
-
     var input = getInput();
-
     if (input.indeterminate) {
       input.indeterminate = false;
     }
-
     input.checked = !input.checked;
     onClick(event);
     onChange(event);
   };
-
   var text = label || children;
   var labelClassnames = classname('checkbox', inline && 'checkbox-inline', size === 'large' && 'checkbox-large', right && 'checkbox-right', className);
   var inputClassnames = classname(error && 'error', size === 'large' && 'large', indeterminate && 'indeterminate', className);
@@ -131,7 +117,6 @@ var Checkbox = function Checkbox(props) {
     className: "checkbox-text"
   }, /*#__PURE__*/React.createElement("span", null, text)), renderCustomContent && children);
 };
-
 Checkbox.ICON_LABEL_VERTICAL = 'vertical';
 Checkbox.ICON_LABEL_HORIZONTAL = 'horizontal';
 Checkbox.defaultProps = {

package/components/clearableInput/ClearableInput.js

@@ -7,15 +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 = ["children", "className", "inputClassName", "type", "hasError", "inputRef", "autoComplete"];
-
 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; }
-
 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; } }
-
 import React from 'react';
 import PropTypes from 'prop-types';
 import omit from 'lodash/fp/omit';
@@ -24,17 +19,12 @@ import isEmpty from 'lodash/fp/isEmpty';
 import classNames from 'classnames';
 export var DEFAULT_TYPE = 'text';
 export var SUPPORTED_TYPES = ['text', 'password', 'email'];
-
 var ClearableInput = /*#__PURE__*/function (_React$Component) {
   _inherits(ClearableInput, _React$Component);
-
   var _super = _createSuper(ClearableInput);
-
   function ClearableInput(props) {
     var _this;
-
     _classCallCheck(this, ClearableInput);
-
     _this = _super.call(this, props);
     var initialValue = props.value || props.defaultValue || '';
     _this.state = {
@@ -47,32 +37,33 @@ var ClearableInput = /*#__PURE__*/function (_React$Component) {
     _this.handleKeyPress = _this.handleKeyPress.bind(_assertThisInitialized(_this));
     _this.clearInputValue = _this.clearInputValue.bind(_assertThisInitialized(_this));
     return _this;
-  } // only gets triggered on user interaction.
-
+  }
 
+  // only gets triggered on user interaction.
   _createClass(ClearableInput, [{
     key: "handleChange",
     value: function handleChange(event) {
       var isControlled = this.state.isControlled;
       var onChange = this.props.onChange;
       var value = event.target.value;
-
       if (isControlled) {
         onChange(value, event);
       } else {
         this.changeInternalValue(value, event);
         onChange(value, event);
       }
-    } // Will be triggered on every key press but also when pressing 'Enter' for example
+    }
 
+    // Will be triggered on every key press but also when pressing 'Enter' for example
   }, {
     key: "handleKeyPress",
     value: function handleKeyPress(event) {
       var onKeyPress = this.props.onKeyPress;
       onKeyPress(event);
-    } // important for when used as a controlled component (value from outside).
-    // eslint-disable-next-line camelcase
+    }
 
+    // important for when used as a controlled component (value from outside).
+    // eslint-disable-next-line camelcase
   }, {
     key: "UNSAFE_componentWillReceiveProps",
     value: function UNSAFE_componentWillReceiveProps(nextProps) {
@@ -82,21 +73,19 @@ var ClearableInput = /*#__PURE__*/function (_React$Component) {
     key: "hasValue",
     value: function hasValue(value) {
       return !isEmpty("".concat(value));
-    } // handles new input value and saves it in the state.
-    // the value stored in the state is used for rendering.
+    }
 
+    // handles new input value and saves it in the state.
+    // the value stored in the state is used for rendering.
   }, {
     key: "changeInternalValue",
     value: function changeInternalValue() {
       var _this2 = this;
-
       var newValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-
       // this is there to prevent that onChange and UNSAFE_componentWillReceiveProps set state at the same time
       if (this.state.inputValue === newValue) {
         return;
       }
-
       this.setState(function () {
         return {
           inputValue: newValue,
@@ -108,42 +97,39 @@ var ClearableInput = /*#__PURE__*/function (_React$Component) {
     key: "clearInputValue",
     value: function clearInputValue(event) {
       var _this$props = this.props,
-          onChange = _this$props.onChange,
-          onClear = _this$props.onClear;
+        onChange = _this$props.onChange,
+        onClear = _this$props.onClear;
       this.changeInternalValue('', event);
       onChange('', event);
-
       if (onClear) {
         onClear(event);
       }
-    } // it is always the value from the state which is used for rendering.
+    }
+
+    // it is always the value from the state which is used for rendering.
     // reason: make it possible to use the component as a controlled or uncontrolled component.
     // https://facebook.github.io/react/docs/uncontrolled-components.html
-
   }, {
     key: "render",
     value: function render() {
       var filteredProps = omit(['value', 'defaultValue', 'onClear']);
-
       var _this$props2 = this.props,
-          children = _this$props2.children,
-          className = _this$props2.className,
-          inputClassName = _this$props2.inputClassName,
-          type = _this$props2.type,
-          hasError = _this$props2.hasError,
-          inputRef = _this$props2.inputRef,
-          autoComplete = _this$props2.autoComplete,
-          customProps = _objectWithoutProperties(_this$props2, _excluded);
-
+        children = _this$props2.children,
+        className = _this$props2.className,
+        inputClassName = _this$props2.inputClassName,
+        type = _this$props2.type,
+        hasError = _this$props2.hasError,
+        inputRef = _this$props2.inputRef,
+        autoComplete = _this$props2.autoComplete,
+        customProps = _objectWithoutProperties(_this$props2, _excluded);
       var _this$state = this.state,
-          showClear = _this$state.showClear,
-          inputValue = _this$state.inputValue;
+        showClear = _this$state.showClear,
+        inputValue = _this$state.inputValue;
       var classes = classNames('ClearableInput', 'input-group', hasError && 'has-error', className && className);
       var inputClassNames = classNames('form-control', inputClassName, showClear && 'withClearButton');
       var clearButtonClassNames = classNames('clearButton', !showClear && 'hide');
       var convertedType = type && type.toLowerCase();
       var inputType = SUPPORTED_TYPES.indexOf(convertedType) !== -1 ? convertedType : DEFAULT_TYPE;
-
       var inputProps = _objectSpread(_objectSpread({}, filteredProps(customProps)), {}, {
         className: inputClassNames,
         type: inputType,
@@ -153,7 +139,6 @@ var ClearableInput = /*#__PURE__*/function (_React$Component) {
         ref: inputRef,
         autoComplete: autoComplete
       });
-
       return /*#__PURE__*/React.createElement("div", {
         className: classes
       }, children ? children(inputProps) : /*#__PURE__*/React.createElement("input", inputProps), /*#__PURE__*/React.createElement("span", {
@@ -164,10 +149,8 @@ var ClearableInput = /*#__PURE__*/function (_React$Component) {
       })));
     }
   }]);
-
   return ClearableInput;
 }(React.Component);
-
 ClearableInput.defaultProps = {
   type: DEFAULT_TYPE,
   className: '',