@rio-cloud/rio-uikit 0.16.3 → 0.16.4-beta.2

package/components/onboarding/OnboardingTip.d.ts

@@ -0,0 +1,63 @@
+declare function OnboardingTip(props: any): any;
+declare namespace OnboardingTip {
+    const AUTO_START: "auto-start";
+    const AUTO: "auto";
+    const AUTO_END: "auto-end";
+    const TOP_START: "top-start";
+    const TOP: "top";
+    const TOP_END: "top-end";
+    const BOTTOM_START: "bottom-start";
+    const BOTTOM: "bottom";
+    const BOTTOM_END: "bottom-end";
+    const RIGHT_START: "right-start";
+    const RIGHT: "right";
+    const RIGHT_END: "right-end";
+    const LEFT_START: "left-start";
+    const LEFT: "left";
+    const LEFT_END: "left-end";
+    const TEXT_ALIGNMENT_LEFT: "left";
+    const TEXT_ALIGNMENT_CENTER: "center";
+    const TEXT_ALIGNMENT_RIGHT: "right";
+    namespace defaultProps {
+        export const show: boolean;
+        export function onHide(): void;
+        export const showCloseIcon: boolean;
+        import textAlignment = OnboardingTip.TEXT_ALIGNMENT_LEFT;
+        export { textAlignment };
+        export const useInDialog: boolean;
+        export const className: string;
+        export const clickflow: boolean;
+        import placement = OnboardingTip.BOTTOM;
+        export { placement };
+        export const width: null;
+        export const preventOverflow: boolean;
+    }
+    namespace propTypes {
+        export const id: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+        const show_1: PropTypes.Validator<boolean>;
+        export { show_1 as show };
+        const showCloseIcon_1: PropTypes.Requireable<boolean>;
+        export { showCloseIcon_1 as showCloseIcon };
+        const textAlignment_1: PropTypes.Requireable<"right" | "left" | "center">;
+        export { textAlignment_1 as textAlignment };
+        const onHide_1: PropTypes.Validator<(...args: any[]) => any>;
+        export { onHide_1 as onHide };
+        const useInDialog_1: PropTypes.Requireable<boolean>;
+        export { useInDialog_1 as useInDialog };
+        export const title: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+        export const content: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+        const className_1: PropTypes.Requireable<string>;
+        export { className_1 as className };
+        const clickflow_1: PropTypes.Requireable<boolean>;
+        export { clickflow_1 as clickflow };
+        export { OnboardingTipPlacementType as placement };
+        const width_1: PropTypes.Requireable<string | number>;
+        export { width_1 as width };
+        const preventOverflow_1: PropTypes.Requireable<boolean>;
+        export { preventOverflow_1 as preventOverflow };
+        export const popperConfig: PropTypes.Requireable<object>;
+    }
+}
+export default OnboardingTip;
+export const OnboardingTipPlacementType: PropTypes.Requireable<"auto-start" | "auto" | "auto-end" | "top-start" | "top" | "top-end" | "right-start" | "right" | "right-end" | "bottom-start" | "bottom" | "bottom-end" | "left-start" | "left" | "left-end">;
+import PropTypes from "prop-types";

package/components/onboarding/OnboardingTip.js

@@ -1,69 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import OverlayTrigger from '../overlay/OverlayTrigger';
 import Tooltip from '../tooltip/Tooltip';
