ropav 0.13.0 → 0.15.0

package/dist/composables/use-press.js

@@ -1,31 +1,8 @@
-import { isAndroid, isMac } from "../utils/platform.js";
+import { isMac } from "../utils/platform.js";
+import { isVirtualClick, isVirtualPointerEvent } from "./virtual-event.js";
 import { computed, onScopeDispose, shallowRef, toValue, watch } from "vue";
 //#region src/composables/use-press.ts
 /**
-* Whether a click came from something other than a pointer.
-*
-* Ported from React Aria's `isVirtualClick`. A screen reader and `element.click()` both
-* produce a click with no pointer data behind it, which is the only way to tell them apart
-* from a real one.
-*/
-var isVirtualClick = (event) => {
-	if (event.pointerType === "" && event.isTrusted) return true;
-	if (isAndroid() && event.pointerType) return event.type === "click" && event.buttons === 1;
-	return event.detail === 0 && !event.pointerType;
-};
-/**
-* Whether a pointer event was synthesised by assistive technology.
-*
-* A screen reader activating an element reports a zero-sized pointer. Safari on iOS gives
-* such events the wrong coordinates and target, so they have to be left to the click handler.
-*
-* Android needs a shape of its own, and the zero-size test is turned off there rather than left
-* to miss: TalkBack's double tap reports a one-by-one pointer claiming to be a mouse. Every part
-* of that is load-bearing — pressure alone would catch real presses in Safari, which reports zero
-* for those too, and the mouse claim is what separates the double tap from a touch screen press.
-*/
-var isVirtualPointerEvent = (event) => !isAndroid() && event.width === 0 && event.height === 0 || isAndroid() && event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === "mouse";
-/**
 * Whether an enter or a leave came from a pointer with no hover to report.
 *
 * A touch pointer is created where the finger lands and destroyed where it lifts, and the browser
@@ -385,4 +362,4 @@ var usePress = (options = {}) => {
 	};
 };
 //#endregion
-export { isVirtualClick, isVirtualPointerEvent, usePress };
+export { usePress };

package/dist/composables/use-range-calendar.js

@@ -1,4 +1,4 @@
-import { isVirtualPointerEvent } from "./use-press.js";
+import { isVirtualPointerEvent } from "./virtual-event.js";
 import { useCalendar } from "./use-calendar.js";
 import { onScopeDispose, toValue, watch } from "vue";
 //#region src/composables/use-range-calendar.ts

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

@@ -1,6 +1,6 @@
 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 { MenuTriggerState } from "./use-menu-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. */

package/dist/composables/use-select-state.js

@@ -1,8 +1,8 @@
 import { useControllableState } from "./use-controllable-state.js";
-import { useMenuTriggerState } from "./use-overlay-trigger-state.js";
 import { useCollection } from "./use-collection.js";
 import { createListCollection } from "../utils/virtualizer-collection.js";
 import { useFormValidationState } from "./use-form-validation-state.js";
+import { useMenuTriggerState } from "./use-menu-trigger-state.js";
 import { useSelectionManager } from "./use-selection-manager.js";
 import { computed, shallowRef, toValue } from "vue";
 //#region src/composables/use-select-state.ts

package/dist/composables/use-slider.js

@@ -1,4 +1,4 @@
-import { setInteractionModality } from "./use-interaction-states.js";
+import { setInteractionModality } from "./interaction-modality.js";
 import { useMove } from "./use-move.js";
 import { clamp } from "../utils/number.js";
 import { computed, onScopeDispose, toValue } from "vue";

package/dist/composables/use-toast-region.js

@@ -1,4 +1,5 @@
-import { getInteractionModality, retainInteractionModality, useInteractionStates } from "./use-interaction-states.js";
+import { getInteractionModality, retainInteractionModality } from "./interaction-modality.js";
+import { useInteractionStates } from "./use-interaction-states.js";
 import { TOP_LAYER_ATTRIBUTE } from "../utils/top-layer.js";
 import { willOpenKeyboard } from "../utils/platform.js";
 import { useLocalizedStringFormatter } from "./use-localized-string-formatter.js";

package/dist/composables/use-tooltip-trigger-state.js

