one-design-next 0.0.97 → 0.0.99

package/dist/dropdown/index.js

@@ -14,11 +14,11 @@ var _excluded = ["asChild", "children"],
   _excluded2 = ["sideOffset", "children", "matchWidth", "zIndex", "style", "className", "onCloseAutoFocus", "side", "align"],
   _excluded3 = ["style"],
   _excluded4 = ["inset", "variant", "onSelect", "closeOnClick", "onClick"],
-  _excluded5 = ["children", "checked"],
-  _excluded6 = ["children"],
+  _excluded5 = ["children", "checked", "disabled"],
+  _excluded6 = ["children", "disabled"],
   _excluded7 = ["inset", "children"],
   _excluded8 = ["onOpenChange"],
-  _excluded9 = ["inset", "children"],
+  _excluded9 = ["inset", "icon", "children"],
   _excluded10 = ["sideOffset", "side", "align", "children", "zIndex", "style"],
   _excluded11 = ["style"];
 import { Menu } from '@base-ui/react/menu';
@@ -26,26 +26,35 @@ import { Slot } from '@radix-ui/react-slot';
 import * as React from 'react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import Checkbox from "../checkbox";
+import HoverFill from "../hover-fill";
 import Icon from "../icon";
 import Radio from "../radio";
 import ScrollArea from "../scroll-area";
 import "./style";
+function DropdownItemHoverFill(_ref) {
+  var disabled = _ref.disabled,
+    children = _ref.children;
+  return /*#__PURE__*/React.createElement(HoverFill, {
+    bgClassName: "odn-dropdown-item-bg",
+    disabled: disabled
+  }, children);
+}
 
 // 基础组件定义 — Base UI Menu（原 Radix DropdownMenu 结构对齐）
-function DropdownMenu(_ref) {
-  var props = Object.assign({}, (_objectDestructuringEmpty(_ref), _ref));
+function DropdownMenu(_ref2) {
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref2), _ref2));
   return /*#__PURE__*/React.createElement(Menu.Root, props);
 }
-function DropdownMenuPortal(_ref2) {
-  var props = Object.assign({}, (_objectDestructuringEmpty(_ref2), _ref2));
+function DropdownMenuPortal(_ref3) {
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref3), _ref3));
   return /*#__PURE__*/React.createElement(Menu.Portal, _extends({
     "data-slot": "dropdown-menu-portal"
   }, props));
 }
