@marianmeres/stuic 3.2.0 → 3.3.1

package/dist/components/Carousel/Carousel.svelte

@@ -57,6 +57,9 @@
 		/** Show scrollbar on hover (default: true). Set to false when using navigation buttons */
 		scrollbar?: boolean;
 
+		/** Enable horizontal scrolling via mouse wheel (default: true) */
+		wheelScroll?: boolean;
+
 		/** Custom class for container */
 		class?: string;
 
@@ -103,6 +106,7 @@
 		loop = false,
 		scrollBehavior = "smooth",
 		scrollbar = true,
+		wheelScroll = true,
 		class: classProp,
 		classTrack,
 		classItem,
@@ -214,14 +218,18 @@
 				itemEls[activeItem.id]?.scrollIntoView({
 					behavior: scrollBehavior,
 					block: "nearest",
-					inline: snapAlign === "center" ? "center" : snapAlign === "end" ? "end" : "start",
+					inline:
+						snapAlign === "center" ? "center" : snapAlign === "end" ? "end" : "start",
 				});
 			}
 
 			// Reset flag after scroll animation completes
-			setTimeout(() => {
-				isScrollingProgrammatically = false;
-			}, scrollBehavior === "instant" ? 0 : 300);
+			setTimeout(
+				() => {
+					isScrollingProgrammatically = false;
+				},
+				scrollBehavior === "instant" ? 0 : 300
+			);
 		}, 0);
 	}
 
@@ -248,6 +256,24 @@
 		}
 	}
 
+	// Mouse wheel horizontal scroll handler
+	function handleWheel(e: WheelEvent) {
+		if (!wheelScroll || e.deltaY === 0) return;
+		e.preventDefault();
+
+		// With snap enabled, navigate by item; otherwise scroll by pixels
+		if (snap) {
+			if (e.deltaY > 0) {
+				coll.setActiveNext();
+			} else {
+				coll.setActivePrevious();
+			}
+			scrollActiveIntoView();
+		} else {
+			trackEl!.scrollLeft += e.deltaY;
+		}
+	}
+
 	// Public API methods
 	export function goTo(index: number) {
 		coll.setActiveIndex(index);
@@ -315,6 +341,7 @@
 			data-snap-align={!unstyled && snap ? snapAlign : undefined}
 			data-scrollbar={!unstyled && scrollbar ? "true" : undefined}
 			onkeydown={handleKeydown}
+			onwheel={handleWheel}
 		>
 			{#each coll.items as item, i (item.id)}
 				{@const active = isItemActive(i)}

package/dist/components/Carousel/Carousel.svelte.d.ts

@@ -41,6 +41,8 @@ export interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "children">
     scrollBehavior?: ScrollBehavior;
     /** Show scrollbar on hover (default: true). Set to false when using navigation buttons */
     scrollbar?: boolean;
+    /** Enable horizontal scrolling via mouse wheel (default: true) */
+    wheelScroll?: boolean;
     /** Custom class for container */
     class?: string;
     /** Custom class for the scrollable track */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marianmeres/stuic",
-  "version": "3.2.0",
+  "version": "3.3.1",
   "files": [
     "dist",
     "!dist/**/*.test.*",