@rio-cloud/rio-uikit 1.6.0 → 1.7.0

package/lib/es/components/applicationLayout/ApplicationLayoutBodyBottomBar.js

@@ -5,9 +5,9 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const ApplicationLayoutBodyBottomBar = (0, react_1.forwardRef)((props, ref) => {
-    const { className, buttonAlignment, useBodyPaddings = false, children } = props, remainingProps = tslib_1.__rest(props, ["className", "buttonAlignment", "useBodyPaddings", "children"]);
+    const { className, buttonAlignment, useBodyPaddings = false, children, ...remainingProps } = props;
     const classes = (0, classnames_1.default)('ApplicationLayoutBodyBottomBar', buttonAlignment === 'left' && 'justify-content-start', buttonAlignment === 'right' && 'justify-content-end', buttonAlignment !== 'left' && buttonAlignment !== 'right' && 'justify-content-between', useBodyPaddings && 'use-body-padding', className && className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, remainingProps, { className: classes }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, ...remainingProps, className: classes, children: children }));
 });
 ApplicationLayoutBodyBottomBar.LEFT = 'left';
 ApplicationLayoutBodyBottomBar.RIGHT = 'right';

package/lib/es/components/applicationLayout/ApplicationLayoutBodyNavigation.d.ts

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

package/lib/es/components/applicationLayout/ApplicationLayoutBodyNavigation.js

@@ -5,8 +5,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const ApplicationLayoutBodyNavigation = (0, react_1.forwardRef)((props, ref) => {
-    const { className, children } = props, remainingProps = tslib_1.__rest(props, ["className", "children"]);
+    const { className, children, ...remainingProps } = props;
     const navigationClasses = (0, classnames_1.default)('ApplicationLayoutBodyNavigation', className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, remainingProps, { className: navigationClasses }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, ...remainingProps, className: navigationClasses, children: children }));
 });
 exports.default = ApplicationLayoutBodyNavigation;

package/lib/es/components/applicationLayout/ApplicationLayoutHeader.d.ts

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

package/lib/es/components/applicationLayout/ApplicationLayoutHeader.js

@@ -5,8 +5,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const ApplicationLayoutHeader = (0, react_1.forwardRef)((props, ref) => {
-    const { className, children } = props, remainingProps = tslib_1.__rest(props, ["className", "children"]);
+    const { className, children, ...remainingProps } = props;
     const classes = (0, classnames_1.default)('ApplicationLayoutHeader', className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, remainingProps, { className: classes, id: 'ApplicationLayoutHeader' }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, ...remainingProps, className: classes, id: 'ApplicationLayoutHeader', children: children }));
 });
 exports.default = ApplicationLayoutHeader;

package/lib/es/components/applicationLayout/ApplicationLayoutSidebar.d.ts

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

package/lib/es/components/applicationLayout/ApplicationLayoutSidebar.js

@@ -5,8 +5,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const ApplicationLayoutSidebar = (0, react_1.forwardRef)((props, ref) => {
-    const { className, children } = props, remainingProps = tslib_1.__rest(props, ["className", "children"]);
+    const { className, children, ...remainingProps } = props;
     const classes = (0, classnames_1.default)('ApplicationLayoutSidebar', className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, remainingProps, { className: classes }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, ...remainingProps, className: classes, children: children }));
 });
 exports.default = ApplicationLayoutSidebar;

package/lib/es/components/applicationLayout/SubNavigation.js

@@ -5,8 +5,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const SubNavigation = (0, react_1.forwardRef)((props, ref) => {
-    const { className, navItems = [] } = props, remainingProps = tslib_1.__rest(props, ["className", "navItems"]);
+    const { className, navItems = [], ...remainingProps } = props;
     const navigationClasses = (0, classnames_1.default)('SubNavigation', 'width-100pct overflow-auto', className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, remainingProps, { className: navigationClasses }, { children: (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: 'SubmoduleNavigation nav' }, { children: navItems.map(navItem => ((0, jsx_runtime_1.jsx)("li", Object.assign({ className: 'submodule', "data-nav-item-key": navItem.key }, { children: navItem.route }), navItem.key))) })) })));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, ...remainingProps, className: navigationClasses, children: (0, jsx_runtime_1.jsx)("ul", { className: 'SubmoduleNavigation nav', children: navItems.map(navItem => ((0, jsx_runtime_1.jsx)("li", { className: 'submodule', "data-nav-item-key": navItem.key, children: navItem.route }, navItem.key))) }) }));
 });
 exports.default = SubNavigation;

package/lib/es/components/aspectRatioPlaceholder/AspectRatioPlaceholder.js

@@ -1,10 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const AspectRatioPlaceholder = (props) => {
     const { width = 16, height = 9, className = '', children } = props;
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `position-relative ${className}`, style: { aspectRatio: `${width} / ${height}` } }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: `position-relative ${className}`, style: { aspectRatio: `${width} / ${height}` }, children: children }));
 };
 exports.default = AspectRatioPlaceholder;

package/lib/es/components/assetTree/AssetTree.d.ts

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

package/lib/es/components/assetTree/AssetTree.js

@@ -22,14 +22,14 @@ const TreeMode = {
     MODE_FLY: 'fly',
     MODE_FLUID: 'fluid',
 };
-const getSidebarBodyRef = (sidebarRef) => { var _a; return (0, head_1.default)((_a = sidebarRef === null || sidebarRef === void 0 ? void 0 : sidebarRef.current) === null || _a === void 0 ? void 0 : _a.getElementsByClassName('AssetTreeBody')); };
+const getSidebarBodyRef = (sidebarRef) => (0, head_1.default)(sidebarRef?.current?.getElementsByClassName('AssetTreeBody'));
 const getCurrentCategoryElement = (children, currentCategoryId) => {
     return (0, isArray_1.default)(children) ? children.find(child => child && child.props.id === currentCategoryId) : children;
 };
 const renderTreesOffscreen = (children, categoryId) => {
     return react_1.default.Children.map(children, child => {
         const offscreenClasses = (0, classnames_1.default)('TreeOffscreenWrapper', child && child.props.id !== categoryId && 'position-offscreen pointer-events-none');
-        return (0, jsx_runtime_1.jsx)("div", Object.assign({ className: offscreenClasses }, { children: child }));
+        return (0, jsx_runtime_1.jsx)("div", { className: offscreenClasses, children: child });
     });
 };
 // Check if the child is a React element and if it has the type TreeCategory
