ropav 0.12.1 → 0.12.2

package/dist/components/breadcrumbs/breadcrumbs-item.js

@@ -54,6 +54,8 @@ var breadcrumbs_item_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
 			immediate: true
 		});
 		const isCurrent = computed(() => {
+			context.collection.size.value;
+			context.orderVersion.value;
 			return context.collection.getLastKey() === itemKey.value;
 		});
 		const isDisabled = computed(() => Boolean(props.isDisabled || context.isDisabled.value || isCurrent.value));

package/dist/components/calendar-year-picker/calendar-year-picker-grid.js

@@ -55,6 +55,7 @@ var calendar_year_picker_grid_vue_vue_type_script_setup_true_vapor_true_lang_def
 			const grid = element.value;
 			const calendar = calendarElement.value;
 			if (!grid || !calendar) return;
+			state.focusedDate.value;
 			const dayGrid = calendar.querySelector(`[data-slot='${calendarGridSlot}']`);
 			if (!dayGrid) return;
 			grid.style.top = `${dayGrid.offsetTop}px`;

package/dist/components/date-input-group/date-input-group-hidden-input.js

@@ -60,7 +60,8 @@ var date_input_group_hidden_input_vue_vue_type_script_setup_true_vapor_true_lang
 			const text = event.target.value;
 			if (!text) return;
 			const granularity = state.granularity.value;
