@imfusion/web-ui 0.10.1-dev.6.gf715361a → 0.10.1-dev.60.g7891a716

package/dist/components/app-shell/app-shell.d.ts

@@ -1,29 +1,62 @@
-import { Button as ButtonPrimitive } from '@base-ui/react/button';
 import { useRender } from '@base-ui/react/use-render';
 import { VariantProps } from 'class-variance-authority';
 declare const navbarSurface: (props?: ({
     variant?: "default" | "branded" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-declare function Root({ ref, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+/**
+ * AppShell — application layout shell.
+ *
+ * The classic dashboard frame: collapsible navbar/aside sidebars, a page
+ * header, an optional footer, and a scrolling main content area. Also called
+ * an app layout, application frame, dashboard shell, or sidebar layout.
+ *
+ * Composed of eight sub-components used with dot-notation: `AppShell.Root` wraps
+ * `AppShell.Header`, `AppShell.Navbar`, `AppShell.Aside`, `AppShell.Footer`,
+ * `AppShell.Main`, and (inside a sidebar) `AppShell.Section` and `AppShell.NavItem`.
+ *
+ * Sizing is CSS-driven — override the `--imf-ui-appshell-*` custom properties
+ * rather than passing dimension props. Below the responsive breakpoints the
+ * navbar (`md`) and aside (`lg`) open as drawers, and the shell renders the
+ * navbar's toggle itself.
+ *
+ * Copied and adapted from Mantine's AppShell; no upstream runtime dependency.
+ * MIT licensed (see Mantine repo).
+ *
+ * @see https://mantine.dev/llms/core-app-shell.md
+ */
+declare function Root({ ref, children, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
 declare namespace Root {
     var displayName: string;
 }
-declare function Header(props: React.ComponentProps<"header">): import("react/jsx-runtime").JSX.Element;
+/**
+ * AppShell.Header — the page row: a title and actions at every width. Below `md` it sits under the shell's bar, and from
+ * `md` it sits beside the rail.
+ */
+declare function Header({ className, children, ...props }: React.ComponentProps<"header">): import("react/jsx-runtime").JSX.Element;
 declare namespace Header {
     var displayName: string;
 }
 type DrawerProps = {
     /** Whether the drawer is open below the breakpoint. Ignored while the section is docked. */
     open?: boolean;
+    /** Whether the drawer starts open when `open` is omitted. */
+    defaultOpen?: boolean;
     /** Called when the drawer asks to open or close: scrim, swipe, or Escape. */
     onOpenChange?: (open: boolean) => void;
 };
-type NavbarProps = React.ComponentProps<"nav"> & VariantProps<typeof navbarSurface> & DrawerProps;
+type NavbarProps = React.ComponentProps<"nav"> & VariantProps<typeof navbarSurface> & DrawerProps & {
+    /** The brand at the top of the rail. Defaults to the ImFusion logo; `null` leaves the row empty. */
+    logo?: React.ReactNode;
+    /** The signed-in account at the foot of the rail, usually an `AccountCard`. Without it the foot is omitted. */
+    account?: React.ReactNode;
+};
 /**
- * `variant="branded"` paints the primary color; children opt into on-color themselves. Below `md` the navbar opens as a
- * drawer from the inline end.
+ * The navbar owns its frame: `logo` on top, the children (nav items) in the middle, `account` at the foot. Without a
+ * Header the logo's bottom edge sits on the baseline of Main's first heading. `variant="branded"` paints the primary
+ * color; children opt into on-color themselves. Below `md` the navbar opens as a drawer from the inline start, with its
+ * close on the logo row.
  */
-declare function Navbar({ variant, open, onOpenChange, ...props }: NavbarProps): import("react/jsx-runtime").JSX.Element;
+declare function Navbar({ variant, open, defaultOpen, onOpenChange, logo, account, children, id, ...props }: NavbarProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Navbar {
     var displayName: string;
 }
@@ -34,9 +67,11 @@ type AsideProps = React.ComponentProps<"aside"> & DrawerProps & {
     onWidthChange?: (width: number) => void;
     /** Accessible name of the drag handle. */
     resizeLabel?: string;
+    /** Accessible name of the close button shown while the aside is a drawer. */
+    closeLabel?: string;
 };
 /** Below `lg` the aside opens as a drawer: from the bottom on phones, from the inline end on tablets. */
-declare function Aside({ open, onOpenChange, resizable, onWidthChange, resizeLabel, children, ...props }: AsideProps): import("react/jsx-runtime").JSX.Element;
+declare function Aside({ open, defaultOpen, onOpenChange, resizable, onWidthChange, resizeLabel, closeLabel, children, ...props }: AsideProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Aside {
     var displayName: string;
 }
@@ -44,7 +79,7 @@ declare function Footer(props: React.ComponentProps<"footer">): import("react/js
 declare namespace Footer {
     var displayName: string;
 }
-declare function Main(props: React.ComponentProps<"main">): import("react/jsx-runtime").JSX.Element;
+declare function Main({ children, ...props }: React.ComponentProps<"main">): import("react/jsx-runtime").JSX.Element;
 declare namespace Main {
     var displayName: string;
 }
@@ -56,20 +91,6 @@ declare function Section({ grow, ...props }: SectionProps): import("react/jsx-ru
 declare namespace Section {
     var displayName: string;
 }
-type BurgerProps = React.ComponentProps<typeof ButtonPrimitive> & {
-    /** Whether the navigation it controls is open; draws the cross and sets `aria-expanded`. */
-    opened?: boolean;
-    /** Accessible name. Defaults to "Open navigation" or "Close navigation" from `opened`. */
-    label?: string;
-};
-/**
- * AppShell.Burger — the header's menu toggle: three sheared bands that cross when `opened`. Takes its color from the
- * surface and hides from `md` up, where the navbar is docked.
- */
-declare function Burger({ opened, label, className, ...props }: BurgerProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Burger {
-    var displayName: string;
-}
 type NavItemProps = useRender.ComponentProps<"a"> & {
     /** Leading icon, decorative. */
     icon?: React.ReactNode;
@@ -78,10 +99,11 @@ type NavItemProps = useRender.ComponentProps<"a"> & {
 };
 /**
  * AppShell.NavItem — a navbar link: icon, mono label, and an optional description. Takes its color from the navbar;
- * `aria-current="page"` marks the current page. Pass a router link through `render`.
+ * `aria-current="page"` underlines the label. Pass a router link through `render`. Followed inside the navbar drawer,
+ * it closes the drawer.
  */
-declare function NavItem({ icon, description, children, render, ...props }: NavItemProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
+declare function NavItem({ icon, description, children, render, onClick, ...props }: NavItemProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
 declare namespace NavItem {
     var displayName: string;
 }
-export { Root, Header, Navbar, Aside, Footer, Main, Section, Burger, NavItem };
+export { Root, Header, Navbar, Aside, Footer, Main, Section, NavItem };

package/dist/components/callout/callout.d.ts

@@ -22,7 +22,7 @@ declare function Icon({ children, ...props }: React.ComponentProps<"span">): imp
 declare namespace Icon {
     var displayName: string;
 }
-/** Callout.Title — an optional short heading, set in the semi-mono UPPERCASE technical voice. */
+/** Callout.Title — an optional short heading, set in the mono UPPERCASE technical voice. */
 declare function Title(props: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
 declare namespace Title {
     var displayName: string;

package/dist/components/chip/chip.d.ts

@@ -7,5 +7,5 @@ type Props = React.ComponentProps<"span"> & VariantProps<typeof chip> & {
  * Chip — compact inline label for status or category.
  * Not based on any upstream component.
  */
-export declare function Chip({ variant, appearance, inline, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function Chip({ variant, appearance, inline, children, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/color-scheme-toggle/color-scheme-preference.d.ts

@@ -0,0 +1,3 @@
+import { ColorSchemePreference } from '../../types/theme';
+/** Narrows a `ToggleGroup` value entry to a scheme preference. */
+export declare function isColorSchemePreference(value: unknown): value is ColorSchemePreference;

package/dist/components/color-scheme-toggle/color-scheme-toggle.d.ts

@@ -0,0 +1,17 @@
+import { ToggleGroup } from '../toggle-group';
+type Props = Omit<React.ComponentProps<typeof ToggleGroup>, "value" | "defaultValue" | "onValueChange" | "multiple" | "children"> & {
+    /** Accessible name of the group. */
+    label?: string;
+    /** Text of the segment that picks the light scheme. */
+    lightLabel?: string;
+    /** Text of the segment that follows the operating system. */
+    systemLabel?: string;
+    /** Text of the segment that picks the dark scheme. */
+    darkLabel?: string;
+};
+/**
+ * ColorSchemeToggle - lets the user pick Light, System, or Dark. It reads and stores the preference through
+ * `useColorScheme`, so placing it is enough. System stays pressed while the page follows the operating system.
+ */
+export declare function ColorSchemeToggle({ label, lightLabel, systemLabel, darkLabel, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/color-scheme-toggle/color-scheme-toggle.meta.d.ts

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const colorSchemeToggleMeta: ComponentMeta;

package/dist/components/color-scheme-toggle/index.d.ts

@@ -0,0 +1,2 @@
+export { ColorSchemeToggle } from './color-scheme-toggle';
+export { colorSchemeToggleMeta } from './color-scheme-toggle.meta';

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

@@ -0,0 +1,151 @@
+import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';
+import { VariantProps } from 'class-variance-authority';
+import * as ScrollArea from '../scroll-area/scroll-area';
+type HeaderVariant = "primary" | "main" | "support" | "minor";
+declare const dialogTrigger: (props?: ({
+    inline?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const dialogStatus: (props?: ({
+    variant?: "positive" | "negative" | "warning" | "info" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const createHandle: typeof DialogPrimitive.createHandle;
+type RootProps<Payload = unknown> = React.ComponentProps<typeof DialogPrimitive.Root<Payload>>;
+/**
+ * Dialog.Root — container that manages open/closed state.
+ *
+ * @see https://base-ui.com/react/components/dialog
+ * @llm https://base-ui.com/react/components/dialog.md
+ */
+export declare function Root<Payload = unknown>(props: RootProps<Payload>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Root {
+    var displayName: string;
+}
+/** Dialog.Trigger — button that opens the dialog. `inline` styles it as a dashed-underlined term inside running text. */
+export declare function Trigger({ inline, ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger> & VariantProps<typeof dialogTrigger>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Trigger {
+    var displayName: string;
+}
+/** Dialog.Portal — renders backdrop and popup in a portal outside the main document flow. */
+export declare function Portal(props: React.ComponentProps<typeof DialogPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Portal {
+    var displayName: string;
+}
+/** Dialog.Backdrop — flat dark overlay that dims the page behind the dialog. */
+export declare function Backdrop(props: React.ComponentProps<typeof DialogPrimitive.Backdrop>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Backdrop {
+    var displayName: string;
+}
+/** Dialog.Viewport — full-screen container that centres the popup. */
+export declare function Viewport(props: React.ComponentProps<typeof DialogPrimitive.Viewport>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Viewport {
+    var displayName: string;
+}
+interface PopupProps extends React.ComponentProps<typeof DialogPrimitive.Popup> {
+    /**
+     * Width of the window. `full` fills the screen minus a margin.
+     * @default 'md'
+     */
+    size?: "sm" | "md" | "lg" | "full";
+}
+/** Dialog.Popup — the window. Holds Header, Body, and Footer, or any free content. */
+export declare function Popup({ size, ...props }: PopupProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Popup {
+    var displayName: string;
+}
+type HeaderProps = React.ComponentProps<"div"> & {
+    /**
+     * Colour of the header band. On `primary` the title, description, and close button turn light.
+     * @default 'main'
+     */
+    variant?: HeaderVariant;
+};
+/** Dialog.Header — band at the top of the popup that holds the title, description, and close button. */
+export declare function Header({ variant, ...props }: HeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Header {
+    var displayName: string;
+}
+/** Dialog.Body — the scrolling region between header and footer, a ScrollArea with the library's thumb and edge fades. */
+export declare function Body({ children, ...props }: React.ComponentProps<typeof ScrollArea.Auto>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Body {
+    var displayName: string;
+}
+/** Dialog.Footer — row of actions pinned to the bottom of the popup. */
+export declare function Footer(props: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+export declare namespace Footer {
+    var displayName: string;
+}
+type StatusProps = React.ComponentProps<"div"> & VariantProps<typeof dialogStatus>;
+/**
+ * Dialog.Status — a tinted column at the start of the popup, spanning its full height, that marks the dialog's
+ * status with the variant's glyph. Place it first inside `Dialog.Popup`. Pass children to replace the glyph.
+ * Decorative (`aria-hidden`); the title carries the status.
+ */
+export declare function Status({ variant, children, ...props }: StatusProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Status {
+    var displayName: string;
+}
+/** Dialog.Title — heading that names the dialog for screen readers, set as `Typo.H2`. Light on a `primary` header. */
+export declare function Title(props: React.ComponentProps<typeof DialogPrimitive.Title>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Title {
+    var displayName: string;
+}
+/** Dialog.Description — supplementary paragraph that describes the dialog for screen readers, set as `Typo.P`. */
+export declare function Description(props: React.ComponentProps<typeof DialogPrimitive.Description>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Description {
+    var displayName: string;
+}
+/**
+ * Dialog.Close — button that closes the dialog. With no `children` and no `render` it renders the library's ghost close
+ * button (a boxed × icon labelled "Close"); otherwise render your own `Button`.
+ */
+export declare function Close(props: React.ComponentProps<typeof DialogPrimitive.Close>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Close {
+    var displayName: string;
+}
+type ComposedProps = Omit<React.ComponentProps<typeof DialogPrimitive.Root>, "children"> & {
+    /** Heading of the dialog. */
+    title: React.ReactNode;
+    /** Short uppercase label above the title. */
+    eyebrow?: React.ReactNode;
+    /** Line of context under the title. */
+    description?: React.ReactNode;
+    /** Adds a `Dialog.Status` with this variant at the start of the popup. */
+    status?: NonNullable<VariantProps<typeof dialogStatus>["variant"]>;
+    /**
+     * Colour of the header band.
+     */
+    headerVariant?: HeaderVariant;
+    /**
+     * Width of the window.
+     */
+    size?: PopupProps["size"];
+    /**
+     * Content of the footer, usually buttons. The footer renders only when this is set, and then replaces the header's
+     * close button, so include a way out such as a Cancel `Dialog.Close`.
+     */
+    actions?: React.ReactNode;
+    /** Content of the body. */
+    children?: React.ReactNode;
+};
+type SimpleProps = ComposedProps & {
+    /** Element rendered as the trigger, such as a `Button`. Omit it for a controlled dialog. */
+    trigger?: React.ReactElement;
+};
+/**
+ * Dialog.Simple — pre-composed dialog: trigger, header with title, description, and optional status, a scrolling body,
+ * and either a close button in the header or a footer of `actions`. Root props pass through.
+ */
+export declare function Simple({ trigger, headerVariant, size, ...props }: SimpleProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Simple {
+    var displayName: string;
+}
+type InlineProps = ComposedProps & {
+    /** Text of the trigger, set as an inline term inside running prose. */
+    trigger: React.ReactNode;
+};
+/** Dialog.Inline — like Dialog.Simple, but the trigger is text inside a sentence. */
+export declare function Inline({ trigger, headerVariant, size, ...props }: InlineProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Inline {
+    var displayName: string;
+}
+export {};

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

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const dialogMeta: ComponentMeta;

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

@@ -0,0 +1,2 @@
+export * as Dialog from './dialog';
+export { dialogMeta } from './dialog.meta';

package/dist/components/drawer/drawer.d.ts

@@ -63,7 +63,7 @@ export declare namespace Popup {
     var displayName: string;
 }
 /** Drawer.Content — scrollable content wrapper inside the popup. */
-export declare function Content(props: React.ComponentProps<typeof DrawerPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export declare function Content({ children, ...props }: React.ComponentProps<typeof DrawerPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
 export declare namespace Content {
     var displayName: string;
 }

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

@@ -1,3 +1,4 @@
 export { Logo } from './logo';
 export { logoMeta } from './logo.meta';
 export { ImFusionLogo } from './imfusion';
+export { ProductLogo } from './product';

package/dist/components/logo/product/index.d.ts

@@ -0,0 +1 @@
+export { ProductLogo } from './product';

package/dist/components/logo/product/marks.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Product logo geometry. The plate is shared; each product adds its name as a separate path so the
+ * name can be filled on its own or cut out of the plate. Not exported from the package.
+ */
+export declare const productViewBox = "0 0 842.21 335.39";
+export declare const productPlate = "M842.21,99.26L742.95,0L0,0L0,236.13L99.26,335.39L842.21,335.39Z";
+export declare const productWords: {
+    labels: string;
+    suite: string;
+    sdk: string;
+};

package/dist/components/logo/product/product.d.ts

@@ -0,0 +1,17 @@
+import { Logo } from '../logo';
+import { productWords } from './marks';
+type LogoVariant = NonNullable<React.ComponentProps<typeof Logo>["variant"]>;
+type Props = Omit<React.ComponentProps<typeof Logo>, "src" | "alt" | "variant"> & {
+    product: keyof typeof productWords;
+    /** Cut the product name out of the plate so the background shows through. */
+    cutout?: boolean;
+    /** Override the accessible label. Defaults to the product name, e.g. "ImFusion SDK". */
+    alt?: string;
+    variant?: Exclude<LogoVariant, "minor">;
+};
+/**
+ * An ImFusion product logo (Labels, Suite, SDK) — the generic {@link Logo} primitive pre-wired
+ * with the product plate. The name is filled to contrast with the plate unless `cutout` is set.
+ */
+export declare function ProductLogo({ product, cutout, alt, variant, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/scroll-area/index.d.ts

@@ -0,0 +1,2 @@
+export * as ScrollArea from './scroll-area';
+export { scrollAreaMeta } from './scroll-area.meta';

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

@@ -0,0 +1,49 @@
+import { ScrollArea as ScrollAreaPrimitive } from '@base-ui/react/scroll-area';
+/**
+ * ScrollArea.Root — groups the viewport and its scrollbars. Give it a height or max-height.
+ *
+ * @see https://base-ui.com/react/components/scroll-area
+ * @llm https://base-ui.com/react/components/scroll-area.md
+ */
+export declare function Root(props: React.ComponentProps<typeof ScrollAreaPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Root {
+    var displayName: string;
+}
+/** ScrollArea.Viewport — the scrolling box. It fades its content out at each edge with more to scroll. */
+export declare function Viewport(props: React.ComponentProps<typeof ScrollAreaPrimitive.Viewport>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Viewport {
+    var displayName: string;
+}
+/** ScrollArea.Content — wraps the scrolled content so the viewport can measure it. */
+export declare function Content(props: React.ComponentProps<typeof ScrollAreaPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Content {
+    var displayName: string;
+}
+/** ScrollArea.Scrollbar — overlay bar that shows while the area is hovered or scrolling. */
+export declare function Scrollbar(props: React.ComponentProps<typeof ScrollAreaPrimitive.Scrollbar>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Scrollbar {
+    var displayName: string;
+}
+/** ScrollArea.Thumb — the draggable part of the scrollbar. */
+export declare function Thumb(props: React.ComponentProps<typeof ScrollAreaPrimitive.Thumb>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Thumb {
+    var displayName: string;
+}
+/** ScrollArea.Corner — the square where a vertical and a horizontal scrollbar meet. */
+export declare function Corner(props: React.ComponentProps<typeof ScrollAreaPrimitive.Corner>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Corner {
+    var displayName: string;
+}
+interface AutoProps extends React.ComponentProps<typeof ScrollAreaPrimitive.Root> {
+    /**
+     * Which scrollbars to render. `both` also adds the Corner; `none` scrolls and fades without a visible bar.
+     * @default 'vertical'
+     */
+    orientation?: "vertical" | "horizontal" | "both" | "none";
+}
+/** ScrollArea.Auto — Root, Viewport, Content, and the scrollbars for `orientation`, around `children`. */
+export declare function Auto({ orientation, children, ...props }: AutoProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Auto {
+    var displayName: string;
+}
+export {};

package/dist/components/scroll-area/scroll-area.meta.d.ts

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const scrollAreaMeta: ComponentMeta;

package/dist/components/select/select.d.ts

@@ -1,6 +1,12 @@
 import { Select as SelectPrimitive } from '@base-ui/react/select';
+import { VariantProps } from 'class-variance-authority';
 type UpstreamItem = React.ComponentProps<typeof SelectPrimitive.Item>;
+declare const selectRoot: (props?: ({
+    width?: "auto" | "full" | "wide" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface RootProps<Value = unknown, Multiple extends boolean | undefined = false> extends React.ComponentProps<typeof SelectPrimitive.Root<Value, Multiple>> {
+    /** Trigger width: `auto` keeps the compact minimum; `wide` raises it; `full` fills the parent. @default "auto" */
+    width?: VariantProps<typeof selectRoot>["width"];
 }
 /**
  * Select.Root — accessible select / listbox primitive.
@@ -12,7 +18,7 @@ interface RootProps<Value = unknown, Multiple extends boolean | undefined = fals
  * @doc https://base-ui.com/react/components/select
  * @llm https://base-ui.com/react/components/select.md
  */
-export declare function Root<Value = unknown, Multiple extends boolean | undefined = false>({ className, style, ...props }: RootProps<Value, Multiple> & {
+export declare function Root<Value = unknown, Multiple extends boolean | undefined = false>({ width, className, style, ...props }: RootProps<Value, Multiple> & {
     className?: string;
     style?: React.CSSProperties;
 }): import("react/jsx-runtime").JSX.Element;
@@ -50,7 +56,7 @@ export declare namespace Backdrop {
     var displayName: string;
 }
 /** Select.Positioner — positions the popup relative to the trigger. */
-export declare function Positioner({ align, alignItemWithTrigger, ...props }: React.ComponentProps<typeof SelectPrimitive.Positioner>): import("react/jsx-runtime").JSX.Element;
+export declare function Positioner({ align, alignItemWithTrigger, sideOffset, ...props }: React.ComponentProps<typeof SelectPrimitive.Positioner>): import("react/jsx-runtime").JSX.Element;
 export declare namespace Positioner {
     var displayName: string;
 }
@@ -77,8 +83,8 @@ export declare function Item(props: ItemProps): import("react/jsx-runtime").JSX.
 export declare namespace Item {
     var displayName: string;
 }
-/** Select.ItemIndicator — visual marker (e.g. checkmark) inside the selected item. */
-export declare function ItemIndicator(props: React.ComponentProps<typeof SelectPrimitive.ItemIndicator>): import("react/jsx-runtime").JSX.Element;
+/** Select.ItemIndicator — marker inside the selected item. Without children it draws a check icon in the item's text colour. */
+export declare function ItemIndicator({ children, ...props }: React.ComponentProps<typeof SelectPrimitive.ItemIndicator>): import("react/jsx-runtime").JSX.Element;
 export declare namespace ItemIndicator {
     var displayName: string;
 }
@@ -87,6 +93,14 @@ export declare function ItemText(props: React.ComponentProps<typeof SelectPrimit
 export declare namespace ItemText {
     var displayName: string;
 }
+/**
+ * Select.ItemDescription — a muted second line under an item's text, such as what a role allows. It stays out of the
+ * trigger, which shows only `Select.ItemText`.
+ */
+export declare function ItemDescription(props: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+export declare namespace ItemDescription {
+    var displayName: string;
+}
 /** Select.Group — wrapper around a grouped set of items. */
 export declare function Group(props: React.ComponentProps<typeof SelectPrimitive.Group>): import("react/jsx-runtime").JSX.Element;
 export declare namespace Group {

package/dist/components/separator/separator.d.ts

@@ -2,14 +2,16 @@ import { Separator as SeparatorPrimitive } from '@base-ui/react/separator';
 import { VariantProps } from 'class-variance-authority';
 declare const separator: (props?: ({
     variant?: "solid" | "dashed" | "dotted" | null | undefined;
+    tone?: "minor" | "primary" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface Props extends React.ComponentProps<typeof SeparatorPrimitive>, VariantProps<typeof separator> {
 }
 /**
- * Separator — visual divider between content sections.
+ * Separator — visual divider between content sections. `tone="minor"` draws a neutral line for a quiet break inside a
+ * page; the default primary line marks a stronger division.
  *
  * @see https://base-ui.com/react/components/separator
  * @llm https://base-ui.com/react/components/separator.md
  */
-export declare function Separator({ orientation, variant, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function Separator({ orientation, variant, tone, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/skeleton/skeleton.d.ts

@@ -10,7 +10,7 @@ type RootProps = useRender.ComponentProps<"div"> & {
 /**
  * Skeleton.Root — marks a region as loading. The view inside renders for real; bones stand in for the data. While
  * `loading`, sets `aria-busy` and announces `label` once, however many bones it holds. When `loading` turns false, the
- * data fades in over the bones.
+ * data fades in.
  */
 declare function Root({ label, loading, animation, render, children, ...props }: RootProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Root {
@@ -47,4 +47,19 @@ declare function Block({ width, shape, height, style, ...props }: BlockProps): i
 declare namespace Block {
     var displayName: string;
 }
-export { Root, Text, Block };
+type SuspenseProps = {
+    /** Bones shown while the children suspend. */
+    fallback: React.ReactNode;
+    /** Announced once through a visually hidden status while the fallback shows. */
+    label: string;
+    children: React.ReactNode;
+};
+/**
+ * Skeleton.Suspense — a Suspense boundary whose fallback is bones in a busy Root. When the children mount after the
+ * fallback showed, they fade in over it. Content that was ready without suspending mounts without a fade.
+ */
+declare function Suspense({ fallback, label, children }: SuspenseProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Suspense {
+    var displayName: string;
+}
+export { Root, Text, Block, Suspense };

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

@@ -1,7 +1,15 @@
 import { useRender } from '@base-ui/react/use-render';
-type HeaderCellProps = React.ComponentProps<"th">;
+type CellActionProps = {
+    /** Marks an action column: it shrinks to its content and keeps it on one line. */
+    action?: boolean;
+};
+type HeaderCellProps = React.ComponentProps<"th"> & CellActionProps;
+type RootProps = React.ComponentProps<"table"> & {
+    /** Cell padding: `compact` for dense data, `spacious` for a few rows at a glance. */
+    density?: "compact" | "comfortable" | "spacious";
+};
 /** Table.Root — the `<table>` element. */
-export declare function Root(props: React.ComponentProps<"table">): import("react/jsx-runtime").JSX.Element;
+export declare function Root({ density, ...props }: RootProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Root {
     var displayName: string;
 }
@@ -21,12 +29,12 @@ export declare namespace Row {
     var displayName: string;
 }
 /** Table.HeaderCell — a `<th>` header cell. */
-export declare function HeaderCell(props: HeaderCellProps): import("react/jsx-runtime").JSX.Element;
+export declare function HeaderCell({ action, ...props }: HeaderCellProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace HeaderCell {
     var displayName: string;
 }
 /** Table.Cell — a `<td>` data cell. */
-export declare function Cell(props: React.ComponentProps<"td">): import("react/jsx-runtime").JSX.Element;
+export declare function Cell({ action, ...props }: React.ComponentProps<"td"> & CellActionProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Cell {
     var displayName: string;
 }

package/dist/components/toggle/toggle.d.ts

@@ -1,11 +1,17 @@
 import { Toggle as TogglePrimitive } from '@base-ui/react/toggle';
-interface Props extends React.ComponentProps<typeof TogglePrimitive> {
+import { VariantProps } from 'class-variance-authority';
+declare const toggle: (props?: ({
+    size?: "sm" | "md" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface Props extends React.ComponentProps<typeof TogglePrimitive>, VariantProps<typeof toggle> {
     /**
      * Key hint shown in the top corner at the end of the line, such as `"P"` or `"Ctrl Z"`. It also sets
      * `aria-keyshortcuts` in its notation (`Control+Z`), which an explicit
      * `aria-keyshortcuts` prop overrides. Display only: bind the key in the app, for example with `useHotkey` from TanStack Hotkeys.
      */
     shortcut?: string;
+    /** Defaults to the enclosing `ToggleGroup`'s `size`, or `"md"` standalone. */
+    size?: VariantProps<typeof toggle>["size"];
 }
 /**
  * Toggle - a two-state button. Use standalone for a
@@ -15,5 +21,5 @@ interface Props extends React.ComponentProps<typeof TogglePrimitive> {
  * @doc https://base-ui.com/react/components/toggle
  * @llm https://base-ui.com/react/components/toggle.md
  */
-export declare function Toggle({ style, shortcut, children, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function Toggle({ style, shortcut, size, children, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/toggle-group/toggle-group-size.d.ts

@@ -0,0 +1,3 @@
+export type ToggleGroupSize = "sm" | "md";
+/** The size a `ToggleGroup` hands to its toggles; a standalone `Toggle` reads the default. */
+export declare const ToggleGroupSizeContext: import('react').Context<ToggleGroupSize>;