-var DropdownMenuTrigger = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
-  var asChild = _ref3.asChild,
-    children = _ref3.children,
-    props = _objectWithoutProperties(_ref3, _excluded);
+var DropdownMenuTrigger = /*#__PURE__*/React.forwardRef(function (_ref4, ref) {
+  var asChild = _ref4.asChild,
+    children = _ref4.children,
+    props = _objectWithoutProperties(_ref4, _excluded);
   if (asChild && /*#__PURE__*/React.isValidElement(children)) {
     var nativeButton = typeof children.type === 'string' && children.type === 'button';
     return /*#__PURE__*/React.createElement(Menu.Trigger, _extends({
@@ -62,24 +71,25 @@ var DropdownMenuTrigger = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
   }, props), children);
 });
 DropdownMenuTrigger.displayName = 'DropdownMenuTrigger';
-var DropdownMenuContent = /*#__PURE__*/React.forwardRef(function (_ref4, ref) {
-  var _ref4$sideOffset = _ref4.sideOffset,
-    sideOffset = _ref4$sideOffset === void 0 ? 4 : _ref4$sideOffset,
-    children = _ref4.children,
-    matchWidth = _ref4.matchWidth,
-    _ref4$zIndex = _ref4.zIndex,
-    zIndex = _ref4$zIndex === void 0 ? 'var(--odn-z-index-select)' : _ref4$zIndex,
-    style = _ref4.style,
-    className = _ref4.className,
-    _onCloseAutoFocus = _ref4.onCloseAutoFocus,
-    _ref4$side = _ref4.side,
-    side = _ref4$side === void 0 ? 'bottom' : _ref4$side,
-    _ref4$align = _ref4.align,
-    align = _ref4$align === void 0 ? 'center' : _ref4$align,
-    rest = _objectWithoutProperties(_ref4, _excluded2);
-  var _ref5 = rest,
-    restPopupStyle = _ref5.style,
-    popupRest = _objectWithoutProperties(_ref5, _excluded3);
+var DropdownMenuContent = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
+  var _ref5$sideOffset = _ref5.sideOffset,
+    sideOffset = _ref5$sideOffset === void 0 ? 4 : _ref5$sideOffset,
+    children = _ref5.children,
+    matchWidth = _ref5.matchWidth,
+    _ref5$zIndex = _ref5.zIndex,
+    zIndex = _ref5$zIndex === void 0 ? 'var(--odn-z-index-select)' : _ref5$zIndex,
+    style = _ref5.style,
+    className = _ref5.className,
+    onCloseAutoFocus = _ref5.onCloseAutoFocus,
+    _ref5$side = _ref5.side,
+    side = _ref5$side === void 0 ? 'bottom' : _ref5$side,
+    _ref5$align = _ref5.align,
+    align = _ref5$align === void 0 ? 'center' : _ref5$align,
+    rest = _objectWithoutProperties(_ref5, _excluded2);
+  void onCloseAutoFocus;
+  var _ref6 = rest,
+    restPopupStyle = _ref6.style,
+    popupRest = _objectWithoutProperties(_ref6, _excluded3);
   return /*#__PURE__*/React.createElement(Menu.Portal, null, /*#__PURE__*/React.createElement(Menu.Positioner, {
     side: side,
     align: align,
@@ -103,22 +113,24 @@ var DropdownMenuContent = /*#__PURE__*/React.forwardRef(function (_ref4, ref) {
   }, children))));
 });
 DropdownMenuContent.displayName = 'DropdownMenuContent';
-function DropdownMenuGroup(_ref6) {
-  var props = Object.assign({}, (_objectDestructuringEmpty(_ref6), _ref6));
+function DropdownMenuGroup(_ref7) {
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref7), _ref7));
   return /*#__PURE__*/React.createElement(Menu.Group, _extends({
     "data-slot": "dropdown-menu-group"
   }, props));
 }
-var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
-  var inset = _ref7.inset,
-    _ref7$variant = _ref7.variant,
-    variant = _ref7$variant === void 0 ? 'default' : _ref7$variant,
-    onSelect = _ref7.onSelect,
-    _ref7$closeOnClick = _ref7.closeOnClick,
-    closeOnClick = _ref7$closeOnClick === void 0 ? true : _ref7$closeOnClick,
-    _onClick = _ref7.onClick,
-    props = _objectWithoutProperties(_ref7, _excluded4);
-  return /*#__PURE__*/React.createElement(Menu.Item, _extends({
+var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (_ref8, ref) {
+  var inset = _ref8.inset,
+    _ref8$variant = _ref8.variant,
+    variant = _ref8$variant === void 0 ? 'default' : _ref8$variant,
+    onSelect = _ref8.onSelect,
+    _ref8$closeOnClick = _ref8.closeOnClick,
+    closeOnClick = _ref8$closeOnClick === void 0 ? true : _ref8$closeOnClick,
+    _onClick = _ref8.onClick,
+    props = _objectWithoutProperties(_ref8, _excluded4);
+  return /*#__PURE__*/React.createElement(DropdownItemHoverFill, {
+    disabled: props.disabled
+  }, /*#__PURE__*/React.createElement(Menu.Item, _extends({
     ref: ref,
     "data-slot": "dropdown-menu-item",
     "data-odn-dropdown-item": true,
@@ -129,64 +141,72 @@ var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
       _onClick === null || _onClick === void 0 || _onClick(event);
       onSelect === null || onSelect === void 0 || onSelect(event);
     }
-  }, props));
+  }, props)));
 });
 DropdownMenuItem.displayName = 'DropdownMenuItem';
