elements-kit 0.27.4 → 0.27.6

package/dist/ui/overlay/index.d.mts

@@ -1,383 +1,268 @@
-import { Placement } from "@floating-ui/dom";
+import { r as MaybeReactive } from "../../index-BSAqa0-0.mjs";
+import { t as Direction } from "../../direction-EwIAAn1f.mjs";
 
-//#region src/ui/overlay/constraint.d.ts
-/**
- * The constraint — one of the two spatial primitives (with the anchor).
- * A `Region` is a reactive rect; `constraint()` builds one from an
- * element, a plain rect, or nothing (the live viewport). `confine()`
- * applies a region to an overlay by syncing it into the
- * `--overlay-constraint-top/-left/-width/-height` channels every location
- * clamp and gesture bound derives from (declared in index.css with
- * viewport defaults). Derived values build on regions — `detents()`
- * quantizes one, `rubber()` resists at its edges.
- */
-/** A reactive rect. `createElementRect` returns one reactive `DOMRect`,
- * so the element branch projects its fields onto this shape; custom
- * rects (a static region, a virtual area) can be supplied too. */
-interface Region {
-  top(): number;
-  left(): number;
-  width(): number;
-  height(): number;
+//#region src/ui/overlay/box.d.ts
+/** The channel axes a box value moves along. */
+type Axis = keyof ReadonlyBox;
+interface IDirection {
+  readonly direction: "ltr" | "rtl";
 }
-/** A plain rect a `Region` can be built from. */
-interface RectInit {
-  top: number;
-  left: number;
-  width: number;
-  height: number;
+interface ReadonlyBox {
+  readonly x: number;
+  readonly y: number;
+  readonly w: number;
+  readonly h: number;
 }
-/**
- * Builds a {@link Region}: from an `Element` (observed via
- * `ResizeObserver` through `createElementRect`; cleanup routes through
- * the current scope), from a plain rect (static), or with no argument —
- * the live viewport (read at call time, not observed).
- */
-declare function constraint(source?: Element | RectInit): Region;
-interface OverlayConstraint {
-  dispose(): void;
+interface Box extends ReadonlyBox {
+  x: number;
+  y: number;
+  w: number;
+  h: number;
+}
+declare class WindowBox implements ReadonlyBox, IDirection {
+  get x(): number;
+  get y(): number;
+  get w(): number;
+  get h(): number;
+  get direction(): Direction;
+}
+declare const WINDOW_BOX: WindowBox;
+declare class ElementBox implements ReadonlyBox {
+  #private;
+  constructor(el: MaybeReactive<Element>);
   [Symbol.dispose](): void;
+  get x(): number;
+  get y(): number;
+  get w(): number;
+  get h(): number;
 }
-/**
- * Resolves a custom property holding a length to pixels. Plain `px` values
- * parse directly; anything else (`svh` / `calc()` / fractions of the
- * constraint) resolves natively by measuring a hidden probe. `fallback` is
- * a CSS length expression used when the property is unset.
- */
-declare function resolveVarPx(overlay: HTMLElement, name: string, axis: "height" | "width", fallback?: string): number;
-/** Resolves the constraint rect every gesture bound derives from. */
-declare function resolveConstraint(overlay: HTMLElement): {
+//#endregion
+//#region src/ui/overlay/area.d.ts
+/** Which of a box's points sits on a pin: its lo edge, hi edge, or middle. */
+type Align = "start" | "end" | "center";
+/** One axis of a region: a coordinate and the box point that sits on it,
+ * or `null` — the axis is free and the box keeps its own coordinate. */
+type Pin = {
+  readonly align: Align;
+  readonly at: number;
+} | null;
+/** A pinned block edge and its coordinate. */
+type BlockEdge = {
   top: number;
+  bottom?: never;
+} | {
+  bottom: number;
+  top?: never;
+};
+/** A pinned inline edge and its coordinate. */
+type InlineEdge = {
   left: number;
-  width: number;
-  height: number;
+  right?: never;
+} | {
+  right: number;
+  left?: never;
+};
+/** Neither block edge pinned — the axis is free. */
+type NoBlock = {
+  top?: never;
+  bottom?: never;
+};
+/** Neither inline edge pinned — the axis is free. */
+type NoInline = {
+  left?: never;
+  right?: never;
 };
 /**
- * Confines an overlay to a {@link Region} by syncing it into the
- * `--overlay-constraint-*` variables. Every location clamp and gesture
- * bound derives from those variables, so the overlay re-clamps when the
- * region changes.
- *
- * Caveat: an element region observes size changes (`ResizeObserver`) — a
- * container that moves without resizing (e.g. page scroll) does not
- * retrigger the sync.
- *
- * Registers its cleanup with the current scope (`onCleanup`) and also
- * returns it as `dispose` / `Symbol.dispose`; disposing removes the
- * variables, restoring the viewport constraint.
- *
- * @example
- * ```ts
- * import { constraint, confine } from "elements-kit/ui/overlay";
- *
- * const panel = document.querySelector("dialog.x-overlay")!;
- * confine(panel, constraint(document.querySelector("main")!));
- * ```
- */
-declare function confine(overlay: HTMLElement, region: Region): OverlayConstraint;
-//#endregion
-//#region src/ui/overlay/anchor.d.ts
-/**
- * The anchor — one of the two spatial primitives (with the constraint).
- * `anchor(overlay, follow?)` gives the overlay an anchor ELEMENT it
- * follows for its whole life; the anchor element follows `follow` until
- * something else moves it (a `draggable()` service, author code). The
- * overlay itself has no states — dragging, tearing off, re-pinning are
- * all things that happen to the anchor.
- *
- * Two engines, chosen once at wire time, never switched:
- *
- * - Native CSS anchor positioning (compound gate, no `within`/`arrow`):
- *   the overlay's `position-anchor` points at the anchor element; when
- *   `follow` is an element the anchor pins itself to it through a second
- *   native hop (`[data-follow]` rule in index.css mirrors the followed
- *   box via `anchor()`/`anchor-size()`). Placement, flip and scroll
- *   tracking are compositor-side through both hops — zero JS.
- * - Floating UI (below the gate, or `within`/`arrow` requested — native
- *   CSS has no boundary control and no flip signal): `autoUpdate` writes
- *   the box center into the `--overlay-x`/`-y` channels while the
- *   overlay is open; a `dragmove` event from the drag service triggers
- *   an immediate reposition. The initial positioning write is instant;
- *   geometry transitions re-enable after it (Base UI's `data-instant`
- *   semantics), so re-pins and live area changes morph by the
- *   stylesheet. During an anchor drag, writes suppress geometry
- *   transitions again — the overlay must not ease behind the finger.
- *
- * `data-anchor="element"` is a static wiring marker (stamped here,
- * removed on dispose, never toggled). `data-placed` is output state —
- * the settled side, feeding the arrow and `transform-origin` (a hint
- * from `--overlay-area` under the native engine, the real side under
- * Floating UI). A first pointer-down from `draggable()` tears the
- * follow pin (the `data-follow` contract); a fresh open re-pins.
- */
-interface AnchorOptions {
-  /** Flip/shift boundary — placement confined to this region instead of
-   * the viewport. Forces the Floating UI engine. */
-  within?: Region;
-  /** Caret pointing at the anchor (`.x-overlay-arrow`, injected when not
-   * authored; a number sets `--overlay-arrow-size` in px). Forces the
-   * Floating UI engine. */
-  arrow?: number | boolean;
-}
-/**
- * Maps a `position-area` value to the Floating UI placement. Spanning
- * toward an edge leaves the box flush with the *opposite* edge, so
- * `span-*-end` is a `-start` alignment (and vice versa) — Floating UI
- * resolves `-start`/`-end` logically, so the span tokens need no dir
- * check; only the physical inline sides do. Unknown values fall back to
- * `bottom` (the CSS default, `block-end`).
+ * A corner (one edge pinned on each axis: a tooltip, a popover) or a side
+ * (one edge, the other axis free: a bottom sheet). Never empty, and never
+ * both edges of one axis.
  */
-declare function areaToPlacement(area: string, rtl?: boolean): Placement;
+type Boundary = (BlockEdge & InlineEdge) | (BlockEdge & NoInline) | (NoBlock & InlineEdge);
 /**
- * Gives `overlay` its anchor element and returns it. The overlay follows
- * the anchor for life; the anchor follows `follow` (element or rect)
- * until something moves it. Pass the returned element to `draggable()`
- * to make the composition tearable — dragging moves the anchor.
- *
- * `follow` may be a getter reading a signal — re-pinning on change is
- * how a shared popover slides between nav triggers: the native chain
- * glides there on the anchor element's CSS transition; the channel
- * engine lets that one write animate.
- *
- * Registers all cleanup with the current scope (`onCleanup`): the anchor
- * element, the wiring, and the stamped attributes are removed together.
- *
- * @example
- * ```ts
- * import { anchor, draggable, rubber } from "elements-kit/ui/overlay";
+ * Somewhere a box may go: a semi-bounded plane, each axis pinned or free.
+ * `place` is the only operation: it never writes, so the caller picks which
+ * channels to take — `box.x = region.place(box).x` moves one axis and leaves
+ * the rest. The box is placed as given: one larger than its room overflows
+ * rather than shrinks, as CSS does.
  *
- * const a = anchor(panel, trigger);
- * draggable(a, undefined, rubber()).attach(panel);
- *
- * // shared nav popover — re-anchors (and glides) when the signal changes
- * const active = signal(firstTrigger);
- * anchor(menu, () => active(), { arrow: true });
- * ```
- */
-declare function anchor(overlay: HTMLElement, follow?: Element | RectInit | (() => Element | RectInit | null | undefined), opts?: AnchorOptions): HTMLElement;
-//#endregion
-//#region src/ui/overlay/resize-strategy.d.ts
-/**
- * Resize strategies — pluggable policy for a resize drag's live bounds
- * and resting size. Pure (no DOM); the gesture injects the context.
- * Built-in: `freeResize` (default). `detents()` (detents.ts) quantizes a
- * constraint region and doubles as a strategy.
+ * The four insets read back as CSS would want them: the pinned edge's
+ * coordinate, `null` for the other three (`auto`). A centred axis is not an
+ * inset — both its edges are `null`.
  */
-/** How far (ms) a release velocity is projected when picking a rest. */
-declare const PROJECTION_MS = 160;
-/** Clamp `value` into `[min, max]`. */
-declare function clamp(value: number, min: number, max: number): number;
-/**
- * The release context a `ResizeStrategy` decides against. The gesture
- * builds it per drag; `resolve` turns a step value into pixels.
- */
-interface ResizeContext {
-  /** Dragged size along the axis (px, before clamping). */
-  size: number;
-  /** Size at the gesture's start (px). */
-  startSize: number;
-  /** Release velocity along the axis (px/ms; positive = shrinking). */
-  velocity: number;
-  /** Resize axis. */
-  axis: "width" | "height";
-  /** Hard room the surface may occupy on the axis (px). */
-  min: number;
-  max: number;
-  /** Whether a drag/flick past the minimum may dismiss. */
-  dismissible: boolean;
-  /** Release velocity (px/ms) past which a sub-minimum release dismisses. */
-  velocityThreshold: number;
-  /** Resolves a step to px — a number is a fraction of the constraint
-   * along the axis; a string is any CSS length. */
-  resolve(value: number | string): number;
+interface Region {
+  readonly left: number | null;
+  readonly right: number | null;
+  readonly top: number | null;
+  readonly bottom: number | null;
+  place(box: ReadonlyBox): Box;
 }
+/** One axis of a {@link Region.place}: where a box `n` long, currently at
+ * `own`, starts once `pin` is honoured. */
+declare function placeAxis(pin: Pin, own: number, n: number): number;
+/** The inset a pin yields on one edge: its coordinate if it pins that edge. */
+declare function inset(pin: Pin, edge: "start" | "end"): number | null;
 /**
- * Decides where a resize drag rests. The gesture calls `bounds()` for the
- * live rubber-band and `rest()` on release (the resting size, or `null`
- * to dismiss). Built-ins: `freeResize` (default), `detents`.
+ * A {@link Region} driven by writes — for gestures, where the box grows away
+ * from the edge the user is not dragging. Assigning an inset pins that edge
+ * and releases its opposite; assigning `null` frees the axis.
  */
-interface ResizeStrategy {
-  /** Soft `[lo, hi]` bounds for the live drag — rubber-band past these.
-   * Defaults to the hard room when omitted. */
-  bounds?(ctx: ResizeContext): [number, number];
-  /** Resting size (px) on release, or `null` to dismiss. */
-  rest(ctx: ResizeContext): number | null;
+declare class MutableRegion implements Region {
+  #private;
+  constructor(boundary: Boundary);
+  get left(): number | null;
+  get right(): number | null;
+  get top(): number | null;
+  get bottom(): number | null;
+  set left(v: number | null);
+  set right(v: number | null);
+  set top(v: number | null);
+  set bottom(v: number | null);
+  place(box: ReadonlyBox): Box;
 }
-/**
- * Picks the index of the detent closest to the released size, projected
- * along the release velocity (px/ms, positive = shrinking). Returns `-1`
- * when the gesture should dismiss instead.
- */
-declare function closestDetent(sizePx: number, detentsPx: readonly number[], velocityPxPerMs?: number, dismissible?: boolean, velocityThreshold?: number): number;
-/**
- * Free resize: drag to any size within the room; a flick or shrink past
- * the minimum dismisses. The default strategy.
- */
-declare function freeResize(opts?: {
-  min?: number;
-}): ResizeStrategy;
 //#endregion
-//#region src/ui/overlay/detents.d.ts
-/**
- * Detents — a customization of the constraint: the region, quantized.
- * One snapping concept for both services: `resize()` (and the markup
- * gestures) snap extents to the stops; `draggable()` snaps positions to
- * them. A bottom sheet's size detents and its top-edge position detents
- * were always the same thing — here they are literally the same object.
- */
-/** A {@link Region} with quantized stops. Doubles as a `ResizeStrategy`
- * (the stops resolve per axis through the gesture's `ResizeContext`). */
-interface Space extends ResizeStrategy {
-  readonly region: Region;
-  readonly stops: readonly (number | string)[];
-  /** The numeric stops resolved against a region axis (px, sorted) —
-   * position snapping for `draggable()`. String stops (CSS lengths) need
-   * an element context and only apply to resizes. */
-  positions(axis: "width" | "height"): number[];
-}
+//#region src/ui/overlay/anchor.d.ts
 /**
- * Quantizes a region: each stop is a fraction of the region along the
- * axis (number `0–1`) or a CSS length (string, resize-only). Flick-aware
- * on release; shrinking past the smallest stop dismisses (when the
- * consumer allows dismissal).
+ * The anchor-side vocabulary of the CSS `anchor()` function, reimplemented
+ * reactively — the JS tier speaks the same words as the native one:
  *
- * @example
- * ```ts
- * import { constraint, detents } from "elements-kit/ui/overlay";
+ *   overlay.y = anchor_length(a, "top", "bottom")   ≡   top: anchor(bottom)
  *
- * const d = detents(constraint(), [0.25, 0.6, 0.9]); // of the viewport
- * ```
+ * Horizontal writing modes only: the block axis always starts at the top;
+ * only the inline axis consults `direction`.
  */
-declare function detents(region: Region, stops: readonly (number | string)[]): Space;
-//#endregion
-//#region src/ui/overlay/rubber.d.ts
+/** Sides valid in a block-axis inset (`top` / `bottom`). */
+type BlockSide = "top" | "bottom" | "inside" | "outside" | "start" | "end" | "self-start" | "self-end" | "center";
+/** Sides valid in an inline-axis inset (`left` / `right`). */
+type InlineSide = "left" | "right" | "inside" | "outside" | "start" | "end" | "self-start" | "self-end" | "center";
+/** The physical inset longhands. */
+type PhysicalInset = "top" | "right" | "bottom" | "left";
+/** Every inset property `anchor()` may sit in. */
+type Inset = PhysicalInset | "inset-block-start" | "inset-block-end" | "inset-inline-start" | "inset-inline-end";
 /**
- * Effects — composable physics for motion through a space. Services
- * (`draggable`, `resize`) run each axis value through the effect chain:
- * `during` on every move, `settle` on release (`null` = dismiss signal).
- * `rubber()` is the built-in; custom effects are just objects.
+ * The reactive `anchor()` function: the viewport coordinate of an anchor line
+ * on `box`, in the context of the inset property being computed. Reads the
+ * box's reactive geometry, so calling it inside an `effect` tracks the anchor.
  */
-interface Effect {
-  /** Transform a live value (px on one axis) against the axis bounds. */
-  during?(value: number, bounds: readonly [number, number]): number;
-  /** Pick the resting value on release, or `null` to signal dismissal. */
-  settle?(value: number, velocity: number, bounds: readonly [number, number]): number | null;
-}
+declare function anchor_length(box: Box & Partial<IDirection>, inset: Inset, side: BlockSide | InlineSide | number): number;
 /**
- * Edge resistance — values past the bounds move at a fraction of the
- * pointer (the iOS rubber band). Pure `resist()` under the hood; no
- * channels involved, so it applies to anything a service moves.
- */
-declare function rubber(): Effect;
-//#endregion
-//#region src/ui/overlay/draggable.d.ts
-/**
- * The drag service — moves a target element through a space. Generic by
- * design: drag any positioned element by any handle. For overlays, the
- * target is the anchor element from `anchor()` — dragging the anchor
- * drags the overlay, with no overlay state involved.
+ * The reactive `position-area` property: the region of the viewport an
+ * overlay anchored to `anchor` may occupy, with the region's default
+ * self-alignment as {@link Region.place} — outward regions hug the anchor,
+ * spans go flush against its far edge, center is `anchor-center`. Nothing is
+ * written; the caller takes what it wants from `place`:
+ *
+ *   const area = new PositionArea(a, "top span-left");
+ *   effect(() => { overlay.x = area.place(overlay).x; });
+ *
+ * The value is parsed once, at construction; the geometry reads the anchor
+ * and window on every access, so reading it inside an `effect` tracks both.
  *
- * The pipeline runs per axis: live values go through each effect's
- * `during` (e.g. `rubber()` resistance at the space edges); on release
- * the value goes through each `settle`, then snaps to the space's
- * numeric stops when a `detents()` space is given (`null` from a settle
- * = dismiss signal, surfaced on the `dragend` detail). Events on the
- * target: `dragmove` (`{x, y}`) every move, `dragend`
- * (`{x, y, velocity, rest}`) on release.
+ * Bounded by the window. A tighter bound (a `Constraint`, a scroll container)
+ * is an intersection with the region, so it composes afterwards rather than
+ * being a parameter here.
  *
- * First pointer-down tears a `data-follow` pin (the `anchor()` contract):
- * the target freezes at its current rect and the pointer takes over.
+ * There is no gap parameter, for the same reason CSS has none: the offset off
+ * the anchor is the overlay's own `margin`.
  */
-interface DragService {
-  /** Move the target programmatically (through the `during` effects). */
-  update(point: {
-    x: number;
-    y: number;
-  }): void;
-  /** Wire the pointer plumbing to a handle. */
-  attach(handle: Element): {
-    dispose(): void;
-  };
-  dispose(): void;
-  [Symbol.dispose](): void;
+declare class PositionArea implements Region, ReadonlyBox {
+  #private;
+  readonly anchor: ReadonlyBox;
+  constructor(anchor: ReadonlyBox, area: string);
+  get x(): number;
+  get y(): number;
+  get w(): number;
+  get h(): number;
+  get left(): number | null;
+  get right(): number | null;
+  get top(): number | null;
+  get bottom(): number | null;
+  place(box: ReadonlyBox): Box;
 }
-declare function draggable(target: HTMLElement, space?: Region | Space, ...effects: Effect[]): DragService;
 //#endregion
-//#region src/ui/overlay/gestures.d.ts
-interface OverlayGestureOptions {
-  /** How a resize drag rests. Default: `freeResize()`. */
-  resize?: ResizeStrategy;
-  /** Allow a drag/flick past the minimum to close. Default `true`. */
-  dismissible?: boolean;
-  /** Release velocity (px/ms, shrinking) that dismisses. Default `0.5`. */
-  velocityThreshold?: number;
+//#region src/ui/overlay/overlay.d.ts
+declare class PartialBox implements Partial<Box> {
+  x: number | undefined;
+  y: number | undefined;
+  w: number | undefined;
+  h: number | undefined;
+  constructor(x?: number | undefined, y?: number | undefined, w?: number | undefined, h?: number | undefined);
+}
+declare class TransformableBox implements ReadonlyBox, Transformable {
+  readonly transform: PartialBox;
+  readonly displacement: Displacement;
+  constructor(transform?: PartialBox);
+  get x(): number;
+  set x(value: number);
+  get y(): number;
+  set y(value: number);
+  get w(): number;
+  set w(value: number);
+  get h(): number;
+  set h(value: number);
+}
+declare class Displacement extends PartialBox {
+  readonly box: TransformableBox;
+  constructor(box: TransformableBox);
+  apply(): void;
+  clear(): void;
 }
-interface OverlayGestures {
-  /** Resize to a size (px) along the resize axis — animated by CSS. */
-  resize(size: number): void;
-  dispose(): void;
+declare class OverlayBox extends TransformableBox implements IDirection {
+  #private;
+  readonly element: HTMLElement;
+  constructor(element: HTMLElement);
+  get w(): number;
+  set w(value: number);
+  get h(): number;
+  set h(value: number);
+  get x(): number;
+  set x(value: number);
+  get y(): number;
+  set y(value: number);
+  /** The element's computed direction, read at call time. */
+  get direction(): "ltr" | "rtl";
+  dispose: () => void;
   [Symbol.dispose](): void;
 }
-/**
- * Opt-in pointer gestures for `.x-overlay`, dispatched by the gesture
- * attributes (structure stays in markup; policy is options):
- *
- * - An edge word (`block-*` / `inline-*`) is a whole-surface size drag
- *   along that axis — block drags the height (sheets), inline the width
- *   (drawers), `:dir(rtl)` flips the inline sign. The side names the
- *   handle; the opposite edge stays put.
- * - A corner word (`start-start` / … — block side first) is a desktop-
- *   window resize from a square zone at that corner, anchored at the
- *   opposite corner so the surface never grows past the constraint. The
- *   width follows the `resize` strategy; the height is a free clamp.
- * - `data-draggable` moves the surface in x/y from the top strip,
- *   rubber-banding at the edges; flinging it off the constraint dismisses
- *   (when `dismissible`).
- *
- * Layered for testability: `gesture-model` owns the pure mode reducers +
- * math, and `overlay-dom` owns all DOM contact (pointer plumbing + channel
- * I/O). This function is the wiring — it picks a pure `Session` from
- * `detectEngagement` and adapts it to the recognizer through the io.
- * The `resize` strategy (`freeResize` by default, or `detents`) decides the
- * rested size, written to the public `--overlay-w`/`--overlay-h` channels;
- * CSS renders and animates them. JS never touches `translate`/`top`/`left`.
- *
- * Registers its cleanup with the current scope (`onCleanup`) and also
- * returns it as `dispose` / `Symbol.dispose`.
- *
- * @example
- * ```ts
- * import { constraint, createOverlayGestures, detents } from "elements-kit/ui/overlay";
- *
- * const el = document.querySelector("dialog.x-overlay")!;
- * createOverlayGestures(el, { resize: detents(constraint(), [0.25, 0.6, 0.9]) });
- * el.addEventListener("resizechange", (e) => console.log(e.detail));
- * ```
- */
-declare function createOverlayGestures(overlay: HTMLElement, options?: OverlayGestureOptions): OverlayGestures;
+interface Transformable {
+  displacement: Displacement;
+}
+declare namespace gestures_d_exports {
+  export { Modifier, detent, nearest, rubber, snap };
+}
+/** A pure display-time shaper: raw scalar → constrained scalar. */
+type Modifier = (value: number) => number;
+/** Elastic resistance past `[min, max]`. The true value stays in `Motion`, so
+ * release settles back cleanly. `dimension` = axis extent; `constant` = iOS
+ * tension (higher = looser). */
+declare function rubber(min: number, max: number, dimension: number, constant?: number): Modifier;
+/** The nearest detent to `value`. */
+declare function nearest(value: number, points: number[]): number;
+/** Magnetic pull toward the nearest detent during a drag (0 = free, 1 = snap). */
+declare function detent(points: number[], strength?: number): Modifier;
+/** Release target: project by velocity (`reach` ms of carry), then nearest detent. */
+declare function snap(value: number, velocity: number, points: number[], reach?: number): number;
 //#endregion
-//#region src/ui/overlay/resize.d.ts
-/**
- * The resize service — sizes a target through a space. The handle you
- * `attach()` is the whole gesture zone (unlike the markup gestures,
- * which zone-detect on the overlay surface); the side comes from the
- * target's `data-resize` value, same vocabulary as the stylesheet.
- *
- * The space is any `ResizeStrategy` — pass a `detents()` space to snap,
- * omit for `freeResize()`. Effects apply on release: each `settle` runs
- * over the strategy's rested size (`null` = dismiss). Live rubber past
- * the strategy bounds is built into the sessions.
- */
-interface ResizeService {
-  /** Resize to a size (px) along the resize axis — animated by CSS. */
-  update(size: number): void;
-  /** Wire the pointer plumbing to a handle. */
-  attach(handle: Element): {
-    dispose(): void;
-  };
-  dispose(): void;
-  [Symbol.dispose](): void;
+//#region src/ui/overlay/motion.d.ts
+interface IMotion {
+  value: number;
+  readonly displacement: number;
+  readonly delta: number;
+  readonly velocity: number;
+  abort(): void;
+}
+declare class Motion implements IMotion {
+  #private;
+  constructor(value?: number);
+  get value(): number;
+  set value(value: number);
+  get delta(): number;
+  get velocity(): number;
+  /** How far the value has moved from its initial (seed) — reactive.
+   * The displacement column: `value − initial`, starts at 0. */
+  get displacement(): number;
+  /** Nudge the value by a displacement — delta/velocity fall out of the setter. */
+  move(delta: number): void;
+  abort(initial?: number): void;
 }
-declare function resize(target: HTMLElement, space?: ResizeStrategy, ...effects: Effect[]): ResizeService;
 //#endregion
-export { AnchorOptions, DragService, Effect, OverlayConstraint, OverlayGestureOptions, OverlayGestures, PROJECTION_MS, RectInit, Region, ResizeContext, ResizeService, ResizeStrategy, Space, anchor, areaToPlacement, clamp, closestDetent, confine, constraint, createOverlayGestures, detents, draggable, freeResize, resize, resolveConstraint, resolveVarPx, rubber };
+export { type Align, type Axis, type BlockSide, type Boundary, ElementBox, gestures_d_exports as Gestures, type IDirection, type IMotion, type InlineSide, type Inset, Motion, MutableRegion, OverlayBox, type PhysicalInset, type Pin, PositionArea, type ReadonlyBox, type Region, WINDOW_BOX, WindowBox, anchor_length, inset, placeAxis };