Skip to content

Conversation

devongovett
Copy link
Member

Adds a table for CSS variables exposed by each component, and ensures that all components have a default class name and render props table. This is now automatically generated by the PropTable component by extracting the default class name from the JS docs, and the render props from the types. So now you don't need to manually render a StateTable as well.

@rspbot
Copy link

rspbot commented Oct 3, 2025

@rspbot
Copy link

rspbot commented Oct 3, 2025

@rspbot
Copy link

rspbot commented Oct 3, 2025

## API Changes

react-aria-components

/react-aria-components:Breadcrumbs

 Breadcrumbs <T extends {}> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode | (T) => ReactNode
-  className?: string
+  className?: string = 'react-aria-Breadcrumbs'
   dependencies?: ReadonlyArray<any>
   id?: string
   isDisabled?: boolean
   items?: Iterable<T>
   slot?: string | null
   style?: CSSProperties
 }

/react-aria-components:Breadcrumb

 Breadcrumb {
   children?: ChildrenOrFunction<BreadcrumbRenderProps>
-  className?: ClassNameOrFunction<BreadcrumbRenderProps>
+  className?: ClassNameOrFunction<BreadcrumbRenderProps> = 'react-aria-Breadcrumb'
   id?: Key
   style?: StyleOrFunction<BreadcrumbRenderProps>
 }

/react-aria-components:Button

 Button {
   aria-controls?: string
   aria-current?: boolean | 'true' | 'false' | 'page' | 'step' | 'location' | 'date' | 'time'
   aria-describedby?: string
   aria-details?: string
   aria-disabled?: boolean | 'true' | 'false'
   aria-expanded?: boolean | 'true' | 'false'
   aria-haspopup?: boolean | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog' | 'true' | 'false'
   aria-label?: string
   aria-labelledby?: string
   aria-pressed?: boolean | 'true' | 'false' | 'mixed'
   autoFocus?: boolean
   children?: ChildrenOrFunction<ButtonRenderProps>
-  className?: ClassNameOrFunction<ButtonRenderProps>
+  className?: ClassNameOrFunction<ButtonRenderProps> = 'react-aria-Button'
   excludeFromTabOrder?: boolean
   form?: string
   formAction?: string
   formEncType?: string
   formNoValidate?: boolean
   formTarget?: string
   id?: string
   isDisabled?: boolean
   isPending?: boolean
   name?: string
   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
   preventFocusOnPress?: boolean
   slot?: string | null
   style?: StyleOrFunction<ButtonRenderProps>
   type?: 'button' | 'submit' | 'reset' = 'button'
   value?: string
 }

/react-aria-components:Calendar

 Calendar <T extends DateValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean = false
   children?: ChildrenOrFunction<CalendarRenderProps>
-  className?: ClassNameOrFunction<CalendarRenderProps>
+  className?: ClassNameOrFunction<CalendarRenderProps> = 'react-aria-Calendar'
   createCalendar?: (CalendarIdentifier) => Calendar
   defaultFocusedValue?: DateValue | null
   defaultValue?: DateValue | null
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean = false
   isInvalid?: boolean
   isReadOnly?: boolean = false
   maxValue?: DateValue | null
   minValue?: DateValue | null
   onChange?: (MappedDateValue<DateValue>) => void
   onFocusChange?: (CalendarDate) => void
   pageBehavior?: PageBehavior = visible
   selectionAlignment?: 'start' | 'center' | 'end' = 'center'
   slot?: string | null
   style?: StyleOrFunction<CalendarRenderProps>
   value?: DateValue | null
   visibleDuration?: DateDuration = {months: 1}
 }

/react-aria-components:CalendarGrid

 CalendarGrid {
   children?: ReactElement | Array<ReactElement> | (CalendarDate) => ReactElement
-  className?: string
+  className?: string = 'react-aria-CalendarGrid'
   offset?: DateDuration
   style?: CSSProperties
   weekdayStyle?: 'narrow' | 'short' | 'long' = "narrow"
 }

/react-aria-components:CalendarGridHeader

 CalendarGridHeader {
   children: (string) => ReactElement
-  className?: string
+  className?: string = 'react-aria-CalendarGridHeader'
   style?: CSSProperties
 }

/react-aria-components:CalendarGridBody

 CalendarGridBody {
   children: (CalendarDate) => ReactElement
-  className?: string
+  className?: string = 'react-aria-CalendarGridBody'
   style?: CSSProperties
 }

/react-aria-components:CalendarHeaderCell

 CalendarHeaderCell {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-CalendarHeaderCell'
   id?: string
   style?: CSSProperties
 }

/react-aria-components:CalendarCell

 CalendarCell {
   children?: ChildrenOrFunction<CalendarCellRenderProps>
-  className?: ClassNameOrFunction<CalendarCellRenderProps>
+  className?: ClassNameOrFunction<CalendarCellRenderProps> = 'react-aria-CalendarCell'
   date: CalendarDate
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
 }

/react-aria-components:RangeCalendar

 RangeCalendar <T extends DateValue> {
   allowsNonContiguousRanges?: boolean
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean = false
   children?: ChildrenOrFunction<RangeCalendarRenderProps>
-  className?: ClassNameOrFunction<RangeCalendarRenderProps>
+  className?: ClassNameOrFunction<RangeCalendarRenderProps> = 'react-aria-RangeCalendar'
   createCalendar?: (CalendarIdentifier) => Calendar
   defaultFocusedValue?: DateValue | null
   defaultValue?: RangeValue<DateValue> | null
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean = false
   isInvalid?: boolean
   isReadOnly?: boolean = false
   maxValue?: DateValue | null
   minValue?: DateValue | null
   onChange?: (RangeValue<MappedDateValue<DateValue>>) => void
   onFocusChange?: (CalendarDate) => void
   pageBehavior?: PageBehavior = visible
   selectionAlignment?: 'start' | 'center' | 'end' = 'center'
   slot?: string | null
   style?: StyleOrFunction<RangeCalendarRenderProps>
   value?: RangeValue<DateValue> | null
   visibleDuration?: DateDuration = {months: 1}
 }

/react-aria-components:Checkbox

 Checkbox {
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<CheckboxRenderProps>
-  className?: ClassNameOrFunction<CheckboxRenderProps>
+  className?: ClassNameOrFunction<CheckboxRenderProps> = 'react-aria-Checkbox'
   defaultSelected?: boolean
   excludeFromTabOrder?: boolean
   form?: string
   id?: string
   isDisabled?: boolean
   isIndeterminate?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   isSelected?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (boolean) => 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
   slot?: string | null
   style?: StyleOrFunction<CheckboxRenderProps>
   validate?: (boolean) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string
 }