-function DropdownMenuCheckboxItem(_ref8) {
-  var children = _ref8.children,
-    checked = _ref8.checked,
-    props = _objectWithoutProperties(_ref8, _excluded5);
-  return /*#__PURE__*/React.createElement(Menu.CheckboxItem, _extends({
+function DropdownMenuCheckboxItem(_ref9) {
+  var children = _ref9.children,
+    checked = _ref9.checked,
+    disabled = _ref9.disabled,
+    props = _objectWithoutProperties(_ref9, _excluded5);
+  return /*#__PURE__*/React.createElement(DropdownItemHoverFill, {
+    disabled: disabled
+  }, /*#__PURE__*/React.createElement(Menu.CheckboxItem, _extends({
     "data-slot": "dropdown-menu-checkbox-item",
     "data-odn-dropdown-checkbox-item": true,
-    checked: checked
+    checked: checked,
+    disabled: disabled
   }, props), /*#__PURE__*/React.createElement("span", {
     "data-odn-dropdown-item-indicator": true
-  }, /*#__PURE__*/React.createElement(Menu.CheckboxItemIndicator, null, "\u2713")), children);
+  }, /*#__PURE__*/React.createElement(Menu.CheckboxItemIndicator, null, "\u2713")), children));
 }
-function DropdownMenuRadioGroup(_ref9) {
-  var props = Object.assign({}, (_objectDestructuringEmpty(_ref9), _ref9));
+function DropdownMenuRadioGroup(_ref10) {
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref10), _ref10));
   return /*#__PURE__*/React.createElement(Menu.RadioGroup, _extends({
     "data-slot": "dropdown-menu-radio-group"
   }, props));
 }
-function DropdownMenuRadioItem(_ref10) {
-  var children = _ref10.children,
-    props = _objectWithoutProperties(_ref10, _excluded6);
-  return /*#__PURE__*/React.createElement(Menu.RadioItem, _extends({
+function DropdownMenuRadioItem(_ref11) {
+  var children = _ref11.children,
+    disabled = _ref11.disabled,
+    props = _objectWithoutProperties(_ref11, _excluded6);
+  return /*#__PURE__*/React.createElement(DropdownItemHoverFill, {
+    disabled: disabled
+  }, /*#__PURE__*/React.createElement(Menu.RadioItem, _extends({
     "data-slot": "dropdown-menu-radio-item",
-    "data-odn-dropdown-radio-item": true
+    "data-odn-dropdown-radio-item": true,
+    disabled: disabled
   }, props), /*#__PURE__*/React.createElement("span", {
     "data-odn-dropdown-item-indicator": true
-  }, /*#__PURE__*/React.createElement(Menu.RadioItemIndicator, null, "\u25CF")), children);
+  }, /*#__PURE__*/React.createElement(Menu.RadioItemIndicator, null, "\u25CF")), children));
 }
-function DropdownMenuLabel(_ref11) {
-  var inset = _ref11.inset,
-    children = _ref11.children,
-    props = _objectWithoutProperties(_ref11, _excluded7);
+function DropdownMenuLabel(_ref12) {
+  var inset = _ref12.inset,
+    children = _ref12.children,
+    props = _objectWithoutProperties(_ref12, _excluded7);
   return /*#__PURE__*/React.createElement(Menu.Group, null, /*#__PURE__*/React.createElement(Menu.GroupLabel, _extends({
     "data-slot": "dropdown-menu-label",
     "data-odn-dropdown-label": true,
     "data-inset": inset
   }, props), children));
 }
-function DropdownMenuSeparator(_ref12) {
-  var props = Object.assign({}, (_objectDestructuringEmpty(_ref12), _ref12));
+function DropdownMenuSeparator(_ref13) {
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref13), _ref13));
   return /*#__PURE__*/React.createElement(Menu.Separator, _extends({
     "data-slot": "dropdown-menu-separator",
     "data-odn-dropdown-separator": true
   }, props));
 }
-function DropdownMenuShortcut(_ref13) {
-  var props = Object.assign({}, (_objectDestructuringEmpty(_ref13), _ref13));
+function DropdownMenuShortcut(_ref14) {
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref14), _ref14));
   return /*#__PURE__*/React.createElement("span", _extends({
     "data-slot": "dropdown-menu-shortcut",
     "data-odn-dropdown-shortcut": true
   }, props));
 }
