@codeswayam/ui 1.2.1 → 1.3.0

package/dist/components/saas/NotificationBell.d.ts

@@ -0,0 +1,12 @@
+export interface NotificationBellProps {
+    apiUrl?: string;
+    onNavigate?: (url: string) => void;
+    onOpenSettings?: () => void;
+    className?: string;
+}
+/**
+ * Universal Notification Bell Component for SaaS applications.
+ * Renders an unread badge counter and a notification feed dropdown.
+ */
+export declare function NotificationBell({ apiUrl, onNavigate, onOpenSettings, className, }: NotificationBellProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NotificationBell.d.ts.map

package/dist/components/saas/NotificationBell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationBell.d.ts","sourceRoot":"","sources":["../../../src/components/saas/NotificationBell.tsx"],"names":[],"mappings":"AAqBA,MAAM,WAAW,qBAAqB;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA6BD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,UAAU,EACV,cAAc,EACd,SAAS,GACV,EAAE,qBAAqB,2CAoIvB"}

package/dist/components/saas/NotificationBell.js

@@ -0,0 +1,52 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Bell, CheckCheck, CreditCard, ShieldAlert, Sparkles, Tag, Settings, Info, } from "lucide-react";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger, } from "../base/dropdown-menu";
+import { useNotifications } from "../../utils/useNotifications";
+import { cn } from "../../utils/cn";
+function getCategoryIcon(category) {
+    switch (category) {
+        case "billing":
+            return _jsx(CreditCard, { size: 14, className: "text-violet-600" });
+        case "security":
+            return _jsx(ShieldAlert, { size: 14, className: "text-red-600" });
+        case "updates":
+            return _jsx(Sparkles, { size: 14, className: "text-blue-600" });
+        case "marketing":
+            return _jsx(Tag, { size: 14, className: "text-amber-600" });
+        default:
+            return _jsx(Info, { size: 14, className: "text-gray-600" });
+    }
+}
+function formatTimeAgo(dateStr) {
+    const diff = Date.now() - new Date(dateStr).getTime();
+    const mins = Math.floor(diff / (1000 * 60));
+    if (mins < 1)
+        return "Just now";
+    if (mins < 60)
+        return `${mins}m ago`;
+    const hours = Math.floor(mins / 60);
+    if (hours < 24)
+        return `${hours}h ago`;
+    const days = Math.floor(hours / 24);
+    if (days < 7)
+        return `${days}d ago`;
+    return new Date(dateStr).toLocaleDateString();
+}
+/**
+ * Universal Notification Bell Component for SaaS applications.
+ * Renders an unread badge counter and a notification feed dropdown.
+ */
+export function NotificationBell({ apiUrl, onNavigate, onOpenSettings, className, }) {
+    const { notifications, unreadCount, markAsRead, markAllAsRead } = useNotifications({ apiUrl });
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs("button", { "aria-label": "Open notifications", className: cn("relative p-2 rounded-xl text-gray-600 hover:text-gray-900 hover:bg-gray-100 transition-colors cursor-pointer outline-none", className), children: [_jsx(Bell, { size: 18 }), unreadCount > 0 && (_jsx("span", { className: "absolute top-1 right-1 flex h-4 min-w-[16px] px-1 items-center justify-center rounded-full bg-violet-600 text-[10px] font-bold text-white shadow-sm ring-2 ring-background animate-in zoom-in-50", children: unreadCount > 99 ? "99+" : unreadCount }))] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-80 sm:w-96 max-h-[480px] p-0 rounded-2xl shadow-2xl border border-gray-100 overflow-hidden z-50 bg-white", children: [_jsxs("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-100 bg-gray-50/70", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-sm font-bold text-gray-900", children: "Notifications" }), unreadCount > 0 && (_jsxs("span", { className: "bg-violet-100 text-violet-700 text-[10px] font-bold px-1.5 py-0.5 rounded-full", children: [unreadCount, " new"] }))] }), _jsxs("div", { className: "flex items-center gap-1", children: [unreadCount > 0 && (_jsxs("button", { type: "button", onClick: markAllAsRead, title: "Mark all as read", className: "flex items-center gap-1 text-[11px] font-semibold text-violet-700 hover:text-violet-900 px-2 py-1 rounded-md hover:bg-violet-50 transition-colors cursor-pointer", children: [_jsx(CheckCheck, { size: 13 }), "Mark all read"] })), onOpenSettings && (_jsx("button", { type: "button", onClick: onOpenSettings, title: "Notification Settings", className: "p-1 rounded-md text-gray-400 hover:text-gray-600 hover:bg-gray-100 transition-colors cursor-pointer", children: _jsx(Settings, { size: 14 }) }))] })] }), _jsx("div", { className: "overflow-y-auto max-h-[360px] divide-y divide-gray-50", children: notifications.length === 0 ? (_jsxs("div", { className: "py-12 text-center text-gray-400 space-y-2", children: [_jsx(Bell, { size: 32, strokeWidth: 1.5, className: "mx-auto text-gray-300" }), _jsx("p", { className: "text-xs font-medium text-gray-500", children: "No notifications yet" }), _jsx("p", { className: "text-[11px] text-gray-400", children: "You're completely caught up! \u2728" })] })) : (notifications.map((item) => {
+                            const isUnread = !item.isRead;
+                            return (_jsxs("div", { onClick: () => {
+                                    if (isUnread)
+                                        markAsRead(item.id);
+                                    if (item.actionUrl && onNavigate) {
+                                        onNavigate(item.actionUrl);
+                                    }
+                                }, className: cn("flex items-start gap-3 p-3.5 transition-colors cursor-pointer text-left", isUnread ? "bg-violet-50/40 hover:bg-violet-50/70" : "bg-white hover:bg-gray-50/80"), children: [_jsx("div", { className: "mt-0.5 shrink-0 p-1.5 rounded-lg bg-gray-100 border border-gray-200/60", children: getCategoryIcon(item.category) }), _jsxs("div", { className: "flex-1 min-w-0 space-y-0.5", children: [_jsxs("div", { className: "flex items-center justify-between gap-1", children: [_jsx("p", { className: cn("text-xs font-semibold truncate", isUnread ? "text-gray-900 font-bold" : "text-gray-700"), children: item.title }), _jsx("span", { className: "text-[10px] text-gray-400 shrink-0", children: formatTimeAgo(item.createdAt) })] }), _jsx("p", { className: "text-[11px] text-gray-600 line-clamp-2 leading-relaxed", children: item.message })] }), isUnread && (_jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-violet-600 shrink-0 mt-2" }))] }, item.id));
+                        })) }), onOpenSettings && (_jsx("div", { className: "p-2 border-t border-gray-100 bg-gray-50/50 text-center", children: _jsx("button", { type: "button", onClick: onOpenSettings, className: "text-[11px] font-semibold text-gray-500 hover:text-violet-700 transition-colors cursor-pointer", children: "Configure Notification Preferences \u2192" }) }))] })] }));
+}

