## Import

```jsx
import { Select } from "@cfa/react-core";
```

## Live Editor

```jsx
<Select.Root style={{ width: "300px" }}>
  <Select.Label>Sauce</Select.Label>
  <Select.Button>
    <Select.Value />
  </Select.Button>
  <Select.Popover>
    <Select.List>
      <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
      <Select.Item id="2">Polynesian Sauce</Select.Item>
      <Select.Item id="3">Honey Mustard Sauce</Select.Item>
    </Select.List>
  </Select.Popover>
</Select.Root>
```

## Examples

### Basic Usage

The most common way to use Select is with static items.

```jsx
<Select.Root style={{ width: "300px" }}>
  <Select.Label>Sauce</Select.Label>
  <Select.Button>
    <Select.Value />
  </Select.Button>
  <Select.Popover>
    <Select.List>
      <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
      <Select.Item id="2">Polynesian Sauce</Select.Item>
      <Select.Item id="3">Honey Mustard Sauce</Select.Item>
    </Select.List>
  </Select.Popover>
</Select.Root>
```

### Dynamic Items

Use the `items` prop with a render function to create options from an array of data.

```jsx
function DynamicExample() {
  const sauces = [
    { id: "1", name: "Chick-fil-A® Sauce" },
    { id: "2", name: "Polynesian Sauce" },
    { id: "3", name: "Honey Mustard Sauce" },
  ];

  return (
    <Select.Root style={{ width: "300px" }}>
      <Select.Label>Sauce</Select.Label>
      <Select.Button>
        <Select.Value />
      </Select.Button>
      <Select.Popover>
        <Select.List items={sauces}>
          {(sauce) => <Select.Item id={sauce.id}>{sauce.name}</Select.Item>}
        </Select.List>
      </Select.Popover>
    </Select.Root>
  );
}
```

### Disabled Items

Disable specific items in the list by passing an array of keys to the `disabledKeys` prop.

```jsx
<Select.Root style={{ width: "300px" }} disabledKeys={["2", "3"]}>
  <Select.Label>Sauce</Select.Label>
  <Select.Button>
    <Select.Value />
  </Select.Button>
  <Select.Popover>
    <Select.List>
      <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
      <Select.Item id="2">Polynesian Sauce</Select.Item>
      <Select.Item id="3">Honey Mustard Sauce</Select.Item>
    </Select.List>
  </Select.Popover>
</Select.Root>
```

### Default Selected Item

Set the default selected item using the `defaultValue` prop.

```jsx
<Select.Root style={{ width: "300px" }} defaultValue={"2"}>
  <Select.Label>Sauce</Select.Label>
  <Select.Button>
    <Select.Value />
  </Select.Button>
  <Select.Popover>
    <Select.List>
      <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
      <Select.Item id="2">Polynesian Sauce</Select.Item>
      <Select.Item id="3">Honey Mustard Sauce</Select.Item>
    </Select.List>
  </Select.Popover>
</Select.Root>
```

### Clear Button

The `Select.ClearButton` component allows you to have an out of the box experience for reseting the `Select` state.

Normally, you would have to use a controlled version of the component and manually handle the state yourself. This component can be used anywhere, as long as it is nested within
the `Select.Root`. Pressing the button will result in the state being reset.

```jsx
<Select.Root style={{ width: "300px" }}>
  <div
    style={{
      display: "flex",
      justifyContent: "space-between",
      fontSize: 12,
    }}
  >
    <Select.Label>Sauce</Select.Label>
    <Select.ClearButton>Reset</Select.ClearButton>
  </div>
  <Select.Button>
    <Select.Value />
  </Select.Button>
  <Select.Popover>
    <Select.List>
      <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
      <Select.Item id="2">Polynesian Sauce</Select.Item>
      <Select.Item id="3">Honey Mustard Sauce</Select.Item>
    </Select.List>
  </Select.Popover>
</Select.Root>
```

### Leading Icon

Add contextual icons to the select button using the `leadingIcon` prop. This is useful for time pickers, location selectors, or categorized selections where an icon provides visual context.

```jsx
<Select.Root style={{ width: "300px" }}>
  <Select.Label>Location</Select.Label>
  <Select.Button leadingIcon={<Restaurant color="primary" />}>
    <Select.Value />
  </Select.Button>
  <Select.Popover>
    <Select.List>
      <Select.Item id="1">Downtown</Select.Item>
      <Select.Item id="2">Uptown</Select.Item>
      <Select.Item id="3">Midtown</Select.Item>
    </Select.List>
  </Select.Popover>
</Select.Root>
```

> **Note:** The leading icon is decorative and marked with `aria-hidden="true"`. It must not convey critical information that isn't also available in the label or value text.

### Validation States

The Select component supports different validation states.

```jsx
<div style={{ display: "flex", flexDirection: "column", gap: "16px" }}>
  <Select.Root style={{ width: "300px" }} isInvalid>
    <Select.Label>Invalid</Select.Label>
    <Select.Button>
      <Select.Value />
    </Select.Button>
    <Select.Popover>
      <Select.List>
        <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
        <Select.Item id="2">Polynesian Sauce</Select.Item>
      </Select.List>
    </Select.Popover>
    <Select.Error>Please select a sauce</Select.Error>
  </Select.Root>

  <Select.Root style={{ width: "300px" }} isSuccess>
    <Select.Label>Success</Select.Label>
    <Select.Button>
      <Select.Value />
    </Select.Button>
    <Select.Popover>
      <Select.List>
        <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
        <Select.Item id="2">Polynesian Sauce</Select.Item>
      </Select.List>
    </Select.Popover>
    <Select.Description>Selection saved!</Select.Description>
  </Select.Root>

  <Select.Root style={{ width: "300px" }} isDisabled>
    <Select.Label>Disabled</Select.Label>
    <Select.Button>
      <Select.Value />
    </Select.Button>
    <Select.Popover>
      <Select.List>
        <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
        <Select.Item id="2">Polynesian Sauce</Select.Item>
      </Select.List>
    </Select.Popover>
  </Select.Root>
</div>
```

### Rich Content

Create complex select items with icons and additional content.

```jsx
function RichContent() {
  const sauces = [
    { id: "1", name: "Chick-fil-A® Sauce" },
    { id: "2", name: "Polynesian Sauce" },
    { id: "3", name: "Honey Mustard Sauce" },
  ];
  return (
    <Select.Root style={{ width: "300px" }}>
      <Select.Label>Sauce</Select.Label>
      <Select.Button>
        <Select.Value
          style={{
            display: "flex",
            alignItems: "center",
            gap: "8px",
          }}
        />
      </Select.Button>
      <Select.Popover>
        <Select.List items={sauces}>
          {sauces.map((sauce) => (
            <Select.Item
              id={sauce.id}
              style={{
                display: "flex",
                alignItems: "center",
                gap: "8px",
              }}
            >
              <SauceBottle color="primary" />

              <Text>{sauce.name}</Text>
            </Select.Item>
          ))}
        </Select.List>
      </Select.Popover>
    </Select.Root>
  );
}
```

### Custom Value Display

Customize how the selected value is displayed using the render function pattern.

```jsx
<Select.Root style={{ width: "300px" }} placeholder="Choose a sauce">
  <Select.Label>Sauce</Select.Label>
  <Select.Button>
    <Select.Value>
      {({ selectedText, isPlaceholder }) => (
        <div
          style={{
            display: "flex",
            alignItems: "center",
            gap: "8px",
          }}
        >
          {!isPlaceholder && (
            <Avatar.Root color="secondary" size="sm">
              <Avatar.Fallback>
                <Check />
              </Avatar.Fallback>
            </Avatar.Root>
          )}
          {isPlaceholder ? "Choose a sauce" : selectedText}
        </div>
      )}
    </Select.Value>
  </Select.Button>
  <Select.Popover>
    <Select.List>
      <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
      <Select.Item id="2">Polynesian Sauce</Select.Item>
      <Select.Item id="3">Honey Mustard Sauce</Select.Item>
    </Select.List>
  </Select.Popover>
</Select.Root>
```

### Controlled Usage

Control the select's state from a parent component.

```jsx
function ControlledExample() {
  const [selected, setSelected] = React.useState(null);

  return (
    <>
      <Select.Root
        style={{ width: "300px" }}
        value={selected}
        onChange={setSelected}
      >
        <Select.Label>Sauce</Select.Label>
        <Select.Button>
          <Select.Value />
        </Select.Button>
        <Select.Popover>
          <Select.List>
            <Select.Item id="1">Chick-fil-A® Sauce</Select.Item>
            <Select.Item id="2">Polynesian Sauce</Select.Item>
            <Select.Item id="3">Honey Mustard Sauce</Select.Item>
          </Select.List>
        </Select.Popover>
      </Select.Root>
      <div style={{ marginTop: "16px" }}>Selected: {selected || "none"}</div>
    </>
  );
}
```

### TimePicker

A `TimePicker` can easily be created using the `Select` component. Just pass in a static array of times or dynamically create
an Array using your favorite Date/Time library. With this approach you have the flexibility of structuring your data
in a way that makes the most sense for you.

The below example is pretty simple, but you are free to create your times in any way that you want.

```jsx
function DynamicExample() {
  const times = [
    { value: "1:00", label: "1:00 AM" },
    { value: "2:00", label: "2:00 AM" },
    { value: "3:00", label: "3:00 AM" },
  ];

  return (
    <Select.Root style={{ width: "300px" }} placeholder="Select a time...">
      <Select.Label>Select a time</Select.Label>
      <Select.Button>
        <Select.Value />
      </Select.Button>
      <Select.Popover>
        <Select.List items={times}>
          {(time) => <Select.Item id={time.value}>{time.label}</Select.Item>}
        </Select.List>
      </Select.Popover>
    </Select.Root>
  );
}
```

### Sections / Grouping

`Select` supports using sections to group items. When using sections, it is preferred that you group
all of the available options. Leaving some items as "ungrouped" can sometimes cause confusion.

```jsx
function DynamicGroupingExample() {
  const sauces = [
    { id: "1", name: "Chick-fil-A® Sauce" },
    { id: "2", name: "Polynesian Sauce" },
    { id: "3", name: "Honey Mustard Sauce" },
  ];

  return (
    <Select.Root style={{ width: "300px" }}>
      <Select.Label>Sauce</Select.Label>
      <Select.Button>
        <Select.Value />
      </Select.Button>
      <Select.Popover>
        <Select.List>
          <Select.Section>
            <Select.SectionHeader>Group 1</Select.SectionHeader>
            <Collection items={sauces.slice(0, 2)}>
              {(sauce) => <Select.Item>{sauce.name}</Select.Item>}
            </Collection>
          </Select.Section>
          <Select.Section>
            <Select.SectionHeader>Group 2</Select.SectionHeader>
            <Collection items={sauces.slice(2, 3)}>
              {(sauce) => <Select.Item>{sauce.name}</Select.Item>}
            </Collection>
          </Select.Section>
        </Select.List>
      </Select.Popover>
    </Select.Root>
  );
}
```

## Props

