@rio-cloud/rio-uikit 0.16.1-beta-7 → 0.16.1-beta-10

package/lib/components/steppedProgressBar/SteppedProgressBar.js

@@ -9,15 +9,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
 var _react = _interopRequireWildcard(require("react"));
 
@@ -33,110 +25,68 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } }
-
 var errorProps = [{
   prop: 'labelsClassName',
   replacement: 'labels.labelClassName'
 }];
 
-var SteppedProgressBar = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(SteppedProgressBar, _Component);
-
-  var _super = _createSuper(SteppedProgressBar);
-
-  function SteppedProgressBar(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, SteppedProgressBar);
-    _this = _super.call(this, props);
-    _this.state = {
-      disableFollowingPages: props.disableFollowingPages ? props.disableFollowingPages : _this.props.selectedStepNumber,
-      isValid: true
-    };
-    return _this;
-  } // eslint-disable-next-line camelcase
-
-
-  (0, _createClass2.default)(SteppedProgressBar, [{
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
-      if (nextProps.disableFollowingPages !== undefined) {
-        if (nextProps.disableFollowingPages < nextProps.selectedStepNumber) {
-          // eslint-disable-next-line no-console
-          console.warn('Invalid component state detected in SteppedProgressBar: can not disable following ' + "pages ".concat(nextProps.disableFollowingPages, " when selectedStep is ").concat(nextProps.selectedStep, "!"));
-          this.setState({
-            isValid: false
-          });
-          return;
-        }
-
-        this.setState({
-          disableFollowingPages: nextProps.disableFollowingPages
-        });
-      } else if (nextProps.selectedStepNumber > this.state.disableFollowingPages) {
-        this.setState({
-          disableFollowingPages: nextProps.selectedStepNumber
-        });
-      }
-    }
-  }, {
-    key: "handleSelect",
-    value: function handleSelect(selectedKey) {
-      this.props.onSelectedChanged(Number(selectedKey));
-    }
-  }, {
-    key: "getItems",
-    value: function getItems(labels) {
-      var _this2 = this;
-
-      return labels.map(function (labelObject, index) {
-        return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Link, {
-          eventKey: index,
-          disabled: index > _this2.state.disableFollowingPages,
-          as: 'a',
-          key: index,
-          className: (0, _classnames.default)('step-tab', labelObject.labelWrapperClassName)
-        }, /*#__PURE__*/_react.default.createElement("div", {
-          className: 'step-tab-content'
-        }, /*#__PURE__*/_react.default.createElement("div", {
-          className: 'item-icon'
-        }, labelObject.icon), /*#__PURE__*/_react.default.createElement("div", {
-          className: (0, _classnames.default)('item-label', labelObject.labelClassName)
-        }, labelObject.label)));
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this3 = this;
-
-      if (!this.state.isValid) {
-        return /*#__PURE__*/_react.default.createElement("b", null, "FIXME: INVALID STATE DETECTED!");
+var SteppedProgressBar = function SteppedProgressBar(props) {
+  var className = props.className,
+      variant = props.variant,
+      labels = props.labels,
+      mobileBreakpoint = props.mobileBreakpoint,
+      selectedStepNumber = props.selectedStepNumber,
+      disableFollowingPageIndex = props.disableFollowingPages,
+      onSelectedChanged = props.onSelectedChanged;
+
+  var _useState = (0, _react.useState)(disableFollowingPageIndex ? disableFollowingPageIndex : selectedStepNumber),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      disableFollowingPages = _useState2[0],
+      setDisableFollowingPages = _useState2[1];
+
+  (0, _logPropError.default)(errorProps, props, 'SteppedProgressBar');
+  (0, _react.useEffect)(function () {
+    if (disableFollowingPageIndex !== undefined) {
+      if (disableFollowingPageIndex < selectedStepNumber) {
+        console.warn('Invalid component state detected in SteppedProgressBar: can not disable following ' + "pages ".concat(disableFollowingPageIndex, " when selectedStep is ").concat(selectedStepNumber, "!"));
+        return;
       }
 
-      var _this$props = this.props,
-          className = _this$props.className,
-          variant = _this$props.variant,
-          mobileBreakpoint = _this$props.mobileBreakpoint,
-          selectedStepNumber = _this$props.selectedStepNumber;
-      var wrapperClasses = (0, _classnames.default)('stepped-progress-bar', variant && "variant-".concat(variant), mobileBreakpoint && 'mobile-breakpoint', className && className);
-      (0, _logPropError.default)(errorProps, this.props, 'SteppedProgressBar');
-      return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav, {
-        className: wrapperClasses,
-        activeKey: selectedStepNumber,
-        onSelect: function onSelect(selectedKey) {
-          return _this3.handleSelect(selectedKey);
-        }
-      }, this.getItems(this.props.labels));
+      setDisableFollowingPages(disableFollowingPageIndex);
+    } else if (selectedStepNumber > disableFollowingPages) {
+      setDisableFollowingPages(selectedStepNumber);
     }
-  }]);
-  return SteppedProgressBar;
-}(_react.Component);
+  }, [disableFollowingPageIndex, selectedStepNumber]);
+
+  var handleSelect = function handleSelect(selectedKey) {
+    return onSelectedChanged(Number(selectedKey));
+  };
+
+  var wrapperClasses = (0, _classnames.default)('stepped-progress-bar', variant && "variant-".concat(variant), mobileBreakpoint && 'mobile-breakpoint', className && className);
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav, {
+    className: wrapperClasses,
+    activeKey: selectedStepNumber,
+    onSelect: handleSelect
+  }, labels.map(function (labelObject, index) {
+    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Link, {
+      eventKey: index,
+      disabled: index > disableFollowingPages,
+      as: "a",
+      key: index,
+      className: (0, _classnames.default)('step-tab', labelObject.labelWrapperClassName)
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "step-tab-content"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "item-icon"
+    }, labelObject.icon), /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)('item-label', labelObject.labelClassName)
+    }, labelObject.label)));
+  }));
+};
 
