Drawer

Um painel lateral para navegação ou detalhes. Pode flutuar sobre a página, fechar com Esc ou ficar como um trilho estreito de ícones quando fechado.

Por que ajuda

• Temporário ou permanente
• Opção de trilho de ícones
• Foco tratado para você

Onde se encaixa

• Navegação principal
• Filtros
• Painéis de detalhes

Exemplo

<Button OnClick="() => _open = true">Open drawer</Button>

<Drawer @bind-Open="_open" Title="Navigation">
    <Stack Direction="StackDirection.Column" Spacing="1">
        <Button Variant="Variant.Text">Dashboard</Button>
        <Button Variant="Variant.Text">Settings</Button>
    </Stack>
</Drawer>

@code {
    private bool _open;
}

Um pequeno trecho. Adicione @using RayCraft.Blazor.Components à sua página e use um modo de renderização interativo.

Incluído no RayCraft Free. Há exemplos funcionais no repositório do GitHub (MIT); ele contém código de exemplo e demonstração, não o código da biblioteca.

Todos os controles · Documentação