@vizejs/ui 0.426.3 → 0.427.0

package/dist/cascader-T2o5rIfb.mjs

@@ -0,0 +1,1232 @@
+import { a as useDeterministicId, n as deriveDeterministicId } from "./deterministic-id-bMmJU5xD.mjs";
+import { createContext } from "./context.mjs";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { useControllableState } from "./controllable-state.mjs";
+import { n as useDismissableLayer } from "./dismissable-layer-B9LIsTUt.mjs";
+import { t as portal_default } from "./portal-DeHaLxGL.mjs";
+import { t as positioner_default } from "./positioner--uuI0oZY.mjs";
+import { t as presence_default } from "./presence-CTG1EV3w.mjs";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, onMounted, onScopeDispose, onUnmounted, openBlock, renderList, renderSlot, shallowRef, toDisplayString, unref, useTemplateRef, watch, withCtx } from "vue";
+//#region src/families/selection/cascader/cascader-context.ts
+const cascaderContext = createContext("Cascader");
+const cascaderColumnContext = createContext("CascaderColumn");
+//#endregion
+//#region src/families/selection/cascader/cascader-model.ts
+function readKey(value, key) {
+	return typeof value === "object" && value !== null ? Reflect.get(value, key) : value;
+}
+/** Resolve `by` into one equality function. */
+function createCascaderEquality(by) {
+	if (by === void 0) return Object.is;
+	if (typeof by === "function") return by;
+	const key = by;
+	return (left, right) => Object.is(left, right) || Object.is(readKey(left, key), readKey(right, key));
+}
+/** Default child accessor: an array-valued `children` property. */
+function defaultCascaderChildren(node) {
+	const children = readKey(node, "children");
+	return Array.isArray(children) ? children : void 0;
+}
+/** Default text for a node. */
+function defaultCascaderText(node) {
+	if (typeof node === "string") return node;
+	if (typeof node === "object" && node !== null) for (const key of [
+		"label",
+		"name",
+		"title",
+		"text",
+		"value"
+	]) {
+		const candidate = readKey(node, key);
+		if (typeof candidate === "string") return candidate;
+	}
+	return String(node);
+}
+/** Serialize one node for form submission. */
+function serializeCascaderNode(node, by) {
+	if (typeof node === "string") return node;
+	if (typeof node === "number" || typeof node === "boolean" || typeof node === "bigint") return String(node);
+	if (typeof by === "string") return serializeCascaderNode(readKey(node, by), void 0);
+	for (const key of ["value", "id"]) {
+		const candidate = readKey(node, key);
+		if (typeof candidate === "string" || typeof candidate === "number") return String(candidate);
+	}
+	return JSON.stringify(node) ?? "";
+}
+/** Whether two paths hold equal nodes in the same order. */
+function areCascaderPathsEqual(left, right, equals) {
+	return left.length === right.length && left.every((node, index) => equals(node, right[index]));
+}
+/** Index of `path` inside `paths`, or `-1`. */
+function indexOfCascaderPath(paths, path, equals) {
+	return paths.findIndex((candidate) => areCascaderPathsEqual(candidate, path, equals));
+}
+function isPathList(value) {
+	return value.every((entry) => Array.isArray(entry));
+}
+/**
+* Normalize a public model into the internal list of selected paths.
+*
+* In single mode the model is one path; in multiple mode a list of paths.
+* Empty paths are dropped.
+*/
+function toCascaderSelection(value, multiple) {
+	if (value === void 0 || value.length === 0) return Object.freeze([]);
+	if (multiple && isPathList(value)) return Object.freeze(value.filter((path) => path.length > 0).map((path) => Object.freeze([...path])));
+	return Object.freeze([Object.freeze([...value])]);
+}
+/** Convert the selected paths into the public model for `multiple`. */
+function fromCascaderSelection(paths, multiple) {
+	return multiple ? Object.freeze([...paths]) : paths[0] ?? Object.freeze([]);
+}
+/** Depth-first search for the first path whose last node matches `predicate`. */
+function findCascaderPath(options, predicate, getChildren = defaultCascaderChildren) {
+	const visit = (nodes, parents) => {
+		for (const node of nodes) {
+			const path = [...parents, node];
+			if (predicate(node, path)) return Object.freeze(path);
+			const children = getChildren(node);
+			if (children !== void 0 && children.length > 0) {
+				const found = visit(children, path);
+				if (found !== null) return found;
+			}
+		}
+		return null;
+	};
+	return visit(options, []);
+}
+/**
+* Flatten the (loaded part of the) tree into selectable paths: every leaf
+* path, plus every branch path when `includeBranches` is set.
+*/
+function flattenCascaderPaths(options, getChildren = defaultCascaderChildren, includeBranches = false) {
+	const paths = [];
+	const visit = (nodes, parents) => {
+		for (const node of nodes) {
+			const path = Object.freeze([...parents, node]);
+			const children = getChildren(node);
+			const branch = children !== void 0 && children.length > 0;
+			if (!branch || includeBranches) paths.push(path);
+			if (branch) visit(children, path);
+		}
+	};
+	visit(options, []);
+	return Object.freeze(paths);
+}
+/** Normalize text for accent- and case-insensitive matching. */
+function normalizeCascaderText(text) {
+	return text.normalize("NFKD").replace(/\p{M}+/gu, "").toLocaleLowerCase().trim();
+}
+/** Keep paths whose joined node text contains `query`. */
+function searchCascaderPaths(paths, query, text) {
+	const needle = normalizeCascaderText(query);
+	if (needle.length === 0) return Object.freeze([]);
+	return Object.freeze(paths.filter((path) => normalizeCascaderText(path.map(text).join(" ")).includes(needle)));
+}
+/** Join a path into display or form text. */
+function joinCascaderPath(path, text, separator) {
+	return path.map(text).join(separator);
+}
+//#endregion
+//#region src/families/selection/cascader/cascader-root.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$5 = [
+	"id",
+	"data-state",
+	"data-selection-mode",
+	"data-disabled",
+	"data-empty"
+];
+const _hoisted_2$1 = [
+	"name",
+	"form",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/families/selection/cascader/cascader-root.vue
+var cascader_root_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "cascader-root",
+	props: {
+		id: {
+			type: [String, null],
+			required: false,
+			default: () => void 0
+		},
+		options: {
+			type: Array,
+			required: true
+		},
+		modelValue: {
+			type: null,
+			required: false,
+			default: () => void 0
+		},
+		defaultValue: {
+			type: null,
+			required: false,
+			default: () => void 0
+		},
+		multiple: {
+			type: null,
+			required: false,
+			default: () => void 0
+		},
+		getChildren: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		isLeaf: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		loadChildren: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		by: {
+			type: Function,
+			required: false,
+			skipCheck: true,
+			default: void 0
+		},
+		itemText: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		itemDisabled: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		formValue: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		changeOnSelect: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		expandTrigger: {
+			type: String,
+			required: false,
+			default: "click"
+		},
+		separator: {
+			type: String,
+			required: false,
+			default: " / "
+		},
+		search: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		open: {
+			type: Boolean,
+			required: false,
+			default: () => void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		name: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		form: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		placeholder: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		typeaheadTimeout: {
+			type: Number,
+			required: false,
+			default: 500
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"change",
+		"update:open",
+		"update:search",
+		"load-error"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		/** Highlighted option coordinates. */
+		const baseId = useDeterministicId({
+			id: () => __props.id,
+			hint: "cascader"
+		});
+		const triggerId = computed(() => deriveDeterministicId(baseId.value, "trigger"));
+		const contentId = computed(() => deriveDeterministicId(baseId.value, "content"));
+		const multipleState = computed(() => __props.multiple === true || String(__props.multiple) === "");
+		const disabledState = computed(() => __props.disabled);
+		const requiredState = computed(() => __props.required);
+		const placeholderState = computed(() => __props.placeholder);
+		const equals = computed(() => createCascaderEquality(__props.by));
+		const selection = useControllableState({
+			value: () => __props.modelValue === void 0 ? void 0 : toCascaderSelection(__props.modelValue, multipleState.value),
+			defaultValue: () => toCascaderSelection(__props.defaultValue, multipleState.value),
+			equals: (left, right) => left.length === right.length && left.every((path, index) => areCascaderPathsEqual(path, right[index] ?? [], equals.value)),
+			onChange: (next) => emit("update:modelValue", fromCascaderSelection(next, multipleState.value))
+		});
+		const selected = computed(() => selection.value.value);
+		const openState = useControllableState({
+			value: () => __props.open,
+			defaultValue: () => __props.defaultOpen
+		});
+		const isOpen = computed(() => openState.value.value && !disabledState.value);
+		const state = computed(() => isOpen.value ? "open" : "closed");
+		const searchState = useControllableState({
+			value: () => __props.search,
+			defaultValue: "",
+			onChange: (next) => emit("update:search", next)
+		});
+		const expanded = shallowRef([]);
+		const active = shallowRef(null);
+		const childCache = shallowRef(/* @__PURE__ */ new Map());
+		const loadingNodes = shallowRef([]);
+		const pendingLoads = /* @__PURE__ */ new Map();
+		let pendingDescend = null;
+		let mounted = false;
+		const triggerElement = shallowRef(null);
+		const contentElement = shallowRef(null);
+		function currentActive() {
+			return active.value;
+		}
+		function currentLoading() {
+			return loadingNodes.value;
+		}
+		function currentLoader() {
+			return __props.loadChildren;
+		}
+		function textOf(node) {
+			return __props.itemText?.(node) ?? defaultCascaderText(node);
+		}
+		function isDisabled(node) {
+			return disabledState.value || __props.itemDisabled?.(node) === true;
+		}
+		function staticChildren(node) {
+			return __props.getChildren === void 0 ? defaultCascaderChildren(node) : __props.getChildren(node);
+		}
+		function cachedChildren(node) {
+			const exact = childCache.value.get(node);
+			if (exact !== void 0) return exact;
+			for (const [key, children] of childCache.value) if (equals.value(key, node)) return children;
+		}
+		function childrenOf(node) {
+			const children = staticChildren(node);
+			if (children !== void 0 && children.length > 0) return children;
+			return cachedChildren(node);
+		}
+		function isLoading(node) {
+			return loadingNodes.value.some((candidate) => equals.value(candidate, node));
+		}
+		function isBranch(node) {
+			if (__props.isLeaf !== void 0) return !__props.isLeaf(node);
+			const children = staticChildren(node);
+			if (children !== void 0 && children.length > 0) return true;
+			if (__props.loadChildren === void 0) return false;
+			const cached = cachedChildren(node);
+			return cached === void 0 || cached.length > 0;
+		}
+		const columns = computed(() => {
+			const list = [{
+				level: 0,
+				loading: false,
+				options: __props.options,
+				parent: null
+			}];
+			for (const [index, node] of expanded.value.entries()) {
+				if (!isBranch(node)) break;
+				list.push({
+					level: index + 1,
+					loading: isLoading(node),
+					options: childrenOf(node) ?? [],
+					parent: node
+				});
+			}
+			return Object.freeze(list);
+		});
+		function optionsAt(level) {
+			return columns.value[level]?.options ?? [];
+		}
+		function indexIn(level, node) {
+			return optionsAt(level).findIndex((candidate) => equals.value(candidate, node));
+		}
+		function optionId(level, node) {
+			const index = indexIn(level, node);
+			return deriveDeterministicId(baseId.value, `option-${level}-${index < 0 ? "x" : index}`);
+		}
+		function columnId(level) {
+			return deriveDeterministicId(baseId.value, `column-${level}`);
+		}
+		function activeNode() {
+			const position = currentActive();
+			return position === null ? void 0 : optionsAt(position.level)[position.index];
+		}
+		const activeDescendant = computed(() => {
+			const position = currentActive();
+			if (!isOpen.value || position === null) return void 0;
+			const node = optionsAt(position.level)[position.index];
+			return node === void 0 ? void 0 : optionId(position.level, node);
+		});
+		const columnIds = computed(() => columns.value.map((column) => columnId(column.level)));
+		const selectedText = computed(() => selected.value.map((path) => joinCascaderPath(path, textOf, __props.separator)));
+		const searchResults = computed(() => searchCascaderPaths(flattenCascaderPaths(__props.options, childrenOf, __props.changeOnSelect && !multipleState.value), searchState.value.value, textOf));
+		const formEntries = computed(() => selected.value.map((path, index) => ({
+			key: String(index),
+			value: path.map((node) => __props.formValue?.(node) ?? serializeCascaderNode(node, __props.by)).join(__props.separator)
+		})));
+		function currentSelection() {
+			return selection.value.value;
+		}
+		function currentOpen() {
+			return isOpen.value;
+		}
+		function setOpen(value, nativeEvent = null) {
+			const previous = currentOpen();
+			const next = value && !disabledState.value;
+			const changed = openState.set(next);
+			if (changed || previous !== next) emit("update:open", next);
+			return changed || previous !== next;
+		}
+		function commit(next, nativeEvent) {
+			const previous = currentSelection();
+			const changed = selection.set(Object.freeze(next));
+			if (changed) emit("change", fromCascaderSelection(next, multipleState.value), fromCascaderSelection(previous, multipleState.value), nativeEvent);
+			return changed;
+		}
+		function selectPath(path, nativeEvent = null) {
+			if (disabledState.value || path.length === 0 || path.some(isDisabled)) return false;
+			const frozen = Object.freeze([...path]);
+			if (!multipleState.value) {
+				const changed = commit([frozen], nativeEvent);
+				if (!isBranch(frozen[frozen.length - 1])) setOpen(false, nativeEvent);
+				return changed;
+			}
+			const current = currentSelection();
+			const index = indexOfCascaderPath(current, frozen, equals.value);
+			return commit(index < 0 ? [...current, frozen] : current.filter((_, candidate) => candidate !== index), nativeEvent);
+		}
+		function abortLoad(level) {
+			const pending = pendingLoads.get(level);
+			if (pending === void 0) return;
+			pending.controller.abort();
+			pendingLoads.delete(level);
+			loadingNodes.value = loadingNodes.value.filter((candidate) => !equals.value(candidate, pending.node));
+		}
+		function load(level, node) {
+			const loader = currentLoader();
+			if (loader === void 0 || !mounted || isLoading(node)) return;
+			if (cachedChildren(node) !== void 0) return;
+			const staticList = staticChildren(node);
+			if (staticList !== void 0 && staticList.length > 0) return;
+			abortLoad(level);
+			const controller = new AbortController();
+			pendingLoads.set(level, {
+				controller,
+				node
+			});
+			loadingNodes.value = currentLoading().concat([node]);
+			const finish = () => {
+				if (pendingLoads.get(level)?.controller === controller) pendingLoads.delete(level);
+				loadingNodes.value = loadingNodes.value.filter((candidate) => !equals.value(candidate, node));
+			};
+			Promise.resolve().then(() => loader(node, { signal: controller.signal })).then((children) => {
+				if (controller.signal.aborted) return;
+				const next = new Map(childCache.value);
+				next.set(node, Object.freeze([...children]));
+				childCache.value = next;
+				finish();
+				if (pendingDescend !== null && equals.value(pendingDescend, node)) {
+					pendingDescend = null;
+					const current = activeNode();
+					if (current !== void 0 && equals.value(current, node)) descend(level);
+				}
+			}, (error) => {
+				if (controller.signal.aborted) return;
+				finish();
+				emit("load-error", node, error);
+			});
+		}
+		function expand(level, node) {
+			for (const pendingLevel of Array.from(pendingLoads.keys())) {
+				const pending = pendingLoads.get(pendingLevel);
+				if (pendingLevel > level || pendingLevel === level && pending !== void 0 && !equals.value(pending.node, node)) abortLoad(pendingLevel);
+			}
+			expanded.value = Object.freeze([...expanded.value.slice(0, level), node]);
+			if (isBranch(node)) load(level, node);
+		}
+		function collapseTo(level) {
+			if (expanded.value.length > level) expanded.value = Object.freeze(expanded.value.slice(0, level));
+			for (const pendingLevel of Array.from(pendingLoads.keys())) if (pendingLevel >= level) abortLoad(pendingLevel);
+		}
+		function firstEnabled(level, from = 0, step = 1) {
+			const list = optionsAt(level);
+			for (let index = from; index >= 0 && index < list.length; index += step) {
+				const node = list[index];
+				if (node !== void 0 && !isDisabled(node)) return index;
+			}
+			return null;
+		}
+		function setActive(level, index) {
+			active.value = index === null ? null : {
+				index,
+				level
+			};
+			if (index !== null) collapseTo(level + (expanded.value.length > level && sameAsExpanded(level, index) ? 1 : 0));
+		}
+		function sameAsExpanded(level, index) {
+			const node = optionsAt(level)[index];
+			const opened = expanded.value[level];
+			return node !== void 0 && opened !== void 0 && equals.value(node, opened);
+		}
+		function descend(level) {
+			const index = firstEnabled(level + 1);
+			if (index !== null) active.value = {
+				index,
+				level: level + 1
+			};
+		}
+		function pathTo(level, node) {
+			return Object.freeze([...expanded.value.slice(0, level), node]);
+		}
+		function initializeOnOpen() {
+			const path = currentSelection()[0];
+			expanded.value = Object.freeze([]);
+			active.value = null;
+			if (path !== void 0 && path.length > 0) {
+				for (const [level, node] of path.slice(0, -1).entries()) expand(level, node);
+				const level = path.length - 1;
+				const last = path[level];
+				const index = indexIn(level, last);
+				if (index >= 0) {
+					active.value = {
+						index,
+						level
+					};
+					return;
+				}
+			}
+			const index = firstEnabled(0);
+			active.value = index === null ? null : {
+				index,
+				level: 0
+			};
+		}
+		watch(isOpen, (next) => {
+			if (next) {
+				initializeOnOpen();
+				return;
+			}
+			active.value = null;
+			pendingDescend = null;
+		}, {
+			flush: "sync",
+			immediate: true
+		});
+		let typeaheadBuffer = "";
+		let typeaheadTimer = null;
+		function typeahead(key) {
+			const position = currentActive();
+			const level = position?.level ?? 0;
+			const list = optionsAt(level);
+			if (list.length === 0) return false;
+			typeaheadBuffer = typeaheadBuffer.length > 0 && [...typeaheadBuffer].every((char) => char === key) ? key : `${typeaheadBuffer}${key}`;
+			if (typeaheadTimer !== null) clearTimeout(typeaheadTimer);
+			typeaheadTimer = setTimeout(() => {
+				typeaheadBuffer = "";
+				typeaheadTimer = null;
+			}, __props.typeaheadTimeout);
+			const needle = normalizeCascaderText(typeaheadBuffer);
+			const start = (position?.index ?? -1) + (typeaheadBuffer.length === 1 ? 1 : 0);
+			for (let offset = 0; offset < list.length; offset++) {
+				const index = (start + offset + list.length) % list.length;
+				const node = list[index];
+				if (node === void 0 || isDisabled(node)) continue;
+				if (normalizeCascaderText(textOf(node)).startsWith(needle)) {
+					setActive(level, index);
+					return true;
+				}
+			}
+			return true;
+		}
+		function resetTypeahead() {
+			typeaheadBuffer = "";
+			if (typeaheadTimer !== null) clearTimeout(typeaheadTimer);
+			typeaheadTimer = null;
+		}
+		onScopeDispose(resetTypeahead);
+		function isPrintable(event) {
+			return event.key.length === 1 && event.key !== " " && !event.ctrlKey && !event.metaKey && !event.altKey;
+		}
+		function activateNode(level, node, event) {
+			if (isBranch(node)) {
+				expand(level, node);
+				if (childrenOf(node) === void 0) pendingDescend = node;
+				else descend(level);
+				if (__props.changeOnSelect && !multipleState.value) selectPath(pathTo(level, node), event);
+				return;
+			}
+			selectPath(pathTo(level, node), event);
+		}
+		function onTriggerKeydown(event) {
+			if (disabledState.value || event.defaultPrevented || event.isComposing) return;
+			const { key } = event;
+			if (!isOpen.value) {
+				if (key === "ArrowDown" || key === "ArrowUp" || key === "Enter" || key === " ") {
+					event.preventDefault();
+					setOpen(true, event);
+				}
+				return;
+			}
+			if (!isPrintable(event) && key !== " ") resetTypeahead();
+			const position = currentActive() ?? {
+				index: -1,
+				level: 0
+			};
+			const node = activeNode();
+			switch (key) {
+				case "ArrowDown":
+				case "ArrowUp": {
+					event.preventDefault();
+					const step = key === "ArrowDown" ? 1 : -1;
+					const index = firstEnabled(position.level, position.index + step, step);
+					if (index !== null) setActive(position.level, index);
+					return;
+				}
+				case "Home":
+				case "End": {
+					event.preventDefault();
+					const list = optionsAt(position.level);
+					const index = key === "Home" ? firstEnabled(position.level) : firstEnabled(position.level, list.length - 1, -1);
+					if (index !== null) setActive(position.level, index);
+					return;
+				}
+				case "ArrowRight":
+					event.preventDefault();
+					if (node !== void 0 && isBranch(node) && !isDisabled(node)) {
+						expand(position.level, node);
+						if (childrenOf(node) === void 0) pendingDescend = node;
+						else descend(position.level);
+					}
+					return;
+				case "ArrowLeft":
+					event.preventDefault();
+					if (position.level > 0) {
+						const parent = expanded.value[position.level - 1];
+						const index = parent === void 0 ? -1 : indexIn(position.level - 1, parent);
+						pendingDescend = null;
+						if (index >= 0) {
+							active.value = {
+								index,
+								level: position.level - 1
+							};
+							collapseTo(position.level - 1);
+						}
+					}
+					return;
+				case "Enter":
+				case " ":
+					if (key === " " && typeaheadBuffer.length > 0) {
+						event.preventDefault();
+						typeahead(key);
+						return;
+					}
+					event.preventDefault();
+					if (node !== void 0 && !isDisabled(node)) activateNode(position.level, node, event);
+					return;
+				case "Escape":
+					event.preventDefault();
+					setOpen(false, event);
+					return;
+				case "Tab":
+					setOpen(false, event);
+					return;
+				default: if (isPrintable(event)) {
+					event.preventDefault();
+					typeahead(key);
+				}
+			}
+		}
+		function pressItem(level, node, event) {
+			if (isDisabled(node)) return;
+			const index = indexIn(level, node);
+			if (index >= 0) active.value = {
+				index,
+				level
+			};
+			if (isBranch(node)) {
+				expand(level, node);
+				if (__props.changeOnSelect && !multipleState.value) selectPath(pathTo(level, node), event);
+				return;
+			}
+			selectPath(pathTo(level, node), event);
+		}
+		function hoverItem(level, node) {
+			if (isDisabled(node)) return;
+			const index = indexIn(level, node);
+			if (index >= 0) active.value = {
+				index,
+				level
+			};
+			if (__props.expandTrigger === "hover" && isBranch(node)) expand(level, node);
+		}
+		function sameExpanded(level, node) {
+			const opened = expanded.value[level];
+			return opened !== void 0 && equals.value(opened, node);
+		}
+		function prefixMatches(path, level, node) {
+			return areCascaderPathsEqual(path.slice(0, level + 1), pathTo(level, node), equals.value);
+		}
+		onMounted(() => {
+			mounted = true;
+			if (isOpen.value) {
+				for (const [level, node] of expanded.value.entries()) if (isBranch(node)) load(level, node);
+			}
+		});
+		onScopeDispose(() => {
+			mounted = false;
+			for (const level of Array.from(pendingLoads.keys())) abortLoad(level);
+		});
+		const context = {
+			activeDescendant,
+			baseId,
+			columnId,
+			columnIds,
+			columns,
+			contentElement,
+			contentId,
+			disabled: disabledState,
+			hoverItem,
+			isActive: (level, node) => {
+				const position = currentActive();
+				const current = position === null || position.level !== level ? void 0 : activeNode();
+				return current !== void 0 && equals.value(current, node);
+			},
+			isBranch,
+			isDisabled,
+			isExpanded: sameExpanded,
+			isLoading,
+			isPartial: (level, node) => selected.value.some((path) => path.length > level + 1 && prefixMatches(path, level, node)),
+			isSelectedEnd: (level, node) => selected.value.some((path) => path.length === level + 1 && prefixMatches(path, level, node)),
+			multiple: multipleState,
+			onTriggerKeydown,
+			open: isOpen,
+			optionId,
+			placeholder: placeholderState,
+			pressItem,
+			required: requiredState,
+			selectedText,
+			setOpen,
+			state,
+			textOf,
+			triggerElement,
+			triggerId
+		};
+		cascaderContext.provide(context);
+		const slotState = computed(() => ({
+			columns: columns.value,
+			disabled: disabledState.value,
+			open: isOpen.value,
+			searchResults: searchResults.value,
+			selected: selected.value,
+			selectedText: selectedText.value,
+			selectPath: (path) => selectPath(path, null),
+			state: state.value
+		}));
+		__expose({
+			clear: () => commit([], null),
+			expandPath: (path) => {
+				for (const [level, node] of path.entries()) expand(level, node);
+			},
+			focus: (focusOptions) => triggerElement.value?.focus(focusOptions),
+			open: isOpen,
+			reset: () => selection.reset(),
+			selected,
+			selectPath: (path) => selectPath(path, null),
+			setOpen: (value) => setOpen(value, null)
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: unref(baseId),
+				"data-vize-ui": "cascader",
+				part: "root",
+				"data-state": state.value,
+				"data-selection-mode": multipleState.value ? "multiple" : "single",
+				"data-disabled": disabledState.value ? "true" : void 0,
+				"data-empty": selected.value.length === 0 ? "true" : void 0
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true), __props.name !== void 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(formEntries.value, (entry) => {
+				return openBlock(), createElementBlock("input", {
+					key: entry.key,
+					type: "hidden",
+					"data-vize-ui": "cascader-native",
+					part: "native",
+					name: __props.name,
+					form: __props.form,
+					value: entry.value,
+					disabled: disabledState.value
+				}, null, 8, _hoisted_2$1);
+			}), 128)) : createCommentVNode("v-if", true)], 8, _hoisted_1$5);
+		};
+	}
+}), [["__scopeId", "data-v-22bf052d"]]);
+//#endregion
+//#region src/families/selection/cascader/cascader-column.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$4 = [
+	"id",
+	"aria-label",
+	"aria-busy",
+	"aria-multiselectable",
+	"data-level",
+	"data-loading"
+];
+//#endregion
+//#region src/families/selection/cascader/cascader-column.vue
+var cascader_column_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "cascader-column",
+	props: {
+		level: {
+			type: Number,
+			required: true
+		},
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		}
+	},
+	setup(__props) {
+		const context = cascaderContext.use();
+		const column = computed(() => context.columns.value[__props.level]);
+		const loading = computed(() => column.value?.loading === true);
+		const label = computed(() => {
+			if (__props.ariaLabel !== void 0) return __props.ariaLabel;
+			const parent = column.value?.parent;
+			return parent === null || parent === void 0 ? "Options" : context.textOf(parent);
+		});
+		const listboxProps = computed(() => ({
+			role: "listbox",
+			onMousedown: keepTriggerFocus,
+			onPointerdown: keepTriggerFocus
+		}));
+		function keepTriggerFocus(event) {
+			if (event.button === 0) event.preventDefault();
+		}
+		cascaderColumnContext.provide({ level: computed(() => __props.level) });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({ id: unref(context).columnId(__props.level) }, listboxProps.value, {
+				"aria-label": label.value,
+				"aria-busy": loading.value ? "true" : void 0,
+				"aria-multiselectable": unref(context).multiple.value ? "true" : void 0,
+				"data-vize-ui": "cascader-column",
+				part: "column",
+				"data-level": __props.level,
+				"data-loading": loading.value ? "true" : void 0
+			}), [renderSlot(_ctx.$slots, "default", {
+				level: __props.level,
+				loading: loading.value
+			}, void 0, true)], 16, _hoisted_1$4);
+		};
+	}
+}), [["__scopeId", "data-v-c248a1cb"]]);
+//#endregion
+//#region src/families/selection/cascader/cascader-content.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$3 = ["hidden", "data-state"];
+const _hoisted_2 = [
+	"id",
+	"aria-label",
+	"hidden",
+	"data-state",
+	"data-placement"
+];
+//#endregion
+//#region src/families/selection/cascader/cascader-content.vue
+var cascader_content_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "cascader-content",
+	props: {
+		placement: {
+			type: String,
+			required: false,
+			default: "bottom-start"
+		},
+		strategy: {
+			type: String,
+			required: false,
+			default: "fixed"
+		},
+		offset: {
+			type: Number,
+			required: false,
+			default: 4
+		},
+		collisionPadding: {
+			type: Number,
+			required: false,
+			default: 8
+		},
+		flip: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		shift: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		size: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		to: {
+			type: null,
+			required: false,
+			default: "body"
+		},
+		portalDisabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		defer: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		forceMount: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		}
+	},
+	emits: [
+		"escape-key-down",
+		"pointer-down-outside",
+		"dismiss"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const context = cascaderContext.use();
+		const element = useTemplateRef("element");
+		const present = computed(() => context.open.value || __props.forceMount);
+		const positionerProps = computed(() => ({
+			collisionPadding: __props.collisionPadding,
+			flip: __props.flip,
+			offset: __props.offset,
+			placement: __props.placement,
+			reference: context.triggerElement.value,
+			shift: __props.shift,
+			size: __props.size,
+			strategy: __props.strategy
+		}));
+		const layer = useDismissableLayer({
+			root: element,
+			branches: () => context.triggerElement.value === null ? [] : [context.triggerElement.value],
+			enabled: () => context.open.value,
+			onEscapeKeyDown: (event) => emit("escape-key-down", event),
+			onPointerDownOutside: (event) => emit("pointer-down-outside", event),
+			onDismiss: (event) => {
+				emit("dismiss", event);
+				context.setOpen(false, event.originalEvent);
+			}
+		});
+		const contentBindings = computed(() => ({
+			...layer.layerProps,
+			onMousedown: keepTriggerFocus,
+			onPointerdown: keepTriggerFocus
+		}));
+		watch(element, (next, previous) => {
+			if (previous !== null && context.contentElement.value === previous) context.contentElement.value = null;
+			if (next !== null) context.contentElement.value = next;
+			layer.refresh();
+		}, { flush: "post" });
+		onUnmounted(() => {
+			if (context.contentElement.value === element.value) context.contentElement.value = null;
+		});
+		function keepTriggerFocus(event) {
+			if (event.button === 0) event.preventDefault();
+		}
+		function isPlacement(value) {
+			return /^(?:top|right|bottom|left)(?:-(?:start|center|end))?$/u.test(value);
+		}
+		function placementOf(value) {
+			return typeof value === "string" && isPlacement(value) ? value : __props.placement;
+		}
+		function slotState(resolved) {
+			return {
+				open: context.open.value,
+				placement: placementOf(resolved)
+			};
+		}
+		__expose({ element });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-vize-ui": "cascader-content-host",
+				part: "content-host",
+				hidden: unref(context).open.value ? void 0 : true,
+				"data-state": unref(context).state.value
+			}, [present.value ? (openBlock(), createBlock(portal_default, {
+				key: 0,
+				to: __props.to,
+				disabled: __props.portalDisabled,
+				defer: __props.defer
+			}, {
+				default: withCtx(() => [createVNode(presence_default, {
+					present: unref(context).open.value,
+					"force-mount": __props.forceMount
+				}, {
+					default: withCtx(() => [createVNode(positioner_default, normalizeProps(guardReactiveProps(positionerProps.value)), {
+						default: withCtx(({ placement: resolved }) => [createElementVNode("div", mergeProps({
+							id: unref(context).contentId.value,
+							ref_key: "element",
+							ref: element
+						}, contentBindings.value, {
+							"aria-label": __props.ariaLabel,
+							"data-vize-ui": "cascader-content",
+							part: "content",
+							hidden: unref(context).open.value ? void 0 : true,
+							"data-state": unref(context).state.value,
+							"data-placement": placementOf(resolved)
+						}), [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState(resolved))), void 0, true)], 16, _hoisted_2)]),
+						_: 3
+					}, 16)]),
+					_: 3
+				}, 8, ["present", "force-mount"])]),
+				_: 3
+			}, 8, [
+				"to",
+				"disabled",
+				"defer"
+			])) : createCommentVNode("v-if", true)], 8, _hoisted_1$3);
+		};
+	}
+}), [["__scopeId", "data-v-1aedc9e4"]]);
+//#endregion
+//#region src/families/selection/cascader/cascader-item.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$2 = [
+	"id",
+	"aria-selected",
+	"aria-expanded",
+	"aria-disabled",
+	"aria-busy",
+	"aria-label",
+	"data-state",
+	"data-branch",
+	"data-highlighted",
+	"data-loading",
+	"data-disabled"
+];
+//#endregion
+//#region src/families/selection/cascader/cascader-item.vue
+var cascader_item_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "cascader-item",
+	props: {
+		value: {
+			type: null,
+			required: true
+		},
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		}
+	},
+	setup(__props) {
+		const context = cascaderContext.use();
+		const column = cascaderColumnContext.use();
+		const level = computed(() => column.level.value);
+		const branch = computed(() => context.isBranch(__props.value));
+		const expanded = computed(() => branch.value && context.isExpanded(level.value, __props.value));
+		const loading = computed(() => context.isLoading(__props.value));
+		const active = computed(() => context.isActive(level.value, __props.value));
+		const selected = computed(() => context.isSelectedEnd(level.value, __props.value));
+		const partial = computed(() => !selected.value && context.isPartial(level.value, __props.value));
+		const disabled = computed(() => context.isDisabled(__props.value));
+		const state = computed(() => {
+			if (selected.value) return "checked";
+			return partial.value ? "partial" : "unchecked";
+		});
+		const slotState = computed(() => ({
+			active: active.value,
+			branch: branch.value,
+			disabled: disabled.value,
+			expanded: expanded.value,
+			level: level.value,
+			loading: loading.value,
+			partial: partial.value,
+			selected: selected.value,
+			state: state.value,
+			value: __props.value
+		}));
+		const interactiveProps = computed(() => ({
+			role: "option",
+			onClick: (event) => context.pressItem(level.value, __props.value, event),
+			onPointermove: (event) => {
+				if (event.pointerType !== "touch" && !active.value) context.hoverItem(level.value, __props.value);
+			}
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({ id: unref(context).optionId(level.value, __props.value) }, interactiveProps.value, {
+				"aria-selected": selected.value ? "true" : "false",
+				"aria-expanded": branch.value ? expanded.value ? "true" : "false" : void 0,
+				"aria-disabled": disabled.value ? "true" : void 0,
+				"aria-busy": loading.value ? "true" : void 0,
+				"aria-label": __props.ariaLabel,
+				"data-vize-ui": "cascader-item",
+				part: "item",
+				"data-state": state.value,
+				"data-branch": branch.value ? "true" : void 0,
+				"data-highlighted": active.value ? "true" : void 0,
+				"data-loading": loading.value ? "true" : void 0,
+				"data-disabled": disabled.value ? "true" : void 0
+			}), [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 16, _hoisted_1$2);
+		};
+	}
+}), [["__scopeId", "data-v-8f1b9309"]]);
+//#endregion
+//#region src/families/selection/cascader/cascader-trigger.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$1 = [
+	"id",
+	"disabled",
+	"aria-expanded",
+	"aria-controls",
+	"aria-activedescendant",
+	"aria-label",
+	"aria-labelledby",
+	"aria-describedby",
+	"aria-required",
+	"data-state",
+	"data-placeholder"
+];
+//#endregion
+//#region src/families/selection/cascader/cascader-trigger.vue
+var cascader_trigger_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "cascader-trigger",
+	props: {
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaLabelledby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaDescribedby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const context = cascaderContext.use();
+		const element = useTemplateRef("element");
+		const interactiveProps = computed(() => ({
+			role: "combobox",
+			onClick: (event) => {
+				if (!context.disabled.value) context.setOpen(!context.open.value, event);
+			},
+			onKeydown: (event) => context.onTriggerKeydown(event)
+		}));
+		onMounted(() => {
+			context.triggerElement.value = element.value;
+		});
+		onUnmounted(() => {
+			if (context.triggerElement.value === element.value) context.triggerElement.value = null;
+		});
+		__expose({
+			element,
+			focus: (options) => element.value?.focus(options)
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("button", mergeProps({
+				id: unref(context).triggerId.value,
+				ref_key: "element",
+				ref: element
+			}, interactiveProps.value, {
+				type: "button",
+				disabled: unref(context).disabled.value,
+				"aria-haspopup": "listbox",
+				"aria-expanded": unref(context).open.value ? "true" : "false",
+				"aria-controls": unref(context).open.value ? unref(context).columnIds.value.join(" ") : void 0,
+				"aria-activedescendant": unref(context).activeDescendant.value,
+				"aria-label": __props.ariaLabel,
+				"aria-labelledby": __props.ariaLabelledby,
+				"aria-describedby": __props.ariaDescribedby,
+				"aria-required": unref(context).required.value ? "true" : void 0,
+				"data-vize-ui": "cascader-trigger",
+				part: "trigger",
+				"data-state": unref(context).state.value,
+				"data-placeholder": unref(context).selectedText.value.length === 0 ? "true" : void 0
+			}), [renderSlot(_ctx.$slots, "default", {
+				open: unref(context).open.value,
+				empty: unref(context).selectedText.value.length === 0
+			}, void 0, true)], 16, _hoisted_1$1);
+		};
+	}
+}), [["__scopeId", "data-v-de96c0bc"]]);
+//#endregion
+//#region src/families/selection/cascader/cascader-value.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = ["data-placeholder"];
+//#endregion
+//#region src/families/selection/cascader/cascader-value.vue
+var cascader_value_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "cascader-value",
+	props: { pathSeparator: {
+		type: String,
+		required: false,
+		default: ", "
+	} },
+	setup(__props) {
+		const context = cascaderContext.use();
+		const empty = computed(() => context.selectedText.value.length === 0);
+		const slotState = computed(() => ({
+			empty: empty.value,
+			placeholder: context.placeholder.value,
+			selectedText: context.selectedText.value
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", {
+				"data-vize-ui": "cascader-value",
+				part: "value",
+				"data-placeholder": empty.value ? "true" : void 0
+			}, [empty.value ? renderSlot(_ctx.$slots, "placeholder", normalizeProps(mergeProps({ key: 0 }, slotState.value)), () => [createTextVNode(toDisplayString(unref(context).placeholder.value), 1)], true) : renderSlot(_ctx.$slots, "default", normalizeProps(mergeProps({ key: 1 }, slotState.value)), () => [createTextVNode(toDisplayString(unref(context).selectedText.value.join(__props.pathSeparator)), 1)], true)], 8, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-1e32ee46"]]);
+//#endregion
+export { toCascaderSelection as _, cascader_column_default as a, createCascaderEquality as c, flattenCascaderPaths as d, fromCascaderSelection as f, serializeCascaderNode as g, searchCascaderPaths as h, cascader_content_default as i, defaultCascaderChildren as l, normalizeCascaderText as m, cascader_trigger_default as n, cascader_root_default as o, joinCascaderPath as p, cascader_item_default as r, areCascaderPathsEqual as s, cascader_value_default as t, findCascaderPath as u };