rsuite 5.10.0 → 5.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (170) hide show
  1. package/ButtonToolbar/styles/index.less +1 -1
  2. package/CHANGELOG.md +28 -0
  3. package/Nav/styles/index.less +7 -1
  4. package/Navbar/styles/index.less +6 -1
  5. package/README.md +4 -0
  6. package/Sidenav/styles/index.less +7 -5
  7. package/cjs/Cascader/DropdownMenu.js +8 -3
  8. package/cjs/DateRangePicker/DateRangePicker.d.ts +2 -0
  9. package/cjs/DateRangePicker/DateRangePicker.js +4 -2
  10. package/cjs/Disclosure/Disclosure.d.ts +1 -1
  11. package/cjs/Disclosure/DisclosureContext.d.ts +1 -1
  12. package/cjs/Dropdown/Dropdown.js +26 -110
  13. package/cjs/Dropdown/DropdownItem.js +14 -58
  14. package/cjs/Dropdown/DropdownMenu.js +32 -76
  15. package/cjs/Dropdown/DropdownToggle.js +4 -17
  16. package/cjs/Form/Form.js +21 -7
  17. package/cjs/Form/FormContext.d.ts +18 -13
  18. package/cjs/Form/useSchemaModel.d.ts +9 -0
  19. package/cjs/Form/useSchemaModel.js +46 -0
  20. package/cjs/FormControl/FormControl.d.ts +3 -0
  21. package/cjs/FormControl/FormControl.js +9 -2
  22. package/cjs/FormControl/useRegisterModel.d.ts +4 -0
  23. package/cjs/FormControl/useRegisterModel.js +20 -0
  24. package/cjs/Menu/Menu.d.ts +1 -0
  25. package/cjs/Menu/Menu.js +1 -0
  26. package/cjs/Menu/MenuItem.d.ts +1 -0
  27. package/cjs/Menu/MenuItem.js +1 -0
  28. package/cjs/Menu/Menubar.d.ts +3 -0
  29. package/cjs/Menu/Menubar.js +14 -3
  30. package/cjs/Nav/Nav.d.ts +7 -2
  31. package/cjs/Nav/Nav.js +105 -5
  32. package/cjs/Nav/NavContext.d.ts +2 -8
  33. package/cjs/Nav/NavContext.js +1 -7
  34. package/cjs/Nav/NavDropdown.d.ts +71 -0
  35. package/cjs/Nav/NavDropdown.js +193 -0
  36. package/cjs/Nav/NavDropdownItem.d.ts +39 -0
  37. package/cjs/Nav/NavDropdownItem.js +141 -0
  38. package/cjs/Nav/NavDropdownMenu.d.ts +26 -0
  39. package/cjs/Nav/NavDropdownMenu.js +156 -0
  40. package/cjs/Nav/NavDropdownToggle.d.ts +21 -0
  41. package/cjs/Nav/NavDropdownToggle.js +74 -0
  42. package/cjs/Nav/NavItem.d.ts +2 -0
  43. package/cjs/Nav/NavItem.js +13 -26
  44. package/cjs/Nav/NavMenu.d.ts +38 -0
  45. package/cjs/Nav/NavMenu.js +122 -0
  46. package/cjs/Navbar/NavbarDropdown.d.ts +57 -0
  47. package/cjs/Navbar/NavbarDropdown.js +147 -0
  48. package/cjs/Navbar/NavbarDropdownItem.d.ts +41 -0
  49. package/cjs/Navbar/NavbarDropdownItem.js +149 -0
  50. package/cjs/Navbar/NavbarDropdownMenu.d.ts +37 -0
  51. package/cjs/Navbar/NavbarDropdownMenu.js +155 -0
  52. package/cjs/Navbar/NavbarDropdownToggle.d.ts +19 -0
  53. package/cjs/Navbar/NavbarDropdownToggle.js +72 -0
  54. package/cjs/Navbar/NavbarItem.d.ts +5 -2
  55. package/cjs/Navbar/NavbarItem.js +10 -4
  56. package/cjs/Picker/utils.js +22 -15
  57. package/cjs/Sidenav/ExpandedSidenavDropdown.d.ts +43 -0
  58. package/cjs/Sidenav/ExpandedSidenavDropdown.js +166 -0
  59. package/cjs/Sidenav/ExpandedSidenavDropdownItem.d.ts +31 -0
  60. package/cjs/Sidenav/ExpandedSidenavDropdownItem.js +141 -0
  61. package/cjs/Sidenav/ExpandedSidenavDropdownMenu.d.ts +26 -0
  62. package/cjs/Sidenav/ExpandedSidenavDropdownMenu.js +145 -0
  63. package/cjs/Sidenav/Sidenav.d.ts +8 -2
  64. package/cjs/Sidenav/Sidenav.js +1 -2
  65. package/cjs/Sidenav/SidenavDropdown.d.ts +30 -8
  66. package/cjs/Sidenav/SidenavDropdown.js +144 -73
  67. package/cjs/Sidenav/SidenavDropdownItem.d.ts +22 -5
  68. package/cjs/Sidenav/SidenavDropdownItem.js +88 -72
  69. package/cjs/Sidenav/SidenavDropdownMenu.d.ts +26 -16
  70. package/cjs/Sidenav/SidenavDropdownMenu.js +122 -90
  71. package/cjs/Sidenav/SidenavDropdownToggle.d.ts +19 -0
  72. package/cjs/Sidenav/SidenavDropdownToggle.js +72 -0
  73. package/cjs/Sidenav/SidenavItem.d.ts +3 -0
  74. package/cjs/Sidenav/SidenavItem.js +22 -14
  75. package/cjs/utils/deprecateComponent.js +4 -6
  76. package/cjs/utils/deprecatePropType.d.ts +1 -5
  77. package/cjs/utils/deprecatePropType.js +7 -14
  78. package/cjs/utils/dom.d.ts +1 -1
  79. package/cjs/utils/useInternalId.d.ts +1 -1
  80. package/cjs/utils/useInternalId.js +2 -2
  81. package/cjs/utils/warnOnce.d.ts +9 -0
  82. package/cjs/utils/warnOnce.js +22 -0
  83. package/dist/rsuite-rtl.css +19 -10
  84. package/dist/rsuite-rtl.min.css +1 -1
  85. package/dist/rsuite-rtl.min.css.map +1 -1
  86. package/dist/rsuite.css +19 -10
  87. package/dist/rsuite.js +300 -25
  88. package/dist/rsuite.js.map +1 -1
  89. package/dist/rsuite.min.css +1 -1
  90. package/dist/rsuite.min.css.map +1 -1
  91. package/dist/rsuite.min.js +1 -1
  92. package/dist/rsuite.min.js.map +1 -1
  93. package/esm/Cascader/DropdownMenu.js +8 -3
  94. package/esm/DateRangePicker/DateRangePicker.d.ts +2 -0
  95. package/esm/DateRangePicker/DateRangePicker.js +4 -2
  96. package/esm/Disclosure/Disclosure.d.ts +1 -1
  97. package/esm/Disclosure/DisclosureContext.d.ts +1 -1
  98. package/esm/Dropdown/Dropdown.js +25 -105
  99. package/esm/Dropdown/DropdownItem.js +13 -55
  100. package/esm/Dropdown/DropdownMenu.js +31 -76
  101. package/esm/Dropdown/DropdownToggle.js +4 -14
  102. package/esm/Form/Form.js +19 -7
  103. package/esm/Form/FormContext.d.ts +18 -13
  104. package/esm/Form/useSchemaModel.d.ts +9 -0
  105. package/esm/Form/useSchemaModel.js +39 -0
  106. package/esm/FormControl/FormControl.d.ts +3 -0
  107. package/esm/FormControl/FormControl.js +9 -6
  108. package/esm/FormControl/useRegisterModel.d.ts +4 -0
  109. package/esm/FormControl/useRegisterModel.js +14 -0
  110. package/esm/Menu/Menu.d.ts +1 -0
  111. package/esm/Menu/Menu.js +1 -0
  112. package/esm/Menu/MenuItem.d.ts +1 -0
  113. package/esm/Menu/MenuItem.js +1 -0
  114. package/esm/Menu/Menubar.d.ts +3 -0
  115. package/esm/Menu/Menubar.js +13 -3
  116. package/esm/Nav/Nav.d.ts +7 -2
  117. package/esm/Nav/Nav.js +96 -5
  118. package/esm/Nav/NavContext.d.ts +2 -8
  119. package/esm/Nav/NavContext.js +1 -6
  120. package/esm/Nav/NavDropdown.d.ts +71 -0
  121. package/esm/Nav/NavDropdown.js +170 -0
  122. package/esm/Nav/NavDropdownItem.d.ts +39 -0
  123. package/esm/Nav/NavDropdownItem.js +123 -0
  124. package/esm/Nav/NavDropdownMenu.d.ts +26 -0
  125. package/esm/Nav/NavDropdownMenu.js +138 -0
  126. package/esm/Nav/NavDropdownToggle.d.ts +21 -0
  127. package/esm/Nav/NavDropdownToggle.js +57 -0
  128. package/esm/Nav/NavItem.d.ts +2 -0
  129. package/esm/Nav/NavItem.js +13 -21
  130. package/esm/Nav/NavMenu.d.ts +38 -0
  131. package/esm/Nav/NavMenu.js +98 -0
  132. package/esm/Navbar/NavbarDropdown.d.ts +57 -0
  133. package/esm/Navbar/NavbarDropdown.js +124 -0
  134. package/esm/Navbar/NavbarDropdownItem.d.ts +41 -0
  135. package/esm/Navbar/NavbarDropdownItem.js +128 -0
  136. package/esm/Navbar/NavbarDropdownMenu.d.ts +37 -0
  137. package/esm/Navbar/NavbarDropdownMenu.js +135 -0
  138. package/esm/Navbar/NavbarDropdownToggle.d.ts +19 -0
  139. package/esm/Navbar/NavbarDropdownToggle.js +55 -0
  140. package/esm/Navbar/NavbarItem.d.ts +5 -2
  141. package/esm/Navbar/NavbarItem.js +11 -4
  142. package/esm/Picker/utils.js +22 -14
  143. package/esm/Sidenav/ExpandedSidenavDropdown.d.ts +43 -0
  144. package/esm/Sidenav/ExpandedSidenavDropdown.js +140 -0
  145. package/esm/Sidenav/ExpandedSidenavDropdownItem.d.ts +31 -0
  146. package/esm/Sidenav/ExpandedSidenavDropdownItem.js +120 -0
  147. package/esm/Sidenav/ExpandedSidenavDropdownMenu.d.ts +26 -0
  148. package/esm/Sidenav/ExpandedSidenavDropdownMenu.js +121 -0
  149. package/esm/Sidenav/Sidenav.d.ts +8 -2
  150. package/esm/Sidenav/Sidenav.js +1 -2
  151. package/esm/Sidenav/SidenavDropdown.d.ts +30 -8
  152. package/esm/Sidenav/SidenavDropdown.js +145 -75
  153. package/esm/Sidenav/SidenavDropdownItem.d.ts +22 -5
  154. package/esm/Sidenav/SidenavDropdownItem.js +87 -71
  155. package/esm/Sidenav/SidenavDropdownMenu.d.ts +26 -16
  156. package/esm/Sidenav/SidenavDropdownMenu.js +122 -86
  157. package/esm/Sidenav/SidenavDropdownToggle.d.ts +19 -0
  158. package/esm/Sidenav/SidenavDropdownToggle.js +55 -0
  159. package/esm/Sidenav/SidenavItem.d.ts +3 -0
  160. package/esm/Sidenav/SidenavItem.js +23 -15
  161. package/esm/utils/deprecateComponent.js +3 -4
  162. package/esm/utils/deprecatePropType.d.ts +1 -5
  163. package/esm/utils/deprecatePropType.js +3 -13
  164. package/esm/utils/dom.d.ts +1 -1
  165. package/esm/utils/useInternalId.d.ts +1 -1
  166. package/esm/utils/useInternalId.js +2 -2
  167. package/esm/utils/warnOnce.d.ts +9 -0
  168. package/esm/utils/warnOnce.js +18 -0
  169. package/package.json +1 -1
  170. package/styles/variables.less +1 -0
