August 9, 2023 Release

In today's release, the InlineAlert component is going to GA! Explore the options in the React Spectrum InlineAlert docs. Our React Aria Components have new additions including TextArea, FileTrigger, and DropZone. Our date/time components have also had some usability updates, usePress now supports an option to continue propagation, and we improved support for HTML forms across our components.

Thank you to our community for their support and contributions!

New components#

• InlineAlert
  • Please note that this release includes an API change from the pre-release version. The Header component should be replaced with Heading.

Enhancements#

• Support HTML form submit and reset across components - @devongovett - PR
• Export fromDate & fromEpoch and add to docs - @naveen2593kumar - PR
• Support a null date in DatePicker - @ktabors - PR
• Add support for continuePropagation to usePress - @devongovett - PR
• Support a data-attribute to identify a11y false positives - @abitbetterthanyesterday - PR

Fixes#

• Adjust DateField line height to prevent scroll - @snowystinger - PR
• Add aria-hidden and role props to usePopover - @andrewchough - PR
• Persist timezone in TimeField with when used with defaultValue - @ktabors - PR
• Fix calculatePosition types and tests - @snowystinger - PR
• Use document for SSR check in useViewportSize - @marg0l - PR
• Support week manipulation in @internationalized/date with ZonedDateTime - @longzheng - PR
• Fix dragging within nested drag targets - @tflanagan - PR
• Allow custom aria-describedby on checkbox/radio group items - @devongovett - PR
• Export AriaButtonOptions from react-aria and @react-aria/button - @reidbarber - PR
• Fix ComboBox handling tab/enter when custom value is allowed - @BDesta - PR
• Support Heading instead of Header in InlineAlert - @reidbarber - PR
• Update DatePicker to persist a valid TimeField value - @ktabors - PR
• Pass Id into generateId function if it exists in Tabs - @andrewchough - PR
• Update translations for TableView, Menu, Calendar and Dnd - @angmail101 - PR
• Prevent resize infinite loop in TableView when scrollbars are always on - @LFDanLu - PR
• Apply aria-hidden on non HTMLElements - @LFDanLu - PR
• Do not add random prefix to ids during tests in React 18 - @devongovett - PR
• Prevent unexpected column resizer blur when focused via menu - @LFDanLu - PR

Docs#

• Add textValue to complex item examples in TagGroup - @ktabors - PR
• Fix invalid date examples - @ktabors - PR
• Update link in Menu - @yihuiliao - PR
• Update SearchField docs with Spectrum link - @matthewdeutsch - PR
• Fix package data for InlineAlert docs - @reidbarber - PR
• Fix typos in @internationalized examples - @lreis - PR
• Add docs for new HTML Form updates - @devongovett - PR

Under construction#

Fixes to pre-released components are listed below. Please feel free to try them out, and report any issues you encounter.

React Aria Components (Alpha)#

• Expose additional states in React Aria Components - @reidbarber - PR
• Fix keyboard navigation & focus in RadioGroup in Dialog - @mariareedstrom - PR
• Use span for labels in Radio and Checkbox & add RadioContext - @devongovett - PR
• Add missing render props and docs improvements - @reidbarber - PR
• Add support for custom aria-label in DropZone - @yihuiliao - PR
• Add TextArea component - @devongovett - PR
• Export types required to use slots - @hosmelq - PR
• Fix broken links to Collections and Selection pages - @wojtekmaj - PR
• Table column resizing support - @devongovett - PR
• Dropzone & FileTrigger docs - @yihuiliao - PR
• Pass in the correct props for Section in ListBox - @andrewchough - PR

