haze-ui 1.6.0 → 1.6.1

package/dist/components/Alert/Alert.js

@@ -11,11 +11,7 @@ var i = "haze-Alert__base", a = {
 }, o = "haze-Alert__contentStyle", s = "haze-Alert__closeBtn";
 function c({ visible: c, onClose: l, variant: u = "info", closable: d = !1, className: f, children: p }) {
 	let [m, h] = r(c, !0);
-	if (!m) return null;
-	let g = () => {
-		h(!1), l?.();
-	};
-	return /* @__PURE__ */ n("div", {
+	return m ? /* @__PURE__ */ n("div", {
 		role: "alert",
 		className: e([
 			i,
@@ -29,10 +25,12 @@ function c({ visible: c, onClose: l, variant: u = "info", closable: d = !1, clas
 			type: "button",
 			className: s,
 			"aria-label": "Close",
-			onClick: g,
+			onClick: () => {
+				h(!1), l?.();
+			},
 			children: "×"
 		})]
-	});
+	}) : null;
 }
 //#endregion
 export { c as default };

package/dist/components/AspectRatio/AspectRatio.js

@@ -7,7 +7,7 @@ function i({ ratio: i = 16 / 9, children: a, className: o }) {
 	return /* @__PURE__ */ t("div", {
 		style: { paddingBottom: `${1 / i * 100}%` },
 		className: e([n, o]),
-		children: /* @__PURE__ */ t("div", {
+		children: t("div", {
 			className: e([r]),
 			children: a
 		})

package/dist/components/Badge/Badge.js

@@ -12,15 +12,16 @@ var n = "haze-Badge__base", r = {
 	sm: "haze-Badge__sm",
 	md: "haze-Badge__md"
 };
-function a({ variant: a = "default", size: o = "md", className: s, children: c }) {
+function a({ variant: a = "default", size: o = "md", className: s, style: c, children: l }) {
 	return /* @__PURE__ */ t("span", {
+		style: c,
 		className: e([
 			n,
 			r[a],
 			i[o],
 			s
 		]),
-		children: c
+		children: l
 	});
 }
 //#endregion

package/dist/components/BottomSheet/BottomSheet.js

@@ -11,7 +11,7 @@ function s({ open: s, onClose: c, children: l, className: u }) {
 			f(!1), c?.();
 		},
 		className: e([i, u]),
-		children: /* @__PURE__ */ n("div", {
+		children: n("div", {
 			onClick: (e) => e.stopPropagation(),
 			className: e([a]),
 			children: [/* @__PURE__ */ t("div", { className: e([o]) }), l]

package/dist/components/Breadcrumb/Breadcrumb.js

@@ -9,7 +9,7 @@ function s({ separator: s = "/", className: c, children: l }) {
 	return /* @__PURE__ */ t("nav", {
 		"aria-label": "Breadcrumb",
 		className: e([i, c]),
-		children: /* @__PURE__ */ t("ol", {
+		children: t("ol", {
 			className: a,
 			children: u.map((e, r) => /* @__PURE__ */ n("li", {
 				"aria-current": r === u.length - 1 ? "page" : void 0,

package/dist/components/Carousel/Carousel.js

@@ -7,7 +7,7 @@ import { Children as a, useEffect as o, useRef as s } from "react";
 var c = "haze-Carousel__wrapper", l = "haze-Carousel__track", u = "haze-Carousel__navBtn", d = "haze-Carousel__prevBtn", f = "haze-Carousel__nextBtn", p = "haze-Carousel__indicators", m = "haze-Carousel__dot", h = "haze-Carousel__dotActive";
 function g({ value: g, autoPlay: _ = !1, interval: v = 5e3, className: y, children: b }) {
 	let [x, S] = i(g, 0), C = s(null), w = a.count(b);
-	o(() => {
+	return o(() => {
 		let e = C.current;
 		if (!e) return;
 		let t = e.children[x];
@@ -27,9 +27,7 @@ function g({ value: g, autoPlay: _ = !1, interval: v = 5e3, className: y, childr
 		v,
 		w,
 		S
-	]);
-	let T = () => S((e) => (e - 1 + w) % w), E = () => S((e) => (e + 1) % w);
-	return /* @__PURE__ */ r("div", {
+	]), /* @__PURE__ */ r("div", {
 		role: "region",
 		"aria-roledescription": "carousel",
 		"aria-label": "Carousel",
@@ -41,14 +39,14 @@ function g({ value: g, autoPlay: _ = !1, interval: v = 5e3, className: y, childr
 		}), w > 1 && /* @__PURE__ */ r(t, { children: [
 			/* @__PURE__ */ n("button", {
 				type: "button",
-				onClick: T,
+				onClick: () => S((e) => (e - 1 + w) % w),
 				"aria-label": "Previous slide",
 				className: e([u, d]),
 				children: "‹"
 			}),
 			/* @__PURE__ */ n("button", {
 				type: "button",
-				onClick: E,
+				onClick: () => S((e) => (e + 1) % w),
 				"aria-label": "Next slide",
 				className: e([u, f]),
 				children: "›"

package/dist/components/Checkbox/Checkbox.js

@@ -1,20 +1,23 @@
 /* empty css                   */
 import { classnames as e } from "babel-runtime-jsx-plus";
-import { jsx as t } from "react/jsx-runtime";
-import { useControl as n } from "react-use-control";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { useControl as r } from "react-use-control";
 //#region src/lib/components/Checkbox/Checkbox.tsx
-var r = "haze-Checkbox__base";
-function i({ checked: i, className: a, onChange: o, ...s }) {
-	let [c, l] = n(i, !1);
-	return /* @__PURE__ */ t("input", {
+var i = "haze-Checkbox__base", a = "haze-Checkbox__labelText";
+function o({ checked: o, className: s, label: c, onChange: l, ...u }) {
+	let [d, f] = r(o, !1), p = /* @__PURE__ */ t("input", {
 		type: "checkbox",
-		checked: c,
+		checked: d,
 		onChange: (e) => {
-			l(e.target.checked), o?.(e);
+			f(e.target.checked), l?.(e);
 		},
-		...s,
-		className: e([r, a])
+		...u,
+		className: e([i, s])
+	});
+	return c === void 0 ? p : /* @__PURE__ */ n("label", {
+		className: e(a),
+		children: [p, c]
 	});
 }
 //#endregion
-export { i as default };
+export { o as default };

package/dist/components/Collapsible/Collapsible.js

@@ -18,7 +18,7 @@ function c({ open: r, defaultOpen: i = !1, children: o, className: c }) {
 			open: l,
 			toggle: () => u((e) => !e)
 		},
-		children: /* @__PURE__ */ t("div", {
+		children: t("div", {
 			className: e([s, c]),
 			children: o
 		})

package/dist/components/Combobox/Combobox.js

@@ -13,8 +13,6 @@ function p({ value: p, open: m, options: h, placeholder: g, className: _ }) {
 	}, [b]);
 	let k = (e) => {
 		y(e), x(h.find((t) => t.value === e)?.label ?? e), C(!1), D.current?.focus();
-	}, A = (e) => {
-		e.key === "ArrowDown" ? (e.preventDefault(), T((e) => Math.min(e + 1, O.length - 1))) : e.key === "ArrowUp" ? (e.preventDefault(), T((e) => Math.max(e - 1, 0))) : e.key === "Enter" && w >= 0 && O[w] ? (e.preventDefault(), k(O[w].value)) : e.key === "Escape" && C(!1);
 	};
 	return /* @__PURE__ */ r("div", {
 		className: t([l, _]),
@@ -31,7 +29,9 @@ function p({ value: p, open: m, options: h, placeholder: g, className: _ }) {
 				x(e.target.value), C(!0);
 			},
 			onFocus: () => C(!0),
-			onKeyDown: A
+			onKeyDown: (e) => {
+				e.key === "ArrowDown" ? (e.preventDefault(), T((e) => Math.min(e + 1, O.length - 1))) : e.key === "ArrowUp" ? (e.preventDefault(), T((e) => Math.max(e - 1, 0))) : e.key === "Enter" && w >= 0 && O[w] ? (e.preventDefault(), k(O[w].value)) : e.key === "Escape" && C(!1);
+			}
 		}), /* @__PURE__ */ n("div", {
 			id: E,
 			role: "listbox",

package/dist/components/Command/Command.js

@@ -18,7 +18,7 @@ function l({ query: r, children: i, className: s }) {
 	}), [l, u]);
 	return /* @__PURE__ */ t(o.Provider, {
 		value: d,
-		children: /* @__PURE__ */ t("div", {
+		children: t("div", {
 			role: "combobox",
 			className: e([c, s]),
 			children: i

package/dist/components/ConfirmDialog/ConfirmDialog.js

@@ -13,7 +13,7 @@ function p({ open: p, onClose: m, onConfirm: h, onCancel: g, title: _, children:
 	return /* @__PURE__ */ t("div", {
 		onClick: T,
 		className: e([i, S]),
-		children: /* @__PURE__ */ n("div", {
+		children: n("div", {
 			onClick: (e) => e.stopPropagation(),
 			className: e([a]),
 			children: [

package/dist/components/ContextMenu/ContextMenu.js

@@ -31,7 +31,7 @@ function l({ open: l, onOpenChange: u, children: d, className: f }) {
 			y: _,
 			setPosition: x
 		},
-		children: /* @__PURE__ */ n("div", {
+		children: n("div", {
 			ref: y,
 			className: t([c, f]),
 			children: d

package/dist/components/DropdownMenu/DropdownMenu.js

@@ -26,7 +26,7 @@ function c({ open: c, onOpenChange: l, children: u, className: d }) {
 			open: f,
 			setOpen: h
 		},
-		children: /* @__PURE__ */ n("div", {
+		children: n("div", {
 			ref: m,
 			className: t([s, d]),
 			children: u

package/dist/components/Flex/Flex.js

@@ -3,17 +3,18 @@ import { classnames as e } from "babel-runtime-jsx-plus";
 import { jsx as t } from "react/jsx-runtime";
 //#region src/lib/components/Flex/Flex.tsx
 var n = "haze-Flex__base";
-function r({ direction: r = "row", align: i, justify: a, gap: o, wrap: s = !1, className: c, children: l }) {
+function r({ direction: r = "row", align: i, justify: a, gap: o, wrap: s = !1, className: c, style: l, children: u }) {
 	return /* @__PURE__ */ t("div", {
 		style: {
 			flexDirection: r,
 			alignItems: i,
 			justifyContent: a,
 			gap: typeof o == "number" ? `${o}px` : o,
-			flexWrap: s ? "wrap" : void 0
+			flexWrap: s ? "wrap" : void 0,
+			...l
 		},
 		className: e([n, c]),
-		children: l
+		children: u
 	});
 }
 //#endregion

package/dist/components/Icon/Icon.js

@@ -13,12 +13,12 @@ function a(e) {
 	return !!(t.stroke || t.strokeWidth || t.fill === "none");
 }
 function o({ icon: o, size: s = "md", className: c, children: l }) {
-	let u = o ? /* @__PURE__ */ t(o, {}) : l, d = o ? !0 : a(u);
+	let u = o ? /* @__PURE__ */ t(o, {}) : l;
 	return /* @__PURE__ */ t("span", {
 		"aria-hidden": "true",
 		className: e([
 			n,
-			d && r,
+			(o ? !0 : a(u)) && r,
 			i[s],
 			c
 		]),

package/dist/components/ModelPicker/ModelPicker.js

@@ -8,7 +8,7 @@ function o({ value: o, onChange: s, options: c, disabled: l, className: u }) {
 	let [d, f] = r(o, "");
 	return /* @__PURE__ */ t("div", {
 		className: e([i, u]),
-		children: /* @__PURE__ */ t("select", {
+		children: t("select", {
 			value: d,
 			onChange: (e) => {
 				f(e.target.value), s?.(e.target.value);

package/dist/components/Progress/Progress.js

@@ -43,7 +43,7 @@ function m({ value: m = 0, variant: h = "bar", size: g = "md", color: _ = "prima
 				c[g],
 				v
 			]),
-			children: /* @__PURE__ */ n("svg", {
+			children: n("svg", {
 				viewBox: `0 0 ${(r + i) * 2} ${(r + i) * 2}`,
 				children: [/* @__PURE__ */ t("circle", {
 					cx: r + i,
@@ -73,7 +73,7 @@ function m({ value: m = 0, variant: h = "bar", size: g = "md", color: _ = "prima
 			i[g],
 			v
 		]),
-		children: /* @__PURE__ */ t("div", {
+		children: t("div", {
 			style: { width: `${y}%` },
 			className: e([a, o[_]])
 		})

package/dist/components/Radio/RadioGroup.js

@@ -10,7 +10,7 @@ function o({ value: o, name: s, className: c, children: l }) {
 	let [u, d] = r(o, ""), f = i();
 	return /* @__PURE__ */ n("fieldset", {
 		className: t([a, c]),
-		children: /* @__PURE__ */ n(e, {
+		children: n(e, {
 			value: {
 				name: s ?? f,
 				value: u,

package/dist/components/Resizable/Resizable.js

@@ -20,7 +20,7 @@ function u({ direction: n = "horizontal", children: r, className: o }) {
 			dragging: f,
 			setDragging: p
 		},
-		children: /* @__PURE__ */ t("div", {
+		children: t("div", {
 			className: e([
 				s,
 				n === "horizontal" ? c : l,

package/dist/components/Spinner/Spinner.js

@@ -16,7 +16,7 @@ function a({ size: a = "md", className: o }) {
 			i[a],
 			o
 		]),
-		children: /* @__PURE__ */ n("svg", {
+		children: n("svg", {
 			viewBox: "0 0 24 24",
 			fill: "none",
 			xmlns: "http://www.w3.org/2000/svg",

package/dist/components/Stepper/Stepper.js

@@ -14,7 +14,7 @@ function c({ activeStep: c, children: l, className: u }) {
 			setActiveStep: f,
 			totalSteps: i.count(l)
 		},
-		children: /* @__PURE__ */ n("div", {
+		children: n("div", {
 			role: "list",
 			className: t([s, u]),
 			children: i.map(l, (e, t) => o(e) ? a(e, { index: t }) : e)

package/dist/components/Switch/Switch.js

@@ -32,7 +32,7 @@ function v({ checked: o, size: s = "md", className: c, onClick: l, ...u }) {
 			d && i,
 			c
 		]),
-		children: /* @__PURE__ */ t("span", { className: e([
+		children: t("span", { className: e([
 			a,
 			g[s],
 			d && _[s]

package/dist/components/Table/Table.js

@@ -6,7 +6,7 @@ var n = "haze-Table__wrapper", r = "haze-Table__base", i = "haze-Table__stripedS
 function o({ striped: o = !1, bordered: s = !1, className: c, children: l }) {
 	return /* @__PURE__ */ t("div", {
 		className: e([n]),
-		children: /* @__PURE__ */ t("table", {
+		children: t("table", {
 			className: e([
 				r,
 				o && i,

package/dist/components/Tabs/Tabs.js

@@ -9,7 +9,7 @@ function a({ value: a, className: o, children: s }) {
 	let [c, l] = r(a, "");
 	return /* @__PURE__ */ n("div", {
 		className: t([i, o]),
-		children: /* @__PURE__ */ n(e, {
+		children: n(e, {
 			value: {
 				value: c,
 				setValue: l

package/dist/components/Transfer/Transfer.js

@@ -10,14 +10,6 @@ function f({ dataSource: f, targetKeys: p, onChange: m, className: h }) {
 		y((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
 	}, T = (e) => {
 		x((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
-	}, E = () => {
-		if (v.length === 0) return;
-		let e = [...g, ...v];
-		_(e), m?.(e, "right", v), y([]);
-	}, D = () => {
-		if (b.length === 0) return;
-		let e = g.filter((e) => !b.includes(e));
-		_(e), m?.(e, "left", b), x([]);
 	};
 	return /* @__PURE__ */ n("div", {
 		className: e([a, h]),
@@ -50,14 +42,22 @@ function f({ dataSource: f, targetKeys: p, onChange: m, className: h }) {
 				children: [/* @__PURE__ */ t("button", {
 					type: "button",
 					disabled: v.length === 0,
-					onClick: E,
+					onClick: () => {
+						if (v.length === 0) return;
+						let e = [...g, ...v];
+						_(e), m?.(e, "right", v), y([]);
+					},
 					"aria-label": ">",
 					className: e([d]),
 					children: "›"
 				}), /* @__PURE__ */ t("button", {
 					type: "button",
 					disabled: b.length === 0,
-					onClick: D,
+					onClick: () => {
+						if (b.length === 0) return;
+						let e = g.filter((e) => !b.includes(e));
+						_(e), m?.(e, "left", b), x([]);
+					},
 					"aria-label": "<",
 					className: e([d]),
 					children: "‹"

package/dist/components/Tree/TreeItem.js

@@ -9,7 +9,7 @@ var r = "haze-TreeItem__item", i = "haze-TreeItem__blockItem", a = "haze-TreeIte
 	strokeWidth: "2",
 	strokeLinecap: "round",
 	strokeLinejoin: "round",
-	children: /* @__PURE__ */ t("path", { d: "M4 2l4 4-4 4" })
+	children: t("path", { d: "M4 2l4 4-4 4" })
 }), v = () => /* @__PURE__ */ t("svg", {
 	viewBox: "0 0 12 12",
 	fill: "none",
@@ -17,18 +17,18 @@ var r = "haze-TreeItem__item", i = "haze-TreeItem__blockItem", a = "haze-TreeIte
 	strokeWidth: "2",
 	strokeLinecap: "round",
 	strokeLinejoin: "round",
-	children: /* @__PURE__ */ t("path", { d: "M2 6l3 3 5-5" })
+	children: t("path", { d: "M2 6l3 3 5-5" })
 }), y = () => /* @__PURE__ */ t("svg", {
 	viewBox: "0 0 12 12",
 	fill: "none",
 	stroke: "currentColor",
 	strokeWidth: "2",
 	strokeLinecap: "round",
-	children: /* @__PURE__ */ t("path", { d: "M2 6h8" })
+	children: t("path", { d: "M2 6h8" })
 }), b = () => /* @__PURE__ */ t("svg", {
 	viewBox: "0 0 16 16",
 	fill: "currentColor",
-	children: /* @__PURE__ */ t("path", { d: "M1 3.5A1.5 1.5 0 0 1 2.5 2h2.764c.958 0 1.76.56 2.311 1.184C7.985 3.648 8.48 4 9 4h4.5A1.5 1.5 0 0 1 15 5.5v7a1.5 1.5 0 0 1-1.5 1.5h-11A1.5 1.5 0 0 1 1 12.5v-9z" })
+	children: t("path", { d: "M1 3.5A1.5 1.5 0 0 1 2.5 2h2.764c.958 0 1.76.56 2.311 1.184C7.985 3.648 8.48 4 9 4h4.5A1.5 1.5 0 0 1 15 5.5v7a1.5 1.5 0 0 1-1.5 1.5h-11A1.5 1.5 0 0 1 1 12.5v-9z" })
 }), x = () => /* @__PURE__ */ n("svg", {
 	viewBox: "0 0 16 16",
 	fill: "currentColor",
@@ -39,7 +39,7 @@ var r = "haze-TreeItem__item", i = "haze-TreeItem__blockItem", a = "haze-TreeIte
 }), S = () => /* @__PURE__ */ t("svg", {
 	viewBox: "0 0 16 16",
 	fill: "currentColor",
-	children: /* @__PURE__ */ t("path", { d: "M4 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.414a2 2 0 0 0-.586-1.414L10.586.172A2 2 0 0 0 9.172 0H4zm1 1a1 1 0 0 1 1-1h3.172a1 1 0 0 1 .707.293l2.121 2.121a1 1 0 0 1 .293.707V13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V1z" })
+	children: t("path", { d: "M4 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.414a2 2 0 0 0-.586-1.414L10.586.172A2 2 0 0 0 9.172 0H4zm1 1a1 1 0 0 1 1-1h3.172a1 1 0 0 1 .707.293l2.121 2.121a1 1 0 0 1 .293.707V13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V1z" })
 }), C = () => /* @__PURE__ */ n("svg", {
 	viewBox: "0 0 16 16",
 	fill: "currentColor",
@@ -50,7 +50,7 @@ var r = "haze-TreeItem__item", i = "haze-TreeItem__blockItem", a = "haze-TreeIte
 });
 function w({ node: w, level: T, expanded: E, selected: D, checked: O, disabled: k, checkable: A, selectable: j, blockNode: M, showLine: N, showIcon: P, switcherIcon: F, loadingIcon: I, loading: L, titleRender: R, iconRender: z, isLast: B, onToggle: V, onSelect: H, onCheck: U }) {
 	let W = !!w.children?.length, G = w.isLeaf ?? !W, K = Array.from({ length: T }, (e, t) => ({ showLine: N && !B[t] })), q = R ? R(w) : w.title, J = z ? z(w) : w.icon;
-	return /* @__PURE__ */ t("div", { children: /* @__PURE__ */ n("div", {
+	return /* @__PURE__ */ t("div", { children: n("div", {
 		role: "treeitem",
 		"aria-selected": D,
 		"aria-expanded": G ? void 0 : E,

package/dist/components/VirtualList/VirtualList.js

@@ -17,7 +17,7 @@ function c({ items: c, height: l, itemHeight: u, renderItem: d, overscan: f = 5,
 		ref: g,
 		style: { height: l },
 		className: e([o, p]),
-		children: /* @__PURE__ */ t("div", {
+		children: t("div", {
 			style: { height: v },
 			className: e([s]),
 			children: x.map((e, n) => /* @__PURE__ */ t("div", {