@topjoao/top-design-system 0.1.0-beta.14 → 0.1.0-beta.15

package/dist/{TopToast-CyPhPcN4.js → TopToast-CXC-8FkA.js}

@@ -434,7 +434,21 @@ var B = { class: "top-button top-solutions-component h-fit w-fit rounded-[12px]
 	strokeLinejoin: "round",
 	strokeWidth: "1.5",
 	key: "1"
-}]], Q = l({
+}]], Q = [["path", {
+	d: "M12.8924 2.80982L21.4876 9.59547C21.8112 9.85095 22 10.2405 22 10.6528C22 11.3969 21.3969 12 20.6528 12H20V15.5C20 18.3284 20 19.7426 19.1213 20.6213C18.2426 21.5 16.8284 21.5 14 21.5H10C7.17157 21.5 5.75736 21.5 4.87868 20.6213C4 19.7426 4 18.3284 4 15.5V12H3.34716C2.60315 12 2 11.3969 2 10.6528C2 10.2405 2.1888 9.85095 2.5124 9.59547L11.1076 2.80982C11.3617 2.60915 11.6761 2.5 12 2.5C12.3239 2.5 12.6383 2.60915 12.8924 2.80982Z",
+	stroke: "currentColor",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	strokeWidth: "1.5",
+	key: "0"
+}], ["path", {
+	d: "M14.5 21.5V17C14.5 16.0654 14.5 15.5981 14.299 15.25C14.1674 15.022 13.978 14.8326 13.75 14.701C13.4019 14.5 12.9346 14.5 12 14.5C11.0654 14.5 10.5981 14.5 10.25 14.701C10.022 14.8326 9.83261 15.022 9.70096 15.25C9.5 15.5981 9.5 16.0654 9.5 17V21.5",
+	stroke: "currentColor",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	strokeWidth: "1.5",
+	key: "1"
+}]], $ = l({
 	name: "HugeiconsIcon",
 	inheritAttrs: !1,
 	props: {
@@ -492,16 +506,16 @@ var B = { class: "top-button top-solutions-component h-fit w-fit rounded-[12px]
 			currentIcon: t(() => e.altIcon && e.showAlt ? e.altIcon : e.icon)
 		};
 	}
-}), $ = (e, t) => {
+}), re = (e, t) => {
 	let n = e.__vccOpts || e;
 	for (let [e, r] of t) n[e] = r;
 	return n;
-}, re = [
+}, ie = [
 	"width",
 	"height",
 	"color"
 ];
-function ie(t, r, a, o, s, c) {
+function ae(t, r, a, o, s, c) {
 	return v(), i("svg", d({
 		width: t.computedSize,
 		height: t.computedSize,
@@ -512,30 +526,30 @@ function ie(t, r, a, o, s, c) {
 	}, t.$attrs), [(v(!0), i(e, null, b(t.currentIcon, (e, r) => (v(), n(S(e[0]), d({
 		key: r,
 		ref_for: !0
-	}, t.transformAttrs(e[1], t.calculatedStrokeWidth)), null, 16))), 128))], 16, re);
+	}, t.transformAttrs(e[1], t.calculatedStrokeWidth)), null, 16))), 128))], 16, ie);
 }
