From 5f04cf1150d20e6c96577564e0a29fc1daa54bcd Mon Sep 17 00:00:00 2001 From: wuxh Date: Thu, 30 May 2024 13:58:37 +0800 Subject: [PATCH 1/5] :recycle: clean Code --- src/Rate.tsx | 39 ++++++++++----------------------------- 1 file changed, 10 insertions(+), 29 deletions(-) diff --git a/src/Rate.tsx b/src/Rate.tsx index ad8e18e..9f970cc 100644 --- a/src/Rate.tsx +++ b/src/Rate.tsx @@ -166,38 +166,19 @@ function Rate(props: RateProps, ref: React.Ref) { const onInternalKeyDown: React.KeyboardEventHandler = (event) => { const { keyCode } = event; const reverse = direction === 'rtl'; - let nextValue = value; - if (keyCode === KeyCode.RIGHT && nextValue < count && !reverse) { - if (allowHalf) { - nextValue += 0.5; - } else { - nextValue += 1; - } - changeValue(nextValue); + const step = allowHalf ? 0.5 : 1; + + if (keyCode === KeyCode.RIGHT && value < count && !reverse) { + changeValue(value + step); event.preventDefault(); - } else if (keyCode === KeyCode.LEFT && nextValue > 0 && !reverse) { - if (allowHalf) { - nextValue -= 0.5; - } else { - nextValue -= 1; - } - changeValue(nextValue); + } else if (keyCode === KeyCode.LEFT && value > 0 && !reverse) { + changeValue(value - step); event.preventDefault(); - } else if (keyCode === KeyCode.RIGHT && nextValue > 0 && reverse) { - if (allowHalf) { - nextValue -= 0.5; - } else { - nextValue -= 1; - } - changeValue(nextValue); + } else if (keyCode === KeyCode.RIGHT && value > 0 && reverse) { + changeValue(value - step); event.preventDefault(); - } else if (keyCode === KeyCode.LEFT && nextValue < count && reverse) { - if (allowHalf) { - nextValue += 0.5; - } else { - nextValue += 1; - } - changeValue(nextValue); + } else if (keyCode === KeyCode.LEFT && value < count && reverse) { + changeValue(value + step); event.preventDefault(); } From 214f6b7719953c9388f94915ba9c0b023461be93 Mon Sep 17 00:00:00 2001 From: wuxh Date: Thu, 30 May 2024 14:33:52 +0800 Subject: [PATCH 2/5] feat(rate): Allow disabling keyboard control --- src/Rate.tsx | 29 +++++++++++++++++------------ tests/simple.spec.js | 16 ++++++++++++++++ 2 files changed, 33 insertions(+), 12 deletions(-) diff --git a/src/Rate.tsx b/src/Rate.tsx index 9f970cc..bd17d04 100644 --- a/src/Rate.tsx +++ b/src/Rate.tsx @@ -27,6 +27,8 @@ export interface RateProps id?: string; autoFocus?: boolean; direction?: string; + /** Is keyboard control enabled. */ + keyboardControl?: boolean; } export interface RateRef { @@ -46,6 +48,7 @@ function Rate(props: RateProps, ref: React.Ref) { count = 5, allowHalf = false, allowClear = true, + keyboardControl = true, // Display character = '★', @@ -168,18 +171,20 @@ function Rate(props: RateProps, ref: React.Ref) { const reverse = direction === 'rtl'; const step = allowHalf ? 0.5 : 1; - if (keyCode === KeyCode.RIGHT && value < count && !reverse) { - changeValue(value + step); - event.preventDefault(); - } else if (keyCode === KeyCode.LEFT && value > 0 && !reverse) { - changeValue(value - step); - event.preventDefault(); - } else if (keyCode === KeyCode.RIGHT && value > 0 && reverse) { - changeValue(value - step); - event.preventDefault(); - } else if (keyCode === KeyCode.LEFT && value < count && reverse) { - changeValue(value + step); - event.preventDefault(); + if (keyboardControl) { + if (keyCode === KeyCode.RIGHT && value < count && !reverse) { + changeValue(value + step); + event.preventDefault(); + } else if (keyCode === KeyCode.LEFT && value > 0 && !reverse) { + changeValue(value - step); + event.preventDefault(); + } else if (keyCode === KeyCode.RIGHT && value > 0 && reverse) { + changeValue(value - step); + event.preventDefault(); + } else if (keyCode === KeyCode.LEFT && value < count && reverse) { + changeValue(value + step); + event.preventDefault(); + } } onKeyDown?.(event); diff --git a/tests/simple.spec.js b/tests/simple.spec.js index 5601199..26f406a 100644 --- a/tests/simple.spec.js +++ b/tests/simple.spec.js @@ -314,6 +314,22 @@ describe('rate', () => { wrapper.simulate('mouseleave'); expect(handleMouseLeave).toHaveBeenCalled(); }); + + it('should ignore key presses when keyboardControl is false', () => { + const mockChange = jest.fn(); + const mockKeyDown = jest.fn(); + const wrapper = mount( + + ); + wrapper.simulate('keyDown', { keyCode: KeyCode.LEFT }); + expect(mockChange).not.toHaveBeenCalled(); + expect(mockKeyDown).toHaveBeenCalled(); + }); }); describe('html attributes', () => { From 035340876db7a8d04de47b0d38ab9d1b058555ed Mon Sep 17 00:00:00 2001 From: wuxh Date: Thu, 30 May 2024 14:40:18 +0800 Subject: [PATCH 3/5] chore: rename --- src/Rate.tsx | 6 +++--- tests/simple.spec.js | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/Rate.tsx b/src/Rate.tsx index bd17d04..b4691c2 100644 --- a/src/Rate.tsx +++ b/src/Rate.tsx @@ -28,7 +28,7 @@ export interface RateProps autoFocus?: boolean; direction?: string; /** Is keyboard control enabled. */ - keyboardControl?: boolean; + keyboard?: boolean; } export interface RateRef { @@ -48,7 +48,7 @@ function Rate(props: RateProps, ref: React.Ref) { count = 5, allowHalf = false, allowClear = true, - keyboardControl = true, + keyboard = true, // Display character = '★', @@ -171,7 +171,7 @@ function Rate(props: RateProps, ref: React.Ref) { const reverse = direction === 'rtl'; const step = allowHalf ? 0.5 : 1; - if (keyboardControl) { + if (keyboard) { if (keyCode === KeyCode.RIGHT && value < count && !reverse) { changeValue(value + step); event.preventDefault(); diff --git a/tests/simple.spec.js b/tests/simple.spec.js index 26f406a..9247bdf 100644 --- a/tests/simple.spec.js +++ b/tests/simple.spec.js @@ -323,7 +323,7 @@ describe('rate', () => { defaultValue={3} onChange={mockChange} onKeyDown={mockKeyDown} - keyboardControl={false} + keyboard={false} /> ); wrapper.simulate('keyDown', { keyCode: KeyCode.LEFT }); From 822993db80f656600eaecd6b7df61ed6420cd018 Mon Sep 17 00:00:00 2001 From: wuxh Date: Thu, 30 May 2024 14:43:51 +0800 Subject: [PATCH 4/5] chore: update --- src/Rate.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/Rate.tsx b/src/Rate.tsx index b4691c2..b3285b9 100644 --- a/src/Rate.tsx +++ b/src/Rate.tsx @@ -27,7 +27,10 @@ export interface RateProps id?: string; autoFocus?: boolean; direction?: string; - /** Is keyboard control enabled. */ + /** + * Is keyboard control enabled. + * @default true + */ keyboard?: boolean; } From 9cf099b983ec597fc149b80b1053db13220befd8 Mon Sep 17 00:00:00 2001 From: wuxh Date: Thu, 30 May 2024 14:48:34 +0800 Subject: [PATCH 5/5] typo --- tests/simple.spec.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/simple.spec.js b/tests/simple.spec.js index 9247bdf..77c6271 100644 --- a/tests/simple.spec.js +++ b/tests/simple.spec.js @@ -315,7 +315,7 @@ describe('rate', () => { expect(handleMouseLeave).toHaveBeenCalled(); }); - it('should ignore key presses when keyboardControl is false', () => { + it('should ignore key presses when keyboard is false', () => { const mockChange = jest.fn(); const mockKeyDown = jest.fn(); const wrapper = mount(