fix(Tabs): adjust active position calculation to account for border w…

…idth Signed-off-by: donniean <[email protected]>
kubesphere · Jan 6, 2025 · e7c85b1 · e7c85b1
1 parent 0d3d150
commit e7c85b1
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/packages/components/src/Tabs/Tabs.tsx b/packages/components/src/Tabs/Tabs.tsx
@@ -143,10 +143,17 @@ export function Tabs({
       if (_activeKey in refs.current && wrapperRef.current) {
         const element = refs.current[_activeKey];
         const rect = element.getBoundingClientRect();
+
+        const wrapperStyle = window.getComputedStyle(wrapperRef.current);
+        const borderLeftWidth = parseFloat(wrapperStyle.borderLeftWidth);
+
         setActivePosition({
           width: rect.width,
           height: rect.height,
-          translate: rect.x - wrapperRef.current.getBoundingClientRect().x - WRAPPER_PADDING,
+          translate:
+            rect.x -
+            (wrapperRef.current.getBoundingClientRect().x + borderLeftWidth + 1) -
+            WRAPPER_PADDING,
           translateY: rect.y - wrapperRef.current.getBoundingClientRect().y - WRAPPER_PADDING,
         });