@salutejs/plasma-new-hope 0.336.0-canary.2214.17542835950.0 → 0.336.0-canary.2216.17578968860.0

package/styled-components/cjs/components/Dropdown/Dropdown.js

@@ -176,7 +176,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 var dropdownRoot = function(Root) {
     return /*#__PURE__*/ (0, _react.forwardRef)(function(_param, ref) {
-        var items = _param.items, children = _param.children, placement = _param.placement, offset = _param.offset, _param_closeOnOverlayClick = _param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, onToggle = _param.onToggle, size = _param.size, view = _param.view, _param_itemRole = _param.itemRole, itemRole = _param_itemRole === void 0 ? 'treeitem' : _param_itemRole, className = _param.className, listMaxHeight = _param.listMaxHeight, listWidth = _param.listWidth, listHeight = _param.listHeight, listOverflow = _param.listOverflow, _param_closeOnSelect = _param.closeOnSelect, closeOnSelect = _param_closeOnSelect === void 0 ? true : _param_closeOnSelect, onHover = _param.onHover, onItemSelect = _param.onItemSelect, onItemClick = _param.onItemClick, _param_trigger = _param.trigger, trigger = _param_trigger === void 0 ? 'click' : _param_trigger, _param_openByRightClick = _param.openByRightClick, openByRightClick = _param_openByRightClick === void 0 ? false : _param_openByRightClick, _param_variant = _param.variant, variant = _param_variant === void 0 ? 'normal' : _param_variant, _param_hasArrow = _param.hasArrow, hasArrow = _param_hasArrow === void 0 ? true : _param_hasArrow, _param_alwaysOpened = _param.alwaysOpened, alwaysOpened = _param_alwaysOpened === void 0 ? false : _param_alwaysOpened, portal = _param.portal, renderItem = _param.renderItem, zIndex = _param.zIndex, beforeList = _param.beforeList, afterList = _param.afterList, rest = _object_without_properties(_param, [
+        var items = _param.items, children = _param.children, placement = _param.placement, offset = _param.offset, _param_closeOnOverlayClick = _param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, onToggle = _param.onToggle, size = _param.size, view = _param.view, _param_itemRole = _param.itemRole, itemRole = _param_itemRole === void 0 ? 'treeitem' : _param_itemRole, className = _param.className, listMaxHeight = _param.listMaxHeight, listWidth = _param.listWidth, listHeight = _param.listHeight, _param_closeOnSelect = _param.closeOnSelect, closeOnSelect = _param_closeOnSelect === void 0 ? true : _param_closeOnSelect, onHover = _param.onHover, onItemSelect = _param.onItemSelect, onItemClick = _param.onItemClick, _param_trigger = _param.trigger, trigger = _param_trigger === void 0 ? 'click' : _param_trigger, _param_openByRightClick = _param.openByRightClick, openByRightClick = _param_openByRightClick === void 0 ? false : _param_openByRightClick, _param_variant = _param.variant, variant = _param_variant === void 0 ? 'normal' : _param_variant, _param_hasArrow = _param.hasArrow, hasArrow = _param_hasArrow === void 0 ? true : _param_hasArrow, _param_alwaysOpened = _param.alwaysOpened, alwaysOpened = _param_alwaysOpened === void 0 ? false : _param_alwaysOpened, portal = _param.portal, renderItem = _param.renderItem, zIndex = _param.zIndex, beforeList = _param.beforeList, afterList = _param.afterList, rest = _object_without_properties(_param, [
             "items",
             "children",
             "placement",
@@ -190,7 +190,6 @@ var dropdownRoot = function(Root) {
             "listMaxHeight",
             "listWidth",
             "listHeight",
-            "listOverflow",
             "closeOnSelect",
             "onHover",
             "onItemSelect",
@@ -216,6 +215,7 @@ var dropdownRoot = function(Root) {
         var _useHashMaps1 = _sliced_to_array((0, _useHashMaps.useHashMaps)(items), 2), pathMap = _useHashMaps1[0], focusedToValueMap = _useHashMaps1[1];
         var activeDescendantItemValue = ((_getItemByFocused = (0, _utils2.getItemByFocused)(focusedPath, focusedToValueMap)) === null || _getItemByFocused === void 0 ? void 0 : _getItemByFocused.value) || '';
         var floatingPopoverRef = (0, _react.useRef)(null);
+        var listWrapperRef = (0, _react.useRef)(null);
         var treeId = (0, _utils.safeUseId)();
         // Логика работы при клике за пределами выпадающего списка
         var targetRef = (0, _hooks.useOutsideClick)(function(event) {
@@ -309,17 +309,14 @@ var dropdownRoot = function(Root) {
             className: (0, _utils1.cx)(className, _Dropdowntokens.classes.dropdownRoot),
             ref: ref,
             view: view,
-            size: size,
-            style: {
-                display: 'inline-block'
-            }
+            size: size
         }, rest), /*#__PURE__*/ _react.default.createElement(_Dropdownstyles.ListWrapper, {
+            ref: listWrapperRef,
             listWidth: listWidth
         }, /*#__PURE__*/ _react.default.createElement(_Dropdownstyles.Ul, {
             ref: targetRef,
             id: "".concat(treeId, "_tree_level_1"),
             role: "tree",
-            listOverflow: listOverflow,
             listMaxHeight: listMaxHeight || listHeight
         }, beforeList, items.map(function(item, index) {
             return /*#__PURE__*/ _react.default.createElement(_ui.DropdownInner, {
@@ -330,9 +327,8 @@ var dropdownRoot = function(Root) {
                 path: path,
                 dispatchPath: dispatchPath,
                 index: index,
-                listOverflow: listOverflow,
-                listMaxHeight: listMaxHeight || listHeight,
-                listWidth: listWidth
+                listWidth: listWidth,
+                portal: listWrapperRef
             });
         }), afterList)))));
     });

package/styled-components/cjs/components/Dropdown/Dropdown.styles.js

@@ -65,7 +65,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 var ListWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Dropdown.styles__ListWrapper",
-    componentId: "sc-eabc61b1-0"
+    componentId: "sc-768e302d-0"
 })([
     "width:",
     ";padding:calc(var(",
@@ -82,19 +82,15 @@ var ListWrapper = _styledcomponents.default.div.withConfig({
 }, _Dropdowntokens.tokens.padding, _Dropdowntokens.tokens.borderWidth, _Dropdowntokens.tokens.borderRadius, _Dropdowntokens.constants.background, _Dropdowntokens.constants.boxShadow, _Dropdowntokens.tokens.borderWidth, _Dropdowntokens.tokens.borderColor);
 var Ul = _styledcomponents.default.ul.withConfig({
     displayName: "Dropdown.styles__Ul",
-    componentId: "sc-eabc61b1-1"
+    componentId: "sc-768e302d-1"
 })([
     "max-height:",
-    ";overflow-y:",
-    ";border-radius:calc(var(",
+    ";overflow-x:hidden;overflow-y:auto;border-radius:calc(var(",
     ") - 0.125rem - var(",
     ",0rem));margin:0;padding:0;"
 ], function(param) {
     var listMaxHeight = param.listMaxHeight;
     return listMaxHeight ? (0, _utils.getCorrectHeight)(listMaxHeight) : 'auto';
-}, function(param) {
-    var listOverflow = param.listOverflow;
-    return listOverflow || 'visible';
 }, _Dropdowntokens.tokens.borderRadius, _Dropdowntokens.tokens.borderWidth);
 var base = (0, _styledcomponents.css)([
     ""

package/styled-components/cjs/components/Dropdown/hooks/useKeyboardNavigation.js

@@ -180,13 +180,9 @@ var useKeyNavigation = function(param) {
             case keys.Tab:
             case keys.Escape:
                 {
-                    dispatchFocusedPath({
-                        type: 'reset'
-                    });
-                    dispatchPath({
-                        type: 'reset'
-                    });
-                    handleGlobalToggle(false, event);
+                    if (path[0]) {
+                        handleGlobalToggle(false, event);
+                    }
                     break;
                 }
             case keys.Home:

package/styled-components/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js

@@ -8,19 +8,55 @@ Object.defineProperty(exports, "DropdownInner", {
         return DropdownInner;
     }
 });
-var _react = /*#__PURE__*/ _interop_require_default(require("react"));
+var _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 var _utils = require("../../../../utils");
 var _DropdownItem = require("../DropdownItem/DropdownItem");
 var _Dropdownstyles = require("../../Dropdown.styles");
 var _FloatingPopover = require("../../FloatingPopover");
 var _utils1 = require("../../utils");
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
     };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
 }
 var DropdownInner = function(param) {
-    var item = param.item, currentLevel = param.currentLevel, path = param.path, dispatchPath = param.dispatchPath, index = param.index, trigger = param.trigger, listMaxHeight = param.listMaxHeight, listOverflow = param.listOverflow, listWidth = param.listWidth;
+    var item = param.item, currentLevel = param.currentLevel, path = param.path, dispatchPath = param.dispatchPath, index = param.index, trigger = param.trigger, listWidth = param.listWidth, portal = param.portal;
     var handleToggle = function(opened) {
         if (opened) {
             dispatchPath({
@@ -35,6 +71,7 @@ var DropdownInner = function(param) {
             });
         }
     };
+    var listWrapperRef = (0, _react.useRef)(null);
     var isCurrentListOpen = path[currentLevel + 1] === item.value.toString();
     var treeId = (0, _utils.safeUseId)();
     var listId = "".concat(treeId, "_tree_level_").concat(currentLevel + 2);
@@ -55,14 +92,15 @@ var DropdownInner = function(param) {
                 ariaLevel: nextLevel,
                 ariaLabel: item.label
             }),
-            isInner: true
+            isInner: true,
+            portal: portal
         }, /*#__PURE__*/ _react.default.createElement(_Dropdownstyles.ListWrapper, {
+            ref: listWrapperRef,
             listWidth: listWidth
         }, /*#__PURE__*/ _react.default.createElement(_Dropdownstyles.Ul, {
             id: listId,
             role: "group",
-            listMaxHeight: listMaxHeight,
-            listOverflow: listOverflow
+            listMaxHeight: item.listMaxHeight
         }, item.items.map(function(innerItem, innerIndex) {
             return /*#__PURE__*/ _react.default.createElement(DropdownInner, {
                 key: "".concat(innerIndex, "/").concat(currentLevel),
@@ -72,9 +110,8 @@ var DropdownInner = function(param) {
                 dispatchPath: dispatchPath,
                 index: innerIndex,
                 trigger: trigger,
-                listMaxHeight: listMaxHeight,
-                listOverflow: listOverflow,
-                listWidth: listWidth
+                listWidth: listWidth,
+                portal: listWrapperRef
             });
         }))));
     }

package/styled-components/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js

@@ -184,7 +184,7 @@ var DropdownItem = function(param) {
     };
     var handleHover = function() {
         if (onHover) {
-            onHover(index);
+            onHover(index, item);
         }
     };
     return /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, dividerBefore && /*#__PURE__*/ _react.default.createElement(_DropdownItemstyles.Divider, {

package/styled-components/cjs/components/Popover/Popover.js

@@ -238,6 +238,7 @@ var popoverRoot = function(Root) {
         var portalRef = (0, _react.useRef)(null);
         var targetRef = (0, _react.useRef)(null);
         var trapRef = (0, _hooks.useFocusTrap)(innerIsOpen && isFocusTrapped);
+        var uuid = (0, _utils.safeUseId)();
         var popoverForkRef = (0, _plasmacore.useForkRef)(popoverRef, trapRef);
         var _useState = _sliced_to_array((0, _react.useState)(null), 2), arrowElement = _useState[0], setArrowElement = _useState[1];
         var _useState1 = _sliced_to_array((0, _react.useState)(false), 2), forceRender = _useState1[1];
@@ -388,8 +389,9 @@ var popoverRoot = function(Root) {
                 portal = rootRef.current;
             }
             if (!portal) {
+                var portalId = "".concat(POPOVER_PORTAL_ID, "-").concat(uuid);
                 portal = document.createElement('div');
-                portal.setAttribute('id', POPOVER_PORTAL_ID);
+                portal.setAttribute('id', portalId);
                 if (typeof frame === 'string' && frame !== 'document') {
                     var _document_getElementById;
                     (_document_getElementById = document.getElementById(frame)) === null || _document_getElementById === void 0 ? void 0 : _document_getElementById.appendChild(portal);

package/styled-components/cjs/components/Select/Select.js

@@ -267,6 +267,7 @@ var selectRoot = function(Root) {
         var activeDescendantItemValue = ((_getItemByFocused = (0, _useKeyboardNavigation.getItemByFocused)(focusedPath, focusedToValueMap)) === null || _getItemByFocused === void 0 ? void 0 : _getItemByFocused.value.toString()) || '';
         var closeAfterSelect = outerCloseAfterSelect !== null && outerCloseAfterSelect !== void 0 ? outerCloseAfterSelect : !props.multiselect;
         var treeId = (0, _utils.safeUseId)();
+        var listWrapperRef = (0, _react.useRef)(null);
         var view = target === 'textfield-like' && (disabled || readOnly) ? 'default' : (0, _utils1.getView)(status, outerView);
         // Собираем объект с пропсами для required и прокидываем их напрямую в компонент Textfield.
         var requiredProps = props.target === 'button-like' ? undefined : {
@@ -553,12 +554,12 @@ var selectRoot = function(Root) {
             disabled: disabled,
             readOnly: readOnly
         }, rest), /*#__PURE__*/ _react.default.createElement(_Selectstyles.ListWrapper, {
+            ref: listWrapperRef,
             listWidth: listWidth
         }, /*#__PURE__*/ _react.default.createElement(_Selectstyles.Ul, {
             role: "tree",
             id: "".concat(treeId, "_tree_level_1"),
             "aria-multiselectable": Boolean(props.multiselect),
-            listOverflow: listOverflow,
             listMaxHeight: listMaxHeight || listHeight,
             onScroll: virtual ? undefined : handleScroll,
             ref: targetRef,
@@ -579,7 +580,8 @@ var selectRoot = function(Root) {
                 path: path,
                 dispatchPath: dispatchPath,
                 index: index,
-                listWidth: listWidth
+                listWidth: listWidth,
+                portal: listWrapperRef
             });
         }), afterList))))));
     });

package/styled-components/cjs/components/Select/Select.styles.js

@@ -65,7 +65,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 var ListWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Select.styles__ListWrapper",
-    componentId: "sc-30266665-0"
+    componentId: "sc-3f8cf8d4-0"
 })([
     "width:",
     ";padding:calc(var(",
@@ -82,10 +82,10 @@ var ListWrapper = _styledcomponents.default.div.withConfig({
 }, _Selecttokens.tokens.padding, _Selecttokens.tokens.dropdownBorderWidth, _Selecttokens.tokens.borderRadius, _Selecttokens.constants.background, _Selecttokens.constants.boxShadow, _Selecttokens.tokens.dropdownBorderWidth, _Selecttokens.tokens.dropdownBorderColor);
 var Ul = _styledcomponents.default.ul.withConfig({
     displayName: "Select.styles__Ul",
-    componentId: "sc-30266665-1"
+    componentId: "sc-3f8cf8d4-1"
 })([
     "max-height:",
-    ";overflow-y:",
+    ";overflow-x:hidden;overflow-y:",
     ";border-radius:calc(var(",
     ") - 0.125rem - var(",
     ",0rem));margin:0;padding:0;"
@@ -94,8 +94,8 @@ var Ul = _styledcomponents.default.ul.withConfig({
     return(// eslint-disable-next-line no-nested-ternary
     virtual ? 'auto' : listMaxHeight ? (0, _utils.getCorrectHeight)(listMaxHeight) : 'auto');
 }, function(param) {
-    var virtual = param.virtual, listOverflow = param.listOverflow;
-    return virtual ? 'visible' : listOverflow || 'visible';
+    var virtual = param.virtual;
+    return virtual ? 'visible' : 'auto';
 }, _Selecttokens.tokens.borderRadius, _Selecttokens.tokens.dropdownBorderWidth);
 var base = (0, _styledcomponents.css)([
     ""

package/styled-components/cjs/components/Select/hooks/useKeyboardNavigation.js

@@ -198,13 +198,9 @@ var useKeyNavigation = function(param) {
             case keys.Tab:
             case keys.Escape:
                 {
-                    dispatchFocusedPath({
-                        type: 'reset'
-                    });
-                    dispatchPath({
-                        type: 'reset'
-                    });
-                    handleListToggle(false);
+                    if (path[0]) {
+                        handleListToggle(false);
+                    }
                     break;
                 }
             case keys.Home:

package/styled-components/cjs/components/Select/ui/Inner/Inner.js

@@ -8,18 +8,54 @@ Object.defineProperty(exports, "Inner", {
         return Inner;
     }
 });
-var _react = /*#__PURE__*/ _interop_require_default(require("react"));
+var _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 var _utils = require("../../../../utils");
 var _Selectstyles = require("../../Select.styles");
 var _FloatingPopover = require("../../FloatingPopover");
 var _Item = require("./ui/Item/Item");
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
     };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
 }
 var Inner = function(param) {
-    var item = param.item, currentLevel = param.currentLevel, path = param.path, dispatchPath = param.dispatchPath, index = param.index, listWidth = param.listWidth;
+    var item = param.item, currentLevel = param.currentLevel, path = param.path, dispatchPath = param.dispatchPath, index = param.index, listWidth = param.listWidth, portal = param.portal;
     var handleToggle = function(opened) {
         if (opened) {
             dispatchPath({
@@ -34,6 +70,7 @@ var Inner = function(param) {
             });
         }
     };
+    var listWrapperRef = (0, _react.useRef)(null);
     var isCurrentListOpen = path[currentLevel + 1] === item.value.toString();
     var treeId = (0, _utils.safeUseId)();
     var listId = "".concat(treeId, "_tree_level_").concat(currentLevel + 2);
@@ -54,13 +91,16 @@ var Inner = function(param) {
                 ariaLevel: nextLevel,
                 ariaLabel: item.label
             }),
-            isInner: true
+            isInner: true,
+            portal: portal
         }, /*#__PURE__*/ _react.default.createElement(_Selectstyles.ListWrapper, {
-            listWidth: listWidth
+            listWidth: listWidth,
+            ref: listWrapperRef
         }, /*#__PURE__*/ _react.default.createElement(_Selectstyles.Ul, {
             role: "group",
             id: listId,
-            virtual: false
+            virtual: false,
+            listMaxHeight: item === null || item === void 0 ? void 0 : item.listMaxHeight
         }, (_item_items = item.items) === null || _item_items === void 0 ? void 0 : _item_items.map(function(innerItem, innerIndex) {
             return /*#__PURE__*/ _react.default.createElement(Inner, {
                 key: "".concat(innerIndex, "/").concat(currentLevel),
@@ -69,7 +109,8 @@ var Inner = function(param) {
                 path: path,
                 dispatchPath: dispatchPath,
                 index: innerIndex,
-                listWidth: listWidth
+                listWidth: listWidth,
+                portal: listWrapperRef
             });
         }))));
     }

package/styled-components/cjs/components/Tree/Tree.js

@@ -168,7 +168,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 var treeRoot = function(Root) {
     return /*#__PURE__*/ (0, _react.forwardRef)(function(param, ref) {
-        var items = param.items, _param_arrowPlacement = param.arrowPlacement, arrowPlacement = _param_arrowPlacement === void 0 ? 'left' : _param_arrowPlacement, _param_virtual = param.virtual, virtual = _param_virtual === void 0 ? true : _param_virtual, height = param.height, itemHeight = param.itemHeight, size = param.size, view = param.view, _param_fullWidthItemSelection = param.fullWidthItemSelection, fullWidthItemSelection = _param_fullWidthItemSelection === void 0 ? false : _param_fullWidthItemSelection, _param_multiple = param.multiple, multiple = _param_multiple === void 0 ? false : _param_multiple, _param_defaultExpandAll = param.defaultExpandAll, defaultExpandAll = _param_defaultExpandAll === void 0 ? false : _param_defaultExpandAll, _param_autoExpandParent = param.autoExpandParent, autoExpandParent = _param_autoExpandParent === void 0 ? false : _param_autoExpandParent, _param_checkable = param.checkable, checkable = _param_checkable === void 0 ? false : _param_checkable, outerSelectedKeys = param.selectedKeys, checkedKeys = param.checkedKeys, expandedKeys = param.expandedKeys, defaultCheckedKeys = param.defaultCheckedKeys, defaultExpandedKeys = param.defaultExpandedKeys, defaultSelectedKeys = param.defaultSelectedKeys, className = param.className, onTreeSelect = param.onTreeSelect, onTreeCheck = param.onTreeCheck, onTreeExpand = param.onTreeExpand, _param_hasIcon = param.hasIcon, hasIcon = _param_hasIcon === void 0 ? false : _param_hasIcon, icon = param.icon, renderTitle = param.renderTitle, _param_mode = param.mode, mode = _param_mode === void 0 ? 'default' : _param_mode, _param_draggable = param.draggable, draggable = _param_draggable === void 0 ? false : _param_draggable, onDragStart = param.onDragStart, onDragEnter = param.onDragEnter, onDragOver = param.onDragOver, onDragLeave = param.onDragLeave, onDragEnd = param.onDragEnd, onDrop = param.onDrop, allowDrop = param.allowDrop;
+        var items = param.items, _param_arrowPlacement = param.arrowPlacement, arrowPlacement = _param_arrowPlacement === void 0 ? 'left' : _param_arrowPlacement, _param_virtual = param.virtual, virtual = _param_virtual === void 0 ? true : _param_virtual, height = param.height, itemHeight = param.itemHeight, size = param.size, view = param.view, _param_fullWidthItemSelection = param.fullWidthItemSelection, fullWidthItemSelection = _param_fullWidthItemSelection === void 0 ? false : _param_fullWidthItemSelection, _param_multiple = param.multiple, multiple = _param_multiple === void 0 ? false : _param_multiple, _param_defaultExpandAll = param.defaultExpandAll, defaultExpandAll = _param_defaultExpandAll === void 0 ? false : _param_defaultExpandAll, _param_autoExpandParent = param.autoExpandParent, autoExpandParent = _param_autoExpandParent === void 0 ? false : _param_autoExpandParent, _param_checkable = param.checkable, checkable = _param_checkable === void 0 ? false : _param_checkable, outerSelectedKeys = param.selectedKeys, checkedKeys = param.checkedKeys, expandedKeys = param.expandedKeys, defaultCheckedKeys = param.defaultCheckedKeys, defaultExpandedKeys = param.defaultExpandedKeys, defaultSelectedKeys = param.defaultSelectedKeys, className = param.className, onTreeSelect = param.onTreeSelect, onTreeCheck = param.onTreeCheck, onTreeExpand = param.onTreeExpand, _param_hasIcon = param.hasIcon, hasIcon = _param_hasIcon === void 0 ? false : _param_hasIcon, icon = param.icon, renderTitle = param.renderTitle, _param_mode = param.mode, mode = _param_mode === void 0 ? 'default' : _param_mode;
         var _useState = _sliced_to_array((0, _react.useState)(defaultSelectedKeys || []), 2), selected = _useState[0], setSelected = _useState[1];
         var selectedKeys = outerSelectedKeys !== null && outerSelectedKeys !== void 0 ? outerSelectedKeys : selected;
         var isRadioMode = mode === 'radio' && !multiple;
@@ -241,36 +241,6 @@ var treeRoot = function(Root) {
                     fullWidthItemSelection: fullWidthItemSelection,
                     arrowPlacement: arrowPlacement
                 }, /*#__PURE__*/ _react.default.createElement(_Treestyles.Title, null, renderTitle ? renderTitle(item) : typeof item.title === 'function' ? item.title(item) : item.title), item.contentRight && /*#__PURE__*/ _react.default.createElement(_Treestyles.ContentRight, null, item.contentRight));
-            },
-            draggable: draggable,
-            onDragStart: onDragStart,
-            onDragEnter: onDragEnter,
-            onDragOver: onDragOver,
-            onDragLeave: onDragLeave,
-            onDragEnd: onDragEnd,
-            onDrop: onDrop,
-            allowDrop: allowDrop,
-            dropIndicatorRender: function(props) {
-                var offset = 0;
-                var dropPosition = props.dropPosition, dropLevelOffset = props.dropLevelOffset, indent = props.indent;
-                var left = -dropLevelOffset * indent + offset;
-                var style = {};
-                switch(dropPosition){
-                    case -1:
-                        style.top = 0;
-                        break;
-                    case 1:
-                        style.bottom = 0;
-                        break;
-                    default:
-                        style.bottom = 0;
-                        style.left = indent + offset;
-                        break;
-                }
-                return /*#__PURE__*/ _react.default.createElement(_Treestyles.Line, {
-                    style: style,
-                    left: left
-                });
             }
         })));
     });