@@ -37,7 +37,7 @@ const isTreeCategory = (child) => {
     return react_1.default.isValidElement(child) && child.type === TreeCategory_1.default;
 };
 const AssetTree = (0, react_1.memo)((0, react_1.forwardRef)((props, ref) => {
-    const { className, resizable = true, width = DEFAULT_WIDTH, minWidth = DEFAULT_MIN_WIDTH, maxWidth = DEFAULT_MAX_WIDTH, height, bordered = false, currentCategoryId, isOpen = true, useOffscreen = false, fly = false, onCategoryChange = noop_1.default, onToggleTree = noop_1.default, onResizeEnd = noop_1.default, children = [] } = props, remainingProps = tslib_1.__rest(props, ["className", "resizable", "width", "minWidth", "maxWidth", "height", "bordered", "currentCategoryId", "isOpen", "useOffscreen", "fly", "onCategoryChange", "onToggleTree", "onResizeEnd", "children"]);
+    const { className, resizable = true, width = DEFAULT_WIDTH, minWidth = DEFAULT_MIN_WIDTH, maxWidth = DEFAULT_MAX_WIDTH, height, bordered = false, currentCategoryId, isOpen = true, useOffscreen = false, fly = false, onCategoryChange = noop_1.default, onToggleTree = noop_1.default, onResizeEnd = noop_1.default, children = [], ...remainingProps } = props;
     const getSidebarMode = (isFly) => (isFly ? TreeMode.MODE_FLY : TreeMode.MODE_FLUID);
     const [treeWidth, setTreeWidth] = (0, react_1.useState)(width);
     const [isResize, setIsResize] = (0, react_1.useState)(false);
@@ -103,7 +103,7 @@ const AssetTree = (0, react_1.memo)((0, react_1.forwardRef)((props, ref) => {
         setIsResize(false);
         onResizeEnd();
     };
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { className: classes, style: style, ref: mergedRefs }, { children: [(0, jsx_runtime_1.jsx)("div", { className: resizeLimitClasses, style: resizeLimitStyle }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'AssetTreeContent' }, { children: [(0, jsx_runtime_1.jsx)(TreeSidebar_1.default, Object.assign({ onSelectCategory: handleSelectCategory, currentCategoryId: currentCategoryId, onClick: handleToggleTreeContent }, { children: (0, isArray_1.default)(children) ? children : [children] })), (0, jsx_runtime_1.jsx)(SmoothScrollbars_1.default, Object.assign({ slideIn: true, className: 'AssetTreeBody' }, { children: useOffscreen ? renderTreesOffscreen(childrenArray, currentCategoryId) : category }))] })), resizable && isOpen && ((0, jsx_runtime_1.jsx)(Resizer_1.default, { onResizeStart: handleResizeStart, onResize: handleResize, onResizeEnd: handleResizeEnd, direction: Resizer_1.default.HORIZONTAL, position: Resizer_1.default.RIGHT }))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { ...remainingProps, className: classes, style: style, ref: mergedRefs, children: [(0, jsx_runtime_1.jsx)("div", { className: resizeLimitClasses, style: resizeLimitStyle }), (0, jsx_runtime_1.jsxs)("div", { className: 'AssetTreeContent', children: [(0, jsx_runtime_1.jsx)(TreeSidebar_1.default, { onSelectCategory: handleSelectCategory, currentCategoryId: currentCategoryId, onClick: handleToggleTreeContent, children: (0, isArray_1.default)(children) ? children : [children] }), (0, jsx_runtime_1.jsx)(SmoothScrollbars_1.default, { slideIn: true, className: 'AssetTreeBody', children: useOffscreen ? renderTreesOffscreen(childrenArray, currentCategoryId) : category })] }), resizable && isOpen && ((0, jsx_runtime_1.jsx)(Resizer_1.default, { onResizeStart: handleResizeStart, onResize: handleResize, onResizeEnd: handleResizeEnd, direction: Resizer_1.default.HORIZONTAL, position: Resizer_1.default.RIGHT }))] }));
 }));
 Object.assign(AssetTree, TreeMode);
 exports.default = AssetTree;

package/lib/es/components/assetTree/Tree.d.ts