-var DELAY_SHOW = 500;
-var DELAY_HIDE = 300;
+import { TEXT_ALIGNMENT } from '../../values/TextAlignment';
+const DELAY_SHOW = 500;
+const 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'
-  );
-
-  var overlay = /*#__PURE__*/React.createElement(Tooltip, {
-    className: tooltipWrapperClasses,
-    tooltipStyle: Tooltip.STYLE_ONBOARDING,
-    id: id,
-    onClick: onHide,
-    width: width,
-    textAlignment: textAlignment,
-    allowOnTouch: true
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "display-flex"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "display-flex flex-column flex-1-1"
-  }, title && /*#__PURE__*/React.createElement("div", {
-    className: "tooltip-title"
-  }, title), content && /*#__PURE__*/React.createElement("div", {
-    className: "tooltip-content"
-  }, content)), showCloseIcon && /*#__PURE__*/React.createElement("span", {
-    className: "tooltip-close rioglyph rioglyph-remove"
-  })));
-  var trigger = /*#__PURE__*/React.createElement(OverlayTrigger, {
-    placement: placement,
-    trigger: "click",
-    overlay: overlay,
-    delayShow: DELAY_SHOW,
-    delayHide: DELAY_HIDE,
-    onToggle: onHide,
-    show: show,
-    rootClose: false,
-    popperConfig: popperConfig || {
-      modifiers: [{
-        name: 'preventOverflow',
-        options: {
-          // Popper.js default is: false but we enable it by default
-          altAxis: preventOverflow
-        }
-      }]
-    }
-  }, children);
-  return show ? trigger : children;
+    const { id, show, placement, title, content, onHide, children, textAlignment, useInDialog, clickflow, 
+    // clickflowBackdrop,
+    showCloseIcon, className, width, preventOverflow, popperConfig, } = props;
+    const tooltipWrapperClasses = classNames(useInDialog && 'z-index-max', className && className, clickflow && 'onboarding-clickflow'
+    // clickflowBackdrop && 'onboarding-clickflow-backdrop'
+    );
+    const overlay = (_jsx(Tooltip, Object.assign({ className: tooltipWrapperClasses, tooltipStyle: Tooltip.STYLE_ONBOARDING, id: id, onClick: onHide, width: width, textAlignment: textAlignment, allowOnTouch: true }, { children: _jsxs("div", Object.assign({ className: 'display-flex' }, { children: [_jsxs("div", Object.assign({ className: 'display-flex flex-column flex-1-1' }, { children: [title && _jsx("div", Object.assign({ className: 'tooltip-title' }, { children: title })), content && _jsx("div", Object.assign({ className: 'tooltip-content' }, { children: content }))] })), showCloseIcon && _jsx("span", { className: 'tooltip-close rioglyph rioglyph-remove' })] })) })));
+    const trigger = (_jsx(OverlayTrigger, Object.assign({ placement: placement, trigger: 'click', overlay: overlay, delayShow: DELAY_SHOW, delayHide: DELAY_HIDE, onToggle: onHide, show: show, rootClose: false, popperConfig: popperConfig || {
+            modifiers: [
+                {
+                    name: 'preventOverflow',
+                    options: {
+                        // Popper.js default is: false but we enable it by default
+                        altAxis: preventOverflow,
+                    },
+                },
+            ],
+        } }, { children: children })));
+    return show ? trigger : children;
 }
 OnboardingTip.AUTO_START = Tooltip.AUTO_START;
 OnboardingTip.AUTO = Tooltip.AUTO;
@@ -80,37 +43,57 @@ OnboardingTip.RIGHT_END = Tooltip.RIGHT_END;
 OnboardingTip.LEFT_START = Tooltip.LEFT_START;
 OnboardingTip.LEFT = Tooltip.LEFT;
 OnboardingTip.LEFT_END = Tooltip.LEFT_END;
