themelia-react-ui 2.0.4 → 2.0.5

package/dist/components/base/action-menu/action-menu.d.ts

@@ -17,7 +17,7 @@ import type { LucideIcon } from 'lucide-react';
 import React, { type ComponentType, type ReactElement, type ReactNode } from 'react';
 import { Button, type ButtonSize } from '../buttons';
 import { type CollectionDensity } from '../popover/popover.recipes';
-import { DropdownMenuTrigger } from '../navigation/dropdown-menu';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from '../navigation/dropdown-menu';
 import type { ActionPresentation } from '../../../lib/action-presentation';
 import { type StringsProp } from '../../../lib/strings';
 import { type ActionMenuContext } from './action-menu.recipes';
@@ -85,6 +85,12 @@ export interface ActionMenuAction extends ActionPresentation {
     render?: ReactNode;
 }
 export interface ActionMenuProps {
+    /** Controlled menu visibility. Omit to let the menu manage its own state. */
+    open?: boolean;
+    /** Reports native menu open/close requests, including their event details. */
+    onOpenChange?: React.ComponentProps<typeof DropdownMenu>['onOpenChange'];
+    /** Native focus destination when the menu closes; defaults to its trigger. */
+    finalFocus?: React.ComponentProps<typeof DropdownMenuContent>['finalFocus'];
     /**
      * Commands to offer. Destructive entries are moved last unless
      * `preserveOrder` is set.

package/dist/components/base/buttons/button-group.recipes.d.ts

@@ -1,6 +1,6 @@
 /** Private Tailwind recipes; public props and DOM hooks remain owned by the component. */
 export declare const buttonGroupRecipes: {
-    readonly root: "inline-flex items-stretch rounded-inner box-border data-[orientation=vertical]:flex-col [&[data-orientation=horizontal]>:not(:last-child)]:rounded-e-none [&[data-orientation=horizontal]>:not(:first-child)]:rounded-s-none [&[data-orientation=horizontal]>:not(:first-child)]:border-s-0 [&[data-orientation=vertical]>:not(:last-child)]:rounded-b-none [&[data-orientation=vertical]>:not(:first-child)]:rounded-t-none [&[data-orientation=vertical]>:not(:first-child)]:border-t-0";
-    readonly text: "inline-flex items-center rounded-inner px-control-sm py-0 bg-muted border border-input text-sm text-muted-foreground";
+    readonly root: "inline-flex items-stretch rounded-radius box-border data-[orientation=vertical]:flex-col [&[data-orientation=horizontal]>:not(:last-child)]:rounded-e-none [&[data-orientation=horizontal]>:not(:first-child)]:rounded-s-none [&[data-orientation=horizontal]>:not(:first-child)]:border-s-0 [&[data-orientation=vertical]>:not(:last-child)]:rounded-b-none [&[data-orientation=vertical]>:not(:first-child)]:rounded-t-none [&[data-orientation=vertical]>:not(:first-child)]:border-t-0";
+    readonly text: "inline-flex items-center rounded-radius px-control-sm py-0 bg-muted border border-input text-sm text-muted-foreground";
     readonly separator: "bg-border w-px self-stretch";
 };

package/dist/components/base/cards/card.recipes.d.ts

@@ -14,8 +14,8 @@ export declare const cardRegionGapClasses: {
 };
 /** Private Tailwind recipes; public props and DOM hooks remain owned by the component. */
 export declare const cardRecipes: {
-    readonly root: "flex flex-col w-full font-sans rounded-radius box-border overflow-hidden py-surface gap-[calc(var(--surface-y)*var(--space-scale))] transition-[background-color,border-color,box-shadow] duration-150";
-    readonly shell: "@container/card flex flex-col w-full font-sans rounded-radius box-border overflow-hidden py-surface gap-[calc(var(--surface-y)*var(--space-scale))] transition-[background-color,border-color,box-shadow] duration-150";
+    readonly root: "flex flex-col w-full font-sans rounded-surface box-border overflow-hidden py-surface gap-[calc(var(--surface-y)*var(--space-scale))] transition-[background-color,border-color,box-shadow] duration-150";
+    readonly shell: "@container/card flex flex-col w-full font-sans rounded-surface box-border overflow-hidden py-surface gap-[calc(var(--surface-y)*var(--space-scale))] transition-[background-color,border-color,box-shadow] duration-150";
     readonly surfaceCard: "bg-card border border-border shadow-xs text-card-foreground";
     readonly surfaceDefault: "bg-card border border-border shadow-xs text-card-foreground";
     readonly surfaceFlat: "bg-transparent border-0 shadow-none text-inherit";
@@ -24,7 +24,9 @@ export declare const cardRecipes: {
     readonly surfaceSunken: "bg-muted border border-border text-foreground";
     readonly header: "flex flex-col gap-normal px-surface box-border";
     readonly headerRow: "flex-row flex-wrap items-start justify-between gap-space-lg pb-0";
-    readonly headerRowSingle: "items-center";
+    readonly headerTrailingInline: "-my-space-sm self-center";
+    readonly headerLeadingInline: "self-center";
+    readonly tooltipTriggerInline: "-my-space-xs";
     readonly headerLeading: "min-w-0 max-w-full flex-1 basis-64";
     readonly headerLeadingSingle: "basis-36";
     readonly headerTrailing: `flex max-w-full flex-wrap shrink-0 items-center ${string}`;
@@ -33,7 +35,7 @@ export declare const cardRecipes: {
     readonly titleSm: "text-sm";
     readonly titleMd: "text-base";
     readonly titleLg: "text-lg";
-    readonly content: "px-surface box-border min-w-0";
+    readonly content: `flex flex-col px-surface box-border min-w-0 ${string}`;
     readonly footer: "flex items-center px-surface box-border";
     readonly footerDivider: "border-t border-border [&.border-t]:!pt-surface";
     readonly alert: "px-surface";

package/dist/components/base/cards/partials/card-primitives.d.ts

@@ -8,12 +8,19 @@ import type { TextGap } from '../../structure';
  * applied here so the public DOM contract lives in one place.
  */
 import { type ComponentPropsWithRef, type ComponentPropsWithoutRef } from 'react';
-import type { CardTitleSize, SmartCardProps } from '../smart-card.types';
+import type { CardTitleSize, SmartCardProps, SmartCardSurface } from '../smart-card.types';
 type CardRegionProps = ComponentPropsWithRef<'div'> & {
     /** Full surface inset. Omit to retain the established inline-only inset. */
     padding?: SmartCardProps['padding'];
 };
-export declare function CardShell({ className, ...props }: ComponentPropsWithRef<'div'>): import("react").JSX.Element;
+export type CardShellProps = ComponentPropsWithRef<'div'> & {
+    /**
+     * Card's own surface chrome (fill, edge and elevation) for a hand-assembled
+     * card. Omit to draw only the layout shell and supply the chrome yourself.
+     */
+    surface?: SmartCardSurface;
+};
+export declare function CardShell({ className, surface, ...props }: CardShellProps): import("react").JSX.Element;
 export declare function CardHeader({ className, textGap, padding, ...props }: CardRegionProps & {
     textGap?: TextGap;
 }): import("react").JSX.Element;

package/dist/components/base/cards/partials/smart-card-header-row.d.ts

@@ -27,7 +27,9 @@ interface HeaderProps {
     actionsLabel: string;
     /** Card title typography. */
     titleSize: CardTitleSize;
+    /** Pull an action-height command into the title line. Off for the framed header, which centres both in its own action-height row. */
+    inlineCommands?: boolean;
     className?: string;
 }
-export declare function SmartCardHeaderRow({ icon, title, titleSuffix, description, textGap, tooltip, tooltipLabel, headerStart, headerEnd, headerAction, actions, actionsLabel, titleSize, className, }: HeaderProps): import("react").JSX.Element;
+export declare function SmartCardHeaderRow({ icon, title, titleSuffix, description, textGap, tooltip, tooltipLabel, headerStart, headerEnd, headerAction, actions, actionsLabel, titleSize, inlineCommands, className, }: HeaderProps): import("react").JSX.Element;
 export {};

package/dist/components/base/cards/smart-card.types.d.ts

@@ -74,10 +74,9 @@ export interface SmartCardProps extends Omit<ComponentPropsWithoutRef<'div'>, 'c
     /** Semantic gap between header, body and footer regions. Defaults to the selected surface block inset; explicit gaps use the spacing scale. */
     gap?: StructureGap;
     /**
-     * Opt-in semantic gap between direct body children. Omitted leaves their
-     * inline or caller-owned layout unchanged. Use `xl` for related siblings
-     * and `2xl` for independent body sections; grids and single features own
-     * their internal layout.
+     * Semantic gap between direct body children. Defaults to `xl` for related
+     * siblings. Use `2xl` for independent body sections or `none` for adjoining
+     * content; grids and single features own their internal layout.
      */
     contentGap?: StructureGap;
     /** Card title typography scale. Defaults to `UIProvider.density.defaultScale`. */

package/dist/components/base/cascader/cascader-panel.d.ts

@@ -0,0 +1,76 @@
+/**
+ * Private cascader panel: the levels, path header, search and branch loading
+ * shared by the Cascader field and hosts that already own a popover surface,
+ * such as the filters editor. Not a public entrypoint: its header uses the
+ * popover anatomy, so it renders inside a PopoverContent.
+ */
+import { type KeyboardEvent, type ReactNode } from 'react';
+import type { RowDensity } from '../../../lib/row-recipes';
+import type { CascaderChangeDetails, CascaderMode, CascaderNode, CascaderProps, CascaderStrings } from './cascader.types';
+export declare const defaultCascaderStrings: CascaderStrings;
+export declare const cascaderValues: (value: CascaderProps["value"]) => readonly string[];
+type LoadState = {
+    status: 'loading' | 'error';
+};
+export interface CascaderControllerOptions<T> {
+    items: readonly CascaderNode<T>[];
+    /** Selected node values; the host owns the value. */
+    selected: readonly string[];
+    /** Receives the next value; the host stores it and decides whether to close. */
+    onChange: (value: string | string[] | null, details: CascaderChangeDetails<T>) => void;
+    /** Whether the panel is showing. Opening reveals the selected path; closing aborts pending loads. */
+    open: boolean;
+    multiple?: boolean;
+    mode?: CascaderMode;
+    selectable?: CascaderProps<T>['selectable'];
+    disabled?: boolean;
+    searchable?: boolean;
+    density?: RowDensity;
+    strings: CascaderStrings;
+    loadChildren?: CascaderProps<T>['loadChildren'];
+}
+/** State, branch loading and keyboard navigation for one cascader panel. */
+export declare function useCascaderController<T>({ items, selected, onChange, open, multiple, mode, selectable, disabled, searchable, density, strings, loadChildren }: CascaderControllerOptions<T>): {
+    panel: import("react").RefObject<HTMLDivElement | null>;
+    path: string[];
+    query: string;
+    setQuery: import("react").Dispatch<import("react").SetStateAction<string>>;
+    direction: "forward" | "back" | null;
+    setDirection: import("react").Dispatch<import("react").SetStateAction<"forward" | "back" | null>>;
+    expanded: string[];
+    setExpanded: import("react").Dispatch<import("react").SetStateAction<string[]>>;
+    highlights: Map<string | undefined, string>;
+    setHighlights: import("react").Dispatch<import("react").SetStateAction<Map<string | undefined, string>>>;
+    loads: Map<string, LoadState>;
+    resolvedItems: CascaderNode<T>[];
+    index: Map<string, import("../tree/hierarchy").HierarchyEntry<T>>;
+    paths: import("../tree").TreeNode<T>[][];
+    activePath: string[];
+    current: import("../tree").TreeNode<T> | undefined;
+    results: import("../tree/hierarchy").HierarchyEntry<T>[] | null;
+    selected: readonly string[];
+    multiple: boolean;
+    mode: CascaderMode;
+    disabled: boolean;
+    searchable: boolean;
+    density: RowDensity;
+    strings: CascaderStrings;
+    canSelect: (node: CascaderNode<T>) => boolean;
+    commit: (node: CascaderNode<T> | null) => void;
+    load: (node: CascaderNode<T>, retry?: boolean) => Promise<void>;
+    enter: (node: CascaderNode<T>, level: number) => void;
+    goBack: (focusList?: boolean) => void;
+    levelKey: (event: KeyboardEvent<HTMLDivElement>, level: number) => void;
+};
+export type CascaderController<T> = ReturnType<typeof useCascaderController<T>>;
+interface CascaderPanelProps<T> {
+    controller: CascaderController<T>;
+    className?: string;
+    /** The host's header at the root level; a drilled level replaces it with its own, so one back control shows at a time. */
+    header?: ReactNode;
+    /** Starts a drilled level's path with the root label, for hosts whose header names the root. */
+    rootInPath?: boolean;
+}
+/** The header, search and levels of a cascader, inside an existing popover surface. */
+export declare function CascaderPanel<T>({ controller, className, header, rootInPath }: CascaderPanelProps<T>): import("react").JSX.Element;
+export {};

package/dist/components/base/chart/chart.d.ts

@@ -69,6 +69,11 @@ export interface ChartTooltipContentProps extends React.ComponentPropsWithoutRef
     name: NonNullable<ChartPayloadItem['name']>, item: ChartPayloadItem, index: number, 
     /** The raw data row for the hovered point. Supplied by Recharts. */
     payload?: Record<string, unknown>) => React.ReactNode;
+    /**
+     * Formats only each value, keeping the colour indicator and series label,
+     * for example to render currency. `formatter` replaces the whole row.
+     */
+    valueFormatter?: (value: NonNullable<ChartPayloadItem['value']>, name: NonNullable<ChartPayloadItem['name']>, item: ChartPayloadItem, index: number) => React.ReactNode;
     /** Overrides the colour of the tooltip indicator. */
     color?: string;
     /** Hides the tooltip label row. */
@@ -82,7 +87,7 @@ export interface ChartTooltipContentProps extends React.ComponentPropsWithoutRef
     /** Key in the payload holding the tooltip label. */
     labelKey?: string;
 }
-declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: ChartTooltipContentProps): React.JSX.Element | null;
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, valueFormatter, color, nameKey, labelKey, }: ChartTooltipContentProps): React.JSX.Element | null;
 declare const ChartLegend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
 export interface ChartLegendContentProps extends React.ComponentPropsWithoutRef<'div'> {
     hideIcon?: boolean;

package/dist/components/base/choice-inputs/choice-types.d.ts

@@ -61,7 +61,7 @@ export declare const choiceListSizeTokens: Record<ChoiceSize, string>;
  */
 export declare const choiceCardStateClasses: string;
 /** Optional option glyph: one neutral tile in every state, so colour stays for meaning. */
-export declare const choiceCardIconClasses = "inline-flex shrink-0 items-center justify-center rounded-inner bg-muted text-muted-foreground";
+export declare const choiceCardIconClasses = "inline-flex shrink-0 items-center justify-center rounded-radius bg-muted text-muted-foreground";
 /**
  * A control track exactly one label line tall. Pair it with the label's own text
  * role (size and leading) and align the row to its start: a checkbox, radio,

package/dist/components/base/combobox/index.d.ts

@@ -10,9 +10,9 @@
  * The compound root is exported as `ComboboxRoot` so the canonical `Combobox`
  * name stays with the opinionated feature component.
  */
-export { Combobox as ComboboxRoot, ComboboxValue, ComboboxPortal, ComboboxPositioner, ComboboxList, ComboboxItemIndicator, ComboboxEmpty, ComboboxStatus, ComboboxGroup, ComboboxGroupLabel, ComboboxCollection, ComboboxChips, ComboboxChipsInput, ComboboxBackdrop, ComboboxArrow, useComboboxFilter, } from '../../ui/combobox';
+export { Combobox as ComboboxRoot, ComboboxValue, ComboboxPortal, ComboboxPositioner, ComboboxItemIndicator, ComboboxEmpty, ComboboxStatus, ComboboxGroup, ComboboxGroupLabel, ComboboxCollection, ComboboxChips, ComboboxChipsInput, ComboboxBackdrop, ComboboxArrow, useComboboxFilter, } from '../../ui/combobox';
 import { type ComponentProps } from 'react';
-import { ComboboxItem as Item, ComboboxPopup as Popup, ComboboxInput as Input, ComboboxInputTrigger as InputTrigger, ComboboxClear as Clear, ComboboxChip as Chip, ComboboxTrigger as Trigger, ComboboxSeparator as Separator } from '../../ui/combobox';
+import { ComboboxList as List, ComboboxItem as Item, ComboboxPopup as Popup, ComboboxInput as Input, ComboboxInputTrigger as InputTrigger, ComboboxClear as Clear, ComboboxChip as Chip, ComboboxTrigger as Trigger, ComboboxSeparator as Separator } from '../../ui/combobox';
 import { type CollectionDensity } from '../popover/popover.recipes';
 import { type StringsProp } from '../../../lib/strings';
 import { type ComboboxControlStrings } from './combobox.strings';
@@ -41,6 +41,8 @@ export declare function ComboboxChip({ strings: stringsProp, ...props }: Combobo
     removeLabel?: string;
 }>;
 export declare function ComboboxPopup({ className, ...props }: ComponentProps<typeof Popup>): import("react").FunctionComponentElement<import("@base-ui/react").AutocompletePopupProps>;
+/** The list owns one compact collection inset inside the flush popup. */
+export declare function ComboboxList({ className, ...props }: ComponentProps<typeof List>): import("react").FunctionComponentElement<import("@base-ui/react").AutocompleteListProps>;
 export declare function ComboboxInput({ className, ...props }: ComponentProps<typeof Input>): import("react").FunctionComponentElement<import("@base-ui/react").AutocompleteInputProps>;
 export declare function ComboboxTrigger({ className, ...props }: ComponentProps<typeof Trigger>): import("react").FunctionComponentElement<import("@base-ui/react").ComboboxTriggerProps>;
 export declare function ComboboxItem({ className, size, density, children, ...props }: ComponentProps<typeof Item> & {

package/dist/components/base/feedback/alert.d.ts

@@ -1,5 +1,5 @@
 /**
- * Alert — base notice primitive with semantic variants and responsive actions.
+ * Alert — base notice primitive with semantic variants and container-driven actions.
  *
  * Package-owned notice inspired by ReUI's alert layout. Consumers import this
  * base alert for the library's typography, token, and DOM-hook contract.

package/dist/components/base/forms/form-sizing.d.ts

@@ -68,7 +68,7 @@ export declare const formControlMinHeightClasses: {
 /**
  * The one field frame, drawn by `Input` on its native field and by
  * `formFieldTriggerClasses` on button-shaped triggers: the `--input` boundary,
- * inner radius, transparent fill (the library is intentionally flat), control
+ * default radius, transparent fill (the library is intentionally flat), control
  * height, editable text size, control padding and the shared focus, invalid and
  * disabled states. Layout (`flex`, width) stays with each owner.
  *
@@ -97,9 +97,9 @@ export declare const formTextareaSizeClasses: {
  * line height, so the inset follows the editable text size on every pointer.
  */
 export declare const formTextareaInsetClasses: {
-    readonly sm: "py-[calc((var(--height-control)*8/9*var(--density-scale)-1lh)/2-1px)]";
+    readonly sm: "py-[calc((var(--height-control)*7/8*var(--density-scale)-1lh)/2-1px)]";
     readonly md: "py-[calc((var(--height-control)*var(--density-scale)-1lh)/2-1px)]";
-    readonly lg: "py-[calc((var(--height-control)*10/9*var(--density-scale)-1lh)/2-1px)]";
+    readonly lg: "py-[calc((var(--height-control)*9/8*var(--density-scale)-1lh)/2-1px)]";
 };
 /**
  * Top offsets that centre multi-line field affordances on the first line, where a
@@ -108,14 +108,14 @@ export declare const formTextareaInsetClasses: {
  */
 export declare const formTextareaAffordanceTopClasses: {
     readonly target: {
-        readonly sm: "top-[calc((var(--height-control)*8/9-1.375rem)*var(--density-scale)/2)]";
+        readonly sm: "top-[calc((var(--height-control)*7/8-1.375rem)*var(--density-scale)/2)]";
         readonly md: "top-[calc((var(--height-control)-1.375rem)*var(--density-scale)/2)]";
-        readonly lg: "top-[calc((var(--height-control)*10/9-1.375rem)*var(--density-scale)/2)]";
+        readonly lg: "top-[calc((var(--height-control)*9/8-1.375rem)*var(--density-scale)/2)]";
     };
     readonly icon: {
-        readonly sm: "top-[calc((var(--height-control)*8/9*var(--density-scale)-var(--icon))/2)]";
+        readonly sm: "top-[calc((var(--height-control)*7/8*var(--density-scale)-var(--icon))/2)]";
         readonly md: "top-[calc((var(--height-control)*var(--density-scale)-var(--icon))/2)]";
-        readonly lg: "top-[calc((var(--height-control)*10/9*var(--density-scale)-var(--icon))/2)]";
+        readonly lg: "top-[calc((var(--height-control)*9/8*var(--density-scale)-var(--icon))/2)]";
     };
 };
 export declare const formLabelSizeClasses: {

package/dist/components/base/forms/workflow.d.ts

@@ -18,11 +18,17 @@ export interface FormSectionProps {
     surface?: SmartCardSurface;
     /** Card region insets. Defaults to Card's ordinary inset; use `none` when the parent already owns padding. */
     padding?: CardProps['padding'];
+    /**
+     * Section title size. Embedded `surface="flat" padding="none"` inside a padded
+     * Card defaults to the subordinate `sm` title, below the card's own title;
+     * otherwise Card's default applies.
+     */
+    titleSize?: CardProps['titleSize'];
     className?: string;
     /** Merged onto the section body. */
     contentClassName?: string;
 }
-export declare function FormSection({ title, description, actions, children, footer, surface, padding, className, contentClassName, }: FormSectionProps): import("react").JSX.Element;
+export declare function FormSection({ title, description, actions, children, footer, surface, padding, titleSize, className, contentClassName, }: FormSectionProps): import("react").JSX.Element;
 export interface FormActionsBarProps {
     /** Action content used when `trailing` is not provided. */
     children?: ReactNode;

package/dist/components/base/forms-numeric/coordinates-input.d.ts

@@ -17,6 +17,10 @@ export interface CoordinatesInputStrings {
     lngPlaceholder: string;
     /** Anchor text for the Google Maps preview link. Empty string hides it. */
     previewLinkLabel: string;
+    /** Accessible name for the latitude input while `latLabel` is empty. */
+    latAccessibleLabel: string;
+    /** Accessible name for the longitude input while `lngLabel` is empty. */
+    lngAccessibleLabel: string;
 }
 export declare const defaultCoordinatesInputStrings: CoordinatesInputStrings;
 export interface CoordinatesInputProps {

package/dist/components/base/metadata-list/metadata-list.d.ts

@@ -33,7 +33,7 @@ export type MetadataDensity = 'default' | 'compact';
 type MetadataListSharedProps = {
     /** How many columns the grid layout uses. Accepts a per-breakpoint value. */
     columns?: ResponsiveValue<1 | 2 | 3 | 4>;
-    /** Measure responsive grid columns against the viewport (default) or this list's own width. */
+    /** Measure responsive grid columns against this list's own width (default) or the viewport. */
     adaptTo?: 'viewport' | 'container';
     /** Row spacing. `compact` tightens the list for dense panels. */
     density?: MetadataDensity;

package/dist/components/base/navigation/dropdown-menu.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Menu as MenuPrimitive } from '@base-ui/react/menu';
 import { type CollectionDensity } from '../popover/popover.recipes';
 declare function DropdownMenu({ ...props }: MenuPrimitive.Root.Props): React.JSX.Element;
-declare function DropdownMenuPortal({ container, ...props }: MenuPrimitive.Portal.Props): React.JSX.Element;
+declare function DropdownMenuPortal({ container, className, ...props }: MenuPrimitive.Portal.Props): React.JSX.Element;
 declare function DropdownMenuTrigger({ children, ...props }: MenuPrimitive.Trigger.Props): React.JSX.Element;
 declare function DropdownMenuContent({ positionMethod, align, alignOffset, side, sideOffset, className, density: densityProp, ...props }: MenuPrimitive.Popup.Props & Pick<MenuPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'positionMethod'> & {
     /** Vertical row rhythm. Inherits in submenus; defaults to default. */

package/dist/components/base/navigation/page-header/page-header-commands.d.ts

@@ -3,12 +3,12 @@
  *
  * The role chooses each command's treatment and place: outline secondary
  * commands, then one solid primary command, then the More actions menu for
- * overflow and destructive commands, which always closes the row. Below `sm`,
- * secondary commands collapse into that menu through CSS alone, so server and
- * client markup agree. PageHeading owns the row, so every header that takes
- * `primaryAction` and `secondaryActions` places its commands the same way.
+ * overflow and destructive commands, which always closes the row. Below the
+ * named header container breakpoint, every command collapses into that menu
+ * through CSS alone, so server and client markup agree. Both page and section
+ * headers use this owner for the same command behavior.
  */
-import type { ComponentType, MouseEvent, ReactNode } from 'react';
+import { type ComponentType, type MouseEvent, type ReactNode } from 'react';
 /**
  * A page command described by its role. `primaryAction` and `secondaryActions`
  * choose the treatment, so a command carries no tone or button style.
@@ -59,15 +59,22 @@ export interface PageHeaderLinkRenderProps {
 export type PageHeaderLinkRenderer = (props: PageHeaderLinkRenderProps) => ReactNode;
 /** Native anchor fallback, matching the layout default: external links open a new tab. */
 export declare const defaultPageHeaderLinkRenderer: PageHeaderLinkRenderer;
-/** Secondary commands rendered as buttons from `sm` up; later ones overflow. */
+/** Secondary commands rendered as buttons on wide headers; later ones overflow. */
 export declare const PAGE_HEADER_INLINE_SECONDARY_LIMIT = 2;
 export interface PageHeaderCommandsProps {
     primaryAction?: 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
+     * labels beside the primary command would crowd the header; `Infinity`
+     * keeps every routine command inline. @default 2
+     */
+    maxVisibleSecondaryActions?: number;
     /** Accessible name of the More actions menu trigger. */
     moreActionsLabel: string;
     renderLink?: PageHeaderLinkRenderer;
 }
 /** Whether the header has any role-based command to render. */
 export declare function hasPageHeaderCommands(primaryAction: PageHeaderAction | undefined, secondaryActions: readonly PageHeaderAction[] | undefined): boolean;
-export declare function PageHeaderCommands({ primaryAction, secondaryActions, moreActionsLabel, renderLink, }: PageHeaderCommandsProps): import("react").JSX.Element | null;
+export declare function PageHeaderCommands({ primaryAction, secondaryActions, maxVisibleSecondaryActions, moreActionsLabel, renderLink, }: PageHeaderCommandsProps): import("react").JSX.Element | null;

package/dist/components/base/navigation/page-header/page-header.d.ts

@@ -71,16 +71,23 @@ export interface PageHeadingProps {
     actions?: ReactNode;
     /**
      * The header's one main command: a solid primary button after the secondary
-     * commands, visible at every width.
+     * commands, placed in the command menu below 40rem of header width.
      */
     primaryAction?: PageHeaderAction;
     /**
      * Supporting commands in priority order. The first two render as outline
      * buttons before the primary command; the rest, and every destructive
      * command, move into the More actions menu, which always closes the row.
-     * Below `sm`, all secondary commands collapse into that menu.
+     * Below 40rem of header width, every command collapses into that menu.
      */
     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
+     * labels beside the primary command would crowd the header; `Infinity`
+     * keeps every routine command inline. @default 2
+     */
+    maxVisibleSecondaryActions?: number;
     /** Accessible name of the More actions menu trigger. Default: `'More actions'`. */
     moreActionsLabel?: string;
     /** Renders `href` commands as framework links. Defaults to a native anchor. */
@@ -110,7 +117,7 @@ export interface PageHeadingProps {
      */
     withSeparator?: boolean;
 }
-export declare function PageHeading({ eyebrow, title, description, textGap, headingTag, titleSize, badge, badges, breadcrumbs, leading, beforeTitle, titlePrefix, titleSuffix, afterDescription, actions, primaryAction, secondaryActions, moreActionsLabel, renderLink, children, className, contentClassName, eyebrowClassName, titleClassName, titleRowClassName, descriptionClassName, actionsClassName, withSeparator, }: PageHeadingProps): import("react").JSX.Element;
+export declare function PageHeading({ eyebrow, title, description, textGap, headingTag, titleSize, badge, badges, breadcrumbs, leading, beforeTitle, titlePrefix, titleSuffix, afterDescription, actions, primaryAction, secondaryActions, maxVisibleSecondaryActions, moreActionsLabel, renderLink, children, className, contentClassName, eyebrowClassName, titleClassName, titleRowClassName, descriptionClassName, actionsClassName, withSeparator, }: PageHeadingProps): import("react").JSX.Element;
 export declare namespace PageHeading {
     var displayName: string;
 }

package/dist/components/base/popover/popover.d.ts

@@ -26,8 +26,8 @@ export type PopoverContentInset = 'default' | 'compact' | 'flush';
 export type PopoverContentProps = PopoverContentBaseProps & {
     /**
      * Surface inset role. `default` is for card-like or multi-content popovers,
-     * `compact` for pure item/option collections, and `flush` when child regions
-     * own their padding.
+     * `compact` for item collections (or the small surface tier with explicit
+     * type="display"), and `flush` when child regions own their padding.
      */
     inset?: PopoverContentInset;
     /** Anatomy role; supplies the inferred inset only when inset is omitted. */
@@ -47,7 +47,7 @@ declare function PopoverTitle({ children, className, ...props }: PopoverTitleBas
 type PopoverDescriptionBaseProps = React.ComponentProps<typeof PopoverDescriptionPrimitive>;
 declare function PopoverDescription({ children, className, ...props }: PopoverDescriptionBaseProps): React.JSX.Element;
 type PopoverFooterProps = React.ComponentProps<'div'> & {
-    /** Leading supporting content, aligned with collection labels; children are trailing actions. */
+    /** Leading supporting content, one small step inside the region edge like the header; children are trailing actions. */
     caption?: React.ReactNode;
 };
 declare function PopoverFooter({ className, children, caption, ...props }: PopoverFooterProps): React.JSX.Element;

package/dist/components/base/popover/popover.recipes.d.ts

@@ -1,4 +1,4 @@
-import { type RowDensity } from '../../../lib/row-recipes';
+import type { RowDensity } from '../../../lib/row-recipes';
 /** Shared anchored-surface chrome; Menu and Popover retain their own accessible behavior. */
 /**
  * One width scale for anchored surfaces. Menus, pickers and popovers choose a
@@ -15,18 +15,22 @@ export declare const popoverWidthRecipes: {
     readonly menuMin: "min-w-40";
 };
 export declare const popoverRecipes: {
-    readonly surface: "box-border max-w-[calc(100vw-2rem)] rounded-radius border border-border bg-popover text-popover-foreground shadow-md ring-0";
+    readonly surface: "box-border max-w-[calc(100vw-2rem)] rounded-surface border border-border bg-popover text-popover-foreground shadow-md ring-0";
     readonly display: "p-surface";
-    readonly menu: "p-surface-xs";
-    readonly menuRegion: "px-surface-xs py-space-md";
+    readonly displayCompact: "p-surface-xs";
+    readonly menu: "p-space-md";
+    readonly menuInline: "px-space-md";
+    readonly menuRegion: "px-space-md py-space-md";
+    readonly menuCopyInset: "px-space-xs";
+    readonly menuSearch: "[&_[data-slot=command-input-wrapper]]:p-space-md";
     readonly separator: "mx-0 my-space-xs h-px w-full shrink-0 bg-border/60";
-    readonly row: "box-border min-h-control rounded-inner px-row-x gap-space-sm font-medium leading-tight";
+    readonly row: "box-border min-h-control rounded-radius px-row-x gap-space-sm font-medium leading-tight";
 };
 export type PopoverContentType = 'display' | 'menu';
 /** One surface inset vocabulary for Popover, Command and their collections. */
 export declare const surfaceInsetClasses: {
     readonly default: "p-surface";
-    readonly compact: "p-surface-xs";
+    readonly compact: "p-space-md";
     readonly flush: "p-0";
 };
 /** Collection density changes vertical rhythm; inline room and primary text stay stable. */

package/dist/components/base/sheet/sheet.d.ts

@@ -23,6 +23,8 @@ export declare const SheetClose: React.ForwardRefExoticComponent<Omit<import("@b
 export declare const SheetContent: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").AlertDialogPopupProps & {
     side?: "top" | "right" | "bottom" | "left";
     showCloseButton?: boolean;
+    forceRenderBackdrop?: boolean;
+    backdropClassName?: string;
 } & {
     container?: import("../../../lib/theme-scope").ThemePortalContainer;
 }, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/base/sidebar/index.d.ts

@@ -1,4 +1,4 @@
-export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, defaultSidebarStrings, type SidebarProps, type SidebarInputProps, type SidebarMenuBadgeProps, type SidebarMenuButtonProps, type SidebarMenuDensity, type SidebarMenuProps, type SidebarMenuSkeletonProps, type SidebarMenuSubButtonProps, type SidebarProviderProps, type SidebarStrings, } from './sidebar';
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRegion, SidebarRail, SidebarSeparator, SidebarTrigger, defaultSidebarStrings, type SidebarProps, type SidebarInputProps, type SidebarMenuBadgeProps, type SidebarMenuButtonProps, type SidebarMenuDensity, type SidebarMenuProps, type SidebarMenuSkeletonProps, type SidebarMenuSubButtonProps, type SidebarProviderProps, type SidebarRegionProps, type SidebarPanelId, type SidebarPresentation, type SidebarStrings, } from './sidebar';
 /**
  * @deprecated Use `useLayoutSidebar` from `themelia-react-ui/layout/sidebar`.
  * This vendored compatibility re-export remains available through 1.x.

package/dist/components/base/sidebar/sidebar.d.ts

@@ -1,11 +1,12 @@
 /**
  * base/sidebar — tokenized wrapper around the shadcn `Sidebar` compound component.
  *
- * The shadcn source stays untouched. This layer applies the package shell,
+ * The internal Base UI owner supplies shared state. This layer applies the package shell,
  * density, spacing, typography, focus, and stable DOM-hook contracts while
  * preserving every compound part and polymorphic `render` seam.
  */
 import * as React from 'react';
+import { type SidebarPanelId, type SidebarPresentation, type SidebarStateProps } from '../../ui/sidebar-state';
 import { SidebarContent as SidebarContentPrimitive, SidebarFooter as SidebarFooterPrimitive, SidebarGroup as SidebarGroupPrimitive, SidebarGroupAction as SidebarGroupActionPrimitive, SidebarGroupContent as SidebarGroupContentPrimitive, SidebarGroupLabel as SidebarGroupLabelPrimitive, SidebarHeader as SidebarHeaderPrimitive, SidebarInput as SidebarInputPrimitive, SidebarInset as SidebarInsetPrimitive, SidebarMenu as SidebarMenuPrimitive, SidebarMenuAction as SidebarMenuActionPrimitive, SidebarMenuBadge as SidebarMenuBadgePrimitive, SidebarMenuButton as SidebarMenuButtonPrimitive, SidebarMenuItem as SidebarMenuItemPrimitive, SidebarMenuSub as SidebarMenuSubPrimitive, SidebarMenuSubButton as SidebarMenuSubButtonPrimitive, SidebarMenuSubItem as SidebarMenuSubItemPrimitive, SidebarRail as SidebarRailPrimitive, SidebarSeparator as SidebarSeparatorPrimitive, SidebarTrigger as SidebarTriggerPrimitive, useSidebar as useSidebarPrimitive } from '../../ui/sidebar';
 import type { ComponentScale } from '../../../lib/component-vocabulary';
 import { type StringsProp } from '../../../lib/strings';
@@ -15,6 +16,10 @@ export interface SidebarStrings {
 }
 export declare const defaultSidebarStrings: SidebarStrings;
 export interface SidebarProps extends React.ComponentProps<'div'> {
+    /** Explicit state identity; otherwise inherits the nearest shell region. */
+    panelId?: SidebarPanelId;
+    /** Desktop canvas treatment. Drawers always retain their opaque sidebar surface. */
+    surface?: 'default' | 'transparent';
     /** Edge where the desktop rail and mobile sheet are anchored. */
     side?: 'left' | 'right';
     /** Surface treatment and inset behavior for the desktop shell. */
@@ -27,7 +32,7 @@ export interface SidebarProps extends React.ComponentProps<'div'> {
     surfaceClassName?: string;
     /** Classes for the responsive positioning root. */
     rootClassName?: string;
-    /** Copy for the visually hidden mobile sheet title and description. */
+    /** Copy for the mobile drawer heading and accessible description. */
     strings?: StringsProp<SidebarStrings>;
 }
 type SidebarContentProps = React.ComponentProps<typeof SidebarContentPrimitive>;
@@ -83,7 +88,7 @@ export interface SidebarMenuSubButtonProps extends Omit<React.ComponentProps<typ
     active?: boolean;
 }
 type SidebarMenuSubItemProps = React.ComponentProps<typeof SidebarMenuSubItemPrimitive>;
-export interface SidebarProviderProps extends React.ComponentProps<'div'> {
+export interface SidebarProviderProps extends React.ComponentProps<'div'>, SidebarStateProps {
     /** Use the provider width for drawers in embedded workspaces; viewport remains the default. */
     adaptTo?: 'viewport' | 'container';
     /** Initial expanded state for uncontrolled sidebars. @default true */
@@ -105,8 +110,24 @@ type SidebarRailProps = React.ComponentProps<typeof SidebarRailPrimitive>;
 type SidebarSeparatorProps = React.ComponentProps<typeof SidebarSeparatorPrimitive>;
 type SidebarTriggerProps = React.ComponentProps<typeof SidebarTriggerPrimitive>;
 declare function SidebarProvider({ className, style, menuDensity, ...props }: SidebarProviderProps): React.JSX.Element;
+export interface SidebarRegionProps extends Omit<React.ComponentProps<'div'>, 'ref'> {
+    /** Ref to the semantic aside boundary. */
+    ref?: React.Ref<HTMLElement>;
+    /** Named desktop/drawer state and descendant scope owned by this region. */
+    panelId: SidebarPanelId;
+    /** Minimum available width for docking; primary/secondary/aside default to 768/1024/1440. Zero stays docked. */
+    dockAt?: number;
+    /** Persistent region geometry, separate from docked/drawer presentation. */
+    presentation?: 'panel' | 'rail';
+    /** Physical edge inherited by the scoped Sidebar and its drawer. @default 'left' */
+    side?: 'left' | 'right';
+    /** Expanded CSS length; defaults to --shell-sidebar-width. Rail widths derive from existing density roots. */
+    width?: string;
+}
+/** A named state and width boundary. Shells can also use static content without a provider. */
+declare function SidebarRegion({ panelId, dockAt, presentation, side, width, className, style, ref: forwardedRef, children, ...props }: SidebarRegionProps): React.JSX.Element;
 /** Tokenized responsive sidebar shell with contained and viewport-fixed modes. */
-declare function Sidebar({ side, variant, collapsible, contained, className, surfaceClassName, rootClassName, children, dir, strings: stringsProp, ...props }: SidebarProps): React.JSX.Element;
+declare function Sidebar(props: SidebarProps): React.JSX.Element;
 declare function SidebarHeader({ className, ...props }: SidebarHeaderProps): React.JSX.Element;
 declare function SidebarFooter({ className, ...props }: SidebarFooterProps): React.JSX.Element;
 declare function SidebarContent({ className, ...props }: SidebarContentProps): React.JSX.Element;
@@ -128,8 +149,9 @@ declare function SidebarTrigger({ className, ...props }: SidebarTriggerProps): R
 declare function SidebarMenuButton({ className, render, size, tooltip, children, active, ...props }: SidebarMenuButtonProps): React.JSX.Element;
 declare function SidebarMenuSubButton({ className, children, active, ...props }: SidebarMenuSubButtonProps): React.JSX.Element;
 declare function SidebarGroupLabel({ className, children, ...props }: SidebarGroupLabelProps): React.JSX.Element;
-export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, };
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRegion, SidebarRail, SidebarSeparator, SidebarTrigger, };
 /** Internal bridge for the layout layer; not part of the base package entrypoint. */
 export declare const useBaseSidebarContext: typeof useSidebarPrimitive;
 /** Internal density bridge for composed navigation; not a base entrypoint export. */
 export declare function useBaseSidebarMenuDensity(): SidebarMenuDensity | undefined;
+export type { SidebarPanelId, SidebarPresentation };

package/dist/components/base/toaster/index.d.ts

@@ -1 +1,2 @@
 export { Toaster, type ToasterProps } from './toaster';
+export { toast } from 'sonner';

package/dist/components/blocks/ai/ai-file-tree/types.d.ts

@@ -38,7 +38,7 @@ export interface AiFileTreeProps extends Omit<ComponentProps<'div'>, 'children'
     selectedId?: string;
     /** Click handler — fires for files only by default. */
     onSelect?: (node: AiFileTreeNode) => void;
-    /** Hide diff status badges; semantic icon colors remain visible. */
+    /** Hide diff status badges; each file icon then takes its status colour instead. With badges shown, icons stay neutral. */
     hideStatusLabels?: boolean;
     /** Indent width per nesting level (px). Omit for the shared token-backed hierarchy inset. */
     indent?: number;