package/styled-components/cjs/components/Tree/Tree.styles.js

@@ -15,9 +15,6 @@ _export(exports, {
     get IconArrowWrapper () {
         return IconArrowWrapper;
     },
-    get Line () {
-        return Line;
-    },
     get StyledArrow () {
         return StyledArrow;
     },
@@ -81,7 +78,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 var IconArrowWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Tree.styles__IconArrowWrapper",
-    componentId: "sc-cfcc5086-0"
+    componentId: "sc-b806b1cc-0"
 })([
     "line-height:0;color:var(",
     ");&:hover{color:var(",
@@ -90,19 +87,19 @@ var IconArrowWrapper = _styledcomponents.default.div.withConfig({
 ], _Treetokens.treeTokens.arrowColor, _Treetokens.treeTokens.arrowColorHover, _Treetokens.treeTokens.arrowColorActive);
 var StyledArrow = (0, _styledcomponents.default)(_Icon.IconDisclosureRightCentered).withConfig({
     displayName: "Tree.styles__StyledArrow",
-    componentId: "sc-cfcc5086-1"
+    componentId: "sc-b806b1cc-1"
 })([
     "transition:color 0.3s ease-in,transform 0.15s ease-in;pointer-events:none;user-select:none;"
 ]);
 var StyledFolder = (0, _styledcomponents.default)(_Icon.IconFolder).withConfig({
     displayName: "Tree.styles__StyledFolder",
-    componentId: "sc-cfcc5086-2"
+    componentId: "sc-b806b1cc-2"
 })([
     ""
 ]);
 var TitleWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Tree.styles__TitleWrapper",
-    componentId: "sc-cfcc5086-3"
+    componentId: "sc-b806b1cc-3"
 })([
     "display:flex;align-items:center;justify-content:space-between;margin:",
     ";",
@@ -113,7 +110,7 @@ var TitleWrapper = _styledcomponents.default.div.withConfig({
 }, (0, _mixins.applyEllipsis)());
 var Title = _styledcomponents.default.span.withConfig({
     displayName: "Tree.styles__Title",
-    componentId: "sc-cfcc5086-4"
+    componentId: "sc-b806b1cc-4"
 })([
     "margin:var(",
     ");",
@@ -121,25 +118,12 @@ var Title = _styledcomponents.default.span.withConfig({
 ], _Treetokens.treeTokens.iconFolderMargin, (0, _mixins.applyEllipsis)());
 var ContentRight = _styledcomponents.default.div.withConfig({
     displayName: "Tree.styles__ContentRight",
-    componentId: "sc-cfcc5086-5"
+    componentId: "sc-b806b1cc-5"
 })([
     "line-height:0;"
 ]);
-var Line = _styledcomponents.default.div.withConfig({
-    displayName: "Tree.styles__Line",
-    componentId: "sc-cfcc5086-6"
-})([
-    "left:",
-    ";right:0;position:absolute;z-index:1;height:2px;background-color:var(",
-    ");border-radius:1px;pointer-events:none;"
-], function(param) {
-    var left = param.left;
-    return left;
-}, _Treetokens.treeTokens.itemDraggableLineColor);
 var base = (0, _styledcomponents.css)([
-    ".rc-tree{margin:0;border:1px solid transparent;}.rc-tree-focused:not(.rc-tree-active-focused){border-color:cyan;}.rc-tree .rc-tree-treenode{margin:0;padding:0;line-height:24px;white-space:nowrap;list-style:none;outline:0;}.rc-tree .rc-tree-treenode .draggable{color:#333;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;user-select:none;}.rc-tree .rc-tree-treenode.dragging{opacity:0.4;}.rc-tree .rc-tree-treenode.drop-container::before,.rc-tree:not(:has(.drop-container)) .rc-tree-treenode.drop-target.",
-    "::before,.rc-tree:not(:has(.drop-container)) .rc-tree-treenode.drop-target.drag-over::before{box-shadow:inset 0 0 0 1px var(",
-    ");}.rc-tree .rc-tree-treenode.filter-node > .rc-tree-node-content-wrapper{color:#a60000 !important;font-weight:bold !important;}.rc-tree .rc-tree-treenode ul{margin:0;padding:0 0 0 18px;}.rc-tree .rc-tree-treenode .rc-tree-node-content-wrapper{position:relative;display:inline-block;height:24px;margin:0;padding:0;text-decoration:none;vertical-align:top;cursor:pointer;color:var(",
+    ".rc-tree{margin:0;border:1px solid transparent;}.rc-tree-focused:not(.rc-tree-active-focused){border-color:cyan;}.rc-tree .rc-tree-treenode{margin:0;padding:0;line-height:24px;white-space:nowrap;list-style:none;outline:0;}.rc-tree .rc-tree-treenode .draggable{color:#333;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;user-select:none;}.rc-tree .rc-tree-treenode.dragging{background:rgba(100,100,255,0.1);}.rc-tree .rc-tree-treenode.drop-container > .draggable::after{position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inset 0 0 0 2px red;content:'';}.rc-tree .rc-tree-treenode.drop-container ~ .rc-tree-treenode{border-left:2px solid chocolate;}.rc-tree .rc-tree-treenode.drop-target{background-color:yellowgreen;}.rc-tree .rc-tree-treenode.drop-target ~ .rc-tree-treenode{border-left:none;}.rc-tree .rc-tree-treenode.filter-node > .rc-tree-node-content-wrapper{color:#a60000 !important;font-weight:bold !important;}.rc-tree .rc-tree-treenode ul{margin:0;padding:0 0 0 18px;}.rc-tree .rc-tree-treenode .rc-tree-node-content-wrapper{position:relative;display:inline-block;height:24px;margin:0;padding:0;text-decoration:none;vertical-align:top;cursor:pointer;color:var(",
     ");}.rc-tree.",
     " .rc-tree-treenode.rc-tree-treenode-selected .rc-tree-node-content-wrapper{cursor:default;}.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled .rc-tree-node-content-wrapper,.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled span.rc-tree-switcher,.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled span.rc-tree-checkbox,.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled span.rc-tree-iconEle{cursor:default;}.rc-tree .rc-tree-treenode span.rc-tree-switcher,.rc-tree .rc-tree-treenode span.rc-tree-checkbox,.rc-tree .rc-tree-treenode span.rc-tree-iconEle{cursor:pointer;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-icon__customize,.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-icon__customize,.rc-tree .rc-tree-treenode span.rc-tree-iconEle.rc-tree-icon__customize{background-image:none;}.rc-tree .rc-tree-treenode span.rc-tree-icon_loading{margin-right:2px;vertical-align:top;background:url('data:image/gif;base64,R0lGODlhEAAQAKIGAMLY8YSx5HOm4Mjc88/g9Ofw+v///wAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCgAGACwAAAAAEAAQAAADMGi6RbUwGjKIXCAA016PgRBElAVlG/RdLOO0X9nK61W39qvqiwz5Ls/rRqrggsdkAgAh+QQFCgAGACwCAAAABwAFAAADD2hqELAmiFBIYY4MAutdCQAh+QQFCgAGACwGAAAABwAFAAADD1hU1kaDOKMYCGAGEeYFCQAh+QQFCgAGACwKAAIABQAHAAADEFhUZjSkKdZqBQG0IELDQAIAIfkEBQoABgAsCgAGAAUABwAAAxBoVlRKgyjmlAIBqCDCzUoCACH5BAUKAAYALAYACgAHAAUAAAMPaGpFtYYMAgJgLogA610JACH5BAUKAAYALAIACgAHAAUAAAMPCAHWFiI4o1ghZZJB5i0JACH5BAUKAAYALAAABgAFAAcAAAMQCAFmIaEp1motpDQySMNFAgA7') no-repeat scroll 0 0 transparent;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher-noop{flex:none;}.rc-tree.",
     " .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher-noop{display:none;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher_open{background-position:-93px -56px;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher_close{background-position:-75px -56px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox{width:13px;height:13px;margin:0 3px;background-position:0 0;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox-checked{background-position:-14px 0;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox-indeterminate{background-position:-14px -28px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox-disabled{background-position:0 -56px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-checkbox-checked.rc-tree-checkbox-disabled{background-position:-14px -56px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-checkbox-indeterminate.rc-tree-checkbox-disabled{position:relative;background:#ccc;border-radius:3px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-checkbox-indeterminate.rc-tree-checkbox-disabled::after{position:absolute;top:5px;left:3px;width:5px;height:0;border:2px solid #fff;border-top:0;border-left:0;-webkit-transform:scale(1);transform:scale(1);content:' ';}.rc-tree:not(.rc-tree-show-line) .rc-tree-treenode .rc-tree-switcher-noop{background:none;}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) > ul{background:url('data:image/gif;base64,R0lGODlhCQACAIAAAMzMzP///yH5BAEAAAEALAAAAAAJAAIAAAIEjI9pUAA7') 0 0 repeat-y;}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) > .rc-tree-switcher-noop{background-position:-56px -18px;}.rc-tree.rc-tree-show-line .rc-tree-treenode:last-child > .rc-tree-switcher-noop{background-position:-56px -36px;}.rc-tree-child-tree{display:none;}.rc-tree-child-tree-open{display:block;}.rc-tree-treenode-disabled > span:not(.rc-tree-switcher),.rc-tree-treenode-disabled > a,.rc-tree-treenode-disabled > a span{color:#767676;cursor:not-allowed;}.rc-tree-treenode-active{background:rgba(0,0,0,0.1);}.rc-tree-node-selected{background-color:#ffe6b0;box-shadow:0 0 0 1px #ffb951;opacity:0.8;}.rc-tree-icon__open{margin-right:0;vertical-align:top;background-position:-110px -16px;}.rc-tree-icon__close{margin-right:0;vertical-align:top;background-position:-110px 0;}.rc-tree-icon__docu{margin-right:0;vertical-align:top;background-position:-110px -32px;}.rc-tree-icon__customize{display:block;line-height:0;color:var(",
@@ -201,4 +185,4 @@ var base = (0, _styledcomponents.css)([
     ");}.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled .rc-tree-icon__customize{color:var(",
     ");;}.rc-tree-indent-unit{width:var(",
     ");}"
-], _Treetokens.classes.treeLeafNode, _Treetokens.treeTokens.itemDraggableBorderColor, _Treetokens.treeTokens.color, _Treetokens.classes.treeRadioMode, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.iconFolderColor, _Treetokens.treeTokens.iconFolderMargin, _Treetokens.treeTokens.itemHeight, _Treetokens.classes.treeItemFilled, _Treetokens.treeTokens.itemPadding, _Treetokens.classes.treeInverted, _Treetokens.classes.treeItemFilled, _Treetokens.treeTokens.itemPaddingTight, _Treetokens.treeTokens.itemTop, _Treetokens.treeTokens.itemBottom, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.itemBorderRadius, _Treetokens.treeTokens.itemDisabledOpacity, _Treetokens.classes.treeItemFilled, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemPrimaryBackground, _Treetokens.treeTokens.itemBackgroundColorPrimary, _Treetokens.treeTokens.itemBackgroundColorSelected, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorHover, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorActive, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherMargin, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.switcherMarginInverted, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxMargin, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxBorderColor, _Treetokens.treeTokens.checkboxBorderRadius, _Treetokens.treeTokens.itemDisabledBorderColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.color, _Treetokens.treeTokens.fontFamily, _Treetokens.treeTokens.fontSize, _Treetokens.treeTokens.fontStyle, _Treetokens.treeTokens.fontWeight, _Treetokens.treeTokens.letterSpacing, _Treetokens.treeTokens.lineHeight, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.itemIndent);
+], _Treetokens.treeTokens.color, _Treetokens.classes.treeRadioMode, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.iconFolderColor, _Treetokens.treeTokens.iconFolderMargin, _Treetokens.treeTokens.itemHeight, _Treetokens.classes.treeItemFilled, _Treetokens.treeTokens.itemPadding, _Treetokens.classes.treeInverted, _Treetokens.classes.treeItemFilled, _Treetokens.treeTokens.itemPaddingTight, _Treetokens.treeTokens.itemTop, _Treetokens.treeTokens.itemBottom, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.itemBorderRadius, _Treetokens.treeTokens.itemDisabledOpacity, _Treetokens.classes.treeItemFilled, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemPrimaryBackground, _Treetokens.treeTokens.itemBackgroundColorPrimary, _Treetokens.treeTokens.itemBackgroundColorSelected, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorHover, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorActive, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherMargin, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.switcherMarginInverted, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxMargin, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxBorderColor, _Treetokens.treeTokens.checkboxBorderRadius, _Treetokens.treeTokens.itemDisabledBorderColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.color, _Treetokens.treeTokens.fontFamily, _Treetokens.treeTokens.fontSize, _Treetokens.treeTokens.fontStyle, _Treetokens.treeTokens.fontWeight, _Treetokens.treeTokens.letterSpacing, _Treetokens.treeTokens.lineHeight, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.itemIndent);

package/styled-components/cjs/components/Tree/Tree.tokens.js

@@ -21,8 +21,7 @@ var classes = {
     treeItemFilled: 'tree-item-filled',
     treeItemPrimaryBackground: 'tree-item-primary-background',
     treeItemHasSelectedChildren: 'tree-item-has-selected-children',
-    treeRadioMode: 'tree-radio-mode',
-    treeLeafNode: 'tree-leaf-node'
+    treeRadioMode: 'tree-radio-mode'
 };
 var treeTokens = {
     arrowColor: '--plasma-tree-arrow-color',
@@ -60,7 +59,5 @@ var treeTokens = {
     itemBackgroundColorActive: '--plasma-tree-item-background-color-active',
     itemDisabledOpacity: '--plasma-tree-item-disabled-opacity',
     itemDisabledColor: '--plasma-tree-item-disabled-color',
-    itemDisabledBorderColor: '--plasma-tree-item-disabled-border-color',
-    itemDraggableBorderColor: '--plasma-tree-item-draggable-border-color',
-    itemDraggableLineColor: '--plasma-tree-item-draggable-line-color'
+    itemDisabledBorderColor: '--plasma-tree-item-disabled-border-color'
 };

package/styled-components/cjs/components/Tree/utils/traverseTree.js

@@ -117,9 +117,6 @@ var dfs = function(node, selectedKeys, rootParentsSelected, parents) {
     })[0]) === null || _parents_filter_ === void 0 ? void 0 : _parents_filter_.key)) {
         node.className = (0, _dedupe.default)(node.className, _Treetokens.classes.treeItemPrimaryBackground);
     }
-    if (!node.children) {
-        node.className = (0, _dedupe.default)(node.className, _Treetokens.classes.treeLeafNode);
-    }
 };
 var getRootParentsSelectedChildren = function(node, selectedKeysSet) {
     var rootParentsSelected = new Set();
@@ -144,6 +141,9 @@ var getRootParentsSelectedChildren = function(node, selectedKeysSet) {
     return rootParentsSelected;
 };
 var traverseTree = function(items, selectedKeys) {
+    if (!selectedKeys || selectedKeys.length === 0) {
+        return items;
+    }
     var selectedKeysSet = new Set(selectedKeys);
     var copyItems = deepCopy(items);
     var rootParentsSelected = getRootParentsSelectedChildren({

package/styled-components/cjs/examples/components/Tree/Tree.config.js

@@ -33,10 +33,8 @@ var config = {
                 ":var(--text-accent);",
                 ":0.4;",
                 ":var(--text-secondary);",
-                ":var(--text-secondary);",
-                ":var(--surface-positive);",
-                ":var(--surface-solid-default);"
-            ], _Treetokens.treeTokens.iconFolderColor, _Treetokens.treeTokens.arrowColor, _Treetokens.treeTokens.arrowColorHover, _Treetokens.treeTokens.arrowColorActive, _Treetokens.treeTokens.color, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemBackgroundColorSelected, _Treetokens.treeTokens.itemBackgroundColorPrimary, _Treetokens.treeTokens.itemBackgroundColorHover, _Treetokens.treeTokens.itemBackgroundColorActive, _Treetokens.treeTokens.checkboxBorderColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.itemDisabledOpacity, _Treetokens.treeTokens.itemDisabledBorderColor, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.itemDraggableBorderColor, _Treetokens.treeTokens.itemDraggableLineColor)
+                ":var(--text-secondary);"
+            ], _Treetokens.treeTokens.iconFolderColor, _Treetokens.treeTokens.arrowColor, _Treetokens.treeTokens.arrowColorHover, _Treetokens.treeTokens.arrowColorActive, _Treetokens.treeTokens.color, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemBackgroundColorSelected, _Treetokens.treeTokens.itemBackgroundColorPrimary, _Treetokens.treeTokens.itemBackgroundColorHover, _Treetokens.treeTokens.itemBackgroundColorActive, _Treetokens.treeTokens.checkboxBorderColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.itemDisabledOpacity, _Treetokens.treeTokens.itemDisabledBorderColor, _Treetokens.treeTokens.itemDisabledColor)
         },
         size: {
             l: (0, _styledcomponents.css)([