From e1c05d6d8191dc96b3fafa9a478835cfcf12e4ba Mon Sep 17 00:00:00 2001
From: Reid Barber <reid@reidbarber.com>
Date: Mon, 22 Dec 2025 10:11:24 -0500
Subject: [PATCH 01/12] fix(ListBox): prevent closing Combobox when a section
 header is clicked (#9223)

* fix: prevent closing combobox when section headers are clicked

* add unit test

---------

Co-authored-by: Yihui Liao <44729383+yihuiliao@users.noreply.github.com>
---
 .../listbox/src/useListBoxSection.ts          |  8 ++-
 .../test/ComboBox.test.js                     | 66 +++++++++++++++++++
 2 files changed, 72 insertions(+), 2 deletions(-)

diff --git a/packages/@react-aria/listbox/src/useListBoxSection.ts b/packages/@react-aria/listbox/src/useListBoxSection.ts
index 82952c43bcc..1b0a045cf4c 100644
--- a/packages/@react-aria/listbox/src/useListBoxSection.ts
+++ b/packages/@react-aria/listbox/src/useListBoxSection.ts
@@ -46,11 +46,15 @@ export function useListBoxSection(props: AriaListBoxSectionProps): ListBoxSectio
       role: 'presentation'
     },
     headingProps: heading ? {
-      // Techincally, listbox cannot contain headings according to ARIA.
+      // Technically, listbox cannot contain headings according to ARIA.
       // We hide the heading from assistive technology, using role="presentation",
       // and only use it as a visual label for the nested group.
       id: headingId,
-      role: 'presentation'
+      role: 'presentation',
+      onMouseDown: (e) => {
+        // Prevent DOM focus from moving on mouse down when using virtual focus
+        e.preventDefault();
+      }
     } : {},
     groupProps: {
       role: 'group',
diff --git a/packages/react-aria-components/test/ComboBox.test.js b/packages/react-aria-components/test/ComboBox.test.js
index b786271a0da..cdd950f47a1 100644
--- a/packages/react-aria-components/test/ComboBox.test.js
+++ b/packages/react-aria-components/test/ComboBox.test.js
@@ -482,4 +482,70 @@ describe('ComboBox', () => {
     expect(onAction).toHaveBeenCalledTimes(2);
     expect(comboboxTester.combobox).toHaveValue('Cat');
   });
+
+  it('should not close the combobox when clicking on a section header', async () => {
+    let tree = render(
+      <ComboBox>
+        <Label>Preferred fruit or vegetable</Label>
+        <Input />
+        <Button />
+        <Popover>
+          <ListBox>
+            <ListBoxSection>
+              <Header>Fruit</Header>
+              <ListBoxItem id="Apple">Apple</ListBoxItem>
+              <ListBoxItem id="Banana">Banana</ListBoxItem>
+            </ListBoxSection>
+            <ListBoxSection>
+              <Header>Vegetable</Header>
+              <ListBoxItem id="Cabbage">Cabbage</ListBoxItem>
+              <ListBoxItem id="Broccoli">Broccoli</ListBoxItem>
+            </ListBoxSection>
+          </ListBox>
+        </Popover>
+      </ComboBox>
+    );
+
+    let comboboxTester = testUtilUser.createTester('ComboBox', {root: tree.container});
+    let button = tree.getByRole('button');
+    
+    // Open the combobox
+    await user.click(button);
+    act(() => {
+      jest.runAllTimers();
+    });
+
+    // Verify the listbox is open
+    let listbox = tree.getByRole('listbox');
+    expect(listbox).toBeInTheDocument();
+    expect(listbox).toBeVisible();
+
+    // Find and click on a section header
+    let fruitHeader = tree.getByText('Fruit');
+    expect(fruitHeader).toBeInTheDocument();
+    
+    await user.click(fruitHeader);
+    act(() => {
+      jest.runAllTimers();
+    });
+
+    // Verify the listbox is still open
+    listbox = tree.getByRole('listbox');
+    expect(listbox).toBeInTheDocument();
+    expect(listbox).toBeVisible();
+
+    // Verify we can still interact with options
+    let options = comboboxTester.options();
+    expect(options.length).toBeGreaterThan(0);
+    
+    // Click an option
+    await user.click(options[0]);
+    act(() => {
+      jest.runAllTimers();
+    });
+    
+    // Verify the combobox is closed and the value is updated
+    expect(tree.queryByRole('listbox')).toBeNull();
+    expect(comboboxTester.combobox).toHaveValue('Apple');
+  });
 });