### Select.Root

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| compact | `boolean` | `false` | Renders a compact version of the Select |
| isSuccess | `boolean` | - | - |
| ref | `Ref<HTMLDivElement>` | - | Requires React 19 |
| allowsEmptyCollection | `boolean` | - | Whether the select should be allowed to be open when the collection is empty. |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object. |
| aria-details | `string` | - | Identifies the element (or elements) that provide a detailed, extended description for the object. |
| aria-label | `string` | - | Defines a string value that labels the current element. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element. |
| autoComplete | `string` | - | Describes the type of autocomplete functionality the input should provide if any. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefautocomplete). |
| autoFocus | `boolean` | - | Whether the element should receive focus on render. |
| children | `ChildrenOrFunction<SelectRenderProps>` | - | The children of the component. A function may be provided to alter the children based on component state. |
| className | `ClassNameOrFunction<SelectRenderProps>` | `'react-aria-Select'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state. |
| defaultOpen | `boolean` | - | Sets the default open state of the menu. |
| defaultSelectedKey | `Key` | - | The initial selected key in the collection (uncontrolled).&#xA;@deprecated |
| defaultValue | `Key \ | readonly Key[]` | - | The default value (uncontrolled). |
| dir | `string` | - | - |
| disabledKeys | `Iterable<Key>` | - | The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. |
| excludeFromTabOrder | `boolean` | - | Whether to exclude the element from the sequential tab order. If true,&#xA;the element will not be focusable via the keyboard by tabbing. This should&#xA;be avoided except in rare scenarios where an alternative means of accessing&#xA;the element or its functionality via the keyboard is available. |
| form | `string` | - | The \`\<form>\` element to associate the input with.&#xA;The value of this attribute must be the id of a \`\<form>\` in the same document.&#xA;See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#form). |
| hidden | `boolean` | - | - |
| id | `string` | - | The element's unique identifier. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/id). |
| inert | `boolean` | - | - |
| isDisabled | `boolean` | - | Whether the input is disabled. |
| isInvalid | `boolean` | - | Whether the input value is invalid. |
| isOpen | `boolean` | - | Sets the open state of the menu. |
| isRequired | `boolean` | - | Whether user input is required on the input before form submission. |
| lang | `string` | - | - |
| name | `string` | - | The name of the input, used when submitting an HTML form. |
| onAnimationEnd | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onBlur | `(e: FocusEvent<Element, Element>) => void` | - | Handler that is called when the element loses focus. |
| onChange | `(value: ChangeValueType<M>) => void` | - | Handler that is called when the value changes. |
| onClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onFocus | `(e: FocusEvent<Element, Element>) => void` | - | Handler that is called when the element receives focus. |
| onFocusChange | `(isFocused: boolean) => void` | - | Handler that is called when the element's focus status changes. |
| onGotPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onKeyDown | `(e: KeyboardEvent) => void` | - | Handler that is called when a key is pressed. |
| onKeyUp | `(e: KeyboardEvent) => void` | - | Handler that is called when a key is released. |
| onLostPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onOpenChange | `(isOpen: boolean) => void` | - | Method that is called when the open state of the menu changes. |
| onPointerCancel | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onScroll | `UIEventHandler<HTMLDivElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLDivElement>` | - | - |
| onSelectionChange | `(key: Key) => void` | - | Handler that is called when the selection changes.&#xA;@deprecated |
| onTouchCancel | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLDivElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLDivElement>` | - | - |
| placeholder | `string` | `'Select an item' (localized)` | Temporary text that occupies the select when it is empty. |
| render | `DOMRenderFunction<"div", SelectRenderProps>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| selectedKey | `Key` | - | The currently selected key in the collection (controlled).&#xA;@deprecated |
| selectionMode | `"single" \ | "multiple"` | `'single'` | Whether single or multiple selection is enabled. |
| shouldFlip | `boolean` | `true` | Whether the element should flip its orientation (e.g. top to bottom or left to right) when&#xA;there is insufficient room for it to render completely. |
| slot | `string` | - | A slot name for the component. Slots allow the component to receive props from a parent component.&#xA;An explicit \`null\` value indicates that the local props completely override all props received from a parent. |
| style | `StyleOrFunction<SelectRenderProps>` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state. |
| translate | `"yes" \ | "no"` | - | - |
| validate | `(value: ValidationType<M>) => true \ | ValidationError` | - | A function that returns an error message if a given value is invalid.&#xA;Validation errors are displayed to the user when the form is submitted&#xA;if \`validationBehavior="native"\`. For realtime validation, use the \`isInvalid\`&#xA;prop instead. |
| validationBehavior | `"native" \ | "aria"` | `'native'` | Whether to use native HTML form validation to prevent form submission&#xA;when the value is missing or invalid, or mark the field as required&#xA;or invalid via ARIA. |
| value | `Key \ | readonly Key[]` | - | The current value (controlled). |

### Select.Label

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| isDisabled | `boolean` | - | Whether the Label is on a disabled input or element. |
| isRequired | `boolean` | - | Whether the Label is on a required input or element. |
| about | `string` | - | - |
| accessKey | `string` | - | - |
| aria-activedescendant | `string` | - | Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. |
| aria-atomic | `Booleanish` | - | Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. |
| aria-autocomplete | `"none" \ | "list" \ | "inline" \ | "both"` | - | Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be&#xA;presented if they are made. |
| aria-braillelabel | `string` | - | Defines a string value that labels the current element, which is intended to be converted into Braille.&#xA;@see aria-label. |
| aria-brailleroledescription | `string` | - | Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.&#xA;@see aria-roledescription. |
| aria-busy | `Booleanish` | - | - |
| aria-checked | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.&#xA;@see aria-pressed&#xA;@see aria-selected. |
| aria-colcount | `number` | - | Defines the total number of columns in a table, grid, or treegrid.&#xA;@see aria-colindex. |
| aria-colindex | `number` | - | Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.&#xA;@see aria-colcount&#xA;@see aria-colspan. |
| aria-colindextext | `string` | - | Defines a human readable text alternative of aria-colindex.&#xA;@see aria-rowindextext. |
| aria-colspan | `number` | - | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-colindex&#xA;@see aria-rowspan. |
| aria-controls | `string` | - | Identifies the element (or elements) whose contents or presence are controlled by the current element.&#xA;@see aria-owns. |
| aria-current | `boolean \ | "true" \ | "false" \ | "page" \ | "step" \ | "location" \ | "date" \ | "time"` | - | Indicates the element that represents the current item within a container or set of related elements. |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object.&#xA;@see aria-labelledby |
| aria-description | `string` | - | Defines a string value that describes or annotates the current element.&#xA;@see related aria-describedby. |
| aria-details | `string` | - | Identifies the element that provides a detailed, extended description for the object.&#xA;@see aria-describedby. |
| aria-disabled | `Booleanish` | - | Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.&#xA;@see aria-hidden&#xA;@see aria-readonly. |
| aria-dropeffect | `"none" \ | "link" \ | "copy" \ | "execute" \ | "move" \ | "popup"` | - | Indicates what functions can be performed when a dragged object is released on the drop target.&#xA;@deprecated in ARIA 1.1 |
| aria-errormessage | `string` | - | Identifies the element that provides an error message for the object.&#xA;@see aria-invalid&#xA;@see aria-describedby. |
| aria-expanded | `Booleanish` | - | Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. |
| aria-flowto | `string` | - | Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,&#xA;allows assistive technology to override the general default of reading in document source order. |
| aria-grabbed | `Booleanish` | - | Indicates an element's "grabbed" state in a drag-and-drop operation.&#xA;@deprecated in ARIA 1.1 |
| aria-haspopup | `boolean \ | "true" \ | "false" \ | "menu" \ | "listbox" \ | "tree" \ | "grid" \ | "dialog"` | - | Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. |
| aria-hidden | `Booleanish` | - | Indicates whether the element is exposed to an accessibility API.&#xA;@see aria-disabled. |
| aria-invalid | `boolean \ | "true" \ | "false" \ | "grammar" \ | "spelling"` | - | Indicates the entered value does not conform to the format expected by the application.&#xA;@see aria-errormessage. |
| aria-keyshortcuts | `string` | - | Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element. |
| aria-label | `string` | - | Defines a string value that labels the current element.&#xA;@see aria-labelledby. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element.&#xA;@see aria-describedby. |
| aria-level | `number` | - | Defines the hierarchical level of an element within a structure. |
| aria-live | `"off" \ | "assertive" \ | "polite"` | - | Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. |
| aria-modal | `Booleanish` | - | Indicates whether an element is modal when displayed. |
| aria-multiline | `Booleanish` | - | Indicates whether a text box accepts multiple lines of input or only a single line. |
| aria-multiselectable | `Booleanish` | - | Indicates that the user may select more than one item from the current selectable descendants. |
| aria-orientation | `"horizontal" \ | "vertical"` | - | Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous. |
| aria-owns | `string` | - | Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship&#xA;between DOM elements where the DOM hierarchy cannot be used to represent the relationship.&#xA;@see aria-controls. |
| aria-placeholder | `string` | - | Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.&#xA;A hint could be a sample value or a brief description of the expected format. |
| aria-posinset | `number` | - | Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-setsize. |
| aria-pressed | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "pressed" state of toggle buttons.&#xA;@see aria-checked&#xA;@see aria-selected. |
| aria-readonly | `Booleanish` | - | Indicates that the element is not editable, but is otherwise operable.&#xA;@see aria-disabled. |
| aria-relevant | `"text" \ | "additions" \ | "additions removals" \ | "additions text" \ | "all" \ | "removals" \ | "removals additions" \ | "removals text" \ | "text additions" \ | "text removals"` | - | Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.&#xA;@see aria-atomic. |
| aria-required | `Booleanish` | - | Indicates that user input is required on the element before a form may be submitted. |
| aria-roledescription | `string` | - | Defines a human-readable, author-localized description for the role of an element. |
| aria-rowcount | `number` | - | Defines the total number of rows in a table, grid, or treegrid.&#xA;@see aria-rowindex. |
| aria-rowindex | `number` | - | Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.&#xA;@see aria-rowcount&#xA;@see aria-rowspan. |
| aria-rowindextext | `string` | - | Defines a human readable text alternative of aria-rowindex.&#xA;@see aria-colindextext. |
| aria-rowspan | `number` | - | Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-rowindex&#xA;@see aria-colspan. |
| aria-selected | `Booleanish` | - | Indicates the current "selected" state of various widgets.&#xA;@see aria-checked&#xA;@see aria-pressed. |
| aria-setsize | `number` | - | Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-posinset. |
| aria-sort | `"none" \ | "ascending" \ | "descending" \ | "other"` | - | Indicates if items in a table or grid are sorted in ascending or descending order. |
| aria-valuemax | `number` | - | Defines the maximum allowed value for a range widget. |
| aria-valuemin | `number` | - | Defines the minimum allowed value for a range widget. |
| aria-valuenow | `number` | - | Defines the current value for a range widget.&#xA;@see aria-valuetext. |
| aria-valuetext | `string` | - | Defines the human readable text alternative of aria-valuenow for a range widget. |
| autoCapitalize | `"off" \ | "none" \ | "on" \ | "sentences" \ | "words" \ | "characters" \ | (string & {})` | - | - |
| autoCorrect | `string` | - | - |
| autoFocus | `boolean` | - | - |
| autoSave | `string` | - | - |
| className | `string` | - | - |
| color | `string` | - | - |
| content | `string` | - | - |
| contentEditable | `Booleanish \ | "inherit" \ | "plaintext-only"` | - | - |
| contextMenu | `string` | - | - |
| dangerouslySetInnerHTML | `{ __html: string \ | TrustedHTML; }` | - | - |
| datatype | `string` | - | - |
| defaultChecked | `boolean` | - | - |
| defaultValue | `string \ | number \ | readonly string[]` | - | - |
| dir | `string` | - | - |
| draggable | `Booleanish` | - | - |
| elementType | `string` | - | - |
| enterKeyHint | `"enter" \ | "done" \ | "go" \ | "next" \ | "previous" \ | "search" \ | "send"` | - | - |
| exportparts | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/exportparts} |
| form | `string` | - | - |
| hidden | `boolean` | - | - |
| htmlFor | `string` | - | - |
| id | `string` | - | - |
| inert | `boolean` | - | @see https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert |
| inlist | `any` | - | - |
| inputMode | `"none" \ | "search" \ | "text" \ | "tel" \ | "url" \ | "email" \ | "numeric" \ | "decimal"` | - | Hints at the type of data that might be entered by the user while editing the element or its contents&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute} |
| is | `string` | - | Specify that a standard HTML element should behave like a defined custom built-in element&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/custom-elements.html#attr-is} |
| itemID | `string` | - | - |
| itemProp | `string` | - | - |
| itemRef | `string` | - | - |
| itemScope | `boolean` | - | - |
| itemType | `string` | - | - |
| lang | `string` | - | - |
| nonce | `string` | - | - |
| onAbort | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onAbortCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onAnimationEnd | `AnimationEventHandler<HTMLLabelElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLLabelElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLLabelElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLLabelElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLLabelElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLLabelElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onBeforeInput | `InputEventHandler<HTMLLabelElement>` | - | - |
| onBeforeInputCapture | `FormEventHandler<HTMLLabelElement>` | - | - |
| onBeforeToggle | `ToggleEventHandler<HTMLLabelElement>` | - | - |
| onBlur | `FocusEventHandler<HTMLLabelElement>` | - | - |
| onBlurCapture | `FocusEventHandler<HTMLLabelElement>` | - | - |
| onCanPlay | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onCanPlayCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onCanPlayThrough | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onCanPlayThroughCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onChange | `FormEventHandler<HTMLLabelElement>` | - | - |
| onChangeCapture | `FormEventHandler<HTMLLabelElement>` | - | - |
| onClick | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onCompositionEnd | `CompositionEventHandler<HTMLLabelElement>` | - | - |
| onCompositionEndCapture | `CompositionEventHandler<HTMLLabelElement>` | - | - |
| onCompositionStart | `CompositionEventHandler<HTMLLabelElement>` | - | - |
| onCompositionStartCapture | `CompositionEventHandler<HTMLLabelElement>` | - | - |
| onCompositionUpdate | `CompositionEventHandler<HTMLLabelElement>` | - | - |
| onCompositionUpdateCapture | `CompositionEventHandler<HTMLLabelElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onCopy | `ClipboardEventHandler<HTMLLabelElement>` | - | - |
| onCopyCapture | `ClipboardEventHandler<HTMLLabelElement>` | - | - |
| onCut | `ClipboardEventHandler<HTMLLabelElement>` | - | - |
| onCutCapture | `ClipboardEventHandler<HTMLLabelElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onDrag | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragEnd | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragEndCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragEnter | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragEnterCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragExit | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragExitCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragLeave | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragLeaveCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragOver | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragOverCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragStart | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDragStartCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDrop | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDropCapture | `DragEventHandler<HTMLLabelElement>` | - | - |
| onDurationChange | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onDurationChangeCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onEmptied | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onEmptiedCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onEncrypted | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onEncryptedCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onEnded | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onEndedCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onError | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onErrorCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onFocus | `FocusEventHandler<HTMLLabelElement>` | - | - |
| onFocusCapture | `FocusEventHandler<HTMLLabelElement>` | - | - |
| onGotPointerCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onInput | `FormEventHandler<HTMLLabelElement>` | - | - |
| onInputCapture | `FormEventHandler<HTMLLabelElement>` | - | - |
| onInvalid | `FormEventHandler<HTMLLabelElement>` | - | - |
| onInvalidCapture | `FormEventHandler<HTMLLabelElement>` | - | - |
| onKeyDown | `KeyboardEventHandler<HTMLLabelElement>` | - | - |
| onKeyDownCapture | `KeyboardEventHandler<HTMLLabelElement>` | - | - |
| onKeyPress | `KeyboardEventHandler<HTMLLabelElement>` | - | @deprecated Use \`onKeyUp\` or \`onKeyDown\` instead |
| onKeyPressCapture | `KeyboardEventHandler<HTMLLabelElement>` | - | @deprecated Use \`onKeyUpCapture\` or \`onKeyDownCapture\` instead |
| onKeyUp | `KeyboardEventHandler<HTMLLabelElement>` | - | - |
| onKeyUpCapture | `KeyboardEventHandler<HTMLLabelElement>` | - | - |
| onLoad | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLoadCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLoadedData | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLoadedDataCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLoadedMetadata | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLoadedMetadataCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLoadStart | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLoadStartCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLLabelElement>` | - | - |
| onPaste | `ClipboardEventHandler<HTMLLabelElement>` | - | - |
| onPasteCapture | `ClipboardEventHandler<HTMLLabelElement>` | - | - |
| onPause | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onPauseCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onPlay | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onPlayCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onPlaying | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onPlayingCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLLabelElement>` | - | - |
| onProgress | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onProgressCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onRateChange | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onRateChangeCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onReset | `FormEventHandler<HTMLLabelElement>` | - | - |
| onResetCapture | `FormEventHandler<HTMLLabelElement>` | - | - |
| onScroll | `UIEventHandler<HTMLLabelElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLLabelElement>` | - | - |
| onScrollEnd | `UIEventHandler<HTMLLabelElement>` | - | - |
| onScrollEndCapture | `UIEventHandler<HTMLLabelElement>` | - | - |
| onSeeked | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onSeekedCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onSeeking | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onSeekingCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onSelect | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onSelectCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onStalled | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onStalledCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onSubmit | `FormEventHandler<HTMLLabelElement>` | - | - |
| onSubmitCapture | `FormEventHandler<HTMLLabelElement>` | - | - |
| onSuspend | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onSuspendCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onTimeUpdate | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onTimeUpdateCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onToggle | `ToggleEventHandler<HTMLLabelElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLLabelElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLLabelElement>` | - | - |
| onVolumeChange | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onVolumeChangeCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onWaiting | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onWaitingCapture | `ReactEventHandler<HTMLLabelElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLLabelElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLLabelElement>` | - | - |
| part | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/part} |
| popover | `"" \ | "auto" \ | "manual" \ | "hint"` | - | - |
| popoverTarget | `string` | - | - |
| popoverTargetAction | `"toggle" \ | "show" \ | "hide"` | - | - |
| prefix | `string` | - | - |
| property | `string` | - | - |
| radioGroup | `string` | - | - |
| rel | `string` | - | - |
| render | `DOMRenderFunction<"label", undefined>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| resource | `string` | - | - |
| results | `number` | - | - |
| rev | `string` | - | - |
| role | `AriaRole` | - | - |
| security | `string` | - | - |
| slot | `string` | - | - |
| spellCheck | `Booleanish` | - | - |
| style | `CSSProperties` | - | - |
| suppressContentEditableWarning | `boolean` | - | - |
| suppressHydrationWarning | `boolean` | - | - |
| tabIndex | `number` | - | - |
| title | `string` | - | - |
| translate | `"yes" \ | "no"` | - | - |
| typeof | `string` | - | - |
| unselectable | `"off" \ | "on"` | - | - |
| vocab | `string` | - | - |

