@mkbabb/glass-ui 7.0.0 → 9.0.0

package/dist/components/select/index.d.ts

@@ -1,16 +1,18 @@
-export { default as Select } from "./Select.vue";
-export { default as SelectValue } from "./SelectValue.vue";
-export { default as SelectTrigger } from "./SelectTrigger.vue";
-export { default as SelectContent } from "./SelectContent.vue";
-export { default as SelectGroup } from "./SelectGroup.vue";
-export { default as SelectItem } from "./SelectItem.vue";
-export { default as SelectLabel } from "./SelectLabel.vue";
-export { default as SelectSeparator } from "./SelectSeparator.vue";
-export type { SelectEmits, SelectProps } from "./Select.vue";
-export type { SelectValueProps, SelectValueSlotProps } from "./SelectValue.vue";
-export type { SelectTriggerProps } from "./SelectTrigger.vue";
-export type { SelectContentEmits, SelectContentProps } from "./SelectContent.vue";
-export type { SelectGroupProps } from "./SelectGroup.vue";
-export type { SelectItemEmits, SelectItemProps, SelectItemSelectEvent, } from "./SelectItem.vue";
-export type { SelectLabelProps } from "./SelectLabel.vue";
-export type { SelectSeparatorProps } from "./SelectSeparator.vue";
+export { default as Select } from "./Select.vue.js";
+export { default as SelectValue } from "./SelectValue.vue.js";
+export { default as SelectTrigger } from "./SelectTrigger.vue.js";
+export { default as SelectContent } from "./SelectContent.vue.js";
+export { default as SelectGroup } from "./SelectGroup.vue.js";
+export { default as SelectItem } from "./SelectItem.vue.js";
+export { default as SelectLabel } from "./SelectLabel.vue.js";
+export { default as SelectScrollButton } from "./SelectScrollButton.vue.js";
+export { default as SelectSeparator } from "./SelectSeparator.vue.js";
+export type { SelectEmits, SelectProps } from "./Select.vue.js";
+export type { SelectValueProps } from "./SelectValue.vue.js";
+export type { SelectTriggerProps } from "./SelectTrigger.vue.js";
+export type { SelectContentEmits, SelectContentProps } from "./SelectContent.vue.js";
+export type { SelectGroupProps } from "./SelectGroup.vue.js";
+export type { SelectItemEmits, SelectItemProps, SelectItemSelectEvent, } from "./SelectItem.vue.js";
+export type { SelectLabelProps } from "./SelectLabel.vue.js";
+export type { SelectScrollButtonProps } from "./SelectScrollButton.vue.js";
+export type { SelectSeparatorProps } from "./SelectSeparator.vue.js";

package/dist/components/separator/Separator.vue.d.ts

@@ -1,5 +1,5 @@
 import { type HTMLAttributes } from "vue";
