Components

Menu

Basics

The Menu component creates a menu based on MenuManager or the provided menu items.

make(?iterable $elements = [])
make(?iterable $elements = [])
  • $elements - set of menu items; if it is empty, it will take MenuManager as the basis.
 namespaces
use MoonShine\MenuManager\MenuItem;
use MoonShine\UI\Components\Layout\Menu;
 
Menu::make([
MenuItem::make('Item', '/')
]);
 namespaces
use MoonShine\MenuManager\MenuItem;
use MoonShine\UI\Components\Layout\Menu;
 
Menu::make([
MenuItem::make('Item', '/')
]);
<x-moonshine::layout.menu
:elements="[['label' => 'Dashboard', 'url' => '/'], ['label' => 'Section', 'url' => '/section']]"
:top="false"
:scroll-to="false" />
<x-moonshine::layout.menu
:elements="[['label' => 'Dashboard', 'url' => '/'], ['label' => 'Section', 'url' => '/section']]"
:top="false"
:scroll-to="false" />

You can also initialize the menu through a primitive array.

Menu::make([
['label' => 'Dashboard', 'url' => '/'],
['label' => 'Section', 'url' => '/section'],
])
Menu::make([
['label' => 'Dashboard', 'url' => '/'],
['label' => 'Section', 'url' => '/section'],
])

Horizontal Menu Mode

If you decide to place the menu in a horizontal mode in the TopBar, use the top() method.

Menu::make()->top()
Menu::make()->top()

Scroll to Active Item

By default, if the menu is not in top mode, it scrolls to the active menu item. This behavior can be disabled using the withoutScrollTo() method.

Menu::make()->withoutScrollTo()
Menu::make()->withoutScrollTo()

To enable it back:

Menu::make()->scrollTo()
Menu::make()->scrollTo()