Skip to content

[pull] main from adobe:main #118

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pull merged 4 commits into from
Aug 29, 2025
Merged

[pull] main from adobe:main #118

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
f1f0329
fix: Overlay positioning incorrect when animation starts on first ren…
devongovett Aug 28, 2025
47b4d87
Revert "chore: add dnd hooks to rac (#8743)" (#8793)
LFDanLu Aug 28, 2025
ed4815e
Publish
devongovett Aug 28, 2025
6a86b5c
chore: Revert "Revert "chore: add dnd hooks to rac (#8743)" (#8793)" …
LFDanLu Aug 28, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
64 changes: 32 additions & 32 deletions packages/@adobe/react-spectrum/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@adobe/react-spectrum",
"version": "3.44.0",
"version": "3.44.1",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down Expand Up @@ -41,30 +41,30 @@
},
"dependencies": {
"@internationalized/string": "^3.2.7",
"@react-aria/collections": "3.0.0-rc.5",
"@react-aria/collections": "3.0.0-rc.6",
"@react-aria/i18n": "^3.12.12",
"@react-aria/ssr": "^3.9.10",
"@react-aria/utils": "^3.30.1",
"@react-aria/visually-hidden": "^3.8.27",
"@react-spectrum/accordion": "^3.0.10",
"@react-spectrum/actionbar": "^3.6.11",
"@react-spectrum/actiongroup": "^3.11.1",
"@react-spectrum/accordion": "^3.0.11",
"@react-spectrum/actionbar": "^3.6.12",
"@react-spectrum/actiongroup": "^3.11.2",
"@react-spectrum/avatar": "^3.0.25",
"@react-spectrum/badge": "^3.1.27",
"@react-spectrum/breadcrumbs": "^3.9.21",
"@react-spectrum/button": "^3.17.1",
"@react-spectrum/badge": "^3.1.28",
"@react-spectrum/breadcrumbs": "^3.9.22",
"@react-spectrum/button": "^3.17.2",
"@react-spectrum/buttongroup": "^3.6.25",
"@react-spectrum/calendar": "^3.7.5",
"@react-spectrum/checkbox": "^3.10.1",
"@react-spectrum/color": "^3.1.1",
"@react-spectrum/combobox": "^3.16.1",
"@react-spectrum/contextualhelp": "^3.6.25",
"@react-spectrum/datepicker": "^3.14.5",
"@react-spectrum/dialog": "^3.9.1",
"@react-spectrum/calendar": "^3.7.6",
"@react-spectrum/checkbox": "^3.10.2",
"@react-spectrum/color": "^3.1.2",
"@react-spectrum/combobox": "^3.16.2",
"@react-spectrum/contextualhelp": "^3.6.26",
"@react-spectrum/datepicker": "^3.14.6",
"@react-spectrum/dialog": "^3.9.2",
"@react-spectrum/divider": "^3.5.26",
"@react-spectrum/dnd": "^3.6.0",
"@react-spectrum/dropzone": "^3.0.15",
"@react-spectrum/filetrigger": "^3.0.15",
"@react-spectrum/dnd": "^3.6.1",
"@react-spectrum/dropzone": "^3.0.16",
"@react-spectrum/filetrigger": "^3.0.16",
"@react-spectrum/form": "^3.7.18",
"@react-spectrum/icon": "^3.8.8",
"@react-spectrum/illustratedmessage": "^3.5.13",
Expand All @@ -73,31 +73,31 @@
"@react-spectrum/labeledvalue": "^3.2.6",
"@react-spectrum/layout": "^3.6.18",
"@react-spectrum/link": "^3.6.21",
"@react-spectrum/list": "^3.10.5",
"@react-spectrum/listbox": "^3.15.5",
"@react-spectrum/menu": "^3.22.5",
"@react-spectrum/list": "^3.10.6",
"@react-spectrum/listbox": "^3.15.6",
"@react-spectrum/menu": "^3.22.6",
"@react-spectrum/meter": "^3.5.13",
"@react-spectrum/numberfield": "^3.10.1",
"@react-spectrum/overlays": "^5.8.1",
"@react-spectrum/picker": "^3.16.1",
"@react-spectrum/overlays": "^5.8.2",
"@react-spectrum/picker": "^3.16.2",
"@react-spectrum/progress": "^3.7.19",
"@react-spectrum/provider": "^3.10.9",
"@react-spectrum/provider": "^3.10.10",
"@react-spectrum/radio": "^3.7.20",
"@react-spectrum/searchfield": "^3.8.20",
"@react-spectrum/searchfield": "^3.8.21",
"@react-spectrum/slider": "^3.8.1",
"@react-spectrum/statuslight": "^3.5.25",
"@react-spectrum/switch": "^3.6.5",
"@react-spectrum/table": "^3.17.5",
"@react-spectrum/tabs": "^3.8.24",
"@react-spectrum/tag": "^3.3.4",
"@react-spectrum/text": "^3.5.19",
"@react-spectrum/table": "^3.17.6",
"@react-spectrum/tabs": "^3.8.25",
"@react-spectrum/tag": "^3.3.5",
"@react-spectrum/text": "^3.5.20",
"@react-spectrum/textfield": "^3.14.1",
"@react-spectrum/theme-dark": "^3.5.21",
"@react-spectrum/theme-default": "^3.5.21",
"@react-spectrum/theme-light": "^3.4.21",
"@react-spectrum/toast": "^3.1.1",
"@react-spectrum/tooltip": "^3.7.9",
"@react-spectrum/tree": "^3.1.5",
"@react-spectrum/toast": "^3.1.2",
"@react-spectrum/tooltip": "^3.7.10",
"@react-spectrum/tree": "^3.1.6",
"@react-spectrum/view": "^3.6.22",
"@react-spectrum/well": "^3.4.26",
"@react-stately/collections": "^3.12.7",
Expand Down
4 changes: 2 additions & 2 deletions packages/@react-aria/autocomplete/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/autocomplete",
"version": "3.0.0-rc.0",
"version": "3.0.0-rc.1",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand All @@ -26,7 +26,7 @@
"url": "https://github.com/adobe/react-spectrum"
},
"dependencies": {
"@react-aria/combobox": "^3.13.1",
"@react-aria/combobox": "^3.13.2",
"@react-aria/focus": "^3.21.1",
"@react-aria/i18n": "^3.12.12",
"@react-aria/interactions": "^3.25.5",
Expand Down
2 changes: 1 addition & 1 deletion packages/@react-aria/collections/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/collections",
"version": "3.0.0-rc.5",
"version": "3.0.0-rc.6",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down
1 change: 0 additions & 1 deletion packages/@react-aria/collections/src/BaseCollection.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,6 @@ export class BaseCollection<T> implements ICollection<Node<T>> {
private lastKey: Key | null = null;
private frozen = false;
private itemCount: number = 0;
isComplete = true;

get size(): number {
return this.itemCount;
Expand Down
1 change: 0 additions & 1 deletion packages/@react-aria/collections/src/CollectionBuilder.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,6 @@ function useCollectionDocument<T extends object, C extends BaseCollection<T>>(cr
let collection = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
useLayoutEffect(() => {
document.isMounted = true;
document.isInitialRender = false;
return () => {
// Mark unmounted so we can skip all of the collection updates caused by
// React calling removeChild on every item in the collection.
Expand Down
5 changes: 0 additions & 5 deletions packages/@react-aria/collections/src/Document.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -416,7 +416,6 @@ export class Document<T, C extends BaseCollection<T> = BaseCollection<T>> extend
nodeId = 0;
nodesByProps: WeakMap<object, ElementNode<T>> = new WeakMap<object, ElementNode<T>>();
isMounted = true;
isInitialRender = true;
private collection: C;
private nextCollection: C | null = null;
private subscriptions: Set<() => void> = new Set();
Expand Down Expand Up @@ -523,10 +522,6 @@ export class Document<T, C extends BaseCollection<T> = BaseCollection<T>> extend
this.nextCollection = null;
}
}

if (this.isInitialRender) {
this.collection.isComplete = false;
}
}

queueUpdate(): void {
Expand Down
6 changes: 3 additions & 3 deletions packages/@react-aria/combobox/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/combobox",
"version": "3.13.1",
"version": "3.13.2",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down Expand Up @@ -30,8 +30,8 @@
"@react-aria/i18n": "^3.12.12",
"@react-aria/listbox": "^3.14.8",
"@react-aria/live-announcer": "^3.4.4",
"@react-aria/menu": "^3.19.1",
"@react-aria/overlays": "^3.29.0",
"@react-aria/menu": "^3.19.2",
"@react-aria/overlays": "^3.29.1",
"@react-aria/selection": "^3.25.1",
"@react-aria/textfield": "^3.18.1",
"@react-aria/utils": "^3.30.1",
Expand Down
4 changes: 2 additions & 2 deletions packages/@react-aria/dialog/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/dialog",
"version": "3.5.29",
"version": "3.5.30",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down Expand Up @@ -31,7 +31,7 @@
},
"dependencies": {
"@react-aria/interactions": "^3.25.5",
"@react-aria/overlays": "^3.29.0",
"@react-aria/overlays": "^3.29.1",
"@react-aria/utils": "^3.30.1",
"@react-types/dialog": "^3.5.21",
"@react-types/shared": "^3.32.0",
Expand Down
4 changes: 2 additions & 2 deletions packages/@react-aria/dnd/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/dnd",
"version": "3.11.1",
"version": "3.11.2",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down Expand Up @@ -30,7 +30,7 @@
"@react-aria/i18n": "^3.12.12",
"@react-aria/interactions": "^3.25.5",
"@react-aria/live-announcer": "^3.4.4",
"@react-aria/overlays": "^3.29.0",
"@react-aria/overlays": "^3.29.1",
"@react-aria/utils": "^3.30.1",
"@react-stately/collections": "^3.12.7",
"@react-stately/dnd": "^3.7.0",
Expand Down
4 changes: 2 additions & 2 deletions packages/@react-aria/menu/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/menu",
"version": "3.19.1",
"version": "3.19.2",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down Expand Up @@ -29,7 +29,7 @@
"@react-aria/focus": "^3.21.1",
"@react-aria/i18n": "^3.12.12",
"@react-aria/interactions": "^3.25.5",
"@react-aria/overlays": "^3.29.0",
"@react-aria/overlays": "^3.29.1",
"@react-aria/selection": "^3.25.1",
"@react-aria/utils": "^3.30.1",
"@react-stately/collections": "^3.12.7",
Expand Down
2 changes: 1 addition & 1 deletion packages/@react-aria/overlays/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/overlays",
"version": "3.29.0",
"version": "3.29.1",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down
32 changes: 22 additions & 10 deletions packages/@react-aria/overlays/src/calculatePosition.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -127,7 +127,7 @@ function getContainerDimensions(containerNode: Element): Dimensions {
left = visualViewport.offsetLeft;
}
} else {
({width, height, top, left} = getOffset(containerNode));
({width, height, top, left} = getOffset(containerNode, false));
scroll.top = containerNode.scrollTop;
scroll.left = containerNode.scrollLeft;
totalWidth = width;
Expand Down Expand Up @@ -488,15 +488,15 @@ export function calculatePosition(opts: PositionOpts): PositionResult {
let isViewportContainer = container === document.documentElement;
const containerPositionStyle = window.getComputedStyle(container).position;
let isContainerPositioned = !!containerPositionStyle && containerPositionStyle !== 'static';
let childOffset: Offset = isViewportContainer ? getOffset(targetNode) : getPosition(targetNode, container);
let childOffset: Offset = isViewportContainer ? getOffset(targetNode, false) : getPosition(targetNode, container, false);

if (!isViewportContainer) {
let {marginTop, marginLeft} = window.getComputedStyle(targetNode);
childOffset.top += parseInt(marginTop, 10) || 0;
childOffset.left += parseInt(marginLeft, 10) || 0;
}

let overlaySize: Offset = getOffset(overlayNode);
let overlaySize: Offset = getOffset(overlayNode, true);
let margins = getMargins(overlayNode);
overlaySize.width += (margins.left ?? 0) + (margins.right ?? 0);
overlaySize.height += (margins.top ?? 0) + (margins.bottom ?? 0);
Expand All @@ -507,7 +507,7 @@ export function calculatePosition(opts: PositionOpts): PositionResult {
// If the container is the HTML element wrapping the body element, the retrieved scrollTop/scrollLeft will be equal to the
// body element's scroll. Set the container's scroll values to 0 since the overlay's edge position value in getDelta don't then need to be further offset
// by the container scroll since they are essentially the same containing element and thus in the same coordinate system
let containerOffsetWithBoundary: Offset = boundaryElement.tagName === 'BODY' ? getOffset(container) : getPosition(container, boundaryElement);
let containerOffsetWithBoundary: Offset = boundaryElement.tagName === 'BODY' ? getOffset(container, false) : getPosition(container, boundaryElement, false);
if (container.tagName === 'HTML' && boundaryElement.tagName === 'BODY') {
containerDimensions.scroll.top = 0;
containerDimensions.scroll.left = 0;
Expand All @@ -533,8 +533,21 @@ export function calculatePosition(opts: PositionOpts): PositionResult {
);
}

function getOffset(node: Element): Offset {
export function getRect(node: Element, ignoreScale: boolean) {
let {top, left, width, height} = node.getBoundingClientRect();

// Use offsetWidth and offsetHeight if this is an HTML element, so that
// the size is not affected by scale transforms.
if (ignoreScale && node instanceof node.ownerDocument.defaultView!.HTMLElement) {
width = node.offsetWidth;
height = node.offsetHeight;
}

return {top, left, width, height};
}

function getOffset(node: Element, ignoreScale: boolean): Offset {
let {top, left, width, height} = getRect(node, ignoreScale);
let {scrollTop, scrollLeft, clientTop, clientLeft} = document.documentElement;
return {
top: top + scrollTop - clientTop,
Expand All @@ -544,15 +557,14 @@ function getOffset(node: Element): Offset {
};
}

function getPosition(node: Element, parent: Element): Offset {
function getPosition(node: Element, parent: Element, ignoreScale: boolean): Offset {
let style = window.getComputedStyle(node);
let offset: Offset;
if (style.position === 'fixed') {
let {top, left, width, height} = node.getBoundingClientRect();
offset = {top, left, width, height};
offset = getRect(node, ignoreScale);
} else {
offset = getOffset(node);
let parentOffset = getOffset(parent);
offset = getOffset(node, ignoreScale);
let parentOffset = getOffset(parent, ignoreScale);
let parentStyle = window.getComputedStyle(parent);
parentOffset.top += (parseInt(parentStyle.borderTopWidth, 10) || 0) - parent.scrollTop;
parentOffset.left += (parseInt(parentStyle.borderLeftWidth, 10) || 0) - parent.scrollLeft;
Expand Down
15 changes: 2 additions & 13 deletions packages/@react-aria/overlays/src/useOverlayPosition.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
* governing permissions and limitations under the License.
*/

import {calculatePosition, PositionResult} from './calculatePosition';
import {calculatePosition, getRect, PositionResult} from './calculatePosition';
import {DOMAttributes, RefObject} from '@react-types/shared';
import {Placement, PlacementAxis, PositionProps} from '@react-types/overlays';
import {useCallback, useEffect, useRef, useState} from 'react';
Expand Down Expand Up @@ -149,17 +149,6 @@ export function useOverlayPosition(props: AriaPositionProps): PositionAria {
return;
}

// Delay updating the position until children are finished rendering (e.g. collections).
if (overlayRef.current.querySelector('[data-react-aria-incomplete]')) {
return;
}

// Don't update while the overlay is animating.
// Things like scale animations can mess up positioning by affecting the overlay's computed size.
if (overlayRef.current.getAnimations?.().length > 0) {
return;
}

// Determine a scroll anchor based on the focused element.
// This stores the offset of the anchor element from the scroll container
// so it can be restored after repositioning. This way if the overlay height
Expand Down Expand Up @@ -200,7 +189,7 @@ export function useOverlayPosition(props: AriaPositionProps): PositionAria {
offset,
crossOffset,
maxHeight,
arrowSize: arrowSize ?? arrowRef?.current?.getBoundingClientRect().width ?? 0,
arrowSize: arrowSize ?? (arrowRef?.current ? getRect(arrowRef.current, true).width : 0),
arrowBoundaryOffset
});

Expand Down
3 changes: 3 additions & 0 deletions packages/@react-aria/overlays/test/calculatePosition.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,9 @@ function createElementWithDimensions(elemName, dimensions, margins = {}) {
bottom: dimensions.bottom || 0
});

jest.spyOn(elem, 'offsetWidth', 'get').mockImplementation(() => dimensions.width || 0);
jest.spyOn(elem, 'offsetHeight', 'get').mockImplementation(() => dimensions.height || 0);

jest.spyOn(elem, 'scrollWidth', 'get').mockImplementation(() => dimensions.width || 0);
jest.spyOn(elem, 'scrollHeight', 'get').mockImplementation(() => dimensions.height || 0);

Expand Down
7 changes: 7 additions & 0 deletions packages/@react-aria/overlays/test/useOverlayPosition.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,13 @@ describe('useOverlayPosition', function () {
beforeEach(() => {
Object.defineProperty(HTMLElement.prototype, 'clientHeight', {configurable: true, value: 768});
Object.defineProperty(HTMLElement.prototype, 'clientWidth', {configurable: true, value: 500});

jest.spyOn(HTMLElement.prototype, 'offsetWidth', 'get').mockImplementation(function (this: HTMLElement) {
return parseInt(this.style.width, 10) || 0;
});
jest.spyOn(HTMLElement.prototype, 'offsetHeight', 'get').mockImplementation(function (this: HTMLElement) {
return parseInt(this.style.height, 10) || 0;
});
});

it('should position the overlay relative to the trigger', function () {
Expand Down
4 changes: 2 additions & 2 deletions packages/@react-aria/select/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@react-aria/select",
"version": "3.16.1",
"version": "3.16.2",
"description": "Spectrum UI components in React",
"license": "Apache-2.0",
"main": "dist/main.js",
Expand Down Expand Up @@ -31,7 +31,7 @@
"@react-aria/interactions": "^3.25.5",
"@react-aria/label": "^3.7.21",
"@react-aria/listbox": "^3.14.8",
"@react-aria/menu": "^3.19.1",
"@react-aria/menu": "^3.19.2",
"@react-aria/selection": "^3.25.1",
"@react-aria/utils": "^3.30.1",
"@react-aria/visually-hidden": "^3.8.27",
Expand Down
Loading
Loading