rsuite 6.0.0-canary-20250416 → 6.0.0-canary-20250424

package/cjs/Message/Message.js

@@ -12,7 +12,6 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _utils = require("../internals/utils");
 var _statusIcons = require("../internals/constants/statusIcons");
 var _hooks = require("../internals/hooks");
-var _CustomProvider = require("../CustomProvider");
 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; }
 /**
@@ -22,7 +21,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 const Message = (0, _utils.forwardRef)((props, ref) => {
   const {
     propsWithDefaults
-  } = (0, _CustomProvider.useCustom)('Message', props);
+  } = (0, _hooks.useCustom)('Message', props);
   const {
     as = 'div',
     bordered,

package/cjs/Modal/Modal.js

@@ -20,7 +20,6 @@ var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
 var _ModalContext = require("./ModalContext");
 var _utils2 = require("./utils");
-var _CustomProvider = require("../CustomProvider");
 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 modalSizes = ['xs', 'sm', 'md', 'lg', 'full'];
@@ -39,7 +38,7 @@ const Subcomponents = {
 const Modal = (0, _utils.forwardRef)((props, ref) => {
   const {
     propsWithDefaults
-  } = (0, _CustomProvider.useCustom)('Modal', props);
+  } = (0, _hooks.useCustom)('Modal', props);
   const {
     animation = _Bounce.default,
     animationProps,

package/cjs/Modal/ModalHeader.js

@@ -32,7 +32,6 @@ const ModalHeader = (0, _utils.forwardRef)((props, ref) => {
   const classes = merge(className, withPrefix());
   const context = (0, _react.useContext)(_ModalContext.ModalContext);
   const {
-    isDrawer,
     onModalClose
   } = context || {};
   return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({
@@ -41,7 +40,7 @@ const ModalHeader = (0, _utils.forwardRef)((props, ref) => {
     ref: ref,
     className: classes
   }), closeButton && /*#__PURE__*/_react.default.createElement(_CloseButton.default, {
-    as: isDrawer ? _IconButton.default : 'button',
+    as: _IconButton.default,
     className: prefix('close'),
     onClick: (0, _utils.createChainedFunction)(onClose, onModalClose)
   }), children);

package/cjs/MultiCascadeTree/MultiCascadeTree.js

@@ -12,7 +12,6 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _utils = require("../internals/utils");
 var _hooks = require("./hooks");
 var _hooks2 = require("../internals/hooks");
