rsuite 5.73.1 → 5.74.0-beta.0

package/cjs/FormHelpText/FormHelpText.js

@@ -8,11 +8,12 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _HelpOutline = _interopRequireDefault(require("@rsuite/icons/HelpOutline"));
 var _Tooltip = _interopRequireDefault(require("../Tooltip"));
 var _Whisper = _interopRequireDefault(require("../Whisper"));
 var _hooks = require("../internals/hooks");
 var _FormGroup = require("../FormGroup");
-var _HelpOutline = _interopRequireDefault(require("@rsuite/icons/HelpOutline"));
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["as", "classPrefix", "className", "tooltip", "children", "id"];
 /**
  * The `<Form.HelpText>` component is used to display help information in the form.
@@ -21,16 +22,18 @@ var _excluded = ["as", "classPrefix", "className", "tooltip", "children", "id"];
 var FormHelpText = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _useFormGroup = (0, _FormGroup.useFormGroup)(),
     helpTextId = _useFormGroup.helpTextId;
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'span' : _props$as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'form-help-text' : _props$classPrefix,
-    className = props.className,
-    tooltip = props.tooltip,
-    children = props.children,
-    _props$id = props.id,
-    id = _props$id === void 0 ? helpTextId : _props$id,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('FormHelpText', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'span' : _propsWithDefaults$as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'form-help-text' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    tooltip = propsWithDefaults.tooltip,
+    children = propsWithDefaults.children,
+    _propsWithDefaults$id = propsWithDefaults.id,
+    id = _propsWithDefaults$id === void 0 ? helpTextId : _propsWithDefaults$id,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge;

package/cjs/Grid/Grid.js

@@ -9,19 +9,22 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../internals/hooks");
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["as", "classPrefix", "className", "fluid"];
 /**
  * The Grid component is used to specify the layout of child elements in rows and columns.
  * @see https://rsuitejs.com/components/grid
  */
 var Grid = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'grid-container' : _props$classPrefix,