-function DropdownMenuSub(_ref14) {
-  var onOpenChange = _ref14.onOpenChange,
-    props = _objectWithoutProperties(_ref14, _excluded8);
+function DropdownMenuSub(_ref15) {
+  var onOpenChange = _ref15.onOpenChange,
+    props = _objectWithoutProperties(_ref15, _excluded8);
   return /*#__PURE__*/React.createElement(Menu.SubmenuRoot, _extends({
     "data-slot": "dropdown-menu-sub"
   }, props, {
@@ -195,16 +215,20 @@ function DropdownMenuSub(_ref14) {
     } : undefined
   }));
 }
-var DropdownMenuSubTrigger = /*#__PURE__*/React.forwardRef(function (_ref15, ref) {
-  var inset = _ref15.inset,
-    children = _ref15.children,
-    props = _objectWithoutProperties(_ref15, _excluded9);
+var DropdownMenuSubTrigger = /*#__PURE__*/React.forwardRef(function (_ref16, ref) {
+  var inset = _ref16.inset,
+    icon = _ref16.icon,
+    children = _ref16.children,
+    props = _objectWithoutProperties(_ref16, _excluded9);
   return /*#__PURE__*/React.createElement(Menu.SubmenuTrigger, _extends({
     ref: ref,
     "data-slot": "dropdown-menu-sub-trigger",
     "data-odn-dropdown-sub-trigger": true,
     "data-inset": inset
-  }, props), /*#__PURE__*/React.createElement("div", {
+  }, props), icon && /*#__PURE__*/React.createElement(Icon, {
+    name: icon,
+    "data-odn-dropdown-item-icon": true
+  }), /*#__PURE__*/React.createElement("div", {
     "data-odn-dropdown-item-label": true
   }, children), /*#__PURE__*/React.createElement(Icon, {
     "data-odn-dropdown-chevron": true,
@@ -212,21 +236,21 @@ var DropdownMenuSubTrigger = /*#__PURE__*/React.forwardRef(function (_ref15, ref
   }));
 });
 DropdownMenuSubTrigger.displayName = 'DropdownMenuSubTrigger';
-var DropdownMenuSubContent = /*#__PURE__*/React.forwardRef(function (_ref16, ref) {
-  var _ref16$sideOffset = _ref16.sideOffset,
-    sideOffset = _ref16$sideOffset === void 0 ? 4 : _ref16$sideOffset,
-    _ref16$side = _ref16.side,
-    side = _ref16$side === void 0 ? 'right' : _ref16$side,
-    _ref16$align = _ref16.align,
-    align = _ref16$align === void 0 ? 'start' : _ref16$align,
-    children = _ref16.children,
-    _ref16$zIndex = _ref16.zIndex,
-    zIndex = _ref16$zIndex === void 0 ? 'var(--odn-z-index-select)' : _ref16$zIndex,
-    style = _ref16.style,
-    rest = _objectWithoutProperties(_ref16, _excluded10);
-  var _ref17 = rest,
-    restPopupStyle = _ref17.style,
-    popupRest = _objectWithoutProperties(_ref17, _excluded11);
+var DropdownMenuSubContent = /*#__PURE__*/React.forwardRef(function (_ref17, ref) {
+  var _ref17$sideOffset = _ref17.sideOffset,
+    sideOffset = _ref17$sideOffset === void 0 ? 4 : _ref17$sideOffset,
+    _ref17$side = _ref17.side,
+    side = _ref17$side === void 0 ? 'right' : _ref17$side,
+    _ref17$align = _ref17.align,
+    align = _ref17$align === void 0 ? 'start' : _ref17$align,
+    children = _ref17.children,
+    _ref17$zIndex = _ref17.zIndex,
+    zIndex = _ref17$zIndex === void 0 ? 'var(--odn-z-index-select)' : _ref17$zIndex,
+    style = _ref17.style,
+    rest = _objectWithoutProperties(_ref17, _excluded10);
+  var _ref18 = rest,
+    restPopupStyle = _ref18.style,
+    popupRest = _objectWithoutProperties(_ref18, _excluded11);
   return /*#__PURE__*/React.createElement(Menu.Portal, null, /*#__PURE__*/React.createElement(Menu.Positioner, {
     side: side,
     align: align,
@@ -334,8 +358,7 @@ var addSelectAllToMenu = function addSelectAllToMenu(menu, allowSelectAll, isSel
 };
 
 // 递归渲染菜单项的辅助函数
-var renderMenuItem = function renderMenuItem(item, index, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex) {
-  var _item$value2;
+var renderMenuItem = function renderMenuItem(item, index, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex, popupClassName) {
   var key = 'value' in item && item.value || "item-".concat(index);
   switch (item.type) {
     case 'label':
@@ -350,159 +373,167 @@ var renderMenuItem = function renderMenuItem(item, index, _onSelect, onItemClick
       return /*#__PURE__*/React.createElement(DropdownMenuGroup, {
         key: key
       }, item.children.map(function (child, childIndex) {
-        return renderMenuItem(child, childIndex, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex);
+        return renderMenuItem(child, childIndex, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex, popupClassName);
       }));
     default:
-      // 'item' or undefined (DropdownMenuItem)
-      // 检查是否有 children 属性，如果有则渲染为子菜单
-      if ('children' in item && item.children && item.children.length > 0) {
-        // 在多选模式下，带 children 的项目可以选择（全选该子菜单）
-        if (isSelectable && multiple) {
-          // 收集该子菜单所有可选择的子项值
-          var collectChildValues = function collectChildValues(items) {
-            var values = [];
-            items.forEach(function (item) {
-              if ('value' in item && item.value && !item.value.startsWith('selectAll')) {
-                // 包含当前项的值（无论是否有子项）
-                values.push(item.value);
-              }
-              if ('children' in item && item.children) {
-                // 如果有子项，递归收集子项
-                values.push.apply(values, _toConsumableArray(collectChildValues(item.children)));
-              }
+      {
+        var _item$value2;
+        // 'item' or undefined (DropdownMenuItem)
+        // 检查是否有 children 属性，如果有则渲染为子菜单
+        if ('children' in item && item.children && item.children.length > 0) {
+          // 在多选模式下，带 children 的项目可以选择（全选该子菜单）
+          if (isSelectable && multiple) {
+            // 收集该子菜单所有可选择的子项值
+            var collectChildValues = function collectChildValues(items) {
+              var values = [];
+              items.forEach(function (item) {
+                if ('value' in item && item.value && !item.value.startsWith('selectAll')) {
+                  // 包含当前项的值（无论是否有子项）
+                  values.push(item.value);
+                }
+                if ('children' in item && item.children) {
+                  // 如果有子项，递归收集子项
+                  values.push.apply(values, _toConsumableArray(collectChildValues(item.children)));
+                }
+              });
+              return values;
+            };
+            var childValues = collectChildValues(item.children);
+            var allChildrenSelected = Array.isArray(selectedValue) && childValues.length > 0 && childValues.every(function (val) {
+              return selectedValue.includes(val);
             });
-            return values;
-          };
-          var childValues = collectChildValues(item.children);
-          var allChildrenSelected = Array.isArray(selectedValue) && childValues.length > 0 && childValues.every(function (val) {
-            return selectedValue.includes(val);
-          });
-          return /*#__PURE__*/React.createElement(DropdownMenuSub, {
-            key: key
-          }, /*#__PURE__*/React.createElement(DropdownMenuSubTrigger, {
-            disabled: item.disabled,
-            onClick: function onClick(event) {
-              event.preventDefault();
-              event.stopPropagation();
-
-              // 切换该子菜单的全选状态
-              var currentValues = Array.isArray(selectedValue) ? selectedValue : [];
-              var newValues;
-              if (allChildrenSelected) {
-                // 如果全选中，则取消选中该子菜单所有项（包括自己）
-                var allValuesToRemove = _toConsumableArray(childValues);
-                if (item.value) {
-                  allValuesToRemove.push(item.value);
+            return /*#__PURE__*/React.createElement(DropdownItemHoverFill, {
+              key: key,
+              disabled: item.disabled
+            }, /*#__PURE__*/React.createElement(DropdownMenuSub, null, /*#__PURE__*/React.createElement(DropdownMenuSubTrigger, {
+              disabled: item.disabled,
+              onClick: function onClick(event) {
+                event.preventDefault();
+                event.stopPropagation();
+
+                // 切换该子菜单的全选状态
+                var currentValues = Array.isArray(selectedValue) ? selectedValue : [];
+                var newValues;
+                if (allChildrenSelected) {
+                  // 如果全选中，则取消选中该子菜单所有项（包括自己）
+                  var allValuesToRemove = _toConsumableArray(childValues);
+                  if (item.value) {
+                    allValuesToRemove.push(item.value);
+                  }
+                  newValues = currentValues.filter(function (val) {
+                    return !allValuesToRemove.includes(val);
+                  });
+                } else {
+                  // 如果未全选中，则选中该子菜单所有项（包括自己）
+                  var allValuesToAdd = _toConsumableArray(childValues);
+                  if (item.value) {
+                    allValuesToAdd.push(item.value);
+                  }
+                  var uniqueValues = new Set([].concat(_toConsumableArray(currentValues), _toConsumableArray(allValuesToAdd)));
+                  newValues = Array.from(uniqueValues);
                 }
-                newValues = currentValues.filter(function (val) {
-                  return !allValuesToRemove.includes(val);
-                });
-              } else {
-                // 如果未全选中，则选中该子菜单所有项（包括自己）
-                var allValuesToAdd = _toConsumableArray(childValues);
-                if (item.value) {
-                  allValuesToAdd.push(item.value);
+
+                // 直接调用 rawOnSelect
+                if (rawOnSelect) {
+                  rawOnSelect(newValues);
                 }
-                var uniqueValues = new Set([].concat(_toConsumableArray(currentValues), _toConsumableArray(allValuesToAdd)));
-                newValues = Array.from(uniqueValues);
               }
+            }, /*#__PURE__*/React.createElement(Checkbox, {
+              checked: allChildrenSelected,
+              indeterminate: !allChildrenSelected && Array.isArray(selectedValue) && childValues.some(function (val) {
+                return selectedValue.includes(val);
+              }),
+              "data-odn-dropdown-checkbox": true
+            }), item.label), /*#__PURE__*/React.createElement(DropdownMenuSubContent, {
+              zIndex: menuZIndex,
+              className: popupClassName
+            }, item.children.map(function (child, childIndex) {
+              return renderMenuItem(child, childIndex, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex, popupClassName);
+            }))));
+          }
 
-              // 直接调用 rawOnSelect
-              if (rawOnSelect) {
-                rawOnSelect(newValues);
-              }
-            }
-          }, /*#__PURE__*/React.createElement(Checkbox, {
-            checked: allChildrenSelected,
-            indeterminate: !allChildrenSelected && Array.isArray(selectedValue) && childValues.some(function (val) {
-              return selectedValue.includes(val);
-            }),
-            "data-odn-dropdown-checkbox": true
-          }), item.label), /*#__PURE__*/React.createElement(DropdownMenuSubContent, {
-            zIndex: menuZIndex
+          // 普通子菜单渲染（单选模式或非选择模式）
+          return /*#__PURE__*/React.createElement(DropdownItemHoverFill, {
+            key: key,
+            disabled: item.disabled
+          }, /*#__PURE__*/React.createElement(DropdownMenuSub, null, /*#__PURE__*/React.createElement(DropdownMenuSubTrigger, {
+            disabled: item.disabled,
+            icon: item.icon
+          }, item.label), /*#__PURE__*/React.createElement(DropdownMenuSubContent, {
+            zIndex: menuZIndex,
+            className: popupClassName
           }, item.children.map(function (child, childIndex) {
-            return renderMenuItem(child, childIndex, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex);
-          })));
+            return renderMenuItem(child, childIndex, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex, popupClassName);
+          }))));
         }
 
-        // 普通子菜单渲染（单选模式或非选择模式）
-        return /*#__PURE__*/React.createElement(DropdownMenuSub, {
-          key: key
-        }, /*#__PURE__*/React.createElement(DropdownMenuSubTrigger, {
-          disabled: item.disabled
-        }, item.label), /*#__PURE__*/React.createElement(DropdownMenuSubContent, {
-          zIndex: menuZIndex
-        }, item.children.map(function (child, childIndex) {
-          return renderMenuItem(child, childIndex, _onSelect, onItemClick, isSelectable, multiple, selectedValue, rawOnSelect, menu, layerMapping, menuZIndex);
-        })));
-      }
+        // 普通菜单项
+        // 计算是否选中
+        var isSelected = false;
+        if (isSelectable && selectedValue !== undefined) {
+          if (!multiple) {
+            isSelected = selectedValue === item.value;
+          } else if (Array.isArray(selectedValue)) {
+            var _item$value;
+            // 对于全选按钮，检查该层的所有选项是否都被选中
+            if ((_item$value = item.value) !== null && _item$value !== void 0 && _item$value.startsWith('selectAll') && layerMapping && item.value) {
+              var layerValues = layerMapping[item.value];
+              if (layerValues) {
+                isSelected = layerValues.length > 0 && layerValues.every(function (val) {
+                  return selectedValue.includes(val);
+                });
+              }
+            } else {
+              // 普通选项，直接检查是否在选中列表中
+              isSelected = selectedValue.includes(item.value);
+            }
+          }
+        }
+        return /*#__PURE__*/React.createElement(DropdownMenuItem, {
+          key: key,
+          disabled: item.disabled,
+          closeOnClick: !(isSelectable && multiple),
+          onSelect: function onSelect(event) {
+            // 多选模式下，所有项都不关闭菜单
+            var shouldKeepOpen = isSelectable && multiple;
+            if (shouldKeepOpen) {
+              event.preventDefault();
+            }
+            _onSelect === null || _onSelect === void 0 || _onSelect(item.value);
 
-      // 普通菜单项
-      // 计算是否选中
-      var isSelected = false;
-      if (isSelectable && selectedValue !== undefined) {
-        if (!multiple) {
-          isSelected = selectedValue === item.value;
-        } else if (Array.isArray(selectedValue)) {
-          var _item$value;
-          // 对于全选按钮，检查该层的所有选项是否都被选中
-          if ((_item$value = item.value) !== null && _item$value !== void 0 && _item$value.startsWith('selectAll') && layerMapping && item.value) {
+            // 只有在非保持打开的情况下才调用 onItemClick（关闭菜单）
+            if (!shouldKeepOpen) {
+              onItemClick === null || onItemClick === void 0 || onItemClick();
+            }
+          }
+        }, isSelectable && !multiple && /*#__PURE__*/React.createElement(Radio.Group, {
+          value: isSelected ? item.value : '',
+          options: [{
+            label: '',
+            value: item.value
+          }],
+          "data-odn-dropdown-radio": true
+        }), isSelectable && multiple && /*#__PURE__*/React.createElement(Checkbox, {
+          checked: isSelected,
+          indeterminate: (_item$value2 = item.value) !== null && _item$value2 !== void 0 && _item$value2.startsWith('selectAll') && layerMapping && item.value && Array.isArray(selectedValue) ? function () {
             var layerValues = layerMapping[item.value];
             if (layerValues) {
-              isSelected = layerValues.length > 0 && layerValues.every(function (val) {
+              var selectedCount = layerValues.filter(function (val) {
                 return selectedValue.includes(val);
-              });
+              }).length;
+              // indeterminate 只在部分选中时显示（既不是全选也不是全不选）
+              return selectedCount > 0 && selectedCount < layerValues.length;
             }
-          } else {
-            // 普通选项，直接检查是否在选中列表中
-            isSelected = selectedValue.includes(item.value);
-          }
-        }
+            return false;
+          }() : false,
+          "data-odn-dropdown-checkbox": true
+        }), item.icon && /*#__PURE__*/React.createElement(Icon, {
+          name: item.icon,
+          "data-odn-dropdown-item-icon": true
+        }), /*#__PURE__*/React.createElement("span", {
+          "data-odn-dropdown-item-label": true
+        }, item.label), item.shortcut && /*#__PURE__*/React.createElement(DropdownMenuShortcut, null, item.shortcut));
       }
-      return /*#__PURE__*/React.createElement(DropdownMenuItem, {
-        key: key,
-        disabled: item.disabled,
-        closeOnClick: !(isSelectable && multiple),
-        onSelect: function onSelect(event) {
-          // 多选模式下，所有项都不关闭菜单
-          var shouldKeepOpen = isSelectable && multiple;
-          if (shouldKeepOpen) {
-            event.preventDefault();
-          }
-          _onSelect === null || _onSelect === void 0 || _onSelect(item.value);
-
-          // 只有在非保持打开的情况下才调用 onItemClick（关闭菜单）
-          if (!shouldKeepOpen) {
-            onItemClick === null || onItemClick === void 0 || onItemClick();
-          }
-        }
-      }, isSelectable && !multiple && /*#__PURE__*/React.createElement(Radio.Group, {
-        value: isSelected ? item.value : '',
-        options: [{
-          label: '',
-          value: item.value
-        }],
-        "data-odn-dropdown-radio": true
-      }), isSelectable && multiple && /*#__PURE__*/React.createElement(Checkbox, {
-        checked: isSelected,
-        indeterminate: (_item$value2 = item.value) !== null && _item$value2 !== void 0 && _item$value2.startsWith('selectAll') && layerMapping && item.value && Array.isArray(selectedValue) ? function () {
-          var layerValues = layerMapping[item.value];
-          if (layerValues) {
-            var selectedCount = layerValues.filter(function (val) {
-              return selectedValue.includes(val);
-            }).length;
-            // indeterminate 只在部分选中时显示（既不是全选也不是全不选）
-            return selectedCount > 0 && selectedCount < layerValues.length;
-          }
-          return false;
-        }() : false,
-        "data-odn-dropdown-checkbox": true
-      }), item.icon && /*#__PURE__*/React.createElement(Icon, {
-        name: item.icon,
-        "data-odn-dropdown-item-icon": true
-      }), /*#__PURE__*/React.createElement("span", {
-        "data-odn-dropdown-item-label": true
-      }, item.label), item.shortcut && /*#__PURE__*/React.createElement(DropdownMenuShortcut, null, item.shortcut));
   }
 };
 
@@ -601,7 +632,7 @@ var Dropdown = function Dropdown(props) {
   var layerMapping = useMemo(function () {
     var mapping = {};
     var collectLayerValues = function collectLayerValues(items) {
-      var processItem = function processItem(item, parentItem) {
+      var processItem = function processItem(item) {
         // 如果该项有 children，为其创建全选映射
         if ('value' in item && 'children' in item && item.children) {
           // 收集该层的所有后代项值（不包括全选按钮），包括直接子项和所有后代
@@ -636,7 +667,7 @@ var Dropdown = function Dropdown(props) {
 
           // 递归处理子项，传递当前项作为父项
           item.children.forEach(function (child) {
-            processItem(child, item);
+            processItem(child);
           });
         }
       };
@@ -737,10 +768,10 @@ var Dropdown = function Dropdown(props) {
         var parentChildMap = processedMenu ? buildParentChildMap(processedMenu) : {};
 
         // 检查每个父项是否应该被自动选中或取消选中
-        Object.entries(parentChildMap).forEach(function (_ref18) {
-          var _ref19 = _slicedToArray(_ref18, 2),
-            parent = _ref19[0],
-            children = _ref19[1];
+        Object.entries(parentChildMap).forEach(function (_ref19) {
+          var _ref20 = _slicedToArray(_ref19, 2),
+            parent = _ref20[0],
+            children = _ref20[1];
           var allChildrenSelected = children.every(function (child) {
             return processedValues.includes(child);
           });
@@ -852,7 +883,7 @@ var Dropdown = function Dropdown(props) {
   }, [trigger, visible, onVisibleChange]);
 
   // 处理状态变化
-  var handleOpenChange = useCallback(function (open, _eventDetails) {
+  var handleOpenChange = useCallback(function (open) {
     if (trigger === 'click' && !disabled) {
       onVisibleChange === null || onVisibleChange === void 0 || onVisibleChange(open);
     }
@@ -882,7 +913,7 @@ var Dropdown = function Dropdown(props) {
       onMouseEnter: handleContentMouseEnter,
       onMouseLeave: handleContentMouseLeave
     }, processedMenu === null || processedMenu === void 0 ? void 0 : processedMenu.map(function (item, index) {
-      return renderMenuItem(item, index, onSelect, handleItemClick, isSelectable, multiple, selectedValue, rawOnSelect, processedMenu, layerMapping, zIndex);
+      return renderMenuItem(item, index, onSelect, handleItemClick, isSelectable, multiple, selectedValue, rawOnSelect, processedMenu, layerMapping, zIndex, popupClassName);
     }))));
   }
 
@@ -903,7 +934,7 @@ var Dropdown = function Dropdown(props) {
     zIndex: zIndex,
     className: popupClassName
   }, processedMenu === null || processedMenu === void 0 ? void 0 : processedMenu.map(function (item, index) {
-    return renderMenuItem(item, index, onSelect, undefined, isSelectable, multiple, selectedValue, rawOnSelect, processedMenu, layerMapping, zIndex);
+    return renderMenuItem(item, index, onSelect, undefined, isSelectable, multiple, selectedValue, rawOnSelect, processedMenu, layerMapping, zIndex, popupClassName);
   })));
 };