@mortenbrudvik/waveui 0.14.1 → 0.16.0

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { ClassValue } from 'clsx';
+import { CSSProperties } from 'react';
 import { FC } from 'react';
 import { JSX } from 'react';
 import { JSXElementConstructor } from 'react';
@@ -11,7 +12,9 @@ import { ReactPortal } from 'react';
 /**
  * A vertically stacked set of disclosure sections (WAI-ARIA Accordion pattern). Each
  * `Accordion.Item` renders an `Accordion.Trigger` button inside a heading (`headingLevel`) and an
- * `Accordion.Panel` region that is shown while the item is open.
+ * `Accordion.Panel` region that is shown while the item is open. A panel opens and closes its
+ * space with a short collapse and fade (`Accordion.Panel`'s `motion`; none under reduced motion or
+ * a `WaveProvider` with `motion="none"`), and focus inside a closing panel moves to its trigger.
  *
  * Single mode (the default) keeps at most one item open (`openItem`, `defaultOpenItem`,
  * `onOpenItemChange`); `type="multiple"` lets any number of items open (`openItems`,
@@ -34,7 +37,7 @@ export declare const Accordion: {
         displayName: string;
     };
     Panel: {
-        ({ id: idProp, className, children, ref, ...rest }: AccordionPanelProps): React_2.JSX.Element | null;
+        ({ id: idProp, className, children, motion, ref, ...rest }: AccordionPanelProps): React_2.JSX.Element | null;
         displayName: string;
     };
 };
@@ -113,22 +116,46 @@ export declare interface AccordionMultipleProps extends AccordionBaseProps {
 }
 
 /**
- * The content region of an Accordion.Item, rendered only while the item is open and labelled by
- * its trigger. Its props (className merged, `ref`, `data-*`, handlers) land on the region, and a
- * non-empty `id` replaces the generated one (the trigger's `aria-controls` follows it).
+ * The content region of an Accordion.Item, labelled by its trigger and rendered while the item is
+ * open and while it collapses after a close. Its props (className merged, `ref`, `data-*`,
+ * handlers) land on the region, and a non-empty `id` replaces the generated one (the trigger's
+ * `aria-controls` follows it).
+ *
+ * The region renders as the only child of a collapse element (its stable class
+ * `wave-accordion-panel__collapse`), which opens and closes the region's space (`motion`) and has
+ * no box of its own while the item is open, so the region lays out in the Item as before. An item
+ * opened by default appears without motion. After a close the region stays in the document until
+ * the collapse ends, `inert` and with `data-state="closed"`, while its trigger already reports the
+ * item collapsed; opening the item again during the collapse keeps the same region and the state
+ * of its content. Focus inside the region when the item closes moves to the item's trigger.
  */
 export declare const AccordionPanel: {
-    ({ id: idProp, className, children, ref, ...rest }: AccordionPanelProps): React_2.JSX.Element | null;
+    ({ id: idProp, className, children, motion, ref, ...rest }: AccordionPanelProps): React_2.JSX.Element | null;
     displayName: string;
 };
 
-/** Accordion.Panel: `root` on the `role="region"` element. */
+/**
+ * Accordion.Panel: `root` on the `role="region"` element; `collapse` on the element around it
+ * (the element that opens and closes the region's space, 0.15).
+ */
 export declare const accordionPanelClassNames: {
     readonly root: "wave-accordion-panel";
+    readonly collapse: "wave-accordion-panel__collapse";
 };
 
 /** Properties for the AccordionPanel sub-component (merged onto the `role="region"` element). */
 export declare interface AccordionPanelProps extends React_2.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Replaces the panel's collapse (Fluent's `AccordionPanel collapseMotion`), on the element
+     * around the region: by default the space the region takes opens from nothing and closes back
+     * to it, with a fade, over the normal duration (200 ms) with the max easy-ease curve, both ways.
+     * `null` turns it off (the region appears and disappears at once); a class string or
+     * `{ className }` replaces it, written as `MotionSlot` describes. A `WaveProvider` with
+     * `motion="none"` turns the default off, and a value here still applies under it. A panel
+     * rendered inside another panel has no motion of its own.
+     * @default the collapse described above
+     */
+    motion?: MotionSlot | null;
     /** Ref to the panel `<div role="region">`. */
     ref?: React_2.Ref<HTMLDivElement>;
 }
@@ -1588,12 +1615,16 @@ export declare type CardProps<C extends React_2.ElementType = 'div'> = Polymorph
  * - `controlsLayout` places the Previous and Next buttons over the slides (`overlay`,
  *   `overlay-wide`) or beside them (`inline`, `inline-wide`); `Carousel.Button` replaces the
  *   built-in button of its `direction` with one of your own glyph.
