MASA.Blazor/docs/Masa.Docs.Shared/Shared/Settings.razor

@inject I18n I18n
@inject MasaBlazor MasaBlazor
@inject LocalStorage LocalStorage

<MNavigationDrawer Value="Value"
                   ValueChanged="ValueChanged"
                   Fixed
                   Color="surface"
                   Right="!MasaBlazor.RTL"
                   Temporary
                   HideOverlay
                   Touchless
                   Width="349">
    <PrependContent>
        <MToolbar Class="m-bar--underline" Color="surface" Flat Height="96">
            <h3>
                @I18n.T("settings")
            </h3>
        </MToolbar>
    </PrependContent>
    <ChildContent>
        <MContainer>
            <div>
                <div class="font-weight-black ps-1 mb-2">@I18n.T("direction")</div>
                <MItemGroup Value="@MasaBlazor.RTL.ToString()" ActiveClass="primary">
                    <MRow>
                        <MCol Cols="6">
                            <MItem Value="@("False")">
                                <MButton Block Large Depressed Class="@($"justify-space-between {context.ActiveClass}")"
                                         OnClick="() => ToggleRtl(false)">
                                    LTR
                                    <MIcon Right>M21,18L17,14V17H5V19H17V22M9,10V15H11V4H13V15H15V4H17V2H9A4,4 0 0,0
                                        5,6A4,4 0 0,0 9,10Z
                                    </MIcon>
                                </MButton>
                            </MItem>
                        </MCol>
                        <MCol Cols="6">
                            <MItem Value="@("True")">
                                <MButton Block Large Depressed Class="@($"justify-space-between {context.ActiveClass}")"
                                         OnClick="() => ToggleRtl(true)">
                                    RTL
                                    <MIcon Right>M8,17V14L4,18L8,22V19H20V17M10,10V15H12V4H14V15H16V4H18V2H10A4,4 0 0,0
                                        6,6A4,4 0 0,0 10,10Z
                                    </MIcon>
                                </MButton>
                            </MItem>
                        </MCol>
                    </MRow>
                </MItemGroup>
            </div>
            @if (Project == "blazor")
            {
                <MDivider Class="my-4"/>
                <div class="d-flex align-center justify-space-between">
                    <div class="flex">
                        <MBadge Color="green" Dot Inline>
                            <MLabel>@I18n.T("nav-component-group-by-type")</MLabel>
                        </MBadge>
                        <div class="m-messages">@I18n.T("nav-component-group-by-type-desc")</div>
                    </div>
                    <NavComponentsTypeSwitch Config="@Config" ConfigChanged="@ConfigChanged"/>
                </div>
            }
        </MContainer>
    </ChildContent>
</MNavigationDrawer>

@code {

    [CascadingParameter(Name = "project")]
    private string? Project { get; set; }

    [Parameter]
    public bool? Value { get; set; }

    [Parameter]
    public EventCallback<bool?> ValueChanged { get; set; }

    [Parameter]
    public Config? Config { get; set; }

    [Parameter]
    public EventCallback<Config?> ConfigChanged { get; set; }

    private void ToggleRtl(bool rtl)
    {
        if (rtl == MasaBlazor.RTL)
        {
            return;
        }

        MasaBlazor.RTL = rtl;

        _ = LocalStorage.SetItemAsync("masablazor@rtl", rtl ? "rtl" : "ltr");
    }

}