haze-ui 1.32.0 → 1.34.0

package/dist/components/DropdownMenu/DropdownMenuCheckboxItem.js

@@ -2,40 +2,42 @@
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { dropdownMenuItemIndicator as t } from "./dropdown-menu-item-styles.js";
+import { useDropdownMenuContext as n } from "./DropdownMenuContext.js";
 /* empty css                                   */
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { useControl as i } from "react-use-control";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { useControl as a } from "react-use-control";
 //#region src/lib/components/DropdownMenu/DropdownMenuCheckboxItem.tsx
-var a = "haze-DropdownMenuCheckboxItem__item";
-function o({ checked: o, onCheckedChange: s, disabled: c = !1, danger: l = !1, icon: u, kbdLabel: d, className: f, children: p }) {
-	let [m, h] = i(o, !1);
-	return /* @__PURE__ */ r("button", {
+var o = "haze-DropdownMenuCheckboxItem__item";
+function s({ checked: s, onCheckedChange: c, disabled: l = !1, danger: u = !1, icon: d, kbdLabel: f, className: p, children: m }) {
+	let h = n().classNames, [g, _] = a(s, !1);
+	return /* @__PURE__ */ i("button", {
 		"data-slot": "menu-checkbox-item",
 		type: "button",
 		role: "menuitemcheckbox",
-		"aria-checked": m,
+		"aria-checked": g,
 		tabIndex: -1,
-		disabled: c,
+		disabled: l,
 		onClick: () => {
-			let e = !m;
-			h(e), s?.(e);
+			let e = !g;
+			_(e), c?.(e);
 		},
 		className: e([
-			a,
-			l && "haze-dropdown-menu-item-styles__dropdownMenuItemDanger",
-			f
+			o,
+			u && "haze-dropdown-menu-item-styles__dropdownMenuItemDanger",
+			h?.checkboxItem,
+			p
 		]),
 		children: [
-			/* @__PURE__ */ n("span", {
+			/* @__PURE__ */ r("span", {
 				"data-slot": "indicator",
 				"aria-hidden": "true",
 				className: e(t),
-				children: m && /* @__PURE__ */ n("svg", {
+				children: g && /* @__PURE__ */ r("svg", {
 					width: "1em",
 					height: "1em",
 					viewBox: "0 0 16 16",
 					fill: "none",
-					children: /* @__PURE__ */ n("path", {
+					children: /* @__PURE__ */ r("path", {
 						d: "M3.5 8.5 6.5 11.5 12.5 4.5",
 						stroke: "currentColor",
 						strokeWidth: "2",
@@ -44,20 +46,20 @@ function o({ checked: o, onCheckedChange: s, disabled: c = !1, danger: l = !1, i
 					})
 				})
 			}),
-			u !== void 0 && /* @__PURE__ */ n("span", {
+			d !== void 0 && /* @__PURE__ */ r("span", {
 				"data-slot": "icon",
 				className: e("haze-dropdown-menu-item-styles__dropdownMenuItemIcon"),
-				children: u
+				children: d
 			}),
-			p,
-			d !== void 0 && /* @__PURE__ */ n("span", {
+			m,
+			f !== void 0 && /* @__PURE__ */ r("span", {
 				"data-slot": "kbd",
 				"aria-hidden": "true",
 				className: e("haze-dropdown-menu-item-styles__dropdownMenuItemKbd"),
-				children: d
+				children: f
 			})
 		]
 	});
 }
 //#endregion
-export { o as default };
+export { s as default };

package/dist/components/DropdownMenu/DropdownMenuContent.js

@@ -13,11 +13,11 @@ var c = "haze-DropdownMenuContent__content", l = {
 	end: "bottom-end"
 };
 function u({ children: u, align: d = "start", className: f }) {
-	let { open: p, setOpen: m, triggerRef: h, contentRef: g, contentId: _, focusRequestRef: v, floating: y } = i(), b = a(() => {
+	let { open: p, setOpen: m, triggerRef: h, contentRef: g, contentId: _, focusRequestRef: v, floating: y, classNames: b } = i(), x = a(() => {
 		m(!1), h.current?.focus();
-	}, [m, h]), x = n({
+	}, [m, h]), S = n({
 		menuRef: g,
-		onClose: b
+		onClose: x
 	});
 	return r({
 		menuRef: g,
@@ -40,8 +40,8 @@ function u({ children: u, align: d = "start", className: f }) {
 		id: _,
 		role: "menu",
 		visualClass: c,
-		className: f,
-		onKeyDown: x,
+		className: [f, b?.content].filter(Boolean).join(" ") || void 0,
+		onKeyDown: S,
 		children: u
 	});
 }

package/dist/components/DropdownMenu/DropdownMenuGroup.js

@@ -2,25 +2,35 @@
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { dropdownMenuGroupLabel as t } from "./dropdown-menu-item-styles.js";
+import { useDropdownMenuContext as n } from "./DropdownMenuContext.js";
 /* empty css                            */
-import { useId as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { c as r } from "react/compiler-runtime";
+import { useId as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuGroup.tsx
-var a = "haze-DropdownMenuGroup__group";
-function o({ label: o, className: s, children: c }) {
-	let l = n();
-	return /* @__PURE__ */ i("div", {
+var s = "haze-DropdownMenuGroup__group";
+function c(c) {
+	let l = r(11), { label: u, className: d, children: f } = c, p = n().classNames, m = i(), h = p?.group, g;
+	l[0] !== d || l[1] !== h ? (g = [
+		s,
+		h,
+		d
+	], l[0] = d, l[1] = h, l[2] = g) : g = l[2];
+	let _;
+	l[3] !== u || l[4] !== m ? (_ = /* @__PURE__ */ a("div", {
+		id: m,
+		"data-slot": "group-label",
+		className: e(t),
+		children: u
+	}), l[3] = u, l[4] = m, l[5] = _) : _ = l[5];
+	let v;
+	return l[6] !== f || l[7] !== m || l[8] !== g || l[9] !== _ ? (v = /* @__PURE__ */ o("div", {
 		"data-slot": "group",
 		role: "group",
-		"aria-labelledby": l,
-		className: e([a, s]),
-		children: [/* @__PURE__ */ r("div", {
-			id: l,
-			"data-slot": "group-label",
-			className: e(t),
-			children: o
-		}), c]
-	});
+		"aria-labelledby": m,
+		className: e(g),
+		children: [_, f]
+	}), l[6] = f, l[7] = m, l[8] = g, l[9] = _, l[10] = v) : v = l[10], v;
 }
 //#endregion
-export { o as default };
+export { c as default };

package/dist/components/DropdownMenu/DropdownMenuItem.js

@@ -8,7 +8,7 @@ import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuItem.tsx
 var i = "haze-DropdownMenuItem__item";
 function a({ children: a, onClick: o, disabled: s, danger: c = !1, icon: l, kbdLabel: u, className: d }) {
-	let { setOpen: f, triggerRef: p } = t();
+	let { setOpen: f, triggerRef: p, classNames: m } = t();
 	return /* @__PURE__ */ r("button", {
 		"data-slot": "menu-item",
 		type: "button",
@@ -21,6 +21,7 @@ function a({ children: a, onClick: o, disabled: s, danger: c = !1, icon: l, kbdL
 		className: e([
 			i,
 			c && "haze-dropdown-menu-item-styles__dropdownMenuItemDanger",
+			m?.item,
 			d
 		]),
 		children: [

package/dist/components/DropdownMenu/DropdownMenuRadioGroup.js

@@ -3,28 +3,40 @@
 import { classnames as e } from "../../utils/classnames.js";
 import { MenuRadioGroupProvider as t, useMenuRadioGroup as n } from "../../utils/menuRadio.js";
 import "./dropdown-menu-item-styles.js";
+import { useDropdownMenuContext as r } from "./DropdownMenuContext.js";
 /* empty css                                 */
-import { useId as r } from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { c as i } from "react/compiler-runtime";
+import { useId as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuRadioGroup.tsx
-var o = "haze-DropdownMenuRadioGroup__group";
-function s({ value: s, onValueChange: c, label: l, className: u, children: d }) {
-	let f = n(s, c), p = r();
-	return /* @__PURE__ */ i(t, {
-		value: f,
-		children: a("div", {
-			"data-slot": "group",
-			role: "group",
-			"aria-labelledby": l === void 0 ? void 0 : p,
-			className: e([o, u]),
-			children: [l !== void 0 && /* @__PURE__ */ i("div", {
-				id: p,
-				"data-slot": "group-label",
-				className: e("haze-dropdown-menu-item-styles__dropdownMenuGroupLabel"),
-				children: l
-			}), d]
-		})
-	});
+var c = "haze-DropdownMenuRadioGroup__group";
+function l(l) {
+	let u = i(14), { value: d, onValueChange: f, label: p, className: m, children: h } = l, g = n(d, f), _ = r().classNames, v = a(), y = p === void 0 ? void 0 : v, b = _?.group, x;
+	u[0] !== m || u[1] !== b ? (x = [
+		c,
+		b,
+		m
+	], u[0] = m, u[1] = b, u[2] = x) : x = u[2];
+	let S;
+	u[3] !== p || u[4] !== v ? (S = p !== void 0 && /* @__PURE__ */ o("div", {
+		id: v,
+		"data-slot": "group-label",
+		className: e("haze-dropdown-menu-item-styles__dropdownMenuGroupLabel"),
+		children: p
+	}), u[3] = p, u[4] = v, u[5] = S) : S = u[5];
+	let C;
+	u[6] !== h || u[7] !== y || u[8] !== x || u[9] !== S ? (C = /* @__PURE__ */ s("div", {
+		"data-slot": "group",
+		role: "group",
+		"aria-labelledby": y,
+		className: e(x),
+		children: [S, h]
+	}), u[6] = h, u[7] = y, u[8] = x, u[9] = S, u[10] = C) : C = u[10];
+	let w;
+	return u[11] !== g || u[12] !== C ? (w = /* @__PURE__ */ o(t, {
+		value: g,
+		children: C
+	}), u[11] = g, u[12] = C, u[13] = w) : w = u[13], w;
 }
 //#endregion
-export { s as default };
+export { l as default };

package/dist/components/DropdownMenu/DropdownMenuRadioItem.js

@@ -3,36 +3,38 @@
 import { classnames as e } from "../../utils/classnames.js";
 import { useMenuRadioItem as t } from "../../utils/menuRadio.js";
 import { dropdownMenuItemIndicator as n } from "./dropdown-menu-item-styles.js";
+import { useDropdownMenuContext as r } from "./DropdownMenuContext.js";
 /* empty css                                */
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuRadioItem.tsx
-var a = "haze-DropdownMenuRadioItem__item";
-function o({ value: o, disabled: s = !1, danger: c = !1, icon: l, kbdLabel: u, className: d, children: f }) {
-	let { checked: p, select: m } = t(o);
-	return /* @__PURE__ */ i("button", {
+var o = "haze-DropdownMenuRadioItem__item";
+function s({ value: s, disabled: c = !1, danger: l = !1, icon: u, kbdLabel: d, className: f, children: p }) {
+	let { checked: m, select: h } = t(s), g = r().classNames;
+	return /* @__PURE__ */ a("button", {
 		"data-slot": "menu-radio-item",
 		type: "button",
 		role: "menuitemradio",
-		"aria-checked": p,
+		"aria-checked": m,
 		tabIndex: -1,
-		disabled: s,
-		onClick: m,
+		disabled: c,
+		onClick: h,
 		className: e([
-			a,
-			c && "haze-dropdown-menu-item-styles__dropdownMenuItemDanger",
-			d
+			o,
+			l && "haze-dropdown-menu-item-styles__dropdownMenuItemDanger",
+			g?.radioItem,
+			f
 		]),
 		children: [
-			/* @__PURE__ */ r("span", {
+			/* @__PURE__ */ i("span", {
 				"data-slot": "indicator",
 				"aria-hidden": "true",
 				className: e(n),
-				children: p && /* @__PURE__ */ r("svg", {
+				children: m && /* @__PURE__ */ i("svg", {
 					width: "1em",
 					height: "1em",
 					viewBox: "0 0 16 16",
 					fill: "none",
-					children: /* @__PURE__ */ r("circle", {
+					children: /* @__PURE__ */ i("circle", {
 						cx: "8",
 						cy: "8",
 						r: "3.5",
@@ -40,20 +42,20 @@ function o({ value: o, disabled: s = !1, danger: c = !1, icon: l, kbdLabel: u, c
 					})
 				})
 			}),
-			l !== void 0 && /* @__PURE__ */ r("span", {
+			u !== void 0 && /* @__PURE__ */ i("span", {
 				"data-slot": "icon",
 				className: e("haze-dropdown-menu-item-styles__dropdownMenuItemIcon"),
-				children: l
+				children: u
 			}),
-			f,
-			u !== void 0 && /* @__PURE__ */ r("span", {
+			p,
+			d !== void 0 && /* @__PURE__ */ i("span", {
 				"data-slot": "kbd",
 				"aria-hidden": "true",
 				className: e("haze-dropdown-menu-item-styles__dropdownMenuItemKbd"),
-				children: u
+				children: d
 			})
 		]
 	});
 }
 //#endregion
-export { o as default };
+export { s as default };

package/dist/components/DropdownMenu/DropdownMenuSeparator.js

@@ -1,16 +1,23 @@
 
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
+import { useDropdownMenuContext as t } from "./DropdownMenuContext.js";
 /* empty css                                */
-import { jsx as t } from "react/jsx-runtime";
+import { c as n } from "react/compiler-runtime";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuSeparator.tsx
-var n = "haze-DropdownMenuSeparator__separator";
-function r({ className: r }) {
-	return /* @__PURE__ */ t("div", {
+var i = "haze-DropdownMenuSeparator__separator";
+function a(a) {
+	let o = n(3), { className: s } = a, c = t().classNames?.separator, l;
+	return o[0] !== s || o[1] !== c ? (l = /* @__PURE__ */ r("div", {
 		"data-slot": "separator",
 		role: "separator",
-		className: e([n, r])
-	});
+		className: e([
+			i,
+			c,
+			s
+		])
+	}), o[0] = s, o[1] = c, o[2] = l) : l = o[2], l;
 }
 //#endregion
-export { r as default };
+export { a as default };

package/dist/components/DropdownMenu/DropdownMenuSub.js

@@ -2,23 +2,35 @@
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { SubmenuProvider as t, useSubmenu as n } from "../../utils/submenu.js";
+import { useDropdownMenuContext as r } from "./DropdownMenuContext.js";
 /* empty css                          */
-import { jsx as r } from "react/jsx-runtime";
+import { c as i } from "react/compiler-runtime";
+import { jsx as a } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuSub.tsx
-var i = "haze-DropdownMenuSub__wrapper";
-function a({ open: a, onOpenChange: o, className: s, children: c }) {
-	let l = n({
-		open: a,
-		onOpenChange: o
-	});
-	return /* @__PURE__ */ r(t, {
-		value: l,
-		children: r("div", {
-			"data-slot": "menu-sub",
-			className: e([i, s]),
-			children: c
-		})
-	});
+var o = "haze-DropdownMenuSub__wrapper";
+function s(s) {
+	let c = i(12), { open: l, onOpenChange: u, className: d, children: f } = s, p = r().classNames, m;
+	c[0] !== u || c[1] !== l ? (m = {
+		open: l,
+		onOpenChange: u
+	}, c[0] = u, c[1] = l, c[2] = m) : m = c[2];
+	let h = n(m), g = p?.sub, _;
+	c[3] !== d || c[4] !== g ? (_ = [
+		o,
+		g,
+		d
+	], c[3] = d, c[4] = g, c[5] = _) : _ = c[5];
+	let v;
+	c[6] !== f || c[7] !== _ ? (v = /* @__PURE__ */ a("div", {
+		"data-slot": "menu-sub",
+		className: e(_),
+		children: f
+	}), c[6] = f, c[7] = _, c[8] = v) : v = c[8];
+	let y;
+	return c[9] !== h || c[10] !== v ? (y = /* @__PURE__ */ a(t, {
+		value: h,
+		children: v
+	}), c[9] = h, c[10] = v, c[11] = y) : y = c[11], y;
 }
 //#endregion
-export { a as default };
+export { s as default };

package/dist/components/DropdownMenu/DropdownMenuSubContent.js

@@ -2,23 +2,24 @@
 "use client";
 import { FloatingPanel as e } from "../../utils/floating.js";
 import { useSubmenuContext as t } from "../../utils/submenu.js";
+import { useDropdownMenuContext as n } from "./DropdownMenuContext.js";
 /* empty css                                 */
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuSubContent.tsx
-var r = "haze-DropdownMenuSubContent__content";
-function i({ className: i, children: a }) {
-	let o = t();
-	return !o.open && o.floating.exited ? null : /* @__PURE__ */ n(e, {
-		ref: o.contentRef,
-		behavior: o.floating,
+var i = "haze-DropdownMenuSubContent__content";
+function a({ className: a, children: o }) {
+	let s = n().classNames, c = t();
+	return !c.open && c.floating.exited ? null : /* @__PURE__ */ r(e, {
+		ref: c.contentRef,
+		behavior: c.floating,
 		placement: "right",
-		id: o.contentId,
+		id: c.contentId,
 		role: "menu",
-		visualClass: r,
-		className: i,
-		onKeyDown: o.contentKeyDown,
-		children: a
+		visualClass: i,
+		className: [a, s?.subContent].filter(Boolean).join(" ") || void 0,
+		onKeyDown: c.contentKeyDown,
+		children: o
 	});
 }
 //#endregion
-export { i as default };
+export { a as default };

package/dist/components/DropdownMenu/DropdownMenuSubTrigger.js

@@ -2,30 +2,35 @@
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { useSubmenuContext as t } from "../../utils/submenu.js";
+import { useDropdownMenuContext as n } from "./DropdownMenuContext.js";
 /* empty css                                 */
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuSubTrigger.tsx
-var r = "haze-DropdownMenuSubTrigger__trigger";
-function i({ disabled: i = !1, className: a, children: o }) {
-	let s = t();
-	return /* @__PURE__ */ n("button", {
-		ref: s.triggerRef,
+var i = "haze-DropdownMenuSubTrigger__trigger";
+function a({ disabled: a = !1, className: o, children: s }) {
+	let c = n().classNames, l = t();
+	return /* @__PURE__ */ r("button", {
+		ref: l.triggerRef,
 		type: "button",
 		role: "menuitem",
 		"data-slot": "menu-sub-trigger",
 		tabIndex: -1,
 		"aria-haspopup": "menu",
-		"aria-expanded": s.open,
-		"aria-owns": s.open ? s.contentId : void 0,
-		disabled: i,
-		style: s.floating.triggerStyle,
-		onPointerDown: s.floating.onTriggerPointerDown,
-		onPointerEnter: s.onTriggerPointerEnter,
-		onClick: s.floating.onTriggerClick,
-		onKeyDown: s.handleTriggerKeyDown,
-		className: e([r, a]),
-		children: o
+		"aria-expanded": l.open,
+		"aria-owns": l.open ? l.contentId : void 0,
+		disabled: a,
+		style: l.floating.triggerStyle,
+		onPointerDown: l.floating.onTriggerPointerDown,
+		onPointerEnter: l.onTriggerPointerEnter,
+		onClick: l.floating.onTriggerClick,
+		onKeyDown: l.handleTriggerKeyDown,
+		className: e([
+			i,
+			c?.subTrigger,
+			o
+		]),
+		children: s
 	});
 }
 //#endregion
-export { i as default };
+export { a as default };

package/dist/components/DropdownMenu/DropdownMenuTrigger.js

@@ -4,32 +4,43 @@ import { classnames as e } from "../../utils/classnames.js";
 import { getEnabledMenuItems as t } from "../../utils/menuKeyboard.js";
 import { useDropdownMenuContext as n } from "./DropdownMenuContext.js";
 /* empty css                              */
-import { jsx as r } from "react/jsx-runtime";
+import { c as r } from "react/compiler-runtime";
+import { jsx as i } from "react/jsx-runtime";
 //#region src/lib/components/DropdownMenu/DropdownMenuTrigger.tsx
-var i = "haze-DropdownMenuTrigger__trigger";
-function a({ children: a, className: o }) {
-	let { open: s, setOpen: c, triggerRef: l, contentRef: u, contentId: d, focusRequestRef: f, floating: p } = n(), m = (e) => {
-		if (s) {
-			let n = t(u.current);
+var a = "haze-DropdownMenuTrigger__trigger";
+function o(o) {
+	let s = r(20), { children: c, className: l } = o, { open: u, setOpen: d, triggerRef: f, contentRef: p, contentId: m, focusRequestRef: h, floating: g, classNames: _ } = n(), v;
+	s[0] !== p || s[1] !== h || s[2] !== u || s[3] !== d ? (v = (e) => {
+		if (u) {
+			let n = t(p.current);
 			(e === "first" ? n[0] : n[n.length - 1])?.focus();
-		} else f.current = e, c(!0);
-	};
-	return /* @__PURE__ */ r("button", {
-		ref: l,
+		} else h.current = e, d(!0);
+	}, s[0] = p, s[1] = h, s[2] = u, s[3] = d, s[4] = v) : v = s[4];
+	let y = v, b = _?.trigger, x;
+	s[5] !== l || s[6] !== b ? (x = [
+		a,
+		b,
+		l
+	], s[5] = l, s[6] = b, s[7] = x) : x = s[7];
+	let S = u ? m : void 0, C;
+	s[8] === y ? C = s[9] : (C = (e) => {
+		e.key === "ArrowDown" ? (e.preventDefault(), y("first")) : e.key === "ArrowUp" && (e.preventDefault(), y("last"));
+	}, s[8] = y, s[9] = C);
+	let w;
+	return s[10] !== c || s[11] !== g.onTriggerClick || s[12] !== g.onTriggerPointerDown || s[13] !== g.triggerStyle || s[14] !== u || s[15] !== x || s[16] !== S || s[17] !== C || s[18] !== f ? (w = /* @__PURE__ */ i("button", {
+		ref: f,
 		"data-slot": "trigger",
 		type: "button",
 		"aria-haspopup": "menu",
-		"aria-expanded": s,
-		"aria-controls": s ? d : void 0,
-		style: p.triggerStyle,
-		onPointerDown: p.onTriggerPointerDown,
-		onClick: p.onTriggerClick,
-		onKeyDown: (e) => {
-			e.key === "ArrowDown" ? (e.preventDefault(), m("first")) : e.key === "ArrowUp" && (e.preventDefault(), m("last"));
-		},
-		className: e([i, o]),
-		children: a
-	});
+		"aria-expanded": u,
+		"aria-controls": S,
+		style: g.triggerStyle,
+		onPointerDown: g.onTriggerPointerDown,
+		onClick: g.onTriggerClick,
+		onKeyDown: C,
+		className: e(x),
+		children: c
+	}), s[10] = c, s[11] = g.onTriggerClick, s[12] = g.onTriggerPointerDown, s[13] = g.triggerStyle, s[14] = u, s[15] = x, s[16] = S, s[17] = C, s[18] = f, s[19] = w) : w = s[19], w;
 }
 //#endregion
-export { a as default };
+export { o as default };