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

package/components/numberControl/NumberControl.js

@@ -8,67 +8,58 @@ import classNames from 'classnames';
 import NumberInput, { defaultProps, convertNonIntegerToDefault } from '../numberInput/NumberInput';
 var INITIAL_TICK = 700;
 var TICK_TIME = 50;
-
 var NumberControl = function NumberControl(props) {
   var _props$min = props.min,
-      min = _props$min === void 0 ? defaultProps.min : _props$min,
-      _props$max = props.max,
-      max = _props$max === void 0 ? defaultProps.max : _props$max,
-      _props$step = props.step,
-      step = _props$step === void 0 ? defaultProps.step : _props$step,
-      _props$value = props.value,
-      value = _props$value === void 0 ? defaultProps.value : _props$value,
-      _props$onValueChanged = props.onValueChanged,
-      onValueChanged = _props$onValueChanged === void 0 ? function () {} : _props$onValueChanged,
-      disabled = props.disabled,
-      bsSize = props.bsSize,
-      className = props.className,
-      unit = props.unit,
-      inputAddon = props.inputAddon,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    min = _props$min === void 0 ? defaultProps.min : _props$min,
+    _props$max = props.max,
+    max = _props$max === void 0 ? defaultProps.max : _props$max,
+    _props$step = props.step,
+    step = _props$step === void 0 ? defaultProps.step : _props$step,
+    _props$value = props.value,
+    value = _props$value === void 0 ? defaultProps.value : _props$value,
+    _props$onValueChanged = props.onValueChanged,
+    onValueChanged = _props$onValueChanged === void 0 ? function () {} : _props$onValueChanged,
+    disabled = props.disabled,
+    bsSize = props.bsSize,
+    className = props.className,
+    unit = props.unit,
+    inputAddon = props.inputAddon,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var timeout = useRef();
-
   var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      isHoldingDownInc = _useState2[0],
-      setIsHoldingDownInc = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    isHoldingDownInc = _useState2[0],
+    setIsHoldingDownInc = _useState2[1];
   var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isHoldingDownDec = _useState4[0],
-      setIsHoldingDownDec = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    isHoldingDownDec = _useState4[0],
+    setIsHoldingDownDec = _useState4[1];
   var _useState5 = useState(value),
-      _useState6 = _slicedToArray(_useState5, 2),
-      internalValue = _useState6[0],
-      setInternalValue = _useState6[1];
-
+    _useState6 = _slicedToArray(_useState5, 2),
+    internalValue = _useState6[0],
+    setInternalValue = _useState6[1];
   var initialTimeout = function initialTimeout(callback) {
     clearTimeout(timeout.current);
     timeout.current = setTimeout(function () {
       callback();
     }, INITIAL_TICK);
   };
-
   var recursiveTimeout = function recursiveTimeout(callback) {
     timeout.current = setTimeout(function () {
       callback();
     }, TICK_TIME);
   };
-
   useEffect(function () {
     // Call increment function for a loop when button is holding down
     if (isHoldingDownInc && !disabled) {
       initialTimeout(incrementRecusively);
-    } // Call decrement function for a loop when button is holding down
-
+    }
 
+    // Call decrement function for a loop when button is holding down
     if (isHoldingDownDec && !disabled) {
       initialTimeout(decrementRecursively);
     }
   }, [isHoldingDownInc, isHoldingDownDec]);
