highsoft-ui 1.0.117 → 1.0.119

package/dist/{Header-BW8ilZxt.js → Header-6RIZc0v3.js}

@@ -1,13 +1,13 @@
-import { t as e } from "./Search-DAPCZo13.js";
-import { a as t, c as n, i as r, l as i, r as a } from "./utils-C4QGLbxr.js";
-import { t as o } from "./clsx-ROFf4vs9.js";
-import { D as s, M as c, S as l, _ as u, k as d, n as f, o as p, p as m, s as h, t as g, v as _ } from "./esm-C1TDRARf.js";
-import { t as v } from "./Button-9RIB8ZR0.js";
-import { t as y } from "./Container-LAkF4ShX.js";
-import { t as b } from "./PrefPanel-BTX6RAo4.js";
-import { t as x } from "./Logo-CZ5LYqub.js";
-import { t as S } from "./NewTag-C-3mRyvV.js";
-import { t as C } from "./Notification-DHcQtd1k.js";
+import { t as e } from "./Search-CDHkDXCm.js";
+import { a as t, d as n, i as r, o as i, u as a } from "./utils-BCI5dixg.js";
+import { t as o } from "./clsx-D7D_XZ_-.js";
+import { I as s, P as c, c as l, m as u, r as d, s as f, t as p, v as m, w as h, y as g, z as _ } from "./esm-T3Xn_ZHF.js";
+import { t as v } from "./Button-CJp__tle.js";
+import { t as y } from "./Container-DI2smQRq.js";
+import { t as b } from "./Logo-h9bQL-cT.js";
+import { t as x } from "./PrefPanel-25erkPRB.js";
+import { t as S } from "./Label-BH3YxfNt.js";
+import { t as C } from "./Notification-CJ3iQv3Z.js";
 import { useEffect as w, useRef as T, useState as E } from "react";
 import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
 var A = {
@@ -75,32 +75,32 @@ var A = {
 	{
 		title: "Products",
 		url: "https://www.highcharts.com/products/",
-		icon: /* @__PURE__ */ O(s, {})
+		icon: /* @__PURE__ */ O(c, {})
 	},
 	{
 		title: "Demos",
 		url: "https://www.highcharts.com/demo",
-		icon: /* @__PURE__ */ O(m, {})
+		icon: /* @__PURE__ */ O(u, {})
 	},
 	{
 		title: "Support",
 		url: "https://www.highcharts.com/support/",
-		icon: /* @__PURE__ */ O(u, {})
+		icon: /* @__PURE__ */ O(m, {})
 	},
 	{
 		title: "Resources",
 		url: "https://www.highcharts.com/resources/",
-		icon: /* @__PURE__ */ O(l, {})
+		icon: /* @__PURE__ */ O(h, {})
 	},
 	{
 		title: "Pricing",
 		url: "https://shop.highcharts.com/",
-		icon: /* @__PURE__ */ O(d, {})
+		icon: /* @__PURE__ */ O(s, {})
 	},
 	{
 		title: "Blog",
 		url: "https://www.highcharts.com/blog/home/",
-		icon: /* @__PURE__ */ O(c, {})
+		icon: /* @__PURE__ */ O(_, {})
 	}
 ];
 function B(e, t) {
@@ -118,21 +118,21 @@ var U = 72, W = 48;
 function G(e) {
 	return !!e?.some(({ icon: e, selectedIcon: t }) => !!(e || t));
 }
-function K({ items: e, link: n = "a", host: r = "https://www.highcharts.com", pathname: i }) {
-	let a = t(), s = G(e);
+function K({ items: e, link: t = "a", host: n = "https://www.highcharts.com", pathname: r }) {
+	let a = i(), s = G(e);
 	return /* @__PURE__ */ O("div", {
 		className: o(A.sub, A.outer),
 		children: /* @__PURE__ */ O(y, {
 			className: o(A.subContainer, { [A.compact]: !s }),
 			as: "ul",
-			children: e.map(({ title: e, url: t, prefixMatch: s, icon: c, selectedIcon: l, tag: u, tagVariant: d = "success" }, f) => {
-				let p = i || typeof window < "u" && window.location.pathname, m = typeof window < "u" && window.location.origin || "http://example.com", h = new URL(t, m), g = p && (!!i || a) && h.origin === m && (s ? p.startsWith(h.pathname) : h.pathname === p), _ = !!(c || l), v = typeof u == "string" || typeof u == "number" ? /* @__PURE__ */ O(S, {
+			children: e.map(({ title: e, url: i, prefixMatch: s, icon: c, selectedIcon: l, tag: u, tagVariant: d = "success" }, f) => {
+				let p = r || typeof window < "u" && window.location.pathname, m = typeof window < "u" && window.location.origin || "http://example.com", h = new URL(i, m), g = p && (!!r || a) && h.origin === m && (s ? p.startsWith(h.pathname) : h.pathname === p), _ = !!(c || l), v = typeof u == "string" || typeof u == "number" ? /* @__PURE__ */ O(S, {
 					variant: d,
-					icon: !1,
+					iconLeft: !1,
 					children: u
 				}) : u;
-				return /* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(n, {
-					href: B(t, r),
+				return /* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(t, {
+					href: B(i, n),
 					className: o({
 						[A.withIcon]: _,
 						[A.selectableIcon]: l,
@@ -186,26 +186,30 @@ var q = [
 	content: q
 }];
 function Y() {
-	let { theme: e, setTheme: t } = i(), n = T(!1);
+	let { theme: e, setTheme: t } = n(), r = T(!1);
 	return w(() => {
-		if (n.current) return;
-		let r = L();
-		if (r && r !== e) {
-			t(r), n.current = !0;
+		if (r.current) return;
+		let n = L();
+		if (n && n !== e) {
+			t(n), r.current = !0;
 			return;
 		}
-		n.current = !0;
+		r.current = !0;
 	}, [t, e]), w(() => {
 		e && R(M, e);
 	}, [e]), null;
 }
-function X({ subItems: t, children: i, notifications: s = J, link: c = "a", host: l = "https://www.highcharts.com", pathname: u, cssVariable: d }) {
-	let m = r("(max-width: 374px)"), S = r("(max-width: 849px)"), w = r("(max-width: 1300px)"), M = G(t), N = T(null), [P, F] = E(!1), [L, V] = E([]);
-	a(() => {
-		let e = N.current;
+function X({ subItems: n, children: i, notifications: s = J, link: c = "a", host: u = "https://www.highcharts.com", pathname: m, cssVariable: h, position: _ = "sticky" }) {
+	let S = t("(max-width: 374px)"), w = t("(max-width: 849px)"), M = t("(max-width: 1300px)"), N = G(n), P = T(null), [F, L] = E(!1), [V, H] = E([]);
+	r(() => {
+		let e = P.current;
 		if (!e) return;
-		let n = t?.length ? M ? U : W : 0, r = 82 + L.length * 48 + n, i = -(82 + L.length * 48), a = window.scrollY, o = 0, s = null, c = null, l = () => {
-			c = null, !(!e || s === o) && (e.style.transform = `translate3d(0, ${o}px, 0)`, d && document.documentElement.style.setProperty("--header-bottom", `${r + o}px`), s = o);
+		let t = n?.length ? N ? U : W : 0, r = 82 + V.length * 48 + t, i = -(82 + V.length * 48);
+		if (_ === "static") return e.style.transform = "", h && document.documentElement.style.setProperty("--header-bottom", `${r}px`), () => {
+			e.style.transform = "", h && document.documentElement.style.removeProperty("--header-bottom");
+		};
+		let a = window.scrollY, o = 0, s = null, c = null, l = () => {
+			c = null, !(!e || s === o) && (e.style.transform = `translate3d(0, ${o}px, 0)`, h && document.documentElement.style.setProperty("--header-bottom", `${r + o}px`), s = o);
 		};
 		l();
 		let u = () => {
@@ -213,42 +217,43 @@ function X({ subItems: t, children: i, notifications: s = J, link: c = "a", host
 			a = e, o = Math.min(0, Math.max(i, o - t)), c === null && (c = window.requestAnimationFrame(l));
 		};
 		return window.addEventListener("scroll", u, { passive: !0 }), () => {
-			window.removeEventListener("scroll", u), c !== null && cancelAnimationFrame(c), e.style.transform = "", d && document.documentElement.style.removeProperty("--header-bottom");
+			window.removeEventListener("scroll", u), c !== null && cancelAnimationFrame(c), e.style.transform = "", h && document.documentElement.style.removeProperty("--header-bottom");
 		};
 	}, [
-		d,
-		M,
-		L.length,
-		t?.length
-	]), a(() => {
+		h,
+		N,
+		V.length,
+		_,
+		n?.length
+	]), r(() => {
 		if (!s.length) return;
 		let e = I();
-		V(e ? s.filter((t) => !t.id || !e.closed.includes(t.id)) : s);
-	}, [l, s]);
-	let H = (e) => {
+		H(e ? s.filter((t) => !t.id || !e.closed.includes(t.id)) : s);
+	}, [u, s]);
+	let q = (e) => {
 		if (e.preventDefault(), !(e.nativeEvent instanceof KeyboardEvent) || e.nativeEvent.code === "Enter" || e.nativeEvent.code === "Space") {
 			let e = document.querySelector("main");
 			e && (e.scrollIntoView(), e.getAttribute("tabindex") !== "-1" && e.setAttribute("tabindex", "-1"), e.focus());
 		}
-	}, q = () => {
-		F(!P);
-	}, X = (e) => {
-		if (V(L.filter((t) => !t.id || t.id !== e)), !e) return;
+	}, X = () => {
+		L(!F);
+	}, Z = (e) => {
+		if (H(V.filter((t) => !t.id || t.id !== e)), !e) return;
 		let t = I() ?? { closed: [] };
 		t.closed.includes(e) || R(j, JSON.stringify({ closed: [...t.closed, e] }));
 	};
-	return /* @__PURE__ */ k(n, { children: [/* @__PURE__ */ O(Y, {}), /* @__PURE__ */ k("header", {
+	return /* @__PURE__ */ k(a, { children: [/* @__PURE__ */ O(Y, {}), /* @__PURE__ */ k("header", {
 		className: A.header,
 		children: [/* @__PURE__ */ k("div", {
 			className: A.content,
-			ref: N,
+			ref: P,
 			children: [
-				L?.map(({ id: e, content: t, variant: n, closable: r }, i) => /* @__PURE__ */ O(C, {
+				V?.map(({ id: e, content: t, variant: n, closable: r }, i) => /* @__PURE__ */ O(C, {
 					id: e,
 					content: t,
 					variant: n,
 					closable: r,
-					onClose: () => X(e)
+					onClose: () => Z(e)
 				}, i)),
 				/* @__PURE__ */ O("div", {
 					className: o(A.main, A.outer),
@@ -261,14 +266,14 @@ function X({ subItems: t, children: i, notifications: s = J, link: c = "a", host
 								className: A.skip,
 								size: 500,
 								tabIndex: "0",
-								onClick: H,
-								onKeyPress: H,
+								onClick: q,
+								onKeyPress: q,
 								children: "Skip to content"
 							}),
 							/* @__PURE__ */ O(c, {
 								className: A.logo,
-								href: B("https://www.highcharts.com/", l),
-								children: /* @__PURE__ */ O(x, { showText: !w || S && !m })
+								href: B("https://www.highcharts.com/", u),
+								children: /* @__PURE__ */ O(b, { showText: !M || w && !S })
 							}),
 							/* @__PURE__ */ O("ul", {
 								className: A.links,
@@ -276,7 +281,7 @@ function X({ subItems: t, children: i, notifications: s = J, link: c = "a", host
 									variant: "plain",
 									size: 300,
 									as: c,
-									href: B(t, l),
+									href: B(t, u),
 									children: e
 								}) }, n))
 							}),
@@ -286,74 +291,74 @@ function X({ subItems: t, children: i, notifications: s = J, link: c = "a", host
 									/* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(v, {
 										variant: "transparent",
 										as: c,
-										href: B("https://www.highcharts.com/chat/gpt/", l),
+										href: B("https://www.highcharts.com/chat/gpt/", u),
 										children: [/* @__PURE__ */ O("span", {
 											className: A.gpt,
 											children: "Highcharts GPT"
-										}), /* @__PURE__ */ O(p, {})]
+										}), /* @__PURE__ */ O(f, {})]
 									}) }),
 									/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(e, {}) }),
-									/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(b, {}) }),
+									/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(x, {}) }),
 									/* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(v, {
 										className: A.cta,
 										variant: "success",
 										as: c,
-										href: B("https://shop.highcharts.com/", l),
+										href: B("https://shop.highcharts.com/", u),
 										"aria-label": "Buy Now",
-										children: [/* @__PURE__ */ O(h, {}), "Buy Now"]
+										children: [/* @__PURE__ */ O(l, {}), "Buy Now"]
 									}) }),
 									/* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(v, {
 										className: A.cta,
 										variant: "brand",
 										as: c,
-										href: B("https://www.highcharts.com/download/", l),
-										children: [/* @__PURE__ */ O(f, {}), "Try for Free"]
+										href: B("https://www.highcharts.com/download/", u),
+										children: [/* @__PURE__ */ O(d, {}), "Try for Free"]
 									}) }),
 									/* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(v, {
-										variant: P ? "soft" : "transparent",
+										variant: F ? "soft" : "transparent",
 										className: A.menu,
-										onClick: q,
-										children: [P ? "Close" : "Menu", O(P ? g : _, {})]
+										onClick: X,
+										children: [F ? "Close" : "Menu", O(F ? p : g, {})]
 									}) })
 								]
 							})
 						]
 					})
 				}),
-				!!t?.length && /* @__PURE__ */ O(K, {
-					items: t,
+				!!n?.length && /* @__PURE__ */ O(K, {
+					items: n,
 					link: c,
-					host: l,
-					pathname: u
+					host: u,
+					pathname: m
 				}),
 				i
 			]
-		}), S && /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O("div", {
-			className: o(A.mobileOverlay, { [A.open]: P }),
-			onClick: q
+		}), w && /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O("div", {
+			className: o(A.mobileOverlay, { [A.open]: F }),
+			onClick: X
 		}), /* @__PURE__ */ k("nav", {
-			className: o(A.mobile, { [A.open]: P }),
+			className: o(A.mobile, { [A.open]: F }),
 			children: [
 				/* @__PURE__ */ k("div", {
 					className: A.container,
 					children: [/* @__PURE__ */ O(c, {
 						className: A.logo,
-						href: B("https://www.highcharts.com/", l),
-						children: /* @__PURE__ */ O(x, { showText: !m })
+						href: B("https://www.highcharts.com/", u),
+						children: /* @__PURE__ */ O(b, { showText: !S })
 					}), /* @__PURE__ */ k("ul", {
 						className: A.buttons,
 						children: [
 							/* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(v, {
 								variant: "transparent",
 								as: c,
-								href: B("https://www.highcharts.com/chat/gpt/", l),
+								href: B("https://www.highcharts.com/chat/gpt/", u),
 								children: [/* @__PURE__ */ O("span", {
 									className: A.gpt,
 									children: "Highcharts GPT"
-								}), /* @__PURE__ */ O(p, {})]
+								}), /* @__PURE__ */ O(f, {})]
 							}) }),
 							/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(e, {}) }),
-							/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(b, {}) })
+							/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(x, {}) })
 						]
 					})]
 				}),
