AppBar

Puts its children in the app bar of the AppLayout (or any layout that supports it).

@solara.component
def AppBar(children=[]):

    ...

This component does not need to be a direct child of the AppLayout, it can be at any level in your component tree.

If a Tabs component is used as direct child of the app bar, it will be shown under the app bar.

Example showing an app bar

import solara

@solara.component
def Page():
    logged_in, set_logged_in = solara.use_state(False)
    def toggle_login():
        set_logged_in(not logged_in)

    with solara.AppBar():
        icon_name = "mdi-logout" if logged_in else "mdi-login"
        solara.Button(icon_name=icon_name , on_click=toggle_login, icon=True)
    with solara.Column():
        if logged_in:
            solara.Info("You are logged in")
        else:
            solara.Error("You are logged out")

You are logged out

Live output

AppBar

Example showing an app bar