-var _CustomProvider = require("../CustomProvider");
 const emptyArray = [];
 
 /**
@@ -22,7 +21,7 @@ const emptyArray = [];
 const MultiCascadeTree = (0, _utils.forwardRef)((props, ref) => {
   const {
     propsWithDefaults
-  } = (0, _CustomProvider.useCustom)('MultiCascadeTree', props);
+  } = (0, _hooks2.useCustom)('MultiCascadeTree', props);
   const {
     as,
     data = emptyArray,

package/cjs/MultiCascadeTree/SearchView.js

@@ -10,7 +10,6 @@ var _SearchBox = _interopRequireDefault(require("../internals/SearchBox"));
 var _Checkbox = _interopRequireDefault(require("../Checkbox"));
 var _Highlight = _interopRequireDefault(require("../Highlight"));
 var _hooks = require("../internals/hooks");
-var _CustomProvider = require("../CustomProvider");
 var _utils = require("./utils");
 function SearchView(props) {
   const {
@@ -40,7 +39,7 @@ function SearchView(props) {
   const classes = merge(className, withPrefix());
   const {
     getLocale
-  } = (0, _CustomProvider.useCustom)();
+  } = (0, _hooks.useCustom)();
   const {
     searchPlaceholder,
     noResultsText

package/cjs/MultiCascadeTree/TreeView.js

@@ -13,7 +13,6 @@ var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
 var _Picker = require("../internals/Picker");
 var _utils2 = require("./utils");
-var _CustomProvider = require("../CustomProvider");
 const emptyArray = [];
 const TreeView = (0, _utils.forwardRef)((props, ref) => {
   const {
@@ -45,7 +44,7 @@ const TreeView = (0, _utils.forwardRef)((props, ref) => {
   const classes = merge(className, prefix('items'));
   const {
     rtl
-  } = (0, _CustomProvider.useCustom)();
+  } = (0, _hooks.useCustom)();
   const {
     id,
     labelId,

package/cjs/MultiCascader/MultiCascader.js

@@ -17,7 +17,6 @@ var _hooks = require("../internals/hooks");
 var _utils2 = require("../CascadeTree/utils");
 var _utils3 = require("../internals/utils");
 var _hooks2 = require("../MultiCascadeTree/hooks");
-var _CustomProvider = require("../CustomProvider");
 var _Picker = require("../internals/Picker");
 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; }
@@ -32,7 +31,7 @@ const MultiCascader = (0, _utils3.forwardRef)((props, ref) => {
   const {
     propsWithDefaults,
     rtl
-  } = (0, _CustomProvider.useCustom)('MultiCascader', props);
+  } = (0, _hooks.useCustom)('MultiCascader', props);
   const {
     as,
     appearance = 'default',

package/cjs/Nav/Nav.js

@@ -19,7 +19,6 @@ var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
 var _NavbarContext = require("../Navbar/NavbarContext");
 var _Sidenav = require("../Sidenav/Sidenav");
-var _CustomProvider = require("../CustomProvider");
 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 DeprecatedNavDropdown = (0, _utils.deprecateComponent)(_NavDropdown.default, '<Nav.Dropdown> is deprecated, use <Nav.Menu> instead.');
@@ -42,7 +41,7 @@ const Subcomponents = {
 const Nav = (0, _utils.forwardRef)((props, ref) => {
   const {
     propsWithDefaults
-  } = (0, _CustomProvider.useCustom)('Nav', props);
+  } = (0, _hooks.useCustom)('Nav', props);
   const {
     as,
     classPrefix = 'nav',

package/cjs/Nav/NavDropdownMenu.js

@@ -14,7 +14,6 @@ var _PageNext = _interopRequireDefault(require("@rsuite/icons/PageNext"));
 var _NavContext = _interopRequireDefault(require("./NavContext"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
-var _CustomProvider = require("../CustomProvider");
 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; }
 /**
@@ -37,7 +36,7 @@ const NavDropdownMenu = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
   } = props;
   const {
     rtl
-  } = (0, _CustomProvider.useCustom)();
+  } = (0, _hooks.useCustom)();
   const handleToggleSubmenu = (0, _react.useCallback)((open, event) => {
     onToggle === null || onToggle === void 0 || onToggle(open, eventKey, event);
   }, [eventKey, onToggle]);

package/cjs/Navbar/Navbar.d.ts

@@ -17,7 +17,7 @@ export interface NavbarProps extends BoxProps {
 declare const Navbar: import("../internals/types").InternalRefForwardingComponent<"div", NavbarProps, never> & {
     Brand: import("../internals/types").InternalRefForwardingComponent<"a", Partial<import("../internals/utils").ComponentProps>, never> & Record<string, never>;
     Content: import("../internals/types").InternalRefForwardingComponent<import("../internals/types").InternalRefForwardingComponent<"div", BoxProps, never> & Record<string, never>, Partial<import("./NavbarContent").NavbarContentProps>, never> & Record<string, never>;
-    Toggle: React.ForwardRefExoticComponent<import("..").IconButtonProps & React.RefAttributes<any>>;
+    Toggle: React.ForwardRefExoticComponent<import("./NavbarToggle").NavbarToggleProps & React.RefAttributes<any>>;
     Drawer: React.ForwardRefExoticComponent<import("..").DrawerProps & React.RefAttributes<any>>;
 };
 export default Navbar;

package/cjs/Navbar/Navbar.js

@@ -13,7 +13,6 @@ var _NavbarDrawer = _interopRequireDefault(require("./NavbarDrawer"));
 var _Box = _interopRequireDefault(require("../internals/Box"));
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
-var _CustomProvider = require("../CustomProvider");
 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; }
@@ -31,7 +30,7 @@ const Subcomponents = {
 const Navbar = (0, _utils.forwardRef)((props, ref) => {
   const {
     propsWithDefaults
-  } = (0, _CustomProvider.useCustom)('Navbar', props);
+  } = (0, _hooks.useCustom)('Navbar', props);
   const {
     className,
     as = 'nav',

package/cjs/Navbar/NavbarDropdownMenu.js

@@ -15,7 +15,6 @@ var _NavContext = _interopRequireDefault(require("../Nav/NavContext"));
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
 var _NavbarContext = require("./NavbarContext");
-var _CustomProvider = require("../CustomProvider");
 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; }
 /**
@@ -48,7 +47,7 @@ const NavbarDropdownMenu = /*#__PURE__*/_react.default.forwardRef((props, ref) =
   } = props;
   const {
     rtl
-  } = (0, _CustomProvider.useCustom)();
+  } = (0, _hooks.useCustom)();
   const {
     prefix
   } = (0, _hooks.useStyles)(classPrefix);

