diff --git a/src/app.py b/src/app.py index 13b8860..fde56f7 100644 --- a/src/app.py +++ b/src/app.py @@ -37,9 +37,11 @@ def index(session): command=layout.commands.toggle_drawer("right"), id="btn_show_right_drawer_id") - btn_show_instances_debugger = mk.icon(volume_object_storage, - command=tabs_manager.commands.add_tab("Instances", instances_debugger), - id=instances_debugger.get_id()) + btn_show_instances_debugger = mk.label("Instances", + icon=volume_object_storage, + command=tabs_manager.commands.add_tab("Instances", instances_debugger), + id=instances_debugger.get_id()) + layout.header_left.add(tabs_manager.add_tab_btn()) layout.header_right.add(btn_show_right_drawer) layout.left_drawer.add(btn_show_instances_debugger) diff --git a/src/myfasthtml/assets/myfasthtml.css b/src/myfasthtml/assets/myfasthtml.css index 6cb475b..eca1506 100644 --- a/src/myfasthtml/assets/myfasthtml.css +++ b/src/myfasthtml/assets/myfasthtml.css @@ -2,20 +2,19 @@ --color-border-primary: color-mix(in oklab, var(--color-primary) 40%, #0000); } + +.mf-icon-16 { + width: 16px; + min-width: 16px; + height: 16px; + margin-top: auto; +} + .mf-icon-20 { width: 20px; min-width: 20px; height: 20px; margin-top: auto; - margin-bottom: auto; -} - -.mf-icon-16 { - width: 16px; - min-width: 16px; - height: 16px; - margin-top: auto; - margin-bottom: 4px; } .mf-icon-24 { @@ -23,7 +22,14 @@ min-width: 24px; height: 24px; margin-top: auto; - margin-bottom: 4px; + +} + +.mf-icon-28 { + width: 28px; + min-width: 28px; + height: 28px; + margin-top: auto; } .mf-icon-32 { @@ -31,7 +37,6 @@ min-width: 32px; height: 32px; margin-top: auto; - margin-bottom: 4px; } /* diff --git a/src/myfasthtml/controls/helpers.py b/src/myfasthtml/controls/helpers.py index 7a94d00..0d90568 100644 --- a/src/myfasthtml/controls/helpers.py +++ b/src/myfasthtml/controls/helpers.py @@ -41,6 +41,27 @@ class mk: return mk.mk(Div(icon, cls=merged_cls, **kwargs), command=command, binding=binding) + @staticmethod + def label(text: str, + icon=None, + size: str = "sm", + cls='', + command: Command = None, + binding: Binding = None, + **kwargs): + merged_cls = merge_classes("flex", cls, kwargs) + icon_part = Span(icon, cls=f"mf-icon-{mk.convert_size(size)} mr-1") if icon else None + text_part = Span(text, cls=f"text-{size}") + return mk.mk(Label(icon_part, text_part, cls=merged_cls, **kwargs), command=command, binding=binding) + + @staticmethod + def convert_size(size: str): + return (size.replace("xs", "16"). + replace("sm", "20"). + replace("md", "24"). + replace("lg", "28"). + replace("xl", "32")) + @staticmethod def manage_command(ft, command: Command): if command: diff --git a/src/myfasthtml/core/instances_helper.py b/src/myfasthtml/core/instances_helper.py index 533e793..916381b 100644 --- a/src/myfasthtml/core/instances_helper.py +++ b/src/myfasthtml/core/instances_helper.py @@ -1,12 +1,22 @@ +import logging + +from myfasthtml.controls.InstancesDebugger import InstancesDebugger from myfasthtml.controls.VisNetwork import VisNetwork from myfasthtml.controls.helpers import Ids -from myfasthtml.core.instances import BaseInstance +from myfasthtml.core.instances import BaseInstance, InstancesManager + +logger = logging.getLogger("InstancesHelper") class InstancesHelper: @staticmethod def dynamic_get(parent: BaseInstance, component_type: str, instance_id: str): if component_type == Ids.VisNetwork: - return VisNetwork(parent, _id=instance_id) + return InstancesManager.get(parent.get_session(), instance_id, + VisNetwork, parent=parent, _id=instance_id) + elif component_type == Ids.InstancesDebugger: + return InstancesManager.get(parent.get_session(), instance_id, + InstancesDebugger, parent.get_session(), parent, instance_id) + logger.warning(f"Unknown component type: {component_type}") return None