### Select.Value

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| about | `string` | - | - |
| accessKey | `string` | - | - |
| aria-activedescendant | `string` | - | Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. |
| aria-atomic | `Booleanish` | - | Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. |
| aria-autocomplete | `"none" \ | "list" \ | "inline" \ | "both"` | - | Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be&#xA;presented if they are made. |
| aria-braillelabel | `string` | - | Defines a string value that labels the current element, which is intended to be converted into Braille.&#xA;@see aria-label. |
| aria-brailleroledescription | `string` | - | Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.&#xA;@see aria-roledescription. |
| aria-busy | `Booleanish` | - | - |
| aria-checked | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.&#xA;@see aria-pressed&#xA;@see aria-selected. |
| aria-colcount | `number` | - | Defines the total number of columns in a table, grid, or treegrid.&#xA;@see aria-colindex. |
| aria-colindex | `number` | - | Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.&#xA;@see aria-colcount&#xA;@see aria-colspan. |
| aria-colindextext | `string` | - | Defines a human readable text alternative of aria-colindex.&#xA;@see aria-rowindextext. |
| aria-colspan | `number` | - | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-colindex&#xA;@see aria-rowspan. |
| aria-controls | `string` | - | Identifies the element (or elements) whose contents or presence are controlled by the current element.&#xA;@see aria-owns. |
| aria-current | `boolean \ | "true" \ | "false" \ | "page" \ | "step" \ | "location" \ | "date" \ | "time"` | - | Indicates the element that represents the current item within a container or set of related elements. |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object.&#xA;@see aria-labelledby |
| aria-description | `string` | - | Defines a string value that describes or annotates the current element.&#xA;@see related aria-describedby. |
| aria-details | `string` | - | Identifies the element that provides a detailed, extended description for the object.&#xA;@see aria-describedby. |
| aria-disabled | `Booleanish` | - | Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.&#xA;@see aria-hidden&#xA;@see aria-readonly. |
| aria-dropeffect | `"none" \ | "link" \ | "copy" \ | "execute" \ | "move" \ | "popup"` | - | Indicates what functions can be performed when a dragged object is released on the drop target.&#xA;@deprecated in ARIA 1.1 |
| aria-errormessage | `string` | - | Identifies the element that provides an error message for the object.&#xA;@see aria-invalid&#xA;@see aria-describedby. |
| aria-expanded | `Booleanish` | - | Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. |
| aria-flowto | `string` | - | Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,&#xA;allows assistive technology to override the general default of reading in document source order. |
| aria-grabbed | `Booleanish` | - | Indicates an element's "grabbed" state in a drag-and-drop operation.&#xA;@deprecated in ARIA 1.1 |
| aria-haspopup | `boolean \ | "true" \ | "false" \ | "menu" \ | "listbox" \ | "tree" \ | "grid" \ | "dialog"` | - | Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. |
| aria-hidden | `Booleanish` | - | Indicates whether the element is exposed to an accessibility API.&#xA;@see aria-disabled. |
| aria-invalid | `boolean \ | "true" \ | "false" \ | "grammar" \ | "spelling"` | - | Indicates the entered value does not conform to the format expected by the application.&#xA;@see aria-errormessage. |
| aria-keyshortcuts | `string` | - | Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element. |
| aria-label | `string` | - | Defines a string value that labels the current element.&#xA;@see aria-labelledby. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element.&#xA;@see aria-describedby. |
| aria-level | `number` | - | Defines the hierarchical level of an element within a structure. |
| aria-live | `"off" \ | "assertive" \ | "polite"` | - | Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. |
| aria-modal | `Booleanish` | - | Indicates whether an element is modal when displayed. |
| aria-multiline | `Booleanish` | - | Indicates whether a text box accepts multiple lines of input or only a single line. |
| aria-multiselectable | `Booleanish` | - | Indicates that the user may select more than one item from the current selectable descendants. |
| aria-orientation | `"horizontal" \ | "vertical"` | - | Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous. |
| aria-owns | `string` | - | Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship&#xA;between DOM elements where the DOM hierarchy cannot be used to represent the relationship.&#xA;@see aria-controls. |
| aria-placeholder | `string` | - | Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.&#xA;A hint could be a sample value or a brief description of the expected format. |
| aria-posinset | `number` | - | Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-setsize. |
| aria-pressed | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "pressed" state of toggle buttons.&#xA;@see aria-checked&#xA;@see aria-selected. |
| aria-readonly | `Booleanish` | - | Indicates that the element is not editable, but is otherwise operable.&#xA;@see aria-disabled. |
| aria-relevant | `"text" \ | "additions" \ | "additions removals" \ | "additions text" \ | "all" \ | "removals" \ | "removals additions" \ | "removals text" \ | "text additions" \ | "text removals"` | - | Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.&#xA;@see aria-atomic. |
| aria-required | `Booleanish` | - | Indicates that user input is required on the element before a form may be submitted. |
| aria-roledescription | `string` | - | Defines a human-readable, author-localized description for the role of an element. |
| aria-rowcount | `number` | - | Defines the total number of rows in a table, grid, or treegrid.&#xA;@see aria-rowindex. |
| aria-rowindex | `number` | - | Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.&#xA;@see aria-rowcount&#xA;@see aria-rowspan. |
| aria-rowindextext | `string` | - | Defines a human readable text alternative of aria-rowindex.&#xA;@see aria-colindextext. |
| aria-rowspan | `number` | - | Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-rowindex&#xA;@see aria-colspan. |
| aria-selected | `Booleanish` | - | Indicates the current "selected" state of various widgets.&#xA;@see aria-checked&#xA;@see aria-pressed. |
| aria-setsize | `number` | - | Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-posinset. |
| aria-sort | `"none" \ | "ascending" \ | "descending" \ | "other"` | - | Indicates if items in a table or grid are sorted in ascending or descending order. |
| aria-valuemax | `number` | - | Defines the maximum allowed value for a range widget. |
| aria-valuemin | `number` | - | Defines the minimum allowed value for a range widget. |
| aria-valuenow | `number` | - | Defines the current value for a range widget.&#xA;@see aria-valuetext. |
| aria-valuetext | `string` | - | Defines the human readable text alternative of aria-valuenow for a range widget. |
| autoCapitalize | `"off" \ | "none" \ | "on" \ | "sentences" \ | "words" \ | "characters" \ | (string & {})` | - | - |
| autoCorrect | `string` | - | - |
| autoFocus | `boolean` | - | - |
| autoSave | `string` | - | - |
| children | `ChildrenOrFunction<SelectValueRenderProps<T>>` | - | The children of the component. A function may be provided to alter the children based on component state. |
| className | `ClassNameOrFunction<SelectValueRenderProps<T>>` | `'react-aria-SelectValue'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state. |
| color | `string` | - | - |
| content | `string` | - | - |
| contentEditable | `Booleanish \ | "inherit" \ | "plaintext-only"` | - | - |
| contextMenu | `string` | - | - |
| dangerouslySetInnerHTML | `{ __html: string \ | TrustedHTML; }` | - | - |
| datatype | `string` | - | - |
| defaultChecked | `boolean` | - | - |
| defaultValue | `string \ | number \ | readonly string[]` | - | - |
| dir | `string` | - | - |
| draggable | `Booleanish` | - | - |
| enterKeyHint | `"enter" \ | "done" \ | "go" \ | "next" \ | "previous" \ | "search" \ | "send"` | - | - |
| exportparts | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/exportparts} |
| hidden | `boolean` | - | - |
| id | `string` | - | - |
| inert | `boolean` | - | @see https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert |
| inlist | `any` | - | - |
| inputMode | `"none" \ | "search" \ | "text" \ | "tel" \ | "url" \ | "email" \ | "numeric" \ | "decimal"` | - | Hints at the type of data that might be entered by the user while editing the element or its contents&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute} |
| is | `string` | - | Specify that a standard HTML element should behave like a defined custom built-in element&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/custom-elements.html#attr-is} |
| itemID | `string` | - | - |
| itemProp | `string` | - | - |
| itemRef | `string` | - | - |
| itemScope | `boolean` | - | - |
| itemType | `string` | - | - |
| key | `Key` | - | - |
| lang | `string` | - | - |
| nonce | `string` | - | - |
| onAbort | `ReactEventHandler<HTMLElement>` | - | - |
| onAbortCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onAnimationEnd | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onBeforeInput | `InputEventHandler<HTMLElement>` | - | - |
| onBeforeInputCapture | `FormEventHandler<HTMLElement>` | - | - |
| onBeforeToggle | `ToggleEventHandler<HTMLElement>` | - | - |
| onBlur | `FocusEventHandler<HTMLElement>` | - | - |
| onBlurCapture | `FocusEventHandler<HTMLElement>` | - | - |
| onCanPlay | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayThrough | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayThroughCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onChange | `FormEventHandler<HTMLElement>` | - | - |
| onChangeCapture | `FormEventHandler<HTMLElement>` | - | - |
| onClick | `MouseEventHandler<HTMLElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onCompositionEnd | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionEndCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionStart | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionStartCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionUpdate | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionUpdateCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onCopy | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCopyCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCut | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCutCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onDrag | `DragEventHandler<HTMLElement>` | - | - |
| onDragCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnd | `DragEventHandler<HTMLElement>` | - | - |
| onDragEndCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnter | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnterCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragExit | `DragEventHandler<HTMLElement>` | - | - |
| onDragExitCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragLeave | `DragEventHandler<HTMLElement>` | - | - |
| onDragLeaveCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragOver | `DragEventHandler<HTMLElement>` | - | - |
| onDragOverCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragStart | `DragEventHandler<HTMLElement>` | - | - |
| onDragStartCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDrop | `DragEventHandler<HTMLElement>` | - | - |
| onDropCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDurationChange | `ReactEventHandler<HTMLElement>` | - | - |
| onDurationChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEmptied | `ReactEventHandler<HTMLElement>` | - | - |
| onEmptiedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEncrypted | `ReactEventHandler<HTMLElement>` | - | - |
| onEncryptedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEnded | `ReactEventHandler<HTMLElement>` | - | - |
| onEndedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onError | `ReactEventHandler<HTMLElement>` | - | - |
| onErrorCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onFocus | `FocusEventHandler<HTMLElement>` | - | - |
| onFocusCapture | `FocusEventHandler<HTMLElement>` | - | - |
| onGotPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onInput | `FormEventHandler<HTMLElement>` | - | - |
| onInputCapture | `FormEventHandler<HTMLElement>` | - | - |
| onInvalid | `FormEventHandler<HTMLElement>` | - | - |
| onInvalidCapture | `FormEventHandler<HTMLElement>` | - | - |
| onKeyDown | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyDownCapture | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyPress | `KeyboardEventHandler<HTMLElement>` | - | @deprecated Use \`onKeyUp\` or \`onKeyDown\` instead |
| onKeyPressCapture | `KeyboardEventHandler<HTMLElement>` | - | @deprecated Use \`onKeyUpCapture\` or \`onKeyDownCapture\` instead |
| onKeyUp | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyUpCapture | `KeyboardEventHandler<HTMLElement>` | - | - |
| onLoad | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedData | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedDataCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedMetadata | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedMetadataCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadStart | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadStartCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onPaste | `ClipboardEventHandler<HTMLElement>` | - | - |
| onPasteCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onPause | `ReactEventHandler<HTMLElement>` | - | - |
| onPauseCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPlay | `ReactEventHandler<HTMLElement>` | - | - |
| onPlayCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPlaying | `ReactEventHandler<HTMLElement>` | - | - |
| onPlayingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onProgress | `ReactEventHandler<HTMLElement>` | - | - |
| onProgressCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onRateChange | `ReactEventHandler<HTMLElement>` | - | - |
| onRateChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onReset | `FormEventHandler<HTMLElement>` | - | - |
| onResetCapture | `FormEventHandler<HTMLElement>` | - | - |
| onScroll | `UIEventHandler<HTMLElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLElement>` | - | - |
| onScrollEnd | `UIEventHandler<HTMLElement>` | - | - |
| onScrollEndCapture | `UIEventHandler<HTMLElement>` | - | - |
| onSeeked | `ReactEventHandler<HTMLElement>` | - | - |
| onSeekedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSeeking | `ReactEventHandler<HTMLElement>` | - | - |
| onSeekingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSelect | `ReactEventHandler<HTMLElement>` | - | - |
| onSelectCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onStalled | `ReactEventHandler<HTMLElement>` | - | - |
| onStalledCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSubmit | `FormEventHandler<HTMLElement>` | - | - |
| onSubmitCapture | `FormEventHandler<HTMLElement>` | - | - |
| onSuspend | `ReactEventHandler<HTMLElement>` | - | - |
| onSuspendCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onTimeUpdate | `ReactEventHandler<HTMLElement>` | - | - |
| onTimeUpdateCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onToggle | `ToggleEventHandler<HTMLElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onVolumeChange | `ReactEventHandler<HTMLElement>` | - | - |
| onVolumeChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onWaiting | `ReactEventHandler<HTMLElement>` | - | - |
| onWaitingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLElement>` | - | - |
| part | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/part} |
| popover | `"" \ | "auto" \ | "manual" \ | "hint"` | - | - |
| popoverTarget | `string` | - | - |
| popoverTargetAction | `"toggle" \ | "show" \ | "hide"` | - | - |
| prefix | `string` | - | - |
| property | `string` | - | - |
| radioGroup | `string` | - | - |
| ref | `Ref<HTMLSpanElement>` | - | Allows getting a ref to the component instance.&#xA;Once the component unmounts, React will set \`ref.current\` to \`null\`&#xA;(or call the ref with \`null\` if you passed a callback ref).&#xA;@see \{@link https\://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs} |
| rel | `string` | - | - |
| render | `DOMRenderFunction<"span", SelectValueRenderProps<T>>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| resource | `string` | - | - |
| results | `number` | - | - |
| rev | `string` | - | - |
| role | `AriaRole` | - | - |
| security | `string` | - | - |
| slot | `string` | - | - |
| spellCheck | `Booleanish` | - | - |
| style | `StyleOrFunction<SelectValueRenderProps<T>>` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state. |
| suppressContentEditableWarning | `boolean` | - | - |
| suppressHydrationWarning | `boolean` | - | - |
| tabIndex | `number` | - | - |
| title | `string` | - | - |
| translate | `"yes" \ | "no"` | - | - |
| typeof | `string` | - | - |
| unselectable | `"off" \ | "on"` | - | - |
| vocab | `string` | - | - |