Released packages#

 - @adobe/react-spectrum@3.29.0
 - @internationalized/date@3.4.0
 - @react-aria/accordion@3.0.0-alpha.20
 - @react-aria/actiongroup@3.6.1
 - @react-aria/aria-modal-polyfill@3.7.4
 - @react-aria/autocomplete@3.0.0-alpha.19
 - @react-aria/breadcrumbs@3.5.4
 - @react-aria/button@3.8.1
 - @react-aria/calendar@3.4.1
 - @react-aria/checkbox@3.10.0
 - @react-aria/color@3.0.0-beta.23
 - @react-aria/combobox@3.6.3
 - @react-aria/datepicker@3.6.0
 - @react-aria/dialog@3.5.4
 - @react-aria/dnd@3.4.0
 - @react-aria/focus@3.14.0
 - @react-aria/grid@3.8.1
 - @react-aria/gridlist@3.5.1
 - @react-aria/i18n@3.8.1
 - @react-aria/interactions@3.17.0
 - @react-aria/label@3.6.1
 - @react-aria/landmark@3.0.0-beta.3
 - @react-aria/link@3.5.3
 - @react-aria/listbox@3.10.1
 - @react-aria/menu@3.10.1
 - @react-aria/meter@3.4.4
 - @react-aria/numberfield@3.7.0
 - @react-aria/overlays@3.16.0
 - @react-aria/progress@3.4.4
 - @react-aria/radio@3.7.0
 - @react-aria/searchfield@3.5.4
 - @react-aria/select@3.12.0
 - @react-aria/selection@3.16.1
 - @react-aria/separator@3.3.4
 - @react-aria/slider@3.6.0
 - @react-aria/spinbutton@3.5.1
 - @react-aria/ssr@3.7.1
 - @react-aria/switch@3.5.3
 - @react-aria/table@3.11.0
 - @react-aria/tabs@3.6.2
 - @react-aria/tag@3.1.1
 - @react-aria/textfield@3.11.0
 - @react-aria/toast@3.0.0-beta.3
 - @react-aria/toggle@3.7.0
 - @react-aria/tooltip@3.6.1
 - @react-aria/utils@3.19.0
 - @react-aria/virtualizer@3.9.1
 - @react-aria/visually-hidden@3.8.3
 - @react-spectrum/accordion@3.0.0-alpha.22
 - @react-spectrum/actionbar@3.1.1
 - @react-spectrum/actiongroup@3.9.1
 - @react-spectrum/autocomplete@3.0.0-alpha.20
 - @react-spectrum/avatar@3.0.3
 - @react-spectrum/badge@3.1.4
 - @react-spectrum/breadcrumbs@3.8.1
 - @react-spectrum/button@3.12.4
 - @react-spectrum/buttongroup@3.6.4
 - @react-spectrum/calendar@3.3.1
 - @react-spectrum/card@3.0.0-alpha.21
 - @react-spectrum/checkbox@3.7.4
 - @react-spectrum/color@3.0.0-beta.24
 - @react-spectrum/combobox@3.10.0
 - @react-spectrum/contextualhelp@3.6.1
 - @react-spectrum/datepicker@3.7.0
 - @react-spectrum/dialog@3.8.1
 - @react-spectrum/divider@3.5.4
 - @react-spectrum/dnd@3.3.1
 - @react-spectrum/form@3.6.4
 - @react-spectrum/icon@3.7.4
 - @react-spectrum/illustratedmessage@3.4.4
 - @react-spectrum/image@3.4.4
 - @react-spectrum/inlinealert@3.0.0
 - @react-spectrum/label@3.13.1
 - @react-spectrum/labeledvalue@3.1.4
 - @react-spectrum/layout@3.5.4
 - @react-spectrum/link@3.5.4
 - @react-spectrum/list@3.6.1
 - @react-spectrum/listbox@3.11.1
 - @react-spectrum/menu@3.13.0
 - @react-spectrum/meter@3.4.4
 - @react-spectrum/numberfield@3.7.0
 - @react-spectrum/overlays@5.3.0
 - @react-spectrum/picker@3.11.1
 - @react-spectrum/progress@3.6.1
 - @react-spectrum/provider@3.8.1
 - @react-spectrum/radio@3.5.4
 - @react-spectrum/searchfield@3.7.4
 - @react-spectrum/slider@3.6.0
 - @react-spectrum/statuslight@3.5.4
 - @react-spectrum/switch@3.4.4
 - @react-spectrum/table@3.11.0
 - @react-spectrum/tabs@3.7.1
 - @react-spectrum/tag@3.1.1
 - @react-spectrum/text@3.4.4
 - @react-spectrum/textfield@3.10.4
 - @react-spectrum/theme-dark@3.5.4
 - @react-spectrum/theme-default@3.5.4
 - @react-spectrum/theme-express@3.0.0-alpha.6
 - @react-spectrum/theme-light@3.4.4
 - @react-spectrum/toast@3.0.0-beta.3
 - @react-spectrum/tooltip@3.5.3
 - @react-spectrum/utils@3.10.1
 - @react-spectrum/view@3.6.1
 - @react-spectrum/well@3.4.4
 - @react-stately/calendar@3.3.1
 - @react-stately/checkbox@3.4.4
 - @react-stately/collections@3.10.0
 - @react-stately/color@3.4.1
 - @react-stately/combobox@3.6.0
 - @react-stately/data@3.10.1
 - @react-stately/datepicker@3.6.0
 - @react-stately/dnd@3.2.3
 - @react-stately/flags@3.0.0
 - @react-stately/grid@3.8.0
 - @react-stately/layout@3.13.0
 - @react-stately/list@3.9.1
 - @react-stately/menu@3.5.4
 - @react-stately/numberfield@3.6.0
 - @react-stately/overlays@3.6.1
 - @react-stately/radio@3.8.3
 - @react-stately/searchfield@3.4.4
 - @react-stately/select@3.5.3
 - @react-stately/selection@3.13.3
 - @react-stately/slider@3.4.1
 - @react-stately/table@3.11.0
 - @react-stately/tabs@3.5.1
 - @react-stately/toggle@3.6.1
 - @react-stately/tooltip@3.4.3
 - @react-stately/tree@3.7.1
 - @react-stately/virtualizer@3.6.1
 - @react-types/accordion@3.0.0-alpha.15
 - @react-types/actionbar@3.1.1
 - @react-types/actiongroup@3.4.3
 - @react-types/autocomplete@3.0.0-alpha.15
 - @react-types/avatar@3.0.1
 - @react-types/badge@3.1.3
 - @react-types/breadcrumbs@3.6.1
 - @react-types/button@3.7.4
 - @react-types/buttongroup@3.3.3
 - @react-types/calendar@3.3.1
 - @react-types/card@3.0.0-alpha.17
 - @react-types/checkbox@3.5.0
 - @react-types/color@3.0.0-beta.18
 - @react-types/combobox@3.7.0
 - @react-types/contextualhelp@3.2.4
 - @react-types/datepicker@3.5.0
 - @react-types/dialog@3.5.4
 - @react-types/divider@3.3.3
 - @react-types/form@3.5.2
 - @react-types/grid@3.2.0
 - @react-types/illustratedmessage@3.3.3
 - @react-types/image@3.3.3
 - @react-types/label@3.7.5
 - @react-types/layout@3.3.9
 - @react-types/link@3.4.4
 - @react-types/list@3.2.5
 - @react-types/listbox@3.4.3
 - @react-types/menu@3.9.3
 - @react-types/meter@3.3.3
 - @react-types/numberfield@3.5.0
 - @react-types/overlays@3.8.1
 - @react-types/progress@3.4.2
 - @react-types/provider@3.6.3
 - @react-types/radio@3.5.0
 - @react-types/searchfield@3.4.3
 - @react-types/select@3.8.2
 - @react-types/shared@3.19.0
 - @react-types/slider@3.6.0
 - @react-types/statuslight@3.3.3
 - @react-types/switch@3.4.0
 - @react-types/table@3.8.0
 - @react-types/tabs@3.3.1
 - @react-types/text@3.3.3
 - @react-types/textfield@3.7.3
 - @react-types/tooltip@3.4.3
 - @react-types/view@3.4.3
 - @react-types/well@3.3.3
 - @spectrum-icons/color@3.5.4
 - @spectrum-icons/express@3.0.0-alpha.8
 - @spectrum-icons/illustrations@3.6.4
 - @spectrum-icons/ui@3.5.4
 - @spectrum-icons/workflow@4.2.3
 - react-aria@3.27.0
 - react-aria-components@1.0.0-alpha.6
 - react-stately@3.25.0