-
   var incrementInternalValue = function incrementInternalValue() {
     setInternalValue(function (val) {
       var currentValue = convertNonIntegerToDefault(val);
@@ -76,7 +67,6 @@ var NumberControl = function NumberControl(props) {
       return newValue <= max ? newValue : val;
     });
   };
-
   var decrementInternalValue = function decrementInternalValue() {
     setInternalValue(function (val) {
       var currentValue = convertNonIntegerToDefault(val);
@@ -84,43 +74,37 @@ var NumberControl = function NumberControl(props) {
       return newValue >= min ? newValue : val;
     });
   };
-
   var incrementRecusively = function incrementRecusively() {
     incrementInternalValue();
     recursiveTimeout(incrementRecusively);
   };
-
   var decrementRecursively = function decrementRecursively() {
     decrementInternalValue();
     recursiveTimeout(decrementRecursively);
   };
-
   var handleMouseDownOnIncrement = function handleMouseDownOnIncrement() {
     if (disabled) {
       return;
     }
+    setIsHoldingDownInc(true);
 
-    setIsHoldingDownInc(true); // increment for first click
-
+    // increment for first click
     incrementInternalValue();
   };
-
   var handleMouseDownOnDecrement = function handleMouseDownOnDecrement() {
     if (disabled) {
       return;
     }
+    setIsHoldingDownDec(true);
 
-    setIsHoldingDownDec(true); // decrement for first click
-
+    // decrement for first click
     decrementInternalValue();
   };
-
   var handleStopHolding = function handleStopHolding() {
     clearTimeout(timeout.current);
     setIsHoldingDownInc(false);
     setIsHoldingDownDec(false);
   };
-
   var handleUpdatedNumberInputValue = function handleUpdatedNumberInputValue(value) {
     // Set the internal value when the value of the actual input has changed,
     // for instance the user has typed in a number manually and to
@@ -129,10 +113,8 @@ var NumberControl = function NumberControl(props) {
     if (value && (!isHoldingDownDec || !isHoldingDownInc)) {
       setInternalValue(Number(value));
     }
-
     onValueChanged(value);
   };
-
   var classes = classNames('NumberControl', 'form-group', className);
   var inputGroupClassNames = classNames('input-group', bsSize === 'sm' && 'input-group-sm', bsSize === 'lg' && 'input-group-lg');
   return /*#__PURE__*/React.createElement("div", _extends({}, remainingProps, {
@@ -172,7 +154,6 @@ var NumberControl = function NumberControl(props) {
     className: 'rioglyph rioglyph-plus scale-90'
   })))));
 };
-
 NumberControl.propTypes = {
   min: PropTypes.number,
   max: PropTypes.number,

package/components/numberInput/NumberInput.js

@@ -12,70 +12,63 @@ export var defaultProps = {
   value: 0,
   step: 1
 };
-
 var getStepFromProps = function getStepFromProps(propStep, defaultStep, max, min) {
   return Number.isInteger(propStep) && propStep < Math.abs(max - min) ? propStep : defaultStep;
 };
-
 var getValueFromProps = function getValueFromProps(val, min, max, fallback) {
   return clampNumber(Number(val), min, max) || fallback;
 };
-
 var clampNumber = function clampNumber(value, min, max) {
   if (value < min) {
     return min;
   } else if (value > max) {
     return max;
   }
-
   return value;
 };
-
 var isFormatted = function isFormatted(value) {
   return /^(-)?([1-9]\d*)?$/.test(value) || value === '0';
 };
-
 export var convertNonIntegerToDefault = function convertNonIntegerToDefault(value, min) {
   var currentValue = value;
-
   if (!Number.isInteger(currentValue)) {
     currentValue = min;
   }
-
   return currentValue;
 };
 var NumberInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var unit = props.unit,
-      inputAddon = props.inputAddon,
-      className = props.className,
-      bsSize = props.bsSize,
-      disabled = props.disabled,
-      _props$onValueChanged = props.onValueChanged,
-      onValueChanged = _props$onValueChanged === void 0 ? function () {} : _props$onValueChanged,
-      propMin = props.min,
-      propMax = props.max,
-      propValue = props.value,
-      propStep = props.step,
-      propType = props.type,
-      remainingProps = _objectWithoutProperties(props, _excluded); // Breaking change - default is now "number"
-
-
+    inputAddon = props.inputAddon,
+    className = props.className,
+    bsSize = props.bsSize,
+    disabled = props.disabled,
+    _props$onValueChanged = props.onValueChanged,
+    onValueChanged = _props$onValueChanged === void 0 ? function () {} : _props$onValueChanged,
+    propMin = props.min,
+    propMax = props.max,
+    propValue = props.value,
+    propStep = props.step,
+    propType = props.type,
+    remainingProps = _objectWithoutProperties(props, _excluded);
+
+  // Breaking change - default is now "number"
   var type = propType === 'text' ? 'text' : 'number';
   var min = Number.isInteger(propMin) ? propMin : defaultProps.min;
   var max = Number.isInteger(propMax) ? propMax : defaultProps.max;
   var value = getValueFromProps(propValue, min, max, defaultProps.value);
-  var step = getStepFromProps(propStep, defaultProps.step, max, min); // Define local state and define initial values
+  var step = getStepFromProps(propStep, defaultProps.step, max, min);
 
+  // Define local state and define initial values
   var _useState = useState({
-    value: value,
-    enteredValue: value,
-    isValid: true
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1]; // Update internal value whenever the value prop from outside changes
-
+      value: value,
+      enteredValue: value,
+      isValid: true
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    state = _useState2[0],
+    setState = _useState2[1];
 
+  // Update internal value whenever the value prop from outside changes
   useAfterMount(function () {
     setState({
       value: getValueFromProps(propValue, min, max, defaultProps.value),
@@ -83,7 +76,6 @@ var NumberInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
       isValid: true
     });
   }, [propValue, clampNumber]);
-
   var applyValue = function applyValue(newValue) {
     if (isFormatted(newValue)) {
       if (newValue === '-' || newValue === '') {
@@ -100,34 +92,32 @@ var NumberInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
           value: newValidValue,
           enteredValue: enteredValue,
           isValid: isValid
-        }); // Only call back the caller for valid values
+        });
 
+        // Only call back the caller for valid values
         isValid && onValueChanged(newValidValue);
       }
     }
   };