package/cjs/Navbar/NavbarToggle.d.ts

@@ -1,5 +1,10 @@
 import React from 'react';
-import { IconButtonProps } from '../IconButton';
-export type NavbarToggleProps = IconButtonProps;
-declare const NavbarToggle: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<any>>;
+import { BurgerProps } from '../internals/Burger';
+export interface NavbarToggleProps extends Omit<BurgerProps, 'onToggle'> {
+    /**
+     * Callback function that is called when the toggle is clicked.
+     */
+    onToggle?: (open: boolean) => void;
+}
+declare const NavbarToggle: React.ForwardRefExoticComponent<NavbarToggleProps & React.RefAttributes<any>>;
 export default NavbarToggle;

package/cjs/Navbar/NavbarToggle.js

@@ -6,38 +6,33 @@ exports.__esModule = true;
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
-var _IconButton = _interopRequireDefault(require("../IconButton"));
-var _Menu = _interopRequireDefault(require("@rsuite/icons/Menu"));
+var _Burger = require("../internals/Burger");
 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 Toggle = (0, _utils.createComponent)({
-  name: 'NavbarToggle',
-  componentAs: _IconButton.default,
-  componentClassPrefix: 'navbar-toggle',
-  icon: /*#__PURE__*/_react.default.createElement(_Menu.default, null)
-});
 const NavbarToggle = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const {
-    appearance: navbarAppearance,
     navbarId,
-    onToggle
+    open: contextOpen,
+    onToggle: onToggleContext
   } = (0, _react.useContext)(_NavbarContext.NavbarContext) || {};
   const {
-    appearance = navbarAppearance === 'inverse' ? 'primary' : 'subtle',
+    open,
     onClick,
+    onToggle,
     ...rest
   } = props;
   const handleClick = (0, _hooks.useEventCallback)(() => {
     onToggle === null || onToggle === void 0 || onToggle(true);
+    onToggleContext === null || onToggleContext === void 0 || onToggleContext(true);
   });
-  return /*#__PURE__*/_react.default.createElement(Toggle, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(_Burger.Burger, (0, _extends2.default)({
     ref: ref,
-    appearance: appearance,
     onClick: (0, _utils.createChainedFunction)(handleClick, onClick),
-    "aria-controls": `${navbarId}-drawer`
+    "aria-controls": `${navbarId}-drawer`,
+    open: typeof open === 'boolean' ? open : contextOpen
   }, rest));
 });
 NavbarToggle.displayName = 'NavbarToggle';

package/cjs/Notification/Notification.js

