@deftui/react 0.2.5 → 0.3.1

package/dist/vendor/reui.io/cascader/cascader-item.mjs

@@ -0,0 +1,533 @@
+"use client";
+import { useCascaderActions, useCascaderRender, useCascaderState } from "./cascader-context.mjs";
+import { getCascaderCount, getCascaderMoreParent, getCascaderPath, isCascaderMoreNode } from "./cascader-lib.mjs";
+import { Spinner } from "../../shadcn/spinner.mjs";
+import { cn } from "cn";
+import { mergeProps } from "@base-ui/react/merge-props";
+import * as React$1 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useRender } from "@base-ui/react/use-render";
+import { CheckIcon, ChevronRightIcon, LoaderCircleIcon, MinusIcon, RotateCwIcon } from "lucide-react";
+import { Combobox } from "@base-ui/react";
+// src/vendor/reui.io/cascader/cascader-item.tsx
+const ROW_INSET_CLASS = "[--cascader-row-inset:8px]";
+const ROW_FLUSH_CLASS = "ps-[var(--cascader-row-inset,8px)]! pe-[var(--cascader-row-inset,8px)]!";
+const ROW_GUTTER_CLASS = "ps-[var(--cascader-row-inset,8px)]! pe-[calc(var(--cascader-row-inset,8px)*2_+_16px)]!";
+const INDICATOR_CLASS = "pointer-events-none absolute flex items-center justify-center size-4 end-[var(--cascader-row-inset,8px)]! rtl:right-auto!";
+const ROW_THEME_CLASS = "data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground rounded-sm py-1.5 [&_svg:not([class*='size-'])]:size-4";
+/**
+* The row's gap and type, per style, held apart from the rest of the theme.
+*
+* A row that pins its own gap or text size takes `ROW_SHELL_CLASS` and leaves
+* these out, because a `style-<name>:` utility is emitted AFTER the plain one
+* it would have to lose to. Not receiving the token beats overriding it with
+* `!`, which a consumer then has to fight in turn.
+*/
+const ROW_GAP_CLASS = "gap-2";
+const ROW_TEXT_CLASS = "text-sm";
+const ROW_SHELL_CLASS = `${ROW_THEME_CLASS} relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 ${ROW_INSET_CLASS}`;
+const ROW_CLASS = `${ROW_SHELL_CLASS} ${ROW_GAP_CLASS} ${ROW_TEXT_CLASS}`;
+const CASCADER_ACTION_INSET_CLASS = `${ROW_INSET_CLASS} ${ROW_FLUSH_CLASS}`;
+/** A footer COMMAND: the row theme, so it cannot drift from the list, plus the
+*  hover and `focus-visible` fills a plain button never gets. Fills, never a
+*  ring: a ring under rows that all paint with a fill read as a different
+*  widget bolted on. `focus-visible`, not `focus`, so a pointer press does not
+*  leave a command painted as if it were still hovered. Disabled keys off
+*  `aria-disabled`, not `:disabled`, to keep it FOCUSABLE: a footer whose only
+*  row is disabled has no tab stop. */
+const CASCADER_ACTION_CLASS = `${ROW_SHELL_CLASS} ${ROW_TEXT_CLASS} ${ROW_FLUSH_CLASS} hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground cursor-pointer gap-2 transition-colors aria-disabled:pointer-events-none aria-disabled:opacity-50`;
+const AFFORDANCE_BOX_CLASS = "flex size-5 shrink-0 items-center justify-center rounded-sm";
+const AFFORDANCE_HOVER_CLASS = "transition-[background-color,box-shadow,color] hover:bg-background hover:text-foreground! hover:**:text-foreground! hover:shadow-xs";
+const CHECKBOX_MARK_CLASS = "text-primary-foreground! **:text-primary-foreground!";
+const INDICATOR_MARK_CLASS = "text-foreground! **:text-foreground!";
+const CASCADER_HOVER_EXPAND_DELAY = 150;
+/** One row. Branch presses navigate instead of selecting, vetoed here with
+*  `preventBaseUIHandler()` on `onClick` (Enter too) and on `onMouseUp`. */
+const CascaderItem = React$1.memo(function CascaderItem({ node, index, depth, showPath = false, as = "option", expanded, indent = 16, branch: branchProp, selectable: selectableProp, selected: selectedProp, indeterminate: indeterminateProp, selectedCount: selectedCountProp, loading, error, childrenLoading = false, childrenError = false, className, children, onClick, onMouseUp, style, ...props }) {
+	const { index: treeIndex, mode, labels, isBranch, isSelectable, isDisabled, isSelected, isIndeterminate, selectedDescendantCount, multiple, branchesSelectable, indicator: indicatorEnabled, expandTrigger = "click", navigate, navigateAt, toggleExpanded, commit, getState, virtualized, loadMore, retryLevel } = useCascaderActions();
+	const { renderItem, renderLabel } = useCascaderRender();
+	const branch = branchProp ?? isBranch(node);
+	const selectable = selectableProp ?? isSelectable(node);
+	const disabled = isDisabled(node);
+	const selected = selectedProp ?? isSelected(node);
+	const indeterminate = !selected && (indeterminateProp ?? isIndeterminate(node));
+	const count = branch ? getCascaderCount(treeIndex, node) : 0;
+	const nodeDepth = depth ?? treeIndex.depthOf.get(node.value) ?? 0;
+	const selectedDescendants = branch ? selectedCountProp ?? selectedDescendantCount(node) : 0;
+	const showsSelectedCount = multiple && selectedDescendants > 0;
+	const trailingCount = showsSelectedCount ? selectedDescendants : count;
+	const showCount = trailingCount > 0;
+	const leadingCheckbox = mode === "tree" && multiple;
+	const showsIndicator = indicatorEnabled || multiple;
+	const veto = React$1.useCallback((event) => {
+		event.preventBaseUIHandler?.();
+	}, []);
+	const handleClick = React$1.useCallback((event) => {
+		onClick?.(event);
+		if (disabled) return;
+		if (branch && !selectable) {
+			veto(event);
+			navigate(node);
+		}
+	}, [
+		onClick,
+		node,
+		disabled,
+		branch,
+		selectable,
+		veto,
+		navigate
+	]);
+	const handleMouseUp = React$1.useCallback((event) => {
+		onMouseUp?.(event);
+		if (disabled) return;
+		if (branch && !selectable) veto(event);
+	}, [
+		onMouseUp,
+		disabled,
+		branch,
+		selectable,
+		veto
+	]);
+	const handleExpanderClick = React$1.useCallback((event) => {
+		event.stopPropagation();
+		veto(event);
+		if (expanded) {
+			if (!disabled || getState().expanded.has(node.value)) toggleExpanded(node.value);
+		} else if (!disabled) navigate(node);
+	}, [
+		veto,
+		node,
+		disabled,
+		expanded,
+		getState,
+		toggleExpanded,
+		navigate
+	]);
+	const handleExpanderMouseUp = React$1.useCallback((event) => {
+		event.stopPropagation();
+		veto(event);
+	}, [veto]);
+	const handleChevronClick = React$1.useCallback((event) => {
+		event.stopPropagation();
+		veto(event);
+		if (disabled) return;
+		if (as === "button") navigateAt(node, depth ?? 0);
+		else navigate(node);
+	}, [
+		veto,
+		node,
+		disabled,
+		as,
+		navigateAt,
+		depth,
+		navigate
+	]);
+	const handleChevronMouseUp = React$1.useCallback((event) => veto(event), [veto]);
+	const handleButtonMouseDown = React$1.useCallback((event) => {
+		event.preventDefault();
+	}, []);
+	const handleButtonClick = React$1.useCallback((event) => {
+		onClick?.(event);
+		if (disabled) return;
+		if (branch && !selectable) {
+			navigateAt(node, depth ?? 0);
+			return;
+		}
+		if (selectable) commit(node);
+	}, [
+		onClick,
+		node,
+		disabled,
+		branch,
+		selectable,
+		navigateAt,
+		depth,
+		commit
+	]);
+	const handleMoreClick = React$1.useCallback((event) => {
+		onClick?.(event);
+		veto(event);
+		const parent = getCascaderMoreParent(node);
+		if (parent == null) return;
+		if (error) retryLevel(parent);
+		else if (!loading) loadMore(parent);
+	}, [
+		onClick,
+		veto,
+		node,
+		error,
+		loading,
+		retryLevel,
+		loadMore
+	]);
+	const hoverNavigates = expandTrigger === "hover" && mode === "columns" && as === "option" && branch && !disabled;
+	const hoverTimerRef = React$1.useRef(null);
+	const cancelHoverNavigate = React$1.useCallback(() => {
+		if (hoverTimerRef.current == null) return;
+		window.clearTimeout(hoverTimerRef.current);
+		hoverTimerRef.current = null;
+	}, []);
+	const handleHoverPointerEnter = React$1.useCallback(() => {
+		cancelHoverNavigate();
+		hoverTimerRef.current = window.setTimeout(() => {
+			hoverTimerRef.current = null;
+			navigate(node);
+		}, CASCADER_HOVER_EXPAND_DELAY);
+	}, [
+		cancelHoverNavigate,
+		navigate,
+		node
+	]);
+	React$1.useEffect(() => {
+		if (!hoverNavigates) cancelHoverNavigate();
+	}, [hoverNavigates, cancelHoverNavigate]);
+	React$1.useEffect(() => cancelHoverNavigate, [cancelHoverNavigate]);
+	if (isCascaderMoreNode(node)) {
+		const text = error ? labels.error : loading ? node.count ? labels.loadingMore : labels.loading : labels.loadMore;
+		const moreStyle = mode === "tree" && nodeDepth > 0 ? {
+			...style,
+			"--cascader-indent": `${nodeDepth * indent}px`
+		} : style;
+		const moreShared = {
+			"data-slot": "cascader-item",
+			"data-more": "",
+			"data-state": error ? "error" : loading ? "loading" : "idle",
+			"data-depth": nodeDepth,
+			style: moreStyle,
+			className: cn(ROW_SHELL_CLASS, ROW_FLUSH_CLASS, "text-muted-foreground justify-center gap-1.5 text-xs", !error && !loading && "hover:text-foreground", mode === "tree" && "ps-[calc(var(--cascader-row-inset,8px)_+_var(--cascader-indent,0px))]!", className)
+		};
+		const moreBody = children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+			loading ? /* @__PURE__ */ jsx(LoaderCircleIcon, {
+				className: "size-3.5 animate-spin",
+				"aria-hidden": true
+			}) : null,
+			/* @__PURE__ */ jsx("span", { children: text }),
+			error ? /* @__PURE__ */ jsx("span", {
+				className: "text-foreground font-medium",
+				children: labels.retry
+			}) : null
+		] });
+		if (as === "button") {
+			const buttonProps = { ...props };
+			delete buttonProps["aria-setsize"];
+			delete buttonProps["aria-posinset"];
+			delete buttonProps["aria-level"];
+			return /* @__PURE__ */ jsx("button", {
+				type: "button",
+				...moreShared,
+				tabIndex: -1,
+				onClick: handleMoreClick,
+				...buttonProps,
+				children: moreBody
+			});
+		}
+		return /* @__PURE__ */ jsx(Combobox.Item, {
+			...moreShared,
+			value: node,
+			...virtualized && index != null ? { index } : null,
+			...mode === "tree" ? {
+				role: "treeitem",
+				"aria-level": nodeDepth + 1
+			} : null,
+			onClick: handleMoreClick,
+			onMouseUp: veto,
+			...props,
+			children: moreBody
+		});
+	}
+	const itemState = {
+		branch,
+		selected,
+		disabled,
+		depth: nodeDepth,
+		count,
+		path: showPath ? getCascaderPath(treeIndex, node.value).slice(0, -1) : []
+	};
+	const custom = renderItem?.(node, itemState);
+	const customLabel = renderLabel?.(node, itemState);
+	const srDetails = [
+		branch ? labels.itemCount(count) : null,
+		showsSelectedCount ? labels.selectedCount(selectedDescendants) : null,
+		branch && mode !== "tree" ? labels.branchAffordance : null,
+		as === "button" && selected ? labels.selectedState : null,
+		as === "button" && indeterminate ? labels.partiallySelectedState : null
+	].filter(Boolean).map((detail) => `, ${detail}`).join("");
+	const checkbox = /* @__PURE__ */ jsx("span", {
+		"data-slot": "cascader-item-checkbox",
+		className: "border-input in-data-[selected]:bg-primary in-data-[selected]:border-primary in-data-[selected]:text-primary-foreground in-data-[indeterminate]:bg-primary in-data-[indeterminate]:border-primary in-data-[indeterminate]:text-primary-foreground flex size-4 shrink-0 items-center justify-center rounded-[4px] border transition-colors",
+		children: indeterminate ? /* @__PURE__ */ jsx(MinusIcon, {
+			"data-slot": "cascader-item-dash",
+			className: cn(CHECKBOX_MARK_CLASS, "size-3")
+		}) : /* @__PURE__ */ jsx(CheckIcon, {
+			"data-slot": "cascader-item-tick",
+			className: cn(CHECKBOX_MARK_CLASS, "size-3 opacity-0 in-data-[selected]:opacity-100")
+		})
+	});
+	const indicator = /* @__PURE__ */ jsx(Fragment, { children: multiple ? checkbox : /* @__PURE__ */ jsx(CheckIcon, {
+		"data-slot": "cascader-item-check",
+		className: cn("pointer-events-none", INDICATOR_MARK_CLASS)
+	}) });
+	const body = custom ?? children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+		mode === "tree" && branch ? /* @__PURE__ */ jsx("span", {
+			"data-slot": "cascader-item-expander",
+			"aria-hidden": "true",
+			"data-state": childrenError ? "error" : childrenLoading ? "loading" : "idle",
+			onClick: handleExpanderClick,
+			onMouseUp: handleExpanderMouseUp,
+			className: cn("-ms-0.5", childrenError ? "text-destructive" : "text-muted-foreground", AFFORDANCE_BOX_CLASS, AFFORDANCE_HOVER_CLASS, disabled && expanded && "pointer-events-auto", childrenLoading && "pointer-events-none"),
+			children: childrenLoading ? /* @__PURE__ */ jsx(Spinner, {
+				"aria-hidden": "true",
+				className: "size-4"
+			}) : childrenError ? /* @__PURE__ */ jsx(RotateCwIcon, { className: "size-4" }) : /* @__PURE__ */ jsx(ChevronRightIcon, { className: cn("size-4 transition-transform", expanded ? "rotate-90" : "rtl:-scale-x-100") })
+		}) : mode === "tree" ? /* @__PURE__ */ jsx("span", {
+			"data-slot": "cascader-item-expander-spacer",
+			"aria-hidden": "true",
+			className: cn("-ms-0.5", AFFORDANCE_BOX_CLASS)
+		}) : null,
+		leadingCheckbox ? selectable ? checkbox : /* @__PURE__ */ jsx("span", {
+			"data-slot": "cascader-item-checkbox-spacer",
+			"aria-hidden": "true",
+			className: "size-4 shrink-0"
+		}) : null,
+		node.icon ? /* @__PURE__ */ jsx("span", {
+			"data-slot": "cascader-item-icon",
+			className: "text-muted-foreground flex shrink-0 items-center justify-center",
+			children: node.icon
+		}) : null,
+		/* @__PURE__ */ jsxs("span", {
+			className: "flex min-w-0 flex-1 flex-col items-start gap-0.5",
+			children: [customLabel ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+				className: "w-full truncate text-start",
+				children: node.label
+			}), node.description ? /* @__PURE__ */ jsx("span", {
+				"data-slot": "cascader-item-description",
+				className: "text-muted-foreground w-full truncate text-start text-xs",
+				children: node.description
+			}) : null] }), showPath ? /* @__PURE__ */ jsx(CascaderItemPath, { node }) : null]
+		}),
+		srDetails ? /* @__PURE__ */ jsx("span", {
+			"data-slot": "cascader-item-details",
+			className: "sr-only",
+			children: srDetails
+		}) : null,
+		branch && mode !== "tree" ? /* @__PURE__ */ jsxs("span", {
+			"data-slot": "cascader-item-trailing",
+			"aria-hidden": "true",
+			className: "text-muted-foreground ms-auto flex shrink-0 items-center gap-1 text-xs tabular-nums",
+			children: [showCount ? /* @__PURE__ */ jsx("span", {
+				"data-slot": "cascader-item-count",
+				...showsSelectedCount ? { "data-selected-count": "" } : null,
+				className: cn(showsSelectedCount && "text-primary!"),
+				children: trailingCount
+			}) : null, /* @__PURE__ */ jsx("span", {
+				"data-slot": "cascader-item-chevron",
+				"data-state": childrenError ? "error" : childrenLoading ? "loading" : "idle",
+				onClick: selectable ? handleChevronClick : void 0,
+				onMouseUp: selectable ? handleChevronMouseUp : void 0,
+				onMouseDown: as === "button" ? handleButtonMouseDown : void 0,
+				className: cn("-me-0.5", AFFORDANCE_BOX_CLASS, selectable && AFFORDANCE_HOVER_CLASS, childrenError && "text-destructive", childrenLoading && "pointer-events-none"),
+				children: childrenLoading ? /* @__PURE__ */ jsx(Spinner, {
+					"aria-hidden": "true",
+					className: "size-4"
+				}) : childrenError ? /* @__PURE__ */ jsx(RotateCwIcon, { className: "size-4" }) : /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 rtl:-scale-x-100" })
+			})]
+		}) : null,
+		branch && mode === "tree" && showCount ? /* @__PURE__ */ jsx("span", {
+			"data-slot": "cascader-item-count",
+			...showsSelectedCount ? { "data-selected-count": "" } : null,
+			"aria-hidden": "true",
+			className: cn("text-muted-foreground ms-auto shrink-0 text-xs tabular-nums", showsSelectedCount && "text-primary!"),
+			children: trailingCount
+		}) : null,
+		selectable && !leadingCheckbox && showsIndicator ? as === "button" ? (multiple || selected) && /* @__PURE__ */ jsx("span", {
+			"data-slot": "cascader-item-indicator",
+			className: INDICATOR_CLASS,
+			children: indicator
+		}) : /* @__PURE__ */ jsx(Combobox.ItemIndicator, {
+			keepMounted: multiple || indeterminate,
+			render: /* @__PURE__ */ jsx("span", {
+				"data-slot": "cascader-item-indicator",
+				className: INDICATOR_CLASS
+			}),
+			children: indicator
+		}) : null
+	] });
+	const rowStyle = mode === "tree" && nodeDepth > 0 ? {
+		...style,
+		"--cascader-indent": `${nodeDepth * indent}px`
+	} : style;
+	const shared = {
+		"data-slot": "cascader-item",
+		"data-branch": branch || void 0,
+		"data-selected": selected || void 0,
+		"data-indeterminate": indeterminate || void 0,
+		"data-depth": nodeDepth,
+		"data-expanded": expanded || void 0,
+		style: rowStyle,
+		className: cn(ROW_CLASS, leadingCheckbox || !showsIndicator || branch && !branchesSelectable ? ROW_FLUSH_CLASS : ROW_GUTTER_CLASS, mode === "tree" && "ps-[calc(var(--cascader-row-inset,8px)_+_var(--cascader-indent,0px))]!", className)
+	};
+	if (as === "button") {
+		const buttonProps = { ...props };
+		delete buttonProps["aria-setsize"];
+		delete buttonProps["aria-posinset"];
+		delete buttonProps["aria-level"];
+		return /* @__PURE__ */ jsx("button", {
+			type: "button",
+			...shared,
+			tabIndex: -1,
+			disabled,
+			"aria-disabled": disabled || void 0,
+			onClick: handleButtonClick,
+			onMouseDown: handleButtonMouseDown,
+			...buttonProps,
+			children: body
+		});
+	}
+	return /* @__PURE__ */ jsx(Combobox.Item, {
+		...shared,
+		value: node,
+		...virtualized && index != null ? { index } : null,
+		disabled,
+		...mode === "tree" ? {
+			role: "treeitem",
+			"aria-level": nodeDepth + 1,
+			...branch ? { "aria-expanded": !!expanded } : null
+		} : branch ? { "aria-haspopup": "listbox" } : null,
+		...indeterminate ? { "aria-checked": "mixed" } : null,
+		...hoverNavigates ? {
+			onPointerEnter: handleHoverPointerEnter,
+			onPointerLeave: cancelHoverNavigate
+		} : null,
+		onClick: handleClick,
+		onMouseUp: handleMouseUp,
+		...props,
+		children: body
+	});
+});
+/** Ancestor chain under a deep or global hit: "Name" alone is ambiguous. */
+function CascaderItemPath({ node }) {
+	const { index, labels } = useCascaderActions();
+	const ancestors = getCascaderPath(index, node.value).slice(0, -1);
+	if (!ancestors.length) return null;
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "cascader-item-path",
+		className: "text-muted-foreground flex w-full items-center gap-0.5 truncate text-start text-xs",
+		children: ancestors.map((ancestor, i) => /* @__PURE__ */ jsxs(React$1.Fragment, { children: [i > 0 ? /* @__PURE__ */ jsx("span", {
+			"aria-hidden": "true",
+			children: labels.pathSeparator
+		}) : null, /* @__PURE__ */ jsx("span", {
+			className: "truncate",
+			children: ancestor.label
+		})] }, ancestor.value))
+	});
+}
+/** Every load-derived prop a row needs. A PAGING row reports the level it
+*  belongs to, a BRANCH row the level it OWNS; mutually exclusive, so one call
+*  answers both. Exported because a memoised row cannot read them itself. */
+function getCascaderMoreProps(node, loadStates) {
+	const parent = getCascaderMoreParent(node);
+	if (parent == null) {
+		const own = loadStates.get(node.value);
+		return {
+			loading: false,
+			error: false,
+			childrenLoading: !!own?.loading,
+			childrenError: !!own?.error
+		};
+	}
+	const state = loadStates.get(parent);
+	return {
+		loading: !!state?.loading,
+		error: !!state?.error,
+		childrenLoading: false,
+		childrenError: false
+	};
+}
+/** Whatever the active view is: the current level, the deepest column, or the
+*  flattened tree rows. Lives here so `cascader.tsx` never imports a row
+*  component, which would cycle with the context. `index` is deliberately not
+*  passed; see `CascaderItemProps`. */
+function CascaderItems({ children }) {
+	const { mode, isBranch, isSelectable, isSelected, isIndeterminate } = useCascaderActions();
+	const { renderedItems, deepResults, treeRows, loadStates } = useCascaderState();
+	const showPath = deepResults !== null;
+	if (mode === "tree") return /* @__PURE__ */ jsx(Fragment, { children: treeRows.map((row, i) => children ? /* @__PURE__ */ jsx(React$1.Fragment, { children: children(row.node, i) }, row.node.value) : /* @__PURE__ */ jsx(CascaderItem, {
+		node: row.node,
+		depth: row.depth,
+		expanded: row.expanded,
+		branch: row.branch,
+		selectable: isSelectable(row.node),
+		selected: isSelected(row.node),
+		indeterminate: isIndeterminate(row.node),
+		...getCascaderMoreProps(row.node, loadStates),
+		"aria-setsize": row.setSize,
+		"aria-posinset": row.posInSet
+	}, row.node.value)) });
+	return /* @__PURE__ */ jsx(Fragment, { children: renderedItems.map((node, i) => children ? /* @__PURE__ */ jsx(React$1.Fragment, { children: children(node, i) }, node.value) : /* @__PURE__ */ jsx(CascaderItem, {
+		node,
+		showPath,
+		branch: isBranch(node),
+		selectable: isSelectable(node),
+		selected: isSelected(node),
+		indeterminate: isIndeterminate(node),
+		...getCascaderMoreProps(node, loadStates),
+		"aria-setsize": renderedItems.length,
+		"aria-posinset": i + 1
+	}, node.value)) });
+}
+const CascaderGroupContext = React$1.createContext(false);
+const CASCADER_LABEL_CLASS = `text-muted-foreground text-xs py-1.5 ${CASCADER_ACTION_INSET_CLASS} block truncate`;
+const CASCADER_SEPARATOR_CLASS = "h-px bg-border my-1 mx-[calc(var(--cascader-list-pad,4px)*-1)]! shrink-0";
+/** A run of related rows, named by the `CascaderLabel` inside it: the group is
+*  `role="group"` and Base UI points its `aria-labelledby` at the label, where a
+*  heading alone inside a listbox is dropped from the accessibility tree.
+*  Grouping is composition, not data: `CascaderItems` renders one flat run per
+*  level, so its indices line up with `listRef`. */
+function CascaderGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(CascaderGroupContext.Provider, {
+		value: true,
+		children: /* @__PURE__ */ jsx(Combobox.Group, {
+			"data-slot": "cascader-group",
+			className: cn("flex flex-col", className),
+			...props
+		})
+	});
+}
+/** Inside a group: the real thing, with the id association Base UI wires up. */
+function CascaderGroupLabel({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Combobox.GroupLabel, {
+		"data-slot": "cascader-label",
+		className: cn(CASCADER_LABEL_CLASS, className),
+		...props
+	});
+}
+function CascaderPlainLabel({ className, ...props }) {
+	const defaultProps = {
+		"data-slot": "cascader-label",
+		className: cn(CASCADER_LABEL_CLASS, className)
+	};
+	return useRender({
+		defaultTagName: "div",
+		render: props.render,
+		props: mergeProps(defaultProps, props)
+	});
+}
+/** A heading. Inside `CascaderGroup` it is the group's accessible name; outside
+*  one (the footer flyout is a menu, not a listbox) it is decoration only. */
+function CascaderLabel(props) {
+	return React$1.useContext(CascaderGroupContext) ? /* @__PURE__ */ jsx(CascaderGroupLabel, { ...props }) : /* @__PURE__ */ jsx(CascaderPlainLabel, { ...props });
+}
+/** Decorative on purpose: Base UI's separator is `role="separator"`, which a
+*  `listbox` may not own, and a run that needs separating for a screen reader
+*  needs a `CascaderGroup`, not a line. A consumer can pass the role back. */
+function CascaderSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Combobox.Separator, {
+		"data-slot": "cascader-separator",
+		role: "presentation",
+		"aria-hidden": "true",
+		className: cn(CASCADER_SEPARATOR_CLASS, className),
+		...props
+	});
+}
+export { CASCADER_ACTION_CLASS, CascaderGroup, CascaderItem, CascaderItems, CascaderLabel, CascaderSeparator, getCascaderMoreProps };

package/dist/vendor/reui.io/cascader/cascader-lib.d.mts

@@ -0,0 +1,3 @@
+import "./cascader-types.mjs";
+/** How `getCascaderCheckedValues` condenses a full-closure selection. */
+export type CascaderCheckedStrategy = "all" | "parent" | "child";