@@ -363,14 +368,14 @@ function X({ subItems: t, children: i, notifications: s = J, link: c = "a", host
 						variant: "brand",
 						fullWidth: !0,
 						as: c,
-						href: B("https://shop.highcharts.com/", l),
-						children: [/* @__PURE__ */ O(h, {}), "Buy Now"]
+						href: B("https://shop.highcharts.com/", u),
+						children: [/* @__PURE__ */ O(l, {}), "Buy Now"]
 					}) }), /* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(v, {
 						variant: "success",
 						fullWidth: !0,
 						as: c,
-						href: B("https://www.highcharts.com/download/", l),
-						children: [/* @__PURE__ */ O(f, {}), "Try for Free"]
+						href: B("https://www.highcharts.com/download/", u),
+						children: [/* @__PURE__ */ O(d, {}), "Try for Free"]
 					}) })]
 				}),
 				/* @__PURE__ */ O("ul", {
@@ -380,7 +385,7 @@ function X({ subItems: t, children: i, notifications: s = J, link: c = "a", host
 						size: 500,
 						fullWidth: !0,
 						as: c,
-						href: B(t, l),
+						href: B(t, u),
 						children: [n, e]
 					}) }, r))
 				})

package/dist/Heading-DuolDa27.js

@@ -0,0 +1,19 @@
+import { t as e } from "./clsx-D7D_XZ_-.js";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+var r = {
+	h1: "_5UYr1G_h1",
+	h2: "_5UYr1G_h2",
+	h3: "_5UYr1G_h3",
+	h4: "_5UYr1G_h4",
+	h5: "_5UYr1G_h5",
+	h6: "_5UYr1G_h6",
+	heading: "_5UYr1G_heading"
+}, i = t(({ children: t, level: i = 2, as: a, className: o, ...s }, c) => /* @__PURE__ */ n(a || `h${i}`, {
+	className: e("hsui-heading", o, r.heading, r[`h${i}`]),
+	ref: c,
+	...s,
+	children: t
+}));
+//#endregion
+export { i as t };