@@ -0,0 +1,156 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
6
+
7
+ exports.__esModule = true;
8
+ exports.default = void 0;
9
+
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+
12
+ var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
13
+
14
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
15
+
16
+ var _react = _interopRequireWildcard(require("react"));
17
+
18
+ var _omit2 = _interopRequireDefault(require("lodash/omit"));
19
+
20
+ var _Menu = _interopRequireDefault(require("../Menu/Menu"));
21
+
22
+ var _MenuItem = _interopRequireDefault(require("../Menu/MenuItem"));
23
+
24
+ var _utils = require("../utils");
25
+
26
+ var _propTypes = _interopRequireDefault(require("prop-types"));
27
+
28
+ var _AngleLeft = _interopRequireDefault(require("@rsuite/icons/legacy/AngleLeft"));
29
+
30
+ var _AngleRight = _interopRequireDefault(require("@rsuite/icons/legacy/AngleRight"));
31
+
32
+ var _useCustom2 = _interopRequireDefault(require("../utils/useCustom"));
33
+
34
+ var _NavContext = _interopRequireDefault(require("./NavContext"));
35
+
36
+ var _templateObject, _templateObject2;
37
+
38
+ /**
39
+ * @private
40
+ */
41
+ var NavDropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
42
+ var nav = (0, _react.useContext)(_NavContext.default);
43
+
44
+ if (!nav) {
45
+ throw new Error('<Nav.Dropdown.Menu> should be used within a <Nav> component.');
46
+ }
47
+
48
+ var onToggle = props.onToggle,
49
+ eventKey = props.eventKey,
50
+ title = props.title,
51
+ _props$classPrefix = props.classPrefix,
52
+ classPrefix = _props$classPrefix === void 0 ? 'dropdown-menu' : _props$classPrefix,
53
+ children = props.children,
54
+ rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["onToggle", "eventKey", "title", "classPrefix", "children"]);
55
+
56
+ var _useCustom = (0, _useCustom2.default)('DropdownMenu'),
57
+ rtl = _useCustom.rtl;
58
+
59
+ var handleToggleSubmenu = (0, _react.useCallback)(function (open, event) {
60
+ onToggle === null || onToggle === void 0 ? void 0 : onToggle(open, eventKey, event);
61
+ }, [eventKey, onToggle]);
62
+
63
+ var _useClassNames = (0, _utils.useClassNames)(classPrefix),
64
+ prefix = _useClassNames.prefix;
65
+
66
+ var _useClassNames2 = (0, _utils.useClassNames)('dropdown-menu'),
67
+ withMenuClassPrefix = _useClassNames2.withClassPrefix,
68
+ mergeMenuClassName = _useClassNames2.merge;
69
+
70
+ var _useClassNames3 = (0, _utils.useClassNames)('dropdown-item'),
71
+ mergeItemClassNames = _useClassNames3.merge,
72
+ withItemClassPrefix = _useClassNames3.withClassPrefix,
73
+ prefixItemClassName = _useClassNames3.prefix; // Parent menu exists. This is a submenu.
74
+ // Should render a `menuitem` that controls this submenu.
75
+
76
+
77
+ var _omit = (0, _omit2.default)(rest, ['trigger']),
78
+ icon = _omit.icon,
79
+ className = _omit.className,
80
+ disabled = _omit.disabled,
81
+ menuProps = (0, _objectWithoutPropertiesLoose2.default)(_omit, ["icon", "className", "disabled"]);
82
+
83
+ var Icon = rtl ? _AngleLeft.default : _AngleRight.default;
84
+ return /*#__PURE__*/_react.default.createElement(_Menu.default, {
85
+ openMenuOn: ['mouseover', 'click'],
86
+ renderMenuButton: function renderMenuButton(_ref, buttonRef) {
87
+ var open = _ref.open,
88
+ menuButtonProps = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["open"]);
89
+ return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {
90
+ disabled: disabled
91
+ }, function (_ref2, menuitemRef) {
92
+ var selected = _ref2.selected,
93
+ active = _ref2.active,
94
+ menuitem = (0, _objectWithoutPropertiesLoose2.default)(_ref2, ["selected", "active"]);
95
+ var classes = mergeItemClassNames(className, prefixItemClassName(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["toggle"]))), withItemClassPrefix({
96
+ 'with-icon': icon,
97
+ open: open,
98
+ active: selected,
99
+ disabled: disabled,
100
+ focus: active
101
+ }));
102
+ return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
103
+ ref: (0, _utils.mergeRefs)(buttonRef, menuitemRef),
104
+ className: classes,
105
+ "data-event-key": eventKey,
106
+ "data-event-key-type": typeof eventKey
107
+ }, menuitem, (0, _omit2.default)(menuButtonProps, ['role'])), icon && /*#__PURE__*/_react.default.cloneElement(icon, {
108
+ className: prefix('menu-icon')
109
+ }), title, /*#__PURE__*/_react.default.createElement(Icon, {
110
+ className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["toggle-icon"])))
111
+ }));
112
+ });
113
+ },
114
+ renderMenuPopup: function renderMenuPopup(_ref3, popupRef) {
115
+ var open = _ref3.open,
116
+ popupProps = (0, _objectWithoutPropertiesLoose2.default)(_ref3, ["open"]);
117
+ var menuClassName = mergeMenuClassName(className, withMenuClassPrefix());
118
+ return /*#__PURE__*/_react.default.createElement("ul", (0, _extends2.default)({
119
+ ref: popupRef,
120
+ className: menuClassName,
121
+ hidden: !open
122
+ }, popupProps, menuProps), children);
123
+ },
124
+ onToggleMenu: handleToggleSubmenu
125
+ }, function (_ref4, menuContainerRef) {
126
+ var open = _ref4.open,
127
+ menuContainer = (0, _objectWithoutPropertiesLoose2.default)(_ref4, ["open"]);
128
+ var classes = mergeItemClassNames(className, withItemClassPrefix({
129
+ disabled: disabled,
130
+ open: open,
131
+ submenu: true
132
+ }));
133
+ return /*#__PURE__*/_react.default.createElement("li", (0, _extends2.default)({
134
+ ref: (0, _utils.mergeRefs)(ref, menuContainerRef),
135
+ className: classes
136
+ }, menuContainer));
137
+ });
138
+ });
139
+
140
+ NavDropdownMenu.displayName = 'Nav.Dropdown.Menu';
141
+ NavDropdownMenu.propTypes = {
142
+ active: _propTypes.default.bool,
143
+ className: _propTypes.default.string,
144
+ children: _propTypes.default.node,
145
+ icon: _propTypes.default.any,
146
+ classPrefix: _propTypes.default.string,
147
+ pullLeft: _propTypes.default.bool,
148
+ title: _propTypes.default.node,
149
+ open: _propTypes.default.bool,
150
+ eventKey: _propTypes.default.any,
151
+ expanded: _propTypes.default.bool,
152
+ collapsible: _propTypes.default.bool,
153
+ onToggle: _propTypes.default.func
154
+ };
155
+ var _default = NavDropdownMenu;
156
+ exports.default = _default;
@@ -0,0 +1,21 @@
1
+ import React from 'react';
2
+ import Button from '../Button';
3
+ import { WithAsProps, RsRefForwardingComponent, TypeAttributes } from '../@types/common';
4
+ import { NavItemProps } from './NavItem';
5
+ export interface NavDropdownToggleProps extends WithAsProps {
6
+ icon?: NavItemProps['icon'];
7
+ noCaret?: boolean;
8
+ renderToggle?: (props: WithAsProps, ref: React.Ref<any>) => any;
9
+ placement?: TypeAttributes.Placement8;
10
+ }
11
+ /**
12
+ * @private this component is not supposed to be used directly
13
+ * Instead it's rendered by a <Nav.Menu> call
14
+ *
15
+ * <Nav>
16
+ * <Nav.Menu> -> This will render <NavDropdown> component that renders a <NavDropdownToggle>
17
+ * </Nav.Menu>
18
+ * </Nav>
19
+ */
20
+ declare const NavDropdownToggle: RsRefForwardingComponent<typeof Button, NavDropdownToggleProps>;
21
+ export default NavDropdownToggle;
@@ -0,0 +1,74 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ exports.__esModule = true;
6
+ exports.default = void 0;
7
+
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+
10
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
+
12
+ var _react = _interopRequireDefault(require("react"));
13
+
14
+ var _propTypes = _interopRequireDefault(require("prop-types"));
15
+
16
+ var _ArrowDownLine = _interopRequireDefault(require("@rsuite/icons/ArrowDownLine"));
17
+
18
+ var _utils = require("../utils");
19
+
20
+ var _NavItem = _interopRequireDefault(require("./NavItem"));
21
+
22
+ /**
23
+ * @private this component is not supposed to be used directly
24
+ * Instead it's rendered by a <Nav.Menu> call
25
+ *
26
+ * <Nav>
27
+ * <Nav.Menu> -> This will render <NavDropdown> component that renders a <NavDropdownToggle>
28
+ * </Nav.Menu>
29
+ * </Nav>
30
+ */
31
+ var NavDropdownToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
32
+ var _props$as = props.as,
33
+ Component = _props$as === void 0 ? _NavItem.default : _props$as,
34
+ className = props.className,
35
+ _props$classPrefix = props.classPrefix,
36
+ classPrefix = _props$classPrefix === void 0 ? 'dropdown-toggle' : _props$classPrefix,
37
+ renderToggle = props.renderToggle,
38
+ children = props.children,
39
+ noCaret = props.noCaret,
40
+ rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "renderToggle", "children", "noCaret"]);
41
+
42
+ var _useClassNames = (0, _utils.useClassNames)(classPrefix),
43
+ withClassPrefix = _useClassNames.withClassPrefix,
44
+ merge = _useClassNames.merge;
45
+
46
+ var _useClassNames2 = (0, _utils.useClassNames)('nav-item'),
47
+ prefixNavItem = _useClassNames2.prefix;
48
+
49
+ var classes = merge(className, withClassPrefix({
50
+ 'no-caret': noCaret
51
+ }));
52
+
53
+ var toggle = /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
54
+ ref: ref,
55
+ className: classes
56
+ }), children, !noCaret && /*#__PURE__*/_react.default.createElement(_ArrowDownLine.default, {
57
+ className: prefixNavItem('caret')
58
+ }));
59
+
60
+ return renderToggle ? renderToggle(rest, ref) : toggle;
61
+ });
62
+
63
+ NavDropdownToggle.displayName = 'Nav.Dropdown.Toggle';
64
+ NavDropdownToggle.propTypes = {
65
+ className: _propTypes.default.string,
66
+ children: _propTypes.default.node,
67
+ classPrefix: _propTypes.default.string,
68
+ noCaret: _propTypes.default.bool,
69
+ as: _propTypes.default.elementType,
70
+ renderToggle: _propTypes.default.func,
71
+ placement: _propTypes.default.oneOf(['bottomStart', 'bottomEnd', 'topStart', 'topEnd', 'leftStart', 'rightStart', 'leftEnd', 'rightEnd'])
72
+ };
73
+ var _default = NavDropdownToggle;
74
+ exports.default = _default;
@@ -21,6 +21,8 @@ export interface NavItemProps<T = string> extends WithAsProps, Omit<React.HTMLAt
21
21
  }
