Componente

Sidebar Menu

Menú lateral con soporte de submenús de 2 niveles, estado activo y cierre en móvil.

{% comp_sidebar_menu ... %}

Código a utilizar

template.html
{% comp_sidebar_menu menu_items=[{"title": "Dashboard", "icon": "HomeIcon", "url": "#", "active": true}, {"title": "Reportes", "icon": "ChartBarIcon", "url": "#", "active": false, "children": [{"title": "Ventas", "url": "#"}, {"title": "Empleados", "url": "#"}, {"title": "Financiero", "url": "#"}]}, {"title": "Usuarios", "icon": "UsersIcon", "url": "#", "active": false}, {"title": "Ajustes", "icon": "Cog6ToothIcon", "url": "#", "active": false}] is_open=True id="preview-demo" title="Mi App" classes="min-h-[320px]" %}

Vista previa en vivo

API Props & Playground

Los cambios actualizan la vista previa en tiempo real
Prop Valor
menu_items
None
4 elementos
is_open
True
id
'main'
title
''
footer_text
''
classes
''

Carga la librería con {% load components_ui %} antes de usar el componente.