-export var OnboardingTipPlacementType = PropTypes.oneOf([OnboardingTip.AUTO_START, OnboardingTip.AUTO, OnboardingTip.AUTO_END, OnboardingTip.TOP_START, OnboardingTip.TOP, OnboardingTip.TOP_END, OnboardingTip.BOTTOM_START, OnboardingTip.BOTTOM, OnboardingTip.BOTTOM_END, OnboardingTip.RIGHT_START, OnboardingTip.RIGHT, OnboardingTip.RIGHT_END, OnboardingTip.LEFT_START, OnboardingTip.LEFT, OnboardingTip.LEFT_END]);
-OnboardingTip.TEXT_ALIGNMENT_LEFT = 'left';
-OnboardingTip.TEXT_ALIGNMENT_CENTER = 'center';
-OnboardingTip.TEXT_ALIGNMENT_RIGHT = 'right';
+export const OnboardingTipPlacementType = PropTypes.oneOf([
+    OnboardingTip.AUTO_START,
+    OnboardingTip.AUTO,
+    OnboardingTip.AUTO_END,
+    OnboardingTip.TOP_START,
+    OnboardingTip.TOP,
+    OnboardingTip.TOP_END,
+    OnboardingTip.BOTTOM_START,
+    OnboardingTip.BOTTOM,
+    OnboardingTip.BOTTOM_END,
+    OnboardingTip.RIGHT_START,
+    OnboardingTip.RIGHT,
+    OnboardingTip.RIGHT_END,
+    OnboardingTip.LEFT_START,
+    OnboardingTip.LEFT,
+    OnboardingTip.LEFT_END,
+]);
+OnboardingTip.TEXT_ALIGNMENT_LEFT = TEXT_ALIGNMENT.LEFT;
+OnboardingTip.TEXT_ALIGNMENT_CENTER = TEXT_ALIGNMENT.CENTER;
+OnboardingTip.TEXT_ALIGNMENT_RIGHT = TEXT_ALIGNMENT.RIGHT;
 OnboardingTip.defaultProps = {
-  show: false,
-  onHide: function onHide() {},
-  showCloseIcon: true,
-  textAlignment: OnboardingTip.TEXT_ALIGNMENT_LEFT,
-  useInDialog: false,
-  className: '',
-  clickflow: false,
-  // clickflowBackdrop: false,
-  placement: OnboardingTip.BOTTOM,
-  width: null,
-  preventOverflow: true
+    show: false,
+    onHide: () => { },
+    showCloseIcon: true,
+    textAlignment: OnboardingTip.TEXT_ALIGNMENT_LEFT,
+    useInDialog: false,
+    className: '',
+    clickflow: false,
+    // clickflowBackdrop: false,
+    placement: OnboardingTip.BOTTOM,
+    width: null,
+    preventOverflow: true,
 };
 OnboardingTip.propTypes = {
-  id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  show: PropTypes.bool.isRequired,
-  showCloseIcon: PropTypes.bool,
-  textAlignment: PropTypes.oneOf([OnboardingTip.TEXT_ALIGNMENT_LEFT, OnboardingTip.TEXT_ALIGNMENT_CENTER, OnboardingTip.TEXT_ALIGNMENT_RIGHT]),
-  onHide: PropTypes.func.isRequired,
-  useInDialog: PropTypes.bool,
-  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-  content: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-  className: PropTypes.string,
-  clickflow: PropTypes.bool,
-  // clickflowBackdrop: PropTypes.bool,
-  placement: OnboardingTipPlacementType,
-  width: PropTypes.oneOf(['auto', 100, 150, 200, 250, 300, 350, 400, 450, 500]),
-  preventOverflow: PropTypes.bool,
-  popperConfig: PropTypes.object
-};
+    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    show: PropTypes.bool.isRequired,
+    showCloseIcon: PropTypes.bool,
+    textAlignment: PropTypes.oneOf([
+        OnboardingTip.TEXT_ALIGNMENT_LEFT,
+        OnboardingTip.TEXT_ALIGNMENT_CENTER,
+        OnboardingTip.TEXT_ALIGNMENT_RIGHT,
+    ]),
+    onHide: PropTypes.func.isRequired,
+    useInDialog: PropTypes.bool,
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    content: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    className: PropTypes.string,
+    clickflow: PropTypes.bool,
+    // clickflowBackdrop: PropTypes.bool,
+    placement: OnboardingTipPlacementType,
+    width: PropTypes.oneOf(['auto', 100, 150, 200, 250, 300, 350, 400, 450, 500]),
+    preventOverflow: PropTypes.bool,
+    popperConfig: PropTypes.object,
+};

package/components/overlay/OverlayTrigger.d.ts