package/dist/Icon-Dwo9ZDNX.js

@@ -0,0 +1,31 @@
+import { t as e } from "./clsx-D7D_XZ_-.js";
+import { jsx as t } from "react/jsx-runtime";
+var n = { icon: "_2G93rW_icon" }, r = {
+	12: 1,
+	16: 1.33,
+	20: 1.67,
+	24: 2,
+	32: 2.66,
+	40: 3,
+	52: 4.33,
+	64: 5.33,
+	72: 6
+};
+function i({ name: i, size: a = 24, className: o, strokeWidth: s, ...c }) {
+	let l = s ?? r[a];
+	return /* @__PURE__ */ t("span", {
+		className: e("hsui-icon", n.icon, o),
+		style: {
+			width: a,
+			height: a
+		},
+		children: /* @__PURE__ */ t(i, {
+			width: a,
+			height: a,
+			strokeWidth: l,
+			...c
+		})
+	});
+}
+//#endregion
+export { i as t };

package/dist/InputGrouped-CiA86XL7.js

@@ -0,0 +1,221 @@
+import { t as e } from "./clsx-D7D_XZ_-.js";
+import { D as t, E as n, j as r } from "./esm-T3Xn_ZHF.js";
+import { t as i } from "./Button-CJp__tle.js";
+import { forwardRef as a, useCallback as o, useEffect as s, useRef as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+var f = {
+	autofilled: "rqAgta_autofilled",
+	chevron: "rqAgta_chevron",
+	content: "rqAgta_content",
+	dirty: "rqAgta_dirty",
+	disabled: "rqAgta_disabled",
+	focus: "rqAgta_focus",
+	formGroup: "rqAgta_formGroup",
+	formRow: "rqAgta_formRow",
+	hasError: "rqAgta_hasError",
+	helpText: "rqAgta_helpText",
+	iconRight: "rqAgta_iconRight",
+	inputElement: "rqAgta_inputElement",
+	inputGrouped: "rqAgta_inputGrouped",
+	label: "rqAgta_label",
+	labelIcon: "rqAgta_labelIcon",
+	labelRow: "rqAgta_labelRow",
+	leftContent: "rqAgta_leftContent",
+	onAutoFillStart: "rqAgta_onAutoFillStart",
+	open: "rqAgta_open",
+	required: "rqAgta_required",
+	rightContent: "rqAgta_rightContent",
+	selectElement: "rqAgta_selectElement",
+	selectGrouped: "rqAgta_selectGrouped",
+	success: "rqAgta_success"
+}, p = a(({ children: t, className: n, ...r }, i) => /* @__PURE__ */ u("form", {
+	ref: i,
+	className: e("hsui-form-group", f.formGroup, n),
+	...r,
+	children: t
+}));
+function m({ children: t, className: n }) {
+	return /* @__PURE__ */ u("div", {
+		className: e("hsui-form-row", f.formRow, n),
+		children: t
+	});
+}
+var h = a(({ label: r, required: a = !1, helpText: p, showHelpText: m = !1, labelIcon: h, iconRight: g, button: _, hasError: v = !1, success: y = !1, disabled: b = !1, className: x, wrapperClassName: S, type: C, onFocus: w, onBlur: T, value: E, defaultValue: D, ...O }, k) => {
+	let A = c(null), j = k || A, [M, N] = l(!1), [P, F] = l(!1), [I, L] = l(!1), R = C === "password", [z, B] = l(D === void 0 ? "" : String(D)), V = E !== void 0, H = V ? String(E).length > 0 : z.length > 0, U = o((e) => {
+		N(!0), w?.(e);
+	}, [w]), W = o((e) => {
+		N(!1), T?.(e);
+	}, [T]), G = o((e) => {
+		V || B(e.target.value), O.onChange?.(e);
+	}, [V, O.onChange]), K = o((e) => {
+		e.animationName.includes("onAutoFillStart") && F(!0);
+	}, []);
+	s(() => {
+		let e = j.current;
+		if (!e) return;
+		let t = () => {
+			try {
+				e.matches(":-webkit-autofill") && F(!0);
+			} catch {}
+		}, n = setTimeout(t, 100), r = setTimeout(t, 500);
+		return () => {
+			clearTimeout(n), clearTimeout(r);
+		};
+	}, [j]);
+	let q = o(() => {
+		!b && j.current && j.current.focus();
+	}, [b, j]), J = R && I ? "text" : C;
+	return /* @__PURE__ */ u("div", {
+		onClick: q,
+		className: e("hsui-input-grouped", f.inputGrouped, {
+			[f.focus]: M,
+			[f.hasError]: v,
+			[f.success]: y,
+			[f.disabled]: b,
+			[f.dirty]: H || P,
+			[f.autofilled]: P
+		}, S),
+		children: /* @__PURE__ */ d("div", {
+			className: f.content,
+			children: [/* @__PURE__ */ d("div", {
+				className: f.leftContent,
+				children: [
+					r && /* @__PURE__ */ d("div", {
+						className: f.labelRow,
+						children: [h && /* @__PURE__ */ u("span", {
+							className: f.labelIcon,
+							children: h
+						}), /* @__PURE__ */ d("span", {
+							className: f.label,
+							children: [r, a && /* @__PURE__ */ u("span", {
+								className: f.required,
+								children: " *"
+							})]
+						})]
+					}),
+					/* @__PURE__ */ u("input", {
+						ref: j,
+						type: J,
+						className: e(f.inputElement, x),
+						disabled: b,
+						"aria-label": r,
+						"aria-required": a,
+						"aria-invalid": v,
+						value: E,
+						defaultValue: D,
+						onFocus: U,
+						onBlur: W,
+						onChange: G,
+						onAnimationStart: K,
+						...O
+					}),
+					m && p && /* @__PURE__ */ u("span", {
+						className: f.helpText,
+						children: p
+					})
+				]
+			}), (g || _ || R) && /* @__PURE__ */ d("div", {
+				className: f.rightContent,
+				children: [
+					g && /* @__PURE__ */ u("span", {
+						className: f.iconRight,
+						children: g
+					}),
+					R && /* @__PURE__ */ u(i, {
+						type: "button",
+						variant: "plain",
+						size: 300,
+						onClick: (e) => {
+							e.stopPropagation(), L((e) => !e);
+						},
+						"aria-label": I ? "Hide password" : "Show password",
+						children: u(I ? n : t, {})
+					}),
+					_
+				]
+			})]
+		})
+	});
+}), g = a(({ label: t, required: n = !1, helpText: i, showHelpText: a = !1, labelIcon: s, hasError: p = !1, success: m = !1, disabled: h = !1, className: g, wrapperClassName: _, placeholder: v, children: y, onFocus: b, onBlur: x, value: S, defaultValue: C, ...w }, T) => {
+	let E = c(null), D = T || E, [O, k] = l(!1), [A, j] = l(!1), [M, N] = l(C === void 0 ? "" : String(C)), P = S !== void 0, F = P ? String(S).length > 0 : M.length > 0, I = o((e) => {
+		k(!0), b?.(e);
+	}, [b]), L = o((e) => {
+		k(!1), j(!1), x?.(e);
+	}, [x]), R = o((e) => {
+		j(!1), P || N(e.target.value), w.onChange?.(e);
+	}, [P, w.onChange]);
+	return /* @__PURE__ */ u("div", {
+		onClick: o((e) => {
+			if (!(h || !D.current) && (j((e) => !e), e.target !== D.current)) try {
+				D.current.showPicker();
+			} catch {
+				let e = new MouseEvent("mousedown", {
+					bubbles: !0,
+					cancelable: !0
+				});
+				D.current.dispatchEvent(e);
+			}
+		}, [h, D]),
+		className: e("hsui-select-grouped", f.inputGrouped, f.selectGrouped, {
+			[f.focus]: O,
+			[f.open]: A,
+			[f.hasError]: p,
+			[f.success]: m,
+			[f.disabled]: h,
+			[f.dirty]: F
+		}, _),
+		children: /* @__PURE__ */ d("div", {
+			className: f.content,
+			children: [/* @__PURE__ */ d("div", {
+				className: f.leftContent,
+				children: [
+					t && /* @__PURE__ */ d("div", {
+						className: f.labelRow,
+						children: [s && /* @__PURE__ */ u("span", {
+							className: f.labelIcon,
+							children: s
+						}), /* @__PURE__ */ d("span", {
+							className: f.label,
+							children: [t, n && /* @__PURE__ */ u("span", {
+								className: f.required,
+								children: " *"
+							})]
+						})]
+					}),
+					/* @__PURE__ */ d("select", {
+						ref: D,
+						className: e(f.inputElement, f.selectElement, g),
+						disabled: h,
+						"aria-label": t,
+						"aria-required": n,
+						"aria-invalid": p,
+						value: S,
+						defaultValue: C,
+						onFocus: I,
+						onBlur: L,
+						onChange: R,
+						...w,
+						children: [v && /* @__PURE__ */ u("option", {
+							value: "",
+							disabled: !0,
+							hidden: !1,
+							children: v
+						}), y]
+					}),
+					a && i && /* @__PURE__ */ u("span", {
+						className: f.helpText,
+						children: i
+					})
+				]
+			}), /* @__PURE__ */ u("div", {
+				className: f.rightContent,
+				children: /* @__PURE__ */ u("span", {
+					className: e(f.iconRight, f.chevron),
+					children: /* @__PURE__ */ u(r, {})
+				})
+			})]
+		})
+	});
+});
+//#endregion
+export { g as i, m as n, h as r, p as t };