@stealthscale/component-disclosure 0.1.0 → 0.2.2

package/dist/index.d.ts

@@ -1,919 +1,2107 @@
-import { ComponentProps, ReactElement } from "react";
-import "@stealthscale/theme/authoring";
+import { RecipeProps, SystemStyleObject } from "@stealthscale/theme/authoring";
+import { ComponentProps, ReactElement, ReactNode } from "react";
+import * as accordion from "@zag-js/accordion";
+import { PresenceOptions } from "@stealthscale/hooks";
 import * as collapsible from "@zag-js/collapsible";
+import * as hoverCard from "@zag-js/hover-card";
 import * as menu from "@zag-js/menu";
 import * as popover from "@zag-js/popover";
+import * as steps from "@zag-js/steps";
 import * as tabs from "@zag-js/tabs";
 import * as tooltip from "@zag-js/tooltip";
+//#region src/accordion/item-body.d.ts
+/**
+ * Renders the `div` with the accordion's item body class.
+ */
+declare const ItemBody: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the item body: the props of a `div`.
+ */
+type ItemBodyProps = ComponentProps<typeof ItemBody>;
+//#endregion
+//#region src/accordion/item-content.d.ts
+/**
+ * Renders the `div` with the accordion's item content class.
+ */
+declare const Shown$4: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the item content: the props of a `div`.
+ */
+type ItemContentProps = ComponentProps<typeof Shown$4>;
+/**
+ * Renders the content with the accordion's region props and the collapsible's visibility merged
+ * over the caller's.
+ *
+ * @remarks
+ *   The accordion's `hidden` and `data-state` are passed as `undefined`, which the merge skips, so
+ *   the collapsible's values apply and the content is visible while it animates closed.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ItemContent(props: ItemContentProps): ReactElement;
+//#endregion
+//#region src/accordion/item-heading.d.ts
+/**
+ * Renders the `h3` with the accordion's item heading class.
+ */
+declare const ItemHeading: import("@stealthscale/theme").StyledComponent<"h3", {}>;
+/**
+ * Describes the props of the item heading: the props of an `h3`.
+ */
+type ItemHeadingProps = ComponentProps<typeof ItemHeading>;
+//#endregion
+//#region src/accordion/item-indicator.d.ts
+/**
+ * Renders the `span` with the accordion's item indicator class.
+ */
+declare const Turned$3: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of the item indicator: the props of a `span`.
+ */
+type ItemIndicatorProps$1 = ComponentProps<typeof Turned$3>;
+/**
+ * Renders the indicator with the machine's indicator props merged over the caller's.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function ItemIndicator$1(props: ItemIndicatorProps$1): ReactElement;
+//#endregion
+//#region src/accordion/item-trigger.d.ts
+/**
+ * Renders the `button` with the accordion's item trigger class.
+ */
+declare const Pressed$8: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of the item trigger: the props of a `button`.
+ */
+type ItemTriggerProps = ComponentProps<typeof Pressed$8>;
+/**
+ * Renders the trigger with the machine's trigger props merged over the caller's.
+ *
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
+ */
+declare function ItemTrigger(props: ItemTriggerProps): ReactElement;
+//#endregion
+//#region src/accordion/machine.d.ts
+/**
+ * Describes the machine settings a caller can pass to the root, all optional.
+ */
+type AccordionOptions = Partial<accordion.Props>;
+/**
+ * Describes what an item passes the machine: its value and whether it is disabled.
+ */
+type ItemOptions = accordion.ItemProps;
+//#endregion
+//#region src/accordion/item.d.ts
+/**
+ * Renders the `div` with the accordion's item class.
+ */
+declare const Held$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of an item: its value, whether it is disabled and the props of a `div`.
+ */
+interface ItemProps$2 extends ComponentProps<typeof Held$2>, ItemOptions {}
+/**
+ * Renders the item with the machine's item props and provides its state to the parts inside it.
+ *
+ * @remarks
+ *   `disabled` on an item adds to the root's. The machine reads an item's `false` over the root's
+ *   `true`, so the item passes the machine `disabled` only when it is `true`, and a disabled root
+ *   disables every item.
+ * @param props - The item's value, the disabled flag and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Item$2(props: ItemProps$2): ReactElement;
+//#endregion
+//#region src/accordion/root.d.ts
+/**
+ * Renders the `div` that provides the recipe's variants.
+ */
+declare const Framed$9: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly motion?: "fade" | "none" | "slide" | undefined;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+  readonly size?: "lg" | "md" | "sm" | undefined;
+  readonly variant?: "flushed" | "outline" | "plain" | "subtle" | "surface" | undefined;
+}>;
+/**
+ * Describes the props of the root: the machine's options, the recipe's variants and the props of a
+ * `div`.
+ *
+ * @remarks
+ *   `orientation` is left out, because the recipe lays the items out in a column. The element's
+ *   `defaultValue`, `dir` and `id` are left out, because the machine takes all three.
+ */
+interface RootProps$10 extends Omit<AccordionOptions, "orientation">, Omit<ComponentProps<typeof Framed$9>, "defaultValue" | "dir" | "id"> {}
+/**
+ * Renders the root and provides the running machine to the items.
+ *
+ * @param props - The machine's options, the recipe's variants and the props of a `div`.
+ * @returns The `div` element inside the machine's provider.
+ */
+declare function Root$10(props: RootProps$10): ReactElement;
+declare namespace index_d_exports {
+  export { Item$2 as Item, ItemBody, ItemBodyProps, ItemContent, ItemContentProps, ItemHeading, ItemHeadingProps, ItemIndicator$1 as ItemIndicator, ItemIndicatorProps$1 as ItemIndicatorProps, ItemProps$2 as ItemProps, ItemTrigger, ItemTriggerProps, Root$10 as Root, RootProps$10 as RootProps };
+}
+//#endregion
 //#region src/collapsible/content.d.ts
 /**
- * Draws the block at the room the root states.
+ * Renders the `div` with the collapsible's content class.
  */
-declare const Shown$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Shown$3: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the content takes.
+ * Describes the props of the content: the props of a `div`.
  */
-type ContentProps$4 = ComponentProps<typeof Shown$1>;
+type ContentProps$9 = ComponentProps<typeof Shown$3>;
 /**
- * Appears and goes as the trigger is pressed.
+ * Renders the content with the machine's content props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The block, measured and named by the machine.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function Content$4(props: ContentProps$4): ReactElement;
+declare function Content$9(props: ContentProps$9): ReactElement;
 //#endregion
 //#region src/collapsible/indicator.d.ts
 /**
- * Draws the mark at the box the root states.
+ * Renders the `span` with the collapsible's indicator class.
  */
-declare const Turned$1: import("@stealthscale/theme").StyledComponent<"span", {}>;
+declare const Turned$2: import("@stealthscale/theme").StyledComponent<"span", {}>;
 /**
- * Describes what the indicator takes.
+ * Describes the props of the indicator: the props of a `span`.
  */
-type IndicatorProps$3 = ComponentProps<typeof Turned$1>;
+type IndicatorProps$5 = ComponentProps<typeof Turned$2>;
 /**
- * Turns half a revolution while the block is open.
+ * Renders the indicator, hidden from assistive technology, with the machine's indicator props.
  *
- * @param props - Everything a styled span takes.
- * @returns The mark, turned to whichever way the machine is.
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
  */
-declare function Indicator$3(props: IndicatorProps$3): ReactElement;
+declare function Indicator$5(props: IndicatorProps$5): ReactElement;
 //#endregion
 //#region src/collapsible/machine.d.ts
 /**
- * Describes what a caller sets on the machine, less the id it is given.
+ * Describes the machine settings a caller can pass to the root, all optional.
  */
 type CollapsibleOptions = Partial<collapsible.Props>;
 //#endregion
 //#region src/collapsible/root.d.ts
 /**
- * Draws the frame and sets the variants every part below it reads.
+ * Renders the `div` that provides the recipe's variants.
  */
-declare const Framed$4: import("@stealthscale/theme").StyledComponent<"div", {
-  readonly motion?: "fade" | "none" | "slide";
-  readonly size?: import("@stealthscale/theme/authoring").Scale;
-  readonly variant?: "outline" | "plain" | "subtle" | "surface";
+declare const Framed$8: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly motion?: "fade" | "none" | "slide" | undefined;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+  readonly size?: import("@stealthscale/theme/authoring").Scale | undefined;
+  readonly variant?: "outline" | "plain" | "subtle" | "surface" | undefined;
 }>;
 /**
- * Describes what the root takes: the machine's options, the recipe's variants, and the element's.
+ * Describes the props of the root: the machine's options, the recipe's variants and the props of a
+ * `div`.
  *
  * @remarks
- *   The element's own `id` and `dir` are left out, because the machine states both. It builds every
- *   ARIA reference from the id, and it reads the direction to decide which way the block opens.
+ *   The element's `id` and `dir` are left out, because the machine takes both. It derives every
+ *   ARIA reference from `id`.
  */
-interface RootProps$4 extends CollapsibleOptions, Omit<ComponentProps<typeof Framed$4>, "dir" | "id"> {}
+interface RootProps$9 extends CollapsibleOptions, Omit<ComponentProps<typeof Framed$8>, "dir" | "id"> {}
 /**
- * Shows and hides the block beneath a control.
+ * Renders the root and provides the machine's api to the parts.
  *
- * @param props - The machine's options, the recipe's variants and the element's props together.
- * @returns The frame, holding the parts, under the running machine.
+ * @param props - The machine's options, the recipe's variants and the props of a `div`.
+ * @returns The `div` element inside the api provider.
  */
-declare function Root$4(props: RootProps$4): ReactElement;
+declare function Root$9(props: RootProps$9): ReactElement;
 //#endregion
 //#region src/collapsible/trigger.d.ts
 /**
- * Draws the control at the size the root states.
+ * Renders the `button` with the collapsible's trigger class.
  */
-declare const Pressed$4: import("@stealthscale/theme").StyledComponent<"button", {}>;
+declare const Pressed$7: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Describes what the trigger takes.
+ * Describes the props of the trigger: the props of a `button`.
  */
-type TriggerProps$4 = ComponentProps<typeof Pressed$4>;
+type TriggerProps$8 = ComponentProps<typeof Pressed$7>;
 /**
- * Shows the block where it is hidden, and hides it where it is shown.
+ * Renders the trigger with the machine's trigger props merged over the caller's.
  *
- * @param props - Everything a styled button takes.
- * @returns The control, carrying what the machine says it does.
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
  */