@@ -0,0 +1,37 @@
+import { type PropsWithChildren, type ReactNode } from 'react';
+import type { delayProp } from '../../types';
+import { type Placement } from '../../values/Placement';
+import { type Trigger } from '../../values/Trigger';
+export type OverlayTriggerProps = {
+    trigger?: Trigger;
+    delay?: number | delayProp;
+    placement: Placement;
+    show?: boolean;
+    defaultShow?: boolean;
+    onToggle?: VoidFunction;
+    overlay: ReactNode;
+    popperConfig?: object;
+    rootClose?: boolean;
+};
+declare const OverlayTrigger: {
+    (props: PropsWithChildren<OverlayTriggerProps>): JSX.Element;
+    TRIGGER_CLICK: "click";
+    TRIGGER_HOVER: "hover";
+    TRIGGER_FOCUS: "focus";
+    AUTO_START: "auto-start";
+    AUTO: "auto";
+    AUTO_END: "auto-end";
+    TOP_START: "top-start";
+    TOP: "top";
+    TOP_END: "top-end";
+    RIGHT_START: "right-start";
+    RIGHT: "right";
+    RIGHT_END: "right-end";
+    BOTTOM_START: "bottom-start";
+    BOTTOM: "bottom";
+    BOTTOM_END: "bottom-end";
+    LEFT_START: "left-start";
+    LEFT: "left";
+    LEFT_END: "left-end";
+};
+export default OverlayTrigger;

package/components/overlay/OverlayTrigger.js

@@ -1,50 +1,32 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["rootClose"];
-import React from 'react';
-import PropTypes from 'prop-types';
-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);
-  return /*#__PURE__*/React.createElement(_OverlayTrigger, _extends({
-    rootClose: rootClose
-  }, remainingProps));
-}
-OverlayTrigger.TRIGGER_CLICK = 'click';
-OverlayTrigger.TRIGGER_HOVER = 'hover';
-OverlayTrigger.TRIGGER_FOCUS = 'focus';
-export var triggerType = PropTypes.oneOf([OverlayTrigger.TRIGGER_CLICK, OverlayTrigger.TRIGGER_HOVER, OverlayTrigger.TRIGGER_FOCUS]);
-OverlayTrigger.AUTO_START = 'auto-start';
-OverlayTrigger.AUTO = 'auto';
-OverlayTrigger.AUTO_END = 'auto-end';
-OverlayTrigger.TOP_START = 'top-start';
-OverlayTrigger.TOP = 'top';
-OverlayTrigger.TOP_END = 'top-end';
-OverlayTrigger.BOTTOM_START = 'bottom-start';
-OverlayTrigger.BOTTOM = 'bottom';
-OverlayTrigger.BOTTOM_END = 'bottom-end';
-OverlayTrigger.RIGHT_START = 'right-start';
-OverlayTrigger.RIGHT = 'right';
-OverlayTrigger.RIGHT_END = 'right-end';
-OverlayTrigger.LEFT_START = 'left-start';
-OverlayTrigger.LEFT = 'left';
-OverlayTrigger.LEFT_END = 'left-end';
-export var OverlayTriggerPlacementType = PropTypes.oneOf([OverlayTrigger.AUTO_START, OverlayTrigger.AUTO, OverlayTrigger.AUTO_END, OverlayTrigger.TOP_START, OverlayTrigger.TOP, OverlayTrigger.TOP_END, OverlayTrigger.BOTTOM_START, OverlayTrigger.BOTTOM, OverlayTrigger.BOTTOM_END, OverlayTrigger.RIGHT_START, OverlayTrigger.RIGHT, OverlayTrigger.RIGHT_END, OverlayTrigger.LEFT_START, OverlayTrigger.LEFT, OverlayTrigger.LEFT_END]);
-OverlayTrigger.defaultProps = {
-  rootClose: true
+import { __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+// @ts-ignore-next-line importsNotUsedAsValues
+import 'react';
+import BSOverlayTrigger from 'react-bootstrap/OverlayTrigger';
+import { PLACEMENT } from '../../values/Placement';
+import { TRIGGER } from '../../values/Trigger';
+const OverlayTrigger = (props) => {
+    const { rootClose = true } = props, remainingProps = __rest(props, ["rootClose"]);
+    // @ts-ignore
+    return _jsx(BSOverlayTrigger, Object.assign({ rootClose: rootClose }, remainingProps));
 };
-OverlayTrigger.propTypes = {
-  children: PropTypes.element.isRequired,
-  trigger: PropTypes.oneOfType([triggerType, PropTypes.arrayOf(triggerType)]),
-  delay: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
-    show: PropTypes.number,
-    hide: PropTypes.number
-  })]),
-  defaultShow: PropTypes.bool,
-  onToggle: PropTypes.func,
-  overlay: PropTypes.oneOfType([PropTypes.func, PropTypes.element.isRequired]),
-  popperConfig: PropTypes.object,
-  placement: OverlayTriggerPlacementType
-};
+OverlayTrigger.TRIGGER_CLICK = TRIGGER.CLICK;
+OverlayTrigger.TRIGGER_HOVER = TRIGGER.HOVER;
+OverlayTrigger.TRIGGER_FOCUS = TRIGGER.FOCUS;
+// placement
+OverlayTrigger.AUTO_START = PLACEMENT.AUTO_START;
+OverlayTrigger.AUTO = PLACEMENT.AUTO;
+OverlayTrigger.AUTO_END = PLACEMENT.AUTO_END;
+OverlayTrigger.TOP_START = PLACEMENT.TOP_START;
+OverlayTrigger.TOP = PLACEMENT.TOP;
+OverlayTrigger.TOP_END = PLACEMENT.TOP_END;
+OverlayTrigger.RIGHT_START = PLACEMENT.RIGHT_START;
+OverlayTrigger.RIGHT = PLACEMENT.RIGHT;
+OverlayTrigger.RIGHT_END = PLACEMENT.RIGHT_END;
+OverlayTrigger.BOTTOM_START = PLACEMENT.BOTTOM_START;
+OverlayTrigger.BOTTOM = PLACEMENT.BOTTOM;
+OverlayTrigger.BOTTOM_END = PLACEMENT.BOTTOM_END;
+OverlayTrigger.LEFT_START = PLACEMENT.LEFT_START;
+OverlayTrigger.LEFT = PLACEMENT.LEFT;
+OverlayTrigger.LEFT_END = PLACEMENT.LEFT_END;
+export default OverlayTrigger;