/react-aria-components:CheckboxGroup

 CheckboxGroup {
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<CheckboxGroupRenderProps>
-  className?: ClassNameOrFunction<CheckboxGroupRenderProps>
+  className?: ClassNameOrFunction<CheckboxGroupRenderProps> = 'react-aria-CheckboxGroup'
   defaultValue?: Array<string>
   form?: string
   id?: string
   isDisabled?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (T) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   slot?: string | null
   style?: StyleOrFunction<CheckboxGroupRenderProps>
   validate?: (Array<string>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: Array<string>
 }

/react-aria-components:ColorArea

 ColorArea {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ColorAreaRenderProps>
-  className?: ClassNameOrFunction<ColorAreaRenderProps>
+  className?: ClassNameOrFunction<ColorAreaRenderProps> = 'react-aria-ColorArea'
   colorSpace?: ColorSpace
   defaultValue?: T
   form?: string
   id?: string
   onChange?: (Color) => void
   onChangeEnd?: (Color) => void
   slot?: string | null
   style?: StyleOrFunction<ColorAreaRenderProps>
   value?: T
   xChannel?: ColorChannel
   xName?: string
   yChannel?: ColorChannel
   yName?: string
 }

/react-aria-components:ColorField

 ColorField {
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   channel?: ColorChannel
   children?: ChildrenOrFunction<ColorFieldRenderProps>
-  className?: ClassNameOrFunction<ColorFieldRenderProps>
+  className?: ClassNameOrFunction<ColorFieldRenderProps> = 'react-aria-ColorField'
   colorSpace?: ColorSpace
   defaultValue?: T
   excludeFromTabOrder?: boolean
   form?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   isWheelDisabled?: boolean
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (Color | null) => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   slot?: string | null
   style?: StyleOrFunction<ColorFieldRenderProps>
   validate?: (Color | null) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: T
 }

/react-aria-components:ColorPicker

 ColorPicker {
-  children?: ChildrenOrFunction<T>
+  children: ChildrenOrFunction<ColorPickerRenderProps>
   defaultValue?: string | Color
   onChange?: (Color) => void
   slot?: string | null
   value?: string | Color

/react-aria-components:ColorSlider

 ColorSlider {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   channel: ColorChannel
   children?: ChildrenOrFunction<ColorSliderRenderProps>
-  className?: ClassNameOrFunction<ColorSliderRenderProps>
+  className?: ClassNameOrFunction<ColorSliderRenderProps> = 'react-aria-ColorSlider'
   colorSpace?: ColorSpace
   defaultValue?: T
   form?: string
   id?: string
   name?: string
   onChange?: (Color) => void
   onChangeEnd?: (Color) => void
   orientation?: Orientation = 'horizontal'
   slot?: string | null
   style?: StyleOrFunction<ColorSliderRenderProps>
   value?: T
 }

/react-aria-components:ColorSwatch

 ColorSwatch {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
-  className?: ClassNameOrFunction<ColorSwatchRenderProps>
+  className?: ClassNameOrFunction<ColorSwatchRenderProps> = 'react-aria-ColorSwatch'
   color?: string | Color
   colorName?: string
   id?: string
   slot?: string | null
 }

/react-aria-components:ColorSwatchPicker

 ColorSwatchPicker {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode
-  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps>
+  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps> = 'react-aria-ColorSwatchPicker'
   defaultValue?: string | Color
   layout?: 'grid' | 'stack' = 'grid'
   onChange?: (Color) => void
   style?: StyleOrFunction<ColorSwatchPickerRenderProps>
 }

/react-aria-components:ColorSwatchPickerItem

 ColorSwatchPickerItem {
   children?: ChildrenOrFunction<ColorSwatchPickerItemRenderProps>
-  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps>
+  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps> = 'react-aria-ColorSwatchPickerItem'
   color: string | Color
   isDisabled?: boolean
   onClick?: (MouseEvent<FocusableElement>) => void
   onHoverChange?: (boolean) => void
   onHoverStart?: (HoverEvent) => void
   onPress?: (PressEvent) => void
   onPressChange?: (boolean) => void
   onPressEnd?: (PressEvent) => void
   onPressStart?: (PressEvent) => void
   onPressUp?: (PressEvent) => void
   style?: StyleOrFunction<ColorSwatchPickerItemRenderProps>
 }

/react-aria-components:ColorThumb

 ColorThumb {
   children?: ChildrenOrFunction<ColorThumbRenderProps>
-  className?: ClassNameOrFunction<ColorThumbRenderProps>
+  className?: ClassNameOrFunction<ColorThumbRenderProps> = 'react-aria-ColorThumb'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<ColorThumbRenderProps>

/react-aria-components:ColorWheel

 ColorWheel {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ColorWheelRenderProps>
-  className?: ClassNameOrFunction<ColorWheelRenderProps>
+  className?: ClassNameOrFunction<ColorWheelRenderProps> = 'react-aria-ColorWheel'
   defaultValue?: string | Color = 'hsl(0, 100%, 50%)'
   form?: string
   id?: string
   innerRadius: number
   name?: string
   onChange?: (Color) => void
   onChangeEnd?: (Color) => void
   outerRadius: number
   slot?: string | null
   style?: StyleOrFunction<ColorWheelRenderProps>
   value?: T
 }

/react-aria-components:ColorWheelTrack

 ColorWheelTrack {
-  className?: ClassNameOrFunction<ColorWheelTrackRenderProps>
+  className?: ClassNameOrFunction<ColorWheelTrackRenderProps> = 'react-aria-ColorWheelTrack'
   style?: StyleOrFunction<ColorWheelTrackRenderProps>
 }

/react-aria-components:ComboBox

 ComboBox <T extends {}> {
   allowsCustomValue?: boolean
   allowsEmptyCollection?: boolean
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<ComboBoxRenderProps>
-  className?: ClassNameOrFunction<ComboBoxRenderProps>
+  className?: ClassNameOrFunction<ComboBoxRenderProps> = 'react-aria-ComboBox'
   defaultFilter?: (string, string) => boolean
   defaultInputValue?: string
   defaultItems?: Iterable<T>
   defaultSelectedKey?: Key
   form?: string
   formValue?: 'text' | 'key' = 'key'
   id?: string
   inputValue?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   items?: Iterable<T>
   menuTrigger?: MenuTriggerAction = 'input'
   name?: string
   onBlur?: (FocusEvent<HTMLInputElement>) => void
   onFocus?: (FocusEvent<HTMLInputElement>) => void
   onFocusChange?: (boolean) => void
   onInputChange?: (string) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean, MenuTriggerAction) => void
   onSelectionChange?: (Key | null) => void
   selectedKey?: Key | null
   shouldFocusWrap?: boolean
   slot?: string | null
   style?: StyleOrFunction<ComboBoxRenderProps>
   validate?: (ComboBoxValidationValue) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
 }

/react-aria-components:DateField

 DateField <T extends DateValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DateFieldRenderProps>
-  className?: ClassNameOrFunction<DateFieldRenderProps>
+  className?: ClassNameOrFunction<DateFieldRenderProps> = 'react-aria-DateField'
   defaultValue?: DateValue | null
   form?: string
   granularity?: Granularity
   hideTimeZone?: boolean = false
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: DateValue | null
   minValue?: DateValue | null
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (MappedDateValue<DateValue> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   placeholderValue?: DateValue | null
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   style?: StyleOrFunction<DateFieldRenderProps>
   validate?: (MappedDateValue<DateValue>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: DateValue | null
 }

/react-aria-components:DateInput

 DateInput {
   children: (DateSegment) => ReactElement
-  className?: ClassNameOrFunction<DateInputRenderProps>
+  className?: ClassNameOrFunction<DateInputRenderProps> = 'react-aria-DateInput'
   slot?: string | null
   style?: StyleOrFunction<DateInputRenderProps>
 }

/react-aria-components:DateSegment

 DateSegment {
   children?: ChildrenOrFunction<DateSegmentRenderProps>
-  className?: ClassNameOrFunction<DateSegmentRenderProps>
+  className?: ClassNameOrFunction<DateSegmentRenderProps> = 'react-aria-DateSegment'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   segment: DateSegment
 }

/react-aria-components:TimeField

 TimeField <T extends TimeValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DateFieldRenderProps>
-  className?: ClassNameOrFunction<DateFieldRenderProps>
+  className?: ClassNameOrFunction<DateFieldRenderProps> = 'react-aria-TimeField'
   defaultValue?: TimeValue | null
   form?: string
   granularity?: 'hour' | 'minute' | 'second' = 'minute'
   hideTimeZone?: boolean
   id?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: TimeValue | null
   minValue?: TimeValue | null
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (MappedTimeValue<TimeValue> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   placeholderValue?: TimeValue
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   style?: StyleOrFunction<DateFieldRenderProps>
   validate?: (MappedTimeValue<TimeValue>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: TimeValue | null
 }

/react-aria-components:DatePicker

 DatePicker <T extends DateValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DatePickerRenderProps>
-  className?: ClassNameOrFunction<DatePickerRenderProps>
+  className?: ClassNameOrFunction<DatePickerRenderProps> = 'react-aria-DatePicker'
   defaultOpen?: boolean
   defaultValue?: DateValue | null
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   form?: string
   hideTimeZone?: boolean = false
   hourCycle?: number | number
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean
   isInvalid?: boolean
   isOpen?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: DateValue | null
   minValue?: DateValue | null
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (MappedDateValue<DateValue> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean) => void
   pageBehavior?: PageBehavior = visible
   placeholderValue?: DateValue | null
   shouldCloseOnSelect?: boolean | () => boolean = true
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   style?: StyleOrFunction<DatePickerRenderProps>
   validate?: (MappedDateValue<DateValue>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: DateValue | null
 }

/react-aria-components:DateRangePicker

 DateRangePicker <T extends DateValue> {
   allowsNonContiguousRanges?: boolean
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DateRangePickerRenderProps>
-  className?: ClassNameOrFunction<DateRangePickerRenderProps>
+  className?: ClassNameOrFunction<DateRangePickerRenderProps> = 'react-aria-DateRangePicker'
   defaultOpen?: boolean
   defaultValue?: RangeValue<DateValue> | null
   endName?: string
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   granularity?: Granularity
   hideTimeZone?: boolean = false
   hourCycle?: number | number
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean
   isInvalid?: boolean
   isOpen?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: DateValue | null
   minValue?: DateValue | null
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (RangeValue<MappedDateValue<DateValue>> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean) => void
   pageBehavior?: PageBehavior = visible
   placeholderValue?: DateValue | null
   shouldCloseOnSelect?: boolean | () => boolean = true
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   startName?: string
   style?: StyleOrFunction<DateRangePickerRenderProps>
   validate?: (RangeValue<MappedDateValue<DateValue>>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: RangeValue<DateValue> | null
 }

/react-aria-components:Dialog

 Dialog {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode | (DialogRenderProps) => ReactNode
-  className?: string
+  className?: string = 'react-aria-Dialog'
   id?: string
   role?: 'dialog' | 'alertdialog' = 'dialog'
   slot?: string | null
   style?: CSSProperties

/react-aria-components:Disclosure

 Disclosure {
   children?: ChildrenOrFunction<DisclosureRenderProps>
-  className?: ClassNameOrFunction<DisclosureRenderProps>
+  className?: ClassNameOrFunction<DisclosureRenderProps> = 'react-aria-Disclosure'
   defaultExpanded?: boolean
   id?: Key
   isDisabled?: boolean
   isExpanded?: boolean
   slot?: string | null
   style?: StyleOrFunction<DisclosureRenderProps>
 }

/react-aria-components:DisclosureGroup

 DisclosureGroup {
   allowsMultipleExpanded?: boolean
   children?: ChildrenOrFunction<DisclosureGroupRenderProps>
-  className?: ClassNameOrFunction<DisclosureGroupRenderProps>
+  className?: ClassNameOrFunction<DisclosureGroupRenderProps> = 'react-aria-DisclosureGroup'
   defaultExpandedKeys?: Iterable<Key>
   expandedKeys?: Iterable<Key>
   id?: string
   isDisabled?: boolean
   style?: StyleOrFunction<DisclosureGroupRenderProps>
 }

/react-aria-components:DisclosurePanel

 DisclosurePanel {
   children: ReactNode
-  className?: ClassNameOrFunction<DisclosurePanelRenderProps>
+  className?: ClassNameOrFunction<DisclosurePanelRenderProps> = 'react-aria-DisclosurePanel'
   id?: string
   role?: 'group' | 'region' = 'group'
   style?: StyleOrFunction<DisclosurePanelRenderProps>
 }

/react-aria-components:DropZone

 DropZone {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<DropZoneRenderProps>
-  className?: ClassNameOrFunction<DropZoneRenderProps>
+  className?: ClassNameOrFunction<DropZoneRenderProps> = 'react-aria-DropZone'
   getDropOperation?: (DragTypes, Array<DropOperation>) => DropOperation
   isDisabled?: boolean
   onDrop?: (DropEvent) => void
   onDropActivate?: (DropActivateEvent) => void
   onDropExit?: (DropExitEvent) => void
   onDropMove?: (DropMoveEvent) => void
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   slot?: string | null
   style?: StyleOrFunction<DropZoneRenderProps>
 }

/react-aria-components:FieldError

 FieldError {
   children?: ChildrenOrFunction<FieldErrorRenderProps>
-  className?: ClassNameOrFunction<FieldErrorRenderProps>
+  className?: ClassNameOrFunction<FieldErrorRenderProps> = 'react-aria-FieldError'
   id?: string
   style?: StyleOrFunction<FieldErrorRenderProps>
 }

/react-aria-components:Form

 Form {
   action?: string | FormHTMLAttributes<HTMLFormElement>['action']
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoCapitalize?: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'
   autoComplete?: 'off' | 'on'
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-Form'
   encType?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain'
   id?: string
   method?: 'get' | 'post' | 'dialog'
   onInvalid?: (FormEvent<HTMLFormElement>) => void
   onSubmit?: (FormEvent<HTMLFormElement>) => void
   role?: 'search' | 'presentation'
   style?: CSSProperties
   target?: '_blank' | '_self' | '_parent' | '_top'
   validationBehavior?: 'aria' | 'native' = 'native'
   validationErrors?: ValidationErrors
 }

/react-aria-components:GridListLoadMoreItem

 GridListLoadMoreItem {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-GridListLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: CSSProperties

/react-aria-components:GridList

 GridList <T extends {}> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean | FocusStrategy
   children?: ReactNode | ({}) => ReactNode
-  className?: ClassNameOrFunction<GridListRenderProps>
+  className?: ClassNameOrFunction<GridListRenderProps> = 'react-aria-GridList'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledBehavior?: DisabledBehavior = "all"
   disabledKeys?: Iterable<Key>
   disallowTypeAhead?: boolean = false
   dragAndDropHooks?: DragAndDropHooks<NoInfer<{}>>
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   id?: string
   items?: Iterable<T>
   keyboardNavigationBehavior?: 'arrow' | 'tab' = 'arrow'
   layout?: 'stack' | 'grid' = 'stack'
   onAction?: (Key) => void
   onSelectionChange?: (Selection) => void
   renderEmptyState?: (GridListRenderProps) => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: StyleOrFunction<GridListRenderProps>
 }

/react-aria-components:GridListItem

 GridListItem <T extends {}> {
   children?: ChildrenOrFunction<GridListItemRenderProps>
-  className?: ClassNameOrFunction<GridListItemRenderProps>
+  className?: ClassNameOrFunction<GridListItemRenderProps> = 'react-aria-GridListItem'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<GridListItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: {}
 }

/react-aria-components:GridListSection

 GridListSection <T extends {}> {
   aria-label?: string
   children?: ReactNode | ({}) => ReactElement
-  className?: string
+  className?: string = 'react-aria-GridListSection'
   dependencies?: ReadonlyArray<any>
   id?: Key
   items?: Iterable<{}>
   style?: CSSProperties
 }

/react-aria-components:Group

 Group extends HTMLAttributes {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<GroupRenderProps>
-  className?: ClassNameOrFunction<GroupRenderProps>
+  className?: ClassNameOrFunction<GroupRenderProps> = 'react-aria-Group'
   id?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   role?: 'group' | 'region' | 'presentation' = 'group'
   slot?: string | null
   style?: StyleOrFunction<GroupRenderProps>
 }

/react-aria-components:Input

 Input extends InputHTMLAttributes {
-  className?: ClassNameOrFunction<InputRenderProps>
+  className?: ClassNameOrFunction<InputRenderProps> = 'react-aria-Input'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   placeholder?: string
 }

/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>
+  className?: ClassNameOrFunction<LinkRenderProps> = 'react-aria-Link'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   isDisabled?: boolean
   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
   ping?: string
   referrerPolicy?: HTMLAttributeReferrerPolicy
   rel?: string
   routerOptions?: RouterOptions
   slot?: string | null
   style?: StyleOrFunction<LinkRenderProps>
   target?: HTMLAttributeAnchorTarget
 }

/react-aria-components:ListBoxLoadMoreItem

 ListBoxLoadMoreItem {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-ListBoxLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: CSSProperties

/react-aria-components:ListBox

 ListBox <T extends {}> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean | FocusStrategy
   children?: ReactNode | ({}) => ReactNode
-  className?: ClassNameOrFunction<ListBoxRenderProps>
+  className?: ClassNameOrFunction<ListBoxRenderProps> = 'react-aria-ListBox'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   id?: string
   items?: Iterable<T>
   layout?: 'stack' | 'grid' = 'stack'
   onAction?: (Key) => void
   onBlur?: (FocusEvent<Target>) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onSelectionChange?: (Selection) => void
   orientation?: Orientation = 'vertical'
   renderEmptyState?: (ListBoxRenderProps) => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldFocusOnHover?: boolean
   shouldFocusWrap?: boolean
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: StyleOrFunction<ListBoxRenderProps>
 }

/react-aria-components:ListBoxItem

 ListBoxItem <T extends {}> {
   aria-label?: string
   children?: ChildrenOrFunction<ListBoxItemRenderProps>
-  className?: ClassNameOrFunction<ListBoxItemRenderProps>
+  className?: ClassNameOrFunction<ListBoxItemRenderProps> = 'react-aria-ListBoxItem'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<ListBoxItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: {}
 }

/react-aria-components:ListBoxSection

 ListBoxSection <T extends {}> {
   aria-label?: string
   children?: ReactNode | ({}) => ReactElement
-  className?: string
+  className?: string = 'react-aria-ListBoxSection'
   dependencies?: ReadonlyArray<any>
   id?: Key
   items?: Iterable<{}>
   style?: CSSProperties
 }

/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>
+  className?: ClassNameOrFunction<MenuRenderProps> = 'react-aria-Menu'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   id?: string
   items?: Iterable<T>
   onAction?: (Key) => void
   onClose?: () => void
   onSelectionChange?: (Selection) => void
   renderEmptyState?: () => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   shouldFocusWrap?: boolean
   slot?: string | null
   style?: StyleOrFunction<MenuRenderProps>
 }

/react-aria-components:MenuItem

 MenuItem <T extends {}> {
   aria-label?: string
   children?: ChildrenOrFunction<MenuItemRenderProps>
-  className?: ClassNameOrFunction<MenuItemRenderProps>
+  className?: ClassNameOrFunction<MenuItemRenderProps> = 'react-aria-MenuItem'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<MenuItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: {}
 }

/react-aria-components:MenuSection

 MenuSection <T extends {}> {
   aria-label?: string
   children?: ReactNode | ({}) => ReactElement
-  className?: string
+  className?: string = 'react-aria-MenuSection'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   items?: Iterable<{}>
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   style?: CSSProperties
   value?: {}
 }

/react-aria-components:Meter

 Meter {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<MeterRenderProps>
-  className?: ClassNameOrFunction<MeterRenderProps>
+  className?: ClassNameOrFunction<MeterRenderProps> = 'react-aria-Meter'
   formatOptions?: Intl.NumberFormatOptions = {style: 'percent'}
   id?: string
   maxValue?: number = 100
   minValue?: number = 0
   style?: StyleOrFunction<MeterRenderProps>
   value?: number = 0
   valueLabel?: ReactNode
 }

/react-aria-components:Modal

 Modal {
   children?: ChildrenOrFunction<ModalRenderProps>
-  className?: ClassNameOrFunction<ModalRenderProps>
+  className?: ClassNameOrFunction<ModalRenderProps> = 'react-aria-ModalOverlay'
   defaultOpen?: boolean
   isDismissable?: boolean = false
   isEntering?: boolean
   isExiting?: boolean
   isOpen?: boolean
   onOpenChange?: (boolean) => void
   shouldCloseOnInteractOutside?: (Element) => boolean
   slot?: string | null
   style?: StyleOrFunction<ModalRenderProps>
 }

/react-aria-components:ModalOverlay

 ModalOverlay {
   children?: ChildrenOrFunction<ModalRenderProps>
-  className?: ClassNameOrFunction<ModalRenderProps>
+  className?: ClassNameOrFunction<ModalRenderProps> = 'react-aria-ModalOverlay'
   defaultOpen?: boolean
   isDismissable?: boolean = false
   isEntering?: boolean
   isExiting?: boolean
   isOpen?: boolean
   onOpenChange?: (boolean) => void
   shouldCloseOnInteractOutside?: (Element) => boolean
   slot?: string | null
   style?: StyleOrFunction<ModalRenderProps>
 }

/react-aria-components:NumberField

 NumberField {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<NumberFieldRenderProps>
-  className?: ClassNameOrFunction<NumberFieldRenderProps>
+  className?: ClassNameOrFunction<NumberFieldRenderProps> = 'react-aria-NumberField'
   decrementAriaLabel?: string
   defaultValue?: number
   form?: string
   formatOptions?: Intl.NumberFormatOptions
   incrementAriaLabel?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   isWheelDisabled?: boolean
   maxValue?: number
   minValue?: number
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (T) => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   slot?: string | null
   step?: number
   style?: StyleOrFunction<NumberFieldRenderProps>
   validate?: (number) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: number
 }

/react-aria-components:OverlayArrow

 OverlayArrow extends HTMLAttributes {
   children?: ChildrenOrFunction<OverlayArrowRenderProps>
-  className?: ClassNameOrFunction<OverlayArrowRenderProps>
+  className?: ClassNameOrFunction<OverlayArrowRenderProps> = 'react-aria-OverlayArrow'
   id?: string
   style?: StyleOrFunction<OverlayArrowRenderProps>
 }

/react-aria-components:Popover

 Popover {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   arrowBoundaryOffset?: number = 0
   arrowRef?: RefObject<Element | null>
   boundaryElement?: Element = document.body
   children?: ChildrenOrFunction<PopoverRenderProps>
-  className?: ClassNameOrFunction<PopoverRenderProps>
+  className?: ClassNameOrFunction<PopoverRenderProps> = 'react-aria-Popover'
   containerPadding?: number = 12
   crossOffset?: number = 0
   defaultOpen?: boolean
   isEntering?: boolean
   isKeyboardDismissDisabled?: boolean = false
   isNonModal?: boolean
   isOpen?: boolean
   maxHeight?: number
   offset?: number = 8
   onOpenChange?: (boolean) => void
   placement?: Placement = 'bottom'
   scrollRef?: RefObject<Element | null> = overlayRef
   shouldCloseOnInteractOutside?: (Element) => boolean
   shouldFlip?: boolean = true
   shouldUpdatePosition?: boolean = true
   slot?: string | null
   style?: StyleOrFunction<PopoverRenderProps>
   trigger?: string
   triggerRef?: RefObject<Element | null>
 }

/react-aria-components:ProgressBar

 ProgressBar {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ProgressBarRenderProps>
-  className?: ClassNameOrFunction<ProgressBarRenderProps>
+  className?: ClassNameOrFunction<ProgressBarRenderProps> = 'react-aria-ProgressBar'
   formatOptions?: Intl.NumberFormatOptions = {style: 'percent'}
   id?: string
   isIndeterminate?: boolean
   maxValue?: number = 100
   slot?: string | null
   style?: StyleOrFunction<ProgressBarRenderProps>
   value?: number = 0
   valueLabel?: ReactNode
 }

/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>
+  className?: ClassNameOrFunction<RadioGroupRenderProps> = 'react-aria-RadioGroup'
   defaultValue?: string | null
   form?: string
   id?: string
   isDisabled?: 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 | null) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string | null
 }

/react-aria-components:Radio

 Radio {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<RadioRenderProps>
-  className?: ClassNameOrFunction<RadioRenderProps>
+  className?: ClassNameOrFunction<RadioRenderProps> = 'react-aria-Radio'
   id?: string
   inputRef?: RefObject<HTMLInputElement | null>
   isDisabled?: boolean
   onBlur?: (FocusEvent<Target>) => 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
   slot?: string | null
   style?: StyleOrFunction<RadioRenderProps>
   value: string
 }

/react-aria-components:SearchField

 SearchField {
   aria-activedescendant?: string
   aria-autocomplete?: 'none' | 'inline' | 'list' | 'both'
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-haspopup?: boolean | 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog'
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoCorrect?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SearchFieldRenderProps>
-  className?: ClassNameOrFunction<SearchFieldRenderProps>
+  className?: ClassNameOrFunction<SearchFieldRenderProps> = 'react-aria-SearchField'
   defaultValue?: string
   enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'
   excludeFromTabOrder?: boolean
   form?: string
   inputMode?: 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search'
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxLength?: number
   minLength?: number
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<T>) => void
   onChange?: (T) => void
   onClear?: () => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<T>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   onSubmit?: (string) => void
   pattern?: string
   slot?: string | null
   spellCheck?: string
   style?: StyleOrFunction<SearchFieldRenderProps>
   type?: 'text' | 'search' | 'url' | 'tel' | 'email' | 'password' | (string & {
   
 }) = 'search'
   validate?: (string) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string
 }

/react-aria-components:Select

 Select <M extends SelectionMode = 'single', T extends {} = {
   
 }> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SelectRenderProps>
-  className?: ClassNameOrFunction<SelectRenderProps>
+  className?: ClassNameOrFunction<SelectRenderProps> = 'react-aria-Select'
   defaultOpen?: boolean
   defaultValue?: ValueType<SelectionMode>
   disabledKeys?: Iterable<Key>
   excludeFromTabOrder?: boolean
   id?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isOpen?: boolean
   isRequired?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (T) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean) => void
   placeholder?: string = 'Select an item' (localized)
   selectionMode?: SelectionMode = 'single'
   slot?: string | null
   style?: StyleOrFunction<SelectRenderProps>
   validate?: (ValidationType<SelectionMode>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: ValueType<SelectionMode>
 }