@@ -45,12 +45,12 @@ export type TreeItem = {
      */
     info?: string | React.ReactNode;
     /**
-     * The type of an item which is also the name of the respective rioplyph icon without the prefix
+     * The type of an item which is also the name of the respective rioglyph icon without the prefix
      * `rioglyph-`.
      */
     type: string;
     /**
-     * The sub type of an item which is also the name of the respective rioplyph icon without the prefix.
+     * The sub type of an item which is also the name of the respective rioglyph icon without the prefix.
      * This could be used to show a secondary paired icon like for fuel type.
      */
     subType?: string;

package/lib/es/components/assetTree/Tree.js

@@ -43,7 +43,7 @@ const filterProps = (0, omit_1.default)([
 ]);
 const customCompare = (prevProps, nextProps) => (0, isEqual_1.default)(filterProps(prevProps), filterProps(nextProps));
 const Tree = react_1.default.memo((props) => {
-    const { groups = [], items = [], selectedGroups = [], selectedItems = [], onSelectionChange = noop_1.default, hasMultiselect = true, showRadioButtons = false, hideSearch = false, hideTreeHead, treeHeaderContent, summary, hideSummary = false, search, searchPlaceholder = 'Type here to filter by name', onSearchChange = noop_1.default, className, scrollHeight, expandedGroups, onExpandGroupsChange = noop_1.default, showEmptyGroups = true, treeOptions = [], treeOptionsTooltip, disableAnimation = false } = props, remainingProps = tslib_1.__rest(props, ["groups", "items", "selectedGroups", "selectedItems", "onSelectionChange", "hasMultiselect", "showRadioButtons", "hideSearch", "hideTreeHead", "treeHeaderContent", "summary", "hideSummary", "search", "searchPlaceholder", "onSearchChange", "className", "scrollHeight", "expandedGroups", "onExpandGroupsChange", "showEmptyGroups", "treeOptions", "treeOptionsTooltip", "disableAnimation"]);
+    const { groups = [], items = [], selectedGroups = [], selectedItems = [], onSelectionChange = noop_1.default, hasMultiselect = true, showRadioButtons = false, hideSearch = false, hideTreeHead, treeHeaderContent, summary, hideSummary = false, search, searchPlaceholder = 'Type here to filter by name', onSearchChange = noop_1.default, className, scrollHeight, expandedGroups, onExpandGroupsChange = noop_1.default, showEmptyGroups = true, treeOptions = [], treeOptionsTooltip, disableAnimation = false, ...remainingProps } = props;
     const [state, dispatch] = (0, react_1.useReducer)(treeReducer_1.treeReducer, {
         groupedItems: [],
         flatItems: [],
@@ -123,7 +123,7 @@ const Tree = react_1.default.memo((props) => {
     };
     const handleToggleNode = (nodeId) => {
         const nodeContainer = getNodeContainerDomElementById(nodeId);
-        if (!(internalExpandedGroups === null || internalExpandedGroups === void 0 ? void 0 : internalExpandedGroups.current) || !nodeContainer) {
+        if (!internalExpandedGroups?.current || !nodeContainer) {
             return;
         }
         const openGroups = internalExpandedGroups.current;
@@ -141,8 +141,7 @@ const Tree = react_1.default.memo((props) => {
         onExpandGroupsChange(newExpandedNodes);
     };
     const getNodeContainerDomElementById = (nodeId) => {
-        var _a;
-        return (_a = treeRef === null || treeRef === void 0 ? void 0 : treeRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(`.TreeNodeContainer[data-id="${nodeId}"]`);
+        return treeRef?.current?.querySelector(`.TreeNodeContainer[data-id="${nodeId}"]`);
     };
     const selectAllSearchResultItems = (shouldSelect) => selectAllFlatItems(shouldSelect);
     const handleSelectAll = (shouldSelect, isStateIndeterminate) => {
@@ -172,7 +171,7 @@ const Tree = react_1.default.memo((props) => {
             : (0, treeUtils_1.excludeFromList)(selectedGroups, groupId);
         // deselect all items of a node since they will be selected inherently via the group itself
         const itemsInGroup = (0, find_1.default)((entry) => entry.id === groupId)(state.groupedItems);
-        const itemIdsOfGroup = (0, map_1.default)((item) => item.id)(itemsInGroup === null || itemsInGroup === void 0 ? void 0 : itemsInGroup.items);
+        const itemIdsOfGroup = (0, map_1.default)((item) => item.id)(itemsInGroup?.items);
         const updatedSelectedItems = (0, without_1.default)(itemIdsOfGroup, selectedItems);
         // check if all groups are selected to change the state of TreeSelectAll
         const groupAmount = groups.length;
@@ -231,14 +230,13 @@ const Tree = react_1.default.memo((props) => {
             return (0, jsx_runtime_1.jsx)(TreeNothingFound_1.default, {});
         }
         const result = (0, map_1.default)((group) => {
-            var _a, _b;
             const groupId = group.id;
             const groupItems = group.items;
-            const isOpen = (_b = (_a = internalExpandedGroups.current) === null || _a === void 0 ? void 0 : _a.includes(groupId)) !== null && _b !== void 0 ? _b : false;
+            const isOpen = internalExpandedGroups.current?.includes(groupId) ?? false;
             const numSelectedGroupItems = (0, filter_1.default)((0, treeUtils_1.containsItemById)(selectedItems))(groupItems).length;
             const isGroupSelected = selectedGroups.includes(groupId);
             const isStateIndeterminate = !isGroupSelected && numSelectedGroupItems > 0;
-            return ((0, jsx_runtime_1.jsxs)(TreeNodeContainer_1.default, Object.assign({ groupId: groupId, isOpen: isOpen, disableAnimation: disableAnimation }, { children: [(0, jsx_runtime_1.jsx)(TreeNode_1.default, { node: group, hasMultiselect: hasMultiselect, onToggleNode: handleToggleNode, onSelect: handleGroupSelection, isSelected: isGroupSelected, isIndeterminate: isStateIndeterminate }), (0, jsx_runtime_1.jsx)(TreeLeafList_1.default, { leafList: groupItems, hasMultiselect: hasMultiselect, showRadioButtons: showRadioButtons, selectedItems: selectedItems, selectedGroups: selectedGroups, onSelectionChange: respondSelection })] }), groupId));
+            return ((0, jsx_runtime_1.jsxs)(TreeNodeContainer_1.default, { groupId: groupId, isOpen: isOpen, disableAnimation: disableAnimation, children: [(0, jsx_runtime_1.jsx)(TreeNode_1.default, { node: group, hasMultiselect: hasMultiselect, onToggleNode: handleToggleNode, onSelect: handleGroupSelection, isSelected: isGroupSelected, isIndeterminate: isStateIndeterminate }), (0, jsx_runtime_1.jsx)(TreeLeafList_1.default, { leafList: groupItems, hasMultiselect: hasMultiselect, showRadioButtons: showRadioButtons, selectedItems: selectedItems, selectedGroups: selectedGroups, onSelectionChange: respondSelection })] }, groupId));
         })(groupedItems);
         return result;
     };
@@ -246,7 +244,7 @@ const Tree = react_1.default.memo((props) => {
         const { flatItems } = state;
         const hasLeafs = (0, isEmpty_1.default)(flatItems);
         const getLeafs = () => ((0, jsx_runtime_1.jsx)(TreeLeafList_1.default, { leafList: flatItems, hasMultiselect: hasMultiselect, showRadioButtons: showRadioButtons, selectedItems: selectedItems, selectedGroups: selectedGroups, onSelectionChange: respondSelection }));
-        return ((0, jsx_runtime_1.jsx)(TreeNodeContainer_1.default, Object.assign({ disableAnimation: disableAnimation, isOpen: true }, { children: hasLeafs ? (0, jsx_runtime_1.jsx)(TreeNothingFound_1.default, {}) : getLeafs() })));
+        return ((0, jsx_runtime_1.jsx)(TreeNodeContainer_1.default, { disableAnimation: disableAnimation, isOpen: true, children: hasLeafs ? (0, jsx_runtime_1.jsx)(TreeNothingFound_1.default, {}) : getLeafs() }));
     };
     const hasExternalGroups = (0, treeUtils_1.notEmpty)(groups);
     const hasInternalSearchValue = () => (0, treeUtils_1.notEmpty)(state.searchValue);
@@ -278,8 +276,8 @@ const Tree = react_1.default.memo((props) => {
     const showSearch = !hideSearch;
     const showSummary = !hideSummary;
     const hasCustomSearch = !(0, isNil_1.default)(search);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { className: treeClassNames, ref: treeRef }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'TreeHeader' }, { children: [treeHeaderContent, showSearch && !hasCustomSearch && ((0, jsx_runtime_1.jsx)(TreeSearch_1.default, { value: state.searchValue, onChange: handleSearchChange, placeholder: searchPlaceholder })), hasCustomSearch && search, showTreeHead && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: treeHeadClasses }, { children: [showSelectAll && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'border border-right-only hidden-empty padding-right-10 margin-right-2' }, { children: (0, jsx_runtime_1.jsx)(TreeSelectAll_1.default, { isChecked: state.allChecked, isEnabled: hasMultiselect, isIndeterminate: isIndeterminate, onSelect: handleSelectAll }) }))), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'display-flex justify-content-between align-items-start width-100pct' }, { children: showSummary
+    return ((0, jsx_runtime_1.jsxs)("div", { ...remainingProps, className: treeClassNames, ref: treeRef, children: [(0, jsx_runtime_1.jsxs)("div", { className: 'TreeHeader', children: [treeHeaderContent, showSearch && !hasCustomSearch && ((0, jsx_runtime_1.jsx)(TreeSearch_1.default, { value: state.searchValue, onChange: handleSearchChange, placeholder: searchPlaceholder })), hasCustomSearch && search, showTreeHead && ((0, jsx_runtime_1.jsxs)("div", { className: treeHeadClasses, children: [showSelectAll && ((0, jsx_runtime_1.jsx)("div", { className: 'border border-right-only hidden-empty padding-right-10 margin-right-2', children: (0, jsx_runtime_1.jsx)(TreeSelectAll_1.default, { isChecked: state.allChecked, isEnabled: hasMultiselect, isIndeterminate: isIndeterminate, onSelect: handleSelectAll }) })), (0, jsx_runtime_1.jsx)("div", { className: 'display-flex justify-content-between align-items-start width-100pct', children: showSummary
                                     ? summary || ((0, jsx_runtime_1.jsx)(TreeSummary_1.default, { children: (0, map_1.default)((typeCounter) => ((0, jsx_runtime_1.jsx)(TypeCounter_1.default, { type: typeCounter, icon: `${typeCounter}`, value: state.assetCounts[typeCounter], onClick: handleFilterByType, isActive: state.typeFilter.includes(typeCounter), hasFilter: isFilterActive, enableActivity: enableActivity }, typeCounter)))(state.visibleTypeCounters) }))
-                                    : null })), (0, jsx_runtime_1.jsx)(TreeOptions_1.default, { treeOptions: treeOptions, treeOptionsTooltip: treeOptionsTooltip })] })))] })), (0, jsx_runtime_1.jsx)(TreeRoot_1.default, Object.assign({ maxHeight: scrollHeight, disableAnimation: disableAnimation }, { children: content }))] })));
+                                    : null }), (0, jsx_runtime_1.jsx)(TreeOptions_1.default, { treeOptions: treeOptions, treeOptionsTooltip: treeOptionsTooltip })] }))] }), (0, jsx_runtime_1.jsx)(TreeRoot_1.default, { maxHeight: scrollHeight, disableAnimation: disableAnimation, children: content })] }));
 }, customCompare);
 exports.default = Tree;

