ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(lion-calendar): Make calendar buttons selectable on firefox through datepicker (#2080)

Browse source
This commit is contained in:
barna 2023-10-17 14:52:53 +02:00 committed by GitHub
parent b1320a9a9c
commit 63a8e725db
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/yellow-timers-poke.md Normal file
View file

@ -0,0 +1,5 @@
---
'@lion/ui': patch
---
lion-calendar: when determining if user interacted with a day button, use event.composedPath()[0] instead of event.target to fix Firefox 111+ issue

6
packages/ui/components/calendar/src/LionCalendar.js
View file

@ -799,7 +799,7 @@ export class LionCalendar extends LocalizeMixin(LitElement) {
* @private * @private
*/ */
__clickDateDelegation(ev) { __clickDateDelegation(ev) {
const el = /** @type {HTMLElement & { date: Date }} */ (ev.target); const el = /** @type {HTMLElement & { date: Date }} */ (ev.composedPath()[0]);
if (isDayButton(el) && !isDisabledDayButton(el)) { if (isDayButton(el) && !isDisabledDayButton(el)) {
this.__dateSelectedByUser(el.date); this.__dateSelectedByUser(el.date);
} }
@ -866,7 +866,9 @@ export class LionCalendar extends LocalizeMixin(LitElement) {
switch (ev.key) { switch (ev.key) {
case ' ': case ' ':
case 'Enter': case 'Enter':
this.__dayButtonSelection(/** @type {HTMLElement & { date: Date }} */ (ev.target)); this.__dayButtonSelection(
/** @type {HTMLElement & { date: Date }} */ (ev.composedPath()[0]),
);
break; break;
case 'ArrowUp': case 'ArrowUp':
this.__modifyDate(-7, { dateType: '__focusedDate', type: 'Date' }); this.__modifyDate(-7, { dateType: '__focusedDate', type: 'Date' });