@@ -27,20 +27,6 @@ var clearCooldownTimeout = () => {
 	globalCooldownTimeout = null;
 };
 /**
-* Forget the shared warmup state.
-*
-* For a test: the registry and both timers outlive any one component, so a case that leaves a
-* tooltip warm would make the next one open with no delay and read as a bug in that test instead.
-*/
-var resetTooltipWarmup = () => {
-	tooltips.clear();
-	clearWarmUpTimeout();
-	clearCooldownTimeout();
-	globalWarmedUp = false;
-};
-/** How many tooltips are registered. For a test proving a disposed trigger left nothing behind. */
-var getRegisteredTooltipCount = () => tooltips.size;
-/**
 * Open state for a tooltip trigger, ported from React Stately's `useTooltipTriggerState`.
 *
 * Two things beyond a plain overlay trigger, and both are about time rather than state. A tooltip
@@ -138,4 +124,4 @@ var useTooltipTriggerState = (options = {}) => {
 	};
 };
 //#endregion
-export { getRegisteredTooltipCount, resetTooltipWarmup, useTooltipTriggerState };
+export { useTooltipTriggerState };

package/dist/composables/use-tooltip-trigger.js

@@ -1,5 +1,5 @@
 import { useId as useId$1 } from "./use-id.js";
-import { getInteractionModality, isFocusVisible, retainInteractionModality } from "./use-interaction-states.js";
+import { getInteractionModality, isFocusVisible, retainInteractionModality } from "./interaction-modality.js";
 import { computed, onScopeDispose, shallowRef, toValue, watch } from "vue";
 //#region src/composables/use-tooltip-trigger.ts
 /**

package/dist/composables/use-viewport-size.d.ts

@@ -3,11 +3,6 @@ export interface ViewportSize {
     width: number;
     height: number;
 }
-export interface PageSize {
-    /** Absent on the server, and while there is no document to measure. */
-    width: number | undefined;
-    height: number | undefined;
-}
 /**
  * Track the visual viewport, ported from React Aria's `useViewportSize`.
  *
@@ -21,11 +16,3 @@ export interface PageSize {
  * ```
  */
 export declare const useViewportSize: () => ShallowRef<ViewportSize>;
-/**
- * Track the size of the whole scrollable page.
- *
- * Ported from the block React Aria computes inline in `ModalOverlayInner`. Published as
- * `--page-width` / `--page-height` for a backdrop that has to cover a page taller than the
- * viewport rather than only the part currently on screen.
- */
-export declare const usePageSize: () => ShallowRef<PageSize>;

package/dist/composables/use-viewport-size.js

@@ -1,4 +1,3 @@
-import { isScrollable } from "../utils/focus.js";
 import { isIOS, isWebKit, willOpenKeyboard } from "../utils/platform.js";
 import { onScopeDispose, shallowRef } from "vue";
 //#region src/composables/use-viewport-size.ts
@@ -81,41 +80,5 @@ var useViewportSize = () => {
 	}, true);
 	return size;
 };
-var measurePage = () => {
-	if (typeof document === "undefined") return {
-		height: void 0,
-		width: void 0
-	};
-	const scrolling = isScrollable(document.body) ? document.body : document.scrollingElement ?? document.documentElement;
-	const rect = scrolling.getBoundingClientRect();
-	return {
-		height: scrolling.scrollHeight - rect.height % 1,
-		width: scrolling.scrollWidth - rect.width % 1
-	};
-};
-/**
-* Track the size of the whole scrollable page.
-*
-* Ported from the block React Aria computes inline in `ModalOverlayInner`. Published as
-* `--page-width` / `--page-height` for a backdrop that has to cover a page taller than the
-* viewport rather than only the part currently on screen.
-*/
-var usePageSize = () => {
-	const size = shallowRef(measurePage());
-	if (typeof document === "undefined") return size;
-	const onResize = () => {
-		const next = measurePage();
-		if (next.width === size.value.width && next.height === size.value.height) return;
-		size.value = next;
-	};
-	const viewport = getVisualViewport();
-	window.addEventListener("resize", onResize);
-	viewport?.addEventListener("resize", onResize);
-	onScopeDispose(() => {
-		window.removeEventListener("resize", onResize);
-		viewport?.removeEventListener("resize", onResize);
-	}, true);
-	return size;
-};
 //#endregion
-export { usePageSize, useViewportSize };
+export { useViewportSize };

package/dist/composables/validation-result.d.ts

