@vezham/react 26.0.0-alpha.8 → 26.0.0-alpha.9

package/dist/lib/components/panel/footer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/components/panel/footer/index.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAoFjD,QAAA,MAAM,MAAM,GAAI,2KAab,kBAAkB,gCA+EpB,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/components/panel/footer/index.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAoFjD,QAAA,MAAM,MAAM,GAAI,2KAab,kBAAkB,gCAsFpB,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/dist/lib/components/panel/footer/index.js

@@ -29,7 +29,7 @@ var FooterAction = ({ children, label, onPress }) => {
 		})]
 	});
 };
-var CompactActions = ({ showAI, showControlCenter, onControlCenter, showNotifications, notificationCount, onAI, onNotificationsClick }) => {
+var CompactActions = ({ showAI, showControlCenter, onControlCenter, showNotifications, notificationCount = 0, onAI, onNotificationsClick }) => {
 	if (!showAI && !showNotifications && !showControlCenter) return null;
 	return /* @__PURE__ */ jsxs(Dropdown, { children: [/* @__PURE__ */ jsx(Dropdown.Trigger, {
 		"aria-label": "Open footer actions",
@@ -59,7 +59,7 @@ var CompactActions = ({ showAI, showControlCenter, onControlCenter, showNotifica
 						className: "flex-1",
 						children: "Notifications"
 					}),
-					notificationCount && notificationCount > 0 ? /* @__PURE__ */ jsx(Badge, {
+					notificationCount > 0 ? /* @__PURE__ */ jsx(Badge, {
 						content: String(notificationCount),
 						color: "danger",
 						size: "sm"
@@ -117,7 +117,19 @@ var Footer = ({ user, showAI = false, showControlCenter = false, controlCenter,
 				value: controlCenterContext,
 				children: controlCenter ?? /* @__PURE__ */ jsx(DefaultControlCenter, { placement: "right bottom" })
 			}),
-			/* @__PURE__ */ jsx("div", {
+			showUserInfo ? /* @__PURE__ */ jsx(UserMenu, {
+				user,
+				showAI,
+				showControlCenter,
+				showNotifications,
+				notificationCount,
+				onAI,
+				onControlCenter: () => setControlCenterOpen(true),
+				onNotifications: onNotificationsClick,
+				onProfile: () => onUserClick?.(user, "profiles"),
+				onPreferences: () => onUserClick?.(user, "account"),
+				onLogout: clearUser
+			}) : /* @__PURE__ */ jsx("div", {
 				className: "md:hidden",
 				children: /* @__PURE__ */ jsx(CompactActions, {
 					showControlCenter,
@@ -129,12 +141,6 @@ var Footer = ({ user, showAI = false, showControlCenter = false, controlCenter,
 					onNotificationsClick
 				})
 			}),
-			showUserInfo ? /* @__PURE__ */ jsx(UserMenu, {
-				user,
-				onProfile: () => onUserClick?.(user, "profiles"),
-				onPreferences: () => onUserClick?.(user, "account"),
-				onLogout: clearUser
-			}) : null,
 			toolbarAction && /* @__PURE__ */ jsx(Surface, {
 				variant: "transparent",
 				className: "md:hidden",

package/dist/lib/components/panel/footer/user-menu.d.ts

@@ -4,7 +4,14 @@ type Props = {
     onLogout: () => void;
     onProfile?: () => void;
     onPreferences?: () => void;
+    showAI?: boolean;
+    showControlCenter?: boolean;
+    showNotifications?: boolean;
+    notificationCount?: number;
+    onAI?: () => void;
+    onControlCenter?: () => void;
+    onNotifications?: () => void;
 };
-declare const UserMenu: ({ user, onLogout, onProfile, onPreferences }: Props) => import("react").JSX.Element;
+declare const UserMenu: ({ user, onLogout, onProfile, onPreferences, showAI, showControlCenter, showNotifications, notificationCount, onAI, onControlCenter, onNotifications }: Props) => import("react").JSX.Element;
 export { UserMenu };
 //# sourceMappingURL=user-menu.d.ts.map

package/dist/lib/components/panel/footer/user-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"user-menu.d.ts","sourceRoot":"","sources":["../../../../../src/lib/components/panel/footer/user-menu.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAGV,QAAQ,EAGT,MAAM,SAAS,CAAA;AAEhB,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,QAAQ,CAAA;IACd,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;CAC3B,CAAA;AAsGD,QAAA,MAAM,QAAQ,GAAI,8CAA8C,KAAK,gCAuNpE,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"user-menu.d.ts","sourceRoot":"","sources":["../../../../../src/lib/components/panel/footer/user-menu.tsx"],"names":[],"mappings":"AAiCA,OAAO,KAAK,EAGV,QAAQ,EAGT,MAAM,SAAS,CAAA;AAEhB,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,QAAQ,CAAA;IACd,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;IACjB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;CAC7B,CAAA;AAsGD,QAAA,MAAM,QAAQ,GAAI,uJAYf,KAAK,gCA0SP,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/lib/components/panel/footer/user-menu.js

@@ -4,7 +4,7 @@ import { DEFAULT_STATUS_OPTION, STATUS_OPTIONS, STATUS_TIMING_OPTIONS, SUGGESTED
 import { useState } from "react";
 import { Avatar, Badge, Button, Dropdown, Separator, Tooltip, useMediaQuery } from "@vezham/react-v3";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { AltArrowLeft, AltArrowRight, CheckRead, Logout2, Settings } from "@vezham/icons-react";
+import { AltArrowLeft, AltArrowRight, Bell, CheckRead, Logout2, Settings, VezhamTamizhi } from "@vezham/icons-react";
 //#region src/lib/components/panel/footer/user-menu.tsx
 var StatusVisual = ({ status }) => {
 	if (isColorStatus(status.id)) return /* @__PURE__ */ jsx("span", { className: `h-2 w-2 rounded-full ${status.color ?? ""}` });
@@ -79,7 +79,7 @@ var useAccountSections = (user) => {
 		]
 	};
 };
-var UserMenu = ({ user, onLogout, onProfile, onPreferences }) => {
+var UserMenu = ({ user, onLogout, onProfile, onPreferences, showAI = false, showControlCenter = false, showNotifications = false, notificationCount = 0, onAI, onControlCenter, onNotifications }) => {
 	const small = useMediaQuery(APPLICATION_MENU_SHEET_MEDIA_QUERY, { initializeWithValue: false });
 	const bubble = useMediaQuery(ACCOUNT_BUBBLE_MEDIA_QUERY, { initializeWithValue: false });
 	const [open, setOpen] = useState(false);
@@ -90,6 +90,129 @@ var UserMenu = ({ user, onLogout, onProfile, onPreferences }) => {
 		setOpen(value);
 		if (!value) setSection(null);
 	};
+	const closeAndRun = (action) => {
+		setOpen(false);
+		action?.();
+	};
+	const compactActions = [
+		showControlCenter ? {
+			label: "Control center",
+			icon: /* @__PURE__ */ jsx(Settings, {
+				size: 24,
+				"aria-hidden": "true"
+			}),
+			onPress: onControlCenter
+		} : null,
+		showNotifications ? {
+			label: "Notifications",
+			icon: /* @__PURE__ */ jsxs(Badge.Anchor, { children: [/* @__PURE__ */ jsx(Bell, {
+				size: 24,
+				"aria-hidden": "true"
+			}), notificationCount > 0 ? /* @__PURE__ */ jsx(Badge, {
+				content: String(notificationCount),
+				color: "danger",
+				size: "sm"
+			}) : null] }),
+			onPress: onNotifications
+		} : null,
+		showAI ? {
+			label: "Tamizhi AI",
+			icon: /* @__PURE__ */ jsx(VezhamTamizhi, {
+				size: 24,
+				"aria-hidden": "true"
+			}),
+			onPress: onAI
+		} : null
+	].filter((action) => action !== null);
+	const compactContent = /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col items-center gap-5 py-2",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col items-center gap-2 text-center",
+				children: [
+					/* @__PURE__ */ jsxs(Badge.Anchor, { children: [/* @__PURE__ */ jsxs(Avatar, {
+						className: "size-20",
+						children: [user.avatar ? /* @__PURE__ */ jsx(Avatar.Image, {
+							src: user.avatar,
+							alt: user.name
+						}) : null, /* @__PURE__ */ jsx(Avatar.Fallback, {
+							className: "text-xl",
+							children: user.name?.[0]
+						})]
+					}), /* @__PURE__ */ jsx(Badge, {
+						placement: "bottom-right",
+						size: "sm",
+						className: "border-surface flex items-center justify-center border-2",
+						children: /* @__PURE__ */ jsx(StatusVisual, { status: currentStatus })
+					})] }),
+					/* @__PURE__ */ jsx("span", {
+						className: "text-base font-semibold",
+						children: user.name
+					}),
+					/* @__PURE__ */ jsxs("span", {
+						className: "text-muted flex items-center gap-1 text-sm",
+						children: [/* @__PURE__ */ jsx(StatusVisual, { status: currentStatus }), currentStatus.label]
+					})
+				]
+			}),
+			compactActions.length > 0 ? /* @__PURE__ */ jsx("div", {
+				className: "flex items-center justify-center gap-2",
+				role: "group",
+				"aria-label": "Account actions",
+				children: compactActions.map((action) => /* @__PURE__ */ jsxs(Tooltip, {
+					delay: 0,
+					children: [/* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(Button, {
+						"aria-label": action.label,
+						isIconOnly: true,
+						size: "lg",
+						variant: "ghost",
+						onPress: action.onPress,
+						children: action.icon
+					}) }), /* @__PURE__ */ jsx(Tooltip.Content, {
+						placement: "top",
+						children: action.label
+					})]
+				}, action.label))
+			}) : null,
+			/* @__PURE__ */ jsx(Separator, { className: "self-stretch" }),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex w-full flex-col gap-1 p-2",
+				children: [
+					accountSections.map((item) => /* @__PURE__ */ jsxs(Button, {
+						variant: "ghost",
+						className: "h-auto min-h-11 w-full justify-start gap-3 px-3 py-2 text-start",
+						onPress: () => setSection(item.id),
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "min-w-0 flex-1 truncate text-start",
+							children: item.label
+						}), /* @__PURE__ */ jsx(AltArrowRight, {
+							size: 16,
+							"aria-hidden": "true"
+						})]
+					}, item.id)),
+					/* @__PURE__ */ jsx(Separator, {}),
+					/* @__PURE__ */ jsxs(Button, {
+						variant: "ghost",
+						className: "h-auto min-h-11 w-full justify-start gap-3 px-3 py-2 text-start",
+						onPress: () => closeAndRun(onPreferences),
+						children: [/* @__PURE__ */ jsx(Settings, {
+							size: 18,
+							"aria-hidden": "true"
+						}), "Preferences"]
+					}),
+					/* @__PURE__ */ jsxs(Button, {
+						variant: "ghost",
+						className: "text-danger h-auto min-h-11 w-full justify-start gap-3 px-3 py-2 text-start",
+						onPress: () => closeAndRun(onLogout),
+						children: [/* @__PURE__ */ jsx(Logout2, {
+							size: 18,
+							"aria-hidden": "true"
+						}), "Logout"]
+					})
+				]
+			})
+		]
+	});
 	const Trigger = small ? Button : Dropdown.Trigger;
 	const content = /* @__PURE__ */ jsxs(Fragment, { children: [
 		/* @__PURE__ */ jsxs("button", {
@@ -114,48 +237,7 @@ var UserMenu = ({ user, onLogout, onProfile, onPreferences }) => {
 			})] })]
 		}),
 		/* @__PURE__ */ jsx(Separator, {}),
-		small ? /* @__PURE__ */ jsxs("div", {
-			className: "flex flex-col gap-1 p-2",
-			children: [
-				accountSections.map((item) => /* @__PURE__ */ jsxs(Button, {
-					variant: "ghost",
-					className: "h-auto min-h-11 w-full justify-start gap-3 px-3 py-2 text-start",
-					onPress: () => setSection(item.id),
-					children: [/* @__PURE__ */ jsx("span", {
-						className: "min-w-0 flex-1 truncate text-start",
-						children: item.label
-					}), /* @__PURE__ */ jsx(AltArrowRight, {
-						size: 16,
-						"aria-hidden": "true"
-					})]
-				}, item.id)),
-				/* @__PURE__ */ jsx(Separator, {}),
-				/* @__PURE__ */ jsxs(Button, {
-					variant: "ghost",
-					className: "h-auto min-h-11 w-full justify-start gap-3 px-3 py-2 text-start",
-					onPress: () => {
-						setOpen(false);
-						onPreferences?.();
-					},
-					children: [/* @__PURE__ */ jsx(Settings, {
-						size: 18,
-						"aria-hidden": "true"
-					}), "Preferences"]
-				}),
-				/* @__PURE__ */ jsxs(Button, {
-					variant: "ghost",
-					className: "text-danger h-auto min-h-11 w-full justify-start gap-3 px-3 py-2 text-start",
-					onPress: () => {
-						setOpen(false);
-						onLogout();
-					},
-					children: [/* @__PURE__ */ jsx(Logout2, {
-						size: 18,
-						"aria-hidden": "true"
-					}), "Logout"]
-				})
-			]
-		}) : /* @__PURE__ */ jsxs(Dropdown.Menu, {
+		small ? null : /* @__PURE__ */ jsxs(Dropdown.Menu, {
 			"aria-label": "Account actions",
 			children: [
 				accountSections.map((item) => /* @__PURE__ */ jsxs(Dropdown.SubmenuTrigger, { children: [/* @__PURE__ */ jsxs(Dropdown.Item, {
@@ -274,7 +356,7 @@ var UserMenu = ({ user, onLogout, onProfile, onPreferences }) => {
 					})
 				]
 			}, option.id))]
-		}) : content
+		}) : compactContent
 	})] }) : /* @__PURE__ */ jsxs(Dropdown, {
 		isOpen: open,
 		onOpenChange: changeOpen,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vezham/react",
-  "version": "26.0.0-alpha.8",
+  "version": "26.0.0-alpha.9",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/vezham/vx-fe-pkgs.git",
@@ -109,7 +109,7 @@
   ],
   "dependencies": {
     "@tanstack/react-hotkeys": "^0.10.0",
-    "@vezham/hooks": "26.0.0-alpha.8",
+    "@vezham/hooks": "26.0.0-alpha.9",
     "react-aria-components": "1.21.1"
   }
 }