### Select.Button

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| children | `ReactNode` | - | The children of the component. A function may be provided to alter the children based on component state. |
| compact | `boolean` | `false` | Renders a compact version of the Select |
| disableIconAnimation | `boolean` | `false` | Disables the icon animation when opening/closing the Select |
| leadingIcon | `ReactNode` | - | Icon element that renders at the start of the button, before the value.&#xA;Typically used for contextual icons like time, location, or category indicators.&#xA;Should be decorative only and not convey critical information.&#xA;@example \<Select.Button leadingIcon=\{\<Clock />}>&#xA;  \<Select.Value />&#xA;\</Select.Button> |
| ref | `Ref<HTMLButtonElement>` | - | Requires React 19 |
| aria-controls | `string` | - | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
| aria-current | `boolean \ | "true" \ | "false" \ | "page" \ | "step" \ | "location" \ | "date" \ | "time"` | - | Indicates whether this element represents the current item within a container or set of related elements. |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object. |
| aria-details | `string` | - | Identifies the element (or elements) that provide a detailed, extended description for the object. |
| aria-disabled | `boolean \ | "true" \ | "false"` | - | Indicates whether the element is disabled to users of assistive technology. |
| aria-expanded | `boolean \ | "true" \ | "false"` | - | Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. |
| aria-haspopup | `boolean \ | "true" \ | "false" \ | "menu" \ | "listbox" \ | "tree" \ | "grid" \ | "dialog"` | - | Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. |
| aria-label | `string` | - | Defines a string value that labels the current element. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element. |
| aria-pressed | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "pressed" state of toggle buttons. |
| autoFocus | `boolean` | - | Whether the element should receive focus on render. |
| className | `ClassNameOrFunction<ButtonRenderProps>` | `'react-aria-Button'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state. |
| dir | `string` | - | - |
| excludeFromTabOrder | `boolean` | - | Whether to exclude the element from the sequential tab order. If true,&#xA;the element will not be focusable via the keyboard by tabbing. This should&#xA;be avoided except in rare scenarios where an alternative means of accessing&#xA;the element or its functionality via the keyboard is available. |
| form | `string` | - | The \`\<form>\` element to associate the button with.&#xA;The value of this attribute must be the id of a \`\<form>\` in the same document.&#xA;See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/button#form). |
| formAction | `string \ | ((formData: FormData) => void \ | Promise<void>)` | - | The URL that processes the information submitted by the button.&#xA;Overrides the action attribute of the button's form owner. |
| formEncType | `string` | - | Indicates how to encode the form data that is submitted. |
| formMethod | `string` | - | Indicates the HTTP method used to submit the form. |
| formNoValidate | `boolean` | - | Indicates that the form is not to be validated when it is submitted. |
| formTarget | `string` | - | Overrides the target attribute of the button's form owner. |
| hidden | `boolean` | - | - |
| id | `string` | - | The element's unique identifier. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/id). |
| inert | `boolean` | - | - |
| isDisabled | `boolean` | - | Whether the button is disabled. |
| isPending | `boolean` | - | Whether the button is in a pending state. This disables press and hover events&#xA;while retaining focusability, and announces the pending state to screen readers. |
| lang | `string` | - | - |
| name | `string` | - | Submitted as a pair with the button's value as part of the form data. |
| onAnimationEnd | `AnimationEventHandler<HTMLButtonElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLButtonElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLButtonElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLButtonElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLButtonElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLButtonElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onBlur | `(e: FocusEvent<Element, Element>) => void` | - | Handler that is called when the element loses focus. |
| onClickCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onFocus | `(e: FocusEvent<Element, Element>) => void` | - | Handler that is called when the element receives focus. |
| onFocusChange | `(isFocused: boolean) => void` | - | Handler that is called when the element's focus status changes. |
| onGotPointerCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onHoverChange | `(isHovering: boolean) => void` | - | Handler that is called when the hover state changes. |
| onHoverEnd | `(e: HoverEvent) => void` | - | Handler that is called when a hover interaction ends. |
| onHoverStart | `(e: HoverEvent) => void` | - | Handler that is called when a hover interaction starts. |
| onKeyDown | `(e: KeyboardEvent) => void` | - | Handler that is called when a key is pressed. |
| onKeyUp | `(e: KeyboardEvent) => void` | - | Handler that is called when a key is released. |
| onLostPointerCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLButtonElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLButtonElement>` | - | - |
| onPress | `(e: PressEvent) => void` | - | Handler that is called when the press is released over the target. |
| onPressChange | `(isPressed: boolean) => void` | - | Handler that is called when the press state changes. |
| onPressEnd | `(e: PressEvent) => void` | - | Handler that is called when a press interaction ends, either&#xA;over the target or when the pointer leaves the target. |
| onPressStart | `(e: PressEvent) => void` | - | Handler that is called when a press interaction starts. |
| onPressUp | `(e: PressEvent) => void` | - | Handler that is called when a press is released over the target, regardless of&#xA;whether it started on the target or not. |
| onScroll | `UIEventHandler<HTMLButtonElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLButtonElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLButtonElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLButtonElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLButtonElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLButtonElement>` | - | - |
| preventFocusOnPress | `boolean` | - | Whether to prevent focus from moving to the button when pressing it.&#xA;&#xA;Caution, this can make the button inaccessible and should only be used when alternative keyboard interaction is provided,&#xA;such as ComboBox's MenuTrigger or a NumberField's increment/decrement control. |
| render | `DOMRenderFunction<"button", ButtonRenderProps>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| slot | `string` | - | A slot name for the component. Slots allow the component to receive props from a parent component.&#xA;An explicit \`null\` value indicates that the local props completely override all props received from a parent. |
| style | `StyleOrFunction<ButtonRenderProps>` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state. |
| translate | `"yes" \ | "no"` | - | - |
| type | `"button" \ | "submit" \ | "reset"` | `'button'` | The behavior of the button when used in an HTML form. |
| value | `string` | - | The value associated with the button's name when it's submitted with the form data. |