/react-aria-components:SelectValue

 SelectValue <T extends {}> extends HTMLAttributes {
   children?: ChildrenOrFunction<SelectValueRenderProps<{}>>
-  className?: ClassNameOrFunction<SelectValueRenderProps<{}>>
+  className?: ClassNameOrFunction<SelectValueRenderProps<{}>> = 'react-aria-SelectValue'
   style?: StyleOrFunction<SelectValueRenderProps<{}>>
 }

/react-aria-components:SelectionIndicator

 SelectionIndicator {
   children?: ChildrenOrFunction<SharedElementRenderProps>
-  className?: ClassNameOrFunction<SharedElementRenderProps>
+  className?: ClassNameOrFunction<SharedElementRenderProps> = 'react-aria-SelectionIndicator'
   isSelected?: boolean
   style?: StyleOrFunction<SharedElementRenderProps>
 }

/react-aria-components:Separator

 Separator {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
-  className?: string
+  className?: string = 'react-aria-Separator'
   elementType?: string
   id?: string
   orientation?: Orientation = 'horizontal'
   slot?: string | null
 }

/react-aria-components:Slider

 Slider <T extends number | Array<number>> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<SliderRenderProps>
-  className?: ClassNameOrFunction<SliderRenderProps>
+  className?: ClassNameOrFunction<SliderRenderProps> = 'react-aria-Slider'
   defaultValue?: T
   formatOptions?: Intl.NumberFormatOptions
   id?: string
   isDisabled?: boolean
   minValue?: number = 0
   onChange?: (T) => void
   onChangeEnd?: (T) => void
   orientation?: Orientation = 'horizontal'
   slot?: string | null
   step?: number = 1
   style?: StyleOrFunction<SliderRenderProps>
   value?: T
 }

/react-aria-components:SliderOutput

 SliderOutput {
   children?: ChildrenOrFunction<SliderRenderProps>
-  className?: ClassNameOrFunction<SliderRenderProps>
+  className?: ClassNameOrFunction<SliderRenderProps> = 'react-aria-SliderOutput'
   style?: StyleOrFunction<SliderRenderProps>
 }