22
22
  /**
23
23
  * The <Nav.Item> API
24
+ * When used as direct child of <Nav>, render the NavItem
25
+ * When used within a <Nav.Menu>, render the NavDropdownItem
24
26
  */
25
27
  declare const NavItem: RsRefForwardingComponent<'a', NavItemProps>;
26
28
  export default NavItem;
@@ -23,20 +23,20 @@ var _SafeAnchor = _interopRequireDefault(require("../SafeAnchor"));
23
23
 
24
24
  var _utils = require("../utils");
25
25
 
26
- var _Sidenav = require("../Sidenav/Sidenav");
27
-
28
26
  var _NavContext = _interopRequireDefault(require("./NavContext"));
29
27
 
30
- var _Navbar = require("../Navbar/Navbar");
31
-
32
- var _SidenavItem = _interopRequireDefault(require("../Sidenav/SidenavItem"));
33
-
34
- var _NavbarItem = _interopRequireDefault(require("../Navbar/NavbarItem"));
35
-
36
28
  /**
37
29
  * The <Nav.Item> API
30
+ * When used as direct child of <Nav>, render the NavItem
31
+ * When used within a <Nav.Menu>, render the NavDropdownItem
38
32
  */
39
33
  var NavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
34
+ var nav = (0, _react.useContext)(_NavContext.default);
35
+
36
+ if (!nav) {
37
+ throw new Error('<Nav.Item> must be rendered within a <Nav> component.');
38
+ }
39
+
40
40
  var _props$as = props.as,
