@acronis-platform/ui-react 0.62.0 → 2.0.0

package/dist/src/components/ui/date-range-picker/date-range-picker.d.ts

@@ -1,10 +1,11 @@
+import { DayPickerLocale, Matcher } from 'react-day-picker';
 import { DateRange } from './date-range-picker-utils';
 import * as React from 'react';
 export type { DateRange };
 export interface DateRangePickerProps {
     /** The applied range (controlled). Omit for uncontrolled use with `defaultValue`. */
     value?: DateRange;
-    /** The initial applied range (uncontrolled) and the target of "Reset to default". */
+    /** The initial applied range (uncontrolled). */
     defaultValue?: DateRange;
     /** Called with the committed range when Apply is pressed. */
     onValueChange?: (range: DateRange) => void;
@@ -20,8 +21,51 @@ export interface DateRangePickerProps {
     disabled?: boolean;
     /** Marks the trigger required. */
     required?: boolean;
-    /** Extra classes merged onto the trigger. */
+    /** Extra classes merged onto the trigger's field wrapper (label + box + message). */
     className?: string;
+    /** Days that cannot be selected in the calendar. */
+    disabledDays?: Matcher | Matcher[];
+    /** Minimum number of nights between the range's start and end (`differenceInCalendarDays(to, from)`) — e.g. `min={7}` requires at least 8 selectable days. */
+    min?: number;
+    /** Maximum number of nights between the range's start and end (`differenceInCalendarDays(to, from)`) — e.g. `max={31}` admits up to 32 selectable days. */
+    max?: number;
+    /** Render the leading/trailing days of the adjacent months. */
+    showOutsideDays?: boolean;
+    /**
+     * First day of the week (0 = Sunday). Defaults to `locale`'s own week
+     * start, falling back to Monday when no `locale` is given.
+     */
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    /**
+     * First year offered by the year dropdown and the earliest month the grid
+     * can navigate to. Defaults to 50 years back.
+     */
+    fromYear?: number;
+    /**
+     * Last year offered by the year dropdown and the latest month the grid can
+     * navigate to. Defaults to 50 years ahead.
+     */
+    toYear?: number;
+    /**
+     * Localizes weekday names, the calendar's default day-cell/caption
+     * accessible labels, and the trigger's month name (e.g. `import { es }
+     * from 'react-day-picker/locale'`). The trigger's day/year order stays
+     * fixed (`MMM d, yyyy`) — only the month name translates, not the
+     * ordering. Defaults to date-fns `enUS`. Does not translate `monthLabel`/
+     * `yearLabel`/`cancelLabel`/`applyLabel`/`formatMonthLabel` — those are
+     * separate props.
+     */
+    locale?: DayPickerLocale;
+    /** Accessible name of the calendar's month dropdown. */
+    monthLabel?: string;
+    /** Accessible name of the calendar's year dropdown. */
+    yearLabel?: string;
+    /** Formats a month's name for the month dropdown. Defaults to `locale`-aware `date-fns` formatting. */
+    formatMonthLabel?: (date: Date) => string;
+    /** Popup footer's "Cancel" button label. */
+    cancelLabel?: string;
+    /** Popup footer's "Apply" button label. */
+    applyLabel?: string;
 }
 declare const DateRangePicker: React.ForwardRefExoticComponent<DateRangePickerProps & React.RefAttributes<HTMLButtonElement>>;
 export { DateRangePicker };

package/dist/src/components/ui/dropdown-menu/dropdown-menu.d.ts

@@ -29,4 +29,11 @@ declare function DropdownMenuShortcut({ className, ...props }: React.HTMLAttribu
 declare namespace DropdownMenuShortcut {
     var displayName: string;
 }
-export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuPortal, };
+declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<Omit<import('@base-ui/react').ContextMenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const DropdownMenuRadioGroup: React.NamedExoticComponent<Omit<import('@base-ui/react').ContextMenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<Omit<import('@base-ui/react').ContextMenuRadioItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuPortal, };

package/dist/src/components/ui/dropdown-menu/index.d.ts

