rsuite 6.0.0-canary-20250103 → 6.0.0-canary-2025011413

package/cjs/Nav/NavDropdown.js

@@ -8,17 +8,22 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _omit = _interopRequireDefault(require("lodash/omit"));
 var _pick = _interopRequireDefault(require("lodash/pick"));
-var _hooks = require("../internals/hooks");
-var _utils = require("../internals/utils");
-var _DropdownState = require("../Dropdown/DropdownState");
 var _Menu = _interopRequireDefault(require("../internals/Menu/Menu"));
 var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
 var _NavContext = _interopRequireDefault(require("./NavContext"));
 var _NavDropdownItem = _interopRequireDefault(require("./NavDropdownItem"));
 var _NavDropdownMenu = _interopRequireDefault(require("./NavDropdownMenu"));
 var _NavDropdownToggle = _interopRequireDefault(require("./NavDropdownToggle"));
+var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
+var _DropdownState = require("../Dropdown/DropdownState");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const Subcomponents = {
+  Item: _NavDropdownItem.default,
+  Menu: _NavDropdownMenu.default
+};
+
 /**
  * @private this component is not supposed to be used directly
  *          Instead it's rendered by a `<Nav.Menu>` call
@@ -29,7 +34,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  *   </Nav.Menu>
  * </Nav>
  */
-const NavDropdown = /*#__PURE__*/_react.default.forwardRef(function NavDropdown(props, ref) {
+const NavDropdown = (0, _utils.forwardRef)((props, ref) => {
   const nav = (0, _react.useContext)(_NavContext.default);
   if (!nav) {
     throw new Error('<Nav.Dropdown> must be rendered within a <Nav> component.');
@@ -130,8 +135,6 @@ const NavDropdown = /*#__PURE__*/_react.default.forwardRef(function NavDropdown(
       style: style
     }));
   });
-});
-NavDropdown.Item = _NavDropdownItem.default;
-NavDropdown.Menu = _NavDropdownMenu.default;
+}, Subcomponents);
 NavDropdown.displayName = 'Nav.Dropdown';
 var _default = exports.default = NavDropdown;

package/cjs/Nav/NavDropdownItem.d.ts

@@ -1,6 +1,6 @@
-import { RsRefForwardingComponent, WithAsProps } from '../internals/types';
 import React from 'react';
-import { IconProps } from '@rsuite/icons/Icon';
+import type { IconProps } from '@rsuite/icons/Icon';
+import type { WithAsProps } from '../internals/types';
 export interface NavDropdownItemProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
     /** Active the current option */
     active?: boolean;
@@ -35,5 +35,5 @@ export interface NavDropdownItemProps<T = any> extends WithAsProps, Omit<React.H
 /**
  * @private
  */
-declare const NavDropdownItem: RsRefForwardingComponent<'li', NavDropdownItemProps>;
+declare const NavDropdownItem: import("../internals/types").InternalRefForwardingComponent<"li", NavDropdownItemProps<any>, never> & Record<string, never>;
 export default NavDropdownItem;

package/cjs/Nav/NavDropdownItem.js

@@ -5,19 +5,19 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _hooks = require("../internals/hooks");
-var _MenuItem = _interopRequireDefault(require("../internals/Menu/MenuItem"));
+var _classnames = _interopRequireDefault(require("classnames"));
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
-var _utils = require("../internals/utils");
+var _MenuItem = _interopRequireDefault(require("../internals/Menu/MenuItem"));
 var _NavContext = _interopRequireDefault(require("./NavContext"));
+var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
 var _useRenderDropdownItem = require("../Dropdown/useRenderDropdownItem");
