From a01cd59101822533a5737f162084df694fa5c110 Mon Sep 17 00:00:00 2001
From: kkmch <kkmch@yandex-team.ru>
Date: Tue, 10 Oct 2023 12:30:05 +0200
Subject: [PATCH] fix: bar and inert prop setting

---
 src/blocks/Slider/Slider.tsx | 28 ++++++++++++++++++----------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/blocks/Slider/Slider.tsx b/src/blocks/Slider/Slider.tsx
index 12171add5..df97e5086 100644
--- a/src/blocks/Slider/Slider.tsx
+++ b/src/blocks/Slider/Slider.tsx
@@ -251,7 +251,7 @@ export const SliderBlock = (props: WithChildren<SliderProps>) => {
         return (
             // To have this key differ from keys used in renderDot function, added `-accessible-bar` part
             <Fragment key={`${index}-accessible-bar`}>
-                {slidesCountByBreakpoint > 1 && (
+                {slidesCountByBreakpoint > 0 && (
                     <li
                         className={b('accessible-bar')}
                         aria-current
@@ -266,8 +266,9 @@ export const SliderBlock = (props: WithChildren<SliderProps>) => {
         );
     };
 
-    const renderDot = (index: number) => {
+    const getCurrentSlideNumber = (index: number) => {
         const currentIndexDiff = index - currentIndex;
+
         let currentSlideNumber;
         if (0 <= currentIndexDiff && currentIndexDiff < slidesToShowCount) {
             currentSlideNumber = currentIndex + 1;
@@ -276,19 +277,26 @@ export const SliderBlock = (props: WithChildren<SliderProps>) => {
         } else {
             currentSlideNumber = index + 1;
         }
+        return currentSlideNumber;
+    };
+    const isVisibleSlide = (index: number) => {
+        const currentIndexDiff = index - currentIndex;
 
+        return (
+            slidesCountByBreakpoint > 0 &&
+            0 <= currentIndexDiff &&
+            currentIndexDiff < slidesToShowCount
+        );
+    };
+
+    const renderDot = (index: number) => {
         return (
             <li
                 key={index}
                 className={b('dot', {active: index === currentIndex})}
                 onClick={() => handleDotClick(index)}
-                aria-hidden={
-                    (slidesCountByBreakpoint > 1 &&
-                        0 <= currentIndexDiff &&
-                        currentIndexDiff < slidesToShowCount) ||
-                    undefined
-                }
-                aria-label={`Slide ${currentSlideNumber} of ${barSlidesCount}`}
+                aria-hidden={isVisibleSlide(index) ? true : undefined}
+                aria-label={`Slide ${getCurrentSlideNumber(index)} of ${barSlidesCount}`}
             ></li>
         );
     };
@@ -349,7 +357,7 @@ export const SliderBlock = (props: WithChildren<SliderProps>) => {
                 <SlickSlider {...settings}>
                     {React.Children.map(disclosedChildren, (child, i) => {
                         //@ts-ignore to prevent focusable elements from other slides being focused
-                        return <div inert={currentIndex !== i ? '' : undefined}>{child}</div>;
+                        return <div inert={isVisibleSlide(i) ? undefined : ''}>{child}</div>;
                     })}
                 </SlickSlider>
                 <div className={b('footer')}>