41
41
  Component = _props$as === void 0 ? _SafeAnchor.default : _props$as,
42
42
  activeProp = props.active,
@@ -53,18 +53,13 @@ var NavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
53
53
  onClick = props.onClick,
54
54
  onSelectProp = props.onSelect,
55
55
  rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "active", "disabled", "eventKey", "className", "classPrefix", "style", "children", "icon", "divider", "panel", "onClick", "onSelect"]);
56
-
57
- var _useContext = (0, _react.useContext)(_NavContext.default),
58
- activeKey = _useContext.activeKey,
59
- onSelectFromNav = _useContext.onSelect;
60
-
56
+ var activeKey = nav.activeKey,
57
+ onSelectFromNav = nav.onSelect;
61
58
  var active = activeProp !== null && activeProp !== void 0 ? activeProp : !(0, _isNil.default)(eventKey) && (0, _utils.shallowEqual)(eventKey, activeKey);
62
59
  var emitSelect = (0, _react.useCallback)(function (event) {
63
60
  onSelectProp === null || onSelectProp === void 0 ? void 0 : onSelectProp(eventKey, event);
64
61
  onSelectFromNav === null || onSelectFromNav === void 0 ? void 0 : onSelectFromNav(eventKey, event);
65
62
  }, [eventKey, onSelectProp, onSelectFromNav]);