-declare function Trigger$4(props: TriggerProps$4): ReactElement;
-declare namespace index_d_exports {
-  export { Content$4 as Content, ContentProps$4 as ContentProps, Indicator$3 as Indicator, IndicatorProps$3 as IndicatorProps, Root$4 as Root, RootProps$4 as RootProps, Trigger$4 as Trigger, TriggerProps$4 as TriggerProps };
+declare function Trigger$8(props: TriggerProps$8): ReactElement;
+declare namespace index_d_exports$1 {
+  export { Content$9 as Content, ContentProps$9 as ContentProps, Indicator$5 as Indicator, IndicatorProps$5 as IndicatorProps, Root$9 as Root, RootProps$9 as RootProps, Trigger$8 as Trigger, TriggerProps$8 as TriggerProps };
+}
+//#endregion
+//#region src/details/content.d.ts
+/**
+ * Renders the `div` with the details' content class.
+ */
+declare const Content$8: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the content: the props of a `div`.
+ */
+type ContentProps$8 = ComponentProps<typeof Content$8>;
+//#endregion
+//#region src/details/indicator.d.ts
+/**
+ * Renders the `span` with the details' indicator class.
+ */
+declare const Turned$1: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of the indicator: the props of a `span`.
+ */
+type IndicatorProps$4 = ComponentProps<typeof Turned$1>;
+/**
+ * Renders the indicator, hidden from assistive technology.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function Indicator$4(props: IndicatorProps$4): ReactElement;
+//#endregion
+//#region src/details/root.d.ts
+/**
+ * Renders the `details` with the recipe's variants.
+ */
+declare const Root$8: import("@stealthscale/theme").StyledComponent<"details", {
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+  readonly size?: import("@stealthscale/theme/authoring").Scale | undefined;
+  readonly variant?: "outline" | "plain" | "subtle" | "surface" | undefined;
+}>;
+/**
+ * Describes the props of the root: the props of a `details` and the recipe's variants.
+ */
+type RootProps$8 = ComponentProps<typeof Root$8>;
+//#endregion
+//#region src/details/summary.d.ts
+/**
+ * Renders the `summary` with the details' summary class.
+ */
+declare const Summary: import("@stealthscale/theme").StyledComponent<"summary", {}>;
+/**
+ * Describes the props of the summary: the props of a `summary`.
+ */
+type SummaryProps = ComponentProps<typeof Summary>;
+declare namespace index_d_exports$2 {
+  export { Content$8 as Content, ContentProps$8 as ContentProps, Indicator$4 as Indicator, IndicatorProps$4 as IndicatorProps, Root$8 as Root, RootProps$8 as RootProps, Summary, SummaryProps };
+}
+//#endregion
+//#region src/hover-card/arrow-tip.d.ts
+/**
+ * Renders the `div` with the hover card's arrow tip class.
+ */
+declare const Drawn$20: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the arrow tip: the props of a `div`.
+ */
+type ArrowTipProps$4 = ComponentProps<typeof Drawn$20>;
+/**
+ * Renders the arrow tip with the machine's arrow tip props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ArrowTip$4(props: ArrowTipProps$4): ReactElement;
+//#endregion
+//#region src/hover-card/arrow.d.ts
+/**
+ * Renders the `div` with the hover card's arrow class.
+ */
+declare const Drawn$19: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the arrow: the props of a `div`.
+ */
+type ArrowProps$4 = ComponentProps<typeof Drawn$19>;
+/**
+ * Renders the arrow with the machine's arrow props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Arrow$4(props: ArrowProps$4): ReactElement;
+//#endregion
+//#region src/hover-card/content.d.ts
+/**
+ * Renders the `div` with the hover card's content class.
+ */
+declare const Drawn$18: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the content: the props of a `div`, without `ref`, which the presence
+ * takes.
+ */
+type ContentProps$7 = Omit<ComponentProps<typeof Drawn$18>, "ref">;
+/**
+ * Renders the panel with the machine's content props and the presence props merged over the
+ * caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Content$7(props: ContentProps$7): ReactElement;
+//#endregion
+//#region src/hover-card/positioner.d.ts
+/**
+ * Renders the `div` with the hover card's positioner class.
+ */
+declare const Drawn$17: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the positioner: the props of a `div`.
+ */
+type PositionerProps$4 = ComponentProps<typeof Drawn$17>;
+/**
+ * Renders the positioner with the machine's positioner props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element, or nothing while the panel is out of the document.
+ */
+declare function Positioner$4(props: PositionerProps$4): null | ReactElement;
+//#endregion
+//#region src/hover-card/machine.d.ts
+/**
+ * Describes the machine settings a caller can pass to the root, all optional.
+ */
+type HoverCardOptions = Partial<hoverCard.Props>;
+//#endregion
+//#region src/presence.d.ts
+/**
+ * Describes when an overlay renders its content while the overlay is closed.
+ *
+ * @remarks
+ *   The package declares the options again, because the hooks package is a peer. A specimen page
+ *   lists only the props that the package or its runtime dependencies declare.
+ */
+interface OverlayPresence extends Omit<PresenceOptions, "present"> {
+  /**
+   * When true, the overlay renders no content until it first opens.
+   *
+   * @defaultValue true
+   */
+  readonly lazyMount?: boolean | undefined;
+  /**
+   * Runs once the content's exit animation ends.
+   */
+  readonly onExitComplete?: (() => void) | undefined;
+  /**
+   * When true, content that is open on mount plays no entry animation.
+   */
+  readonly skipAnimationOnMount?: boolean | undefined;
+  /**
+   * When true, the overlay removes its content once the exit animation ends.
+   *
+   * @defaultValue true
+   */
+  readonly unmountOnExit?: boolean | undefined;
+}
+//#endregion
+//#region src/hover-card/root.d.ts
+/**
+ * Renders the `span` that provides the recipe's variants.
+ */
+declare const Framed$7: import("@stealthscale/theme").StyledComponent<"span", {
+  readonly size?: "lg" | "md" | "sm" | "xs" | undefined;
+  readonly variant?: "elevated" | "glass" | "surface" | undefined;
+}>;
+/**
+ * Describes the props of the root: the machine's options, the panel's presence, the recipe's
+ * variants and the props of a `span`.
+ *
+ * @remarks
+ *   The element's `id` and `dir` are left out, because the machine takes both. It derives every
+ *   part's id from `id`, and reads `dir` for the placement.
+ */
+interface RootProps$7 extends HoverCardOptions, Omit<ComponentProps<typeof Framed$7>, "dir" | "id">, OverlayPresence {}
+/**
+ * Renders the root and provides the machine's api and the panel's presence to the parts.
+ *
+ * @param props - The machine's options, the panel's presence, the recipe's variants and the props
+ *   of a `span`.
+ * @returns The `span` element inside the providers.
+ */
+declare function Root$7({ lazyMount, onExitComplete, skipAnimationOnMount, unmountOnExit, ...props }: RootProps$7): ReactElement;
+//#endregion
+//#region src/hover-card/trigger.d.ts
+/**
+ * Renders the `a` with the hover card's trigger class.
+ */
+declare const Drawn$16: import("@stealthscale/theme").StyledComponent<"a", {}>;
+/**
+ * Describes the props of the trigger: the props of an `a`, and the value that tells this trigger
+ * apart from the card's other triggers.
+ */
+interface TriggerProps$7 extends ComponentProps<typeof Drawn$16> {
+  /**
+   * The value the root reports as `triggerValue` while this trigger opened the card. Absent for a
+   * card with one trigger.
+   */
+  readonly value?: string | undefined;
+}
+/**
+ * Renders the trigger with the machine's trigger props merged over the caller's.
+ *
+ * @param props - The value and the props of an `a`.
+ * @returns The `a` element.
+ */
+declare function Trigger$7({ value, ...props }: TriggerProps$7): ReactElement;
+declare namespace index_d_exports$3 {
+  export { Arrow$4 as Arrow, ArrowProps$4 as ArrowProps, ArrowTip$4 as ArrowTip, ArrowTipProps$4 as ArrowTipProps, Content$7 as Content, ContentProps$7 as ContentProps, Positioner$4 as Positioner, PositionerProps$4 as PositionerProps, Root$7 as Root, RootProps$7 as RootProps, Trigger$7 as Trigger, TriggerProps$7 as TriggerProps };
 }
 //#endregion
 //#region src/menu/arrow-tip.d.ts
 /**
- * Draws the square at the look the root states.
+ * Renders the `div` with the menu's arrow tip class.
  */
 declare const Tipped: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the square takes.
+ * Describes the props of the arrow tip: the props of a `div`.
  */
-type ArrowTipProps$2 = ComponentProps<typeof Tipped>;
+type ArrowTipProps$3 = ComponentProps<typeof Tipped>;
 /**
- * Gives the point its shape.
+ * Renders the arrow tip with the machine's arrow tip props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The square, carrying the place the machine measured.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function ArrowTip$2(props: ArrowTipProps$2): ReactElement;
+declare function ArrowTip$3(props: ArrowTipProps$3): ReactElement;
 //#endregion
 //#region src/menu/arrow.d.ts
 /**
- * Draws the point at the size the root states.
+ * Renders the `div` with the menu's arrow class.
  */
 declare const Pointed: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the point takes.
+ * Describes the props of the arrow: the props of a `div`.
  */
-type ArrowProps$2 = ComponentProps<typeof Pointed>;
+type ArrowProps$3 = ComponentProps<typeof Pointed>;
 /**
- * Points from the panel back at the control.
+ * Renders the arrow with the machine's arrow props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The point, carrying the place the machine measured.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function Arrow$2(props: ArrowProps$2): ReactElement;
+declare function Arrow$3(props: ArrowProps$3): ReactElement;
 //#endregion
 //#region src/menu/content.d.ts
 /**
- * Draws the panel at the size the root states.
+ * Renders the `div` with the menu's content class.
  */
-declare const Drawn$10: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Drawn$15: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the panel takes.
+ * Describes the props of the panel: the props of a `div`, without `ref`, which the presence takes.
  */
-type ContentProps$3 = ComponentProps<typeof Drawn$10>;
+type ContentProps$6 = Omit<ComponentProps<typeof Drawn$15>, "ref">;
 /**
- * Shows the rows of the menu.
+ * Renders the panel with the presence props, the machine's direction, placement and side, its
+ * depth and its nested mark, and the rows inside a scroll area whose viewport takes the machine's
+ * content props.
  *
- * @param props - Everything a styled div takes.
- * @returns The panel, carrying what the machine writes onto it.
+ * @param props - The panel's `as` and `style`, and the props of the element with `role="menu"`.
+ * @returns The `div` element of the panel.
  */
-declare function Content$3(props: ContentProps$3): ReactElement;
+declare function Content$6({ as, children, style, ...rest }: ContentProps$6): ReactElement;
 //#endregion
 //#region src/menu/context-trigger.d.ts
 /**
- * Draws the region at the size the root states.
+ * Renders the `div` with the menu's context trigger class.
  */
-declare const Held: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Held$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the region takes.
+ * Describes the props of the context trigger: its value and the props of a `div`.
  */
-interface ContextTriggerProps extends ComponentProps<typeof Held> {
+interface ContextTriggerProps extends ComponentProps<typeof Held$1> {
   /**
-   * The value that identifies this region, for a menu opened from more than one.
+   * Value that identifies the region, for a menu opened from several.
    */
   readonly value?: string | undefined;
 }
 /**
- * Opens the menu where the pointer is.
+ * Renders the region with the machine's context trigger props merged over the caller's.
  *
- * @param props - The name of this region, and everything a styled div takes.
- * @returns The region, carrying what the machine writes onto it.
+ * @param props - The region's value and the props of a `div`.
+ * @returns The `div` element.
  */
 declare function ContextTrigger({ value, ...rest }: ContextTriggerProps): ReactElement;
 //#endregion
-//#region src/menu/indicator.d.ts
+//#region src/menu/indicator.d.ts
+/**
+ * Renders the `span` with the menu's indicator class.
+ */
+declare const Marked$2: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of the indicator: the props of a `span`.
+ */
+type IndicatorProps$3 = ComponentProps<typeof Marked$2>;
+/**
+ * Renders the indicator, hidden from assistive technology, with the machine's indicator props.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function Indicator$3(props: IndicatorProps$3): ReactElement;
+//#endregion
+//#region src/menu/item-command.d.ts
+/**
+ * Renders the `kbd` with the menu's item command class.
+ */
+declare const Struck: import("@stealthscale/theme").StyledComponent<"kbd", {}>;
+/**
+ * Describes the props of a row's shortcut: the props of a `kbd`.
+ */
+type ItemCommandProps = ComponentProps<typeof Struck>;
+/**
+ * Renders the shortcut, and throws when no menu is above it.
+ *
+ * @param props - The props of a `kbd`.
+ * @returns The `kbd` element.
+ */
+declare function ItemCommand(props: ItemCommandProps): ReactElement;
+//#endregion
+//#region src/menu/item-description.d.ts
+/**
+ * Renders the `span` with the menu's item description class.
+ */
+declare const Described: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of a row's description: the props of a `span`.
+ */
+type ItemDescriptionProps = ComponentProps<typeof Described>;
+/**
+ * Renders the description, and throws when no menu is above it.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function ItemDescription(props: ItemDescriptionProps): ReactElement;
+//#endregion
+//#region src/menu/item-group-label.d.ts
+/**
+ * Renders the `div` with the menu's item group label class.
+ */
+declare const Titled: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a group's label: its group's value and the props of a `div`.
+ */
+interface ItemGroupLabelProps extends ComponentProps<typeof Titled> {
+  /**
+   * Value of the group the label names.
+   */
+  readonly value: string;
+}
+/**
+ * Renders the label with the machine's item group label props merged over the caller's.
+ *
+ * @param props - The group's value and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ItemGroupLabel({ value, ...rest }: ItemGroupLabelProps): ReactElement;
+//#endregion
+//#region src/menu/item-group.d.ts
+/**
+ * Renders the `div` with the menu's item group class.
+ */
+declare const Grouped: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a group: its value and the props of a `div`.
+ */
+interface ItemGroupProps extends ComponentProps<typeof Grouped> {
+  /**
+   * Value the group and its label share.
+   */
+  readonly value: string;
+}
+/**
+ * Renders the group with the machine's item group props merged over the caller's.
+ *
+ * @param props - The group's value and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ItemGroup({ value, ...rest }: ItemGroupProps): ReactElement;
+//#endregion
+//#region src/menu/item-indicator.d.ts
+/**
+ * Renders the `span` with the menu's item indicator class.
+ */
+declare const Marked$1: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of the item indicator: the props of a `span`.
+ */
+type ItemIndicatorProps = ComponentProps<typeof Marked$1>;
+/**
+ * Renders the mark with the machine's item indicator props, without `hidden`.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function ItemIndicator(props: ItemIndicatorProps): ReactElement;
+//#endregion
+//#region src/menu/item-lines.d.ts
+/**
+ * Renders the `span` with the menu's item lines class.
+ */
+declare const Stacked: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of a row's lines: the props of a `span`.
+ */
+type ItemLinesProps = ComponentProps<typeof Stacked>;
+/**
+ * Renders the column, and throws when no menu is above it.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function ItemLines(props: ItemLinesProps): ReactElement;
+//#endregion
+//#region src/menu/item-mark.d.ts
+/**
+ * Renders the `span` with the menu's item mark class, hidden from assistive technology.
+ */
+declare const Marked: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of a row's mark: the props of a `span`.
+ */
+type ItemMarkProps = ComponentProps<typeof Marked>;
+/**
+ * Renders the mark, and throws when no menu is above it.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function ItemMark(props: ItemMarkProps): ReactElement;
+//#endregion
+//#region src/menu/item-text.d.ts
+/**
+ * Renders the `span` with the menu's item text class.
+ */
+declare const Worded: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of a row's text: the props of a `span`.
+ */
+type ItemTextProps = ComponentProps<typeof Worded>;
+/**
+ * Renders the text with the machine's item text props merged over the caller's.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function ItemText(props: ItemTextProps): ReactElement;
+//#endregion
+//#region src/menu/tone.d.ts
+/**
+ * Types the tone of a menu row.
+ *
+ * @remarks
+ *   The tone is a prop of the row. A slot recipe resolves its variants once, at the root, and one
+ *   row differs from the rest. The row sets the tone as `data-tone`, and the recipe's base styles
+ *   the attribute.
+ */
+/**
+ * Tone of a row: `critical` for a row that destroys or undoes something, in the error palette.
+ */
+type Tone = "critical";
+//#endregion
+//#region src/menu/item.d.ts
+/**
+ * Renders the `div` with the menu's item class.
+ */
+declare const Chosen$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a row: its value, its options, its tone and the props of a `div`.
+ */
+interface ItemProps$1 extends Omit<ComponentProps<typeof Chosen$1>, "onSelect"> {
+  /**
+   * Whether choosing the row closes the menu. Defaults to true.
+   */
+  readonly closeOnSelect?: boolean | undefined;
+  /**
+   * Whether the row is disabled.
+   */
+  readonly disabled?: boolean | undefined;
+  /**
+   * Tone of the row, which sets its palette.
+   */
+  readonly tone?: Tone | undefined;
+  /**
+   * Value the machine identifies the row by and reports when it is chosen.
+   */
+  readonly value: string;
+  /**
+   * Text typeahead matches, when it differs from the rendered text.
+   */
+  readonly valueText?: string | undefined;
+}
+/**
+ * Renders the row with the machine's item props and `data-tone`, and provides its state.
+ *
+ * @param props - The row's value, options, tone and the props of a `div`.
+ * @returns The `div` element inside the item provider.
+ */
+declare function Item$1({ closeOnSelect, disabled, tone, value, valueText, ...rest }: ItemProps$1): ReactElement;
+//#endregion
+//#region src/menu/option-item.d.ts
+/**
+ * Renders the `div` with the menu's item class.
+ */
+declare const Chosen: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a checkable row: its checked state, its type, its value and the props of a
+ * `div`.
+ */
+interface OptionItemProps extends Omit<ComponentProps<typeof Chosen>, "onSelect"> {
+  /**
+   * Whether the row is checked.
+   */
+  readonly checked: boolean;
+  /**
+   * Whether choosing the row closes the menu. Defaults to true for a radio and false for a
+   * checkbox.
+   */
+  readonly closeOnSelect?: boolean | undefined;
+  /**
+   * Whether the row is disabled.
+   */
+  readonly disabled?: boolean | undefined;
+  /**
+   * Called with the new checked state when the row is chosen.
+   */
+  readonly onCheckedChange?: ((checked: boolean) => void) | undefined;
+  /**
+   * Tone of the row, which sets its palette.
+   */
+  readonly tone?: Tone | undefined;
+  /**
+   * Whether the row is a checkbox or a radio.
+   */
+  readonly type: "checkbox" | "radio";
+  /**
+   * Value the machine identifies the row by and reports when it is chosen.
+   */
+  readonly value: string;
+  /**
+   * Text typeahead matches, when it differs from the rendered text.
+   */
+  readonly valueText?: string | undefined;
+}
+/**
+ * Renders the row with the machine's option item props and `data-tone`, and provides its state.
+ *
+ * @param props - The row's checked state, type, value, options, tone and the props of a `div`.
+ * @returns The `div` element inside the item provider.
+ */
+declare function OptionItem({ checked, closeOnSelect, disabled, onCheckedChange, tone, type, value, valueText, ...rest }: OptionItemProps): ReactElement;
+//#endregion
+//#region src/menu/positioner.d.ts
+/**
+ * Renders the `div` with the menu's positioner class.
+ */
+declare const Placed$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the positioner: the props of a `div`.
+ */
+type PositionerProps$3 = ComponentProps<typeof Placed$2>;
+/**
+ * Renders the positioner with the machine's positioner props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element, or nothing while the panel is out of the document.
+ */
+declare function Positioner$3(props: PositionerProps$3): null | ReactElement;
+//#endregion
+//#region src/menu/recipe.d.ts
+/**
+ * Defines the menu recipe: the surface look at size `md` in the neutral palette, with the tint
+ * highlight, by default.
+ */
+declare const recipe: import("@stealthscale/theme/authoring").SlotRecipe<"arrow" | "arrowTip" | "content" | "contextTrigger" | "indicator" | "item" | "itemCommand" | "itemDescription" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemLines" | "itemMark" | "itemText" | "positioner" | "root" | "rows" | "separator" | "trigger" | "triggerItem" | "viewport", {
+  /**
+   * Look of the highlighted row.
+   */
+  readonly highlight: {
+    bar: Partial<Record<"item" | "triggerItem", SystemStyleObject>>;
+    fill: Partial<Record<"item" | "triggerItem", SystemStyleObject>>;
+    tint: Partial<Record<"item" | "triggerItem", SystemStyleObject>>;
+  };
+  /**
+   * Whether a row without a leading icon or mark starts its text after the gutter an icon takes,
+   * for a menu where some rows lead with an icon.
+   */
+  readonly inset: {
+    readonly true: {
+      readonly item: {
+        readonly "&:not(:has(> svg:first-child, > .menu__itemMark:first-child))": {
+          readonly paddingInlineStart: "var(--menu-gutter)";
+        };
+      };
+      readonly triggerItem: {
+        readonly "&:not(:has(> svg:first-child, > .menu__itemMark:first-child))": {
+          readonly paddingInlineStart: "var(--menu-gutter)";
+        };
+      };
+    };
+  };
+  /**
+   * Palette of the rows and the highlight, set on the panel, which a portalled panel keeps.
+   */
+  readonly palette: {
+    accent: Record<"content", SystemStyleObject>;
+    error: Record<"content", SystemStyleObject>;
+    info: Record<"content", SystemStyleObject>;
+    neutral: Record<"content", SystemStyleObject>;
+    primary: Record<"content", SystemStyleObject>;
+    secondary: Record<"content", SystemStyleObject>;
+    success: Record<"content", SystemStyleObject>;
+    warning: Record<"content", SystemStyleObject>;
+  };
+  /**
+   * Size of the panel's padding, the rows, the marks and the keys.
+   */
+  readonly size: {
+    "2xl": Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+    "3xl": Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+    "4xl": Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+    lg: Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+    md: Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+    sm: Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+    xl: Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+    xs: Partial<Record<"content" | "indicator" | "item" | "itemCommand" | "itemGroupLabel" | "itemIndicator" | "itemMark" | "rows" | "separator" | "triggerItem" | "viewport", SystemStyleObject>>;
+  };
+  /**
+   * Surface of the panel: the popover surface inside a hairline edge, the panel surface with a
+   * large shadow, or the glass layer style.
+   *
+   * @remarks
+   *   The elevated panel has a transparent hairline edge, which forced colors paint in
+   *   `CanvasText`, so the panel keeps its outline where the shadow is not drawn.
+   */
+  readonly variant: {
+    readonly elevated: {
+      readonly arrowTip: {
+        borderColor: "var(--menu-surface)";
+      };
+      readonly content: {
+        readonly "--menu-surface": "colors.bg.panel";
+        readonly background: "var(--menu-surface)";
+        readonly borderColor: "transparent";
+        readonly borderRadius: "l2";
+        readonly borderStyle: "solid";
+        readonly borderWidth: "hairline";
+        readonly boxShadow: "lg";
+      };
+    };
+    readonly glass: {
+      readonly arrowTip: {
+        readonly borderColor: "border";
+      };
+      readonly content: {
+        readonly layerStyle: "glass";
+        readonly "--menu-surface": "colors.bg.popover";
+        readonly borderRadius: "l2";
+      };
+    };
+    readonly surface: {
+      readonly arrowTip: {
+        readonly borderColor: "border";
+      };
+      readonly content: {
+        readonly "--menu-surface": "colors.bg.popover";
+        readonly background: "var(--menu-surface)";
+        readonly borderColor: "border";
+        readonly borderRadius: "l2";
+        readonly borderWidth: "hairline";
+        readonly boxShadow: "md";
+      };
+    };
+  };
+}>;
+//#endregion
+//#region src/menu/variants.d.ts
+/**
+ * Describes the variants a caller sets on a menu.
+ */
+type MenuVariants = RecipeProps<typeof recipe>;
+//#endregion
+//#region src/menu/machine.d.ts
+/**
+ * Describes the machine settings a caller can pass to the root, all optional.
+ */
+type MenuOptions = Partial<menu.Props>;
+//#endregion
+//#region src/menu/root.d.ts
+/**
+ * Renders the `div` that provides the recipe's variants.
+ */
+declare const Framed$6: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly highlight?: import("@stealthscale/theme/authoring").Highlight | undefined;
+  readonly inset?: boolean | undefined;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+  readonly size?: import("@stealthscale/theme/authoring").Scale | undefined;
+  readonly variant?: "elevated" | "glass" | "surface" | undefined;
+}>;
+/**
+ * Describes the props of the root: the machine's options, the panel's presence, the recipe's
+ * variants and the props of a `div`.
+ *
+ * @remarks
+ *   The element's `id` and `dir` are left out, because the machine takes both. The element's
+ *   `onSelect` is left out too, because a `div` reports a text selection under that name and the
+ *   machine reports the chosen row.
+ */
+interface RootProps$6 extends MenuOptions, Omit<ComponentProps<typeof Framed$6>, "dir" | "id" | "onSelect">, OverlayPresence {}
+/**
+ * Renders the root, provides its menu level to the parts and registers a submenu with its parent.
+ *
+ * @param props - The machine's options, the panel's presence, the recipe's variants and the props
+ *   of a `div`.
+ * @returns The `div` element inside the api provider.
+ */
+declare function Root$6({ lazyMount, onExitComplete, skipAnimationOnMount, unmountOnExit, ...props }: RootProps$6): ReactElement;
+//#endregion
+//#region src/menu/separator.d.ts
+/**
+ * Renders the `div` with the menu's separator class.
+ */
+declare const Ruled: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the separator: the props of a `div`.
+ */
+type SeparatorProps$1 = ComponentProps<typeof Ruled>;
+/**
+ * Renders the separator with the machine's separator props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Separator$1(props: SeparatorProps$1): ReactElement;
+//#endregion
+//#region src/menu/trigger-item.d.ts
+/**
+ * Renders the `button` with the menu's trigger item class.
+ */
+declare const Pressed$6: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of the trigger row: the props of a `button`.
+ */
+type TriggerItemProps = ComponentProps<typeof Pressed$6>;
+/**
+ * Renders the row with the parent machine's trigger item props merged over the caller's.
+ *
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
+ * @throws {@link Error} When the menu it is rendered in has no parent menu.
+ */
+declare function TriggerItem(props: TriggerItemProps): ReactElement;
+//#endregion
+//#region src/menu/trigger.d.ts
+/**
+ * Renders the `button` with the menu's trigger class.
+ */
+declare const Pressed$5: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of the trigger: its value and the props of a `button`.
+ */
+interface TriggerProps$6 extends ComponentProps<typeof Pressed$5> {
+  /**
+   * Value that identifies the trigger, for a menu opened from several.
+   */
+  readonly value?: string | undefined;
+}
+/**
+ * Renders the trigger with the machine's trigger props merged over the caller's.
+ *
+ * @param props - The trigger's value and the props of a `button`.
+ * @returns The `button` element.
+ */
+declare function Trigger$6({ value, ...rest }: TriggerProps$6): ReactElement;
+declare namespace index_d_exports$4 {
+  export { Arrow$3 as Arrow, ArrowProps$3 as ArrowProps, ArrowTip$3 as ArrowTip, ArrowTipProps$3 as ArrowTipProps, Content$6 as Content, ContentProps$6 as ContentProps, ContextTrigger, ContextTriggerProps, Indicator$3 as Indicator, IndicatorProps$3 as IndicatorProps, Item$1 as Item, ItemCommand, ItemCommandProps, ItemDescription, ItemDescriptionProps, ItemGroup, ItemGroupLabel, ItemGroupLabelProps, ItemGroupProps, ItemIndicator, ItemIndicatorProps, ItemLines, ItemLinesProps, ItemMark, ItemMarkProps, ItemProps$1 as ItemProps, ItemText, ItemTextProps, OptionItem, OptionItemProps, Positioner$3 as Positioner, PositionerProps$3 as PositionerProps, Root$6 as Root, RootProps$6 as RootProps, Separator$1 as Separator, SeparatorProps$1 as SeparatorProps, Tone, Trigger$6 as Trigger, TriggerItem, TriggerItemProps, TriggerProps$6 as TriggerProps };
+}
+//#endregion
+//#region src/menubar/bar.d.ts
+/**
+ * Describes what `onValueChange` receives: the value of the open menu, or an empty string once
+ * every menu is closed.
+ */
+interface ValueChangeDetails {
+  /**
+   * Value of the open menu, or an empty string.
+   */
+  readonly value: string;
+}
+//#endregion
+//#region src/menubar/content.d.ts
+/**
+ * Describes the props of the panel: the props of the menu's panel.
+ */
+type ContentProps$5 = ContentProps$6;
+/**
+ * Renders the positioner and the panel, and steps the bar on the sideways arrows.
+ *
+ * @remarks
+ *   The menu opens on the render after the step, and its panel enters the document on a later
+ *   one, so the panel claims the step once its first row is in the document.
+ * @param props - The rows and the props of the menu's panel.
+ * @returns The positioner, or nothing while the panel is out of the document.
+ */
+declare function Content$5({ onKeyDownCapture, ...props }: ContentProps$5): ReactElement;
+//#endregion
+//#region src/menubar/menu.d.ts
+/**
+ * Describes the props of a menu: its value and the props of a menu root, whose open state the bar
+ * keeps.
+ */
+interface MenuProps extends Omit<RootProps$6, "defaultOpen" | "onOpenChange" | "open"> {
+  /**
+   * Value of the menu, which the bar reports while the menu is open.
+   */
+  readonly value: string;
+}
+/**
+ * Renders the menu's root, opened and closed by the bar outside the folded bar's menu.
+ *
+ * @param props - The value, the name, the panel and the props of a menu root.
+ * @returns The menu root inside the value's provider.
+ */
+declare function Menu({ value, ...props }: MenuProps): ReactElement;
+//#endregion
+//#region src/menubar/root.d.ts
+/**
+ * Renders the `div` that measures the row and provides the recipe's size and palette.
+ */
+declare const Framed$5: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+  readonly size?: "lg" | "md" | "sm" | undefined;
+}>;
+/**
+ * Describes the props of the root: the bar's name, value, direction, loop and fold, the menus'
+ * variants, and the props of a `div`.
+ */
+interface RootProps$5 extends Omit<MenuVariants, "inset" | "size">, Omit<ComponentProps<typeof Framed$5>, "defaultValue" | "dir" | "value"> {
+  /**
+   * Name of the bar, which a screen reader announces on reaching it.
+   */
+  readonly "aria-label": string;
+  /**
+   * Menus of the bar, each a `Menubar.Menu`.
+   */
+  readonly children?: ReactNode | undefined;
+  /**
+   * Value of the menu open at mount.
+   */
+  readonly defaultValue?: string | undefined;
+  /**
+   * Writing direction of the bar and its menus. In `rtl` the bar runs from the right, the arrows
+   * along it swap, and a submenu opens to the left.
+   */
+  readonly dir?: "ltr" | "rtl" | undefined;
+  /**
+   * Words of the trigger a crowded bar folds into. Defaults to `Menu`.
+   */
+  readonly fold?: string | undefined;
+  /**
+   * Glyph before the fold trigger's words.
+   */
+  readonly foldIcon?: ReactNode | undefined;
+  /**
+   * Glyph after the words of a row of the folded menu that opens a menu of the bar.
+   */
+  readonly foldIndicator?: ReactNode | undefined;
+  /**
+   * Whether a step past one end of the bar continues at the other. Defaults to true.
+   */
+  readonly loop?: boolean | undefined;
+  /**
+   * Runs when another menu opens or every menu closes.
+   */
+  readonly onValueChange?: ((details: ValueChangeDetails) => void) | undefined;
+  /**
+   * Value of the open menu, where the caller keeps it. An empty string closes every menu.
+   */
+  readonly value?: string | undefined;
+}
+/**
+ * Renders the root, the bar and the fold trigger, and provides the bar to its menus.
+ *
+ * @param props - The bar's name, value, direction, loop and fold, the menus' variants, and the
+ *   props of a `div`.
+ * @returns The `div` element inside the bar's provider.
+ */
+declare function Root$5({ "aria-label": label, children, defaultValue, dir, fold, foldIcon, foldIndicator, highlight, loop, onValueChange, palette, size, value, variant, ...rest }: RootProps$5): ReactElement;
+//#endregion
+//#region src/menubar/trigger.d.ts
+/**
+ * Describes the props of a name: its words.
+ */
+interface TriggerProps$5 {
+  /**
+   * Words of the name, after a leading icon where it has one.
+   */
+  readonly children?: ReactNode | undefined;
+}
+/**
+ * Renders the name as the bar's item, or as the folded bar's submenu row.
+ *
+ * @param props - The words.
+ * @returns The `button` element.
+ */
+declare function Trigger$5({ children }: TriggerProps$5): ReactElement;
+declare namespace index_d_exports$5 {
+  export { Content$5 as Content, ContentProps$5 as ContentProps, Menu, MenuProps, Root$5 as Root, RootProps$5 as RootProps, Trigger$5 as Trigger, TriggerProps$5 as TriggerProps, ValueChangeDetails };
+}
+//#endregion
+//#region src/popover/anchor.d.ts
+/**
+ * Renders the `div` with the popover's anchor class.
+ */
+declare const Drawn$14: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the anchor: the props of a `div`.
+ */
+type AnchorProps = ComponentProps<typeof Drawn$14>;
+/**
+ * Renders the anchor with the machine's anchor props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Anchor(props: AnchorProps): ReactElement;
+//#endregion
+//#region src/popover/arrow-tip.d.ts
+/**
+ * Renders the `div` with the popover's arrow tip class.
+ */
+declare const Drawn$13: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the arrow tip: the props of a `div`.
+ */
+type ArrowTipProps$2 = ComponentProps<typeof Drawn$13>;
+/**
+ * Renders the arrow tip with the machine's arrow tip props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ArrowTip$2(props: ArrowTipProps$2): ReactElement;
+//#endregion
+//#region src/popover/arrow.d.ts
+/**
+ * Renders the `div` with the popover's arrow class.
+ */
+declare const Drawn$12: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the arrow: the props of a `div`.
+ */
+type ArrowProps$2 = ComponentProps<typeof Drawn$12>;
+/**
+ * Renders the arrow with the machine's arrow props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Arrow$2(props: ArrowProps$2): ReactElement;
+//#endregion
+//#region src/popover/close-trigger.d.ts
+/**
+ * Renders the `button` with the popover's close trigger class.
+ */
+declare const Drawn$11: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of the close trigger: the props of a `button`.
+ */
+type CloseTriggerProps$1 = ComponentProps<typeof Drawn$11>;
+/**
+ * Renders the close trigger with the machine's close trigger props merged over the caller's.
+ *
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
+ */
+declare function CloseTrigger$1(props: CloseTriggerProps$1): ReactElement;
+//#endregion
+//#region src/popover/content.d.ts
+/**
+ * Renders the `div` with the popover's content class.
+ */
+declare const Drawn$10: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the content: the props of a `div`, without `ref`, which the presence
+ * takes.
+ */
+type ContentProps$4 = Omit<ComponentProps<typeof Drawn$10>, "ref">;
+/**
+ * Renders the panel with the machine's content props, the panel's names and the presence props
+ * merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Content$4(props: ContentProps$4): ReactElement;
+//#endregion
+//#region src/popover/description.d.ts
+/**
+ * Renders the `p` with the popover's description class.
+ */
+declare const Drawn$9: import("@stealthscale/theme").StyledComponent<"p", {}>;
+/**
+ * Describes the props of the description: the props of a `p`.
+ */
+type DescriptionProps$1 = ComponentProps<typeof Drawn$9>;
+/**
+ * Renders the description with the machine's description props merged over the caller's, and
+ * reports it to the root.
+ *
+ * @param props - The props of a `p`.
+ * @returns The `p` element.
+ */
+declare function Description$1(props: DescriptionProps$1): ReactElement;
+//#endregion
+//#region src/popover/indicator.d.ts
+/**
+ * Renders the `span` with the popover's indicator class.
+ */
+declare const Drawn$8: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of the indicator: the props of a `span`.
+ */
+type IndicatorProps$2 = ComponentProps<typeof Drawn$8>;
+/**
+ * Renders the indicator, hidden from assistive technology, with the machine's indicator props.
+ *
+ * @param props - The props of a `span`.
+ * @returns The `span` element.
+ */
+declare function Indicator$2(props: IndicatorProps$2): ReactElement;
+//#endregion
+//#region src/popover/positioner.d.ts
+/**
+ * Renders the `div` with the popover's positioner class.
+ */
+declare const Drawn$7: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the positioner: the props of a `div`.
+ */
+type PositionerProps$2 = ComponentProps<typeof Drawn$7>;
+/**
+ * Renders the positioner with the machine's positioner props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element, or nothing while the panel is out of the document.
+ */
+declare function Positioner$2(props: PositionerProps$2): null | ReactElement;
+//#endregion
+//#region src/popover/machine.d.ts
+/**
+ * Describes the machine settings a caller can pass to the root, all optional.
+ *
+ * @remarks
+ *   `translations` is omitted, because a component's words are props. The close trigger takes its
+ *   accessible name as `aria-label` on `Popover.CloseTrigger`.
+ */
+type PopoverOptions = Omit<Partial<popover.Props>, "translations">;
+//#endregion
+//#region src/popover/root.d.ts
+/**
+ * Renders the `div` that provides the recipe's variants.
+ */
+declare const Framed$4: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly size?: "lg" | "md" | "sm" | "xl" | "xs" | undefined;
+  readonly variant?: "elevated" | "glass" | "surface" | undefined;
+}>;
+/**
+ * Describes the props of the root: the machine's options, the panel's presence, the recipe's
+ * variants and the props of a `div`.
+ *
+ * @remarks
+ *   The element's `id` and `dir` are left out, because the machine takes both. It derives every
+ *   part's id from `id`, and reads `dir` for the placement.
+ */
+interface RootProps$4 extends Omit<ComponentProps<typeof Framed$4>, "dir" | "id">, OverlayPresence, PopoverOptions {}
+/**
+ * Renders the root and provides the machine's api and the panel's presence to the parts.
+ *
+ * @param props - The machine's options, the panel's presence, the recipe's variants and the props
+ *   of a `div`.
+ * @returns The `div` element inside the providers.
+ */
+declare function Root$4({ lazyMount, onExitComplete, skipAnimationOnMount, unmountOnExit, ...props }: RootProps$4): ReactElement;
+//#endregion
+//#region src/popover/title.d.ts
 /**
- * Draws the mark at the size the root states.
+ * Renders the `h2` with the popover's title class.
  */
