aefis-core-ui 3.0.0-rc66 → 3.0.0-rc67

package/dist/index.modern.js

@@ -19529,6 +19529,11 @@ const Tabs = ({
     scrollButtons: "auto",
     sx: _extends({
       border: _buttonContainerOutlined ? theme => `1px solid ${theme.palette.divider}` : `none`,
+      width: {
+        xs: "100%",
+        sm: "100%",
+        md: "auto"
+      },
       borderRadius: _buttonContainerOutlined ? "8px" : "0"
     }, tabListContainerStyle),
     children: config == null ? void 0 : config.map((tab, index) => {
@@ -19611,15 +19616,18 @@ const TabPanels = /*#__PURE__*/React__default.forwardRef(({
   const buttonAlignStyle = {
     left: {
       marginLeft: 0,
-      alignItems: "center"
+      alignItems: "center",
+      justifyContent: "flex-start"
     },
     center: {
       margin: "auto",
-      alignItems: "center"
+      alignItems: "center",
+      justifyContent: "center"
     },
     right: {
       marginLeft: "auto",
-      alignItems: "center"
+      alignItems: "center",
+      justifyContent: "flex-end"
     }
   };
   useImperativeHandle(ref, () => ({
@@ -19636,8 +19644,8 @@ const TabPanels = /*#__PURE__*/React__default.forwardRef(({
   const tabContainerStyle = _extends({
     width: "100%",
     display: _buttonContainerOutlined2 ? "flex" : "block",
-    pl: 2,
-    pr: 2
+    pl: title && _useButtons ? 0 : 2,
+    pr: title && _useButtons ? 0 : 2
   }, tabContainerStyles);
   return /*#__PURE__*/jsxs(TabContext, {
     value: currentTab,
@@ -19657,29 +19665,58 @@ const TabPanels = /*#__PURE__*/React__default.forwardRef(({
           tabListContainerStyle: tabListContainerStyles
         })
       })
-    }) : /*#__PURE__*/jsxs(Box$2, {
+    }) : /*#__PURE__*/jsx(Box$2, {
       sx: tabContainerStyle,
-      children: [title && /*#__PURE__*/jsx(TitleAndActionHeader, _extends({
-        title: title,
-        titleComponent: _titleComponent,
-        subtitle: subtitle,
-        showExport: false,
-        gutter: false
-      }, titleProps)), /*#__PURE__*/jsx(Box$2, {
-        sx: _extends({
-          display: "flex",
-          flexWrap: "wrap",
-          mb: _buttonContainerOutlined2 ? 0 : 2
-        }, buttonAlignStyle[title ? "right" : _buttonPosition]),
-        children: /*#__PURE__*/jsx(Tabs, {
-          name: _name,
-          config: config,
-          handleTabChange: handleTabChange,
-          useButtons: _useButtons,
-          buttonContainerOutlined: _buttonContainerOutlined2,
-          tabListContainerStyle: tabListContainerStyles
-        })
-      })]
+      children: /*#__PURE__*/jsxs(Grid$1, {
+        container: true,
+        direction: "row",
+        justifyContent: "space-between",
+        spacing: 0,
+        children: [title && /*#__PURE__*/jsx(Grid$1, {
+          item: true,
+          sm: 12,
+          md: 4,
+          lg: 4,
+          zeroMinWidth: true,
+          sx: {
+            display: "inline-flex",
+            alignItems: "center"
+          },
+          children: /*#__PURE__*/jsx(TitleAndActionHeader, _extends({
+            title: title,
+            titleComponent: _titleComponent,
+            subtitle: subtitle,
+            showExport: false,
+            gutter: false
+          }, titleProps))
+        }), /*#__PURE__*/jsx(Grid$1, {
+          item: true,
+          sm: 12,
+          md: 8,
+          lg: 8,
+          sx: {
+            display: "inline-flex",
+            alignItems: "center",
+            width: "100%"
+          },
+          zeroMinWidth: true,
+          children: /*#__PURE__*/jsx(Box$2, {
+            sx: _extends({
+              display: "flex",
+              flexWrap: "nowrap",
+              width: "100%"
+            }, buttonAlignStyle[title ? "right" : _buttonPosition]),
+            children: /*#__PURE__*/jsx(Tabs, {
+              name: _name,
+              config: config,
+              handleTabChange: handleTabChange,
+              useButtons: _useButtons,
+              buttonContainerOutlined: _buttonContainerOutlined2,
+              tabListContainerStyle: tabListContainerStyles
+            })
+          })
+        })]
+      })
     }), config == null ? void 0 : config.map((tab, index) => /*#__PURE__*/jsx(TabPanel$1, {
       value: index + "",
       sx: [{