/react-aria-components:SliderTrack

 SliderTrack {
   children?: ChildrenOrFunction<SliderTrackRenderProps>
-  className?: ClassNameOrFunction<SliderTrackRenderProps>
+  className?: ClassNameOrFunction<SliderTrackRenderProps> = 'react-aria-SliderTrack'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<SliderTrackRenderProps>

/react-aria-components:SliderThumb

 SliderThumb {
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SliderThumbRenderProps>
-  className?: ClassNameOrFunction<SliderThumbRenderProps>
+  className?: ClassNameOrFunction<SliderThumbRenderProps> = 'react-aria-SliderThumb'
   form?: string
   id?: string
   index?: number = 0
   inputRef?: RefObject<HTMLInputElement | null>
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   style?: StyleOrFunction<SliderThumbRenderProps>
 }

/react-aria-components:Switch

 Switch {
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SwitchRenderProps>
-  className?: ClassNameOrFunction<SwitchRenderProps>
+  className?: ClassNameOrFunction<SwitchRenderProps> = 'react-aria-Switch'
   defaultSelected?: boolean
   excludeFromTabOrder?: boolean
   form?: string
   id?: string
   isDisabled?: boolean
   isReadOnly?: boolean
   isSelected?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (boolean) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   slot?: string | null
   style?: StyleOrFunction<SwitchRenderProps>
   value?: string
 }

/react-aria-components:TableLoadMoreItem

 TableLoadMoreItem {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-TableLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: CSSProperties

/react-aria-components:Table

 Table {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode
-  className?: ClassNameOrFunction<TableRenderProps>
+  className?: ClassNameOrFunction<TableRenderProps> = 'react-aria-Table'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   disabledBehavior?: DisabledBehavior = "selection"
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   onRowAction?: (Key) => void
   onSelectionChange?: (Selection) => void
   onSortChange?: (SortDescriptor) => any
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   sortDescriptor?: SortDescriptor
   style?: StyleOrFunction<TableRenderProps>
 }

/react-aria-components:Row

 Row <T extends {}> {
   children?: ReactNode | ({}) => ReactElement
-  className?: ClassNameOrFunction<RowRenderProps>
+  className?: ClassNameOrFunction<RowRenderProps> = 'react-aria-Row'
   columns?: Iterable<{}>
   dependencies?: ReadonlyArray<any>
   download?: boolean | string
   href?: Href
   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
   style?: StyleOrFunction<RowRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: {}
 }

/react-aria-components:Cell

 Cell {
   children?: ChildrenOrFunction<CellRenderProps>
-  className?: ClassNameOrFunction<CellRenderProps>
+  className?: ClassNameOrFunction<CellRenderProps> = 'react-aria-Cell'
   colSpan?: number
   id?: Key
   style?: StyleOrFunction<CellRenderProps>
   textValue?: string

/react-aria-components:Column

 Column {
   allowsSorting?: boolean
   children?: ChildrenOrFunction<ColumnRenderProps>
-  className?: ClassNameOrFunction<ColumnRenderProps>
+  className?: ClassNameOrFunction<ColumnRenderProps> = 'react-aria-Column'
   defaultWidth?: ColumnSize | null
   id?: Key
   isRowHeader?: boolean
   maxWidth?: ColumnStaticSize | null
   style?: StyleOrFunction<ColumnRenderProps>
   textValue?: string
   width?: ColumnSize | null
 }

/react-aria-components:ColumnResizer

 ColumnResizer {
   aria-label?: string
   children?: ChildrenOrFunction<ColumnResizerRenderProps>
-  className?: ClassNameOrFunction<ColumnResizerRenderProps>
+  className?: ClassNameOrFunction<ColumnResizerRenderProps> = 'react-aria-ColumnResizer'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<ColumnResizerRenderProps>

/react-aria-components:TableHeader

 TableHeader <T extends {}> {
   children?: ReactNode | ({}) => ReactElement
-  className?: ClassNameOrFunction<TableHeaderRenderProps>
+  className?: ClassNameOrFunction<TableHeaderRenderProps> = 'react-aria-TableHeader'
   columns?: Iterable<{}>
   dependencies?: ReadonlyArray<any>
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   style?: StyleOrFunction<TableHeaderRenderProps>
 }

/react-aria-components:TableBody

 TableBody <T extends {}> {
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<TableBodyRenderProps>
+  className?: ClassNameOrFunction<TableBodyRenderProps> = 'react-aria-TableBody'
   dependencies?: ReadonlyArray<any>
   items?: Iterable<T>
   renderEmptyState?: (TableBodyRenderProps) => ReactNode
   style?: StyleOrFunction<TableBodyRenderProps>

/react-aria-components:ResizableTableContainer

 ResizableTableContainer {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-ResizableTableContainer'
   id?: string
   onResize?: (Map<Key, ColumnSize>) => void
   onResizeEnd?: (Map<Key, ColumnSize>) => void
   onResizeStart?: (Map<Key, ColumnSize>) => void
 }

/react-aria-components:Tabs

 Tabs {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<TabsRenderProps>
-  className?: ClassNameOrFunction<TabsRenderProps>
+  className?: ClassNameOrFunction<TabsRenderProps> = 'react-aria-Tabs'
   defaultSelectedKey?: Key
   disabledKeys?: Iterable<Key>
   id?: string
   isDisabled?: boolean
   onSelectionChange?: (Key) => void
   orientation?: Orientation = 'horizontal'
   selectedKey?: Key | null
   slot?: string | null
   style?: StyleOrFunction<TabsRenderProps>
 }

/react-aria-components:TabList

 TabList <T extends {}> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<TabListRenderProps>
+  className?: ClassNameOrFunction<TabListRenderProps> = 'react-aria-TabList'
   dependencies?: ReadonlyArray<any>
   items?: Iterable<T>
   style?: StyleOrFunction<TabListRenderProps>
 }

/react-aria-components:TabPanel

 TabPanel {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<TabPanelRenderProps>
-  className?: ClassNameOrFunction<TabPanelRenderProps>
+  className?: ClassNameOrFunction<TabPanelRenderProps> = 'react-aria-TabPanel'
   id?: Key
   shouldForceMount?: boolean = false
   style?: StyleOrFunction<TabPanelRenderProps>
 }

/react-aria-components:Tab

 Tab {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<TabRenderProps>
-  className?: ClassNameOrFunction<TabRenderProps>
+  className?: ClassNameOrFunction<TabRenderProps> = 'react-aria-Tab'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<TabRenderProps>
   target?: HTMLAttributeAnchorTarget
 }

/react-aria-components:TagGroup

 TagGroup {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-TagGroup'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   onRemove?: (Set<Key>) => void
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: CSSProperties
 }

/react-aria-components:TagList

 TagList <T extends {}> {
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<TagListRenderProps>
+  className?: ClassNameOrFunction<TagListRenderProps> = 'react-aria-TagList'
   dependencies?: ReadonlyArray<any>
   items?: Iterable<T>
   renderEmptyState?: (TagListRenderProps) => ReactNode
   style?: StyleOrFunction<TagListRenderProps>

/react-aria-components:Tag

 Tag {
   children?: ChildrenOrFunction<TagRenderProps>
-  className?: ClassNameOrFunction<TagRenderProps>
+  className?: ClassNameOrFunction<TagRenderProps> = 'react-aria-Tag'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<TagRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
 }

/react-aria-components:TextArea

 TextArea extends TextareaHTMLAttributes {
-  className?: ClassNameOrFunction<InputRenderProps>
+  className?: ClassNameOrFunction<InputRenderProps> = 'react-aria-TextArea'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<InputRenderProps>

/react-aria-components:TextField

 TextField {
   aria-activedescendant?: string
   aria-autocomplete?: 'none' | 'inline' | 'list' | 'both'
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-haspopup?: boolean | 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog'
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoCorrect?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<TextFieldRenderProps>
-  className?: ClassNameOrFunction<TextFieldRenderProps>
+  className?: ClassNameOrFunction<TextFieldRenderProps> = 'react-aria-TextField'
   defaultValue?: string
   enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'
   excludeFromTabOrder?: boolean
   form?: string
   inputMode?: 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search'
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxLength?: number
   minLength?: number
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<T>) => void
   onChange?: (T) => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<T>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   pattern?: string
   slot?: string | null
   spellCheck?: string
   style?: StyleOrFunction<TextFieldRenderProps>
   type?: 'text' | 'search' | 'url' | 'tel' | 'email' | 'password' | (string & {
   
 }) = 'text'
   validate?: (string) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string
 }

/react-aria-components:UNSTABLE_Toast

 UNSTABLE_Toast <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ToastRenderProps<T>>
-  className?: ClassNameOrFunction<ToastRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRenderProps<T>> = 'react-aria-Toast'
   style?: StyleOrFunction<ToastRenderProps<T>>
   toast: QueuedToast<T>
 }

/react-aria-components:UNSTABLE_ToastList

 UNSTABLE_ToastList <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string = "Notifications"
   aria-labelledby?: string
   children: ({
     toast: QueuedToast<T>
 }) => ReactElement
-  className?: ClassNameOrFunction<ToastRegionRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRegionRenderProps<T>> = 'react-aria-ToastRegion'
   style?: StyleOrFunction<ToastRegionRenderProps<T>>
 }

/react-aria-components:UNSTABLE_ToastRegion

 UNSTABLE_ToastRegion <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string = "Notifications"
   aria-labelledby?: string
   children: ReactNode | ({
     toast: QueuedToast<T>
 }) => ReactElement
-  className?: ClassNameOrFunction<ToastRegionRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRegionRenderProps<T>> = 'react-aria-ToastRegion'
   queue: ToastQueue<T>
   style?: StyleOrFunction<ToastRegionRenderProps<T>>
 }

/react-aria-components:ToggleButton

 ToggleButton {
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-disabled?: boolean | 'true' | 'false'
   aria-expanded?: boolean | 'true' | 'false'
   aria-haspopup?: boolean | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog' | 'true' | 'false'
   aria-label?: string
   aria-labelledby?: string
   aria-pressed?: boolean | 'true' | 'false' | 'mixed'
   autoFocus?: boolean
   children?: ChildrenOrFunction<ToggleButtonRenderProps>
-  className?: ClassNameOrFunction<ToggleButtonRenderProps>
+  className?: ClassNameOrFunction<ToggleButtonRenderProps> = 'react-aria-ToggleButton'
   defaultSelected?: boolean
   excludeFromTabOrder?: boolean
   id?: Key
   isDisabled?: boolean
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (boolean) => 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
   preventFocusOnPress?: boolean
   slot?: string | null
   style?: StyleOrFunction<ToggleButtonRenderProps>
 }

/react-aria-components:ToggleButtonGroup

 ToggleButtonGroup {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ToggleButtonGroupRenderProps>
-  className?: ClassNameOrFunction<ToggleButtonGroupRenderProps>
+  className?: ClassNameOrFunction<ToggleButtonGroupRenderProps> = 'react-aria-ToggleButtonGroup'
   defaultSelectedKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   isDisabled?: boolean
   onSelectionChange?: (Set<Key>) => void
   selectedKeys?: Iterable<Key>
   selectionMode?: 'single' | 'multiple' = 'single'
   slot?: string | null
   style?: StyleOrFunction<ToggleButtonGroupRenderProps>
 }

/react-aria-components:Toolbar

 Toolbar {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ToolbarRenderProps>
-  className?: ClassNameOrFunction<ToolbarRenderProps>
+  className?: ClassNameOrFunction<ToolbarRenderProps> = 'react-aria-Toolbar'
   orientation?: Orientation = 'horizontal'
   slot?: string | null
   style?: StyleOrFunction<ToolbarRenderProps>
 }

/react-aria-components:Tooltip

 Tooltip {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   arrowBoundaryOffset?: number = 0
   children?: ChildrenOrFunction<TooltipRenderProps>
-  className?: ClassNameOrFunction<TooltipRenderProps>
+  className?: ClassNameOrFunction<TooltipRenderProps> = 'react-aria-Tooltip'
   containerPadding?: number = 12
   crossOffset?: number = 0
   defaultOpen?: boolean
   isEntering?: boolean
   isOpen?: boolean
   offset?: number = 0
   onOpenChange?: (boolean) => void
   placement?: Placement = 'top'
   shouldFlip?: boolean = true
   style?: StyleOrFunction<TooltipRenderProps>
   triggerRef?: RefObject<Element | null>
 }

/react-aria-components:TreeLoadMoreItem

 TreeLoadMoreItem <T extends {}> {
   children?: ChildrenOrFunction<TreeLoadMoreItemRenderProps>
-  className?: ClassNameOrFunction<TreeLoadMoreItemRenderProps>
+  className?: ClassNameOrFunction<TreeLoadMoreItemRenderProps> = 'react-aria-TreeLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: StyleOrFunction<TreeLoadMoreItemRenderProps>

/react-aria-components:Tree

 Tree <T extends {}> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean | FocusStrategy
   children?: ReactNode | ({}) => ReactNode
-  className?: ClassNameOrFunction<TreeRenderProps>
+  className?: ClassNameOrFunction<TreeRenderProps> = 'react-aria-Tree'
   defaultExpandedKeys?: Iterable<Key>
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledBehavior?: DisabledBehavior = 'all'
   disallowEmptySelection?: boolean
   dragAndDropHooks?: DragAndDropHooks<NoInfer<{}>>
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   expandedKeys?: Iterable<Key>
   id?: string
   items?: Iterable<T>
   onAction?: (Key) => void
   onExpandedChange?: (Set<Key>) => any
   onSelectionChange?: (Selection) => void
   renderEmptyState?: (TreeEmptyStateRenderProps) => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: StyleOrFunction<TreeRenderProps>
 }

/react-aria-components:TreeItem

 TreeItem <T extends {}> {
   aria-label?: string
   children: ReactNode
-  className?: ClassNameOrFunction<TreeItemRenderProps>
+  className?: ClassNameOrFunction<TreeItemRenderProps> = 'react-aria-TreeItem'
   download?: boolean | string
   hasChildItems?: boolean
   href?: Href
   hrefLang?: string
   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
   style?: StyleOrFunction<TreeItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue: string
   value?: {}
 }

/react-aria-components:TreeItemContent

 TreeItemContent {
-  children?: ChildrenOrFunction<T>
+  children: ChildrenOrFunction<TreeItemContentRenderProps>
 }

/react-aria-components:DropIndicator

 DropIndicator {
   children?: ChildrenOrFunction<DropIndicatorRenderProps>
-  className?: ClassNameOrFunction<DropIndicatorRenderProps>
+  className?: ClassNameOrFunction<DropIndicatorRenderProps> = 'react-aria-DropIndicator'
   style?: StyleOrFunction<DropIndicatorRenderProps>
   target: DropTarget
 }

/react-aria-components:BreadcrumbsProps

 BreadcrumbsProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode | (T) => ReactNode
-  className?: string
+  className?: string = 'react-aria-Breadcrumbs'
   dependencies?: ReadonlyArray<any>
   id?: string
   isDisabled?: boolean
   items?: Iterable<T>
   slot?: string | null
   style?: CSSProperties
 }

/react-aria-components:BreadcrumbProps

 BreadcrumbProps {
   children?: ChildrenOrFunction<BreadcrumbRenderProps>
-  className?: ClassNameOrFunction<BreadcrumbRenderProps>
+  className?: ClassNameOrFunction<BreadcrumbRenderProps> = 'react-aria-Breadcrumb'
   id?: Key
   style?: StyleOrFunction<BreadcrumbRenderProps>
 }

/react-aria-components:ButtonProps

 ButtonProps {
   aria-controls?: string
   aria-current?: boolean | 'true' | 'false' | 'page' | 'step' | 'location' | 'date' | 'time'
   aria-describedby?: string
   aria-details?: string
   aria-disabled?: boolean | 'true' | 'false'
   aria-expanded?: boolean | 'true' | 'false'
   aria-haspopup?: boolean | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog' | 'true' | 'false'
   aria-label?: string
   aria-labelledby?: string
   aria-pressed?: boolean | 'true' | 'false' | 'mixed'
   autoFocus?: boolean
   children?: ChildrenOrFunction<ButtonRenderProps>
-  className?: ClassNameOrFunction<ButtonRenderProps>
+  className?: ClassNameOrFunction<ButtonRenderProps> = 'react-aria-Button'
   excludeFromTabOrder?: boolean
   form?: string
   formAction?: string
   formEncType?: string
   formNoValidate?: boolean
   formTarget?: string
   id?: string
   isDisabled?: boolean
   isPending?: boolean
   name?: string
   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
   preventFocusOnPress?: boolean
   slot?: string | null
   style?: StyleOrFunction<ButtonRenderProps>
   type?: 'button' | 'submit' | 'reset' = 'button'
   value?: string
 }

/react-aria-components:CalendarCellProps

 CalendarCellProps {
   children?: ChildrenOrFunction<CalendarCellRenderProps>
-  className?: ClassNameOrFunction<CalendarCellRenderProps>
+  className?: ClassNameOrFunction<CalendarCellRenderProps> = 'react-aria-CalendarCell'
   date: CalendarDate
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
 }

/react-aria-components:CalendarProps

 CalendarProps <T extends DateValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean = false
   children?: ChildrenOrFunction<CalendarRenderProps>
-  className?: ClassNameOrFunction<CalendarRenderProps>
+  className?: ClassNameOrFunction<CalendarRenderProps> = 'react-aria-Calendar'
   createCalendar?: (CalendarIdentifier) => Calendar
   defaultFocusedValue?: DateValue | null
   defaultValue?: DateValue | null
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean = false
   isInvalid?: boolean
   isReadOnly?: boolean = false
   maxValue?: DateValue | null
   minValue?: DateValue | null
   onChange?: (MappedDateValue<DateValue>) => void
   onFocusChange?: (CalendarDate) => void
   pageBehavior?: PageBehavior = visible
   selectionAlignment?: 'start' | 'center' | 'end' = 'center'
   slot?: string | null
   style?: StyleOrFunction<CalendarRenderProps>
   value?: DateValue | null
   visibleDuration?: DateDuration = {months: 1}
 }

