@vuetify/v0 1.0.4 → 1.1.0

package/dist/browser/index.js

@@ -135,7 +135,7 @@ const SUPPORTS_MATCH_MEDIA = IN_BROWSER && "matchMedia" in window && typeof wind
 const SUPPORTS_OBSERVER = IN_BROWSER && "ResizeObserver" in window;
 const SUPPORTS_INTERSECTION_OBSERVER = IN_BROWSER && "IntersectionObserver" in window;
 const SUPPORTS_MUTATION_OBSERVER = IN_BROWSER && "MutationObserver" in window;
-const version = "1.0.4";
+const version = "1.1.0";
 /* v8 ignore next -- build-time constant, __DEV__ short-circuits in tests */
 const __LOGGER_ENABLED__ = false;
 //#endregion
@@ -915,6 +915,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
 		const cancelEl = shallowRef(null);
 		const titleId = `${id}-title`;
 		const descriptionId = `${id}-description`;
+		const hasTitle = shallowRef(false);
+		const hasDescription = shallowRef(false);
 		function open() {
 			isOpen.value = true;
 		}
@@ -927,6 +929,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
 			id,
 			titleId,
 			descriptionId,
+			hasTitle,
+			hasDescription,
 			isPending,
 			cancelEl,
 			open,
@@ -4175,8 +4179,8 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
 				"id": context.id,
 				"role": "alertdialog",
 				"aria-modal": "true",
-				"aria-labelledby": context.titleId,
-				"aria-describedby": context.descriptionId,
+				"aria-labelledby": context.hasTitle.value ? context.titleId : void 0,
+				"aria-describedby": context.hasDescription.value ? context.descriptionId : void 0,
 				"style": { zIndex: ticket.zIndex.value },
 				"onCancel": onCancel,
 				"onClose": onClose
