From 0a24a01355db76416f088635ef53eb579b92bb1f Mon Sep 17 00:00:00 2001
From: Ron Gruse <rgruse@webmatch.de>
Date: Mon, 15 Sep 2025 13:19:49 +0200
Subject: [PATCH] Adding option to allow the Navigation to react to the
 ItemsToScroll Property

---
 src/components/Navigation/Navigation.ts       | 5 ++++-
 src/components/Navigation/Navigation.types.ts | 3 ++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/Navigation/Navigation.ts b/src/components/Navigation/Navigation.ts
index 9d4875b0..de14cec8 100644
--- a/src/components/Navigation/Navigation.ts
+++ b/src/components/Navigation/Navigation.ts
@@ -13,6 +13,9 @@ export const Navigation = defineComponent<NavigationProps>({
     carousel: {
       type: Object as PropType<NavigationProps['carousel']>,
     },
+    complyWithItemsToScroll: {
+        type: Boolean
+    }
   },
   setup(props, { slots, attrs }) {
     let carousel = inject(injectCarousel, null)!
@@ -43,7 +46,7 @@ export const Navigation = defineComponent<NavigationProps>({
       () => !carousel.config.wrapAround && carousel.currentSlide <= carousel.minSlide
     )
     const nextDisabled = computed(
-      () => !carousel.config.wrapAround && carousel.currentSlide >= carousel.maxSlide
+      () => !carousel.config.wrapAround && carousel.currentSlide >= (carousel.maxSlide + (1 - (props.complyWithItemsToScroll ? carousel.config.itemsToScroll : 1 )))
     )
 
     return () => {
diff --git a/src/components/Navigation/Navigation.types.ts b/src/components/Navigation/Navigation.types.ts
index d7b29514..f3abe866 100644
--- a/src/components/Navigation/Navigation.types.ts
+++ b/src/components/Navigation/Navigation.types.ts
@@ -1,5 +1,6 @@
 import { Carousel, CarouselExposed } from '@/components/Carousel'
 
 export type NavigationProps = {
-  carousel?: InstanceType<typeof Carousel> & CarouselExposed
+  carousel?: InstanceType<typeof Carousel> & CarouselExposed,
+  complyWithItemsToScroll: boolean
 }
\ No newline at end of file