package/lib/es/components/assetTree/TreeLeaf.js

@@ -11,6 +11,6 @@ const RadioButton_1 = tslib_1.__importDefault(require("../radiobutton/RadioButto
 const TreeLeaf = react_1.default.memo((props) => {
     const { item, hasMultiselect, showRadioButtons, isSelected, onSelectItem, onActiveItem } = props;
     const treeNodeClassNames = (0, classnames_1.default)('TreeLeaf', 'form-group margin-bottom-0', isSelected && 'active', item.className && item.className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: treeNodeClassNames, "data-key": item.id }, { children: [hasMultiselect && (0, jsx_runtime_1.jsx)(Checkbox_1.default, { className: 'TreeCheckbox', checked: isSelected, onClick: onSelectItem }), !hasMultiselect && showRadioButtons && ((0, jsx_runtime_1.jsx)(RadioButton_1.default, { className: 'TreeRadioButton', checked: isSelected, onChange: onSelectItem })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: 'TreeLabel TreeLabelName', onClick: onActiveItem }, { children: [!item.subType && (0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${item.type}` }), item.subType && ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: 'rioglyph-icon-pair' }, { children: [(0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${item.type}` }), (0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${item.subType}` })] }))), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: 'TreeLabelNameText' }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'TreeLabelNameTextHeadline' }, { children: (0, isObject_1.default)(item.name) ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'text-light margin-right-3' }, { children: item.name.firstName })), (0, jsx_runtime_1.jsx)("span", { children: item.name.lastName })] })) : (item.name) })), item.info && (0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'TreeLabelNameTextSubline' }, { children: item.info }))] }))] }))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: treeNodeClassNames, "data-key": item.id, children: [hasMultiselect && (0, jsx_runtime_1.jsx)(Checkbox_1.default, { className: 'TreeCheckbox', checked: isSelected, onClick: onSelectItem }), !hasMultiselect && showRadioButtons && ((0, jsx_runtime_1.jsx)(RadioButton_1.default, { className: 'TreeRadioButton', checked: isSelected, onChange: onSelectItem })), (0, jsx_runtime_1.jsxs)("span", { className: 'TreeLabel TreeLabelName', onClick: onActiveItem, children: [!item.subType && (0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${item.type}` }), item.subType && ((0, jsx_runtime_1.jsxs)("span", { className: 'rioglyph-icon-pair', children: [(0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${item.type}` }), (0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${item.subType}` })] })), (0, jsx_runtime_1.jsxs)("span", { className: 'TreeLabelNameText', children: [(0, jsx_runtime_1.jsx)("span", { className: 'TreeLabelNameTextHeadline', children: (0, isObject_1.default)(item.name) ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: 'text-light margin-right-3', children: item.name.firstName }), (0, jsx_runtime_1.jsx)("span", { children: item.name.lastName })] })) : (item.name) }), item.info && (0, jsx_runtime_1.jsx)("span", { className: 'TreeLabelNameTextSubline', children: item.info })] })] })] }));
 });
 exports.default = TreeLeaf;