+ * - The slides glide to the new page over 300 ms; `motion="fade"` cross-fades them instead (one
+ *   slide per page), `motion={null}` turns the motion off and `motionDuration` times it. Under
+ *   reduced motion, or below a `WaveProvider` with `motion="none"` (unless `motion` is set), the
+ *   page changes at once.
  *
  * Compound access (`Carousel.Item`, `Carousel.Button`) needs a client module; React Server
  * Components import the flat names `CarouselItem` and `CarouselButton` instead.
  */
 export declare const Carousel: {
-    ({ value: controlledValue, defaultValue, onValueChange, autoPlay, autoPlayInterval, autoPlayLabels, labels, loop, groupSize, align, draggable, controlsLayout, appearance, className, children, onMouseEnter, onMouseLeave, onFocus, onBlur, ref, ...rest }: CarouselProps): React_2.JSX.Element;
+    ({ value: controlledValue, defaultValue, onValueChange, autoPlay, autoPlayInterval, autoPlayLabels, labels, loop, groupSize, align, draggable, controlsLayout, appearance, motion, motionDuration, className, children, onMouseEnter, onMouseLeave, onFocus, onBlur, ref, ...rest }: CarouselProps): React_2.JSX.Element;
     displayName: string;
 } & {
     Item: {
@@ -1741,6 +1772,12 @@ export declare interface CarouselLabels {
     slideRoleDescription?: string;
 }
 
+/**
+ * How a Carousel moves between pages: `slide` moves the slides in from the side of the page order,
+ * `fade` cross-fades them in place (one slide per page only).
+ */
+export declare type CarouselMotion = 'slide' | 'fade';
+
 /** Properties for the Carousel component. */
 export declare interface CarouselProps extends React_2.HTMLAttributes<HTMLDivElement> {
     /**
@@ -1774,10 +1811,12 @@ export declare interface CarouselProps extends React_2.HTMLAttributes<HTMLDivEle
     /**
      * Lets the pointer drag the slides (mouse, touch and pen). The track follows the pointer and,
      * on release, the page changes when the drag passed a quarter of the width or left fast, else
-     * it snaps back; the direction follows the carousel's. The click that ends a drag is not
-     * delivered to the slide, and a vertical swipe still scrolls the page. Dragging pauses
-     * autoplay like the pointer over the carousel does. The buttons and the keyboard stay the way
-     * to operate the carousel without a pointer.
+     * it snaps back; the direction follows the carousel's. Under `motion="fade"` the slides do not
+     * follow the pointer (they share one place): the same drag still changes the page on release,
+     * and the slides cross-fade. The click that ends a drag is not delivered to the slide, and a
+     * vertical swipe still scrolls the page. Dragging pauses autoplay like the pointer over the
+     * carousel does. The buttons and the keyboard stay the way to operate the carousel without a
+     * pointer.
      * @default false
      */
     draggable?: boolean;
@@ -1825,6 +1864,26 @@ export declare interface CarouselProps extends React_2.HTMLAttributes<HTMLDivEle
      * @default false
      */
     loop?: boolean;
+    /**
+     * How the carousel moves between pages: `slide` glides the slides in from the side of the page
+     * order (mirrored in right-to-left layouts), `fade` cross-fades them in place, and `null` turns
+     * the motion off (the page changes at once). Fluent's `motion`; its object form with a
+     * `duration` is not offered: use `motionDuration`. `fade` needs one slide per page: with
+     * `groupSize` above 1 or `'auto'` the slides slide, and a development warning says so. Under
+     * `fade` a drag still changes the page on release, but the slides do not follow the pointer.
+     * Below a `WaveProvider` with `motion="none"` the carousel does not move unless this prop is
+     * set. Either motion is off while the user prefers reduced motion. The root renders the motion
+     * it resolves from this prop, `groupSize` and the provider as `data-motion` (`slide`, `fade` or
+     * `none`); reduced motion leaves it unchanged.
+     * @default 'slide'
+     */
+    motion?: CarouselMotion | null;
+    /**
+     * How long the slide or the fade takes, in milliseconds. Fluent's `duration` is a different
+     * unit (Embla's unitless speed, 20 to 60), so a value ported from Fluent is far too short.
+     * @default 300
+     */
+    motionDuration?: number;
     ref?: React_2.Ref<HTMLDivElement>;
 }
 
@@ -1993,6 +2052,9 @@ export declare interface CheckedValuesChangeDetails {
  */
 export declare type CheckedValuesChangeHandler = (checkedValues: Record<string, string[]>, details?: CheckedValuesChangeDetails) => void;
 
+/** The check state of an item in a `selectionMode="multiple"` tree. */
+export declare type CheckState = 'checked' | 'mixed' | 'unchecked';
+
 /**
  * Joins class names (clsx) and resolves Tailwind conflicts so the **last** class wins — pass
  * internal classes first and the consumer's `className` last.
@@ -2581,6 +2643,26 @@ export declare interface ColorSwatchProps extends Omit<React_2.ButtonHTMLAttribu
     ref?: React_2.Ref<HTMLButtonElement>;
 }
 
+/** The sizing of one column of a table with resizable columns. */
+export declare interface ColumnSizingOption {
+    /**
+     * The narrowest the column can be, in pixels: the initial width and every resize are held at or
+     * above it.
+     * @default 80
+     */
+    minWidth?: number;
+    /**
+     * The width the column starts at when it has no `defaultWidth`, in pixels.
+     * @default 150
+     */
+    idealWidth?: number;
+    /**
+     * The width the column starts at, in pixels. It wins over `idealWidth`.
+     * @default idealWidth, else 150
+     */
+    defaultWidth?: number;
+}
+
 /**
  * An editable combobox: a text input with a filterable listbox of `Option`s (APG combobox with
  * list autocomplete). Typing filters the options; ArrowDown/ArrowUp move the highlight
@@ -2610,6 +2692,15 @@ export declare interface ColorSwatchProps extends Omit<React_2.ButtonHTMLAttribu
  * the value. `freeform` is not available with `multiselect`, and a non-literal
  * `multiselect={flag}` is a type error: render two elements, one for each mode.
  *
+ * **Data mode**: `items` passes the options as data instead of children. The open list renders an
+ * option per matching item (`renderOption` draws it, an `Option` with the item's label by
+ * default) and the closed list none; the keys, the filter and the input's text follow the data,
+ * and each option carries `aria-posinset` and `aria-setsize` among the shown options. A long list
+ * takes a `virtualWindow` (from `useVirtualWindow({ itemSize })`): the open list then renders only
+ * the options in view, plus an overscan, with spacers for the others, every option `itemSize`
+ * tall; the active option stays rendered, and opening scrolls it (else the first selected option)
+ * to the middle of the list.
+ *
  * The `<input>` receives `id`, `aria-label`, `aria-labelledby`, `aria-describedby`,
  * `aria-invalid`, `aria-required`, `aria-errormessage`, `aria-details`, `tabIndex`, `autoFocus`,
  * `onFocus`/`onBlur`/`onKeyDown`/`onKeyUp` and the text input attributes `autoComplete`,
@@ -2636,7 +2727,8 @@ export declare const Combobox: ComboboxComponent;
  * Combobox: `root` on the outer element; `input` on the `role="combobox"` input; `clearButton` on
  * the clear button; `expandButton` on the expand button and `expandIcon` on its glyph; `listbox`
  * on the `role="listbox"` list; `surface` on its portaled popup; `emptyMessage` on the
- * "No matches" row.
+ * "No matches" row; `spacer` on each spacer element of the list with a `virtualWindow` (the
+ * elements that stand in for the options that are not rendered).
  */
 export declare const comboboxClassNames: {
     readonly root: "wave-combobox";
@@ -2647,6 +2739,7 @@ export declare const comboboxClassNames: {
     readonly listbox: "wave-combobox__listbox";
     readonly surface: "wave-combobox__surface";
     readonly emptyMessage: "wave-combobox__empty-message";
+    readonly spacer: "wave-combobox__spacer";
 };
 
 /** The Combobox component's type: a multi-select signature, then the single-select one. */
@@ -2799,8 +2892,9 @@ export declare interface ComboboxProps<M extends boolean = false> extends Omit<R
      * keep options that do not contain the text: `filter={() => true}` with `query` and
      * `onQueryChange` leaves the matching to you (a server-side search that replaces the options),
      * and a filter that always keeps an option of your own gives a "Create …" entry. With a
-     * server-side search, keep the selected option among the children, `hidden` while the results
-     * leave it out: a value without an option shows no label (the "Async search" story does this).
+     * server-side search, keep the selected option among the children (or `items`), `hidden` while
+     * the results leave it out: a value without an option shows no label (the "Async search" story
+     * does this).
      * @default a case-insensitive substring match on the option's `textValue`, else its `label`
      */
     filter?: (option: ListboxItem, query: string) => boolean;
@@ -2894,6 +2988,51 @@ export declare interface ComboboxProps<M extends boolean = false> extends Omit<R
      * Unset members keep their English defaults.
      */
     labels?: ComboboxLabels;
+    /**
+     * Data mode: the options as data, in list order (`value`, `label`, and optionally `textValue`,
+     * `disabled` and `hidden`; values unique). The open list renders one option per item that is
+     * not `hidden` and that the typed text matches (`filter`, on `textValue ?? label` by default; see
+     * `renderOption`); the closed list renders none. The keys, the selection and the input's label
+     * text follow `items`, also for a selected item whose option is not rendered. The children are
+     * neither read nor rendered: passing both warns once in development. Each option gets
+     * `aria-posinset` and `aria-setsize` from its place among the shown items (typing narrows
+     * them), and keeps one id per value. Without it, the options are the `Option` children.
+     */
+    items?: readonly ListboxItem[];
+    /**
+     * Data mode: renders the option of an item, given its state (`selected`, `active`, and `index`
+     * among the shown options). Return an `Option`, or an option component of your own on
+     * `useListboxOption`, with the item's `value` (and its `disabled`); its position is set for you,
+     * and in a windowed list (`virtualWindow`) its height. It is called again only when the item, its
+     * state, its position (`aria-posinset` and `aria-setsize`, which typing changes) or the function
+     * itself changes, so pass a stable function in a long list. Ignored without `items`, with a
+     * development warning.
+     * @default an `Option` with the item's `value`, `label` (also its text), `textValue` and `disabled`
+     */
+    renderOption?: (item: ListboxItem, state: ListboxOptionRenderState) => React_2.ReactNode;
+    /**
+     * Data mode: renders only the options in view of a long list, plus an overscan, and spacers
+     * (`aria-hidden`, `data-virtual-spacer`) as tall as the options they stand for: pass the result
+     * of `useVirtualWindow({ itemSize })`, or an object of your own that implements `VirtualWindow`.
+     * It needs `items`: without them, or beside `OptionGroup` children, it is ignored with a
+     * development warning (a window renders a flat list).
+     *
+     * The open popup's list is the window's scroller, so it needs no height of yours: it scrolls
+     * within its own maximum height (15rem, 240 pixels at the default root size, less where the
+     * viewport has no room). Every option is exactly `itemSize` tall (the list sets its height,
+     * after the option's own `style`), so an option's content must fit in it: the default `Option`
+     * with one line of text is 32 pixels tall.
+     *
+     * The window counts the shown options: typing narrows it, as it narrows `aria-setsize`. The
+     * arrow keys move over all of them; the active option stays rendered while it is scrolled away,
+     * so `aria-activedescendant` always names an element, and when a key (or typing) makes it
+     * active the list and the window move to it in the same update. Opening the list scrolls the
+     * active option, else the first selected one, to the middle of the list, and again once the
+     * popup's positioning has given the list its height (a short viewport) unless it was scrolled
+     * first. A closed list renders no option. The browser's scroll anchoring is off on a windowed
+     * list (the window lays the options out).
+     */
+    virtualWindow?: VirtualWindow;
     /**
      * Called when the `<input role="combobox">` receives focus (the root keeps other handlers).
      * With `multiselect`, a focus while the input shows the selected labels then selects them;
@@ -3181,6 +3320,29 @@ export declare function createToaster(): ToasterHandle;
  * itself, and `DataGrid.Body` also takes a render function that returns each item's row. Rows
  * rendered from `items` take their `rowId` from `getRowId` (by default the item's index).
  *
+ * With `items`, selection follows the data rather than the rendered rows: select-all and its
+ * checkbox cover every item (`isSelectionDisabled` leaves items out), and ids of rows that are
+ * filtered out, on another page or not rendered stay selected through row clicks, select-all and
+ * sorting, and are reported by `onSelectedItemsChange`.
+ *
+ * With `items` and `columns`, the columns can be sized: `resizableColumns` gives each column
+ * header a resize handle (a separator that a pointer drags and the arrow keys move, mirrored in
+ * right-to-left grids; F2 on a column header moves focus to it, and Enter, Space or Escape back),
+ * `columnSizingOptions` sets each column's initial and minimum width, and `columnWidths` or
+ * `defaultColumnWidths` with `onColumnWidthsChange(widths, details)` hold the widths, for
+ * instance to persist them (Fluent's `resizableColumns`, `columnSizingOptions` and
+ * `onColumnResize`, whose data is in `details`). The grid then lays its columns out from the
+ * widths and truncates its cells' text.
+ *
+ * With `items` and `columns`, a `virtualWindow` (from `useVirtualWindow`) renders only the rows in
+ * view of a long list, with spacer rows for the others: the scroll wrapper (`containerProps`)
+ * needs a bounded height, and every row has the window's fixed row height. The header stays at
+ * the top of the wrapper, the keyboard moves by the data (a row that is not rendered is scrolled
+ * in before it gets focus), the focused row stays rendered, and selection, select-all, sorting
+ * and column sizing still cover every item. The grid then carries `aria-rowcount` and its rows
+ * `aria-rowindex`, so assistive technology reads each row's place in the whole list. Fluent's
+ * DataGrid has no built-in counterpart.
+ *
  * Sub-components are available as `DataGrid.Header`, `DataGrid.HeaderCell`, `DataGrid.Body`,
  * `DataGrid.Row`, `DataGrid.Cell` and `DataGrid.SelectionCell` in client components, and as the
  * flat exports `DataGridHeader`, `DataGridHeaderCell`, `DataGridBody`, `DataGridRow`,
@@ -3192,7 +3354,7 @@ export declare const DataGrid: typeof DataGridRoot & {
         displayName: string;
     };
     HeaderCell: {
-        ({ columnId, sortable, sortIcon, children, className, onClick, ref, ...rest }: DataGridHeaderCellProps): React_2.JSX.Element;
+        ({ columnId, sortable, sortIcon, children, className, onClick, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ref, ...rest }: DataGridHeaderCellProps): React_2.JSX.Element;
         displayName: string;
     };
     Body: {
@@ -3200,7 +3362,7 @@ export declare const DataGrid: typeof DataGridRoot & {
         displayName: string;
     };
     Row: {
-        ({ rowId: rowIdProp, selectionLabel, selectionCellProps, children, className, onClick, onKeyDown, ref, ...rest }: DataGridRowProps): React_2.JSX.Element;
+        ({ rowId: rowIdProp, selectionLabel, selectionCellProps, children, className, style, onClick, onKeyDown, ref, ...rest }: DataGridRowProps): React_2.JSX.Element;
         displayName: string;
     };
     Cell: {
@@ -3217,10 +3379,28 @@ export declare const DataGrid: typeof DataGridRoot & {
 export declare interface DataGridBaseProps<T = unknown> extends React_2.HTMLAttributes<HTMLTableElement> {
     /**
      * The row id of an item: the `rowId` of its row (for selection), for rows rendered from `items`.
-     * A row's own `rowId` wins. Ids must be unique (a duplicate warns in development).
+     * Select-all and its checkbox use these ids, whether the rows are rendered or not. A row's own
+     * `rowId` wins for that row, but a row whose own id differs from its item's id is outside
+     * select-all and its state, and select-all selects the item's id, which no row has (a
+     * development warning says so): return the rows' ids here rather than setting `rowId`. Ids must
+     * be unique (a duplicate warns in development). Define it outside the component, or memoise it:
+     * a new function rebuilds the row of every item and the set of ids select-all works on (with a
+     * `virtualWindow`, the component that holds the window renders at every row the view enters).
      * @default the item's index in `items`, as a string
      */
     getRowId?: (item: T) => string;
+    /**
+     * Whether the selection of an item of `items` is disabled (`index` is its index in `items`), so
+     * select-all can skip items whose rows are not rendered. Select-all leaves such an item as it is,
+     * selected or not, and its state counts only the other items. The item's row takes it as the
+     * `disabled` of its selection cell (a disabled control; neither a row click nor Space changes
+     * it), unless the cell sets `disabled` itself: the cell's value then applies to the control, a
+     * value that disagrees warns in development, and select-all skips a row that either disables.
+     * Without it, every item is selectable unless its rendered row disables its selection cell.
+     * Ignored without `items`. Called for every item whenever `items`, `getRowId` or this function
+     * change: define it outside the component, or memoise it.
+     */
+    isSelectionDisabled?: (item: T, index: number) => boolean;
     /**
      * Column definitions. When given and no `DataGrid.Header` child is present, the header row
      * (including the selection column) is rendered from them: `columnId` becomes the header cell's
@@ -3231,6 +3411,87 @@ export declare interface DataGridBaseProps<T = unknown> extends React_2.HTMLAttr
      * memoised).
      */
     columns?: readonly DataGridColumn<T>[];
+    /**
+     * Gives the header cell of each column (of `columns`, by `columnId`; the last one included, the
+     * selection column not) a resize handle: a focusable `role="separator"` with the column's width
+     * as `aria-valuenow`. A drag (mouse, touch or pen) moves the column's end edge, mirrored in
+     * right-to-left grids. From the keyboard, F2 on a header cell (or on its sort button) moves focus
+     * to its handle, which adds no Tab stop to the grid; there the arrow keys move the edge by 20
+     * pixels (5 with Shift, mirrored in right-to-left grids), Home sets the minimum width, and Enter,
+     * Space or Escape return focus to the header (its sort button, which Enter still activates
+     * directly). A double click sets the column back to its initial width once a width is state.
+     * The grid carries `data-resizing` while a handle drags. Needs `columns` and `items`, as every
+     * column width prop does: without them they are all ignored, with a development warning.
+     * Fluent's `resizableColumns`.
+     * @default false
+     */
+    resizableColumns?: boolean;
+    /**
+     * The sizing of each column, by `columnId`: `minWidth` (`@default 80`), and the width it starts
+     * at, `defaultWidth`, else `idealWidth`, else 150 (never below `minWidth`). With it, or with
+     * `columnWidths` or `defaultColumnWidths`, the grid lays its columns out from these widths
+     * (a `<colgroup>` and a fixed table layout) with or without `resizableColumns`, and its cells
+     * truncate their text with an ellipsis unless a cell's class says otherwise. Until a width is
+     * state the grid is 100% wide and at least as wide as its columns, so a wider container spreads
+     * them (the selection column too); the first change takes the widths the columns are drawn at,
+     * so nothing jumps, and from then on the grid is exactly as wide as its columns (slack shows
+     * after the last one). There is no maximum width and no fitting to the container. Ids that are
+     * not columns are ignored; it may be written inline. Fluent's `columnSizingOptions`.
+     */
+    columnSizingOptions?: Record<string, ColumnSizingOption>;
+    /**
+     * The column widths in pixels (controlled), by `columnId`; a column without an entry has its
+     * initial width (see `columnSizingOptions`), and a width below the column's minimum is held at
+     * it. The grid is exactly as wide as its columns. Pair it with `onColumnWidthsChange`; a parent
+     * that ignores a change leaves the column where it is.
+     */
+    columnWidths?: Record<string, number>;
+    /** The column widths in pixels at first render (uncontrolled; see `columnWidths`). */
+    defaultColumnWidths?: Record<string, number>;
+    /**
+     * Called with the width of every column (by `columnId`) whenever a width changes, at every step
+     * of a drag (at most once per animation frame) or key press, then `details`: `{ columnId,
+     * width, event }`, the resized column, its new width and the event behind it. The grid always
+     * passes `details`; it is typed optional through 0.x, as every `details` argument. Setting the
+     * width a column already has does not call it once a width is state. Fluent's `onColumnResize`,
+     * whose data is in `details`.
+     */
+    onColumnWidthsChange?: (widths: Record<string, number>, details?: TableColumnWidthsChangeDetails) => void;
+    /**
+     * Renders only the body rows in view, plus an overscan, of a grid with many `items`: pass the
+     * result of `useVirtualWindow({ itemSize })` (or an object of your own that implements
+     * `VirtualWindow`). The rows that are not rendered are replaced by spacer rows (`aria-hidden`,
+     * `data-virtual-spacer`) of their height. Fluent has no counterpart in its DataGrid.
+     *
+     * The grid's scroll wrapper (the element of `containerProps`) becomes the window's scroller, so
+     * give it a bounded height, a height or a maximum height in `containerProps`: without one the
+     * window measures the whole list and renders every row (a development warning says so). Every
+     * row has the window's `itemSize` as its height: the grid sets it on each body row, drops the
+     * vertical padding of its cells and keeps their text on one line, so a cell's content must fit
+     * in it. The columns are laid out from widths (as with `columnSizingOptions`), so they never
+     * change width as rows come and go. The header stays at the top of the scroller: pass its height
+     * as `scrollPaddingStart` to `useVirtualWindow`, so keyboard moves bring rows into the area below
+     * it. The scroller is no tab stop of its own (`tabIndex` -1, as Firefox would stop on it; a
+     * `tabIndex` in `containerProps` wins), and the browser's scroll anchoring is off on it (the
+     * window lays the rows out).
+     *
+     * The keyboard moves by the data: ArrowUp/ArrowDown, PageUp/PageDown and Ctrl+Home/Ctrl+End
+     * scroll a target row that is not rendered into the window, then focus it, and the focused row
+     * stays rendered when it is scrolled away. When a data change (a sort, new `items`) makes the
+     * browser drop focus from the moved row, focus returns to the same row, or to the row nearest
+     * its place. Sorting, selection, select-all and column sizing work on every item, rendered or
+     * not. The grid carries `aria-rowcount` (the items plus the header rows), every row
+     * `aria-rowindex` (1-based, the header rows first, the body rows in the sorted order) and every
+     * body row `data-row-index` (its 0-based position in the sorted order); a grid without a window
+     * renders none of them.
+     *
+     * Needs `items` and `columns`, with the body rows rendered from them (no `DataGrid.Body` child,
+     * or one whose child is a render function); otherwise it is ignored, with a development warning.
+     * The component that calls `useVirtualWindow` renders again at every row the view enters: keep
+     * `items`, `columns`, `getRowId` and `isSelectionDisabled` stable (defined outside it, or
+     * memoised), or each of those renders rebuilds the rows of every item.
+     */
+    virtualWindow?: VirtualWindow;
     /**
      * Row selection mode. `'multiple'` adds a checkbox column with a "Select all rows" header
      * checkbox; `'single'` adds a radio column (its header reads "Selection" to assistive
@@ -3239,8 +3500,10 @@ export declare interface DataGridBaseProps<T = unknown> extends React_2.HTMLAttr
      */
     selectionMode?: 'none' | SelectionMode_2;
     /**
-     * The name of the select-all checkbox and the header text of the selection column, for
-     * localization. Unset members keep their English defaults. Rows are named with their own
+     * The grid's built-in text, for localization: the name of the select-all checkbox
+     * (`selectAll`), the header text of the selection column (`selectionHeader`), and, with
+     * `resizableColumns`, the name of the resize handles (`resizeColumn`) and their value text
+     * (`columnWidth`). Unset members keep their English defaults. Rows are named with their own
      * `selectionLabel`.
      */
     labels?: DataGridLabels;
@@ -3272,18 +3535,33 @@ export declare interface DataGridBaseProps<T = unknown> extends React_2.HTMLAttr
      */
     subtleSelection?: boolean;
     /**
-     * Controlled selected row ids (`DataGrid.Row` `rowId`). In single mode pass at most one id: with
-     * several, only the first one whose row is rendered is selected (a development warning says so).
+     * Controlled selected row ids (`DataGrid.Row` `rowId`; with `items`, the ids from `getRowId`).
+     * With `items`, every id counts, whether its row is rendered, filtered out or on another page
+     * (see `onSelectedItemsChange`). In single mode pass at most one id: with several, only the
+     * first one is selected (without `items`, the first one whose row is rendered), and a
+     * development warning says so.
      */
     selectedItems?: readonly string[];
     /** Initially selected row ids (uncontrolled). In single mode, at most one (see `selectedItems`). */
     defaultSelectedItems?: readonly string[];
     /**
      * Called with the new selected row ids when the selection changes, then `details` (`{ event }`,
-     * the click or key press behind the change). Ids of rows that are not rendered are left out of
-     * the reported selection and of the select-all state, so the next change drops them. Until that
-     * change an uncontrolled grid still holds such an id: a row re-added with the same `rowId` before
-     * then is shown selected again.
+     * the click or key press behind the change).
+     *
+     * With `items`, the selection follows the data: it reports every selected id, also ids whose
+     * rows are not rendered or not in `items` (filtered out, on another page, restored by id), and no
+     * change drops them. Select-all selects every item of `items` whose selection is not disabled
+     * (`isSelectionDisabled`, or the selection cell of its rendered row) and keeps every other id;
+     * when all of them are selected it removes only their ids. The select-all checkbox shows the
+     * state of those items. Both use the ids from `getRowId` (by default the item's index): a row
+     * that sets its own, different `rowId` (or a `DataGrid.Row` child whose `rowId` is no item's
+     * id) is outside them, and select-all then selects ids that no row has, with a development
+     * warning. Pass a `getRowId` that returns the rows' ids.
+     *
+     * Without `items` (rows written as `DataGrid.Row` children), ids of rows that are not rendered
+     * are left out of the reported selection and of the select-all state, so the next change drops
+     * them. Until that change an uncontrolled grid still holds such an id: a row re-added with the
+     * same `rowId` before then is shown selected again.
      */
     onSelectedItemsChange?: (selectedItems: string[], details?: DataGridSelectedItemsChangeDetails) => void;
     /** @deprecated Use `selectedItems` (an array). A `Set` or an array is accepted. */
@@ -3294,7 +3572,8 @@ export declare interface DataGridBaseProps<T = unknown> extends React_2.HTMLAttr
     onSelectionChange?: (keys: Set<string>) => void;
     /**
      * Props for the wrapper `<div>` around the `<table>`: a horizontally scrollable container
-     * (`overflow-x-auto`). Use it for its className, style (e.g. a max height) or ref. The wrapper
+     * (`overflow-x-auto`). Use it for its className, style (e.g. a max height) or ref. With a
+     * `virtualWindow` it is the window's scroller, which needs a bounded height. The wrapper
      * is not a tab stop (the grid's own cell tab stop scrolls it) and has no role, so its
      * `aria-label`/`aria-labelledby` are applied only together with a `role` (e.g. `'region'`);
      * without one they are dropped with a development warning. Name the grid with `aria-label`.
@@ -3312,7 +3591,9 @@ export declare interface DataGridBaseProps<T = unknown> extends React_2.HTMLAttr
 /**
  * The grid's `<tbody>`. Its child can also be a render function, called with each item of the
  * grid's `items` (and its index there) to render the item's row; without children, a grid with
- * `items` and `columns` renders the rows from the columns.
+ * `items` and `columns` renders the rows from the columns. In a grid with a `virtualWindow` it
+ * renders the rows of the window, the function being called for those rows only, and a spacer
+ * row for each run of rows it leaves out.
  */
 export declare const DataGridBody: {
     <T>({ children, className, ref, ...rest }: DataGridBodyProps<T>): React_2.JSX.Element;
@@ -3343,7 +3624,10 @@ export declare interface DataGridBodyProps<T = unknown> extends Omit<React_2.HTM
 
 /**
  * A grid cell (`<td>`), focusable through the grid's keyboard navigation. It is the positioning
- * box of a `Table.CellActions` inside it.
+ * box of a `Table.CellActions` inside it. In a grid that lays its columns out from widths (column
+ * sizing, a `virtualWindow`), its text stays on one line and is truncated with an ellipsis, unless
+ * its class says otherwise. In a body row of a grid with a `virtualWindow` it has no vertical
+ * padding: the row has the window's height, which its content must fit in.
  */
 export declare const DataGridCell: {
     ({ children, className, ref, ...rest }: DataGridCellProps): React_2.JSX.Element;
@@ -3363,10 +3647,15 @@ export declare interface DataGridCellProps extends React_2.TdHTMLAttributes<HTML
     ref?: React_2.Ref<HTMLTableCellElement>;
 }
 
-/** DataGrid: `root` on the grid element (`role="grid"`); `container` on the wrapper around it. */
+/**
+ * DataGrid: `root` on the grid element (`role="grid"`); `container` on the wrapper around it;
+ * `spacer` on each spacer row of a grid with a `virtualWindow` (the rows that stand in for the
+ * rows that are not rendered).
+ */
 export declare const dataGridClassNames: {
     readonly root: "wave-data-grid";
     readonly container: "wave-data-grid__container";
+    readonly spacer: "wave-data-grid__spacer";
 };
 
 /**
@@ -3434,6 +3723,8 @@ export declare interface DataGridControlledSortProps extends NoDeprecatedSortPro
  * mode) or the "Selection" header (single mode; DataGrid's `labels` localizes both), later rows of
  * a grouped header an empty cell. A header row rendered by another component cannot get it (a
  * development warning says so): use `DataGrid.Row` for such a row, which adds the cell itself.
+ * In a grid with a `virtualWindow` the header stays at the top of the grid's scroll wrapper while
+ * the rows scroll under it, and each header row carries its `aria-rowindex`.
  */
 export declare const DataGridHeader: {
     ({ children, className, ref, ...rest }: DataGridHeaderProps): React_2.JSX.Element;
@@ -3445,21 +3736,28 @@ export declare const DataGridHeader: {
  * `<button type="button">` that toggles the sort, followed by the direction glyph (`sortIcon`)
  * while its column is sorted; the `<th>` carries `aria-sort`. A consumer `onClick` (on the `<th>`)
  * runs before the sort, and calling `preventDefault()` in it cancels the sort (also for
- * Enter/Space on the button, which click it).
+ * Enter/Space on the button, which click it). In a grid with `resizableColumns`, the header cell
+ * of a column of `columns` (by `columnId`) also holds the column's resize handle, after its
+ * content, along its end edge (the cell is positioned for it); the cell is then named by its
+ * content alone (`aria-labelledby`, unless it has a name of its own), not by the handle's label.
+ * The handle is no target of the grid's navigation: a sortable cell's target stays its sort
+ * button, and F2 on the cell or the button moves focus to the handle.
  */
 export declare const DataGridHeaderCell: {
-    ({ columnId, sortable, sortIcon, children, className, onClick, ref, ...rest }: DataGridHeaderCellProps): React_2.JSX.Element;
+    ({ columnId, sortable, sortIcon, children, className, onClick, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ref, ...rest }: DataGridHeaderCellProps): React_2.JSX.Element;
     displayName: string;
 };
 
 /**
  * DataGrid.HeaderCell: `root` on the `<th>`; `button` on the sort button; `sortIcon` on its
- * direction glyph (the default arrow `<svg>`, or the `<span>` of a `sortIcon` slot).
+ * direction glyph (the default arrow `<svg>`, or the `<span>` of a `sortIcon` slot);
+ * `resizeHandle` on the column's resize handle (a `Table.ResizeHandle`, with resizable columns).
  */
 export declare const dataGridHeaderCellClassNames: {
     readonly root: "wave-data-grid-header-cell";
     readonly button: "wave-data-grid-header-cell__button";
     readonly sortIcon: "wave-data-grid-header-cell__sort-icon";
+    readonly resizeHandle: "wave-data-grid-header-cell__resize-handle";
 };
 
 /** Properties for the DataGridHeaderCell sub-component. */
@@ -3561,6 +3859,16 @@ export declare interface DataGridLabels {
      * @default 'Selection'
      */
     selectionHeader?: string;
+    /**
+     * Accessible name of each column's resize handle (`resizableColumns`).
+     * @default 'Resize column'
+     */
+    resizeColumn?: string;
+    /**
+     * Builds the value text of a resize handle (`aria-valuetext`) from the column's width in pixels.
+     * @default (width) => `${width} pixels`
+     */
+    columnWidth?: (width: number) => string;
 }
 
 /**
@@ -3629,9 +3937,13 @@ declare namespace DataGridRoot {
  * ancestor, so the rows of a grid nested in a cell
  * share it: hovering the outer row also draws the subtle controls of the nested grid (a limit of
  * CSS groups). A Tree in a cell keeps its own rows' group.
+ *
+ * In a grid with a `virtualWindow`, a row rendered for an item has the window's `itemSize` as its
+ * height (its own `style` height loses) and carries `aria-rowindex` and `data-row-index`; a header
+ * row carries `aria-rowindex`.
  */
 export declare const DataGridRow: {
-    ({ rowId: rowIdProp, selectionLabel, selectionCellProps, children, className, onClick, onKeyDown, ref, ...rest }: DataGridRowProps): React_2.JSX.Element;
+    ({ rowId: rowIdProp, selectionLabel, selectionCellProps, children, className, style, onClick, onKeyDown, ref, ...rest }: DataGridRowProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -3652,7 +3964,9 @@ export declare interface DataGridRowProps extends React_2.HTMLAttributes<HTMLTab
      * a duplicate warns in development). A selectable grid renders no selection control (and warns
      * in development) for a row without it. A row rendered from the grid's `items` (by
      * `DataGrid.Body`'s render function or from `columns`) defaults to the item's row id
-     * (`getRowId`).
+     * (`getRowId`). In a grid with `items`, select-all uses the ids from `getRowId`: a row whose
+     * `rowId` differs from its item's id, or is no item's id, is outside it (a development warning
+     * says so), so set `getRowId` rather than a different `rowId`.
      */
     rowId?: string;
     /**
@@ -3688,7 +4002,7 @@ export declare interface DataGridRowSelectionCellProps {
      * (the cell takes focus), and neither a row click (`selectOnRowClick`), Space on a cell nor
      * select-all changes the row's selection: select-all skips it, keeps it as it is, and tells its
      * state from the other rows. In a header row it disables the select-all checkbox.
-     * @default false
+     * @default false (in a row rendered from `items`: the grid's `isSelectionDisabled` for its item)
      */
     disabled?: boolean;
     /**
@@ -3729,6 +4043,8 @@ export declare type DataGridSelectionAppearance = 'brand' | 'neutral' | 'none';
  * selection cell props of its row (`selectionCellProps`), its own winning. `aria-label`,
  * `aria-labelledby` and `aria-describedby` go to the control; the other props, `className` and
  * `ref` to the cell. In a grid without selection it renders nothing (with a development warning).
+ * In a body row of a grid with a `virtualWindow` it has no vertical padding (the row has the
+ * window's height) and its control is centred.
  */
 export declare const DataGridSelectionCell: {
     ({ disabled, invisible, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, controlRef, ref, ...rest }: DataGridSelectionCellProps): React_2.JSX.Element | null;
@@ -4173,8 +4489,11 @@ export declare type DeprecatedPresenceStatus = 'dnd' | 'oof';
  *   closed, so a form keeps what was typed and the components inside keep their state; each open
  *   focuses the first focusable element again (an `autoFocus` inside never applies), and a kept
  *   dialog opened while another overlay is open stacks above it.
- * - **Presence**: the surface mounts through the presence core and renders `data-presence`; no
- *   motion ships, and `data-[presence=…]:` classes on `Dialog.Content` animate it.
+ * - **Motion**: the surface scales and fades in and out and the backdrop fades with it (none under
+ *   reduced motion); `Dialog.Content`'s `motion` and `backdropMotion` turn each off (`null`) or
+ *   replace it, and `WaveProvider motion="none"` turns both off. The surface mounts through the
+ *   presence core and renders `data-presence`; while it exits it stays on screen, `inert`, and
+ *   focus, the trap and the scroll lock are already released.
  * - **Naming**: give `Dialog.Content` a `title`, a `Dialog.Title`, or `aria-label`.
  *
  * The sub-components are also exported under flat names (`DialogTrigger`, `DialogContent`,
@@ -4202,7 +4521,7 @@ export declare const Dialog: {
         displayName: string;
     };
     Content: {
-        ({ title, size, backdrop, closeButton, titleAction, closeLabel, children, className, style, id, onKeyDown, ref, ...rest }: DialogContentProps): React_2.JSX.Element | null;
+        ({ title, size, backdrop, motion, backdropMotion, closeButton, titleAction, closeLabel, children, className, style, id, onKeyDown, ref, ...rest }: DialogContentProps): React_2.JSX.Element | null;
         displayName: string;
     };
     Footer: {
@@ -4267,17 +4586,22 @@ export declare interface DialogCloseRenderProps extends React_2.HTMLAttributes<H
  * centres the surface and lets presses through to the page. The titles' end padding follows the
  * width of the title-actions area (`--wave-dialog-title-end-padding`, 2rem until it is measured).
  *
- * It mounts through the presence core: the backdrop, the positioner and the surface render
- * `data-presence` (`entered` while open, `exited` while kept closed; `entering` and `exiting`
- * only while a motion of yours runs on the surface), and the backdrop and the positioner are
- * `inert` while exiting and `hidden` and `inert` while kept closed. No motion ships: animate the
- * surface with `data-[presence=…]:` classes in `className` (an enter's start as
- * `data-[presence=entering]:starting:`, each with a `motion-reduce:` counterpart); a closed
- * surface waits for that motion before it unmounts or hides, while focus, the trap and the
- * isolation follow the open state at once.
+ * It moves in and out: the surface scales up from 85% of its size and fades in over 250 ms, and
+ * scales down and fades out over 200 ms, while the backdrop fades in over 250 ms and out with the
+ * surface; a dialog open by default animates in when it mounts in the browser. Under reduced
+ * motion both appear and disappear at once. `motion` (the surface) and `backdropMotion` (the
+ * backdrop) turn each motion off (`null`) or replace its classes, and a `WaveProvider` with
+ * `motion="none"` turns both defaults off. It mounts through the presence core: the backdrop, the
+ * positioner and the surface render `data-presence` (`entering` and `exiting` while the surface's
+ * motion runs, `entered` while open, `exited` while kept closed), and the backdrop and the
+ * positioner are `inert` while exiting and `hidden` and `inert` while kept closed. A closed
+ * surface waits for its motion before it unmounts or hides, while focus, the trap, the isolation
+ * and the scroll lock follow the open state at once: an exiting dialog lets clicks through to the
+ * page (an `inert` element takes no pointer events), and the page's scrollbar comes back while the
+ * dialog still fades. Opened again during its exit, the same surface enters again.
  */
 export declare const DialogContent: {
-    ({ title, size, backdrop, closeButton, titleAction, closeLabel, children, className, style, id, onKeyDown, ref, ...rest }: DialogContentProps): React_2.JSX.Element | null;
+    ({ title, size, backdrop, motion, backdropMotion, closeButton, titleAction, closeLabel, children, className, style, id, onKeyDown, ref, ...rest }: DialogContentProps): React_2.JSX.Element | null;
     displayName: string;
 };
 
@@ -4328,6 +4652,29 @@ export declare interface DialogContentProps extends Omit<React_2.HTMLAttributes<
     backdrop?: Slot<'div'> | (SlotObject<'div'> & {
         appearance?: BackdropAppearance;
     });
+    /**
+     * The surface's motion. By default it scales up from 85% of its size and fades in over 250 ms
+     * with a decelerating curve, and scales down and fades out over 200 ms with an accelerating
+     * curve; under reduced motion it appears and disappears at once. `null` turns the motion off
+     * (the surface still renders its `data-presence` phases, which then end at once); a class string
+     * or `{ className }` replaces the default classes with yours (see `MotionSlot`), also under a
+     * `WaveProvider` with `motion="none"`, which otherwise turns the default off. A `className` that
+     * holds `data-[presence=…]` classes while `motion` is unset keeps 0.14's behaviour: no default
+     * motion, your classes animate the surface. Fluent's `Dialog` `surfaceMotion`.
+     * @default the scale and fade above
+     */
+    motion?: MotionSlot | null;
+    /**
+     * The backdrop's motion. By default it fades in over 250 ms and out over 200 ms, the surface's
+     * exit, with an easy-ease curve; under reduced motion it appears and disappears at once. `null`
+     * turns the motion off; a class string or `{ className }` replaces the default classes with yours
+     * (see `MotionSlot`), also under a `WaveProvider` with `motion="none"`, which otherwise turns the
+     * default off. The surface's motion decides when the dialog unmounts or hides: a replacement
+     * longer than the surface's exit is cut off there. Ignored with `modalType="non-modal"` (a
+     * development warning says so). Fluent's `DialogSurface` `backdropMotion`.
+     * @default the fade above
+     */
+    backdropMotion?: MotionSlot | null;
     /**
      * Content of the built-in Close button (the dismiss glyph by default). It renders inside the
      * button, decorative (`aria-hidden`), so the button keeps the name `closeLabel`; a slot object's
@@ -4456,13 +4803,13 @@ export declare interface DialogProps {
      */
     finalFocusRef?: React_2.RefObject<HTMLElement | null>;
     /**
-     * Removes `Dialog.Content` (the surface and everything in it) when the dialog closes. `false`
-     * keeps it mounted while closed, `hidden` and `inert`, so a form inside keeps what was typed and
-     * the components inside keep their state; the surface then mounts with the Dialog, closed (in
-     * the browser only, as an open one), and an `autoFocus` inside it never applies (each open
-     * focuses the first focusable element). A popup opened inside that is still open when the
-     * dialog closes stays open over the page (a development warning says so): close it first.
-     * Fluent's `unmountOnClose`.
+     * Removes `Dialog.Content` (the surface and everything in it) when the dialog closes, once its
+     * exit motion has ended. `false` keeps it mounted while closed, `hidden` and `inert`, so a form
+     * inside keeps what was typed and the components inside keep their state; the surface then
+     * mounts with the Dialog, closed (in the browser only, as an open one), and an `autoFocus`
+     * inside it never applies (each open focuses the first focusable element). A popup opened inside
+     * that is still open when the dialog closes stays open over the page (a development warning says
+     * so): close it first. Fluent's `unmountOnClose`.
      * @default true
      */
     unmountOnClose?: boolean;
@@ -4693,13 +5040,28 @@ export declare type DividerProps<C extends React_2.ElementType = 'hr'> = Polymor
  *   each open of an overlay focuses the first focusable element again (an `autoFocus` inside never
  *   applies), and a kept overlay opened while another overlay is open stacks above it. A kept
  *   inline drawer is in the server HTML, hidden.
+ * - **Motion**: an overlay panel slides in from its edge and fades in, and slides back and fades
+ *   out, over 250 ms (`small`), 300 ms (`medium`), 400 ms (`large`) or 500 ms (`full`), and its
+ *   backdrop fades with it; an overlay open by default animates in when it mounts in the browser.
+ *   An inline drawer opens and closes the space it takes in the layout over the same durations,
+ *   its panel held at its size and fading, so it reads as sliding out from its edge; one open by
+ *   default does not animate in, and one at `full` has no motion (a percentage width in
+ *   `className` resizes oddly during the motion: give it a length, or pass `motion={null}`).
+ *   Under reduced motion every drawer appears and disappears at once. `motion` (the panel, or an
+ *   inline drawer's space) and `backdropMotion` (the backdrop) turn each off (`null`) or replace
+ *   it, and `WaveProvider motion="none"` turns both defaults off. `data-[presence=…]:` classes in
+ *   `className` keep 0.14's behaviour: no default motion, they animate the panel.
  * - **Presence**: the panel and the backdrop mount through the presence core and render
- *   `data-presence` (`entered` while open, `exited` while kept closed); the backdrop and the
- *   panel (an inline drawer's `<aside>`) are `inert` while exiting and `hidden` and `inert` while
- *   kept closed. No motion ships:
- *   `data-[presence=…]:` classes in `className` animate the panel, whose motion a closed drawer
- *   waits for before it unmounts or hides (focus, the trap and the isolation follow the open
- *   state at once).
+ *   `data-presence` (`entering` and `exiting` while the drawer's motion runs, `entered` while
+ *   open, `exited` while kept closed). An inline drawer's `<aside>` is the only child of an
+ *   element of its own (`wave-drawer__collapse`), which renders the same phases, carries the
+ *   inline motion and has no box while open, so the `<aside>` lays out in your page as without
+ *   it. The backdrop and the panel (an inline drawer's `<aside>` and the element around it) are
+ *   `inert` while exiting and `hidden` and `inert` while kept closed. A closed drawer waits for
+ *   its motion (the panel's, an inline one's on the element around it) before it unmounts or
+ *   hides, while focus, the trap, the isolation and the scroll lock follow the open state at
+ *   once: an exiting overlay lets clicks through to the page (an `inert` element takes no pointer
+ *   events). Opened again during its exit, the same panel enters again.
  *
  * The sub-components are also exported under flat names (`DrawerTrigger`, `DrawerClose`,
  * `DrawerTitle`, `DrawerHeader`, `DrawerHeaderTitle`, `DrawerHeaderNavigation`, `DrawerBody`,
@@ -4720,7 +5082,7 @@ export declare type DividerProps<C extends React_2.ElementType = 'hr'> = Polymor
  * </Drawer>
  */
 export declare const Drawer: {
-    ({ open: openProp, defaultOpen, onOpenChange, type, separator, position, size, modalType, backdrop, closeButton, titleAction, title, closeLabel, finalFocusRef, unmountOnClose, children, id, ref, ...rest }: DrawerProps): JSX.Element;
+    ({ open: openProp, defaultOpen, onOpenChange, type, separator, position, size, modalType, backdrop, motion, backdropMotion, closeButton, titleAction, title, closeLabel, finalFocusRef, unmountOnClose, children, id, ref, ...rest }: DrawerProps): JSX.Element;
     displayName: string;
 } & {
     Trigger: {
@@ -4790,16 +5152,19 @@ export declare interface DrawerBodyProps extends React_2.HTMLAttributes<HTMLDivE
 /**
  * Drawer: `root` on the panel (the portaled `role="dialog"` element of an overlay drawer, while it
  * is open or kept mounted, or the `<aside>` of an inline one); `backdrop` on the backdrop of a
- * modal or alert overlay drawer; `header` on the built-in header row (absent with a
- * Drawer.Header); `titleAction` on the element of the `titleAction` slot in that row;
- * `closeButton` on every built-in Close button (which also carries Button's root), in the built-in
- * header and in each Drawer.HeaderTitle; `body` on the scrolling body. The heading of its `title`
- * prop carries Drawer.Title's class. The panel carries `data-type`, `data-position` and
- * `data-size`; the body, the header and the footer carry `data-scroll-state`.
+ * modal or alert overlay drawer; `collapse` on the element around an inline drawer's panel (its
+ * only child), which carries the presence phases and the motion of an inline drawer; `header` on
+ * the built-in header row (absent with a Drawer.Header); `titleAction` on the element of the
+ * `titleAction` slot in that row; `closeButton` on every built-in Close button (which also
+ * carries Button's root), in the built-in header and in each Drawer.HeaderTitle; `body` on the
+ * scrolling body. The heading of its `title` prop carries Drawer.Title's class. The panel carries
+ * `data-type`, `data-position` and `data-size`; the body, the header and the footer carry
+ * `data-scroll-state`.
  */
 export declare const drawerClassNames: {
     readonly root: "wave-drawer";
     readonly backdrop: "wave-drawer__backdrop";
+    readonly collapse: "wave-drawer__collapse";
     readonly header: "wave-drawer__header";
     readonly titleAction: "wave-drawer__title-action";
     readonly closeButton: "wave-drawer__close-button";
@@ -5057,7 +5422,10 @@ export declare interface DrawerProps extends Omit<React_2.HTMLAttributes<HTMLEle
      * viewport's width — or its height at the bottom (the same values; `full` the viewport's height).
      * It never exceeds the viewport. An inline panel takes the same sizes, where `full` is its
      * container's width (height), and never grows past its container. A width class in `className`
-     * (a height class for `bottom`) replaces it. Rendered as `data-size`. Fluent's `size`.
+     * (a height class for `bottom`) replaces it. It also times the motion, an overlay's slide and an
+     * inline drawer's collapse alike: 250 ms small, 300 ms medium, 400 ms large, 500 ms full (an
+     * inline drawer at `full` has no motion; see `motion`). Rendered as `data-size`. Fluent's
+     * `size`.
      * @default 'small'
      */
     size?: DrawerSize;
@@ -5091,6 +5459,43 @@ export declare interface DrawerProps extends Omit<React_2.HTMLAttributes<HTMLEle
     backdrop?: Slot<'div'> | (SlotObject<'div'> & {
         appearance?: BackdropAppearance;
     });
+    /**
+     * The drawer's motion. By default an overlay panel slides in from beyond its edge and fades in
+     * with a decelerating curve, and slides back out and fades out with an accelerating curve; the
+     * `start` and `end` edges follow the text direction, `left` and `right` do not mirror, and a
+     * `bottom` panel rises from below. An inline drawer by default opens the space it takes in your
+     * layout from nothing (its width at a side, its height at the bottom) while its panel fades in,
+     * held at its size against its inner edge, so it reads as sliding out from that edge, with a
+     * decelerating curve; closing runs the same backwards with an accelerating curve. Both take a
+     * duration that follows `size` both ways: 250 ms small, 300 ms medium, 400 ms large, 500 ms
+     * full. An inline drawer at `full` has no motion, as its size is its container's (a value here
+     * does not apply to it either), and an inline drawer whose width (height at the bottom) in
+     * `className` is a percentage resizes oddly during the motion, correctly once open: give it a
+     * length, or pass `null`. Under reduced motion the drawer appears and disappears at once.
+     * `null` turns the motion off (the drawer still renders its `data-presence` phases, which then
+     * end at once); a class string or `{ className }` replaces the default classes with yours (see
+     * `MotionSlot`), also under a `WaveProvider` with `motion="none"`, which otherwise turns the
+     * default off. They go on the overlay panel, or on the element around an inline drawer's
+     * `<aside>` (`wave-drawer__collapse`), whose phases the drawer waits for. A `className` that
+     * holds `data-[presence=…]` classes while `motion` is unset keeps 0.14's behaviour: no default
+     * motion, your classes animate the panel, and the drawer waits for the panel's motion (an
+     * inline one's `<aside>`, not the element around it). Fluent's `OverlayDrawer` and
+     * `InlineDrawer` `surfaceMotion`.
+     * @default the slide (overlay) or the collapse (inline) above
+     */
+    motion?: MotionSlot | null;
+    /**
+     * The backdrop's motion (a modal or alert overlay). By default it fades in and out with a
+     * linear curve over the panel's duration (250 to 500 ms, by `size`), so it ends with the panel;
+     * under reduced motion it appears and disappears at once. `null` turns the motion off; a class
+     * string or `{ className }` replaces the default classes with yours (see `MotionSlot`), also
+     * under a `WaveProvider` with `motion="none"`, which otherwise turns the default off. The
+     * panel's motion decides when the drawer unmounts or hides: a replacement longer than the
+     * panel's exit is cut off there. Ignored with `modalType="non-modal"` and by an inline drawer
+     * (a development warning says so). Fluent's `OverlayDrawer` `backdropMotion`.
+     * @default the fade above
+     */
+    backdropMotion?: MotionSlot | null;
     /**
      * Content of the built-in Close button, in the built-in header and in every
      * `Drawer.HeaderTitle`, as `Dialog.Content`'s `closeButton`: decorative content inside the button
@@ -5136,16 +5541,17 @@ export declare interface DrawerProps extends Omit<React_2.HTMLAttributes<HTMLEle
      */
     finalFocusRef?: React_2.RefObject<HTMLElement | null>;
     /**
-     * Removes the panel and its content when the drawer closes. `false` keeps them mounted while
-     * closed, `hidden` and `inert` (out of the layout, the Tab order and the accessibility tree), so
-     * what was typed and the state of the components inside survive closing and opening again; the
-     * content then mounts with the Drawer, closed, and an `autoFocus` inside it never applies (an
-     * overlay focuses its first focusable element on each open). An overlay panel still renders only
-     * in the browser; a kept inline panel is in the server HTML, hidden. Kept content still belongs
-     * to its form: a `required` empty field in a closed inline drawer inside a page `<form>` blocks
-     * its submission without a visible message. A popup opened inside that is still open when the
-     * drawer closes stays open over the page (a development warning says so): close it first. A
-     * `key` on the Drawer resets the kept content. Fluent's `unmountOnClose`.
+     * Removes the panel and its content when the drawer closes, once the panel's exit motion has
+     * ended. `false` keeps them mounted while closed, `hidden` and `inert` (out of the layout, the
+     * Tab order and the accessibility tree), so what was typed and the state of the components
+     * inside survive closing and opening again; the content then mounts with the Drawer, closed, and
+     * an `autoFocus` inside it never applies (an overlay focuses its first focusable element on each
+     * open). An overlay panel still renders only in the browser; a kept inline panel is in the
+     * server HTML, hidden. Kept content still belongs to its form: a `required` empty field in a
+     * closed inline drawer inside a page `<form>` blocks its submission without a visible message. A
+     * popup opened inside that is still open when the drawer closes stays open over the page (a
+     * development warning says so): close it first. A `key` on the Drawer resets the kept content.
+     * Fluent's `unmountOnClose`.
      * @default true
      */
     unmountOnClose?: boolean;
@@ -5306,6 +5712,14 @@ export declare type DrawerType = 'overlay' | 'inline';
  * `clearable` then clears every value. A non-literal `multiselect={flag}` is a type error: render
  * two elements, one for each mode.
  *
+ * **Data mode**: `items` passes the options as data instead of children. The open list renders an
+ * option per item (`renderOption` draws it, an `Option` with the item's label by default) and the
+ * closed list none; the keys, typeahead and the button's text follow the data, and each option
+ * carries `aria-posinset` and `aria-setsize`. A long list takes a `virtualWindow` (from
+ * `useVirtualWindow({ itemSize })`): the open list then renders only the options in view, plus an
+ * overscan, with spacers for the others, every option `itemSize` tall; the active option stays
+ * rendered, and opening scrolls it to the middle of the list.
+ *
  * The `<button>` receives `id`, `aria-label`, `aria-labelledby`, `aria-describedby`,
  * `aria-invalid`, `aria-required`, `aria-errormessage`, `aria-details`, `tabIndex`, `autoFocus`
  * and `onFocus`/`onBlur`/`onKeyDown`/`onKeyUp`. `ref`, `className`, `style`, other `aria-*`
@@ -5330,7 +5744,9 @@ export declare const Dropdown: DropdownComponent;
 /**
  * Dropdown: `root` on the outer element; `button` on the `role="combobox"` button; `value` on the
  * value or placeholder span; `expandIcon` on the chevron `<svg>`; `clearButton` on the clear
- * button; `listbox` on the `role="listbox"` list; `surface` on its portaled popup.
+ * button; `listbox` on the `role="listbox"` list; `surface` on its portaled popup; `spacer` on
+ * each spacer element of the list with a `virtualWindow` (the elements that stand in for the
+ * options that are not rendered).
  */
 export declare const dropdownClassNames: {
     readonly root: "wave-dropdown";
@@ -5340,6 +5756,7 @@ export declare const dropdownClassNames: {
     readonly clearButton: "wave-dropdown__clear-button";
     readonly listbox: "wave-dropdown__listbox";
     readonly surface: "wave-dropdown__surface";
+    readonly spacer: "wave-dropdown__spacer";
 };
 
 /** The Dropdown component's type: a multi-select signature, then the single-select one. */
@@ -5517,6 +5934,50 @@ export declare interface DropdownProps<M extends boolean = false> extends Omit<R
      * announcements, for localization. Unset members keep their English defaults.
      */
     labels?: DropdownLabels;
+    /**
+     * Data mode: the options as data, in list order (`value`, `label`, and optionally `textValue`,
+     * `disabled` and `hidden`; values unique). The open list renders one option per item that is
+     * not `hidden` (see `renderOption`); the closed list renders none. The keys, typeahead, the
+     * selection and the button's label text follow `items`, also for a selected item whose option
+     * is not rendered. The children are neither read nor rendered: passing both warns once in
+     * development. Each option gets `aria-posinset` and `aria-setsize` from its place among the
+     * shown items, and keeps one id per value. Without it, the options are the `Option` children.
+     */
+    items?: readonly ListboxItem[];
+    /**
+     * Data mode: renders the option of an item, given its state (`selected`, `active`, and `index`
+     * among the shown options). Return an `Option`, or an option component of your own on
+     * `useListboxOption`, with the item's `value` (and its `disabled`); its position is set for you,
+     * and in a windowed list (`virtualWindow`) its height. It is called again only when the item, its
+     * state, its position (`aria-posinset` and `aria-setsize`, which new `items` change) or the
+     * function itself changes, so pass a stable function in a long list. Ignored without `items`,
+     * with a development warning.
+     * @default an `Option` with the item's `value`, `label` (also its text), `textValue` and `disabled`
+     */
+    renderOption?: (item: ListboxItem, state: ListboxOptionRenderState) => React_2.ReactNode;
+    /**
+     * Data mode: renders only the options in view of a long list, plus an overscan, and spacers
+     * (`aria-hidden`, `data-virtual-spacer`) as tall as the options they stand for: pass the result
+     * of `useVirtualWindow({ itemSize })`, or an object of your own that implements `VirtualWindow`.
+     * It needs `items`: without them, or beside `OptionGroup` children, it is ignored with a
+     * development warning (a window renders a flat list).
+     *
+     * The open popup's list is the window's scroller, so it needs no height of yours: it scrolls
+     * within its own maximum height (15rem, 240 pixels at the default root size, less where the
+     * viewport has no room). Every option is exactly `itemSize` tall (the list sets its height,
+     * after the option's own `style`), so an option's content must fit in it: the default `Option`
+     * with one line of text is 32 pixels tall.
+     *
+     * The window counts the shown options (the items that are not `hidden`). The keys and typeahead
+     * move over all of them (Home and End to the first and the last, PageUp and PageDown by ten); the
+     * active option stays rendered while it is scrolled away, so `aria-activedescendant` always names
+     * an element, and when a key makes it active the list and the window move to it in the same
+     * update. Opening the list scrolls the active option (the selected one, by default) to the
+     * middle of the list, and again once the popup's positioning has given the list its height (a
+     * short viewport) unless it was scrolled first. A closed list renders no option. The browser's
+     * scroll anchoring is off on a windowed list (the window lays the options out).
+     */
+    virtualWindow?: VirtualWindow;
     /** Called when the `<button role="combobox">` receives focus (the root keeps other handlers). */
     onFocus?: React_2.FocusEventHandler<HTMLButtonElement>;
     /** Called when the `<button role="combobox">` loses focus. */
@@ -5912,6 +6373,231 @@ export declare interface FieldProps extends React_2.HTMLAttributes<HTMLDivElemen
  */
 export declare type FirstWeekOfYear = 'first-day' | 'first-full-week' | 'first-four-day-week';
 
+/**
+ * A tree built from flat data (WAI-ARIA Tree View pattern) that can render only the items in
+ * view, for trees of thousands of items. Its model comes from `useFlatTree(items, options)`: items
+ * listed with a `parentValue`, in any order, the expanded and the checked state. The tree renders
+ * the visible items (the roots and the children of every expanded branch) as sibling
+ * `role="treeitem"` elements with `aria-level`, `aria-setsize` and `aria-posinset` from the data,
+ * `aria-expanded` on branches, and the nested `Tree`'s chevron, checkbox and radio.
+ *
+ * ```tsx
+ * const model = useFlatTree(items, { defaultExpandedItems: ['docs'] });
+ * const virtualWindow = useVirtualWindow({ itemSize: 28 });
+ * <FlatTree aria-label="Files" model={model} {...model.getTreeProps()} virtualWindow={virtualWindow} style={{ height: 400 }} />
+ * ```
+ *
+ * Windowing: with `virtualWindow` the tree is the scrolling element (it needs a bounded height),
+ * renders the items in view plus the window's overscan and spacers for the others, and every item
+ * is exactly the window's `itemSize` tall. The server renders the first window. Keys move over the
+ * whole visible list, scrolling an item that is not rendered into view before focusing it, and the
+ * focused item stays rendered (and focused) while it is scrolled away.
+ *
+ * Keyboard: a single tab stop, on the focused item while focus is inside, else on the `selected`
+ * item while it is visible, else on the first enabled item; Tab leaves the tree. Up/Down move
+ * between the visible items, Home/End to the first and last, Right expands a collapsed branch or
+ * moves to its first child, Left collapses an expanded branch or moves to the parent (both
+ * mirrored in right-to-left layouts), Enter activates (and toggles a branch), and so does Space
+ * unless the tree has checkboxes, `*` expands the sibling branches, and typing moves to the next
+ * visible item whose label starts with the typed text (items under a collapsed branch are not
+ * searched). The focused item stays the focused item (rendered, and the tab stop) while focus is
+ * in a popup that its content opened, such as a menu in a portal, so the popup can return focus
+ * to it.
+ *
+ * Selection, as the nested `Tree`: `selected` and `onItemSelect` (single selection and activation,
+ * with radios in `selectionMode="single"`), `current`, and with `selectionMode="multiple"` a
+ * checkbox on every item bound to the model's `checkedItems` (Space or a click on the checkbox
+ * toggles it, and checks cascade). An item whose data is `disabled` is `aria-disabled`, is skipped
+ * by the keys and typeahead, never holds the tab stop (except while a pointer press has focused
+ * it), and is neither activated, expanded nor checked by the user (a check of its parent still
+ * includes it).
+ *
+ * When a branch collapses around the focused item (from code), focus moves to that branch, so it
+ * never falls to the page. Items expand and collapse at once, without motion: there is no child
+ * group to animate. A selected item under a collapsed branch is not the tab stop until it is
+ * visible again.
+ *
+ * `FlatTree.Item` is the row the tree renders for each visible item (it is not written by hand);
+ * it is also exported as `FlatTreeItem` for React Server Components, which cannot use the dotted
+ * form.
+ */
+export declare const FlatTree: {
+    ({ model, virtualWindow, renderItem, selectionMode: selectionModeProp, selected, current, onItemSelect, className, onKeyDown, onFocus, onBlur, onPointerDownCapture, ref, ...rest }: FlatTreeProps): React_2.JSX.Element;
+    displayName: string;
+} & {
+    Item: {
+        ({ item: row, children, className, style, onClick, ref, ...rest }: FlatTreeItemProps): React_2.JSX.Element;
+        displayName: string;
+    };
+};
+
+/**
+ * FlatTree: `root` on the `role="tree"` element (the scrolling element of a tree with a
+ * `virtualWindow`); `spacer` on each spacer element of a windowed tree (the elements that stand in
+ * for the items that are not rendered, 0.16).
+ */
+export declare const flatTreeClassNames: {
+    readonly root: "wave-flat-tree";
+    readonly spacer: "wave-flat-tree__spacer";
+};
+
+/**
+ * One row of a FlatTree, rendered by the tree for each visible item of its model (it is not
+ * written by hand): a `role="treeitem"` element with the item's level, set size and position,
+ * `aria-expanded` on a branch, and the expand chevron, the checkbox (multiple mode) or the radio
+ * (single mode) of the nested `Tree`'s items, before the content. Levels are drawn by indenting
+ * the row, since the items are siblings. In a windowed tree it is exactly the window's `itemSize`
+ * tall.
+ *
+ * `ref`, `className` and the other props land on the treeitem element; its `onClick` receives the
+ * clicks on the row, not those on the checkbox, and runs before the built-in activation (call
+ * `event.preventDefault()` to skip it).
+ */
+export declare const FlatTreeItem: {
+    ({ item: row, children, className, style, onClick, ref, ...rest }: FlatTreeItemProps): React_2.JSX.Element;
+    displayName: string;
+};
+
+/**
+ * FlatTree.Item: `root` on the `role="treeitem"` element; `row` on its row; `expandIcon` on the
+ * chevron of a branch; `indicator` on the checkbox of a multi-select tree or the radio of a
+ * single-select one; `label` on the span around the item's content (0.16).
+ */
+export declare const flatTreeItemClassNames: {
+    readonly root: "wave-flat-tree-item";
+    readonly row: "wave-flat-tree-item__row";
+    readonly expandIcon: "wave-flat-tree-item__expand-icon";
+    readonly indicator: "wave-flat-tree-item__indicator";
+    readonly label: "wave-flat-tree-item__label";
+};
+
+/** One item of a flat tree: `parentValue` places it, items are listed in any order. */
+export declare interface FlatTreeItemData {
+    /** The item's identity; it must be unique among the items (a later duplicate is ignored). */
+    value: string;
+    /** The `value` of the item this one is nested in; absent for a root. */
+    parentValue?: string;
+    /**
+     * `'branch'` marks an item that can expand even while it has no child items (children loaded
+     * on demand). An item with child items is a branch whatever its type says.
+     */
+    itemType?: 'leaf' | 'branch';
+    /** The text the item shows. */
+    label?: string;
+    /**
+     * Whether the item is disabled. `FlatTree` reads it (the keys and typeahead skip the item, it is
+     * not the tab stop, and the user cannot activate, expand or check it); the model ignores it:
+     * `expand`, `collapse`, `toggle` and `setChecked` change a disabled item too, and a check of its
+     * parent includes it.
+     */
+    disabled?: boolean;
+}
+
+/** Properties for the FlatTreeItem sub-component. */
+export declare interface FlatTreeItemProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /** The row the item shows: a visible item of the tree's model (`model.visibleItems`). */
+    item: VisibleFlatItem & {
+        checked?: CheckState;
+    };
+    /** The item's content: what the tree's `renderItem` returns, else the item's label. */
+    children?: React_2.ReactNode;
+    /** Ref to the `role="treeitem"` element. */
+    ref?: React_2.Ref<HTMLDivElement>;
+}
+
+/** The state and the visible rows of a flat tree, from {@link useFlatTree}. */
+export declare interface FlatTreeModel {
+    /**
+     * The rows to show: the roots and the children of every expanded branch, in tree order. With
+     * `selectionMode: 'multiple'` each row has its `checked` state. The array and its rows keep
+     * their identity until the items, the expanded set or the checked set change.
+     */
+    visibleItems: readonly (VisibleFlatItem & {
+        checked?: CheckState;
+    })[];
+    /** The visible row of `value`; `undefined` for an item under a collapsed branch or an unknown value. */
+    getItem(value: string): (VisibleFlatItem & {
+        checked?: CheckState;
+    }) | undefined;
+    /**
+     * Expands `value`, or every value of a list in one change (one `onExpandedItemsChange` call, as
+     * `*` on a tree item makes). Nothing happens, and nothing is called, if every value is already in
+     * the expanded set.
+     */
+    expand(value: string | readonly string[]): void;
+    /** Collapses `value`. Nothing happens, and nothing is called, if it is not in the expanded set. */
+    collapse(value: string): void;
+    /** Expands `value` when it is collapsed and collapses it when it is expanded. */
+    toggle(value: string): void;
+    /** Whether `value` is a branch (an item with child items, or typed `'branch'`) in the expanded set. */
+    isExpanded(value: string): boolean;
+    /**
+     * Sets the check state of `value`, with the cascade of the nested `Tree`: the item and everything
+     * nested in it, then its ancestors from their children. Nothing is called when the item is
+     * already in that state; a mixed item is set to `checked` as requested. A value that matches no
+     * item is added to, or removed from, the checked list. `event` becomes `details.event` of
+     * `onCheckedItemsChange`; without it the callback gets no `details`. It works in any
+     * `selectionMode` (the rows carry `checked` only with `'multiple'`), and on a disabled item too.
+     */
+    setChecked(value: string, checked: boolean, event?: Event): void;
+    /** The props `FlatTree` takes from the model, for `<FlatTree model={model} {...model.getTreeProps()} />`. */
+    getTreeProps(): {
+        selectionMode: 'none' | SelectionMode_2;
+    };
+}
+
+/** Properties for the FlatTree component. */
+export declare interface FlatTreeProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'children' | 'onSelect'> {
+    /** The tree's model, from `useFlatTree`: the visible rows, the expanded and the checked state. */
+    model: FlatTreeModel;
+    /**
+     * Renders only the items in view (and a few beyond), from `useVirtualWindow({ itemSize })`. The
+     * tree is then the scrolling element: give it a bounded height (a class or a style). Every item
+     * is exactly `itemSize` pixels tall, so its content must fit in one row. Without it every visible
+     * item is rendered.
+     *
+     * The tree element is then no tab stop of its own while an item is (`tabIndex` -1, as Firefox
+     * would stop on a scroller; a `tabIndex` you pass wins), and the browser's scroll anchoring is
+     * off on it (the window lays the items out): when rows are inserted or removed above the focused
+     * item while it is in view (`*`, or a change of the model from code), the tree moves the view
+     * with it, so it stays where it was.
+     */
+    virtualWindow?: VirtualWindow;
+    /**
+     * The content of an item, from its row: the item data with its level, position, set size,
+     * expanded state and, in multiple mode, its check state. Called for the rendered items only.
+     * @default the item's `label`, else its `value`
+     */
+    renderItem?: (item: VisibleFlatItem & {
+        checked?: CheckState;
+    }) => React_2.ReactNode;
+    /**
+     * How items are selected, as the nested `Tree`'s `selectionMode`. `'multiple'` draws a checkbox
+     * on every item, bound to the model's checked items (create the model with
+     * `selectionMode: 'multiple'`); `'single'` draws a radio for `selected`. Spread
+     * `model.getTreeProps()` on the tree to pass the model's mode.
+     * @default the model's mode (`model.getTreeProps().selectionMode`)
+     */
+    selectionMode?: 'none' | SelectionMode_2;
+    /**
+     * Value of the selected item. When set (also to `null`), every item carries `aria-selected`, and
+     * the selected item is where keyboard focus enters the tree while it is visible. It has no effect
+     * with `selectionMode="multiple"` (a development warning). With `selectionMode="single"` every
+     * item carries `aria-selected` even while it is not set (a development warning: the radios need
+     * it).
+     */
+    selected?: string | null;
+    /** Value of the current item (for example the open page): it gets `aria-current="true"`. */
+    current?: string | null;
+    /**
+     * Called with an item's value every time it is activated (a click on its row, Enter, or Space
+     * unless the tree has checkboxes), also when the same item is activated again.
+     */
+    onItemSelect?: (value: string) => void;
+    /** Ref to the `role="tree"` element. */
+    ref?: React_2.Ref<HTMLDivElement>;
+}
+
 /**
  * A flexbox layout container with token-based gaps.
  *
@@ -6112,6 +6798,29 @@ export declare interface GridNavigationHandlers {
     onBlur: React_2.FocusEventHandler<HTMLTableElement>;
 }
 
+/**
+ * The data behind the rows of a windowed grid, whose rows are mounted only in part (see
+ * {@link UseGridNavigationOptions.model}). Each mounted data row carries its 0-based index in the
+ * data as `data-row-index`.
+ */
+export declare interface GridNavigationModel {
+    /** How many data rows there are, mounted or not. */
+    rowCount: number;
+    /**
+     * How many header rows are above the data rows: the first rows of the grid without a
+     * `data-row-index` (they stay mounted). Other rows without one, such as the spacer rows of a
+     * window, are not navigated.
+     */
+    headerRowCount: number;
+    /**
+     * Brings data row `index` into the mounted rows (scrolls the window to it). Called once for each
+     * row a key moves focus to that is not mounted; focus moves to the row's cell in the commit that
+     * mounts it. Ctrl+Home in a grid with header rows also calls it for row 0, so the first rows
+     * show under the header.
+     */
+    scrollToRow(index: number): void;
+}
+
 /**
  * The Grid's own props (the XOwnProps rule of `PolymorphicProps`: component-specific props only).
  * Every other prop comes from the rendered element (`as`).
@@ -6410,8 +7119,14 @@ export declare interface ImageSwatchProps extends Omit<React_2.ButtonHTMLAttribu
  *   attribute go to it, the consumer's handlers first. The description and the note render next
  *   to it, never inside it. Its box is 24×24px at every `size` and renders `data-size`. The note
  *   mounts through the presence core: it carries `data-presence`, `data-state` (`open`, and
- *   `closed` while it exits, `inert`) and the `data-wave-infolabel-surface` marker; it ships no
- *   motion of its own.
+ *   `closed` while it exits, `inert`) and the `data-wave-infolabel-surface` marker.
+ * - **Motion.** The note fades in and slides toward the button from the side it opened on, and
+ *   fades out and slides back as it closes (see `motion`); it stays in the document, `inert`,
+ *   until the exit ends, with `info` still inside it (never twice in the document), while the
+ *   dismiss layer, the focus restore and the button's `aria-expanded` follow the open state at
+ *   once. Focus inside a closing note moves to the button in the closing commit. Without motion
+ *   (reduced motion, `motion={null}`, or a provider with `motion="none"`) it unmounts as soon as
+ *   it closes.
  *
  * Fluent's InfoButton takes the same `info` and `size`. It opens on click only
  * (`openOnHover={false}` here), renders its note in place, and moves focus into the note; this one
@@ -6427,7 +7142,7 @@ export declare interface ImageSwatchProps extends Omit<React_2.ButtonHTMLAttribu
  * />
  */
 export declare const InfoButton: {
-    ({ info, size: sizeProp, openOnHover, id: idProp, type, "aria-label": ariaLabelProp, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, className, disabled, onClick, onFocus, onBlur, onKeyDown, onPointerDown, onMouseDown, onPointerEnter, onPointerMove, onPointerLeave, ref, ...rest }: InfoButtonProps): React_2.JSX.Element;
+    ({ info, size: sizeProp, openOnHover, id: idProp, type, "aria-label": ariaLabelProp, motion, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, className, disabled, onClick, onFocus, onBlur, onKeyDown, onPointerDown, onMouseDown, onPointerEnter, onPointerMove, onPointerLeave, ref, ...rest }: InfoButtonProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -6472,6 +7187,17 @@ export declare interface InfoButtonProps extends Omit<React_2.ButtonHTMLAttribut
      * @default 'Information'
      */
     'aria-label'?: string;
+    /**
+     * The note's motion. By default it fades in and slides 4px away from the button, on the side it
+     * opened on, over 200 ms with a decelerating curve, and fades out and slides back over 100 ms
+     * with an accelerating curve; under reduced motion it appears and disappears at once. `null`
+     * turns the motion off (the note still renders its `data-presence` phases, which then end at
+     * once); a class string or `{ className }` replaces the default classes with yours (see
+     * `MotionSlot`), also under a `WaveProvider` with `motion="none"`, which otherwise turns the
+     * default off. Fluent's `Popover` `surfaceMotion` (its InfoButton is a Popover).
+     * @default the fade and slide above
+     */
+    motion?: MotionSlot | null;
     /** Ref to the button. */
     ref?: React_2.Ref<HTMLButtonElement>;
 }
@@ -6489,7 +7215,7 @@ export declare interface InfoButtonProps extends Omit<React_2.ButtonHTMLAttribut
  * - The button is named "‹label text› ‹infoButtonLabel›" through `aria-labelledby`, which points
  *   at the `<label>` and at the button's own id (whose `aria-label` supplies the second half), so
  *   several InfoLabels on a page are told apart; `infoButtonLabel` localizes that second half.
- *   `openOnHover` and `size` reach the button too.
+ *   `openOnHover`, `motion` and `size` reach the button too.
  * - No `controlRef`: InfoLabel is a label, not a form control, so C-ROUTING's composite-control
  *   routing does not apply to it; a layout that needs the button's own element renders `InfoButton`
  *   next to a `Label` instead.
@@ -6498,7 +7224,7 @@ export declare interface InfoButtonProps extends Omit<React_2.ButtonHTMLAttribut
  * <InfoLabel info="Use at least 8 characters.">Password</InfoLabel>
  */
 export declare const InfoLabel: {
-    ({ children, label, info, infoButtonLabel, openOnHover, id, htmlFor, required, size, weight, disabled, className, ref, ...rest }: InfoLabelProps): React_2.JSX.Element;
+    ({ children, label, info, infoButtonLabel, openOnHover, motion, id, htmlFor, required, size, weight, disabled, className, ref, ...rest }: InfoLabelProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -6537,6 +7263,13 @@ export declare interface InfoLabelProps extends Omit<React_2.HTMLAttributes<HTML
      * @default true
      */
     openOnHover?: boolean;
+    /**
+     * The motion of the info button's note, passed through unchanged (see `InfoButton`'s `motion`:
+     * `undefined` is the default fade and slide, `null` none, a value replaces it). Fluent's
+     * `Popover` `surfaceMotion`.
+     * @default the fade and slide of InfoButton's note
+     */
+    motion?: MotionSlot | null;
     /** Ref to the root `<span>`. */
     ref?: React_2.Ref<HTMLSpanElement>;
 }
@@ -7044,19 +7777,31 @@ export declare type LinkVariant = LinkAppearance;
  * - **Check marks** (`checkmark`, opt-in): a decorative check at the start of every item of a
  *   selectable list, shown while the item is selected; `List.Item checkmark` replaces or hides it.
  * - **Switching semantics remounts the items.** Listbox/list and grid use different elements
- *   (`ul`/`li` and `div`), so when a selectable list gains its first item action, loses its last
- *   one, or `selectable` or `navigationMode` changes the structure, React remounts the items and
- *   their content: state inside them (an inline rename input's draft, an uncontrolled checkbox) is
- *   reset. Focus that is on an item or inside it when the list switches moves to the same item (by
- *   `value`, else by position; the next item when the focused one was removed), or to its first
- *   focusable content when the item is no Tab stop any more, so the switch never drops it to
- *   `<body>`. This includes focus inside the last action when that action removes itself (an
- *   inline rename input that unmounts on Enter). An action that removes itself while focused
- *   without causing a switch drops focus, like any removed element. When the list may switch,
- *   keep such state in the parent, or pin the grid with `navigationMode="composite"`.
+ *   (`ul`/`li` and `div`), so when a selectable list without a window gains its first item
+ *   action, loses its last one, or `selectable` or `navigationMode` changes the structure, React
+ *   remounts the items and their content: state inside them (an inline rename input's draft, an
+ *   uncontrolled checkbox) is reset. Focus that is on an item or inside it when the list switches
+ *   moves to the same item (by `value`, else by position; the next item when the focused one was
+ *   removed), or to its first focusable content when the item is no Tab stop any more, so the
+ *   switch never drops it to `<body>`. This includes focus inside the last action when that action
+ *   removes itself (an inline rename input that unmounts on Enter). An action that removes itself
+ *   while focused without causing a switch drops focus, like any removed element. When the list
+ *   may switch, keep such state in the parent, or pin the grid with `navigationMode="composite"`.
  * - Selection: `selectionMode` `'single'` (default) or `'multiple'`; controlled with
  *   `selectedItems` (or `selectedItem` in single mode) or uncontrolled with the `default*` props.
- *   Values of items that are no longer rendered are dropped from the reported selection.
+ *   Values of items that are no longer rendered are dropped from the reported selection (a
+ *   windowed list keeps them).
+ * - **Windowing** (`virtualWindow` and `count`, for long lists): a window from `useVirtualWindow`
+ *   and a function child that returns the item at an index render only the items in view plus an
+ *   overscan, with spacers for the others. The list element scrolls (give it a bounded height),
+ *   every item has the window's item size as its height, the focused item stays rendered and is
+ *   the Tab stop while focus is in the list, each item carries its place in the whole list, and
+ *   the values selected outside the window stay selected. The keys move by index over the whole
+ *   list (ArrowUp/ArrowDown, Home/End, and PageUp/PageDown by ten), scrolling the target into view
+ *   before focusing it, rendered or not; typeahead matches the rendered items. Its structure
+ *   never follows the rendered items: a selectable windowed list is a listbox unless
+ *   `navigationMode="composite"` pins the grid (pin it when items have actions; a development
+ *   warning says so).
  * - Sub-component: `List.Item` (also exported as `ListItem` for React Server Components).
  *
  * @example
@@ -7070,13 +7815,25 @@ export declare type LinkVariant = LinkAppearance;
  *   <List.Item value="report" onAction={() => open('report')}>Report</List.Item>
  *   <List.Item value="budget" onAction={() => open('budget')}>Budget</List.Item>
  * </List>
+ *
+ * @example
+ * const virtualWindow = useVirtualWindow({ itemSize: 40 });
+ * <List
+ *   selectable
+ *   aria-label="Files"
+ *   virtualWindow={virtualWindow}
+ *   count={files.length}
+ *   style={{ height: 320 }}
+ * >
+ *   {(index) => <List.Item value={files[index].id}>{files[index].name}</List.Item>}
+ * </List>
  */
 export declare const List: {
     <M extends ListSelectionMode = "single">(props: ListProps<M>): React_2.ReactNode;
     displayName: string;
 } & {
     Item: {
-        ({ value, action, onAction, disabledSelection, checkmark, className, children, onClick, onKeyDown, ref, ...rest }: ListItemProps): React_2.JSX.Element;
+        ({ value, action, onAction, disabledSelection, checkmark, className, style, children, onClick, onKeyDown, ref, ...rest }: ListItemProps): React_2.JSX.Element;
         displayName: string;
     };
 };
@@ -7113,6 +7870,12 @@ export declare const List: {
  *   either), dims it, takes pointer input off its options, selects nothing and submits nothing.
  *   Disabled options are skipped by the keys unless `disabledOptionsFocusable`, and are never
  *   selected.
+ * - **Data mode.** `items` passes the options as data instead of children: the list renders an
+ *   option per item (`renderOption` draws it, an `Option` with the item's label by default), the
+ *   keys, typeahead and the selection follow the data, and each option carries `aria-posinset`
+ *   and `aria-setsize`. A long list takes a `virtualWindow` (from `useVirtualWindow({ itemSize
+ *   })`): the list then renders only the options in view, plus an overscan, with spacers for the
+ *   others, every option `itemSize` tall, and the active option stays rendered.
  * - **Forms and Field.** With `name` the value is submitted with its form (one entry, or one per
  *   value with `multiselect`), and `required` needs a value (native validation; a missing value
  *   moves focus to the list). A reset of its form restores `defaultValue`, with or without a
@@ -7131,12 +7894,21 @@ export declare const List: {
  *   <Listbox.Option value="apple">Apple</Listbox.Option>
  *   <Listbox.Option value="banana">Banana</Listbox.Option>
  * </Listbox>
+ *
+ * @example
+ * // Data mode
+ * <Listbox aria-label="City" items={cities.map((c) => ({ value: c.id, label: c.name }))} />
  */
 export declare const Listbox: ListboxComponent;
 
-/** Listbox: `root` on the `role="listbox"` list (its options carry Option's classes). */
+/**
+ * Listbox: `root` on the `role="listbox"` list (its options carry Option's classes); `spacer` on
+ * each spacer element of a list with a `virtualWindow` (the elements that stand in for the options
+ * that are not rendered).
+ */
 export declare const listboxClassNames: {
     readonly root: "wave-listbox";
+    readonly spacer: "wave-listbox__spacer";
 };
 
 /** Props for the combobox element (spread them; see {@link UseListboxResult.getComboboxProps}). */
@@ -7296,6 +8068,20 @@ export declare interface ListboxOptionElementProps<E extends HTMLElement = HTMLE
     'aria-disabled'?: true;
     /** While filtered out or hidden. */
     hidden?: boolean;
+    /**
+     * The number of shown options, for an option of a data-mode list rendered by Listbox, Combobox
+     * or Dropdown (`items`), which tell each option its position. Absent otherwise.
+     */
+    'aria-setsize'?: number;
+    /** The option's position among the shown options (from 1), with `aria-setsize`. */
+    'aria-posinset'?: number;
+    /**
+     * The option's box in a windowed list (a `virtualWindow` of Listbox, Combobox or Dropdown): the
+     * window's `itemSize` as its height, padding and border included, and no shrinking in a flex
+     * list. Absent otherwise. Merge it after a style of your own: every option of a window must be
+     * exactly that tall.
+     */
+    style?: React_2.CSSProperties;
     /** While the option is active, for styling. */
     'data-active'?: '';
     /** While selected, for styling. */
@@ -7315,6 +8101,25 @@ export declare interface ListboxOptionElementProps<E extends HTMLElement = HTMLE
 /** Flat name of `Listbox.OptionGroup` for React Server Components. */
 export declare const ListboxOptionGroup: React_2.FC<OptionGroupProps>;
 
+/**
+ * The state of an item's option, which `renderOption` of Listbox, Combobox and Dropdown receives
+ * with the item (data mode, `items`).
+ */
+export declare interface ListboxOptionRenderState {
+    /** The item's value is selected. */
+    selected: boolean;
+    /**
+     * The option is the active one, which `aria-activedescendant` points at: in a Listbox while the
+     * list has focus, in a Combobox or Dropdown while the list is open.
+     */
+    active: boolean;
+    /**
+     * The option's index among the shown options, from 0 (its `aria-posinset` minus one): items a
+     * filter leaves out and hidden items are not counted.
+     */
+    index: number;
+}
+
 /** Properties for the Listbox component. */
 export declare interface ListboxProps<M extends boolean = false> extends Omit<React_2.HTMLAttributes<HTMLUListElement>, 'onChange' | 'defaultValue'> {
     /**
@@ -7375,6 +8180,49 @@ export declare interface ListboxProps<M extends boolean = false> extends Omit<Re
     disabledOptionsFocusable?: boolean;
     /** The `multiselect` toggle announcements, for localization. Unset members keep their English defaults. */
     labels?: ListboxLabels;
+    /**
+     * Data mode: the options as data, in list order (`value`, `label`, and optionally `textValue`,
+     * `disabled` and `hidden`; values unique). The list renders one option per item that is not
+     * `hidden` (see `renderOption`), and the keys, typeahead and the selection follow `items`. The
+     * children are neither read nor rendered: passing both warns once in development. Each option
+     * gets `aria-posinset` and `aria-setsize` from its place among the shown items, and keeps one id
+     * per value. Without it, the options are the `Option` children.
+     */
+    items?: readonly ListboxItem[];
+    /**
+     * Data mode: renders the option of an item, given its state (`selected`, `active`, and `index`
+     * among the shown options). Return an `Option`, or an option component of your own on
+     * `useListboxOption`, with the item's `value` (and its `disabled`); its position is set for you,
+     * and in a windowed list (`virtualWindow`) its height. It is called again only when the item, its
+     * state, its position (`aria-posinset` and `aria-setsize`, which new `items` change) or the
+     * function itself changes, so pass a stable function in a long list. Ignored without `items`,
+     * with a development warning.
+     * @default an `Option` with the item's `value`, `label` (also its text), `textValue` and `disabled`
+     */
+    renderOption?: (item: ListboxItem, state: ListboxOptionRenderState) => React_2.ReactNode;
+    /**
+     * Data mode: renders only the options in view of a long list, plus an overscan, and spacers
+     * (`aria-hidden`, `data-virtual-spacer`) as tall as the options they stand for: pass the result
+     * of `useVirtualWindow({ itemSize })`, or an object of your own that implements `VirtualWindow`.
+     * It needs `items`: without them, or beside `OptionGroup` children, it is ignored with a
+     * development warning (a window renders a flat list).
+     *
+     * The list element is the window's scroller: give it a bounded height (a height or a maximum
+     * height, through `className` or `style`); without one the window measures the whole list and
+     * renders every option. While windowed the list has no block padding (add none through
+     * `className`), so the options start at its top, where the window counts them, and no scroll
+     * anchoring of the browser (the window lays the options out). Every option is exactly
+     * `itemSize` tall (the list sets its height, after the option's own `style`), so an option's
+     * content must fit in it: the default `Option` with one line of text is 32 pixels tall.
+     *
+     * The window counts the shown options (the items that are not `hidden`). The keys and typeahead
+     * move over all of them (Home and End to the first and the last, PageUp and PageDown by ten); the
+     * active option stays rendered while it is scrolled away, so `aria-activedescendant` always names
+     * an element, and when the list gains focus or a key makes it active the list and the window
+     * move to it in the same update (a pointer press moves neither). The server renders the first
+     * window.
+     */
+    virtualWindow?: VirtualWindow;
     /**
      * Name of the value in form submissions (renders a hidden input inside the list; one per value
      * with `multiselect`).
@@ -7567,9 +8415,14 @@ export declare interface ListboxSurfaceProps {
     children?: React_2.ReactNode;
 }
 
-/** List: `root` on the `<ul>` (the `role="grid"` element of a selectable list with actions). */
+/**
+ * List: `root` on the `<ul>` (the `role="grid"` element of a selectable list with actions);
+ * `spacer` on each spacer element of a list with a `virtualWindow` (the elements that stand in for
+ * the items that are not rendered).
+ */
 export declare const listClassNames: {
     readonly root: "wave-list";
+    readonly spacer: "wave-list__spacer";
 };
 
 /**
@@ -7579,11 +8432,15 @@ export declare const listClassNames: {
  * selection without calling `onClick`, which receives pointer clicks; `onAction` runs on clicks
  * and Enter (and Space where the item cannot be selected), before the selection toggles.
  *
+ * In a windowed list (the List's `virtualWindow`) an item has the window's item size as its
+ * height, after its own `style` (its content must fit), and carries `data-index` and its place
+ * in the whole list: `aria-setsize` and `aria-posinset`, or `aria-rowindex` in a grid.
+ *
  * Exported under the flat name `ListItem` so React Server Components can import it; `List.Item`
  * (dotted access) needs a client module.
  */
 export declare const ListItem: {
-    ({ value, action, onAction, disabledSelection, checkmark, className, children, onClick, onKeyDown, ref, ...rest }: ListItemProps): React_2.JSX.Element;
+    ({ value, action, onAction, disabledSelection, checkmark, className, style, children, onClick, onKeyDown, ref, ...rest }: ListItemProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -7667,7 +8524,72 @@ export declare type ListNavigationMode = 'none' | 'items' | 'composite';
  * `selectionMode="multiple"` is passed; `ListProps` without a type argument accepts every mode
  * (the 0.4 shape, extendable by interfaces).
  */
-export declare interface ListProps<M extends ListSelectionMode = ListSelectionMode> extends React_2.HTMLAttributes<HTMLUListElement> {
+export declare interface ListProps<M extends ListSelectionMode = ListSelectionMode> extends Omit<React_2.HTMLAttributes<HTMLUListElement>, 'children'> {
+    /**
+     * The items: `List.Item` elements. In a windowed list (`virtualWindow` and `count`), a function
+     * `(index) => <List.Item … />` that returns the item at an index: the list calls it for the
+     * rendered indexes only and keys each item by its index. Without `virtualWindow` and `count` a
+     * function renders nothing (a development warning says so).
+     */
+    children?: React_2.ReactNode | ((index: number) => React_2.ReactNode);
+    /**
+     * Renders only the items in view, plus an overscan, of a long list: pass the result of
+     * `useVirtualWindow({ itemSize })` (or an object of your own that implements `VirtualWindow`)
+     * with `count`, and a function child that returns the `List.Item` at an index. The items that
+     * are not rendered are replaced by spacers (`aria-hidden`, `data-virtual-spacer`) of their
+     * height.
+     *
+     * The list element becomes the window's scroller (it scrolls vertically, without the browser's
+     * scroll anchoring): give it a bounded height, a height or a maximum height (a class or a style);
+     * without one the window measures the whole list and renders every item. Where the list
+     * navigates its items, one item is its Tab stop and the list element is none of its own
+     * (`tabIndex` -1, as Firefox would stop on a scroller); a plain windowed list keeps the browser's
+     * default, under which WebKit does not let the keyboard reach and scroll it: pass `tabIndex={0}`
+     * or navigate its items (`navigationMode="items"`). A `tabIndex` you pass wins.
+     *
+     * Every item has the window's `itemSize` as its height (the list sets it, after the item's own
+     * `style`), so an item's content must fit in it. Each item carries `data-index` (its 0-based
+     * index) and its place in the whole list: `aria-setsize` and `aria-posinset`, or in a grid
+     * (`navigationMode="composite"`) the list's `aria-rowcount` and the row's `aria-rowindex`.
+     *
+     * The item that has focus stays rendered when it is scrolled away (also while focus is in a
+     * popup it opened), so it keeps focus, and while focus is in the list it is the list's Tab stop.
+     * Once focus leaves the list it is no longer kept, and the Tab stop follows the rule of a list
+     * without focus among the rendered items (the first selected item, else the first item; in a
+     * list without selection the item that last had focus while it is rendered). When `count` drops
+     * to or below the focused item, focus moves to the last item.
+     *
+     * The keys move by index over the whole list, rendered or not, where the list navigates its
+     * items (`navigationMode` `'items'` or `'composite'`, or a selectable list): ArrowUp/ArrowDown
+     * (wrapping at the ends), Home/End, and PageUp/PageDown, which move ten items and stop at the
+     * ends. The target is scrolled into view before it is focused, the least that shows it whole: a
+     * rendered one by the browser (`scrollIntoView`, nearest), which the window follows, one that is
+     * not rendered through the window's `scrollToIndex`, and focused once it renders. An item that a
+     * pointer press focuses is not scrolled. Typeahead matches the labels of the rendered items
+     * only.
+     *
+     * Selection covers every value: the values of items that are not rendered stay selected, and
+     * `onSelectionChange` reports them (a list without a window drops the values of items it no
+     * longer renders).
+     *
+     * The structure never depends on which items are rendered: a selectable windowed list stays a
+     * listbox (its items are options) unless `navigationMode="composite"` makes it a grid from the
+     * first render, so scrolling never replaces the list element (which would reset its scroll
+     * position and remount every item). Its items' actions do not switch it to a grid as they do in
+     * a list without a window: an item with an action in a selectable windowed list without that
+     * pin is a development warning, since an option cannot hold interactive content. Pin
+     * `navigationMode="composite"` when items have actions.
+     *
+     * Applies only with `count` and a function child; otherwise it is ignored, with a development
+     * warning.
+     */
+    virtualWindow?: VirtualWindow;
+    /**
+     * The number of items of a windowed list (with `virtualWindow`): the function child is called
+     * for the indexes from 0 to `count - 1` that are rendered. A value that is not a whole number
+     * counts as its whole part, and one below 0 (or not finite) as 0.
+     */
+    count?: number;
     /** Whether list items can be selected.
      * @default false
      */
@@ -7714,7 +8636,10 @@ export declare interface ListProps<M extends ListSelectionMode = ListSelectionMo
      *   the Tab order. The rows of a list without selection carry no `aria-selected`.
      *
      * The resolved mode is rendered as `data-navigation-mode`. Changing it while mounted can switch
-     * between `ul`/`li` and `div` elements, which remounts the items (see {@link List}).
+     * between `ul`/`li` and `div` elements, which remounts the items (see {@link List}). A windowed
+     * list (`virtualWindow`) never switches for its items' actions: unset or `'items'`, a selectable
+     * one is a listbox; only `'composite'` makes it a grid. In a windowed list the keys move by
+     * index over the whole list, PageUp/PageDown included (see `virtualWindow`).
      */
     navigationMode?: ListNavigationMode;
     /**
@@ -7826,7 +8751,7 @@ export declare const Menu: {
         displayName: string;
     };
     Popover: {
-        ({ side, align, offset, target: targetProp, positioning, children, className, style, onKeyDown, onKeyDownCapture, onFocus, onPointerEnter, onPointerLeave, onPointerMove, onContextMenu, ref, ...rest }: MenuPopoverProps): JSX.Element | null;
+        ({ side, align, offset, target: targetProp, positioning, motion, children, className, style, onKeyDown, onKeyDownCapture, onFocus, onPointerEnter, onPointerLeave, onPointerMove, onContextMenu, ref, ...rest }: MenuPopoverProps): JSX.Element | null;
         displayName: string;
     };
     ItemCheckbox: {
@@ -8288,16 +9213,23 @@ export declare interface MenuItemSwitchProps extends MenuItemProps, MenuItemSele
  * the element focused at the gesture; it is not labelled by its region, so give it `aria-label`
  * (development warning otherwise), as for a menu placed at a `target` without `Menu.Trigger`.
  *
- * The surface mounts through the presence core (`usePresence`): it carries
- * `data-presence="entering" | "entered" | "exiting"` and, while it closes, `data-state="closed"`
- * and `inert`, so exit motion classes on `data-presence` keep it on screen until they end. Focus,
- * the dismiss layer and positioning follow the open state, not the exit. Without motion it unmounts
- * as soon as it closes.
+ * It moves in and out: the surface fades in and slides 4px away from its trigger over 200 ms, and
+ * fades out and slides back over 100 ms, on the side it opened on (`data-side`), so a submenu
+ * slides out of its parent menu; a menu open by default animates in when it mounts in the
+ * browser. Under reduced motion it appears and disappears at once. `motion` turns the motion off
+ * (`null`) or replaces its classes, and a `WaveProvider` with `motion="none"` turns the default
+ * off; a `className` with `data-[presence=…]` classes and no `motion` keeps 0.14's behaviour (your
+ * classes, no default motion). The surface mounts through the presence core (`usePresence`): it
+ * carries `data-presence="entering" | "entered" | "exiting"` and, while it closes,
+ * `data-state="closed"` and `inert`, so it stays on screen, where it was, until its exit motion
+ * ends. Focus, the dismiss layer and positioning follow the open state, not the exit: focus
+ * inside a closing menu leaves it in the commit that closes it. Without motion it unmounts as
+ * soon as it closes.
  *
  * Also exported as `MenuPopover` (import the flat name from React Server Components).
  */
 export declare const MenuPopover: {
-    ({ side, align, offset, target: targetProp, positioning, children, className, style, onKeyDown, onKeyDownCapture, onFocus, onPointerEnter, onPointerLeave, onPointerMove, onContextMenu, ref, ...rest }: MenuPopoverProps): React_2.JSX.Element | null;
+    ({ side, align, offset, target: targetProp, positioning, motion, children, className, style, onKeyDown, onKeyDownCapture, onFocus, onPointerEnter, onPointerLeave, onPointerMove, onContextMenu, ref, ...rest }: MenuPopoverProps): React_2.JSX.Element | null;
     displayName: string;
 };
 
@@ -8335,6 +9267,19 @@ export declare interface MenuPopoverProps extends Omit<React_2.HTMLAttributes<HT
      * @default `{ fitViewport: true }`
      */
     positioning?: PopupPositioning;
+    /**
+     * The menu's motion. By default it fades in and slides 4px away from its trigger, on the side
+     * it opened on (a submenu away from its parent menu), over 200 ms with a decelerating curve, and
+     * fades out and slides back over 100 ms with an accelerating curve; under reduced motion it
+     * appears and disappears at once. `null` turns the motion off (the surface still renders its
+     * `data-presence` phases, which then end at once); a class string or `{ className }` replaces
+     * the default classes with yours (see `MotionSlot`), also under a `WaveProvider` with
+     * `motion="none"`, which otherwise turns the default off. A `className` that holds
+     * `data-[presence=…]` classes while `motion` is unset keeps 0.14's behaviour: no default motion,
+     * your classes animate the surface. Fluent's `Menu` `surfaceMotion`.
+     * @default the fade and slide above
+     */
+    motion?: MotionSlot | null;
     /** Menu items and dividers. */
     children: React_2.ReactNode;
     /**
@@ -8687,6 +9632,85 @@ export declare const messageBarClassNames: {
     readonly dismissIcon: "wave-message-bar__dismiss-icon";
 };
 
+/**
+ * A stack of MessageBars that animates the bars it gains and loses, Fluent's MessageBarGroup with
+ * its `animate` prop: a bar removed from the children fades out while its row closes, so the bars
+ * below glide up instead of jumping (Fluent's bar only fades, and the bars below jump when it is
+ * gone), and with `animate="both"` a bar added after mount opens its row and fades in.
+ *
+ * - **Keys.** Give every bar a stable `key` (`key={message.id}`): the group follows its children
+ *   by key, so it can keep a removed bar on screen during its exit, in its place, and move bars
+ *   that are reordered without replacing them. A removed bar that comes back during its exit is
+ *   shown again. A child without a key of its own, or text, renders after the bars as given,
+ *   without motion, with a development warning. Any keyed element animates; MessageBar is the
+ *   one the group is made for.
+ * - **Motion.** Bars present at the group's first render (on the server too) never animate. Each
+ *   bar sits in an element of its own, which renders no box while the bar is shown, so the bars
+ *   are the stack's own items; while a bar enters or exits, that element clips it while its row
+ *   opens or closes. An exiting bar is `inert`. See `motion` for the default and how to replace
+ *   or turn it off; under `prefers-reduced-motion: reduce` a bar is added and removed at once.
+ * - **Focus.** When a bar leaves with focus inside it (its Dismiss button was pressed), focus moves
+ *   in the same commit to the first tabbable element of the nearest bar after it that stays and
+ *   holds a tabbable element, else of the nearest such bar before it. When no such bar is left,
+ *   the app decides where focus goes.
+ * - **Markup.** A plain `<div>` without a role stacking the bars with an 8px gap; each MessageBar
+ *   stays its own live region. MessageBarGroup is a component of its own rather than a part of
+ *   MessageBar, so a page that imports only MessageBar does not load the group's motion.
+ *
+ * @example
+ * <MessageBarGroup animate="both">
+ *   {messages.map((message) => (
+ *     <MessageBar key={message.id} status={message.status} onDismiss={() => dismiss(message.id)}>
+ *       {message.text}
+ *     </MessageBar>
+ *   ))}
+ * </MessageBarGroup>
+ */
+export declare const MessageBarGroup: {
+    ({ animate, motion, children, className, ref, ...rest }: MessageBarGroupProps): React_2.JSX.Element;
+    displayName: string;
+};
+
+/**
+ * MessageBarGroup: `root` on the element that stacks the bars; `item` on the element around each
+ * bar (the element its enter and exit run on).
+ */
+export declare const messageBarGroupClassNames: {
+    readonly root: "wave-message-bar-group";
+    readonly item: "wave-message-bar-group__item";
+};
+
+/** Properties for the MessageBarGroup component. */
+export declare interface MessageBarGroupProps extends React_2.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Which changes animate: `'exit-only'` (a bar removed from the children fades and collapses
+     * out) or `'both'` (a bar added after mount also fades and slides in). Bars present at the
+     * group's first render never animate. Fluent's `animate`. The root renders it as
+     * `data-animate`.
+     * @default 'exit-only'
+     */
+    animate?: 'exit-only' | 'both';
+    /**
+     * Replaces the bars' motion (both directions); `null` turns it off. The motion is on the element
+     * around each bar (`className` stays on the root). By default a removed bar fades out while its
+     * row and its bottom margin close over 250 ms with the linear curve, so the bars after it glide
+     * up and nothing jumps when it unmounts (the margin makes up for the group's 8px gap, so a
+     * different gap in `className` needs a `motion` whose margin matches it); with
+     * `animate="both"`, a bar added after mount opens its row and fades in the same way. Under
+     * reduced motion bars appear and disappear at once. `null` turns the motion off (the element
+     * still renders its `data-presence` phases, which then end at once); a class string or
+     * `{ className }` replaces the default classes with yours (see `MotionSlot`), also under a
+     * `WaveProvider` with `motion="none"`, which otherwise turns the default off. A WaveUI addition:
+     * Fluent's MessageBarGroup has no motion slot (its bar only fades out).
+     * @default the collapse and fade above
+     */
+    motion?: MotionSlot | null;
+    /** MessageBar elements, each with a stable `key`. */
+    children?: React_2.ReactNode;
+    /** Ref to the root `<div>`. */
+    ref?: React_2.Ref<HTMLDivElement>;
+}
+
 /** Properties for the MessageBar component. */
 export declare interface MessageBarProps extends React_2.HTMLAttributes<HTMLDivElement> {
     /** Status level controlling the color, icon, status text and role of the message bar.
@@ -8829,6 +9853,26 @@ export declare type ModalOpenChangeReason = 'trigger' | 'close' | 'close-button'
  */
 export declare type ModalType = 'modal' | 'alert' | 'non-modal';
 
+/** Motion below a `WaveProvider`: `'default'`, or `'none'` (every motion slot acts as `null`). */
+export declare type MotionPreference = 'default' | 'none';
+
+/**
+ * Replaces a part's default motion (its `motion`, `backdropMotion`, `expandIconMotion` or
+ * `indeterminateMotion` prop): a class string, or `{ className }`. `null` on the prop turns the
+ * motion off and `undefined` keeps the default. On a part with presence phases (a surface, a
+ * backdrop, a collapsing part, a toast, a bar of a MessageBarGroup), write the phases as the
+ * default motion does: the enter's start with the starting variant gated on the entering phase
+ * (`data-[presence=entering]:starting:…`), the exit with `data-[presence=exiting]:…`, and a
+ * reduced-motion counterpart. The other parts (a Nav category's expand icon, ProgressBar's
+ * indeterminate fill, TabList's selection line) have no phases: give them plain transition or
+ * animation classes with a reduced-motion counterpart. The classes must exist in your CSS: the
+ * precompiled stylesheet holds only Wave's own classes, so without Tailwind pass a class of your
+ * own CSS (written against `[data-presence]` for a part with phases).
+ */
+export declare type MotionSlot = string | {
+    className: string;
+};
+
 /**
  * A vertical side navigation (`<nav>` landmark, default name "Navigation") with items, links and
  * collapsible categories.
@@ -8854,9 +9898,14 @@ export declare type ModalType = 'modal' | 'alert' | 'non-modal';
  *   `href` or a button; it is never selected. `Nav.AppItemStatic` shows them as plain text.
  * - **Item actions**: `actions` on `Nav.Item` and `Nav.SubItem` (Fluent's SplitNavItem) puts your
  *   own controls beside the item, in a group named by it; each is a Tab stop after the item, and
- *   none selects it. They are drawn while the row is hovered or has focus, while one is pressed or
- *   has its menu open, and always on touch screens and in forced colours. With actions, a selected
- *   item's background and indicator are drawn on its row (`.wave-nav-item__list-item`).
+ *   none selects it. They fade in while the row is hovered or has focus, while one is pressed or
+ *   has its menu open, and are always drawn on touch screens and in forced colours. With actions, a
+ *   selected item's background and indicator are drawn on its row (`.wave-nav-item__list-item`).
+ * - **Motion**: a category's list opens and closes its space with a short collapse and fade
+ *   (`motion` on `Nav.Category`), its chevron's turn is animated (`expandIconMotion`) and item
+ *   actions fade in. None of these defaults runs under reduced motion, and a `WaveProvider` with
+ *   `motion="none"` turns them off, while a category's own `motion` or `expandIconMotion` value
+ *   still applies. Focus inside a list that closes moves to its category's toggle button.
  *
  * Sub-components are also exported under flat names (`NavCategory`, `NavItem`, `NavSubItem`,
  * `NavSectionHeader`, `NavDivider`, `NavAppItem`, `NavAppItemStatic`): React Server Components
@@ -8867,7 +9916,7 @@ export declare const Nav: {
     displayName: string;
 } & {
     Category: {
-        ({ value, label, icon, className, children, ref, ...rest }: NavCategoryProps): React_2.JSX.Element;
+        ({ value, label, icon, expandIcon, expandIconMotion, motion, className, children, ref, ...rest }: NavCategoryProps): React_2.JSX.Element;
         displayName: string;
     };
     Item: typeof NavItem;
@@ -9007,8 +10056,19 @@ export declare interface NavAppItemStaticProps extends React_2.HTMLAttributes<HT
 
 /**
  * A collapsible group of sub-items. Its toggle button shows `label` and reports `aria-expanded`
- * (and `aria-controls` while open); the sub-items render in a nested list while it is open.
- * Open state lives on `Nav` (`openCategories`/`defaultOpenCategories`).
+ * (and `aria-controls` while open); the sub-items render in a nested list while it is open and
+ * while the list collapses after a close. Open state lives on `Nav`
+ * (`openCategories`/`defaultOpenCategories`).
+ *
+ * The list renders as the only child of a collapse element (its stable class
+ * `wave-nav-category__collapse`), which opens and closes the list's space (`motion`) and has no
+ * box of its own while the category is open, so the list lays out in the category as before. A
+ * category open by default appears without motion. After a close the list stays in the document
+ * until the collapse ends, `inert` (its items leave the Tab order and an arrow-key body's arrow
+ * keys at once), while the toggle button already reports the category closed, without
+ * `aria-controls`; opening the category again during the collapse keeps the same list. Focus
+ * inside the list when the category closes moves to the toggle button. The expand chevron turns
+ * while the category is open (`expandIcon` replaces it, `expandIconMotion` animates its turn).
  *
  * A closed category that contains the current item marks its toggle button with
  * `aria-current="true"` (the button is not the page's link, so not `"page"`),
@@ -9021,14 +10081,15 @@ export declare interface NavAppItemStaticProps extends React_2.HTMLAttributes<HT
  * Also exported as `NavCategory` (import the flat name from React Server Components).
  */
 export declare const NavCategory: {
-    ({ value, label, icon, className, children, ref, ...rest }: NavCategoryProps): React_2.JSX.Element;
+    ({ value, label, icon, expandIcon, expandIconMotion, motion, className, children, ref, ...rest }: NavCategoryProps): React_2.JSX.Element;
     displayName: string;
 };
 
 /**
  * Nav.Category: `root` on its `<li>`; `button` on the toggle button; `icon` on the icon span;
- * `label` on the label span; `expandIcon` on the chevron `<svg>`; `list` on the `<ul>` of its
- * sub-items.
+ * `label` on the label span; `expandIcon` on the chevron `<svg>` (or on the span of your
+ * `expandIcon`); `list` on the `<ul>` of its sub-items; `collapse` on the element around that
+ * list (the element that opens and closes the list's space, 0.15).
  */
 export declare const navCategoryClassNames: {
     readonly root: "wave-nav-category";
@@ -9037,6 +10098,7 @@ export declare const navCategoryClassNames: {
     readonly label: "wave-nav-category__label";
     readonly expandIcon: "wave-nav-category__expand-icon";
     readonly list: "wave-nav-category__list";
+    readonly collapse: "wave-nav-category__collapse";
 };
 
 /** Properties for the NavCategory sub-component. */
@@ -9056,9 +10118,42 @@ export declare interface NavCategoryProps extends React_2.HTMLAttributes<HTMLLIE
      * (`''`, `0`) or a list of nothing renders no icon box.
      */
     icon?: Slot<'span'>;
+    /**
+     * Replaces the expand chevron at the end of the toggle button (decorative, `aria-hidden`).
+     * `null`/`undefined` keep the chevron, which turns while the category is open; `false`, or
+     * anything that renders nothing, hides it (`aria-expanded` still reports the state). Your glyph
+     * renders as given in a span with the expand icon's class and is not turned, so a glyph that
+     * shows the state itself works (a plus or a minus, picked from your `openCategories`). It is
+     * rendered inside the toggle button: a `<button>` or `Button` passed here (or a slot object
+     * whose `as` is one) is not nested (its children become the glyph and its props are dropped,
+     * with a development warning).
+     */
+    expandIcon?: Slot<'span'>;
+    /**
+     * Replaces the motion of the expand icon (Fluent's `NavCategoryItem expandIconMotion`): by
+     * default the chevron's half turn as the category opens and closes is animated over the fast
+     * duration (150 ms) with the easy-ease curve, both ways, and so is any transform of the span
+     * around your own `expandIcon`. The turn itself is not motion: `null` turns the animation off
+     * and the chevron still turns, at once; a class string or `{ className }` replaces it with
+     * plain transition classes and a reduced-motion counterpart (the icon has no presence phases).
+     * A `WaveProvider` with `motion="none"` turns the default off, and a value here still applies
+     * under it.
+     * @default the animated turn described above
+     */
+    expandIconMotion?: MotionSlot | null;
+    /**
+     * Replaces the collapse of the category's list (Fluent's `NavSubItemGroup collapseMotion`), on
+     * the element around its `<ul>`: by default the space the list takes opens from nothing and
+     * closes back to it, with a fade, over the normal duration (200 ms) with the max easy-ease
+     * curve, both ways. `null` turns it off (the list appears and disappears at once); a class
+     * string or `{ className }` replaces it, written as `MotionSlot` describes. A `WaveProvider`
+     * with `motion="none"` turns the default off, and a value here still applies under it.
+     * @default the collapse described above
+     */
+    motion?: MotionSlot | null;
     /**
      * The category's sub-items (`Nav.SubItem`), and `Nav.SectionHeader` and `Nav.Divider`, rendered
-     * in its list while it is open.
+     * in its list while it is open (and while the list collapses after a close).
      */
     children?: React_2.ReactNode;
     /** Ref to the category's `<li>` element. */
@@ -9113,6 +10208,16 @@ export declare interface NavDividerProps extends Omit<React_2.HTMLAttributes<HTM
  *   when an item is chosen is yours, in `onItemSelect`, which also fires when the current page is
  *   activated again. A non-modal overlay (`modalType="non-modal"`) covers the page, which keeps
  *   its Tab order: keep the page's controls clear of it, or use `type="inline"`.
+ * - **Motion:** an overlay slides in from its edge and fades in, and slides back and fades out,
+ *   over 250 ms (`small`, the default), 300 ms (`medium`), 400 ms (`large`) or 500 ms (`full`),
+ *   with its backdrop fading along; one open by default animates in when it mounts in the browser.
+ *   An inline drawer opens and closes the space it takes in the layout over the same durations,
+ *   in an element of its own around the panel (`wave-nav-drawer__collapse`, which has no box
+ *   while open); one open by default does not animate in, and one at `full` has no motion. Under
+ *   reduced motion every drawer appears and disappears at once. `motion` and `backdropMotion`
+ *   turn each off (`null`) or replace it, and `WaveProvider motion="none"` turns both defaults
+ *   off. While it exits the panel stays on screen, `inert`, and focus, the trap and the scroll
+ *   lock are already released.
  * - **Focus:** pass your page's Hamburger as `finalFocusRef`, so focus returns to it when a
  *   Hamburger inside the drawer closes it. An overlay moves focus in when it opens; an inline
  *   drawer does not.
@@ -9155,7 +10260,7 @@ export declare interface NavDividerProps extends Omit<React_2.HTMLAttributes<HTM
  * </NavDrawer>
  */
 export declare const NavDrawer: {
-    ({ type, open: openProp, defaultOpen, onOpenChange, onItemSelect, position, size, separator, modalType: modalTypeProp, unmountOnClose, finalFocusRef, backdrop, value, defaultValue, onValueChange, openCategories, defaultOpenCategories, onOpenCategoriesChange, currentCategory, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, id, children, ref, ...rest }: NavDrawerProps): React_2.JSX.Element;
+    ({ type, open: openProp, defaultOpen, onOpenChange, onItemSelect, position, size, separator, modalType: modalTypeProp, unmountOnClose, finalFocusRef, backdrop, motion, backdropMotion, value, defaultValue, onValueChange, openCategories, defaultOpenCategories, onOpenCategoriesChange, currentCategory, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, id, children, ref, ...rest }: NavDrawerProps): React_2.JSX.Element;
     displayName: string;
 } & {
     Header: {
@@ -9210,13 +10315,15 @@ export declare interface NavDrawerBodyProps extends React_2.HTMLAttributes<HTMLD
 
 /**
  * NavDrawer (a Drawer variant: it also carries Drawer's root, and its backdrop Drawer's backdrop
- * class): `root` on the panel (the portaled `role="dialog"` element of an overlay drawer, the
- * panel element of an inline one); `backdrop` on the backdrop of a modal overlay; `nav` on the
- * navigation landmark that fills the panel.
+ * class, and its collapse element Drawer's collapse class): `root` on the panel (the portaled
+ * `role="dialog"` element of an overlay drawer, the panel element of an inline one); `backdrop` on
+ * the backdrop of a modal overlay; `collapse` on the element around an inline drawer's panel;
+ * `nav` on the navigation landmark that fills the panel.
  */
 export declare const navDrawerClassNames: {
     readonly root: "wave-nav-drawer";
     readonly backdrop: "wave-nav-drawer__backdrop";
+    readonly collapse: "wave-nav-drawer__collapse";
     readonly nav: "wave-nav-drawer__nav";
 };
 
@@ -9316,7 +10423,10 @@ export declare interface NavDrawerProps extends Omit<React_2.HTMLAttributes<HTML
      * The panel's width at a side (its height at the bottom), on Drawer's scale: `small` 320px,
      * `medium` 592px, `large` 940px, `full` the viewport (inline: the container). A width class in
      * `className` replaces it (Fluent's navigation pane is 260px wide: the width class of 65
-     * spacing steps). Rendered as `data-size`. Drawer's default too.
+     * spacing steps). It also times the motion, an overlay's slide and an inline drawer's collapse
+     * alike: 250 ms small, 300 ms medium, 400 ms large, 500 ms full (an inline drawer at `full` has
+     * no motion; see `motion`), so a drawer without `size` takes 250 ms whatever width a class gives
+     * it. Rendered as `data-size`. Drawer's default too.
      * @default 'small'
      */
     size?: DrawerSize;
@@ -9340,11 +10450,11 @@ export declare interface NavDrawerProps extends Omit<React_2.HTMLAttributes<HTML
      */
     modalType?: Extract<ModalType, 'modal' | 'non-modal'>;
     /**
-     * Removes the panel when the drawer closes. `false` keeps it mounted while closed, out of view
-     * and `inert`, so the state of what is inside survives, and a Hamburger outside can point
-     * `aria-controls` at it at all times: always for an inline drawer, and once the page has
-     * hydrated for an overlay (whose panel is not in the server HTML). Fluent's `unmountOnClose`.
-     * Drawer's default too.
+     * Removes the panel when the drawer closes, once its exit motion has ended. `false` keeps it
+     * mounted while closed, out of view and `inert`, so the state of what is inside survives, and a
+     * Hamburger outside can point `aria-controls` at it at all times: always for an inline drawer,
+     * and once the page has hydrated for an overlay (whose panel is not in the server HTML).
+     * Fluent's `unmountOnClose`. Drawer's default too.
      * @default true
      */
     unmountOnClose?: boolean;
@@ -9362,6 +10472,43 @@ export declare interface NavDrawerProps extends Omit<React_2.HTMLAttributes<HTML
     backdrop?: Slot<'div'> | (SlotObject<'div'> & {
         appearance?: BackdropAppearance;
     });
+    /**
+     * The drawer's motion, as Drawer's. By default an overlay panel slides in from beyond its edge
+     * and fades in with a decelerating curve, and slides back out and fades out with an accelerating
+     * curve; the `start` and `end` edges follow the text direction, `left` and `right` do not
+     * mirror, and a `bottom` panel rises from below. An inline drawer by default opens the space it
+     * takes in your layout from nothing (its width at a side, its height at the bottom) while its
+     * panel fades in, held at its size against its inner edge, so it reads as sliding out from that
+     * edge, with a decelerating curve; closing runs the same backwards with an accelerating curve.
+     * Both take a duration that follows `size` both ways: 250 ms small (also without `size`), 300 ms
+     * medium, 400 ms large, 500 ms full. An inline drawer at `full` has no motion, as its size is
+     * its container's (a value here does not apply to it either), and an inline drawer whose width
+     * (height at the bottom) in `className` is a percentage resizes oddly during the motion,
+     * correctly once open: give it a length, or pass `null`. Under reduced motion the drawer appears
+     * and disappears at once. `null` turns the motion off (the drawer still renders its
+     * `data-presence` phases, which then end at once); a class string or `{ className }` replaces
+     * the default classes with yours (see `MotionSlot`), also under a `WaveProvider` with
+     * `motion="none"`, which otherwise turns the default off. They go on the overlay panel, or on
+     * the element around an inline drawer's panel (`wave-nav-drawer__collapse`), whose phases the
+     * drawer waits for. A `className` that holds `data-[presence=…]` classes while `motion` is unset
+     * keeps 0.14's behaviour: no default motion, your classes animate the panel, and the drawer
+     * waits for the panel's motion (inline too, not the element around it). Fluent's
+     * `OverlayDrawer` and `InlineDrawer` `surfaceMotion`.
+     * @default the slide (overlay) or the collapse (inline) above
+     */
+    motion?: MotionSlot | null;
+    /**
+     * The backdrop's motion (a modal overlay), as Drawer's. By default it fades in and out with a
+     * linear curve over the panel's duration (250 to 500 ms, by `size`), so it ends with the panel;
+     * under reduced motion it appears and disappears at once. `null` turns the motion off; a class
+     * string or `{ className }` replaces the default classes with yours (see `MotionSlot`), also
+     * under a `WaveProvider` with `motion="none"`, which otherwise turns the default off. The
+     * panel's motion decides when the drawer unmounts or hides: a replacement longer than the
+     * panel's exit is cut off there. Ignored, with a development warning, by a non-modal or inline
+     * drawer. Fluent's `OverlayDrawer` `backdropMotion`.
+     * @default the fade above
+     */
+    backdropMotion?: MotionSlot | null;
     /**
      * Name of the navigation landmark (and of an overlay's dialog). Localize it; rename it when the
      * page has another navigation landmark (two with one name are ambiguous). An `aria-labelledby`
@@ -9491,11 +10638,14 @@ export declare interface NavItemOwnProps {
      * never inside it, in a group named by the item; each is a Tab stop after the item, and a click
      * or key on one never selects the item. They are drawn while the row is hovered or has focus,
      * while one of them is pressed or has its popup open, and always in forced colours and on touch
-     * screens; otherwise they are transparent and still focusable. They stay enabled when the item
-     * is `disabled`. With actions, the selected background and indicator are drawn on the row (the
-     * item's list item, `.wave-nav-item__list-item`), so a `className` on the item no longer covers
-     * them. Content that renders nothing renders no group. Fluent's `actionButton`, `toggleButton`
-     * and `menuButton` slots and their tooltips are your own controls here.
+     * screens; otherwise they are transparent and still focusable. They fade in and out over 150 ms
+     * (at once under reduced motion or a `WaveProvider` with `motion="none"`); the fade sets the
+     * transition of each direct child of the group, so a transition of your own on one is replaced.
+     * They stay enabled when the item is `disabled`. With actions, the selected background and
+     * indicator are drawn on the row (the item's list item, `.wave-nav-item__list-item`), so a
+     * `className` on the item no longer covers them. Content that renders nothing renders no group.
+     * Fluent's `actionButton`, `toggleButton` and `menuButton` slots and their tooltips are your own
+     * controls here.
      */
     actions?: React_2.ReactNode;
 }
@@ -9705,7 +10855,9 @@ export declare interface OpenChangeDetails<R extends string = string> {
  *
  * Options register with the surrounding listbox (in DOM order, groups included), so they can be
  * wrapped, grouped or rendered conditionally. The option is memoized: moving the highlight
- * re-renders only the previously and the newly active option.
+ * re-renders only the previously and the newly active option. In a windowed list (the
+ * `virtualWindow` of Listbox, Combobox or Dropdown) the option is exactly the window's `itemSize`
+ * tall, a height set after its own `style`, so its content must fit in it.
  *
  * Styling: `className` comes last. A plain background class (`className="bg-primary"`) replaces
  * the built-in hover, selected and active backgrounds in every state. To restyle one state only,
@@ -10448,6 +11600,8 @@ export declare type PolymorphicProps<C extends React_2.ElementType, OwnProps> =
  *   moving into the content). Name the content with `title` or `aria-label`.
  * - **Custom anchors:** `target` places it at another element or at a `VirtualElement` (a point, a
  *   text selection); with a controlled `open` it needs no trigger.
+ * - **Motion:** the content fades and slides in from its trigger and back out as it closes;
+ *   `Popover.Content`'s `motion` turns it off or replaces it.
  *
  * @example
  * <Popover>
@@ -10464,7 +11618,7 @@ export declare const Popover: {
         displayName: string;
     };
     Content: {
-        ({ children, title, id: idProp, className, style, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, onKeyDown, onContextMenu, onPointerEnter, onPointerLeave, ref, ...rest }: PopoverContentProps): React_2.JSX.Element | null;
+        ({ children, title, id: idProp, className, style, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, onKeyDown, onContextMenu, onPointerEnter, onPointerLeave, motion, ref, ...rest }: PopoverContentProps): React_2.JSX.Element | null;
         displayName: string;
     };
 };
@@ -10497,11 +11651,25 @@ export declare const Popover: {
  * `target` it is placed at the target and, without a trigger, follows a target element in the
  * keyboard order.
  *
+ * It moves in and out: the surface fades in and slides 4px away from its trigger over 200 ms, and
+ * fades out and slides back over 100 ms, on the side it opened on (`data-side`); a popover open by
+ * default animates in when it mounts in the browser. Under reduced motion it appears and
+ * disappears at once. `motion` turns the motion off (`null`) or replaces its classes, and a
+ * `WaveProvider` with `motion="none"` turns the default off. The surface mounts through the
+ * presence core (`usePresence`): it carries `data-presence="entering" | "entered" | "exiting"` and
+ * `data-state="open"`, and while it closes `data-state="closed"` and `inert`, so it stays on
+ * screen, where it was, until its exit motion ends. Focus, the dismiss layer, the trigger's
+ * `aria-expanded` and `aria-controls`, and positioning follow the open state, not the exit: focus
+ * inside a closing popover moves, in the commit that closes it, to where the popover returns
+ * focus (so a Dialog opened by a button of the popover as it closes returns focus there too, not
+ * to that button), and a hover close moves no focus. Without motion it unmounts as soon as it
+ * closes.
+ *
  * Also exported as `PopoverContent` for React Server Components, which cannot use the dotted
  * `Popover.Content` (that needs a client file).
  */
 export declare const PopoverContent: {
-    ({ children, title, id: idProp, className, style, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, onKeyDown, onContextMenu, onPointerEnter, onPointerLeave, ref, ...rest }: PopoverContentProps): React_2.JSX.Element | null;
+    ({ children, title, id: idProp, className, style, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, onKeyDown, onContextMenu, onPointerEnter, onPointerLeave, motion, ref, ...rest }: PopoverContentProps): React_2.JSX.Element | null;
     displayName: string;
 };
 
@@ -10527,6 +11695,17 @@ export declare interface PopoverContentProps extends Omit<React_2.HTMLAttributes
     title?: React_2.ReactNode;
     /** Id of the surface; the trigger's `aria-controls` follows it. Defaults to a generated id. */
     id?: string;
+    /**
+     * The popover's motion. By default it fades in and slides 4px away from its trigger, on the
+     * side it opened on, over 200 ms with a decelerating curve, and fades out and slides back over
+     * 100 ms with an accelerating curve; under reduced motion it appears and disappears at once.
+     * `null` turns the motion off (the surface still renders its `data-presence` phases, which then
+     * end at once); a class string or `{ className }` replaces the default classes with yours (see
+     * `MotionSlot`), also under a `WaveProvider` with `motion="none"`, which otherwise turns the
+     * default off. Fluent's `Popover` `surfaceMotion`.
+     * @default the fade and slide above
+     */
+    motion?: MotionSlot | null;
     /** Ref to the popover surface. */
     ref?: React_2.Ref<HTMLDivElement>;
 }
@@ -10961,7 +12140,8 @@ export declare type PresenceStatus = 'available' | 'busy' | 'away' | 'offline' |
  *   a Field's wrapper element, the bar gets an id of its own and leaves the Field's
  *   `<label htmlFor>` to that control.
  * - The indeterminate animation follows the writing direction and becomes a full-width pulse for
- *   reduced motion. In forced-colors mode the fill uses `Highlight` and the track gets a border.
+ *   reduced motion; `indeterminateMotion` replaces or removes it. In forced-colors mode the fill
+ *   uses `Highlight` and the track gets a border.
  *
  * @example
  * <ProgressBar value={uploaded} max={total} label="Uploading photos" showLabel />
@@ -10972,7 +12152,7 @@ export declare type PresenceStatus = 'available' | 'busy' | 'away' | 'offline' |
  * </Field>
  */
 export declare const ProgressBar: {
-    ({ value, max, label, showLabel, color, id, "aria-describedby": ariaDescribedBy, "aria-invalid": _ariaInvalid, "aria-required": _ariaRequired, className, ref, ...rest }: ProgressBarProps): React_2.JSX.Element;
+    ({ value, max, label, showLabel, color, indeterminateMotion, id, "aria-describedby": ariaDescribedBy, "aria-invalid": _ariaInvalid, "aria-required": _ariaRequired, className, ref, ...rest }: ProgressBarProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -11026,6 +12206,19 @@ export declare interface ProgressBarProps extends React_2.HTMLAttributes<HTMLDiv
      * @default 'brand'
      */
     color?: ProgressBarColor;
+    /**
+     * Replaces the motion of the indeterminate fill (no `value`): by default a fill two fifths of
+     * the track wide sweeps across it, mirrored in right-to-left, and becomes a full-width pulse
+     * for reduced motion. The classes go on the fill and replace the whole default, its width and
+     * its reduced-motion counterparts included. `null` draws a static full-width fill; a class
+     * string or `{ className }` replaces the classes with plain animation classes (and a width) and
+     * their reduced-motion counterparts (the fill has no presence phases). A
+     * `WaveProvider` with `motion="none"` turns the default off (a static full-width fill), and a
+     * value here still applies under it. A determinate bar has no motion and ignores it. Fluent's
+     * ProgressBar `indeterminateMotion` takes a motion slot the same way.
+     * @default the sweep described above
+     */
+    indeterminateMotion?: MotionSlot | null;
     ref?: React_2.Ref<HTMLDivElement>;
 }
 
@@ -12987,11 +14180,12 @@ export declare type SwitchSize = Extract<Size, 'small' | 'medium'>;
  * `Table.CellActions` shows a cell's actions while its row is hovered or holds focus.
  *
  * Sub-components are available as `Table.Header`, `Table.HeaderCell`, `Table.Body`, `Table.Row`,
- * `Table.Cell`, `Table.SelectionCell`, `Table.CellLayout` and `Table.CellActions` in client
+ * `Table.Cell`, `Table.SelectionCell`, `Table.CellLayout`, `Table.CellActions` and
+ * `Table.ResizeHandle` (the separator that resizes a column, for a header cell's `aside`) in client
  * components, and as the flat exports `TableHeader`, `TableHeaderCell`, `TableBody`, `TableRow`,
- * `TableCell`, `TableSelectionCell`, `TableCellLayout` and `TableCellActions` (the form React
- * Server Components can import). `Table.Head`/`Table.HeadCell` (`TableHead`/`TableHeadCell`) are
- * deprecated aliases.
+ * `TableCell`, `TableSelectionCell`, `TableCellLayout`, `TableCellActions` and
+ * `TableResizeHandle` (the form React Server Components can import). `Table.Head`/`Table.HeadCell`
+ * (`TableHead`/`TableHeadCell`) are deprecated aliases.
  */
 export declare const Table: {
     ({ striped, containerProps, children, className, ref, ...props }: TableProps): React_2.JSX.Element;
@@ -13039,6 +14233,10 @@ export declare const Table: {
         ({ visible, className, ref, ...rest }: TableCellActionsProps): React_2.JSX.Element;
         displayName: string;
     };
+    ResizeHandle: {
+        ({ width, minWidth, maxWidth, onResize, onReset, onLeave, label, valueText, onPointerDown, onPointerMove, onPointerUp, onPointerCancel, onLostPointerCapture, onDoubleClick, onKeyDown, onKeyUp, onBlur, className, ref, ...rest }: TableResizeHandleProps): React_2.JSX.Element;
+        displayName: string;
+    };
 };
 
 /** The table's `<tbody>`. */
@@ -13168,6 +14366,86 @@ export declare const tableClassNames: {
     readonly container: "wave-table__container";
 };
 
+/**
+ * The column widths of {@link useTableFeatures} (`state.columnSizing`), filled by
+ * `useTableColumnSizing`. Without that plugin no width is set and the functions do nothing.
+ */
+export declare interface TableColumnSizingState {
+    /**
+     * The width of every column in pixels, by `columnId`: the width that is state, else the
+     * column's initial width.
+     */
+    columnWidths: Readonly<Record<string, number>>;
+    /** Whether a width is state (set, controlled or given as a default). */
+    isSized: boolean;
+    /** The width of the column `columnId` in pixels, or `undefined` when it is no column. */
+    getColumnWidth(columnId: string): number | undefined;
+    /**
+     * Sets the width of the column `columnId` in pixels. Without `event`, the change's details carry
+     * an untrusted `resize` event with no target.
+     */
+    setColumnWidth(columnId: string, width: number, event?: Event): void;
+    /** Props for the table element: its fixed layout and width style. */
+    getTableProps(): {
+        style: CSSProperties;
+    };
+    /** Props for the column's `<col>` element: its width style. */
+    getColumnProps(columnId: string): {
+        style: CSSProperties;
+    };
+    /** Props for the resize handle of the column `columnId`. */
+    getResizeHandleProps(columnId: string): TableResizeHandleBindings;
+}
+
+/** What {@link UseTableColumnSizingOptions.onColumnWidthsChange} gets besides the new widths. */
+export declare interface TableColumnWidthsChangeDetails {
+    /** The column that was resized. */
+    columnId: string;
+    /** Its new width in pixels, held at or above its `minWidth`. */
+    width: number;
+    /**
+     * The event behind the change (the drag, the key press); when none was passed, an untrusted
+     * `resize` event with no target.
+     */
+    event: Event;
+}
+
+/**
+ * A feature of {@link useTableFeatures}, returned by `useTableSort`, `useTableSelection` and
+ * `useTableColumnSizing`, which hold the feature's state where they are called. The object is
+ * opaque. It keeps its identity while the feature's state and the options it reads keep theirs; a
+ * new one costs `useTableFeatures` a recompute of its state, and of the rows only when the sort
+ * changed. `T` is the item type the plugin reads (a selection's `isDisabled`): a plugin that reads
+ * no item, such as the sort, fits every table.
+ */
+export declare interface TableFeaturePlugin<T> {
+    /** The brand of a plugin: only the plugin hooks create one. */
+    readonly [tableFeaturePluginBrand]: (item: T) => void;
+}
+
+declare const tableFeaturePluginBrand: unique symbol;
+
+/** The state that {@link useTableFeatures} returns. */
+export declare interface TableFeaturesState<T> {
+    /** The items, as given. */
+    items: readonly T[];
+    /** The columns, as given. */
+    columns: readonly DataGridColumn<T>[];
+    /** The row id of an item: `getRowId` as given, else the index as a string. */
+    getRowId: (item: T, index: number) => string;
+    /**
+     * The rows in display order: sorted while `useTableSort` sorts them, else in the order of
+     * `items`. The same array is returned until `items`, `getRowId`, `columns` or the sort change.
+     */
+    getRows(): readonly TableRowData<T>[];
+    /** The sort; without `useTableSort` it is `null` and its functions do nothing. */
+    sort: TableSortState;
+    /** The selection; without `useTableSelection` nothing is selected and its functions do nothing. */
+    selection: TableSelectionState;
+    /** The column widths; without `useTableColumnSizing` no width is set. */
+    columnSizing: TableColumnSizingState;
+}
+
 /** @deprecated Use `Table.Header` (`TableHeader`). */
 export declare const TableHead: {
     (props: TableHeadProps): React_2.JSX.Element;
@@ -13286,6 +14564,110 @@ export declare interface TableProps extends React_2.HTMLAttributes<HTMLTableElem
     ref?: React_2.Ref<HTMLTableElement>;
 }
 
+/**
+ * The drag handle of a column's edge: a vertical `role="separator"` with `aria-valuenow`, meant
+ * for the `aside` slot of a `Table.HeaderCell` whose cell is positioned, since the handle is drawn
+ * along the cell's end edge. A DataGrid with `resizableColumns` renders it in the header cell of
+ * each of its columns itself (a `DataGrid.HeaderCell` has no `aside` slot). A pointer drag (mouse,
+ * touch or pen) resizes through `onResize`, with the movement mirrored in right-to-left tables;
+ * the arrow keys move the edge by 20 pixels (5 with Shift), Home sets the minimum width and End
+ * the maximum one. A double click calls `onReset`. The handle is a Tab stop (`tabIndex` 0), so the
+ * keys work in a static table; a grid that manages its own tab stops overrides `tabIndex`. The
+ * handle carries `data-grid-auxiliary`, so a grid's cell navigation does not take it for the
+ * cell's own widget.
+ *
+ * It keeps no width: spread the result of `useTableColumnSizing`'s `getResizeHandleProps(columnId)`
+ * onto it, or pass `width`, `minWidth` and `onResize` from your own state.
+ */
+export declare const TableResizeHandle: {
+    ({ width, minWidth, maxWidth, onResize, onReset, onLeave, label, valueText, onPointerDown, onPointerMove, onPointerUp, onPointerCancel, onLostPointerCapture, onDoubleClick, onKeyDown, onKeyUp, onBlur, className, ref, ...rest }: TableResizeHandleProps): React_2.JSX.Element;
+    displayName: string;
+};
+
+/**
+ * What a resize handle needs from the table state, as returned by
+ * `columnSizing.getResizeHandleProps(columnId)`: the column's width and minimum, the callback
+ * that sets a new width and the one that resets it. `Table.ResizeHandle` takes these props (and a few more).
+ */
+export declare interface TableResizeHandleBindings {
+    /** The column's current width in pixels. */
+    width: number;
+    /** The narrowest the column can be, in pixels. */
+    minWidth: number;
+    /**
+     * Sets the column's width in pixels (held at or above `minWidth`); `details.event` is the event
+     * behind it (without `details`, an untrusted `resize` event is reported).
+     */
+    onResize(width: number, details?: {
+        event: Event;
+    }): void;
+    /**
+     * Sets the column back to its initial width (a double click on the handle). It changes nothing
+     * while no width is state, since the table is then in its initial layout.
+     */
+    onReset?(details: {
+        event: Event;
+    }): void;
+}
+
+/**
+ * Table.ResizeHandle: `root` on the separator element that resizes a column (placed in the `aside`
+ * of a header cell).
+ */
+export declare const tableResizeHandleClassNames: {
+    readonly root: "wave-table-resize-handle";
+};
+
+/** Properties for the TableResizeHandle sub-component. */
+export declare interface TableResizeHandleProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'onResize' | 'onReset'> {
+    /** The column's current width in pixels. It is reported as `aria-valuenow`. */
+    width: number;
+    /**
+     * The narrowest the column can be, in pixels. The handle never asks for less, and Home sets it.
+     * It is reported as `aria-valuemin`.
+     * @default 0
+     */
+    minWidth?: number;
+    /**
+     * The widest the column can be, in pixels. The handle never asks for more, and End sets it.
+     * Without a maximum there is no `aria-valuemax` and End does nothing.
+     */
+    maxWidth?: number;
+    /**
+     * Called with the width the user asks for, in whole pixels, held between `minWidth` and
+     * `maxWidth`: while a pointer drags (at most once per animation frame) and for every handled
+     * key, then `details` with the event behind it. The handle always passes `details`; it is typed
+     * optional through 0.x, as every `details` argument. The handle keeps no width of its own, so a
+     * parent that ignores the call leaves the column where it is.
+     */
+    onResize: (width: number, details?: {
+        event: Event;
+    }) => void;
+    /** Called with the event when the handle is double-clicked: reset the column's width. */
+    onReset?: (details: {
+        event: Event;
+    }) => void;
+    /**
+     * Called when Escape is pressed on the handle, or Enter or Space is released on it after being
+     * pressed there: move focus back to the header cell. Enter and Space are consumed from their
+     * keydown on (their repeats included), so a held key never reaches the element that focus moves
+     * to. Without it those keys are left to the handle's ancestors.
+     */
+    onLeave?: () => void;
+    /**
+     * The accessible name of the separator.
+     * @default 'Resize column'
+     */
+    label?: string;
+    /**
+     * Builds `aria-valuetext` from the width.
+     * @default (width) => `${width} pixels`
+     */
+    valueText?: (width: number) => string;
+    /** Ref to the `<div>` element. */
+    ref?: React_2.Ref<HTMLDivElement>;
+}
+
 /**
  * A table row. Striping comes from the table (`striped`), so rows need no context. The row is the
  * `group/table-row` group whose hover or focus draws the subtle selection controls and the cell
@@ -13301,6 +14683,16 @@ export declare const tableRowClassNames: {
     readonly root: "wave-table-row";
 };
 
+/** One row of {@link useTableFeatures}: an item of `items` with its id. */
+export declare interface TableRowData<T> {
+    /** The item. */
+    item: T;
+    /** The row's id, from `getRowId` (by default the index in `items`, as a string). */
+    rowId: string;
+    /** The item's index in `items`. Sorting moves the row, not this index. */
+    index: number;
+}
+
 /** Properties for the TableRow sub-component. */
 export declare interface TableRowProps extends React_2.HTMLAttributes<HTMLTableRowElement> {
     /** Table cell elements. */
@@ -13414,6 +14806,59 @@ export declare interface TableSelectionCellProps extends Omit<React_2.TdHTMLAttr
     ref?: React_2.Ref<HTMLTableCellElement>;
 }
 
+/**
+ * The selection of {@link useTableFeatures} (`state.selection`), filled by `useTableSelection`. The
+ * selection is a set of row ids held apart from the rendered rows: rows that are not rendered keep
+ * their state, and ids whose item is not in `items` (filtered out, on another page) stay selected.
+ */
+export declare interface TableSelectionState {
+    /** `single` keeps at most one row selected; `multiple` selects rows independently. */
+    selectionMode: SelectionMode_2;
+    /** The selected row ids, ids whose item is not in `items` included. */
+    selectedItems: ReadonlySet<string>;
+    /**
+     * Whether every selectable row of `items` is selected (and there is one): rows that
+     * `isDisabled` marks do not count, rows that are not rendered do.
+     */
+    allRowsSelected: boolean;
+    /**
+     * Whether a row of `items` is selected while not every selectable one is (the mixed state of a
+     * select-all checkbox). A selected disabled row counts; ids outside `items` do not.
+     */
+    someRowsSelected: boolean;
+    /** Whether the row `id` is selected. */
+    isRowSelected(id: string): boolean;
+    /** Selects or deselects the row `id` (`multiple`); selects it (`single`). */
+    toggleRow(id: string, event?: Event): void;
+    /** Selects the row `id`; in `single` mode it replaces the selection. */
+    selectRow(id: string, event?: Event): void;
+    /** Deselects the row `id`. */
+    deselectRow(id: string, event?: Event): void;
+    /**
+     * Selects every selectable row of `items` when not all of them are selected, else deselects
+     * them. A disabled row keeps its state, and ids outside `items` stay selected. It does nothing in
+     * `single` mode.
+     */
+    toggleAllRows(event?: Event): void;
+    /** Empties the selection, ids outside `items` included. */
+    clearRows(event?: Event): void;
+}
+
+/** The sort of {@link useTableFeatures} (`state.sort`), filled by `useTableSort`. */
+export declare interface TableSortState {
+    /** The sorted column and its direction, or `null` while the rows are in the order of `items`. */
+    value: DataGridSort | null;
+    /** Sorts by the column `columnId` in `direction`. */
+    setColumnSort(columnId: string, direction: SortDirection, event?: Event): void;
+    /**
+     * Sorts by the column `columnId`, as a sortable header of DataGrid does: ascending, or descending
+     * when the column is already sorted ascending.
+     */
+    toggleColumnSort(columnId: string, event?: Event): void;
+    /** The direction of the column `columnId` while the rows are sorted by it, else `undefined`. */
+    getSortDirection(columnId: string): SortDirection | undefined;
+}
+
 /**
  * A set of tabs with their panels (WAI-ARIA Tabs pattern): the arrow keys (Left/Right, mirrored
  * in RTL; Up/Down when vertical), Home and End move focus and select (automatic activation); with
@@ -13430,15 +14875,20 @@ export declare interface TableSelectionCellProps extends Omit<React_2.TdHTMLAttr
  * a Panel that ends up inside the tablist). Content that is not a tab, such as a button next to
  * the tabs, does not belong in a tablist either: render it outside the TabList.
  *
+ * In the `transparent` appearance the selected tab draws its line with its after pseudo-element,
+ * over a transparent 2px border on its bottom edge (its start edge when vertical), so the tab keeps
+ * the box it has without the line; a class that recolours the line targets that pseudo-element's
+ * border. When the selection moves, the line slides from the tab selected before (`motion`).
+ *
  * Sub-components are also exported under flat names (`TabListTab`, `TabListPanel`,
  * `TabListPanels`) for React Server Components, which cannot use the dotted form.
  */
 export declare const TabList: {
-    ({ value: valueProp, defaultValue: defaultValueProp, onValueChange, orientation: orientationProp, appearance, size, selectTabOnFocus, selectedValue, defaultSelectedValue, onTabSelect, vertical, className, children, onKeyDown, onFocus, ref, ...rest }: TabListProps): React_2.JSX.Element;
+    ({ value: valueProp, defaultValue: defaultValueProp, onValueChange, orientation: orientationProp, appearance, size, selectTabOnFocus, motion, selectedValue, defaultSelectedValue, onTabSelect, vertical, className, children, onKeyDown, onFocus, ref, ...rest }: TabListProps): React_2.JSX.Element;
     displayName: string;
 } & {
     Tab: {
-        ({ value, id: idProp, icon, className, children, onClick, ref, ...rest }: TabProps): React_2.JSX.Element;
+        ({ value, id: idProp, icon, className, style, children, onClick, ref, ...rest }: TabProps): React_2.JSX.Element;
         displayName: string;
     };
     Panel: {
@@ -13537,6 +14987,22 @@ export declare interface TabListProps extends Omit<React_2.HTMLAttributes<HTMLDi
      * @default true
      */
     selectTabOnFocus?: boolean;
+    /**
+     * Replaces the slide of the selected tab's line in the `transparent` appearance (the other
+     * appearances have no line and do not move): by default, when the selection moves, the line
+     * slides and stretches from the tab selected before to the new one, over the slow duration
+     * (300 ms) with the max decelerating curve. The classes go on the selected tab and time its
+     * line, the tab's after pseudo-element (write them with the after variant, and a reduced-motion
+     * counterpart); the line starts from the previous tab through two custom properties the
+     * TabList writes for one frame. `null` turns the slide off (the line moves at once); a class
+     * string or `{ className }` replaces the classes with plain transition classes for the line, as
+     * above (it has no presence phases). A
+     * `WaveProvider` with `motion="none"` turns the default off, and a value here still applies
+     * under it. The line also moves at once while the user prefers reduced motion. Fluent's
+     * TabList slides its indicator with no prop to turn it off: this prop is a WaveUI addition.
+     * @default the slide described above
+     */
+    motion?: MotionSlot | null;
     /** @deprecated Use `value`. */
     selectedValue?: string;
     /** @deprecated Use `defaultValue`. */
@@ -13560,7 +15026,7 @@ export declare interface TabListProps extends Omit<React_2.HTMLAttributes<HTMLDi
  * with its value is mounted.
  */
 export declare const TabListTab: {
-    ({ value, id: idProp, icon, className, children, onClick, ref, ...rest }: TabProps): React_2.JSX.Element;
+    ({ value, id: idProp, icon, className, style, children, onClick, ref, ...rest }: TabProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -14638,6 +16104,19 @@ export declare type TagSize = Extract<Size, 'extra-small' | 'small' | 'medium'>;
  *   With no control at or before the target, the popover is reached where it is portaled, at the
  *   end of the page: Tab from the page's last control and Shift+Tab from outside the page enter
  *   it.
+ * - **Motion.** The surface fades in over 200 ms and out over 100 ms as it closes; pointed at a
+ *   target (or the Trigger) it also slides 4px away from it on the side it opened on
+ *   (`data-side`), and back. Under reduced motion it appears and disappears at once. `motion` (on
+ *   TeachingPopover for the surface it renders, or on `TeachingPopover.Surface`) turns it off
+ *   (`null`) or replaces its classes, and a `WaveProvider` with `motion="none"` turns the default
+ *   off. The surface mounts through the presence core: it carries `data-presence` and
+ *   `data-state="open"`, and while it closes `data-state="closed"` and `inert`, so it stays on
+ *   screen, where it was and on the step it closed on, until its exit ends. Escape, focus and the
+ *   Trigger's `aria-expanded` follow the open state, not the exit: focus inside a closing popover
+ *   moves, in the commit that closes it, to where it returns focus. A popover open by default
+ *   animates in when it mounts in the browser, and one opened again during its exit enters again
+ *   on the same surface (on its first step, as every opening). Without motion it unmounts as soon
+ *   as it closes.
  * - **Parts** (Fluent's composition): `TeachingPopover.Trigger` opens and closes the popover, gets
  *   focus back when it closes and, without a `target`, is what it points at; written directly
  *   inside TeachingPopover (a Fragment is fine), it makes the popover start closed (`defaultOpen`
@@ -14695,7 +16174,7 @@ export declare type TagSize = Extract<Size, 'extra-small' | 'small' | 'medium'>;
  * </TeachingPopover>
  */
 export declare const TeachingPopover: {
-    ({ steps, activeStep: activeStepProp, defaultActiveStep, currentStep, defaultCurrentStep, onStepChange, onDismiss, onFinish, primaryAction: primaryActionProp, secondaryAction: secondaryActionProp, footerLayout, open: openProp, defaultOpen, onOpenChange, closeLabel, labels, target: targetProp, positioning, side, align, children, id, className, style, onKeyDown, ref, ...rest }: TeachingPopoverProps): JSX.Element;
+    ({ steps, activeStep: activeStepProp, defaultActiveStep, currentStep, defaultCurrentStep, onStepChange, onDismiss, onFinish, primaryAction: primaryActionProp, secondaryAction: secondaryActionProp, footerLayout, open: openProp, defaultOpen, onOpenChange, closeLabel, labels, target: targetProp, positioning, side, align, children, id, className, style, onKeyDown, motion, ref, ...rest }: TeachingPopoverProps): JSX.Element;
     displayName: string;
 } & {
     Trigger: {
@@ -15215,11 +16694,25 @@ export declare interface TeachingPopoverProps extends React_2.HTMLAttributes<HTM
      * @default `{ offset: 12 }`
      */
     positioning?: PopupPositioning;
+    /**
+     * The motion of the surface TeachingPopover renders (next to a `TeachingPopover.Surface` it is
+     * ignored, with a development warning: give it to the Surface). By default the surface fades in
+     * over 200 ms with a decelerating curve and out over 100 ms with an accelerating curve, and,
+     * pointed at a target (or the Trigger), also slides 4px away from it on the side it opened on,
+     * and back as it closes; under reduced motion it appears and disappears at once. `null` turns
+     * the motion off (the surface still renders its `data-presence` phases, which then end at
+     * once); a class string or `{ className }` replaces the default classes with yours (see
+     * `MotionSlot`), also under a `WaveProvider` with `motion="none"`, which otherwise turns the
+     * default off. Fluent's `TeachingPopover` `surfaceMotion` (a TeachingPopover is a Popover
+     * there).
+     * @default the fade and slide above
+     */
+    motion?: MotionSlot | null;
     /**
      * `TeachingPopover.Trigger` and `TeachingPopover.Surface` (Fluent's composition), rendered where
      * they are written. Without a `TeachingPopover.Surface` among them, the popover renders its
      * surface itself, after the children, with the element props given here (`className`, `style`,
-     * `ref`, …); with one (best written directly inside, a Fragment is fine: see
+     * `ref`, `motion`, …); with one (best written directly inside, a Fragment is fine: see
      * `TeachingPopover.Surface`), the Surface takes them instead.
      */
     children?: React_2.ReactNode;
@@ -15251,19 +16744,19 @@ export declare interface TeachingPopoverStep {
 /**
  * The popover surface (Fluent's `TeachingPopoverSurface`): the non-modal `role="dialog"` element
  * that the `steps` form renders, with the same behaviour (in place, or portaled next to the
- * target with a beak; focus, dismissal, keyboard order and step announcements), so your
- * `className`, `style`, `ref` and other props reach the element the `steps` form gives
+ * target with a beak; focus, dismissal, keyboard order, step announcements and motion), so your
+ * `className`, `style`, `ref`, `motion` and other props reach the element the `steps` form gives
  * TeachingPopover's own. Without children it shows the current step as the `steps` form does;
  * children replace that content: build it from `TeachingPopover.Header`, `Title`, `Body` and
  * `Footer`, or from your own (then name the surface with `aria-label` or `aria-labelledby`).
  *
  * Render one inside TeachingPopover; TeachingPopover then renders no surface of its own, and its
- * own `className`, `style`, `ref` and other element props are ignored (a development warning says
- * so). Write it directly inside TeachingPopover (a Fragment is fine) where you can: there it is
- * found while rendering. One inside an element or a component of yours is found once it has
- * mounted, so until then TeachingPopover's own surface renders next to it: in the server HTML, and
- * in the browser's first commit (before anything is painted or focused). A second Surface renders
- * a second popover (a development warning says so).
+ * own `className`, `style`, `ref`, `motion` and other element props are ignored (a development
+ * warning says so). Write it directly inside TeachingPopover (a Fragment is fine) where you can:
+ * there it is found while rendering. One inside an element or a component of yours is found once
+ * it has mounted, so until then TeachingPopover's own surface renders next to it: in the server
+ * HTML, and in the browser's first commit (before anything is painted or focused). A second
+ * Surface renders a second popover (a development warning says so).
  *
  * Also exported as `TeachingPopoverSurface` for React Server Components, which cannot use the
  * dotted `TeachingPopover.Surface` (that needs a client file).
@@ -15294,6 +16787,19 @@ export declare interface TeachingPopoverSurfaceProps extends React_2.HTMLAttribu
      * without one, name it with `aria-label` or `aria-labelledby`.
      */
     children?: React_2.ReactNode;
+    /**
+     * The surface's motion (TeachingPopover's own `motion` is for the surface it renders without a
+     * Surface). By default it fades in over 200 ms with a decelerating curve and out over 100 ms with
+     * an accelerating curve, and, pointed at a target (or the Trigger), also slides 4px away from it
+     * on the side it opened on, and back as it closes; under reduced motion it appears and
+     * disappears at once. `null` turns the motion off (the surface still renders its
+     * `data-presence` phases, which then end at once); a class string or `{ className }` replaces
+     * the default classes with yours (see `MotionSlot`), also under a `WaveProvider` with
+     * `motion="none"`, which otherwise turns the default off. Fluent's `TeachingPopover`
+     * `surfaceMotion` (a TeachingPopover is a Popover there).
+     * @default the fade and slide above
+     */
+    motion?: MotionSlot | null;
     /** Ref to the popover surface (`role="dialog"`). */
     ref?: React_2.Ref<HTMLDivElement>;
 }
@@ -15892,7 +17398,8 @@ export declare interface ToastController {
     };
     /**
      * Dismisses the toast with this id and cancels its timer: a shown toast exits (it stays, inert,
-     * until an exit motion of yours ends), a waiting one is removed. Unknown ids are ignored.
+     * until its exit motion ends; see the Toaster's `motion`), a waiting one is removed. Unknown ids
+     * are ignored.
      */
     dismissToast: (id: string) => void;
     /**
@@ -15970,6 +17477,10 @@ export declare interface ToastDispatchOptions {
  * - `limit` caps how many toasts show at once: the others wait in a queue, in dispatch order,
  *   unannounced and without a running timer, and appear as shown toasts go.
  *   `dismissAllToasts()` removes every toast, shown and queued.
+ * - **Motion:** a toast slides and fades in from the stack's edge while its place opens; a
+ *   dismissed one fades out, then its place closes and the others glide together. It stays in
+ *   the document, `inert`, until then; at once under reduced motion. `motion` replaces or turns
+ *   off the motion of every toast.
  *
  * @example
  * <Toaster position="bottom-end" limit={3}>
@@ -15977,17 +17488,19 @@ export declare interface ToastDispatchOptions {
  * </Toaster>
  */
 export declare const Toaster: {
-    ({ position, limit: limitProp, shortcuts, toaster: handle, className, style, children, onFocus, onBlur, onKeyDown, onPointerEnter, onPointerLeave, onPointerOver, ref, ...rest }: ToasterProps): React_2.JSX.Element;
+    ({ position, limit: limitProp, shortcuts, toaster: handle, motion, className, style, children, onFocus, onBlur, onKeyDown, onPointerEnter, onPointerLeave, onPointerOver, ref, ...rest }: ToasterProps): React_2.JSX.Element;
     displayName: string;
 };
 
 /**
  * Toaster: `root` on the portaled toast region; `toast` on the `role="group"` container the
- * Toaster renders around each toast.
+ * Toaster renders around each toast; `toastContent` on the element inside each container, its
+ * only child, which holds the toast's status text and content (0.15).
  */
 export declare const toasterClassNames: {
     readonly root: "wave-toaster";
     readonly toast: "wave-toaster__toast";
+    readonly toastContent: "wave-toaster__toast-content";
 };
 
 /**
@@ -16024,6 +17537,20 @@ export declare interface ToasterProps extends React_2.HTMLAttributes<HTMLDivElem
      * queues again until a Toaster binds it.
      */
     toaster?: ToasterHandle;
+    /**
+     * The motion of every toast's container (the `role="group"` element; `className` stays on the
+     * region). By default a toast opens its place in the stack, fades in and slides 8px in from the
+     * stack's edge (the top or bottom edge `position` names) over 250 ms with a decelerating curve,
+     * all together; dismissed, it fades out over 200 ms, then its place closes over 200 ms more,
+     * so the toasts around it glide together and nothing jumps when it unmounts (the timer still
+     * starts when the toast is shown). Under reduced motion it appears and disappears at once.
+     * `null` turns the motion off (the container still renders its `data-presence` phases, which
+     * then end at once); a class string or `{ className }` replaces the default classes with yours
+     * (see `MotionSlot`), also under a `WaveProvider` with `motion="none"`, which otherwise turns
+     * the default off. A WaveUI addition: Fluent's Toaster has no motion slot.
+     * @default the slide, fade and collapse above
+     */
+    motion?: MotionSlot | null;
     /** Ref to the toast region (the portaled `<div role="region">`). */
     ref?: React_2.Ref<HTMLDivElement>;
 }
@@ -16572,8 +18099,13 @@ export declare interface ToolbarToggleButtonProps extends Omit<ToggleButtonProps
  * - The text is always present as a hidden `role="tooltip"` element referenced by the child's
  *   `aria-describedby` (or `aria-labelledby` with `relationship="label"`), so screen readers get
  *   it on focus without waiting for the delay; the child's own ids are kept.
- * - The visual surface is rendered in a portal only while visible (it is `aria-hidden`, a copy of
- *   the description), positioned on `side`/`align` with flipping and shifting to stay in view.
+ * - The visual surface is rendered in a portal while visible (it is `aria-hidden`, a copy of the
+ *   description), positioned on `side`/`align` with flipping and shifting to stay in view.
+ * - It fades in and out over 100 ms (see `motion`; at once under reduced motion). The surface
+ *   mounts through the presence core: it carries `data-presence` and `data-state="open"`, and
+ *   while it fades out `data-state="closed"` and `inert`, staying where it was until its exit
+ *   ends; the Escape layer goes as it hides, not after the fade. Shown again during its exit, the
+ *   same surface fades back in. The hidden description is unchanged in every phase.
  * - It appears `openDelay` after the pointer rests on the child or the child takes keyboard focus,
  *   stays visible while the pointer moves onto it, hides `closeDelay` after the pointer leaves or
  *   immediately on blur, and Escape hides it without closing an enclosing dialog or popover. Focus
@@ -16609,7 +18141,7 @@ export declare interface ToolbarToggleButtonProps extends Omit<ToggleButtonProps
  * </Menu>
  */
 export declare const Tooltip: {
-    ({ content, appearance: appearanceProp, variant, openDelay: openDelayProp, closeDelay, delay, open: openProp, defaultOpen, onOpenChange, relationship, side, align, positioning, children, className, onMouseEnter, onMouseLeave, onFocus, onBlur, ref, ...rest }: TooltipProps): React_2.JSX.Element;
+    ({ content, appearance: appearanceProp, variant, openDelay: openDelayProp, closeDelay, delay, open: openProp, defaultOpen, onOpenChange, relationship, side, align, positioning, motion, children, className, onMouseEnter, onMouseLeave, onFocus, onBlur, ref, ...rest }: TooltipProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -16692,6 +18224,17 @@ export declare interface TooltipProps extends Omit<React_2.HTMLAttributes<HTMLSp
      * @default `{ offset: 8 }`
      */
     positioning?: PopupPositioningOptions;
+    /**
+     * The motion of the tooltip's surface (the portaled box; `className` stays on the wrapper
+     * `<span>`). By default it fades in over 100 ms and out over 100 ms with the easy-ease curve,
+     * without a slide; under reduced motion it appears and disappears at once. `null` turns the
+     * motion off (the surface still renders its `data-presence` phases, which then end at once); a
+     * class string or `{ className }` replaces the default classes with yours (see `MotionSlot`),
+     * also under a `WaveProvider` with `motion="none"`, which otherwise turns the default off. A
+     * WaveUI addition: Fluent's Tooltip has no motion.
+     * @default the fade above
+     */
+    motion?: MotionSlot | null;
     /**
      * A single element that triggers the tooltip on hover and focus: it receives the
      * `aria-describedby`/`aria-labelledby`, plus any `id` and `aria-*` props given to the Tooltip
@@ -16714,6 +18257,10 @@ export declare interface TooltipProps extends Omit<React_2.HTMLAttributes<HTMLSp
  * Keyboard focus enters at the `selected` item, else the first item; while focus is inside, the
  * tab stop follows it, so Shift+Tab leaves the tree.
  *
+ * A child group opens and closes its space with a short collapse and fade (the Tree's `motion`;
+ * none under reduced motion or a `WaveProvider` with `motion="none"`), and focus inside a group
+ * that collapses moves to its item.
+ *
  * `selectionMode="multiple"` draws a checkbox on every item, bound to `checkedItems`: Space
  * toggles the focused item's check, a click on the checkbox toggles it, and a click elsewhere on
  * the row activates the item (as Enter does). Checks cascade: checking an item checks every item
@@ -16740,7 +18287,7 @@ export declare interface TooltipProps extends Omit<React_2.HTMLAttributes<HTMLSp
  * `TreeItemPersonaLayout` for React Server Components, which cannot use the dotted form.
  */
 export declare const Tree: {
-    ({ expandedItems, defaultExpandedItems, onExpandedItemsChange, onItemSelect, selected, current, selectionMode, navigationMode, checkedItems, defaultCheckedItems, onCheckedItemsChange, className, children, onKeyDown, onKeyDownCapture, onFocus, onBlur, ref, ...rest }: TreeProps): JSX.Element;
+    ({ expandedItems, defaultExpandedItems, onExpandedItemsChange, onItemSelect, selected, current, selectionMode, navigationMode, checkedItems, defaultCheckedItems, onCheckedItemsChange, motion, className, children, onKeyDown, onKeyDownCapture, onFocus, onBlur, ref, ...rest }: TreeProps): JSX.Element;
     displayName: string;
 } & {
     Item: {
@@ -16772,6 +18319,16 @@ export declare const treeClassNames: {
  * One node of a Tree. Text and other content are the label; nested `Tree.Item` children form its
  * child group, which is shown while the item is expanded.
  *
+ * The child group renders as the only child of a collapse element (its stable class
+ * `wave-tree-item__collapse`), which opens and closes the group's space (the Tree's `motion`) and
+ * has no box of its own while the item is expanded, so the group lays out in the item as before.
+ * An item expanded by default appears without motion. After a collapse the group stays in the
+ * document until the collapse ends, `inert` (its items leave the arrow keys and typeahead at once)
+ * while the item already reports itself collapsed; expanding the item again during the collapse
+ * keeps the same group. Focus inside the group when the item collapses moves to the item. A
+ * pointer click that falls through the exiting group onto the item (an `inert` element lets the
+ * pointer through) is not the item's: it neither expands nor activates it.
+ *
  * Nested items must be `Tree.Item` elements among the item's own children: written directly, in
  * Fragments, or returned by a render function (`{node.children.map(renderNode)}`). A component
  * that renders `Tree.Item` itself (a recursive `<NodeView node={child} />`) is not recognised:
@@ -16781,14 +18338,14 @@ export declare const treeClassNames: {
  * renders is not checked with its parent.
  *
  * `ref` and every other prop land on the `role="treeitem"` element, which contains the label row
- * and the child group. Its `onClick` receives only clicks on its own row (not on its child group
- * or nested items) and its `onKeyDown` only keys pressed while focus is on it or in its row; both
- * run before the built-in behaviour (call `event.preventDefault()` to skip it). In a checkbox
- * tree, a click on the item's checkbox toggles its check and is not passed to `onClick`, and
- * neither is a click on its actions; `onKeyDown` receives no keys pressed in the actions. Its
- * other event handlers (`onFocus`, `onDoubleClick`, `onContextMenu` and the rest) are not
- * filtered: as DOM events bubble, they also receive events from its child group and nested items
- * (compare `event.target` with `event.currentTarget` to tell them apart).
+ * and the child group (in its collapse element). Its `onClick` receives only clicks on its own
+ * row (not on its child group or nested items) and its `onKeyDown` only keys pressed while focus
+ * is on it or in its row; both run before the built-in behaviour (call `event.preventDefault()`
+ * to skip it). In a checkbox tree, a click on the item's checkbox toggles its check and is not
+ * passed to `onClick`, and neither is a click on its actions; `onKeyDown` receives no keys pressed
+ * in the actions. Its other event handlers (`onFocus`, `onDoubleClick`, `onContextMenu` and the
+ * rest) are not filtered: as DOM events bubble, they also receive events from its child group and
+ * nested items (compare `event.target` with `event.currentTarget` to tell them apart).
  *
  * `actions` render in a toolbar at the end of the row, named by the item; keys and clicks on them
  * belong to them and never activate or check the item. `aside` sits before them and describes the
@@ -16808,7 +18365,8 @@ export declare const TreeItem: {
  * chevron (or your `expandIcon`); `indicator` on the checkbox of a multi-select tree or the radio
  * of a single-select one; `icon` on the icon span; `label` on the label span; `iconAfter` on the
  * icon after the label; `aside` on the aside content; `actions` on the row's actions toolbar;
- * `group` on the `role="group"` element of its nested items.
+ * `group` on the `role="group"` element of its nested items; `collapse` on the element around
+ * that group (the element that opens and closes the group's space, 0.15).
  */
 export declare const treeItemClassNames: {
     readonly root: "wave-tree-item";
@@ -16821,6 +18379,7 @@ export declare const treeItemClassNames: {
     readonly aside: "wave-tree-item__aside";
     readonly actions: "wave-tree-item__actions";
     readonly group: "wave-tree-item__group";
+    readonly collapse: "wave-tree-item__collapse";
 };
 
 /**
@@ -16962,6 +18521,17 @@ export declare interface TreeProps extends React_2.HTMLAttributes<HTMLDivElement
      * @default 'tree'
      */
     navigationMode?: 'tree' | 'treegrid';
+    /**
+     * Replaces the collapse of every child group in the tree (Fluent's `Tree collapseMotion`), on
+     * the element around each `role="group"` element: by default the space a group takes opens
+     * from nothing and closes back to it, with a fade, over the normal duration (200 ms) with the
+     * max easy-ease curve, both ways. `null` turns it off (a group appears and disappears at once);
+     * a class string or `{ className }` replaces it, written as `MotionSlot` describes. A
+     * `WaveProvider` with `motion="none"` turns the default off, and a value here still applies
+     * under it. The expand chevron's turn is not part of it, and a nested `Tree` takes its own.
+     * @default the collapse described above
+     */
+    motion?: MotionSlot | null;
     /** Ref to the `role="tree"` element. */
     ref?: React_2.Ref<HTMLDivElement>;
 }
@@ -16995,7 +18565,9 @@ export declare type TypographyVariant = 'caption-2' | 'caption-1' | 'body-1' | '
  * - The moved-to item is dropped when it leaves `items` or while `enabled` is `false`, and does not
  *   come back without a user action; `fallback` is active while nothing was moved to.
  * - Keyboard and programmatic moves are scrolled into view (`{ block: 'nearest' }`); pointer moves
- *   (`highlight`) and `setActiveValue(value, { scroll: false })` are not.
+ *   (`highlight`) and `setActiveValue(value, { scroll: false })` are not. With `onScrollToItem` (a
+ *   windowed list) each such move is first passed to it by the item's index, also for an item
+ *   without an element.
  * - `onActiveValueChange` reports every change after the commit, once (StrictMode included).
  *
  * `useListbox` is built on it; use it directly for composites that are not listboxes.
@@ -17036,6 +18608,17 @@ export declare interface UseActiveDescendantOptions {
     activateFirstOnChange?: boolean;
     /** The element of an item, for scrolling it into view. @default document.getElementById(getId(value)) */
     getElement?: (value: string) => HTMLElement | null;
+    /**
+     * Called for every move that scrolls the active item into view, for a windowed list that renders
+     * part of its items: `index` is the item's index in `items`. Scroll the list so that it shows and
+     * renders the item (a virtual window's `scrollToIndex`, which moves the window in the same
+     * update); an element, when there is one (`getElement`, then the id lookup), is then scrolled
+     * into view as well. `aria-activedescendant` already names the item, and points at its element
+     * once it mounts. Called after the same moves that scroll (not after a pointer move or a
+     * `scroll: false` move), from a layout effect, once per change of the active item. Without it,
+     * an item without an element is not scrolled to.
+     */
+    onScrollToItem?: (index: number) => void;
     /** Called after the active item changed (from an effect), `null` included. */
     onActiveValueChange?: (value: string | null) => void;
 }
@@ -17281,6 +18864,60 @@ export declare interface UseFieldControlOptions {
     nativeRequired?: boolean;
 }
 
+/**
+ * The model of a flat tree: items listed with a `parentValue` link, in any order, become the rows
+ * a windowed tree shows (`FlatTree`), without building an element tree. Returns the visible rows
+ * (with `level`, `position`, `setSize` and `expanded` for the tree ARIA), the expanded and
+ * checked state, and the actions on them.
+ *
+ * Pass `items` as a stable reference or memoise it: the index of the items is rebuilt when its
+ * identity changes. Expanded and checked state work as in `Tree`: pass `expandedItems` or
+ * `checkedItems` to control it (a stable array, or the rows are rebuilt on every render), or
+ * `defaultExpandedItems` and `defaultCheckedItems` to start uncontrolled; the change callbacks
+ * fire once per change. When `items` is replaced, the expanded and checked values stay in the
+ * state: a value that matches no item is ignored for the rows until an item with it returns, and
+ * it is changed only by you.
+ *
+ * Development warnings, once each: an unknown `parentValue` (the item is a root), a cycle of
+ * parents (cut) and a duplicate value (the first item wins).
+ *
+ * @example
+ * const model = useFlatTree(items, { defaultExpandedItems: ['docs'] });
+ * model.visibleItems.map((row) => row.item.label);
+ */
+export declare function useFlatTree(items: readonly FlatTreeItemData[], options?: UseFlatTreeOptions): FlatTreeModel;
+
+/** Options of {@link useFlatTree}: the state names and shapes of the nested `Tree`. */
+export declare interface UseFlatTreeOptions {
+    /** Controlled list of expanded item values. */
+    expandedItems?: readonly string[];
+    /**
+     * Item values that are expanded initially (uncontrolled).
+     * @default []
+     */
+    defaultExpandedItems?: readonly string[];
+    /** Called with the new list of expanded item values when an item expands or collapses. */
+    onExpandedItemsChange?: (expandedItems: string[]) => void;
+    /** Controlled checked items (`selectionMode="multiple"`); the cascade rule is the nested `Tree`'s. */
+    checkedItems?: readonly string[];
+    /**
+     * Initially checked items (uncontrolled).
+     * @default []
+     */
+    defaultCheckedItems?: readonly string[];
+    /**
+     * Called with every checked item (in tree order) when a check changes. `details` is passed when
+     * `setChecked` got an `event`; it is typed optional until 1.0.
+     */
+    onCheckedItemsChange?: (checkedItems: string[], details?: TreeCheckedItemsChangeDetails) => void;
+    /**
+     * How items are selected, as `Tree`. With `'multiple'` every visible row carries its `checked`
+     * state; the model's `getTreeProps()` hands the mode on to `FlatTree`.
+     * @default 'none'
+     */
+    selectionMode?: 'none' | SelectionMode_2;
+}
+
 /**
  * A focusable group (Fluent's `useFocusableGroup`, tabster's groupper): one tab stop that holds
  * several focusable elements, so a long list of rich rows does not cost a Tab press per control.
@@ -17419,14 +19056,32 @@ export declare function useFocusVisible(): boolean;
  *   keys: its cell takes focus, and Enter/F2 enters the composite at its own tab stop. The grid never
  *   writes `tabindex` on or inside a composite (the composite manages its own), so a composite
  *   keeps its own Tab stop — the same documented limitation as `useRovingTabIndex`.
+ * - **Auxiliary widgets** (a widget that carries `data-grid-auxiliary`, such as a column's resize
+ *   handle) are left out when the cell's target is chosen, so a header with a sort button and a
+ *   resize handle keeps the button as its target (Enter sorts), and a cell whose only widget is
+ *   auxiliary is its own target. Like every widget they are at `tabindex="-1"` in navigation mode
+ *   and take part in interaction mode. F2 on a cell that has one, or on its target widget, enters
+ *   interaction mode at the first auxiliary widget (Enter on a cell that is its own target still
+ *   enters its first widget); Escape returns to the cell's target, the cell or its target widget.
+ *   While the widgets of such a cell are interacted with, its target widget is in interaction mode
+ *   too, so Tab moves between all of them and Escape on the target ends the mode. A cell without
+ *   auxiliary widgets behaves as described above.
+ * - **Rows by their data** (a `model`: a windowed grid, whose rows are mounted in part): the rows
+ *   are the header rows and the data rows, which carry their index in the data as `data-row-index`
+ *   (other rows, such as the spacer rows of a window, are skipped). ArrowUp/ArrowDown,
+ *   PageUp/PageDown and Ctrl+Home/Ctrl+End go by that index over every row of the data, header
+ *   rows first, with the rules above: a target row that is not mounted is asked for with
+ *   `scrollToRow` (once per row) and focused in the commit that mounts it, and Ctrl+Home also
+ *   brings data row 0 back under the header rows. The active cell is kept by its row and column:
+ *   `activeRowIndex` and `pendingRowIndex` name the rows the owner keeps mounted, and while the
+ *   active row is not mounted anyway, a cell of the nearest mounted row holds the tab stop until
+ *   the row is back. ArrowLeft/ArrowRight and Home/End work in the row as above.
  *
  * Keys are ignored when the event's default was prevented (a widget that handled the key, a
  * consumer handler), or with Alt/Meta held. The tab indexes are written to the DOM (layout effect
  * plus a `MutationObserver`), so rows and widgets added later are covered without a re-render. Focus
  * moves re-sync only the cells involved, the observer only the cells that changed, and the grid's
  * own `tabindex` writes do not trigger a re-sync.
- *
- * Internal to the table package.
  */
 export declare function useGridNavigation(options?: UseGridNavigationOptions): UseGridNavigationResult;
 
@@ -17437,6 +19092,14 @@ export declare interface UseGridNavigationOptions {
      * @default 10
      */
     pageSize?: number;
+    /**
+     * The data of a windowed grid (DataGrid with a virtual window). ArrowUp/ArrowDown,
+     * PageUp/PageDown and Ctrl+Home/Ctrl+End then move by the rows of the data: a target row that is
+     * not mounted is asked for with `scrollToRow` and focused when it mounts. The active row is kept
+     * by its index (see {@link UseGridNavigationResult.activeRowIndex}). Without it, the mounted
+     * rows are the whole grid.
+     */
+    model?: GridNavigationModel;
 }
 
 /** Result of {@link useGridNavigation}. */
@@ -17445,6 +19108,19 @@ export declare interface UseGridNavigationResult {
     gridRef: React_2.RefCallback<HTMLTableElement>;
     /** Keyboard and focus handlers for the grid element. Stable identities. */
     gridProps: GridNavigationHandlers;
+    /**
+     * With a `model`: the `data-row-index` of the active cell's row, the row that holds the grid's
+     * tab stop (or takes it back once it is mounted again), so the owner keeps that row mounted.
+     * `null` on a header row, and always `null` without a model. A change re-renders the owner.
+     */
+    activeRowIndex: number | null;
+    /**
+     * With a `model`: the index of the data row a key moved focus to while it is not mounted (asked
+     * for with `scrollToRow`); focus moves there in the commit that mounts it, so the owner keeps it
+     * mounted too. `null` when no row is awaited, and always `null` without a model. A change
+     * re-renders the owner.
+     */
+    pendingRowIndex: number | null;
 }
 
 /**
@@ -17540,7 +19216,10 @@ export declare function useIsOverflowItemVisible(itemId: string): boolean;
  *   render. Options register even when filtered out or hidden (they render `hidden` and are not
  *   navigable), so labels are always known — use {@link collectOptionLabels} for the display text
  *   before registration (SSR/first render). `filter` is the navigability predicate, which a
- *   picker builds from its query.
+ *   picker builds from its query. In data mode the keys, typeahead, the labels and the filter
+ *   read `items` only, so a picker may render just the shown options (`items` of the result), or
+ *   part of them: `onScrollToItem` receives every active option that scrolls into view, rendered
+ *   or not.
  * - **Active option** is derived during render: the highlighted value, else the `autoHighlight`
  *   fallback. The highlight is reset on close and after a single-select commit that closes the
  *   listbox, and dropped once it is not navigable any more (filtered out, hidden, removed by an
@@ -17607,8 +19286,10 @@ export declare function useListbox(options: UseListboxOptions): UseListboxResult
  * the option (registration mode) and its element, and reads its flags from the listbox store, so
  * it re-renders only when its own active/selected/hidden state changes. Spread `optionProps` onto
  * the `<li>` (`id`, `role="option"`, `aria-selected`, `aria-disabled`, `hidden`, and
- * `data-active`/`data-selected`/`data-disabled` for styling) and compose its `onClick` — and in
- * standalone mode its `onMouseDown`, the pointer press — with your own handlers. Mark the
+ * `data-active`/`data-selected`/`data-disabled` for styling; `aria-posinset` and `aria-setsize`
+ * when a `renderOption` of Listbox, Combobox or Dropdown renders it, and in a windowed list a
+ * `style` with its height, to merge after yours) and compose its `onClick` —
+ * and in standalone mode its `onMouseDown`, the pointer press — with your own handlers. Mark the
  * component with {@link markListboxElement}, so its label is known before it registers.
  *
  * Throws in development when used outside a listbox; in production it logs the error once and
@@ -17767,6 +19448,16 @@ export declare interface UseListboxOptions {
      * {@link useActiveDescendant}'s `onActiveValueChange`.
      */
     onActiveValueChange?: (value: string | null) => void;
+    /**
+     * Called for every move that scrolls the active option into view, for a list that renders only
+     * part of its options (a virtual window): `index` is the option's index in
+     * {@link UseListboxResult.items}, the shown options (filtered-out and hidden items are not
+     * counted, disabled ones are). Scroll the list so that it shows and renders the option (a
+     * window's `scrollToIndex(index)`, which moves the window in the same update); an element, when
+     * there is one, is then scrolled into view as well. `aria-activedescendant` names the option
+     * meanwhile. Passed to {@link useActiveDescendant}'s `onScrollToItem`, mapped to that index.
+     */
+    onScrollToItem?: (index: number) => void;
     /** Prefix of the generated listbox id. @default 'listbox' */
     idPrefix?: string;
     /**
@@ -18526,6 +20217,224 @@ export declare interface UseRovingTabIndexResult {
     focusLast: () => void;
 }
 
+/**
+ * Selection by id, held outside the DOM, for lists, tables and trees whose items are not all
+ * rendered. State is controlled with `selectedItems` or uncontrolled with `defaultSelectedItems`;
+ * `onSelectedItemsChange` fires once per change, never for a no-op.
+ *
+ * @example
+ * const selection = useSelection({ selectionMode: 'multiple' });
+ * selection.toggleAll(rows.map((row) => row.id));
+ */
+export declare function useSelection({ selectionMode, selectedItems: selectedItemsProp, defaultSelectedItems, onSelectedItemsChange, }: UseSelectionOptions): UseSelectionResult;
+
+/** What {@link UseSelectionOptions.onSelectedItemsChange} receives as its second argument. */
+export declare interface UseSelectionChangeDetails {
+    /** The event that caused the change, when the caller passed one. */
+    event?: Event;
+    /** The id that was toggled, selected or deselected. Absent for `toggleAll` and `clear`. */
+    id?: string;
+}
+
+/** Options of {@link useSelection}. */
+export declare interface UseSelectionOptions {
+    /**
+     * `single` keeps at most one id selected and never deselects through `toggle`; `multiple` toggles
+     * ids independently.
+     */
+    selectionMode: SelectionMode_2;
+    /** The selected ids (controlled). Pair it with `onSelectedItemsChange`. */
+    selectedItems?: readonly string[];
+    /**
+     * The ids selected at first render (uncontrolled).
+     * @default []
+     */
+    defaultSelectedItems?: readonly string[];
+    /**
+     * Called with a new array of the selected ids whenever the selection changes. A call that leaves
+     * the selection as it is (selecting a selected id, toggling the selected id in `single` mode)
+     * does not call it.
+     */
+    onSelectedItemsChange?: (selectedItems: string[], details?: UseSelectionChangeDetails) => void;
+}
+
+/** What {@link useSelection} returns. */
+export declare interface UseSelectionResult {
+    /** The mode the hook was given. */
+    selectionMode: SelectionMode_2;
+    /**
+     * The selected ids. The same set object is returned while the ids stay the same, so it can key a
+     * memo. It holds ids whose items are not rendered.
+     */
+    selectedItems: ReadonlySet<string>;
+    /** Whether `id` is selected. */
+    isSelected(id: string): boolean;
+    /** Toggles `id`: in `multiple` mode adds or removes it, in `single` mode selects it. */
+    toggle(id: string, event?: Event): void;
+    /** Selects `id`; in `single` mode it replaces the selection. */
+    select(id: string, event?: Event): void;
+    /** Removes `id` from the selection. */
+    deselect(id: string, event?: Event): void;
+    /**
+     * Selects every id of `universe` when not all of them are selected, else removes only the ids of
+     * `universe`: ids outside it stay selected. It does nothing in `single` mode.
+     */
+    toggleAll(universe: readonly string[], event?: Event): void;
+    /** Empties the selection, ids outside any universe included. */
+    clear(event?: Event): void;
+}
+
+/**
+ * The column sizing plugin of `useTableFeatures`: the width of every column, held at or above its
+ * minimum, and the props that lay a static `Table` out with them. Fills `state.columnSizing`.
+ * Spread `getTableProps()` on the `Table`, render a `<colgroup>` with a `<col>` per column and
+ * spread `getColumnProps(columnId)` on it, and give each `Table.ResizeHandle` the
+ * `getResizeHandleProps(columnId)`. The widths are controlled with `columnWidths` or uncontrolled
+ * with `defaultColumnWidths`. Until a width is state (a resize, or `columnWidths` or
+ * `defaultColumnWidths` is given) the table is 100% wide and at least as wide as the columns; from
+ * then on it is exactly as wide as they are, so a dragged edge follows the pointer. There is no
+ * maximum width, and no fitting of the columns to the container. Call it unconditionally and pass
+ * the plugin to `useTableFeatures`.
+ *
+ * @example
+ * const { columnSizing } = useTableFeatures({ items, columns }, [
+ *   useTableColumnSizing({ columnSizingOptions: { name: { minWidth: 120, defaultWidth: 240 } } }),
+ * ]);
+ * <Table {...columnSizing.getTableProps()}>
+ *   <colgroup>
+ *     {columns.map((c) => <col key={c.columnId} {...columnSizing.getColumnProps(c.columnId!)} />)}
+ *   </colgroup>
+ * </Table>
+ */
+export declare function useTableColumnSizing<T>(options?: UseTableColumnSizingOptions): TableFeaturePlugin<T>;
+
+/** Options of {@link useTableColumnSizing}. */
+export declare interface UseTableColumnSizingOptions {
+    /**
+     * Per column, by `columnId`: `minWidth` (`@default 80`), and the width the column starts at,
+     * `defaultWidth` or else `idealWidth` (else 150). Ids that are not columns are ignored. May be
+     * written inline.
+     */
+    columnSizingOptions?: Record<string, ColumnSizingOption>;
+    /**
+     * The column widths in pixels (controlled), by `columnId`: a column without an entry has its
+     * initial width. Pair it with `onColumnWidthsChange`.
+     */
+    columnWidths?: Record<string, number>;
+    /** The column widths at first render (uncontrolled). */
+    defaultColumnWidths?: Record<string, number>;
+    /**
+     * Called with the width of every column and the details whenever a width changes (every step of
+     * a drag or key press). The details are always passed; they are typed optional through 0.x, as
+     * every `details` argument. Setting the width a column already has does not call it, once a
+     * width is state.
+     */
+    onColumnWidthsChange?: (widths: Record<string, number>, details?: TableColumnWidthsChangeDetails) => void;
+}
+
+/**
+ * Headless table state for a table built from the static `Table` parts: the rows of `items`, and
+ * the features its plugins add (`useTableSort`, `useTableSelection`, `useTableColumnSizing`). Each
+ * plugin fills its own part of the state (`sort`, `selection`, `columnSizing`), so the order of
+ * the array does not matter. The state follows the data, not the rendered rows, so a table that
+ * renders a page or a window of its rows keeps select-all and the sort over every item.
+ *
+ * Call each plugin hook unconditionally, in the array or before it, and pass the same plugins on
+ * every render; to turn a feature off, change its options. Options may be written inline: a plugin
+ * whose options change identity on every render (an inline `isDisabled`) only makes the state be
+ * recomputed on every render, while `getRows()` keeps its array until `items`, `getRowId`,
+ * `columns` or the sort change. A feature given twice (the last plugin of it is used), a plugin
+ * count that changes between renders and repeated row ids are development warnings.
+ *
+ * @example
+ * const { getRows, sort, selection } = useTableFeatures({ items, columns, getRowId }, [
+ *   useTableSort({ defaultSort: { columnId: 'name', direction: 'ascending' } }),
+ *   useTableSelection({ selectionMode: 'multiple' }),
+ * ]);
+ */
+export declare function useTableFeatures<T>(options: UseTableFeaturesOptions<T>, plugins?: readonly TableFeaturePlugin<T>[]): TableFeaturesState<T>;
+
+/** Options of {@link useTableFeatures}. */
+export declare interface UseTableFeaturesOptions<T> {
+    /** The items, one row each. Every item counts for select-all, rendered or not. */
+    items: readonly T[];
+    /** The columns, from `createTableColumn`. The sort uses the `compare` of the sorted column. */
+    columns: readonly DataGridColumn<T>[];
+    /**
+     * The row id of an item: unique, and the same for an item across renders (selection and the
+     * selection callbacks use it). Pass a stable function (defined outside the component, or
+     * memoised): the rows are rebuilt when it changes.
+     * @default (item, index) => String(index)
+     */
+    getRowId?: (item: T, index: number) => string;
+}
+
+/**
+ * The selection plugin of `useTableFeatures`: a set of row ids (`selectedItems`, controlled, or
+ * `defaultSelectedItems`), and `state.selection` with select-all over every item of `items`,
+ * rendered or not. Select-all selects every selectable row and leaves the other ids as they are;
+ * deselecting all removes only the selectable ids of `items`, so a selected disabled row and ids
+ * selected on another page or filtered out stay selected (`clearRows` empties the selection).
+ * `onSelectedItemsChange` fires once per change with a new array of every selected id. Call it
+ * unconditionally and pass the plugin to `useTableFeatures`.
+ *
+ * @example
+ * const { selection } = useTableFeatures({ items, columns, getRowId }, [
+ *   useTableSelection({ selectionMode: 'multiple', onSelectedItemsChange: setSelected }),
+ * ]);
+ */
+export declare function useTableSelection<T>(options: UseTableSelectionOptions<T>): TableFeaturePlugin<T>;
+
+/** Options of {@link useTableSelection}: those of `useSelection`, plus the disabled rows. */
+export declare interface UseTableSelectionOptions<T> extends UseSelectionOptions {
+    /**
+     * Whether the selection of an item cannot change through select-all: `toggleAllRows` skips it,
+     * and `allRowsSelected` does not wait for it. A disabled row keeps its state. The single-row
+     * functions do not read it: disable the row's own control. Called for every item of `items`
+     * whenever `useTableFeatures` computes its state: when the selection, `items`, `getRowId`,
+     * `columns`, the sort or another plugin's state (the column widths) change, and when this
+     * function changes. A function written inline is a new one on every render, so the state is
+     * then computed, and this function called for every item, on every render (no more: no extra
+     * render, and `getRows()` keeps its array); define it outside the component or memoise it to
+     * call it only on those changes.
+     */
+    isDisabled?: (item: T, index: number) => boolean;
+}
+
+/**
+ * The sort plugin of `useTableFeatures`: sorts the rows by the `compare` of a column and fills
+ * `state.sort`. The sort is controlled with `sort` or uncontrolled with `defaultSort`;
+ * `toggleColumnSort` goes from ascending to descending as a sortable DataGrid header does. The
+ * sorted column is the one whose `columnId` is the sort's `columnId` (the deprecated `id` of a
+ * column is not read). Call it unconditionally and pass the plugin to `useTableFeatures`.
+ *
+ * @example
+ * const state = useTableFeatures({ items, columns }, [
+ *   useTableSort({ defaultSort: { columnId: 'name', direction: 'ascending' } }),
+ * ]);
+ * state.sort.toggleColumnSort('name');
+ */
+export declare function useTableSort<T>(options?: UseTableSortOptions): TableFeaturePlugin<T>;
+
+/** Options of {@link useTableSort}. */
+export declare interface UseTableSortOptions {
+    /**
+     * The sort (controlled): the sorted column and its direction, or `null` for the order of
+     * `items`. Pair it with `onSortChange`.
+     */
+    sort?: DataGridSort | null;
+    /**
+     * The sort at first render (uncontrolled).
+     * @default null
+     */
+    defaultSort?: DataGridSort | null;
+    /**
+     * Called with the new sort whenever it changes, and the event behind it when the change was
+     * given one. Setting the sort it already has does not call it.
+     */
+    onSortChange?: (sort: DataGridSort, details?: DataGridSortChangeDetails) => void;
+}
+
 /**
  * Returns the {@link ToastController} of the enclosing `<Toaster>`: `dispatchToast(content,
  * options?)` shows your content (usually a `<Toast>` with parts) and `dispatchToast(options)` a
@@ -18558,6 +20467,70 @@ export declare interface UseRovingTabIndexResult {
  */
 export declare function useToastController(): ToastController;
 
+/**
+ * A window over a long list of fixed-height rows, for rendering only the rows in view. Give
+ * `scrollRef` to the scrolling element and render `layout(count)`: rows for the item entries and
+ * empty blocks of `size` pixels for the spacer entries.
+ *
+ * The window re-renders only when the first row in view or the viewport height changes, not on
+ * every scroll event: scrolling is read in a passive `scroll` listener once per animation frame,
+ * and the viewport height on attach, on scroll and from a `ResizeObserver` where one exists. The
+ * server and the first render lay out the top of the list in `initialViewportSize`, and read no
+ * DOM.
+ *
+ * Never write `ref={virtualWindow.scrollRef}` in JSX: the React Compiler's lint types a member
+ * read in the `ref` position as a ref, then reports that read and every call on the window during
+ * render (`virtualWindow.layout(count)` included). Merge the callback with the element's other
+ * refs through `useMergedRefs(ownRef, virtualWindow.scrollRef)`, or destructure it first
+ * (`const { scrollRef } = virtualWindow`); `virtualWindow.layout(count)` can then be called as is.
+ *
+ * @example
+ * const virtualWindow = useVirtualWindow({ itemSize: 32 });
+ * const { scrollRef } = virtualWindow;
+ * return (
+ *   <div ref={scrollRef} style={{ height: 320, overflowY: 'auto' }}>
+ *     {virtualWindow.layout(rows.length).map((entry) =>
+ *       entry.kind === 'item' ? (
+ *         <Row key={rows[entry.index].id} row={rows[entry.index]} />
+ *       ) : (
+ *         <div key={entry.key} aria-hidden="true" style={{ height: entry.size }} />
+ *       ),
+ *     )}
+ *   </div>
+ * );
+ */
+export declare function useVirtualWindow({ itemSize, overscan, initialViewportSize, scrollPaddingStart, }: UseVirtualWindowOptions): VirtualWindow;
+
+/** Options of {@link useVirtualWindow}. */
+export declare interface UseVirtualWindowOptions {
+    /**
+     * The height of every row, in pixels (all rows have the same height). A value that is not a
+     * positive finite number warns once in development and counts as 1.
+     */
+    itemSize: number;
+    /**
+     * Rows rendered beyond each edge of the viewport, so a fast scroll shows rows instead of blank
+     * space before the next window renders. A given number is a number of rows; the default covers
+     * at least 240 pixels, so small rows get more of them (9 rows of 28 pixels, 8 of 32).
+     * @default enough rows for 240 pixels, and at least 6
+     */
+    overscan?: number;
+    /**
+     * The viewport height, in pixels, assumed until the scroller is measured: on the server, in the
+     * first render, and while the scroller measures 0 (it has no layout, as in jsdom).
+     * @default 480
+     */
+    initialViewportSize?: number;
+    /**
+     * The height, in pixels, of content pinned over the top of the rows inside the scroller (a
+     * sticky header). `scrollToIndex` places rows in the area below it, and its content bound leaves
+     * it out; the rows' offsets and the layout do not change. A value that is not a finite number of
+     * 0 or more counts as 0.
+     * @default 0
+     */
+    scrollPaddingStart?: number;
+}
+
 /**
  * Reads the theme, direction, theme classes and portal container of the nearest
  * {@link WaveProvider}. Outside a provider it returns light/ltr defaults with `hasProvider: false`.
@@ -18583,6 +20556,85 @@ export declare interface VirtualElement {
     contextElement?: Element;
 }
 
+/**
+ * One entry of a windowed list: a row to render, or the empty space that stands in for the rows
+ * that are not rendered. A spacer's `key` is stable for React: `spacer-<index of the next item>`,
+ * or `spacer-end` for the one after the last item.
+ */
+export declare type VirtualEntry = {
+    kind: 'item';
+    index: number;
+} | {
+    kind: 'spacer';
+    size: number;
+    key: string;
+};
+
+/**
+ * A window over a long list of fixed-height rows: which rows to render for the scroll position,
+ * and the space that stands in for the others. {@link useVirtualWindow} returns one; a component
+ * that takes a `virtualWindow` prop renders its rows through it, and an adapter over a
+ * virtualization library can implement the same interface.
+ */
+export declare interface VirtualWindow {
+    /** The row height the window lays out with, in pixels. */
+    itemSize: number;
+    /**
+     * The callback ref of the scrolling element (the element with a bounded height and its own
+     * scrollbar). It attaches once per element and detaches when called with `null`.
+     */
+    scrollRef: React_2.RefCallback<HTMLElement>;
+    /**
+     * The entries to render, in order, for a list of `count` rows: the rows in view plus the
+     * overscan, every `keep` index outside them as a row of its own (the focused row, a row about
+     * to be focused), and spacers for the rows in between. The sizes add up to `count * itemSize`.
+     * A pure function of the window's state and its arguments, called during render; it reads no
+     * DOM.
+     */
+    layout(count: number, options?: {
+        keep?: readonly number[];
+    }): readonly VirtualEntry[];
+    /**
+     * Scrolls the row at `index` into view and moves the window to it in the same update, so the
+     * row is rendered once that update commits. `align` places it at the `start`, `center` or `end`
+     * of the viewport; `auto` (the default) scrolls the least that shows it whole. The offset is
+     * bounded by the rendered content. Before the scroller attaches, the last request is kept and
+     * applied when it does, and once more when the scroller first changes height after that (a
+     * popup that positioning shrinks once it is shown), unless it was scrolled or another request
+     * came in between. Call it from an event handler or an effect, never during render.
+     */
+    scrollToIndex(index: number, options?: {
+        align?: 'auto' | 'start' | 'center' | 'end';
+    }): void;
+}
+
+/**
+ * One row of the visible list: an item under expanded branches only, with the facts a row needs
+ * for its tree semantics. A row is a branch when `hasChildren` is true or when
+ * `item.itemType === 'branch'`; `expanded` is true only for a branch whose value is in the
+ * expanded set (so a childless `'branch'` item can be expanded).
+ */
+export declare interface VisibleFlatItem {
+    /** The item data, as passed in. */
+    item: FlatTreeItemData;
+    /** The depth, 1 for a root (`aria-level`). */
+    level: number;
+    /** The 1-based place among its siblings, in the order of `items` (`aria-posinset`). */
+    position: number;
+    /** The number of siblings, itself included (`aria-setsize`). */
+    setSize: number;
+    /** The value of the parent as indexed (`undefined` for a root, an unknown parent included). */
+    parentValue: string | undefined;
+    /** Whether other items are nested in it. */
+    hasChildren: boolean;
+    /** Whether it can expand: `hasChildren`, or `item.itemType === 'branch'` (`aria-expanded` is set for these). */
+    isBranch: boolean;
+    /** Whether it is a branch in the expanded set. */
+    expanded: boolean;
+    /** The place in the visible list, 0-based. */
+    index: number;
+}
+
 /** Value provided by {@link WaveProvider} and returned by {@link useWaveTheme}. */
 export declare interface WaveContextValue {
     /** The active theme. */
@@ -18598,6 +20650,8 @@ export declare interface WaveContextValue {
     portalContainer: HTMLElement | null;
     /** The merged input defaults of the providers above (`{}` outside a provider). */
     inputDefaults: InputDefaults;
+    /** The motion preference of the providers above (`'default'` outside a provider). */
+    motion: MotionPreference;
     /** `false` when no {@link WaveProvider} is above the caller (the defaults are returned). */
     hasProvider: boolean;
 }
@@ -18624,9 +20678,13 @@ export declare type WaveDir = 'ltr' | 'rtl';
  * - `inputDefaults` nests differently: a nested provider's defined keys override the enclosing
  *   provider's, and an omitted key is inherited, so setting only `appearance` in a nested provider
  *   keeps the enclosing provider's `size`.
+ * - `motion="none"` turns the default motion of every animated part below it off (its motion
+ *   slots, Carousel's slide, TabList's sliding line, the reveal of Nav item actions; a part's own
+ *   `motion` still wins), while transitions without a slot keep running (Accordion's and Tree's
+ *   chevron turns, colour changes); a nested provider inherits an omitted `motion` like `theme`.
  */
 export declare const WaveProvider: {
-    ({ theme: themeProp, dir: dirProp, portalContainer: portalContainerProp, inputDefaults: inputDefaultsProp, children, className, ref, ...rest }: WaveProviderProps): React_2.JSX.Element;
+    ({ theme: themeProp, dir: dirProp, portalContainer: portalContainerProp, inputDefaults: inputDefaultsProp, motion: motionProp, children, className, ref, ...rest }: WaveProviderProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -18662,6 +20720,18 @@ export declare interface WaveProviderProps extends React_2.HTMLAttributes<HTMLDi
      * @default the enclosing WaveProvider's defaults, else none (`medium`, `outline`)
      */
     inputDefaults?: InputDefaults;
+    /**
+     * Motion of the subtree. `'none'` makes every motion slot below it (a part's `motion`,
+     * `backdropMotion`, `expandIconMotion` or `indeterminateMotion` left unset) behave as `null`,
+     * which also stops the slide of TabList's selection line, and turns off Carousel's slide or fade
+     * (a Carousel without its own `motion`) and the reveal of Nav item actions; a part's own value
+     * still wins. Transitions that are no motion slot keep running: the turn of Accordion's and
+     * Tree's chevrons, colour changes on hover and press. Fluent's `MotionBehaviourProvider` with `'skip'` is the counterpart, which
+     * `@fluentui/react-components` does not export. A nested provider inherits an omitted `motion`
+     * like `theme`.
+     * @default the enclosing WaveProvider's motion, else 'default'
+     */
+    motion?: MotionPreference;
     /** Content rendered inside the themed container. */
     children: React_2.ReactNode;
     /** Ref to the themed root `<div>`. */