@app-studio/web 0.8.63 → 0.8.64

package/dist/components/Tabs/Tabs/Tabs.props.d.ts

@@ -9,4 +9,6 @@ export interface TabsViewProps extends TabsProps {
     setIsActive: React.Dispatch<React.SetStateAction<Tab>>;
     tabsState: Tab[];
     setTabsState: React.Dispatch<React.SetStateAction<Tab[]>>;
+    renderTab?: (tab: Tab, isActive: boolean, index: number) => React.ReactNode;
+    renderContent?: (tab: Tab, index: number) => React.ReactNode;
 }

package/dist/web.cjs.development.js

@@ -7678,7 +7678,9 @@ var TabsView = props => {
     isActive,
     setIsActive,
     tabsState,
-    setTabsState
+    setTabsState,
+    renderTab,
+    renderContent
   } = props;
   // Declares a function 'moveSelectedTabToTop' that takes an index and modifies the tabs order.
   var moveSelectedTabToTop = idx => {
@@ -7699,11 +7701,9 @@ var TabsView = props => {
     return tab.value === tabsState[0].value;
   };
   return /*#__PURE__*/React__default.createElement(Vertical, Object.assign({
-    width: "100w",
+    width: "100%",
     height: '100%'
-  }, styles == null ? void 0 : styles.container), /*#__PURE__*/React__default.createElement(Horizontal, Object.assign({
-    marginBottom: 20
-  }, styles == null ? void 0 : styles.headerTabs), tabs.map((tab, idx) => (/*#__PURE__*/React__default.createElement(Button, Object.assign({
+  }, styles == null ? void 0 : styles.container), /*#__PURE__*/React__default.createElement(Horizontal, Object.assign({}, styles == null ? void 0 : styles.headerTabs), tabs.map((tab, idx) => renderTab ? renderTab(tab, isContentActive(tab), idx) : (/*#__PURE__*/React__default.createElement(Button, Object.assign({
     key: tab.title,
     onClick: () => {
       moveSelectedTabToTop(idx);
@@ -7711,11 +7711,12 @@ var TabsView = props => {
     variant: isActive.value === tab.value ? 'filled' : 'ghost',
     shape: "pillShaped",
     cursor: "pointer",
-    isAuto: true
+    isAuto: true,
+    margin: 10
   }, styles == null ? void 0 : styles.tab, isActive.value === tab.value ? styles == null ? void 0 : styles.activeTab : {}), /*#__PURE__*/React__default.createElement(Text, Object.assign({}, styles == null ? void 0 : styles.title, isActive.value === tab.value ? styles == null ? void 0 : styles.activeText : {}), tab.title))))), /*#__PURE__*/React__default.createElement(View, Object.assign({
     width: '100%',
     height: "100%"
-  }, styles == null ? void 0 : styles.content), tabsState.map((tab, idx) => isContentActive(tab) && /*#__PURE__*/React__default.createElement(View, {
+  }, styles == null ? void 0 : styles.content), tabsState.map(renderContent ? renderContent : (tab, idx) => isContentActive(tab) && /*#__PURE__*/React__default.createElement(View, {
     key: idx
   }, tab.content))));
 };