66
- var navbar = (0, _react.useContext)(_Navbar.NavbarContext);
67
- var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
68
63
 
69
64
  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
70
65
  withClassPrefix = _useClassNames.withClassPrefix,
@@ -82,10 +77,6 @@ var NavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
82
77
  }
83
78
  }, [disabled, emitSelect, onClick]);
84
79
 
85
- if (sidenav) {
86
- return /*#__PURE__*/_react.default.createElement(_SidenavItem.default, props);
87
- }
88
-
89
80
  if (divider) {
90
81
  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
91
82
  ref: ref,
@@ -103,12 +94,6 @@ var NavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
103
94
  }, rest), children);
104
95
  }
105
96
 
106
- if (navbar) {
107
- return /*#__PURE__*/_react.default.createElement(_NavbarItem.default, (0, _extends2.default)({
108
- ref: ref
109
- }, props));
110
- }
111
-
112
97
  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
113
98
  ref: ref,
114
99
  tabIndex: disabled ? -1 : undefined
@@ -117,7 +102,9 @@ var NavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
117
102
  onClick: handleClick,
118
103
  style: style,
119
104
  "aria-selected": active || undefined
120
- }), icon, children, /*#__PURE__*/_react.default.createElement(_Ripple.default, null));
105
+ }), icon && /*#__PURE__*/_react.default.cloneElement(icon, {
106
+ className: prefix('icon')
107
+ }), children, /*#__PURE__*/_react.default.createElement(_Ripple.default, null));
121
108
  });