/react-aria-components:CalendarGridProps

 CalendarGridProps {
   children?: ReactElement | Array<ReactElement> | (CalendarDate) => ReactElement
-  className?: string
+  className?: string = 'react-aria-CalendarGrid'
   offset?: DateDuration
   style?: CSSProperties
   weekdayStyle?: 'narrow' | 'short' | 'long' = "narrow"
 }

/react-aria-components:CalendarGridHeaderProps

 CalendarGridHeaderProps {
   children: (string) => ReactElement
-  className?: string
+  className?: string = 'react-aria-CalendarGridHeader'
   style?: CSSProperties
 }

/react-aria-components:CalendarGridBodyProps

 CalendarGridBodyProps {
   children: (CalendarDate) => ReactElement
-  className?: string
+  className?: string = 'react-aria-CalendarGridBody'
   style?: CSSProperties
 }

/react-aria-components:CalendarHeaderCellProps

 CalendarHeaderCellProps {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-CalendarHeaderCell'
   id?: string
   style?: CSSProperties
 }

/react-aria-components:RangeCalendarProps

 RangeCalendarProps <T extends DateValue> {
   allowsNonContiguousRanges?: boolean
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean = false
   children?: ChildrenOrFunction<RangeCalendarRenderProps>
-  className?: ClassNameOrFunction<RangeCalendarRenderProps>
+  className?: ClassNameOrFunction<RangeCalendarRenderProps> = 'react-aria-RangeCalendar'
   createCalendar?: (CalendarIdentifier) => Calendar
   defaultFocusedValue?: DateValue | null
   defaultValue?: RangeValue<DateValue> | null
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean = false
   isInvalid?: boolean
   isReadOnly?: boolean = false
   maxValue?: DateValue | null
   minValue?: DateValue | null
   onChange?: (RangeValue<MappedDateValue<DateValue>>) => void
   onFocusChange?: (CalendarDate) => void
   pageBehavior?: PageBehavior = visible
   selectionAlignment?: 'start' | 'center' | 'end' = 'center'
   slot?: string | null
   style?: StyleOrFunction<RangeCalendarRenderProps>
   value?: RangeValue<DateValue> | null
   visibleDuration?: DateDuration = {months: 1}
 }

/react-aria-components:CheckboxGroupProps

 CheckboxGroupProps {
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<CheckboxGroupRenderProps>
-  className?: ClassNameOrFunction<CheckboxGroupRenderProps>
+  className?: ClassNameOrFunction<CheckboxGroupRenderProps> = 'react-aria-CheckboxGroup'
   defaultValue?: Array<string>
   form?: string
   id?: string
   isDisabled?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (T) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   slot?: string | null
   style?: StyleOrFunction<CheckboxGroupRenderProps>
   validate?: (Array<string>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: Array<string>
 }

/react-aria-components:CheckboxProps

 CheckboxProps {
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<CheckboxRenderProps>
-  className?: ClassNameOrFunction<CheckboxRenderProps>
+  className?: ClassNameOrFunction<CheckboxRenderProps> = 'react-aria-Checkbox'
   defaultSelected?: boolean
   excludeFromTabOrder?: boolean
   form?: string
   id?: string
   isDisabled?: boolean
   isIndeterminate?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   isSelected?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (boolean) => 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
   slot?: string | null
   style?: StyleOrFunction<CheckboxRenderProps>
   validate?: (boolean) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string
 }

/react-aria-components:ColorAreaProps

 ColorAreaProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ColorAreaRenderProps>
-  className?: ClassNameOrFunction<ColorAreaRenderProps>
+  className?: ClassNameOrFunction<ColorAreaRenderProps> = 'react-aria-ColorArea'
   colorSpace?: ColorSpace
   defaultValue?: T
   form?: string
   id?: string
   onChange?: (Color) => void
   onChangeEnd?: (Color) => void
   slot?: string | null
   style?: StyleOrFunction<ColorAreaRenderProps>
   value?: T
   xChannel?: ColorChannel
   xName?: string
   yChannel?: ColorChannel
   yName?: string
 }

/react-aria-components:ColorFieldProps

 ColorFieldProps {
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   channel?: ColorChannel
   children?: ChildrenOrFunction<ColorFieldRenderProps>
-  className?: ClassNameOrFunction<ColorFieldRenderProps>
+  className?: ClassNameOrFunction<ColorFieldRenderProps> = 'react-aria-ColorField'
   colorSpace?: ColorSpace
   defaultValue?: T
   excludeFromTabOrder?: boolean
   form?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   isWheelDisabled?: boolean
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (Color | null) => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   slot?: string | null
   style?: StyleOrFunction<ColorFieldRenderProps>
   validate?: (Color | null) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: T
 }

/react-aria-components:ColorSliderProps

 ColorSliderProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   channel: ColorChannel
   children?: ChildrenOrFunction<ColorSliderRenderProps>
-  className?: ClassNameOrFunction<ColorSliderRenderProps>
+  className?: ClassNameOrFunction<ColorSliderRenderProps> = 'react-aria-ColorSlider'
   colorSpace?: ColorSpace
   defaultValue?: T
   form?: string
   id?: string
   name?: string
   onChange?: (Color) => void
   onChangeEnd?: (Color) => void
   orientation?: Orientation = 'horizontal'
   slot?: string | null
   style?: StyleOrFunction<ColorSliderRenderProps>
   value?: T
 }

/react-aria-components:ColorSwatchProps

 ColorSwatchProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
-  className?: ClassNameOrFunction<ColorSwatchRenderProps>
+  className?: ClassNameOrFunction<ColorSwatchRenderProps> = 'react-aria-ColorSwatch'
   color?: string | Color
   colorName?: string
   id?: string
   slot?: string | null
 }

/react-aria-components:ColorSwatchPickerProps

 ColorSwatchPickerProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode
-  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps>
+  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps> = 'react-aria-ColorSwatchPicker'
   defaultValue?: string | Color
   layout?: 'grid' | 'stack' = 'grid'
   onChange?: (Color) => void
   style?: StyleOrFunction<ColorSwatchPickerRenderProps>
 }

/react-aria-components:ColorSwatchPickerItemProps

 ColorSwatchPickerItemProps {
   children?: ChildrenOrFunction<ColorSwatchPickerItemRenderProps>
-  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps>
+  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps> = 'react-aria-ColorSwatchPickerItem'
   color: string | Color
   isDisabled?: boolean
   onClick?: (MouseEvent<FocusableElement>) => void
   onHoverChange?: (boolean) => void
   onHoverStart?: (HoverEvent) => void
   onPress?: (PressEvent) => void
   onPressChange?: (boolean) => void
   onPressEnd?: (PressEvent) => void
   onPressStart?: (PressEvent) => void
   onPressUp?: (PressEvent) => void
   style?: StyleOrFunction<ColorSwatchPickerItemRenderProps>
 }

/react-aria-components:ColorThumbProps

 ColorThumbProps {
   children?: ChildrenOrFunction<ColorThumbRenderProps>
-  className?: ClassNameOrFunction<ColorThumbRenderProps>
+  className?: ClassNameOrFunction<ColorThumbRenderProps> = 'react-aria-ColorThumb'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<ColorThumbRenderProps>

/react-aria-components:ColorPickerProps

 ColorPickerProps {
-  children?: ChildrenOrFunction<T>
+  children: ChildrenOrFunction<ColorPickerRenderProps>
   defaultValue?: string | Color
   onChange?: (Color) => void
   slot?: string | null
   value?: string | Color

/react-aria-components:ColorWheelProps

 ColorWheelProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ColorWheelRenderProps>
-  className?: ClassNameOrFunction<ColorWheelRenderProps>
+  className?: ClassNameOrFunction<ColorWheelRenderProps> = 'react-aria-ColorWheel'
   defaultValue?: string | Color = 'hsl(0, 100%, 50%)'
   form?: string
   id?: string
   innerRadius: number
   name?: string
   onChange?: (Color) => void
   onChangeEnd?: (Color) => void
   outerRadius: number
   slot?: string | null
   style?: StyleOrFunction<ColorWheelRenderProps>
   value?: T
 }

/react-aria-components:ColorWheelTrackProps

 ColorWheelTrackProps {
-  className?: ClassNameOrFunction<ColorWheelTrackRenderProps>
+  className?: ClassNameOrFunction<ColorWheelTrackRenderProps> = 'react-aria-ColorWheelTrack'
   style?: StyleOrFunction<ColorWheelTrackRenderProps>
 }

/react-aria-components:ComboBoxProps

 ComboBoxProps <T extends {}> {
   allowsCustomValue?: boolean
   allowsEmptyCollection?: boolean
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<ComboBoxRenderProps>
-  className?: ClassNameOrFunction<ComboBoxRenderProps>
+  className?: ClassNameOrFunction<ComboBoxRenderProps> = 'react-aria-ComboBox'
   defaultFilter?: (string, string) => boolean
   defaultInputValue?: string
   defaultItems?: Iterable<T>
   defaultSelectedKey?: Key
   form?: string
   formValue?: 'text' | 'key' = 'key'
   id?: string
   inputValue?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   items?: Iterable<T>
   menuTrigger?: MenuTriggerAction = 'input'
   name?: string
   onBlur?: (FocusEvent<HTMLInputElement>) => void
   onFocus?: (FocusEvent<HTMLInputElement>) => void
   onFocusChange?: (boolean) => void
   onInputChange?: (string) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean, MenuTriggerAction) => void
   onSelectionChange?: (Key | null) => void
   selectedKey?: Key | null
   shouldFocusWrap?: boolean
   slot?: string | null
   style?: StyleOrFunction<ComboBoxRenderProps>
   validate?: (ComboBoxValidationValue) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
 }

/react-aria-components:DateFieldProps

 DateFieldProps <T extends DateValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DateFieldRenderProps>
