Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
muslnode 18–226 runs
build_error
glibcnode 18–226 runs
build_error
Code
Verified usage
Verified import paths — ran on the pinned version, not inferred.
InputNumber
✓ import InputNumber from '@rc-component/input-number';
✗ import InputNumber from 'rc-input-number';
The package was renamed from `rc-input-number` to `@rc-component/input-number` in version 1.5.0. Always use the new scoped package name for modern usage.
InputNumber (CommonJS)
✓ const InputNumber = require('@rc-component/input-number').default;
✗ const InputNumber = require('@rc-component/input-number');
For CommonJS environments, ensure you access the `.default` property for the main component export, as it's typically an ESM default export.
InputNumberProps (TypeScript type)
✓ import type { InputNumberProps } from '@rc-component/input-number';
✗ import { InputNumberProps } from 'rc-input-number';
Type imports should also use the new scoped package name `@rc-component/input-number`.
Demonstrates a basic controlled `InputNumber` component with min/max, step, and change handling, highlighting its unstyled nature that requires custom CSS for presentation.
import React, { useState } from 'react';
import InputNumber from '@rc-component/input-number';
// Basic CSS for visibility (you would typically integrate with your design system)
const inputNumberStyles = {
width: 120,
padding: 8,
borderRadius: 4,
border: '1px solid #ccc',
fontSize: 16
};
export default function MyInputNumber() {
const [value, setValue] = useState(10);
const onChange = (newValue: number | null) => {
console.log('Value changed:', newValue);
// The component can return null for empty input, handle as needed
setValue(newValue === null ? 0 : newValue);
};
return (
<div>
<h3>Basic InputNumber Example</h3>
<InputNumber
min={0}
max={100}
step={1}
defaultValue={10}
value={value}
onChange={onChange}
placeholder="Enter a number"
style={inputNumberStyles}
// Use prefixCls for targeted CSS customization
prefixCls="my-custom-input-number"
/>
<p>Current Value: {value}</p>
<button onClick={() => setValue(value + 5)}>Increment by 5</button>
<p>This component is unstyled and requires custom CSS for visual appearance.</p>
</div>
);
}
Debug
Known issues
breakingThe package name was changed from `rc-input-number` to `@rc-component/input-number` in version 1.5.0. All imports must be updated.fixUpdate all `import` and `require` statements in your codebase from `'rc-input-number'` to `'@rc-component/input-number'`, and update your `package.json` dependencies.
affects: >=1.5.0 (for @rc-component/input-number) or all versions of the old `rc-input-number` when migrating.
breakingThe `type` prop was renamed to `mode` at `@rc-component/input-number@1.5.0`. This is a breaking API change if you were using the `type` prop.fixReplace any usage of the `type` prop with `mode` in your `InputNumber` component usage.
affects: >=1.5.0
breakingThe component underwent a semantic refactor at `@rc-component/input-number@1.6.0`, which might introduce subtle behavioral changes or require adjustments if relying on internal DOM structure or specific event handling previously.fixReview your usage of the component, especially if you have custom styling based on its internal structure or complex event listeners. Test thoroughly after upgrading.
affects: >=1.6.0
gotchaThe `InputNumber` component is unstyled by default. Consumers are responsible for providing their own CSS or styling solutions to make it visually appealing and functional within their application's design system.fixProvide custom CSS for the `InputNumber` component, leveraging the `prefixCls` prop (default `rc-input-number` or custom) for scoped styling. Consider using a UI library that wraps this component for pre-built styles.
affects: >=1.0.0
Errors
Common errors & fixes
Module not found: Can't resolve 'rc-input-number'
Attempting to import the component using its old package name after the rename to `@rc-component/input-number`.
fixChange your import statement from `import InputNumber from 'rc-input-number';` to `import InputNumber from '@rc-component/input-number';` and update your `package.json`.
Property 'type' does not exist on type 'InputNumberProps'. Did you mean 'mode'?
Using the deprecated `type` prop instead of the `mode` prop on `InputNumber` after upgrading to `@rc-component/input-number@1.5.0` or later.
fixRename the prop from `type` to `mode` in your `InputNumber` component usage.
Audit
Dependencies
reactrequiredPeer dependency required for rendering React components.
react-domrequiredPeer dependency required for rendering React components to the DOM.