package/components/pager/Pager.d.ts

@@ -0,0 +1,25 @@
+export default Pager;
+declare function Pager(props: any): JSX.Element;
+declare namespace Pager {
+    const VARIANT_FULL: string;
+    const VARIANT_COMPACT: string;
+    namespace defaultProps {
+        import variant = Pager.VARIANT_FULL;
+        export { variant };
+        export const alignRight: boolean;
+        export const disabled: boolean;
+    }
+    namespace propTypes {
+        export const title: PropTypes.Validator<NonNullable<NonNullable<PropTypes.ReactNodeLike>>>;
+        export const label: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+        const alignRight_1: PropTypes.Requireable<boolean>;
+        export { alignRight_1 as alignRight };
+        const variant_1: PropTypes.Requireable<string>;
+        export { variant_1 as variant };
+        const disabled_1: PropTypes.Requireable<boolean>;
+        export { disabled_1 as disabled };
+        export const onClick: PropTypes.Requireable<(...args: any[]) => any>;
+        export const className: PropTypes.Requireable<string>;
+    }
+}
+import PropTypes from "prop-types";

package/components/pager/Pager.js

@@ -1,86 +1,43 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["title", "label", "alignRight", "variant", "disabled", "onClick", "className"];
+import { __rest } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 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);
-  var _useState = useState(false),
-    _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
-  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');
-    return /*#__PURE__*/React.createElement("div", _extends({}, remainingProps, {
-      className: wrapperClassesCompact,
-      onMouseEnter: handleEnter,
-      onMouseLeave: handleLeave,
-      onClick: onClick
-    }), /*#__PURE__*/React.createElement("div", {
-      className: "display-flex flex-1-1 flex-column ".concat(alignRight ? 'align-items-end' : '')
-    }, /*#__PURE__*/React.createElement("div", {
-      className: titleClassesBase
-    }, title)), /*#__PURE__*/React.createElement("span", {
-      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');
-  return /*#__PURE__*/React.createElement("div", _extends({}, remainingProps, {
-    className: wrapperClassesFull,
-    onMouseEnter: handleEnter,
-    onMouseLeave: handleLeave,
-    onClick: onClick
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "display-flex flex-1-1 flex-column ".concat(alignRight ? 'align-items-end' : '')
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "text-color-gray line-height-16"
-  }, label), /*#__PURE__*/React.createElement("div", {
-    className: titleClassesFull
-  }, title)), /*#__PURE__*/React.createElement("div", {
-    className: "text-size-12"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: iconClassesFull
-  })));
+const Pager = props => {
+    const { title, label, alignRight, variant, disabled, onClick, className } = props, remainingProps = __rest(props, ["title", "label", "alignRight", "variant", "disabled", "onClick", "className"]);
+    const [isHover, setIsHover] = useState(false);
+    const handleEnter = () => !disabled && setIsHover(true);
+    const handleLeave = () => setIsHover(false);
+    const isCompactVariant = variant === Pager.VARIANT_COMPACT;
+    const 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');
+    const iconClassesBase = classNames('rioplyph', disabled ? 'text-color-light' : 'text-color-darker', isHover && 'text-color-highlight');
+    const 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) {
+        const wrapperClassesCompact = classNames(wrapperClassesBase, 'rounded-circle', 'padding-y-5 padding-x-15', 'width-auto', className);
+        const iconClassesCompact = classNames(iconClassesBase, alignRight ? 'rioglyph-chevron-left margin-right-5' : 'rioglyph-chevron-right margin-left-5', 'text-size-10');
+        return (_jsxs("div", Object.assign({}, remainingProps, { className: wrapperClassesCompact, onMouseEnter: handleEnter, onMouseLeave: handleLeave, onClick: onClick }, { children: [_jsx("div", Object.assign({ className: `display-flex flex-1-1 flex-column ${alignRight ? 'align-items-end' : ''}` }, { children: _jsx("div", Object.assign({ className: titleClassesBase }, { children: title })) })), _jsx("span", { className: iconClassesCompact })] })));
+    }
+    const wrapperClassesFull = classNames(wrapperClassesBase, 'rounded', 'padding-y-15 padding-x-20', 'width-100pct', className);
+    const iconClassesFull = classNames(iconClassesBase, alignRight ? 'rioglyph-arrow-left margin-right-10' : 'rioglyph-arrow-right margin-left-10', 'text-size-200pct');
+    const titleClassesFull = classNames(titleClassesBase, alignRight && 'text-right', 'text-size-16 text-medium');
+    return (_jsxs("div", Object.assign({}, remainingProps, { className: wrapperClassesFull, onMouseEnter: handleEnter, onMouseLeave: handleLeave, onClick: onClick }, { children: [_jsxs("div", Object.assign({ className: `display-flex flex-1-1 flex-column ${alignRight ? 'align-items-end' : ''}` }, { children: [_jsx("div", Object.assign({ className: 'text-color-gray line-height-16' }, { children: label })), _jsx("div", Object.assign({ className: titleClassesFull }, { children: title }))] })), _jsx("div", Object.assign({ className: 'text-size-12' }, { children: _jsx("span", { className: iconClassesFull }) }))] })));
 };
 Pager.VARIANT_FULL = 'full';
 Pager.VARIANT_COMPACT = 'compact';
 Pager.defaultProps = {
-  variant: Pager.VARIANT_FULL,
-  alignRight: false,
-  disabled: false
+    variant: Pager.VARIANT_FULL,
+    alignRight: false,
+    disabled: false,
 };
 Pager.propTypes = {
-  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
-  label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-  alignRight: PropTypes.bool,
-  variant: PropTypes.oneOf([Pager.VARIANT_FULL, Pager.VARIANT_COMPACT, 'full', 'compact']),
-  disabled: PropTypes.bool,
-  onClick: PropTypes.func,
-  className: PropTypes.string
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
+    label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    alignRight: PropTypes.bool,
+    variant: PropTypes.oneOf([Pager.VARIANT_FULL, Pager.VARIANT_COMPACT, 'full', 'compact']),
+    disabled: PropTypes.bool,
+    onClick: PropTypes.func,
+    className: PropTypes.string,
 };
