@janovix/blocks 1.1.0 → 1.1.1-rc.1

package/dist/index.cjs

@@ -5059,11 +5059,17 @@ function NotificationsWidget({
   const styles = sizeConfig[size];
   const dotBgColor = dotColorConfig[dotColor];
   const unreadCount = notifications.filter((n) => !n.read).length;
+  const sortedNotifications = React2__namespace.useMemo(
+    () => [...notifications].sort(
+      (a, b) => b.timestamp.getTime() - a.timestamp.getTime()
+    ),
+    [notifications]
+  );
   const visibleNotifications = React2__namespace.useMemo(
-    () => notifications.slice(0, maxVisible),
-    [notifications, maxVisible]
+    () => sortedNotifications.slice(0, maxVisible),
+    [sortedNotifications, maxVisible]
   );
-  const hasMore = notifications.length > maxVisible;
+  const hasMore = sortedNotifications.length > maxVisible;
   React2__namespace.useEffect(() => {
     if (playSound && soundType !== "none" && unreadCount > prevCount && prevCount > 0) {
       const now = Date.now();
@@ -5108,14 +5114,7 @@ function NotificationsWidget({
               initial: { scale: 0, opacity: 0 },
               animate: { scale: 1, opacity: 1 },
               exit: { scale: 0, opacity: 0 },
-              className: cn(
-                "absolute flex items-center justify-center rounded-full",
-                dotBgColor,
-                "text-white font-medium",
-                unreadCount > 9 ? styles.badge : styles.dot,
-                unreadCount > 9 && "px-1"
-              ),
-              children: unreadCount > 9 ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: unreadCount > 99 ? "99+" : unreadCount }) : null
+              className: cn("absolute rounded-full", dotBgColor, styles.dot)
             }
           ) }),
           /* @__PURE__ */ jsxRuntime.jsx(react.AnimatePresence, { children: unreadCount > 0 && showPulse && pulseStyle !== "none" && /* @__PURE__ */ jsxRuntime.jsx(
@@ -5159,11 +5158,11 @@ function NotificationsWidget({
               }
             ) })
           ] }),
-          notifications.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-8 px-4 text-center", children: [
+          sortedNotifications.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-8 px-4 text-center", children: [
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-12 h-12 rounded-full bg-muted flex items-center justify-center mb-3", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { className: "w-6 h-6 text-muted-foreground" }) }),
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: emptyMessage })
           ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { className: "h-[320px]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-border", children: visibleNotifications.map((notification) => {
+            /* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { className: "max-h-[400px]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-border", children: visibleNotifications.map((notification) => {
               const config = typeConfig[notification.type || "info"];
               const Icon = config.icon;
               const hasLink = !!notification.href;
@@ -5240,10 +5239,10 @@ function NotificationsWidget({
             (hasMore || onClearAll) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-2 border-t border-border bg-muted/30", children: [
               hasMore && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
                 "+",
-                notifications.length - maxVisible,
+                sortedNotifications.length - maxVisible,
                 " more"
               ] }),
-              onClearAll && notifications.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+              onClearAll && sortedNotifications.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
                 Button,
                 {
                   variant: "ghost",