@@ -12,7 +12,6 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _statusIcons = require("../internals/constants/statusIcons");
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
-var _CustomProvider = require("../CustomProvider");
 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 +22,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 const Notification = (0, _utils.forwardRef)((props, ref) => {
   const {
     propsWithDefaults
-  } = (0, _CustomProvider.useCustom)('Notification', props);
+  } = (0, _hooks.useCustom)('Notification', props);
   const {
     as,
     classPrefix = 'notification',

package/cjs/{InputNumber/InputNumber.d.ts → NumberInput/NumberInput.d.ts}

@@ -1,7 +1,7 @@
 import React from 'react';
 import { BoxProps } from '../internals/Box';
-import type { SanitizedInputProps, FormControlBaseProps, AppearanceType, Size } from '../internals/types';
-export interface InputNumberProps<T = number | string | null> extends Omit<SanitizedInputProps, 'value' | 'defaultValue' | 'prefix'>, BoxProps, FormControlBaseProps<T> {
+import type { SanitizedInputProps, FormControlBaseProps, AppearanceType, BasicSize } from '../internals/types';
+export interface NumberInputProps<T = number | string | null> extends Omit<SanitizedInputProps, 'value' | 'defaultValue' | 'prefix'>, BoxProps, FormControlBaseProps<T> {
     /**
      * Button can have different appearances
      */
@@ -41,27 +41,39 @@ export interface InputNumberProps<T = number | string | null> extends Omit<Sanit
     prefix?: React.ReactNode;
     /**
      * Sets the element displayed on the right side of the component
+     * @deprecated Use `suffix` instead.
      */
     postfix?: React.ReactNode;
+    /**
+     * Sets the element displayed on the right side of the component
+     */
+    suffix?: React.ReactNode;
     /**
      * An Input can have different sizes
      */
-    size?: Size;
+    size?: BasicSize;
     /**
      * Whether the value can be changed through the wheel event
      */
     scrollable?: boolean;
+    /**
+     * Show or hide control icons:
+     * - `true` (default): show default up/down buttons.
+     * - `false`: hide controls.
+     * - `(trigger) => ReactNode`: fully custom control per trigger ('up' | 'down').
+     */
+    controls?: boolean | ((trigger: 'up' | 'down') => React.ReactNode);
     /**
      * Callback function when wheel event is triggered
      */
     onWheel?: (event: React.WheelEvent) => void;
 }
 /**
- * The `InputNumber` component is used to enter a numerical value.
- * @see https://rsuitejs.com/components/input-number
+ * The `NumberInput` component is used to enter a numerical value.
+ * @see https://rsuitejs.com/components/number-input
  */
-declare const InputNumber: import("../internals/types").InternalRefForwardingComponent<import("../internals/types").InternalRefForwardingComponent<"div", import("../InputGroup/InputGroup").InputGroupProps, never> & {
+declare const NumberInput: import("../internals/types").InternalRefForwardingComponent<import("../internals/types").InternalRefForwardingComponent<"div", import("../InputGroup/InputGroup").InputGroupProps, never> & {
     Addon: import("../internals/types").InternalRefForwardingComponent<"span", import("../InputGroup/InputGroupAddon").InputGroupAddonProps, never> & Record<string, never>;
     Button: React.ForwardRefExoticComponent<import("../Button").ButtonProps & React.RefAttributes<any>>;
-}, InputNumberProps<string | number | null>, never> & Record<string, never>;
-export default InputNumber;
+}, NumberInputProps<string | number | null>, never> & Record<string, never>;
+export default NumberInput;

package/cjs/NumberInput/NumberInput.js

@@ -0,0 +1,162 @@
+'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 = _interopRequireDefault(require("react"));
+var _ArrowUpLine = _interopRequireDefault(require("@rsuite/icons/ArrowUpLine"));
+var _ArrowDownLine = _interopRequireDefault(require("@rsuite/icons/ArrowDownLine"));
+var _InputGroup = _interopRequireDefault(require("../InputGroup/InputGroup"));
+var _InputGroupAddon = _interopRequireDefault(require("../InputGroup/InputGroupAddon"));
+var _Input = _interopRequireDefault(require("../Input"));
+var _Button = _interopRequireDefault(require("../Button"));
+var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
+var _useNumberInputValue = require("./hooks/useNumberInputValue");
+var _useEvents = require("./hooks/useEvents");
+var _number = require("./utils/number");
+/**
+ * The `NumberInput` component is used to enter a numerical value.
+ * @see https://rsuitejs.com/components/number-input
+ */
+const NumberInput = (0, _utils.forwardRef)((props, ref) => {
+  const {
+    propsWithDefaults
+  } = (0, _hooks.useCustom)('NumberInput', props);
+  const {
+    as,
+    className,
+    classPrefix = 'number-input',
+    controls = true,
+    disabled,
+    decimalSeparator,
+    formatter,
+    readOnly,
+    plaintext,
+    value: valueProp,
+    defaultValue,
+    size,
+    prefix: prefixElement,
+    postfix,
+    suffix = postfix,
+    step = 1,
+    buttonAppearance = 'subtle',
+    min: minProp,
+    max: maxProp,
+    scrollable = true,
+    onChange,
+    onWheel,
+    onBlur: onBlurProp,
+    onFocus: onFocusProp,
+    ...rest
+  } = propsWithDefaults;
+  const min = minProp !== null && minProp !== void 0 ? minProp : -Infinity;
+  const max = maxProp !== null && maxProp !== void 0 ? maxProp : Infinity;
+  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue);
+  const {
+    withPrefix,
+    merge,
+    prefix
+  } = (0, _hooks.useStyles)(classPrefix);
+  const classes = merge(className, withPrefix());
+  const [htmlInputProps, restProps] = (0, _utils.partitionHTMLProps)(rest);
+  const onChangeValue = (currentValue, event) => {
+    if (currentValue !== value) {
+      setValue(currentValue);
+      onChange === null || onChange === void 0 || onChange(currentValue, event);
+    }
+  };
+  const {
+    inputRef,
+    isFocused,
+    onStepUp,
+    onStepDown,
+    onKeyDown,
+    onFocus,
+    onBlur
+  } = (0, _useEvents.useEvents)({
+    min: minProp,
+    max: maxProp,
+    step,
+    value,
+    scrollable,
+    disabled,
+    readOnly,
+    decimalSeparator,
+    onWheel,
+    onChangeValue
+  });
+  const handleChange = (0, _hooks.useEventCallback)((value, event) => {
+    const separator = decimalSeparator || '.';
+    const escapedSeparator = separator.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
+
+    // Support both custom decimalSeparator and standard decimal point '.'
+    let regex;
+    if (separator !== '.') {
+      // Allow both the custom separator and the standard decimal point
+      regex = new RegExp(`^-?(?:\\d+)?([.${escapedSeparator}])?\\d*$`);
+    } else {
+      regex = new RegExp(`^-?(?:\\d+)?(${escapedSeparator})?\\d*$`);
+    }
+    if (!regex.test(value) && value !== '') {
+      return;
+    }
+    onChangeValue(value, event);
+  });
+  const inputValue = (0, _useNumberInputValue.useNumberInputValue)({
+    value,
+    isFocused,
+    formatter,
+    decimalSeparator
+  });
+  const input = /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({}, htmlInputProps, {
+    ref: plaintext ? ref : undefined,
+    inputRef: inputRef,
+    autoComplete: "off",
+    inputMode: "numeric",
+    step: step,
+    value: inputValue,
+    disabled: disabled,
+    readOnly: readOnly,
+    plaintext: plaintext,
+    onKeyDown: onKeyDown,
+    onChange: handleChange,
+    onBlur: (0, _utils.createChainedFunction)(onBlur, onBlurProp),
+    onFocus: (0, _utils.createChainedFunction)(onFocus, onFocusProp)
+  }));
+  if (plaintext) {
+    return input;
+  }
+  const stepUpDisabled = disabled || readOnly || (0, _number.valueReachesMax)(value, max);
+  const stepDownDisabled = disabled || readOnly || (0, _number.valueReachesMin)(value, min);
+  return /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({
+    as: as,
+    ref: ref,
+    className: classes,
+    disabled: disabled,
+    size: size,
+    inside: true
+  }, restProps), prefixElement && /*#__PURE__*/_react.default.createElement(_InputGroupAddon.default, null, prefixElement), input, suffix && /*#__PURE__*/_react.default.createElement(_InputGroupAddon.default, null, suffix), controls && /*#__PURE__*/_react.default.createElement("span", {
+    className: prefix('btn-group-vertical')
+  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+    tabIndex: -1,
+    appearance: buttonAppearance,
+    className: prefix('touchspin-up'),
+    onClick: onStepUp,
+    disabled: stepUpDisabled,
+    "aria-label": "Increment",
+    size: size
+  }, typeof controls === 'function' ? controls('up') : /*#__PURE__*/_react.default.createElement(_ArrowUpLine.default, null)), /*#__PURE__*/_react.default.createElement(_Button.default, {
+    tabIndex: -1,
+    appearance: buttonAppearance,
+    className: prefix('touchspin-down'),
+    onClick: onStepDown,
+    disabled: stepDownDisabled,
+    "aria-label": "Decrement",
+    size: size
+  }, typeof controls === 'function' ? controls('down') : /*#__PURE__*/_react.default.createElement(_ArrowDownLine.default, null))));
+});
+NumberInput.displayName = 'NumberInput';
+var _default = exports.default = NumberInput;