-export default Pager;
+export default Pager;

package/components/popover/Popover.d.ts

@@ -0,0 +1,3 @@
+export default Popover;
+declare const Popover: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from "react";

package/components/popover/Popover.js

@@ -1,25 +1,12 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["title", "titleClassName", "contentClassName", "children"];
+import { __rest } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import PropTypes from 'prop-types';
 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);
-  return /*#__PURE__*/React.createElement(_Popover, _extends({
-    ref: ref
-  }, remainingProps), title && /*#__PURE__*/React.createElement(_Popover.Title, {
-    className: "popover-title ".concat(titleClassName)
-  }, title), children && /*#__PURE__*/React.createElement(_Popover.Content, {
-    className: "popover-content ".concat(contentClassName)
-  }, children));
+const Popover = React.forwardRef((props, ref) => {
+    const { title, titleClassName = '', contentClassName = '', children } = props, remainingProps = __rest(props, ["title", "titleClassName", "contentClassName", "children"]);
+    return (_jsxs(_Popover, Object.assign({ ref: ref }, remainingProps, { children: [title && _jsx(_Popover.Title, Object.assign({ className: `popover-title ${titleClassName}` }, { children: title })), children && (_jsx(_Popover.Content, Object.assign({ className: `popover-content ${contentClassName}` }, { children: children })))] })));
 });
 Popover.AUTO = Tooltip.AUTO;
 Popover.TOP = Tooltip.TOP;