-exports.default = SteppedProgressBar;
+SteppedProgressBar.VARIANT_CIRCLE = 'circle';
+SteppedProgressBar.VARIANT_RECTANGLE = 'rectangle';
+SteppedProgressBar.VARIANT_ROADSIGN = 'roadsign';
 SteppedProgressBar.defaultProps = {
   selectedStepNumber: 1,
   labels: [],
@@ -148,7 +98,7 @@ SteppedProgressBar.propTypes = {
   disableFollowingPages: _propTypes.default.number,
   onSelectedChanged: _propTypes.default.func.isRequired,
   labels: _propTypes.default.arrayOf(_propTypes.default.shape({
-    icon: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]).isRequired,
+    icon: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
     label: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
     labelClassName: _propTypes.default.string,
     labelWrapperClassName: _propTypes.default.string
@@ -157,5 +107,7 @@ SteppedProgressBar.propTypes = {
   selectedStepNumber: _propTypes.default.number.isRequired,
   className: _propTypes.default.string,
   mobileBreakpoint: _propTypes.default.bool,
-  variant: _propTypes.default.oneOf(['circle', 'rectangle', 'roadsign'])
-};
+  variant: _propTypes.default.oneOf([SteppedProgressBar.VARIANT_CIRCLE, SteppedProgressBar.VARIANT_RECTANGLE, SteppedProgressBar.VARIANT_ROADSIGN])
+};
+var _default = SteppedProgressBar;
+exports.default = _default;

package/lib/es/ChartTooltip.d.ts

@@ -0,0 +1,5 @@
+declare module '@rio-cloud/rio-uikit/lib/es/ChartTooltip' {
+    import React from 'react';
+    import { ChartTooltip as ChartTooltipProps } from '../types';
+    export default class ChartTooltip extends React.Component<ChartTooltipProps> {}
+}

package/lib/es/ChartTooltip.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _ChartTooltip2.default;
+  }
+});
+
+var _ChartTooltip2 = _interopRequireDefault(require("../components/charts/ChartTooltip"));

package/lib/es/Colors.js

@@ -12,4 +12,4 @@ Object.defineProperty(exports, "default", {
   }
 });
 
-var _colors2 = _interopRequireDefault(require("../style/css/shared/colors.json"));
+var _colors2 = _interopRequireDefault(require("../css/shared/colors.json"));

package/lib/es/DeviceUtils.d.ts

@@ -5,5 +5,9 @@ declare module '@rio-cloud/rio-uikit/lib/es/DeviceUtils' {
     export function isMobileScreen(): boolean;
     export function inIframe(): boolean;
     export function toggleZoomOnMobile(): boolean;
-    export type MOBILE_SCREEN = number; 
+    export type MOBILE_SCREEN = number;
+    export type SCREEN_SM = number;
+    export type SCREEN_MD = number;
+    export type SCREEN_LG = number;
+    export type SCREEN_XL = number;
 }

package/lib/es/SubNavigation.d.ts

@@ -0,0 +1,5 @@
+declare module '@rio-cloud/rio-uikit/lib/es/SubNavigation' {
+    import React from 'react';
+    import { SubNavigationProps } from '../types';
+    export default class SubNavigation extends React.Component<SubNavigationProps> {}
+}

package/lib/es/SubNavigation.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _SubNavigation2.default;
+  }
+});
+
+var _SubNavigation2 = _interopRequireDefault(require("../components/applicationLayout/SubNavigation"));

package/lib/es/VolkswagenApplicationHeader.d.ts

@@ -0,0 +1,5 @@
+declare module '@rio-cloud/rio-uikit/lib/es/VolkswagenApplicationHeader' {
+    import React from 'react';
+    import { ApplicationHeaderProps } from '../types';
+    export default class VolkswagenApplicationHeader extends React.Component<ApplicationHeaderProps> {}
+}

package/lib/es/VolkswagenApplicationHeader.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _VolkswagenApplicationHeader2.default;
+  }
+});
+
+var _VolkswagenApplicationHeader2 = _interopRequireDefault(require("../themes/Volkswagen/components/applicationHeader/VolkswagenApplicationHeader"));