-import type { Orientation } from "../_shared/axes";
+import type { Orientation } from "../_shared/axes.js";
 export interface SeparatorProps {
     orientation?: Orientation;
     decorative?: boolean;

package/dist/components/separator/index.d.ts

@@ -1 +1 @@
-export { default as Separator, type SeparatorProps } from "./Separator.vue";
+export { default as Separator, type SeparatorProps } from "./Separator.vue.js";

package/dist/components/sheet/SheetContent.vue.d.ts

@@ -0,0 +1,60 @@
+import { type HTMLAttributes } from "vue";
+import type { Motion, Surface } from "../_shared/axes.js";
+import { type SidePlacement } from "./motion.js";
+export interface SheetContentProps {
+    forceMount?: boolean;
+    disableOutsidePointerEvents?: boolean;
+    class?: HTMLAttributes["class"];
+    surface?: Surface;
+    /** The anchored edge. A sheet always slides; a centred surface is `DialogContent`. */
+    side?: SidePlacement;
+    /**
+     * The detent ladder — ascending fractions of the anchored axis the sheet may rest
+     * at. Supplying it makes the sheet DETENTED: it takes its size from the live rung
+     * instead of sliding whole, it grows a grip that carries the ladder, and it can be
+     * dragged and flung between rungs or off the edge entirely.
+     *
+     * A detent is a size, so `left`/`right` ladders are as legal as `bottom`/`top` ones
+     * — the geometry is axis-agnostic and there is no side to fence off.
+     */
+    detents?: number[];
+    /** The active rung (`v-model:detent`). Defaults to the ladder's fullest. */
+    detent?: number | null;
+    motion?: Motion;
+    scroll?: boolean;
+}
+declare var __VLS_27: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_27) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<SheetContentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    escapeKeyDown: (event: KeyboardEvent) => any;
+    pointerDownOutside: (event: import("../_shared/interaction.js").PointerDownOutsideEvent) => any;
+    focusOutside: (event: import("../_shared/interaction.js").FocusOutsideEvent) => any;
+    interactOutside: (event: import("../_shared/interaction.js").PointerDownOutsideEvent | import("../_shared/interaction.js").FocusOutsideEvent) => any;
+    openAutoFocus: (event: Event) => any;
+    closeAutoFocus: (event: Event) => any;
+    "update:detent": (value: number | null) => any;
+}, string, import("vue").PublicProps, Readonly<SheetContentProps> & Readonly<{
+    onEscapeKeyDown?: ((event: KeyboardEvent) => any) | undefined;
+    onPointerDownOutside?: ((event: import("../_shared/interaction.js").PointerDownOutsideEvent) => any) | undefined;
+    onFocusOutside?: ((event: import("../_shared/interaction.js").FocusOutsideEvent) => any) | undefined;
+    onInteractOutside?: ((event: import("../_shared/interaction.js").PointerDownOutsideEvent | import("../_shared/interaction.js").FocusOutsideEvent) => any) | undefined;
+    onOpenAutoFocus?: ((event: Event) => any) | undefined;
+    onCloseAutoFocus?: ((event: Event) => any) | undefined;
+    "onUpdate:detent"?: ((value: number | null) => any) | undefined;
+}>, {
+    scroll: boolean;
+    surface: Surface;
+    side: SidePlacement;
+    detent: number | null;
+    detents: number[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/sheet/detents/projection.d.ts

@@ -0,0 +1,42 @@
+/** `ω₀ = 2π / response` — the register's angular frequency, in rad/s. */
+export declare function springOmega(response: number): number;
+/** The three numbers a projection needs — the shape a `SpringPresetRow` already has. */
+export interface ProjectionRow {
+    readonly response: number;
+    readonly dampingFraction: number;
+    readonly settleBand: number;
+}
+/**
+ * The row's own settle horizon in seconds: how long its envelope takes to fall inside
+ * its published band. This is the clock a released sheet coasts on.
+ */
+export declare function settleHorizon(row: ProjectionRow): number;
+/**
+ * How far a release at fraction-per-second `v` carries, in fractions. Signed: the sign
+ * of the velocity is the direction of the throw, and nothing here clamps it.
+ */
+export declare function throwDistance(v: number, row: ProjectionRow): number;
+/**
+ * Where a sheet released at fraction `x` with fraction-per-second velocity `v` comes to
+ * rest if nothing catches it. Unclamped on purpose — the caller owns the ladder, and a
+ * projection that ran past the ends is exactly the signal that the end is the answer.
+ */
+export declare function projectRest(x: number, v: number, row: ProjectionRow): number;
+/**
+ * The rung nearest `value` in `ladder` (ascending, non-empty). Ties go to the first —
+ * the ladder is sorted, so a tie resolves toward the closed end.
+ */
+export declare function nearestRung(value: number, ladder: readonly number[]): number;
+/**
+ * The release decision, end to end: project, then resolve against the ladder EXTENDED
+ * with the dismissed rung `0`.
+ *
+ * `0` is a legal rung here, and that is the whole of the drag-to-dismiss fix. The
+ * shipped engine floored its drag clamp at `ladder[0]` and then asked whether the target
+ * was `<= 0` — a branch that could never be true for either shipped ladder, so a
+ * −7826 px/s downward fling left the sheet open and the comment beside it claimed the
+ * opposite. Nothing tests a threshold now: a projected rest below the first rung's
+ * half-way point is nearer to `0` than to `ladder[0]` by ordinary arithmetic, and the
+ * sheet closes because that is where the energy pointed.
+ */
+export declare function resolveRelease(x: number, v: number, ladder: readonly number[], row: ProjectionRow): number;

package/dist/components/sheet/detents/use.d.ts

@@ -0,0 +1,27 @@
+import { type Ref } from "vue";
+import type { SidePlacement } from "../motion.js";
+export interface UseSheetDetentsOptions {
+    /** The reka root's open state. */
+    open: Readonly<Ref<boolean>>;
+    /** The anchored edge — decides the drag axis and its toward-open sign. */
+    side: () => SidePlacement;
+    /** The ascending, non-empty detent ladder. */
+    ladder: () => readonly number[];
+    /** The active rung (`v-model:detent`); the engine writes the settled rung back. */
+    detent: Ref<number | null>;
+    /** Ask the host to close (routes through the consumer's `v-model:open`). */
+    requestClose: () => void;
+}
+export interface UseSheetDetentsReturn {
+    /** The live size fraction. Bound as `--detent-t`; also the scrim's input. */
+    t: Readonly<Ref<number>>;
+    /** Mount hold — true until the dismissing spring reaches 0. */
+    present: Readonly<Ref<boolean>>;
+    /** True while a pointer drag is in flight. */
+    dragging: Readonly<Ref<boolean>>;
+    /** Settle to the nearest rung (the keyboard + external-write seam). */
+    snapTo(fraction: number): void;
+    /** Bind on the sheet root; decides for itself whether the press is a drag. */
+    onPointerdown(event: PointerEvent): void;
+}
+export declare function useSheetDetents(options: UseSheetDetentsOptions): UseSheetDetentsReturn;

package/dist/components/sheet/index.d.ts

@@ -0,0 +1,4 @@
+export { default as SheetContent, type SheetContentProps } from "./SheetContent.vue.js";
+export { sheetSlideTransform, scrimOpacity, scrimDetentOpacity, type SidePlacement, } from "./motion.js";
+export { settleHorizon, throwDistance, projectRest, nearestRung, resolveRelease, springOmega, type ProjectionRow, } from "./detents/projection.js";
+export { useSheetDetents } from "./detents/use.js";

package/dist/components/sheet/motion.d.ts

@@ -0,0 +1,29 @@
+import type { Placement } from "../_shared/axes.js";
+/** The four slide placements (a `center` modal is Dialog's non-slide path). */
+export type SidePlacement = Exclude<Placement, "center">;
+/**
+ * The side sheet's slide as a CSS `translate` LONGHAND value ("<lp> <lp>").
+ * `p`: 0 = mounted at rest, 1 = one own-dimension offscreen along the anchored
+ * axis. This is a `translate` longhand, NOT a `transform` function —
+ * `translateX()`/`translateY()` are invalid as a `translate` value and paint
+ * nothing (R1). `p` is left unclamped so the spring's overshoot IS the settle.
+ */
+export declare function sheetSlideTransform(placement: SidePlacement, p: number): string;
+/**
+ * Scrim opacity synced to the surface position: 1 at open (p=0), 0 at dismissed
+ * (p=1). Clamped so the spring overshoot (p<0 or p>1) never pushes opacity out of
+ * [0,1]. Reads the SAME live scalar as the surface → no desync through an interrupt.
+ */
+export declare function scrimOpacity(p: number): number;
+/**
+ * Scrim opacity for a DETENTED sheet, off the rung scalar rather than the slide: a
+ * peek barely dims and a full commits hard, which is what makes a partly-open sheet
+ * read as a sheet over a live page rather than as a modal that failed to arrive.
+ *
+ * The two figures are the shipped law relocated, not new ones — the drawer's
+ * `0.28 + t·0.44` measured CORRECT and survived its own audit; it only ever lived in a
+ * stylesheet with one consumer and an `@import` lane of its own. Here it is a pure
+ * function beside the slide law it is the sibling of, and it is CONDITIONAL: a sheet
+ * with no ladder keeps `scrimOpacity`, so nothing pays for a rung it does not have.
+ */
+export declare function scrimDetentOpacity(t: number): number;

package/dist/components/sheet/styles.css

@@ -0,0 +1 @@
+:where([data-slot="sheet-content"]){position: fixed;z-index: var(--z-modal);}@property --detent-t{syntax: "<number>";inherits: false;initial-value: 0;}:where([data-slot="sheet-content"][data-detents]){--sheet-seam-width: 1px;contain: layout paint;display: grid;grid-template-rows: auto minmax(0,1fr);}:where([data-slot="sheet-content"][data-modal="false"]){z-index: calc(var(--z-dock) - 1);}:where( [data-slot="sheet-content"][data-detents] > [data-slot="sheet-detent-handle"],[data-slot="sheet-content"][data-detents] [data-slot="dialog-header"] ){touch-action: none;}:where([data-slot="sheet-content"][data-dragging]){cursor: grabbing;user-select: none;}:where([data-slot="sheet-content"] > [data-slot="sheet-content-region"]){display: grid;align-content: start;gap: var(--space-body);}:where([data-slot="sheet-content"][data-scroll] > [data-slot="sheet-content-region"]){min-block-size: 0;max-block-size: calc(100dvh - 2 * var(--space-family));overflow-y: auto;}:where( [data-slot="sheet-content"][data-side="left"]:not([data-detents]) > [data-slot="sheet-content-region"],[data-slot="sheet-content"][data-side="right"]:not([data-detents]) > [data-slot="sheet-content-region"] ){display: flex;flex-direction: column;block-size: 100%;min-block-size: 0;}:where( [data-slot="sheet-content"][data-side="left"] > [data-slot="sheet-content-region"] > :only-child,[data-slot="sheet-content"][data-side="right"] > [data-slot="sheet-content-region"] > :only-child ){min-block-size: 0;}:where([data-slot="sheet-content"][data-detents] > [data-slot="sheet-content-region"]){display: grid;grid-template-rows: minmax(0,auto) minmax(1lh,1fr) auto;align-content: end;min-block-size: 0;gap: var(--space-body);}:where( [data-slot="sheet-content"][data-detents] > [data-slot="sheet-content-region"] > :not([data-slot="dialog-header"]):not([data-slot="dialog-footer"]) ){min-block-size: 0;overflow-y: auto;overscroll-behavior: contain;}:where( [data-slot="sheet-content"][data-detents] > [data-slot="sheet-content-region"] > [data-slot="dialog-header"] ){overflow: hidden;padding-block-end: var(--space-body);border-block-end: var(--sheet-seam-width) solid oklch(from var(--glass-veil-ink) l c h / calc(var(--glass-veil-step) * 2));}:where( [data-slot="sheet-content"][data-detents] > [data-slot="sheet-content-region"] > [data-slot="dialog-footer"] ){padding-block-start: var(--space-body);border-block-start: var(--sheet-seam-width) solid oklch(from var(--glass-veil-ink) l c h / calc(var(--glass-veil-step) * 2));}:where([data-slot="sheet-content"]:not([data-detents]):has([data-slot="dialog-close"])) :where([data-slot="dialog-header"]){padding-inline-end: calc(var(--touch-target) + var(--space-atom));}:where([data-slot="sheet-content"][data-detents] > [data-slot="sheet-detent-handle"]){display: flex;align-items: center;justify-content: center;min-block-size: var(--touch-target);cursor: grab;}:where([data-slot="sheet-detent-handle"] > [data-slot="sheet-detent-grip"]){display: block;inline-size: calc( var(--space-section) + var(--space-family) * clamp(0,var(--detent-t),1) );block-size: calc(var(--space-atom) / 2);border-radius: var(--radius-pill);background-color: currentcolor;opacity: calc(0.45 + ((0.85 - 0.45) / 2) * clamp(0,var(--detent-t),1));transition: opacity var(--spring-dock-duration) var(--spring-dock),inline-size var(--spring-dock-duration) var(--spring-dock);}@media (hover: hover){:where([data-slot="sheet-detent-handle"]:hover > [data-slot="sheet-detent-grip"]){opacity: 0.85;}}:where([data-slot="sheet-detent-handle"]:focus-visible){outline: none;}:where( [data-slot="sheet-detent-handle"]:focus-visible > [data-slot="sheet-detent-grip"],[data-slot="sheet-content"][data-dragging] [data-slot="sheet-detent-grip"] ){opacity: 0.85;}:where( [data-slot="sheet-detent-handle"]:focus-visible > [data-slot="sheet-detent-grip"] ){box-shadow: 0 0 0 3px var(--focus-ring-color);}@media (prefers-reduced-motion: reduce){:where([data-slot="sheet-detent-grip"]){transition: none;}}:where([data-slot="sheet-content"]){anchor-name: --glass-sheet-edge;}:where([data-slot="sheet-content"][data-surface="glass"]){-webkit-backdrop-filter: none;backdrop-filter: none;}:where([data-slot="glass-graded-halo"]){position: fixed;position-anchor: --glass-sheet-edge;top: anchor(top);right: anchor(right);bottom: anchor(bottom);left: anchor(left);z-index: calc(var(--z-modal) - 1);pointer-events: none;background: linear-gradient( var(--sheet-edge-direction),color-mix(in oklab,var(--glass-plate-overlay) 10%,transparent) 0,color-mix(in oklab,var(--glass-plate-overlay) 16%,transparent) 40px,color-mix(in oklab,var(--glass-plate-overlay) 34%,transparent) 120px,color-mix(in oklab,var(--glass-plate-overlay) 34%,transparent) 100% );-webkit-backdrop-filter: blur(calc(34px * var(--glass-level))) saturate(var(--glass-saturate));backdrop-filter: blur(calc(34px * var(--glass-level))) saturate(var(--glass-saturate));mask-image: linear-gradient( var(--sheet-edge-direction),rgb(0 0 0 / 0.325) 0,rgb(0 0 0 / 0.45) 40px,black 120px,black 100% );}:where([data-slot="glass-graded-halo"][data-modal="false"]){z-index: calc(var(--z-dock) - 2);}:where([data-slot="glass-graded-halo"][data-side="top"]){--sheet-edge-direction: to top;border-end-start-radius: var(--radius-3xl);border-end-end-radius: var(--radius-3xl);}:where([data-slot="glass-graded-halo"][data-side="bottom"]){--sheet-edge-direction: to bottom;border-start-start-radius: var(--radius-3xl);border-start-end-radius: var(--radius-3xl);}:where([data-slot="glass-graded-halo"][data-side="left"]){--sheet-edge-direction: to left;border-start-end-radius: var(--radius-3xl);border-end-end-radius: var(--radius-3xl);}:where([data-slot="glass-graded-halo"][data-side="right"]){--sheet-edge-direction: to right;border-start-start-radius: var(--radius-3xl);border-end-start-radius: var(--radius-3xl);}:where([data-slot="glass-graded-halo"][data-detents][data-side="bottom"]){height: 100dvh;bottom: auto;}:where([data-slot="glass-graded-halo"][data-detents][data-side="top"]){height: 100dvh;top: auto;}:where([data-slot="glass-graded-halo"][data-detents][data-side="left"]){width: 100dvw;left: auto;}:where([data-slot="glass-graded-halo"][data-detents][data-side="right"]){width: 100dvw;right: auto;}@media (prefers-reduced-transparency: reduce),(forced-colors: active){:where([data-slot="glass-graded-halo"]){display: none;}}:where([data-slot="sheet-content"][data-side="top"]){left: 0;right: 0;top: 0;}:where([data-slot="sheet-content"][data-side="bottom"]){left: 0;right: 0;bottom: 0;}:where([data-slot="sheet-content"][data-side="left"]){top: 0;bottom: 0;left: 0;height: 100%;width: 75%;}:where([data-slot="sheet-content"][data-side="right"]){top: 0;bottom: 0;right: 0;height: 100%;width: 75%;}@media (min-width: 40rem){:where([data-slot="sheet-content"][data-side="left"]),:where([data-slot="sheet-content"][data-side="right"]){max-width: 24rem;}}:where( [data-slot="sheet-content"][data-detents][data-side="bottom"],[data-slot="sheet-content"][data-detents][data-side="top"] ){block-size: calc(clamp(0,var(--detent-t),1) * 100dvh);min-block-size: calc( 2 * var(--space-family) + var(--sheet-seam-width) + var(--touch-target) + 2 * var(--space-body) + var(--space-body) + var(--sheet-seam-width) + 1lh + var(--space-body) + var(--sheet-seam-width) + var(--touch-target) );max-block-size: 100dvh;}:where( [data-slot="sheet-content"][data-detents][data-side="left"],[data-slot="sheet-content"][data-detents][data-side="right"] ){width: calc(clamp(0,var(--detent-t),1) * 100dvw);max-width: 100dvw;height: 100%;}:where([data-slot="sheet-content"]){padding-inline: var(--space-family);padding-block: var(--space-family);}:where([data-slot="sheet-content"][data-side="top"]){border-end-start-radius: var(--radius-3xl);border-end-end-radius: var(--radius-3xl);}:where([data-slot="sheet-content"][data-side="bottom"]){border-start-start-radius: var(--radius-3xl);border-start-end-radius: var(--radius-3xl);}:where([data-slot="sheet-content"][data-side="left"]){border-start-end-radius: var(--radius-3xl);border-end-end-radius: var(--radius-3xl);}:where([data-slot="sheet-content"][data-side="right"]){border-start-start-radius: var(--radius-3xl);border-end-start-radius: var(--radius-3xl);}

package/dist/components/skeleton/index.d.ts

@@ -1 +1 @@
-export { default as Skeleton } from './Skeleton.vue';
+export { default as Skeleton } from './Skeleton.vue.js';

package/dist/components/slider/Slider.vue.d.ts

@@ -1,4 +1,4 @@
-import type { SliderProps, SliderSize, SliderVariant } from "./types";
+import type { SliderProps, SliderSize, SliderVariant } from "./types.js";
 declare const __VLS_export: import("vue").DefineComponent<SliderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: number[] | undefined) => any;
     valueCommit: (value: number[]) => any;
@@ -7,9 +7,8 @@ declare const __VLS_export: import("vue").DefineComponent<SliderProps, {}, {}, {
     onValueCommit?: ((value: number[]) => any) | undefined;
 }>, {
     size: SliderSize;
-    invalid: boolean;
     variant: SliderVariant;
-    keepDockOpen: boolean;
+    invalid: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/slider/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Slider } from './Slider.vue';
-export type { SliderProps, SliderSize, SliderVariant } from './types';
+export { default as Slider } from './Slider.vue.js';
+export type { SliderProps, SliderSize, SliderVariant } from './types.js';

package/dist/components/slider/styles.css

@@ -0,0 +1 @@
+@property --glass-slider-track-background{syntax: "*";inherits: true;}.glass-slider{--slider-range-origin: left center;position: relative;display: flex;inline-size: 100%;align-items: center;touch-action: none;user-select: none;transition: color var(--duration-fast) var(--ease-standard);}.glass-slider[data-inverted],.glass-slider:dir(rtl){--slider-range-origin: right center;}.glass-slider:dir(rtl)[data-inverted]{--slider-range-origin: left center;}.glass-slider[data-size="sm"]{--slider-track-height: 0.75rem;--slider-thumb-size: 0.5rem;}.glass-slider[data-size="md"]{--slider-track-height: 1.25rem;--slider-thumb-size: 1rem;}.glass-slider[data-size="lg"]{--slider-track-height: 1.75rem;--slider-thumb-size: 1.5rem;}.glass-slider[data-variant="spectrum"]{--slider-track-height: calc(var(--slider-thumb-size,1rem) * 1.5);}@media (pointer: coarse){.glass-slider{--slider-target-floor: max( var(--slider-track-height,0.375rem),var(--slider-touch-target,1.5rem) );min-block-size: var(--slider-target-floor);min-inline-size: var(--slider-target-floor);}}.slider-track{width: 100%;flex-grow: 1;height: var(--slider-track-height,0.375rem);background: var(--glass-slider-track-background,var(--muted-medium));transition: background var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard);}.slider-range{position: absolute;height: 100%;--liquid-fill-tint: var(--slider-range-bg,var(--glass-capsule-warm));}.slider-thumb{display: block;width: 0;height: var(--slider-track-height,0.375rem);opacity: 0;background: transparent;border: none;box-shadow: none;transition: transform var(--spring-press-duration) var(--spring-press);}.glass-slider:not([data-variant="spectrum"]):hover .slider-range{--liquid-fill-strength: 100%;}.glass-slider:not([data-variant="spectrum"]):has(:focus-visible) .slider-track{box-shadow: var(--focus-ring-shadow);}.glass-slider[data-held] .slider-range,.glass-slider:active .slider-range{--smear: calc(var(--atom-drag-v,0) * var(--motion-weight,0.618));transform: scale( calc(1.02 + 0.16 * var(--smear)),calc(0.94 - 0.06 * var(--smear)) );transform-origin: var(--slider-range-origin);transition: transform var(--spring-press-duration) var(--spring-press);}.glass-slider:not(:active):not([data-held]) .slider-range{transition: transform var(--duration-normal) var(--ease-cartoon-punch),--glass-veil-rung var(--spring-dock-duration) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard);}@media (prefers-reduced-motion: reduce){.glass-slider:active .slider-range,.glass-slider[data-held] .slider-range{--motion-weight: 0;transform: scale(1,0.97);}}.glass-slider[data-disabled] .slider-range{opacity: var(--opacity-disabled);}.glass-slider[data-invalid] .slider-track{box-shadow: inset 0 0 0 1px var(--destructive);}.glass-slider[data-invalid]:has(:focus-visible) .slider-track{box-shadow: var(--focus-ring-shadow),inset 0 0 0 1px var(--destructive);}.glass-slider[data-variant="spectrum"][data-held] .slider-thumb{box-shadow: 0 0 0 6px var(--surface-tint-15),var(--shadow-sm);}.glass-slider[data-variant="spectrum"] .slider-track{background: var(--glass-slider-track-background,var(--secondary));}.glass-slider[data-variant="spectrum"] .slider-thumb{width: calc(var(--slider-thumb-size,1rem) * 0.75);height: var(--slider-track-height,0.375rem);opacity: 1;background: transparent;border: 2px solid var(--background);border-radius: calc(var(--slider-thumb-size,1rem) * 0.4);box-shadow: var(--shadow-sm);}@supports (corner-shape: superellipse(2)){.glass-slider[data-variant="spectrum"] .slider-thumb{corner-shape: var(--corner-shape-thumb);}}.glass-slider[data-variant="spectrum"]:hover .slider-thumb{box-shadow: 0 0 0 4px var(--surface-tint-8),var(--shadow-sm);}.glass-slider[data-variant="spectrum"] .slider-thumb:focus-visible{outline: none;box-shadow: var(--focus-ring-shadow),var(--shadow-sm);}.glass-slider[data-orientation="vertical"]{flex-direction: column;width: var(--slider-track-height,0.375rem);height: 12rem;}.glass-slider[data-orientation="vertical"] .slider-track{width: var(--slider-track-height,0.375rem);height: 100%;}.glass-slider[data-orientation="vertical"] .slider-range{width: 100%;height: auto;}.glass-slider[data-orientation="vertical"]:active .slider-range,.glass-slider[data-orientation="vertical"][data-held] .slider-range{--smear: calc(var(--atom-drag-v,0) * var(--motion-weight,0.618));transform: scale( calc(0.94 - 0.06 * var(--smear)),calc(1.02 + 0.16 * var(--smear)) );transform-origin: center bottom;}.glass-slider[data-orientation="vertical"][data-inverted] .slider-range{transform-origin: center top;}.glass-slider[data-orientation="vertical"][data-variant="spectrum"] .slider-thumb{width: var(--slider-track-height,0.375rem);height: calc(var(--slider-thumb-size,1rem) * 0.75);}@media (prefers-reduced-motion: reduce){.glass-slider[data-orientation="vertical"]:active .slider-range,.glass-slider[data-orientation="vertical"][data-held] .slider-range{transform: scale(0.97,1);}}@media (forced-colors: active){.slider-track{background: Canvas;border: 1px solid CanvasText;}.slider-range{background: Highlight;}.glass-slider[data-variant="spectrum"] .slider-thumb{border-color: CanvasText;forced-color-adjust: none;background: Highlight;}.glass-loupe{background: Canvas;border: 1px solid CanvasText;}}.glass-loupe{--loupe-k-max: 2.6;--loupe-k-min: 1.15;--loupe-k: calc( var(--loupe-k-max) - (var(--loupe-k-max) - var(--loupe-k-min)) * var(--flex-vel,0) );--loupe-vel: var(--flex-vel,0);--loupe-span: calc(var(--slider-track-height,1.25rem) * 6);position: fixed;z-index: calc(var(--z-overlay) - 1);inline-size: var(--loupe-span);block-size: calc(var(--slider-track-height,1.25rem) * var(--loupe-k-max));inset-block-start: var(--loupe-top,0);inset-inline-start: var(--loupe-left,0);translate: -50% -100%;scale: 0.13;transform-origin: 50% 100%;transition: scale var(--spring-present-duration) var(--spring-present),opacity var(--spring-present-duration) var(--ease-standard);opacity: 0;overflow: hidden;border-radius: var(--radius-pill);pointer-events: none;box-shadow: var(--glass-material-rim),var(--glass-under-shadow-quiet);}.glass-loupe[data-engaged]{scale: 1;opacity: 1;}.glass-loupe:not([data-engaged]){transition: scale var(--spring-present-exit-duration) var(--ease-standard),opacity var(--spring-present-exit-duration) var(--ease-standard);}.glass-loupe-clone{--s: 3;position: absolute;inset-block-start: 50%;inset-inline-start: 0;inline-size: calc(var(--loupe-track-w,0px) * var(--s));block-size: calc(var(--slider-track-height,1.25rem) * var(--s));border-radius: calc(var(--radius-pill) * var(--s));overflow: hidden;background: var(--glass-slider-track-background,var(--muted-medium));transform: translate( calc(var(--loupe-span) / 2 - var(--loupe-k) * var(--loupe-x,0px)),-50% ) scale(calc(var(--loupe-k) / var(--s)));transform-origin: 0 50%;filter: blur(calc(var(--loupe-vel,0) * 0.75px));transition: filter var(--duration-normal) var(--ease-standard);}.glass-loupe-fill{position: absolute;inset-block: 0;inset-inline-start: 0;inline-size: var(--loupe-fill-w,0px);background: var(--slider-range-bg,var(--glass-capsule-warm));}.glass-loupe-mark{position: absolute;inset-block: 0;inset-inline-start: 50%;inline-size: 2px;translate: -50% 0;background: var(--foreground);opacity: 0.24;}@media (prefers-reduced-motion: reduce){.glass-loupe{transition-duration: 0.01ms;}.glass-loupe-clone{filter: none;}}