@@ -4206,6 +4210,12 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
 	},
 	setup(__props) {
 		const context = useAlertDialogContext(__props.namespace);
+		onMounted(() => {
+			context.hasDescription.value = true;
+		});
+		onBeforeUnmount(() => {
+			context.hasDescription.value = false;
+		});
 		const slotProps = toRef(() => ({ attrs: { id: context.descriptionId } }));
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(_sfc_main$9), mergeProps({
@@ -4230,6 +4240,12 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
 	},
 	setup(__props) {
 		const context = useAlertDialogContext(__props.namespace);
+		onMounted(() => {
+			context.hasTitle.value = true;
+		});
+		onBeforeUnmount(() => {
+			context.hasTitle.value = false;
+		});
 		const slotProps = toRef(() => ({ attrs: { id: context.titleId } }));
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(_sfc_main$9), mergeProps({
@@ -9784,25 +9800,41 @@ function usePopover(options = {}) {
 		"position-anchor": anchor,
 		"position-try-fallbacks": positionTry
 	}));
-	/* v8 ignore start -- browser popover API */
 	function attach(el) {
-		onMounted(() => {
-			const element = toValue(el);
-			if (isOpen.value) element?.showPopover?.();
-		});
-		watch(isOpen, (value) => {
+		let current;
+		function hide(element) {
+			if (!IN_BROWSER || /* @__PURE__ */ isNullOrUndefined(element)) return;
+			try {
+				if (element.matches?.(":popover-open") === false) return;
+				element.hidePopover?.();
+			} catch {}
+		}
+		function sync() {
+			if (!IN_BROWSER) return;
 			const element = toValue(el);
-			if (!element?.isConnected) return;
-			if (value === element.matches?.(":popover-open")) return;
-			if (value) element.showPopover?.();
-			else element.hidePopover?.();
+			if (!/* @__PURE__ */ isNullOrUndefined(current) && current !== element) hide(current);
+			current = /* @__PURE__ */ isNullOrUndefined(element) ? void 0 : element;
+			if (/* @__PURE__ */ isNullOrUndefined(element)) return;
+			if (!isOpen.value) {
+				hide(element);
+				return;
+			}
+			if (!element.isConnected) return;
+			if (element.matches?.(":popover-open")) return;
+			element.showPopover?.();
+		}
+		watch([isOpen, () => toValue(el)], sync, {
+			immediate: true,
+			flush: "post"
 		});
+		onScopeDispose(() => {
+			hide(toValue(el) ?? current);
+		}, true);
 		useEventListener(el, "toggle", (e) => {
 			if (!toValue(el)?.isConnected) return;
 			isOpen.value = e.newState === "open";
 		});
 	}
-	/* v8 ignore stop */
 	return {
 		isOpen,
 		id,
@@ -11308,6 +11340,8 @@ const _sfc_main$59 = /* @__PURE__ */ defineComponent({
 		const id = __props.id ?? /* @__PURE__ */ useId();
 		const titleId = `${id}-title`;
 		const descriptionId = `${id}-description`;
+		const hasTitle = shallowRef(false);
+		const hasDescription = shallowRef(false);
 		function open() {
 			isOpen.value = true;
 		}
@@ -11319,6 +11353,8 @@ const _sfc_main$59 = /* @__PURE__ */ defineComponent({
 			id,
 			titleId,
 			descriptionId,
+			hasTitle,
+			hasDescription,
 			open,
 			close
 		});
@@ -11449,8 +11485,8 @@ const _sfc_main$57 = /* @__PURE__ */ defineComponent({
 				"id": context.id,
 				"role": "dialog",
 				"aria-modal": "true",
-				"aria-labelledby": context.titleId,
-				"aria-describedby": context.descriptionId,
+				"aria-labelledby": context.hasTitle.value ? context.titleId : void 0,
+				"aria-describedby": context.hasDescription.value ? context.descriptionId : void 0,
 				"style": { zIndex: ticket.zIndex.value },
 				"onCancel": onCancel,
 				"onClose": onClose
@@ -11480,6 +11516,12 @@ const _sfc_main$58 = /* @__PURE__ */ defineComponent({
 	},
 	setup(__props) {
 		const context = useDialogContext(__props.namespace);
+		onMounted(() => {
+			context.hasDescription.value = true;
+		});
+		onBeforeUnmount(() => {
+			context.hasDescription.value = false;
+		});
 		const slotProps = toRef(() => ({ attrs: { id: context.descriptionId } }));
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(_sfc_main$9), mergeProps({
@@ -11504,6 +11546,12 @@ const _sfc_main$60 = /* @__PURE__ */ defineComponent({
 	},
 	setup(__props) {
 		const context = useDialogContext(__props.namespace);
+		onMounted(() => {
+			context.hasTitle.value = true;
+		});
+		onBeforeUnmount(() => {
+			context.hasTitle.value = false;
+		});
 		const slotProps = toRef(() => ({ attrs: { id: context.titleId } }));
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(_sfc_main$9), mergeProps({
@@ -18466,6 +18514,7 @@ const _sfc_main$117 = /* @__PURE__ */ defineComponent({
 				"aria-disabled": toValue(context.disabled),
 				"disabled": toValue(context.disabled) || void 0,
 				"tabindex": __props.as === "button" ? void 0 : 0,
+				"data-disabled": toValue(context.disabled) || void 0,
 				"data-open": context.isOpen.value || void 0,
 				"style": context.popover.anchorStyles.value,
 				onClick,
@@ -21185,6 +21234,21 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 		const dragging = toRef(() => !/* @__PURE__ */ isNull(draggingHandle.value));
 		const expandAccum = /* @__PURE__ */ new Map();
 		const EXPAND_THRESHOLD = 10;
+		const intentAccum = /* @__PURE__ */ new Map();
+		const pending = shallowRef(null);
+		const INTENT_THRESHOLD = 5;
+		function arm(id, mode, delta) {
+			const accum = (intentAccum.get(id) ?? 0) + Math.abs(delta);
+			intentAccum.set(id, accum);
+			if (accum >= INTENT_THRESHOLD) pending.value = {
+				id,
+				mode
+			};
+		}
+		function disarm(id) {
+			intentAccum.delete(id);
+			if (pending.value?.id === id) pending.value = null;
+		}
 		const panels = createSelection({
 			multiple: true,
 			enroll: true,
@@ -21209,6 +21273,21 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 			if (dragging.value && ticket.size < ticket.minSize) return ticket.collapsedSize;
 			return ticket.minSize;
 		}
+		function canExpand(ticket, neighbor) {
+			const target = Math.min(ticket.defaultSize, ticket.maxSize);
+			const take = Math.min(target - ticket.collapsedSize, neighbor.size - neighbor.minSize);
+			return ticket.collapsedSize + take >= ticket.minSize;
+		}
+		function canCollapse(ticket) {
+			const need = ticket.size - ticket.collapsedSize;
+			let room = 0;
+			for (const other of panels.values()) {
+				if (other.id === ticket.id) continue;
+				room += other.maxSize - other.size;
+				if (room >= need) return true;
+			}
+			return false;
+		}
 		function resize(index, delta, options) {
 			const before = panel(index);
 			const after = panel(index + 1);
@@ -21221,11 +21300,21 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 			const upper = Math.min(before.maxSize, total - min2);
 			let size = /* @__PURE__ */ clamp(before.size + delta, lower, upper);
 			const beforeCollapsed = !toValue(before.isSelected);
-			if (before.collapsible && !beforeCollapsed && size <= before.minSize && delta < 0) {
+			const drag = dragging.value;
+			if (before.collapsible && !beforeCollapsed && size <= before.minSize && delta < 0) if (drag) {
+				if (before.size >= before.minSize) {
+					size = before.minSize;
+					if (canCollapse(before)) arm(before.id, "collapse", Math.max(0, before.minSize - (before.size + delta)));
+				}
+			} else {
 				size = before.collapsedSize;
 				before.unselect();
 				expandAccum.set(before.id, 0);
-			} else if (before.collapsible && beforeCollapsed && delta > 0) {
+			}
+			else if (before.collapsible && beforeCollapsed && delta > 0) if (drag) {
+				size = before.collapsedSize;
+				if (canExpand(before, after)) arm(before.id, "expand", delta);
+			} else {
 				const accum = (expandAccum.get(before.id) ?? 0) + delta;
 				expandAccum.set(before.id, accum);
 				if (accum >= EXPAND_THRESHOLD) {
@@ -21234,13 +21323,23 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 					expandAccum.delete(before.id);
 				} else size = before.collapsedSize;
 			}
+			else if (drag) disarm(before.id);
 			const afterSize = total - size;
 			const afterCollapsed = !toValue(after.isSelected);
-			if (after.collapsible && !afterCollapsed && afterSize <= after.minSize && delta > 0) {
+			if (after.collapsible && !afterCollapsed && afterSize <= after.minSize && delta > 0) if (drag) {
+				if (after.size >= after.minSize) {
+					size = total - after.minSize;
+					if (canCollapse(after)) arm(after.id, "collapse", Math.max(0, after.minSize - (after.size - delta)));
+				}
+			} else {
 				size = total - after.collapsedSize;
 				after.unselect();
 				expandAccum.set(after.id, 0);
-			} else if (after.collapsible && afterCollapsed && delta < 0) {
+			}
+			else if (after.collapsible && afterCollapsed && delta < 0) if (drag) {
+				size = total - after.collapsedSize;
+				if (canExpand(after, before)) arm(after.id, "expand", delta);
+			} else {
 				const accum = (expandAccum.get(after.id) ?? 0) + Math.abs(delta);
 				expandAccum.set(after.id, accum);
 				if (accum >= EXPAND_THRESHOLD) {
@@ -21249,6 +21348,7 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 					expandAccum.delete(after.id);
 				} else size = total - after.collapsedSize;
 			}
+			else if (drag) disarm(after.id);
 			before.size = size;
 			after.size = total - size;
 			if (options?.emit) emitLayout();
@@ -21256,10 +21356,10 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 		function collapse(index, neighborIndex) {
 			const ticket = panel(index);
 			/* v8 ignore next -- defensive: collapse called only on collapsible+selected panels */
-			if (!ticket?.collapsible || !toValue(ticket.isSelected)) return;
+			if (!ticket?.collapsible || !toValue(ticket.isSelected)) return false;
 			const neighbor = panel(neighborIndex ?? (index > 0 ? index - 1 : index + 1));
 			/* v8 ignore next -- defensive: at least one neighbor exists when there are 2+ panels */
-			if (!neighbor) return;
+			if (!neighbor) return false;
 			const diff = ticket.size - ticket.collapsedSize;
 			const absorbed = Math.min(diff, neighbor.maxSize - neighbor.size);
 			neighbor.size += absorbed;
@@ -21275,23 +21375,23 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 			if (remaining > 0) ticket.size += remaining;
 			if (ticket.size <= ticket.collapsedSize) ticket.unselect();
 			emitLayout();
+			return true;
 		}
 		function expand(index, neighborIndex) {
 			const ticket = panel(index);
 			/* v8 ignore next -- defensive: expand called only on collapsible+collapsed panels */
-			if (!ticket?.collapsible || toValue(ticket.isSelected)) return;
+			if (!ticket?.collapsible || toValue(ticket.isSelected)) return false;
 			const neighbor = panel(neighborIndex ?? (index > 0 ? index - 1 : index + 1));
 			/* v8 ignore next -- defensive: at least one neighbor exists when there are 2+ panels */
-			if (!neighbor) return;
-			const diff = Math.min(ticket.defaultSize, ticket.maxSize) - ticket.collapsedSize;
-			const available = neighbor.size - neighbor.minSize;
-			const take = Math.min(diff, available);
-			/* v8 ignore next -- defensive: only triggers when neighbor has insufficient space */
-			if (ticket.collapsedSize + take < ticket.minSize) return;
+			if (!neighbor) return false;
+			if (!canExpand(ticket, neighbor)) return false;
+			const target = Math.min(ticket.defaultSize, ticket.maxSize);
+			const take = Math.min(target - ticket.collapsedSize, neighbor.size - neighbor.minSize);
 			neighbor.size -= take;
 			ticket.size = ticket.collapsedSize + take;
 			ticket.select();
 			emitLayout();
+			return true;
 		}
 		function distribute(incoming) {
 			const values = panels.values();
@@ -21321,12 +21421,32 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 		function onStartDrag(index) {
 			draggingHandle.value = index;
 		}
-		function onEndDrag() {
+		function endDrag(commit) {
 			if (/* @__PURE__ */ isNull(draggingHandle.value)) return;
+			const handleIndex = draggingHandle.value;
+			const intent = pending.value;
 			draggingHandle.value = null;
+			pending.value = null;
 			expandAccum.clear();
+			intentAccum.clear();
+			if (commit && intent) {
+				const ticket = panels.get(intent.id);
+				if (ticket) {
+					const neighborIndex = ticket.index === handleIndex ? handleIndex + 1 : handleIndex;
+					if (intent.mode === "collapse" ? collapse(ticket.index, neighborIndex) : expand(ticket.index, neighborIndex)) return;
+				}
+			}
 			emitLayout();
 		}
+		function onEndDrag() {
+			endDrag(true);
+		}
+		function onAbortDrag() {
+			endDrag(false);
+		}
+		onBeforeUnmount(() => {
+			onAbortDrag();
+		});
 		function emitLayout() {
 			emit("layout", panels.values().map((t) => t.size));
 		}
@@ -21337,11 +21457,13 @@ const _sfc_main$141 = /* @__PURE__ */ defineComponent({
 			handles,
 			dragging,
 			draggingHandle,
+			pending,
 			rootEl,
 			panel,
 			resize,
 			onStartDrag,
 			onEndDrag,
+			onAbortDrag,
 			collapse,
 			expand,
 			distribute
@@ -21504,7 +21626,8 @@ const _sfc_main$140 = /* @__PURE__ */ defineComponent({
 						flexGrow: 0,
 						flexShrink: 0,
 						flexBasis: `${size.value}%`,
-						overflow: "hidden"
+						minWidth: 0,
+						minHeight: 0
 					}
 				]
 			}), {
@@ -21553,6 +21676,14 @@ const _sfc_main$139 = /* @__PURE__ */ defineComponent({
 			if (hovering.value) return "hover";
 			return "inactive";
 		});
+		const pending = toRef(() => {
+			const intent = splitter.pending.value;
+			if (!intent) return null;
+			if (splitter.draggingHandle.value !== ticket.index) return null;
+			const before = splitter.panel(ticket.index);
+			const after = splitter.panel(ticket.index + 1);
+			return intent.id === before?.id || intent.id === after?.id ? intent.mode : null;
+		});
 		/* v8 ignore next -- defensive: the handle's index always points to a registered panel */
 		const valuenow = toRef(() => Math.round(splitter.panel(ticket.index)?.size ?? 0));
 		const valuemin = toRef(() => {
@@ -21603,13 +21734,22 @@ const _sfc_main$139 = /* @__PURE__ */ defineComponent({
 				}
 				splitter.onEndDrag();
 			});
+			useDocumentEventListener("pointercancel", () => {
+				update.cancel();
+				/* v8 ignore next 4 -- IN_BROWSER always true in happy-dom test env */
+				if (IN_BROWSER) {
+					document.documentElement.style.userSelect = "";
+					document.documentElement.style.touchAction = "";
+				}
+				splitter.onAbortDrag();
+			});
 			onScopeDispose(() => {
-				splitter.onEndDrag();
 				/* v8 ignore next 4 -- IN_BROWSER always true in happy-dom test env */
 				if (IN_BROWSER) {
 					document.documentElement.style.userSelect = "";
 					document.documentElement.style.touchAction = "";
 				}
+				splitter.onAbortDrag();
 			});
 		});
 		function onKeydown(e) {
@@ -21674,30 +21814,37 @@ const _sfc_main$139 = /* @__PURE__ */ defineComponent({
 			const p = splitter.panel(ticket.index);
 			return /* @__PURE__ */ isNullOrUndefined(p) ? void 0 : String(p.id);
 		});
-		const slotProps = toRef(() => ({
-			isDragging: splitter.draggingHandle.value === ticket.index,
-			isDisabled: isDisabled.value,
-			state: state.value,
-			attrs: {
-				"role": "separator",
-				"tabindex": isDisabled.value ? -1 : 0,
-				"aria-valuenow": valuenow.value,
-				"aria-valuemin": valuemin.value,
-				"aria-valuemax": valuemax.value,
-				"aria-orientation": ariaOrientation.value,
-				"aria-controls": ariaControls.value,
-				"aria-label": __props.label || (locale.ti("Splitter.handle") ?? "Resize"),
-				"aria-disabled": isDisabled.value,
-				"data-state": state.value,
-				"data-orientation": splitter.orientation.value,
-				"data-disabled": isDisabled.value || void 0,
-				"style": { "touch-action": "none" },
-				"onPointerdown": onPointerDown,
-				"onPointerenter": onPointerEnter,
-				"onPointerleave": onPointerLeave,
-				"onKeydown": onKeydown
-			}
-		}));
+		const slotProps = toRef(() => {
+			const pendingLabel = pending.value === "collapse" ? locale.ti("Splitter.releaseToHide") ?? "Release to hide" : pending.value === "expand" ? locale.ti("Splitter.releaseToOpen") ?? "Release to open" : void 0;
+			return {
+				isDragging: splitter.draggingHandle.value === ticket.index,
+				isDisabled: isDisabled.value,
+				state: state.value,
+				pending: pending.value,
+				pendingLabel,
+				attrs: {
+					"role": "separator",
+					"tabindex": isDisabled.value ? -1 : 0,
+					"aria-valuenow": valuenow.value,
+					"aria-valuemin": valuemin.value,
+					"aria-valuemax": valuemax.value,
+					"aria-valuetext": pendingLabel,
+					"aria-orientation": ariaOrientation.value,
+					"aria-controls": ariaControls.value,
+					"aria-label": __props.label || (locale.ti("Splitter.handle") ?? "Resize"),
+					"aria-disabled": isDisabled.value,
+					"data-state": state.value,
+					"data-orientation": splitter.orientation.value,
+					"data-disabled": isDisabled.value || void 0,
+					"data-pending": pending.value ?? void 0,
+					"style": { "touch-action": "none" },
+					"onPointerdown": onPointerDown,
+					"onPointerenter": onPointerEnter,
+					"onPointerleave": onPointerLeave,
+					"onKeydown": onKeydown
+				}
+			};
+		});
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(_sfc_main$9), mergeProps(mergeProps(unref(attrs), slotProps.value.attrs), {
 				as: __props.as,
@@ -22927,8 +23074,10 @@ const Tabs = {
 //#endregion
 //#region src/composables/useTheme/adapters/adapter.ts
 var ThemeAdapter = class ThemeAdapter {
-	static UNSAFE_CSS = /url\s*\(|src\s*\(|image\s*\(|image-set\s*\(|cross-fade\s*\(|@import|expression\s*\(|[;{}<>\\]/i;
+	/** CSS ident for theme ids, color keys, and the adapter prefix. */
 	static SAFE_IDENT = /^[a-zA-Z0-9_-]+$/;
+	/** Rejected inside theme color values before they are written to a stylesheet. */
+	static UNSAFE_CSS = /url\s*\(|src\s*\(|image\s*\(|image-set\s*\(|cross-fade\s*\(|@import|expression\s*\(|[;{}<>\\]|\/\*/i;
 	stylesheetId = "v0-theme-stylesheet";
 	prefix;
 	rgb = false;
@@ -27346,6 +27495,19 @@ function createKanban(_options = {}) {
 			return _columns.size;
 		}
 	};
+	function onColumnUnregister(column) {
+		column.items.dispose();
+		for (const t of lookup.values()) if (t.value === column.id) t.unregister();
+	}
+	function dispose() {
+		for (const column of _columns.values()) column.items.dispose();
+		lookup.dispose();
+		bus.dispose();
+		_columns.dispose();
+		columns.on("unregister:ticket", onColumnUnregister);
+	}
+	columns.dispose = dispose;
+	columns.on("unregister:ticket", onColumnUnregister);
 	function isAccepted(accept, ticket, from, toIndex) {
 		if (/* @__PURE__ */ isUndefined(accept)) return true;
 		try {
@@ -27360,10 +27522,6 @@ function createKanban(_options = {}) {
 			return false;
 		}
 	}
-	columns.on("unregister:ticket", (column) => {
-		column.items.dispose();
-		for (const t of lookup.values()) if (t.value === column.id) t.unregister();
-	});
 	function transfer(id, toColumnId, toIndex) {
 		const fromColumnId = lookup.get(id)?.value;
 		if (/* @__PURE__ */ isUndefined(fromColumnId)) {
@@ -27418,7 +27576,8 @@ function createKanban(_options = {}) {
 		columns,
 		transfer,
 		on,
-		off
+		off,
+		dispose
 	};
 }
 //#endregion