mirror of
https://github.com/vale981/Vulcan
synced 2025-03-10 12:36:39 -04:00
99 lines
No EOL
2.2 KiB
Markdown
99 lines
No EOL
2.2 KiB
Markdown
# Menu Component
|
|
|
|
This is a component for generating flexible, nestable menus. It can generates nested menus from a flat list with node `id`s and `parentId`s.
|
|
|
|
### Usage
|
|
|
|
Just include the `menuComponent` template while passing the necessary arguments:
|
|
|
|
```
|
|
{{> menuComponent menuItems=menuItems}}
|
|
```
|
|
|
|
### Arguments
|
|
|
|
##### `menuItems` (Array) [required]
|
|
|
|
An array containing the menu's contents (see below).
|
|
|
|
##### `menuName` (String)
|
|
|
|
The name of the menu. Used to set a `*name*-menu` CSS class on the menu.
|
|
|
|
##### `menuLabel` (String)
|
|
|
|
The menu title label.
|
|
|
|
##### `menuLabelTemplate` (String)
|
|
|
|
If provided, will replace the menu label with a custom template.
|
|
|
|
##### `menuClass` (String)
|
|
|
|
An optional CSS class given to the menu
|
|
|
|
##### `itemTemplate` (String)
|
|
|
|
A custom template used to display individual menu items (defaults to "defaultMenuItem")
|
|
|
|
### Menu Items Properties
|
|
|
|
Menu items can have the following properties:
|
|
|
|
##### `label` (String/Function)
|
|
|
|
The menu item's label, or a function that returns a label.
|
|
|
|
##### `route` (String/Function)
|
|
|
|
Either the name of a route to which the menu item should point, or a function that returns a route.
|
|
|
|
If a route is provided, the class `item-active` will automatically be added to the menu item when its route is the currently active one.
|
|
|
|
##### `data` (Object)
|
|
|
|
The data context for the item.
|
|
|
|
##### `itemClass` (String)
|
|
|
|
The menu item's CSS class.
|
|
|
|
##### `template` (String)
|
|
|
|
An optional custom template. Overrides both the default template and the `itemTemplate` menu-level option.
|
|
|
|
##### `isHidden` (Function)
|
|
|
|
If this function returns `true`, the menu item will not be shown.
|
|
|
|
### Nested Menu Items Properties
|
|
|
|
Additionally, menu items take a few additional properties to generate nested menus.
|
|
|
|
##### `_id` (String)
|
|
|
|
A unique id used for arranging nodes in nested menus.
|
|
|
|
##### `parentId` (String)
|
|
|
|
The parent node's id.
|
|
|
|
##### `isExpanded` (Boolean)
|
|
|
|
Whether the item's sub-menu should be expanded
|
|
|
|
### The Menu Item Template
|
|
|
|
The menu item template is called with the following data context:
|
|
|
|
##### `menu` (Object)
|
|
|
|
A reference pointing back to the menu object.
|
|
|
|
#### `level` (Number)
|
|
|
|
The current nesting level.
|
|
|
|
#### `item` (Object)
|
|
|
|
The current item to display. |