diff --git a/docs/pdrs/select-primitive.mdx b/docs/pdrs/select-primitive.mdx
new file mode 100644
index 00000000..41fdf4f4
--- /dev/null
+++ b/docs/pdrs/select-primitive.mdx
@@ -0,0 +1,609 @@
+# Select Primitive PDR
+
+## Overview
+
+PDR describing the `Select` primitive built on React Aria's `useSelect` and `useSelectState` hooks, following the [W3C ARIA combobox (select-only) pattern](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/).
+
+### Unique Attributes
+
+- **Reuses ListBox selection patterns**: Uses existing [`ListStateContext`](../../packages/listbox/src/listbox.tsx#L107) from `@bento/listbox` to share selection state with `ListBox` and `ListBoxItem` components. Source: [`ListStateContext`](../../packages/listbox/src/listbox.tsx#L107) is exported and consumed by [`ListBoxItem`](../../packages/listbox/src/listbox-item.tsx#L133).
+- **Form integration via HiddenSelect**: React Aria provides [`HiddenSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L142) which renders a visually hidden native [`<select>` with `<option>` elements](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L152-L172) when [`state.collection.size <= 300`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L151), and for larger collections renders one or more hidden inputs ([`type="hidden"`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L174-L214) or [`type="text"`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L216-L264) when `validationBehavior="native"`) wired to the `name`/`form` props for native form submission (browser autofill is only supported in the `<select>` path when `state.collection.size <= 300`). Source: [`HiddenSelect.tsx`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L142).
+
+## Goals
+
+- Provide a single- and multi-select dropdown primitive built on React Aria's `useSelect` and `useSelectState` hooks.
+- Reuse existing Bento primitives (`ListBox`, `ListBoxItem`, `Container`, slots) rather than introducing new option or popover primitives.
+- Integrate with native HTML forms via React Aria's `HiddenSelect` using the `name` prop.
+- Expose a small public API surface that forwards most props to React Aria `SelectProps` while using Bento's slot system for composition.
+
+## Constraints
+
+- Must not introduce new shared hooks or utilities if existing packages (`@bento/slots`, `@bento/use-props`, `@bento/use-data-attributes`, `@bento/listbox`) can satisfy the requirements.
+- Must use `ListBoxItem` as the only option primitive so selection behavior stays aligned with `@bento/listbox`.
+- Must rely on React Aria and React Stately for selection, overlay, and keyboard behavior rather than reimplementing this logic.
+- Consumers handle portal rendering for the popover; Select passes overlay-related props to slots and does not depend on a dedicated popover primitive.
+- Must treat other not-yet-implemented primitives (e.g., `Dismiss`) as optional dependencies, not hard requirements for core `Select` behavior.
+
+## API
+
+**Components**:
+- `Select` — Coordinator component
+
+**Type Safety Exports**:
+- `SelectProps` — Generic props interface for the `Select` component (`SelectProps<T, M extends SelectionMode>`).
+- `SelectionMode` — Type alias for selection modes: `'single' | 'multiple'`.
+- `SelectSlots` — Type map for all slot prop types. Enables type-safe slot component implementations.
+- `PropsFromSelectSlot<S>` — Utility type for extracting individual slot prop types without importing each interface.
+- `SelectRenderProps` — Type for render props passed to `renderEmptyState` function.
+- Individual slot prop interfaces: `SelectTriggerSlotProps`, `SelectValueSlotProps`, `SelectPopoverSlotProps`, `SelectListSlotProps` — Available for direct import when needed (derivable from `PropsFromSelectSlot`).
+
+**Advanced type & hook exports (optional)**:
+- `SelectState` — React Stately `SelectState<T, M>` type (re-exported for advanced integrations; not required for normal usage).
+- `Placement` — Popover placement type from React Aria (re-exported for convenience).
+- `useSelectState` — React Stately hook for Select state management (re-exported for advanced control flows).
+
+**Dependencies**:
+- `@bento/listbox` — Provides `ListBox`, `ListBoxItem`, and `ListStateContext`. Source: [`ListStateContext`](../../packages/listbox/src/listbox.tsx#L107) exists.
+- `@bento/container` — Provides `Container` for slot-based composition. Source: [`Container`](../../packages/container/src/index.tsx#L84) exists.
+- `@bento/slots` — Provides `withSlots` for slot system. Source: [`withSlots`](../../packages/slots/src/slots.tsx#L51) exists.
+- `@bento/use-props` — Provides `useProps` for prop merging. Source: [`useProps`](../../packages/use-props/src/index.ts#L117) exists.
+- `@bento/use-data-attributes` — Provides `useDataAttributes` for data attributes. Source: [`useDataAttributes`](../../packages/use-data-attributes/src/index.ts#L25) exists.
+- `react-aria` — Provides `useSelect`, `useOverlay`, `useOverlayPosition`, `usePreventScroll`, `useFocusRing`, `useHover`. Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L74) exists.
+- `react-stately` — Provides `useSelectState`. Source: [`useSelectState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L81) exists.
+- `@react-aria/collections` — Provides `CollectionBuilder`. Source: [`CollectionBuilder`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/collections/src/CollectionBuilder.tsx#L36) exists.
+
+**Using ListBoxItem with Select:**
+
+`ListBoxItem` from `@bento/listbox` is the option primitive for Select. The `id` and `textValue` props are optional:
+
+- **`id` prop** — Optional. Source: [`ListBoxItemProps.id`](../../packages/listbox/src/listbox-item.tsx#L90) is `readonly id?: Key`. If not provided, React Aria auto-generates a unique key. Source: [`Document.setProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/collections/src/Document.ts#L336) uses `id ?? \`react-aria-${++this.ownerDocument.nodeId}\``
+- **`textValue` prop** — Optional. Source: [`ListBoxItemProps.textValue`](../../packages/listbox/src/listbox-item.tsx#L94) is `readonly textValue?: string`. If not provided, React Aria auto-derives it from children. Source: [`Document.setProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/collections/src/Document.ts#L350) uses `textValue || (typeof props.children === 'string' ? props.children : '') || obj['aria-label'] || ''`
+
+**About `Node<T>.value`**: React Aria populates `Node<T>.value` with the original item object when using dynamic collections (`items` / `childItems`). Source: [`Item.getCollectionNode`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/collections/src/Item.ts#L32-L45) yields `{ type: 'item', value: child }` for each `childItems` entry. For **static JSX children**, `Node.value` is not meaningful and should not be relied upon.
+
+```tsx
+// Simple usage - id auto-generated, textValue derived from children
+<ListBoxItem>Apple</ListBoxItem>
+
+// Explicit id for selection state - state.value will be "apple"
+<ListBoxItem id="apple">Apple</ListBoxItem>
+
+// Complex markup - explicit textValue for typeahead, id for selection
+<ListBoxItem id="apple" textValue="Apple">
+  <Icon name="apple" />
+  <Text>Apple Special</Text>
+</ListBoxItem>
+```
+
+### Working with item data
+
+**For dynamic collections**, use `items` on `Select`/`ListBox` and read `Node.value` from `selectedItem`:
+
+```tsx
+import { withSlots } from '@bento/slots';
+import { useProps } from '@bento/use-props';
+
+type Fruit = { id: string; name: string; calories: number };
+
+const fruits: Fruit[] = [
+  { id: 'apple', name: 'Apple', calories: 52 },
+  { id: 'orange', name: 'Orange', calories: 47 }
+];
+
+// Value display component using withSlots pattern
+const FruitValue = withSlots('FruitValue', function FruitValue(args: any) {
+  const { props } = useProps(args);
+  const { selectedItem, ...rest } = props;
+  const fruit = selectedItem?.value as Fruit | undefined;
+  
+  return (
+    <span {...rest}>
+      {fruit ? `${fruit.name} (${fruit.calories} kcal)` : 'Select a fruit'}
+    </span>
+  );
+});
+
+<Select<Fruit> items={fruits}>
+  <Button slot="trigger">
+    <FruitValue slot="value" />
+  </Button>
+  <div slot="popover" style={{ display: 'block' }}>
+    <ListBox<Fruit> slot="listbox">
+      {(item) => <ListBoxItem id={item.id}>{item.name}</ListBoxItem>}
+    </ListBox>
+  </div>
+</Select>
+```
+
+**For static children**, map keys to your own data:
+
+```tsx
+import { withSlots } from '@bento/slots';
+import { useProps } from '@bento/use-props';
+
+const fruitsById = {
+  apple: { name: 'Apple', calories: 52 },
+  orange: { name: 'Orange', calories: 47 }
+} as const;
+
+// Value display component using withSlots pattern
+const FruitValue = withSlots('FruitValue', function FruitValue(args: any) {
+  const { props } = useProps(args);
+  const { selectedItem, ...rest } = props;
+  const id = selectedItem?.key as keyof typeof fruitsById | undefined;
+  const fruit = id ? fruitsById[id] : undefined;
+  
+  return (
+    <span {...rest}>
+      {fruit ? `${fruit.name} (${fruit.calories} kcal)` : 'Select a fruit'}
+    </span>
+  );
+});
+
+<Select defaultValue="apple">
+  <Button slot="trigger">
+    <FruitValue slot="value" />
+  </Button>
+  <Popover slot="popover">
+    <ListBox slot="listbox">
+      <ListBoxItem id="apple">Apple</ListBoxItem>
+      <ListBoxItem id="orange">Orange</ListBoxItem>
+    </ListBox>
+  </Popover>
+</Select>
+```
+
+**Pattern requirements**:
+- If you want a **component** to receive slot props (like `selectedItem`, `selectedItems`) via `useProps`, it must be wrapped with `withSlots`.
+- Plain elements like `<span slot="value" />` do not receive `selectedItem` themselves via `useProps`; they only act as slot markers for a slotted component (e.g. `ValueDisplay`) that actually consumes the props.
+
+## Implementation Notes
+
+| Concept | Implementation |
+|---------|----------------|
+| React Aria | [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L74), [`useSelectState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L81), [`useOverlay`](https://react-spectrum.adobe.com/react-aria/useOverlay.html), [`useOverlayPosition`](https://react-spectrum.adobe.com/react-aria/useOverlayPosition.html), [`usePreventScroll`](https://react-spectrum.adobe.com/react-aria/usePreventScroll.html), [`useFocusRing`](https://react-spectrum.adobe.com/react-aria/useFocusRing.html), [`useHover`](https://react-spectrum.adobe.com/react-aria/useHover.html) |
+| Overlay Management | [`useSelectOverlay`](../../packages/select/src/use-select-overlay.ts) custom hook encapsulates overlay dismiss behavior, positioning, and scroll prevention |
+| Slots | [`withSlots`](../../packages/slots/src/slots.tsx#L51), [`Container`](../../packages/container/src/index.tsx#L84) with `slots` prop |
+| Context | [`ListStateContext`](../../packages/listbox/src/listbox.tsx#L107) for selection state (consumed by `ListBox`/`ListBoxItem`) |
+| CollectionBuilder | [`CollectionBuilder`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/collections/src/CollectionBuilder.tsx#L36) builds collection from children |
+| data-\* Attributes | [`useDataAttributes`](../../packages/use-data-attributes/src/index.ts#L25) exists. Boolean conversion: `true` → `"true"` string, `false` → attribute not added (returns `undefined`). Source: [`to-attribute-value/src/index.ts:41`](../../packages/to-attribute-value/src/index.ts#L41) returns `value ? value.toString() : undefined` for booleans. |
+| Event Handler Passing | Bento slots system passes event handlers (props matching `/^on[A-Z]/`) via context. Source: [`isEventListener`](../../packages/use-props/src/index.ts#L32) matches `/^on[A-Z]/`, [`withSlots`](../../packages/slots/src/slots.tsx#L51) wraps components to receive slot props via context. |
+
+## Internal Structure & Reuse Potential
+
+**Reuses existing patterns**:
+- [`ListStateContext`](../../packages/listbox/src/listbox.tsx#L107) pattern from `@bento/listbox` (similar to [`CheckboxGroupStateContext`](../../packages/checkbox/src/checkbox-group-state.tsx#L4) in `@bento/checkbox`). Source: Both contexts exist and follow the same pattern.
+- Bento slots system: [`withSlots`](../../packages/slots/src/slots.tsx#L51), [`Container`](../../packages/container/src/index.tsx#L84), [`useProps`](../../packages/use-props/src/index.ts#L117). Source: All exist.
+- React Aria hooks: `useSelect`, `useSelectState`, `useOverlay`, `useOverlayPosition`, etc. Source: All exist in React Aria.
+
+**No new reusable utilities proposed**: All functionality provided by existing Bento packages and React Aria hooks.
+
+## React Aria or External Hook Integration
+
+**React Aria hooks used**:
+- [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L74) — Returns `labelProps`, `triggerProps`, `valueProps`, `menuProps`, `descriptionProps`, `errorMessageProps`, `hiddenSelectProps`. Source: [`SelectAria` interface](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L35) defines return types.
+- [`useSelectState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L81) — Manages selection state, overlay open state, and collection. Source: [`SelectState` interface](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L23) extends `ListState<T>` and `OverlayTriggerState`.
+- [`useOverlay`](https://react-spectrum.adobe.com/react-aria/useOverlay.html) — Handles overlay dismiss behavior. Source: Hook exists in React Aria.
+- [`useOverlayPosition`](https://react-spectrum.adobe.com/react-aria/useOverlayPosition.html) — Handles positioning relative to trigger. Source: [`useOverlayPosition.ts`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/useOverlayPosition.ts#L100).
+- [`usePreventScroll`](https://react-spectrum.adobe.com/react-aria/usePreventScroll.html) — Prevents body scrolling when overlay is open. Source: Hook exists in React Aria.
+- [`useFocusRing`](https://react-spectrum.adobe.com/react-aria/useFocusRing.html) — Manages focus visibility. Source: Hook exists in React Aria.
+- [`useHover`](https://react-spectrum.adobe.com/react-aria/useHover.html) — Manages hover state. Source: Hook exists in React Aria.
+- [`HiddenSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L142) — Component for form integration. Source: Component exists and accepts `name` prop via [`AriaHiddenSelectProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L22) (line 32).
+
+**CollectionBuilder usage**: [`CollectionBuilder`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/collections/src/CollectionBuilder.tsx#L36) builds a collection from the children passed to it.
+
+## Behaviors
+
+**State management**:
+- Uses `useSelectState` which internally calls `useListState` from `@react-stately/list`. Source: [`useSelectState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L113) calls `useListState` (line 113).
+- `SelectState` extends `ListState<T>` which provides `collection`, `disabledKeys`, and `selectionManager`. Source: [`SelectState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L23) extends `ListState<T>`.
+- `SelectState` provides `selectedItems: Node<T>[]`. Source: [`SelectState.selectedItems`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L58) is `readonly selectedItems: Node<T>[]`.
+- `SelectState.selectedKey` exists but is deprecated. Source: [`SelectState.selectedKey`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L28) is marked `@deprecated`. `SelectState.value` is the current API. Source: [`SelectState.value`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L43) is `readonly value: ValueType<M>`.
+
+**Props from React Aria**:
+- `value`/`defaultValue` — Type: `Key | null` (single) or `Key[]` (multiple). Selection state control. Source: [`ValueBase`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/shared/src/inputs.d.ts#L65) provides these props.
+- `onChange` — Handler called when selection/value changes. Type: `(value: Key | null) => void` (single) or `(value: Key[]) => void` (multiple). Source: [`SelectProps<T, M>`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/select/src/index.d.ts#L38) extends [`ValueBase<ValueType<M>>`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/shared/src/inputs.d.ts#L65) from `@react-types/shared`, which defines [`onChange?: (value: C) => void`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/shared/src/inputs.d.ts#L71).
+- `selectionMode` — Type: `'single' | 'multiple'`, default `'single'`. Source: [`SelectProps.selectionMode`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/select/src/index.d.ts#L43) with default `'single'` from [`useSelectState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L82).
+- `isOpen` / `defaultOpen` / `onOpenChange` — Overlay trigger-style props controlling the open state of the menu. Source: [`SelectProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/select/src/index.d.ts) in `@react-types/select`.
+- `name` — For form submission. Source: [`AriaSelectProps.name`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/select/src/index.d.ts#L77).
+- `label` — From `LabelableProps`. Source: [`AriaSelectProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/select/src/index.d.ts#L69) extends `LabelableProps`.
+- `isDisabled`, `isRequired`, `isInvalid` — From React Aria types. Source: [`SelectProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/select/src/index.d.ts#L38) includes these from `InputBase` and `Validation`.
+- `placement`, `offset`, `crossOffset`, `shouldFlip`, `containerPadding` — Positioning props for `useOverlayPosition`. 
+  - **React Aria defaults**: `placement='bottom'`, `offset=0`, `crossOffset=0`, `shouldFlip=true`, `containerPadding=12`. Source: [`useOverlayPosition.ts`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/useOverlayPosition.ts#L100-104).
+  - **Bento Select will override**: `placement='bottom start'` (aligns popover to start edge like React Spectrum's Picker).
+- `renderEmptyState` — Render function or element to display when collection is empty. Receives `SelectRenderProps` with `{ isOpen, isDisabled, isInvalid, isRequired, selectedItem, selectedItems, isEmpty }`. Extracted before `useProps` to prevent render prop corruption (Bento invariant #16).
+- `required` — Native HTML attribute available via `React.ComponentProps<'div'>`. Select combines `required` and `isRequired` when computing ARIA decoration (`aria-required`), but React Aria's `HiddenSelect` and validation behavior are driven by `isRequired` + `validationBehavior`, not `required`.
+- `aria-labelledby` — ARIA attribute for custom label associations, inherited from `React.ComponentProps<'div'>`. Can override React Aria's auto-generated label associations when explicit control is needed.
+
+**Slot structure**:
+- `trigger` — Receives `triggerProps` (type: `AriaButtonProps`), `focusProps`, `hoverProps`, `role="combobox"`, `aria-haspopup="listbox"`, `aria-expanded`, `aria-controls`, `aria-required`, `aria-invalid`, `aria-disabled`, `data-open`, `ref`. Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L40) returns `triggerProps: AriaButtonProps`. React Aria provides `aria-haspopup`, `aria-expanded` (boolean), `aria-controls` via `useOverlayTrigger`. Bento adds `role="combobox"`, converts `aria-expanded` to string, and adds `aria-required`, `aria-invalid`, `aria-disabled`.
+- `label` — Receives `labelProps` (type: `DOMAttributes`). Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L37) returns `labelProps: DOMAttributes`.
+- `value` / `trigger.value` — Receives `valueProps` (type: `DOMAttributes` with `id`), `selectedItem` (Node\<T\> | null), `selectedItems` (Node\<T\>[]). Slot alias `trigger.value` allows nesting value display inside trigger. Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L215) returns `valueProps: { id: valueId }`. React Aria's [`SelectState.selectedItems`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L58) provides the Node array. For dynamic collections, `Node.value` holds the original item object. Consumers handle placeholder rendering using the provided selection data.
+- `popover` — Receives `overlayProps`, `positionProps`, `isOpen`, `onClose`, `ref`, `data-open`. Consumer handles portal rendering and styling.
+- `listbox` — Receives `menuProps` (type: `AriaListBoxOptions<T>`), `ref`. Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L46) returns `menuProps: AriaListBoxOptions<T>`.
+- `description` — Receives `descriptionProps` (type: `DOMAttributes`). Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L49) returns `descriptionProps: DOMAttributes`.
+- `error` — Receives `errorMessageProps` (type: `DOMAttributes`). Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L52) returns `errorMessageProps: DOMAttributes`.
+
+**Rendered DOM structure**: Consumer-controlled via slots. Select coordinator only distributes props via context.
+
+**Controlled vs Uncontrolled**: Supports both via `value` / `defaultValue` (selection) and `isOpen` / `defaultOpen` (menu open state). Source: [`SelectProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-types/select/src/index.d.ts#L38) extends `ValueBase<ValueType<M>>` and includes explicit open-state props.
+
+## TypeScript Considerations
+
+**Type Casts and Erasure**:
+- `Select` uses `CollectionBuilder` which requires a render callback, necessitating split into `Select` and `SelectInner` components
+- Generic type `T` is intentionally erased when passing to `SelectInner` - the inner component only needs keys and nodes, not specific item types
+- `ListStateContext.Provider` requires type cast from `SelectState<object, SelectionMode>` to `ListState<unknown>` - this is safe because `SelectState` extends `ListState` (Bento invariants #42, #43)
+
+**Ref Type Constraints**:
+
+Select's implementation uses specific ref types to ensure type compatibility with slotted primitives:
+
+| Slot | Ref Type | Reason | Could Be Relaxed? |
+|------|----------|--------|-------------------|
+| `trigger` | `HTMLButtonElement` | Button primitive expects this specific type | ❌ No - constrained by Button's forwardRef type |
+| `popover` | `HTMLDivElement` internal, `HTMLElement` in public slot props | Internal implementation detail; React Aria only requires `Element` | 🔶 Internally could be generalized further if needed |
+| `listbox` | `HTMLDivElement` | ListBox primitive renders `<div role="listbox">` | ❌ No - constrained by ListBox implementation |
+
+**Note**: The internal `popoverRef` uses `HTMLDivElement` for now, but the public `SelectPopoverSlotProps.ref` is already `RefObject<HTMLElement>`, and React Aria's `useOverlayPosition` only requires `RefObject<Element>`. The `trigger` and `listbox` constraints are fundamental - Button expects `HTMLButtonElement` and ListBox renders a `div`.
+
+## Accessibility
+
+**W3C ARIA Combobox Pattern Conformance**:
+
+Select implements the [W3C ARIA combobox (select-only) pattern](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/) with the following ARIA attributes:
+
+| Attribute | Source | Notes |
+|-----------|--------|-------|
+| `role="combobox"` | Bento Select | Added explicitly (line 271). React Aria's `useSelect` doesn't provide this. |
+| `aria-haspopup="listbox"` | React Aria | Provided by `useOverlayTrigger` (called by `useMenuTrigger`). Source: [`useOverlayTrigger.ts:57`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/useOverlayTrigger.ts#L57) |
+| `aria-expanded` | React Aria + Bento | React Aria provides as boolean. Bento converts to string (`"true"`/`"false"`) for CSS attribute selector compatibility. |
+| `aria-controls` | React Aria | Provided by `useOverlayTrigger`, references listbox `id`. Source: [`useOverlayTrigger.ts:65`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/useOverlayTrigger.ts#L65) |
+| `aria-labelledby` | React Aria | Auto-generated by `useSelect` to concatenate label and value IDs. Can be overridden via prop. |
+| `aria-required` | Bento Select | Added when `isRequired` or `required` prop is set. React Aria doesn't add this. |
+| `aria-invalid` | Bento Select | Added when `isInvalid` prop is set. React Aria doesn't add this. |
+| `aria-disabled` | Bento Select | Added when `isDisabled` prop is set. React Aria doesn't add this. |
+| `role="listbox"` | React Aria | Provided by `useListBox` (via `@bento/listbox`). Source: [`useListBox.ts:121`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/listbox/src/useListBox.ts#L121) |
+
+**ARIA attributes**: Provided by React Aria's `useSelect` hook. Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts) returns props with ARIA attributes via `triggerProps` and `menuProps`. `useMenuTrigger` calls `useOverlayTrigger`, which sets `aria-haspopup`, `aria-expanded`, and `aria-controls` on the trigger. Sources: [`useMenuTrigger`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/menu/src/useMenuTrigger.ts#L55-L56) calls `useOverlayTrigger`, and [`useOverlayTrigger`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/useOverlayTrigger.ts#L62-L66) sets these attributes.
+
+**Keyboard interactions**: Handled by React Aria hooks and native button semantics:
+- Arrow keys for navigation in the listbox (via `useListBox`/`useSelectableList`). Source: [`useListBox`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/listbox/src/useListBox.ts#L67) uses `useSelectableList` for keyboard navigation.
+- Typeahead (via `useTypeSelect`). Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L127) uses `useTypeSelect` (line 127).
+- Enter/Space activate the trigger and commit selection via native `<button>` semantics composed with React Aria `useButton`/`usePress`, and Escape closes the overlay via `useOverlay`. Sources: [`useButton`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/button/src/useButton.ts#L43-L48) provides keyboard/mouse handling for buttons and composes `usePress` (lines 92–103), and [`useOverlay`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/useOverlay.ts#L112-L119) handles the Escape key in its `onKeyDown` handler.
+
+**Focus management**: `useFocusRing` provides focus visibility, and examples wrap the popover contents in React Aria's `FocusScope` (`contain`, `restoreFocus`, `autoFocus`) so focus stays within the popup while open and returns to the trigger on unmount. Sources: [`useFocusRing`](https://react-spectrum.adobe.com/react-aria/useFocusRing.html) exists in React Aria, and [`FocusScope`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/focus/src/FocusScope.tsx#L85-L90) is documented as managing focus for its descendants, including containing focus, restoring focus on unmount, and auto-focusing children.
+
+**Screen reader support**: ARIA attributes and relationships provided by React Aria hooks. Source: [`useSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/useSelect.ts#L174) sets `aria-labelledby` on trigger (lines 179-183). React Aria’s listbox hooks set roles on the popup and options: [`useListBox`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/listbox/src/useListBox.ts#L121) sets `role: 'listbox'` on the listbox element, and [`useOption`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/listbox/src/useOption.ts#L105) sets `role: 'option'` and related ARIA attributes on each option.
+
+## Internationalization, RTL, and Mobile Considerations
+
+**RTL support**: [`useOverlayPosition`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/useOverlayPosition.ts#L93) uses `useLocale` for direction (line 93). Source: Hook calls `useLocale()` to get `direction`.
+
+**Mobile support**: [`usePreventScroll`](https://react-spectrum.adobe.com/react-aria/usePreventScroll.html) prevents body scrolling when overlay is open (`isDisabled: !state.isOpen`). This keeps options in viewport during keyboard navigation. Source: Hook exists in React Aria.
+
+**I18n**: React Aria provides internationalization hooks. Source: [`useCollator`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/i18n/src/useCollator.ts) is used by `useSelect` (line 86) for typeahead matching.
+
+## Performance
+
+**React Aria optimizations**:
+- `HiddenSelect` switches from rendering a native `<select>` with `<option>` elements to rendering hidden `<input>` elements when `state.collection.size > 300`. Source: [`HiddenSelect`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L151-L183) branches on `state.collection.size <= 300`.
+- `useSelectState` and `useListState` memoize derived values like `defaultValue`, `value`, `collection`, and `selectionManager` using `useMemo`. Sources: [`useSelectState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/select/src/useSelectState.ts#L85-L90) and [`useListState`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/list/src/useListState.ts#L49-L60).
+
+**Bento Select optimizations**:
+- Trigger props memoized with `React.useMemo` using explicit dependencies to prevent unnecessary re-computation of merged props (`triggerProps`, `focusProps`, `hoverProps`, ARIA attributes).
+- Slots object memoized with explicit dependency tracking (Bento invariant #45). All slot props must be listed in dependency array to prevent stale closures and unnecessary re-renders of slotted children.
+- Props merged using React Aria's `mergeProps` to combine `triggerProps`, `focusProps`, and `hoverProps` without duplicate event handlers.
+- Children prop destructured before passing to React Aria to prevent unnecessary re-renders. React Stately's `useCollection` includes `children` in its `useMemo` dependency array (even with early-return when `collection` is provided), causing re-renders on every reference change even though `CollectionBuilder` already processed children. Source: [`useCollection.ts:32`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/collections/src/useCollection.ts#L32).
+
+## Implementation Subtleties & Maintainer Notes
+
+This section documents non-obvious implementation decisions that prevent regressions and knowledge loss. These patterns should be preserved unless you understand the full implications of changing them.
+
+### 1. ListStateContext Type Cast
+
+**Pattern**: `<ListStateContext.Provider value={state as ListState<unknown>}>`
+
+**Why**: Bento's `ListBox` components expect `ListState<unknown>` via `ListStateContext`, but Select provides `SelectState<object, SelectionMode>`. The cast is safe because:
+- `SelectState` extends `ListState<T>` (verified in React Aria source)
+- `object` is compatible with `unknown` in this contravariant position
+- ListBox only accesses ListState methods, not Select-specific ones
+
+**Risk if removed**: Type error. ListBox won't receive selection state.
+
+**Related**: Bento invariants #42, #43 (type cast documentation requirements)
+
+### 2. Children Destructuring Performance Pattern
+
+**Pattern**: `const { children: _, ...propsWithoutChildren } = processedProps;`
+
+**Why**: React Stately's `useCollection` hook includes `children` in its `useMemo` dependency array. Even though `CollectionBuilder` already processed children in the parent component and passes the built `collection`, the presence of `children` triggers re-renders on every reference change.
+
+**Evidence**: [`useCollection` source](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/collections/src/useCollection.ts#L26-L32) - `children` in dependency array at line 32. Even though line 27-29 early-returns when `collection` is provided, React's `useMemo` still evaluates all dependencies before executing the function.
+
+**Risk if removed**: Performance degradation - unnecessary re-renders of entire Select tree on every parent re-render.
+
+### 3. Prop Merge Order: onClose After Spreads
+
+**Pattern**: 
+```tsx
+popover: {
+  ...overlayProps,
+  ...positionProps,
+  onClose: handleOverlayClose  // After spreads
+}
+```
+
+**Why**: Ensures Select's close handler cannot be accidentally overridden by consumer props spread into overlay or position props. Our `onClose` must always be the final handler to maintain proper state management.
+
+**Risk if removed**: Consumer-provided props could override `onClose`, breaking popover dismiss behavior.
+
+### 4. Dual Required Attribute Support
+
+**Pattern**: `const isRequired = processedProps.required || processedProps.isRequired;`
+
+**Why**: Call sites may use either the native `required` attribute or React Aria's `isRequired` prop. Select combines them when computing `aria-required` so ARIA decoration is correct even if only `required` is set.
+
+**Behavior**: React Aria's `HiddenSelect` and validation behavior are driven by `isRequired` + `validationBehavior` (stored via `selectData` inside `useSelect`), not by the native `required` attribute. The combined `isRequired` here only affects ARIA decoration on the trigger, not the underlying `HiddenSelect` validation logic.
+
+**Risk if removed**: If we stopped considering `required` when computing `aria-required`, consumers relying on the native attribute alone would lose ARIA-level required semantics on the trigger.
+
+**Consider**: Should this pattern be standardized across all Bento form primitives?
+
+### 5. aria-labelledby Override Pattern
+
+**Pattern**: 
+```tsx
+...(processedProps['aria-labelledby'] && { 
+  'aria-labelledby': processedProps['aria-labelledby'] 
+})
+```
+
+**Why**: React Aria auto-concatenates label IDs (trigger's value ID + label element ID). This override allows consumers to opt out when they need precise control over label associations (e.g., complex layouts with multiple labels, or integration with external label management).
+
+**Risk if removed**: Consumers lose ability to control label associations in complex scenarios.
+
+### 6. HiddenSelect Conditional Rendering
+
+**Pattern**: `{processedProps.name && <HiddenSelect ... />}`
+
+**Why**: `HiddenSelect` only serves form submission and autofill. Without a `name` prop, there's no form field to submit, so rendering it wastes DOM nodes and React reconciliation.
+
+**Risk if removed**: Unnecessary DOM pollution, but no functional breakage.
+
+### 7. renderEmptyState Extraction Before useProps
+
+**Pattern**: `const originalRenderEmptyState = props.renderEmptyState;` (before `useProps`)
+
+**Why**: `useProps` processes render props as slot render props, executing them with slot prop arguments. User's `renderEmptyState` expects `SelectRenderProps`, not slot props. Extracting before `useProps` prevents corruption.
+
+**Related**: Bento invariant #16 (render function extraction requirement)
+
+**Risk if removed**: Runtime error - `renderEmptyState` receives wrong arguments.
+
+**Consider**: Could `useProps` detect and skip user render functions? Current approach requires manual extraction for every user render prop.
+
+### 8. FocusScope Ownership (Resolved)
+
+**Status**: Consumer responsibility (not an open question)
+
+**Pattern**: Consumer popover components are expected to wrap contents in React Aria's `<FocusScope>` when they need focus containment and restore behavior.
+
+**Why**: Different applications need different focus management:
+- Modals: Trap focus completely
+- Dropdowns: Allow Tab to escape
+- Inline popovers: May not need focus management
+
+Select provides the positioning and state; consumers handle focus policy via their Popover implementation.
+
+**Risk if changed**: Forcing focus management in Select reduces flexibility for different UX patterns.
+
+### 9. Deliberate ARIA Invariant Deviation
+
+**Pattern**: `Select` manually sets certain ARIA attributes on the trigger:
+- `role="combobox"`
+- `aria-required`, `aria-invalid`, `aria-disabled`
+- Stringified `aria-expanded` (`"true"` / `"false"`)
+
+**Why**: React Aria's `useSelect` and `useOverlayTrigger` provide most ARIA attributes (`aria-haspopup`, boolean `aria-expanded`, `aria-controls`, `aria-labelledby`), but:
+- WAI-ARIA combobox (select-only) requires `role="combobox"` on the trigger, which `useSelect` does not set.
+- React Aria does not set `aria-required`, `aria-invalid`, or `aria-disabled` on the trigger; Bento adds these to align with other form primitives and to expose state to assistive tech and CSS.
+
+**Invariant impact**: This is a deliberate, narrow exception to Bento invariant #22 ("ARIA Props from React Aria"). All other ARIA attributes still come from React Aria hooks; manual ARIA is limited to the attributes above and documented here.
+
+**Risk if changed**: Removing these manual attributes would:
+- Break strict conformance with the WAI-ARIA combobox select-only pattern (`role="combobox"`).
+- Make `isRequired` / `isInvalid` / `isDisabled` states invisible to assistive tech and CSS on the trigger element.
+
+## Data Attributes and Slot Map
+
+### Expected `data-*` Attributes
+
+| Attribute | Description | Example Values | Source |
+|-----------|-------------|----------------|--------|
+| `data-open` | Whether overlay is open | `"true"` / undefined (attribute omitted) | From `state.isOpen` |
+| `data-disabled` | Whether select is disabled | `"true"` / undefined (attribute omitted) | From `props.isDisabled` |
+| `data-focused` | Whether select is focused | `"true"` / undefined (attribute omitted) | From `useFocusRing().isFocused` |
+| `data-focus-visible` | Whether focus ring should be shown | `"true"` / undefined (attribute omitted) | From `useFocusRing().isFocusVisible` |
+| `data-hovered` | Whether select is hovered | `"true"` / undefined (attribute omitted) | From `useHover().isHovered` |
+| `data-invalid` | Whether select is invalid | `"true"` / undefined (attribute omitted) | From `props.isInvalid` |
+| `data-required` | Whether select is required | `"true"` / undefined (attribute omitted) | From `props.isRequired` |
+| `data-empty` | Whether collection is empty | `"true"` / undefined (attribute omitted) | From `state.collection.size === 0` |
+
+**Boolean conversion**: `true` booleans convert to `"true"` string; `false` booleans result in attribute not being added (returns `undefined`). Source: [`to-attribute-value/src/index.ts:41`](../../packages/to-attribute-value/src/index.ts#L41) returns `value ? value.toString() : undefined` for booleans.
+
+### Slot Map
+
+| Slot Name | Description | Required | Default Fallback | Props Received |
+|-----------|-------------|----------|------------------|----------------|
+| `trigger` | Button that opens/closes the select | Yes | No | Merged trigger props from React Aria (`triggerProps` with `aria-haspopup`, `aria-expanded`, `aria-controls`) and Bento (`useFocusRing`, `useHover`), plus `role="combobox"`, `aria-required`, `aria-invalid`, `aria-disabled`, `data-open`, `ref` |
+| `label` | Accessible label | No | No | `labelProps` (DOMAttributes) |
+| `value` / `trigger.value` | Displayed selected value | No | No | `valueProps` (DOMAttributes with `id`), `selectedItem` (Node\<T\> or null), `selectedItems` (Node\<T\>[]) — for dynamic collections, `selectedItem?.value` / `selectedItems[i].value` is the backing object. Alias `trigger.value` enables nesting value inside trigger. |
+| `popover` | Overlay container | Yes | No | `overlayProps`, `positionProps`, `isOpen`, `onClose`, `ref`, `data-open` |
+| `listbox` | List of options | Yes | No | `menuProps` (AriaListBoxOptions), `ref` |
+| `description` | Help text | No | No | `descriptionProps` (DOMAttributes) |
+| `error` | Error message | No | No | `errorMessageProps` (DOMAttributes) |
+
+Optional `description` and `error` slots mirror the form help/error pattern shown in the `ControlGroup` example in [`packages/container/CONCEPTS.mdx`](../../packages/container/CONCEPTS.mdx#L61-L82): they provide a place to attach React Aria’s `descriptionProps` and `errorMessageProps` without hard-coding layout. Consumers who need different placement or ordering for help text and errors can render those elements outside `Select` instead of using these slots.
+
+**Note**: Slotted children must use `withSlots` + `useProps` to receive event handlers from context. Source: [`isEventListener`](../../packages/use-props/src/index.ts#L32) matches `/^on[A-Z]/`, [`withSlots`](../../packages/slots/src/slots.tsx#L51) wraps components to receive slot props via context.
+
+**Popover Implementation Requirements**:
+Consumers must implement popover components that handle:
+1. **Portal rendering**: Render outside parent DOM hierarchy to escape overflow/z-index constraints
+2. **Positioning styles**: Spread the `popover` slot props (which include `style` from `useOverlayPosition`) onto the popover element so it is correctly positioned relative to the trigger.
+3. **Display toggling**: Show/hide based on `isOpen` prop or `data-open` attribute
+4. **Focus management**: Typically wrap contents in React Aria's `FocusScope` with `contain`, `restoreFocus`, `autoFocus`
+
+Select provides positioning via `useOverlayPosition` but does not render portals or apply styles automatically.
+
+## Open Questions
+
+1. **Dismiss behavior primitive**: Should Select provide dismiss affordances via a dedicated primitive (e.g. a future `@bento/dismiss`), or require consumers to add their own buttons/handlers inside the popover? A `Dismiss` primitive is described in [`docs/pdrs/dismiss-primitive.mdx`](./dismiss-primitive.mdx), but no `@bento/dismiss` package exists yet; integration pattern is unverified.
+
+## Code Examples
+
+### Basic Usage
+
+```tsx
+import { withSlots } from '@bento/slots';
+import { useProps } from '@bento/use-props';
+import { Select } from '@bento/select';
+import { Button } from '@bento/button';
+import { ListBox, ListBoxItem } from '@bento/listbox';
+import { Popover } from './popover'; // Consumer-provided popover component
+
+// Slottable value component
+const ValueDisplay = withSlots('SelectValue', function SelectValue(args: any) {
+  const { props } = useProps(args);
+  const { selectedItem, ...rest } = props;
+  return <span {...rest}>{selectedItem?.textValue || 'Select...'}</span>;
+});
+
+<Select value={selectedKey} onChange={setSelectedKey}>
+  <Button slot="trigger">
+    <ValueDisplay slot="value" />
+  </Button>
+  <Popover slot="popover">
+    <ListBox slot="listbox">
+      <ListBoxItem id="apple">Apple</ListBoxItem>
+      <ListBoxItem id="orange">Orange</ListBoxItem>
+    </ListBox>
+  </Popover>
+</Select>
+```
+
+**Note**: Examples assume a `Popover` component that handles portal rendering, positioning styles from `positionProps`, and display toggling based on `isOpen`. See "Popover Implementation Requirements" above.
+
+### Multi-select
+
+```tsx
+import { withSlots } from '@bento/slots';
+import { useProps } from '@bento/use-props';
+
+// Slottable value component for multi-select
+const MultiValueDisplay = withSlots('MultiSelectValue', function MultiSelectValue(args: any) {
+  const { props } = useProps(args);
+  const { selectedItems, ...rest } = props;
+  return (
+    <span {...rest}>
+      {selectedItems?.length > 0
+        ? selectedItems.map(i => i.textValue).join(', ')
+        : 'Select items...'}
+    </span>
+  );
+});
+
+<Select
+  selectionMode="multiple"
+  value={selectedKeys}
+  onChange={setSelectedKeys}
+>
+  <Button slot="trigger">
+    <MultiValueDisplay slot="value" />
+  </Button>
+  <Popover slot="popover">
+    <ListBox slot="listbox">
+      <ListBoxItem id="apple">Apple</ListBoxItem>
+      <ListBoxItem id="orange">Orange</ListBoxItem>
+      <ListBoxItem id="banana">Banana</ListBoxItem>
+    </ListBox>
+  </Popover>
+</Select>
+```
+
+### With Form Integration
+
+```tsx
+import { withSlots } from '@bento/slots';
+import { useProps } from '@bento/use-props';
+
+// Slottable value component
+const ValueDisplay = withSlots('SelectValue', function SelectValue(args: any) {
+  const { props } = useProps(args);
+  const { selectedItem, ...rest } = props;
+  return <span {...rest}>{selectedItem?.textValue || 'Select a fruit'}</span>;
+});
+
+<form>
+  <Select
+    name="fruit"
+    value={selectedKey}
+    onChange={setSelectedKey}
+  >
+    <Button slot="trigger">
+      <ValueDisplay slot="value" />
+    </Button>
+    <Popover slot="popover">
+      <ListBox slot="listbox">
+        <ListBoxItem id="apple">Apple</ListBoxItem>
+        <ListBoxItem id="orange">Orange</ListBoxItem>
+      </ListBox>
+    </Popover>
+  </Select>
+  <button type="submit">Submit</button>
+</form>
+```
+
+**Note**: React Aria's `HiddenSelect` accepts `name` via [`AriaHiddenSelectProps`](https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/select/src/HiddenSelect.tsx#L22) (line 32) and uses it when constructing hidden form fields for form submission (lines 174–212).
+
+### With Empty State
+
+```tsx
+import { withSlots } from '@bento/slots';
+import { useProps } from '@bento/use-props';
+
+// Slottable value component
+const ValueDisplay = withSlots('SelectValue', function SelectValue(args: any) {
+  const { props } = useProps(args);
+  const { selectedItem, ...rest } = props;
+  return <span {...rest}>{selectedItem?.textValue || 'Select...'}</span>;
+});
+
+<Select
+  value={selectedKey}
+  onChange={setSelectedKey}
+  renderEmptyState={(props) => (
+    <div style={{ padding: '1rem', textAlign: 'center' }}>
+      No options available
+    </div>
+  )}
+>
+  <Button slot="trigger">
+    <ValueDisplay slot="value" />
+  </Button>
+  <Popover slot="popover">
+    <ListBox slot="listbox">
+      {/* No ListBoxItem children - empty state will render */}
+    </ListBox>
+  </Popover>
+</Select>
+```
+
+**When to use `renderEmptyState`**:
+- Use `renderEmptyState` when you need access to selection state (`isOpen`, `isDisabled`, etc.) via `SelectRenderProps`
+- Use conditional rendering outside Select when you control visibility independently
+- Empty state replaces all children when collection is empty (`state.collection.size === 0`)
+- Does not affect overlay behavior - popover still opens/closes normally
+
+**Note**: `renderEmptyState` must be extracted before `useProps` (Bento invariant #16) to prevent `useProps` from executing it as a slot render prop with incorrect arguments.
\ No newline at end of file
diff --git a/packages/focus-lock/package.json b/packages/focus-lock/package.json
index bec8af20..2e4b892d 100644
--- a/packages/focus-lock/package.json
+++ b/packages/focus-lock/package.json
@@ -57,7 +57,6 @@
     "@bento/container": "*",
     "@bento/heading": "*",
     "@bento/listbox": "*",
-    "@bento/portal": "*",
     "@bento/radio": "*",
     "@bento/text": "*"
   },