@jfrader/ui 0.5.0 → 0.5.1

package/dist/elastic-slider-BG6K019r.js

@@ -0,0 +1,395 @@
+'use client';
+import { i as e, r as t, t as n } from "./sx-Dx9JUKp5.js";
+import { n as r } from "./focus-ring-BK5W5_NY.js";
+import { n as i, r as a, t as o } from "./media-8yrN85VT.js";
+import { a as ee, c as te, d as ne, f as re, g as ie, h as ae, i as oe, l as se, m as s, n as c, o as ce, p as le, r as l, s as ue, t as u, u as de } from "./use-slider-interaction-ChL-208h.js";
+import { useEffect as d, useRef as f, useState as fe } from "react";
+import { vars as p } from "@jfrader/tokens/vars";
+import { createElement as m } from "@emotion/react";
+import { jsx as h, jsxs as g } from "@emotion/react/jsx-runtime";
+import { MotionConfig as pe, motion as me, useMotionValue as he, useMotionValueEvent as _, useReducedMotion as ge, useSpring as v, useTransform as _e, useVelocity as ve } from "motion/react";
+//#region src/components/elastic-slider/elastic-slider.tsx
+var y = 26, ye = 1.15, be = 7, xe = 10, Se = 6, Ce = .02, we = 10, Te = {
+	stiffness: 380,
+	damping: 26
+}, Ee = {
+	stiffness: 300,
+	damping: 20
+}, De = {
+	type: "spring",
+	stiffness: 420,
+	damping: 28
+}, b = "--elastic-slider-stretch-start", x = "--elastic-slider-stretch-end", S = "--elastic-slider-squash", C = "--elastic-slider-shift", w = "--elastic-slider-tilt", T = e({
+	"0%": { scale: "1" },
+	"45%": { scale: "1.8" },
+	"100%": { scale: "1" }
+}), Oe = t(s, { label: "elastic-slider" }), ke = t({ marginInline: p.space[6] }), Ae = t({
+	position: "absolute",
+	insetInline: 0,
+	insetBlock: 0,
+	marginBlock: "auto",
+	blockSize: p.space[2],
+	borderRadius: p.radius.full,
+	background: p.color.surfaceInset,
+	pointerEvents: "none",
+	[i]: {
+		forcedColorAdjust: "none",
+		background: "Canvas"
+	}
+}), je = t({
+	position: "absolute",
+	insetInlineStart: `calc(-1 * var(${b}, 0px))`,
+	insetInlineEnd: `calc(-1 * var(${x}, 0px))`,
+	insetBlock: 0,
+	marginBlock: "auto",
+	blockSize: p.space[2],
+	boxSizing: "border-box",
+	overflow: "hidden",
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.full,
+	scale: `1 var(${S}, 1)`,
+	pointerEvents: "none",
+	[a]: {
+		insetInline: 0,
+		scale: "none"
+	},
+	[i]: {
+		forcedColorAdjust: "none",
+		borderColor: "CanvasText"
+	}
+}), Me = t({
+	position: "absolute",
+	insetBlock: 0,
+	insetInlineStart: 0,
+	background: p.color.accent,
+	[i]: { background: "Highlight" }
+}), Ne = t({
+	position: "absolute",
+	insetBlock: 0,
+	marginBlock: "auto",
+	marginInlineStart: `calc(${p.space[1]} / -2)`,
+	inlineSize: p.space[1],
+	blockSize: p.space[3],
+	boxSizing: "border-box",
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.full,
+	background: p.color.surfaceRaised,
+	pointerEvents: "none",
+	"&[data-latched]": {
+		blockSize: p.space[4],
+		background: p.color.accent,
+		animation: `${T} ${p.motion.duration.slow} ${p.motion.easeStandard}`
+	},
+	[a]: { "&[data-latched]": { animation: "none" } },
+	[i]: {
+		forcedColorAdjust: "none",
+		background: "Canvas",
+		borderColor: "CanvasText",
+		"&[data-latched]": { background: "Highlight" }
+	}
+}), Pe = t({
+	position: "absolute",
+	insetBlock: 0,
+	marginBlock: "auto",
+	marginInlineStart: `calc(${p.space[8]} / -2)`,
+	inlineSize: p.space[8],
+	blockSize: p.space[8],
+	display: "grid",
+	placeItems: "center",
+	borderRadius: p.radius.full,
+	translate: `var(${C}, 0px)`,
+	cursor: "grab",
+	"&:focus-visible": {
+		...r,
+		zIndex: 2
+	},
+	[a]: { translate: "none" },
+	"&[data-dragging]": {
+		cursor: "grabbing",
+		zIndex: 3
+	},
+	"&[aria-disabled=\"true\"]": { cursor: "default" }
+}), Fe = t({
+	inlineSize: p.space[6],
+	blockSize: p.space[6],
+	boxSizing: "border-box",
+	border: `2px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.full,
+	background: p.color.surfaceRaised,
+	boxShadow: p.shadow.raised,
+	pointerEvents: "none",
+	[i]: {
+		forcedColorAdjust: "none",
+		background: "Canvas",
+		borderColor: "CanvasText",
+		boxShadow: "none"
+	}
+}), Ie = t({
+	position: "absolute",
+	insetBlockEnd: `calc(100% + ${p.space[2]})`,
+	paddingInline: p.space[2],
+	paddingBlock: p.space[1],
+	inlineSize: "max-content",
+	maxInlineSize: "min(24rem, 80vw)",
+	overflowWrap: "anywhere",
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.md,
+	background: p.color.surfaceRaised,
+	color: p.color.text,
+	boxShadow: p.shadow.raised,
+	fontSize: p.textSize.xs,
+	fontVariantNumeric: "tabular-nums",
+	pointerEvents: "none",
+	transformOrigin: "bottom center",
+	rotate: `var(${w}, 0deg)`,
+	opacity: 0,
+	transition: `opacity ${p.motion.duration.fast} ${p.motion.easeStandard}`,
+	"[data-dragging] > &, [data-slider-thumb]:focus-visible > &": { opacity: 1 },
+	[o]: { insetBlockEnd: `calc(100% + ${p.space[4]})` },
+	[a]: { rotate: "none" },
+	[i]: {
+		borderColor: "CanvasText",
+		boxShadow: "none"
+	}
+});
+function Le(e) {
+	return Math.sign(e) * y * (1 - Math.exp(-Math.abs(e) / y));
+}
+function E(e) {
+	let { ref: t, value: r, defaultValue: i, onValueChange: a, onValueCommit: o, label: s, description: p, error: T, invalid: E = !1, disabled: D = !1, min: O = 0, max: k = 100, step: A = 1, largeStep: Re, marks: ze = [], locale: Be, formatOptions: Ve, formatValue: He, showValue: j = !0, start: M, end: N, haptics: Ue = !1, name: P, size: We = "md", slotProps: F, className: Ge, sx: Ke, onKeyDown: qe, "aria-label": Je, "aria-labelledby": Ye, "aria-describedby": Xe, "aria-invalid": Ze, ...Qe } = e, I = ge() ?? !1, L = v(0, Te), R = f(null), z = f(!1), [$e, B] = fe(null), V = (e) => {
+		R.current = e, B(e);
+	}, et = (e) => {
+		if (!Ue || I || e !== "touch") return;
+		let t = H.controlRef.current?.ownerDocument.defaultView?.navigator;
+		if (typeof t?.vibrate == "function") try {
+			t.vibrate(Se);
+		} catch {}
+	}, H = ee({
+		component: "ElasticSlider",
+		range: !1,
+		value: r,
+		defaultValue: i,
+		min: O,
+		max: k,
+		step: A,
+		largeStep: Re,
+		minStepsBetweenThumbs: 0,
+		disabled: D,
+		onValueChange: (e) => a?.(e),
+		onValueCommit: (e) => o?.(e),
+		onPointerSample: ({ raw: e, low: t, high: n, pxPerUnit: r, rtl: i }) => {
+			z.current = i, L.set(I ? 0 : Le((e - Math.max(t, Math.min(n, e))) * r));
+		},
+		resolvePointer: ({ raw: e, pxPerUnit: t, pointerType: n }) => {
+			let r = (n) => Math.abs(e - n) * t, i = R.current;
+			if (i !== null && r(i) > xe && (i = null), i === null) {
+				for (let e of Y) r(e) <= be && (i === null || r(e) < r(i)) && (i = e);
+				i !== null && et(n);
+			}
+			return i !== R.current && V(i), i ?? e;
+		},
+		onGestureEnd: () => {
+			L.set(0), V(null);
+		}
+	}), { id: U, controlRef: W, current: tt, percent: G } = H, K = tt, { format: q } = oe(Be, Ve, He), J = H.normalizeMarks(ze), Y = J.map((e) => e.value).sort((e, t) => e - t), nt = [
+		O,
+		k,
+		A,
+		...Y
+	].join(" ");
+	d(() => {
+		R.current = null, B(null), L.jump(0);
+	}, [nt]);
+	let rt = he(G(K));
+	d(() => rt.set(G(K)), [
+		K,
+		O,
+		k
+	]);
+	let it = v(_e(ve(rt), (e) => {
+		let t = W.current?.matches(":dir(rtl)") ? e : -e;
+		return Math.max(-10, Math.min(we, t * Ce));
+	}), Ee), X = (e, t) => W.current?.style.setProperty(e, t);
+	_(L, "change", (e) => {
+		X(b, `${Math.max(0, -e)}px`), X(x, `${Math.max(0, e)}px`), X(S, String(1 - .4 * Math.min(1, Math.abs(e) / y))), X(C, `${z.current ? -e : e}px`);
+	}), _(it, "change", (e) => X(w, `${I ? 0 : e}deg`));
+	let Z = u(s), at = u(p), Q = u(T), $ = F?.thumb, ot = H.active === 0;
+	return /* @__PURE__ */ h(pe, {
+		reducedMotion: "user",
+		children: /* @__PURE__ */ h(n, {
+			className: Ge,
+			styles: Oe,
+			sx: Ke,
+			children: (e) => /* @__PURE__ */ g("div", {
+				...Qe,
+				ref: t,
+				className: e,
+				"data-ui": "elastic-slider",
+				"data-disabled": D || void 0,
+				onKeyDown: (e) => {
+					qe?.(e), H.handleRootKeyDown(e);
+				},
+				children: [
+					(Z || j) && /* @__PURE__ */ g("div", {
+						css: se,
+						children: [Z && /* @__PURE__ */ h("span", {
+							...F?.label,
+							id: `${U}-label`,
+							css: [de, F?.label?.css],
+							children: s
+						}), j && /* @__PURE__ */ h("span", {
+							...F?.readout,
+							"aria-hidden": "true",
+							"data-ui": "elastic-slider-readout",
+							css: [le, F?.readout?.css],
+							children: q(K)
+						})]
+					}),
+					at && /* @__PURE__ */ h("div", {
+						...F?.description,
+						id: `${U}-description`,
+						css: [ue, F?.description?.css],
+						children: p
+					}),
+					Q && /* @__PURE__ */ h("div", {
+						...F?.error,
+						id: `${U}-error`,
+						role: "alert",
+						css: [te, F?.error?.css],
+						children: T
+					}),
+					/* @__PURE__ */ g("div", {
+						css: ae,
+						children: [
+							u(M) && /* @__PURE__ */ h("div", {
+								...F?.start,
+								children: M
+							}),
+							/* @__PURE__ */ g("div", {
+								...F?.control,
+								...H.controlHandlers(F?.control),
+								css: [
+									ce,
+									ke,
+									ie[We],
+									F?.control?.css
+								],
+								"data-ui": "elastic-slider-control",
+								"data-disabled": D || void 0,
+								children: [
+									/* @__PURE__ */ h("div", {
+										...F?.rail,
+										"data-ui": "elastic-slider-rail",
+										"aria-hidden": "true",
+										css: [Ae, F?.rail?.css]
+									}),
+									/* @__PURE__ */ h("div", {
+										...F?.track,
+										"data-ui": "elastic-slider-track",
+										"aria-hidden": "true",
+										css: [je, F?.track?.css],
+										children: /* @__PURE__ */ h("div", {
+											...F?.fill,
+											"data-ui": "elastic-slider-fill",
+											css: [Me, F?.fill?.css],
+											style: {
+												...F?.fill?.style,
+												inlineSize: `${G(K)}%`
+											}
+										})
+									}),
+									J.map((e, t) => {
+										let n = c(F?.tick, t);
+										return /* @__PURE__ */ m("span", {
+											...n,
+											key: e.value,
+											"data-ui": "elastic-slider-tick",
+											"data-latched": $e === e.value || void 0,
+											"aria-hidden": "true",
+											css: [Ne, n?.css],
+											style: {
+												...n?.style,
+												insetInlineStart: `${G(e.value)}%`
+											}
+										});
+									}),
+									/* @__PURE__ */ g("div", {
+										...$,
+										id: `${U}-thumb`,
+										"data-slider-thumb": 0,
+										"data-dragging": ot || void 0,
+										role: "slider",
+										tabIndex: D ? -1 : 0,
+										"aria-orientation": "horizontal",
+										"aria-disabled": D,
+										"aria-invalid": Q || E ? !0 : $?.["aria-invalid"] ?? Ze,
+										"aria-valuemin": O,
+										"aria-valuemax": k,
+										"aria-valuenow": K,
+										"aria-valuetext": q(K),
+										"aria-label": $?.["aria-label"] ?? Je,
+										"aria-labelledby": l(Ye, $?.["aria-labelledby"], Z && `${U}-label`),
+										"aria-describedby": l(Xe, $?.["aria-describedby"], at && `${U}-description`, Q && `${U}-error`),
+										css: [Pe, $?.css],
+										style: {
+											...$?.style,
+											insetInlineStart: `${G(K)}%`
+										},
+										children: [/* @__PURE__ */ h(me.span, {
+											"aria-hidden": "true",
+											"data-ui": "elastic-slider-thumb-visual",
+											css: Fe,
+											animate: { scale: !I && ot ? ye : 1 },
+											transition: I ? { duration: 0 } : De
+										}), /* @__PURE__ */ h("span", {
+											...F?.bubble,
+											"data-ui": "elastic-slider-bubble",
+											"aria-hidden": "true",
+											css: [Ie, F?.bubble?.css],
+											style: {
+												...F?.bubble?.style,
+												...G(K) <= 50 ? { insetInlineStart: 0 } : { insetInlineEnd: 0 }
+											},
+											children: q(K)
+										})]
+									})
+								]
+							}),
+							u(N) && /* @__PURE__ */ h("div", {
+								...F?.end,
+								children: N
+							})
+						]
+					}),
+					J.some((e) => u(e.label)) && /* @__PURE__ */ h("div", {
+						css: re,
+						children: J.map((e, t) => {
+							if (!u(e.label)) return null;
+							let n = c(F?.mark, t);
+							return /* @__PURE__ */ m("button", {
+								...n,
+								key: e.value,
+								type: "button",
+								disabled: D,
+								"data-ui": "elastic-slider-mark",
+								css: [ne, n?.css],
+								onClick: (t) => {
+									n?.onClick?.(t), t.defaultPrevented || H.selectMark(e.value);
+								}
+							}, e.label);
+						})
+					}),
+					P !== void 0 && /* @__PURE__ */ h("input", {
+						type: "hidden",
+						disabled: D,
+						name: P,
+						value: K
+					})
+				]
+			})
+		})
+	});
+}
+E.displayName = "ElasticSlider";
+//#endregion
+export { E as t };

package/dist/elastic-slider.js

@@ -0,0 +1,2 @@
+'use client';
+export { t as ElasticSlider } from "./elastic-slider-BG6K019r.js";

package/dist/{expandable-card-C-qJcZ14.js → expandable-card-rUATve0o.js}

@@ -85,7 +85,14 @@ var O = {
 		padding: _.space[3]
 	},
 	[a]: { "&::after": { transitionDuration: "0s" } },
-	[i]: { "&:focus-visible": { outlineColor: "Highlight" } }
+	[i]: {
+		"&:focus-visible": { outlineColor: "Highlight" },
+		"&::after": {
+			forcedColorAdjust: "none",
+			borderInlineStartColor: "ButtonText"
+		},
+		"&:disabled::after": { borderInlineStartColor: "GrayText" }
+	}
 }), P = e({
 	fontSize: _.textSize.md,
 	fontWeight: _.fontWeight.medium

package/dist/expandable-card.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as ExpandableCard } from "./expandable-card-C-qJcZ14.js";
+export { t as ExpandableCard } from "./expandable-card-rUATve0o.js";

package/dist/expanding-search-BxOwtdwt.js

@@ -0,0 +1,238 @@
+'use client';
+import { r as e, t } from "./sx-Dx9JUKp5.js";
+import { n } from "./media-8yrN85VT.js";
+import { t as r } from "./use-controlled-state-DpeVQZNR.js";
+import { t as i } from "./renderable-DzcIj1Lo.js";
+import { t as a } from "./button-NLY0h6EJ.js";
+import { t as o } from "./search-field-DMvho0KQ.js";
+import { useId as ee, useLayoutEffect as s, useRef as c, useState as te } from "react";
+import { vars as l } from "@jfrader/tokens/vars";
+import { jsx as u, jsxs as d } from "@emotion/react/jsx-runtime";
+import { useMergeRefs as f } from "@floating-ui/react";
+import { animate as p, useMotionValue as m } from "motion/react";
+import { base as h } from "@jfrader/tokens";
+//#region src/components/expanding-search/expanding-search.tsx
+var g = {
+	type: "spring",
+	visualDuration: Number.parseFloat(h.motion.duration.slow) / 1e3,
+	bounce: 0
+}, ne = "(prefers-reduced-motion: reduce)", re = e({
+	position: "relative",
+	inlineSize: "100%",
+	minInlineSize: 0,
+	minBlockSize: "var(--expanding-search-size)",
+	pointerEvents: "none"
+}), ie = {
+	sm: e({ "--expanding-search-size": l.space[8] }),
+	md: e({ "--expanding-search-size": l.space[10] }),
+	lg: e({ "--expanding-search-size": l.space[12] })
+}, _ = e({
+	position: "relative",
+	marginInlineStart: "auto",
+	inlineSize: "var(--expanding-search-size)",
+	"--expanding-search-radius": l.radius.full,
+	minInlineSize: 0,
+	maxInlineSize: "100%",
+	pointerEvents: "auto",
+	overflow: "clip",
+	overflowClipMargin: l.space[1],
+	"&[data-state=\"open\"]": {
+		inlineSize: "var(--expanding-search-width)",
+		"--expanding-search-radius": l.radius.sm
+	},
+	"&[data-anchor=\"start\"]": {
+		marginInlineStart: 0,
+		marginInlineEnd: "auto"
+	}
+}), v = e({
+	position: "absolute",
+	insetBlockStart: 0,
+	insetInline: 0
+}), ae = e({
+	position: "absolute",
+	inlineSize: "var(--expanding-search-width)",
+	maxInlineSize: "100%",
+	blockSize: "var(--expanding-search-size)",
+	borderStartStartRadius: l.radius.sm,
+	visibility: "hidden",
+	pointerEvents: "none"
+}), oe = e({
+	inlineSize: "100%",
+	paddingInline: 0,
+	borderRadius: "var(--expanding-search-radius)",
+	borderColor: l.color.borderControl,
+	backgroundColor: l.color.surfaceRaised,
+	[n]: {
+		borderColor: "ButtonText",
+		color: "ButtonText"
+	}
+}), se = e({
+	borderRadius: "var(--expanding-search-radius)",
+	overflow: "clip"
+}), ce = e({
+	display: "flex",
+	inlineSize: l.space[4],
+	blockSize: l.space[4],
+	"& > svg": {
+		inlineSize: "100%",
+		blockSize: "100%"
+	}
+}), y = /* @__PURE__ */ d("svg", {
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "2",
+	children: [/* @__PURE__ */ u("circle", {
+		cx: "10.5",
+		cy: "10.5",
+		r: "6.5"
+	}), /* @__PURE__ */ u("path", { d: "m16 16 5 5" })]
+}), le = (e, t) => e?.expanded === t.expanded && e.size === t.size && e.radius === t.radius;
+function b({ ref: e, inputRef: n, triggerLabel: h, open: b, defaultOpen: ue = !1, onOpenChange: x, anchor: S = "end", expandedWidth: C = `calc(${l.space[12]} * 8)`, size: w = "md", disabled: T, value: de, defaultValue: fe, onValueChange: pe, label: E, description: D, error: O, clearable: k, messages: A, searchIcon: j = y, clearIcon: M, slotProps: N, inputProps: P, className: F, sx: I, dir: L, style: R, onKeyDown: z, onBlur: B, ...me }) {
+	let [V = !1, H] = r(b, ue, x), U = c(null), W = c(null), G = c(null), K = c(null), q = c(null), he = f([U, e]), ge = f([G, n]), J = ee(), Y = c(null), [X, _e] = te(), Z = m(0), Q = m(0), $ = c(void 0);
+	s(() => {
+		let e = U.current, t = q.current;
+		if (!e || !t) return;
+		let n = () => {
+			let e = t.getBoundingClientRect(), n = {
+				expanded: e.width,
+				size: e.height,
+				radius: Number.parseFloat(getComputedStyle(t).borderStartStartRadius)
+			};
+			_e((e) => le(e, n) ? e : n);
+		};
+		n();
+		let r = e.ownerDocument.defaultView?.ResizeObserver;
+		if (!r) return;
+		let i = new r(n);
+		return i.observe(e), i.observe(t), () => i.disconnect();
+	}, [C]), s(() => {
+		let e = W.current;
+		if (!e || !X) return;
+		let t = V ? {
+			width: X.expanded,
+			radius: X.radius
+		} : {
+			width: X.size,
+			radius: X.size / 2
+		}, n = () => {
+			e.style.inlineSize = `${Z.get()}px`, e.style.setProperty("--expanding-search-radius", `${Q.get()}px`);
+		}, r = () => {
+			Z.jump(t.width), Q.jump(t.radius), n();
+		}, i = [Z.on("change", n), Q.on("change", n)], a = e.ownerDocument.defaultView?.matchMedia(ne);
+		$.current === void 0 || $.current === V || a?.matches ? r() : (p(Z, t.width, g), p(Q, t.radius, g)), $.current = V;
+		let o = () => {
+			a?.matches && r();
+		};
+		return a?.addEventListener("change", o), () => {
+			i.forEach((e) => e()), a?.removeEventListener("change", o), Z.stop(), Q.stop();
+		};
+	}, [
+		V,
+		X,
+		Z,
+		Q
+	]), s(() => {
+		let e = U.current;
+		if (!e) return;
+		let t = e.ownerDocument.activeElement;
+		V && Y.current === "input" ? (Y.current = null, (e.contains(t) || t === e.ownerDocument.body) && G.current?.focus()) : !V && Y.current === "trigger" && (Y.current = null, (e.contains(t) || t === e.ownerDocument.body) && K.current?.focus());
+	}, [V]);
+	let ve = P?.["aria-label"] ?? (!i(E) || E === "" ? h : void 0);
+	return /* @__PURE__ */ u(t, {
+		className: F,
+		styles: [re, ie[w]],
+		sx: I,
+		children: (e) => /* @__PURE__ */ d("div", {
+			...me,
+			ref: he,
+			className: e,
+			dir: L,
+			"data-ui": "expanding-search",
+			"data-state": V ? "open" : "closed",
+			style: {
+				"--expanding-search-width": C,
+				...R
+			},
+			onKeyDown: (e) => {
+				z?.(e), !(e.defaultPrevented || !V || T || e.key !== "Escape" || e.nativeEvent.isComposing || e.nativeEvent.keyCode === 229) && (e.preventDefault(), Y.current = "trigger", H(!1));
+			},
+			onBlur: (e) => {
+				if (B?.(e), e.defaultPrevented || !V) return;
+				let t = e.currentTarget, n = e.relatedTarget;
+				n && !t.contains(n) ? (Y.current = null, H(!1)) : n || queueMicrotask(() => {
+					t.isConnected && t.ownerDocument.hasFocus() && !t.contains(t.ownerDocument.activeElement) && (Y.current = null, H(!1));
+				});
+			},
+			children: [/* @__PURE__ */ u("span", {
+				ref: q,
+				"aria-hidden": !0,
+				css: ae
+			}), /* @__PURE__ */ d("div", {
+				ref: W,
+				css: _,
+				"data-anchor": S,
+				"data-state": V ? "open" : "closed",
+				children: [/* @__PURE__ */ u("div", {
+					hidden: V,
+					inert: V,
+					css: v,
+					children: /* @__PURE__ */ u(a, {
+						ref: K,
+						size: w,
+						variant: "outline",
+						disabled: T,
+						"aria-label": h,
+						"aria-expanded": V,
+						"aria-controls": J,
+						css: oe,
+						onClick: () => {
+							Y.current = "input", H(!0);
+						},
+						children: /* @__PURE__ */ u("span", {
+							"aria-hidden": !0,
+							css: ce,
+							children: j
+						})
+					})
+				}), /* @__PURE__ */ u("div", {
+					id: J,
+					"aria-hidden": !V || void 0,
+					inert: !V,
+					style: { visibility: V ? "visible" : "hidden" },
+					children: /* @__PURE__ */ u(o, {
+						...P,
+						ref: ge,
+						size: w,
+						dir: L,
+						disabled: T,
+						value: de,
+						defaultValue: fe,
+						onValueChange: pe,
+						label: E,
+						description: D,
+						error: O,
+						clearable: k,
+						messages: A,
+						searchIcon: j,
+						clearIcon: M,
+						"aria-label": ve,
+						slotProps: {
+							...N,
+							shell: {
+								...N?.shell,
+								css: [se, N?.shell?.css]
+							}
+						},
+						onKeyDown: (e) => {
+							P?.onKeyDown?.(e), !(e.defaultPrevented || T || e.key !== "Escape" || e.nativeEvent.isComposing || e.nativeEvent.keyCode === 229) && (e.preventDefault(), Y.current = "trigger", H(!1));
+						}
+					})
+				})]
+			})]
+		})
+	});
+}
+b.displayName = "ExpandingSearch";
+//#endregion
+export { b as t };

package/dist/expanding-search.js

@@ -0,0 +1,2 @@
+'use client';
+export { t as ExpandingSearch } from "./expanding-search-BxOwtdwt.js";