@janovix/blocks 1.0.0-rc.4 → 1.0.0-rc.6

package/dist/index.cjs

@@ -9656,9 +9656,11 @@ function AvatarEditor({
   const [dragStart, setDragStart] = React32.useState({ x: 0, y: 0 });
   const [showGrid, setShowGrid] = React32.useState(initialShowGrid);
   React32.useEffect(() => {
-    if (imageSource && !imageSource.startsWith("data:")) {
+    if (imageSource) {
       const img = new Image();
-      img.crossOrigin = "anonymous";
+      if (!imageSource.startsWith("data:")) {
+        img.crossOrigin = "anonymous";
+      }
       img.onload = () => {
         setImage(img);
         setImageLoaded(true);
@@ -9667,6 +9669,12 @@ function AvatarEditor({
         setPosition({ x: 0, y: 0 });
       };
       img.src = imageSource;
+    } else {
+      setImage(null);
+      setImageLoaded(false);
+      setZoom(1);
+      setRotation(0);
+      setPosition({ x: 0, y: 0 });
     }
   }, [imageSource]);
   const generateOutput = React32.useCallback(() => {
@@ -9846,6 +9854,7 @@ function AvatarEditor({
   const handleTouchMove = React32.useCallback(
     (e) => {
       if (!isDragging) return;
+      e.preventDefault();
       const touch = e.touches[0];
       setPosition({
         x: touch.clientX - dragStart.x,
@@ -10428,14 +10437,13 @@ function DrawerDescription({
 function useMediaQuery(query) {
   const [matches, setMatches] = React32.useState(false);
   React32.useEffect(() => {
+    if (typeof window === "undefined") return;
     const media = window.matchMedia(query);
-    if (media.matches !== matches) {
-      setMatches(media.matches);
-    }
+    setMatches(media.matches);
     const listener = () => setMatches(media.matches);
     media.addEventListener("change", listener);
     return () => media.removeEventListener("change", listener);
-  }, [matches, query]);
+  }, [query]);
   return matches;
 }
 function AvatarEditorDialog({
@@ -10458,7 +10466,15 @@ function AvatarEditorDialog({
   const [editedValue, setEditedValue] = React32.useState(value ?? null);
   const [isSaving, setIsSaving] = React32.useState(false);
   const [feedback, setFeedback] = React32.useState(null);
+  const [mobileEditorSize, setMobileEditorSize] = React32.useState(editorSize);
   const isMobile = useMediaQuery("(max-width: 640px)");
+  React32.useEffect(() => {
+    if (typeof window !== "undefined" && isMobile) {
+      setMobileEditorSize(Math.min(editorSize + 40, window.innerWidth - 48));
+    } else {
+      setMobileEditorSize(editorSize);
+    }
+  }, [isMobile, editorSize]);
   const handleOpenChange = React32.useCallback(
     (open) => {
       if (open) {
@@ -10533,7 +10549,6 @@ function AvatarEditorDialog({
       ]
     }
   );
-  const mobileEditorSize = isMobile ? Math.min(editorSize + 40, window.innerWidth - 48) : editorSize;
   const EditorContent = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-4", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       AvatarEditor,
@@ -10858,7 +10873,7 @@ function NotificationsWidget({
   onNotificationClick,
   size: size4 = "md",
   maxVisible = 5,
-  playSound: _playSound = true,
+  playSound = true,
   soundUrl,
   className,
   emptyMessage = "No notifications",
@@ -10875,10 +10890,13 @@ function NotificationsWidget({
   const styles = sizeConfig[size4];
   const dotBgColor = dotColorConfig[dotColor];
   const unreadCount = notifications.filter((n) => !n.read).length;
-  const visibleNotifications = notifications.slice(0, maxVisible);
+  const visibleNotifications = React32__namespace.useMemo(
+    () => notifications.slice(0, maxVisible),
+    [notifications, maxVisible]
+  );
   const hasMore = notifications.length > maxVisible;
   React32__namespace.useEffect(() => {
-    if (soundType !== "none" && unreadCount > prevCount && prevCount > 0) {
+    if (playSound && soundType !== "none" && unreadCount > prevCount && prevCount > 0) {
       const now = Date.now();
       if (now - lastSoundPlayedRef.current >= soundCooldown) {
         playNotificationSound(soundType, soundUrl);
@@ -10886,7 +10904,7 @@ function NotificationsWidget({
       }
     }
     setPrevCount(unreadCount);
-  }, [unreadCount, prevCount, soundType, soundUrl, soundCooldown]);
+  }, [unreadCount, prevCount, soundType, soundUrl, soundCooldown, playSound]);
   React32__namespace.useEffect(() => {
     if (isOpen && onMarkAsRead) {
       visibleNotifications.forEach((notification) => {
@@ -10980,18 +10998,32 @@ function NotificationsWidget({
               const config = typeConfig[notification.type || "info"];
               const Icon = config.icon;
               const hasLink = !!notification.href;
+              const handleClick = () => handleNotificationClick(notification);
+              const handleKeyDown = (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  handleNotificationClick(notification);
+                }
+              };
+              const MotionElement = hasLink ? react.motion.button : react.motion.div;
+              const interactionProps = hasLink ? {
+                role: "button",
+                tabIndex: 0,
+                onClick: handleClick,
+                onKeyDown: handleKeyDown
+              } : {};
               return /* @__PURE__ */ jsxRuntime.jsxs(
-                react.motion.div,
+                MotionElement,
                 {
                   initial: { opacity: 0, y: -10 },
                   animate: { opacity: 1, y: 0 },
                   className: cn(
-                    "relative flex gap-3 px-4 py-3 transition-colors group",
+                    "relative flex gap-3 px-4 py-3 transition-colors group w-full text-left border-0 bg-transparent",
                     hasLink && "cursor-pointer hover:bg-muted/50",
                     !hasLink && "cursor-default",
                     !notification.read && "bg-primary/5"
                   ),
-                  onClick: () => handleNotificationClick(notification),
+                  ...interactionProps,
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx(
                       "div",