themelia-react-ui 2.0.6 → 3.0.0

package/dist/components/layout/sidebar/sidebar.types.d.ts

@@ -92,10 +92,18 @@ export interface SidebarNavigationStrings {
     noResults: string;
     expand: (label: string) => string;
     collapse: (label: string) => string;
+    /** Announced to assistive technology after each search; receives how many entries match, zero included. */
+    resultsCount: (count: number) => string;
+    /** Name of the navigation landmark in the primary panel. An `aria-label` on AppSidebar wins. */
+    primaryNavigationLabel: string;
+    /** Name of the navigation landmark in the secondary (contextual) panel. */
+    contextualNavigationLabel: string;
+    /** Name of the navigation landmark in the aside (supporting) panel. */
+    supportingNavigationLabel: string;
 }
 export declare const defaultSidebarNavigationStrings: SidebarNavigationStrings;
 export interface AppSidebarProps extends LayoutNavigationAdapter, SidebarExpansionProps {
-    /** Accessible name for the navigation landmark. Defaults to the named panel's role. */
+    /** Accessible name for the navigation landmark. Defaults to the panel's label in `strings`. */
     'aria-label'?: string;
     /** Enables the library input and local navigation filtering. */
     searchable?: boolean;
@@ -125,8 +133,6 @@ export interface AppSidebarProps extends LayoutNavigationAdapter, SidebarExpansi
     workspaceContentClassName?: string;
     /** Merged onto the header region. */
     headerClassName?: string;
-    /** Merged onto the logo. */
-    logoClassName?: string;
     /** Resolves an item's icon name to a component, keeping navigation data serialisable. */
     iconMap?: Record<string, ComponentType<{
         className?: string;
@@ -135,8 +141,6 @@ export interface AppSidebarProps extends LayoutNavigationAdapter, SidebarExpansi
     currentUrl?: string;
     /** Close this already-open drawer when the app commits a new currentUrl. @default true */
     closeDrawerOnNavigate?: boolean;
-    /** Render item badges and live counts. @default true */
-    showBadges?: boolean;
     /** Live counts keyed by item id — unread totals and similar. */
     liveBadges?: Record<string, string | number>;
     /** Shows the pending indicator. */
@@ -177,8 +181,6 @@ export interface SidebarGroupedNavigationProps extends LayoutNavigationAdapter,
     iconMap?: Record<string, ComponentType<{
         className?: string;
     }>>;
-    /** Render item badges and live counts. @default true */
-    showBadges?: boolean;
     /** Live counts keyed by item id — unread totals and similar. */
     liveBadges?: Record<string, string | number>;
     /** Shown when a group has no items. */
@@ -194,7 +196,7 @@ export interface SidebarFlatNavigationProps extends LayoutNavigationAdapter {
     menuDensity?: SidebarMenuDensity;
     /** Entries to render, in order. */
     items: SidebarFlatNavItem[];
-    /** Display label. */
+    /** Group label above the list. Omitted, the list has none. */
     label?: ReactNode;
     /** URL of the active route, used to mark the current item. */
     currentUrl?: string;
@@ -202,8 +204,6 @@ export interface SidebarFlatNavigationProps extends LayoutNavigationAdapter {
     iconMap?: Record<string, ComponentType<{
         className?: string;
     }>>;
-    /** Render item badges and live counts. @default true */
-    showBadges?: boolean;
     /** Live counts keyed by item id — unread totals and similar. */
     liveBadges?: Record<string, string | number>;
     /** Renders one item through the consumer's router. */
@@ -254,8 +254,6 @@ export interface SidebarNavigationFooterProps extends LayoutNavigationAdapter {
     iconMap?: Record<string, ComponentType<{
         className?: string;
     }>>;
-    /** Render item badges and live counts. @default true */
-    showBadges?: boolean;
     /** Live counts keyed by item id — unread totals and similar. */
     liveBadges?: Record<string, string | number>;
     className?: string;

package/dist/components/layout/sidebar/sidebar.utils.d.ts

@@ -12,6 +12,10 @@ interface NavigationPathItem {
     children?: readonly NavigationPathItem[];
 }
 export declare function getCurrentNavigationHref(currentUrl: string, items: readonly NavigationPathItem[]): string | undefined;
+/** Keeps entries whose label or handle matches, and the ancestors that lead to them. `query` is trimmed and lower-cased by the caller. */
+export declare function filterNavigation(items: SidebarNavItem[], query: string): SidebarNavItem[];
+/** How many entries match the query themselves, at any depth. */
+export declare function countNavigationMatches(items: readonly SidebarNavItem[], query: string): number;
 export declare function getNavLabel(item: Pick<SidebarNavItem, 'label'>): React.ReactNode;
 export declare function getNavKey(item: SidebarNavItem, fallbackIndex?: number): React.Key;
 export declare function NavBadge({ value, size, }: {

package/dist/components/layout/workspace/workspace.strings.d.ts

@@ -1,13 +1,13 @@
 export interface WorkspaceRecordHeaderStrings {
     metadataLabel: string;
     actionsLabel: string;
-    secondaryActionsLabel: string;
+    /** Accessible name of the More actions menu trigger. */
+    moreActionsLabel: string;
 }
 export declare const defaultWorkspaceRecordHeaderStrings: WorkspaceRecordHeaderStrings;
 export interface WorkspaceNavStrings {
     ariaLabel: string;
     completionLabel: (value: number) => string;
-    currentLabel: string;
 }
 export declare const defaultWorkspaceNavStrings: WorkspaceNavStrings;
 export interface WorkspaceLocaleStripStrings {

package/dist/components/layout/workspace/workspace.types.d.ts

@@ -2,6 +2,7 @@ import type { CSSProperties, HTMLAttributes, MouseEvent, ReactNode } from 'react
 import type { LayoutIconComponent, LayoutNavigationAdapter } from '../layout.types';
 import type { StringsProp } from '../../../lib/strings';
 import type { TextGap } from '../../base/structure';
+import type { HeadingTag } from '../../typography';
 import type { PageHeaderAction } from '../../base/navigation/page-header';
 import type { WorkspaceLocaleStripStrings, WorkspaceNavStrings, WorkspaceRecordHeaderStrings } from './workspace.strings';
 export type WorkspaceContentWidth = 'default' | 'wide' | 'full';
@@ -32,8 +33,14 @@ export interface WorkspaceLayoutProps extends Omit<HTMLAttributes<HTMLDivElement
     contentClassName?: string;
     /** Merged onto the icon rail. */
     railClassName?: string;
-    /** Accessible name for the region. */
-    ariaLabel?: string;
+    /** Accessible name for the workspace. It names the workspace as a group, or the main region when `mainAs` is `section`. */
+    'aria-label'?: string;
+    /**
+     * Element of the scrolling content region. Defaults to `main`, or to `div`
+     * inside an app shell or PageViewport that already renders the page's main
+     * landmark. `section` with `aria-label` gives a named region.
+     */
+    mainAs?: 'main' | 'div' | 'section';
     style?: WorkspaceLayoutStyle;
 }
 export interface WorkspaceRecordHeaderMetadataItem {
@@ -68,10 +75,9 @@ export interface WorkspaceRecordHeaderProps extends Omit<HTMLAttributes<HTMLDivE
      * Supporting commands in priority order, as in Page headers: the first two
      * render as outline buttons before the primary command; the rest, and every
      * destructive command, move into the More actions menu, which closes the
-     * row. Rendered elements are still accepted for existing headers; pass
-     * command objects instead.
+     * row.
      */
-    secondaryActions?: ReactNode | readonly PageHeaderAction[];
+    secondaryActions?: readonly PageHeaderAction[];
     /**
      * How many routine secondary commands render as outline buttons on wide
      * headers; later ones join the More actions menu. Use `1` or `0` when long
@@ -79,8 +85,6 @@ export interface WorkspaceRecordHeaderProps extends Omit<HTMLAttributes<HTMLDivE
      * keeps every routine command inline. @default 2
      */
     maxVisibleSecondaryActions?: number;
-    /** Accessible name of the More actions menu trigger. Default: `'More actions'`. */
-    moreActionsLabel?: string;
     /** Current state, shown as a chip. */
     status?: ReactNode;
     /** Illustration or imagery beside the form. */
@@ -89,6 +93,8 @@ export interface WorkspaceRecordHeaderProps extends Omit<HTMLAttributes<HTMLDivE
     headerEnd?: ReactNode;
     /** Replaces the record title region. */
     titleSlot?: ReactNode;
+    /** Heading level of the record title, so it continues the page outline. @default 'h4' */
+    headingTag?: HeadingTag;
     /** Overrides this surface's own copy. */
     strings?: StringsProp<WorkspaceRecordHeaderStrings>;
 }

package/dist/components/primitives/date.d.ts

@@ -15,6 +15,13 @@ export interface DateProps extends SpanProps {
     preset?: DatePreset;
     /** date-fns locale. Defaults to the provider `dates.locale`. */
     locale?: Locale;
+    /**
+     * IANA time zone (`Europe/Athens`, `UTC`) an instant is shown in. Defaults to
+     * the provider `dates.timeZone`, then the host zone. Set it when a server
+     * and a browser must print the same text. A date-only value (`yyyy-MM-dd`)
+     * is a calendar date and is never shifted.
+     */
+    timeZone?: string;
     /** Rendered with the shared empty treatment when the value is absent or invalid. Defaults to an em dash. */
     emptyLabel?: ReactNode;
     /** Text size. Defaults to the provider text size; inside running text, the surrounding size. */
@@ -24,6 +31,7 @@ export interface DateProps extends SpanProps {
     weight?: TextProps['weight'];
     /** Colour role. Defaults to `main`; inside running text, the surrounding colour. */
     type?: TextProps['type'];
+    /** The `time` element when a value is shown, or the empty span. */
     ref?: Ref<HTMLSpanElement>;
 }
 export interface TimeProps extends Omit<DateProps, 'preset'> {
@@ -41,9 +49,15 @@ export interface FormatDateRangeOptions {
     preset?: DatePreset;
     locale?: Locale;
     separator?: string;
+    /** IANA time zone the instants are shown in. Defaults to the host zone. */
+    timeZone?: string;
 }
 export interface DateRangeProps extends Omit<DateProps, 'value'>, DateRangeValue {
     separator?: ReactNode;
+    /** Copy for a range with only `from`, such as `(date) => <>From {date}</>`. Defaults to the date alone. */
+    openEndLabel?: (date: string) => ReactNode;
+    /** Copy for a range with only `to`, such as `(date) => <>Until {date}</>`. Defaults to the date alone. */
+    openStartLabel?: (date: string) => ReactNode;
 }
 export interface RelativeTimeProps extends SpanProps {
     value?: DateInput;
@@ -51,6 +65,10 @@ export interface RelativeTimeProps extends SpanProps {
     /** Adds "ago"/"in". Defaults to `true`. */
     addSuffix?: boolean;
     includeSeconds?: boolean;
+    /** The instant to measure from. Defaults to the clock at render; pass it for server rendering and tests. */
+    now?: DateInput;
+    /** Milliseconds between refreshes while mounted, such as `60_000`. Omit to compute once per render. */
+    refreshInterval?: number;
     /** Rendered with the shared empty treatment when the value is absent or invalid. Defaults to an em dash. */
     emptyLabel?: ReactNode;
     /** Text size. Defaults to the provider text size; inside running text, the surrounding size. */
@@ -61,16 +79,17 @@ export interface RelativeTimeProps extends SpanProps {
     /** Colour role. Defaults to `secondary` for feeds; inside running text, the surrounding colour. */
     type?: TextProps['type'];
     formatRelativeTime?: (iso: string) => string;
+    /** The `time` element when a value is shown, or the empty span. */
     ref?: Ref<HTMLSpanElement>;
 }
 export declare function parseDateInput(value: DateInput): NativeDate | null;
-export declare function formatDateRange({ from, to }: DateRangeValue, { format, preset, locale, separator, }?: FormatDateRangeOptions): string | null;
+export declare function formatDateRange({ from, to }: DateRangeValue, { format, preset, locale, separator, timeZone, }?: FormatDateRangeOptions): string | null;
 export declare function DatePrimitive({ value, format, preset, locale, emptyLabel, ...props }: DateProps): import("react").JSX.Element;
 export declare namespace DatePrimitive {
     var displayName: string;
 }
 export declare function Time({ value, format, preset, locale, emptyLabel, ...props }: TimeProps): import("react").JSX.Element;
 export declare function DateTime({ value, format, timeFormat, preset, locale, emptyLabel, ...props }: DateTimeProps): import("react").JSX.Element;
-export declare function DateRange({ from, to, format, preset, locale, separator, emptyLabel, size, align, weight, type, className, ref, ...props }: DateRangeProps): import("react").JSX.Element;
-export declare function RelativeTime({ value, locale, addSuffix, includeSeconds, emptyLabel, size, align, weight, type, formatRelativeTime, className, ref, ...props }: RelativeTimeProps): import("react").JSX.Element;
+export declare function DateRange({ from, to, format, preset, locale, timeZone, separator, openEndLabel, openStartLabel, emptyLabel, size, align, weight, type, className, ref, ...props }: DateRangeProps): import("react").JSX.Element;
+export declare function RelativeTime({ value, locale, addSuffix, includeSeconds, now, refreshInterval, emptyLabel, size, align, weight, type, formatRelativeTime, className, ref, ...props }: RelativeTimeProps): import("react").JSX.Element;
 export {};

package/dist/components/primitives/file-size.d.ts

@@ -7,6 +7,8 @@ export interface FileSizeProps extends SpanProps {
     value?: number | null;
     from?: FileSizeUnit;
     locale?: string;
+    /** Localized unit abbreviations, such as `{ mb: 'Mo' }`. Defaults to B, KB, MB, GB, TB. */
+    unitLabels?: FileSizeUnitLabels;
     /** Rendered with the shared empty treatment when the value is absent or not positive. Defaults to an em dash. */
     emptyLabel?: ReactNode;
     /** Text size. Defaults to the provider text size; inside running text, the surrounding size. */
@@ -19,11 +21,15 @@ export interface FileSizeProps extends SpanProps {
     type?: TextProps['type'];
     ref?: Ref<HTMLSpanElement>;
 }
+/** Unit abbreviations by unit. The scale is binary (1 KB = 1,024 B). */
+export type FileSizeUnitLabels = Partial<Record<FileSizeUnit, string>>;
 export interface FileSizeFormatOptions {
     from?: FileSizeUnit;
     locale?: string;
+    /** Localized unit abbreviations, such as `{ mb: 'Mo' }`. Defaults to B, KB, MB, GB, TB. */
+    unitLabels?: FileSizeUnitLabels;
 }
-export declare function formatFileSize(value?: number | null, options?: FileSizeFormatOptions | string): string | null;
+export declare function formatFileSize(value?: number | null, options?: FileSizeFormatOptions): string | null;
 /** A byte count in the largest readable unit, sans UI font with tabular figures. */
-export declare function FileSize({ value, from, locale, emptyLabel, size, align, weight, type, className, ref, ...props }: FileSizeProps): import("react").JSX.Element;
+export declare function FileSize({ value, from, locale, unitLabels, emptyLabel, size, align, weight, type, className, ref, ...props }: FileSizeProps): import("react").JSX.Element;
 export {};

package/dist/components/primitives/index.d.ts

@@ -6,6 +6,6 @@ export { Link, Email, Phone, Url, type LinkProps, type EmailProps, type PhonePro
 export { Money, useMoneyFormatter, type MoneyFormatter, type MoneyFormatterOptions, type MoneyProps, type MoneyValue, type MoneyUnit, type MoneyLayout, type MoneySecondaryEmphasis, } from './money';
 export { DatePrimitive as Date, Time, DateTime, DateRange, RelativeTime, formatDateRange, parseDateInput, type DateProps, type TimeProps, type DateTimeProps, type DateRangeProps, type DateRangeValue, type FormatDateRangeOptions, type RelativeTimeProps, type DatePreset, type DateInput, } from './date';
 export { Number, Percent, type NumberProps, type PercentProps, } from './number';
-export { FileSize, formatFileSize, type FileSizeProps, type FileSizeUnit, } from './file-size';
+export { FileSize, formatFileSize, type FileSizeProps, type FileSizeUnit, type FileSizeUnitLabels, type FileSizeFormatOptions, } from './file-size';
 export { Duration, formatDuration, type DurationProps, type DurationUnit, type DurationUnitDisplay, type FormatDurationOptions, } from './duration';
 export { Dimensions, formatDimensions, type DimensionsProps, type FormatDimensionsOptions, } from './dimensions';

package/dist/components/primitives/initials.d.ts

@@ -11,6 +11,8 @@ export interface InitialsProps extends Omit<ValueProps, 'children'> {
     locale?: string;
     /** Returned when no usable letter or number exists. Defaults to an empty string. */
     fallback?: string;
+    /** Rendered when there are no initials and no `fallback`. Defaults to an empty string, so a host avatar shows its own placeholder. */
+    emptyLabel?: ValueProps['emptyLabel'];
     /** Defaults to `inherit`: the avatar or chip that hosts the initials owns their size. */
     size?: ValueProps['size'];
     /** Defaults to `inherit`: the host owns the colour, such as an avatar fallback tone. */
@@ -22,4 +24,4 @@ export interface InitialsProps extends Omit<ValueProps, 'children'> {
  * Semantic displayed initials for identities and avatar fallbacks. They take the
  * size, colour and weight of the avatar or chip that hosts them.
  */
-export declare function Initials({ value, strategy, maxCharacters, locale, fallback, size, type, weight, className, ref, ...props }: InitialsProps): import("react").JSX.Element;
+export declare function Initials({ value, strategy, maxCharacters, locale, fallback, size, type, weight, emptyLabel, className, ref, ...props }: InitialsProps): import("react").JSX.Element;

package/dist/components/primitives/link.d.ts

@@ -1,8 +1,15 @@
+import { useRender } from '@base-ui/react/use-render';
 import { type AnchorHTMLAttributes, type ReactNode, type Ref } from 'react';
 export interface LinkProps extends AnchorHTMLAttributes<HTMLElement> {
     children?: ReactNode;
     /** Rendered instead of a dead link when there is nothing to show. Defaults to an em dash. */
     emptyLabel?: ReactNode;
+    /**
+     * Router composition: an element or function that replaces the native anchor,
+     * such as `render={<RouterLink to="/orders/1001" />}`. It receives the link's
+     * classes, attributes and children; the router link supplies navigation.
+     */
+    render?: useRender.ComponentProps<'a'>['render'];
     /** The anchor when populated, or the shared empty span when content is absent. */
     ref?: Ref<HTMLElement>;
 }
@@ -12,7 +19,7 @@ export interface LinkProps extends AnchorHTMLAttributes<HTMLElement> {
  * and leading and stays underlined, because colour alone does not set a link
  * apart from the words around it.
  */
-export declare function Link({ children, emptyLabel, className, ref, ...props }: LinkProps): import("react").JSX.Element;
+export declare function Link({ children, ...props }: LinkProps): import("react").JSX.Element;
 export interface EmailProps extends Omit<LinkProps, 'href' | 'children' | 'ref'> {
     value?: string | null;
     display?: ReactNode;

package/dist/components/primitives/money.d.ts

@@ -14,7 +14,7 @@ export interface MoneyValue {
     currency?: string | null;
     /** Unit of the incoming amount. `minor` converts cents/pence before formatting. */
     unit?: MoneyUnit;
-    /** Number of minor units in one major unit. Defaults to 100. */
+    /** Number of minor units in one major unit. Defaults to the currency's own scale: 100 for USD, 1 for JPY, 1000 for KWD. */
     minorUnitScale?: number;
     /** Optional consumer-resolved symbol. Intl placement is preserved. */
     symbol?: string | null;

package/dist/components/primitives/number.d.ts

@@ -3,10 +3,11 @@ import { type TextProps } from '../typography';
 import type { TextSize } from '../../lib/ui-provider';
 type SpanProps = Omit<ComponentPropsWithoutRef<'span'>, 'children' | 'color'>;
 export interface NumberProps extends SpanProps {
+    /** A number or a decimal string. Grouped digits and either decimal separator are read; other text renders the empty label. */
     value?: number | string | null;
     /** BCP-47 locale override. Falls back to `UIProvider.formatting.locale`. */
     locale?: string;
-    /** Passed to `Intl.NumberFormat`; for example `signDisplay: 'exceptZero'` for deltas. */
+    /** Passed to `Intl.NumberFormat`; for example `signDisplay: 'exceptZero'` for deltas. Options Intl rejects render the empty label. */
     options?: Intl.NumberFormatOptions;
     /** Rendered with the shared empty treatment when the value is absent or unparsable. Defaults to an em dash. */
     emptyLabel?: ReactNode;

package/dist/components/typography/heading.d.ts

@@ -2,11 +2,17 @@ import type { HTMLAttributes, ReactNode, Ref } from 'react';
 import type { TextSize } from '../../lib/ui-provider';
 import { headingSizes, textAlignments } from './text.styles';
 export type HeadingTag = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+/** Non-heading elements that take the heading scale: a hero figure or display value outside the outline. */
+export type HeadingDisplayTag = 'p' | 'div' | 'span';
 export type HeadingSize = keyof typeof headingSizes;
 export interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
     ref?: Ref<HTMLHeadingElement>;
-    /** Semantic outline level. Defaults to `h3`; it never changes the visual size. */
-    tag?: HeadingTag;
+    /**
+     * Semantic outline level. Defaults to `h3`; it never changes the visual size.
+     * `p`, `div` or `span` renders the same scale with no heading semantics, for a
+     * hero figure or display value that is not part of the document outline.
+     */
+    tag?: HeadingTag | HeadingDisplayTag;
     /**
      * Visual emphasis, independent of `tag`. Defaults to the compact admin `base`.
      * `xl` and larger tighten tracking; `2xl` and larger also tighten leading.
@@ -24,4 +30,4 @@ export interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
     divider?: boolean;
 }
 /** Semantic heading levels share Themelia's restrained admin heading scale. */
-export declare function Heading({ tag: Tag, size, subHeading, subHeadingClassName, subHeadingSize, containerClassName, align, divider, className, children, ref, ...props }: HeadingProps): import("react").JSX.Element;
+export declare function Heading({ tag, size, subHeading, subHeadingClassName, subHeadingSize, containerClassName, align, divider, className, children, ref, ...props }: HeadingProps): import("react").JSX.Element;

package/dist/components/typography/index.d.ts

@@ -1,7 +1,7 @@
 export { Text } from './text';
 export type { TextProps } from './text';
 export { Heading } from './heading';
-export type { HeadingProps, HeadingTag, HeadingSize } from './heading';
+export type { HeadingProps, HeadingTag, HeadingDisplayTag, HeadingSize } from './heading';
 export { DisplayLabel } from './display-label';
 export type { DisplayLabelProps } from './display-label';
 export { Label } from './label';

package/dist/components/typography/text-link.d.ts

@@ -1,3 +1,4 @@
+import { useRender } from '@base-ui/react/use-render';
 import type { AnchorHTMLAttributes, Ref } from 'react';
 import type { TextProps } from './text';
 /**
@@ -24,11 +25,17 @@ export interface TextLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorEleme
      * leaves the hover treatment to the composition (a row, chip or menu).
      */
     underline?: boolean;
+    /**
+     * Router composition: an element or function that replaces the native anchor,
+     * such as `render={<RouterLink to="/orders" />}`. It receives the link's
+     * classes, attributes and children; the router link supplies navigation.
+     */
+    render?: useRender.ComponentProps<'a'>['render'];
     ref?: Ref<HTMLAnchorElement>;
 }
 /**
- * Native anchor sibling of `Text`: the same roles plus link focus and hover
- * states. Inside running text an unset size, weight and leading follow the
+ * Anchor sibling of `Text`: the same roles plus link focus and hover states.
+ * It renders a native `<a>`, or the router link passed to `render`. Inside running text an unset size, weight and leading follow the
  * sentence; the colour role stays, so the link still reads as a link.
  */
-export declare function TextLink({ type, size, weight, align, lineHeight, underline, className, ref, children, ...props }: TextLinkProps): import("react").JSX.Element;
+export declare function TextLink({ type, size, weight, align, lineHeight, underline, className, ref, render, children, ...props }: TextLinkProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/dist/components/ui/badge.d.ts

@@ -1,5 +1,3 @@
-import * as React from 'react';
-declare function Badge({ className, asChild, children, ...props }: React.ComponentProps<'span'> & {
-    asChild?: boolean;
-}): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+import { useRender } from '@base-ui/react/use-render';
+declare function Badge({ className, render, ...props }: useRender.ComponentProps<'span'>): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 export { Badge };

package/dist/components/ui/breadcrumb.d.ts

@@ -1,10 +1,9 @@
 import * as React from 'react';
+import { useRender } from '@base-ui/react/use-render';
 declare function Breadcrumb({ ...props }: React.ComponentProps<'nav'>): React.JSX.Element;
 declare function BreadcrumbList({ className, ...props }: React.ComponentProps<'ol'>): React.JSX.Element;
 declare function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
-declare function BreadcrumbLink({ asChild, className, ...props }: React.ComponentProps<'a'> & {
-    asChild?: boolean;
-}): React.JSX.Element;
+declare function BreadcrumbLink({ render, className, ...props }: useRender.ComponentProps<'a'>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 declare function BreadcrumbPage({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
 declare function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
 declare function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;

package/dist/components/ui/button.d.ts

@@ -1,12 +1,18 @@
 import { Button as ButtonPrimitive } from '@base-ui/react/button';
-import { type VariantProps } from 'class-variance-authority';
+import type { StrictVariantProps } from '../../lib/variant-props';
 import * as React from 'react';
 /** Internal presentation only; public buttons own the stable tone/style API. */
 export declare const buttonVariants: (props?: ({
     variant?: "secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined;
     size?: "sm" | "lg" | "xs" | "default" | "icon" | "icon-lg" | "icon-sm" | "icon-xs" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * A slot named by the consumer identifies the element. A trigger slot merged in
+ * by composition (`popover-trigger`, `tooltip-trigger`, `dropdown-menu-trigger`)
+ * does not: the element is still a `button`, so existing hooks keep matching.
+ */
+export declare function resolveButtonSlot(slot?: string): string;
 export declare namespace Button {
-    type Props = ButtonPrimitive.Props & VariantProps<typeof buttonVariants>;
+    type Props = ButtonPrimitive.Props & StrictVariantProps<typeof buttonVariants>;
 }
 export declare const Button: React.ForwardRefExoticComponent<Omit<Button.Props, "ref"> & React.RefAttributes<HTMLElement>>;

package/dist/components/ui/collapsible.d.ts

@@ -1,9 +1,6 @@
 import { Collapsible as CollapsiblePrimitive } from "@base-ui/react/collapsible";
 import * as React from "react";
 declare function Collapsible({ ...props }: CollapsiblePrimitive.Root.Props): React.JSX.Element;
-declare function CollapsibleTrigger({ asChild, nativeButton, render, children, ...props }: CollapsiblePrimitive.Trigger.Props & {
-    asChild?: boolean;
-    nativeButton?: boolean;
-}): React.JSX.Element;
+declare function CollapsibleTrigger({ nativeButton, render, children, ...props }: CollapsiblePrimitive.Trigger.Props): React.JSX.Element;
 declare function CollapsibleContent({ className, render, ...props }: CollapsiblePrimitive.Panel.Props): React.JSX.Element;
 export { Collapsible, CollapsibleTrigger, CollapsibleContent };

package/dist/components/ui/command.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 export type CommandFilter = (value: string, search: string, keywords?: string[]) => number;
 export type CommandProps = React.ComponentPropsWithRef<'div'> & {
-    asChild?: boolean;
+    /** Element rendered in place of the default tag; it receives this part's props. */ render?: React.ReactElement;
     label?: string;
     shouldFilter?: boolean;
     filter?: CommandFilter;
@@ -12,23 +12,25 @@ export type CommandProps = React.ComponentPropsWithRef<'div'> & {
     disablePointerSelection?: boolean;
     vimBindings?: boolean;
 };
-declare function Command({ children, className, asChild, label, shouldFilter, filter, value, defaultValue, onValueChange, loop, disablePointerSelection, vimBindings, ref, onKeyDown, onKeyDownCapture, ...props }: CommandProps): React.JSX.Element;
+declare function Command({ children, className, render, label, shouldFilter, filter, value, defaultValue, onValueChange, loop, disablePointerSelection, vimBindings, ref, onKeyDown, onKeyDownCapture, ...props }: CommandProps): React.JSX.Element;
 type CommandInputProps = Omit<React.ComponentPropsWithRef<'input'>, 'value' | 'onChange' | 'type'> & {
     value?: string;
-    onValueChange?: (value: string) => void;
-    asChild?: boolean;
+    onValueChange?: (value: string) => void; /** Element rendered in place of the default tag; it receives this part's props. */
+    render?: React.ReactElement;
 };
-declare function CommandInput({ className, value, onValueChange, asChild, children, ...props }: CommandInputProps): React.JSX.Element;
-declare function CommandList({ className, label, asChild, children, ...props }: React.ComponentPropsWithRef<'div'> & {
-    label?: string;
-    asChild?: boolean;
+declare function CommandInput({ className, value, onValueChange, render, ...props }: CommandInputProps): React.JSX.Element;
+declare function CommandList({ className, label, render, children, ...props }: React.ComponentPropsWithRef<'div'> & {
+    label?: string; /** Element rendered in place of the default tag; it receives this part's props. */
+    render?: React.ReactElement;
 }): React.JSX.Element;
-declare function CommandEmpty({ className, ...props }: React.ComponentPropsWithRef<'div'>): React.JSX.Element | null;
-declare function CommandGroup({ className, heading, value: _value, forceMount, children, asChild, ...props }: React.ComponentPropsWithRef<'div'> & {
+declare function CommandEmpty({ className, render, children, ...props }: React.ComponentPropsWithRef<'div'> & {
+    render?: React.ReactElement;
+}): React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;
+declare function CommandGroup({ className, heading, value, forceMount, children, render, ...props }: React.ComponentPropsWithRef<'div'> & {
     heading?: React.ReactNode;
     value?: string;
-    forceMount?: boolean;
-    asChild?: boolean;
+    forceMount?: boolean; /** Element rendered in place of the default tag; it receives this part's props. */
+    render?: React.ReactElement;
 }): React.JSX.Element;
 type CommandItemProps = Omit<React.ComponentPropsWithRef<'div'>, 'onSelect' | 'children'> & {
     children?: React.ReactNode | ((state: {
@@ -38,13 +40,13 @@ type CommandItemProps = Omit<React.ComponentPropsWithRef<'div'>, 'onSelect' | 'c
     onSelect?: (value: string) => void;
     keywords?: string[];
     forceMount?: boolean;
-    disabled?: boolean;
-    asChild?: boolean;
+    disabled?: boolean; /** Element rendered in place of the default tag; it receives this part's props. */
+    render?: React.ReactElement;
 };
-declare function CommandItem({ className, children, value: valueProp, keywords, forceMount, disabled, onSelect, onClick, asChild, ref, ...props }: CommandItemProps): React.JSX.Element | null;
-declare function CommandSeparator({ className, alwaysRender, asChild, children, ...props }: React.ComponentPropsWithRef<'div'> & {
-    alwaysRender?: boolean;
-    asChild?: boolean;
+declare function CommandItem({ className, children, value: valueProp, keywords, forceMount, disabled, onSelect, onClick, render, ref, ...props }: CommandItemProps): React.JSX.Element | null;
+declare function CommandSeparator({ className, alwaysRender, render, children, ...props }: React.ComponentPropsWithRef<'div'> & {
+    alwaysRender?: boolean; /** Element rendered in place of the default tag; it receives this part's props. */
+    render?: React.ReactElement;
 }): React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;
 declare function CommandShortcut({ className, ...props }: React.ComponentPropsWithRef<'span'>): React.JSX.Element;
 export { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandSeparator, CommandShortcut };

package/dist/components/ui/dialog.d.ts

@@ -2,9 +2,7 @@ import { type ThemePortalContainer } from '../../lib/theme-scope';
 import { Dialog as DialogPrimitive } from "@base-ui/react/dialog";
 import * as React from "react";
 declare function Dialog({ ...props }: DialogPrimitive.Root.Props): React.JSX.Element;
-declare function DialogTrigger({ asChild, ...props }: DialogPrimitive.Trigger.Props & {
-    asChild?: boolean;
-}): React.JSX.Element;
+declare function DialogTrigger({ ...props }: DialogPrimitive.Trigger.Props): React.JSX.Element;
 declare function DialogPortal({ container, className, ...props }: DialogPrimitive.Portal.Props): React.JSX.Element;
 declare function DialogClose({ ...props }: DialogPrimitive.Close.Props): React.JSX.Element;
 declare function DialogOverlay({ className, ...props }: DialogPrimitive.Backdrop.Props): React.JSX.Element;
@@ -17,10 +15,6 @@ declare function DialogHeader({ className, ...props }: React.ComponentProps<"div
 declare function DialogFooter({ className, showCloseButton, children, ...props }: React.ComponentProps<"div"> & {
     showCloseButton?: boolean;
 }): React.JSX.Element;
-declare function DialogTitle({ className, asChild, ...props }: DialogPrimitive.Title.Props & {
-    asChild?: boolean;
-}): React.JSX.Element;
-declare function DialogDescription({ className, asChild, ...props }: DialogPrimitive.Description.Props & {
-    asChild?: boolean;
-}): React.JSX.Element;
+declare function DialogTitle({ className, ...props }: DialogPrimitive.Title.Props): React.JSX.Element;
+declare function DialogDescription({ className, ...props }: DialogPrimitive.Description.Props): React.JSX.Element;
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };

package/dist/components/ui/empty.d.ts

@@ -1,10 +1,10 @@
-import { type VariantProps } from "class-variance-authority";
+import type { StrictVariantProps } from "../../lib/variant-props";
 declare function Empty({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
 declare function EmptyHeader({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
 declare const emptyMediaVariants: (props?: ({
     variant?: "default" | "icon" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function EmptyMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof emptyMediaVariants>): import("react").JSX.Element;
+declare function EmptyMedia({ className, variant, ...props }: React.ComponentProps<"div"> & StrictVariantProps<typeof emptyMediaVariants>): import("react").JSX.Element;
 declare function EmptyTitle({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
 declare function EmptyDescription({ className, ...props }: React.ComponentProps<"p">): import("react").JSX.Element;
 declare function EmptyContent({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;

package/dist/components/ui/input-group.d.ts

@@ -1,15 +1,15 @@
-import { type VariantProps } from "class-variance-authority";
+import type { StrictVariantProps } from "../../lib/variant-props";
 import * as React from "react";
 import { Button } from "./button";
 declare function InputGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 declare const inputGroupAddonVariants: (props?: ({
     align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>): React.JSX.Element;
+declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<"div"> & StrictVariantProps<typeof inputGroupAddonVariants>): React.JSX.Element;
 declare const inputGroupButtonVariants: (props?: ({
     size?: "sm" | "xs" | "icon-sm" | "icon-xs" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, "size" | "type"> & VariantProps<typeof inputGroupButtonVariants> & {
+declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, "size" | "type"> & StrictVariantProps<typeof inputGroupButtonVariants> & {
     type?: "button" | "submit" | "reset";
 }): React.JSX.Element;
 declare function InputGroupText({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;

package/dist/components/ui/item.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useRender } from "@base-ui/react/use-render";
-import { type VariantProps } from "class-variance-authority";
+import type { StrictVariantProps } from "../../lib/variant-props";
 import { Separator } from "./separator";
 declare function ItemGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 declare function ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): React.JSX.Element;
@@ -8,11 +8,11 @@ declare const itemVariants: (props?: ({
     variant?: "default" | "outline" | "muted" | null | undefined;
     size?: "sm" | "xs" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function Item({ className, variant, size, render, ...props }: useRender.ComponentProps<"div"> & VariantProps<typeof itemVariants>): React.JSX.Element;
+declare function Item({ className, variant, size, render, ...props }: useRender.ComponentProps<"div"> & StrictVariantProps<typeof itemVariants>): React.JSX.Element;
 declare const itemMediaVariants: (props?: ({
     variant?: "default" | "image" | "icon" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<"div"> & StrictVariantProps<typeof itemMediaVariants>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 declare function ItemContent({ className, ...props }: React.ComponentProps<"div">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 declare function ItemTitle({ className, ...props }: React.ComponentProps<"div">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 declare function ItemDescription({ className, ...props }: React.ComponentProps<"p">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;