@@ -1 +1 @@
-export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuPortal, type DropdownMenuContentProps, } from './dropdown-menu';
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuPortal, type DropdownMenuContentProps, } from './dropdown-menu';

package/dist/src/components/ui/filter-chips/filter-chips.d.ts

@@ -0,0 +1,25 @@
+import { useRender } from '@base-ui/react/use-render';
+import * as React from 'react';
+export interface FilterChipsProps extends React.ComponentPropsWithoutRef<'div'> {
+    /**
+     * Replace the rendered `<div>` with another element or component
+     * (Base UI composition). Accepts a React element or a render function.
+     */
+    render?: useRender.RenderProp;
+    /** Accessible name for the applied-filter region. */
+    ariaLabel?: string;
+}
+declare const FilterChips: React.ForwardRefExoticComponent<FilterChipsProps & React.RefAttributes<HTMLDivElement>>;
+export type FilterChipsListProps = React.ComponentPropsWithoutRef<'div'>;
+declare const FilterChipsList: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface FilterChipsResetProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Replace the rendered `<button>` with another element or component
+     * (Base UI composition). Accepts a React element or a render function.
+     */
+    render?: useRender.RenderProp;
+    /** Label for the reset action. */
+    children?: React.ReactNode;
+}
+declare const FilterChipsReset: React.ForwardRefExoticComponent<FilterChipsResetProps & React.RefAttributes<HTMLButtonElement>>;
+export { FilterChips, FilterChipsList, FilterChipsReset };

package/dist/src/components/ui/filter-chips/index.d.ts

@@ -0,0 +1 @@
+export { FilterChips, FilterChipsList, FilterChipsReset, type FilterChipsProps, type FilterChipsListProps, type FilterChipsResetProps, } from './filter-chips';

package/dist/src/components/ui/filter-search/filter-search.d.ts

@@ -1,3 +1,5 @@
+import { FilterChipsProps } from '../filter-chips';
+import { PopoverContent } from '../popover';
 import * as React from 'react';
 export type FilterSearchProps = React.ComponentPropsWithoutRef<'div'>;
 declare const FilterSearch: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
@@ -25,6 +27,12 @@ export interface FilterSearchFiltersProps extends Omit<React.ComponentPropsWitho
     onApply?: (filters: Record<string, unknown>) => void;
     /** Label for the filter trigger button. */
     label?: React.ReactNode;
+    /** Label for the "Reset filters" action inside the popover. */
+    resetFiltersLabel?: React.ReactNode;
+    /** Label for the "Cancel" action inside the popover. */
+    cancelLabel?: React.ReactNode;
+    /** Label for the "Apply" action inside the popover. */
+    applyLabel?: React.ReactNode;
     /**
      * Filter field children rendered inside the popover form. Plain children —
      * wire each field to the draft via `useFilterSearchFilters`. Group fields with
@@ -33,15 +41,45 @@ export interface FilterSearchFiltersProps extends Omit<React.ComponentPropsWitho
     children?: React.ReactNode;
     /** Additional classes merged onto the trigger button. */
     className?: string;
+    /** Additional classes merged onto the popover content. */
+    contentClassName?: string;
+    /** Which side of the trigger to render the popover on. Defaults to `'bottom'`. */
+    side?: React.ComponentProps<typeof PopoverContent>['side'];
+    /** Alignment of the popover along the chosen side. Defaults to `'start'`. */
+    align?: React.ComponentProps<typeof PopoverContent>['align'];
+    /** Distance in px between the trigger and the popover. */
+    sideOffset?: React.ComponentProps<typeof PopoverContent>['sideOffset'];
+    /**
+     * Portal container the popover mounts into. Defaults to the nearest
+     * `PortalContainerProvider`, or `document.body` if none is set — see
+     * `PopoverContent`'s `portalContainer` prop.
+     */
+    portalContainer?: React.ComponentProps<typeof PopoverContent>['portalContainer'];
+    /**
+     * Element/rect the popover is confined to when avoiding collisions. See
+     * `PopoverContent`'s `collisionBoundary` prop for the default behavior
+     * inside a constrained portal container.
+     */
+    collisionBoundary?: React.ComponentProps<typeof PopoverContent>['collisionBoundary'];
+    /**
+     * Which CSS `position` the popover uses. See `PopoverContent`'s
+     * `positionMethod` prop for the default behavior inside a constrained
+     * portal container.
+     */
+    positionMethod?: React.ComponentProps<typeof PopoverContent>['positionMethod'];
 }
 declare const FilterSearchFilters: React.ForwardRefExoticComponent<FilterSearchFiltersProps & React.RefAttributes<HTMLButtonElement>>;
-export interface FilterSearchAppliedFiltersProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> {
+export interface FilterSearchAppliedFiltersProps extends Omit<FilterChipsProps, 'children'> {
     /** The currently applied filter values, keyed by an arbitrary consumer-chosen id. */
     filters: Record<string, unknown>;
     /** Called with the remaining filters when a chip is removed or "Reset filters" clears all. */
     onValueChange: (next: Record<string, unknown>) => void;
     /** Format an applied-filter chip's label. Defaults to `"<key>: <value>"`. */
     getFilterChipLabel?: (key: string, value: unknown) => React.ReactNode;
+    /** Format a filter chip's remove-button accessible label. Defaults to `"Remove <key> filter"`. */
+    getRemoveFilterLabel?: (key: string) => string;
+    /** Label for the "Reset filters" action. */
+    resetFiltersLabel?: React.ReactNode;
 }
 /**
  * Renders one removable chip per applied filter plus a "Reset filters" action

package/dist/src/components/ui/fitted-actions/fitted-actions.d.ts

@@ -0,0 +1,50 @@
+import * as React from 'react';
+/**
+ * Pure overflow math (no DOM). Greedily fits leading actions into
+ * `containerWidth - dropdownWidth`, accounting for the inter-item `gap`. Returns
+ * how many render inline; the rest overflow into the menu. Exported for testing.
+ */
+export declare function computeFittedVisibleCount({ containerWidth, itemWidths, dropdownWidth, gap, }: {
+    containerWidth: number;
+    itemWidths: number[];
+    dropdownWidth: number;
+    gap?: number;
+}): number;
+export interface FittedAction {
+    /** Stable identity. */
+    id: string;
+    /** Visible label (also the overflow menu-item label). */
+    label: React.ReactNode;
+    /** Optional leading 16px icon. */
+    icon?: React.ReactNode;
+    /** Set `false` to omit the action entirely. */
+    isDisplayed?: boolean;
+    /** Render a divider above this item when it sits in the overflow menu. */
+    divided?: boolean;
+    disabled?: boolean;
+    /** Invoked when this action is chosen (inline click or menu select). */
+    onSelect?: () => void;
+}
+export interface FittedActionsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
+    /** Ordered actions; trailing items overflow into the menu first. Defaults to `[]`. */
+    actions?: FittedAction[];
+    /** Collapse overflow into a "More" menu. Default true. */
+    showDropdown?: boolean;
+    /** Label for the overflow trigger. Default "More". */
+    moreLabel?: React.ReactNode;
+    /** Inter-item gap in px (also reserved when measuring). Default 8. */
+    gap?: number;
+    /** Fired for any chosen action, after its own `onSelect`. */
+    onAction?: (action: FittedAction) => void;
+    /** Customize the inline action element. Default: a ghost `Button`. */
+    renderAction?: (action: FittedAction, api: {
+        onSelect: () => void;
+        disabled?: boolean;
+    }) => React.ReactNode;
+    /** Customize the overflow trigger (used as the menu trigger's `render`). Default: a ghost `Button`. */
+    renderTrigger?: (api: {
+        label: React.ReactNode;
+    }) => React.ReactElement;
+}
+declare const FittedActions: React.ForwardRefExoticComponent<FittedActionsProps & React.RefAttributes<HTMLDivElement>>;
+export { FittedActions };

package/dist/src/components/ui/fitted-actions/fitted-actions.docs.d.ts

