@plesk/ui-library 3.43.0 → 3.43.2

package/cjs/components/Tabs/TabList.js

@@ -30,25 +30,26 @@ const TabList = _ref => {
     monospacedWidth,
     baseClassName
   } = _ref;
-  if (!_react.Children.toArray(children).length) {
-    return null;
-  }
+  const handleTabClick = (tab, position) => {
+    onTabClick(position);
+    tab?.props?.onActivate?.();
+  };
   let tabs = _react.Children.toArray(children);
   tabs = tabs.filter(child => child?.type === _Tab.default);
   const listChildren = tabs.slice(0, visibleLength);
   const menuChildren = tabs.slice(visibleLength);
-  const listItems = _react.Children.map(listChildren, (tab, index) => {
+  const listItems = listChildren.map((tab, index) => {
     const position = index + 1;
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabListItem.default, {
       // eslint-disable-line react/no-array-index-key
       tab: tab,
       baseClassName: baseClassName,
       selected: position === active,
-      onClick: () => onTabClick(position),
+      onClick: () => handleTabClick(tab, position),
       monospacedWidth: monospacedWidth
     }, index);
   });
-  const menuItems = _react.Children.map(menuChildren, (tab, index) => {
+  const menuItems = menuChildren.map((tab, index) => {
     const position = listChildren.length + index + 1;
     const {
       title,
@@ -77,7 +78,7 @@ const TabList = _ref => {
         })]
       }),
       active: active === position,
-      onClick: () => onTabClick(position),
+      onClick: () => handleTabClick(tab, position),
       className: `${baseClassName}__menu-item`,
       component: Tag,
       ...tabProps,

package/cjs/components/Tabs/TabListItem.js

@@ -28,32 +28,36 @@ const TabListItem = _ref => {
     icon,
     onActivate,
     onClose,
-    component: Tag = 'a',
+    component = 'a',
     style = {},
     ...tabProps
   } = tab.props;
   const closable = typeof onClose === 'function';
-  tabProps.tabIndex = isFake ? -1 : tabProps.tabIndex || 0;
-  if (!isFake) {
-    tabProps.onKeyDown = (0, _utils.wrapFunction)(tabProps.onKeyDown, e => {
+  const linkProps = isFake ? {
+    tabIndex: -1
+  } : {
+    tabIndex: tabProps.tabIndex || 0,
+    onClick,
+    onKeyDown: (0, _utils.wrapFunction)(tabProps.onKeyDown, e => {
       if (e.key === 'Enter') {
         e.currentTarget.click();
       }
-    });
-  }
+    }),
+    role: 'tab',
+    'aria-selected': selected || undefined,
+    ...tabProps
+  };
+  const Tag = isFake ? 'a' : component;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
     className: (0, _classnames.default)(`${baseClassName}__tab`, selected && `${baseClassName}__tab--selected`, closable && `${baseClassName}__tab--closable`),
     role: isFake ? undefined : 'presentation',
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Tag, {
       className: `${baseClassName}__link`,
-      role: isFake ? undefined : 'tab',
-      "aria-selected": selected || undefined,
-      onClick: onClick,
       style: {
         width: monospacedWidth || undefined,
         ...style
       },
-      ...tabProps,
+      ...linkProps,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabIcon.default, {
         icon: icon,
         baseClassName: baseClassName

package/cjs/components/Tabs/Tabs.js

@@ -40,7 +40,7 @@ const Tabs = _ref => {
   const tabNavRef = (0, _react.useRef)(null);
   const tabListRef = (0, _react.useRef)(null);
   const fakeAddonRef = (0, _react.useRef)(null);
-  const childrenCount = _react.Children.count(children);
+  const childrenCount = _react.Children.toArray(children).length;
   const [active, setActive] = (0, _useActive.useActive)(externalActive);
   const {
     monospacedWidth,
@@ -55,11 +55,6 @@ const Tabs = _ref => {
     baseClassName,
     childrenCount
   });
-  const handleTabClick = active => {
-    setActive(active);
-    const tab = Array.isArray(children) ? children[active - 1] : children;
-    tab?.props?.onActivate?.();
-  };
   const [searching, setSearching] = (0, _react.useState)(false);
   if (!childrenCount) {
     return null;
@@ -110,7 +105,7 @@ const Tabs = _ref => {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabList.default, {
         tabListRef: tabListRef,
         active: active,
-        onTabClick: handleTabClick,
+        onTabClick: setActive,
         visibleLength: visibleLength,
         monospacedWidth: monospacedWidth,
         baseClassName: baseClassName,
@@ -132,7 +127,7 @@ const Tabs = _ref => {
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: `${baseClassName}__tab-panel`,
       role: "tabpanel",
-      children: _react.Children.map(children, (tab, index) => index + 1 === active ? tab : null)
+      children: _react.Children.toArray(children).map((tab, index) => index + 1 === active ? tab : null)
     })]
   });
 };

package/cjs/index.js

@@ -46,5 +46,5 @@ Object.keys(_components).forEach(function (key) {
   });
 });
 // Copyright 1999-2025. WebPros International GmbH. All rights reserved.
-const version = exports.version = "3.43.0";
+const version = exports.version = "3.43.2";
 (0, _svg4everybody.default)();