package/lib/es/components/assetTree/TreeLeafList.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const TreeLeaf_1 = tslib_1.__importDefault(require("./TreeLeaf"));
 const treeUtils_1 = require("./treeUtils");
 const TreeLeafList = (props) => {

package/lib/es/components/assetTree/TreeNode.js

@@ -9,6 +9,6 @@ const TreeNode = react_1.default.memo((props) => {
     const { node, hasMultiselect = false, isSelected = false, isIndeterminate = false, onToggleNode, onSelect } = props;
     const treeNodeClassNames = (0, classnames_1.default)('TreeNode', 'from-group', isSelected && 'checked', node.className && node.className);
     const hasChildren = !!node.items.length;
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: treeNodeClassNames, "data-key": node.id, onClick: () => hasChildren && onToggleNode(node.id) }, { children: [hasMultiselect && ((0, jsx_runtime_1.jsx)(Checkbox_1.default, { className: 'TreeCheckbox', checked: isSelected, disabled: node.disabled, indeterminate: isIndeterminate, onClick: () => onSelect(node, isIndeterminate) })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: 'TreeLabel TreeLabelName' }, { children: [node.icon && (0, jsx_runtime_1.jsx)("span", { className: `rioglyph ${node.icon}` }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'TreeLabelNameText' }, { children: (0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'TreeLabelNameTextHeadline' }, { children: node.name })) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'TreeLabelCount label label-muted label-filled label-condensed' }, { children: node.items.length })), (0, jsx_runtime_1.jsx)("span", { className: `TreeLabelExpander rioglyph rioglyph-chevron-down ${hasChildren ? '' : 'text-color-light'}` })] }))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: treeNodeClassNames, "data-key": node.id, onClick: () => hasChildren && onToggleNode(node.id), children: [hasMultiselect && ((0, jsx_runtime_1.jsx)(Checkbox_1.default, { className: 'TreeCheckbox', checked: isSelected, disabled: node.disabled, indeterminate: isIndeterminate, onClick: () => onSelect(node, isIndeterminate) })), (0, jsx_runtime_1.jsxs)("span", { className: 'TreeLabel TreeLabelName', children: [node.icon && (0, jsx_runtime_1.jsx)("span", { className: `rioglyph ${node.icon}` }), (0, jsx_runtime_1.jsx)("span", { className: 'TreeLabelNameText', children: (0, jsx_runtime_1.jsx)("span", { className: 'TreeLabelNameTextHeadline', children: node.name }) }), (0, jsx_runtime_1.jsx)("span", { className: 'TreeLabelCount label label-muted label-filled label-condensed', children: node.items.length }), (0, jsx_runtime_1.jsx)("span", { className: `TreeLabelExpander rioglyph rioglyph-chevron-down ${hasChildren ? '' : 'text-color-light'}` })] })] }));
 });
 exports.default = TreeNode;

package/lib/es/components/assetTree/TreeNodeContainer.js

@@ -2,12 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const TreeNodeContainer = (props) => {
     const { isOpen, groupId, disableAnimation, children } = props;
     const treeNodeContainerClasses = (0, classnames_1.default)('TreeNodeContainer', 'user-select-none overflow-hidden', isOpen && 'open');
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: treeNodeContainerClasses, "data-id": groupId }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: treeNodeContainerClasses, "data-id": groupId, children: children }));
 };
 exports.default = TreeNodeContainer;

package/lib/es/components/assetTree/TreeNothingFound.js