-declare const Marked$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Drawn$6: import("@stealthscale/theme").StyledComponent<"h2", {}>;
 /**
- * Describes what the mark takes.
+ * Describes the props of the title: the props of an `h2`.
  */
-type IndicatorProps$2 = ComponentProps<typeof Marked$1>;
+type TitleProps$1 = ComponentProps<typeof Drawn$6>;
 /**
- * Says whether the menu is open.
+ * Renders the title with the machine's title props merged over the caller's, and reports it to
+ * the root.
  *
- * @param props - Everything a styled div takes.
- * @returns The mark, carrying the open state.
+ * @param props - The props of an `h2`.
+ * @returns The heading element.
  */
-declare function Indicator$2(props: IndicatorProps$2): ReactElement;
+declare function Title$1(props: TitleProps$1): ReactElement;
 //#endregion
-//#region src/menu/item-group-label.d.ts
+//#region src/popover/trigger.d.ts
 /**
- * Draws the heading at the size the root states.
+ * Renders the `button` with the popover's trigger class.
  */
-declare const Titled: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Drawn$5: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Describes what the heading takes.
+ * Describes the props of the trigger: the props of a `button`.
  */
-interface ItemGroupLabelProps extends ComponentProps<typeof Titled> {
-  /**
-   * Ties the heading to the set it names.
-   */
-  readonly value: string;
-}
+type TriggerProps$4 = ComponentProps<typeof Drawn$5>;
 /**
- * Says what the rows below it have in common.
+ * Renders the trigger with the machine's trigger props merged over the caller's.
  *
- * @param props - The name the set shares, beside everything a styled div takes.
- * @returns The heading, carrying what the machine writes onto it.
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
  */
