Tpk Dashboard

A full-page dashboard layout combining a navbar and collapsible sidebar.

Examples

Basic usage

Welcome!

This is the main content area.

My App

Properties

Name Type Required Description
@title string No Application title displayed in the navbar.
@sidebarItems SidebarItem[] No Array of sidebar navigation items (links or groups).
@navbarItems NavbarItem[] No Array of navbar navigation items.
@currentUser { fullName: string } No Current user object with a fullName property for the profile menu.
@onLogout Function No Callback called when the user clicks the logout button.
@logoutLabel string No Label for the logout button.
@profileRoute string No Route name for the profile link.
@profileLabel string No Label for the profile link.
@drawerId string No ID of the drawer input element. Defaults to 'tpk-dashboard-drawer'.
@collapsed boolean No Controls the collapsed state of the sidebar.
@onCollapsedChange Function No Callback called when the sidebar collapsed state changes.
@onSidebarToggle Function No Callback called when the sidebar toggle button is clicked.
@languages Language[] No Array of available languages with code and label.
@onLocaleChange Function No Callback called when the user selects a different language.