@mortenbrudvik/waveui 0.8.0 → 0.9.0

package/dist/index.d.cts

@@ -1116,9 +1116,12 @@ export declare interface CarouselProps extends React_2.HTMLAttributes<HTMLDivEle
  *   `labelPosition="before"` (the root carries `data-label-position`). The box lines up with the
  *   first line of a label that wraps or has a second line. `children` are not rendered (a
  *   development warning says so).
+ * - `size` (`medium`, `large`) and `shape` (`square`, `circular`) set the box's dimensions and
+ *   corners; the root carries `data-size` and `data-shape`. Checkbox does not read a surrounding
+ *   `Field`'s size or a `WaveProvider`'s input defaults.
  */
 export declare const Checkbox: {
-    ({ checked: checkedProp, defaultChecked, indeterminate, onCheckedChange, onChange, disabled, disabledFocusable, label, labelPosition, name, value, required, form, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, "aria-details": ariaDetails, "aria-disabled": ariaDisabled, autoFocus, tabIndex, onClick, onFocus, onBlur, onKeyDown, onKeyUp, controlRef, className, children, ref, ...rest }: CheckboxProps): React_2.JSX.Element;
+    ({ checked: checkedProp, defaultChecked, indeterminate, onCheckedChange, onChange, disabled, disabledFocusable, label, labelPosition, size, shape, name, value, required, form, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, "aria-details": ariaDetails, "aria-disabled": ariaDisabled, autoFocus, tabIndex, onClick, onFocus, onBlur, onKeyDown, onKeyUp, controlRef, className, children, ref, ...rest }: CheckboxProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -1188,6 +1191,18 @@ export declare interface CheckboxProps extends Omit<React_2.HTMLAttributes<HTMLL
      * @default 'after'
      */
     labelPosition?: CheckboxLabelPosition;
+    /**
+     * Size of the box: an 18px box (the 0.7 look) or a 22px box with a bigger glyph. Unlike the
+     * text controls and pickers, Checkbox does not read a surrounding Field's size or a
+     * WaveProvider's input defaults: this prop is the only source of its size.
+     * @default 'medium'
+     */
+    size?: CheckboxSize;
+    /**
+     * Shape of the box: square corners (the 0.7 look) or a circular, round box.
+     * @default 'square'
+     */
+    shape?: CheckboxShape;
     /**
      * Form field name. With a name, the checkbox takes part in native form submission: it submits
      * `name=value` while checked.
@@ -1217,6 +1232,12 @@ export declare interface CheckboxProps extends Omit<React_2.HTMLAttributes<HTMLL
     ref?: React_2.Ref<HTMLLabelElement>;
 }
 
+/** Shape of the box: square corners (the 0.7 look) or a circular, round box. */
+export declare type CheckboxShape = Extract<Shape, 'square' | 'circular'>;
+
+/** Size of the box: an 18px box (the 0.7 look) or a 22px box with a bigger glyph. */
+export declare type CheckboxSize = Extract<Size, 'medium' | 'large'>;
+
 /**
  * Checked items of a menu or toolbar, per group `name`: `{ sort: ['date'], view: ['ruler', 'grid'] }`.
  * A checkbox or switch item (or a toolbar toggle) is checked while its `value` is in
@@ -1772,6 +1793,11 @@ export declare interface ColorSliderProps extends Omit<React_2.HTMLAttributes<HT
  * `name`/`required` the value takes part in form submission, validation and reset. The open
  * listbox renders in a portal; while closed it stays in the DOM, hidden.
  *
+ * **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s
+ * `size`, then `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own prop,
+ * then `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as `data-size` and
+ * `data-appearance` on the root `<div>`. The listbox keeps its size.
+ *
  * Sub-components: `Combobox.Option`, `Combobox.OptionGroup`. React Server Components import the
  * flat names `ComboboxOption` / `ComboboxOptionGroup` (dotted access needs a client file).
  */
@@ -1866,6 +1892,18 @@ export declare interface ComboboxProps extends Omit<React_2.HTMLAttributes<HTMLD
      * @default false
      */
     disabled?: boolean;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`. The
+     * listbox keeps its size.
+     */
+    size?: CoreSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /**
      * Whether the typed text is itself the value. Without it, typing only filters the options (the
      * first match becomes active, so Enter selects it) and the input shows the selected option's
@@ -2047,6 +2085,12 @@ export declare interface CompoundButtonOwnProps {
  */
 export declare type CompoundButtonProps<C extends React_2.ElementType = 'button'> = PolymorphicProps<C, CompoundButtonOwnProps>;
 
+/**
+ * The three-step size of text inputs, pickers, Field and Label (Fluent's field sizes): `small`
+ * (24px tall), `medium` (32px) and `large` (40px).
+ */
+export declare type CoreSize = Extract<Size, 'small' | 'medium' | 'large'>;
+
 /**
  * A small pill showing a count (unread messages, notifications), or with `dot` a small dot
  * without a number. Renders nothing for a count of 0 (unless `showZero`) or less, and
@@ -2516,6 +2560,10 @@ export declare interface DataGridUncontrolledSortProps extends NoDeprecatedSortP
  *   clear button that disappears.
  * - Every emitted date is local midnight. The calendar opens on the month of the selected date or
  *   today, clamped into `minDate`/`maxDate`.
+ * - **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s
+ *   `size`, then `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own
+ *   prop, then `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as
+ *   `data-size` and `data-appearance` on the root `<div>`. The calendar keeps its size.
  * - The input (`controlRef`) 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
@@ -2657,6 +2705,18 @@ export declare interface DatePickerProps extends Omit<React_2.HTMLAttributes<HTM
      * @default false
      */
     disabled?: boolean;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`. The
+     * calendar keeps its size.
+     */
+    size?: CoreSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /**
      * Makes the input read-only: the calendar does not open and the value cannot change. Turning it
      * (or `disabled`) on while the user is typing drops the typed text.
@@ -3354,6 +3414,11 @@ export declare interface DrawerTriggerRenderProps extends React_2.HTMLAttributes
  * `name`/`required` the value takes part in form submission, validation and reset. The open
  * listbox renders in a portal; while closed it stays in the DOM, hidden.
  *
+ * **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s
+ * `size`, then `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own prop,
+ * then `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as `data-size` and
+ * `data-appearance` on the root `<div>`. The listbox keeps its size.
+ *
  * Sub-components: `Dropdown.Option`, `Dropdown.OptionGroup`. React Server Components import the
  * flat names `DropdownOption` / `DropdownOptionGroup` (dotted access needs a client file).
  */
@@ -3439,6 +3504,18 @@ export declare interface DropdownProps extends Omit<React_2.HTMLAttributes<HTMLD
      * @default false
      */
     disabled?: boolean;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`. The
+     * listbox keeps its size.
+     */
+    size?: CoreSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /** Name of the value in form submissions (renders a hidden input). */
     name?: string;
     /** Id of the form the value belongs to, when the Dropdown is outside it. */
@@ -3483,6 +3560,17 @@ export declare interface DropdownProps extends Omit<React_2.HTMLAttributes<HTMLD
  * - `orientation="horizontal"` puts the label in a start column beside the control, with the
  *   message and the hint below the control. The label lines up with the first line of the
  *   control (a Checkbox, Switch or RadioGroup gets 6px of padding above and below for it).
+ * - `size` sets the label's type ramp and, in the horizontal layout, its top padding and the
+ *   padding that lines a Checkbox, Switch or RadioGroup row up with it, so the label's first
+ *   line keeps lining up with a 24, 32 or 40px control. The message and the hint stay small.
+ *   Controls inside read the prop from `FieldContext` as their own default `size` (their own
+ *   `size` wins); the Field's own label falls back to `WaveProvider inputDefaults.size`, else
+ *   `medium`, and the root always renders that resolved value as `data-size`.
+ * - `label` also takes a `Label` or `InfoLabel` element, which renders in place of Field's own
+ *   `<label>` with the Field's wiring (see `label`); an InfoLabel's info button sits next to the
+ *   label text, outside the `<label>`, so the control is named by the text alone. A group control
+ *   (RadioGroup, your own `<div role="radiogroup">`) is named through `aria-labelledby` pointing
+ *   at that `<label>`.
  * - Provides `FieldContext`: the library's inputs (Input, Select, Textarea, Slider, SearchBox,
  *   Checkbox, Switch, RadioGroup, Rating, SpinButton, pickers, …) read it wherever they are inside
  *   the Field and are named by the label, described by the message and the hint and marked
@@ -3543,6 +3631,13 @@ export declare interface DropdownProps extends Omit<React_2.HTMLAttributes<HTMLD
  * </Field>
  *
  * @example
+ * // An InfoLabel as the label: the input is named "Password", the info button
+ * // "Password Information".
+ * <Field label={<InfoLabel info="Use 12 characters or more.">Password</InfoLabel>} required>
+ *   <Input type="password" />
+ * </Field>
+ *
+ * @example
  * // A wrapper component goes inside a plain element.
  * <Field label="Name" required>
  *   <div>
@@ -3553,7 +3648,7 @@ export declare interface DropdownProps extends Omit<React_2.HTMLAttributes<HTMLD
  * </Field>
  */
 export declare const Field: {
-    ({ label, hint, error, validationState, validationMessage, validationMessageIcon, orientation, required, htmlFor, className, children, ref, ...rest }: FieldProps): React_2.JSX.Element;
+    ({ label, hint, error, validationState, validationMessage, validationMessageIcon, orientation, size, required, htmlFor, className, children, ref, ...rest }: FieldProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -3621,6 +3716,12 @@ export declare interface FieldContextValue {
      * `errorId` is set only while that message is an error.
      */
     validationMessageId?: string;
+    /**
+     * The Field's own `size` prop, when set: the default size of the text inputs and pickers inside
+     * it (their own `size` wins). Absent when the Field has no `size` (the controls then fall back to
+     * `WaveProvider inputDefaults`) and in contexts built before 0.9.
+     */
+    size?: CoreSize;
 }
 
 /**
@@ -3683,6 +3784,18 @@ export declare interface FieldProps extends React_2.HTMLAttributes<HTMLDivElemen
     /**
      * Label displayed above the control (beside it with `orientation="horizontal"`); names the
      * control.
+     *
+     * A `Label` or `InfoLabel` element passed as `label` renders in place of Field's own `<label>`,
+     * never inside it, and names the control by its label text alone (an InfoLabel's info button
+     * sits next to the `<label>`, outside it). Field always points it at the control (`htmlFor`),
+     * and gives it the Field's label id, `required`, label `size` and `weight="semibold"` (the look
+     * of Field's own label), each only where the element leaves it unset; Field's layout classes go
+     * before the element's `className`, so the element's classes win. The element's own `htmlFor`
+     * is read like the Field's `htmlFor` (which wins over it): it becomes the control's id when the
+     * control has none, and one that points at another element is replaced, with a development
+     * warning. Field shows no asterisk of its own next to such an element: the element shows its
+     * `required` indicator. Only the element itself is recognized, not one inside a Fragment, an
+     * array or another element.
      */
     label?: React_2.ReactNode;
     /** Hint shown below the control, after any validation message; describes the control. */
@@ -3725,6 +3838,12 @@ export declare interface FieldProps extends React_2.HTMLAttributes<HTMLDivElemen
      * @default 'vertical'
      */
     orientation?: Orientation;
+    /**
+     * The label's size and the default `size` of the text inputs and pickers inside the Field
+     * (their own `size` wins; choice controls keep theirs). The message and the hint stay small.
+     * @default `WaveProvider` `inputDefaults.size`, else `'medium'`.
+     */
+    size?: CoreSize;
     /**
      * Whether the field is required: shows a decorative asterisk next to the label, sets
      * `aria-required`, and turns on native constraint validation. `<input>`, `<select>`,
@@ -3737,7 +3856,8 @@ export declare interface FieldProps extends React_2.HTMLAttributes<HTMLDivElemen
     required?: boolean;
     /**
      * The id of the control the label points at, when the control has no `id` of its own
-     * (default: a generated id).
+     * (default: the `htmlFor` of a `Label` or `InfoLabel` element passed as `label`, else a
+     * generated id).
      */
     htmlFor?: string;
     /** Ref to the root `<div>`. */
@@ -3973,50 +4093,166 @@ export declare interface ImageProps extends React_2.ImgHTMLAttributes<HTMLImageE
 export declare type ImageShape = Shape;
 
 /**
- * A label with an info button that reveals additional information (a "toggletip").
+ * A button with the info glyph that shows `info` in a note next to it: text, links or other rich
+ * content, placed above the button with a beak (a toggletip).
+ *
+ * - **Naming.** The button is named "Information" (`aria-label`, which localizes it). Next to a
+ *   heading or other text, pass `aria-labelledby` with that text's id and the button's own `id`:
+ *   the button is then named "‹text› Information", so several info buttons on a page are told
+ *   apart. The note (`role="note"`) is labelled like the button: by the same `aria-labelledby`
+ *   ids, else by the button. The button has `aria-expanded`, and `aria-controls` while the note is
+ *   open, but no `aria-haspopup`: a note is none of the popup kinds it names.
+ * - **Opening.** A click pins the note open, and a click on a pinned note closes it. With
+ *   `openOnHover` (the default) a mouse pointer resting on the button opens it after 250 ms, and
+ *   it closes 250 ms after the pointer has left the button and the note (a pointer moving
+ *   diagonally from the button into the note keeps it open; touch and pen never hover); keyboard
+ *   focus on the button opens it too, while focus that comes from a pointer press waits for the
+ *   click. A hover close moves no focus, and a note that keyboard focus opened or keeps never
+ *   closes because of pointer movement. Opening never moves focus. Escape, a press outside and
+ *   focus moving outside the button and the note close it; Escape returns focus to the button when
+ *   it was in the note, and a dismissed note opens again on keyboard focus only once focus has
+ *   left both.
+ * - **Tab path.** The note is portaled, but it keeps its place right after the button in the
+ *   keyboard order: Tab from the open button enters the note's first element (a link in it), Tab
+ *   past its last element continues after the button, and Shift+Tab from its first element
+ *   returns to the button.
+ * - **One copy of `info`.** While the note is closed, `info` renders next to the button in an
+ *   element that is not displayed and describes the button (`aria-describedby`), so it is in the
+ *   server HTML and is read when the button takes focus. While the note is shown, `info` renders
+ *   only inside it, in an unnamed element that describes the button. `info` is never in the
+ *   document twice, so content with ids or effects is safe; it remounts each time the note opens
+ *   and closes, so state inside it starts over and its effects run again.
+ * - **Structure.** The button is the root element: `ref`, `className`, `style` and every other
+ *   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.
+ *
+ * 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
+ * keeps focus on the button and renders the note in a portal. Fluent's `popover` props and a
+ * controlled open state are not offered.
+ *
+ * @example
+ * <h2 id="billing">Billing</h2>
+ * <InfoButton
+ *   id="billing-info"
+ *   aria-labelledby="billing billing-info"
+ *   info={<>Invoices are sent monthly. <a href="/help/billing">Learn more</a></>}
+ * />
+ */
+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;
+    displayName: string;
+};
+
+/**
+ * InfoButton: `root` on the `<button>`; `info` on the `role="note"` popup that shows your `info`
+ * (Fluent's `info` slot, the popover surface); `beak` on its arrow.
+ */
+export declare const infoButtonClassNames: {
+    readonly root: "wave-info-button";
+    readonly info: "wave-info-button__info";
+    readonly beak: "wave-info-button__beak";
+};
+
+/** Properties for the InfoButton component. */
+export declare interface InfoButtonProps extends Omit<React_2.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
+    /**
+     * The information the note shows: text, links or other content. It also describes the button
+     * (`aria-describedby`), from the server HTML on. It is rendered once: next to the button, not
+     * displayed, while the note is closed, and inside the note while it is shown.
+     */
+    info: React_2.ReactNode;
+    /**
+     * Size of the glyph: 12, 16 or 20px. The button box stays 24×24px at every size, with negative
+     * margins above and below, so it never makes a row that centres its items (as InfoLabel does)
+     * taller.
+     * @default 'medium'
+     */
+    size?: CoreSize;
+    /**
+     * Open the note when a mouse pointer rests on the button (after 250 ms; it closes 250 ms after
+     * the pointer has left the button and the note, touch and pen never hover), and when the button
+     * receives keyboard focus. `false` opens it only on a click, and so on Enter and Space (Fluent's
+     * InfoButton opens on click only). A click always toggles the note: it pins a note that hover or
+     * keyboard focus opened, and closes a pinned one.
+     * @default true
+     */
+    openOnHover?: boolean;
+    /**
+     * Accessible name of the button, and of the note, which is labelled like the button. Localize it
+     * here. With `aria-labelledby` listing the id of your text and the button's own `id`, the name is
+     * your text followed by this one ("Billing Information").
+     * @default 'Information'
+     */
+    'aria-label'?: string;
+    /** Ref to the button. */
+    ref?: React_2.Ref<HTMLButtonElement>;
+}
+
+/**
+ * A label followed by a button that reveals more information about it (Fluent's InfoLabel): the
+ * label renders in a real `<label htmlFor>`, and the button shows `info` — text, links or other
+ * rich content — in a note next to it, rendered once whether the note is open or closed (see
+ * `InfoButton`, which owns that note and its opening, closing and Tab order).
  *
- * - The info button is a `<button type="button">` named `infoButtonLabel` ("Information"). The
- *   info text is rendered inline in a `hidden` element and linked with `aria-describedby`, so it is
- *   announced from the first render (also after server rendering), whether the popup is open or not.
- * - The visual popup is portaled only while open. It is `aria-hidden` because it duplicates the
- *   description, and it holds no focusable content, so focus stays on the button.
- * - Opens on keyboard focus (not on focus that comes from a pointer press), on hover after a
- *   short delay (the popup itself can be hovered) and on click. A click pins it: a click while it is
- *   open because of hover or focus keeps it open, a click on a pinned popup closes it.
- * - Closes on Escape, on a press outside, when focus moves elsewhere and — unless pinned — when
- *   the pointer leaves or the button loses focus (WCAG 1.4.13). A popup opened by hover that then
- *   receives keyboard focus stays open while the button keeps focus, even after the pointer leaves.
+ * - `children` is the label content; `label` is a deprecated alias (a warning fires once, and
+ *   `children` wins when both are given).
+ * - `htmlFor`, `required`, `size`, `weight` and `disabled` route to the `<label>`; `disabled` dims
+ *   only the label text, and the info button stays usable.
+ * - 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.
+ * - 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.
  *
  * @example
- * <InfoLabel label="Password" info="Use at least 8 characters." />
+ * <InfoLabel info="Use at least 8 characters.">Password</InfoLabel>
  */
 export declare const InfoLabel: {
-    ({ label, info, infoButtonLabel, className, ref, ...props }: InfoLabelProps): React_2.JSX.Element;
+    ({ children, label, info, infoButtonLabel, openOnHover, id, htmlFor, required, size, weight, disabled, className, ref, ...rest }: InfoLabelProps): React_2.JSX.Element;
     displayName: string;
 };
 
-/** InfoLabel: `root` on the outer span; `infoButton` on the info button; `info` on its popup. */
+/**
+ * InfoLabel: `root` on the outer span; `label` on its Label (which also carries Label's root);
+ * `infoButton` on its InfoButton (which also carries InfoButton's root); `info` on the popup, the
+ * InfoButton's note (which also carries InfoButton's `info`).
+ */
 export declare const infoLabelClassNames: {
     readonly root: "wave-info-label";
+    readonly label: "wave-info-label__label";
     readonly infoButton: "wave-info-label__info-button";
     readonly info: "wave-info-label__info";
 };
 
 /** Properties for the InfoLabel component. */
-export declare interface InfoLabelProps extends React_2.HTMLAttributes<HTMLSpanElement> {
-    /** Primary label text to display. */
-    label: string;
+export declare interface InfoLabelProps extends Omit<React_2.HTMLAttributes<HTMLSpanElement>, 'children'>, Pick<LabelProps, 'htmlFor' | 'required' | 'size' | 'weight' | 'disabled'> {
+    /** The label content (Fluent's `children`). */
+    children?: React_2.ReactNode;
     /**
-     * Additional information about the label. It describes the info button
-     * (`aria-describedby`, available from the first render) and is shown in a popup on hover,
-     * keyboard focus or click.
+     * The label content.
+     * @deprecated Use `children`.
      */
-    info: string;
+    label?: React_2.ReactNode;
+    /** The information the info button's note shows: text, links or other rich content. */
+    info: React_2.ReactNode;
     /**
-     * Accessible name of the info button. Localise it here.
+     * Accessible name of the info button: the second half of its name, after the label text
+     * ("Password Information"). Localize it here.
      * @default 'Information'
      */
     infoButtonLabel?: string;
+    /**
+     * Opens the note on a mouse hover, after a short delay, and on keyboard focus, next to a click
+     * (see `InfoButton`'s `openOnHover`, which this passes through unchanged).
+     * @default true
+     */
+    openOnHover?: boolean;
     /** Ref to the root `<span>`. */
     ref?: React_2.Ref<HTMLSpanElement>;
 }
@@ -4027,6 +4263,12 @@ export declare interface InfoLabelProps extends React_2.HTMLAttributes<HTMLSpanE
  * optional error message. Inside a `Field` it picks up the label, hint, error, `required` (native
  * attribute) and invalid state automatically.
  *
+ * `size` resolves from its own prop, then the surrounding `Field`'s `size`, then
+ * `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own prop, then
+ * `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as `data-size` and
+ * `data-appearance` on the element that draws the field (the `<input>`, or the wrapper with slot
+ * content).
+ *
  * Every prop reaches the `<input>`, except with slot content: then a bordered `<span>` wrapper
  * draws the field and receives `className`, `style` and `hidden` (`ref` stays on the input).
  *
@@ -4036,10 +4278,16 @@ export declare interface InfoLabelProps extends React_2.HTMLAttributes<HTMLSpanE
  * </Field>
  */
 export declare const Input: {
-    ({ error, errorMessageProps, contentBefore, contentAfter, onChange, onValueChange, className, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, required, ...props }: InputProps): React_2.JSX.Element;
+    ({ error, errorMessageProps, size: sizeProp, htmlSize, appearance: appearanceProp, contentBefore, contentAfter, onChange, onValueChange, className, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, required, ...props }: InputProps): React_2.JSX.Element;
     displayName: string;
 };
 
+/**
+ * Look of a text input or picker: `outline` (a full border), `underline` (a bottom stroke only),
+ * `filled-darker` or `filled-lighter` (a fill without a visible stroke).
+ */
+export declare type InputAppearance = 'outline' | 'underline' | 'filled-darker' | 'filled-lighter';
+
 /**
  * Input: `root` on the `<input>`, or, with `contentBefore` or `contentAfter` content, on the
  * wrapper that draws the field; `input` on the `<input>` (also when it is the root);
@@ -4054,6 +4302,14 @@ export declare const inputClassNames: {
     readonly errorMessage: "wave-input__error-message";
 };
 
+/** Default size and appearance of the text inputs and pickers in a subtree. */
+export declare interface InputDefaults {
+    /** Default `size` of Input, Textarea, Select, SearchBox, SpinButton and the pickers. */
+    size?: CoreSize;
+    /** Default `appearance` of the same controls. */
+    appearance?: InputAppearance;
+}
+
 /**
  * Props of the error message element that {@link Input}, `Select` and `Textarea` render after the
  * control for a string `error` (`id`, `className`, `role`, data attributes, …).
@@ -4066,7 +4322,7 @@ export declare interface InputErrorMessageProps extends React_2.HTMLAttributes<H
 }
 
 /** Properties for the Input component. */
-export declare interface InputProps extends React_2.InputHTMLAttributes<HTMLInputElement> {
+export declare interface InputProps extends Omit<React_2.InputHTMLAttributes<HTMLInputElement>, 'size'> {
     /**
      * Validation error.
      * - A non-empty string renders the message in a `role="alert"` element **after** the field (a
@@ -4084,6 +4340,24 @@ export declare interface InputProps extends React_2.InputHTMLAttributes<HTMLInpu
     error?: string | boolean;
     /** Props of the error message element (`id`, `className`, …) rendered for a string `error`. */
     errorMessageProps?: InputErrorMessageProps;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`.
+     *
+     * A number is the native `size` attribute (the visible width in characters), as in 0.8: it
+     * still renders, warns once in development and is removed in 1.0. Use `htmlSize` for it.
+     * A string of digits only (`size="20"` from untyped code) counts as that number. Any other value
+     * outside the three sizes renders as if `size` were not set.
+     */
+    size?: CoreSize | number;
+    /** The native `size` attribute: the visible width of the field in characters. */
+    htmlSize?: number;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /**
      * Slot rendered before the input text (e.g., an icon). With content in either slot, a bordered
      * `<span>` around the input draws the field: it receives `className`, `style` and `hidden`,
@@ -4104,7 +4378,7 @@ export declare interface InputProps extends React_2.InputHTMLAttributes<HTMLInpu
 
 /**
  * A text label for a form control (`htmlFor`), on the Fluent type ramp. The optional required
- * asterisk is decorative (`aria-hidden`). `Field` renders its own label; use `Label` for custom
+ * indicator is decorative (`aria-hidden`). `Field` renders its own label; use `Label` for custom
  * layouts.
  *
  * @example
@@ -4131,11 +4405,12 @@ export declare type LabelPosition = 'before' | 'after' | 'above' | 'below';
 
 /** Properties for the Label component. */
 export declare interface LabelProps extends React_2.LabelHTMLAttributes<HTMLLabelElement> {
-    /** Whether to show a required indicator asterisk (hidden from assistive technology; mark the
-     * control itself `required`).
+    /** Whether to show a required indicator. `true` shows a decorative asterisk; other content
+     * replaces it (for example a `(required)` text). Decorative (`aria-hidden`), so it must not be
+     * focusable; mark the control itself `required`.
      * @default false
      */
-    required?: boolean;
+    required?: boolean | React_2.ReactNode;
     /** Whether the label is visually dimmed.
      * @default false
      */
@@ -4143,7 +4418,7 @@ export declare interface LabelProps extends React_2.LabelHTMLAttributes<HTMLLabe
     /** Text size of the label: `small` = caption-1, `medium` = body-1, `large` = body-2.
      * @default 'medium'
      */
-    size?: Extract<Size, 'small' | 'medium' | 'large'>;
+    size?: CoreSize;
     /** Font weight of the label (the shared `TextWeight` vocabulary).
      * @default 'regular'
      */
@@ -6852,29 +7127,51 @@ export declare interface RadioItemProps extends Omit<React_2.ButtonHTMLAttribute
 /**
  * A star rating input (`role="radiogroup"` of `role="radio"` stars).
  *
- * - One tab stop (the chosen star, else the first). Keys choose relative to the current rating and
- *   move focus to the chosen star, as in 0.4: Right/Up one star more, Left/Down one fewer
- *   (Left/Right mirrored under `dir="rtl"`), Home/End the first/last star. From an empty rating,
- *   Right/Up/Home choose 1 star. Keys at the ends (and Left/Down while empty) emit nothing.
- * - The keyboard cannot clear a rating: Left/Down stop at 1 star (APG radio group; 0.4 went down
+ * - One tab stop (the radio of the chosen value, else the first). Keys choose relative to the
+ *   current rating and move focus to the chosen radio, as in 0.4: Right/Up one `step` more (a
+ *   star, or half a star), Left/Down one fewer (Left/Right mirrored under `dir="rtl"`), Home the
+ *   smallest value (`step`) and End `max`. From an empty rating, Right/Up/Home choose `step`.
+ *   Keys at the ends (and Left/Down while empty) emit nothing.
+ * - The keyboard cannot clear a rating: Left/Down stop at `step` (APG radio group; 0.4 went down
  *   to 0). Only a controlled `value={0}` (or a form reset while `defaultValue` is 0) clears it.
+ * - `step={0.5}` offers half stars. Each star stays one pointer target, which chooses by the
+ *   pointer's position (its half from the inline start, else its full value) and then focuses
+ *   the radio it chose; it holds two transparent radios ("2.5 stars", "3 stars") for the
+ *   keyboard and screen readers, and draws the focus ring of either. A controlled value between
+ *   two steps checks no radio and is drawn as the step below it; the keys move it to the next or
+ *   previous step.
  * - `onValueChange` (and the deprecated `onChange` alias) fire only when the rating changes, so
  *   choosing the current star again calls neither.
- * - Hovering previews a value; the preview never outlives the hover or a disabled state.
+ * - Hovering previews a value (half stars preview by the pointer's position); the preview never
+ *   outlives the hover or a disabled state.
+ * - `color` colors the filled stars (`marigold`, the default, `brand` or `neutral`; the root
+ *   carries `data-color`); `iconFilled` and `iconOutline` replace the star glyphs, as a pair.
  * - Inside a `Field` it is named by the Field label (instead of the default "Rating") and
- *   described by its hint and error. The stars are named "1 star", "2 stars", …; `labels`
- *   localizes these names.
+ *   described by its hint and error. The stars are named "1 star", "2 stars", … (and a half value
+ *   "2.5 stars"); `labels` localizes these names.
  * - With `name` (or `required`) it takes part in native forms; a form reset restores
  *   `defaultValue`.
+ * - The stars are generated from `max`. Children that render content replace them: one
+ *   `Rating.Item` per value from 1 to `max`, chosen, previewed, roved and named as the generated
+ *   stars are (`max` still sets the key range and the star names).
+ *
+ * Sub-component: `Rating.Item` (the same component as `RatingDisplay.Item`). React Server
+ * Components import its flat name `RatingItem` (dotted access needs a client file).
  */
 export declare const Rating: {
-    ({ value: valueProp, defaultValue, onValueChange, onChange, max, size, disabled, name, required, form, labels, className, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, onKeyDown, onFocus, onMouseLeave, ref, ...rest }: RatingProps): React_2.JSX.Element;
+    ({ value: valueProp, defaultValue, onValueChange, onChange, max, step: stepProp, size, color, iconFilled, iconOutline, disabled, name, required, form, labels, className, children, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, onKeyDown, onFocus, onMouseLeave, ref, ...rest }: RatingProps): React_2.JSX.Element;
     displayName: string;
+} & {
+    Item: {
+        ({ value, iconFilled, iconOutline, className, ref, ...rest }: RatingItemProps): React_2.JSX.Element;
+        displayName: string;
+    };
 };
 
 /**
- * Rating: `root` on the `role="radiogroup"` element; `star` on each `role="radio"` button; `icon`
- * on each star `<svg>`.
+ * Rating: `root` on the `role="radiogroup"` element; `star` on each star (a RatingItem: the
+ * `role="radio"` button, or with `step={0.5}` the span around its two radios); `icon` on each
+ * star glyph (the default `<svg>`, or the span of your `iconFilled`/`iconOutline`).
  */
 export declare const ratingClassNames: {
     readonly root: "wave-rating";
@@ -6882,6 +7179,9 @@ export declare const ratingClassNames: {
     readonly icon: "wave-rating__icon";
 };
 
+/** Color of a rating's filled stars. */
+export declare type RatingColor = 'neutral' | 'brand' | 'marigold';
+
 /**
  * A read-only star rating (`role="img"` named "Rating: <value> out of <max>"). A fractional value
  * is drawn with a partly filled star, so the stars and the name show the same value.
@@ -6891,15 +7191,29 @@ export declare const ratingClassNames: {
  *   stars (the root carries `data-compact`). Without them only the stars show.
  * - The value (up to one decimal) and the count are formatted with `locale`, in the text and in
  *   the name; `labels` localizes the name. Pass `locale` when rendering on the server.
+ * - `color` colors the filled stars (`marigold`, the default, `brand` or `neutral`; the root
+ *   carries `data-color`); `iconFilled` and `iconOutline` replace the star glyphs, as a pair.
+ * - The stars are generated from `max`. Children that render content replace them: one
+ *   `RatingDisplay.Item` per value from 1 to `max`. A `compact` display ignores them.
+ *
+ * Sub-component: `RatingDisplay.Item` (the same component as `Rating.Item`). React Server
+ * Components import its flat name `RatingDisplayItem`, or `RatingItem` (dotted access needs a
+ * client file).
  */
 export declare const RatingDisplay: {
-    ({ value, max, size, showValue, count, compact, locale, labels, className, ref, ...rest }: RatingDisplayProps): React_2.JSX.Element;
+    ({ value, max, size, color, iconFilled, iconOutline, showValue, count, compact, locale, labels, className, children, ref, ...rest }: RatingDisplayProps): React_2.JSX.Element;
     displayName: string;
+} & {
+    Item: {
+        ({ value, iconFilled, iconOutline, className, ref, ...rest }: RatingItemProps): React_2.JSX.Element;
+        displayName: string;
+    };
 };
 
 /**
- * RatingDisplay: `root` on the `role="img"` element; `star` on each star span; `icon` on the star
- * `<svg>` elements; `value` on the value span; `count` on the count span.
+ * RatingDisplay: `root` on the `role="img"` element; `star` on each star span (a RatingItem, and
+ * the one star of `compact`); `icon` on the star glyphs; `value` on the value span; `count` on the
+ * count span.
  */
 export declare const ratingDisplayClassNames: {
     readonly root: "wave-rating-display";
@@ -6909,6 +7223,15 @@ export declare const ratingDisplayClassNames: {
     readonly count: "wave-rating-display__count";
 };
 
+/**
+ * Flat name of `RatingDisplay.Item` for React Server Components (the same component as
+ * `RatingItem`).
+ */
+export declare const RatingDisplayItem: {
+    ({ value, iconFilled, iconOutline, className, ref, ...rest }: RatingItemProps): React_2.JSX.Element;
+    displayName: string;
+};
+
 /** Built-in texts of RatingDisplay, for localization. */
 export declare interface RatingDisplayLabels {
     /**
@@ -6924,7 +7247,7 @@ export declare interface RatingDisplayLabels {
 }
 
 /** Properties for the RatingDisplay (read-only) component. */
-export declare interface RatingDisplayProps extends React_2.HTMLAttributes<HTMLDivElement> {
+export declare interface RatingDisplayProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'color'> {
     /**
      * Rating value to display. A fraction is drawn as a partly filled star (`4.6` fills 60% of the
      * fifth star), so the stars show the value the accessible name reports.
@@ -6938,6 +7261,36 @@ export declare interface RatingDisplayProps extends React_2.HTMLAttributes<HTMLD
      * @default 'medium'
      */
     size?: Size;
+    /**
+     * Color of the filled stars: `marigold` (default), `brand` or `neutral`; unfilled stars keep a
+     * 3:1 outline. Fluent's default is `neutral`. A value outside the three (from untyped code)
+     * renders as `marigold`; the root carries `data-color` with the resolved value.
+     * @default 'marigold'
+     */
+    color?: RatingColor;
+    /**
+     * The glyph of a filled star. `iconFilled` and `iconOutline` are the glyphs of a filled and an
+     * unfilled star, as a pair; decorative. Fluent's RatingDisplay takes one `icon`; here a filled
+     * and an unfilled star must differ by shape, not by color alone.
+     *
+     * - Each glyph is sized by `size` (an SVG child fills the star) and takes the star's color
+     *   (paint it with `currentColor`). A partly filled star clips the filled glyph over the
+     *   unfilled one from the inline start, and the `compact` star is the filled glyph.
+     * - `null`, `undefined` and a value that renders nothing draw the default star. A value that
+     *   renders nothing, and a pair with only one of the two set, log a development warning.
+     * - A `<button>` or `Button` element (or a slot object whose `as` is one) is not nested in the
+     *   star: its children become the glyph (the default star when they render nothing), its props
+     *   are dropped, and a development warning says so (in place of the warning for a value that
+     *   renders nothing).
+     * - A `RatingDisplay.Item` that sets its own pair draws that one instead.
+     */
+    iconFilled?: Slot<'span'>;
+    /**
+     * The glyph of an unfilled star, as a pair with `iconFilled` (its rules apply); decorative.
+     * Fluent's RatingDisplay takes one `icon`; here a filled and an unfilled star must differ by
+     * shape, not by color alone.
+     */
+    iconOutline?: Slot<'span'>;
     /**
      * Shows the value as text after the stars, formatted with `locale` (up to one decimal).
      * @default false
@@ -6962,25 +7315,105 @@ export declare interface RatingDisplayProps extends React_2.HTMLAttributes<HTMLD
     locale?: string;
     /** Built-in texts, for localization. */
     labels?: RatingDisplayLabels;
+    /**
+     * Custom stars: one `RatingDisplay.Item` per value from 1 to `max`, in place of the generated
+     * stars (when the children render content). A `compact` display ignores them.
+     */
+    children?: React_2.ReactNode;
     /** Ref to the root element. */
     ref?: React_2.Ref<HTMLDivElement>;
 }
 
+/**
+ * One star of a `Rating` or a `RatingDisplay`, drawn from its root: pass one per value from 1 to
+ * `max` as the root's children, in place of the stars it generates.
+ *
+ * - In a `Rating` it is a `role="radio"` button named by the root's `labels.star` ("2 stars"),
+ *   chosen, previewed and roved as a generated star is. With the root's `step={0.5}` it is a star
+ *   `<span>`, one pointer target that chooses by the pointer's position, holding two transparent
+ *   radios: its half value, then its full value ("1.5 stars", "2 stars"). In a `RatingDisplay` it
+ *   is a star filled, partly filled or empty by the root's value.
+ * - It draws the root's `color` and glyph pair, or its own `iconFilled`/`iconOutline` pair when it
+ *   sets one.
+ * - `className`, `style`, `data-*`, the other attributes, the handlers and `ref` go to that star
+ *   element, the consumer's handlers first. The role, name, checked state and tab stop of its
+ *   radio (or radios) come from the root.
+ * - At `step={1}` the consumer's `onClick` and `onMouseEnter` compose onto the radio itself, so a
+ *   `preventDefault()` in either vetoes that star's own activation or hover preview. At
+ *   `step={0.5}` `onClick` and `onPointerMove` compose onto the star `<span>` instead: its two
+ *   radios run their own `onClick` first and choose their own value directly (Space, Enter, a
+ *   screen reader, or `radio.click()`), before the click bubbles to the span's composed handler,
+ *   so a `preventDefault()` there vetoes only a pointer-chosen value, never a keyboard or
+ *   assistive-technology activation.
+ * - Outside a `Rating` or `RatingDisplay` it throws in development.
+ */
+export declare const RatingItem: {
+    ({ value, iconFilled, iconOutline, className, ref, ...rest }: RatingItemProps): React_2.JSX.Element;
+    displayName: string;
+};
+
+/**
+ * RatingItem (also Rating.Item, RatingDisplay.Item and RatingDisplayItem): `root` on the star
+ * element (the `role="radio"` button in a Rating, the span around its two radios with
+ * `step={0.5}`, the star span in a RatingDisplay), which also carries its rating's `star` class;
+ * `icon` on each glyph it draws (the default `<svg>`, or the span of an `iconFilled`/`iconOutline`
+ * glyph), which also carries its rating's `icon` class.
+ */
+export declare const ratingItemClassNames: {
+    readonly root: "wave-rating-item";
+    readonly icon: "wave-rating-item__icon";
+};
+
+/** Properties for the RatingItem component (`Rating.Item`, `RatingDisplay.Item`). */
+export declare interface RatingItemProps extends Omit<React_2.HTMLAttributes<HTMLElement>, 'role' | 'aria-checked' | 'aria-label' | 'aria-labelledby' | 'tabIndex' | 'children' | 'onChange'> {
+    /**
+     * The star's full value, from 1 to the root's `max`: the rating it chooses (with the root's
+     * `step={0.5}` also its half, `value - 0.5`), or shows.
+     */
+    value: number;
+    /**
+     * The glyph of this star when filled, as a pair with `iconOutline`, following the rules of the
+     * root's `iconFilled` (a button is unwrapped, its children becoming the glyph, and a value or
+     * button children that render nothing draw the default star). An item that sets either glyph
+     * of the pair (`null` included) draws its own pair instead of its root's, and a glyph it leaves
+     * unset is the default star (a development warning says so).
+     */
+    iconFilled?: Slot<'span'>;
+    /**
+     * The glyph of this star when unfilled, as a pair with `iconFilled`, following the rules of the
+     * root's `iconOutline` (a button is unwrapped, its children becoming the glyph, and a value or
+     * button children that render nothing draw the default star). An item that sets either glyph
+     * of the pair (`null` included) draws its own pair instead of its root's, and a glyph it leaves
+     * unset is the default star (a development warning says so).
+     */
+    iconOutline?: Slot<'span'>;
+    /**
+     * Ref to the star element: the `role="radio"` button in a Rating, the star `<span>` in a Rating
+     * with `step={0.5}` and in a RatingDisplay.
+     */
+    ref?: React_2.Ref<HTMLElement>;
+}
+
 /**
  * The Rating's built-in star names, for localization. Each member is optional and falls back to
  * its English default.
  */
 export declare interface RatingLabels {
     /**
-     * Accessible name of the star that chooses `value` (1 to `max`).
+     * Accessible name of the radio that chooses `value`: a whole star (1 to `max`), and with
+     * `step={0.5}` a half value too ("2.5 stars").
      * @default (value) => value === 1 ? '1 star' : `${value} stars`
      */
     star?: (value: number, max: number) => string;
 }
 
 /** Properties for the Rating component. */
-export declare interface RatingProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
-    /** Controlled rating value (`0` = no rating). */
+export declare interface RatingProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue' | 'color'> {
+    /**
+     * Controlled rating value (`0` = no rating): a whole number of stars, or with `step={0.5}` a
+     * multiple of 0.5. A value between two steps (2.7) checks no radio, is drawn as the step below
+     * it (2.5) and holds the tab stop there; the keys move it to the next or previous step.
+     */
     value?: number;
     /** Initial rating for uncontrolled usage (also the value a form reset restores).
      * @default 0
@@ -6998,10 +7431,50 @@ export declare interface RatingProps extends Omit<React_2.HTMLAttributes<HTMLDiv
      * @default 5
      */
     max?: number;
+    /**
+     * The grain of the rating: `1` (whole stars) or `0.5` (half stars). With `0.5`, each star stays
+     * one pointer target of at least 24×24px (a larger `size` keeps a larger one): the half is
+     * chosen by the pointer's position over it (the half at the inline start, which mirrors under
+     * `dir="rtl"`), and two transparent radios per star, the half value then the full value, serve
+     * the keyboard and screen readers. The keys then move by half a star. A value other than `0.5`
+     * (from untyped code) counts as `1`. RatingDisplay has no `step`: it draws any fraction.
+     * @default 1
+     */
+    step?: 0.5 | 1;
     /** Size of the star icons. Every size keeps a target of at least 24×24px.
      * @default 'medium'
      */
     size?: Size;
+    /**
+     * Color of the filled stars: `marigold` (default), `brand` or `neutral`; unfilled stars keep a
+     * 3:1 outline. Fluent's default is `neutral`. A value outside the three (from untyped code)
+     * renders as `marigold`; the root carries `data-color` with the resolved value.
+     * @default 'marigold'
+     */
+    color?: RatingColor;
+    /**
+     * The glyph of a filled star. `iconFilled` and `iconOutline` are the glyphs of a filled and an
+     * unfilled star, as a pair; decorative. Fluent's RatingDisplay takes one `icon`; here a filled
+     * and an unfilled star must differ by shape, not by color alone.
+     *
+     * - Each glyph is sized by `size` (an SVG child fills the star) and takes the star's color
+     *   (paint it with `currentColor`). A half-filled star (`step={0.5}`) clips the filled glyph
+     *   over the unfilled one from the inline start.
+     * - `null`, `undefined` and a value that renders nothing draw the default star. A value that
+     *   renders nothing, and a pair with only one of the two set, log a development warning.
+     * - A `<button>` or `Button` element (or a slot object whose `as` is one) is not nested in the
+     *   star: its children become the glyph (the default star when they render nothing), its props
+     *   are dropped, and a development warning says so (in place of the warning for a value that
+     *   renders nothing).
+     * - A `Rating.Item` that sets its own pair draws that one instead.
+     */
+    iconFilled?: Slot<'span'>;
+    /**
+     * The glyph of an unfilled star, as a pair with `iconFilled` (its rules apply); decorative.
+     * Fluent's RatingDisplay takes one `icon`; here a filled and an unfilled star must differ by
+     * shape, not by color alone.
+     */
+    iconOutline?: Slot<'span'>;
     /** Whether the rating is disabled and non-interactive.
      * @default false
      */
@@ -7016,10 +7489,16 @@ export declare interface RatingProps extends Omit<React_2.HTMLAttributes<HTMLDiv
     /** Id of the form the rating belongs to, when it is rendered outside that form. */
     form?: string;
     /**
-     * Names of the stars ("1 star", "2 stars", …), for localization. The group's own name is
-     * `aria-label` (default "Rating"). Unset members keep their English defaults.
+     * Names of the stars ("1 star", "2 stars", …, and "2.5 stars" for a half value), for
+     * localization. The group's own name is `aria-label` (default "Rating"). Unset members keep
+     * their English defaults.
      */
     labels?: RatingLabels;
+    /**
+     * Custom stars: one `Rating.Item` per value from 1 to `max`, in place of the generated stars
+     * (when the children render content). `max` still sets the key range and the star names.
+     */
+    children?: React_2.ReactNode;
     /** Ref to the `role="radiogroup"` element. */
     ref?: React_2.Ref<HTMLDivElement>;
 }
@@ -7110,12 +7589,16 @@ export declare interface RovingContainerProps {
  *   the label, hint, error and required state automatically.
  * - **Forms**: with `name` the text is submitted with the form; a form reset restores
  *   `defaultValue`.
+ * - **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s
+ *   `size`, then `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own
+ *   prop, then `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as
+ *   `data-size` and `data-appearance` on the root `<div>`.
  *
  * @example
  * <SearchBox aria-label="Search files" value={query} onValueChange={setQuery} />
  */
 export declare const SearchBox: {
-    ({ value: controlledValue, defaultValue, onValueChange, onChange, onClear, placeholder, disabled, contentBefore, contentAfter, dismiss, className, ref, controlRef, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, "aria-details": ariaDetails, required, name, form, readOnly, autoComplete, autoFocus, autoCapitalize, autoCorrect, inputMode, enterKeyHint, spellCheck, maxLength, minLength, pattern, tabIndex, onFocus, onBlur, onKeyDown, onKeyUp, onMouseDown, hidden, ...rest }: SearchBoxProps): React_2.JSX.Element;
+    ({ value: controlledValue, defaultValue, onValueChange, onChange, onClear, placeholder, disabled, size: sizeProp, appearance: appearanceProp, contentBefore, contentAfter, dismiss, className, ref, controlRef, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, "aria-details": ariaDetails, required, name, form, readOnly, autoComplete, autoFocus, autoCapitalize, autoCorrect, inputMode, enterKeyHint, spellCheck, maxLength, minLength, pattern, tabIndex, onFocus, onBlur, onKeyDown, onKeyUp, onMouseDown, hidden, ...rest }: SearchBoxProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -7166,6 +7649,17 @@ export declare interface SearchBoxProps extends Omit<React_2.HTMLAttributes<HTML
     placeholder?: string;
     /** Whether the search box is disabled and non-interactive. */
     disabled?: boolean;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`.
+     */
+    size?: CoreSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /**
      * Slot rendered before the text (replaces the default search icon). It takes the room it needs;
      * the text starts after it. A value that renders nothing (`null`, `false`, `''`, an empty array
@@ -7218,6 +7712,11 @@ export declare interface SearchBoxProps extends Omit<React_2.HTMLAttributes<HTML
  * `Field` label, `aria-label` or `aria-labelledby`. Inside a `Field` it picks up the label, hint,
  * error, `required` (native attribute) and invalid state automatically.
  *
+ * `size` resolves from its own prop, then the surrounding `Field`'s `size`, then
+ * `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own prop, then
+ * `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as `data-size` and
+ * `data-appearance` on the `<select>`.
+ *
  * @example
  * <Field label="Country" required>
  *   <Select defaultValue="">
@@ -7227,7 +7726,7 @@ export declare interface SearchBoxProps extends Omit<React_2.HTMLAttributes<HTML
  * </Field>
  */
 export declare const Select: {
-    ({ error, errorMessageProps, className, children, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, required, ...props }: SelectProps): React_2.JSX.Element;
+    ({ error, errorMessageProps, size: sizeProp, htmlSize, appearance: appearanceProp, className, children, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, required, ...props }: SelectProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -7242,7 +7741,7 @@ declare type SelectionMode_2 = 'single' | 'multiple';
 export { SelectionMode_2 as SelectionMode }
 
 /** Properties for the Select component. */
-export declare interface SelectProps extends React_2.SelectHTMLAttributes<HTMLSelectElement> {
+export declare interface SelectProps extends Omit<React_2.SelectHTMLAttributes<HTMLSelectElement>, 'size'> {
     /**
      * Validation error.
      * - A non-empty string renders the message in a `role="alert"` element **after** the select
@@ -7259,6 +7758,24 @@ export declare interface SelectProps extends React_2.SelectHTMLAttributes<HTMLSe
     error?: string | boolean;
     /** Props of the error message element (`id`, `className`, …) rendered for a string `error`. */
     errorMessageProps?: InputErrorMessageProps;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`.
+     *
+     * A number is the native `size` attribute (the number of visible rows), as in 0.8: it still
+     * renders, warns once in development and is removed in 1.0. Use `htmlSize` for it.
+     * A string of digits only (`size="20"` from untyped code) counts as that number. Any other value
+     * outside the three sizes renders as if `size` were not set.
+     */
+    size?: CoreSize | number;
+    /** The native `size` attribute: the number of visible rows. */
+    htmlSize?: number;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /** Ref to the `<select>` element. */
     ref?: React_2.Ref<HTMLSelectElement>;
 }
@@ -7357,11 +7874,14 @@ export declare interface SkeletonProps extends React_2.HTMLAttributes<HTMLDivEle
  * The fill follows the value through the `--wave-slider-progress` variable on the input (also in
  * the server HTML), including the browser's snapping to `step` and a form reset.
  *
+ * `size` (`small`, `medium`) sets the thumb and rail dimensions; the input carries `data-size`.
+ * Slider does not read a surrounding `Field`'s size or a `WaveProvider`'s input defaults.
+ *
  * @example
  * <Slider label="Volume" min={0} max={100} value={volume} onValueChange={setVolume} />
  */
 export declare const Slider: {
-    ({ className, style, label, value, defaultValue, min, max, step, form, onChange, onValueChange, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, required, ...props }: SliderProps): React_2.JSX.Element;
+    ({ className, style, label, value, defaultValue, min, max, step, size: sizeProp, form, onChange, onValueChange, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, required, ...props }: SliderProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -7371,7 +7891,7 @@ export declare const sliderClassNames: {
 };
 
 /** Properties for the Slider component. */
-export declare interface SliderProps extends Omit<React_2.InputHTMLAttributes<HTMLInputElement>, 'type'> {
+export declare interface SliderProps extends Omit<React_2.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
     /** Controlled slider value. */
     value?: number;
     /** Initial value for uncontrolled usage. */
@@ -7391,10 +7911,25 @@ export declare interface SliderProps extends Omit<React_2.InputHTMLAttributes<HT
      * `Field`, leave it out so the Field's label names the slider.
      */
     label?: string;
+    /**
+     * Size of the thumb and rail: the 0.7 20px thumb on a 4px rail, or a small 16px thumb on a 2px
+     * rail in a 24px-tall input. Unlike the text controls and pickers, Slider does not read a
+     * surrounding `Field`'s size or a `WaveProvider`'s input defaults: this prop is the only source
+     * of its size.
+     *
+     * `SliderProps` inherited the native HTML `size` attribute, which a range input ignores anyway.
+     * A number is deprecated: it renders nothing (not even the native attribute), is reported once
+     * in development, and is a type error from 1.0.
+     * @default 'medium'
+     */
+    size?: SliderSize | number;
     /** Ref to the `<input type="range">` element. */
     ref?: React_2.Ref<HTMLInputElement>;
 }
 
+/** Size of the thumb and rail: a small 16px thumb on a 2px rail, or the 0.7 20px thumb on a 4px rail. */
+export declare type SliderSize = Extract<Size, 'small' | 'medium'>;
+
 /**
  * Slot definition — a customisable sub-element of a component. Accepts:
  *
@@ -7442,14 +7977,26 @@ export declare type SortDirection = 'ascending' | 'descending';
  * A numeric input with decrement/increment buttons (APG spinbutton pattern).
  *
  * - **Keyboard** on the input: ArrowUp/ArrowDown step by `step`, PageUp/PageDown by `largeStep`
- *   (default ten steps), Home/End jump to `min`/`max` when they are finite. The −/+ buttons are
- *   not tab stops and never take focus, so focus stays on the spinbutton and screen readers
- *   announce the new value.
+ *   (default ten steps), Home/End jump to `min`/`max` when they are finite (Shift+Home and
+ *   Shift+End keep their native text-selection instead). The −/+ buttons are not tab stops and
+ *   never take focus, so focus stays on the spinbutton and screen readers announce the new
+ *   value.
+ * - **Pointer** on the −/+ buttons (mouse, touch or pen): a short press steps once, on release
+ *   (its click), never on the press alone, so a finger that starts a scroll on a button changes
+ *   nothing. Holding a button repeats the step: the first after 300ms, then faster, every 80ms
+ *   after about a second (Fluent's timing). A hold stops when the button is released, the
+ *   pointer leaves it or the press turns into a scroll, at the bound, when the window loses
+ *   focus, and when the spin button becomes disabled or read-only. Only the primary button of a
+ *   primary pointer holds: a second finger, a secondary button or a Ctrl+press with a mouse (the
+ *   secondary click on macOS) neither starts a hold nor ends one. A click without a press (a
+ *   screen reader, `element.click()`) steps once. The buttons open no context menu (a long press
+ *   on touch would), show no iOS callout, and allow no text selection or double-tap zoom.
  * - **Typing** edits a draft: the value is parsed, clamped and committed on blur or Enter
  *   (Escape reverts). Text that is not a number is flagged with `aria-invalid` and reverted on
  *   blur. Steps (keys and buttons) start from the typed number, and the −/+ buttons are disabled
  *   when that number is at `min`/`max`. Steps are rounded to the precision of `step` and of the
- *   value, so `0.1 + 0.2` is `0.3`.
+ *   value, so `0.1 + 0.2` is `0.3`; `precision` rounds every committed value, typed or stepped,
+ *   to a fixed number of decimals instead, without padding it (pad with `displayValue`).
  * - **Routing**: `id`, ARIA, native input attributes and focus/keyboard handlers go to the
  *   `<input role="spinbutton">`; `className`, `style`, `data-*`, other handlers and `ref` stay on
  *   the root (`controlRef` reaches the input). Inside a `Field` it picks up the label, hint, error
@@ -7457,16 +8004,119 @@ export declare type SortDirection = 'ascending' | 'descending';
  *   or use a label (development warning otherwise).
  * - **Forms**: with `name` the committed value is submitted; `required` makes the input natively
  *   required; a form reset restores `defaultValue`.
+ * - **Empty values**: `allowEmpty` lets the value become `null` (an empty field). Clearing the
+ *   text and committing it (blur or Enter) sets the value to `null`, uncontrolled too; stepping
+ *   up or down from an empty value starts at 0 and clamps to the nearest bound. `required` (its
+ *   own, or a required Field's) still blocks submitting an empty value: the check runs on the
+ *   `HiddenInput` that carries the committed value, not on the shown text, so it keeps working
+ *   even when the shown text is not empty.
+ * - **Display text**: `displayValue` shows formatted text (`$1.00`) for the value while the field
+ *   is not being edited, and as its `aria-valuetext`; while the field has focus and can be
+ *   edited it shows the plain number instead, so typing still edits the number (a consumer
+ *   `aria-valuetext` always wins). It applies only while `value` is controlled: an uncontrolled
+ *   spin button ignores it and warns once in development.
+ * - **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s
+ *   `size`, then `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own
+ *   prop, then `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as
+ *   `data-size` and `data-appearance` on the root. SpinButton takes every size the other fields
+ *   do, and unlike 0.7 its root is now exactly as tall as theirs, with its step buttons and
+ *   input taking up that height; sizing the root wider widens the input instead of leaving
+ *   empty space inside it. The step buttons keep a 1px separator from the input only in
+ *   `outline`; the other appearances have none.
  * - The −/+ buttons are named "Decrement"/"Increment"; `labels` localizes the names.
  *
  * @example
  * <SpinButton aria-label="Quantity" min={1} max={10} value={qty} onValueChange={setQty} />
  */
 export declare const SpinButton: {
-    ({ value: valueProp, defaultValue, onValueChange, onChange, min, max, step, largeStep, disabled, name, form, labels, className, hidden, ref, controlRef, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, "aria-details": ariaDetails, "aria-valuetext": ariaValueText, required, readOnly, placeholder, maxLength, spellCheck, autoComplete, autoFocus, inputMode, enterKeyHint, tabIndex, onFocus, onBlur, onKeyDown, onKeyUp, ...rest }: SpinButtonProps): React_2.JSX.Element;
+    (props: SpinButtonProps | SpinButtonAllowEmptyProps): React_2.ReactNode;
     displayName: string;
 };
 
+/** SpinButton props with `allowEmpty`: the value may be `null` (an empty field). */
+export declare interface SpinButtonAllowEmptyProps extends SpinButtonBaseProps {
+    /** The value may be `null`: clearing the text and committing it empties the field. */
+    allowEmpty: true;
+    /** Controlled value; `null` is an empty field. */
+    value?: number | null;
+    /** Initial value for uncontrolled usage (also what a form reset restores).
+     * @default null
+     */
+    defaultValue?: number | null;
+    /** Called with the new value when it changes, `null` when the field is emptied. */
+    onValueChange?: (value: number | null) => void;
+    /** Not available with `allowEmpty` (the deprecated alias of `onValueChange`). */
+    onChange?: never;
+}
+
+/**
+ * Properties every SpinButton mode shares (every member of {@link SpinButtonProps} and
+ * {@link SpinButtonAllowEmptyProps} except the value members, which differ between them).
+ */
+export declare interface SpinButtonBaseProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue' | keyof SpinButtonInputProps>, SpinButtonInputProps {
+    /** Minimum allowed value.
+     * @default -Infinity
+     */
+    min?: number;
+    /** Maximum allowed value.
+     * @default Infinity
+     */
+    max?: number;
+    /** Step of the increment/decrement buttons and of ArrowUp/ArrowDown.
+     * @default 1
+     */
+    step?: number;
+    /** Step of PageUp/PageDown.
+     * @default step * 10
+     */
+    largeStep?: number;
+    /**
+     * Decimals every committed value is rounded to, typed or stepped (0–20); the number is not
+     * padded (use `displayValue` for `1.00`). Default: steps round to the decimals of `step` and
+     * the value, typed values are kept as typed.
+     */
+    precision?: number;
+    /** Whether the spin button is disabled and non-interactive. */
+    disabled?: boolean;
+    /** Form field name. With a name, the committed value is submitted with the form. */
+    name?: string;
+    /** Id of the form the spin button belongs to, when it is rendered outside that form. */
+    form?: string;
+    /**
+     * Names of the −/+ step buttons (not tab stops, but in the accessibility tree), for
+     * localization. Unset members keep their English defaults.
+     */
+    labels?: SpinButtonLabels;
+    /**
+     * Text shown for the value while the field is not being edited, and its `aria-valuetext` (a
+     * `$1.00` for 1). While the field has focus and can be edited it shows the plain number, so
+     * typing edits the number. Applies only while `value` is controlled (update it with the
+     * value); Fluent's `displayValue`.
+     */
+    displayValue?: string;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`.
+     *
+     * SpinButton is 24, 32 or 40px tall like every field; its buttons are square-ish, 24, 32 or
+     * 40px wide.
+     */
+    size?: CoreSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a
+     * visible label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     *
+     * The step buttons keep a 1px separator from the input only in `outline`; the other
+     * appearances have none.
+     */
+    appearance?: InputAppearance;
+    /** Ref to the root `<div>`. */
+    ref?: React_2.Ref<HTMLDivElement>;
+    /** Ref to the `<input role="spinbutton">` (the focusable control). */
+    controlRef?: React_2.Ref<HTMLInputElement>;
+}
+
 /**
  * SpinButton: `root` on the outer element; `decrementButton` on the − button; `input` on the
  * `role="spinbutton"` input; `incrementButton` on the + button.
@@ -7499,8 +8149,14 @@ export declare interface SpinButtonLabels {
     decrement?: string;
 }
 
-/** Properties for the SpinButton component. */
-export declare interface SpinButtonProps extends Omit<React_2.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue' | keyof SpinButtonInputProps>, SpinButtonInputProps {
+/** SpinButton props with a number value (the 0.7 shape). */
+export declare interface SpinButtonProps extends SpinButtonBaseProps {
+    /**
+     * Allows an empty value (`null`). Takes the literal `true`: a `boolean` variable fits neither
+     * member of the props, so branch the JSX or spread `{ allowEmpty: true, value }`.
+     * @default false
+     */
+    allowEmpty?: false;
     /** Controlled numeric value. */
     value?: number;
     /** Initial value for uncontrolled usage (also what a form reset restores).
@@ -7518,37 +8174,6 @@ export declare interface SpinButtonProps extends Omit<React_2.HTMLAttributes<HTM
      * @deprecated Use `onValueChange`. (`onChange` is reserved for native change events.)
      */
     onChange?: (value: number) => void;
-    /** Minimum allowed value.
-     * @default -Infinity
-     */
-    min?: number;
-    /** Maximum allowed value.
-     * @default Infinity
-     */
-    max?: number;
-    /** Step of the increment/decrement buttons and of ArrowUp/ArrowDown.
-     * @default 1
-     */
-    step?: number;
-    /** Step of PageUp/PageDown.
-     * @default step * 10
-     */
-    largeStep?: number;
-    /** Whether the spin button is disabled and non-interactive. */
-    disabled?: boolean;
-    /** Form field name. With a name, the committed value is submitted with the form. */
-    name?: string;
-    /** Id of the form the spin button belongs to, when it is rendered outside that form. */
-    form?: string;
-    /**
-     * Names of the −/+ step buttons (not tab stops, but in the accessibility tree), for
-     * localization. Unset members keep their English defaults.
-     */
-    labels?: SpinButtonLabels;
-    /** Ref to the root `<div>`. */
-    ref?: React_2.Ref<HTMLDivElement>;
-    /** Ref to the `<input role="spinbutton">` (the focusable control). */
-    controlRef?: React_2.Ref<HTMLInputElement>;
 }
 
 /**
@@ -8069,9 +8694,11 @@ export declare type SwatchPickerSize = Extract<Size, 'small' | 'medium' | 'large
  *   `labelPosition` (the root carries `data-label-position`). Beside the label, the switch lines
  *   up with the first line of a label that wraps or has a second line. `children` are not
  *   rendered (a development warning says so).
+ * - `size` (`small`, `medium`) sets the track and thumb dimensions; the root carries `data-size`.
+ *   Switch does not read a surrounding `Field`'s size or a `WaveProvider`'s input defaults.
  */
 export declare const Switch: {
-    ({ checked: checkedProp, defaultChecked, onCheckedChange, onChange, disabled, disabledFocusable, label, labelPosition, name, value, required, form, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, "aria-details": ariaDetails, "aria-disabled": ariaDisabled, autoFocus, tabIndex, onClick, onFocus, onBlur, onKeyDown, onKeyUp, controlRef, className, children, ref, ...rest }: SwitchProps): React_2.JSX.Element;
+    ({ checked: checkedProp, defaultChecked, onCheckedChange, onChange, disabled, disabledFocusable, label, labelPosition, size, name, value, required, form, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, "aria-details": ariaDetails, "aria-disabled": ariaDisabled, autoFocus, tabIndex, onClick, onFocus, onBlur, onKeyDown, onKeyUp, controlRef, className, children, ref, ...rest }: SwitchProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -8134,6 +8761,14 @@ export declare interface SwitchProps extends Omit<React_2.HTMLAttributes<HTMLLab
      * @default 'after'
      */
     labelPosition?: SwitchLabelPosition;
+    /**
+     * Size of the track: the 0.7 40x20 track with a 14px thumb, or a small 32x16 track with a 10px
+     * thumb and a 24px-tall pointer target. Unlike the text controls and pickers, Switch does not
+     * read a surrounding Field's size or a WaveProvider's input defaults: this prop is the only
+     * source of its size.
+     * @default 'medium'
+     */
+    size?: SwitchSize;
     /**
      * Form field name. With a name, the switch takes part in native form submission: it submits
      * `name=value` while on.
@@ -8163,6 +8798,9 @@ export declare interface SwitchProps extends Omit<React_2.HTMLAttributes<HTMLLab
     ref?: React_2.Ref<HTMLLabelElement>;
 }
 
+/** Size of the track: a 32x16 track with a 10px thumb, or the 0.7 40x20 track with a 14px thumb. */
+export declare type SwitchSize = Extract<Size, 'small' | 'medium'>;
+
 /**
  * A non-interactive data table with an optional striped body. The table sits in a horizontally
  * scrollable wrapper; while it scrolls, the wrapper is a focusable region (named by
@@ -8634,6 +9272,12 @@ export declare interface TagOwnProps {
  * Selected values without a matching option are shown with their raw value. The open list renders
  * only in the browser: an open list (`defaultOpen`, `open`) is closed in the server HTML and opens
  * once the picker has hydrated.
+ *
+ * **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s
+ * `size`, then `WaveProvider inputDefaults.size`, else `'medium'` (a Field or provider `small`
+ * gives `'medium'` too, since TagPicker has no `small`); `appearance` from its own prop, then
+ * `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as `data-size` and
+ * `data-appearance` on the root `<div>`. The option list keeps its size.
  */
 export declare const TagPicker: {
     (props: TagPickerProps): React_2.JSX.Element;
@@ -8746,6 +9390,19 @@ export declare interface TagPickerProps extends Omit<React_2.HTMLAttributes<HTML
      * @default false
      */
     disabled?: boolean;
+    /**
+     * Size of the tags and the field: `medium` (the 0.7 look), `large` or `extra-large` (Fluent's
+     * union; TagPicker has no `small`). Default: the surrounding Field's `size`, else `WaveProvider
+     * inputDefaults.size`, else `'medium'`; a Field or provider `small` gives `'medium'` too. The
+     * option list keeps its size.
+     */
+    size?: TagPickerSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /** Name of the values in form submissions (one hidden input per value). */
     name?: string;
     /** Id of the form the values belong to, when the TagPicker is outside it. */
@@ -8793,6 +9450,9 @@ export declare interface TagPickerProps extends Omit<React_2.HTMLAttributes<HTML
     ref?: React_2.Ref<HTMLDivElement>;
 }
 
+/** Sizes of TagPicker (Fluent's): medium (the 0.7 look), large and extra-large. */
+export declare type TagPickerSize = Extract<Size, 'medium' | 'large' | 'extra-large'>;
+
 /**
  * Props of {@link Tag} rendered as `C` (default `'span'`). `TagProps` without a type argument is
  * the 0.4 name.
@@ -8975,13 +9635,18 @@ export { Text_2 as Text }
  * bottom border while focused). Inside a `Field` it picks up the label, hint, error, `required`
  * (native attribute) and invalid state automatically.
  *
+ * `size` resolves from its own prop, then the surrounding `Field`'s `size`, then
+ * `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own prop, then
+ * `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as `data-size` and
+ * `data-appearance` on the textarea element.
+ *
  * @example
  * <Field label="Description" hint="Markdown is supported">
  *   <Textarea rows={4} />
  * </Field>
  */
 export declare const Textarea: {
-    ({ error, errorMessageProps, className, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, required, ...props }: TextareaProps): React_2.JSX.Element;
+    ({ error, errorMessageProps, size: sizeProp, appearance: appearanceProp, className, ref, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-errormessage": ariaErrorMessage, required, ...props }: TextareaProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -9009,6 +9674,18 @@ export declare interface TextareaProps extends React_2.TextareaHTMLAttributes<HT
     error?: string | boolean;
     /** Props of the error message element (`id`, `className`, …) rendered for a string `error`. */
     errorMessageProps?: InputErrorMessageProps;
+    /**
+     * Size of the field, a minimum height with its type ramp: `small` (64px, Caption 1 text),
+     * `medium` (80px, Body 1) or `large` (96px, Body 2). Default: the surrounding Field's `size`,
+     * else `WaveProvider inputDefaults.size`, else `'medium'`.
+     */
+    size?: CoreSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /** Ref to the `<textarea>` element. */
     ref?: React_2.Ref<HTMLTextAreaElement>;
 }
@@ -9076,6 +9753,10 @@ export declare type TextWeight = 'regular' | 'semibold' | 'bold';
  *   picker instead of to the clear button that disappears.
  * - The value is `HH:mm` (24-hour) whatever the display `format`; values off the `step` grid or
  *   outside the bounds are still displayed in `format`.
+ * - **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s
+ *   `size`, then `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own
+ *   prop, then `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as
+ *   `data-size` and `data-appearance` on the root `<div>`. The time list keeps its size.
  * - The input (`controlRef`) 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
@@ -9204,6 +9885,18 @@ export declare interface TimePickerProps extends Omit<React_2.HTMLAttributes<HTM
      * @default false
      */
     disabled?: boolean;
+    /**
+     * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the
+     * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`. The time
+     * list keeps its size.
+     */
+    size?: CoreSize;
+    /**
+     * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),
+     * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible
+     * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.
+     */
+    appearance?: InputAppearance;
     /**
      * Makes the input read-only: the list does not open and the value cannot change. Turning it (or
      * `disabled`) on while the user is typing drops the typed text.
@@ -11015,6 +11708,8 @@ export declare interface WaveContextValue {
     themeClassName: string;
     /** Element portaled overlays render into; `null` means `document.body`. */
     portalContainer: HTMLElement | null;
+    /** The merged input defaults of the providers above (`{}` outside a provider). */
+    inputDefaults: InputDefaults;
     /** `false` when no {@link WaveProvider} is above the caller (the defaults are returned). */
     hasProvider: boolean;
 }
@@ -11038,9 +11733,12 @@ export declare type WaveDir = 'ltr' | 'rtl';
  *   enclosing provider, so `<WaveProvider theme="light">` inside an RTL app is a light panel that
  *   stays right-to-left and keeps the app's portal container. At the top level the defaults are
  *   `'light'`, `'ltr'` and `document.body`.
+ * - `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`.
  */
 export declare const WaveProvider: {
-    ({ theme: themeProp, dir: dirProp, portalContainer: portalContainerProp, children, className, ref, ...rest }: WaveProviderProps): React_2.JSX.Element;
+    ({ theme: themeProp, dir: dirProp, portalContainer: portalContainerProp, inputDefaults: inputDefaultsProp, children, className, ref, ...rest }: WaveProviderProps): React_2.JSX.Element;
     displayName: string;
 };
 
@@ -11068,6 +11766,14 @@ export declare interface WaveProviderProps extends React_2.HTMLAttributes<HTMLDi
      * @default the enclosing WaveProvider's container, else document.body
      */
     portalContainer?: HTMLElement | null;
+    /**
+     * Default `size` and `appearance` of the text inputs and pickers in the subtree (Input,
+     * Textarea, Select, SearchBox, SpinButton, Combobox, Dropdown, DatePicker, TimePicker,
+     * TagPicker). Their own props and a Field's `size` win. A nested provider merges its keys over
+     * the enclosing provider's; an omitted key is inherited.
+     * @default the enclosing WaveProvider's defaults, else none (`medium`, `outline`)
+     */
+    inputDefaults?: InputDefaults;
     /** Content rendered inside the themed container. */
     children: React_2.ReactNode;
     /** Ref to the themed root `<div>`. */