highsoft-ui 1.0.153 → 1.0.155

package/dist/components/ProductIcon/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../ProductIcon-DFLAYWbu.js";
+import { t as e } from "../../ProductIcon-CKtF7AWy.js";
 export { e as ProductIcon };

package/dist/components/RoadmapDetails/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../RoadmapDetails-XS0OylnP.js";
+import { t as e } from "../../RoadmapDetails-ZnyXG2j7.js";
 export { e as RoadmapDetails };

package/dist/components/Search/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../Search-UPVxQliM.js";
+import { t as e } from "../../Search-Cc9ZJgGx.js";
 export { e as Search };

package/dist/components/SearchDropdown/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../SearchDropdown-L_rQz1vn.js";
+import { t as e } from "../../SearchDropdown-B5CFwNib.js";
 export { e as SearchDropdown };

package/dist/components/Sidebar/NavDisclosure.js

@@ -1,39 +1,34 @@
 "use client";
 import { t as e } from "../../clsx-BWCAbrjV.js";
-import { t } from "../../styles.module-Bd4HbnpA.js";
-import { useId as n, useState as r } from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { K as t } from "../../esm-C4Ybr9s4.js";
+import { t as n } from "../../Icon-VeXJMj8Q.js";
+import { t as r } from "../../styles.module-DGKft2EO.js";
+import { useId as i, useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region lib/components/Sidebar/NavDisclosure.tsx
-function o({ label: o, children: s, className: c }) {
-	let [l, u] = r(!1), d = n();
-	return /* @__PURE__ */ a("div", {
-		className: e(t.disclosure, c),
-		"data-open": l,
-		children: [/* @__PURE__ */ a("button", {
+function c({ label: c, children: l, className: u }) {
+	let [d, f] = a(!1), p = i();
+	return /* @__PURE__ */ s("div", {
+		className: e(r.disclosure, u),
+		"data-open": d,
+		children: [/* @__PURE__ */ s("button", {
 			type: "button",
-			className: t.disclosureToggle,
-			"aria-expanded": l,
-			"aria-controls": d,
-			onClick: () => u((e) => !e),
-			children: [/* @__PURE__ */ i("svg", {
-				className: t.disclosureChevron,
-				width: "14",
-				height: "14",
-				viewBox: "0 0 24 24",
-				fill: "none",
-				stroke: "currentColor",
-				strokeWidth: "2.5",
-				strokeLinecap: "round",
-				strokeLinejoin: "round",
-				"aria-hidden": "true",
-				children: /* @__PURE__ */ i("path", { d: "m9 18 6-6-6-6" })
-			}), /* @__PURE__ */ i("span", { children: o })]
-		}), /* @__PURE__ */ i("div", {
-			id: d,
-			className: t.disclosureBody,
-			children: s
+			className: r.disclosureToggle,
+			"aria-expanded": d,
+			"aria-controls": p,
+			onClick: () => f((e) => !e),
+			children: [/* @__PURE__ */ o(n, {
+				name: t,
+				size: 16,
+				className: r.disclosureChevron,
+				"aria-hidden": "true"
+			}), /* @__PURE__ */ o("span", { children: c })]
+		}), /* @__PURE__ */ o("div", {
+			id: p,
+			className: r.disclosureBody,
+			children: l
 		})]
 	});
 }
 //#endregion
-export { o as NavDisclosure };
+export { c as NavDisclosure };

package/dist/components/Sidebar/NavGroup.js

@@ -1,74 +1,87 @@
 "use client";
 import { t as e } from "../../clsx-BWCAbrjV.js";
-import { useOptionalSidebarSection as t } from "./context.js";
-import { t as n } from "../../styles.module-Bd4HbnpA.js";
-import { createContext as r, useCallback as i, useContext as a, useEffect as o, useId as s, useRef as c, useState as l } from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { K as t } from "../../esm-C4Ybr9s4.js";
+import { t as n } from "../../Icon-VeXJMj8Q.js";
+import { useOptionalSidebarSection as r } from "./context.js";
+import { t as i } from "../../styles.module-DGKft2EO.js";
+import { NavPathContext as a, textOf as o, useNavPath as s } from "./navPath.js";
+import { useCallback as c, useEffect as l, useId as u, useMemo as d, useRef as f, useState as p } from "react";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region lib/components/Sidebar/NavGroup.tsx
-var f = r(0);
-function p({ label: r, children: p, icon: m, defaultOpen: h = !1, open: g, onOpenChange: _, active: v, className: y }) {
-	let [b, x] = l(h), S = g !== void 0, C = S ? g : b, w = s(), T = s(), E = t(), D = a(f), O = i((e) => {
-		S || x(e), _?.(e);
-	}, [S, _]), k = i(() => O(!C), [C, O]);
-	o(() => (E?.reportOpen(T, C), () => E?.reportOpen(T, !1)), [
-		C,
-		T,
-		E
+var g = "grid-template-rows";
+function _({ label: _, children: v, icon: y, defaultOpen: b = !1, open: x, onOpenChange: S, active: C, className: w }) {
+	let [T, E] = p(b), D = x !== void 0, O = D ? x : T, k = u(), A = u(), j = r(), M = s(), N = M.length, P = o(_), F = d(() => [...M, P], [M, P]), I = c((e) => {
+		D || E(e), S?.(e);
+	}, [D, S]), L = c(() => I(!O), [O, I]);
+	l(() => (j?.reportOpen(A, O), () => j?.reportOpen(A, !1)), [
+		O,
+		A,
+		j
 	]);
-	let A = c(E?.collapseNonce ?? 0);
-	return o(() => {
-		let e = E?.collapseNonce ?? 0;
-		e !== A.current && (A.current = e, C && O(!1));
+	let [R, z] = p(!1), B = f(null), V = f(O);
+	V.current !== O && (V.current = O, z(O)), l(() => {
+		if (!R) return;
+		let e = B.current;
+		if (!e) return;
+		if (!parseFloat(getComputedStyle(e).transitionDuration)) {
+			z(!1);
+			return;
+		}
+		let t = (t) => {
+			t.target === e && t.propertyName === g && z(!1);
+		};
+		return e.addEventListener("transitionend", t), e.addEventListener("transitioncancel", t), () => {
+			e.removeEventListener("transitionend", t), e.removeEventListener("transitioncancel", t);
+		};
+	}, [R]);
+	let H = f(j?.collapseNonce ?? 0);
+	return l(() => {
+		let e = j?.collapseNonce ?? 0;
+		e !== H.current && (H.current = e, O && I(!1));
 	}, [
-		E?.collapseNonce,
-		C,
-		E,
-		O
-	]), /* @__PURE__ */ d("div", {
-		className: e(n.group, C && n.groupOpen, v && n.groupActive, y),
-		style: { "--hs-nav-depth": D },
-		children: [/* @__PURE__ */ d("button", {
+		j?.collapseNonce,
+		O,
+		j,
+		I
+	]), /* @__PURE__ */ h("div", {
+		className: e(i.group, O && i.groupOpen, R && i.groupExpanding, C && i.groupActive, w),
+		style: { "--hs-nav-depth": N },
+		children: [/* @__PURE__ */ h("button", {
 			type: "button",
-			className: n.groupToggle,
-			"aria-expanded": C,
-			"aria-controls": w,
-			onClick: k,
+			className: i.groupToggle,
+			"aria-expanded": O,
+			"aria-controls": k,
+			onClick: L,
 			children: [
-				/* @__PURE__ */ u("svg", {
-					className: n.groupChevron,
-					width: "14",
-					height: "14",
-					viewBox: "0 0 24 24",
-					fill: "none",
-					stroke: "currentColor",
-					strokeWidth: "2.5",
-					strokeLinecap: "round",
-					strokeLinejoin: "round",
-					"aria-hidden": "true",
-					children: /* @__PURE__ */ u("path", { d: "m9 18 6-6-6-6" })
+				/* @__PURE__ */ m(n, {
+					name: t,
+					size: 16,
+					className: i.groupChevron,
+					"aria-hidden": "true"
 				}),
-				m == null ? null : /* @__PURE__ */ u("span", {
-					className: n.itemIcon,
-					children: m
+				y == null ? null : /* @__PURE__ */ m("span", {
+					className: i.itemIcon,
+					children: y
 				}),
-				/* @__PURE__ */ u("span", {
-					className: n.groupLabel,
-					children: r
+				/* @__PURE__ */ m("span", {
+					className: i.groupLabel,
+					children: _
 				})
 			]
-		}), /* @__PURE__ */ u("div", {
-			id: w,
-			className: n.groupChildren,
+		}), /* @__PURE__ */ m("div", {
+			ref: B,
+			id: k,
+			className: i.groupChildren,
 			role: "group",
-			children: /* @__PURE__ */ u("div", {
-				className: n.groupChildrenInner,
-				children: /* @__PURE__ */ u(f.Provider, {
-					value: D + 1,
-					children: p
+			children: /* @__PURE__ */ m("div", {
+				className: i.groupChildrenInner,
+				children: /* @__PURE__ */ m(a.Provider, {
+					value: F,
+					children: v
 				})
 			})
 		})]
 	});
 }
 //#endregion
-export { p as NavGroup };
+export { _ as NavGroup };

package/dist/components/Sidebar/NavItem.js

@@ -1,28 +1,35 @@
 "use client";
 import { t as e } from "../../clsx-BWCAbrjV.js";
 import { useOptionalSidebarLayout as t } from "./context.js";
-import { t as n } from "../../styles.module-Bd4HbnpA.js";
-import { forwardRef as r } from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { t as n } from "../../styles.module-DGKft2EO.js";
+import { textOf as r, useNavPath as i } from "./navPath.js";
+import { forwardRef as a, useEffect as o, useId as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region lib/components/Sidebar/NavItem.tsx
-var o = r(function({ as: r, active: o, icon: s, children: c, className: l, onClick: u, ...d }, f) {
-	let p = r || "a", m = t();
-	return /* @__PURE__ */ a(p, {
-		ref: f,
-		className: e(n.item, o && n.itemActive, l),
-		"aria-current": o ? "page" : void 0,
+var u = 350, d = a(function({ as: a, active: d, icon: f, children: p, className: m, onClick: h, ...g }, _) {
+	let v = a || "a", y = t(), b = s(), x = i(), S = r(p), C = d && S ? [...x.filter(Boolean), S].slice(-2).join(" / ") : null, w = y?.reportActivePage;
+	return o(() => {
+		if (w) return w(b, C), () => w(b, null);
+	}, [
+		w,
+		b,
+		C
+	]), /* @__PURE__ */ l(v, {
+		ref: _,
+		className: e(n.item, d && n.itemActive, m),
+		"aria-current": d ? "page" : void 0,
 		onClick: (e) => {
-			u?.(e), m?.closeMobile();
+			h?.(e), y && (window.matchMedia("(pointer: coarse)").matches && y.isMobile && y.mobileOpen ? window.setTimeout(() => y.closeMobile(), u) : y.closeMobile());
 		},
-		...d,
-		children: [s == null ? null : /* @__PURE__ */ i("span", {
+		...g,
+		children: [f == null ? null : /* @__PURE__ */ c("span", {
 			className: n.itemIcon,
-			children: s
-		}), /* @__PURE__ */ i("span", {
+			children: f
+		}), /* @__PURE__ */ c("span", {
 			className: n.itemLabel,
-			children: c
+			children: p
 		})]
 	});
 });
 //#endregion
-export { o as NavItem };
+export { d as NavItem };

package/dist/components/Sidebar/Sidebar.js

@@ -1,107 +1,140 @@
 "use client";
 import { t as e } from "../../clsx-BWCAbrjV.js";
-import { t } from "../../Button-BGsqFCRW.js";
-import { SidebarSectionContext as n, useSidebarLayout as r } from "./context.js";
-import { t as i } from "../../styles.module-Bd4HbnpA.js";
-import { SidebarResizer as a } from "./SidebarResizer.js";
-import { 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";
+import { E as t, t as n } from "../../esm-C4Ybr9s4.js";
+import { t as r } from "../../Button-DSGsV45k.js";
+import { t as i } from "../../Icon-VeXJMj8Q.js";
+import { t as a } from "../../Typography-AvvBRu-u.js";
+import { SidebarSectionContext as o, useSidebarLayout as s } from "./context.js";
+import { t as c } from "../../styles.module-DGKft2EO.js";
+import { SidebarResizer as l } from "./SidebarResizer.js";
+import { useCallback as u, useEffect as d, useRef as f, useState as p } from "react";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region lib/components/Sidebar/Sidebar.tsx
-function f({ children: t, "aria-label": n = "Sidebar navigation", closeLabel: o = "Close navigation", className: l }) {
-	let { resizable: f, mobileOpen: p, closeMobile: m } = r(), h = c(null);
-	return s(() => {
-		p && h.current?.focus();
-	}, [p]), /* @__PURE__ */ d("aside", {
+var g = 72, _ = 56, v = .84, y = "a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"])";
+function b({ children: t, "aria-label": a = "Sidebar navigation", closeLabel: o = "Close navigation", className: p }) {
+	let { resizable: b, isMobile: x, mobileOpen: S, closeMobile: C, openFocus: w } = s(), T = f(null), E = x && S;
+	d(() => {
+		let e = T.current;
+		!S || !e || ((w === "search" ? e.querySelector(`.${c.header} input:not([type='hidden']):not([disabled])`) : null) ?? e).focus();
+	}, [S, w]), d(() => {
+		let e = window.visualViewport, t = T.current;
+		if (!E || !e || !t) return;
+		let n = () => {
+			let n = document.documentElement.clientHeight, r = Math.max(0, Math.round(n - e.offsetTop - e.height)), i = Math.max(0, Math.round(Math.min(e.height - _, n * v)));
+			t.style.setProperty("--hs-sheet-lift", `${r}px`), t.style.setProperty("--hs-sheet-max-h", `${i}px`);
+		};
+		return n(), e.addEventListener("resize", n), e.addEventListener("scroll", n), () => {
+			e.removeEventListener("resize", n), e.removeEventListener("scroll", n), t.style.removeProperty("--hs-sheet-lift"), t.style.removeProperty("--hs-sheet-max-h");
+		};
+	}, [E]), d(() => {
+		if (!E) return;
+		let e = (e) => {
+			let t = T.current;
+			if (e.key !== "Tab" || !t) return;
+			let n = Array.from(t.querySelectorAll(y)).filter((e) => e.offsetParent !== null || e === document.activeElement);
+			if (!n.length) return;
+			let r = n[0], i = n[n.length - 1], a = document.activeElement;
+			a === t ? e.shiftKey && (e.preventDefault(), i.focus()) : t.contains(a) ? a === (e.shiftKey ? r : i) && (e.preventDefault(), (e.shiftKey ? i : r).focus()) : (e.preventDefault(), r.focus());
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [E]);
+	let D = f(!1), O = f(0), k = f(0), A = u((e) => {
+		D.current = !1;
+		let t = T.current;
+		t?.classList.remove(c.sheetDragging), t?.style.removeProperty("--hs-sheet-dy"), e && C();
+	}, [C]), j = (e) => {
+		E && (e.currentTarget.setPointerCapture(e.pointerId), D.current = !0, O.current = e.clientY, k.current = 0, T.current?.classList.add(c.sheetDragging));
+	}, M = (e) => {
+		D.current && (k.current = Math.max(0, e.clientY - O.current), T.current?.style.setProperty("--hs-sheet-dy", `${k.current}px`));
+	}, N = (e) => {
+		D.current && (e.currentTarget.hasPointerCapture(e.pointerId) && e.currentTarget.releasePointerCapture(e.pointerId), A(k.current > g));
+	};
+	return d(() => {
+		!S && D.current && A(!1);
+	}, [S, A]), /* @__PURE__ */ h("aside", {
+		ref: T,
 		id: "hs-sidebar-drawer",
-		className: e(i.sidebar, p && i.sidebarOpen, l),
-		"aria-label": n,
+		className: e(c.sidebar, S && c.sidebarOpen, p),
+		"aria-label": a,
+		role: E ? "dialog" : void 0,
+		"aria-modal": E ? !0 : void 0,
+		tabIndex: -1,
+		inert: x && !S ? !0 : void 0,
 		children: [
-			/* @__PURE__ */ u("button", {
-				ref: h,
-				type: "button",
-				className: i.close,
-				"aria-label": o,
-				onClick: m,
-				children: /* @__PURE__ */ u(_, {})
+			/* @__PURE__ */ m("div", {
+				className: c.grabber,
+				"aria-hidden": "true",
+				onPointerDown: j,
+				onPointerMove: M,
+				onPointerUp: N,
+				onPointerCancel: N,
+				children: /* @__PURE__ */ m("span", { className: c.grabberPill })
 			}),
+			x ? /* @__PURE__ */ m("span", {
+				className: c.close,
+				children: /* @__PURE__ */ m(r, {
+					variant: "plain",
+					size: 300,
+					"aria-label": o,
+					onClick: C,
+					children: /* @__PURE__ */ m(i, {
+						name: n,
+						size: 16
+					})
+				})
+			}) : null,
 			t,
-			f ? /* @__PURE__ */ u(a, {}) : null
+			b ? /* @__PURE__ */ m(l, {}) : null
 		]
 	});
 }
-function p({ children: t, className: n }) {
-	return /* @__PURE__ */ u("div", {
-		className: e(i.header, n),
+function x({ children: t, className: n }) {
+	return /* @__PURE__ */ m("div", {
+		className: e(c.header, n),
 		children: t
 	});
 }
-function m({ children: t, className: n }) {
-	return /* @__PURE__ */ u("div", {
-		className: e(i.body, n),
+function S({ children: t, className: n }) {
+	return /* @__PURE__ */ m("div", {
+		className: e(c.body, n),
 		children: t
 	});
 }
-function h({ children: r, label: a, collapsible: s = !1, minimizeLabel: f = "Minimize", action: p, className: m }) {
-	let [h, _] = l(0), v = c(/* @__PURE__ */ new Set()), [y, b] = l(0), x = o((e, t) => {
-		let n = v.current;
-		t ? n.add(e) : n.delete(e), b(n.size);
-	}, []), S = s && p == null && y > 0, C = a != null || p != null || S;
-	return /* @__PURE__ */ u(n.Provider, {
+function C({ children: n, label: s, collapsible: l = !1, minimizeLabel: d = "Minimize", action: g, className: _ }) {
+	let [v, y] = p(0), b = f(/* @__PURE__ */ new Set()), [x, S] = p(0), C = u((e, t) => {
+		let n = b.current;
+		t ? n.add(e) : n.delete(e), S(n.size);
+	}, []), w = l && g == null && x > 0, T = s != null || g != null || w;
+	return /* @__PURE__ */ m(o.Provider, {
 		value: {
-			collapseNonce: h,
-			reportOpen: x
+			collapseNonce: v,
+			reportOpen: C
 		},
-		children: /* @__PURE__ */ d("section", {
-			className: e(i.section, C && i.hasStickyHead, m),
-			children: [C ? /* @__PURE__ */ d("div", {
-				className: i.sectionHead,
-				children: [a == null ? null : /* @__PURE__ */ u("h3", {
-					className: i.sectionLabel,
-					children: a
-				}), p ?? (S ? /* @__PURE__ */ u(t, {
+		children: /* @__PURE__ */ h("section", {
+			className: e(c.section, T && c.hasStickyHead, _),
+			children: [T ? /* @__PURE__ */ h("div", {
+				className: c.sectionHead,
+				children: [s == null ? null : /* @__PURE__ */ m(a, {
+					as: "h3",
+					size: 75,
+					weight: "semi",
+					color: "secondary",
+					className: c.sectionLabel,
+					children: s
+				}), g ?? (w ? /* @__PURE__ */ m(r, {
 					variant: "plain",
 					size: 100,
-					className: i.minimizeBtn,
-					iconLeft: /* @__PURE__ */ u(g, {}),
-					onClick: () => _((e) => e + 1),
-					children: f
+					className: c.minimizeBtn,
+					iconLeft: /* @__PURE__ */ m(i, {
+						name: t,
+						size: 12
+					}),
+					onClick: () => y((e) => e + 1),
+					children: d
 				}) : null)]
-			}) : null, r]
+			}) : null, n]
 		})
 	});
 }
-function g() {
-	return /* @__PURE__ */ d("svg", {
-		width: "14",
-		height: "14",
-		viewBox: "0 0 16 16",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: "1.25",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		"aria-hidden": "true",
-		children: [/* @__PURE__ */ u("rect", {
-			x: "2.5",
-			y: "2.5",
-			width: "11",
-			height: "11",
-			rx: "2"
-		}), /* @__PURE__ */ u("path", { d: "M5.5 8h5" })]
-	});
-}
-function _() {
-	return /* @__PURE__ */ u("svg", {
-		width: "18",
-		height: "18",
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: "2",
-		strokeLinecap: "round",
-		"aria-hidden": "true",
-		children: /* @__PURE__ */ u("path", { d: "M18 6 6 18M6 6l12 12" })
-	});
-}
 //#endregion
-export { f as Sidebar, m as SidebarBody, p as SidebarHeader, h as SidebarSection };
+export { b as Sidebar, S as SidebarBody, x as SidebarHeader, C as SidebarSection };