package/lib/es/deviceUtils.js

@@ -9,6 +9,30 @@ Object.defineProperty(exports, "MOBILE_SCREEN", {
     return _deviceUtils.MOBILE_SCREEN;
   }
 });
+Object.defineProperty(exports, "SCREEN_LG", {
+  enumerable: true,
+  get: function get() {
+    return _deviceUtils.SCREEN_LG;
+  }
+});
+Object.defineProperty(exports, "SCREEN_MD", {
+  enumerable: true,
+  get: function get() {
+    return _deviceUtils.SCREEN_MD;
+  }
+});
+Object.defineProperty(exports, "SCREEN_SM", {
+  enumerable: true,
+  get: function get() {
+    return _deviceUtils.SCREEN_SM;
+  }
+});
+Object.defineProperty(exports, "SCREEN_XL", {
+  enumerable: true,
+  get: function get() {
+    return _deviceUtils.SCREEN_XL;
+  }
+});
 Object.defineProperty(exports, "hasTouch", {
   enumerable: true,
   get: function get() {

package/lib/hooks/useClickOutside.js

@@ -7,6 +7,7 @@ exports.default = useClickOutside;
 
 var _react = require("react");
 
+/* eslint-disable prefer-arrow/prefer-arrow-functions */
 // eslint-disable-next-line max-len
 // Inspired from https://github.com/mantinedev/mantine/blob/master/src/mantine-hooks/src/use-click-outside/use-click-outside.ts
 function useClickOutside(callback) {
@@ -15,7 +16,7 @@ function useClickOutside(callback) {
   (0, _react.useEffect)(function () {
     var listener = function listener(event) {
       if (targetRef.current && !targetRef.current.contains(event.target)) {
-        callback();
+        callback(event);
       }
     };
 

package/lib/index.js

@@ -813,7 +813,7 @@ Object.defineProperty(exports, "useWindowResize", {
 
 var _version = _interopRequireDefault(require("./version.json"));
 
-var _colors2 = _interopRequireDefault(require("./style/css/shared/colors.json"));
+var _colors2 = _interopRequireDefault(require("./styles/shared/colors.json"));
 
 var _Button2 = _interopRequireDefault(require("./components/button/Button"));
 

package/lib/style/css/_exports/rio-website.less

@@ -195,6 +195,10 @@ body .module-content {
     background-size: cover;
   }
 
+  .SubmoduleNavigation .SubmoduleNavigation {
+    padding-left: 0;
+  }
+
   html.show-handheld-navigation & {
     position: fixed;
     top: 0;
@@ -211,6 +215,7 @@ body .module-content {
 
     .ApplicationActionBar {
       position: fixed;
+      right: 0;
 
       li:not(#handheld-navigation) {
         display: none;
@@ -222,7 +227,9 @@ body .module-content {
     }
 
     .SubmoduleNavigation {
+      border-bottom: none;
       display: block;
+      height: auto;
       margin: 50px 0;
       padding-left: 0;
       text-align: center;
@@ -321,14 +328,19 @@ body .module-content {
     }
 
     > .SubmoduleNavigation {
-      > .submodule {
-        @media (max-width: @screen-ls) {
+      @media (max-width: @screen-ls) {
+        padding-left: 0 !important;
+
+        > .submodule {
           display: none;
         }
+      }
 
+      > .submodule {
         @media (min-width: @screen-ls) {
           > .SubmoduleNavigation {
             max-height: calc(~"100vh - 100px");
+            height: auto;
             overflow: auto;
             -webkit-overflow-scrolling: touch;
           }
@@ -2117,32 +2129,34 @@ form[id*="contactForm"] {
   }
 }
 
-.table-responsive {
-  @media (min-width: @screen-ls) {
-    > .table {
-      tr {
-        > td, > th {
-          &:first-child {
-            padding-left: 0;
-          }
+body:not(.legal-documents) {
+  .table-responsive {
+    @media (min-width: @screen-ls) {
+      > .table {
+        tr {
+          > td, > th {
+            &:first-child {
+              padding-left: 0;
+            }
 
-          &:last-child {
-            padding-right: 0;
+            &:last-child {
+              padding-right: 0;
+            }
           }
         }
       }
     }
-  }
 
-  @media (max-width: @screen-ls) {
-    > .table {
-      > thead,
-      > tbody,
-      > tfoot {
-        > tr {
-          > th,
-          > td {
-            white-space: initial;
+    @media (max-width: @screen-ls) {
+      > .table {
+        > thead,
+        > tbody,
+        > tfoot {
+          > tr {
+            > th,
+            > td {
+              white-space: initial;
+            }
           }
         }
       }

package/lib/style/css/_exports/vw-uikit.less

@@ -173,7 +173,7 @@
     display: none;
   }
 
-  .navbar-nav {
+  .nav {
     display: flex;
     justify-content: center !important;
 
@@ -209,6 +209,10 @@
   }
 
   .ApplicationActionBar {
+    position: absolute;
+    right: 0;
+    z-index: 1;
+
     @media (max-width: 580px) {
       display: flex;
       justify-content: center !important;