Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Fix issue with month switching in date range picker

Browse Source 
The issue is related to the underlying react-dates library used
in woocommerce/components in calendar/date-range.js

See https://github.com/woocommerce/woocommerce/blob/trunk/packages/js/components/src/calendar/date-range.js#L45-L104

I was not able to fully understand why it started to happen after the update
but I have a suspicion that it may be related to the change that causes rendering
popups at the end of the body.

The Gutenberg library already moved away from react-dates and I assume
that Woo Components will do that as well.

This commit adds a patch that adds e.stopPropagation() to the place
where the original workaround is trying to prevent losing focus.

[MAILPOET-5714]
This commit is contained in:
Rostislav Wolny
2024-02-16 14:14:49 +01:00
committed by Aschepikov
parent 0835249258
commit 95fc8662a6
2 changed files with 133 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
patches/@woocommerce__components@12.1.0.patch
View File

@ -11,6 +11,18 @@ index 28db4c1a0a48499fe0c7b7f2fae3678a7939a02d..620cdcec1c284835d894eec4a3b609a0
/**
* Internal dependencies
*/
diff --git a/build-module/calendar/date-range.js b/build-module/calendar/date-range.js
index 0280f0c713915aced3fb3f3f5fd87e890b284cb4..176d0df7202cf9bc7d7efe5a7350ee622d6c5ad2 100644
--- a/build-module/calendar/date-range.js
+++ b/build-module/calendar/date-range.js
@@ -76,6 +76,7 @@ class DateRange extends Component {
const focusRegion = this.nodeRef.current.querySelector('.DayPicker_focusRegion');
if (focusRegion) {
focusRegion.focus();
+ e.stopPropagation();
}
return;
}
diff --git a/build-module/experimental.js b/build-module/experimental.js
index 7b6ec5b389beac67ca597563037a7a8eb0850bf4..9b627a428ca39ba933c05f1955d380f78632b0ef 100644
--- a/build-module/experimental.js
@ -133,4 +145,4 @@ index 1403343b9816eaabe7b9a763bb2a01107f3ad39e..442629d5805286f0563476adc40a7379
+ -ms-grid-columns: 1fr [4];
grid-template-columns: repeat(4, 1fr);
}
.woocommerce-summary.has-10-items .woocommerce-summary__item-container:nth-of-type(4n) .woocommerce-summary__item {
.woocommerce-summary.has-10-items .woocommerce-summary__item-container:nth-of-type(4n) .woocommerce-summary__item {