@rio-cloud/rio-uikit 1.6.1 → 1.7.0

package/AccentBar.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/accentBar/AccentBar';
+export * from './components/accentBar/AccentBar';

package/AccentBar.js

@@ -0,0 +1,2 @@
+export { default } from './components/accentBar/AccentBar';
+export * from './components/accentBar/AccentBar';

package/Avatar.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/avatar/Avatar';
+export * from './components/avatar/Avatar';

package/Avatar.js

@@ -0,0 +1,2 @@
+export { default } from './components/avatar/Avatar';
+export * from './components/avatar/Avatar';

package/AvatarGroup.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/avatar/AvatarGroup';
+export * from './components/avatar/AvatarGroup';

package/AvatarGroup.js

@@ -0,0 +1,2 @@
+export { default } from './components/avatar/AvatarGroup';
+export * from './components/avatar/AvatarGroup';

package/Banner.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/banner/Banner';
+export * from './components/banner/Banner';

package/Banner.js

@@ -0,0 +1,2 @@
+export { default } from './components/banner/Banner';
+export * from './components/banner/Banner';

package/ButtonToolbar.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/button/ButtonToolbar';
+export * from './components/button/ButtonToolbar';

package/ButtonToolbar.js

@@ -0,0 +1,2 @@
+export { default } from './components/button/ButtonToolbar';
+export * from './components/button/ButtonToolbar';

package/Card.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/card/Card';
+export * from './components/card/Card';

package/Card.js

@@ -0,0 +1,2 @@
+export { default } from './components/card/Card';
+export * from './components/card/Card';

package/DateRangePicker.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
 import DeprecatedDateRangePicker from './components/datepicker/DateRangePicker';
 /**
@@ -7,6 +6,6 @@ import DeprecatedDateRangePicker from './components/datepicker/DateRangePicker';
  * @deprecated This will be removed from the UIKIT at some time.
  */
 export const DateRangePicker = (props) => {
-    const { children } = props, remainingProps = __rest(props, ["children"]);
-    return _jsx(DeprecatedDateRangePicker, Object.assign({}, remainingProps, { children: children }));
+    const { children, ...remainingProps } = props;
+    return _jsx(DeprecatedDateRangePicker, { ...remainingProps, children: children });
 };

package/FormLabel.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/formLabel/FormLabel';
+export * from './components/formLabel/FormLabel';

package/FormLabel.js

@@ -0,0 +1,2 @@
+export { default } from './components/formLabel/FormLabel';
+export * from './components/formLabel/FormLabel';

package/LabeledElement.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/formLabel/LabeledElement';
+export * from './components/formLabel/LabeledElement';

package/LabeledElement.js

@@ -0,0 +1,2 @@
+export { default } from './components/formLabel/LabeledElement';
+export * from './components/formLabel/LabeledElement';

package/StepButton.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/button/StepButton';
+export * from './components/button/StepButton';

package/StepButton.js

@@ -0,0 +1,2 @@
+export { default } from './components/button/StepButton';
+export * from './components/button/StepButton';

package/VirtualList.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/virtualList/VirtualList';
+export * from './components/virtualList/VirtualList';

package/VirtualList.js

@@ -0,0 +1,2 @@
+export { default } from './components/virtualList/VirtualList';
+export * from './components/virtualList/VirtualList';

package/components/accentBar/AccentBar.d.ts

@@ -0,0 +1,21 @@
+import type { PropsWithChildren } from 'react';
+type AccentBarProps = {
+    /**
+     * Defines the color by setting it to a UIKIT bg-<name> class name.
+     *
+     * @default 'bg-secondary'
+     */
+    color?: string;
+    /**
+     * Defines if the element is rendered as a stretching bar or just a centered circle.
+     *
+     * @default false
+     */
+    circle?: boolean;
+    /**
+     * Additional class names passed to the actual element.
+     */
+    className?: string;
+};
+declare const AccentBar: (props: PropsWithChildren<AccentBarProps>) => import("react/jsx-runtime").JSX.Element;
+export default AccentBar;

package/components/accentBar/AccentBar.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+const AccentBar = (props) => {
+    const { color = 'bg-secondary', circle = false, className, children } = props;
+    const accentBarClassName = classNames('AccentBar', circle && 'AccentBarCircle', color, className);
+    const wrapperClassName = classNames('display-flex', circle ? 'align-items-center' : 'align-items-stretch');
+    if (children) {
+        return (_jsxs("div", { className: wrapperClassName, children: [_jsx("div", { className: accentBarClassName }), children] }));
+    }
+    return _jsx("div", { className: accentBarClassName });
+};
+export default AccentBar;

package/components/actionBarItem/ActionBarItem.d.ts

@@ -1,4 +1,4 @@
-import React, { type PropsWithChildren } from 'react';
+import React, { type PropsWithChildren, type MemoExoticComponent, type FC } from 'react';
 import ActionBarItemPopoverContent from './ActionBarItemPopoverContent';
 import ActionBarItemIcon from './ActionBarItemIcon';
 import ActionBarItemList from './ActionBarItemList';
@@ -49,9 +49,5 @@ export type ActionBarItemComponents = {
     ListSeparator: typeof ActionBarItemListSeparator;
 };
 type ActionBarItemPropsWithChildren = PropsWithChildren<ActionBarItemProps>;
