Layout Toggle does not work

Radzen.Blazor Components
1

Hi guys, I have blazor wasm standalone application but for some reason toggle does not work on the layout, any ideas what to change ?
Thanks in advance!
index.html

<head>
    <RadzenTheme Theme="material" @rendermode="@RenderMode.InteractiveWebAssembly" />
</head>

MainLayout

@inherits LayoutComponentBase
<RadzenComponents @rendermode="@RenderMode.InteractiveWebAssembly" />
<HeadContent>
    <RadzenTheme Theme="material" @rendermode="@RenderMode.InteractiveWebAssembly" />
</HeadContent>

<RadzenComponents />

<AuthorizeView>
    <Authorized>
        <RadzenLayout>
            <RadzenHeader>
                <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Gap="0">
                    <RadzenSidebarToggle Click="@(() => sidebarExpanded = !sidebarExpanded)" />
                    <WASM.Components.CultureSelector />
                </RadzenStack>
            </RadzenHeader>
            <RadzenSidebar Responsive="false" Style="width: max-content">
                <RadzenPanelMenu class="font-awesome" Style="--rz-icon-size: 2rem;" DisplayStyle="@(sidebarExpanded ? MenuItemDisplayStyle.IconAndText : MenuItemDisplayStyle.Icon)" ShowArrow="false">
                    <MainLayoutItems />
                </RadzenPanelMenu>
            </RadzenSidebar>
            <RadzenBody>
                <div class="rz-p-4">
                    @Body
                </div>
            </RadzenBody>
        </RadzenLayout>
    </Authorized>
</AuthorizeView>


@code {
    bool sidebarExpanded = true;
}
2

Most probably your page/app is not interactive - i.e. you will unable to handle simple button click event or any other events.

3

This is whats inside the App, should i add InteractiveWebAssembly in some other place :? Button clicks works for example simple counter with RadzenButton works perfectly.
Maybe something else needs setup

<Router AppAssembly="@typeof(App).Assembly" @rendermode="RenderMode.InteractiveWebAssembly">
    <Found Context="routeData">
        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
        <FocusOnNavigate RouteData="@routeData" Selector="h1" />
    </Found>
    <NotFound>
        <PageTitle>Not found</PageTitle>
        <LayoutView Layout="@typeof(MainLayout)">
            <p role="alert">Sorry, there's nothing at this address.</p>
        </LayoutView>
    </NotFound>
</Router>


@inherits LayoutComponentBase
<RadzenComponents @rendermode="@RenderMode.InteractiveWebAssembly" />

<HeadContent>
    <RadzenTheme Theme="material"  />
</HeadContent>

<RadzenComponents />

<AuthorizeView>
    <Authorized>
        <RadzenLayout>
            <RadzenHeader>
                <RadzenStack Orientation="Orientation.Horizontal" JustifyContent="JustifyContent.SpaceBetween" AlignItems="AlignItems.Center" Gap="0">
                        <RadzenSidebarToggle Click="@(() => sidebarExpanded = !sidebarExpanded)" />
                        <WASM.Components.LangSelector />
                </RadzenStack>
            </RadzenHeader>
            <RadzenSidebar Responsive="false" Style="width: max-content">
                <RadzenPanelMenu class="font-awesome" Style="--rz-icon-size: 2rem;" DisplayStyle="@(sidebarExpanded ? MenuItemDisplayStyle.IconAndText : MenuItemDisplayStyle.Icon)" ShowArrow="false">
                    <MainLayoutItems />
                </RadzenPanelMenu>
            </RadzenSidebar>
            <RadzenBody>
                <div class="rz-p-4">
                    @Body
                </div>
            </RadzenBody>
        </RadzenLayout>
    </Authorized>
</AuthorizeView>

<AuthorizeView>
    <NotAuthorized>
        <LoginPage />
    </NotAuthorized>
</AuthorizeView>

<style>
    .rz-body {
        padding: 0 !important;
    }
</style>

@code {
    bool sidebarExpanded = true;
}
4

Pull our demos from GitHub, open them locally and compare to your implementation.

5

WASM standalone applications do not rely on @rendermode - it is only for hosted applications.

The Expanded parameter of RadzenSidebar is not set - it will never toggle this way. It should be set to sidebarExpanded flag. Check the layout demos for a working implementation: Blazor Layout Component | Free UI Components by Radzen

<RadzenLayout>
    <RadzenHeader>
        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Gap="0">
            <RadzenSidebarToggle Click="@(() => sidebar1Expanded = !sidebar1Expanded)" />
            <RadzenLabel Text="Header" />
        </RadzenStack>
    </RadzenHeader>
    <RadzenSidebar @bind-Expanded="@sidebar1Expanded">
        <RadzenPanelMenu>
            <RadzenPanelMenuItem Text="Home" Icon="home" />
            <RadzenPanelMenuItem Text="Users" Icon="account_box" />
        </RadzenPanelMenu>

    </RadzenSidebar>