ropav 0.3.0 → 0.3.1

package/dist/composables/use-date-range-picker-state.d.ts

@@ -1,7 +1,7 @@
-import type { FieldOptions, FormatterOptions, Granularity, TimeValue } from "../utils/date-format";
-import type { DateRange } from "./use-calendar";
-import type { FormValidationState, ValidationBehavior } from "./use-form-validation-state";
-import type { OverlayTriggerState } from "./use-overlay-trigger-state";
+import type { FieldOptions, FormatterOptions, Granularity, TimeValue } from "../utils/date-format.js";
+import type { DateRange } from "./use-calendar.js";
+import type { FormValidationState, ValidationBehavior } from "./use-form-validation-state.js";
+import type { OverlayTriggerState } from "./use-overlay-trigger-state.js";
 import type { DateValue } from "@internationalized/date";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 import { DateFormatter } from "@internationalized/date";

package/dist/composables/use-date-range-picker.d.ts

@@ -1,10 +1,10 @@
-import type { DayOfWeek } from "../utils/calendar";
-import type { FocusManager } from "../utils/focus";
-import type { PageBehavior } from "./use-calendar-state";
-import type { DateRangePickerState } from "./use-date-range-picker-state";
-import type { FieldIdsContext } from "./use-field-ids";
-import type { FormValidationState } from "./use-form-validation-state";
-import type { UsePressHandlers } from "./use-press";
+import type { DayOfWeek } from "../utils/calendar.js";
+import type { FocusManager } from "../utils/focus.js";
+import type { PageBehavior } from "./use-calendar-state.js";
+import type { DateRangePickerState } from "./use-date-range-picker-state.js";
+import type { FieldIdsContext } from "./use-field-ids.js";
+import type { FormValidationState } from "./use-form-validation-state.js";
+import type { UsePressHandlers } from "./use-press.js";
 import type { DateValue } from "@internationalized/date";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseDateRangePickerOptions {

package/dist/composables/use-date-segment.d.ts

@@ -1,5 +1,5 @@
-import type { FocusManager } from "../utils/focus";
-import type { DateFieldState, DateSegment } from "./use-date-field-state";
+import type { FocusManager } from "../utils/focus.js";
+import type { DateFieldState, DateSegment } from "./use-date-field-state.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseDateSegmentOptions {
     /** The segment this is behaviour for. A getter, because the field rebuilds them on every edit. */

package/dist/composables/use-default-date-props.d.ts

@@ -1,4 +1,4 @@
-import type { Granularity } from "../utils/date-format";
+import type { Granularity } from "../utils/date-format.js";
 import type { DateValue } from "@internationalized/date";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface DefaultDateProps {

package/dist/composables/use-dialog-trigger.d.ts

@@ -1,5 +1,5 @@
-import type { PressResponder } from "./press-responder";
-import type { OverlayTriggerState } from "./use-overlay-trigger-state";
+import type { PressResponder } from "./press-responder.js";
+import type { OverlayTriggerState } from "./use-overlay-trigger-state.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseDialogTriggerOptions {
     isDisabled?: MaybeRefOrGetter<boolean | undefined>;

package/dist/composables/use-disclosure-group-navigation.d.ts

@@ -1,4 +1,4 @@
-import type { DisclosureKey } from "./use-disclosure-group";
+import type { DisclosureKey } from "./use-disclosure-group.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseDisclosureGroupNavigationOptions {
     /** Whether more than one item can be expanded at a time. */

package/dist/composables/use-dnd-persisted-keys.d.ts

@@ -1,6 +1,6 @@
-import type { CollectionKey } from "./use-collection";
-import type { DragAndDropHooks } from "./use-drag-and-drop";
-import type { UseDroppableCollectionStateReturn } from "./use-droppable-collection-state";
+import type { CollectionKey } from "./use-collection.js";
+import type { DragAndDropHooks } from "./use-drag-and-drop.js";
+import type { UseDroppableCollectionStateReturn } from "./use-droppable-collection-state.js";
 import type { ComputedRef } from "vue";
 /**
  * The keys a virtualized collection has to keep rendered while a drag is in flight, ported from

package/dist/composables/use-drag-and-drop.d.ts

@@ -1,14 +1,14 @@
-import type { DragItem, DragKey, DragPreviewRenderer, DragType, DragTypes, DraggableCollectionEndEvent, DraggableCollectionStartEvent, DropOperation, DropTarget, DropTargetDelegate, DroppableCollectionActivateEvent, DroppableCollectionDropEvent, DroppableCollectionInsertDropEvent, DroppableCollectionOnItemDropEvent, DroppableCollectionReorderEvent, DroppableCollectionRootDropEvent, ItemDropTarget } from "../utils/dnd-types";
+import type { DragItem, DragKey, DragPreviewRenderer, DragType, DragTypes, DraggableCollectionEndEvent, DraggableCollectionStartEvent, DropOperation, DropTarget, DropTargetDelegate, DroppableCollectionActivateEvent, DroppableCollectionDropEvent, DroppableCollectionInsertDropEvent, DroppableCollectionOnItemDropEvent, DroppableCollectionReorderEvent, DroppableCollectionRootDropEvent, ItemDropTarget } from "../utils/dnd-types.js";
 import type { MaybeRefOrGetter } from "vue";
-import { ListDropTargetDelegate } from "../utils/dnd-list-drop-target-delegate";
-import { isVirtualDragging } from "./drag-manager";
-import { useDraggableCollection } from "./use-draggable-collection";
-import { useDraggableCollectionState } from "./use-draggable-collection-state";
-import { useDraggableItem } from "./use-draggable-item";
-import { useDropIndicator } from "./use-drop-indicator";
-import { useDroppableCollection } from "./use-droppable-collection";
-import { useDroppableCollectionState } from "./use-droppable-collection-state";
-import { useDroppableItem } from "./use-droppable-item";
+import { ListDropTargetDelegate } from "../utils/dnd-list-drop-target-delegate.js";
+import { isVirtualDragging } from "./drag-manager.js";
+import { useDraggableCollection } from "./use-draggable-collection.js";
+import { useDraggableCollectionState } from "./use-draggable-collection-state.js";
+import { useDraggableItem } from "./use-draggable-item.js";
+import { useDropIndicator } from "./use-drop-indicator.js";
+import { useDroppableCollection } from "./use-droppable-collection.js";
+import { useDroppableCollectionState } from "./use-droppable-collection-state.js";
+import { useDroppableItem } from "./use-droppable-item.js";
 export interface DragAndDropOptions {
     /**
      * The items to put on the drag, for the keys being dragged.

package/dist/composables/use-drag.d.ts

@@ -1,5 +1,5 @@
-import type { DragEndEvent, DragItem, DragMoveEvent, DragPreviewRenderer, DragStartEvent, DropOperation } from "../utils/dnd-types";
-import type { PressEvent } from "./use-press";
+import type { DragEndEvent, DragItem, DragMoveEvent, DragPreviewRenderer, DragStartEvent, DropOperation } from "../utils/dnd-types.js";
+import type { PressEvent } from "./use-press.js";
 import type { ComputedRef, MaybeRefOrGetter, ShallowRef } from "vue";
 export interface UseDragOptions {
     /** The items being dragged, read when the drag starts. */

package/dist/composables/use-draggable-collection-state.d.ts

@@ -1,5 +1,5 @@
-import type { DragCollection, DragItem, DragKey, DragMoveEvent, DragPreviewRenderer, DragStartEvent, DraggableCollectionEndEvent, DraggableCollectionMoveEvent, DraggableCollectionStartEvent, DropOperation } from "../utils/dnd-types";
-import type { UseSelectionManagerReturn } from "./use-selection-manager";
+import type { DragCollection, DragItem, DragKey, DragMoveEvent, DragPreviewRenderer, DragStartEvent, DraggableCollectionEndEvent, DraggableCollectionMoveEvent, DraggableCollectionStartEvent, DropOperation } from "../utils/dnd-types.js";
+import type { UseSelectionManagerReturn } from "./use-selection-manager.js";
 import type { ComputedRef, MaybeRefOrGetter, ShallowRef } from "vue";
 export interface UseDraggableCollectionStateOptions<T = unknown> {
     collection: DragCollection<T>;

package/dist/composables/use-draggable-collection.d.ts

@@ -1,4 +1,4 @@
-import type { UseDraggableCollectionStateReturn } from "./use-draggable-collection-state";
+import type { UseDraggableCollectionStateReturn } from "./use-draggable-collection-state.js";
 import type { ShallowRef } from "vue";
 /**
  * Marks this collection as the one a drag came from, ported from React Aria's

package/dist/composables/use-draggable-item.d.ts

@@ -1,7 +1,7 @@
-import type { DragKey } from "../utils/dnd-types";
-import type { UseDragHandlers } from "./use-drag";
-import type { UseDraggableCollectionStateReturn } from "./use-draggable-collection-state";
-import type { PressEvent } from "./use-press";
+import type { DragKey } from "../utils/dnd-types.js";
+import type { UseDragHandlers } from "./use-drag.js";
+import type { UseDraggableCollectionStateReturn } from "./use-draggable-collection-state.js";
+import type { PressEvent } from "./use-press.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseDraggableItemOptions {
     key: DragKey;

package/dist/composables/use-drawer-drag.d.ts

@@ -1,4 +1,4 @@
-import type { DrawerPlacement } from "../components/drawer/drawer.types";
+import type { DrawerPlacement } from "../components/drawer/drawer.types.js";
 import type { MaybeRefOrGetter } from "vue";
 export interface UseDrawerDragOptions {
     /** The panel that moves. */

package/dist/composables/use-drop-indicator.d.ts

@@ -1,5 +1,5 @@
-import type { UseDroppableCollectionStateReturn } from "./use-droppable-collection-state";
-import type { UseDroppableItemOptions } from "./use-droppable-item";
+import type { UseDroppableCollectionStateReturn } from "./use-droppable-collection-state.js";
+import type { UseDroppableItemOptions } from "./use-droppable-item.js";
 import type { ComputedRef, ShallowRef } from "vue";
 export type UseDropIndicatorOptions = UseDroppableItemOptions;
 export interface UseDropIndicatorReturn {

package/dist/composables/use-drop.d.ts

@@ -1,4 +1,4 @@
-import type { DragTypes, DropActivateEvent, DropEnterEvent, DropEvent, DropExitEvent, DropMoveEvent, DropOperation } from "../utils/dnd-types";
+import type { DragTypes, DropActivateEvent, DropEnterEvent, DropEvent, DropExitEvent, DropMoveEvent, DropOperation } from "../utils/dnd-types.js";
 import type { ComputedRef, MaybeRefOrGetter, ShallowRef } from "vue";
 export interface UseDropOptions {
     /** The drop target element. */

package/dist/composables/use-droppable-collection-state.d.ts

@@ -1,5 +1,5 @@
-import type { DragCollection, DragKey, DragType, DragTypes, DropOperation, DropTarget, DroppableCollectionDropEvent, DroppableCollectionEnterEvent, DroppableCollectionExitEvent, DroppableCollectionInsertDropEvent, DroppableCollectionOnItemDropEvent, DroppableCollectionReorderEvent, DroppableCollectionRootDropEvent, ItemDropTarget } from "../utils/dnd-types";
-import type { UseSelectionManagerReturn } from "./use-selection-manager";
+import type { DragCollection, DragKey, DragType, DragTypes, DropOperation, DropTarget, DroppableCollectionDropEvent, DroppableCollectionEnterEvent, DroppableCollectionExitEvent, DroppableCollectionInsertDropEvent, DroppableCollectionOnItemDropEvent, DroppableCollectionReorderEvent, DroppableCollectionRootDropEvent, ItemDropTarget } from "../utils/dnd-types.js";
+import type { UseSelectionManagerReturn } from "./use-selection-manager.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /** Everything the validity matrix needs to judge one candidate drop. */
 export interface DropOperationEvent {

package/dist/composables/use-droppable-collection.d.ts

@@ -1,6 +1,6 @@
-import type { DragKey, DragKeyboardDelegate, DropTargetDelegate, DroppableCollectionActivateEvent } from "../utils/dnd-types";
-import type { UseDropHandlers } from "./use-drop";
-import type { UseDroppableCollectionStateOptions, UseDroppableCollectionStateReturn } from "./use-droppable-collection-state";
+import type { DragKey, DragKeyboardDelegate, DropTargetDelegate, DroppableCollectionActivateEvent } from "../utils/dnd-types.js";
+import type { UseDropHandlers } from "./use-drop.js";
+import type { UseDroppableCollectionStateOptions, UseDroppableCollectionStateReturn } from "./use-droppable-collection-state.js";
 import type { ComputedRef, ShallowRef } from "vue";
 /** Extra keys a collection's keyboard delegate may offer beyond the drag navigation ones. */
 export interface DroppableCollectionKeyboardDelegate extends DragKeyboardDelegate {

package/dist/composables/use-droppable-item.d.ts

@@ -1,5 +1,5 @@
-import type { DropTarget } from "../utils/dnd-types";
-import type { UseDroppableCollectionStateReturn } from "./use-droppable-collection-state";
+import type { DropTarget } from "../utils/dnd-types.js";
+import type { UseDroppableCollectionStateReturn } from "./use-droppable-collection-state.js";
 import type { ComputedRef, ShallowRef } from "vue";
 export interface UseDroppableItemOptions {
     /** The position within the collection this element stands for. */

package/dist/composables/use-enter-exit.js

@@ -1,4 +1,5 @@
-import { computed, nextTick, onScopeDispose, shallowRef, toValue, watch } from "vue";
+import { createAnimationSettleWaiter } from "../utils/animation-settled.js";
+import { computed, onScopeDispose, shallowRef, toValue, watch } from "vue";
 //#region src/composables/use-enter-exit.ts
 /**
 * Keep an element mounted until its exit animation has finished, ported from React Aria's
@@ -30,54 +31,23 @@ var useEnterExit = (options) => {
 	const isReady = computed(() => toValue(options.isReady) ?? true);
 	const isEntering = computed(() => entering.value && isReady.value);
 	const isExiting = computed(() => exitState.value === "exiting");
-	let cancelled = false;
 	/**
-	* The latest wait of each phase, so a superseded one cannot resolve over the top of it.
-	*
-	* One counter per phase rather than one shared: entry and exit are waited for independently, and
-	* a single counter meant an exit beginning while the entry was still animating invalidated that
-	* entry's wait for good. Nothing ever cleared the entry state after that, and the element stayed
-	* at the first frame of its entry animation — scaled down and fully transparent, so an overlay
-	* closed and reopened quickly became invisible until it was destroyed.
+	* A waiter per phase rather than one shared, because entry and exit are waited for
+	* independently. Sharing one meant an exit beginning while the entry was still animating
+	* superseded that entry's wait for good. Nothing ever cleared the entry state after that, and
+	* the element stayed at the first frame of its entry animation — scaled down and fully
+	* transparent, so an overlay closed and reopened quickly became invisible until it was
+	* destroyed.
 	*/
-	const generations = {
-		entering: 0,
-		exiting: 0
-	};
-	/**
-	* Resolve once every animation running on the element has settled.
-	*
-	* The animations are read a tick after being asked for, not straight away: the state that
-	* triggers them is rendered as an attribute, and reading before that attribute is in the DOM
-	* finds no animations at all — which would clear the state again and leave the animation never
-	* playing.
-	*/
-	const whenSettled = (phase, onEnd) => {
-		const current = ++generations[phase];
-		nextTick(() => {
-			if (cancelled || current !== generations[phase]) return;
-			const element = getElement();
-			if (!element || typeof element.getAnimations !== "function") {
-				onEnd();
-				return;
-			}
-			const animations = element.getAnimations();
-			if (animations.length === 0) {
-				onEnd();
-				return;
-			}
-			Promise.allSettled(animations.map((animation) => animation.finished)).then(() => {
-				if (!cancelled && current === generations[phase]) onEnd();
-			});
-		});
-	};
+	const entry = createAnimationSettleWaiter(getElement);
+	const exit = createAnimationSettleWaiter(getElement);
 	watch([isEntering, () => getElement()], ([active]) => {
 		if (!active) return;
 		const element = getElement();
 		if (element && typeof element.getAnimations === "function") {
 			for (const animation of element.getAnimations()) if (typeof CSSTransition !== "undefined" && animation instanceof CSSTransition) animation.cancel();
 		}
-		whenSettled("entering", () => {
+		entry.whenSettled(() => {
 			entering.value = false;
 		});
 	}, {
@@ -94,7 +64,7 @@ var useEnterExit = (options) => {
 	}, { flush: "sync" });
 	watch([isExiting, () => getElement()], ([active]) => {
 		if (!active) return;
-		whenSettled("exiting", () => {
+		exit.whenSettled(() => {
 			if (exitState.value === "exiting") exitState.value = "closed";
 		});
 	}, {
@@ -102,7 +72,8 @@ var useEnterExit = (options) => {
 		immediate: true
 	});
 	onScopeDispose(() => {
-		cancelled = true;
+		entry.cancel();
+		exit.cancel();
 	}, true);
 	return {
 		isEntering,

package/dist/composables/use-form-validation.d.ts

@@ -1,4 +1,4 @@
-import type { FormValidationState, ValidatableElement } from "./use-form-validation-state";
+import type { FormValidationState, ValidatableElement } from "./use-form-validation-state.js";
 import type { MaybeRefOrGetter, Ref } from "vue";
 export interface UseFormValidationOptions {
     /** Called instead of focusing the element when a failed submit lands on this field. */

package/dist/composables/use-grid-keyboard.d.ts

@@ -1,7 +1,7 @@
-import type { CollectionKey } from "./use-collection";
-import type { ListKeyboardLayoutDelegate } from "./use-list-keyboard";
-import type { UseSelectionManagerReturn } from "./use-selection-manager";
-import type { UseTableCollectionReturn } from "./use-table-collection";
+import type { CollectionKey } from "./use-collection.js";
+import type { ListKeyboardLayoutDelegate } from "./use-list-keyboard.js";
+import type { UseSelectionManagerReturn } from "./use-selection-manager.js";
+import type { UseTableCollectionReturn } from "./use-table-collection.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /**
  * Where focus sits in a grid.

package/dist/composables/use-grid-selection-announcement.d.ts

@@ -1,5 +1,5 @@
-import type { UseCollectionReturn } from "./use-collection";
-import type { UseSelectionManagerReturn } from "./use-selection-manager";
+import type { UseCollectionReturn } from "./use-collection.js";
+import type { UseSelectionManagerReturn } from "./use-selection-manager.js";
 export interface UseGridSelectionAnnouncementOptions {
     collection: UseCollectionReturn;
     selection: UseSelectionManagerReturn;

package/dist/composables/use-input-otp.d.ts

@@ -1,4 +1,4 @@
-import type { PushPasswordManagerStrategy } from "./use-password-manager-badge";
+import type { PushPasswordManagerStrategy } from "./use-password-manager-badge.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /** Ready-made patterns for the three code alphabets almost every one-time code uses. */
 export declare const REGEXP_ONLY_DIGITS = "^\\d+$";

package/dist/composables/use-list-data.d.ts

@@ -1,5 +1,5 @@
-import type { CollectionKey } from "./use-collection";
-import type { CollectionSelection } from "./use-selection-manager";
+import type { CollectionKey } from "./use-collection.js";
+import type { CollectionSelection } from "./use-selection-manager.js";
 import type { ComputedRef } from "vue";
 export interface UseListDataOptions<T> {
     /** Initial items in the list. */

package/dist/composables/use-list-keyboard.d.ts

@@ -1,6 +1,6 @@
-import type { Rect, Size } from "../utils/virtualizer-geometry";
-import type { CollectionKey, UseCollectionReturn } from "./use-collection";
-import type { UseSelectionManagerReturn } from "./use-selection-manager";
+import type { Rect, Size } from "../utils/virtualizer-geometry.js";
+import type { CollectionKey, UseCollectionReturn } from "./use-collection.js";
+import type { UseSelectionManagerReturn } from "./use-selection-manager.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export type ListOrientation = "horizontal" | "vertical";
 /**

package/dist/composables/use-locale.d.ts

@@ -1,4 +1,4 @@
-import type { Locale } from "../utils/locale";
+import type { Locale } from "../utils/locale.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /**
  * The locale an ancestor has chosen, or `null` when nobody has and the browser's own should win.

package/dist/composables/use-long-press.d.ts

@@ -1,4 +1,4 @@
-import type { PressEvent, UsePressHandlers } from "./use-press";
+import type { PressEvent, UsePressHandlers } from "./use-press.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /** How long the press has to be held before it counts as a long press. */
 export declare const LONG_PRESS_THRESHOLD_MS = 500;

package/dist/composables/use-menu-trigger.d.ts

@@ -1,6 +1,6 @@
-import type { PressResponder } from "./press-responder";
-import type { OverlayType } from "./use-overlay-trigger";
-import type { FocusStrategy, MenuTriggerState } from "./use-overlay-trigger-state";
+import type { PressResponder } from "./press-responder.js";
+import type { OverlayType } from "./use-overlay-trigger.js";
+import type { FocusStrategy, MenuTriggerState } from "./use-overlay-trigger-state.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /** How the menu is opened. */
 export type MenuTriggerType = "press" | "longPress";

package/dist/composables/use-menu.d.ts

@@ -1,6 +1,6 @@
-import type { CollectionKey } from "./use-collection";
-import type { FocusStrategy } from "./use-overlay-trigger-state";
-import type { CollectionSelection, DisabledBehavior, SelectionBehavior, SelectionMode } from "./use-selection-manager";
+import type { CollectionKey } from "./use-collection.js";
+import type { FocusStrategy } from "./use-overlay-trigger-state.js";
+import type { CollectionSelection, DisabledBehavior, SelectionBehavior, SelectionMode } from "./use-selection-manager.js";
 import type { ComputedRef, MaybeRefOrGetter, ShallowRef } from "vue";
 export interface UseMenuOptions {
     /** Overrides the menu's id, which a trigger's `aria-controls` points at. */

package/dist/composables/use-modal-overlay.d.ts

@@ -1,4 +1,4 @@
-import type { PageSize, ViewportSize } from "./use-viewport-size";
+import type { PageSize, ViewportSize } from "./use-viewport-size.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseModalOverlayOptions {
     /**

package/dist/composables/use-move.d.ts

@@ -1,4 +1,4 @@
-import type { PointerType } from "./use-press";
+import type { PointerType } from "./use-press.js";
 /** The modifier state every move event carries over from the event that produced it. */
 interface ModifierKeys {
     shiftKey: boolean;

package/dist/composables/use-number-field-state.d.ts

@@ -1,4 +1,4 @@
-import type { FormValidationState, ValidationBehavior, ValidationFunction } from "./use-form-validation-state";
+import type { FormValidationState, ValidationBehavior, ValidationFunction } from "./use-form-validation-state.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 import { NumberParser } from "@internationalized/number";
 /**

package/dist/composables/use-number-field.d.ts

@@ -1,6 +1,6 @@
-import type { FieldIdsContext } from "./use-field-ids";
-import type { NumberFieldCommitBehavior, NumberFieldState, UseNumberFieldStateOptions } from "./use-number-field-state";
-import type { SpinStepperHandlers } from "./use-spin-button";
+import type { FieldIdsContext } from "./use-field-ids.js";
+import type { NumberFieldCommitBehavior, NumberFieldState, UseNumberFieldStateOptions } from "./use-number-field-state.js";
+import type { SpinStepperHandlers } from "./use-spin-button.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /** What a stepper button gets from the field, kept apart from its listeners. */
 export interface NumberFieldStepper {

package/dist/composables/use-number-field.js

@@ -9,7 +9,7 @@ import { useNumberFieldState } from "./use-number-field-state.js";
 import { useFormattedTextField } from "./use-formatted-text-field.js";
 import { useScrollWheel } from "./use-scroll-wheel.js";
 import { useSpinButton } from "./use-spin-button.js";
-import { computed, nextTick, shallowRef, toValue, watch } from "vue";
+import { computed, shallowRef, toValue, watch } from "vue";
 import { NumberFormatter } from "@internationalized/number";
 //#region src/composables/use-number-field.ts
 /** A number input kept off-document, used only to borrow the browser's range validation. */
@@ -128,10 +128,7 @@ var useNumberField = (options = {}) => {
 		setInputValue: state.setInputValue,
 		validate: state.validate
 	});
-	useFormReset(element, () => state.defaultNumberValue.value, (value) => {
-		state.setNumberValue(value);
-		nextTick(reassert);
-	});
+	useFormReset(element, () => state.defaultNumberValue.value, state.setNumberValue);
 	/**
 	* Range validation borrowed from a real number input.
 	*

package/dist/composables/use-overlay-position.d.ts

@@ -1,4 +1,4 @@
-import type { Placement, PlacementAxis } from "../utils/position";
+import type { Placement, PlacementAxis } from "../utils/position.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseOverlayPositionOptions {
     /** The element the overlay is positioned against. */

package/dist/composables/use-overlay-trigger-state.d.ts

@@ -1,4 +1,4 @@
-import type { CollectionKey } from "./use-collection";
+import type { CollectionKey } from "./use-collection.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /** Which end of a collection receives focus when an overlay opens. */
 export type FocusStrategy = "first" | "last";

package/dist/composables/use-overlay-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { OverlayTriggerState } from "./use-overlay-trigger-state";
+import type { OverlayTriggerState } from "./use-overlay-trigger-state.js";
 import type { ComputedRef } from "vue";
 /** What the trigger opens, which decides how `aria-haspopup` is announced. */
 export type OverlayType = "dialog" | "menu" | "listbox" | "tree" | "grid";

package/dist/composables/use-radio-group-state.d.ts

@@ -1,4 +1,4 @@
-import type { FormValidationState, ValidationBehavior, ValidationFunction } from "./use-form-validation-state";
+import type { FormValidationState, ValidationBehavior, ValidationFunction } from "./use-form-validation-state.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseRadioGroupStateOptions {
     /** Selected value. Makes the group controlled. */

package/dist/composables/use-range-calendar-state.d.ts

@@ -1,5 +1,5 @@
-import type { DateRange, RangeCalendarLikeState } from "./use-calendar";
-import type { UseCalendarStateOptions } from "./use-calendar-state";
+import type { DateRange, RangeCalendarLikeState } from "./use-calendar.js";
+import type { UseCalendarStateOptions } from "./use-calendar-state.js";
 import type { CalendarDate, DateValue } from "@internationalized/date";
 import type { MaybeRefOrGetter } from "vue";
 export interface UseRangeCalendarStateOptions extends Omit<UseCalendarStateOptions, "defaultValue" | "isDateUnavailable" | "onChange" | "selectionMode" | "value"> {

package/dist/composables/use-range-calendar.d.ts

@@ -1,5 +1,5 @@
-import type { UseCalendarOptions, UseCalendarReturn } from "./use-calendar";
-import type { RangeCalendarState } from "./use-range-calendar-state";
+import type { UseCalendarOptions, UseCalendarReturn } from "./use-calendar.js";
+import type { RangeCalendarState } from "./use-range-calendar-state.js";
 import type { MaybeRefOrGetter } from "vue";
 /**
  * What to do with a half-built range when the pointer comes up somewhere else, or focus leaves.

package/dist/composables/use-search-field.d.ts

@@ -1,5 +1,5 @@
-import type { PressResponder } from "./press-responder";
-import type { UseTextFieldOptions, UseTextFieldReturn } from "./use-text-field";
+import type { PressResponder } from "./press-responder.js";
+import type { UseTextFieldOptions, UseTextFieldReturn } from "./use-text-field.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseSearchFieldOptions extends Omit<UseTextFieldOptions, "type"> {
     /** Kind of control the browser should offer. @default "search" */

package/dist/composables/use-select-state.d.ts

@@ -1,7 +1,7 @@
-import type { CollectionKey, UseCollectionReturn } from "./use-collection";
-import type { FormValidationState, ValidationBehavior, ValidationFunction } from "./use-form-validation-state";
-import type { MenuTriggerState } from "./use-overlay-trigger-state";
-import type { DisabledBehavior, UseSelectionManagerReturn } from "./use-selection-manager";
+import type { CollectionKey, UseCollectionReturn } from "./use-collection.js";
+import type { FormValidationState, ValidationBehavior, ValidationFunction } from "./use-form-validation-state.js";
+import type { MenuTriggerState } from "./use-overlay-trigger-state.js";
+import type { DisabledBehavior, UseSelectionManagerReturn } from "./use-selection-manager.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 /** Whether one or several options can be chosen. */
 export type SelectSelectionMode = "single" | "multiple";

package/dist/composables/use-select.d.ts

@@ -1,7 +1,7 @@
-import type { PressResponder } from "./press-responder";
-import type { UseFieldIdsReturn } from "./use-field-ids";
-import type { ValidationResult } from "./use-form-validation-state";
-import type { UseSelectStateReturn } from "./use-select-state";
+import type { PressResponder } from "./press-responder.js";
+import type { UseFieldIdsReturn } from "./use-field-ids.js";
+import type { ValidationResult } from "./use-form-validation-state.js";
+import type { UseSelectStateReturn } from "./use-select-state.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export interface UseSelectOptions {
     isDisabled?: MaybeRefOrGetter<boolean | undefined>;

package/dist/composables/use-selection-manager.d.ts

@@ -1,4 +1,4 @@
-import type { CollectionKey, UseCollectionReturn } from "./use-collection";
+import type { CollectionKey, UseCollectionReturn } from "./use-collection.js";
 import type { ComputedRef, MaybeRefOrGetter } from "vue";
 export type SelectionMode = "none" | "single" | "multiple";
 /**

package/dist/composables/use-shared-element.js

@@ -1,4 +1,5 @@
 import { createContext } from "../utils/create-context.js";
+import { createAnimationSettleWaiter } from "../utils/animation-settled.js";
 import { computed, nextTick, onScopeDispose, shallowRef, toValue, watch } from "vue";
 //#region src/composables/use-shared-element.ts
 var createSharedElementScope = () => ({ snapshots: /* @__PURE__ */ new Map() });
@@ -45,7 +46,6 @@ var useSharedElement = (options) => {
 	let frame = null;
 	/** The snapshot this element stored, so a newer one is never mistaken for it. */
 	let stored = null;
-	let generation = 0;
 	const cancelFrame = () => {
 		if (frame != null && typeof cancelAnimationFrame === "function") cancelAnimationFrame(frame);
 		frame = null;
@@ -61,31 +61,7 @@ var useSharedElement = (options) => {
 			callback();
 		});
 	};
-	/**
-	* Resolve once every animation running on the element has settled.
-	*
-	* Read a tick after being asked for, because the state that triggers the animations is rendered
-	* as an attribute and reading before that attribute is in the DOM finds no animations at all.
-	*/
-	const whenSettled = (onEnd) => {
-		const current = ++generation;
-		nextTick(() => {
-			if (cancelled || current !== generation) return;
-			const element = getElement();
-			if (!element || typeof element.getAnimations !== "function") {
-				onEnd();
-				return;
-			}
-			const animations = element.getAnimations();
-			if (animations.length === 0) {
-				onEnd();
-				return;
-			}
-			Promise.allSettled(animations.map((animation) => animation.finished)).then(() => {
-				if (!cancelled && current === generation) onEnd();
-			});
-		});
-	};
+	const settle = createAnimationSettleWaiter(getElement);
 	const takeSnapshot = () => {
 		const element = getElement();
 		if (!element || !element.isConnected) return;
@@ -147,7 +123,7 @@ var useSharedElement = (options) => {
 			}
 			scope.snapshots.delete(name.value);
 			state.value = "exiting";
-			whenSettled(() => {
+			settle.whenSettled(() => {
 				if (state.value === "exiting") state.value = "hidden";
 			});
 		});
@@ -176,6 +152,7 @@ var useSharedElement = (options) => {
 	});
 	onScopeDispose(() => {
 		cancelled = true;
+		settle.cancel();
 		cancelFrame();
 		takeSnapshot();
 	}, true);

package/dist/composables/use-slider-thumb.d.ts

@@ -1,4 +1,4 @@
-import type { SliderOrientation, SliderState } from "./use-slider-state";
+import type { SliderOrientation, SliderState } from "./use-slider-state.js";
 import type { CSSProperties, ComputedRef, MaybeRefOrGetter, Ref } from "vue";
 export interface UseSliderThumbOptions {
     state: SliderState;

package/dist/composables/use-slider.d.ts

@@ -1,4 +1,4 @@
-import type { SliderState } from "./use-slider-state";
+import type { SliderState } from "./use-slider-state.js";
 import type { CSSProperties, ComputedRef, MaybeRefOrGetter, Ref } from "vue";
 export interface UseSliderOptions {
     state: SliderState;