-declare function ItemGroupLabel({ value, ...rest }: ItemGroupLabelProps): ReactElement;
+declare function Trigger$4(props: TriggerProps$4): ReactElement;
+declare namespace index_d_exports$6 {
+  export { Anchor, AnchorProps, Arrow$2 as Arrow, ArrowProps$2 as ArrowProps, ArrowTip$2 as ArrowTip, ArrowTipProps$2 as ArrowTipProps, CloseTrigger$1 as CloseTrigger, CloseTriggerProps$1 as CloseTriggerProps, Content$4 as Content, ContentProps$4 as ContentProps, Description$1 as Description, DescriptionProps$1 as DescriptionProps, Indicator$2 as Indicator, IndicatorProps$2 as IndicatorProps, Positioner$2 as Positioner, PositionerProps$2 as PositionerProps, Root$4 as Root, RootProps$4 as RootProps, Title$1 as Title, TitleProps$1 as TitleProps, Trigger$4 as Trigger, TriggerProps$4 as TriggerProps };
+}
 //#endregion
-//#region src/menu/item-group.d.ts
+//#region src/steps/completed-content.d.ts
 /**
- * Draws the set at the size the root states.
+ * Renders the `div` with the steps' content class.
  */
-declare const Grouped: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Shown$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what a set takes.
+ * Describes the props of the completed content: the props of a `div`.
  */
