@formixru/b2b-ui 4.6.1 → 4.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@formixru/b2b-ui",
-    "version": "4.6.1",
+    "version": "4.6.2",
     "type": "module",
     "repository": {
         "type": "git",

package/src/components/sidebar/index.scss

@@ -1,8 +1,7 @@
 @use '../../variables' as *;
 
 $b: '.sidebar';
-
-$sidebarButtonSize: 56px;
+$sidebar-button-size: 56px;
 
 #{$b} {
     display: flex;
@@ -44,7 +43,7 @@ $sidebarButtonSize: 56px;
         display: flex;
         flex-direction: column;
         position: absolute;
-        right: calc(100% - $sidebarButtonSize);
+        right: calc(100% - $sidebar-button-size);
         top: 0;
 
         @media (--tablet-landscape-up) {
@@ -65,7 +64,7 @@ $sidebarButtonSize: 56px;
 
         #{$b}_left & {
             align-items: flex-start;
-            left: calc(100% - $sidebarButtonSize);
+            left: calc(100% - $sidebar-button-size);
             right: auto;
 
             @media (--tablet-landscape-up) {
@@ -91,12 +90,12 @@ $sidebarButtonSize: 56px;
         background-color: $sidebar-disabled-button-bg;
         color: $sidebar-disabled-button-color;
         display: flex;
-        height: $sidebarButtonSize;
+        height: $sidebar-button-size;
         justify-content: center;
         transition-duration: var(--duration-micro-s);
         transition-property: background-color, color;
         transition-timing-function: var(--easing-standard);
-        width: $sidebarButtonSize;
+        width: $sidebar-button-size;
 
         #{$b}_catalog & {
             @media (--tablet-landscape-up) {
@@ -134,7 +133,7 @@ $sidebarButtonSize: 56px;
             color: $sidebar-disabled-button-label-color;
             height: auto;
             justify-content: flex-start;
-            min-height: $sidebarButtonSize;
+            min-height: $sidebar-button-size;
             min-width: 112px;
             padding: 16px;
             width: 100%;
@@ -183,7 +182,7 @@ $sidebarButtonSize: 56px;
         height: 100%;
         overflow: auto;
         -webkit-overflow-scrolling: touch;
-        width: calc(100% - $sidebarButtonSize);
+        width: calc(100% - $sidebar-button-size);
 
         @media (--tablet-landscape-up) {
             width: 320px;

package/src/components/tabs/index.js

@@ -17,25 +17,14 @@ const setLeftWidth = async ($line, $el) => {
     }).finished;
 };
 
-const setActive = ($el, active) => {
-    if ($el.tagName === 'BUTTON') {
-        $el.disabled = active;
-    } else if (active) {
-        $el.dataset.disabled = '';
-    } else {
-        delete $el.dataset.disabled;
-    }
-};
-
 export const setInitLineStyles = ($b) => {
     const $nav = $b.querySelector('.tabs__nav');
     const $items = $nav.querySelectorAll('.tabs__item');
     const $line = $nav.querySelector('.tabs__line');
 
-    const $el =
-        [...$items].find((el) => {
-            return el.tagName === 'BUTTON' ? el.disabled : el.dataset.disabled !== undefined;
-        }) || $items[0];
+    const $el = [...$items].find((el) => {
+        return el.disabled || (el.tagName !== 'BUTTON' && !el.href);
+    });
 
     setLeftWidth($line, $el);
     // Прокручиваем до нужного таба
@@ -58,7 +47,7 @@ const changeTab = ($el) => {
     const index = [...$items].indexOf($el);
 
     for (const [i, $item] of $items.entries()) {
-        setActive($item, i === index);
+        $item.disabled = i === index;
     }
 
     for (const [i, $c] of $content.entries()) {
@@ -89,28 +78,25 @@ export const init = async ($b) => {
     const handleItemClick = async (e) => {
         const $el = e.currentTarget;
         const index = [...$items].indexOf($el);
+        if ($el.tagName === 'BUTTON') {
+            if ($el.dataset.tabsFetch && $content[index].innerHTML.trim() === '') {
+                const { content } = await request({ url: $el.dataset.tabsFetch });
+                // Вставляем полученный HTML
+                $content[index].innerHTML = content;
+                // Переключаем таб
+                changeTab($el);
+            } else {
+                // Переключаем таб
+                changeTab($el);
+            }
 
-        if ($el.tagName === 'A') {
-            e.preventDefault();
-        }
-
-        if ($el.dataset.tabsFetch && $content[index].innerHTML.trim() === '') {
-            const { content } = await request({ url: $el.dataset.tabsFetch });
-            // Вставляем полученный HTML
-            $content[index].innerHTML = content;
-            // Переключаем таб
-            changeTab($el);
-        } else {
-            // Переключаем таб
-            changeTab($el);
-        }
-
-        if ($nav.swiper) {
-            $nav.swiper.slideTo(index);
-        }
+            if ($nav.swiper) {
+                $nav.swiper.slideTo(index);
+            }
 
-        if ($line) {
-            setLeftWidth($line, $el);
+            if ($line) {
+                setLeftWidth($line, $el);
+            }
         }
     };
 

package/src/components/tabs/index.scss

@@ -111,11 +111,6 @@ $b: '.tabs';
         &.swiper-slide {
             width: auto;
         }
-
-        &[data-disabled] {
-            color: $font-color-primary;
-            pointer-events: none;
-        }
     }
 
     &__label {