@@ -4,7 +4,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
 const TreeNothingFound = react_1.default.memo((props) => {
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `TreeTreeNothingFound display-flex justify-content-center text-size-20
-                padding-top-25 margin-top-25 margin-bottom-25` }, { children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-looking-glass-man text-size-400pct text-color-light' }) })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: `TreeTreeNothingFound display-flex justify-content-center text-size-20
+                padding-top-25 margin-top-25 margin-bottom-25`, children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-looking-glass-man text-size-400pct text-color-light' }) }));
 });
 exports.default = TreeNothingFound;

package/lib/es/components/assetTree/TreeOption.js

@@ -2,14 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
 const Switch_1 = tslib_1.__importDefault(require("../switch/Switch"));
 const TreeOption = (props) => {
-    const { isChecked = false, className, label, onChange = noop_1.default } = props, remainingProps = tslib_1.__rest(props, ["isChecked", "className", "label", "onChange"]);
+    const { isChecked = false, className, label, onChange = noop_1.default, ...remainingProps } = props;
     const optionClasses = (0, classnames_1.default)('TreeOption', 'display-flex', 'justify-content-start', 'align-items-center', 'gap-10', 'cursor-pointer', className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { className: optionClasses, onClick: onChange }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'flex-1-1' }, { children: label })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'pointer-events-none scale-80' }, { children: (0, jsx_runtime_1.jsx)(Switch_1.default, { keyName: 'TreeOption-switch', checked: isChecked }) }))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { ...remainingProps, className: optionClasses, onClick: onChange, children: [(0, jsx_runtime_1.jsx)("span", { className: 'flex-1-1', children: label }), (0, jsx_runtime_1.jsx)("span", { className: 'pointer-events-none scale-80', children: (0, jsx_runtime_1.jsx)(Switch_1.default, { keyName: 'TreeOption-switch', checked: isChecked }) })] }));
 };
 exports.default = TreeOption;

package/lib/es/components/assetTree/TreeOptions.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const lodash_1 = require("lodash");
 const ButtonDropdown_1 = tslib_1.__importDefault(require("../dropdown/ButtonDropdown"));
@@ -14,10 +12,10 @@ const TreeOptions = (props) => {
         return null;
     }
     const dropdownClasses = (0, classnames_1.default)('display-flex flex-column gap-10', 'width-250', 'padding-15', className);
-    const customDropdown = (0, jsx_runtime_1.jsx)("div", Object.assign({ className: dropdownClasses }, { children: treeOptions }));
+    const customDropdown = (0, jsx_runtime_1.jsx)("div", { className: dropdownClasses, children: treeOptions });
     const dropdown = ((0, jsx_runtime_1.jsx)(ButtonDropdown_1.default, { title: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-option-vertical', "aria-hidden": 'true' }), bsStyle: 'default', bsSize: 'sm', customDropdown: customDropdown, toggleClassName: 'hover-bg-white border-none text-color-gray hover-text-color-dark', className: 'TreeHeaderOptions height-20', pullRight: true, iconOnly: true }));
     if (treeOptionsTooltip) {
-        return ((0, jsx_runtime_1.jsx)(SimpleTooltip_1.default, Object.assign({ content: treeOptionsTooltip, placement: 'bottom-end', delay: { show: 1000, hide: 0 }, popperConfig: {
+        return ((0, jsx_runtime_1.jsx)(SimpleTooltip_1.default, { content: treeOptionsTooltip, placement: 'bottom-end', delay: { show: 1000, hide: 0 }, popperConfig: {
                 modifiers: [
                     {
                         name: 'offset',
@@ -30,7 +28,7 @@ const TreeOptions = (props) => {
                         options: {},
                     },
                 ],
-            } }, { children: (0, jsx_runtime_1.jsx)("div", { children: dropdown }) })));
+            }, children: (0, jsx_runtime_1.jsx)("div", { children: dropdown }) }));
     }
     return dropdown;
 };

package/lib/es/components/assetTree/TreeRoot.js

@@ -2,14 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const react_1 = require("@formkit/auto-animate/react");
 const TreeRoot = ({ maxHeight, disableAnimation, children }) => {
     const treeRootClasses = (0, classnames_1.default)('TreeRoot', 'user-select-none', maxHeight ? 'overflow-auto' : 'overflow-hidden');
     const [parent, enableAnimations] = (0, react_1.useAutoAnimate)();
     enableAnimations(!disableAnimation);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: parent, className: treeRootClasses, style: { maxHeight } }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: parent, className: treeRootClasses, style: { maxHeight }, children: children }));
 };
 exports.default = TreeRoot;

package/lib/es/components/assetTree/TreeSearch.js

@@ -10,6 +10,6 @@ const ClearableInput_1 = tslib_1.__importDefault(require("../clearableInput/Clea
 const TreeSearch = react_1.default.memo((props) => {
     const { value, className, placeholder, onChange = noop_1.default } = props;
     const classes = (0, classnames_1.default)('TreeSearch', className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'input-group flex-1-0' }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'input-group-addon' }, { children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-search', "aria-hidden": 'true' }) })), (0, jsx_runtime_1.jsx)(ClearableInput_1.default, { value: value, onChange: onChange, placeholder: placeholder })] })) })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: classes, children: (0, jsx_runtime_1.jsxs)("div", { className: 'input-group flex-1-0', children: [(0, jsx_runtime_1.jsx)("span", { className: 'input-group-addon', children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-search', "aria-hidden": 'true' }) }), (0, jsx_runtime_1.jsx)(ClearableInput_1.default, { value: value, onChange: onChange, placeholder: placeholder })] }) }));
 });
 exports.default = TreeSearch;

package/lib/es/components/assetTree/TreeSelectAll.js

@@ -2,14 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
 const Checkbox_1 = tslib_1.__importDefault(require("../checkbox/Checkbox"));
 const TreeSelectAll = (props) => {
     const { isDisabled, isChecked = false, isEnabled = true, isIndeterminate = false, hasSearchResults = false, // needed?
     onSelect = noop_1.default, } = props;
     const handleSelectAll = (event) => onSelect(event.target.checked, isIndeterminate);
-    return isEnabled ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'TreeSelectAll display-flex align-items-center' }, { children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { checked: isChecked, onClick: handleSelectAll, disabled: isDisabled, indeterminate: isIndeterminate, className: 'margin-top--1' }) }))) : null;
+    return isEnabled ? ((0, jsx_runtime_1.jsx)("div", { className: 'TreeSelectAll display-flex align-items-center', children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { checked: isChecked, onClick: handleSelectAll, disabled: isDisabled, indeterminate: isIndeterminate, className: 'margin-top--1' }) })) : null;
 };
 exports.default = TreeSelectAll;

package/lib/es/components/assetTree/TreeSidebar.js

@@ -7,8 +7,8 @@ const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const TreeSidebarCategories_1 = tslib_1.__importDefault(require("./TreeSidebarCategories"));
 const TreeSidebar = react_1.default.memo((props) => {
-    const { className, onClick = noop_1.default } = props, remainingProps = tslib_1.__rest(props, ["className", "onClick"]);
+    const { className, onClick = noop_1.default, ...remainingProps } = props;
     const classes = (0, classnames_1.default)('TreeSidebar', className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: classes }, { children: [(0, jsx_runtime_1.jsx)("ul", Object.assign({ className: 'TreeSidebarNavigation', onClick: onClick }, { children: (0, jsx_runtime_1.jsx)(TreeSidebarCategories_1.default, Object.assign({}, remainingProps)) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'TreeSidebarToggle', onClick: onClick }, { children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-chevron-left' }) }))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: classes, children: [(0, jsx_runtime_1.jsx)("ul", { className: 'TreeSidebarNavigation', onClick: onClick, children: (0, jsx_runtime_1.jsx)(TreeSidebarCategories_1.default, { ...remainingProps }) }), (0, jsx_runtime_1.jsx)("div", { className: 'TreeSidebarToggle', onClick: onClick, children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-chevron-left' }) })] }));
 });
 exports.default = TreeSidebar;

package/lib/es/components/assetTree/TreeSidebarCategories.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
 const OverlayTrigger_1 = tslib_1.__importDefault(require("../overlay/OverlayTrigger"));
@@ -25,10 +23,10 @@ const TreeSidebarCategories = (props) => {
                 event.stopPropagation();
                 onSelectCategory(id);
             };
-            const category = ((0, jsx_runtime_1.jsx)("li", Object.assign({ onClick: handleSelectCategory, className: statusClassName }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'selection-bubble' }, { children: (0, jsx_runtime_1.jsx)("span", { className: `rioglyph ${icon}` }) })) }), id));
+            const category = ((0, jsx_runtime_1.jsx)("li", { onClick: handleSelectCategory, className: statusClassName, children: (0, jsx_runtime_1.jsx)("div", { className: 'selection-bubble', children: (0, jsx_runtime_1.jsx)("span", { className: `rioglyph ${icon}` }) }) }, id));
             if (label) {
                 const tooltip = (0, jsx_runtime_1.jsx)("span", { children: label });
-                return ((0, jsx_runtime_1.jsx)(OverlayTrigger_1.default, Object.assign({ placement: Tooltip_1.default.RIGHT, delay: { show: TOOLTIP_DELAY, hide: 0 }, overlay: (0, jsx_runtime_1.jsx)(Tooltip_1.default, Object.assign({ id: 'tooltip', width: 'auto' }, { children: tooltip })) }, { children: category }), `category-tooltip-${id}`));
+                return ((0, jsx_runtime_1.jsx)(OverlayTrigger_1.default, { placement: Tooltip_1.default.RIGHT, delay: { show: TOOLTIP_DELAY, hide: 0 }, overlay: (0, jsx_runtime_1.jsx)(Tooltip_1.default, { id: 'tooltip', width: 'auto', children: tooltip }), children: category }, `category-tooltip-${id}`));
             }
             return category;
         }) }));

package/lib/es/components/assetTree/TreeSummary.js

@@ -14,6 +14,6 @@ const DefaultAssetCounts = ({ assetCounts }) => {
 const TreeSummary = react_1.default.memo((props) => {
     const { className = '', assetCounts = {}, gridCols, children } = props;
     const classes = (0, classnames_1.default)('TreeSummary', 'display-flex flex-wrap', 'align-items-center', 'gap-10', 'padding-left-3', className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes }, { children: children || ((0, jsx_runtime_1.jsx)(TreeSummaryRow_1.default, Object.assign({ gridCols: gridCols }, { children: (0, jsx_runtime_1.jsx)(DefaultAssetCounts, { assetCounts: assetCounts }) }))) })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: classes, children: children || ((0, jsx_runtime_1.jsx)(TreeSummaryRow_1.default, { gridCols: gridCols, children: (0, jsx_runtime_1.jsx)(DefaultAssetCounts, { assetCounts: assetCounts }) })) }));
 });
 exports.default = TreeSummary;

package/lib/es/components/assetTree/TreeSummaryRow.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TreeSummaryRow = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
-const TreeSummaryRow = ({ gridCols = 4, children }) => ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `TreeSummaryRow display-grid grid-cols-${gridCols} gap-10` }, { children: children })));
+const TreeSummaryRow = ({ gridCols = 4, children }) => ((0, jsx_runtime_1.jsx)("div", { className: `TreeSummaryRow display-grid grid-cols-${gridCols} gap-10`, children: children }));
 exports.TreeSummaryRow = TreeSummaryRow;
 exports.default = exports.TreeSummaryRow;

package/lib/es/components/assetTree/TypeCounter.js

@@ -9,7 +9,7 @@ const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
 const useHover_1 = tslib_1.__importDefault(require("../../hooks/useHover"));
 const mergeRefs_1 = tslib_1.__importDefault(require("../../utils/mergeRefs"));
 const TypeCounter = (0, react_1.forwardRef)((props, ref) => {
-    const { icon, value, isActive, hasFilter = false, enableActivity = false, onClick = noop_1.default, type, hideOnZero = false } = props, remainingProps = tslib_1.__rest(props, ["icon", "value", "isActive", "hasFilter", "enableActivity", "onClick", "type", "hideOnZero"]);
+    const { icon, value, isActive, hasFilter = false, enableActivity = false, onClick = noop_1.default, type, hideOnZero = false, ...remainingProps } = props;
     const internalRef = (0, react_1.useRef)(null);
     const mergedRef = (0, mergeRefs_1.default)([ref, internalRef]);
     const isHover = (0, useHover_1.default)(internalRef);
@@ -19,6 +19,6 @@ const TypeCounter = (0, react_1.forwardRef)((props, ref) => {
     if (hideOnZero && !value) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: mergedRef }, remainingProps, { className: wrapperClassName, onClick: handleClick }, { children: [(0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${icon} text-size-16 margin-right-2` }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: counterClassNames }, { children: value || 0 }))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: mergedRef, ...remainingProps, className: wrapperClassName, onClick: handleClick, children: [(0, jsx_runtime_1.jsx)("span", { className: `rioglyph rioglyph-${icon} text-size-16 margin-right-2` }), (0, jsx_runtime_1.jsx)("span", { className: counterClassNames, children: value || 0 })] }));
 });
 exports.default = TypeCounter;