-interface ItemGroupProps extends ComponentProps<typeof Grouped> {
-  /**
-   * Ties the set to the label that names it.
-   */
-  readonly value: string;
-}
+type CompletedContentProps = ComponentProps<typeof Shown$2>;
 /**
- * Groups the rows that belong together.
+ * Renders the completed content with the machine's content props for the step after the last,
+ * less its tab semantics, merged over the caller's.
  *
- * @param props - The name the label shares, beside everything a styled div takes.
- * @returns The set, carrying what the machine writes onto it.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function ItemGroup({ value, ...rest }: ItemGroupProps): ReactElement;
+declare function CompletedContent(props: CompletedContentProps): ReactElement;
 //#endregion
-//#region src/menu/item-indicator.d.ts
+//#region src/steps/content.d.ts
 /**
- * Draws the mark at the size the root states.
+ * Renders the `div` with the steps' content class.
  */
-declare const Marked: import("@stealthscale/theme").StyledComponent<"span", {}>;
+declare const Shown$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the mark takes.
+ * Describes the props of the content: the index of its step and the props of a `div`.
  */
-type ItemIndicatorProps = ComponentProps<typeof Marked>;
+interface ContentProps$3 extends ComponentProps<typeof Shown$1> {
+  /**
+   * Index of the step the content belongs to, from zero.
+   */
+  readonly index: number;
+}
 /**
- * Says the row is on.
+ * Renders the content with the machine's content props, less its tab semantics, merged over the
+ * caller's.
  *
- * @param props - Everything a styled span takes.
- * @returns The mark, carrying the row's state.
+ * @param props - The step's index and the props of a `div`.
+ * @returns The `div` element.
  */
-declare function ItemIndicator(props: ItemIndicatorProps): ReactElement;
+declare function Content$3({ index, ...rest }: ContentProps$3): ReactElement;
 //#endregion
-//#region src/menu/item-text.d.ts
+//#region src/steps/description.d.ts
 /**
- * Draws the words at the size the root states.
+ * Renders the `span` with the steps' description class.
  */
-declare const Worded: import("@stealthscale/theme").StyledComponent<"span", {}>;
+declare const Description: import("@stealthscale/theme").StyledComponent<"span", {}>;
 /**
- * Describes what the words take.
+ * Describes the props of the description: the props of a `span`.
  */
-type ItemTextProps = ComponentProps<typeof Worded>;
+type DescriptionProps = ComponentProps<typeof Description>;
+//#endregion
+//#region src/steps/indicator.d.ts
 /**
- * Says what the row offers.
- *
- * @param props - Everything a styled span takes.
- * @returns The words, carrying the row's state.
+ * Renders the `span` with the steps' indicator class.
  */
-declare function ItemText(props: ItemTextProps): ReactElement;
-//#endregion
-//#region src/menu/tone.d.ts
+declare const Disc: import("@stealthscale/theme").StyledComponent<"span", {}>;
 /**
- * States what a row of a menu is for, which decides the ink it is drawn in.
- *
- * @remarks
- *   This is a prop rather than an axis of the recipe, because a slot recipe resolves its variants
- *   once at the root and a menu draws one row in a different ink from the rest. The row writes it
- *   as a data attribute and the recipe's base styles it, which is the hook a theme extends to add
- *   another.
+ * Describes the props of the indicator: the props of a `span`.
  */
+type IndicatorProps$1 = ComponentProps<typeof Disc>;
 /**
- * Selects what a row is for.
+ * Renders the indicator with the machine's indicator props merged over the caller's.
  *
- * @remarks
- *   A row that undoes something is the one case a menu draws differently, and colour is a second
- *   reading of what its words already say rather than the only one.
+ * @param props - The props of a `span`. Children replace the step's number.
+ * @returns The `span` element.
  */
-type Tone = "critical";
+declare function Indicator$1({ children, ...rest }: IndicatorProps$1): ReactElement;
 //#endregion
-//#region src/menu/item.d.ts
+//#region src/steps/item.d.ts
 /**
- * Draws the row at the size the root states.
+ * Renders the `li` with the steps' item class.
  */
-declare const Chosen$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Held: import("@stealthscale/theme").StyledComponent<"li", {}>;
 /**
- * Describes what a row takes.
+ * Describes the props of an item: the step's index and the props of an `li`.
  */
-interface ItemProps extends Omit<ComponentProps<typeof Chosen$1>, "onSelect"> {
-  /**
-   * Whether choosing the row closes the menu, which it does unless the row says otherwise.
-   */
-  readonly closeOnSelect?: boolean | undefined;
-  /**
-   * Whether a reader can choose the row at all.
-   */
-  readonly disabled?: boolean | undefined;
-  /**
-   * The purpose of the row, which decides the ink it is drawn in.
-   */
-  readonly tone?: Tone | undefined;
+interface ItemProps extends ComponentProps<typeof Held> {
   /**
-   * The value the machine identifies the row by and reports when the reader chooses it.
+   * Index of the step, from zero.
    */
-  readonly value: string;
-  /**
-   * The words typeahead matches the row on, where they differ from what it shows.
-   */
-  readonly valueText?: string | undefined;
+  readonly index: number;
 }
 /**
- * Offers one thing a reader can choose.
+ * Renders the item with the machine's item props and provides its index to the parts inside it.
  *
- * @param props - The row's name and purpose, beside everything a styled div takes.
- * @returns The row, carrying what the machine writes onto it.
+ * @param props - The step's index and the props of an `li`.
+ * @returns The `li` element.
  */
-declare function Item({ closeOnSelect, disabled, tone, value, valueText, ...rest }: ItemProps): ReactElement;
+declare function Item({ index, ...rest }: ItemProps): ReactElement;
 //#endregion
-//#region src/menu/option-item.d.ts
+//#region src/steps/list.d.ts
 /**
- * Draws the row at the size the root states, in the same slot as a plain row.
+ * Renders the `ol` with the steps' list class.
  */
-declare const Chosen: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Listed: import("@stealthscale/theme").StyledComponent<"ol", {}>;
 /**
- * Describes what a row carrying a choice takes.
+ * Describes the props of the list: the props of an `ol` without `ref`.
  */
-interface OptionItemProps extends Omit<ComponentProps<typeof Chosen>, "onSelect"> {
-  /**
-   * Whether the row is on.
-   */
-  readonly checked: boolean;
-  /**
-   * Whether choosing the row closes the menu, which it does unless the row says otherwise.
-   */
-  readonly closeOnSelect?: boolean | undefined;
-  /**
-   * Whether a reader can choose the row at all.
-   */
-  readonly disabled?: boolean | undefined;
-  /**
-   * Tells the caller the reader turned the row on or off.
-   */
-  readonly onCheckedChange?: ((checked: boolean) => void) | undefined;
-  /**
-   * The purpose of the row, which decides the ink it is drawn in.
-   */
-  readonly tone?: Tone | undefined;
-  /**
-   * Whether the row stands on its own or is one of a set.
-   */
-  readonly type: "checkbox" | "radio";
-  /**
-   * The value the machine identifies the row by and reports when the reader chooses it.
-   */
-  readonly value: string;
-  /**
-   * The words typeahead matches the row on, where they differ from what it shows.
-   */
-  readonly valueText?: string | undefined;
-}
+type ListProps$1 = Omit<ComponentProps<typeof Listed>, "ref">;
 /**
- * Offers one thing a reader can turn on.
+ * Renders the list with the machine's list props, less its tab semantics, and the crowded state
+ * merged over the caller's.
  *
- * @param props - The choice the row carries, beside everything a styled div takes.
- * @returns The row, carrying what the machine writes onto it.
+ * @param props - The props of an `ol`.
+ * @returns The `ol` element.
  */
-declare function OptionItem({ checked, closeOnSelect, disabled, onCheckedChange, tone, type, value, valueText, ...rest }: OptionItemProps): ReactElement;
+declare function List$1(props: ListProps$1): ReactElement;
 //#endregion
-//#region src/menu/positioner.d.ts
+//#region src/steps/next-trigger.d.ts
 /**
- * Draws the box at the size the root states.
+ * Renders the `button` with the steps' next trigger class.
  */
-declare const Placed$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Pressed$4: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Describes what the box takes.
+ * Describes the props of the next trigger: the props of a `button`.
  */
-type PositionerProps$2 = ComponentProps<typeof Placed$2>;
+type NextTriggerProps = ComponentProps<typeof Pressed$4>;
 /**
- * Places the panel against the control.
+ * Renders the next trigger with the machine's props, `aria-disabled` in place of `disabled`, merged
+ * over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The box, carrying the position the machine measured.
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
  */
-declare function Positioner$2(props: PositionerProps$2): ReactElement;
+declare function NextTrigger(props: NextTriggerProps): ReactElement;
 //#endregion
-//#region src/menu/machine.d.ts
+//#region src/steps/prev-trigger.d.ts
 /**
- * Describes what a caller sets on the machine, every setting of it optional.
+ * Renders the `button` with the steps' previous trigger class.
  */
-type MenuOptions = Partial<menu.Props>;
-//#endregion
-//#region src/menu/root.d.ts
+declare const Pressed$3: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Draws the element that sets the variants every part below it reads, and no box.
+ * Describes the props of the previous trigger: the props of a `button`.
  */
-declare const Framed$3: import("@stealthscale/theme").StyledComponent<"div", {
-  readonly highlight?: import("@stealthscale/theme/authoring").Highlight;
-  readonly inset?: boolean;
-  readonly size?: import("@stealthscale/theme/authoring").Scale;
-  readonly variant?: "elevated" | "glass" | "surface";
-}>;
+type PrevTriggerProps = ComponentProps<typeof Pressed$3>;
 /**
- * Describes what the root takes: the machine's settings, the recipe's variants, and the element's.
+ * Renders the previous trigger with the machine's props, `aria-disabled` in place of `disabled`,
+ * merged over the caller's.
  *
- * @remarks
- *   The element's own `id` and `dir` are left out, because the machine states both. It names every
- *   part from the id, and it reads the direction to decide which side a submenu opens on. The
- *   element's `onSelect` is left out too: a div reports a text selection under that name, and the
- *   machine reports the row the reader chose.
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
  */
-interface RootProps$3 extends MenuOptions, Omit<ComponentProps<typeof Framed$3>, "dir" | "id" | "onSelect"> {}
+declare function PrevTrigger(props: PrevTriggerProps): ReactElement;
+//#endregion
+//#region src/steps/machine.d.ts
 /**
- * Opens a list of things a reader chooses from, beside the control that opens it.
- *
- * @param props - The machine's settings, the recipe's variants and the element's props together.
- * @returns The parts, under the running machine.
+ * Describes the machine settings a caller can pass to the root, all optional.
  */
-declare function Root$3(props: RootProps$3): ReactElement;
+type StepsOptions = Partial<steps.Props>;
 //#endregion
-//#region src/menu/separator.d.ts
+//#region src/steps/root.d.ts
 /**
- * Draws the line at the size the root states.
+ * Renders the `div` that provides the recipe's variants.
  */
-declare const Ruled: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Framed$3: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly labelPlacement?: "below" | "beside" | undefined;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+  readonly size?: "lg" | "md" | "sm" | undefined;
+  readonly variant?: "solid" | "subtle" | undefined;
+}>;
 /**
- * Describes what the line takes.
+ * Describes the props of the root: the machine's options, the recipe's variants and the props of a
+ * `div`.
+ *
+ * @remarks
+ *   The element's `dir` and `id` are left out, because the machine takes both.
  */