@@ -0,0 +1,37 @@
+import type { ValidationDetails, ValidationResult, RequiredControl } from "./use-form-validation-state.js";
+export declare const VALID_VALIDITY_STATE: ValidationDetails;
+/** Failure that came from a prop, a `validate` function or the server rather than the browser. */
+export declare const CUSTOM_VALIDITY_STATE: ValidationDetails;
+/** A required field with nothing in it. What the browser reports under `"native"`. */
+export declare const MISSING_VALIDITY_STATE: ValidationDetails;
+export declare const DEFAULT_VALIDATION_RESULT: ValidationResult;
+/**
+ * One verdict out of several, for a control whose value has more than one part.
+ *
+ * Invalid if any part is, with the messages collected in order and deduplicated — two ends of a
+ * range that are both out of bounds say the same thing, and saying it twice is not more helpful.
+ */
+export declare const mergeValidation: (...results: ValidationResult[]) => ValidationResult;
+/** Form controls that take part in constraint validation. */
+export type ValidatableElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
+/** Freeze an element's live validity into a result the state layer can hold. */
+export declare const getNativeValidation: (element: ValidatableElement) => ValidationResult;
+/**
+ * What the browser would say about an empty control of this kind.
+ *
+ * Read off a detached probe rather than translated here. The platform already holds the sentence,
+ * in the *browser's* locale — which is the locale a validation message belongs in, since it sits
+ * beside the browser's own — and it is the one the same field would report under `"native"`.
+ *
+ * Empty on a server, where the field cannot have been revealed yet and so has nothing to say.
+ */
+export declare const missingValueMessage: (kind: RequiredControl) => string;
+/** Whether a value counts as nothing. Covers every shape a field holds when it is empty. */
+export declare const isValueMissing: (value: unknown) => boolean;
+/**
+ * Whether two results say the same thing.
+ *
+ * Not an optimisation: the results live in `shallowRef`s, and assigning an equal-but-new
+ * object still retriggers every computed reading them.
+ */
+export declare const isEqualValidation: (a: ValidationResult | null, b: ValidationResult | null) => boolean;

package/dist/composables/validation-result.js

@@ -0,0 +1,122 @@
+//#region src/composables/validation-result.ts
+var VALID_VALIDITY_STATE = Object.freeze({
+	badInput: false,
+	customError: false,
+	patternMismatch: false,
+	rangeOverflow: false,
+	rangeUnderflow: false,
+	stepMismatch: false,
+	tooLong: false,
+	tooShort: false,
+	typeMismatch: false,
+	valid: true,
+	valueMissing: false
+});
+/** Failure that came from a prop, a `validate` function or the server rather than the browser. */
+var CUSTOM_VALIDITY_STATE = Object.freeze({
+	...VALID_VALIDITY_STATE,
+	customError: true,
+	valid: false
+});
+/** A required field with nothing in it. What the browser reports under `"native"`. */
+var MISSING_VALIDITY_STATE = Object.freeze({
+	...VALID_VALIDITY_STATE,
+	valid: false,
+	valueMissing: true
+});
+var DEFAULT_VALIDATION_RESULT = Object.freeze({
+	isInvalid: false,
+	validationDetails: VALID_VALIDITY_STATE,
+	validationErrors: []
+});
+/**
+* One verdict out of several, for a control whose value has more than one part.
+*
+* Invalid if any part is, with the messages collected in order and deduplicated — two ends of a
+* range that are both out of bounds say the same thing, and saying it twice is not more helpful.
+*/
+var mergeValidation = (...results) => {
+	const errors = /* @__PURE__ */ new Set();
+	const details = { ...VALID_VALIDITY_STATE };
+	let isInvalid = false;
+	for (const result of results) {
+		for (const error of result.validationErrors) errors.add(error);
+		isInvalid ||= result.isInvalid;
+		for (const key of Object.keys(details)) details[key] ||= result.validationDetails[key];
+	}
+	details.valid = !isInvalid;
+	return {
+		isInvalid,
+		validationDetails: details,
+		validationErrors: [...errors]
+	};
+};
+/** Freeze an element's live validity into a result the state layer can hold. */
+var getNativeValidation = (element) => {
+	const validity = element.validity;
+	return {
+		isInvalid: !validity.valid,
+		validationDetails: {
+			badInput: validity.badInput,
+			customError: validity.customError,
+			patternMismatch: validity.patternMismatch,
+			rangeOverflow: validity.rangeOverflow,
+			rangeUnderflow: validity.rangeUnderflow,
+			stepMismatch: validity.stepMismatch,
+			tooLong: validity.tooLong,
+			tooShort: validity.tooShort,
+			typeMismatch: validity.typeMismatch,
+			valid: validity.valid,
+			valueMissing: validity.valueMissing
+		},
+		validationErrors: element.validationMessage ? [element.validationMessage] : []
+	};
+};
+var missingValueMessages = /* @__PURE__ */ new Map();
+/**
+* What the browser would say about an empty control of this kind.
+*
+* Read off a detached probe rather than translated here. The platform already holds the sentence,
+* in the *browser's* locale — which is the locale a validation message belongs in, since it sits
+* beside the browser's own — and it is the one the same field would report under `"native"`.
+*
+* Empty on a server, where the field cannot have been revealed yet and so has nothing to say.
+*/
+var missingValueMessage = (kind) => {
+	const cached = missingValueMessages.get(kind);
+	if (cached !== void 0) return cached;
+	if (typeof document === "undefined") return "";
+	let probe;
+	if (kind === "select") probe = document.createElement("select");
+	else {
+		const input = document.createElement("input");
+		if (kind !== "text") {
+			input.type = kind;
+			input.name = "probe";
+		}
+		probe = input;
+	}
+	probe.required = true;
+	const message = probe.validationMessage;
+	missingValueMessages.set(kind, message);
+	return message;
+};
+/** Whether a value counts as nothing. Covers every shape a field holds when it is empty. */
+var isValueMissing = (value) => {
+	if (value == null || value === "" || value === false) return true;
+	if (Array.isArray(value)) return value.length === 0;
+	return typeof value === "number" && Number.isNaN(value);
+};
+/**
+* Whether two results say the same thing.
+*
+* Not an optimisation: the results live in `shallowRef`s, and assigning an equal-but-new
+* object still retriggers every computed reading them.
+*/
+var isEqualValidation = (a, b) => {
+	if (a === b) return true;
+	if (!a || !b) return false;
+	return a.isInvalid === b.isInvalid && a.validationErrors.length === b.validationErrors.length && a.validationErrors.every((error, index) => error === b.validationErrors[index]) && Object.keys(a.validationDetails).every((key) => a.validationDetails[key] === b.validationDetails[key]);
+};
+//#endregion
+export { CUSTOM_VALIDITY_STATE, DEFAULT_VALIDATION_RESULT, MISSING_VALIDITY_STATE, VALID_VALIDITY_STATE, getNativeValidation, isEqualValidation, isValueMissing, mergeValidation, missingValueMessage };