-    className = props.className,
-    fluid = props.fluid,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('Grid', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'grid-container' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    fluid = propsWithDefaults.fluid,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     prefix = _useClassNames.prefix,

package/cjs/Heading/Heading.js

@@ -9,6 +9,7 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../internals/hooks");
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["as", "classPrefix", "className", "level"];
 /**
  *
@@ -17,13 +18,15 @@ var _excluded = ["as", "classPrefix", "className", "level"];
  * @see https://rsuitejs.com/components/heading
  */
 var Heading = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var as = props.as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'heading' : _props$classPrefix,
-    className = props.className,
-    _props$level = props.level,
-    level = _props$level === void 0 ? 3 : _props$level,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('Heading', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var as = propsWithDefaults.as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'heading' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    _propsWithDefaults$le = propsWithDefaults.level,
+    level = _propsWithDefaults$le === void 0 ? 3 : _propsWithDefaults$le,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge;

package/cjs/Highlight/Highlight.js

@@ -11,6 +11,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../internals/hooks");
 var _highlightText = require("./utils/highlightText");
 var _utils = require("../internals/utils");
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["as", "classPrefix", "className", "children", "query", "renderMark"];
 function defaultRenderMark(match, index) {
   return /*#__PURE__*/_react.default.createElement("mark", {
@@ -26,16 +27,18 @@ function defaultRenderMark(match, index) {
  * @see https://rsuitejs.com/components/highlight
  */
 var Highlight = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'highlight' : _props$classPrefix,
-    className = props.className,
-    children = props.children,
-    query = props.query,
-    _props$renderMark = props.renderMark,
-    renderMark = _props$renderMark === void 0 ? defaultRenderMark : _props$renderMark,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('Highlight', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'highlight' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    children = propsWithDefaults.children,
+    query = propsWithDefaults.query,
+    _propsWithDefaults$re = propsWithDefaults.renderMark,
+    renderMark = _propsWithDefaults$re === void 0 ? defaultRenderMark : _propsWithDefaults$re,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge;

package/cjs/IconButton/IconButton.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
+import Button, { ButtonProps } from '../Button';
 import { IconProps } from '@rsuite/icons/Icon';
 import { RsRefForwardingComponent } from '../internals/types';
-import Button, { ButtonProps } from '../Button';
 export interface IconButtonProps extends ButtonProps {
     /** Set the icon */
     icon?: React.ReactElement<IconProps>;

package/cjs/IconButton/IconButton.js

@@ -8,24 +8,27 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Button = _interopRequireDefault(require("../Button"));
 var _propTypes2 = require("../internals/propTypes");
 var _hooks = require("../internals/hooks");
-var _Button = _interopRequireDefault(require("../Button"));
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["icon", "placement", "children", "circle", "classPrefix", "className"];
 /**
  * The `IconButton` component is used to specify a button with icon.
  * @see https://rsuitejs.com/components/button
  */
 var IconButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var icon = props.icon,
-    _props$placement = props.placement,
-    placement = _props$placement === void 0 ? 'left' : _props$placement,
-    children = props.children,
-    circle = props.circle,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'btn-icon' : _props$classPrefix,
-    className = props.className,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('IconButton', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var icon = propsWithDefaults.icon,
+    _propsWithDefaults$pl = propsWithDefaults.placement,
+    placement = _propsWithDefaults$pl === void 0 ? 'left' : _propsWithDefaults$pl,
+    children = propsWithDefaults.children,
+    circle = propsWithDefaults.circle,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'btn-icon' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     merge = _useClassNames.merge,
     withClassPrefix = _useClassNames.withClassPrefix;

package/cjs/InlineEdit/InlineEdit.js

@@ -15,23 +15,26 @@ var _EditableControls = _interopRequireDefault(require("./EditableControls"));
 var _useFocusEvent2 = _interopRequireDefault(require("./useFocusEvent"));
 var _useEditState2 = _interopRequireDefault(require("./useEditState"));
 var _renderChildren = require("./renderChildren");
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["as", "children", "classPrefix", "className", "disabled", "size", "showControls", "stateOnBlur", "placeholder"];
 var InlineEdit = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    _props$children = props.children,
-    children = _props$children === void 0 ? _renderChildren.defaultRenderInput : _props$children,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'inline-edit' : _props$classPrefix,
-    className = props.className,
-    disabled = props.disabled,
-    size = props.size,
-    _props$showControls = props.showControls,
-    showControls = _props$showControls === void 0 ? true : _props$showControls,
-    _props$stateOnBlur = props.stateOnBlur,
-    stateOnBlur = _props$stateOnBlur === void 0 ? 'save' : _props$stateOnBlur,
-    placeholder = props.placeholder,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('InlineEdit', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    _propsWithDefaults$ch = propsWithDefaults.children,
+    children = _propsWithDefaults$ch === void 0 ? _renderChildren.defaultRenderInput : _propsWithDefaults$ch,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'inline-edit' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    disabled = propsWithDefaults.disabled,
+    size = propsWithDefaults.size,
+    _propsWithDefaults$sh = propsWithDefaults.showControls,
+    showControls = _propsWithDefaults$sh === void 0 ? true : _propsWithDefaults$sh,
+    _propsWithDefaults$st = propsWithDefaults.stateOnBlur,
+    stateOnBlur = _propsWithDefaults$st === void 0 ? 'save' : _propsWithDefaults$st,
+    placeholder = propsWithDefaults.placeholder,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge,

package/cjs/Input/Input.js

@@ -15,6 +15,7 @@ var _constants = require("../internals/constants");
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
 var _propTypes2 = require("../internals/propTypes");
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["className", "classPrefix", "as", "type", "disabled", "value", "defaultValue", "inputRef", "id", "size", "htmlSize", "plaintext", "placeholder", "readOnly", "onPressEnter", "onFocus", "onBlur", "onKeyDown", "onChange"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
@@ -24,29 +25,31 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * @see https://rsuitejs.com/components/input
  */
 var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var className = props.className,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'input' : _props$classPrefix,
-    _props$as = props.as,
-    Component = _props$as === void 0 ? 'input' : _props$as,
-    _props$type = props.type,
-    type = _props$type === void 0 ? 'text' : _props$type,
-    disabled = props.disabled,
-    value = props.value,
-    defaultValue = props.defaultValue,
-    inputRef = props.inputRef,
-    id = props.id,
-    size = props.size,
-    htmlSize = props.htmlSize,
-    plaintext = props.plaintext,
-    placeholder = props.placeholder,
-    readOnly = props.readOnly,
-    onPressEnter = props.onPressEnter,
-    onFocus = props.onFocus,
-    onBlur = props.onBlur,
-    onKeyDown = props.onKeyDown,
-    onChange = props.onChange,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('Input', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var className = propsWithDefaults.className,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'input' : _propsWithDefaults$cl,
+    _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'input' : _propsWithDefaults$as,
+    _propsWithDefaults$ty = propsWithDefaults.type,
+    type = _propsWithDefaults$ty === void 0 ? 'text' : _propsWithDefaults$ty,
+    disabled = propsWithDefaults.disabled,
+    value = propsWithDefaults.value,
+    defaultValue = propsWithDefaults.defaultValue,
+    inputRef = propsWithDefaults.inputRef,
+    id = propsWithDefaults.id,
+    size = propsWithDefaults.size,
+    htmlSize = propsWithDefaults.htmlSize,
+    plaintext = propsWithDefaults.plaintext,
+    placeholder = propsWithDefaults.placeholder,
+    readOnly = propsWithDefaults.readOnly,
+    onPressEnter = propsWithDefaults.onPressEnter,
+    onFocus = propsWithDefaults.onFocus,
+    onBlur = propsWithDefaults.onBlur,
+    onKeyDown = propsWithDefaults.onKeyDown,
+    onChange = propsWithDefaults.onChange,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var handleKeyDown = function handleKeyDown(event) {
     if (event.key === _constants.KEY_VALUES.ENTER) {
       onPressEnter === null || onPressEnter === void 0 ? void 0 : onPressEnter(event);

package/cjs/InputGroup/InputGroup.js

@@ -12,6 +12,7 @@ var _InputGroupAddon = _interopRequireDefault(require("./InputGroupAddon"));
 var _InputGroupButton = _interopRequireDefault(require("./InputGroupButton"));
 var _hooks = require("../internals/hooks");
 var _propTypes2 = require("../internals/propTypes");
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["as", "classPrefix", "className", "disabled", "inside", "size", "children"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
@@ -21,16 +22,18 @@ var InputGroupContext = exports.InputGroupContext = /*#__PURE__*/_react.default.
  * @see https://rsuitejs.com/components/input/#input-group
  */
 var InputGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'input-group' : _props$classPrefix,
-    className = props.className,
-    disabled = props.disabled,
-    inside = props.inside,
-    size = props.size,
-    children = props.children,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('InputGroup', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'input-group' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    disabled = propsWithDefaults.disabled,
+    inside = propsWithDefaults.inside,
+    size = propsWithDefaults.size,
+    children = propsWithDefaults.children,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var _useState = (0, _react.useState)(false),
     focus = _useState[0],
     setFocus = _useState[1];

package/cjs/InputNumber/InputNumber.js

@@ -20,6 +20,7 @@ var _hooks = require("../internals/hooks");
 var _constants = require("../internals/constants");
 var _utils = require("../internals/utils");
 var _propTypes2 = require("../internals/propTypes");
+var _CustomProvider = require("../CustomProvider");
 var _excluded = ["as", "className", "classPrefix", "disabled", "decimalSeparator", "formatter", "readOnly", "plaintext", "value", "defaultValue", "size", "prefix", "postfix", "step", "buttonAppearance", "min", "max", "scrollable", "onChange", "onWheel", "onBlur", "onFocus"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
@@ -83,34 +84,36 @@ function valueReachesMin(value, min) {
  * @see https://rsuitejs.com/components/input-number
  */
 var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? _InputGroup.default : _props$as,
-    className = props.className,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'input-number' : _props$classPrefix,
-    disabled = props.disabled,
-    decimalSeparator = props.decimalSeparator,
-    formatter = props.formatter,
-    readOnly = props.readOnly,
-    plaintext = props.plaintext,
-    valueProp = props.value,
-    defaultValue = props.defaultValue,
-    size = props.size,
-    prefixElement = props.prefix,
-    postfix = props.postfix,
-    _props$step = props.step,
-    step = _props$step === void 0 ? 1 : _props$step,
-    _props$buttonAppearan = props.buttonAppearance,
-    buttonAppearance = _props$buttonAppearan === void 0 ? 'subtle' : _props$buttonAppearan,
-    minProp = props.min,
-    maxProp = props.max,
-    _props$scrollable = props.scrollable,
-    scrollable = _props$scrollable === void 0 ? true : _props$scrollable,
-    onChange = props.onChange,
-    onWheel = props.onWheel,
-    onBlur = props.onBlur,
-    onFocus = props.onFocus,
-    restProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var _useCustom = (0, _CustomProvider.useCustom)('InputNumber', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? _InputGroup.default : _propsWithDefaults$as,
+    className = propsWithDefaults.className,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'input-number' : _propsWithDefaults$cl,
+    disabled = propsWithDefaults.disabled,
+    decimalSeparator = propsWithDefaults.decimalSeparator,
+    formatter = propsWithDefaults.formatter,
+    readOnly = propsWithDefaults.readOnly,
+    plaintext = propsWithDefaults.plaintext,
+    valueProp = propsWithDefaults.value,
+    defaultValue = propsWithDefaults.defaultValue,
+    size = propsWithDefaults.size,
+    prefixElement = propsWithDefaults.prefix,
+    postfix = propsWithDefaults.postfix,
+    _propsWithDefaults$st = propsWithDefaults.step,
+    step = _propsWithDefaults$st === void 0 ? 1 : _propsWithDefaults$st,
+    _propsWithDefaults$bu = propsWithDefaults.buttonAppearance,
+    buttonAppearance = _propsWithDefaults$bu === void 0 ? 'subtle' : _propsWithDefaults$bu,
+    minProp = propsWithDefaults.min,
+    maxProp = propsWithDefaults.max,
+    _propsWithDefaults$sc = propsWithDefaults.scrollable,
+    scrollable = _propsWithDefaults$sc === void 0 ? true : _propsWithDefaults$sc,
+    onChange = propsWithDefaults.onChange,
+    onWheel = propsWithDefaults.onWheel,
+    onBlur = propsWithDefaults.onBlur,
+    onFocus = propsWithDefaults.onFocus,
+    restProps = (0, _objectWithoutPropertiesLoose2.default)(propsWithDefaults, _excluded);
   var min = minProp !== null && minProp !== void 0 ? minProp : -Infinity;
   var max = maxProp !== null && maxProp !== void 0 ? maxProp : Infinity;
   var _useControlled = (0, _hooks.useControlled)(valueProp, defaultValue),