-var _classnames = _interopRequireDefault(require("classnames"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * @private
  */
-const NavDropdownItem = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const NavDropdownItem = (0, _utils.forwardRef)((props, ref) => {
   const nav = (0, _react.useContext)(_NavContext.default);
   if (!nav) {
     throw new Error('<Nav.Dropdown.Item> should be used within a <Nav> component.');

package/cjs/Nav/NavDropdownToggle.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
-import Button from '../Button';
-import { WithAsProps, RsRefForwardingComponent, PlacementCorners } from '../internals/types';
 import { NavItemProps } from './NavItem';
+import type { WithAsProps, PlacementCorners } from '../internals/types';
 export interface NavDropdownToggleProps extends WithAsProps {
     icon?: NavItemProps['icon'];
     noCaret?: boolean;
@@ -17,5 +16,5 @@ export interface NavDropdownToggleProps extends WithAsProps {
  *   </Nav.Menu>
  * </Nav>
  */
-declare const NavDropdownToggle: RsRefForwardingComponent<typeof Button, NavDropdownToggleProps>;
+declare const NavDropdownToggle: import("../internals/types").InternalRefForwardingComponent<import("../internals/types").InternalRefForwardingComponent<"button", import("../Button").ButtonProps, never> & Record<string, never>, NavDropdownToggleProps, never> & Record<string, never>;
 export default NavDropdownToggle;

package/cjs/Nav/NavDropdownToggle.js

@@ -7,8 +7,9 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _ArrowDownLine = _interopRequireDefault(require("@rsuite/icons/ArrowDownLine"));
-var _hooks = require("../internals/hooks");
 var _NavItem = _interopRequireDefault(require("./NavItem"));
+var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
 /**
  * @private this component is not supposed to be used directly
  *          Instead it's rendered by a <Nav.Menu> call
@@ -18,7 +19,7 @@ var _NavItem = _interopRequireDefault(require("./NavItem"));
  *   </Nav.Menu>
  * </Nav>
  */
-const NavDropdownToggle = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const NavDropdownToggle = (0, _utils.forwardRef)((props, ref) => {
   const {
     as: Component = _NavItem.default,
     className,

package/cjs/Nav/NavItem.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { RsRefForwardingComponent, WithAsProps } from '../internals/types';
-import { IconProps } from '@rsuite/icons/Icon';
+import type { WithAsProps } from '../internals/types';
+import type { IconProps } from '@rsuite/icons/Icon';
 export interface NavItemProps<T = string | number> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
     /** Activation status */
     active?: boolean;
@@ -27,5 +27,5 @@ export interface NavItemProps<T = string | number> extends WithAsProps, Omit<Rea
  * @see https://rsuitejs.com/components/nav
  *
  */
-declare const NavItem: RsRefForwardingComponent<'a', NavItemProps>;
+declare const NavItem: import("../internals/types").InternalRefForwardingComponent<"a", NavItemProps<string | number>, never> & Record<string, never>;
 export default NavItem;

package/cjs/Nav/NavItem.js

@@ -6,13 +6,13 @@ exports.__esModule = true;
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
 var _Ripple = _interopRequireDefault(require("../internals/Ripple"));
 var _SafeAnchor = _interopRequireDefault(require("../SafeAnchor"));
+var _NavContext = _interopRequireDefault(require("./NavContext"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
-var _NavContext = _interopRequireDefault(require("./NavContext"));
-var _classnames = _interopRequireDefault(require("classnames"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -23,7 +23,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * @see https://rsuitejs.com/components/nav
  *
  */
-const NavItem = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const NavItem = (0, _utils.forwardRef)((props, ref) => {
   const nav = (0, _react.useContext)(_NavContext.default);
   if (!nav) {
     throw new Error('<Nav.Item> must be rendered within a <Nav> component.');

package/cjs/Nav/NavMenu.js

@@ -8,12 +8,12 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _NavDropdown = _interopRequireDefault(require("./NavDropdown"));
 var _NavDropdownMenu = _interopRequireDefault(require("./NavDropdownMenu"));
-var _Sidenav = require("../Sidenav/Sidenav");
-var _SidenavDropdown = _interopRequireDefault(require("../Sidenav/SidenavDropdown"));
-var _Navbar = require("../Navbar");
 var _NavbarDropdown = _interopRequireDefault(require("../Navbar/NavbarDropdown"));
 var _NavbarDropdownMenu = _interopRequireDefault(require("../Navbar/NavbarDropdownMenu"));
+var _SidenavDropdown = _interopRequireDefault(require("../Sidenav/SidenavDropdown"));
 var _SidenavDropdownMenu = _interopRequireDefault(require("../Sidenav/SidenavDropdownMenu"));
+var _Navbar = require("../Navbar");
+var _Sidenav = require("../Sidenav/Sidenav");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const NavMenuContext = exports.NavMenuContext = /*#__PURE__*/_react.default.createContext(null);

package/cjs/Nav/index.d.ts

@@ -1,4 +1,16 @@
 import Nav from './Nav';
+import NavItem from './NavItem';
+import NavMenu from './NavMenu';
+import NavDropdown from './NavDropdown';
+import NavDropdownItem from './NavDropdownItem';
+import NavDropdownMenu from './NavDropdownMenu';
+import NavDropdownToggle from './NavDropdownToggle';
 export type { NavProps } from './Nav';
 export type { NavItemProps } from './NavItem';
+export type { NavMenuProps } from './NavMenu';
+export type { NavDropdownProps } from './NavDropdown';
+export type { NavDropdownItemProps } from './NavDropdownItem';
+export type { NavDropdownMenuProps } from './NavDropdownMenu';
+export type { NavDropdownToggleProps } from './NavDropdownToggle';
+export { Nav, NavItem, NavMenu, NavDropdown, NavDropdownItem, NavDropdownMenu, NavDropdownToggle };
 export default Nav;

package/cjs/Nav/index.js

@@ -5,4 +5,19 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports.default = void 0;
 var _Nav = _interopRequireDefault(require("./Nav"));
+exports.Nav = _Nav.default;
+var _NavItem = _interopRequireDefault(require("./NavItem"));
+exports.NavItem = _NavItem.default;
+var _NavMenu = _interopRequireDefault(require("./NavMenu"));
+exports.NavMenu = _NavMenu.default;
+var _NavDropdown = _interopRequireDefault(require("./NavDropdown"));
+exports.NavDropdown = _NavDropdown.default;
+var _NavDropdownItem = _interopRequireDefault(require("./NavDropdownItem"));
+exports.NavDropdownItem = _NavDropdownItem.default;
+var _NavDropdownMenu = _interopRequireDefault(require("./NavDropdownMenu"));
+exports.NavDropdownMenu = _NavDropdownMenu.default;
+var _NavDropdownToggle = _interopRequireDefault(require("./NavDropdownToggle"));
+exports.NavDropdownToggle = _NavDropdownToggle.default;
+// export types
+// export components
 var _default = exports.default = _Nav.default;

package/cjs/Navbar/Navbar.d.ts

@@ -1,28 +1,31 @@
 import React from 'react';
-import NavbarBody from './NavbarBody';
-import NavbarHeader from './NavbarHeader';
-import NavbarBrand from './NavbarBrand';
-import { WithAsProps, RsRefForwardingComponent } from '../internals/types';
-export declare const NavbarContext: React.Context<boolean>;
-type AppearanceType = 'default' | 'inverse' | 'subtle';
+import type { WithAsProps } from '../internals/types';
 export interface NavbarProps extends WithAsProps {
-    appearance?: AppearanceType;
-    classPrefix?: string;
-}
-interface NavbarComponent extends RsRefForwardingComponent<'div', NavbarProps> {
     /**
-     * @deprecated use Navbar.Brand instead
+     * The appearance style of the Navbar component.
      */
-    Header: typeof NavbarHeader;
+    appearance?: 'default' | 'inverse' | 'subtle';
     /**
-     * @deprecated use Nav as direct child of Navbar
+     * Callback when the drawer is opened or closed.
      */
-    Body: typeof NavbarBody;
-    Brand: typeof NavbarBrand;
+    onDrawerOpenChange?: (open: boolean) => void;
 }
 /**
- * The `Navbar` component is used to create a navigation header.
+ * The `Navbar` component is a wrapper that positions navigation elements.
  * @see https://rsuitejs.com/components/navbar
  */
-declare const Navbar: NavbarComponent;
+declare const Navbar: import("../internals/types").InternalRefForwardingComponent<"div", NavbarProps, never> & {
+    Brand: import("../internals/types").InternalRefForwardingComponent<"a", Partial<{
+        name: string;
+        componentAs: "a";
+        componentClassPrefix: string;
+    }>, never> & Record<string, never>;
+    Content: import("../internals/types").InternalRefForwardingComponent<"div", Partial<{
+        name: string;
+        componentAs: "div";
+        componentClassPrefix: string;
+    }>, never> & Record<string, never>;
+    Toggle: React.ForwardRefExoticComponent<import("..").IconButtonProps & React.RefAttributes<any>>;
+    Drawer: React.ForwardRefExoticComponent<import("..").DrawerProps & React.RefAttributes<any>>;
+};
 export default Navbar;

package/cjs/Navbar/Navbar.js

@@ -3,20 +3,31 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.default = exports.NavbarContext = void 0;
+exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
-var _NavbarBody = _interopRequireDefault(require("./NavbarBody"));
-var _NavbarHeader = _interopRequireDefault(require("./NavbarHeader"));
+var _react = _interopRequireWildcard(require("react"));
 var _NavbarBrand = _interopRequireDefault(require("./NavbarBrand"));
+var _NavbarContent = _interopRequireDefault(require("./NavbarContent"));
+var _NavbarToggle = _interopRequireDefault(require("./NavbarToggle"));
+var _NavbarDrawer = _interopRequireDefault(require("./NavbarDrawer"));
+var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
 var _CustomProvider = require("../CustomProvider");
-const NavbarContext = exports.NavbarContext = /*#__PURE__*/_react.default.createContext(false);
+var _NavbarContext = require("./NavbarContext");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const Subcomponents = {
+  Brand: _NavbarBrand.default,
+  Content: _NavbarContent.default,
+  Toggle: _NavbarToggle.default,
+  Drawer: _NavbarDrawer.default
+};
+
 /**
- * The `Navbar` component is used to create a navigation header.
+ * The `Navbar` component is a wrapper that positions navigation elements.
  * @see https://rsuitejs.com/components/navbar
  */
-const Navbar = /*#__PURE__*/_react.default.forwardRef(function Navbar(props, ref) {
+const Navbar = (0, _utils.forwardRef)((props, ref) => {
   const {
     propsWithDefaults
   } = (0, _CustomProvider.useCustom)('Navbar', props);
@@ -25,6 +36,7 @@ const Navbar = /*#__PURE__*/_react.default.forwardRef(function Navbar(props, ref
     as: Component = 'nav',
     classPrefix = 'navbar',
     appearance = 'default',
+    onDrawerOpenChange,
     ...rest
   } = propsWithDefaults;
   const {
@@ -32,15 +44,24 @@ const Navbar = /*#__PURE__*/_react.default.forwardRef(function Navbar(props, ref
     merge
   } = (0, _hooks.useClassNames)(classPrefix);
   const classes = merge(className, withClassPrefix(appearance));
-  return /*#__PURE__*/_react.default.createElement(NavbarContext.Provider, {
-    value: true
+  const [open, setOpen] = _react.default.useState(false);
+  const handleToggle = (0, _hooks.useEventCallback)(nextOpen => {
+    setOpen(nextOpen);
+    onDrawerOpenChange === null || onDrawerOpenChange === void 0 || onDrawerOpenChange(nextOpen);
+  });
+  const navbarId = (0, _hooks.useUniqueId)('navbar-');
+  const context = (0, _react.useMemo)(() => ({
+    appearance,
+    open,
+    navbarId,
+    onToggle: handleToggle
+  }), [appearance, navbarId, open]);
+  return /*#__PURE__*/_react.default.createElement(_NavbarContext.NavbarContext.Provider, {
+    value: context
   }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
     ref: ref,
     className: classes
   })));
-});
-Navbar.Header = _NavbarHeader.default;
-Navbar.Body = _NavbarBody.default;
-Navbar.Brand = _NavbarBrand.default;
+}, Subcomponents);
 Navbar.displayName = 'Navbar';
 var _default = exports.default = Navbar;

package/cjs/Navbar/NavbarBrand.d.ts

@@ -1,4 +1,8 @@
 import { ComponentProps } from '../internals/utils';
 export type NavbarBrandProps = ComponentProps;
-declare const NavbarBrand: import("../internals/types").RsRefForwardingComponent<"a", ComponentProps, false>;
+declare const NavbarBrand: import("../internals/types").InternalRefForwardingComponent<"a", Partial<{
+    name: string;
+    componentAs: "a";
+    componentClassPrefix: string;
+}>, never> & Record<string, never>;
 export default NavbarBrand;

package/cjs/Navbar/NavbarContent.d.ts

@@ -0,0 +1,8 @@
+import { ComponentProps } from '../internals/utils';
+export type NavbarContentProps = ComponentProps;
+declare const NavbarContent: import("../internals/types").InternalRefForwardingComponent<"div", Partial<{
+    name: string;
+    componentAs: "div";
+    componentClassPrefix: string;
+}>, never> & Record<string, never>;
+export default NavbarContent;

package/cjs/Navbar/NavbarContent.js

@@ -0,0 +1,12 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _utils = require("../internals/utils");
+const NavbarContent = (0, _utils.createComponent)({
+  name: 'NavbarContent',
+  componentAs: 'div',
+  componentClassPrefix: 'navbar-content'
+});
+var _default = exports.default = NavbarContent;

package/cjs/Navbar/NavbarContext.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface NavbarContextValue {
+    appearance: 'default' | 'inverse' | 'subtle';
+    open: boolean;
+    navbarId: string;
+    onToggle?: (open: boolean) => void;
+}
+export declare const NavbarContext: React.Context<NavbarContextValue | null>;
+export {};

package/cjs/Navbar/NavbarContext.js

@@ -0,0 +1,8 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.NavbarContext = void 0;
+var _react = _interopRequireDefault(require("react"));
+const NavbarContext = exports.NavbarContext = /*#__PURE__*/_react.default.createContext(null);

package/cjs/Navbar/NavbarDrawer.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { DrawerProps } from '../Drawer';
+export type NavbarDrawerProps = DrawerProps;
+declare const NavbarDrawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<any>>;
+export default NavbarDrawer;

package/cjs/Navbar/NavbarDrawer.js

@@ -0,0 +1,42 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireWildcard(require("react"));
+var _Drawer = _interopRequireDefault(require("../Drawer"));
+var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
+var _NavbarContext = require("./NavbarContext");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const NavDrawer = (0, _utils.createComponent)({
+  name: 'NavbarDrawer',
+  componentAs: _Drawer.default,
+  componentClassPrefix: 'navbar-drawer'
+});
+const NavbarDrawer = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+    onToggle,
+    navbarId,
+    open: navbarOpen
+  } = (0, _react.useContext)(_NavbarContext.NavbarContext) || {};
+  const {
+    onClose,
+    open = navbarOpen,
+    ...rest
+  } = props;
+  const handleClose = (0, _hooks.useEventCallback)(() => {
+    onToggle === null || onToggle === void 0 || onToggle(false);
+  });
+  return /*#__PURE__*/_react.default.createElement(NavDrawer, (0, _extends2.default)({
+    ref: ref,
+    open: open,
+    id: `${navbarId}-drawer`,
+    onClose: (0, _utils.createChainedFunction)(handleClose, onClose)
+  }, rest));
+});
+NavbarDrawer.displayName = 'NavbarDrawer';
+var _default = exports.default = NavbarDrawer;

package/cjs/Navbar/NavbarDropdown.d.ts

@@ -1,9 +1,6 @@
 import React from 'react';
-import { PlacementCorners, WithAsProps, RsRefForwardingComponent } from '../internals/types';
-import { IconProps } from '@rsuite/icons/Icon';
-import Button from '../Button';
-import NavDropdownItem from '../Nav/NavDropdownItem';
-import NavDropdownMenu from '../Nav/NavDropdownMenu';
+import type { PlacementCorners, WithAsProps } from '../internals/types';
+import type { IconProps } from '@rsuite/icons/Icon';
 export type NavbarDropdownTrigger = 'click' | 'hover' | 'contextMenu';
 export interface NavbarDropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect' | 'onToggle' | 'title'> {
     /** Define the title as a submenu */
@@ -42,16 +39,11 @@ export interface NavbarDropdownProps<T = any> extends WithAsProps, Omit<React.HT
     /** Callback function for menu state switching */
     onToggle?: (open: boolean, eventKey?: T | undefined, event?: React.SyntheticEvent) => void;
 }
-export interface NavbarDropdownComponent extends RsRefForwardingComponent<'div', NavbarDropdownProps> {
-    <ToggleAs extends React.ElementType = typeof Button>(props: NavbarDropdownProps & {
-        ref?: React.Ref<any>;
-        toggleAs?: ToggleAs;
-    } & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
-    Item: typeof NavDropdownItem;
-    Menu: typeof NavDropdownMenu;
-}
 /**
  * @private
  */
-declare const NavbarDropdown: NavbarDropdownComponent;
+declare const NavbarDropdown: import("../internals/types").InternalRefForwardingComponent<"div", NavbarDropdownProps<any>, never> & {
+    Item: import("../internals/types").InternalRefForwardingComponent<"li", import("../Nav/NavDropdownItem").NavDropdownItemProps<any>, never> & Record<string, never>;
+    Menu: React.ForwardRefExoticComponent<import("../Nav/NavDropdownMenu").NavDropdownMenuProps<any> & Omit<React.HTMLAttributes<HTMLUListElement>, "title" | "onSelect" | "onToggle"> & React.RefAttributes<HTMLElement>>;
+};
 export default NavbarDropdown;

package/cjs/Navbar/NavbarDropdown.js

@@ -8,21 +8,26 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _castArray = _interopRequireDefault(require("lodash/castArray"));
 var _omit = _interopRequireDefault(require("lodash/omit"));
-var _hooks = require("../internals/hooks");
-var _utils = require("../internals/utils");
 var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
-var _ = require(".");
 var _Disclosure = _interopRequireDefault(require("../internals/Disclosure/Disclosure"));
 var _NavDropdownItem = _interopRequireDefault(require("../Nav/NavDropdownItem"));
 var _NavDropdownMenu = _interopRequireDefault(require("../Nav/NavDropdownMenu"));
 var _NavbarDropdownToggle = _interopRequireDefault(require("./NavbarDropdownToggle"));
+var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
+var _NavbarContext = require("./NavbarContext");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const Subcomponents = {
+  Item: _NavDropdownItem.default,
+  Menu: _NavDropdownMenu.default
+};
+
 /**
  * @private
  */
-const NavbarDropdown = /*#__PURE__*/_react.default.forwardRef(function NavbarDropdown(props, ref) {
-  const navbar = (0, _react.useContext)(_.NavbarContext);
+const NavbarDropdown = (0, _utils.forwardRef)((props, ref) => {
+  const navbar = (0, _react.useContext)(_NavbarContext.NavbarContext);
   if (!navbar) {
     throw new Error('<Navbar.Dropdown> should be used within a <Navbar> component.');
   }
@@ -96,8 +101,6 @@ const NavbarDropdown = /*#__PURE__*/_react.default.forwardRef(function NavbarDro
       }, children);
     }));
   });
-});
-NavbarDropdown.Item = _NavDropdownItem.default;
-NavbarDropdown.Menu = _NavDropdownMenu.default;
+}, Subcomponents);
 NavbarDropdown.displayName = 'Navbar.Dropdown';
 var _default = exports.default = NavbarDropdown;

package/cjs/Navbar/NavbarDropdownItem.d.ts

@@ -1,6 +1,6 @@
-import { RsRefForwardingComponent, WithAsProps } from '../internals/types';
 import React from 'react';
 import { IconProps } from '@rsuite/icons/Icon';
+import type { WithAsProps } from '../internals/types';
 export interface NavbarDropdownItemProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
     /** Active the current option */
     active?: boolean;
@@ -37,5 +37,5 @@ export interface NavbarDropdownItemProps<T = any> extends WithAsProps, Omit<Reac
 /**
  * @private
  */
-declare const NavbarDropdownItem: RsRefForwardingComponent<'li', NavbarDropdownItemProps>;
+declare const NavbarDropdownItem: import("../internals/types").InternalRefForwardingComponent<"li", NavbarDropdownItemProps<any>, never> & Record<string, never>;
 export default NavbarDropdownItem;

package/cjs/Navbar/NavbarDropdownItem.js

@@ -5,21 +5,21 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _hooks = require("../internals/hooks");
+var _classnames = _interopRequireDefault(require("classnames"));
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
-var _utils = require("../internals/utils");
-var _Navbar = require("./Navbar");
 var _DisclosureContext = _interopRequireWildcard(require("../internals/Disclosure/DisclosureContext"));
-var _useRenderDropdownItem = require("../Dropdown/useRenderDropdownItem");
 var _NavContext = _interopRequireDefault(require("../Nav/NavContext"));
-var _classnames = _interopRequireDefault(require("classnames"));
+var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
+var _NavbarContext = require("./NavbarContext");
+var _useRenderDropdownItem = require("../Dropdown/useRenderDropdownItem");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * @private
  */
-const NavbarDropdownItem = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
-  const navbar = (0, _react.useContext)(_Navbar.NavbarContext);
+const NavbarDropdownItem = (0, _utils.forwardRef)((props, ref) => {
+  const navbar = (0, _react.useContext)(_NavbarContext.NavbarContext);
   const nav = (0, _react.useContext)(_NavContext.default);
   if (!navbar || !nav) {
     throw new Error('<Navbar.Dropdown.Item> must be rendered within a <Nav> component within a <Navbar> component.');

package/cjs/Navbar/NavbarDropdownToggle.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
-import Button from '../Button';
-import { WithAsProps, RsRefForwardingComponent, PlacementCorners } from '../internals/types';
+import type { WithAsProps, PlacementCorners } from '../internals/types';
 export interface NavbarDropdownToggleProps extends WithAsProps {
     noCaret?: boolean;
     renderToggle?: (props: WithAsProps, ref: React.Ref<any>) => any;
@@ -15,5 +14,5 @@ export interface NavbarDropdownToggleProps extends WithAsProps {
  *   </Nav.Menu>
  * </Nav>
  */
-declare const NavbarDropdownToggle: RsRefForwardingComponent<typeof Button, NavbarDropdownToggleProps>;
+declare const NavbarDropdownToggle: import("../internals/types").InternalRefForwardingComponent<import("../internals/types").InternalRefForwardingComponent<"button", import("../Button").ButtonProps, never> & Record<string, never>, NavbarDropdownToggleProps, never> & Record<string, never>;
 export default NavbarDropdownToggle;

package/cjs/Navbar/NavbarDropdownToggle.js

@@ -8,6 +8,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireDefault(require("react"));
 var _ArrowDownLine = _interopRequireDefault(require("@rsuite/icons/ArrowDownLine"));
 var _NavbarItem = _interopRequireDefault(require("./NavbarItem"));
+var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
 /**
  * @private this component is not supposed to be used directly
@@ -18,7 +19,7 @@ var _hooks = require("../internals/hooks");
  *   </Nav.Menu>
  * </Nav>
  */
-const NavbarDropdownToggle = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const NavbarDropdownToggle = (0, _utils.forwardRef)((props, ref) => {
   const {
     as: Component = _NavbarItem.default,
     className,