### Select.Description

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| isInvalid | `boolean` | - | - |
| isSuccess | `boolean` | - | - |
| about | `string` | - | - |
| accessKey | `string` | - | - |
| aria-activedescendant | `string` | - | Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. |
| aria-atomic | `Booleanish` | - | Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. |
| aria-autocomplete | `"none" \ | "list" \ | "inline" \ | "both"` | - | Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be&#xA;presented if they are made. |
| aria-braillelabel | `string` | - | Defines a string value that labels the current element, which is intended to be converted into Braille.&#xA;@see aria-label. |
| aria-brailleroledescription | `string` | - | Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.&#xA;@see aria-roledescription. |
| aria-busy | `Booleanish` | - | - |
| aria-checked | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.&#xA;@see aria-pressed&#xA;@see aria-selected. |
| aria-colcount | `number` | - | Defines the total number of columns in a table, grid, or treegrid.&#xA;@see aria-colindex. |
| aria-colindex | `number` | - | Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.&#xA;@see aria-colcount&#xA;@see aria-colspan. |
| aria-colindextext | `string` | - | Defines a human readable text alternative of aria-colindex.&#xA;@see aria-rowindextext. |
| aria-colspan | `number` | - | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-colindex&#xA;@see aria-rowspan. |
| aria-controls | `string` | - | Identifies the element (or elements) whose contents or presence are controlled by the current element.&#xA;@see aria-owns. |
| aria-current | `boolean \ | "true" \ | "false" \ | "page" \ | "step" \ | "location" \ | "date" \ | "time"` | - | Indicates the element that represents the current item within a container or set of related elements. |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object.&#xA;@see aria-labelledby |
| aria-description | `string` | - | Defines a string value that describes or annotates the current element.&#xA;@see related aria-describedby. |
| aria-details | `string` | - | Identifies the element that provides a detailed, extended description for the object.&#xA;@see aria-describedby. |
| aria-disabled | `Booleanish` | - | Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.&#xA;@see aria-hidden&#xA;@see aria-readonly. |
| aria-dropeffect | `"none" \ | "link" \ | "copy" \ | "execute" \ | "move" \ | "popup"` | - | Indicates what functions can be performed when a dragged object is released on the drop target.&#xA;@deprecated in ARIA 1.1 |
| aria-errormessage | `string` | - | Identifies the element that provides an error message for the object.&#xA;@see aria-invalid&#xA;@see aria-describedby. |
| aria-expanded | `Booleanish` | - | Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. |
| aria-flowto | `string` | - | Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,&#xA;allows assistive technology to override the general default of reading in document source order. |
| aria-grabbed | `Booleanish` | - | Indicates an element's "grabbed" state in a drag-and-drop operation.&#xA;@deprecated in ARIA 1.1 |
| aria-haspopup | `boolean \ | "true" \ | "false" \ | "menu" \ | "listbox" \ | "tree" \ | "grid" \ | "dialog"` | - | Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. |
| aria-hidden | `Booleanish` | - | Indicates whether the element is exposed to an accessibility API.&#xA;@see aria-disabled. |
| aria-invalid | `boolean \ | "true" \ | "false" \ | "grammar" \ | "spelling"` | - | Indicates the entered value does not conform to the format expected by the application.&#xA;@see aria-errormessage. |
| aria-keyshortcuts | `string` | - | Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element. |
| aria-label | `string` | - | Defines a string value that labels the current element.&#xA;@see aria-labelledby. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element.&#xA;@see aria-describedby. |
| aria-level | `number` | - | Defines the hierarchical level of an element within a structure. |
| aria-live | `"off" \ | "assertive" \ | "polite"` | - | Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. |
| aria-modal | `Booleanish` | - | Indicates whether an element is modal when displayed. |
| aria-multiline | `Booleanish` | - | Indicates whether a text box accepts multiple lines of input or only a single line. |
| aria-multiselectable | `Booleanish` | - | Indicates that the user may select more than one item from the current selectable descendants. |
| aria-orientation | `"horizontal" \ | "vertical"` | - | Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous. |
| aria-owns | `string` | - | Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship&#xA;between DOM elements where the DOM hierarchy cannot be used to represent the relationship.&#xA;@see aria-controls. |
| aria-placeholder | `string` | - | Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.&#xA;A hint could be a sample value or a brief description of the expected format. |
| aria-posinset | `number` | - | Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-setsize. |
| aria-pressed | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "pressed" state of toggle buttons.&#xA;@see aria-checked&#xA;@see aria-selected. |
| aria-readonly | `Booleanish` | - | Indicates that the element is not editable, but is otherwise operable.&#xA;@see aria-disabled. |
| aria-relevant | `"text" \ | "additions" \ | "additions removals" \ | "additions text" \ | "all" \ | "removals" \ | "removals additions" \ | "removals text" \ | "text additions" \ | "text removals"` | - | Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.&#xA;@see aria-atomic. |
| aria-required | `Booleanish` | - | Indicates that user input is required on the element before a form may be submitted. |
| aria-roledescription | `string` | - | Defines a human-readable, author-localized description for the role of an element. |
| aria-rowcount | `number` | - | Defines the total number of rows in a table, grid, or treegrid.&#xA;@see aria-rowindex. |
| aria-rowindex | `number` | - | Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.&#xA;@see aria-rowcount&#xA;@see aria-rowspan. |
| aria-rowindextext | `string` | - | Defines a human readable text alternative of aria-rowindex.&#xA;@see aria-colindextext. |
| aria-rowspan | `number` | - | Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-rowindex&#xA;@see aria-colspan. |
| aria-selected | `Booleanish` | - | Indicates the current "selected" state of various widgets.&#xA;@see aria-checked&#xA;@see aria-pressed. |
| aria-setsize | `number` | - | Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-posinset. |
| aria-sort | `"none" \ | "ascending" \ | "descending" \ | "other"` | - | Indicates if items in a table or grid are sorted in ascending or descending order. |
| aria-valuemax | `number` | - | Defines the maximum allowed value for a range widget. |
| aria-valuemin | `number` | - | Defines the minimum allowed value for a range widget. |
| aria-valuenow | `number` | - | Defines the current value for a range widget.&#xA;@see aria-valuetext. |
| aria-valuetext | `string` | - | Defines the human readable text alternative of aria-valuenow for a range widget. |
| autoCapitalize | `"off" \ | "none" \ | "on" \ | "sentences" \ | "words" \ | "characters" \ | (string & {})` | - | - |
| autoCorrect | `string` | - | - |
| autoFocus | `boolean` | - | - |
| autoSave | `string` | - | - |
| className | `string` | - | - |
| color | `string` | - | - |
| content | `string` | - | - |
| contentEditable | `Booleanish \ | "inherit" \ | "plaintext-only"` | - | - |
| contextMenu | `string` | - | - |
| dangerouslySetInnerHTML | `{ __html: string \ | TrustedHTML; }` | - | - |
| datatype | `string` | - | - |
| defaultChecked | `boolean` | - | - |
| defaultValue | `string \ | number \ | readonly string[]` | - | - |
| dir | `string` | - | - |
| draggable | `Booleanish` | - | - |
| elementType | `string` | - | - |
| enterKeyHint | `"enter" \ | "done" \ | "go" \ | "next" \ | "previous" \ | "search" \ | "send"` | - | - |
| exportparts | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/exportparts} |
| hidden | `boolean` | - | - |
| id | `string` | - | - |
| inert | `boolean` | - | @see https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert |
| inlist | `any` | - | - |
| inputMode | `"none" \ | "search" \ | "text" \ | "tel" \ | "url" \ | "email" \ | "numeric" \ | "decimal"` | - | Hints at the type of data that might be entered by the user while editing the element or its contents&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute} |
| is | `string` | - | Specify that a standard HTML element should behave like a defined custom built-in element&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/custom-elements.html#attr-is} |
| itemID | `string` | - | - |
| itemProp | `string` | - | - |
| itemRef | `string` | - | - |
| itemScope | `boolean` | - | - |
| itemType | `string` | - | - |
| lang | `string` | - | - |
| nonce | `string` | - | - |
| onAbort | `ReactEventHandler<HTMLElement>` | - | - |
| onAbortCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onAnimationEnd | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onBeforeInput | `InputEventHandler<HTMLElement>` | - | - |
| onBeforeInputCapture | `FormEventHandler<HTMLElement>` | - | - |
| onBeforeToggle | `ToggleEventHandler<HTMLElement>` | - | - |
| onBlur | `FocusEventHandler<HTMLElement>` | - | - |
| onBlurCapture | `FocusEventHandler<HTMLElement>` | - | - |
| onCanPlay | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayThrough | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayThroughCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onChange | `FormEventHandler<HTMLElement>` | - | - |
| onChangeCapture | `FormEventHandler<HTMLElement>` | - | - |
| onClick | `MouseEventHandler<HTMLElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onCompositionEnd | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionEndCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionStart | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionStartCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionUpdate | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionUpdateCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onCopy | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCopyCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCut | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCutCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onDrag | `DragEventHandler<HTMLElement>` | - | - |
| onDragCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnd | `DragEventHandler<HTMLElement>` | - | - |
| onDragEndCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnter | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnterCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragExit | `DragEventHandler<HTMLElement>` | - | - |
| onDragExitCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragLeave | `DragEventHandler<HTMLElement>` | - | - |
| onDragLeaveCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragOver | `DragEventHandler<HTMLElement>` | - | - |
| onDragOverCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragStart | `DragEventHandler<HTMLElement>` | - | - |
| onDragStartCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDrop | `DragEventHandler<HTMLElement>` | - | - |
| onDropCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDurationChange | `ReactEventHandler<HTMLElement>` | - | - |
| onDurationChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEmptied | `ReactEventHandler<HTMLElement>` | - | - |
| onEmptiedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEncrypted | `ReactEventHandler<HTMLElement>` | - | - |
| onEncryptedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEnded | `ReactEventHandler<HTMLElement>` | - | - |
| onEndedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onError | `ReactEventHandler<HTMLElement>` | - | - |
| onErrorCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onFocus | `FocusEventHandler<HTMLElement>` | - | - |
| onFocusCapture | `FocusEventHandler<HTMLElement>` | - | - |
| onGotPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onInput | `FormEventHandler<HTMLElement>` | - | - |
| onInputCapture | `FormEventHandler<HTMLElement>` | - | - |
| onInvalid | `FormEventHandler<HTMLElement>` | - | - |
| onInvalidCapture | `FormEventHandler<HTMLElement>` | - | - |
| onKeyDown | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyDownCapture | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyPress | `KeyboardEventHandler<HTMLElement>` | - | @deprecated Use \`onKeyUp\` or \`onKeyDown\` instead |
| onKeyPressCapture | `KeyboardEventHandler<HTMLElement>` | - | @deprecated Use \`onKeyUpCapture\` or \`onKeyDownCapture\` instead |
| onKeyUp | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyUpCapture | `KeyboardEventHandler<HTMLElement>` | - | - |
| onLoad | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedData | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedDataCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedMetadata | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedMetadataCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadStart | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadStartCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onPaste | `ClipboardEventHandler<HTMLElement>` | - | - |
| onPasteCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onPause | `ReactEventHandler<HTMLElement>` | - | - |
| onPauseCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPlay | `ReactEventHandler<HTMLElement>` | - | - |
| onPlayCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPlaying | `ReactEventHandler<HTMLElement>` | - | - |
| onPlayingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onProgress | `ReactEventHandler<HTMLElement>` | - | - |
| onProgressCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onRateChange | `ReactEventHandler<HTMLElement>` | - | - |
| onRateChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onReset | `FormEventHandler<HTMLElement>` | - | - |
| onResetCapture | `FormEventHandler<HTMLElement>` | - | - |
| onScroll | `UIEventHandler<HTMLElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLElement>` | - | - |
| onScrollEnd | `UIEventHandler<HTMLElement>` | - | - |
| onScrollEndCapture | `UIEventHandler<HTMLElement>` | - | - |
| onSeeked | `ReactEventHandler<HTMLElement>` | - | - |
| onSeekedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSeeking | `ReactEventHandler<HTMLElement>` | - | - |
| onSeekingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSelect | `ReactEventHandler<HTMLElement>` | - | - |
| onSelectCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onStalled | `ReactEventHandler<HTMLElement>` | - | - |
| onStalledCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSubmit | `FormEventHandler<HTMLElement>` | - | - |
| onSubmitCapture | `FormEventHandler<HTMLElement>` | - | - |
| onSuspend | `ReactEventHandler<HTMLElement>` | - | - |
| onSuspendCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onTimeUpdate | `ReactEventHandler<HTMLElement>` | - | - |
| onTimeUpdateCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onToggle | `ToggleEventHandler<HTMLElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onVolumeChange | `ReactEventHandler<HTMLElement>` | - | - |
| onVolumeChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onWaiting | `ReactEventHandler<HTMLElement>` | - | - |
| onWaitingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLElement>` | - | - |
| part | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/part} |
| popover | `"" \ | "auto" \ | "manual" \ | "hint"` | - | - |
| popoverTarget | `string` | - | - |
| popoverTargetAction | `"toggle" \ | "show" \ | "hide"` | - | - |
| prefix | `string` | - | - |
| property | `string` | - | - |
| radioGroup | `string` | - | - |
| rel | `string` | - | - |
| render | `DOMRenderFunction<any, any>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| resource | `string` | - | - |
| results | `number` | - | - |
| rev | `string` | - | - |
| role | `AriaRole` | - | - |
| security | `string` | - | - |
| slot | `string` | - | - |
| spellCheck | `Booleanish` | - | - |
| style | `CSSProperties` | - | - |
| suppressContentEditableWarning | `boolean` | - | - |
| suppressHydrationWarning | `boolean` | - | - |
| tabIndex | `number` | - | - |
| title | `string` | - | - |
| translate | `"yes" \ | "no"` | - | - |
| typeof | `string` | - | - |
| unselectable | `"off" \ | "on"` | - | - |
| vocab | `string` | - | - |