package/dist/composables/virtual-event.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Whether a click came from something other than a pointer.
+ *
+ * Ported from React Aria's `isVirtualClick`. A screen reader and `element.click()` both
+ * produce a click with no pointer data behind it, which is the only way to tell them apart
+ * from a real one.
+ */
+export declare const isVirtualClick: (event: MouseEvent) => boolean;
+/**
+ * Whether a pointer event was synthesised by assistive technology.
+ *
+ * A screen reader activating an element reports a zero-sized pointer. Safari on iOS gives
+ * such events the wrong coordinates and target, so they have to be left to the click handler.
+ *
+ * Android needs a shape of its own, and the zero-size test is turned off there rather than left
+ * to miss: TalkBack's double tap reports a one-by-one pointer claiming to be a mouse. Every part
+ * of that is load-bearing — pressure alone would catch real presses in Safari, which reports zero
+ * for those too, and the mouse claim is what separates the double tap from a touch screen press.
+ */
+export declare const isVirtualPointerEvent: (event: PointerEvent) => boolean;

package/dist/composables/virtual-event.js

@@ -0,0 +1,28 @@
+import { isAndroid } from "../utils/platform.js";
+//#region src/composables/virtual-event.ts
+/**
+* Whether a click came from something other than a pointer.
+*
+* Ported from React Aria's `isVirtualClick`. A screen reader and `element.click()` both
+* produce a click with no pointer data behind it, which is the only way to tell them apart
+* from a real one.
+*/
+var isVirtualClick = (event) => {
+	if (event.pointerType === "" && event.isTrusted) return true;
+	if (isAndroid() && event.pointerType) return event.type === "click" && event.buttons === 1;
+	return event.detail === 0 && !event.pointerType;
+};
+/**
+* Whether a pointer event was synthesised by assistive technology.
+*
+* A screen reader activating an element reports a zero-sized pointer. Safari on iOS gives
+* such events the wrong coordinates and target, so they have to be left to the click handler.
+*
+* Android needs a shape of its own, and the zero-size test is turned off there rather than left
+* to miss: TalkBack's double tap reports a one-by-one pointer claiming to be a mouse. Every part
+* of that is load-bearing — pressure alone would catch real presses in Safari, which reports zero
+* for those too, and the mouse claim is what separates the double tap from a touch screen press.
+*/
+var isVirtualPointerEvent = (event) => !isAndroid() && event.width === 0 && event.height === 0 || isAndroid() && event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === "mouse";
+//#endregion
+export { isVirtualClick, isVirtualPointerEvent };