-var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/Desktop/Projects/Hugeicons/hugeicons-monorepo/packages/vue/src/components/HugeiconsIcon.vue"]]), oe = { class: "top-file-upload top-solutions-component flex w-full flex-col gap-1" }, se = ["for"], ce = {
+var oe = /* @__PURE__ */ re($, [["render", ae], ["__file", "/Users/mahmudulhasan/Desktop/Projects/Hugeicons/hugeicons-monorepo/packages/vue/src/components/HugeiconsIcon.vue"]]), se = { class: "top-file-upload top-solutions-component flex w-full flex-col gap-1" }, ce = ["for"], le = {
 	key: 0,
 	"aria-hidden": "true",
 	class: "text-red-600 dark:text-red-400"
-}, le = { class: "flex min-h-[130px] w-full flex-col items-center justify-center gap-3" }, ue = {
+}, ue = { class: "flex min-h-[130px] w-full flex-col items-center justify-center gap-3" }, de = {
 	class: "top-file-upload__empty-icon",
 	"aria-hidden": "true"
-}, de = {
+}, fe = {
 	key: 0,
 	"aria-label": "Carregando...",
 	class: "pi pi-spin pi-spinner text-5xl"
-}, fe = { class: "m-0 text-center text-xs text-secondary-600 dark:text-zinc-300" }, pe = {
+}, pe = { class: "m-0 text-center text-xs text-secondary-600 dark:text-zinc-300" }, me = {
 	key: 1,
 	class: "flex w-full flex-col gap-2"
-}, me = ["src", "alt"], he = {
+}, he = ["src", "alt"], ge = {
 	key: 1,
 	class: "flex size-12 shrink-0 items-center justify-center rounded-lg bg-primary-50 text-primary-800 dark:bg-primary-950 dark:text-primary-200"
-}, ge = { class: "min-w-0 flex-1" }, _e = { class: "m-0 truncate text-xs font-bold text-secondary-900 dark:text-zinc-100" }, ve = { class: "text-[11px] text-secondary-500 dark:text-zinc-400" }, ye = [
+}, _e = { class: "min-w-0 flex-1" }, ve = { class: "m-0 truncate text-xs font-bold text-secondary-900 dark:text-zinc-100" }, ye = { class: "text-[11px] text-secondary-500 dark:text-zinc-400" }, be = [
 	"aria-label",
 	"disabled",
 	"onClick"
-], be = ["id"], xe = /* @__PURE__ */ l({
+], xe = ["id"], Se = /* @__PURE__ */ l({
 	inheritAttrs: !1,
 	__name: "TopFileUpload",
 	props: {
@@ -685,12 +699,12 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 		}), l({
 			choose: Z,
 			clear: te
-		}), (t, l) => (v(), i("div", oe, [
+		}), (t, l) => (v(), i("div", se, [
 			o.label ? (v(), i("label", {
 				key: 0,
 				for: M.value,
 				class: "text-xs font-bold text-secondary-800 dark:text-zinc-200"
-			}, [s(C(o.label) + " ", 1), o.required ? (v(), i("span", ce, "*")) : r("", !0)], 8, se)) : r("", !0),
+			}, [s(C(o.label) + " ", 1), o.required ? (v(), i("span", le, "*")) : r("", !0)], 8, ce)) : r("", !0),
 			c(w(I), {
 				ref_key: "fileUploadRef",
 				ref: S,
@@ -713,7 +727,7 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 				},
 				onSelect: Y
 			}, {
-				content: k(({ removeFileCallback: s }) => [a("div", le, [D.value.length ? (v(), i("div", pe, [(v(!0), i(e, null, b(D.value, (e, n) => (v(), i("div", {
+				content: k(({ removeFileCallback: s }) => [a("div", ue, [D.value.length ? (v(), i("div", me, [(v(!0), i(e, null, b(D.value, (e, n) => (v(), i("div", {
 					key: `${e.name}-${e.size}-${e.lastModified}`,
 					class: "flex min-w-0 items-center gap-3 rounded-[10px] border border-secondary-300 bg-white p-3 dark:border-zinc-600 dark:bg-zinc-900"
 				}, [
@@ -726,11 +740,11 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 						src: Q(e),
 						alt: `Pré-visualização de ${e.name}`,
 						class: "size-12 shrink-0 rounded-lg object-cover"
-					}, null, 8, me)) : (v(), i("span", he, [...l[0] ||= [a("i", {
+					}, null, 8, he)) : (v(), i("span", ge, [...l[0] ||= [a("i", {
 						class: "pi pi-file text-2xl",
 						"aria-hidden": "true"
 					}, null, -1)]]))]),
-					a("div", ge, [a("p", _e, C(e.name), 1), a("span", ve, C(U(e.size)), 1)]),
+					a("div", _e, [a("p", ve, C(e.name), 1), a("span", ye, C(U(e.size)), 1)]),
 					a("button", {
 						type: "button",
 						class: "flex size-8 shrink-0 items-center justify-center rounded-full border-0 bg-transparent p-0 text-red-600 transition-colors hover:bg-red-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 dark:text-red-400 dark:hover:bg-red-950/40 dark:focus-visible:ring-offset-zinc-900",
@@ -740,7 +754,7 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 					}, [...l[1] ||= [a("i", {
 						class: "pi pi-times",
 						"aria-hidden": "true"
-					}, null, -1)]], 8, ye)
+					}, null, -1)]], 8, be)
 				]))), 128)), o.multiple && (!o.maxFiles || D.value.length < o.maxFiles) ? (v(), n(V, {
 					key: 0,
 					label: o.selectLabel,
@@ -758,14 +772,14 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 					choose: Z,
 					disabled: F.value
 				}, () => [
-					a("span", ue, [o.loading ? (v(), i("i", de)) : (v(), n(w(ae), {
+					a("span", de, [o.loading ? (v(), i("i", fe)) : (v(), n(w(oe), {
 						key: 1,
 						icon: w(ne),
 						size: 72,
 						"stroke-width": 1.5,
 						class: "text-primary-800 dark:text-primary-300"
 					}, null, 8, ["icon"]))]),
-					a("p", fe, C(o.placeholder), 1),
+					a("p", pe, C(o.placeholder), 1),
 					c(V, {
 						label: o.selectLabel,
 						icon: "pi pi-plus-circle",
@@ -791,14 +805,14 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 				id: N.value,
 				class: "text-[11px] text-red-600 dark:text-red-400",
 				role: "alert"
-			}, C(P.value), 9, be)) : r("", !0)
+			}, C(P.value), 9, xe)) : r("", !0)
 		]));
 	}
-}), Se = { class: "top-input-text top-solutions-component flex w-full flex-col gap-1" }, Ce = ["for"], we = {
+}), Ce = { class: "top-input-text top-solutions-component flex w-full flex-col gap-1" }, we = ["for"], Te = {
 	key: 0,
 	"aria-hidden": "true",
 	class: "text-red-600 dark:text-red-400"
-}, Te = ["id"], Ee = /* @__PURE__ */ l({
+}, Ee = ["id"], De = /* @__PURE__ */ l({
 	inheritAttrs: !1,
 	__name: "TopInputText",
 	props: {
@@ -832,12 +846,12 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 		function g(e) {
 			o("update:modelValue", e ?? "");
 		}
-		return (t, n) => (v(), i("div", Se, [
+		return (t, n) => (v(), i("div", Ce, [
 			e.label ? (v(), i("label", {
 				key: 0,
 				for: f.value,
 				class: "top-field-label text-xs font-bold"
-			}, [s(C(e.label) + " ", 1), e.required ? (v(), i("span", we, "*")) : r("", !0)], 8, Ce)) : r("", !0),
+			}, [s(C(e.label) + " ", 1), e.required ? (v(), i("span", Te, "*")) : r("", !0)], 8, we)) : r("", !0),
 			c(w(L), d(t.$attrs, {
 				id: f.value,
 				"model-value": e.modelValue,
@@ -868,50 +882,66 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 				id: p.value,
 				class: "text-[11px] text-red-600 dark:text-red-400",
 				role: "alert"
-			}, C(e.error), 9, Te)) : r("", !0)
+			}, C(e.error), 9, Ee)) : r("", !0)
 		]));
 	}
-}), De = { class: "top-nav-bar__header" }, Oe = ["aria-expanded"], ke = { class: "top-nav-bar__brand" }, Ae = { class: "top-nav-bar__context" }, je = {
+}), Oe = { class: "top-nav-bar__header" }, ke = ["aria-expanded"], Ae = { class: "top-nav-bar__brand" }, je = { class: "top-nav-bar__context" }, Me = {
 	key: 1,
 	class: "top-nav-bar__search"
-}, Me = ["value", "placeholder"], Ne = {
+}, Ne = ["value", "placeholder"], Pe = {
 	key: 0,
 	class: "top-nav-bar__search-results",
 	role: "menu"
-}, Pe = ["onClick"], Fe = {
+}, Fe = ["onClick"], Ie = {
 	key: 0,
 	class: "top-nav-bar__empty"
-}, Ie = { class: "top-nav-bar__actions" }, Le = { class: "top-nav-bar__breadcrumbs" }, Re = {
+}, Le = { class: "top-nav-bar__actions" }, Re = {
+	key: 2,
+	class: "top-nav-bar__user-menu"
+}, ze = ["aria-expanded"], Be = ["src"], Ve = {
+	key: 1,
+	class: "top-nav-bar__user-avatar"
+}, He = { class: "top-nav-bar__user-details" }, Ue = { class: "top-nav-bar__user-name" }, We = {
+	key: 0,
+	class: "top-nav-bar__user-subtitle"
+}, Ge = {
+	key: 0,
+	class: "top-nav-bar__user-dropdown",
+	role: "menu"
+}, Ke = {
+	key: 0,
+	class: "top-nav-bar__user-separator",
+	role: "separator"
+}, qe = ["disabled", "onClick"], Je = { class: "top-nav-bar__breadcrumbs" }, Ye = {
 	key: 0,
 	class: "top-nav-bar__separator",
 	"aria-hidden": "true"
-}, ze = {
-	key: 1,
-	class: "top-nav-bar__dropdown"
-}, Be = ["aria-expanded"], Ve = {
+}, Xe = ["aria-expanded"], Ze = {
 	key: 0,
-	class: "top-nav-bar__mega-menu",
+	class: "top-nav-bar__menu-layer",
 	role: "menu"
-}, He = { class: "top-nav-bar__section-list" }, Ue = ["onClick"], We = {
-	key: 0,
-	class: "top-nav-bar__section-items"
-}, Ge = ["onClick"], Ke = {
+}, Qe = [
+	"aria-expanded",
+	"onMouseenter",
+	"onClick"
+], $e = {
 	key: 0,
-	class: "top-nav-bar__dropdown"
-}, qe = ["onClick"], Je = {
+	class: "top-nav-bar__section-items",
+	role: "menu"
+}, et = ["onClick"], tt = ["onMouseenter"], nt = ["aria-expanded", "onClick"], rt = {
 	key: 0,
-	class: "top-nav-bar__breadcrumb-menu",
+	class: "top-nav-bar__menu-layer",
 	role: "menu"
-}, Ye = ["onClick"], Xe = ["onClick"], Ze = {
+}, it = { class: "top-nav-bar__menu-panel top-nav-bar__breadcrumb-panel" }, at = ["onClick"], ot = ["onClick"], st = {
 	key: 2,
 	class: "top-nav-bar__current"
-}, Qe = { class: "top-nav-bar__breadcrumb-actions" }, $e = {
+}, ct = { class: "top-nav-bar__breadcrumb-actions" }, lt = {
 	key: 0,
 	class: "top-nav-bar__mobile-menu"
-}, et = ["onClick"], tt = {
+}, ut = ["onClick"], dt = {
 	key: 0,
 	class: "top-nav-bar__mobile-items"
-}, nt = ["onClick"], rt = /* @__PURE__ */ l({
+}, ft = ["onClick"], pt = /* @__PURE__ */ l({
 	__name: "TopNavBar",
 	props: {
 		sections: { default: () => [] },
@@ -938,6 +968,8 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 			default: !1
 		},
 		supportLabel: { default: "Suporte" },
+		user: { default: void 0 },
+		userMenuItems: { default: () => [] },
 		appearance: { default: () => ({}) }
 	},
 	emits: [
@@ -945,55 +977,80 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 		"search",
 		"toggle-aia",
 		"open-support",
-		"toggle-favorite"
+		"toggle-favorite",
+		"user-action"
 	],
 	setup(n, { emit: o }) {
-		let c = n, l = o, u = y(!1), d = y(!1), f = y(null), m = y(null), S = y(""), w = t(() => c.sections.flatMap((e) => e.children)), T = t(() => {
-			if (c.searchResults) return c.searchResults;
-			let e = S.value.trim().toLocaleLowerCase("pt-BR");
-			return e ? w.value.filter((t) => t.label.toLocaleLowerCase("pt-BR").includes(e)) : [];
-		}), E = t(() => ({
-			"--top-nav-bg": c.appearance.headerBackground ?? "#013a59",
-			"--top-nav-breadcrumb-bg": c.appearance.breadcrumbBackground ?? c.appearance.headerBackground ?? "#013a59",
-			"--top-nav-fg": c.appearance.foreground ?? "#ffffff",
-			"--top-nav-muted-fg": c.appearance.mutedForeground ?? "#bfdbfe",
-			"--top-nav-accent": c.appearance.accentColor ?? "#fbbf24",
-			"--top-nav-menu-bg": c.appearance.menuBackground ?? "#ffffff",
-			"--top-nav-menu-fg": c.appearance.menuForeground ?? "#172033",
-			"--top-nav-border": c.appearance.borderColor ?? "rgb(255 255 255 / 15%)",
-			"--top-nav-radius": c.appearance.radius ?? "8px",
-			"--top-nav-height": c.appearance.height ?? "auto"
+		let l = n, u = o, d = y(!1), f = y(null), m = y(!1), S = y(null), T = y(null), E = y(!1), D = y(""), O = t(() => l.sections.flatMap((e) => e.children)), k = t(() => {
+			if (l.searchResults) return l.searchResults;
+			let e = D.value.trim().toLocaleLowerCase("pt-BR");
+			return e ? O.value.filter((t) => t.label.toLocaleLowerCase("pt-BR").includes(e)) : [];
+		}), A = t(() => ({
+			"--top-nav-bg": l.appearance.headerBackground ?? "#013a59",
+			"--top-nav-breadcrumb-bg": l.appearance.breadcrumbBackground ?? l.appearance.headerBackground ?? "#013a59",
+			"--top-nav-fg": l.appearance.foreground ?? "#ffffff",
+			"--top-nav-muted-fg": l.appearance.mutedForeground ?? "#bfdbfe",
+			"--top-nav-accent": l.appearance.accentColor ?? "#fbbf24",
+			"--top-nav-menu-bg": l.appearance.menuBackground ?? "#ffffff",
+			"--top-nav-menu-fg": l.appearance.menuForeground ?? "#172033",
+			"--top-nav-border": l.appearance.borderColor ?? "rgb(255 255 255 / 15%)",
+			"--top-nav-radius": l.appearance.radius ?? "8px",
+			"--top-nav-height": l.appearance.height ?? "auto"
 		}));
-		function D(e) {
+		function j(e) {
 			return e.icon || "pi pi-circle";
 		}
-		function O(e) {
-			e.disabled || (l("navigate", e), N());
+		function M(e) {
+			e.disabled || (u("navigate", e), G());
 		}
-		function k(e) {
+		function N(e) {
 			f.value = f.value === e ? null : e;
 		}
-		function A(e) {
-			return c.sections.find((t) => t.id === e.sectionId);
+		function P(e) {
+			return l.sections.find((t) => t.id === e.sectionId);
 		}
-		function j(e) {
-			m.value = m.value === e ? null : e;
+		function F() {
+			return typeof window < "u" && window.matchMedia("(hover: hover) and (pointer: fine)").matches;
 		}
-		function M(e) {
-			S.value = e, l("search", e);
+		function I() {
+			F() && (m.value = !0);
 		}
-		function N() {
-			u.value = !1, d.value = !1, f.value = null, m.value = null;
+		function L() {
+			!F() || window.innerWidth < 768 || (m.value = !1, S.value = null);
 		}
-		function P(e) {
-			e.key === "Escape" && N();
+		function R() {
+			m.value = !m.value, m.value || (S.value = null);
+		}
+		function z(e) {
+			S.value = S.value === e ? null : e;
+		}
+		function B(e) {
+			F() && (T.value = e);
+		}
+		function V() {
+			!F() || window.innerWidth < 768 || (T.value = null);
+		}
+		function H(e) {
+			T.value = T.value === e ? null : e;
 		}
-		return _(() => document.addEventListener("keydown", P)), g(() => document.removeEventListener("keydown", P)), (t, o) => (v(), i("nav", {
+		function U(e) {
+			e.disabled || e.separator || (u("user-action", e), E.value = !1);
+		}
+		function W(e) {
+			D.value = e, u("search", e);
+		}
+		function G() {
+			d.value = !1, f.value = null, m.value = !1, S.value = null, T.value = null, E.value = !1;
+		}
+		function K(e) {
+			e.key === "Escape" && G();
+		}
+		return _(() => document.addEventListener("keydown", K)), g(() => document.removeEventListener("keydown", K)), (t, o) => (v(), i("nav", {
 			class: "top-nav-bar top-solutions-component",
-			style: h(E.value),
+			style: h(A.value),
 			"aria-label": "Navegação principal"
 		}, [
-			a("div", De, [
+			a("div", Oe, [
 				n.sections.length ? (v(), i("button", {
 					key: 0,
 					class: "top-nav-bar__mobile-trigger",
@@ -1004,42 +1061,42 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 				}, [...o[6] ||= [a("i", {
 					class: "pi pi-bars",
 					"aria-hidden": "true"
-				}, null, -1)]], 8, Oe)) : r("", !0),
-				a("div", ke, [x(t.$slots, "brand")]),
-				a("div", Ae, [x(t.$slots, "context")]),
-				o[10] ||= a("div", { class: "top-nav-bar__spacer" }, null, -1),
-				n.searchable ? (v(), i("div", je, [
+				}, null, -1)]], 8, ke)) : r("", !0),
+				a("div", Ae, [x(t.$slots, "brand")]),
+				a("div", je, [x(t.$slots, "context")]),
+				o[11] ||= a("div", { class: "top-nav-bar__spacer" }, null, -1),
+				n.searchable ? (v(), i("div", Me, [
 					o[7] ||= a("i", {
 						class: "pi pi-search",
 						"aria-hidden": "true"
 					}, null, -1),
 					a("input", {
-						value: S.value,
+						value: D.value,
 						type: "search",
 						placeholder: n.searchPlaceholder,
 						"aria-label": "Pesquisar no menu",
-						onInput: o[1] ||= (e) => M(e.target.value)
-					}, null, 40, Me),
-					S.value ? (v(), i("div", Ne, [x(t.$slots, "search-results", {
-						items: T.value,
-						select: O
-					}, () => [(v(!0), i(e, null, b(T.value, (e) => (v(), i("button", {
+						onInput: o[1] ||= (e) => W(e.target.value)
+					}, null, 40, Ne),
+					D.value ? (v(), i("div", Pe, [x(t.$slots, "search-results", {
+						items: k.value,
+						select: M
+					}, () => [(v(!0), i(e, null, b(k.value, (e) => (v(), i("button", {
 						key: e.id,
 						class: "top-nav-bar__menu-item",
 						type: "button",
 						role: "menuitem",
-						onClick: (t) => O(e)
+						onClick: (t) => M(e)
 					}, [a("i", {
-						class: p(D(e)),
+						class: p(j(e)),
 						"aria-hidden": "true"
-					}, null, 2), s(" " + C(e.label), 1)], 8, Pe))), 128)), T.value.length ? r("", !0) : (v(), i("span", Fe, "Nenhum item encontrado."))])])) : r("", !0)
+					}, null, 2), s(" " + C(e.label), 1)], 8, Fe))), 128)), k.value.length ? r("", !0) : (v(), i("span", Ie, "Nenhum item encontrado."))])])) : r("", !0)
 				])) : r("", !0),
-				a("div", Ie, [
+				a("div", Le, [
 					n.showAia ? (v(), i("button", {
 						key: 0,
 						class: "top-nav-bar__action",
 						type: "button",
-						onClick: o[2] ||= (e) => l("toggle-aia")
+						onClick: o[2] ||= (e) => u("toggle-aia")
 					}, [o[8] ||= a("i", {
 						class: "pi pi-comments",
 						"aria-hidden": "true"
@@ -1048,31 +1105,63 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 						key: 1,
 						class: "top-nav-bar__action",
 						type: "button",
-						onClick: o[3] ||= (e) => l("open-support")
+						onClick: o[3] ||= (e) => u("open-support")
 					}, [o[9] ||= a("i", {
 						class: "pi pi-headphones",
 						"aria-hidden": "true"
 					}, null, -1), s(" " + C(n.supportLabel), 1)])) : r("", !0),
 					x(t.$slots, "actions"),
+					n.user ? (v(), i("div", Re, [a("button", {
+						class: "top-nav-bar__user-trigger",
+						type: "button",
+						"aria-expanded": E.value,
+						"aria-haspopup": "menu",
+						onClick: o[4] ||= (e) => E.value = !E.value
+					}, [
+						n.user.avatarUrl ? (v(), i("img", {
+							key: 0,
+							src: n.user.avatarUrl,
+							alt: "",
+							class: "top-nav-bar__user-avatar"
+						}, null, 8, Be)) : (v(), i("span", Ve, C(n.user.initials || n.user.name.slice(0, 2).toUpperCase()), 1)),
+						a("span", He, [a("span", Ue, C(n.user.name), 1), n.user.subtitle ? (v(), i("span", We, C(n.user.subtitle), 1)) : r("", !0)]),
+						o[10] ||= a("i", {
+							class: "pi pi-chevron-down top-nav-bar__chevron",
+							"aria-hidden": "true"
+						}, null, -1)
+					], 8, ze), E.value ? (v(), i("div", Ge, [(v(!0), i(e, null, b(n.userMenuItems, (t) => (v(), i(e, { key: t.id }, [t.separator ? (v(), i("div", Ke)) : (v(), i("button", {
+						key: 1,
+						class: "top-nav-bar__menu-item",
+						type: "button",
+						disabled: t.disabled,
+						onClick: (e) => U(t)
+					}, [t.icon ? (v(), i("i", {
+						key: 0,
+						class: p(t.icon),
+						"aria-hidden": "true"
+					}, null, 2)) : r("", !0), s(" " + C(t.label), 1)], 8, qe))], 64))), 128))])) : r("", !0)])) : r("", !0),
 					x(t.$slots, "user-menu")
 				])
 			]),
-			a("div", Le, [
+			a("div", Je, [
 				a("button", {
 					class: "top-nav-bar__crumb",
 					type: "button",
-					onClick: o[4] ||= (e) => O(n.homeItem)
-				}, [a("i", {
-					class: p(D(n.homeItem)),
-					"aria-hidden": "true"
-				}, null, 2), s(" " + C(n.homeItem.label), 1)]),
-				n.sections.length ? (v(), i("span", Re, "/")) : r("", !0),
-				n.sections.length ? (v(), i("div", ze, [a("button", {
+					onClick: o[5] ||= (e) => M(n.homeItem)
+				}, [c(w(oe), { icon: w(Q) }, null, 8, ["icon"]), s(" " + C(n.homeItem.label), 1)]),
+				n.sections.length ? (v(), i("span", Ye, "/")) : r("", !0),
+				n.sections.length ? (v(), i("div", {
+					key: 1,
+					class: "top-nav-bar__dropdown",
+					onMouseenter: I,
+					onMouseleave: L
+				}, [a("button", {
 					class: "top-nav-bar__crumb",
 					type: "button",
-					"aria-expanded": u.value,
-					onClick: o[5] ||= (e) => u.value = !u.value
-				}, [...o[11] ||= [
+					"aria-haspopup": "menu",
+					"aria-expanded": m.value,
+					onClick: R
+				}, [...o[12] ||= [
 					a("i", {
 						class: "pi pi-bars",
 						"aria-hidden": "true"
@@ -1082,66 +1171,78 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 						class: "pi pi-chevron-down top-nav-bar__chevron",
 						"aria-hidden": "true"
 					}, null, -1)
-				]], 8, Be), u.value ? (v(), i("div", Ve, [a("div", He, [(v(!0), i(e, null, b(n.sections, (e) => (v(), i("button", {
+				]], 8, Xe), m.value ? (v(), i("div", Ze, [a("div", { class: p(["top-nav-bar__menu-panel", { "top-nav-bar__menu-panel--expanded": S.value }]) }, [a("div", { class: p(["top-nav-bar__section-list", { "top-nav-bar__section-list--with-submenu": S.value }]) }, [(v(!0), i(e, null, b(n.sections, (e) => (v(), i("button", {
 					key: e.id,
-					class: p(["top-nav-bar__menu-item", { "top-nav-bar__menu-item--selected": f.value === e.id }]),
+					class: p(["top-nav-bar__menu-item", { "top-nav-bar__menu-item--selected": S.value === e.id }]),
 					type: "button",
-					onClick: (t) => k(e.id)
+					role: "menuitem",
+					"aria-expanded": S.value === e.id,
+					onMouseenter: (t) => F() && (S.value = e.id),
+					onClick: (t) => z(e.id)
 				}, [
 					a("i", {
-						class: p(D(e)),
+						class: p(j(e)),
 						"aria-hidden": "true"
 					}, null, 2),
-					s(" " + C(e.label) + " ", 1),
-					o[12] ||= a("i", {
+					a("span", null, C(e.label), 1),
+					o[13] ||= a("i", {
 						class: "pi pi-chevron-right top-nav-bar__menu-arrow",
 						"aria-hidden": "true"
 					}, null, -1)
-				], 10, Ue))), 128))]), f.value ? (v(), i("div", We, [(v(!0), i(e, null, b(n.sections, (t) => (v(), i(e, { key: `${t.id}-items` }, [t.id === f.value ? (v(!0), i(e, { key: 0 }, b(t.children, (e) => (v(), i("button", {
+				], 42, Qe))), 128))], 2), S.value ? (v(), i("div", $e, [(v(!0), i(e, null, b(n.sections, (t) => (v(), i(e, { key: t.id }, [t.id === S.value ? (v(!0), i(e, { key: 0 }, b(t.children, (e) => (v(), i("button", {
 					key: e.id,
-					class: "top-nav-bar__menu-item",
+					class: p(["top-nav-bar__menu-item", { "top-nav-bar__menu-item--active": n.activeItemId === e.id }]),
 					type: "button",
-					onClick: (t) => O(e)
+					role: "menuitem",
+					onClick: (t) => M(e)
 				}, [a("i", {
-					class: p(D(e)),
+					class: p(j(e)),
 					"aria-hidden": "true"
-				}, null, 2), s(" " + C(e.label), 1)], 8, Ge))), 128)) : r("", !0)], 64))), 128))])) : r("", !0)])) : r("", !0)])) : r("", !0),
-				(v(!0), i(e, null, b(n.breadcrumbs, (t) => (v(), i(e, { key: t.id }, [o[14] ||= a("span", {
+				}, null, 2), a("span", null, C(e.label), 1)], 10, et))), 128)) : r("", !0)], 64))), 128))])) : r("", !0)], 2)])) : r("", !0)], 32)) : r("", !0),
+				(v(!0), i(e, null, b(n.breadcrumbs, (t) => (v(), i(e, { key: t.id }, [o[15] ||= a("span", {
 					class: "top-nav-bar__separator",
 					"aria-hidden": "true"
-				}, "/", -1), t.sectionId && A(t) ? (v(), i("div", Ke, [a("button", {
+				}, "/", -1), t.sectionId && P(t) ? (v(), i("div", {
+					key: 0,
+					class: "top-nav-bar__dropdown",
+					onMouseenter: (e) => B(t.sectionId),
+					onMouseleave: V
+				}, [a("button", {
 					class: "top-nav-bar__crumb",
 					type: "button",
-					onClick: (e) => j(t.sectionId)
-				}, [s(C(t.label) + " ", 1), o[13] ||= a("i", {
+					"aria-haspopup": "menu",
+					"aria-expanded": T.value === t.sectionId,
+					onClick: (e) => H(t.sectionId)
+				}, [s(C(t.label) + " ", 1), o[14] ||= a("i", {
 					class: "pi pi-chevron-down top-nav-bar__chevron",
 					"aria-hidden": "true"
-				}, null, -1)], 8, qe), m.value === t.sectionId ? (v(), i("div", Je, [(v(!0), i(e, null, b(A(t)?.children, (e) => (v(), i("button", {
+				}, null, -1)], 8, nt), T.value === t.sectionId ? (v(), i("div", rt, [a("div", it, [(v(!0), i(e, null, b(P(t)?.children, (e) => (v(), i("button", {
 					key: e.id,
-					class: "top-nav-bar__menu-item",
+					class: p(["top-nav-bar__menu-item", { "top-nav-bar__menu-item--active": n.activeItemId === e.id }]),
 					type: "button",
-					onClick: (t) => O(e)
+					role: "menuitem",
+					onClick: (t) => M(e)
 				}, [a("i", {
-					class: p(D(e)),
+					class: p(j(e)),
 					"aria-hidden": "true"
-				}, null, 2), s(" " + C(e.label), 1)], 8, Ye))), 128))])) : r("", !0)])) : t.to ? (v(), i("button", {
+				}, null, 2), a("span", null, C(e.label), 1)], 10, at))), 128))])])) : r("", !0)], 40, tt)) : t.to ? (v(), i("button", {
 					key: 1,
 					class: "top-nav-bar__crumb",
 					type: "button",
-					onClick: (e) => O(t)
-				}, C(t.label), 9, Xe)) : (v(), i("span", Ze, C(t.label), 1))], 64))), 128)),
-				a("span", Qe, [x(t.$slots, "breadcrumb-actions")])
+					onClick: (e) => M(t)
+				}, C(t.label), 9, ot)) : (v(), i("span", st, C(t.label), 1))], 64))), 128)),
+				a("span", ct, [x(t.$slots, "breadcrumb-actions")])
 			]),
-			d.value ? (v(), i("div", $e, [(v(!0), i(e, null, b(n.sections, (t) => (v(), i("section", {
+			d.value ? (v(), i("div", lt, [(v(!0), i(e, null, b(n.sections, (t) => (v(), i("section", {
 				key: t.id,
 				class: "top-nav-bar__mobile-section"
 			}, [a("button", {
 				class: "top-nav-bar__mobile-section-title",
 				type: "button",
-				onClick: (e) => k(t.id)
+				onClick: (e) => N(t.id)
 			}, [
 				a("i", {
-					class: p(D(t)),
+					class: p(j(t)),
 					"aria-hidden": "true"
 				}, null, 2),
 				s(" " + C(t.label) + " ", 1),
@@ -1149,52 +1250,52 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 					class: p(["pi pi-chevron-down top-nav-bar__menu-arrow", { "top-nav-bar__menu-arrow--open": f.value === t.id }]),
 					"aria-hidden": "true"
 				}, null, 2)
-			], 8, et), f.value === t.id ? (v(), i("div", tt, [(v(!0), i(e, null, b(t.children, (e) => (v(), i("button", {
+			], 8, ut), f.value === t.id ? (v(), i("div", dt, [(v(!0), i(e, null, b(t.children, (e) => (v(), i("button", {
 				key: e.id,
 				class: p(["top-nav-bar__menu-item", { "top-nav-bar__menu-item--active": n.activeItemId === e.id }]),
 				type: "button",
-				onClick: (t) => O(e)
+				onClick: (t) => M(e)
 			}, [a("i", {
-				class: p(D(e)),
+				class: p(j(e)),
 				"aria-hidden": "true"
-			}, null, 2), s(" " + C(e.label), 1)], 10, nt))), 128))])) : r("", !0)]))), 128)), x(t.$slots, "mobile-footer")])) : r("", !0)
+			}, null, 2), s(" " + C(e.label), 1)], 10, ft))), 128))])) : r("", !0)]))), 128)), x(t.$slots, "mobile-footer")])) : r("", !0)
 		], 4));
 	}
-}), it = { class: "top-field-icon pointer-events-none absolute left-3 top-1/2 z-10 -translate-y-1/2" }, at = {
+}), mt = { class: "top-field-icon pointer-events-none absolute left-3 top-1/2 z-10 -translate-y-1/2" }, ht = {
 	key: 0,
 	class: "pi pi-spin pi-spinner"
-}, ot = {
+}, gt = {
 	key: 1,
 	class: "pi pi-search"
-}, st = {
+}, _t = {
 	key: 1,
 	class: "flex items-center gap-1 !text-sm"
-}, ct = { class: "flex items-center gap-2 rounded-[9px] bg-primary-500 px-2 py-1 text-white" }, lt = ["onClick"], ut = { class: "line-clamp-1 max-w-[300px] overflow-hidden text-ellipsis" }, dt = {
+}, vt = { class: "flex items-center gap-2 rounded-[9px] bg-primary-500 px-2 py-1 text-white" }, yt = ["onClick"], bt = { class: "line-clamp-1 max-w-[300px] overflow-hidden text-ellipsis" }, xt = {
 	key: 1,
 	class: "flex min-h-[100px] flex-col items-center justify-center gap-2 py-2"
-}, ft = {
+}, St = {
 	key: 0,
 	class: "text-xs font-medium text-primary-600"
-}, pt = {
+}, Ct = {
 	key: 2,
 	class: "text-xs text-secondary-500"
-}, mt = { key: 1 }, ht = {
+}, wt = { key: 1 }, Tt = {
 	key: 1,
 	class: "flex items-center gap-2 font-semibold"
-}, gt = {
+}, Et = {
 	key: 1,
 	class: "flex w-full min-w-0 items-start gap-2 overflow-hidden px-2 py-3 text-sm",
 	style: { "white-space": "normal" }
-}, _t = ["title"], vt = {
+}, Dt = ["title"], Ot = {
 	key: 0,
 	class: "top-select-option-prefix whitespace-nowrap font-bold text-primary-800 dark:text-primary-100"
-}, yt = {
+}, kt = {
 	key: 0,
 	class: "rounded-sm bg-primary-200 p-0 font-bold text-black dark:bg-cyan-700 dark:text-white"
-}, bt = {
+}, At = {
 	key: 0,
 	class: "rounded-sm bg-primary-200 p-0 font-bold text-black dark:bg-cyan-700 dark:text-white"
-}, xt = /* @__PURE__ */ l({
+}, jt = /* @__PURE__ */ l({
 	__name: "TopSelect",
 	props: {
 		modelValue: { default: null },
@@ -1322,7 +1423,7 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 		}), (t, l) => (v(), i("div", {
 			class: p(["top-select top-solutions-component relative w-full", { "pointer-events-none": n.disabled }]),
 			onFocusin: J
-		}, [a("span", it, [x(t.$slots, "icon", { loading: n.loading }, () => [n.loading ? (v(), i("i", at)) : (v(), i("i", ot))])]), c(w(j), {
+		}, [a("span", mt, [x(t.$slots, "icon", { loading: n.loading }, () => [n.loading ? (v(), i("i", ht)) : (v(), i("i", gt))])]), c(w(j), {
 			ref_key: "autocompleteRef",
 			ref: F,
 			modelValue: z.value,
@@ -1392,18 +1493,18 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 			},
 			onChange: l[4] ||= (e) => T("change", e)
 		}, o({
-			chip: k((e) => [w(E).chip ? x(t.$slots, "chip", m(u(e)), void 0, void 0, 0) : (v(), i("div", st, [a("div", ct, [a("i", {
+			chip: k((e) => [w(E).chip ? x(t.$slots, "chip", m(u(e)), void 0, void 0, 0) : (v(), i("div", _t, [a("div", vt, [a("i", {
 				class: "pi pi-times-circle shrink-0 cursor-pointer rounded-full hover:bg-primary-800",
 				onClick: (t) => e.removeCallback(t)
-			}, null, 8, lt), A((v(), i("span", ut, [s(C(U(e.value)), 1)])), [[
+			}, null, 8, yt), A((v(), i("span", bt, [s(C(U(e.value)), 1)])), [[
 				w(M),
 				U(e.value),
 				void 0,
 				{ top: !0 }
 			]])])]))]),
-			empty: k(() => [w(E).empty ? x(t.$slots, "empty", {}, void 0, void 0, 0) : n.loading ? (v(), i("div", dt, [l[5] ||= a("span", { class: "pi pi-spin pi-spinner text-2xl text-primary-600" }, null, -1), n.showLoadingMessage ? (v(), i("span", ft, C(n.loadingMessage), 1)) : r("", !0)])) : (v(), i("span", pt, C(n.emptyMessage), 1))]),
-			"selected-item": k((e) => [w(E)["selected-item"] ? x(t.$slots, "selected-item", m(u(e)), void 0, void 0, 0) : e.item ? (v(), i("span", mt, C(U(e.item)), 1)) : r("", !0)]),
-			optiongroup: k((e) => [w(E)["option-group"] ? x(t.$slots, "option-group", m(u(e)), void 0, void 0, 0) : (v(), i("div", ht, [e.option.icon ? (v(), i("i", {
+			empty: k(() => [w(E).empty ? x(t.$slots, "empty", {}, void 0, void 0, 0) : n.loading ? (v(), i("div", xt, [l[5] ||= a("span", { class: "pi pi-spin pi-spinner text-2xl text-primary-600" }, null, -1), n.showLoadingMessage ? (v(), i("span", St, C(n.loadingMessage), 1)) : r("", !0)])) : (v(), i("span", Ct, C(n.emptyMessage), 1))]),
+			"selected-item": k((e) => [w(E)["selected-item"] ? x(t.$slots, "selected-item", m(u(e)), void 0, void 0, 0) : e.item ? (v(), i("span", wt, C(U(e.item)), 1)) : r("", !0)]),
+			optiongroup: k((e) => [w(E)["option-group"] ? x(t.$slots, "option-group", m(u(e)), void 0, void 0, 0) : (v(), i("div", Tt, [e.option.icon ? (v(), i("i", {
 				key: 0,
 				class: p(e.option.icon)
 			}, null, 2)) : r("", !0), a("span", null, C(e.option[n.optionGroupLabel ?? "label"]), 1)]))]),
@@ -1411,10 +1512,10 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 				label: V(o.option),
 				prefix: H(o.option),
 				query: N.value
-			}), void 0, void 0, 0) : A((v(), i("div", gt, [a("span", {
+			}), void 0, void 0, 0) : A((v(), i("div", Et, [a("span", {
 				class: "top-select-option-label line-clamp-2 min-w-0 flex-1 text-secondary-700 dark:text-zinc-200",
 				title: V(o.option)
-			}, [n.showOptionPrefix && H(o.option) ? (v(), i("span", vt, [(v(!0), i(e, null, b(W(H(o.option)), (t, n) => (v(), i(e, { key: n }, [t.highlighted ? (v(), i("mark", yt, C(t.text), 1)) : (v(), i(e, { key: 1 }, [s(C(t.text), 1)], 64))], 64))), 128)), l[6] ||= a("span", { class: "font-bold text-secondary-500 dark:text-zinc-400" }, "\xA0-\xA0", -1)])) : r("", !0), (v(!0), i(e, null, b(W(V(o.option)), (t, n) => (v(), i(e, { key: n }, [t.highlighted ? (v(), i("mark", bt, C(t.text), 1)) : (v(), i(e, { key: 1 }, [s(C(t.text), 1)], 64))], 64))), 128))], 8, _t)])), [[
+			}, [n.showOptionPrefix && H(o.option) ? (v(), i("span", Ot, [(v(!0), i(e, null, b(W(H(o.option)), (t, n) => (v(), i(e, { key: n }, [t.highlighted ? (v(), i("mark", kt, C(t.text), 1)) : (v(), i(e, { key: 1 }, [s(C(t.text), 1)], 64))], 64))), 128)), l[6] ||= a("span", { class: "font-bold text-secondary-500 dark:text-zinc-400" }, "\xA0-\xA0", -1)])) : r("", !0), (v(!0), i(e, null, b(W(V(o.option)), (t, n) => (v(), i(e, { key: n }, [t.highlighted ? (v(), i("mark", At, C(t.text), 1)) : (v(), i(e, { key: 1 }, [s(C(t.text), 1)], 64))], 64))), 128))], 8, Dt)])), [[
 				w(M),
 				n.showTooltip ? V(o.option) : null,
 				void 0,
@@ -1443,10 +1544,10 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 			"pt"
 		])], 34));
 	}
-}), St = { class: "top-toast__content" }, Ct = { class: "top-toast__detail" }, wt = ["onClick"], Tt = {
+}), Mt = { class: "top-toast__content" }, Nt = { class: "top-toast__detail" }, Pt = ["onClick"], Ft = {
 	key: 0,
 	class: "top-toast__footer"
-}, Et = /* @__PURE__ */ l({
+}, It = /* @__PURE__ */ l({
 	__name: "TopToast",
 	props: { baseZIndex: { default: 3e4 } },
 	setup(e) {
@@ -1472,9 +1573,9 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 			position: "top-right",
 			"base-z-index": e.baseZIndex
 		}, {
-			message: k((e) => [a("div", St, [
+			message: k((e) => [a("div", Mt, [
 				a("div", { class: p(["top-toast__summary", d(e.message, "summary")]) }, C(e.message.summary), 3),
-				a("div", Ct, C(e.message.detail), 1),
+				a("div", Nt, C(e.message.detail), 1),
 				u(e.message) ? x(f.$slots, "action", {
 					action: o(e.message),
 					message: e.message,
@@ -1488,17 +1589,17 @@ var ae = /* @__PURE__ */ $(Q, [["render", ie], ["__file", "/Users/mahmudulhasan/
 					key: 0,
 					class: p(o(e.message)?.icon),
 					"aria-hidden": "true"
-				}, null, 2)) : r("", !0), s(" " + C(o(e.message)?.label), 1)], 10, wt)) : r("", !0)], void 0, 0) : r("", !0),
+				}, null, 2)) : r("", !0), s(" " + C(o(e.message)?.label), 1)], 10, Pt)) : r("", !0)], void 0, 0) : r("", !0),
 				l(e.message) ? x(f.$slots, "footer", {
 					message: e.message,
 					footer: t(e.message)
-				}, () => [t(e.message) === void 0 ? r("", !0) : (v(), i("div", Tt, C(t(e.message)), 1))], void 0, 1) : r("", !0)
+				}, () => [t(e.message) === void 0 ? r("", !0) : (v(), i("div", Ft, C(t(e.message)), 1))], void 0, 1) : r("", !0)
 			])]),
 			_: 3
 		}, 8, ["base-z-index"]));
 	}
 });
 //#endregion
-export { xe as a, H as c, Ee as i, V as l, xt as n, te as o, rt as r, J as s, Et as t };
+export { Se as a, H as c, De as i, V as l, jt as n, te as o, pt as r, J as s, It as t };
 
-//# sourceMappingURL=TopToast-CyPhPcN4.js.map
+//# sourceMappingURL=TopToast-CXC-8FkA.js.map