@@ -0,0 +1,45 @@
+import type * as React from 'react';
+/**
+ * Props for `FittedActions` — the responsive action row.
+ * Extends `div` props (excluding `onSelect`).
+ */
+export interface FittedActionsProps {
+    /** Ordered actions; trailing items overflow into the menu first. Defaults to `[]`. */
+    actions?: FittedAction[];
+    /** Collapse overflow into a "More" menu. Default `true`. */
+    showDropdown?: boolean;
+    /** Label for the overflow trigger. Default `"More"`. */
+    moreLabel?: React.ReactNode;
+    /** Inter-item gap in px (also reserved when measuring). Default `8`. */
+    gap?: number;
+    /** Fired for any chosen action, after its own `onSelect`. */
+    onAction?: (action: FittedAction) => void;
+    /** Customize the inline action element. Default: a ghost `Button`. */
+    renderAction?: (action: FittedAction, api: {
+        onSelect: () => void;
+        disabled?: boolean;
+    }) => React.ReactNode;
+    /** Customize the overflow trigger (used as the menu trigger's `render`). Default: a ghost `Button`. */
+    renderTrigger?: (api: {
+        label: React.ReactNode;
+    }) => React.ReactElement;
+    /** Extra classes merged onto the root `<div>`. */
+    className?: string;
+}
+/** A single action in the `FittedActions` bar. */
+export interface FittedAction {
+    /** Stable identity — used as React key. */
+    id: string;
+    /** Visible label (also the overflow menu-item label). */
+    label: React.ReactNode;
+    /** Optional leading 16px icon rendered before the label. */
+    icon?: React.ReactNode;
+    /** Set `false` to omit the action entirely without removing it from the array. */
+    isDisplayed?: boolean;
+    /** Render a divider above this item when it appears in the overflow menu. */
+    divided?: boolean;
+    /** Disables the action (inline button and overflow menu item both become inert). */
+    disabled?: boolean;
+    /** Invoked when this action is chosen — inline click or overflow menu select. */
+    onSelect?: () => void;
+}

package/dist/src/components/ui/fitted-actions/index.d.ts

@@ -0,0 +1 @@
+export { FittedActions, computeFittedVisibleCount, type FittedAction, type FittedActionsProps, } from './fitted-actions';

package/dist/src/components/ui/link/index.d.ts

@@ -1 +1 @@
-export { Link, type LinkProps } from './link';
+export { Link, linkVariants, type LinkProps } from './link';

package/dist/src/components/ui/link/link.d.ts

@@ -1,9 +1,27 @@
 import { useRender } from '@base-ui/react/use-render';