-
   var handleOnChange = function handleOnChange(event) {
     return applyValue(event.target.value);
   };
-
   var handleBlur = function handleBlur(event) {
     // console.log({enteredValue: state.enteredValue, event: Number(event.target.value)});
+
     // When the vales is removed, keep the input empty but trigger the onValueChanged callback
     // since the user has finished his input
     var lastEnteredValue = state.enteredValue;
-
     if (lastEnteredValue === '') {
       onValueChanged(lastEnteredValue);
       return;
-    } // Otherwise, validate the input and calmp it if the entered value exeeds the limitations
-
+    }
 
+    // Otherwise, validate the input and calmp it if the entered value exeeds the limitations
     var convertedEnteredValue = convertNonIntegerToDefault(Number(lastEnteredValue), min);
     var validNumber = clampNumber(convertedEnteredValue, min, max);
     applyValue(validNumber);
   };
-
   var inputGroupClassNames = classNames('input-group', bsSize === 'sm' && 'input-group-sm', bsSize === 'lg' && 'input-group-lg');
   var inputClassNames = classNames('form-control', 'no-controls', bsSize === 'sm' && 'input-sm', bsSize === 'lg' && 'input-lg', className);
   var input = /*#__PURE__*/React.createElement("input", _extends({}, remainingProps, {

package/components/onboarding/OnboardingTip.js

@@ -7,22 +7,24 @@ var DELAY_SHOW = 500;
 var DELAY_HIDE = 300;
 export default function OnboardingTip(props) {
   var id = props.id,
-      show = props.show,
-      placement = props.placement,
-      title = props.title,
-      content = props.content,
-      onHide = props.onHide,
-      children = props.children,
-      textAlignment = props.textAlignment,
-      useInDialog = props.useInDialog,
-      clickflow = props.clickflow,
-      showCloseIcon = props.showCloseIcon,
-      className = props.className,
-      width = props.width,
-      preventOverflow = props.preventOverflow,
-      popperConfig = props.popperConfig;
-  var tooltipWrapperClasses = classNames(useInDialog && 'z-index-max', className && className, clickflow && 'onboarding-clickflow' // clickflowBackdrop && 'onboarding-clickflow-backdrop'
+    show = props.show,
+    placement = props.placement,
+    title = props.title,
+    content = props.content,
+    onHide = props.onHide,
+    children = props.children,
+    textAlignment = props.textAlignment,
+    useInDialog = props.useInDialog,
+    clickflow = props.clickflow,
+    showCloseIcon = props.showCloseIcon,
+    className = props.className,
+    width = props.width,
+    preventOverflow = props.preventOverflow,
+    popperConfig = props.popperConfig;
+  var tooltipWrapperClasses = classNames(useInDialog && 'z-index-max', className && className, clickflow && 'onboarding-clickflow'
+  // clickflowBackdrop && 'onboarding-clickflow-backdrop'
   );
+
   var overlay = /*#__PURE__*/React.createElement(Tooltip, {
     className: tooltipWrapperClasses,
     tooltipStyle: Tooltip.STYLE_ONBOARDING,

package/components/overlay/OverlayTrigger.js

@@ -6,8 +6,7 @@ import PropTypes from 'prop-types';
 import { default as _OverlayTrigger } from 'react-bootstrap/OverlayTrigger';
 export default function OverlayTrigger(props) {
   var rootClose = props.rootClose,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    remainingProps = _objectWithoutProperties(props, _excluded);
   return /*#__PURE__*/React.createElement(_OverlayTrigger, _extends({
     rootClose: rootClose
   }, remainingProps));

package/components/pager/Pager.js

@@ -5,36 +5,32 @@ var _excluded = ["title", "label", "alignRight", "variant", "disabled", "onClick
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-
 var Pager = function Pager(props) {
   var title = props.title,
-      label = props.label,
-      alignRight = props.alignRight,
-      variant = props.variant,
-      disabled = props.disabled,
-      onClick = props.onClick,
-      className = props.className,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    label = props.label,
+    alignRight = props.alignRight,
+    variant = props.variant,
+    disabled = props.disabled,
+    onClick = props.onClick,
+    className = props.className,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      isHover = _useState2[0],
-      setIsHover = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    isHover = _useState2[0],
+    setIsHover = _useState2[1];
   var handleEnter = function handleEnter() {
     return !disabled && setIsHover(true);
   };
-
   var handleLeave = function handleLeave() {
     return setIsHover(false);
   };
-
   var isCompactVariant = variant === Pager.VARIANT_COMPACT;
   var wrapperClassesBase = classNames('Pager', 'bg-white', 'border', 'display-flex justify-space-between align-items-center', isHover && 'border-color-highlight', alignRight && 'flex-row-reverse', disabled && 'pointer-events-none', 'cursor-pointer user-select-none');
   var iconClassesBase = classNames('rioplyph', disabled ? 'text-color-light' : 'text-color-darker', isHover && 'text-color-highlight');
-  var titleClassesBase = classNames(disabled ? 'text-color-light' : 'text-color-darker', isHover && 'text-color-highlight'); // The compact version has a slightly different markup and different classes for the
-  // individual parts, hence we extend the base classes
+  var titleClassesBase = classNames(disabled ? 'text-color-light' : 'text-color-darker', isHover && 'text-color-highlight');
 
+  // The compact version has a slightly different markup and different classes for the
+  // individual parts, hence we extend the base classes
   if (isCompactVariant) {
     var wrapperClassesCompact = classNames(wrapperClassesBase, 'rounded-circle', 'padding-y-5 padding-x-15', 'width-auto', className);
     var iconClassesCompact = classNames(iconClassesBase, alignRight ? 'rioglyph-chevron-left margin-right-5' : 'rioglyph-chevron-right margin-left-5', 'text-size-10');
@@ -51,7 +47,6 @@ var Pager = function Pager(props) {
       className: iconClassesCompact
     }));
   }
-
   var wrapperClassesFull = classNames(wrapperClassesBase, 'rounded', 'padding-y-15 padding-x-20', 'width-100pct', className);
   var iconClassesFull = classNames(iconClassesBase, alignRight ? 'rioglyph-arrow-left margin-right-10' : 'rioglyph-arrow-right margin-left-10', 'text-size-200pct');
   var titleClassesFull = classNames(titleClassesBase, alignRight && 'text-right', 'text-size-16 text-medium');
@@ -72,7 +67,6 @@ var Pager = function Pager(props) {
     className: iconClassesFull
   })));
 };
-
 Pager.VARIANT_FULL = 'full';
 Pager.VARIANT_COMPACT = 'compact';
 Pager.defaultProps = {

package/components/popover/Popover.js

@@ -7,13 +7,12 @@ import { default as _Popover } from 'react-bootstrap/Popover';
 import Tooltip from '../tooltip/Tooltip';
 var Popover = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var title = props.title,
-      _props$titleClassName = props.titleClassName,
-      titleClassName = _props$titleClassName === void 0 ? '' : _props$titleClassName,
-      _props$contentClassNa = props.contentClassName,
-      contentClassName = _props$contentClassNa === void 0 ? '' : _props$contentClassNa,
-      children = props.children,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    _props$titleClassName = props.titleClassName,
+    titleClassName = _props$titleClassName === void 0 ? '' : _props$titleClassName,
+    _props$contentClassNa = props.contentClassName,
+    contentClassName = _props$contentClassNa === void 0 ? '' : _props$contentClassNa,
+    children = props.children,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   return /*#__PURE__*/React.createElement(_Popover, _extends({
     ref: ref
   }, remainingProps), title && /*#__PURE__*/React.createElement(_Popover.Title, {

package/components/position/Position.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-
 function formatDegrees(degrees, positivePrefix, negativePrefix) {
   var prefix = degrees >= 0 ? positivePrefix : negativePrefix;
   var absDegrees = Math.abs(degrees);
@@ -8,24 +7,20 @@ function formatDegrees(degrees, positivePrefix, negativePrefix) {
   var minutes = (absDegrees - flooredDegrees) * 60;
   return "".concat(prefix).concat(flooredDegrees, "\xB0 ").concat(minutes.toFixed(3), "\u2032");
 }
-
 var Position = function Position(props) {
   var latitude = props.latitude,
-      longitude = props.longitude,
-      address = props.address;
+    longitude = props.longitude,
+    address = props.address;
   var formattedAddress;
-
   if (!address) {
     formattedAddress = "".concat(formatDegrees(latitude, 'N', 'S'), " ").concat(formatDegrees(longitude, 'E', 'W'));
   } else {
     formattedAddress = address;
   }
-
   return /*#__PURE__*/React.createElement("span", {
     className: 'vehiclePositionInfo'
   }, formattedAddress);
 };
-
 Position.propTypes = {
   latitude: PropTypes.number.isRequired,
   longitude: PropTypes.number.isRequired,

package/components/preloader/ImagePreloader.js

@@ -1,60 +1,49 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useState, useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
-
 var loadImage = function loadImage(onLoad, onError) {
   return function (src, isAnonymous) {
     var imageToLoad = new Image();
-
     if (isAnonymous) {
       imageToLoad.crossOrigin = 'Anonymous';
-    } // pre-load the actual image
-
+    }
 
+    // pre-load the actual image
     imageToLoad.src = src;
     imageToLoad.onload = onLoad;
     imageToLoad.onerror = onError;
     return imageToLoad;
   };
 };
-
 var ImagePreloader = function ImagePreloader(props) {
   var src = props.src,
-      isAnonymous = props.isAnonymous,
-      onLoaded = props.onLoaded,
-      onFailed = props.onFailed,
-      children = props.children;
-
+    isAnonymous = props.isAnonymous,
+    onLoaded = props.onLoaded,
+    onFailed = props.onFailed,
+    children = props.children;
   var _useState = useState(ImagePreloader.STATUS_PENDING),
-      _useState2 = _slicedToArray(_useState, 2),
-      status = _useState2[0],
-      setStatus = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    status = _useState2[0],
+    setStatus = _useState2[1];
   var _useState3 = useState(),
-      _useState4 = _slicedToArray(_useState3, 2),
-      image = _useState4[0],
-      setImage = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    image = _useState4[0],
+    setImage = _useState4[1];
   var willUnmount = useRef();
-
   var handleImageLoaded = function handleImageLoaded() {
     if (willUnmount.current) {
       return;
     }
-
     setStatus(ImagePreloader.STATUS_LOADED);
     onLoaded(image);
   };
-
   var handleImageFailed = function handleImageFailed() {
     if (willUnmount.current) {
       return;
     }
-
     setStatus(ImagePreloader.STATUS_FAILED);
     onFailed(image);
   };
-
   var loadImageWithCallbacks = loadImage(handleImageLoaded, handleImageFailed);
   useEffect(function () {
     setImage(loadImageWithCallbacks(src, isAnonymous));
@@ -71,7 +60,6 @@ var ImagePreloader = function ImagePreloader(props) {
     image: image
   });
 };
-
 ImagePreloader.STATUS_PENDING = 'PENDING';
 ImagePreloader.STATUS_LOADED = 'LOADED';
 ImagePreloader.STATUS_FAILED = 'FAILED';