Skip to content

Commit

Permalink
feat: support changeOnBlur (#596)
Browse files Browse the repository at this point in the history
  • Loading branch information
zombieJ authored Oct 18, 2023
1 parent bb48d80 commit 1155356
Show file tree
Hide file tree
Showing 3 changed files with 33 additions and 3 deletions.
13 changes: 12 additions & 1 deletion docs/demo/simple.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/* eslint no-console:0 */
import React from 'react';
import InputNumber from 'rc-input-number';
import React from 'react';
import '../../assets/index.less';

export default () => {
Expand Down Expand Up @@ -54,6 +54,17 @@ export default () => {
max={99}
defaultValue={33}
/>

<hr />
<h3>!changeOnBlur</h3>
<InputNumber
style={{ width: 100 }}
min={-9}
max={9}
defaultValue={10}
onChange={onChange}
changeOnBlur={false}
/>
</div>
);
};
12 changes: 10 additions & 2 deletions src/InputNumber.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,11 @@ export interface InputNumberProps<T extends ValueType = ValueType>
// focusOnUpDown: boolean;
// useTouch: boolean;

// size?: ISize;
/**
* Trigger change onBlur event.
* If disabled, user must press enter or click handler to confirm the value update
*/
changeOnBlur?: boolean;
}

type InternalInputNumberProps = Omit<InputNumberProps, 'prefix' | 'suffix'>;
Expand Down Expand Up @@ -138,6 +142,8 @@ const InternalInputNumber = React.forwardRef(
onPressEnter,
onStep,

changeOnBlur = true,

...inputProps
} = props;

Expand Down Expand Up @@ -513,7 +519,9 @@ const InternalInputNumber = React.forwardRef(

// >>> Focus & Blur
const onBlur = () => {
flushInputValue(false);
if (changeOnBlur) {
flushInputValue(false);
}

setFocus(false);

Expand Down
11 changes: 11 additions & 0 deletions tests/input.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -212,4 +212,15 @@ describe('InputNumber.Input', () => {
expect(onChange).toHaveBeenLastCalledWith(null);
});
});

it('!changeOnBlur', () => {
const onChange = jest.fn();

const { container } = render(
<InputNumber min={0} max={9} defaultValue={10} changeOnBlur={false} onChange={onChange} />,
);

fireEvent.blur(container.querySelector('input'));
expect(onChange).not.toHaveBeenCalled();
});
});

0 comments on commit 1155356

Please sign in to comment.