themelia-react-ui 0.0.0-stage → 1.0.0

package/dist/base/carousel.js

@@ -0,0 +1,251 @@
+"use client";
+import { useStrings as e } from "../lib/strings.js";
+import { t } from "../utils-C2EKeIw3.js";
+import { n } from "../buttons-Co6GavvM.js";
+import { a as r } from "../typography-Cv8MT-82.js";
+import { r as i } from "../icon-size-B6PVwjbC.js";
+import { createContext as a, forwardRef as o, useCallback as s, useContext as c, useEffect as l, useState as u } from "react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { ChevronLeft as m, ChevronRight as h } from "lucide-react";
+import g from "embla-carousel-react";
+//#region src/components/base/carousel/carousel.strings.ts
+var _ = {
+	previousSlide: "Previous slide",
+	nextSlide: "Next slide",
+	goToSlide: "Go to slide {index} of {total}"
+}, v = a(null);
+function y() {
+	let e = c(v);
+	if (!e) throw Error("useCarousel must be used within a <Carousel />");
+	return e;
+}
+var b = o(function({ orientation: n = "horizontal", controlPlacement: r = "outside", opts: i, setApi: a, plugins: o, className: c, children: d, strings: p, ...m }, h) {
+	let y = e(_, p), [b, x] = g({
+		...i,
+		axis: n === "horizontal" ? "x" : "y"
+	}, o), [S, C] = u(!1), [w, T] = u(!1), [E, D] = u(0), [O, k] = u([]), A = s((e) => {
+		C(e.canScrollPrev()), T(e.canScrollNext()), D(e.selectedScrollSnap()), k(e.scrollSnapList());
+	}, []), j = s(() => {
+		x?.scrollPrev();
+	}, [x]), M = s(() => {
+		x?.scrollNext();
+	}, [x]), N = s((e) => {
+		x?.scrollTo(e);
+	}, [x]), P = s((e) => {
+		let t = n === "vertical" ? e.key === "ArrowUp" : e.key === "ArrowLeft", r = n === "vertical" ? e.key === "ArrowDown" : e.key === "ArrowRight";
+		t ? (e.preventDefault(), j()) : r && (e.preventDefault(), M());
+	}, [
+		n,
+		M,
+		j
+	]);
+	return l(() => {
+		x && a?.(x);
+	}, [x, a]), l(() => {
+		if (x) return A(x), x.on("reInit", A), x.on("select", A), () => {
+			x.off("reInit", A), x.off("select", A);
+		};
+	}, [x, A]), /* @__PURE__ */ f(v.Provider, {
+		value: {
+			carouselRef: b,
+			api: x,
+			opts: i,
+			orientation: n,
+			controlPlacement: r,
+			scrollPrev: j,
+			scrollNext: M,
+			scrollTo: N,
+			canScrollPrev: S,
+			canScrollNext: w,
+			selectedIndex: E,
+			scrollSnaps: O,
+			strings: y
+		},
+		children: /* @__PURE__ */ f("div", {
+			ref: h,
+			onKeyDownCapture: P,
+			role: "region",
+			"aria-roledescription": "carousel",
+			"data-slot": "carousel",
+			"data-orientation": n,
+			"data-control-placement": r,
+			className: t("carousel--component relative", c),
+			...m,
+			children: d
+		})
+	});
+});
+b.displayName = "Carousel";
+var x = o(function({ className: e, ...n }, r) {
+	let { carouselRef: i, orientation: a } = y();
+	return /* @__PURE__ */ f("div", {
+		ref: i,
+		className: "carousel--viewport overflow-hidden",
+		"data-slot": "carousel-viewport",
+		children: /* @__PURE__ */ f("div", {
+			ref: r,
+			"data-slot": "carousel-content",
+			className: t("carousel--content flex", a === "horizontal" ? "-ml-space-xl" : "-mt-space-xl flex-col", e),
+			...n
+		})
+	});
+});
+x.displayName = "CarouselContent";
+var S = o(function({ className: e, ...n }, r) {
+	let { orientation: i } = y();
+	return /* @__PURE__ */ f("div", {
+		ref: r,
+		role: "group",
+		"aria-roledescription": "slide",
+		"data-slot": "carousel-item",
+		className: t("carousel--item min-w-0 shrink-0 grow-0 basis-full", i === "horizontal" ? "pl-space-xl" : "pt-space-xl", e),
+		...n
+	});
+});
+S.displayName = "CarouselItem";
+function C(e, t, n) {
+	return n === "inline" ? "relative translate-x-0 translate-y-0 rotate-0 active:not-aria-[haspopup]:translate-y-0" : t === "vertical" ? e === "previous" ? n === "outside" ? "absolute -top-11 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0" : "absolute top-2 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0" : n === "outside" ? "absolute -bottom-11 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0" : "absolute bottom-2 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0" : e === "previous" ? n === "outside" ? "absolute top-1/2 -left-11 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2" : "absolute top-1/2 left-2 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2" : n === "outside" ? "absolute top-1/2 -right-11 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2" : "absolute top-1/2 right-2 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2";
+}
+var w = {
+	outside: "",
+	inside: "z-10",
+	overlay: "z-10 border-background/70 bg-background/85 shadow-md backdrop-blur hover:bg-background",
+	inline: ""
+}, T = {
+	start: "justify-start",
+	center: "justify-center",
+	end: "justify-end",
+	between: "justify-between"
+}, E = {
+	dot: "size-2.5 rounded-full border border-border bg-muted hover:bg-muted-foreground/40",
+	pill: "h-2 w-2 rounded-radius-sm border border-transparent bg-muted-foreground/25 hover:bg-muted-foreground/40"
+}, D = {
+	dot: "border-foreground bg-foreground hover:bg-foreground",
+	pill: "w-5 rounded-full border-transparent bg-foreground hover:bg-foreground"
+}, O = o(function({ className: e, tone: a = "secondary", buttonStyle: o = "outline", size: s = "sm", iconOnly: c = !0, placement: l, onClick: u, disabled: h, children: g, ..._ }, v) {
+	let { orientation: b, controlPlacement: x, scrollPrev: S, canScrollPrev: T, strings: E } = y(), D = l ?? x;
+	return /* @__PURE__ */ f(n, {
+		ref: v,
+		..._,
+		type: "button",
+		"data-slot": "carousel-previous",
+		"data-placement": D,
+		tone: a,
+		buttonStyle: o,
+		size: s,
+		iconOnly: c,
+		className: t("carousel--previous touch-manipulation", C("previous", b, D), w[D], e),
+		disabled: h || !T,
+		onClick: (e) => {
+			u?.(e), e.defaultPrevented || S();
+		},
+		children: g ?? /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(m, {
+			className: i.sm,
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ f(r, {
+			tag: "span",
+			size: "inherit",
+			className: "sr-only",
+			children: E.previousSlide
+		})] })
+	});
+});
+O.displayName = "CarouselPrevious";
+var k = o(function({ className: e, tone: a = "secondary", buttonStyle: o = "outline", size: s = "sm", iconOnly: c = !0, placement: l, onClick: u, disabled: m, children: g, ..._ }, v) {
+	let { orientation: b, controlPlacement: x, scrollNext: S, canScrollNext: T, strings: E } = y(), D = l ?? x;
+	return /* @__PURE__ */ f(n, {
+		ref: v,
+		..._,
+		type: "button",
+		"data-slot": "carousel-next",
+		"data-placement": D,
+		tone: a,
+		buttonStyle: o,
+		size: s,
+		iconOnly: c,
+		className: t("carousel--next touch-manipulation", C("next", b, D), w[D], e),
+		disabled: m || !T,
+		onClick: (e) => {
+			u?.(e), e.defaultPrevented || S();
+		},
+		children: g ?? /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(h, {
+			className: i.sm,
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ f(r, {
+			tag: "span",
+			size: "inherit",
+			className: "sr-only",
+			children: E.nextSlide
+		})] })
+	});
+});
+k.displayName = "CarouselNext";
+var A = o(function({ align: e = "center", showDots: n = !0, previousProps: r, nextProps: i, dotsProps: a, className: o, children: s, ...c }, l) {
+	return /* @__PURE__ */ f("div", {
+		ref: l,
+		"data-slot": "carousel-navigation",
+		"data-align": e,
+		className: t("carousel--navigation flex flex-wrap items-center gap-space-md", T[e], o),
+		...c,
+		children: s ?? /* @__PURE__ */ p(d, { children: [
+			/* @__PURE__ */ f(O, {
+				placement: "inline",
+				...r
+			}),
+			n && /* @__PURE__ */ f(j, { ...a }),
+			/* @__PURE__ */ f(k, {
+				placement: "inline",
+				...i
+			})
+		] })
+	});
+});
+A.displayName = "CarouselNavigation";
+var j = o(function({ className: e, dotClassName: n, paginationStyle: r = "dot", ...i }, a) {
+	let { scrollSnaps: o } = y();
+	return o.length <= 1 ? null : /* @__PURE__ */ f("div", {
+		ref: a,
+		"data-slot": "carousel-dots",
+		"data-pagination-style": r,
+		className: t("carousel--dots flex flex-wrap items-center justify-center gap-space-sm", e),
+		...i,
+		children: o.map((e, t) => /* @__PURE__ */ f(M, {
+			index: t,
+			paginationStyle: r,
+			className: n
+		}, t))
+	});
+});
+j.displayName = "CarouselDots";
+var M = o(function({ index: e, paginationStyle: i = "dot", className: a, tone: o = "secondary", buttonStyle: s = "ghost", size: c = "sm", iconOnly: l = !0, onClick: u, children: d, ...p }, m) {
+	let { selectedIndex: h, scrollSnaps: g, scrollTo: _, strings: v } = y(), b = h === e, x = v.goToSlide.replace("{index}", String(e + 1)).replace("{total}", String(g.length));
+	return /* @__PURE__ */ f(n, {
+		ref: m,
+		...p,
+		type: "button",
+		"data-slot": "carousel-dot",
+		"data-selected": b ? "" : void 0,
+		"data-pagination-style": i,
+		"aria-label": x,
+		"aria-current": b ? "true" : void 0,
+		tone: o,
+		buttonStyle: s,
+		size: c,
+		iconOnly: l,
+		className: t("carousel--dot min-w-0 shrink-0 p-0 transition-[width,background-color,border-color] duration-200 active:not-aria-[haspopup]:translate-y-0", E[i], b && D[i], a),
+		onClick: (t) => {
+			u?.(t), t.defaultPrevented || _(e);
+		},
+		children: d ?? /* @__PURE__ */ f(r, {
+			tag: "span",
+			size: "inherit",
+			className: "sr-only",
+			children: x
+		})
+	});
+});
+M.displayName = "CarouselDot";
+//#endregion
+export { b as Carousel, x as CarouselContent, M as CarouselDot, j as CarouselDots, S as CarouselItem, A as CarouselNavigation, k as CarouselNext, O as CarouselPrevious, _ as defaultCarouselStrings, y as useCarousel };
+
+//# sourceMappingURL=carousel.js.map

