fix: patch additional methods so React doesnt break with template elements #9385
+45
−0
Conversation
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
|
Build successful! 🎉 |
snowystinger
previously approved these changes
Dec 21, 2025
Member
|
Is a test possible for this one? |
Member
Author
|
I tried to make one but couldn't get it to fail in the SSR tests without the change unfortunately |
reidbarber
reviewed
Dec 22, 2025
Member
reidbarber
left a comment
reidbarber
left a comment
There was a problem hiding this comment.
I still see the issue if I navigate to another page first, then the Picker page. Doesn't happen when just loading the Picker page first though.
Member
Author
|
oh thats bizzare, didn't expect that flow to break, I'll dig |
|
Build successful! 🎉 |
## API Changes
react-aria-components/react-aria-components:Link Link {
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean
children?: ChildrenOrFunction<LinkRenderProps>
className?: ClassNameOrFunction<LinkRenderProps> = 'react-aria-Link'
download?: boolean | string
href?: Href
hrefLang?: string
- id?: string
isDisabled?: boolean
onBlur?: (FocusEvent<Target>) => void
onClick?: (MouseEvent<FocusableElement>) => void
onFocus?: (FocusEvent<Target>) => void
onHoverChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
slot?: string | null
style?: StyleOrFunction<LinkRenderProps>
target?: HTMLAttributeAnchorTarget
}/react-aria-components:Menu Menu <T extends {}> {
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean | FocusStrategy
children?: ReactNode | ({}) => ReactNode
className?: ClassNameOrFunction<MenuRenderProps> = 'react-aria-Menu'
defaultSelectedKeys?: 'all' | Iterable<Key>
dependencies?: ReadonlyArray<any>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
id?: string
items?: Iterable<T>
onAction?: (Key) => void
onClose?: () => void
onSelectionChange?: (Selection) => void
renderEmptyState?: () => ReactNode
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
shouldFocusWrap?: boolean
slot?: string | null
style?: StyleOrFunction<MenuRenderProps>
}/react-aria-components:MenuItem MenuItem <T extends {}> {
aria-label?: string
children?: ChildrenOrFunction<MenuItemRenderProps>
className?: ClassNameOrFunction<MenuItemRenderProps> = 'react-aria-MenuItem'
download?: boolean | string
href?: Href
hrefLang?: string
id?: Key
isDisabled?: boolean
onAction?: () => void
onClick?: (MouseEvent<FocusableElement>) => void
onHoverChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
- shouldCloseOnSelect?: boolean
style?: StyleOrFunction<MenuItemRenderProps>
target?: HTMLAttributeAnchorTarget
textValue?: string
value?: {}/react-aria-components:MenuSection MenuSection <T extends {}> {
aria-label?: string
children?: ReactNode | ({}) => ReactElement
className?: string = 'react-aria-MenuSection'
defaultSelectedKeys?: 'all' | Iterable<Key>
dependencies?: ReadonlyArray<any>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
id?: Key
items?: Iterable<{}>
onSelectionChange?: (Selection) => void
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
style?: CSSProperties
value?: {}
}/react-aria-components:RadioGroup RadioGroup {
aria-describedby?: string
aria-details?: string
aria-errormessage?: string
aria-label?: string
aria-labelledby?: string
children?: ChildrenOrFunction<RadioGroupRenderProps>
className?: ClassNameOrFunction<RadioGroupRenderProps> = 'react-aria-RadioGroup'
defaultValue?: string | null
form?: string
id?: string
isDisabled?: boolean
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
name?: string
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
orientation?: Orientation = 'vertical'
slot?: string | null
style?: StyleOrFunction<RadioGroupRenderProps>
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'native' | 'aria' = 'native'
value?: string | null
}/react-aria-components:TabPanels TabPanels <T extends {}> {
- children?: ReactNode | (T) => ReactNode
+ children?: ReactNode | ({}) => ReactNode
className?: string = 'react-aria-TabPanels'
dependencies?: ReadonlyArray<any>
- items?: Iterable<T>
+ disabledKeys?: Iterable<Key>
+ items?: Iterable<{}>
style?: CSSProperties
}/react-aria-components:ColorFieldRenderProps ColorFieldRenderProps {
channel: ColorChannel | 'hex'
isDisabled: boolean
isInvalid: boolean
- isReadOnly: boolean
- isRequired: boolean
state: ColorFieldState
}/react-aria-components:LinkProps LinkProps {
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean
children?: ChildrenOrFunction<LinkRenderProps>
className?: ClassNameOrFunction<LinkRenderProps> = 'react-aria-Link'
download?: boolean | string
href?: Href
hrefLang?: string
- id?: string
isDisabled?: boolean
onBlur?: (FocusEvent<Target>) => void
onClick?: (MouseEvent<FocusableElement>) => void
onFocus?: (FocusEvent<Target>) => void
onHoverChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
slot?: string | null
style?: StyleOrFunction<LinkRenderProps>
target?: HTMLAttributeAnchorTarget
}/react-aria-components:MenuProps MenuProps <T> {
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean | FocusStrategy
children?: ReactNode | (T) => ReactNode
className?: ClassNameOrFunction<MenuRenderProps> = 'react-aria-Menu'
defaultSelectedKeys?: 'all' | Iterable<Key>
dependencies?: ReadonlyArray<any>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
id?: string
items?: Iterable<T>
onAction?: (Key) => void
onClose?: () => void
onSelectionChange?: (Selection) => void
renderEmptyState?: () => ReactNode
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
shouldFocusWrap?: boolean
slot?: string | null
style?: StyleOrFunction<MenuRenderProps>
}/react-aria-components:MenuItemProps MenuItemProps <T = {}> {
aria-label?: string
children?: ChildrenOrFunction<MenuItemRenderProps>
className?: ClassNameOrFunction<MenuItemRenderProps> = 'react-aria-MenuItem'
download?: boolean | string
href?: Href
hrefLang?: string
id?: Key
isDisabled?: boolean
onAction?: () => void
onClick?: (MouseEvent<FocusableElement>) => void
onHoverChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
- shouldCloseOnSelect?: boolean
style?: StyleOrFunction<MenuItemRenderProps>
target?: HTMLAttributeAnchorTarget
textValue?: string
value?: T/react-aria-components:MenuSectionProps MenuSectionProps <T> {
aria-label?: string
children?: ReactNode | (T) => ReactElement
className?: string = 'react-aria-MenuSection'
defaultSelectedKeys?: 'all' | Iterable<Key>
dependencies?: ReadonlyArray<any>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
id?: Key
items?: Iterable<T>
onSelectionChange?: (Selection) => void
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
style?: CSSProperties
value?: T
}/react-aria-components:RadioGroupProps RadioGroupProps {
aria-describedby?: string
aria-details?: string
aria-errormessage?: string
aria-label?: string
aria-labelledby?: string
children?: ChildrenOrFunction<RadioGroupRenderProps>
className?: ClassNameOrFunction<RadioGroupRenderProps> = 'react-aria-RadioGroup'
defaultValue?: string | null
form?: string
id?: string
isDisabled?: boolean
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
name?: string
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
orientation?: Orientation = 'vertical'
slot?: string | null
style?: StyleOrFunction<RadioGroupRenderProps>
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'native' | 'aria' = 'native'
value?: string | null
}/react-aria-components:TabPanelsProps TabPanelsProps <T> {
children?: ReactNode | (T) => ReactNode
className?: string = 'react-aria-TabPanels'
dependencies?: ReadonlyArray<any>
+ disabledKeys?: Iterable<Key>
items?: Iterable<T>
style?: CSSProperties
}@react-aria/menu/@react-aria/menu:AriaMenuItemProps AriaMenuItemProps {
aria-controls?: string
aria-expanded?: boolean | 'true' | 'false'
aria-haspopup?: 'menu' | 'dialog'
aria-label?: string
+ closeOnSelect?: boolean = true
id?: string
isVirtualized?: boolean
key: Key
onBlur?: (FocusEvent<Target>) => void
onClick?: (MouseEvent<FocusableElement>) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
onHoverChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
selectionManager?: SelectionManager
- shouldCloseOnSelect?: boolean
}@react-aria/radio/@react-aria/radio:AriaRadioGroupProps AriaRadioGroupProps {
aria-describedby?: string
aria-details?: string
aria-errormessage?: string
aria-label?: string
aria-labelledby?: string
defaultValue?: string | null
description?: ReactNode
errorMessage?: ReactNode | (ValidationResult) => ReactNode
form?: string
id?: string
isDisabled?: boolean
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
label?: ReactNode
name?: string
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
orientation?: Orientation = 'vertical'
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'aria' | 'native' = 'aria'
value?: string | null
}@react-aria/utils/@react-aria/utils:useEffectEvent useEffectEvent <T extends Function> {
- fn: T
+ fn?: T
returnVal: undefined
}@react-spectrum/radio/@react-spectrum/radio:RadioGroup RadioGroup {
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-errormessage?: string
aria-label?: string
aria-labelledby?: string
bottom?: Responsive<DimensionValue>
children: ReactElement<RadioProps> | Array<ReactElement<RadioProps>>
contextualHelp?: ReactNode
defaultValue?: string | null
description?: ReactNode
end?: Responsive<DimensionValue>
errorMessage?: ReactNode | (ValidationResult) => ReactNode
flex?: Responsive<string | number | boolean>
flexBasis?: Responsive<number | string>
flexGrow?: Responsive<number>
flexShrink?: Responsive<number>
form?: string
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
isDisabled?: boolean
isEmphasized?: boolean
isHidden?: Responsive<boolean>
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
justifySelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'center' | 'left' | 'right' | 'stretch'>
label?: ReactNode
labelAlign?: Alignment = 'start'
labelPosition?: LabelPosition = 'top'
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>
maxWidth?: Responsive<DimensionValue>
minHeight?: Responsive<DimensionValue>
minWidth?: Responsive<DimensionValue>
name?: string
necessityIndicator?: NecessityIndicator = 'icon'
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
order?: Responsive<number>
orientation?: Orientation = 'vertical'
position?: Responsive<'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'>
right?: Responsive<DimensionValue>
showErrorIcon?: boolean
start?: Responsive<DimensionValue>
top?: Responsive<DimensionValue>
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'aria' | 'native' = 'aria'
value?: string | null
width?: Responsive<DimensionValue>
zIndex?: Responsive<number>/@react-spectrum/radio:SpectrumRadioGroupProps SpectrumRadioGroupProps {
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-errormessage?: string
aria-label?: string
aria-labelledby?: string
bottom?: Responsive<DimensionValue>
children: ReactElement<RadioProps> | Array<ReactElement<RadioProps>>
contextualHelp?: ReactNode
defaultValue?: string | null
description?: ReactNode
end?: Responsive<DimensionValue>
errorMessage?: ReactNode | (ValidationResult) => ReactNode
flex?: Responsive<string | number | boolean>
flexBasis?: Responsive<number | string>
flexGrow?: Responsive<number>
flexShrink?: Responsive<number>
form?: string
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
isDisabled?: boolean
isEmphasized?: boolean
isHidden?: Responsive<boolean>
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
justifySelf?: Responsive<'auto' | 'normal' | 'start' | 'end' | 'flex-start' | 'flex-end' | 'self-start' | 'self-end' | 'center' | 'left' | 'right' | 'stretch'>
label?: ReactNode
labelAlign?: Alignment = 'start'
labelPosition?: LabelPosition = 'top'
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>
maxWidth?: Responsive<DimensionValue>
minHeight?: Responsive<DimensionValue>
minWidth?: Responsive<DimensionValue>
name?: string
necessityIndicator?: NecessityIndicator = 'icon'
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
order?: Responsive<number>
orientation?: Orientation = 'vertical'
position?: Responsive<'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'>
right?: Responsive<DimensionValue>
showErrorIcon?: boolean
start?: Responsive<DimensionValue>
top?: Responsive<DimensionValue>
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'aria' | 'native' = 'aria'
value?: string | null
width?: Responsive<DimensionValue>
zIndex?: Responsive<number>@react-spectrum/s2/@react-spectrum/s2:LinkButton LinkButton {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean
children: ReactNode
download?: boolean | string
fillStyle?: 'fill' | 'outline' = 'fill'
href?: Href
hrefLang?: string
- id?: string
isDisabled?: boolean
onBlur?: (FocusEvent<Target>) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
size?: 'S' | 'M' | 'L' | 'XL' = 'M'
slot?: string | null
staticColor?: 'white' | 'black' | 'auto'
styles?: StylesProp
target?: HTMLAttributeAnchorTarget
variant?: 'primary' | 'secondary' | 'accent' | 'negative' | 'premium' | 'genai' = 'primary'
}/@react-spectrum/s2:Link Link {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean
children: ReactNode
download?: boolean | string
href?: Href
hrefLang?: string
- id?: string
isQuiet?: boolean
isStandalone?: boolean
onBlur?: (FocusEvent<Target>) => void
onFocus?: (FocusEvent<Target>) => void
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
slot?: string | null
staticColor?: 'white' | 'black' | 'auto'
styles?: StylesProp
target?: HTMLAttributeAnchorTarget
variant?: 'primary' | 'secondary' = 'primary'
}/@react-spectrum/s2:MenuItem MenuItem {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-label?: string
children: ReactNode
download?: boolean | string
href?: Href
hrefLang?: string
id?: Key
isDisabled?: boolean
onAction?: () => void
onHoverChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
- shouldCloseOnSelect?: boolean
styles?: StylesProp
target?: HTMLAttributeAnchorTarget
textValue?: string
value?: T/@react-spectrum/s2:Menu Menu <T extends {}> {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean | FocusStrategy
children: ReactNode | ({}) => ReactNode
defaultSelectedKeys?: 'all' | Iterable<Key>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
hideLinkOutIcon?: boolean
id?: string
items?: Iterable<T>
onAction?: (Key) => void
onClose?: () => void
onSelectionChange?: (Selection) => void
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
shouldFocusWrap?: boolean
size?: 'S' | 'M' | 'L' | 'XL' = 'M'
slot?: string | null
styles?: StylesProp/@react-spectrum/s2:MenuSection MenuSection <T extends {}> {
aria-label?: string
children?: ReactNode
defaultSelectedKeys?: 'all' | Iterable<Key>
dependencies?: ReadonlyArray<any>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
id?: Key
items?: Iterable<T>
onSelectionChange?: (Selection) => void
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
value?: T
}/@react-spectrum/s2:RadioGroup RadioGroup {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-errormessage?: string
aria-label?: string
aria-labelledby?: string
children: ReactNode
contextualHelp?: ReactNode
defaultValue?: string | null
description?: ReactNode
errorMessage?: ReactNode | (ValidationResult) => ReactNode
form?: string
id?: string
isDisabled?: boolean
isEmphasized?: boolean
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
label?: ReactNode
labelAlign?: Alignment = 'start'
labelPosition?: LabelPosition = 'top'
name?: string
necessityIndicator?: NecessityIndicator = 'icon'
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
orientation?: Orientation = 'vertical'
size?: 'S' | 'M' | 'L' | 'XL' = 'M'
slot?: string | null
styles?: StylesProp
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'native' | 'aria' = 'native'
value?: string | null
}/@react-spectrum/s2:LinkButtonProps LinkButtonProps {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean
children: ReactNode
download?: boolean | string
fillStyle?: 'fill' | 'outline' = 'fill'
href?: Href
hrefLang?: string
- id?: string
isDisabled?: boolean
onBlur?: (FocusEvent<Target>) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
size?: 'S' | 'M' | 'L' | 'XL' = 'M'
slot?: string | null
staticColor?: 'white' | 'black' | 'auto'
styles?: StylesProp
target?: HTMLAttributeAnchorTarget
variant?: 'primary' | 'secondary' | 'accent' | 'negative' | 'premium' | 'genai' = 'primary'
}/@react-spectrum/s2:LinkProps LinkProps {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean
children: ReactNode
download?: boolean | string
href?: Href
hrefLang?: string
- id?: string
isQuiet?: boolean
isStandalone?: boolean
onBlur?: (FocusEvent<Target>) => void
onFocus?: (FocusEvent<Target>) => void
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
slot?: string | null
staticColor?: 'white' | 'black' | 'auto'
styles?: StylesProp
target?: HTMLAttributeAnchorTarget
variant?: 'primary' | 'secondary' = 'primary'
}/@react-spectrum/s2:MenuProps MenuProps <T> {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-label?: string
aria-labelledby?: string
autoFocus?: boolean | FocusStrategy
children: ReactNode | (T) => ReactNode
defaultSelectedKeys?: 'all' | Iterable<Key>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
hideLinkOutIcon?: boolean
id?: string
items?: Iterable<T>
onAction?: (Key) => void
onClose?: () => void
onSelectionChange?: (Selection) => void
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
shouldFocusWrap?: boolean
size?: 'S' | 'M' | 'L' | 'XL' = 'M'
slot?: string | null
styles?: StylesProp/@react-spectrum/s2:MenuItemProps MenuItemProps {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-label?: string
children: ReactNode
download?: boolean | string
href?: Href
hrefLang?: string
id?: Key
isDisabled?: boolean
onAction?: () => void
onHoverChange?: (boolean) => void
onHoverEnd?: (HoverEvent) => void
onHoverStart?: (HoverEvent) => void
onPress?: (PressEvent) => void
onPressChange?: (boolean) => void
onPressEnd?: (PressEvent) => void
onPressStart?: (PressEvent) => void
onPressUp?: (PressEvent) => void
ping?: string
referrerPolicy?: HTMLAttributeReferrerPolicy
rel?: string
routerOptions?: RouterOptions
- shouldCloseOnSelect?: boolean
styles?: StylesProp
target?: HTMLAttributeAnchorTarget
textValue?: string
value?: T/@react-spectrum/s2:MenuSectionProps MenuSectionProps <T extends {}> {
aria-label?: string
children?: ReactNode
defaultSelectedKeys?: 'all' | Iterable<Key>
dependencies?: ReadonlyArray<any>
disabledKeys?: Iterable<Key>
disallowEmptySelection?: boolean
id?: Key
items?: Iterable<T>
onSelectionChange?: (Selection) => void
selectedKeys?: 'all' | Iterable<Key>
selectionMode?: SelectionMode
- shouldCloseOnSelect?: boolean
value?: T
}/@react-spectrum/s2:RadioGroupProps RadioGroupProps {
UNSAFE_className?: UnsafeClassName
UNSAFE_style?: CSSProperties
aria-describedby?: string
aria-details?: string
aria-errormessage?: string
aria-label?: string
aria-labelledby?: string
children: ReactNode
contextualHelp?: ReactNode
defaultValue?: string | null
description?: ReactNode
errorMessage?: ReactNode | (ValidationResult) => ReactNode
form?: string
id?: string
isDisabled?: boolean
isEmphasized?: boolean
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
label?: ReactNode
labelAlign?: Alignment = 'start'
labelPosition?: LabelPosition = 'top'
name?: string
necessityIndicator?: NecessityIndicator = 'icon'
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
orientation?: Orientation = 'vertical'
size?: 'S' | 'M' | 'L' | 'XL' = 'M'
slot?: string | null
styles?: StylesProp
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'native' | 'aria' = 'native'
value?: string | null
}@react-stately/radio/@react-stately/radio:RadioGroupProps RadioGroupProps {
defaultValue?: string | null
description?: ReactNode
errorMessage?: ReactNode | (ValidationResult) => ReactNode
isDisabled?: boolean
isInvalid?: boolean
isReadOnly?: boolean
isRequired?: boolean
label?: ReactNode
name?: string
onBlur?: (FocusEvent<Target>) => void
onChange?: (string) => void
onFocus?: (FocusEvent<Target>) => void
onFocusChange?: (boolean) => void
orientation?: Orientation = 'vertical'
- validate?: (string) => ValidationError | boolean | null | undefined
+ validate?: (string | null) => ValidationError | boolean | null | undefined
validationBehavior?: 'aria' | 'native' = 'aria'
value?: string | null
} |
devongovett
reviewed
Dec 23, 2025
| enumerable: true, | ||
| value: function (node, child) { | ||
| if (this.dataset.reactAriaHidden) { | ||
| // child might not exist in this.content for some reason (stale?), add to end instead |
Member
There was a problem hiding this comment.
???
In this case, what is the child and it's parent?
Member
Author
There was a problem hiding this comment.
the child is the bottom most div, at the time of the error this.content is a document fragment with no children hence why it breaks trying to call insertBefore
Member
There was a problem hiding this comment.
oh, this seems wrong. <template> doesn't support direct children, they should be within the document fragment. That's what these overridden methods should be doing (since react doesn't handle that). So maybe we're missing another one and that's how those dives are getting there?
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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 #9376
✅ Pull Request Checklist:
📝 Test Instructions:
Go to S2 Picker docs. Type any description in the first example's description control, it should apply without crashing
🧢 Your Project:
RSP