Reverse page number labels

BKWLD · Jan 20, 2024 · 60579b9 · 60579b9
1 parent ac2b552
commit 60579b9
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/src/ssr-carousel-dots.vue b/src/ssr-carousel-dots.vue
@@ -5,7 +5,7 @@
 .ssr-carousel-dots
 	button.ssr-carousel-dot-button(
 		v-for='i in pages' :key='i'
-		:aria-label='`Go to ${pageLabel} ${i}`'
+		:aria-label='makeLabel(i)'
 		:aria-disabled='isDisabled(i)'
 		@click='$emit("goto", i - 1)')
 
@@ -29,9 +29,15 @@ export default
 		boundedIndex: Number
 		pages: Number
 		pageLabel: String
+		rtl: Boolean
 
 	methods:
 
+		# Make the label for the dot
+		makeLabel: (index) ->
+			pageNumber = if @rtl then @pages - index + 1 else @index
+			"Go to #{@pageLabel} #{pageNumber}"
+
 		# Check if dot index shuold be disabled
 		isDisabled: (index) -> @boundedIndex == index - 1
 

diff --git a/src/ssr-carousel.vue b/src/ssr-carousel.vue
@@ -62,7 +62,7 @@
 	//- Dots navigation
 	ssr-carousel-dots(
 		v-if='showDots'
-		v-bind='{ boundedIndex, pages, pageLabel }'
+		v-bind='{ boundedIndex, pages, pageLabel, rtl }'
 		@goto='gotoDot')
 		template(#dot='props'): slot(name='dot' v-bind='props')