SIGN IN SIGN UP

fix(GridLayout): support RTL direction for drop target positioning (#9848)

* fix(GridLayout): support RTL direction for drop target positioning

GridLayout.getDropTargetFromPoint() computes 'before'/'after' drop positions
using x-coordinates, but has no awareness of layout direction. In RTL locales,
the Virtualizer positions items using CSS 'right' with the layout rect's x
value as the right-offset, while pointer coordinates remain in visual
(left-origin) space. This mismatch causes drop targets to be inverted —
dragging an item to the right of another shows a 'before' indicator instead
of 'after'.

This commit adds an optional 'direction' property to GridLayoutOptions.
When set to 'rtl', getDropTargetFromPoint flips the x-coordinate to match
the layout coordinate system before computing drop positions.

Consumers can pass direction via useLayoutOptions() in a GridLayout subclass:

  class LocaleAwareGridLayout extends GridLayout {
    useLayoutOptions() {
      const { direction } = useLocale();
      return { direction };
    }
  }

* test(GridLayout): add unit tests for RTL drop target positioning

Tests getDropTargetFromPoint with both LTR and RTL directions to verify
that drop targets (before/after) are computed correctly in multi-column
grids. Also tests that single-column layouts are unaffected by direction
and that empty layouts return a root drop target.

* fix(GridLayout): auto-determine direction via useLocale() in RAC wrapper

Instead of requiring consumers to subclass GridLayout and pass direction
manually, create a RAC wrapper (like TableLayout) that calls useLocale()
internally via useLayoutOptions(). The base layout in react-stately still
accepts direction as an explicit option for non-RAC consumers.

* fix: use public GridLayout import

* add test story

* fix tests, missing size mock

* chore: apply oxfmt formatting

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* fix formatting

---------

Co-authored-by: Daniel Lu <dl1644@gmail.com>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
M
Miguel Calderón committed
092229c62c070e6405d4b6d74bb27f328508e781
Parent: 6d4afb9
Committed by GitHub <noreply@github.com> on 5/15/2026, 11:07:27 PM