+import { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
-export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
-    /** Append a trailing external-link icon (e.g. for links that leave the app). */
+declare const linkVariants: (props?: ({
+    variant?: "normal" | "inverse" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement>, VariantProps<typeof linkVariants> {
+    /**
+     * Which surface the link sits on (Figma's `background`): `normal` for ordinary
+     * surfaces, `inverse` for a backdrop/scrim or other dark brand surface.
+     */
+    variant?: 'normal' | 'inverse';
+    /**
+     * Append a trailing external-link icon (e.g. for links that leave the app).
+     * Has no effect on `variant="inverse"` — the design defines no external icon for
+     * links on a backdrop.
+     */
     external?: boolean;
-    /** Render the link inert: disabled color, removed from the tab order, no navigation. */
+    /**
+     * Render the link inert: disabled color, removed from the tab order, no navigation.
+     * Ignored entirely on `variant="inverse"` — the design defines no disabled state on
+     * a backdrop, so the link renders exactly as an enabled one (still navigable and
+     * focusable). Omit the link, or use `variant="normal"`, when you need it inert.
+     */
     disabled?: boolean;
     /**
      * Replace the rendered `<a>` with another element or component (Base UI
@@ -12,4 +30,4 @@ export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement>
     render?: useRender.RenderProp;
 }
 declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
-export { Link };
+export { Link, linkVariants };

package/dist/src/components/ui/metric/metric.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const metricVariants: (props?: ({
     size?: "small" | "medium" | "large" | null | undefined;
-    status?: "info" | "success" | "warning" | "critical" | "neutral" | "danger" | null | undefined;
+    status?: "info" | "success" | "warning" | "critical" | "danger" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface MetricProps extends React.ComponentProps<'div'>, VariantProps<typeof metricVariants> {
     /** What the value measures — e.g. "Gross margin". Rendered as an uppercase note heading. */

package/dist/src/components/ui/popover/popover.d.ts

@@ -17,11 +17,40 @@ export interface PopoverContentProps extends React.ComponentPropsWithoutRef<type
     portal?: boolean;
     /**
      * Portal container. Pass a shadow-root mount for isolated-style previews
-     * (the docs demos do this via `useShadowMount`).
+     * (the docs demos do this via `useShadowMount`), or a constrained
+     * MFE/Shadow DOM mount point (see `PortalContainerProvider`).
      */
     portalContainer?: PopoverPrimitive.Portal.Props['container'];
     /** Keep the content mounted while closed (Base UI `Portal` prop). */
     keepMounted?: PopoverPrimitive.Portal.Props['keepMounted'];
+    /**
+     * Element/rect the popup is confined to when avoiding collisions. Defaults
+     * to Base UI's own `'clipping-ancestors'` behavior — left alone here,
+     * since pairing it with the `positionMethod` default below already avoids
+     * clipping inside a constrained `portalContainer` (see that prop's doc).
+     * Override explicitly if a different boundary is needed.
+     */
+    collisionBoundary?: PopoverPrimitive.Positioner.Props['collisionBoundary'];
+    /**
+     * Which CSS `position` the popup uses. Defaults to `'fixed'` whenever the
+     * popup is portaled (`portal` is not `false`) into a resolved
+     * `portalContainer` — an `'absolute'`-positioned popup
+     * (Base UI's own default) is still clipped by a `portalContainer` ancestor
+     * that constrains overflow (e.g. a Shadow DOM host with `overflow: hidden`)
+     * no matter how the collision boundary is computed, since it shares that
+     * ancestor's containing block. `'fixed'` escapes a plain overflow-clipping
+     * ancestor — for a `fixed`-positioned popup, the collision-detection
+     * library (floating-ui) drops overflow ancestors that don't establish
+     * their own containing block, so it clips against the real viewport
+     * instead, which is also unaffected by page scroll (unlike measuring
+     * `document.documentElement`'s own bounding rect, which shrinks by the
+     * scroll offset). Note this is not an absolute guarantee: an ancestor with
+     * `transform`, `filter`, `will-change`, `backdrop-filter`, `perspective`,
+     * or `contain: paint`/`layout` *does* establish a containing block, so it
+     * still clips (and repositions relative to) a `fixed` descendant. Override
+     * explicitly if a different strategy is needed.
+     */
+    positionMethod?: PopoverPrimitive.Positioner.Props['positionMethod'];
 }
 declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
 /**

package/dist/src/components/ui/popover/popover.docs.d.ts

@@ -14,11 +14,36 @@ export interface PopoverContentProps {
     portal?: boolean;
     /**
      * Portal container. Pass a shadow-root mount for isolated-style previews
-     * (the docs demos do this via `useShadowMount`).
+     * (the docs demos do this via `useShadowMount`), or a `RefObject` pointing
+     * at a not-yet-mounted container element — its `current` is resolved once
+     * attached, so it doesn't need to be available on first render.
      */
-    portalContainer?: HTMLElement | null;
+    portalContainer?: HTMLElement | ShadowRoot | null | React.RefObject<HTMLElement | ShadowRoot | null>;
     /** Keep the content mounted while closed. */
     keepMounted?: boolean;
+    /**
+     * Element/rect the popup is confined to when avoiding collisions. Defaults
+     * to Base UI's own `'clipping-ancestors'` behavior, left alone here — see
+     * `positionMethod` for why that already avoids clipping inside a
+     * constrained `portalContainer`.
+     */
+    collisionBoundary?: Element | Element[] | {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | 'clipping-ancestors';
+    /**
+     * Which CSS `position` the popup uses. Defaults to `fixed` whenever the
+     * popup is portaled into a resolved `portalContainer`, so it escapes a
+     * plain overflow-clipping container (e.g. `overflow: hidden`) — the
+     * collision-detection library drops such an ancestor from its clipping
+     * chain for a `fixed`-positioned element, resolving to the real,
+     * scroll-independent viewport. Not a guarantee against an ancestor that
+     * also has a `transform`/`filter`/`will-change`/etc., which establishes
+     * its own containing block for fixed descendants and still clips.
+     */
+    positionMethod?: 'absolute' | 'fixed';
     /** Extra classes merged onto the popup. */
     className?: string;
     children?: React.ReactNode;

package/dist/src/components/ui/scroll-area/scroll-area.d.ts

@@ -5,6 +5,30 @@ declare const ScrollBar: React.ForwardRefExoticComponent<Omit<Omit<import('@base
 export interface ScrollAreaProps extends React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> {
     /** Which scrollbar(s) to render. @default 'vertical' */
     orientation?: 'vertical' | 'horizontal' | 'both';
+    /**
+     * Ref to the **viewport** — the element that actually scrolls.
+     *
+     * `ref` reaches the root, which is `overflow: hidden` and never scrolls, so
+     * it reports `scrollTop: 0` and `scrollHeight === clientHeight` forever.
+     * Anything that measures, observes, or programmatically scrolls the region
+     * needs this one instead: a virtualizer's scroll element, an infinite-scroll
+     * observer, a scroll-to-item call.
+     */
+    viewportRef?: React.Ref<HTMLDivElement>;
+    /**
+     * Extra props for the viewport — a scroll handler, a tab index, or
+     * `data-*` attributes that must sit on the element that scrolls rather than
+     * on the wrapper around it.
+     *
+     * The `data-*` index signature is deliberate: JSX grants intrinsic elements
+     * an arbitrary-`data-*` escape hatch, but a props object typed as
+     * `HTMLAttributes` does not get it — so without this, the main thing this
+     * prop exists for (marking the scrolling element for an observer) would not
+     * type-check.
+     */
+    viewportProps?: React.HTMLAttributes<HTMLDivElement> & {
+        readonly [attribute: `data-${string}`]: unknown;
+    };
 }
 declare const ScrollArea: React.ForwardRefExoticComponent<ScrollAreaProps & React.RefAttributes<HTMLDivElement>>;
 export { ScrollArea, ScrollBar };

package/dist/src/components/ui/stepper/index.d.ts

@@ -0,0 +1 @@
+export { Stepper, type StepperProps } from './stepper';

package/dist/src/components/ui/stepper/stepper.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * The `StepperItem` elements making up the sequence. Rendered in the wide
+     * (>= 1024px) layout only — the compact layout is a text summary and shows no
+     * items at all.
+     */
+    children?: React.ReactNode;
+    /** 1-based index of the step the user is on, e.g. `3`. Compact layout only. */
+    currentStep: React.ReactNode;
+    /** How many steps there are in total, e.g. `5`. Compact layout only. */
+    totalSteps: React.ReactNode;
+    /** The current step's name. Compact layout only. */
+    current: React.ReactNode;
+    /**
+     * The next step's name. Omit it — on the last step, say — and the whole
+     * "Next: …" line is left out rather than rendered empty. Compact layout only.
+     */
+    next?: React.ReactNode;
+    /**
+     * The word introducing the step counter. A prop, not an inlined literal, so
+     * the string can be translated (see `context/conventions.md` §"Localization —
+     * no hardcoded labels"): this component generates the text itself, unlike the
+     * step names, which the caller supplies.
+     */
+    stepLabel?: string;
+    /** The word joining the current step number to the total. Translatable — see `stepLabel`. */
+    ofLabel?: string;
+    /** The label introducing the next step's name. Translatable — see `stepLabel`. */
+    nextLabel?: string;
+    /**
+     * The punctuation joining the step counter to the current step's name. A prop
+     * for the same reason as `stepLabel`: the component generates it, and not every
+     * locale writes it as `": "` (French, say, spaces before the colon; CJK uses a
+     * full-width one).
+     */
+    separatorLabel?: string;
+}
+declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLDivElement>>;
+export { Stepper };

package/dist/src/components/ui/stepper-item/index.d.ts

@@ -0,0 +1 @@
+export { StepperItem, stepperItemVariants, type StepperItemProps, type StepperItemVariant, type StepperItemState, } from './stepper-item';

package/dist/src/components/ui/stepper-item/stepper-item.d.ts

@@ -0,0 +1,41 @@
+import { useRender } from '@base-ui/react/use-render';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const stepperItemVariants: (props?: ({
+    variant?: "current" | "completed" | "future" | null | undefined;
+    state?: "active" | "hover" | "idle" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+/** Kept in lockstep with the `cva` axes above. */
+export type StepperItemVariant = NonNullable<VariantProps<typeof stepperItemVariants>['variant']>;
+export type StepperItemState = NonNullable<VariantProps<typeof stepperItemVariants>['state']>;
+export interface StepperItemProps extends React.ComponentPropsWithoutRef<'div'> {
+    /**
+     * The step's structural role in the sequence. Drives the container background
+     * and the label color. Defaults to `current` for prop ergonomics — in a real
+     * sequence every step declares its own.
+     */
+    variant?: StepperItemVariant;
+    /**
+     * Interaction state. Only produces a different look when `variant` is
+     * `completed` (`idle` has no background, `hover` and `active` paint one).
+     * Ignored for `current`, which always renders in its highlighted look, and for
+     * `future`, which always renders disabled and non-interactive.
+     */
+    state?: StepperItemState;
+    /**
+     * The step's marker — required, and entirely the caller's to compose. Pass any
+     * `Avatar` composition (color scheme, initials / icon / image, size overrides);
+     * this component renders it verbatim and never styles it.
+     */
+    avatar: React.ReactElement;
+    /** The step name. */
+    label?: React.ReactNode;
+    /**
+     * Replace the rendered `<div>` with another element or component (Base UI
+     * composition) — e.g. a `<button>`, since a completed step is usually a way
+     * back to an earlier step.
+     */
+    render?: useRender.RenderProp;
+}
+declare const StepperItem: React.ForwardRefExoticComponent<StepperItemProps & React.RefAttributes<HTMLDivElement>>;
+export { StepperItem, stepperItemVariants };

package/dist/src/components/ui/table/index.d.ts

@@ -1,3 +1,3 @@
-export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, type TableRowProps, type TableHeadProps, type TableCellProps, } from './table';
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableSelectCell, TableActionsCell, TableSettingsCell, TableCaption, type TableRowProps, type TableHeadProps, type TableCellProps, type TableSelectCellProps, type TableActionsCellProps, } from './table';
 export { TablePagination, type TablePaginationProps, } from './table-pagination';
 export { TableViewOptions, type TableViewOptionsProps, type TableColumnVisibility, } from './table-view-options';

package/dist/src/components/ui/table/table-pagination.d.ts

@@ -16,6 +16,27 @@ export interface TablePaginationProps extends Omit<React.HTMLAttributes<HTMLDivE
     onPageIndexChange: (pageIndex: number) => void;
     /** Invoked with the next page size. */
     onPageSizeChange: (pageSize: number) => void;
+    /** Label of the rows-per-page select (also its accessible name). */
+    rowsPerPageLabel?: string;
+    /** Accessible name of the first-page control. */
+    firstPageLabel?: string;
+    /** Accessible name of the previous-page control. */
+    previousPageLabel?: string;
+    /** Accessible name of the next-page control. */
+    nextPageLabel?: string;
+    /** Accessible name of the last-page control. */
+    lastPageLabel?: string;
+    /**
+     * Builds the page indicator. Receives the 1-based page number and the total
+     * page count; `pageCount === 0` means there are no pages.
+     */
+    pageLabel?: (page: number, pageCount: number) => string;
+    /**
+     * Builds the leading row summary. Receives the selected-row count (or
+     * `undefined` when selection isn't tracked) and the total row count. Return
+     * `null` for no summary.
+     */
+    summaryLabel?: (selectedRows: number | undefined, totalRows: number) => string | null;
 }
 declare const TablePagination: React.ForwardRefExoticComponent<TablePaginationProps & React.RefAttributes<HTMLDivElement>>;
 export { TablePagination };

package/dist/src/components/ui/table/table-view-options.d.ts

@@ -12,10 +12,17 @@ export interface TableViewOptionsProps {
     columns: TableColumnVisibility[];
     /** Invoked with the column id whose visibility was toggled. */
     onToggle: (id: string) => void;
-    /** Trigger label. Defaults to `View`. */
+    /** Trigger label. Defaults to `View`. Ignored when `iconOnly`. */
     triggerLabel?: React.ReactNode;
+    /**
+     * Render the trigger as a cog-only icon button instead of a labelled
+     * `Button` — the shape that fits the 48px `TableSettingsCell` column.
+     */
+    iconOnly?: boolean;
+    /** Accessible name of the `iconOnly` trigger. Override to localize. */
+    triggerAriaLabel?: string;
 }
-declare function TableViewOptions({ columns, onToggle, triggerLabel, }: TableViewOptionsProps): import("react/jsx-runtime").JSX.Element;
+declare function TableViewOptions({ columns, onToggle, triggerLabel, iconOnly, triggerAriaLabel, }: TableViewOptionsProps): import("react/jsx-runtime").JSX.Element;
 declare namespace TableViewOptions {
     var displayName: string;
 }

package/dist/src/components/ui/table/table.d.ts

@@ -31,5 +31,44 @@ export interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElem
     wrap?: boolean;
 }
 declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
+export interface TableSelectCellProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
+    /**
+     * Render the select-all cell of the header row (`<th>`) instead of a row's
+     * selection cell (`<td>`).
+     */
+    header?: boolean;
+}
+/**
+ * The row-selection cell (design part `TableCheckbox`) — a fixed 32px column
+ * holding a label-less `Checkbox`. Only the leading padding is applied, matching
+ * the design (16px padding + a 16px box), so the checkbox sits flush against the
+ * first data cell.
+ */
+declare const TableSelectCell: React.ForwardRefExoticComponent<TableSelectCellProps & React.RefAttributes<HTMLTableCellElement>>;
+export interface TableActionsCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
+    /**
+     * Suppress this row's actions because a selection is in play — the cell
+     * still reserves its 48px column (so the grid doesn't reflow) but renders no
+     * children and no hover/press tint. Per the design, that means any row is
+     * selected, including exactly one. Pass `isBulkSelectionActive(table)` (from
+     * the data-table part) rather than re-deriving the threshold.
+     */
+    bulkSelectionActive?: boolean;
+}
+/**
+ * The trailing row-actions cell (design part `TableActions`) — a fixed 48px
+ * column, end-aligned, holding the consumer's overflow trigger (e.g. a
+ * `ButtonIcon` with `EllipsisIcon` opening a `DropdownMenu`). The cell itself
+ * carries the hover/press tint and the focus ring, per the design.
+ */
+declare const TableActionsCell: React.ForwardRefExoticComponent<TableActionsCellProps & React.RefAttributes<HTMLTableCellElement>>;
+/**
+ * The trailing header cell holding the column-settings trigger (design part
+ * `TableSettings`) — a fixed 48px column, end-aligned, holding the consumer's
+ * gear trigger (e.g. a `ButtonIcon` with `CogIcon`). Visual states only; what
+ * the trigger opens (a column-visibility menu) is the consumer's choice —
+ * `TableViewOptions` is the ready-made one.
+ */
+declare const TableSettingsCell: React.ForwardRefExoticComponent<React.ThHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
 declare const TableCaption: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableCaptionElement> & React.RefAttributes<HTMLTableCaptionElement>>;
-export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, };
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableSelectCell, TableActionsCell, TableSettingsCell, TableCaption, };