-  className?: ClassNameOrFunction<DateFieldRenderProps>
+  className?: ClassNameOrFunction<DateFieldRenderProps> = 'react-aria-DateField'
   defaultValue?: DateValue | null
   form?: string
   granularity?: Granularity
   hideTimeZone?: boolean = false
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: DateValue | null
   minValue?: DateValue | null
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (MappedDateValue<DateValue> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   placeholderValue?: DateValue | null
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   style?: StyleOrFunction<DateFieldRenderProps>
   validate?: (MappedDateValue<DateValue>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: DateValue | null
 }

/react-aria-components:DateInputProps

 DateInputProps {
   children: (DateSegment) => ReactElement
-  className?: ClassNameOrFunction<DateInputRenderProps>
+  className?: ClassNameOrFunction<DateInputRenderProps> = 'react-aria-DateInput'
   slot?: string | null
   style?: StyleOrFunction<DateInputRenderProps>
 }

/react-aria-components:DateSegmentProps

 DateSegmentProps {
   children?: ChildrenOrFunction<DateSegmentRenderProps>
-  className?: ClassNameOrFunction<DateSegmentRenderProps>
+  className?: ClassNameOrFunction<DateSegmentRenderProps> = 'react-aria-DateSegment'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   segment: DateSegment
 }

/react-aria-components:TimeFieldProps

 TimeFieldProps <T extends TimeValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DateFieldRenderProps>
-  className?: ClassNameOrFunction<DateFieldRenderProps>
+  className?: ClassNameOrFunction<DateFieldRenderProps> = 'react-aria-TimeField'
   defaultValue?: TimeValue | null
   form?: string
   granularity?: 'hour' | 'minute' | 'second' = 'minute'
   hideTimeZone?: boolean
   id?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: TimeValue | null
   minValue?: TimeValue | null
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (MappedTimeValue<TimeValue> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   placeholderValue?: TimeValue
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   style?: StyleOrFunction<DateFieldRenderProps>
   validate?: (MappedTimeValue<TimeValue>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: TimeValue | null
 }

/react-aria-components:DatePickerProps

 DatePickerProps <T extends DateValue> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DatePickerRenderProps>
-  className?: ClassNameOrFunction<DatePickerRenderProps>
+  className?: ClassNameOrFunction<DatePickerRenderProps> = 'react-aria-DatePicker'
   defaultOpen?: boolean
   defaultValue?: DateValue | null
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   form?: string
   hideTimeZone?: boolean = false
   hourCycle?: number | number
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean
   isInvalid?: boolean
   isOpen?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: DateValue | null
   minValue?: DateValue | null
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (MappedDateValue<DateValue> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean) => void
   pageBehavior?: PageBehavior = visible
   placeholderValue?: DateValue | null
   shouldCloseOnSelect?: boolean | () => boolean = true
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   style?: StyleOrFunction<DatePickerRenderProps>
   validate?: (MappedDateValue<DateValue>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: DateValue | null
 }

/react-aria-components:DateRangePickerProps

 DateRangePickerProps <T extends DateValue> {
   allowsNonContiguousRanges?: boolean
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<DateRangePickerRenderProps>
-  className?: ClassNameOrFunction<DateRangePickerRenderProps>
+  className?: ClassNameOrFunction<DateRangePickerRenderProps> = 'react-aria-DateRangePicker'
   defaultOpen?: boolean
   defaultValue?: RangeValue<DateValue> | null
   endName?: string
   firstDayOfWeek?: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat'
   granularity?: Granularity
   hideTimeZone?: boolean = false
   hourCycle?: number | number
   id?: string
   isDateUnavailable?: (DateValue) => boolean
   isDisabled?: boolean
   isInvalid?: boolean
   isOpen?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxValue?: DateValue | null
   minValue?: DateValue | null
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (RangeValue<MappedDateValue<DateValue>> | null) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean) => void
   pageBehavior?: PageBehavior = visible
   placeholderValue?: DateValue | null
   shouldCloseOnSelect?: boolean | () => boolean = true
   shouldForceLeadingZeros?: boolean
   slot?: string | null
   startName?: string
   style?: StyleOrFunction<DateRangePickerRenderProps>
   validate?: (RangeValue<MappedDateValue<DateValue>>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: RangeValue<DateValue> | null
 }

/react-aria-components:DialogProps

 DialogProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode | (DialogRenderProps) => ReactNode
-  className?: string
+  className?: string = 'react-aria-Dialog'
   id?: string
   role?: 'dialog' | 'alertdialog' = 'dialog'
   slot?: string | null
   style?: CSSProperties

/react-aria-components:DisclosureProps

 DisclosureProps {
   children?: ChildrenOrFunction<DisclosureRenderProps>
-  className?: ClassNameOrFunction<DisclosureRenderProps>
+  className?: ClassNameOrFunction<DisclosureRenderProps> = 'react-aria-Disclosure'
   defaultExpanded?: boolean
   id?: Key
   isDisabled?: boolean
   isExpanded?: boolean
   slot?: string | null
   style?: StyleOrFunction<DisclosureRenderProps>
 }

/react-aria-components:DisclosurePanelProps

 DisclosurePanelProps {
   children: ReactNode
-  className?: ClassNameOrFunction<DisclosurePanelRenderProps>
+  className?: ClassNameOrFunction<DisclosurePanelRenderProps> = 'react-aria-DisclosurePanel'
   id?: string
   role?: 'group' | 'region' = 'group'
   style?: StyleOrFunction<DisclosurePanelRenderProps>
 }

/react-aria-components:DisclosureGroupProps

 DisclosureGroupProps {
   allowsMultipleExpanded?: boolean
   children?: ChildrenOrFunction<DisclosureGroupRenderProps>
-  className?: ClassNameOrFunction<DisclosureGroupRenderProps>
+  className?: ClassNameOrFunction<DisclosureGroupRenderProps> = 'react-aria-DisclosureGroup'
   defaultExpandedKeys?: Iterable<Key>
   expandedKeys?: Iterable<Key>
   id?: string
   isDisabled?: boolean
   style?: StyleOrFunction<DisclosureGroupRenderProps>
 }

/react-aria-components:DropZoneProps

 DropZoneProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<DropZoneRenderProps>
-  className?: ClassNameOrFunction<DropZoneRenderProps>
+  className?: ClassNameOrFunction<DropZoneRenderProps> = 'react-aria-DropZone'
   getDropOperation?: (DragTypes, Array<DropOperation>) => DropOperation
   isDisabled?: boolean
   onDrop?: (DropEvent) => void
   onDropActivate?: (DropActivateEvent) => void
   onDropExit?: (DropExitEvent) => void
   onDropMove?: (DropMoveEvent) => void
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   slot?: string | null
   style?: StyleOrFunction<DropZoneRenderProps>
 }

/react-aria-components:FieldErrorProps

 FieldErrorProps {
   children?: ChildrenOrFunction<FieldErrorRenderProps>
-  className?: ClassNameOrFunction<FieldErrorRenderProps>
+  className?: ClassNameOrFunction<FieldErrorRenderProps> = 'react-aria-FieldError'
   id?: string
   style?: StyleOrFunction<FieldErrorRenderProps>
 }

/react-aria-components:FormProps

 FormProps {
   action?: string | FormHTMLAttributes<HTMLFormElement>['action']
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoCapitalize?: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'
   autoComplete?: 'off' | 'on'
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-Form'
   encType?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain'
   id?: string
   method?: 'get' | 'post' | 'dialog'
   onInvalid?: (FormEvent<HTMLFormElement>) => void
   onSubmit?: (FormEvent<HTMLFormElement>) => void
   role?: 'search' | 'presentation'
   style?: CSSProperties
   target?: '_blank' | '_self' | '_parent' | '_top'
   validationBehavior?: 'aria' | 'native' = 'native'
   validationErrors?: ValidationErrors
 }

/react-aria-components:GridListProps

 GridListProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean | FocusStrategy
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<GridListRenderProps>
+  className?: ClassNameOrFunction<GridListRenderProps> = 'react-aria-GridList'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledBehavior?: DisabledBehavior = "all"
   disabledKeys?: Iterable<Key>
   disallowTypeAhead?: boolean = false
   dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   id?: string
   items?: Iterable<T>
   keyboardNavigationBehavior?: 'arrow' | 'tab' = 'arrow'
   layout?: 'stack' | 'grid' = 'stack'
   onAction?: (Key) => void
   onSelectionChange?: (Selection) => void
   renderEmptyState?: (GridListRenderProps) => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: StyleOrFunction<GridListRenderProps>
 }

/react-aria-components:GridListItemProps

 GridListItemProps <T = {}> {
   children?: ChildrenOrFunction<GridListItemRenderProps>
-  className?: ClassNameOrFunction<GridListItemRenderProps>
+  className?: ClassNameOrFunction<GridListItemRenderProps> = 'react-aria-GridListItem'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<GridListItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: T
 }

/react-aria-components:GridListLoadMoreItemProps

 GridListLoadMoreItemProps {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-GridListLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: CSSProperties

/react-aria-components:GroupProps

 GroupProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<GroupRenderProps>
-  className?: ClassNameOrFunction<GroupRenderProps>
+  className?: ClassNameOrFunction<GroupRenderProps> = 'react-aria-Group'
   id?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   role?: 'group' | 'region' | 'presentation' = 'group'
   slot?: string | null
   style?: StyleOrFunction<GroupRenderProps>
 }

/react-aria-components:InputProps

 InputProps {
-  className?: ClassNameOrFunction<InputRenderProps>
+  className?: ClassNameOrFunction<InputRenderProps> = 'react-aria-Input'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   placeholder?: string
 }

/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>
+  className?: ClassNameOrFunction<LinkRenderProps> = 'react-aria-Link'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   isDisabled?: boolean
   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
   ping?: string
   referrerPolicy?: HTMLAttributeReferrerPolicy
   rel?: string
   routerOptions?: RouterOptions
   slot?: string | null
   style?: StyleOrFunction<LinkRenderProps>
   target?: HTMLAttributeAnchorTarget
 }

/react-aria-components:ListBoxProps

 ListBoxProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean | FocusStrategy
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<ListBoxRenderProps>
+  className?: ClassNameOrFunction<ListBoxRenderProps> = 'react-aria-ListBox'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   id?: string
   items?: Iterable<T>
   layout?: 'stack' | 'grid' = 'stack'
   onAction?: (Key) => void
   onBlur?: (FocusEvent<Target>) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onSelectionChange?: (Selection) => void
   orientation?: Orientation = 'vertical'
   renderEmptyState?: (ListBoxRenderProps) => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldFocusOnHover?: boolean
   shouldFocusWrap?: boolean
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: StyleOrFunction<ListBoxRenderProps>
 }

/react-aria-components:ListBoxItemProps

 ListBoxItemProps <T = {}> {
   aria-label?: string
   children?: ChildrenOrFunction<ListBoxItemRenderProps>
-  className?: ClassNameOrFunction<ListBoxItemRenderProps>
+  className?: ClassNameOrFunction<ListBoxItemRenderProps> = 'react-aria-ListBoxItem'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<ListBoxItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: T
 }

/react-aria-components:ListBoxSectionProps

 ListBoxSectionProps <T> {
   aria-label?: string
   children?: ReactNode | (T) => ReactElement
-  className?: string
+  className?: string = 'react-aria-ListBoxSection'
   dependencies?: ReadonlyArray<any>
   id?: Key
   items?: Iterable<T>
   style?: CSSProperties
 }

/react-aria-components:ListBoxLoadMoreItemProps

 ListBoxLoadMoreItemProps {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-ListBoxLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: CSSProperties

/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>
+  className?: ClassNameOrFunction<MenuRenderProps> = 'react-aria-Menu'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   id?: string
   items?: Iterable<T>
   onAction?: (Key) => void
   onClose?: () => void
   onSelectionChange?: (Selection) => void
   renderEmptyState?: () => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   shouldFocusWrap?: boolean
   slot?: string | null
   style?: StyleOrFunction<MenuRenderProps>
 }

/react-aria-components:MenuItemProps

 MenuItemProps <T = {}> {
   aria-label?: string
   children?: ChildrenOrFunction<MenuItemRenderProps>
-  className?: ClassNameOrFunction<MenuItemRenderProps>
+  className?: ClassNameOrFunction<MenuItemRenderProps> = 'react-aria-MenuItem'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<MenuItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: T
 }

/react-aria-components:MenuSectionProps

 MenuSectionProps <T> {
   aria-label?: string
   children?: ReactNode | (T) => ReactElement
-  className?: string
+  className?: string = 'react-aria-MenuSection'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   items?: Iterable<T>
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   style?: CSSProperties
   value?: T
 }

/react-aria-components:MeterProps

 MeterProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<MeterRenderProps>
-  className?: ClassNameOrFunction<MeterRenderProps>
+  className?: ClassNameOrFunction<MeterRenderProps> = 'react-aria-Meter'
   formatOptions?: Intl.NumberFormatOptions = {style: 'percent'}
   id?: string
   maxValue?: number = 100
   minValue?: number = 0
   style?: StyleOrFunction<MeterRenderProps>
   value?: number = 0
   valueLabel?: ReactNode
 }

/react-aria-components:ModalOverlayProps

 ModalOverlayProps {
   children?: ChildrenOrFunction<ModalRenderProps>
-  className?: ClassNameOrFunction<ModalRenderProps>
+  className?: ClassNameOrFunction<ModalRenderProps> = 'react-aria-ModalOverlay'
   defaultOpen?: boolean
   isDismissable?: boolean = false
   isEntering?: boolean
   isExiting?: boolean
   isOpen?: boolean
   onOpenChange?: (boolean) => void
   shouldCloseOnInteractOutside?: (Element) => boolean
   slot?: string | null
   style?: StyleOrFunction<ModalRenderProps>
 }

/react-aria-components:NumberFieldProps

 NumberFieldProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<NumberFieldRenderProps>
-  className?: ClassNameOrFunction<NumberFieldRenderProps>
+  className?: ClassNameOrFunction<NumberFieldRenderProps> = 'react-aria-NumberField'
   decrementAriaLabel?: string
   defaultValue?: number
   form?: string
   formatOptions?: Intl.NumberFormatOptions
   incrementAriaLabel?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   isWheelDisabled?: boolean
   maxValue?: number
   minValue?: number
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (T) => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   slot?: string | null
   step?: number
   style?: StyleOrFunction<NumberFieldRenderProps>
   validate?: (number) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: number
 }

/react-aria-components:OverlayArrowProps

 OverlayArrowProps {
   children?: ChildrenOrFunction<OverlayArrowRenderProps>
-  className?: ClassNameOrFunction<OverlayArrowRenderProps>
+  className?: ClassNameOrFunction<OverlayArrowRenderProps> = 'react-aria-OverlayArrow'
   id?: string
   style?: StyleOrFunction<OverlayArrowRenderProps>
 }

/react-aria-components:PopoverProps

 PopoverProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   arrowBoundaryOffset?: number = 0
   arrowRef?: RefObject<Element | null>
   boundaryElement?: Element = document.body
   children?: ChildrenOrFunction<PopoverRenderProps>
-  className?: ClassNameOrFunction<PopoverRenderProps>
+  className?: ClassNameOrFunction<PopoverRenderProps> = 'react-aria-Popover'
   containerPadding?: number = 12
   crossOffset?: number = 0
   defaultOpen?: boolean
   isEntering?: boolean
   isKeyboardDismissDisabled?: boolean = false
   isNonModal?: boolean
   isOpen?: boolean
   maxHeight?: number
   offset?: number = 8
   onOpenChange?: (boolean) => void
   placement?: Placement = 'bottom'
   scrollRef?: RefObject<Element | null> = overlayRef
   shouldCloseOnInteractOutside?: (Element) => boolean
   shouldFlip?: boolean = true
   shouldUpdatePosition?: boolean = true
   slot?: string | null
   style?: StyleOrFunction<PopoverRenderProps>
   trigger?: string
   triggerRef?: RefObject<Element | null>
 }

/react-aria-components:ProgressBarProps

 ProgressBarProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ProgressBarRenderProps>
-  className?: ClassNameOrFunction<ProgressBarRenderProps>
+  className?: ClassNameOrFunction<ProgressBarRenderProps> = 'react-aria-ProgressBar'
   formatOptions?: Intl.NumberFormatOptions = {style: 'percent'}
   id?: string
   isIndeterminate?: boolean
   maxValue?: number = 100
   slot?: string | null
   style?: StyleOrFunction<ProgressBarRenderProps>
   value?: number = 0
   valueLabel?: ReactNode
 }

/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>
+  className?: ClassNameOrFunction<RadioGroupRenderProps> = 'react-aria-RadioGroup'
   defaultValue?: string | null
   form?: string
   id?: string
   isDisabled?: 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 | null) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string | null
 }

/react-aria-components:RadioProps

 RadioProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<RadioRenderProps>
-  className?: ClassNameOrFunction<RadioRenderProps>
+  className?: ClassNameOrFunction<RadioRenderProps> = 'react-aria-Radio'
   id?: string
   inputRef?: RefObject<HTMLInputElement | null>
   isDisabled?: boolean
   onBlur?: (FocusEvent<Target>) => 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
   slot?: string | null
   style?: StyleOrFunction<RadioRenderProps>
   value: string
 }