From c605dc05c9388f509a8b453def94c040b0cded52 Mon Sep 17 00:00:00 2001
From: Colby Leiske <colby.leiske@gmail.com>
Date: Mon, 22 Dec 2025 08:15:46 -0800
Subject: [PATCH 02/12] fix: Update import to match plugin referenced in the
 bundler config object (#9388)

---
 packages/dev/s2-docs/pages/react-aria/frameworks.mdx | 2 +-
 packages/dev/s2-docs/pages/s2/getting-started.mdx    | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/dev/s2-docs/pages/react-aria/frameworks.mdx b/packages/dev/s2-docs/pages/react-aria/frameworks.mdx
index 4cd7207045e..2455f685906 100644
--- a/packages/dev/s2-docs/pages/react-aria/frameworks.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/frameworks.mdx
@@ -263,7 +263,7 @@ export const description = 'How to integrate with your framework.';
         ```ts
         // vite.config.ts
         import {defineConfig} from 'vite';
-        import localesPlugin from '@react-aria/optimize-locales-plugin';
+        import optimizeLocales from '@react-aria/optimize-locales-plugin';
 
         export default defineConfig({
           plugins: [
diff --git a/packages/dev/s2-docs/pages/s2/getting-started.mdx b/packages/dev/s2-docs/pages/s2/getting-started.mdx
index 337a816f25d..a4f862cc337 100644
--- a/packages/dev/s2-docs/pages/s2/getting-started.mdx
+++ b/packages/dev/s2-docs/pages/s2/getting-started.mdx
@@ -233,7 +233,7 @@ Install React Spectrum with your preferred package manager.
         ```ts
         // vite.config.ts
         import {defineConfig} from 'vite';
-        import localesPlugin from '@react-aria/optimize-locales-plugin';
+        import optimizeLocales from '@react-aria/optimize-locales-plugin';
 
         export default defineConfig({
           plugins: [
@@ -451,7 +451,7 @@ Install React Spectrum with your preferred package manager.
         ```ts
         // vite.config.ts
         import {defineConfig} from 'vite';
-        import localesPlugin from '@react-aria/optimize-locales-plugin';
+        import optimizeLocales from '@react-aria/optimize-locales-plugin';
 
         export default defineConfig({
           plugins: [

From 49c1d7b19fa546a3b546c97873c75b8b1057900c Mon Sep 17 00:00:00 2001
From: Reid Barber <reid@reidbarber.com>
Date: Mon, 22 Dec 2025 12:57:03 -0500
Subject: [PATCH 03/12] docs: fix S2 docs typos (#9398)

* fix docs typos

* undo locale plugin changes
---
 packages/dev/s2-docs/pages/react-aria/Toast.mdx           | 2 +-
 packages/dev/s2-docs/pages/react-aria/Tree/testing.mdx    | 2 +-
 packages/dev/s2-docs/pages/react-aria/forms.mdx           | 4 ++--
 packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx | 2 +-
 packages/dev/s2-docs/pages/s2/TreeView/testing.mdx        | 2 +-
 packages/dev/s2-docs/pages/s2/collections.mdx             | 2 +-
 packages/dev/s2-docs/pages/s2/forms.mdx                   | 8 ++++----
 packages/dev/s2-docs/pages/s2/getting-started.mdx         | 6 +++---
 8 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/packages/dev/s2-docs/pages/react-aria/Toast.mdx b/packages/dev/s2-docs/pages/react-aria/Toast.mdx
index 3c56fe8cebf..7ed9fa9c048 100644
--- a/packages/dev/s2-docs/pages/react-aria/Toast.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/Toast.mdx
@@ -122,7 +122,7 @@ Include a `<Button slot="close">` to allow users to dismiss the toast manually.
 
 <InlineAlert variant="notice">
   <Heading>Accessibility</Heading>
-  <Content>We recommend that that the close button should be rendered as a sibling of `<ToastContent>` rather than inside it, so that screen readers announce the toast content without the close button first.</Content>
+  <Content>We recommend that the close button should be rendered as a sibling of `<ToastContent>` rather than inside it, so that screen readers announce the toast content without the close button first.</Content>
 </InlineAlert>
 
 ## Dismissal
diff --git a/packages/dev/s2-docs/pages/react-aria/Tree/testing.mdx b/packages/dev/s2-docs/pages/react-aria/Tree/testing.mdx
index ebb78e2076d..73deef1ee1c 100644
--- a/packages/dev/s2-docs/pages/react-aria/Tree/testing.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/Tree/testing.mdx
@@ -43,7 +43,7 @@ let testUtilUser = new User({
 });
 // ...
 
-it('Tree can select and expand a item via keyboard', async function () {
+it('Tree can select and expand an item via keyboard', async function () {
   // Render your test component/app and initialize the Tree tester
   let {getByTestId} = render(
     <Tree data-testid="test-tree" selectionMode="multiple">
diff --git a/packages/dev/s2-docs/pages/react-aria/forms.mdx b/packages/dev/s2-docs/pages/react-aria/forms.mdx
index f0be0f68f66..b8251b2654c 100644
--- a/packages/dev/s2-docs/pages/react-aria/forms.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/forms.mdx
@@ -161,7 +161,7 @@ Supported constraints include:
 
 * `isRequired` indicates that a field must have a value before the form can be submitted.
 * `minValue` and `maxValue` specify the minimum and maximum value in a date picker or number field.
-* `minLength` and `maxLength` specify the minimum and length of text input.
+* `minLength` and `maxLength` specify the minimum and maximum length of text input.
 * `pattern` provides a custom [regular expression](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions) that a text input must conform to.
 * `type="email"` and `type="url"` provide builtin validation for email addresses and URLs.
 
@@ -261,7 +261,7 @@ By default, invalid fields block forms from being submitted. To avoid this, use
 
 Client side validation is useful to give the user immediate feedback, but data should always be validated on the backend for security and reliability. Your business logic may also include rules which cannot be validated on the frontend.
 
-To display server validation errors, set the the `validationErrors` prop on the [Form](Form) component. This accepts an object that maps each field's `name` prop to one or more error messages. These are displayed as soon as the `validationErrors` prop is set, and cleared after the user modifies each field's value.
+To display server validation errors, set the `validationErrors` prop on the [Form](Form) component. This accepts an object that maps each field's `name` prop to one or more error messages. These are displayed as soon as the `validationErrors` prop is set, and cleared after the user modifies each field's value.
 
 ```tsx render
 'use client';
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx
index 997fe444ac9..8b9c36faf69 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx
@@ -100,7 +100,7 @@ In this release, we made a few last API updates to React Aria Components as they
 * Docs for `useLandmark` - [@reidbarber](https://github.com/reidbarber) - [PR](https://github.com/adobe/react-spectrum/pull/5418)
 * Fix prop table in docs - [@yihuiliao](https://github.com/yihuiliao) - [PR](https://github.com/adobe/react-spectrum/pull/5532)
 * Update `FileTrigger` directory prop name and docs - [@yihuiliao](https://github.com/yihuiliao) - [PR](https://github.com/adobe/react-spectrum/pull/5512)
-* Fix broken links in the the docs - [@ktabors](https://github.com/ktabors) - [PR](https://github.com/adobe/react-spectrum/pull/5572)
+* Fix broken links in the docs - [@ktabors](https://github.com/ktabors) - [PR](https://github.com/adobe/react-spectrum/pull/5572)
 * Update collections and selection guides for React Aria Components - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/5455)
 
 ## Released packages
diff --git a/packages/dev/s2-docs/pages/s2/TreeView/testing.mdx b/packages/dev/s2-docs/pages/s2/TreeView/testing.mdx
index 0b89c5619c3..2a65163d56b 100644
--- a/packages/dev/s2-docs/pages/s2/TreeView/testing.mdx
+++ b/packages/dev/s2-docs/pages/s2/TreeView/testing.mdx
@@ -43,7 +43,7 @@ let testUtilUser = new User({
 });
 // ...
 
-it('TreeView can select a item via keyboard', async function () {
+it('TreeView can select an item via keyboard', async function () {
   // Render your test component/app and initialize the Tree tester
   let {getByTestId} = render(
     <Tree data-testid="test-tree" selectionMode="multiple">
diff --git a/packages/dev/s2-docs/pages/s2/collections.mdx b/packages/dev/s2-docs/pages/s2/collections.mdx
index 76095f316ed..5df9e3cd798 100644
--- a/packages/dev/s2-docs/pages/s2/collections.mdx
+++ b/packages/dev/s2-docs/pages/s2/collections.mdx
@@ -8,7 +8,7 @@ export const description = 'How to load and render collections.';
 
 # Collections
 
-<PageDescription>Many components display a collection of items, and provide functionality such as keyboard navigation, and selection. Learn how to load and render collections using React Spectrums's compositional API.</PageDescription>
+<PageDescription>Many components display a collection of items, and provide functionality such as keyboard navigation, and selection. Learn how to load and render collections using React Spectrum's compositional API.</PageDescription>
 
 ## Static collections
 
diff --git a/packages/dev/s2-docs/pages/s2/forms.mdx b/packages/dev/s2-docs/pages/s2/forms.mdx
index edb5425158b..47fbfef6c9e 100644
--- a/packages/dev/s2-docs/pages/s2/forms.mdx
+++ b/packages/dev/s2-docs/pages/s2/forms.mdx
@@ -154,7 +154,7 @@ Supported constraints include:
 
 * `isRequired` indicates that a field must have a value before the form can be submitted.
 * `minValue` and `maxValue` specify the minimum and maximum value in a date picker or number field.
-* `minLength` and `maxLength` specify the minimum and length of text input.
+* `minLength` and `maxLength` specify the minimum and maximum length of text input.
 * `pattern` provides a custom [regular expression](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions) that a text input must conform to.
 * `type="email"` and `type="url"` provide builtin validation for email addresses and URLs.
 
@@ -190,7 +190,7 @@ import {style} from '@react-spectrum/s2/style' with {type: 'macro'};
 
 <InlineAlert variant="informative">
   <Heading>Localization</Heading>
-  <Content>The default error messages are localized by the browser using the browser/operating system language setting. React Spectrums's [Provider](Provider) has no effect on validation errors.</Content>
+  <Content>The default error messages are localized by the browser using the browser/operating system language setting. React Spectrum's [Provider](Provider) has no effect on validation errors.</Content>
 </InlineAlert>
 
 ### Custom validation
@@ -260,7 +260,7 @@ By default, invalid fields block forms from being submitted. To avoid this, use
 
 Client side validation is useful to give the user immediate feedback, but data should always be validated on the backend for security and reliability. Your business logic may also include rules which cannot be validated on the frontend.
 
-To display server validation errors, set the the `validationErrors` prop on the [Form](Form) component. This accepts an object that maps each field's `name` prop to one or more error messages. These are displayed as soon as the `validationErrors` prop is set, and cleared after the user modifies each field's value.
+To display server validation errors, set the `validationErrors` prop on the [Form](Form) component. This accepts an object that maps each field's `name` prop to one or more error messages. These are displayed as soon as the `validationErrors` prop is set, and cleared after the user modifies each field's value.
 
 ```tsx render
 'use client';
@@ -478,7 +478,7 @@ function App() {
             onBlur={onBlur}
             ref={ref}
             isRequired
-            validationState={invalid ? 'invalid' : undefined}
+            isInvalid={invalid}
             errorMessage={error?.message}
           />
         )}
diff --git a/packages/dev/s2-docs/pages/s2/getting-started.mdx b/packages/dev/s2-docs/pages/s2/getting-started.mdx
index a4f862cc337..6b2ae8e2d41 100644
--- a/packages/dev/s2-docs/pages/s2/getting-started.mdx
+++ b/packages/dev/s2-docs/pages/s2/getting-started.mdx
@@ -116,7 +116,7 @@ Install React Spectrum with your preferred package manager.
               // Use content hash in filename for long term cacheability.
               filename: '[name].[contenthash].css',
               // Ignore warnings about CSS order. Style macros generate atomic CSS,
-              // which is resiliant to ordering differences.
+              // which is resilient to ordering differences.
               ignoreOrder: true
             })
           ],
@@ -205,7 +205,7 @@ Install React Spectrum with your preferred package manager.
           ],
           build: {
             target: ['es2022'],
-            // Lightning CSS produces much a smaller CSS bundle than the default minifier.
+            // Lightning CSS produces a much smaller CSS bundle than the default minifier.
             cssMinify: 'lightningcss',
             rollupOptions: {
               output: {
@@ -373,7 +373,7 @@ Install React Spectrum with your preferred package manager.
           ],
           build: {
             target: ['es2022'],
-            // Lightning CSS produces much a smaller CSS bundle than the default minifier.
+            // Lightning CSS produces a much smaller CSS bundle than the default minifier.
             cssMinify: 'lightningcss',
             rollupOptions: {
               output: {

From af89d4954f9767ea734551df1a3b1f1a3139004d Mon Sep 17 00:00:00 2001
From: Robert Snow <rsnow@adobe.com>
Date: Tue, 23 Dec 2025 05:10:51 +1100
Subject: [PATCH 04/12] fix: Combobox docs placeholder string (#9390)

---
 packages/dev/s2-docs/pages/react-aria/ComboBox.mdx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/dev/s2-docs/pages/react-aria/ComboBox.mdx b/packages/dev/s2-docs/pages/react-aria/ComboBox.mdx
index 47d0a9a1a83..93afe017da9 100644
--- a/packages/dev/s2-docs/pages/react-aria/ComboBox.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/ComboBox.mdx
@@ -20,7 +20,7 @@ export const description = 'Combines a text input with a listbox, allowing users
 <PageDescription>{docs.exports.ComboBox.description}</PageDescription>
 
 <ExampleSwitcher>
-  ```tsx render docs={vanillaDocs.exports.ComboBox} links={vanillaDocs.links} props={['label', 'isDisabled']} initialProps={{label: 'Favorite Animal', placeholder: 'Select a flavor'}} type="vanilla" files={["starters/docs/src/ComboBox.tsx", "starters/docs/src/ComboBox.css"]}
+  ```tsx render docs={vanillaDocs.exports.ComboBox} links={vanillaDocs.links} props={['label', 'isDisabled']} initialProps={{label: 'Favorite Animal', placeholder: 'Select an animal'}} type="vanilla" files={["starters/docs/src/ComboBox.tsx", "starters/docs/src/ComboBox.css"]}
   "use client";
   import {ComboBox, ComboBoxItem} from 'vanilla-starter/ComboBox';
 
@@ -34,7 +34,7 @@ export const description = 'Combines a text input with a listbox, allowing users
   </ComboBox>
   ```
 
-  ```tsx render docs={vanillaDocs.exports.ComboBox} links={vanillaDocs.links} props={['label', 'isDisabled']} initialProps={{label: 'Favorite Animal', placeholder: 'Select a flavor'}} type="tailwind" files={["starters/tailwind/src/ComboBox.tsx"]}
+  ```tsx render docs={vanillaDocs.exports.ComboBox} links={vanillaDocs.links} props={['label', 'isDisabled']} initialProps={{label: 'Favorite Animal', placeholder: 'Select an animal'}} type="tailwind" files={["starters/tailwind/src/ComboBox.tsx"]}
   "use client";
   import {ComboBox, ComboBoxItem} from 'tailwind-starter/ComboBox';
 

From 0096a5c389880315efc94fe0a525756c4b181b7e Mon Sep 17 00:00:00 2001
From: Andrew Lisowski <andrew.lisowski@snowflake.com>
Date: Mon, 22 Dec 2025 10:11:30 -0800
Subject: [PATCH 05/12] feat: expose closeOnSelect on React Aria Menu (#8315)

* Expose closeOnSelect prop

* rename to shouldCloseOnSelect, add to menu section and menu

* Update packages/@react-aria/menu/src/useMenuItem.ts

* follow up

* fix jsdocs defaults

* fix some formatting

---------

Co-authored-by: Yihui Liao <44729383+yihuiliao@users.noreply.github.com>
Co-authored-by: Robert Snow <snowystinger@gmail.com>
Co-authored-by: Robert Snow <rsnow@adobe.com>
---
 packages/@react-aria/menu/src/useMenuItem.ts  |  16 ++-
 packages/react-aria-components/src/Menu.tsx   |  19 ++-
 .../react-aria-components/test/Menu.test.tsx  | 113 ++++++++++++++++++
 3 files changed, 138 insertions(+), 10 deletions(-)

diff --git a/packages/@react-aria/menu/src/useMenuItem.ts b/packages/@react-aria/menu/src/useMenuItem.ts
index 30440abd5d7..58881c84064 100644
--- a/packages/@react-aria/menu/src/useMenuItem.ts
+++ b/packages/@react-aria/menu/src/useMenuItem.ts
@@ -72,10 +72,13 @@ export interface AriaMenuItemProps extends DOMProps, PressEvents, HoverEvents, K
 
   /**
    * Whether the menu should close when the menu item is selected.
-   * @default true
+   * @deprecated - use shouldCloseOnSelect instead.
    */
   closeOnSelect?: boolean,
 
+  /** Whether the menu should close when the menu item is selected. */
+  shouldCloseOnSelect?: boolean,
+
   /** Whether the menu item is contained in a virtual scrolling menu. */
   isVirtualized?: boolean,
 
@@ -109,6 +112,7 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
     id,
     key,
     closeOnSelect,
+    shouldCloseOnSelect,
     isVirtualized,
     'aria-haspopup': hasPopup,
     onPressStart,
@@ -221,8 +225,10 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
       ? interaction.current?.key === 'Enter' || selectionManager.selectionMode === 'none' || selectionManager.isLink(key)
       // Close except if multi-select is enabled.
       : selectionManager.selectionMode !== 'multiple' || selectionManager.isLink(key);
-    
-    shouldClose = closeOnSelect ?? shouldClose;
+
+
+    shouldClose = shouldCloseOnSelect ?? closeOnSelect ?? shouldClose;
+
     if (onClose && !isTrigger && shouldClose) {
       onClose();
     }
@@ -312,8 +318,8 @@ export function useMenuItem<T>(props: AriaMenuItemProps, state: TreeState<T>, re
       ...mergeProps(
         domProps,
         linkProps,
-        isTrigger 
-          ? {onFocus: itemProps.onFocus, 'data-collection': itemProps['data-collection'], 'data-key': itemProps['data-key']} 
+        isTrigger
+          ? {onFocus: itemProps.onFocus, 'data-collection': itemProps['data-collection'], 'data-key': itemProps['data-key']}
           : itemProps,
         pressProps,
         hoverProps,
diff --git a/packages/react-aria-components/src/Menu.tsx b/packages/react-aria-components/src/Menu.tsx
index 292b1815132..187c3884374 100644
--- a/packages/react-aria-components/src/Menu.tsx
+++ b/packages/react-aria-components/src/Menu.tsx
@@ -194,7 +194,9 @@ export interface MenuProps<T> extends Omit<AriaMenuProps<T>, 'children'>, Collec
    */
   className?: ClassNameOrFunction<MenuRenderProps>,
   /** Provides content to display when there are no items in the list. */
-  renderEmptyState?: () => ReactNode
+  renderEmptyState?: () => ReactNode,
+  /** Whether the menu should close when the menu item is selected. */
+  shouldCloseOnSelect?: boolean
 }
 
 /**
@@ -267,7 +269,7 @@ function MenuInner<T extends object>({props, collection, menuRef: ref}: MenuInne
             [SeparatorContext, {elementType: 'div'}],
             [SectionContext, {name: 'MenuSection', render: MenuSectionInner}],
             [SubmenuTriggerContext, {parentMenuRef: ref, shouldUseVirtualFocus: autocompleteMenuProps?.shouldUseVirtualFocus}],
-            [MenuItemContext, null],
+            [MenuItemContext, {shouldCloseOnSelect: props.shouldCloseOnSelect}],
             [SelectableCollectionContext, null],
             [FieldInputContext, null],
             [SelectionManagerContext, state.selectionManager],
@@ -294,7 +296,9 @@ export interface MenuSectionProps<T> extends SectionProps<T>, MultipleSelection
    * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.
    * @default 'react-aria-MenuSection'
    */
-  className?: string
+  className?: string,
+  /** Whether the menu should close when the menu item is selected. */
+  shouldCloseOnSelect?: boolean
 }
 
 // A subclass of SelectionManager that forwards focus-related properties to the parent,
@@ -347,6 +351,8 @@ function MenuSectionInner<T extends object>(props: MenuSectionProps<T>, ref: For
   let selectionState = useMultipleSelectionState(props);
   let manager = props.selectionMode != null ? new GroupSelectionManager(parent, selectionState) : parent;
 
+  let closeOnSelect = useSlottedContext(MenuItemContext)?.shouldCloseOnSelect;
+
   let DOMProps = filterDOMProps(props as any, {global: true});
   delete DOMProps.id;
 
@@ -357,7 +363,8 @@ function MenuSectionInner<T extends object>(props: MenuSectionProps<T>, ref: For
       <Provider
         values={[
           [HeaderContext, {...headingProps, ref: headingRef}],
-          [SelectionManagerContext, manager]
+          [SelectionManagerContext, manager],
+          [MenuItemContext, {shouldCloseOnSelect: props.shouldCloseOnSelect ?? closeOnSelect}]
         ]}>
         <CollectionBranch collection={state.collection} parent={section} />
       </Provider>
@@ -402,7 +409,9 @@ export interface MenuItemProps<T = object> extends RenderProps<MenuItemRenderPro
   /** Whether the item is disabled. */
   isDisabled?: boolean,
   /** Handler that is called when the item is selected. */
-  onAction?: () => void
+  onAction?: () => void,
+  /** Whether the menu should close when the menu item is selected. */
+  shouldCloseOnSelect?: boolean
 }
 
 const MenuItemContext = createContext<ContextValue<MenuItemProps, HTMLDivElement>>(null);
diff --git a/packages/react-aria-components/test/Menu.test.tsx b/packages/react-aria-components/test/Menu.test.tsx
index 4ff56edafbf..6a3fadaca31 100644
--- a/packages/react-aria-components/test/Menu.test.tsx
+++ b/packages/react-aria-components/test/Menu.test.tsx
@@ -510,6 +510,119 @@ describe('Menu', () => {
     expect(menuitem).toHaveTextContent('No results');
   });
 
+  it('should not close the menu when shouldCloseOnSelect is false', async () => {
+    let {queryByRole, getByRole, getAllByRole} = render(
+      <MenuTrigger>
+        <Button aria-label="Menu">☰</Button>
+        <Popover>
+          <Menu shouldCloseOnSelect={false}>
+            <MenuItem id="open">Open</MenuItem>
+            <MenuItem id="rename">Rename…</MenuItem>
+            <MenuItem id="duplicate">Duplicate</MenuItem>
+            <MenuItem id="share">Share…</MenuItem>
+            <MenuItem id="delete">Delete…</MenuItem>
+          </Menu>
+        </Popover>
+      </MenuTrigger>
+    );
+
+    expect(queryByRole('menu')).not.toBeInTheDocument();
+
+    let button = getByRole('button');
+    await user.click(button);
+
+    let menu = getByRole('menu');
+    expect(menu).toBeInTheDocument();
+
+    let items = getAllByRole('menuitem');
+    expect(items).toHaveLength(5);
+
+    let item = items[0];
+    expect(item).toHaveTextContent('Open');
+    await user.click(item);
+    expect(menu).toBeInTheDocument();
+  });
+
+  it('should not close individual menu item when shouldCloseOnSelect=false', async () => {
+    let {queryByRole, getByRole, getAllByRole} = render(
+      <MenuTrigger>
+        <Button aria-label="Menu">☰</Button>
+        <Popover>
+          <Menu>
+            <MenuItem id="open" shouldCloseOnSelect={false}>Open</MenuItem>
+            <MenuItem id="rename">Rename…</MenuItem>
+            <MenuItem id="duplicate">Duplicate</MenuItem>
+            <MenuItem id="share">Share…</MenuItem>
+            <MenuItem id="delete">Delete…</MenuItem>
+          </Menu>
+        </Popover>
+      </MenuTrigger>
+    );
+
+    expect(queryByRole('menu')).not.toBeInTheDocument();
+
+    let button = getByRole('button');
+    await user.click(button);
+
+    let menu = getByRole('menu');
+    expect(menu).toBeInTheDocument();
+
+    let items = getAllByRole('menuitem');
+    expect(items).toHaveLength(5);
+
+    let item = items[0];
+    expect(item).toHaveTextContent('Open');
+    await user.click(item);
+    expect(menu).toBeInTheDocument();
+
+    item = items[1];
+    expect(item).toHaveTextContent('Rename');
+    await user.click(item);
+    expect(menu).not.toBeInTheDocument();
+  });
+
+  it('should not close menu items within a section when shouldCloseOnSelect=false', async () => {
+    let {queryByRole, getByRole, getAllByRole} = render(
+      <MenuTrigger>
+        <Button aria-label="Menu">☰</Button>
+        <Popover>
+          <Menu>
+            <MenuSection shouldCloseOnSelect={false}>
+              <MenuItem id="open">Open</MenuItem>
+              <MenuItem id="rename">Rename…</MenuItem>
+              <MenuItem id="duplicate">Duplicate</MenuItem>
+            </MenuSection>
+            <MenuSection>
+              <MenuItem id="share">Share…</MenuItem>
+              <MenuItem id="delete">Delete…</MenuItem>
+            </MenuSection>
+          </Menu>
+        </Popover>
+      </MenuTrigger>
+    );
+
+    expect(queryByRole('menu')).not.toBeInTheDocument();
+
+    let button = getByRole('button');
+    await user.click(button);
+
+    let menu = getByRole('menu');
+    expect(menu).toBeInTheDocument();
+
+    let items = getAllByRole('menuitem');
+    expect(items).toHaveLength(5);
+
+    let item = items[0];
+    expect(item).toHaveTextContent('Open');
+    await user.click(item);
+    expect(menu).toBeInTheDocument();
+
+    item = items[3];
+    expect(item).toHaveTextContent('Share');
+    await user.click(item);
+    expect(menu).not.toBeInTheDocument();
+  });
+
   describe('supports links', function () {
     describe.each(['mouse', 'keyboard'])('%s', (type) => {
       it.each(['none', 'single', 'multiple'] as unknown as SelectionMode[])('with selectionMode = %s', async function (selectionMode) {

From 6571d211e16ce1debef85ffa4e0e65937bd2e8b2 Mon Sep 17 00:00:00 2001
From: Aryan Bagade <73382554+AryanBagade@users.noreply.github.com>
Date: Mon, 22 Dec 2025 10:16:24 -0800
Subject: [PATCH 06/12] fix(react-aria-components): add id prop to Link
 component (#9349)

The Link component was missing the `id` prop in its TypeScript interface, even though it worked at runtime via filterDOMProps. This adds DOMProps to LinkProps interface to expose the id prop, matching the pattern used by other components like OverlayArrow and FieldError

Fixes #9348
---
 packages/react-aria-components/src/Link.tsx      | 4 ++--
 packages/react-aria-components/test/Link.test.js | 6 ++++++
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/react-aria-components/src/Link.tsx b/packages/react-aria-components/src/Link.tsx
index 22df63e3ac3..35f0667c727 100644
--- a/packages/react-aria-components/src/Link.tsx
+++ b/packages/react-aria-components/src/Link.tsx
@@ -19,11 +19,11 @@ import {
  useContextProps,
  useRenderProps
 } from './utils';
+import {DOMProps, forwardRefType, GlobalDOMAttributes} from '@react-types/shared';
 import {filterDOMProps} from '@react-aria/utils';
-import {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';
 import React, {createContext, ElementType, ForwardedRef, forwardRef} from 'react';
 
-export interface LinkProps extends Omit<AriaLinkOptions, 'elementType'>, HoverEvents, RenderProps<LinkRenderProps>, SlotProps, Omit<GlobalDOMAttributes<HTMLAnchorElement>, 'onClick'> {
+export interface LinkProps extends Omit<AriaLinkOptions, 'elementType'>, HoverEvents, RenderProps<LinkRenderProps>, SlotProps, DOMProps, Omit<GlobalDOMAttributes<HTMLAnchorElement>, 'onClick'> {
  /**
   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.
   * @default 'react-aria-Link'
diff --git a/packages/react-aria-components/test/Link.test.js b/packages/react-aria-components/test/Link.test.js
index d2defeabf52..3b34d8dd1ff 100644
--- a/packages/react-aria-components/test/Link.test.js
+++ b/packages/react-aria-components/test/Link.test.js
@@ -40,6 +40,12 @@ describe('Link', () => {
     expect(link).toHaveAttribute('data-foo', 'bar');
   });
 
+  it('should support id prop', () => {
+    let {getByRole} = render(<Link id="my-link-id">Test</Link>);
+    let link = getByRole('link');
+    expect(link).toHaveAttribute('id', 'my-link-id');
+  });
+
   it('should support render props', async () => {
     let {getByRole} = render(<Link>{({isHovered}) => isHovered ? 'Hovered' : 'Test'}</Link>);
     let link = getByRole('link');

From 0e8db485e116fd0005d5253b0748a7ec6895d968 Mon Sep 17 00:00:00 2001
From: XiaoYan Li <lxy.lixiaoyan@gmail.com>
Date: Tue, 23 Dec 2025 02:17:33 +0800
Subject: [PATCH 07/12] fix: exclude disabledKeys prop from TabPansls component
 (#9238)

---
 packages/react-aria-components/src/Tabs.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-aria-components/src/Tabs.tsx b/packages/react-aria-components/src/Tabs.tsx
index a655398a352..3ff831f1ebd 100644
--- a/packages/react-aria-components/src/Tabs.tsx
+++ b/packages/react-aria-components/src/Tabs.tsx
@@ -327,7 +327,7 @@ export const Tab = /*#__PURE__*/ createLeafComponent(TabItemNode, (props: TabPro
   );
 });
 
-export interface TabPanelsProps<T> extends CollectionProps<T>, StyleProps, GlobalDOMAttributes<HTMLDivElement> {
+export interface TabPanelsProps<T> extends Omit<CollectionProps<T>, 'disabledKeys'>, StyleProps, GlobalDOMAttributes<HTMLDivElement> {
   /**
    * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.
    * @default 'react-aria-TabPanels'

From 8f18b4bc4a9ec09d6084dee97be8867eec41eca5 Mon Sep 17 00:00:00 2001
From: XiaoYan Li <lxy.lixiaoyan@gmail.com>
Date: Tue, 23 Dec 2025 02:22:57 +0800
Subject: [PATCH 08/12] fix: exclude null type from RadioGroup validate value
 (#9240)

---
 packages/@react-types/radio/src/index.d.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/@react-types/radio/src/index.d.ts b/packages/@react-types/radio/src/index.d.ts
index 5646a4ed95e..383832e8e73 100644
--- a/packages/@react-types/radio/src/index.d.ts
+++ b/packages/@react-types/radio/src/index.d.ts
@@ -30,7 +30,7 @@ import {
 } from '@react-types/shared';
 import {ReactElement, ReactNode} from 'react';
 
-export interface RadioGroupProps extends ValueBase<string|null, string>, InputBase, Pick<InputDOMProps, 'name'>, Validation<string | null>, LabelableProps, HelpTextProps, FocusEvents {
+export interface RadioGroupProps extends ValueBase<string|null, string>, InputBase, Pick<InputDOMProps, 'name'>, Validation<string>, LabelableProps, HelpTextProps, FocusEvents {
   /**
    * The axis the Radio Button(s) should align with.
    * @default 'vertical'

From 1cbf47d6fb82407039f813a1b3c65515f4ad1da5 Mon Sep 17 00:00:00 2001
From: Alex Dametto <33689349+alexdametto@users.noreply.github.com>
Date: Mon, 22 Dec 2025 19:23:21 +0100
Subject: [PATCH 09/12] fix: ensure contains is used as default filter in
 ComboBox (#9234)

* fix: ensure contains is used as default filter in ComboBox

* add test

---------

Co-authored-by: Robert Snow <rsnow@adobe.com>
Co-authored-by: Robert Snow <snowystinger@gmail.com>
---
 .../react-aria-components/src/ComboBox.tsx    |  2 +-
 .../test/ComboBox.test.js                     | 42 ++++++++++++++++++-
 2 files changed, 41 insertions(+), 3 deletions(-)

diff --git a/packages/react-aria-components/src/ComboBox.tsx b/packages/react-aria-components/src/ComboBox.tsx
index 538b381b32a..466c696b5fe 100644
--- a/packages/react-aria-components/src/ComboBox.tsx
+++ b/packages/react-aria-components/src/ComboBox.tsx
@@ -133,8 +133,8 @@ function ComboBoxInner<T extends object>({props, collection, comboBoxRef: ref}:
   let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';
   let {contains} = useFilter({sensitivity: 'base'});
   let state = useComboBoxState({
-    defaultFilter: props.defaultFilter || contains,
     ...props,
+    defaultFilter: props.defaultFilter || contains,
     // If props.items isn't provided, rely on collection filtering (aka listbox.items is provided or defaultItems provided to Combobox)
     items: props.items,
     children: undefined,
diff --git a/packages/react-aria-components/test/ComboBox.test.js b/packages/react-aria-components/test/ComboBox.test.js
index cdd950f47a1..8cf20e4f382 100644
--- a/packages/react-aria-components/test/ComboBox.test.js
+++ b/packages/react-aria-components/test/ComboBox.test.js
@@ -147,6 +147,44 @@ describe('ComboBox', () => {
     expect(options).toHaveLength(1);
   });
 
+  it('should support undefined defaultFilter', async () => {
+    let tree = render(
+      <ComboBox defaultFilter={undefined}>
+        <Label>Preferred fruit or vegetable</Label>
+        <Input />
+        <Button />
+        <Popover>
+          <ListBox>
+            <ListBoxSection>
+              <Header>Fruit</Header>
+              <ListBoxItem id="Apple">Apple</ListBoxItem>
+              <ListBoxItem id="Banana">Banana</ListBoxItem>
+            </ListBoxSection>
+            <ListBoxSection>
+              <Header>Vegetable</Header>
+              <ListBoxItem id="Cabbage">Cabbage</ListBoxItem>
+              <ListBoxItem id="Broccoli">Broccoli</ListBoxItem>
+            </ListBoxSection>
+          </ListBox>
+        </Popover>
+      </ComboBox>
+    );
+
+    let comboboxTester = testUtilUser.createTester('ComboBox', {root: tree.container});
+    act(() => {
+      comboboxTester.combobox.focus();
+    });
+    await user.keyboard('p');
+
+    let groups = comboboxTester.sections;
+    expect(groups).toHaveLength(1);
+    expect(groups[0]).toHaveAttribute('aria-labelledby');
+    expect(document.getElementById(groups[0].getAttribute('aria-labelledby'))).toHaveTextContent('Fruit');
+
+    let options = within(groups[0]).getAllByRole('option');
+    expect(options).toHaveLength(1);
+  });
+
   it('should support dynamic collections', async () => {
     let defaultItems = [
       {id: 1, name: 'Cat'},
@@ -413,7 +451,7 @@ describe('ComboBox', () => {
     let onAction = jest.fn();
     function WithCreateOption() {
       let [inputValue, setInputValue] = useState('');
-    
+
       return (
         <ComboBox
           allowsEmptyCollection
@@ -464,7 +502,7 @@ describe('ComboBox', () => {
     }
     expect(onAction).toHaveBeenCalledTimes(1);
     expect(comboboxTester.combobox).toHaveValue('');
-    
+
     // Repeat with an option selected.
     await comboboxTester.selectOption({option: 'Cat'});
 

From 05f6a30a04fa75112fb3030c57f155f3ee1c8e03 Mon Sep 17 00:00:00 2001
From: chirokas <157580465+chirokas@users.noreply.github.com>
Date: Tue, 23 Dec 2025 02:28:20 +0800
Subject: [PATCH 10/12] fix: ComboBox correctly resets to `defaultSelectedKey`
 (#9129)

---
 .../@react-aria/combobox/src/useComboBox.ts   |  4 ++-
 .../combobox/test/ComboBox.test.js            | 20 +++++++----
 .../test/ComboBox.test.js                     | 35 +++++++++++++++++++
 3 files changed, 52 insertions(+), 7 deletions(-)

diff --git a/packages/@react-aria/combobox/src/useComboBox.ts b/packages/@react-aria/combobox/src/useComboBox.ts
index 0929bd00c9d..f6c6c9ba03c 100644
--- a/packages/@react-aria/combobox/src/useComboBox.ts
+++ b/packages/@react-aria/combobox/src/useComboBox.ts
@@ -16,7 +16,7 @@ import {AriaComboBoxProps} from '@react-types/combobox';
 import {ariaHideOutside} from '@react-aria/overlays';
 import {AriaListBoxOptions, getItemId, listData} from '@react-aria/listbox';
 import {BaseEvent, DOMAttributes, KeyboardDelegate, LayoutDelegate, PressEvent, RefObject, RouterOptions, ValidationResult} from '@react-types/shared';
-import {chain, getActiveElement, getOwnerDocument, isAppleDevice, mergeProps, useEvent, useLabels, useRouter, useUpdateEffect} from '@react-aria/utils';
+import {chain, getActiveElement, getOwnerDocument, isAppleDevice, mergeProps, useEvent, useFormReset, useLabels, useRouter, useUpdateEffect} from '@react-aria/utils';
 import {ComboBoxState} from '@react-stately/combobox';
 import {dispatchVirtualFocus} from '@react-aria/focus';
 import {FocusEvent, InputHTMLAttributes, KeyboardEvent, TouchEvent, useEffect, useMemo, useRef} from 'react';
@@ -220,6 +220,8 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
     [privateValidationStateProp]: state
   }, inputRef);
 
+  useFormReset(inputRef, state.defaultSelectedKey, state.setSelectedKey);
+  
   // Press handlers for the ComboBox button
   let onPress = (e: PressEvent) => {
     if (e.pointerType === 'touch') {
diff --git a/packages/@react-spectrum/combobox/test/ComboBox.test.js b/packages/@react-spectrum/combobox/test/ComboBox.test.js
index 8a6b7ee6e54..167e59e665f 100644
--- a/packages/@react-spectrum/combobox/test/ComboBox.test.js
+++ b/packages/@react-spectrum/combobox/test/ComboBox.test.js
@@ -5268,26 +5268,30 @@ describe('ComboBox', function () {
 
       if (parseInt(React.version, 10) >= 19) {
         it('resets to defaultSelectedKey when submitting form action', async () => {
-          function Test() {        
+          function Test(props) {        
             const [value, formAction] = React.useActionState(() => '2', '1');
             
             return (
               <Provider theme={theme}>
                 <form action={formAction}>
-                  <ExampleComboBox defaultSelectedKey={value} />
+                  <ExampleComboBox defaultSelectedKey={value} name="combobox" {...props} />
                   <input type="submit" data-testid="submit" />
                 </form>
               </Provider>
             );
           }
     
-          let {getByTestId, getByRole} = render(<Test />);
+          let {getByTestId, getByRole, rerender} = render(<Test />);
           let input = getByRole('combobox');
           expect(input).toHaveValue('One');
     
           let button = getByTestId('submit');
           await act(async () => await user.click(button));
           expect(input).toHaveValue('Two');
+
+          rerender(<Test formValue="key" />);
+          await act(async () => await user.click(button));
+          expect(document.querySelector('input[name=combobox]')).toHaveValue('2');
         });
       }
 
@@ -5597,26 +5601,30 @@ describe('ComboBox', function () {
 
       if (parseInt(React.version, 10) >= 19) {
         it('resets to defaultSelectedKey when submitting form action', async () => {
-          function Test() {
+          function Test(props) {
             const [value, formAction] = React.useActionState(() => '2', '1');
             
             return (
               <Provider theme={theme}>
                 <form action={formAction}>
-                  <ExampleComboBox name="combobox" defaultSelectedKey={value} />
+                  <ExampleComboBox name="combobox" defaultSelectedKey={value} {...props} />
                   <input type="submit" data-testid="submit" />
                 </form>
               </Provider>
             );
           }
     
-          let {getByTestId} = render(<Test />);
+          let {getByTestId, rerender} = render(<Test />);
           let input = document.querySelector('input[name=combobox]');
           expect(input).toHaveValue('One');
     
           let button = getByTestId('submit');
           await act(async () => await user.click(button));
           expect(input).toHaveValue('Two');
+
+          rerender(<Test formValue="key" />);
+          await act(async () => await user.click(button));
+          expect(input).toHaveValue('2');
         });
       }
 
diff --git a/packages/react-aria-components/test/ComboBox.test.js b/packages/react-aria-components/test/ComboBox.test.js
index 8cf20e4f382..585a893f3df 100644
--- a/packages/react-aria-components/test/ComboBox.test.js
+++ b/packages/react-aria-components/test/ComboBox.test.js
@@ -256,6 +256,41 @@ describe('ComboBox', () => {
     expect(document.querySelector('input[type=hidden]')).toBeNull();
   });
 
+  it('should support form reset', async () => {
+    const tree = render(
+      <form>
+        <ComboBox defaultSelectedKey="2" name="combobox">
+          <Label>Favorite Animal</Label>
+          <Input />
+          <Button />
+          <FieldError />
+          <Popover>
+            <ListBox>
+              <ListBoxItem id="1">Cat</ListBoxItem>
+              <ListBoxItem id="2">Dog</ListBoxItem>
+              <ListBoxItem id="3">Kangaroo</ListBoxItem>
+            </ListBox>
+          </Popover>
+        </ComboBox>
+        <input type="reset" />
+      </form>
+    );
+  
+    const comboboxTester = testUtilUser.createTester('ComboBox', {root: tree.container});
+    const combobox = comboboxTester.combobox;
+  
+    expect(combobox).toHaveValue('Dog');
+    await comboboxTester.open();
+  
+    const options = comboboxTester.options();
+    await user.click(options[0]);
+    expect(combobox).toHaveValue('Cat');
+  
+    await user.click(document.querySelector('input[type="reset"]'));
+    expect(combobox).toHaveValue('Dog');
+    expect(document.querySelector('input[name=combobox]')).toHaveValue('2');
+  });
+
   it('should render data- attributes on outer element', () => {
     let {getAllByTestId} = render(
       <TestComboBox data-testid="combo-box" />

From fdadb61ac87c5dd1353ea7e988291a916103aa27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nikolas=20Schr=C3=B6ter?=
 <25958801+nwidynski@users.noreply.github.com>
Date: Mon, 22 Dec 2025 19:28:30 +0100
Subject: [PATCH 11/12] feat: support modern useEffectEvent (#9095)

* feat: support modern useEffectEvent

* chore: require callback

* fix: backwards compatibility
---
 packages/@react-aria/utils/src/useEffectEvent.ts | 9 ++++++++-
 packages/@react-aria/utils/src/useEvent.ts       | 5 +++--
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/@react-aria/utils/src/useEffectEvent.ts b/packages/@react-aria/utils/src/useEffectEvent.ts
index 20b89d03038..f5046d525d3 100644
--- a/packages/@react-aria/utils/src/useEffectEvent.ts
+++ b/packages/@react-aria/utils/src/useEffectEvent.ts
@@ -17,7 +17,10 @@ import {useLayoutEffect} from './useLayoutEffect';
 // before all layout effects, but is available only in React 18 and later.
 const useEarlyEffect = React['useInsertionEffect'] ?? useLayoutEffect;
 
-export function useEffectEvent<T extends Function>(fn?: T): T {
+// Starting with React 19.2, this hook has been internalized.
+const useModernEffectEvent = React['useEffectEvent'] ?? useLegacyEffectEvent;
+
+function useLegacyEffectEvent<T extends Function>(fn?: T): T {
   const ref = useRef<T | null | undefined>(null);
   useEarlyEffect(() => {
     ref.current = fn;
@@ -28,3 +31,7 @@ export function useEffectEvent<T extends Function>(fn?: T): T {
     return f?.(...args);
   }, []);
 }
+
+export function useEffectEvent<T extends Function>(fn: T): T {
+  return useModernEffectEvent(fn);
+}
diff --git a/packages/@react-aria/utils/src/useEvent.ts b/packages/@react-aria/utils/src/useEvent.ts
index 1dd35499847..c83b479e614 100644
--- a/packages/@react-aria/utils/src/useEvent.ts
+++ b/packages/@react-aria/utils/src/useEvent.ts
@@ -11,7 +11,7 @@
  */
 
 import {RefObject} from '@react-types/shared';
-import {useEffect} from 'react';
+import {useCallback, useEffect} from 'react';
 import {useEffectEvent} from './useEffectEvent';
 
 export function useEvent<K extends keyof GlobalEventHandlersEventMap>(
@@ -20,7 +20,8 @@ export function useEvent<K extends keyof GlobalEventHandlersEventMap>(
   handler?: (this: Document, ev: GlobalEventHandlersEventMap[K]) => any,
   options?: boolean | AddEventListenerOptions
 ): void {
-  let handleEvent = useEffectEvent(handler);
+  let noop = useCallback(() => {}, []);
+  let handleEvent = useEffectEvent(handler ?? noop);
   let isDisabled = handler == null;
 
   useEffect(() => {

From f7811f310e06a328982c670bb9ae2fcf5c6058aa Mon Sep 17 00:00:00 2001
From: Reid Barber <reid@reidbarber.com>
Date: Mon, 22 Dec 2025 13:33:33 -0500
Subject: [PATCH 12/12] docs: handle rendering code blocks without language
 (#9400)

* handle rendering code blocks without language

* remove unused text language

* remove classname lang extraction
---
 packages/dev/s2-docs/pages/react-aria/mcp.mdx |  2 +-
 .../pages/react-aria/releases/v1-0-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-1-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-10-0.mdx     |  2 +-
 .../pages/react-aria/releases/v1-11-0.mdx     |  2 +-
 .../pages/react-aria/releases/v1-12-0.mdx     |  2 +-
 .../pages/react-aria/releases/v1-13-0.mdx     |  2 +-
 .../pages/react-aria/releases/v1-14-0.mdx     |  2 +-
 .../pages/react-aria/releases/v1-2-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-3-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-4-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-5-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-6-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-7-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-8-0.mdx      |  2 +-
 .../pages/react-aria/releases/v1-9-0.mdx      |  2 +-
 packages/dev/s2-docs/pages/s2/mcp.mdx         |  2 +-
 packages/dev/s2-docs/src/Code.tsx             | 23 +++++++++++++++++--
 packages/dev/s2-docs/src/CodeBlock.tsx        |  2 +-
 packages/dev/s2-docs/src/Layout.tsx           | 11 ++++++++-
 20 files changed, 49 insertions(+), 21 deletions(-)

diff --git a/packages/dev/s2-docs/pages/react-aria/mcp.mdx b/packages/dev/s2-docs/pages/react-aria/mcp.mdx
index 37a25622f66..bc777cd7d70 100644
--- a/packages/dev/s2-docs/pages/react-aria/mcp.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/mcp.mdx
@@ -61,7 +61,7 @@ For more information, see the [Claude Code MCP documentation](https://docs.claud
 
 Create or edit the configuration file `~/.codex/config.toml` and add:
 
-```js
+```
 [mcp_servers.react-aria]
 command = "npx"
 args = ["@react-aria/mcp@latest"]
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx
index 8b9c36faf69..48caee5bc99 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-0-0.mdx
@@ -105,7 +105,7 @@ In this release, we made a few last API updates to React Aria Components as they
 
 ## Released packages
 
-```json
+```
  - react-aria@3.31.0
  - react-aria-components@1.0.0
  - react-stately@3.29.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-1-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-1-0.mdx
index b3f1b7e6ae3..2746c1d509d 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-1-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-1-0.mdx
@@ -83,7 +83,7 @@ As always, huge thanks and appreciation for everyone in our community for their
 
 ## Released packages
 
-```json
+```
  - react-aria@3.32.0
  - react-aria-components@1.1.0
  - react-stately@3.30.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-10-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-10-0.mdx
index 473c43666f9..40edba8bf13 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-10-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-10-0.mdx
@@ -81,7 +81,7 @@ As always, thank you to our community for their support and contributions!
 
 ## Released packages
 
-```json
+```
  - react-aria@3.41.0
  - react-aria-components@1.10.0
  - react-stately@3.39.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-11-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-11-0.mdx
index 3eb4f3f7d25..be7f54221ba 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-11-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-11-0.mdx
@@ -100,7 +100,7 @@ As always, thanks so much to everyone who contributed to this release!
 
 ## Released packages
 
-```json
+```
  - react-aria@3.42.0
  - react-aria-components@1.11.0
  - react-stately@3.40.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-12-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-12-0.mdx
index 6317ed60910..adec7261034 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-12-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-12-0.mdx
@@ -88,7 +88,7 @@ As always, a big thank you to everyone in the community for your feedback and co
 
 ## Released packages
 
-```json
+```
  - react-aria@3.43.0
  - react-aria-components@1.12.0
  - react-stately@3.41.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-13-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-13-0.mdx
index 19ecdbdfe4c..a57dd66e271 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-13-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-13-0.mdx
@@ -84,7 +84,7 @@ To support multi-selection in React Aria Select, we are updating the API from `s
 
 ## Released packages
 
-```json
+```
  - react-aria@3.44.0
  - react-aria-components@1.13.0
  - react-stately@3.42.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-14-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-14-0.mdx
index 116733d77e0..3fa7e5fb24c 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-14-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-14-0.mdx
@@ -87,7 +87,7 @@ As usual, we have included various new features and bug fixes, including support
 
 ## Released packages
 
-```json
+```
  - @internationalized/date@3.10.1
  - @react-aria/actiongroup@3.7.22
  - @react-aria/autocomplete@3.0.0-rc.4
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-2-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-2-0.mdx
index fb7be24a508..7f684a15985 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-2-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-2-0.mdx
@@ -142,7 +142,7 @@ Last but not least, we want to acknowledge all the wonderful contributors who ha
 
 ## Released packages
 
-```json
+```
  - react-aria@3.33.0
  - react-aria-components@1.2.0
  - react-stately@3.31.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-3-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-3-0.mdx
index 550a9fe7820..59f04eb88c7 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-3-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-3-0.mdx
@@ -147,7 +147,7 @@ Because of various breaking changes, several packages are being bumped a major v
 
 ## Released packages
 
-```json
+```
  - react-aria@3.34.0
  - react-aria-components@1.3.0
  - react-stately@3.32.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-4-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-4-0.mdx
index 358986a59d6..e92eb971406 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-4-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-4-0.mdx
@@ -86,7 +86,7 @@ Huge thanks as always to everyone who contributed to this release! 😍
 
 ## Released packages
 
-```json
+```
  - react-aria-components@1.4.0
  - react-aria@3.35.0
  - react-stately@3.33.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-5-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-5-0.mdx
index bca16292e84..7c3db5d08f8 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-5-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-5-0.mdx
@@ -96,7 +96,7 @@ React Aria is now [Typescript Strict](https://www.typescriptlang.org/tsconfig/#s
 
 ## Released packages
 
-```json
+```
  - react-aria@3.36.0
  - react-aria-components@1.5.0
  - react-stately@3.34.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-6-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-6-0.mdx
index 7cc0ef1df61..e339a9fce00 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-6-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-6-0.mdx
@@ -81,7 +81,7 @@ We are also excited to announce the alpha release of the [@react-aria/test-utils
 
 ## Released packages
 
-```json
+```
  - react-aria@3.37.0
  - react-aria-components@1.6.0
  - react-stately@3.35.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-7-0.mdx
index 09b1cb00f23..55da3ea8e45 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-7-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-7-0.mdx
@@ -118,7 +118,7 @@ Autocomplete
 
 ## Released packages
 
-```json
+```
  - react-aria@3.38.0
  - react-aria-components@1.7.0
  - react-stately@3.36.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-8-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-8-0.mdx
index 603a63a8a13..9e9f1c0821c 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-8-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-8-0.mdx
@@ -76,7 +76,7 @@ A huge thank you once again to everyone in the community for all of your feedbac
 
 ## Released packages
 
-```json
+```
  - react-aria@3.39.0
  - react-aria-components@1.8.0
  - react-stately@3.37.0
diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-9-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-9-0.mdx
index abe78b0fbf4..837f22b81d8 100644
--- a/packages/dev/s2-docs/pages/react-aria/releases/v1-9-0.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-9-0.mdx
@@ -64,7 +64,7 @@ As always, thank you to our community for their support and contributions!
 
 ## Released packages
 
-```json
+```
  - react-aria@3.40.0
  - react-aria-components@1.9.0
  - react-stately@3.38.0
diff --git a/packages/dev/s2-docs/pages/s2/mcp.mdx b/packages/dev/s2-docs/pages/s2/mcp.mdx
index 95a26824f9e..289aa2d8349 100644
--- a/packages/dev/s2-docs/pages/s2/mcp.mdx
+++ b/packages/dev/s2-docs/pages/s2/mcp.mdx
@@ -61,7 +61,7 @@ For more information, see the [Claude Code MCP documentation](https://docs.claud
 
 Create or edit the configuration file `~/.codex/config.toml` and add:
 
-```js
+```
 [mcp_servers.react-spectrum-s2]
 command = "npx"
 args = ["@react-spectrum/mcp@latest"]
diff --git a/packages/dev/s2-docs/src/Code.tsx b/packages/dev/s2-docs/src/Code.tsx
index 58dd16bc34f..01f326e6c11 100644
--- a/packages/dev/s2-docs/src/Code.tsx
+++ b/packages/dev/s2-docs/src/Code.tsx
@@ -56,13 +56,21 @@ type Links = {[name: string]: string};
 export interface ICodeProps {
   children: string,
   lang?: string,
+  isFencedBlock?: boolean,
   hideImports?: boolean,
   links?: Links,
   styles?: StyleString
 }
 
-export function Code({children, lang, hideImports = true, links, styles}: ICodeProps) {
-  if (lang) {
+// Check if a language is supported by tree-sitter for syntax highlighting
+function isSupportedLanguage(lang: string): boolean {
+  const supported = ['js', 'jsx', 'ts', 'tsx', 'css', 'json'];
+  return supported.includes(lang.toLowerCase());
+}
+
+export function Code({children, lang, isFencedBlock, hideImports = true, links, styles}: ICodeProps) {
+  // If language is provided and is a supported syntax highlighting language
+  if (lang && isSupportedLanguage(lang)) {
     return (
       <code className={styles} style={{fontFamily: 'inherit', WebkitTextSizeAdjust: 'none'}}>
         <CodeClient tokens={highlightCode(children, lang, hideImports, links)} />
@@ -70,6 +78,17 @@ export function Code({children, lang, hideImports = true, links, styles}: ICodeP
     );
   }
 
+  // If inside a fenced code block (pre element) or has an unsupported language,
+  // render as plain text block without syntax highlighting
+  if (isFencedBlock || lang) {
+    return (
+      <code className={styles} style={{fontFamily: 'inherit', WebkitTextSizeAdjust: 'none'}}>
+        {children}
+      </code>
+    );
+  }
+
+  // Inline code style
   return (
     <code
       className={style({
diff --git a/packages/dev/s2-docs/src/CodeBlock.tsx b/packages/dev/s2-docs/src/CodeBlock.tsx
index 7f50e756042..e4354578cdf 100644
--- a/packages/dev/s2-docs/src/CodeBlock.tsx
+++ b/packages/dev/s2-docs/src/CodeBlock.tsx
@@ -29,7 +29,7 @@ const example = style({
   marginX: 'auto'
 });
 
-const standaloneCode = style({
+export const standaloneCode = style({
   '--code-padding-start': {
     type: 'paddingStart',
     value: {
diff --git a/packages/dev/s2-docs/src/Layout.tsx b/packages/dev/s2-docs/src/Layout.tsx
index 8bff2ece234..7563993e38a 100644
--- a/packages/dev/s2-docs/src/Layout.tsx
+++ b/packages/dev/s2-docs/src/Layout.tsx
@@ -12,7 +12,7 @@ import './anatomy.css';
 import './footer.css';
 import {ClassAPI} from './ClassAPI';
 import {Code} from './Code';
-import {CodeBlock} from './CodeBlock';
+import {CodeBlock, standaloneCode} from './CodeBlock';
 import {CodePlatterProvider} from './CodePlatter';
 import {Divider, Provider, ToastContainer} from '@react-spectrum/s2';
 import {ExampleSwitcher} from './ExampleSwitcher';
@@ -42,6 +42,15 @@ const components = (isLongForm?: boolean) => ({
   Figure: (props) => <figure {...props} className={style({display: 'flex', flexDirection: 'column', alignItems: 'center', marginY: 32, marginX: 0})} />,
   Caption: (props) => <figcaption {...props} className={style({font: 'body-sm'})} />,
   CodeBlock: CodeBlock,
+  pre: ({children, ...props}) => (
+    <pre {...props} className={standaloneCode}>
+      {React.Children.map(children, child =>
+        React.isValidElement(child)
+          ? React.cloneElement(child as React.ReactElement<any>, {isFencedBlock: true})
+          : child
+      )}
+    </pre>
+  ),
   code: (props) => <Code {...props} />,
   strong: ({children, ...props}) => <strong {...props} className={style({fontWeight: 'bold'})}>{children}</strong>,
   a: (props) => <Link {...props} />,