package/cjs/NumberInput/hooks/useEvents.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+export interface UseEventsParams {
+    value?: number | string | null;
+    scrollable: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    min?: number;
+    max?: number;
+    step?: number;
+    decimalSeparator?: string;
+    onChangeValue: (currentValue: number | string, event: React.SyntheticEvent) => void;
+    onWheel?: (event: React.WheelEvent<HTMLInputElement>) => void;
+}
+export declare function useEvents(params: UseEventsParams): {
+    inputRef: import("react").RefObject<HTMLInputElement | null>;
+    isFocused: boolean;
+    onStepUp: (...args: any[]) => any;
+    onStepDown: (...args: any[]) => any;
+    onKeyDown: (...args: any[]) => any;
+    onBlur: (event: React.FocusEvent<HTMLInputElement>) => void;
+    onFocus: () => void;
+};

package/cjs/NumberInput/hooks/useEvents.js

@@ -0,0 +1,114 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.useEvents = useEvents;
+var _react = require("react");
+var _hooks = require("../../internals/hooks");
+var _constants = require("../../internals/constants");
+var _number = require("../utils/number");
+var _useWheelHandler = require("./useWheelHandler");
+function useEvents(params) {
+  const inputRef = (0, _react.useRef)(null);
+  const [isFocused, setIsFocused] = (0, _react.useState)(false);
+  const {
+    value,
+    onChangeValue,
+    scrollable,
+    disabled,
+    readOnly,
+    onWheel: onWheelProp,
+    min,
+    max,
+    step = 1,
+    decimalSeparator
+  } = params;
+  const getSafeValue = value => (0, _number.clampValue)(value, min, max);
+  const onStepUp = (0, _hooks.useEventCallback)(event => {
+    const val = +(value || 0);
+    const bit = (0, _number.decimals)(val, step);
+    onChangeValue(getSafeValue((val + step).toFixed(bit)), event);
+  });
+  const onStepDown = (0, _hooks.useEventCallback)(event => {
+    const val = +(value || 0);
+    const bit = (0, _number.decimals)(val, step);
+    onChangeValue(getSafeValue((val - step).toFixed(bit)), event);
+  });
+  const onKeyDown = (0, _hooks.useEventCallback)(event => {
+    switch (event.key) {
+      case _constants.KEY_VALUES.UP:
+        event.preventDefault();
+        onStepUp(event);
+        break;
+      case _constants.KEY_VALUES.DOWN:
+        event.preventDefault();
+        onStepDown(event);
+        break;
+      case _constants.KEY_VALUES.HOME:
+        if (typeof min !== 'undefined') {
+          event.preventDefault();
+          onChangeValue(getSafeValue(min), event);
+        }
+        break;
+      case _constants.KEY_VALUES.END:
+        if (typeof max !== 'undefined') {
+          event.preventDefault();
+          onChangeValue(getSafeValue(max), event);
+        }
+        break;
+      default:
+        break;
+    }
+  });
+  const handleWheel = (0, _hooks.useEventCallback)(event => {
+    if (!scrollable) {
+      event.preventDefault();
+      return;
+    }
+    if (!disabled && !readOnly && event.target === document.activeElement) {
+      event.preventDefault();
+      const delta = event.wheelDelta || -event.deltaY || -event.detail;
+      if (delta > 0) {
+        onStepDown(event);
+      }
+      if (delta < 0) {
+        onStepUp(event);
+      }
+    }
+    onWheelProp === null || onWheelProp === void 0 || onWheelProp(event);
+  });
+  const restoreDecimalSeparator = (0, _react.useCallback)(value => {
+    if (decimalSeparator && value) {
+      // Handle both custom decimalSeparator and standard decimal point '.'
+      if (decimalSeparator !== '.') {
+        // Create a regex that matches both the custom separator and '.'
+        const separatorRegex = new RegExp(`[${decimalSeparator.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&')}.]`, 'g');
+        return value.replace(separatorRegex, '.');
+      }
+      return value;
+    }
+    return value;
+  }, [decimalSeparator]);
+  const onBlur = event => {
+    var _event$target;
+    const value = restoreDecimalSeparator((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.value);
+    const targetValue = Number.parseFloat(value);
+    onChangeValue(getSafeValue(targetValue), event);
+    setIsFocused(false);
+  };
+  const onFocus = () => {
+    setIsFocused(true);
+  };
+
+  // wheel events
+  (0, _useWheelHandler.useWheelHandler)(inputRef, handleWheel, scrollable);
+  return {
+    inputRef,
+    isFocused,
+    onStepUp,
+    onStepDown,
+    onKeyDown,
+    onBlur,
+    onFocus
+  };
+}