package/lib/es/components/assetTree/treeReducer.js

@@ -25,21 +25,21 @@ exports.emptyGroupsChanged = emptyGroupsChanged;
 const treeReducer = (state, action) => {
     switch (action.type) {
         case 'assetCounted':
-            return Object.assign(Object.assign({}, state), { assetCounts: action.payload });
+            return { ...state, assetCounts: action.payload };
         case 'allCheckedChanged':
-            return Object.assign(Object.assign({}, state), { allChecked: action.payload });
+            return { ...state, allChecked: action.payload };
         case 'searchValueChanged':
-            return Object.assign(Object.assign({}, state), { searchValue: action.payload, allChecked: false });
+            return { ...state, searchValue: action.payload, allChecked: false };
         case 'flatItemsChanged':
-            return Object.assign(Object.assign({}, state), { flatItems: action.payload });
+            return { ...state, flatItems: action.payload };
         case 'groupedItemsChanged':
-            return Object.assign(Object.assign({}, state), { groupedItems: action.payload });
+            return { ...state, groupedItems: action.payload };
         case 'typeFilterChanged':
-            return Object.assign(Object.assign({}, state), { typeFilter: action.payload });
+            return { ...state, typeFilter: action.payload };
         case 'visibleTypeCountersChanged':
-            return Object.assign(Object.assign({}, state), { visibleTypeCounters: action.payload });
+            return { ...state, visibleTypeCounters: action.payload };
         case 'emptyGroupsChanged':
-            return Object.assign(Object.assign({}, state), { emptyGroups: action.payload });
+            return { ...state, emptyGroups: action.payload };
         default:
             (0, tiny_invariant_1.default)(false, 'Unknown action type in tree reducer');
     }

package/lib/es/components/assetTree/treeUtils.d.ts

@@ -1,5 +1,3 @@
-/// <reference types="lodash" />
-/// <reference types="lodash" />
 import type { TreeItem, TreeGroup, GroupedItems } from './Tree';
 export declare const notEqual: (value: any, other: any) => boolean;
 export declare const notEmpty: (value?: any) => boolean;

package/lib/es/components/assetTree/treeUtils.js

@@ -34,12 +34,9 @@ const getFullName = (item) => `${item.name.firstName} ${item.name.lastName}`;
 exports.getFullName = getFullName;
 const getName = (item) => (isNameObject(item) ? (0, exports.getFullName)(item) : item.name);
 const orderByName = (0, orderBy_1.default)([
-    (item) => {
-        var _a;
-        return isNameObject(item)
-            ? item.name.lastName.toLowerCase()
-            : ((_a = item.name.toLowerCase()) !== null && _a !== void 0 ? _a : '');
-    },
+    (item) => isNameObject(item)
+        ? item.name.lastName.toLowerCase()
+        : (item.name.toLowerCase() ?? ''),
 ], ['asc']);
 // TODO: extend to use provided external search function instead?
 const filterByName = (searchValue) => (item) => {
@@ -60,25 +57,31 @@ const sortGroupsByName = (groups) => {
     const sortableGroups = {};
     (0, mapValues_1.default)((group) => {
         if (group.position === 'last') {
-            fixedGroups[group.id] = Object.assign({}, group);
+            fixedGroups[group.id] = { ...group };
         }
         else {
-            sortableGroups[group.id] = Object.assign({}, group);
+            sortableGroups[group.id] = { ...group };
         }
     })(groups);
     const sortedGroups = orderByName(sortableGroups);
-    return (0, isEmpty_1.default)(fixedGroups) ? sortedGroups : Object.assign(Object.assign({}, sortedGroups), fixedGroups);
+    return (0, isEmpty_1.default)(fixedGroups) ? sortedGroups : { ...sortedGroups, ...fixedGroups };
 };
 exports.sortGroupsByName = sortGroupsByName;
 const sortGroupItemsByName = (groups) => {
-    return (0, mapValues_1.default)((group) => (Object.assign(Object.assign({}, group), { items: orderByName(group.items) })))(groups);
+    return (0, mapValues_1.default)((group) => ({
+        ...group,
+        items: orderByName(group.items),
+    }))(groups);
 };
 exports.sortGroupItemsByName = sortGroupItemsByName;
 const getMappedItemsToGroups = (groups, items) => {
     const mappedGroups = {};
     // build an object for listing the groups by id
     groups.forEach(group => {
-        mappedGroups[group.id] = Object.assign(Object.assign({}, group), { items: [] });
+        mappedGroups[group.id] = {
+            ...group,
+            items: [],
+        };
     });
     items.forEach(item => {
         // add items to the respective group