diff --git a/src/myfasthtml/assets/myfasthtml.css b/src/myfasthtml/assets/myfasthtml.css
index a141178..b7e38d6 100644
--- a/src/myfasthtml/assets/myfasthtml.css
+++ b/src/myfasthtml/assets/myfasthtml.css
@@ -327,7 +327,7 @@
align-items: center;
width: 100%;
- overflow: hidden; /* important */
+ /*overflow: hidden; important */
}
/* Individual Tab Button using DaisyUI tab classes */
diff --git a/src/myfasthtml/controls/TabsManager.py b/src/myfasthtml/controls/TabsManager.py
index 74f4499..6d42d7b 100644
--- a/src/myfasthtml/controls/TabsManager.py
+++ b/src/myfasthtml/controls/TabsManager.py
@@ -272,6 +272,30 @@ class TabsManager(MultipleInstance):
None,
True))
+ def _mk_tabs_controller(self):
+ return Div(
+ Div(id=f"{self._id}-content-controller", data_active_tab=f"{self._state.active_tab}"),
+ Script(f'updateTabs("{self._id}-content-controller");'),
+ )
+
+ def _mk_tabs_header(self, oob=False):
+ # Create visible tab buttons
+ visible_tab_buttons = [
+ self._mk_tab_button(tab_id, self._state.tabs[tab_id])
+ for tab_id in self._state.tabs_order
+ if tab_id in self._state.tabs
+ ]
+
+ header_content = [*visible_tab_buttons]
+
+ return Div(
+ Div(*header_content, cls="mf-tabs-header", id=f"{self._id}-header"),
+ self._mk_show_tabs_menu(),
+ id=f"{self._id}-header-wrapper",
+ cls="mf-tabs-header-wrapper",
+ hx_swap_oob="true" if oob else None
+ )
+
def _mk_tab_button(self, tab_id: str, tab_data: dict, in_dropdown: bool = False):
"""
Create a single tab button with its label and close button.
@@ -306,38 +330,6 @@ class TabsManager(MultipleInstance):
data_manager_id=self._id
)
- def _mk_tabs_header(self, oob=False):
- # Create visible tab buttons
- visible_tab_buttons = [
- self._mk_tab_button(tab_id, self._state.tabs[tab_id])
- for tab_id in self._state.tabs_order
- if tab_id in self._state.tabs
- ]
-
- header_content = [*visible_tab_buttons]
-
- return Div(
- Div(*header_content, cls="mf-tabs-header", id=f"{self._id}-header"),
- self._mk_show_tabs_menu(),
- id=f"{self._id}-header-wrapper",
- cls="mf-tabs-header-wrapper",
- hx_swap_oob="true" if oob else None
- ),
-
- def _mk_tabs_controller(self):
- return Div(
- Div(id=f"{self._id}-content-controller", data_active_tab=f"{self._state.active_tab}"),
- Script(f'updateTabs("{self._id}-content-controller");'),
- )
-
- def _mk_tab_content(self, tab_id: str, content):
- is_active = tab_id == self._state.active_tab
- return Div(
- content if content else Div("No Content", cls="mf-empty-content"),
- cls=f"mf-tab-content {'hidden' if not is_active else ''}", # ← ici
- id=f"{self._id}-{tab_id}-content",
- )
-
def _mk_tab_content_wrapper(self):
"""
Create the active tab content area.
@@ -357,6 +349,14 @@ class TabsManager(MultipleInstance):
id=f"{self._id}-content-wrapper",
)
+ def _mk_tab_content(self, tab_id: str, content):
+ is_active = tab_id == self._state.active_tab
+ return Div(
+ content if content else Div("No Content", cls="mf-empty-content"),
+ cls=f"mf-tab-content {'hidden' if not is_active else ''}", # ← ici
+ id=f"{self._id}-{tab_id}-content",
+ )
+
def _mk_show_tabs_menu(self):
return Div(
mk.icon(tabs24_regular,
@@ -365,6 +365,8 @@ class TabsManager(MultipleInstance):
role="button",
cls="btn btn-xs"),
Div(
+ Div("content"),
+ Div("content"),
Div("content"),
tabindex="-1",
cls="dropdown-content menu w-52 rounded-box bg-base-300 shadow-xl"