cattle-care-ui 0.1.21 → 0.1.23

package/dist/index.js

@@ -1,27 +1,30 @@
 "use client";
 import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
-import { Fragment as r, createContext as i, createElement as a, forwardRef as o, useContext as s, useEffect as c, useId as l, useLayoutEffect as u, useRef as d, useState as f } from "react";
-var p = {
-	primary: "_primary_12k4r_1",
-	secondary: "_secondary_12k4r_2",
-	tertiary: "_tertiary_12k4r_3",
-	dangerous: "_dangerous_12k4r_4",
-	sm: "_sm_12k4r_35",
-	base: "_base_12k4r_41",
-	icon: "_icon_12k4r_47",
-	leadingIcon: "_leadingIcon_12k4r_55",
-	trailingIcon: "_trailingIcon_12k4r_58",
-	iconOnly: "_iconOnly_12k4r_66",
-	fullWidth: "_fullWidth_12k4r_76"
+import { Fragment as r, createContext as i, createElement as a, forwardRef as o, useCallback as s, useContext as c, useEffect as l, useId as u, useLayoutEffect as d, useRef as f, useState as p } from "react";
+var m = {
+	primary: "_primary_3dzs3_1",
+	secondary: "_secondary_3dzs3_2",
+	tertiary: "_tertiary_3dzs3_3",
+	outline: "_outline_3dzs3_4",
+	onDark: "_onDark_3dzs3_5",
+	dangerous: "_dangerous_3dzs3_6",
+	xs: "_xs_3dzs3_49",
+	sm: "_sm_3dzs3_55",
+	base: "_base_3dzs3_61",
+	icon: "_icon_3dzs3_67",
+	leadingIcon: "_leadingIcon_3dzs3_75",
+	trailingIcon: "_trailingIcon_3dzs3_78",
+	iconOnly: "_iconOnly_3dzs3_86",
+	fullWidth: "_fullWidth_3dzs3_99"
 };
 //#endregion
 //#region src/components/Button.tsx
-function m({ variant: e = "primary", size: r = "base", leadingIcon: i, trailingIcon: a, fullWidth: o, children: s, className: c, ref: l, ...u }) {
+function h({ variant: e = "primary", size: r = "base", leadingIcon: i, trailingIcon: a, fullWidth: o, children: s, className: c, ref: l, ...u }) {
 	let d = !s && !!i, f = [
-		p[e],
-		p[r],
-		d && p.iconOnly,
-		o && p.fullWidth,
+		m[e],
+		m[r],
+		d && m.iconOnly,
+		o && m.fullWidth,
 		c
 	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ n("button", {
@@ -31,18 +34,18 @@ function m({ variant: e = "primary", size: r = "base", leadingIcon: i, trailingI
 		...u,
 		children: [
 			i && /* @__PURE__ */ t("span", {
-				className: `${p.icon} ${d ? "" : p.leadingIcon}`.trim(),
+				className: `${m.icon} ${d ? "" : m.leadingIcon}`.trim(),
 				children: i
 			}),
 			s,
 			a && /* @__PURE__ */ t("span", {
-				className: `${p.icon} ${p.trailingIcon}`,
+				className: `${m.icon} ${m.trailingIcon}`,
 				children: a
 			})
 		]
 	});
 }
-var h = {
+var g = {
 	wrap: "_wrap_1spnu_1",
 	fluid: "_fluid_1spnu_9",
 	backing: "_backing_1spnu_14",
@@ -54,102 +57,31 @@ var h = {
 };
 //#endregion
 //#region src/components/Card.tsx
-function g({ stacked: e, completed: r, interactive: i, draggable: a, dragging: o, fluid: s, children: c, ...l }) {
+function _({ stacked: e, completed: r, interactive: i, draggable: a, dragging: o, fluid: s, children: c, ...l }) {
 	return /* @__PURE__ */ n("div", {
-		className: `${h.wrap} ${s ? h.fluid : ""}`,
-		children: [e && /* @__PURE__ */ t("div", { className: `${h.backing} ${r ? h.completed : ""}` }), /* @__PURE__ */ t("div", {
+		className: `${g.wrap} ${s ? g.fluid : ""}`,
+		children: [e && /* @__PURE__ */ t("div", { className: `${g.backing} ${r ? g.completed : ""}` }), /* @__PURE__ */ t("div", {
 			className: [
-				h.card,
-				r ? h.completed : "",
-				i ? h.interactive : "",
-				a ? h.grabbable : "",
-				o ? h.dragging : ""
+				g.card,
+				r ? g.completed : "",
+				i ? g.interactive : "",
+				a ? g.grabbable : "",
+				o ? g.dragging : ""
 			].filter(Boolean).join(" "),
 			...l,
 			children: c
 		})]
 	});
 }
-var _ = {
-	neutral: "_neutral_1h6kq_1",
-	pill: "_pill_1h6kq_2",
-	accent: "_accent_1h6kq_3",
-	success: "_success_1h6kq_4",
-	danger: "_danger_1h6kq_5",
-	count: "_count_1h6kq_6"
-};
-//#endregion
-//#region src/components/Tag.tsx
-function v({ variant: e = "neutral", children: n, ...r }) {
-	return /* @__PURE__ */ t("span", {
-		className: _[e],
-		...r,
-		children: n
-	});
-}
-var y = {
-	group: "_group_jl3nf_1",
-	sm: "_sm_jl3nf_9",
-	chip: "_chip_jl3nf_13",
-	base: "_base_jl3nf_33",
-	selected: "_selected_jl3nf_59"
-}, b = {
-	group: "_group_16vyf_1",
-	groupLabel: "_groupLabel_16vyf_7"
-}, x = { label: "_label_10zsm_1" };
-//#endregion
-//#region src/components/FieldLabel.tsx
-function S({ children: e, htmlFor: n, className: r }) {
-	let i = `${x.label} ${r ?? ""}`.trim();
-	return n ? /* @__PURE__ */ t("label", {
-		className: i,
-		htmlFor: n,
-		children: e
-	}) : /* @__PURE__ */ t("span", {
-		className: i,
-		children: e
-	});
-}
-//#endregion
-//#region src/components/TagGroup.tsx
-function ee({ items: e, value: r, onChange: i, size: a = "base", disabled: o = !1, label: s, ...c }) {
-	function l(e) {
-		i(r.includes(e) ? r.filter((t) => t !== e) : [...r, e]);
-	}
-	let u = /* @__PURE__ */ t("div", {
-		role: "group",
-		"aria-label": s ? void 0 : c["aria-label"],
-		className: `${y.group} ${y[a]}`,
-		children: e.map((e) => {
-			let n = r.includes(e.value), i = o || e.disabled;
-			return /* @__PURE__ */ t("button", {
-				type: "button",
-				"aria-pressed": n,
-				disabled: i,
-				className: [y.chip, n && y.selected].filter(Boolean).join(" "),
-				onClick: () => !i && l(e.value),
-				children: e.label
-			}, e.value);
-		})
-	});
-	return s ? /* @__PURE__ */ n("div", {
-		className: b.group,
-		...c,
-		children: [/* @__PURE__ */ t(S, {
-			className: b.groupLabel,
-			children: s
-		}), u]
-	}) : u;
-}
 //#endregion
 //#region node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.mjs
-var C = (e) => e?.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+var v = (e) => e?.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
 //#endregion
 //#region node_modules/lucide-react/dist/esm/shared/src/utils/toLucideIconData.mjs
-function te(e, t, n = []) {
+function y(e, t, n = []) {
 	if (t == null) throw Error("[lucide]: iconNode is required when icon name is used");
 	return {
-		name: C(e),
+		name: v(e),
 		size: 24,
 		node: t,
 		...n.length > 0 ? { aliases: n } : {}
@@ -157,7 +89,7 @@ function te(e, t, n = []) {
 }
 //#endregion
 //#region node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.mjs
-var w = (e) => {
+var b = (e) => {
 	let t = "", n = !1;
 	for (let r of e) {
 		if (r === "-" || r === "_" || r <= " ") {
@@ -167,10 +99,10 @@ var w = (e) => {
 		t.length === 0 ? t += r.toLowerCase() : t += n ? r.toUpperCase() : r, n = !1;
 	}
 	return t;
-}, T = (e) => {
-	let t = w(e);
+}, x = (e) => {
+	let t = b(e);
 	return t.charAt(0).toUpperCase() + t.slice(1);
-}, E = (...e) => e.filter((e, t, n) => !!e && e.trim() !== "" && n.indexOf(e) === t).join(" ").trim(), D = {
+}, S = (...e) => e.filter((e, t, n) => !!e && e.trim() !== "" && n.indexOf(e) === t).join(" ").trim(), C = {
 	xmlns: "http://www.w3.org/2000/svg",
 	width: 24,
 	height: 24,
@@ -183,22 +115,22 @@ var w = (e) => {
 };
 //#endregion
 //#region node_modules/lucide-react/dist/esm/shared/src/build/buildLucideIconNode.mjs
-function O(e) {
+function w(e) {
 	return e != null;
 }
-function k(e, t = {}) {
-	let n = t.attributeNames ?? {}, r = (e) => n[e] ?? e, i = e.size ?? e.width ?? D.width, a = e.size ?? e.height ?? D.height, o = e.aliases?.filter((e) => typeof e == "string" && e.trim() !== "").map((e) => `lucide-${e}`) ?? [], s = [...e.name ? [`lucide-${e.name}`] : [], ...o], c = t.className?.split(" ").filter(Boolean) ?? [], l = t.includeDefaultClasses === !1 ? E(...c) : E("lucide", ...s, ...c), u = t.absoluteStrokeWidth ? Number(t.strokeWidth ?? D["stroke-width"]) * Number(e.size ?? e.width ?? D.width) / Number(t.size ?? t.width ?? D.width) : t.strokeWidth ?? D["stroke-width"];
+function ee(e, t = {}) {
+	let n = t.attributeNames ?? {}, r = (e) => n[e] ?? e, i = e.size ?? e.width ?? C.width, a = e.size ?? e.height ?? C.height, o = e.aliases?.filter((e) => typeof e == "string" && e.trim() !== "").map((e) => `lucide-${e}`) ?? [], s = [...e.name ? [`lucide-${e.name}`] : [], ...o], c = t.className?.split(" ").filter(Boolean) ?? [], l = t.includeDefaultClasses === !1 ? S(...c) : S("lucide", ...s, ...c), u = t.absoluteStrokeWidth ? Number(t.strokeWidth ?? C["stroke-width"]) * Number(e.size ?? e.width ?? C.width) / Number(t.size ?? t.width ?? C.width) : t.strokeWidth ?? C["stroke-width"];
 	return [
 		"svg",
 		{
-			...Object.entries(D).reduce((e, [t, n]) => (e[r(t)] = n, e), {}),
+			...Object.entries(C).reduce((e, [t, n]) => (e[r(t)] = n, e), {}),
 			..."color" in t && t.color && { [r("stroke")]: t.color },
-			..."size" in t && O(t.size) && {
+			..."size" in t && w(t.size) && {
 				[r("width")]: t.size,
 				[r("height")]: t.size
 			},
-			..."width" in t && O(t.width) && { [r("width")]: t.width },
-			..."height" in t && O(t.height) && { [r("height")]: t.height },
+			..."width" in t && w(t.width) && { [r("width")]: t.width },
+			..."height" in t && w(t.height) && { [r("height")]: t.height },
 			[r("stroke-width")]: u,
 			...l && { [r("class")]: l },
 			[r("viewBox")]: `0 0 ${i} ${a}`,
@@ -220,8 +152,8 @@ function k(e, t = {}) {
 }
 //#endregion
 //#region node_modules/lucide-react/dist/esm/shared/src/build/buildLucideIconForReact.mjs
-function A(e, t = {}) {
-	return k(e, {
+function te(e, t = {}) {
+	return ee(e, {
 		...t,
 		attributeNames: {
 			...t.attributeNames,
@@ -235,44 +167,44 @@ function A(e, t = {}) {
 }
 //#endregion
 //#region node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.mjs
-var j = (e) => {
+var ne = (e) => {
 	for (let t in e) if (t.startsWith("aria-") || t === "role" || t === "title") return !0;
 	return !1;
-}, M = i({}), N = () => s(M), P = o(({ color: e, size: t, width: n, height: r, strokeWidth: i, absoluteStrokeWidth: o, nonScalingStroke: s, className: c = "", children: l, iconNode: u = [], icon: d = {
+}, re = i({}), T = () => c(re), E = o(({ color: e, size: t, width: n, height: r, strokeWidth: i, absoluteStrokeWidth: o, nonScalingStroke: s, className: c = "", children: l, iconNode: u = [], icon: d = {
 	node: u,
 	aliases: [],
 	size: 24
 }, ...f }, p) => {
-	let { size: m = 24, strokeWidth: h = 2, absoluteStrokeWidth: g = !1, nonScalingStroke: _ = !1, color: v = "currentColor", className: y = "" } = N() ?? {}, b = !!l || j(f), [x, S, ee = []] = A(d, {
+	let { size: m = 24, strokeWidth: h = 2, absoluteStrokeWidth: g = !1, nonScalingStroke: _ = !1, color: v = "currentColor", className: y = "" } = T() ?? {}, b = !!l || ne(f), [x, C, w = []] = te(d, {
 		color: e ?? v,
 		width: n ?? t ?? m,
 		height: r ?? t ?? m,
 		strokeWidth: i ?? h,
 		absoluteStrokeWidth: o ?? g,
 		nonScalingStroke: s ?? _,
-		className: E(y, c),
+		className: S(y, c),
 		hasA11yProp: b,
 		attributes: f
 	});
 	return a(x, {
 		ref: p,
-		...S
-	}, [...ee.map(([e, t]) => a(e, t)), ...Array.isArray(l) ? l : [l]]);
+		...C
+	}, [...w.map(([e, t]) => a(e, t)), ...Array.isArray(l) ? l : [l]]);
 });
 //#endregion
 //#region node_modules/lucide-react/dist/esm/createLucideIcon.mjs
-function F(e, t = [], n = []) {
-	let r = typeof e == "string" ? te(e, t, n) : e, i = o(({ className: e, ...t }, n) => a(P, {
+function D(e, t = [], n = []) {
+	let r = typeof e == "string" ? y(e, t, n) : e, i = o(({ className: e, ...t }, n) => a(E, {
 		ref: n,
 		icon: r,
 		className: e,
 		...t
 	}));
-	return r.name && (i.displayName = T(r.name)), i;
+	return r.name && (i.displayName = x(r.name)), i;
 }
 //#endregion
 //#region node_modules/lucide-react/dist/esm/icons/check.mjs
-var I = {
+var O = {
 	name: "check",
 	size: 24,
 	node: [["path", {
@@ -280,8 +212,8 @@ var I = {
 		key: "1gmf2c"
 	}]]
 };
-I.node;
-var ne = F(I), L = {
+O.node;
+var ie = D(O), k = {
 	name: "chevron-down",
 	size: 24,
 	node: [["path", {
@@ -289,8 +221,8 @@ var ne = F(I), L = {
 		key: "qrunsl"
 	}]]
 };
-L.node;
-var re = F(L), R = {
+k.node;
+var A = D(k), ae = {
 	name: "eye-off",
 	size: 24,
 	node: [
@@ -312,8 +244,8 @@ var re = F(L), R = {
 		}]
 	]
 };
-R.node;
-var z = F(R), B = {
+ae.node;
+var oe = D(ae), j = {
 	name: "eye",
 	size: 24,
 	node: [["path", {
@@ -326,8 +258,8 @@ var z = F(R), B = {
 		key: "1v7zrd"
 	}]]
 };
-B.node;
-var ie = F(B), V = {
+j.node;
+var M = D(j), N = {
 	name: "search",
 	size: 24,
 	node: [["path", {
@@ -340,8 +272,150 @@ var ie = F(B), V = {
 		key: "4ej97u"
 	}]]
 };
-V.node;
-var ae = F(V), H = {
+N.node;
+var P = D(N), F = {
+	name: "x",
+	size: 24,
+	node: [["path", {
+		d: "M18 6 6 18",
+		key: "1bl5f8"
+	}], ["path", {
+		d: "m6 6 12 12",
+		key: "d8bk6v"
+	}]]
+};
+F.node;
+var se = D(F), I = {
+	neutral: "_neutral_kgxl4_1",
+	pill: "_pill_kgxl4_2",
+	accent: "_accent_kgxl4_3",
+	success: "_success_kgxl4_4",
+	warning: "_warning_kgxl4_5",
+	danger: "_danger_kgxl4_6",
+	count: "_count_kgxl4_7",
+	chip: "_chip_kgxl4_8",
+	pressed: "_pressed_kgxl4_34",
+	slots: "_slots_kgxl4_100",
+	leading: "_leading_kgxl4_104",
+	interactive: "_interactive_kgxl4_110",
+	button: "_button_kgxl4_120",
+	disabled: "_disabled_kgxl4_132",
+	main: "_main_kgxl4_161",
+	remove: "_remove_kgxl4_162",
+	removable: "_removable_kgxl4_179"
+}, L = {
+	chip: "_chip_uk2l3_3",
+	disabled: "_disabled_uk2l3_12",
+	selected: "_selected_uk2l3_25"
+};
+//#endregion
+//#region src/components/Tag.tsx
+function R(...e) {
+	return e.filter(Boolean).join(" ");
+}
+function ce(r) {
+	if (r.variant === "count") {
+		let { variant: e, children: n, ...i } = r;
+		return /* @__PURE__ */ t("span", {
+			className: I[e],
+			...i,
+			children: n
+		});
+	}
+	let { variant: i = "neutral", children: a, onClick: o, pressed: s, disabled: c, leading: l, onRemove: u, removeLabel: d, ...f } = r, p = !!o, m = !!u, h = i === "chip", g = p && s === !0, _ = R(I[i], h && L.chip, h && g && L.selected, h && c && L.disabled, (p || m) && I.interactive, g && I.pressed, c && I.disabled, (l != null || m) && I.slots), v = /* @__PURE__ */ n(e, { children: [l != null && /* @__PURE__ */ t("span", {
+		className: I.leading,
+		children: l
+	}), a] });
+	return m ? /* @__PURE__ */ n("span", {
+		className: R(_, I.removable),
+		...f,
+		children: [p ? /* @__PURE__ */ t("button", {
+			type: "button",
+			className: R(I.main, I.slots),
+			"aria-pressed": s,
+			disabled: c,
+			onClick: o,
+			children: v
+		}) : v, /* @__PURE__ */ t("button", {
+			type: "button",
+			className: I.remove,
+			"aria-label": d,
+			disabled: c,
+			onClick: () => u(),
+			children: /* @__PURE__ */ t(se, {
+				size: 12,
+				"aria-hidden": "true"
+			})
+		})]
+	}) : p ? /* @__PURE__ */ t("button", {
+		type: "button",
+		className: R(_, I.button),
+		"aria-pressed": s,
+		disabled: c,
+		onClick: o,
+		...f,
+		children: v
+	}) : /* @__PURE__ */ t("span", {
+		className: _,
+		...f,
+		children: v
+	});
+}
+var z = {
+	group: "_group_1s11w_1",
+	sm: "_sm_1s11w_9",
+	chip: "_chip_1s11w_13 _chip_uk2l3_3",
+	base: "_base_1s11w_28",
+	selected: "_selected_1s11w_44 _selected_uk2l3_25"
+}, B = {
+	group: "_group_16vyf_1",
+	groupLabel: "_groupLabel_16vyf_7"
+}, V = { label: "_label_10zsm_1" };
+//#endregion
+//#region src/components/FieldLabel.tsx
+function H({ children: e, htmlFor: n, className: r }) {
+	let i = `${V.label} ${r ?? ""}`.trim();
+	return n ? /* @__PURE__ */ t("label", {
+		className: i,
+		htmlFor: n,
+		children: e
+	}) : /* @__PURE__ */ t("span", {
+		className: i,
+		children: e
+	});
+}
+//#endregion
+//#region src/components/TagGroup.tsx
+function le({ items: e, value: r, onChange: i, size: a = "base", disabled: o = !1, label: s, ...c }) {
+	function l(e) {
+		i(r.includes(e) ? r.filter((t) => t !== e) : [...r, e]);
+	}
+	let u = /* @__PURE__ */ t("div", {
+		role: "group",
+		"aria-label": s ? void 0 : c["aria-label"],
+		className: `${z.group} ${z[a]}`,
+		children: e.map((e) => {
+			let n = r.includes(e.value), i = o || e.disabled;
+			return /* @__PURE__ */ t("button", {
+				type: "button",
+				"aria-pressed": n,
+				disabled: i,
+				className: [z.chip, n && z.selected].filter(Boolean).join(" "),
+				onClick: () => !i && l(e.value),
+				children: e.label
+			}, e.value);
+		})
+	});
+	return s ? /* @__PURE__ */ n("div", {
+		className: B.group,
+		...c,
+		children: [/* @__PURE__ */ t(H, {
+			className: B.groupLabel,
+			children: s
+		}), u]
+	}) : u;
+}
+var U = {
 	toolbar: "_toolbar_1s82l_1",
 	searchWrap: "_searchWrap_1s82l_14",
 	searchIcon: "_searchIcon_1s82l_33",
@@ -351,44 +425,44 @@ var ae = F(V), H = {
 };
 //#endregion
 //#region src/components/Toolbar.tsx
-function oe({ searchValue: e, onSearchChange: r, placeholder: i = "Search…", shortcutLabel: a = "⌘K", shortcutKey: o = "k", children: s }) {
-	let l = d(null);
-	return c(() => {
+function ue({ searchValue: e, onSearchChange: r, placeholder: i = "Search…", shortcutLabel: a = "⌘K", shortcutKey: o = "k", children: s }) {
+	let c = f(null);
+	return l(() => {
 		function e(e) {
-			(e.metaKey || e.ctrlKey) && e.key.toLowerCase() === o.toLowerCase() && (e.preventDefault(), l.current?.focus());
+			(e.metaKey || e.ctrlKey) && e.key.toLowerCase() === o.toLowerCase() && (e.preventDefault(), c.current?.focus());
 		}
 		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
 	}, [o]), /* @__PURE__ */ n("div", {
-		className: H.toolbar,
+		className: U.toolbar,
 		children: [/* @__PURE__ */ n("div", {
-			className: H.searchWrap,
+			className: U.searchWrap,
 			children: [
 				/* @__PURE__ */ t("span", {
-					className: H.searchIcon,
-					children: /* @__PURE__ */ t(ae, {})
+					className: U.searchIcon,
+					children: /* @__PURE__ */ t(P, {})
 				}),
 				/* @__PURE__ */ t("input", {
-					ref: l,
+					ref: c,
 					type: "text",
-					className: H.search,
+					className: U.search,
 					placeholder: i,
 					autoComplete: "off",
 					value: e,
 					onChange: (e) => r?.(e.target.value)
 				}),
 				a && /* @__PURE__ */ t("span", {
-					className: H.searchShortcut,
+					className: U.searchShortcut,
 					"aria-hidden": "true",
 					children: a
 				})
 			]
 		}), s && /* @__PURE__ */ t("div", {
-			className: H.controls,
+			className: U.controls,
 			children: s
 		})]
 	});
 }
-var U = {
+var W = {
 	checkbox: "_checkbox_54v1q_1",
 	control: "_control_54v1q_8",
 	labelText: "_labelText_54v1q_17",
@@ -398,15 +472,15 @@ var U = {
 };
 //#endregion
 //#region src/components/Checkbox.tsx
-function W({ checked: e, onChange: r, onBlur: i, name: a, label: o, ariaLabel: s, disabled: c, className: l, ref: u }) {
+function de({ checked: e, onChange: r, onBlur: i, name: a, label: o, ariaLabel: s, disabled: c, className: l, ref: u }) {
 	return /* @__PURE__ */ n("label", {
-		className: `${U.checkbox} ${l ?? ""}`,
+		className: `${W.checkbox} ${l ?? ""}`,
 		children: [/* @__PURE__ */ n("span", {
-			className: U.control,
+			className: W.control,
 			children: [/* @__PURE__ */ t("input", {
 				ref: u,
 				type: "checkbox",
-				className: U.input,
+				className: W.input,
 				checked: e,
 				onChange: r,
 				onBlur: i,
@@ -414,32 +488,32 @@ function W({ checked: e, onChange: r, onBlur: i, name: a, label: o, ariaLabel: s
 				"aria-label": s,
 				disabled: c
 			}), /* @__PURE__ */ t("span", {
-				className: U.box,
+				className: W.box,
 				children: /* @__PURE__ */ t("svg", {
-					className: U.icon,
+					className: W.icon,
 					viewBox: "0 0 17 18",
 					"aria-hidden": "true",
 					children: /* @__PURE__ */ t("polyline", { points: "1 9 7 14 15 4" })
 				})
 			})]
 		}), o && /* @__PURE__ */ t("span", {
-			className: U.labelText,
+			className: W.labelText,
 			children: o
 		})]
 	});
 }
-function se({ label: e, items: r, value: i, onChange: a, disabled: o, ...s }) {
+function fe({ label: e, items: r, value: i, onChange: a, disabled: o, ...s }) {
 	function c(e) {
 		a(i.includes(e) ? i.filter((t) => t !== e) : [...i, e]);
 	}
 	return /* @__PURE__ */ n("div", {
 		role: "group",
 		"aria-label": e ? void 0 : s["aria-label"],
-		className: b.group,
-		children: [e && /* @__PURE__ */ t(S, {
-			className: b.groupLabel,
+		className: B.group,
+		children: [e && /* @__PURE__ */ t(H, {
+			className: B.groupLabel,
 			children: e
-		}), r.map((e) => /* @__PURE__ */ t(W, {
+		}), r.map((e) => /* @__PURE__ */ t(de, {
 			checked: i.includes(e.value),
 			onChange: () => c(e.value),
 			label: e.label,
@@ -457,7 +531,7 @@ var G = {
 };
 //#endregion
 //#region src/components/RadioButton.tsx
-function ce({ checked: e, onChange: r, onBlur: i, name: a, value: o, label: s, ariaLabel: c, disabled: l, className: u, ref: d }) {
+function pe({ checked: e, onChange: r, onBlur: i, name: a, value: o, label: s, ariaLabel: c, disabled: l, className: u, ref: d }) {
 	return /* @__PURE__ */ n("label", {
 		className: `${G.radio} ${u ?? ""}`,
 		children: [/* @__PURE__ */ n("span", {
@@ -483,15 +557,15 @@ function ce({ checked: e, onChange: r, onBlur: i, name: a, value: o, label: s, a
 		})]
 	});
 }
-function le({ label: e, name: r, items: i, value: a, onChange: o, disabled: s, ...c }) {
+function me({ label: e, name: r, items: i, value: a, onChange: o, disabled: s, ...c }) {
 	return /* @__PURE__ */ n("div", {
 		role: "radiogroup",
 		"aria-label": e ? void 0 : c["aria-label"],
-		className: b.group,
-		children: [e && /* @__PURE__ */ t(S, {
-			className: b.groupLabel,
+		className: B.group,
+		children: [e && /* @__PURE__ */ t(H, {
+			className: B.groupLabel,
 			children: e
-		}), i.map((e) => /* @__PURE__ */ t(ce, {
+		}), i.map((e) => /* @__PURE__ */ t(pe, {
 			name: r,
 			value: e.value,
 			checked: a === e.value,
@@ -513,7 +587,7 @@ var K = {
 };
 //#endregion
 //#region src/components/Switch.tsx
-function ue({ checked: e, onChange: r, size: i = "base", label: a, ariaLabel: o, disabled: s, className: c }) {
+function he({ checked: e, onChange: r, size: i = "base", label: a, ariaLabel: o, disabled: s, className: c }) {
 	return /* @__PURE__ */ n("label", {
 		className: `${K.switch} ${c ?? ""}`,
 		children: [/* @__PURE__ */ n("span", {
@@ -537,27 +611,27 @@ function ue({ checked: e, onChange: r, size: i = "base", label: a, ariaLabel: o,
 	});
 }
 var q = {
-	field: "_field_p41tk_1",
-	inputWrap: "_inputWrap_p41tk_6",
-	errorWrap: "_errorWrap_p41tk_19",
-	input: "_input_p41tk_6",
-	toolbar: "_toolbar_p41tk_27",
-	sm: "_sm_p41tk_57",
-	base: "_base_p41tk_65",
-	icon: "_icon_p41tk_73",
-	helperText: "_helperText_p41tk_111",
-	errorText: "_errorText_p41tk_116",
-	trailing: "_trailing_p41tk_120",
-	pickerInput: "_pickerInput_p41tk_151"
+	field: "_field_duryc_1",
+	inputWrap: "_inputWrap_duryc_6",
+	input: "_input_duryc_6",
+	toolbar: "_toolbar_duryc_14",
+	errorWrap: "_errorWrap_duryc_24",
+	sm: "_sm_duryc_71",
+	base: "_base_duryc_79",
+	icon: "_icon_duryc_87",
+	helperText: "_helperText_duryc_125",
+	errorText: "_errorText_duryc_130",
+	trailing: "_trailing_duryc_134",
+	pickerInput: "_pickerInput_duryc_165"
 };
 //#endregion
 //#region src/components/TextField.tsx
-function de({ label: e, helperText: r, error: i, size: a = "base", variant: o = "default", leadingIcon: s, id: c, className: u, ref: d, ...f }) {
-	let p = l(), m = c ?? p;
+function ge({ label: e, helperText: r, error: i, size: a = "base", variant: o = "default", leadingIcon: s, id: c, className: l, ref: d, ...f }) {
+	let p = u(), m = c ?? p;
 	return /* @__PURE__ */ n("div", {
-		className: [q.field, u].filter(Boolean).join(" "),
+		className: [q.field, l].filter(Boolean).join(" "),
 		children: [
-			e && /* @__PURE__ */ t(S, {
+			e && /* @__PURE__ */ t(H, {
 				htmlFor: m,
 				children: e
 			}),
@@ -583,21 +657,133 @@ function de({ label: e, helperText: r, error: i, size: a = "base", variant: o =
 		]
 	});
 }
+var J = {
+	field: "_field_muf9j_3",
+	wrap: "_wrap_muf9j_1",
+	readOnly: "_readOnly_muf9j_14",
+	errorWrap: "_errorWrap_muf9j_1",
+	disabled: "_disabled_muf9j_1",
+	sm: "_sm_muf9j_27",
+	textarea: "_textarea_muf9j_30",
+	base: "_base_muf9j_33",
+	"resize-none": "_resize-none_muf9j_66",
+	"resize-vertical": "_resize-vertical_muf9j_69",
+	footer: "_footer_muf9j_73",
+	helperText: "_helperText_muf9j_78",
+	errorText: "_errorText_muf9j_83",
+	count: "_count_muf9j_87",
+	countNear: "_countNear_muf9j_93",
+	countLimit: "_countLimit_muf9j_96"
+};
+//#endregion
+//#region src/components/TextArea.tsx
+function _e(e, t) {
+	typeof e == "function" ? e(t) : e && (e.current = t);
+}
+function ve({ label: e, helperText: r, error: i, size: a = "base", resize: o = "vertical", autoResize: c = !1, maxRows: l = 8, showCount: m = !1, id: h, className: g, ref: _, rows: v = 3, value: y, defaultValue: b, maxLength: x, disabled: S, readOnly: C, onChange: w, onInput: ee, "aria-describedby": te, ...ne }) {
+	let re = u(), T = h ?? re, E = f(null), D = y !== void 0, [O, ie] = p(() => String(b ?? "").length), k = D ? String(y).length : O, A = s(() => {
+		let e = E.current;
+		if (!e || !c) return;
+		let t = getComputedStyle(e), n = parseFloat(t.fontSize) || 14, r = parseFloat(t.lineHeight) || n * 1.4, i = (parseFloat(t.paddingTop) || 0) + (parseFloat(t.paddingBottom) || 0), a = r * l + i;
+		e.style.height = "auto";
+		let o = Math.min(e.scrollHeight, a);
+		e.style.height = `${o}px`, e.style.overflowY = e.scrollHeight > a ? "auto" : "hidden";
+	}, [c, l]);
+	d(() => {
+		A();
+	}, [
+		A,
+		y,
+		v,
+		a
+	]), d(() => {
+		let e = E.current;
+		if (!c || !e || typeof ResizeObserver > "u") return;
+		let t = e.clientWidth, n = new ResizeObserver(() => {
+			e.clientWidth !== t && (t = e.clientWidth, A());
+		});
+		return n.observe(e), () => n.disconnect();
+	}, [c, A]), d(() => {
+		let e = E.current;
+		!c && e && (e.style.height = "", e.style.overflowY = "");
+	}, [c]);
+	let ae = (e) => {
+		D || ie(e.target.value.length), w?.(e);
+	}, oe = (e) => {
+		D || (ie(e.currentTarget.value.length), A()), ee?.(e);
+	}, j = `${T}-helper`, M = `${T}-error`, N = `${T}-count`, P = [
+		te,
+		i ? M : r ? j : null,
+		m ? N : null
+	].filter(Boolean).join(" ") || void 0, F = x ? k / x : 0, se = F >= 1 ? J.countLimit : F >= .9 ? J.countNear : "", I = [
+		J.wrap,
+		J[a],
+		i ? J.errorWrap : "",
+		S ? J.disabled : "",
+		C ? J.readOnly : ""
+	].filter(Boolean).join(" "), L = c ? "none" : o;
+	return /* @__PURE__ */ n("div", {
+		className: [J.field, g].filter(Boolean).join(" "),
+		children: [
+			e && /* @__PURE__ */ t(H, {
+				htmlFor: T,
+				children: e
+			}),
+			/* @__PURE__ */ t("div", {
+				className: I,
+				children: /* @__PURE__ */ t("textarea", {
+					...ne,
+					ref: (e) => {
+						E.current = e, _e(_, e);
+					},
+					id: T,
+					className: `${J.textarea} ${J[`resize-${L}`]}`,
+					rows: v,
+					value: y,
+					defaultValue: b,
+					maxLength: x,
+					disabled: S,
+					readOnly: C,
+					"aria-invalid": i ? !0 : ne["aria-invalid"],
+					"aria-describedby": P,
+					onChange: ae,
+					onInput: oe
+				})
+			}),
+			(i || r || m) && /* @__PURE__ */ n("div", {
+				className: J.footer,
+				children: [i ? /* @__PURE__ */ t("span", {
+					id: M,
+					className: J.errorText,
+					children: i
+				}) : r ? /* @__PURE__ */ t("span", {
+					id: j,
+					className: J.helperText,
+					children: r
+				}) : null, m && /* @__PURE__ */ t("span", {
+					id: N,
+					className: `${J.count} ${se}`,
+					children: x ? `${k} / ${x}` : k
+				})]
+			})
+		]
+	});
+}
 //#endregion
 //#region src/components/PasswordField.tsx
-function fe({ label: e, helperText: r, error: i, size: a = "base", showLabel: o = "Show password", hideLabel: s = "Hide password", defaultVisible: c = !1, id: u, className: d, ref: p, disabled: m, ...h }) {
-	let g = l(), _ = u ?? g, [v, y] = f(c);
+function ye({ label: e, helperText: r, error: i, size: a = "base", showLabel: o = "Show password", hideLabel: s = "Hide password", defaultVisible: c = !1, id: l, className: d, ref: f, disabled: m, ...h }) {
+	let g = u(), _ = l ?? g, [v, y] = p(c);
 	return /* @__PURE__ */ n("div", {
 		className: [q.field, d].filter(Boolean).join(" "),
 		children: [
-			e && /* @__PURE__ */ t(S, {
+			e && /* @__PURE__ */ t(H, {
 				htmlFor: _,
 				children: e
 			}),
 			/* @__PURE__ */ n("div", {
 				className: `${q.inputWrap} ${q.default} ${q[a]} ${i ? q.errorWrap : ""}`,
 				children: [/* @__PURE__ */ t("input", {
-					ref: p,
+					ref: f,
 					id: _,
 					className: q.input,
 					type: v ? "text" : "password",
@@ -612,7 +798,7 @@ function fe({ label: e, helperText: r, error: i, size: a = "base", showLabel: o
 					"aria-controls": _,
 					disabled: m,
 					onClick: () => y((e) => !e),
-					children: t(v ? z : ie, {})
+					children: t(v ? oe : M, {})
 				})]
 			}),
 			i ? /* @__PURE__ */ t("span", {
@@ -627,15 +813,15 @@ function fe({ label: e, helperText: r, error: i, size: a = "base", showLabel: o
 }
 //#endregion
 //#region src/components/DateField.tsx
-function pe({ label: e, helperText: r, error: i, size: a = "base", openLabel: o = "Open calendar", id: s, className: c, ref: u, onClick: f, disabled: p, ...m }) {
-	let h = l(), g = s ?? h, _ = d(null);
+function be({ label: e, helperText: r, error: i, size: a = "base", openLabel: o = "Open calendar", id: s, className: c, ref: l, onClick: d, disabled: p, ...m }) {
+	let h = u(), g = s ?? h, _ = f(null);
 	function v(e) {
-		_.current = e, typeof u == "function" ? u(e) : u && (u.current = e);
+		_.current = e, typeof l == "function" ? l(e) : l && (l.current = e);
 	}
 	return /* @__PURE__ */ n("div", {
 		className: [q.field, c].filter(Boolean).join(" "),
 		children: [
-			e && /* @__PURE__ */ t(S, {
+			e && /* @__PURE__ */ t(H, {
 				htmlFor: g,
 				children: e
 			}),
@@ -649,7 +835,7 @@ function pe({ label: e, helperText: r, error: i, size: a = "base", openLabel: o
 					inputMode: "none",
 					readOnly: !0,
 					disabled: p,
-					onClick: f
+					onClick: d
 				}), /* @__PURE__ */ t("button", {
 					type: "button",
 					tabIndex: -1,
@@ -657,7 +843,7 @@ function pe({ label: e, helperText: r, error: i, size: a = "base", openLabel: o
 					"aria-label": o,
 					disabled: p,
 					onClick: () => _.current?.click(),
-					children: /* @__PURE__ */ t(re, {})
+					children: /* @__PURE__ */ t(A, {})
 				})]
 			}),
 			i ? /* @__PURE__ */ t("span", {
@@ -670,7 +856,7 @@ function pe({ label: e, helperText: r, error: i, size: a = "base", openLabel: o
 		]
 	});
 }
-var J = {
+var Y = {
 	field: "_field_tr8ir_1",
 	inputWrap: "_inputWrap_tr8ir_6",
 	errorWrap: "_errorWrap_tr8ir_19",
@@ -684,64 +870,64 @@ var J = {
 };
 //#endregion
 //#region src/components/NumberField.tsx
-function me({ label: e, helperText: r, error: i, size: a = "base", prefix: o, suffix: s, id: c, ...u }) {
-	let d = l(), f = c ?? d;
+function xe({ label: e, helperText: r, error: i, size: a = "base", prefix: o, suffix: s, id: c, ...l }) {
+	let d = u(), f = c ?? d;
 	return /* @__PURE__ */ n("div", {
-		className: J.field,
+		className: Y.field,
 		children: [
-			e && /* @__PURE__ */ t(S, {
+			e && /* @__PURE__ */ t(H, {
 				htmlFor: f,
 				children: e
 			}),
 			/* @__PURE__ */ n("div", {
-				className: `${J.inputWrap} ${J[a]} ${i ? J.errorWrap : ""}`,
+				className: `${Y.inputWrap} ${Y[a]} ${i ? Y.errorWrap : ""}`,
 				children: [
 					o && /* @__PURE__ */ t("span", {
-						className: J.prefix,
+						className: Y.prefix,
 						children: o
 					}),
 					/* @__PURE__ */ t("input", {
 						id: f,
-						className: J.input,
-						...u
+						className: Y.input,
+						...l
 					}),
 					s && /* @__PURE__ */ t("span", {
-						className: J.suffix,
+						className: Y.suffix,
 						children: s
 					})
 				]
 			}),
 			i ? /* @__PURE__ */ t("span", {
-				className: J.errorText,
+				className: Y.errorText,
 				children: i
 			}) : r ? /* @__PURE__ */ t("span", {
-				className: J.helperText,
+				className: Y.helperText,
 				children: r
 			}) : null
 		]
 	});
 }
-var he = {
+var Se = {
 	menu: "_menu_471l2_1",
 	divider: "_divider_471l2_15"
 };
 //#endregion
 //#region src/components/Menu.tsx
-function ge({ children: e, ...n }) {
+function Ce({ children: e, ...n }) {
 	return /* @__PURE__ */ t("div", {
 		role: "menu",
-		className: he.menu,
+		className: Se.menu,
 		...n,
 		children: e
 	});
 }
-function _e() {
+function we() {
 	return /* @__PURE__ */ t("div", {
-		className: he.divider,
+		className: Se.divider,
 		role: "separator"
 	});
 }
-var Y = {
+var X = {
 	item: "_item_manci_1",
 	icon: "_icon_manci_25",
 	check: "_check_manci_26",
@@ -752,11 +938,11 @@ var Y = {
 };
 //#endregion
 //#region src/components/MenuItem.tsx
-function ve({ icon: e, trailing: r, selected: i, destructive: a, children: o, ...s }) {
+function Te({ icon: e, trailing: r, selected: i, destructive: a, children: o, ...s }) {
 	let c = [
-		Y.item,
-		i && Y.selected,
-		a && Y.destructive
+		X.item,
+		i && X.selected,
+		a && X.destructive
 	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ n("button", {
 		type: "button",
@@ -765,210 +951,287 @@ function ve({ icon: e, trailing: r, selected: i, destructive: a, children: o, ..
 		...s,
 		children: [
 			e && /* @__PURE__ */ t("span", {
-				className: Y.icon,
+				className: X.icon,
 				children: e
 			}),
 			/* @__PURE__ */ t("span", {
-				className: Y.label,
+				className: X.label,
 				children: o
 			}),
 			r && /* @__PURE__ */ t("span", {
-				className: Y.trailing,
+				className: X.trailing,
 				children: r
 			}),
 			i && /* @__PURE__ */ t("span", {
-				className: Y.check,
-				children: /* @__PURE__ */ t(ne, {})
+				className: X.check,
+				children: /* @__PURE__ */ t(ie, {})
 			})
 		]
 	});
 }
-var X = {
-	field: "_field_ynqml_1",
-	trigger: "_trigger_ynqml_7",
-	errorWrap: "_errorWrap_ynqml_25",
-	sm: "_sm_ynqml_34",
-	base: "_base_ynqml_42",
-	icon: "_icon_ynqml_51",
-	value: "_value_ynqml_65",
-	placeholder: "_placeholder_ynqml_73",
-	chevron: "_chevron_ynqml_76",
-	chevronOpen: "_chevronOpen_ynqml_91",
-	menuWrap: "_menuWrap_ynqml_95",
-	menuWrapUp: "_menuWrapUp_ynqml_102",
-	list: "_list_ynqml_106",
-	search: "_search_ynqml_113",
-	noResults: "_noResults_ynqml_131",
-	helperText: "_helperText_ynqml_136",
-	errorText: "_errorText_ynqml_141"
+var Z = {
+	field: "_field_xyp4n_1",
+	fieldInline: "_fieldInline_xyp4n_2",
+	trigger: "_trigger_xyp4n_17",
+	errorWrap: "_errorWrap_xyp4n_41",
+	sm: "_sm_xyp4n_60",
+	base: "_base_xyp4n_68",
+	icon: "_icon_xyp4n_77",
+	value: "_value_xyp4n_91",
+	placeholder: "_placeholder_xyp4n_99",
+	chevron: "_chevron_xyp4n_102",
+	chevronOpen: "_chevronOpen_xyp4n_117",
+	menuWrap: "_menuWrap_xyp4n_121",
+	menuIn: "_menuIn_xyp4n_1",
+	menuWrapAuto: "_menuWrapAuto_xyp4n_131",
+	menuWrapEnd: "_menuWrapEnd_xyp4n_137",
+	menuWrapUp: "_menuWrapUp_xyp4n_142",
+	menuWrapClosing: "_menuWrapClosing_xyp4n_154",
+	menuOut: "_menuOut_xyp4n_1",
+	list: "_list_xyp4n_178",
+	itemIn: "_itemIn_xyp4n_1",
+	highlight: "_highlight_xyp4n_195",
+	highlightInstant: "_highlightInstant_xyp4n_208",
+	pillChevron: "_pillChevron_xyp4n_233",
+	buttonChevron: "_buttonChevron_xyp4n_234",
+	pillTrigger: "_pillTrigger_xyp4n_240",
+	pillIcon: "_pillIcon_xyp4n_276",
+	search: "_search_xyp4n_308",
+	noResults: "_noResults_xyp4n_326",
+	helperText: "_helperText_xyp4n_331",
+	errorText: "_errorText_xyp4n_336"
 };
 //#endregion
 //#region src/components/Dropdown.tsx
-function ye(e) {
+function Ee(e) {
 	return e.searchText === void 0 ? typeof e.label == "string" || typeof e.label == "number" ? String(e.label) : "" : e.searchText;
 }
-function be({ label: e, helperText: r, error: i, size: a = "base", placeholder: o = "Select…", options: s, value: p, onChange: m, disabled: h, searchable: g, searchPlaceholder: _ = "Search…", noResultsText: v = "No matches", defaultOpen: y = !1, autoFocus: b, className: x, labelClassName: ee, "aria-label": C, "data-testid": te }) {
-	let [w, T] = f(y), [E, D] = f(""), [O, k] = f(!1), A = d(null), j = d(null), M = d(null), N = d(null), P = l(), F = l(), I = s.find((e) => e.value === p), ne = E.trim().toLowerCase(), L = g && ne ? s.filter((e) => ye(e).toLowerCase().includes(ne)) : s, R = L.filter((e) => !e.disabled).map((e) => e.value);
-	function z() {
-		T(!1), D("");
+function De({ variant: e = "field", triggerLabel: r, menuAlign: i = "start", label: a, helperText: o, error: s, size: c = "base", placeholder: m = "Select…", options: g, value: _, onChange: v, disabled: y, searchable: b, searchPlaceholder: x = "Search…", noResultsText: S = "No matches", defaultOpen: C = !1, autoFocus: w, className: ee, labelClassName: te, "aria-label": ne, "data-testid": re }) {
+	let [T, E] = p(C), [D, O] = p(C), [ie, k] = p(""), [ae, oe] = p(!1), [j, M] = p(null), N = f(null), P = f(null), F = f(null), se = f(null), I = u(), L = u(), R = g.find((e) => e.value === _), ce = ie.trim().toLowerCase(), z = b && ce ? g.filter((e) => Ee(e).toLowerCase().includes(ce)) : g, B = z.filter((e) => !e.disabled).map((e) => e.value), V = e === "field";
+	function le() {
+		O(!0), E(!0);
 	}
-	c(() => {
-		if (!w) return;
-		if (g) {
-			N.current?.focus();
-			return;
-		}
-		let e = p ?? R[0];
-		(A.current?.querySelector(`[data-value="${e}"]`))?.focus();
-	}, [w]), u(() => {
-		if (!w || !M.current || !A.current) {
-			k(!1);
+	function U() {
+		E(!1), k("");
+	}
+	l(() => {
+		if (!T) return;
+		if (b) {
+			se.current?.focus();
 			return;
 		}
-		let e = A.current.getBoundingClientRect(), t = M.current.getBoundingClientRect().height, n = window.innerHeight - e.bottom, r = e.top;
-		k(n < t + 8 && r > n);
-	}, [w]), c(() => {
-		if (!w) return;
+		let e = _ ?? B[0];
+		(N.current?.querySelector(`[data-value="${e}"]`))?.focus();
+	}, [T]), d(() => {
+		if (!T || !F.current || !N.current) return;
+		let e = N.current.getBoundingClientRect(), t = F.current.offsetHeight, n = window.innerHeight - e.bottom, r = e.top;
+		oe(n < t + 8 && r > n);
+	}, [T]), l(() => {
+		if (!T) return;
 		function e(e) {
-			A.current?.contains(e.target) || z();
+			N.current?.contains(e.target) || U();
 		}
 		function t(e) {
-			e.key === "Escape" && (z(), j.current?.focus());
+			e.key === "Escape" && (U(), P.current?.focus());
 		}
 		return window.addEventListener("pointerdown", e), window.addEventListener("keydown", t), () => {
 			window.removeEventListener("pointerdown", e), window.removeEventListener("keydown", t);
 		};
-	}, [w]);
-	function B(e) {
-		e !== void 0 && A.current?.querySelector(`[data-value="${e}"]`)?.focus();
+	}, [T]);
+	function ue(e) {
+		e !== void 0 && N.current?.querySelector(`[data-value="${e}"]`)?.focus();
 	}
-	function ie(e) {
-		(e.key === "ArrowDown" || e.key === "Enter" || e.key === " ") && (e.preventDefault(), T(!0));
+	function W(e) {
+		(e.key === "ArrowDown" || e.key === "Enter" || e.key === " ") && (e.preventDefault(), le());
 	}
-	function V(e) {
-		e.key === "ArrowDown" && (e.preventDefault(), B(R[0])), e.key === "Enter" && R.length === 1 && (e.preventDefault(), H(R[0]));
+	function de(e) {
+		e.key === "ArrowDown" && (e.preventDefault(), ue(B[0])), e.key === "Enter" && B.length === 1 && (e.preventDefault(), pe(B[0]));
 	}
-	function ae(e, t) {
-		let n = R.indexOf(t);
+	function fe(e, t) {
+		let n = B.indexOf(t);
 		if (n === -1) return;
 		let r = null;
-		if (e.key === "ArrowDown" && (r = (n + 1) % R.length), e.key === "ArrowUp") {
-			if (g && n === 0) {
-				e.preventDefault(), N.current?.focus();
+		if (e.key === "ArrowDown" && (r = (n + 1) % B.length), e.key === "ArrowUp") {
+			if (b && n === 0) {
+				e.preventDefault(), se.current?.focus();
 				return;
 			}
-			r = (n - 1 + R.length) % R.length;
+			r = (n - 1 + B.length) % B.length;
 		}
-		e.key === "Home" && (r = 0), e.key === "End" && (r = R.length - 1), r !== null && (e.preventDefault(), B(R[r]));
+		e.key === "Home" && (r = 0), e.key === "End" && (r = B.length - 1), r !== null && (e.preventDefault(), ue(B[r]));
+	}
+	function G(e) {
+		M((t) => ({
+			top: e.offsetTop,
+			height: e.offsetHeight,
+			instant: !t
+		}));
 	}
-	function H(e) {
-		m(e), z(), j.current?.focus();
+	function pe(e) {
+		v(e), U(), P.current?.focus();
 	}
+	let me = r ?? (R ? R.label : m), K = {
+		"aria-haspopup": "listbox",
+		"aria-expanded": T,
+		"aria-controls": T ? L : void 0,
+		"aria-label": a ? void 0 : ne,
+		autoFocus: w,
+		disabled: y,
+		onClick: () => T ? U() : le(),
+		onKeyDown: W
+	};
 	return /* @__PURE__ */ n("div", {
-		className: [X.field, x].filter(Boolean).join(" "),
-		ref: A,
-		"data-testid": te,
+		className: [V ? Z.field : Z.fieldInline, ee].filter(Boolean).join(" "),
+		ref: N,
+		"data-testid": re,
 		children: [
-			e && /* @__PURE__ */ t(S, {
-				htmlFor: P,
-				className: ee,
-				children: e
+			V && a && /* @__PURE__ */ t(H, {
+				htmlFor: I,
+				className: te,
+				children: a
 			}),
-			/* @__PURE__ */ n("button", {
-				ref: j,
-				id: P,
+			V ? /* @__PURE__ */ n("button", {
+				ref: P,
+				id: I,
 				type: "button",
 				role: "combobox",
-				className: `${X.trigger} ${X[a]} ${i ? X.errorWrap : ""}`,
-				"aria-haspopup": "listbox",
-				"aria-expanded": w,
-				"aria-controls": w ? F : void 0,
-				"aria-label": e ? void 0 : C,
-				autoFocus: b,
-				disabled: h,
-				onClick: () => w ? z() : T(!0),
-				onKeyDown: ie,
+				className: `${Z.trigger} ${Z[c]} ${s ? Z.errorWrap : ""}`,
+				...K,
 				children: [
-					I?.icon && /* @__PURE__ */ t("span", {
-						className: X.icon,
-						children: I.icon
+					R?.icon && /* @__PURE__ */ t("span", {
+						className: Z.icon,
+						children: R.icon
+					}),
+					/* @__PURE__ */ t("span", {
+						className: `${Z.value} ${!R && r === void 0 ? Z.placeholder : ""}`,
+						children: me
 					}),
 					/* @__PURE__ */ t("span", {
-						className: `${X.value} ${I ? "" : X.placeholder}`,
-						children: I ? I.label : o
+						className: `${Z.chevron} ${T ? Z.chevronOpen : ""}`,
+						children: /* @__PURE__ */ t(A, {})
+					})
+				]
+			}) : e === "pill" ? /* @__PURE__ */ n("button", {
+				ref: P,
+				id: I,
+				type: "button",
+				className: Z.pillTrigger,
+				...K,
+				children: [
+					R?.icon && /* @__PURE__ */ t("span", {
+						className: Z.pillIcon,
+						children: R.icon
 					}),
+					me,
 					/* @__PURE__ */ t("span", {
-						className: `${X.chevron} ${w ? X.chevronOpen : ""}`,
-						children: /* @__PURE__ */ t(re, {})
+						className: `${Z.pillChevron} ${T ? Z.chevronOpen : ""}`,
+						children: /* @__PURE__ */ t(A, {})
 					})
 				]
+			}) : /* @__PURE__ */ t(h, {
+				ref: P,
+				id: I,
+				variant: e,
+				size: c,
+				leadingIcon: R?.icon,
+				trailingIcon: /* @__PURE__ */ t("span", {
+					className: `${Z.buttonChevron} ${T ? Z.chevronOpen : ""}`,
+					children: /* @__PURE__ */ t(A, {})
+				}),
+				...K,
+				children: me
 			}),
-			w && /* @__PURE__ */ t("div", {
-				ref: M,
-				className: `${X.menuWrap} ${O ? X.menuWrapUp : ""}`,
-				children: /* @__PURE__ */ n(ge, {
+			D && /* @__PURE__ */ t("div", {
+				ref: F,
+				className: [
+					Z.menuWrap,
+					!V && Z.menuWrapAuto,
+					!V && i === "end" && Z.menuWrapEnd,
+					ae && Z.menuWrapUp,
+					!T && Z.menuWrapClosing
+				].filter(Boolean).join(" "),
+				onAnimationEnd: (e) => {
+					T || e.target !== e.currentTarget || (O(!1), oe(!1));
+				},
+				children: /* @__PURE__ */ n(Ce, {
 					role: "presentation",
-					style: { width: "100%" },
-					children: [g && /* @__PURE__ */ t("input", {
-						ref: N,
+					style: V ? { width: "100%" } : void 0,
+					children: [b && /* @__PURE__ */ t("input", {
+						ref: se,
 						type: "text",
-						className: X.search,
-						value: E,
-						placeholder: _,
-						"aria-label": _,
-						"aria-controls": F,
+						className: Z.search,
+						value: ie,
+						placeholder: x,
+						"aria-label": x,
+						"aria-controls": L,
 						autoComplete: "off",
 						spellCheck: !1,
-						onChange: (e) => D(e.target.value),
-						onKeyDown: V
-					}), /* @__PURE__ */ t("div", {
-						id: F,
+						onChange: (e) => {
+							k(e.target.value), M(null);
+						},
+						onKeyDown: de
+					}), /* @__PURE__ */ n("div", {
+						id: L,
 						role: "listbox",
-						"aria-label": e ?? C,
-						className: X.list,
-						children: L.length === 0 ? /* @__PURE__ */ t("div", {
-							className: X.noResults,
+						"aria-label": a ?? ne,
+						className: Z.list,
+						onMouseLeave: () => M(null),
+						onBlur: (e) => {
+							e.currentTarget.contains(e.relatedTarget) || M(null);
+						},
+						children: [j && z.length > 0 && /* @__PURE__ */ t("span", {
+							"aria-hidden": "true",
+							className: `${Z.highlight} ${j.instant ? Z.highlightInstant : ""}`,
+							style: {
+								transform: `translateY(${j.top}px)`,
+								height: j.height
+							}
+						}), z.length === 0 ? /* @__PURE__ */ t("div", {
+							className: Z.noResults,
 							role: "presentation",
-							children: v
-						}) : L.map((e) => /* @__PURE__ */ t(ve, {
+							children: S
+						}) : z.map((e, n) => /* @__PURE__ */ t(Te, {
+							style: { "--i": Math.min(n, 8) },
 							"data-value": e.value,
 							role: "option",
-							"aria-selected": e.value === p,
+							"aria-selected": e.value === _,
 							icon: e.icon,
-							selected: e.value === p,
+							selected: e.value === _,
 							disabled: e.disabled,
-							onClick: () => H(e.value),
-							onKeyDown: (t) => ae(t, e.value),
+							onClick: () => pe(e.value),
+							onMouseEnter: (t) => !e.disabled && G(t.currentTarget),
+							onFocus: (e) => G(e.currentTarget),
+							onKeyDown: (t) => fe(t, e.value),
 							children: e.label
-						}, e.value))
+						}, e.value))]
 					})]
 				})
 			}),
-			i ? /* @__PURE__ */ t("span", {
-				className: X.errorText,
-				children: i
-			}) : r ? /* @__PURE__ */ t("span", {
-				className: X.helperText,
-				children: r
+			V && s ? /* @__PURE__ */ t("span", {
+				className: Z.errorText,
+				children: s
+			}) : V && o ? /* @__PURE__ */ t("span", {
+				className: Z.helperText,
+				children: o
 			}) : null
 		]
 	});
 }
-var xe = { highlight: "_highlight_1anli_1" };
+var Oe = { highlight: "_highlight_1anli_1" };
 //#endregion
 //#region src/components/HighlightText.tsx
-function Se(e) {
+function ke(e) {
 	return e.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 }
-function Ce({ text: n, query: i }) {
+function Ae({ text: n, query: i }) {
 	if (!i) return /* @__PURE__ */ t(e, { children: n });
-	let a = n.split(RegExp(`(${Se(i)})`, "ig"));
+	let a = n.split(RegExp(`(${ke(i)})`, "ig"));
 	return /* @__PURE__ */ t(e, { children: a.map((e, n) => e.toLowerCase() === i.toLowerCase() ? /* @__PURE__ */ t("mark", {
-		className: xe.highlight,
+		className: Oe.highlight,
 		children: e
 	}, n) : /* @__PURE__ */ t(r, { children: e }, n)) });
 }
-var Z = {
+var Q = {
 	group: "_group_10t2j_1",
 	btn: "_btn_10t2j_4",
 	caret: "_caret_10t2j_29",
@@ -990,24 +1253,24 @@ var Z = {
 };
 //#endregion
 //#region src/components/FilterSection.tsx
-function we({ label: e, options: r, optionLabel: i, activeSet: a, onToggle: o, onSetAll: s, searchable: c }) {
-	let [l, u] = f(""), d = l.trim().toLowerCase(), p = d ? r.filter((e) => i(e).toLowerCase().includes(d)) : r, m = r.length > 0 && a.size === r.length;
+function je({ label: e, options: r, optionLabel: i, activeSet: a, onToggle: o, onSetAll: s, searchable: c }) {
+	let [l, u] = p(""), d = l.trim().toLowerCase(), f = d ? r.filter((e) => i(e).toLowerCase().includes(d)) : r, m = r.length > 0 && a.size === r.length;
 	return /* @__PURE__ */ n("div", { children: [
 		/* @__PURE__ */ n("div", {
-			className: Z.sectionHeader,
+			className: Q.sectionHeader,
 			children: [/* @__PURE__ */ t("div", {
-				className: Z.sectionLabel,
+				className: Q.sectionLabel,
 				children: e
 			}), s && /* @__PURE__ */ t("button", {
 				type: "button",
-				className: Z.allToggle,
+				className: Q.allToggle,
 				onClick: () => s(m ? [] : r),
 				children: m ? "Deselect all" : "Select all"
 			})]
 		}),
 		c && /* @__PURE__ */ t("input", {
 			type: "text",
-			className: Z.search,
+			className: Q.search,
 			placeholder: `Search ${e.toLowerCase()}…`,
 			autoComplete: "off",
 			value: l,
@@ -1015,12 +1278,12 @@ function we({ label: e, options: r, optionLabel: i, activeSet: a, onToggle: o, o
 			onChange: (e) => u(e.target.value)
 		}),
 		/* @__PURE__ */ n("div", {
-			className: Z.optionsList,
-			children: [p.length === 0 && /* @__PURE__ */ t("div", {
-				className: Z.empty,
+			className: Q.optionsList,
+			children: [f.length === 0 && /* @__PURE__ */ t("div", {
+				className: Q.empty,
 				children: "No match"
-			}), p.map((e) => /* @__PURE__ */ t(W, {
-				className: Z.option,
+			}), f.map((e) => /* @__PURE__ */ t(de, {
+				className: Q.option,
 				checked: a.has(e),
 				onChange: () => o(e),
 				label: i(e)
@@ -1028,25 +1291,25 @@ function we({ label: e, options: r, optionLabel: i, activeSet: a, onToggle: o, o
 		})
 	] });
 }
-var Q = {
-	line: "_line_z2201_1",
-	box: "_box_z2201_2",
-	indicator: "_indicator_z2201_9",
-	settling: "_settling_z2201_17",
-	indicatorLine: "_indicatorLine_z2201_21",
-	indicatorBox: "_indicatorBox_z2201_27",
-	tab: "_tab_z2201_35",
-	selected: "_selected_z2201_80",
-	icon: "_icon_z2201_89",
-	iconOnly: "_iconOnly_z2201_103",
-	sm: "_sm_z2201_163"
+var $ = {
+	line: "_line_1c7pz_1",
+	box: "_box_1c7pz_2",
+	indicator: "_indicator_1c7pz_9",
+	settling: "_settling_1c7pz_17",
+	indicatorLine: "_indicatorLine_1c7pz_21",
+	indicatorBox: "_indicatorBox_1c7pz_27",
+	tab: "_tab_1c7pz_35",
+	selected: "_selected_1c7pz_77",
+	icon: "_icon_1c7pz_86",
+	iconOnly: "_iconOnly_1c7pz_100",
+	sm: "_sm_1c7pz_156"
 };
 //#endregion
 //#region src/components/Tabs.tsx
-function Te({ items: e, value: r, onChange: i, variant: a = "line", size: o = "base", ...s }) {
-	let c = e.filter((e) => !e.disabled).map((e) => e.value), l = d(null), p = d(/* @__PURE__ */ new Map()), m = d(r), [h, g] = f(null), [_, v] = f("idle");
-	u(() => {
-		let e = p.current.get(r);
+function Me({ items: e, value: r, onChange: i, variant: a = "line", size: o = "base", ...s }) {
+	let c = e.filter((e) => !e.disabled).map((e) => e.value), l = f(null), u = f(/* @__PURE__ */ new Map()), m = f(r), [h, g] = p(null), [_, v] = p("idle");
+	d(() => {
+		let e = u.current.get(r);
 		e && (g({
 			left: e.offsetLeft,
 			width: e.offsetWidth
@@ -1060,11 +1323,11 @@ function Te({ items: e, value: r, onChange: i, variant: a = "line", size: o = "b
 	function y(e) {
 		e.propertyName === "scale" && (_ === "moving" ? v("settling") : _ === "settling" && v("idle"));
 	}
-	u(() => {
+	d(() => {
 		let e = l.current;
 		if (!e) return;
 		let t = new ResizeObserver(() => {
-			let e = p.current.get(r);
+			let e = u.current.get(r);
 			e && g({
 				left: e.offsetLeft,
 				width: e.offsetWidth
@@ -1081,15 +1344,15 @@ function Te({ items: e, value: r, onChange: i, variant: a = "line", size: o = "b
 	return /* @__PURE__ */ n("div", {
 		ref: l,
 		role: "tablist",
-		className: [Q[a], a === "box" && o === "sm" && Q.sm].filter(Boolean).join(" "),
+		className: [$[a], a === "box" && o === "sm" && $.sm].filter(Boolean).join(" "),
 		onKeyDown: b,
 		...s,
 		children: [h && /* @__PURE__ */ t("span", {
 			"aria-hidden": !0,
 			className: [
-				Q.indicator,
-				a === "line" ? Q.indicatorLine : Q.indicatorBox,
-				_ === "settling" && Q.settling
+				$.indicator,
+				a === "line" ? $.indicatorLine : $.indicatorBox,
+				_ === "settling" && $.settling
 			].filter(Boolean).join(" "),
 			onTransitionEnd: y,
 			style: {
@@ -1101,7 +1364,7 @@ function Te({ items: e, value: r, onChange: i, variant: a = "line", size: o = "b
 			let a = e.value === r, o = !e.label && !!e.icon;
 			return /* @__PURE__ */ n("button", {
 				ref: (t) => {
-					t ? p.current.set(e.value, t) : p.current.delete(e.value);
+					t ? u.current.set(e.value, t) : u.current.delete(e.value);
 				},
 				type: "button",
 				role: "tab",
@@ -1110,34 +1373,34 @@ function Te({ items: e, value: r, onChange: i, variant: a = "line", size: o = "b
 				disabled: e.disabled,
 				tabIndex: a ? 0 : -1,
 				className: [
-					Q.tab,
-					a && Q.selected,
-					o && Q.iconOnly
+					$.tab,
+					a && $.selected,
+					o && $.iconOnly
 				].filter(Boolean).join(" "),
 				onClick: () => !e.disabled && i(e.value),
 				children: [e.icon && /* @__PURE__ */ t("span", {
-					className: Q.icon,
+					className: $.icon,
 					children: e.icon
 				}), e.label]
 			}, e.value);
 		})]
 	});
 }
-var Ee = {
+var Ne = {
 	root: "_root_17koe_1",
 	label: "_label_17koe_7"
 };
 //#endregion
 //#region src/components/Toggle.tsx
-function De({ items: e, value: r, onChange: i, label: a, "aria-label": o }) {
-	let s = l();
+function Pe({ items: e, value: r, onChange: i, label: a, "aria-label": o }) {
+	let s = u();
 	return /* @__PURE__ */ n("div", {
-		className: Ee.root,
+		className: Ne.root,
 		children: [a && /* @__PURE__ */ t("span", {
 			id: s,
-			className: Ee.label,
+			className: Ne.label,
 			children: a
-		}), /* @__PURE__ */ t(Te, {
+		}), /* @__PURE__ */ t(Me, {
 			items: e,
 			value: r,
 			onChange: i,
@@ -1148,21 +1411,21 @@ function De({ items: e, value: r, onChange: i, label: a, "aria-label": o }) {
 		})]
 	});
 }
-var $ = {
-	spinner: "_spinner_1lfif_1",
-	inner: "_inner_1lfif_7",
-	outer: "_outer_1lfif_8",
-	spin: "_spin_1lfif_1",
-	spinReverse: "_spinReverse_1lfif_1",
-	default: "_default_1lfif_24",
-	subtle: "_subtle_1lfif_31"
+var Fe = {
+	spinner: "_spinner_9jjxr_3",
+	inner: "_inner_9jjxr_11",
+	outer: "_outer_9jjxr_12",
+	spin: "_spin_9jjxr_3",
+	spinReverse: "_spinReverse_9jjxr_1",
+	default: "_default_9jjxr_28",
+	subtle: "_subtle_9jjxr_35"
 };
 //#endregion
 //#region src/components/Spinner.tsx
-function Oe({ variant: e = "default", size: r = 64, label: i = "Loading", className: a, "data-testid": o }) {
+function Ie({ variant: e = "default", size: r = 64, label: i = "Loading", className: a, "data-testid": o }) {
 	let s = [
-		$.spinner,
-		$[e],
+		Fe.spinner,
+		Fe[e],
 		a
 	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ n("div", {
@@ -1175,7 +1438,7 @@ function Oe({ variant: e = "default", size: r = 64, label: i = "Loading", classN
 		},
 		"data-testid": o,
 		children: [/* @__PURE__ */ t("svg", {
-			className: $.inner,
+			className: Fe.inner,
 			width: r,
 			height: r,
 			viewBox: "0 0 64 64",
@@ -1183,7 +1446,7 @@ function Oe({ variant: e = "default", size: r = 64, label: i = "Loading", classN
 			"aria-hidden": "true",
 			children: /* @__PURE__ */ t("path", { d: "M45.4273 17.5099C45.5053 17.5796 45.5088 17.6535 45.4377 17.7316L38.8829 24.8071C38.8634 24.828 38.8365 24.8404 38.8079 24.8416C38.7793 24.8428 38.7514 24.8326 38.7303 24.8134C36.6569 22.9045 34.221 22.0275 31.4225 22.1823C29.9153 22.2659 28.5572 22.6333 27.3483 23.2845C25.0295 24.5352 23.4428 26.4155 22.588 28.9253C20.717 34.4308 24.3708 40.1612 29.8184 41.6584C30.8097 41.9302 31.99 41.9735 33.3593 41.788C35.158 41.5433 36.8709 40.5854 38.3412 39.5627C38.4022 39.5203 38.4764 39.5014 38.5502 39.5094C38.6241 39.5175 38.6925 39.552 38.7428 39.6066L45.1742 46.6069C45.1803 46.6137 45.185 46.6217 45.188 46.6303C45.191 46.639 45.1923 46.6482 45.1917 46.6573C45.1911 46.6665 45.1887 46.6754 45.1846 46.6836C45.1805 46.6918 45.1748 46.6992 45.1679 46.7052C44.4401 47.3033 43.6502 47.8855 42.7982 48.4516C39.8799 50.3897 36.6339 51.4633 33.0602 51.6725C29.3847 51.8872 25.9031 51.1106 22.6152 49.3425C19.7917 47.8227 17.4903 45.764 15.7112 43.1663C14.4132 41.2707 13.4349 39.3097 12.8667 37.0717C11.973 33.5775 11.9925 30.1014 12.9253 26.6435C13.1679 25.7483 13.5465 24.8469 13.8414 23.9412C14.6703 21.4035 16.9915 18.887 18.9133 17.1899C26.3467 10.6186 38.1184 10.8908 45.4273 17.5099Z" })
 		}), /* @__PURE__ */ t("svg", {
-			className: $.outer,
+			className: Fe.outer,
 			width: r,
 			height: r,
 			viewBox: "0 0 64 64",
@@ -1195,15 +1458,15 @@ function Oe({ variant: e = "default", size: r = 64, label: i = "Loading", classN
 }
 //#endregion
 //#region src/utils/format.ts
-function ke(e) {
+function Le(e) {
 	let t = Math.floor(e / 60), n = e % 60;
 	return `${t}h:${String(n).padStart(2, "0")}m`;
 }
-function Ae(e, t) {
+function Re(e, t) {
 	let n = Math.floor(e / 60), r = e % 60, i = (e) => String(e).padStart(2, "0");
 	return `${i(n)}:${i(r)}:${i(t)}`;
 }
 //#endregion
-export { m as Button, g as Card, W as Checkbox, se as CheckboxGroup, pe as DateField, be as Dropdown, S as FieldLabel, we as FilterSection, Ce as HighlightText, ge as Menu, _e as MenuDivider, ve as MenuItem, me as NumberField, fe as PasswordField, ce as RadioButton, le as RadioGroup, Oe as Spinner, ue as Switch, Te as Tabs, v as Tag, ee as TagGroup, de as TextField, De as Toggle, oe as Toolbar, ke as formatDuration, Ae as formatDurationHMS };
+export { h as Button, _ as Card, de as Checkbox, fe as CheckboxGroup, be as DateField, De as Dropdown, H as FieldLabel, je as FilterSection, Ae as HighlightText, Ce as Menu, we as MenuDivider, Te as MenuItem, xe as NumberField, ye as PasswordField, pe as RadioButton, me as RadioGroup, Ie as Spinner, he as Switch, Me as Tabs, ce as Tag, le as TagGroup, ve as TextArea, ge as TextField, Pe as Toggle, ue as Toolbar, Le as formatDuration, Re as formatDurationHMS };
 
 //# sourceMappingURL=index.js.map