package/dist/index.d.ts

@@ -7,9 +7,12 @@ export * from "./components/base/label";
 export * from "./components/base/avatar";
 export * from "./components/base/dropdown-menu";
 export * from "./components/saas/user-menu";
+export * from "./components/saas/NotificationBell";
 export * from "./components/saas/status-badge";
 export * from "./components/layout/GlobalNavbar";
 export * from "./components/layout/GlobalFooter";
+export * from "./components/brand/BrandNav";
+export * from "./components/brand/BrandFooterSection";
 export * from "./components/data/DataTable";
 export * from "./components/data/TableToolbar";
 export * from "./components/data/EmptyState";
@@ -19,5 +22,8 @@ export * from "./components/display/CopyButton";
 export * from "./components/feedback/ErrorState";
 export * from "./components/feedback/ConfirmDialog";
 export * from "./components/feedback/Skeleton";
+export * from "./components/neural";
 export { cn } from "./utils/cn";
+export * from "./utils/useNotifications";
+export * from "./utils/useWebPush";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,iCAAiC,CAAC;AAGhD,cAAc,6BAA6B,CAAC;AAE5C,cAAc,gCAAgC,CAAC;AAG/C,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AAIjD,cAAc,6BAA6B,CAAC;AAE5C,cAAc,gCAAgC,CAAC;AAE/C,cAAc,8BAA8B,CAAC;AAI7C,cAAc,iCAAiC,CAAC;AAEhD,cAAc,+BAA+B,CAAC;AAE9C,cAAc,iCAAiC,CAAC;AAIhD,cAAc,kCAAkC,CAAC;AAEjD,cAAc,qCAAqC,CAAC;AAEpD,cAAc,gCAAgC,CAAC;AAG/C,OAAO,EAAE,EAAE,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,iCAAiC,CAAC;AAGhD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oCAAoC,CAAC;AAEnD,cAAc,gCAAgC,CAAC;AAG/C,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AAGjD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uCAAuC,CAAC;AAItD,cAAc,6BAA6B,CAAC;AAE5C,cAAc,gCAAgC,CAAC;AAE/C,cAAc,8BAA8B,CAAC;AAI7C,cAAc,iCAAiC,CAAC;AAEhD,cAAc,+BAA+B,CAAC;AAE9C,cAAc,iCAAiC,CAAC;AAIhD,cAAc,kCAAkC,CAAC;AAEjD,cAAc,qCAAqC,CAAC;AAEpD,cAAc,gCAAgC,CAAC;AAG/C,cAAc,qBAAqB,CAAC;AAGpC,OAAO,EAAE,EAAE,EAAE,MAAM,YAAY,CAAC;AAChC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC"}

package/dist/index.js

@@ -9,11 +9,15 @@ export * from "./components/base/avatar";
 export * from "./components/base/dropdown-menu";
 // ─── SaaS Components ─────────────────────────────────────────────────────────
 export * from "./components/saas/user-menu";
+export * from "./components/saas/NotificationBell";
 // StatusBadge, PriorityBadge, RoleBadge, StatusType, PriorityType, RoleType
 export * from "./components/saas/status-badge";
 // ─── Layout Components ───────────────────────────────────────────────────────
 export * from "./components/layout/GlobalNavbar";
 export * from "./components/layout/GlobalFooter";
+// ─── Brand Mesh Components ────────────────────────────────────────────────────
+export * from "./components/brand/BrandNav";
+export * from "./components/brand/BrandFooterSection";
 // ─── Data Components ─────────────────────────────────────────────────────────
 // DataTable — sortable, paginated, column-visibility-aware table
 export * from "./components/data/DataTable";
@@ -35,5 +39,9 @@ export * from "./components/feedback/ErrorState";
 export * from "./components/feedback/ConfirmDialog";
 // Skeleton, SkeletonText, SkeletonAvatar, SkeletonStatCard, SkeletonTable, SkeletonUserRow
 export * from "./components/feedback/Skeleton";
+// ─── Neural AI Components ───────────────────────────────────────────────────
+export * from "./components/neural";
 // ─── Utils ───────────────────────────────────────────────────────────────────
 export { cn } from "./utils/cn";
+export * from "./utils/useNotifications";
+export * from "./utils/useWebPush";