package/dist/base/carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.js","names":["_Fragment","Text","ICON_SIZE_CLASSNAMES","Fragment$1","useEmblaCarousel","defaultCarouselStrings","CarouselContext","createContext","useCarousel","context","useContext","Carousel","forwardRef","stringsProp","props","strings","useStrings","carouselRef","api","opts","orientation","plugins","canScrollPrev","setCanScrollPrev","useState","canScrollNext","setCanScrollNext","selectedIndex","setSelectedIndex","scrollSnaps","setScrollSnaps","onSelect","useCallback","currentApi","scrollPrev","scrollNext","scrollTo","index","handleKeyDown","isPrevKey","event","isNextKey","useEffect","setApi","controlPlacement","cn","className","CarouselContent","CarouselItem","getCarouselControlPlacementClass","placement","direction","carouselControlPlacementTone","carouselNavigationAlignClass","carouselDotClassName","carouselDotSelectedClassName","CarouselPrevious","resolvedPlacement","Button","disabled","onClick","children","ChevronLeft","CarouselNext","ChevronRight","CarouselNavigation","align","previousProps","showDots","CarouselDots","dotsProps","nextProps","paginationStyle","CarouselDot","dotClassName","selected","label"],"sources":["../../src/components/base/carousel/carousel.strings.ts","../../src/components/base/carousel/carousel.tsx"],"sourcesContent":["export interface CarouselStrings {\n\tpreviousSlide: string;\n\tnextSlide: string;\n\tgoToSlide: string;\n}\n\nexport const defaultCarouselStrings: CarouselStrings = {\n\tpreviousSlide: 'Previous slide',\n\tnextSlide: 'Next slide',\n\tgoToSlide: 'Go to slide {index} of {total}',\n};\n","/**\n * Carousel — Embla-backed base carousel primitive.\n *\n * Package-owned wrapper around `embla-carousel-react` with library Button\n * controls, keyboard navigation, overridable accessible labels, and stable\n * BEM hooks. The optional Embla peer is isolated to `base/carousel`.\n */\nimport {\n\tcreateContext,\n\tforwardRef,\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseState,\n\ttype ComponentPropsWithoutRef,\n\ttype KeyboardEvent,\n\ttype ReactNode,\n} from 'react';\nimport useEmblaCarousel, {\n\ttype UseEmblaCarouselType,\n} from 'embla-carousel-react';\nimport { ChevronLeft, ChevronRight } from 'lucide-react';\n\nimport { Button, type ButtonProps } from '../buttons';\nimport { ICON_SIZE_CLASSNAMES } from '../display/icon-size';\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\n\nimport {\n\tdefaultCarouselStrings,\n\ttype CarouselStrings,\n} from './carousel.strings';\n\nexport type CarouselApi = UseEmblaCarouselType[1];\nexport type CarouselOptions = Parameters<typeof useEmblaCarousel>[0];\nexport type CarouselPlugin = Parameters<typeof useEmblaCarousel>[1];\nexport type CarouselOrientation = 'horizontal' | 'vertical';\nexport type CarouselControlPlacement = 'outside' | 'inside' | 'overlay' | 'inline';\nexport type CarouselNavigationAlign = 'start' | 'center' | 'end' | 'between';\nexport type CarouselPaginationStyle = 'dot' | 'pill';\n\nexport interface CarouselProps extends ComponentPropsWithoutRef<'div'> {\n\t/** Options forwarded to the underlying Embla carousel. */\n\topts?: CarouselOptions;\n\t/** Embla plugins — autoplay, autoscroll, and similar. */\n\tplugins?: CarouselPlugin;\n\t/** Scroll axis. Default: `horizontal`. */\n\torientation?: CarouselOrientation;\n\t/**\n\t * Where the previous/next controls sit relative to the viewport. Default:\n\t * `outside`.\n\t *\n\t * `outside` positions the controls 2.75rem beyond the viewport edge, so the\n\t * caller must reserve a matching intrinsic control gutter or they render\n\t * outside the visible box — `px-11` horizontally, `py-11` vertically:\n\t *\n\t * ```tsx\n\t * <Carousel className=\"w-full max-w-2xl px-11\">\n\t * ```\n\t *\n\t * Use `inside` to overlay the controls on the viewport and skip the gutter\n\t * entirely.\n\t */\n\tcontrolPlacement?: CarouselControlPlacement;\n\t/** Receives the carousel API so the consumer can drive it from outside. */\n\tsetApi?: (api: CarouselApi) => void;\n\t/** Overrides the previous/next accessible names. */\n\tstrings?: StringsProp<CarouselStrings>;\n}\n\ninterface CarouselContextValue {\n\tcarouselRef: ReturnType<typeof useEmblaCarousel>[0];\n\tapi: CarouselApi;\n\t/** Options forwarded to the underlying Embla carousel. */\n\topts?: CarouselOptions;\n\t/** Scroll axis. Default: `horizontal`. */\n\torientation: CarouselOrientation;\n\t/** Where the previous/next controls sit relative to the viewport. Default: `outside`. */\n\tcontrolPlacement: CarouselControlPlacement;\n\tscrollPrev: () => void;\n\tscrollNext: () => void;\n\tscrollTo: (index: number) => void;\n\tcanScrollPrev: boolean;\n\tcanScrollNext: boolean;\n\tselectedIndex: number;\n\tscrollSnaps: number[];\n\t/** Overrides the previous/next accessible names. */\n\tstrings: CarouselStrings;\n}\n\nconst CarouselContext = createContext<CarouselContextValue | null>(null);\n\nfunction useCarousel(): CarouselContextValue {\n\tconst context = useContext(CarouselContext);\n\n\tif (!context) {\n\t\tthrow new Error('useCarousel must be used within a <Carousel />');\n\t}\n\n\treturn context;\n}\n\nconst Carousel = forwardRef<HTMLDivElement, CarouselProps>(function Carousel(\n\t{\n\t\torientation = 'horizontal',\n\t\tcontrolPlacement = 'outside',\n\t\topts,\n\t\tsetApi,\n\t\tplugins,\n\t\tclassName,\n\t\tchildren,\n\t\tstrings: stringsProp,\n\t\t...props\n\t},\n\tref,\n) {\n\tconst strings = useStrings(defaultCarouselStrings, stringsProp);\n\tconst [carouselRef, api] = useEmblaCarousel(\n\t\t{\n\t\t\t...opts,\n\t\t\taxis: orientation === 'horizontal' ? 'x' : 'y',\n\t\t},\n\t\tplugins,\n\t);\n\tconst [canScrollPrev, setCanScrollPrev] = useState(false);\n\tconst [canScrollNext, setCanScrollNext] = useState(false);\n\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\tconst [scrollSnaps, setScrollSnaps] = useState<number[]>([]);\n\n\tconst onSelect = useCallback((currentApi: NonNullable<CarouselApi>) => {\n\t\tsetCanScrollPrev(currentApi.canScrollPrev());\n\t\tsetCanScrollNext(currentApi.canScrollNext());\n\t\tsetSelectedIndex(currentApi.selectedScrollSnap());\n\t\tsetScrollSnaps(currentApi.scrollSnapList());\n\t}, []);\n\n\tconst scrollPrev = useCallback(() => {\n\t\tapi?.scrollPrev();\n\t}, [api]);\n\n\tconst scrollNext = useCallback(() => {\n\t\tapi?.scrollNext();\n\t}, [api]);\n\n\tconst scrollTo = useCallback((index: number) => {\n\t\tapi?.scrollTo(index);\n\t}, [api]);\n\n\tconst handleKeyDown = useCallback(\n\t\t(event: KeyboardEvent<HTMLDivElement>) => {\n\t\t\tconst isPrevKey =\n\t\t\t\torientation === 'vertical'\n\t\t\t\t\t? event.key === 'ArrowUp'\n\t\t\t\t\t: event.key === 'ArrowLeft';\n\t\t\tconst isNextKey =\n\t\t\t\torientation === 'vertical'\n\t\t\t\t\t? event.key === 'ArrowDown'\n\t\t\t\t\t: event.key === 'ArrowRight';\n\n\t\t\tif (isPrevKey) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tscrollPrev();\n\t\t\t} else if (isNextKey) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tscrollNext();\n\t\t\t}\n\t\t},\n\t\t[orientation, scrollNext, scrollPrev],\n\t);\n\n\tuseEffect(() => {\n\t\tif (!api) return;\n\t\tsetApi?.(api);\n\t}, [api, setApi]);\n\n\tuseEffect(() => {\n\t\tif (!api) return;\n\n\t\tonSelect(api);\n\t\tapi.on('reInit', onSelect);\n\t\tapi.on('select', onSelect);\n\n\t\treturn () => {\n\t\t\tapi.off('reInit', onSelect);\n\t\t\tapi.off('select', onSelect);\n\t\t};\n\t}, [api, onSelect]);\n\n\treturn (\n\t\t<CarouselContext.Provider\n\t\t\tvalue={{\n\t\t\t\tcarouselRef,\n\t\t\t\tapi,\n\t\t\t\topts,\n\t\t\t\torientation,\n\t\t\t\tcontrolPlacement,\n\t\t\t\tscrollPrev,\n\t\t\t\tscrollNext,\n\t\t\t\tscrollTo,\n\t\t\t\tcanScrollPrev,\n\t\t\t\tcanScrollNext,\n\t\t\t\tselectedIndex,\n\t\t\t\tscrollSnaps,\n\t\t\t\tstrings,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tonKeyDownCapture={handleKeyDown}\n\t\t\t\trole=\"region\"\n\t\t\t\taria-roledescription=\"carousel\"\n\t\t\t\tdata-slot=\"carousel\"\n\t\t\t\tdata-orientation={orientation}\n\t\t\t\tdata-control-placement={controlPlacement}\n\t\t\t\tclassName={cn('carousel--component relative', className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</CarouselContext.Provider>\n\t);\n});\nCarousel.displayName = 'Carousel';\n\nconst CarouselContent = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n\tfunction CarouselContent({ className, ...props }, ref) {\n\t\tconst { carouselRef, orientation } = useCarousel();\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={carouselRef}\n\t\t\t\tclassName=\"carousel--viewport overflow-hidden\"\n\t\t\t\tdata-slot=\"carousel-viewport\"\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tref={ref}\n\t\t\t\t\tdata-slot=\"carousel-content\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t'carousel--content flex',\n\t\t\t\t\t\torientation === 'horizontal' ? '-ml-space-xl' : '-mt-space-xl flex-col',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t},\n);\nCarouselContent.displayName = 'CarouselContent';\n\nconst CarouselItem = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n\tfunction CarouselItem({ className, ...props }, ref) {\n\t\tconst { orientation } = useCarousel();\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\trole=\"group\"\n\t\t\t\taria-roledescription=\"slide\"\n\t\t\t\tdata-slot=\"carousel-item\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'carousel--item min-w-0 shrink-0 grow-0 basis-full',\n\t\t\t\t\torientation === 'horizontal' ? 'pl-space-xl' : 'pt-space-xl',\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nCarouselItem.displayName = 'CarouselItem';\n\nfunction getCarouselControlPlacementClass(\n\tdirection: 'previous' | 'next',\n\torientation: CarouselOrientation,\n\tplacement: CarouselControlPlacement,\n) {\n\tif (placement === 'inline') {\n\t\treturn 'relative translate-x-0 translate-y-0 rotate-0 active:not-aria-[haspopup]:translate-y-0';\n\t}\n\n\tif (orientation === 'vertical') {\n\t\tif (direction === 'previous') {\n\t\t\treturn placement === 'outside'\n\t\t\t\t? 'absolute -top-11 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0'\n\t\t\t\t: 'absolute top-2 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0';\n\t\t}\n\n\t\treturn placement === 'outside'\n\t\t\t? 'absolute -bottom-11 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0'\n\t\t\t: 'absolute bottom-2 left-1/2 -translate-x-1/2 rotate-90 active:not-aria-[haspopup]:translate-y-0';\n\t}\n\n\tif (direction === 'previous') {\n\t\treturn placement === 'outside'\n\t\t\t? 'absolute top-1/2 -left-11 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2'\n\t\t\t: 'absolute top-1/2 left-2 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2';\n\t}\n\n\treturn placement === 'outside'\n\t\t? 'absolute top-1/2 -right-11 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2'\n\t\t: 'absolute top-1/2 right-2 -translate-y-1/2 active:not-aria-[haspopup]:-translate-y-1/2';\n}\n\nconst carouselControlPlacementTone: Record<CarouselControlPlacement, string> = {\n\toutside: '',\n\tinside: 'z-10',\n\toverlay: 'z-10 border-background/70 bg-background/85 shadow-md backdrop-blur hover:bg-background',\n\tinline: '',\n};\n\nconst carouselNavigationAlignClass: Record<CarouselNavigationAlign, string> = {\n\tstart: 'justify-start',\n\tcenter: 'justify-center',\n\tend: 'justify-end',\n\tbetween: 'justify-between',\n};\n\nconst carouselDotClassName: Record<CarouselPaginationStyle, string> = {\n\tdot: 'size-2.5 rounded-full border border-border bg-muted hover:bg-muted-foreground/40',\n\tpill: 'h-2 w-2 rounded-radius-sm border border-transparent bg-muted-foreground/25 hover:bg-muted-foreground/40',\n};\n\nconst carouselDotSelectedClassName: Record<CarouselPaginationStyle, string> = {\n\tdot: 'border-foreground bg-foreground hover:bg-foreground',\n\tpill: 'w-5 rounded-full border-transparent bg-foreground hover:bg-foreground',\n};\n\nexport interface CarouselControlProps extends Omit<ButtonProps, 'children' | 'href'> {\n\tchildren?: ReactNode;\n\t/** Where the controls sit relative to the viewport. */\n\tplacement?: CarouselControlPlacement;\n}\n\nconst CarouselPrevious = forwardRef<HTMLButtonElement, CarouselControlProps>(\n\tfunction CarouselPrevious(\n\t\t{\n\t\t\tclassName,\n\t\t\ttone = 'secondary',\n\t\t\tbuttonStyle = 'outline',\n\t\t\tsize = 'sm',\n\t\t\ticonOnly = true,\n\t\t\tplacement,\n\t\t\tonClick,\n\t\t\tdisabled,\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst {\n\t\t\torientation,\n\t\t\tcontrolPlacement,\n\t\t\tscrollPrev,\n\t\t\tcanScrollPrev,\n\t\t\tstrings,\n\t\t} = useCarousel();\n\t\tconst resolvedPlacement = placement ?? controlPlacement;\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t\ttype=\"button\"\n\t\t\t\tdata-slot=\"carousel-previous\"\n\t\t\t\tdata-placement={resolvedPlacement}\n\t\t\t\ttone={tone}\n\t\t\t\tbuttonStyle={buttonStyle}\n\t\t\t\tsize={size}\n\t\t\t\ticonOnly={iconOnly}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'carousel--previous touch-manipulation',\n\t\t\t\t\tgetCarouselControlPlacementClass('previous', orientation, resolvedPlacement),\n\t\t\t\t\tcarouselControlPlacementTone[resolvedPlacement],\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdisabled={disabled || !canScrollPrev}\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t\tif (!event.defaultPrevented) scrollPrev();\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{children ?? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<ChevronLeft className={ICON_SIZE_CLASSNAMES.sm} aria-hidden=\"true\" />\n\t\t\t\t\t\t<Text tag=\"span\" size=\"inherit\" className=\"sr-only\">\n\t\t\t\t\t\t\t{strings.previousSlide}\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</Button>\n\t\t);\n\t},\n);\nCarouselPrevious.displayName = 'CarouselPrevious';\n\nconst CarouselNext = forwardRef<HTMLButtonElement, CarouselControlProps>(\n\tfunction CarouselNext(\n\t\t{\n\t\t\tclassName,\n\t\t\ttone = 'secondary',\n\t\t\tbuttonStyle = 'outline',\n\t\t\tsize = 'sm',\n\t\t\ticonOnly = true,\n\t\t\tplacement,\n\t\t\tonClick,\n\t\t\tdisabled,\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst {\n\t\t\torientation,\n\t\t\tcontrolPlacement,\n\t\t\tscrollNext,\n\t\t\tcanScrollNext,\n\t\t\tstrings,\n\t\t} = useCarousel();\n\t\tconst resolvedPlacement = placement ?? controlPlacement;\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t\ttype=\"button\"\n\t\t\t\tdata-slot=\"carousel-next\"\n\t\t\t\tdata-placement={resolvedPlacement}\n\t\t\t\ttone={tone}\n\t\t\t\tbuttonStyle={buttonStyle}\n\t\t\t\tsize={size}\n\t\t\t\ticonOnly={iconOnly}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'carousel--next touch-manipulation',\n\t\t\t\t\tgetCarouselControlPlacementClass('next', orientation, resolvedPlacement),\n\t\t\t\t\tcarouselControlPlacementTone[resolvedPlacement],\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdisabled={disabled || !canScrollNext}\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t\tif (!event.defaultPrevented) scrollNext();\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{children ?? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<ChevronRight className={ICON_SIZE_CLASSNAMES.sm} aria-hidden=\"true\" />\n\t\t\t\t\t\t<Text tag=\"span\" size=\"inherit\" className=\"sr-only\">\n\t\t\t\t\t\t\t{strings.nextSlide}\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</Button>\n\t\t);\n\t},\n);\nCarouselNext.displayName = 'CarouselNext';\n\nexport interface CarouselNavigationProps extends ComponentPropsWithoutRef<'div'> {\n\t/** Alignment of the dot cluster. */\n\talign?: CarouselNavigationAlign;\n\t/** Renders the pagination dots. */\n\tshowDots?: boolean;\n\t/** Props forwarded to the previous control. */\n\tpreviousProps?: CarouselControlProps;\n\t/** Props forwarded to the next control. */\n\tnextProps?: CarouselControlProps;\n\t/** Props forwarded to the dot cluster. */\n\tdotsProps?: CarouselDotsProps;\n}\n\nconst CarouselNavigation = forwardRef<HTMLDivElement, CarouselNavigationProps>(\n\tfunction CarouselNavigation(\n\t\t{\n\t\t\talign = 'center',\n\t\t\tshowDots = true,\n\t\t\tpreviousProps,\n\t\t\tnextProps,\n\t\t\tdotsProps,\n\t\t\tclassName,\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"carousel-navigation\"\n\t\t\t\tdata-align={align}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'carousel--navigation flex flex-wrap items-center gap-space-md',\n\t\t\t\t\tcarouselNavigationAlignClass[align],\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children ?? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<CarouselPrevious placement=\"inline\" {...previousProps} />\n\t\t\t\t\t\t{showDots && <CarouselDots {...dotsProps} />}\n\t\t\t\t\t\t<CarouselNext placement=\"inline\" {...nextProps} />\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t},\n);\nCarouselNavigation.displayName = 'CarouselNavigation';\n\nexport interface CarouselDotsProps extends ComponentPropsWithoutRef<'div'> {\n\t/** Merged onto each dot. */\n\tdotClassName?: string;\n\t/** Visual treatment of the pagination dots. */\n\tpaginationStyle?: CarouselPaginationStyle;\n}\n\nconst CarouselDots = forwardRef<HTMLDivElement, CarouselDotsProps>(\n\tfunction CarouselDots(\n\t\t{\n\t\t\tclassName,\n\t\t\tdotClassName,\n\t\t\tpaginationStyle = 'dot',\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst { scrollSnaps } = useCarousel();\n\n\t\tif (scrollSnaps.length <= 1) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"carousel-dots\"\n\t\t\t\tdata-pagination-style={paginationStyle}\n\t\t\t\tclassName={cn('carousel--dots flex flex-wrap items-center justify-center gap-space-sm', className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{scrollSnaps.map((_, index) => (\n\t\t\t\t\t<CarouselDot\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\tpaginationStyle={paginationStyle}\n\t\t\t\t\t\tclassName={dotClassName}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t);\n\t},\n);\nCarouselDots.displayName = 'CarouselDots';\n\nexport interface CarouselDotProps\n\textends Omit<ButtonProps, 'children' | 'href'> {\n\tindex: number;\n\tchildren?: ReactNode;\n\t/** Visual treatment of the pagination dots. */\n\tpaginationStyle?: CarouselPaginationStyle;\n}\n\nconst CarouselDot = forwardRef<HTMLButtonElement, CarouselDotProps>(\n\tfunction CarouselDot(\n\t\t{\n\t\t\tindex,\n\t\t\tpaginationStyle = 'dot',\n\t\t\tclassName,\n\t\t\ttone = 'secondary',\n\t\t\tbuttonStyle = 'ghost',\n\t\t\tsize = 'sm',\n\t\t\ticonOnly = true,\n\t\t\tonClick,\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst { selectedIndex, scrollSnaps, scrollTo, strings } = useCarousel();\n\t\tconst selected = selectedIndex === index;\n\t\tconst label = strings.goToSlide\n\t\t\t.replace('{index}', String(index + 1))\n\t\t\t.replace('{total}', String(scrollSnaps.length));\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t\ttype=\"button\"\n\t\t\t\tdata-slot=\"carousel-dot\"\n\t\t\t\tdata-selected={selected ? '' : undefined}\n\t\t\t\tdata-pagination-style={paginationStyle}\n\t\t\t\taria-label={label}\n\t\t\t\taria-current={selected ? 'true' : undefined}\n\t\t\t\ttone={tone}\n\t\t\t\tbuttonStyle={buttonStyle}\n\t\t\t\tsize={size}\n\t\t\t\ticonOnly={iconOnly}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'carousel--dot min-w-0 shrink-0 p-0 transition-[width,background-color,border-color] duration-200 active:not-aria-[haspopup]:translate-y-0',\n\t\t\t\t\tcarouselDotClassName[paginationStyle],\n\t\t\t\t\tselected && carouselDotSelectedClassName[paginationStyle],\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t\tif (!event.defaultPrevented) scrollTo(index);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{children ?? (\n\t\t\t\t\t<Text tag=\"span\" size=\"inherit\" className=\"sr-only\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t</Text>\n\t\t\t\t)}\n\t\t\t</Button>\n\t\t);\n\t},\n);\nCarouselDot.displayName = 'CarouselDot';\n\nexport {\n\tCarousel,\n\tCarouselContent,\n\tCarouselItem,\n\tCarouselPrevious,\n\tCarouselNext,\n\tCarouselNavigation,\n\tCarouselDots,\n\tCarouselDot,\n\tuseCarousel,\n};\n"],"mappings":"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"}

package/dist/base/cascader.js

@@ -0,0 +1,361 @@
+"use client";
+import { s as e } from "../ui-provider-CftIB6TY.js";
+import { t } from "../utils-C2EKeIw3.js";
+import { n } from "../buttons-Co6GavvM.js";
+import { a as r } from "../typography-Cv8MT-82.js";
+import { t as i } from "../structure-BvW4vG4H.js";
+import { n as a } from "../surface-recipes-CQfRr-VL.js";
+import { i as ee } from "../popover.recipes-zgBhMlUu.js";
+import { t as te } from "../collection-content-C4fthJV_.js";
+import { a as ne, o as re, t as ie } from "../command-D0kWBZfd.js";
+import { d as ae, o as oe, p as se } from "../form-sizing-39NohSqn.js";
+import { t as ce } from "../input-DMorJiTI.js";
+import { a as le, c as ue, i as de, n as fe, o as pe, t as me } from "../popover-TInGXsjg.js";
+import { t as he } from "../scroll-area-BheMQ270.js";
+import { n as ge, r as o, t as _e } from "../tree-COD9BGdU.js";
+import { useEffect as s, useMemo as ve, useRef as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { ChevronDown as ye, ChevronLeft as be, ChevronRight as xe } from "lucide-react";
+//#region src/components/base/cascader/cascader.tsx
+var Se = {
+	placeholder: "Choose an option",
+	search: "Search options",
+	empty: "No options",
+	loading: "Loading options…",
+	error: "Options could not be loaded.",
+	retry: "Retry",
+	back: "Back",
+	root: "All options",
+	clear: "Clear selection",
+	selectCurrent: "Select current category",
+	pathSeparator: " / "
+}, Ce = (e) => e == null ? [] : typeof e == "string" ? [e] : e;
+function f(e, t) {
+	return e.map((e) => {
+		let n = t.get(e.value) ?? e.children;
+		return {
+			...e,
+			...n ? { children: f(n, t) } : {},
+			...t.has(e.value) ? { hasChildren: !!n?.length } : {}
+		};
+	});
+}
+function p({ items: p, value: m, defaultValue: we = null, onValueChange: Te, multiple: h = !1, mode: g = "drill", selectable: _ = "leaf", open: Ee, defaultOpen: De = !1, onOpenChange: Oe, disabled: v = !1, invalid: ke = !1, searchable: Ae = !0, clearable: je = !1, density: Me = "default", size: Ne, name: y, id: Pe, className: Fe, strings: Ie, loadChildren: b, renderValue: Le, ...Re }) {
+	let { defaultScale: ze } = e(), Be = se(Ne, ze), x = {
+		...Se,
+		...Ie
+	}, [Ve, He] = l(we), S = Ce(m === void 0 ? Ve : m), [Ue, We] = l(De), C = !v && (Ee ?? Ue), [w, T] = l([]), [E, D] = l(""), [O, k] = l([]), [Ge, A] = l(/* @__PURE__ */ new Map()), [j, Ke] = l(/* @__PURE__ */ new Map()), M = c({
+		items: p,
+		loadChildren: b
+	}), N = M.current.items === p && M.current.loadChildren === b, P = c(j);
+	P.current = j;
+	let [F, I] = l(/* @__PURE__ */ new Map()), L = c(/* @__PURE__ */ new Map()), R = c(!0), z = c(p);
+	z.current = p;
+	let B = c(b);
+	B.current = b;
+	let V = c(null), H = c(null), U = c(null), W = ve(() => f(p, N ? j : /* @__PURE__ */ new Map()), [
+		p,
+		j,
+		N
+	]), G = ve(() => ge(W), [W]), K = S.map((e) => G.get(e)?.path ?? []), q = w.filter((e) => G.has(e)), J = q.length ? G.get(q.at(-1))?.node : void 0, Y = E.trim() ? [...G.values()].filter((e) => !e.disabled && e.path.map((e) => e.label).join(x.pathSeparator).toLocaleLowerCase().includes(E.trim().toLocaleLowerCase())) : null;
+	function qe() {
+		for (let e of L.current.values()) e.abort();
+		L.current.clear(), I((e) => new Map([...e].filter(([, e]) => e.status !== "loading")));
+	}
+	s(() => (R.current = !0, () => {
+		R.current = !1;
+		for (let e of L.current.values()) e.abort();
+		L.current.clear();
+	}), []), s(() => {
+		qe(), M.current = {
+			items: p,
+			loadChildren: b
+		}, P.current = /* @__PURE__ */ new Map(), Ke(P.current), I(/* @__PURE__ */ new Map()), T([]), k([]), A(/* @__PURE__ */ new Map()), H.current = null, U.current = null;
+	}, [p, b]), s(() => {
+		if (!C) qe(), D("");
+		else {
+			let e = K.find((e) => e.length), t = e?.slice(0, -1).map((e) => e.value);
+			t && (T(t), Ye(e.map((e) => e.value)), g === "tree" && k((e) => [.../* @__PURE__ */ new Set([...e, ...t])]));
+			let n = g === "tree" ? [...O, ...t ?? []] : t ?? q;
+			for (let e of n) {
+				let t = G.get(e)?.node;
+				t && Z(t);
+			}
+		}
+	}, [C]), s(() => {
+		if (U.current !== null) {
+			let e = [...V.current?.querySelectorAll("[data-tree-value]") ?? []].find((e) => e.dataset.treeValue === U.current);
+			e && (e.focus(), U.current = null);
+		}
+		if (H.current === null) return;
+		let e = (V.current?.querySelectorAll("[data-cascader-level]")?.[H.current])?.querySelector("[data-cascader-list][tabindex=\"0\"]");
+		e && (e.focus(), H.current = null);
+	}, [
+		w,
+		j,
+		E
+	]);
+	function Je(e) {
+		v || (Ee === void 0 && We(e), Oe?.(e));
+	}
+	function Ye(e) {
+		A((t) => {
+			let n = new Map(t);
+			return e.forEach((t, r) => n.set(r ? e[r - 1] : void 0, t)), n;
+		});
+	}
+	function Xe(e) {
+		return typeof _ == "function" ? _(e) : _ === "any" || !o(e);
+	}
+	function X(e) {
+		if (v || e && (G.get(e.value)?.disabled || !Xe(e))) return;
+		let t = !!e && S.includes(e.value), n = e ? h ? t ? S.filter((t) => t !== e.value) : [...S, e.value] : e.value : h ? [] : null;
+		m === void 0 && He(n), Te?.(n, {
+			node: e,
+			path: e ? G.get(e.value)?.path ?? [e] : [],
+			reason: e ? h && t ? "deselect" : "select" : "clear"
+		}), !h && e && Je(!1);
+	}
+	async function Z(e, t = !1) {
+		if (!b || !e.hasChildren || e.children !== void 0 || N && j.has(e.value) || L.current.has(e.value) || !t && N && F.get(e.value)?.status === "error") return;
+		let n = new AbortController(), r = z.current, i = b;
+		L.current.set(e.value, n), I((t) => new Map(t).set(e.value, { status: "loading" }));
+		try {
+			let t = await i(e, { signal: n.signal });
+			if (!R.current || n.signal.aborted || z.current !== r || B.current !== i || L.current.get(e.value) !== n) return;
+			let a = new Map(P.current).set(e.value, t);
+			ge(f(r, a)), P.current = a, Ke(a), I((t) => {
+				let n = new Map(t);
+				return n.delete(e.value), n;
+			});
+		} catch {
+			R.current && !n.signal.aborted && z.current === r && B.current === i && I((t) => new Map(t).set(e.value, { status: "error" }));
+		} finally {
+			L.current.get(e.value) === n && L.current.delete(e.value);
+		}
+	}
+	function Ze(e, t) {
+		if (!G.get(e.value)?.disabled) {
+			if (o(e)) {
+				let n = G.get(e.value)?.path.map((e) => e.value) ?? [...q.slice(0, t), e.value];
+				Ye(n), D(""), T(n), g === "tree" ? (k((e) => [.../* @__PURE__ */ new Set([...e, ...n])]), U.current = e.value) : H.current = g === "columns" ? n.length : 0, Z(e);
+			} else X(e);
+		}
+	}
+	function Q(e = !0) {
+		if (v || !q.length) return;
+		let t = q.at(-1), n = q.slice(0, -1);
+		L.current.get(t)?.abort(), L.current.delete(t), I((e) => {
+			if (e.get(t)?.status !== "loading") return e;
+			let n = new Map(e);
+			return n.delete(t), n;
+		}), A((e) => new Map(e).set(n.at(-1), t)), D(""), T(n), H.current = e ? g === "columns" ? n.length : 0 : null;
+	}
+	function Qe(e, t) {
+		let n = getComputedStyle(e.currentTarget).direction === "rtl";
+		if (e.key === (n ? "ArrowRight" : "ArrowLeft") && q.length) e.preventDefault(), e.stopPropagation(), g === "columns" && t > 0 ? V.current?.querySelectorAll("[data-cascader-level]")[t - 1]?.querySelector("[data-cascader-list][tabindex=\"0\"]")?.focus() : Q();
+		else if (e.key === (n ? "ArrowLeft" : "ArrowRight")) {
+			let n = e.currentTarget.querySelector("[data-cascader-list]")?.getAttribute("aria-activedescendant"), r = (e.target.closest("[data-node-value]") ?? (n ? document.getElementById(n) : null))?.getAttribute("data-node-value"), i = G.get(r ?? "")?.node;
+			i && o(i) && (e.preventDefault(), e.stopPropagation(), Ze(i, t));
+		}
+	}
+	function $e(e, t) {
+		let a = e ? F.get(e.value)?.status : void 0;
+		return a === "loading" ? /* @__PURE__ */ u(r, {
+			role: "status",
+			type: "secondary",
+			children: x.loading
+		}) : a === "error" ? /* @__PURE__ */ d(i, {
+			gap: "dense",
+			children: [/* @__PURE__ */ u(r, {
+				role: "alert",
+				type: "error",
+				children: x.error
+			}), /* @__PURE__ */ u(n, {
+				buttonStyle: "outline",
+				size: "sm",
+				onClick: () => e && void Z(e, !0),
+				children: x.retry
+			})]
+		}) : t.length ? null : /* @__PURE__ */ u(r, {
+			role: "status",
+			type: "secondary",
+			children: x.empty
+		});
+	}
+	function $(e, n, r) {
+		let i = Ge.get(n?.value), a = e.find((e) => e.value === i && !G.get(e.value)?.disabled)?.value ?? e.find((e) => !G.get(e.value)?.disabled)?.value ?? "";
+		return /* @__PURE__ */ u("div", {
+			"data-cascader-level": r,
+			className: t("cascader--level min-w-0", g === "columns" && !Y && "w-56 shrink-0"),
+			onKeyDownCapture: (e) => Qe(e, r),
+			children: /* @__PURE__ */ u(ie, {
+				shouldFilter: !1,
+				value: a,
+				onValueChange: (e) => A((t) => new Map(t).set(n?.value, e)),
+				"aria-label": n?.label ?? x.root,
+				children: /* @__PURE__ */ d(re, {
+					"data-cascader-list": !0,
+					"aria-multiselectable": h || void 0,
+					"aria-label": n?.label ?? x.root,
+					tabIndex: e.some((e) => !G.get(e.value)?.disabled) ? 0 : -1,
+					children: [$e(n, e), e.map((e) => /* @__PURE__ */ u(ne, {
+						value: e.value,
+						"data-node-value": e.value,
+						density: Me,
+						disabled: v || G.get(e.value)?.disabled,
+						"data-checked": S.includes(e.value),
+						"aria-selected": S.includes(e.value),
+						onSelect: () => Ze(e, r),
+						children: /* @__PURE__ */ u(te, {
+							label: Y ? G.get(e.value)?.path.map((e) => e.label).join(x.pathSeparator) : e.label,
+							description: e.description,
+							leading: e.icon,
+							leadingDecorative: !0,
+							wrap: !0,
+							trailing: o(e) ? /* @__PURE__ */ u(xe, {
+								"aria-hidden": "true",
+								className: "size-icon rtl:rotate-180"
+							}) : void 0
+						})
+					}, e.value))]
+				})
+			})
+		}, JSON.stringify(n ? [n.value] : []));
+	}
+	let et = S.length ? K.map((e, t) => e.length ? e.map((e) => e.label).join(x.pathSeparator) : S[t]).join(", ") : x.placeholder;
+	return /* @__PURE__ */ d("div", {
+		className: t("cascader--component min-w-0", Fe),
+		children: [
+			y && S.map((e) => /* @__PURE__ */ u("input", {
+				type: "hidden",
+				name: y,
+				value: e,
+				disabled: v
+			}, e)),
+			/* @__PURE__ */ d(pe, {
+				open: C,
+				onOpenChange: Je,
+				children: [/* @__PURE__ */ d(ue, {
+					id: Pe,
+					...Re,
+					disabled: v,
+					"aria-invalid": ke || void 0,
+					className: t("cascader--trigger", ae(Be)),
+					children: [/* @__PURE__ */ u("span", {
+						className: t("min-w-0 truncate", !S.length && "text-muted-foreground"),
+						children: Le ? Le(K) : et
+					}), /* @__PURE__ */ u(ye, {
+						"aria-hidden": "true",
+						className: t(oe[Be], "shrink-0")
+					})]
+				}), /* @__PURE__ */ u(me, {
+					type: "menu",
+					inset: "flush",
+					className: t("cascader--popup w-80", g === "columns" && !Y && "w-auto"),
+					children: /* @__PURE__ */ d("div", {
+						ref: V,
+						children: [
+							!!q.length && g !== "tree" && /* @__PURE__ */ d(de, {
+								start: /* @__PURE__ */ u(n, {
+									tone: "secondary",
+									buttonStyle: "ghost",
+									size: "sm",
+									iconOnly: !0,
+									"aria-label": x.back,
+									withTooltip: x.back,
+									onClick: () => Q(),
+									children: /* @__PURE__ */ u(be, {
+										"aria-hidden": "true",
+										className: "size-icon-sm rtl:rotate-180"
+									})
+								}),
+								children: [/* @__PURE__ */ d(i, {
+									direction: "horizontal",
+									gap: "sm",
+									align: "center",
+									justify: "between",
+									wrap: !0,
+									children: [/* @__PURE__ */ u(le, {
+										className: "min-w-0 wrap-anywhere",
+										children: J?.label
+									}), J && Xe(J) && /* @__PURE__ */ u(n, {
+										buttonStyle: "outline",
+										size: "sm",
+										onClick: () => X(J),
+										children: x.selectCurrent
+									})]
+								}), q.length > 1 && /* @__PURE__ */ u(fe, { children: q.slice(0, -1).map((e) => G.get(e)?.node.label).join(x.pathSeparator) })]
+							}),
+							Ae && /* @__PURE__ */ u("div", {
+								className: t("cascader--search", ee.compact, a.anchored.header),
+								children: /* @__PURE__ */ u(ce, {
+									"aria-label": x.search,
+									placeholder: x.search,
+									value: E,
+									onChange: (e) => D(e.target.value),
+									onKeyDown: (e) => {
+										if (e.key === "ArrowDown") {
+											let t = V.current?.querySelector("[data-cascader-list][tabindex=\"0\"], [role=treeitem][tabindex=\"0\"]");
+											t && (e.preventDefault(), t.focus());
+										} else e.key === "Backspace" && !E && q.length && g !== "tree" && (e.preventDefault(), Q(!1));
+									}
+								})
+							}),
+							Y ? $(Y.map((e) => e.node), void 0, 0) : g === "tree" ? /* @__PURE__ */ d(he, {
+								className: "h-72",
+								children: [/* @__PURE__ */ u("div", {
+									className: ee.compact,
+									children: /* @__PURE__ */ u(_e, {
+										items: W,
+										"aria-label": x.root,
+										density: Me,
+										selectionMode: h ? "multiple" : "single",
+										selectedValues: S,
+										expandedValues: O,
+										empty: x.empty,
+										onExpandedValuesChange: (e) => {
+											k(e);
+											for (let t of e) {
+												if (O.includes(t)) continue;
+												let e = G.get(t)?.node;
+												e && Z(e);
+											}
+										},
+										onSelectedValuesChange: (e, t) => X(t)
+									})
+								}), [...F].filter(([e]) => O.includes(e)).map(([e]) => /* @__PURE__ */ d(de, { children: [/* @__PURE__ */ u(r, {
+									size: "xs",
+									type: "secondary",
+									children: G.get(e)?.node.label
+								}), $e(G.get(e)?.node, [])] }, e))]
+							}) : g === "columns" ? /* @__PURE__ */ u(he, {
+								orientation: "both",
+								className: "max-w-full",
+								viewportClassName: "max-h-80",
+								children: /* @__PURE__ */ d("div", {
+									className: "flex items-start",
+									children: [$(W, void 0, 0), q.map((e, t) => {
+										let n = G.get(e)?.node;
+										return n ? $(n.children ?? [], n, t + 1) : null;
+									})]
+								})
+							}) : $(J?.children ?? (J ? [] : W), J, 0)
+						]
+					})
+				})]
+			}),
+			je && !!S.length && /* @__PURE__ */ u(n, {
+				buttonStyle: "ghost",
+				size: "sm",
+				disabled: v,
+				onClick: () => X(null),
+				children: x.clear
+			})
+		]
+	});
+}
+//#endregion
+export { p as Cascader };
+
+//# sourceMappingURL=cascader.js.map