/react-aria-components:SearchFieldProps

 SearchFieldProps {
   aria-activedescendant?: string
   aria-autocomplete?: 'none' | 'inline' | 'list' | 'both'
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-haspopup?: boolean | 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog'
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoCorrect?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SearchFieldRenderProps>
-  className?: ClassNameOrFunction<SearchFieldRenderProps>
+  className?: ClassNameOrFunction<SearchFieldRenderProps> = 'react-aria-SearchField'
   defaultValue?: string
   enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'
   excludeFromTabOrder?: boolean
   form?: string
   inputMode?: 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search'
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxLength?: number
   minLength?: number
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<T>) => void
   onChange?: (T) => void
   onClear?: () => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<T>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   onSubmit?: (string) => void
   pattern?: string
   slot?: string | null
   spellCheck?: string
   style?: StyleOrFunction<SearchFieldRenderProps>
   type?: 'text' | 'search' | 'url' | 'tel' | 'email' | 'password' | (string & {
   
 }) = 'search'
   validate?: (string) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string
 }

/react-aria-components:SelectProps

 SelectProps <M extends SelectionMode = 'single', T extends {} = {
   
 }> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SelectRenderProps>
-  className?: ClassNameOrFunction<SelectRenderProps>
+  className?: ClassNameOrFunction<SelectRenderProps> = 'react-aria-Select'
   defaultOpen?: boolean
   defaultValue?: ValueType<SelectionMode>
   disabledKeys?: Iterable<Key>
   excludeFromTabOrder?: boolean
   id?: string
   isDisabled?: boolean
   isInvalid?: boolean
   isOpen?: boolean
   isRequired?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (T) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onOpenChange?: (boolean) => void
   placeholder?: string = 'Select an item' (localized)
   selectionMode?: SelectionMode = 'single'
   slot?: string | null
   style?: StyleOrFunction<SelectRenderProps>
   validate?: (ValidationType<SelectionMode>) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: ValueType<SelectionMode>
 }

/react-aria-components:SelectValueProps

 SelectValueProps <T extends {}> {
   children?: ChildrenOrFunction<SelectValueRenderProps<{}>>
-  className?: ClassNameOrFunction<SelectValueRenderProps<{}>>
+  className?: ClassNameOrFunction<SelectValueRenderProps<{}>> = 'react-aria-SelectValue'
   style?: StyleOrFunction<SelectValueRenderProps<{}>>
 }

/react-aria-components:SelectionIndicatorProps

 SelectionIndicatorProps {
   children?: ChildrenOrFunction<SharedElementRenderProps>
-  className?: ClassNameOrFunction<SharedElementRenderProps>
+  className?: ClassNameOrFunction<SharedElementRenderProps> = 'react-aria-SelectionIndicator'
   isSelected?: boolean
   style?: StyleOrFunction<SharedElementRenderProps>
 }

/react-aria-components:SeparatorProps

 SeparatorProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
-  className?: string
+  className?: string = 'react-aria-Separator'
   elementType?: string
   id?: string
   orientation?: Orientation = 'horizontal'
   slot?: string | null
 }

/react-aria-components:SliderOutputProps

 SliderOutputProps {
   children?: ChildrenOrFunction<SliderRenderProps>
-  className?: ClassNameOrFunction<SliderRenderProps>
+  className?: ClassNameOrFunction<SliderRenderProps> = 'react-aria-SliderOutput'
   style?: StyleOrFunction<SliderRenderProps>
 }

/react-aria-components:SliderProps

 SliderProps <T = number | Array<number>> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<SliderRenderProps>
-  className?: ClassNameOrFunction<SliderRenderProps>
+  className?: ClassNameOrFunction<SliderRenderProps> = 'react-aria-Slider'
   defaultValue?: T
   formatOptions?: Intl.NumberFormatOptions
   id?: string
   isDisabled?: boolean
   minValue?: number = 0
   onChange?: (T) => void
   onChangeEnd?: (T) => void
   orientation?: Orientation = 'horizontal'
   slot?: string | null
   step?: number = 1
   style?: StyleOrFunction<SliderRenderProps>
   value?: T
 }

/react-aria-components:SliderThumbProps

 SliderThumbProps {
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SliderThumbRenderProps>
-  className?: ClassNameOrFunction<SliderThumbRenderProps>
+  className?: ClassNameOrFunction<SliderThumbRenderProps> = 'react-aria-SliderThumb'
   form?: string
   id?: string
   index?: number = 0
   inputRef?: RefObject<HTMLInputElement | null>
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   style?: StyleOrFunction<SliderThumbRenderProps>
 }

/react-aria-components:SliderTrackProps

 SliderTrackProps {
   children?: ChildrenOrFunction<SliderTrackRenderProps>
-  className?: ClassNameOrFunction<SliderTrackRenderProps>
+  className?: ClassNameOrFunction<SliderTrackRenderProps> = 'react-aria-SliderTrack'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<SliderTrackRenderProps>

/react-aria-components:SwitchProps

 SwitchProps {
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<SwitchRenderProps>
-  className?: ClassNameOrFunction<SwitchRenderProps>
+  className?: ClassNameOrFunction<SwitchRenderProps> = 'react-aria-Switch'
   defaultSelected?: boolean
   excludeFromTabOrder?: boolean
   form?: string
   id?: string
   isDisabled?: boolean
   isReadOnly?: boolean
   isSelected?: boolean
   name?: string
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (boolean) => void
   onFocus?: (FocusEvent<Target>) => void
   onFocusChange?: (boolean) => void
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   slot?: string | null
   style?: StyleOrFunction<SwitchRenderProps>
   value?: string
 }

/react-aria-components:TableProps

 TableProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode
-  className?: ClassNameOrFunction<TableRenderProps>
+  className?: ClassNameOrFunction<TableRenderProps> = 'react-aria-Table'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   disabledBehavior?: DisabledBehavior = "selection"
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   onRowAction?: (Key) => void
   onSelectionChange?: (Selection) => void
   onSortChange?: (SortDescriptor) => any
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   sortDescriptor?: SortDescriptor
   style?: StyleOrFunction<TableRenderProps>
 }

/react-aria-components:TableHeaderProps

 TableHeaderProps <T> {
   children?: ReactNode | (T) => ReactElement
-  className?: ClassNameOrFunction<TableHeaderRenderProps>
+  className?: ClassNameOrFunction<TableHeaderRenderProps> = 'react-aria-TableHeader'
   columns?: Iterable<T>
   dependencies?: ReadonlyArray<any>
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   style?: StyleOrFunction<TableHeaderRenderProps>
 }

/react-aria-components:TableBodyProps

 TableBodyProps <T> {
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<TableBodyRenderProps>
+  className?: ClassNameOrFunction<TableBodyRenderProps> = 'react-aria-TableBody'
   dependencies?: ReadonlyArray<any>
   items?: Iterable<T>
   renderEmptyState?: (TableBodyRenderProps) => ReactNode
   style?: StyleOrFunction<TableBodyRenderProps>

/react-aria-components:ResizableTableContainerProps

 ResizableTableContainerProps {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-ResizableTableContainer'
   id?: string
   onResize?: (Map<Key, ColumnSize>) => void
   onResizeEnd?: (Map<Key, ColumnSize>) => void
   onResizeStart?: (Map<Key, ColumnSize>) => void
 }

/react-aria-components:ColumnProps

 ColumnProps {
   allowsSorting?: boolean
   children?: ChildrenOrFunction<ColumnRenderProps>
-  className?: ClassNameOrFunction<ColumnRenderProps>
+  className?: ClassNameOrFunction<ColumnRenderProps> = 'react-aria-Column'
   defaultWidth?: ColumnSize | null
   id?: Key
   isRowHeader?: boolean
   maxWidth?: ColumnStaticSize | null
   style?: StyleOrFunction<ColumnRenderProps>
   textValue?: string
   width?: ColumnSize | null
 }

/react-aria-components:ColumnResizerProps

 ColumnResizerProps {
   aria-label?: string
   children?: ChildrenOrFunction<ColumnResizerRenderProps>
-  className?: ClassNameOrFunction<ColumnResizerRenderProps>
+  className?: ClassNameOrFunction<ColumnResizerRenderProps> = 'react-aria-ColumnResizer'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<ColumnResizerRenderProps>

/react-aria-components:RowProps

 RowProps <T> {
   children?: ReactNode | (T) => ReactElement
-  className?: ClassNameOrFunction<RowRenderProps>
+  className?: ClassNameOrFunction<RowRenderProps> = 'react-aria-Row'
   columns?: Iterable<T>
   dependencies?: ReadonlyArray<any>
   download?: boolean | string
   href?: Href
   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
   style?: StyleOrFunction<RowRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
   value?: T
 }

/react-aria-components:CellProps

 CellProps {
   children?: ChildrenOrFunction<CellRenderProps>
-  className?: ClassNameOrFunction<CellRenderProps>
+  className?: ClassNameOrFunction<CellRenderProps> = 'react-aria-Cell'
   colSpan?: number
   id?: Key
   style?: StyleOrFunction<CellRenderProps>
   textValue?: string

/react-aria-components:TableLoadMoreItemProps

 TableLoadMoreItemProps {
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-TableLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: CSSProperties

/react-aria-components:TabListProps

 TabListProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<TabListRenderProps>
+  className?: ClassNameOrFunction<TabListRenderProps> = 'react-aria-TabList'
   dependencies?: ReadonlyArray<any>
   items?: Iterable<T>
   style?: StyleOrFunction<TabListRenderProps>
 }

/react-aria-components:TabPanelProps

 TabPanelProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<TabPanelRenderProps>
-  className?: ClassNameOrFunction<TabPanelRenderProps>
+  className?: ClassNameOrFunction<TabPanelRenderProps> = 'react-aria-TabPanel'
   id?: Key
   shouldForceMount?: boolean = false
   style?: StyleOrFunction<TabPanelRenderProps>
 }

/react-aria-components:TabProps

 TabProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<TabRenderProps>
-  className?: ClassNameOrFunction<TabRenderProps>
+  className?: ClassNameOrFunction<TabRenderProps> = 'react-aria-Tab'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<TabRenderProps>
   target?: HTMLAttributeAnchorTarget
 }

/react-aria-components:TabsProps

 TabsProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<TabsRenderProps>
-  className?: ClassNameOrFunction<TabsRenderProps>
+  className?: ClassNameOrFunction<TabsRenderProps> = 'react-aria-Tabs'
   defaultSelectedKey?: Key
   disabledKeys?: Iterable<Key>
   id?: string
   isDisabled?: boolean
   onSelectionChange?: (Key) => void
   orientation?: Orientation = 'horizontal'
   selectedKey?: Key | null
   slot?: string | null
   style?: StyleOrFunction<TabsRenderProps>
 }

/react-aria-components:TagGroupProps

 TagGroupProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ReactNode
-  className?: string
+  className?: string = 'react-aria-TagGroup'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   onRemove?: (Set<Key>) => void
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: CSSProperties
 }

/react-aria-components:TagListProps

 TagListProps <T> {
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<TagListRenderProps>
+  className?: ClassNameOrFunction<TagListRenderProps> = 'react-aria-TagList'
   dependencies?: ReadonlyArray<any>
   items?: Iterable<T>
   renderEmptyState?: (TagListRenderProps) => ReactNode
   style?: StyleOrFunction<TagListRenderProps>

/react-aria-components:TagProps

 TagProps {
   children?: ChildrenOrFunction<TagRenderProps>
-  className?: ClassNameOrFunction<TagRenderProps>
+  className?: ClassNameOrFunction<TagRenderProps> = 'react-aria-Tag'
   download?: boolean | string
   href?: Href
   hrefLang?: string
   id?: Key
   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
   style?: StyleOrFunction<TagRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue?: string
 }

/react-aria-components:TextAreaProps

 TextAreaProps {
-  className?: ClassNameOrFunction<InputRenderProps>
+  className?: ClassNameOrFunction<InputRenderProps> = 'react-aria-TextArea'
   onHoverChange?: (boolean) => void
   onHoverEnd?: (HoverEvent) => void
   onHoverStart?: (HoverEvent) => void
   style?: StyleOrFunction<InputRenderProps>

/react-aria-components:TextFieldProps

 TextFieldProps {
   aria-activedescendant?: string
   aria-autocomplete?: 'none' | 'inline' | 'list' | 'both'
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-errormessage?: string
   aria-haspopup?: boolean | 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog'
   aria-label?: string
   aria-labelledby?: string
   autoComplete?: string
   autoCorrect?: string
   autoFocus?: boolean
   children?: ChildrenOrFunction<TextFieldRenderProps>
-  className?: ClassNameOrFunction<TextFieldRenderProps>
+  className?: ClassNameOrFunction<TextFieldRenderProps> = 'react-aria-TextField'
   defaultValue?: string
   enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'
   excludeFromTabOrder?: boolean
   form?: string
   inputMode?: 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search'
   isDisabled?: boolean
   isInvalid?: boolean
   isReadOnly?: boolean
   isRequired?: boolean
   maxLength?: number
   minLength?: number
   name?: string
   onBeforeInput?: FormEventHandler<HTMLInputElement>
   onBlur?: (FocusEvent<T>) => void
   onChange?: (T) => void
   onCompositionEnd?: CompositionEventHandler<HTMLInputElement>
   onCompositionStart?: CompositionEventHandler<HTMLInputElement>
   onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>
   onCopy?: ClipboardEventHandler<HTMLInputElement>
   onCut?: ClipboardEventHandler<HTMLInputElement>
   onFocus?: (FocusEvent<T>) => void
   onFocusChange?: (boolean) => void
   onInput?: FormEventHandler<HTMLInputElement>
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
   onPaste?: ClipboardEventHandler<HTMLInputElement>
   onSelect?: ReactEventHandler<HTMLInputElement>
   pattern?: string
   slot?: string | null
   spellCheck?: string
   style?: StyleOrFunction<TextFieldRenderProps>
   type?: 'text' | 'search' | 'url' | 'tel' | 'email' | 'password' | (string & {
   
 }) = 'text'
   validate?: (string) => ValidationError | boolean | null | undefined
   validationBehavior?: 'native' | 'aria' = 'native'
   value?: string
 }

/react-aria-components:ToastRegionProps

 ToastRegionProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string = "Notifications"
   aria-labelledby?: string
   children: ReactNode | ({
     toast: QueuedToast<T>
 }) => ReactElement
-  className?: ClassNameOrFunction<ToastRegionRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRegionRenderProps<T>> = 'react-aria-ToastRegion'
   queue: ToastQueue<T>
   style?: StyleOrFunction<ToastRegionRenderProps<T>>
 }

/react-aria-components:ToastListProps

 ToastListProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string = "Notifications"
   aria-labelledby?: string
   children: ({
     toast: QueuedToast<T>
 }) => ReactElement
-  className?: ClassNameOrFunction<ToastRegionRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRegionRenderProps<T>> = 'react-aria-ToastRegion'
   style?: StyleOrFunction<ToastRegionRenderProps<T>>
 }