@@ -27,10 +14,10 @@ Popover.BOTTOM = Tooltip.BOTTOM;
 Popover.RIGHT = Tooltip.RIGHT;
 Popover.LEFT = Tooltip.LEFT;
 Popover.propTypes = {
-  id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-  children: PropTypes.node.isRequired,
-  titleClassName: PropTypes.string,
-  contentClassName: PropTypes.string
+    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    children: PropTypes.node.isRequired,
+    titleClassName: PropTypes.string,
+    contentClassName: PropTypes.string,
 };
-export default Popover;
+export default Popover;

package/components/position/Position.d.ts

@@ -0,0 +1,10 @@
+export default Position;
+declare function Position(props: any): JSX.Element;
+declare namespace Position {
+    namespace propTypes {
+        const latitude: PropTypes.Validator<number>;
+        const longitude: PropTypes.Validator<number>;
+        const address: PropTypes.Requireable<string>;
+    }
+}
+import PropTypes from "prop-types";

package/components/position/Position.js

@@ -1,29 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 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);
-  var flooredDegrees = Math.floor(absDegrees);
-  var minutes = (absDegrees - flooredDegrees) * 60;
-  return "".concat(prefix).concat(flooredDegrees, "\xB0 ").concat(minutes.toFixed(3), "\u2032");
+    const prefix = degrees >= 0 ? positivePrefix : negativePrefix;
+    const absDegrees = Math.abs(degrees);
+    const flooredDegrees = Math.floor(absDegrees);
+    const minutes = (absDegrees - flooredDegrees) * 60;
+    return `${prefix}${flooredDegrees}\u00b0 ${minutes.toFixed(3)}\u2032`;
 }
-var Position = function Position(props) {
-  var latitude = props.latitude,
-    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);
+const Position = props => {
+    const { latitude, longitude, address } = props;
+    let formattedAddress;
+    if (!address) {
+        formattedAddress = `${formatDegrees(latitude, 'N', 'S')} ${formatDegrees(longitude, 'E', 'W')}`;
+    }
+    else {
+        formattedAddress = address;
+    }
+    return _jsx("span", Object.assign({ className: 'vehiclePositionInfo' }, { children: formattedAddress }));
 };
 Position.propTypes = {
-  latitude: PropTypes.number.isRequired,
-  longitude: PropTypes.number.isRequired,
-  address: PropTypes.string
+    latitude: PropTypes.number.isRequired,
+    longitude: PropTypes.number.isRequired,
+    address: PropTypes.string,
 };
-export default Position;
+export default Position;