@stealthscale/component-screen 0.0.0-stage → 0.0.1

package/dist/index.d.ts

@@ -0,0 +1,2412 @@
+import { ButtonProps, IconButtonProps } from "@stealthscale/component-actions";
+import { RecipeProps } from "@stealthscale/theme/authoring";
+import { PresenceOptions } from "@stealthscale/hooks";
+import { RovingFocus } from "@stealthscale/component-a11y";
+import { ComponentProps, ElementType, MouseEvent, MouseEventHandler, ReactElement, ReactNode } from "react";
+import { ScrollArea } from "@stealthscale/component-primitives";
+import { Breakpoint } from "@stealthscale/provider-viewport";
+import * as floatingPanel from "@zag-js/floating-panel";
+import { AnchorPositionDetails, OpenChangeDetails, Point, PositionChangeDetails, ResizeTriggerAxis, ResizeTriggerAxis as ResizeTriggerAxis$1, Size, SizeChangeDetails, Stage, Stage as Stage$1, StageChangeDetails } from "@zag-js/floating-panel";
+import { Menu, Tabs } from "@stealthscale/component-disclosure";
+import { SearchInputProps } from "@stealthscale/component-forms";
+import { Divider } from "@stealthscale/component-layout";
+import * as splitter$1 from "@zag-js/splitter";
+import { ExpandCollapseDetails, PanelData, PanelSize, ResizeDetails, ResizeEndDetails } from "@zag-js/splitter";
+//#region src/toolbar/item.d.ts
+/**
+ * Describes the roving focus item's props without the element it renders.
+ */
+type Roving = Omit<ComponentProps<typeof RovingFocus.Item>, "as" | "ref">;
+/**
+ * Describes the props of a control: the item's props and the props of the element or component it
+ * renders as.
+ *
+ * @typeParam Drawn - The element or component the control renders as.
+ */
+type ItemProps<Drawn extends ElementType = "button"> = {
+  /**
+   * The element or component the control renders as: a `button`, or an `a` when `href` is set.
+   */
+  readonly as?: Drawn | undefined;
+  /**
+   * The link's target, which renders the control as an `a`.
+   */
+  readonly href?: string | undefined;
+} & Omit<ComponentProps<Drawn>, keyof Roving> & Roving;
+/**
+ * Renders the control as a roving focus item.
+ *
+ * @param props - The element or component it renders as, the link's target and the item's props.
+ * @returns The control element.
+ */
+declare function Item<Drawn extends ElementType = "button">({ as, href, ...rest }: ItemProps<Drawn>): ReactElement;
+//#endregion
+//#region src/action-bar/close-trigger.d.ts
+/**
+ * Renders the icon button with the action bar's close trigger class, ghost unless the caller sets a
+ * variant.
+ */
+declare const Drawn$15: (props: IconButtonProps) => ReactElement;
+/**
+ * Describes the props of the close trigger: the props of the icon button, as a toolbar item.
+ */
+type CloseTriggerProps$1 = Omit<ItemProps<typeof Drawn$15>, "as">;
+/**
+ * Renders the close trigger, which asks the root to close after the caller's handler.
+ *
+ * @param props - The accessible name, the glyph and the props of the icon button.
+ * @returns The toolbar item.
+ */
+declare function CloseTrigger$1({ onClick, ...props }: CloseTriggerProps$1): ReactElement;
+//#endregion
+//#region src/action-bar/content.d.ts
+/**
+ * Renders the `div` with the action bar's content class.
+ */
+declare const Drawn$14: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a `div` without `ref`, which the bar's presence sets.
+ */
+type ContentProps$2 = Omit<ComponentProps<typeof Drawn$14>, "ref">;
+/**
+ * Renders the bar with its presence props, its Escape handler and the caller's props.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Content$4({ onKeyDown, ...props }: ContentProps$2): ReactElement;
+//#endregion
+//#region src/action-bar/positioner.d.ts
+/**
+ * Renders the `div` with the action bar's positioner class.
+ */
+declare const Drawn$13: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the positioner: the props of a `div`.
+ */
+type PositionerProps$1 = ComponentProps<typeof Drawn$13>;
+/**
+ * Renders the positioner while the bar is in the document.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element, or nothing while the bar is out of the document.
+ */
+declare function Positioner$1(props: PositionerProps$1): null | ReactElement;
+//#endregion
+//#region src/action-bar/root.d.ts
+/**
+ * Renders the `div` that provides the recipe's variants.
+ */
+declare const Framed$2: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly placement?: "bottom" | "bottom-end" | "bottom-start";
+}>;
+/**
+ * Describes the details `onOpenChange` receives.
+ */
+interface OpenChangeDetails$1 {
+  /**
+   * Whether the bar asks to be open, false for Escape and the close trigger.
+   */
+  readonly open: boolean;
+}
+/**
+ * Describes the props of the root: whether the bar is open, how it asks to close, its announcement,
+ * the presence options, the recipe's variants and the props of a `div`.
+ *
+ * @remarks
+ *   `lazyMount` and `unmountOnExit` are true by default.
+ */
+interface RootProps$8 extends ComponentProps<typeof Framed$2>, Omit<PresenceOptions, "present"> {
+  /**
+   * Words a screen reader hears as the bar opens. Defaults to `Actions available`.
+   */
+  readonly announcement?: string | undefined;
+  /**
+   * Whether Escape inside the bar asks to close it. True by default.
+   */
+  readonly closeOnEscape?: boolean | undefined;
+  /**
+   * Called when the bar asks to close. The caller clears the selection, which closes the bar.
+   */
+  readonly onOpenChange?: ((details: OpenChangeDetails$1) => void) | undefined;
+  /**
+   * Whether the bar is open, usually while anything is selected.
+   */
+  readonly open: boolean;
+}
+/**
+ * Renders the root and provides the bar's state and presence to the parts.
+ *
+ * @param props - Whether the bar is open, how it asks to close, its announcement, the presence
+ *   options, the recipe's variants and the props of a `div`.
+ * @returns The `div` element inside the providers.
+ */
+declare function Root$8({ announcement, closeOnEscape, lazyMount, onExitComplete, onOpenChange, open, skipAnimationOnMount, unmountOnExit, ...props }: RootProps$8): ReactElement;
+declare namespace index_d_exports {
+  export { CloseTrigger$1 as CloseTrigger, CloseTriggerProps$1 as CloseTriggerProps, Content$4 as Content, ContentProps$2 as ContentProps, OpenChangeDetails$1 as OpenChangeDetails, Positioner$1 as Positioner, PositionerProps$1 as PositionerProps, Root$8 as Root, RootProps$8 as RootProps };
+}
+//#endregion
+//#region src/app-shell/panels.d.ts
+/**
+ * Describes the state one panel publishes.
+ */
+interface Panel$1 {
+  /**
+   * Result of closing the panel in the body: `hide` hides it, and `icons` leaves a rail.
+   */
+  readonly collapse: Collapse;
+  /**
+   * Identifier of the panel's element, which a trigger's `aria-controls` points at.
+   */
+  readonly id: string;
+  /**
+   * Whether the panel is shown: open in the body, or open over the page.
+   */
+  readonly open: boolean;
+  /**
+   * Whether the shell is too narrow for the panel and the panel is over the page.
+   */
+  readonly overlaid: boolean;
+  /**
+   * Shows or hides the panel.
+   */
+  readonly setOpen: (open: boolean) => void;
+  /**
+   * Whether the shell is too narrow for the panel and the panel has dropped under the page.
+   */
+  readonly stacked: boolean;
+}
+//#endregion
+//#region src/app-shell/state.d.ts
+/**
+ * Selects the side of the page a panel is on.
+ */
+type Side = "end" | "start";
+/**
+ * Selects what closing a panel in the body leaves: nothing, or a rail wide enough for its icons.
+ */
+type Collapse = "hide" | "icons";
+/**
+ * Every `Collapse` value.
+ */
+declare const COLLAPSES: readonly Collapse[];
+/**
+ * Selects where a panel goes when the shell is too narrow to fit it beside the page.
+ *
+ * @remarks
+ *   `over` lays it over the page behind a backdrop, the usual navigation on a phone. `under` drops
+ *   it under the page as a block that is always shown, the usual detail panel on a phone.
+ */
+type Fold = "over" | "under";
+/**
+ * Every `Fold` value.
+ */
+declare const FOLDS: readonly Fold[];
+/**
+ * Selects the widths of the shell a bar renders at: below the width the navigation folds at, or
+ * from it.
+ */
+type ShellWidth = "narrow" | "wide";
+/**
+ * Provides a panel's state to its content and reads it, throwing outside a panel or returning
+ * `undefined` there.
+ */
+declare const PanelProvider: import("react").FunctionComponent<import("@stealthscale/hooks").ProvidedProps<Panel$1>>, useNearestPanel: () => Panel$1, useEnclosingPanel: () => Panel$1 | undefined;
+/**
+ * Reads one panel of the shell by name.
+ *
+ * @remarks
+ *   An application uses it to close its navigation when a destination is pressed. It returns
+ *   `undefined` when no panel has the name, and on a panel's first render, because a panel
+ *   publishes itself in a layout effect.
+ * @param name - The `name` the panel was rendered with, `navbar` or `aside` by default.
+ * @returns The panel's state, or `undefined`.
+ */
+declare function useAppShellPanel(name: string): Panel$1 | undefined;
+/**
+ * Returns the panels that are open over the page, which the backdrop and every inert part read.
+ *
+ * @returns The open panels over the page, or an empty array.
+ */
+declare function useOverlaid(): readonly Panel$1[];
+//#endregion
+//#region src/app-shell/use-panel.d.ts
+/**
+ * Describes the options of a panel.
+ */
+interface PanelOptions {
+  /**
+   * Result of closing the panel in the body: `hide` hides it, and `icons` leaves a rail wide
+   * enough for its icons. Defaults to `hide`.
+   */
+  readonly collapse?: Collapse | undefined;
+  /**
+   * Whether the panel starts open when the caller does not control it. Defaults to `true`.
+   */
+  readonly defaultOpen?: boolean | undefined;
+  /**
+   * Where the panel goes when the shell is too narrow for it: over the page behind a backdrop, or
+   * under the page as a block. Defaults to `over`.
+   */
+  readonly folds?: Fold | undefined;
+  /**
+   * Breakpoint below which the panel folds, or `never` for a panel in the body at every width.
+   * Defaults to `md` on the start side and `lg` on the end side.
+   */
+  readonly foldsBelow?: "never" | Breakpoint | undefined;
+  /**
+   * Name a trigger uses to find the panel. Defaults to `navbar` on the start side and `aside` on
+   * the end side.
+   */
+  readonly name?: string | undefined;
+  /**
+   * Called with the new state when the panel opens or closes.
+   */
+  readonly onOpenChange?: ((open: boolean) => void) | undefined;
+  /**
+   * Whether the panel is open, when the application controls it.
+   */
+  readonly open?: boolean | undefined;
+  /**
+   * Key that toggles the panel with the platform's modifier held: `b` for ⌘B and Ctrl+B. No
+   * shortcut by default.
+   */
+  readonly shortcut?: string | undefined;
+}
+//#endregion
+//#region src/app-shell/panel.d.ts
+/**
+ * Renders the content wrapper at the panel's open width, the scroll area's root.
+ */
+declare const Held: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Panel`.
+ */
+interface PanelProps$1 extends Omit<ComponentProps<typeof Held>, "id" | "width" | keyof PanelOptions>, PanelOptions {
+  /**
+   * Width the panel closes to when `collapse` is `icons`, as a CSS length. The theme's
+   * `sizes.rail` when absent.
+   */
+  readonly railWidth?: string | undefined;
+  /**
+   * Side of the page the panel is on.
+   */
+  readonly side: Side;
+  /**
+   * Width the panel opens to, as a CSS length. The theme's `sizes.sidebar` on the start side and
+   * `sizes.aside` on the end side when absent.
+   */
+  readonly width?: string | undefined;
+}
+//#endregion
+//#region src/app-shell/aside.d.ts
+/**
+ * Describes the props of `Aside`: a panel's props without `side`.
+ */
+type AsideProps$1 = Omit<PanelProps$1, "side">;
+/**
+ * Renders a panel on the end side.
+ *
+ * @param props - How the panel folds and closes, and its content.
+ * @returns The panel.
+ */
+declare function Aside$1(props: AsideProps$1): ReactElement;
+//#endregion
+//#region src/app-shell/body.d.ts
+/**
+ * Describes the props of `Body`: the props of the row, without `as`, because the row is the scroll
+ * area's content and another element in its place would drop the content's part.
+ */
+type BodyProps$3 = Omit<ScrollArea.ContentProps, "as">;
+/**
+ * Renders the body as a scroll area around the row, which ends with the backdrop.
+ *
+ * @param props - The panels, the main region and the row's props.
+ * @returns The scroll area's root around the row.
+ */
+declare function Body$3({ children, ...rest }: BodyProps$3): ReactElement;
+//#endregion
+//#region src/app-shell/footer.d.ts
+/**
+ * Renders the bar `footer`.
+ */
+declare const Barred$2: import("@stealthscale/theme").StyledComponent<"footer", {}>;
+/**
+ * Describes the props of `Footer`.
+ */
+interface FooterProps$3 extends ComponentProps<typeof Barred$2> {
+  /**
+   * Whether the bar pins to the bottom of the window while the window scrolls.
+   */
+  readonly sticky?: boolean | undefined;
+  /**
+   * Width of the shell the bar renders at: `narrow` below the `md` breakpoint, `wide` from it.
+   * Every width when absent.
+   */
+  readonly when?: ShellWidth | undefined;
+}
+/**
+ * Renders a bar across the bottom.
+ *
+ * @param props - `sticky`, `when` and the `footer` element's props.
+ * @returns The bar, inert while a panel is over the page, or nothing at a width `when` excludes.
+ */
+declare function Footer$3({ sticky, when, ...rest }: FooterProps$3): null | ReactElement;
+//#endregion
+//#region src/app-shell/header.d.ts
+/**
+ * Renders the bar `header`.
+ */
+declare const Barred$1: import("@stealthscale/theme").StyledComponent<"header", {}>;
+/**
+ * Describes the props of `Header`.
+ */
+interface HeaderProps$4 extends ComponentProps<typeof Barred$1> {
+  /**
+   * Whether the bar pins to the top of the window while the window scrolls.
+   */
+  readonly sticky?: boolean | undefined;
+}
+/**
+ * Renders a bar across the top.
+ *
+ * @param props - `sticky` and the `header` element's props.
+ * @returns The bar, inert while a panel is over the page.
+ */
+declare function Header$4({ sticky, ...rest }: HeaderProps$4): ReactElement;
+//#endregion
+//#region src/app-shell/main.d.ts
+/**
+ * Describes the props of `Main`: the props of the `main` element.
+ */
+type MainProps = Omit<ScrollArea.ViewportProps, "as" | "focusable">;
+/**
+ * Renders the main region in the space the panels leave, scrolling when the page scrolls.
+ *
+ * @param props - The `main` element's props, the page among its children.
+ * @returns The main region, inert while a panel is over the page.
+ */
+declare function Main({ children, ...props }: MainProps): ReactElement;
+//#endregion
+//#region src/app-shell/metrics.d.ts
+/**
+ * Custom property an ancestor sets to the height of the shell's window.
+ *
+ * @remarks
+ *   A box that stages a shell at a fixed height sets it, and also contains the shell's fixed
+ *   parts with `contain: layout`. Unset, the window is the viewport.
+ */
+declare const WINDOW_HEIGHT = "--app-shell-window-height";
+//#endregion
+//#region src/app-shell/navbar.d.ts
+/**
+ * Describes the props of `Navbar`: a panel's props without `side`.
+ */
+type NavbarProps = Omit<PanelProps$1, "side">;
+/**
+ * Renders a panel on the start side.
+ *
+ * @param props - How the panel folds and closes, and its content.
+ * @returns The panel.
+ */
+declare function Navbar(props: NavbarProps): ReactElement;
+//#endregion
+//#region src/app-shell/rail.d.ts
+/**
+ * Renders the rail `button`, typed `button` so it submits no form.
+ */
+declare const Pressable$1: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of `Rail`.
+ */
+interface RailProps extends Omit<ComponentProps<typeof Pressable$1>, "aria-controls"> {
+  /**
+   * Accessible name of the rail while its panel is open. Defaults to `Close`.
+   */
+  readonly closeLabel?: string | undefined;
+  /**
+   * Accessible name of the rail while its panel is closed. Defaults to `Open`.
+   */
+  readonly openLabel?: string | undefined;
+  /**
+   * Name of the panel the rail controls. Defaults to `navbar`.
+   */
+  readonly panel?: string | undefined;
+}
+/**
+ * Renders the strip that toggles one panel.
+ *
+ * @param props - The labels, the panel's name and the `button` element's props.
+ * @returns The strip, or `null` while its panel is not in the body.
+ */
+declare function Rail({ closeLabel, onClick, openLabel, panel, ...rest }: RailProps): null | ReactElement;
+//#endregion
+//#region src/app-shell/root.d.ts
+/**
+ * Renders the column and provides the variants to every part below it.
+ */
+declare const Columned$2: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly divided?: boolean;
+  readonly scroll?: "page" | "window";
+  readonly variant?: "floating" | "inset" | "plain";
+}>;
+/**
+ * Describes the props of `Root`.
+ */
+type RootProps$7 = ComponentProps<typeof Columned$2>;
+/**
+ * Renders the shell: bars across the top and the bottom, and a body between them with a panel on
+ * either side of the page.
+ *
+ * @param props - The recipe's variants and the `div` element's props.
+ * @returns The column, with the shell's state in context.
+ */
+declare function Root$7({ scroll, ...rest }: RootProps$7): ReactElement;
+//#endregion
+//#region src/app-shell/section.d.ts
+/**
+ * Renders the section `div`.
+ */
+declare const Banded$4: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Section`.
+ */
+interface SectionProps extends ComponentProps<typeof Banded$4> {
+  /**
+   * Whether the section takes the room its siblings leave.
+   */
+  readonly grows?: boolean | undefined;
+  /**
+   * Whether the section scrolls its own content.
+   */
+  readonly scrolls?: boolean | undefined;
+}
+/**
+ * Renders the band, inside a scroll area when it scrolls.
+ *
+ * @param props - `grows`, `scrolls` and the `div` element's props.
+ * @returns The `div` element, or the scroll area's root around it.
+ */
+declare function Section({ grows, scrolls, ...rest }: SectionProps): ReactElement;
+//#endregion
+//#region src/app-shell/status.d.ts
+/**
+ * Renders the bar `div`.
+ */
+declare const Barred: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Status`.
+ */
+type StatusProps = ComponentProps<typeof Barred>;
+/**
+ * Renders the status bar.
+ *
+ * @param props - The `div` element's props.
+ * @returns The bar, inert while a panel is over the page.
+ */
+declare function Status(props: StatusProps): ReactElement;
+//#endregion
+//#region src/app-shell/trigger.d.ts
+/**
+ * Renders the library's button as a neutral ghost, typed `button` so it submits no form.
+ */
+declare const Pressable: import("@stealthscale/theme").StyledComponent<import("@stealthscale/theme").StyledComponent<"button", {
+  readonly effect?: "glow" | "pulse";
+  readonly elevation?: import("@stealthscale/theme/authoring").Lift;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly shape?: "square";
+  readonly size?: import("@stealthscale/theme/authoring").Scale;
+  readonly variant?: "ghost" | "glass" | "outline" | "plain" | "solid" | "subtle" | "surface";
+}>, {}>;
+/**
+ * Describes the props of `Trigger`.
+ */
+interface TriggerProps$2 extends Omit<ComponentProps<typeof Pressable>, "aria-controls"> {
+  /**
+   * Name of the panel the control opens. Defaults to `navbar`.
+   */
+  readonly panel?: string | undefined;
+}
+/**
+ * Renders the control that toggles one panel.
+ *
+ * @param props - `panel` and the button's props.
+ * @returns The control, or `null` while its panel has dropped under the page.
+ */
+declare function Trigger$2({ onClick, panel, ...rest }: TriggerProps$2): null | ReactElement;
+declare namespace index_d_exports$1 {
+  export { Aside$1 as Aside, AsideProps$1 as AsideProps, Body$3 as Body, BodyProps$3 as BodyProps, COLLAPSES, Collapse, FOLDS, Fold, Footer$3 as Footer, FooterProps$3 as FooterProps, Header$4 as Header, HeaderProps$4 as HeaderProps, Main, MainProps, Navbar, NavbarProps, Panel$1 as Panel, PanelOptions, Rail, RailProps, Root$7 as Root, RootProps$7 as RootProps, Section, SectionProps, ShellWidth, Side, Status, StatusProps, Trigger$2 as Trigger, TriggerProps$2 as TriggerProps, WINDOW_HEIGHT, useAppShellPanel, useNearestPanel, useOverlaid };
+}
+//#endregion
+//#region src/floating-panel/body.d.ts
+/**
+ * Renders the `div` with the floating panel's body class.
+ */
+declare const Drawn$12: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the body: the props of a `div`.
+ */
+type BodyProps$2 = ComponentProps<typeof Drawn$12>;
+/**
+ * Renders the body inside a scroll area with a vertical bar, hidden while the panel is minimized.
+ *
+ * @param props - The props of a `div`.
+ * @returns The scroll area's root.
+ */
+declare function Body$2(props: BodyProps$2): ReactElement;
+//#endregion
+//#region src/floating-panel/close-trigger.d.ts
+/**
+ * Describes the props of the close trigger: the name and the props of the icon button.
+ */
+interface CloseTriggerProps extends Omit<ButtonProps, "aria-label" | "aria-labelledby" | "ref"> {
+  /**
+   * Accessible name of the button. Defaults to "Close".
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the close trigger with the machine's close trigger props and its name merged under the
+ * caller's.
+ *
+ * @param props - The name, the glyph and the props of the icon button.
+ * @returns The `button` element.
+ */
+declare function CloseTrigger({ label, ...props }: CloseTriggerProps): ReactElement;
+//#endregion
+//#region src/floating-panel/content.d.ts
+/**
+ * Renders the `div` with the floating panel's content class.
+ */
+declare const Drawn$11: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the content: the props of a `div`, without `ref`, which the presence
+ * takes.
+ */
+type ContentProps$1 = Omit<ComponentProps<typeof Drawn$11>, "ref">;
+/**
+ * Renders the panel with the machine's content props, the presence props and the keys merged under
+ * the caller's, and moves Tab between the panel and the trigger while the panel is open.
+ *
+ * @param props - The parts of the panel and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Content$3(props: ContentProps$1): ReactElement;
+//#endregion
+//#region src/floating-panel/control.d.ts
+/**
+ * Renders the `div` with the floating panel's control class.
+ */
+declare const Drawn$10: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the control: the props of a `div`.
+ */
+type ControlProps = ComponentProps<typeof Drawn$10>;
+/**
+ * Renders the control with the machine's control props merged under the caller's.
+ *
+ * @param props - The triggers and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Control(props: ControlProps): ReactElement;
+//#endregion
+//#region src/floating-panel/drag-trigger.d.ts
+/**
+ * Renders the `div` with the floating panel's drag trigger class.
+ */
+declare const Drawn$9: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the drag trigger: the props of a `div`.
+ */
+type DragTriggerProps = ComponentProps<typeof Drawn$9>;
+/**
+ * Renders the drag trigger with the machine's drag trigger props, but their inline style, merged
+ * under the caller's.
+ *
+ * @param props - The title, a grip glyph and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function DragTrigger(props: DragTriggerProps): ReactElement;
+//#endregion
+//#region src/floating-panel/header.d.ts
+/**
+ * Renders the `div` with the floating panel's header class.
+ */
+declare const Drawn$8: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the header: the props of a `div`.
+ */
+type HeaderProps$3 = ComponentProps<typeof Drawn$8>;
+/**
+ * Renders the header with the machine's header props merged under the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Header$3(props: HeaderProps$3): ReactElement;
+//#endregion
+//#region src/floating-panel/positioner.d.ts
+/**
+ * Renders the `div` with the floating panel'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 = ComponentProps<typeof Drawn$7>;
+/**
+ * Renders the positioner with the machine's positioner props, but its inline `z-index`, merged
+ * under 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(props: PositionerProps): null | ReactElement;
+//#endregion
+//#region src/floating-panel/resize-trigger.d.ts
+/**
+ * Renders the `div` with the floating panel's resize trigger class.
+ */
+declare const Drawn$6: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a resize trigger: the axis and the props of a `div`.
+ */
+interface ResizeTriggerProps$1 extends ComponentProps<typeof Drawn$6> {
+  /**
+   * Edge or corner the trigger resizes from: `n`, `e`, `s` or `w`, or `ne`, `nw`, `se` or `sw`.
+   */
+  readonly axis: ResizeTriggerAxis;
+}
+/**
+ * Renders the trigger with the machine's resize trigger props merged under the caller's.
+ *
+ * @param props - The axis and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ResizeTrigger$1({ axis, ...props }: ResizeTriggerProps$1): ReactElement;
+//#endregion
+//#region src/floating-panel/resize-triggers.d.ts
+/**
+ * Describes the props of the triggers: the axes and the props every trigger receives.
+ */
+interface ResizeTriggersProps extends Omit<ResizeTriggerProps$1, "axis"> {
+  /**
+   * Edges and corners to render a trigger for. Defaults to all eight.
+   */
+  readonly axes?: readonly ResizeTriggerAxis[] | undefined;
+}
+/**
+ * Renders one resize trigger per axis.
+ *
+ * @param props - The axes and the props of a `div`.
+ * @returns A fragment with one trigger per axis.
+ */
+declare function ResizeTriggers({ axes, ...props }: ResizeTriggersProps): ReactElement;
+//#endregion
+//#region src/floating-panel/machine.d.ts
+/**
+ * Describes the machine settings a caller can pass to the root, all optional.
+ *
+ * @remarks
+ *   `strategy` is left out: the machine computes the place in window coordinates, which only a
+ *   panel fixed to the window reads correctly. `translations` is left out for the stage triggers'
+ *   `label`.
+ */
+type FloatingPanelOptions = Partial<Omit<floatingPanel.Props, "strategy" | "translations">>;
+//#endregion
+//#region src/floating-panel/root.d.ts
+/**
+ * Renders the `div` that provides the recipe to the parts.
+ */
+declare const Framed$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the root: the machine's options, the presence of the panel and the props
+ * of a `div`.
+ *
+ * @remarks
+ *   The element's `id`, `dir`, `draggable` and `position` are left out, because the machine takes
+ *   all four. It derives every part's id from `id` and writes `dir` on every part. It reads
+ *   `draggable` as whether a person can move the panel, and `position` as the panel's place.
+ *   `lazyMount` and `unmountOnExit` are true by default.
+ */
+interface RootProps$6 extends FloatingPanelOptions, Omit<ComponentProps<typeof Framed$1>, "dir" | "draggable" | "id" | "position">, Omit<PresenceOptions, "present"> {}
+/**
+ * Renders the root and provides the machine and the panel's presence to the parts.
+ *
+ * @param props - The machine's options, the presence options and the props of a `div`.
+ * @returns The `div` element inside the providers.
+ */
+declare function Root$6({ lazyMount, onExitComplete, skipAnimationOnMount, unmountOnExit, ...props }: RootProps$6): ReactElement;
+//#endregion
+//#region src/floating-panel/stage-trigger.d.ts
+/**
+ * Describes the props of a stage trigger: the stage, the name and the props of the icon button.
+ */
+interface StageTriggerProps extends Omit<ButtonProps, "aria-label" | "aria-labelledby" | "ref"> {
+  /**
+   * Accessible name of the button. Defaults to "Minimize", "Maximize" or "Restore" by `stage`.
+   */
+  readonly label?: string | undefined;
+  /**
+   * Stage a press sets: `minimized`, `maximized`, or `default`, which restores the panel.
+   */
+  readonly stage: Stage;
+}
+/**
+ * Renders the trigger with the machine's stage trigger props, its name and its focus records
+ * merged under the caller's.
+ *
+ * @param props - The stage, the name, the glyph and the props of the icon button.
+ * @returns The `button` element.
+ */
+declare function StageTrigger({ label, stage, ...props }: StageTriggerProps): ReactElement;
+//#endregion
+//#region src/floating-panel/title.d.ts
+/**
+ * Renders the `h2` with the floating panel's title class.
+ */
+declare const Drawn$5: import("@stealthscale/theme").StyledComponent<"h2", {}>;
+/**
+ * Describes the props of the title: the props of an `h2`.
+ */
+type TitleProps$2 = ComponentProps<typeof Drawn$5>;
+/**
+ * Renders the title with the machine's title props merged under the caller's.
+ *
+ * @param props - The props of an `h2`.
+ * @returns The heading element.
+ */
+declare function Title$2(props: TitleProps$2): ReactElement;
+//#endregion
+//#region src/floating-panel/trigger.d.ts
+/**
+ * Renders the `button` with the floating panel's trigger class.
+ */
+declare const Drawn$4: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of the trigger: the props of a `button`.
+ */
+type TriggerProps$1 = ComponentProps<typeof Drawn$4>;
+/**
+ * Renders the trigger with the machine's trigger props and the panel's state merged under the
+ * caller's props.
+ *
+ * @param props - The props of a `button`.
+ * @returns The `button` element.
+ */
+declare function Trigger$1(props: TriggerProps$1): ReactElement;
+declare namespace index_d_exports$2 {
+  export { AnchorPositionDetails, Body$2 as Body, BodyProps$2 as BodyProps, CloseTrigger, CloseTriggerProps, Content$3 as Content, ContentProps$1 as ContentProps, Control, ControlProps, DragTrigger, DragTriggerProps, Header$3 as Header, HeaderProps$3 as HeaderProps, OpenChangeDetails, Point, PositionChangeDetails, Positioner, PositionerProps, ResizeTrigger$1 as ResizeTrigger, ResizeTriggerAxis$1 as ResizeTriggerAxis, ResizeTriggerProps$1 as ResizeTriggerProps, ResizeTriggers, ResizeTriggersProps, Root$6 as Root, RootProps$6 as RootProps, Size, SizeChangeDetails, Stage$1 as Stage, StageChangeDetails, StageTrigger, StageTriggerProps, Title$2 as Title, TitleProps$2 as TitleProps, Trigger$1 as Trigger, TriggerProps$1 as TriggerProps };
+}
+//#endregion
+//#region src/folding/priority.d.ts
+/**
+ * Types the priority that decides how an action folds as its row narrows, and derives it from the
+ * props a caller sets.
+ *
+ * @remarks
+ *   A narrow row keeps a primary action whole, renders a secondary action as its icon alone, and
+ *   moves a tertiary action into the row's menu.
+ */
+/**
+ * Priority of an action, which decides what a narrow row does with it.
+ */
+type Priority = "primary" | "secondary" | "tertiary";
+//#endregion
+//#region src/page/state.d.ts
+/**
+ * Provides the page's size and measured width to its parts and to the sections in it.
+ *
+ * @remarks
+ *   A section in a page reads its size from here, so one size on `Page.Root` sets every section.
+ *   A part rendered at one width reads the page's measured width from here.
+ */
+/**
+ * Size of a page.
+ */
+type PageSize = "lg" | "md" | "sm";
+/**
+ * Width at which a part renders.
+ */
+type PageWidth = "narrow" | "wide";
+/**
+ * Describes the props of a part rendered at one width.
+ */
+interface WhenProps {
+  /**
+   * Width at which the part renders. `narrow` renders it on a folded page alone, and `wide` on an
+   * unfolded page alone, which swaps a full trail for a single link back. Without it, the part
+   * renders at every width.
+   */
+  readonly when?: PageWidth | undefined;
+}
+//#endregion
+//#region src/page/action.d.ts
+/**
+ * Renders the library's button with the recipe's action class.
+ */
+declare const Acted$2: import("@stealthscale/theme").StyledComponent<import("@stealthscale/theme").StyledComponent<"button", {
+  readonly effect?: "glow" | "pulse";
+  readonly elevation?: import("@stealthscale/theme/authoring").Lift;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly shape?: "square";
+  readonly size?: import("@stealthscale/theme/authoring").Scale;
+  readonly variant?: "ghost" | "glass" | "outline" | "plain" | "solid" | "subtle" | "surface";
+}>, {}>;
+/**
+ * Describes the props of an action: its icon, whether it is primary, its priority, `when` and the
+ * props of the library's button.
+ */
+interface ActionProps$3 extends Omit<ComponentProps<typeof Acted$2>, "onClick">, WhenProps {
+  /**
+   * Icon before the words, which a narrow page shows alone.
+   */
+  readonly icon?: ReactNode | undefined;
+  /**
+   * Handler the button or the menu row calls when a reader presses it.
+   */
+  readonly onClick?: ((event: MouseEvent<HTMLElement>) => void) | undefined;
+  /**
+   * Whether the action is the page's primary action, which renders solid and keeps its words.
+   */
+  readonly primary?: boolean | undefined;
+  /**
+   * Priority that decides how a narrow page folds the action, in place of the one `icon` and
+   * `primary` imply.
+   */
+  readonly priority?: Priority | undefined;
+}
+/**
+ * Renders the action, or nothing while the page folds it into the menu or `when` hides it.
+ *
+ * @param props - The icon, the primary flag, the priority, the width and the props of the
+ *   library's button.
+ * @returns The `button` element, or nothing on a narrow page that folds it and at the other width.
+ */
+declare function Action$3({ as, children, disabled, icon, onClick, primary, priority, when, ...rest }: ActionProps$3): null | ReactElement;
+//#endregion
+//#region src/page/actions.d.ts
+/**
+ * Renders the `div` with the recipe's actions class.
+ */
+declare const Row$3: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the actions row: the menu's words and mark, `when` and the props of a
+ * `div`.
+ */
+interface ActionsProps$1 extends ComponentProps<typeof Row$3>, WhenProps {
+  /**
+   * Words that name the menu of folded actions. Defaults to `More actions`.
+   */
+  readonly more?: string | undefined;
+  /**
+   * Mark the menu's trigger shows in place of its words.
+   */
+  readonly moreIcon?: ReactNode | undefined;
+}
+/**
+ * Renders the row at the width `when` names, with the menu at its end while an action is folded.
+ *
+ * @param props - The menu's words and mark, the width and the props of a `div`.
+ * @returns The `div` element, or nothing at the other width.
+ */
+declare function Actions$1({ children, more, moreIcon, when, ...rest }: ActionsProps$1): null | ReactElement;
+//#endregion
+//#region src/page/sticky.d.ts
+/**
+ * Types the `sticky` prop of a band and converts it to the attribute the recipe reads.
+ */
+/**
+ * Describes the prop of a band that can stick to the top of the page.
+ */
+interface StickyProps {
+  /**
+   * Whether the band remains at the top while the page scrolls under it.
+   */
+  readonly sticky?: boolean | undefined;
+}
+//#endregion
+//#region src/page/aside.d.ts
+/**
+ * Renders the `aside` with the recipe's aside class.
+ */
+declare const Beside: import("@stealthscale/theme").StyledComponent<"aside", {}>;
+/**
+ * Behaviour of the aside below the `lg` breakpoint.
+ */
+type AsideFold = "hide" | "under";
+/**
+ * Describes the props of the aside: how it folds, `sticky` and the props of an `aside`.
+ */
+interface AsideProps extends ComponentProps<typeof Beside>, StickyProps {
+  /**
+   * Whether the aside stacks under the body or leaves the page below the `lg` breakpoint. It
+   * stacks under the body by default.
+   */
+  readonly folds?: AsideFold | undefined;
+}
+/**
+ * Renders the aside with `data-folds`, and, when it sticks, `data-sticky` and its content in a
+ * scroll area.
+ *
+ * @param props - How it folds, whether it sticks, and the props of an `aside`.
+ * @returns The `aside` element.
+ */
+declare function Aside({ children, folds, sticky, ...rest }: AsideProps): ReactElement;
+//#endregion
+//#region src/page/banner.d.ts
+/**
+ * Renders the `div` with the recipe's banner class.
+ */
+declare const Banner: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the banner: the props of a `div`.
+ */
+type BannerProps = ComponentProps<typeof Banner>;
+//#endregion
+//#region src/page/body.d.ts
+/**
+ * Renders the `div` with the recipe's body class.
+ */
+declare const Content$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the body: the props of a `div`.
+ */
+type BodyProps$1 = ComponentProps<typeof Content$2>;
+/**
+ * Renders the body, as the selected tab's panel while a strip of tabs renders.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Body$1(props: BodyProps$1): ReactElement;
+//#endregion
+//#region src/page/breadcrumbs.d.ts
+/**
+ * Describes one page above this one.
+ */
+interface Crumb {
+  /**
+   * Address of the page.
+   */
+  readonly href: string;
+  /**
+   * Words that name the page.
+   */
+  readonly label: string;
+  /**
+   * Handler the link calls when a reader presses it, for a router that handles the navigation.
+   */
+  readonly onClick?: ((event: MouseEvent<HTMLAnchorElement>) => void) | undefined;
+}
+/**
+ * Describes the props of the breadcrumbs: the pages above this one, the trail's name and the marks.
+ */
+interface BreadcrumbsProps {
+  /**
+   * Mark before the words of the narrow page's link back, such as an arrow.
+   */
+  readonly backIcon?: ReactNode | undefined;
+  /**
+   * Pages above this one, the nearest last.
+   */
+  readonly items: readonly Crumb[];
+  /**
+   * Accessible name of the trail's navigation landmark. Defaults to `Breadcrumb`.
+   */
+  readonly label?: string | undefined;
+  /**
+   * Content of the separator between two items. Defaults to `/`.
+   */
+  readonly separator?: ReactNode | undefined;
+}
+/**
+ * Renders the trail, or the link back on a narrow page.
+ *
+ * @param props - The pages above this one, the trail's name and the marks.
+ * @returns The context row with the trail, the link back, or nothing without an item.
+ */
+declare function Breadcrumbs({ backIcon, items, label, separator }: BreadcrumbsProps): null | ReactElement;
+//#endregion
+//#region src/page/context-band.d.ts
+/**
+ * Renders the `div` with the recipe's context class.
+ */
+declare const Row$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the context row: `when` and the props of a `div`.
+ */
+interface ContextProps extends ComponentProps<typeof Row$2>, WhenProps {}
+/**
+ * Renders the context row at the width `when` names.
+ *
+ * @param props - The width and the props of a `div`.
+ * @returns The `div` element, or nothing at the other width.
+ */
+declare function Context({ when, ...rest }: ContextProps): null | ReactElement;
+//#endregion
+//#region src/page/description.d.ts
+/**
+ * Renders the `p` with the recipe's description class.
+ */
+declare const Description$1: import("@stealthscale/theme").StyledComponent<"p", {}>;
+/**
+ * Describes the props of the description: the props of a `p`.
+ */
+type DescriptionProps$1 = ComponentProps<typeof Description$1>;
+//#endregion
+//#region src/page/footer.d.ts
+/**
+ * Renders the `footer` with the recipe's footer class.
+ */
+declare const Banded$3: import("@stealthscale/theme").StyledComponent<"footer", {}>;
+/**
+ * Describes the props of the footer: `sticky`, `when` and the props of a `footer`.
+ */
+interface FooterProps$2 extends ComponentProps<typeof Banded$3>, StickyProps, WhenProps {}
+/**
+ * Renders the footer at the width `when` names, with `data-sticky` when it sticks to the bottom.
+ *
+ * @param props - Whether it sticks, the width and the props of a `footer`.
+ * @returns The `footer` element, or nothing at the other width.
+ */
+declare function Footer$2({ sticky, when, ...rest }: FooterProps$2): null | ReactElement;
+//#endregion
+//#region src/page/header.d.ts
+/**
+ * Renders the `header` with the recipe's header class.
+ */
+declare const Banded$2: import("@stealthscale/theme").StyledComponent<"header", {}>;
+/**
+ * Describes the props of the header: `sticky` and the props of a `header`.
+ */
+interface HeaderProps$2 extends ComponentProps<typeof Banded$2>, StickyProps {}
+/**
+ * Renders the header, with `data-sticky` when it sticks.
+ *
+ * @param props - Whether it sticks, and the props of a `header`.
+ * @returns The `header` element.
+ */
+declare function Header$2({ sticky, ...rest }: HeaderProps$2): ReactElement;
+//#endregion
+//#region src/page/leading.d.ts
+/**
+ * Renders the `div` with the recipe's leading class.
+ */
+declare const Mark$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the leading mark: `when` and the props of a `div`.
+ */
+interface LeadingProps extends ComponentProps<typeof Mark$1>, WhenProps {}
+/**
+ * Renders the leading mark at the width `when` names.
+ *
+ * @param props - The width and the props of a `div`.
+ * @returns The `div` element, or nothing at the other width.
+ */
+declare function Leading({ when, ...rest }: LeadingProps): null | ReactElement;
+//#endregion
+//#region src/page/meta.d.ts
+/**
+ * Renders the `div` with the recipe's meta class.
+ */
+declare const Row$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the meta row: `when` and the props of a `div`.
+ */
+interface MetaProps extends ComponentProps<typeof Row$1>, WhenProps {}
+/**
+ * Renders the meta row at the width `when` names.
+ *
+ * @param props - The width and the props of a `div`.
+ * @returns The `div` element, or nothing at the other width.
+ */
+declare function Meta({ when, ...rest }: MetaProps): null | ReactElement;
+//#endregion
+//#region src/page/nav.d.ts
+/**
+ * Renders the `nav` with the recipe's nav class.
+ */
+declare const Banded$1: import("@stealthscale/theme").StyledComponent<"nav", {}>;
+/**
+ * Describes the props of the navigation: `sticky`, `when` and the props of a `nav`.
+ */
+interface NavProps$1 extends ComponentProps<typeof Banded$1>, StickyProps, WhenProps {}
+/**
+ * Renders the navigation at the width `when` names, with `data-sticky` when it sticks.
+ *
+ * @param props - Whether it sticks, the width and the props of a `nav`.
+ * @returns The `nav` element, or nothing at the other width.
+ */
+declare function Nav$1({ sticky, when, ...rest }: NavProps$1): null | ReactElement;
+//#endregion
+//#region src/page/palette.d.ts
+/**
+ * Renders the `div` with the recipe's palette class.
+ */
+declare const Palette: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the panel: the props of a `div`.
+ */
+type PaletteProps = ComponentProps<typeof Palette>;
+//#endregion
+//#region src/page/picker.d.ts
+/**
+ * Renders the library's button with the recipe's picker class.
+ */
+declare const Picker: import("@stealthscale/theme").StyledComponent<import("@stealthscale/theme").StyledComponent<"button", {
+  readonly effect?: "glow" | "pulse";
+  readonly elevation?: import("@stealthscale/theme/authoring").Lift;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly shape?: "square";
+  readonly size?: import("@stealthscale/theme/authoring").Scale;
+  readonly variant?: "ghost" | "glass" | "outline" | "plain" | "solid" | "subtle" | "surface";
+}>, {}>;
+/**
+ * Describes the props of the picker: the props of the library's button.
+ */
+type PickerProps = ComponentProps<typeof Picker>;
+//#endregion
+//#region src/page/root.d.ts
+/**
+ * Renders the `div` with the recipe's root class, which provides the variants to the bands.
+ */
+declare const Columned$1: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly align?: "center" | "start";
+  readonly divided?: boolean;
+  readonly gutter?: import("@stealthscale/theme/authoring").Scale;
+  readonly measure?: "full" | "narrow" | "wide";
+  readonly folded?: boolean;
+  readonly size?: "lg" | "md" | "sm";
+}>;
+/**
+ * Describes the props of the page: its size, the recipe's variants without `folded`, which the
+ * page measures, and the props of a `div`.
+ */
+interface RootProps$5 extends Omit<ComponentProps<typeof Columned$1>, "folded" | "size"> {
+  /**
+   * Size of the page, which a section in it reads too.
+   */
+  readonly size?: PageSize | undefined;
+}
+/**
+ * Renders the page with its measured width and provides its state to the parts.
+ *
+ * @param props - The size, the recipe's variants and the props of a `div`.
+ * @returns The `div` element, with `folded` and `data-narrow` while it is narrow.
+ */
+declare function Root$5({ size, ...rest }: RootProps$5): ReactElement;
+//#endregion
+//#region src/page/tab-list.d.ts
+/**
+ * Describes the props of the tab list: its name, its value and the words and mark of the picker.
+ */
+interface TabListProps {
+  /**
+   * Accessible name of the tabs and of the picker's list. Defaults to `Sections`.
+   */
+  readonly "aria-label"?: string | undefined;
+  /**
+   * The page's tabs.
+   */
+  readonly children?: ReactNode | undefined;
+  /**
+   * Value of the tab selected at first, while the caller does not pass `value`.
+   */
+  readonly defaultValue?: string | undefined;
+  /**
+   * Words the picker's list shows while no tab matches the filter. Defaults to `No tab matches`.
+   */
+  readonly emptyLabel?: string | undefined;
+  /**
+   * Words the picker's empty filter field shows. Defaults to `Filter tabs`.
+   */
+  readonly filterLabel?: string | undefined;
+  /**
+   * Called with the value of the tab a reader selects.
+   */
+  readonly onValueChange?: ((value: string) => void) | undefined;
+  /**
+   * Mark at the end of the picker's button, such as a chevron.
+   */
+  readonly pickerIcon?: ReactNode | undefined;
+  /**
+   * Value of the selected tab, when the caller controls it.
+   */
+  readonly value?: string | undefined;
+}
+/**
+ * Renders the strip of tabs or the picker, and lists the tabs for the picker.
+ *
+ * @param props - The name, the value and the picker's words and mark.
+ * @returns The tabs, or the picker on a narrow page.
+ */
+declare function TabList({ "aria-label": label, children, defaultValue, emptyLabel, filterLabel, onValueChange, pickerIcon, value }: TabListProps): ReactElement;
+//#endregion
+//#region src/page/tab.d.ts
+/**
+ * Describes the props of a tab: its words, its count and the props of the disclosure package's
+ * tab trigger.
+ */
+interface TabProps extends Omit<Tabs.TriggerProps, "children"> {
+  /**
+   * Words of the tab.
+   */
+  readonly children: string;
+  /**
+   * Number the tab's badge shows, such as the rows the tab's view contains.
+   */
+  readonly count?: number | undefined;
+}
+/**
+ * Renders the tab, or nothing on a narrow page, and lists it with its tab list.
+ *
+ * @param props - The words, the count and the trigger's props.
+ * @returns The `button` element, or nothing on a narrow page.
+ */
+declare function Tab({ children, count, disabled, value, ...rest }: TabProps): null | ReactElement;
+//#endregion
+//#region src/page/tabs.d.ts
+/**
+ * Renders the `div` with the recipe's tabs class.
+ */
+declare const Tabs$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the tab strip: the props of a `div`.
+ */
+type TabsProps = ComponentProps<typeof Tabs$1>;
+//#endregion
+//#region src/page/title.d.ts
+/**
+ * Renders the `h1` with the recipe's title class.
+ */
+declare const Title$1: import("@stealthscale/theme").StyledComponent<"h1", {}>;
+/**
+ * Describes the props of the title: the props of a heading.
+ */
+type TitleProps$1 = ComponentProps<typeof Title$1>;
+//#endregion
+//#region src/page/toolbar.d.ts
+/**
+ * Renders the `div` with the recipe's toolbar class.
+ */
+declare const Banded: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the toolbar band: `sticky` and the props of a `div`.
+ */
+interface ToolbarProps extends ComponentProps<typeof Banded>, StickyProps {}
+/**
+ * Renders the toolbar band, with `data-sticky` when it sticks.
+ *
+ * @param props - Whether it sticks, and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Toolbar({ sticky, ...rest }: ToolbarProps): ReactElement;
+//#endregion
+//#region src/page/trail.d.ts
+/**
+ * Renders the `a` with the recipe's trail class.
+ */
+declare const Trail: import("@stealthscale/theme").StyledComponent<"a", {}>;
+/**
+ * Describes the props of the link back: the props of an `a`.
+ */
+type TrailProps = ComponentProps<typeof Trail>;
+//#endregion
+//#region src/page/when.d.ts
+/**
+ * Describes the props of the switch: the width and the parts that render at it.
+ */
+interface WhenComponentProps extends WhenProps {
+  /**
+   * The parts that render at the width.
+   */
+  readonly children?: ReactNode | undefined;
+}
+/**
+ * Renders its children at the width it names, and nothing at the other.
+ *
+ * @param props - The width, and the parts that render at it.
+ * @returns The children, or `null`.
+ */
+declare function When({ children, when }: WhenComponentProps): ReactNode;
+declare namespace index_d_exports$3 {
+  export { Action$3 as Action, ActionProps$3 as ActionProps, Actions$1 as Actions, ActionsProps$1 as ActionsProps, Aside, AsideFold, AsideProps, Banner, BannerProps, Body$1 as Body, BodyProps$1 as BodyProps, Breadcrumbs, BreadcrumbsProps, Context, ContextProps, Crumb, Description$1 as Description, DescriptionProps$1 as DescriptionProps, Footer$2 as Footer, FooterProps$2 as FooterProps, Header$2 as Header, HeaderProps$2 as HeaderProps, Leading, LeadingProps, Meta, MetaProps, Nav$1 as Nav, NavProps$1 as NavProps, Palette, PaletteProps, Picker, PickerProps, Root$5 as Root, RootProps$5 as RootProps, Tab, TabList, TabListProps, TabProps, Tabs$1 as Tabs, TabsProps, Title$1 as Title, TitleProps$1 as TitleProps, Toolbar, ToolbarProps, Trail, TrailProps, When, WhenComponentProps };
+}
+//#endregion
+//#region src/section/action.d.ts
+/**
+ * Renders the library's button with the recipe's action class.
+ */
+declare const Acted$1: import("@stealthscale/theme").StyledComponent<import("@stealthscale/theme").StyledComponent<"button", {
+  readonly effect?: "glow" | "pulse";
+  readonly elevation?: import("@stealthscale/theme/authoring").Lift;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly shape?: "square";
+  readonly size?: import("@stealthscale/theme/authoring").Scale;
+  readonly variant?: "ghost" | "glass" | "outline" | "plain" | "solid" | "subtle" | "surface";
+}>, {}>;
+/**
+ * Describes the props of an action: its icon, whether it is primary, its priority and the props of
+ * the library's button.
+ */
+interface ActionProps$2 extends Omit<ComponentProps<typeof Acted$1>, "onClick"> {
+  /**
+   * Icon before the words, which a narrow section shows alone.
+   */
+  readonly icon?: ReactNode | undefined;
+  /**
+   * Handler the button or the menu row calls when a reader presses it.
+   */
+  readonly onClick?: ((event: MouseEvent<HTMLElement>) => void) | undefined;
+  /**
+   * Whether the action is the section's primary action, which renders solid and keeps its words.
+   */
+  readonly primary?: boolean | undefined;
+  /**
+   * Priority that decides how a narrow section folds the action, in place of the one `icon` and
+   * `primary` imply.
+   */
+  readonly priority?: Priority | undefined;
+}
+/**
+ * Renders the action, or nothing while the section folds it into the menu.
+ *
+ * @param props - The icon, the primary flag, the priority and the props of the library's button.
+ * @returns The `button` element, or nothing on a narrow section that folds it.
+ */
+declare function Action$2({ as, children, disabled, icon, onClick, primary, priority, ...rest }: ActionProps$2): null | ReactElement;
+//#endregion
+//#region src/section/actions.d.ts
+/**
+ * Renders the `div` with the recipe's actions class.
+ */
+declare const Row: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the actions row: the menu's words and mark, and the props of a `div`.
+ */
+interface ActionsProps extends ComponentProps<typeof Row> {
+  /**
+   * Words that name the menu of folded actions. Defaults to `More actions`.
+   */
+  readonly more?: string | undefined;
+  /**
+   * Mark the menu's trigger shows in place of its words.
+   */
+  readonly moreIcon?: ReactNode | undefined;
+}
+/**
+ * Renders the row, with the menu at its end while an action is folded.
+ *
+ * @param props - The menu's words and mark, and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Actions({ children, more, moreIcon, ...rest }: ActionsProps): ReactElement;
+//#endregion
+//#region src/section/body.d.ts
+/**
+ * Renders the `div` with the recipe's body class.
+ */
+declare const Content$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the body: whether it runs to the card's edges, and the props of a `div`.
+ */
+interface BodyProps extends ComponentProps<typeof Content$1> {
+  /**
+   * Whether the body drops its padding and runs to the card's edges.
+   */
+  readonly bleed?: boolean | undefined;
+}
+/**
+ * Renders the body, with `data-bleed` while it runs to the card's edges.
+ *
+ * @param props - Whether the body bleeds, and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Body({ bleed, ...rest }: BodyProps): ReactElement;
+//#endregion
+//#region src/section/description.d.ts
+/**
+ * Renders the `p` with the recipe's description class.
+ */
+declare const Description: import("@stealthscale/theme").StyledComponent<"p", {}>;
+/**
+ * Describes the props of the description: the props of a `p`.
+ */
+type DescriptionProps = ComponentProps<typeof Description>;
+//#endregion
+//#region src/section/footer.d.ts
+/**
+ * Renders the `footer` with the recipe's footer class.
+ */
+declare const Footer$1: import("@stealthscale/theme").StyledComponent<"footer", {}>;
+/**
+ * Describes the props of the footer: the props of a `footer`.
+ */
+type FooterProps$1 = ComponentProps<typeof Footer$1>;
+//#endregion
+//#region src/section/header.d.ts
+/**
+ * Renders the `header` with the recipe's header class.
+ */
+declare const Header$1: import("@stealthscale/theme").StyledComponent<"header", {}>;
+/**
+ * Describes the props of the header: the props of a `header`.
+ */
+type HeaderProps$1 = ComponentProps<typeof Header$1>;
+//#endregion
+//#region src/section/root.d.ts
+/**
+ * Renders the `section` with the recipe's root class, which provides the variants to the parts.
+ */
+declare const Block: import("@stealthscale/theme").StyledComponent<"section", {
+  readonly annotated?: boolean;
+  readonly size?: "lg" | "md" | "sm";
+  readonly variant?: "plain" | "surface";
+}>;
+/**
+ * Describes the props of the section: the recipe's variants and the props of a `section`, without
+ * `aria-labelledby`, which the root sets.
+ */
+type RootProps$4 = Omit<ComponentProps<typeof Block>, "aria-labelledby">;
+/**
+ * Renders the section with its title's id and its measured width.
+ *
+ * @param props - The recipe's variants and the props of a `section`.
+ * @returns The `section` element, with `data-narrow` while it is narrow.
+ */
+declare function Root$4({ size, ...rest }: RootProps$4): ReactElement;
+//#endregion
+//#region src/section/title.d.ts
+/**
+ * Renders the `h2` with the recipe's title class.
+ */
+declare const Named: import("@stealthscale/theme").StyledComponent<"h2", {}>;
+/**
+ * Describes the props of the title: the props of a heading without `id`, which the section sets.
+ */
+type TitleProps = Omit<ComponentProps<typeof Named>, "id">;
+/**
+ * Renders the heading with the section's title id.
+ *
+ * @param props - The props of a heading, without `id`.
+ * @returns The heading element.
+ */
+declare function Title(props: TitleProps): ReactElement;
+declare namespace index_d_exports$4 {
+  export { Action$2 as Action, ActionProps$2 as ActionProps, Actions, ActionsProps, Body, BodyProps, Description, DescriptionProps, Footer$1 as Footer, FooterProps$1 as FooterProps, Header$1 as Header, HeaderProps$1 as HeaderProps, Root$4 as Root, RootProps$4 as RootProps, Title, TitleProps };
+}
+//#endregion
+//#region src/sidebar/content.d.ts
+/**
+ * Describes the props of `Content`: the props of the scroll area's content, without `as`, because
+ * another element in its place would drop the content's part.
+ */
+type ContentProps = Omit<ScrollArea.ContentProps, "as">;
+/**
+ * Renders the blocks inside a scroll area with a vertical bar.
+ *
+ * @param props - The props of the scroll area's content, the blocks among its children.
+ * @returns The scroll area's root.
+ */
+declare function Content(props: ContentProps): ReactElement;
+//#endregion
+//#region src/sidebar/empty.d.ts
+/**
+ * Renders the message `p` at the sidebar's size.
+ */
+declare const Noted: import("@stealthscale/theme").StyledComponent<"p", {}>;
+/**
+ * Describes the props of `Empty`.
+ */
+type EmptyProps = ComponentProps<typeof Noted>;
+/**
+ * Renders the message while the scope keeps no row, and announces it while a query is active.
+ *
+ * @param props - The `p` element's props.
+ * @returns The `p` element, or nothing while the scope keeps a row.
+ */
+declare function Empty(props: EmptyProps): null | ReactElement;
+//#endregion
+//#region src/sidebar/footer.d.ts
+/**
+ * Renders the footer `div` at the sidebar's size.
+ */
+declare const Footer: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Footer`.
+ */
+type FooterProps = ComponentProps<typeof Footer>;
+//#endregion
+//#region src/sidebar/header.d.ts
+/**
+ * Renders the header `div` at the sidebar's size.
+ */
+declare const Header: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Header`.
+ */
+type HeaderProps = ComponentProps<typeof Header>;
+//#endregion
+//#region src/sidebar/nav-action.d.ts
+/**
+ * Renders the control `button` at the sidebar's size, typed `button` so it submits no form.
+ */
+declare const NavAction: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of `NavAction`.
+ */
+type NavActionProps = ComponentProps<typeof NavAction>;
+//#endregion
+//#region src/sidebar/nav-heading.d.ts
+/**
+ * Renders the heading `h2` at the sidebar's size.
+ */
+declare const Headed$1: import("@stealthscale/theme").StyledComponent<"h2", {}>;
+/**
+ * Describes the props of `NavHeading`, `id` among them.
+ */
+type NavHeadingProps = ComponentProps<typeof Headed$1>;
+/**
+ * Renders a heading over one list of destinations.
+ *
+ * @param props - The `h2` element's props, `id` among them.
+ * @returns The `h2` element with the caller's `id`, at the sidebar's size.
+ */
+declare function NavHeading(props: NavHeadingProps): ReactElement;
+//#endregion
+//#region src/sidebar/nav-label.d.ts
+/**
+ * Renders the heading `h2` at the sidebar's size.
+ */
+declare const Headed: import("@stealthscale/theme").StyledComponent<"h2", {}>;
+/**
+ * Describes the props of `NavLabel`, less the `id` the block sets.
+ */
+type NavLabelProps = Omit<ComponentProps<typeof Headed>, "id">;
+/**
+ * Renders the label of a nav block.
+ *
+ * @param props - The `h2` element's props, less `id`.
+ * @returns The heading, with the identifier the block's `aria-labelledby` points at.
+ */
+declare function NavLabel(props: NavLabelProps): ReactElement;
+//#endregion
+//#region src/sidebar/nav.d.ts
+/**
+ * Renders the block `nav` at the sidebar's size.
+ */
+declare const Blocked: import("@stealthscale/theme").StyledComponent<"nav", {}>;
+/**
+ * Describes the props of `Nav`, less the `aria-labelledby` the block sets.
+ */
+type NavProps = Omit<ComponentProps<typeof Blocked>, "aria-labelledby">;
+/**
+ * Renders a block of destinations named by its label or by `aria-label`.
+ *
+ * @param props - The `nav` element's props, less `aria-labelledby`.
+ * @returns The block, with `aria-labelledby` unless `aria-label` is passed.
+ */
+declare function Nav(props: NavProps): ReactElement;
+//#endregion
+//#region src/sidebar/root.d.ts
+/**
+ * Renders the column and provides the variants to every part below it.
+ */
+declare const Columned: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly size?: "lg" | "md" | "sm";
+  readonly variant?: "outline" | "plain" | "subtle" | "surface";
+}>;
+/**
+ * Describes the props of `Root`.
+ */
+interface RootProps$3 extends ComponentProps<typeof Columned> {
+  /**
+   * Whether the sidebar is a rail of icons, in place of the one its panel implies.
+   */
+  readonly iconic?: boolean | undefined;
+}
+/**
+ * Renders the sidebar's column.
+ *
+ * @param props - `iconic`, the recipe's variants and the `div` element's props.
+ * @returns The column, with `data-iconic` on a rail.
+ */
+declare function Root$3({ iconic, onClick, size, ...rest }: RootProps$3): ReactElement;
+//#endregion
+//#region src/sidebar/search.d.ts
+/**
+ * Describes the props of `Search`: the props of the forms package's search input and the shortcut.
+ */
+interface SearchProps$1 extends SearchInputProps {
+  /**
+   * Key that moves focus to the field with the platform's modifier held: `k` for ⌘K and Ctrl+K.
+   */
+  readonly shortcut?: string | undefined;
+}
+/**
+ * Renders the field that filters the scope, the rail's button, or the caller's field.
+ *
+ * @param props - The props of the search input and the shortcut.
+ * @returns The `div` element, or nothing on a rail it cannot open.
+ */
+declare function Search$1({ "aria-label": named, children, defaultValue, onKeyDown, onValueChange, searchIndicator, shortcut, value: driven, ...rest }: SearchProps$1): null | ReactElement;
+//#endregion
+//#region src/sidebar/separator.d.ts
+/**
+ * Renders the divider at the sidebar's size.
+ */
+declare const Separator$1: import("@stealthscale/theme").StyledComponent<typeof Divider, {}>;
+/**
+ * Describes the props of `Separator`.
+ */
+type SeparatorProps$1 = ComponentProps<typeof Separator$1>;
+declare namespace index_d_exports$5 {
+  export { Content, ContentProps, Empty, EmptyProps, Footer, FooterProps, Header, HeaderProps, Nav, NavAction, NavActionProps, NavHeading, NavHeadingProps, NavLabel, NavLabelProps, NavProps, Root$3 as Root, RootProps$3 as RootProps, Search$1 as Search, SearchProps$1 as SearchProps, Separator$1 as Separator, SeparatorProps$1 as SeparatorProps };
+}
+//#endregion
+//#region src/splitter/machine.d.ts
+/**
+ * Describes the api `useSplitter` returns: the sizes, the methods that change them and a prop
+ * getter per part.
+ *
+ * @remarks
+ *   The type is the return type of `connect`, so it follows the installed machine version. That
+ *   type references `@zag-js/types`, so the package declares that package as a dependency.
+ */
+type SplitterApi = ReturnType<typeof splitter$1.connect>;
+/**
+ * Describes the machine settings a caller passes to `useSplitter`: the panels, their sizes and the
+ * callbacks.
+ */
+interface SplitterOptions extends Omit<splitter$1.Props, "id" | "ids"> {
+  /**
+   * Base of the ids of the root, the panels and the triggers. A generated id is used when absent.
+   */
+  readonly id?: string | undefined;
+}
+/**
+ * Starts the splitter machine and returns its connected api.
+ *
+ * @param options - The machine settings. A generated id is used when `id` is absent.
+ * @returns The api the root provides to its parts.
+ */
+declare function useSplitter(options: SplitterOptions): SplitterApi;
+//#endregion
+//#region src/splitter/panel.d.ts
+/**
+ * Renders the `div` with the recipe's panel class.
+ */
+declare const Drawn$3: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a panel: its id among the machine's panels and the props of a `div`.
+ */
+interface PanelProps extends Omit<ComponentProps<typeof Drawn$3>, "id"> {
+  /**
+   * Id of the panel in the `panels` passed to `useSplitter`. The machine derives the element's id
+   * from it.
+   */
+  readonly id: string;
+}
+/**
+ * Renders the panel with the machine's panel props merged under the caller's.
+ *
+ * @param props - The panel's id and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Panel({ id, ...props }: PanelProps): ReactElement;
+//#endregion
+//#region src/splitter/resize-trigger-indicator.d.ts
+/**
+ * Renders the `div` with the recipe's indicator class.
+ */
+declare const Drawn$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the pill: the props of a `div`.
+ */
+type ResizeTriggerIndicatorProps = ComponentProps<typeof Drawn$2>;
+/**
+ * Renders the pill with the machine's indicator props for its trigger merged under the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ResizeTriggerIndicator(props: ResizeTriggerIndicatorProps): ReactElement;
+//#endregion
+//#region src/splitter/resize-trigger-separator.d.ts
+/**
+ * Renders the `div` with the recipe's separator class.
+ */
+declare const Drawn$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the line: the props of a `div`.
+ */
+type ResizeTriggerSeparatorProps = ComponentProps<typeof Drawn$1>;
+/**
+ * Renders the line with the splitter's orientation, which decides which way it runs.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ResizeTriggerSeparator(props: ResizeTriggerSeparatorProps): ReactElement;
+//#endregion
+//#region src/splitter/resize-trigger.d.ts
+/**
+ * Renders the `div` with the recipe's resize trigger class.
+ */
+declare const Drawn: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a trigger: the panels it sits between, whether it is disabled, its name
+ * and the props of a `div`.
+ */
+interface ResizeTriggerProps extends Omit<ComponentProps<typeof Drawn>, "id"> {
+  /**
+   * Whether the trigger ignores the pointer and the keys. A disabled trigger leaves the tab order.
+   */
+  readonly disabled?: boolean | undefined;
+  /**
+   * Ids of the panels before and after the trigger, joined by a colon, such as `files:editor`.
+   */
+  readonly id: `${string}:${string}`;
+  /**
+   * Accessible name of the trigger. Defaults to "Resize".
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the trigger with the machine's trigger props, its name, its line's orientation and its
+ * primary pane merged under the caller's.
+ *
+ * @param props - The panels, the disabled state, the name and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function ResizeTrigger({ children, disabled, id, label, ...props }: ResizeTriggerProps): ReactElement;
+//#endregion
+//#region src/splitter/root.d.ts
+/**
+ * Renders the `div` that provides the recipe's variants.
+ */
+declare const Framed: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+}>;
+/**
+ * Describes the props of the root: the api, the recipe's variants and the props of a `div`.
+ */
+interface RootProps$2 extends ComponentProps<typeof Framed> {
+  /**
+   * Api `useSplitter` returns, which every part reads.
+   */
+  readonly splitter: SplitterApi;
+}
+/**
+ * Renders the root with the machine's root props but its inline layout, and provides the api to
+ * the parts.
+ *
+ * @param props - The api, the recipe's variants and the props of a `div`.
+ * @returns The `div` element inside the api provider.
+ */
+declare function Root$2({ splitter, ...props }: RootProps$2): ReactElement;
+declare namespace index_d_exports$6 {
+  export { ExpandCollapseDetails, Panel, PanelData, PanelProps, PanelSize, ResizeDetails, ResizeEndDetails, ResizeTrigger, ResizeTriggerIndicator, ResizeTriggerIndicatorProps, ResizeTriggerProps, ResizeTriggerSeparator, ResizeTriggerSeparatorProps, Root$2 as Root, RootProps$2 as RootProps, SplitterApi, SplitterOptions, useSplitter };
+}
+//#endregion
+//#region src/switcher/action.d.ts
+/**
+ * Describes the props of `Action`: its icon, an optional value and the menu item's props.
+ */
+interface ActionProps$1 extends Omit<ComponentProps<typeof Menu.Item>, "value"> {
+  /**
+   * Mark before the words.
+   */
+  readonly icon?: ReactNode | undefined;
+  /**
+   * Value the menu identifies the row by. A generated one when absent.
+   */
+  readonly value?: string | undefined;
+}
+/**
+ * Renders the row with its icon before its words.
+ *
+ * @param props - The icon, the value and the menu item's props.
+ * @returns The menu item.
+ */
+declare function Action$1({ children, icon, value, ...rest }: ActionProps$1): ReactElement;
+//#endregion
+//#region src/switcher/choice.d.ts
+/**
+ * Describes one workspace, project or tenant a switcher lists.
+ */
+interface Choice {
+  /**
+   * Plan, role or region, rendered under the name in a sidebar and in the menu's row.
+   */
+  readonly detail?: string | undefined;
+  /**
+   * Whether the reader cannot switch to the choice.
+   */
+  readonly disabled?: boolean | undefined;
+  /**
+   * Address of the choice's own page, which renders its row as a link.
+   */
+  readonly href?: string | undefined;
+  /**
+   * Name of the choice.
+   */
+  readonly label: string;
+  /**
+   * Logo or avatar. The mark shows the name's initials without one.
+   */
+  readonly mark?: ReactNode | undefined;
+  /**
+   * Value the application knows the choice by.
+   */
+  readonly value: string;
+}
+//#endregion
+//#region src/switcher/detail.d.ts
+/**
+ * Renders the detail `span` at the switcher's size.
+ */
+declare const Detail: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of `Detail`.
+ */
+type DetailProps = ComponentProps<typeof Detail>;
+//#endregion
+//#region src/switcher/indicator.d.ts
+/**
+ * Renders the menu's indicator with the indicator slot's class.
+ */
+declare const Indicator: import("@stealthscale/theme").StyledComponent<typeof Menu.Indicator, {}>;
+/**
+ * Describes the props of `Indicator`.
+ */
+type IndicatorProps = ComponentProps<typeof Indicator>;
+//#endregion
+//#region src/switcher/label.d.ts
+/**
+ * Renders the label `span` at the switcher's size.
+ */
+declare const Label: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of `Label`.
+ */
+type LabelProps = ComponentProps<typeof Label>;
+//#endregion
+//#region src/switcher/mark.d.ts
+/**
+ * Renders the mark `span` at the switcher's size, hidden from the accessibility tree.
+ */
+declare const Mark: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of `Mark`.
+ */
+type MarkProps = ComponentProps<typeof Mark>;
+//#endregion
+//#region src/switcher/name.d.ts
+/**
+ * Renders the name `span` at the switcher's size.
+ */
+declare const Name: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of `Name`.
+ */
+type NameProps = ComponentProps<typeof Name>;
+//#endregion
+//#region src/switcher/recipe.d.ts
+/**
+ * Declares the switcher's slot recipe, which styles the control that shows the current workspace,
+ * project or environment and opens the menu of the others.
+ *
+ * @remarks
+ *   The recipe has six slots. The root slot is the trigger, and the mark, the label, the name, the
+ *   detail and the indicator are inside it. `Switcher.Root` is the disclosure package's menu, so
+ *   the menu's recipe styles the panel and its rows. The trigger takes the button's looks and
+ *   palettes from the same layer styles, so an outlined switcher has the button's light edge. The
+ *   mark is a square in the palette's muted fill for an initial, an icon or an avatar. The name and
+ *   the detail truncate to keep the control at one height. A pair of chevrons marks a control that
+ *   switches and not a direction, so the indicator does not rotate while the menu is open. In a
+ *   sidebar closed to icons the control is its mark alone, square, and in a narrow toolbar a
+ *   switcher with a mark hides its name. The words remain in the accessible name in both.
+ */
+/**
+ * Styles a ghost switcher at the middle size, alone.
+ */
+declare const recipe: import("@stealthscale/theme/authoring").SlotRecipe<"detail" | "indicator" | "label" | "mark" | "name" | "root", {
+  /**
+   * The palette of the look and the mark.
+   */
+  readonly palette: {
+    accent: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    error: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    info: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    neutral: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    primary: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    secondary: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    success: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    warning: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+  };
+  /**
+   * Where the control is placed, which sets its width and its lines.
+   *
+   * @remarks
+   *   `Switcher.Root` reads the placement from the sidebar or the toolbar around it unless a
+   *   caller states one. The `marked` compound sizes the mark to `icon.lg` on one line, because
+   *   the size axis sizes it for a sidebar and a compound applies over an axis.
+   */
+  readonly placement: {
+    alone: {
+      detail: {
+        display: string;
+      };
+      root: {
+        inlineSize: string;
+        minBlockSize: string;
+      };
+    };
+    sidebar: {
+      root: {
+        "&[data-iconic]": {
+          alignSelf: string;
+          aspectRatio: string;
+          borderWidth: string;
+          inlineSize: string;
+          justifyContent: string;
+          padding: string;
+        };
+        inlineSize: string;
+      };
+    };
+    toolbar: {
+      detail: {
+        display: string;
+      };
+      root: {
+        inlineSize: string;
+        minBlockSize: string;
+      };
+    };
+  };
+  readonly size: {
+    lg: Partial<Record<"indicator" | "mark" | "name" | "root", import("@stealthscale/theme").SystemStyleObject>>;
+    md: Partial<Record<"indicator" | "mark" | "name" | "root", import("@stealthscale/theme").SystemStyleObject>>;
+    sm: Partial<Record<"indicator" | "mark" | "name" | "root", import("@stealthscale/theme").SystemStyleObject>>;
+  };
+  /**
+   * The button's six looks, each one of the theme's layer styles.
+   *
+   * @remarks
+   *   `ghost`, the default, has no fill at rest, so a switcher at the head of a sidebar shows the
+   *   sidebar's own ground and fills under a pointer.
+   */
+  readonly variant: {
+    ghost: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    outline: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    plain: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    solid: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    subtle: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    surface: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+  };
+}>;
+//#endregion
+//#region src/switcher/sized.d.ts
+/**
+ * Selects one of the sizes the menu renders at, which are the switcher's sizes.
+ */
+type Step = "lg" | "md" | "sm";
+/**
+ * Describes the props of `Sized`: the menu's props and the step.
+ */
+interface SizedProps extends Omit<ComponentProps<typeof Menu.Root>, "size"> {
+  /**
+   * Size the switcher renders at.
+   */
+  readonly step: Step;
+}
+/**
+ * Renders the menu at the step.
+ *
+ * @param props - The step and the menu's props.
+ * @returns The menu at that size.
+ */
+declare function Sized({ step, ...rest }: SizedProps): ReactElement;
+//#endregion
+//#region src/switcher/state.d.ts
+/**
+ * Derives where a switcher renders from the sidebar or the toolbar around it, and provides it to
+ * the switcher's parts.
+ *
+ * @remarks
+ *   A switcher in a sidebar is a row at the sidebar's size, and its mark alone while the sidebar
+ *   is a rail. A switcher in a toolbar is one of the row's controls at the toolbar's size, and a
+ *   switcher with a mark hides its name while the toolbar is narrow. Anywhere else it is one line
+ *   at its own size. A caller's `placement` or `size` applies over the derived one.
+ */
+/**
+ * Selects where a switcher renders.
+ */
+type Placement = "alone" | "sidebar" | "toolbar";
+/**
+ * Selects the size of a switcher.
+ */
+type SwitcherSize = "lg" | "md" | "sm";
+//#endregion
+//#region src/switcher/root.d.ts
+/**
+ * Binds the sized menu as the root that provides the variants.
+ */
+declare const Bound: import("@stealthscale/theme").RootProvider<typeof Sized, {
+  readonly palette: {
+    accent: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    error: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    info: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    neutral: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    primary: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    secondary: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    success: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    warning: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+  };
+  readonly placement: {
+    alone: {
+      detail: {
+        display: string;
+      };
+      root: {
+        inlineSize: string;
+        minBlockSize: string;
+      };
+    };
+    sidebar: {
+      root: {
+        "&[data-iconic]": {
+          alignSelf: string;
+          aspectRatio: string;
+          borderWidth: string;
+          inlineSize: string;
+          justifyContent: string;
+          padding: string;
+        };
+        inlineSize: string;
+      };
+    };
+    toolbar: {
+      detail: {
+        display: string;
+      };
+      root: {
+        inlineSize: string;
+        minBlockSize: string;
+      };
+    };
+  };
+  readonly size: {
+    lg: Partial<Record<"indicator" | "mark" | "name" | "root", import("@stealthscale/theme").SystemStyleObject>>;
+    md: Partial<Record<"indicator" | "mark" | "name" | "root", import("@stealthscale/theme").SystemStyleObject>>;
+    sm: Partial<Record<"indicator" | "mark" | "name" | "root", import("@stealthscale/theme").SystemStyleObject>>;
+  };
+  readonly variant: {
+    ghost: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    outline: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    plain: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    solid: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    subtle: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+    surface: Record<"root", import("@stealthscale/theme").SystemStyleObject>;
+  };
+}>;
+/**
+ * Variant props of the switcher's recipe.
+ */
+type Variants = RecipeProps<typeof recipe>;
+/**
+ * Props of the binding, with the variants typed as the recipe types them.
+ */
+type ProvidedProps = Omit<ComponentProps<typeof Bound>, keyof Variants> & Variants;
+/**
+ * Describes the props of `Root`: the choices and their glyphs, the switcher's variants and the
+ * menu's props.
+ *
+ * @remarks
+ *   The menu's recipe also offers `size` and `variant`. Over the menu's root the two `variant` axes
+ *   intersect to a type no value satisfies, so the switcher's axes replace the menu's here. The
+ *   menu's size is the switcher's `size`, so `step` is omitted.
+ */
+interface RootProps$1 extends Omit<ProvidedProps, "placement" | "size" | "step"> {
+  /**
+   * Glyph that marks the current choice's row in the menu.
+   */
+  readonly checkIcon?: ReactNode | undefined;
+  /**
+   * Value of the choice that is current at first, when the caller does not control it. Defaults to
+   * the first choice.
+   */
+  readonly defaultValue?: string | undefined;
+  /**
+   * Glyph at the end of the trigger.
+   */
+  readonly indicator?: ReactNode | undefined;
+  /**
+   * The choices. With them the root renders the trigger and the menu.
+   */
+  readonly items?: readonly Choice[] | undefined;
+  /**
+   * Kind of thing the switcher switches, which a screen reader announces before the current name.
+   * Used with `items`.
+   */
+  readonly label?: string | undefined;
+  /**
+   * Called with the value of the choice the reader switches to.
+   */
+  readonly onValueChange?: ((value: string) => void) | undefined;
+  /**
+   * Where the switcher renders. Read from the sidebar or the toolbar around it when absent.
+   */
+  readonly placement?: Placement | undefined;
+  /**
+   * Size of the switcher. The sidebar's or the toolbar's size when absent, and `md` alone.
+   */
+  readonly size?: SwitcherSize | undefined;
+  /**
+   * Value of the current choice, when the caller controls it.
+   */
+  readonly value?: string | undefined;
+}
+/**
+ * Renders the menu with the switcher's variants, at the switcher's size.
+ *
+ * @remarks
+ *   A caller's `positioning` applies over the placement's, and a caller's `ids` over the trigger id
+ *   the root shares with the rail's tooltip.
+ * @param props - The choices, the glyphs, the switcher's variants and the menu's props.
+ * @returns The menu, providing the variants and the placement.
+ */
+declare function Root$1({ checkIcon, children, defaultValue, indicator, items, label, onValueChange, placement, positioning, size, value, ...rest }: RootProps$1): ReactElement;
+//#endregion
+//#region src/switcher/trigger.d.ts
+/**
+ * Renders the menu's trigger with the root slot's class.
+ */
+declare const Pressed: import("@stealthscale/theme").StyledComponent<typeof Menu.Trigger, {}>;
+/**
+ * Describes the props of `Trigger`.
+ */
+interface TriggerProps extends ComponentProps<typeof Pressed> {
+  /**
+   * Kind of thing the control switches: `Workspace`, `Project`, `Environment`. A screen reader
+   * announces it before the current name.
+   */
+  readonly label: string;
+}
+/**
+ * Renders the control with its label before its children.
+ *
+ * @param props - `label` and the menu trigger's props.
+ * @returns The menu's trigger with the hidden label before the children.
+ */
+declare function Trigger({ children, label, ...rest }: TriggerProps): ReactElement;
+declare namespace index_d_exports$7 {
+  export { Action$1 as Action, ActionProps$1 as ActionProps, Choice, Detail, DetailProps, Indicator, IndicatorProps, Label, LabelProps, Mark, MarkProps, Name, NameProps, Placement, Root$1 as Root, RootProps$1 as RootProps, SwitcherSize, Trigger, TriggerProps };
+}
+//#endregion
+//#region src/toolbar/action.d.ts
+/**
+ * Renders the library's button with the recipe's action class.
+ */
+declare const Acted: import("@stealthscale/theme").StyledComponent<import("@stealthscale/theme").StyledComponent<"button", {
+  readonly effect?: "glow" | "pulse";
+  readonly elevation?: import("@stealthscale/theme/authoring").Lift;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly shape?: "square";
+  readonly size?: import("@stealthscale/theme/authoring").Scale;
+  readonly variant?: "ghost" | "glass" | "outline" | "plain" | "solid" | "subtle" | "surface";
+}>, {}>;
+/**
+ * Describes the props of an action: its icon, whether it is primary, its priority and the props of
+ * the library's button.
+ */
+interface ActionProps extends Omit<ItemProps<typeof Acted>, "as" | "href" | "onClick"> {
+  /**
+   * Icon before the words, which a narrow row shows alone.
+   */
+  readonly icon?: ReactNode | undefined;
+  /**
+   * Handler the button or the menu row calls when a reader presses it.
+   */
+  readonly onClick?: ((event: MouseEvent<HTMLElement>) => void) | undefined;
+  /**
+   * Whether the action is the row's primary action, which renders solid and keeps its words.
+   */
+  readonly primary?: boolean | undefined;
+  /**
+   * Priority that decides how a narrow row folds the action, in place of the one `icon` and
+   * `primary` imply.
+   */
+  readonly priority?: Priority | undefined;
+}
+/**
+ * Renders the action, or nothing while the row folds it into its menu.
+ *
+ * @param props - The icon, the primary flag, the priority and the props of the library's button.
+ * @returns The `button` element, or nothing on a narrow row that folds it.
+ */
+declare function Action({ children, disabled, icon, onClick, primary, priority, ...rest }: ActionProps): null | ReactElement;
+//#endregion
+//#region src/toolbar/center.d.ts
+/**
+ * Renders the `div` with the recipe's center class.
+ */
+declare const Center: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the centre band: the props of a `div`.
+ */
+type CenterProps = ComponentProps<typeof Center>;
+//#endregion
+//#region src/toolbar/end.d.ts
+/**
+ * Renders the `div` with the recipe's end class.
+ */
+declare const End: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the end band: the props of a `div`.
+ */
+type EndProps = ComponentProps<typeof End>;
+//#endregion
+//#region src/toolbar/group.d.ts
+/**
+ * Renders the layout package's group, attached, with the recipe's group class.
+ */
+declare const Group: import("@stealthscale/theme").StyledComponent<import("@stealthscale/theme").StyledComponent<"div", {
+  readonly align?: import("@stealthscale/theme/authoring").Align;
+  readonly dim?: boolean;
+  readonly attached?: boolean;
+  readonly gap?: "lg" | "md" | "sm" | "xl" | "xs";
+  readonly grow?: boolean;
+  readonly justify?: import("@stealthscale/theme/authoring").Justify;
+  readonly orientation?: "horizontal" | "vertical";
+}>, {}>;
+/**
+ * Describes the props of the group: the props of the layout package's group.
+ */
+type GroupProps = ComponentProps<typeof Group>;
+//#endregion
+//#region src/toolbar/anchor.d.ts
+/**
+ * Renders an `a` element with the classes of the library's button.
+ *
+ * @param props - The props of the library's button and the anchor's target.
+ * @returns The `a` element.
+ */
+declare function Anchor(props: ButtonProps): ReactElement;
+//#endregion
+//#region src/toolbar/link.d.ts
+/**
+ * Renders the anchor with the recipe's action class.
+ */
+declare const Linked: import("@stealthscale/theme").StyledComponent<typeof Anchor, {}>;
+/**
+ * Describes the props of a link: its target, whether it is the current page, its icon, its
+ * priority and the props of the library's button.
+ */
+interface LinkProps extends Omit<ItemProps<typeof Linked>, "as" | "href" | "onClick"> {
+  /**
+   * Whether the link is the reader's current page.
+   */
+  readonly current?: boolean | undefined;
+  /**
+   * Target of the link.
+   */
+  readonly href: string;
+  /**
+   * Icon before the words, which a narrow row shows alone.
+   */
+  readonly icon?: ReactNode | undefined;
+  /**
+   * Handler the link or the menu row calls when a reader presses it. React's handler type accepts
+   * a router's anchor handler.
+   */
+  readonly onClick?: MouseEventHandler<HTMLElement> | undefined;
+  /**
+   * Priority that decides how a narrow row folds the link, in place of the one `icon` implies.
+   */
+  readonly priority?: Priority | undefined;
+}
+/**
+ * Renders the link, or nothing while the row folds it into its menu.
+ *
+ * @param props - The target, the current flag, the icon, the priority and the button's props.
+ * @returns The `a` element, or nothing on a narrow row that folds it.
+ */
+declare function Link({ children, current, href, icon, onClick, priority, ...rest }: LinkProps): null | ReactElement;
+//#endregion
+//#region src/toolbar/root.d.ts
+/**
+ * Renders the roving focus root with the recipe's root class.
+ */
+declare const Rowed: import("@stealthscale/theme").StyledComponent<typeof RovingFocus.Root, {
+  readonly radius?: "l1" | "l2" | "l3";
+  readonly size?: import("@stealthscale/theme/authoring").Scale;
+  readonly variant?: "outline" | "plain" | "surface";
+}>;
+/**
+ * Describes the props of the toolbar: its accessible name, the menu's words and mark, the recipe's
+ * variants, the roving focus options and the props of a `div`.
+ */
+interface RootProps extends ComponentProps<typeof Rowed> {
+  /**
+   * The accessible name of the row.
+   */
+  readonly "aria-label": string;
+  /**
+   * Words that name the menu of folded actions. Defaults to `More actions`.
+   */
+  readonly more?: string | undefined;
+  /**
+   * Mark the menu's trigger shows in place of its words.
+   */
+  readonly moreIcon?: ReactNode | undefined;
+}
+/**
+ * Renders the row with its measured width, and the menu while an action is folded.
+ *
+ * @param props - The name, the menu's words and mark, the variants, the roving focus options and
+ *   the props of a `div`.
+ * @returns The `div` element with `role="toolbar"`.
+ */
+declare function Root({ children, more, moreIcon, size, wrap, ...rest }: RootProps): ReactElement;
+//#endregion
+//#region src/toolbar/search.d.ts
+/**
+ * Describes the props of the search: the props of the forms package's search input.
+ */
+type SearchProps = SearchInputProps;
+/**
+ * Renders the field, and on a narrow row the button it folds to.
+ *
+ * @param props - The props of the search input.
+ * @returns The field, the folded button, or both while the search is open.
+ */
+declare function Search({ "aria-label": named, searchIndicator, size, ...rest }: SearchProps): ReactElement;
+//#endregion
+//#region src/toolbar/separator.d.ts
+/**
+ * Renders the vertical divider with the recipe's separator class.
+ */
+declare const Separator: import("@stealthscale/theme").StyledComponent<typeof Divider, {}>;
+/**
+ * Describes the props of the separator: the props of a divider.
+ */
+type SeparatorProps = ComponentProps<typeof Separator>;
+//#endregion
+//#region src/toolbar/start.d.ts
+/**
+ * Renders the `div` with the recipe's start class.
+ */
+declare const Start: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the start band: the props of a `div`.
+ */
+type StartProps = ComponentProps<typeof Start>;
+declare namespace index_d_exports$8 {
+  export { Action, ActionProps, Center, CenterProps, End, EndProps, Group, GroupProps, Item, ItemProps, Link, LinkProps, Root, RootProps, Search, SearchProps, Separator, SeparatorProps, Start, StartProps };
+}
+//#endregion
+export { index_d_exports as ActionBar, index_d_exports$1 as AppShell, index_d_exports$2 as FloatingPanel, index_d_exports$3 as Page, index_d_exports$4 as Section, index_d_exports$5 as Sidebar, index_d_exports$6 as Splitter, index_d_exports$7 as Switcher, index_d_exports$8 as Toolbar };