haze-ui 1.32.0 → 1.34.0

package/dist/components/Alert/index.js

@@ -1,3 +1,4 @@
 "use client";
-import e from "./Alert.js";
-export { e as Alert };
+import { colors as e } from "./alert-styles.js";
+import t from "./Alert.js";
+export { t as Alert, e as alertVariants };

package/dist/components/ApprovalCard/ApprovalCard.js

@@ -3,52 +3,79 @@
 import { classnames as e } from "../../utils/classnames.js";
 import { useStrings as t } from "../LocaleProvider/useStrings.js";
 /* empty css                       */
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { c as n } from "react/compiler-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/lib/components/ApprovalCard/ApprovalCard.tsx
-var i = "haze-ApprovalCard__card", a = "haze-ApprovalCard__header", o = "haze-ApprovalCard__body", s = "haze-ApprovalCard__desc", c = "haze-ApprovalCard__content", l = "haze-ApprovalCard__actions", u = "haze-ApprovalCard__btn", d = "haze-ApprovalCard__denyBtn", f = "haze-ApprovalCard__approveBtn";
-function p({ title: p, description: m, onApprove: h, onDeny: g, approveText: _, denyText: v, children: y, className: b }) {
-	let x = t("approvalCard"), S = p ?? x.title, C = _ ?? x.approve, w = v ?? x.deny;
-	return /* @__PURE__ */ r("div", {
+var a = "haze-ApprovalCard__card", o = "haze-ApprovalCard__header", s = "haze-ApprovalCard__body", c = "haze-ApprovalCard__desc", l = "haze-ApprovalCard__content", u = "haze-ApprovalCard__actions", d = "haze-ApprovalCard__btn", f = "haze-ApprovalCard__denyBtn", p = "haze-ApprovalCard__approveBtn";
+function m(m) {
+	let h = n(30), { title: g, description: _, onApprove: v, onDeny: y, approveText: b, denyText: x, children: S, className: C } = m, w = t("approvalCard"), T = g ?? w.title, E = b ?? w.approve, D = x ?? w.deny, O;
+	h[0] === C ? O = h[1] : (O = [a, C], h[0] = C, h[1] = O);
+	let k;
+	h[2] === Symbol.for("react.memo_cache_sentinel") ? (k = [o], h[2] = k) : k = h[2];
+	let A;
+	h[3] === T ? A = h[4] : (A = /* @__PURE__ */ r("div", {
+		"data-slot": "title",
+		className: e(k),
+		children: T
+	}), h[3] = T, h[4] = A);
+	let j;
+	h[5] === Symbol.for("react.memo_cache_sentinel") ? (j = [s], h[5] = j) : j = h[5];
+	let M;
+	h[6] === _ ? M = h[7] : (M = _ && /* @__PURE__ */ r("div", {
+		"data-slot": "description",
+		className: e([c]),
+		children: _
+	}), h[6] = _, h[7] = M);
+	let N;
+	h[8] === S ? N = h[9] : (N = S && /* @__PURE__ */ r("div", {
+		"data-slot": "content",
+		className: e([l]),
+		children: S
+	}), h[8] = S, h[9] = N);
+	let P;
+	h[10] !== M || h[11] !== N ? (P = /* @__PURE__ */ i("div", {
+		"data-slot": "body",
+		className: e(j),
+		children: [M, N]
+	}), h[10] = M, h[11] = N, h[12] = P) : P = h[12];
+	let F;
+	h[13] === Symbol.for("react.memo_cache_sentinel") ? (F = [u], h[13] = F) : F = h[13];
+	let I;
+	h[14] === Symbol.for("react.memo_cache_sentinel") ? (I = [d, f], h[14] = I) : I = h[14];
+	let L;
+	h[15] !== D || h[16] !== y ? (L = /* @__PURE__ */ r("button", {
+		"data-slot": "deny-button",
+		type: "button",
+		onClick: y,
+		className: e(I),
+		children: D
+	}), h[15] = D, h[16] = y, h[17] = L) : L = h[17];
+	let R;
+	h[18] === Symbol.for("react.memo_cache_sentinel") ? (R = [d, p], h[18] = R) : R = h[18];
+	let z;
+	h[19] !== E || h[20] !== v ? (z = /* @__PURE__ */ r("button", {
+		"data-slot": "approve-button",
+		type: "button",
+		onClick: v,
+		className: e(R),
+		children: E
+	}), h[19] = E, h[20] = v, h[21] = z) : z = h[21];
+	let B;
+	h[22] !== L || h[23] !== z ? (B = /* @__PURE__ */ i("div", {
+		"data-slot": "actions",
+		className: e(F),
+		children: [L, z]
+	}), h[22] = L, h[23] = z, h[24] = B) : B = h[24];
+	let V;
+	return h[25] !== O || h[26] !== B || h[27] !== A || h[28] !== P ? (V = /* @__PURE__ */ i("div", {
 		"data-slot": "approval-card",
-		className: e([i, b]),
+		className: e(O),
 		children: [
-			/* @__PURE__ */ n("div", {
-				"data-slot": "title",
-				className: e([a]),
-				children: S
-			}),
-			/* @__PURE__ */ r("div", {
-				"data-slot": "body",
-				className: e([o]),
-				children: [m && /* @__PURE__ */ n("div", {
-					"data-slot": "description",
-					className: e([s]),
-					children: m
-				}), y && /* @__PURE__ */ n("div", {
-					"data-slot": "content",
-					className: e([c]),
-					children: y
-				})]
-			}),
-			/* @__PURE__ */ r("div", {
-				"data-slot": "actions",
-				className: e([l]),
-				children: [/* @__PURE__ */ n("button", {
-					"data-slot": "deny-button",
-					type: "button",
-					onClick: g,
-					className: e([u, d]),
-					children: w
-				}), /* @__PURE__ */ n("button", {
-					"data-slot": "approve-button",
-					type: "button",
-					onClick: h,
-					className: e([u, f]),
-					children: C
-				})]
-			})
+			A,
+			P,
+			B
 		]
-	});
+	}), h[25] = O, h[26] = B, h[27] = A, h[28] = P, h[29] = V) : V = h[29], V;
 }
 //#endregion
-export { p as default };
+export { m as default };

package/dist/components/Avatar/Avatar.js

@@ -10,21 +10,22 @@ var r = "haze-Avatar__base", i = {
 	md: "haze-Avatar__md",
 	lg: "haze-Avatar__lg"
 }, a = "haze-Avatar__imgStyle";
-function o({ src: o, alt: s, size: c = "md", fallback: l, className: u }) {
-	let [d, f] = t(!1);
+function o({ src: o, alt: s, size: c = "md", fallback: l, className: u, ref: d }) {
+	let [f, p] = t(!1);
 	return /* @__PURE__ */ n("span", {
+		ref: d,
 		"data-slot": "avatar",
 		className: e([
 			r,
 			i[c],
 			u
 		]),
-		children: o && !d ? /* @__PURE__ */ n("img", {
+		children: o && !f ? /* @__PURE__ */ n("img", {
 			"data-slot": "img",
 			className: a,
 			src: o,
 			alt: s ?? "",
-			onError: () => f(!0)
+			onError: () => p(!0)
 		}) : l ?? /* @__PURE__ */ n("span", {
 			"data-slot": "img",
 			children: s?.charAt(0).toUpperCase() ?? "?"

package/dist/components/AvatarGroup/AvatarGroup.js

@@ -1,33 +1,30 @@
 
-"use client";
 import { classnames as e } from "../../utils/classnames.js";
-import { formatString as t } from "../LocaleProvider/locale.js";
-import { useStrings as n } from "../LocaleProvider/useStrings.js";
 /* empty css                      */
-import { Children as r } from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Children as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/lib/components/AvatarGroup/AvatarGroup.tsx
-var o = "haze-AvatarGroup__base", s = "haze-AvatarGroup__item", c = "haze-AvatarGroup__itemStacked", l = "haze-AvatarGroup__overflowChip";
-function u({ max: u, total: d, className: f, children: p, ...m }) {
-	let h = n("avatarGroup"), g = r.toArray(p), _ = u === void 0 ? g.length : Math.max(u, 0), v = g.length > _, y = v ? g.slice(0, _) : g, b = d ?? g.length - _;
-	return /* @__PURE__ */ a("div", {
+var i = "haze-AvatarGroup__base", a = "haze-AvatarGroup__item", o = "haze-AvatarGroup__itemStacked", s = "haze-AvatarGroup__overflowChip";
+function c({ max: c, total: l, overflowLabel: u = (e) => `+${e}`, className: d, children: f, ...p }) {
+	let m = t.toArray(f), h = c === void 0 ? m.length : Math.max(c, 0), g = m.length > h, _ = g ? m.slice(0, h) : m, v = l ?? m.length - h;
+	return /* @__PURE__ */ r("div", {
 		"data-slot": "avatar-group",
-		...m,
-		className: e([o, f]),
-		children: [y.map((t, n) => /* @__PURE__ */ i("span", {
+		...p,
+		className: e([i, d]),
+		children: [_.map((t, r) => /* @__PURE__ */ n("span", {
 			"data-slot": "item",
-			className: e([s, n > 0 && c]),
+			className: e([a, r > 0 && o]),
 			children: t
-		}, n)), v && /* @__PURE__ */ i("span", {
+		}, r)), g && /* @__PURE__ */ n("span", {
 			"data-slot": "overflow-badge",
 			className: e([
+				a,
 				s,
-				l,
-				y.length > 0 && c
+				_.length > 0 && o
 			]),
-			children: t(h.more, { count: b })
+			children: u(v)
 		})]
 	});
 }
 //#endregion
-export { u as default };
+export { c as default };

package/dist/components/AvatarGroup/index.js

@@ -1,3 +1,2 @@
-"use client";
 import e from "./AvatarGroup.js";
 export { e as AvatarGroup };

package/dist/components/Badge/Badge.js

@@ -1,15 +1,16 @@
 import { classnames as e } from "../../utils/classnames.js";
-import { base as t, sizes as n, variants as r } from "./badge-styles.js";
+import { base as t, colors as n, sizes as r } from "./badge-styles.js";
 import { jsx as i } from "react/jsx-runtime";
 //#region src/lib/components/Badge/Badge.tsx
-function a({ variant: a = "default", size: o = "md", className: s, style: c, children: l }) {
+function a({ color: a = "default", size: o = "md", className: s, style: c, children: l, ref: u }) {
 	return /* @__PURE__ */ i("span", {
+		ref: u,
 		"data-slot": "badge",
 		style: c,
 		className: e([
 			t,
-			r[a],
-			n[o],
+			n[a],
+			r[o],
 			s
 		]),
 		children: l

package/dist/components/Badge/badge-styles.js

@@ -3,6 +3,7 @@
 //#region src/lib/components/Badge/badge-styles.ts
 var e = "haze-badge-styles__base", t = {
 	default: "haze-badge-styles__default",
+	primary: "haze-badge-styles__primary",
 	success: "haze-badge-styles__success",
 	warning: "haze-badge-styles__warning",
 	danger: "haze-badge-styles__danger",
@@ -12,4 +13,4 @@ var e = "haze-badge-styles__base", t = {
 	md: "haze-badge-styles__md"
 };
 //#endregion
-export { e as base, n as sizes, t as variants };
+export { e as base, t as colors, n as sizes };

package/dist/components/Badge/index.js

@@ -1,3 +1,3 @@
-import { sizes as e, variants as t } from "./badge-styles.js";
+import { colors as e, sizes as t } from "./badge-styles.js";
 import n from "./Badge.js";
-export { n as Badge, e as badgeSizes, t as badgeVariants };
+export { n as Badge, t as badgeSizes, e as badgeVariants };

package/dist/components/Banner/Banner.js

@@ -1,42 +1,36 @@
-
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { useStrings as t } from "../LocaleProvider/useStrings.js";
-/* empty css                 */
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { useControl as i } from "react-use-control";
+import { banner as n, colors as r, content as i } from "./banner-styles.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { useControl as s } from "react-use-control";
 //#region src/lib/components/Banner/Banner.tsx
-var a = "haze-Banner__banner", o = {
-	info: "haze-Banner__info",
-	success: "haze-Banner__success",
-	warning: "haze-Banner__warning",
-	danger: "haze-Banner__danger"
-}, s = "haze-Banner__closeBtn", c = "haze-Banner__content";
-function l({ visible: l, onClose: u, variant: d = "info", children: f, className: p }) {
-	let [m, h] = i(l, !0), g = t("banner");
-	return m ? /* @__PURE__ */ r("div", {
+function c({ visible: c, onClose: l, color: u = "info", children: d, className: f, ref: p }) {
+	let [m, h] = s(c, !0), g = t("banner");
+	return m ? /* @__PURE__ */ o("div", {
+		ref: p,
 		"data-slot": "banner",
 		role: "alert",
 		className: e([
-			a,
-			o[d],
-			p
+			n,
+			r[u],
+			f
 		]),
-		children: [/* @__PURE__ */ n("div", {
+		children: [/* @__PURE__ */ a("div", {
 			"data-slot": "content",
-			className: e([c]),
-			children: f
-		}), u && /* @__PURE__ */ n("button", {
+			className: e([i]),
+			children: d
+		}), l && /* @__PURE__ */ a("button", {
 			"data-slot": "close",
 			type: "button",
 			onClick: () => {
-				h(!1), u?.();
+				h(!1), l?.();
 			},
 			"aria-label": g.close,
-			className: e([s]),
+			className: e(["haze-banner-styles__closeBtn"]),
 			children: "x"
 		})]
 	}) : null;
 }
 //#endregion
-export { l as default };
+export { c as default };

package/dist/components/Banner/banner-styles.js

@@ -0,0 +1,14 @@
+
+"use client";
+/* empty css                        */
+//#region src/lib/components/Banner/banner-styles.ts
+var e = "haze-banner-styles__banner", t = {
+	default: "haze-banner-styles__default",
+	primary: "haze-banner-styles__primary",
+	info: "haze-banner-styles__info",
+	success: "haze-banner-styles__success",
+	warning: "haze-banner-styles__warning",
+	danger: "haze-banner-styles__danger"
+}, n = "haze-banner-styles__closeBtn", r = "haze-banner-styles__content";
+//#endregion
+export { e as banner, n as closeBtn, t as colors, r as content };

package/dist/components/Banner/index.js

@@ -1,3 +1,4 @@
 "use client";
-import e from "./Banner.js";
-export { e as Banner };
+import { colors as e } from "./banner-styles.js";
+import t from "./Banner.js";
+export { t as Banner, e as bannerVariants };

package/dist/components/Breadcrumb/Breadcrumb.js

@@ -1,33 +1,32 @@
 
-"use client";
 import { classnames as e } from "../../utils/classnames.js";
-import { useStrings as t } from "../LocaleProvider/useStrings.js";
 /* empty css                     */
-import { Children as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { Children as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/lib/components/Breadcrumb/Breadcrumb.tsx
-var a = "haze-Breadcrumb__nav", o = "haze-Breadcrumb__list", s = "haze-Breadcrumb__sep";
-function c({ separator: c = "/", className: l, children: u }) {
-	let d = t("breadcrumb"), f = n.toArray(u);
-	return /* @__PURE__ */ r("nav", {
+var i = "haze-Breadcrumb__nav", a = "haze-Breadcrumb__list", o = "haze-Breadcrumb__sep";
+function s({ separator: s = "/", "aria-label": c = "Breadcrumb", className: l, children: u, ...d }) {
+	let f = t.toArray(u);
+	return /* @__PURE__ */ n("nav", {
 		"data-slot": "breadcrumb",
-		"aria-label": d.label,
-		className: e([a, l]),
-		children: r("ol", {
+		"aria-label": c,
+		...d,
+		className: e([i, l]),
+		children: n("ol", {
 			"data-slot": "list",
-			className: o,
-			children: f.map((e, t) => /* @__PURE__ */ i("li", {
+			className: a,
+			children: f.map((e, t) => /* @__PURE__ */ r("li", {
 				"data-slot": "item",
 				"aria-current": t === f.length - 1 ? "page" : void 0,
-				children: [e, t < f.length - 1 && /* @__PURE__ */ r("span", {
+				children: [e, t < f.length - 1 && /* @__PURE__ */ n("span", {
 					"data-slot": "separator",
-					className: s,
+					className: o,
 					"aria-hidden": "true",
-					children: c
+					children: s
 				})]
 			}, t))
 		})
 	});
 }
 //#endregion
-export { c as default };
+export { s as default };

package/dist/components/Breadcrumb/BreadcrumbItem.js

@@ -1,20 +1,17 @@
 
-"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                         */
 import { jsx as t } from "react/jsx-runtime";
 //#region src/lib/components/Breadcrumb/BreadcrumbItem.tsx
 var n = "haze-BreadcrumbItem__link", r = "haze-BreadcrumbItem__current";
-function i({ href: i, className: a, children: o }) {
-	return i ? /* @__PURE__ */ t("a", {
+function i({ href: i, as: a, className: o, children: s, ...c }) {
+	let l = a ?? (i === void 0 ? "span" : "a"), u = a !== void 0 || i !== void 0;
+	return /* @__PURE__ */ t(l, {
+		...i === void 0 ? {} : { href: i },
 		"data-slot": "breadcrumb-item",
-		href: i,
-		className: e([n, a]),
-		children: o
-	}) : /* @__PURE__ */ t("span", {
-		"data-slot": "breadcrumb-item",
-		className: e([r, a]),
-		children: o
+		...c,
+		className: e([u ? n : r, o]),
+		children: s
 	});
 }
 //#endregion

package/dist/components/Breadcrumb/index.js

@@ -1,4 +1,3 @@
-"use client";
 import e from "./Breadcrumb.js";
 import t from "./BreadcrumbItem.js";
 export { e as Breadcrumb, t as BreadcrumbItem };

package/dist/components/Button/ButtonLink.js

@@ -1,17 +1,19 @@
 "use client";
 import { useConfigDefaults as e } from "../ConfigProvider/useConfigDefaults.js";
 import t from "./Button.js";
-import { forwardRef as n } from "react";
+import { c as n } from "react/compiler-runtime";
 import { jsx as r } from "react/jsx-runtime";
 //#region src/lib/components/Button/ButtonLink.tsx
-var i = n(function({ size: n, ...i }, a) {
-	let o = e("ButtonLink"), s = n ?? o.size;
-	return /* @__PURE__ */ r(t, {
+function i(i) {
+	let a = n(8), o, s, c;
+	a[0] === i ? (o = a[1], s = a[2], c = a[3]) : ({size: c, ref: s, ...o} = i, a[0] = i, a[1] = o, a[2] = s, a[3] = c);
+	let l = e("ButtonLink"), u = c ?? l.size, d;
+	return a[4] !== o || a[5] !== s || a[6] !== u ? (d = /* @__PURE__ */ r(t, {
 		as: "a",
-		ref: a,
-		size: s,
-		...i
-	});
-});
+		ref: s,
+		size: u,
+		...o
+	}), a[4] = o, a[5] = s, a[6] = u, a[7] = d) : d = a[7], d;
+}
 //#endregion
 export { i as default };

package/dist/components/ButtonGroup/ButtonGroup.js

@@ -0,0 +1,48 @@
+"use client";
+import { classnames as e } from "../../utils/classnames.js";
+import { ButtonGroupProvider as t } from "./ButtonGroupContext.js";
+import { group as n } from "./button-group-styles.js";
+import r from "./ButtonGroupSeparator.js";
+import { Children as i, cloneElement as a, isValidElement as o } from "react";
+import { jsx as s } from "react/jsx-runtime";
+//#region src/lib/components/ButtonGroup/ButtonGroup.tsx
+function c(e, t) {
+	return i.map(e, (e) => {
+		if (!o(e) || e.type === r) return e;
+		let n = e.props;
+		if (n.size !== void 0 && n.variant !== void 0 && !(t.disabled && n.disabled === void 0)) return e;
+		let i = {};
+		return n.size === void 0 && (i.size = t.size), n.variant === void 0 && (i.variant = t.variant), t.disabled && n.disabled === void 0 && (i.disabled = !0), a(e, i);
+	});
+}
+function l({ size: r = "md", variant: i = "solid", orientation: a = "horizontal", disabled: o = !1, classNames: l, className: u, children: d, ref: f, ...p }) {
+	let m = {
+		size: r,
+		variant: i,
+		disabled: o,
+		orientation: a,
+		separatorClass: l?.separator
+	};
+	return /* @__PURE__ */ s(t, {
+		value: m,
+		children: /* @__PURE__ */ s("div", {
+			ref: f,
+			"data-slot": "button-group",
+			"data-orientation": a,
+			role: "group",
+			...p,
+			className: e([
+				n,
+				u,
+				l?.root
+			]),
+			children: c(d, {
+				size: r,
+				variant: i,
+				disabled: o
+			})
+		})
+	});
+}
+//#endregion
+export { l as default };

package/dist/components/ButtonGroup/ButtonGroupContext.js

@@ -0,0 +1,9 @@
+"use client";
+import { createContext as e, useContext as t } from "react";
+//#region src/lib/components/ButtonGroup/ButtonGroupContext.ts
+var n = e(void 0), r = n.Provider;
+function i() {
+	return t(n);
+}
+//#endregion
+export { n as ButtonGroupContext, r as ButtonGroupProvider, i as useButtonGroup };

package/dist/components/ButtonGroup/ButtonGroupSeparator.js

@@ -0,0 +1,30 @@
+"use client";
+import { classnames as e } from "../../utils/classnames.js";
+import { useButtonGroup as t } from "./ButtonGroupContext.js";
+import { separatorBase as n, separatorIcon as r, separatorRule as i, separatorRuleHorizontal as a } from "./button-group-styles.js";
+import { c as o } from "react/compiler-runtime";
+import { jsx as s } from "react/jsx-runtime";
+//#region src/lib/components/ButtonGroup/ButtonGroupSeparator.tsx
+function c(c) {
+	let l = o(14), u, d, f;
+	l[0] === c ? (u = l[1], d = l[2], f = l[3]) : ({children: u, className: d, ...f} = c, l[0] = c, l[1] = u, l[2] = d, l[3] = f);
+	let p = t(), m = p?.variant === "solid", h = p?.orientation === "vertical", g = h ? "horizontal" : "vertical", _ = u ? r : h ? a : i, v = m && (u ? "haze-button-group-styles__separatorIconInverse" : "haze-button-group-styles__separatorInverse"), y = p?.separatorClass, b;
+	l[4] !== d || l[5] !== _ || l[6] !== v || l[7] !== y ? (b = [
+		n,
+		_,
+		v,
+		y,
+		d
+	], l[4] = d, l[5] = _, l[6] = v, l[7] = y, l[8] = b) : b = l[8];
+	let x;
+	return l[9] !== u || l[10] !== f || l[11] !== g || l[12] !== b ? (x = /* @__PURE__ */ s("span", {
+		"data-slot": "separator",
+		role: "separator",
+		"aria-orientation": g,
+		...f,
+		className: e(b),
+		children: u
+	}), l[9] = u, l[10] = f, l[11] = g, l[12] = b, l[13] = x) : x = l[13], x;
+}
+//#endregion
+export { c as default };

package/dist/components/ButtonGroup/button-group-styles.js

@@ -0,0 +1,7 @@
+
+"use client";
+/* empty css                              */
+//#region src/lib/components/ButtonGroup/button-group-styles.ts
+var e = "haze-button-group-styles__group", t = "haze-button-group-styles__separatorBase", n = "haze-button-group-styles__separatorRule", r = "haze-button-group-styles__separatorRuleHorizontal", i = "haze-button-group-styles__separatorIcon", a = "haze-button-group-styles__separatorInverse", o = "haze-button-group-styles__separatorIconInverse";
+//#endregion
+export { e as group, t as separatorBase, i as separatorIcon, o as separatorIconInverse, a as separatorInverse, n as separatorRule, r as separatorRuleHorizontal };

package/dist/components/ButtonGroup/index.js

@@ -0,0 +1,5 @@
+"use client";
+import { useButtonGroup as e } from "./ButtonGroupContext.js";
+import t from "./ButtonGroupSeparator.js";
+import n from "./ButtonGroup.js";
+export { n as ButtonGroup, t as ButtonGroupSeparator, e as useButtonGroup };