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

package/SplitButtonDropdown.d.ts

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

package/SplitDialog.d.ts

@@ -1,5 +1,12 @@
-declare module '@rio-cloud/rio-uikit/lib/es/SplitDialog' {
+declare module '@rio-cloud/rio-uikit/SplitDialog' {
     import React from 'react';
     import { SplitDialogProps } from './types';
-    export default class SplitDialog extends React.Component<SplitDialogProps> {}
+    export default class SplitDialog extends React.Component<SplitDialogProps> {
+        static SIZE_SM = 'sm';
+        static SIZE_MD = 'md';
+        static SIZE_LG = 'lg';
+        static SIZE_XL = 'xl';
+        static SIZE_FULL = 'full';
+        static SIZE_FULL_SCREEN = 'fullscreen';
+    }
 }

package/StatsWidget.d.ts

@@ -1,4 +1,4 @@
-declare module '@rio-cloud/rio-uikit/lib/es/StatsWidget' {
+declare module '@rio-cloud/rio-uikit/StatsWidget' {
     import React from 'react';
     import { StatsWidgetProps, StatsWidgetHeaderProps, StatsWidgetBodyProps, StatsWidgetFooterProps } from './types';
 

package/StatsWidgetNumber.d.ts

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

package/StatsWidgetSpacer.d.ts

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

package/StatsWidgets.d.ts

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

package/StatusBar.d.ts

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

package/SteppedProgressBar.d.ts

@@ -1,5 +1,9 @@
-declare module '@rio-cloud/rio-uikit/lib/es/SteppedProgressBar' {
+declare module '@rio-cloud/rio-uikit/SteppedProgressBar' {
     import React from 'react';
     import { SteppedProgressBarProps } from './types';
-    export default class SteppedProgressBar extends React.Component<SteppedProgressBarProps> {}
+    export default class SteppedProgressBar extends React.Component<SteppedProgressBarProps> {
+        static VARIANT_CIRCLE = 'circle';
+        static VARIANT_RECTANGLE = 'rectangle';
+        static VARIANT_ROADSIGN = 'roadsign';
+    }
 }

package/SubNavigation.d.ts

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

package/Switch.d.ts

@@ -1,5 +1,8 @@
-declare module '@rio-cloud/rio-uikit/lib/es/Switch' {
+declare module '@rio-cloud/rio-uikit/Switch' {
     import React from 'react';
     import { SwitchProps } from './types';
-    export default class Switch extends React.Component<SwitchProps> {}
+    export default class Switch extends React.Component<SwitchProps> {
+        static LABEL_POSITION_LEFT = 'left';
+        static LABEL_POSITION_RIGHT = 'right';
+    }
 }

package/TableCardsSorting.d.ts

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

package/TableSearch.d.ts

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

package/TableSettingsDialog.d.ts

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

package/TableToolbar.d.ts

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

package/TableViewToggles.d.ts

@@ -1,4 +1,4 @@
-declare module '@rio-cloud/rio-uikit/lib/es/TableViewToggles' {
+declare module '@rio-cloud/rio-uikit/TableViewToggles' {
     import React from 'react';
     import { TableViewTogglesProps, TableViewTogglesValues } from './types';
 

package/Tag.d.ts

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

package/TagList.d.ts

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

package/TagManager.d.ts

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

package/Teaser.d.ts

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

package/TeaserContainer.d.ts

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

package/TextMarker.d.ts

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

package/TimePicker.d.ts

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

package/ToggleButton.d.ts

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

package/Tooltip.d.ts

@@ -1,5 +1,32 @@
-declare module '@rio-cloud/rio-uikit/lib/es/Tooltip' {
+declare module '@rio-cloud/rio-uikit/Tooltip' {
     import React from 'react';
     import { TooltipProps } from './types';
-    export default class Tooltip extends React.Component<TooltipProps> {}
+    export default class Tooltip extends React.Component<TooltipProps> {
+        static STYLE_DEFAULT = 'default';
+        static STYLE_ONBOARDING = 'onboarding';
+
+        static AUTO_START = 'auto-start';
+        static AUTO = 'auto';
+        static AUTO_END = 'auto-end';
+
+        static TOP_START = 'top-start';
+        static TOP = 'top';
+        static TOP_END = 'top-end';
+
+        static BOTTOM_START = 'bottom-start';
+        static BOTTOM = 'bottom';
+        static BOTTOM_END = 'bottom-end';
+
+        static RIGHT_START = 'right-start';
+        static RIGHT = 'right';
+        static RIGHT_END = 'right-end';
+
+        static LEFT_START = 'left-start';
+        static LEFT = 'left';
+        static LEFT_END = 'left-end';
+
+        static TEXT_ALIGNMENT_LEFT = 'left';
+        static TEXT_ALIGNMENT_CENTER = 'center';
+        static TEXT_ALIGNMENT_RIGHT = 'right';
+    }
 }

package/TrafficLayer.d.ts

@@ -1,4 +1,4 @@
-declare module '@rio-cloud/rio-uikit/lib/es/TrafficLayer' {
+declare module '@rio-cloud/rio-uikit/TrafficLayer' {
     import React from 'react';
     export default class TrafficLayer extends React.Component<any> {}
 }

package/Tree.d.ts

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

package/TreeCategory.d.ts

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

package/TreeOption.d.ts

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

package/TreeSearch.d.ts

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

package/TreeSummary.d.ts

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

package/TruckLayer.d.ts

@@ -1,4 +1,4 @@
-declare module '@rio-cloud/rio-uikit/lib/es/TruckLayer' {
+declare module '@rio-cloud/rio-uikit/TruckLayer' {
     import React from 'react';
     export default class TruckLayer extends React.Component<any> {}
 }

package/TypeCounter.d.ts

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

package/VolkswagenApplicationHeader.d.ts

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

package/components/button/Button.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["active", "disabled", "asToggle", "onClick", "bsStyle", "bsSize", "variant", "iconOnly", "multiline", "block", "className", "children"];
+var _excluded = ["active", "disabled", "asToggle", "onClick", "bsStyle", "bsSize", "variant", "iconOnly", "multiline", "block", "className", "noRippleEffect", "children"];
 import React, { useState, useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -18,6 +18,7 @@ var Button = function Button(props) {
     multiline = props.multiline,
     block = props.block,
     className = props.className,
+    noRippleEffect = props.noRippleEffect,
     children = props.children,
     remainingProps = _objectWithoutProperties(props, _excluded);
   var _useState = useState(active),
@@ -35,7 +36,7 @@ var Button = function Button(props) {
   // 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) {
+    if (noRippleEffect || !btnRef.current) {
       return;
     }
     var mouseListener = btnRef.current.addEventListener('mousedown', createButtonRipple, false);
@@ -44,7 +45,7 @@ var Button = function Button(props) {
       mouseListener && btnRef.current.removeEventListener('mousedown', createButtonRipple, false);
       touchListener && btnRef.current.removeEventListener('touchstart', createButtonRipple, false);
     };
-  }, [btnRef.current]);
+  }, [btnRef.current, noRippleEffect]);
 
   // Intercept click handler only for toggle button to update
   // internal state and blur after click
@@ -92,6 +93,7 @@ Button.defaultProps = {
   iconOnly: false,
   multiline: false,
   block: false,
+  noRippleEffect: false,
   onClick: function onClick() {},
   className: '',
   bsStyle: 'default'
@@ -107,6 +109,7 @@ Button.propTypes = {
   bsStyle: PropTypes.oneOf([Button.DEFAULT, Button.PRIMARY, Button.SECONDARY, Button.INFO, Button.WARNING, Button.DANGER, Button.SUCCESS, Button.MUTED]),
   bsSize: PropTypes.oneOf([Button.XS, Button.SM, Button.MD, Button.LG]),
   variant: PropTypes.oneOf([Button.VARIANT_LINK, Button.VARIANT_LINK_INLINE, Button.VARIANT_OUTLINE, Button.VARIANT_ACTION]),
+  noRippleEffect: PropTypes.bool,
   className: PropTypes.string
 };
 export default Button;

package/components/datepicker/DatePicker.js

@@ -5,9 +5,12 @@ import _typeof from "@babel/runtime/helpers/typeof";
 var _excluded = ["dropup", "alignRight", "onChange", "className", "mandatory", "dateValidation"];
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import Datetime from 'react-datetime';
-import moment from 'moment';
 import classNames from 'classnames';
+
+// This workaround fixes the react minified #130 error for using external commonjs libs
+// see https://github.com/vitejs/vite/issues/2139
+import RDT from 'react-datetime';
+var Datetime = RDT["default"] ? RDT["default"] : RDT;
 var isValidDate = function isValidDate(date) {
   return _typeof(date) === 'object';
 };

package/components/dialog/SplitDialog.js

@@ -1,5 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["leftContent", "rightContent", "onClose", "className"];
 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';
@@ -11,7 +13,8 @@ var SplitDialog = function SplitDialog(props) {
   var leftContent = props.leftContent,
     rightContent = props.rightContent,
     onClose = props.onClose,
-    className = props.className;
+    className = props.className,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var dialogClassName = "split-dialog ".concat(className);
   var dividerClasses = classNames('split-divider', 'bg-lighter');
   var body = /*#__PURE__*/React.createElement("div", {
@@ -23,7 +26,7 @@ var SplitDialog = function SplitDialog(props) {
   })), /*#__PURE__*/React.createElement("div", {
     className: "split-right"
   }, rightContent));
-  return /*#__PURE__*/React.createElement(Dialog, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(Dialog, _extends({}, remainingProps, {
     body: body,
     onHide: onClose,
     className: dialogClassName

package/components/dropdown/ButtonDropdown.js

@@ -65,11 +65,16 @@ var ButtonDropdown = function ButtonDropdown(props) {
     _React$useState4 = _slicedToArray(_React$useState3, 2),
     refDropdownMenu = _React$useState4[0],
     setRefDropdownMenu = _React$useState4[1];
+  var _React$useState5 = React.useState(null),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    refSplitButtonToggle = _React$useState6[0],
+    setRefSplitButtonToggle = _React$useState6[1];
   var defaultPopperConfig = {
     placement: getPlacement(pullRight, dropup),
     modifiers: []
   };
-  var _usePopper = usePopper(refDropdownToggle, refDropdownMenu, popperConfig || defaultPopperConfig),
+  var popperParentRef = splitButton && pullRight ? refSplitButtonToggle : refDropdownToggle;
+  var _usePopper = usePopper(popperParentRef, refDropdownMenu, popperConfig || defaultPopperConfig),
     styles = _usePopper.styles,
     attributes = _usePopper.attributes;
   var wrapperRef = useClickOutside(function () {
@@ -111,7 +116,7 @@ var ButtonDropdown = function ButtonDropdown(props) {
   var handleDropdownButtonClick = splitButton ? handleSplitLabelButtonClick : toggleOpen;
   var isOpen = isUncontrolled ? internalOpen : open;
   var wrapperClasses = classNames('dropdown', 'btn-group', isOpen && 'open', className);
-  var dropdownClasses = classNames(usePortal && 'dropdown-portal', dropdownClassName);
+  var dropdownClasses = classNames(usePortal && 'dropdown-portal', splitButton && pullRight && 'pull-right', dropdownClassName);
   var dropdownMenu = /*#__PURE__*/React.createElement(MenuItems, _extends({
     className: dropdownClasses,
     ref: setRefDropdownMenu,
@@ -135,7 +140,8 @@ var ButtonDropdown = function ButtonDropdown(props) {
     bsStyle: bsStyle,
     disabled: disabled,
     className: toggleClassName,
-    onClick: toggleOpen
+    onClick: toggleOpen,
+    ref: setRefSplitButtonToggle
   }), isOpen && usePortal && /*#__PURE__*/ReactDOM.createPortal(dropdownMenu, dropdownRoot), isOpen && !usePortal && dropdownMenu);
 };
 ButtonDropdown.defaultProps = {

package/components/map/components/Map.js

@@ -131,6 +131,7 @@ var Map = function Map(props) {
     eventListenerMap = props.eventListenerMap,
     mapType = props.mapType,
     mapLayer = props.mapLayer,
+    externalShowCluster = props.showCluster,
     showScaleBar = props.showScaleBar,
     onMapLayerChange = props.onMapLayerChange,
     onMapTypeChange = props.onMapTypeChange,
@@ -160,7 +161,7 @@ var Map = function Map(props) {
     _useState10 = _slicedToArray(_useState9, 2),
     activeLayers = _useState10[0],
     setActiveLayers = _useState10[1];
-  var _useState11 = useState(props.showCluster),
+  var _useState11 = useState(externalShowCluster),
     _useState12 = _slicedToArray(_useState11, 2),
     showCluster = _useState12[0],
     setShowCluster = _useState12[1];
@@ -247,6 +248,8 @@ var Map = function Map(props) {
       };
     }
   }, []);
+
+  // Update BoundingBox from outside
   useEffect(function () {
     if (api && boundingBox) {
       var top = boundingBox.top,
@@ -258,16 +261,35 @@ var Map = function Map(props) {
       }, zoomAnimation);
     }
   }, [boundingBox]);
+
+  // Update Zoom from outside
   useEffect(function () {
     if (api && zoom) {
       api.map.setZoom(zoom, zoomAnimation);
     }
   }, [zoom]);
+
+  // Update Lat & Lng from outside
   useEffect(function () {
     if (api && center) {
       api.map.setCenter(center, zoomAnimation);
     }
   }, [center]);
+
+  // Update MapType from outside
+  useEffect(function () {
+    return setBaseLayer(mapType);
+  }, [mapType]);
+
+  // Update MapLayer from outside
+  useEffect(function () {
+    return setActiveLayers(mapLayer);
+  }, [mapLayer]);
+
+  // Update Cluster setting from outside
+  useEffect(function () {
+    return setShowCluster(externalShowCluster);
+  }, [externalShowCluster]);
   var handleMapTypeChange = function handleMapTypeChange(newMapType) {
     setBaseLayer(newMapType);
     onMapTypeChange(newMapType, mapType);
@@ -349,6 +371,7 @@ var Map = function Map(props) {
     return getLayer(api, layer, language);
   }, activeLayers), renderChildren()));
 };
+;
 Map.TYPE_DEFAULT = MAP_TYPE_DEFAULT;
 Map.TYPE_FLEET_STYLE = MAP_TYPE_FLEET_STYLE;
 Map.TYPE_SATELLITE = MAP_TYPE_SATELLITE;

package/components/overlay/OverlayTrigger.js

@@ -3,7 +3,8 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["rootClose"];
 import React from 'react';
 import PropTypes from 'prop-types';
-import { default as _OverlayTrigger } from 'react-bootstrap/OverlayTrigger';
+import OT from 'react-bootstrap/OverlayTrigger';
+var _OverlayTrigger = OT["default"] ? OT["default"] : OT;
 export default function OverlayTrigger(props) {
   var rootClose = props.rootClose,
     remainingProps = _objectWithoutProperties(props, _excluded);

package/components/rules/RuleConnector.js

@@ -0,0 +1,76 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["placement", "icon", "hidden", "background", "pageBackground", "contentClassName", "hasBorder", "borderColor", "className", "children"];
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+var getBorderColorFromBg = function getBorderColorFromBg(bg) {
+  return bg.replace('bg', 'border-color');
+};
+var RuleConnector = function RuleConnector(props) {
+  var placement = props.placement,
+    icon = props.icon,
+    hidden = props.hidden,
+    background = props.background,
+    pageBackground = props.pageBackground,
+    contentClassName = props.contentClassName,
+    hasBorder = props.hasBorder,
+    borderColor = props.borderColor,
+    className = props.className,
+    children = props.children,
+    remainingProps = _objectWithoutProperties(props, _excluded);
+  var wrapperClassNames = classNames('RuleConnector', 'height-20', 'display-flex', "justify-content-".concat(placement), 'align-items-center', 'position-relative', hidden && 'opacity-0', className);
+  var commonRoundedClasses = classNames('width-20', 'height-20', 'rounded-circle', 'position-relative', 'z-index-2', 'box-sizing-content-box');
+  var commonRoundedBorderClippingClasses = classNames('position-relative', 'width-20', 'height-20');
+  var leftRoundedBox = classNames('margin-right--10', commonRoundedClasses, pageBackground, hasBorder && "border ".concat(borderColor));
+  var leftRoundedBoxBorderClipping = classNames('right-50pct', commonRoundedBorderClippingClasses, pageBackground);
+  var contentWrapperClassNames = classNames('padding-left-20 padding-right-20', 'z-index-1', background, hasBorder && "border ".concat(getBorderColorFromBg(background)));
+  var rightRoundedBox = classNames('margin-left--10', commonRoundedClasses, pageBackground, hasBorder && "border ".concat(borderColor));
+  var rightRoundedBoxBorderClipping = classNames('left-50pct', commonRoundedBorderClippingClasses, pageBackground);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-testid": "ruleConnector"
+  }, remainingProps, {
+    className: wrapperClassNames
+  }), /*#__PURE__*/React.createElement("div", {
+    className: leftRoundedBox
+  }, /*#__PURE__*/React.createElement("div", {
+    className: leftRoundedBoxBorderClipping
+  })), /*#__PURE__*/React.createElement("span", {
+    className: contentWrapperClassNames
+  }, /*#__PURE__*/React.createElement("span", {
+    className: contentClassName
+  }, children ? children : /*#__PURE__*/React.createElement("span", {
+    className: "rioglyph ".concat(icon),
+    "data-testid": "ruleConnectorIcon"
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: rightRoundedBox
+  }, /*#__PURE__*/React.createElement("div", {
+    className: rightRoundedBoxBorderClipping
+  })));
+};
+RuleConnector.START = 'start';
+RuleConnector.CENTER = 'center';
+RuleConnector.END = 'end';
+RuleConnector.defaultProps = {
+  placement: 'center',
+  icon: 'rioglyph-plus',
+  hidden: false,
+  background: 'bg-lightest',
+  pageBackground: 'bg-white',
+  contentClassName: 'text-color-light',
+  hasBorder: false,
+  borderColor: '',
+  className: ''
+};
+RuleConnector.propTypes = {
+  placement: PropTypes.oneOf([RuleConnector.START, RuleConnector.CENTER, RuleConnector.END]),
+  icon: PropTypes.string,
+  hidden: PropTypes.bool,
+  background: PropTypes.string,
+  pageBackground: PropTypes.string,
+  contentClassName: PropTypes.string,
+  hasBorder: PropTypes.bool,
+  borderColor: PropTypes.string,
+  className: PropTypes.string
+};
+export default RuleConnector;