From 81875ed128283a4ae7bf2f254bb3523c7c59c67c Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Fri, 5 Dec 2025 13:28:50 -0800
Subject: [PATCH 1/5] update content elements to point to mdn

---
 packages/dev/s2-docs/pages/s2/ActionButton.mdx       | 2 +-
 packages/dev/s2-docs/pages/s2/Button.mdx             | 2 +-
 packages/dev/s2-docs/pages/s2/Card.mdx               | 8 ++++----
 packages/dev/s2-docs/pages/s2/ComboBox.mdx           | 2 +-
 packages/dev/s2-docs/pages/s2/ContextualHelp.mdx     | 2 +-
 packages/dev/s2-docs/pages/s2/Dialog.mdx             | 4 ++--
 packages/dev/s2-docs/pages/s2/IllustratedMessage.mdx | 2 +-
 packages/dev/s2-docs/pages/s2/InlineAlert.mdx        | 2 +-
 packages/dev/s2-docs/pages/s2/LinkButton.mdx         | 2 +-
 packages/dev/s2-docs/pages/s2/Menu.mdx               | 2 +-
 packages/dev/s2-docs/pages/s2/SegmentedControl.mdx   | 4 ++--
 packages/dev/s2-docs/pages/s2/SelectBoxGroup.mdx     | 2 +-
 packages/dev/s2-docs/pages/s2/Tabs.mdx               | 2 +-
 packages/dev/s2-docs/pages/s2/TagGroup.mdx           | 2 +-
 packages/dev/s2-docs/pages/s2/ToggleButton.mdx       | 2 +-
 packages/dev/s2-docs/pages/s2/TreeView.mdx           | 2 +-
 16 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/packages/dev/s2-docs/pages/s2/ActionButton.mdx b/packages/dev/s2-docs/pages/s2/ActionButton.mdx
