chore: may release notes#10124
Open
yihuiliao wants to merge 6 commits into
Open
Conversation
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
## API Changes
@react-spectrum/calendar/@react-spectrum/calendar:Calendar Calendar <T extends DateValue> {
UNSAFE_className?: string
UNSAFE_style?: CSSProperties
alignSelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'center' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'stretch'>
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean = false
bottom?: Responsive<DimensionValue>
createCalendar?: (CalendarIdentifier) => Calendar
defaultFocusedValue?: DateValue | null
defaultValue?: CalendarValueType<DateValue | null, CalendarSelectionMode>
end?: Responsive<DimensionValue>
errorMessage?: ReactNode
firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
flex?: Responsive<string | number | boolean>
flexBasis?: Responsive<number | string>
flexGrow?: Responsive<number>
flexShrink?: Responsive<number>
focusedValue?: DateValue | null
gridArea?: Responsive<string>
gridColumn?: Responsive<string>
gridColumnEnd?: Responsive<string>
gridColumnStart?: Responsive<string>
gridRow?: Responsive<string>
gridRowEnd?: Responsive<string>
gridRowStart?: Responsive<string>
height?: Responsive<DimensionValue>
id?: string
isDateUnavailable?: (DateValue) => boolean
isDisabled?: boolean = false
isHidden?: Responsive<boolean>
isInvalid?: boolean
isReadOnly?: boolean = false
justifySelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'center' | 'left' | 'right' | 'stretch'>
left?: Responsive<DimensionValue>
margin?: Responsive<DimensionValue>
marginBottom?: Responsive<DimensionValue>
marginEnd?: Responsive<DimensionValue>
marginStart?: Responsive<DimensionValue>
marginTop?: Responsive<DimensionValue>
marginX?: Responsive<DimensionValue>
marginY?: Responsive<DimensionValue>
maxHeight?: Responsive<DimensionValue>
maxValue?: DateValue | null
maxWidth?: Responsive<DimensionValue>
minHeight?: Responsive<DimensionValue>
minValue?: DateValue | null
minWidth?: Responsive<DimensionValue>
onChange?: (CalendarValueType<MappedDateValue<DateValue>, CalendarSelectionMode>) => void
onFocusChange?: (CalendarDate) => void
order?: Responsive<number>
pageBehavior?: PageBehavior = visible
position?: Responsive<'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'>
right?: Responsive<DimensionValue>
selectionAlignment?: 'start' | 'center' | 'end' = 'center'
+ selectionMode?: CalendarSelectionMode = 'single'
start?: Responsive<DimensionValue>
top?: Responsive<DimensionValue>
value?: CalendarValueType<DateValue | null, CalendarSelectionMode>
visibleMonths?: number = 1
+ weeksInMonth?: number
width?: Responsive<DimensionValue>
zIndex?: Responsive<number>
}/@react-spectrum/calendar:RangeCalendar RangeCalendar <T extends DateValue> {
UNSAFE_className?: string
UNSAFE_style?: CSSProperties
alignSelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'center' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'stretch'>
allowsNonContiguousRanges?: boolean
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean = false
bottom?: Responsive<DimensionValue>
commitBehavior?: 'clear' | 'reset' | 'select' = 'select'
createCalendar?: (CalendarIdentifier) => Calendar
defaultFocusedValue?: DateValue | null
defaultValue?: RangeValue<DateValue> | null
end?: Responsive<DimensionValue>
errorMessage?: ReactNode
firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
flex?: Responsive<string | number | boolean>
flexBasis?: Responsive<number | string>
flexGrow?: Responsive<number>
flexShrink?: Responsive<number>
focusedValue?: DateValue | null
gridArea?: Responsive<string>
gridColumn?: Responsive<string>
gridColumnEnd?: Responsive<string>
gridColumnStart?: Responsive<string>
gridRow?: Responsive<string>
gridRowEnd?: Responsive<string>
gridRowStart?: Responsive<string>
height?: Responsive<DimensionValue>
id?: string
isDateUnavailable?: (DateValue, CalendarDate | null) => boolean
isDisabled?: boolean = false
isHidden?: Responsive<boolean>
isInvalid?: boolean
isReadOnly?: boolean = false
justifySelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'center' | 'left' | 'right' | 'stretch'>
left?: Responsive<DimensionValue>
margin?: Responsive<DimensionValue>
marginBottom?: Responsive<DimensionValue>
marginEnd?: Responsive<DimensionValue>
marginStart?: Responsive<DimensionValue>
marginTop?: Responsive<DimensionValue>
marginX?: Responsive<DimensionValue>
marginY?: Responsive<DimensionValue>
maxHeight?: Responsive<DimensionValue>
maxValue?: DateValue | null
maxWidth?: Responsive<DimensionValue>
minHeight?: Responsive<DimensionValue>
minValue?: DateValue | null
minWidth?: Responsive<DimensionValue>
onChange?: (RangeValue<MappedDateValue<DateValue>>) => void
onFocusChange?: (CalendarDate) => void
order?: Responsive<number>
pageBehavior?: PageBehavior = visible
position?: Responsive<'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'>
right?: Responsive<DimensionValue>
selectionAlignment?: 'start' | 'center' | 'end' = 'center'
start?: Responsive<DimensionValue>
top?: Responsive<DimensionValue>
value?: RangeValue<DateValue> | null
visibleMonths?: number = 1
+ weeksInMonth?: number
width?: Responsive<DimensionValue>
zIndex?: Responsive<number>
}/@react-spectrum/calendar:SpectrumCalendarProps SpectrumCalendarProps <T extends DateValue> {
UNSAFE_className?: string
UNSAFE_style?: CSSProperties
alignSelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'center' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'stretch'>
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean = false
bottom?: Responsive<DimensionValue>
createCalendar?: (CalendarIdentifier) => Calendar
defaultFocusedValue?: DateValue | null
defaultValue?: CalendarValueType<DateValue | null, CalendarSelectionMode>
end?: Responsive<DimensionValue>
errorMessage?: ReactNode
firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
flex?: Responsive<string | number | boolean>
flexBasis?: Responsive<number | string>
flexGrow?: Responsive<number>
flexShrink?: Responsive<number>
focusedValue?: DateValue | null
gridArea?: Responsive<string>
gridColumn?: Responsive<string>
gridColumnEnd?: Responsive<string>
gridColumnStart?: Responsive<string>
gridRow?: Responsive<string>
gridRowEnd?: Responsive<string>
gridRowStart?: Responsive<string>
height?: Responsive<DimensionValue>
id?: string
isDateUnavailable?: (DateValue) => boolean
isDisabled?: boolean = false
isHidden?: Responsive<boolean>
isInvalid?: boolean
isReadOnly?: boolean = false
justifySelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'center' | 'left' | 'right' | 'stretch'>
left?: Responsive<DimensionValue>
margin?: Responsive<DimensionValue>
marginBottom?: Responsive<DimensionValue>
marginEnd?: Responsive<DimensionValue>
marginStart?: Responsive<DimensionValue>
marginTop?: Responsive<DimensionValue>
marginX?: Responsive<DimensionValue>
marginY?: Responsive<DimensionValue>
maxHeight?: Responsive<DimensionValue>
maxValue?: DateValue | null
maxWidth?: Responsive<DimensionValue>
minHeight?: Responsive<DimensionValue>
minValue?: DateValue | null
minWidth?: Responsive<DimensionValue>
onChange?: (CalendarValueType<MappedDateValue<DateValue>, CalendarSelectionMode>) => void
onFocusChange?: (CalendarDate) => void
order?: Responsive<number>
pageBehavior?: PageBehavior = visible
position?: Responsive<'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'>
right?: Responsive<DimensionValue>
selectionAlignment?: 'start' | 'center' | 'end' = 'center'
+ selectionMode?: CalendarSelectionMode = 'single'
start?: Responsive<DimensionValue>
top?: Responsive<DimensionValue>
value?: CalendarValueType<DateValue | null, CalendarSelectionMode>
visibleMonths?: number = 1
+ weeksInMonth?: number
width?: Responsive<DimensionValue>
zIndex?: Responsive<number>
}/@react-spectrum/calendar:SpectrumRangeCalendarProps SpectrumRangeCalendarProps <T extends DateValue> {
UNSAFE_className?: string
UNSAFE_style?: CSSProperties
alignSelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'center' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'stretch'>
allowsNonContiguousRanges?: boolean
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean = false
bottom?: Responsive<DimensionValue>
commitBehavior?: 'clear' | 'reset' | 'select' = 'select'
createCalendar?: (CalendarIdentifier) => Calendar
defaultFocusedValue?: DateValue | null
defaultValue?: RangeValue<DateValue> | null
end?: Responsive<DimensionValue>
errorMessage?: ReactNode
firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
flex?: Responsive<string | number | boolean>
flexBasis?: Responsive<number | string>
flexGrow?: Responsive<number>
flexShrink?: Responsive<number>
focusedValue?: DateValue | null
gridArea?: Responsive<string>
gridColumn?: Responsive<string>
gridColumnEnd?: Responsive<string>
gridColumnStart?: Responsive<string>
gridRow?: Responsive<string>
gridRowEnd?: Responsive<string>
gridRowStart?: Responsive<string>
height?: Responsive<DimensionValue>
id?: string
isDateUnavailable?: (DateValue, CalendarDate | null) => boolean
isDisabled?: boolean = false
isHidden?: Responsive<boolean>
isInvalid?: boolean
isReadOnly?: boolean = false
justifySelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'center' | 'left' | 'right' | 'stretch'>
left?: Responsive<DimensionValue>
margin?: Responsive<DimensionValue>
marginBottom?: Responsive<DimensionValue>
marginEnd?: Responsive<DimensionValue>
marginStart?: Responsive<DimensionValue>
marginTop?: Responsive<DimensionValue>
marginX?: Responsive<DimensionValue>
marginY?: Responsive<DimensionValue>
maxHeight?: Responsive<DimensionValue>
maxValue?: DateValue | null
maxWidth?: Responsive<DimensionValue>
minHeight?: Responsive<DimensionValue>
minValue?: DateValue | null
minWidth?: Responsive<DimensionValue>
onChange?: (RangeValue<MappedDateValue<DateValue>>) => void
onFocusChange?: (CalendarDate) => void
order?: Responsive<number>
pageBehavior?: PageBehavior = visible
position?: Responsive<'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'>
right?: Responsive<DimensionValue>
selectionAlignment?: 'start' | 'center' | 'end' = 'center'
start?: Responsive<DimensionValue>
top?: Responsive<DimensionValue>
value?: RangeValue<DateValue> | null
visibleMonths?: number = 1
+ weeksInMonth?: number
width?: Responsive<DimensionValue>
zIndex?: Responsive<number>
} |
Agent Skills ChangesModified (12)
InstallReact Spectrum S2: React Aria: |
| - Fix virtualized Table loader width not updating when the table width changes - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/9961) | ||
| - Add `state` to `RowRenderProps` - [@yihuiliao](https://github.com/yihuiliao) - [PR](https://github.com/adobe/react-spectrum/pull/9883) | ||
| ### Tabs | ||
| - Support CSS logical properties (e.g. `block-size`, 'inline-size`) for TabPanel animations - [@SupaSeeka](https://github.com/SupaSeeka) - [PR](https://github.com/adobe/react-spectrum/pull/9951) |
Member
There was a problem hiding this comment.
Suggested change
| - Support CSS logical properties (e.g. `block-size`, 'inline-size`) for TabPanel animations - [@SupaSeeka](https://github.com/SupaSeeka) - [PR](https://github.com/adobe/react-spectrum/pull/9951) | |
| - Support CSS logical properties (e.g. `block-size`, `inline-size`) for TabPanel animations - [@SupaSeeka](https://github.com/SupaSeeka) - [PR](https://github.com/adobe/react-spectrum/pull/9951) |
| - Add `pressScale` prop documentation - [@reidbarber](https://github.com/reidbarber) - [PR](https://github.com/adobe/react-spectrum/pull/9940) | ||
| - Agent skill improvements - [@reidbarber](https://github.com/reidbarber) - [PR](https://github.com/adobe/react-spectrum/pull/9939), [PR](https://github.com/adobe/react-spectrum/pull/10083) | ||
| ### Button | ||
| - Update Button color to improve contrast when static - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10069) |
Member
There was a problem hiding this comment.
Suggested change
| - Update Button color to improve contrast when static - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10069) | |
| - Update Button text color to improve contrast when static - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10069) |
Comment on lines
+71
to
+72
| ### Slider | ||
| - Add `SliderFill` component with built-in styles for rendering a filled track, and improve default `SliderOutput` value formatting - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10021) |
Member
There was a problem hiding this comment.
Suggested change
| ### Slider | |
| - Add `SliderFill` component with built-in styles for rendering a filled track, and improve default `SliderOutput` value formatting - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/10021) |
Member
There was a problem hiding this comment.
at the very least, SliderFill is irrelevant to s2
devongovett
reviewed
May 28, 2026
|
|
||
| # v1.18.0 | ||
|
|
||
| This release packs in several new features! [Calendar](../Calendar) now supports multiple date selection, as well as new [CalendarHeading](../Calendar#calendarheading), [CalendarMonthPicker](../Calendar#month-and-year-pickers), and [CalendarYearPicker](../Calendar#month-and-year-pickers) components that allow you to customize how the user can jump to a different month or year. We have also added a [TableFooter](../Table#content) component to support footers in Table, and a [SliderFill](../Slider#sliderfill) component that simplifies the process of styling the fill portion in a Slider. |
Member
There was a problem hiding this comment.
Suggested change
| This release packs in several new features! [Calendar](../Calendar) now supports multiple date selection, as well as new [CalendarHeading](../Calendar#calendarheading), [CalendarMonthPicker](../Calendar#month-and-year-pickers), and [CalendarYearPicker](../Calendar#month-and-year-pickers) components that allow you to customize how the user can jump to a different month or year. We have also added a [TableFooter](../Table#content) component to support footers in Table, and a [SliderFill](../Slider#sliderfill) component that simplifies the process of styling the fill portion in a Slider. | |
| This release packs in several new features! [Calendar](../Calendar) now supports multiple date selection, as well as new [CalendarHeading](../Calendar#calendarheading), [CalendarMonthPicker](../Calendar#month-and-year-pickers), and [CalendarYearPicker](../Calendar#month-and-year-pickers) components that allow the user to jump to a different month or year. [RangeCalendar](../RangeCalendar#validation) now supports determining the available dates based on the first date a user selects. We have also added a [TableFooter](../Table#content) component, and a [SliderFill](../Slider#value-scale) component that simplifies the process of styling the fill portion in a Slider. |
Member
There was a problem hiding this comment.
I know it's in its own section below but do you think we should list the checkbox/radio/switch update in the overall summary too?
|
|
||
| # v1.4.0 | ||
|
|
||
| This release brings long awaited [drag and drop support](../dnd) to [ListView](../ListView#drag-and-drop), [TableView](../TableView#drag-and-drop), and [TreeView](../TreeView#drag-and-drop)! TableView now also supports [highlight selection](../TableView) and a new [TableFooter](../TableView#content) component for footer support. Form components such as [ComboBox](../ComboBox#content) and [TextField](../TextField#prefix) now allow custom prefixes, and the new [LabeledValue](../LabeledValue) can be used to display read-only label/value pairs. In addition, description and error messages can be configured for [Checkbox](../Checkbox#forms), [Radio](../RadioGroup), and [Switch](../Switch#forms) as well. Last but not least, [Calendar](../Calendar) now supports multiple date selection. |
Member
There was a problem hiding this comment.
Suggested change
| This release brings long awaited [drag and drop support](../dnd) to [ListView](../ListView#drag-and-drop), [TableView](../TableView#drag-and-drop), and [TreeView](../TreeView#drag-and-drop)! TableView now also supports [highlight selection](../TableView) and a new [TableFooter](../TableView#content) component for footer support. Form components such as [ComboBox](../ComboBox#content) and [TextField](../TextField#prefix) now allow custom prefixes, and the new [LabeledValue](../LabeledValue) can be used to display read-only label/value pairs. In addition, description and error messages can be configured for [Checkbox](../Checkbox#forms), [Radio](../RadioGroup), and [Switch](../Switch#forms) as well. Last but not least, [Calendar](../Calendar) now supports multiple date selection. | |
| This release brings long awaited [drag and drop support](../dnd) to [ListView](../ListView#drag-and-drop), [TableView](../TableView#drag-and-drop), and [TreeView](../TreeView#drag-and-drop)! TableView now also supports [highlight selection](../TableView) and a new [TableFooter](../TableView#content) component. Form components such as [ComboBox](../ComboBox#content) and [TextField](../TextField#prefix) now allow custom prefixes, and the new [LabeledValue](../LabeledValue) can be used to display read-only label/value pairs. In addition, description and error messages can be configured for [Checkbox](../Checkbox#forms), [Radio](../RadioGroup), and [Switch](../Switch#forms). Last but not least, [Calendar](../Calendar) now supports multiple date selection. |
| ### Button | ||
| - Update Button color to improve contrast when static - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/10069) | ||
| ### Calendar | ||
| - Add support for `selectionMode="multiple" in Calendar - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/9948) |
Member
There was a problem hiding this comment.
Suggested change
| - Add support for `selectionMode="multiple" in Calendar - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/9948) | |
| - Add support for `selectionMode="multiple"` in Calendar - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/9948) |
| export const tags = ['release', 'React Aria']; | ||
| export const date = 'May 26, 2026'; | ||
| export const title = 'v1.18.0'; | ||
| export const description = ''; |
| export const tags = ['release', 'S2']; | ||
| export const date = 'May 26, 2026'; | ||
| export const title = 'v1.4.0'; | ||
| export const description = ''; |
| export const hideNav = true; | ||
| export const section = 'Releases'; | ||
| export const tags = ['release', 'React Aria']; | ||
| export const date = 'May 26, 2026'; |
Member
There was a problem hiding this comment.
Suggested change
| export const date = 'May 26, 2026'; | |
| export const date = 'May 28, 2026'; |
| export const hideNav = true; | ||
| export const section = 'Releases'; | ||
| export const tags = ['release', 'S2']; | ||
| export const date = 'May 26, 2026'; |
Member
There was a problem hiding this comment.
Suggested change
| export const date = 'May 26, 2026'; | |
| export const date = 'May 28, 2026'; |
| ## Released packages | ||
|
|
||
| ``` | ||
| [TODO: paste output of yarn bumpVersions here] |
Member
There was a problem hiding this comment.
I guess we usually don't have this section for s2.
| ## Released packages | ||
|
|
||
| ``` | ||
| [TODO: paste output of yarn bumpVersions here] |
Member
There was a problem hiding this comment.
Suggested change
| [TODO: paste output of yarn bumpVersions here] | |
| - @internationalized/date => 3.12.2 | |
| - @internationalized/message => 3.1.10 | |
| - @internationalized/number => 3.6.7 | |
| - @internationalized/string-compiler => 3.4.1 | |
| - @internationalized/string => 3.2.9 | |
| - @react-aria/test-utils => 1.0.0-rc.0 | |
| - @react-types/shared => 3.35.0 | |
| - @react-aria/optimize-locales-plugin => 1.2.1 | |
| - @react-aria/parcel-resolver-optimize-locales => 1.3.1 | |
| - @react-aria/mcp => 1.2.0 | |
| - react-aria => 3.49.0 | |
| - react-aria-components => 1.18.0 | |
| - react-stately => 3.47.0 | |
| - tailwindcss-react-aria-components => 2.1.1 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes
✅ Pull Request Checklist:
📝 Test Instructions:
🧢 Your Project: