From 2aeaa456c07306f8ee19f2ad44d4304fe8cfb813 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Fri, 28 Aug 2026 14:28:41 -0700 Subject: [PATCH 01/18] chore: august release notes --- .../pages/react-aria/releases/v1-21-0.mdx | 151 ++++++++++++++++++ .../dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 51 ++++++ scripts/changelog.js | 10 +- 3 files changed, 211 insertions(+), 1 deletion(-) create mode 100644 packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx create mode 100644 packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx new file mode 100644 index 00000000000..848c0ca07d1 --- /dev/null +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -0,0 +1,151 @@ +{/* Copyright 2026 Adobe. All rights reserved. +This file is licensed to you under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. You may obtain a copy +of the License at http://www.apache.org/licenses/LICENSE-2.0 +Unless required by applicable law or agreed to in writing, software distributed under +the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS +OF ANY KIND, either express or implied. See the License for the specific language +governing permissions and limitations under the License. */} + +import {InstallCommand} from '../../../src/InstallCommand'; + +import {Layout} from '../../../src/Layout'; +export default Layout; + +import docs from 'docs:@react-spectrum/s2'; + +export const hideNav = true; +export const section = 'Releases'; +export const tags = ['release', 'React Aria']; +export const date = 'August 28, 2026'; +export const title = 'v1.21.0'; +export const description = 'This release adds a new NavigationTree component, async loading and empty state support for Menu, and a new useShowFocusIndicator hook, along with many bug fixes!' +export const isSubpage = true; + +# v1.21.0 + +This release introduces the new [NavigationTree](../NavigationTree) for building hierarchical app navigation and adds async loading and empty state support to [Menu](../Menu), along with many bug fixes! + +```tsx render hideCode +"use client"; +import {NavigationTree, NavigationTreeItem, NavigationTreeItemContent, NavigationTreeItemLink} from 'vanilla-starter/NavigationTree'; +import {Button} from 'vanilla-starter/Button'; +import {MoreHorizontal} from 'lucide-react'; +import {RouterProvider} from 'react-aria-components'; +import React, {ReactNode, useState} from 'react'; + +function RoutedNavigationTree(props: { + children: ({selectedRoute}: {selectedRoute: string}) => ReactNode; + defaultSelectedRoute: string; +}) { + let {children} = props; + let [selectedRoute, setSelectedRoute] = useState(props.defaultSelectedRoute); + + let updateSelection = (href: string) => { + setSelectedRoute(href); + }; + + return {children({selectedRoute})}; +} + + + {({selectedRoute}) => ( + + + + Home + + + + + + Files + + + + + Photos + + + + + + Videos + + + + + + + Shared + + + + + Food + + + + + + Drinks + + + + + + )} + +``` + +## Changelog + +### General Changes +- Re-export `FocusableElement`, `HoverEvent`, and `KeyboardEvent` types from `react-aria-components` - [@sobol-sudo](https://github.com/sobol-sudo) - [PR](https://github.com/adobe/react-spectrum/pull/10366) +- Add `useShowFocusIndicator` hook to switch the interaction modality to keyboard - [@JasonColapietro](https://github.com/JasonColapietro) - [PR](https://github.com/adobe/react-spectrum/pull/10426) +- Export `setInteractionModality` - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10491) +- Keep the interaction modality on window refocus so Safari doesn't show a focus ring - [@daveycodez](https://github.com/daveycodez) - [PR](https://github.com/adobe/react-spectrum/pull/10513) +- Apply hook filters in `optimize-locales-plugin` so unused locale strings are removed - [@wojtekmaj](https://github.com/wojtekmaj) - [PR](https://github.com/adobe/react-spectrum/pull/10302) +- Improve `setStyle` and focus handling in `usePreventScroll` - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10434) +### Calendar +- Allow selecting dates outside the visible range when `isDateUnavailable` is set - [@cycsmail](https://github.com/cycsmail) - [PR](https://github.com/adobe/react-spectrum/pull/10328) +### Checkbox +- Update`inputRef` type to accept callback refs - [@timges](https://github.com/timges) - [PR](https://github.com/adobe/react-spectrum/pull/10451) +### ColorField +- Commit the value when pressing Enter - [@grayashh](https://github.com/grayashh) - [PR](https://github.com/adobe/react-spectrum/pull/10450) +### Collections +- Select the autofocused item when `selectOnFocus` is enabled - [@xevrion](https://github.com/xevrion) - [PR](https://github.com/adobe/react-spectrum/pull/10396) +### Date and Time +- Fix Ethiopic and Coptic year estimation in `julianDayToCE` on new year dates - [@FrancoKaddour](https://github.com/FrancoKaddour) - [PR](https://github.com/adobe/react-spectrum/pull/10424) +### Dialog +- Allow DialogTrigger to work when nested inside Tabs - [@RobHannay](https://github.com/RobHannay) - [PR](https://github.com/adobe/react-spectrum/pull/10367) +- Support Select and Combobox inside a Dialog - [@yihuiliao](https://github.com/yihuiliao) - [PR](https://github.com/adobe/react-spectrum/pull/10430) +### Form +- Add Formisch to the form libraries section of the forms doc guide - [@fabian-hiller](https://github.com/fabian-hiller) - [PR](https://github.com/adobe/react-spectrum/pull/10410) +### Menu +- Add async loading and empty state support to Menu - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10494) +- Add typeahead support to Menu example in docs [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10508) +### NavigationTree +- Add NavigationTree component - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10404), [PR](https://github.com/adobe/react-spectrum/pull/10507) +### Overlays +- Fix position overlays on iOS 26 - [@nwidynski](https://github.com/nwidynski) - [PR](https://github.com/adobe/react-spectrum/pull/10456) +- Guard against a null restore target in `FocusScope` `restoreFocus` - [@Faithfinder](https://github.com/Faithfinder) - [PR](https://github.com/adobe/react-spectrum/pull/10371) +### RadioGroup +- Update`inputRef` type to accept callback refs - [@timges](https://github.com/timges) - [PR](https://github.com/adobe/react-spectrum/pull/10451) +### Switch +- Update `inputRef` type to accept callback refs - [@timges](https://github.com/timges) - [PR](https://github.com/adobe/react-spectrum/pull/10451) +### Table +- Insert at the end when dropping past the last row instead of failing to resolve the drop target - [@meesvandongen](https://github.com/meesvandongen) - [PR](https://github.com/adobe/react-spectrum/pull/10464) +### Tabs +- Keep ArrowLeft and ArrowRight consistent in RTL vertical orientation - [@starboyvarun](https://github.com/starboyvarun) - [PR](https://github.com/adobe/react-spectrum/pull/10467) +### TokenField +- Track the TokenField selection range to allow external control and restore selection on undo- [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10438), [PR](https://github.com/adobe/react-spectrum/pull/10505) +- Fix IME composition in Firefox - [@chirokas](https://github.com/chirokas) - [PR](https://github.com/adobe/react-spectrum/pull/10422) +- Fix TokenField docs regex for IME [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10474) + + +## Released packages + +``` +[TODO: paste output of yarn bumpVersions here] +``` diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx new file mode 100644 index 00000000000..6cd368ee9ea --- /dev/null +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -0,0 +1,51 @@ +{/* Copyright 2026 Adobe. All rights reserved. +This file is licensed to you under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. You may obtain a copy +of the License at http://www.apache.org/licenses/LICENSE-2.0 +Unless required by applicable law or agreed to in writing, software distributed under +the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS +OF ANY KIND, either express or implied. See the License for the specific language +governing permissions and limitations under the License. */} + +import {InstallCommand} from '../../../src/InstallCommand'; + +import {Layout} from '../../../src/Layout'; +export default Layout; + +import docs from 'docs:@react-spectrum/s2'; + +export const hideNav = true; +export const section = 'Releases'; +export const tags = ['release', 'S2']; +export const date = 'August 28, 2026'; +export const title = 'v1.7.0'; +export const description = 'This release refreshes icon sizing to match text line height, and includes contrast and rendering fixes across ActionBar, Avatar, ListView, Menu, and TableView.'; +export const isSubpage = true; + +# v1.7.0 + +This release updates icon sizing across components to match the text line height. It also includes contrast and rendering fixes for [ActionBar](../ActionBar), [Avatar](../Avatar), [ListView](../ListView), [Menu](../Menu), and [TableView](../TableView). + +## Changelog + +### ActionBar +- Fix the close button icon color so it meets contrast in dark mode - [@reidbarber](https://github.com/reidbarber) - [PR](https://github.com/adobe/react-spectrum/pull/10429) +### Avatar +- Show Avatars when a ComboBox or Picker is rendered inside a Dialog - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10482) +### Icons +- Size icons to match the text line height using the `lh` unit - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10414) +- Update S2 workflow icons to `v7.1.0` - [@yihuiliao](https://github.com/yihuiliao) - [PR](https://github.com/adobe/react-spectrum/pull/10522) +### ListView +- Fix the workflow icon size - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10514) +### Menu +- Set `staticColor` to `auto` for buttons inside a Menu so their colors adapt to the background - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10474) +### TableView +- Fix an invalid empty `:has()` selector emitted in TableView CSS - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10469) +### Tooltip +- Update Tooltip docs - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10413) + +## Released packages + +``` +[TODO: paste output of yarn bumpVersions here] +``` diff --git a/scripts/changelog.js b/scripts/changelog.js index f9ec64d239d..e55b4906ee3 100644 --- a/scripts/changelog.js +++ b/scripts/changelog.js @@ -57,7 +57,15 @@ function packageToLibrary(name) { } function nextVersionFilename(releasesDir) { - let entries = fs.readdirSync(releasesDir); + let entries; + try { + entries = exec(`git ls-files "${releasesDir}"`, {encoding: 'utf8'}) + .split('\n') + .filter(Boolean) + .map(p => path.basename(p)); + } catch { + entries = fs.readdirSync(releasesDir); + } let versions = []; for (let entry of entries) { let m = entry.match(/^v(\d+)-(\d+)-(\d+)\.mdx$/); From 19f8ccc8c40bfa75999eee1419ebe1f4dfd26cc1 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Fri, 28 Aug 2026 15:08:33 -0700 Subject: [PATCH 02/18] add example --- .../pages/react-aria/releases/v1-21-0.mdx | 45 ++++++++++++++++++- .../dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 4 +- 2 files changed, 46 insertions(+), 3 deletions(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index 848c0ca07d1..51c2a63e227 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -24,7 +24,7 @@ export const isSubpage = true; # v1.21.0 -This release introduces the new [NavigationTree](../NavigationTree) for building hierarchical app navigation and adds async loading and empty state support to [Menu](../Menu), along with many bug fixes! +The new [NavigationTree](../NavigationTree) component can be used for building hierarchical app navigation. ```tsx render hideCode "use client"; @@ -98,6 +98,49 @@ function RoutedNavigationTree(props: { ``` +[Menu](../Menu#asynchronous-loading) now supports async loading and empty state. + +```tsx render hideCode +"use client" + +import {MenuTrigger, Menu, MenuItem, MenuLoadMoreItem} from 'vanilla-starter/Menu'; +import {Button} from 'vanilla-starter/Button'; +import {Collection} from 'react-aria-components/Collection'; +import {useAsyncList} from 'react-aria-components/useAsyncList'; + +interface Character { + name: string; + birth_year: string; +} + +function AsyncMenuExample() { + let list = useAsyncList({ + async load({signal, cursor}) { + if (cursor) cursor = cursor.replace(/^http:\/\//i, 'https://'); + let res = await fetch(cursor || 'https://swapi.py4e.com/api/people/', {signal}); + let json = await res.json(); + return {items: json.results, cursor: json.next}; + } + }); + + return ( + + + list.loadingState === 'loading' ? 'Loading…' : 'No characters found'}> + + {(item) => {item.name}} + + + + + ); +} +``` + ## Changelog ### General Changes diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 6cd368ee9ea..e75427892bc 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -19,12 +19,12 @@ export const section = 'Releases'; export const tags = ['release', 'S2']; export const date = 'August 28, 2026'; export const title = 'v1.7.0'; -export const description = 'This release refreshes icon sizing to match text line height, and includes contrast and rendering fixes across ActionBar, Avatar, ListView, Menu, and TableView.'; +export const description = 'This release refreshes icon sizing to match text line height, and several bug fixes'; export const isSubpage = true; # v1.7.0 -This release updates icon sizing across components to match the text line height. It also includes contrast and rendering fixes for [ActionBar](../ActionBar), [Avatar](../Avatar), [ListView](../ListView), [Menu](../Menu), and [TableView](../TableView). +This release updates workflow icons to the latest version, refreshes icon sizing to match the text line height, and includes several bug fixes! ## Changelog From 1f6990b5d3394a87b0a2a92e90defdf76515228c Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Fri, 28 Aug 2026 16:14:34 -0700 Subject: [PATCH 03/18] small update --- packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index 51c2a63e227..d9a86bc1bfa 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -19,7 +19,7 @@ export const section = 'Releases'; export const tags = ['release', 'React Aria']; export const date = 'August 28, 2026'; export const title = 'v1.21.0'; -export const description = 'This release adds a new NavigationTree component, async loading and empty state support for Menu, and a new useShowFocusIndicator hook, along with many bug fixes!' +export const description = 'This release adds a new NavigationTree component, async loading and empty state support for Menu, along with many bug fixes!' export const isSubpage = true; # v1.21.0 From 1d59ff725b8e1c4bf13a3844441081e461ce2137 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Fri, 28 Aug 2026 16:21:59 -0700 Subject: [PATCH 04/18] remove commit --- packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index d9a86bc1bfa..159d62f19ea 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -145,7 +145,6 @@ function AsyncMenuExample() { ### General Changes - Re-export `FocusableElement`, `HoverEvent`, and `KeyboardEvent` types from `react-aria-components` - [@sobol-sudo](https://github.com/sobol-sudo) - [PR](https://github.com/adobe/react-spectrum/pull/10366) -- Add `useShowFocusIndicator` hook to switch the interaction modality to keyboard - [@JasonColapietro](https://github.com/JasonColapietro) - [PR](https://github.com/adobe/react-spectrum/pull/10426) - Export `setInteractionModality` - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10491) - Keep the interaction modality on window refocus so Safari doesn't show a focus ring - [@daveycodez](https://github.com/daveycodez) - [PR](https://github.com/adobe/react-spectrum/pull/10513) - Apply hook filters in `optimize-locales-plugin` so unused locale strings are removed - [@wojtekmaj](https://github.com/wojtekmaj) - [PR](https://github.com/adobe/react-spectrum/pull/10302) From 7252358d313b695255b1c93099502514c5a5ad2d Mon Sep 17 00:00:00 2001 From: Daniel Lu Date: Mon, 31 Aug 2026 11:44:00 -0700 Subject: [PATCH 05/18] update aria release notes and add call outs --- .../pages/react-aria/releases/v1-21-0.mdx | 18 ++++++++++++------ .../dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 4 ++++ 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index 159d62f19ea..225878cbe56 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -17,14 +17,14 @@ import docs from 'docs:@react-spectrum/s2'; export const hideNav = true; export const section = 'Releases'; export const tags = ['release', 'React Aria']; -export const date = 'August 28, 2026'; +export const date = 'September 1, 2026'; export const title = 'v1.21.0'; export const description = 'This release adds a new NavigationTree component, async loading and empty state support for Menu, along with many bug fixes!' export const isSubpage = true; # v1.21.0 -The new [NavigationTree](../NavigationTree) component can be used for building hierarchical app navigation. +We're excited to welcome a brand new component to the family! The new [NavigationTree](../NavigationTree) component displays a hierarchical set of links, perfect for building sidebars and complex app navigation. It comes fully loaded with keyboard navigation, and support for nested routes. ```tsx render hideCode "use client"; @@ -98,7 +98,7 @@ function RoutedNavigationTree(props: { ``` -[Menu](../Menu#asynchronous-loading) now supports async loading and empty state. +[Menu](../Menu#asynchronous-loading) also gets a big upgrade this release: it now supports async loading and empty states! Load menu items from an API as needed as the user scrolls with the new `MenuLoadMoreItem` and use `renderEmptyState` to show a indicator when data is loading or when the menu is empty. ```tsx render hideCode "use client" @@ -141,6 +141,12 @@ function AsyncMenuExample() { } ``` +## TokenField selection API update + +`TokenFieldValue` now tracks the full selected range instead of a single caret position. The `caretPosition` property is replaced by `selectedRange`, which stores both the anchor and current offsets so a range selection can be restored after an undo or redo. Use `withSelectedRange` to update the selection going forward. + +Finally, this release also features many fixes and updates from external contributors! As always, a big thank you for all the support! + ## Changelog ### General Changes @@ -166,7 +172,7 @@ function AsyncMenuExample() { - Add Formisch to the form libraries section of the forms doc guide - [@fabian-hiller](https://github.com/fabian-hiller) - [PR](https://github.com/adobe/react-spectrum/pull/10410) ### Menu - Add async loading and empty state support to Menu - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10494) -- Add typeahead support to Menu example in docs [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10508) +- Add typeahead support to Menu example in docs - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10508) ### NavigationTree - Add NavigationTree component - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10404), [PR](https://github.com/adobe/react-spectrum/pull/10507) ### Overlays @@ -181,9 +187,9 @@ function AsyncMenuExample() { ### Tabs - Keep ArrowLeft and ArrowRight consistent in RTL vertical orientation - [@starboyvarun](https://github.com/starboyvarun) - [PR](https://github.com/adobe/react-spectrum/pull/10467) ### TokenField -- Track the TokenField selection range to allow external control and restore selection on undo- [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10438), [PR](https://github.com/adobe/react-spectrum/pull/10505) +- Track the TokenField selection range to allow external control and restore selection on undo - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10438), [PR](https://github.com/adobe/react-spectrum/pull/10505) - Fix IME composition in Firefox - [@chirokas](https://github.com/chirokas) - [PR](https://github.com/adobe/react-spectrum/pull/10422) -- Fix TokenField docs regex for IME [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10474) +- Fix TokenField docs regex for IME - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10474) ## Released packages diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index e75427892bc..8439002a7d5 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -26,6 +26,10 @@ export const isSubpage = true; This release updates workflow icons to the latest version, refreshes icon sizing to match the text line height, and includes several bug fixes! +## Icon size updates + +Spectrum has updated the intended size of workflow icons relative to surrounding text. This is an intentional design update but it does mean icons may render at a different size from before post update. If you rely on visual regression tests, expect diffs around icon sizing and update your baselines accordingly. + ## Changelog ### ActionBar From cbfbd0e8d7b6da8afd9db71d231a1a5afebef013 Mon Sep 17 00:00:00 2001 From: Daniel Lu Date: Mon, 31 Aug 2026 11:45:22 -0700 Subject: [PATCH 06/18] fix date --- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 8439002a7d5..8991a3801fb 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -17,7 +17,7 @@ import docs from 'docs:@react-spectrum/s2'; export const hideNav = true; export const section = 'Releases'; export const tags = ['release', 'S2']; -export const date = 'August 28, 2026'; +export const date = 'September 1, 2026'; export const title = 'v1.7.0'; export const description = 'This release refreshes icon sizing to match text line height, and several bug fixes'; export const isSubpage = true; From a47ffc7c81f38e6eef1d7d0bd781d146b9b01c3c Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 12:13:30 -0700 Subject: [PATCH 07/18] updates --- .../pages/react-aria/releases/v1-21-0.mdx | 2 +- .../dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 19 +++++++++++++++++-- 2 files changed, 18 insertions(+), 3 deletions(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index 225878cbe56..bdf5a667c83 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -19,7 +19,7 @@ export const section = 'Releases'; export const tags = ['release', 'React Aria']; export const date = 'September 1, 2026'; export const title = 'v1.21.0'; -export const description = 'This release adds a new NavigationTree component, async loading and empty state support for Menu, along with many bug fixes!' +export const description = 'This release adds a new NavigationTree component, async loading and empty state support for Menu, TokenField API changes, along with many bug fixes!' export const isSubpage = true; # v1.21.0 diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 8991a3801fb..6136770a933 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -19,19 +19,34 @@ export const section = 'Releases'; export const tags = ['release', 'S2']; export const date = 'September 1, 2026'; export const title = 'v1.7.0'; -export const description = 'This release refreshes icon sizing to match text line height, and several bug fixes'; +export const description = 'This release makes the AI Icon widely available, refreshes icon sizing to match text line height, and includes several bug fixes'; export const isSubpage = true; # v1.7.0 -This release updates workflow icons to the latest version, refreshes icon sizing to match the text line height, and includes several bug fixes! +## AI Components + +We are excited to announce the first preview of React Spectrum AI components to help build AI-powered experiences! Today, we are releasing our first batch of components and [documentation](../ai-components.mdx) on how to get started. Give it a try by installing through your preferred package manager! + + + +### AI Icon + +The `` icon is now widely available for use and can be imported via: + ## Icon size updates Spectrum has updated the intended size of workflow icons relative to surrounding text. This is an intentional design update but it does mean icons may render at a different size from before post update. If you rely on visual regression tests, expect diffs around icon sizing and update your baselines accordingly. +## TypeScript + +Types are now generated with TypeScript 7 so emitted `.d.ts` output may differ slightly. + ## Changelog +## General Changes +- Upgrade to TypeScript 7 - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10461 ### ActionBar - Fix the close button icon color so it meets contrast in dark mode - [@reidbarber](https://github.com/reidbarber) - [PR](https://github.com/adobe/react-spectrum/pull/10429) ### Avatar From 8abf219363541f48dfd838ecf5903f3c65ad2a1c Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 12:16:40 -0700 Subject: [PATCH 08/18] mention typescript upgrade --- packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index bdf5a667c83..1431ee73caa 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -145,6 +145,10 @@ function AsyncMenuExample() { `TokenFieldValue` now tracks the full selected range instead of a single caret position. The `caretPosition` property is replaced by `selectedRange`, which stores both the anchor and current offsets so a range selection can be restored after an undo or redo. Use `withSelectedRange` to update the selection going forward. +## TypeScript + +Types are now generated with TypeScript 7 so emitted `.d.ts` output may differ slightly. + Finally, this release also features many fixes and updates from external contributors! As always, a big thank you for all the support! ## Changelog From c5197db9c62c6d8e6df1fa8edc24893d0df02bb2 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 12:17:26 -0700 Subject: [PATCH 09/18] add typescript upgrade commit --- packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index 1431ee73caa..b34dc2764e4 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -159,6 +159,7 @@ Finally, this release also features many fixes and updates from external contrib - Keep the interaction modality on window refocus so Safari doesn't show a focus ring - [@daveycodez](https://github.com/daveycodez) - [PR](https://github.com/adobe/react-spectrum/pull/10513) - Apply hook filters in `optimize-locales-plugin` so unused locale strings are removed - [@wojtekmaj](https://github.com/wojtekmaj) - [PR](https://github.com/adobe/react-spectrum/pull/10302) - Improve `setStyle` and focus handling in `usePreventScroll` - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10434) +- Upgrade to TypeScript 7 - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10461) ### Calendar - Allow selecting dates outside the visible range when `isDateUnavailable` is set - [@cycsmail](https://github.com/cycsmail) - [PR](https://github.com/adobe/react-spectrum/pull/10328) ### Checkbox From d641b1fa4d4c6ce84bf1e37652438f796655589d Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 12:18:26 -0700 Subject: [PATCH 10/18] AI Icon --- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 6136770a933..216c3ac55f3 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -32,7 +32,7 @@ We are excited to announce the first preview of React Spectrum AI components to ### AI Icon -The `` icon is now widely available for use and can be imported via: +The new AI icon is now widely available for use and can be imported via: ## Icon size updates From 3cefe3db8e38c43a536cd34bda40120ccb6c8929 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 12:22:24 -0700 Subject: [PATCH 11/18] missing import --- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 216c3ac55f3..e610eb75e22 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -8,6 +8,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag governing permissions and limitations under the License. */} import {InstallCommand} from '../../../src/InstallCommand'; +import {Command} from '../../src/Command'; import {Layout} from '../../../src/Layout'; export default Layout; From 3edc52b4c4561baad43e1e0ac9b04e529e6476a8 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 12:38:05 -0700 Subject: [PATCH 12/18] fix import fr --- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index e610eb75e22..b017d477d5d 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -8,7 +8,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag governing permissions and limitations under the License. */} import {InstallCommand} from '../../../src/InstallCommand'; -import {Command} from '../../src/Command'; +import {Command} from '../../../src/Command'; import {Layout} from '../../../src/Layout'; export default Layout; From 89fd48d016a3fbd17be51b0e560544f9b2315c99 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 15:56:45 -0700 Subject: [PATCH 13/18] minor ai updates --- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index b017d477d5d..6984f2bcfc0 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -27,13 +27,13 @@ export const isSubpage = true; ## AI Components -We are excited to announce the first preview of React Spectrum AI components to help build AI-powered experiences! Today, we are releasing our first batch of components and [documentation](../ai-components.mdx) on how to get started. Give it a try by installing through your preferred package manager! +We are excited to announce the first preview of React Spectrum's AI components to help build AI-powered experiences! Developed in close partnership with Spectrum design, this first batch of components covers the core of a chat interface, along with [documentation](../ai-components.mdx) to help you get started. ### AI Icon -The new AI icon is now widely available for use and can be imported via: +The new AI icon is now widely available and can be imported via: ## Icon size updates @@ -42,12 +42,12 @@ Spectrum has updated the intended size of workflow icons relative to surrounding ## TypeScript -Types are now generated with TypeScript 7 so emitted `.d.ts` output may differ slightly. +Types are now generated with TypeScript 7, so emitted `.d.ts` output may differ slightly. ## Changelog -## General Changes -- Upgrade to TypeScript 7 - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10461 +### General Changes +- Upgrade to TypeScript 7 - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10461) ### ActionBar - Fix the close button icon color so it meets contrast in dark mode - [@reidbarber](https://github.com/reidbarber) - [PR](https://github.com/adobe/react-spectrum/pull/10429) ### Avatar From 250ff763ab148412f168c7fcd49b9866b5d4fb8c Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 17:03:07 -0700 Subject: [PATCH 14/18] Update packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx Co-authored-by: Danni --- packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index b34dc2764e4..49f26a82a82 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -98,7 +98,7 @@ function RoutedNavigationTree(props: { ``` -[Menu](../Menu#asynchronous-loading) also gets a big upgrade this release: it now supports async loading and empty states! Load menu items from an API as needed as the user scrolls with the new `MenuLoadMoreItem` and use `renderEmptyState` to show a indicator when data is loading or when the menu is empty. +[Menu](../Menu#asynchronous-loading) also gets a big upgrade this release: it now supports async loading and empty states! Load menu items from an API as the user scrolls with the new `MenuLoadMoreItem` and use `renderEmptyState` to show a indicator when data is loading or when the menu is empty. ```tsx render hideCode "use client" From 487995b2e8f3bee579c14c5cba328f5d66a935a4 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 17:48:53 -0700 Subject: [PATCH 15/18] review comments --- .../dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx | 4 ---- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 11 +---------- 2 files changed, 1 insertion(+), 14 deletions(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index 49f26a82a82..32486e07a02 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -145,10 +145,6 @@ function AsyncMenuExample() { `TokenFieldValue` now tracks the full selected range instead of a single caret position. The `caretPosition` property is replaced by `selectedRange`, which stores both the anchor and current offsets so a range selection can be restored after an undo or redo. Use `withSelectedRange` to update the selection going forward. -## TypeScript - -Types are now generated with TypeScript 7 so emitted `.d.ts` output may differ slightly. - Finally, this release also features many fixes and updates from external contributors! As always, a big thank you for all the support! ## Changelog diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 6984f2bcfc0..52d3d47d117 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -27,23 +27,14 @@ export const isSubpage = true; ## AI Components -We are excited to announce the first preview of React Spectrum's AI components to help build AI-powered experiences! Developed in close partnership with Spectrum design, this first batch of components covers the core of a chat interface, along with [documentation](../ai-components.mdx) to help you get started. +We are excited to announce the first preview of React Spectrum's AI components to help build AI-powered experiences! Developed in close partnership with Spectrum design, this first batch of components covers the core of a chat interface, along with [documentation](../ai-components) to help you get started. -### AI Icon - -The new AI icon is now widely available and can be imported via: - - ## Icon size updates Spectrum has updated the intended size of workflow icons relative to surrounding text. This is an intentional design update but it does mean icons may render at a different size from before post update. If you rely on visual regression tests, expect diffs around icon sizing and update your baselines accordingly. -## TypeScript - -Types are now generated with TypeScript 7, so emitted `.d.ts` output may differ slightly. - ## Changelog ### General Changes From 8b5248caf4aa244886643cc557b4b48b4041660b Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 17:49:34 -0700 Subject: [PATCH 16/18] small change --- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 52d3d47d117..ebb7d6342ab 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -20,7 +20,7 @@ export const section = 'Releases'; export const tags = ['release', 'S2']; export const date = 'September 1, 2026'; export const title = 'v1.7.0'; -export const description = 'This release makes the AI Icon widely available, refreshes icon sizing to match text line height, and includes several bug fixes'; +export const description = 'This release updates workflow icons, refreshes icon sizing to match text line height, and includes several bug fixes'; export const isSubpage = true; # v1.7.0 From ffa46f2d3f7111b26e1187c7c823fe43709fd054 Mon Sep 17 00:00:00 2001 From: Yihui Liao <44729383+yihuiliao@users.noreply.github.com> Date: Mon, 31 Aug 2026 17:53:37 -0700 Subject: [PATCH 17/18] udpate small description --- packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index ebb7d6342ab..1ea36aeb974 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -20,7 +20,7 @@ export const section = 'Releases'; export const tags = ['release', 'S2']; export const date = 'September 1, 2026'; export const title = 'v1.7.0'; -export const description = 'This release updates workflow icons, refreshes icon sizing to match text line height, and includes several bug fixes'; +export const description = "This release includes a first preview of React Spectrum's new AI Components, updates workflow icons, refreshes icon sizing to match text line height, and includes several bug fixes"; export const isSubpage = true; # v1.7.0 From 69c9e33236171825392e1d1ccf198246dea2be93 Mon Sep 17 00:00:00 2001 From: Devon Govett Date: Tue, 1 Sep 2026 10:35:01 -0400 Subject: [PATCH 18/18] add versions and ai example --- .../pages/react-aria/releases/v1-21-0.mdx | 10 ++- .../dev/s2-docs/pages/s2/releases/v1-7-0.mdx | 66 ++++++++++++++++++- 2 files changed, 73 insertions(+), 3 deletions(-) diff --git a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx index 32486e07a02..9f63e39e00a 100644 --- a/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx +++ b/packages/dev/s2-docs/pages/react-aria/releases/v1-21-0.mdx @@ -192,9 +192,15 @@ Finally, this release also features many fixes and updates from external contrib - Fix IME composition in Firefox - [@chirokas](https://github.com/chirokas) - [PR](https://github.com/adobe/react-spectrum/pull/10422) - Fix TokenField docs regex for IME - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/10474) - ## Released packages ``` -[TODO: paste output of yarn bumpVersions here] + - @internationalized/date@3.12.4 + - @internationalized/number@3.6.8 + - @react-aria/test-utils@1.0.0-rc.1 + - @react-aria/optimize-locales-plugin@2.0.2 + - @react-aria/mcp@1.2.1 + - react-aria@3.52.0 + - react-aria-components@1.21.0 + - react-stately@3.50.0 ``` diff --git a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx index 1ea36aeb974..7d63dac9a32 100644 --- a/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx +++ b/packages/dev/s2-docs/pages/s2/releases/v1-7-0.mdx @@ -29,6 +29,69 @@ export const isSubpage = true; We are excited to announce the first preview of React Spectrum's AI components to help build AI-powered experiences! Developed in close partnership with Spectrum design, this first batch of components covers the core of a chat interface, along with [documentation](../ai-components) to help you get started. +```tsx render hideCode +"use client"; +import {useState} from 'react'; +import { + Attachment, + AttachmentPreview, + AttachFileMenuItem, + InsertMenuButton, + InsertTextMenuItem, + PromptField, + PromptFieldAttachment, + PromptFieldAttachmentList, + PromptFieldSubmitButton, + PromptFieldToolbar, + PromptFieldVoiceButton, + PromptFieldValue, + PromptTokenField +} from '@react-spectrum/ai'; +import {Text} from '@react-spectrum/s2'; +import CommentText from '@react-spectrum/s2/icons/CommentText'; + +function PromptAttachments() { + let [attachments, setAttachments] = useState([ + {id: '0', file: new File([], 'preview.png', {type: 'image/png'}), image: 'https://images.unsplash.com/photo-1705034598432-1694e203cdf3?q=80&w=600&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D'}, + {id: '1', file: new File([], 'notes.txt', {type: 'text/plain'}), image: ''} + ]); + + return ( + + {/*- begin highlight -*/} + + {attachment => ( + + + + )} + + {/*- end highlight -*/} + + + + + + + Summarize image + + +
+ + +
+
+
+ ); +} +``` + +AI components are published as a separate package from `@react-spectrum/s2`. + ## Icon size updates @@ -58,5 +121,6 @@ Spectrum has updated the intended size of workflow icons relative to surrounding ## Released packages ``` -[TODO: paste output of yarn bumpVersions here] + - @react-spectrum/ai@0.3.0 + - @react-spectrum/s2@1.7.0 ```