122
109
 
123
110
  NavItem.displayName = 'Nav.Item';
@@ -0,0 +1,38 @@
1
+ import React, { Dispatch } from 'react';
2
+ import { NavDropdownProps } from './NavDropdown';
3
+ import { NavDropdownMenuProps } from './NavDropdownMenu';
4
+ export interface NavMenuProps extends NavDropdownProps, Omit<NavDropdownMenuProps, 'onToggle'> {
5
+ }
6
+ export declare type NavMenuState = {
7
+ items: {
8
+ _id: any;
9
+ eventKey?: any;
10
+ active: boolean;
11
+ }[];
12
+ };
13
+ export declare type NavMenuContextProps = [NavMenuState, Dispatch<NavMenuAction>];
14
+ export declare const NavMenuContext: React.Context<NavMenuContextProps | null>;
15
+ export declare enum NavMenuActionType {
16
+ RegisterItem = 0,
17
+ UnregisterItem = 1
18
+ }
19
+ export declare type NavMenuAction = {
20
+ type: NavMenuActionType.RegisterItem;
21
+ payload: {
22
+ _id: any;
23
+ eventKey?: any;
24
+ active: boolean;
25
+ };
26
+ } | {
27
+ type: NavMenuActionType.UnregisterItem;
28
+ payload: {
29
+ _id: any;
30
+ };
31
+ };
32
+ /**
33
+ * The <Nav.Menu> API
34
+ * When used as direct child of <Nav>, render the NavDropdown
35
+ * When used within another <Nav.Menu>, render the NavDropdownMenu
36
+ */
37
+ declare const NavMenu: React.ForwardRefExoticComponent<NavMenuProps & React.RefAttributes<any>>;
38
+ export default NavMenu;
@@ -0,0 +1,122 @@
1
+ "use strict";
2
+
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
+
5
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
+
7
+ exports.__esModule = true;
8
+ exports.default = exports.NavMenuActionType = exports.NavMenuContext = void 0;
9
+
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+
12
+ var _react = _interopRequireWildcard(require("react"));
13
+
14
+ var _NavDropdown = _interopRequireDefault(require("./NavDropdown"));
15
+
16
+ var _NavDropdownMenu = _interopRequireDefault(require("./NavDropdownMenu"));
17
+
18
+ var _Sidenav = require("../Sidenav/Sidenav");
19
+
20
+ var _SidenavDropdown = _interopRequireDefault(require("../Sidenav/SidenavDropdown"));
21
+
22
+ var _Navbar = require("../Navbar");
23
+
24
+ var _NavbarDropdown = _interopRequireDefault(require("../Navbar/NavbarDropdown"));
25
+
26
+ var _NavbarDropdownMenu = _interopRequireDefault(require("../Navbar/NavbarDropdownMenu"));
27
+
28
+ var _SidenavDropdownMenu = _interopRequireDefault(require("../Sidenav/SidenavDropdownMenu"));
29
+
30
+ var NavMenuContext = /*#__PURE__*/_react.default.createContext(null);
31
+
32
+ exports.NavMenuContext = NavMenuContext;
33
+ NavMenuContext.displayName = 'NavMenu.Context';
34
+ var NavMenuActionType;
35
+ exports.NavMenuActionType = NavMenuActionType;
36
+
37
+ (function (NavMenuActionType) {
38
+ NavMenuActionType[NavMenuActionType["RegisterItem"] = 0] = "RegisterItem";
39
+ NavMenuActionType[NavMenuActionType["UnregisterItem"] = 1] = "UnregisterItem";
40
+ })(NavMenuActionType || (exports.NavMenuActionType = NavMenuActionType = {}));
41
+
42
+ var initilNavMenuState = {
43
+ items: []
44
+ };
45
+
46
+ var reducer = function reducer(state, action) {
47
+ switch (action.type) {
48
+ case NavMenuActionType.RegisterItem:
49
+ return (0, _extends2.default)({}, state, {
50
+ items: [].concat(state.items.filter(function (item) {
51
+ return item._id !== action.payload._id;
52
+ }), [action.payload])
53
+ });
54
+
55
+ case NavMenuActionType.UnregisterItem:
56
+ return (0, _extends2.default)({}, state, {
57
+ items: state.items.filter(function (item) {
58
+ return item._id !== action.payload._id;
59
+ })
60
+ });
61
+
62
+ default:
63
+ throw new Error('Unrecognizable action type: ' + action.type);
64
+ }
65
+ };
66
+ /**
67
+ * The <Nav.Menu> API
68
+ * When used as direct child of <Nav>, render the NavDropdown
69
+ * When used within another <Nav.Menu>, render the NavDropdownMenu
70
+ */
71
+
72
+
73
+ var NavMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
74
+ var parentNavMenu = (0, _react.useContext)(NavMenuContext);
75
+ var navMenuContext = (0, _react.useReducer)(reducer, initilNavMenuState);
76
+ var navbar = (0, _react.useContext)(_Navbar.NavbarContext);
77
+ var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
78
+
79
+ if (!parentNavMenu) {
80
+ if (navbar) {
81
+ return /*#__PURE__*/_react.default.createElement(NavMenuContext.Provider, {
82
+ value: navMenuContext
83
+ }, /*#__PURE__*/_react.default.createElement(_NavbarDropdown.default, (0, _extends2.default)({
84
+ ref: ref
85
+ }, props)));
86
+ }
87
+
88
+ if (sidenav) {
89
+ return /*#__PURE__*/_react.default.createElement(NavMenuContext.Provider, {
90
+ value: navMenuContext
91
+ }, /*#__PURE__*/_react.default.createElement(_SidenavDropdown.default, (0, _extends2.default)({
92
+ ref: ref
93
+ }, props)));
94
+ }
95
+
96
+ return /*#__PURE__*/_react.default.createElement(NavMenuContext.Provider, {
97
+ value: navMenuContext
98
+ }, /*#__PURE__*/_react.default.createElement(_NavDropdown.default, (0, _extends2.default)({
99
+ ref: ref
100
+ }, props)));
101
+ }
102
+
103
+ if (navbar) {
104
+ return /*#__PURE__*/_react.default.createElement(_NavbarDropdownMenu.default, (0, _extends2.default)({
105
+ ref: ref
106
+ }, props));
107
+ }
108
+
109
+ if (sidenav) {
110
+ return /*#__PURE__*/_react.default.createElement(_SidenavDropdownMenu.default, (0, _extends2.default)({
111
+ ref: ref
112
+ }, props));
113
+ }
114
+
115
+ return /*#__PURE__*/_react.default.createElement(_NavDropdownMenu.default, (0, _extends2.default)({
116
+ ref: ref
117
+ }, props));
118
+ });
119
+
120
+ NavMenu.displayName = 'Nav.Menu';
121
+ var _default = NavMenu;
122
+ exports.default = _default;
@@ -0,0 +1,57 @@
1
+ import React from 'react';
2
+ import { TypeAttributes, WithAsProps, RsRefForwardingComponent } from '../@types/common';
3
+ import { IconProps } from '@rsuite/icons/lib/Icon';
4
+ import Button from '../Button';
5
+ import NavDropdownItem from '../Nav/NavDropdownItem';
6
+ import NavDropdownMenu from '../Nav/NavDropdownMenu';
7
+ export declare type NavbarDropdownTrigger = 'click' | 'hover' | 'contextMenu';
8
+ export interface NavbarDropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect' | 'title'> {
9
+ /** Define the title as a submenu */
10
+ title?: React.ReactNode;
11
+ /** Set the icon */
12
+ icon?: React.ReactElement<IconProps>;
13
+ /** Triggering events */
14
+ trigger?: NavbarDropdownTrigger | readonly NavbarDropdownTrigger[];
15
+ /** The placement of Menu */
16
+ placement?: TypeAttributes.Placement8;
17
+ /** Whether or not component is disabled */
18
+ disabled?: boolean;
19
+ /** The style of the menu */
20
+ menuStyle?: React.CSSProperties;
21
+ /** A css class to apply to the Toggle DOM node */
22
+ toggleClassName?: string;
23
+ /** You can use a custom element type for this toggle component */
24
+ toggleAs?: React.ElementType;
25
+ /** No caret variation */
26
+ noCaret?: boolean;
27
+ /**
28
+ * Open the menu and control it
29
+ * @deprecated
30
+ */
31
+ open?: boolean;
32
+ /**
33
+ * @deprecated
34
+ */
35
+ renderTitle?: (children: React.ReactNode) => React.ReactNode;
36
+ /** Custom Toggle */
37
+ renderToggle?: (props: WithAsProps, ref: React.Ref<any>) => any;
38
+ /** The callback function that the menu closes */
39
+ onClose?: () => void;
40
+ /** Menu Pop-up callback function */
41
+ onOpen?: () => void;
42
+ /** Callback function for menu state switching */
43
+ onToggle?: (open: boolean, eventKey?: T | undefined, event?: React.SyntheticEvent) => void;
44
+ }
45
+ export interface NavbarDropdownComponent extends RsRefForwardingComponent<'div', NavbarDropdownProps> {
46
+ <ToggleAs extends React.ElementType = typeof Button>(props: NavbarDropdownProps & {
47
+ ref?: React.Ref<any>;
48
+ toggleAs?: ToggleAs;
49
+ } & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
50
+ Item: typeof NavDropdownItem;
51
+ Menu: typeof NavDropdownMenu;
52
+ }
53
+ /**
54
+ * @private
55
+ */
56
+ declare const NavbarDropdown: NavbarDropdownComponent;
57
+ export default NavbarDropdown;