---
name: MagaVerticalMenu
route: /components/maga-vertical-menu
menu: Components ⚡️
---

import { Playground } from "docz";
import MagaVerticalMenu from "../index.tsx";

# MagaVerticalMenu

Menu vertical padrão

## Props

Nenhuma

## Uso básico

<Playground>
  <MagaVerticalMenu
    items={[
      {
        label: "Home",
        icon: "wpforms",
        route: "/",
        roles: ["rlPcpAdministrador"],
        userRoles: ["rlPcpAdministrador"],
        permissions: ["aHomePcp"],
        userPermissions: ["aHomePcp"],
      },
      {
        label: "Cadastros",
        subLabel: "Registre todos os itens",
        icon: "wpforms",
        roles: ["rlPcpAdministrador"],
        userRoles: ["rlPcpAdministrador"],
        permissions: ["aCadastrosPcp"],
        userPermissions: ["aCadastrosPcp"],
        items: [
          {
            label: "Lotes x Modalidades",
            icon: "wpforms",
            route: "/cadastros/lotes-x-modalidades/",
            roles: ["rlPcpAdministrador"],
            userRoles: ["rlPcpAdministrador"],
            permissions: ["aLotesXModalidadesCadastrosPcp"],
            userPermissions: ["aLotesXModalidadesCadastrosPcp"],
          },
        ],
      },
    ]}
  />
</Playground>