themelia-ui 3.0.0 → 3.2.0

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

@@ -43,7 +43,7 @@ export declare function Sidebar({ side, variant, collapsible, className, surface
  * The button that toggles the panel. It reads the provider, so it works from anywhere
  * inside it; pair it with the rail, which does the same job from the panel's edge.
  */
-export declare function SidebarTrigger({ className, onClick, tone, buttonStyle, iconOnly, ...props }: ComponentProps<typeof Button>): React.JSX.Element;
+export declare function SidebarTrigger({ className, onClick, tone, appearance, iconOnly, ...props }: ComponentProps<typeof Button>): React.JSX.Element;
 /**
  * The strip along the panel's edge, which toggles it too. It reads the provider, so it works
  * from anywhere inside it. Not a tab stop: it duplicates the trigger.
@@ -84,22 +84,18 @@ export declare function SidebarGroupContent({ className, ...props }: ComponentPr
 export declare function SidebarMenu({ className, ...props }: ComponentProps<"ul">): React.JSX.Element;
 /** One row: a real `<li>`, holding the row's button and anything beside it. */
 export declare function SidebarMenuItem({ className, ...props }: ComponentProps<"li">): React.JSX.Element;
-/**
- * Row shape, not density: `lg` is an account or workspace switcher (avatar over two lines),
- * `sm` a secondary row.
- */
-export type SidebarMenuButtonSize = "sm" | "md" | "lg";
+/** The row's height: `default`, or `sm` for a secondary row. */
+export type SidebarMenuButtonSize = "default" | "sm";
 export interface SidebarMenuButtonProps extends Omit<ComponentProps<"button">, "size"> {
     /**
-     * The row's height, as a shape rather than a density: `lg` is the workspace switcher, `sm`
-     * a secondary row. A size prop here, because a navigation row is not on the control
-     * ladder that density scales.
+     * The row's height: a control's by default, the small control's for a secondary row
+     * (`sm`), with its label a type step smaller.
      */
     size?: SidebarMenuButtonSize;
     /** Marks the row as the current page. */
     active?: boolean;
     /** `outline` gives the row its own frame — for a switcher that must read as a control. */
-    variant?: "default" | "outline";
+    appearance?: "default" | "outline";
     /**
      * The element this row becomes instead of a `button` — usually a router link, so the row
      * navigates the app's own way. `children` stays the row's content.
@@ -117,7 +113,7 @@ export interface SidebarMenuButtonProps extends Omit<ComponentProps<"button">, "
     tooltip?: React.ReactNode;
 }
 /** The row's control: a button, or through `render` a router link. */
-export declare function SidebarMenuButton({ size, active, variant, render, closeOnSelectMobile, tooltip, className, children, onClick, ...props }: SidebarMenuButtonProps): React.JSX.Element;
+export declare function SidebarMenuButton({ size, active, appearance, render, closeOnSelectMobile, tooltip, className, children, onClick, ...props }: SidebarMenuButtonProps): React.JSX.Element;
 export interface SidebarMenuActionProps extends ComponentProps<"button"> {
     /**
      * Reveals the action on hover or keyboard focus rather than showing it always. Focus
@@ -153,8 +149,8 @@ export declare function SidebarMenuSub({ className, ...props }: ComponentProps<"
 /** One row of a nested level. */
 export declare function SidebarMenuSubItem({ className, ...props }: ComponentProps<"li">): React.JSX.Element;
 export interface SidebarMenuSubButtonProps extends ComponentProps<"a"> {
-    /** The nested row's height. */
-    size?: "sm" | "md";
+    /** The nested row's height: `default`, or `sm` for a denser list. */
+    size?: "default" | "sm";
     /** Marks the row as the current page. */
     active?: boolean;
     /** Dismisses the mobile sheet when the row is activated. See SidebarMenuButton. */

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

@@ -6,8 +6,8 @@ import { ComponentScale, SemanticTone } from '../../../lib/component-vocabulary.
 import * as React from "react";
 export interface SpinnerProps extends Omit<React.ComponentProps<"span">, "children"> {
     /**
-     * The ring's size: `sm`, `md` or `lg`. The one place a size prop survives: a spinner has
-     * no content to scale with.
+     * The ring's size: `default`, or `sm` inside a dense row. A spinner keeps a size prop: it
+     * has no content to scale with.
      */
     size?: ComponentScale;
     /**

package/dist/components/base/structure/adaptive-grid.d.ts

@@ -1,12 +1,12 @@
-import { AdaptiveGridMinimum, ResponsiveValue, StructureAlign, StructureGap } from './structure.types.js';
+import { AdaptiveGridMinimum, CssLength, ResponsiveValue, StructureAlign, StructureGap } from './structure.types.js';
 /**
  * AdaptiveGrid — columns follow the available width: `auto-fit` adds a track whenever
  * another fits at the minimum width, with no breakpoints.
  */
 import * as React from "react";
 export interface AdaptiveGridProps extends React.ComponentProps<"div"> {
-    /** Minimum column width before another track is added. */
-    minColumnWidth?: AdaptiveGridMinimum;
+    /** Minimum column width before another track is added: `default`, `sm` or a CSS length. */
+    minColumnWidth?: AdaptiveGridMinimum | CssLength;
     gap?: ResponsiveValue<StructureGap>;
     align?: ResponsiveValue<StructureAlign>;
 }

package/dist/components/base/structure/bleed.d.ts

@@ -6,14 +6,16 @@ import { BleedAxis, ResponsiveValue, StructureGap } from './structure.types.js';
 import * as React from "react";
 export interface BleedProps extends React.ComponentProps<"div"> {
     /**
-     * How far to escape, on the spacing scale. Match it to the padding being cancelled — a
-     * surface at `--space-md` bleeds `md` — so the two move together under a density change.
+     * How far to escape: one of the two gaps, which equal the two paddings. Match it to the
+     * padding being cancelled — a surface padded by `--padding-sm` bleeds `sm` — so the two
+     * move together under a density change.
      * @default "none"
      */
     amount?: ResponsiveValue<StructureGap>;
     /**
      * Which way to escape; `both` covers every direction. Sideways is the common case: an
      * image bleeds across and keeps its vertical rhythm.
+     * @default "inline"
      */
     axis?: BleedAxis;
 }

package/dist/components/base/structure/grid.d.ts

@@ -1,22 +1,28 @@
-import { GridColumns, GridSpan, ResponsiveValue, StructureAlign, StructureGap, StructureWidth } from './structure.types.js';
+import { CssLength, GridColumns, GridSpan, ResponsiveValue, StructureAlign, StructureGap, StructureWidth } from './structure.types.js';
 /**
  * Grid — two-dimensional composition with an explicit column count. Use `AdaptiveGrid`
  * when the count should follow the available width.
  */
 import * as React from "react";
 export interface GridProps extends React.ComponentProps<"div"> {
-    /** Defaults to one column, then two from the md breakpoint. */
+    /**
+     * Defaults to one column, then two from md. Uses the nearest inline-size query
+     * container when present (md = 32rem), otherwise the viewport (md = 48rem).
+     */
     columns?: ResponsiveValue<GridColumns>;
     gap?: ResponsiveValue<StructureGap>;
     rowGap?: ResponsiveValue<StructureGap>;
     columnGap?: ResponsiveValue<StructureGap>;
     align?: ResponsiveValue<StructureAlign>;
     /** Caps the grid's width — a content step, or any CSS length. Same scale as `Stack`. */
-    maxWidth?: ResponsiveValue<StructureWidth | (string & {})>;
+    maxWidth?: ResponsiveValue<StructureWidth | CssLength>;
 }
 export declare const Grid: React.ForwardRefExoticComponent<Omit<GridProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export interface GridCellProps extends React.ComponentProps<"div"> {
-    /** Columns occupied. `full` spans whatever the grid currently has. */
+    /**
+     * Columns occupied. `full` spans whatever the grid currently has, including in a
+     * responsive object. Span breakpoints follow the viewport, not Grid's container.
+     */
     span?: ResponsiveValue<GridSpan>;
 }
 export declare const GridCell: React.ForwardRefExoticComponent<Omit<GridCellProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -3,4 +3,4 @@ export { Grid, GridCell, type GridProps, type GridCellProps } from './grid.js';
 export { AdaptiveGrid, type AdaptiveGridProps } from './adaptive-grid.js';
 export { Split, type SplitProps } from './split.js';
 export { Bleed, type BleedProps } from './bleed.js';
-export type { ResponsiveValue, StructureBreakpoint, StructureGap, StructureAlign, StructureJustify, StructureDirection, GridColumns, GridSpan, AdaptiveGridMinimum, StructureWidth, BleedAxis, SplitSide, } from './structure.types.js';
+export type { ResponsiveValue, StructureBreakpoint, StructureGap, StructureAlign, StructureJustify, StructureDirection, GridColumns, GridSpan, AdaptiveGridMinimum, StructureWidth, BleedAxis, SplitSide, CssLength, } from './structure.types.js';

package/dist/components/base/structure/split.d.ts

@@ -1,4 +1,4 @@
-import { ResponsiveValue, SplitSide, StructureGap, StructureWidth } from './structure.types.js';
+import { CssLength, ResponsiveValue, SplitSide, StructureGap, StructureWidth } from './structure.types.js';
 /**
  * Split — a fixed column beside a fluid one (a sidebar beside content, a form beside a
  * preview). Collapses by breakpoint, not container width, so it stays a plain grid with no
@@ -18,15 +18,16 @@ export interface SplitProps extends React.ComponentProps<"div"> {
      * to nothing.
      * @default "18rem"
      */
-    sideWidth?: ResponsiveValue<StructureWidth | (string & {})>;
+    sideWidth?: ResponsiveValue<StructureWidth | CssLength>;
     /**
      * Space between the two columns.
-     * @default "md"
+     * @default "default"
      */
     gap?: ResponsiveValue<StructureGap>;
     /**
      * Below this breakpoint the two columns become one. `never` keeps them side by side at
      * every width.
+     * @default "md"
      */
     collapseBelow?: "sm" | "md" | "lg" | "xl" | "never";
 }

package/dist/components/base/structure/stack.d.ts

@@ -1,4 +1,4 @@
-import { ResponsiveValue, StructureAlign, StructureDirection, StructureGap, StructureJustify, StructureWidth } from './structure.types.js';
+import { CssLength, ResponsiveValue, StructureAlign, StructureDirection, StructureGap, StructureJustify, StructureWidth } from './structure.types.js';
 /**
  * Stack — one-dimensional composition with token-spaced defaults. Every prop takes a value
  * or a per-breakpoint object, e.g. `direction={{ base: "vertical", md: "horizontal" }}`.
@@ -11,8 +11,8 @@ export interface StackProps extends Omit<React.ComponentProps<"div">, "dir"> {
      */
     direction?: ResponsiveValue<StructureDirection>;
     /**
-     * Space between children, on the semantic spacing scale.
-     * @default "md"
+     * Space between children: `default` between groups, `sm` inside one.
+     * @default "default"
      */
     gap?: ResponsiveValue<StructureGap>;
     /**
@@ -31,10 +31,10 @@ export interface StackProps extends Omit<React.ComponentProps<"div">, "dir"> {
      */
     wrap?: ResponsiveValue<boolean>;
     /**
-     * Caps the box's width — a content step (`sm` to `2xl`, `full`, `none`) or any CSS
+     * Caps the box's width — a content width (`default`, `sm`, `full`, `none`) or any CSS
      * length, such as a form's `26rem`. A field measure is a control decision rather than a
      * content one, which is why a raw length is allowed beside the scale.
      */
-    maxWidth?: ResponsiveValue<StructureWidth | (string & {})>;
+    maxWidth?: ResponsiveValue<StructureWidth | CssLength>;
 }
 export declare const Stack: React.ForwardRefExoticComponent<Omit<StackProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/base/structure/structure.maps.d.ts

@@ -1,9 +1,10 @@
 import { AdaptiveGridMinimum, StructureWidth, StructureAlign, StructureDirection, StructureGap, StructureJustify } from './structure.types.js';
-/** Prop value → CSS value. Gaps are spacing tokens, so structure follows density. */
+/** Prop value → CSS value. Gaps are the theme's two gaps, so structure follows density. */
 export declare const GAP: Record<StructureGap, string>;
 export declare const DIRECTION: Record<StructureDirection, string>;
 export declare const ALIGN: Record<StructureAlign, string>;
 export declare const JUSTIFY: Record<StructureJustify, string>;
+/** The narrowest a column may get before AdaptiveGrid drops a track. */
 export declare const ADAPTIVE_MIN: Record<AdaptiveGridMinimum, string>;
 /** Width step → CSS value; anything else passes through as a length (`maxWidth="26rem"`). */
 export declare const WIDTH: Record<StructureWidth, string>;

package/dist/components/base/structure/structure.types.d.ts

@@ -1,6 +1,12 @@
 import { ComponentScale } from '../../../lib/component-vocabulary.js';
+import { CssLength } from '../../../lib/css-length.js';
+export type { CssLength };
 export type { Breakpoint as StructureBreakpoint, ResponsiveValue } from '../../../lib/responsive.js';
-export type StructureGap = "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+/**
+ * The two gaps: `default` between groups (fields, cards, sections), `sm` inside a group
+ * (icon and label, title and description, a toolbar's controls). Unset is `default`.
+ */
+export type StructureGap = "none" | "sm" | "default";
 export type StructureAlign = "start" | "center" | "end" | "stretch" | "baseline";
 export type StructureJustify = "start" | "center" | "end" | "between" | "around" | "evenly";
 export type StructureDirection = "vertical" | "horizontal";
@@ -8,10 +14,10 @@ export type GridColumns = 1 | 2 | 3 | 4;
 export type GridSpan = GridColumns | "full";
 export type AdaptiveGridMinimum = ComponentScale;
 /**
- * A content-width step (`--content-width-*`), or any CSS length for a control measure such
- * as a field's ~26rem.
+ * The content width (`default`), a narrow reading or form measure (`sm`), or any CSS length
+ * for a control measure such as a field's ~26rem.
  */
-export type StructureWidth = "sm" | "md" | "lg" | "xl" | "2xl" | "full" | "none";
+export type StructureWidth = "default" | "sm" | "full" | "none";
 /** The axis a `Bleed` escapes on. */
 export type BleedAxis = "inline" | "block" | "both";
 /** Which side of a `Split` holds the fixed column. */

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

@@ -5,7 +5,7 @@ export interface ToggleProps extends TogglePrimitive.Props, Pick<TogglePrimitive
      * Sunk when engaged, or outlined. Match whatever sits beside it in the row — `outline`
      * for a lone control, `ghost` inside a group.
      */
-    variant?: "ghost" | "outline";
+    appearance?: "ghost" | "outline";
 }
 /**
  * A control that stays engaged, reported with `aria-pressed`: `pressed` and
@@ -13,7 +13,7 @@ export interface ToggleProps extends TogglePrimitive.Props, Pick<TogglePrimitive
  * with the next one. Inside a `ToggleGroup`, `value` names the toggle, and the group reads it
  * into its own value; outside a group it is unused.
  */
-export declare function Toggle({ variant, className, ...props }: ToggleProps): import("react").JSX.Element;
+export declare function Toggle({ appearance, className, ...props }: ToggleProps): import("react").JSX.Element;
 export interface ToggleGroupProps extends ToggleGroupPrimitive.Props, Pick<ToggleGroupPrimitive.Props, "multiple" | "value" | "onValueChange"> {
     /**
      * Joins the toggles into one framed control with internal rules. Off leaves them as

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

@@ -14,15 +14,15 @@ export interface ToolbarGroupProps extends ToolbarPrimitive.Group.Props, Pick<To
 }
 /** Groups related items, and can disable the group as one unit. */
 export declare function ToolbarGroup({ className, ...props }: ToolbarGroupProps): React.JSX.Element;
-export interface ToolbarButtonProps extends Omit<ToolbarPrimitive.Button.Props, "render">, Pick<ButtonProps, "tone" | "buttonStyle" | "iconOnly" | "loading" | "fullWidth"> {
+export interface ToolbarButtonProps extends Omit<ToolbarPrimitive.Button.Props, "render">, Pick<ButtonProps, "tone" | "appearance" | "iconOnly" | "loading" | "fullWidth"> {
     /** Replaces the kit Button while retaining toolbar navigation behavior. */
     render?: React.ReactElement;
 }
 /**
  * A toolbar item rendered through the kit Button: Base UI owns the navigation behaviour, the
- * Button its look. It takes `tone`, `buttonStyle`, `iconOnly`, `loading` and `render`.
+ * Button its look. It takes `tone`, `appearance`, `iconOnly`, `loading` and `render`.
  */
-export declare function ToolbarButton({ render, tone, buttonStyle, iconOnly, loading, fullWidth, className, ...props }: ToolbarButtonProps): React.JSX.Element;
+export declare function ToolbarButton({ render, tone, appearance, iconOnly, loading, fullWidth, className, ...props }: ToolbarButtonProps): React.JSX.Element;
 export interface ToolbarLinkProps extends ToolbarPrimitive.Link.Props {
 }
 /** An anchor item that joins the same roving-focus order. */

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

@@ -1,8 +1,10 @@
 export { Text } from './text/index.js';
 export type { TextProps, TextType, TextAlign, TextLineHeight, TextWeight } from './text/index.js';
+export { textClassName, type TextClassNameOptions } from './text/index.js';
 export { Heading } from './heading/index.js';
 export type { HeadingProps, HeadingLevel, HeadingSize } from './heading/index.js';
 export { DisplayLabel } from './display-label/index.js';
 export { TextLink } from './text-link/index.js';
 export type { TextLinkProps } from './text-link/index.js';
 export { RichText, type RichTextProps } from './rich-text/rich-text.js';
+export { richTextClassName } from './rich-text/rich-text.variants.js';

package/dist/components/base/typography/rich-text/rich-text.variants.d.ts

@@ -0,0 +1,9 @@
+import { TextClassNameOptions } from '../text/index.js';
+/**
+ * RichText's prose surface and type for an element RichText cannot render: an editor's
+ * content-editable root, which its library creates. The leading defaults to `relaxed`, as on
+ * RichText, so a body reads the same while it is edited and once it is posted.
+ *
+ *   editor.root.className = richTextClassName()
+ */
+export declare function richTextClassName({ lineHeight, ...options }?: TextClassNameOptions): string;

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

@@ -1,2 +1,3 @@
 export { Text } from './text.js';
 export type { TextProps, TextType, TextAlign, TextLineHeight, TextWeight } from './text.js';
+export { textClassName, type TextClassNameOptions } from './text.variants.js';

package/dist/components/base/typography/text/text.d.ts

@@ -1,14 +1,12 @@
 import { ReactNode } from 'react';
 import { TextSize } from '../../../../lib/ui-provider/index.js';
+import { TextAlign, TextLineHeight, TextType, TextWeight } from './text.variants.js';
 /**
  * Text — the design-system text primitive. Rich HTML lives in `typography/rich-text`, so
  * ordinary text never loads sanitisation code. Carries `data-typography="text"` as a hook.
  */
 import * as React from "react";
-export type TextType = "inherit" | "main" | "inverse" | "secondary" | "error" | "success" | "primary";
-export type TextAlign = "left" | "center" | "right";
-export type TextLineHeight = "none" | "tight" | "snug" | "normal" | "relaxed" | "loose";
-export type TextWeight = "normal" | "regular" | "medium" | "semibold" | "bold";
+export type { TextAlign, TextLineHeight, TextType, TextWeight };
 export interface TextProps extends Omit<React.HTMLAttributes<HTMLElement>, "children">, Pick<Partial<React.LabelHTMLAttributes<HTMLLabelElement>>, "htmlFor"> {
     /** Text as a plain string. Equivalent to passing it as `children`. */
     content?: string;
@@ -23,16 +21,16 @@ export interface TextProps extends Omit<React.HTMLAttributes<HTMLElement>, "chil
     /**
      * Step on the type scale. Omit it on primary content so the provider default flows;
      * `UIProvider`'s `typography.defaultTextSize` changes it. Reserve `xs` for support text
-     * and metadata. `xxs` renders as `xs`; use `xs`.
+     * and metadata.
      * @default "sm"
      */
     size?: TextSize;
     /** Horizontal alignment. */
     align?: TextAlign;
     /**
-     * Leading, on the shared tier. Unset, each size step carries the leading paired with it
-     * (`--text-<step>--line-height`); a value here overrides that. `tight` and `none` suit
-     * dense rows and single-line values; `relaxed` suits prose.
+     * Leading. Unset, each size step carries the line box paired with it; a value here
+     * overrides that. `tight` and `none` suit dense rows and single-line values; `relaxed`
+     * suits prose.
      * @default paired
      */
     lineHeight?: TextLineHeight;
@@ -47,6 +45,15 @@ export interface TextProps extends Omit<React.HTMLAttributes<HTMLElement>, "chil
     truncate?: boolean;
     /** Font weight. */
     weight?: TextWeight;
+    /** The monospaced face, for identifiers, codes and keys. */
+    mono?: boolean;
+    /**
+     * The heading face (`--font-heading`), for a title that is not a document heading: a
+     * card's, a dialog's. A theme that sets a heading font reaches it here as in `Heading`.
+     */
+    heading?: boolean;
+    /** Uppercase with open tracking, for an overline or a keyboard hint. */
+    caps?: boolean;
     /** Text content. Takes precedence over `content`. */
     children?: ReactNode;
     /**

package/dist/components/base/typography/text/text.variants.d.ts

@@ -0,0 +1,41 @@
+import { TextSize } from '../../../../lib/ui-provider/index.js';
+export type TextType = "inherit" | "main" | "inverse" | "secondary" | "error" | "success" | "primary";
+export type TextAlign = "left" | "center" | "right";
+export type TextLineHeight = "none" | "tight" | "snug" | "normal" | "relaxed" | "loose";
+export type TextWeight = "normal" | "medium" | "semibold" | "bold";
+export declare const textVariants: (props?: ({
+    type?: ("primary" | "secondary" | "success" | "inherit" | "main" | "inverse" | "error") | null | undefined;
+    size?: ("default" | "sm" | "inherit" | "xs" | "pxs" | "base" | "lg" | "xl") | null | undefined;
+    align?: ("center" | "left" | "right") | null | undefined;
+    lineHeight?: ("none" | "normal" | "loose" | "tight" | "snug" | "relaxed") | null | undefined;
+    weight?: ("normal" | "bold" | "medium" | "semibold") | null | undefined;
+    numeric?: (boolean | "false" | "true") | null | undefined;
+    truncate?: (boolean | "false" | "true") | null | undefined;
+    mono?: (boolean | "false" | "true") | null | undefined;
+    heading?: (boolean | "false" | "true") | null | undefined;
+    caps?: (boolean | "false" | "true") | null | undefined;
+} & {
+    className?: import('clsx').ClassValue;
+}) | undefined) => string;
+/** What `textClassName` takes: Text's props, without the element and the content. */
+export interface TextClassNameOptions {
+    /** Step on the type scale; unset, the provider's default size. */
+    size?: TextSize | "default";
+    weight?: TextWeight;
+    lineHeight?: TextLineHeight;
+    /** Unset, no colour: the element keeps whatever colour its own rules give it. */
+    type?: TextType;
+    numeric?: boolean;
+    truncate?: boolean;
+    mono?: boolean;
+    heading?: boolean;
+    caps?: boolean;
+}
+/**
+ * Text's classes for an element Text cannot wrap: a native control's value, a button's label,
+ * a table cell. One implementation of type, so a size or weight here is the same one Text
+ * renders.
+ *
+ *   <button className={cx(styles.trigger, textClassName({ size: "sm", weight: "medium" }))}>
+ */
+export declare function textClassName({ size, ...options }?: TextClassNameOptions): string;

package/dist/components/base/value-inputs/color-input.d.ts

@@ -24,15 +24,9 @@ export interface ColorInputProps extends Omit<InputProps, "type"> {
     /**
      * The notation the picker emits — typed text is never rewritten. The kit's own palette is
      * OKLCH, which is why that is the default; a consumer whose tokens are hex, rgb or hsl
-     * gets their own notation back. The conversion is culori's. With the deprecated `emitHex`
-     * and no `format`, it is `hex`.
+     * gets their own notation back. The conversion is culori's.
      * @default "oklch"
      */
     format?: "oklch" | "hex" | "rgb" | "hsl";
-    /**
-     * Makes the picker emit hex. `format` wins where both are given.
-     * @deprecated Use `format="hex"`; this spelling stays because it is published API.
-     */
-    emitHex?: boolean;
 }
 export declare const ColorInput: React.ForwardRefExoticComponent<Omit<ColorInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/dist/components/base/value-inputs/slider.d.ts

@@ -26,15 +26,10 @@ export interface SliderFieldProps<TValue extends number | number[] = number | nu
     /** Applies the invalid treatment. The message stays on the FormField. */
     invalid?: boolean;
     /**
-     * The track's direction. A vertical slider takes its height from
-     * `--slider-vertical-min-h`, because a slider has no content to size it.
+     * The track's direction. A vertical slider takes its height from its container, with a
+     * 10rem floor, because a slider has no content to size it.
      */
     orientation?: "horizontal" | "vertical";
-    /**
-     * Track and thumb size: `md` is a larger drag target (touch, media controls). A slider is
-     * dragged, which is why this one keeps a size prop.
-     */
-    size?: "sm" | "md";
     /** Native-shaped handler, for form libraries. */
     onChange?: (event: SliderChangeEvent<TValue extends number ? number : TValue>) => void;
     /** The value on its own, for everything else. */

package/dist/components/{admin/patterns → blocks/admin}/commerce/vendor-profile.d.ts

@@ -1,5 +1,6 @@
 import { ComponentProps, ReactNode } from 'react';
 import { ContentBlock } from '../../../base/display/index.js';
+import { SemanticTone } from '../../../../lib/component-vocabulary.js';
 import { VendorStrings } from './commerce.strings.js';
 /** A performance tile. `change` is a comparison, and its tone is stated, not inferred. */
 export interface VendorStat {
@@ -7,7 +8,7 @@ export interface VendorStat {
     label: ReactNode;
     value: ReactNode;
     change?: ReactNode;
-    changeTone?: "secondary" | "success" | "warning" | "destructive";
+    changeTone?: Extract<SemanticTone, "secondary" | "success" | "warning" | "destructive">;
 }
 /** An operating fact — lead time, fill rate, disputes. */
 export interface VendorMetric {

package/dist/components/{patterns → blocks}/analytics/analytics.strings.d.ts

@@ -7,11 +7,8 @@ export interface AnalyticsStrings {
     metricErrorLabel: string;
     /** Names the `colored` variant's progress bar for a screen reader. */
     metricProgressLabel: (label: string) => string;
-    /**
-     * Names the info affordance beside a label that carries a `tooltip`. Optional for
-     * backward compatibility; the default applies.
-     */
-    metricInfoLabel?: string;
+    /** Names the info affordance beside a label that carries a `tooltip`. */
+    metricInfoLabel: string;
 }
 export declare const defaultAnalyticsStrings: AnalyticsStrings;
 export interface MetricComparisonStrings {

package/dist/components/features/actions/action-adapters.d.ts

@@ -52,7 +52,7 @@ export declare function toPageAction<TPayload = unknown, TValues = unknown, TRes
         className?: string;
     }> | undefined;
     tone: string | undefined;
-    buttonStyle: string | undefined;
+    appearance: string | undefined;
     visible: boolean;
     group: string | undefined;
     placement: import('./actions.types.js').ActionPlacement;
@@ -65,7 +65,7 @@ export declare function toMenuAction<TPayload = unknown, TValues = unknown, TRes
         className?: string;
     }> | undefined;
     tone: string;
-    buttonStyle: string | undefined;
+    appearance: string | undefined;
 };
 export declare function toTableAction<TData = unknown>(action: ResolvedAction<TData>): {
     id: string;
@@ -78,7 +78,7 @@ export declare function toTableAction<TData = unknown>(action: ResolvedAction<TD
         className?: string;
     }, string | import('react').JSXElementConstructor<any>> | undefined;
     tone: string;
-    buttonStyle: string | undefined;
+    appearance: string | undefined;
 };
 export declare function toCommandAction<TPayload = unknown, TValues = unknown, TResult = unknown>(action: ResolvedAction<TPayload, TValues, TResult>, metadata?: ActionMetadata): {
     id: string;

package/dist/components/features/actions/actions.types.d.ts

@@ -1,15 +1,14 @@
 import { ComponentType, FormEvent, FormEventHandler, ReactNode, RefObject } from 'react';
 import { StringsProp } from '../../../lib/strings.js';
 import { SemanticTone } from '../../../lib/component-vocabulary.js';
-import { ActionButtonStyle, ActionPresentation } from '../../../lib/action-presentation.js';
-export type { ActionButtonStyle } from '../../../lib/action-presentation.js';
+import { ActionAppearance, ActionPresentation } from '../../../lib/action-presentation.js';
+export type { ActionAppearance } from '../../../lib/action-presentation.js';
 export declare const ACTION_GLOBAL_SCOPE = "__global__";
 export type ActionSurface = 'page' | 'table' | 'table-row' | 'card' | 'command' | (string & {});
 export type ActionPlacement = 'auto' | 'inline' | 'menu';
 export type ActionModalityType = 'alert' | 'dialog' | 'drawer';
 export type ActionTone = SemanticTone;
 export type ActionStatus = 'idle' | 'running' | 'succeeded' | 'failed';
-export type ActionOverlaySize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | 'full';
 export type ActionDrawerDirection = 'left' | 'right' | 'top' | 'bottom';
 export type ActionRequestMethod = 'get' | 'post' | 'put' | 'patch' | 'delete';
 export type ActionRequestTarget = {
@@ -113,7 +112,6 @@ export interface ActionModalityConfig<TPayload = unknown, TValues = unknown, TRe
     confirmLabel?: ActionMessage<TPayload, TValues, TResult>;
     cancelLabel?: ActionMessage<TPayload, TValues, TResult>;
     tone?: ActionTone;
-    size?: ActionOverlaySize;
     drawerDirection?: ActionDrawerDirection;
     formId?: string;
     showCancel?: boolean;
@@ -128,7 +126,7 @@ export interface ActionModalityConfig<TPayload = unknown, TValues = unknown, TRe
     closeOnEscape?: boolean;
     closeOnSuccess?: boolean;
     closeOnBackdropClick?: boolean;
-    confirmStyle?: Extract<ActionButtonStyle, 'solid' | 'outline'>;
+    confirmAppearance?: Extract<ActionAppearance, 'solid' | 'outline'>;
     footer?: ReactNode;
     alertMessage?: ActionMessage<TPayload, TValues, TResult>;
     render?: BivariantCallback<[

package/dist/components/features/actions/index.d.ts

@@ -5,5 +5,5 @@ export { extractActionFieldErrors, parseActionError, resolveActionRequest, resol
 export { ActionHttpError, createHttpActionRunner, defineAction, defineDeleteAction, defineFormAction, defineSilentAction, toCommandAction, toMenuAction, toPageAction, toTableAction, type ActionHttpErrorOptions, type CreateHttpActionRunnerOptions, } from './action-adapters.js';
 export { useAction, useActionScope, useActionSnapshot, useActionSurface, useActiveAction, useLocalAction, useRegisterActions, } from './hooks.js';
 export { defaultActionOverlayStrings, } from './actions.strings.js';
-export { ACTION_GLOBAL_SCOPE, type ActiveActionState, type ActionButtonStyle, type ActionContext, type ActionDefinition, type ActionDrawerDirection, type ActionEntry, type ActionErrorParseContext, type ActionErrorParser, type ActionFeedbackHandlers, type ActionFieldErrors, type ActionFormProps, type ActionFormSubmitOptions, type ActionGuardContext, type ActionGuards, type ActionLifecycleEvent, type ActionLifecycleType, type ActionMessage, type ActionMessageContext, type ActionMetadata, type ActionModalityConfig, type ActionModalityType, type ActionOverlayOutletProps, type ActionOverlaySize, type ActionOverlayStrings, type ActionPlacement, type ActionPredicate, type ActionPermission, type ActionProviderProps, type ActionRegistration, type ActionRegistrationOptions, type ActionRenderContext, type ActionRequestConfig, type ActionRequestMethod, type ActionRequestRunner, type ActionRequestTarget, type ActionRequestValue, type ActionRoles, type ActionRunContext, type ActionRunState, type ActionRuntimeGlue, type ActionScopeProps, type ActionStatus, type ActionStoreSnapshot, type ActionSurface, type ActionSurfaceOptions, type ActionTone, type ParsedActionError, type ResolvedActionRequest, type ResolvedAction, type UseActionOptions, type UseLocalActionOptions, } from './actions.types.js';
+export { ACTION_GLOBAL_SCOPE, type ActiveActionState, type ActionAppearance, type ActionContext, type ActionDefinition, type ActionDrawerDirection, type ActionEntry, type ActionErrorParseContext, type ActionErrorParser, type ActionFeedbackHandlers, type ActionFieldErrors, type ActionFormProps, type ActionFormSubmitOptions, type ActionGuardContext, type ActionGuards, type ActionLifecycleEvent, type ActionLifecycleType, type ActionMessage, type ActionMessageContext, type ActionMetadata, type ActionModalityConfig, type ActionModalityType, type ActionOverlayOutletProps, type ActionOverlayStrings, type ActionPlacement, type ActionPredicate, type ActionPermission, type ActionProviderProps, type ActionRegistration, type ActionRegistrationOptions, type ActionRenderContext, type ActionRequestConfig, type ActionRequestMethod, type ActionRequestRunner, type ActionRequestTarget, type ActionRequestValue, type ActionRoles, type ActionRunContext, type ActionRunState, type ActionRuntimeGlue, type ActionScopeProps, type ActionStatus, type ActionStoreSnapshot, type ActionSurface, type ActionSurfaceOptions, type ActionTone, type ParsedActionError, type ResolvedActionRequest, type ResolvedAction, type UseActionOptions, type UseLocalActionOptions, } from './actions.types.js';
 export { useActionStore } from './action-store.js';

package/dist/components/features/activities/activities-feed.d.ts

@@ -1,3 +1,3 @@
 import { ActivityFeedProps } from './activities.types.js';
 /** The timeline of events, grouped by date on one rail. */
-export declare function ActivityFeed<TData = unknown>({ activities, density, itemSpacing, groupByDate, expandedByDefault, detailsCollapsible, defaultExpandedIds, expandedIds, onExpandedIdsChange, currentUserId, loading, error, onRetry, eventConfig, strings, slots, rowClassNames, className, locale, formatRelativeTime, formatAbsoluteTime, formatDateGroupLabel, getSourceLabel, actionsForActivity, onActivityClick, onActorClick, onResourceClick, onAction, onActivityExpandedChange, resources, onResourcesChange, }: ActivityFeedProps<TData>): import("react").JSX.Element;
+export declare function ActivityFeed<TData = unknown>({ activities, variant, itemSpacing, groupByDate, expandedByDefault, detailsCollapsible, defaultExpandedIds, expandedIds, onExpandedIdsChange, currentUserId, loading, error, onRetry, eventConfig, strings, slots, rowClassNames, className, locale, formatRelativeTime, formatAbsoluteTime, formatDateGroupLabel, getSourceLabel, actionsForActivity, onActivityClick, onActorClick, onResourceClick, onAction, onActivityExpandedChange, resources, onResourcesChange, }: ActivityFeedProps<TData>): import("react").JSX.Element;

package/dist/components/features/activities/activities.types.d.ts

@@ -13,9 +13,9 @@ export type ActivityTone = SemanticTone;
  * `default` an icon and a second line, for a record's own history.
  * `rich`    the whole row: metadata, changes, resources, actions.
  */
-export type ActivityDensity = "compact" | "default" | "rich";
+export type ActivityVariant = "compact" | "default" | "rich";
 /** The rhythm between rows, independent of how much each row draws. */
-export type ActivityItemSpacing = "compact" | "default" | "relaxed";
+export type ActivityItemSpacing = "default" | "sm";
 export interface ActivityActor {
     /** Compared against `currentUserId` to render "You" instead of a name. */
     id?: string;
@@ -145,7 +145,7 @@ export interface ActivityAction<TData = unknown> extends ContextAction<ActivityI
 }
 /** Everything a custom renderer needs about where its row sits. */
 export interface ActivityRenderRowContext<TData = unknown> {
-    density: ActivityDensity;
+    variant: ActivityVariant;
     isLast: boolean;
     isFirstInGroup: boolean;
     activity: ActivityItem<TData>;
@@ -211,7 +211,7 @@ export interface ActivityFeedProps<TData = unknown> extends ActivityFeedAccessor
      */
     activities?: ReadonlyArray<ActivityItem<TData>>;
     /** How much of a row is drawn. `rich` adds metadata, changes, resources, and actions. */
-    density?: ActivityDensity;
+    variant?: ActivityVariant;
     /** The rhythm between rows, independent of how much each row draws. */
     itemSpacing?: ActivityItemSpacing;
     groupByDate?: boolean;

package/dist/components/features/activities/activity-parts.d.ts

@@ -1,9 +1,9 @@
 import { ReactNode } from 'react';
-import { ActivityAction, ActivityChange, ActivityDensity, ActivityItem, ActivityResourceConfig, ActivityResourceRef, ActivityTone } from './activities.types.js';
+import { ActivityAction, ActivityChange, ActivityVariant, ActivityItem, ActivityResourceConfig, ActivityResourceRef, ActivityTone } from './activities.types.js';
 export interface ActivityMarkerProps {
     icon: ReactNode;
     tone: ActivityTone;
-    density: ActivityDensity;
+    variant: ActivityVariant;
     /** The rail stops at the last row rather than running into nothing. */
     last: boolean;
     className?: string;
@@ -12,7 +12,7 @@ export interface ActivityMarkerProps {
  * The dot on the rail. It knows whether it is last, because the connector below it is what
  * tells a reader the run has ended.
  */
-export declare function ActivityMarker({ icon, tone, density, last, className }: ActivityMarkerProps): import("react").JSX.Element;
+export declare function ActivityMarker({ icon, tone, variant, last, className }: ActivityMarkerProps): import("react").JSX.Element;
 /**
  * The date heading a group of rows on the rail. An empty label, from an ungrouped feed,
  * renders nothing.