-type SeparatorProps = ComponentProps<typeof Ruled>;
+interface RootProps$3 extends Omit<ComponentProps<typeof Framed$3>, "dir" | "id">, StepsOptions {}
 /**
- * Breaks the rows into sets.
+ * Renders the root and provides the running machine to the parts.
  *
- * @param props - Everything a styled div takes.
- * @returns The line, carrying what the machine writes onto it.
+ * @param props - The machine's options, the recipe's variants and the props of a `div`.
+ * @returns The `div` element inside the machine's provider.
  */
-declare function Separator(props: SeparatorProps): ReactElement;
+declare function Root$3(props: RootProps$3): ReactElement;
 //#endregion
-//#region src/menu/trigger-item.d.ts
+//#region src/steps/separator.d.ts
 /**
- * Draws the row at the size the root states.
+ * Renders the `span` with the steps' separator class.
  */
-declare const Pressed$3: import("@stealthscale/theme").StyledComponent<"button", {}>;
+declare const Rule: import("@stealthscale/theme").StyledComponent<"span", {}>;
 /**
- * Describes what the row takes.
+ * Describes the props of the separator: the props of a `span`.
  */
-type TriggerItemProps = ComponentProps<typeof Pressed$3>;
+type SeparatorProps = ComponentProps<typeof Rule>;
 /**
- * Opens a submenu from a row of the menu above it.
+ * Renders the separator with the machine's separator props merged over the caller's, or nothing
+ * after the last step.
  *
- * @param props - Everything a styled button takes.
- * @returns The row, carrying what both machines write onto it.
- * @throws {@link Error} Where the menu it belongs to opens from no other menu.
+ * @param props - The props of a `span`.
+ * @returns The `span` element, or `null` for the last step.
  */
-declare function TriggerItem(props: TriggerItemProps): ReactElement;
+declare function Separator(props: SeparatorProps): null | ReactElement;
 //#endregion
-//#region src/menu/trigger.d.ts
-/**
- * Draws the control at the size the root states.
- */
-declare const Pressed$2: import("@stealthscale/theme").StyledComponent<"button", {}>;
+//#region src/steps/status.d.ts
 /**
- * Describes what the control takes.
+ * Describes the props of the status: the node for each state.
  */
