From 1f08e6df1009f8f5b0a7b9c85f4c2e2fafd8856b Mon Sep 17 00:00:00 2001 From: water <672684719@qq.com> Date: Tue, 11 Aug 2026 14:36:57 +0800 Subject: [PATCH] fix(RangeCalendar): use getEventTarget for shadow DOM compatibility When RangeCalendar is rendered inside a shadow root, the window-level pointerup listener (endDragging) reads e.target directly. In shadow DOM, events are retargeted so e.target is the shadow host, not the actual calendar cell button. This causes nodeContains to always return false, and commitSelection() runs on every single click, immediately committing start === end. Fix: use the existing getEventTarget helper which reads e.composedPath()[0] from the event, giving the actual target element even inside shadow DOM. Closes #10330 --- packages/react-aria/src/calendar/useRangeCalendar.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react-aria/src/calendar/useRangeCalendar.ts b/packages/react-aria/src/calendar/useRangeCalendar.ts index 7708c00c56d..6aa7a1e9e93 100644 --- a/packages/react-aria/src/calendar/useRangeCalendar.ts +++ b/packages/react-aria/src/calendar/useRangeCalendar.ts @@ -13,7 +13,7 @@ import {AriaLabelingProps, DOMProps, FocusableElement, RefObject} from '@react-types/shared'; import {CalendarAria, useCalendarBase} from './useCalendarBase'; import {DateValue, RangeCalendarState} from 'react-stately/useRangeCalendarState'; -import {isFocusWithin, nodeContains} from '../utils/shadowdom/DOMFunctions'; +import {getEventTarget, isFocusWithin, nodeContains} from '../utils/shadowdom/DOMFunctions'; import {RangeCalendarProps} from 'react-stately/useRangeCalendarState'; import {useEvent} from '../utils/useEvent'; import {useRef} from 'react'; @@ -76,7 +76,7 @@ export function useRangeCalendar( return; } - let target = e.target as Element; + let target = getEventTarget(e) as Element; if ( ref.current && isFocusWithin(ref.current) &&