index fd8d70719c6..5d33be3e19b 100644
--- a/packages/dev/s2-docs/pages/s2/ActionButton.mdx
+++ b/packages/dev/s2-docs/pages/s2/ActionButton.mdx
@@ -74,7 +74,7 @@ function PendingButton() {
 
 ## API
 
-```tsx links={{ActionButton: '#actionbutton', Avatar: 'Avatar', Icon: 'icons'}}
+```tsx links={{ActionButton: '#actionbutton', Avatar: 'Avatar', Icon: 'icons', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <ActionButton>
   <Icon /> or <Avatar />
   <Text />
diff --git a/packages/dev/s2-docs/pages/s2/Button.mdx b/packages/dev/s2-docs/pages/s2/Button.mdx
index c67a5ba7f61..f1b9ae062f1 100644
--- a/packages/dev/s2-docs/pages/s2/Button.mdx
+++ b/packages/dev/s2-docs/pages/s2/Button.mdx
@@ -74,7 +74,7 @@ function PendingButton() {
 
 ## API
 
-```tsx links={{Button: '#button', Icon: 'icons'}}
+```tsx links={{Button: '#button', Icon: 'icons', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <Button>
   <Icon />
   <Text />
diff --git a/packages/dev/s2-docs/pages/s2/Card.mdx b/packages/dev/s2-docs/pages/s2/Card.mdx
index 0d49c3972f7..da8e7ff398a 100644
--- a/packages/dev/s2-docs/pages/s2/Card.mdx
+++ b/packages/dev/s2-docs/pages/s2/Card.mdx
@@ -255,7 +255,7 @@ import {Skeleton, Card, CardPreview, Image, Content, Text} from '@react-spectrum
 
 ### Card
 
-```tsx links={{Image: 'Image', Illustration: 'illustrations', ActionMenu: 'ActionMenu'}}
+```tsx links={{Image: 'Image', Illustration: 'illustrations', ActionMenu: 'ActionMenu', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span', Footer: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer'}}
 <Card>
   <CardPreview>
     <Image /> or <Illustration />
@@ -273,7 +273,7 @@ import {Skeleton, Card, CardPreview, Image, Content, Text} from '@react-spectrum
 
 ### AssetCard
 
-```tsx links={{Image: 'Image', Illustration: 'illustrations', ActionMenu: 'ActionMenu'}}
+```tsx links={{Image: 'Image', Illustration: 'illustrations', ActionMenu: 'ActionMenu', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <AssetCard>
   <CardPreview>
     <Image /> or <Illustration />
@@ -290,7 +290,7 @@ import {Skeleton, Card, CardPreview, Image, Content, Text} from '@react-spectrum
 
 ### UserCard
 
-```tsx links={{Image: 'Image', ActionMenu: 'ActionMenu'}}
+```tsx links={{Image: 'Image', ActionMenu: 'ActionMenu', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span', Footer: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer'}}
 <UserCard>
   <CardPreview>
     <Image />
@@ -309,7 +309,7 @@ import {Skeleton, Card, CardPreview, Image, Content, Text} from '@react-spectrum
 
 ### ProductCard
 
-```tsx links={{Image: 'Image', ActionMenu: 'ActionMenu', Button: 'Button', LinkButton: 'LinkButton'}}
+```tsx links={{Image: 'Image', ActionMenu: 'ActionMenu', Button: 'Button', LinkButton: 'LinkButton', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span', Footer: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer'}}
 <ProductCard>
   <CardPreview>
     <Image slot="preview" />
diff --git a/packages/dev/s2-docs/pages/s2/ComboBox.mdx b/packages/dev/s2-docs/pages/s2/ComboBox.mdx
index ae048b33a25..19a920af145 100644
--- a/packages/dev/s2-docs/pages/s2/ComboBox.mdx
+++ b/packages/dev/s2-docs/pages/s2/ComboBox.mdx
@@ -442,7 +442,7 @@ import {ComboBox, ComboBoxItem} from '@react-spectrum/s2';
 
 ## API
 
-```tsx links={{ComboBox: '#combobox', ComboBoxItem: '#comboboxitem', ComboBoxSection: '#comboboxsection', Icon: 'icons', Avatar: 'Avatar'}}
+```tsx links={{ComboBox: '#combobox', ComboBoxItem: '#comboboxitem', ComboBoxSection: '#comboboxsection', Icon: 'icons', Avatar: 'Avatar', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span', Header: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header', Heading: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements'}}
 <ComboBox>
   <ComboBoxItem>
     <Icon /> or <Avatar />
diff --git a/packages/dev/s2-docs/pages/s2/ContextualHelp.mdx b/packages/dev/s2-docs/pages/s2/ContextualHelp.mdx
index 27b57980390..b9c0100c4e0 100644
--- a/packages/dev/s2-docs/pages/s2/ContextualHelp.mdx
+++ b/packages/dev/s2-docs/pages/s2/ContextualHelp.mdx
@@ -25,7 +25,7 @@ import {ContextualHelp, Heading, Content, Footer, Link} from '@react-spectrum/s2
 
 ## API
 
-```tsx links={{ContextualHelp: '#contextualhelp'}}
+```tsx links={{ContextualHelp: '#contextualhelp', Heading: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div', Footer: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer'}}
 <ContextualHelp>
   <Heading />
   <Content />
diff --git a/packages/dev/s2-docs/pages/s2/Dialog.mdx b/packages/dev/s2-docs/pages/s2/Dialog.mdx
index 29b090220f4..fa45509b9c3 100644
--- a/packages/dev/s2-docs/pages/s2/Dialog.mdx
+++ b/packages/dev/s2-docs/pages/s2/Dialog.mdx
@@ -260,7 +260,7 @@ function DialogContainerExample() {
 
 ### Dialog
 
-```tsx links={{ButtonGroup: 'ButtonGroup', Image:' Image'}}
+```tsx links={{ButtonGroup: 'ButtonGroup', Image:' Image', Heading: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements', Header: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div', Footer: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer'}}
 <Dialog>
   <Image slot="hero">
   <Heading slot="title" />
@@ -279,7 +279,7 @@ function DialogContainerExample() {
 
 ### FullscreenDialog
 
-```tsx links={{ButtonGroup: 'ButtonGroup'}}
+```tsx links={{ButtonGroup: 'ButtonGroup', Heading: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements', Header: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div'}}
 <FullscreenDialog>
   <Heading slot="title" />
   <Header />
diff --git a/packages/dev/s2-docs/pages/s2/IllustratedMessage.mdx b/packages/dev/s2-docs/pages/s2/IllustratedMessage.mdx
index d09fd9131ed..aa4de2360d2 100644
--- a/packages/dev/s2-docs/pages/s2/IllustratedMessage.mdx
+++ b/packages/dev/s2-docs/pages/s2/IllustratedMessage.mdx
@@ -29,7 +29,7 @@ import Image from '@react-spectrum/s2/illustrations/gradient/generic1/Image';
 
 ## API
 
-```tsx links={{IllustratedMessage: '#illustratedmessage', ButtonGroup: 'ButtonGroup', Illustration: 'illustrations'}}
+```tsx links={{IllustratedMessage: '#illustratedmessage', ButtonGroup: 'ButtonGroup', Illustration: 'illustrations', Heading: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div'}}
 <IllustratedMessage>
   <Illustration />
   <Heading />
diff --git a/packages/dev/s2-docs/pages/s2/InlineAlert.mdx b/packages/dev/s2-docs/pages/s2/InlineAlert.mdx
index c5e3d2b5793..a4f585f094b 100644
--- a/packages/dev/s2-docs/pages/s2/InlineAlert.mdx
+++ b/packages/dev/s2-docs/pages/s2/InlineAlert.mdx
@@ -51,7 +51,7 @@ function Example() {
 
 ## API
 
-```tsx links={{InlineAlert: '#inlinealert'}}
+```tsx links={{InlineAlert: '#inlinealert', Heading: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements', Content: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div'}}
 <InlineAlert>
   <Heading />
   <Content />
diff --git a/packages/dev/s2-docs/pages/s2/LinkButton.mdx b/packages/dev/s2-docs/pages/s2/LinkButton.mdx
index 31c94e568eb..e41c2dd0b56 100644
--- a/packages/dev/s2-docs/pages/s2/LinkButton.mdx
+++ b/packages/dev/s2-docs/pages/s2/LinkButton.mdx
@@ -22,7 +22,7 @@ export const description = 'Combines the functionality of a link with the appear
 
 ## API
 
-```tsx links={{LinkButton: '#linkbutton', Icon: 'icons'}}
+```tsx links={{LinkButton: '#linkbutton', Icon: 'icons', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <LinkButton>
   <Icon />
   <Text />
diff --git a/packages/dev/s2-docs/pages/s2/Menu.mdx b/packages/dev/s2-docs/pages/s2/Menu.mdx
index 003530b8947..8b23d333c5f 100644
--- a/packages/dev/s2-docs/pages/s2/Menu.mdx
+++ b/packages/dev/s2-docs/pages/s2/Menu.mdx
@@ -476,7 +476,7 @@ import {MenuTrigger, Menu, MenuItem, ActionButton} from '@react-spectrum/s2';
 
 ## API
 
-```tsx links={{MenuTrigger: '#menutrigger', Button: 'Button', Menu: '#menu', MenuItem: '#menuitem', MenuSection: '#menusection', SubmenuTrigger: '#submenutrigger', Icon: 'icons', Image: 'Image'}}
+```tsx links={{MenuTrigger: '#menutrigger', Button: 'Button', Menu: '#menu', MenuItem: '#menuitem', MenuSection: '#menusection', SubmenuTrigger: '#submenutrigger', Icon: 'icons', Image: 'Image', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span', Keyboard: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/kbd', Header: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header', Heading: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements'}}
 <MenuTrigger>
   <Button />
   <Menu>
diff --git a/packages/dev/s2-docs/pages/s2/SegmentedControl.mdx b/packages/dev/s2-docs/pages/s2/SegmentedControl.mdx
index cc41db01912..17f85426a54 100644
--- a/packages/dev/s2-docs/pages/s2/SegmentedControl.mdx
+++ b/packages/dev/s2-docs/pages/s2/SegmentedControl.mdx
@@ -93,7 +93,7 @@ function Example() {
     <div>
       <SegmentedControl
         /*- begin highlight -*/
-        selectedKey={selected} 
+        selectedKey={selected}
         onSelectionChange={setSelected}
         /*- end highlight -*/
         aria-label="Time granularity">
@@ -110,7 +110,7 @@ function Example() {
 
 ## API
 
-```tsx links={{SegmentedControl: '#segmentedcontrol', SegmentedControlItem: '#segmentedcontrolitem', Icon: 'icons'}}
+```tsx links={{SegmentedControl: '#segmentedcontrol', SegmentedControlItem: '#segmentedcontrolitem', Icon: 'icons', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <SegmentedControl>
   <SegmentedControlItem>
     <Icon />
diff --git a/packages/dev/s2-docs/pages/s2/SelectBoxGroup.mdx b/packages/dev/s2-docs/pages/s2/SelectBoxGroup.mdx
index e8afb3d117b..e9f261e6d52 100644
--- a/packages/dev/s2-docs/pages/s2/SelectBoxGroup.mdx
+++ b/packages/dev/s2-docs/pages/s2/SelectBoxGroup.mdx
@@ -142,7 +142,7 @@ function Example(props) {
 
 ## API
 
-```tsx links={{SelectBoxGroup: '#selectboxgroup', SelectBox: '#selectbox', Illustration: 'illustrations'}}
+```tsx links={{SelectBoxGroup: '#selectboxgroup', SelectBox: '#selectbox', Illustration: 'illustrations', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <SelectBoxGroup>
   <SelectBox>
     <Illustration />
diff --git a/packages/dev/s2-docs/pages/s2/Tabs.mdx b/packages/dev/s2-docs/pages/s2/Tabs.mdx
index e1f62109104..dadca62bc57 100644
--- a/packages/dev/s2-docs/pages/s2/Tabs.mdx
+++ b/packages/dev/s2-docs/pages/s2/Tabs.mdx
@@ -265,7 +265,7 @@ function Example() {
 
 ## API
 
-```tsx links={{Tabs: '#tabs', TabList: '#tablist', Tab: '#tab', TabPanel: '#tabpanel', Icon: 'icons'}}
+```tsx links={{Tabs: '#tabs', TabList: '#tablist', Tab: '#tab', TabPanel: '#tabpanel', Icon: 'icons', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <Tabs>
   <TabList>
     <Tab>
diff --git a/packages/dev/s2-docs/pages/s2/TagGroup.mdx b/packages/dev/s2-docs/pages/s2/TagGroup.mdx
index 318e460c49d..cfa8e736cac 100644
--- a/packages/dev/s2-docs/pages/s2/TagGroup.mdx
+++ b/packages/dev/s2-docs/pages/s2/TagGroup.mdx
@@ -257,7 +257,7 @@ import {TagGroup, Tag} from '@react-spectrum/s2';
 
 ## API
 
-```tsx links={{TagGroup: '#taggroup', Tag: '#tag', Icon: 'icons', Avatar: 'Avatar', Image: 'Image'}}
+```tsx links={{TagGroup: '#taggroup', Tag: '#tag', Icon: 'icons', Avatar: 'Avatar', Image: 'Image', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <TagGroup>
   <Tag>
     <Icon /> or <Avatar /> or <Image />
diff --git a/packages/dev/s2-docs/pages/s2/ToggleButton.mdx b/packages/dev/s2-docs/pages/s2/ToggleButton.mdx
index 467144c0a17..a6022fbf039 100644
--- a/packages/dev/s2-docs/pages/s2/ToggleButton.mdx
+++ b/packages/dev/s2-docs/pages/s2/ToggleButton.mdx
@@ -52,7 +52,7 @@ function Example(props) {
 
 ## API
 
-```tsx links={{ToggleButton: '#toggleButton', Avatar: 'Avatar', Icon: 'icons'}}
+```tsx links={{ToggleButton: '#toggleButton', Avatar: 'Avatar', Icon: 'icons', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <ToggleButton>
   <Icon /> or <Avatar />
   <Text />
diff --git a/packages/dev/s2-docs/pages/s2/TreeView.mdx b/packages/dev/s2-docs/pages/s2/TreeView.mdx
index aeb9e4a2b37..c39fb4ef024 100644
--- a/packages/dev/s2-docs/pages/s2/TreeView.mdx
+++ b/packages/dev/s2-docs/pages/s2/TreeView.mdx
@@ -350,7 +350,7 @@ function Example(props) {
 
 ## API
 
-```tsx links={{TreeView: '#treeview', TreeViewItem: '#treeviewitem', TreeViewItemContent: '#treeviewitemcontent', TreeViewLoadMoreItem: '#treeloadmoreitem', ActionMenu: 'ActionMenu', ActionButtonGroup: 'ActionButtonGroup', Icon: 'icons'}}
+```tsx links={{TreeView: '#treeview', TreeViewItem: '#treeviewitem', TreeViewItemContent: '#treeviewitemcontent', TreeViewLoadMoreItem: '#treeloadmoreitem', ActionMenu: 'ActionMenu', ActionButtonGroup: 'ActionButtonGroup', Icon: 'icons', Text: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span'}}
 <TreeView>
   <TreeViewItem>
     <TreeViewItemContent>

From afb1eb5da32bbf0e02322c3c912d42e525a63970 Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Fri, 5 Dec 2025 13:45:52 -0800
Subject: [PATCH 2/5] update Accordion props to copy disclosure props directly

---
 packages/@react-spectrum/s2/src/Accordion.tsx | 117 +++++++++++++++---
 packages/@react-spectrum/s2/src/index.ts      |   2 +-
 2 files changed, 102 insertions(+), 17 deletions(-)

diff --git a/packages/@react-spectrum/s2/src/Accordion.tsx b/packages/@react-spectrum/s2/src/Accordion.tsx
index 4df49d6066c..00f3c15f0a3 100644
--- a/packages/@react-spectrum/s2/src/Accordion.tsx
+++ b/packages/@react-spectrum/s2/src/Accordion.tsx
@@ -10,26 +10,23 @@
  * governing permissions and limitations under the License.
  */
 
-import {ContextValue, DisclosureGroup, DisclosureGroupProps, SlotProps} from 'react-aria-components';
+import {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, Key} from '@react-types/shared';
+import {ContextValue, DisclosureGroup, RenderProps, SlotProps} from 'react-aria-components';
 import {
   Disclosure,
   DisclosureContext,
   DisclosureHeader,
   DisclosurePanel,
-  DisclosurePanelProps,
-  DisclosureProps,
-  DisclosureTitle,
-  DisclosureTitleProps
+  DisclosureTitle
 } from './Disclosure';
-import {DOMProps, DOMRef, DOMRefValue, GlobalDOMAttributes} from '@react-types/shared';
-import {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with { type: 'macro' };
+import {getAllowedOverrides, StyleProps, StylesPropWithHeight, UnsafeStyles} from './style-utils' with { type: 'macro' };
 import React, {createContext, forwardRef, ReactNode} from 'react';
 import {style} from '../style' with { type: 'macro' };
 import {useDOMRef} from '@react-spectrum/utils';
 import {useSpectrumContextProps} from './useSpectrumContextProps';
 
-export interface AccordionProps extends Omit<DisclosureGroupProps, 'className' | 'style' | 'children' | keyof GlobalDOMAttributes>, UnsafeStyles, DOMProps, SlotProps {
-  /** The disclosure elements in the accordion. */
+export interface AccordionProps extends UnsafeStyles, DOMProps, SlotProps {
+  /** The accordion item elements in the accordion. */
   children: React.ReactNode,
   /** Spectrum-defined styles, returned by the `style()` macro. */
   styles?: StylesPropWithHeight,
@@ -39,12 +36,22 @@ export interface AccordionProps extends Omit<DisclosureGroupProps, 'className' |
    */
   size?: 'S' | 'M' | 'L' | 'XL',
   /**
-   * The amount of space between the disclosure items.
+   * The amount of space between the accordion items.
    * @default 'regular'
    */
   density?: 'compact' | 'regular' | 'spacious',
   /** Whether the accordion should be displayed with a quiet style. */
-  isQuiet?: boolean
+  isQuiet?: boolean,
+  /** Whether multiple accordion items can be expanded at the same time. */
+  allowsMultipleExpanded?: boolean,
+  /** Whether all accordion items are disabled. */
+  isDisabled?: boolean,
+  /** The currently expanded keys in the accordion (controlled). */
+  expandedKeys?: Iterable<Key>,
+  /** The initial expanded keys in the accordion (uncontrolled). */
+  defaultExpandedKeys?: Iterable<Key>,
+  /** Handler that is called when accordion items are expanded or collapsed. */
+  onExpandedChange?: (keys: Set<Key>) => any
 }
 
 const accordion = style({
@@ -80,9 +87,67 @@ export const Accordion = forwardRef(function Accordion(props: AccordionProps, re
   );
 });
 
-export interface AccordionItemProps extends DisclosureProps {
-  /** The contents of the accordion, consisting of a AccordionItemTitle and AccordionItemPanel. */
-  children: ReactNode
+// TODO: export these
+export interface AccordionItemState {
+  /** Whether the accordion item is currently expanded. */
+  readonly isExpanded: boolean,
+  /** Sets whether the accordion item is expanded. */
+  setExpanded(isExpanded: boolean): void,
+  /** Expand the accordion item. */
+  expand(): void,
+  /** Collapse the accordion item. */
+  collapse(): void,
+  /** Toggles the accordion item's visibility. */
+  toggle(): void
+}
+
+export interface AccordionItemRenderProps {
+  /**
+   * Whether the accordion item is expanded.
+   * @selector [data-expanded]
+   */
+  isExpanded: boolean,
+  /**
+   * Whether the accordion item has keyboard focus.
+   * @selector [data-focus-visible-within]
+   */
+  isFocusVisibleWithin: boolean,
+  /**
+   * Whether the accordion item is disabled.
+   * @selector [data-disabled]
+   */
+  isDisabled: boolean,
+  /**
+   * State of the accordion item.
+   */
+  state: AccordionItemState
+}
+
+export interface AccordionItemProps extends Omit<RenderProps<AccordionItemRenderProps>, 'className' | 'style'>, SlotProps, StyleProps {
+  /**
+   * The size of the accordion item.
+   * @default 'M'
+   */
+  size?: 'S' | 'M' | 'L' | 'XL',
+  /**
+   * The amount of space between the accordion item.
+   * @default 'regular'
+   */
+  density?: 'compact' | 'regular' | 'spacious',
+  /** Whether the accordion item should be displayed with a quiet style. */
+  isQuiet?: boolean,
+  /** The contents of the accordion item, consisting of a accordion item title and accordion item panel. */
+  children: ReactNode,
+  /** An id for the accordion item, matching the id used in `expandedKeys`. */
+  id?: Key,
+  /** Whether the accordion item is disabled. */
+  isDisabled?: boolean,
+  /** Handler that is called when the accordion item's expanded state changes. */
+  onExpandedChange?: (isExpanded: boolean) => void,
+  /** Whether the accordion item is expanded (controlled). */
+  isExpanded?: boolean,
+  /** Whether the accordion item is expanded by default (uncontrolled). */
+  defaultExpanded?: boolean
 }
 /**
  * A accordion item is a collapsible section of content. It is composed of a header with a heading and trigger button, and a panel that contains the content.
@@ -91,7 +156,16 @@ export const AccordionItem = forwardRef(function AccordionItem(props: AccordionI
   return <Disclosure {...props} ref={ref} />;
 });
 
-export interface AccordionItemTitleProps extends DisclosureTitleProps {}
+export interface AccordionItemTitleProps extends UnsafeStyles, DOMProps {
+  /** The heading level of the accordion item title.
+   *
+   * @default 3
+   */
+  level?: number,
+  /** The contents of the accordion item title. */
+  children: React.ReactNode
+}
+
 /**
  * An accordion item title consisting of a heading and a trigger button to expand/collapse the panel.
  */
@@ -100,8 +174,10 @@ export const AccordionItemTitle = forwardRef(function AccordionItemTitle(props:
 });
 
 export interface AccordionItemHeaderProps extends UnsafeStyles, DOMProps {
+  /** The contents of the accordion item header. */
   children: React.ReactNode
 }
+
 /**
  * A wrapper element for the accordion item title that can contain other elements not part of the trigger.
  */
@@ -109,7 +185,16 @@ export const AccordionItemHeader = forwardRef(function AccordionItemHeader(props
   return <DisclosureHeader {...props} ref={ref} />;
 });
 
-export interface AccordionItemPanelProps extends DisclosurePanelProps {}
+export interface AccordionItemPanelProps extends UnsafeStyles, DOMProps, AriaLabelingProps {
+  /** The contents of the accordion item panel. */
+  children: React.ReactNode,
+  /**
+   * The accessibility role for the accordion item panel.
+   * @default 'group'
+   */
+  role?: 'group' | 'region'
+}
+
 /**
  * An accordion item panel is a collapsible section of content that is hidden until the accordion item is expanded.
  */
diff --git a/packages/@react-spectrum/s2/src/index.ts b/packages/@react-spectrum/s2/src/index.ts
index 2d495809dd2..41aaa06b79d 100644
--- a/packages/@react-spectrum/s2/src/index.ts
+++ b/packages/@react-spectrum/s2/src/index.ts
@@ -94,7 +94,7 @@ export {pressScale} from './pressScale';
 export {Autocomplete, Collection, FileTrigger, parseColor, useLocale} from 'react-aria-components';
 export {useListData, useTreeData, useAsyncList} from 'react-stately';
 
-export type {AccordionProps, AccordionItemProps, AccordionItemHeaderProps, AccordionItemTitleProps, AccordionItemPanelProps} from './Accordion';
+export type {AccordionProps, AccordionItemProps, AccordionItemHeaderProps, AccordionItemTitleProps, AccordionItemPanelProps, AccordionItemState, AccordionItemRenderProps} from './Accordion';
 export type {ActionBarProps} from './ActionBar';
 export type {ActionButtonProps} from './ActionButton';
 export type {ActionButtonGroupProps} from './ActionButtonGroup';

From 545437ac43910e04ab5a6c1151d97c01b44935ba Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Fri, 5 Dec 2025 14:03:56 -0800
Subject: [PATCH 3/5] make linearGradient/edgeToText internal only

---
 packages/@react-spectrum/s2/src/Accordion.tsx  |  2 +-
 packages/@react-spectrum/s2/src/Button.tsx     | 13 +++++++------
 packages/@react-spectrum/s2/src/ComboBox.tsx   |  7 ++++---
 packages/@react-spectrum/s2/src/Menu.tsx       | 13 +++++++------
 packages/@react-spectrum/s2/src/Picker.tsx     |  5 +++--
 packages/@react-spectrum/s2/src/TabsPicker.tsx | 15 ++++++++-------
 packages/@react-spectrum/s2/style/index.ts     |  2 +-
 7 files changed, 31 insertions(+), 26 deletions(-)

diff --git a/packages/@react-spectrum/s2/src/Accordion.tsx b/packages/@react-spectrum/s2/src/Accordion.tsx
index 00f3c15f0a3..03c9373946a 100644
--- a/packages/@react-spectrum/s2/src/Accordion.tsx
+++ b/packages/@react-spectrum/s2/src/Accordion.tsx
@@ -87,7 +87,6 @@ export const Accordion = forwardRef(function Accordion(props: AccordionProps, re
   );
 });
 
-// TODO: export these
 export interface AccordionItemState {
   /** Whether the accordion item is currently expanded. */
   readonly isExpanded: boolean,
@@ -149,6 +148,7 @@ export interface AccordionItemProps extends Omit<RenderProps<AccordionItemRender
   /** Whether the accordion item is expanded by default (uncontrolled). */
   defaultExpanded?: boolean
 }
+
 /**
  * A accordion item is a collapsible section of content. It is composed of a header with a heading and trigger button, and a panel that contains the content.
  */
diff --git a/packages/@react-spectrum/s2/src/Button.tsx b/packages/@react-spectrum/s2/src/Button.tsx
index acd77cb9721..a930ed8f62b 100644
--- a/packages/@react-spectrum/s2/src/Button.tsx
+++ b/packages/@react-spectrum/s2/src/Button.tsx
@@ -10,18 +10,19 @@
  * governing permissions and limitations under the License.
  */
 
-import {baseColor, focusRing, fontRelative, lightDark, linearGradient, style} from '../style' with {type: 'macro'};
-import {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';
-import {centerBaseline} from './CenterBaseline';
-import {control, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};
-import {createContext, forwardRef, ReactNode, useContext, useEffect, useState} from 'react';
 import {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';
-import {IconContext} from './Icon';
+import {createContext, forwardRef, ReactNode, useContext, useEffect, useState} from 'react';
+import {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';
 // @ts-ignore
 import intlMessages from '../intl/*.json';
+import {baseColor, focusRing, fontRelative, lightDark, style} from '../style' with {type: 'macro'};
+import {linearGradient} from '../style/spectrum-theme' with {type: 'macro'};
+import {centerBaseline} from './CenterBaseline';
+import {IconContext} from './Icon';
 import {pressScale} from './pressScale';
 import {ProgressCircle} from './ProgressCircle';
 import {SkeletonContext} from './Skeleton';
+import {control, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};
 import {Text, TextContext} from './Content';
 import {useFocusableRef} from '@react-spectrum/utils';
 import {useFormProps} from './Form';
diff --git a/packages/@react-spectrum/s2/src/ComboBox.tsx b/packages/@react-spectrum/s2/src/ComboBox.tsx
index 9f5ea1cfb9d..21cac6ed7cc 100644
--- a/packages/@react-spectrum/s2/src/ComboBox.tsx
+++ b/packages/@react-spectrum/s2/src/ComboBox.tsx
@@ -10,6 +10,8 @@
  * governing permissions and limitations under the License.
  */
 
+import {BaseCollection, CollectionNode, createLeafComponent} from '@react-aria/collections';
+import {AsyncLoadable, GlobalDOMAttributes, HelpTextProps, LoadingState, SpectrumLabelableProps} from '@react-types/shared';
 import {
   ComboBox as AriaComboBox,
   ComboBoxProps as AriaComboBoxProps,
@@ -33,10 +35,9 @@ import {
   SectionProps,
   Virtualizer
 } from 'react-aria-components';
-import {AsyncLoadable, GlobalDOMAttributes, HelpTextProps, LoadingState, SpectrumLabelableProps} from '@react-types/shared';
+import {baseColor, focusRing, space, style} from '../style' with {type: 'macro'};
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {AvatarContext} from './Avatar';
-import {BaseCollection, CollectionNode, createLeafComponent} from '@react-aria/collections';
-import {baseColor, edgeToText, focusRing, space, style} from '../style' with {type: 'macro'};
 import {centerBaseline} from './CenterBaseline';
 import {centerPadding, control, controlBorderRadius, controlFont, controlSize, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};
 import {
diff --git a/packages/@react-spectrum/s2/src/Menu.tsx b/packages/@react-spectrum/s2/src/Menu.tsx
index 4871a6050a6..c3194b7ba6d 100644
--- a/packages/@react-spectrum/s2/src/Menu.tsx
+++ b/packages/@react-spectrum/s2/src/Menu.tsx
@@ -10,6 +10,8 @@
  * governing permissions and limitations under the License.
  */
 
+import {DOMRef, DOMRefValue, GlobalDOMAttributes, PressEvent} from '@react-types/shared';
+import {createContext, forwardRef, JSX, ReactNode, useContext, useRef, useState} from 'react';
 import {
   Menu as AriaMenu,
   MenuItem as AriaMenuItem,
@@ -28,15 +30,14 @@ import {
   Separator,
   SeparatorProps
 } from 'react-aria-components';
-import {baseColor, edgeToText, focusRing, fontRelative, size, space, style} from '../style' with {type: 'macro'};
-import {box, iconStyles} from './Checkbox';
-import {centerBaseline} from './CenterBaseline';
-import {centerPadding, control, controlFont, controlSize, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};
 import CheckmarkIcon from '../ui-icons/Checkmark';
 import ChevronRightIcon from '../ui-icons/Chevron';
-import {createContext, forwardRef, JSX, ReactNode, useContext, useRef, useState} from 'react';
+import {baseColor, focusRing, fontRelative, size, space, style} from '../style' with {type: 'macro'};
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
+import {centerBaseline} from './CenterBaseline';
+import {box, iconStyles} from './Checkbox';
 import {divider} from './Divider';
-import {DOMRef, DOMRefValue, GlobalDOMAttributes, PressEvent} from '@react-types/shared';
+import {centerPadding, control, controlFont, controlSize, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};
 import {forwardRefType} from './types';
 import {HeaderContext, HeadingContext, KeyboardContext, Text, TextContext} from './Content';
 import {IconContext} from './Icon'; // chevron right removed??
diff --git a/packages/@react-spectrum/s2/src/Picker.tsx b/packages/@react-spectrum/s2/src/Picker.tsx
index bc93a178e33..4f19556423a 100644
--- a/packages/@react-spectrum/s2/src/Picker.tsx
+++ b/packages/@react-spectrum/s2/src/Picker.tsx
@@ -33,10 +33,11 @@ import {
   Virtualizer
 } from 'react-aria-components';
 import {AsyncLoadable, FocusableRef, FocusableRefValue, GlobalDOMAttributes, HelpTextProps, LoadingState, PressEvent, RefObject, SpectrumLabelableProps} from '@react-types/shared';
+import {baseColor, focusRing, style} from '../style' with {type: 'macro'};
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {AvatarContext} from './Avatar';
-import {baseColor, edgeToText, focusRing, style} from '../style' with {type: 'macro'};
-import {box, iconStyles as checkboxIconStyles} from './Checkbox';
 import {centerBaseline} from './CenterBaseline';
+import {box, iconStyles as checkboxIconStyles} from './Checkbox';
 import {
   checkbox,
   checkmark,
diff --git a/packages/@react-spectrum/s2/src/TabsPicker.tsx b/packages/@react-spectrum/s2/src/TabsPicker.tsx
index 3d059106abe..38345782997 100644
--- a/packages/@react-spectrum/s2/src/TabsPicker.tsx
+++ b/packages/@react-spectrum/s2/src/TabsPicker.tsx
@@ -23,8 +23,15 @@ import {
   Provider,
   SelectValue
 } from 'react-aria-components';
-import {baseColor, edgeToText, focusRing, size, style} from '../style' with {type: 'macro'};
+import {FocusableRef, FocusableRefValue, SpectrumLabelableProps} from '@react-types/shared';
+import CheckmarkIcon from '../ui-icons/Checkmark';
+import ChevronIcon from '../ui-icons/Chevron';
+import {baseColor, focusRing, size, style} from '../style' with {type: 'macro'};
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {centerBaseline} from './CenterBaseline';
+import {
+  FieldLabel
+} from './Field';
 import {
   checkmark,
   description,
@@ -34,13 +41,7 @@ import {
   sectionHeader,
   sectionHeading
 } from './Menu';
-import CheckmarkIcon from '../ui-icons/Checkmark';
-import ChevronIcon from '../ui-icons/Chevron';
 import {controlFont, fieldInput, StyleProps} from './style-utils' with {type: 'macro'};
-import {
-  FieldLabel
-} from './Field';
-import {FocusableRef, FocusableRefValue, SpectrumLabelableProps} from '@react-types/shared';
 import {forwardRefType} from './types';
 import {HeaderContext, HeadingContext, Text, TextContext} from './Content';
 import {IconContext} from './Icon';
diff --git a/packages/@react-spectrum/s2/style/index.ts b/packages/@react-spectrum/s2/style/index.ts
index 7ca5b24f0b4..41e4be388d7 100644
--- a/packages/@react-spectrum/s2/style/index.ts
+++ b/packages/@react-spectrum/s2/style/index.ts
@@ -15,7 +15,7 @@ import {Inset, fontRelative as internalFontRelative, space as internalSpace, Spa
 import type {MacroContext} from '@parcel/macros';
 import {StyleString} from './types';
 
-export {baseColor, color, edgeToText, lightDark, linearGradient, colorMix, size, style} from './spectrum-theme';
+export {baseColor, color, lightDark, colorMix, size, style} from './spectrum-theme';
 export type {StyleString} from './types';
 
 // Wrap these functions in arbitrary value syntax when called from the outside.

From 26536eb952cbff16c577ac3f033c0e359287c293 Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Fri, 5 Dec 2025 14:54:38 -0800
Subject: [PATCH 4/5] fix lint

---
 packages/@react-spectrum/s2/src/Button.tsx     | 12 ++++++------
 packages/@react-spectrum/s2/src/ComboBox.tsx   |  8 ++++----
 packages/@react-spectrum/s2/src/Menu.tsx       | 14 +++++++-------
 packages/@react-spectrum/s2/src/Picker.tsx     |  6 +++---
 packages/@react-spectrum/s2/src/TabsPicker.tsx | 14 +++++++-------
 5 files changed, 27 insertions(+), 27 deletions(-)

diff --git a/packages/@react-spectrum/s2/src/Button.tsx b/packages/@react-spectrum/s2/src/Button.tsx
index a930ed8f62b..50f16af4a92 100644
--- a/packages/@react-spectrum/s2/src/Button.tsx
+++ b/packages/@react-spectrum/s2/src/Button.tsx
@@ -10,19 +10,19 @@
  * governing permissions and limitations under the License.
  */
 
-import {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';
-import {createContext, forwardRef, ReactNode, useContext, useEffect, useState} from 'react';
+import {baseColor, focusRing, fontRelative, lightDark, style} from '../style' with {type: 'macro'};
 import {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';
+import {centerBaseline} from './CenterBaseline';
 // @ts-ignore
+import {control, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};
+import {createContext, forwardRef, ReactNode, useContext, useEffect, useState} from 'react';
+import {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';
+import {IconContext} from './Icon';
 import intlMessages from '../intl/*.json';
-import {baseColor, focusRing, fontRelative, lightDark, style} from '../style' with {type: 'macro'};
 import {linearGradient} from '../style/spectrum-theme' with {type: 'macro'};
-import {centerBaseline} from './CenterBaseline';
-import {IconContext} from './Icon';
 import {pressScale} from './pressScale';
 import {ProgressCircle} from './ProgressCircle';
 import {SkeletonContext} from './Skeleton';
-import {control, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};
 import {Text, TextContext} from './Content';
 import {useFocusableRef} from '@react-spectrum/utils';
 import {useFormProps} from './Form';
diff --git a/packages/@react-spectrum/s2/src/ComboBox.tsx b/packages/@react-spectrum/s2/src/ComboBox.tsx
index 21cac6ed7cc..0f336cd54d2 100644
--- a/packages/@react-spectrum/s2/src/ComboBox.tsx
+++ b/packages/@react-spectrum/s2/src/ComboBox.tsx
@@ -10,8 +10,6 @@
  * governing permissions and limitations under the License.
  */
 
-import {BaseCollection, CollectionNode, createLeafComponent} from '@react-aria/collections';
-import {AsyncLoadable, GlobalDOMAttributes, HelpTextProps, LoadingState, SpectrumLabelableProps} from '@react-types/shared';
 import {
   ComboBox as AriaComboBox,
   ComboBoxProps as AriaComboBoxProps,
@@ -35,9 +33,10 @@ import {
   SectionProps,
   Virtualizer
 } from 'react-aria-components';
-import {baseColor, focusRing, space, style} from '../style' with {type: 'macro'};
-import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
+import {AsyncLoadable, GlobalDOMAttributes, HelpTextProps, LoadingState, SpectrumLabelableProps} from '@react-types/shared';
 import {AvatarContext} from './Avatar';
+import {BaseCollection, CollectionNode, createLeafComponent} from '@react-aria/collections';
+import {baseColor, focusRing, space, style} from '../style' with {type: 'macro'};
 import {centerBaseline} from './CenterBaseline';
 import {centerPadding, control, controlBorderRadius, controlFont, controlSize, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};
 import {
@@ -52,6 +51,7 @@ import CheckmarkIcon from '../ui-icons/Checkmark';
 import ChevronIcon from '../ui-icons/Chevron';
 import {createContext, CSSProperties, ForwardedRef, forwardRef, ReactNode, Ref, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState} from 'react';
 import {createFocusableRef} from '@react-spectrum/utils';
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';
 import {FormContext, useFormProps} from './Form';
 import {forwardRefType} from './types';
diff --git a/packages/@react-spectrum/s2/src/Menu.tsx b/packages/@react-spectrum/s2/src/Menu.tsx
index c3194b7ba6d..b2e52299d2d 100644
--- a/packages/@react-spectrum/s2/src/Menu.tsx
+++ b/packages/@react-spectrum/s2/src/Menu.tsx
@@ -10,8 +10,6 @@
  * governing permissions and limitations under the License.
  */
 
-import {DOMRef, DOMRefValue, GlobalDOMAttributes, PressEvent} from '@react-types/shared';
-import {createContext, forwardRef, JSX, ReactNode, useContext, useRef, useState} from 'react';
 import {
   Menu as AriaMenu,
   MenuItem as AriaMenuItem,
@@ -30,14 +28,16 @@ import {
   Separator,
   SeparatorProps
 } from 'react-aria-components';
-import CheckmarkIcon from '../ui-icons/Checkmark';
-import ChevronRightIcon from '../ui-icons/Chevron';
 import {baseColor, focusRing, fontRelative, size, space, style} from '../style' with {type: 'macro'};
-import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
-import {centerBaseline} from './CenterBaseline';
 import {box, iconStyles} from './Checkbox';
-import {divider} from './Divider';
+import {centerBaseline} from './CenterBaseline';
 import {centerPadding, control, controlFont, controlSize, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};
+import CheckmarkIcon from '../ui-icons/Checkmark';
+import ChevronRightIcon from '../ui-icons/Chevron';
+import {createContext, forwardRef, JSX, ReactNode, useContext, useRef, useState} from 'react';
+import {divider} from './Divider';
+import {DOMRef, DOMRefValue, GlobalDOMAttributes, PressEvent} from '@react-types/shared';
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {forwardRefType} from './types';
 import {HeaderContext, HeadingContext, KeyboardContext, Text, TextContext} from './Content';
 import {IconContext} from './Icon'; // chevron right removed??
diff --git a/packages/@react-spectrum/s2/src/Picker.tsx b/packages/@react-spectrum/s2/src/Picker.tsx
index 4f19556423a..10ffb7bffab 100644
--- a/packages/@react-spectrum/s2/src/Picker.tsx
+++ b/packages/@react-spectrum/s2/src/Picker.tsx
@@ -33,11 +33,10 @@ import {
   Virtualizer
 } from 'react-aria-components';
 import {AsyncLoadable, FocusableRef, FocusableRefValue, GlobalDOMAttributes, HelpTextProps, LoadingState, PressEvent, RefObject, SpectrumLabelableProps} from '@react-types/shared';
-import {baseColor, focusRing, style} from '../style' with {type: 'macro'};
-import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {AvatarContext} from './Avatar';
-import {centerBaseline} from './CenterBaseline';
+import {baseColor, focusRing, style} from '../style' with {type: 'macro'};
 import {box, iconStyles as checkboxIconStyles} from './Checkbox';
+import {centerBaseline} from './CenterBaseline';
 import {
   checkbox,
   checkmark,
@@ -58,6 +57,7 @@ import {
   listboxItem,
   LOADER_ROW_HEIGHTS
 } from './ComboBox';
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {
   FieldErrorIcon,
   FieldLabel,
diff --git a/packages/@react-spectrum/s2/src/TabsPicker.tsx b/packages/@react-spectrum/s2/src/TabsPicker.tsx
index 38345782997..0d5faf4b7c3 100644
--- a/packages/@react-spectrum/s2/src/TabsPicker.tsx
+++ b/packages/@react-spectrum/s2/src/TabsPicker.tsx
@@ -23,15 +23,8 @@ import {
   Provider,
   SelectValue
 } from 'react-aria-components';
-import {FocusableRef, FocusableRefValue, SpectrumLabelableProps} from '@react-types/shared';
-import CheckmarkIcon from '../ui-icons/Checkmark';
-import ChevronIcon from '../ui-icons/Chevron';
 import {baseColor, focusRing, size, style} from '../style' with {type: 'macro'};
-import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
 import {centerBaseline} from './CenterBaseline';
-import {
-  FieldLabel
-} from './Field';
 import {
   checkmark,
   description,
@@ -41,7 +34,14 @@ import {
   sectionHeader,
   sectionHeading
 } from './Menu';
+import CheckmarkIcon from '../ui-icons/Checkmark';
+import ChevronIcon from '../ui-icons/Chevron';
 import {controlFont, fieldInput, StyleProps} from './style-utils' with {type: 'macro'};
+import {edgeToText} from '../style/spectrum-theme' with {type: 'macro'};
+import {
+  FieldLabel
+} from './Field';
+import {FocusableRef, FocusableRefValue, SpectrumLabelableProps} from '@react-types/shared';
 import {forwardRefType} from './types';
 import {HeaderContext, HeadingContext, Text, TextContext} from './Content';
 import {IconContext} from './Icon';

From 1468d05eb1027b7638370eed9bdcb2a55417faee Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Fri, 5 Dec 2025 15:49:29 -0800
Subject: [PATCH 5/5] ide import fix doesnt move the ts ignore

---
 packages/@react-spectrum/s2/src/Button.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/@react-spectrum/s2/src/Button.tsx b/packages/@react-spectrum/s2/src/Button.tsx
index 50f16af4a92..5db089a9bfa 100644
--- a/packages/@react-spectrum/s2/src/Button.tsx
+++ b/packages/@react-spectrum/s2/src/Button.tsx
@@ -13,11 +13,11 @@
 import {baseColor, focusRing, fontRelative, lightDark, style} from '../style' with {type: 'macro'};
 import {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';
 import {centerBaseline} from './CenterBaseline';
-// @ts-ignore
 import {control, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};
 import {createContext, forwardRef, ReactNode, useContext, useEffect, useState} from 'react';
 import {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';
 import {IconContext} from './Icon';
+// @ts-ignore
 import intlMessages from '../intl/*.json';
 import {linearGradient} from '../style/spectrum-theme' with {type: 'macro'};
 import {pressScale} from './pressScale';