-declare const ActionBarItem: ActionBarItemComponents & React.NamedExoticComponent<ActionBarItemProps & {
-    children?: React.ReactNode;
-}> & {
-    readonly type: React.FC<ActionBarItemPropsWithChildren>;
-};
+declare const ActionBarItem: ActionBarItemComponents & MemoExoticComponent<FC<ActionBarItemPropsWithChildren>>;
 export default ActionBarItem;

package/components/actionBarItem/ActionBarItem.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { memo, useCallback, useEffect, useLayoutEffect, useState, useRef, } from 'react';
 import classNames from 'classnames';
@@ -38,7 +37,7 @@ const checkIfSmallResolution = () => {
 const isActionBarItemPopover = (child) => child.type && child.type.displayName === ActionBarItemPopoverContent.displayName;
 const isActionBarItemIcon = (child) => child.type && child.type.displayName === ActionBarItemIcon.displayName;
 const ActionBarItemBase = (props) => {
-    const { id = getRandomString(), className, mobileDialogBodyClassName = '', children, popoverWidth = DEFAULT_POPOVER_WIDTH, hidePopoverOnClick = true } = props, remainingProps = __rest(props, ["id", "className", "mobileDialogBodyClassName", "children", "popoverWidth", "hidePopoverOnClick"]);
+    const { id = getRandomString(), className, mobileDialogBodyClassName = '', children, popoverWidth = DEFAULT_POPOVER_WIDTH, hidePopoverOnClick = true, ...remainingProps } = props;
     const [isShown, setIsShown] = useState(false);
     const clickOutsideRef = useRef(null);
     useLayoutEffect(() => {
@@ -87,17 +86,17 @@ const ActionBarItemBase = (props) => {
     const itemPopover = childrenAsList.find(isActionBarItemPopover);
     const itemIcon = childrenAsList.find(isActionBarItemIcon);
     if (!itemPopover) {
-        return _jsx("div", Object.assign({ className: classes }, { children: children }));
+        return _jsx("div", { className: classes, children: children });
     }
     const { useOffscreen = false, title } = itemPopover.props;
     // Filter out the popover and icon component from the list of children as they are handled separately
     const childrenWithoutPopover = childrenAsList.filter(child => !isActionBarItemPopover(child));
     const childrenWithoutPopoverAndIcon = childrenWithoutPopover.filter(child => !isActionBarItemIcon(child));
     if (isSmallScreen) {
-        return (_jsxs("div", Object.assign({}, remainingProps, { className: classes, ref: clickOutsideRef }, { children: [React.cloneElement(itemIcon, { onClick: onToggle }), _jsx("div", Object.assign({ onClick: () => setIsShown(false) }, { children: _jsx(Dialog, { show: isShown, onClose: () => setIsShown(false), body: itemPopover, bodyClassName: mobileDialogBodyClassName, title: title }) })), childrenWithoutPopoverAndIcon] })));
+        return (_jsxs("div", { ...remainingProps, className: classes, ref: clickOutsideRef, children: [React.cloneElement(itemIcon, { onClick: onToggle }), _jsx("div", { onClick: () => setIsShown(false), children: _jsx(Dialog, { show: isShown, onClose: () => setIsShown(false), body: itemPopover, bodyClassName: mobileDialogBodyClassName, title: title }) }), childrenWithoutPopoverAndIcon] }));
     }
-    const overlay = (_jsx(ActionBarOverlay, Object.assign({ id: id, title: title, width: popoverWidth, preRender: useOffscreen, show: isShown }, { children: itemPopover }), 'child'));
-    return (_jsxs("div", Object.assign({}, remainingProps, { className: classes, ref: clickOutsideRef }, { children: [_jsx(OverlayTrigger, Object.assign({ onToggle: onToggle, show: isShown || useOffscreen, placement: OverlayTrigger.BOTTOM_END, overlay: overlay, rootClose: false, trigger: 'click', popperConfig: {
+    const overlay = (_jsx(ActionBarOverlay, { id: id, title: title, width: popoverWidth, preRender: useOffscreen, show: isShown, children: itemPopover }, 'child'));
+    return (_jsxs("div", { ...remainingProps, className: classes, ref: clickOutsideRef, children: [_jsx(OverlayTrigger, { onToggle: onToggle, show: isShown || useOffscreen, placement: OverlayTrigger.BOTTOM_END, overlay: overlay, rootClose: false, trigger: 'click', popperConfig: {
                     modifiers: [
                         {
                             name: 'offset',
@@ -110,7 +109,7 @@ const ActionBarItemBase = (props) => {
                             options: {},
                         },
                     ],
-                } }, { children: itemIcon })), childrenWithoutPopoverAndIcon] })));
+                }, children: itemIcon }), childrenWithoutPopoverAndIcon] }));
 };
 const ActionBarItem = memo(ActionBarItemBase);
 // Define static variables on the component type

package/components/actionBarItem/ActionBarItemIcon.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 declare const ActionBarItemIcon: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
-    className?: string | undefined;
+    className?: string;
 } & {
-    children?: React.ReactNode;
+    children?: React.ReactNode | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export default ActionBarItemIcon;

package/components/actionBarItem/ActionBarItemIcon.js

@@ -1,12 +1,11 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
 // @ts-ignore-next-line importsNotUsedAsValues
 import { forwardRef } from 'react';
 import classNames from 'classnames';
 const ActionBarItemIcon = forwardRef((props, ref) => {
-    const { className, children } = props, remainingProps = __rest(props, ["className", "children"]);
+    const { className, children, ...remainingProps } = props;
     const classes = classNames('ActionBarItemIcon', className);
-    return (_jsx("div", Object.assign({}, remainingProps, { className: classes, ref: ref }, { children: children })));
+    return (_jsx("div", { ...remainingProps, className: classes, ref: ref, children: children }));
 });
 // The displayName is used in ActionBarItem for checking the component "isActionBarItemIcon"
 ActionBarItemIcon.displayName = 'ActionBarItemIcon';

package/components/actionBarItem/ActionBarItemList.js

@@ -1,11 +1,7 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
-// @ts-ignore-next-line importsNotUsedAsValues
-import 'react';
 import classNames from 'classnames';
-const ActionBarItemList = (_a) => {
-    var { className, children } = _a, remainingProps = __rest(_a, ["className", "children"]);
+const ActionBarItemList = ({ className, children, ...remainingProps }) => {
     const classes = classNames('ActionBarItemList', className);
-    return (_jsx("ul", Object.assign({}, remainingProps, { className: classes }, { children: children })));
+    return (_jsx("ul", { ...remainingProps, className: classes, children: children }));
 };
 export default ActionBarItemList;

package/components/actionBarItem/ActionBarItemListItem.js

@@ -1,13 +1,10 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// @ts-ignore-next-line importsNotUsedAsValues
-import 'react';
 import classNames from 'classnames';
 const ActionBarItemListItem = (props) => {
-    const { hasLink, icon, onClick, className, children } = props, remainingProps = __rest(props, ["hasLink", "icon", "onClick", "className", "children"]);
+    const { hasLink, icon, onClick, className, children, ...remainingProps } = props;
     const classes = classNames('ActionBarItemListItem', hasLink && 'has-link', className);
     const iconClasses = classNames('ActionBarItemListItemIcon', 'rioglyph', icon);
     const btnClasses = classNames('ActionBarItemListItemButton');
-    return (_jsxs("li", Object.assign({}, remainingProps, { className: classes, onClick: onClick }, { children: [icon && _jsx("span", { className: iconClasses }), hasLink && !onClick && _jsx("span", { children: children }), onClick && _jsx("div", Object.assign({ className: btnClasses }, { children: children })), !hasLink && !onClick && children] })));
+    return (_jsxs("li", { ...remainingProps, className: classes, onClick: onClick, children: [icon && _jsx("span", { className: iconClasses }), hasLink && !onClick && _jsx("span", { children: children }), onClick && _jsx("div", { className: btnClasses, children: children }), !hasLink && !onClick && children] }));
 };
 export default ActionBarItemListItem;

package/components/actionBarItem/ActionBarItemListSeparator.js

@@ -1,11 +1,7 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
-// @ts-ignore-next-line: importsNotUsedAsValues
-import 'react';
 import classNames from 'classnames';
-const ActionBarItemListSeparator = (_a) => {
-    var { className } = _a, remainingProps = __rest(_a, ["className"]);
+const ActionBarItemListSeparator = ({ className, ...remainingProps }) => {
     const classes = classNames('ActionBarItemListSeparator', className);
-    return _jsx("hr", Object.assign({}, remainingProps, { className: classes }));
+    return _jsx("hr", { ...remainingProps, className: classes });
 };
 export default ActionBarItemListSeparator;

package/components/actionBarItem/ActionBarItemPopoverContent.js

@@ -1,14 +1,10 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
-// @ts-ignore-next-line importsNotUsedAsValues
-import 'react';
 import classNames from 'classnames';
 import omit from 'lodash/fp/omit';
-const ActionBarItemPopoverContent = (_a) => {
-    var { className, children } = _a, remainingProps = __rest(_a, ["className", "children"]);
+const ActionBarItemPopoverContent = ({ className, children, ...remainingProps }) => {
     const classes = classNames('ActionBarItemPopoverContent', className);
     const filterProps = omit(['title', 'useOffscreen'])(remainingProps);
-    return (_jsx("div", Object.assign({}, filterProps, { className: classes }, { children: children })));
+    return (_jsx("div", { ...filterProps, className: classes, children: children }));
 };
 // The displayName is used in ActionBarItem for checking the component "isActionBarItemPopover"
 ActionBarItemPopoverContent.displayName = 'ActionBarItemPopoverContent';

package/components/actionBarItem/ActionBarOverlay.d.ts

@@ -14,6 +14,6 @@ export type ActionBarOverlayProps = {
     className?: string;
 };
 declare const ActionBarOverlay: React.ForwardRefExoticComponent<ActionBarOverlayProps & {
-    children?: React.ReactNode;
+    children?: React.ReactNode | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export default ActionBarOverlay;

package/components/actionBarItem/ActionBarOverlay.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // @ts-ignore-next-line importsNotUsedAsValues
 import { forwardRef } from 'react';
@@ -8,11 +7,11 @@ import Popover, { PLACEMENT_MAP } from '../popover/Popover';
 const DEFAULT_PLACEMENT = PLACEMENT_MAP.BOTTOM;
 const DEFAULT_WIDTH = 250;
 const ActionBarOverlay = forwardRef((props, ref) => {
-    const { children, show, preRender, id, title, onClick = noop, width = DEFAULT_WIDTH, style = {}, className, placement = DEFAULT_PLACEMENT } = props, remainingProps = __rest(props, ["children", "show", "preRender", "id", "title", "onClick", "width", "style", "className", "placement"]);
-    const adjustedStyles = Object.assign(Object.assign({}, style), { width });
+    const { children, show, preRender, id, title, onClick = noop, width = DEFAULT_WIDTH, style = {}, className, placement = DEFAULT_PLACEMENT, ...remainingProps } = props;
+    const adjustedStyles = { ...style, width };
     const adjustedClassName = preRender && !show ? classNames(className, 'position-offscreen') : className;
     const popoverTitleClasses = classNames('ActionBarItemPopover text-color-dark', className);
     const popoverContentClasses = classNames('ActionBarItemPopover', className);
-    return (_jsxs(Popover, Object.assign({ ref: ref, id: id, onClick: onClick, placement: placement }, remainingProps, { style: adjustedStyles, className: adjustedClassName }, { children: [title && _jsx(Popover.Title, Object.assign({ className: popoverTitleClasses }, { children: title })), _jsx(Popover.Content, Object.assign({ className: popoverContentClasses }, { children: children }))] })));
+    return (_jsxs(Popover, { ref: ref, id: id, onClick: onClick, placement: placement, ...remainingProps, style: adjustedStyles, className: adjustedClassName, children: [title && _jsx(Popover.Title, { className: popoverTitleClasses, children: title }), _jsx(Popover.Content, { className: popoverContentClasses, children: children })] }));
 });
 export default ActionBarOverlay;

package/components/activity/Activity.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import classNames from 'classnames';
@@ -16,12 +15,12 @@ const icons = {
 };
 const SIZE_MAP = { SIZE_SM: 'sm', SIZE_LG: 'lg', SIZE_XL: 'xl' };
 const Activity = forwardRef((props, ref) => {
-    const { activity, duration, isOutdated = false, bsSize, onClick = () => { }, className = '' } = props, remainingProps = __rest(props, ["activity", "duration", "isOutdated", "bsSize", "onClick", "className"]);
+    const { activity, duration, isOutdated = false, bsSize, onClick = () => { }, className = '', ...remainingProps } = props;
     if (!activity) {
         return null;
     }
     const wrapperClassNames = classNames('activity', `activity-${activity}`, isOutdated && 'opacity-50', bsSize && `activity-${bsSize}`, className && className);
-    return (_jsxs("div", Object.assign({ ref: ref }, remainingProps, { className: wrapperClassNames, onClick: onClick }, { children: [_jsx("span", Object.assign({ className: 'activity-icon' }, { children: _jsx("span", { className: `rioglyph ${icons[activity]}` }) })), duration && _jsx("span", Object.assign({ className: 'activity-text' }, { children: duration }))] })));
+    return (_jsxs("div", { ref: ref, ...remainingProps, className: wrapperClassNames, onClick: onClick, children: [_jsx("span", { className: 'activity-icon', children: _jsx("span", { className: `rioglyph ${icons[activity]}` }) }), duration && _jsx("span", { className: 'activity-text', children: duration })] }));
 });
 // statics
 Object.assign(Activity, STATUS_MAP);

package/components/animatedNumber/AnimatedNumber.d.ts

@@ -49,30 +49,30 @@ export declare const AnimatedNumber: React.ForwardRefExoticComponent<React.HTMLA
     /**
      * A prefix to be added to the final string.
      */
-    prefix?: string | undefined;
+    prefix?: string;
     /**
      * A unit suffix to be added to the final string.
      */
-    unit?: string | undefined;
+    unit?: string;
     /**
      * The speed in milliseconds to count up or down.
      *
      * @default 10
      */
-    speed?: number | undefined;
+    speed?: number;
     /**
      * Enables to count backwards.
      *
      * @default false
      */
-    decreasing?: boolean | undefined;
+    decreasing?: boolean;
     /**
      * Callback function to be invoked when the end value is reached.
      */
-    onEnd?: VoidFunction | undefined;
+    onEnd?: VoidFunction;
     /**
      * Additional classes to be set on the wrapping element.
      */
-    className?: string | undefined;
+    className?: string;
 } & React.RefAttributes<HTMLSpanElement>>;
 export default AnimatedNumber;

package/components/animatedNumber/AnimatedNumber.js

@@ -1,10 +1,9 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useEffect, useState } from 'react';
 import useInterval from '../../hooks/useInterval';
 const TIMER = 10;
 export const AnimatedNumber = forwardRef((props, ref) => {
-    const { start, end, prefix = '', unit = '', speed = TIMER, decreasing = false, onEnd = () => { }, className = '' } = props, remainingProps = __rest(props, ["start", "end", "prefix", "unit", "speed", "decreasing", "onEnd", "className"]);
+    const { start, end, prefix = '', unit = '', speed = TIMER, decreasing = false, onEnd = () => { }, className = '', ...remainingProps } = props;
     const [value, setValue] = useState(start);
     const shallContinueRunning = decreasing ? value > end : value < end;
     useInterval(() => {
@@ -15,6 +14,6 @@ export const AnimatedNumber = forwardRef((props, ref) => {
             onEnd();
         }
     });
-    return _jsx("span", Object.assign({ ref: ref }, remainingProps, { className: className }, { children: `${prefix}${value}${unit}` }));
+    return _jsx("span", { ref: ref, ...remainingProps, className: className, children: `${prefix}${value}${unit}` });
 });
 export default AnimatedNumber;

package/components/applicationHeader/AppMenu.js

@@ -1,14 +1,11 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
-// @ts-ignore-next-line importsNotUsedAsValues
-import 'react';
 import classNames from 'classnames';
 import AppMenuDropdown from './AppMenuDropdown';
 import AppMenuContent from './AppMenuContent';
 const AppMenu = (props) => {
-    const { label = 'Unknown', appMenuItems = [], appNavigatorClassName, appNavigator, onToggleAppMenu } = props, remainingProps = __rest(props, ["label", "appMenuItems", "appNavigatorClassName", "appNavigator", "onToggleAppMenu"]);
-    const hasItems = !!((appMenuItems === null || appMenuItems === void 0 ? void 0 : appMenuItems.length) || appNavigator);
+    const { label = 'Unknown', appMenuItems = [], appNavigatorClassName, appNavigator, onToggleAppMenu, ...remainingProps } = props;
+    const hasItems = !!(appMenuItems?.length || appNavigator);
     const wrapperClassNames = classNames('ModuleNavigation AppMenu', 'user-select-none', { hasModules: hasItems }, !appNavigator && 'pointer-events-none', appNavigatorClassName && appNavigatorClassName);
-    return (_jsx("ul", Object.assign({}, remainingProps, { className: wrapperClassNames }, { children: _jsx(AppMenuDropdown, Object.assign({ title: label, caret: hasItems, onToggleAppMenu: onToggleAppMenu }, { children: appNavigator && _jsx(AppMenuContent, { appMenuItems: appMenuItems, appNavigator: appNavigator }) })) })));
+    return (_jsx("ul", { ...remainingProps, className: wrapperClassNames, children: _jsx(AppMenuDropdown, { title: label, caret: hasItems, onToggleAppMenu: onToggleAppMenu, children: appNavigator && _jsx(AppMenuContent, { appMenuItems: appMenuItems, appNavigator: appNavigator }) }) }));
 };
 export default AppMenu;

package/components/applicationHeader/AppMenuContent.js

@@ -1,16 +1,14 @@
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-// @ts-ignore-next-line importsNotUsedAsValues
-import 'react';
 const AppMenuContent = (props) => {
     const { appMenuItems, appNavigator } = props;
     // In case there is a navigation component injected into the header,
     // render this component
     if (appNavigator) {
-        return (_jsx("li", Object.assign({ role: 'presentation' }, { children: appNavigator }), 'app-navigator'));
+        return (_jsx("li", { role: 'presentation', children: appNavigator }, 'app-navigator'));
     }
     // If there is a list of appMenuItems given, render them as a list
     return (_jsx(_Fragment, { children: appMenuItems.map(module => {
-            return (_jsx("li", Object.assign({ role: 'presentation' }, { children: module.route }), `link-icon-${module.key}`));
+            return (_jsx("li", { role: 'presentation', children: module.route }, `link-icon-${module.key}`));
         }) }));
 };
 export default AppMenuContent;

package/components/applicationHeader/AppMenuDropdown.js

@@ -9,18 +9,18 @@ const ToggleButton = (props) => {
     const toggleClassName = classNames('ModuleNavigation-dropdown', 'dropdown-toggle justify-content-between', {
         inactive: !caret,
     });
-    return (_jsxs("a", Object.assign({ className: toggleClassName, role: 'button', id: 'basic-nav-dropdown' }, { children: [_jsx("span", { children: title }), caret && _jsx("span", { className: 'caret' })] })));
+    return (_jsxs("a", { className: toggleClassName, role: 'button', id: 'basic-nav-dropdown', children: [_jsx("span", { children: title }), caret && _jsx("span", { className: 'caret' })] }));
 };
 const DropdownMenu = (props) => {
     const { children } = props;
     if (isEmpty(children)) {
         return null;
     }
-    return (_jsx("ul", Object.assign({ role: 'menu', className: 'dropdown-menu ModuleNavigation-dropdown-menu' }, { children: children })));
+    return (_jsx("ul", { role: 'menu', className: 'dropdown-menu ModuleNavigation-dropdown-menu', children: children }));
 };
 const AppMenuDropdownOpener = forwardRef((props, ref) => {
     const { open, children, onDropdownClick } = props;
-    return (_jsx("li", Object.assign({ ref: ref, className: classNames('dropdown', { open }), onClick: onDropdownClick }, { children: children })));
+    return (_jsx("li", { ref: ref, className: classNames('dropdown', { open }), onClick: onDropdownClick, children: children }));
 });
 export const AppMenuDropdown = (props) => {
     const { title, caret = false, onToggleAppMenu = noop, children } = props;
@@ -32,6 +32,6 @@ export const AppMenuDropdown = (props) => {
         onToggleAppMenu(newState);
     };
     const openWithChildren = !isEmpty(children) && isOpen;
-    return (_jsxs(AppMenuDropdownOpener, Object.assign({ open: openWithChildren, onDropdownClick: handleDropdownClick, ref: wrapperRef }, { children: [_jsx(ToggleButton, { title: title, caret: caret }), _jsx(DropdownMenu, { children: children })] })));
+    return (_jsxs(AppMenuDropdownOpener, { open: openWithChildren, onDropdownClick: handleDropdownClick, ref: wrapperRef, children: [_jsx(ToggleButton, { title: title, caret: caret }), _jsx(DropdownMenu, { children: children })] }));
 };
 export default AppMenuDropdown;

package/components/applicationHeader/ApplicationActionBar.js

@@ -1,11 +1,8 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
-// @ts-ignore-next-line importsNotUsedAsValues
-import 'react';
 const ApplicationActionBar = (props) => {
-    const { items, nodeRef, className = '' } = props, remainingProps = __rest(props, ["items", "nodeRef", "className"]);
-    return (_jsx("ul", Object.assign({}, remainingProps, { className: `ApplicationActionBar nav navbar-nav navbar-right ${className}`, ref: nodeRef }, { children: items === null || items === void 0 ? void 0 : items.map((item, index) => {
-            return (_jsx("li", Object.assign({ role: 'presentation', className: 'navigationItem' }, { children: item }), index));
-        }) })));
+    const { items, nodeRef, className = '', ...remainingProps } = props;
+    return (_jsx("ul", { ...remainingProps, className: `ApplicationActionBar nav navbar-nav navbar-right ${className}`, ref: nodeRef, children: items?.map((item, index) => {
+            return (_jsx("li", { role: 'presentation', className: 'navigationItem', children: item }, index));
+        }) }));
 };
 export default ApplicationActionBar;

package/components/applicationHeader/ApplicationHeader.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useRef, forwardRef, useCallback, useImperativeHandle } from 'react';
 import isEmpty from 'lodash/fp/isEmpty';
@@ -11,10 +10,10 @@ import useResizeObserver from '../../hooks/useResizeObserver';
 import NavItems from './NavItems';
 const SCREEN_SM = 768; // @screen-sm: 768px;
 export const ApplicationHeader = forwardRef((props, ref) => {
-    const { homeRoute = '', showHomeIcon = true, label, className, appNavigator, appNavigatorClassName, appMenuItems, navItems, actionBarItems = [], onToggleAppMenu = () => { } } = props, remainingProps = __rest(props, ["homeRoute", "showHomeIcon", "label", "className", "appNavigator", "appNavigatorClassName", "appMenuItems", "navItems", "actionBarItems", "onToggleAppMenu"]);
+    const { homeRoute = '', showHomeIcon = true, label, className, appNavigator, appNavigatorClassName, appMenuItems, navItems, actionBarItems = [], onToggleAppMenu = () => { }, ...remainingProps } = props;
     const actionBarRef = useRef(null);
     const [navRef, entry] = useResizeObserver();
-    const contentRect = entry === null || entry === void 0 ? void 0 : entry.contentRect;
+    const contentRect = entry?.contentRect;
     useImperativeHandle(ref, () => navRef, [navRef]);
     const getContentRect = useCallback((key) => {
         if (contentRect) {
@@ -26,7 +25,7 @@ export const ApplicationHeader = forwardRef((props, ref) => {
     const isMobileWidth = containerWidth <= SCREEN_SM;
     const hasActionBarItems = !isEmpty(actionBarItems);
     const wrapperClassNames = classNames('ApplicationHeader', 'user-select-none', isMobileWidth && 'mobile', className && className);
-    return (_jsxs("nav", Object.assign({}, remainingProps, { className: wrapperClassNames, ref: navRef }, { children: [isMobileWidth && (_jsxs(React.Fragment, { children: [_jsx(MobileAppMenu, { showHomeIcon: showHomeIcon, homeRoute: homeRoute, appMenuItems: appMenuItems, appNavigator: appNavigator, onToggleAppMenu: onToggleAppMenu }), _jsxs("div", Object.assign({ className: 'flex-1-1-0 display-flex gap-10' }, { children: [_jsx(MobileSubmoduleNavigation, { className: 'flex-1-1', label: label, navItems: navItems }), hasActionBarItems && _jsx(Divider, {}), _jsx(ApplicationActionBar, { className: 'mobile', nodeRef: actionBarRef, items: actionBarItems })] }))] })), !isMobileWidth && (_jsxs(React.Fragment, { children: [_jsx("div", Object.assign({ className: 'navbar-header' }, { children: _jsx("span", Object.assign({ className: `navbar-brand ${showHomeIcon ? 'home-icon' : ''}` }, { children: homeRoute })) })), label && (_jsx(AppMenu, { label: label, appMenuItems: appMenuItems, appNavigator: appNavigator, appNavigatorClassName: appNavigatorClassName, onToggleAppMenu: onToggleAppMenu }, 'AppMenu')), isEmpty(navItems) && _jsx("ul", { className: 'SubmoduleNavigation nav' }), !isEmpty(navItems) && (_jsx(NavItems, { navItems: navItems, containerWidth: containerWidth, actionBarItems: actionBarItems }, 'NavItems')), _jsx(ApplicationActionBar, { nodeRef: actionBarRef, items: actionBarItems })] }))] })));
+    return (_jsxs("nav", { ...remainingProps, className: wrapperClassNames, ref: navRef, children: [isMobileWidth && (_jsxs(React.Fragment, { children: [_jsx(MobileAppMenu, { showHomeIcon: showHomeIcon, homeRoute: homeRoute, appMenuItems: appMenuItems, appNavigator: appNavigator, onToggleAppMenu: onToggleAppMenu }), _jsxs("div", { className: 'flex-1-1-0 display-flex gap-10', children: [_jsx(MobileSubmoduleNavigation, { className: 'flex-1-1', label: label, navItems: navItems }), hasActionBarItems && _jsx(Divider, {}), _jsx(ApplicationActionBar, { className: 'mobile', nodeRef: actionBarRef, items: actionBarItems })] })] })), !isMobileWidth && (_jsxs(React.Fragment, { children: [_jsx("div", { className: 'navbar-header', children: _jsx("span", { className: `navbar-brand ${showHomeIcon ? 'home-icon' : ''}`, children: homeRoute }) }), label && (_jsx(AppMenu, { label: label, appMenuItems: appMenuItems, appNavigator: appNavigator, appNavigatorClassName: appNavigatorClassName, onToggleAppMenu: onToggleAppMenu }, 'AppMenu')), isEmpty(navItems) && _jsx("ul", { className: 'SubmoduleNavigation nav' }), !isEmpty(navItems) && (_jsx(NavItems, { navItems: navItems, containerWidth: containerWidth, actionBarItems: actionBarItems }, 'NavItems')), _jsx(ApplicationActionBar, { nodeRef: actionBarRef, items: actionBarItems })] }))] }));
 });
-const Divider = () => (_jsx("div", Object.assign({ className: 'divider display-flex align-items-center' }, { children: _jsx("div", { className: 'width-3 height-20 bg-lighter' }) })));
+const Divider = () => (_jsx("div", { className: 'divider display-flex align-items-center', children: _jsx("div", { className: 'width-3 height-20 bg-lighter' }) }));
 export default ApplicationHeader;

package/components/applicationHeader/CollapsedNavItem.js

@@ -7,8 +7,8 @@ const CollapsedNavItem = forwardRef((props, ref) => {
         return null;
     }
     const collapsedDropdownClass = show ? 'open' : '';
-    return (_jsxs("li", Object.assign({ className: `CollapsedDropdown dropdown ${collapsedDropdownClass}`, ref: ref }, { children: [_jsx("a", Object.assign({ id: 'basic-nav-dropdown', role: 'button', className: 'dropdown-toggle text-color-gray', "aria-haspopup": 'true', "aria-expanded": 'true', onClick: onDropdownClick }, { children: _jsx("span", { className: 'rioglyph rioglyph-option-horizontal', "aria-hidden": 'true' }) })), _jsx("ul", Object.assign({ className: 'dropdown-menu', role: 'menu', "aria-labelledby": 'basic-nav-dropdown' }, { children: navItems.map(navItem => {
-                    return (_jsx("li", Object.assign({ className: 'submodule', onClick: onItemClick, "data-nav-item-key": navItem.key }, { children: navItem.route }), navItem.key));
-                }) }))] }), 'collapsed-dropdown'));
+    return (_jsxs("li", { className: `CollapsedDropdown dropdown ${collapsedDropdownClass}`, ref: ref, children: [_jsx("a", { id: 'basic-nav-dropdown', role: 'button', className: 'dropdown-toggle text-color-gray', "aria-haspopup": 'true', "aria-expanded": 'true', onClick: onDropdownClick, children: _jsx("span", { className: 'rioglyph rioglyph-option-horizontal', "aria-hidden": 'true' }) }), _jsx("ul", { className: 'dropdown-menu', role: 'menu', "aria-labelledby": 'basic-nav-dropdown', children: navItems.map(navItem => {
+                    return (_jsx("li", { className: 'submodule', onClick: onItemClick, "data-nav-item-key": navItem.key, children: navItem.route }, navItem.key));
+                }) })] }, 'collapsed-dropdown'));
 });
 export default CollapsedNavItem;

package/components/applicationHeader/MobileAppMenu.js

@@ -11,7 +11,7 @@ const MobileAppMenu = (props) => {
         onToggleAppMenu(newState);
     };
     const hasAppContent = !(isNil(appMenuItems) && isNil(appNavigator));
-    return (_jsxs(React.Fragment, { children: [_jsxs("div", Object.assign({ className: 'navbar-header min-width-50 padding-5 ' +
-                    'overflow-hidden position-relative display-flex align-items-center', onClick: handleToggleNavigation }, { children: [_jsx("span", Object.assign({ className: `navbar-brand height-40 width-40 ${showHomeIcon ? 'home-icon' : ''}` }, { children: !hasAppContent && homeRoute })), hasAppContent && (_jsx("div", Object.assign({ className: 'position-absolute right-2 bottom-0 text-color-white rotate-45' }, { children: _jsx("span", { className: 'rioglyph rioglyph-triangle-right' }) })))] })), appNavigator && (_jsx(MobileHeaderModal, Object.assign({ show: isShown, modalClassName: 'padding-top-25', onClose: handleToggleNavigation }, { children: _jsx("div", Object.assign({ className: 'width-100pct height-100pct' }, { children: appNavigator })) }))), appMenuItems && (_jsx(MobileHeaderModal, Object.assign({ show: isShown, modalClassName: 'padding-15', onClose: handleToggleNavigation }, { children: appMenuItems.map(module => (_jsx("li", Object.assign({ role: 'presentation' }, { children: module.route }), `link-icon-${module.key}`))) })))] }));
+    return (_jsxs(React.Fragment, { children: [_jsxs("div", { className: 'navbar-header min-width-50 padding-5 ' +
+                    'overflow-hidden position-relative display-flex align-items-center', onClick: handleToggleNavigation, children: [_jsx("span", { className: `navbar-brand height-40 width-40 ${showHomeIcon ? 'home-icon' : ''}`, children: !hasAppContent && homeRoute }), hasAppContent && (_jsx("div", { className: 'position-absolute right-2 bottom-0 text-color-white rotate-45', children: _jsx("span", { className: 'rioglyph rioglyph-triangle-right' }) }))] }), appNavigator && (_jsx(MobileHeaderModal, { show: isShown, modalClassName: 'padding-top-25', onClose: handleToggleNavigation, children: _jsx("div", { className: 'width-100pct height-100pct', children: appNavigator }) })), appMenuItems && (_jsx(MobileHeaderModal, { show: isShown, modalClassName: 'padding-15', onClose: handleToggleNavigation, children: appMenuItems.map(module => (_jsx("li", { role: 'presentation', children: module.route }, `link-icon-${module.key}`))) }))] }));
 };
 export default MobileAppMenu;

package/components/applicationHeader/MobileHeaderModal.js

@@ -12,7 +12,7 @@ const MobileHeaderModal = (props) => {
     const modalRoot = getOrCreatePortalRoot();
     const pageHeight = window.innerHeight - 30;
     const offset = OFFSET_POSITION - window.innerHeight;
-    return (_jsx(_Fragment, { children: ReactDOM.createPortal(_jsxs(React.Fragment, { children: [_jsx(AnimatePresence, { children: show && (_jsxs(motion.div, Object.assign({ className: wrapperClasses, initial: { opacity: 0, top: offset }, animate: { opacity: 1, y: 0, top: 0 }, exit: { opacity: 0, transition: { duration: 0.3 }, top: offset } }, { children: [_jsx("div", Object.assign({ className: modalClasses, style: { height: `${pageHeight}px` } }, { children: children })), showClose && (_jsx("div", Object.assign({ className: 'position-absolute top-15 right-15 margin-top-15 margin-right-15 ' +
-                                    'text-size-20 text-color-dark', onClick: onClose }, { children: _jsx("span", { className: 'rioglyph rioglyph-remove' }) })))] }))) }), _jsx(AnimatePresence, { children: show && (_jsx(motion.div, { className: 'bottom-sheet-backdrop', initial: { opacity: 0 }, animate: { opacity: 0.5 }, exit: { opacity: 0 } })) })] }), modalRoot) }));
+    return (_jsx(_Fragment, { children: ReactDOM.createPortal(_jsxs(React.Fragment, { children: [_jsx(AnimatePresence, { children: show && (_jsxs(motion.div, { className: wrapperClasses, initial: { opacity: 0, top: offset }, animate: { opacity: 1, y: 0, top: 0 }, exit: { opacity: 0, transition: { duration: 0.3 }, top: offset }, children: [_jsx("div", { className: modalClasses, style: { height: `${pageHeight}px` }, children: children }), showClose && (_jsx("div", { className: 'position-absolute top-15 right-15 margin-top-15 margin-right-15 ' +
+                                    'text-size-20 text-color-dark', onClick: onClose, children: _jsx("span", { className: 'rioglyph rioglyph-remove' }) }))] })) }), _jsx(AnimatePresence, { children: show && (_jsx(motion.div, { className: 'bottom-sheet-backdrop', initial: { opacity: 0 }, animate: { opacity: 0.5 }, exit: { opacity: 0 } })) })] }), modalRoot) }));
 };
 export default MobileHeaderModal;

package/components/applicationHeader/MobileSubmoduleNavigation.js

@@ -12,11 +12,11 @@ const MobileSubmoduleNavigation = (props) => {
     const labelClasses = classNames(hasNavItems
         ? 'text-size-12 text-color-dark line-height-14'
         : 'text-size-16 line-height-16 text-color-darkest text-medium text-uppercase', 'width-100pct ellipsis-1');
-    return (_jsxs("div", Object.assign({ className: classes, onClick: handleToggleNavigation }, { children: [_jsxs("div", Object.assign({ className: 'flex-1-1 display-flex flex-column align-items-center width-0' }, { children: [_jsx("div", Object.assign({ className: labelClasses }, { children: label })), _jsx("div", Object.assign({ className: 'text-medium width-100pct' }, { children: navItems.map(navItem => (_jsx("div", Object.assign({ className: 'ellipsis-1' }, { children: React.cloneElement(navItem.route, {
+    return (_jsxs("div", { className: classes, onClick: handleToggleNavigation, children: [_jsxs("div", { className: 'flex-1-1 display-flex flex-column align-items-center width-0', children: [_jsx("div", { className: labelClasses, children: label }), _jsx("div", { className: 'text-medium width-100pct', children: navItems.map(navItem => (_jsx("div", { className: 'ellipsis-1', children: React.cloneElement(navItem.route, {
                                 className: 'text-size-16 line-height-16 text-color-darkest text-decoration-none',
                                 onClick: (event) => event.preventDefault(),
-                            }) }), navItem.key))) }))] })), hasNavItems && (_jsx("div", Object.assign({ className: 'text-size-16 text-color-dark' }, { children: _jsx("span", { className: 'rioglyph rioglyph-chevron-down' }) }))), hasNavItems && (_jsx(MobileHeaderModal, Object.assign({ show: isShown }, { children: navItems.map(navItem => (_jsx("div", Object.assign({ className: 'margin-y-15 font-size-20' }, { children: React.cloneElement(navItem.route, {
+                            }) }, navItem.key))) })] }), hasNavItems && (_jsx("div", { className: 'text-size-16 text-color-dark', children: _jsx("span", { className: 'rioglyph rioglyph-chevron-down' }) })), hasNavItems && (_jsx(MobileHeaderModal, { show: isShown, children: navItems.map(navItem => (_jsx("div", { className: 'margin-y-15 font-size-20', children: React.cloneElement(navItem.route, {
                         className: 'text-size-20 text-color-darker',
-                    }) }), navItem.key))) })))] })));
+                    }) }, navItem.key))) }))] }));
 };
 export default MobileSubmoduleNavigation;