package/dist/components/slider/types.d.ts

@@ -1,7 +1,12 @@
 import type { HTMLAttributes } from "vue";
-import type { Motion, Orientation } from "../_shared/axes";
-import type { Direction, FormFieldProps } from "../_shared/primitive";
-export type SliderVariant = "standard" | "spectrum";
+import type { Motion, Orientation } from "../_shared/axes.js";
+import type { Direction, FormFieldProps } from "../_shared/primitive.js";
+/**
+ * `scrubber` is the continuous-cylinder recipe — one glass segment whose leading edge
+ * IS the handle, with no visible thumb. `spectrum` is the gradient colour-picker
+ * recipe with a visible slim squircle handle.
+ */
+export type SliderVariant = "scrubber" | "spectrum";
 export type SliderSize = "sm" | "md" | "lg";
 export interface SliderProps extends FormFieldProps {
     modelValue?: number[] | null;
@@ -20,6 +25,10 @@ export interface SliderProps extends FormFieldProps {
     /** Decorative checkpoints in the numeric domain; they never snap the value. */
     marks?: readonly number[];
     invalid?: boolean;
-    keepDockOpen?: boolean;
     motion?: Motion;
+    /**
+     * Humane readout for assistive tech — the string a screen reader hears instead of
+     * the raw number. Authored per thumb onto `aria-valuetext`; reka mints none.
+     */
+    valueText?: (value: number, index: number) => string;
 }

package/dist/components/sortable-list/SortableItem.vue.d.ts

@@ -1,4 +1,4 @@
-import type { SortableId } from "./composables/types";
+import type { SortableId } from "./types.js";
 type __VLS_Props = {
     id: SortableId;
     disabled?: boolean;

package/dist/components/sortable-list/SortableList.vue.d.ts

@@ -1,4 +1,4 @@
-import { type SortableId } from "./composables/useSortable";
+import type { SortableId } from "./types.js";
 declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: import("vue").PublicProps & __VLS_PrettifyLocal<{
         /** The reactive list being reordered. */
@@ -8,7 +8,6 @@ declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_se
         label?: string;
         group?: string;
         handleSelector?: string | null;
-        axis?: "x" | "y";
     } & {
         onInsert?: ((index: number, item: unknown) => any) | undefined;
         onReorder?: ((next: T[]) => any) | undefined;

package/dist/components/sortable-list/context.d.ts

@@ -1,5 +1,5 @@
 import type { ComputedRef } from "vue";
-import type { SortableId, SortableRowBinding, UseSortableReturn } from "./composables/types";
+import type { SortableId, SortableRowBinding, UseSortableReturn } from "./types.js";
 export declare const provideSortableContext: (ctx: UseSortableReturn) => void;
 export declare const useSortableContext: () => UseSortableReturn;
 export interface SortableItemContext {

package/dist/components/sortable-list/drag.d.ts

@@ -0,0 +1,52 @@
+/**
+ * The sortable drag transaction — propose / commit / cancel, and the vacancy.
+ *
+ * THE VACANCY IS THE INDICATOR. There is no drawn insertion line, no caret, no bar:
+ * the rows between the source and the proposed position translate by one row's block
+ * size, which opens a gap exactly where the row would land, and the lifted row's own
+ * (unpainted) slot travels into it. One spatial account, one copy of the row, nothing
+ * to keep in sync — the 7.0.0 gold shimmer bar had a mass 9.4× the indicator rung and
+ * still could not say where an EMPTY list would receive.
+ *
+ * THE TRANSACTION IS PRESERVED BYTE-FOR-BYTE. The four announcements, the focus
+ * retention, the single `reorder` emit, the O(rows) midpoint scan and the cross-list
+ * transfer are the good half of this component and are not redesigned here. What
+ * changed around them: a gesture must EARN the transaction (8px or the hold) before
+ * a single word is announced, and the ghost is now taken before the source is marked.
+ *
+ * THE ROWS CARRY THEIR OWN CLOCK. `.sortable-item` transitions `transform` on the
+ * dock curve unconditionally, so opening the vacancy and closing it are the same
+ * mechanism read in two directions — there is no "parting mode" to enter and leave,
+ * and clearing a transform animates home instead of snapping.
+ */
+import type { InstanceHandle, SortableId } from "./types.js";
+import { type ShallowRef } from "vue";
+/** A viewport top-left — where a plate is, or where it is going. */
+interface Origin {
+    x: number;
+    y: number;
+}
+export interface DragControllerDeps {
+    getItems: () => readonly unknown[];
+    getId: (item: unknown) => SortableId;
+    getLabel: (item: unknown) => string;
+    elements: Map<SortableId, Element | null>;
+    handle: InstanceHandle;
+    onReorder: (next: unknown[]) => void;
+    announce: (message: string) => void;
+    focusItem: (id: SortableId) => void;
+}
+export interface DragController {
+    dragId: ShallowRef<SortableId | null>;
+    dropIndex: ShallowRef<number | null>;
+    beginPointer: (id: SortableId, event: PointerEvent) => void;
+    onKeydown: (id: SortableId, event: KeyboardEvent) => void;
+    /** A sibling instance parts THIS list's rows for an incoming subject. */
+    partForExternal: (index: number | null, block: number | null) => void;
+    /** Where a subject arriving at `index` comes to rest — the releasing list's ask. */
+    vacancyOrigin: (index: number) => Origin | null;
+    cancel: () => void;
+    dispose: () => void;
+}
+export declare function createDragController(deps: DragControllerDeps): DragController;
+export {};

package/dist/components/sortable-list/ghost.d.ts

@@ -0,0 +1,40 @@
+/**
+ * The drag ghost — the lifted row, promoted from cell to floating glass plate.
+ *
+ * TWO ELEMENTS, TWO JOBS, AND THAT IS WHY THERE IS NO TIMER HERE. The outer plate
+ * owns the FOLLOW channel: one `translate3d`, never transitioned, so the plate stays
+ * welded to the finger (MOTION-CANON §4:334). The inner clone owns the PROMOTION
+ * channel: scale and tilt, transitioned on the press curve. Writing both on one
+ * element would force the follow to share the promotion's transition — the lag the
+ * canon forbids — or force a timer to strip the transition mid-gesture.
+ *
+ * THE CLONE IS TAKEN BEFORE THE SOURCE IS MARKED. The 7.0.0 ghost was stamped
+ * `.is-sortable-dragging` on the source and THEN cloned, so the clone inherited the
+ * source's own 0.35 fade at equal specificity and the whole authored lift kit painted
+ * at 35% — invisible, and structurally so. Order is the fix; nothing else was needed.
+ *
+ * The corner is AUTHORED, not hunted: the plate's radius is a role token, so the
+ * 26-line `getComputedStyle` descendant walk that used to guess it is gone.
+ */
+export interface Ghost {
+    /** The plate element, for measurement at release. */
+    readonly plate: HTMLElement;
+    /** Move the plate to a viewport position (its top-left). Compositor only. */
+    follow: (x: number, y: number) => void;
+    /** Re-derive the tilt from the live horizontal velocity. */
+    tilt: (velocityX: number) => void;
+    /** Current top-left, as last written. */
+    position: () => {
+        x: number;
+        y: number;
+    };
+    /** Release the promotion (radius, frost, swell) — the landing half of the flight. */
+    land: () => void;
+    /** Remove the plate from the document. */
+    destroy: () => void;
+}
+/**
+ * Build the ghost from a source row. `rect` is the source's resting box, measured by
+ * the caller BEFORE any state is written to the DOM.
+ */
+export declare function createGhost(source: HTMLElement, rect: DOMRect): Ghost;

package/dist/components/sortable-list/index.d.ts

@@ -1,4 +1,4 @@
-export { default as SortableList } from "./SortableList.vue";
-export { default as SortableItem } from "./SortableItem.vue";
-export { default as SortableHandle } from "./SortableHandle.vue";
-export type { SortableId } from "./composables/types";
+export { default as SortableList } from "./SortableList.vue.js";
+export { default as SortableItem } from "./SortableItem.vue.js";
+export { default as SortableHandle } from "./SortableHandle.vue.js";
+export type { SortableId } from "./types.js";

package/dist/components/sortable-list/motion.d.ts

@@ -0,0 +1,75 @@
+/**
+ * Sortable motion — the gesture's clocks, and the ONE rAF spring path in the family.
+ *
+ * THE SPLIT, STATED ONCE, BECAUSE IT IS THE WHOLE DESIGN:
+ *   · PARTING and PROMOTION are CSS transitions on the GENERATED spring curves
+ *     (`--spring-dock` / `--spring-press` + their duration readers). They are
+ *     compositor-only writes with a known endpoint, so the curve IS the spring and
+ *     the `a11y-overrides.css` reduced-motion blanket already governs them.
+ *   · FOLLOW is 1:1 finger attachment — linear, zero easing, no spring. MOTION-CANON
+ *     §4:334: "Springs belong to entrances, exits, and releases — never between a
+ *     finger and the thing it is holding."
+ *   · THE RELEASE FLIGHT is the one leg a CSS transition cannot express, because its
+ *     initial condition is the gesture's own VELOCITY. That is the single rAF spring
+ *     path here, and it carries the LOCAL reduced-motion gate — the CSS blanket stops
+ *     CSS clocks, it does not stop a JS integrator.
+ *
+ * Every response/damping pair is read from `springPresets` BY NAME. No literal, no
+ * second register: three values have circulated for "dock" across canon, disk and
+ * memory, and the name is the only one of the three that cannot go stale.
+ */
+import { springPreset } from "../../composables/motion/spring/springPresets.js";
+/**
+ * THE ACTIVATION HOLD, DERIVED — never minted.
+ *
+ * A stationary press becomes a lift when it outlasts the slowest motion the library
+ * can make: `world`, the recession row, is that ceiling by construction (it is the
+ * longest response in the table, and the table is the whole register). A press that
+ * outlives it is no longer plausibly a tap. The figure therefore MOVES when the
+ * register moves, which is the property a minted 400ms could never have — CWT-2 §3
+ * ruled exactly this ("no canon rung for hold durations; law it or derive").
+ */
+export declare const ACTIVATION_HOLD_MS: number;
+/**
+ * THE ACTIVATION SLOP, in px. The series rung above coarse-tap jitter (5–10px): below
+ * it the gesture is a click and the transaction never opens.
+ */
+export declare const ACTIVATION_SLOP_PX = 8;
+/** Reduced motion, read LIVE — a JS integrator has no cascade to be stopped by. */
+export declare function prefersReducedMotion(): boolean;
+/**
+ * A small ring buffer over the last few pointer samples. Release velocity is the
+ * chord across the window rather than the last frame's delta, so one stalled frame
+ * cannot fling the ghost.
+ */
+export declare class VelocitySampler {
+    private readonly ring;
+    private readonly size;
+    push(x: number, y: number, t?: number): void;
+    reset(): void;
+    /** px/s across the sample window; `{x:0,y:0}` when the window is degenerate. */
+    velocity(): {
+        x: number;
+        y: number;
+    };
+}
+/**
+ * Velocity-derived tilt on the shared tanh register, capped at the existing ceiling.
+ * A static rotation is width-dependent and says nothing; this one says how hard the
+ * row is being thrown.
+ */
+export declare function tiltFor(velocityX: number): number;
+/** A running release flight: `stop()` ends it, `promise` settles when it lands. */
+export interface Flight {
+    stop: () => void;
+}
+/**
+ * Fly a value 0 → 1 on a named spring row, seeded with the gesture's own release
+ * velocity. THE ONE rAF SPRING PATH — and therefore the one carrying the local
+ * reduced-motion gate: under `reduce` the flight collapses to a single frame at the
+ * endpoint, which is the honest cut (not a shortened animation).
+ *
+ * `velocityAlongPath` is px/s projected onto the flight vector; it is converted to
+ * the spring's own units (1 = the whole distance) by the distance itself.
+ */
+export declare function flyProgress(rowName: Parameters<typeof springPreset>[0], distance: number, velocityAlongPath: number, onFrame: (t: number) => void, onLand: () => void): Flight;

package/dist/components/sortable-list/resolve.d.ts

@@ -0,0 +1,56 @@
+/**
+ * Sortable drop resolution — pure collision math over a rect cache taken at LIFT.
+ *
+ * THE CACHE IS NOT AN OPTIMISATION, IT IS THE CORRECTNESS FIX (E4). The parting
+ * animation writes `transform` on the very rows the midpoint scan reads, and
+ * `getBoundingClientRect()` reports the TRANSFORMED box — so a live per-frame scan
+ * resolves against geometry the previous frame's resolution produced. That loop
+ * oscillates at the boundary between two rows. Rows are snapshotted ONCE at lift, in
+ * their RESTING layout, and every frame resolves against that snapshot: one input,
+ * one output, no feedback path. The O(rows) walk stays O(rows) and stops touching
+ * layout mid-gesture.
+ *
+ * A scroll or a resize during a drag invalidates the snapshot, so both re-take it.
+ */
+import type { InstanceHandle, SortableId } from "./types.js";
+/**
+ * Every live `useSortable` instance registers here for cross-list lookups. On drag
+ * move, the source instance looks up any other instance in the same group whose
+ * container contains the cursor, and transfers the drop target to it. Entries are
+ * removed on scope dispose.
+ */
+export declare const instances: Set<InstanceHandle>;
+/**
+ * One row's resting geometry. The ORIGIN is stored, never the midpoint: the scan wants
+ * a midpoint and the release flight wants a landing corner, and two stored numbers for
+ * one measurement is how they drift apart. The midpoint is derived where it is used.
+ */
+export interface RowRect {
+    readonly id: SortableId;
+    readonly top: number;
+    readonly left: number;
+    readonly block: number;
+}
+/** The resting snapshot of one list, plus the container box the cursor is tested against. */
+export interface ListRects {
+    readonly rows: readonly RowRect[];
+    /** Distance between consecutive row starts — the block size a vacancy opens by. */
+    readonly pitch: number;
+}
+/**
+ * Snapshot a list's resting row geometry. Rows already carrying a parting transform
+ * are read through it (`offsetTop`-free): the caller takes the snapshot before any
+ * transform is written, which is what `lift` does.
+ */
+export declare function snapshotRows(elements: Map<SortableId, Element | null>, order: readonly SortableId[]): ListRects;
+/**
+ * Resolve an insertion BOUNDARY (0…rows.length) by walking the resting snapshot for
+ * the first row whose midpoint is past the cursor.
+ */
+export declare function resolveBoundary(rects: ListRects, clientY: number): number;
+/**
+ * Find a sibling instance in the same group whose container bounds contain the
+ * cursor — the foreign drop target. Returns null when the source has no group or the
+ * cursor is over no sibling.
+ */
+export declare function findForeignTarget(sourceHandle: InstanceHandle, clientX: number, clientY: number): InstanceHandle | null;

package/dist/components/sortable-list/{composables/types.d.ts → types.d.ts}

@@ -9,15 +9,15 @@ export interface SortableOptions<T> {
     onInsert?: (index: number, item: unknown) => void;
     group?: string;
     handleSelector?: string | null;
-    axis?: "x" | "y";
 }
 export interface SortableRowBinding {
     ref: (el: unknown) => void;
     dataAttrs: Record<string, string>;
-    class: ComputedRef<Record<string, boolean>>;
     disabled: ComputedRef<boolean>;
     onPointerdown: (event: PointerEvent) => void;
     onKeydown: (event: KeyboardEvent) => void;
+    /** Release the row's registration — called from the row's unmount. */
+    release: () => void;
 }
 export interface SortableContainerBinding {
     ref: (el: unknown) => void;
@@ -28,12 +28,7 @@ export interface UseSortableReturn {
     container: SortableContainerBinding;
     isDragging: ComputedRef<boolean>;
     dragId: ComputedRef<SortableId | null>;
-    dragPosition: ComputedRef<{
-        x: number;
-        y: number;
-    } | null>;
     dropIndex: ComputedRef<number | null>;
-    pointerCaptureActive: ComputedRef<boolean>;
     announcement: ComputedRef<string>;
     getItemLabel: (id: SortableId) => string;
 }
@@ -45,6 +40,18 @@ export interface InstanceHandle {
     getId: (item: unknown) => SortableId;
     getElements: () => Map<SortableId, Element | null>;
     setExternalDropIndex: (index: number | null) => void;
+    /** The travelling subject's block size, so a receiving list can size its vacancy. */
+    setExternalSubjectBlock: (block: number | null) => void;
+    /**
+     * Where a subject arriving at `index` comes to rest, in viewport coordinates — the
+     * endpoint of the release flight. The RECEIVER answers it because the receiver owns
+     * the gap; the releasing list has already closed behind the subject. `null` while
+     * this list is unarmed or unmounted.
+     */
+    getVacancyOrigin: (index: number) => {
+        x: number;
+        y: number;
+    } | null;
     acceptExternal: (index: number, item: unknown) => void;
     focusItem: (id: SortableId) => void;
 }