/react-aria-components:ToastProps

 ToastProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ToastRenderProps<T>>
-  className?: ClassNameOrFunction<ToastRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRenderProps<T>> = 'react-aria-Toast'
   style?: StyleOrFunction<ToastRenderProps<T>>
   toast: QueuedToast<T>
 }

/react-aria-components:ToggleButtonProps

 ToggleButtonProps {
   aria-controls?: string
   aria-describedby?: string
   aria-details?: string
   aria-disabled?: boolean | 'true' | 'false'
   aria-expanded?: boolean | 'true' | 'false'
   aria-haspopup?: boolean | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog' | 'true' | 'false'
   aria-label?: string
   aria-labelledby?: string
   aria-pressed?: boolean | 'true' | 'false' | 'mixed'
   autoFocus?: boolean
   children?: ChildrenOrFunction<ToggleButtonRenderProps>
-  className?: ClassNameOrFunction<ToggleButtonRenderProps>
+  className?: ClassNameOrFunction<ToggleButtonRenderProps> = 'react-aria-ToggleButton'
   defaultSelected?: boolean
   excludeFromTabOrder?: boolean
   id?: Key
   isDisabled?: boolean
   onBlur?: (FocusEvent<Target>) => void
   onChange?: (boolean) => 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
   preventFocusOnPress?: boolean
   slot?: string | null
   style?: StyleOrFunction<ToggleButtonRenderProps>
 }

/react-aria-components:ToggleButtonGroupProps

 ToggleButtonGroupProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ToggleButtonGroupRenderProps>
-  className?: ClassNameOrFunction<ToggleButtonGroupRenderProps>
+  className?: ClassNameOrFunction<ToggleButtonGroupRenderProps> = 'react-aria-ToggleButtonGroup'
   defaultSelectedKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   isDisabled?: boolean
   onSelectionChange?: (Set<Key>) => void
   selectedKeys?: Iterable<Key>
   selectionMode?: 'single' | 'multiple' = 'single'
   slot?: string | null
   style?: StyleOrFunction<ToggleButtonGroupRenderProps>
 }

/react-aria-components:ToolbarProps

 ToolbarProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   children?: ChildrenOrFunction<ToolbarRenderProps>
-  className?: ClassNameOrFunction<ToolbarRenderProps>
+  className?: ClassNameOrFunction<ToolbarRenderProps> = 'react-aria-Toolbar'
   orientation?: Orientation = 'horizontal'
   slot?: string | null
   style?: StyleOrFunction<ToolbarRenderProps>
 }

/react-aria-components:TooltipProps

 TooltipProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   arrowBoundaryOffset?: number = 0
   children?: ChildrenOrFunction<TooltipRenderProps>
-  className?: ClassNameOrFunction<TooltipRenderProps>
+  className?: ClassNameOrFunction<TooltipRenderProps> = 'react-aria-Tooltip'
   containerPadding?: number = 12
   crossOffset?: number = 0
   defaultOpen?: boolean
   isEntering?: boolean
   isOpen?: boolean
   offset?: number = 0
   onOpenChange?: (boolean) => void
   placement?: Placement = 'top'
   shouldFlip?: boolean = true
   style?: StyleOrFunction<TooltipRenderProps>
   triggerRef?: RefObject<Element | null>
 }

/react-aria-components:TreeProps

 TreeProps <T> {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   autoFocus?: boolean | FocusStrategy
   children?: ReactNode | (T) => ReactNode
-  className?: ClassNameOrFunction<TreeRenderProps>
+  className?: ClassNameOrFunction<TreeRenderProps> = 'react-aria-Tree'
   defaultExpandedKeys?: Iterable<Key>
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledBehavior?: DisabledBehavior = 'all'
   disallowEmptySelection?: boolean
   dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>
   escapeKeyBehavior?: 'clearSelection' | 'none' = 'clearSelection'
   expandedKeys?: Iterable<Key>
   id?: string
   items?: Iterable<T>
   onAction?: (Key) => void
   onExpandedChange?: (Set<Key>) => any
   onSelectionChange?: (Selection) => void
   renderEmptyState?: (TreeEmptyStateRenderProps) => ReactNode
   selectedKeys?: 'all' | Iterable<Key>
   selectionBehavior?: SelectionBehavior = "toggle"
   selectionMode?: SelectionMode
   shouldSelectOnPressUp?: boolean
   slot?: string | null
   style?: StyleOrFunction<TreeRenderProps>
 }

/react-aria-components:TreeItemProps

 TreeItemProps <T = {}> {
   aria-label?: string
   children: ReactNode
-  className?: ClassNameOrFunction<TreeItemRenderProps>
+  className?: ClassNameOrFunction<TreeItemRenderProps> = 'react-aria-TreeItem'
   download?: boolean | string
   hasChildItems?: boolean
   href?: Href
   hrefLang?: string
   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
   style?: StyleOrFunction<TreeItemRenderProps>
   target?: HTMLAttributeAnchorTarget
   textValue: string
   value?: T
 }

/react-aria-components:TreeItemContentProps

 TreeItemContentProps {
-  children?: ChildrenOrFunction<T>
+  children: ChildrenOrFunction<TreeItemContentRenderProps>
 }

/react-aria-components:TreeLoadMoreItemProps

 TreeLoadMoreItemProps {
   children?: ChildrenOrFunction<TreeLoadMoreItemRenderProps>
-  className?: ClassNameOrFunction<TreeLoadMoreItemRenderProps>
+  className?: ClassNameOrFunction<TreeLoadMoreItemRenderProps> = 'react-aria-TreeLoadMoreItem'
   isLoading?: boolean
   onLoadMore?: () => any
   scrollOffset?: number = 1
   style?: StyleOrFunction<TreeLoadMoreItemRenderProps>

/react-aria-components:DropIndicatorProps

 DropIndicatorProps {
   children?: ChildrenOrFunction<DropIndicatorRenderProps>
-  className?: ClassNameOrFunction<DropIndicatorRenderProps>
+  className?: ClassNameOrFunction<DropIndicatorRenderProps> = 'react-aria-DropIndicator'
   style?: StyleOrFunction<DropIndicatorRenderProps>
   target: DropTarget
 }

@react-spectrum/s2

/@react-spectrum/s2:MenuSection

 MenuSection <T extends {}> {
   aria-label?: string
   children?: ReactNode | (T) => ReactElement
-  className?: string
+  className?: string = 'react-aria-MenuSection'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   items?: Iterable<T>
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   style?: CSSProperties
   value?: T
 }

/@react-spectrum/s2:Cell

 Cell {
   align?: 'start' | 'center' | 'end' = 'start'
   children: ReactNode
-  className?: ClassNameOrFunction<CellRenderProps>
+  className?: ClassNameOrFunction<CellRenderProps> = 'react-aria-Cell'
   colSpan?: number
   id?: Key
   showDivider?: boolean
   style?: StyleOrFunction<CellRenderProps>
 }

/@react-spectrum/s2:Column

 Column {
   align?: 'start' | 'center' | 'end' = 'start'
   allowsResizing?: boolean
   allowsSorting?: boolean
   children: ReactNode
-  className?: ClassNameOrFunction<ColumnRenderProps>
+  className?: ClassNameOrFunction<ColumnRenderProps> = 'react-aria-Column'
   defaultWidth?: ColumnSize | null
   id?: Key
   isRowHeader?: boolean
   maxWidth?: ColumnStaticSize | null
   minWidth?: ColumnStaticSize | null
   showDivider?: boolean
   style?: StyleOrFunction<ColumnRenderProps>
   textValue?: string
   width?: ColumnSize | null
 }

/@react-spectrum/s2:UNSTABLE_ToastContainer

 UNSTABLE_ToastContainer {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string = "Notifications"
   aria-labelledby?: string
-  className?: ClassNameOrFunction<ToastRegionRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRegionRenderProps<T>> = 'react-aria-ToastRegion'
   placement?: ToastPlacement = "bottom"
   style?: StyleOrFunction<ToastRegionRenderProps<T>>
 }

/@react-spectrum/s2:MenuSectionProps

 MenuSectionProps <T extends {}> {
   aria-label?: string
   children?: ReactNode | (T) => ReactElement
-  className?: string
+  className?: string = 'react-aria-MenuSection'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
   disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   items?: Iterable<T>
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   style?: CSSProperties
   value?: T
 }

/@react-spectrum/s2:PopoverProps

 PopoverProps {
   UNSAFE_className?: UnsafeClassName
   UNSAFE_style?: CSSProperties
   aria-describedby?: string
   aria-details?: string
   aria-label?: string
   aria-labelledby?: string
   arrowRef?: RefObject<Element | null>
   boundaryElement?: Element = document.body
   children?: ChildrenOrFunction<PopoverRenderProps>
-  className?: ClassNameOrFunction<PopoverRenderProps>
+  className?: ClassNameOrFunction<PopoverRenderProps> = 'react-aria-Popover'
   containerPadding?: number = 12
   crossOffset?: number = 0
   defaultOpen?: boolean
   hideArrow?: boolean = false
   isExiting?: boolean
   isOpen?: boolean
   maxHeight?: number
   offset?: number = 8
   onOpenChange?: (boolean) => void
   placement?: Placement = 'bottom'
   scrollRef?: RefObject<Element | null> = overlayRef
   shouldFlip?: boolean = true
   size?: 'S' | 'M' | 'L'
   slot?: string | null
   style?: StyleOrFunction<PopoverRenderProps>
   styles?: StyleString
   trigger?: string
   triggerRef?: RefObject<Element | null>
 }

/@react-spectrum/s2:CellProps

 CellProps {
   align?: 'start' | 'center' | 'end' = 'start'
   children: ReactNode
-  className?: ClassNameOrFunction<CellRenderProps>
+  className?: ClassNameOrFunction<CellRenderProps> = 'react-aria-Cell'
   colSpan?: number
   id?: Key
   showDivider?: boolean
   style?: StyleOrFunction<CellRenderProps>
 }

/@react-spectrum/s2:ColumnProps

 ColumnProps {
   align?: 'start' | 'center' | 'end' = 'start'
   allowsResizing?: boolean
   allowsSorting?: boolean
   children: ReactNode
-  className?: ClassNameOrFunction<ColumnRenderProps>
+  className?: ClassNameOrFunction<ColumnRenderProps> = 'react-aria-Column'
   defaultWidth?: ColumnSize | null
   id?: Key
   isRowHeader?: boolean
   maxWidth?: ColumnStaticSize | null
   minWidth?: ColumnStaticSize | null
   showDivider?: boolean
   style?: StyleOrFunction<ColumnRenderProps>
   textValue?: string
   width?: ColumnSize | null
 }

/@react-spectrum/s2:ToastContainerProps

 ToastContainerProps {
   aria-describedby?: string
   aria-details?: string
   aria-label?: string = "Notifications"
   aria-labelledby?: string
-  className?: ClassNameOrFunction<ToastRegionRenderProps<T>>
+  className?: ClassNameOrFunction<ToastRegionRenderProps<T>> = 'react-aria-ToastRegion'
   placement?: ToastPlacement = "bottom"
   style?: StyleOrFunction<ToastRegionRenderProps<T>>
 }

@yihuiliao yihuiliao added this pull request to the merge queue Oct 4, 2025
Merged via the queue into main with commit 76e8dd1 Oct 4, 2025
32 checks passed
@yihuiliao yihuiliao deleted the css-vars-docs branch October 4, 2025 02:29
LFDanLu pushed a commit that referenced this pull request Oct 9, 2025
* docs: Add docs for component CSS variables

* Automatically generate default class name and render props table

* Fix type
devongovett added a commit that referenced this pull request Oct 9, 2025
* docs: Add docs for component CSS variables

* Automatically generate default class name and render props table

* Fix type
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants