From a3a56b2d4519871427de1e42267ce18736f7f7b1 Mon Sep 17 00:00:00 2001
From: Nikita Gorin <36075690+NikitaCG@users.noreply.github.com>
Date: Mon, 24 Apr 2023 23:43:45 +0300
Subject: [PATCH] fix: rewrap pagination item (#36)

---
 src/components/Paginator/Paginator.scss       |  2 ++
 .../Paginator/components/PaginatorItem.tsx    | 24 +++++++++----------
 2 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/src/components/Paginator/Paginator.scss b/src/components/Paginator/Paginator.scss
index e7a06295..0710e4cb 100644
--- a/src/components/Paginator/Paginator.scss
+++ b/src/components/Paginator/Paginator.scss
@@ -15,6 +15,8 @@ $itemDimensions: 44px;
 
     &__link {
         text-decoration: none;
+        pointer-events: none;
+        color: var(--yc-color-text-primary);
     }
 
     &__item {
diff --git a/src/components/Paginator/components/PaginatorItem.tsx b/src/components/Paginator/components/PaginatorItem.tsx
index c779ef12..74bd0a2e 100644
--- a/src/components/Paginator/components/PaginatorItem.tsx
+++ b/src/components/Paginator/components/PaginatorItem.tsx
@@ -26,20 +26,20 @@ export const PaginatorItem = ({
     const navigationLink = `${urlPath || ''}?${navTag}`;
 
     return (
-        <a
-            href={navigationLink}
-            className={b('link', mods)}
-            onClick={(event) => event.preventDefault()}
+        <Button
+            view="flat"
+            size="xl"
+            className={b('item', mods)}
+            onClick={() => onClick?.(itemKey)}
+            loading={loading && Boolean(mods.active)}
         >
-            <Button
-                view="flat"
-                size="xl"
-                className={b('item', mods)}
-                onClick={() => onClick?.(itemKey)}
-                loading={loading && Boolean(mods.active)}
+            <a
+                href={navigationLink}
+                className={b('link')}
+                onClick={(event) => event.preventDefault()}
             >
                 {content}
-            </Button>
-        </a>
+            </a>
+        </Button>
     );
 };