### Select.Error

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| children | `ChildrenOrFunction<FieldErrorRenderProps>` | - | The children of the component. A function may be provided to alter the children based on component state. |
| className | `ClassNameOrFunction<FieldErrorRenderProps>` | `'react-aria-FieldError'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state. |
| dir | `string` | - | - |
| hidden | `boolean` | - | - |
| id | `string` | - | The element's unique identifier. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/id). |
| inert | `boolean` | - | - |
| lang | `string` | - | - |
| onAnimationEnd | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onGotPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onScroll | `UIEventHandler<HTMLDivElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLDivElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLDivElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLDivElement>` | - | - |
| render | `DOMRenderFunction<"div", FieldErrorRenderProps>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| style | `StyleOrFunction<FieldErrorRenderProps>` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state. |
| translate | `"yes" \ | "no"` | - | - |

### Select.ClearButton

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| children | `ReactNode` | - | The content or child elements nested within this component. |
| className | `string` | - | CSS class names to apply custom styling. |
| id | `string` | - | The unique identifier for the DOM element. |
| role | `AriaRole` | - | The ARIA role assigned to the element to improve accessibility.&#xA;Example roles include "button", "navigation", "dialog", etc. |
| style | `CSSProperties` | - | Inline styles specified as a React-compatible CSS properties object. |

### Select.Popover

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| placement | `Placements` | - | The placement of the element with respect to its anchor element. |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object. |
| aria-details | `string` | - | Identifies the element (or elements) that provide a detailed, extended description for the object. |
| aria-label | `string` | - | Defines a string value that labels the current element. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element. |
| arrowBoundaryOffset | `number` | `0` | The minimum distance the arrow's edge should be from the edge of the overlay element. |
| arrowRef | `RefObject<Element>` | - | A ref for the popover arrow element. |
| boundaryElement | `Element` | `document.body` | Element that that serves as the positioning boundary. |
| className | `ClassNameOrFunction<PopoverRenderProps>` | `'react-aria-Popover'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state. |
| containerPadding | `number` | `12` | The placement padding that should be applied between the element and its&#xA;surrounding container. |
| crossOffset | `number` | `0` | The additional offset applied along the cross axis between the element and its&#xA;anchor element. |
| defaultOpen | `boolean` | - | Whether the overlay is open by default (uncontrolled). |
| dir | `string` | - | - |
| hidden | `boolean` | - | - |
| inert | `boolean` | - | - |
| isEntering | `boolean` | - | Whether the popover is currently performing an entry animation. |
| isExiting | `boolean` | - | Whether the popover is currently performing an exit animation. |
| isKeyboardDismissDisabled | `boolean` | `false` | Whether pressing the escape key to close the popover should be disabled.&#xA;&#xA;Most popovers should not use this option. When set to true, an alternative&#xA;way to close the popover with a keyboard must be provided. |
| isNonModal | `boolean` | - | Whether the popover is non-modal, i.e. elements outside the popover may be&#xA;interacted with by assistive technologies.&#xA;&#xA;Most popovers should not use this option as it may negatively impact the screen&#xA;reader experience. Only use with components such as combobox, which are designed&#xA;to handle this situation carefully. |
| isOpen | `boolean` | - | Whether the overlay is open by default (controlled). |
| lang | `string` | - | - |
| maxHeight | `number` | - | The maxHeight specified for the overlay element.&#xA;By default, it will take all space up to the current viewport height. |
| offset | `number` | `8` | The additional offset applied along the main axis between the element and its&#xA;anchor element. |
| onAnimationEnd | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onGotPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onOpenChange | `(isOpen: boolean) => void` | - | Handler that is called when the overlay's open state changes. |
| onPointerCancel | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onScroll | `UIEventHandler<HTMLDivElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLDivElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLDivElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLDivElement>` | - | - |
| render | `DOMRenderFunction<"div", PopoverRenderProps>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| scrollRef | `RefObject<Element>` | `overlayRef` | A ref for the scrollable region within the overlay. |
| shouldFlip | `boolean` | `true` | Whether the element should flip its orientation (e.g. top to bottom or left to right) when&#xA;there is insufficient room for it to render completely. |
| shouldUpdatePosition | `boolean` | `true` | Whether the overlay should update its position automatically. |
| slot | `string` | - | A slot name for the component. Slots allow the component to receive props from a parent component.&#xA;An explicit \`null\` value indicates that the local props completely override all props received from a parent. |
| style | `StyleOrFunction<PopoverRenderProps>` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state. |
| translate | `"yes" \ | "no"` | - | - |
| trigger | `string` | - | The name of the component that triggered the popover. This is reflected on the element&#xA;as the \`data-trigger\` attribute, and can be used to provide specific&#xA;styles for the popover depending on which element triggered it. |
| triggerRef | `RefObject<Element>` | - | The ref for the element which the popover positions itself with respect to.&#xA;&#xA;When used within a trigger component such as DialogTrigger, MenuTrigger, Select, etc.,&#xA;this is set automatically. It is only required when used standalone. |