-interface TriggerProps$3 extends ComponentProps<typeof Pressed$2> {
+interface StatusProps {
   /**
-   * The value that identifies this control, for a menu opened from more than one.
+   * Node a completed step shows, such as a check.
    */
-  readonly value?: string | undefined;
+  readonly complete?: ReactNode;
+  /**
+   * Node the current step shows.
+   */
+  readonly current?: ReactNode;
+  /**
+   * Node a later step shows.
+   */
+  readonly incomplete?: ReactNode;
 }
 /**
- * Opens the menu.
+ * Renders the prop for the step's state, or the step's number when that prop is absent.
  *
- * @param props - The name of this control, and everything a styled button takes.
- * @returns The control, carrying what the machine writes onto it.
+ * @param props - The node for each state.
+ * @returns The chosen node, or the step's number.
  */
-declare function Trigger$3({ value, ...rest }: TriggerProps$3): ReactElement;
-declare namespace index_d_exports$1 {
-  export { Arrow$2 as Arrow, ArrowProps$2 as ArrowProps, ArrowTip$2 as ArrowTip, ArrowTipProps$2 as ArrowTipProps, Content$3 as Content, ContentProps$3 as ContentProps, ContextTrigger, ContextTriggerProps, Indicator$2 as Indicator, IndicatorProps$2 as IndicatorProps, Item, ItemGroup, ItemGroupLabel, ItemGroupLabelProps, ItemGroupProps, ItemIndicator, ItemIndicatorProps, ItemProps, ItemText, ItemTextProps, OptionItem, OptionItemProps, Positioner$2 as Positioner, PositionerProps$2 as PositionerProps, Root$3 as Root, RootProps$3 as RootProps, Separator, SeparatorProps, Tone, Trigger$3 as Trigger, TriggerItem, TriggerItemProps, TriggerProps$3 as TriggerProps };
-}
+declare function Status({ complete, current, incomplete }: StatusProps): ReactNode;
 //#endregion
-//#region src/popover/anchor.d.ts
+//#region src/steps/title.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `span` with the steps' title class.
  */
-declare const Drawn$9: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Named: import("@stealthscale/theme").StyledComponent<"span", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of the title: the words for the two announced states and the props of a
+ * `span`.
  */
-type AnchorProps = ComponentProps<typeof Drawn$9>;
+interface TitleProps extends ComponentProps<typeof Named> {
+  /**
+   * Hidden words before the name of a completed step, "Completed: " unless the caller passes
+   * others.
+   */
+  readonly completedLabel?: string | undefined;
+  /**
+   * Hidden words before the name of the current step, "Current: " unless the caller passes others.
+   */
+  readonly currentLabel?: string | undefined;
+}
 /**
- * Marks what the panel is positioned against, where that is not the control.
+ * Renders the title, with the hidden words for the step's state before the caller's children.
  *
- * @param props - Everything a styled div takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @param props - The words for each state and the props of a `span`.
+ * @returns The `span` element.
  */
-declare function Anchor(props: AnchorProps): ReactElement;
+declare function Title({ children, completedLabel, currentLabel, ...rest }: TitleProps): ReactElement;
 //#endregion
-//#region src/popover/arrow-tip.d.ts
+//#region src/steps/trigger.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `button` with the steps' trigger class.
  */
-declare const Drawn$8: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Pressed$2: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of the trigger: the props of a `button`.
  */
-type ArrowTipProps$1 = ComponentProps<typeof Drawn$8>;
+type TriggerProps$3 = ComponentProps<typeof Pressed$2>;
 /**
- * Draws the turned square inside the point.
+ * Renders the trigger with the machine's trigger props, less its tab semantics, merged over the
+ * caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
  */
-declare function ArrowTip$1(props: ArrowTipProps$1): ReactElement;
+declare function Trigger$3(props: TriggerProps$3): ReactElement;
+declare namespace index_d_exports$7 {
+  export { CompletedContent, CompletedContentProps, Content$3 as Content, ContentProps$3 as ContentProps, Description, DescriptionProps, Indicator$1 as Indicator, IndicatorProps$1 as IndicatorProps, Item, ItemProps, List$1 as List, ListProps$1 as ListProps, NextTrigger, NextTriggerProps, PrevTrigger, PrevTriggerProps, Root$3 as Root, RootProps$3 as RootProps, Separator, SeparatorProps, Status, StatusProps, Title, TitleProps, Trigger$3 as Trigger, TriggerProps$3 as TriggerProps };
+}
 //#endregion
-//#region src/popover/arrow.d.ts
+//#region src/tabs/close-trigger.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `span` with the tabs' close trigger class.
  */
-declare const Drawn$7: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Glyph: import("@stealthscale/theme").StyledComponent<"span", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of the close trigger: its title and the props of a `span`.
  */
-type ArrowProps$1 = ComponentProps<typeof Drawn$7>;
+interface CloseTriggerProps extends ComponentProps<typeof Glyph> {
+  /**
+   * Title a pointer shows over the control. Defaults to "Close".
+   */
+  readonly label?: string | undefined;
+}
 /**
- * Draws the point that ties the panel to its control.
+ * Renders the close trigger inside a tab.
  *
- * @param props - Everything a styled div takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @param props - The title and the props of a `span`.
+ * @returns The `span` element.
  */
-declare function Arrow$1(props: ArrowProps$1): ReactElement;
+declare function CloseTrigger({ label, ...rest }: CloseTriggerProps): ReactElement;
 //#endregion
-//#region src/popover/close-trigger.d.ts
-/**
- * Draws the part at the size the root states.
- */
-declare const Drawn$6: import("@stealthscale/theme").StyledComponent<"button", {}>;
-/**
- * Describes what the part takes.
- */
-type CloseTriggerProps = ComponentProps<typeof Drawn$6>;
+//#region src/tabs/machine.d.ts
 /**
- * Draws the control that shuts the panel.
+ * Describes the machine settings a caller can pass to the root, all optional.
  *
- * @param props - Everything a styled button takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @remarks
+ *   `translations` is omitted, because a component's words are props. The list takes its
+ *   accessible name as `aria-label` on `Tabs.List`.
  */
-declare function CloseTrigger(props: CloseTriggerProps): ReactElement;
+type TabsOptions = Omit<Partial<tabs.Props>, "translations">;
 //#endregion
-//#region src/popover/content.d.ts
-/**
- * Draws the part at the size the root states.
- */
-declare const Drawn$5: import("@stealthscale/theme").StyledComponent<"div", {}>;
+//#region src/tabs/closing.d.ts
 /**
- * Describes what the part takes.
+ * Describes a close: the value of the tab to remove.
  */
-type ContentProps$2 = ComponentProps<typeof Drawn$5>;
+interface CloseDetails {
+  /**
+   * Value of the closed tab.
+   */
+  readonly value: string;
+}
 /**
- * Draws the panel itself.
+ * Returns the value a selection moves to when a tab closes: the tab after the closed one, else
+ * the tab before it, else none.
  *
- * @param props - Everything a styled div takes.
- * @returns The part, carrying what the machine writes onto it.
- */
-declare function Content$2(props: ContentProps$2): ReactElement;
+ * @remarks
+ *   A closed tab that is not selected leaves the selection where it is. A caller that closes tabs
+ *   from outside the list, such as from a menu, passes its own values and sets the result.
+ * @param values - The values of the tabs a selection may move to, in the list's order, with the
+ *   closed tab among them.
+ * @param selected - The selected value, or null.
+ * @param closed - The value of the tab that closes.
+ * @returns The value to select, or null for no selection.
+ */
+declare function selectionAfterClose(values: readonly string[], selected: null | string, closed: string): null | string;
 //#endregion
-//#region src/popover/description.d.ts
+//#region src/tabs/content.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `div` with the tabs' content class.
  */
-declare const Drawn$4: import("@stealthscale/theme").StyledComponent<"p", {}>;
+declare const Shown: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of a panel: its value and the props of a `div`.
  */
-type DescriptionProps = ComponentProps<typeof Drawn$4>;
+interface ContentProps$2 extends ComponentProps<typeof Shown> {
+  /**
+   * Value of the tab that shows the panel.
+   */
+  readonly value: string;
+}
 /**
- * Draws the paragraph the panel is described by.
+ * Renders a panel with the machine's content props merged over the caller's.
  *
- * @param props - Everything a styled p takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @param props - The tab's value and the props of a `div`.
+ * @returns The `div` element.
  */
-declare function Description(props: DescriptionProps): ReactElement;
+declare function Content$2({ value, ...rest }: ContentProps$2): ReactElement;
 //#endregion
-//#region src/popover/indicator.d.ts
+//#region src/tabs/indicator.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `div` with the tabs' indicator class.
  */
-declare const Drawn$3: import("@stealthscale/theme").StyledComponent<"span", {}>;
+declare const Bar: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of the indicator: the props of a `div`.
  */
-type IndicatorProps$1 = ComponentProps<typeof Drawn$3>;
+type IndicatorProps = ComponentProps<typeof Bar>;
 /**
- * Draws the mark that turns as the panel opens.
+ * Renders the indicator, hidden from assistive technology, with the machine's indicator props.
  *
- * @param props - Everything a styled span takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function Indicator$1(props: IndicatorProps$1): ReactElement;
+declare function Indicator(props: IndicatorProps): ReactElement;
 //#endregion
-//#region src/popover/positioner.d.ts
+//#region src/tabs/list.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `div` with the tabs' list class.
  */
-declare const Drawn$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Strip: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of the list: the props of a `div`.
  */
-type PositionerProps$1 = ComponentProps<typeof Drawn$2>;
+type ListProps = ComponentProps<typeof Strip>;
 /**
- * Draws the box that holds the panel in place beside its control.
+ * Renders the list with the machine's list props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The part, carrying what the machine writes onto it.
- */
-declare function Positioner$1(props: PositionerProps$1): ReactElement;
-//#endregion
-//#region src/popover/machine.d.ts
-/**
- * Describes what a caller sets on the machine, every setting of it optional.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-type PopoverOptions = Partial<popover.Props>;
+declare function List(props: ListProps): ReactElement;
 //#endregion
-//#region src/popover/root.d.ts
+//#region src/tabs/root.d.ts
 /**
- * Draws the element that sets the variants every part below it reads, and no box.
+ * Renders the `div` that provides the recipe's variants.
  */
 declare const Framed$2: import("@stealthscale/theme").StyledComponent<"div", {
-  readonly size?: "lg" | "md" | "sm" | "xl" | "xs";
-  readonly variant?: "elevated" | "glass" | "surface";
+  readonly fitted?: boolean | undefined;
+  readonly justify?: import("@stealthscale/theme/authoring").Justify | undefined;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+  readonly size?: import("@stealthscale/theme/authoring").Scale | undefined;
+  readonly variant?: "enclosed" | "line" | "plain" | "subtle" | undefined;
 }>;
 /**
- * Describes what the root takes: the machine's settings, the recipe's variants, and the element's.
+ * Describes the props of the root: the machine's options, the close handler, the recipe's
+ * variants and the props of a `div`.
  *
  * @remarks
- *   The element's own `id` and `dir` are left out, because the machine states both. It names every
- *   part from the id, and it reads the direction to decide which side the panel opens on.
+ *   The element's `id` and `dir` are left out, because the machine takes both. It derives every
+ *   ARIA reference from `id`, and reads `dir` for the arrow keys.
  */
-interface RootProps$2 extends Omit<ComponentProps<typeof Framed$2>, "dir" | "id">, PopoverOptions {}
+interface RootProps$2 extends Omit<ComponentProps<typeof Framed$2>, "defaultValue" | "dir" | "id" | "onChange" | "onClose" | "value">, TabsOptions {
+  /**
+   * Called with the value of a closable tab that a person closes, after the selection has moved
+   * off it. The caller removes the tab and its panel.
+   */
+  readonly onClose?: ((details: CloseDetails) => void) | undefined;
+}
 /**
- * Opens a panel beside a control.
+ * Renders the root and provides the machine's api and the root's actions to the parts.
  *
- * @param props - The machine's settings, the recipe's variants and the element's props together.
- * @returns The parts, under the running machine.
+ * @param props - The machine's options, the close handler, the recipe's variants and the props of
+ *   a `div`.
+ * @returns The `div` element inside the providers.
  */
-declare function Root$2(props: RootProps$2): ReactElement;
+declare function Root$2({ onClose, ...props }: RootProps$2): ReactElement;
 //#endregion
-//#region src/popover/title.d.ts
+//#region src/tabs/trigger.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `button` with the tabs' trigger class.
  */
-declare const Drawn$1: import("@stealthscale/theme").StyledComponent<"h2", {}>;
+declare const Pressed$1: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of a tab: its value, whether it is disabled, whether it closes and the props
+ * of a `button`.
  */
-type TitleProps = ComponentProps<typeof Drawn$1>;
+interface TriggerProps$2 extends ComponentProps<typeof Pressed$1> {
+  /**
+   * Whether a person can close the tab: Delete while it has focus, a middle click, or a press on
+   * its `Tabs.CloseTrigger`. The root's `onClose` receives the tab's value.
+   */
+  readonly closable?: boolean | undefined;
+  /**
+   * Whether the tab is disabled.
+   */
+  readonly disabled?: boolean | undefined;
+  /**
+   * Value of the panel the tab shows.
+   */
+  readonly value: string;
+}
 /**
- * Draws the heading the panel is announced by.
+ * Renders a tab with the machine's trigger props merged over the caller's.
  *
- * @param props - Everything a styled h2 takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @param props - The panel's value, the disabled and closable flags and the props of a `button`.
+ * @returns The `button` element.
  */
-declare function Title(props: TitleProps): ReactElement;
+declare function Trigger$2({ closable, disabled, value, ...rest }: TriggerProps$2): ReactElement;
+declare namespace index_d_exports$8 {
+  export { CloseDetails, CloseTrigger, CloseTriggerProps, Content$2 as Content, ContentProps$2 as ContentProps, Indicator, IndicatorProps, List, ListProps, Root$2 as Root, RootProps$2 as RootProps, Trigger$2 as Trigger, TriggerProps$2 as TriggerProps, selectionAfterClose };
+}
 //#endregion
-//#region src/popover/trigger.d.ts
+//#region src/toggle-tip/arrow-tip.d.ts
 /**
- * Draws the part at the size the root states.
+ * Renders the `div` with the toggle tip's arrow tip class.
  */
-declare const Drawn: import("@stealthscale/theme").StyledComponent<"button", {}>;
+declare const Drawn$4: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the part takes.
+ * Describes the props of the arrow tip: the props of a `div`.
  */
-type TriggerProps$2 = ComponentProps<typeof Drawn>;
+type ArrowTipProps$1 = ComponentProps<typeof Drawn$4>;
 /**
- * Draws the control that opens the panel.
+ * Renders the arrow tip with the machine's arrow tip props merged over the caller's.
  *
- * @param props - Everything a styled button takes.
- * @returns The part, carrying what the machine writes onto it.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function Trigger$2(props: TriggerProps$2): ReactElement;
-declare namespace index_d_exports$2 {
-  export { Anchor, AnchorProps, Arrow$1 as Arrow, ArrowProps$1 as ArrowProps, ArrowTip$1 as ArrowTip, ArrowTipProps$1 as ArrowTipProps, CloseTrigger, CloseTriggerProps, Content$2 as Content, ContentProps$2 as ContentProps, Description, DescriptionProps, Indicator$1 as Indicator, IndicatorProps$1 as IndicatorProps, Positioner$1 as Positioner, PositionerProps$1 as PositionerProps, Root$2 as Root, RootProps$2 as RootProps, Title, TitleProps, Trigger$2 as Trigger, TriggerProps$2 as TriggerProps };
-}
+declare function ArrowTip$1(props: ArrowTipProps$1): ReactElement;
 //#endregion
-//#region src/tabs/content.d.ts
+//#region src/toggle-tip/arrow.d.ts
 /**
- * Draws the panel at the room the root states.
+ * Renders the `div` with the toggle tip's arrow class.
  */
-declare const Shown: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Drawn$3: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what a panel takes.
+ * Describes the props of the arrow: the props of a `div`.
  */
-interface ContentProps$1 extends ComponentProps<typeof Shown> {
-  /**
-   * Says which control shows this panel.
-   */
-  readonly value: string;
-}
+type ArrowProps$1 = ComponentProps<typeof Drawn$3>;
 /**
- * Appears while the control it names is the one in force.
+ * Renders the arrow with the machine's arrow props merged over the caller's.
  *
- * @param props - The control it names, and everything a styled div takes.
- * @returns The panel, named and hidden by the machine.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function Content$1({ value, ...rest }: ContentProps$1): ReactElement;
+declare function Arrow$1(props: ArrowProps$1): ReactElement;
 //#endregion
-//#region src/tabs/indicator.d.ts
+//#region src/toggle-tip/content.d.ts
 /**
- * Draws the bar at the thickness the look states.
+ * Renders the `div` with the toggle tip's content class.
  */
-declare const Bar: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Drawn$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the bar takes.
+ * Describes the props of the content: the props of a `div`, without `ref`, which the presence
+ * takes.
  */
-type IndicatorProps = ComponentProps<typeof Bar>;
+type ContentProps$1 = Omit<ComponentProps<typeof Drawn$2>, "ref">;
 /**
- * Moves to whichever control is in force.
+ * Renders the note with the machine's content props, less its dialog semantics, and the presence
+ * props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The bar, positioned by the machine.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
-declare function Indicator(props: IndicatorProps): ReactElement;
+declare function Content$1(props: ContentProps$1): ReactElement;
 //#endregion
-//#region src/tabs/list.d.ts
+//#region src/toggle-tip/positioner.d.ts
 /**
- * Draws the strip, which turns into a column where the set runs down.
+ * Renders the `div` with the toggle tip's positioner class.
  */
-declare const Strip: import("@stealthscale/theme").StyledComponent<"div", {}>;
+declare const Drawn$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the strip takes.
+ * Describes the props of the positioner: the props of a `div`.
  */
-type ListProps = ComponentProps<typeof Strip>;
+type PositionerProps$1 = ComponentProps<typeof Drawn$1>;
 /**
- * Draws the controls in a row, with the bar that marks the one in force.
+ * Renders the positioner with the machine's positioner props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The strip, carrying its role and its orientation.
- */
-declare function List(props: ListProps): ReactElement;
-//#endregion
-//#region src/tabs/machine.d.ts
-/**
- * Describes what a caller sets on the machine, every setting of it optional.
+ * @param props - The props of a `div`.
+ * @returns The `div` element, or nothing while the tip is out of the document.
  */
-type TabsOptions = Partial<tabs.Props>;
+declare function Positioner$1(props: PositionerProps$1): null | ReactElement;
 //#endregion
-//#region src/tabs/root.d.ts
+//#region src/toggle-tip/root.d.ts
 /**
- * Draws the frame and sets the variants every part below it reads.
+ * Renders the `span` that provides the recipe's variants.
  */
-declare const Framed$1: import("@stealthscale/theme").StyledComponent<"div", {
-  readonly fitted?: boolean;
-  readonly justify?: import("@stealthscale/theme/authoring").Justify;
-  readonly size?: import("@stealthscale/theme/authoring").Scale;
-  readonly variant?: "enclosed" | "line" | "plain" | "subtle";
+declare const Framed$1: import("@stealthscale/theme").StyledComponent<"span", {
+  readonly size?: import("@stealthscale/theme/authoring").Scale | undefined;
+  readonly variant?: "inverted" | "surface" | undefined;
 }>;
 /**
- * Describes what the root takes: the machine's options, the recipe's variants, and the element's.
+ * Describes the props of the root: the popover machine's options, the tip's presence, the recipe's
+ * variants and the props of a `span`.
  *
  * @remarks
- *   The element's own `id` and `dir` are left out, because the machine states both. It builds every
- *   ARIA reference from the id, and it reads the direction to decide which arrow key moves which
- *   way.
+ *   The element's `id` and `dir` are left out, because the machine takes both. It derives every
+ *   part's id from `id`, and reads `dir` for the placement. `autoFocus` is false by default.
  */
-interface RootProps$1 extends Omit<ComponentProps<typeof Framed$1>, "defaultValue" | "dir" | "id" | "onChange" | "value">, TabsOptions {}
+interface RootProps$1 extends Omit<ComponentProps<typeof Framed$1>, "dir" | "id">, OverlayPresence, PopoverOptions {}
 /**
- * Shows one panel at a time, chosen from a strip of controls.
+ * Renders the root and provides the machine's api and the tip's presence to the parts.
  *
- * @param props - The machine's options, the recipe's variants and the element's props together.
- * @returns The frame, holding the parts, under the running machine.
+ * @param props - The machine's options, the tip's presence, the recipe's variants and the props of
+ *   a `span`.
+ * @returns The `span` element inside the providers.
  */
-declare function Root$1(props: RootProps$1): ReactElement;
+declare function Root$1({ autoFocus, lazyMount, onExitComplete, skipAnimationOnMount, unmountOnExit, ...props }: RootProps$1): ReactElement;
 //#endregion
-//#region src/tabs/trigger.d.ts
+//#region src/toggle-tip/trigger.d.ts
 /**
- * Draws the control at the size the root states.
+ * Renders the `button` with the toggle tip's trigger class.
  */
-declare const Pressed$1: import("@stealthscale/theme").StyledComponent<"button", {}>;
+declare const Drawn: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Describes what a control takes.
+ * Describes the props of the trigger: the props of a `button`.
  */
-interface TriggerProps$1 extends ComponentProps<typeof Pressed$1> {
-  /**
-   * Whether a person can reach it at all.
-   */
-  readonly disabled?: boolean | undefined;
-  /**
-   * Says which panel this control shows.
-   */
-  readonly value: string;
-}
+type TriggerProps$1 = ComponentProps<typeof Drawn>;
 /**
- * Shows the panel it names.
+ * Renders the trigger with the machine's trigger props, less `aria-haspopup`, merged over the
+ * caller's.
  *
- * @param props - The panel it names, and everything a styled button takes.
- * @returns The control, carrying its role and its selection.
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
  */
-declare function Trigger$1({ disabled, value, ...rest }: TriggerProps$1): ReactElement;
-declare namespace index_d_exports$3 {
-  export { Content$1 as Content, ContentProps$1 as ContentProps, Indicator, IndicatorProps, List, ListProps, Root$1 as Root, RootProps$1 as RootProps, Trigger$1 as Trigger, TriggerProps$1 as TriggerProps };
+declare function Trigger$1(props: TriggerProps$1): ReactElement;
+declare namespace index_d_exports$9 {
+  export { Arrow$1 as Arrow, ArrowProps$1 as ArrowProps, ArrowTip$1 as ArrowTip, ArrowTipProps$1 as ArrowTipProps, Content$1 as Content, ContentProps$1 as ContentProps, Positioner$1 as Positioner, PositionerProps$1 as PositionerProps, Root$1 as Root, RootProps$1 as RootProps, Trigger$1 as Trigger, TriggerProps$1 as TriggerProps };
 }
 //#endregion
 //#region src/tooltip/arrow-tip.d.ts
 /**
- * Draws the shape the arrow shows.
+ * Renders the `div` with the tooltip's arrow tip class.
  */
 declare const Turned: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the tip takes.
+ * Describes the props of the arrow tip: the props of a `div`.
  */
 type ArrowTipProps = ComponentProps<typeof Turned>;
 /**
- * Shows one corner past the edge of the box.
+ * Renders the arrow tip with the machine's arrow tip props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The tip, turned by the machine.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
 declare function ArrowTip(props: ArrowTipProps): ReactElement;
 //#endregion
 //#region src/tooltip/arrow.d.ts
 /**
- * Draws the outer element the machine places.
+ * Renders the `div` with the tooltip's arrow class.
  */
 declare const Placed$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the arrow takes.
+ * Describes the props of the arrow: the props of a `div`.
  */
 type ArrowProps = ComponentProps<typeof Placed$1>;
 /**
- * Points from the box back at the control.
+ * Renders the arrow with the machine's arrow props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The arrow, placed by the machine.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
 declare function Arrow(props: ArrowProps): ReactElement;
 //#endregion
 //#region src/tooltip/content.d.ts
 /**
- * Draws the box at the size the root states.
+ * Renders the `div` with the tooltip's content class.
  */
 declare const Boxed: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the box takes.
+ * Describes the props of the content: the props of a `div`, without `ref`, which the presence
+ * takes.
  */
-type ContentProps = ComponentProps<typeof Boxed>;
+type ContentProps = Omit<ComponentProps<typeof Boxed>, "ref">;
 /**
- * Appears beside the control while a pointer rests on it.
+ * Renders the content with the machine's content props and the presence props merged over the
+ * caller's.
  *
- * @param props - The recipe's variants, and everything a styled div takes.
- * @returns The box, named and placed by the machine.
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
  */
 declare function Content(props: ContentProps): ReactElement;
 //#endregion
 //#region src/tooltip/positioner.d.ts
 /**
- * Draws the box the machine positions.
+ * Renders the `div` with the tooltip's positioner class.
  */
 declare const Placed: import("@stealthscale/theme").StyledComponent<"div", {}>;
 /**
- * Describes what the positioner takes.
+ * Describes the props of the positioner: the props of a `div`.
  */
 type PositionerProps = ComponentProps<typeof Placed>;
 /**
- * Draws the box wherever the machine measured room for it.
+ * Renders the positioner with the machine's positioner props merged over the caller's.
  *
- * @param props - Everything a styled div takes.
- * @returns The box, positioned by the machine.
+ * @param props - The props of a `div`.
+ * @returns The `div` element, or nothing while the content is out of the document.
  */
-declare function Positioner(props: PositionerProps): ReactElement;
+declare function Positioner(props: PositionerProps): null | ReactElement;
 //#endregion
 //#region src/tooltip/machine.d.ts
 /**
- * Describes what a caller sets on the machine, every setting of it optional.
+ * Describes the machine settings a caller can pass to the root, all optional.
  */
 type TooltipOptions = Partial<tooltip.Props>;
 //#endregion
 //#region src/tooltip/root.d.ts
 /**
- * Draws the element that sets the variants every part below it reads, and no box.
+ * Renders the `div` that provides the recipe's variants.
  */
 declare const Framed: import("@stealthscale/theme").StyledComponent<"div", {
-  readonly size?: import("@stealthscale/theme/authoring").Scale;
-  readonly variant?: "inverted" | "surface";
+  readonly size?: import("@stealthscale/theme/authoring").Scale | undefined;
+  readonly variant?: "inverted" | "surface" | undefined;
 }>;
 /**
- * Describes what the root takes: the machine's settings, the recipe's variants, and the element's.
+ * Describes the props of the root: the machine's options, the content's presence, the recipe's
+ * variants and the props of a `div`.
  *
  * @remarks
- *   The element's own `id` and `dir` are left out, because the machine states both. It names the
- *   box from the id so the control can point at it, and it reads the direction to decide which side
- *   the box opens on.
+ *   The element's `id` and `dir` are left out, because the machine takes both. It derives the
+ *   content's id from `id`, and reads `dir` for the placement.
  */
-interface RootProps extends Omit<ComponentProps<typeof Framed>, "dir" | "id">, TooltipOptions {}
+interface RootProps extends Omit<ComponentProps<typeof Framed>, "dir" | "id">, OverlayPresence, TooltipOptions {}
 /**
- * Shows a short label beside whatever a pointer rests on.
+ * Renders the root and provides the machine's api and the content's presence to the parts.
  *
- * @param props - The machine's settings, the recipe's variants and the element's props together.
- * @returns The parts, under the running machine.
+ * @param props - The machine's options, the content's presence, the recipe's variants and the
+ *   props of a `div`.
+ * @returns The `div` element inside the providers.
  */
-declare function Root(props: RootProps): ReactElement;
+declare function Root({ lazyMount, onExitComplete, skipAnimationOnMount, unmountOnExit, ...props }: RootProps): ReactElement;
 //#endregion
 //#region src/tooltip/trigger.d.ts
 /**
- * Draws the control, styled by whatever the caller drew rather than by this recipe.
+ * Renders the `button` with the tooltip's trigger class.
  */
 declare const Pressed: import("@stealthscale/theme").StyledComponent<"button", {}>;
 /**
- * Describes what the control takes.
+ * Describes the props of the trigger: the props of a `button`.
  */
 type TriggerProps = ComponentProps<typeof Pressed>;
 /**
- * Opens the box as a pointer rests on it or focus reaches it.
+ * Renders the trigger with the machine's trigger props merged over the caller's.
  *
- * @param props - Everything a styled button takes.
- * @returns The control, carrying what the machine needs to open the box.
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
  */
 declare function Trigger(props: TriggerProps): ReactElement;
-declare namespace index_d_exports$4 {
+declare namespace index_d_exports$10 {
   export { Arrow, ArrowProps, ArrowTip, ArrowTipProps, Content, ContentProps, Positioner, PositionerProps, Root, RootProps, Trigger, TriggerProps };
 }
 //#endregion
-export { index_d_exports as Collapsible, index_d_exports$1 as Menu, index_d_exports$2 as Popover, index_d_exports$3 as Tabs, index_d_exports$4 as Tooltip };
+//#region src/truncate/clipped.d.ts
+/**
+ * Renders the `span` with the truncate class.
+ */
+declare const Spanned: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of the clipped text: whether it is clipped, whether it takes a tab stop, its
+ * line count, and the props of a `span`.
+ */
+interface ClippedProps extends ComponentProps<typeof Spanned> {
+  /**
+   * Whether the text is cut off.
+   */
+  readonly clipped: boolean;
+  /**
+   * Whether the text takes a tab stop while it is cut off.
+   */
+  readonly focusable: boolean;
+  /**
+   * Lines the text keeps.
+   */
+  readonly lines: number;
+}
+//#endregion
+//#region src/truncate/truncate.d.ts
+/**
+ * Describes the props of the truncated text: the text, its line count, whether it takes a tab stop
+ * while clipped, and the props of a `span`.
+ */
+interface TruncateProps extends Omit<ClippedProps, "children" | "clipped" | "focusable" | "lines" | "ref"> {
+  /**
+   * Whole text, as a string.
+   */
+  readonly children: string;
+  /**
+   * Whether the text takes a tab stop while it is clipped, false unless stated.
+   *
+   * @remarks
+   *   A keyboard opens the tooltip only from a tab stop. Text that fits takes none either way.
+   */
+  readonly focusable?: boolean | undefined;
+  /**
+   * Lines the text keeps, 1 unless stated.
+   */
+  readonly lines?: number | undefined;
+}
+/**
+ * Renders the text, clipped, and the tooltip with the whole text.
+ *
+ * @param props - The text, its line count, the tab stop and the props of a `span`.
+ * @returns The tooltip's root around the text.
+ */
+export declare function Truncate({ children, focusable, lines, ...props }: TruncateProps): ReactElement;
+//#endregion
+export { index_d_exports as Accordion, index_d_exports$1 as Collapsible, index_d_exports$2 as Details, index_d_exports$3 as HoverCard, index_d_exports$4 as Menu, index_d_exports$5 as Menubar, index_d_exports$6 as Popover, index_d_exports$7 as Steps, index_d_exports$8 as Tabs, index_d_exports$9 as ToggleTip, index_d_exports$10 as Tooltip, type TruncateProps };