@thecb/components 11.4.1-beta.1 → 11.4.1

package/dist/index.esm.js

@@ -48405,19 +48405,27 @@ var Tab = function Tab(_ref) {
     className: className,
     onClick: onClick,
     margin: "0 0 -1px 0",
-    padding: "0.5rem 0.75rem",
+    padding: "1rem 0.75rem",
     background: activeTab === label ? WHITE : GRECIAN_GREY,
     extraStyles: "cursor: pointer; flex-grow: 1; text-align: center; ".concat(activeTab === label ? "list-style: none;" : "")
-  }, /*#__PURE__*/React__default.createElement(Text$1, null, label));
+  }, /*#__PURE__*/React__default.createElement(Text$1, {
+    weight: "600"
+  }, label));
 };
 
-var _excluded$N = ["tabsConfig", "tabsDisplayMode"];
+var _excluded$N = ["tabsConfig", "tabsDisplayMode", "tabsPadding", "contentPadding", "extraStyles"];
 var HORIZONTAL = "horizontal";
 var Tabs = function Tabs(_ref) {
   var _tabsConfig$tabs$;
   var tabsConfig = _ref.tabsConfig,
     _ref$tabsDisplayMode = _ref.tabsDisplayMode,
     tabsDisplayMode = _ref$tabsDisplayMode === void 0 ? HORIZONTAL : _ref$tabsDisplayMode,
+    _ref$tabsPadding = _ref.tabsPadding,
+    tabsPadding = _ref$tabsPadding === void 0 ? "0" : _ref$tabsPadding,
+    _ref$contentPadding = _ref.contentPadding,
+    contentPadding = _ref$contentPadding === void 0 ? "0" : _ref$contentPadding,
+    _ref$extraStyles = _ref.extraStyles,
+    extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles,
     props = _objectWithoutProperties(_ref, _excluded$N);
   var _useState = useState(((_tabsConfig$tabs$ = tabsConfig.tabs[0]) === null || _tabsConfig$tabs$ === void 0 ? void 0 : _tabsConfig$tabs$.label) || null),
     _useState2 = _slicedToArray(_useState, 2),
@@ -48453,12 +48461,18 @@ var Tabs = function Tabs(_ref) {
     return /*#__PURE__*/React__default.createElement(Stack, null, createTabs(tabsConfig, activeTab));
   };
   return /*#__PURE__*/React__default.createElement(Box, _extends({
-    className: "tabs"
+    className: "tabs",
+    padding: "0",
+    extraStyles: extraStyles
   }, props), /*#__PURE__*/React__default.createElement(Box, {
-    className: "tab-list"
+    className: "tab-list",
+    padding: tabsPadding
   }, tabsDisplayMode == HORIZONTAL ? showHorizontal(tabsConfig, activeTab) : showVertical(tabsConfig, activeTab)), /*#__PURE__*/React__default.createElement(Box, {
-    className: "tab-content"
-  }, /*#__PURE__*/React__default.createElement(Box, null, tabsConfig.tabs.map(function (tab, idx) {
+    className: "tab-content",
+    padding: contentPadding
+  }, /*#__PURE__*/React__default.createElement(Box, {
+    padding: "0"
+  }, tabsConfig.tabs.map(function (tab, idx) {
     if (tab.label !== activeTab) return undefined;
     return /*#__PURE__*/React__default.createElement(Fragment$1, {
       key: idx