### Select.List

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object. |
| aria-details | `string` | - | Identifies the element (or elements) that provide a detailed, extended description for the object. |
| aria-label | `string` | - | Defines a string value that labels the current element. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element. |
| children | `ReactNode \ | ((item: T) => ReactNode)` | - | The contents of the collection. |
| className | `ClassNameOrFunction<ListBoxRenderProps>` | `'react-aria-ListBox'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state. |
| dependencies | `readonly any[]` | - | Values that should invalidate the item cache when using dynamic collections. |
| dir | `string` | - | - |
| hidden | `boolean` | - | - |
| id | `string` | - | The element's unique identifier. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/id). |
| inert | `boolean` | - | - |
| items | `Iterable<T>` | - | Item objects in the collection. |
| lang | `string` | - | - |
| onAction | `(key: Key) => void` | - | Handler that is called when a user performs an action on an item. The exact user event depends on&#xA;the collection's \`selectionBehavior\` prop and the interaction modality. |
| onAnimationEnd | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onBlur | `(e: FocusEvent<Element, Element>) => void` | - | Handler that is called when the element loses focus. |
| onClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onFocus | `(e: FocusEvent<Element, Element>) => void` | - | Handler that is called when the element receives focus. |
| onFocusChange | `(isFocused: boolean) => void` | - | Handler that is called when the element's focus status changes. |
| onGotPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onScroll | `UIEventHandler<HTMLDivElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLDivElement>` | - | - |
| onSelectionChange | `(keys: Selection) => void` | - | Handler that is called when the selection changes. |
| onTouchCancel | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLDivElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLDivElement>` | - | - |
| render | `DOMRenderFunction<"div", ListBoxRenderProps>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| renderEmptyState | `(props: ListBoxRenderProps) => ReactNode` | - | Provides content to display when there are no items in the list. |
| shouldFocusOnHover | `boolean` | - | Whether options should be focused when the user hovers over them. |
| shouldFocusWrap | `boolean` | - | Whether focus should wrap around when the end/start is reached. |
| shouldSelectOnPressUp | `boolean` | - | Whether selection should occur on press up instead of press down. |
| slot | `string` | - | A slot name for the component. Slots allow the component to receive props from a parent component.&#xA;An explicit \`null\` value indicates that the local props completely override all props received from a parent. |
| style | `StyleOrFunction<ListBoxRenderProps>` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state. |
| translate | `"yes" \ | "no"` | - | - |

### Select.Item

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| aria-label | `string` | - | An accessibility label for this item. |
| children | `ChildrenOrFunction<ListBoxItemRenderProps>` | - | The children of the component. A function may be provided to alter the children based on component state. |
| className | `ClassNameOrFunction<ListBoxItemRenderProps>` | `'react-aria-ListBoxItem'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state. |
| dir | `string` | - | - |
| download | `string \ | boolean` | - | Causes the browser to download the linked URL. A string may be provided to suggest a file name. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download). |
| hidden | `boolean` | - | - |
| href | `string` | - | A URL to link to. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#href). |
| hrefLang | `string` | - | Hints at the human language of the linked URL. See\[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#hreflang). |
| id | `Key` | - | The unique id of the item. |
| inert | `boolean` | - | - |
| isDisabled | `boolean` | - | Whether the item is disabled. |
| lang | `string` | - | - |
| onAction | `() => void` | - | Handler that is called when a user performs an action on the item. The exact user event depends on&#xA;the collection's \`selectionBehavior\` prop and the interaction modality. |
| onAnimationEnd | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLDivElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onBlur | `(e: FocusEvent<HTMLDivElement, Element>) => void` | - | Handler that is called when the element loses focus. |
| onClick | `(e: MouseEvent<FocusableElement, MouseEvent>) => void` | - | \*\*Not recommended – use \`onPress\` instead.\*\* \`onClick\` is an alias for \`onPress\`&#xA;provided for compatibility with other libraries. \`onPress\` provides &#xA;additional event details for non-mouse interactions. |
| onClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLDivElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLDivElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onFocus | `(e: FocusEvent<HTMLDivElement, Element>) => void` | - | Handler that is called when the element receives focus. |
| onFocusChange | `(isFocused: boolean) => void` | - | Handler that is called when the element's focus status changes. |
| onGotPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onHoverChange | `(isHovering: boolean) => void` | - | Handler that is called when the hover state changes. |
| onHoverEnd | `(e: HoverEvent) => void` | - | Handler that is called when a hover interaction ends. |
| onHoverStart | `(e: HoverEvent) => void` | - | Handler that is called when a hover interaction starts. |
| onLostPointerCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLDivElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLDivElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLDivElement>` | - | - |
| onPress | `(e: PressEvent) => void` | - | Handler that is called when the press is released over the target. |
| onPressChange | `(isPressed: boolean) => void` | - | Handler that is called when the press state changes. |
| onPressEnd | `(e: PressEvent) => void` | - | Handler that is called when a press interaction ends, either&#xA;over the target or when the pointer leaves the target. |
| onPressStart | `(e: PressEvent) => void` | - | Handler that is called when a press interaction starts. |
| onPressUp | `(e: PressEvent) => void` | - | Handler that is called when a press is released over the target, regardless of&#xA;whether it started on the target or not. |
| onScroll | `UIEventHandler<HTMLDivElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLDivElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLDivElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLDivElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLDivElement>` | - | - |
| ping | `string` | - | A space-separated list of URLs to ping when the link is followed. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#ping). |
| referrerPolicy | `HTMLAttributeReferrerPolicy` | - | How much of the referrer to send when following the link. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#referrerpolicy). |
| rel | `string` | - | The relationship between the linked resource and the current page. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel). |
| render | `(props: any, renderProps: ListBoxItemRenderProps) => ReactElement<unknown, string \ | JSXElementConstructor<any>>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Note: You can check if \`'href' in props\` in order to tell whether to render an \`\<a>\` element.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<a>\` is expected, you cannot render a \`\<button>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| routerOptions | `never` | - | Options for the configured client side router. |
| style | `StyleOrFunction<ListBoxItemRenderProps>` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state. |
| target | `HTMLAttributeAnchorTarget` | - | The target window for the link. See \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target). |
| textValue | `string` | - | A string representation of the item's contents, used for features like typeahead. |
| translate | `"yes" \ | "no"` | - | - |
| value | `object` | - | The object value that this item represents. When using dynamic collections, this is set automatically. |

### Select.Section

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| aria-label | `string` | - | An accessibility label for the section. |
| children | `ReactNode \ | ((item: T) => ReactElement<unknown, string \ | JSXElementConstructor<any>>)` | - | Static child items or a function to render children. |
| className | `string` | `'react-aria-ListBoxSection'` | The CSS \[className]\(https\://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. |
| dependencies | `readonly any[]` | - | Values that should invalidate the item cache when using dynamic collections. |
| dir | `string` | - | - |
| hidden | `boolean` | - | - |
| id | `Key` | - | The unique id of the section. |
| inert | `boolean` | - | - |
| items | `Iterable<T>` | - | Item objects in the section. |
| lang | `string` | - | - |
| onAnimationEnd | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onClick | `MouseEventHandler<HTMLElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onGotPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onScroll | `UIEventHandler<HTMLElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLElement>` | - | - |
| render | `DOMRenderFunction<"section", undefined>` | - | Overrides the default DOM element with a custom render function.&#xA;This allows rendering existing components with built-in styles and behaviors&#xA;such as router links, animation libraries, and pre-styled components.&#xA;&#xA;Requirements:&#xA;&#xA;\* You must render the expected element type (e.g. if \`\<button>\` is expected, you cannot render an \`\<a>\`).&#xA;\* Only a single root DOM element can be rendered (no fragments).&#xA;\* You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate. |
| style | `CSSProperties` | - | The inline \[style]\(https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. |
| translate | `"yes" \ | "no"` | - | - |
| value | `object` | - | The object value that this section represents. When using dynamic collections, this is set automatically. |

### Select.SectionHeader

| Name | Type | Default | Description |
| :--- | :--- | :--- | :--- |
| about | `string` | - | - |
| accessKey | `string` | - | - |
| aria-activedescendant | `string` | - | Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. |
| aria-atomic | `Booleanish` | - | Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. |
| aria-autocomplete | `"none" \ | "list" \ | "inline" \ | "both"` | - | Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be&#xA;presented if they are made. |
| aria-braillelabel | `string` | - | Defines a string value that labels the current element, which is intended to be converted into Braille.&#xA;@see aria-label. |
| aria-brailleroledescription | `string` | - | Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.&#xA;@see aria-roledescription. |
| aria-busy | `Booleanish` | - | - |
| aria-checked | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.&#xA;@see aria-pressed&#xA;@see aria-selected. |
| aria-colcount | `number` | - | Defines the total number of columns in a table, grid, or treegrid.&#xA;@see aria-colindex. |
| aria-colindex | `number` | - | Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.&#xA;@see aria-colcount&#xA;@see aria-colspan. |
| aria-colindextext | `string` | - | Defines a human readable text alternative of aria-colindex.&#xA;@see aria-rowindextext. |
| aria-colspan | `number` | - | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-colindex&#xA;@see aria-rowspan. |
| aria-controls | `string` | - | Identifies the element (or elements) whose contents or presence are controlled by the current element.&#xA;@see aria-owns. |
| aria-current | `boolean \ | "true" \ | "false" \ | "page" \ | "step" \ | "location" \ | "date" \ | "time"` | - | Indicates the element that represents the current item within a container or set of related elements. |
| aria-describedby | `string` | - | Identifies the element (or elements) that describes the object.&#xA;@see aria-labelledby |
| aria-description | `string` | - | Defines a string value that describes or annotates the current element.&#xA;@see related aria-describedby. |
| aria-details | `string` | - | Identifies the element that provides a detailed, extended description for the object.&#xA;@see aria-describedby. |
| aria-disabled | `Booleanish` | - | Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.&#xA;@see aria-hidden&#xA;@see aria-readonly. |
| aria-dropeffect | `"none" \ | "link" \ | "copy" \ | "execute" \ | "move" \ | "popup"` | - | Indicates what functions can be performed when a dragged object is released on the drop target.&#xA;@deprecated in ARIA 1.1 |
| aria-errormessage | `string` | - | Identifies the element that provides an error message for the object.&#xA;@see aria-invalid&#xA;@see aria-describedby. |
| aria-expanded | `Booleanish` | - | Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. |
| aria-flowto | `string` | - | Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,&#xA;allows assistive technology to override the general default of reading in document source order. |
| aria-grabbed | `Booleanish` | - | Indicates an element's "grabbed" state in a drag-and-drop operation.&#xA;@deprecated in ARIA 1.1 |
| aria-haspopup | `boolean \ | "true" \ | "false" \ | "menu" \ | "listbox" \ | "tree" \ | "grid" \ | "dialog"` | - | Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. |
| aria-hidden | `Booleanish` | - | Indicates whether the element is exposed to an accessibility API.&#xA;@see aria-disabled. |
| aria-invalid | `boolean \ | "true" \ | "false" \ | "grammar" \ | "spelling"` | - | Indicates the entered value does not conform to the format expected by the application.&#xA;@see aria-errormessage. |
| aria-keyshortcuts | `string` | - | Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element. |
| aria-label | `string` | - | Defines a string value that labels the current element.&#xA;@see aria-labelledby. |
| aria-labelledby | `string` | - | Identifies the element (or elements) that labels the current element.&#xA;@see aria-describedby. |
| aria-level | `number` | - | Defines the hierarchical level of an element within a structure. |
| aria-live | `"off" \ | "assertive" \ | "polite"` | - | Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. |
| aria-modal | `Booleanish` | - | Indicates whether an element is modal when displayed. |
| aria-multiline | `Booleanish` | - | Indicates whether a text box accepts multiple lines of input or only a single line. |
| aria-multiselectable | `Booleanish` | - | Indicates that the user may select more than one item from the current selectable descendants. |
| aria-orientation | `"horizontal" \ | "vertical"` | - | Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous. |
| aria-owns | `string` | - | Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship&#xA;between DOM elements where the DOM hierarchy cannot be used to represent the relationship.&#xA;@see aria-controls. |
| aria-placeholder | `string` | - | Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.&#xA;A hint could be a sample value or a brief description of the expected format. |
| aria-posinset | `number` | - | Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-setsize. |
| aria-pressed | `boolean \ | "true" \ | "false" \ | "mixed"` | - | Indicates the current "pressed" state of toggle buttons.&#xA;@see aria-checked&#xA;@see aria-selected. |
| aria-readonly | `Booleanish` | - | Indicates that the element is not editable, but is otherwise operable.&#xA;@see aria-disabled. |
| aria-relevant | `"text" \ | "additions" \ | "additions removals" \ | "additions text" \ | "all" \ | "removals" \ | "removals additions" \ | "removals text" \ | "text additions" \ | "text removals"` | - | Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.&#xA;@see aria-atomic. |
| aria-required | `Booleanish` | - | Indicates that user input is required on the element before a form may be submitted. |
| aria-roledescription | `string` | - | Defines a human-readable, author-localized description for the role of an element. |
| aria-rowcount | `number` | - | Defines the total number of rows in a table, grid, or treegrid.&#xA;@see aria-rowindex. |
| aria-rowindex | `number` | - | Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.&#xA;@see aria-rowcount&#xA;@see aria-rowspan. |
| aria-rowindextext | `string` | - | Defines a human readable text alternative of aria-rowindex.&#xA;@see aria-colindextext. |
| aria-rowspan | `number` | - | Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.&#xA;@see aria-rowindex&#xA;@see aria-colspan. |
| aria-selected | `Booleanish` | - | Indicates the current "selected" state of various widgets.&#xA;@see aria-checked&#xA;@see aria-pressed. |
| aria-setsize | `number` | - | Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.&#xA;@see aria-posinset. |
| aria-sort | `"none" \ | "ascending" \ | "descending" \ | "other"` | - | Indicates if items in a table or grid are sorted in ascending or descending order. |
| aria-valuemax | `number` | - | Defines the maximum allowed value for a range widget. |
| aria-valuemin | `number` | - | Defines the minimum allowed value for a range widget. |
| aria-valuenow | `number` | - | Defines the current value for a range widget.&#xA;@see aria-valuetext. |
| aria-valuetext | `string` | - | Defines the human readable text alternative of aria-valuenow for a range widget. |
| autoCapitalize | `"off" \ | "none" \ | "on" \ | "sentences" \ | "words" \ | "characters" \ | (string & {})` | - | - |
| autoCorrect | `string` | - | - |
| autoFocus | `boolean` | - | - |
| autoSave | `string` | - | - |
| className | `string` | - | - |
| color | `string` | - | - |
| content | `string` | - | - |
| contentEditable | `Booleanish \ | "inherit" \ | "plaintext-only"` | - | - |
| contextMenu | `string` | - | - |
| dangerouslySetInnerHTML | `{ __html: string \ | TrustedHTML; }` | - | - |
| datatype | `string` | - | - |
| defaultChecked | `boolean` | - | - |
| defaultValue | `string \ | number \ | readonly string[]` | - | - |
| dir | `string` | - | - |
| draggable | `Booleanish` | - | - |
| enterKeyHint | `"enter" \ | "done" \ | "go" \ | "next" \ | "previous" \ | "search" \ | "send"` | - | - |
| exportparts | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/exportparts} |
| hidden | `boolean` | - | - |
| id | `string` | - | - |
| inert | `boolean` | - | @see https\://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert |
| inlist | `any` | - | - |
| inputMode | `"none" \ | "search" \ | "text" \ | "tel" \ | "url" \ | "email" \ | "numeric" \ | "decimal"` | - | Hints at the type of data that might be entered by the user while editing the element or its contents&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute} |
| is | `string` | - | Specify that a standard HTML element should behave like a defined custom built-in element&#xA;@see \{@link https\://html.spec.whatwg.org/multipage/custom-elements.html#attr-is} |
| itemID | `string` | - | - |
| itemProp | `string` | - | - |
| itemRef | `string` | - | - |
| itemScope | `boolean` | - | - |
| itemType | `string` | - | - |
| lang | `string` | - | - |
| nonce | `string` | - | - |
| onAbort | `ReactEventHandler<HTMLElement>` | - | - |
| onAbortCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onAnimationEnd | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationEndCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIteration | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationIterationCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStart | `AnimationEventHandler<HTMLElement>` | - | - |
| onAnimationStartCapture | `AnimationEventHandler<HTMLElement>` | - | - |
| onAuxClick | `MouseEventHandler<HTMLElement>` | - | - |
| onAuxClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onBeforeInput | `InputEventHandler<HTMLElement>` | - | - |
| onBeforeInputCapture | `FormEventHandler<HTMLElement>` | - | - |
| onBeforeToggle | `ToggleEventHandler<HTMLElement>` | - | - |
| onBlur | `FocusEventHandler<HTMLElement>` | - | - |
| onBlurCapture | `FocusEventHandler<HTMLElement>` | - | - |
| onCanPlay | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayThrough | `ReactEventHandler<HTMLElement>` | - | - |
| onCanPlayThroughCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onChange | `FormEventHandler<HTMLElement>` | - | - |
| onChangeCapture | `FormEventHandler<HTMLElement>` | - | - |
| onClick | `MouseEventHandler<HTMLElement>` | - | - |
| onClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onCompositionEnd | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionEndCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionStart | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionStartCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionUpdate | `CompositionEventHandler<HTMLElement>` | - | - |
| onCompositionUpdateCapture | `CompositionEventHandler<HTMLElement>` | - | - |
| onContextMenu | `MouseEventHandler<HTMLElement>` | - | - |
| onContextMenuCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onCopy | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCopyCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCut | `ClipboardEventHandler<HTMLElement>` | - | - |
| onCutCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onDoubleClick | `MouseEventHandler<HTMLElement>` | - | - |
| onDoubleClickCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onDrag | `DragEventHandler<HTMLElement>` | - | - |
| onDragCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnd | `DragEventHandler<HTMLElement>` | - | - |
| onDragEndCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnter | `DragEventHandler<HTMLElement>` | - | - |
| onDragEnterCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragExit | `DragEventHandler<HTMLElement>` | - | - |
| onDragExitCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragLeave | `DragEventHandler<HTMLElement>` | - | - |
| onDragLeaveCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragOver | `DragEventHandler<HTMLElement>` | - | - |
| onDragOverCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDragStart | `DragEventHandler<HTMLElement>` | - | - |
| onDragStartCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDrop | `DragEventHandler<HTMLElement>` | - | - |
| onDropCapture | `DragEventHandler<HTMLElement>` | - | - |
| onDurationChange | `ReactEventHandler<HTMLElement>` | - | - |
| onDurationChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEmptied | `ReactEventHandler<HTMLElement>` | - | - |
| onEmptiedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEncrypted | `ReactEventHandler<HTMLElement>` | - | - |
| onEncryptedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onEnded | `ReactEventHandler<HTMLElement>` | - | - |
| onEndedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onError | `ReactEventHandler<HTMLElement>` | - | - |
| onErrorCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onFocus | `FocusEventHandler<HTMLElement>` | - | - |
| onFocusCapture | `FocusEventHandler<HTMLElement>` | - | - |
| onGotPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onGotPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onInput | `FormEventHandler<HTMLElement>` | - | - |
| onInputCapture | `FormEventHandler<HTMLElement>` | - | - |
| onInvalid | `FormEventHandler<HTMLElement>` | - | - |
| onInvalidCapture | `FormEventHandler<HTMLElement>` | - | - |
| onKeyDown | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyDownCapture | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyPress | `KeyboardEventHandler<HTMLElement>` | - | @deprecated Use \`onKeyUp\` or \`onKeyDown\` instead |
| onKeyPressCapture | `KeyboardEventHandler<HTMLElement>` | - | @deprecated Use \`onKeyUpCapture\` or \`onKeyDownCapture\` instead |
| onKeyUp | `KeyboardEventHandler<HTMLElement>` | - | - |
| onKeyUpCapture | `KeyboardEventHandler<HTMLElement>` | - | - |
| onLoad | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedData | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedDataCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedMetadata | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadedMetadataCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadStart | `ReactEventHandler<HTMLElement>` | - | - |
| onLoadStartCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onLostPointerCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onLostPointerCaptureCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onMouseDown | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseDownCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseEnter | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseLeave | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMove | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseMoveCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOut | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOutCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOver | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseOverCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUp | `MouseEventHandler<HTMLElement>` | - | - |
| onMouseUpCapture | `MouseEventHandler<HTMLElement>` | - | - |
| onPaste | `ClipboardEventHandler<HTMLElement>` | - | - |
| onPasteCapture | `ClipboardEventHandler<HTMLElement>` | - | - |
| onPause | `ReactEventHandler<HTMLElement>` | - | - |
| onPauseCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPlay | `ReactEventHandler<HTMLElement>` | - | - |
| onPlayCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPlaying | `ReactEventHandler<HTMLElement>` | - | - |
| onPlayingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onPointerCancel | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerCancelCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDown | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerDownCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerEnter | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerLeave | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMove | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerMoveCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOut | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOutCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOver | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerOverCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUp | `PointerEventHandler<HTMLElement>` | - | - |
| onPointerUpCapture | `PointerEventHandler<HTMLElement>` | - | - |
| onProgress | `ReactEventHandler<HTMLElement>` | - | - |
| onProgressCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onRateChange | `ReactEventHandler<HTMLElement>` | - | - |
| onRateChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onReset | `FormEventHandler<HTMLElement>` | - | - |
| onResetCapture | `FormEventHandler<HTMLElement>` | - | - |
| onScroll | `UIEventHandler<HTMLElement>` | - | - |
| onScrollCapture | `UIEventHandler<HTMLElement>` | - | - |
| onScrollEnd | `UIEventHandler<HTMLElement>` | - | - |
| onScrollEndCapture | `UIEventHandler<HTMLElement>` | - | - |
| onSeeked | `ReactEventHandler<HTMLElement>` | - | - |
| onSeekedCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSeeking | `ReactEventHandler<HTMLElement>` | - | - |
| onSeekingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSelect | `ReactEventHandler<HTMLElement>` | - | - |
| onSelectCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onStalled | `ReactEventHandler<HTMLElement>` | - | - |
| onStalledCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onSubmit | `FormEventHandler<HTMLElement>` | - | - |
| onSubmitCapture | `FormEventHandler<HTMLElement>` | - | - |
| onSuspend | `ReactEventHandler<HTMLElement>` | - | - |
| onSuspendCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onTimeUpdate | `ReactEventHandler<HTMLElement>` | - | - |
| onTimeUpdateCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onToggle | `ToggleEventHandler<HTMLElement>` | - | - |
| onTouchCancel | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchCancelCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEnd | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchEndCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMove | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchMoveCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStart | `TouchEventHandler<HTMLElement>` | - | - |
| onTouchStartCapture | `TouchEventHandler<HTMLElement>` | - | - |
| onTransitionCancel | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionCancelCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEnd | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionEndCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRun | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionRunCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStart | `TransitionEventHandler<HTMLElement>` | - | - |
| onTransitionStartCapture | `TransitionEventHandler<HTMLElement>` | - | - |
| onVolumeChange | `ReactEventHandler<HTMLElement>` | - | - |
| onVolumeChangeCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onWaiting | `ReactEventHandler<HTMLElement>` | - | - |
| onWaitingCapture | `ReactEventHandler<HTMLElement>` | - | - |
| onWheel | `WheelEventHandler<HTMLElement>` | - | - |
| onWheelCapture | `WheelEventHandler<HTMLElement>` | - | - |
| part | `string` | - | @see \{@link https\://developer.mozilla.org/en-US/docs/Web/HTML/Global\_attributes/part} |
| popover | `"" \ | "auto" \ | "manual" \ | "hint"` | - | - |
| popoverTarget | `string` | - | - |
| popoverTargetAction | `"toggle" \ | "show" \ | "hide"` | - | - |
| prefix | `string` | - | - |
| property | `string` | - | - |
| radioGroup | `string` | - | - |
| rel | `string` | - | - |
| resource | `string` | - | - |
| results | `number` | - | - |
| rev | `string` | - | - |
| role | `AriaRole` | - | - |
| security | `string` | - | - |
| slot | `string` | - | - |
| spellCheck | `Booleanish` | - | - |
| style | `CSSProperties` | - | - |
| suppressContentEditableWarning | `boolean` | - | - |
| suppressHydrationWarning | `boolean` | - | - |
| tabIndex | `number` | - | - |
| title | `string` | - | - |
| translate | `"yes" \ | "no"` | - | - |
| typeof | `string` | - | - |
| unselectable | `"off" \ | "on"` | - | - |
| vocab | `string` | - | - |