prime-ui-kit 0.15.0 → 0.17.0

package/dist/{components/modal → internal/overlay}/DialogParts.d.ts

@@ -1,12 +1,16 @@
 /**
- * Shared header / body / footer parts of Modal, Drawer and Sheet. Not exported from the package
- * root: consumers use them as `Modal.*`, `Drawer.*` and `Sheet.*`. The owning content component
- * provides the shell context (ids, close handler, labels, default footer layout).
+ * The dialog of Modal, Drawer and Sheet: one root state, one panel mechanic (`DialogPanel`: the
+ * portal, the scrim and the panel as siblings, the modal layer, the swipe of a sheet, the shell
+ * context) and the shared header / body / footer parts. Not exported from the package root:
+ * consumers use them as `Modal.*`, `Drawer.*` and `Sheet.*`.
  */
 import * as React from "react";
-import type { Tone } from "../../internal/states";
-/** System strings of the built-in «discard changes?» confirm (`Modal.Guard` / `Drawer.Guard dirty`). */
-export type DialogDiscardLabels = {
+import { type SlotPartProps } from "../slot";
+import type { ControlSize, Tone } from "../states";
+/** System strings of a dialog: its close button and the built-in «discard changes?» confirm. */
+export type DialogLabels = {
+    /** `aria-label` of the header close button. */
+    close: string;
     /** Title of the confirm a dismiss of a `dirty` dialog opens. */
     discardTitle: string;
     /** Its description. */
@@ -16,27 +20,44 @@ export type DialogDiscardLabels = {
     /** Its cancel button: back to the form. */
     discardCancel: string;
 };
-export declare const DIALOG_DISCARD_LABELS: DialogDiscardLabels;
+export declare const DIALOG_LABELS: DialogLabels;
 export type DialogRootOptions = {
+    /**
+     * Controlled visibility; together with `onOpenChange`.
+     */
     open?: boolean;
+    /**
+     * Initial visibility, uncontrolled.
+     */
     defaultOpen?: boolean;
+    /**
+     * Called on every open and close: trigger, close button, `Close`, Escape, scrim click, code. A `Guard` holds the dismisses (not code).
+     */
     onOpenChange?: (open: boolean) => void;
+    /**
+     * Escape closes the dialog.
+     */
     closeOnEscape?: boolean;
+    /**
+     * A click on the scrim (and a swipe down, which draws the grab handle) closes the dialog. A destructive action is confirmed in a ConfirmDialog; unsaved changes are held by `Guard`.
+     */
     closeOnOutsideClick?: boolean;
-    closeLabel: string;
-    discardLabels: DialogDiscardLabels;
+    labels?: Partial<DialogLabels>;
     /** Modal only: Enter clicks `Modal.Confirm`. */
     confirmOnEnter?: boolean;
+    /**
+     * Replaces the default Enter confirm (the `Modal.Confirm` click).
+     */
     onEnterConfirm?: (event: KeyboardEvent) => void;
 };
 /** What a `Guard` inside the content holds the dialog to. */
-export type DialogGuardState = {
+type DialogGuardState = {
     /** A request runs: no way to dismiss; the close button is disabled. */
     busy: boolean;
     /** Unsaved changes: a dismiss asks first. */
     dirty: boolean;
 };
-export type DialogRootState = {
+type DialogRootState = {
     open: boolean;
     setOpen: (open: boolean) => void;
     /**
@@ -53,82 +74,64 @@ export type DialogRootState = {
     setConfirmingClose: (open: boolean) => void;
     closeOnEscape: boolean;
     closeOnOutsideClick: boolean;
-    closeLabel: string;
-    discardLabels: DialogDiscardLabels;
+    labels: DialogLabels;
     confirmOnEnter: boolean;
     onEnterConfirm?: (event: KeyboardEvent) => void;
 };
-declare const DialogRootProvider: React.Provider<DialogRootState | null>, useDialogRootContext: () => DialogRootState;
-export { DialogRootProvider, useDialogRootContext };
-/** State of Modal.Root / Drawer.Root: open (controlled or not), the dismiss policy and the guard. */
-export declare function useDialogRoot({ open, defaultOpen, onOpenChange, closeOnEscape, closeOnOutsideClick, closeLabel, discardLabels, confirmOnEnter, onEnterConfirm, }: DialogRootOptions): DialogRootState;
+declare const DialogRootProvider: React.Provider<DialogRootState | null>;
+export { DialogRootProvider };
+/**
+ * State of Modal.Root / Drawer.Root / Sheet.Root: open (controlled or not), the dismiss policy, the
+ * labels and the guard.
+ */
+export declare function useDialogRoot({ open, defaultOpen, onOpenChange, closeOnEscape, closeOnOutsideClick, labels: labelsProp, confirmOnEnter, onEnterConfirm, }: DialogRootOptions): DialogRootState;
 /**
- * Registers a guard from inside the content (`Modal.Guard`, `Drawer.Guard`, ConfirmDialog while it
- * runs); it is lifted when the part unmounts.
+ * Registers a guard from inside the content (`Modal.Guard`, `Drawer.Guard`, `Sheet.Guard`,
+ * ConfirmDialog while it runs); it is lifted when the part unmounts.
  */
 export declare function useDialogGuard({ busy, dirty }: DialogGuardState): DialogRootState;
+/** Footer actions: `fill` — equal-width buttons in one row; `end` — auto-width, right-aligned. */
+type DialogFooterLayout = "fill" | "end";
 /**
- * The modal layer of a Modal / Drawer panel: Escape and scrim clicks ask to close per the Root's
- * `closeOnEscape` / `closeOnOutsideClick` (and its guard); focus returns to the opener
- * (foundation §8).
+ * When the panel is a bottom sheet that swipes down to close: `never` (Drawer, a Modal near the
+ * top), `compact` (a centred Modal on a viewport below 640px), `always` (Sheet).
  */
-export declare function useDialogLayer<T extends HTMLElement>({ open, requestClose, closeOnEscape, closeOnOutsideClick, }: DialogRootState): {
-    onClose: () => void;
-    ref: React.RefObject<T | null>;
-    layer: import("../../internal/overlay/layerStack").LayerEntry;
-};
+type DialogSwipe = "never" | "compact" | "always";
 /**
- * The content of a closing dialog: while the exit motion plays it keeps showing the last children
- * it had open, so a record cleared together with `open` does not empty the panel mid-motion.
+ * Which dialog the panel is: it picks the side padding of the zones (`--prime-<kind>-padding`) and
+ * the enter / exit motion while the panel is not a bottom sheet (a drawer slides from its side).
  */
-export declare function useExitSnapshot<T>(open: boolean, children: T): T;
-/** Class for the `role="dialog"` element: hairline tokens and the `prime-dialog` container. */
-export declare const dialogShellClassName: string;
-/** Footer actions: `fill` — equal-width buttons in one row; `end` — auto-width, right-aligned. */
-export type DialogFooterLayout = "fill" | "end";
-type DialogShellContextValue = {
-    titleId: string;
-    descriptionId: string;
-    hasDescription: boolean;
-    registerTitle: (present: boolean) => void;
-    registerDescription: (present: boolean) => void;
-    onClose: () => void;
-    closeLabel: string;
-    /** The guard is busy: the close button stays in place, disabled. */
-    busy: boolean;
+type DialogKind = "modal" | "drawer" | "sheet";
+type DialogPanelProps = React.HTMLAttributes<HTMLDivElement> & {
+    kind: DialogKind;
+    /** The component's own panel class: its geometry and width tiers. */
+    panelClassName: string;
+    swipe: DialogSwipe;
     footerLayout: DialogFooterLayout;
-    /** Enter-confirm target (Modal only). */
-    confirmRef?: React.MutableRefObject<HTMLElement | null>;
-};
-type UseDialogShellOptions = {
-    ariaLabel?: string;
-    ariaLabelledBy?: string;
-    ariaDescribedBy?: string;
-    onClose: () => void;
-    closeLabel: string;
-    busy: boolean;
-    footerLayout: DialogFooterLayout;
-    confirmRef?: React.MutableRefObject<HTMLElement | null>;
-};
-/** Builds the shell context and the resolved `aria-*` for the `role="dialog"` element. */
-export declare function useDialogShellValue({ ariaLabel, ariaLabelledBy, ariaDescribedBy, onClose, closeLabel, busy, footerLayout, confirmRef, }: UseDialogShellOptions): {
-    value: DialogShellContextValue;
-    aria: {
-        "aria-label": string | undefined;
-        "aria-labelledby": string | undefined;
-        "aria-describedby": string | undefined;
-    };
+    /** Portal target. Default `document.body`. */
+    container?: HTMLElement | null;
+    /** Class on the full-screen scrim. */
+    overlayClassName?: string;
+    /** Enter clicks the action in `Confirm` (Modal: per the Root's `confirmOnEnter`). */
+    enterConfirm?: boolean;
+    /** The tier of the controls inside (Modal: `m`); without it they keep the surrounding tier. */
+    controlSize?: ControlSize;
+    ref?: React.Ref<HTMLDivElement>;
 };
-export declare function DialogShellProvider({ value, children, }: {
-    value: DialogShellContextValue;
-    children: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
+/**
+ * The panel of a dialog: portaled while open and during its exit motion (showing the children it
+ * had open), the scrim and the `role="dialog"` panel side by side, the modal layer (Escape and the
+ * scrim ask the Root to close through its guard; focus returns to the opener, foundation §8), and
+ * on a bottom sheet the grab handle and the swipe down — a guarded swipe asks first.
+ */
+export declare function DialogPanel({ container, children, ...props }: DialogPanelProps): import("react/jsx-runtime").JSX.Element | null;
 export type DialogIconProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> & {
-    /** Soft fill + text color of the role. Default `neutral`. Not used around a picture. */
+    /**
+     * Soft fill and icon color; not used around a picture.
+     */
     tone?: Tone;
     /**
-     * An `Icon` in a filled box of the role, or the record's picture — an `Avatar.Root` (sized to
-     * the box) or a `Thumbnail.Root` — with no box of its own.
+     * An `Icon` (sized to the m icon), or the record's picture: an `Avatar.Root` (sized to the tile) or a `Thumbnail.Root`.
      */
     children: React.ReactNode;
     ref?: React.Ref<HTMLSpanElement>;
@@ -153,8 +156,7 @@ export declare namespace DialogDescription {
 }
 export type DialogHeaderProps = React.HTMLAttributes<HTMLElement> & {
     /**
-     * Built-in close button (square ghost `s`, `labels.close`). Default `true`. While a `Guard` is
-     * `busy` it stays in place, disabled.
+     * Built-in square ghost `s` close button named by `labels.close`; disabled in place while a `Guard` is `busy`.
      */
     showClose?: boolean;
     ref?: React.Ref<HTMLElement>;
@@ -187,7 +189,9 @@ export declare namespace DialogBody {
     var displayName: string;
 }
 export type DialogFooterProps = React.HTMLAttributes<HTMLElement> & {
-    /** `fill` — equal-width buttons; `end` — auto width, right-aligned. Default depends on the container. */
+    /**
+     * `fill`: equal-width buttons in one row; `end`: auto width, at the end. Stacked on phones (viewport below 640 px) and in a dialog narrower than 360 px.
+     */
     layout?: DialogFooterLayout;
     ref?: React.Ref<HTMLElement>;
 };
@@ -207,21 +211,13 @@ export declare function DialogMeta({ className, ...rest }: DialogMetaProps): imp
 export declare namespace DialogMeta {
     var displayName: string;
 }
-type SlotChild = React.ReactElement<{
-    onClick?: React.MouseEventHandler;
-    ref?: React.Ref<HTMLElement>;
-}>;
-export type DialogTriggerProps = {
-    children: SlotChild;
-};
+export type DialogTriggerProps = SlotPartProps;
 /** Adds "open the dialog" to the child's click (unless the child prevents default). */
 export declare function DialogTrigger({ children }: DialogTriggerProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace DialogTrigger {
     var displayName: string;
 }
-export type DialogCloseProps = {
-    children: SlotChild;
-};
+export type DialogCloseProps = SlotPartProps;
 /**
  * Adds "close the dialog" to the child's click (unless the child prevents default); the close
  * goes through the guard, and the child is `disabled` while the guard is busy.
@@ -230,10 +226,11 @@ export declare function DialogClose({ children }: DialogCloseProps): import("rea
 export declare namespace DialogClose {
     var displayName: string;
 }
-export type DialogConfirmProps = {
-    children: SlotChild;
-};
-/** Marks the primary action: Enter inside the dialog clicks it (`confirmOnEnter`). */
+export type DialogConfirmProps = SlotPartProps;
+/**
+ * Marks the primary action as the Enter target (`confirmOnEnter`): Enter inside the dialog clicks
+ * it. It adds no handler of its own; the child's `onClick` (or its `type="submit"`) is the action.
+ */
 export declare function DialogConfirm({ children }: DialogConfirmProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace DialogConfirm {
     var displayName: string;

package/dist/internal/overlay/FloatingPanel.d.ts

@@ -1,7 +1,22 @@
 import type * as React from "react";
+import { type SwipeDismiss } from "../../hooks/useSwipeDismiss";
 import type { ControlSize } from "../states";
 import type { FloatingLayer } from "./useFloatingLayer";
-export type FloatingPanelProps = Omit<React.HTMLAttributes<HTMLElement>, "onAnimationEnd"> & {
+/**
+ * The grab bar of a bottom sheet (Sheet, a Modal or a floating layer as a phone sheet): drawn only
+ * while the swipe exists, `aria-hidden` (the gesture is an extra way out next to Escape and the
+ * scrim). The drag starts on it or on the header right after it.
+ */
+export declare function SheetHandle({ swipe }: {
+    swipe: Pick<SwipeDismiss, "enabled">;
+}): import("react/jsx-runtime").JSX.Element | null;
+/** How wide an anchored panel is (`data-width` on the floating surface). */
+export type FloatingWidth = "auto" | "trigger" | "min-trigger" | "content";
+/**
+ * The panel is a `<div>`; `E` is the element type its consumer holds it as (a menu, a listbox:
+ * `HTMLElement`), so the consumer ref needs no cast.
+ */
+type FloatingPanelProps<E extends HTMLElement = HTMLDivElement> = Omit<React.HTMLAttributes<HTMLDivElement>, "onAnimationEnd"> & {
     floating: FloatingLayer;
     /** Tier of the panel (`data-size`) and of the controls inside. */
     size: ControlSize;
@@ -9,7 +24,13 @@ export type FloatingPanelProps = Omit<React.HTMLAttributes<HTMLElement>, "onAnim
     scroll?: boolean;
     /** The raised floating surface (radius, shadow, fill). Default `true`. */
     surface?: boolean;
-    ref?: React.Ref<HTMLElement>;
+    /**
+     * `auto` — the content's width between the panel minimum (or the trigger's width) and twice the
+     * minimum; `trigger` — exactly the trigger's width; `content` — what the content needs, within
+     * the viewport. A bottom sheet is always full width.
+     */
+    width?: FloatingWidth;
+    ref?: React.Ref<E>;
 };
 /**
  * The panel of a floating layer: portaled to `<body>` when it opens (so it stacks above every
@@ -17,10 +38,10 @@ export type FloatingPanelProps = Omit<React.HTMLAttributes<HTMLElement>, "onAnim
  * `data-side` (foundation §8), a size context for the controls inside, and a layer context so
  * layers opened inside stack above it in the layer stack. Renders nothing while closed. A layer in
  * sheet mode (`floating.sheet`) renders a scrim and a bottom sheet with a grab handle around the
- * same panel element; the consumer ref stays on the panel.
+ * same panel element, which then carries `data-sheet`; the consumer ref stays on the panel.
  */
-export declare function FloatingPanel({ floating, size, scroll, surface, className, onKeyDown, children, ref, ...rest }: FloatingPanelProps): import("react/jsx-runtime").JSX.Element | null;
-export type FloatingTriggerProps = {
+export declare function FloatingPanel<E extends HTMLElement = HTMLDivElement>({ floating, size, scroll, surface, width, className, onKeyDown, children, ref, ...rest }: FloatingPanelProps<E>): import("react/jsx-runtime").JSX.Element | null;
+type FloatingTriggerProps = {
     /** Props of the layer for its trigger: `ref`, ARIA, handlers, `data-state`. */
     triggerProps: Record<string, unknown> & {
         ref?: React.Ref<HTMLElement>;
@@ -34,3 +55,4 @@ export type FloatingTriggerProps = {
  * `aria-describedby` ids join, the child's own props win.
  */
 export declare function FloatingTrigger({ triggerProps, children, ...forwarded }: FloatingTriggerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/internal/overlay/ModalDialog.d.ts

@@ -0,0 +1,59 @@
+import type * as React from "react";
+import { type ControlSize } from "../states";
+import { type DialogLabels, type DialogRootOptions } from "./DialogParts";
+export type ModalLabels = DialogLabels;
+export type ModalRootProps = Omit<DialogRootOptions, "labels" | "confirmOnEnter"> & {
+    /**
+     * Escape closes the dialog.
+     */
+    closeOnEscape?: boolean;
+    /**
+     * A click on the scrim (and a swipe down, which draws the grab handle) closes the dialog. A destructive action is confirmed in a ConfirmDialog; unsaved changes are held by `Guard`.
+     */
+    closeOnOutsideClick?: boolean;
+    /**
+     * Enter inside the dialog clicks the element wrapped in `Modal.Confirm`; Enter on a button, link, `textarea`, `select`, checkbox or in the header keeps its own meaning.
+     */
+    confirmOnEnter?: boolean;
+    /**
+     * Replaces the default Enter confirm (the `Modal.Confirm` click).
+     */
+    onEnterConfirm?: (event: KeyboardEvent) => void;
+    /**
+     * Built-in strings, see Labels.
+     */
+    labels?: Partial<ModalLabels>;
+    /**
+     * Trigger and Content.
+     */
+    children?: React.ReactNode;
+};
+export declare function ModalRoot({ confirmOnEnter, children, ...options }: ModalRootProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ModalRoot {
+    var displayName: string;
+}
+/** Where the dialog stands: centred, or near the top (a palette whose list grows downward). */
+export type ModalPlacement = "center" | "top";
+export type ModalContentProps = React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Width: 360 · 440 · 560 · 720 · 960.
+     */
+    size?: ControlSize;
+    /**
+     * `center`: in the middle; on a phone a bottom sheet that swipes down (`closeOnOutsideClick`). `top`: near the top edge at every width, growing downward — a search palette above the on-screen keyboard.
+     */
+    placement?: ModalPlacement;
+    /**
+     * Portal target.
+     */
+    container?: HTMLElement | null;
+    /**
+     * Class on the scrim.
+     */
+    overlayClassName?: string;
+    ref?: React.Ref<HTMLDivElement>;
+};
+export declare function ModalContent({ size, placement, ...props }: ModalContentProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ModalContent {
+    var displayName: string;
+}

package/dist/internal/overlay/focus.d.ts

@@ -7,25 +7,50 @@ export declare function getFocusable(container: HTMLElement): HTMLElement[];
 export declare function hasNativeTabStop(el: HTMLElement): boolean;
 /**
  * Moves focus into a layer that just opened, unless focus is already inside (a child `autoFocus`):
- * `[data-autofocus]`, else the first tab stop, else the container itself.
+ * the first match of `first` (a menu's first enabled item, which is no tab stop of its own), else
+ * `[data-autofocus]`, else the first tab stop, else the container itself. `quiet` — a pointer
+ * opened the layer: focus lands without the focus ring until the person turns to the keyboard.
  */
-export declare function focusInto(container: HTMLElement): void;
+export declare function focusInto(container: HTMLElement, first?: string, quiet?: boolean): void;
 /**
  * Focuses `el` when it is still in the document. `quiet` — the layer was opened with a pointer:
  * focus returns without the focus ring, also when a key (Escape) closed the layer; the next key
- * brings the ring back.
+ * brings the ring back. When `el` is gone (the row that opened a menu was deleted), focus goes to
+ * the first tab stop of the page instead, so it is never lost and the next Tab starts from a known
+ * place.
  */
 export declare function focusBack(el: HTMLElement | null | undefined, quiet?: boolean): void;
-/** Who opened a layer, to return focus to on close, and whether a pointer did it. */
+/**
+ * Hands focus from a part that is about to leave to the part that takes its place (a region that
+ * swaps state, a dismissed message, an item moved to another place): only when `leaving` holds
+ * focus, or held it and is already gone with focus lost to the body. `next` is focused itself when
+ * it is a tab stop; a container gets focus on its `[data-autofocus]`, else its first tab stop,
+ * else itself (made programmatically focusable, `tabindex="-1"`). Without a `next` in the document,
+ * focus goes to the first tab stop of the page. Returns whether focus moved.
+ */
+export declare function handoffFocus(leaving: Element | null | undefined, next: HTMLElement | null | undefined): boolean;
+/**
+ * The tab stop that takes the place of `el` when it leaves the page (a dismissed banner, a closed
+ * toast): the first one after it in document order, else the last one before it. Tab stops inside
+ * `el` do not count.
+ */
+export declare function tabStopBeside(el: Element): HTMLElement | null;
+/**
+ * Who opened a layer, to return focus to on close: `element` — the control (or the focused
+ * element); `target` — the exact element a press landed on (a picture inside a link, for a layer
+ * that grows out of it), `null` after a key; `byPointer` — a pointer did it.
+ */
 export type Opener = {
     element: HTMLElement | null;
+    target: Element | null;
     byPointer: boolean;
 };
 /**
  * The opener of a layer, read while rendering the open transition (before a child `autoFocus`
  * moves focus in). After a press: the control pressed — a click leaves focus elsewhere in Safari
- * (the body, or a `tabindex="-1"` region around the button) — and `byPointer`, so focus goes
- * back without a focus ring. After a key: the focused element, and the ring shows.
+ * (the body, or a `tabindex="-1"` region around the button) — the element pressed, and
+ * `byPointer`, so focus goes back without a focus ring. After a key: the focused element, and the
+ * ring shows.
  */
 export declare function captureOpener(): Opener;
 /**

package/dist/internal/overlay/layerStack.d.ts

@@ -1,7 +1,9 @@
 import * as React from "react";
 /**
- * The one stack of open overlay layers (foundation §8 "Overlay contract"): Modal, Drawer, the
- * off-canvas Sidebar, CommandMenu, Popover, Dropdown, Select, TagSelect, Tooltip. One set of
+ * The one stack of open overlay layers (foundation §8 "Overlay contract"): Modal, ConfirmDialog,
+ * Drawer, Sheet, CommandMenu, MediaViewer, the off-canvas Sidebar (through `useModalLayer`),
+ * Popover, Dropdown, Tooltip, the Select, TagSelect, Datepicker and ColorPresets panels, the
+ * reaction bar of a Message and the chart tooltip (through `useFloatingLayer`). One set of
  * document listeners serves every layer and only the topmost layer reacts, so one Escape or one
  * press outside closes one layer, and a press inside a nested (portaled) child layer never reaches
  * its parent. The owner gets the reason and decides about focus.
@@ -16,9 +18,9 @@ export type DismissReason = "escape" | "outside" | "scrim";
  * - `none` — the layer takes no part in presses or Tab (Tooltip); it still gets Escape first.
  *
  * A layer that opts out of outside dismissal (`closeOnOutsideClick={false}`) keeps `pointerdown` /
- * `click` and ignores the reason, so it still blocks the layers below it.
+ * `click`; its hook drops the reason, so it still blocks the layers below it.
  */
-export type OutsideDismiss = "pointerdown" | "click" | "none";
+type OutsideDismiss = "pointerdown" | "click" | "none";
 export type LayerEntry = {
     /** The layer that rendered this one (context): it stays below its descendants. */
     parent: LayerEntry | null;
@@ -31,7 +33,7 @@ export type LayerEntry = {
 };
 /** Wrap a layer's content: layers opened inside it register as its descendants. */
 export declare const LayerProvider: React.Provider<LayerEntry | null>;
-export type UseLayerOptions = Omit<LayerEntry, "parent" | "trap"> & {
+type UseLayerOptions = Omit<LayerEntry, "parent" | "trap"> & {
     trap?: boolean;
 };
 /**
@@ -39,3 +41,4 @@ export type UseLayerOptions = Omit<LayerEntry, "parent" | "trap"> & {
  * re-registration on a new callback). Wrap the layer's content in `<LayerProvider value={layer}>`.
  */
 export declare function useLayer(open: boolean, options: UseLayerOptions): LayerEntry;
+export {};

package/dist/internal/overlay/useAnchorName.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+type AnchorName = {
+    "aria-labelledby"?: string;
+    "aria-label"?: string;
+};
+/**
+ * The accessible name of a floating panel without a heading of its own (a menu, a popover with no
+ * Title): the control it opened from — the trigger, or the control inside an anchor (the menu
+ * button under `Popover.Anchor`, a row under `Dropdown.Anchor`) — by its id when it has one, else
+ * by its `aria-label`, else by its text. Read from the DOM while open, never guessed: a child's own id wins over the
+ * one the trigger was given. `named` — the panel has a heading that names it: nothing is read.
+ */
+export declare function useAnchorName(open: boolean, named: boolean, anchorRef: React.RefObject<HTMLElement | null>): AnchorName;
+export {};

package/dist/internal/overlay/useContainScroll.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The wheel over an open anchored panel does not scroll the page under it; scrolling areas inside
+ * it (a list, the panel itself when it overflows) work as usual. `overscroll-behavior: contain` is
+ * not enough: it only holds while the panel overflows, and a panel that fits chains the wheel to
+ * the page. `panel` is the boundary; `null` turns it off.
+ */
+export declare function useContainScroll(panel: HTMLElement | null): void;

package/dist/internal/overlay/useFloatingLayer.d.ts

@@ -1,23 +1,28 @@
 import * as React from "react";
 import { type PositionOptions, type PositionSide } from "../../hooks/usePosition";
-import { type MotionDurationToken, type Presence } from "../../hooks/usePresence";
+import { type Presence } from "../../hooks/usePresence";
+import { type SwipeDismiss } from "../../hooks/useSwipeDismiss";
+import type { MotionDurationToken } from "../motionTiming";
 import { type LayerEntry } from "./layerStack";
-export type UseFloatingLayerOptions = PositionOptions & {
+type UseFloatingLayerOptions = PositionOptions & {
     open: boolean;
     onOpenChange: (open: boolean) => void;
     /** The anchor: positions the panel, is not "outside", and gets focus back on close. */
     triggerRef: React.RefObject<HTMLElement | null>;
-    /** Escape closes the panel. Default `true`. */
-    closeOnEscape?: boolean;
-    /** A press outside the panel and its trigger closes it. Default `true`. */
-    closeOnOutsideClick?: boolean;
+    /** Escape closes the panel (a passive layer passes `true`: Escape always hides it). */
+    closeOnEscape: boolean;
+    /** A press outside the panel and its trigger, or a swipe down on its sheet, closes it. */
+    closeOnOutsideClick: boolean;
     /**
      * `pointerdown` (default) — a regular floating panel. `none` — a passive layer (Tooltip): no
      * part in presses or Tab, no focus restore; Escape still closes it first.
      */
     dismiss?: "pointerdown" | "none";
-    /** Focus moves into the panel on open (`[data-autofocus]` → first tab stop → the panel). */
-    focusOnOpen?: boolean;
+    /**
+     * Focus moves into the panel on open: `true` — `[data-autofocus]` → first tab stop → the panel;
+     * a selector — its first match first (a menu's first enabled item, which is no tab stop).
+     */
+    focusOnOpen?: boolean | string;
     /** Tab cycles inside the panel. */
     trap?: boolean;
     /**
@@ -46,8 +51,8 @@ export type FloatingLayer = {
     side: PositionSide;
     /** Rendered as a bottom sheet (`sheet` on a narrow viewport). */
     sheet: boolean;
-    /** Swipe-to-close of the sheet; part of the sheet's `onPointerDown`. */
-    onSheetPointerDown: (event: React.PointerEvent<HTMLElement>) => void;
+    /** Swipe-to-close of the sheet: its handle shows while `enabled`; part of the sheet's props. */
+    swipe: SwipeDismiss;
     /** Attach to the panel element (merged with a consumer ref). */
     panelRef: React.RefCallback<HTMLElement>;
     /** The panel element while mounted. */
@@ -62,9 +67,33 @@ export type FloatingLayer = {
     onKeyDown: (event: React.KeyboardEvent<HTMLElement>) => void;
 };
 /**
- * The one floating-layer primitive: Popover, Dropdown, Tooltip, Select and TagSelect. Presence
- * (exit animation), positioning against the trigger, a place in the layer stack and one focus
- * policy (foundation §8): focus returns to the trigger after Escape, a pick, Tab or a close — not
- * after a press outside, where focus follows the pointer. Render the panel with `FloatingPanel`.
+ * The one floating-layer primitive: Popover, Dropdown, Tooltip, Select, TagSelect, the reaction
+ * bar of a Message and the chart tooltip. Presence (exit animation), positioning against the
+ * trigger, a place in the layer stack with the dismiss options applied inside, the wheel kept off
+ * the page under the panel, and one focus policy (foundation §8): focus returns to the trigger
+ * after Escape, a pick, Tab or a close — not after a press outside, where focus follows the
+ * pointer. Render the panel with `FloatingPanel`.
  */
 export declare function useFloatingLayer({ open, onOpenChange, triggerRef, closeOnEscape, closeOnOutsideClick, dismiss, focusOnOpen, trap, tabExit, exitDuration, skipExit, sheet: sheetOption, ...positionOptions }: UseFloatingLayerOptions): FloatingLayer;
+type FloatingTriggerStateOptions = {
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    /**
+     * ArrowDown and ArrowUp on the trigger open a closed layer, as on a menu button or a picker
+     * (WAI-ARIA); Enter and Space open it as the trigger's click.
+     */
+    openOnArrow?: boolean;
+};
+/**
+ * The props of a floating layer's trigger that follow its open state: `aria-expanded`,
+ * `data-state`, the click that toggles the layer, and with `openOnArrow` the arrow keys that open
+ * it. Merged onto the consumer's element by `FloatingTrigger` (the element's own handlers run
+ * first; `preventDefault()` in them skips these).
+ */
+export declare function floatingTriggerProps({ open, setOpen, openOnArrow, }: FloatingTriggerStateOptions): {
+    onKeyDown?: ((event: React.KeyboardEvent<HTMLElement>) => void) | undefined;
+    "aria-expanded": boolean;
+    "data-state": string;
+    onClick: () => void;
+};
+export {};

package/dist/internal/overlay/useOpenState.d.ts

@@ -0,0 +1,22 @@
+type UseOpenStateOptions = {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * The owner is out of action (a disabled field): the layer is closed whatever `open` /
+     * `defaultOpen` say, and nothing opens it; it opens again by itself once enabled, when its open
+     * state still says so.
+     */
+    disabled?: boolean;
+};
+type OpenState = readonly [
+    open: boolean,
+    setOpen: (next: boolean | ((open: boolean) => boolean)) => void
+];
+/**
+ * The open triad of an overlay (`open` / `defaultOpen` / `onOpenChange`), controlled or not, with
+ * the disabled gate every overlay owner shares: a disabled owner renders closed and ignores a
+ * request to open; a request to close always goes through.
+ */
+export declare function useOpenState({ open, defaultOpen, onOpenChange, disabled, }: UseOpenStateOptions): OpenState;
+export {};

package/dist/internal/partPresence.d.ts

@@ -0,0 +1,31 @@
+import * as React from "react";
+type PartPresenceOptions = {
+    /**
+     * Whether the host shows the part now. It enters when this turns on after the host's first
+     * render; on the first render it is just there.
+     */
+    present?: boolean;
+    /** The axis the part closes up along when it leaves (`leaveInPlace`). */
+    axis: "inline" | "block";
+};
+type PartPresence<E extends HTMLElement> = {
+    /** The part's ref: on unmount, whatever caused it, the part closes up in place. */
+    ref: React.RefCallback<E>;
+    /** The part's enter class (`enterMotion.enter`) while it is a part that arrived. */
+    className: string | undefined;
+};
+/**
+ * Presence of an optional part that comes and goes while its host stays (a clear button, a chip
+ * row, a remove segment, a change badge): it rises in when it appears (`enterMotion`; the host
+ * tunes it with `--enter-*`) and closes up in place when it goes (`leaveInPlace`), so the parts
+ * around it glide instead of jumping. Called by the host that owns the condition; spread the
+ * result on the part:
+ *
+ *   const clear = usePartPresence<HTMLButtonElement>({ present: hasValue, axis: "inline" });
+ *   {hasValue ? <button ref={clear.ref} className={cx(styles.clear, clear.className)} /> : null}
+ *
+ * A part that unmounts itself (a chip removed from a list) passes no `present`: only its exit
+ * plays. Reduced motion: the part appears with the fade only and leaves at once.
+ */
+export declare function usePartPresence<E extends HTMLElement>({ present, axis, }: PartPresenceOptions): PartPresence<E>;
+export {};