Skip to content

fix(module:range-picker): clear outline on mouse leave - #9352

Merged
Laffery merged 1 commit into
NG-ZORRO:masterfrom
keke521jie:fix/datepicker/selection-box-cancelled
Aug 28, 2025
Merged

fix(module:range-picker): clear outline on mouse leave#9352
Laffery merged 1 commit into
NG-ZORRO:masterfrom
keke521jie:fix/datepicker/selection-box-cancelled

Conversation

@keke521jie

@keke521jie keke521jie commented Aug 25, 2025

Copy link
Copy Markdown
Contributor

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Application (the showcase website) / infrastructure changes
  • Other... Please describe:

What is the current behavior?

Issue Number: close #6323

What is the new behavior?

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

@keke521jie
keke521jie requested a review from wenqi73 as a code owner August 25, 2025 09:32
@codecov

codecov Bot commented Aug 25, 2025

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 42.85714% with 4 lines in your changes missing coverage. Please review.
✅ Project coverage is 92.07%. Comparing base (d878658) to head (c92854e).
⚠️ Report is 8 commits behind head on master.

Files with missing lines Patch % Lines
...mponents/date-picker/date-range-popup.component.ts 50.00% 2 Missing ⚠️
components/date-picker/inner-popup.component.ts 33.33% 2 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##           master    #9352      +/-   ##
==========================================
- Coverage   92.09%   92.07%   -0.02%     
==========================================
  Files         561      561              
  Lines       19652    19658       +6     
  Branches     3004     3005       +1     
==========================================
+ Hits        18099    18101       +2     
- Misses       1216     1220       +4     
  Partials      337      337              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@Laffery
Laffery requested a review from Copilot August 26, 2025 05:38

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR clears the hover outline effect in the range picker component when the mouse leaves the popup area. It addresses issue #6323 by ensuring that range selection visual feedback is properly cleared when the user moves their cursor away from the date picker.

  • Adds a mouseleave event handler to the main popup container
  • Implements onLeave() method to emit the last selected date on mouse leave
  • Ensures proper cleanup of hover states for better user experience

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

}

onLeave(): void {
const lastSelectedDate = this.selectedValue.length > 0 ? this.selectedValue[this.selectedValue.length - 1] : void 0;

Copilot AI Aug 26, 2025

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[nitpick] Using void 0 instead of undefined is unnecessarily obscure. Consider using undefined for better readability.

Suggested change
const lastSelectedDate = this.selectedValue.length > 0 ? this.selectedValue[this.selectedValue.length - 1] : void 0;
const lastSelectedDate = this.selectedValue.length > 0 ? this.selectedValue[this.selectedValue.length - 1] : undefined;

Copilot uses AI. Check for mistakes.
Comment on lines +226 to +228
onLeave(): void {
const lastSelectedDate = this.selectedValue.length > 0 ? this.selectedValue[this.selectedValue.length - 1] : void 0;

this.cellHover.emit(lastSelectedDate);
}

Copilot AI Aug 26, 2025

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The onLeave() method lacks documentation. Add a JSDoc comment explaining its purpose of clearing hover states when the mouse leaves the picker area.

Copilot uses AI. Check for mistakes.

@Nicoss54 Nicoss54 left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

Comment thread components/date-picker/inner-popup.component.ts Outdated
@keke521jie
keke521jie force-pushed the fix/datepicker/selection-box-cancelled branch from 4407a07 to c92854e Compare August 26, 2025 10:28

@Laffery Laffery left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@Laffery Laffery changed the title refactor(module:range-picker): clear outline on mouse leave/close fix(module:range-picker): clear outline on mouse leave Aug 28, 2025
@Laffery
Laffery merged commit 573d092 into NG-ZORRO:master Aug 28, 2025
7 of 10 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

RangePicker: Selection outline remains after mousing away from or dismissing component

4 participants