-			const times = TIME_SEGMENTS.slice(0, granularity === "day" ? 0 : GRANULARITY_DEPTH[granularity]);
+			const depth = granularity === "day" ? 0 : GRANULARITY_DEPTH[granularity];
+			const times = TIME_SEGMENTS.slice(0, depth);
 			try {
 				const parsed = granularity === "day" ? parseDate(text) : parseDateTime(text);
 				for (const segment of DATE_SEGMENTS) if (segment in parsed) state.setSegment(segment, parsed[segment]);

package/dist/components/radio-group/radio-group-root.js

@@ -101,7 +101,8 @@ var radio_group_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
 		const onKeydown = (event) => {
 			const isHorizontalFlip = locale.value.direction === "rtl" && resolvedOrientation.value !== "vertical";
 			const isNext = event.key === "ArrowDown" || event.key === (isHorizontalFlip ? "ArrowLeft" : "ArrowRight");
-			if (!isNext && !(event.key === "ArrowUp" || event.key === (isHorizontalFlip ? "ArrowRight" : "ArrowLeft"))) return;
+			const isPrevious = event.key === "ArrowUp" || event.key === (isHorizontalFlip ? "ArrowRight" : "ArrowLeft");
+			if (!isNext && !isPrevious) return;
 			if (state.isDisabled.value || state.isReadOnly.value) return;
 			const radios = focusableRadios();
 			if (radios.length === 0) return;

package/dist/components/splitter/splitter.state.js

@@ -25,9 +25,11 @@ var registry = () => {
 	const version = shallowRef(0);
 	return {
 		get: (key) => {
+			version.value;
 			return items.get(key);
 		},
 		keys: computed(() => {
+			version.value;
 			return sortByDocumentOrder([...items.entries()], ([, meta]) => meta.element()).map(([key]) => key);
 		}),
 		register: (key, meta) => {
@@ -83,7 +85,8 @@ var useSplitterState = (options) => {
 	const indexOf = (key) => panels.keys.value.indexOf(key);
 	const getPanelSize = (key) => layout.value[indexOf(key)] ?? 0;
 	const boundsOf = (index) => {
-		const panel = panels.get(panels.keys.value[index]);
+		const key = panels.keys.value[index];
+		const panel = panels.get(key);
 		const available = availableSize.value;
 		const min = getMinSize(panel.minSize(), available);
 		const shut = panel.isCollapsible() ? getMinSize(panel.collapsedSize() ?? 0, available) : min;
@@ -206,6 +209,8 @@ var useSplitterState = (options) => {
 		};
 	};
 	const neighbourCache = computed(() => {
+		panels.keys.value;
+		handles.keys.value;
 		return /* @__PURE__ */ new Map();
 	});
 	const neighboursOf = (handleKey) => {

package/dist/components/table/table-body.js

@@ -107,7 +107,7 @@ var table_body_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PUR
 							return createDynamicComponent(() => unref(virtualizer) ? "div" : "td", {
 								"aria-colspan": () => unref(virtualizer) ? columnCount.value : void 0,
 								colspan: () => unref(virtualizer) ? void 0 : columnCount.value,
-								role: "rowheader",
+								role: "gridcell",
 								style: () => emptyStateStyle.value
 							}, extend(() => {
 								return createSlot("empty", null, null, 4);

package/dist/components/table/table-cell.js

@@ -58,7 +58,8 @@ var table_cell_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PUR
 		const virtualizer = useTableVirtualizerContext();
 		const layoutInfo = computed(() => {
 			if (!virtualizer || columnKey.value == null) return null;
-			return virtualizer.getLayoutInfo(virtualizer.collection.value.cellKey(rowKey.value, columnKey.value));
+			const collection = virtualizer.collection.value;
+			return virtualizer.getLayoutInfo(collection.cellKey(rowKey.value, columnKey.value));
 		});
 		const parentLayoutInfo = computed(() => virtualizer ? virtualizer.getLayoutInfo(rowKey.value) : null);
 		const placement = virtualizer ? useVirtualizerItem({
@@ -69,6 +70,7 @@ var table_cell_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PUR
 		const n1 = createDynamicComponent(() => unref(virtualizer) ? "div" : "td", {
 			id: () => cellId.value,
 			"aria-colindex": () => unref(virtualizer) && index.value >= 0 ? index.value + 1 : void 0,
+			"aria-label": () => isRowHeader.value ? props.textValue : void 0,
 			class: () => ["rp-table__cell", props.class],
 			"data-collection": () => unref(collectionId),
 			"data-column-index": () => index.value < 0 ? void 0 : index.value,

package/dist/components/table/table-column-resizer.js

@@ -103,7 +103,8 @@ var table_column_resizer_vue_vue_type_script_setup_true_vapor_true_lang_default
 		* arrow press does.
 		*/
 		const onChange = (event) => {
-			resize(parseFloat(event.target.value) > columnWidth.value ? columnWidth.value + KEYBOARD_STEP : columnWidth.value - KEYBOARD_STEP);
+			const next = parseFloat(event.target.value);
+			resize(next > columnWidth.value ? columnWidth.value + KEYBOARD_STEP : columnWidth.value - KEYBOARD_STEP);
 		};
 		const n1 = t0();
 		const n0 = child(n1);

package/dist/components/table/table-load-more.js

@@ -100,7 +100,7 @@ var table_load_more_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@
 					return createDynamicComponent(() => unref(virtualizer) ? "div" : "td", {
 						"aria-colspan": () => unref(virtualizer) ? columnCount.value : void 0,
 						colspan: () => unref(virtualizer) ? void 0 : columnCount.value,
-						role: "rowheader",
+						role: "gridcell",
 						style: () => indicatorStyle.value
 					}, extend(() => {
 						return createSlot("default", null, null, 4);

package/dist/components/table/use-grid-selection-announcement.js

@@ -41,7 +41,9 @@ var useGridSelectionAnnouncement = (options) => {
 		else if (added.size === 1 && removed.size === 0) single([...added][0], "selected");
 		else if (removed.size === 1 && added.size === 0) single([...removed][0], "not selected");
 		if (selection.selectionMode.value === "multiple") {
-			if (messages.length === 0 || current === "all" || (current === "all" ? 0 : current.size) > 1 || last === "all" || (last === "all" ? 0 : last.size) > 1) messages.push(current === "all" ? "All items selected." : countMessage(selection.selectedKeys.value.size));
+			const size = current === "all" ? 0 : current.size;
+			const lastSize = last === "all" ? 0 : last.size;
+			if (messages.length === 0 || current === "all" || size > 1 || last === "all" || lastSize > 1) messages.push(current === "all" ? "All items selected." : countMessage(selection.selectedKeys.value.size));
 		}
 		if (messages.length > 0) announce(messages.join(" "));
 	});

package/dist/components/table/use-table-collection.js

@@ -19,10 +19,12 @@ var createTableRegistry = () => {
 	const items = /* @__PURE__ */ new Map();
 	const version = shallowRef(0);
 	const orderedKeys = computed(() => {
+		version.value;
 		return [...items.entries()].filter(([, meta]) => meta.element()?.isConnected).sort(([, a], [, b]) => a.element().compareDocumentPosition(b.element()) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1).map(([key]) => key);
 	});
 	return {
 		getItem: (key) => {
+			version.value;
 			return items.get(key);
 		},
 		indexOf: (key) => orderedKeys.value.indexOf(key),
@@ -39,6 +41,7 @@ var createTableRegistry = () => {
 			};
 		},
 		size: computed(() => {
+			version.value;
 			return orderedKeys.value.length;
 		})
 	};

package/dist/components/tabs/tabs-list-container.js

@@ -26,7 +26,8 @@ var tabs_list_container_vue_vue_type_script_setup_true_vapor_true_lang_default =
 			if (!element) return;
 			const vertical = isVertical.value;
 			const size = vertical ? element.clientHeight : element.clientWidth;
-			const maxScroll = Math.max(0, (vertical ? element.scrollHeight : element.scrollWidth) - size);
+			const scrollSize = vertical ? element.scrollHeight : element.scrollWidth;
+			const maxScroll = Math.max(0, scrollSize - size);
 			const isRtl = !vertical && getComputedStyle(element).direction === "rtl";
 			const delta = direction * size * SCROLL_FRACTION * (isRtl ? -1 : 1);
 			const current = vertical ? element.scrollTop : element.scrollLeft;

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

@@ -92,7 +92,8 @@ var useCalendarGrid = (options, state, shared) => {
 		const isDayView = Boolean(duration.days && duration.days < 7);
 		const firstDayOfWeek = toValue(options.firstDayOfWeek);
 		const weekStart = isDayView ? startDate.value : startOfWeek(today(state.timeZone.value), locale.value.locale, firstDayOfWeek);
-		return Array.from({ length: isDayView ? duration.days : 7 }, (_, index) => dayFormatter.value.format(weekStart.add({ days: index }).toDate(state.timeZone.value)));
+		const days = isDayView ? duration.days : 7;
+		return Array.from({ length: days }, (_, index) => dayFormatter.value.format(weekStart.add({ days: index }).toDate(state.timeZone.value)));
 	});
 	return {
 		attrs: computed(() => ({

package/dist/composables/use-collection.js

@@ -123,13 +123,24 @@ var useCollection = (options = {}) => {
 		if (index === -1) return null;
 		return keys[index + step] ?? null;
 	};
+	/**
+	* Read the registration counter, so a lookup made inside a `computed` re-runs once the item
+	* it asked about registers. `getItem` and `getElement` are read during render — an item's
+	* own disabled state and tabindex come from them — unlike `orderedKeys()`, which is only ever
+	* read on an interaction and so deliberately stays outside reactivity.
+	*/
+	const track = () => {
+		version.value;
+	};
 	return {
 		getElement: (key) => {
+			track();
 			return items.get(key)?.element() ?? null;
 		},
 		getFirstKey: () => keyAt(0),
 		getIndex: (key) => order().indexOf(key),
 		getItem: (key) => {
+			track();
 			return items.get(key) ?? metaFromSource(key);
 		},
 		getKeyAfter: (key) => neighbour(key, 1),
@@ -138,6 +149,7 @@ var useCollection = (options = {}) => {
 		orderedKeys,
 		register,
 		size: computed(() => {
+			track();
 			return source()?.itemCount ?? items.size;
 		}),
 		withOrder

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

@@ -108,38 +108,40 @@ var useColorField = (options = {}) => {
 			else if (deltaY < 0) state.decrement();
 		}
 	});
+	const attrs = computed(() => {
+		const all = {
+			...field.attrs.value,
+			"aria-disabled": isDisabled.value || void 0,
+			"aria-readonly": isReadOnly.value || void 0
+		};
+		for (const key of Object.keys(all)) if (all[key] === void 0) delete all[key];
+		return all;
+	});
+	const handlers = {
+		onBlur: (event) => {
+			isFocused.value = false;
+			spin.onBlur();
+			state.commit();
+			reassert();
+			field.handlers.onBlur(event);
+		},
+		onFocus: (event) => {
+			isFocused.value = true;
+			spin.onFocus();
+			field.handlers.onFocus(event);
+		},
+		onInput: field.handlers.onInput,
+		onKeydown: (event) => {
+			spin.onKeydown(event);
+			field.handlers.onKeydown(event);
+		},
+		onKeyup: field.handlers.onKeyup
+	};
 	return {
-		attrs: computed(() => {
-			const all = {
-				...field.attrs.value,
-				"aria-disabled": isDisabled.value || void 0,
-				"aria-readonly": isReadOnly.value || void 0
-			};
-			for (const key of Object.keys(all)) if (all[key] === void 0) delete all[key];
-			return all;
-		}),
+		attrs,
 		element,
 		fieldIds: field.fieldIds,
-		handlers: {
-			onBlur: (event) => {
-				isFocused.value = false;
-				spin.onBlur();
-				state.commit();
-				reassert();
-				field.handlers.onBlur(event);
-			},
-			onFocus: (event) => {
-				isFocused.value = true;
-				spin.onFocus();
-				field.handlers.onFocus(event);
-			},
-			onInput: field.handlers.onInput,
-			onKeydown: (event) => {
-				spin.onKeydown(event);
-				field.handlers.onKeydown(event);
-			},
-			onKeyup: field.handlers.onKeyup
-		},
+		handlers,
 		isDisabled,
 		isInvalid: field.isInvalid,
 		isReadOnly,

package/dist/composables/use-combo-box-state.js

@@ -128,7 +128,8 @@ var useComboBoxState = (options) => {
 		const given = toValue(options.defaultInputValue);
 		if (given != null) return given;
 		const value = defaultValue.value;
-		return selectionMode.value === "single" ? textOf(Array.isArray(value) ? value[0] ?? null : value) : "";
+		const key = Array.isArray(value) ? value[0] ?? null : value;
+		return selectionMode.value === "single" ? textOf(key) : "";
 	});
 	const input = useControllableState({
 		defaultValue: defaultInputValue.value,

package/dist/composables/use-combo-box.js

@@ -176,7 +176,8 @@ var useComboBox = (options, state) => {
 		},
 		onPressStart: (event) => {
 			if (event.pointerType === "touch") return;
-			state.toggle(event.pointerType === "keyboard" || event.pointerType === "virtual" ? "first" : null, "manual");
+			const strategy = event.pointerType === "keyboard" || event.pointerType === "virtual" ? "first" : null;
+			state.toggle(strategy, "manual");
 			focusInput();
 		},
 		preventFocusOnPress: true

package/dist/composables/use-disclosure-panel.js

@@ -34,7 +34,8 @@ var useDisclosurePanel = (options) => {
 		panel.style.setProperty("--disclosure-panel-height", height);
 	};
 	const applyPanelState = (panel, expanded) => {
-		if (wasExpanded === null || !(typeof panel.getAnimations === "function")) {
+		const canAnimate = typeof panel.getAnimations === "function";
+		if (wasExpanded === null || !canAnimate) {
 			if (expanded) {
 				panel.removeAttribute("hidden");
 				setSize(panel, "auto", "auto");

package/dist/composables/use-drag.js

@@ -160,12 +160,15 @@ var useDrag = (options) => {
 	};
 	const onDragend = (event) => {
 		event.stopPropagation();
-		if (options.onDragEnd) options.onDragEnd({
-			dropOperation: DROP_EFFECT_TO_DROP_OPERATION[globalDropEffect ?? event.dataTransfer?.dropEffect ?? "none"] ?? "cancel",
-			type: "dragend",
-			x: event.clientX,
-			y: event.clientY
-		});
+		if (options.onDragEnd) {
+			const dropEffect = event.dataTransfer?.dropEffect ?? "none";
+			options.onDragEnd({
+				dropOperation: DROP_EFFECT_TO_DROP_OPERATION[globalDropEffect ?? dropEffect] ?? "cancel",
+				type: "dragend",
+				x: event.clientX,
+				y: event.clientY
+			});
+		}
 		draggingElement.value = null;
 		releaseDropGuard?.();
 		releaseDropGuard = null;

package/dist/composables/use-drop.js

@@ -14,7 +14,8 @@ var DROP_ACTIVATE_TIMEOUT = 800;
 * Ported from React Aria's `getAllowedOperations`.
 */
 var getAllowedOperations = (event) => {
-	let allowed = DROP_OPERATION_ALLOWED[event.dataTransfer?.effectAllowed ?? "uninitialized"] ?? DROP_OPERATION.all;
+	const effectAllowed = event.dataTransfer?.effectAllowed ?? "uninitialized";
+	let allowed = DROP_OPERATION_ALLOWED[effectAllowed] ?? DROP_OPERATION.all;
 	if (globalAllowedDropOperations) allowed &= globalAllowedDropOperations;
 	let allowedModifiers = DROP_OPERATION.none;
 	if (isMac()) {

package/dist/composables/use-droppable-collection.js

@@ -100,7 +100,8 @@ var useDroppableCollection = (options, state, element) => {
 			if (inserted.length > 0) {
 				selectionManager.setSelectedKeys(inserted);
 				if (selectionManager.focusedKey.value === focusedKey) {
-					selectionManager.setFocusedKey(inserted[0]);
+					const first = inserted[0];
+					selectionManager.setFocusedKey(first);
 					if (selectionManager.selectionMode.value === "none") setInteractionModality("keyboard");
 				}
 			}

package/dist/composables/use-input-otp.js

@@ -182,7 +182,9 @@ var useInputOTP = (options) => {
 		let end = -1;
 		let direction = void 0;
 		if (_val.length !== 0 && _s !== null && _e !== null) {
-			if (_s === _e && !(_s === _val.length && _val.length < _ml)) {
+			const isSingleCaret = _s === _e;
+			const isInsertMode = _s === _val.length && _val.length < _ml;
+			if (isSingleCaret && !isInsertMode) {
 				const c = _s;
 				if (c === 0) {
 					start = 0;
@@ -196,7 +198,8 @@ var useInputOTP = (options) => {
 					let offset = 0;
 					if (_prev[0] !== null && _prev[1] !== null) {
 						direction = c < _prev[1] ? "backward" : "forward";
-						if (direction === "backward" && !(_prev[0] === _prev[1] && _prev[0] < _ml)) offset = -1;
+						const wasPreviouslyInserting = _prev[0] === _prev[1] && _prev[0] < _ml;
+						if (direction === "backward" && !wasPreviouslyInserting) offset = -1;
 					}
 					start = offset + c;
 					end = offset + c + 1;

package/dist/composables/use-move.js

@@ -79,7 +79,8 @@ var useMove = (options) => {
 	};
 	const onPointermove = (event) => {
 		if (event.pointerId !== pointerId) return;
-		move(event, event.pointerType || "mouse", event.pageX - (lastPosition?.pageX ?? 0), event.pageY - (lastPosition?.pageY ?? 0));
+		const pointerType = event.pointerType || "mouse";
+		move(event, pointerType, event.pageX - (lastPosition?.pageX ?? 0), event.pageY - (lastPosition?.pageY ?? 0));
 		lastPosition = {
 			pageX: event.pageX,
 			pageY: event.pageY

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

@@ -56,6 +56,7 @@ var useSingleSelectListState = (options = {}) => {
 	* empty collection of the first render and keep that answer.
 	*/
 	const selectedKey = computed(() => {
+		collection.size.value;
 		const key = stored.state.value;
 		if (stored.isControlled.value) return key ?? null;
 		if (key != null && collection.getItem(key)) return key;

package/dist/composables/use-time-field-state.js

@@ -55,6 +55,7 @@ var useTimeFieldState = (options) => {
 		if (current == null) return null;
 		return "day" in current ? toTime(current) : current;
 	});
+	const validateTime = options.validate ? () => options.validate(value.value) : void 0;
 	return {
 		...useDateFieldState({
 			createCalendar: () => new GregorianCalendar(),
@@ -77,7 +78,7 @@ var useTimeFieldState = (options) => {
 			},
 			placeholderValue: () => placeholderDate.value ?? void 0,
 			shouldForceLeadingZeros: () => toValue(options.shouldForceLeadingZeros),
-			validate: options.validate ? () => options.validate(value.value) : void 0,
+			validate: validateTime,
 			validationBehavior: () => toValue(options.validationBehavior),
 			value: () => toDateTime(value.value)
 		}),

package/dist/composables/use-virtualizer.js

@@ -49,6 +49,7 @@ var useVirtualizer = (options) => {
 	/** Set by `updateItemSize`, consumed by the next pass. */
 	let pendingItemSizeChange = false;
 	const pass = computed(() => {
+		revision.value;
 		const collection = options.collection();
 		const layout = options.layout();
 		const layoutOptions = options.layoutOptions?.();